/* Aimosti redesign — the report (dashboard IA).
   SELF-CONTAINED: no external font/CDN (privacy). Uses the redesign tokens + a system
   font stack (tokens.css --font-sans/-mono fall back to system when Bunny isn't loaded).
   Loaded via head_extra on report.html, which opts out of external fonts + scripts. */

.rpt{max-width:1220px;margin-inline:auto;padding:clamp(1rem,3vw,1.8rem) clamp(1rem,3vw,2rem) var(--space);
  display:grid;grid-template-columns:236px 1fr;gap:clamp(1.4rem,3vw,2.6rem);align-items:start;
  /* Contain the inline glossary popovers (.ex-pop): they're position:absolute and stay in
     layout while visibility:hidden, so on a narrow viewport a term near the right edge pushed
     the document wider and the page scrolled sideways. overflow-x:clip stops that without
     creating a scroll container (sticky rail/section heads keep working) and without clipping
     the vertical axis (the popover still reveals upward). The mobile popover is also pinned to
     the viewport below so it never needs to overflow in the first place. */
  overflow-x:clip}
.rpt>*{min-width:0}
@media(max-width:900px){.rpt{grid-template-columns:1fr;gap:1rem}}

/* ── left rail (sticky section nav) ──────────────────── */
.rail{position:sticky;top:78px;align-self:start;max-height:calc(100vh - 96px);overflow:auto}
@media(max-width:900px){.rail{position:static;max-height:none;border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:.6rem .4rem}}
.rail__grp{margin-bottom:1rem}
.rail__lbl{font:600 .66rem var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);padding:0 .7rem;margin-bottom:.35rem}
.rail__lbl--frontier{color:var(--signal-ink)}
.rail a{display:flex;align-items:center;gap:.5rem;padding:.34rem .7rem;border-radius:6px;text-decoration:none;color:var(--ink-soft);font-size:.88rem;font-weight:500}
.rail a:hover{background:var(--tint);color:var(--ink)}
.rail a.is-active{background:var(--primary-wash);color:var(--primary);font-weight:600}
.rail a .ct{margin-left:auto;font:600 .72rem var(--font-mono);color:var(--ink-faint);background:var(--tint);border-radius:20px;padding:.05em .5em;min-width:1.7em;text-align:center}
.rail a.is-active .ct{background:#fff;color:var(--primary)}
.rail .dot{width:6px;height:6px;border-radius:50%;flex:none}
.dot-att{background:var(--attention)}.dot-watch{background:var(--watch)}.dot-info{background:var(--primary)}.dot-ok{background:var(--ok)}.dot-neutral{background:var(--ink-faint)}.dot-frontier{background:var(--signal)}

/* ── overview / header ───────────────────────────────── */
.rpt-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:.6rem 1rem}
.rpt-head h1{font-size:clamp(1.6rem,3vw,2.1rem);font-weight:700;letter-spacing:-.03em}
.rpt-head__act{display:flex;gap:.5rem}
.rpt-head .lede{width:100%;font:500 .82rem var(--font-mono);color:var(--ink-faint);margin-top:.2rem}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:1.3rem 0}
.stat{background:var(--panel);padding:.9rem 1rem}
.stat b{display:block;font:700 1.7rem var(--font-sans);letter-spacing:-.03em;line-height:1}
.stat span{font:500 .74rem var(--font-mono);color:var(--ink-faint);text-transform:uppercase;letter-spacing:.03em}
.stat--att b{color:var(--attention)}.stat--cov b{color:var(--ok)}

.triage{border:1.5px solid var(--attention);background:var(--attention-wash);border-radius:10px;padding:1.1rem 1.2rem;margin-bottom:1rem}
.triage h2{font-size:1.02rem;margin-bottom:.5rem;color:var(--attention)}
.triage ul{margin:0;padding:0;list-style:none;display:grid;gap:.35rem}
.triage li{display:flex;flex-wrap:wrap;gap:.6rem;align-items:baseline;font-size:.92rem}
.triage li a{font-weight:600;text-decoration:none}
.triage .mono{color:var(--ink-faint);font:500 .82rem var(--font-mono)}
.absence{font-size:.86rem;color:var(--ink-soft);background:var(--tint);border:1px solid var(--line);border-radius:8px;padding:.8rem 1rem;margin-bottom:.5rem}
.absence b{color:var(--ink)}
.coverage-banner{font-size:.88rem;color:var(--ink-soft);background:var(--primary-wash);border:1px solid var(--line);border-radius:8px;padding:.9rem 1.1rem;margin:1rem 0}
.coverage-banner strong{color:var(--ink)}
/* #21: the not-a-medical-device disclaimer, surfaced at the TOP of the report (before any
   clinical/PGx/APOE result) — set off as the framing for everything below it. */
