/* KOKO presentation only. No layout transform is applied to canvases or input coordinates. */
body.koko-ui{--k-bg:#f5f4f8;--k-paper:#fff;--k-line:#e4e1eb;--k-ink:#302d43;--k-muted:#746f86;--k-accent:#7154c6;background:var(--k-bg)!important;color:var(--k-ink)!important;font-family:'Malgun Gothic',system-ui,sans-serif;margin:0;padding:24px;display:block;min-height:100vh;}
.koko-ui :is(.container,.app,.wrap){width:100%;max-width:1400px!important;margin:0 auto;padding:0;background:transparent!important;border:0!important;box-shadow:none!important;}
.koko-ui :is(h1,h2,h3){color:var(--k-ink);letter-spacing:-.6px;}
.koko-ui h1{font-size:26px;text-align:left;margin:0 0 24px;line-height:1.4;}
.koko-ui :is(.card,.panel,.game-chat-panel,.leaderboard){background:var(--k-paper)!important;color:var(--k-ink);border:1px solid var(--k-line)!important;border-radius:16px;box-shadow:none;padding:20px;min-width:0;}
.koko-ui :is(.panel h3,.card h3){color:var(--k-ink);border-color:var(--k-line);font-size:16px;}
.koko-ui :is(button,.btn):not(.rummi-tile):not(.tile){font-family:inherit;border-radius:9px;border:1px solid transparent;font-size:13px;line-height:1.35;padding:10px 16px;min-height:38px;background:#eee9f8;color:#594390;box-shadow:none;transition:background .15s;}
.koko-ui :is(button,.btn):not(.rummi-tile):not(.tile):hover:not(:disabled){filter:brightness(.97);transform:none;}
.koko-ui :is(button,input,select):focus-visible{outline:3px solid #b5a2e4;outline-offset:2px;}
.koko-ui button:not(.rummi-tile):not(.tile):disabled{opacity:.5;cursor:default;}
.koko-ui :is(.btn-main,.btn-blue,.start,.cardBtn,.app button:not(.danger):not(.rummi-tile):not(.tile)){background:var(--k-accent);color:white;}
.koko-ui :is(.btn-danger,.danger){background:#fae9e9;color:#a13e4c;}
.koko-ui :is(input[type=text],input[type=password],input[type=number],input:not([type]),select,textarea){background:white!important;color:var(--k-ink)!important;border:1px solid #d9d3e4!important;border-radius:9px;padding:10px 12px;font-family:inherit;max-width:100%;min-width:0;}
.koko-ui :is(.small,.muted,.tag):where(:not(.rummi-tile)){color:var(--k-muted);}
.koko-ui :is(.status-bar,#quizAccountBar,#quizSideLeft,#who,.versionBadge){display:none!important;}
.koko-ui :is(button[onclick*="parent.Koko.home"],button[onclick="handleLogout()"],button[onclick="logout()"]){display:none!important;}
.koko-ui :is(#view-lobby):not(.hidden)>div:has(#my-profile-name),.koko-ui #view-lobby>div:has(#my-name):not(.lobby-grid){display:none!important;}
/* Keep hidden IDs alive for existing renderers. Hide the redundant navigation panel only. */
.koko-ui .lobby-grid>.panel:has(#left-panel-title),.koko-ui .lobby-grid>.panel:has(#ranking-list):has([onclick*="parent.Koko.home"]){display:none!important;}
.koko-ui .lobby-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px!important;gap:20px;}
.koko-ui .lobby-grid>.panel{height:480px;max-height:none;}
.koko-ui .room-list-box{max-height:400px;}
.koko-ui :is(.room-item,.user-item,.rank-item){background:#f7f5fb!important;border:1px solid var(--k-line);color:var(--k-ink);border-radius:10px;padding:12px;margin-bottom:8px;gap:12px;overflow-wrap:anywhere;}
.koko-ui :is(.room-item,.user-item) span{color:inherit;}
.koko-ui :is(.chat-msgs,.game-chat-msgs){background:#faf9fc;border-radius:10px;padding:12px;color:var(--k-ink);}
.koko-ui .game-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px;align-items:start;}
.koko-ui .game-chat-panel{height:560px;}
.koko-ui :is(.board-wrapper){max-width:620px;}
.koko-ui :is(.room-layout){gap:20px;}
.koko-ui [style*="color:#66fcf1"],.koko-ui [style*="color: #66fcf1"]{color:var(--k-accent)!important;}
/* Party games: rooms first, online participants second. No global member directory. */
.koko-ui .app>header{background:transparent;border:0;box-shadow:none;padding:0;margin-bottom:24px;}
.koko-ui .app>header h1{margin-bottom:8px;}
.koko-ui .app>header .tag{display:none;}
.koko-ui #lobby>.grid{grid-template-columns:minmax(0,1fr) 280px;gap:20px;}
.koko-ui #lobby>.grid>aside:has(#members){display:none!important;}
.koko-ui #lobby>.grid>main{min-height:360px;}
.koko-ui .app :is(.empty,.list-item){background:#f7f5fb;color:var(--k-muted);border-color:var(--k-line);}
.koko-ui .app.rummi-app-wide{width:100%;max-width:1400px!important;}
/* The wood board, card faces, pieces and animation geometry keep their own styling. */
.koko-ui[data-koko-game=yut] .game-layout{grid-template-columns:minmax(0,1fr) 260px;}
.koko-ui[data-koko-game=yut] .battle-board-layout{grid-template-columns:110px minmax(300px,1fr) 110px;gap:12px;}
.koko-ui[data-koko-game=solitaire] .lobby-grid{grid-template-columns:minmax(0,1fr) 280px!important;}
.koko-ui[data-koko-game=solitaire] .game-top>div:first-child{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-bottom:22px;margin-bottom:14px;border-bottom:1px solid var(--k-line);}
.koko-ui[data-koko-game=solitaire] .game-top button[onclick="startNewGame()"]{order:10;margin-left:auto;border:1px solid #dfc5c9;background:#fff5f5;color:#973b48;}
/* Quiz has meaningful type selection and quiz-local Back: preserve both. */
.koko-ui[data-koko-game=quizbank]{background:var(--k-bg)!important;}
.koko-ui[data-koko-game=quizbank] :is(.info,.versionBadge,.brand p,.hero p,.sectionTitle>span){display:none!important;}
.koko-ui[data-koko-game=quizbank] #quizSideRight{position:static;max-width:1400px;width:100%;margin:0 auto 20px;background:white;color:var(--k-ink);border:1px solid var(--k-line);border-radius:12px;padding:12px;}
.koko-ui[data-koko-game=quizbank] .hero{background:#eee9f8;border:0;border-radius:16px;padding:28px 32px;}
.koko-ui[data-koko-game=quizbank] .hero h2{color:#473466;font-size:36px;}
.koko-ui[data-koko-game=quizbank] :is(.card h4,.card p,.leaderHead h3,.sectionTitle h3,.question,.q){color:var(--k-ink);}
.koko-ui[data-koko-game=quizbank] .card{background:white!important;}
.koko-ui[data-koko-game=quizbank] :is(.rankEmpty,.rankItem,.rankMeta){color:var(--k-muted);background:transparent;}
@media(max-width:1050px){.koko-ui .lobby-grid,.koko-ui #lobby>.grid{grid-template-columns:minmax(0,1fr) 230px!important;}.koko-ui .game-layout{grid-template-columns:minmax(0,1fr) 230px!important;}.koko-ui[data-koko-game=yut] .game-layout{grid-template-columns:1fr!important;}}
@media(max-width:760px){body.koko-ui{padding:14px;}.koko-ui .lobby-grid,.koko-ui #lobby>.grid,.koko-ui .game-layout{grid-template-columns:1fr!important;}.koko-ui .lobby-grid>.panel{height:auto;min-height:200px;}.koko-ui[data-koko-game=yut] .battle-board-layout{grid-template-columns:1fr;}.koko-ui :is(.card,.panel){padding:14px;}}
/* Platform shell: retain the original outer geometry whenever Volleyball is loaded. */
.koko-platform:not(:has(#game-frame[src*="/volleyball/"]))>header{height:68px;}
.koko-platform:not(:has(#game-frame[src*="/volleyball/"]))>main{max-width:1456px;padding:24px 28px;}
.koko-platform:not(:has(#game-frame[src*="/volleyball/"])) #environment{display:none;}
.koko-platform:not(:has(#game-frame[src*="/volleyball/"])) #status:empty{display:none;}
.koko-platform:not(:has(#game-frame[src*="/volleyball/"])) #game-view nav>span{display:none;}
.koko-platform:not(:has(#game-frame[src*="/volleyball/"])) #game-frame{height:calc(100vh - 152px);min-height:560px;background:#f5f4f8;}
.koko-platform .update small{display:none;}
.koko-platform .login-layout{min-height:560px;}
.koko-ui .app :is(.item,.notice){background:#f7f5fb!important;color:var(--k-muted);border-color:var(--k-line);}
.koko-ui .app #online :is(.tag,.small){color:#397763!important;}
.koko-ui[data-koko-game=quizbank] :is(.hero,.panel,#quizSideRight,.card){box-shadow:none!important;backdrop-filter:none;}
.koko-ui[data-koko-game=quizbank] .top #status{display:none;}
.koko-ui[data-koko-game=solitaire] .lobby-grid{display:flex;gap:20px;}
.koko-ui[data-koko-game=solitaire] .lobby-grid>.panel{flex:1;}
.koko-ui .game-top button{width:auto;}
/* Compact game headers without changing board coordinates or piece sizing rules. */
.koko-ui:has(#view-game:not(.hidden)) .container>h1{display:none;}
.koko-ui:has(#view-game:not(.hidden)){padding-top:14px;}
.koko-ui:is([data-koko-game=othello],[data-koko-game=omok],[data-koko-game=chess],[data-koko-game=janggi]) .board-wrapper{width:min(100%,620px,calc(100vh - 155px));}
.koko-ui .app :is(.player,.chat,.map-box,.baseball-setup,.baseball-info,.baseball-ai-box){background:#f4f1f9;color:var(--k-ink);border-color:var(--k-line);}
.koko-ui .app :is(.map-title,.chat b){color:#594390;}
.koko-ui[data-koko-game=rummikub] :is(.rummi-title,.rummi-table h3){color:#fff;}
.koko-ui[data-koko-game=solitaire] .side-panel{background:#f4f1f9;color:var(--k-ink);border:1px solid var(--k-line);}
.koko-ui[data-koko-game=solitaire] .side-panel :is(h3,.help){color:var(--k-ink);}
.koko-ui[data-koko-game=solitaire] .game-top>div:first-child::before{content:'';flex-basis:100%;order:-2;}
.koko-ui[data-koko-game=solitaire] .game-top button[onclick="startNewGame()"]{order:-3;margin:0 0 10px auto;}
.koko-ui[data-koko-game=quizbank]:has(:is(.quiz,.setup,.result).show) .hero{display:none;}
.koko-ui[data-koko-game=quizbank] :is(.questionBox,.rankRow,.nicknameBox){background:#f4f1f9!important;color:var(--k-ink);}
.koko-ui[data-koko-game=quizbank] :is(label,.questionLabel,.hint,.rankName){color:var(--k-muted);}
.koko-ui #game-turn-badge{background:#eee9f8!important;border-color:var(--k-line)!important;}
.koko-ui[data-koko-game=janggi] .board-wrapper{width:min(100%,620px,calc((100vh - 165px) * .86));}
.koko-ui[data-koko-game=quizbank] .panel.quiz{max-width:1200px;}
.koko-ui[data-koko-game=quizbank] .playCard{max-width:1000px;background:#f4f1f9;border-color:var(--k-line);}
.koko-ui[data-koko-game=quizbank] .answerArea{background:#eee9f8;}
.koko-ui[data-koko-game=quizbank] :is(.badge,.quizTop){color:#594390;}
.koko-ui dialog{background:white;color:var(--k-ink);border:1px solid var(--k-line);border-radius:16px;padding:24px;}
/* Shared chat contrast. Scope excludes volleyball and does not change chat events. */
.koko-ui :is(.chat,.chat-msgs,.chat-messages,.game-chat-msgs,#lobby-chat-msgs,#room-chat-msgs,#game-chat-msgs){background:#faf9fc!important;color:#302d43!important;line-height:1.65;}
.koko-ui :is(.chat-msg,.chat p,.chat .mine,.chat-messages li){color:#302d43!important;}
.koko-ui :is(.chat-msg .sender,.chat p b,.chat-messages .sender){color:#594090!important;font-weight:700;}
.koko-ui :is(.chat .mine,.chat-msg.mine){background:#eee8f7;border-radius:6px;padding:4px 7px;}
.koko-ui :is(.chat-msg.whisper){background:#f6eddb!important;color:#674722!important;border-left-color:#a27838;}
.koko-ui :is(.chat,.chat-msg,.chat-messages,.game-chat-msgs) :is(time,small,.time,.timestamp,.system,.system-message){color:#625c70!important;}
.koko-ui :is(.chat-msg.system,.chat p.system){color:#625c70!important;}
.koko-ui :is(input[id*="chat"],input[id*="Chat"],textarea[id*="chat"]){color:#302d43!important;background:#fff!important;caret-color:#594090;}
.koko-ui :is(input[id*="chat"],input[id*="Chat"],textarea[id*="chat"])::placeholder{color:#6c657a!important;opacity:1;}
.koko-ui :is(input[id*="chat"],input[id*="Chat"],textarea[id*="chat"]):is(:hover,:focus){color:#302d43!important;background:#fff!important;}

/* Final visual polish. Game elements retain their native dimensions and event targets. */
.koko-ui :is(button,.btn):not(.rummi-tile):not(.tile){white-space:nowrap;}
.koko-ui :is(h2,h3){line-height:1.4;}
.koko-ui h2{font-size:22px;margin:0 0 16px;}
.koko-ui .small{line-height:1.6;}
.koko-ui :is(.chat,.game-chat-panel) button{width:auto;flex:0 0 auto;min-width:60px;padding-inline:12px;}
.koko-ui :is(.chat,.game-chat-panel) input{flex:1;min-width:0;}
.koko-ui .card .card{box-shadow:none;border-color:transparent!important;}
.koko-ui .lobby-grid>.panel{height:clamp(320px,55vh,440px);}
.koko-ui .app #roomView>.card>.top{gap:12px;align-items:center;}
.koko-ui .app #roomView>.card>.grid{gap:14px;}
.koko-ui .app .map-box{border-width:0;border-radius:10px;}
.koko-ui .app .notice{line-height:1.6;}
.koko-ui .app :is(.player,.item){border-radius:10px;}
/* Board games: quieter surrounding chrome, unchanged board dimensions. */
.koko-ui:is([data-koko-game=othello],[data-koko-game=omok],[data-koko-game=chess],[data-koko-game=janggi]) #view-game{padding:12px;}
.koko-ui:is([data-koko-game=omok],[data-koko-game=chess],[data-koko-game=janggi]) .game-chat-panel{height:min(560px,calc(100vh - 105px));padding:14px;}
.koko-ui:is([data-koko-game=othello],[data-koko-game=omok],[data-koko-game=chess],[data-koko-game=janggi]) :is(.score-board,.timer-box){color:#edf2f8;}
.koko-ui[data-koko-game=othello] .othello-board{background:#204d3e;border-color:#163d30;}
.koko-ui[data-koko-game=othello] .cell{background:#397957;}
.koko-ui[data-koko-game=othello] .cell:hover{background:#478969;}
.koko-ui[data-koko-game=othello] .stone{box-shadow:0 2px 4px #0006,inset 0 1px 2px #ffffff55;}
.koko-ui[data-koko-game=othello] .stone.blue{background:radial-gradient(circle at 32% 28%,#6ca5da,#244e7c);}
.koko-ui[data-koko-game=othello] .stone.red{background:radial-gradient(circle at 32% 28%,#e58680,#953e45);}
.koko-ui[data-koko-game=othello] .score-board{background:#233a34;}
.koko-ui[data-koko-game=chess] .chess-piece.white-piece{-webkit-text-stroke:.65px #4e433a;text-shadow:0 1px 1px #0005;}
.koko-ui[data-koko-game=chess] :is(.rank-label,.file-label){font-size:11px;opacity:1;}
.koko-ui[data-koko-game=chess] .chess-cell.light :is(.rank-label,.file-label){color:#715238;}
.koko-ui[data-koko-game=chess] .chess-cell.dark :is(.rank-label,.file-label){color:#fff1da;}
.koko-ui[data-koko-game=chess] .chess-cell.selected{box-shadow:inset 0 0 0 3px #337a64;}
.koko-ui[data-koko-game=chess] .move-dot{background:#234d3fb3;}
/* Zero min-content tracks keep all nine columns inside the board. cqw follows the board, not the viewport. */
.koko-ui[data-koko-game=janggi] .board-wrapper{container-type:inline-size;}
.koko-ui[data-koko-game=janggi] .janggi-board{grid-template-columns:repeat(9,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));}
.koko-ui[data-koko-game=janggi] .janggi-cell{min-width:0;min-height:0;}
.koko-ui[data-koko-game=janggi] .janggi-piece{font-size:clamp(14px,7.1cqw,44px);min-width:0;box-shadow:inset 0 1px 2px #fff9,0 2px 2px #57392355;}
/* Yut: text only inside the board stage. Geometry and animation selectors are untouched. */
.koko-ui[data-koko-game=yut] :is(.yut-stage,.player-slot,.player-strip){color:#edf2f8;}
.koko-ui[data-koko-game=yut] .yut-stage :is(h3,.small){color:#dce5ef;}
.koko-ui[data-koko-game=yut] #turn-banner{color:#fff0c4;font-weight:900;letter-spacing:-.3px;}
/* Baseball: clear numeric evidence and a stable one-line submit. */
.koko-ui[data-koko-game=baseball] :is(.baseball-info b,.baseball-number-input,.baseball-history-row b){font-family:Consolas,monospace;font-variant-numeric:tabular-nums;letter-spacing:2px;}
.koko-ui[data-koko-game=baseball] .baseball-info{background:#243844!important;color:#edf4f5!important;}
.koko-ui[data-koko-game=baseball] .baseball-info b{color:#fff;}
.koko-ui[data-koko-game=baseball] .baseball-guess-row button{flex:0 0 auto;min-width:116px;}
.koko-ui[data-koko-game=baseball] .baseball-history{border-color:#dce4e5;background:#fff;}
.koko-ui[data-koko-game=baseball] .baseball-history-row{border-color:#e5eaeb;align-items:center;color:#344a52;font-size:14px;}
.koko-ui[data-koko-game=baseball] .baseball-history-row:nth-child(even){background:#f1f6f5;}
/* Davinci has red/blue identities in the actual game. Preserve those as number accents on ivory/slate tiles. */
.koko-ui[data-koko-game=davinci] .tile{display:inline-flex;align-items:center;justify-content:center;flex:0 0 48px;width:48px;min-width:48px;height:66px;padding:0;border:1px solid #c9c0aa;border-radius:7px;background:#fff9e9;box-shadow:0 2px 2px #30251525;font:800 21px/1 Consolas,monospace;}
.koko-ui[data-koko-game=davinci] .tile.red{color:#b5313f;}
.koko-ui[data-koko-game=davinci] .tile.blue{background:#243443;color:#8ac8ff;border-color:#536879;}
.koko-ui[data-koko-game=davinci] button.tile:hover{filter:brightness(1.08);outline:2px solid #a38751;outline-offset:2px;}
.koko-ui[data-koko-game=davinci] .tile.davinci-revealed{background:#edf3e9!important;border:2px solid #78936f!important;box-shadow:none!important;transform:none!important;}
.koko-ui[data-koko-game=davinci] .tile.red.davinci-revealed{color:#b5313f!important;}
.koko-ui[data-koko-game=davinci] .tile.blue.davinci-revealed{color:#1c6095!important;}
.koko-ui[data-koko-game=davinci] .davinci-ai-box{background:#edf2f5;color:#334652;border-color:#d8e1e5;}
/* Party play screens: the role and prompt lead; host controls are secondary. */
.koko-ui:is([data-koko-game=liar],[data-koko-game=mafia]) #gameArea>.turn-banner{padding:22px;border:1px solid #d6dfd7;border-left:4px solid #65816c;background:#f0f5ef;color:#304e3b;font-size:20px;line-height:1.6;border-radius:12px;box-shadow:none;}
.koko-ui[data-koko-game=liar] #gameArea>.turn-banner b{font-size:28px;}
.koko-ui[data-koko-game=liar] #gameArea .map-box button{background:#e7e5ed;color:#615b70;}
.koko-ui[data-koko-game=liar] #gameArea .players{display:flex;gap:10px;flex-wrap:wrap;}
.koko-ui[data-koko-game=liar] #gameArea .players button{min-width:120px;min-height:46px;flex:1;}
/* The original full heading remains in the DOM; only its visible presentation omits the build suffix. */
.koko-ui[data-koko-game=mafia] #gameArea>h2{font-size:0;}
.koko-ui[data-koko-game=mafia] #gameArea>h2::after{content:'🌙 마피아 게임';font-size:22px;}
.koko-ui[data-koko-game=mafia] #gameArea:has([onclick*=Night])>.turn-banner{background:#eef0f6;color:#3b4660;border-color:#cdd4e3;border-left-color:#657597;}
.koko-ui[data-koko-game=mafia] #gameArea .notice h3{font-size:19px;}
/* Rummikub: tile classes come exclusively from the original game stylesheet. */
.koko-ui[data-koko-game=rummikub] .rummi-tile{background:linear-gradient(#fffdf5,#eee6cf);box-shadow:0 2px 3px #0004;}
.koko-ui[data-koko-game=rummikub] .rummi-avatar-name{color:#f0f4fc;}
.koko-ui[data-koko-game=rummikub] .rummi-board{min-height:0;padding:12px;}
.koko-ui[data-koko-game=rummikub] .rummi-main .rummi-table{height:clamp(170px,calc(100vh - 445px),410px);min-height:170px;overflow:auto;}
.koko-ui[data-koko-game=rummikub] .rummi-rack{padding:9px 10px 10px;margin-top:10px;}
.koko-ui[data-koko-game=rummikub] .rummi-rack-title{margin-bottom:4px;}
.koko-ui[data-koko-game=rummikub] .rummi-actions{margin-top:8px;}
.koko-ui[data-koko-game=rummikub] #gameArea{padding:12px;}
.koko-ui[data-koko-game=rummikub]:has(.rummi-board) .app>header{display:none;}
.koko-ui[data-koko-game=rummikub] .rummi-help{color:#d5e1ed;font-size:11px;line-height:1.5;}
/* Solitaire: a single toolbar; the felt, cards and all play/recording code are unchanged. */
.koko-ui[data-koko-game=solitaire] .game-top{gap:8px;margin-bottom:12px;flex-wrap:nowrap;}
.koko-ui[data-koko-game=solitaire] .game-top>div:first-child{gap:6px;padding:0;margin:0;border:0;flex:1;flex-wrap:nowrap;}
.koko-ui[data-koko-game=solitaire] .game-top>div:first-child::before{content:none;}
.koko-ui[data-koko-game=solitaire] .game-top button{padding:9px 11px;}
.koko-ui[data-koko-game=solitaire] .game-top button[onclick='startNewGame()']{order:0;flex-shrink:0;margin:0;background:#fff4df;border-color:#d4bd87;color:#654c21;}
.koko-ui[data-koko-game=solitaire] .timer-box{font-variant-numeric:tabular-nums;background:#073f31;color:#f2f8f4;white-space:nowrap;}
/* Quiz: the compact people strip yields space to question and answer. */
.koko-ui[data-koko-game=quizbank] #quizSideRight{display:flex!important;align-items:center;gap:14px;padding:8px 14px;margin-bottom:12px;max-height:90px;}
.koko-ui[data-koko-game=quizbank] .sideTitle{margin:0;font-size:12px;white-space:nowrap;}
.koko-ui[data-koko-game=quizbank] #qOnlineList{display:flex;gap:6px 14px;flex-wrap:wrap;}
.koko-ui[data-koko-game=quizbank] .onlineRow{border:0;padding:3px 0;font-size:12px;}
.koko-ui[data-koko-game=quizbank] .footer{display:none;}
.koko-ui[data-koko-game=quizbank]:has(.quiz.show) .top{margin-bottom:8px;}
.koko-ui[data-koko-game=quizbank] .panel.quiz{margin-top:8px;padding:16px;}
.koko-ui[data-koko-game=quizbank] .quiz .progress{margin:10px 0 14px;}
.koko-ui[data-koko-game=quizbank] .questionBox{padding:14px 10px;}
.koko-ui[data-koko-game=quizbank] .question{text-shadow:none;}
.koko-ui[data-koko-game=quizbank] .answerArea{padding:12px;background:#f4f1f9;}
.koko-ui[data-koko-game=quizbank] .answerRow .btn{background:#7154c6;color:#fff;}
@media(min-width:761px) and (max-height:760px){
 .koko-ui:not([data-koko-game=yut]){padding:12px;}
 .koko-ui .app>header{margin-bottom:12px;}
 .koko-ui .game-layout{gap:12px;}
 .koko-ui[data-koko-game=rummikub] .rummi-main .rummi-table{height:170px;}
 .koko-ui[data-koko-game=quizbank] .question{font-size:56px;margin:10px 0;}
}

/* Remove only the repeated page heading once party gameplay is mounted. */
.koko-ui:is([data-koko-game=baseball],[data-koko-game=davinci],[data-koko-game=liar],[data-koko-game=mafia]):has(#gameArea h2) .app>header{display:none;}
.koko-ui:is([data-koko-game=baseball],[data-koko-game=davinci],[data-koko-game=liar],[data-koko-game=mafia]) #roomView>.card>.grid>.card{padding:14px;}
.koko-ui[data-koko-game=mafia] #gameArea>h2{letter-spacing:0;}
.koko-ui[data-koko-game=mafia] #gameArea>h2::after{letter-spacing:-.6px;}
.koko-ui[data-koko-game=rummikub] #roomView>.card>.grid{margin-top:8px;}
.koko-ui[data-koko-game=rummikub] #roomView>.card>.grid>main.card{padding:0;}
.koko-ui[data-koko-game=rummikub] .rummi-badge{color:#e6edf6;}
.koko-ui[data-koko-game=rummikub] .rummi-clock{color:#ffda7a;}
.koko-ui[data-koko-game=rummikub] .rummi-topbar{margin-bottom:8px;}
.koko-ui[data-koko-game=rummikub] .rummi-main>.notice{margin:6px 0 8px;padding:8px 10px;font-size:13px;}
.koko-ui[data-koko-game=yut] .roster-id{color:#edf2f8;}
@media(min-width:761px) and (max-height:760px){
 .koko-ui[data-koko-game=rummikub] #gameArea{padding:4px;}
 .koko-ui[data-koko-game=rummikub] .rummi-main .rummi-table{height:150px;min-height:150px;}
 .koko-ui[data-koko-game=rummikub] .rummi-actions>.notice{padding:8px;font-size:12px;}
}

.koko-ui[data-koko-game=othello] #turn-indicator{color:#eff6f2!important;}
.koko-ui[data-koko-game=othello] .score-box:first-child{color:#a6d4ff!important;}
.koko-ui[data-koko-game=othello] .score-box:last-child{color:#ffb0a7!important;}

@media(min-width:761px) and (max-height:760px){
 .koko-ui[data-koko-game=davinci] #roomView>.card{padding:12px;}
 .koko-ui[data-koko-game=davinci] .turn-banner{padding:12px;margin-bottom:10px;}
 .koko-ui[data-koko-game=davinci] #gameArea>.notice{margin:8px 0;padding:10px;}
 .koko-ui[data-koko-game=davinci] #gameArea h2{margin-bottom:10px;}
}

/* Rummikub color is game information, including non-interactive tiles. */
.koko-ui[data-koko-game=rummikub] .rummi-tile{opacity:1;filter:none;}
.koko-ui[data-koko-game=rummikub] .rummi-table.rummi-board-paused{filter:none;}
.koko-ui[data-koko-game=rummikub] .rummi-table .rummi-tile[draggable="false"]{cursor:default;}
.koko-ui[data-koko-game=rummikub] .rummi-draw-btn{min-height:44px;padding:12px 18px;cursor:pointer;touch-action:manipulation;}
.koko-ui[data-koko-game=rummikub] .rummi-draw-btn:disabled{opacity:1;cursor:progress;background:#5f4b99;}

/* Presentation metadata only; tile faces retain their original colors. */
.koko-ui[data-koko-game=rummikub] .rummi-table .rummi-last-played{outline:3px solid #d5a521;outline-offset:1px;box-shadow:0 0 6px #d5a52155;}
.koko-ui[data-koko-game=rummikub] .rummi-highlight-legend,.koko-ui[data-koko-game=rummikub] .rummi-preview-status{font-size:12px;margin:6px 0;color:#e8f2ff;}

.koko-ui[data-koko-game=solitaire] #undo-btn::after{content:" Ctrl+Z";font-size:10px;font-weight:500;margin-left:4px;}
