/* Research mapping onto the shared Elite PM chrome (shared/harness.css). Loaded last. */
@import url('../shared/harness.css');

:root:not([data-theme="light"]) {
  /* Remap the editorial + reader palettes the report content is built from. */
  --ink: var(--hx-text);
  --ink-2: var(--hx-soft);
  --muted: var(--hx-muted);
  --paper: var(--hx-bg);
  --surface: var(--hx-surface);
  --line: var(--hx-line);
  --line-strong: var(--hx-line-strong);
  --orange: var(--hx-accent);
  --orange-soft: var(--hx-accent-soft);
  --blue: #8fb3e6;
  --blue-soft: #1f2732;
  --teal: #7cc7bb;
  --teal-soft: #1b2b29;
  --violet: #b9a6e6;
  --violet-soft: #28233a;
  --green: #92c7a3;
  --green-soft: #1e2b22;
  --research-ink: var(--hx-text);
  --research-muted: var(--hx-muted);
  --research-paper: var(--hx-bg);
  --research-surface: var(--hx-surface);
  --research-line: var(--hx-line);
  --research-line-strong: var(--hx-line-strong);
  --research-accent: var(--hx-accent);
  --research-complete: #1f3a31;
}

body[data-research-shell] {
  color: var(--hx-text);
  background: var(--hx-bg);
  font-family: var(--hx-sans);
}

/* ---------- Session rail ---------- */
body[data-research-shell] .research-rail {
  overflow-y: auto;
  padding: 24px 14px 24px;
  background: var(--hx-bg);
  border-right: 1px solid var(--hx-line);
}
.research-rail-head { align-items: center; margin-bottom: 10px; padding: 0 2px; }
.research-rail-head .hx-rail-title { margin: 0; }
body[data-research-shell] .research-track-links { display: none; }
.hx-rail-home {
  display: block;
  margin-bottom: 4px;
  padding: 12px 16px;
  color: var(--hx-soft);
  border-radius: 10px;
  font: 500 .95rem/1.4 var(--hx-sans);
  text-decoration: none;
}
.hx-rail-home:hover { background: var(--hx-raised); }
body[data-research-shell]:has(.research-shell-library) .hx-rail-home { color: var(--hx-accent); background: var(--hx-raised); }

/* The whole rail scrolls as one list (legacy CSS clipped it with overflow: hidden). */
body[data-research-shell] .research-session-nav { flex: none; gap: 2px; overflow: visible; }
body[data-research-shell] .research-session-link {
  grid-template-columns: minmax(0, 1fr) 14px;
  min-height: 0;
  padding: 11px 16px;
  color: var(--hx-soft);
  border-radius: 10px;
}
body[data-research-shell] .research-session-link:hover { background: var(--hx-raised); }
body[data-research-shell] .research-session-link[aria-current="page"] { color: var(--hx-accent); background: var(--hx-raised); box-shadow: none; }
body[data-research-shell] .research-session-number { display: none; }
body[data-research-shell] .research-session-title { font: 500 .95rem/1.45 var(--hx-sans); white-space: normal; }
body[data-research-shell] .research-session-state { color: var(--hx-accent); }
body[data-research-shell] .research-session-nav:empty::before { content: "No matching reports"; padding: 12px 16px; color: var(--hx-muted); font-size: .9rem; }

body[data-research-shell] .research-progress-card {
  flex: 0 0 auto;
  margin: 16px 2px 0;
  background: var(--hx-surface);
  border-color: var(--hx-line);
}

/* Research scrolls inside .research-workspace, so the TOC sticks to the pane top. */
@media (min-width: 1181px) {
  body[data-research-shell] .hx-toc { top: 0; max-height: calc(100vh - var(--hx-top)); padding-top: 64px; }
}

