:root{--bg:#0d0a14;--panel:#171224ee;--line:#2c2140;--text:#e8dbc5;--dim:#8a7d99;--amber:#ffb347;--gold:#c9a86a;--ghost:#9fe8dc;--danger:#ff5b4d;--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);--hud:46px}*{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%}html,body{height:100%;overscroll-behavior:none}body{position:fixed;inset:0;width:100%;background:var(--bg);color:var(--text);overflow:hidden;font-family:Georgia,Iowan Old Style,Times New Roman,serif;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation}#fog{position:fixed;inset:-20%;pointer-events:none;z-index:0;opacity:.8;background:radial-gradient(38% 30% at 30% 72%,#ffb34712,transparent 70%),radial-gradient(45% 36% at 74% 24%,#9fe8dc0c,transparent 70%),radial-gradient(30% 26% at 60% 80%,#c9a86a10,transparent 70%);animation:fogdrift 26s ease-in-out infinite alternate}@keyframes fogdrift{0%{transform:translate3d(-2%,-1%,0) scale(1)}to{transform:translate3d(2%,2%,0) scale(1.06)}}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(120% 90% at 50% 45%,transparent 55%,#05030a99 100%)}#hud{position:fixed;top:0;left:0;right:0;height:calc(var(--hud) + var(--sat));padding:var(--sat) calc(12px + var(--sar)) 0 calc(12px + var(--sal));display:flex;align-items:center;gap:10px;background:linear-gradient(#171224,#171224cc);border-bottom:1px solid var(--line);z-index:5}#logo{font-size:15px;letter-spacing:.34em;color:var(--amber);white-space:nowrap;padding-left:.3em;text-shadow:0 0 14px #ffb34766;animation:flicker 4.4s infinite}@keyframes flicker{0%,to{opacity:1}86%{opacity:1}88%{opacity:.72}90%{opacity:.96}93%{opacity:.8}95%{opacity:1}}#chips{display:flex;gap:6px;flex:1;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}#chips::-webkit-scrollbar{display:none}.chip{display:flex;align-items:center;gap:5px;padding:3px 9px;border:1px solid var(--line);border-radius:20px;font-size:11px;white-space:nowrap;background:#0d0a14}.chip .sg{font-size:13px}.chip.me{border-color:#5a4a2f}.chip.dead{opacity:.4}.chip .sc{color:var(--gold);font-size:10px;letter-spacing:.06em}#status{font-size:10px;color:var(--dim);white-space:nowrap;display:flex;align-items:center;gap:6px}#statdot{width:8px;height:8px;border-radius:50%;background:#f43;box-shadow:0 0 8px #f43;flex:none}#statdot.on{background:#ffb347;box-shadow:0 0 8px #ffb347}button{font-family:inherit;font-size:13px;letter-spacing:.14em;color:var(--amber);background:#241a30;border:1px solid #4a3860;border-radius:8px;padding:10px 18px;cursor:pointer;text-transform:uppercase;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:active{transform:translateY(1px)}button:hover:not(:disabled){background:#31234a;box-shadow:0 0 16px #ffb34733}button:disabled{opacity:.35;cursor:default}button.big{font-size:15px;padding:14px 34px}#copybtn{font-size:10px;padding:6px 10px}#stage{position:fixed;inset:0;z-index:2;padding:calc(var(--hud) + var(--sat) + 10px) calc(12px + var(--sar)) calc(12px + var(--sab)) calc(12px + var(--sal));display:flex;align-items:stretch;justify-content:center}.scene{width:100%;max-width:560px;display:flex;flex-direction:column;gap:12px;min-height:0}#bellhead{display:flex;align-items:center;justify-content:space-between;gap:12px}#belltitle{font-size:26px;letter-spacing:.3em;color:var(--gold);text-shadow:0 0 18px #c9a86a44}#ring{width:64px;height:64px;border-radius:50%;flex:none;background:conic-gradient(var(--amber) 360deg,#2c2140 0deg);display:flex;align-items:center;justify-content:center;box-shadow:0 0 22px #ffb34722}#ring:before{content:"";position:absolute;width:52px;height:52px;border-radius:50%;background:var(--bg)}#ring.urgent{animation:pulse .5s infinite alternate}@keyframes pulse{0%{box-shadow:0 0 14px #ff5b4d33}to{box-shadow:0 0 30px #ff5b4d88}}#ringnum{position:relative;font-size:22px;color:var(--text)}.notice{background:#241a30dd;border:1px solid #4a3860;border-radius:10px;padding:11px 14px;font-size:13.5px;line-height:1.5;text-align:center;color:var(--ghost)}.notice b{color:var(--amber)}.notice.dim{color:var(--dim);border-color:var(--line);background:#171224aa;font-size:12px}#roomcards,#revealcards{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0;justify-content:center}.room{display:flex;align-items:center;gap:14px;text-transform:none;letter-spacing:.04em;background:#171224;border:1px solid var(--line);border-radius:14px;padding:16px 18px;font-size:19px;color:var(--text);position:relative;overflow:hidden}.room .ricon{font-size:30px;flex:none;width:40px;text-align:center}.room .rname{flex:1;text-align:left}.room .rpick{font-size:11px;color:var(--amber);letter-spacing:.14em;opacity:0;text-transform:uppercase}.room.picked{border-color:var(--amber);background:#241a30;box-shadow:0 0 24px #ffb34733,inset 0 0 30px #ffb3470d}.room.picked .rpick{opacity:1}.room:disabled{opacity:.55}.room.rv{cursor:default;flex-direction:column;align-items:flex-start;gap:8px;padding:13px 16px}.room.rv .rname{font-size:16px;color:var(--dim)}.room.rv .ricon{position:absolute;right:12px;top:10px;width:auto}.room.rv.haunted{border-color:var(--danger);background:#2a1220;animation:hauntflash .9s ease-out;box-shadow:0 0 34px #ff5b4d44,inset 0 0 40px #ff5b4d14}@keyframes hauntflash{0%{background:#5a1a2a;box-shadow:0 0 60px #ff5b4dcc}to{background:#2a1220}}.occs{display:flex;flex-wrap:wrap;gap:6px}.occ{font-size:12.5px;background:#0d0a14;border:1px solid var(--line);border-radius:16px;padding:3px 10px}.occ.hit{border-color:var(--danger);color:#ffb4a8}.occ.gone{opacity:.5;text-decoration:line-through}.occ.none{color:var(--dim);border-style:dashed}#hauntline{font-size:20px;text-align:center;color:var(--ghost);text-shadow:0 0 18px #9fe8dc44;padding-top:6px}#hauntline b{color:var(--danger)}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:10;padding:calc(var(--sat) + 10px) calc(var(--sar) + 10px) calc(var(--sab) + 10px) calc(var(--sal) + 10px);background:#0d0a14c9;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.overlay.soft{background:#0d0a1488;z-index:9}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px 28px;display:flex;flex-direction:column;gap:15px;align-items:center;min-width:300px;max-width:100%;max-height:100%;overflow-y:auto;box-shadow:0 0 50px #ffb34714}.title{font-size:34px;letter-spacing:.38em;color:var(--amber);padding-left:.38em;text-shadow:0 0 22px #ffb34788,0 0 70px #ffb34733;animation:flicker 5.2s infinite}.sub{font-size:11px;color:var(--dim);letter-spacing:.2em;text-transform:uppercase}input#nick{font-family:inherit;font-size:16px;text-align:center;letter-spacing:.06em;color:var(--text);background:#0d0a14;border:1px solid #4a3860;border-radius:8px;padding:12px 14px;width:230px;outline:none}input#nick:focus{border-color:var(--amber);box-shadow:0 0 14px #ffb34733}#roster{display:flex;flex-direction:column;gap:6px;width:100%;max-height:32vh;overflow-y:auto}.rrow{display:flex;align-items:center;gap:10px;font-size:14px;padding:8px 12px;background:#0d0a14;border:1px solid var(--line);border-radius:8px}.rrow .sg{font-size:17px}.rrow .wins{margin-left:auto;font-size:11px;color:var(--gold)}.rrow .hostb{font-size:9px;color:var(--ghost);letter-spacing:.16em;border:1px solid #2c4a44;border-radius:10px;padding:2px 7px}.legend{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.legend span{font-size:12px;background:#0d0a14;border:1px solid var(--line);border-radius:16px;padding:5px 11px}.hint{font-size:11px;color:var(--dim);text-align:center;line-height:1.85}#bigmsg{font-size:min(40px,8.4vw);letter-spacing:.16em;text-shadow:0 0 30px currentColor;text-align:center}#submsg{font-size:13.5px;color:var(--dim);letter-spacing:.08em;text-align:center;line-height:1.6}.hidden{display:none!important}#toast{position:fixed;bottom:calc(18px + var(--sab));left:50%;transform:translate(-50%);background:#241a30;border:1px solid #4a3860;max-width:90vw;color:var(--amber);font-size:12px;padding:9px 16px;border-radius:20px;z-index:20;letter-spacing:.04em;opacity:0;transition:opacity .3s;pointer-events:none;text-align:center}@media(max-width:640px){.title{font-size:26px}#logo{display:none}}@media(max-height:620px){.room{padding:10px 16px;font-size:16px}.room .ricon{font-size:22px}}
