:root{--paper:#F7F6EF;--ink:#292B36;--muted:#777A80;--line:#E2E2D9;--purple:#ACA0DF;--lime:#D3E58C;--pink:#F2C7BB;--panel:#FFF;--shadow:0 4px 0 #292b3608}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none}button:disabled{opacity:.4;cursor:not-allowed}a{color:inherit;text-decoration:none}input,select{outline:none;border:1.5px solid var(--line);background:#FAFAFB;border-radius:12px}input:focus,select:focus{border-color:#8F80C5;box-shadow:0 0 0 3px #AC9DE32B}button:focus-visible,a:focus-visible{outline:3px solid #9A86D4;outline-offset:4px}button{transition:transform .15s,background .15s}button:hover:not(:disabled){transform:translateY(-2px)}[hidden]{display:none!important}h1,h2,h3,p{margin:0}.nav{height:96px;max-width:1250px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 16px}.brand{display:flex;align-items:center;gap:12px}.brand-icon{width:43px;height:43px;display:grid;place-items:center;background:var(--lime);border:2px solid var(--ink);border-radius:14px;font-size:32px;transform:rotate(-7deg)}.brand strong{font-size:25px;letter-spacing:-1px;display:flex;align-items:center;gap:12px}.brand strong span{font-size:11px;font-weight:500;letter-spacing:2px;border-left:1px solid #bbb;padding-left:12px}.nav-right{display:flex;align-items:center;gap:30px}.edition{font-size:10px;letter-spacing:2px;color:var(--muted)}.text-btn{font-size:13px;font-weight:600;padding:7px 0}.text-btn span{padding-left:5px}.intro{text-align:center;padding:42px 16px 32px}.eyebrow{display:flex;align-items:center;justify-content:center;gap:8px;color:#676B60;font-size:12px;letter-spacing:2px}.tiny-star{font-size:21px;color:#8074A7}h1{font-size:clamp(32px,3.5vw,51px);letter-spacing:-2px;line-height:1.5;font-weight:850;margin:9px 0;position:relative;display:inline-block}h1 span{position:relative}h1 span:after{content:"";position:absolute;height:10px;background:var(--lime);left:0;right:0;bottom:1px;transform:rotate(-1.3deg);z-index:-1}h1 i{position:absolute;right:-50px;top:-5px;color:#AB9BD3;font-size:43px;font-weight:400}.intro p{font-size:14px;color:#666970;margin:3px 0 15px}.intro-tags{display:flex;justify-content:center;align-items:center;gap:12px;font-size:11px;color:#85877F}.intro-tags b{font-size:8px}.setup-grid{max-width:1096px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:0 16px}.panel{border:1px solid var(--line);border-radius:23px;background:var(--panel);box-shadow:var(--shadow)}.character-card{overflow:hidden;padding:25px}.section-label{display:flex;align-items:center;gap:10px}.section-label>span{font-size:10px;color:#777A80;background:#F0F1EB;padding:5px 7px;border-radius:6px;font-weight:600}.section-label h2{font-size:19px;letter-spacing:-.5px}.section-label>.text-btn{margin-left:auto;font-size:12px;color:#666970}.character-stage{height:259px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}.stage-ring{position:absolute;width:215px;height:215px;border-radius:50%;background:#F0EAF7;border:1px solid #E8DFEF;z-index:-1;top:20px}.stage-ring:after{content:"";position:absolute;inset:16px;border:1px dashed #D8CEE3;border-radius:50%}.stage-tag{position:absolute;left:2px;top:27px;font-size:10px;color:#929389;letter-spacing:2px;writing-mode:vertical-rl}.character-main{width:218px;transform:translateY(-7px);transition:transform .25s}.character-main:hover{transform:translateY(-7px)}.avatar{display:block;width:100%;height:100%}.floating-note{position:absolute;right:-8px;top:61px;font-size:11px;background:#FFF8E4;border:1px solid #E7DFC7;border-radius:9px 9px 9px 0;padding:9px 11px;transform:rotate(8deg)}.stage-spark{position:absolute}.spark-a{left:48px;top:65px;font-size:41px;color:#A798C4}.spark-b{right:35px;bottom:47px;font-size:35px;color:#BDCB8C}.character-name{position:absolute;bottom:2px;font-size:13px;font-weight:650;display:inline-flex;align-items:center;gap:5px}.character-name:before{content:"";width:6px;height:6px;border-radius:50%;background:#97A25F}.cast-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin-top:19px}.cast-option{position:relative;background:#F7F7F3;border:1.5px solid transparent;border-radius:12px;overflow:hidden;padding:1px 0;height:62px}.cast-option.selected{border-color:#8978B9;background:#F1ECF8}.cast-option.selected:after{content:"✓";position:absolute;right:1px;bottom:0;font-size:9px;background:#8978B9;color:white;width:14px;height:14px;border-radius:6px 0 0 0}.cast-option .avatar{transform:none}.customize{margin-top:20px;padding-top:16px;border-top:1px solid #EFEFE8;display:flex;justify-content:space-between;gap:10px}.control-caption{display:block;font-size:11px;color:#84877E;margin-bottom:10px}.swatches,.hat-picker{display:flex;gap:6px}.swatch{height:24px;width:24px;border-radius:50%;border:2px solid white;box-shadow:0 0 0 1px #DDD}.swatch.selected{box-shadow:0 0 0 2px var(--ink)}.swatch.selected:after{content:"✓";font-size:12px;font-weight:800}.hat{font-size:11px;padding:5px 7px;border-radius:7px;background:#F4F4EF}.hat.selected{background:#EAE5F3;color:#68558F}.play-card{padding:25px 28px;display:flex;flex-direction:column}.play-card .section-label{margin-bottom:24px}.input-label{font-size:12px;display:block;margin:0 0 9px;font-weight:600}.large-input{width:100%;font-size:15px;padding:14px 15px}.input-helper{font-size:10px;color:#999C92;margin:8px 0 23px}.difficulty-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:11px 0 17px}.difficulty-picker button{display:flex;flex-direction:column;align-items:center;gap:5px;border:1.5px solid var(--line);border-radius:10px;padding:12px 4px;background:#FFF}.difficulty-picker b{font-size:13px}.difficulty-picker small{font-size:9px;color:#999}.difficulty-picker button.selected{background:#F1F6DA;border-color:#B2C169}.difficulty-picker button.selected small{color:#7D865C}.setting-line{display:flex;justify-content:space-between;align-items:center;margin:12px 0;font-size:12px}.setting-line select{border:none;background:none;font-size:11px;padding:4px}.primary{background:var(--ink);color:white;border-radius:12px;font-weight:650;padding:12px 18px}.primary.big{font-size:15px;display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:17px;padding:17px 20px}.primary.big span{font-size:22px;line-height:1;color:var(--lime)}.primary:hover{background:#45424F}.secondary{border:1.5px solid var(--line);background:#F6F6F1;border-radius:11px;padding:12px 17px;font-size:12px;font-weight:600;white-space:nowrap}.join-divider{text-align:center;display:flex;align-items:center;gap:12px;margin:21px 0 13px;color:#92958B;font-size:10px}.join-divider:before,.join-divider:after{content:"";height:1px;background:var(--line);flex:1}.join-row{display:flex;gap:10px}.join-row input{width:0;flex:1;padding:12px 13px;font-size:12px;text-transform:uppercase}.try-row{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:15px}.try-row button{font-size:12px;color:#756296}.try-row>span{font-size:9px;color:#9B9E94}.how-strip{max-width:1064px;margin:24px auto 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:21px 16px;display:grid;grid-template-columns:repeat(3,1fr) 190px;gap:20px}.how-strip>div{display:flex;align-items:center;gap:11px}.how-strip b{font-size:13px;color:#999B8D;font-weight:500}.how-strip strong{display:block;font-size:12px}.how-strip p span{font-size:10px;color:#92958C;display:block;margin-top:5px}.strip-doodle{color:#A390C2;justify-content:center;font-size:44px;line-height:1}.strip-doodle>span{font-size:10px;line-height:1.8;transform:rotate(-6deg);color:#898A80}.footer{max-width:1096px;padding:25px 16px;display:flex;justify-content:space-between;gap:10px;margin:auto;font-size:9px;color:#9A9D94;align-items:center;letter-spacing:1px}.footer .text-btn{font-size:10px;font-weight:400}.room-top{max-width:1380px;margin:20px auto 16px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.room-top>div{display:flex;align-items:center;gap:15px}.room-top strong{font-size:14px}.badge{font-size:10px;border-radius:20px;background:#eeedf3;color:#66616f;padding:6px 10px}.badge.offline{background:#FAE8DF;color:#AA694E}.icon-btn{border:1px solid var(--line);border-radius:50%;height:30px;width:30px}.game-layout{max-width:1380px;margin:auto;padding:0 20px;display:grid;grid-template-columns:190px minmax(0,1fr) 245px;gap:16px;align-items:start}.players,.chat{padding:18px 13px}.side-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding:0 2px}.side-title h2{font-size:13px}.side-title span{font-size:10px;color:#8B8E84}.player-row{display:flex;align-items:center;gap:8px;padding:9px 6px;border-radius:13px;margin:6px 0;min-width:0}.player-row.me{background:#F2EFF9}.player-row.is-drawer{outline:1px solid #B7A8D6}.player-face{width:44px;height:46px;flex-shrink:0;overflow:hidden;border-radius:12px;background:#F2F2EB}.player-face svg{display:block;width:100%;height:100%;transform:none}.player-info{min-width:0;flex:1}.player-info b{font-size:12px;display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.player-info small{font-size:9px;display:block;color:#949889;margin-top:4px}.player-score{font-size:13px;font-weight:700}.player-offline{opacity:.45}.room-rules{border-top:1px solid var(--line);margin-top:18px;padding:15px 5px;color:#92958A;font-size:10px;line-height:2}.board-heading{padding:13px 21px;display:flex;align-items:center;justify-content:space-between;margin-bottom:13px;min-height:85px}.muted{font-size:10px;color:#999D91}.board-heading h2{font-size:21px;margin-top:5px;letter-spacing:1px}.clock{background:#F2EFF7;border-radius:13px;width:64px;padding:8px;text-align:center}.clock span{font-size:23px;font-weight:700;font-variant-numeric:tabular-nums}.clock small{display:block;font-size:6px;letter-spacing:1px;color:#8F869E}.clock.urgent{background:#F8DFD7;color:#B25A46}.canvas-wrap{position:relative;width:100%;aspect-ratio:3/2;border:1px solid #DBDBD1;border-radius:18px;background:white;overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}.paper-mark{position:absolute;right:15px;bottom:12px;pointer-events:none;font-size:7px;letter-spacing:2px;color:#D3D6CB}.canvas-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column;padding:26px;background:#FCFCF8ED;gap:15px}.canvas-overlay h2{font-size:24px;letter-spacing:-1px}.canvas-overlay p{font-size:12px;line-height:1.8;color:#8A8E81;max-width:360px}.party-avatars{display:flex;justify-content:center;margin-bottom:0;max-width:90%}.party-avatars .avatar{width:90px;max-width:18vw;margin:0 -8px;transform:none}.party-avatars .avatar:nth-child(even){transform:none}.word-options{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;width:100%}.word-choice{border:1.5px solid #C7B9DD;border-radius:13px;padding:20px 14px;min-width:100px;background:white}.word-choice b{display:block;font-size:20px}.word-choice small{display:block;font-size:9px;color:#9586AD;margin-top:8px}.word-choice:hover{background:#F3EFFA;transform:rotate(-2deg)}.toolbar{margin-top:12px;padding:10px 12px;display:flex;align-items:center;gap:10px;justify-content:space-between;border-radius:15px;flex-wrap:wrap}.drawing-tools,.history-tools{display:flex;align-items:center;gap:4px}.tool{padding:7px;border-radius:7px;min-width:29px;font-size:12px;font-weight:600;line-height:1.2}.tool.active{background:#EEE8F7;color:#6D5599}.drawing-tools .tool:first-child{font-size:22px;padding:0 7px}.drawing-tools select{font-size:10px;padding:6px 3px;border:none;background:#F7F7F2}.ink-picker{display:flex;gap:5px;align-items:center;flex-wrap:wrap}.ink{width:21px;height:21px;border-radius:50%;border:1px solid #DDD;position:relative}.ink.active{outline:2px solid var(--ink);outline-offset:2px}.ink.active:after{content:"✓";position:absolute;inset:0;text-align:center;font-size:12px;font-weight:900;text-shadow:0 0 3px #fff;color:#FFF;filter:drop-shadow(0 0 1px #000)}.board-foot{display:flex;justify-content:space-between;font-size:10px;color:#A2A698;align-items:center;gap:8px;padding:8px 2px}.board-foot .text-btn{font-size:10px;white-space:nowrap}.chat{display:flex;flex-direction:column;height:570px}.chat-log{flex:1;overflow:auto;min-height:0;scroll-behavior:smooth}.chat-line{margin-bottom:12px;line-height:1.6;font-size:12px;overflow-wrap:anywhere}.chat-line b{font-size:10px;color:#9A9D91;display:block;font-weight:500}.chat-line.system,.chat-line.reveal{font-size:10px;color:#9C9D93;text-align:center;margin:12px 0;padding:5px}.chat-line.correct{background:#f3f0f9;border:1px solid #ddd4eb;border-radius:10px;padding:8px;color:#62527a}.chat-line.correct b{color:#7a6b8a}.chat-log:empty:after{content:"猜错也没关系。\A说不定下一笔就懂了。";white-space:pre-line;display:block;text-align:center;font-size:11px;line-height:2;color:#B7BBAE;padding:48px 0}#guess-form{display:flex;gap:6px;margin-top:10px}#guess-input{width:0;min-width:0;flex:1;padding:11px 8px;font-size:11px}#guess-form button{padding:8px 13px;font-size:20px;border-radius:10px}.chat-tip{font-size:9px;color:#AAAFA1;text-align:center;margin-top:9px}.live-dot{height:7px;width:7px;background:#ADB982;border-radius:50%}#reveal-banner{position:absolute;bottom:32px;left:15%;right:15%;background:#EDF4D8;border:1px solid #D4DDBB;border-radius:12px;text-align:center;padding:14px;color:#5B6745;font-size:15px;box-shadow:0 6px 20px #0001}#reveal-banner b{font-size:22px;color:#343C2B;margin-left:10px}.rank-final{display:flex;gap:12px;align-items:flex-end;justify-content:center;width:100%}.rank-person{font-size:10px;min-width:70px;background:#F3F0F8;border-radius:13px;padding:8px}.rank-person svg{height:80px}.rank-person strong{font-size:14px;display:block;margin:5px}.toast{position:fixed;z-index:100;left:50%;bottom:30px;transform:translateX(-50%);max-width:90%;padding:13px 20px;background:#30323BEF;color:white;border-radius:12px;font-size:12px;text-align:center;box-shadow:0 8px 30px #0002}dialog{border:1px solid var(--line);border-radius:22px;max-width:500px;width:calc(100% - 32px);padding:32px;color:var(--ink);box-shadow:0 24px 100px #0003}dialog::backdrop{background:#292B3655;backdrop-filter:blur(3px)}.close-dialog{position:absolute;top:12px;right:15px;font-size:25px;color:#AAA}dialog h2{font-size:24px;margin-bottom:18px}dialog p{font-size:13px;line-height:1.9;color:#757B6C;margin-bottom:14px}dialog input{padding:12px;width:100%;margin-bottom:13px}dialog .primary{width:100%}
@media(min-width:1500px){.setup-grid{max-width:1150px}.intro{padding-top:48px}.character-stage{height:272px}.play-card{padding:27px 32px}.character-card{padding:27px}}
@media(max-width:1130px){.game-layout{grid-template-columns:160px minmax(0,1fr) 220px;gap:10px;padding:0 13px}.toolbar{gap:7px}.ink-picker{order:3;width:100%;justify-content:center;padding-top:7px;border-top:1px solid var(--line)}.chat{height:530px}.cast-grid{grid-template-columns:repeat(4,1fr);gap:6px}.cast-option{height:55px}.cast-option .avatar{max-width:60px;margin:auto}.character-stage{height:225px}.customize{flex-wrap:wrap;gap:15px}.how-strip{margin-left:16px;margin-right:16px;grid-template-columns:repeat(3,1fr)}.strip-doodle{display:none!important}}
@media(max-width:760px){.nav{height:75px;margin:0 16px;padding:0}.edition{display:none}.brand strong{font-size:22px}.brand-icon{height:36px;width:36px}.brand strong span{font-size:9px}.intro{padding:30px 16px 24px}h1{font-size:34px;letter-spacing:-1.4px}h1 i{display:none}.intro p{font-size:12px}.intro-tags{font-size:9px;gap:8px}.setup-grid{grid-template-columns:1fr;max-width:520px;gap:17px}.character-card{padding:19px 20px}.section-label h2{font-size:18px}.character-stage{height:205px}.stage-ring{width:172px;height:172px;top:16px}.character-main{width:181px;transform:translateY(-8px)}.character-name{bottom:-2px}.floating-note{right:1px;top:44px;font-size:9px;padding:8px}.spark-a{left:28px;font-size:31px}.spark-b{right:25px;bottom:35px;font-size:29px}.stage-tag{font-size:9px}.cast-grid{grid-template-columns:repeat(8,1fr);gap:4px;margin-top:17px}.cast-option{height:47px;border-radius:9px}.customize{flex-wrap:nowrap;gap:10px;margin-top:15px;padding-top:14px}.swatches{gap:5px}.swatch{width:21px;height:21px}.hat-picker{gap:3px}.hat{padding:5px;font-size:9px}.control-caption{font-size:10px;margin-bottom:8px}.play-card{padding:22px}.play-card .section-label{margin-bottom:20px}.input-helper{margin-bottom:20px}.how-strip{grid-template-columns:repeat(3,1fr);padding:20px 0;gap:8px}.how-strip>div{align-items:flex-start;gap:6px}.how-strip strong{font-size:11px}.how-strip p span{font-size:9px;line-height:1.6}.how-strip b{font-size:9px;margin-top:3px}.footer{font-size:8px;gap:4px;flex-wrap:wrap;padding:23px 17px}.footer .text-btn{font-size:9px}.room-top{padding:0 13px;margin:16px 0 11px}.room-top>div{gap:8px}.room-top strong{font-size:11px}.room-top .text-btn{font-size:10px}.badge{padding:5px 7px;font-size:9px}.game-layout{grid-template-columns:1fr;gap:10px;padding:0 10px}.players{padding:8px;border-radius:14px;order:0}.players .side-title,.room-rules{display:none}.players #players-list{display:flex;overflow:auto;gap:8px}.player-row{padding:4px;min-width:100px;max-width:135px;margin:1px;gap:4px;flex-shrink:0}.player-face{width:30px;height:33px;border-radius:8px}.player-info b{font-size:10px}.player-info small{font-size:8px}.player-score{font-size:10px}.board-column{order:1}.board-heading{border-radius:13px;padding:9px 13px;margin-bottom:9px;min-height:64px}.board-heading h2{font-size:18px;margin-top:2px}.clock{width:50px;padding:5px}.clock span{font-size:19px}.clock small{font-size:5px}.canvas-wrap{border-radius:13px}.canvas-overlay{padding:16px;gap:10px}.canvas-overlay h2{font-size:18px}.canvas-overlay p{font-size:10px}.party-avatars .avatar{height:75px;width:64px}.word-choice{min-width:84px;padding:12px 8px}.word-choice b{font-size:17px}.word-options{gap:6px}.canvas-overlay .primary{font-size:12px;padding:10px 17px}.toolbar{border-radius:12px;margin-top:8px;padding:8px 9px}.ink-picker{justify-content:flex-start;gap:9px;order:3;flex-wrap:nowrap;overflow:auto}.ink{flex-shrink:0;width:18px;height:18px}.tool{font-size:10px}.board-foot{padding:5px 1px;font-size:8px}.board-foot .text-btn{font-size:9px}.chat{order:2;height:240px;padding:13px;border-radius:15px}.chat .side-title{margin-bottom:5px}.chat-log{min-height:60px}.chat-line{margin-bottom:8px;font-size:11px}.chat-line.system,.chat-line.reveal{margin:6px 0}.chat-line b{display:inline;margin-right:5px}#guess-form{margin-top:7px;position:sticky;bottom:0;background:white}#guess-input{font-size:14px;padding:10px}#reveal-banner{bottom:18px;left:10%;right:10%;padding:9px;font-size:12px}#reveal-banner b{font-size:18px}.rank-person{min-width:65px;padding:5px}.rank-person svg{height:48px}.rank-person strong{font-size:12px}.rank-final{gap:8px}}
@media(max-width:370px){.customize{flex-wrap:wrap}.intro h1{font-size:30px}.cast-grid{grid-template-columns:repeat(4,1fr)}.cast-option{height:45px}.character-card{padding:18px}.difficulty-picker small{font-size:8px}.try-row>span{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* Candidate touch ergonomics: prevent iOS input zoom and give controls real hit targets. */
@media(max-width:760px){input,#guess-input{font-size:16px}.swatch{width:30px;height:30px}.hat{min-height:36px;padding:7px}.customize{flex-wrap:wrap}.tool{min-width:38px;min-height:38px}.ink{width:24px;height:24px}.ink-picker{padding:7px 3px 4px;gap:8px}.room-top{flex-wrap:wrap}.badge{font-variant-numeric:tabular-nums}.chat{padding-bottom:max(13px,env(safe-area-inset-bottom))}}
canvas{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.canvas-wrap{overscroll-behavior:contain}

.intro{max-width:1096px;margin:auto;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:28px;padding:28px 16px}.intro-copy{text-align:left}.intro .eyebrow,.intro-tags{justify-content:flex-start}.intro h1{font-size:clamp(30px,3vw,44px);white-space:nowrap}.intro h1 i{display:none}.friends-art{display:block;width:100%;height:215px;object-fit:cover;border-radius:24px;border:1px solid #e5ddcf;box-shadow:0 5px 0 #292b3608}@media(max-width:760px){.intro{display:block;padding:20px 20px}.intro-copy{text-align:center}.intro .eyebrow,.intro-tags{justify-content:center}.intro h1{font-size:31px}.friends-art{height:150px;margin:16px auto 0;max-width:480px}.intro-tags{font-size:10px}}
/* Keep the palette's scroll width from enlarging the phone's grid column. */
.board-column,.players,.chat,.ink-picker{min-width:0}.ink-picker{max-width:100%}
@media(max-width:760px){.game-layout{grid-template-columns:minmax(0,1fr)}.board-heading>div:first-child{min-width:0}.board-heading h2{overflow-wrap:anywhere}.clock{flex-shrink:0}}

/* Friends lobby: quieter hierarchy, clear actions, existing character artwork. */
:root{--ink:#30323a;--muted:#68756f;--line:#e1e1e4;--shadow:0 4px 18px #233d2c05}
body{background:#f7f7f8;color:#30323a}button,input,select{font:inherit}button{transition:background .15s,box-shadow .15s,transform .15s}button:focus-visible,input:focus-visible{outline:3px solid #85aa91;outline-offset:3px}button:disabled{opacity:.45;cursor:not-allowed}button:active:not(:disabled){transform:translateY(1px)}
.nav{height:88px;max-width:1180px}.brand-icon{background:#dce9b8;border-radius:13px;transform:rotate(-5deg)}.brand strong{font-size:24px}.text-btn{color:#60616b;min-height:40px}.primary,.secondary{min-height:44px;font-size:14px;border-radius:11px;padding:12px 20px}.primary{background:#30323a}.primary:hover{background:#202229;box-shadow:0 4px 10px #254b4020}.secondary{background:white;border-color:#d7d7dc;color:#43434f}.secondary:hover{background:#f2f1f6}
.intro{max-width:1180px;padding:36px 20px;gap:48px}.intro h1{font-size:44px;letter-spacing:-1.5px}.intro h1 span:after{background:#d5e4ac;height:9px}.intro p{line-height:1.8;font-size:15px;color:#6d6d77;max-width:440px}.intro-tags{color:#657568;font-size:12px}.eyebrow{font-size:10px;letter-spacing:2px;color:#6a7a6d}.friends-art{height:225px;border-radius:20px;box-shadow:none;object-position:center 50%}
.lobby-shell{max-width:1140px;margin:8px auto 32px;background:#fff;border:1px solid #e1e1e4;border-radius:22px;padding:28px}.lobby-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.lobby-head .eyebrow{justify-content:flex-start;font-size:9px;margin-bottom:8px}.lobby-head h2{font-size:24px;letter-spacing:-.5px;display:flex;align-items:center;gap:10px}.lobby-head h2 span{font-size:12px;font-weight:500;border-radius:7px;background:#f0f4e9;color:#688051;padding:4px 8px}.lobby-head p{font-size:13px;color:#748173;margin-top:8px}.lobby-head>.primary{white-space:nowrap}.room-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.room-card{padding:21px;border:1px solid #e2e2e6;border-radius:16px;background:#fdfdfd}.room-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.room-glyph{width:39px;height:39px;display:grid;place-items:center;background:#eeedf3;border-radius:11px;font-size:25px;color:#62616e}.room-state{font-size:11px;color:#686574;background:#f0eef5;padding:6px 10px;border-radius:20px}.room-state.playing{color:#6d6188;background:#eee9f6}.room-card h3{font-size:18px;overflow-wrap:anywhere;line-height:1.5}.room-card>p{font-size:12px;color:#73816e;margin:8px 0 24px}.room-card>p span{padding:0 5px}.room-card-bottom{border-top:1px solid #e6ece2;padding-top:14px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.room-card-bottom>span{font-size:10px;color:#798672}.room-card-bottom button{font-size:12px;padding:10px 14px}.lobby-empty{grid-column:1/-1;text-align:center;border:1px dashed #d8e0d2;border-radius:15px;background:#fafafa;padding:27px 20px}.empty-pencil{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 12px;font-size:33px;border-radius:15px;background:#eaf0db;color:#6c804c}.lobby-empty h3{font-size:18px}.lobby-empty p{font-size:13px;color:#79846f;line-height:1.8;margin:9px 0 18px}.lobby-bottom{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#85917d;gap:12px;padding:9px 0 16px}.lobby-bottom button{font-size:11px}.lobby-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:30px;border-top:1px solid #e6e6ea;padding-top:22px}.lobby-shortcuts strong{font-size:13px;font-weight:600}.lobby-shortcuts .join-row{margin-top:10px;max-width:440px}.join-row input{font-size:14px;background:#fafafa;letter-spacing:1px}.practice-shortcut{display:flex;gap:12px;align-items:center;padding-left:26px;border-left:1px solid #e6e6ea}.practice-shortcut p{font-size:11px;color:#839178;margin-top:6px}.practice-shortcut button{margin-left:auto;font-size:12px;padding:10px 14px}.practice-icon{font-size:28px;color:#8d7da6}.how-strip{border-bottom:0;margin-top:12px}.footer{color:#71806c}
.entry-dialog{max-width:1000px;padding:22px;background:#f8f8fa;max-height:94dvh;overflow:auto}.entry-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#6d7f66;margin:0 3px 16px}.entry-top .icon-btn{width:36px;height:36px;font-size:22px}.entry-dialog .setup-grid{padding:0;gap:18px;max-width:none}.entry-dialog .panel{border-radius:17px;box-shadow:none}.entry-dialog .character-card,.entry-dialog .play-card{padding:22px}.entry-dialog .section-label{margin-bottom:16px;min-height:32px;align-items:center;gap:10px}.entry-dialog .section-label h2{margin:0;line-height:1.35;font-size:18px;letter-spacing:0}.entry-dialog .section-label>span{width:28px;height:28px;padding:0;display:grid;place-items:center;flex-shrink:0;font-size:11px;line-height:1}.entry-dialog .section-label>.text-btn{padding:0 0 0 6px;min-height:32px;line-height:1.35;white-space:nowrap;font-size:11px}.entry-dialog .character-stage{height:224px}.entry-dialog .character-main{width:190px;transform:translateY(-8px)}.entry-dialog .stage-ring{width:200px;height:200px;top:7px}.entry-dialog .stage-tag,.entry-dialog .floating-note,.entry-dialog .stage-spark{display:none}.entry-dialog .character-name{bottom:0;line-height:20px}.entry-dialog .customize{display:grid;grid-template-columns:1fr;gap:16px}.entry-dialog .control-caption{margin-bottom:10px;line-height:1.4}.entry-dialog .hat-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.entry-dialog .hat{padding:8px 6px;text-align:center;white-space:nowrap}.entry-dialog .swatches{gap:10px}.entry-dialog .play-card .input-label{line-height:1.4;margin-bottom:8px}.entry-dialog .large-input{margin-bottom:0}.entry-dialog .input-helper{display:block;margin-top:9px}.entry-dialog .input-helper{font-size:11px;line-height:1.7;margin-bottom:20px}.entry-dialog .large-input{font-size:16px;min-height:48px;background:#fafafa}.entry-dialog .field-note{font-size:11px;line-height:1.7;color:#77836d;margin:8px 0 20px}.entry-dialog .cast-grid{grid-template-columns:repeat(4,1fr)}.entry-dialog .cast-option{height:68px;display:flex;align-items:center;justify-content:center}.entry-dialog .cast-option .avatar{max-width:66px;margin:auto}.entry-dialog .customize{flex-wrap:wrap}.entry-dialog .hat{min-height:36px}.entry-dialog .swatch{width:30px;height:30px}.entry-dialog .setting-line{margin:15px 0}.join-target{margin:12px 0;background:#f1eff7;padding:16px;border-radius:12px;font-size:13px;line-height:1.8;color:#686174}.share-symbol{font-size:26px;width:50px;height:50px;background:#ebf2df;border-radius:15px;display:grid;place-items:center;margin-bottom:18px}.share-native{width:100%;margin-top:10px}dialog .share-code{font-size:11px;text-align:center;margin-top:16px;margin-bottom:0}.share-code b{letter-spacing:2px}#share-link{font-size:12px;color:#546451;background:#f7f9f2}dialog .close-dialog{min-width:36px;min-height:36px}
/* Mobile drawing essentials use text labels, not ambiguous glyphs. */
.drawing-tools{gap:6px;flex-wrap:wrap}.drawing-tools .tool{display:flex;gap:6px;align-items:center;justify-content:center;font-size:13px!important;padding:8px 12px!important;min-height:42px}.tool svg{width:19px;height:19px;flex-shrink:0}.tool.active{background:#eeebf6;color:#635383;box-shadow:inset 0 0 0 1px #d7cfe5}.size-control{display:flex;align-items:center;gap:8px;min-height:40px;margin-left:5px;font-size:11px;color:#657662}.size-control input{width:95px;accent-color:#436a45;padding:0;min-height:28px;border:0;cursor:pointer;background:transparent}.size-control output{width:28px;font-size:11px;font-variant-numeric:tabular-nums}.history-tools .tool{min-height:40px;min-width:40px}.ink-picker{gap:8px}.ink{width:25px;height:25px}.board-foot{color:#6f7f65}.chat-tip{color:#738567}.board-heading{box-shadow:none}.room-top>div{min-width:0}.room-top strong{overflow-wrap:anywhere;max-width:440px}.chat .side-title h2{font-size:15px}#guess-input{font-size:16px}.canvas-overlay p{color:#718068}.player-info small{color:#6b7c61}.muted{color:#77886c}
@media(max-width:1000px){.room-directory{grid-template-columns:repeat(2,minmax(0,1fr))}.lobby-shell{margin:8px 20px 24px}.intro{gap:22px}.intro h1{font-size:36px}.practice-shortcut{padding-left:16px}.practice-icon{display:none}}
@media(max-width:760px){.nav{height:68px}.brand strong{font-size:21px}.intro{display:grid;grid-template-columns:1fr 100px;gap:14px;padding:24px 20px}.intro-copy{text-align:left}.intro .eyebrow,.intro-tags{justify-content:flex-start}.intro .eyebrow{font-size:9px;letter-spacing:0}.intro h1{font-size:27px;line-height:1.4;white-space:normal;margin:8px 0}.intro h1 span{display:block;width:max-content}.intro p{font-size:11px;line-height:1.8;margin-bottom:10px}.intro-tags{gap:5px;font-size:9px;flex-wrap:wrap}.friends-art{height:132px;width:100%;margin:0;object-position:50% 50%;border-radius:18px}.lobby-shell{margin:0 12px 18px;padding:18px 15px;border-radius:18px}.lobby-head{align-items:center;margin-bottom:18px;gap:10px}.lobby-head h2{font-size:20px}.lobby-head p{display:none}.lobby-head>.primary{font-size:12px;padding:11px 13px}.lobby-head .eyebrow{font-size:8px}.room-directory{grid-template-columns:minmax(0,1fr);gap:12px}.room-card{padding:17px}.room-card-top{margin-bottom:10px}.room-card>p{margin-bottom:16px}.room-card-bottom{flex-wrap:nowrap}.lobby-bottom{font-size:9px;padding-bottom:12px}.lobby-shortcuts{grid-template-columns:1fr;gap:18px;padding-top:16px}.practice-shortcut{padding:16px 0 0;border-left:0;border-top:1px solid #e6e6ea}.lobby-shortcuts .join-row input{font-size:16px}.lobby-empty{padding:24px 12px}.lobby-empty p{font-size:12px}.how-strip{display:none}.footer{font-size:8px;padding:16px}.entry-dialog{width:calc(100% - 16px);padding:14px;max-height:96dvh;border-radius:18px}.entry-dialog .setup-grid{display:flex;flex-direction:column;gap:12px}.entry-dialog .character-card{padding:16px}.entry-dialog .character-stage{height:148px}.entry-dialog .character-main{width:120px;transform:translateY(-10px)}.entry-dialog .stage-ring{width:132px;height:132px;top:2px}.entry-dialog .stage-tag,.entry-dialog .floating-note,.entry-dialog .stage-spark{display:none}.entry-dialog .character-name{bottom:0;font-size:11px;line-height:16px}.entry-dialog .cast-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:12px}.entry-dialog .cast-option{height:56px}.entry-dialog .customize{margin-top:14px;padding-top:14px;gap:12px}.entry-dialog .play-card{padding:18px}.entry-dialog .input-helper{margin-bottom:12px}.entry-dialog .section-label h2{font-size:17px;margin:0;line-height:1.35}.entry-dialog .section-label{margin-bottom:12px}.entry-dialog .primary.big{margin-top:12px}.entry-dialog .hat{font-size:10px}.entry-dialog .swatch{width:28px;height:28px}.room-top{gap:8px}.room-top>div:first-child{flex-wrap:wrap;flex:1}.room-top strong{font-size:12px;max-width:220px}.room-top #invite-btn{border:1px solid #cad9c3;border-radius:9px;background:#fff;padding:7px 10px;font-size:11px}.toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;padding:10px}.drawing-tools{display:contents}.drawing-tools .tool{min-height:42px;font-size:12px!important;padding:8px 11px!important;grid-row:1}.drawing-tools #pen-btn{grid-column:1;justify-self:start}.drawing-tools #eraser-btn{grid-column:1;grid-row:1;margin-left:84px;justify-self:start}.size-control{grid-column:1/-1;grid-row:2;margin:0;display:flex;gap:10px;padding:2px 0}.size-control input{flex:1;min-width:0;width:auto}.history-tools{grid-column:2;grid-row:1}.history-tools .tool{font-size:11px}.history-tools #skip-btn{display:none}.ink-picker{grid-column:1/-1;grid-row:3;order:initial;width:100%;justify-content:space-between;gap:7px;padding:8px 3px 5px}.ink{width:24px;height:24px}.board-foot{font-size:9px}.board-foot #save-btn{display:none}.chat{height:260px}.canvas-overlay{gap:8px}.canvas-overlay .party-avatars .avatar{max-height:65px}.canvas-overlay .primary{min-height:42px}.share-code{line-height:1.8}.entry-top{margin-bottom:10px}}

.reaction-panel{margin-top:12px;padding:16px 18px;background:#fbfcf6;border-color:#dce5cd;border-radius:15px}.review-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.review-head b{font-size:14px}.review-head span{font-size:11px;color:#718265}.review-head em{font-style:normal;font-variant-numeric:tabular-nums}.reaction-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:12px}.reaction{display:flex;align-items:center;justify-content:center;gap:7px;min-height:49px;border:1px solid #d9e1ce;background:white;border-radius:11px;font-size:12px}.reaction:hover:not(:disabled){background:#eef4e4;transform:translateY(-2px)}.reaction .reaction-icon{font-size:23px}.reaction b{font-size:12px;color:#768567}.reaction.chosen{opacity:1;background:#e7f0d6;border-color:#a5bc81}.reaction.chosen .reaction-icon{animation:reaction-pop .4s ease-out}.reaction-panel p{font-size:10px;color:#80906d;margin-top:10px;text-align:center}@keyframes reaction-pop{0%{transform:scale(.7) rotate(-12deg)}60%{transform:scale(1.25) rotate(8deg)}100%{transform:scale(1)}}@media(max-width:760px){.reaction-panel{padding:13px 11px}.review-head b{font-size:12px}.review-head span{font-size:10px}.reaction{flex-wrap:wrap;gap:4px;padding:7px 4px;font-size:10px}.reaction .reaction-icon{font-size:21px}.reaction-panel p{font-size:9px}.reaction-choices{gap:6px}}

.reaction-burst{position:absolute;pointer-events:none;left:calc(50% - 25px);bottom:25%;font-size:52px;z-index:5;animation:reaction-toss 1.3s ease-out forwards}@keyframes reaction-toss{0%{transform:translateY(65px) scale(.4) rotate(-20deg);opacity:0}30%{opacity:1;transform:translateY(-20px) scale(1.15) rotate(12deg)}75%{opacity:1}100%{transform:translateY(-95px) scale(.9) rotate(-8deg);opacity:0}}@media(prefers-reduced-motion:reduce){.reaction-burst{animation:none}.reaction.chosen .reaction-icon{animation:none}}

@media(max-width:760px){.toolbar.readonly{display:none}.history-tools .tool{font-size:11px}}

.install-bar{max-width:1140px;margin:0 auto 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#73816a;font-size:12px}.install-bar>div{display:flex;gap:8px}.install-bar .secondary{font-size:12px;min-height:40px;padding:9px 14px}@media(max-width:760px){.install-bar{margin:0 14px 14px}.install-bar>span{display:none}.install-bar>div{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px}.install-bar .secondary{font-size:12px;padding:10px 8px}}

/* Keep the entire entry card usable on shorter laptop screens. */
@media(min-width:761px) and (max-height:780px){.entry-dialog .character-stage{height:180px}.entry-dialog .character-main{width:155px}.entry-dialog .stage-ring{width:160px;height:160px;top:6px}.entry-dialog .cast-option{height:60px}.entry-dialog .customize{margin-top:14px;padding-top:14px;gap:12px}}

/* Restrained controls: one dark primary action, white secondary buttons, violet selection. */
.primary,.secondary{border-radius:8px;font-weight:600;box-shadow:none}.primary:hover{box-shadow:none}.primary span{color:inherit}.secondary{border:1px solid #d7d7dc;color:#444550;background:#fff}.secondary:hover{background:#f4f3f7}.text-btn{color:#686873}.primary:disabled{background:#eeeeF1;color:#92929b;opacity:1}.ready-note{font-size:12px!important;margin:0!important}.player-row.me{background:#f2eff8}.room-state{background:#f1eff6;color:#706778}

.primary.big span{color:inherit}

/* Modal isolation follows the proven document-lock pattern used by GB's class helper. */
dialog{max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;line-height:1.5}
dialog[data-dialog-active="false"]{overflow:hidden}
dialog::backdrop{overscroll-behavior:none}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:14px;line-height:1.5}
button,input,select{font-family:inherit;letter-spacing:0}h1,h2,h3{font-weight:650}.entry-dialog h2{font-weight:650}.input-label{font-weight:550}.primary,.secondary{font-weight:550}button:hover:not(:disabled){transform:none}
@media(max-width:760px){
  .nav{height:56px;margin:0 12px}.brand strong{font-size:19px}.brand-icon{width:31px;height:31px;font-size:24px}.brand strong span{font-size:9px}.text-btn{min-height:36px}
  .intro{padding:16px 14px;gap:10px;grid-template-columns:minmax(0,1fr) 88px}.intro h1{font-size:24px;margin:5px 0;line-height:1.35}.intro p{margin-bottom:6px;line-height:1.65}.friends-art{height:112px}.intro .eyebrow{font-size:9px}
  .install-bar{margin:0 12px 10px}.install-bar .secondary{padding:8px;min-height:36px}.lobby-shell{margin:0 10px 14px;padding:14px;border-radius:14px}.lobby-head{margin-bottom:12px}.lobby-head h2{font-size:19px}.room-card{padding:14px;border-radius:12px}.room-card-top{margin-bottom:8px}.room-glyph{width:31px;height:31px;font-size:21px}.room-card h3{font-size:17px}.room-card>p{margin:5px 0 12px}.room-card-bottom{padding-top:10px}.lobby-shortcuts{gap:12px;padding-top:12px}.practice-shortcut{padding-top:12px}
  .entry-dialog{padding:12px;max-height:calc(100dvh - 20px)}.entry-top{margin-bottom:8px}.entry-top .icon-btn{width:32px;height:32px}.entry-dialog .setup-grid{gap:10px}.entry-dialog .character-card,.entry-dialog .play-card{padding:14px}.entry-dialog .section-label{margin-bottom:8px;gap:8px}.entry-dialog .section-label h2{font-size:16px}.entry-dialog .section-label>span{width:25px;height:25px;font-size:10px}.entry-dialog .section-label>.text-btn{font-size:10px}
  .entry-dialog .character-stage{height:128px}.entry-dialog .character-main{width:104px;transform:translateY(-10px)}.entry-dialog .stage-ring{width:110px;height:110px;top:2px}.entry-dialog .cast-grid{margin-top:8px;gap:5px}.entry-dialog .cast-option{height:48px}.entry-dialog .cast-option .avatar{height:47px;width:45px}.entry-dialog .customize{margin-top:10px;padding-top:10px;gap:10px}.entry-dialog .control-caption{font-size:11px;margin-bottom:6px}.entry-dialog .swatches{gap:8px}.entry-dialog .swatch{width:30px;height:30px}.entry-dialog .hat{min-height:32px;font-size:11px;padding:6px 4px}.entry-dialog .large-input{min-height:44px;padding:10px 12px}.entry-dialog .input-helper{font-size:11px;margin:7px 0 10px}.join-target{padding:11px;margin:10px 0;font-size:12px}.entry-dialog .primary.big{margin-top:8px;min-height:44px;font-size:13px;padding:10px 12px}
  .room-top{margin:10px 0 8px;padding:0 12px}.game-layout{padding:0 8px;gap:8px}.board-heading{padding:9px 12px;min-height:58px;margin-bottom:8px}.board-heading h2{font-size:17px}.canvas-overlay{padding:12px;gap:8px}.canvas-overlay h2{font-size:17px}.canvas-overlay p{font-size:11px;line-height:1.65}.canvas-overlay .party-avatars .avatar{max-height:54px}.players{padding:6px}.player-row{min-width:110px;padding:4px}.player-info b{font-size:11px}.player-info small{font-size:9px}.chat{height:214px;padding:11px}.chat .side-title h2{font-size:14px}.chat-tip{font-size:10px}.board-foot{font-size:10px}.footer{padding:12px;font-size:10px}.footer .text-btn{font-size:10px}
  #info-dialog{width:calc(100% - 24px);padding:24px 20px 18px;max-height:calc(100dvh - 32px);border-radius:16px}#info-dialog h2{font-size:20px;margin-bottom:12px}#info-dialog p{font-size:13px;line-height:1.75;margin-bottom:12px}
}

.kick-btn{font-size:10px;padding:5px 6px;border:1px solid #e1dadd;border-radius:6px;color:#925365;background:#fff;flex-shrink:0}.player-row{flex-wrap:wrap}.player-row .kick-btn{margin-left:auto}
/* Original doodle theme: quiet paper outside the game cards. */
body{background-color:#e8edf8;background-image:linear-gradient(#eef2fa55,#eef2fa55),url('/assets/doodle-background-v1.jpg');background-size:auto,560px 560px;background-repeat:repeat}
.nav{border-color:#bcc7df;background:#f9fbffed;border-radius:0 0 18px 18px;padding:0 24px}.brand-icon{background:#ffe1a6;border-color:#45495b}.intro-copy{background:#f9fbffdf;border:1px solid #cbd4e7;border-radius:20px;padding:18px 22px}.intro h1 span:after{background:#ffe3a2}.lobby-shell{border-color:#cbd4e7;box-shadow:0 5px 0 #7d91b31a}.footer{color:#626d85;background:#f9fbffdf;border-radius:16px;margin-top:20px}.room-top{background:#f9fbffeb;border:1px solid #cbd4e7;border-radius:14px;padding:12px 18px}.primary{background:#506bb9;box-shadow:0 3px 0 #354b8a;border:1px solid #445fa8;border-radius:10px}.primary:hover:not(:disabled){background:#425da7}.secondary{background:#fff;border-color:#bcc8e0;box-shadow:0 2px 0 #dce3ef}button:active:not(:disabled){transform:translateY(2px);box-shadow:none}.primary:disabled{opacity:.55}.panel{border-color:#d6dce9}
@keyframes friend-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes look-pop{from{transform:scale(.94);opacity:.7}to{transform:scale(1);opacity:1}}
.party-avatars .avatar{animation:friend-bob 3.2s ease-in-out infinite}.party-avatars .avatar:nth-child(2n){animation-delay:-1.1s}.party-avatars .avatar:nth-child(3n){animation-delay:-2.1s}.character-main .avatar{animation:look-pop .25s ease-out}.room-card{transition:box-shadow .15s,transform .15s}.room-card:hover{box-shadow:0 4px 0 #cdd6ea;transform:translateY(-2px)}
@media(max-width:760px){body{background-size:auto,440px 440px}.nav{height:56px;padding:0 14px}.intro-copy{padding:12px;border-radius:14px}.intro{gap:10px;padding:14px 12px}.room-top{margin:10px 10px 12px;padding:9px 10px}.footer{margin:12px;border-radius:12px}.party-avatars .avatar{animation-duration:4s}}
@media(prefers-reduced-motion:reduce){.party-avatars .avatar,.character-main .avatar{animation:none}.room-card,button{transition:none}.room-card:hover,button:hover:not(:disabled),button:active:not(:disabled){transform:none}}

.brand-icon{display:block;object-fit:cover;transform:none;border:1px solid #abbce0;border-radius:11px;background:#a7bcf3}.reaction-icon svg,.reaction-burst svg{display:block;width:100%;height:100%}.reaction-icon{width:34px;height:34px}.reaction-burst{width:64px;height:64px}

.confirm-dialog{width:min(420px,calc(100% - 28px));padding:26px;border-radius:20px;border:1px solid #d6dce9;background:#fff;box-shadow:0 18px 60px #29354c33}.confirm-dialog h2{font-size:21px;line-height:1.4;margin:0 38px 12px 0}.confirm-dialog p{font-size:14px;line-height:1.8;color:#687080;margin:0 0 24px}.confirm-actions{display:flex;justify-content:flex-end;gap:10px}.confirm-actions button{min-height:44px;min-width:84px;padding:10px 18px}.confirm-dialog .close-dialog{min-width:36px;min-height:36px}@media(max-width:760px){.confirm-dialog{padding:22px}.confirm-dialog h2{font-size:19px}.confirm-actions button{flex:1}}

/* Seats and chat share the server's current phase; keep the mobile conversation compact. */
body{background-image:linear-gradient(#eef2fabb,#eef2fabb),url('/assets/doodle-background-v1.jpg')}
.game-layout{grid-template-columns:210px minmax(0,1fr) 280px}.toolbar.readonly{display:none}
.seat-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;padding:9px 16px;font-size:13px;color:#555e70;border-radius:14px}.seat-controls small{font-size:12px}.seat-controls button{min-height:40px}.seat-controls .secondary{padding:7px 14px}
.board-column.waiting .canvas-wrap{aspect-ratio:auto;height:400px}.board-column.waiting .board-foot{display:none}
.board-heading h2{letter-spacing:0}.muted,.player-info small{color:#717785}.player-info b{font-size:13px;font-weight:600}.player-info small{font-size:11px}
.chat{height:560px;padding:16px}.chat-log{min-height:0;padding:0 2px;overscroll-behavior:contain}.chat-line{font-size:14px;line-height:1.65;color:#343b49;overflow-wrap:anywhere;padding:9px 10px;margin:3px 0}.chat-line b{font-size:12px;line-height:1.5;color:#677086;font-weight:600;margin-bottom:3px;letter-spacing:0}.chat-line.system,.chat-line.reveal{font-size:12px;line-height:1.6;color:#697283;opacity:1}.chat-line.correct{color:#435684;background:#eef2fc;border-color:#d8e0f3}.chat-tip{color:#747c8a;font-size:11px}#guess-input{background:#f7f8fb;color:#333b4b;min-height:44px;font-size:16px}#guess-input::placeholder{color:#82899a;font-size:14px}#guess-form button{min-height:44px}
@media(min-width:761px) and (max-width:1130px){.game-layout{grid-template-columns:180px minmax(0,1fr) 250px;gap:12px;padding:0 12px}}
@media(max-width:760px){.game-layout{grid-template-columns:minmax(0,1fr)}.seat-controls{padding:7px 12px;margin-bottom:8px;font-size:12px}.seat-controls small{max-width:160px;font-size:11px}.board-column.waiting .canvas-wrap{height:300px}.canvas-overlay p{font-size:12px}.player-row{min-width:138px}.player-info b{font-size:12px}.player-info small{font-size:11px}.chat{height:250px;padding:12px}.chat-line{font-size:14px;padding:6px 9px;margin:2px 0}.chat-line b{font-size:12px}.chat-line.system,.chat-line.reveal{font-size:12px}.chat-tip{font-size:10px}}