@import "https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{color:#e4e8dc;font-synthesis:none;--muted:#929a91;--line:#b5bea327;--acid:#d5f3a5;--p1:#d5f3a5;--p2:#ff9a7a;background:#0d1214;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a{color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}a{text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--acid);outline-offset:4px}.mono{font-family:IBM Plex Mono,monospace}#scene{touch-action:none;width:100%;height:100%;position:fixed;inset:0}header{border-bottom:1px solid var(--line);z-index:5;justify-content:space-between;align-items:center;height:72px;display:flex;position:fixed;top:0;left:40px;right:40px}.brand{letter-spacing:1.2px;align-items:center;gap:10px;font-size:14px;font-weight:700;display:flex}.brand-icon{color:var(--acid);margin-right:5px;font-size:30px;font-weight:700}.brand-light{color:var(--muted);font-weight:400}.text-button{border:1px solid var(--line);letter-spacing:1px;color:var(--acid);background:0 0;padding:10px 16px;font:500 11px IBM Plex Mono,monospace}.text-button:hover{background:#a8b8b912}#select{z-index:4;background:radial-gradient(at 50% 30%,#1c2529 0%,#0d1214 65%);flex-direction:column;justify-content:center;align-items:center;gap:22px;padding:90px 40px 40px;display:flex;position:fixed;inset:0;overflow:auto}#select[hidden]{display:none}#select h1{letter-spacing:-.5px;text-align:center;margin:0;font:800 clamp(38px,6vw,78px)/.95 Barlow Condensed,sans-serif}#select h1 span{color:var(--acid)}#select p.lead{color:var(--muted);letter-spacing:1px;text-align:center;margin:0;font:12px IBM Plex Mono,monospace}.slots{letter-spacing:1px;align-items:center;gap:22px;font:700 clamp(18px,2.6vw,30px) Barlow Condensed,sans-serif;display:flex}.slot{border:1px solid var(--line);justify-content:space-between;gap:16px;min-width:220px;padding:10px 18px;display:flex}.slot small{color:var(--muted);letter-spacing:1px;margin-bottom:4px;font:11px IBM Plex Mono,monospace;display:block}.slot.p1 b{color:var(--p1)}.slot.p2 b{color:var(--p2)}.vs{color:var(--muted)}.grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;width:min(1180px,100%);display:grid}.card{border:1px solid var(--line);text-align:left;background:#141b1e;padding:0;transition:transform .15s,border-color .15s;position:relative;overflow:hidden}.card:hover{border-color:#b5bea366;transform:translateY(-3px)}.card img{aspect-ratio:1;object-fit:cover;filter:saturate(.9);width:100%;display:block}.card .meta{padding:10px 12px 12px}.card .name{letter-spacing:.5px;font:700 20px Barlow Condensed,sans-serif}.card .name span{color:var(--muted);margin-left:6px;font-weight:500}.card .style{color:var(--muted);letter-spacing:.8px;margin-top:2px;font:10px IBM Plex Mono,monospace}.card .badge{letter-spacing:1px;background:#0d1214e0;border:1px solid #0000;padding:4px 8px;font:600 10px IBM Plex Mono,monospace;position:absolute;top:10px;left:10px}.card[data-slot=p1]{border-color:var(--p1)}.card[data-slot=p1] .badge{color:var(--p1);border-color:var(--p1)}.card[data-slot=p2]{border-color:var(--p2)}.card[data-slot=p2] .badge{color:var(--p2);border-color:var(--p2)}.actions{align-items:center;gap:12px;display:flex}.primary{background:var(--acid);color:#0d1214;letter-spacing:2px;border:0;padding:14px 30px;font:800 18px Barlow Condensed,sans-serif}.primary:disabled{opacity:.35;cursor:not-allowed}#hud{pointer-events:none;z-index:3;position:fixed;inset:0}#hud[hidden]{display:none}.bars{justify-content:space-between;gap:40px;display:flex;position:absolute;top:90px;left:40px;right:40px}.bar{flex:1;max-width:min(520px,38vw)}.bar .label{letter-spacing:1px;justify-content:space-between;margin-bottom:6px;font:700 20px Barlow Condensed,sans-serif;display:flex}.bar .label small{color:var(--muted);letter-spacing:1px;align-self:flex-end;font:11px IBM Plex Mono,monospace}.bar .track{border:1px solid var(--line);background:#ffffff14;height:12px;position:relative;overflow:hidden}.bar .fill{transform-origin:0;background:var(--p1);transition:transform .12s;position:absolute;inset:0}.bar.p2 .fill{background:var(--p2);transform-origin:100%}.bar.p2 .label{flex-direction:row-reverse}.bar .ghost{transform-origin:0;background:#fff5;transition:transform .6s .25s;position:absolute;inset:0}.bar.p2 .ghost{transform-origin:100%}.timer{color:var(--muted);font:800 34px Barlow Condensed,sans-serif;position:absolute;top:84px;left:50%;transform:translate(-50%)}.controls{color:var(--muted);letter-spacing:.8px;gap:18px;font:11px IBM Plex Mono,monospace;display:flex;position:absolute;bottom:26px;left:40px}.controls b{color:#e4e8dc;border:1px solid var(--line);margin-right:4px;padding:2px 6px;font-weight:500}.status{color:var(--muted);letter-spacing:.8px;font:11px IBM Plex Mono,monospace;position:absolute;bottom:26px;right:40px}.banner{text-align:center;letter-spacing:3px;opacity:0;text-shadow:0 10px 40px #000a;font:800 clamp(48px,9vw,120px)/1 Barlow Condensed,sans-serif;transition:opacity .25s,transform .25s;position:absolute;top:38%;left:0;right:0;transform:scale(.9)}.banner.show{opacity:1;transform:scale(1)}.banner small{color:var(--muted);letter-spacing:3px;margin-top:10px;font:600 16px IBM Plex Mono,monospace;display:block}#result{z-index:6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0d1214b8;flex-direction:column;justify-content:center;align-items:center;gap:18px;display:flex;position:fixed;inset:0}#result[hidden]{display:none}#result h2{letter-spacing:3px;margin:0;font:800 clamp(52px,10vw,130px)/1 Barlow Condensed,sans-serif}#result p{color:var(--muted);letter-spacing:1px;text-align:center;margin:0;font:12px IBM Plex Mono,monospace}#loading{z-index:5;letter-spacing:2px;color:var(--muted);background:#0d1214;flex-direction:column;justify-content:center;align-items:center;gap:14px;font:12px IBM Plex Mono,monospace;display:flex;position:fixed;inset:0}#loading[hidden]{display:none}.load-ring{border:2px solid var(--line);border-top-color:var(--acid);border-radius:50%;width:44px;height:44px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.touch{pointer-events:none;display:none;position:absolute;inset:0}.touch .stick{border:1px solid var(--line);pointer-events:auto;touch-action:none;background:#ffffff08;border-radius:50%;width:130px;height:130px;position:absolute;bottom:70px;left:28px}.touch .stick i{border:1px solid var(--acid);background:#d5f3a544;border-radius:50%;width:54px;height:54px;margin:-27px;position:absolute;top:50%;left:50%}.touch .pad{pointer-events:auto;grid-template-columns:repeat(2,68px);gap:12px;display:grid;position:absolute;bottom:60px;right:24px}.touch .pad button{border:1px solid var(--line);letter-spacing:.5px;touch-action:none;-webkit-user-select:none;user-select:none;background:#ffffff10;border-radius:50%;width:68px;height:68px;font:700 11px IBM Plex Mono,monospace}.touch .pad button:active{background:#d5f3a544}@media (pointer:coarse){.touch{display:block}.controls{display:none}}@media (width<=700px){header{left:16px;right:16px}.bars{gap:14px;top:80px;left:16px;right:16px}.bar .label{font-size:15px}.controls,.status{left:16px;right:16px}#select{padding:80px 16px 24px}.grid{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}.slot{min-width:0}.card .name{font-size:16px}}.dmg{letter-spacing:1px;text-shadow:0 3px 14px #000c;pointer-events:none;will-change:transform,opacity;font:800 30px Barlow Condensed,sans-serif;position:absolute;top:0;left:0}.touch .move{pointer-events:auto;gap:12px;display:flex;position:absolute;bottom:60px;left:24px}.touch .move button{border:1px solid var(--line);touch-action:none;-webkit-user-select:none;user-select:none;background:#ffffff10;border-radius:50%;width:76px;height:76px;font:700 22px IBM Plex Mono,monospace}.touch .move button:active{background:#d5f3a544}.touch .stick{display:none}.tell{letter-spacing:4px;color:var(--p2);opacity:0;font:800 18px IBM Plex Mono,monospace;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}