@font-face{font-family:Geist;src:url(../fonts/geist-sans.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}@font-face{font-family:Geist Mono;src:url(../fonts/geist-mono.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}:root{color-scheme:dark;--bg: #0b0b0c;--bg-2: #111113;--surface: #161618;--line: rgb(255 255 255 / .08);--line-strong: rgb(255 255 255 / .16);--text: #f4f2ec;--muted: #9c9890;--faint: #6e6b64;--accent: #d4c2a0;--accent-soft: rgb(212 194 160 / .14);--focus: #e8dcc8;--radius: 16px;--max: 1180px;--gutter: clamp(18px, 4vw, 40px);--sans: "Geist", ui-sans-serif, system-ui, sans-serif;--mono: "Geist Mono", ui-monospace, sfmono-regular, menlo, monospace;--display: clamp(2.15rem, 4.8vw, 3.7rem);--h2: clamp(1.15rem, 1.6vw, 1.35rem);--body: 1.02rem}*,*:before,*:after{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-height:100dvh;font-family:var(--sans);font-size:var(--body);line-height:1.5;color:var(--text);background:radial-gradient(920px 520px at 8% -8%,rgb(212 194 160 / .09),transparent 55%),radial-gradient(700px 400px at 100% 0%,rgb(90 110 140 / .07),transparent 50%),var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}img{max-width:100%;display:block}button,input{font:inherit;color:inherit}[hidden]{display:none!important}a{color:var(--accent);text-underline-offset:3px}a:hover{color:var(--focus)}:focus{outline:none}:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:absolute;left:var(--gutter);top:8px;z-index:30;padding:8px 12px;background:var(--surface);border:1px solid var(--line-strong);border-radius:999px;color:var(--text);text-decoration:none;transform:translateY(-120%)}.skip:focus-visible{transform:none}.hero,.filters,.demos,.backlog-wrap,.site-foot{width:min(var(--max),100%);margin-inline:auto;padding-inline:var(--gutter)}.hero{padding-top:clamp(32px,5.5vw,72px);padding-bottom:20px}.brand{margin:0 0 18px;font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}.hero h1{margin:0 0 16px;max-width:16ch;font-size:var(--display);font-weight:520;letter-spacing:-.048em;line-height:.96}.lede{margin:0;max-width:52ch;color:var(--muted);font-size:1.02rem;line-height:1.55}.credit-link{color:var(--text);text-decoration:none;border-bottom:1px solid var(--line-strong);white-space:nowrap}.credit-link:hover{border-color:var(--accent);color:var(--accent)}.stats{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:baseline;margin:22px 0 0;font-family:var(--mono);font-size:.78rem;letter-spacing:.02em;color:var(--muted)}.live-count b{color:var(--text);font-weight:560;font-variant-numeric:tabular-nums}.filters{position:sticky;top:0;z-index:8;display:flex;gap:8px;padding-block:12px 16px;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;border-bottom:1px solid transparent}.filters::-webkit-scrollbar{display:none}.filter{flex:0 0 auto;appearance:none;background:var(--bg-2);border:1px solid var(--line);border-radius:999px;padding:7px 12px;color:var(--muted);cursor:pointer;font-size:.82rem;letter-spacing:-.01em;white-space:nowrap}.filter .n{font-family:var(--mono);font-size:.72rem;font-variant-numeric:tabular-nums;color:var(--faint);margin-left:4px}.filter[aria-pressed=true]{background:var(--text);border-color:var(--text);color:#111}.filter[aria-pressed=true] .n{color:#4a4742}.filter:hover{border-color:var(--line-strong);color:var(--text)}.filter[aria-pressed=true]:hover{color:#111}.filter:focus-visible{outline-offset:2px}.filter-sm{padding:6px 10px;font-size:.78rem}.section-head{display:flex;flex-direction:column;gap:4px;align-items:flex-start;margin:8px 0 18px}.section-head h2{margin:0;font-size:var(--h2);font-weight:520;letter-spacing:-.03em}.section-note{margin:0;max-width:46ch;color:var(--faint);font-size:.82rem}.demo-grid{display:grid;grid-template-columns:1fr;gap:32px 20px}@media(min-width:768px){.demo-grid{grid-template-columns:1fr 1fr}}.demo{position:relative;--mx: 50%;--my: 30%;display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);isolation:isolate}.demo:after{content:"";pointer-events:none;position:absolute;inset:0;border-radius:inherit;opacity:0;background:radial-gradient(220px circle at var(--mx) var(--my),rgb(232 220 200 / .16),transparent 55%);z-index:2}.demo:hover,.demo:focus-within{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}.demo:hover:after,.demo:focus-within:after{opacity:1}.poster-link{color:inherit;text-decoration:none;display:block}.poster-link:focus-visible{outline:none}.demo:focus-within{outline:2px solid var(--focus);outline-offset:3px}.poster{position:relative;aspect-ratio:16 / 10;overflow:hidden;background:#1c1c20;border-radius:calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0 0}.poster img{width:100%;height:100%;object-fit:cover;transform-origin:center}.live-badge{position:absolute;top:12px;right:12px;z-index:1;font-family:var(--mono);font-size:.62rem;font-weight:560;letter-spacing:.14em;text-transform:uppercase;color:#141210;background:var(--accent);border-radius:999px;padding:4px 8px}.open-affordance{position:absolute;left:12px;bottom:12px;z-index:1;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:#0b0b0cc7;border:1px solid rgb(255 255 255 / .14);color:var(--text);font-size:.8rem;font-weight:520;letter-spacing:-.01em;opacity:.92;backdrop-filter:blur(8px)}.demo-body{padding:16px 16px 18px}.demo-kicker{display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;color:var(--faint);margin-bottom:8px}.slug{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.demo-title{margin:0 0 6px;font-size:1.12rem;font-weight:540;letter-spacing:-.03em;line-height:1.25}.teaches{margin:0 0 12px;color:var(--muted);font-size:.84rem;line-height:1.45}.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;padding:0;list-style:none}.chip{font-family:var(--mono);font-size:.64rem;letter-spacing:.04em;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:3px 8px}.credit{margin:0}.orig{color:var(--muted);font-size:.8rem;text-decoration:none;border-bottom:1px solid transparent}.orig:hover{color:var(--text);border-color:var(--line-strong)}.empty{margin:8px 0 24px;color:var(--muted);font-size:.92rem}.backlog-wrap{padding-top:48px;padding-bottom:24px}.backlog{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-2);padding:4px 0 0}.backlog summary{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px;cursor:pointer;list-style:none;padding:16px 18px}.backlog summary::-webkit-details-marker{display:none}.backlog summary:focus-visible{outline:2px solid var(--focus);outline-offset:-2px;border-radius:var(--radius)}.backlog summary h2{margin:0;font-size:var(--h2);font-weight:520;letter-spacing:-.03em}.backlog summary h2:before{content:"\25b8  ";font-family:var(--mono);color:var(--faint);font-size:.85em}.backlog[open] summary h2:before{content:"\25be  "}.summary-meta{font-family:var(--mono);font-size:.72rem;color:var(--faint);font-variant-numeric:tabular-nums}.backlog-tools{display:grid;gap:12px;padding:0 18px 14px}.search input{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:var(--text)}.search input::placeholder{color:var(--faint)}.search input:focus-visible{border-color:var(--accent)}.filters-bm{position:static;padding:0;margin:0;background:none;backdrop-filter:none;width:auto;border:0}.bm-list{list-style:none;margin:0;padding:0 0 8px;border-top:1px solid var(--line)}.bm-link{display:grid;grid-template-columns:minmax(7rem,11rem) 1fr auto auto;gap:10px 16px;align-items:baseline;padding:11px 18px;color:inherit;text-decoration:none;border-bottom:1px solid var(--line)}.bm-link:hover{background:#ffffff06}.bm-link:focus-visible{outline-offset:-2px}.bm-author{font-family:var(--mono);font-size:.75rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bm-title{min-width:0;font-size:.9rem;letter-spacing:-.015em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bm-cat{font-family:var(--mono);font-size:.68rem;color:var(--faint);white-space:nowrap}.bm-go{color:var(--faint);font-size:.85rem}.site-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-top:8px;padding-bottom:48px;color:var(--faint);font-size:.8rem}.site-foot a{color:var(--muted);text-decoration:none}.site-foot a:hover{color:var(--text)}.not-found{display:flex;flex-direction:column;min-height:100dvh}.not-found .hero{flex:1}.not-found .site-foot{margin-top:auto}.gallery{display:inline-block;font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);text-decoration:none;border:1px solid var(--line-strong);border-radius:999px;padding:8px 14px;background:var(--surface)}.gallery:hover,.gallery:focus-visible{color:var(--focus);border-color:var(--accent)}@media(max-width:767px){.bm-link{grid-template-columns:1fr auto;grid-template-areas:"author go" "title title" "cat cat";gap:2px 12px;padding:12px 16px}.bm-author{grid-area:author}.bm-title{grid-area:title;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.bm-cat{grid-area:cat}.bm-go{grid-area:go}.open-affordance{opacity:1}}@media(prefers-reduced-motion:no-preference){.demo{animation:rise .7s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i, 0) * 45ms)}.poster img{transition:transform .7s cubic-bezier(.16,1,.3,1)}.demo:hover .poster img,.demo:focus-within .poster img{transform:scale(1.03)}.open-affordance{transition:opacity .25s ease,transform .25s ease}.demo:hover .open-affordance,.demo:focus-within .open-affordance{opacity:1;transform:translateY(0)}.open-affordance{transform:translateY(4px);opacity:0}.demo:after{transition:opacity .35s ease}.filter{transition:background .18s ease,color .18s ease,border-color .18s ease}}@media(prefers-reduced-motion:reduce){.demo{animation:fade .35s ease both;animation-delay:calc(var(--i, 0) * 20ms)}.poster img,.open-affordance,.demo:after{transition:none}.open-affordance{opacity:1}}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes fade{0%{opacity:0}to{opacity:1}}::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}