.report-disclaimer-top{font-size:.9rem;line-height:1.55;color:var(--ink-soft);background:var(--primary-wash);border:1px solid var(--line);border-radius:8px;padding:.9rem 1.1rem;margin:.4rem 0 1.2rem}
.report-disclaimer-top strong{color:var(--ink)}
/* Attributed non-CPIC "near-miss" note inside a Deep Read card (F5/VKORC1/MTHFR). */
.dr-nearmiss{border:1px solid var(--line);border-radius:8px;padding:.8rem 1rem;margin:.7rem 0 .2rem}
.dr-nearmiss--watch{border-color:var(--signal);background:var(--signal-wash)}
.dr-nearmiss--info{background:var(--tint)}
.dr-nearmiss__head{margin:0 0 .35rem;font-size:.95rem}
.dr-nearmiss--watch .dr-nearmiss__head strong{color:var(--signal-ink)}
.dr-nearmiss__body{margin:0 0 .5rem;font-size:.9rem;line-height:1.55;color:var(--ink-soft)}
/* Deep Read provenance / research-use footer — subtle, set off from the cards above. */
.dr-provenance{font-size:.82rem;line-height:1.5;color:var(--ink-soft);border-top:1px solid var(--line);margin-top:1.3rem;padding-top:.9rem}
.dr-provenance strong{color:var(--ink)}
/* Global do-not-self-medicate banner over the PGx + Deep Read drug guidance (amber caution). */
.pgx-safety{font-size:.9rem;color:var(--signal-ink);background:var(--signal-wash);border:1.5px solid var(--signal);border-radius:8px;padding:.9rem 1.1rem;margin:.4rem 0 1.2rem}
.pgx-safety strong{color:var(--signal-ink)}
/* "Read this first" Deep Read triage: the actionable findings, surfaced above the cards. */
.dr-summary{background:var(--primary-wash);border:1px solid var(--line);border-radius:10px;padding:1.1rem 1.25rem;margin:1rem 0 1.4rem}
.dr-summary__title{font-size:1.02rem;margin:0 0 .25rem}
.dr-summary__list{list-style:none;margin:.7rem 0 0;padding:0;display:grid;gap:.5rem}
.dr-summary__list li{font-size:.92rem;line-height:1.45}
.dr-summary__list a{font-weight:600;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.dr-summary__list a:hover{border-bottom-color:var(--ink)}
/* #25: the chip report is a first-class citizen, not a degraded WGS. Same calm, neutral banner
   as the gVCF coverage note (no amber "caution" tone), with the honest caveat + upgrade path set
   off as quieter secondary lines beneath the confident lead. */
.chip-banner__caveat,.chip-banner__upgrade{display:block;margin-top:.6rem;font-size:.84rem;color:var(--ink-soft)}

/* ── tiers + sections ────────────────────────────────── */
.tier{margin-top:2rem}
.tier-head{margin-bottom:.4rem}
.tier-title{font-size:1.3rem;font-weight:700}
.tier-banner-copy{font-size:.86rem;color:var(--ink-soft);margin-top:.2rem;max-width:72ch}
.section-anchor{scroll-margin-top:84px}
.rsec{margin-top:1.6rem;scroll-margin-top:84px}
.rsec__head{position:sticky;top:64px;z-index:20;background:color-mix(in oklab,var(--bg) 92%,transparent);backdrop-filter:blur(6px);
  display:flex;align-items:center;gap:.7rem;padding:.5rem 0;border-bottom:1.5px solid var(--ink);margin-bottom:.4rem}
.rsec__head h2{font-size:1.12rem;font-weight:700}
.rsec__head .ct{font:600 .74rem var(--font-mono);color:var(--ink-faint)}
.section-note{font-size:.86rem;color:var(--ink-soft);margin:.5rem 0 .7rem;max-width:74ch}
.section-subtitle{font-size:1rem;margin:1.2rem 0 .4rem}

/* ── compact finding ROW (native <details>) ──────────── */
.frow{border:1px solid var(--line);border-radius:8px;background:var(--panel);margin-bottom:.5rem}
.frow[open]{box-shadow:0 12px 26px -22px oklch(0.46 0.13 252 / .5)}
.frow[data-sev=attention]{border-color:oklch(0.86 0.05 24)}
.frow[data-sev=attention][open]{border-color:var(--attention)}
.frow-frontier{background:var(--signal-wash);border-color:oklch(0.85 0.06 60)}
.frow__head{display:grid;grid-template-columns:auto auto 1fr auto auto;align-items:center;gap:.8rem;
  padding:.7rem .9rem;cursor:pointer;list-style:none}
.frow__head::-webkit-details-marker{display:none}
.frow__head:hover{background:var(--tint);border-radius:7px}
@media(max-width:560px){.frow__head{grid-template-columns:auto auto 1fr auto}.frow__axes{grid-column:2/-1}}
.sevdot{width:9px;height:9px;border-radius:50%}
.gene-chip{font:600 .8rem var(--font-mono);color:var(--ink);background:var(--tint);border:1px solid var(--line);border-radius:4px;padding:.1em .5em;white-space:nowrap}
.frow-frontier .gene-chip{border-color:var(--signal);color:var(--signal-ink)}
.frow__title{font-weight:600;font-size:.96rem;min-width:0;overflow-wrap:anywhere}
.frow__title .muted{font-weight:500}
.fdh-badge{display:inline-block;padding:.05rem .4rem;border-radius:999px;font-size:.72rem;font-weight:600;color:oklch(0.40 0.10 150);background:oklch(0.96 0.04 150);border:1px solid var(--ok)}
.frow__axes{display:flex;align-items:center;gap:.7rem;font:600 .78rem var(--font-mono);color:var(--ink-faint);white-space:nowrap}
.frow__axes .stars{color:var(--primary);letter-spacing:.06em}
.frow-frontier .frow__axes .stars{color:var(--signal)}
.frow__chev{width:15px;height:15px;color:var(--ink-faint);transition:transform .25s;flex:none}
.frow[open] .frow__chev{transform:rotate(90deg)}
.frow__body{padding:0 .9rem .9rem 2.4rem}
.band{font:600 .7rem var(--font-mono);text-transform:uppercase;letter-spacing:.03em;border-radius:100px;padding:.15em .6em;white-space:nowrap}
.band--attention{background:var(--attention-wash);color:var(--attention)}
.band--watch{background:var(--signal-wash);color:var(--signal-ink)}
.band--info{background:var(--primary-wash);color:var(--primary)}
.band--neutral{background:var(--tint);color:var(--ink-faint)}

/* "Next step" chip — the "so what do I DO?" answer, shown on the collapsed finding row. */
.next-step{font:600 .68rem var(--font-sans,inherit);border-radius:100px;padding:.14em .6em;white-space:nowrap;border:1px solid transparent}
.next-step__arrow{font-weight:700}
.next-step--personal_risk{background:var(--attention-wash);color:var(--attention)}
.next-step--risk_factor{background:var(--signal-wash);color:var(--signal-ink)}
.next-step--carrier{background:var(--primary-wash);color:var(--primary)}

.evidence,.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.5rem 1.4rem;margin:.4rem 0 .8rem;padding-top:.8rem;border-top:1px solid var(--line)}
.evidence>div{display:flex;flex-direction:column;gap:.1rem}
.evidence dt{font:600 .68rem var(--font-mono);text-transform:uppercase;letter-spacing:.03em;color:var(--ink-faint);margin:0}
.evidence dd{margin:0;font-size:.9rem}
.narrative{font-size:.92rem;color:var(--ink-soft);display:grid;gap:.5rem}
/* "In plain terms:" label on the Deep Read plain-language phenotype line. */
.in-plain{font-weight:600;color:var(--ink)}
.finding-summary{font-size:.95rem;color:var(--ink);margin-bottom:.4rem}
.evidence-axes{display:flex;flex-wrap:wrap;gap:1.4rem;margin:.2rem 0 .2rem}
.axis{font:600 .72rem var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ink);display:inline-flex;gap:.5ch;align-items:center}
.axis-label{color:var(--ink-faint)}
.axis-evidence .stars{color:var(--primary)}
.caveat,.fr-isnt{font-size:.84rem;color:var(--ink-soft);background:var(--tint);border-radius:6px;padding:.5rem .7rem;margin-top:.6rem}
.fr-isnt{background:var(--signal-wash);color:var(--signal-ink)}
.sources{font:500 .78rem var(--font-mono);color:var(--ink-faint);margin-top:.6rem}
.sources a{color:var(--ink-faint)}
.pgx-drug{margin-top:.7rem;padding-top:.6rem;border-top:1px solid var(--line)}
.pgx-drug h4{font-size:.95rem}
.pgx-implication{font-size:.9rem;color:var(--ink-soft)}
.pgx-rec{font-size:.9rem;color:var(--ink)}
.provenance{font:500 .78rem var(--font-mono);color:var(--ink-faint)}
.conf-chip{font:600 .68rem var(--font-mono);text-transform:uppercase;letter-spacing:.03em;border:1px solid var(--line);border-radius:100px;padding:.12em .55em;color:var(--ink-faint);white-space:nowrap}
.frontier-tag{font:600 .66rem var(--font-mono);text-transform:uppercase;letter-spacing:.04em;color:var(--signal-ink);background:var(--signal-wash);border:1px solid var(--signal);border-radius:100px;padding:.12em .55em;margin-left:.4rem;vertical-align:middle}
/* Frontier evidence-strength chip (replicated / mixed / contested …) — one neutral signal pill */
.fr-strength{font:600 .68rem var(--font-mono);letter-spacing:.03em;color:var(--signal-ink);background:var(--signal-wash);border:1px solid var(--signal);border-radius:100px;padding:.12em .6em;white-space:nowrap}

