/* Material changes accompany the illustrated scene and playable pieces. */
body .game-board[data-world] {position:relative;isolation:isolate;background:var(--world-ground);background-image:var(--world-scene);background-size:cover;background-position:center;border:3px solid var(--world-ink);padding:26px 32px;min-height:440px;overflow:hidden}
.game-board[data-world] canvas{display:block;width:100%;height:auto;background:none;border:0;border-radius:9px;box-shadow:0 4px 20px #15283c24}
.game-board[data-world]:has(canvas){padding:10px}
.game-board[data-world] .board-grid{position:relative;margin:22px auto;max-width:380px;padding:14px;background:#fffaf0e8;box-shadow:0 6px 0 #172a3b30,0 12px 28px #172a3b30;border:3px solid var(--world-ink);border-radius:10px;gap:6px}
.game-board[data-world] .cell{position:relative;border:2px solid #20344445;background-color:#fffcf3;box-shadow:inset 0 -4px #1d253013;color:#19344d;min-width:0;text-shadow:none}
.game-board[data-world] .cell.lit{background-color:#ffe260;box-shadow:inset 0 0 0 3px #fff8c5,0 0 16px #fff7af}
.game-board[data-world] .cell.revealed{background-color:#fffdf4}
.game-board[data-world] .cell.empty{visibility:hidden}
.game-board[data-world] .cell.wall{background-color:var(--world-ink);box-shadow:inset 0 3px #ffffff25}
.game-board[data-world] .cell.object-cell{font-size:0!important;background-repeat:no-repeat;background-position:center;background-size:88%;color:transparent!important}
.game-board[data-world] .cell.object-cell::after{content:none}
.game-board[data-world] .direction-pad{background:#fffdf2e8;border-radius:14px;padding:6px;width:max-content;max-width:100%;margin:12px auto 0}
.game-board[data-world] .control-button,.game-board[data-world]>.primary-button,.game-board[data-world]>.secondary-button{box-shadow:0 3px 0 #172a3b30}
.game-board[data-world] .question{background:#fffcf2f5;border:3px solid var(--world-ink);border-radius:12px;padding:22px 12px;margin:80px auto 16px;max-width:410px;font-size:clamp(21px,4vw,34px);box-shadow:0 5px 0 #172a3b30;overflow-wrap:anywhere}
.game-board[data-world] .question::before{content:"";position:absolute;top:18px;left:calc(50% - 34px);width:68px;height:68px;background:var(--world-actor) center/contain no-repeat}
.game-board[data-world] .clue{background:#fffdf3f2;color:#263d53;padding:10px;border-radius:8px;font-size:15px}
.game-board[data-world] .answers{position:relative;gap:10px}
.game-board[data-world] .answer-button{background:#fffdf6;border:2px solid var(--world-ink);box-shadow:0 4px 0 #172a3b30;border-radius:10px;color:#21384f}
.game-board[data-world] .answer-form{position:relative;background:#fffdf2ee;padding:10px;border-radius:10px;gap:7px}
.game-board[data-world] .answer-form input{min-width:0;color:#21384f}
.game-board[data-world] .clock{background:#fffdf2f2;border-radius:30px;padding:6px 14px;width:max-content;max-width:100%;margin:16px auto 0;color:#273f51;font-weight:700}
.game-board[data-world] .pebbles{background:#fff8e5e8;padding:15px;border-radius:16px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:45px 0 20px}
.game-board[data-world] .pebbles img{width:38px;height:38px}
.game-board[data-world] .reaction-panel{position:relative;min-height:280px;max-width:360px;margin:25px auto;padding:150px 15px 25px;background:#fff5dbe8;color:#283c4a;border:3px solid var(--world-ink);box-shadow:0 6px 0 #152b4130}
.game-board[data-world] .reaction-panel::before{content:"";position:absolute;width:108px;height:108px;top:26px;left:calc(50% - 54px);background:var(--world-actor) center/contain no-repeat}
.game-board[data-world] .reaction-panel.waiting{background:#f7cabc}
.game-board[data-world] .reaction-panel.ready{background:#9fe7a0;color:#12451d}
.game-board[data-world] .game-intro{background:#fffdf2ec;border-radius:12px;padding:15px}
.game-board[data-material="wood"] .board-grid{background:#9e653e;border-color:#603b2b;transform:rotate(-1deg)}
.game-board[data-material="wood"] .cell{background-color:#f2c88c;border-color:#85532f;border-radius:4px}
.game-board[data-material="glass"] .board-grid{background:#bdeaf2dd;border:3px solid #ecffff;box-shadow:0 6px 0 #22618480}
.game-board[data-material="glass"] .cell{background-color:#ffffffc9;border-color:#5caccb;border-radius:50%}
.game-board[data-material="stone"] .board-grid{background:#827d7a;border-color:#474743;gap:5px}
.game-board[data-material="stone"] .cell{background-color:#d3cbb8;border-radius:2px;border-color:#625d52}
.game-board[data-material="metal"] .board-grid{background:#597080;border:5px ridge #b6c6cc;border-radius:18px}
.game-board[data-material="metal"] .cell{background-color:#d2e1e6;border:3px outset #f0f7f7;border-radius:9px}
.game-board[data-material="fabric"] .board-grid{background:#eaca8e;border:3px dashed #6b4033;padding:17px;box-shadow:0 5px 20px #492a2b30}
.game-board[data-material="fabric"] .cell{background-color:#fff6db;border:2px dashed #a9774b;border-radius:18px}
.game-board[data-material="sand"] .board-grid{background:#e9bb79;border:4px solid #b5824a;border-radius:32px}
.game-board[data-material="sand"] .cell{background-color:#fff1c4;border-radius:40%;border-color:#bc8851}
.game-board[data-material="ice"] .board-grid{background:#c5f2f1de;border:4px solid #f4ffff;transform:rotate(1deg)}
.game-board[data-material="ice"] .cell{background-color:#eaffff;border:2px solid #74c3da;clip-path:polygon(12% 0,88% 0,100% 12%,100% 88%,88% 100%,12% 100%,0 88%,0 12%)}
.game-board[data-material="circuit"] .board-grid{background:#133d42;border-color:#62aa99;gap:8px}
.game-board[data-material="circuit"] .cell{background-color:#d9f4c3;border:2px solid #439f80;border-radius:3px;box-shadow:inset 0 -4px #69a07b55}
.game-board[data-material="water"] .board-grid{background:#278cbbbd;border:3px solid #b7f3ff;border-radius:35px}
.game-board[data-material="water"] .cell{background-color:#e6fbff;border:2px solid #6cc1da;border-radius:50%}
body[data-game="whack"] .game-board .board-grid{background:transparent;box-shadow:none;border:0;gap:15px}
body[data-game="whack"] .game-board .cell{background-color:#344634b0;border:5px solid #faf3cf;border-radius:50%;box-shadow:inset 0 8px #11282370}
body[data-game="whack"] .game-board .cell.lit{background-color:#fff1b4}
body[data-game="simon"] .game-board .board-grid{max-width:300px}
body[data-game="simon"] .game-board .cell{aspect-ratio:1;min-height:90px;filter:brightness(.72);transition:filter .08s,transform .08s}
body[data-game="simon"] .game-board .cell.lit{filter:brightness(1.18);transform:scale(1.06)}
body[data-game="lights"] .game-board .cell::after{content:"";position:absolute;inset:16%;background:var(--world-target) center/contain no-repeat;opacity:.18}
body[data-game="lights"] .game-board .cell.lit::after{opacity:1}
body[data-game="lights"] .game-board .cell{font-size:0}
body[data-game="merge"] .game-board .cell::before{content:"";position:absolute;width:28%;height:28%;left:5%;top:5%;background:var(--world-target) center/contain no-repeat;opacity:.7}
body[data-game="slide"] .game-board .cell{background-image:var(--world-target);background-size:36%;background-position:8% 8%;background-repeat:no-repeat}
body[data-game="sudoku"] .game-board .cell.fixed{background-color:#e3e2cf;color:#1e4355}
body[data-game="sudoku"] .game-board .cell.selected{outline:3px solid #e15831;outline-offset:-3px}
body[data-game="hangman"] .game-board .cell{font-size:17px}
.world-caption{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:13px;color:#4b6378}
.world-caption img{width:30px;height:30px}
.game-card .card-body h3{font-size:16px;line-height:1.25;min-height:2.5em}
.game-card .card-body>p{font-size:12px}
.spotlight-main{background:#124d66}
.spotlight-copy .feature-label{color:#bce8f3}
.spotlight-copy p{color:#d1edf5}
.spotlight-side .mini-feature h2{max-width:58%;font-size:22px}
@media(max-width:480px){.spotlight-main:after{background:linear-gradient(90deg,#124d66ee,transparent 85%)}.spotlight-side .mini-feature h2{font-size:17px;max-width:85%}}
@media(max-width:500px){.game-board[data-world]{padding:18px 10px;min-height:380px}.game-board[data-world] .board-grid{padding:9px;gap:4px;margin:16px auto}.game-board[data-world] .question{font-size:25px;margin-top:70px;padding:18px 8px}.game-board[data-world] .answer-form{flex-wrap:wrap}.game-board[data-world] .answer-form input{flex:1;width:140px}.game-board[data-world] .cell{font-size:22px}.game-board[data-world] .game-intro{padding:8px}}
@media(prefers-reduced-motion:reduce){.game-board[data-world] *{transition:none!important}}
