:root{--bg: #14142b;--bg-2: #1c1c3c;--panel: #232350;--panel-2: #2c2c63;--line: #3a3a78;--text: #eceafd;--muted: #a2a0d0;--accent: #7c6cff;--accent-2: #56d2a4;--danger: #ff6b6b;--gold: #ffd166;--radius: 14px;--shadow: 0 10px 30px rgba(0, 0, 0, .35)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 600px at 20% -10%,#2b2b6b 0%,var(--bg) 55%) fixed;color:var(--text);font-family:Segoe UI,Inter,system-ui,-apple-system,sans-serif;font-size:15px;overscroll-behavior:none}button{font:inherit;color:inherit;border:none;background:none;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}input,select,textarea{font:inherit;color:var(--text);background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:9px 12px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--accent)}input:disabled,select:disabled,textarea:disabled{opacity:.6}.muted{color:var(--muted)}.primary,.accent,.ghost{border-radius:10px;padding:10px 16px;font-weight:600;transition:transform .08s ease,filter .15s ease}.primary{background:var(--accent);color:#fff}.accent{background:var(--accent-2);color:#08221a}.ghost{background:var(--panel-2);border:1px solid var(--line)}.ghost.danger{color:var(--danger)}.primary:hover:not(:disabled),.accent:hover:not(:disabled),.ghost:hover:not(:disabled){filter:brightness(1.1)}.primary:active:not(:disabled),.accent:active:not(:disabled){transform:translateY(1px)}.small{padding:6px 11px;font-size:13px}.wide{width:100%}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.home{max-width:520px;margin:0 auto;padding:40px 16px 60px;display:flex;flex-direction:column;gap:18px}.home-title{text-align:center}.home-title h1{margin:0;font-size:54px;letter-spacing:-1px;background:linear-gradient(100deg,#fff,var(--accent) 40%,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.home-title p{margin:6px 0 0;color:var(--muted)}.home-card{display:flex;flex-direction:column;gap:18px}.field{display:flex;flex-direction:column;gap:6px}.field>span{font-size:13px;color:var(--muted)}.avatar-picker{display:flex;gap:18px;align-items:center}.avatar-stage{display:grid;place-items:center;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:12px}.avatar-controls{display:flex;flex-direction:column;gap:8px;flex:1}.stepper{display:grid;grid-template-columns:34px 1fr 34px;align-items:center;background:var(--bg-2);border:1px solid var(--line);border-radius:10px;overflow:hidden}.stepper span{text-align:center;font-size:13px;color:var(--muted)}.stepper button{padding:6px 0;font-size:20px;line-height:1}.stepper button:hover{background:var(--panel-2)}.home-actions{display:flex;flex-direction:column;gap:12px}.join-row{display:flex;gap:10px}.code-input{flex:1;text-transform:uppercase;letter-spacing:5px;font-weight:700;text-align:center}.or{text-align:center;color:var(--muted);font-size:12px}.notice{margin:0;padding:9px 12px;border-radius:10px;background:#ff6b6b24;color:#ffbcbc;font-size:14px}.rules{padding:14px 20px}.rules summary{cursor:pointer;color:var(--muted)}.rules ol{margin:10px 0 0;padding-left:20px;color:var(--muted);line-height:1.6}.game{height:100%;display:flex;flex-direction:column;padding:10px;gap:10px}.topbar{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:8px 14px}.timer{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:var(--bg-2);border:2px solid var(--accent);font-weight:700;font-size:18px}.timer[data-low=true]{border-color:var(--danger);color:var(--danger);animation:pulse 1s infinite}@keyframes pulse{50%{transform:scale(1.08)}}.round{font-weight:600;color:var(--muted);white-space:nowrap}.word{text-align:center;display:flex;flex-direction:column;gap:2px;min-width:0}.word-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.word-letters{font-size:22px;font-weight:700;letter-spacing:3px;font-family:Consolas,ui-monospace,monospace;word-break:break-word}.word-count{font-size:11px;color:var(--muted)}.room-meta{display:flex;align-items:center;gap:8px}.code-chip{background:var(--bg-2);border:1px dashed var(--line);border-radius:10px;padding:7px 12px;letter-spacing:2px}.code-chip b{font-size:16px}.code-chip .muted{letter-spacing:0;font-size:11px}.banner{background:#ffd16626;color:var(--gold);border-radius:10px;padding:6px 12px;text-align:center;font-size:13px}.layout{flex:1;min-height:0;display:grid;grid-template-columns:230px minmax(0,1fr) 290px;gap:10px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);display:flex;flex-direction:column;min-height:0;overflow:hidden}.panel-title{margin:0;padding:10px 14px;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);border-bottom:1px solid var(--line)}.players ul{list-style:none;margin:0;padding:6px;overflow-y:auto}.player{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:10px}.player+.player{margin-top:2px}.player:nth-child(odd){background:#ffffff08}.player.guessed{background:#56d2a429}.player.offline{opacity:.5}.rank{font-size:12px;color:var(--muted);width:20px}.player-info{display:flex;flex-direction:column;min-width:0;flex:1}.player-name{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-name em{color:var(--muted);font-size:12px;font-style:normal}.player-score{font-size:12px;color:var(--muted)}.delta{color:var(--accent-2);margin-left:6px}.tag{margin-left:4px;font-size:11px}.player-flags{display:flex;align-items:center;gap:4px;font-size:13px}.kick{color:var(--muted);font-size:12px;padding:2px 5px;border-radius:6px;opacity:0}.player:hover .kick{opacity:1}.kick:hover{background:#ff6b6b33;color:var(--danger)}.stage{min-width:0;display:flex}.board-wrap{flex:1;display:flex;flex-direction:column;gap:8px;min-width:0}.canvas-frame{position:relative;flex:1;min-height:0;display:grid;place-items:center;border-radius:var(--radius);overflow:hidden}.canvas{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);width:100%;height:auto;max-width:100%;max-height:100%;touch-action:none;cursor:not-allowed}.canvas.drawable{cursor:crosshair}.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:8px 10px}.palette{display:grid;grid-template-columns:repeat(12,22px);grid-template-rows:repeat(2,22px);grid-auto-flow:column;gap:2px}.swatch{width:22px;height:22px;border-radius:4px;border:1px solid rgba(0,0,0,.3)}.swatch.active{outline:2px solid var(--text);outline-offset:1px;z-index:1}.tools{display:flex;gap:10px}.tool-group{display:flex;gap:4px;background:var(--bg-2);border-radius:10px;padding:3px}.tool{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;font-size:16px}.tool:hover{background:var(--panel-2)}.tool.active{background:var(--accent)}.tool.size span{display:block;background:var(--text);border-radius:50%}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0c0c20b8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border-radius:var(--radius);overflow-y:auto;padding:12px}.choice-card,.lobby-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 26px;text-align:center;max-width:460px;width:100%}.choice-card h2,.lobby-card h2{margin:0 0 14px;font-size:20px}.reveal{color:var(--accent-2)}.choices{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.choice{background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:12px 18px;font-weight:600;font-size:16px}.choice:hover{background:var(--accent);border-color:var(--accent)}.deltas{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:6px}.deltas li{display:flex;align-items:center;gap:8px;justify-content:center}.deltas b{color:var(--accent-2)}.podium{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:8px}.podium li{display:flex;align-items:center;gap:10px;background:var(--bg-2);border-radius:10px;padding:8px 12px}.podium .place-1{background:#ffd1662e;border:1px solid var(--gold)}.podium-name{flex:1;text-align:left;font-weight:600}.medal{width:28px}.podium-actions{display:flex;gap:10px;justify-content:center}.lobby-overlay{align-items:start}.lobby-card{display:flex;flex-direction:column;gap:14px;text-align:left;max-width:520px}.lobby-card h2{text-align:center;margin:0}.lobby-hint{margin:0;color:var(--muted);font-size:13px;text-align:center}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}.setting{display:flex;flex-direction:column;gap:4px}.setting>span{font-size:12px;color:var(--muted)}.checkbox{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.checkbox input{width:16px;height:16px}.checkbox.disabled{opacity:.6}.waiting{text-align:center;color:var(--muted);margin:0}.chat-list{flex:1;overflow-y:auto;padding:8px 10px;display:flex;flex-direction:column;gap:3px;font-size:14px;line-height:1.4}.msg{padding:3px 6px;border-radius:6px;word-break:break-word}.msg:nth-child(odd){background:#ffffff08}.msg.system{color:var(--muted);font-style:italic}.msg.join{color:var(--accent-2);font-style:italic}.msg.leave{color:var(--muted);font-style:italic}.msg.correct{background:#56d2a433;color:var(--accent-2);font-weight:600}.msg.close{background:#ffd16629;color:var(--gold)}.msg.guessed-only{background:#7c6cff29;color:#cfc6ff}.chat-input{display:flex;gap:6px;padding:8px;border-top:1px solid var(--line)}.chat-input input{flex:1}.chat-input button{padding:0 14px;background:var(--accent);border-radius:10px;color:#fff}@media(max-width:1000px){.layout{grid-template-columns:190px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 220px}.stage{grid-column:2;grid-row:1}.players{grid-column:1;grid-row:1}.chat{grid-column:1 / -1;grid-row:2}}@media(max-width:700px){.topbar{grid-template-columns:auto 1fr;row-gap:6px}.word{grid-column:1 / -1;order:3}.room-meta{justify-content:flex-end}.layout{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) 200px}.players{grid-column:1;grid-row:1;max-height:120px}.players ul{display:flex;overflow-x:auto}.player{min-width:150px}.stage{grid-column:1;grid-row:2}.chat{grid-column:1;grid-row:3}.palette{grid-template-columns:repeat(12,18px);grid-template-rows:repeat(2,18px)}.swatch{width:18px;height:18px}}