:root{color-scheme:dark;--bg:#101522;--panel:#182132;--line:#2e3b50;--muted:#aab6c9;--text:#f1f3f7;--gold:#f3be60;--mint:#86d9ba;--danger:#ff8a8f}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 8% 30%,#25334855,transparent 50%),var(--bg);color:var(--text);font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100dvh}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#202d41;border-radius:10px;padding:12px 16px;transition:background .15s,border-color .15s,transform .15s}button:hover:not(:disabled){border-color:var(--gold);background:#2a3850}button:active:not(:disabled){transform:translateY(1px)}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:3px}header{padding:22px clamp(18px,4vw,64px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:20px;background:#101522d9}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--text);font-size:15px;font-weight:800;letter-spacing:2px;line-height:1.3}.brand small{display:block;font-size:12px;letter-spacing:3px;color:var(--muted);margin-top:3px}.brand-icon{display:grid;place-items:center;width:43px;height:43px;border:1px solid var(--gold);color:var(--gold);font:italic bold 30px Georgia;border-radius:12px}.header-actions{display:flex;align-items:center;gap:12px}.header-actions>span{font-size:14px;color:var(--muted)}.quiet{background:transparent}.primary,.gold{background:var(--gold);color:#172033;border-color:var(--gold);font-weight:750}.primary:hover:not(:disabled),.gold:hover:not(:disabled){background:#ffd58c;color:#172033}.danger{color:var(--danger);border-color:#80454e;background:#472a35}.danger:hover:not(:disabled){background:#633441}.danger.subtle{background:transparent}.full{width:100%}.muted{color:var(--muted)}.small,small{font-size:14px}h1,h2,h3,p{margin-top:0}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(36px,4vw,62px);font-weight:500;line-height:1.14;margin-bottom:24px;letter-spacing:-1px}h2{font-size:23px;line-height:1.3;margin-bottom:18px}h3{font-size:20px;margin-bottom:8px}.eyebrow{font-size:13px;font-weight:750;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:18px}main{max-width:1600px;margin:auto;padding:38px clamp(18px,4vw,64px) 48px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:24px}.start-screen{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(35px,6vw,100px);max-width:1200px;margin:25px auto;align-items:center}.intro h1{font-size:clamp(48px,5.5vw,78px)}h1 em{color:var(--gold);font-weight:400}.intro>p:not(.eyebrow){color:var(--muted);font-size:18px;line-height:1.7}.intro-stats{display:flex;gap:26px;margin:32px 0}.intro-stats span{color:var(--muted);font-size:14px}.intro-stats b{display:block;color:var(--text);font-size:26px;font-weight:550}.tip{border-left:3px solid var(--gold);padding:16px 20px;background:#f3be6009;color:var(--muted);border-radius:0 8px 8px 0;display:flex;gap:16px;align-items:center}.tip p{margin:0}.tip>span{font-size:28px}.setup{padding:28px}.setup .eyebrow{margin-bottom:10px}.characters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:25px 0}.character{padding:12px 4px;display:flex;flex-direction:column;align-items:center;gap:6px;background:#111b2b;min-width:0}.character span{font-size:30px}.character strong{font-size:13px;font-weight:550;overflow-wrap:anywhere}.character.selected{border:2px solid var(--gold);background:#f3be6012;padding:11px 3px}.divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:14px;margin:23px 0}.divider:before,.divider:after{content:"";height:1px;background:var(--line);flex:1}label{font-size:14px;display:block;margin-bottom:9px}.join-line{display:flex;gap:10px}.join-line input{min-width:0;width:100%;background:#111b2b;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:12px 15px;letter-spacing:4px;font-weight:650;text-transform:uppercase}.setup>.small{margin:16px 0 0;text-align:center}.lobby{display:grid;grid-template-columns:1fr 1fr;gap:60px;max-width:1200px;margin:35px auto;align-items:start}.room-code{font-family:ui-monospace,monospace;font-size:clamp(34px,5vw,54px);letter-spacing:7px;color:var(--gold);padding:15px 28px;background:#182132;border:1px dashed #6b6149;margin:5px 0 25px}.room-code small{display:block;color:var(--muted);font:14px system-ui;letter-spacing:0}.lobby-actions{display:flex;align-items:center;gap:12px;margin-bottom:18px}.lobby .tip{margin-top:25px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.panel-title h2{margin:0}.panel-title>span{font-size:14px;color:var(--muted)}.guests{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.guest{display:flex;align-items:center;flex-direction:column;text-align:center;padding:20px 10px;background:#111b2b;border-radius:12px;border:1px solid var(--line);gap:5px}.guest strong{font-size:16px}.guest small{color:var(--muted)}.face{font-size:30px;line-height:1.4}.game-top{display:flex;align-items:center;gap:25px;margin-bottom:26px}.game-top h1{font:600 27px system-ui;letter-spacing:0;margin:0}.game-top .eyebrow{font-size:12px;margin-bottom:6px}.team-progress{margin-left:auto;width:260px}.team-progress span{display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px;color:var(--muted)}progress{display:block;appearance:none;width:100%;height:9px;border:0;border-radius:20px;overflow:hidden;background:#2e3b50}progress::-webkit-progress-bar{background:#2e3b50}progress::-webkit-progress-value{background:var(--mint);border-radius:20px}progress::-moz-progress-bar{background:var(--mint)}.game-layout{display:grid;grid-template-columns:220px minmax(0,1fr) 275px;gap:20px;align-items:start}.player-panel{padding:20px 14px;align-self:stretch}.player-panel h2{font-size:18px}.player-panel .panel-title{display:block;padding:0 8px}.player-row{display:flex;gap:10px;align-items:center;border-radius:9px;padding:11px 8px;margin:4px 0}.player-row.self{background:#f3be6012;border:1px solid #f3be6040}.player-row strong{display:block;font-size:14px}.player-row small{display:block;font-size:12px;color:var(--muted)}.player-row.ghost{opacity:.65}.board-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.board-heading h2{margin:0}.board-heading span{font-size:14px;color:var(--muted)}.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px;background:#0b111d;border:1px solid var(--line);border-radius:18px}.room{min-height:155px;padding:15px 8px;display:flex;flex-direction:column;align-items:center;gap:5px;border:1px solid #334058;border-radius:10px;background:#1b273b;position:relative}.room:disabled{opacity:.65}.room.current{border:2px solid var(--gold);background:#3a3429;opacity:1;padding:14px 7px}.room.reachable{background:#20304a}.room-icon{font-size:29px}.room strong{font-size:15px}.room-detail{font-size:12px;color:var(--muted)}.tokens{display:flex;justify-content:center;flex-wrap:wrap;gap:3px;margin-top:auto;min-height:25px}.token{font-size:20px;width:27px;height:27px;background:#0c1425;border-radius:50%;display:grid;place-items:center}.token.mine{outline:2px solid var(--gold)}.board-help{color:var(--muted);font-size:14px;text-align:center;margin:12px 0 20px}.room-action{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px}.room-action p{margin-bottom:0;font-size:14px}.room-action .eyebrow{margin-bottom:7px;font-size:12px}.room-action button{flex-shrink:0}.right-panel{display:grid;gap:15px}.right-panel .panel{padding:20px}.right-panel h2{font-size:19px;margin-bottom:15px}.right-panel .eyebrow{font-size:12px;margin-bottom:8px}.tasks{display:grid;gap:8px}.task{display:flex;width:100%;text-align:left;gap:10px;padding:12px 6px;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;align-items:center}.task strong{display:block;font-size:14px;font-weight:600}.task small{display:block;font-size:12px;color:var(--muted)}.task-check{display:grid;place-items:center;min-width:25px;height:25px;border:1px solid #50617b;border-radius:50%;font-size:13px;color:var(--muted)}.task.complete{opacity:.7}.task.complete .task-check{border-color:var(--mint);color:var(--mint)}.task b{margin-left:auto;color:var(--gold)}.actions{display:flex;flex-direction:column;gap:10px}.actions h2{margin-bottom:0}.actions button{font-size:14px}.actions>small{color:var(--muted)}.journal p{font-size:13px;border-top:1px solid var(--line);padding-top:10px;margin-bottom:10px;color:var(--muted)}.alert{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:15px 22px;color:#ffd1d3;border:1px solid #c36269;background:#562836;border-radius:10px;margin-bottom:22px}.alarm .room.broken{border-color:var(--danger);background:#522e3c;opacity:1}.vote-screen,.ending{max-width:900px;margin:25px auto;text-align:center}.vote-screen>p,.ending>p{color:var(--muted)}.vote-time{display:inline-flex;align-items:center;gap:16px;padding:12px 28px;background:var(--panel);border:1px solid var(--line);border-radius:14px;margin:10px 0 18px;color:var(--gold)}.vote-time span{font-size:40px;font-variant-numeric:tabular-nums}.vote-time small{max-width:90px;text-align:left;line-height:1.3}.vote-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:25px 0}.vote-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 10px;background:var(--panel)}.vote-card>span{font-size:40px}.vote-card small{font-size:12px;color:var(--muted)}.vote-screen>.small{margin-top:20px}.ending .end-icon{font-size:70px;margin-bottom:20px}.reveal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:30px 0}.guest.traitor{border-color:var(--danger);background:#492c39}.guest.traitor small{color:var(--danger)}.ending>button{margin:5px}dialog{max-width:600px;width:calc(100% - 32px);max-height:90dvh;overflow:auto;background:#182132;color:var(--text);border:1px solid #4b5b73;border-radius:18px;padding:38px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#050916cc;backdrop-filter:blur(5px)}dialog h2{font-family:Georgia,serif;font-weight:400;font-size:32px}dialog p,dialog li{color:var(--muted)}dialog li{margin-bottom:12px}dialog ol{padding-left:20px}dialog .primary{width:100%;margin-top:15px}.close{position:absolute;right:10px;top:8px;border:0;background:transparent;font-size:27px;padding:0 10px;color:var(--muted)}.role-avatar{font-size:60px;text-align:center;margin:15px}.sequence{font-family:ui-monospace,monospace;font-size:42px;color:var(--gold);text-align:center;letter-spacing:8px;background:#101522;border-radius:10px;padding:15px}.typed{font-family:ui-monospace,monospace;display:block;text-align:center;font-size:27px;letter-spacing:8px;margin:20px 0}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:300px;margin:0 auto 15px}.keypad button{font-size:22px;padding:12px}.keypad button:last-child{grid-column:2}#erase{display:block;margin:auto}#toast{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%,20px);background:#f3be60;color:#172033;box-shadow:0 10px 40px #0008;padding:14px 22px;border-radius:12px;max-width:calc(100vw - 30px);width:max-content;text-align:center;z-index:999;opacity:0;pointer-events:none;transition:.2s;font-weight:600}#toast.show{opacity:1;transform:translate(-50%,0)}@media(min-width:1450px){.room{min-height:175px}}@media(max-width:1100px){.game-layout{grid-template-columns:175px minmax(0,1fr)}.right-panel{grid-column:1/-1;grid-template-columns:1fr 1fr 1fr}.header-actions>span{display:none}.start-screen{gap:35px}.character strong{font-size:12px}.room-action{flex-wrap:wrap}.game-top h1{font-size:23px}}@media(max-width:740px){header{padding:15px 18px}.header-actions{gap:7px}.header-actions button{font-size:12px;padding:8px}.brand{font-size:12px;letter-spacing:1px}.brand small{font-size:10px;letter-spacing:2px}.brand-icon{width:33px;height:33px;font-size:23px}main{padding:24px 16px 35px}.start-screen{display:block;margin:0 auto;max-width:520px}.intro h1{font-size:48px;margin-bottom:18px}.intro{margin-bottom:28px}.intro>p:not(.eyebrow){font-size:16px}.intro-stats{margin:22px 0;gap:30px}.intro .tip{display:none}.setup{padding:22px 18px}.characters{gap:8px}.character strong{font-size:12px}.lobby{grid-template-columns:1fr;gap:25px;margin:0}.game-top{flex-wrap:wrap;gap:12px}.game-top h1{font-size:22px}.team-progress{width:100%;margin-left:0}.game-top .quiet{margin-left:auto;font-size:13px}.game-layout{grid-template-columns:1fr}.player-panel{order:2;align-self:auto}.board-wrap{order:1}.right-panel{order:3;grid-template-columns:1fr}.player-panel{display:flex;flex-wrap:wrap;gap:6px}.player-panel .panel-title{width:100%;display:flex;margin-bottom:5px}.player-row{width:calc(50% - 4px);padding:5px;margin:0}.board{gap:7px;padding:9px}.room{min-height:137px;padding:10px 4px}.room.current{padding:9px 3px}.room strong{font-size:13px}.room-detail{font-size:11px}.board-heading span{font-size:12px}.board-heading h2{font-size:20px}.alert{flex-direction:column;align-items:flex-start;gap:2px;padding:12px 16px;font-size:14px}.vote-grid,.reveal{grid-template-columns:repeat(2,minmax(0,1fr))}.vote-screen h1,.ending h1{font-size:36px}.vote-card{padding:18px 10px}.vote-card strong{font-size:14px}.room-action{padding:16px}.room-action button{width:100%}dialog{padding:30px 22px}.sequence{letter-spacing:5px;font-size:35px}}@media(max-width:740px) and (orientation:landscape){.start-screen{display:grid;grid-template-columns:1fr 1fr;max-width:none;gap:24px}.intro h1{font-size:42px}.game-layout{grid-template-columns:150px minmax(0,1fr)}.player-panel{order:0;display:block;grid-column:1}.player-row{width:100%}.board-wrap{grid-column:2}.right-panel{grid-column:1/-1;grid-template-columns:1fr 1fr}.journal{grid-column:1/-1}.room{min-height:120px}.board-help{font-size:12px}.intro-stats{gap:16px}.game-top{flex-wrap:nowrap}.team-progress{width:200px;margin-left:auto}.character strong{font-size:11px}.characters{gap:5px}.setup{padding:17px}.character span{font-size:25px}.character{padding:7px 3px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