/* Report typography: serif display headings, comfortable sans body. */
body[data-research-shell] .reader-main .hero {
  padding: 72px 0 36px !important;
  color: var(--hx-text);
  background: none;
  border: 0;
}
body[data-research-shell] .reader-main .hero h1 {
  max-width: 100% !important;
  color: var(--hx-title);
  font: 500 clamp(2.6rem, 4.6vw, 4.2rem)/1.08 var(--hx-serif) !important;
  letter-spacing: -.02em;
}
body[data-research-shell] .reader-main .eyebrow,
body[data-research-shell] .reader-main .section-kicker { color: var(--hx-accent); }
body[data-research-shell] .reader-main .hero-deck { color: var(--hx-soft); font: 400 1.15rem/1.7 var(--hx-sans); }
body[data-research-shell] .reader-main .hero-meta > div { background: var(--hx-surface); border-color: var(--hx-line); }
body[data-research-shell] .reader-main .content { width: 100%; padding: 0 0 64px; }
body[data-research-shell] .reader-main .section {
  max-width: 760px;
  margin: 0 0 56px;
  padding-top: 40px;
  border-top: 1px solid var(--hx-line);
}
body[data-research-shell] .reader-main .section h2 { color: var(--hx-text); font-family: var(--hx-serif); font-weight: 500; }
body[data-research-shell] .reader-main .section h3 { color: var(--hx-text); font-family: var(--hx-serif); font-weight: 500; }
body[data-research-shell] .reader-main .section p,
body[data-research-shell] .reader-main .section li { color: var(--hx-soft); font-family: var(--hx-sans); }
body[data-research-shell] .reader-main .section strong { color: var(--hx-text); }
body[data-research-shell] .reader-main .section .lede { color: var(--hx-soft); }
body[data-research-shell] .reader-main .section a { color: var(--hx-accent); }
body[data-research-shell] .reader-main .quote { color: var(--hx-text); border-top-color: var(--hx-accent); border-bottom-color: var(--hx-line); }
body[data-research-shell] .reader-main th { color: var(--hx-text); background: var(--hx-raised); }
body[data-research-shell] .reader-main td { color: var(--hx-soft); }
body[data-research-shell] .reader-main .table-wrap,
body[data-research-shell] .reader-main table { background: var(--hx-surface); border-color: var(--hx-line); }
body[data-research-shell] .reader-main code { color: var(--hx-text); background: var(--hx-raised); border-radius: 4px; }
body[data-research-shell] .reader-main pre { color: var(--hx-text); background: var(--hx-surface); border-color: var(--hx-line); }

body[data-research-shell] .reader-nav { max-width: 760px; margin: 0; padding: 0 0 72px; }
body[data-research-shell] .reader-nav a { color: var(--hx-text); border: 1px solid var(--hx-line); border-radius: 12px; }
body[data-research-shell] .reader-nav a:hover { border-color: var(--hx-muted); }
body[data-research-shell] .reader-nav small { color: var(--hx-muted); }

/* Library view inside the article column. */
body[data-research-shell] .library { width: 100%; padding: 72px 0 96px; }
body[data-research-shell] .library h1 { color: var(--hx-title); font: 500 clamp(2.6rem, 4.6vw, 4.2rem)/1.08 var(--hx-serif); }
body[data-research-shell] .library-intro { color: var(--hx-soft); font-family: var(--hx-sans); }
body[data-research-shell] .research-card { color: var(--hx-text); background: var(--hx-bg); }
body[data-research-shell] .research-card:hover { background: var(--hx-raised); }

body[data-research-shell] .reader-progress span { background: var(--hx-accent); }

@media (min-width: 901px) {
  body[data-research-shell] .research-reader-layout { grid-template-columns: 300px minmax(0, 1fr); height: calc(100vh - var(--hx-top)); }
  body[data-research-shell] .research-rail { width: 300px; height: 100%; }
  body[data-research-shell] .research-workspace { height: 100%; }
}

@media (max-width: 1180px) {
  body[data-research-shell] .reader-main .hero { padding-top: 40px !important; }
}