/* expander groups (lower-confidence / normal / uncalled / exclusions) */
.expander,.trait-evidence{margin:.5rem 0}
.expander>summary,.trait-evidence>summary{cursor:pointer;font:600 .82rem var(--font-mono);color:var(--ink-soft);padding:.5rem .2rem;list-style:none}
.expander>summary::-webkit-details-marker,.trait-evidence>summary::-webkit-details-marker{display:none}
.expander>summary::before,.trait-evidence>summary::before{content:"▸ ";color:var(--ink-faint)}
.expander[open]>summary::before,.trait-evidence[open]>summary::before{content:"▾ "}
.exclusion-list{list-style:none;margin:.5rem 0;padding:0;display:grid;gap:.5rem}
.exclusion-list li{font-size:.9rem}
.chip-sites{list-style:none;margin:.4rem 0;padding:0;font:500 .82rem var(--font-mono);display:grid;gap:.25rem;color:var(--ink-soft)}

/* reveal-gated (APOE / sensitive PRS) */
.apoe-reveal,.prs-reveal{border:1.5px dashed var(--signal);border-radius:8px;padding:.4rem .8rem;margin:.6rem 0}
.apoe-reveal>summary,.prs-reveal>summary{cursor:pointer;font-weight:600;color:var(--signal-ink);padding:.5rem 0;list-style:none}
.frontier-banner{font-size:.88rem;color:var(--signal-ink);background:var(--signal-wash);border:1px solid var(--signal);border-radius:8px;padding:.8rem 1rem;margin:.6rem 0}
.deep-read-locked{font-size:.9rem;background:var(--primary-wash);border:1px solid var(--line);border-radius:8px;padding:1rem 1.1rem}

