/* Rigscope — design tokens copied from Days Until: warm neutrals, Space Grotesk + Newsreader, 8px cards, pill controls, one vivid accent. */
@font-face{font-family:"Space Grotesk";src:url(fonts/space-grotesk.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Newsreader";src:url(fonts/newsreader.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url(fonts/newsreader-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}

:root{
  --bg:#f4f2ee;--surface:#fff;--surface-2:#ebe8e2;--line:#dedad3;--line-strong:#857d73;
  --ink:#1b1a19;--ink-2:#55504a;--ink-3:#6e675f;--on-ink:#fff;
  --ok:#13723a;--warn:#a15c07;--bad:#b42318;--cta:#c2410c;--on-cta:#fff;
  --font-ui:"Space Grotesk","Helvetica Neue",Arial,sans-serif;
  --font-serif:"Newsreader",Georgia,serif;--font-mono:ui-monospace,"Cascadia Mono","SF Mono",Menlo,Consolas,monospace;
  --t-display:4.5rem;--t-h1:3rem;--t-h2:2rem;--t-h3:1.375rem;--t-serif:1.75rem;--t-body-lg:1.125rem;--t-body:1rem;--t-small:.875rem;--t-cap:.75rem;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
  --gutter:48px;--section:96px;--container:1200px;--header-h:64px;
  --r-sm:6px;--r-card:8px;--r-lg:16px;--r-pill:999px;
  --e1:0 1px 2px rgb(27 26 25/.06),0 10px 28px rgb(27 26 25/.07);--e2:0 1px 2px rgb(27 26 25/.08),0 16px 36px rgb(27 26 25/.12);
  --ease:cubic-bezier(.23,1,.32,1);color-scheme:light;
}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#121110;--surface:#1c1b19;--surface-2:#282622;--line:#363330;--line-strong:#837b72;--ink:#f4f1ec;--ink-2:#bdb6ad;--ink-3:#9b948b;--on-ink:#121110;--ok:#5fd08a;--warn:#f0b35a;--bad:#ff8a7a;--e1:0 1px 2px rgb(0 0 0/.4),0 10px 28px rgb(0 0 0/.35);--e2:0 1px 2px rgb(0 0 0/.5),0 16px 36px rgb(0 0 0/.45);color-scheme:dark}}
:root[data-theme=dark]{--bg:#121110;--surface:#1c1b19;--surface-2:#282622;--line:#363330;--line-strong:#837b72;--ink:#f4f1ec;--ink-2:#bdb6ad;--ink-3:#9b948b;--on-ink:#121110;--ok:#5fd08a;--warn:#f0b35a;--bad:#ff8a7a;--e1:0 1px 2px rgb(0 0 0/.4),0 10px 28px rgb(0 0 0/.35);--e2:0 1px 2px rgb(0 0 0/.5),0 16px 36px rgb(0 0 0/.45);color-scheme:dark}
@media(max-width:639px){:root{--t-display:2.75rem;--t-h1:2.125rem;--t-h2:1.625rem;--t-h3:1.25rem;--t-serif:1.375rem;--t-body-lg:1.0625rem;--gutter:16px;--section:64px;--header-h:56px}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--t-body)/1.5 var(--font-ui);-webkit-font-smoothing:antialiased;min-height:100dvh;display:flex;flex-direction:column}
main{flex:1}
a{color:inherit}
img,video,canvas{max-width:100%;display:block}
h1,h2,h3,p{margin:0}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.wrap{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--s4);top:-60px;background:var(--ink);color:var(--on-ink);padding:var(--s3) var(--s4);border-radius:var(--r-pill);z-index:100}.skip:focus{top:var(--s3)}

/* type */
.display{font-family:var(--font-serif);font-weight:400;font-size:var(--t-display);line-height:1.04;letter-spacing:-.03em;text-wrap:balance}
.h1{font-family:var(--font-serif);font-weight:400;font-size:var(--t-h1);line-height:1.12;letter-spacing:-.03em;text-wrap:balance}
.h2{font-size:var(--t-h2);line-height:1.19;font-weight:500;letter-spacing:-.015em;text-wrap:balance}
.h3{font-size:var(--t-h3);line-height:1.27;font-weight:500}
.serif{font-family:var(--font-serif);font-weight:400}
.lede{font-size:var(--t-body-lg);line-height:1.56;color:var(--ink-2);max-width:56ch;text-wrap:pretty}
.caps{font-size:var(--t-small);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);font-weight:500}
.muted{color:var(--ink-2)}.small{font-size:var(--t-small)}
.num{font-variant-numeric:tabular-nums}

