:root{--ivory:#fffaf2;--blush:#f4c6d0;--rose:#d86a8a;--gold:#d4af37;--plum:#3b1f3a;--ink:#241824;--good:#5ec27a;--bad:#ff5a5a;--info:#7ab8ff;--panel:#241824c7;--serif:Georgia, "Times New Roman", serif;--sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ivory);font-family:var(--sans);background:#1b1220;margin:0;overflow:hidden}#app,#viewport{position:fixed;inset:0}#viewport canvas{display:block}#vignette{pointer-events:none;opacity:0;background:radial-gradient(at 50% 55%,#0000 18%,#000008eb 62%);transition:opacity .6s;position:fixed;inset:0}.hidden{display:none!important}button{font:inherit;cursor:pointer;background:var(--gold);color:var(--ink);border:0;border-radius:10px;padding:10px 16px;font-weight:700;transition:transform 80ms,filter .15s}button:hover{filter:brightness(1.08)}button:active{transform:translateY(1px)}button.secondary{color:var(--ivory);background:#ffffff1f}button.rose{background:var(--rose);color:#fff}button:disabled{opacity:.45;cursor:default}input,select{font:inherit;color:var(--ivory);background:#ffffff14;border:1px solid #ffffff40;border-radius:10px;padding:10px 12px}input::placeholder{color:#fffaf273}#overlay{pointer-events:none;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#overlay>*{pointer-events:auto}.lobby{background:linear-gradient(160deg,#3b1f3af2,#241824f5);border:1px solid #d4af3759;border-radius:22px;width:min(560px,100vw - 32px);max-height:calc(100vh - 32px);padding:28px;overflow:auto;box-shadow:0 30px 80px #00000080}.lobby h1{font-family:var(--serif);color:var(--blush);letter-spacing:1px;text-align:center;margin:0;font-size:46px}.lobby h1 span{color:var(--gold)}.lobby .tag{text-align:center;color:#fffaf2b3;margin:4px 0 20px;font-style:italic}.lobby .row{flex-wrap:wrap;gap:10px;margin:10px 0;display:flex}.lobby .row>*{flex:auto}.lobby .code{font-family:var(--serif);letter-spacing:10px;text-align:center;color:var(--gold);margin:6px 0 2px;font-size:52px}.lobby .hint{color:#fffaf299;text-align:center;font-size:13px}.lobby ul{margin:14px 0;padding:0;list-style:none}.lobby li{background:#ffffff0f;border-radius:10px;align-items:center;gap:10px;margin:6px 0;padding:8px 12px;display:flex}.lobby li .dot{border-radius:50%;width:14px;height:14px}.lobby li .bot{opacity:.7;margin-left:auto;font-size:12px}.lobby details{color:#fffaf2d9;margin-top:16px;font-size:14px}.lobby details summary{cursor:pointer;color:var(--gold)}.lobby kbd,.prompt kbd,.help kbd{background:var(--ivory);min-width:22px;color:var(--ink);text-align:center;border-radius:5px;padding:1px 6px;font-size:12px;font-weight:700;display:inline-block;box-shadow:0 2px #00000059}#hud{pointer-events:none;font-size:14px;position:fixed;inset:0}.panel{background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid #ffffff14;border-radius:14px;padding:10px 14px}.vibe{width:min(320px,42vw);position:absolute;top:14px;left:14px}.vibe .label{letter-spacing:1px;color:var(--blush);justify-content:space-between;font-size:12px;font-weight:700;display:flex}.vibe .bar{background:#ffffff1a;border-radius:8px;height:16px;margin-top:6px;overflow:hidden}.vibe .fill{background:linear-gradient(90deg,#ff4d6d,#f7b267,#f4c6d0,#d4af37);border-radius:8px;width:100%;height:100%;transition:width .25s}.vibe.danger .fill{animation:.6s infinite alternate pulse}.vibe .drain{color:var(--bad);font-weight:700}@keyframes pulse{0%{filter:brightness()}to{filter:brightness(1.7)}}.phase{text-align:center;min-width:280px;position:absolute;top:14px;left:50%;transform:translate(-50%)}.phase .pills{letter-spacing:1px;justify-content:center;gap:6px;font-size:11px;display:flex}.phase .pill{color:#fffaf28c;background:#ffffff14;border-radius:99px;padding:3px 9px}.phase .pill.on{background:var(--gold);color:var(--ink);font-weight:700}.phase .pill.done{text-decoration:line-through}.phase .clock{font-family:var(--serif);color:var(--ivory);margin-top:2px;font-size:34px}.phase .goal{color:var(--blush);font-size:13px}.phase .moment{color:var(--gold);margin-top:2px;font-weight:700}.toasts{flex-direction:column;gap:6px;width:min(340px,40vw);display:flex;position:absolute;top:14px;right:64px}.toast{background:var(--panel);border-left:4px solid var(--info);border-radius:10px;padding:8px 12px;font-size:13px;animation:.25s ease-out slidein}.toast.bad{border-left-color:var(--bad)}.toast.good{border-left-color:var(--good)}.toast.fade{opacity:0;transition:opacity .8s}@keyframes slidein{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:none}}.status{flex-direction:column;gap:6px;width:min(300px,44vw);display:flex;position:absolute;bottom:14px;left:14px}.status .chips{flex-wrap:wrap;gap:5px;display:flex}.chip{background:#ffffff1a;border-radius:99px;padding:3px 8px;font-size:12px}.chip.ok{background:#5ec27a40}.chip.off{background:#ff5a5a59}.role{letter-spacing:1px;font-weight:700}.role .secret{opacity:.55;font-weight:400}.meter{background:#ffffff1f;border-radius:4px;height:8px;margin-top:4px;overflow:hidden}.meter>div{background:#9fdcff;height:100%}.prompt{text-align:center;font-size:16px;font-weight:600;position:absolute;bottom:70px;left:50%;transform:translate(-50%)}.prompt .prog{background:#ffffff26;border-radius:3px;height:6px;margin-top:6px;overflow:hidden}.prompt .prog>div{background:var(--gold);height:100%}.minimap{background:var(--panel);border-radius:14px;padding:6px;position:absolute;bottom:14px;right:14px}.minimap canvas{width:190px;height:190px;display:block}.reveal{text-align:center;border:2px solid var(--gold);background:#140c16eb;border-radius:20px;max-width:min(520px,100vw - 32px);padding:26px 34px;animation:.4s ease-out pop;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.reveal h2{font-family:var(--serif);margin:6px 0;font-size:38px}.reveal p{color:#fffaf2d9}@keyframes pop{0%{opacity:0;transform:translate(-50%,-50%)scale(.7)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}.taped{text-align:center;font-family:var(--serif);color:#c0c6cc;text-shadow:0 3px 10px #000;font-size:34px;position:absolute;top:38%;left:50%;transform:translate(-50%)}.help{text-align:center;max-width:calc(100vw - 32px);font-size:13px;line-height:1.9;position:absolute;bottom:120px;left:50%;transform:translate(-50%)}.gauge{width:110px;height:110px;position:absolute;bottom:120px;right:220px}.debug{white-space:pre;max-width:300px;font:11px/1.35 ui-monospace,monospace;position:absolute;top:76px;left:14px;overflow:hidden}.end{text-align:center;background:linear-gradient(160deg,#3b1f3af5,#1c121ef7);border:1px solid #d4af3766;border-radius:22px;width:min(720px,100vw - 32px);max-height:calc(100vh - 32px);padding:28px;overflow:auto}.end h2{font-family:var(--serif);margin:0;font-size:42px}.end .win-loyal{color:var(--gold)}.end .win-crasher{color:var(--bad)}.end table{border-collapse:collapse;width:100%;margin:16px 0}.end td{text-align:left;border-bottom:1px solid #ffffff14;padding:7px}.end .awards{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;margin:12px 0 18px;display:grid}.end .award{background:#ffffff12;border-radius:12px;padding:10px;font-size:13px}.end .award b{color:var(--gold);margin-top:2px;font-size:15px;display:block}.rolechip{border-radius:99px;padding:2px 9px;font-size:12px;font-weight:700}#toasts{pointer-events:none;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.err{color:#fff;background:#8a2236;border-radius:10px;margin-top:6px;padding:10px 16px;box-shadow:0 6px 20px #0006}@media (width<=1100px){.vibe{width:230px}.phase{min-width:220px}.phase .clock{font-size:26px}.toasts{width:260px}}@media (width<=720px){.minimap,.gauge{display:none}.phase{top:64px}.toasts{top:150px}}