html.v2{scroll-padding-top:64px}
/* v2 layout: top nav, 3D hero, compact sections. Builds on app.css tokens/components. */
.v2 .shell{display:block}
.v2 main{padding:0 0 80px}
.v2 .wrap{max-width:1200px;margin:0 auto;padding-inline:20px}
.nav2{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:color-mix(in srgb,var(--ground) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.nav2 .in{max-width:1200px;margin:0 auto;padding:8px 20px;display:flex;align-items:center;gap:14px}
.nav2 .brand{display:flex;gap:9px;align-items:center;border:0;margin:0;padding:0;white-space:nowrap}
.nav2 .brand-mark{width:30px;height:30px;flex:0 0 30px;border-radius:7px;font-size:12px}
.nav2 .brand b{font-size:13.5px}
.nav2 .pills{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.nav2 .pills::-webkit-scrollbar{display:none}
.nav2 .pills a{font:600 12.5px var(--sans);color:var(--ink-2);text-decoration:none;padding:6px 10px;border-radius:999px;white-space:nowrap}
.nav2 .pills a:hover,.nav2 .pills a.active{background:var(--accent-soft);color:var(--ink)}
.nav2 .tools .btn{padding:6px 10px;font-size:12.5px}
.hero2{padding:22px 0 8px}
.hero2 .who{font:500 12.5px var(--mono);color:var(--ink-3);letter-spacing:.02em}
.hero2 h1{font-size:clamp(26px,3.4vw,40px);line-height:1.1;margin:6px 0 6px}
.hero2 .line{font-size:15.5px;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:6px 14px}
.hero2 .line span{display:inline-flex;align-items:center;gap:6px}
.hero2 .line span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
.hero2 .line span.hi::before{background:var(--susp)}
/* 3D hero */
.v3d2{margin-top:14px;border-radius:16px;overflow:hidden;border:1px solid #1f2a36;background:#0b1016;color:#dfe7ef;position:relative}
.v3d2 .v3d-stage{height:min(76vh,760px);min-height:440px;background:radial-gradient(ellipse at 55% 30%,#22303e 0%,#0b1016 72%)}
.v3d2 .bar{position:absolute;left:12px;right:12px;top:12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;z-index:3;pointer-events:none}
.v3d2 .bar>*{pointer-events:auto}
.seg{display:inline-flex;background:rgba(10,16,22,.78);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:3px;gap:2px;backdrop-filter:blur(6px)}
.seg button{font:600 13px var(--sans);color:#c9d4df;background:transparent;border:0;border-radius:7px;padding:7px 12px;cursor:pointer}
.seg button[aria-pressed="true"]{background:#e9eef3;color:#0b1016}
.seg button:focus-visible{outline:2px solid #7fd9ff;outline-offset:1px}
.seg.mode button[data-mode="before"][aria-pressed="true"]{background:#f2b8ad;color:#3d0b07}
.seg.mode button[data-mode="surgery"][aria-pressed="true"]{background:#9fe3cb;color:#073b2c}
.seg.mode button[data-mode="after"][aria-pressed="true"]{background:#c9bcff;color:#24135e}
.v3d2 .side{position:absolute;right:12px;top:64px;z-index:3;display:flex;flex-direction:column;gap:6px;background:rgba(10,16,22,.78);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 12px;font-size:12.5px;backdrop-filter:blur(6px);max-width:210px}
.v3d2 .side label{display:flex;align-items:center;gap:8px;cursor:pointer;white-space:nowrap}
.v3d2 .side input[type=checkbox]{accent-color:#7fd9ff}
.v3d2 .side .sw{width:12px;height:12px;border-radius:3px}
.v3d2 .side hr{border:0;border-top:1px solid rgba(255,255,255,.14);margin:4px 0}
.v3d2 .side input[type=range]{width:100%;accent-color:#7fd9ff}
.v3d2 .side .mini{font:11px var(--mono);color:#9fb0c0}
.v3d2 .side details summary{cursor:pointer;font-weight:600;list-style:none}
.v3d2 .foot{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;justify-content:space-between;padding:10px 14px;border-top:1px solid #1f2a36;font-size:13px;color:#b9c6d3}
.v3d2 .foot .cap{font-weight:600;color:#e6edf3}
.v3d2 .foot .src{font:11.5px var(--mono);color:#8fa1b3}
.v3d2 .v3d-badge{top:auto;bottom:14px;left:14px}
.v3d2 .v3d-label{font-size:11.5px}
.v3d-l-tumour{background:rgba(74,14,9,.9)!important;border-color:#c0574a!important}
.v3d-l-zone{background:rgba(9,70,52,.88)!important;border-color:#7fd6b8!important}
.v3d-l-graft{background:rgba(52,30,140,.9)!important;border-color:#a48bff!important}
.v3d-l-nerves{background:rgba(92,70,0,.9)!important;border-color:#f2c230!important}
.v3d-l-veins{background:rgba(20,45,110,.9)!important;border-color:#4f7fe0!important}
.v3d2 .v3d-print,.v3d2 .v3d-print-cap{display:none}
.v3d2 .v3d-print-cap{margin:0;padding:8px 14px 0;font:600 12.5px var(--sans);color:#c9bcff}
.v3d2.no-webgl .v3d-print-cap{display:block}
.v3d2.no-webgl .hint{display:none}
.ill[data-zoom]{cursor:zoom-in}
.v3d2.no-webgl .v3d-print{display:block}
@media (max-width:760px){.v3d2 .side{position:static;max-width:none;margin:8px;flex-direction:row;flex-wrap:wrap;gap:6px 14px}.v3d2 .v3d-stage{height:min(62vh,560px);min-height:340px}}
/* glance chips */
.glance{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:10px;margin-top:16px}
.glance .chip .v{font-size:15px}
/* sections */
.v2 section{padding-top:44px}
.v2 .sec-head{border-bottom:2px solid var(--ink)}
.v2 .lead{color:var(--ink-2);max-width:80ch;margin:-6px 0 14px;font-size:14.5px}
.ill{background:#EDF0F4;border:1.5px dashed var(--ai);border-radius:12px;padding:8px;overflow:hidden}
.ill img,.ill svg{display:block;width:100%;height:auto}
.factlist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.factlist li{display:grid;grid-template-columns:22px 1fr;gap:8px;font-size:14px;align-items:start}
.factlist li i{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font:700 11px var(--mono);font-style:normal;background:var(--accent-soft);color:var(--accent)}
.cmp2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px;margin-bottom:14px}
.cmp2 .card h4{font:700 14px var(--sans);margin:0 0 6px}
.cmp2 .big{font:600 22px var(--serif)}
.verdict{display:flex;gap:10px;align-items:flex-start;background:var(--ok-soft);border:1px solid color-mix(in srgb,var(--ok) 40%,transparent);border-radius:10px;padding:10px 14px;font-size:14px;margin-bottom:14px}
.verdict.warn{background:var(--disc-soft);border-color:color-mix(in srgb,var(--disc) 40%,transparent)}
.verdict b{white-space:nowrap}
@media (max-width:600px){.verdict{flex-direction:column;gap:4px}.verdict b{white-space:normal}}
/* tabs */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.tabs button{font:600 13px var(--sans);padding:7px 14px;border-radius:999px;border:1px solid var(--rule);background:var(--surface);color:var(--ink-2);cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--ink);color:var(--surface);border-color:var(--ink)}
/* stack viewer */
.stk{margin:0;background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px}
.stk-frame{position:relative;overflow:hidden;background:#000;border-radius:7px;width:100%;outline:none}
.stk-frame:focus-visible{box-shadow:0 0 0 3px var(--accent)}
.stk-sprite{position:absolute;left:0;top:0;width:100%;will-change:transform;user-select:none;-webkit-user-drag:none}
.stk-o{position:absolute;font:700 12px var(--sans);color:#ffd84d;text-shadow:0 0 3px #000}
.stk-o.l{left:6px;top:50%}.stk-o.r{right:6px;top:50%}.stk-o.t{top:6px;left:50%}.stk-o.b{bottom:32px;left:50%}
.stk-lab{position:absolute;left:8px;bottom:8px;font:600 12px var(--mono);color:#fff;background:rgba(0,0,0,.6);padding:3px 7px;border-radius:4px}
.stk-ctl{display:flex;align-items:center;gap:8px}
.stk-ctl input{flex:1;min-width:0;accent-color:var(--accent)}
.stk-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));align-items:start}
/* pair rows: illustration + MRI */
.pairs{display:grid;gap:16px}
.pair2{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));align-items:start}
/* questions */
.qs{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
/* details */
details.more{background:var(--surface);border:1px solid var(--rule);border-radius:12px;margin-top:12px}
details.more>summary{cursor:pointer;padding:13px 16px;font:600 15px var(--sans);list-style:none;display:flex;justify-content:space-between;align-items:center}
details.more>summary::after{content:"+";font:600 18px var(--mono);color:var(--ink-3)}
details.more[open]>summary::after{content:"−"}
details.more>.db{padding:0 16px 16px}
details.more .sec-head{display:none}
.notes{font-size:12.5px;color:var(--ink-3);margin-top:10px}
@media print{.nav2{display:none}.v3d2 .v3d-stage,.v3d2 .bar,.v3d2 .side{display:none!important}.v3d2 .v3d-print{display:block!important}.v3d2{border:0}
  details.more{break-inside:auto}details.more>.db{display:block}.tabs{display:none}.tabpanel[hidden]{display:block!important}
  .stk .stk-ctl{display:none}
  .ill{overflow:visible}.ill img{max-height:190mm;width:auto;max-width:100%;margin:0 auto}
  .v2 figure,.ill,.stk,.pair2>*{break-inside:avoid}
  .v2 .sec-head,.v2 .lead,.v2 .verdict,.v2 h3,.v2 h4,tr.grp{break-after:avoid}.v2 .lead{break-inside:avoid}
  .v3d2{border-radius:0;padding:4px 0}.v3d2 .v3d-print-cap{display:block!important}.v3d2 .hint{display:none}}
.v3d2.is-ready .v3d-msg{display:none}
.v3d2.no-webgl .v3d-stage,.v3d2.no-webgl .side{display:none}