/* header */
.hdr{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.hdr-in{height:var(--header-h);display:flex;align-items:center;gap:var(--s5)}
.logo{display:inline-flex;align-items:center;gap:var(--s2);text-decoration:none;font-weight:700;font-size:1.25rem;letter-spacing:-.03em}
.logo svg{flex:none}
.tabs{display:flex;gap:var(--s1);margin-left:var(--s4)}
.tab{display:inline-flex;align-items:center;min-height:40px;padding:0 var(--s4);border-radius:var(--r-pill);text-decoration:none;font-size:var(--t-small);font-weight:500;color:var(--ink-2);transition:background .18s,color .18s}
.tab:hover{background:var(--surface-2);color:var(--ink)}
.tab[aria-current],.tab[aria-current]:hover{background:var(--ink);color:var(--on-ink)}
.hdr-tools{margin-left:auto;display:flex;align-items:center;gap:var(--s2)}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;border:0;background:none;color:var(--ink);border-radius:var(--r-pill);cursor:pointer}
.icon-btn:hover{background:var(--surface-2)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);border-radius:var(--r-pill);border:1px solid var(--cta);background:var(--cta);color:var(--on-cta);font:500 var(--t-body) var(--font-ui);text-decoration:none;cursor:pointer;transition:transform .12s,box-shadow .18s,background .18s}
.btn:hover{box-shadow:var(--e2)}.btn:active{transform:scale(.97)}
.btn--ghost{background:none;color:var(--ink);border-color:var(--line-strong)}
.btn--ghost:hover{background:var(--surface-2);box-shadow:none}
.btn--sm{min-height:40px;padding:0 var(--s4);font-size:var(--t-small)}
.btn[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}

/* sections */
.section{padding-block:var(--section) 0}
.sec-head{display:grid;gap:var(--s3);margin-bottom:var(--s6)}
.rule{border:0;border-top:1px solid var(--line);margin:0}

/* hero */
.hero{padding-top:var(--s8)}
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s7);align-items:end}
.hero-copy{display:grid;gap:var(--s5)}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--s3)}
.hero-stat{display:grid;gap:var(--s2);padding:var(--s5);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--e1)}
.hero-stat .big{font-family:var(--font-serif);font-size:clamp(4.5rem,9vw,7.5rem);line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.hero-stat .big small{font-family:var(--font-ui);font-size:var(--t-h3);letter-spacing:0;color:var(--ink-2);margin-left:var(--s2)}
.hero-media{position:relative;margin-top:var(--s7);border-radius:var(--r-lg);overflow:hidden;background:#000;aspect-ratio:21/9;box-shadow:var(--e2)}
.hero-media video{width:100%;height:100%;object-fit:cover}
.hero-media .tag{position:absolute;left:var(--s4);bottom:var(--s4);padding:var(--s1) var(--s3);border-radius:var(--r-pill);background:rgb(18 17 16/.6);backdrop-filter:blur(8px);color:#f4f1ec;font-size:var(--t-cap);letter-spacing:.06em;text-transform:uppercase}

/* quick compare */
.qc{display:grid;grid-template-columns:1fr 1fr auto;gap:var(--s4);align-items:end;padding:var(--s5);border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--e1)}
.field{display:grid;gap:var(--s2);min-width:0}
.field>label,.field>span.lab{font-size:var(--t-small);font-weight:500;color:var(--ink-2)}
.input,.select{width:100%;min-height:52px;padding:0 var(--s4);border:1px solid var(--line-strong);border-radius:var(--r-card);background:var(--surface);color:var(--ink);font:400 var(--t-body) var(--font-ui)}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23857d73' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.input:focus-visible,.select:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* combobox */
.combo{position:relative}
.combo-list{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);max-height:320px;overflow:auto;margin:0;padding:var(--s2);list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--e2)}
.combo-list[hidden]{display:none}
.combo-list li{display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s2) var(--s3);border-radius:var(--r-sm);cursor:pointer;font-size:var(--t-small)}
.combo-list li small{color:var(--ink-3);font-variant-numeric:tabular-nums}
.combo-list li[aria-selected=true],.combo-list li:hover{background:var(--surface-2)}
.combo-list li.grp{cursor:default;font-size:var(--t-cap);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);padding-top:var(--s3)}
.combo-list li.grp:hover{background:none}

