@charset "UTF-8";
:root { --paper:#f7f6f1; --ink:#222820; --muted:#61685e; --line:#dcded4; --orange:#b94220; --accent:#e45b36; --white:#fffefa; --history:#57756c; --examination:#8c935b; --investigations:#5d799e; --diagnosis:#b47726; --treatment:#b95437; --catalog:#a2a69d; --finish:#303b2b}
* { box-sizing:border-box}
html { scroll-behavior:smooth; scroll-padding-top:24px}
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,"Segoe UI",Arial,sans-serif; -webkit-font-smoothing:antialiased; font-size:15px; line-height:1.5}
button,input { font:inherit}
a { color:inherit; text-decoration:none}
button,a,input { touch-action:manipulation}
button { cursor:pointer}
button:disabled { cursor:default; opacity:.4}
button:active:not(:disabled),.button:active { transform:scale(.96)}
:focus-visible { outline:3px solid var(--orange); outline-offset:4px}
h1,h2,h3,p { margin:0}
h1,h2,h3 { text-wrap:balance}
p { text-wrap:pretty}
.wrap { width:min(1180px,calc(100% - 80px)); margin-inline:auto}
.mono,.case-score,.evidence-grid strong,.row-score,.cohort-stats { font-variant-numeric:tabular-nums}
.mono { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px}
.eyebrow { text-transform:uppercase; font-size:10px; letter-spacing:.13em; font-weight:650; color:var(--muted)}
.skip { position:absolute; top:-80px; left:20px; z-index:5; padding:12px; background:var(--ink); color:white}
.skip:focus { top:8px}
.topbar { height:94px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); gap:24px}
.brand { font-weight:750; font-size:20px; letter-spacing:-.8px; display:inline-flex; align-items:center; gap:8px}
.brand span { font-weight:400; margin-left:-8px}
.brand img { margin-right:2px}
nav { display:flex; gap:28px; font-size:12px}
nav a { padding:12px 0; color:var(--muted)}
nav a:hover,footer a:hover { color:var(--orange)}
.contact-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:42px; padding:10px 16px; border:1px solid var(--line); border-radius:4px; font-size:11px; white-space:nowrap; transition:background-color .15s,transform .15s}
.contact-button:hover { background:#e9eadf}
.contact-button:active { transform:scale(.96)}
.contact-button[hidden] { display:none}
.live-dot::before { height:6px; width:6px; border-radius:50%; background:#7a8b64; display:inline-block; content:""}
.hero { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; padding-block:70px 62px}
.hero-copy h1 { font-size:clamp(52px,5.8vw,82px); letter-spacing:-4px; line-height:1.02; font-weight:550; margin-top:24px}
.hero-copy h1 em { font-family:Georgia,serif; color:var(--orange); font-weight:400; letter-spacing:-3px}
.intro { margin-top:25px; color:var(--muted); line-height:1.7; font-size:15px}
.button { display:inline-flex; gap:28px; align-items:center; min-height:46px; padding:12px 20px; font-size:12px; border-radius:4px; transition:background-color .15s,transform .15s}
.ink { background:var(--ink); color:var(--white); margin-top:28px}
.ink:hover { background:#3b4435}
.button span { font-size:20px; line-height:1}
.hero-foot { display:flex; gap:20px; margin-top:26px; font-size:10px; color:var(--muted)}
.hero-foot span::before { content:"/ "; color:var(--orange); font-weight:bold}
.system { padding:26px; background:var(--white); border-radius:8px; box-shadow:0 1px 2px #22282008,0 10px 40px #22282008; position:relative}
.system-top { display:flex; justify-content:space-between; gap:16px; margin-bottom:28px}
.live-dot { font-size:9px; color:var(--muted); display:flex; gap:6px; align-items:center}
.live-dot::before { background:var(--catalog)}
.loop-node { display:flex; align-items:center; gap:14px; padding:17px; background:var(--paper); border-radius:5px}
.loop-node small,.eval-node small { display:block; font-size:9px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); margin-bottom:3px}
.loop-node strong,.eval-node strong { font-size:15px; font-weight:550}
.node-icon { font-size:22px; display:grid; place-items:center; width:36px; height:36px; background:var(--white); border-radius:4px}
.node-tag { font-size:10px; margin-left:auto; border:1px solid var(--line); border-radius:3px; padding:4px 8px}
.flow-line { display:flex; align-items:center; justify-content:space-between; font-size:9px; color:var(--muted); padding:10px 17px}
.flow-line b { font-size:18px; font-weight:400}
.action-pills { display:flex; justify-content:center; gap:6px; flex-wrap:wrap}
.action-pills button { font-size:10px; padding:8px 10px; min-height:40px; border:1px solid #e8cfba; border-radius:3px; background:#fcf5ec; color:#855a38; transition:background-color .15s,color .15s,transform .15s}
.action-pills button:hover { background:#f6e8d6}
.action-pills button[aria-expanded=true] { background:var(--ink); border-color:var(--ink); color:var(--white)}
.action-hint { color:var(--muted); font-size:9px; text-align:center; margin-top:8px}
.action-example { margin-top:16px; padding:16px; background:var(--paper); border-radius:5px}
.action-example[hidden] { display:none}
.example-heading { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:5px 12px; margin-bottom:14px}
.example-heading h3 { font-size:12px; font-weight:600}
.example-heading span { font-size:8px; color:var(--muted)}
.exchange-step { background:var(--white); padding:12px; border-radius:3px}
.exchange-step small { font-size:8px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted)}
.exchange-step p { font-size:12px; margin-top:5px; line-height:1.6}
.exchange-step code { display:block; font-size:9px; color:var(--orange); margin-top:7px; overflow-wrap:anywhere}
.exchange-arrow { display:block; color:var(--muted); text-align:center; padding-block:4px}
.response-step { box-shadow:inset 2px 0 0 var(--history)}
.example-next { font-size:9px; color:var(--muted); margin-top:12px; line-height:1.6}
.return-label { margin-left:auto; font-size:9px; color:var(--muted)}
.record-line { display:flex; align-items:center; gap:12px; padding:20px 5px}
.record-line span { height:1px; background:var(--line); flex:1}
.record-line small { font-size:9px; color:var(--muted)}
.eval-node { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:0 16px}
.trace-mini { display:flex; align-items:center; gap:4px; height:26px}
.trace-mini i { height:16px; width:5px; background:var(--history); border-radius:1px}
.trace-mini i:nth-child(3n) { height:26px; background:var(--investigations)}
.trace-mini i:last-child { background:var(--accent)}
.system-note { margin-top:25px; font-size:9px; text-align:center; color:var(--muted)}
.evidence-strip { border-block:1px solid var(--line); background:#efefe7}
.evidence-grid { display:grid; grid-template-columns:repeat(4,1fr); padding-block:24px}
.evidence-grid>div { padding-left:30px; border-left:1px solid #d6d9cd}
.evidence-grid>div:first-child { padding-left:0; border:0}
.evidence-grid small { display:block; font-size:10px; color:var(--muted); margin-bottom:7px}
.evidence-grid strong { font-size:25px; font-weight:500; letter-spacing:-1px}
.evidence-grid>div:last-child strong { color:var(--orange)}
.encounter-section { padding-block:70px}
.section-head { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:28px}
.section-head h2 { font-size:31px; letter-spacing:-1.3px; font-weight:500; line-height:1.2; margin-top:10px}
.section-head>p { font-size:11px; color:var(--muted)}
.status { font-size:12px; color:var(--muted); padding:12px 0}
.status:empty { display:none}
.case-strip { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:20px}
.case-tab { border:1px solid var(--line); background:transparent; border-radius:4px; min-height:40px; min-width:57px; font-size:11px; display:flex; gap:6px; align-items:center; justify-content:center; transition:background-color .15s,color .15s}
.case-tab small { color:var(--muted); font-size:8px}
.case-tab[aria-pressed=true] { background:var(--ink); color:var(--white); border-color:var(--ink)}
.case-tab[aria-pressed=true] small { color:#d1d4c8}
.case-tab:hover:not([aria-pressed=true]) { background:#e9eadf}
.explorer { display:grid; grid-template-columns:minmax(0,1fr) 260px; background:var(--white); border-radius:7px; box-shadow:0 1px 2px #22282008,0 8px 25px #22282005}
.trace-area { padding:28px 30px}
.trace-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:26px; gap:16px}
.trace-title { font-size:12px; font-weight:600}
.trace-top .mono { color:var(--muted)}
.trace-track { display:grid; grid-template-columns:repeat(auto-fit,minmax(8px,1fr)); gap:3px; padding:4px 0; min-height:62px; align-items:center}
.trace-cell { height:32px; border:0; border-radius:2px; min-width:0; padding:0; background:var(--catalog); position:relative; transition:height .15s,opacity .15s}
.trace-cell::before { content:""; position:absolute; inset:-7px 0}
.trace-cell:hover { height:40px}
.trace-cell[aria-pressed=true] { height:48px; outline:2px solid var(--ink); outline-offset:2px}
.legend { display:flex; gap:14px; flex-wrap:wrap; margin-top:13px; font-size:9px; color:var(--muted)}
.legend span::before { content:""; display:inline-block; width:6px; height:6px; border-radius:1px; background:var(--phase); margin-right:5px}
[data-phase=History] { --phase:var(--history)}
[data-phase=Examination] { --phase:var(--examination)}
[data-phase=Investigations] { --phase:var(--investigations)}
[data-phase=Diagnosis] { --phase:var(--diagnosis)}
[data-phase=Treatment] { --phase:var(--treatment)}
[data-phase=Catalog] { --phase:var(--catalog)}
[data-phase=Finish] { --phase:var(--finish)}
[data-phase=Other] { --phase:var(--catalog)}
.trace-cell[data-phase] { background:var(--phase)}
.step-readout { display:flex; align-items:center; gap:18px; border-block:1px solid var(--line); padding:24px 0; margin-top:26px; min-height:113px}
.step-number { font-size:36px; color:#a3a89b; font-weight:400; letter-spacing:-2px; font-variant-numeric:tabular-nums}
.step-readout small { font-size:9px; text-transform:uppercase; color:var(--muted); letter-spacing:.12em}
.step-readout h3 { font-size:19px; font-weight:500; letter-spacing:-.5px; margin-top:3px}
.step-controls { margin-left:auto; display:flex; gap:5px}
.step-controls button { background:transparent; border:1px solid var(--line); height:40px; width:40px; border-radius:4px}
.step-controls button:hover:not(:disabled) { background:var(--paper)}
.scrubber-label { display:flex; justify-content:space-between; font-size:10px; color:var(--muted); margin-top:22px; gap:12px}
input[type=range] { width:100%; accent-color:var(--orange); height:40px; margin:0; cursor:pointer}
.trace-note { font-size:9px; color:var(--muted); margin-top:8px}
.case-detail { background:#eeeeE5; border-radius:0 7px 7px 0; padding:28px 26px}
.case-score { font-size:53px; letter-spacing:-3px; font-weight:450; line-height:1.3; margin-top:9px}
.case-score span { font-size:24px; letter-spacing:-1px}
.points-line { font-size:10px; color:var(--muted)}
.phase-counts { margin-top:26px; display:grid; gap:9px}
.phase-count { display:grid; grid-template-columns:83px 1fr 24px; gap:8px; align-items:center; font-size:9px; color:var(--muted)}
.phase-count b { font-size:10px; color:var(--ink); text-align:right; font-weight:500}
.phase-bar { height:4px; background:#dbded0; border-radius:1px}
.phase-bar i { display:block; background:var(--phase); height:100%; border-radius:1px}
.detail-note { margin-top:24px; font-size:9px; color:var(--muted); line-height:1.7}
.results-section { background:#e9ece3; padding-block:65px}
.cohort-toggle { display:flex; gap:3px; background:#dce1d3; border-radius:5px; padding:3px}
.cohort-toggle button { border:0; background:transparent; padding:11px 13px; min-height:40px; border-radius:3px; font-size:10px; color:#525b48}
.cohort-toggle button[aria-pressed=true] { background:var(--white); color:var(--ink); box-shadow:0 1px 4px #2228200d}
.results-layout { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:40px}
.board-head { display:flex; justify-content:space-between; font-size:9px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); padding-bottom:15px; border-bottom:1px solid #cdd3c4}
.leaderboard ol { margin:0; padding:0; list-style:none}
.board-row { display:grid; grid-template-columns:25px 160px minmax(30px,1fr) 64px; gap:12px; align-items:center; padding:13px 0; border-bottom:1px solid #d2d8c9}
.rank { font-family:ui-monospace,Consolas,monospace; font-size:10px; color:var(--muted)}
.model-name { font-size:12px; font-weight:550}
.model-name small { display:block; font-size:8px; color:var(--muted); font-weight:400; margin-top:2px}
.score-track { height:5px; background:#d2d8c9; position:relative; border-radius:1px}
.score-track i { display:block; height:100%; background:#a1ae91; border-radius:1px}
.board-row.featured .score-track i { background:var(--accent)}
.board-row.featured .model-name { color:var(--orange)}
.row-score { text-align:right; font-size:17px; letter-spacing:-.7px}
.row-score small { font-size:10px}
.results-context { padding:12px 0}
.stamp { display:inline-block; font-size:9px; text-transform:uppercase; letter-spacing:.1em; color:#586549; border:1px solid #b4bea5; padding:6px 9px; border-radius:2px}
.results-context h3 { font-size:28px; font-weight:450; letter-spacing:-1px; line-height:1.15; margin-top:25px}
.results-context>p { font-size:12px; color:var(--muted); margin-top:14px}
.cohort-stats { display:flex; gap:20px; margin-top:25px; font-size:9px; color:var(--muted)}
.cohort-stats b { font-size:15px; font-weight:500; color:var(--ink); display:block}
.results-context .micro { font-size:10px; line-height:1.7; padding-top:20px; border-top:1px solid #cdd3c4; margin-top:24px}
.method-details { margin-top:27px; font-size:11px; color:var(--muted); border-top:1px solid #cdd3c4}
.method-details summary { display:flex; justify-content:space-between; cursor:pointer; list-style:none; min-height:44px; align-items:center}
.method-details summary::-webkit-details-marker { display:none}
.method-details summary span { font-size:18px}
.method-details[open] summary span { transform:rotate(45deg)}
.method-details>div { padding:12px 0 0; max-width:850px; display:grid; gap:9px}
.method-details a { text-decoration:underline; text-underline-offset:3px; display:inline-flex; align-items:center; min-height:40px; width:fit-content}
.measurement { padding-block:65px 55px}
.measure-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:42px}
.measure-grid article { border-top:1px solid var(--line); padding-top:23px}
.measure-icon { display:inline-block; font-size:27px; color:var(--orange); height:38px}
.measure-grid h3 { font-size:21px; font-weight:500; letter-spacing:-.6px; margin-top:12px}
.measure-grid p { font-size:12px; color:var(--muted); margin-top:6px}
.measure-grid small { display:block; font-size:9px; margin-top:19px; color:var(--muted)}
.honesty-note { display:flex; gap:30px; margin-top:43px; padding:18px 0; border-top:1px solid var(--line); font-size:10px; color:var(--muted)}
.honesty-note>span { font-weight:650; white-space:nowrap; color:var(--ink)}
.honesty-note p { max-width:650px}
.contact-section { display:flex; justify-content:space-between; align-items:center; gap:32px; border-top:1px solid var(--line); padding-block:36px 44px}
.contact-section h2 { font-size:31px; font-weight:500; letter-spacing:-1.3px; margin-top:8px}
.contact-section p:not(.eyebrow) { color:var(--muted); font-size:12px; margin-top:8px}
.contact-action { display:flex; flex-direction:column; align-items:flex-end; gap:12px}
.contact-action .button { margin-top:0}
.contact-action .button[hidden] { display:none}
.contact-action small { color:var(--muted); font-size:10px}
footer { border-top:1px solid var(--line); padding-block:24px; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:10px; color:var(--muted)}
footer .brand { font-size:16px; color:var(--ink)}
footer>a:last-child { min-height:40px; display:flex; align-items:center}
@media(min-width:1400px) { .hero { padding-block:86px 76px}
.hero-copy h1 { font-size:86px}
}
@media(max-width:1000px) { .wrap { width:calc(100% - 48px)}
.hero { gap:32px; padding-block:48px}
.hero-copy h1 { font-size:64px}
.system { padding:20px}
.return-label { font-size:8px}
.explorer { grid-template-columns:minmax(0,1fr) 220px}
.trace-area { padding:24px}
.case-detail { padding:24px 20px}
.results-layout { grid-template-columns:minmax(0,1fr) 220px; gap:28px}
.board-row { grid-template-columns:20px 140px minmax(20px,1fr) 57px; gap:9px}
.section-head h2 { font-size:28px}
.contact-button { padding:10px 12px}
}
@media(max-width:720px) { .wrap { width:calc(100% - 36px)}
.topbar { height:76px; gap:12px}
.brand { font-size:18px}
nav { gap:14px; font-size:10px}
nav a:last-child { display:none}
.contact-button { padding:9px 11px; gap:8px; font-size:10px}
.topbar nav { margin-left:auto}
.topbar nav a { display:none}
.topbar nav a[href="#results"] { display:block}
.hero { grid-template-columns:1fr; gap:38px; padding-block:40px}
.hero-copy h1 { font-size:65px}
.intro { font-size:14px}
.system { padding:23px}
.evidence-grid { grid-template-columns:1fr 1fr; gap:20px; padding-block:23px}
.evidence-grid>div { padding-left:20px}
.evidence-grid>div:nth-child(3) { border:0; padding-left:0}
.evidence-grid strong { font-size:23px}
.evidence-grid small { font-size:9px}
.encounter-section { padding-block:42px}
.section-head { display:block; margin-bottom:24px}
.section-head>p { margin-top:12px}
.section-head h2 { font-size:28px}
.case-strip { gap:5px}
.case-tab { min-width:calc((100% - 20px)/5); padding:8px 5px; flex:1}
.explorer { grid-template-columns:1fr}
.trace-area { padding:22px 18px}
.trace-top { gap:10px}
.trace-top .mono { font-size:9px}
.trace-track { grid-template-columns:repeat(24,minmax(0,1fr)); gap:4px; min-height:100px; align-items:center}
.trace-cell { height:28px}
.trace-cell[aria-pressed=true] { height:34px}
.trace-cell:hover { height:30px}
.trace-cell::before { inset:-4px 0}
.legend { gap:10px; font-size:8px}
.step-readout { gap:12px; padding-block:19px; margin-top:22px}
.step-readout h3 { font-size:17px}
.step-number { font-size:30px}
.step-controls { gap:3px}
.step-controls button { width:40px}
.case-detail { border-radius:0 0 7px 7px; padding:22px; display:grid; grid-template-columns:1fr 1fr; column-gap:20px}
.case-detail>.eyebrow { grid-column:1}
.case-score { grid-column:1; font-size:43px}
.points-line { grid-column:1}
.phase-counts { grid-column:2; grid-row:1/5; margin-top:0; gap:8px}
.phase-count { grid-template-columns:73px 1fr 20px; gap:6px}
.detail-note { grid-column:1/-1; margin-top:18px}
.detail-note br { display:none}
.results-section { padding-block:42px}
.cohort-toggle { margin-top:20px; width:fit-content}
.results-layout { grid-template-columns:1fr; gap:20px}
.board-row { grid-template-columns:18px minmax(115px,1fr) minmax(25px,1fr) 57px; gap:8px}
.results-context { display:grid; grid-template-columns:1fr 1fr; column-gap:25px}
.results-context .stamp { grid-column:1; width:fit-content}
.results-context h3 { grid-column:1; font-size:23px; margin-top:14px}
.results-context>p { grid-column:1; font-size:11px}
.cohort-stats { grid-column:2; grid-row:1/3; align-self:center; margin:0}
.results-context .micro { grid-column:2; grid-row:3/5; margin-top:0; padding-top:10px; font-size:9px}
.measurement { padding-block:42px 25px}
.measure-grid { gap:16px}
.measure-grid h3 { font-size:18px}
.measure-grid p { font-size:11px}
.measure-grid small { font-size:8px}
.honesty-note { display:block; margin-top:30px}
.honesty-note p { margin-top:7px}
.contact-section { align-items:flex-start; flex-direction:column; gap:22px; padding-block:28px 34px}
.contact-section h2 { font-size:28px}
.contact-action { align-items:flex-start}
footer { flex-wrap:wrap; padding-block:20px; gap:8px}
footer>span { order:3; width:100%; font-size:9px}
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto}
*,*::before,*::after { transition:none!important}
}

.cookie-notice { position:fixed; bottom:20px; left:20px; z-index:10; display:flex; align-items:center; gap:24px; max-width:calc(100% - 40px); padding:12px 12px 12px 20px; background:var(--white); border-radius:6px; box-shadow:0 2px 8px #22282012,0 8px 30px #22282014; font-size:12px}
.cookie-notice[hidden] { display:none}
.cookie-notice button { min-height:40px; padding:8px 16px; border:0; border-radius:4px; background:var(--ink); color:var(--white); font-size:11px; transition:background-color .15s,transform .15s}
.cookie-notice button:hover { background:#3b4435}
@media(max-width:720px) { .cookie-notice { bottom:12px; left:12px; max-width:calc(100% - 24px); gap:20px; padding-left:16px} }

.lab-table { width:100%; border-collapse:collapse; table-layout:fixed; margin-top:12px; font-size:10px; font-variant-numeric:tabular-nums}
.lab-table caption { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap}
.lab-table th,.lab-table td { text-align:left; padding:8px 4px; border-bottom:1px solid var(--line); vertical-align:top; overflow-wrap:anywhere}
.lab-table th { font-weight:500}
.lab-table thead th { font-size:8px; color:var(--muted)}
.lab-table tbody th { width:36%}
.lab-table td small { display:block; font-size:8px; letter-spacing:0; text-transform:none; margin-top:2px}
.lab-table td:last-child { color:var(--muted)}
.example-results[hidden] { display:none}
