body { padding-bottom: 2rem; }
.page { max-width: 72rem; margin: auto; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding-bottom:1rem; border-bottom:1px solid var(--line); }
.topbar p { margin:0; color:var(--muted); }
.skip { position:absolute; top:-5rem; padding:.6rem; background:var(--bg); z-index:1; }
.skip:focus { top:.5rem; }
.head { display:grid; grid-template-columns: 1.1fr 1fr; gap:3rem; padding:clamp(3rem,8vw,6rem) 0 2.8rem; align-items:end; }
h1,h2,h3 { font-family:var(--head); font-weight:600; letter-spacing:-.025em; text-wrap:balance; }
h1 { font-size:clamp(2.9rem,6vw,5.3rem); line-height:1.08; margin:0; }
.head .kicker { margin-bottom:1.4rem; }
.head .intro { margin:0 0 .8rem; font-size:1.17rem; line-height:1.65; }
.head .meta { font: .76rem/1.8 var(--mono); color:var(--muted); margin:1.6rem 0 0; }
.jump { display:flex; flex-wrap:wrap; gap:.65rem 1.5rem; font:.8rem/1.6 var(--mono); padding:0 0 2rem; }
figure { margin:0; }
video { aspect-ratio: 7/4; object-fit:contain; background:#050505; }
figure video, figure img { border:0; }
.hero video { width:100%; }
.hero figcaption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem 2rem; padding:.85rem 0 1.2rem; margin:0; border-bottom:1px solid var(--line); }
.hero figcaption strong { color:var(--ink); font-weight:500; }
.verdict { display:grid; grid-template-columns:1fr 1.6fr; gap:3rem; padding:2rem 0 3rem; align-items:start; }
.verdict p { margin:0; max-width:60ch; }
.verdict .finding { font:500 1rem/1.6 var(--mono); }
.finding mark { color:#1f2937; background:var(--lime); padding:.1rem .25rem; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
section { scroll-margin-top:1.5rem; padding:3.2rem 0; border-top:1px solid var(--line); }
h2 { font-size:clamp(1.8rem,3vw,2.5rem); line-height:1.2; margin:0 0 1.3rem; }
h3 { font-size:1.25rem; line-height:1.3; margin:0 0 .75rem; }
p { max-width:68ch; }
.prose { max-width:46rem; }
.section-intro { max-width:46rem; margin:0 0 2rem; }
.process { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:2rem 0; }
.process img { aspect-ratio:16/9; object-fit:cover; }
.process figcaption { font-family:var(--sans); font-size:.85rem; }
.process figcaption b { display:block; color:var(--ink); margin-bottom:.15rem; font-weight:600; }
.process figcaption .mono { font: .7rem var(--mono); color:var(--blue); }
.pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; }
.pair img { aspect-ratio:16/9; object-fit:cover; }
.pair p { font-size:.93rem; }
.scroll { overflow-x:auto; margin:1.8rem 0 .8rem; }
table { min-width:560px; font-size:.9rem; }
th,td { text-align:left; vertical-align:top; padding:.8rem .7rem; }
td:last-child { font-family:var(--sans); }
th:first-child,td:first-child { padding-left:0; }
.caption { font:.75rem/1.65 var(--mono); color:var(--muted); }
.rounds { margin:2.5rem 0 0; }
.round { display:grid; grid-template-columns:12rem 1fr; gap:2rem; padding:2rem 0; border-top:1px solid var(--line); }
.round .stamp { color:var(--blue); font:.75rem/1.8 var(--mono); margin:0; }
.round p { margin:.6rem 0 0; }
.round button { margin:1rem 0 0; background:transparent; color:var(--blue); border:0; padding:0; text-align:left; text-decoration:underline; text-underline-offset:.2em; font:.83rem/1.5 var(--mono); cursor:pointer; }
button:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
.screening { border:1px solid var(--line); background:var(--panel); }
.controls { display:flex; flex-wrap:wrap; gap:1rem; padding:1.2rem; align-items:end; }
.field { display:flex; flex-direction:column; gap:.35rem; flex:1 1 15rem; min-width:0; }
.field:last-of-type { flex:0 1 10rem; }
label { font:.78rem/1.5 var(--mono); }
select { min-height:2.8rem; width:100%; padding:.65rem 2rem .65rem .65rem; font: .92rem var(--sans); color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:0; }
.compare-control { display:flex; gap:.6rem; align-items:center; padding:.35rem 0 .7rem; }
.compare-control input { width:1.1rem; height:1.1rem; accent-color:var(--blue); }
.screens { display:grid; grid-template-columns:minmax(0,1fr); gap:1px; }
.screens.comparing { grid-template-columns:repeat(2,minmax(0,1fr)); }
.screen-label { font:.72rem/1.7 var(--mono); padding:.6rem 1.2rem; background:var(--bg); border-top:1px solid var(--line); margin:0; }
.screens video { display:block; width:100%; }
.player-note { padding:1.2rem; border-top:1px solid var(--line); }
.player-note p { margin:0; font-size:.94rem; }
.player-note a { color:var(--ink); display:inline-block; margin-top:.7rem; font:.75rem var(--mono); }
.status { font: .75rem var(--mono); color:var(--muted); margin:1.2rem 0; }
.transport { display:flex; flex-wrap:wrap; gap:.8rem; padding:0 1.2rem 1.2rem; }
.transport button { border:1px solid var(--blue); background:var(--bg); color:var(--blue); padding:.55rem .8rem; font:.8rem var(--mono); cursor:pointer; }
[hidden] { display:none !important; }
.archive { margin:2rem 0 0; border-block:1px solid var(--line); }
summary { padding:1rem 0; font:.86rem/1.6 var(--mono); cursor:pointer; }
.archive-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; padding:1.5rem 0 2rem; }
.archive-groups h3 { font-size:1rem; }
.archive-groups ul { list-style:none; padding:0; margin:0; }
.archive-groups li { margin:0 0 1rem; font-size:.82rem; }
.archive-groups li span { display:block; color:var(--muted); margin-top:.2rem; }
.method { display:grid; grid-template-columns:1.2fr 1fr; gap:3rem; align-items:start; }
.method img { aspect-ratio:16/9; object-fit:cover; }
.method p { font-size:.96rem; margin-top:0; }
.prompt { margin-top:1.8rem; border-top:1px solid var(--line); }
pre { white-space:pre-wrap; overflow-wrap:anywhere; font:.8rem/1.7 var(--mono); max-height:28rem; overflow:auto; padding:1.2rem; background:var(--panel); margin:0 0 1rem; }
footer { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; border-top:1px solid var(--line); padding:1.5rem 0; font:.75rem/1.7 var(--mono); color:var(--muted); }
@media(max-width:760px) {
 .head { grid-template-columns:1fr; gap:1.8rem; }
 .head .intro { font-size:1.05rem; }
 .head .meta { margin-top:1rem; }
 .verdict { grid-template-columns:1fr; gap:1.2rem; }
 .round { grid-template-columns:1fr; gap:.8rem; }
 .method { grid-template-columns:1fr; gap:1.5rem; }
 .screens.comparing { grid-template-columns:1fr; }
 .pair { gap:1rem; }
}
@media(max-width:520px) {
 .topbar .label { font-size:.62rem; letter-spacing:.08em; }
 .process,.pair,.archive-groups { grid-template-columns:1fr; }
 .process { gap:1.5rem; }
 section { padding:2.5rem 0; }
 .hero figcaption { font-size:.68rem; }
 .controls { padding:1rem; }
 .field:last-of-type { flex:1 1 8rem; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; } }
