/* 根据用户提供的对局截图重绘：蓝色桌面、上下棋盘、2–1–2 圆盘。 */
:root{--ink-blue:#285575;--ceramic:#f4f5f2;--board-tile:clamp(23px,2.1vw,30px);--brick-gap:2px;--pool-tile:23px;--plate-size:68px;--floor-tile:22px}
.azul-art-definitions{position:absolute;overflow:hidden;pointer-events:none}
.tile{padding:0!important;border:0!important;border-radius:12%;background:none!important;position:relative;overflow:visible;box-shadow:0 1px 1px #103d4d66;isolation:isolate}
.tile:after{display:none!important}
.tile-art{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.tile.empty{opacity:1;box-shadow:none}
.tile.ghost{opacity:.75;outline:2px dashed #e8ac40;outline-offset:-1px}
.hero{background:linear-gradient(115deg,#2b5475,#417b96);border:1px solid #8bb6ca}
.hero:after{border:1px solid #d8f1eb3d;inset:10px;width:auto;height:auto;border-radius:17px}
.hero-mark{transform:rotate(-10deg);filter:drop-shadow(0 8px 5px #16374755)}
.hero-mark i{display:block;background:none!important;border:0!important;box-shadow:none!important;border-radius:0}
.hero-mark .tile{width:100%;height:100%}
.difficulty-symbol{background:none!important;border-radius:0;transform:rotate(-6deg);width:43px;height:43px}
.difficulty-symbol .tile{width:100%;height:100%}
.difficulty-card.master .difficulty-symbol{transform:rotate(7deg)}
.primary-button{background:linear-gradient(#4f92a5,#2e748d);border:1px solid #22617e;box-shadow:inset 0 1px 0 #ffffff5c,0 3px 0 #194d6970,0 5px 12px #0f344326}
.primary-button:hover:not(:disabled){background:linear-gradient(#65a3b3,#3b8197)}
.in-match{background:#3d6b8c;min-height:100svh;color:#eff7f2}
.in-match:before{display:none}
.table-brand{display:flex;align-items:center;gap:6px;color:#f6f9eb;text-shadow:0 1px 2px #214d6855}
.table-brand .rosette-art{width:24px;height:24px;flex-shrink:0}
.table-back,.table-tools button{border-color:#7297b3;background:#294c66aa;color:#edf3f2;box-shadow:inset 0 1px 0 #dcecef19}
.duel-score{background:#2d5772a6;border-color:#7b9fb55c;box-shadow:none}
.duelist-info>b{color:#eef7ed}.duelist strong{font-family:Georgia,serif;color:#fff3c6}
.duelist-info .score-pending{color:#c7ddd8}.score-pending em{color:#ffe38d}
.table-stage>.battle-board{--team:#7f96cd;background:#f4f5f4;border:3px solid var(--team);border-radius:30px 9px 7px 7px;box-shadow:0 3px 0 #254e6c55;padding:7px 7px 0;position:relative;min-height:0}
.table-stage>.my-board{--team:#fa6d70}
.battle-board:before,.board-corners{display:none}
.table-stage>.battle-board.active{box-shadow:0 0 0 2px #f8df77,0 3px 0 #254e6c55}
.battle-board-header{position:absolute;left:8px;top:8px;margin:0;width:60px;z-index:2;display:block}
.battle-board-header>div{display:flex;align-items:center;flex-direction:column;gap:3px}
.board-avatar{width:48px;height:48px;background:transparent;border:0;border-radius:50%;box-shadow:0 1px 3px #31576b40;padding:0;overflow:hidden}
.player-portrait{width:100%;height:100%;display:block}
.battle-board-header h3{font-family:inherit;font-size:10px;color:#fff;background:#3c515de0;border-radius:3px;padding:2px 5px;line-height:1.2;min-width:40px;text-align:center;margin:0;font-weight:500}
.board-round,.battle-board-legend{display:none}
.board-body,.ai-board .board-body{display:block;padding:0;margin:0}
.battle-row,.ai-board .battle-row{grid-template-columns:minmax(0,1fr) calc(5 * var(--board-tile) + 4 * var(--brick-gap));gap:12px;min-height:calc(var(--board-tile) + 2px);margin:0;align-items:center}
.battle-line,.ai-board .battle-line{min-height:calc(var(--board-tile) + 2px);height:calc(var(--board-tile) + 2px);padding:0;gap:4px;border-radius:4px;justify-content:flex-end}
.line-number,.ai-board .line-number{display:none}
.line-cells,.ai-board .line-cells{gap:var(--brick-gap)}
.battle-line .tile,.ai-board .battle-line .tile{width:var(--board-tile);height:var(--board-tile);border-radius:12%}
.row-hint,.ai-board .row-hint{width:9px;font-size:11px;flex-shrink:0;color:#52666b;font-weight:700}
.battle-line.legal{background:#d2ebd33d;border-color:#75ac9c66}
.battle-line.legal:hover{background:#c9e5ca;border-color:#78aa96}
.battle-line.planned{background:#f5d98e6e;border-color:#d0a847;box-shadow:inset 0 0 0 1px #fff3bd}
.battle-wall-row,.ai-board .battle-wall-row{grid-template-columns:repeat(5,var(--board-tile));gap:var(--brick-gap)}
.battle-wall-cell{border-radius:5px;background:#d5d7d4}
.battle-wall-cell .tile,.ai-board .battle-wall-cell .tile{width:var(--board-tile);height:var(--board-tile);opacity:.2;filter:saturate(.8);box-shadow:none}
.battle-wall-cell.filled{background:transparent}
.battle-wall-cell.filled .tile,.ai-board .battle-wall-cell.filled .tile{opacity:1;filter:none;box-shadow:0 1px 1px #31566880;transform:none}
.battle-wall-cell.pending-wall{outline:1px dashed #d6a246;outline-offset:0;background:#eee2bd}
.battle-wall-cell.pending-wall .tile{opacity:.72;filter:none}
.battle-wall-cell.target{outline:1px dashed #55a896;outline-offset:0;background:#d7e6d3}
.battle-wall-cell.planned-target{outline:2px solid #e0b655;box-shadow:0 0 5px #e6c57e66}
.battle-floor,.ai-board .battle-floor{display:grid;grid-template-columns:minmax(0,1fr) 73px;align-items:center;gap:9px;margin:4px -7px 0;padding:3px 5px 4px;border:0;background:var(--team);border-radius:0 0 3px 3px;min-height:33px}
.floor-zone{width:100%;min-width:0;border:0;background:none;padding:0;margin:0;border-radius:3px;display:block}
.floor-zone:disabled{opacity:1;cursor:default}
.floor-zone:enabled{cursor:pointer;outline:1px dashed #fff9;outline-offset:1px}
.floor-zone.planned{outline:2px solid #ffe678;outline-offset:1px;background:#fff3}
.floor-slots,.ai-board .floor-slots{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;justify-items:center;max-width:none;height:calc(var(--floor-tile) + 6px)}
.floor-slot,.ai-board .floor-slot{position:relative;gap:0;justify-content:flex-start}
.floor-slot .tile,.marker-tile,.ai-board .floor-slot .tile,.ai-board .marker-tile{width:var(--floor-tile);height:var(--floor-tile);border-radius:4px;font-size:15px}
.floor-slot small,.ai-board .floor-slot small{display:block;position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);font-size:8px;line-height:10px;color:#fff;background:var(--team);border-radius:6px;min-width:16px;text-align:center}
.marker-tile{background:linear-gradient(#f9f9f1,#c6ccce);border:1px solid #6e7d82;color:#263c46;font-family:Georgia,serif;font-weight:700;box-shadow:inset 0 1px 1px white;display:grid;place-items:center}
.board-score{display:grid;grid-template-columns:20px 1fr;grid-template-rows:21px 9px;align-items:center;text-align:center;background:#f7f8ef;border-radius:3px;min-width:0;height:30px;color:#253c48;padding:0 3px}
.board-score>span{font-size:20px;color:#f3d841;line-height:1}
.board-score strong{font-family:Georgia,serif;font-size:22px;font-weight:700;line-height:1}
.board-score small{grid-column:1/-1;font-size:8px;line-height:9px;color:#687a7a;white-space:nowrap}
.game-market{display:grid;grid-template-columns:14px minmax(0,1fr) 87px;grid-template-rows:17px minmax(0,1fr) auto;gap:5px 7px;padding:0!important;min-height:300px;color:#edf6ef}
.market-heading{grid-column:1/-1;grid-row:1;padding:0!important;font-size:11px;line-height:17px;min-width:0;gap:8px}
.market-heading>span{font-weight:600;white-space:nowrap}
.market-heading small{font-size:8px;color:#d7e4df;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.market-time-gauge{grid-column:1;grid-row:2;display:flex;flex-direction:column;align-items:center;min-height:0;gap:4px;padding:3px 0}
.market-time-track{flex:1;position:relative;width:8px;background:#d6e5df55;border-radius:6px;overflow:hidden;min-height:0}
.market-time-fill{position:absolute;bottom:0;left:0;width:100%;height:0;background:#ffe44f;border-radius:6px;transition:height .25s linear}
.market-clock{font-size:10px;font-weight:700;color:#fff;line-height:12px;font-variant-numeric:tabular-nums}
.market-time-gauge>small{display:none}
.game-market.clock-urgent .market-time-fill{background:#ff9a6a}
.game-market.clock-urgent .market-clock{color:#ffc7a1}
.game-factories{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:0;align-items:center;justify-items:center;padding:0!important;min-height:0}
.game-factory{width:var(--plate-size);height:var(--plate-size);position:relative;border:0;background:none!important;box-shadow:none!important;border-radius:50%;isolation:isolate;grid-column:auto;flex-shrink:0}
.game-factory:nth-child(1){grid-column:1/span 2;grid-row:1}
.game-factory:nth-child(2){grid-column:3/span 2;grid-row:1}
.game-factory:nth-child(3){grid-column:2/span 2;grid-row:2}
.game-factory:nth-child(4){grid-column:1/span 2;grid-row:3}
.game-factory:nth-child(5){grid-column:3/span 2;grid-row:3}
.plate-art{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);z-index:-1;pointer-events:none;filter:drop-shadow(0 3px 0 #30536f88) drop-shadow(0 3px 3px #153d5233)}
.game-factory-tiles{position:relative;z-index:1;grid-template-columns:repeat(2,23px);gap:2px}
.game-tile{width:23px;height:23px}
.game-tile .tile{width:22px;height:22px;border-radius:12%}
.game-factory.plate-selected{outline:2px solid #ffe674;outline-offset:1px;transform:none}
.game-tile.chosen .tile{outline:2px solid #fff3b0;outline-offset:0;transform:none;box-shadow:0 0 0 2px #e9bf5d}
.game-tile:not(:disabled):hover .tile{transform:translateY(-1px)}
.factory-index{font-size:6px;line-height:9px;bottom:-2px;padding:0 3px;border:1px solid #8b9fae;background:#e2e5da;color:#57748b;min-width:13px;text-align:center;box-shadow:none}
.pool-sidebar{grid-column:3;grid-row:2;min-height:0;display:flex;flex-direction:column;gap:4px}
.game-center{flex:1;min-height:0;padding:4px;border:3px solid #7c96b2;border-radius:9px;background:#cdd3cc;display:flex;flex-direction:column;box-shadow:none}
.center-heading{flex-shrink:0;justify-content:center;font-size:11px;color:#f9f9f0;line-height:15px;margin:-4px -4px 4px;background:#7c96b2;padding:2px 1px}
.center-colors{display:flex;flex-direction:column;align-items:stretch;gap:2px;min-height:0;flex:1;justify-content:flex-start}
.center-pick{display:flex;align-items:center;justify-content:flex-start;min-height:0;gap:3px;max-height:30px;padding:1px 0;border:1px solid transparent;border-radius:3px;flex:0 1 auto;color:#263b42}
.center-pick .tile{width:var(--pool-tile);height:var(--pool-tile)}
.center-pick .count-prefix{font-size:14px;color:#263b42;line-height:1}
.center-pick b{font-family:Georgia,serif;font-size:17px;color:#1e343c;font-weight:600;line-height:1}
.center-pick:disabled{opacity:1}
.center-pick.chosen{outline:1px solid #a67e35;background:#fff3c16b;box-shadow:0 0 0 1px #ffe68d}
.center-empty{font-size:9px;line-height:1.8;color:#758b8e;text-align:center;margin:auto 0}
.pool-selection{height:40px;flex-shrink:0;padding:3px;border-radius:7px;background:#81a9a2;color:#f6fbf0;text-align:center}
.pool-selection>span{display:block;font-size:9px;line-height:11px}
.pool-selection>div{height:23px;display:flex;align-items:center;justify-content:center;gap:5px}
.pool-selection .tile{width:21px;height:21px}
.pool-selection b{font-size:12px;font-weight:600}
.pool-selection small{font-size:8px;opacity:.75}
.latest-move{grid-column:1/-1;grid-row:3;font-size:9px;line-height:1.5;white-space:normal;margin:5px 0 0;color:#d3e4df}
.latest-move span{color:#fff0b3}
.action-dock{background:#edf2ec;border-color:#bbcdd0;color:#2e5b71;box-shadow:0 3px 0 #28547066,0 5px 15px #244f6b33}
.dock-copy>span{color:#758e98}.dock-symbol{color:#b99c4d}.dock-cancel{color:#68818b;background:#dce6e0}
.round-summary,.table-drawer{background:#f4f5ee;border:2px solid #8ba7b8;box-shadow:0 20px 60px #173f5866}
.round-summary h3,.drawer-heading h3{color:#2c5772}.results-scrim,.drawer-scrim{background:#254e68bc}
@media(max-width:1120px) and (min-width:761px){
  .game-market{grid-template-columns:18px minmax(0,1fr) 125px;min-height:260px}
  .game-factories{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));display:grid}
  .game-factory{width:68px;height:68px}
  .game-center{align-self:stretch}
}
@media(max-width:760px){
  .hero-mark{opacity:.8;right:-6px;grid-template-columns:repeat(3,31px);gap:5px;top:66px}
  .difficulty-symbol{width:38px;height:38px}
  .in-match .app-shell{--board-tile:clamp(22px,3.3svh,29px);--plate-size:clamp(54px,8svh,74px);--pool-tile:clamp(17px,2.8svh,24px);--floor-tile:clamp(17px,2.8svh,23px);max-width:466px;min-height:600px;height:100svh;padding:6px 9px calc(6px + env(safe-area-inset-bottom))}
  #match-content{display:flex;flex-direction:column;gap:5px;height:100%}
  .table-topbar{height:26px;min-height:26px;margin:0;flex-shrink:0}
  .table-brand{font-size:16px;gap:4px;letter-spacing:.06em}
  .table-brand .rosette-art{width:17px;height:17px}
  .duel-score{display:block;min-height:26px;height:26px;margin:0;padding:1px 3px 3px;flex-shrink:0;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible}
  .duel-score .duelist{display:none}
  .duel-round{display:flex;align-items:center;justify-content:space-between;width:100%;height:22px;gap:7px}
  .duel-round>small{font-size:9px;line-height:18px;letter-spacing:0;color:#d9e8e3}
  .duel-round>b{font-size:11px;line-height:18px;margin:0;color:#f7faea}
  .duel-round .turn-timer{font-size:17px;line-height:20px;color:#ffe991}
  .turn-progress{height:2px;background:#d9e8e026}.turn-progress i{background:#ffe34f}
  .clock-settled{font-size:9px;color:#dcebdc}
  .table-stage{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;gap:6px;justify-content:normal;align-items:stretch}
  .table-stage>.battle-board{width:100%;padding:6px 6px 0;border-radius:28px 7px 5px 5px;border-width:3px;min-height:0;grid-column:1}
  .table-stage>.ai-board{order:0;grid-row:1}
  .table-stage>.game-market{order:0;grid-row:2;grid-column:1;min-height:0;height:100%;width:100%;grid-template-columns:13px minmax(0,1fr) 83px;grid-template-rows:13px minmax(0,1fr);gap:4px 5px}
  .table-stage>.my-board{order:0;grid-row:3}
  .battle-board-header,.ai-board .battle-board-header{left:7px;top:7px;width:53px;min-height:0;margin:0}
  .battle-board-header>div{gap:2px}
  .board-avatar,.ai-board .board-avatar{width:40px;height:40px;font-size:0}
  .battle-board-header h3,.ai-board .battle-board-header h3{font-size:9px;line-height:11px;min-width:33px;padding:2px 4px}
  .battle-row,.ai-board .battle-row{gap:10px;min-height:calc(var(--board-tile) + 2px);margin:0;grid-template-columns:minmax(0,1fr) calc(5 * var(--board-tile) + 4 * var(--brick-gap))}
  .battle-line,.ai-board .battle-line{min-height:calc(var(--board-tile) + 2px);height:calc(var(--board-tile) + 2px);padding:0;gap:3px}
  .battle-line .tile,.ai-board .battle-line .tile,.battle-wall-cell .tile,.ai-board .battle-wall-cell .tile{width:var(--board-tile);height:var(--board-tile)}
  .battle-wall-row,.ai-board .battle-wall-row{grid-template-columns:repeat(5,var(--board-tile));gap:var(--brick-gap)}
  .row-hint,.ai-board .row-hint{width:8px;font-size:10px}
  .battle-floor,.ai-board .battle-floor{grid-template-columns:minmax(0,1fr) 70px;margin:3px -6px 0;padding:2px 4px 3px;gap:7px;min-height:0}
  .floor-slots,.ai-board .floor-slots{height:calc(var(--floor-tile) + 6px);max-width:none;gap:2px}
  .floor-slot .tile,.marker-tile,.ai-board .floor-slot .tile,.ai-board .marker-tile{width:var(--floor-tile);height:var(--floor-tile);border-radius:4px;font-size:13px}
  .floor-slot small,.ai-board .floor-slot small{display:block;font-size:8px;line-height:9px;min-width:15px;bottom:-1px}
  .board-score{height:28px;grid-template-columns:18px 1fr;grid-template-rows:19px 9px;padding:0 2px}
  .board-score>span{font-size:18px}.board-score strong{font-size:21px}.board-score small{font-size:8px}
  .market-heading{font-size:9px;line-height:13px;gap:8px}
  .market-heading small{font-size:7px}
  .game-factories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:0;align-items:center;justify-items:center}
  .game-factory{width:var(--plate-size);height:var(--plate-size)}
  .game-factory-tiles{grid-template-columns:repeat(2,21px);gap:1px}
  .game-tile{width:21px;height:21px}
  .game-tile .tile{width:20px;height:20px}
  .factory-index{font-size:6px;bottom:-2px;line-height:8px;padding:0 2px}
  .market-time-gauge{padding:2px 0;gap:3px}.market-time-track{width:7px}.market-clock{font-size:10px}
  .game-center{padding:4px;border-width:3px;border-radius:7px}
  .center-heading{font-size:10px;line-height:13px;margin:-4px -4px 3px;padding:1px 0}
  .center-colors{gap:2px}
  .center-pick{min-height:0;padding:0;gap:3px;border-width:0;max-height:28px}
  .center-pick .tile{width:var(--pool-tile);height:var(--pool-tile)}
  .center-pick .count-prefix{font-size:13px}.center-pick b{font-size:15px}
  .center-empty{font-size:8px;line-height:1.8}
  .pool-selection{height:clamp(32px,5svh,44px);padding:2px;border-radius:6px}
  .pool-selection>span{font-size:8px;line-height:10px}
  .pool-selection>div{height:calc(100% - 10px);gap:4px}
  .pool-selection .tile{width:clamp(15px,2.5svh,22px);height:clamp(15px,2.5svh,22px)}
  .pool-selection b{font-size:11px}.pool-selection small{font-size:7px}
  .latest-move{display:none}
  .action-dock{position:static;transform:none;left:auto;right:auto;flex-shrink:0;width:100%;max-width:none;min-height:50px;border-radius:7px;margin:0;padding:7px 9px;gap:7px}
  .dock-copy b{font-size:10px}.dock-copy>span{font-size:8px;line-height:1.4}
  .dock-picked .tile{width:24px;height:24px}
  .dock-cancel{position:static;width:23px;height:34px;flex-shrink:0}
  .confirm-move{min-height:34px;min-width:84px;padding:8px;font-size:11px;border-radius:6px}
}
@media(max-width:760px) and (max-height:660px){
  .in-match .app-shell{--board-tile:22px;--plate-size:54px;--pool-tile:17px;--floor-tile:17px}
  #match-content{gap:4px}.table-stage{gap:4px}
  .table-stage>.battle-board{padding-top:5px}
  .battle-floor,.ai-board .battle-floor{padding-top:1px;padding-bottom:2px;margin-top:2px}
  .board-score{height:26px;grid-template-rows:18px 8px}
  .board-score strong{font-size:20px}.board-score small{line-height:8px;font-size:7px}
  .board-avatar,.ai-board .board-avatar{width:35px;height:35px}
  .battle-board-header,.ai-board .battle-board-header{width:47px;left:5px;top:6px}
  .battle-board-header h3,.ai-board .battle-board-header h3{font-size:8px;padding:1px 4px;line-height:10px}
  .action-dock{min-height:48px;padding:6px 8px}
}
@media(prefers-reduced-motion:reduce){.market-time-fill{transition:none}.game-tile .tile{transform:none!important}}
/* 两种玩法入口与满墙进度。 */
.variant-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;border:0;padding:0;margin:0 0 18px}
.variant-card{display:block;position:relative;padding:13px 14px;border:1px solid #d5e0db;border-radius:10px;background:#f4f7f0;cursor:pointer;color:#3b6572}
.variant-card input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.variant-card b{display:block;font-size:13px;line-height:1.5}
.variant-card small{display:block;font-size:10px;color:#8b9b96;line-height:1.6;margin-top:3px}
.variant-card em{font-size:8px;font-style:normal;font-weight:500;padding:1px 4px;border-radius:3px;background:#ffe3d5;color:#b86551;vertical-align:2px}
.variant-card:has(input:checked){border-color:#487d8b;background:#e6f0eb;box-shadow:inset 0 0 0 1px #487d8b}
.variant-card.race:has(input:checked){border-color:#bd7771;background:#fbf0e5;box-shadow:inset 0 0 0 1px #bd7771}
.variant-card:has(input:focus-visible){outline:3px solid #d6b16c;outline-offset:2px}
.race-note{font-size:11px;line-height:1.9;margin:0;padding:14px;border:1px solid #e5d5be;border-radius:10px;background:#faf4e7;color:#8c816a}
.board-score.race-progress>span{color:#58879a;font-size:17px}
.board-score.race-progress strong{font-size:20px;white-space:nowrap}
.board-score.race-progress strong em{font-size:9px;font-style:normal;font-weight:500;color:#66818e;margin-left:1px}
.result-scores b small{font-size:16px;color:#8ba29e;font-weight:400}
.settled-player p>b{width:auto;min-width:40px;white-space:nowrap}
@media(max-width:760px){
  .variant-options{gap:8px;margin-bottom:15px}
  .variant-card{padding:11px 10px;border-radius:9px}
  .variant-card b{font-size:12px}.variant-card small{font-size:8px}.variant-card em{font-size:7px;vertical-align:1px}
  .race-note{font-size:10px;padding:12px;line-height:1.85}
  .board-score.race-progress strong{font-size:19px}.board-score.race-progress strong em{font-size:8px}
}
/* 四档人机：两列卡片让等级和策略说明保持易读。 */
@media(min-width:761px){.difficulty-options{grid-template-columns:repeat(2,minmax(0,1fr))}.difficulty-card{min-height:152px}}
.difficulty-card sup{font-size:8px;font-weight:500;background:#e5bd71;color:#294e57;border-radius:3px;padding:1px 4px;margin-left:4px;vertical-align:3px}
/* 明确的选择状态与音乐控制。 */
.soundbar{display:flex;align-items:center;gap:18px;margin:16px 0 0;padding:13px 18px;border:1px solid #c4d6d9;border-radius:13px;background:#fffdf6;color:#31576a}
.soundtrack{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.soundtrack b{font-size:13px;display:block}.soundtrack small{display:block;font-size:10px;color:#6b848e;margin-top:3px}
.sound-waves{display:flex;gap:3px;align-items:center;height:26px;width:26px;flex-shrink:0}
.sound-waves i{display:block;width:3px;height:9px;border-radius:3px;background:#8ba8af}
.sound-waves i:nth-child(2){height:21px}.sound-waves i:nth-child(3){height:15px}.sound-waves i:nth-child(4){height:24px}
.soundbar.is-playing .sound-waves i{background:#347f95;animation:music-wave 1.2s ease-in-out infinite alternate}
.soundbar.is-playing .sound-waves i:nth-child(2n){animation-delay:-.5s}
.music-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:8px 12px;border:1px solid #a8c0c8;border-radius:8px;background:#edf4f3;color:#315d71;font-size:12px;font-weight:650;white-space:nowrap;cursor:pointer}
.music-toggle.is-playing{background:#285f7a;border-color:#285f7a;color:#fff5cc}
.music-volume{display:flex;align-items:center;gap:9px;color:#607c88;font-size:10px;white-space:nowrap}
.music-volume input{width:94px;accent-color:#377c96;cursor:pointer}.music-volume output{font-variant-numeric:tabular-nums;min-width:30px}
.setup-current{display:flex;align-items:center;gap:11px;padding:12px 14px;background:#eaf3f3;border:1px solid #9ebecb;border-radius:10px;color:#245570;margin:0 0 22px}
.setup-current>span{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#2b6581;color:#fff7d6;font-size:17px;flex-shrink:0}
.setup-current small{display:block;font-size:10px;color:#577b8b;margin-bottom:3px}.setup-current strong{font-size:15px;line-height:1.5}
.variant-options,.difficulty-options{gap:12px;margin:0 0 22px}
.variant-options legend,.difficulty-options legend{padding:0 0 12px;font-size:11px;letter-spacing:.04em;color:#8b9da3;font-weight:650;float:none;width:100%}
.variant-options legend>span,.difficulty-options legend>span{color:#294f64;font-size:15px;font-weight:750;margin-left:7px}
.difficulty-options legend>small{font-weight:400;letter-spacing:0;font-size:10px;color:#69828d;margin-left:13px}
.variant-card{padding:18px 34px 17px 16px;border:2px solid #c1d0d4;border-radius:12px;background:#fbfcf8;color:#2c5369;box-shadow:0 2px 0 #2e586a0b}
.variant-card b{font-size:16px;font-weight:750}.variant-card small{color:#617e8b;font-size:11px;line-height:1.7;margin-top:5px}
.variant-card:has(input:checked),.variant-card.race:has(input:checked){border-color:#d7b46c;background:#2b5e79;box-shadow:0 0 0 2px #ead49b60;color:#fff8dd}
.variant-card:has(input:checked) small{color:#deecee}
.choice-indicator{position:absolute;right:12px;top:13px;display:grid;place-items:center;width:21px;height:21px;border:2px solid #b5c6ce;border-radius:50%;background:#f6f9f5;color:transparent;font-size:13px;line-height:1;font-weight:850;pointer-events:none}
.variant-card:has(input:checked) .choice-indicator,.difficulty-card:has(input:checked) .choice-indicator{border-color:#f3ce72;background:#f3ce72;color:#254f68;box-shadow:0 0 0 3px #fff2cb20}
.difficulty-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.difficulty-card,.difficulty-card.master{display:grid;grid-template-columns:43px minmax(0,1fr);gap:12px;align-content:start;align-items:center;min-height:142px;padding:17px 16px 15px;border:2px solid #c1d0d4;border-radius:12px;background:#fbfcf8;color:#2b5369;box-shadow:0 2px 0 #2e586a0b;transition:border-color .15s,background .15s,box-shadow .15s}
.difficulty-card:hover{transform:none;border-color:#6597ac;background:#eff5f5}
.difficulty-card.master{background:#fcf7eb;border-color:#d7c291}
.difficulty-card .difficulty-symbol{grid-column:1;grid-row:1;margin:0;width:42px;height:42px}
.difficulty-copy{grid-column:2;grid-row:1;min-width:0}
.difficulty-card b{font-size:19px;font-weight:780;margin:0 0 5px;line-height:1.4;padding-right:16px}
.difficulty-card small,.difficulty-card.master small{font-size:11px;line-height:1.75;color:#5d7d8b}
.difficulty-card em,.difficulty-card.master em{grid-column:1/-1;display:flex;align-items:center;gap:9px;margin:3px 0 0;color:#57798a;font-size:10px;font-style:normal;letter-spacing:.02em}
.difficulty-card sup{font-size:9px;vertical-align:2px;margin-left:3px;padding:2px 5px;background:#f3d48b;color:#5b4a26;white-space:nowrap}
.difficulty-card:has(input:checked),.difficulty-card.master:has(input:checked){border-color:#d7b46c;background:#2b5e79;color:#fff9e2;box-shadow:0 0 0 2px #ead49b70,0 5px 14px #25495c20}
.difficulty-card:has(input:checked) small,.difficulty-card:has(input:checked) em{color:#e0ecec}
.difficulty-card:has(input:checked):after{display:none}
.strength-meter{display:flex;align-items:flex-end;gap:3px;height:15px;flex-shrink:0}
.strength-meter i{display:block;background:#d3dedf;width:7px;border-radius:2px;height:6px}
.strength-meter i:nth-child(2){height:9px}.strength-meter i:nth-child(3){height:12px}.strength-meter i:nth-child(4){height:15px}
[data-strength="1"] .strength-meter i:nth-child(-n+1),[data-strength="2"] .strength-meter i:nth-child(-n+2),[data-strength="3"] .strength-meter i:nth-child(-n+3),[data-strength="4"] .strength-meter i{background:#4c8299}
.difficulty-card:has(input:checked) .strength-meter i{background:#527f93}
.difficulty-card:has(input:checked)[data-strength="1"] .strength-meter i:nth-child(-n+1),.difficulty-card:has(input:checked)[data-strength="2"] .strength-meter i:nth-child(-n+2),.difficulty-card:has(input:checked)[data-strength="3"] .strength-meter i:nth-child(-n+3),.difficulty-card:has(input:checked)[data-strength="4"] .strength-meter i{background:#f4d17e}
.new-match-controls{padding-top:0;gap:16px;flex-wrap:wrap}
.match-settings{display:flex;gap:17px}.new-match-controls label{color:#4d7183;font-size:12px;font-weight:600}
.new-match-controls select{border:1px solid #9fb8c5;background:#f1f6f4;color:#244f67;font-weight:600;font-size:12px;min-height:41px}
.new-match-controls .primary-button{min-height:46px;font-size:15px;padding:12px 23px}
.in-match .soundbar{display:none}
.table-tools .music-toggle{min-height:0;gap:4px}.table-tools .music-toggle.is-playing{border-color:#e4c985;background:#2d5871;color:#fff0b4}
@keyframes music-wave{from{transform:scaleY(.45)}to{transform:scaleY(1)}}
@media(max-width:760px){
  .soundbar{gap:10px;padding:11px 12px;margin-top:12px;flex-wrap:wrap;border-radius:11px}
  .soundtrack{gap:8px}.soundtrack b{font-size:12px}.soundtrack small{font-size:9px}.sound-waves{width:23px;gap:3px}
  .soundbar .music-toggle{font-size:11px;min-height:34px;padding:7px 10px}
  .music-volume{flex-basis:100%;justify-content:flex-end;border-top:1px solid #dde5de;padding-top:8px;gap:8px;font-size:10px}.music-volume input{width:104px;flex:none}
  .match-setup{padding:22px 16px}.setup-title p{color:#577986;font-size:11px;line-height:1.7;margin-bottom:16px}
  .setup-current{padding:10px 12px;margin-bottom:20px;gap:9px}.setup-current strong{font-size:14px}.setup-current small{font-size:10px}
  .variant-options,.difficulty-options{gap:10px;margin-bottom:20px}
  .variant-options legend,.difficulty-options legend{padding-bottom:11px}.difficulty-options legend>small{font-size:9px;margin-left:9px}
  .variant-card{padding:13px 10px;min-height:100px}.variant-card b{font-size:14px;line-height:1.4;padding-right:19px}.variant-card small{font-size:10px;margin-top:8px;line-height:1.65}
  .choice-indicator{width:19px;height:19px;right:9px;top:10px;font-size:12px}
  .difficulty-card,.difficulty-card.master{grid-template-columns:1fr;gap:8px;min-height:161px;padding:13px 12px 12px}
  .difficulty-card .difficulty-symbol{grid-column:1;grid-row:1;width:32px;height:32px}
  .difficulty-copy{grid-column:1;grid-row:2}.difficulty-card b{font-size:18px;line-height:1.25;margin:0 0 6px;padding:0}
  .difficulty-card small,.difficulty-card.master small{font-size:10px;line-height:1.65}
  .difficulty-card em,.difficulty-card.master em{grid-column:1;grid-row:3;font-size:9px;margin:1px 0 0;gap:7px}
  .difficulty-card sup{font-size:8px;padding:2px 4px;vertical-align:2px}
  .strength-meter{height:13px;gap:2px}.strength-meter i{width:6px}.strength-meter i:nth-child(4){height:13px}
  .match-settings{width:100%;gap:11px;justify-content:space-between}.new-match-controls label{font-size:11px;gap:7px}.new-match-controls select{font-size:11px;padding:8px 7px;min-height:38px}
  .new-match-controls .primary-button{width:100%;min-height:47px;font-size:15px}
  .table-tools .music-toggle{padding:5px 7px;font-size:10px;min-height:26px;gap:2px}
}
@media(max-width:360px){.difficulty-options legend>small{display:none}.variant-card b{font-size:13px}.difficulty-card small{font-size:9px}.match-settings{gap:7px}.new-match-controls label{gap:5px;font-size:10px}}
