:root{--bg:#2E3440;--surface:#3B4252;--surface2:#434C5E;--thumb:#272c36;--border:#4C566A;--text:#ECEFF4;--muted:#9aa5b8;--subtle:#6e7a8f;--accent:#A3BE8C;--frost:#88C0D0;--purple:#B48EAD;--red:#BF616A;--yellow:#EBCB8B;--sans:"Space Grotesk", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace}:root[data-theme=dark]{--bg:#0b0b0c;--surface:#141416;--surface2:#1b1b1e;--thumb:#111113;--border:#34343b;--text:#ededef;--muted:#8a8a93;--subtle:#5c5c66;--accent:#7fd49a;--frost:#79c4d6;--purple:#c4a0d0;--red:#e0808a;--yellow:#e8cf8f}:root[data-theme=light]{--bg:#f4f3ef;--surface:#ffffff;--surface2:#faf9f6;--thumb:#eceae3;--border:#d6d3c8;--text:#23252a;--muted:#6b6f78;--subtle:#9a9ea6;--accent:#5b8a4f;--frost:#3f7e8f;--purple:#8a5f93;--red:#b1525b;--yellow:#a98a3a}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:var(--bg);color:var(--text);font-family:var(--sans);transition:background .4s ease,color .4s ease;-webkit-font-smoothing:antialiased}::selection{background:var(--accent);color:var(--bg)}.wrap{max-width:1120px;margin:0 auto;padding:56px 40px 72px}.top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.brand h1{margin:0;line-height:0}.brand .wordmark{height:48px}.brand p{margin:14px 0 0;font-size:15.5px;line-height:1.5;color:var(--muted);max-width:380px;text-wrap:pretty}.themepick{position:relative}.theme-btn{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:11px;cursor:pointer;transition:background .15s,border-color .15s}.theme-btn:hover{border-color:var(--accent)}.theme-menu{position:absolute;top:calc(100% + 8px);right:0;width:166px;padding:6px;border-radius:13px;background:var(--surface);border:1px solid var(--border);box-shadow:0 18px 44px -20px #0000008c;z-index:20;transform-origin:top right;animation:themeMenuIn .15s ease both}@keyframes themeMenuIn{0%{transform:translateY(-6px) scale(.97)}to{transform:none}}.theme-menu button{width:100%;display:flex;align-items:center;gap:11px;border:0;background:transparent;color:var(--text);font-family:var(--mono);font-size:12.5px;letter-spacing:.02em;padding:9px 10px;border-radius:9px;cursor:pointer;transition:background .14s}.theme-menu button:hover{background:var(--surface2)}.theme-menu button .ic{display:grid;place-items:center;color:var(--muted)}.theme-menu button[aria-pressed=true],.theme-menu button[aria-pressed=true] .ic{color:var(--accent)}.toolbar{display:flex;align-items:center;gap:14px;margin:40px 0 26px;flex-wrap:wrap;border-top:1px solid var(--border);padding-top:26px}.search{position:relative;flex:1;min-width:240px}.search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);opacity:.5;pointer-events:none}.search input{width:100%;background:var(--surface);border:1px solid var(--border);color:var(--text);font-family:var(--mono);font-size:13px;letter-spacing:.01em;padding:11px 14px 11px 40px;border-radius:11px;outline:none;transition:border-color .15s,box-shadow .15s}.search input::placeholder{color:var(--subtle)}.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}.filter{display:flex;gap:2px;padding:3px;border-radius:11px;background:var(--surface);border:1px solid var(--border)}.filter button{border:0;background:transparent;color:var(--muted);cursor:pointer;font-family:var(--mono);font-size:11.5px;letter-spacing:.03em;padding:8px 13px;border-radius:8px;display:flex;align-items:center;gap:7px;transition:color .15s,background .15s}.filter button .n{font-size:10px;color:var(--subtle)}.filter button[aria-pressed=true]{background:var(--surface2);color:var(--text)}.filter button[aria-pressed=true] .n{color:var(--accent)}.grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:206px;gap:16px;grid-auto-flow:dense}.card{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--border);background:var(--thumb);text-decoration:none;color:inherit;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}a.card{cursor:pointer}a.card:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 18px 44px -22px #0009}.card.featured{grid-column:span 2;grid-row:span 2}.card canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.card.soon canvas{opacity:.5}.tags{position:absolute;top:14px;left:14px;display:flex;align-items:center;gap:8px;z-index:2}.pill{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--bg);padding:3px 9px;border-radius:100px;font-weight:600}.soon-tag{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border:1px solid var(--border);background:color-mix(in srgb,var(--bg) 55%,transparent);padding:3px 8px;border-radius:100px}.idx{position:absolute;top:14px;right:16px;font-family:var(--mono);font-size:12px;color:var(--text);opacity:.5;z-index:2}.meta{position:relative;z-index:1;padding:14px 16px;background:linear-gradient(to top,color-mix(in srgb,var(--bg) 95%,transparent) 0%,color-mix(in srgb,var(--bg) 80%,transparent) 45%,transparent 100%)}.card.featured .meta{padding:20px 22px}.meta h3{margin:0;font-size:18px;font-weight:600;letter-spacing:-.015em}.card.featured .meta h3{font-size:30px;letter-spacing:-.025em}.meta p{margin:8px 0 0;font-size:14px;line-height:1.5;color:var(--muted);max-width:340px;text-wrap:pretty}.empty{grid-column:1 / -1;padding:60px 0;text-align:center;font-family:var(--mono);font-size:13px;color:var(--subtle)}.empty b{color:var(--text);font-weight:500}.footer{margin-top:40px;display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:11.5px;color:var(--subtle);letter-spacing:.03em;border-top:1px solid var(--border);padding-top:22px;flex-wrap:wrap;gap:10px}.footer-mark{display:inline-flex;align-items:center;gap:8px}@media (max-width: 900px){.grid{grid-template-columns:repeat(2,1fr)}.brand .wordmark{height:40px}}@media (max-width: 560px){.wrap{padding:36px 22px 56px}.grid{grid-template-columns:1fr;grid-auto-rows:196px}.card.featured{grid-column:span 1;grid-row:span 1}.top{flex-direction:column}}