:root{color-scheme:dark;--pink:#ff3bbf;--cyan:#73f9fa;--ink:#f8f5ff}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#080916;color:var(--ink);font-family:'IBM Plex Mono',monospace}#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#ui{position:fixed;inset:0;pointer-events:none}.hud{position:absolute;inset:18px 22px auto;display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.08em;text-shadow:0 2px 4px #000}.hud[hidden]{display:none}.hud>span:not(.tip){background:#0b0c1de8;border:1px solid #4e375a;padding:12px 14px;min-width:90px}.hud>span:first-child{border-color:#ff3bbf;color:#ff88d7}.hud .tip{position:fixed;bottom:22px;left:24px;color:#d7d5e6;font-size:10px;letter-spacing:.1em}.hud-btn{margin-left:auto;background:#121426e8;color:#fff;border:1px solid #67516b;padding:12px 16px;font:inherit;pointer-events:auto;cursor:pointer}.screen{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(90deg,rgba(6,7,19,.95) 0%,rgba(7,7,19,.84) 45%,rgba(7,7,19,.35) 100%);pointer-events:auto}.screen[hidden]{display:none}.card{width:min(90vw,580px);padding:38px 42px;border-left:3px solid var(--pink);background:linear-gradient(120deg,rgba(17,17,35,.96),rgba(17,17,35,.7));box-shadow:0 0 80px #05030a99}.card:before{content:'◈  ARCADE PROTOCOL  /  001';color:var(--cyan);font-size:10px;letter-spacing:.23em;font-weight:700}.card h1{font-family:'Barlow Condensed',Impact,sans-serif;font-style:italic;font-weight:900;font-size:clamp(3.4rem,8vw,6.4rem);letter-spacing:-.035em;line-height:.82;margin:25px 0 20px;text-shadow:4px 4px 0 #9a176c}.card h1:after{content:' 3D';color:var(--pink)}.card p{max-width:430px;font-size:13px;line-height:1.8;color:#beb8cf;margin:0 0 26px}.card button{font:700 12px 'IBM Plex Mono',monospace;letter-spacing:.08em;background:var(--pink);border:1px solid var(--pink);color:#100519;padding:17px 24px;cursor:pointer;min-height:48px;margin:4px 5px 4px 0;box-shadow:4px 4px 0 #70235f}.card button:hover{background:#ff8edb}.card button.secondary{background:#161629;border-color:#4a3e5d;color:#fff;box-shadow:none}.card button:focus-visible,.hud-btn:focus-visible{outline:2px solid #74ffff;outline-offset:3px}.message{position:absolute;left:50%;top:24%;transform:translateX(-50%);font-weight:700;font-size:19px;color:#9dfaff;text-shadow:0 0 15px #00ffff;transition:opacity .3s}.touch{position:absolute;inset:0;pointer-events:none}.touch[hidden]{display:none}.stick{position:absolute;width:110px;height:110px;margin:-55px;border-radius:50%;border:2px solid #ffffff66;background:#ffffff14;display:none}.stick .knob{position:absolute;left:30px;top:30px;width:50px;height:50px;border-radius:50%;background:#ffffff80}.jump-btn{position:absolute;right:24px;bottom:24px;width:76px;height:76px;border-radius:50%;border:1px solid #ff78d0;background:#381439cc;color:#fff;font:700 12px monospace;pointer-events:auto;touch-action:none}.fallback{position:fixed;inset:0;display:grid;place-items:center;padding:24px}.crt:after{content:'';position:fixed;inset:0;z-index:9;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0px,transparent 2px,#0005 3px,#0005 4px);opacity:.42}@media(max-width:650px){.card{padding:28px 25px}.card h1{font-size:3.8rem}.hud{inset:8px;gap:4px;flex-wrap:wrap;font-size:9px}.hud>span:not(.tip){padding:8px;min-width:0}.hud .tip{display:none}.hud-btn{padding:8px}.screen{background:#080815c9}}

.dash-btn{bottom:112px;background:#12364bcc;border-color:#6cf9ff}.screen .card:after{content:'WASD / ARROWS  MOVE     •     MOUSE + CLICK  AIM & FIRE     •     SHIFT  DASH     •     C  CRT';display:block;margin-top:28px;padding-top:20px;border-top:1px solid #5c405d;color:#9993ac;font-size:9px;line-height:1.8;letter-spacing:.05em}

.screen:not([data-state=title]) .card h1:after{content:''}.screen[data-state=levelup] .card{width:min(92vw,680px)}.screen[data-state=levelup] .card h1{font-size:4rem}.screen[data-state=levelup] .card button{display:block;width:100%;text-align:left;margin:8px 0;background:#1d1a31;border:1px solid #685173;color:#fdfaff;box-shadow:none;line-height:1.5}.screen[data-state=levelup] .card button:hover{border-color:#6cffff;background:#28213c}.screen[data-state=levelup] .card:after{content:'CHOOSE WITH 1 / 2 / 3 OR CLICK A CARD'}.screen[data-state=over] .card:after{content:'THE DUNGEON IS ENDLESS. YOUR NEXT RUN IS WAITING.'}.hit #scene{transform:translate(4px,-3px)}

.screen[data-state=title]{justify-content:flex-start;padding-left:max(7vw,28px);overflow:hidden}.screen[data-state=title]:before{content:'';position:absolute;right:8%;top:14%;height:min(70vh,600px);width:min(70vh,600px);background-image:url('../assets/uploads/qzxxko.webp');background-size:400% 400%;background-position:0 0;mix-blend-mode:screen;opacity:.78;filter:drop-shadow(0 0 30px #ff37cc55);pointer-events:none}.screen[data-state=title] .card{z-index:1}.crt-btn{position:absolute;right:96px;top:18px}.screen[data-state=over] .card p{color:#d4cde0;line-height:2}.screen[data-state=over] .card h1{font-size:clamp(3rem,7vw,6rem)}
@media(max-width:700px){.screen[data-state=title]{justify-content:center;padding:20px}.screen[data-state=title]:before{right:-36%;top:6%;opacity:.15}.crt-btn{top:80px;right:10px}.screen[data-state=levelup] .card h1{font-size:2.8rem}.screen[data-state=levelup] .card button{font-size:10px;padding:11px}}

@media(max-width:650px){.hud{inset:8px 8px auto;align-items:flex-start}.hud .crt-btn{top:38px;right:0}.screen[data-state=title] .card:after{content:'TOUCH: DRAG LEFT TO MOVE  •  HOLD FIRE TO AUTO-AIM  •  TAP DASH TO EVADE'}}

@media(max-width:650px){.hud .hud-btn:not(.crt-btn){position:absolute;top:74px;right:0}}

/* Clearer status feedback and a compact end screen on narrow displays. */
.hud [data-hud="health"].low-health{color:#ff91c9;border-color:#ff3bbf;background:#381429}
.hud [data-hud="dash"]{color:#91fbff;border-color:#346b7a}
.screen[data-state=over] .card h1{font-size:clamp(2.5rem,6vw,4.9rem);overflow-wrap:anywhere}
@media(max-width:650px){.hud [data-hud="dash"]{min-width:0}.screen[data-state=over] .card h1{font-size:clamp(2.3rem,10vw,3.4rem)}}