:root{color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;--bg: #1d1a26;--panel: #282435;--panel-2: #322d42;--text: #f0ead8;--muted: #9a93ad;--accent: #d8b04a;--danger: #d06a5a;--noble: #c9a227;--religious: #4a7fd6;--trade: #3fa66a;--military: #c0504d;--special: #9a5fd0}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text)}button{font:inherit;background:var(--panel-2);color:var(--text);border:1px solid #4a4460;border-radius:8px;padding:8px 14px;cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);color:#241f10;font-weight:600;border-color:var(--accent)}button.link{background:none;border:none;color:var(--muted);text-decoration:underline}button.toggled{border-color:var(--accent);box-shadow:0 0 0 2px #d8b04a59}input,select{font:inherit;background:var(--panel-2);color:var(--text);border:1px solid #4a4460;border-radius:8px;padding:8px 10px}.muted{color:var(--muted)}.badge{background:#d8b04a26;border:1px solid rgba(216,176,74,.4);border-radius:999px;padding:1px 10px;font-size:.85em}.gold-badge{color:var(--accent);font-weight:600}.error-text{color:var(--danger)}main.splash,main.home,main.lobby,main.scores{max-width:560px;margin:0 auto;padding:48px 24px;text-align:center}h1{font-size:2.4rem;margin:0 0 8px}.home-form{display:flex;flex-direction:column;gap:10px;margin:24px 0;text-align:left}.home-form label{display:flex;flex-direction:column;gap:6px}.home-divider{color:var(--muted);margin:16px 0}.invite-code{font-size:2.6rem;letter-spacing:.35em;font-weight:700;color:var(--accent);margin:12px 0}.player-list{margin:20px 0;display:flex;flex-direction:column;gap:6px;text-align:left}.player-row{display:flex;align-items:center;gap:10px;background:var(--panel);border-radius:8px;padding:10px 14px}.player-num{color:var(--muted);min-width:1.4em}.dot{width:10px;height:10px;border-radius:50%;margin-left:auto}.dot-on{background:#58c472}.dot-off{background:#6a6478}.lobby-bots{justify-content:center}.bot-remove{padding:2px 10px;border-color:var(--danger);color:var(--danger);margin-left:auto;min-width:2em}.game{display:flex;flex-direction:column;height:100vh;height:100dvh}.game-header{display:flex;align-items:center;gap:16px;padding:8px 16px;background:var(--panel);border-bottom:1px solid #3d3750;flex-wrap:wrap}.game-title{font-weight:700;color:var(--accent)}.char-track{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}.game-body{display:flex;flex:1;min-height:0}.game-main{flex:1;display:flex;flex-direction:column;min-width:0}.opponents{padding:12px 16px;display:flex;flex-direction:column;gap:10px;overflow-y:auto;flex:1}.opponent{background:var(--panel);border-radius:10px;padding:10px 12px}.opponent.destroyable{border:1px dashed var(--danger)}.opponent-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}.center{padding:16px;border-top:1px solid #3d3750;min-height:140px;position:relative;z-index:30}.turn-status{font-size:1.1rem;margin-bottom:10px}.prompt{background:var(--panel);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px}.actions{display:flex;flex-direction:column;gap:10px}.actions-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.log-panel{width:280px;background:var(--panel);border-left:1px solid #3d3750;padding:12px;display:flex;flex-direction:column;min-height:0}.log-panel h4{margin:0 0 8px}.log-list{overflow-y:auto;font-size:.9em;display:flex;flex-direction:column;gap:4px}.log-entry{padding:4px 8px;background:#ffffff08;border-radius:6px}.log-secret{border-left:2px solid var(--accent)}.me-panel{border-top:1px solid #3d3750;background:var(--panel);padding:10px 16px;display:flex;flex-direction:column;gap:8px}.me-info{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.me-toggle{display:none;padding:4px 10px;font-size:.85em;margin-left:auto}.city,.hand-row,.char-grid{display:flex;flex-wrap:wrap;gap:6px}.card-wrap{position:relative;flex:1 0 auto;min-width:92px;max-width:120px;display:flex}.city .card-wrap{min-width:60px;max-width:78px}.hand-row .card-wrap,.prompt .card-wrap{min-width:88px;max-width:110px}.card{position:relative;width:100%;aspect-ratio:3 / 4;border:1px solid #4a4460;border-top:4px solid var(--muted);border-radius:10px;background:linear-gradient(180deg,#322d42,#262138 60%,#211c30);display:flex;flex-direction:column;padding:0;overflow:hidden}.card-noble{border-top-color:var(--noble)}.card-religious{border-top-color:var(--religious)}.card-trade{border-top-color:var(--trade)}.card-military{border-top-color:var(--military)}.card-special{border-top-color:var(--special);background:linear-gradient(180deg,#3a2f4a,#2c2340 60%,#241d35)}.card-art{flex:1;display:grid;place-items:center;padding:8px 6px 2px;min-height:0;color:var(--muted)}.card-art svg{width:84%;height:84%;max-height:100%;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}.card-noble .card-art{color:var(--noble)}.card-religious .card-art{color:var(--religious)}.card-trade .card-art{color:var(--trade)}.card-military .card-art{color:var(--military)}.card-special .card-art{color:var(--special)}.card-name{font-size:.72em;line-height:1.15;text-align:center;padding:4px 4px 6px;background:#00000047;min-height:2.4em;display:flex;align-items:center;justify-content:center}.card-blocked{opacity:.55;filter:grayscale(.5);cursor:help}.card-blocked .card-cost{color:var(--danger)}.card-clickable:hover{outline:2px solid var(--accent)}.card-selected{outline:2px solid var(--accent);box-shadow:0 0 0 3px #d8b04a4d}.card-cost{position:absolute;top:2px;left:6px;font-size:.8em;color:var(--accent);font-weight:700}.card-help{position:absolute;right:3px;bottom:3px;width:18px;height:18px;border-radius:50%;border:1px solid var(--accent);color:var(--accent);background:#17141ff2;font-size:12px;font-weight:700;line-height:16px;text-align:center;cursor:help;-webkit-user-select:none;user-select:none;z-index:5}.card-popup{display:none;position:fixed;bottom:auto;top:auto;right:auto;width:240px;max-width:min(240px,calc(100vw - 16px));background:#17141f;border:1px solid var(--accent);border-radius:8px;padding:8px 10px;font-size:.85em;line-height:1.35;text-align:left;color:var(--text);box-shadow:0 4px 16px #00000080;pointer-events:none;z-index:400}.card-help:hover .card-popup,.card-help:focus .card-popup{display:block}.popup-line{display:block}.popup-hint{display:block;margin-top:4px;color:var(--danger)}.card-name{font-size:.85em;text-align:center;line-height:1.2}.char-chip{border:1px solid #4a4460;border-radius:8px;background:var(--panel-2);padding:6px 10px;display:inline-flex;gap:8px;align-items:center;font-size:.9em}.char-wrap{position:relative;display:inline-flex;align-items:center}.char-card-wrap{position:relative;display:inline-flex}.char-grid .char-card-wrap{min-width:86px;max-width:108px}.char-card{position:relative;width:100%;aspect-ratio:3 / 4;border:1px solid #4a4460;border-top:4px solid #4a4460;border-radius:10px;background:linear-gradient(180deg,#322d42,#262138);display:flex;flex-direction:column;padding:0;overflow:hidden}.char-card .card-art{padding-top:10px}.char-card .card-name{min-height:2.4em}.char-card .card-cost{left:5px}.char-card-assassin{border-top-color:#c46a5a}.char-card-assassin .card-art{color:#c46a5a}.char-card-thief{border-top-color:#9aa74a}.char-card-thief .card-art{color:#9aa74a}.char-card-magician{border-top-color:var(--special)}.char-card-magician .card-art{color:var(--special)}.char-card-king{border-top-color:var(--noble)}.char-card-king .card-art{color:var(--noble)}.char-card-bishop{border-top-color:var(--religious)}.char-card-bishop .card-art{color:var(--religious)}.char-card-merchant{border-top-color:var(--trade)}.char-card-merchant .card-art{color:var(--trade)}.char-card-architect{border-top-color:#d8956a}.char-card-architect .card-art{color:#d8956a}.char-card-warlord{border-top-color:var(--military)}.char-card-warlord .card-art{color:var(--military)}.char-card-state-available{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.char-card-state-active{border-color:var(--accent);box-shadow:0 0 0 2px #d8b04a59}.char-card-state-murdered{border-color:var(--danger)}.char-card-state-out{opacity:.35}.char-card-state-out .card-name{text-decoration:line-through}.char-card-state-called{opacity:.6}.char-card-state{position:absolute;top:6px;left:50%;transform:translate(-50%);font-size:.68em;padding:1px 8px;border-radius:999px;background:#0000008c;white-space:nowrap}.char-wrap .card-help{position:static;flex:none;width:16px;height:16px;line-height:14px;font-size:11px}.char-rank{color:var(--muted);font-size:.8em}.char-clickable:hover,.char-available{border-color:var(--accent)}.char-out{opacity:.35;text-decoration:line-through}.char-called{opacity:.6}.char-murdered{border-color:var(--danger);opacity:.8}.char-active{border-color:var(--accent);box-shadow:0 0 0 2px #d8b04a4d}.char-state{font-size:.75em;color:var(--muted)}.timer-chip{background:var(--panel-2);border:1px solid #4a4460;border-radius:999px;padding:4px 12px;font-variant-numeric:tabular-nums;white-space:nowrap}.timer-low{border-color:var(--danger);color:var(--danger);font-weight:700}.timer-paused{border-color:var(--accent);color:var(--accent)}.scores-table{margin:20px auto;border-collapse:collapse}.scores-table th,.scores-table td{padding:8px 14px;border-bottom:1px solid #3d3750;text-align:center}.scores-table th{color:var(--muted);font-weight:500}.scores-table tr.winner td{color:var(--accent);font-weight:600}.fatal-bar{position:fixed;top:0;left:0;right:0;background:#5a2d28;padding:10px 16px;display:flex;gap:12px;align-items:center;justify-content:center;z-index:100}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:#5a2d28;border:1px solid var(--danger);border-radius:10px;padding:10px 18px;cursor:pointer;z-index:100;max-width:80vw}@media(max-width:800px){.game{height:auto;min-height:100dvh}.game-body{display:block}.opponents{overflow-y:visible;flex:none}.center{min-height:0;border-top:none}.game-main{padding-bottom:300px}.game-main:has(.me-panel.me-collapsed){padding-bottom:60px}.me-panel .hand-row{max-height:44dvh;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}.me-panel .city{max-height:22dvh;overflow-x:auto;flex-wrap:nowrap}.me-panel{position:sticky;bottom:0;border-top:1px solid #4a4460;box-shadow:0 -4px 12px #00000059;padding:8px 10px;background:var(--panel)}.me-panel.me-collapsed{padding:6px 10px}.me-panel.me-collapsed .city,.me-panel.me-collapsed .hand-row,.me-panel.me-collapsed .hand-hint{display:none}.me-toggle{display:inline-flex}.log-panel{display:none}.card-wrap{min-width:64px;max-width:84px}.hand-row .card-wrap,.prompt .card-wrap{min-width:78px;max-width:100px}.game-header{gap:8px;padding:6px 10px}.char-track{order:10;width:100%;margin-left:0;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.char-track::-webkit-scrollbar{display:none}.char-track .char-chip{flex:none;padding:4px 7px;font-size:.8em}.char-track .card-help{display:none}.timer-chip{padding:3px 9px;font-size:.85em}.opponents{padding:8px 10px;gap:8px}.opponent-head{flex-wrap:wrap;gap:6px 10px;font-size:.9em}.city .card-wrap{min-width:52px;max-width:66px}.center{padding:10px}.actions-row{gap:6px}.actions-row button{padding:7px 10px;font-size:.9em}.actions-row select{max-width:140px}.char-grid .char-card-wrap{min-width:74px;max-width:96px}.me-panel{padding:8px 10px}.me-info{gap:8px;font-size:.9em}.rules-modal{width:100vw;height:100vh;height:100dvh;max-width:100vw;border-radius:0}.rules-content{padding:12px 14px}.scores-table th,.scores-table td{padding:6px;font-size:.85em}main.home,main.lobby,main.scores{padding:24px 14px}}.rules-overlay{position:fixed;inset:0;background:#0009;display:grid;place-items:center;z-index:300;padding:24px}.rules-modal{background:var(--panel);border:1px solid #4a4460;border-radius:12px;width:min(960px,94vw);height:min(640px,88vh);display:flex;flex-direction:column;overflow:hidden}.rules-header{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-bottom:1px solid #3d3750}.rules-header h2{margin:0;font-size:1.2rem}.rules-body{display:flex;flex:1;min-height:0}.rules-toc{width:220px;border-right:1px solid #3d3750;padding:12px 8px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;flex:none}.toc-item{text-align:left;background:none;border:none;border-left:2px solid transparent;color:var(--muted);padding:5px 10px;border-radius:0 6px 6px 0;font-size:.88em;cursor:pointer}.toc-item:hover{color:var(--text)}.toc-l3{padding-left:22px;font-size:.82em}.toc-active{color:var(--accent);border-left-color:var(--accent)}.rules-content{flex:1;overflow-y:auto;padding:16px 24px;line-height:1.55}.rules-content h1{font-size:1.4rem;margin:0 0 12px}.rules-content h2{font-size:1.15rem;margin:20px 0 8px;color:var(--accent)}.rules-content h3{font-size:1rem;margin:14px 0 6px}.rules-content table{border-collapse:collapse;margin:8px 0}.rules-content th,.rules-content td{border:1px solid #3d3750;padding:4px 12px}.rules-content ul{padding-left:20px}@media(max-width:800px){.rules-body{flex-direction:column}.rules-toc{width:100%;flex:none;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;border-right:none;border-bottom:1px solid #3d3750;padding:8px 10px;gap:6px;order:-1;scrollbar-width:none}.rules-toc::-webkit-scrollbar{display:none}.toc-item{flex:none;white-space:nowrap;border-left:none;border:1px solid #4a4460;border-radius:999px;padding:4px 12px}.toc-active{border-color:var(--accent);color:var(--accent)}}
