.draw-cover{overflow:hidden;background:#f4eee0;color:#1d3155}.draw-cover:before{content:"";position:absolute;inset:0;background:linear-gradient(#2d5b9b18 1px,transparent 1px),linear-gradient(90deg,#2d5b9b18 1px,transparent 1px);background-size:24px 24px;transform:rotate(-3deg) scale(1.12)}
.draw-cover .tag{z-index:3;color:#fff;background:#1d3155}.draw-cover-art{position:absolute;inset:28px;display:grid;place-items:center;transform:rotate(-4deg)}.draw-cover-art:before{content:"?";font:900 7rem/1 Georgia,serif;color:#ef476f;text-shadow:5px 5px 0 #ffd166}.draw-cover-art:after{content:"✎";position:absolute;font-size:3rem;color:#1d3155;transform:translate(58px,-40px) rotate(22deg)}
.draw-settings{border-color:#455b80}.draw-setting-grid{display:grid;grid-template-columns:2fr repeat(2,1fr);gap:14px;margin:20px 0}.draw-setting-grid label:last-child{grid-column:span 2}
.draw-paper{position:relative;overflow:hidden;border:1px solid #d8cfbc;border-radius:12px;background:#fffdf7;color:#182236;box-shadow:0 22px 60px #0007,0 1px 0 #fff inset}.draw-paper:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(#4076a00d 1px,transparent 1px),linear-gradient(90deg,#4076a00d 1px,transparent 1px);background-size:24px 24px}.draw-paper>*{position:relative}.draw-choice-paper{min-height:430px;display:grid;place-items:center;padding:clamp(28px,7vw,80px)}.word-choice,.draw-wait{text-align:center;max-width:720px}.word-choice h3,.draw-wait h3,.draw-reveal h3,.draw-final h3{margin:8px 0;font:900 clamp(2rem,6vw,5rem)/.95 Georgia,serif;color:#1d3155;letter-spacing:-.04em}.word-choice p,.draw-wait p,.draw-reveal p{color:#5d6675}.word-choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:28px}.draw-word-button{min-height:90px;padding:18px;border:2px solid #1d3155;border-radius:9px;background:#fffdf7;color:#1d3155;font:800 1.1rem/1.2 system-ui;cursor:pointer;box-shadow:4px 4px 0 #ffd166;transition:transform .15s,box-shadow .15s}.draw-word-button:hover,.draw-word-button:focus-visible{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #ef476f}.pencil-loader{display:block;margin:auto;font-size:5rem;color:#ef476f;animation:pencil-rock 1.1s ease-in-out infinite}.draw-turn-count{font:700 .72rem/1 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:#697386}.draw-choice-paper>.draw-turn-count{position:absolute;right:24px;bottom:20px}
.word-refresh{display:flex;justify-content:center;margin-top:22px}.word-refresh .quiet{border-color:#1d3155;background:#f4eee0;color:#1d3155}.word-refresh .quiet:disabled{opacity:.45}
.draw-gamebar{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;margin-bottom:12px;padding:12px 16px;border:1px solid #49536b;border-radius:12px;background:#121722}.draw-prompt span,.draw-prompt strong{display:block}.draw-prompt-label{font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;color:#939bad}.draw-prompt strong{font:900 1.45rem/1.2 Georgia,serif;color:#ffd166}.word-mask{letter-spacing:.14em}.draw-clock{display:grid;place-items:center;min-width:64px;padding:10px;border-radius:9px;background:#29344a;color:#fff;font:900 1.15rem/1 ui-monospace,monospace}.draw-clock.urgent{background:#8d3044;animation:clock-pulse 1s infinite}.draw-play-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:14px}.draw-stage,.draw-sidebar{min-width:0}.draw-toolbar{display:grid;grid-template-columns:1fr minmax(120px,200px) auto;gap:14px;align-items:center;margin-bottom:8px;padding:9px 11px;border-radius:10px;background:#e9e3d5;color:#182236}.color-tools{display:flex;gap:6px;flex-wrap:wrap}.color-dot{width:27px;height:27px;padding:0;border:2px solid #fff;border-radius:50%;background:var(--swatch);box-shadow:0 0 0 1px #8d887d;cursor:pointer}.color-dot.active{box-shadow:0 0 0 3px #20a4f3;transform:scale(.85)}.brush-size{display:flex;gap:8px;align-items:center;font-size:.72rem;font-weight:800}.brush-size input{width:100%}.canvas-wrap{overflow:hidden;border-radius:10px;background:#fffdf7;box-shadow:0 16px 40px #0006}.canvas-wrap canvas{display:block;width:100%;height:auto;aspect-ratio:8/5;touch-action:none}.canvas-wrap canvas.can-draw{cursor:crosshair}.artist-note,.guessed-banner{display:flex;gap:10px;align-items:center;margin-top:10px;padding:13px 15px;border-radius:10px;background:#182236;color:#dce6fa}.artist-note span{color:#aab7ce;font-size:.78rem}.guessed-banner{justify-content:center;background:#183d2a;color:#9bf2b5;font-weight:800}.guess-form{margin-top:10px}.guess-form>label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.guess-form>div{display:grid;grid-template-columns:1fr auto;gap:8px}.guess-form input{margin:0;font-size:1rem}.draw-sidebar{display:flex;flex-direction:column;gap:12px;max-height:720px}.draw-sidebar>div{padding:14px;border:1px solid #394157;border-radius:12px;background:#111621}.draw-scoreboard{display:grid;gap:6px;margin-top:10px}.draw-score{display:grid;grid-template-columns:24px 32px 1fr auto;gap:8px;align-items:center;padding:8px;border-radius:9px;background:#1b2230}.draw-score .user-avatar{width:32px;height:32px}.draw-score span strong,.draw-score span small{display:block}.draw-score span strong{max-width:105px;overflow:hidden;text-overflow:ellipsis}.draw-score span small{color:#8f9aaf;font-size:.65rem}.draw-score b{color:#ffd166;font:800 .8rem ui-monospace,monospace}.draw-score.is-drawing{outline:1px solid #20a4f3}.draw-score.has-guessed{background:#183126}.draw-rank{color:#818ca0;font:800 .68rem ui-monospace,monospace}.guess-feed-wrap{display:flex!important;flex-direction:column;min-height:180px;flex:1}.guess-feed{overflow:auto;min-height:0;margin:10px 0 0;padding:0;list-style:none}.guess-feed li{padding:8px 0;border-bottom:1px solid #ffffff0c}.guess-feed strong,.guess-feed span{display:block;overflow-wrap:anywhere}.guess-feed strong{font-size:.68rem;color:#95a2b8}.guess-feed span{font-size:.82rem}.guess-feed li.correct span{color:#70e096;font-weight:800}.guess-feed .empty-guess{color:#7f899b;font-size:.78rem}.draw-reveal,.draw-final{min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px;text-align:center}.reveal-scribble{font-size:4rem;color:#ef476f}.draw-podium{display:flex;align-items:flex-end;justify-content:center;gap:10px;width:100%;margin-top:35px}.podium-place{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:120px;padding:18px 12px;background:#e9e3d5;border-radius:10px 10px 4px 4px}.podium-place>span{font:900 1.4rem Georgia,serif;color:#ef476f}.podium-place .user-avatar{width:46px;height:46px}.podium-place strong{max-width:130px;overflow-wrap:anywhere}.podium-place b{color:#1d5a9b}.podium-place.place-1{order:-1;min-height:185px;background:#ffd166}.podium-place.place-2{order:-2;min-height:155px}.podium-place.place-3{min-height:135px}
@keyframes pencil-rock{50%{transform:rotate(-12deg) translateY(-8px)}}@keyframes clock-pulse{50%{transform:scale(1.06)}}
@media (prefers-reduced-motion:reduce){.pencil-loader,.draw-clock.urgent{animation:none}}
@media (max-width:900px){.draw-play-layout{grid-template-columns:1fr}.draw-sidebar{max-height:none;display:grid;grid-template-columns:1fr 1fr}.guess-feed-wrap{min-height:220px}.draw-setting-grid{grid-template-columns:1fr 1fr}.draw-setting-grid label:last-child{grid-column:auto}}
@media (max-width:620px){.word-choice-grid{grid-template-columns:1fr}.draw-choice-paper{min-height:520px}.draw-gamebar{grid-template-columns:1fr auto}.draw-gamebar>.draw-turn-count{grid-column:1/-1}.draw-toolbar{grid-template-columns:1fr}.draw-toolbar .actions{justify-content:flex-start}.draw-sidebar{grid-template-columns:1fr}.draw-setting-grid{grid-template-columns:1fr}.draw-podium{align-items:stretch;flex-direction:column}.podium-place,.podium-place.place-1,.podium-place.place-2,.podium-place.place-3{order:initial;min-height:0;width:100%;display:grid;grid-template-columns:28px 42px 1fr auto;text-align:left}.podium-place .user-avatar{width:42px;height:42px}.draw-reveal,.draw-final{padding:34px 18px}.draw-score span strong{max-width:140px}}
.draw-toolbar .quiet{border-color:#79869b;background:#f8f4e9;color:#273651}.draw-toolbar .quiet:hover{border-color:#1d5a9b;color:#1d5a9b}.draw-toolbar .brush-size{color:#273651}
.draw-toolbar{grid-template-columns:minmax(230px,1fr) minmax(100px,170px) auto}.brush-types{display:flex;gap:6px;grid-column:1/3}.brush-types button{display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #9ca4ad;border-radius:8px;background:#f8f4e9;color:#273651;font:800 .72rem/1 system-ui;cursor:pointer}.brush-types button.active{border-color:#1d5a9b;background:#1d5a9b;color:#fff;box-shadow:0 2px 0 #ef476f}.draw-toolbar>.actions{grid-column:3;grid-row:1}.draw-toolbar>.color-tools{grid-column:1/3}.draw-toolbar>.brush-size{grid-column:3}.canvas-wrap{position:relative}.canvas-wrap #draw-preview{position:absolute;inset:0;z-index:2;pointer-events:none;background:transparent;box-shadow:none}
.draw-sync-state{grid-column:1/-1;color:#50705c;font:800 .68rem/1.2 ui-monospace,monospace}.draw-sync-state::before{content:'✓';display:inline-grid;place-items:center;width:17px;height:17px;margin-right:6px;border-radius:50%;background:#d5ead9}.draw-sync-state.pending{color:#7a6228}.draw-sync-state.pending::before{content:'↻';background:#f6e7b8}.draw-sync-state.failed{color:#9b3b4d}.draw-sync-state.failed::before{content:'!';background:#f6d5dc}
@media (max-width:620px){.draw-toolbar{grid-template-columns:1fr}.brush-types,.draw-toolbar>.actions,.draw-toolbar>.color-tools,.draw-toolbar>.brush-size{grid-column:1;grid-row:auto}.brush-types{overflow-x:auto}.brush-types button{flex:1;justify-content:center}}
.canvas-wrap canvas{aspect-ratio:4/3}