/* cards */
.grid{display:grid;gap:var(--s5)}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{display:grid;gap:var(--s3);align-content:start;padding:var(--s5);border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);box-shadow:var(--e1);text-decoration:none;transition:transform .22s var(--ease),box-shadow .22s}
a.card:hover{transform:translateY(-3px);box-shadow:var(--e2)}
.vs{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--s3);align-items:center}
.vs .vs-x{font-size:var(--t-small);color:var(--ink-3)}
.vs-side{display:grid;gap:var(--s1)}
.vs-side b{font-weight:500}
.vs-fps{font-family:var(--font-serif);font-size:clamp(2.5rem,4.5vw,3.5rem);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.vs-fps small{font-family:var(--font-ui);font-size:var(--t-small);color:var(--ink-2);letter-spacing:0;margin-left:3px}
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6)}
.step{display:grid;gap:var(--s3);padding-top:var(--s4);border-top:3px solid var(--ink)}
.step:before{counter-increment:s;content:"0" counter(s);font-size:var(--t-small);font-weight:500;color:var(--ink-2)}

/* tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface)}
table{width:100%;border-collapse:collapse;font-size:var(--t-small)}
th,td{padding:var(--s3) var(--s4);text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-weight:500;color:var(--ink-2);background:var(--surface-2);position:sticky;top:0;cursor:pointer;user-select:none}
tr:last-child td{border-bottom:0}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.bar{display:block;height:8px;min-width:90px;border-radius:var(--r-pill);background:var(--surface-2);overflow:hidden}
.bar i{display:block;height:100%;background:var(--ink);border-radius:inherit}
.pill{display:inline-block;padding:2px 10px;border-radius:var(--r-pill);border:1px solid var(--line-strong);font-size:var(--t-cap);font-weight:500}
.pill.ok{color:var(--ok);border-color:var(--ok)}.pill.warn{color:var(--warn);border-color:var(--warn)}.pill.bad{color:var(--bad);border-color:var(--bad)}
.toolbar{display:flex;flex-wrap:wrap;gap:var(--s3);margin-bottom:var(--s4);align-items:end}
.toolbar .field{min-width:150px;flex:1 1 150px}.toolbar .grow{flex:2 1 220px}

/* prose */
.prose{display:grid;gap:var(--s4);max-width:68ch}
.prose h2{margin-top:var(--s5)}
.prose code,.formula{font-family:var(--font-mono);font-size:.9em;background:var(--surface-2);padding:2px 6px;border-radius:var(--r-sm)}
.formula{display:block;padding:var(--s4);overflow-x:auto;white-space:pre}

