*{box-sizing:border-box}[hidden]{display:none!important}body.ss{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}main{flex:1;width:100%;padding-bottom:48px}main>section{margin-top:36px}header.page{display:flex;align-items:center;gap:16px;padding-top:14px;width:100%}header.page .ss-home{white-space:nowrap}.ss header.page h1{margin:0;white-space:nowrap;font:600 19px/1 var(--ss-nav);letter-spacing:0;color:var(--ss-ink)}header.page h1:before{content:"";display:inline-block;width:1px;height:18px;margin-right:16px;vertical-align:-3px;background:var(--ss-line)}header.page .spacer{flex:1}header.page .ss-btn{min-height:40px}.intro h2{font:800 clamp(24px,4vw,32px)/1.1 var(--ss-head);letter-spacing:-.01em;color:var(--ss-ink);margin:0 0 12px}.intro .ss-lede{max-width:62ch}.ss main h3{font:600 19px/1.35 var(--ss-nav);letter-spacing:0;color:var(--ss-ink);margin:0 0 8px}main p{color:var(--ss-muted);line-height:1.5}main code{font:13px/1.4 var(--ss-mono);color:var(--ss-ink)}.bench{display:grid;grid-template-columns:minmax(0,480px) minmax(0,1fr);gap:24px;padding:20px;align-items:start}.bench-screen{position:relative;background:#070707;border-radius:var(--ss-radius);padding:12px}.bench-screen canvas{display:block;width:100%;aspect-ratio:160 / 128;image-rendering:pixelated;background:#000;border-radius:4px}.bench-screen canvas:focus-visible{outline:3px solid var(--ss-gold);outline-offset:3px}.bench-screen .empty{position:absolute;inset:0;display:grid;place-items:center;color:#8c9098;font:14px var(--ss-mono);pointer-events:none}.bench .bar{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.bench .ss-btn{min-height:44px}.bench .ss-btn:disabled{opacity:.45;cursor:default}.file{position:relative;overflow:hidden;cursor:pointer}.file input{position:absolute;inset:0;opacity:0;cursor:pointer}.readout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;margin:16px 0 0}.readout div{border-top:1px solid var(--ss-line);padding-top:6px;min-width:0}.readout dt{font-size:12px;color:var(--ss-muted)}.readout dd{margin:0;font:15px/1.4 var(--ss-mono);color:var(--ss-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.keys{font-size:13px;margin-top:12px}.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;align-items:start}.api{width:100%;border-collapse:collapse;margin-top:8px}.api th,.api td{text-align:left;vertical-align:top;padding:7px 0;border-top:1px solid var(--ss-line);font-size:14px;line-height:1.4}.api th{font:13px/1.5 var(--ss-mono);font-weight:500;color:var(--ss-green-dark);padding-right:14px;white-space:nowrap}.api td{color:var(--ss-muted)}.code{margin:8px 0 0;padding:14px 16px;background:#070707;color:#e9e9e9;border-radius:var(--ss-radius);overflow-x:auto}.code code{color:inherit;font:12.5px/1.55 var(--ss-mono)}.small{font-size:13px;margin-top:10px}.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.tile{display:flex;flex-direction:column;gap:6px;padding:18px 20px;text-decoration:none;color:inherit}.tile b{font:800 22px/1.1 var(--ss-head);letter-spacing:-.01em;color:var(--ss-ink)}.tile span{color:var(--ss-muted);font-size:14px;line-height:1.45}.tile i{font-style:normal;font-weight:600;color:var(--ss-green-dark);margin-top:4px}a.tile{transition:transform .2s var(--ss-ease)}a.tile:hover{transform:translateY(-2px)}.tile.next{background:transparent;box-shadow:none;border:1px dashed rgba(7,7,7,.25)}.links{list-style:none;margin:0;padding:0}.links li{display:flex;flex-wrap:wrap;gap:4px 16px;padding:9px 0;border-top:1px solid var(--ss-line)}.links a{font-weight:600;color:var(--ss-green-dark);min-width:180px}.links span{color:var(--ss-muted);font-size:14px}@media(max-width:760px){.bench,.two,.tiles{grid-template-columns:minmax(0,1fr)}.bench{padding:14px}.api th{white-space:normal}}@media(prefers-reduced-motion:reduce){a.tile{transition:none}}
