:root{--bg: #0b0b0f;--bg-elev: #14141c;--bg-elev-2: #1c1c26;--border: #2a2a36;--text: #ece9f0;--muted: #8b8795;--accent: #b81d24;--accent-hot: #e23b43;--ok: #37c871;--off: #6b6675;--radius: 14px;--shadow: 0 10px 40px rgba(0, 0, 0, .5);color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 600px at 50% -10%,#1a1020 0%,transparent 60%),radial-gradient(800px 500px at 100% 100%,#10141e 0%,transparent 55%),var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Tahoma,Noto Sans Arabic,sans-serif;-webkit-font-smoothing:antialiased}.app{min-height:100%;display:flex;flex-direction:column;max-width:920px;margin:0 auto;padding:0 16px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 4px}.brand{display:flex;align-items:center;gap:10px}.brand-mark{font-size:24px;filter:drop-shadow(0 2px 6px rgba(184,29,36,.5))}.brand-name{font-size:22px;font-weight:800;letter-spacing:.5px}.conn{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--muted);background:var(--bg-elev);border:1px solid var(--border);padding:5px 11px;border-radius:999px}.conn .dot{width:8px;height:8px;border-radius:50%;background:var(--off)}.conn.on .dot{background:var(--ok);box-shadow:0 0 8px var(--ok)}.stage{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:12px 0 28px}.card{width:100%;max-width:440px;background:linear-gradient(180deg,var(--bg-elev) 0%,var(--bg-elev-2) 100%);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px 24px;margin-top:24px}.card h1{margin:0 0 6px;font-size:26px}.card h2{margin:0 0 18px;font-size:22px}.muted{color:var(--muted)}.center{text-align:center}.field{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:16px;padding:13px 14px;outline:none;transition:border-color .15s,box-shadow .15s}.field:focus{border-color:var(--accent);box-shadow:0 0 0 3px #b81d2433}.field.mono{font-family:ui-monospace,SF Mono,Menlo,monospace;letter-spacing:3px;text-align:center;font-size:20px}.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--bg-elev-2);border:1px solid var(--border);color:var(--text);font-size:16px;font-weight:600;padding:12px 18px;border-radius:10px;cursor:pointer;transition:transform .08s,background .15s,border-color .15s,opacity .15s}.btn:hover:not(:disabled){border-color:#3a3a48}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:linear-gradient(180deg,var(--accent-hot),var(--accent));border-color:var(--accent);color:#fff;box-shadow:0 6px 18px #b81d2459}.btn.primary:hover:not(:disabled){filter:brightness(1.07)}.btn.big{width:100%;padding:15px;font-size:17px}.btn.ghost{background:transparent;border-color:transparent;color:var(--muted);padding:8px 12px}.btn.ghost:hover{color:var(--text)}form{display:flex;flex-direction:column;gap:12px;margin:16px 0 0}.divider{display:flex;align-items:center;gap:12px;color:var(--muted);margin:20px 0}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--border)}.join{flex-direction:row}.join .field{flex:1}.room{width:100%}.room-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}.code{display:inline-flex;align-items:center;gap:10px;background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;padding:8px 14px;cursor:pointer}.code:hover{border-color:var(--accent)}.code-label{color:var(--muted);font-size:12px}.code-val{font-size:22px;font-weight:800;letter-spacing:4px;color:var(--accent-hot)}.code-copy{font-size:12px;color:var(--muted);border-right:1px solid var(--border);padding-right:10px}.mono{font-family:ui-monospace,SF Mono,Menlo,monospace}.room-body{display:grid;grid-template-columns:240px 1fr;gap:16px;margin-top:16px;align-items:start}.players{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.players h3{margin:0 0 12px;font-size:15px;color:var(--muted);font-weight:700}.players ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.players li{display:flex;align-items:center;gap:9px;font-size:15px}.players li.offline{opacity:.5}.pdot{width:8px;height:8px;border-radius:50%;background:var(--off);flex:none}.pdot.on{background:var(--ok);box-shadow:0 0 7px var(--ok)}.pname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tag{font-size:11px;padding:2px 7px;border-radius:999px;font-weight:700}.tag.host{background:#b81d242e;color:var(--accent-hot);border:1px solid rgba(184,29,36,.4)}.tag.you{background:#37c87124;color:var(--ok);border:1px solid rgba(55,200,113,.35)}.chat{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-direction:column;height:440px;overflow:hidden}.messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}.msg{display:flex;flex-direction:column;gap:2px;max-width:80%;align-self:flex-start}.msg.mine{align-self:flex-end;align-items:flex-end}.msg-name{font-size:12px;color:var(--muted)}.msg-text{background:var(--bg-elev-2);border:1px solid var(--border);padding:8px 12px;border-radius:12px;font-size:15px;line-height:1.4;word-break:break-word}.msg.mine .msg-text{background:linear-gradient(180deg,var(--accent-hot),var(--accent));border-color:var(--accent);color:#fff}.chat-input{flex-direction:row;gap:10px;padding:12px;margin:0;border-top:1px solid var(--border);background:var(--bg-elev-2)}.chat-input .field{flex:1}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);background:var(--accent);color:#fff;font-weight:600;padding:11px 20px;border-radius:999px;box-shadow:var(--shadow);animation:rise .2s ease;z-index:10}@keyframes rise{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media (max-width: 640px){.room-body{grid-template-columns:1fr}.players{order:2}.chat{order:1;height:40vh}.code-val{font-size:19px}}.game{width:100%;max-width:560px;margin:8px auto 0;display:flex;flex-direction:column;gap:14px}.game-head{display:flex;align-items:center;justify-content:space-between}.phase-badge{font-weight:800;font-size:16px;padding:8px 16px;border-radius:999px;border:1px solid var(--border);background:var(--bg-elev)}.phase-night{background:linear-gradient(180deg,#11162a,#0d1020);border-color:#273057;color:#aab6ff}.phase-day{background:linear-gradient(180deg,#2a2412,#201c10);border-color:#55492a;color:#ffdf9e}.phase-voting{background:linear-gradient(180deg,#2a1113,#200d0f);border-color:#5a2a2e;color:#ff9ea4}.phase-ended{background:var(--bg-elev-2)}.btn.small{padding:7px 12px;font-size:14px}.t-town{--team: #37c871}.t-mafia{--team: var(--accent-hot)}.t-neutral{--team: #b78bff}.role-card{background:var(--bg-elev);border:1px solid var(--border);border-right:4px solid var(--team, var(--border));border-radius:12px;padding:14px 16px}.role-top{display:flex;align-items:baseline;gap:10px}.role-name{font-size:20px;font-weight:800;color:var(--team)}.role-team{font-size:13px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:2px 9px}.role-desc{margin:8px 0 0;color:var(--text);font-size:14px;line-height:1.5}.role-allies{margin:8px 0 0;font-size:14px;color:var(--accent-hot)}.role-invest{margin:8px 0 0;font-size:14px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:8px 10px}.announce{background:var(--bg-elev-2);border:1px solid var(--border);border-radius:10px;padding:10px 14px;font-size:14px;display:flex;flex-direction:column;gap:4px}.panel{background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px}.panel-title{margin:0;font-size:17px;font-weight:700}.small{font-size:13px}.targets{display:flex;flex-wrap:wrap;gap:8px}.target{flex:1 1 45%;display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--bg);border:1px solid var(--border);color:var(--text);padding:11px 14px;border-radius:10px;cursor:pointer;font-size:15px;transition:border-color .12s,background .12s}.target:hover{border-color:var(--accent)}.target.vote.picked{border-color:var(--accent-hot);background:#b81d242e}.vcount{background:var(--accent);color:#fff;border-radius:999px;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}.btn.ghost.picked{color:var(--accent-hot)}.pstrip{display:flex;flex-wrap:wrap;gap:8px}.pchip{display:inline-flex;align-items:center;gap:6px;background:var(--bg-elev);border:1px solid var(--border);border-radius:999px;padding:5px 12px;font-size:14px}.pchip.dead{opacity:.5;text-decoration:line-through}.pchip-tag{font-size:12px}.pchip-tag.you{color:var(--ok)}.gchat{background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;height:240px;overflow:hidden}.gmessages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}.start{width:100%;margin-top:14px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b8;display:flex;align-items:center;justify-content:center;padding:20px;z-index:20;animation:rise .2s ease}.end-card{background:linear-gradient(180deg,var(--bg-elev),var(--bg-elev-2));border:1px solid var(--border);border-radius:16px;padding:24px;width:100%;max-width:420px;box-shadow:var(--shadow)}.end-card h2{margin:0 0 16px;text-align:center;font-size:26px;color:var(--team, var(--text))}.reveal{display:flex;flex-direction:column;gap:6px;max-height:50vh;overflow-y:auto}.reveal-row{display:flex;align-items:center;justify-content:space-between;background:var(--bg);border:1px solid var(--border);border-right:3px solid var(--team, var(--border));border-radius:8px;padding:9px 12px;font-size:14px}.reveal-role{color:var(--muted)}.end-actions{display:flex;gap:10px;margin-top:18px}.end-actions .btn{flex:1}@media (max-width: 640px){.target{flex-basis:100%}}.settings{margin-top:16px;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.settings h3{margin:0 0 10px;font-size:17px}.stot{font-size:14px;color:var(--muted);margin-bottom:12px;padding:6px 10px;background:var(--bg);border:1px solid var(--border);border-radius:8px}.stot.bad{color:#fff;background:var(--accent);border-color:var(--accent)}.srole-group{margin-bottom:12px}.srole-team{font-size:13px;font-weight:700;color:var(--muted);margin:8px 0 6px}.srole{display:flex;align-items:center;justify-content:space-between;padding:6px 4px;border-bottom:1px solid rgba(255,255,255,.04)}.srole-name{font-size:15px}.stepper{display:inline-flex;align-items:center;gap:10px}.stepper button{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:var(--bg-elev-2);color:var(--text);font-size:18px;cursor:pointer;line-height:1}.stepper button:hover:not(:disabled){border-color:var(--accent)}.stepper button:disabled{opacity:.35;cursor:not-allowed}.stepper-n{min-width:20px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}.srules{display:flex;flex-direction:column;gap:10px;margin:14px 0;padding-top:12px;border-top:1px solid var(--border)}.srule{display:flex;align-items:center;gap:8px;font-size:14px;justify-content:space-between}.srule select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:14px}.srule input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}.swarn{font-size:13px;color:#ffcf6b;background:#b878141f;border:1px solid rgba(184,120,20,.3);border-radius:8px;padding:7px 11px;margin-bottom:8px}.countdown{color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}.rolelist{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;background:var(--bg-elev);border:1px solid var(--border);border-radius:10px;padding:8px 12px}.rolelist-h{color:var(--muted);font-weight:700}.rolelist-item{background:var(--bg-elev-2);border:1px solid var(--border);border-radius:999px;padding:2px 9px}.tiles-wrap{display:flex;flex-direction:column;gap:10px}.layout-switch{display:flex;flex-wrap:wrap;gap:6px}.chip{background:var(--bg-elev);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer}.chip:hover{color:var(--text);border-color:#3a3a48}.chip.on{background:#b81d242e;color:var(--accent-hot);border-color:var(--accent)}.tile{background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}.tile.dead{opacity:.55}.tile-media{position:relative;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 35%,#20202c,#121219)}.tile-avatar{font-size:28px;font-weight:800;color:var(--muted)}.tile.lg .tile-avatar{font-size:56px}.tile.sm .tile-avatar{font-size:20px}.tile-skull{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:34px;background:#00000073}.tile-name{display:flex;align-items:center;gap:6px;padding:6px 8px;font-size:13px;border-top:1px solid var(--border)}.tile-nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile-badge{font-size:10px;padding:1px 6px;border-radius:999px;font-weight:700}.tile-badge.host{background:#b81d242e;color:var(--accent-hot)}.tile-badge.you{background:#37c87124;color:var(--ok)}.tiles.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}.tiles.compact{display:flex;flex-wrap:wrap;gap:8px}.tiles.compact .tile{flex-direction:row;align-items:center;width:calc(50% - 4px)}.tiles.compact .tile-media{width:40px;aspect-ratio:1;flex:none}.tiles.compact .tile-name{border-top:none;border-right:1px solid var(--border);flex:1}.tiles.cinematic{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px}.tiles.cinematic .tile{box-shadow:0 10px 30px #0009;border-color:#1a1a24}.tiles.cinematic .tile-media{background:radial-gradient(circle at 50% 30%,#2a1016,#0a0a10)}.tiles.speaker{display:flex;flex-direction:column;gap:10px}.speaker-main .tile{max-width:260px;margin:0 auto}.speaker-rest{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.speaker-rest .tile{width:84px}.tiles.circle{position:relative;width:100%;aspect-ratio:1 / 1;max-width:360px;margin:0 auto}.tiles.circle:before{content:"🎭";position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:40px;opacity:.25}.circle-slot{position:absolute;transform:translate(-50%,-50%);width:74px}.circle-slot .tile-media{aspect-ratio:1}.audiobar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 2px}.audio-join{background:#37c87124;border-color:#37c87166;color:var(--ok)}.audio-toggle.live{background:#37c87129;border-color:#37c87173;color:var(--ok)}.audio-toggle.muted{background:#b81d2429;border-color:#b81d2473;color:var(--accent-hot)}.audio-count{font-size:12px;color:var(--muted)}.audio-err{font-size:12px;color:var(--accent-hot)}.tile-mic{position:absolute;bottom:5px;inset-inline-start:5px;font-size:13px;line-height:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.8))}.tile.speaking{border-color:var(--ok);box-shadow:0 0 0 2px var(--ok),0 0 14px #37c87180}.tile.speaking .tile-media{background:radial-gradient(circle at 50% 35%,#15301f,#0a1410)}.tile-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;background:#0a0a10}.app.in-game{max-width:980px;padding:0 10px}.app.in-game .topbar{display:none}.app.in-game .stage{padding:0}.focus{width:100%;height:100vh;height:100dvh;display:flex;flex-direction:column;gap:8px;padding:calc(env(safe-area-inset-top,0px) + 8px) 0 calc(env(safe-area-inset-bottom,0px) + 8px);overflow:hidden}.ico{display:inline-block;width:1.25em;height:1.25em;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;flex:none}.hud{display:flex;align-items:center;gap:8px;flex:none}.hud-phase{flex:1;display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:800;font-size:15px;padding:8px 14px;border-radius:999px;border:1px solid var(--border);background:var(--bg-elev);min-width:0}.hud-phase>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hud-timer{display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums;color:var(--text);font-weight:700}.hud-timer.low{color:var(--accent-hot)}.hud-skip{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--border);background:var(--bg-elev);color:var(--text);font-size:16px;cursor:pointer}.hud-skip:hover{border-color:var(--accent)}.secret{flex:none;background:var(--bg-elev);border:1px solid var(--border);border-right:4px solid var(--team, var(--border));border-radius:12px;overflow:hidden}.secret-chip{width:100%;display:flex;align-items:center;gap:8px;background:none;border:none;color:var(--text);font-size:14px;padding:8px 12px;cursor:pointer;text-align:start}.secret-chip b{color:var(--team, var(--text));font-size:16px}.secret-caret{margin-inline-start:auto;color:var(--muted);font-size:10px}.secret-dot{width:8px;height:8px;border-radius:50%;background:var(--accent-hot);box-shadow:0 0 6px var(--accent-hot)}.secret-body{padding:0 10px 10px}.secret-body .role-card{border:none;padding:4px 4px 0;background:none}.secret-text{margin:0;font-size:13px;color:var(--muted);line-height:1.5}.role-name-inline{color:var(--team)}.flash{flex:none;font-size:14px;text-align:center;background:var(--bg-elev-2);border:1px solid var(--border);border-radius:10px;padding:7px 12px;animation:rise .2s ease}.focus-tiles{flex:1;min-height:0;overflow-y:auto}.focus .tiles-wrap{height:100%}.focus .tiles.grid{height:100%;min-height:240px;grid-template-columns:repeat(var(--cols, 3),1fr);grid-auto-rows:1fr;gap:8px}.focus .tiles.grid .tile{min-height:0;position:relative}.focus .tiles.grid .tile-media{aspect-ratio:auto;flex:1;min-height:0}.focus .tiles.grid .tile-name{position:absolute;inset:auto 0 0 0;border-top:none;background:linear-gradient(0deg,rgba(0,0,0,.75),transparent);padding:14px 8px 6px}.focus .tile-avatar{font-size:36px}.tile.pickable{cursor:pointer;border-style:dashed;border-color:#e23b4399}.tile.pickable:hover{border-color:var(--accent)}.tile.picked{border-color:var(--accent-hot);box-shadow:0 0 0 2px var(--accent-hot),0 0 16px #e23b4373}.tile.ring-turn{border-color:var(--ok);box-shadow:0 0 0 2px var(--ok),0 0 18px #37c87173}.tile.ring-target{border-color:#e0b44a;box-shadow:0 0 0 2px #e0b44a}.tile.ring-ally{border-color:#e23b43b3}.tile.ring-accused{border-color:var(--accent-hot);box-shadow:0 0 0 2px var(--accent-hot),0 0 18px #e23b4380}.tile-badge-corner{position:absolute;top:6px;inset-inline-end:6px;z-index:2;font-size:13px;font-weight:800;background:#0009;border-radius:999px;padding:2px 7px}.tile-badge-corner .vcount{margin:-2px -7px}.tile-overlay{position:absolute;inset:6px 6px auto 6px;z-index:1;display:flex;justify-content:center;pointer-events:none}.wcard{display:flex;align-items:center;gap:6px;max-width:100%;background:#0b0b0fd1;border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:5px 10px;box-shadow:0 4px 14px #00000080}.wcard-emoji{font-size:20px;line-height:1}.wcard-name{font-weight:800;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wcard.mine{color:var(--muted);font-weight:700;font-size:13px;border-style:dashed}.action{flex:none;background:var(--bg-elev);border:1px solid var(--border);border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:8px}.action-title{font-size:15px;font-weight:700;line-height:1.45}.action.night{border-color:#273057;background:linear-gradient(180deg,#11162a,#0d1020)}.action.day{border-color:#3a3424}.action.vote{border-color:#5a2a2e;background:linear-gradient(180deg,#1c1013,#14100f)}.action.muted{color:var(--muted)}.action-row{display:flex;flex-wrap:wrap;gap:8px}.action-row .btn{flex:1 1 auto}.guess-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.ans{font-size:13px;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--bg);border:1px solid var(--border)}.ans.yes{color:var(--ok)}.ans.no{color:var(--accent-hot)}.ans.maybe{color:#e0b44a}.ans-btn.on.yes{background:#37c87133;border-color:var(--ok)}.ans-btn.on.no{background:#e23b4333;border-color:var(--accent-hot)}.ans-btn.on.maybe{background:#e0b44a33;border-color:#e0b44a}.dock{flex:none;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.dock-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:50px;height:50px;padding:0 14px;border-radius:999px;border:1px solid var(--border);background:var(--bg-elev-2);color:var(--text);font-size:20px;cursor:pointer}.dock-btn span{font-size:14px;font-weight:700}.dock-btn.on{color:var(--ok);border-color:#37c87173;background:#37c8711f}.dock-btn.off{color:var(--accent-hot);border-color:#b81d2480;background:#b81d2424}.dock-btn.join{color:var(--ok);border-color:#37c87173}.dock-badge{position:absolute;top:-3px;inset-inline-end:-3px;min-width:20px;height:20px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px!important;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}.dock-err{font-size:12px;color:var(--accent-hot);width:100%;text-align:center}.drawer-back{position:fixed;top:0;right:0;bottom:0;left:0;z-index:15;background:#0000008c;display:flex;align-items:flex-end;justify-content:center;animation:rise .15s ease}.drawer{width:100%;max-width:640px;max-height:78vh;display:flex;flex-direction:column;gap:10px;background:linear-gradient(180deg,var(--bg-elev),var(--bg-elev-2));border:1px solid var(--border);border-bottom:none;border-radius:18px 18px 0 0;padding:12px 14px calc(env(safe-area-inset-bottom,0px) + 12px)}.drawer-head{display:flex;align-items:center;justify-content:space-between;font-weight:800}.drawer-x{background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer}.drawer-h{margin:0;font-size:13px;color:var(--muted);font-weight:700}.dchat{display:flex;flex-direction:column;height:60vh;background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;overflow:hidden}.gpick{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;margin-top:12px}.gpick-item{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;background:var(--bg-elev);border:1px solid var(--border);border-radius:14px;padding:12px 8px;color:var(--text);cursor:pointer}.gpick-item:disabled{opacity:.4;cursor:default}.gpick-item.on{border-color:var(--accent);background:#b81d2424;box-shadow:0 0 0 1px var(--accent)}.gpick-icon{font-size:26px}.gpick-name{font-weight:800;font-size:15px}.gpick-desc{font-size:11px;color:var(--muted);line-height:1.4}@media (max-width: 520px){.gpick-desc{display:none}}.topbar-end{display:flex;align-items:center;gap:8px}.dock-btn.compact{min-width:36px;height:36px;padding:0 8px;font-size:16px}.t-blue{--team: #2f6fe0;color:#6f9cff}.team-banner{flex:none;font-size:13px;padding:6px 12px;border-radius:10px;background:var(--bg-elev);border:1px solid var(--border);border-right:4px solid var(--tc)}.team-banner.t0{--tc: #e23b43}.team-banner.t1{--tc: #2f6fe0}.team-dot{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle}.team-dot.t0{background:#e23b43;box-shadow:0 0 6px #e23b43}.team-dot.t1{background:#2f6fe0;box-shadow:0 0 6px #2f6fe0}.score{font-variant-numeric:tabular-nums;font-weight:800}.score-big{display:flex;justify-content:center;align-items:center;gap:14px;font-size:30px;font-weight:900;margin:0 0 14px;font-variant-numeric:tabular-nums}.score-big .t0{color:#ff7a80}.score-big .t1{color:#6f9cff}.choose{display:flex;flex-direction:column;gap:8px}.choose-form{padding:0;border:none;background:none}.srule.col{flex-direction:column;align-items:stretch}.focus .tiles.speaker{height:100%;display:flex;flex-direction:column;gap:8px}.focus .speaker-main{flex:1;min-height:0;display:flex}.focus .speaker-main .tile{max-width:none;width:100%;height:100%;margin:0;position:relative}.focus .speaker-main .tile-media{aspect-ratio:auto;flex:1;min-height:0}.focus .speaker-main .tile-name{position:absolute;inset:auto 0 0 0;border-top:none;background:linear-gradient(0deg,rgba(0,0,0,.75),transparent);padding:14px 10px 8px;font-size:15px}.focus .speaker-main .tile-avatar{font-size:64px}.focus .speaker-rest{flex:none;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:2px}.focus .speaker-rest .tile{width:78px;flex:none}.focus-tiles.with-board{display:flex;flex-direction:column;gap:8px}.focus-tiles.with-board .tiles-wrap{height:auto;flex:none}.focus-tiles.with-board .tiles.grid{height:auto;min-height:0;display:flex;gap:6px;overflow-x:auto}.focus-tiles.with-board .tiles.grid .tile{width:70px;flex:none}.focus-tiles.with-board .tiles.grid .tile-media{aspect-ratio:1}.focus-tiles.with-board .tile-name{font-size:11px;padding:10px 4px 3px}.focus-tiles.with-board .tile-avatar{font-size:22px}.board{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}.board-canvas{width:100%;max-width:min(100%,62vh);aspect-ratio:1;border-radius:14px;background:#f4f1ea;box-shadow:0 6px 24px #00000080;touch-action:none}.board-canvas.can-draw{cursor:crosshair;box-shadow:0 0 0 2px var(--ok),0 6px 24px #00000080}.board-tools{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:center}.swatch{width:26px;height:26px;border-radius:50%;border:2px solid var(--border);cursor:pointer;padding:0}.swatch.on{border-color:var(--text);box-shadow:0 0 0 2px var(--accent)}.swatch.eraser{background-image:linear-gradient(135deg,transparent 45%,#b9b2a3 45%,#b9b2a3 55%,transparent 55%)!important}.wbtn,.tbtn{width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:var(--bg-elev-2);color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px}.wbtn span{display:block;border-radius:50%;background:var(--text)}.wbtn.on{border-color:var(--accent)}.tools-sep{width:1px;height:22px;background:var(--border)}.tpick{margin-top:12px;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:10px}.tpick-head{display:flex;align-items:center;justify-content:space-between}.tpick-head h3{margin:0;font-size:16px}.tpick-cols{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tpick-col{background:var(--bg);border:1px solid var(--border);border-top:3px solid var(--tc);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:110px}.tpick-col.t0{--tc: #e23b43}.tpick-col.t1{--tc: #2f6fe0}.tpick-title{font-weight:800;font-size:14px;display:flex;align-items:center;gap:6px}.tpick-list{display:flex;flex-wrap:wrap;gap:6px}.tchip{display:inline-flex;align-items:center;gap:5px;background:var(--bg-elev-2);border:1px solid var(--border);color:var(--text);border-radius:999px;padding:5px 10px;font-size:13px}.tchip.tap{cursor:pointer}.tchip.tap:hover{border-color:var(--accent)}.tchip:disabled{opacity:1;cursor:default}.tchip.me{border-color:#37c87180}.tchip-you{font-size:10px;color:var(--ok);font-weight:700}.tchip-move{font-size:11px;color:var(--muted)}.tjoin{margin-top:auto}.tpick-rest{display:flex;flex-direction:column;gap:6px;padding-top:8px;border-top:1px dashed var(--border)}