/* simulator */
.sim-top{padding-top:var(--s6);display:grid;gap:var(--s2);margin-bottom:var(--s5)}
.stage{position:relative;border-radius:var(--r-lg);overflow:hidden;background:#000;aspect-ratio:16/9;box-shadow:var(--e2);user-select:none;touch-action:pan-y}
.stage canvas{position:absolute;inset:0;width:100%;height:100%}
#cvB{clip-path:inset(0 0 0 50%)}
.slider{position:absolute;top:0;bottom:0;left:50%;width:44px;margin-left:-22px;cursor:ew-resize;display:none;touch-action:none;z-index:6}
.slider:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 12px rgb(0 0 0/.6)}
.slider i{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:#fff;box-shadow:0 2px 12px rgb(0 0 0/.5);display:grid;place-items:center;color:#111;font-style:normal;font-size:14px;font-weight:700}
.split .slider{display:block}
.tagAB{position:absolute;top:var(--s3);z-index:5;padding:2px 10px;border-radius:var(--r-pill);background:rgb(18 17 16/.65);backdrop-filter:blur(8px);color:#f4f1ec;font-size:var(--t-cap);font-weight:700;letter-spacing:.06em;display:none}
.split .tagAB{display:block}
.hud{position:absolute;top:var(--s3);z-index:4;width:236px;padding:10px 12px;border-radius:10px;background:rgb(10 11 14/.62);backdrop-filter:blur(8px);color:#e8fff6;font:600 12px/1.5 var(--font-mono);pointer-events:none;display:grid;gap:3px}
.hud.on-off{display:none}
#hudA{left:var(--s3);top:44px}#hudB{right:var(--s3);top:44px;display:none}
.split #hudB{display:grid}
.hud.hid{display:none!important}
.hud .fps{font-size:30px;line-height:1.05;color:#4dffb4;font-weight:700}
.hud .fps small{font-size:12px;color:#9be8d0}
.hud .row{display:flex;justify-content:space-between;color:#bfeee0}
.hud .row b{color:#fff;font-weight:600}
.hud canvas{position:static;width:100%;height:54px;background:rgb(0 0 0/.35);border-radius:4px}
.hud .gname{color:#7fe9ff;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stutter-flash{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 3px rgb(255 59 92/0);transition:box-shadow .15s;z-index:3}
.stutter-flash.on{box-shadow:inset 0 0 0 3px rgb(255 59 92/.8)}
.ctrls{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;margin-top:var(--s4)}
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-pill);padding:3px;background:var(--surface)}
.seg button{border:0;background:none;color:var(--ink);min-height:38px;padding:0 var(--s4);border-radius:var(--r-pill);font:500 var(--t-small) var(--font-ui);cursor:pointer}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--on-ink)}
.builds{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);margin-top:var(--s5)}
.build{display:grid;gap:var(--s4);padding:var(--s5);border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);box-shadow:var(--e1);align-content:start}
.build h3{display:flex;align-items:center;gap:var(--s2)}
.build h3 span{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--on-ink);font-size:var(--t-small)}
.build .two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.solo .build-b{display:none}.solo .builds{grid-template-columns:1fr}
.diag{display:grid;gap:var(--s3);margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line)}
.diag p{position:relative;padding-left:20px;font-size:var(--t-small);line-height:1.45}
.diag p:before{content:"";position:absolute;left:0;top:6px;width:8px;height:8px;border-radius:50%;background:var(--ok)}
.diag p.warn:before{background:var(--warn)}.diag p.bad:before{background:var(--bad)}
.diag b{font-weight:600}
.drop{border:1px dashed var(--line-strong);border-radius:var(--r-card);padding:var(--s3) var(--s4);font-size:var(--t-small);color:var(--ink-2)}

/* footer + bottom bar */
.ftr{margin-top:var(--section);border-top:1px solid var(--line);padding:28px 0;color:var(--ink-3);font-size:14px}
.ftr .wrap{display:grid;gap:var(--s4)}
.ftr .f-nav{display:flex;flex-wrap:wrap;gap:0 var(--s5)}
.ftr .f-nav a{text-decoration:none;padding-block:var(--s2);color:var(--ink-2)}.ftr .f-nav a:hover{text-decoration:underline;color:var(--ink)}
.ftr .f-row{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:baseline}
.ftr .f-meta{margin:0;font-size:13px;line-height:1.6}
.ftr .rtx{margin-left:auto;font:inherit;font-weight:600;color:var(--ink-2);letter-spacing:.03em;background:none;border:0;padding:4px 0;cursor:pointer;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:4px;transition:text-decoration-color .18s,color .18s}
.ftr .rtx:hover,.ftr .rtx:focus-visible{color:var(--ink);text-decoration-color:currentColor}
@media(max-width:639px){.ftr .f-row{flex-direction:column;gap:6px}.ftr .rtx{margin-left:0;justify-self:start;text-align:left}}
.bottom-bar{display:none}