@media (max-width: 900px) {
  body[data-research-shell] .research-rail { top: 0; z-index: 150; padding-top: calc(16px + env(safe-area-inset-top)); }
  .research-rail-close { color: var(--hx-text); background: var(--hx-surface); border-color: var(--hx-line); }
  body[data-research-shell] .reader-main .hero { padding: 28px 0 24px !important; }
  body[data-research-shell] .reader-main .hero h1 { font-size: clamp(2.3rem, 10vw, 3.2rem) !important; }
  body[data-research-shell] .reader-main .content { padding: 0 !important; }
  body[data-research-shell] .library { padding: 0 0 104px; }
  body[data-research-shell] .research-timeline-item { border-color: var(--hx-line); }
  body[data-research-shell] .research-mobile-dock { background: var(--hx-surface); border-color: var(--hx-line); }
  body[data-research-shell] .research-mobile-dock .is-active { color: var(--hx-text); background: var(--hx-raised); }
  body[data-research-shell] .mobile-library-head { display: none; }
}


/* Library: the report list shows at every width, not only on phones. */
body[data-research-shell] .research-timeline { display: block; max-width: 760px; margin-top: 48px; border-top: 1px solid var(--hx-line); }
body[data-research-shell] .research-timeline-item {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr) 18px;
  gap: 16px;
  padding: 20px 4px;
  color: var(--hx-text);
  border-bottom: 1px solid var(--hx-line);
  text-decoration: none;
}
body[data-research-shell] .research-timeline-item:hover .timeline-copy h2 { color: var(--hx-accent); }
body[data-research-shell] .timeline-date { display: flex; flex-direction: column; gap: 4px; font-family: var(--hx-sans); }
body[data-research-shell] .timeline-date strong { color: var(--hx-text); font-size: .9rem; font-weight: 600; }
body[data-research-shell] .timeline-date span { color: var(--hx-muted); font-size: .78rem; }
body[data-research-shell] .timeline-copy h2 { margin: 0 0 4px; color: var(--hx-text); font: 500 1.35rem/1.2 var(--hx-serif); }
body[data-research-shell] .timeline-copy p { margin: 0; color: var(--hx-muted); font: 400 .9rem/1.4 var(--hx-sans); }
body[data-research-shell] .timeline-state { color: var(--hx-accent); }
@media (min-width: 901px) {
  body[data-research-shell] .research-feature {
    display: block;
    position: relative;
    max-width: 760px;
    min-height: 0;
    margin-top: 40px;
    padding: 28px;
    color: var(--hx-text);
    background: var(--hx-surface);
    border: 1px solid var(--hx-line);
    border-radius: 14px;
    text-decoration: none;
  }
  body[data-research-shell] .research-feature:hover { border-color: var(--hx-muted); }
  body[data-research-shell] .research-feature-art { display: none; }
  body[data-research-shell] .research-feature-date,
  body[data-research-shell] .research-feature-meta { color: var(--hx-muted); font: 600 .78rem/1.4 var(--hx-sans); }
  body[data-research-shell] .research-feature-number { margin-top: 6px; color: var(--hx-accent); font: 650 .75rem/1.4 var(--hx-sans); letter-spacing: .08em; text-transform: uppercase; }
  body[data-research-shell] .research-feature h2 { margin: 8px 0; color: var(--hx-title); font: 500 2rem/1.15 var(--hx-serif); }
  body[data-research-shell] .research-feature p { margin: 0 0 12px; color: var(--hx-soft); font: 400 1rem/1.5 var(--hx-sans); }
}

/* Neutralise the legacy rail TOC box now that the TOC lives on the right. */
body[data-research-shell] .research-section-nav.hx-toc { min-height: 0; margin-top: 0; border-top: 0; }
@media (max-width: 760px) {
  body[data-research-shell]:not(:has(.research-shell-library)) .reader-main .hero { padding: 28px 0 24px !important; }
}