:root{--pri: #7c3aed;--pri-d: #6d28d9;--pink: #ec4899;--ink: #2a1f45;--muted: #6b6390;--line: #e5e0f5;--good: #16a34a;--danger: #e5484d;--card: #ffffff;--bg: #f2eefc;font-family:Segoe UI,system-ui,-apple-system,Roboto,sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0}#root{min-height:100%}body{color:var(--ink);-webkit-font-smoothing:antialiased}.scLogo{display:block}.scApp{min-height:100dvh;display:flex;align-items:flex-start;justify-content:center;padding:20px 16px;background:linear-gradient(160deg,#ede9fe,#f6f2ff 55%,#fde9f5)}.scBoot{align-items:center}.scHome{width:100%;max-width:440px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px 20px;box-shadow:0 12px 40px #7c3aed24}.scTitle{margin:4px 0 0;font-size:clamp(28px,8vw,40px);font-weight:900;letter-spacing:1px;color:var(--pri-d)}.scTag{margin:2px 0 8px;color:var(--muted);font-size:14px;font-weight:600}.scUser{display:inline-flex;align-items:center;gap:10px;background:#f6f3ff;border:1px solid var(--line);border-radius:999px;padding:6px 16px 6px 6px;margin-bottom:4px}.scUserAv{width:34px;height:34px;border-radius:50%;object-fit:cover}.scFb{display:grid;place-items:center;background:var(--pri);color:#fff;font-weight:900}.scUserTxt{display:flex;flex-direction:column;line-height:1.2;text-align:left}.scUserTxt b{font-size:14px}.scUserTxt span{font-size:11px;color:var(--muted)}.scMenu{width:100%;display:flex;flex-direction:column;gap:10px}.scBtn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;border-radius:12px;padding:13px 18px;font-family:inherit;font-size:15px;font-weight:800;letter-spacing:.5px;transition:transform .05s,filter .12s}.scBtn:active{transform:translateY(1px)}.scBtn:disabled{filter:grayscale(.4) opacity(.55);cursor:not-allowed}.scPrimary{background:linear-gradient(180deg,var(--pri),var(--pri-d));color:#fff;box-shadow:0 4px #55199e}.scPrimary:hover{filter:brightness(1.05)}.scLight{background:#fff;color:var(--pri-d);border:2px solid var(--line)}.scLight:hover{background:#faf8ff}.scGhost{background:#f1edfb;color:var(--ink);border:1px solid var(--line)}.scGhost:hover{background:#e9e3fb}.scRow2{display:flex;gap:10px;width:100%}.scRow2 .scBtn{flex:1}.scCode{border:2px solid var(--line);background:#faf8ff;border-radius:12px;padding:14px;font-family:ui-monospace,monospace;font-size:24px;font-weight:900;letter-spacing:8px;text-align:center;color:var(--ink);text-transform:uppercase}.scCode:focus{outline:none;border-color:var(--pri)}.scHow{width:100%;text-align:left;background:#f6f3ff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-top:8px}.scHowTitle{color:var(--pri-d);font-size:13px;letter-spacing:2px}.scHow p{margin:8px 0 0;font-size:13px;color:#4a4270;line-height:1.45}.scCodeBox{display:flex;flex-direction:column;align-items:center;gap:2px;background:#f6f3ff;border:1px solid var(--line);border-radius:14px;padding:10px 22px}.scCodeBox span{font-size:10px;letter-spacing:2px;color:var(--muted);font-weight:800}.scCodeBox b{font-family:ui-monospace,monospace;font-size:30px;font-weight:900;letter-spacing:8px;color:var(--pri-d)}.scPlayers{width:100%;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.scChip{display:inline-flex;align-items:center;gap:8px;background:#f6f3ff;border:1px solid var(--line);border-radius:999px;padding:5px 14px 5px 5px;font-size:13px;font-weight:700}.scChipAv{width:26px;height:26px;border-radius:50%;object-fit:cover}.scChipAv.big{width:34px;height:34px}.scWait{color:var(--muted);font-size:14px}.scToast{position:fixed;z-index:30;bottom:20px;left:50%;transform:translate(-50%);background:var(--ink);color:#fff;padding:10px 18px;border-radius:999px;font-size:13px;font-weight:700}.scPlayApp{align-items:flex-start;padding:12px}.scPlayApp,.scPlayApp .scMain{width:100%}.scPlayApp>*{max-width:1000px;margin:0 auto}.scBar{width:100%;max-width:1000px;margin:0 auto 10px;display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 12px;box-shadow:0 4px 16px #7c3aed14}.scPill{font-size:12px;font-weight:800;background:#f1edfb;border:1px solid var(--line);border-radius:999px;padding:6px 12px;color:var(--muted);white-space:nowrap}.scPillBtn{cursor:pointer;color:var(--ink);margin-left:auto}.scPillBtn:hover{background:#e9e3fb}.scTimer{font-size:16px;font-weight:900;color:var(--pri-d);min-width:52px;text-align:center}.scTimer.danger{color:var(--danger)}.scWordBar{font-size:16px;font-weight:700;color:var(--ink);flex:1;text-align:center;overflow:hidden}.scWordBar b{color:var(--pri-d)}.scSlots{display:inline-flex;gap:5px;flex-wrap:wrap;justify-content:center}.scSlot{display:inline-grid;place-items:center;min-width:16px;height:22px;border-bottom:3px solid var(--pri);font-weight:900;font-size:16px;color:var(--pri-d)}.scSlotGap{width:12px}.scMain{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}.scStage{position:relative;flex:2 1 380px;min-width:300px}.scCanvasWrap{display:flex;flex-direction:column;gap:8px}.scCanvas{width:100%;aspect-ratio:640 / 430;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 26px #7c3aed24;touch-action:none}.scCanvas.drawable{cursor:crosshair}.scTools{display:flex;flex-direction:column;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px}.scSwatches{display:flex;flex-wrap:wrap;gap:6px}.scSwatch{width:28px;height:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}.scSwatch.on{outline:3px solid var(--pri);outline-offset:1px;transform:scale(1.12)}.scSizes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.scSize{width:34px;height:34px;border-radius:8px;background:#f1edfb;border:1px solid var(--line);display:grid;place-items:center;cursor:pointer}.scSize span{display:block;background:var(--ink);border-radius:50%}.scSize.on{background:var(--pri)}.scSize.on span{background:#fff}.scTool{min-width:34px;height:34px;border-radius:8px;background:#f1edfb;border:1px solid var(--line);cursor:pointer;font-size:15px}.scTool.on{background:var(--pri)}.scOverlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#2a1f458c;border-radius:14px;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.scChoose{background:var(--card);border-radius:16px;padding:22px;text-align:center;max-width:90%;box-shadow:0 12px 40px #0000004d}.scChoose h3{margin:0 0 14px;color:var(--ink)}.scChoose p{margin:8px 0 0;color:var(--muted)}.scChoices{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.scChoices .scBtn{text-transform:capitalize}.scSpinner{width:42px;height:42px;margin:0 auto;border-radius:50%;border:5px solid var(--line);border-top-color:var(--pri);animation:scSpin .9s linear infinite}@keyframes scSpin{to{transform:rotate(360deg)}}.scReveal{background:var(--card);border-radius:16px;padding:20px 24px;text-align:center;box-shadow:0 12px 40px #0000004d;min-width:240px}.scRevealWord{margin:0 0 12px;font-size:18px}.scRevealWord b{color:var(--pri-d);text-transform:capitalize}.scGains{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.scGainRow{display:flex;justify-content:space-between;gap:20px;font-size:14px}.scGainRow b.plus{color:var(--good)}.scDim{color:var(--muted);font-size:13px;margin:0}.scSide{flex:1 1 260px;min-width:240px;display:flex;flex-direction:column;gap:12px}.scScores{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:4px;max-height:190px;overflow-y:auto}.scScoreRow{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:8px;font-size:13px;font-weight:700}.scScoreRow.drawer{background:#f3ecff}.scScoreRow.guessed{background:#e9f9ef}.scScoreRow.off{opacity:.45}.scScoreName{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scScoreVal{color:var(--pri-d)}.scChat{background:var(--card);border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;height:300px;overflow:hidden}.scChatLines{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:5px}.scMsg{font-size:13px;line-height:1.35;word-break:break-word}.scMsg b{color:var(--pri-d)}.scMsg.sys{color:var(--muted);font-style:italic;text-align:center;font-size:12px}.scMsg.correct{color:var(--good);font-weight:800}.scChatInput{display:flex;gap:6px;padding:8px;border-top:1px solid var(--line)}.scChatInput input{flex:1;border:1px solid var(--line);border-radius:10px;padding:10px;font-family:inherit;font-size:14px;color:var(--ink)}.scChatInput input:focus{outline:none;border-color:var(--pri)}.scChatInput input:disabled{background:#f5f3fb;color:var(--muted)}.scSend{padding:10px 14px}.scTrophy{font-size:66px;line-height:1}.scBoard{width:100%;display:flex;flex-direction:column;gap:6px}.scBoardRow{display:flex;align-items:center;gap:10px;background:#f6f3ff;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-weight:700}.scBoardRow.first{background:linear-gradient(90deg,#fff7d6,#fef0f8);border-color:#f0d98a}.scRank{width:22px;font-weight:900;color:var(--pri-d)}.scBoardRow .scScoreName{text-align:left}.scBootInner{display:flex;flex-direction:column;align-items:center;gap:14px}.scLoadBar{width:200px;height:6px;border-radius:6px;background:var(--line);overflow:hidden}.scLoadBar span{display:block;height:100%;width:42%;border-radius:6px;background:var(--pri);animation:scSlide 1.1s ease-in-out infinite}@keyframes scSlide{0%{transform:translate(-120%)}to{transform:translate(320%)}}.scLoadTxt{color:var(--muted);font-size:13px;font-weight:600;margin:0}.scBootErr{color:var(--danger);font-weight:700;margin:0}.scBootCode{font-family:ui-monospace,monospace;font-size:11px;color:var(--danger);max-width:300px;word-break:break-word;text-align:center}