@media(max-width:960px){
  .hero-grid,.qc,.g3,.steps,.builds{grid-template-columns:minmax(0,1fr)}
  .g2{grid-template-columns:minmax(0,1fr)}
  .hero-media{aspect-ratio:16/9}
}
@media(max-width:1060px){
  .tabs{display:none}
  .hdr-tools .btn:not(.kbd-btn){display:none}
  .bottom-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .bottom-bar a{flex:1;display:grid;justify-items:center;gap:2px;padding:8px 0;font-size:11px;font-weight:500;text-decoration:none;color:var(--ink-2)}
  .bottom-bar a[aria-current]{color:var(--ink)}
  body{padding-bottom:64px}
}
@media(max-width:639px){
  .hud{width:112px;padding:6px 8px;font-size:10px;top:34px!important}.hud .fps{font-size:22px}.hud canvas,.hud .gname,.hud .opt{display:none}
  .build .two{grid-template-columns:1fr}
  .vs{grid-template-columns:1fr}.vs .vs-x{display:none}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- catalog cards, popup, tray, palette ---- */
.hide-sm{display:inline}
.kbd-btn{gap:var(--s2)}kbd{font:500 11px var(--font-mono);padding:1px 6px;border:1px solid var(--line-strong);border-radius:5px;color:var(--ink-2)}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s4)}
.pcard{position:relative;display:grid;grid-template-rows:auto 1fr;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);box-shadow:var(--e1);overflow:hidden;transition:transform .22s var(--ease),box-shadow .22s}
.pcard:hover{transform:translateY(-3px);box-shadow:var(--e2)}
.pcard-hit{position:absolute;inset:0;width:100%;height:100%;border:0;background:none;cursor:pointer;z-index:1;border-radius:inherit}
.pcard-art{background:radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,var(--surface-2) 70%,var(--surface)),var(--surface-2));padding:var(--s3) var(--s3) var(--s2);color:var(--ink)}
.pcard-art svg{width:100%;height:auto;max-height:150px}
.pcard-body{display:grid;gap:var(--s1);padding:var(--s4);align-content:start}
.pcard-top{display:flex;justify-content:space-between;align-items:center}
.pcard-name{font-size:1.0625rem;font-weight:500;line-height:1.25;letter-spacing:-.01em}
.pcard-stat{font-family:var(--font-serif);font-size:1.75rem;line-height:1.1;letter-spacing:-.02em;margin-top:var(--s2)}
.pcard-stat small{font-family:var(--font-ui);font-size:var(--t-small);color:var(--ink-2);letter-spacing:0}
.tools{position:relative;z-index:2;display:flex;gap:4px}
.mini{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink-3);cursor:pointer;font-size:14px;line-height:1}
.mini:hover{border-color:var(--line-strong);color:var(--ink)}
.mini[aria-pressed=true]{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.mini[data-fav][aria-pressed=true]{background:var(--cta);border-color:var(--cta);color:#fff}
.pill.tier-S{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}.pill.tier-A{color:var(--ok);border-color:var(--ok)}.pill.tier-B{color:var(--ink)}.pill.tier-C,.pill.tier-D,.pill.tier-m{color:var(--ink-2)}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border:1px solid var(--line-strong);border-radius:var(--r-pill);font-size:var(--t-small);background:var(--surface)}
.chip button{border:0;background:none;color:var(--ink-2);cursor:pointer;font-size:16px;line-height:1;padding:0}
.chip-btn{cursor:pointer;color:var(--ink);font:inherit;font-size:var(--t-small)}.chip-btn:hover{background:var(--surface-2)}
.viewtog{margin-left:auto}
.more{display:flex;justify-content:center;margin-top:var(--s6)}
.empty{padding:var(--s7);text-align:center;color:var(--ink-2);border:1px dashed var(--line-strong);border-radius:var(--r-card)}
.facets{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s4)}
.facets .chip-btn[aria-pressed=true]{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.rec{margin-bottom:var(--s5)}.rec .sim-row{margin-top:var(--s2)}

.modal{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;padding:var(--s4)}
.modal.open{display:flex}
.modal-bg{position:absolute;inset:0;background:rgb(10 9 8/.62);backdrop-filter:blur(6px)}
.modal-card{position:relative;width:min(980px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:0 30px 90px rgb(0 0 0/.5);outline:none;animation:pop .28s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}}
.m-close{position:absolute;right:var(--s3);top:var(--s3);z-index:3;background:var(--surface);border:1px solid var(--line)}
.m-top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s6);padding:var(--s6);border-bottom:1px solid var(--line);align-items:center}
.m-art{display:grid;gap:var(--s2);justify-items:center;padding:var(--s4);border-radius:var(--r-card);background:radial-gradient(120% 90% at 50% 0%,var(--surface),var(--surface-2));color:var(--ink);border:1px solid var(--line)}
.m-art svg{width:100%;height:auto}
.m-id{display:grid;gap:var(--s3);align-content:center;min-width:0}
.m-id .h1{font-size:clamp(1.75rem,3.4vw,2.5rem)}
.m-tags,.m-actions,.m-nav,.sim-row{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
.m-body{display:grid;gap:var(--s4);padding:var(--s6)}
.m-body .h3{margin-top:var(--s3)}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3)}
.tile{display:grid;gap:2px;padding:var(--s4);border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface)}
.tile b{font-size:2rem;line-height:1.1;font-weight:400;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.cfgbar{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;font-size:var(--t-small);color:var(--ink-2)}
.select.sm{min-height:40px;width:auto;font-size:var(--t-small);padding-left:var(--s3)}
.cfgbar label{display:flex;gap:var(--s2);align-items:center}
.mbar{display:grid;grid-template-columns:150px minmax(60px,1fr) 150px auto;gap:var(--s3);align-items:center;font-size:var(--t-small)}
.mbar b{font-weight:500;text-align:right}
.specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s6);margin:0}
.specs div{display:flex;justify-content:space-between;gap:var(--s4);padding:var(--s2) 0;border-bottom:1px solid var(--line);font-size:var(--t-small)}
.specs dt{color:var(--ink-2)}.specs dd{margin:0;text-align:right;font-weight:500}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6)}
.tick,.warn-list{margin:var(--s2) 0 0;padding:0;list-style:none;display:grid;gap:var(--s2);font-size:var(--t-small)}
.tick li,.warn-list li{position:relative;padding-left:22px}
.tick li:before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700}
.warn-list li:before{content:"!";position:absolute;left:3px;color:var(--warn);font-weight:700}
html.lock{overflow:hidden}

