:root{--bg:#070203;--red:#ff1838;--dim:#5a0a14;--txt:#f3c9cf;--panel:#12050799}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--txt);font-family:'VT323',monospace;font-size:20px;min-height:100%;overflow-x:hidden;touch-action:manipulation}
body{background:radial-gradient(ellipse at 50% 30%,#2a0509 0%,#070203 70%)}
#vignette{pointer-events:none;position:fixed;inset:0;z-index:50;background:radial-gradient(ellipse at center,transparent 55%,#000c 100%),repeating-linear-gradient(0deg,#0000 0 2px,#0003 2px 3px)}
header{text-align:center;padding:10px 0 4px}
h1{font-family:'Rubik Glitch',cursive;font-size:clamp(34px,7vw,64px);color:var(--red);letter-spacing:4px;position:relative;display:inline-block;text-shadow:0 0 18px #ff183888}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;inset:0;opacity:.7}
.glitch::before{color:#0ff;animation:gl 2.3s infinite steps(1);mix-blend-mode:screen}
.glitch::after{color:#f0f;animation:gl 1.7s infinite reverse steps(1);mix-blend-mode:screen}
@keyframes gl{0%{transform:translate(0)}20%{transform:translate(-3px,1px)}40%{transform:translate(2px,-1px);clip-path:inset(30% 0 40% 0)}60%{transform:translate(0)}80%{transform:translate(3px,2px);clip-path:inset(60% 0 10% 0)}}
.sub{opacity:.6;font-size:16px}
#game{display:flex;justify-content:center;align-items:flex-start;gap:14px;padding:8px}
.panel{display:flex;flex-direction:column;gap:10px;width:160px}
.box{background:var(--panel);border:1px solid var(--dim);padding:8px;box-shadow:inset 0 0 12px #000}
.lbl{color:var(--red);font-size:16px;letter-spacing:2px}
.stats div{display:flex;justify-content:space-between}
.stats b{font-size:24px;color:#fff}
.big{font-size:40px;color:var(--red);text-shadow:0 0 10px var(--red)}
.tiny{font-size:14px;opacity:.6}
.holdbox{height:60px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:15px;opacity:.5;border:1px dashed var(--dim);text-decoration:line-through}
.boardwrap{position:relative}
#canvas{display:block;border:2px solid var(--red);animation:beat 1.6s infinite;image-rendering:pixelated}
@keyframes beat{0%,100%{box-shadow:0 0 10px #ff183855}12%{box-shadow:0 0 34px #ff1838cc}24%{box-shadow:0 0 14px #ff183866}36%{box-shadow:0 0 28px #ff1838aa}}
#overlay{position:absolute;inset:0;background:#000c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:12px}
#overlay.hidden,.hidden{display:none!important}
.ovtitle{font-size:30px;color:var(--red);text-shadow:0 0 12px var(--red)}
.ovsub{opacity:.8}
.modes{display:flex;flex-direction:column;gap:6px;width:100%}
button{font-family:inherit;font-size:20px;background:#1a0408;color:var(--txt);border:1px solid var(--dim);padding:6px 10px;cursor:pointer}
button:hover{border-color:var(--red);color:#fff}
.mode.on{background:var(--red);color:#000;border-color:var(--red)}
#startBtn{background:var(--red);color:#000;font-size:26px;padding:8px 20px;margin-top:4px}
.small{width:100%;font-size:17px;margin:2px 0}
#nextCanvas,#eyeCanvas{display:block;width:100%;image-rendering:pixelated}
#taunt{max-width:640px;margin:8px auto;padding:8px 14px;border:1px solid var(--dim);background:#0d0305;min-height:44px;color:#ff8a98}
#taunt::before{content:"THE ALGORITHM: ";color:var(--red)}
.caret{animation:bl 1s infinite steps(1)}@keyframes bl{50%{opacity:0}}
#controls{display:none;justify-content:center;gap:6px;padding:6px}
#controls button{width:52px;height:52px;font-size:24px}
#lb{position:fixed;inset:0;background:#000d;z-index:60;display:flex;align-items:center;justify-content:center}
.lbinner{background:#120407;border:2px solid var(--red);padding:16px;width:min(380px,92vw)}
#lbList{margin:10px 0 10px 24px;max-height:50vh;overflow:auto}
#auth-status{font-size:15px;opacity:.8}
#auth-status a{color:var(--red)}
footer{text-align:center;padding:12px;font-size:15px;opacity:.7}
footer a{color:var(--red)}
@media (max-width:720px){
  #game{flex-wrap:wrap;gap:6px}
  .panel{width:auto;flex-direction:row;flex-wrap:wrap;order:2;justify-content:center}
  .panel .box{width:46vw}
  .boardwrap{order:1}
  .holdbox{height:30px}
  #controls{display:flex}
}