:root{--card-red:#c52e45}
:root{--host-idle-fg:#65e3b8;--host-idle-border:#3d8f78;--host-idle-surface:#1e493f;}
:root{--host-primary-fg:#ff7286;--host-primary-border:#a55363;--host-primary-surface:#4c2934;}
/* Current layouts, typography and behavior are shared with Light. */
:root[data-theme="dark"]{color-scheme:dark}
:root[data-theme="dark"]{--ink:#171e1c;--panel:#25322d;--panel2:#34463e;--mint:#7ddbc0;--mint2:#7ddbc0;--coral:#f392a1;--paper:#eaf1eb;--muted:#b3c4b9;--line:#4c6256;--gold:#f6cf65;--shadow:0 16px 40px #00000066}
:root[data-theme="dark"]{--metric-rating:#b3c4b9;--metric-xp:var(--gold);--metric-credit:var(--gold)}
:root[data-theme="dark"],:root[data-theme="dark"] body,:root[data-theme="dark"] #app{background:var(--ink);color:var(--paper)}
:root[data-theme="dark"] body{background:radial-gradient(circle at 80% 10%,var(--panel) 0,transparent 35%),radial-gradient(circle at 25% 90%,var(--panel) 0,transparent 40%),var(--ink)}
:root[data-theme="dark"] .brand-mark{background:var(--mint);color:var(--panel);box-shadow:inset 0 -5px #31a890}
:root[data-theme="dark"] .brand-mark:after{color:var(--panel)}
:root[data-theme="dark"] .nav-title{color:var(--muted)}
:root[data-theme="dark"] .nav-btn{color:var(--muted)}
:root[data-theme="dark"] .nav-btn:hover,:root[data-theme="dark"] .nav-btn.active{background:var(--line);color:#fff}
:root[data-theme="dark"] .nav-btn .hash{color:var(--muted)}
:root[data-theme="dark"] .side-foot{border-top:1px solid var(--line)}
:root[data-theme="dark"] .status-dot{background:var(--mint);box-shadow:0 0 10px var(--mint)}
:root[data-theme="dark"] .top{border-bottom:1px solid var(--panel2);background:#171e1cd9}
:root[data-theme="dark"] .header-icon-btn{border:1px solid var(--line);background:var(--panel);color:var(--paper)}
:root[data-theme="dark"] .header-icon-btn:hover{background:var(--panel2)}
:root[data-theme="dark"] .reaction-menu{border:1px solid var(--line);background:#34463ef2;box-shadow:0 16px 34px #00000080}
:root[data-theme="dark"] .reaction-menu button:hover,:root[data-theme="dark"] .reaction-menu button:focus-visible{background:#ffffff17}
:root[data-theme="dark"] .eyebrow{color:var(--mint2)}
:root[data-theme="dark"] .hero p{color:var(--muted)}
:root[data-theme="dark"] .game-card{background:linear-gradient(145deg,var(--panel2),var(--panel2));border:1px solid var(--line);box-shadow:var(--shadow)}
:root[data-theme="dark"] .game-card:hover{border-color:var(--muted)}
:root[data-theme="dark"] .thumb{background:#d8faf3}
:root[data-theme="dark"] .game-card p{color:var(--muted)}
:root[data-theme="dark"] .mini-grid{box-shadow:0 8px 20px #27475f44}
:root[data-theme="dark"] .mini-grid i{background:#dff9f4}
:root[data-theme="dark"] .mini-grid i:nth-child(16n+2),:root[data-theme="dark"] .mini-grid i:nth-child(16n+4),:root[data-theme="dark"] .mini-grid i:nth-child(16n+6),:root[data-theme="dark"] .mini-grid i:nth-child(16n+8),:root[data-theme="dark"] .mini-grid i:nth-child(16n+9),:root[data-theme="dark"] .mini-grid i:nth-child(16n+11),:root[data-theme="dark"] .mini-grid i:nth-child(16n+13),:root[data-theme="dark"] .mini-grid i:nth-child(16n+15){background:#4bc5aa}
:root[data-theme="dark"] .mini-grid b{background:#26384c;box-shadow:inset 0 -3px #152437}
:root[data-theme="dark"] .mini-grid b.light{background:#fff;box-shadow:inset 0 -3px #c9d7d5}
:root[data-theme="dark"] .ship-thumb{background:linear-gradient(#d8faf3,#bceee6)}
:root[data-theme="dark"] .ship-shape{background:#7b2bb9;box-shadow:inset 0 -4px #5e1e91}
:root[data-theme="dark"] .ship-b{background:#f14c69}
:root[data-theme="dark"] .ship-c{background:#354ba7}
:root[data-theme="dark"] .panel{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
:root[data-theme="dark"] .panel .sub{color:var(--muted)}
:root[data-theme="dark"] .label{color:var(--muted)}
:root[data-theme="dark"] .input{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .input:focus{border-color:var(--mint)}
:root[data-theme="dark"] .seg{background:var(--panel)}
:root[data-theme="dark"] .seg button.active{background:var(--panel2);box-shadow:0 2px 10px #0003}
:root[data-theme="dark"] .primary,:root[data-theme="dark"] .danger{color:var(--panel);box-shadow:inset 0 -4px var(--button-edge)}
:root[data-theme="dark"] .primary{--button-edge:#2fa78d;background:var(--mint)}
:root[data-theme="dark"] .secondary{background:var(--panel2);border:1px solid var(--line)}
:root[data-theme="dark"] .danger{--button-edge:#c43d63;background:var(--coral)}
:root[data-theme="dark"] .or{color:var(--muted)}
:root[data-theme="dark"] .or:before,:root[data-theme="dark"] .or:after{background:var(--line)}
:root[data-theme="dark"] .error{background:#6d2940;color:#ffdce4}
:root[data-theme="dark"] .room-code{color:var(--mint2);background:var(--panel)}
:root[data-theme="dark"] .scorebar{background:var(--panel);border:1px solid var(--panel2)}
:root[data-theme="dark"] .avatar{background:var(--paper);border:4px solid #d8e9e5}
:root[data-theme="dark"] .player.right .avatar{background:var(--coral);border-color:#f68ca0}
:root[data-theme="dark"] .turn-badge{background:var(--panel2);color:var(--muted)}
:root[data-theme="dark"] .turn-badge.live{background:var(--mint);color:var(--panel)}
:root[data-theme="dark"] .room-pill{color:var(--muted)}
:root[data-theme="dark"] .game-tools .hint{color:var(--muted)}
:root[data-theme="dark"] .board-card{background:var(--panel2);border:1px solid var(--line);box-shadow:var(--shadow)}
:root[data-theme="dark"] .board-title{background:var(--panel2)}
:root[data-theme="dark"] .grid{background:var(--panel)}
:root[data-theme="dark"] .cell{background:var(--panel)}
:root[data-theme="dark"] .sea .cell{background:var(--panel)}
:root[data-theme="dark"] .sea .cell:after{background:var(--panel2)}
:root[data-theme="dark"] .sea.enemy .cell:hover{background:var(--panel2)}
:root[data-theme="dark"] .sea.enemy .cell:hover:after{background:var(--mint)}
:root[data-theme="dark"] .cell.ship{background:var(--panel2)}
:root[data-theme="dark"] .cell.ship:before{background:var(--line);box-shadow:inset 0 -4px var(--line)}
:root[data-theme="dark"] .cell.hit:before{color:#ffcf55;text-shadow:0 2px #a94836}
:root[data-theme="dark"] .cell.miss:before{color:var(--paper)}
:root[data-theme="dark"] .cell.sunk{background:#4b2334}
:root[data-theme="dark"] .fleet{background:var(--panel)}
:root[data-theme="dark"] .fleet-chip{background:#6941bd}
:root[data-theme="dark"] .fleet-chip.sunk{background:#7c4051}
:root[data-theme="dark"] .checkerboard{border:8px solid #26394e;box-shadow:var(--shadow)}
:root[data-theme="dark"] .checkerboard .cell{background:#b9c3c9}
:root[data-theme="dark"] .checkerboard .cell.dark{background:#586a7d}
:root[data-theme="dark"] .checkerboard .cell.selected{box-shadow:inset 0 0 0 5px var(--gold)}
:root[data-theme="dark"] .checkerboard .cell.legal:after{background:var(--mint);box-shadow:0 0 0 5px #4bc5aa33}
:root[data-theme="dark"] .piece{background:#eef7f4;border:3px solid #d6e5e2;box-shadow:inset 0 -7px #cad9d7,0 3px 4px #16233266;color:#142334}
:root[data-theme="dark"] .piece.p1{background:var(--coral);border-color:#f28ba0;box-shadow:inset 0 -7px #ca405c,0 3px 4px #16233266}
:root[data-theme="dark"] .piece.king:after{color:#f6c453;text-shadow:0 1px #8c6320}
:root[data-theme="dark"] .result{background:#171e1cbb}
:root[data-theme="dark"] .toast{background:#d94c68;color:#fff;box-shadow:var(--shadow)}
:root[data-theme="dark"] .host-power-btn.host-primary{color:#ff7286;border-color:#8c4655;background:#4c2934}
:root[data-theme="dark"] .host-power-btn.host-primary:hover{background:#60313f}
:root[data-theme="dark"] .host-power-btn.host-idle{color:var(--paper);border-color:var(--muted);background:var(--line)}
:root[data-theme="dark"] .host-power-btn.host-idle:hover{background:var(--line)}
:root[data-theme="dark"] .host-power-btn.host-offline{color:#f5f7f2;border-color:var(--line);background:var(--panel)}
:root[data-theme="dark"] .host-power-btn.host-offline:hover{background:var(--panel2)}
:root[data-theme="dark"] .music-btn,:root[data-theme="dark"] .music-btn.on,:root[data-theme="dark"] .music-btn.off{color:#f5f7f2}
:root[data-theme="dark"] .optional{color:var(--mint2)}
:root[data-theme="dark"] .input option{background:var(--panel);color:#fff}
:root[data-theme="dark"] .player-time{color:var(--mint2)}
:root[data-theme="dark"] .turn-clock{color:#f7ca67}
:root[data-theme="dark"] .lobby-path-divider{color:var(--muted)}
:root[data-theme="dark"] .lobby-path-divider::before,:root[data-theme="dark"] .lobby-path-divider::after{background:var(--line)}
:root[data-theme="dark"] .matchmaking-default-note{color:var(--muted)}
:root[data-theme="dark"] .room-progress-control.matchmaking-progress>span{color:var(--panel)!important}
:root[data-theme="dark"] .matchmaking-progress.matching{background:var(--mint);box-shadow:inset 0 -4px #2fa78d}
:root[data-theme="dark"] .matchmaking-progress.matching::before{background:#2fa78d}
:root[data-theme="dark"] .gift-settings{background:var(--panel)}
:root[data-theme="dark"] .gift-settings small{color:var(--muted)}
:root[data-theme="dark"] .gift-settings label>span{color:var(--muted)}
:root[data-theme="dark"] .round-pill{color:var(--muted)}
:root[data-theme="dark"] .weapons{background:var(--panel)}
:root[data-theme="dark"] .weapon{background:var(--paper);color:var(--panel2)}
:root[data-theme="dark"] .weapon.active{border-color:var(--coral);box-shadow:0 0 0 3px #f392a133}
:root[data-theme="dark"] .weapon b{background:var(--mint);color:var(--panel)}
:root[data-theme="dark"] .capture-burst{background:var(--gold)}
:root[data-theme="dark"] .sea .gift-mark{color:#ff1028}
:root[data-theme="dark"] .move-ghost.piece{border:3px solid #19594f;background:#eef8f5}
:root[data-theme="dark"] .move-ghost.piece.p1{background:#19594f;border-color:#123f39}
:root[data-theme="dark"] .move-ghost.piece.king:after{background:#19594f}
:root[data-theme="dark"] .move-ghost.piece.p1.king:after{background:#eef8f5}
:root[data-theme="dark"] .logo-board{background:#bff0e8}
:root[data-theme="dark"] .battle-logo i{background:radial-gradient(circle,#48c4b0 0 2px,transparent 3px)}
:root[data-theme="dark"] .battle-logo i.blue:after,:root[data-theme="dark"] .battle-logo i.purple:after,:root[data-theme="dark"] .battle-logo i.red:after,:root[data-theme="dark"] .battle-logo i.green:after{background:var(--muted);box-shadow:inset 0 -3px var(--line)}
:root[data-theme="dark"] .battle-logo i.purple:after{background:#8b36b4;box-shadow:inset 0 -3px #642782}
:root[data-theme="dark"] .battle-logo i.red:after{background:#ef4d65;box-shadow:inset 0 -3px #c7354a}
:root[data-theme="dark"] .battle-logo i.green:after{background:#328e80;box-shadow:inset 0 -3px #23675e}
:root[data-theme="dark"] .battle-logo b{color:#ef304f}
:root[data-theme="dark"] .checker-logo i{background:#d8f5ee}
:root[data-theme="dark"] .checker-logo i:nth-child(16n+2),:root[data-theme="dark"] .checker-logo i:nth-child(16n+4),:root[data-theme="dark"] .checker-logo i:nth-child(16n+6),:root[data-theme="dark"] .checker-logo i:nth-child(16n+8),:root[data-theme="dark"] .checker-logo i:nth-child(16n+9),:root[data-theme="dark"] .checker-logo i:nth-child(16n+11),:root[data-theme="dark"] .checker-logo i:nth-child(16n+13),:root[data-theme="dark"] .checker-logo i:nth-child(16n+15){background:#4ebc9e}
:root[data-theme="dark"] .checker-logo b{background:#19594f;border:2px solid #123f39}
:root[data-theme="dark"] .checker-logo b.light{background:#eef8f5}
:root[data-theme="dark"] .explosion{background:#fff5a8;box-shadow:0 0 0 8px #ffb22e,0 0 0 17px #f392a1aa}
:root[data-theme="dark"] .explosion:before,:root[data-theme="dark"] .explosion:after{background:linear-gradient(90deg,transparent,#ffcb4c,transparent)}
:root[data-theme="dark"] .water-burst{border:3px solid var(--paper)}
:root[data-theme="dark"] .water-burst:before,:root[data-theme="dark"] .water-burst:after{background:var(--muted)}
:root[data-theme="dark"] .game-tab{border:1px solid var(--line);background:var(--panel2);color:#eef5f2}
:root[data-theme="dark"] .game-tab.has-art{background:var(--panel2)}
:root[data-theme="dark"] .game-tab.has-art span{text-shadow:0 2px 9px #171e1cdd}
:root[data-theme="dark"] .game-tab:hover{border-color:#50c7ae}
:root[data-theme="dark"] .score{background:#12bfa0;color:#fff;box-shadow:inset 0 -2px #087d6c}
:root[data-theme="dark"] .pawn-loss{color:#9ddfd3}
:root[data-theme="dark"] .final-score{background:var(--panel)}
:root[data-theme="dark"] .final-score b{background:#12bfa0;color:#fff}
:root[data-theme="dark"] .final-score i{color:var(--muted)}
:root[data-theme="dark"] .solitaire-result-summary{background:var(--panel)}
:root[data-theme="dark"] .solitaire-result-suits i{color:#eef5f2;text-shadow:0 3px 10px #171e1c99}
:root[data-theme="dark"] .solitaire-result-suits i:nth-child(2),:root[data-theme="dark"] .solitaire-result-suits i:nth-child(3){color:var(--coral)}
:root[data-theme="dark"] .solitaire-result-summary p{color:var(--muted)}
:root[data-theme="dark"] .solitaire-result-summary strong{color:var(--mint)}
:root[data-theme="dark"] .solitaire-result-summary strong small{color:var(--muted)}
:root[data-theme="dark"] .xp-result{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .xp-result-top strong,:root[data-theme="dark"] .xp-result-top .xp-level-badge{color:var(--gold)}
:root[data-theme="dark"] .xp-result-track{background:var(--ink)}
:root[data-theme="dark"] .xp-result-track b{background:linear-gradient(90deg,var(--mint),var(--gold));box-shadow:0 0 10px #2ad2b588}
:root[data-theme="dark"] .xp-result.animate:not(.level-up) .xp-result-track::before{background:radial-gradient(circle at center,#fff7c8 0 10%,#f6cf65cc 28%,#50d4ba55 58%,transparent 76%)}
:root[data-theme="dark"] .xp-result.animate:not(.level-up) .xp-result-track::after{box-shadow:inset 0 0 0 1px #f6cf6500,0 0 0 #f6cf6500}
:root[data-theme="dark"] .xp-result-foot{color:var(--muted)}
:root[data-theme="dark"] .xp-rating em{color:var(--mint2)}
:root[data-theme="dark"] .xp-result.level-up{border-color:#9a7945;box-shadow:inset 0 0 24px #f6cf6512}
:root[data-theme="dark"] .xp-rating{color:var(--metric-rating)}
:root[data-theme="dark"] .xp-result.level-up{border-color:var(--line)}
:root[data-theme="dark"] .xp-result.level-up.level-crossed{border-color:#d4a83f;box-shadow:inset 0 0 22px #f6cf6512}
:root[data-theme="dark"] .xp-gold-chase rect{stroke:var(--gold)}
:root[data-theme="dark"] .xp-result.animate .xp-result-track b::after{background:radial-gradient(ellipse at 50% 100%,#f4fff5c7 0 26%,transparent 62%) 0 0/32px 11px repeat-x,radial-gradient(ellipse at 50% 0,#ffe49aa6 0 24%,transparent 60%) 16px 0/39px 10px repeat-x}
:root[data-theme="dark"] .sea{background:var(--ink);border:6px solid var(--panel2)}
:root[data-theme="dark"] .sea .cell{background:var(--ink)}
:root[data-theme="dark"] .sea .cell:after{background:var(--panel2)}
:root[data-theme="dark"] .sea.enemy .cell:hover{background:var(--panel)}
:root[data-theme="dark"] .sea.enemy .cell:hover:after{background:#23baa9}
:root[data-theme="dark"] .cell.ship{background:var(--ink)}
:root[data-theme="dark"] .cell.ship:before{background:#f13f45}
:root[data-theme="dark"] .cell.hit:before{color:#ffca3a}
:root[data-theme="dark"] .cell.miss:before{color:var(--muted)}
:root[data-theme="dark"] .board-card{background:var(--panel);border-color:var(--panel2)}
:root[data-theme="dark"] .board-title{background:var(--panel)}
:root[data-theme="dark"] .fleet,:root[data-theme="dark"] .weapons{background:var(--panel)}
:root[data-theme="dark"] .checker-wrap{border:1px solid #4c6256;background:linear-gradient(145deg,#34463e,#25322d);box-shadow:0 13px 30px #171e1c80,inset 0 1px #ffffff16}
:root[data-theme="dark"] .checkerboard{border:1px solid #172838;background:#d0d2cf;box-shadow:inset 0 0 0 1px #ffffff12}
:root[data-theme="dark"] .checkerboard .cell{background-color:#afb8b6}
:root[data-theme="dark"] .checkerboard .cell.dark{background-color:#586c7b}
:root[data-theme="dark"] .checkerboard .cell.selected:before{background:#795b60;box-shadow:0 0 0 2px #e1b0a333}
:root[data-theme="dark"] .checkerboard .cell.move-origin,:root[data-theme="dark"] .checkerboard .cell.move-target{background:#795b60!important}
:root[data-theme="dark"] .checkerboard .cell.legal:after{background:#344657}
:root[data-theme="dark"] .checkerboard .cell small{color:#536875}
:root[data-theme="dark"] .checkerboard .cell.dark small{color:#d2dde0}
:root[data-theme="dark"] .checkerboard .piece{border:4px solid #344653;background:#f3f1eb;box-shadow:inset 0 0 0 1px #7e827814,0 2px 3px #07111d45}
:root[data-theme="dark"] .checkerboard .piece.p1{background:#df5e73;border-color:#36333a;box-shadow:inset 0 0 0 1px #562d361c,0 2px 3px #07111d45}
:root[data-theme="dark"] .checkerboard .piece.king:after{background:#344653}
:root[data-theme="dark"] .checkerboard .piece.p1.king:after{background:#fffaf2}
:root[data-theme="dark"] .move-ghost.piece{border:4px solid #344653;background:#f3f1eb}
:root[data-theme="dark"] .move-ghost.piece.p1{background:#df5e73;border-color:#36333a}
:root[data-theme="dark"] .move-ghost.piece.king:after{background:#344653}
:root[data-theme="dark"] .move-ghost.piece.p1.king:after{background:#fffaf2}
:root[data-theme="dark"] .sea .cell.sunk{background:var(--ink)}
:root[data-theme="dark"] .sea .cell.sunk:before{background:#f13f45}
:root[data-theme="dark"] .sea .cell.ship-0:before{background:#ba3035}
:root[data-theme="dark"] .sea .cell.ship-1:before{background:#74288e}
:root[data-theme="dark"] .sea .cell.ship-2:before{background:var(--line)}
:root[data-theme="dark"] .sea .cell.ship-3:before{background:var(--line)}
:root[data-theme="dark"] .sea .cell.ship-4:before{background:#087e75}
:root[data-theme="dark"] .sea .cell.ship.sunk:before{background:#f13f45}
:root[data-theme="dark"] .game-note{color:var(--muted)}
:root[data-theme="dark"] .coach-description{color:var(--muted)}
:root[data-theme="dark"] .coach-description strong{color:var(--muted)}
:root[data-theme="dark"] .coach-description.backup strong{color:#d8ad4a}
:root[data-theme="dark"] .side-label{color:var(--muted)}
:root[data-theme="dark"] .avatar.go-side.side-0,:root[data-theme="dark"] .avatar.chess-side.side-1{background:#25322d;border-color:#4c6256}
:root[data-theme="dark"] .avatar.go-side.side-1,:root[data-theme="dark"] .avatar.chess-side.side-0{background:#edf8f5;border-color:#b3c4b9}
:root[data-theme="dark"] .go-board{--line:#526475;background-color:#9ca7b1;border:7px solid #263949;box-shadow:var(--shadow)}
:root[data-theme="dark"] .go-point:empty:not(:disabled):after{background:#ef6077}
:root[data-theme="dark"] .go-point.last .piece:after{background:#ef6077}
:root[data-theme="dark"] .go-point .piece,:root[data-theme="dark"] .cc-hole .piece{border:3px solid #263949;background:#edf8f5}
:root[data-theme="dark"] .go-point .piece.p0,:root[data-theme="dark"] .cc-hole .piece.p0{background:#172532;border-color:#07131e}
:root[data-theme="dark"] .go-point .piece.p1,:root[data-theme="dark"] .cc-hole .piece.p1{background:#edf8f5;border-color:#526475}
:root[data-theme="dark"] .cc-board{background:#101d2b;border:6px solid #263949;box-shadow:var(--shadow)}
:root[data-theme="dark"] .cc-hole{background:var(--line)}
:root[data-theme="dark"] .cc-hole.selected{box-shadow:0 0 0 5px #795b60}
:root[data-theme="dark"] .cc-hole .piece.p0{background:#edf8f5;border-color:#526475}
:root[data-theme="dark"] .chess-board{background:#d0d2cf;border:clamp(4px,.8vw,7px) solid #263b4e;box-shadow:0 13px 30px #07111d80,inset 0 0 0 1px #ffffff18}
:root[data-theme="dark"] .chess-cell{background-color:#afb8b6}
:root[data-theme="dark"] .chess-cell.dark{background-color:#4c6256}
:root[data-theme="dark"] .chess-cell.move-source,:root[data-theme="dark"] .chess-cell.selected{background:#795b60}
:root[data-theme="dark"] .chess-cell.move-target{background:#776b70}
:root[data-theme="dark"] .chess-cell.legal:after{background:#12bfa0}
:root[data-theme="dark"] .chess-cell.legal:has(.chess-piece):after{border:5px solid #12bfa0}
:root[data-theme="dark"] .chess-piece{color:#f3f1eb;text-shadow:-1px -1px 0 #1a252c,1px -1px 0 #1a252c,-1px 1px 0 #1a252c,1px 1px 0 #1a252c}
:root[data-theme="dark"] .chess-piece.p1{color:#15212a;text-shadow:-1px -1px 0 #e7e8e2,1px -1px 0 #e7e8e2,-1px 1px 0 #e7e8e2,1px 1px 0 #e7e8e2}
:root[data-theme="dark"] .chess-cell small{color:#4c6256;text-shadow:0 1px #ffffff20}
:root[data-theme="dark"] .chess-cell.dark small{color:#eaf1eb;text-shadow:0 1px #171e1c45}
:root[data-theme="dark"] .go-board{background:#9ca7b1}
:root[data-theme="dark"] .go-point:before,:root[data-theme="dark"] .go-point:after,:root[data-theme="dark"] .go-point:empty:not(:disabled):after{background:var(--line)}
:root[data-theme="dark"] .go-point .piece,:root[data-theme="dark"] .cc-hole .piece{border:4px solid #263949}
:root[data-theme="dark"] .go-point.last .piece:after{background:#ef6077}
:root[data-theme="dark"] .cc-hole .piece{background:radial-gradient(circle at 36% 27%,#fff 0 8%,transparent 9%),linear-gradient(145deg,#f8fffd 8%,#d5e4e2 72%,#b9ccca);box-shadow:inset 0 0 0 2px #ffffff58,inset 0 -4px #aebfbd,0 4px 6px #07111d70}
:root[data-theme="dark"] .cc-hole .piece.p0{background:radial-gradient(circle at 36% 27%,#fff 0 8%,transparent 9%),linear-gradient(145deg,#f8fffd 8%,#d5e4e2 72%,#b9ccca);border-color:#263949}
:root[data-theme="dark"] .cc-hole .piece.p1{background:radial-gradient(circle at 36% 27%,#ffb2bf 0 8%,transparent 9%),linear-gradient(145deg,#f76c84 8%,#de4c67 72%,#b92f4b);border-color:#262b38;box-shadow:inset 0 0 0 2px #ff9aae55,inset 0 -4px #a72d45,0 4px 6px #07111d70}
:root[data-theme="dark"] .scorebar .avatar.side-0{background:#edf8f5;border-color:var(--muted)}
:root[data-theme="dark"] .scorebar .avatar.side-1{background:#ef6077;border-color:#f68ca0}
:root[data-theme="dark"] .scorebar .avatar.go-side.side-0,:root[data-theme="dark"] .scorebar .avatar.chess-side.side-1{background:#25322d;border-color:#4c6256}
:root[data-theme="dark"] .scorebar .avatar.go-side.side-1,:root[data-theme="dark"] .scorebar .avatar.chess-side.side-0{background:#edf8f5;border-color:#b3c4b9}
:root[data-theme="dark"] .go-count{color:#9ddfd3}
:root[data-theme="dark"] .chess-cell.legal:after,:root[data-theme="dark"] .chess-cell.legal:has(.chess-piece):after{background:#344657}
:root[data-theme="dark"] .go-line{background:var(--line)}
:root[data-theme="dark"] .invite-banner{border:1px solid #40cdb4;background:var(--panel);box-shadow:0 0 0 4px #40cdb418}
:root[data-theme="dark"] .invite-banner span{color:#b8d5d1}
:root[data-theme="dark"] .app-dialog{background:#171e1ccc}
:root[data-theme="dark"] .promotion-options button{border:1px solid var(--line);background:var(--panel2)}
:root[data-theme="dark"] .disconnect-countdown{border:2px solid var(--coral);color:var(--coral);box-shadow:0 0 24px #ff6f7d33}
:root[data-theme="dark"] .turn-badge.live.timer-warning{background:var(--coral);color:#fff}
:root[data-theme="dark"] .player-time{background:var(--panel2);color:#f5cf72}
:root[data-theme="dark"] .battle-turn{border:2px solid var(--line);color:var(--muted)}
:root[data-theme="dark"] .battle-turn.active{border-color:#fff;color:#fff}
:root[data-theme="dark"] .board-card.active-turn{border-color:#fff;box-shadow:0 0 18px #ffffff44}
:root[data-theme="dark"] .sea .cell.ship:before,:root[data-theme="dark"] .sea .cell.ship.sunk:before{background:var(--ship-color,var(--line))!important}
:root[data-theme="dark"] .fleet-chip{background:var(--ship-color,var(--line))}
:root[data-theme="dark"] .fleet-chip.sunk{background:var(--ship-color,var(--line))}
:root[data-theme="dark"] .hit-mark{color:#ffd24b;text-shadow:0 1px 2px #8e321e,0 0 8px #ff823a}
:root[data-theme="dark"] .cc-hole.legal{background:var(--panel2);box-shadow:0 0 0 5px #34463e44}
@media(max-width:850px){:root[data-theme="dark"] .explosion{box-shadow:0 0 0 10px #ffb22e,0 0 0 21px #f392a1aa}}
:root[data-theme="dark"] .cc-hole.legal{background:#12bfa0;box-shadow:0 0 0 5px #12bfa044}
:root[data-theme="dark"] .game-note.check-alert{border:2px solid var(--gold);background:#6b5221;color:#fff3c9;box-shadow:0 0 16px #f6cf6566}
:root[data-theme="dark"] .game-note.checkmate{border-color:#fff;background:#d94c68;color:#fff;box-shadow:0 0 18px #ef607788}
:root[data-theme="dark"] .sea .cell.miss:before{border:2px solid var(--muted)}
:root[data-theme="dark"] .summary-number.summary-win{background:#1d5c4e;color:#7ff0d3}
:root[data-theme="dark"] .summary-number.summary-loss{background:#612f3d;color:#ff9bad}
:root[data-theme="dark"] .dice-table{border:1px solid var(--panel2);background:linear-gradient(145deg,var(--panel),var(--panel));box-shadow:var(--shadow)}
:root[data-theme="dark"] .dice-round{color:var(--mint2)}
:root[data-theme="dark"] .opponent-cup,:root[data-theme="dark"] .current-bid,:root[data-theme="dark"] .turn-total{background:var(--panel)}
:root[data-theme="dark"] .opponent-cup b,:root[data-theme="dark"] .turn-total strong{background:var(--mint);color:var(--panel)}
:root[data-theme="dark"] .current-bid strong{color:#b9f3e8}
:root[data-theme="dark"] .own-hand>span,:root[data-theme="dark"] .dice-bid-controls span{color:var(--muted)}
:root[data-theme="dark"] .die-face,:root[data-theme="dark"] .reveal-die,:root[data-theme="dark"] .pig-die{border:2px solid #6ee0c8;background:#173c3d;box-shadow:0 8px 18px #07121966,inset 0 0 18px #49c5aa12}
:root[data-theme="dark"] .pip{background:#b7f5e9}
:root[data-theme="dark"] .dice-rolling{box-shadow:0 0 25px #7ddbc066}
:root[data-theme="dark"] .dice-reveal{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .dice-reveal>span{color:#79dbc8}
:root[data-theme="dark"] .dice-reveal>strong{color:#fff}
:root[data-theme="dark"] .dice-reveal>p{color:var(--muted)}
:root[data-theme="dark"] .pig-scores>div{background:var(--panel)}
:root[data-theme="dark"] .pig-scores>div.active{border-color:var(--mint)}
:root[data-theme="dark"] .pig-die.empty{color:#73b8ad}
:root[data-theme="dark"] .pig-outcome{border-left:4px solid var(--mint);background:var(--panel)}
:root[data-theme="dark"] .pig-outcome strong{color:#dffbf5}
:root[data-theme="dark"] .pig-outcome span{color:var(--muted)}
:root[data-theme="dark"] .pig-outcome.bust{border-color:var(--coral);background:#432c38}
:root[data-theme="dark"] .pig-outcome.bust strong{color:#ffbac5}
:root[data-theme="dark"] .dice-help{color:var(--muted)}
:root[data-theme="dark"]{--solid-button-text-shadow:0 1px 1px #171e1c80}
:root[data-theme="dark"] .room-progress-control>span{text-shadow:var(--solid-button-text-shadow)!important }
:root[data-theme="dark"] .game-select-trigger{border:1px solid var(--line);background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .game-select-trigger:focus-visible{border-color:var(--mint);box-shadow:0 0 0 3px #7ddbc02b}
:root[data-theme="dark"] .game-select-trigger i{border-right:2px solid var(--muted);border-bottom:2px solid var(--muted)}
:root[data-theme="dark"] .selection-options button{border:1px solid var(--line);background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .selection-options button.active,:root[data-theme="dark"] .selection-options button:focus-visible{border-color:var(--mint);background:var(--mint);color:var(--panel)}
:root[data-theme="dark"] .share-qr{background:var(--paper)}
:root[data-theme="dark"] .share-url{background:var(--panel);color:#9fe7da}
:root[data-theme="dark"] select,:root[data-theme="dark"] select option{color:var(--muted)}
:root[data-theme="dark"] .go-board,:root[data-theme="dark"] .reversi-board{--paper-green:#345347;--paper-green-light:#426357;--paper-green-dark:#29443a;--paper-line:#172b24;--piece-dark:#171a19;--piece-ivory:#e8e1cf;background-color:var(--paper-green);border-color:#203b32;box-shadow:inset 0 1px 0 #ffffff18,inset 0 -2px 5px #08130f44,0 12px 24px #02091166}
:root[data-theme="dark"] .go-line{background:var(--paper-line)}
:root[data-theme="dark"] .go-point .piece,:root[data-theme="dark"] .reversi-disc{border:2px solid #59675f;background:radial-gradient(circle at 31% 25%,#383d3a 0,#242825 34%,var(--piece-dark) 72%);box-shadow:inset 1px 1px 1px #ffffff18,inset -4px -5px 7px #05080788,0 3px 5px #02070699,0 0 0 1px #0a120f}
:root[data-theme="dark"] .go-point .piece.p1,:root[data-theme="dark"] .reversi-disc.p1{border-color:#c8c0ad;background:radial-gradient(circle at 31% 24%,#fffaf0 0,#f0e9d8 38%,var(--piece-ivory) 72%);box-shadow:inset 1px 1px 1px #ffffffcc,inset -4px -5px 7px #b5ad9b66,0 3px 5px #02070688}
:root[data-theme="dark"] .gomoku-board{border-color:#203b32}
:root[data-theme="dark"] .gomoku-point.last .piece:after{background:var(--coral)}
:root[data-theme="dark"] .scorebar .avatar.gomoku-side.side-0{background:#171a19;border-color:#59675f}
:root[data-theme="dark"] .scorebar .avatar.gomoku-side.side-1{background:#e8e1cf;border-color:#c8c0ad}
:root[data-theme="dark"] .reversi-cell{border-right:1px solid var(--paper-line);border-bottom:1px solid var(--paper-line)}
:root[data-theme="dark"] .reversi-disc{box-shadow:inset 1px 1px 1px #ffffff18,inset -4px -5px 7px #05080788,0 3px 5px #02070699}
:root[data-theme="dark"] .reversi-disc.p1{box-shadow:inset 1px 1px 1px #ffffffcc,inset -4px -5px 7px #b5ad9b66,0 3px 5px #02070688}
:root[data-theme="dark"] .reversi-cell.legal:empty:after{background:#91c1b1;box-shadow:0 0 0 3px #91c1b124}
:root[data-theme="dark"] .reversi-cell.coach-target:empty:after{background:var(--gold);box-shadow:0 0 0 4px #f6cf6533}
:root[data-theme="dark"] .reversi-cell.last .reversi-disc:after{background:var(--coral)}
:root[data-theme="dark"] .go-capture-ghost{border:2px solid #59675f;background:radial-gradient(circle at 31% 25%,#383d3a 0,#242825 34%,var(--piece-dark,#171a19) 72%);box-shadow:inset 1px 1px 1px #ffffff18,inset -4px -5px 7px #05080788,0 3px 5px #02070699}
:root[data-theme="dark"] .go-capture-ghost.p1{border-color:#c8c0ad;background:radial-gradient(circle at 31% 24%,#fffaf0 0,#f0e9d8 38%,var(--piece-ivory,#e8e1cf) 72%);box-shadow:inset 1px 1px 1px #ffffffcc,inset -4px -5px 7px #b5ad9b66,0 3px 5px #02070688}
:root[data-theme="dark"] .summary-face{color:var(--paper)}
:root[data-theme="dark"] .dice-showdown .showdown-hand{background:var(--panel)}
:root[data-theme="dark"] .dice-showdown .showdown-hand+ .showdown-hand{border-top:1px solid var(--line)}
:root[data-theme="dark"] .header-account.login{color:#65e3b8;border-color:#3d8f78;background:#1e493f}
:root[data-theme="dark"] .header-account.login:hover{background:#285f50}
:root[data-theme="dark"] .header-icon-btn.header-account.account-level{color:var(--level-color);border-color:var(--level-border);background:linear-gradient(145deg,var(--level-surface),var(--panel));box-shadow:inset 0 1px #ffffff12}
:root[data-theme="dark"] .header-icon-btn.header-account.account-level:hover{background:linear-gradient(145deg,var(--level-hover),var(--panel2))}
:root[data-theme="dark"] .account-form label>span{color:var(--muted)}
:root[data-theme="dark"] .history-totals>div{background:var(--panel)}
:root[data-theme="dark"] .history-totals b{color:var(--mint2)}
:root[data-theme="dark"] .history-totals span{color:var(--muted)}
:root[data-theme="dark"] .history-games>div{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .history-games span{color:var(--muted)}
:root[data-theme="dark"] .history-list li{border-left:4px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .history-list span{color:var(--muted)}
:root[data-theme="dark"] .history-list b{color:#dce8e7}
:root[data-theme="dark"] .history-list .history-win b{color:var(--mint2)}
:root[data-theme="dark"] .history-list .history-loss b{color:#ff9bad}
:root[data-theme="dark"] .history-empty{background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .profile-level{border:1px solid var(--profile-level-border,#41756f);background:linear-gradient(135deg,var(--profile-level-surface,var(--panel)),var(--panel))}
:root[data-theme="dark"] .profile-level>strong{background:var(--profile-level-surface,var(--mint));color:var(--profile-level-color,#b9eee3)}
:root[data-theme="dark"] .profile-level span{color:var(--muted)}
:root[data-theme="dark"] .profile-level i{background:var(--panel)}
:root[data-theme="dark"] .profile-level i b{background:linear-gradient(90deg,var(--mint),var(--gold))}
:root[data-theme="dark"] .mastery-heading span{color:var(--muted)}
:root[data-theme="dark"] .mastery-card{background:var(--panel)}
:root[data-theme="dark"] .mastery-card span{color:var(--muted)}
:root[data-theme="dark"] .mastery-card>b{color:var(--gold)}
:root[data-theme="dark"] .profile-rating-note{color:var(--muted)}
:root[data-theme="dark"] .history-result small{color:var(--metric-xp)}
:root[data-theme="dark"] .profile-tabs{background:var(--panel)}
:root[data-theme="dark"] .profile-tabs button{color:var(--muted)}
:root[data-theme="dark"] .profile-tabs button.active{background:var(--panel2);color:#e9f5f3;box-shadow:inset 0 -2px var(--mint)}
:root[data-theme="dark"] .ai-rating-note{border:1px solid var(--line);background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .ai-rating-note strong{color:var(--metric-rating)}
:root[data-theme="dark"] .game-progress-columns{background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .game-progress-row{border:1px solid var(--panel2);background:linear-gradient(105deg,hsl(var(--game-accent-hue) 42% 40% / .1),var(--panel) 55%);box-shadow:inset 3px 0 hsl(var(--game-accent-hue) 48% 57%)}
:root[data-theme="dark"] .game-progress-name>strong{color:hsl(var(--game-accent-hue) 44% 77%)}
:root[data-theme="dark"] .game-progress-name small,:root[data-theme="dark"] .game-skill small{color:var(--muted)}
:root[data-theme="dark"] .game-skill>strong{color:var(--mint2)}
:root[data-theme="dark"] .game-skill .game-progress-metric-label{color:var(--muted)}
:root[data-theme="dark"] .game-mastery>span b{color:var(--paper)}
:root[data-theme="dark"] .game-mastery>span small{color:var(--muted)}
:root[data-theme="dark"] .game-mastery>i{background:var(--panel)}
:root[data-theme="dark"] .game-mastery>i>b{background:linear-gradient(90deg,var(--mint),var(--gold))}
:root[data-theme="dark"] .history-result .history-changes small{background:var(--panel)}
:root[data-theme="dark"] .history-result .change-xp{color:var(--mint2)}
:root[data-theme="dark"] .history-result .change-rating{color:var(--muted)}
:root[data-theme="dark"] .history-result .change-credit{color:var(--gold)}
:root[data-theme="dark"] .game-skill-empty{color:var(--muted)!important}
:root[data-theme="dark"] .history-opponent .history-changes small{background:var(--panel)}
:root[data-theme="dark"] .history-opponent .change-xp{color:var(--mint2)}
:root[data-theme="dark"] .history-opponent .change-rating{color:var(--muted)}
:root[data-theme="dark"] .history-opponent .change-credit,:root[data-theme="dark"] .history-opponent .change-credit .credit-amount,:root[data-theme="dark"] .history-opponent .change-credit .credit-amount>span{color:var(--gold)!important}
:root[data-theme="dark"] .game-skill.rating>strong{color:var(--metric-rating)}
:root[data-theme="dark"] .game-skill.credit>strong{color:var(--metric-credit)}
:root[data-theme="dark"] .history-result .change-xp,:root[data-theme="dark"] .history-opponent .change-xp{color:var(--metric-xp)}
:root[data-theme="dark"] .history-result .change-rating,:root[data-theme="dark"] .history-opponent .change-rating{color:var(--metric-rating)}
:root[data-theme="dark"] .history-result .change-credit,:root[data-theme="dark"] .history-opponent .change-credit,:root[data-theme="dark"] .history-opponent .change-credit .credit-amount,:root[data-theme="dark"] .history-opponent .change-credit .credit-amount>span{color:var(--metric-credit)!important}
@media(max-width:620px){:root[data-theme="dark"] .game-mastery{border-left:1px solid var(--panel2)}}
:root[data-theme="dark"] .history-filters{background:var(--panel)}
:root[data-theme="dark"] .history-filters button{color:var(--muted)}
:root[data-theme="dark"] .history-filters button.active{background:var(--mint);color:var(--panel)}
:root[data-theme="dark"] .history-section-title>span{color:var(--muted)}
:root[data-theme="dark"] .history-chart{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .history-chart>div>span{color:var(--muted)}
:root[data-theme="dark"] .history-chart i.wins{background:var(--mint)}
:root[data-theme="dark"] .history-chart i.losses{background:var(--coral)}
:root[data-theme="dark"] .history-chart i.draws{background:var(--gold)}
:root[data-theme="dark"] .history-chart .chart-grid{stroke:var(--line)}
:root[data-theme="dark"] .history-chart .chart-wins{stroke:var(--mint)}
:root[data-theme="dark"] .history-chart .chart-losses{stroke:var(--coral)}
:root[data-theme="dark"] .history-chart .chart-draws{stroke:var(--gold)}
:root[data-theme="dark"] .history-chart text{fill:var(--muted)}
:root[data-theme="dark"] .history-pages span{color:var(--muted)}
:root[data-theme="dark"] .board-ready{background:var(--panel2);color:var(--muted)}
:root[data-theme="dark"] .board-ready.ready{background:var(--mint);color:var(--panel)}
:root[data-theme="dark"] .battle-opponent-status{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .profile-account-action{border:1px solid var(--line);background:var(--line);color:#dce8e7}
:root[data-theme="dark"] .history-delete{color:#ffaaa2}
:root[data-theme="dark"] .history-totals span{color:var(--muted)}
:root[data-theme="dark"] .turn-total.neutral strong{background:var(--panel2);color:#c4d6d3}
:root[data-theme="dark"] .previous-bid{color:var(--muted)}
:root[data-theme="dark"] .previous-bid strong{color:var(--muted)}
:root[data-theme="dark"] .host-settings-section{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .host-settings-heading{color:var(--paper)}
:root[data-theme="dark"] .host-settings-label{color:var(--muted)}
:root[data-theme="dark"] .host-key-input.valid:placeholder-shown{border-color:#3d8f78;background:var(--panel)}
:root[data-theme="dark"] .host-key-input.valid::placeholder{color:#bdf8e4}
:root[data-theme="dark"] .host-key-input.checking,:root[data-theme="dark"] .host-key-input.checking:placeholder-shown{border-color:#c9a453}
:root[data-theme="dark"] .host-key-input.checking::placeholder{color:#f8dda0}
:root[data-theme="dark"] .host-key-input.invalid,:root[data-theme="dark"] .host-key-input.invalid:placeholder-shown{border-color:#f392a1}
:root[data-theme="dark"] .host-key-input.invalid::placeholder{color:#ffc0ca}
:root[data-theme="dark"] .host-runtime-status{color:var(--muted)}
:root[data-theme="dark"] .host-runtime-status.error{color:#f7d98b}
:root[data-theme="dark"] .host-settings-times dt{color:var(--muted)}
:root[data-theme="dark"] .host-settings-times dd{color:var(--muted)}
:root[data-theme="dark"] .host-setting-feedback{color:var(--mint2)}
:root[data-theme="dark"] .host-setting-feedback.error{color:#ff9bab}
:root[data-theme="dark"] .coach-note{color:#c7a64f}
:root[data-theme="dark"] .coach-note i{background:#8a681f;box-shadow:0 0 0 3px #d1ad4a35}
:root[data-theme="dark"] .checkerboard .cell.coach-source{box-shadow:inset 0 0 0 5px #8a681f}
:root[data-theme="dark"] .checkerboard .cell.coach-target:after{background:#8a681f!important;box-shadow:0 0 0 4px #d1ad4a44!important}
:root[data-theme="dark"] .cc-hole.coach-source{box-shadow:0 0 0 5px #8a681f}
:root[data-theme="dark"] .cc-hole.coach-target{background:#8a681f!important;box-shadow:0 0 0 5px #d1ad4a44!important}
:root[data-theme="dark"] .chess-cell.coach-source{box-shadow:inset 0 0 0 5px #8a681f}
:root[data-theme="dark"] .chess-cell.coach-target:after{background:#8a681f!important;box-shadow:0 0 0 4px #d1ad4a44!important}
:root[data-theme="dark"] .go-point.coach-target{background:#8a681f55;box-shadow:inset 0 0 0 3px #8a681f}
:root[data-theme="dark"] .battle-reveal-banner{border:1px solid #8a681f;background:#332d22;color:#e2c56f}
:root[data-theme="dark"] .fleet-revealed .cell.ship:not(.hit):after{background:#e2c56f;box-shadow:0 0 0 3px #332d2288}
:root[data-theme="dark"] .checkerboard .cell.coach-target.legal:after{background:#8a681f!important;box-shadow:0 0 0 4px #d1ad4a44!important}
:root[data-theme="dark"] .cc-hole.coach-target.legal{background:#8a681f!important;box-shadow:0 0 0 5px #d1ad4a44!important}
:root[data-theme="dark"] .chess-cell.coach-target.legal:after,:root[data-theme="dark"] .chess-cell.coach-target.legal:has(.chess-piece):after{background:#8a681f!important}
:root[data-theme="dark"] .coach-action{border-color:#8a681f!important;background:#4b3d22!important;color:#e2c56f!important;box-shadow:inset 0 0 0 2px #8a681f}
:root[data-theme="dark"] .previous-bid{background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .previous-bid span,:root[data-theme="dark"] .previous-bid strong{color:var(--muted)}
:root[data-theme="dark"] .history-record-main span{color:var(--muted)}
:root[data-theme="dark"] .history-result em{color:#dce8e7}
:root[data-theme="dark"] .room-join-box{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .room-join-box>label{color:var(--muted)}
:root[data-theme="dark"] .room-capacity-note{color:var(--mint)!important}
:root[data-theme="dark"] .join-code-card{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .join-code-card span{color:var(--muted)}
:root[data-theme="dark"] .join-code-card strong{color:var(--mint2)}
:root[data-theme="dark"] .waiting-room-settings{border:1px solid var(--panel2);background:var(--panel)}
:root[data-theme="dark"] .waiting-room-settings h3{color:#dce9e8}
:root[data-theme="dark"] .waiting-room-settings dl>div{background:var(--panel)}
:root[data-theme="dark"] .waiting-room-settings dt{color:var(--muted)}
:root[data-theme="dark"] .waiting-room-settings dd{color:#f2f6f5}
:root[data-theme="dark"] .waiting-room-count strong{color:var(--mint2)}
:root[data-theme="dark"] .waiting-room-count span{color:var(--muted)}
:root[data-theme="dark"] .waiting-room-roster li{background:var(--panel)}
:root[data-theme="dark"] .waiting-room-roster i{background:var(--panel2);color:#dce9e8}
:root[data-theme="dark"] .waiting-room-roster span{color:#e6eeed}
:root[data-theme="dark"] .waiting-room-roster small{color:var(--muted)}
:root[data-theme="dark"] .waiting-room-roster small b{background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .waiting-room-roster small .match-level{color:var(--match-level-color,var(--paper))}
:root[data-theme="dark"] .waiting-room-roster small .match-state{color:var(--mint2)}
:root[data-theme="dark"] .waiting-room-roster small .match-rating{color:var(--metric-rating)}
:root[data-theme="dark"] .waiting-room-roster li.host-player span{color:var(--gold)}
:root[data-theme="dark"] .room-kick{border:1px solid var(--line);background:var(--panel2);color:#eef5f2}
:root[data-theme="dark"] .dice-player-chip{border:1px solid var(--panel2);background:var(--panel)}
:root[data-theme="dark"] .dice-player-chip.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .dice-player-chip.mine{background:var(--panel2)}
:root[data-theme="dark"] .dice-player-chip i{background:var(--panel2);color:#dce9e8}
:root[data-theme="dark"] .dice-player-chip small{color:var(--muted)}
:root[data-theme="dark"] .dice-player-chip b{background:var(--panel2);color:var(--mint2)}
:root[data-theme="dark"] .dice-quantity-stepper{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .dice-quantity-stepper button{background:var(--panel2);color:var(--mint2)}
:root[data-theme="dark"] .dice-quantity-stepper strong{color:var(--paper)}
:root[data-theme="dark"] .dice-bid-controls label>small{color:var(--muted)}
:root[data-theme="dark"] .dice-face-choice{border:1px solid #425e6f;background:#172a3a}
:root[data-theme="dark"] .dice-face-choice.active{border-color:var(--gold);background:#3b3a2f;box-shadow:0 0 0 2px #f6c45333}
:root[data-theme="dark"] .bid-face-die{background:var(--panel)}
:root[data-theme="dark"] .multi-final-list span{background:var(--panel)}
:root[data-theme="dark"] .multi-final-list .winner{border-left:4px solid var(--mint)}
:root[data-theme="dark"] .multi-final-list .loser{border-left:4px solid var(--coral)}
:root[data-theme="dark"] .multi-final-list .neutral{border-left:4px solid var(--gold)}
@media(max-width:560px){:root[data-theme="dark"] .waiting-room-panel>[data-start-room]{box-shadow:0 -8px 18px #25322dcc}}
:root[data-theme="dark"] .credit-player-chip{border:1px solid var(--panel2);background:var(--panel)}
:root[data-theme="dark"] .credit-player-chip.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .credit-player-chip.mine{background:var(--panel2)}
:root[data-theme="dark"] .credit-player-chip i{background:var(--panel2)}
:root[data-theme="dark"] .credit-player-chip small{color:var(--muted)}
:root[data-theme="dark"] .credit-player-chip b{color:var(--mint2)}
:root[data-theme="dark"] .card-game-status{background:var(--panel);color:#d8f4ed}
:root[data-theme="dark"] .card-game-status span{color:#8eb8b0}
:root[data-theme="dark"] .live-credit-delta{color:var(--gold);text-shadow:0 1px 3px var(--ink),0 0 8px #f6cf6555}
:root[data-theme="dark"] .mahjong-table{border:1px solid var(--panel2);background:linear-gradient(145deg,var(--panel),var(--panel))}
:root[data-theme="dark"] .mahjong-opponent,:root[data-theme="dark"] .mahjong-self{border:1px solid var(--panel2);background:var(--panel)}
:root[data-theme="dark"] .mahjong-opponent.active,:root[data-theme="dark"] .mahjong-self.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .mahjong-opponent header span,:root[data-theme="dark"] .mahjong-self header span,:root[data-theme="dark"] .mahjong-opponent>small{color:var(--muted)}
:root[data-theme="dark"] .mahjong-hidden-hand i{background:linear-gradient(90deg,#d7e4db,#a9c2b6)}
:root[data-theme="dark"] .mahjong-melds>span{background:var(--panel)}
:root[data-theme="dark"] .mahjong-own-tile.selected{border-color:var(--gold);box-shadow:0 0 0 2px #f6cf6533}
:root[data-theme="dark"] .mahjong-own-tile.coach-target{border-color:#8a681f;box-shadow:0 0 0 2px #d1ad4a44}
:root[data-theme="dark"] .mahjong-actions span{color:var(--muted)}
:root[data-theme="dark"] .credit-settlement li{background:var(--panel)}
:root[data-theme="dark"] .credit-settlement li small{color:var(--muted)}
:root[data-theme="dark"] .credit-settlement li.positive{border-left:4px solid var(--mint)}
:root[data-theme="dark"] .credit-settlement li.negative{border-left:4px solid var(--coral)}
:root[data-theme="dark"] .credit-settlement li.even{border-left:4px solid var(--muted)}
:root[data-theme="dark"] .credit-settlement li.positive b{color:var(--mint2)}
:root[data-theme="dark"] .credit-settlement li.negative b{color:#ff8da2}
:root[data-theme="dark"] .credit-session-note{color:var(--muted)}
:root[data-theme="dark"] .holdem-table{border:1px solid #285b4b;background:radial-gradient(ellipse at center,#145a43 0,#0c4437 58%,var(--panel) 100%);box-shadow:inset 0 0 0 9px var(--panel)}
:root[data-theme="dark"] .holdem-pot>span,:root[data-theme="dark"] .holdem-pot>small{color:#9fc4b9}
:root[data-theme="dark"] .holdem-pot>strong{color:#fff2bc}
:root[data-theme="dark"] .poker-card{border:1px solid #9aa79f;background:#f7f7ee;box-shadow:0 4px 0 #aab8af,inset 0 0 0 1px #ffffff99;color:#25322d}
:root[data-theme="dark"] .poker-card.red{color:var(--card-red)}
:root[data-theme="dark"] .poker-card.hidden{border-color:#80938a;background:repeating-linear-gradient(45deg,#34463e 0 5px,#d7e0d9 5px 7px);color:#e7d36a}
:root[data-theme="dark"] .holdem-seat{border:1px solid #487365;background:var(--panel)}
:root[data-theme="dark"] .holdem-seat.active{border-color:var(--gold);box-shadow:0 0 0 2px #f6cf6533}
:root[data-theme="dark"] .holdem-seat.mine{background:#163d38}
:root[data-theme="dark"] .holdem-seat.folded,:root[data-theme="dark"] .casino-poker-seat.folded{box-shadow:inset 0 0 0 999px #171e1c66}
:root[data-theme="dark"] .holdem-seat .poker-card{box-shadow:0 2px 0 #9daaa2,inset 0 0 0 1px #ffffff99}
:root[data-theme="dark"] .holdem-seat>span{color:var(--mint2)}
:root[data-theme="dark"] .holdem-seat>small{color:#96aaa5}
:root[data-theme="dark"] .holdem-self-cards>span{color:#b4cec5}
:root[data-theme="dark"] .holdem-actions label>span{color:#9cb3ad}
:root[data-theme="dark"] .holdem-wait{color:#c2d5cf}
:root[data-theme="dark"] .pig-scores>div.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .mahjong-opponent header>div small{color:var(--muted)}
:root[data-theme="dark"] .mahjong-opponent-meta{color:var(--muted)}
:root[data-theme="dark"] .mahjong-shown-section>small{color:var(--muted)}
:root[data-theme="dark"] .mahjong-shown-meld>.mahjong-exposed-tile{background:var(--panel)}
:root[data-theme="dark"] .holdem-actions{background:var(--panel)}
:root[data-theme="dark"] .holdem-raise-control>span{color:#9cb3ad}
:root[data-theme="dark"] .holdem-seat>div.holdem-seat-coach{color:#d8b950}
:root[data-theme="dark"] .holdem-seat-coach b{color:#c6b77f}
:root[data-theme="dark"] .poker-card.holdem-scoring-card{border:2px solid #f6cf65;box-shadow:0 3px 0 #8d7229,0 0 0 2px #f6d66b77,0 0 12px #f6cf6599,inset 0 0 0 1px #fff7c7aa}
:root[data-theme="dark"] .game-guide-button{border:1px solid var(--muted);background:var(--panel2);color:var(--paper);box-shadow:inset 0 1px 0 #ffffff16}
:root[data-theme="dark"] .game-guide-button:hover,:root[data-theme="dark"] .game-guide-button:focus-visible{border-color:var(--gold);color:var(--gold);background:var(--panel2)}
:root[data-theme="dark"] .game-guide-summary{color:var(--paper)}
:root[data-theme="dark"] .game-guide-setting{border:1px solid #b3c4b966;background:var(--panel);color:var(--muted)}
:root[data-theme="dark"] .game-guide-section{border:1px solid #4c625655;background:var(--panel)}
:root[data-theme="dark"] .game-guide-section h3{color:var(--gold)}
:root[data-theme="dark"] .game-guide-section p{color:var(--paper)}
:root[data-theme="dark"] .game-guide-section ul{color:var(--paper)}
:root[data-theme="dark"] .game-guide-group{border:1px solid #4c625666;background:var(--panel)}
:root[data-theme="dark"] .game-guide-group>summary{background:var(--panel)}
:root[data-theme="dark"] .game-guide-group>summary strong{color:var(--gold)}
:root[data-theme="dark"] .game-guide-group>summary small{color:var(--muted)}
:root[data-theme="dark"] .game-guide-group>summary i:before,:root[data-theme="dark"] .game-guide-group>summary i:after{background:var(--paper)}
:root[data-theme="dark"] .game-guide-group .game-guide-section{border-color:#4c625644}
:root[data-theme="dark"] .game-guide-table-wrap{border:1px solid #b3c4b955;background:var(--ink)}
:root[data-theme="dark"] .game-guide-table-wrap table{color:var(--paper)}
:root[data-theme="dark"] .game-guide-table-wrap th,:root[data-theme="dark"] .game-guide-table-wrap td{border-right:1px solid #b3c4b944;border-bottom:1px solid #b3c4b944}
:root[data-theme="dark"] .game-guide-table-wrap th{background:var(--panel);color:var(--gold)}
@media(max-width:600px){:root[data-theme="dark"] .game-guide-table-wrap tr{border:1px solid #b3c4b955;background:var(--ink)}
:root[data-theme="dark"] .game-guide-table-wrap td{border-bottom:1px solid #b3c4b944}
:root[data-theme="dark"] .game-guide-table-wrap td:before{color:var(--gold)}}
:root[data-theme="dark"] .mahjong-concealed-count{color:var(--muted)!important}
:root[data-theme="dark"] .dice-quantity-stepper button:disabled{color:var(--muted)}
:root[data-theme="dark"] .holdem-summary li{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .holdem-summary li.winner{border-color:var(--gold);box-shadow:inset 3px 0 var(--gold)}
:root[data-theme="dark"] .holdem-summary li>i{background:var(--panel2);color:#dce8e7}
:root[data-theme="dark"] .holdem-summary li span{color:var(--muted)}
:root[data-theme="dark"] .holdem-summary li>b{color:var(--gold)}
:root[data-theme="dark"] .blackjack-dealer,:root[data-theme="dark"] .blackjack-hand{border:1px solid #447163;background:var(--panel)}
:root[data-theme="dark"] .blackjack-dealer header span,:root[data-theme="dark"] .blackjack-hand header span,:root[data-theme="dark"] .blackjack-hand footer span{color:#9eb9b2}
:root[data-theme="dark"] .blackjack-hand.active,:root[data-theme="dark"] .landlord-opponent.active,:root[data-theme="dark"] .landlord-self.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .blackjack-hand.mine{background:#16413a}
:root[data-theme="dark"] .blackjack-hand footer b{color:#fff2bc}
:root[data-theme="dark"] .landlord-bottom>span{color:#9eb9b2}
:root[data-theme="dark"] .landlord-status>div:first-child>span{color:#8eb8b0}
:root[data-theme="dark"] .landlord-opponent,:root[data-theme="dark"] .landlord-self{border:1px solid #447163;background:var(--panel)}
:root[data-theme="dark"] .landlord-self{background:#16413a}
:root[data-theme="dark"] .landlord-seat-meta>small{color:#9eb9b2}
:root[data-theme="dark"] .landlord-role-callout{color:var(--gold);text-shadow:0 1px 7px #f6cf6544}
:root[data-theme="dark"] .landlord-remaining-cards{color:#e5f2ee}
:root[data-theme="dark"] .landlord-last-play-content .landlord-play-label{color:#bdd4ce}
:root[data-theme="dark"] .landlord-play-label b{color:var(--gold)}
:root[data-theme="dark"] .landlord-last-play-content :is(.landlord-passed,:root[data-theme="dark"] .landlord-no-play){color:#718e88}
:root[data-theme="dark"] .landlord-passed{color:#9eb9b2!important}
:root[data-theme="dark"] .landlord-trick{background:#0c3732}
:root[data-theme="dark"] .landlord-trick>span{color:#b7d2ca}
:root[data-theme="dark"] .landlord-trick.empty{color:#7f9c96}
:root[data-theme="dark"] .landlord-own-card.selected .poker-card{outline:2px solid var(--gold)}
:root[data-theme="dark"] .landlord-own-card.coach-target .poker-card{outline:2px solid #d1ad4a;box-shadow:0 3px 0 #8d7229,0 0 0 3px #d1ad4a44,0 0 12px #d1ad4a77}
:root[data-theme="dark"] .solitaire-table .poker-card.hidden{background:#34463e}
:root[data-theme="dark"] .solitaire-status .solitaire-clock{color:#d8f4ed}
:root[data-theme="dark"] .solitaire-pile{border:1px dashed #6b8c81;background:#123a32;color:#a7c3ba}
:root[data-theme="dark"] .solitaire-pile.selected,:root[data-theme="dark"] .solitaire-tableau-card.selected .poker-card{outline:2px solid var(--gold)}
:root[data-theme="dark"] .solitaire-empty{border:1px dashed #6b8c81;color:#89a79e}
:root[data-theme="dark"] .solitaire-help{color:#9db6ae}
:root[data-theme="dark"] .joker-art.black{color:var(--panel)}
:root[data-theme="dark"] .joker-art.gold{color:#bd8f22}
:root[data-theme="dark"] .joker-hat-mark rect,:root[data-theme="dark"] .joker-hat-mark circle{fill:#f7f7ee}
:root[data-theme="dark"] .blackjack-round-result strong{color:var(--gold)}
:root[data-theme="dark"] .blackjack-dealer footer{color:#fff2bc}
:root[data-theme="dark"] .blackjack-dealer.bust{border-color:#a84557}
:root[data-theme="dark"] .blackjack-dealer.bust footer{color:#ff8aa0}
:root[data-theme="dark"] .blackjack-hand.winner{border-color:#49c8aa}
:root[data-theme="dark"] .blackjack-hand.loser{border-color:#a84557}
:root[data-theme="dark"] .blackjack-hand.even{border-color:var(--line)}
:root[data-theme="dark"] .blackjack-hand.winner footer span{color:var(--mint2)}
:root[data-theme="dark"] .blackjack-hand.loser footer span{color:#ff8aa0}
:root[data-theme="dark"] .holdem-board-empty,:root[data-theme="dark"] .casino-card-placeholder{border:1px dashed #6d9187;background:#0e3932;box-shadow:0 4px 0 #234d43}
:root[data-theme="dark"] .casino-flow.holdem-progress{border:1px solid #5f5128;background:#142f2c}
:root[data-theme="dark"] .casino-flow.holdem-progress .current span,:root[data-theme="dark"] .casino-flow.holdem-progress .done span{color:#f0d77d}
:root[data-theme="dark"] .history-game-filter>span{color:var(--muted)}
:root[data-theme="dark"] .casino-player-info .live-credit{color:var(--metric-credit)}
:root[data-theme="dark"] .casino-player-status{color:#a6c9c0}
:root[data-theme="dark"] .casino-player-extra .holdem-seat-coach{color:#d8b950}
:root[data-theme="dark"] .casino-hand,:root[data-theme="dark"] .casino-seat,:root[data-theme="dark"] .casino-poker-seat{border:1px solid #31564f;background:#103b35}
:root[data-theme="dark"] .casino-hand.winner{border-color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .casino-hand header span,:root[data-theme="dark"] .casino-poker-seat header span,:root[data-theme="dark"] .casino-seat span,:root[data-theme="dark"] .casino-seat small,:root[data-theme="dark"] .casino-poker-seat>small{color:#a6c9c0}
:root[data-theme="dark"] .casino-seat>.live-credit{color:var(--metric-credit)}
:root[data-theme="dark"] .casino-seat.active,:root[data-theme="dark"] .casino-poker-seat.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .casino-poker-seat.mine{background:#15493f}
:root[data-theme="dark"] .casino-card-choice.selected{border-color:var(--gold);box-shadow:0 0 0 2px #f6cf6533}
:root[data-theme="dark"] .casino-actions{background:#0b332e}
:root[data-theme="dark"] .three-card-dealer{background:#0d342f}
:root[data-theme="dark"] .casino-flow li{color:#71988f}
:root[data-theme="dark"] .casino-flow li:not(:last-child)::after{background:#31564f}
:root[data-theme="dark"] .casino-flow i{border:2px solid #31564f;background:#0c302c}
:root[data-theme="dark"] .casino-flow .done,:root[data-theme="dark"] .casino-flow .current{color:#f0d77d}
:root[data-theme="dark"] .casino-flow .done i,:root[data-theme="dark"] .casino-flow .done:not(:last-child)::after{border-color:#9e7b22;background:#9e7b22;color:#081c1a}
:root[data-theme="dark"] .casino-flow .current i{border-color:var(--gold);box-shadow:0 0 0 4px #f6cf651f,0 0 15px #f6cf6542}
:root[data-theme="dark"] .toast{border:1px solid var(--line);background:#25322ded;color:var(--muted);box-shadow:0 8px 22px #171e1c66}
:root[data-theme="dark"] .coin-slice{background:linear-gradient(90deg,#713700 0%,#be6900 13%,#ffcf43 38%,#f6aa12 56%,#9c4b00 82%,#5b2a00 100%);border:1px solid #6a3300;box-shadow:inset 0 1px #ffe27c55}
:root[data-theme="dark"] .coin-face{border:2px solid #8d5005;background:radial-gradient(circle at 30% 22%,#fff9ce 0 5%,transparent 6%),radial-gradient(circle at 42% 37%,#fff1a8 0%,#ffd354 24%,#e79b0d 53%,#9d5102 73%,#f8cc4e 82%,#703600 90%,#df930a 97%);box-shadow:0 7px 6px #0007,inset 0 0 0 3px #ffe07a,inset 0 0 0 5px #a96607,inset -5px -6px 8px #6b360080,inset 4px 4px 7px #fff5b080;color:#804500;text-shadow:0 1px 0 #ffec99,0 -1px 0 #653500}
:root[data-theme="dark"] .coin-face b{border:1px solid #9b5b08;box-shadow:inset 0 1px 2px #fff3a8,0 1px 1px #6d3700}
:root[data-theme="dark"] .mahjong-own-tile.claim-match{border-color:var(--gold);background:#f6cf6512;box-shadow:0 0 0 2px #f6cf6538,0 5px 12px #0004}
:root[data-theme="dark"] .mahjong-action-callout{color:var(--gold);text-shadow:0 1px 8px #f6cf6544}
:root[data-theme="dark"] .mahjong-seat-detail{color:var(--muted)!important}
:root[data-theme="dark"] .mahjong-opponent.mahjong-won,:root[data-theme="dark"] .mahjong-self.mahjong-won{box-shadow:inset 0 0 0 999px #171e1c88}
:root[data-theme="dark"] .mahjong-name-line .mahjong-ai-credit{color:var(--muted)!important}
:root[data-theme="dark"] .credit-settlement li.credit-self{border:2px solid #f5f7f2!important;box-shadow:0 0 0 1px #ffffff26}
:root[data-theme="dark"] .credit-settlement .credit-place{background:var(--panel2);color:#e9f1ef}
:root[data-theme="dark"] .credit-settlement li .credit-combo{color:#e5bd50}
:root[data-theme="dark"] .mahjong-own-tile.claim-match .mahjong-tile{color:#edc24f;text-shadow:0 0 7px #edc24f55}
:root[data-theme="dark"] #app[data-reveal-pending] .dice-reveal::before{color:#a9c9c2}
:root[data-theme="dark"] #app[data-reveal-pending] .casino-hand.winner{border-color:#31564f}
:root[data-theme="dark"] .fleet-chip.sunk{background:#77818a!important}
:root[data-theme="dark"] .dice-player-chip.mine:not(.active),:root[data-theme="dark"] .credit-player-chip.mine:not(.active),:root[data-theme="dark"] .mahjong-self.mine:not(.active),:root[data-theme="dark"] .holdem-seat.mine:not(.active),:root[data-theme="dark"] .blackjack-hand.mine:not(.active),:root[data-theme="dark"] .casino-seat.mine:not(.active),:root[data-theme="dark"] .casino-poker-seat.mine:not(.active),:root[data-theme="dark"] .landlord-self.mine:not(.active){border-color:#f5f7f2;box-shadow:inset 0 0 0 1px #ffffffc7}
:root[data-theme="dark"] .mahjong-tile[data-mahjong-face]{box-shadow:0 1px 1px #0313167a}
:root[data-theme="dark"] .mahjong-tile[data-mahjong-face]::before{background:var(--mahjong-face-image) center/100% 100% no-repeat}
:root[data-theme="dark"] .live-hand-count-value.count-changed{color:var(--gold)}
:root[data-theme="dark"] .mahjong-own-tile.claim-match>.mahjong-tile{box-shadow:0 0 0 2px #edc24f,0 0 8px #edc24f70}
:root[data-theme="dark"] .solitaire-pile>.solitaire-foundation-mark{color:#91a59f}
:root[data-theme="dark"] .solitaire-result-suits .card-suit-d,:root[data-theme="dark"] .solitaire-result-suits .card-suit-h{color:var(--coral)}
:root[data-theme="dark"] .room-progress-control>span{color:#fff!important;text-shadow:none!important}
:root[data-theme="dark"] .return-room-countdown{border:1px solid var(--line);background:var(--panel2);color:#fff}
:root[data-theme="dark"] .mahjong-own-hand>.mahjong-own-tile.coach-target>.mahjong-tile{box-shadow:inset 0 0 0 2px #d1ad4a,0 0 0 2px #d1ad4a55,0 0 10px #d1ad4a88}
:root[data-theme="dark"] .mahjong-opponent.mahjong-won::after,:root[data-theme="dark"] .mahjong-self.mahjong-won::after{border:2px solid #d3ad52;background:#171e1c68;box-shadow:inset 0 0 24px #0005,0 0 0 1px #f6cf6555}
:root[data-theme="dark"]{--header-control-fg:#eaf1eb}
:root[data-theme="dark"] .header-icon-btn,:root[data-theme="dark"] .music-btn,:root[data-theme="dark"] .music-btn.on,:root[data-theme="dark"] .music-btn.off,:root[data-theme="dark"] .desktop-reaction-btn,:root[data-theme="dark"] .host-power-btn.host-offline{color:var(--header-control-fg)}
:root[data-theme="dark"] .holdem-actions button:not(.coach-action),:root[data-theme="dark"] .casino-actions button:not(.coach-action){border:1px solid var(--line)!important;background:var(--panel2)!important;color:#eef5f2!important}
:root[data-theme="dark"] .die-face,:root[data-theme="dark"] .reveal-die,:root[data-theme="dark"] .pig-die,:root[data-theme="dark"] .bid-face-die{box-shadow:0 8px 18px #07121966!important}
:root[data-theme="dark"] .dice-rolling{box-shadow:0 8px 18px #171e1c66!important}
:root[data-theme="dark"] .dice-zhai-button.active{border-color:var(--gold);color:var(--gold);box-shadow:inset 0 0 0 1px #f6cf6555}
:root[data-theme="dark"] .cc-hole{background:var(--panel2)!important}
:root[data-theme="dark"] .cc-hole.legal{background:#12bfa0!important}
:root[data-theme="dark"] .scorebar .score-piece.piece-dark{border-color:#526475;background:#101d2b;color:#f5f7f2;box-shadow:inset 0 -2px #07101a;text-shadow:0 1px 1px #000}
:root[data-theme="dark"] .scorebar .score-piece.piece-light{border-color:#aab8c5;background:#edf8f5;color:#102338;box-shadow:inset 0 -2px #c7d6d4}
:root[data-theme="dark"] .scorebar .score-piece.piece-coral{border-color:#f68ca0;background:#ef6077;color:#102338;box-shadow:inset 0 -2px #ca405c}
:root[data-theme="dark"] .scorebar .round-pill{color:var(--muted)}
:root[data-theme="dark"] .scorebar .player-context{color:var(--muted)}
:root[data-theme="dark"] .scorebar .player-submetric .pawn-loss{color:var(--coral)}
:root[data-theme="dark"] .account-help{color:var(--muted)}
:root[data-theme="dark"] .host-users-summary{color:var(--muted)}
:root[data-theme="dark"] .host-user-list li{background:var(--panel)}
:root[data-theme="dark"] .host-user-level{background:#4bc8af1b;color:var(--mint2)}
:root[data-theme="dark"] .host-user-name small{background:#f2c66d1c;color:#f2c66d}
:root[data-theme="dark"] .host-user-last{color:var(--muted)}
:root[data-theme="dark"] .host-user-last.online{color:#59d8a7}
:root[data-theme="dark"] .host-user-copy dt{color:var(--muted)}
:root[data-theme="dark"] .host-user-copy dd{color:var(--muted)}
:root[data-theme="dark"] .host-users-empty{color:var(--muted)}
@media(max-width:430px){:root[data-theme="dark"] #app[data-game-kind="battleship"] .scorebar .score{border:2px solid #087d6c}}
:root[data-theme="dark"] .matchmaking-default-note>span+span{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-banner{border:1px solid #b3c4b966;background:linear-gradient(115deg,var(--panel2),var(--panel))}
:root[data-theme="dark"] .leaderboard-cup{color:#e4c487}
:root[data-theme="dark"] .leaderboard-slide>small{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-category select{background:var(--panel2);border:1px solid #b3c4b966}
:root[data-theme="dark"] .leaderboard-note{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-row{border-bottom:1px solid #b3c4b933}
:root[data-theme="dark"] .leaderboard-place{color:#d6bc83}
:root[data-theme="dark"] .leaderboard-row p{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-row.is-you{background:#4c625633}
:root[data-theme="dark"] .leaderboard-own{border-top:1px solid #b3c4b966}
:root[data-theme="dark"] .leaderboard-empty{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-own-place{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-gap{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-place{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-row.is-top-ten .leaderboard-place{color:#e8c16f}
:root[data-theme="dark"] .leaderboard-row.is-you{border:1px solid #82d8cd77;border-left:3px solid #82d8cd;background:linear-gradient(110deg,#4c625655,#34463e88 65%,#d2bc7922);box-shadow:inset 0 1px 0 #d7fff51c,0 3px 14px #25322d26}
:root[data-theme="dark"] .leaderboard-row.is-you .leaderboard-identity{color:#defbf3}
:root[data-theme="dark"] .leaderboard-row.is-you strong{color:#bcefe0}
:root[data-theme="dark"] .leaderboard-row.is-you .leaderboard-place{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-row.is-you.is-top-ten .leaderboard-place{color:#e8c16f}
:root[data-theme="dark"] .lobby-entry-copy h2{color:var(--mint2)}
:root[data-theme="dark"] .leaderboard-row.is-top-three .leaderboard-identity>.leaderboard-player-name{color:#e8c16f}
:root[data-theme="dark"] .leaderboard-chevron{stroke:var(--paper)}
:root[data-theme="dark"] .leaderboard-level{color:var(--muted)}
:root[data-theme="dark"] .leaderboard-skeleton-row{border-bottom:1px solid #b3c4b922}
:root[data-theme="dark"] .leaderboard-skeleton-row i,:root[data-theme="dark"] .leaderboard-banner-skeleton{background:linear-gradient(100deg,#b3c4b922 25%,#b3c4b94a 50%,#b3c4b922 75%)}
:root[data-theme="dark"] .privacy-panel iframe{border:1px solid var(--line);background:var(--panel)}
:root[data-theme="dark"] .account-form .primary.is-pending{box-shadow:inset 0 -2px #2fa78d}
:root[data-theme="dark"] .input.input-invalid{border-color:#ed6670!important;box-shadow:0 0 0 2px #ed667055!important}
:root[data-theme="dark"] .profile-loading i{background:linear-gradient(100deg,#b3c4b922 25%,#b3c4b94a 50%,#b3c4b922 75%);background-size:200% 100%}
:root[data-theme="dark"] [data-public-player]:focus-visible{outline:2px solid #65e3b8}
:root[data-theme="dark"] .friends-list>li{background:var(--panel)}
:root[data-theme="dark"] .friend-identity small{color:var(--muted)}
:root[data-theme="dark"] .waiting-seat-add{background:var(--panel);color:var(--mint2)}
:root[data-theme="dark"] .waiting-seat-add:hover{background:var(--panel2)}
:root[data-theme="dark"] .premium-products article{border:1px solid #b3c4b966;background:var(--panel)}
:root[data-theme="dark"] .premium-products p{color:var(--muted)}
:root[data-theme="dark"] .premium-status{color:#50c7ae}
:root[data-theme="dark"] .house-brand{color:var(--mint)}
:root[data-theme="dark"] .home-discovery-actions .premium-icon{color:var(--header-control-fg)}


:root[data-theme="dark"] .credit-reward-entry{background:var(--panel)}
:root[data-theme="dark"] .credit-reward-balance>span{color:var(--muted)}
:root[data-theme="dark"] .credit-reward-balance strong{color:var(--metric-credit)}
:root[data-theme="dark"] .credit-reward-action small{color:var(--metric-credit)}
:root[data-theme="dark"] .credit-assistance-toast{border:1px solid #a98238;background:#2a2518f7;color:#f7e4a7;box-shadow:0 12px 32px #00000088,0 0 18px #f6cf6522}
:root[data-theme="dark"] .credit-assistance-toast>span{color:var(--metric-credit)}
:root[data-theme="dark"] .credit-assistance-toast p{color:#cbbd96}
:root[data-theme="dark"] .credit-assistance-toast svg{stroke:#d7c48d}
:root[data-theme="dark"] .premium-crown{color:var(--gold,#f5ce76)}
:root[data-theme="dark"] .leaderboard-row.is-you{box-shadow:inset 3px 0 #82d8cd,inset 0 0 0 1px #82d8cd77,0 3px 14px #25322d26}
:root[data-theme="dark"] .more-app-categories article{background:var(--panel-dark,var(--panel))}
:root[data-theme="dark"] .premium-discount-price{color:var(--gold,#f5ce76);text-shadow:0 1px 1px #143b3480}
:root[data-theme="dark"] .mines-window{background:#c0c0c0;border-color:#fff #777 #777 #fff;color:#111}
:root[data-theme="dark"] .mines-controls{border-color:#777 #fff #fff #777}
:root[data-theme="dark"] .mines-counter{background:#120000;color:#ff3030}
:root[data-theme="dark"] .mines-face{background:#c0c0c0;border-color:#fff #777 #777 #fff}
:root[data-theme="dark"] .mines-scroll{border-color:#777 #fff #fff #777}
:root[data-theme="dark"] .mines-board{background:#aaa}
:root[data-theme="dark"] .mines-cell{border:clamp(1px,calc(var(--mine-cell-size,32px) / 12),3px) solid;border-color:#fff #808080 #808080 #fff;background:#c0c0c0;color:#d00000}
:root[data-theme="dark"] .mines-cell.revealed{border:1px solid #888}
:root[data-theme="dark"] .mines-cell.exploded{background:#ff3030}
:root[data-theme="dark"] .pinball-frame{background:#171e1c}
:root[data-theme="dark"] .game-guide-group-credits summary{border-left:3px solid #cba75e}
:root[data-theme="dark"] .pinball-frame{background:#25322d}
:root[data-theme="dark"] .solo-result-metric small{color:var(--muted)}
:root[data-theme="dark"] .mine-reveal-cover{background:#c0c0c0;border-color:#fff #808080 #808080 #fff;color:#d00000}
:root[data-theme="dark"] .solo-saved-game p{color:var(--muted)}
:root[data-theme="dark"] .solo-new-setup{border-top:1px solid var(--line)}
:root[data-theme="dark"] .solo-entry-divider{color:var(--muted)}
:root[data-theme="dark"] .solo-entry-divider::before,:root[data-theme="dark"] .solo-entry-divider::after{background:var(--line)}
:root[data-theme="dark"] #orientation-guard{background:var(--ink);color:var(--paper)}
:root[data-theme="dark"] .orientation-card svg{stroke:#79dac5}
:root[data-theme="dark"] .orientation-card p{color:var(--paper)}
:root[data-theme="dark"] .orientation-card .orientation-live{color:var(--muted)}
:root[data-theme="dark"] .solo-result-stats{border-top:1px solid var(--line)}
:root[data-theme="dark"] .solo-result-stats small{color:var(--muted,var(--muted))}
:root[data-theme="dark"] .solo-result-stats strong{color:var(--mint,#5cdbbe)}
:root[data-theme="dark"] .solo-record-badge{color:#ffe09c;background:#dbad3420}
:root[data-theme="dark"] .solo-xp{color:var(--mint,#5cdbbe)}
:root[data-theme="dark"] .solo-record-badge{border:1px solid #c29b493d;background:#dbad3414}
:root[data-theme="dark"] .solo-record-badge>span[aria-hidden]{color:#e8c775}
:root[data-theme="dark"] .solo-record-chase rect{stroke:#e8c775}


/* Approved Mist / Emerald semantic palette, shared by every UI surface. */
:root{--table:#a6c1b0;--table-ink:#203c30;--cover:#526e80;--cover-ink:#f3f6f3;--action-ink:#ffffff;--action-edge:#1c5946;--danger-edge:#813040;--toast-bg:#243b34;--toast-ink:#e7eeeb}
:root[data-theme="dark"]{--table:#294d3d;--table-ink:#eaf1eb;--cover:#263b42;--cover-ink:#f3f6f3;--action-ink:#17251e;--action-edge:#4eaa91;--danger-edge:#bf6578;--toast-bg:#d7e3dd;--toast-ink:#243b34}
:root[data-theme] body,:root[data-theme] #app{background:var(--ink);color:var(--paper)}
:root[data-theme] .top{background:var(--ink);border-color:var(--line)}
:root[data-theme] :is(.panel,.header-icon-btn,.reaction-menu){background:var(--panel);border-color:var(--line);color:var(--paper)}
:root[data-theme] :is(.secondary,.selection-options button,.game-select-trigger,.seg,.dice-quantity-stepper){background:var(--panel2);border-color:var(--line);color:var(--paper)}
:root[data-theme] :is(.primary,.turn-badge.live){background:var(--mint);color:var(--action-ink);--button-edge:var(--action-edge)}
:root[data-theme] :is(.danger,.turn-badge.live.timer-warning){background:var(--coral);color:var(--action-ink);--button-edge:var(--danger-edge)}
:root[data-theme] :is(.input,input,textarea,select){color:var(--paper)}
:root[data-theme] .game-tab,:root[data-theme] .game-tab.has-art{background:var(--cover);color:var(--cover-ink);border-color:var(--line)}
:root[data-theme] .game-tab.has-art span{text-shadow:0 1px 5px #00000066}
:root[data-theme] .game-tab.has-art::before{-webkit-mask-image:linear-gradient(to right,transparent,#000 35%);mask-image:linear-gradient(to right,transparent,#000 35%)}
:root[data-theme] :is(.scorebar,.turn-badge,.battle-turn){background:var(--panel2);border-color:var(--line);color:var(--paper)}
:root[data-theme] .scorebar .player-context,:root[data-theme] .turn-badge:not(.live){color:var(--muted)}
:root[data-theme] .battle-turn.active{color:var(--mint);border-color:var(--mint)}
:root[data-theme] :is(.holdem-table,.blackjack-table,.casino-table,.mahjong-table,.landlord-table){background:var(--table);border-color:var(--line);color:var(--table-ink);box-shadow:inset 0 0 0 4px var(--line)}
:root[data-theme] .casino-horseshoe.order-guided:is(.seat-count-4,.seat-count-5,.seat-count-6)>.casino-player-row::after{background:var(--table-ink);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M1 7h12M9 3l4 4-4 4' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.75}
:root[data-theme] :is(.casino-hand,.casino-seat,.casino-poker-seat,.holdem-seat,.blackjack-dealer,.blackjack-hand,.landlord-opponent,.landlord-self,.mahjong-opponent,.mahjong-self){background:var(--panel);border-color:var(--line);color:var(--paper)}
:root[data-theme] :is(.casino-poker-seat.mine,.holdem-seat.mine,.blackjack-hand.mine,.landlord-self){background:var(--panel2)}
:root[data-theme] :is(.casino-actions,.blackjack-actions,.holdem-actions,.landlord-trick){background:var(--panel2);color:var(--paper)}
:root[data-theme] :is(.casino-heading,.holdem-heading,.landlord-status,.landlord-remaining-cards,.casino-heading>strong,.casino-heading>strong .credit-amount){color:var(--paper)}
:root[data-theme] :is(.casino-hand header span,.casino-poker-seat header span,.casino-seat small,.casino-poker-seat>small,.landlord-seat-meta>small,.landlord-status>div:first-child>span,.mahjong-opponent header span,.mahjong-self header span,.mahjong-opponent-meta,.mahjong-actions span,.holdem-wait,.casino-heading>span,.casino-heading>small,.casino-player-status,.holdem-seat>small,.blackjack-dealer header span,.blackjack-hand header span,.blackjack-hand footer span){color:var(--muted)}
:root[data-theme] :is(.blackjack-hand footer b,.blackjack-dealer footer){color:var(--gold)}
:root[data-theme] .casino-flow.holdem-progress{background:var(--panel2);border-color:var(--line)}
:root[data-theme] .casino-flow li{color:var(--muted)}
:root[data-theme] .casino-flow i{background:var(--panel2);border-color:var(--line);color:var(--muted)}
:root[data-theme] .casino-flow li::after{background:var(--line)}
:root[data-theme] .casino-flow :is(.done,.current),:root[data-theme] .casino-flow.holdem-progress :is(.done,.current) span{color:var(--mint)}
:root[data-theme] .casino-flow .done i{background:var(--gold);border-color:var(--gold);color:var(--panel)}
:root[data-theme] .casino-flow .current i{background:var(--mint);border-color:var(--mint);color:var(--action-ink);box-shadow:0 0 0 4px color-mix(in srgb,var(--mint) 15%,transparent)}
:root[data-theme] .toast{background:var(--toast-bg);color:var(--toast-ink);border-color:var(--line)}
:root[data-theme] .leaderboard-row.is-you{background:var(--panel2);color:var(--paper);box-shadow:inset 3px 0 var(--mint),inset 0 0 0 1px var(--line)}
:root[data-theme] #orientation-guard{background:var(--ink);color:var(--paper);font-family:var(--ui-font-family)}
:root[data-theme] .orientation-card svg{stroke:var(--mint)}
:root[data-theme] .orientation-card p,:root[data-theme] .orientation-card .orientation-live{color:var(--muted)}

:root[data-theme] .selection-options button.active{background:var(--mint);color:var(--action-ink);border-color:var(--mint)}

:root[data-theme="light"] .game-tab.has-art span{text-shadow:none}

/* Gameplay uses the same semantic surfaces as the surrounding interface. */
:root{--board-light:#d5e1da;--board-dark:#7e9b8d;--board-grid:#567165;--board-rim:#688578;--sea:#d0e1e3;--sea-dot:#729b9c;--board-hint:#274f41;--turn-glow:#24745b88}
:root{--accent-ink:#1b624b;--table-muted:#344e42}
:root[data-theme="dark"]{--board-light:#afb8b6;--board-dark:#586c7b;--board-grid:#83a393;--board-rim:#203b32;--sea:#132c32;--sea-dot:#4c827c;--board-hint:#b2decd;--turn-glow:#7ddbc088;--accent-ink:var(--mint);--table-muted:#c4d5cd}
:root[data-theme] :is(.dice-table,.card-game-status){background:var(--panel2);border-color:var(--line);color:var(--paper)}
:root[data-theme] :is(.dice-player-chip,.opponent-cup,.current-bid,.turn-total,.pig-scores>div,.dice-reveal,.showdown-hand,.dice-showdown .showdown-hand,.dice-face-choice){background:var(--panel);border-color:var(--line);color:var(--paper)}
:root[data-theme] .dice-player-chip.mine{background:var(--panel2)}
:root[data-theme] :is(.dice-player-chip i,.dice-player-chip b,.dice-quantity-stepper button){background:var(--panel2);color:var(--mint)}
:root[data-theme] :is(.dice-quantity-stepper strong,.current-bid strong,.dice-reveal>strong,.pig-outcome strong,.card-game-status strong){color:var(--paper)}
:root[data-theme] :is(.dice-help,.own-hand>span,.dice-bid-controls span,.dice-bid-controls label>small,.dice-player-chip small,.dice-reveal>p,.card-game-status span,.pig-outcome span){color:var(--muted)}
:root[data-theme] :is(.dice-face-choice.active,.dice-zhai-button.active){background:var(--panel2);border-color:var(--gold);color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
:root[data-theme] .pig-outcome{background:var(--panel);border-color:var(--mint)}
:root[data-theme] .pig-outcome.bust{background:var(--panel);border-color:var(--coral)}
:root[data-theme] .pig-outcome.bust strong{color:var(--coral)}
:root[data-theme] .pig-die.empty{color:var(--muted)}
:root[data-theme] :is(.opponent-cup b,.turn-total strong){background:var(--mint);color:var(--action-ink)}
:root[data-theme] :is(.dice-player-chip.active,.pig-scores>div.active){border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
:root[data-theme] :is(.player-time,.credit-place){background:var(--panel2);color:var(--gold)}
:root[data-theme] :is(.credit-combo,.credit-settlement li .credit-combo,.solo-record-badge,.solo-record-badge>span[aria-hidden]){color:var(--gold)}
:root[data-theme] .solo-record-badge{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 10%,var(--panel))}
:root[data-theme] .solo-record-chase rect{stroke:var(--gold)}
:root[data-theme] .credit-settlement li.negative b{color:var(--coral)}
:root[data-theme] .live-credit-delta{color:var(--gold);text-shadow:0 1px 1px var(--panel),0 0 3px var(--panel)}
:root[data-theme] .game-guide-group-credits summary{border-color:var(--gold)}
:root[data-theme] :is(.mahjong-action-callout,.landlord-role-callout){color:var(--gold);background:var(--panel2);border-color:var(--gold)}
:root[data-theme] :is(.mahjong-shown-section>small,.landlord-no-play,.landlord-passed,.landlord-play-label,.landlord-bottom>span){color:var(--muted)}
:root[data-theme] :is(.three-card-dealer,.solitaire-table){background:var(--table);color:var(--table-ink);border-color:var(--line)}
:root[data-theme] .casino-actions .primary{color:var(--action-ink);background:var(--mint)}
:root[data-theme] .casino-actions .primary .credit-amount{color:inherit}
:root[data-theme] :is(.go-board,.reversi-board){--paper-green:var(--table);--paper-green-light:color-mix(in srgb,var(--table) 85%,white);--paper-green-dark:var(--table);--paper-line:var(--board-grid);border-color:var(--board-rim);box-shadow:var(--shadow)}
:root[data-theme] .sea,:root[data-theme] .sea .cell,:root[data-theme] .sea .cell.sunk{background:var(--sea);border-color:var(--board-rim)}
:root[data-theme] .sea .cell:after{background:var(--sea-dot)}
:root[data-theme] .sea.enemy .cell:hover{background:var(--panel2)}
:root[data-theme] .sea .cell.miss:before{border-color:var(--board-grid)}
:root[data-theme] :is(.checkerboard,.chess-board){border-color:var(--board-rim)}
:root[data-theme] :is(.checkerboard .cell,.chess-cell){background-color:var(--board-light)}
:root[data-theme] :is(.checkerboard .cell.dark,.chess-cell.dark){background-color:var(--board-dark)}
:root[data-theme="light"] :is(.checkerboard .cell small,.chess-cell small,.checkerboard .cell.dark small,.chess-cell.dark small){color:var(--table-ink);text-shadow:none}
:root[data-theme] :is(.checkerboard .cell.legal:after,.chess-cell.legal:after){background:var(--board-hint)}
/* Chinese Checkers is a field of individual recessed slots, not a square board. */
:root[data-theme] .cc-board{background:transparent;border:0;box-shadow:none;overflow:visible}
:root[data-theme] .cc-hole{background:var(--panel2)!important;box-shadow:inset 0 2px 4px color-mix(in srgb,var(--paper) 35%,transparent),0 1px 0 var(--panel);border:1px solid var(--board-rim)}
:root[data-theme] .cc-hole.legal{background:var(--mint)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--mint) 45%,transparent)}
:root[data-theme] .cc-hole.selected{outline:3px solid var(--gold);outline-offset:2px}
:root[data-theme] :is(.turn-badge.live,.battle-turn.active){animation:themeTurnBreath 2s ease-in-out infinite}
:root[data-theme] .turn-badge.live.timer-warning{animation:themeTurnWarning 1s ease-in-out infinite}
:root[data-theme] .board-card.active-turn{border-color:var(--mint);box-shadow:0 0 0 2px color-mix(in srgb,var(--mint) 35%,transparent)}
:root[data-theme] :is(.board-card,.board-title,.board-foot){background:var(--panel2);border-color:var(--line);color:var(--paper)}
:root[data-theme] .round-pill{color:var(--muted)}
:root[data-theme] .turn-badge.live{background:var(--mint);color:var(--action-ink)}
:root[data-theme] .turn-badge.live.timer-warning{background:var(--coral)}
:root[data-theme] #app[data-game-kind="battleship"] .scorebar .score{background:var(--mint);color:var(--action-ink);border-color:var(--action-edge)}
/* Score counters use a clean circular rim, without a shaded lower crescent. */
:root[data-theme] #app .scorebar .score{display:inline-grid;place-items:center;min-width:30px;width:30px;height:30px;padding:0;border:3px solid;border-radius:50%;line-height:1;box-shadow:none;text-shadow:none}
:root[data-theme] #app .scorebar .score:not(.score-piece){background:var(--mint);color:var(--action-ink);border-color:var(--action-edge)}
@media(max-width:850px){:root[data-theme] #app .scorebar .score{min-width:27px;width:27px;height:27px}}
@media(max-width:430px){:root[data-theme] #app .scorebar .score{min-width:25px;width:25px;height:25px;border-width:2px}}
:root[data-theme] :is(.dice-player-chip i,.dice-player-chip b,.dice-round){color:var(--accent-ink)}
:root[data-theme] .mahjong-seat-detail{color:var(--muted)}
:root[data-theme] :is(.casino-heading>span,.casino-heading>small,.holdem-wait,.casino-flow li){color:var(--table-muted)}
:root[data-theme] .casino-flow :is(.done,.current),:root[data-theme] .casino-flow.holdem-progress :is(.done,.current) span{color:var(--accent-ink)}
:root[data-theme] .casino-flow li:not(.done):not(.current) span{color:var(--table-muted)}
:root[data-theme] .holdem-raise-control>span{color:var(--muted)}
:root[data-theme] .casino-seat .player-name-text{color:var(--paper)}
:root[data-theme] .casino-seat .live-credit-total{color:var(--gold)}
:root[data-theme] .three-card-dealer{background:var(--panel)}
:root[data-theme] :is(.invite-banner,.room-invitation-panel){background:var(--panel);border-color:var(--mint);color:var(--paper);box-shadow:0 0 0 4px color-mix(in srgb,var(--mint) 12%,transparent)}
:root[data-theme] :is(.invite-banner span,.invitation-player,.ai-rating-note strong){color:var(--accent-ink)}
:root[data-theme] .history-totals b{color:var(--accent-ink)}
:root[data-theme] .history-tabs button.active{color:var(--accent-ink)}
:root[data-theme] .profile-tabs button.active{color:var(--accent-ink)}
:root[data-theme] #app :is(.casino-heading>span,.casino-heading>small,.holdem-wait){color:var(--table-muted)}
:root[data-theme] #app .casino-flow :is(.done,.current) span{color:var(--table-muted)}
:root[data-theme] #app :is(.mahjong-seat-detail,.landlord-no-play,.landlord-passed,.go-count){color:var(--muted)}
:root[data-theme="light"] #app :is(.checkerboard .cell small,.chess-cell small,.checkerboard .cell.dark small,.chess-cell.dark small){color:#183227;text-shadow:none}
:root[data-theme="dark"] #app :is(.checkerboard .cell small,.chess-cell small){color:#263949;text-shadow:none}
:root[data-theme="dark"] #app :is(.checkerboard .cell.dark small,.chess-cell.dark small){color:#f3f6f3;text-shadow:none}
:root[data-theme] #app .mahjong-seat-detail{color:var(--muted)!important}
:root[data-theme] #app .join-code-card{background:var(--panel2);border-color:var(--line)}
:root[data-theme] #app .join-code-card span{color:var(--muted)}
:root[data-theme] #app .join-code-card strong{color:var(--accent-ink)}
:root[data-theme] #app :is(.waiting-room-settings h3,.waiting-room-settings dd){color:var(--paper)}
:root[data-theme] #app :is(.match-state,.credit-settlement li.positive b){color:var(--accent-ink)}
:root[data-theme] #app .final-score b{background:var(--mint);color:var(--action-ink)}
@keyframes themeTurnBreath{0%,100%{border-color:transparent;box-shadow:0 0 0 0 transparent}50%{border-color:var(--action-ink);box-shadow:0 0 0 3px var(--mint),0 0 14px 4px var(--turn-glow)}}
@keyframes themeTurnWarning{0%,100%{border-color:transparent;box-shadow:0 0 0 0 transparent}50%{border-color:var(--action-ink);box-shadow:0 0 0 3px var(--coral),0 0 14px 4px color-mix(in srgb,var(--coral) 60%,transparent)}}

/* Empty positions sit close to the Light table tone; card artwork is unchanged. */
:root[data-theme="light"] #app :is(.holdem-board-empty,.casino-card-placeholder,.solitaire-pile,.solitaire-empty){background:#bfd3c7;border:1px dashed #718e7e;box-shadow:inset 0 1px 3px #68857822,0 2px 0 #8ba797;color:#426653}
:root[data-theme="light"] #app :is(.holdem-board-empty,.casino-card-placeholder){color:transparent}
:root[data-theme="light"] #app .solitaire-pile>.solitaire-foundation-mark{color:#426653}

/* Keep the close control and list tabs reachable with a full friends list. */
:root[data-theme] #app .friends-panel{display:flex;flex-direction:column;min-height:0;max-height:calc(var(--history-viewport-height,100dvh) - 10px);overflow:hidden}
:root[data-theme] #app .friends-panel>:is(.social-heading,.friends-tabs){flex-shrink:0}
:root[data-theme] #app .friends-list{min-height:0;overflow:auto;overscroll-behavior:contain}
@media(max-width:460px){
 :root[data-theme] #app .game-skill{grid-template-columns:minmax(0,1fr);row-gap:2px}
 :root[data-theme] #app .game-skill>strong{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
}

/* Mobile reading rows: identity first, value/actions second. */
:root[data-theme] #app .leaderboard-row{align-items:center;border-bottom:1px solid var(--line)}
:root[data-theme] #app .leaderboard-place{padding-top:1px}
:root[data-theme] #app .leaderboard-row-content{display:flex;align-items:baseline;flex-wrap:nowrap;gap:8px}
:root[data-theme] #app .leaderboard-identity{width:auto;flex:1;gap:5px;overflow:hidden}
:root[data-theme] #app .leaderboard-player-name{flex:0 1 auto;min-width:0}
:root[data-theme] #app .leaderboard-level{flex-shrink:0;font:inherit}
:root[data-theme] #app .leaderboard-result-line{flex:0 0 auto}
:root[data-theme] #app .leaderboard-result-line>strong{text-align:right;white-space:nowrap}
:root[data-theme] #app .history-totals{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
:root[data-theme] #app .history-totals>div{padding:9px 5px;min-height:64px}
:root[data-theme] #app .history-totals :is(b,span){white-space:normal;line-height:1.25;overflow-wrap:anywhere}
:root[data-theme] #app :is(.history-changes,.game-skill) .credit-dollar{width:1em;height:1em;max-width:none;max-height:none;vertical-align:-.12em}
:root[data-theme] #app .history-changes small{font-size:16px;line-height:1.25}
:root[data-theme] #app .history-changes .credit-amount{font-size:inherit}
:root[data-theme] #app .game-mastery>i>b{background:hsl(var(--game-accent-hue) 48% 40%)}
:root[data-theme="dark"] #app .game-mastery>i>b{background:hsl(var(--game-accent-hue) 60% 68%)}
:root[data-theme="dark"] #app .game-progress-name>strong{color:hsl(var(--game-accent-hue) 60% 75%)}
:root[data-theme] #app .host-users-dialog{overflow:hidden}
:root[data-theme] #app .host-users-panel{min-height:0;height:calc(var(--history-viewport-height,100dvh) - 12px);max-height:calc(var(--history-viewport-height,100dvh) - 12px);overflow:hidden}
:root[data-theme] #app .host-user-list li{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"identity identity" "last actions";gap:8px}
:root[data-theme] #app .host-user-copy{grid-area:identity}
:root[data-theme] #app .host-user-last{grid-area:last;white-space:normal;overflow-wrap:anywhere}
:root[data-theme] #app .host-user-actions{grid-area:actions;align-items:center;justify-self:end}

:root[data-theme] #app .friends-list>li{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"identity identity" "status actions";align-items:center;gap:7px 10px}
:root[data-theme] #app .friend-identity{grid-area:identity;width:100%;align-items:flex-start;flex-basis:auto}
:root[data-theme] #app .friend-row-status{grid-area:status;color:var(--muted);font-size:16px}
:root[data-theme] #app .friends-list>li>div{grid-area:actions;justify-self:end;margin:0}
:root[data-theme] #app .friends-list>li>div>button{font-size:16px;line-height:20px;min-height:32px;padding:4px 10px;margin:0}
:root[data-theme] #app :is(.friend-name,.host-user-name strong,.leaderboard-identity>.leaderboard-player-name,.game-progress-name>strong,.history-name-row h2,.player-name-text,.scorebar .name-text){white-space:nowrap;overflow-wrap:normal;text-overflow:ellipsis;overflow:hidden;min-width:0;max-width:100%}
:root[data-theme] #app :is(.host-user-name,.leaderboard-identity){align-items:baseline}
:root[data-theme] #app .host-user-name>strong{flex:1}
:root[data-theme] #app .leaderboard-slide .leaderboard-player-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root[data-theme] #app .solo-saved-game{display:grid;gap:9px;margin:18px 0}
:root[data-theme] #app .solo-saved-game :is(h3,p,button){margin:0}
:root[data-theme] #app .gift-settings label>span{font-size:14px;line-height:1.3;white-space:nowrap}

/* Feedback uses semantic theme colors, including overlays outside #app. */
:root[data-theme] :is(.error,.host-key-input.invalid::placeholder,.host-setting-feedback.error,.history-delete){color:var(--coral)}
:root[data-theme] .error{background:var(--panel2)}
:root[data-theme] :is(.host-key-input.checking::placeholder,.host-runtime-status.error){color:var(--gold)}
:root[data-theme] .summary-number.summary-loss{color:var(--coral);background:color-mix(in srgb,var(--coral) 12%,var(--panel2))}
:root[data-theme] .room-capacity-note{color:var(--mint)!important}
:root[data-theme] .credit-assistance-toast{background:color-mix(in srgb,var(--gold) 12%,var(--panel));color:var(--paper);border-color:var(--gold);box-shadow:0 12px 32px #00000033}
:root[data-theme] .credit-assistance-toast :is(strong,span,p){font-size:16px;line-height:1.35}
:root[data-theme] .credit-assistance-toast>span{color:var(--gold)}
:root[data-theme] .credit-assistance-toast p{color:var(--muted)}
:root[data-theme] .credit-assistance-toast svg{stroke:var(--paper)}

:root[data-theme] .host-key-input.checking{border-color:var(--gold);background:var(--panel2)}
:root[data-theme] .host-key-input.invalid{border-color:var(--coral);background:var(--panel2)}

:root[data-theme] .host-key-input.checking:placeholder-shown{border-color:var(--gold)}
:root[data-theme] .host-key-input.invalid:placeholder-shown{border-color:var(--coral)}


/* Completed casino stages remain connected in both themes. */
:root[data-theme] .casino-flow .done:not(:last-child)::after{background:var(--gold)}

/* Pinball's table and title bar are one fixed dark surface. */
:root[data-theme] #app[data-view="arcade"] .top{background:#171e1c;border-color:#34463e;color:#eaf1eb;backdrop-filter:none}
:root[data-theme] #app[data-view="arcade"] .top .header-icon-btn{background:#25322d;border-color:#4c6256;color:#eaf1eb}
:root[data-theme] #app[data-view="arcade"] .top .header-icon-btn:hover{background:#34463e}

/* Light profile tabs need a distinct selected surface, matching Dark's hierarchy. */
:root[data-theme="light"] .profile-tabs{background:var(--panel2)}
:root[data-theme="light"] .profile-tabs button.active{background:var(--panel);color:var(--accent-ink);box-shadow:inset 0 -2px var(--mint),0 1px 3px #243b341a}
/* Guide tables retain visible row boundaries on the light reading surface. */
:root[data-theme="light"] .game-guide-table-wrap{--guide-rule:color-mix(in srgb,var(--line) 60%,var(--paper));background:var(--panel);border-color:var(--guide-rule)}
:root[data-theme="light"] .game-guide-table-wrap table{color:var(--paper)}
:root[data-theme="light"] .game-guide-table-wrap :is(th,td){border-color:var(--guide-rule)}
:root[data-theme="light"] .game-guide-table-wrap th{background:var(--panel2);color:var(--accent-ink)}
@media(max-width:600px){
 :root[data-theme="light"] .game-guide-table-wrap{background:transparent}
 :root[data-theme="light"] .game-guide-table-wrap tr{background:var(--panel);border-color:var(--guide-rule)}
 :root[data-theme="light"] .game-guide-table-wrap td::before{color:var(--accent-ink)}
}
/* Share only the rounded shape; tuned sizes, padding and alignment stay local. */
:root[data-theme] #app .panel .dialog-icon-control{border-radius:9px!important}
/* Keep Players' guide beside Close without changing either control's size. */
:root[data-theme] #app .panel .social-heading{grid-template-columns:76px minmax(0,1fr) 34px 34px;gap:8px}
:root[data-theme] #app .panel .social-heading>h2{grid-column:2;grid-row:1}
:root[data-theme] #app .panel .social-heading>.players-guide-button{grid-column:3;justify-self:end}
:root[data-theme] #app .panel .social-heading>.social-close{grid-column:4;grid-row:1}
/* Light uses the same level interpolation, with its existing contrast remap. */
:root[data-theme="light"] .header-icon-btn.header-account.account-level{color:var(--level-color);border-color:var(--level-border);background:linear-gradient(145deg,var(--level-surface),var(--panel))}
:root[data-theme="light"] .header-icon-btn.header-account.account-level:hover{background:linear-gradient(145deg,var(--level-hover),var(--panel2))}
/* Waiting-room reading sizes are independent of dense in-game tables. */
:root[data-theme] .waiting-room-panel .room-join-box>label{font-size:16px}
:root[data-theme] .waiting-room-panel .waiting-room-roster .player-name-with-flag{font-size:16px}
:root[data-theme] .waiting-room-panel .waiting-room-roster small b{font-size:14px;padding:2px 4px}
:root[data-theme] .waiting-room-panel .waiting-room-roster i{font-size:12px}
:root[data-theme] .waiting-room-panel .waiting-room-count span{font-size:16px}
:root[data-theme] .waiting-room-settings-fold{border:1px solid var(--line);border-radius:13px;background:var(--panel2);padding:12px;margin:14px 0;text-align:left}
:root[data-theme] .waiting-room-settings-fold>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px;font-weight:800;color:var(--paper);cursor:pointer;list-style:none}
:root[data-theme] .waiting-room-settings-fold>summary::-webkit-details-marker{display:none}
:root[data-theme] .waiting-room-settings-fold>summary svg{width:18px;height:18px;transition:transform .15s}
:root[data-theme] .waiting-room-settings-fold[open]>summary svg{transform:rotate(180deg)}
:root[data-theme] .waiting-room-settings-fold .waiting-room-settings{border:0;padding:0;margin:12px 0 0;background:transparent}
:root[data-theme] .waiting-room-settings-fold dt{font-size:14px;text-transform:none;line-height:1.35}
:root[data-theme] .waiting-room-settings-fold dd{font-size:16px;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
/* Room paths have equal hierarchy; the entry hint is ordinary reading text. */
:root[data-theme] #app .waiting-room-panel :is(.room-join-box>label,.join-code-card>span){text-align:left;font-size:16px;font-weight:800;color:var(--paper);text-transform:none;letter-spacing:normal;line-height:1.4}
:root[data-theme] .room-join-box .input{font-family:var(--ui-font-family);font-size:16px;font-weight:600;letter-spacing:normal;font-variant-numeric:tabular-nums}
:root[data-theme] .room-join-box .input::placeholder{font:inherit;letter-spacing:normal}
/* Text shares its baseline; small pictograms sit in the name's line box. */
:root[data-theme] .waiting-room-roster li{align-items:center}
:root[data-theme] .waiting-room-roster .player-name-with-flag{align-items:baseline;line-height:1.25}
:root[data-theme] .waiting-room-roster .player-name-with-flag>:is(.country-flag,.premium-crown){align-self:baseline}
:root[data-theme] .waiting-room-roster small b{line-height:1.25;min-height:0;padding-block:0}
:root[data-theme] #app .panel .text-close-icon{display:grid;place-items:center}
:root[data-theme] #app .panel .text-close-icon svg{display:block;vertical-align:0}

:root[data-theme] #app .waiting-room-panel .join-code-card{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px}
:root[data-theme] #app .waiting-room-panel .join-code-card>span{display:block;margin:0;flex:0 0 auto;white-space:nowrap}
:root[data-theme] .join-code-value{display:contents}
:root[data-theme] .join-code-value strong{flex:0 0 auto}
:root[data-theme] .waiting-room-roster :is(i,.match-state,.room-kick){align-self:center}


:root[data-theme] #app .waiting-room-panel .join-code-card>span{grid-column:1;grid-row:1;justify-self:start}
:root[data-theme] #app .waiting-room-panel .join-code-value strong{grid-column:2;grid-row:1;justify-self:center}
:root[data-theme] #app .waiting-room-panel .join-code-value button{grid-column:3;grid-row:1;justify-self:end}
/* Cropped vector viewBoxes supply the real aspect ratio, with no empty footer. */
:root[data-theme] #app img.country-flag{height:.75em!important;aspect-ratio:auto;transform:none!important}
:root[data-theme] #app .premium-crown{height:auto;aspect-ratio:20/19;transform:none}
/* Waiting-room actions share one footprint regardless of their labels. */
:root[data-theme] #app .waiting-room-panel :is(.room-join-box button,[data-copy-room-code]){width:72px;min-width:72px;height:46px;min-height:46px;padding:0;display:grid;place-items:center;font-size:16px;line-height:1.25}
/* Painted badges match the name's cap height, rather than its full line box. */
:root[data-theme] #app :is(.player-name-with-flag,.leaderboard-identity,.leaderboard-slide>span,.friend-identity,.unfriend-player){align-items:baseline}
:root[data-theme] #app :is(.country-flag,.premium-crown){height:.75em!important;width:auto!important;min-width:0!important;flex:0 0 auto!important;align-self:baseline;vertical-align:baseline;transform:none!important}
:root[data-theme] #app .waiting-room-roster li:not(.waiting-room-invite-seat){padding:10px 12px;min-height:44px;background:var(--panel2);align-items:center}
:root[data-theme] #app .waiting-room-roster small b{font-size:16px;line-height:1.25;padding:0;background:none}
:root[data-theme] #app .waiting-room-roster :is(i,.match-state,.room-kick){align-self:center}
/* Help-page close controls follow the small guide title's actual line height. */
:root[data-theme] #app .panel .guide-close-sized{width:var(--guide-close-size)!important;min-width:var(--guide-close-size)!important;max-width:var(--guide-close-size)!important;height:var(--guide-close-size)!important;min-height:var(--guide-close-size)!important;margin-top:var(--guide-close-offset)!important;padding:0!important;display:grid;place-items:center;align-self:start;line-height:1}
:root[data-theme] #app .panel .guide-close-sized svg{width:60%!important;height:60%!important;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.house-promo-panel h2>span,.house-ad h2>span{display:block;white-space:nowrap}
:root[data-theme] #app .waiting-room-roster li:not(.waiting-room-invite-seat){grid-template-columns:minmax(0,max-content) auto auto minmax(0,1fr) auto;grid-template-areas:"name level rating . state"}
:root[data-theme] #app .waiting-room-roster li.has-kick{grid-template-columns:minmax(0,max-content) auto auto minmax(0,1fr) auto 20px;grid-template-areas:"name level rating . state kick"}
:root[data-theme] #app .waiting-room-panel .room-join-box{display:grid;grid-template-columns:minmax(0,1fr) 98px minmax(0,1fr);align-items:center;gap:14px;padding:11px}
:root[data-theme] #app .waiting-room-panel .room-join-box>label{margin:0;text-align:left;font-size:16px;font-weight:800;line-height:1.25}
:root[data-theme] #app .waiting-room-panel .room-join-box>button{justify-self:end}
:root[data-theme] #app .waiting-room-panel .room-code-input{position:relative;display:block;width:98px;height:46px;grid-column:2;min-width:0}
:root[data-theme] #app .room-code-input .input{position:absolute;inset:0;width:100%;height:100%;min-height:0;padding:0;color:transparent;caret-color:transparent;background:var(--panel2);text-align:center}
:root[data-theme] #app .room-code-digits{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:4px;pointer-events:none;font-size:28px;font-weight:800;color:var(--mint2);line-height:1}
:root[data-theme] #app .room-code-digits>span{width:24px;text-align:center}

/* Privileged result review uses existing panels, buttons and viewport limits. */
#app .leaderboard-review-open{justify-self:start;font-size:inherit;padding:.2em .65em}
#app .leaderboard-review-player{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#app .leaderboard-review-list{list-style:none;padding:0;margin:0;display:grid;gap:12px}
#app .leaderboard-review-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px;background:var(--panel2);border-radius:12px}
#app .leaderboard-review-list p,#app .leaderboard-review-confirm p{margin:.4em 0;overflow-wrap:anywhere}
#app .leaderboard-review-confirm{overflow:auto;min-height:0}

#app .leaderboard-result-line{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
#app .leaderboard-result-line>strong{margin-left:auto;min-width:0}

/* The admin-only fourth tab uses two balanced rows on mobile. */
#app .admin-leaderboard-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
#app .admin-leaderboard-tabs>button{width:100%;min-width:0}

/* State cues remain distinct from shared surface colors. */
:root[data-theme="dark"]{--cover:#26384c}
:root[data-theme] .account-switch.single{grid-template-columns:minmax(0,1fr)}
:root[data-theme] #app .host-user-list li{background:var(--panel2);border:1px solid var(--line)}
:root[data-theme] #app :is(.seg button.active,.profile-tabs button.active,.history-tabs button.active,.history-filters button.active){background:var(--mint);color:var(--action-ink);box-shadow:inset 0 -3px var(--action-edge)}
:root[data-theme] #app .host-power-btn.host-primary{color:var(--host-primary-fg);border-color:var(--host-primary-border);background:var(--host-primary-surface)}
:root[data-theme] #app .host-power-btn.host-idle{color:var(--host-idle-fg);border-color:var(--host-idle-border);background:var(--host-idle-surface)}
:root[data-theme] #app .host-power-btn.host-offline{color:var(--header-control-fg);border-color:var(--line);background:var(--panel)}
:root[data-theme] .toast{border:1px solid color-mix(in srgb,var(--toast-ink) 35%,var(--toast-bg));box-shadow:0 8px 24px #0005}
:root[data-theme] #app :is(.friends-list>li,.premium-products article,.more-app-categories article,.history-list>li){background:var(--panel2);border:1px solid var(--line)}

/* Distinct balance surface, stable small host timestamps, and role colours. */
:root[data-theme="dark"] #app .credit-reward-entry{background:var(--panel2);border:1px solid var(--line)}
#app .host-settings-times :is(dt,dd,time){font-size:12px;line-height:1.4}
:root[data-theme] #app .host-power-btn.host-idle:hover{background:var(--host-idle-surface)}
:root[data-theme] #app .host-power-btn.host-primary:hover{background:var(--host-primary-surface)}
#app .host-settings-times{font-family:var(--ui-font-family)}

#app .host-settings-section .host-field-label{font-family:var(--ui-font-family);font-size:16px;font-weight:400;line-height:1.4;color:var(--paper)}

:root[data-theme] #app .host-user-last.online{color:light-dark(#1c654c,var(--mint))}
:root[data-theme="light"]{--mint2:#1c654c;--metric-rating:#1c654c}

/* Shared profile surfaces and progress tracks in both appearances. */
:root[data-theme] #app :is(.profile-tabs,.history-filters){background:var(--panel2);border:1px solid var(--line)}
:root[data-theme] #app :is(.seg button,.profile-tabs button,.history-filters button){border:0}
:root[data-theme] #app .seg{border:1px solid var(--line)}
:root[data-theme] #app .history-totals>div{background:var(--panel2);border:1px solid var(--line)}
:root[data-theme] #app .game-mastery{padding-left:12px;border-left-color:var(--line)}
:root[data-theme] #app :is(.game-mastery>i,.xp-result-track){box-sizing:border-box;height:8px;background:var(--ink);border:1px solid var(--line);overflow:hidden}
:root[data-theme="light"] #app :is(.game-mastery>i,.xp-result-track){background:color-mix(in srgb,var(--line) 45%,var(--panel))}
/* Text on ordinary controls has no artificial shadow. Progress fills are retained. */
:root[data-theme] #app :is(.primary,.secondary,.danger,.seg button,.profile-tabs button,.history-filters button,.room-progress-control)>span,
:root[data-theme] #app :is(.primary,.secondary,.danger,.seg button,.profile-tabs button,.history-filters button){text-shadow:none!important}
/* Battleship chrome follows the board appearance, independently of weapon artwork. */
:root[data-theme] #app :is(.board-card,.board-title,.fleet,.weapons){background:var(--panel2);color:var(--paper);border-color:var(--line)}
:root[data-theme] #app .weapon b{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 4px;line-height:1;background:var(--mint);color:var(--action-ink)}
:root[data-theme] #app .battle-reveal-banner{background:var(--panel2);color:var(--gold);border-color:var(--gold)}
:root[data-theme="light"] #app .sea{border-color:color-mix(in srgb,var(--sea) 65%,var(--sea-dot))}
:root[data-theme="light"] #app .water-burst{border-color:#247487;box-shadow:0 0 0 1px #f4faf9}
:root[data-theme="light"] #app .water-burst:before,:root[data-theme="light"] #app .water-burst:after{background:#247487}

/* History uses two lines where they fit; only the detail row can expand. */
:root[data-theme] #app .history-record-main{flex-wrap:nowrap}
:root[data-theme] #app .history-list .history-record-details{display:flex!important;flex-wrap:nowrap;align-items:baseline}
:root[data-theme] #app .history-record-details .history-opponent{display:flex!important;flex-wrap:nowrap;align-items:baseline}
:root[data-theme] #app .history-opponent>.history-changes{display:flex;align-items:baseline;flex-wrap:nowrap;gap:5px}
:root[data-theme] #app .history-record-details .history-result{white-space:nowrap;align-self:baseline}
:root[data-theme] #app .history-list .history-record-details.is-expanded{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:4px 8px}
:root[data-theme] #app .history-record-details.is-expanded .history-opponent{display:contents!important}
:root[data-theme] #app .history-record-details.is-expanded .history-opponent>i{grid-column:1/-1;grid-row:1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root[data-theme] #app .history-record-details.is-expanded .history-changes{grid-column:1;grid-row:2;min-width:0}
:root[data-theme] #app .history-record-details.is-expanded .history-result{grid-column:2;grid-row:2;margin-left:0}
/* Weapon settings are ordinary entry fields, without a nested surface. */
:root[data-theme] #app .lobby-panel .gift-settings{background:transparent;padding:0;margin-top:0;border:0;border-radius:0;grid-template-columns:repeat(3,minmax(0,1fr))}
:root[data-theme] #app .gift-settings .game-select-trigger{min-height:48px;padding:12px 14px}
@media(max-width:430px){:root[data-theme] #app .gift-settings .game-select-trigger{min-height:38px;padding:8px 10px}}

/* Profile geometry is shared in both themes, including the canonical XP track. */
:root[data-theme] #app .game-progress-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"mastery details";align-items:center;gap:12px}
:root[data-theme] #app .game-mastery{grid-area:mastery;grid-row:auto;padding:0;border:0;gap:7px}
:root[data-theme] #app .game-mastery>span{display:grid;gap:2px}
:root[data-theme] #app .game-mastery>span small{text-align:left}
:root[data-theme] #app .game-progress-details{grid-area:details;min-width:0;display:grid;gap:5px;padding:0;border:0}
:root[data-theme] #app .game-progress-details.has-metric{padding-left:12px;border-left:1px solid var(--line)}
:root[data-theme] #app .game-progress-name{grid-area:auto;grid-column:auto;padding:0}
:root[data-theme] #app .game-skill{grid-area:auto;display:grid;grid-template-columns:1fr;gap:2px}
:root[data-theme] #app :is(.profile-level,.game-mastery) .profile-xp-track{display:block;box-sizing:border-box;height:8px;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:color-mix(in srgb,var(--muted) 30%,var(--panel))}
:root[data-theme] #app :is(.profile-level,.game-mastery) .profile-xp-track>b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--mint),var(--gold))}
:root[data-theme] #app .game-mastery .profile-xp-track>b{background:linear-gradient(90deg,hsl(var(--game-accent-hue) 48% 40%),hsl(calc(var(--game-accent-hue) + 22) 48% 47%))}
:root[data-theme="dark"] #app .game-mastery .profile-xp-track>b{background:linear-gradient(90deg,hsl(var(--game-accent-hue) 60% 68%),hsl(calc(var(--game-accent-hue) + 22) 60% 74%))}
:root[data-theme] #app .friends-panel .history-empty{background:transparent;border:0;padding:16px 0;color:var(--muted)}
:root[data-theme] #app .credit-reward-action{justify-content:center;padding-inline:12px}
:root[data-theme] #app .credit-reward-action>svg{flex:0 0 22px;display:block}
:root[data-theme] #app .credit-reward-action>span{text-align:center}
:root[data-theme] #app .credit-reward-action .credit-plus-icon path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

:root[data-theme] #app .credit-reward-entry{background:var(--panel2);border:1px solid var(--line)}
:root[data-theme] #app .game-guide-table-wrap{background:var(--panel2);border:1px solid var(--line)}
:root[data-theme] #app :is(.friend-request-panel,.room-invitation-panel) .social-heading{display:flex;justify-content:center;gap:0}
:root[data-theme] #app :is(.friend-request-panel,.room-invitation-panel) .social-heading h2{width:100%;margin:0;text-align:center;white-space:nowrap;font-size:clamp(20px,5.5vw,24px)}

/* Keep the game title above its progress and optional metric. */
:root[data-theme] #app .game-progress-row{grid-template-areas:"title title" "mastery details";row-gap:8px}
:root[data-theme] #app .game-progress-row>.game-progress-name{grid-area:title;min-width:0;text-align:left}

/* Premium benefits belong directly under the heading, without a nested card. */
:root[data-theme] #app .premium-products article{border:0;background:none;padding:0;box-shadow:none}
/* AI difficulty and its rating share a single surface. */
:root[data-theme] #app .ai-strength-panel{border:1px solid var(--line);border-radius:13px;background:var(--panel2);overflow:hidden}
:root[data-theme="dark"] #app .ai-strength-panel{background:var(--panel)}
:root[data-theme] #app .ai-strength-panel>.seg{border:0;border-radius:0;background:transparent}
:root[data-theme] #app .ai-strength-panel>.ai-rating-note{margin:0;padding:8px 10px;border:0;border-radius:0;background:transparent}

/* Countdown labels share the same rendering inside and outside game pages. */
:root[data-theme] .room-progress-control>span{text-shadow:none!important}

/* One opaque base/fill/text pairing per animation role, in each theme. */
:root{
 --progress-action-base:#24745b;--progress-action-fill:#164536;--progress-action-ink:#ffffff;
 --progress-status-base:#d7e3dd;--progress-status-fill:#9cb5a9;--progress-status-ink:#243b34;
}
:root[data-theme="dark"]{
 --progress-action-base:#7ddbc0;--progress-action-fill:#47ae93;--progress-action-ink:#17251e;
 --progress-status-base:#34463d;--progress-status-fill:#52695d;--progress-status-ink:#e7eeeb;
}
:root[data-theme] .room-progress-control{--progress-base:var(--progress-status-base);--progress-fill:var(--progress-status-fill);--progress-ink:var(--progress-status-ink);background:var(--progress-base);color:var(--progress-ink)}
:root[data-theme] .room-progress-control.primary{--progress-base:var(--progress-action-base);--progress-fill:var(--progress-action-fill);--progress-ink:var(--progress-action-ink);background:var(--progress-base)}
:root[data-theme] .room-progress-control::before{background:var(--progress-fill);box-shadow:none}
:root[data-theme] .room-progress-control>span{color:var(--progress-ink)!important}
:root[data-theme] .room-progress-control.matchmaking-progress.matching::before{background:linear-gradient(90deg,transparent,var(--progress-fill) 22% 78%,transparent)}
:root[data-theme] .room-progress-control.matchmaking-progress>span{color:var(--progress-ink)!important}
:root[data-theme] .room-progress-control[data-ready]:disabled{opacity:1}