:root{--bg:#f5f5f7;--surface:#fff;--surface-2:#f0f0f3;--text:#1d1d1f;--muted:#6e6e73;--line:#00000014;--accent:#0071e3;--accent-soft:#0071e31f;--shadow:0 1px 2px #0000000a, 0 8px 24px #0000000f;--shadow-lift:0 2px 4px #0000000d, 0 18px 40px #0000001f;--nav:#f5f5f7b8;--radius:22px;--mono:ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;--ok:#248a3d;--bad:#d70015;--warn:#b25000}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#000;--surface:#1c1c1e;--surface-2:#2c2c2e;--text:#f5f5f7;--muted:#98989d;--line:#ffffff1a;--accent:#2997ff;--accent-soft:#2997ff2e;--shadow:0 0 0 1px #ffffff0f;--shadow-lift:0 0 0 1px #ffffff24, 0 18px 40px #0009;--nav:#000000b3;--ok:#30d158;--bad:#ff453a;--warn:#ff9f0a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#000;--surface:#1c1c1e;--surface-2:#2c2c2e;--text:#f5f5f7;--muted:#98989d;--line:#ffffff1a;--accent:#2997ff;--accent-soft:#2997ff2e;--shadow:0 0 0 1px #ffffff0f;--shadow-lift:0 0 0 1px #ffffff24, 0 18px 40px #0009;--nav:#000000b3;--ok:#30d158;--bad:#ff453a;--warn:#ff9f0a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:72px}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;font:17px/1.5 -apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,Helvetica,Arial,sans-serif}h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}ul,ol{padding:0;list-style:none}h1,h2,h3{text-wrap:balance;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Helvetica Neue,Helvetica,Arial,sans-serif}a{color:inherit;text-decoration:none}code,pre{font-family:var(--mono)}button,input,select{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:8px}.muted{color:var(--muted)}.dot{color:var(--accent)}main,.nav-inner,.footer{width:min(1120px,100% - 44px);margin-inline:auto}.fatal{text-align:center;min-height:100vh;padding:20vh 0}.nav{z-index:20;background:var(--nav);-webkit-backdrop-filter:saturate(180%)blur(20px);border-bottom:1px solid #0000;transition:border-color .2s;position:sticky;top:0}.nav-scrolled{border-bottom-color:var(--line)}.nav-inner{align-items:center;gap:24px;height:52px;display:flex}.nav-brand{letter-spacing:-.01em;margin-right:auto;font-weight:600}.wave{transform-origin:70% 80%;animation:2.4s ease-in-out .9s 2 wave;display:inline-block}.nav-brand:hover .wave{animation:1.2s ease-in-out infinite wave}@keyframes wave{0%,60%,to{transform:none}10%,30%{transform:rotate(16deg)}20%,40%{transform:rotate(-10deg)}50%{transform:rotate(10deg)}}.nav-social{gap:8px;display:flex}.nav-social a{background:var(--text);width:30px;height:30px;color:var(--bg);border-radius:50%;place-items:center;transition:transform .2s cubic-bezier(.2,.9,.3,1.4),background .2s;display:grid}.nav-social a:hover{background:var(--accent);color:#fff;transform:scale(1.12)}.nav nav{color:var(--muted);gap:26px;font-size:14px;display:flex}.nav nav a:hover{color:var(--text)}.btn{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;white-space:nowrap;border:0;border-radius:999px;align-items:center;gap:8px;padding:10px 18px;font-size:15px;font-weight:500;transition:transform .15s,background .15s;display:inline-flex}.btn:hover{background:var(--surface-2)}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:var(--accent);color:#fff;box-shadow:none}.btn-primary:hover{background:var(--accent);filter:brightness(1.08)}.btn-small{padding:5px 14px;font-size:13px}.btn code{font-size:13px}.hero{text-align:center;padding:108px 0 84px}.avatar{object-fit:cover;width:132px;height:132px;box-shadow:0 0 0 4px var(--surface), var(--shadow-lift);border-radius:50%;margin:0 auto 26px;display:block}.eyebrow{color:var(--muted);align-items:center;gap:6px;margin-bottom:18px;font-size:14px;display:inline-flex}.hero h1{letter-spacing:-.035em;font-size:clamp(48px,9vw,96px);font-weight:700;line-height:1.02}.hero-headline{letter-spacing:-.015em;text-wrap:balance;max-width:21em;margin:22px auto 0;font-size:clamp(21px,2.6vw,28px);font-weight:600;line-height:1.25}.hero-summary{color:var(--muted);text-wrap:pretty;max-width:36em;margin:16px auto 0}.hero-actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:30px;display:flex}.section{padding:56px 0}.section h2,.footer h2{letter-spacing:-.025em;font-size:clamp(32px,4.5vw,48px);line-height:1.08}.section h2.sub{margin-top:48px;font-size:28px}.lead{color:var(--muted);text-wrap:pretty;max-width:34em;margin-top:12px;font-size:19px}.segmented button{cursor:pointer;white-space:nowrap;color:var(--muted);background:0 0;border:0;border-radius:9px;padding:6px 14px;font-size:14px;font-weight:500}.segmented button[aria-pressed=true]{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000024}.tags{flex-wrap:wrap;align-items:center;gap:8px;margin:28px 0 26px;display:flex}.tags-count{color:var(--muted);margin-left:6px;font-size:13px}.tag{cursor:pointer;background:var(--surface);color:var(--text);box-shadow:inset 0 0 0 1px var(--line);border:0;border-radius:999px;align-items:center;gap:6px;padding:5px 12px;font-size:13px;font-weight:500;transition:background .2s,color .2s,transform .15s;display:inline-flex}.tag small{color:var(--muted);font-variant-numeric:tabular-nums;font-size:11px}.tag:hover{background:var(--surface-2)}.tag:active{transform:scale(.95)}.tag[aria-pressed=true]{background:var(--accent);color:#fff;box-shadow:none}.tag[aria-pressed=true] small{color:#ffffffbf}.segmented{background:var(--surface-2);border-radius:12px;gap:2px;padding:3px;display:inline-flex}.cards{grid-template-columns:repeat(6,1fr);gap:20px;display:grid}.slot{grid-column:span 2;display:flex}.slot-featured{grid-column:span 3}.card{background:var(--surface);border-radius:var(--radius);min-width:0;box-shadow:var(--shadow);flex-direction:column;flex:1;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s;display:flex;overflow:hidden}.card.settled:hover{box-shadow:var(--shadow-lift);transform:translateY(-4px)}.card-art img,.card-art svg{transition:transform .6s cubic-bezier(.2,.8,.2,1)}.card:hover .card-art img{transform:scale(1.04)}.card:hover .card-art svg{transform:scale(1.12)rotate(-4deg)}.card-art{aspect-ratio:16/9;cursor:pointer;color:var(--tint);background:linear-gradient(145deg, color-mix(in srgb, var(--tint) 20%, var(--surface)), color-mix(in srgb, var(--tint) 6%, var(--surface)));border:0;place-items:center;padding:0;display:grid;position:relative;overflow:hidden}.card-art img{object-fit:cover;object-position:top;width:100%;height:100%}.card-art img.card-panel{object-fit:contain;background:#fff;border-radius:10px;width:auto;max-width:84%;height:auto;max-height:76%;box-shadow:0 0 0 1px #0000000f,0 14px 34px #0000002e}.card:hover .card-art img.card-panel{transform:scale(1.05)translateY(-2px)}.card-play{color:#fff;-webkit-backdrop-filter:blur(12px);background:#0000008c;border-radius:999px;align-items:center;gap:6px;padding:6px 13px;font-size:13px;font-weight:600;transition:background .2s;display:inline-flex;position:absolute;bottom:14px;right:14px}.card-art:hover .card-play{background:var(--accent)}.card-body{flex-direction:column;flex:1;gap:8px;padding:20px 22px 22px;display:flex}.card-context{color:var(--muted);font-size:13px;font-weight:500}.card h3{letter-spacing:-.015em;font-size:22px;line-height:1.2}.card-featured h3{font-size:26px}.card-tagline{color:var(--muted);text-wrap:pretty;font-size:15px;line-height:1.45}.pills{flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:10px;display:flex}.pill{background:var(--surface-2);color:var(--muted);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:500}.pill-on{background:var(--accent-soft);color:var(--accent)}.pill-skill{cursor:pointer;border:0}.pill-skill:hover{filter:brightness(.95)}.pill-picked{background:var(--accent);color:#fff}.pill-stack{box-shadow:inset 0 0 0 1px var(--line);background:0 0}.tint-blue{--tint:#0a84ff}.tint-orange{--tint:#ff9500}.tint-purple{--tint:#af52de}.tint-teal{--tint:#30b0c7}.tint-pink{--tint:#ff2d55}.tint-green{--tint:#34c759}.tint-indigo{--tint:#5856d6}.tint-red{--tint:#ff3b30}.tint-yellow{--tint:#d9a400}.tint-gray{--tint:#8e8e93}.timeline{gap:16px;margin-top:28px;display:grid}.panel{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px 26px}.panel header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;display:flex}.panel h3{letter-spacing:-.01em;font-size:19px}.panel ul{color:var(--muted);gap:6px;margin-top:12px;font-size:15px;display:grid}.panel li{padding-left:16px;position:relative}.panel li:before{content:"";background:var(--line);width:5px;height:5px;box-shadow:0 0 0 1px var(--muted) inset;border-radius:50%;position:absolute;top:.62em;left:0}.period{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:13px}.grid-3,.grid-4{gap:16px;margin-top:24px;display:grid}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-3 .panel h3{margin:6px 0 4px}.grid-3 .panel p,.award p{font-size:14px}.award .place{letter-spacing:-.03em;color:var(--accent);font-size:34px;font-weight:700;line-height:1}.award h3{margin:10px 0 4px}.footer{text-align:center;padding:72px 0 48px}.footer>p{color:var(--muted);margin-top:12px}.footer small{color:var(--muted);margin-top:56px;font-size:13px;display:block}.backdrop{z-index:50;-webkit-backdrop-filter:blur(14px);background:#0006;place-items:center;padding:20px;animation:.2s fade;display:grid;position:fixed;inset:0}.window{background:var(--surface);width:min(1140px,100%);max-height:min(780px,100%);box-shadow:0 0 0 1px var(--line), 0 30px 80px #00000073;border-radius:14px;outline:none;flex-direction:column;animation:.28s cubic-bezier(.2,.9,.3,1.1) pop;display:flex;overflow:hidden}.titlebar{background:var(--surface-2);border-bottom:1px solid var(--line);flex:none;align-items:center;height:40px;padding:0 14px;display:flex}.lights,.titlebar-spacer{gap:8px;width:60px;display:flex}.light{border:0;border-radius:50%;width:12px;height:12px;padding:0}.light-close{cursor:pointer;background:#ff5f57}.light-min{background:#febc2e}.light-max{background:#28c840}.titlebar-title{text-align:center;color:var(--muted);flex:1;font-size:13px;font-weight:600}.window-content{grid-template-columns:minmax(0,1fr) 320px;min-height:0;display:grid;overflow:auto}.window-demo{min-width:0;padding:22px}.window-info{border-left:1px solid var(--line);background:color-mix(in srgb, var(--surface-2) 45%, var(--surface));flex-direction:column;gap:12px;padding:24px;font-size:14.5px;line-height:1.5;display:flex}.window-info h3{letter-spacing:-.015em;font-size:22px}.window-info .btn{align-self:flex-start;margin-top:6px}.window-info .pills{margin-top:0;padding-top:0}.checks{color:var(--muted);gap:6px;display:grid}.checks li{padding-left:20px;position:relative}.checks li:before{content:"✓";color:var(--ok);font-weight:700;position:absolute;left:0}@keyframes fade{0%{opacity:0}}@keyframes pop{0%{opacity:0;transform:scale(.96)translateY(10px)}}.demo{flex-direction:column;gap:16px;font-size:14.5px;display:flex}.demo-loading{text-align:center;padding:40px}.demo-bar{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.demo-bar label{color:var(--muted);align-items:center;gap:8px;display:inline-flex}.demo input:not([type=range]),.demo select{border:1px solid var(--line);background:var(--surface-2);border-radius:9px;width:170px;padding:7px 11px}.demo select{width:auto}.demo input.narrow{width:76px}.demo input.narrow-text{width:120px}.demo input[type=range]{accent-color:var(--accent)}.request{font-size:13px}.legend{color:var(--muted);flex-wrap:wrap;gap:6px 18px;font-size:13px;display:flex}.swatch{border-radius:3px;width:10px;height:10px;margin-right:6px;display:inline-block}.bars{gap:9px;display:grid}.bars li{grid-template-columns:190px 1fr 62px;align-items:center;gap:12px;display:grid}.bars-tall li{grid-template-columns:210px 1fr 96px;padding:6px 0}.bar-label small,.bar-value small{color:var(--muted);font-size:12px;font-weight:400;line-height:1.35;display:block}.bar-track{background:var(--surface-2);border-radius:5px;height:10px;overflow:hidden}.bar-fill{background:var(--accent);border-radius:5px;height:100%;transition:width .45s cubic-bezier(.2,.8,.2,1);display:block}.bar-busy{opacity:.3;animation:.9s infinite alternate pulse}.bar-value{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}@keyframes pulse{to{opacity:.12}}.split{grid-template-columns:1fr 1fr;gap:14px;display:grid}.code{color:#e6e6eb;background:#1c1c1e;border-radius:12px;min-width:0;overflow:hidden}.code figcaption{color:#98989d;border-bottom:1px solid #ffffff14;padding:8px 14px;font-size:12px}.code pre{tab-size:4;max-height:380px;margin:0;padding:14px;font-size:12.5px;line-height:1.55;overflow:auto}.flow{flex-wrap:wrap;align-items:center;gap:8px 26px;display:flex}.flow li{background:var(--surface-2);color:var(--muted);white-space:nowrap;border-radius:999px;padding:6px 13px;font-size:13px;font-weight:500;transition:background .3s,color .3s;position:relative}.flow li:not(:last-child):after{content:"→";text-align:center;width:26px;color:var(--muted);font-weight:400;position:absolute;left:100%}.flow-on{background:var(--accent-soft)!important;color:var(--accent)!important}.flow-click li{padding:0}.flow-click button{cursor:pointer;background:0 0;border:0;padding:6px 13px;font-size:13px;font-weight:500}.flow-click button[aria-pressed=true]{font-weight:700}.tag-stage{background:var(--surface-2);border-radius:14px;place-items:center;padding:34px 16px;display:grid}.etag{color:#111;width:100%;max-width:400px;min-height:150px;font-family:var(--mono);background:#e9e7de;border:10px solid #fafafa;border-radius:6px;justify-content:space-between;align-items:center;gap:18px;padding:18px 20px;display:flex;box-shadow:0 0 0 1px #00000026,0 14px 30px #00000038}.etag>div{flex-direction:column;gap:4px;min-width:0;display:flex}.etag strong{overflow-wrap:anywhere;font-size:19px;line-height:1.15}.etag-brand{letter-spacing:.14em;text-transform:uppercase;font-size:10px}.etag-id{font-size:11px}.etag img{aspect-ratio:1;width:34%;max-width:116px;image-rendering:pixelated;flex:none}.etag-refresh{animation:.9s step-end eink}@keyframes eink{0%,40%{filter:invert()}20%,60%{filter:invert(0)contrast(.4)}80%{filter:invert()}}.shot img,.video{width:100%;box-shadow:0 0 0 1px var(--line);background:#000;border-radius:12px;display:block}.shot figcaption{color:var(--muted);margin-top:10px;font-size:13.5px}.thumbs{gap:8px;display:flex}.thumbs button{aspect-ratio:16/10;cursor:pointer;opacity:.55;background:0 0;border:0;border-radius:8px;width:88px;padding:0;overflow:hidden}.thumbs button[aria-pressed=true]{opacity:1;box-shadow:0 0 0 2px var(--accent)}.thumbs img{object-fit:cover;width:100%;height:100%;display:block}.devices{background:var(--surface-2);border-radius:14px;justify-content:center;align-items:flex-end;gap:18px;padding:22px;display:flex}.device-desktop{width:72%;box-shadow:0 0 0 1px var(--line), 0 12px 28px #0000002e;border-radius:8px}.device-phone{border-radius:14px;width:18%;box-shadow:0 0 0 4px #1c1c1e,0 12px 28px #00000040}.graph{background:var(--surface-2);border-radius:14px;width:100%}.edge{stroke:var(--line);stroke-width:3px;stroke-linecap:round;transition:stroke .2s}.edge-best{stroke:var(--accent);stroke-width:5px}.edge-alt{stroke:var(--warn);stroke-width:4px;stroke-dasharray:2 8}.edge-w{fill:var(--muted);text-anchor:middle;font-size:10px}.node{cursor:pointer}.node circle{fill:var(--surface);stroke:var(--muted);stroke-width:1.5px;transition:fill .2s}.node text{text-anchor:middle;fill:var(--text);pointer-events:none;font-size:12px;font-weight:600}.node-end circle{fill:var(--accent);stroke:var(--accent)}.node-end text{fill:#fff}.node-avoid circle{fill:var(--bad);stroke:var(--bad);opacity:.85}.node-avoid text{fill:#fff;text-decoration:line-through}.swatch-best{background:var(--accent)}.swatch-alt{background:var(--warn)}.frame{background:var(--surface-2);font-family:var(--mono);border-radius:12px;flex-wrap:wrap;gap:4px;padding:14px;font-size:13px;display:flex}.byte{color:#fff;border-radius:5px;padding:3px 6px}.byte-flag{background:#8e8e93}.byte-head{background:#5856d6}.byte-data{background:#0a84ff}.byte-esc{background:#ff9500}.byte-bcc{background:#34c759}.log{font-family:var(--mono);background:var(--surface-2);border-radius:12px;max-height:230px;padding:12px 14px;font-size:12.5px;line-height:1.7;overflow:auto}.log-ok{color:var(--ok)}.log-bad{color:var(--bad)}.log-info{color:var(--muted)}.canvases{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.canvases canvas{width:100%;height:auto;image-rendering:pixelated;box-shadow:0 0 0 1px var(--line);border-radius:10px;display:block}.canvases figcaption{color:var(--muted);margin-top:8px;font-size:13px}.stage{background:var(--surface-2);border-radius:14px;min-height:132px;padding:20px 22px}.stage strong{letter-spacing:-.02em;font-size:26px}.stage p{color:var(--muted);max-width:52em;margin-top:6px}.stats{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.stats div{box-shadow:inset 0 0 0 1px var(--line);border-radius:12px;padding:14px 16px}.stats dt{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:22px;font-weight:700}.stats dd{color:var(--muted);font-size:13px}.arena{color:#e5e5ea;background:#0b0b0f;border-radius:12px;justify-content:center;margin:0;padding:16px 8px;font-size:clamp(7px,1.25vw,13px);line-height:1.15;display:grid;overflow:hidden}.a-wall{color:#5e5ce6}.a-ball{color:#ffd60a}.a-player{color:#ff453a;font-weight:700}.a-power{color:#30d158}.term{color:#ccc;font-family:var(--mono);white-space:pre-wrap;background:#0b0600;border-radius:12px;height:340px;padding:16px 18px;font-size:13px;line-height:1.55;overflow:auto}.t-green{color:#0dbc79}.t-blue{color:#2a7bde}.t-magenta{color:#bc3fbc}.t-dim{color:#666}.t-bold{font-weight:700}.t-cursor{vertical-align:text-bottom;background:#fff;width:8px;height:15px;animation:1.1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.reveal{opacity:0;filter:blur(10px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1),filter .8s cubic-bezier(.2,.8,.2,1),box-shadow .25s;transition-delay:calc(var(--order,0) * 90ms);transform:translateY(26px)scale(.985)}.reveal.is-in{opacity:1;filter:none;transform:none}.reveal.settled{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}.enter{animation:.9s cubic-bezier(.2,.8,.2,1) both rise;animation-delay:calc(var(--order,0) * 80ms)}.enter-pop{animation:.9s cubic-bezier(.2,.9,.3,1.2) both pop-in}.word{white-space:pre;animation:.7s cubic-bezier(.2,.8,.2,1) both rise;animation-delay:calc(.32s + var(--order,0) * 55ms);display:inline-block}@keyframes rise{0%{opacity:0;filter:blur(10px);transform:translateY(18px)}}@keyframes pop-in{0%{opacity:0;filter:blur(8px);transform:scale(.7)}}.pill{transition:background .35s,color .35s}.theme-toggle{width:30px;height:30px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;transition:background .2s,color .2s;display:grid}.theme-toggle:hover{background:var(--surface-2);color:var(--text)}.theme-icon{animation:.45s cubic-bezier(.2,.9,.3,1.2) spin-in;display:grid}@keyframes spin-in{0%{opacity:0;transform:rotate(-90deg)scale(.5)}}::view-transition-old(root){animation-duration:.35s}::view-transition-new(root){animation-duration:.35s}@media (width<=900px){.cards{grid-template-columns:1fr 1fr}.slot,.slot-featured{grid-column:span 1}.grid-3,.grid-4{grid-template-columns:1fr 1fr}.window-content{grid-template-columns:1fr}.window-info{border-left:0;border-top:1px solid var(--line)}}@media (width<=620px){body{font-size:16px}.nav nav{display:none}.nav-inner{gap:10px}.hero{padding:64px 0 48px}.cards,.grid-3,.grid-4,.split,.canvases{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.bars li,.bars-tall li{grid-template-columns:1fr auto}.bars .bar-track{order:3;grid-column:1/-1}.backdrop{padding:0}.window{border-radius:0;height:100%;max-height:100%}.window-demo{padding:16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-delay:0s!important}.reveal{opacity:1;filter:none;transform:none}html{scroll-behavior:auto}}