.tray{position:fixed;left:50%;bottom:var(--s4);transform:translate(-50%,120%);z-index:60;display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;padding:var(--s3) var(--s4);border:1px solid var(--line-strong);border-radius:var(--r-pill);background:var(--surface);box-shadow:var(--e2);transition:transform .3s var(--ease);max-width:calc(100vw - 24px)}
.tray.on{transform:translate(-50%,0)}
#toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,20px);opacity:0;z-index:120;background:var(--ink);color:var(--on-ink);padding:var(--s3) var(--s5);border-radius:var(--r-pill);font-size:var(--t-small);transition:.25s;pointer-events:none}
#toast.on{opacity:1;transform:translate(-50%,0)}
.pal{align-items:flex-start;padding-top:12vh}
.pal-card{width:min(640px,100%);padding:var(--s4);display:grid;gap:var(--s3)}
#palList{list-style:none;margin:0;padding:0;max-height:52vh;overflow:auto;display:grid;gap:2px}
#palList li{display:flex;gap:var(--s3);align-items:center;padding:var(--s2) var(--s3);border-radius:var(--r-sm);cursor:pointer;font-size:var(--t-small)}
#palList li[aria-selected=true],#palList li:hover{background:var(--surface-2)}

.spin{animation:spinf 3s linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes spinf{to{transform:rotate(360deg)}}
.rgbbar{animation:hue 6s linear infinite}@keyframes hue{to{filter:hue-rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.spin,.rgbbar{animation:none}}

/* compare + planner */
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface)}
.cmp-wrap table{min-width:640px}.cmp-wrap th{position:static;cursor:default;vertical-align:bottom}.cmp-wrap td{white-space:normal}
.cmp-head{display:grid;gap:var(--s2);justify-items:center;text-align:center;min-width:170px}.cmp-head svg{width:170px;height:auto}
td.win{background:color-mix(in srgb,var(--ok) 14%,transparent);font-weight:500}
.plan{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s6);align-items:start}
.panel{display:grid;gap:var(--s4);padding:var(--s5);border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);box-shadow:var(--e1)}
.gauge{display:grid;justify-items:center;gap:var(--s2)}
.gauge svg{width:200px;height:auto}
.verdict{font-family:var(--font-serif);font-size:var(--t-serif);line-height:1.15;letter-spacing:-.02em}
.upg{display:grid;gap:var(--s2)}
.upg a{display:grid;grid-template-columns:1fr auto;gap:var(--s3);padding:var(--s3) var(--s4);border:1px solid var(--line);border-radius:var(--r-card);text-decoration:none;font-size:var(--t-small);background:var(--bg)}
.upg a:hover{background:var(--surface-2)}.upg b{color:var(--ok)}
.bench-card{max-width:760px}
.run-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
.run-grid canvas{width:100%;height:80px;background:#0a0b0e;border-radius:6px}
@media(max-width:820px){
  .m-top,.plan,.two-col,.specs,.run-grid{grid-template-columns:minmax(0,1fr)}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mbar{grid-template-columns:110px minmax(40px,1fr) auto}.mbar .pill{display:none}
  .hide-sm{display:none}.tray{bottom:72px}
  .modal{padding:0}.modal-card{max-height:100dvh;border-radius:0;height:100dvh}
  .m-top,.m-body{padding:var(--s4)}
}

.tab{white-space:nowrap}.toolbar .field:has(.facets){flex:1 1 100%}
@media(max-width:820px){.tray{left:8px;right:8px;max-width:none;transform:translateY(160%);border-radius:var(--r-card);flex-wrap:nowrap;overflow-x:auto;padding:var(--s2) var(--s3)}.tray.on{transform:translateY(0)}.tray>.small{display:none}.tray .chip,.tray .btn{flex:none}}

/* studio popup, shortcuts, fixes */
.pal{z-index:95}#studio{z-index:90}#help{z-index:92}
.tray:not(.on){visibility:hidden}
.studio-card{width:min(640px,100%)}
.studio-top{display:grid;grid-template-columns:auto 1fr;gap:var(--s5);align-items:center;padding:var(--s6) var(--s6) var(--s4)}
.avatar{width:112px;height:112px;border-radius:50%;object-fit:cover;border:1px solid var(--line-strong);background:var(--surface-2)}
.studio-body{display:grid;gap:var(--s4);padding:0 var(--s6) var(--s6)}
.site-link{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s4);align-items:center;padding:var(--s4);border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);text-decoration:none;transition:transform .2s var(--ease),box-shadow .2s}
.site-link:hover{transform:translateY(-2px);box-shadow:var(--e2)}
.site-ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:700;font-size:1.1rem;color:#fff}
.keys{display:grid;grid-template-columns:auto 1fr;gap:var(--s2) var(--s4);align-items:center;font-size:var(--t-small)}
.tier-row{display:grid;grid-template-columns:72px 1fr;gap:var(--s4);padding:var(--s4) 0;border-top:1px solid var(--line);align-items:start}
.tier-badge{font-family:var(--font-serif);font-size:3.5rem;line-height:1;letter-spacing:-.03em}
@media(max-width:639px){.studio-top{grid-template-columns:1fr;justify-items:start;padding:var(--s5) var(--s4) var(--s3)}.studio-body{padding:0 var(--s4) var(--s5)}.site-link{grid-template-columns:auto 1fr}.site-link .btn{grid-column:1/-1}.tier-row{grid-template-columns:48px 1fr}.tier-badge{font-size:2.5rem}}