:root{--bg:#1a1b26;--surface:#24283b;--surface-hover:#2f3549;--text:#c0caf5;--text-muted:#787c99;--text-heading:#e8eaf6;--border:#3b4261;--red:#f7768e;--red-bg:#f7768e1f;--red-border:#f7768e66;--blue:#7aa2f7;--blue-bg:#7aa2f71f;--blue-border:#7aa2f766;--accent:#9ece6a;--accent-hover:#b4e08a;--radius:12px;--shadow:0 8px 32px #00000059;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Segoe UI,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.5}*,:before,:after{box-sizing:border-box}body{min-height:100svh;margin:0}#app{min-height:100svh}.container{max-width:900px;margin:0 auto;padding:2rem 1.25rem 3rem}.header{text-align:center;margin-bottom:2rem}.header h1{color:var(--text-heading);letter-spacing:-.02em;margin:0 0 .25rem;font-size:2.25rem;font-weight:700}.subtitle{color:var(--text-muted);margin:0;font-size:1rem}.input-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:2rem;padding:1.5rem}.label{color:var(--text-heading);margin-bottom:.5rem;font-weight:600;display:block}.names-input{border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text);font:inherit;resize:vertical;border-radius:8px;min-height:120px;padding:.875rem 1rem;transition:border-color .2s}.names-input:focus{border-color:var(--accent);outline:none}.names-input::placeholder{color:var(--text-muted)}.btn{font:inherit;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;transition:background .2s,transform .1s;display:inline-flex}.btn:active{transform:scale(.98)}.btn--primary{background:var(--accent);color:#1a1b26;width:100%;margin-top:1rem}.btn--primary:hover{background:var(--accent-hover)}.btn--secondary{background:var(--surface-hover);color:var(--text-heading);border:1px solid var(--border)}.btn--secondary:hover{background:var(--border)}.teams-section{animation:.3s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.teams-toolbar{justify-content:center;margin-bottom:1.25rem;display:flex}.teams-toolbar .btn--primary{width:auto;min-width:220px;margin-top:0}.teams-grid{grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:1.5rem;display:grid}@media (width<=640px){.teams-grid{grid-template-columns:1fr}}.team{border-radius:var(--radius);border:2px solid;padding:1.25rem}.team--red{background:var(--red-bg);border-color:var(--red-border)}.team--blue{background:var(--blue-bg);border-color:var(--blue-border)}.team-header{justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:1rem;display:flex}.team-title{margin:0 0 .25rem;font-size:1.125rem;font-weight:700}.team--red .team-title{color:var(--red)}.team--blue .team-title{color:var(--blue)}.team-count{color:var(--text-muted);margin:0;font-size:.875rem}.btn--team{white-space:nowrap;flex-shrink:0;padding:.5rem .75rem;font-size:.8rem}.btn--team-red{color:var(--red);border:1px solid var(--red-border);background:#f7768e33}.btn--team-red:hover:not(:disabled){background:#f7768e59}.btn--team-blue{color:var(--blue);border:1px solid var(--blue-border);background:#7aa2f733}.btn--team-blue:hover:not(:disabled){background:#7aa2f759}.btn:disabled{opacity:.45;cursor:not-allowed}.team-captain{color:var(--text-muted);margin:1rem 0 0;font-size:.875rem}.team-captain strong{color:var(--text-heading)}.team--red .team-captain strong{color:var(--red)}.team--blue .team-captain strong{color:var(--blue)}.team-captain--empty{font-style:italic}.add-player-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:1.25rem;padding:1.25rem 1.5rem}.section-title{color:var(--text-heading);margin:0 0 .75rem;font-size:1rem;font-weight:600}.add-player-row{flex-wrap:wrap;gap:.75rem;display:flex}.text-input,.team-select{border:1px solid var(--border);background:var(--bg);color:var(--text);font:inherit;border-radius:8px;padding:.625rem .875rem}.text-input{flex:180px;min-width:0}.text-input:focus,.team-select:focus{border-color:var(--accent);outline:none}.team-select{cursor:pointer;flex:none}@media (width<=640px){.team-header{flex-direction:column}.btn--team,.add-player-row .btn{width:100%}}.player-list{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.player-btn{width:100%;color:var(--text-heading);font:inherit;text-align:left;cursor:pointer;background:#0003;border:1px solid #0000;border-radius:8px;align-items:center;gap:.5rem;padding:.625rem .875rem;transition:background .15s,border-color .15s;display:flex}.player-btn:hover{background:#00000059}.player--captain .player-btn{border-color:currentColor;font-weight:600}.team--red .player--captain .player-btn{border-color:var(--red);color:var(--red);background:#f7768e33}.team--blue .player--captain .player-btn{border-color:var(--blue);color:var(--blue);background:#7aa2f733}.crown{font-size:1rem;line-height:1}.player-name{flex:1}.captain-label{text-transform:uppercase;letter-spacing:.05em;opacity:.85;font-size:.75rem}.empty{color:var(--text-muted);padding:.5rem;font-style:italic}.captain-controls{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.5rem}.hint{color:var(--text-muted);margin:0 0 1rem;font-size:.9rem}.captain-actions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.checkbox-label{cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text);align-items:center;gap:.625rem;font-size:.9rem;display:flex}.checkbox-label input[type=checkbox]{width:1.125rem;height:1.125rem;accent-color:var(--accent);cursor:pointer}.history{border-top:1px solid var(--border);color:var(--text-muted);margin:1rem 0 0;padding-top:1rem;font-size:.875rem}.history strong{color:var(--text);font-weight:500}.container--narrow{max-width:480px}.container--wide{max-width:720px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.5rem}.card--compact{margin-bottom:1.25rem;padding:1.25rem}.text-input--full{width:100%;margin-bottom:1rem}.text-input--num{flex:none;width:4rem}.divider{color:var(--text-muted);align-items:center;gap:1rem;margin:1.25rem 0;font-size:.875rem;display:flex}.divider:before,.divider:after{content:"";background:var(--border);flex:1;height:1px}.join-row{gap:.75rem;display:flex}.join-row .text-input{flex:1}.error-msg{color:var(--red);margin:0 0 1rem;font-size:.9rem}.error-msg--banner{border:1px solid var(--red-border);background:#f7768e1f;border-radius:8px;padding:.75rem 1rem}.lobby-code{color:var(--accent);font-family:ui-monospace,monospace}.header--lobby,.header--game{text-align:left;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.header-actions{flex-wrap:wrap;flex-shrink:0;gap:.5rem;display:flex}.invite-hint{color:var(--text-muted);background:#9ece6a1a;border:1px solid #9ece6a59;border-radius:8px;margin:0 0 1rem;padding:.75rem 1rem;font-size:.9rem}.invite-hint strong{color:var(--accent);font-family:ui-monospace,monospace}.chips{flex-wrap:wrap;gap:.5rem;display:flex}.player-chip{border:1px solid var(--border);color:var(--text-heading);font:inherit;cursor:pointer;background:#0003;border-radius:999px;align-items:center;padding:.5rem .875rem;font-size:.9rem;display:inline-flex}.player-chip--static{cursor:default}.player-chip--red{border-color:var(--red-border);background:var(--red-bg);color:var(--red)}.player-chip--blue{border-color:var(--blue-border);background:var(--blue-bg);color:var(--blue)}.player-chip--offline{opacity:.5}.hint--small{margin:0 0 .75rem;font-size:.8rem}.hint--center{text-align:center}.waiting-msg{text-align:center;color:var(--text-muted);margin-bottom:1.25rem}.btn--accent{background:var(--accent);color:#1a1b26}.btn--accent:hover{background:var(--accent-hover)}.btn--small{padding:.5rem .875rem;font-size:.85rem}.btn--ghost{color:var(--text-muted);background:0 0;border:none;margin-top:.75rem}.btn--danger{color:var(--red);border:1px solid var(--red-border);background:#f7768e26}.btn--danger:hover{background:#f7768e4d}.btn[hidden]{display:none}.lobby-host .teams-toolbar{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-bottom:1.25rem;display:flex}.lobby-host .teams-toolbar .btn{width:auto;margin-top:0}.team-assign{margin-top:.75rem}.modal{z-index:100;background:#0009;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal.hidden{display:none}.modal__box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:center;width:100%;max-width:360px;padding:1.5rem}.modal__box h3{color:var(--text-heading);margin:0 0 .5rem}.assign-name{color:var(--accent);margin-bottom:1rem;font-weight:600}.modal__actions{flex-direction:column;gap:.5rem;display:flex}.modal__actions .btn{width:100%}.modal__actions .btn:disabled{opacity:.35;cursor:not-allowed}.score-bar{justify-content:space-between;margin-bottom:1rem;font-weight:600;display:flex}.score--red{color:var(--red)}.score--blue{color:var(--blue)}.game-banner{text-align:center;border-radius:8px;margin-bottom:1rem;padding:.75rem 1rem;font-weight:600}.game-banner--red{background:var(--red-bg);color:var(--red);border:1px solid var(--red-border)}.game-banner--blue{background:var(--blue-bg);color:var(--blue);border:1px solid var(--blue-border)}.game-banner--win{color:var(--accent);background:#9ece6a26;border:1px solid #9ece6a66}.clue-display{text-align:center;color:var(--text-muted);margin-bottom:1rem}.clue-display strong{color:var(--text-heading)}.clue-form{margin-bottom:1rem}.clue-row{flex-wrap:wrap;gap:.75rem;display:flex}.clue-row .text-input{flex:120px}.turn-actions{justify-content:center;margin-bottom:1rem;display:flex}.board{grid-template-columns:repeat(5,1fr);gap:.5rem;display:grid}.cell{aspect-ratio:1.6;border:2px solid var(--border);background:var(--surface);color:var(--text-heading);font:inherit;cursor:default;word-break:break-word;border-radius:8px;padding:.25rem;font-size:clamp(.65rem,2.5vw,.9rem);font-weight:600;transition:transform .1s,border-color .15s}.cell--clickable:not(:disabled){cursor:pointer}.cell--clickable:not(:disabled):hover{border-color:var(--accent);transform:scale(1.03)}.cell--spy.cell--red{color:#fff;background:#8b2635;border-color:#c0392b}.cell--spy.cell--blue{color:#fff;background:#2c5282;border-color:#3182ce}.cell--spy.cell--neutral{color:#fff;background:#6b5b45;border-color:#8b7355}.cell--spy.cell--assassin{color:#fff;background:#1a1a1a;border-color:#333}.cell--revealed.cell--red{background:var(--red);border-color:var(--red);color:#fff;opacity:.85}.cell--revealed.cell--blue{background:var(--blue);border-color:var(--blue);color:#fff;opacity:.85}.cell--revealed.cell--neutral{color:#fff;opacity:.85;background:#8b7355;border-color:#a08b6d}.cell--revealed.cell--assassin{color:#fff;background:#000;border-color:#333}@media (width<=480px){.board{gap:.35rem}.clue-row .btn,.lobby-host .teams-toolbar .btn{width:100%}}