:root{--bg:#050510;--panel:#0b0b1a;--panel-2:#10101f;--line:#e4e4e717;--line-strong:#e4e4e733;--ink:#e4e4e7;--ink-2:#a1a1aa;--ink-3:#71717a;--ink-4:#52525b;--accent:#cf772e;--gold:#facc15;--mono:"SF Mono",Menlo,Consolas,"Liberation Mono",monospace}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{background:var(--bg);color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased}body{background-image:radial-gradient(70% 50% at 50% -8%,#cf772e24 0%,#0000 70%),radial-gradient(50% 40% at 85% 12%,#38bdf812 0%,#0000 70%);background-repeat:no-repeat;min-height:100vh}a{color:inherit;text-decoration:none}.shell{max-width:1140px;margin:0 auto;padding:0 20px 72px}.masthead{flex-direction:column;gap:16px;padding:40px 0 26px;display:flex}.brand{letter-spacing:.2em;align-items:center;gap:10px;font-size:12px;font-weight:700;display:flex}.brand .dot{background:var(--accent);border-radius:50%;width:8px;height:8px}.brand .own{color:var(--ink)}.brand .sandbox{color:var(--accent)}.brand .sep{color:var(--ink-4)}.brand .arcade{color:var(--ink-3);letter-spacing:.24em}h1{letter-spacing:-.02em;text-wrap:balance;max-width:17ch;font-size:clamp(30px,5.2vw,52px);font-weight:700;line-height:1.04}h1 em{color:var(--accent);font-style:normal}.lede{color:var(--ink-2);max-width:60ch;font-size:13.5px;line-height:1.8}.lede b{color:var(--ink);font-weight:700}.counts{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.count{letter-spacing:.1em;color:var(--ink-3);border:1px solid var(--line);border-radius:999px;padding:6px 13px;font-size:10.5px}.count b{color:var(--ink);font-weight:700}.filters{flex-wrap:wrap;gap:7px;padding:8px 0 22px;display:flex}.filter{font-family:var(--mono);letter-spacing:.1em;color:var(--ink-3);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:999px;padding:8px 15px;font-size:10.5px;font-weight:700;transition:color .15s,border-color .15s,background .15s}.filter:hover{color:var(--ink);border-color:var(--line-strong)}.filter[aria-pressed=true]{color:var(--bg);background:var(--accent);border-color:var(--accent)}.grid{grid-template-columns:repeat(auto-fill,minmax(252px,1fr));grid-auto-flow:dense;gap:14px;display:grid}.card{background:linear-gradient(170deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:16px;flex-direction:column;gap:11px;padding:17px 18px 16px;transition:border-color .18s,transform .18s;display:flex;position:relative;overflow:hidden}.card:before{content:"";background:var(--card-accent);opacity:.55;height:2px;position:absolute;inset:0 0 auto}.card:hover{border-color:var(--line-strong);transform:translateY(-2px)}.card.wide{grid-column:span 2}@media (max-width:620px){.card.wide{grid-column:span 1}}.card-top{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.chip{letter-spacing:.12em;color:var(--card-accent);background:color-mix(in srgb,var(--card-accent)13%,transparent);border:1px solid color-mix(in srgb,var(--card-accent)30%,transparent);border-radius:6px;padding:4px 9px;font-size:9.5px;font-weight:700}.chip.flat{color:var(--ink-3);border-color:var(--line);background:0 0}.chip.dim{color:var(--ink-4);background:0 0;border:0;padding-left:0}.card h2{letter-spacing:-.01em;font-size:17px;font-weight:700;line-height:1.2}.card .blurb{color:var(--ink-2);font-size:12.5px;line-height:1.7}.card .teaches{color:var(--ink-4);border-left:2px solid color-mix(in srgb,var(--card-accent)45%,transparent);padding-left:10px;font-size:11px;line-height:1.65}.card .teaches b{color:var(--ink-3);font-weight:400}.tech{flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:3px;display:flex}.tech span{letter-spacing:.06em;color:var(--ink-4);border:1px solid var(--line);border-radius:5px;padding:3px 7px;font-size:9.5px}.play{background:color-mix(in srgb,var(--card-accent)12%,transparent);border:1px solid color-mix(in srgb,var(--card-accent)32%,transparent);letter-spacing:.12em;color:var(--card-accent);border-radius:10px;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;padding:10px 14px;font-size:11px;font-weight:700;transition:background .15s;display:flex}.card:hover .play{background:color-mix(in srgb,var(--card-accent)22%,transparent)}.play .arrow{transition:transform .18s}.card:hover .play .arrow{transform:translate(3px)}.empty{color:var(--ink-4);padding:36px 0;font-size:12px}.foot{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-top:46px;padding-top:22px;display:flex}.foot p{color:var(--ink-4);max-width:62ch;font-size:11px;line-height:1.7}.foot a.back{letter-spacing:.12em;color:var(--accent);border:1px solid color-mix(in srgb,var(--accent)35%,transparent);white-space:nowrap;border-radius:999px;padding:9px 17px;font-size:11px;font-weight:700}.foot a.back:hover{background:color-mix(in srgb,var(--accent)14%,transparent)}@media (max-width:480px){.shell{padding:0 16px 56px}.masthead{padding:28px 0 20px}}.shot{aspect-ratio:16/9;border-bottom:1px solid var(--line);background:#0b101d;margin:-17px -18px 3px;position:relative;overflow:hidden}.shot-img{object-fit:cover;width:100%;height:100%;transition:transform .35s cubic-bezier(.16,1,.3,1);display:block}.card:hover .shot-img{transform:scale(1.04)}.shot:after{content:"";background:linear-gradient(to bottom,transparent 55%,color-mix(in srgb,var(--panel)85%,transparent));pointer-events:none;position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.card:hover .shot-img{transform:none}}