/* credibility firewall divider */
.firewall{display:flex;align-items:center;gap:1rem;margin:2.4rem 0 .4rem;color:var(--signal-ink);font:600 .74rem var(--font-mono);letter-spacing:.06em;text-transform:uppercase}
.firewall::before,.firewall::after{content:"";flex:1;height:0;border-top:1.5px dashed var(--signal)}

/* coverage table */
.coverage-detail{margin:.6rem 0}
.coverage-detail>summary{cursor:pointer;font:600 .82rem var(--font-mono);color:var(--ink-soft);list-style:none;padding:.4rem 0}
.coverage-table{width:100%;border-collapse:collapse;font-size:.86rem;margin-top:.4rem}
.coverage-table th,.coverage-table td{text-align:left;padding:.4rem .6rem;border-bottom:1px solid var(--line)}
.coverage-table th{font:600 .7rem var(--font-mono);text-transform:uppercase;color:var(--ink-faint)}

/* summary "at a glance" cards (kept from context as overview tiles fallback) */
.report-summary{margin:1rem 0}
.summary-grid{list-style:none;margin:.4rem 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.5rem}
.summary-card a{display:flex;flex-direction:column;gap:.1rem;padding:.6rem .8rem;border:1px solid var(--line);border-radius:8px;text-decoration:none;background:var(--panel)}
.summary-card a:hover{border-color:var(--primary)}
.summary-label{font:500 .74rem var(--font-mono);color:var(--ink-faint);text-transform:uppercase}
.summary-value{font-weight:700;color:var(--ink)}

.pins{list-style:none;margin:.6rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.3rem .9rem}
.pins li{display:flex;justify-content:space-between;font:500 .82rem var(--font-mono);border-bottom:1px solid var(--line);padding:.3rem 0}
.card-chip-scope,.card-not-enabled,.card{border:1px solid var(--line);border-radius:8px;padding:1rem 1.1rem;margin:.6rem 0;background:var(--panel)}

/* ── print / PDF: linearize, expand everything, drop chrome ── */
@media print{
  .rpt{display:block;max-width:none;padding:0}
  .rail,.hd,.ft,.rpt-head__act,.frow__chev{display:none!important}
  .frow,.card{break-inside:avoid;box-shadow:none}
  .frow__body{display:block!important}
  .rsec__head{position:static;backdrop-filter:none}
  details>summary{list-style:none}
}