@import "https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@300;400;500&display=swap";html,body,#root{height:100%;margin:0}:root{--bg:#0a0908;--bg-soft:#1a1814;--fg:#e8e3d8;--fg-dim:#e8e3d880;--line:#e8e3d81f;--like:#6ee7b7;--pass:#f87171}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);-webkit-user-select:none;user-select:none;margin:0;font-family:Instrument Serif,Georgia,serif;overflow:hidden}.mono{letter-spacing:.02em;font-family:JetBrains Mono,monospace}.root{background:radial-gradient(ellipse at 50% 30%, var(--bg-soft) 0%, var(--bg) 70%);min-height:100vh;position:relative;overflow:hidden}.root:before{content:"";opacity:.06;pointer-events:none;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");position:absolute;inset:0}.header{z-index:200;justify-content:space-between;align-items:baseline;display:flex;position:absolute;top:32px;left:32px;right:32px}.label{opacity:.5;font-size:10px}.title{margin:4px 0 0;font-size:32px;font-style:italic;font-weight:400;line-height:1}.header-right{text-align:right;line-height:1.6}.stage{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.card-stage{width:360px;height:360px;position:relative}.card{background:var(--bg-soft);box-shadow:0 30px 60px -20px #0009, 0 0 0 1px var(--line);touch-action:none;will-change:transform;border:8px solid #fff;border-radius:2px;position:absolute;inset:0;overflow:hidden}.card-img{object-fit:cover;filter:contrast(1.05)saturate(.9);pointer-events:none;width:100%;height:100%;display:block}.card-meta{background:#fff;justify-content:space-between;align-items:center;height:32px;padding:0 10px;display:flex;position:absolute;bottom:0;left:0;right:0}.card-title{font-size:18px;font-style:italic}.card-num{color:#fff;mix-blend-mode:difference;opacity:.85;font-family:JetBrains Mono,monospace;font-size:9px}.card-meta-num-only{justify-content:flex-start}.fan-tracker{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.card-fan{border:none;width:240px;height:300px;margin-top:-150px;margin-left:-120px;inset:50% auto auto 50%}.overlay{letter-spacing:.18em;text-transform:uppercase;pointer-events:none;background:#0a090899;border:1px solid;border-radius:2px;align-items:center;gap:6px;padding:8px 14px;font-family:JetBrains Mono,monospace;font-size:11px;display:flex;position:absolute;top:24px}.overlay-like{color:var(--like);right:24px}.overlay-pass{color:var(--pass);left:24px}.grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));align-self:flex-start;gap:12px;width:100%;max-width:900px;max-height:100vh;margin:0 auto;padding:120px 32px;display:grid;overflow-y:auto}.grid-card{aspect-ratio:1;cursor:pointer;background:var(--bg-soft);border:none;width:100%;padding:0;position:relative;inset:auto}.lightbox{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:300;background:#0a0908d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.lightbox-card{aspect-ratio:1;width:min(70vw,480px);position:relative;inset:auto}.controls{z-index:200;align-items:center;gap:8px;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.ctrl{border:1px solid var(--line);color:var(--fg);text-transform:uppercase;letter-spacing:.14em;cursor:pointer;background:#e8e3d80a;align-items:center;gap:8px;padding:10px 14px;font-family:JetBrains Mono,monospace;font-size:11px;transition:all .2s;display:inline-flex}.ctrl:hover:not(:disabled){background:#e8e3d81a;border-color:#e8e3d84d}.ctrl.active{background:var(--fg);color:var(--bg);border-color:var(--fg)}.ctrl:disabled{opacity:.3;cursor:not-allowed}.divider{background:var(--line);width:1px;height:16px;margin:0 4px}.debug-panel{border:1px solid var(--line);z-index:250;width:280px;max-height:calc(100vh - 200px);color:var(--fg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0a0908eb;border-radius:4px;flex-direction:column;display:flex;position:fixed;top:80px;right:24px;overflow:hidden}.debug-header{border-bottom:1px solid var(--line);align-items:center;gap:8px;padding:10px 12px;display:flex}.debug-title{letter-spacing:.18em;opacity:.7;flex:1;font-size:10px}.debug-btn{border:1px solid var(--line);color:var(--fg);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:0 0;border-radius:2px;padding:4px 8px;font-family:JetBrains Mono,monospace;font-size:9px}.debug-btn:hover{background:#e8e3d80f}.debug-body{padding:4px 0;overflow-y:auto}.debug-section{border-bottom:1px solid #e8e3d80f;padding:12px 14px}.debug-section:last-child{border-bottom:none}.debug-section-title{letter-spacing:.2em;color:var(--fg);margin-bottom:2px;font-size:9px}.debug-section-sub{letter-spacing:.06em;opacity:.4;margin-bottom:10px;font-family:Instrument Serif,Georgia,serif;font-size:8.5px;font-style:italic}.param{margin-bottom:8px}.param:last-child{margin-bottom:0}.param-row{justify-content:space-between;margin-bottom:4px;font-size:10px;display:flex}.param-label{opacity:.8}.param-value{opacity:.5}.param-slider{appearance:none;cursor:pointer;background:#e8e3d826;outline:none;width:100%;height:2px}.param-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--fg);cursor:pointer;border-radius:50%;width:10px;height:10px}.param-slider::-moz-range-thumb{background:var(--fg);cursor:pointer;border:none;border-radius:50%;width:10px;height:10px}.debug-section-sim{background:#e8e3d808}.sim-row{gap:6px;margin-bottom:12px;display:flex}.sim-btn{flex:1;padding:6px 10px;font-size:10px}.sim-btn.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}.morph-stage{background:#000;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow:hidden}.morph-svg{width:min(80vmin,80vw);height:min(80vmin,80vh);display:block}