:root{color-scheme:dark;--bg:#1b1410;--fg:#f4ead8;--ac:#e9a23b;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}html,body{height:100%;margin:0;background:var(--bg);color:var(--fg);font-family:Georgia,'Times New Roman',serif;overflow:hidden}
canvas{position:fixed;inset:0;width:100%;height:100%;display:block}
#vig{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 50%,rgba(10,6,2,.55))}
.scr{position:fixed;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;background:linear-gradient(rgba(20,12,6,.35),rgba(20,12,6,.8));padding:20px}.scr.show{display:flex}
h1{font-size:clamp(64px,16vw,150px);letter-spacing:.12em;margin:0;color:var(--ac);text-shadow:0 4px 0 #6b3b0f,0 10px 30px #000}
h2{font-size:48px;letter-spacing:.2em;margin:0 0 8px;color:var(--ac)}p{max-width:480px;line-height:1.5;margin:0}.kick{letter-spacing:.35em;text-transform:uppercase;font-size:13px;opacity:.8}
.blink{margin-top:22px;animation:b 1.4s infinite}@keyframes b{50%{opacity:.2}}
button{font:inherit;font-size:18px;min-width:260px;padding:12px 22px;background:#2d2118;color:var(--fg);border:2px solid var(--ac);border-radius:6px;cursor:pointer}
button:hover:not(:disabled){background:var(--ac);color:#1b1410}button:disabled{opacity:.45;cursor:not-allowed;border-color:#7a6a58}
#hud{display:none;position:fixed;inset:0;pointer-events:none;text-shadow:0 1px 4px #000}
#stat{position:absolute;left:16px;top:calc(12px + env(safe-area-inset-top,0px));font-size:18px}
#btns{position:absolute;right:12px;top:calc(12px + env(safe-area-inset-top,0px));display:flex;gap:8px}#btns button{min-width:0;font-size:14px;padding:6px 12px;pointer-events:auto}
#cross{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #000}
#sig{position:absolute;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:min(170px,60vw);text-align:center;font-size:11px;opacity:.7}
.bar{height:3px;background:#0006;border-radius:3px;margin-top:3px;overflow:hidden}#sf{display:block;height:100%;width:100%;background:#7fe0ff}
#help ul{list-style:none;padding:0;margin:6px 0 10px;text-align:left;line-height:1.9;font-size:17px}#help b{display:inline-block;min-width:150px;color:var(--ac)}
.row{display:flex;gap:8px}.row button{min-width:0}
#code{font:inherit;font-size:18px;width:130px;padding:12px;text-align:center;letter-spacing:.3em;text-transform:uppercase;background:#2d2118;color:var(--fg);border:2px solid var(--ac);border-radius:6px}
#mpMsg{min-height:1.5em;color:var(--ac)}#room{font-size:20px;letter-spacing:.1em;color:var(--ac)}
.mponly,.clonly{display:none}body.mp .mponly{display:block}body.cl .clonly{display:block}body.cl #bNew2,body.cl #bNew3{display:none}
#rm{opacity:.85}
#toast{position:absolute;left:50%;top:18%;transform:translateX(-50%);font-size:20px;background:#000a;padding:10px 18px;border-radius:8px;opacity:0;transition:opacity .4s;text-align:center;max-width:80vw}