/*
 * Xiaomai site theme bundle
 *
 * One shared visual layer for the functional pages. Page CSS owns structure;
 * this file owns tokens, common surfaces, navigation, interaction states, and
 * cross-page visual details.
 */

/* ===== merged from theme.css ===== */
:root {
  color-scheme: light;
  --chart-grid: #e2ded4;
  --chart-marker: #b9b2a4;
  --chart-tooltip: rgba(16, 35, 31, .95);
}

.attachment-source-sheet[hidden]{display:none}.attachment-source-sheet{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:20px}.attachment-source-backdrop{position:absolute;inset:0;border:0;background:rgba(4,12,10,.56);backdrop-filter:blur(3px)}.attachment-source-panel{position:relative;width:min(420px,100%);background:var(--card,#f9f7f0);color:var(--ink,#10231f);border:1px solid var(--line,#d4cec0);box-shadow:0 24px 80px rgba(0,0,0,.28);padding:14px}.attachment-source-panel>header{display:flex;flex-direction:column;gap:4px;padding:8px 8px 14px}.attachment-source-panel>header>b{font-size:18px}.attachment-source-panel>header>span{font-size:11px;color:var(--muted,#747d78)}.attachment-source-option{width:100%;min-height:72px;border:1px solid var(--line,#d4cec0);border-bottom:0;background:transparent;color:inherit;display:grid;grid-template-columns:42px 1fr 18px;align-items:center;gap:12px;padding:11px 13px;text-align:left;cursor:pointer}.attachment-source-option:hover{background:rgba(107,134,119,.09)}.attachment-source-option>i{width:38px;height:38px;border:1px solid var(--line,#d4cec0);border-radius:50%;display:grid;place-items:center;color:var(--red,#df5439);font-style:normal;font-size:18px}.attachment-source-option>span{display:flex;flex-direction:column;gap:4px}.attachment-source-option b{font-size:14px}.attachment-source-option small{color:var(--muted,#747d78);font-size:9px}.attachment-source-option>em{font-style:normal;font-size:22px;color:var(--muted,#747d78)}.attachment-source-cancel{width:100%;height:44px;border:1px solid var(--line,#d4cec0);background:transparent;color:var(--muted,#747d78);margin-top:10px;cursor:pointer}@media(max-width:700px){.attachment-source-sheet{place-items:end center;padding:12px}.attachment-source-panel{width:100%;padding:13px;border-radius:16px 16px 5px 5px}.attachment-source-option{min-height:74px}.attachment-source-cancel{height:48px}}

/* Segmented controls remove adjoining borders to avoid double lines. Restore
   the selected segment's trailing edge as an inset line without changing size. */
.mode-switch button.active,
.mode-switch button:hover,
.mode-switch button:focus-visible,
.severity-field input:checked + span,
.severity-field input:focus-visible + span,
.image-purpose button.active,
.image-purpose button:hover,
.image-purpose button:focus-visible {
  position: relative;
  z-index: 1;
  box-shadow: inset -1px 0 0 var(--ink);
}

/* The intake deck continues directly below the project bar. The project bar
   supplies the top rule; these three sides close the large collection frame. */
.intake-deck {
  border: 1px solid var(--line);
  border-top: 0;
}

/* Android WebView paints its native tap highlight as a square. Keep feedback
   inside the pill so the thinking switch never flashes a mismatched rectangle. */
.thinking-toggle {
  -webkit-tap-highlight-color: transparent;
  background-clip: padding-box;
  overflow: hidden;
  touch-action: manipulation;
}

.thinking-toggle:active {
  transform: scale(.98);
}

.thinking-picker {
  position: relative;
  flex: 0 0 auto;
}

.app-shell .composer > .thinking-picker {
  margin-inline-end: 8px;
}

.thinking-picker[hidden],
.thinking-menu[hidden] {
  display: none;
}

.thinking-toggle {
  min-width: 96px;
  margin-right: 0;
  white-space: nowrap;
}

.thinking-chevron {
  display: block;
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  margin: 0 1px 1px 2px;
  border-right: 1.6px solid currentColor;
  border-bottom: 1.6px solid currentColor;
  color: currentColor;
  transform: translateY(-1.5px) rotate(45deg);
  transition: transform .18s ease;
}

.thinking-picker.is-open .thinking-chevron {
  transform: translateY(-1.5px) rotate(225deg);
}

.vision-progress.is-indeterminate .vision-progress-bar {
  width: 42%;
  animation: visionProgressIndeterminate 1.35s ease-in-out infinite;
}

@keyframes visionProgressIndeterminate {
  0%, 100% { transform: translateX(-105%); }
  50% { transform: translateX(150%); }
}

@media (prefers-reduced-motion: reduce) {
  .vision-progress.is-indeterminate .vision-progress-bar {
    animation: none;
    transform: none;
  }
}

.thinking-menu {
  position: absolute;
  right: 0;
  bottom: calc(100% + 10px);
  z-index: 30;
  width: min(244px, calc(100vw - 28px));
  max-height: min(430px, calc(100dvh - 150px));
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  box-shadow: 0 16px 38px rgba(30, 33, 28, .2);
}

.thinking-option {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 9px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.thinking-option:hover,
.thinking-option:focus-visible {
  background: color-mix(in srgb, var(--sage) 12%, transparent);
  outline: none;
}

.thinking-option[aria-checked="true"] {
  background: color-mix(in srgb, var(--sage) 18%, transparent);
}

.thinking-option-mark {
  width: 17px;
  flex: 0 0 17px;
  color: var(--sage);
  font: 700 14px/1.2 "DM Mono", monospace;
  text-align: center;
}

.thinking-option-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.thinking-option-label {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
}

.thinking-option-description {
  color: var(--muted);
  font: 9px/1.45 "DM Mono", monospace;
}

html[data-theme="dark"] {
  & {
    color-scheme: dark;
    --ink: #e7ece8;
    --ink-2: #183129;
    --ink2: #183129;
    --paper: #0c1513;
    --card: #121f1b;
    --line: #304139;
    --muted: #a3ada6;
    --accent: #ed7357;
    --red: #ed7357;
    --green: #56ad88;
    --gold: #d7ac60;
    --sage: #8ca89b;
    --medical: #57a98a;
    --blue: #78a5ae;
    --shadow: 0 18px 48px rgba(0, 0, 0, .32);
    --chart-grid: #2c3d37;
    --chart-marker: #52625c;
    --chart-tooltip: rgba(7, 17, 14, .97);
  }

  &,
  body {
    background: var(--paper);
    color: var(--ink);
  }

  body {
    scrollbar-color: #40534b #0c1513;
  }

  input,
  textarea,
  select,
  button {
    color-scheme: dark;
  }

  input::placeholder,
  textarea::placeholder {
    color: #718078;
    opacity: 1;
  }

  .paper-noise {
    opacity: .055;
    filter: invert(1);
  }

  .market-grid,
  .archive-grid,
  .clinical-grid {
    background-image:
      linear-gradient(rgba(218, 231, 222, .035) 1px, transparent 1px),
      linear-gradient(90deg, rgba(218, 231, 222, .035) 1px, transparent 1px);
  }

  /* Shared navigation */
  .site-nav,
  .finance-nav,
  .research-nav,
  .health-nav {
    background: rgba(12, 21, 19, .94);
    border-color: rgba(48, 65, 57, .9);
    box-shadow: 0 10px 32px rgba(0, 0, 0, .14);
  }

  .site-nav nav a,
  .finance-nav nav a,
  .research-nav nav a,
  .health-nav nav a {
    color: var(--muted);
  }

  .site-nav nav a:hover,
  .site-nav nav a.active,
  .finance-nav nav a:hover,
  .finance-nav nav a.active,
  .research-nav nav a:hover,
  .research-nav nav a.active,
  .health-nav nav a:hover,
  .health-nav nav a.active {
    color: var(--ink);
  }

  /* Mobile navigation sheet */
  @media (max-width: 900px) {
    .site-nav nav.site-nav-menu {
      background: linear-gradient(145deg, rgba(18, 34, 29, .98), rgba(11, 23, 19, .98));
      border-color: rgba(72, 93, 82, .92);
      box-shadow: 0 20px 44px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(218, 231, 222, .06);
    }

    .site-nav nav.site-nav-menu a {
      background: transparent;
      border-color: transparent;
      color: var(--muted);
    }

    .site-nav nav.site-nav-menu a:hover,
    .site-nav nav.site-nav-menu a:focus-visible {
      background: rgba(140, 168, 155, .1);
      border-color: transparent;
      color: var(--ink);
    }

    .site-nav nav.site-nav-menu a.active {
      background: rgba(237, 115, 87, .14);
      border-color: transparent;
      color: #fff;
    }
  }

  /* Chat */
  .sidebar {
    background: #0e1916;
  }

  .new-chat:hover {
    background: #e7ece8;
    color: #10231f;
  }

  .finance-entry:hover,
  .conversation-item:hover,
  .conversation-item.active {
    background: #192621;
  }

  .conversation-item {
    color: #a0aaa4;
  }

  .sidebar-backdrop {
    background: rgba(0, 0, 0, .58);
  }

  .model-status i {
    box-shadow: 0 0 0 4px rgba(140, 168, 155, .14);
  }

  .welcome-orb {
    background: #d8a841;
    box-shadow: 6px 7px 0 #57492c;
  }

  .suggestions button {
    background: rgba(255, 255, 255, .025);
    color: #bcc5bf;
  }

  .message.user .message-content,
  .doc-pill,
  .attachment-card {
    background: #17241f;
    border-color: var(--line);
    color: #d7ded9;
  }

  .thinking {
    border-color: #567065;
    color: #aeb8b1;
  }

  .vision-progress {
    background: rgba(20, 34, 29, .96);
    border-color: #52675c;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
  }

  .vision-progress-head {
    color: #d8e5dc;
  }

  .vision-progress-head strong {
    color: #9ed1b1;
  }

  .vision-progress-track {
    background: #2a3b34;
  }

  .vision-progress-bar {
    background: linear-gradient(90deg, #83b79a, #d7ad5d);
    box-shadow: 0 0 12px rgba(126, 185, 153, .28);
  }

  .vision-progress-bar::after {
    background: linear-gradient(100deg, transparent 20%, rgba(235, 249, 239, .34) 50%, transparent 80%);
  }

  .vision-progress small {
    color: #9aa9a0;
  }

  .vision-stream {
    border-color: #6d8d7c;
    color: #b7c5bc;
  }

  .vision-stream-head {
    color: #9ed1b1;
  }

  .vision-stream.is-live .vision-stream-body::after {
    background: #9ed1b1;
  }

  .markdown-body blockquote {
    color: #b6c0ba;
    border-color: #587267;
    background: #14211d;
  }

  .markdown-body code,
  .markdown-body th {
    background: #1a2924;
  }

  .markdown-body th,
  .markdown-body td {
    border-color: var(--line);
  }

  .markdown-body a {
    color: #f0886d;
    text-decoration-color: #8a5042;
  }

  .composer-zone {
    background: linear-gradient(transparent, var(--paper) 23%);
  }

  .composer {
    border-color: #405249;
    background: #111e1a;
  }

  .composer:focus-within {
    border-color: #8ca89b;
  }

  .composer-help {
    color: #738078;
  }

  .thinking-toggle {
    color: #a9b3ad;
    border-color: #3a4b43;
    background: #18241f;
  }

  .thinking-toggle:hover {
    color: #eef2ef;
    border-color: #61756c;
  }

  .thinking-toggle.active {
    color: #b8dccb;
    border-color: #4f7564;
    background: #173028;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .22);
  }

  .thinking-toggle.active .thinking-led {
    background: #71c29d;
    box-shadow: 0 0 0 3px rgba(113, 194, 157, .15);
  }

  /* Dark editorial panels used by all research sections */
  .query-deck,
  .intake-deck,
  .indexing-stage,
  .triage-index,
  .ai-report,
  .health-loading,
  .toast,
  .modal-primary,
  .follow-up-pause,
  .research-command .pause-button,
  .mode-switch button:hover,
  .mode-switch button.active,
  .severity-field input:checked + span,
  .image-purpose button.active,
  .security-header p span:first-child {
    background: #092019;
    color: #eef3ef;
  }

  .query-deck,
  .intake-deck,
  .indexing-stage,
  .triage-index,
  .ai-report,
  .health-loading {
    box-shadow: 0 22px 60px rgba(0, 0, 0, .3);
  }

  /* Finance */
  .query-deck input {
    background: #112c24;
    border-color: #3c5a4f;
  }

  .query-deck input:focus {
    background: #15372d;
  }

  .stock-field .suggestions,
  .suggestion-item {
    background: #14221e;
    color: var(--ink);
  }

  .suggestion-item {
    border-color: var(--line);
  }

  .suggestion-item:hover,
  .suggestion-item.active,
  .news-card > a:hover {
    background: #1a2b25;
  }

  .news-card,
  .metric-strip,
  .panel {
    background: rgba(18, 31, 27, .88);
  }

  .news-card:first-child {
    background: #092019;
  }

  .news-skeleton article {
    background: linear-gradient(100deg, #14231e 20%, #20332b 40%, #14231e 60%);
    background-size: 240% 100%;
  }

  .news-skeleton article:first-child {
    background-color: #10251e;
  }

  .news-card-meta,
  .news-disclaimer {
    color: #909c95;
  }

  .news-card-meta b,
  .source-footer b {
    color: var(--ink);
  }

  .loader-orbit i {
    border-color: rgba(216, 229, 220, .2);
  }

  .loading-track {
    background: #263831;
  }

  .error-banner {
    background: #3a1d19;
    color: #ffb2a2;
  }

  .availability-notice {
    background: #302819 !important;
    color: #dac69d !important;
  }

  .quality-note {
    background: #192721;
    color: #bbc5bf;
  }

  /* Research and health form surfaces */
  .project-bar,
  .research-workspace,
  .analysis-desk,
  .source-card,
  .report-empty,
  .research-follow-up,
  .modal-panel,
  .triage-shell,
  .report-upload,
  .report-card,
  .health-result,
  .health-follow-up,
  .evidence-card,
  .reference-card,
  .source-item,
  .health-panel {
    background: var(--card);
    border-color: var(--line);
  }

  .project-bar > button:hover,
  .source-card:target {
    background: #1b2a24;
  }

  .source-card:hover,
  .source-card.graph-active,
  .source-card:target {
    background: #1b2a24;
    box-shadow: inset 3px 0 var(--red);
  }

  .source-card p {
    color: #9eaaa3;
  }

  .source-meta {
    color: #8b9b92;
  }

  .remove-source {
    color: #87968f;
  }

  .research-command textarea,
  .follow-up-command textarea,
  .modal-field input,
  .project-bar select,
  .health-form textarea,
  .health-form input,
  .health-form select,
  .health-follow-up textarea,
  .report-upload input,
  .report-upload textarea {
    background: #0e1b17;
    color: var(--ink);
    border-color: var(--line);
  }

  .consent-row,
  .privacy-strip,
  .report-drop,
  .report-image-card,
  .report-image-card em,
  .follow-up-composer,
  .report-reading,
  .visual-reading,
  .report-dropzone,
  .upload-dropzone,
  .evidence-chip,
  .source-chip,
  .report-toolbar,
  .health-note,
  .medical-note {
    background: #17251f;
    color: #b9c3bd;
    border-color: var(--line);
  }

  .report-image-card.symptom em {
    background: #17382d;
    color: #8dd3b3;
  }

  .report-drop.dragging {
    background: #30201b;
  }

  .urgency-banner {
    background: #17251f;
  }

  .urgency-banner.urgent,
  .report-reading.unreadable,
  .visual-reading.urgent {
    background: #342b1b;
  }

  .urgency-banner.emergency,
  .visual-reading.emergency {
    background: #3a1d19;
    border-color: #704037;
  }

  .urgency-banner.emergency > span,
  .urgency-banner.emergency b {
    color: #ff9c87;
  }

  .health-error {
    background: #3a1d19;
    color: #ffb2a2;
  }

  .markdown-body th,
  .health-report .markdown-body th,
  .report-content .markdown-body th {
    background: #1a2924;
  }

  .health-report .markdown-body blockquote,
  .report-content .markdown-body blockquote {
    background: #14211d;
  }

  .health-report .markdown-body strong,
  .report-content .markdown-body strong {
    color: #f08b73;
  }

  .consent-row span {
    color: #bcc6c0 !important;
  }

  .quick-symptoms button,
  .mode-switch button,
  .image-purpose button,
  .source-filter button {
    background: transparent;
    color: var(--muted);
    border-color: var(--line);
  }

  .prescription-note {
    background: rgba(215, 172, 96, .09);
    color: #c6b998;
  }

  .prescription-note b {
    color: #e0bc77;
  }

  @media (max-width: 700px) {
    .sidebar {
      box-shadow: 18px 0 40px rgba(0, 0, 0, .42);
    }
  }

  .conversation-row:hover,
  .conversation-row.active {
    background: #192621;
    color: var(--ink);
  }

  .conversation-row:hover .conversation-delete,
  .conversation-delete:hover,
  .conversation-delete:focus-visible {
    opacity: .78;
    pointer-events: auto;
    background: transparent;
    color: var(--accent);
  }
}


/* ===== merged from shared-nav.css ===== */
.site-nav{height:70px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;border-bottom:1px solid rgba(206,199,184,.8);position:fixed!important;top:0!important;right:0;left:0;margin:0!important;z-index:20;background:rgba(242,239,230,.94);backdrop-filter:blur(16px);transform:translateZ(0);-webkit-transform:translateZ(0)}
body.finance-page,
body.research-page,
body.health-page{padding-top:70px}
.site-brand{display:flex;align-items:center;gap:12px;min-width:270px;color:var(--ink);text-decoration:none}
.site-brand>span:last-child{display:flex;flex-direction:column}
.site-brand b{font:700 18px var(--serif);letter-spacing:.08em}
.site-brand small{font:500 8px var(--mono);letter-spacing:.16em;color:var(--muted);margin-top:2px}
.site-nav .brand-seal{display:grid;place-items:center;width:35px;height:35px;background:var(--red);color:#fff;font:600 17px var(--serif);border-radius:1px;box-shadow:3px 3px 0 rgba(201,74,53,.15)}
.site-nav nav{position:absolute;left:50vw;transform:translateX(-50%);display:flex;gap:30px;margin:0}
.site-nav nav a{position:relative;color:var(--muted);font:inherit;font-family:"Noto Sans SC","PingFang SC","Helvetica Neue",Arial,sans-serif;font-size:12px;text-decoration:none;white-space:nowrap}
.site-nav nav a:hover,.site-nav nav a.active{color:var(--ink)}
.site-nav nav a.active:after{content:"";position:absolute;left:50%;bottom:-25px;width:27px;height:2px;background:var(--red);transform:translateX(-50%)}
.nav-actions{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:14px}
.nav-actions>.language-icon-toggle{order:1;flex:0 0 auto}
.nav-actions>.data-pulse,.nav-actions>.index-status,.nav-actions>.health-status{order:0}
.nav-actions>.data-pulse,.nav-actions>.index-status,.nav-actions>.health-status{min-width:0;margin-left:0;justify-content:flex-start;white-space:nowrap}
.site-nav>.data-pulse,.site-nav>.index-status{margin-left:auto}
.mobile-nav-bar{display:none}
.language-icon-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:auto;min-width:55px;height:34px;padding:0 9px;border:1px solid rgba(99,89,71,.34);border-radius:999px;background:rgba(255,255,255,.46);color:var(--ink);cursor:pointer;transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease}.language-icon-toggle svg{width:15px;height:15px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;transition:transform .24s cubic-bezier(.2,.8,.2,1)}.language-icon-toggle:after{font:600 9px/1 var(--mono);letter-spacing:.12em}.language-icon-toggle[data-locale="zh-CN"]:after{content:"CN"}.language-icon-toggle[data-locale="en"]:after{content:"EN"}.language-icon-toggle:hover{color:var(--red);border-color:var(--red);background:#fff;transform:translateY(-1px)}.language-icon-toggle:hover svg{transform:rotate(-16deg)}.language-icon-toggle:focus-visible{outline:2px solid var(--red);outline-offset:2px}.language-icon-toggle[data-locale="en"]{color:var(--red)}
.language-icon-toggle{-webkit-tap-highlight-color:transparent;background-clip:padding-box;overflow:hidden;touch-action:manipulation;user-select:none}.language-icon-toggle:active{background:rgba(203,77,55,.1);transform:scale(.96)}
.site-nav .visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Keep the live status as a small signal while the centered English menu is
   compact. The health status can be much longer than the other page labels,
   so the shared threshold is based on the widest of the three pages. */
@media(min-width:901px) and (max-width:1550px){
  .nav-actions>:not(.language-icon-toggle):not(.nav-account-status){display:flex;flex:0 0 7px;width:7px;min-width:7px;overflow:visible}
  .nav-actions>:not(.language-icon-toggle):not(.nav-account-status) span{display:none}
}

/* Tablet widths are too narrow for the brand text alongside the navigation.
   Keep the desktop rhythm, but reserve that space for the menu. */
@media(min-width:901px) and (max-width:1150px){
  .site-brand{min-width:0}
  .site-brand>span:last-child{display:none}
  .site-nav nav{gap:22px}
}

@media(max-width:900px){
  /* A single, quiet header keeps Chinese and English equally compact. The
     navigation becomes an animated sheet instead of a permanently visible row. */
  .site-nav{height:64px;padding:0 14px;display:flex;align-items:center;justify-content:flex-start}
  body.finance-page,
  body.research-page,
  body.health-page{padding-top:64px}
  .site-brand,.nav-actions{display:none}
  .mobile-nav-bar{display:flex;align-items:center;gap:11px;width:100%;min-width:0}
  .mobile-menu-toggle{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;background:transparent;cursor:pointer}
  .mobile-menu-toggle .brand-seal{width:34px;height:34px;box-shadow:3px 3px 0 rgba(201,74,53,.16);transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s ease}
  .mobile-menu-toggle:focus-visible{outline:2px solid var(--red);outline-offset:3px}
  .mobile-current-section{min-width:0;color:var(--ink);font:600 15px/1.25 var(--serif);letter-spacing:-.025em;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-current-section:after{content:"";display:inline-block;width:5px;height:5px;margin:0 0 2px 8px;border-radius:50%;background:var(--red)}
  .mobile-nav-bar .language-icon-toggle{margin-left:auto;min-width:53px;height:32px;padding-inline:8px;flex:0 0 auto}
  .site-nav nav.site-nav-menu{position:absolute;top:56px;right:auto;left:14px;z-index:1;display:grid;grid-template-columns:1fr;gap:5px;width:min(214px,calc(100vw - 28px));margin:0;padding:11px 10px;border:1px solid rgba(165,151,126,.58);border-radius:0;background:rgba(249,247,240,.96);box-shadow:0 20px 44px rgba(42,37,27,.16);backdrop-filter:blur(18px);clip-path:inset(0 68% 92% 0 round 0);transform:translate3d(-8px,-10px,0) scale(.9);transform-origin:top left;opacity:0;visibility:hidden;pointer-events:none;transition:clip-path .36s cubic-bezier(.16,1,.3,1),transform .36s cubic-bezier(.16,1,.3,1),opacity .2s ease,box-shadow .36s ease,visibility 0s linear .36s}
  .site-nav nav.site-nav-menu a{position:relative;display:flex;align-items:center;min-height:46px;padding:0 12px 0 14px;border:0;border-radius:0;background:transparent;font-size:12px;line-height:1.25;white-space:normal;opacity:0;transform:translateX(-14px);transition:color .18s ease,background .18s ease,opacity .22s ease,transform .3s cubic-bezier(.16,1,.3,1)}
  .site-nav nav.site-nav-menu a:before{content:attr(data-nav-icon);position:static;display:grid;place-items:center;width:24px;height:24px;margin-right:10px;background:transparent;color:var(--red);font:500 16px/1 var(--serif)}
  .site-nav nav.site-nav-menu a:hover,.site-nav nav.site-nav-menu a:focus-visible{background:rgba(201,74,53,.08);color:var(--ink);outline:none}
  .site-nav nav.site-nav-menu a.active{background:rgba(201,74,53,.1);color:var(--red)}
  .site-nav nav.site-nav-menu a.active:after{display:none}
  .site-nav.mobile-menu-open nav.site-nav-menu{clip-path:inset(0 round 0);transform:translate3d(0,0,0) scale(1);opacity:1;visibility:visible;pointer-events:auto;box-shadow:0 20px 44px rgba(42,37,27,.2);transition-delay:0s}
  .site-nav.mobile-menu-open nav.site-nav-menu a{opacity:1;transform:translateX(0)}
  .site-nav.mobile-menu-open nav.site-nav-menu a:nth-child(1){transition-delay:.06s}
  .site-nav.mobile-menu-open nav.site-nav-menu a:nth-child(2){transition-delay:.1s}
  .site-nav.mobile-menu-open nav.site-nav-menu a:nth-child(3){transition-delay:.14s}
  .site-nav.mobile-menu-open nav.site-nav-menu a:nth-child(4){transition-delay:.18s}
  .site-nav.mobile-menu-open nav.site-nav-menu a:nth-child(5){transition-delay:.22s}
  .site-nav.mobile-menu-open .mobile-menu-toggle .brand-seal{transform:rotate(-10deg) scale(1.1);box-shadow:5px 5px 0 rgba(201,74,53,.24)}
}

@media(max-width:350px){
  .site-nav{padding-inline:10px}
  .mobile-current-section{font-size:15px}
  .site-nav nav.site-nav-menu{right:auto;left:9px;width:min(214px,calc(100vw - 18px))}
}

@media(prefers-reduced-motion:reduce){
  .site-nav nav.site-nav-menu,.site-nav nav.site-nav-menu a,.mobile-menu-toggle .brand-seal{transition-duration:.01ms!important;transition-delay:0s!important}
}


/* ===== merged from account-status.css ===== */
/* A quiet, shared account context for every workspace header. The same pill
   makes browser-only and cross-device data distinguishable without adding a
   second prominent account panel to the page. */
.nav-account-status{display:inline-flex;align-items:center;gap:7px;min-width:0;max-width:230px;height:34px;padding:0 9px;border:1px solid rgba(99,89,71,.34);border-radius:999px;background:rgba(255,255,255,.46);background-clip:padding-box;color:var(--muted);overflow:hidden;text-decoration:none;touch-action:manipulation;user-select:none;-webkit-tap-highlight-color:transparent;transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease}
.nav-account-status:hover{border-color:var(--accent,var(--red,#c94a35));background-color:var(--card,#fff);color:var(--ink);transform:translateY(-1px)}
.nav-account-status:active{background-color:rgba(201,74,53,.1);color:var(--ink);transform:scale(.97)}
.nav-account-status:focus-visible{outline:2px solid var(--accent,var(--red,#c94a35));outline-offset:2px}
.nav-account-status>i{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:var(--sage,#748b82);box-shadow:0 0 0 4px rgba(116,139,130,.11)}
.nav-account-status[data-auth-state="authenticated"]>i{background:var(--green,#28745e);box-shadow:0 0 0 4px rgba(40,116,94,.11)}
.nav-account-status[data-auth-state="unavailable"]>i{background:var(--accent,var(--red,#c94a35));box-shadow:0 0 0 4px rgba(201,74,53,.11)}
.nav-account-status[data-auth-state="loading"]{cursor:wait;pointer-events:none;opacity:.7}
.nav-account-status>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 10px var(--mono,"DM Mono",monospace)}
.nav-account-status>small{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font:8px var(--mono,"DM Mono",monospace)}

.nav-actions>.nav-account-status,.topbar-actions>.nav-account-status{order:2}

@media(min-width:901px) and (max-width:1150px){
  .nav-actions>:not(.language-icon-toggle).nav-account-status{display:inline-flex;max-width:140px}
  .nav-actions>.nav-account-status>small{display:none}
}

@media(max-width:900px){
  .mobile-nav-bar .nav-account-status{max-width:min(30vw,150px);height:32px;padding:0 8px;gap:6px;flex:0 1 auto}
  .mobile-nav-bar .nav-account-status>i{width:6px;height:6px;box-shadow:0 0 0 3px rgba(116,139,130,.11)}
  .mobile-nav-bar .nav-account-status>span{font-size:9px}
  .mobile-nav-bar .nav-account-status>small{display:none}
}

@media(max-width:700px){
  .topbar-actions>.nav-account-status{max-width:min(30vw,150px);height:32px;padding:0 8px;gap:6px;flex:0 1 auto}
  .topbar-actions>.nav-account-status>i{width:6px;height:6px;box-shadow:0 0 0 3px rgba(116,139,130,.11)}
  .topbar-actions>.nav-account-status>span{font-size:9px}
  .topbar-actions>.nav-account-status>small{display:none}
}

@media(max-width:430px){
  .mobile-nav-bar .nav-account-status,.topbar-actions>.nav-account-status{max-width:92px}
  .mobile-nav-bar .nav-account-status>span,.topbar-actions>.nav-account-status>span{max-width:70px}
}

@media(max-width:350px){
  .mobile-nav-bar .nav-account-status,.topbar-actions>.nav-account-status{max-width:76px;padding-inline:6px}
  .mobile-nav-bar .nav-account-status>span,.topbar-actions>.nav-account-status>span{max-width:57px}
}

html[data-theme="dark"] {
  .nav-account-status{border-color:rgba(150,172,161,.34);background-color:rgba(255,255,255,.05)}
  .nav-account-status:hover{background-color:rgba(255,255,255,.11);color:var(--ink)}
  .nav-account-status:active{background-color:rgba(239,121,91,.14);color:var(--ink)}
}


/* ===== merged from standalone-language.css ===== */
.standalone-language-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:54px;height:32px;padding:0 8px;border:1px solid var(--line, var(--ai-rule, rgba(99,89,71,.34)));border-radius:999px;background:var(--card, rgba(255,255,255,.46));color:var(--muted, var(--ai-muted, #72746c));cursor:pointer;transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease}
.standalone-language-toggle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;transition:transform .24s cubic-bezier(.2,.8,.2,1)}
.standalone-language-toggle:after{content:"CN";font:600 9px/1 "DM Mono",monospace;letter-spacing:.12em}
.standalone-language-toggle[data-locale="en"]:after{content:"EN"}
.standalone-language-toggle:hover{color:var(--accent, var(--ai-coral, #dc5a35));border-color:currentColor;background:color-mix(in srgb,var(--accent, var(--ai-coral, #dc5a35)) 9%,var(--card, #fff));transform:translateY(-1px)}
.standalone-language-toggle:hover svg{transform:rotate(-16deg)}
.standalone-language-toggle:focus-visible{outline:2px solid var(--accent, var(--ai-coral, #dc5a35));outline-offset:2px}
.standalone-language-toggle{-webkit-tap-highlight-color:transparent;background-clip:padding-box;overflow:hidden;touch-action:manipulation;user-select:none}
.standalone-language-toggle:active{transform:scale(.96)}
html[data-theme="dark"] {.standalone-language-toggle{border-color:rgba(150,172,161,.34);background:rgba(255,255,255,.05)}.standalone-language-toggle:hover{background:rgba(255,255,255,.11)}}


/* ===== merged from voice.css ===== */
.voice-input-button {
  width:38px;
  height:38px;
  flex:0 0 auto;
  margin-right:4px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb, var(--accent) 72%, #fff);
  border-radius:50%;
  background:var(--accent);
  color:#fff;
  box-shadow:0 3px 9px rgba(220,90,53,.24);
  transition:color .2s ease, background .2s ease, transform .2s ease, opacity .2s ease, box-shadow .2s ease;
}
.voice-input-button svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.voice-input-icon { display:grid; place-items:center; }
.voice-stop-icon { display:none; }
.voice-reading-icon { display:none; align-items:center; justify-content:center; height:19px; }
.voice-reading-icon svg { width:20px; height:20px; }
.voice-input-button.is-recording { color:#fff; background:var(--accent); box-shadow:0 4px 12px color-mix(in srgb, var(--accent) 28%, transparent); }
.voice-input-button.is-recording .voice-start-icon { display:none; }
.voice-input-button.is-recording .voice-stop-icon { display:grid; }
.voice-input-button.is-reading .voice-start-icon,
.voice-input-button.is-reading .voice-stop-icon { display:none; }
.voice-input-button.is-reading .voice-reading-icon { display:flex; }
.voice-input-button:hover { color:#fff; background:#bd4528; border-color:#bd4528; transform:translateY(-1px); box-shadow:0 5px 12px rgba(220,90,53,.3); }
.voice-input-button:focus-visible,
.voice-cancel-button:focus-visible,
.voice-play:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.voice-input-button:disabled { opacity:.4; cursor:not-allowed; transform:none; }
.voice-input-button.is-recording { animation:voiceButtonPulse 1.3s ease-in-out infinite; }
.voice-recorder { min-width:0; flex:1 1 auto; display:flex; align-items:center; gap:9px; height:42px; padding:0 10px; border:1px solid color-mix(in srgb, var(--accent) 36%, var(--line)); border-radius:22px; background:color-mix(in srgb, var(--accent) 6%, var(--card)); color:var(--ink); }
.voice-recorder[hidden] { display:none; }
.voice-cancel-button { width:24px; height:24px; flex:0 0 auto; border:0; border-radius:50%; background:transparent; color:var(--muted); font:500 19px/1 "DM Mono",monospace; }
.voice-cancel-button:hover { color:var(--accent); background:color-mix(in srgb, var(--accent) 10%, transparent); }
.voice-stop-button { height:30px; flex:0 0 auto; padding:0 11px; border:1px solid var(--accent); border-radius:5px; background:var(--accent); color:#fff; font:600 10px/1 "DM Mono",monospace; letter-spacing:.04em; box-shadow:0 3px 8px color-mix(in srgb, var(--accent) 20%, transparent); }
.voice-stop-button:hover { background:#bd4528; border-color:#bd4528; transform:translateY(-1px); }
.voice-stop-button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.composer > #prompt { min-width:0; }
.composer > #prompt:placeholder-shown { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; word-break:keep-all; }
.composer.is-reading > #prompt { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; word-break:keep-all; }
.voice-recording-dot { width:7px; height:7px; flex:0 0 auto; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 13%, transparent); animation:voiceDotPulse 1.1s ease-in-out infinite; }
.voice-recording-bars { height:22px; display:flex; align-items:center; gap:3px; flex:0 0 auto; }
.voice-recording-bars i { width:2px; height:8px; border-radius:4px; background:var(--accent); animation:voiceBar 900ms ease-in-out infinite; }
.voice-recording-bars i:nth-child(2) { animation-delay:-.68s; height:14px; }.voice-recording-bars i:nth-child(3) { animation-delay:-.49s; height:19px; }.voice-recording-bars i:nth-child(4) { animation-delay:-.35s; height:11px; }.voice-recording-bars i:nth-child(5) { animation-delay:-.2s; height:17px; }.voice-recording-bars i:nth-child(6) { animation-delay:-.58s; height:12px; }.voice-recording-bars i:nth-child(7) { animation-delay:-.42s; height:7px; }
.voice-recorder-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font:500 10px/1.4 "DM Mono",monospace; letter-spacing:.02em; }
.voice-recorder time { margin-left:auto; flex:0 0 auto; color:var(--ink); font:500 11px/1 "DM Mono",monospace; font-variant-numeric:tabular-nums; }
.composer.is-recording #prompt,
.composer.is-transcribing #prompt { display:none; }
.composer.is-recording .upload-button,
.composer.is-recording .thinking-toggle,
.composer.is-recording .send-button,
.composer.is-transcribing .upload-button,
.composer.is-transcribing .thinking-toggle,
.composer.is-transcribing .send-button { display:none; }
.composer.is-transcribing .voice-input-button { color:var(--sage); animation:voiceTranscribingPulse 1.8s ease-in-out infinite; }
.composer.is-transcribing .voice-recording-dot { background:var(--sage); animation:voiceTranscribingDot 1.15s ease-in-out infinite; }
.composer.is-transcribing .voice-recording-bars i { animation-name:voiceTranscribingBar; animation-duration:760ms; height:9px; background:var(--sage); }
.composer.is-transcribing .voice-recorder-label { animation:voiceTranscribingLabel 1.4s ease-in-out infinite; }

.voice-message { display:flex; align-items:center; gap:10px; min-height:42px; min-width:220px; max-width:100%; }
.voice-play { width:32px; height:32px; flex:0 0 auto; display:grid; place-items:center; padding:0; border:1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); border-radius:50%; background:color-mix(in srgb, var(--accent) 9%, transparent); color:var(--accent); font:600 12px/1 "DM Mono",monospace; -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent; touch-action:manipulation; background-clip:padding-box; overflow:hidden; user-select:none; }
.voice-play svg { width:13px; height:13px; fill:currentColor; stroke:none; margin-left:1px; }
.voice-play.is-playing svg { margin-left:0; }
.voice-play:focus:not(:focus-visible) { outline:none; }
.voice-play:active { background:color-mix(in srgb, var(--accent) 16%, transparent); transform:scale(.96); }
.voice-play:disabled { opacity:.4; cursor:not-allowed; }
.voice-wave { height:25px; display:flex; align-items:center; gap:2px; min-width:74px; flex:1 1 auto; }
.voice-wave i { width:3px; height:var(--voice-height); border-radius:3px; background:color-mix(in srgb, var(--accent) 73%, var(--ink)); opacity:.7; }
.voice-wave i:nth-child(3n) { opacity:.45; }.voice-wave i:nth-child(4n) { opacity:.85; }
.voice-duration { flex:0 0 auto; color:var(--muted); font:500 10px/1 "DM Mono",monospace; font-variant-numeric:tabular-nums; }
.voice-transcript { margin-top:10px; padding-top:8px; border-top:1px solid color-mix(in srgb, var(--line) 75%, transparent); color:var(--muted); font-size:12px; line-height:1.65; }
.voice-transcript summary { cursor:pointer; color:var(--sage); font:500 10px/1.4 "DM Mono",monospace; }
.voice-transcript p { margin:7px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.voice-unavailable { color:var(--muted); font:10px/1.5 "DM Mono",monospace; }
@keyframes voiceButtonPulse { 50% { box-shadow:0 0 0 5px color-mix(in srgb, var(--accent) 9%, transparent); } }
@keyframes voiceDotPulse { 50% { opacity:.35; transform:scale(.75); } }
@keyframes voiceBar { 0%,100% { transform:scaleY(.58); opacity:.45; } 50% { transform:scaleY(1); opacity:1; } }
@keyframes voiceTranscribingPulse { 0%,100% { box-shadow:0 0 0 0 color-mix(in srgb, var(--sage) 0%, transparent); } 50% { box-shadow:0 0 0 5px color-mix(in srgb, var(--sage) 15%, transparent); } }
@keyframes voiceTranscribingDot { 0%,100% { opacity:.45; transform:scale(.82); } 50% { opacity:1; transform:scale(1.12); } }
@keyframes voiceTranscribingBar { 0%,100% { transform:scaleY(.5); opacity:.38; } 50% { transform:scaleY(1.45); opacity:1; } }
@keyframes voiceTranscribingLabel { 0%,100% { opacity:.58; } 50% { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .voice-input-button.is-recording,.voice-recording-dot,.voice-recording-bars i,.composer.is-transcribing .voice-input-button,.composer.is-transcribing .voice-recorder-label { animation:none; } }
.composer button,
.composer .upload-button { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
.composer > .voice-input-button,
.composer > .send-button { background-clip:padding-box; overflow:hidden; user-select:none; }
.composer > .voice-input-button:focus,
.composer > .send-button:focus { outline:none; }
.composer > .voice-input-button:focus-visible,
.composer > .send-button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.composer > .voice-input-button:active,
.composer > .send-button:active { background:#bd4528; transform:scale(.96); }
@media (max-width:700px) {
  .voice-recorder { gap:7px; padding:0 8px; }
  .voice-recorder-label { font-size:9px; }
  .voice-stop-button { padding:0 9px; }
  .voice-message { min-width:190px; }
}


/* ===== merged from app-update.css ===== */
.app-update[hidden]{display:none}
.app-update{position:fixed;z-index:200;inset:0;display:grid;place-items:center;padding:20px}
.app-update-backdrop{position:absolute;inset:0;border:0;background:rgba(7,24,20,.64);backdrop-filter:blur(6px);cursor:default}
.app-update-panel{position:relative;width:min(430px,100%);padding:25px 24px 22px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-top:3px solid var(--accent);box-shadow:0 30px 90px rgba(4,20,16,.32);animation:appUpdateReveal .24s ease both}
.app-update-kicker{color:var(--accent);font:500 9px/1.4 "DM Mono",monospace;letter-spacing:.14em}
.app-update-panel h2{margin:9px 0 10px;font:600 25px/1.3 "Noto Serif SC",serif;letter-spacing:-.04em}
.app-update-panel p{margin:0;color:var(--muted);font-size:12px;line-height:1.75}
.app-update-meta{margin:17px 0 20px;padding:10px 12px;border:1px solid var(--line);background:rgba(220,90,53,.06);color:var(--muted);font:10px/1.65 "DM Mono",monospace;white-space:pre-line}
.app-update-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:8px}
.app-update-actions button,.app-update-actions a{height:46px;border:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 14px;font:600 11px/1 "Source Han Sans SC",sans-serif;text-decoration:none;cursor:pointer}
.app-update-later{background:transparent;color:var(--muted)}
.app-update-later:hover{border-color:var(--ink);color:var(--ink)}
.app-update-primary{border-color:var(--accent)!important;background:var(--accent);color:#fff}
.app-update-primary b{font:400 16px/1 "DM Mono",monospace}
.app-update-primary:hover{background:#bd4528}
.app-update-actions button:focus-visible,.app-update-actions a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
body.app-update-open{overflow:hidden}
@keyframes appUpdateReveal{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:500px){.app-update{place-items:end center;padding:0}.app-update-panel{width:100%;padding:21px 16px calc(18px + env(safe-area-inset-bottom));border-right:0;border-left:0;border-bottom:0;animation:appUpdateSheet .24s ease both}.app-update-actions button,.app-update-actions a{height:48px}}
@keyframes appUpdateSheet{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.app-update-panel{animation:none}}


/* ===== merged from stitch-theme.css ===== */
/*
 * Xiaomai visual layer
 *
 * This file is intentionally kept separate from the feature stylesheets. The
 * feature CSS owns layout and state; this layer brings the Stitch reference
 * language to every page without changing the DOM hooks used by the scripts.
 */
:root {
  --stitch-paper: #f6f2e8;
  --stitch-surface: #fffdf7;
  --stitch-surface-muted: #f0ece2;
  --stitch-ink: #171817;
  --stitch-muted: #70716b;
  --stitch-line: #d9d4c9;
  --stitch-red: #d25435;
  --stitch-red-dark: #b9432a;
  --stitch-sage: #7d988a;
  --stitch-navy: #243a52;
  --stitch-shadow: 0 18px 42px rgba(47, 46, 39, .08);

  --ink: var(--stitch-ink);
  --ink-2: #26342f;
  --paper: var(--stitch-paper);
  --card: var(--stitch-surface);
  --line: var(--stitch-line);
  --muted: var(--stitch-muted);
  --accent: var(--stitch-red);
  --red: var(--stitch-red);
  --green: #43806b;
  --sage: var(--stitch-sage);
  --medical: #4f8e79;
  --gold: #b99a63;
  --chart-grid: #e6e0d5;
  --chart-marker: #b8b0a3;
  --chart-tooltip: rgba(20, 29, 27, .95);
}

html {
  background: var(--stitch-paper);
}

body {
  background: var(--stitch-paper);
  color: var(--stitch-ink);
}

button,
input,
textarea,
select {
  accent-color: var(--stitch-red);
}

/* Shared desktop navigation */
.finance-nav.site-nav,
.research-nav.site-nav,
.health-nav.site-nav,
.documents-nav.site-nav {
  height: 68px;
  padding: 0 clamp(18px, 5vw, 72px);
  border-bottom: 1px solid rgba(217, 212, 201, .9);
  background: rgba(246, 242, 232, .94);
  box-shadow: none;
}

.finance-brand,
.research-brand,
.health-brand,
.site-brand {
  min-width: 230px;
  color: var(--stitch-ink);
}

.finance-brand .brand-seal,
.research-brand .brand-seal,
.health-brand .brand-seal,
.site-brand .brand-seal {
  width: 36px;
  height: 36px;
  border-radius: 5px;
  background: var(--stitch-ink);
  box-shadow: none;
  font-size: 19px;
}

.finance-brand b,
.research-brand b,
.health-brand b,
.site-brand b {
  font-size: 16px;
  letter-spacing: .025em;
}

.finance-brand small,
.research-brand small,
.health-brand small,
.site-brand small {
  color: var(--stitch-muted);
  letter-spacing: .14em;
}

.finance-nav nav,
.research-nav nav,
.health-nav nav,
.site-nav nav {
  gap: clamp(18px, 2.3vw, 32px);
}

.finance-nav nav a,
.research-nav nav a,
.health-nav nav a,
.site-nav nav a {
  color: var(--stitch-muted);
  font-size: 11px;
}

.finance-nav nav a:hover,
.finance-nav nav a.active,
.research-nav nav a:hover,
.research-nav nav a.active,
.health-nav nav a:hover,
.health-nav nav a.active,
.site-nav nav a:hover,
.site-nav nav a.active {
  color: var(--stitch-ink);
}

.finance-nav nav a.active:after,
.research-nav nav a.active:after,
.health-nav nav a.active:after,
.site-nav nav a.active:after {
  bottom: -24px;
  width: 24px;
  height: 2px;
  background: var(--stitch-red);
}

.site-nav nav a[data-document-nav] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

@media (min-width: 901px) {
  .site-nav nav a[data-document-nav].active:after {
    display: none;
  }

  .site-nav nav a[data-document-nav].active > span:first-child {
    position: relative;
  }

  .site-nav nav a[data-document-nav].active > span:first-child:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -24px;
    width: 24px;
    height: 2px;
    background: var(--stitch-red);
    transform: translateX(-50%);
  }
}

.site-nav nav a[data-document-nav] .nav-beta,
.finance-entry .nav-beta,
.welcome-product .nav-beta {
  display: inline-flex;
  align-items: center;
  height: 14px;
  padding: 0 4px;
  border: 1px solid color-mix(in srgb, var(--stitch-red) 68%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--stitch-red) 8%, transparent);
  color: var(--stitch-red);
  font: 500 7px/1 "DM Mono", monospace;
  letter-spacing: .08em;
  transform: translateY(-4px);
}

.finance-entry .nav-beta,
.welcome-product .nav-beta {
  margin-left: 4px;
  transform: translateY(-3px);
}

.data-pulse,
.index-status,
.health-status {
  color: var(--stitch-muted);
  font-size: 9px;
}

.data-pulse i,
.index-status i,
.health-status i {
  box-shadow: 0 0 0 4px rgba(125, 152, 138, .13);
}

.language-icon-toggle {
  border-color: rgba(112, 113, 107, .35);
  background: rgba(255, 253, 247, .55);
}

.language-icon-toggle:hover {
  color: var(--stitch-red);
  border-color: var(--stitch-red);
  background: var(--stitch-surface);
}

.market-grid,
.archive-grid,
.clinical-grid {
  opacity: .5;
  background-image:
    radial-gradient(circle at 16% 10%, rgba(210, 84, 53, .045), transparent 25%),
    radial-gradient(circle at 87% 22%, rgba(125, 152, 138, .06), transparent 23%);
  background-size: auto;
  mask-image: none;
}

/* The chat keeps its existing sidebar and composer, but adopts the quieter
   landing-page rhythm from the reference. */
.app-shell {
  width: 100%;
  max-width: none;
  background: rgba(255, 253, 247, .24);
}

.sidebar {
  padding: 25px 17px 18px;
  background: rgba(255, 253, 247, .58);
  border-right-color: var(--stitch-line);
}

.brand {
  padding-left: 5px;
  font-size: 21px;
  letter-spacing: -.8px;
}

.brand-mark {
  width: 36px;
  height: 36px;
  border-radius: 5px;
  background: var(--stitch-ink);
  color: #fff;
  font: 600 20px/1 "Noto Serif SC", serif;
}

.new-chat {
  height: 42px;
  margin: 30px 0 9px;
  border: 0;
  border-radius: 8px;
  padding: 0 14px;
  color: #fff;
  background: var(--stitch-ink);
  box-shadow: 0 8px 18px rgba(23, 24, 23, .1);
}

.new-chat:hover {
  color: #fff;
  background: var(--stitch-red);
  transform: translateY(-1px);
}

.finance-entry {
  gap: 11px;
  margin: 2px 0;
  padding: 10px 9px;
  border: 0;
  border-radius: 8px;
}

.finance-entry:hover,
.conversation-item:hover,
.conversation-item.active {
  background: var(--stitch-surface-muted);
}

.finance-entry b {
  font-size: 13px;
  line-height: 1.35;
}

.finance-entry small {
  color: var(--stitch-muted);
  font-size: 10px;
  line-height: 1.45;
}

.side-label,
.eyebrow {
  color: var(--stitch-muted);
}

.conversation-list {
  gap: 4px;
}

.conversation-item {
  border-radius: 8px;
  color: #65665f;
}

.privacy-note {
  border-top-color: var(--stitch-line);
}

.workspace {
  background: rgba(246, 242, 232, .14);
}

.topbar {
  height: auto;
  min-height: 68px;
  padding: 12px clamp(22px, 4.5vw, 58px) 14px;
  border-bottom-color: var(--stitch-line);
  background: rgba(246, 242, 232, .7);
}

.topbar-title > div {
  min-width: 0;
}

.topbar h1 {
  font-size: 19px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.model-status {
  color: var(--stitch-muted);
}

.messages {
  padding: 40px clamp(20px, 2.8vw, 48px);
}

.welcome {
  width: 100%;
  max-width: none;
  margin: clamp(34px, 8vh, 82px) auto 0;
  text-align: center;
}

.welcome-orb {
  width: 42px;
  height: 42px;
  margin: 0 auto 21px;
  border-radius: 7px;
  background: var(--stitch-red);
  box-shadow: 5px 5px 0 rgba(210, 84, 53, .16);
  font-size: 27px;
}

.welcome h2 {
  margin: 9px 0 13px;
  font-size: clamp(31px, 4vw, 48px);
  letter-spacing: -2.5px;
}

.welcome > p:not(.eyebrow) {
  max-width: 570px;
  margin-inline: auto;
}

.welcome-products {
  width: min(100%, 1200px);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px;
  margin-top: 28px;
  margin-inline: auto;
  text-align: left;
}

.welcome-product {
  position: relative;
  min-height: 112px;
  padding: 15px 16px 14px;
  border: 1px solid var(--stitch-line);
  border-radius: 10px;
  color: var(--stitch-ink);
  background: rgba(255, 253, 247, .74);
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(47, 46, 39, .035);
  transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.welcome-product:hover {
  border-color: var(--stitch-red);
  background: var(--stitch-surface);
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(47, 46, 39, .08);
}

.welcome-product-icon {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  margin-bottom: 13px;
  border: 1px solid rgba(125, 152, 138, .6);
  border-radius: 5px;
  color: var(--stitch-sage);
  font: 15px/1 "DM Mono", monospace;
}

.welcome-product strong,
.welcome-product small {
  display: block;
  min-width: 0;
}

.welcome-product strong {
  font: 600 13px/1.35 "Noto Serif SC", serif;
}

.welcome-product small {
  margin-top: 4px;
  padding-right: 8px;
  overflow: hidden;
  color: var(--stitch-muted);
  font-size: 9px;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.welcome-product > b {
  position: absolute;
  right: 13px;
  bottom: 11px;
  color: var(--stitch-red);
  font: 14px/1 "DM Mono", monospace;
  transition: transform .18s ease;
}

.welcome-product:hover > b {
  transform: translate(2px, -2px);
}

.suggestions {
  justify-content: center;
  margin-top: 25px;
}

.suggestions button {
  border-color: var(--stitch-line);
  border-radius: 999px;
  background: rgba(255, 253, 247, .7);
}

.suggestions button:hover {
  border-color: var(--stitch-red);
  color: var(--stitch-red);
  background: var(--stitch-surface);
}

.message.user .message-content {
  background: var(--stitch-surface-muted);
}

/* Keep the assistant's prose on the same text column as the user's bubble
   content, rather than aligning it with the outer message edge. */
.message.assistant .message-content {
  padding-inline: 19px;
}

.message-actions {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  margin-left: 1px;
  vertical-align: middle;
  cursor: pointer;
}

.message-actions:hover {
  color: var(--stitch-red);
}

.message-actions:has(.message-speech-button:disabled),
.message-actions:has(.message-speech-button:disabled) .message-speech-button {
  cursor: wait;
}

.message-actions-row {
  display: flex;
  align-items: center;
  min-height: 26px;
  margin-top: 8px;
}

.message-actions-row .message-actions {
  margin-left: 0;
}

.message-speech-button {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--stitch-muted);
  cursor: pointer;
  transform: none !important;
  transition: color .18s ease, background .18s ease, opacity .18s ease;
}

.message-actions .message-speech-button {
  flex: 0 0 26px;
}

.message-speech-button:hover,
.message-speech-button:focus-visible {
  background: color-mix(in srgb, var(--stitch-surface-muted) 75%, transparent);
  color: var(--stitch-red);
  transform: none !important;
}

.message-speech-button:active {
  transform: none !important;
}

.message-speech-button:focus-visible {
  outline: 1px solid var(--stitch-red);
  outline-offset: 2px;
}

.message-speech-button:disabled {
  cursor: wait;
  opacity: .5;
}

.message-speech-button.is-loading {
  animation: messageSpeechPulse 1.1s ease-in-out infinite;
}

.message-speech-button.is-playing {
  background: color-mix(in srgb, var(--stitch-surface-muted) 65%, transparent);
  color: var(--stitch-red);
}

.message-speech-icon {
  width: 15px;
  height: 15px;
  pointer-events: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.message-speech-icon-play {
  fill: currentColor;
  stroke: none;
}

.message-speech-icon-loading {
  animation: messageSpeechSpin .9s linear infinite;
}

@keyframes messageSpeechPulse {
  50% { opacity:.5; }
}

@keyframes messageSpeechSpin {
  to { transform: rotate(360deg); }
}

.composer-zone {
  padding: 0 clamp(20px, 2.8vw, 48px) 22px;
  background: linear-gradient(transparent, var(--stitch-paper) 25%);
}

.message,
.attachment-tray,
.composer,
.composer-help {
  width: 100%;
  max-width: none;
}

.message {
  max-width: 1200px;
  margin-inline: auto;
}

.attachment-tray,
.composer,
.composer-help {
  max-width: 1200px;
  margin-inline: auto;
}

.composer {
  min-height: 62px;
  border-color: #cfc9bc;
  border-radius: 14px;
  background: rgba(255, 253, 247, .93);
  box-shadow: var(--stitch-shadow);
}

.composer:focus-within {
  border-color: var(--stitch-ink);
  box-shadow: 0 0 0 3px rgba(210, 84, 53, .08), var(--stitch-shadow);
}

.send-button {
  border-radius: 8px;
  background: var(--stitch-ink);
  box-shadow: none;
}

.send-button:hover {
  background: var(--stitch-red);
  box-shadow: none;
}

/* A running chat can be cancelled from the same control used to send it. */
.send-button.is-stop {
  background: var(--stitch-red);
  color: #fff;
  cursor: pointer;
  opacity: 1;
  box-shadow: 0 4px 12px rgba(210, 84, 53, .24);
}

.send-button.is-stop:hover {
  background: var(--stitch-red-dark);
  box-shadow: 0 6px 16px rgba(210, 84, 53, .3);
}

.send-button.is-stop svg {
  width: 18px;
  height: 18px;
}

/* Functional pages: shared editorial spacing and the reference's soft cards. */
.finance-nav + main,
.research-nav + main,
.health-nav + main {
  width: min(1320px, 100%);
  padding: 0 clamp(18px, 3vw, 36px) 58px;
}

.finance-nav + main .research-hero,
.research-nav + main .research-hero,
.health-nav + main .health-hero {
  min-height: 222px;
  padding: 34px 0 27px;
}

.finance-nav + main .research-hero h1,
.research-nav + main .research-hero h1,
.health-nav + main .health-hero h1 {
  font-size: clamp(35px, 4vw, 57px);
  letter-spacing: -.07em;
}

.kicker,
.eyebrow,
.finance-nav + main .kicker,
.research-nav + main .eyebrow,
.health-nav + main .kicker {
  color: var(--stitch-red);
}

.hero-note,
.hero-folio,
.hero-brief {
  border-top-color: var(--stitch-ink);
}

.query-deck,
.intake-deck,
.triage-shell,
.research-workspace,
.health-result,
.panel,
.project-bar {
  border-radius: 10px;
}

.query-deck {
  box-shadow: 0 20px 48px rgba(36, 49, 45, .13);
}

.query-deck:before {
  display: none;
}

.query-deck label > span {
  color: #f1f6f2;
  font-size: 10px;
  font-weight: 700;
}

.query-deck input {
  color: #26332e;
  background: #f1efe9;
  border-color: #d9d5cc;
  color-scheme: light;
}

.query-deck input::placeholder {
  color: #6e756f;
  opacity: 1;
}

.query-deck input::-webkit-calendar-picker-indicator {
  opacity: .72;
}

.market-selector > span,
.market-selector button {
  font-size: 11px;
  font-weight: 600;
}

.market-selector > span {
  color: #b9c8c2;
}

.research-button,
.index-button,
.assess-button,
.research-command button,
.follow-up-submit,
#sendHealthFollowUp {
  border-radius: 7px;
  background: var(--stitch-red);
}

.research-button:hover,
.index-button:hover,
.assess-button:hover,
.research-command button:hover,
.follow-up-submit:hover,
#sendHealthFollowUp:hover {
  background: var(--stitch-red-dark);
}

.market-news-heading,
.security-header {
  border-bottom-color: var(--stitch-ink);
}

.news-card,
.news-skeleton article,
.metric-strip,
.panel,
.source-footer {
  border-color: var(--stitch-line);
}

.news-card {
  background: rgba(255, 253, 247, .72);
}

.news-card:first-child {
  background: var(--stitch-ink);
}

.metric-strip,
.panel,
.project-bar,
.triage-shell,
.research-workspace,
.health-result {
  box-shadow: var(--stitch-shadow);
}

.panel,
.project-bar,
.research-workspace,
.triage-shell,
.health-result {
  background: rgba(255, 253, 247, .86);
}

.metric-strip {
  background: rgba(255, 253, 247, .78);
}

.metric {
  border-right-color: var(--stitch-line);
}

.ai-report {
  border-radius: 10px;
  background: var(--stitch-ink);
  box-shadow: var(--stitch-shadow);
}

.ai-report .panel-heading button,
.modal-primary,
.auth-submit {
  border-radius: 7px;
}

.quality-note,
.markdown-body blockquote,
.urgency-banner,
.report-reading,
.visual-reading {
  background: var(--stitch-surface-muted);
}

/* Research desk: retain the dark indexing rail from the Stitch screen while
   leaving the source ledger and report area light enough for long content. */
.intake-deck {
  background: var(--stitch-navy);
  box-shadow: 0 20px 48px rgba(36, 58, 82, .16);
}

.intake-deck .index-button {
  background: var(--stitch-red);
}

.intake-deck .index-button:hover {
  background: var(--stitch-red-dark);
}

.research-workspace {
  overflow: hidden;
}

.source-ledger,
.analysis-desk {
  background: rgba(255, 253, 247, .78);
}

.source-ledger {
  border-right-color: var(--stitch-line);
}

.mode-switch button.active,
.mode-switch button:hover {
  background: var(--stitch-ink);
  border-color: var(--stitch-ink);
}

.research-command button {
  background: var(--stitch-red);
}

.report-empty {
  min-height: 300px;
}

/* Health intake: keep the safety rail visible, but make its container match
   the rounded, paper-like reference card. */
.triage-index {
  background: var(--stitch-navy);
  border-right-color: rgba(255, 255, 255, .15);
}

.health-form,
.medical-sources,
.health-report {
  background: transparent;
}

/* Clip the dark intake rail to the rounded shell. Without this, its opaque
   rectangular background paints over the shell's top-left and bottom-left
   corner curves. */
.triage-shell {
  overflow: hidden;
}

.health-form textarea,
.health-form input,
.health-form select,
.follow-up-composer textarea,
.research-command textarea,
.url-intake textarea,
.query-deck input,
.modal-field input {
  border-radius: 6px;
  border-color: var(--stitch-line);
  background: rgba(255, 253, 247, .8);
}

.project-bar select,
.health-form select {
  color-scheme: light;
}

.project-bar select option,
.health-form select option {
  background: var(--stitch-surface);
  color: var(--stitch-ink);
}

.query-deck input,
.url-intake textarea {
  border-color: rgba(255, 255, 255, .18);
}

.health-form textarea:focus,
.health-form input:focus,
.health-form select:focus,
.follow-up-composer textarea:focus,
.research-command textarea:focus,
.modal-field input:focus {
  border-color: var(--stitch-ink);
  box-shadow: inset 3px 0 var(--stitch-red);
}

.privacy-strip {
  gap: 0;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: var(--stitch-shadow);
}

.privacy-strip > div {
  background: rgba(255, 253, 247, .72);
}

.finance-page main {
  width: min(1320px, 100%);
  padding-inline: clamp(18px, 3vw, 36px);
}

/* Finance workbench: keep the page compact and give each job a clear home.
   Before research, the filter sits left and the market wire fills the right
   column. Once data exists, that wire moves below the filter, the charts stay
   in the center, and the report/follow-up stack occupies the right. */
.finance-workspace {
  display: grid;
  grid-template-columns: minmax(235px, .78fr) minmax(0, 1.75fr) minmax(300px, .92fr);
  grid-template-rows: auto minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  width: 100%;
}

/* The landing state is intentionally a two-column reading desk: the user can
   browse the selected market's news immediately, without an empty center card.
   The center chart column only enters the grid after a research request has
   produced data. */
.finance-workspace:not(.has-research) {
  grid-template-columns: minmax(235px, .78fr) minmax(0, 2.67fr);
  grid-template-rows: auto;
}

.finance-workspace:not(.has-research) > .finance-center-column {
  display: none;
}

.finance-workspace.is-loading > .finance-center-column {
  display: block;
  grid-column: 2;
  grid-row: 1;
  margin-top: 0;
}

.finance-workspace.is-loading > .initial-state {
  display: none;
}

.finance-workspace:not(.has-research) > .initial-state {
  grid-column: 2;
  grid-row: 1;
}

.finance-workspace:not(.has-research) .market-news-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

@media (min-width: 901px) {
  .finance-workspace:not(.has-research) > .initial-state {
    margin-top: -10px;
  }
}

.finance-workspace:not(.has-research) .news-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto;
}

.finance-workspace:not(.has-research) .news-card:first-child,
.finance-workspace:not(.has-research) .news-skeleton article:first-child {
  grid-column: 1 / -1;
  grid-row: auto;
  min-height: 230px;
}

.finance-workspace > .query-deck {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  padding: 18px 16px;
}

.finance-center-column {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-width: 0;
}

.finance-workspace > .initial-state {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.finance-workspace.has-research > .initial-state {
  grid-column: 1;
  grid-row: 2;
}

.finance-report-column {
  grid-column: 3;
  grid-row: 1 / span 2;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.finance-empty-state {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 372px;
  padding: 42px 34px;
  border: 1px solid var(--stitch-line);
  border-radius: 10px;
  background: rgba(255, 253, 247, .72);
  box-shadow: var(--stitch-shadow);
}

.finance-empty-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: 27px;
  border-radius: 7px;
  color: #fff;
  background: var(--stitch-red);
  font: 15px/1 "DM Mono", monospace;
  box-shadow: 5px 5px 0 rgba(210, 84, 53, .16);
}

.finance-empty-state p {
  margin: 0 0 11px;
  color: var(--stitch-red);
  font: 10px/1.4 "DM Mono", monospace;
  letter-spacing: .14em;
}

.finance-empty-state h2 {
  margin: 0 0 13px;
  color: var(--stitch-ink);
  font: 600 clamp(25px, 3vw, 39px)/1.3 "Noto Serif SC", serif;
  letter-spacing: -.08em;
}

.finance-empty-state small {
  max-width: 360px;
  color: var(--stitch-muted);
  font-size: 12px;
  line-height: 1.8;
}

.finance-workspace > .query-deck form {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  width: 100%;
  min-width: 0;
}

.finance-workspace > .query-deck form > label,
.finance-workspace > .query-deck .research-button {
  grid-column: auto;
  min-width: 0;
  max-width: 100%;
}

.finance-workspace > .query-deck .research-button {
  margin-top: 8px;
}

.finance-query-actions {
  display: grid;
  grid-template-columns: minmax(72px, .32fr) minmax(0, 1fr);
  gap: 10px;
  width: 100%;
  min-width: 0;
  margin-top: 8px;
}

.finance-workspace > .query-deck .finance-query-actions .research-button {
  margin-top: 0;
}

.finance-clear-button {
  min-width: 0;
  height: 48px;
  padding: 0 12px;
  border: 1px solid #60756e;
  border-radius: 7px;
  color: #d2ddd8;
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}

.finance-clear-button:hover {
  border-color: #91a59d;
  color: #fff;
  background: #1d3932;
}

.finance-clear-button:disabled {
  opacity: .55;
  cursor: wait;
}

.finance-workspace > .query-deck form input {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

/* iOS WebKit incorrectly adds horizontal padding to 100%-wide date inputs.
   Keep the native date picker, but remove the padding that makes the control
   paint past the query card's right inset on iPhone and iPad. */
@supports (-webkit-touch-callout: none) {
  .finance-workspace > .query-deck form input[type="date"] {
    padding-inline: 0;
  }
}

/* The legacy finance stylesheet gives a focused field a dark surface while
   this theme keeps the input text dark, which makes selected dates appear to
   disappear on mobile. Keep the active value readable in both themes. */
.finance-workspace > .query-deck form input[type="date"]:focus {
  color: var(--stitch-ink);
  background: var(--stitch-surface);
  border-color: var(--stitch-red);
}

/* Chrome desktop adds generous internal spacing around its native calendar
   button. Remove that extra box spacing while keeping the native picker. */
.finance-workspace > .query-deck form input[type="date"]::-webkit-calendar-picker-indicator {
  margin-right: 0 !important;
  padding: 0 !important;
}

@media (min-width: 701px) {
  html:not(.has-custom-date-picker) .finance-workspace > .query-deck form input[type="date"] {
    padding-right: 8px;
  }

  html:not(.has-custom-date-picker) .finance-workspace > .query-deck form input[type="date"]::-webkit-calendar-picker-indicator {
    width: 20px;
    height: 20px;
  }
}

/* Android Chrome and desktop Safari use the themed date dialog. Hide their
   inconsistent native affordances and provide one clear arrow in the field. */
html.has-custom-date-picker .finance-workspace > .query-deck form input[type="date"] {
  position: relative;
  -webkit-appearance: none;
  appearance: none;
  touch-action: pan-y;
  padding: 0 44px 0 14px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1.5 1.5 7 7l5.5-5.5' stroke='%23343f3b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  background-size: 14px 9px !important;
}

html[data-theme="dark"].has-custom-date-picker .finance-workspace > .query-deck form input[type="date"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1.5 1.5 7 7l5.5-5.5' stroke='%23dce5e0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

html.has-custom-date-picker .finance-workspace > .query-deck form input[type="date"]::-webkit-calendar-picker-indicator {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0;
  cursor: pointer;
}

html.has-custom-date-picker .finance-workspace > .query-deck form input[type="date"]::-webkit-date-and-time-value {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left;
}

@media (max-width: 700px) {
  html.is-android .finance-workspace > .query-deck form input[type="date"] {
    padding-left: 10px !important;
  }
}

.android-date-dialog {
  --date-dialog-bg: #fbf8f0;
  --date-dialog-header: #f0eadf;
  --date-dialog-ink: #17211d;
  --date-dialog-muted: #6e7771;
  --date-dialog-line: #d8d0c1;
  --date-dialog-pressed: #ece5d8;
  --date-dialog-backdrop: rgba(17, 24, 21, .42);
  --date-dialog-shadow: rgba(36, 42, 38, .3);
  color-scheme: light;
  width: min(430px, calc(100vw - 28px));
  max-width: none;
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--date-dialog-line);
  border-radius: 14px;
  background: var(--date-dialog-bg);
  color: var(--date-dialog-ink);
  box-shadow: 0 28px 80px var(--date-dialog-shadow);
}

html[data-theme="dark"] .android-date-dialog {
  --date-dialog-bg: #111c18;
  --date-dialog-header: #172821;
  --date-dialog-ink: #eef3ef;
  --date-dialog-muted: #9baba3;
  --date-dialog-line: #385047;
  --date-dialog-pressed: #263b33;
  --date-dialog-backdrop: rgba(7, 13, 11, .72);
  --date-dialog-shadow: rgba(0, 0, 0, .48);
  color-scheme: dark;
}

.android-date-dialog::backdrop {
  background: var(--date-dialog-backdrop);
  backdrop-filter: blur(2px);
}

.android-date-dialog:focus {
  outline: 0;
}

.android-date-dialog button:focus-visible {
  outline: 2px solid #d25435;
  outline-offset: 1px;
}

.android-date-dialog-shell > header {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 9px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--date-dialog-line);
  background: var(--date-dialog-header);
}

.android-date-dialog-shell > header small {
  color: #ef795b;
  font: 600 11px/1.2 "DM Mono", monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.android-date-dialog-shell > header strong {
  color: var(--date-dialog-ink);
  font: 600 28px/1.25 "Noto Serif SC", serif;
}

.android-date-month-bar {
  height: 58px;
  display: grid;
  grid-template-columns: 46px 1fr 46px;
  align-items: center;
  padding: 0 12px;
}

.android-date-month-bar b {
  text-align: center;
  font-size: 17px;
}

.android-date-month-bar button {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: var(--date-dialog-ink);
  font: 30px/1 sans-serif;
}

.android-date-month-bar button:last-child {
  justify-self: end;
}

.android-date-month-bar button:active {
  border-color: var(--date-dialog-line);
  background: var(--date-dialog-pressed);
}

.android-date-weekdays,
.android-date-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.android-date-weekdays {
  padding: 5px 16px 8px;
  color: var(--date-dialog-muted);
  font: 500 11px/1 "DM Mono", monospace;
  text-align: center;
}

.android-date-grid {
  min-height: 264px;
  gap: 3px;
  padding: 5px 16px 16px;
}

.android-date-grid button,
.android-date-grid span {
  min-width: 0;
  aspect-ratio: 1;
}

.android-date-grid button {
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: var(--date-dialog-ink);
  font-size: 15px;
}

.android-date-grid button.is-today {
  border-color: #b99652;
}

.android-date-grid button.is-selected {
  border-color: #d25435;
  background: #d25435;
  color: #fff;
  font-weight: 700;
}

.android-date-grid button:active:not(.is-selected) {
  background: var(--date-dialog-pressed);
}

.android-date-dialog-shell > footer {
  min-height: 68px;
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  padding: 11px 14px;
  border-top: 1px solid var(--date-dialog-line);
}

.android-date-dialog-shell > footer button {
  min-width: 72px;
  padding: 0 13px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--date-dialog-muted);
  font-weight: 600;
}

.android-date-dialog-shell > footer button.primary {
  border-color: #d25435;
  background: #d25435;
  color: #fff;
}

@media (max-width: 420px) {
  .android-date-dialog-shell > header {
    min-height: 96px;
    padding: 18px 20px;
  }

  .android-date-dialog-shell > header strong {
    font-size: 24px;
  }

  .android-date-dialog-shell > footer button {
    min-width: 66px;
  }
}

.finance-workspace > .query-deck .market-selector {
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 15px;
  padding-bottom: 13px;
}

.finance-workspace > .query-deck .market-selector > span {
  flex: 0 0 100%;
  margin: 0 0 3px;
}

.finance-workspace > .query-deck .market-selector button {
  flex: 1 1 calc(33.333% - 5px);
  min-width: 0;
  padding-inline: 5px;
}

/* English market names are longer than the Chinese labels. Give them a
   calmer two-column rhythm so country names stay on one line instead of
   breaking unevenly inside the three-column Chinese selector. */
html[lang="en"] .finance-workspace > .query-deck .market-selector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  column-gap: 8px;
  row-gap: 7px;
  overflow-x: visible;
}

html[lang="en"] .finance-workspace > .query-deck .market-selector > span {
  grid-column: 1 / -1;
  flex: none;
  margin: 0 0 2px;
}

html[lang="en"] .finance-workspace > .query-deck .market-selector button {
  width: 100%;
  min-width: 0;
  height: 31px;
  padding-inline: 8px;
  white-space: nowrap;
  font-size: 10px;
  letter-spacing: 0;
}

.finance-workspace > .query-deck .period-row {
  flex-wrap: wrap;
  gap: 5px;
}

.finance-workspace > .query-deck .period-row > span,
.finance-workspace > .query-deck .period-row small {
  flex: 0 0 100%;
  margin-left: 0;
  margin-right: 0;
}

.finance-workspace > .query-deck .period-row small {
  margin-top: 3px;
}

.finance-center-column .research-board {
  padding-top: 0;
}

.finance-center-column .security-header {
  grid-template-columns: 1fr;
  gap: 13px;
  padding: 0 0 18px;
}

.finance-center-column .live-price {
  justify-content: flex-start;
}

.finance-center-column .range-stamp {
  border-top: 1px solid var(--stitch-line);
  border-left: 0;
  padding: 12px 0 0;
}

.finance-center-column .metric-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.finance-center-column .metric:nth-child(2n) {
  border-right: 0;
}

.finance-center-column .metric:nth-child(-n + 4) {
  border-bottom: 1px solid var(--stitch-line);
}

.finance-center-column .two-column,
.finance-center-column .backtest-layout {
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
}

/* The generic panel margin and the two-column grid gap used to stack on top
   of each other, leaving an unnecessarily large gap between Technicals and
   Valuation. Keep one consistent card gap inside this group. */
.finance-center-column .two-column {
  margin-top: 24px;
}

.finance-center-column .two-column > .panel {
  margin-top: 0;
}

.finance-center-column .panel {
  min-width: 0;
  padding: 18px 16px;
}

.finance-center-column .technical-readout {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* The technical panel now carries MACD, RSI and KDJ together. Keep enough
   vertical room for the three synchronized plots and the expanded readout. */
body.finance-page .finance-center-column .technical-chart {
  height: 420px;
}

body.finance-page .finance-center-column .technical-readout {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  row-gap: 14px;
}

body.finance-page .finance-center-column .technical-readout div {
  min-width: 0;
}

body.finance-page .finance-center-column .technical-readout div span {
  line-height: 1.25;
  white-space: normal;
}

.finance-center-column .fundamental-grid,
.finance-center-column .backtest-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.finance-center-column .panel-heading,
.finance-center-column .quality-note,
.finance-center-column .method-note {
  min-width: 0;
  overflow-wrap: anywhere;
}

.finance-center-column .price-chart {
  height: 380px;
}

.finance-center-column .technical-chart {
  height: 290px;
}

.finance-center-column .backtest-chart {
  height: 300px;
}

.finance-workspace .market-news-heading {
  display: block;
  padding-bottom: 13px;
}

.finance-workspace .market-news-heading h2 {
  font-size: 22px;
}

.finance-workspace .news-status {
  margin-top: 10px;
}

.finance-workspace .news-grid {
  grid-template-columns: 1fr;
  grid-template-rows: none;
  border-left: 0;
}

.finance-workspace .news-card,
.finance-workspace .news-skeleton article {
  min-height: 0;
  border-left: 1px solid var(--stitch-line);
}

.finance-workspace .news-card:first-child,
.finance-workspace .news-skeleton article:first-child {
  grid-row: auto;
  min-height: 0;
}

.finance-workspace .news-card > a {
  padding: 14px 15px;
}

.finance-workspace .news-card:first-child > a {
  padding: 17px 15px;
}

.finance-workspace .news-card:first-child h3 {
  font-size: 18px;
  line-height: 1.45;
}

.finance-workspace .news-card:first-child p {
  -webkit-line-clamp: 3;
}

.finance-workspace .news-disclaimer {
  display: block;
  font-size: 8px;
  line-height: 1.6;
}

.finance-workspace .news-disclaimer span {
  display: block;
}

.finance-report-column .ai-report {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: min(720px, calc(100dvh - 150px));
  max-height: none;
  margin: 0;
  border: 1px solid var(--stitch-line);
  overflow: hidden;
  backface-visibility: hidden;
  transform-origin: top right;
  view-transition-name: finance-report;
}

.finance-report-column .ai-report:not(.has-report-output):not(.is-expanded) {
  height: auto;
}

.finance-report-column .ai-report:not(.has-report-output):not(.is-expanded) .finance-report-scroll {
  flex: 0 0 auto;
  margin-block: 0;
  overflow: visible;
  padding-bottom: 18px;
  scrollbar-gutter: auto;
  overscroll-behavior: auto;
}

/* The shared reveal animation uses `forwards` fill, which leaves a zero-value
   transform behind and turns the report into a containing block for fixed
   descendants. Release that transform after the entrance animation so the
   viewport-docked scroll cue can use the real visual viewport. */
.finance-report-column .ai-report.reveal {
  animation-fill-mode: none;
}

body.finance-page.finance-report-open {
  overflow: hidden;
}

body.finance-page::after {
  position: fixed;
  z-index: 40;
  inset: 0;
  content: "";
  background: rgba(14, 20, 17, .58);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .26s ease, visibility 0s linear .26s;
}

body.finance-page.finance-report-open::after {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.finance-report-expand {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 4;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: var(--stitch-muted);
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, transform .2s ease;
}

.finance-report-expand:hover,
.finance-report-expand:focus-visible {
  color: var(--stitch-red);
  background: rgba(239, 121, 91, .12);
}

.finance-report-expand:focus-visible {
  outline: 2px solid var(--stitch-red);
  outline-offset: 2px;
}

.finance-report-expand:disabled {
  cursor: wait;
}

.finance-report-expand-icon {
  display: block;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.finance-report-expand-icon-close {
  display: none;
}

.finance-report-expand.is-expanded .finance-report-expand-icon-open {
  display: none;
}

.finance-report-expand.is-expanded .finance-report-expand-icon-close {
  display: block;
}

.finance-report-column .report-main > .panel-heading > div:first-child {
  padding-right: 34px;
}

.finance-report-column .ai-report.is-expanded {
  position: fixed;
  z-index: 60;
  top: max(var(--finance-report-expand-top, 14px), env(safe-area-inset-top));
  right: max(var(--finance-report-expand-right, 14px), env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  left: max(var(--finance-report-expand-left, 14px), env(safe-area-inset-left));
  width: auto;
  height: auto;
  max-height: none;
  margin: 0;
  border-radius: 14px;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

html.finance-report-transition::view-transition-old(root),
html.finance-report-transition::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

html.finance-report-transition::view-transition-group(finance-report),
html.finance-report-transition::view-transition-old(finance-report),
html.finance-report-transition::view-transition-new(finance-report) {
  animation-duration: 360ms;
  animation-timing-function: cubic-bezier(.22, .8, .24, 1);
}

html.finance-report-transition::view-transition-old(finance-report),
html.finance-report-transition::view-transition-new(finance-report) {
  mix-blend-mode: normal;
}

.finance-report-column .ai-report.is-expanded .finance-report-expand {
  top: 14px;
  right: 14px;
}

.finance-report-column .ai-report.is-expanded .finance-report-scroll {
  margin-block: 0 20px;
}

.finance-report-scroll {
  min-height: 0;
  flex: 1 1 auto;
  margin-block: 0 20px;
  overflow: auto;
  padding-bottom: 40px;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

/* The report itself is a dark reading surface even in the light theme. Keep
   its scrollbar on that same surface instead of showing the browser's white
   native track. */
.finance-report-scroll {
  scrollbar-width: thin;
  scrollbar-color: #5a7269 #0e1814;
}

.finance-report-scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.finance-report-scroll::-webkit-scrollbar-track {
  background: #0e1814;
}

.finance-report-scroll::-webkit-scrollbar-thumb {
  border: 2px solid #0e1814;
  border-radius: 999px;
  background: #5a7269;
}

.finance-report-scroll::-webkit-scrollbar-thumb:hover {
  background: #7d988a;
}

.finance-report-column .report-aside {
  display: none;
}

.finance-report-column .report-main {
  padding: 18px;
}

.finance-report-column .report-main > .panel-heading {
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}

.finance-report-column .report-actions {
  width: 100%;
}

.finance-report-column .report-actions button {
  flex: 1 1 0;
  min-width: 0;
  padding-inline: 9px;
}

.finance-report-column .report-actions button:first-child {
  flex: 1.35 1 0;
}

.finance-report-column .report-actions .report-pause {
  flex: 1 1 0;
}

.finance-report-column .report-actions .report-download {
  flex: 1 1 0;
  border: 1px solid #60756e;
  color: #d7dfdc;
  background: transparent;
}

.finance-report-column .report-actions .report-download:hover {
  background: #28443c;
}

.finance-report-column .report-actions button:disabled {
  opacity: 1;
  color: #f7fbf8;
  background: #984d39;
  cursor: wait;
}

.finance-report-column .report-actions button:disabled:hover {
  background: #984d39;
}

.finance-report-column .report-placeholder p {
  font-size: 15px;
}

.finance-report-column .report-content {
  font-size: 13px;
  line-height: 1.75;
}

/* Generated report notes use a pale surface in the light theme. The base
   report typography is intentionally light because the report itself is
   dark, so give this local block its own readable ink color. */
html:not([data-theme="dark"]) .finance-report-column .report-content.markdown-body blockquote {
  color: #4e5853;
}

html:not([data-theme="dark"]) .finance-report-column .report-content.markdown-body blockquote strong {
  color: #6c4d23;
}

.finance-scroll-cue {
  position: absolute;
  z-index: 3;
  right: 50%;
  bottom: 12px;
  display: inline-grid;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  min-height: 38px;
  padding: 0;
  border: 1px solid rgba(210, 84, 53, .72);
  border-radius: 50%;
  color: #fff;
  background: var(--stitch-red);
  box-shadow: 0 8px 20px rgba(16, 24, 20, .24);
  transform: translateX(50%);
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}

.finance-scroll-cue:hover {
  border-color: #f1c0b3;
  color: #fff;
  background: var(--stitch-red-dark);
  transform: translateX(50%) translateY(-2px);
}

.finance-scroll-cue:focus-visible {
  outline: 2px solid #f1c0b3;
  outline-offset: 3px;
}

.finance-scroll-cue-icon {
  display: block;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.finance-report-column .ai-report .finance-scroll-cue {
  color: #fff;
  background: var(--stitch-red);
  border-color: rgba(255, 255, 255, .28);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .32);
}

.finance-report-column .ai-report .finance-scroll-cue:hover {
  color: #fff;
  border-color: #f1c0b3;
  background: var(--stitch-red-dark);
}

.finance-report-column .ai-report .finance-scroll-cue.is-viewport-docked {
  position: fixed;
  z-index: 55;
  top: var(--finance-cue-top);
  right: auto;
  bottom: auto;
  left: var(--finance-cue-left);
  transform: translateX(-50%);
}

.finance-report-column .ai-report .finance-scroll-cue.is-viewport-docked:hover {
  transform: translateX(-50%) translateY(-2px);
}

.finance-report-column .ai-report.has-scroll-more::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  height: 64px;
  content: "";
  pointer-events: none;
}

.finance-report-column .ai-report.has-scroll-more::after {
  background: linear-gradient(to bottom, rgba(14, 24, 20, 0), rgba(14, 24, 20, .96));
}

.finance-report-column .ai-report.has-scroll-offset::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  height: 14px;
  content: "";
  background: #0e1814;
  pointer-events: none;
}

.finance-followup {
  position: relative;
  padding: 16px;
  border: 1px solid var(--stitch-line);
  border-radius: 10px;
  background: rgba(255, 253, 247, .86);
  box-shadow: var(--stitch-shadow);
}

.finance-followup-heading {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--stitch-line);
}

.finance-followup-heading span {
  color: var(--stitch-red);
  font: 9px/1.4 "DM Mono", monospace;
  letter-spacing: .12em;
}

.finance-followup-heading h3 {
  margin: 6px 0 0;
  color: var(--stitch-ink);
  font: 600 19px/1.35 "Noto Serif SC", serif;
}

.finance-followup-thread {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: min(330px, 42dvh);
  margin: 12px 0;
  overflow: auto;
  scroll-padding-block: 14px 42px;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

.finance-followup-thread.has-scrollable-content {
  padding-block: 14px 40px;
}

.finance-followup-thread.has-scroll-offset {
  position: relative;
}

.finance-followup-thread.has-scroll-offset::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  height: 8px;
  content: "";
  background: var(--stitch-surface);
  pointer-events: none;
}

.finance-followup-message {
  padding: 9px 10px;
  border: 1px solid var(--stitch-line);
  border-radius: 7px;
  color: var(--stitch-ink);
  font-size: 12px;
  line-height: 1.65;
}

.finance-followup-message.user {
  background: var(--stitch-surface-muted);
}

.finance-followup-message.assistant {
  background: var(--stitch-surface);
}

.finance-followup-message small {
  display: block;
  margin-bottom: 4px;
  color: var(--stitch-muted);
  font: 9px/1.4 "DM Mono", monospace;
}

.finance-followup-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.finance-followup-form textarea {
  width: 100%;
  min-height: 48px;
  resize: vertical;
  padding: 10px;
  border: 1px solid var(--stitch-line);
  border-radius: 7px;
  outline: 0;
  color: var(--stitch-ink);
  background: var(--stitch-paper);
  font-size: 12px;
  line-height: 1.55;
}

.finance-followup-form textarea:focus {
  border-color: var(--stitch-red);
  box-shadow: 0 0 0 3px rgba(210, 84, 53, .1);
}

.finance-followup-form button {
  min-height: 48px;
  padding: 0 12px;
  border: 0;
  border-radius: 7px;
  color: #fff;
  background: var(--stitch-red);
  font-size: 12px;
  font-weight: 600;
}

.finance-followup-form button:hover {
  background: var(--stitch-red-dark);
}

.finance-followup-form button:disabled {
  opacity: .55;
  cursor: wait;
}

.finance-followup > small {
  display: block;
  margin-top: 9px;
  color: var(--stitch-muted);
  font-size: 9px;
  line-height: 1.55;
}

.finance-followup-message .markdown-body {
  color: var(--stitch-ink);
  font-size: 12px;
  line-height: 1.65;
}

.finance-followup-message .markdown-body h1,
.finance-followup-message .markdown-body h2,
.finance-followup-message .markdown-body h3 {
  color: var(--stitch-ink);
  font-family: "Noto Serif SC", serif;
}

.finance-followup-message .markdown-body h1 {
  font-size: 18px;
}

.finance-followup-message .markdown-body h2 {
  font-size: 15px;
  border-bottom-color: var(--stitch-line);
}

.finance-followup-message .markdown-body h3 {
  font-size: 13px;
}

.finance-followup-message .markdown-body strong {
  color: var(--stitch-red-dark);
}

.finance-followup-message .markdown-body table {
  font-size: 11px;
}

.finance-followup-message .markdown-body th,
.finance-followup-message .markdown-body td {
  border-color: var(--stitch-line);
  padding: 5px 6px;
}

@media (max-width: 1080px) {
  .finance-workspace {
    grid-template-columns: minmax(220px, .75fr) minmax(0, 1.35fr) minmax(250px, .9fr);
    gap: 12px;
  }

  .finance-workspace > .query-deck {
    padding-inline: 12px;
  }

  .finance-workspace > .query-deck .market-selector button {
    font-size: 10px;
  }

  .finance-report-column .report-main {
    padding: 14px;
  }
}

@media (max-width: 900px) {
  .finance-workspace {
    display: block;
  }

  .finance-workspace:not(.has-research):not(.is-loading) > .finance-center-column {
    display: none;
  }

  .finance-workspace.is-loading > .finance-center-column {
    display: block;
  }

  .finance-center-column,
  .finance-workspace > .initial-state,
  .finance-report-column {
    margin-top: 16px;
  }

  .finance-empty-state {
    min-height: 260px;
    padding: 32px 24px;
  }

  .finance-center-column .research-board {
    padding-top: 0;
  }

  .finance-report-column .ai-report {
    height: auto;
    max-height: none;
  }

  .finance-report-column .ai-report:not(.has-report-output):not(.is-expanded) .finance-report-scroll {
    flex: 0 0 auto;
    margin-block: 0;
    overflow: visible;
    overscroll-behavior: auto;
    padding-bottom: 18px;
    scrollbar-gutter: auto;
    touch-action: pan-y;
  }

  .finance-report-column .ai-report.has-report-output {
    height: min(720px, calc(100dvh - 40px));
  }

  /* On a phone, expanding the report is a reading mode: use the whole
     viewport instead of retaining the desktop card's floating margins. */
  .finance-report-column .ai-report.is-expanded {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100vw;
    height: 100dvh;
    min-height: 100dvh;
    max-height: none;
    margin: 0;
    border-radius: 0;
  }

  .finance-report-column .ai-report.is-expanded .finance-report-expand {
    top: max(12px, env(safe-area-inset-top));
    right: max(12px, env(safe-area-inset-right));
  }

  .finance-report-column .ai-report.is-expanded .finance-report-scroll {
    margin-block: 0;
    padding-bottom: max(40px, env(safe-area-inset-bottom));
  }

  .finance-report-column .ai-report.has-report-output .finance-report-scroll,
  .finance-report-column .ai-report.is-expanded .finance-report-scroll,
  .finance-followup-thread {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: auto;
    touch-action: pan-y;
  }
}

@media (max-width: 650px) {
  body.finance-page,
  body.finance-page main,
  body.finance-page .finance-workspace,
  body.finance-page .finance-report-column {
    min-height: 0;
    height: auto;
  }

  .finance-workspace:not(.has-research) .news-grid {
    grid-template-columns: 1fr;
  }

  .finance-workspace > .query-deck {
    padding: 14px 12px;
  }

  .finance-empty-state h2 {
    font-size: 28px;
  }

  .finance-followup-form {
    grid-template-columns: 1fr;
  }

  /* iOS Safari zooms the page when a focused form control is smaller than
     16px. Keep the follow-up composer at the native readable size on phones
     so tapping it does not change the page scale. */
  .finance-followup-form textarea {
    font-size: 16px;
  }

  .finance-followup-form button {
    width: 100%;
  }
}

/* Account page */
.auth-layout {
  width: min(1260px, 100%);
  padding-inline: clamp(22px, 7vw, 96px);
}

.auth-brand {
  font-size: 21px;
  letter-spacing: -.5px;
}

.auth-brand span {
  width: 28px;
  height: 28px;
  margin-right: 7px;
  border-radius: 5px;
  background: var(--stitch-ink);
  font-size: 18px;
}

.auth-intro h1 {
  font-size: clamp(42px, 6vw, 76px);
}

.auth-card {
  border-color: var(--stitch-line);
  border-radius: 0;
  background: rgba(255, 253, 247, .9);
  box-shadow: 12px 13px 0 rgba(125, 152, 138, .18);
}

.auth-form input {
  border-radius: 6px;
  border-color: var(--stitch-line);
  background: rgba(255, 253, 247, .7);
}

.auth-submit {
  background: var(--stitch-ink);
  border-color: var(--stitch-ink);
}

.auth-submit:hover {
  background: var(--stitch-red);
  border-color: var(--stitch-red);
}

/* Mobile: the reference uses a centered wordmark and a compact menu trigger.
   Existing mobile menu behavior remains in shared-nav.js. */
@media (max-width: 900px) {
  .finance-nav.site-nav,
  .research-nav.site-nav,
  .health-nav.site-nav,
  .documents-nav.site-nav {
    height: 62px;
    padding: 0 13px;
  }

  .site-brand,
  .nav-actions {
    display: none;
  }

  .mobile-nav-bar {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto auto;
    align-items: center;
    width: 100%;
    gap: 8px;
  }

  .mobile-menu-toggle {
    width: 34px;
    height: 34px;
  }

  .mobile-menu-toggle .brand-seal {
    width: 34px;
    height: 34px;
    border-radius: 5px;
    background: var(--stitch-ink);
    box-shadow: none;
    font-size: 17px;
  }

  .mobile-current-section {
    position: static;
    min-width: 0;
    max-width: 100%;
    transform: none;
    color: var(--stitch-ink);
    font-size: 14px;
    text-align: center;
  }

  .mobile-current-section:after {
    background: var(--stitch-red);
  }

  .mobile-nav-bar .language-icon-toggle {
    margin-left: 0;
    min-width: 50px;
    height: 30px;
  }

  .site-nav nav.site-nav-menu {
    top: 55px;
    border-color: var(--stitch-line);
    border-radius: 10px;
    background: rgba(255, 253, 247, .97);
    box-shadow: 0 18px 40px rgba(47, 46, 39, .18);
  }

  .site-nav nav.site-nav-menu a.active {
    background: rgba(210, 84, 53, .1);
    color: var(--stitch-red);
  }

  .finance-nav + main,
  .research-nav + main,
  .health-nav + main {
    padding: 0 12px calc(28px + env(safe-area-inset-bottom));
  }

  .finance-nav + main .research-hero,
  .research-nav + main .research-hero,
  .health-nav + main .health-hero {
    min-height: 0;
    padding: 28px 2px 24px;
  }

  .finance-nav + main .research-hero h1,
  .research-nav + main .research-hero h1,
  .health-nav + main .health-hero h1 {
    font-size: clamp(31px, 9vw, 39px);
    line-height: 1.14;
  }

  .finance-nav + main .research-hero .kicker,
  .research-nav + main .research-hero .eyebrow,
  .health-nav + main .health-hero .kicker {
    margin-bottom: 8px;
  }

  .hero-note,
  .hero-folio,
  .hero-brief {
    display: none;
  }

  .query-deck,
  .intake-deck,
  .triage-shell,
  .research-workspace,
  .health-result,
  .panel,
  .project-bar {
    border-radius: 9px;
  }

  .project-bar label {
    overflow: hidden;
  }

  .project-bar label > span,
  .project-bar select {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .project-bar.has-account-sync {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px;
    grid-template-rows: 64px 48px;
    align-items: stretch;
    height: auto;
    min-height: 112px;
  }

  .project-bar.has-account-sync .project-stats {
    display: none;
  }

  .project-bar.has-account-sync label {
    grid-column: 1 / -1;
    grid-row: 1;
    width: 100%;
    height: 64px;
    padding: 8px 14px;
    border-right: 0;
    border-bottom: 1px solid var(--stitch-line);
  }

  .project-bar.has-account-sync > .sync-project-button {
    grid-column: 1;
    grid-row: 2;
    height: 48px;
    margin-left: 0;
    border-left: 0;
  }

  .project-bar.has-account-sync > .new-project-button {
    grid-column: 2;
    grid-row: 2;
    height: 48px;
    margin-left: 0;
  }

  .project-bar.has-account-sync > .delete-project-button {
    grid-column: 3;
    grid-row: 2;
    height: 48px;
    margin-left: 0;
  }

  .query-deck {
    box-shadow: 0 14px 32px rgba(36, 49, 45, .1);
  }

  .news-card,
  .news-skeleton article {
    border-color: var(--stitch-line);
  }

  .panel {
    box-shadow: 0 10px 26px rgba(47, 46, 39, .06);
  }

  .triage-shell,
  .research-workspace {
    overflow: hidden;
  }

  .auth-layout {
    gap: 30px;
    padding: 26px 18px calc(30px + env(safe-area-inset-bottom));
  }

  .auth-card {
    box-shadow: 8px 9px 0 rgba(125, 152, 138, .18);
  }
}

@media (max-width: 700px) {
  .app-shell {
    background: var(--stitch-paper);
  }

  .sidebar {
    background: var(--stitch-paper);
  }

  .topbar {
    height: auto;
    min-height: 66px;
    padding: 18px 16px 13px;
  }

  .topbar-title > div {
    padding-bottom: 0;
  }

  .topbar h1 {
    font-size: 17px;
  }

  .messages {
    padding: 24px 16px;
  }

  .welcome {
    margin-top: 30px;
  }

  .welcome-orb {
    width: 36px;
    height: 36px;
    margin-bottom: 15px;
    font-size: 23px;
  }

  .welcome h2 {
    margin-top: 8px;
    font-size: clamp(29px, 8.5vw, 37px);
    letter-spacing: -1.8px;
  }

  .welcome > p:not(.eyebrow) {
    font-size: 13px;
    line-height: 1.75;
  }

  .welcome-products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 21px;
  }

  .welcome-product {
    min-height: 96px;
    padding: 10px 9px 11px;
    border-radius: 8px;
  }

  .welcome-product-icon {
    width: 22px;
    height: 22px;
    margin-bottom: 9px;
    font-size: 13px;
  }

  .welcome-product strong {
    font-size: 11px;
  }

  .welcome-product small {
    margin-top: 3px;
    font-size: 8px;
  }

  .welcome-product > b {
    right: 8px;
    bottom: 8px;
    font-size: 12px;
  }

  .suggestions {
    gap: 7px;
    margin-top: 21px;
  }

  .suggestions button {
    padding: 8px 11px;
    font-size: 11px;
  }

  .composer-zone {
    padding: 0 12px calc(13px + env(safe-area-inset-bottom));
  }

  .composer {
    min-height: 58px;
    border-radius: 13px;
    padding: 8px;
  }

  .send-button {
    width: 36px;
    height: 36px;
  }
}

html[data-theme="dark"] {
  & {
    --stitch-paper: #111512;
    --stitch-surface: #18201c;
    --stitch-surface-muted: #202a24;
    --stitch-ink: #e9eee9;
    --stitch-muted: #a6b0a9;
    --stitch-line: #34443b;
    --stitch-red: #ef795b;
    --stitch-red-dark: #d65d42;
    --stitch-sage: #91ad9c;
    --stitch-navy: #1b2f43;
    --stitch-shadow: 0 18px 42px rgba(0, 0, 0, .24);
    --ink: var(--stitch-ink);
    --paper: var(--stitch-paper);
    --card: var(--stitch-surface);
    --line: var(--stitch-line);
    --muted: var(--stitch-muted);
    --accent: var(--stitch-red);
    --red: var(--stitch-red);
    --sage: var(--stitch-sage);
    --medical: #71b394;
    --chart-grid: #2f3c35;
    --chart-marker: #627268;
    --chart-tooltip: rgba(5, 12, 9, .97);
  }

  &,
  body,
  .app-shell,
  .sidebar,
  .workspace {
    background: var(--stitch-paper);
    color: var(--stitch-ink);
  }

  .finance-nav.site-nav,
  .research-nav.site-nav,
  .health-nav.site-nav,
  .documents-nav.site-nav,
  .topbar {
    background: rgba(17, 21, 18, .94);
    border-color: var(--stitch-line);
  }

  .site-nav nav.site-nav-menu {
    background: rgba(24, 32, 28, .98);
    border-color: var(--stitch-line);
  }

  .site-nav nav.site-nav-menu a.active {
    background: rgba(239, 121, 91, .14);
  }

  .finance-nav.site-nav .brand-seal,
  .research-nav.site-nav .brand-seal,
  .health-nav.site-nav .brand-seal,
  .documents-nav.site-nav .brand-seal {
    background: #263b32;
    border: 1px solid #4b655b;
    box-shadow: 0 0 0 1px rgba(239, 121, 91, .12);
    color: #f4f8f5;
  }

  .site-nav nav.site-nav-menu a.active,
  .site-nav nav.site-nav-menu a.active:hover,
  .site-nav nav.site-nav-menu a.active:focus-visible {
    background: transparent;
    color: var(--stitch-red);
  }

  .language-icon-toggle {
    background: rgba(255, 255, 255, .05);
    border-color: rgba(150, 172, 161, .38);
    color: var(--stitch-ink);
  }

  .language-icon-toggle[data-locale="en"] {
    color: var(--stitch-red);
  }

  .language-icon-toggle:hover,
  .language-icon-toggle:focus-visible {
    background: var(--stitch-surface-muted);
    border-color: var(--stitch-red);
    color: var(--stitch-red);
  }

  .panel,
  .project-bar,
  .triage-shell,
  .research-workspace,
  .source-ledger,
  .analysis-desk,
  .health-result,
  .health-follow-up,
  .report-upload,
  .report-image-card,
  .follow-up-composer,
  .metric-strip,
  .composer,
  .auth-card,
  .news-card,
  .welcome-product,
  .suggestions button,
  .finance-empty-state,
  .finance-followup,
  .finance-followup-message.assistant {
    background: var(--stitch-surface);
    border-color: var(--stitch-line);
  }

  .source-ledger > header,
  .desk-heading,
  .source-card,
  .source-empty,
  .privacy-strip,
  .privacy-strip > div,
  .consent-row,
  .report-drop {
    background: var(--stitch-surface-muted);
    border-color: var(--stitch-line);
    color: var(--stitch-ink);
  }

  .new-chat,
  .new-chat:hover,
  .new-chat:focus-visible {
    background: var(--stitch-red);
    border-color: var(--stitch-red);
    color: #fff;
  }

  /* Keep the send control readable against the dark composer surface. The
     light theme intentionally uses the ink-colored button above. */
  .send-button {
    background: var(--stitch-red);
    color: #fff;
    box-shadow: 0 4px 12px rgba(239, 121, 91, .24);
  }

  .send-button:hover {
    background: var(--stitch-red-dark);
    box-shadow: 0 6px 16px rgba(239, 121, 91, .3);
  }

  .query-deck,
  .intake-deck,
  .ai-report,
  .triage-index {
    background: #0e1814;
  }

  .finance-followup-message.user {
    background: var(--stitch-surface-muted);
  }

  .news-card:first-child {
    background: #0e1814;
    border-color: #365048;
  }

  .news-skeleton article {
    background: linear-gradient(100deg, rgba(28, 42, 36, .7) 20%, rgba(42, 57, 49, .95) 40%, rgba(28, 42, 36, .7) 60%);
  }

  .news-skeleton article:first-child {
    background-color: #1c2a24;
  }

  .query-deck input,
  .url-intake textarea,
  .project-bar select,
  .health-form textarea,
  .health-form input,
  .health-form select,
  .follow-up-composer textarea,
  .research-command textarea,
  .finance-followup-form textarea,
  .modal-field input,
  .auth-form input {
    background: #0f1b17;
    border-color: var(--stitch-line);
    color: var(--stitch-ink);
    color-scheme: dark;
  }

  .query-deck input::placeholder,
  .url-intake textarea::placeholder,
  .health-form input::placeholder,
  .health-form textarea::placeholder,
  .follow-up-composer textarea::placeholder,
  .research-command textarea::placeholder,
  .finance-followup-form textarea::placeholder,
  .modal-field input::placeholder,
  .auth-form input::placeholder {
    color: #89968e;
    opacity: 1;
  }

  .project-bar select option,
  .health-form select option {
    background: var(--stitch-surface-muted);
    color: var(--stitch-ink);
  }

  .mode-switch button {
    background: #141f1a;
    border-color: var(--stitch-line);
    color: var(--stitch-muted);
  }

  .mode-switch button:hover,
  .mode-switch button:focus-visible {
    background: var(--stitch-surface-muted);
    border-color: #52645a;
    color: var(--stitch-ink);
  }

  .mode-switch button.active,
  .mode-switch button.active:hover,
  .mode-switch button.active:focus-visible {
    background: var(--stitch-red);
    border-color: var(--stitch-red);
    box-shadow: inset -1px 0 rgba(255, 255, 255, .2);
    color: #fff;
  }

  .stock-field .suggestions,
  .suggestion-item,
  .suggestions button {
    background: var(--stitch-surface);
    border-color: var(--stitch-line);
    color: var(--stitch-ink);
  }

  .suggestion-item:hover,
  .suggestion-item.active,
  .suggestions button:hover {
    background: var(--stitch-surface-muted);
  }

  .message.user .message-content,
  .quality-note,
  .markdown-body blockquote,
  .urgency-banner,
  .report-reading,
  .visual-reading {
    background: var(--stitch-surface-muted);
  }

  .mobile-current-section,
  .finance-brand,
  .research-brand,
  .health-brand,
  .site-brand,
  .brand,
  .auth-brand {
    color: var(--stitch-ink);
  }

  .brand-mark {
    background: #263b32;
    border: 1px solid #4b655b;
    box-shadow: 0 0 0 1px rgba(239, 121, 91, .12);
    color: #f4f8f5;
  }

  body.finance-page::after {
    background: rgba(4, 10, 8, .72);
  }

  .finance-report-expand {
    color: #b5c3bb;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
  }

  .finance-report-expand:hover,
  .finance-report-expand:focus-visible {
    color: #fff;
    background: rgba(239, 121, 91, .16);
  }

  .auth-card {
    box-shadow: 8px 9px 0 rgba(145, 173, 156, .1);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
  }
}

/* Keep independent rounded surfaces visually separate across the functional
   pages. Internal sections and table cells intentionally remain connected;
   this rhythm only applies to sibling cards that form the page stack. */
:root {
  --stitch-card-gap: 14px;
}

.research-nav + main > .intake-deck,
.research-nav + main > .indexing-stage,
.research-nav + main > .research-workspace {
  margin-top: var(--stitch-card-gap);
}

.research-nav + main > .intake-deck {
  border: 1px solid var(--stitch-line);
}

.research-nav + main > .indexing-stage {
  overflow: hidden;
  border-radius: 10px;
}

.research-nav + main > .research-workspace {
  border-top: 1px solid var(--stitch-line);
}

.health-nav + main > .privacy-strip {
  margin-top: var(--stitch-card-gap);
  border-top: 1px solid var(--stitch-line);
}

.finance-workspace {
  gap: var(--stitch-card-gap);
}

.finance-report-column {
  gap: var(--stitch-card-gap);
}

.welcome-products,
.ai-stats,
.ai-insight-grid {
  gap: var(--stitch-card-gap);
}

@media (max-width: 900px) {
  .finance-center-column,
  .finance-workspace > .initial-state,
  .finance-report-column {
    margin-top: var(--stitch-card-gap);
  }
}

/* The desktop navigation is an inline row, not a filled panel. The dark
   theme's dropdown surface is kept for the mobile menu below its breakpoint. */
@media (min-width: 901px) {
  .site-nav nav.site-nav-menu,
  .site-nav nav.site-nav-menu a,
  .site-nav nav.site-nav-menu a:hover,
  .site-nav nav.site-nav-menu a:focus-visible,
  .site-nav nav.site-nav-menu a.active {
    background: transparent;
  }

  .site-nav nav.site-nav-menu {
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
  }

  /* The dark palette also styles the mobile menu surface. On desktop the
     same navigation is an unboxed inline row on every page. */
  html[data-theme="dark"] .site-nav nav.site-nav-menu {
    background: transparent;
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
  }
}

/* Keep the project selector on the same surface as the surrounding project
   bar. The native popup still receives the matching theme surface. */
.research-nav + main > .project-bar select {
  background: transparent;
  color: var(--stitch-ink);
}

.research-nav + main > .project-bar select option {
  background: var(--stitch-surface);
  color: var(--stitch-ink);
}

html[data-theme="dark"] {
  .research-nav + main > .project-bar select {
    background: transparent;
    color: var(--stitch-ink);
    color-scheme: dark;
  }

  .research-nav + main > .project-bar select option {
    background: var(--stitch-surface);
    color: var(--stitch-ink);
  }
}

/* Keep the primary page navigation readable at a glance. */
.site-nav nav a {
  font-size: 14px;
}

/* Make the research-project summary row readable without increasing its
   overall height or changing its responsive grid. */
.research-nav + main > .project-bar label > span {
  font-size: 10px;
}

.research-nav + main > .project-bar select {
  font-size: 16px;
}

.research-nav + main > .project-bar .project-stats span {
  font-size: 10px;
}

.research-nav + main > .project-bar .project-stats b {
  font-size: 16px;
}

.research-nav + main > .project-bar > button {
  font-size: 13px;
}

.research-nav + main > .project-bar > .sync-project-button {
  font-size: 11px;
}

/* The chat welcome suggestions share the generic `.suggestions` class. Keep
   that mobile spacing from leaking into the stock autocomplete dropdown. */
.finance-workspace > .query-deck .stock-field .suggestions {
  top: 100%;
  margin-top: 0;
}

/* Align the prescription-note label with the body copy's text line instead
   of leaving the smaller mono label visibly higher. */
.health-form .prescription-note {
  align-items: center;
}

.health-form .prescription-note b {
  line-height: 1.7;
}

@media (max-width: 720px) {
  .health-form .prescription-note {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: start;
  }
}

/* Health intake: share the stock-research deep green-black surfaces instead
   of introducing a separate blue palette for this page. */
.health-nav + main .triage-index,
.health-nav + main .report-upload,
.health-nav + main .health-loading {
  border-color: #365048;
  background: var(--stitch-ink);
  color: #f5f8f4;
}

.health-nav + main .report-upload > header {
  border-bottom-color: rgba(255, 255, 255, .18);
}

.health-nav + main .report-upload > header p,
.health-nav + main .report-upload .purpose-note,
.health-nav + main .report-upload .report-privacy {
  color: rgba(245, 248, 244, .72);
}

.health-nav + main .report-upload .image-purpose {
  border-color: rgba(255, 255, 255, .22);
}

.health-nav + main .report-upload .image-purpose button {
  border-color: rgba(255, 255, 255, .22);
  color: rgba(245, 248, 244, .76);
}

.health-nav + main .report-upload .image-purpose button.active {
  border-color: var(--stitch-red);
  background: var(--stitch-red);
  color: #fff;
}

.health-nav + main .severity-field input:checked + span {
  border-color: var(--stitch-red);
  background: var(--stitch-red);
  color: #fff;
}

.health-nav + main .report-upload .report-drop {
  border-color: rgba(255, 255, 255, .38);
  background: rgba(255, 253, 247, .08);
}

.health-nav + main .report-upload .report-drop > span:nth-of-type(2) {
  color: #f5f8f4 !important;
}

.health-nav + main .report-upload .report-drop small {
  color: rgba(245, 248, 244, .68);
}

.health-nav + main .report-upload .report-image-card {
  border-color: rgba(255, 255, 255, .2);
  background: rgba(255, 253, 247, .1);
}

.health-nav + main .report-upload .report-image-card b {
  color: #f5f8f4;
}

.health-nav + main .report-upload .report-image-card small {
  color: rgba(245, 248, 244, .68);
}

.health-nav + main > .privacy-strip > div:nth-child(2) {
  border-color: #365048;
  background: var(--stitch-ink);
}

.health-nav + main > .privacy-strip > div:nth-child(2) p {
  color: rgba(245, 248, 244, .72);
}

html[data-theme="dark"] .health-nav + main .triage-index,
html[data-theme="dark"] .health-nav + main .report-upload,
html[data-theme="dark"] .health-nav + main .health-loading,
html[data-theme="dark"] .health-nav + main > .privacy-strip > div:nth-child(2) {
  border-color: #365048;
  background: #0e1814;
}

/* Keep the remaining health sections on the same surface scale as stock
   research: paper, surface-muted, and the deep report surface above. */
.health-nav + main .triage-shell,
.health-nav + main .health-result,
.health-nav + main .health-follow-up {
  border-color: var(--stitch-line);
  background: rgba(255, 253, 247, .86);
}

.health-nav + main > .privacy-strip > div:not(:nth-child(2)) {
  border-color: var(--stitch-line);
  background: rgba(255, 253, 247, .72);
}

.health-nav + main .consent-row,
.health-nav + main .urgency-banner,
.health-nav + main .report-reading,
.health-nav + main .visual-reading {
  background: var(--stitch-surface-muted);
}

.health-nav + main .consent-row span,
.health-nav + main .health-footer,
.health-nav + main .medical-sources > p {
  color: var(--stitch-muted) !important;
}

.health-nav + main .health-follow-up {
  border-top-color: var(--stitch-ink);
}

.health-nav + main .follow-up-composer {
  background: var(--stitch-surface);
}

.health-nav + main .report-reading > button,
.health-nav + main .report-reading-detail {
  border-color: var(--stitch-line);
}

.health-nav + main .markdown-body th,
.health-nav + main .markdown-body blockquote {
  background: var(--stitch-surface-muted);
}

.health-nav + main .health-error {
  background: #f5ded7;
  color: #7b2c20;
}

html[data-theme="dark"] .health-nav + main .triage-shell,
html[data-theme="dark"] .health-nav + main .health-result,
html[data-theme="dark"] .health-nav + main .health-follow-up {
  background: var(--stitch-surface);
}

html[data-theme="dark"] .health-nav + main > .privacy-strip > div:not(:nth-child(2)) {
  background: var(--stitch-surface-muted);
}

html[data-theme="dark"] .health-nav + main .health-follow-up {
  border-top-color: #365048;
}

html[data-theme="dark"] .health-nav + main .health-error {
  background: #3a211b;
  color: #f2b1a1;
}

/* Source research uses the same surface hierarchy as stock research:
   deep query/report surfaces, a muted ledger rail, and a clean synthesis
   surface. */
.research-nav + main .project-bar,
.research-nav + main .research-workspace,
.research-nav + main .analysis-desk {
  border-color: var(--stitch-line);
  background: var(--stitch-surface);
}

.research-nav + main .intake-deck,
.research-nav + main .indexing-stage {
  border-color: #365048;
  background: var(--stitch-ink);
  color: #f5f8f4;
}

.research-nav + main .url-intake textarea,
.research-nav + main .research-command textarea,
.research-nav + main .follow-up-command textarea {
  border-color: #d9d5cc;
  background: #f1efe9;
  color: #26332e;
  color-scheme: light;
}

.research-nav + main .url-intake textarea::placeholder,
.research-nav + main .research-command textarea::placeholder,
.research-nav + main .follow-up-command textarea::placeholder {
  color: #6e756f;
  opacity: 1;
}

.research-nav + main .file-drop:hover,
.research-nav + main .file-drop.dragging {
  background: #173229;
}

.research-nav + main .source-ledger {
  border-color: var(--stitch-line);
  background: var(--stitch-surface-muted);
}

.research-nav + main .source-card:hover,
.research-nav + main .source-card:target,
.research-nav + main .source-card.graph-active {
  background: var(--stitch-surface);
  box-shadow: inset 3px 0 var(--stitch-red);
}

.research-nav + main .source-empty {
  background: transparent;
}

.research-nav + main .source-empty > span {
  border-color: var(--stitch-line);
}

.research-nav + main .project-bar > button:hover {
  background: var(--stitch-surface-muted);
}

.research-nav + main .report-empty,
.research-nav + main .report-content {
  background: transparent;
}

.research-nav + main .markdown-body th,
.research-nav + main .markdown-body blockquote,
.research-nav + main .evidence-chip {
  background: var(--stitch-surface-muted);
}

.research-nav + main .report-loading > i,
.research-nav + main .stream-status i {
  border-color: var(--stitch-line);
  border-top-color: var(--stitch-red);
}

.research-nav + main .research-follow-up {
  border-color: var(--stitch-line);
  background: var(--stitch-surface-muted);
}

html[data-theme="dark"] .research-nav + main .intake-deck,
html[data-theme="dark"] .research-nav + main .indexing-stage {
  border-color: #365048;
  background: #0e1814;
}

html[data-theme="dark"] .research-nav + main .url-intake textarea {
  border-color: var(--stitch-line);
  background: #0f1b17;
  color: var(--stitch-ink);
}

html[data-theme="dark"] .research-nav + main .research-command textarea,
html[data-theme="dark"] .research-nav + main .follow-up-command textarea {
  border-color: var(--stitch-line);
  background: #0f1b17;
  color: var(--stitch-ink);
  color-scheme: dark;
}

/* Finance lookup: keep the editable value readable and visually attached to
   its autocomplete list in both light and dark themes. */
.finance-workspace > .query-deck .stock-field > input,
.finance-workspace > .query-deck .stock-field > input:focus {
  color: var(--stitch-ink);
  background: var(--stitch-surface);
  border-color: var(--stitch-line);
  border-left-width: 1px;
  color-scheme: light;
  transition: border-color .18s ease, border-left-width .18s ease;
}

.finance-workspace > .query-deck .stock-field > input::placeholder {
  color: var(--stitch-muted);
  opacity: 1;
}

.finance-workspace > .query-deck .stock-field > input:focus {
  border-color: var(--stitch-red);
  border-left-width: 3px;
  box-shadow: none;
}

.finance-workspace > .query-deck .stock-field:has(.suggestions.open) > input {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.finance-workspace > .query-deck .stock-field .suggestions {
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--stitch-line);
  border-top: 0;
  border-radius: 0 0 6px 6px;
  background: var(--stitch-surface);
  box-shadow: 0 10px 18px -14px rgba(20, 30, 26, .38);
  border-left-width: 1px;
  transition: border-left-color .18s ease, border-left-width .18s ease, border-right-color .18s ease;
}

/* Keep the autocomplete panel visually connected to the focused input, so
   every edge of the active lookup uses the same orange accent. */
.finance-workspace > .query-deck .stock-field .suggestions {
  border-bottom-color: var(--stitch-red);
}

.finance-workspace > .query-deck .stock-field:has(> input:focus) .suggestions {
  border-left-width: 3px;
  border-left-color: var(--stitch-red);
  border-right-color: var(--stitch-red);
}

.finance-workspace > .query-deck .stock-field .suggestion-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 12px;
  height: auto;
  min-height: 50px;
  padding: 8px 14px;
  border: 0;
  border-top: 1px solid var(--stitch-line);
  border-radius: 0;
  background: var(--stitch-surface);
  color: var(--stitch-ink);
  text-align: left;
}

.finance-workspace > .query-deck .stock-field .suggestion-item:first-child {
  border-top: 0;
}

.finance-workspace > .query-deck .stock-field .suggestion-item:hover,
.finance-workspace > .query-deck .stock-field .suggestion-item.active {
  background: var(--stitch-surface-muted);
}

.finance-workspace > .query-deck .stock-field .suggestion-item b {
  min-width: 0;
  line-height: 1.35;
  overflow-wrap: anywhere;
  color: var(--stitch-ink);
}

.finance-workspace > .query-deck .stock-field .suggestion-item span {
  min-width: 0;
  line-height: 1.35;
  text-align: right;
  overflow-wrap: anywhere;
  color: var(--stitch-muted);
}

html[data-theme="dark"] .finance-workspace > .query-deck .stock-field > input,
html[data-theme="dark"] .finance-workspace > .query-deck .stock-field > input:focus {
  color-scheme: dark;
}

/* Keep the conversation title compact while making the edit action discoverable. */
.chat-title-block {
  min-width: 0;
  max-width: min(68vw, 620px);
}

.chat-title-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 7px;
  visibility: hidden;
}

.chat-title-row.is-ready {
  visibility: visible;
}

.chat-title-row h1 {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-title-edit {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: var(--stitch-muted);
  opacity: .72;
  position: relative;
  top: 3px;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease, opacity .18s ease, transform .18s ease;
}

.chat-title-edit:hover,
.chat-title-edit:focus-visible {
  color: var(--stitch-red);
  border-color: var(--stitch-line);
  background: var(--stitch-surface-muted);
  opacity: 1;
}

.chat-title-edit:focus-visible {
  outline: 2px solid var(--stitch-red);
  outline-offset: 2px;
}

.chat-title-edit:active {
  transform: scale(.92);
}

.chat-title-edit svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.chat-title-edit[hidden],
.chat-title-edit svg[hidden],
.chat-title-input[hidden] {
  display: none !important;
}

.chat-title-input {
  width: min(360px, 42vw);
  min-width: 120px;
  height: 31px;
  margin: 0;
  padding: 0 0 3px;
  border: 0;
  border-bottom: 1px solid var(--stitch-red);
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: var(--stitch-ink);
  font: 600 22px/1.35 "Noto Serif SC", serif;
  letter-spacing: -1px;
}

.chat-title-input:focus {
  border-bottom-color: var(--stitch-red);
  box-shadow: 0 2px 0 rgba(210, 84, 53, .14);
}

.chat-title-input::placeholder {
  color: var(--stitch-muted);
  opacity: .72;
}

@media (max-width: 700px) {
  .chat-title-block {
    max-width: calc(100vw - 145px);
  }

  .chat-title-row {
    gap: 4px;
  }

  .chat-title-input {
    width: min(220px, calc(100vw - 178px));
    min-width: 0;
    height: 26px;
    font-size: 17px;
    letter-spacing: -.8px;
  }

  .chat-title-edit {
    width: 22px;
    height: 22px;
    top: 2px;
  }

  .chat-title-edit svg {
    width: 13px;
    height: 13px;
  }
}


/* ===== merged from interaction.css ===== */
/* Keep touch feedback inside each control's designed shape. Mobile WebKit and
   Android WebView otherwise paint a rectangular tap highlight over circles,
   pills, links, and icon-only buttons. */
html {
  -webkit-tap-highlight-color: transparent;
}

:where(
  a,
  button,
  summary,
  label[for],
  input,
  textarea,
  select,
  [role="button"],
  [role="tab"],
  [role="radio"],
  [role="checkbox"],
  [role="menuitem"],
  [tabindex]:not([tabindex="-1"])
) {
  -webkit-tap-highlight-color: transparent;
}

:where(
  a,
  button,
  summary,
  label[for],
  [role="button"],
  [role="tab"],
  [role="radio"],
  [role="checkbox"],
  [role="menuitem"]
) {
  touch-action: manipulation;
}

:where(button, input[type="button"], input[type="submit"], input[type="reset"]) {
  -webkit-appearance: none;
  appearance: none;
  background-clip: padding-box;
}

/* Pointer taps should not leave a browser focus rectangle behind. Keyboard
   users still receive the page-specific :focus-visible treatment. */
:where(
  a,
  button,
  summary,
  [role="button"],
  [role="tab"],
  [role="radio"],
  [role="checkbox"],
  [role="menuitem"]
):focus:not(:focus-visible) {
  outline: none;
}


/* ===== merged from research-reference.css ===== */
/*
 * Source-based intelligence reference layer
 *
 * The research page already owns the data flow and all interaction hooks.
 * This file only reshapes those existing surfaces into the Stitch direction:
 * a dark source/workspace rail, paper-like reading surfaces, and editorial
 * mono/serif hierarchy. Keep this file scoped to the research page so the
 * other tools are not pulled into the same contrast system.
 */

.research-nav + main {
  --reference-workspace: #171817;
  --reference-workspace-deep: #0f1211;
  --reference-workspace-line: rgba(239, 240, 231, .17);
  --reference-workspace-muted: #a4aaa3;
  --reference-workspace-text: #f5f1e7;
  --reference-card-radius: 8px;
  width: min(1320px, 100%);
  padding-inline: clamp(18px, 3vw, 36px);
  --reference-reading: var(--stitch-surface, #fffdf7);
  --reference-reading-muted: var(--stitch-surface-muted, #f0ece2);
  --reference-reading-text: var(--stitch-ink, #171817);
}

@media (max-width: 900px) {
  .research-nav + main {
    padding: 0 12px calc(28px + env(safe-area-inset-bottom));
  }
}

html[data-theme="dark"] .research-nav + main {
  --reference-workspace: #0e1814;
  --reference-workspace-deep: #09110e;
  --reference-workspace-line: rgba(221, 235, 226, .19);
  --reference-workspace-muted: #a5b5aa;
  --reference-workspace-text: #edf3ee;
  --reference-reading: #18201c;
  --reference-reading-muted: #202a24;
  --reference-reading-text: #e9eee9;
}

/* The reference has separated editorial panels instead of one large light
   rectangle. The JS still sees the same two-column workspace and its
   existing responsive collapse remains intact. */
.research-nav + main > .research-workspace {
  grid-template-columns: minmax(265px, 300px) minmax(0, 1fr);
  gap: 14px;
  min-height: 620px;
  border: 0;
  overflow: visible;
  background: transparent;
  box-shadow: none;
}

.research-nav + main > .research-workspace > .source-ledger,
.research-nav + main > .research-workspace > .analysis-desk {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--reference-workspace-line);
  border-radius: var(--reference-card-radius);
  background: var(--reference-workspace);
  color: var(--reference-workspace-text);
  box-shadow: 0 18px 42px rgba(11, 18, 15, .12);
}

.research-nav + main > .research-workspace > .source-ledger {
  border-right-color: var(--reference-workspace-line);
}

.research-nav + main .source-ledger > header,
.research-nav + main .desk-heading {
  height: 91px;
  border-color: var(--reference-workspace-line);
  background: var(--reference-workspace);
}

.research-nav + main .source-ledger header span,
.research-nav + main .desk-heading span {
  color: var(--stitch-red, #d25435);
}

.research-nav + main .source-ledger h2,
.research-nav + main .desk-heading h2 {
  color: var(--reference-workspace-text);
}

.research-nav + main .source-ledger header > b {
  color: var(--reference-workspace-muted);
}

.research-nav + main .source-list {
  background: var(--reference-workspace);
}

.research-nav + main .source-card {
  border-color: var(--reference-workspace-line);
  background: transparent;
  color: var(--reference-workspace-text);
}

.research-nav + main .source-card:hover,
.research-nav + main .source-card:target,
.research-nav + main .source-card.graph-active {
  background: rgba(255, 255, 255, .075);
  box-shadow: inset 3px 0 var(--stitch-red, #d25435);
}

.research-nav + main .source-card.graph-active h3,
.research-nav + main .source-card:hover h3 {
  color: #f2aa8e;
}

.research-nav + main .source-card h3 {
  color: var(--reference-workspace-text);
}

.research-nav + main .source-type,
.research-nav + main .source-card p,
.research-nav + main .source-meta,
.research-nav + main .remove-source,
.research-nav + main .source-origin-link {
  color: var(--reference-workspace-muted);
}

.research-nav + main .source-type i {
  background: #d0a65e;
}

.research-nav + main .source-card.graph-active .source-type i {
  background: var(--stitch-red, #d25435);
}

.research-nav + main .source-origin-link:hover,
.research-nav + main .remove-source:hover {
  color: #f2aa8e;
}

.research-nav + main .source-empty {
  color: var(--reference-workspace-muted);
  background: var(--reference-workspace);
}

.research-nav + main .source-empty > span {
  border-color: rgba(239, 240, 231, .35);
}

.research-nav + main .source-empty p {
  color: var(--reference-workspace-text);
}

.research-nav + main .analysis-desk {
  background: var(--reference-workspace);
}

.research-nav + main .desk-actions button {
  border-color: var(--reference-workspace-line);
  color: var(--reference-workspace-muted);
}

.research-nav + main .desk-actions button:not(:disabled):hover {
  border-color: var(--reference-workspace-text);
  color: var(--reference-workspace-text);
  background: rgba(255, 255, 255, .06);
}

.research-nav + main .mode-switch {
  padding-top: 17px;
}

.research-nav + main .mode-switch button {
  border-color: var(--reference-workspace-line);
  background: transparent;
  color: var(--reference-workspace-muted);
}

.research-nav + main .mode-switch button:hover,
.research-nav + main .mode-switch button.active {
  border-color: var(--stitch-red, #d25435);
  background: var(--stitch-red, #d25435);
  color: #fff;
}

.research-nav + main .research-command {
  border-bottom-color: var(--reference-workspace-line);
}

.research-nav + main .research-command textarea {
  border-color: #d9d5cc;
  background: var(--reference-reading-muted);
  color: var(--reference-reading-text);
}

.research-nav + main .research-command textarea:focus {
  border-color: #f2aa8e;
  box-shadow: inset 3px 0 var(--stitch-red, #d25435);
}

.research-nav + main .research-command textarea::placeholder {
  color: #6e756f;
  opacity: 1;
}

.research-nav + main .research-command button,
.research-nav + main .follow-up-submit {
  background: var(--stitch-red, #d25435);
}

.research-nav + main .research-command button:hover,
.research-nav + main .follow-up-submit:hover {
  background: var(--stitch-red-dark, #b9432a);
}

.research-nav + main .report-empty {
  min-height: 335px;
  background: var(--reference-workspace);
  color: var(--reference-workspace-text);
}

.research-nav + main .report-empty h3 {
  color: var(--reference-workspace-text);
}

.research-nav + main .report-empty p {
  color: var(--reference-workspace-muted);
}

.research-nav + main .evidence-rings i {
  border-color: rgba(239, 240, 231, .37);
}

.research-nav + main .report-loading {
  background: var(--reference-workspace);
  color: var(--reference-workspace-text);
}

.research-nav + main .report-loading b {
  color: var(--reference-workspace-text);
}

.research-nav + main .report-loading span,
.research-nav + main .stream-status {
  color: var(--reference-workspace-muted);
}

/* Long-form reports switch to a paper reading surface inside the dark desk,
   echoing the reference's light Evidence & Synthesis column. */
.research-nav + main .report-content {
  margin: 16px 16px 0;
  padding: 27px 32px 16px;
  border: 1px solid var(--reference-workspace-line);
  background: var(--reference-reading);
  color: var(--reference-reading-text);
}

.research-nav + main .report-content h1,
.research-nav + main .report-content h2,
.research-nav + main .report-content h3 {
  color: var(--reference-reading-text);
}

.research-nav + main .report-content h2 {
  border-bottom-color: var(--line);
}

.research-nav + main .report-content strong {
  color: var(--stitch-red, #d25435);
}

.research-nav + main .evidence-strip {
  margin: 16px 16px 0;
  padding: 15px 16px 16px;
  border: 1px solid var(--reference-workspace-line);
  background: var(--reference-reading-muted);
  color: var(--reference-reading-text);
}

.research-nav + main .evidence-strip > span {
  color: var(--reference-reading-text);
}

.research-nav + main .evidence-chip {
  border-color: var(--line);
  background: var(--reference-reading);
  color: var(--reference-reading-text);
}

.research-nav + main .evidence-chip:hover {
  border-color: var(--stitch-red, #d25435);
  color: var(--stitch-red, #d25435);
}

.research-nav + main .stream-status {
  margin-left: 16px;
  margin-right: 16px;
  border-top-color: var(--reference-workspace-line);
}

/* Continued inquiry uses the paper plane as a deliberate secondary rail. */
.research-nav + main .research-follow-up {
  margin: 28px 16px 4px;
  border-color: var(--reference-workspace-line);
  background: var(--reference-reading-muted);
  color: var(--reference-reading-text);
}

.research-nav + main .follow-up-heading {
  border-top-color: var(--reference-reading-text);
  border-bottom-color: var(--line);
}

.research-nav + main .follow-up-heading h3,
.research-nav + main .follow-up-entry > header h4 {
  color: var(--reference-reading-text);
}

.research-nav + main .follow-up-entry,
.research-nav + main .follow-up-list {
  border-color: var(--line);
}

.research-nav + main .follow-up-command textarea {
  border-color: var(--line);
  border-left-color: var(--stitch-red, #d25435);
  background: var(--reference-reading);
  color: var(--reference-reading-text);
}

.research-nav + main .follow-up-prompts button {
  border-color: var(--line);
  background: transparent;
  color: var(--reference-reading-text);
}

.research-nav + main .follow-up-prompts button:hover {
  border-color: var(--reference-reading-text);
}

@media (max-width: 1050px) {
  .research-nav + main > .research-workspace {
    grid-template-columns: 1fr;
    gap: 14px;
    min-height: 0;
  }

  .research-nav + main > .research-workspace > .source-ledger,
  .research-nav + main > .research-workspace > .analysis-desk {
    border-radius: var(--reference-card-radius);
  }

  .research-nav + main > .research-workspace > .source-ledger {
    border-bottom-color: var(--reference-workspace-line);
  }
}

@media (max-width: 720px) {
  .research-nav + main > .research-workspace {
    gap: 14px;
  }

  .research-nav + main .source-ledger > header,
  .research-nav + main .desk-heading {
    height: 78px;
  }

  .research-nav + main .report-content {
    margin: 13px 13px 0;
    padding: 22px 15px 13px;
  }

  .research-nav + main .evidence-strip,
  .research-nav + main .stream-status {
    margin-left: 13px;
    margin-right: 13px;
  }

  .research-nav + main .research-follow-up {
    margin: 24px 13px 2px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .research-nav + main > .research-workspace > .source-ledger,
  .research-nav + main > .research-workspace > .analysis-desk {
    box-shadow: none;
  }
}

/* Follow-up rail --------------------------------------------------------- */

.research-nav + main > .research-workspace.has-follow-up {
  grid-template-columns: minmax(265px, 300px) minmax(0, 1fr) minmax(300px, 360px);
  transition: grid-template-columns .46s cubic-bezier(.45, 0, .55, 1);
  will-change: grid-template-columns;
}

.research-nav + main > .research-workspace.follow-up-mode-collapsed {
  grid-template-columns: minmax(265px, 300px) minmax(0, 1fr) minmax(26px, 26px);
}

.research-nav + main > .research-workspace.follow-up-mode-floating {
  grid-template-columns: minmax(265px, 300px) minmax(0, 1fr);
}

.research-nav + main > .research-workspace.follow-up-view-transition {
  transition: none;
}

.research-nav + main > .research-workspace.follow-up-view-transition > .research-follow-up {
  z-index: 70;
  pointer-events: none;
  transform-origin: top left;
  will-change: transform;
  transition: none;
  animation: none;
}

.research-nav + main > .research-workspace.follow-up-view-transition > .analysis-desk {
  transform-origin: top left;
  will-change: transform;
}

.research-nav + main > .research-workspace > .research-follow-up {
  --follow-up-size-duration: .46s;
  --follow-up-width-delay: 0s;
  --follow-up-height-delay: 0s;
  --follow-up-fill-delay: .34s;
  grid-column: 3;
  grid-row: 1;
  align-self: start;
  min-width: 0;
  width: auto;
  height: clamp(520px, calc(100dvh - 120px), 900px);
  min-height: 0;
  max-height: none;
  interpolate-size: allow-keywords;
  position: sticky;
  top: 88px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  overflow: hidden;
  margin: 0;
  border: 1px solid var(--reference-workspace-line);
  border-radius: var(--reference-card-radius);
  background: var(--reference-reading-muted);
  color: var(--reference-reading-text);
  box-shadow: 0 18px 42px rgba(11, 18, 15, .12);
  overflow-anchor: none;
  transition:
    opacity .28s ease,
    transform .46s cubic-bezier(.45, 0, .55, 1),
    width var(--follow-up-size-duration) cubic-bezier(.45, 0, .55, 1) var(--follow-up-width-delay),
    height var(--follow-up-size-duration) cubic-bezier(.45, 0, .55, 1) var(--follow-up-height-delay),
    border-color .28s ease,
    border-radius .28s ease,
    background-color .28s ease,
    box-shadow .28s ease;
}

.research-nav + main > .research-workspace > .research-follow-up::after {
  content: "";
  position: absolute;
  z-index: 4;
  inset: 0;
  background: var(--reference-workspace);
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
  transition: opacity .08s ease;
}

.research-nav + main .research-follow-up .follow-up-heading {
  min-height: 0;
  position: relative;
  display: block;
  padding: 18px 17px 15px 28px;
  border-top: 3px solid var(--reference-workspace-deep);
  border-bottom: 1px solid var(--reference-workspace-line);
  background: var(--reference-workspace);
  color: var(--reference-workspace-text);
  cursor: default;
  user-select: none;
  border-top-left-radius: var(--reference-card-radius);
  border-top-right-radius: var(--reference-card-radius);
}

.research-nav + main .follow-up-edge-toggle {
  position: absolute;
  z-index: 5;
  top: 14px;
  left: 9px;
  width: 18px;
  height: 24px;
  display: grid;
  place-items: center start;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition:
    color .18s ease,
    top .46s cubic-bezier(.45, 0, .55, 1),
    left .46s cubic-bezier(.45, 0, .55, 1);
}

.research-nav + main .follow-up-edge-toggle::before {
  content: "";
  position: absolute;
  inset: -4px;
}

.research-nav + main .follow-up-edge-toggle:hover,
.research-nav + main .follow-up-edge-toggle:focus-visible {
  color: var(--stitch-red, #d25435);
  outline: 0;
}

.research-nav + main .follow-up-edge-toggle:focus-visible {
  outline: 0;
}

.research-nav + main .follow-up-edge-icon,
.research-nav + main .follow-up-action-icon {
  display: grid;
  place-items: center;
}

.research-nav + main .follow-up-edge-icon {
  width: 11px;
  height: 10px;
  animation: followUpEdgeHintRight 2.8s ease-in-out infinite;
}

.research-nav + main .follow-up-edge-toggle.is-collapsed .follow-up-edge-icon {
  animation-name: followUpEdgeHintLeft;
}

.research-nav + main .follow-up-edge-toggle:hover .follow-up-edge-icon,
.research-nav + main .follow-up-edge-toggle:focus-visible .follow-up-edge-icon {
  animation-play-state: paused;
}

.research-nav + main .follow-up-chevron {
  width: 11px;
  height: 10px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.research-nav + main .follow-up-chevron-expand {
  display: none;
}

.research-nav + main .follow-up-edge-toggle.is-collapsed .follow-up-chevron-collapse {
  display: none;
}

.research-nav + main .follow-up-edge-toggle.is-collapsed .follow-up-chevron-expand {
  display: block;
}

.research-nav + main .research-follow-up .follow-up-heading.dragging {
  cursor: grabbing;
}

.research-nav + main .follow-up-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.research-nav + main .follow-up-title-block > span {
  display: block;
  color: var(--stitch-red, #d25435);
  font: 500 8px var(--mono);
  letter-spacing: .13em;
}

.research-nav + main .follow-up-title-block h3 {
  margin: 7px 0 0;
  color: var(--reference-workspace-text);
  font: 600 20px/1.35 var(--serif);
  letter-spacing: -.04em;
}

.research-nav + main .follow-up-heading-tools {
  display: flex;
  flex: 0 0 auto;
  margin-top: -10px;
  margin-right: -10px;
}

.research-nav + main .follow-up-float-toggle {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: color .2s ease, transform .2s ease;
}

.research-nav + main .follow-up-float-toggle:hover,
.research-nav + main .follow-up-float-toggle:focus-visible {
  color: var(--stitch-red, #d25435);
  outline: 0;
  transform: scale(1.08);
}

.research-nav + main .follow-up-float-toggle:focus-visible {
  outline: 0;
}

.research-nav + main .follow-up-action-icon {
  width: 20px;
  height: 20px;
}

.research-nav + main .follow-up-popout-icon,
.research-nav + main .follow-up-dock-icon {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.research-nav + main .follow-up-dock-icon {
  display: none;
}

.research-nav + main .follow-up-float-toggle.is-floating .follow-up-popout-icon {
  display: none;
}

.research-nav + main .follow-up-float-toggle.is-floating .follow-up-dock-icon {
  display: block;
}

.research-nav + main .follow-up-drag-hint {
  display: none;
  margin: 0;
  color: var(--reference-workspace-muted);
  font: 8px/1.55 var(--mono);
  text-align: left;
}

.research-nav + main .follow-up-description {
  margin: 13px 0 0;
  color: var(--reference-workspace-muted);
  font-size: 9px;
  line-height: 1.7;
  text-align: left;
}

.research-nav + main .research-follow-up .follow-up-list {
  min-height: 0;
  overflow: auto;
  border-bottom-color: var(--line);
  scrollbar-width: thin;
}

.research-nav + main .research-follow-up .follow-up-entry {
  padding: 17px;
  border-bottom-color: var(--line);
}

.research-nav + main .research-follow-up .follow-up-entry > header {
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 7px;
  margin-bottom: 10px;
}

.research-nav + main .research-follow-up .follow-up-answer {
  padding-left: 33px;
  font-size: 11px;
  line-height: 1.75;
}

.research-nav + main .research-follow-up .follow-up-evidence {
  margin-left: 33px;
}

.research-nav + main .research-follow-up .follow-up-prompts {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 13px 16px 0;
}

.research-nav + main .research-follow-up .follow-up-prompts button {
  width: 100%;
  min-height: 34px;
  padding: 0 9px;
  text-align: left;
}

.research-nav + main .research-follow-up .follow-up-command {
  padding: 14px 16px 16px;
}

.research-nav + main .research-follow-up .follow-up-command textarea {
  min-height: 92px;
  max-height: 230px;
}

.research-nav + main .research-follow-up .follow-up-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  min-height: 0;
  padding-top: 11px;
}

.research-nav + main .research-follow-up .follow-up-actions small {
  margin: 0;
  font-size: 8px;
}

.research-nav + main .research-follow-up .follow-up-actions button {
  width: 100%;
  height: 45px;
}

.research-nav + main .research-follow-up > :not(.follow-up-edge-toggle) {
  opacity: 1;
  transform: translateX(0);
  visibility: visible;
  transition:
    opacity .16s ease .14s,
    transform .26s cubic-bezier(.4, 0, .2, 1) .08s,
    visibility 0s linear;
}

/* A completed report briefly calls attention to the follow-up rail so the
   next action is discoverable without leaving the report permanently styled. */
.research-nav + main > .research-workspace > .research-follow-up.follow-up-auto-open {
  border-color: var(--stitch-red, #d25435);
  box-shadow: 0 0 0 5px rgba(210, 84, 53, .14);
  animation: followUpAutoOpen .82s cubic-bezier(.22, .8, .25, 1) both;
}

.research-nav + main > .research-workspace > .research-follow-up.follow-up-auto-open .follow-up-heading {
  border-top-color: var(--stitch-red, #d25435);
}

@keyframes followUpAutoOpen {
  0% { opacity: 0; transform: translateY(16px); box-shadow: 0 0 0 0 rgba(210, 84, 53, 0); }
  58% { opacity: 1; transform: translateY(0); box-shadow: 0 0 0 7px rgba(210, 84, 53, .17); }
  100% { opacity: 1; transform: translateY(0); box-shadow: 0 0 0 5px rgba(210, 84, 53, .14); }
}

/* Collapsed mode keeps a narrow placeholder column so the arrow has a clear
   re-entry point while the report reclaims the remaining width. */
.research-nav + main > .research-workspace.follow-up-mode-collapsed > .research-follow-up {
  height: 32px;
  min-height: 32px;
  max-height: none;
  overflow: hidden;
  position: sticky;
  top: 88px;
  border-color: var(--reference-workspace-line);
  border-top-color: var(--reference-workspace-line);
  border-radius: var(--reference-card-radius);
  background: var(--reference-workspace);
  box-shadow: 0 5px 14px rgba(11, 18, 15, .14);
}

.research-nav + main .follow-up-mode-collapsed .research-follow-up > :not(.follow-up-edge-toggle) {
  opacity: 0;
  pointer-events: none;
  transform: translateX(6px);
  visibility: hidden;
  transition:
    opacity .18s ease,
    transform .3s cubic-bezier(.4, 0, .2, 1),
    visibility 0s linear .18s;
}

.research-nav + main .research-follow-up.follow-up-mode-collapsed {
  border-color: var(--reference-workspace-line);
  border-top-color: var(--reference-workspace-line);
  border-radius: var(--reference-card-radius);
  background: var(--reference-workspace);
  box-shadow: 0 5px 14px rgba(11, 18, 15, .14);
}

.research-nav + main .research-follow-up.follow-up-mode-collapsed::after {
  opacity: 1;
  transition-delay: var(--follow-up-fill-delay);
}

.research-nav + main .follow-up-mode-collapsed .follow-up-edge-toggle {
  top: 4px;
  left: 3.5px;
  place-items: center;
  color: var(--reference-workspace-muted);
}

.research-nav + main .follow-up-mode-collapsed .follow-up-edge-toggle:hover,
.research-nav + main .follow-up-mode-collapsed .follow-up-edge-toggle:focus-visible {
  transform: none;
}

/* Floating mode removes the rail from the grid. The header is the drag handle;
   the panel itself uses the native resize affordance. */
.research-nav + main > .research-workspace.follow-up-mode-floating > .research-follow-up {
  position: fixed;
  z-index: 70;
  top: 110px;
  left: 61px;
  right: auto;
  width: 526px;
  min-width: min(360px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  height: 750px;
  min-height: min(240px, calc(100dvh - 24px));
  max-height: calc(100dvh - 24px);
  resize: both;
  overflow: auto;
  transition: border-color .2s ease, border-radius .2s ease, background-color .2s ease, box-shadow .2s ease;
  box-shadow: 0 24px 70px rgba(5, 12, 9, .35), 0 0 0 1px rgba(255, 255, 255, .04);
}

.research-nav + main > .research-workspace.follow-up-view-transition.follow-up-mode-floating > .research-follow-up {
  transition: none;
}

.research-nav + main .follow-up-mode-floating .follow-up-heading {
  padding: 22px 22px 20px;
  cursor: grab;
  touch-action: none;
}

.research-nav + main .follow-up-mode-floating .follow-up-edge-toggle {
  display: none;
}

.research-nav + main .follow-up-mode-floating .follow-up-drag-hint {
  display: block;
  margin-top: 8px;
  font-size: 10px;
  text-align: right;
}

.research-nav + main .follow-up-mode-floating .follow-up-title-block > span {
  font-size: 9px;
}

.research-nav + main .follow-up-mode-floating .follow-up-title-block h3 {
  margin-top: 8px;
  font-size: 24px;
}

.research-nav + main .follow-up-mode-floating .follow-up-description {
  margin-top: 16px;
  font-size: 11px;
  line-height: 1.75;
  text-align: right;
}

.research-nav + main .follow-up-mode-floating .follow-up-action-icon {
  width: 22px;
  height: 22px;
}

.research-nav + main .follow-up-mode-floating .follow-up-popout-icon,
.research-nav + main .follow-up-mode-floating .follow-up-dock-icon {
  width: 21px;
  height: 21px;
}

.research-nav + main .follow-up-mode-floating .follow-up-entry {
  padding: 21px 22px;
}

.research-nav + main .follow-up-mode-floating .follow-up-entry > header {
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 10px;
  margin-bottom: 13px;
}

.research-nav + main .follow-up-mode-floating .follow-up-entry > header span {
  font-size: 10px;
}

.research-nav + main .follow-up-mode-floating .follow-up-entry > header h4 {
  font-size: 16px;
}

.research-nav + main .follow-up-mode-floating .follow-up-answer {
  padding-left: 42px;
  font-size: 14px;
  line-height: 1.8;
}

.research-nav + main .follow-up-mode-floating .follow-up-answer h1 {
  font-size: 22px;
}

.research-nav + main .follow-up-mode-floating .follow-up-answer h2 {
  font-size: 18px;
}

.research-nav + main .follow-up-mode-floating .follow-up-answer h3 {
  font-size: 16px;
}

.research-nav + main .follow-up-mode-floating .follow-up-answer table {
  font-size: 12px;
}

.research-nav + main .follow-up-mode-floating .follow-up-evidence {
  margin-left: 42px;
}

.research-nav + main .follow-up-mode-floating .follow-up-evidence span,
.research-nav + main .follow-up-mode-floating .follow-up-evidence a {
  font-size: 9px;
}

.research-nav + main .follow-up-mode-floating .follow-up-prompts {
  gap: 8px;
  padding: 16px 20px 0;
}

.research-nav + main .follow-up-mode-floating .follow-up-prompts button {
  min-height: 38px;
  padding: 0 12px;
  font-size: 11px;
}

.research-nav + main .follow-up-mode-floating .follow-up-command {
  padding: 17px 20px 20px;
}

.research-nav + main .follow-up-mode-floating .follow-up-command label > span {
  margin-bottom: 8px;
  font-size: 9px;
}

.research-nav + main .follow-up-mode-floating .follow-up-command textarea {
  min-height: 110px;
  max-height: 280px;
  padding: 13px 15px;
  font-size: 14px;
  line-height: 1.65;
}

.research-nav + main .follow-up-mode-floating .follow-up-actions {
  gap: 10px;
  padding-top: 13px;
}

.research-nav + main .follow-up-mode-floating .follow-up-actions small {
  font-size: 10px;
}

.research-nav + main .follow-up-mode-floating .follow-up-actions button {
  height: 52px;
  font-size: 13px;
}

@keyframes followUpEdgeHintRight {
  0%, 62%, 100% { transform: translateX(0); }
  72% { transform: translateX(1.5px); }
  82% { transform: translateX(0); }
  90% { transform: translateX(1px); }
}

@keyframes followUpEdgeHintLeft {
  0%, 62%, 100% { transform: translateX(0); }
  72% { transform: translateX(-1.5px); }
  82% { transform: translateX(0); }
  90% { transform: translateX(-1px); }
}

@media (max-width: 1050px) {
  .research-nav + main > .research-workspace.has-follow-up,
  .research-nav + main > .research-workspace.follow-up-mode-collapsed,
  .research-nav + main > .research-workspace.follow-up-mode-floating {
    grid-template-columns: 1fr;
  }

  .research-nav + main > .research-workspace > .research-follow-up {
    --follow-up-size-duration: .34s;
    --follow-up-width-delay: 0s;
    --follow-up-height-delay: .26s;
    --follow-up-fill-delay: .56s;
    grid-column: 1;
    grid-row: auto;
    position: relative;
    top: auto;
    min-height: 0;
    max-height: none;
    width: 100%;
    height: auto;
    margin-top: 14px;
  }

  .research-nav + main > .research-workspace.follow-up-mode-collapsed > .research-follow-up {
    --follow-up-width-delay: .26s;
    --follow-up-height-delay: 0s;
    width: 26px;
    justify-self: end;
    min-height: 32px;
    max-height: none;
  }

  .research-nav + main > .research-workspace.follow-up-mode-floating > .research-follow-up {
    position: fixed;
    top: 84px;
    left: clamp(18px, 4vw, 48px);
    right: auto;
    width: min(526px, calc(100vw - 36px));
    height: min(750px, calc(100dvh - 108px));
    margin: 0;
    grid-column: auto;
    grid-row: auto;
    min-height: 240px;
    max-height: calc(100dvh - 24px);
  }
}

@media (max-width: 720px) {
  .research-nav + main > .research-workspace > .research-follow-up {
    margin-top: 13px;
    border-radius: var(--reference-card-radius);
  }

  .research-nav + main > .research-workspace.follow-up-mode-floating > .research-follow-up {
    top: 72px;
    left: 12px;
    right: auto;
    width: calc(100vw - 24px);
    min-width: 0;
    max-width: calc(100vw - 24px);
    height: min(620px, calc(100dvh - 88px));
    margin: 0;
  }

  .research-nav + main .follow-up-mode-floating .follow-up-heading {
    padding: 19px 17px 17px;
  }

  .research-nav + main .follow-up-mode-floating .follow-up-title-block h3 {
    font-size: 21px;
  }

  .research-nav + main .follow-up-mode-floating .follow-up-answer {
    padding-left: 35px;
    font-size: 13px;
  }

  .research-nav + main .follow-up-mode-floating .follow-up-command textarea {
    min-height: 96px;
    font-size: 13px;
  }

}

@media (prefers-reduced-motion: reduce) {
  .research-nav + main > .research-workspace,
  .research-nav + main > .research-workspace > .research-follow-up,
  .research-nav + main .follow-up-mode-collapsed .research-follow-up > :not(.follow-up-edge-toggle),
  .research-nav + main .follow-up-edge-toggle,
  .research-nav + main .follow-up-edge-icon,
  .research-nav + main .follow-up-float-toggle,
  .research-nav + main > .research-workspace > .research-follow-up.follow-up-auto-open,
  .research-nav + main > .research-workspace > .research-follow-up::after,
  .research-nav + main > .research-workspace.follow-up-mode-floating > .research-follow-up {
    transition: none;
    animation: none;
  }
}

/* Once a follow-up answer exists, the report and answer thread provide the
   context, so keep the composer focused on the next question. */
.research-nav + main .research-follow-up.has-follow-up-content .follow-up-prompts,
.research-nav + main .research-follow-up.has-follow-up-content .follow-up-command label > span,
.research-nav + main .research-follow-up.has-follow-up-content .follow-up-actions small {
  display: none;
}

/* An empty rail should show its original affordances without reserving the
   full answer-thread viewport. The height can then interpolate back to the
   full rail when the first answer is added. */
.research-nav + main > .research-workspace.has-follow-up:not(.follow-up-mode-collapsed):not(.follow-up-mode-floating) > .research-follow-up:not(.has-follow-up-content) {
  height: auto;
  min-height: 0;
  grid-template-rows: auto auto auto;
  align-self: start;
}

.research-nav + main .research-follow-up:not(.has-follow-up-content) .follow-up-prompts {
  display: flex;
}

.research-nav + main .research-follow-up:not(.has-follow-up-content) .follow-up-command label > span {
  display: block;
}

.research-nav + main .research-follow-up:not(.has-follow-up-content) .follow-up-actions small {
  display: block;
}

/* The desktop ledger is a flat archive, so let the page carry the document
   height instead of introducing a second vertical scroll container. Keep the
   compact horizontal source browser used at narrower breakpoints intact. */
@media (min-width: 1051px) {
  .research-nav + main .source-list {
    max-height: none;
    overflow: visible;
  }
}

/* The continued-inquiry rail follows the same line-led, flat treatment as the
   project bar. Its border is enough to separate it from the report surface. */
.research-nav + main > .research-workspace > .research-follow-up,
.research-nav + main .research-follow-up.follow-up-mode-collapsed,
.research-nav + main > .research-workspace.follow-up-mode-floating > .research-follow-up {
  border-color: var(--stitch-line, #d9d4c9);
  box-shadow: none;
}

html[data-theme="dark"] .research-nav + main > .research-workspace > .research-follow-up,
html[data-theme="dark"] .research-nav + main .research-follow-up.follow-up-mode-collapsed,
html[data-theme="dark"] .research-nav + main > .research-workspace.follow-up-mode-floating > .research-follow-up {
  border-color: #365048;
}

.research-nav + main .research-follow-up .follow-up-list {
  overflow-x: hidden;
  overflow-y: auto;
}

.research-nav + main .research-follow-up .follow-up-answer {
  min-width: 0;
}

.research-nav + main .research-follow-up .follow-up-answer table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
}

.research-nav + main .research-follow-up .follow-up-answer th,
.research-nav + main .research-follow-up .follow-up-answer td {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* The graph close action is intentionally icon-only; the accessible label is
   kept in the DOM while the visual control stays quiet and compact. */
.research-nav + main .graph-heading {
  padding-right: 76px;
}

.research-nav + main .graph-heading .graph-heading-actions {
  position: absolute;
  top: 12px;
  right: 8px;
  align-items: flex-start;
}

.research-nav + main .graph-heading-actions .graph-original-link {
  width: auto;
  min-width: 0;
  height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: #a9bbb3;
  font: 9px var(--mono, monospace);
  text-decoration: none;
}

.research-nav + main .graph-heading-actions .graph-original-link:hover,
.research-nav + main .graph-heading-actions .graph-original-link:focus-visible {
  border-color: transparent;
  background: transparent;
  color: #e66149;
  transform: none;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.research-nav + main .graph-heading-actions .graph-close-button {
  width: 28px;
  min-width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: #e66149;
}

.research-nav + main .graph-heading-actions .graph-close-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.research-nav + main .graph-heading-actions .graph-close-mark {
  width: 18px;
  height: 18px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.research-nav + main .graph-heading-actions .graph-close-button:hover,
.research-nav + main .graph-heading-actions .graph-close-button:focus-visible {
  border-color: transparent;
  background: transparent;
  color: #fff;
  transform: none;
}

.research-nav + main .graph-heading-actions .graph-close-button:focus-visible {
  outline: 2px solid #e66149;
  outline-offset: 3px;
}


/* ===== merged from health-layout.css ===== */
/* Health desk layout: keep intake, guidance, and evidence visible together on
   wide screens, then collapse the same reading order at tablet and phone sizes. */
.health-workspace {
  display: grid;
  grid-template-columns: minmax(285px, .82fr) minmax(0, 1.68fr) minmax(255px, .76fr);
  align-items: start;
  gap: 16px;
  width: 100%;
}

/* Replace the decorative relationship map with index signals that answer
   practical questions: how much is vectorized, what terms drive retrieval,
   and when the cached material was collected. */
.health-index-insights-card {
  min-width: 0;
  margin-top: 18px;
  padding: 16px 15px 14px;
  border: 1px solid var(--stitch-line);
  border-radius: 7px;
  background: color-mix(in srgb, var(--stitch-surface) 52%, transparent);
}

.health-index-insights-card > header,
.health-index-chart-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}

.health-index-insights-card > header {
  padding-bottom: 10px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-insights-card > header > div:first-child,
.health-index-chart-card > header > div:first-child {
  min-width: 0;
}

.health-index-insights-card > header > div:first-child > span,
.health-index-chart-card > header > div:first-child > span {
  color: var(--stitch-red);
  font: 500 9px/1.4 var(--mono);
  letter-spacing: .12em;
}

.health-index-insights-card h3 {
  margin: 6px 0 0;
  color: var(--stitch-ink);
  font: 600 19px/1.25 var(--serif);
  letter-spacing: -.05em;
}

.health-index-insight-stats {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex: 0 0 auto;
}

.health-index-insight-stats span {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  color: var(--stitch-muted);
  font: 7px var(--mono);
  white-space: nowrap;
}

.health-index-insight-stats b {
  color: var(--stitch-gold, var(--gold));
  font: 500 14px var(--mono);
}

.health-index-insights-card > p {
  max-width: 690px;
  margin: 10px 0 13px;
  color: var(--stitch-muted);
  font-size: 9px;
  line-height: 1.65;
}

.health-index-insights-grid {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  gap: 10px;
  min-width: 0;
}

.health-index-chart-card {
  min-width: 0;
  padding: 13px 13px 12px;
  border: 1px solid var(--stitch-line);
  border-radius: 6px;
  background: color-mix(in srgb, var(--stitch-surface) 72%, transparent);
}

.health-index-chart-card > header {
  padding-bottom: 8px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-chart-card h4 {
  margin: 5px 0 0;
  color: var(--stitch-ink);
  font: 600 15px/1.3 var(--serif);
  letter-spacing: -.035em;
}

.health-index-chart-card > header > b {
  color: var(--stitch-red);
  font: 500 17px var(--mono);
}

.health-index-chart-card > header > small {
  flex: 0 0 auto;
  max-width: 46%;
  overflow: hidden;
  color: var(--stitch-muted);
  font: 7px var(--mono);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-vector-chart {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  min-width: 0;
  padding-top: 13px;
}

.health-index-vector-ring {
  position: relative;
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(var(--stitch-red) 0 var(--health-vector-fill, 0%), var(--stitch-line) var(--health-vector-fill, 0%) 100%);
  box-shadow: 0 8px 22px rgba(47, 46, 39, .08);
}

.health-index-vector-ring::after {
  position: absolute;
  inset: 8px;
  border-radius: inherit;
  background: var(--stitch-surface);
  content: '';
}

.health-index-vector-ring > div {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 1px;
}

.health-index-vector-ring strong {
  color: var(--stitch-ink);
  font: 600 23px var(--mono);
  letter-spacing: -.06em;
}

.health-index-vector-ring small {
  color: var(--stitch-muted);
  font: 8px var(--mono);
}

.health-index-vector-copy {
  display: grid;
  gap: 9px;
  min-width: 0;
}

.health-index-vector-copy > p,
.health-index-chart-card > p {
  margin: 0;
  color: var(--stitch-muted);
  font-size: 9px;
  line-height: 1.6;
}

.health-index-vector-copy > div {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-width: 0;
  color: var(--stitch-muted);
  font-size: 8px;
}

.health-index-vector-copy > div i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--stitch-line);
}

.health-index-vector-copy > div i.is-ready {
  background: var(--stitch-red);
}

.health-index-vector-copy > div b {
  color: var(--stitch-ink);
  font: 500 10px var(--mono);
}

.health-index-query-card > p,
.health-index-timeline-card > p {
  margin: 9px 0 10px;
}

.health-index-query-list {
  display: grid;
  gap: 7px;
}

.health-index-query-row {
  display: grid;
  grid-template-columns: minmax(76px, .72fr) minmax(0, 1.28fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.health-index-query-row > span {
  overflow: hidden;
  color: var(--stitch-ink);
  font: 8px var(--mono);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-query-track {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--stitch-line);
}

.health-index-query-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--stitch-sage), var(--stitch-red));
  transition: width .45s ease;
}

.health-index-query-row > b {
  min-width: 18px;
  color: var(--stitch-muted);
  font: 500 9px var(--mono);
  text-align: right;
}

.health-index-timeline-card {
  grid-column: auto;
}

.health-index-timeline {
  display: grid;
  grid-template-columns: repeat(10, minmax(18px, 1fr));
  align-items: end;
  gap: 7px;
  min-width: 0;
  height: 146px;
  padding: 8px 2px 0;
  border-top: 1px solid var(--stitch-line);
}

.health-index-timeline-column {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  align-items: end;
  gap: 4px;
  min-width: 0;
  height: 100%;
  cursor: default;
}

.health-index-timeline-column > b {
  overflow: hidden;
  color: var(--stitch-muted);
  font: 7px var(--mono);
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-timeline-track {
  position: relative;
  height: 100%;
  border-bottom: 1px solid var(--stitch-line);
  background: linear-gradient(to top, transparent 0 49%, color-mix(in srgb, var(--stitch-line) 55%, transparent) 50%, transparent 51%);
}

.health-index-timeline-track i {
  position: absolute;
  right: 18%;
  bottom: 0;
  left: 18%;
  min-height: 8px;
  border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, var(--stitch-red), var(--stitch-gold, var(--gold)));
  box-shadow: 0 5px 12px color-mix(in srgb, var(--stitch-red) 22%, transparent);
}

.health-index-timeline-column > span {
  color: var(--stitch-muted);
  font: 7px var(--mono);
  text-align: center;
  white-space: nowrap;
}

html[data-theme="dark"] .health-index-insights-card,
html[data-theme="dark"] .health-index-chart-card {
  border-color: var(--stitch-line);
  background: var(--stitch-surface);
}

@media (max-width: 720px) {
  .health-index-insights-card {
    padding: 14px 11px 11px;
  }

  .health-index-insights-card > header {
    display: block;
  }

  .health-index-insight-stats {
    gap: 10px;
    margin-top: 10px;
  }

  .health-index-insights-grid {
    grid-template-columns: 1fr;
  }

  .health-index-timeline-card {
    grid-column: auto;
  }

  .health-index-timeline {
    gap: 4px;
  }

  .health-index-timeline-column > span,
  .health-index-timeline-column > b {
    font-size: 6px;
  }
}

.health-intake-column,
.health-center-column,
.health-evidence-column {
  min-width: 0;
}

.health-intake-column .triage-shell {
  display: block;
  margin: 0;
  overflow: hidden;
  border-radius: 10px;
}

.health-intake-column .triage-index {
  min-height: 126px;
  flex-direction: row;
  align-items: flex-start;
  gap: 18px;
  padding: 22px 24px 20px;
  border-right: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .15);
}

.health-intake-column .triage-intro {
  min-width: 0;
}

.health-intake-column .triage-intro > span {
  display: block;
  color: #aab7b0;
  font: 500 9px/1.4 var(--mono);
  letter-spacing: .09em;
}

.health-intake-column .triage-intro h2 {
  margin: 7px 0 0;
  color: var(--stitch-red);
  font: 600 26px/1.28 var(--serif);
  letter-spacing: -.045em;
}

.health-intake-column .triage-intro small {
  display: block;
  margin-top: 8px;
  color: #a2afa8;
  font: 9px/1.55 var(--sans);
}

.health-intake-column .triage-index i {
  flex: 0 0 auto;
  margin: 7px 0 0 auto;
}

.health-intake-column .health-form {
  padding: 20px 17px 19px;
}

/* The shared form focus treatment is useful for text fields, but its inset
   accent reads like a stray colored edge on the native consent checkbox. */
.health-intake-column .consent-row input[type='checkbox']:focus {
  box-shadow: none;
}

.health-intake-column .consent-row input[type='checkbox']:focus-visible {
  outline: 2px solid var(--stitch-muted);
  outline-offset: 2px;
}

.health-intake-column .form-heading {
  display: block;
}

.health-intake-column .form-heading small {
  display: block;
  margin-top: 8px;
  line-height: 1.55;
}

.health-intake-column .prescription-note {
  grid-template-columns: 1fr;
  gap: 6px;
}

.health-intake-column .profile-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.health-intake-column .report-upload > header {
  display: block;
}

.health-intake-column .report-upload > header p {
  width: auto;
  margin-top: 8px;
  text-align: left;
}

.health-intake-column .report-drop {
  grid-template-columns: 42px minmax(0, 1fr);
  padding: 11px;
}

.health-intake-column .report-drop > i {
  display: none;
}

.health-intake-column .report-image-list {
  grid-template-columns: 1fr;
}

.health-center-column {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.health-start-panel,
.health-index-dashboard,
.health-evidence-card,
.medical-sources {
  border: 1px solid var(--stitch-line);
  border-radius: 10px;
  background: rgba(255, 253, 247, .86);
  box-shadow: var(--stitch-shadow);
}

.health-index-dashboard {
  --health-index-fill: 0%;
  position: relative;
  display: none;
  min-width: 0;
  overflow: hidden;
  padding: 24px;
}

.health-index-dashboard::before {
  position: absolute;
  inset: 0;
  content: '';
  pointer-events: none;
  background: radial-gradient(circle at 88% 8%, rgba(210, 84, 53, .12), transparent 32%), radial-gradient(circle at 8% 86%, rgba(125, 152, 138, .1), transparent 28%);
}

.health-index-dashboard > * {
  position: relative;
  z-index: 1;
}

.health-index-dashboard-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-dashboard-heading > div {
  min-width: 0;
}

.health-index-state {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  color: var(--stitch-sage);
  font: 8px var(--mono);
  letter-spacing: .04em;
  white-space: nowrap;
}

.health-index-state .health-index-live-dot {
  width: 7px;
  height: 7px;
  margin-top: 0;
}

.health-index-dashboard-heading > div:first-child > span,
.health-index-sources > header > span,
.health-index-analysis-card > header span {
  color: var(--stitch-red);
  font: 500 9px/1.4 var(--mono);
  letter-spacing: .12em;
}

.health-index-dashboard-heading h2 {
  margin: 7px 0 0;
  color: var(--stitch-ink);
  font: 600 clamp(23px, 2.15vw, 32px)/1.28 var(--serif);
  letter-spacing: -.06em;
}

.health-index-live-dot,
.health-index-model-dot {
  display: block;
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  margin-top: 7px;
  border-radius: 50%;
  background: var(--stitch-muted);
  box-shadow: 0 0 0 5px rgba(112, 113, 107, .1);
}

.health-index-dashboard.is-ready .health-index-live-dot,
.health-index-model-dot.is-ready {
  background: var(--stitch-sage);
  box-shadow: 0 0 0 5px rgba(125, 152, 138, .14);
}

.health-index-dashboard.is-ready .health-index-live-dot {
  animation: healthIndexPulse 2.4s ease-in-out infinite;
}

.health-index-dashboard-description {
  max-width: 510px;
  margin: 15px 0 21px;
  color: var(--stitch-muted);
  font-size: 10px;
  line-height: 1.75;
}

.health-index-summary-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.25fr) repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-summary {
  min-width: 0;
  min-height: 122px;
  padding: 15px 14px 13px;
  border: 1px solid var(--stitch-line);
  border-radius: 7px;
  background: color-mix(in srgb, var(--stitch-surface) 66%, transparent);
}

.health-index-summary-primary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
}

.health-index-ring {
  position: relative;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 112px;
  height: 112px;
  border-radius: 50%;
  background: conic-gradient(var(--stitch-red) var(--health-index-fill), var(--stitch-line) 0);
  box-shadow: 0 12px 28px rgba(36, 58, 82, .12);
}

.health-index-ring::after {
  position: absolute;
  inset: 10px;
  border: 1px solid var(--stitch-line);
  border-radius: 50%;
  background: var(--stitch-surface);
  content: '';
}

.health-index-ring-center {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
}

.health-index-ring-center strong {
  color: var(--stitch-ink);
  font: 500 28px/1 var(--mono);
  letter-spacing: -.08em;
}

.health-index-ring-center span {
  color: var(--stitch-muted);
  font: 8px var(--mono);
  letter-spacing: .06em;
  white-space: nowrap;
}

.health-index-summary-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.health-index-summary-copy > span,
.health-index-summary-copy > small,
.health-index-summary > p,
.health-index-mini-stat > span {
  color: var(--stitch-muted);
  font: 8px/1.55 var(--mono);
}

.health-index-summary-copy > strong {
  color: var(--stitch-ink);
  font: 500 31px/1 var(--mono);
  letter-spacing: -.08em;
}

.health-index-summary-copy > small {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: baseline;
}

.health-index-summary-copy > small b,
.health-index-summary-copy > small em {
  color: var(--stitch-ink);
  font: 500 9px var(--mono);
  font-style: normal;
}

.health-index-summary > header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-summary > header > span {
  overflow: hidden;
  color: var(--stitch-muted);
  font: 8px var(--mono);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-summary > header > b {
  min-width: 0;
  color: var(--stitch-ink);
  font: 500 14px var(--mono);
  text-align: right;
  white-space: nowrap;
}

.health-index-summary > header > b small,
.health-index-summary > p small,
.health-index-mini-stat > small {
  margin-left: 3px;
  color: var(--stitch-muted);
  font: 8px var(--mono);
}

.health-index-progress {
  height: 6px;
  margin: 15px 0 11px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--stitch-line);
}

.health-index-progress i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--stitch-sage), var(--stitch-red));
  transition: width .5s ease;
}

.health-index-summary > p {
  margin: 13px 0 0;
  line-height: 1.7;
}

.health-index-summary > p b {
  color: var(--stitch-ink);
  font: 500 10px var(--mono);
}

.health-index-mini-stat {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 7px;
  min-width: 0;
  margin-top: 13px;
  padding-top: 9px;
  border-top: 1px solid var(--stitch-line);
}

.health-index-mini-stat b {
  margin-left: auto;
  color: var(--stitch-ink);
  font: 500 12px var(--mono);
}

.health-index-analysis-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr);
  gap: 12px;
  margin-top: 18px;
}

.health-index-analysis-card {
  min-width: 0;
  padding: 16px 15px 14px;
  border: 1px solid var(--stitch-line);
  border-radius: 7px;
  background: color-mix(in srgb, var(--stitch-surface) 52%, transparent);
}

.health-index-analysis-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-analysis-card > header > div {
  min-width: 0;
}

.health-index-analysis-card > header h3 {
  margin: 6px 0 0;
  color: var(--stitch-ink);
  font: 600 19px/1.25 var(--serif);
  letter-spacing: -.05em;
}

.health-index-analysis-card > header > small {
  flex: 0 0 auto;
  color: var(--stitch-muted);
  font: 8px var(--mono);
  white-space: nowrap;
}

.health-index-analysis-card > p {
  margin: 10px 0 13px;
  color: var(--stitch-muted);
  font-size: 9px;
  line-height: 1.65;
}

.health-index-bars {
  display: grid;
  gap: 9px;
}

.health-index-bar-row {
  display: grid;
  grid-template-columns: minmax(98px, .75fr) minmax(0, 1.25fr) auto;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.health-index-bar-row > span:first-child {
  overflow: hidden;
  color: var(--stitch-ink);
  font: 9px var(--sans);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-bar-track {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--stitch-line);
}

.health-index-bar-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--stitch-sage), var(--stitch-red));
  transition: width .45s ease;
}

.health-index-bar-row > b {
  min-width: 27px;
  color: var(--stitch-ink);
  font: 500 9px var(--mono);
  text-align: right;
}

.health-index-organization-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.health-index-organization-list li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.health-index-organization-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.health-index-organization-copy strong {
  overflow: hidden;
  color: var(--stitch-ink);
  font: 8px/1.35 var(--sans);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-organization-track {
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--stitch-line);
}

.health-index-organization-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--stitch-sage);
  transition: width .45s ease;
}

.health-index-organization-list li > b {
  color: var(--stitch-ink);
  font: 500 10px var(--mono);
}

.health-index-records {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--stitch-line);
}

.health-index-records > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.health-index-records > header > div {
  min-width: 0;
}

.health-index-records > header span {
  color: var(--stitch-red);
  font: 500 9px/1.4 var(--mono);
  letter-spacing: .12em;
}

.health-index-records > header h3 {
  margin: 6px 0 0;
  color: var(--stitch-ink);
  font: 600 19px/1.25 var(--serif);
  letter-spacing: -.05em;
}

.health-index-records > header > small {
  flex: 0 0 auto;
  color: var(--stitch-muted);
  font: 8px var(--mono);
  white-space: nowrap;
}

.health-index-records > p {
  margin: 10px 0 13px;
  color: var(--stitch-muted);
  font-size: 9px;
  line-height: 1.65;
}

.health-index-record-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  overflow: visible;
  padding: 1px 2px 2px 1px;
}

.health-index-record {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: start;
  gap: 9px;
  min-width: 0;
  padding: 11px 10px 10px;
  border: 1px solid var(--stitch-line);
  border-radius: 7px;
  background: color-mix(in srgb, var(--stitch-surface) 72%, transparent);
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.health-index-record:hover {
  border-color: var(--stitch-gold);
  background: var(--stitch-surface);
  transform: translateY(-1px);
}

.health-index-record-code {
  padding-top: 1px;
  color: var(--stitch-gold);
  font: 500 8px var(--mono);
  letter-spacing: .06em;
}

.health-index-record-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.health-index-record-copy strong {
  overflow: hidden;
  color: var(--stitch-ink);
  font: 600 12px/1.3 var(--serif);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-record-copy small {
  overflow: hidden;
  color: var(--stitch-muted);
  font: 7px/1.45 var(--mono);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-record-copy p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin: 1px 0 0;
  color: var(--stitch-muted);
  font: 8px/1.55 var(--sans);
}

.health-index-record-detail {
  display: grid;
  justify-items: end;
  gap: 5px;
  min-width: 60px;
  padding-top: 1px;
  text-align: right;
}

.health-index-record-detail > small {
  color: var(--stitch-muted);
  font: 7px var(--mono);
  white-space: nowrap;
}

.health-index-record-vector {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--stitch-muted);
  font: 7px var(--mono);
  white-space: nowrap;
}

.health-index-record-vector::before {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--stitch-muted);
  content: '';
}

.health-index-record-vector.is-ready {
  color: var(--stitch-sage);
}

.health-index-record-vector.is-ready::before {
  background: var(--stitch-sage);
  box-shadow: 0 0 0 3px rgba(125, 152, 138, .12);
}

.health-index-record-detail a {
  color: var(--stitch-red);
  font: 7px var(--mono);
  text-decoration: none;
  white-space: nowrap;
}

.health-index-record-detail a:hover {
  color: var(--stitch-gold);
  text-decoration: underline;
}

.health-index-empty {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--stitch-muted);
  font: 8px var(--mono);
}

.health-index-sources {
  margin-top: 19px;
}

.health-index-sources > header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.health-index-sources > header small {
  color: var(--stitch-muted);
  font: 8px var(--mono);
}

.health-index-sources ul {
  margin: 9px 0 0;
  padding: 0;
  border-top: 1px solid var(--stitch-line);
  list-style: none;
}

.health-index-sources li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 10px 0;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-source-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.health-index-source-copy strong {
  overflow: hidden;
  color: var(--stitch-ink);
  font: 600 11px var(--serif);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-source-copy small {
  overflow: hidden;
  color: var(--stitch-muted);
  font: 8px var(--mono);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-index-source-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--stitch-muted);
  font: 8px var(--mono);
  white-space: nowrap;
}

.health-index-source-status::before {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--stitch-muted);
  content: '';
}

.health-index-sources li.is-active .health-index-source-status {
  color: var(--stitch-sage);
}

.health-index-sources li.is-active .health-index-source-status::before {
  background: var(--stitch-sage);
  box-shadow: 0 0 0 3px rgba(125, 152, 138, .12);
}

.health-index-dashboard-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 15px;
  color: var(--stitch-muted);
  font: 8px/1.5 var(--mono);
}

.health-index-dashboard-footer .health-index-model-dot {
  width: 7px;
  height: 7px;
  margin-top: 0;
}

@keyframes healthIndexPulse {
  50% { box-shadow: 0 0 0 8px rgba(125, 152, 138, 0); }
}

.health-start-panel {
  min-height: 100%;
  padding: 25px 24px 21px;
}

.health-start-heading,
.health-evidence-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 17px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-start-heading span,
.health-evidence-card > header span,
.health-report-panel-heading > span {
  color: var(--stitch-red);
  font: 500 9px/1.4 var(--mono);
  letter-spacing: .12em;
}

.health-start-heading h2,
.health-evidence-card > header h2 {
  margin: 7px 0 0;
  color: var(--stitch-ink);
  font: 600 clamp(22px, 2.6vw, 32px)/1.32 var(--serif);
  letter-spacing: -.06em;
}

.health-start-heading > b {
  color: var(--stitch-red);
  font: 500 32px/1 var(--mono);
}

.health-start-description {
  max-width: 540px;
  margin: 19px 0 18px;
  color: var(--stitch-muted);
  font-size: 11px;
  line-height: 1.8;
}

.health-start-points,
.health-evidence-list {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--stitch-line);
}

.health-start-points article,
.health-evidence-list article {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 12px;
  padding: 16px 0;
  border-bottom: 1px solid var(--stitch-line);
}

.health-start-points article > b,
.health-evidence-list article > b {
  color: var(--stitch-red);
  font: 500 11px/1.6 var(--mono);
}

.health-start-points h3,
.health-evidence-list h3 {
  margin: 0 0 5px;
  color: var(--stitch-ink);
  font: 600 15px/1.45 var(--serif);
}

.health-start-points p,
.health-evidence-list p {
  margin: 0;
  color: var(--stitch-muted);
  font-size: 10px;
  line-height: 1.75;
}

.health-start-panel > footer,
.health-evidence-card > footer {
  margin-top: 17px;
  color: var(--stitch-muted);
  font: 9px/1.7 var(--mono);
}

.health-evidence-column {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.health-evidence-column .health-follow-up {
  position: sticky;
  top: 84px;
  min-width: 0;
  max-height: min(760px, calc(100dvh - 110px));
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--stitch-line);
  border-top: 4px solid var(--stitch-ink);
  border-radius: 10px;
  background: rgba(255, 253, 247, .86);
  box-shadow: var(--stitch-shadow);
  scrollbar-width: thin;
  scrollbar-color: #5a7269 transparent;
  backface-visibility: hidden;
  transform-origin: top right;
  view-transition-name: health-follow-up;
}

.health-evidence-column .health-follow-up-scroll {
  max-height: calc(min(760px, calc(100dvh - 110px)) - 5px);
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #5a7269 transparent;
}

.health-evidence-column .health-follow-up:not(.is-expanded)::after,
.health-evidence-column .health-follow-up.has-scroll-offset:not(.is-expanded)::before {
  position: absolute;
  z-index: 4;
  right: 12px;
  left: 1px;
  height: 22px;
  content: '';
  pointer-events: none;
  background: var(--stitch-surface);
}

.health-evidence-column .health-follow-up.has-scroll-offset:not(.is-expanded)::before {
  height: 20px;
  top: 0;
  border-radius: 7px 7px 0 0;
}

.health-evidence-column .health-follow-up.has-scroll-offset:not(.is-expanded) .health-follow-up-scroll > header span {
  visibility: hidden;
}

.health-evidence-column .health-follow-up:not(.is-expanded)::after {
  bottom: 0;
  border-radius: 0 0 7px 7px;
}

.health-evidence-column .health-follow-up-scroll > header {
  position: relative;
  display: block;
  padding: 18px 52px 14px 16px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-evidence-column .health-follow-up-scroll > header span {
  color: var(--stitch-red);
  font: 500 9px var(--mono);
  letter-spacing: .14em;
}

.health-evidence-column .health-follow-up .health-follow-up-expand {
  position: absolute;
  z-index: 5;
  top: 14px;
  right: 14px;
  margin: 0;
}

.health-evidence-column .health-follow-up-scroll > header h2 {
  margin: 7px 0 0;
  color: var(--stitch-ink);
  font: 600 22px/1.35 var(--serif);
  letter-spacing: -.05em;
}

.health-evidence-column .health-follow-up-scroll > header p {
  margin: 10px 0 0;
  color: var(--stitch-muted);
  font-size: 10px;
  line-height: 1.7;
}

.health-evidence-column .follow-up-prompts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  padding: 12px 16px 4px;
}

.health-evidence-column .follow-up-prompts button {
  min-width: 0;
  padding: 8px 10px;
  text-align: left;
  line-height: 1.45;
}

.health-evidence-column .follow-up-thread {
  padding: 10px 16px 0;
}

.health-evidence-column .follow-up-turn {
  grid-template-columns: 1fr;
  padding: 16px 0;
}

.health-evidence-column .follow-up-turn > aside {
  margin-bottom: 8px;
}

.health-evidence-column .follow-up-question {
  margin-bottom: 10px;
  font-size: 15px;
}

.health-evidence-column .follow-up-answer {
  font-size: 12px;
  line-height: 1.75;
}

.health-evidence-column .follow-up-composer {
  margin: 14px 16px 16px;
  background: var(--stitch-surface);
}

.health-evidence-column .follow-up-composer textarea {
  min-height: 104px;
  font-size: 13px;
}

.health-evidence-column .follow-up-composer footer {
  min-height: 0;
  padding: 10px;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}

.health-evidence-column .follow-up-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

.health-evidence-column #pauseHealthFollowUp,
.health-evidence-column #sendHealthFollowUp {
  width: 100%;
}

.health-evidence-card {
  position: sticky;
  top: 84px;
  padding: 20px 19px 18px;
}

.health-evidence-card > header h2 {
  font-size: 23px;
}

.health-evidence-card > header {
  display: block;
}

.medical-sources {
  position: sticky;
  top: 84px;
  min-width: 0;
  max-height: min(680px, calc(100dvh - 110px));
  overflow: auto;
  padding: 20px 19px;
  scrollbar-width: thin;
  scrollbar-color: #5a7269 transparent;
}

.medical-sources > span {
  color: var(--stitch-red);
}

.medical-sources h3 {
  margin: 7px 0 16px;
  color: var(--stitch-ink);
}

.medical-sources > div {
  min-width: 0;
}

.medical-sources > p {
  margin-bottom: 0;
}

/* The landing state keeps the intake at the same width as the three-column
   desk's left rail. The knowledge index takes the remaining wide surface. */
.health-workspace:not(:has(.health-loading:not([hidden]))):not(:has(.health-result:not([hidden]))) {
  grid-template-columns: minmax(285px, .82fr) minmax(0, 2.44fr);
}

.health-workspace:not(:has(.health-loading:not([hidden]))):not(:has(.health-result:not([hidden]))) .health-evidence-column,
.health-workspace:not(:has(.health-loading:not([hidden]))):not(:has(.health-result:not([hidden]))) .health-start-panel {
  display: none;
}

.health-workspace:not(:has(.health-loading:not([hidden]))):not(:has(.health-result:not([hidden]))) .health-index-dashboard {
  display: block;
}

.health-workspace:has(.health-result:not([hidden])) .health-start-panel,
.health-workspace:has(.health-loading:not([hidden])) .health-start-panel,
.health-workspace:has(.health-result:not([hidden])) .health-evidence-card {
  display: none;
}

.health-loading {
  min-height: 230px;
  margin: 0;
  grid-template-columns: 84px minmax(0, 1fr) auto;
  grid-template-rows: auto;
  padding: 24px 28px;
  gap: 18px;
  border-radius: 10px;
}

.scan-orbit {
  width: 84px;
  height: 84px;
}

.health-loading > div:nth-child(2) {
  min-width: 0;
  align-self: center;
}

.health-loading > button {
  grid-column: 3;
  grid-row: 1;
  align-self: center;
  justify-self: end;
  height: 38px;
  padding: 0 14px;
  border-radius: 4px;
  font-size: 11px;
}

.health-loading h2 {
  margin: 7px 0 6px;
  font-size: clamp(21px, 2.2vw, 28px);
}

.health-loading .estimate-track {
  width: min(320px, 100%);
  margin-top: 12px;
}

.health-result {
  margin: 0;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: var(--stitch-shadow);
}

.health-result .result-heading {
  min-height: 77px;
  padding: 17px 20px;
}

.health-result .urgency-banner,
.health-result .report-reading {
  padding-inline: 20px;
}

.health-result .result-body {
  display: block;
}

.health-report-panel {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  backface-visibility: hidden;
  transform-origin: top right;
  view-transition-name: health-report;
}

.health-report-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 43px;
  padding: 13px 20px 10px;
  border-bottom: 1px solid var(--stitch-line);
  background: transparent;
}

.health-report-expand {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: var(--stitch-muted);
  background: transparent;
  cursor: pointer;
  transition: color .2s ease, background .2s ease;
}

.health-report-expand:hover,
.health-report-expand:focus-visible {
  color: var(--stitch-red);
  background: rgba(210, 84, 53, .12);
}

.health-report-expand:focus-visible {
  outline: 2px solid var(--stitch-red);
  outline-offset: 2px;
}

.health-report-expand-icon {
  display: block;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.health-report-expand-icon-close {
  display: none;
}

.health-report-expand.is-expanded .health-report-expand-icon-open {
  display: none;
}

.health-report-expand.is-expanded .health-report-expand-icon-close {
  display: block;
}

.health-report {
  border-right: 0;
  padding: 22px 24px 30px;
}

body.health-page.health-report-open,
body.health-page.health-follow-up-open {
  overflow: hidden;
}

body.health-page::after {
  position: fixed;
  z-index: 40;
  inset: 0;
  content: "";
  pointer-events: none;
  background: rgba(14, 20, 17, .58);
  opacity: 0;
  visibility: hidden;
  transition: opacity .26s ease, visibility 0s linear .26s;
}

body.health-page.health-report-open::after,
body.health-page.health-follow-up-open::after {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

html.health-report-transition::view-transition-old(root),
html.health-report-transition::view-transition-new(root),
html.health-follow-up-transition::view-transition-old(root),
html.health-follow-up-transition::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

html.health-report-transition::view-transition-group(health-report),
html.health-report-transition::view-transition-old(health-report),
html.health-report-transition::view-transition-new(health-report),
html.health-follow-up-transition::view-transition-group(health-follow-up),
html.health-follow-up-transition::view-transition-old(health-follow-up),
html.health-follow-up-transition::view-transition-new(health-follow-up) {
  animation-duration: 360ms;
  animation-timing-function: cubic-bezier(.22, .8, .24, 1);
}

html.health-report-transition::view-transition-old(health-report),
html.health-report-transition::view-transition-new(health-report),
html.health-follow-up-transition::view-transition-old(health-follow-up),
html.health-follow-up-transition::view-transition-new(health-follow-up) {
  mix-blend-mode: normal;
}

/* Only the panel being expanded should receive its own transition snapshot.
   Otherwise the neighbouring follow-up card can be composited above the
   report while the report is growing across the workspace. */
html.health-report-transition .health-evidence-column .health-follow-up,
html.health-follow-up-transition .health-report-panel {
  view-transition-name: none;
}

body.health-page.health-report-open .health-evidence-column .health-follow-up:not(.is-expanded),
body.health-page.health-follow-up-open .health-report-panel:not(.is-expanded) {
  visibility: hidden;
}

.health-report-panel.is-expanded {
  position: fixed;
  z-index: 60;
  top: var(--health-report-expand-top, 84px);
  right: var(--health-report-expand-right, 0px);
  bottom: max(100px, env(safe-area-inset-bottom));
  left: var(--health-report-expand-left, 0px);
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
  max-height: none;
  margin: 0;
  border: 0;
  border-radius: 14px;
  background: var(--stitch-surface);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

.health-report-panel.is-expanded .health-report {
  min-height: 0;
  flex: 1 1 auto;
  overflow: auto;
  padding: 30px clamp(24px, 5vw, 72px) 48px;
  font-size: clamp(16px, 1.1vw, 18px);
  line-height: 1.9;
  scrollbar-width: thin;
  scrollbar-color: #5a7269 transparent;
}

.health-report-panel.is-expanded .health-report h1 {
  font-size: clamp(30px, 3vw, 44px);
  line-height: 1.3;
}

.health-report-panel.is-expanded .health-report h2 {
  font-size: clamp(22px, 2.1vw, 32px);
  line-height: 1.38;
}

.health-report-panel.is-expanded .health-report h3 {
  font-size: clamp(18px, 1.6vw, 25px);
  line-height: 1.45;
}

.health-report-panel.is-expanded .health-report table {
  font-size: clamp(13px, .95vw, 16px);
}

.health-report-panel.is-expanded .health-report-panel-heading {
  flex: 0 0 auto;
}

.health-report-panel.is-expanded .health-report-expand {
  margin-right: 1px;
}

.health-evidence-column .health-follow-up.is-expanded {
  position: fixed;
  z-index: 60;
  top: var(--health-follow-up-expand-top, 84px);
  right: var(--health-follow-up-expand-right, 0px);
  bottom: max(100px, env(safe-area-inset-bottom));
  left: var(--health-follow-up-expand-left, 0px);
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
  max-height: none;
  margin: 0;
  overflow: hidden;
  border-radius: 14px;
  background: var(--stitch-surface);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

.health-evidence-column .health-follow-up.is-expanded .health-follow-up-scroll {
  display: contents;
}

.health-evidence-column .health-follow-up.is-expanded .health-follow-up-scroll > header {
  flex: 0 0 auto;
  padding: 18px 64px 18px 24px;
}

.health-evidence-column .health-follow-up.is-expanded .health-follow-up-scroll > header h2 {
  font-size: clamp(24px, 3vw, 36px);
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-prompts {
  flex: 0 0 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 16px 24px 6px;
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-thread {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 12px 24px 0;
  font-size: clamp(15px, 1.05vw, 17px);
  line-height: 1.85;
  scrollbar-width: thin;
  scrollbar-color: #5a7269 transparent;
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-question {
  font-size: clamp(18px, 1.5vw, 24px);
  line-height: 1.5;
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-answer {
  font-size: clamp(15px, 1.05vw, 17px);
  line-height: 1.85;
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-composer {
  flex: 0 0 auto;
  margin: 14px 24px 22px;
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-composer textarea {
  min-height: 76px;
  font-size: 14px;
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-composer footer {
  min-height: 60px;
  padding: 8px 10px 8px 14px;
  flex-direction: row;
  align-items: center;
  gap: 18px;
}

.health-evidence-column .health-follow-up.is-expanded .follow-up-actions {
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: 8px;
}

.health-evidence-column .health-follow-up.is-expanded #pauseHealthFollowUp {
  width: auto;
}

.health-evidence-column .health-follow-up.is-expanded #sendHealthFollowUp {
  width: 200px;
}

html[data-theme="dark"] .health-start-panel,
html[data-theme="dark"] .health-index-dashboard,
html[data-theme="dark"] .health-index-summary,
html[data-theme="dark"] .health-index-analysis-card,
html[data-theme="dark"] .health-index-record,
html[data-theme="dark"] .health-evidence-card,
html[data-theme="dark"] .medical-sources,
html[data-theme="dark"] .health-evidence-column .health-follow-up {
  border-color: var(--stitch-line);
  background: var(--stitch-surface);
}

html[data-theme="dark"] .health-report-panel:not(.is-expanded) {
  border: 0;
  background: transparent;
}

html[data-theme="dark"] .health-evidence-column .health-follow-up {
  border-top-color: var(--stitch-ink);
}

@media (max-width: 1150px) {
  .health-workspace {
    grid-template-columns: minmax(260px, .78fr) minmax(0, 1.22fr);
  }

  .health-workspace:not(:has(.health-loading:not([hidden]))):not(:has(.health-result:not([hidden]))) {
    grid-template-columns: minmax(260px, .78fr) minmax(0, 1.22fr);
  }

  .health-evidence-column {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  .health-evidence-card,
  .medical-sources,
  .health-evidence-column .health-follow-up {
    position: static;
  }

  .health-evidence-column .health-follow-up {
    max-height: none;
    overflow: visible;
  }

  .health-evidence-column .health-follow-up-scroll {
    max-height: none;
    overflow: visible;
  }

  .health-evidence-column .health-follow-up:not(.is-expanded)::before,
  .health-evidence-column .health-follow-up:not(.is-expanded)::after,
  .health-evidence-column .health-follow-up.has-scroll-offset:not(.is-expanded)::before {
    display: none;
  }

  .health-workspace:has(.health-result:not([hidden])) .health-evidence-column {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 1000px) {
  .health-index-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .health-index-summary-primary {
    grid-column: 1 / -1;
  }

  .health-index-analysis-grid {
    grid-template-columns: 1fr;
  }

  .health-index-record-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .health-workspace {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .health-intake-column .triage-index {
    display: flex;
    min-height: 0;
    gap: 12px;
    padding: 21px 16px 18px;
  }

  .health-intake-column .health-form {
    padding: 19px 15px 17px;
  }

  .health-workspace:not(:has(.health-loading:not([hidden]))):not(:has(.health-result:not([hidden]))) {
    grid-template-columns: 1fr;
  }

  .health-index-dashboard {
    padding: 21px 16px 18px;
  }

  .health-index-summary-grid {
    gap: 8px;
  }

  .health-index-ring {
    width: 118px;
    height: 118px;
  }

  .health-index-ring-center strong {
    font-size: 27px;
  }

  .health-index-summary {
    min-height: 110px;
    padding: 13px 11px 11px;
  }

  .health-index-summary-primary {
    padding: 10px 11px;
  }

  .health-index-summary-copy > strong {
    font-size: 28px;
  }

  .health-index-analysis-grid {
    gap: 10px;
  }

 .health-index-record-grid {
    overflow: visible;
  }

  .health-start-panel {
    padding: 21px 16px 18px;
  }

  .health-intake-column .triage-intro h2 {
    font-size: 23px;
  }

  .health-start-heading h2,
  .health-evidence-card > header h2 {
    font-size: 23px;
  }

  .health-evidence-column {
    display: flex;
    gap: 12px;
  }

  .health-evidence-card,
  .medical-sources,
  .health-evidence-column .health-follow-up {
    position: static;
  }

  .health-evidence-column .health-follow-up-scroll > header {
    padding: 21px 15px 17px;
  }

  .health-loading {
    min-height: 238px;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    padding: 22px 20px 20px;
    text-align: center;
    gap: 12px;
  }

  .scan-orbit {
    width: 72px;
    height: 72px;
    margin: 0 auto;
  }

  .health-loading > div:nth-child(2) {
    text-align: center;
  }

  .health-loading > button {
    grid-column: 1;
    grid-row: 3;
    justify-self: center;
    height: 36px;
    padding: 0 14px;
    font-size: 11px;
  }

  .health-loading h2 {
    font-size: 22px;
  }

  .health-loading .estimate-track {
    margin-top: 10px;
  }

  .health-result .result-heading {
    padding: 17px 15px;
  }

  .health-result .urgency-banner,
  .health-result .report-reading {
    padding-inline: 15px;
  }

  .health-report-panel {
    margin: 0;
  }

  .health-report-panel-heading {
    padding-right: 15px;
    padding-left: 15px;
  }

  .health-report {
    padding: 19px 15px 27px;
    font-size: 13px;
  }

  .health-report-panel.is-expanded {
    top: var(--health-report-expand-top, 0px);
    right: var(--health-report-expand-right, 0px);
    bottom: 100px;
    left: var(--health-report-expand-left, 0px);
    width: auto;
    height: auto;
    min-height: 0;
    border-radius: 14px;
  }

  .health-report-panel.is-expanded .health-report {
    padding: 23px 15px max(35px, env(safe-area-inset-bottom));
  }

  .health-evidence-column .health-follow-up.is-expanded {
    top: var(--health-follow-up-expand-top, 0px);
    right: var(--health-follow-up-expand-right, 0px);
    bottom: 100px;
    left: var(--health-follow-up-expand-left, 0px);
    width: auto;
    height: auto;
    min-height: 0;
    border-radius: 14px;
  }

  .health-evidence-column .health-follow-up.is-expanded .health-follow-up-scroll > header {
    padding: 18px 52px 16px 16px;
  }

  .health-evidence-column .health-follow-up.is-expanded .follow-up-prompts {
    grid-template-columns: 1fr;
    padding: 12px 16px 4px;
  }

  .health-evidence-column .health-follow-up.is-expanded .follow-up-thread {
    padding: 10px 16px 0;
  }

  .health-evidence-column .health-follow-up.is-expanded .follow-up-composer {
    margin: 14px 16px max(20px, env(safe-area-inset-bottom));
  }

  .health-evidence-column .health-follow-up.is-expanded .follow-up-composer textarea {
    min-height: 94px;
    font-size: 16px;
  }

  .health-evidence-column .health-follow-up.is-expanded .follow-up-composer footer {
    min-height: 0;
    padding: 10px;
    flex-direction: column;
    align-items: stretch;
    gap: 9px;
  }

  .health-evidence-column .health-follow-up.is-expanded .follow-up-actions {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 7px;
  }

  .health-evidence-column .health-follow-up.is-expanded #pauseHealthFollowUp,
  .health-evidence-column .health-follow-up.is-expanded #sendHealthFollowUp {
    width: 100%;
  }
}

/* Compact index overview: one overview strip, then two readable charts. */
.health-index-dashboard {
  padding: 19px 20px 20px;
}

.health-index-dashboard-heading {
  padding-bottom: 12px;
}

.health-index-dashboard-heading > div:first-child > span,
.health-index-sources > header > span,
.health-index-analysis-card > header span {
  font-size: 10px;
}

.health-index-dashboard-heading h2 {
  margin-top: 5px;
  font-size: clamp(24px, 2.05vw, 30px);
}

.health-index-state {
  font-size: 10px;
}

.health-index-dashboard-description {
  margin: 11px 0 15px;
  font-size: 11px;
  line-height: 1.6;
}

.health-index-summary-grid {
  grid-template-columns: minmax(250px, 1.35fr) repeat(3, minmax(0, 1fr));
  gap: 0;
  padding: 5px 4px;
  border: 1px solid var(--stitch-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--stitch-surface) 68%, transparent);
}

.health-index-summary {
  min-height: 96px;
  padding: 11px 15px;
  border: 0;
  border-left: 1px solid var(--stitch-line);
  border-radius: 0;
  background: transparent;
}

.health-index-summary-primary {
  border-left: 0;
  padding: 7px 15px;
}

.health-index-ring {
  width: 90px;
  height: 90px;
}

.health-index-ring::after {
  inset: 8px;
}

.health-index-ring-center strong {
  font-size: 24px;
}

.health-index-ring-center span {
  font-size: 9px;
}

.health-index-summary-copy > span,
.health-index-summary-copy > small,
.health-index-summary > p,
.health-index-mini-stat > span {
  font-size: 10px;
}

.health-index-summary-copy > strong {
  font-size: 28px;
}

.health-index-summary-copy > small b,
.health-index-summary-copy > small em,
.health-index-summary > header > b small,
.health-index-summary > p small,
.health-index-mini-stat > small {
  font-size: 10px;
}

.health-index-summary > header {
  padding-bottom: 8px;
}

.health-index-summary > header > span {
  font-size: 10px;
}

.health-index-summary > header > b {
  font-size: 16px;
}

.health-index-progress {
  height: 5px;
  margin: 12px 0 8px;
}

.health-index-summary > p {
  margin-top: 9px;
  font-size: 10px;
}

.health-index-mini-stat {
  margin-top: 9px;
  padding-top: 7px;
}

.health-index-mini-stat b {
  font-size: 14px;
}

.health-index-insights-card {
  margin-top: 14px;
  padding: 15px 15px 12px;
  background: color-mix(in srgb, var(--stitch-surface) 58%, transparent);
}

.health-index-insights-card h3 {
  font-size: 22px;
}

.health-index-insights-card > p {
  margin: 9px 0 11px;
  font-size: 11px;
}

.health-index-insights-grid {
  gap: 0;
  border-top: 1px solid var(--stitch-line);
}

.health-index-chart-card {
  padding: 14px 15px 9px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.health-index-query-card {
  border-right: 1px solid var(--stitch-line);
}

.health-index-chart-card > header {
  padding-bottom: 8px;
}

.health-index-chart-card > header > div:first-child > span {
  font-size: 10px;
}

.health-index-chart-card h4 {
  font-size: 18px;
}

.health-index-chart-card > header > small,
.health-index-chart-card > p {
  font-size: 10px;
}

.health-index-chart-card > p {
  margin: 9px 0 10px;
  line-height: 1.5;
}

.health-index-query-list {
  gap: 8px;
}

.health-index-query-row {
  grid-template-columns: minmax(105px, .82fr) minmax(0, 1.18fr) auto;
  gap: 9px;
}

.health-index-query-row > span,
.health-index-query-row > b {
  font-size: 10px;
}

.health-index-query-track {
  height: 7px;
}

.health-index-timeline {
  height: 160px;
  padding-top: 9px;
}

.health-index-timeline-column > b,
.health-index-timeline-column > span {
  font-size: 9px;
}

.health-index-analysis-grid {
  gap: 14px;
  margin-top: 14px;
}

.health-index-analysis-card {
  padding: 14px 15px 13px;
}

.health-index-analysis-card > header h3 {
  font-size: 20px;
}

.health-index-analysis-card > header > small,
.health-index-analysis-card > p {
  font-size: 10px;
}

.health-index-bar-row > span:first-child,
.health-index-bar-row > b,
.health-index-organization-copy strong,
.health-index-organization-list li > b {
  font-size: 10px;
}

.health-index-records > header h3 {
  font-size: 20px;
}

.health-index-records > header > small,
.health-index-records > p {
  font-size: 10px;
}

html[data-theme="dark"] .health-index-summary-grid,
html[data-theme="dark"] .health-index-insights-card {
  background: var(--stitch-surface);
}

@media (max-width: 720px) {
  .health-index-dashboard {
    padding: 17px 13px 16px;
  }

  .health-index-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    padding: 4px;
  }

  .health-index-summary-primary {
    grid-column: 1 / -1;
    border-bottom: 1px solid var(--stitch-line);
    padding: 9px 11px;
  }

  .health-index-summary:not(.health-index-summary-primary) {
    padding: 11px 10px;
  }

  .health-index-summary:nth-child(3) {
    border-left: 1px solid var(--stitch-line);
  }

  .health-index-summary:nth-child(4) {
    grid-column: 1 / -1;
    border-top: 1px solid var(--stitch-line);
    border-left: 0;
  }

  .health-index-summary:nth-child(3) {
    border-top: 1px solid var(--stitch-line);
  }

  .health-index-query-card {
    border-right: 0;
    border-bottom: 1px solid var(--stitch-line);
  }

  .health-index-chart-card {
    padding-inline: 4px;
  }

  .health-index-timeline-card {
    padding-top: 14px;
  }
}

@media (min-width: 721px) {
  .health-index-summary-copy > span,
  .health-index-summary-copy > small,
  .health-index-summary > p,
  .health-index-mini-stat > span,
  .health-index-summary > header > span,
  .health-index-summary > header > b small,
  .health-index-summary > p small,
  .health-index-mini-stat > small,
  .health-index-chart-card > header > small,
  .health-index-chart-card > p,
  .health-index-query-row > span,
  .health-index-query-row > b,
  .health-index-timeline-column > b,
  .health-index-timeline-column > span {
    font-size: 11px;
  }

  .health-index-summary > header > b {
    font-size: 17px;
  }
}

/* Keep the default dashboard focused on the three status signals users need. */
.health-index-summary-grid {
  grid-template-columns: minmax(270px, 1.4fr) repeat(2, minmax(0, 1fr));
}

.health-index-summary:nth-child(4) {
  display: none;
}

.health-index-ring {
  width: 98px;
  height: 98px;
}

.health-index-ring-center strong {
  font-size: 27px;
}

.health-index-summary > header > span,
.health-index-summary > p,
.health-index-summary-copy > span,
.health-index-summary-copy > small,
.health-index-mini-stat > span {
  font-size: 11px;
}

.health-index-summary > header > b {
  font-size: 18px;
}

.health-index-summary > p {
  line-height: 1.55;
}

@media (max-width: 720px) {
  .health-index-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .health-index-ring {
    width: 92px;
    height: 92px;
  }

  .health-index-summary > header > span,
  .health-index-summary > p,
  .health-index-summary-copy > span,
  .health-index-summary-copy > small,
  .health-index-mini-stat > span {
    font-size: 10px;
  }
}

.health-index-map-card {
  min-width: 0;
  margin-top: 14px;
  padding: 15px;
  border: 1px solid var(--stitch-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--stitch-surface) 58%, transparent);
}

.health-index-map-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--stitch-line);
}

.health-index-map-card > header > div:first-child > span {
  color: var(--stitch-red);
  font: 500 10px/1.2 var(--mono);
  letter-spacing: .12em;
}

.health-index-map-card h3 {
  margin: 5px 0 0;
  color: var(--stitch-ink);
  font: 600 22px/1.25 var(--serif);
}

.health-index-map-card > p {
  margin: 9px 0 11px;
  color: var(--stitch-muted);
  font-size: 11px;
  line-height: 1.6;
}

.health-index-map-controls {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}

.health-index-map-controls button {
  min-width: 32px;
  height: 30px;
  padding: 0 7px;
  border: 1px solid var(--stitch-line);
  background: transparent;
  color: var(--stitch-ink);
  cursor: pointer;
  font: 500 13px/1 var(--mono);
}

.health-index-map-controls button:nth-child(2) {
  padding-inline: 9px;
  font-size: 10px;
}

.health-index-map-controls button:hover,
.health-index-map-controls button:focus-visible {
  border-color: var(--stitch-red);
  color: var(--stitch-red);
  outline: none;
}

.health-index-map-stage {
  position: relative;
  height: 340px;
  overflow: hidden;
  border: 1px solid var(--stitch-line);
  border-radius: 6px;
  background: var(--stitch-surface-muted);
  background-image:
    linear-gradient(to right, color-mix(in srgb, var(--stitch-line) 42%, transparent) 1px, transparent 1px),
    linear-gradient(to bottom, color-mix(in srgb, var(--stitch-line) 42%, transparent) 1px, transparent 1px);
  background-size: 28px 28px;
}

.health-index-map {
  position: absolute;
  inset: 0;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.health-index-map:active {
  cursor: grabbing;
}

.health-index-map-hint {
  position: absolute;
  z-index: 3;
  top: 9px;
  left: 9px;
  padding: 5px 8px;
  border: 1px solid color-mix(in srgb, var(--stitch-line) 80%, transparent);
  background: color-mix(in srgb, var(--stitch-surface) 82%, transparent);
  color: var(--stitch-muted);
  font: 9px/1.2 var(--mono);
  pointer-events: none;
}

.health-index-map-key {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px 12px;
  margin-top: 8px;
  padding: 0 2px;
  color: var(--stitch-muted);
  font: 9px/1.2 var(--mono);
  pointer-events: none;
}

.health-index-map-key > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.health-index-map-key i {
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--stitch-muted);
}

.health-index-map-key-topic {
  background: #d96545 !important;
}

.health-index-map-key-record {
  background: #d0a65e !important;
}

.health-index-map-key-source {
  background: #76a992 !important;
}

.health-index-map-key-vector {
  background: #7fa9b9 !important;
}

.health-index-map-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  margin: 0;
  color: var(--stitch-muted);
  font: 11px/1.4 var(--mono);
}

html[data-theme="dark"] .health-index-map-card {
  background: var(--stitch-surface);
}

@media (max-width: 720px) {
  .health-index-map-card {
    padding: 13px 11px 11px;
  }

  .health-index-map-card > header {
    display: block;
  }

  .health-index-map-controls {
    margin-top: 10px;
  }

  .health-index-map-stage {
    height: 380px;
  }

  .health-index-map-hint {
    display: none;
  }

  .health-index-map-key {
    display: flex;
    gap: 5px 10px;
  }
}

/* Keep the English primary action balanced on the narrowest phones. The
   translated label is longer than the Chinese source and should stay on one
   visual line beside the arrow. */
html[lang="en"] .health-form .assess-button {
  font-size: clamp(13px, 4vw, 16px);
  padding-inline: 12px;
}

html[lang="en"] .health-form .assess-button span {
  white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Canonical site tokens and surface rules

   Every page consumes this same paper / ink / muted / line / coral palette.
   The legacy variable names below are kept as compatibility bridges for the
   page styles, so a page can keep its existing behavior without owning a
   second color system.
   ------------------------------------------------------------------------- */
:root {
  color-scheme: light;
  --site-bg: #f5f1e8;
  --site-surface: #fffdf7;
  --site-surface-muted: #f0ece2;
  --site-ink: #171817;
  --site-ink-soft: #26342f;
  --site-muted: #70716b;
  --site-line: #d9d4c9;
  --site-accent: #d25435;
  --site-accent-strong: #b9432a;
  --site-sage: #7d988a;
  --site-gold: #b99a63;
  --site-navy: #243a52;
  --site-shadow: 0 18px 42px rgba(47, 46, 39, .08);
  --site-radius: 8px;
  --site-radius-sm: 5px;
  --site-card-inset: 16px;
  --site-control-height: 44px;
  --site-mono: "DM Mono", monospace;
  --site-serif: "Noto Serif SC", serif;
  --site-sans: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Helvetica Neue", Arial, sans-serif;

  --ink: var(--site-ink);
  --ink2: var(--site-ink-soft);
  --ink-2: var(--site-ink-soft);
  --paper: var(--site-bg);
  --card: var(--site-surface);
  --line: var(--site-line);
  --muted: var(--site-muted);
  --accent: var(--site-accent);
  --red: var(--site-accent);
  --green: #43806b;
  --sage: var(--site-sage);
  --medical: #4f8e79;
  --gold: var(--site-gold);
  --shadow: var(--site-shadow);
  --mono: var(--site-mono);
  --serif: var(--site-serif);
  --sans: var(--site-sans);

  --stitch-paper: var(--site-bg);
  --stitch-surface: var(--site-surface);
  --stitch-surface-muted: var(--site-surface-muted);
  --stitch-ink: var(--site-ink);
  --stitch-muted: var(--site-muted);
  --stitch-line: var(--site-line);
  --stitch-red: var(--site-accent);
  --stitch-red-dark: var(--site-accent-strong);
  --stitch-sage: var(--site-sage);
  --stitch-navy: var(--site-navy);
  --stitch-shadow: var(--site-shadow);
  --chart-grid: #e6e0d5;
  --chart-marker: #b8b0a3;
  --chart-tooltip: rgba(20, 29, 27, .95);

  --ai-paper: var(--site-bg);
  --ai-ink: var(--site-ink);
  --ai-muted: var(--site-muted);
  --ai-rule: var(--site-line);
  --ai-coral: var(--site-accent);
  --ai-violet: var(--site-sage);
  --ai-navy: var(--site-navy);
  --ai-serif: var(--site-serif);
  --ai-sans: var(--site-sans);
  --ai-mono: var(--site-mono);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --site-bg: #101613;
  --site-surface: #18211c;
  --site-surface-muted: #202a24;
  --site-ink: #e9eee9;
  --site-ink-soft: #d7e0da;
  --site-muted: #a6b0a9;
  --site-line: #34443b;
  --site-accent: #ef795b;
  --site-accent-strong: #d65d42;
  --site-sage: #91ad9c;
  --site-gold: #d7ac60;
  --site-navy: #1b2f43;
  --site-shadow: 0 18px 42px rgba(0, 0, 0, .24);

  --ink: var(--site-ink);
  --ink2: var(--site-ink-soft);
  --ink-2: var(--site-ink-soft);
  --paper: var(--site-bg);
  --card: var(--site-surface);
  --line: var(--site-line);
  --muted: var(--site-muted);
  --accent: var(--site-accent);
  --red: var(--site-accent);
  --green: #71b394;
  --sage: var(--site-sage);
  --medical: #71b394;
  --gold: var(--site-gold);
  --shadow: var(--site-shadow);

  --stitch-paper: var(--site-bg);
  --stitch-surface: var(--site-surface);
  --stitch-surface-muted: var(--site-surface-muted);
  --stitch-ink: var(--site-ink);
  --stitch-muted: var(--site-muted);
  --stitch-line: var(--site-line);
  --stitch-red: var(--site-accent);
  --stitch-red-dark: var(--site-accent-strong);
  --stitch-sage: var(--site-sage);
  --stitch-navy: var(--site-navy);
  --stitch-shadow: var(--site-shadow);
  --chart-grid: #2f3c35;
  --chart-marker: #627268;
  --chart-tooltip: rgba(5, 12, 9, .97);

  --ai-paper: var(--site-bg);
  --ai-ink: var(--site-ink);
  --ai-muted: var(--site-muted);
  --ai-rule: var(--site-line);
  --ai-coral: var(--site-accent);
  --ai-violet: var(--site-sage);
  --ai-navy: var(--site-navy);
}

html,
body {
  background-color: var(--site-bg);
  color: var(--site-ink);
}

body,
button,
input,
textarea,
select {
  font-family: var(--site-sans);
}

.site-nav,
.finance-nav.site-nav,
.research-nav.site-nav,
.health-nav.site-nav,
.topbar {
  border-color: var(--site-line);
}

.finance-nav.site-nav,
.research-nav.site-nav,
.health-nav.site-nav,
.site-nav {
  background: color-mix(in srgb, var(--site-bg) 92%, transparent);
}

.panel,
.auth-card,
.account-card,
.account-data-card,
.query-deck,
.triage-shell,
.health-start-panel,
.health-result,
.health-evidence-card,
.health-report-panel,
.health-follow-up,
.project-bar,
.source-ledger,
.analysis-desk,
.ai-stat,
.ai-chart-card,
.ai-insight,
.user-directory {
  border-radius: var(--site-radius);
  border-color: var(--site-line);
}

.panel,
.auth-card,
.account-card,
.account-data-card,
.ai-stat:not(.ai-stat-dark),
.ai-chart-card {
  background: color-mix(in srgb, var(--site-surface) 94%, transparent);
}

.ai-subscription-page {
  background: var(--site-bg);
  color: var(--site-ink);
}

.ai-rail,
.ai-stat-dark,
.ai-insight-dark {
  background: var(--site-ink);
}

.ai-stat-violet,
.ai-insight-violet {
  background: color-mix(in srgb, var(--site-sage) 18%, var(--site-surface));
}

.ai-mode-switch {
  background: var(--site-surface-muted);
}

.ai-source-list,
.ai-chart-footnote,
.ai-footer {
  border-color: var(--site-line);
}

.availability-notice {
  margin-top: 18px;
  padding: 13px 16px;
  border-left: 3px solid var(--site-gold);
  /* Keep the light-theme notice visibly separate from the paper background. */
  background: #e8ddc5;
  background: color-mix(in srgb, var(--site-gold) 34%, var(--site-surface));
  color: #4e4638;
  color: color-mix(in srgb, var(--site-ink) 78%, var(--site-gold));
  font-size: 12px;
  line-height: 1.7;
}

.chat-title-row {
  visibility: hidden;
}

.chat-title-row.is-ready {
  visibility: visible;
}

html[data-theme="dark"] .availability-notice {
  background: #302819;
  color: #dac69d;
}

/* -------------------------------------------------------------------------
   Unified main-product surfaces

   The chat, finance, research, and health pages share one visual grammar:
   warm paper outside, quiet cards inside, one coral action color, and one
   dark workbench treatment for data-entry / analysis areas. Page styles keep
   their layout and behavior; this layer owns the visual contract.
   ------------------------------------------------------------------------- */
:root {
  --site-workbench: #1b2521;
  --site-workbench-strong: #151d1a;
  --site-workbench-line: #3d5047;
  --site-workbench-ink: #f7f3ea;
  --site-workbench-muted: #aab7b0;
  --site-control-surface: #f7f4ec;
  --site-control-line: #cfc9bc;
}

html[data-theme="dark"] {
  --site-workbench: #0f1814;
  --site-workbench-strong: #0b120f;
  --site-workbench-line: #34473d;
  --site-workbench-ink: #edf2ed;
  --site-workbench-muted: #a4b2a9;
  --site-control-surface: #202a24;
  --site-control-line: #41544a;
}

/* Documents share the dark analysis deck with finance / research / health.
   The page chrome and project bar stay on paper; intake stays on
   --site-workbench. In light mode the workspace keeps dark title bars and
   puts the file list, version tree, preview, and AI edit on paper. */

/* One card geometry for all content surfaces. */
.app-shell .welcome-product,
.app-shell .composer,
body.finance-page .metric-strip,
body.finance-page .panel,
body.finance-page .finance-followup,
body.finance-page .news-card,
body.finance-page .news-skeleton article,
body.research-page .project-bar,
body.documents-page .document-project-bar,
body.health-page .health-index-dashboard,
body.health-page .health-index-map-card,
body.health-page .health-index-records,
body.health-page .health-index-sources,
body.health-page .health-start-panel,
body.health-page .health-result,
body.health-page .health-evidence-card,
body.health-page .health-report-panel,
body.health-page .health-follow-up,
body.health-page .report-upload {
  border: 1px solid var(--site-line);
  border-radius: var(--site-radius);
  background: var(--site-surface);
  color: var(--site-ink);
  box-shadow: var(--site-shadow);
}

/* The follow-up section is the card; its composer is only the input area.
   Keeping a second card here creates the visible half-frame above the textarea. */
body.health-page .follow-up-composer {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.health-page #followUpStatus:empty {
  display: none;
}

.app-shell .welcome-product:hover,
.app-shell .composer:focus-within,
body.finance-page .panel,
body.finance-page .news-card,
body.research-page .project-bar,
body.health-page .health-index-dashboard,
body.health-page .health-start-panel,
body.health-page .health-result,
body.health-page .health-follow-up {
  border-color: var(--site-line);
}

.app-shell .welcome-product:hover,
body.finance-page .news-card > a:hover {
  background: var(--site-surface-muted);
}

.app-shell .composer {
  border-radius: var(--site-radius);
  background: color-mix(in srgb, var(--site-surface) 96%, transparent);
  box-shadow: var(--site-shadow);
}

.app-shell .send-button,
.app-shell .new-chat,
body.finance-page .research-button,
body.research-page .index-button,
body.research-page #generateButton,
body.documents-page .document-upload-button,
body.documents-page .document-edit-button,
body.health-page .assess-button,
body.health-page #sendHealthFollowUp {
  border: 1px solid var(--site-accent);
  border-radius: var(--site-radius-sm);
  background: var(--site-accent);
  color: #fff;
  box-shadow: none;
}

.app-shell .send-button:hover,
.app-shell .new-chat:hover,
body.finance-page .research-button:hover,
body.research-page .index-button:hover,
body.research-page #generateButton:hover,
body.documents-page .document-upload-button:hover,
body.documents-page .document-edit-button:hover,
body.health-page .assess-button:hover,
body.health-page #sendHealthFollowUp:hover {
  border-color: var(--site-accent-strong);
  background: var(--site-accent-strong);
  box-shadow: none;
}

/* Dark workbench: the same treatment is used for the primary input /
   analysis areas, so the product pages share one visual grammar. */
body.finance-page .query-deck,
body.research-page .intake-deck,
body.research-page .research-workspace,
body.documents-page .document-intake,
body.documents-page .document-workspace,
body.health-page .triage-shell {
  border: 1px solid var(--site-workbench-line);
  border-radius: var(--site-radius);
  background: var(--site-workbench);
  color: var(--site-workbench-ink);
  box-shadow: var(--site-shadow);
}

body.finance-page .query-deck:before {
  display: none;
}

body.finance-page .query-deck label > span,
body.finance-page .period-row > span,
body.finance-page .period-row small,
body.research-page .url-intake label,
body.research-page .url-intake small,
body.research-page .file-drop small,
body.health-page .form-heading span,
body.health-page .health-form label > span,
body.health-page .severity-field legend {
  color: var(--site-workbench-muted);
}

body.finance-page .query-deck input,
body.research-page .url-intake textarea,
body.research-page .research-command textarea,
body.documents-page .document-command textarea,
body.health-page .health-form textarea,
body.health-page .health-form input,
body.health-page .health-form select,
body.health-page .follow-up-composer textarea {
  border: 1px solid var(--site-control-line);
  border-radius: var(--site-radius-sm);
  background: var(--site-control-surface);
  color: var(--site-ink);
  color-scheme: light;
}

body.finance-page .query-deck input:focus,
body.research-page .url-intake textarea:focus,
body.research-page .research-command textarea:focus,
body.documents-page .document-command textarea:focus,
body.health-page .health-form textarea:focus,
body.health-page .health-form input:focus,
body.health-page .health-form select:focus,
body.health-page .follow-up-composer textarea:focus {
  border-color: var(--site-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--site-accent) 14%, transparent);
}

body.finance-page .market-selector,
body.finance-page .period-row,
body.research-page .intake-number,
body.research-page .url-intake,
body.research-page .file-drop,
body.documents-page .document-intake-number,
body.documents-page .document-drop,
body.documents-page .document-file-pane,
body.documents-page .document-version-pane,
body.health-page .triage-index,
body.health-page .form-heading,
body.health-page .health-form,
body.health-page .report-upload,
body.health-page .consent-row {
  border-color: var(--site-workbench-line);
}

body.finance-page .market-selector button,
body.finance-page .period-row button {
  border: 1px solid var(--site-workbench-line);
  border-radius: var(--site-radius-sm);
  background: transparent;
  color: var(--site-workbench-muted);
}

body.finance-page .market-selector button:hover,
body.finance-page .market-selector button.active,
body.finance-page .period-row button:hover,
body.finance-page .period-row button.active {
  border-color: var(--site-accent);
  background: var(--site-accent);
  color: #fff;
}

body.finance-page .finance-clear-button {
  border: 1px solid var(--site-workbench-line);
  border-radius: var(--site-radius-sm);
  background: transparent;
  color: var(--site-workbench-muted);
}

body.research-page .file-drop {
  color: var(--site-workbench-ink);
}

body.research-page .file-drop:hover,
body.research-page .file-drop.dragging {
  background: color-mix(in srgb, var(--site-workbench) 72%, var(--site-accent));
}

body.research-page .drop-mark {
  border-color: var(--site-workbench-line);
  color: var(--site-gold);
}

body.research-page .source-ledger,
body.research-page .analysis-desk {
  background: var(--site-workbench);
  color: var(--site-workbench-ink);
}

body.research-page .source-ledger > header,
body.research-page .desk-heading {
  background: var(--site-workbench-strong);
  border-color: var(--site-workbench-line);
  color: var(--site-workbench-ink);
}

body.research-page .source-ledger header span,
body.research-page .desk-heading span,
body.research-page .source-card p,
body.research-page .source-meta,
body.research-page .report-empty p {
  color: var(--site-workbench-muted);
}

body.research-page .source-card,
body.research-page .source-empty,
body.research-page .research-command,
body.research-page .evidence-strip,
body.research-page .stream-status {
  border-color: var(--site-workbench-line);
  color: var(--site-workbench-ink);
}

body.research-page .source-card:hover,
body.research-page .source-card.graph-active,
body.research-page .source-card:target {
  background: color-mix(in srgb, var(--site-workbench) 72%, var(--site-accent));
  box-shadow: inset 3px 0 var(--site-accent);
}

body.research-page .mode-switch button {
  border-color: var(--site-workbench-line);
  background: transparent;
  color: var(--site-workbench-muted);
}

body.research-page .mode-switch button:hover,
body.research-page .mode-switch button.active {
  border-color: var(--site-accent);
  background: var(--site-accent);
  color: #fff;
}

body.research-page .report-empty h3,
body.research-page .report-content,
body.research-page .report-content h1,
body.research-page .report-content h2,
body.research-page .report-content h3 {
  color: var(--site-workbench-ink);
}

body.research-page .report-content h2,
body.research-page .report-content th,
body.research-page .report-content td {
  border-color: var(--site-workbench-line);
}

body.research-page .report-content blockquote {
  color: var(--site-workbench-muted);
  border-left-color: var(--site-accent);
  background: color-mix(in srgb, var(--site-workbench) 72%, var(--site-accent));
}

body.health-page .triage-index {
  background: var(--site-workbench-strong);
  color: var(--site-workbench-ink);
}

body.health-page .health-form {
  background: var(--site-workbench);
  color: var(--site-workbench-ink);
}

body.health-page .form-heading h2,
body.health-page .health-form h3,
body.health-page .health-form b,
body.health-page .health-form .consent-row,
body.health-page .health-form .prescription-note {
  color: var(--site-workbench-ink);
}

body.health-page .quick-symptoms button,
body.health-page .severity-field label > span,
body.health-page .image-purpose button,
body.health-page .report-drop,
body.health-page .purpose-note,
body.health-page .prescription-note,
body.health-page .consent-row {
  border-color: var(--site-workbench-line);
  background: transparent;
  color: var(--site-workbench-muted);
}

body.health-page .quick-symptoms button:hover,
body.health-page .quick-symptoms button.active,
body.health-page .severity-field input:checked + span,
body.health-page .image-purpose button.active {
  border-color: var(--site-accent);
  background: color-mix(in srgb, var(--site-accent) 18%, var(--site-workbench));
  color: var(--site-workbench-ink);
}

body.health-page .report-upload {
  background: var(--site-workbench-strong);
  box-shadow: none;
}

body.health-page .report-upload > header,
body.health-page .report-drop,
body.health-page .purpose-note,
body.health-page .prescription-note,
body.health-page .consent-row {
  background: transparent;
}

body.finance-page .news-grid {
  gap: 12px;
  border: 0;
}

body.finance-page .news-card,
body.finance-page .news-card:first-child,
body.finance-page .news-skeleton article,
body.finance-page .news-skeleton article:first-child {
  overflow: hidden;
  background: var(--site-surface);
  border: 1px solid var(--site-line);
  border-radius: var(--site-radius);
  color: var(--site-ink);
  box-shadow: var(--site-shadow);
}

body.finance-page .news-card:first-child > a,
body.finance-page .news-card:first-child h3,
body.finance-page .news-card:first-child .news-card-meta b {
  color: var(--site-ink);
}

body.finance-page .news-card:first-child > a:hover,
body.finance-page .news-card > a:hover {
  background: color-mix(in srgb, var(--site-accent) 12%, var(--site-surface));
  box-shadow: inset 4px 0 0 var(--site-accent);
}

body.finance-page .news-card:first-child p,
body.finance-page .news-card:first-child .news-index,
body.finance-page .news-card:first-child .news-card-meta,
body.finance-page .news-card-meta {
  color: var(--site-muted);
}

body.finance-page .news-card:first-child .news-card-meta {
  border-top-color: var(--site-line);
}

/* The appearance selector is a normal content card too; keep its old dark
   workbench treatment from turning the light-theme text into near-white. */
.account-theme-card {
  background: var(--site-surface);
  border-color: var(--site-line);
  color: var(--site-ink);
}

.account-theme-card .account-card-heading {
  border-bottom-color: var(--site-line);
}

.account-theme-card .account-card-heading h2,
.account-theme-card .account-theme-setting label {
  color: var(--site-ink);
}

.account-theme-card .account-section-kicker,
.account-theme-card .account-card-heading p:last-child {
  color: var(--site-muted);
}

.account-theme-card .theme-preference-status {
  color: var(--site-sage);
}

.account-theme-card .account-theme-setting select {
  border-color: var(--site-line);
  background: var(--site-surface-muted);
  color: var(--site-ink);
}

.account-submit {
  border-color: var(--site-accent);
  background: var(--site-accent);
  color: #fff;
}

.account-submit:hover {
  border-color: var(--site-accent-strong);
  background: var(--site-accent-strong);
  color: #fff;
}

body.finance-page .market-news-heading {
  border-bottom: 0;
  padding-bottom: var(--site-card-inset);
}

body.finance-page .news-card:first-child,
body.finance-page .news-skeleton article:first-child {
  border-top: 3px solid var(--site-ink);
}

body.finance-page .metric-strip {
  overflow: hidden;
}

body.finance-page .quality-note,
body.health-page .urgency-banner,
body.health-page .report-reading,
body.health-page .visual-reading {
  border: 1px solid var(--site-line);
  border-radius: var(--site-radius-sm);
  background: var(--site-surface-muted);
  color: var(--site-ink);
}

body.health-page .health-index-summary,
body.health-page .health-index-map-card,
body.health-page .health-index-records,
body.health-page .health-index-sources,
body.health-page .health-start-points article {
  border-color: var(--site-line);
  background: var(--site-surface-muted);
  color: var(--site-ink);
}

body.health-page .health-index-map-card,
body.health-page .health-index-records,
body.health-page .health-index-sources {
  padding: var(--site-card-inset);
}

/* Keep controls readable when the global theme is dark. */
html[data-theme="dark"] body.finance-page .query-deck input,
html[data-theme="dark"] body.research-page .url-intake textarea,
html[data-theme="dark"] body.research-page .research-command textarea,
html[data-theme="dark"] body.health-page .health-form textarea,
html[data-theme="dark"] body.health-page .health-form input,
html[data-theme="dark"] body.health-page .health-form select,
html[data-theme="dark"] body.health-page .follow-up-composer textarea {
  color-scheme: dark;
}

html[data-theme="dark"] body.health-page .triage-shell {
  background: var(--site-workbench);
}

/* Keep generated research reports readable on their paper-like surface. */
body.research-page .research-nav + main .report-content {
  border-color: var(--site-line);
  border-radius: var(--site-radius);
  background: var(--site-surface);
  color: var(--site-ink);
}

body.research-page .research-nav + main .report-content h1,
body.research-page .research-nav + main .report-content h2,
body.research-page .research-nav + main .report-content h3,
body.research-page .research-nav + main .report-content p,
body.research-page .research-nav + main .report-content li,
body.research-page .research-nav + main .report-content th,
body.research-page .research-nav + main .report-content td {
  color: var(--site-ink);
}

body.research-page .research-nav + main .report-content h2,
body.research-page .research-nav + main .report-content th,
body.research-page .research-nav + main .report-content td {
  border-color: var(--site-line);
}

body.research-page .research-nav + main .report-content th {
  background: var(--site-surface-muted);
}

body.research-page .research-nav + main .report-content strong,
body.research-page .research-nav + main .report-content a {
  color: var(--site-accent);
}

body.research-page .research-nav + main .report-content blockquote {
  border-left-color: var(--site-accent);
  background: var(--site-surface-muted);
  color: var(--site-ink-soft);
}

/* Segmented controls share one quiet grid; selected states change fill only. */
body.health-page .health-nav + main .severity-field label > span {
  border-color: var(--site-workbench-line);
  border-radius: 0;
  box-shadow: none !important;
}

body.health-page .health-nav + main .severity-field label:first-of-type > span {
  border-top-left-radius: var(--site-radius-sm);
  border-bottom-left-radius: var(--site-radius-sm);
}

body.health-page .health-nav + main .severity-field label:last-of-type > span {
  border-right: 1px solid var(--site-workbench-line);
  border-top-right-radius: var(--site-radius-sm);
  border-bottom-right-radius: var(--site-radius-sm);
}

body.health-page .health-nav + main .severity-field input:checked + span {
  border-color: var(--site-workbench-line);
  background: var(--site-accent);
  color: #fff;
  box-shadow: none !important;
}

body.health-page .health-nav + main .report-upload .image-purpose {
  overflow: hidden;
  border: 1px solid var(--site-workbench-line);
  border-radius: var(--site-radius-sm);
}

body.health-page .health-nav + main .report-upload .image-purpose button {
  border: 0;
  border-right: 1px solid var(--site-workbench-line);
  border-radius: 0;
  background: transparent;
  color: var(--site-workbench-muted);
  box-shadow: none !important;
}

body.health-page .health-nav + main .report-upload .image-purpose button:last-child {
  border-right: 0;
}

body.health-page .health-nav + main .report-upload .image-purpose button.active {
  background: var(--site-accent);
  color: #fff;
  box-shadow: none !important;
}

/* The research workspace is a layout frame, not another card. Keep the
   source ledger and synthesis desk as the visible surfaces inside it. */
body.research-page .research-nav + main > .research-workspace {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* Finance follow-up reading mode. The rail becomes a bounded reading window
   whose top stays aligned with the card's current top edge and whose bottom
   meets the viewport edge. */
body.finance-page .finance-followup {
  backface-visibility: hidden;
  transform-origin: top right;
  view-transition-name: finance-followup;
}

.finance-followup-heading {
  position: relative;
  padding-right: 40px;
}

.finance-followup .finance-followup-expand {
  top: 12px;
  right: 12px;
}

body.finance-page.finance-followup-open {
  overflow: hidden;
}

body.finance-page.finance-followup-open::after {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

body.finance-page.finance-report-open .finance-followup:not(.is-expanded),
body.finance-page.finance-followup-open .ai-report:not(.is-expanded) {
  visibility: hidden;
}

html.finance-followup-transition::view-transition-old(root),
html.finance-followup-transition::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

html.finance-followup-transition::view-transition-group(finance-followup),
html.finance-followup-transition::view-transition-old(finance-followup),
html.finance-followup-transition::view-transition-new(finance-followup) {
  animation-duration: 360ms;
  animation-timing-function: cubic-bezier(.22, .8, .24, 1);
  mix-blend-mode: normal;
}

html.finance-followup-transition .finance-report-column .ai-report,
html.finance-report-transition .finance-report-column .finance-followup {
  view-transition-name: none;
}

.finance-followup.is-expanded {
  position: fixed;
  z-index: 60;
  top: var(--finance-followup-expand-top, 0px);
  right: var(--finance-followup-expand-right, 0px);
  bottom: 0;
  left: var(--finance-followup-expand-left, 0px);
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
  background: var(--stitch-surface);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

.finance-followup.is-expanded .finance-followup-expand {
  top: 14px;
  right: 14px;
}

.finance-followup.is-expanded .finance-followup-heading {
  flex: 0 0 auto;
  padding: 22px 64px 17px 24px;
}

.finance-followup.is-expanded .finance-followup-heading h3 {
  font-size: clamp(24px, 3vw, 36px);
}

.finance-followup.is-expanded .finance-followup-thread {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 16px 24px 10px;
  overflow: auto;
  font-size: clamp(14px, 1.05vw, 17px);
  line-height: 1.85;
  scrollbar-width: thin;
  scrollbar-color: #5a7269 transparent;
}

.finance-followup.is-expanded .finance-followup-message {
  padding: 13px 15px;
  font-size: inherit;
  line-height: inherit;
}

.finance-followup.is-expanded .finance-followup-message small {
  font-size: 10px;
}

.finance-followup.is-expanded .finance-followup-message .markdown-body {
  font-size: inherit;
  line-height: inherit;
}

.finance-followup.is-expanded .finance-followup-message .markdown-body h1 {
  font-size: clamp(22px, 2.4vw, 34px);
}

.finance-followup.is-expanded .finance-followup-message .markdown-body h2 {
  font-size: clamp(18px, 2vw, 28px);
}

.finance-followup.is-expanded .finance-followup-message .markdown-body h3 {
  font-size: clamp(16px, 1.6vw, 24px);
}

.finance-followup.is-expanded .finance-followup-form {
  flex: 0 0 auto;
  margin: 14px 24px 0;
}

.finance-followup.is-expanded .finance-followup-form textarea {
  min-height: 72px;
  font-size: 14px;
}

.finance-followup.is-expanded .finance-followup-form button {
  min-height: 52px;
  padding-inline: 20px;
}

.finance-followup.is-expanded > small {
  flex: 0 0 auto;
  margin: 10px 24px max(18px, env(safe-area-inset-bottom));
  font-size: 10px;
}

/* Health image input: the first click opens a clear multi-source card instead
   of immediately handing the user to the browser's file chooser. */
body.health-page.health-image-picker-open {
  overflow: hidden;
  overscroll-behavior: none;
}

body.health-page .report-drop {
  width: calc(100% - 32px);
  color: var(--site-workbench-ink);
  font: inherit;
  text-align: left;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none;
}

body.health-page .report-drop:hover,
body.health-page .report-drop:focus-visible {
  border-color: var(--site-accent);
  background: color-mix(in srgb, var(--site-workbench) 82%, var(--site-accent));
  outline: none;
}

body.health-page .report-drop > i {
  color: var(--site-accent);
}

body.health-page .health-image-picker[hidden] {
  display: none !important;
}

body.health-page .health-image-picker {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
}

body.health-page .health-image-picker-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  background: rgba(4, 12, 10, .72);
  backdrop-filter: blur(5px);
  cursor: default;
  touch-action: none;
}

body.health-page .health-image-picker-panel {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(560px, 100%);
  max-height: min(860px, calc(100dvh - 40px));
  overflow: auto;
  border: 1px solid var(--site-workbench-line);
  border-top: 3px solid var(--site-accent);
  background: var(--site-workbench-strong);
  color: var(--site-workbench-ink);
  box-shadow: 0 30px 90px rgba(0, 0, 0, .38);
  animation: healthImagePickerReveal .22s ease both;
  overscroll-behavior: contain;
  touch-action: pan-y;
}

body.health-page .health-image-picker-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px 18px;
  border-bottom: 1px solid var(--site-workbench-line);
}

body.health-page .health-image-picker-heading > div {
  min-width: 0;
}

body.health-page .health-image-picker-heading > div > span {
  display: block;
  color: var(--site-accent);
  font: 500 8px var(--mono);
  letter-spacing: .14em;
}

body.health-page .health-image-picker-heading h2 {
  margin: 7px 0 6px;
  color: var(--site-workbench-ink);
  font: 600 24px/1.3 var(--serif);
}

body.health-page .health-image-picker-heading p {
  margin: 0;
  color: var(--site-workbench-muted);
  font-size: 10px;
  line-height: 1.7;
}

body.health-page .health-image-picker-close {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border: 1px solid var(--site-workbench-line);
  background: transparent;
  color: var(--site-workbench-muted);
  font-size: 23px;
  line-height: 1;
  cursor: pointer;
}

body.health-page .health-image-picker-close:hover,
body.health-page .health-image-picker-close:focus-visible {
  border-color: var(--site-accent);
  color: var(--site-workbench-ink);
  outline: none;
}

body.health-page .health-image-picker-body {
  padding: 22px 24px 18px;
}

body.health-page .health-image-dropzone {
  display: grid;
  justify-items: center;
  gap: 9px;
  padding: 30px 22px 26px;
  border: 1px dashed var(--site-workbench-line);
  background: color-mix(in srgb, var(--site-workbench) 75%, var(--site-accent));
  text-align: center;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

body.health-page .health-image-dropzone.dragging {
  border-color: var(--site-accent);
  background: color-mix(in srgb, var(--site-workbench) 58%, var(--site-accent));
  transform: translateY(-1px);
}

body.health-page .health-image-drop-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 1px solid var(--site-accent);
  border-radius: 50%;
  color: var(--site-accent);
  font-size: 28px;
  line-height: 1;
}

body.health-page .health-image-dropzone h3 {
  margin: 2px 0 0;
  color: var(--site-workbench-ink);
  font: 600 18px var(--serif);
}

body.health-page .health-image-dropzone p {
  max-width: 390px;
  margin: 0;
  color: var(--site-workbench-muted);
  font-size: 10px;
  line-height: 1.7;
}

body.health-page .health-image-choose {
  min-height: 46px;
  margin-top: 5px;
  border: 1px solid var(--site-accent);
  background: var(--site-accent);
  color: #fff;
  padding: 0 16px;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
}

body.health-page .health-image-choose:hover,
body.health-page .health-image-choose:focus-visible {
  border-color: var(--site-accent-strong);
  background: var(--site-accent-strong);
  outline: none;
}

body.health-page .health-image-choose b {
  margin-left: 13px;
  font: 400 15px var(--mono);
}

body.health-page .health-image-dropzone input[type="file"] {
  display: none;
}

body.health-page .health-image-picker-status {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-top: 14px;
  padding: 12px 0 0;
  border: 0;
  border-top: 1px solid var(--site-workbench-line);
  background: transparent;
}

body.health-page .health-image-picker-status b {
  color: var(--site-workbench-ink);
  font-size: 11px;
}

body.health-page .health-image-picker-status small {
  color: var(--site-workbench-muted);
  font: 8px var(--mono);
  text-align: right;
}

body.health-page .health-image-picker-status.error {
  border-top-color: var(--site-accent);
  background: transparent;
  color: #ffb6a6;
}

body.health-page .health-image-picker-status.error b {
  color: #ffb6a6;
}

body.health-page .health-image-picker-status.error small {
  display: none;
}

body.health-page .health-image-picker-footer {
  display: flex;
  justify-content: flex-end;
  padding: 0 24px 22px;
}

body.health-page .health-image-picker-done {
  min-height: 42px;
  border: 1px solid var(--site-workbench-line);
  background: transparent;
  color: var(--site-workbench-muted);
  padding: 0 14px;
  font-size: 10px;
  cursor: pointer;
}

body.health-page .health-image-picker-done:hover,
body.health-page .health-image-picker-done:focus-visible {
  border-color: var(--site-accent);
  color: var(--site-workbench-ink);
  outline: none;
}

@keyframes healthImagePickerReveal {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 720px) {
  body.health-page .health-image-picker {
    place-items: end center;
    padding: 0;
  }

  body.health-page .health-image-picker-panel {
    width: 100%;
    max-height: calc(100dvh - 10px);
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 16px 16px 0 0;
  }

  body.health-page .health-image-picker-heading {
    padding: 18px 16px 15px;
  }

  body.health-page .health-image-picker-heading h2 {
    font-size: 21px;
  }

  body.health-page .health-image-picker-body {
    padding: 16px 15px 14px;
  }

  body.health-page .health-image-dropzone {
    padding: 25px 15px 22px;
  }

  body.health-page .health-image-picker-status {
    display: block;
  }

  body.health-page .health-image-picker-status small {
    display: block;
    margin-top: 5px;
    text-align: left;
  }

  body.health-page .health-image-picker-status.error small {
    display: none;
  }

  body.health-page .health-image-picker-footer {
    padding: 0 15px calc(15px + env(safe-area-inset-bottom));
  }

  body.health-page .health-image-picker-done {
    width: 100%;
    min-height: 48px;
  }
}

body.health-page .report-drop small {
  line-height: 1.5;
}

body.health-page .health-image-paste-guide {
  display: flex;
  align-items: baseline;
  justify-content: center;
  flex-wrap: wrap;
  width: min(520px, 100%);
  gap: 5px 10px;
  padding: 2px 0 0;
  text-align: center;
}

body.health-page .health-image-paste-guide > span {
  flex: 0 0 auto;
  color: var(--site-accent);
  font: 500 9px var(--mono);
  letter-spacing: .04em;
}

body.health-page .health-image-paste-guide > small {
  flex: 0 0 auto;
  color: var(--site-workbench-muted);
  font: 8px var(--mono);
}

body.health-page .health-image-context-menu {
  position: fixed;
  z-index: 170;
  min-width: 180px;
  padding: 4px;
  border: 1px solid var(--site-workbench-line);
  background: var(--site-workbench-strong);
  box-shadow: 0 18px 40px rgba(0, 0, 0, .4);
}

body.health-page .health-image-context-menu[hidden] {
  display: none !important;
}

body.health-page .health-image-context-menu button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  min-height: 42px;
  border: 0;
  background: transparent;
  color: var(--site-workbench-ink);
  padding: 8px 10px;
  text-align: left;
  cursor: pointer;
}

body.health-page .health-image-context-menu button:hover,
body.health-page .health-image-context-menu button:focus-visible {
  background: color-mix(in srgb, var(--site-accent) 18%, var(--site-workbench));
  outline: none;
}

body.health-page .health-image-context-menu button span {
  font-size: 11px;
}

body.health-page .health-image-context-menu button small {
  color: var(--site-workbench-muted);
  font: 8px var(--mono);
}

body.health-page .health-image-picker-preview {
  margin-top: 16px;
}

body.health-page .health-image-picker-preview[hidden] {
  display: none !important;
}

body.health-page .health-image-picker-preview-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

body.health-page .health-image-picker-preview-heading b {
  color: var(--site-workbench-ink);
  font-size: 11px;
}

body.health-page .health-image-picker-preview-heading small {
  color: var(--site-workbench-muted);
  font: 8px var(--mono);
}

body.health-page .health-image-picker-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.health-page .health-image-picker-preview-grid .report-image-card {
  display: block;
  aspect-ratio: 1;
  min-width: 0;
  overflow: hidden;
  padding: 0;
  border-color: var(--site-workbench-line);
  background: var(--site-workbench);
}

body.health-page .health-image-picker-preview-grid .report-image-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: none;
}

body.health-page .health-image-picker-preview-grid .report-image-card > div {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  min-width: 0;
  padding: 26px 7px 7px;
  background: linear-gradient(to bottom, transparent, rgba(4, 12, 10, .86));
}

body.health-page .health-image-picker-preview-grid .report-image-card b {
  display: block;
  overflow: hidden;
  color: #fff;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.health-page .health-image-picker-preview-grid .report-image-card small {
  display: none;
}

body.health-page .health-image-picker-preview-grid .report-image-card em {
  margin-top: 3px;
  padding: 2px 4px;
  background: rgba(4, 12, 10, .64);
  color: #fff;
  font-size: 7px;
}

body.health-page .health-image-picker-preview-grid .report-image-card button {
  z-index: 2;
  width: 25px;
  height: 25px;
  border: 1px solid rgba(255, 255, 255, .55);
  background: rgba(4, 12, 10, .88);
  font-size: 16px;
  line-height: 1;
}

body.health-page .health-image-picker-preview-grid .report-image-card button:hover,
body.health-page .health-image-picker-preview-grid .report-image-card button:focus-visible {
  border-color: var(--site-accent);
  background: var(--site-accent);
  outline: none;
}

@media (max-width: 720px) {
  body.health-page .health-image-paste-guide {
    width: 100%;
  }
}

body.health-page .report-image-card button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
  text-align: center;
  font-family: Arial, sans-serif;
  font-weight: 400;
}

/* Chat attachments can enter through the file picker, a drag operation, or
   the focused textarea's native paste action. Keep the drop state visible
   without changing the composer's height or moving the keyboard on phones. */
.app-shell .composer {
  position: relative;
  isolation: isolate;
}

.app-shell .composer.is-dragover {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent), var(--stitch-shadow, var(--shadow));
}

.composer-drop-overlay {
  position: absolute;
  inset: 5px;
  z-index: 5;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  column-gap: 8px;
  row-gap: 1px;
  min-height: 0;
  padding: 0 10px;
  border: 1px dashed color-mix(in srgb, var(--accent) 72%, var(--line));
  border-radius: calc(var(--site-radius, 14px) - 4px);
  background: color-mix(in srgb, var(--card) 94%, var(--accent));
  color: var(--ink);
  text-align: left;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(.985);
  transition: opacity .15s ease, visibility .15s ease, transform .15s ease;
}

.composer.is-dragover .composer-drop-overlay {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}

.composer-drop-icon {
  grid-row: 1 / -1;
  align-self: center;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid color-mix(in srgb, var(--accent) 62%, var(--line));
  border-radius: 50%;
  color: var(--accent);
  font: 600 17px/1 var(--mono);
}

.composer-drop-overlay strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.25;
}

.composer-drop-overlay small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font: 9px/1.25 var(--mono);
}

.app-shell .attachment-tray {
  align-items: stretch;
  gap: 8px;
  padding-top: 8px;
}

.app-shell .attachment-card {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  min-width: 150px;
  max-width: min(240px, 100%);
  min-height: 54px;
  padding: 6px 31px 6px 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  color: var(--ink);
  box-shadow: 0 4px 12px rgba(35, 48, 41, .07);
}

.attachment-card-preview,
.attachment-card-icon {
  width: 42px;
  height: 42px;
  border-radius: 6px;
}

.attachment-card-preview {
  display: block;
  object-fit: cover;
  background: color-mix(in srgb, var(--line) 35%, var(--card));
}

.attachment-card-icon {
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--accent) 9%, var(--card));
  color: var(--accent);
  font-size: 19px;
}

.attachment-card-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.attachment-card-copy strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 600;
}

.attachment-card-copy small {
  color: var(--muted);
  font: 8px/1.2 var(--mono);
}

.app-shell .attachment-card > button {
  position: absolute;
  top: 5px;
  right: 5px;
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ink) 9%, transparent);
  color: var(--muted);
  font: 500 16px/1 Arial, sans-serif;
  cursor: pointer;
}

.app-shell .attachment-card > button:hover,
.app-shell .attachment-card > button:focus-visible {
  background: color-mix(in srgb, var(--accent) 15%, transparent);
  color: var(--accent);
  outline: none;
}

@media (max-width: 700px) {
  .app-shell .attachment-card {
    min-width: 0;
    max-width: none;
    flex: 1 1 145px;
  }

  .composer-drop-overlay {
    inset: 4px;
    border-radius: 9px;
  }

  .composer-drop-overlay strong {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .composer-drop-overlay {
    transition: none;
  }
}

/* Raw source URLs stay on one readable line; the native title reveals the
   complete address when the pointer rests on the link. */
.markdown-body a.long-url-link {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
  overflow-wrap: normal;
  word-break: normal;
}

/* Stock research is a subscription feature. Keep the action reachable so a
   click can explain the requirement instead of making a silent disabled
   control that looks broken. */
body.finance-page .research-button.is-locked,
body.finance-page .ai-report .panel-heading button.is-locked {
  border-color: #69756f;
  background: #69756f;
  color: #edf1ee;
  opacity: .72;
  cursor: pointer;
  transform: none;
  box-shadow: none;
}

body.finance-page .research-button.is-locked:hover,
body.finance-page .ai-report .panel-heading button.is-locked:hover {
  border-color: #7d8c85;
  background: #7d8c85;
  transform: none;
}

body.finance-page .research-button.is-locked:focus-visible,
body.finance-page .ai-report .panel-heading button.is-locked:focus-visible,
body.finance-page .finance-subscription-notice button:focus-visible {
  outline: 2px solid #e5c77e;
  outline-offset: 2px;
}

body.finance-page .finance-subscription-notice {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid #52675f;
  border-radius: var(--site-radius-sm, 7px);
  background: rgba(255, 255, 255, .055);
  color: #e8eeeb;
}

body.finance-page .finance-subscription-notice[hidden] {
  display: none;
}

body.finance-page .finance-subscription-notice > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

body.finance-page .finance-subscription-notice strong {
  color: #e5c77e;
  font-size: 12px;
}

body.finance-page .finance-subscription-notice span {
  color: #b8c6c0;
  font-size: 11px;
  line-height: 1.55;
}

body.finance-page .finance-subscription-notice button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 52px;
  border: 1px solid #d65a3b;
  border-radius: var(--site-radius-sm, 7px);
  padding: 0 12px;
  background: #d65a3b;
  color: #fff;
  cursor: pointer;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
  white-space: pre-line;
  text-align: center;
}

body.finance-page .finance-subscription-notice button:hover {
  border-color: #e57454;
  background: #e57454;
}

body.finance-page .finance-subscription-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 8px;
  width: 100%;
}

body.finance-page .finance-subscription-actions .finance-query-pack-button {
  border-color: #71857d;
  background: transparent;
  color: #e8eeeb;
}

body.finance-page .finance-subscription-actions .finance-query-pack-button:hover {
  border-color: #a4b5ad;
  background: rgba(255, 255, 255, .09);
}

@media (max-width: 650px) {
  body.finance-page .finance-subscription-notice button {
    width: 100%;
  }

  body.finance-page .finance-subscription-actions {
    grid-template-columns: 1fr;
  }

  body.finance-page .finance-center-column .technical-chart {
    height: 390px;
  }

  body.finance-page .finance-center-column .technical-readout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Documents use the same paper card, dark workbench, and light control
   surfaces as research and finance. documents.css owns only page geometry. */
body.documents-page .document-project-bar {
  border-color: var(--site-line);
  background: var(--site-surface);
  color: var(--site-ink);
}

body.documents-page .document-project-picker span,
body.documents-page .document-project-stats {
  color: var(--site-muted);
}

body.documents-page .document-project-picker select {
  color: var(--site-ink);
  border-bottom-color: var(--site-gold);
}

body.documents-page .document-project-stats b {
  color: var(--site-gold);
}

body.documents-page .document-new-project,
body.documents-page .document-delete-project {
  border-color: var(--site-line);
  color: var(--site-ink);
}

body.documents-page .document-delete-project {
  color: var(--site-muted);
}

body.documents-page .document-new-project:hover,
body.documents-page .document-delete-project:hover {
  border-color: var(--site-accent);
  color: var(--site-accent);
}

body.documents-page .document-new-project.is-emphasis {
  border-color: var(--site-accent);
  background: var(--site-accent);
  color: #fff;
}

body.documents-page .document-new-project.is-emphasis:hover {
  border-color: var(--site-accent-strong);
  background: var(--site-accent-strong);
  color: #fff;
}

body.documents-page .document-delete-project:disabled,
body.documents-page .document-delete-project:disabled:hover {
  border-color: var(--site-line);
  color: var(--site-muted);
  opacity: .42;
  cursor: not-allowed;
}

body.documents-page .document-intake,
body.documents-page .document-workspace {
  border-color: var(--site-workbench-line);
  background: var(--site-workbench);
  color: var(--site-workbench-ink);
}

body.documents-page .document-file-pane,
body.documents-page .document-version-pane {
  border-color: var(--site-workbench-line);
  background: transparent;
  color: var(--site-workbench-ink);
}

body.documents-page .document-file-pane > header,
body.documents-page .document-version-heading,
body.documents-page .document-tree-card > header,
body.documents-page .document-preview-card > header {
  border-color: var(--site-workbench-line);
  background: var(--site-workbench-strong);
  color: var(--site-workbench-ink);
}

body.documents-page .document-intake-number,
body.documents-page .document-drop,
body.documents-page .document-file-pane,
body.documents-page .document-version-pane,
body.documents-page .document-tree-card,
body.documents-page .document-version-layout,
body.documents-page .document-version-actions button,
body.documents-page .document-version-actions a {
  border-color: var(--site-workbench-line);
}

body.documents-page .document-intake-number small,
body.documents-page .document-drop small,
body.documents-page .document-file-copy small,
body.documents-page .document-tree-card > header small,
body.documents-page .document-empty,
body.documents-page .document-tree-empty,
body.documents-page .document-preview-empty,
body.documents-page .document-version-kind,
body.documents-page .document-version-date,
body.documents-page .document-version-parent,
body.documents-page .document-preview-card header a,
body.documents-page .document-command-head small,
body.documents-page .document-command-actions > span {
  color: var(--site-workbench-muted);
}

body.documents-page .document-drop strong,
body.documents-page .document-empty p,
body.documents-page .document-version-note {
  color: var(--site-workbench-ink);
}

body.documents-page .document-drop:hover,
body.documents-page .document-drop.dragging,
body.documents-page .document-file-card:hover,
body.documents-page .document-file-card.active,
body.documents-page .document-version-card:hover,
body.documents-page .document-version-card.selected {
  background: color-mix(in srgb, var(--site-workbench) 72%, var(--site-accent));
}

body.documents-page .document-file-pane.is-drop-target {
  background: color-mix(in srgb, var(--site-accent) 16%, var(--site-workbench));
  box-shadow: inset 0 0 0 2px var(--site-accent);
}

body.documents-page .document-file-card,
body.documents-page .document-folder-card,
body.documents-page .document-version-card {
  border-color: var(--site-workbench-line);
  color: var(--site-workbench-ink);
}

body.documents-page .document-folder-card {
  background: color-mix(in srgb, var(--site-gold) 14%, var(--site-workbench));
  box-shadow: inset 3px 0 var(--site-gold);
}

body.documents-page .document-folder-card:hover {
  background: color-mix(in srgb, var(--site-gold) 22%, var(--site-workbench));
}

body.documents-page .document-file-copy strong,
body.documents-page .document-version-title h2,
body.documents-page .document-file-pane > header h2,
body.documents-page .document-command-head strong,
body.documents-page .document-tree-card > header strong,
body.documents-page .document-preview-card > header strong {
  color: var(--site-workbench-ink);
}

body.documents-page .document-version-title p,
body.documents-page .document-file-count {
  color: var(--site-workbench-muted);
}

body.documents-page .document-version-card::before {
  border-color: var(--site-workbench);
}

body.documents-page .document-version-actions .document-icon-action {
  background: color-mix(in srgb, var(--site-workbench-strong) 70%, transparent);
  color: var(--site-workbench-muted);
}

body.documents-page .document-file-card.active,
body.documents-page .document-version-card.selected {
  box-shadow: inset 3px 0 var(--site-accent);
}

body.documents-page .document-version-card {
  background: color-mix(in srgb, var(--site-workbench-strong) 82%, transparent);
}

body.documents-page .document-version-card.is-base {
  border-color: var(--site-gold);
  box-shadow: inset 3px 0 var(--site-gold);
}

body.documents-page .document-version-node::before,
body.documents-page .document-version-node::after {
  border-color: color-mix(in srgb, var(--site-workbench-muted) 42%, transparent);
}

body.documents-page .document-version-kind {
  border-color: color-mix(in srgb, var(--site-workbench-muted) 32%, transparent);
  background: color-mix(in srgb, var(--site-workbench) 72%, transparent);
}

body.documents-page .document-version-parent {
  background: color-mix(in srgb, var(--site-gold) 16%, var(--site-workbench));
}

body.documents-page .document-folder-breadcrumbs {
  border-color: var(--site-workbench-line);
  background: color-mix(in srgb, var(--site-gold) 7%, var(--site-workbench));
}

body.documents-page .document-folder-breadcrumb {
  color: var(--site-workbench-muted);
}

body.documents-page .document-folder-breadcrumb.is-current {
  color: var(--site-workbench-ink);
}

body.documents-page .document-file-chip {
  border-color: var(--site-workbench-line);
  background: var(--site-workbench-strong);
  color: var(--site-workbench-ink);
}

body.documents-page .document-file-chip button {
  color: var(--site-gold);
}

body.documents-page .document-file-pane > header .document-new-folder {
  border-color: color-mix(in srgb, var(--site-gold) 42%, var(--site-workbench-line));
  background: color-mix(in srgb, var(--site-gold) 9%, var(--site-workbench));
  color: var(--site-workbench-ink);
}

body.documents-page .document-file-pane > header .document-new-folder:hover {
  border-color: var(--site-gold);
  background: color-mix(in srgb, var(--site-gold) 16%, var(--site-workbench));
}

body.documents-page .document-file-pane > header .document-new-folder-mark {
  background: var(--site-gold);
  color: var(--site-workbench-strong) !important;
}

body.documents-page .document-file-pane > header .document-new-folder-label {
  color: var(--site-workbench-ink) !important;
}

body.documents-page .document-upload-button {
  border-color: var(--site-accent);
  background: var(--site-accent);
  color: #fff;
}

body.documents-page .document-upload-button:disabled {
  border-color: var(--site-workbench-line);
  background: var(--site-workbench-strong);
  color: var(--site-workbench-muted);
  opacity: 1;
}

body.documents-page .document-upload-button:disabled b {
  color: var(--site-workbench-muted);
}

body.documents-page .document-preview,
body.documents-page .document-preview-pdf {
  background: var(--site-control-surface);
  color: var(--site-ink);
}

body.documents-page .document-preview-status,
body.documents-page .document-preview-more-status {
  color: var(--site-workbench-muted);
  background: color-mix(in srgb, var(--site-workbench) 88%, transparent);
  border-color: var(--site-workbench-line);
}

body.documents-page .document-preview-card header a {
  border-color: var(--site-workbench-line);
}

body.documents-page .document-preview-card header a:hover {
  border-color: var(--site-gold);
  color: var(--site-gold);
}

body.documents-page .document-command {
  border-top: 1px solid var(--site-workbench-line);
  background: var(--site-workbench-strong);
  color: var(--site-workbench-ink);
}

/* Light workspace: only the pane title bars stay on the workbench.
   File list, version tree, preview, and AI edit sit on paper. */
html:not([data-theme="dark"]) body.documents-page .document-workspace {
  background: var(--site-surface);
  color: var(--site-ink);
  border-color: var(--site-line);
}

html:not([data-theme="dark"]) body.documents-page .document-file-pane,
html:not([data-theme="dark"]) body.documents-page .document-version-pane,
html:not([data-theme="dark"]) body.documents-page .document-tree-card,
html:not([data-theme="dark"]) body.documents-page .document-version-layout,
html:not([data-theme="dark"]) body.documents-page .document-preview-card {
  background: transparent;
  color: var(--site-ink);
  border-color: var(--site-line);
}

html:not([data-theme="dark"]) body.documents-page .document-file-pane > header,
html:not([data-theme="dark"]) body.documents-page .document-version-heading {
  min-height: 94px;
  background: var(--site-workbench-strong);
  color: var(--site-workbench-ink);
  border-color: var(--site-workbench-line);
}

html:not([data-theme="dark"]) body.documents-page .document-tree-card > header,
html:not([data-theme="dark"]) body.documents-page .document-preview-card > header {
  background: var(--site-surface);
  color: var(--site-ink);
  border-color: var(--site-line);
}

html:not([data-theme="dark"]) body.documents-page .document-file-pane > header h2,
html:not([data-theme="dark"]) body.documents-page .document-version-title h2 {
  color: var(--site-workbench-ink);
}

html:not([data-theme="dark"]) body.documents-page .document-version-title p {
  color: var(--site-workbench-muted);
}

html:not([data-theme="dark"]) body.documents-page .document-tree-card > header strong,
html:not([data-theme="dark"]) body.documents-page .document-preview-card > header strong,
html:not([data-theme="dark"]) body.documents-page .document-file-copy strong,
html:not([data-theme="dark"]) body.documents-page .document-empty p,
html:not([data-theme="dark"]) body.documents-page .document-version-note,
html:not([data-theme="dark"]) body.documents-page .document-command-head strong {
  color: var(--site-ink);
}

html:not([data-theme="dark"]) body.documents-page .document-file-copy small,
html:not([data-theme="dark"]) body.documents-page .document-file-count,
html:not([data-theme="dark"]) body.documents-page .document-empty,
html:not([data-theme="dark"]) body.documents-page .document-tree-empty,
html:not([data-theme="dark"]) body.documents-page .document-preview-empty,
html:not([data-theme="dark"]) body.documents-page .document-tree-card > header small,
html:not([data-theme="dark"]) body.documents-page .document-version-kind,
html:not([data-theme="dark"]) body.documents-page .document-version-date,
html:not([data-theme="dark"]) body.documents-page .document-version-parent,
html:not([data-theme="dark"]) body.documents-page .document-command-head small,
html:not([data-theme="dark"]) body.documents-page .document-command-actions > span {
  color: var(--site-muted);
}

html:not([data-theme="dark"]) body.documents-page .document-file-card,
html:not([data-theme="dark"]) body.documents-page .document-folder-card,
html:not([data-theme="dark"]) body.documents-page .document-version-card {
  border-color: var(--site-line);
  color: var(--site-ink);
}

html:not([data-theme="dark"]) body.documents-page .document-file-card:hover,
html:not([data-theme="dark"]) body.documents-page .document-file-card.active,
html:not([data-theme="dark"]) body.documents-page .document-version-card:hover,
html:not([data-theme="dark"]) body.documents-page .document-version-card.selected {
  background: color-mix(in srgb, var(--site-accent) 8%, var(--site-surface));
}

html:not([data-theme="dark"]) body.documents-page .document-file-pane.is-drop-target {
  background: color-mix(in srgb, var(--site-accent) 12%, var(--site-surface));
}

html:not([data-theme="dark"]) body.documents-page .document-folder-card {
  background: color-mix(in srgb, var(--site-gold) 12%, var(--site-surface));
}

html:not([data-theme="dark"]) body.documents-page .document-folder-card:hover {
  background: color-mix(in srgb, var(--site-gold) 20%, var(--site-surface));
}

html:not([data-theme="dark"]) body.documents-page .document-version-card {
  background: color-mix(in srgb, var(--site-surface) 82%, var(--site-surface-muted));
}

html:not([data-theme="dark"]) body.documents-page .document-version-card::before {
  border-color: var(--site-surface);
}

html:not([data-theme="dark"]) body.documents-page .document-version-heading .document-version-actions a {
  border-color: var(--site-workbench-line);
  color: var(--site-workbench-muted);
}

html:not([data-theme="dark"]) body.documents-page .document-version-card .document-version-actions button,
html:not([data-theme="dark"]) body.documents-page .document-version-card .document-version-actions a {
  border-color: var(--site-line);
}

html:not([data-theme="dark"]) body.documents-page .document-version-actions .document-icon-action {
  background: color-mix(in srgb, var(--site-surface-muted) 78%, transparent);
  color: var(--site-muted);
}

html:not([data-theme="dark"]) body.documents-page .document-version-node::before,
html:not([data-theme="dark"]) body.documents-page .document-version-node::after {
  border-color: color-mix(in srgb, var(--site-muted) 36%, transparent);
}

html:not([data-theme="dark"]) body.documents-page .document-version-kind {
  border-color: color-mix(in srgb, var(--site-muted) 28%, transparent);
  background: color-mix(in srgb, var(--site-bg) 72%, transparent);
}

html:not([data-theme="dark"]) body.documents-page .document-version-parent {
  background: color-mix(in srgb, var(--site-gold) 14%, var(--site-surface));
}

html:not([data-theme="dark"]) body.documents-page .document-folder-breadcrumbs {
  border-color: var(--site-line);
  background: color-mix(in srgb, var(--site-gold) 8%, var(--site-surface));
}

html:not([data-theme="dark"]) body.documents-page .document-folder-breadcrumb {
  color: var(--site-muted);
}

html:not([data-theme="dark"]) body.documents-page .document-folder-breadcrumb.is-current {
  color: var(--site-ink);
}

html:not([data-theme="dark"]) body.documents-page .document-preview,
html:not([data-theme="dark"]) body.documents-page .document-preview-pdf {
  background: var(--site-control-surface);
  color: var(--site-ink);
}

html:not([data-theme="dark"]) body.documents-page .document-preview-status,
html:not([data-theme="dark"]) body.documents-page .document-preview-more-status {
  color: var(--site-muted);
  background: color-mix(in srgb, var(--site-surface) 82%, var(--site-bg));
  border-color: var(--site-line);
}

html:not([data-theme="dark"]) body.documents-page .document-preview-card header a,
html:not([data-theme="dark"]) body.documents-page .document-preview-zoom-button,
html:not([data-theme="dark"]) body.documents-page .document-preview-zoom-reset {
  border-color: var(--site-line);
  color: var(--site-muted);
}

html:not([data-theme="dark"]) body.documents-page .document-preview-zoom-value,
html:not([data-theme="dark"]) body.documents-page .document-preview-expand {
  color: var(--site-muted);
}

html:not([data-theme="dark"]) body.documents-page .document-command {
  background: var(--site-surface);
  color: var(--site-ink);
  border-top-color: var(--site-line);
}

body.documents-page .document-command textarea {
  border-left: 3px solid var(--site-accent);
  background: var(--site-control-surface);
  color: var(--site-ink);
}

body.documents-page .document-command textarea::placeholder {
  color: var(--site-muted);
}

body.documents-page .document-command textarea:focus {
  border-color: var(--site-accent);
  border-left-color: var(--site-accent);
}

/* -------------------------------------------------------------------------
   Shared editorial polish

   One quieter surface language for chat, finance, research, health, and
   documents. Palette and layout stay the same; radius, type, overflow, and
   dark-mode leftovers are pulled onto the same tokens so English copy cannot
   stretch a page and light/dark stay siblings instead of separate themes.
   ------------------------------------------------------------------------- */
:root {
  --site-radius: 10px;
  --site-radius-sm: 6px;
  --site-radius-pill: 999px;
  --site-shadow: 0 14px 36px rgba(47, 46, 39, .07);
  --site-shadow-strong: 0 22px 54px rgba(47, 46, 39, .12);
  --site-focus: 0 0 0 3px color-mix(in srgb, var(--site-accent) 18%, transparent);
}

html[data-theme="dark"] {
  --site-shadow: 0 16px 40px rgba(0, 0, 0, .28);
  --site-shadow-strong: 0 24px 60px rgba(0, 0, 0, .38);
}

body.finance-page main,
body.research-page main,
body.health-page main,
body.documents-page main,
.app-shell {
  max-width: 100%;
}

body.documents-page {
  padding-top: 70px;
}

/* Shared type: keep serif headlines, but let Latin wrap instead of stretching. */
.research-hero h1,
.health-hero h1,
.documents-hero h1,
.app-shell .welcome h2 {
  text-wrap: balance;
  overflow-wrap: anywhere;
}

.hero-note,
.hero-folio,
.hero-brief,
.documents-hero-note {
  min-width: 0;
}

.hero-note p,
.hero-folio p,
.hero-brief p,
.documents-hero-note p {
  overflow-wrap: anywhere;
}

/* Navigation: five English labels must share one row with brand + account. */
.site-nav nav a,
.site-nav nav a [data-i18n] {
  min-width: 0;
}

@media (min-width: 901px) {
  html[lang="en"] .site-nav nav {
    gap: clamp(12px, 1.35vw, 22px);
  }

  html[lang="en"] .site-nav nav a {
    font-size: 11px;
    letter-spacing: .01em;
  }

  html[lang="en"] .site-brand {
    min-width: 0;
    gap: 10px;
  }

  html[lang="en"] .site-brand b {
    font-size: 15px;
    letter-spacing: .02em;
  }

  html[lang="en"] .site-brand small {
    letter-spacing: .1em;
  }
}

@media (min-width: 901px) and (max-width: 1320px) {
  html[lang="en"] .site-brand > span:last-child {
    display: none;
  }

  html[lang="en"] .nav-account-status > small {
    display: none;
  }
}

html[lang="en"] .research-hero h1,
html[lang="en"] .health-hero h1,
html[lang="en"] .documents-hero h1 {
  letter-spacing: -.045em;
  font-size: clamp(30px, 3.6vw, 54px);
  line-height: 1.12;
}

html[lang="en"] .app-shell .welcome h2 {
  letter-spacing: -1.4px;
}

/* Shared action buttons: long English stays inside the control. */
body.finance-page .research-button,
body.finance-page .ai-report .panel-heading button,
body.research-page .index-button,
body.research-page .research-command button,
body.documents-page .document-upload-button,
body.documents-page .document-edit-button,
body.health-page .assess-button,
body.health-page #sendHealthFollowUp {
  min-width: 0;
  gap: 10px;
}

body.finance-page .research-button span,
body.documents-page .document-upload-button span,
body.documents-page .document-edit-button span,
body.health-page .assess-button span {
  min-width: 0;
  overflow-wrap: anywhere;
}

html[lang="en"] body.finance-page .research-button,
html[lang="en"] body.finance-page .ai-report .panel-heading button,
html[lang="en"] body.research-page .index-button,
html[lang="en"] body.documents-page .document-upload-button,
html[lang="en"] body.documents-page .document-edit-button,
html[lang="en"] body.health-page .assess-button {
  height: auto;
  min-height: 48px;
  padding-block: 8px;
  line-height: 1.25;
  white-space: normal;
  text-wrap: balance;
}

html[lang="en"] body.finance-page .research-button span,
html[lang="en"] body.health-page .assess-button span,
html[lang="en"] body.finance-page .ai-report .panel-heading button {
  white-space: normal;
}

html[lang="en"] body.finance-page .period-row button,
html[lang="en"] body.finance-page .market-selector button,
html[lang="en"] body.research-page .mode-switch button,
html[lang="en"] body.health-page .quick-symptoms button,
html[lang="en"] body.health-page .follow-up-prompts button {
  white-space: nowrap;
}

html[lang="en"] .metric span,
html[lang="en"] .technical-readout div span,
html[lang="en"] .fundamental-grid div span,
html[lang="en"] .backtest-metrics span,
html[lang="en"] .panel-heading h3,
html[lang="en"] .document-file-copy small,
html[lang="en"] .document-version-note,
html[lang="en"] .document-project-picker span,
html[lang="en"] .method-chip,
html[lang="en"] .signal-badge {
  white-space: normal;
  overflow-wrap: anywhere;
}

html[lang="en"] body.documents-page .document-new-project,
html[lang="en"] body.documents-page .document-delete-project,
html[lang="en"] body.research-page .project-bar > button {
  white-space: normal;
  line-height: 1.2;
  text-wrap: balance;
}

/* Welcome / sidebar product cards: English subcopy may wrap two lines. */
.welcome-product small,
.app-shell .finance-entry small {
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.app-shell .finance-entry {
  min-width: 0;
}

.app-shell .finance-entry div,
.app-shell .finance-entry b {
  min-width: 0;
}

.app-shell .finance-entry b {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 4px;
  overflow-wrap: anywhere;
}

/* Shared cards: one radius and a quieter lift. */
.app-shell .composer,
.app-shell .welcome-product,
body.finance-page .query-deck,
body.finance-page .panel,
body.finance-page .metric-strip,
body.finance-page .ai-report,
body.finance-page .finance-followup,
body.research-page .project-bar,
body.research-page .intake-deck,
body.research-page .research-workspace,
body.documents-page .document-project-bar,
body.documents-page .document-intake,
body.documents-page .document-workspace,
body.health-page .triage-shell,
body.health-page .health-result,
body.health-page .health-follow-up {
  border-radius: var(--site-radius);
}

.app-shell .composer {
  border-color: var(--site-line);
  box-shadow: var(--site-shadow);
}

.app-shell .composer:focus-within {
  border-color: var(--site-ink);
  box-shadow: var(--site-focus), var(--site-shadow);
}

.app-shell .send-button {
  border-radius: var(--site-radius-pill);
}

/* Chat surfaces that were still hard-coded to the light paper. */
.app-shell .finance-entry:hover {
  background: color-mix(in srgb, var(--site-accent) 8%, transparent);
}

.app-shell .conversation-row:hover,
.app-shell .conversation-row.active,
.app-shell .conversation-item:hover,
.app-shell .conversation-item.active {
  background: color-mix(in srgb, var(--site-surface-muted) 88%, transparent);
  color: var(--site-ink);
}

.app-shell .message.user .message-content {
  background: color-mix(in srgb, var(--site-surface-muted) 82%, var(--site-bg));
  color: var(--site-ink);
}

.app-shell .suggestions button {
  color: var(--site-ink);
  background: color-mix(in srgb, var(--site-surface) 70%, transparent);
}

.app-shell .doc-pill {
  border-color: var(--site-line);
  background: var(--site-surface);
  color: var(--site-muted);
}

.app-shell .thinking {
  border-left-color: color-mix(in srgb, var(--site-sage) 55%, var(--site-line));
  color: var(--site-muted);
}

html[data-theme="dark"] .app-shell .sidebar {
  background: color-mix(in srgb, var(--site-bg) 92%, var(--site-surface));
}

.app-shell .new-chat {
  border-radius: var(--site-radius-sm);
}

.app-shell .brand-mark {
  background: var(--site-accent);
}

/* Shared workbench chrome: keep the dark analysis decks, but round them
   the same way as paper cards. */
body.finance-page .query-deck,
body.research-page .intake-deck,
body.research-page .research-workspace,
body.health-page .triage-shell,
body.documents-page .document-intake,
body.documents-page .document-workspace {
  box-shadow: var(--site-shadow-strong);
}

body.finance-page .panel,
body.finance-page .metric-strip,
body.research-page .project-bar,
body.documents-page .document-project-bar,
body.health-page .health-result {
  box-shadow: var(--site-shadow);
}

/* Dark theme leftovers that still used light paper hexes. */
html[data-theme="dark"] .app-shell .welcome-orb {
  box-shadow: 6px 7px 0 color-mix(in srgb, var(--site-gold) 45%, transparent);
}

html[data-theme="dark"] body.finance-page .quality-note {
  background: var(--site-surface-muted);
  color: var(--site-ink-soft);
}

html[data-theme="dark"] body.finance-page .error-banner,
html[data-theme="dark"] body.health-page .health-error {
  background: color-mix(in srgb, var(--site-accent) 16%, var(--site-surface));
  color: #ffb6a6;
}

html[data-theme="dark"] body.health-page .consent-row {
  background: var(--site-workbench-strong);
}

html[data-theme="dark"] body.health-page .consent-row span {
  color: var(--site-workbench-muted) !important;
}

html[data-theme="dark"] body.research-page .report-content,
html[data-theme="dark"] body.health-page .health-report {
  color: var(--site-workbench-ink);
}

html[data-theme="dark"] .markdown-body th {
  background: var(--site-surface-muted);
}

html[data-theme="dark"] .markdown-body th,
html[data-theme="dark"] .markdown-body td {
  border-color: var(--site-line);
}

html[data-theme="dark"] body.research-page .markdown-body blockquote,
html[data-theme="dark"] body.health-page .markdown-body blockquote {
  background: color-mix(in srgb, var(--site-workbench) 72%, var(--site-accent));
}

/* Language pills and account chips already exist; keep them on one radius. */
.language-icon-toggle,
.nav-account-status,
.app-shell .thinking-toggle {
  border-radius: var(--site-radius-pill);
}

@media (max-width: 900px) {
  body.documents-page {
    padding-top: 64px;
  }

  html[lang="en"] .research-hero h1,
  html[lang="en"] .health-hero h1,
  html[lang="en"] .documents-hero h1 {
    font-size: clamp(28px, 8.2vw, 36px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-shell .composer,
  .app-shell .welcome-product,
  .app-shell .finance-entry,
  .app-shell .send-button {
    transition: none;
  }
}

/* Nested frames: the outer shell owns radius and border. Full-width children
   stay edge-to-edge bands so a rounded card never wraps another rounded card. */
body.health-page .health-result .urgency-banner,
body.health-page .health-result .report-reading,
body.health-page .health-result .visual-reading,
body.health-page .health-result .health-report-panel:not(.is-expanded),
body.health-page .triage-shell .report-upload,
body.health-page .health-start-panel .health-start-points article,
body.health-page .health-evidence-card .health-evidence-list article,
body.health-page .health-index-dashboard .health-index-map-card,
body.health-page .health-index-dashboard .health-index-records,
body.health-page .health-index-dashboard .health-index-sources,
body.finance-page .panel .quality-note,
body.research-page .research-workspace {
  margin: 0;
  border-radius: 0;
  box-shadow: none;
}

body.health-page .health-result .urgency-banner,
body.health-page .health-result .report-reading,
body.health-page .health-result .visual-reading {
  border: 0;
  border-bottom: 1px solid var(--site-line);
  border-radius: 0;
}

body.health-page .health-result .health-report-panel:not(.is-expanded) {
  border: 0;
  background: transparent;
}

body.health-page .health-result .health-report-panel.is-expanded {
  border: 1px solid var(--site-line);
  border-radius: var(--site-radius);
  background: var(--site-surface);
  box-shadow: var(--site-shadow-strong);
}

body.health-page .triage-shell .report-upload {
  border: 0;
  border-top: 1px solid var(--site-workbench-line);
  border-radius: 0;
}

body.health-page .health-start-panel .health-start-points article,
body.health-page .health-evidence-card .health-evidence-list article {
  border: 0;
  border-bottom: 1px solid var(--site-line);
  background: transparent;
}

body.health-page .health-index-dashboard .health-index-map-card,
body.health-page .health-index-dashboard .health-index-records,
body.health-page .health-index-dashboard .health-index-sources {
  border: 0;
  border-top: 1px solid var(--site-line);
  background: transparent;
  padding-inline: 0;
}

body.finance-page .panel .quality-note {
  border: 0;
  border-radius: 0;
}

body.research-page .research-workspace {
  border: 0;
  background: transparent;
  box-shadow: none;
  margin-top: var(--stitch-card-gap);
}

body.research-page .research-workspace > .source-ledger,
body.research-page .research-workspace > .analysis-desk {
  border-radius: var(--site-radius);
}

html body.documents-page .document-intake .document-upload-button {
  align-self: stretch;
  height: auto;
  min-height: 0;
  margin: 0;
  border: 0;
  border-left: 1px solid var(--site-workbench-line);
  border-radius: 0;
}

@media (max-width: 720px) {
  html body.documents-page .document-intake .document-upload-button {
    border-left: 0;
    border-top: 1px solid var(--site-workbench-line);
  }
}