/* Game surface only; shared page.css stays byte-identical to Dice Bloom. */
.prism-stage{padding:clamp(10px,3cqw,20px) 0 0;position:relative;container-type:inline-size}
.prism-board{--columns:3;--rows:3;--banner-reserve:0px;--pad:clamp(12px,3cqw,22px);position:relative;--cell:min(calc((100cqw - 2*var(--pad))/var(--columns)),calc((780px - 2*var(--pad))/var(--columns)),calc((max(240px,100svh - 250px - var(--banner-reserve)) - 2*var(--pad))/var(--rows)));width:calc(var(--cell)*var(--columns) + 2*var(--pad));height:calc(var(--cell)*var(--rows) + 2*var(--pad));margin-inline:auto;border-radius:28px;padding:var(--pad);background:radial-gradient(ellipse at 0 0,#2a3c4a80,transparent 65%),radial-gradient(ellipse at 100% 100%,#4b2c4d66,transparent 60%),#080e18;box-shadow:inset 0 1px 0 #ffffff26,inset 0 0 0 1px #bda16a66,0 20px 45px #0008;isolation:isolate}
.prism-board:before{content:"";position:absolute;inset:6px;border:1px solid #fff1;border-radius:22px;pointer-events:none}
.prism-board:after{content:"";position:absolute;inset:12%;border-radius:50%;background:conic-gradient(from 20deg,#22d3ee12,#e879f918,#ffc25712,#22d3ee12);filter:blur(24px);z-index:-1;pointer-events:none}
.tile-layer{--gap:5px;position:absolute;inset:var(--pad);touch-action:none;user-select:none;-webkit-user-select:none}
.slide-tile,.tile-vacancy{--step-x:calc(100% / var(--columns));--step-y:calc(100% / var(--rows));position:absolute;left:calc(var(--x)*var(--step-x));top:calc(var(--y)*var(--step-y));width:calc(var(--step-x) - var(--gap));height:calc(var(--step-y) - var(--gap));margin:calc(var(--gap)/2);border:0;padding:0;border-radius:18%;background:transparent;transition:left .17s cubic-bezier(.2,.75,.2,1),top .17s cubic-bezier(.2,.75,.2,1);-webkit-tap-highlight-color:transparent;touch-action:none;cursor:pointer;display:grid;place-items:center}
.slide-tile{z-index:2;filter:drop-shadow(0 3px 3px #0008)}
.slide-tile img{width:100%;height:100%;object-fit:contain;pointer-events:none;grid-area:1/1;filter:hue-rotate(var(--hue)) saturate(1.12) brightness(.84);transition:filter .2s}
.tile-number{grid-area:1/1;z-index:1;color:#fff;font:600 clamp(20px,calc(var(--cell)*.4),74px)/1 ui-rounded,"Avenir Next",system-ui,sans-serif;letter-spacing:-.045em;text-shadow:0 2px 1px #002f4099,0 0 12px #001d3866;pointer-events:none;transform:translateY(-1px)}

.slide-tile:hover img,.slide-tile:focus-visible img{filter:hue-rotate(var(--hue)) saturate(1.15) brightness(1)}
.slide-tile:focus-visible{outline:3px solid #fff;outline-offset:0;z-index:4}
.slide-tile:active .tile-number{transform:translateY(1px)}
.slide-tile.hinted{outline:4px solid #fff1b8;outline-offset:-4px;z-index:3;box-shadow:inset 0 0 0 7px #4c280dcc,0 0 0 3px #ffc85c,0 0 18px 6px #ffd16dcc,0 0 38px 10px #ffbc4780}
.slide-tile.hinted::after{content:"✦";position:absolute;top:7%;right:7%;display:grid;place-items:center;width:25%;height:25%;border-radius:50%;color:#fff7d4;background:#503008;border:2px solid #ffe4a0;font-size:clamp(10px,calc(var(--cell)*.12),24px);line-height:1;text-shadow:none;box-shadow:0 0 12px #ffd476;pointer-events:none}
.tile-vacancy{pointer-events:none;border:1px dashed #bda16a38;background:radial-gradient(circle,#191f2c33,#01050f88);z-index:0}
.tile-vacancy:after{content:"";width:18%;height:18%;border-radius:50%;border:1px solid #bda16a33;box-shadow:0 0 20px #5eead410}
.prism-controls{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:20px 3px 0}
.prism-controls button{min-height:52px;display:flex;align-items:center;justify-content:center;gap:10px}
.prism-controls .control-symbol{font-size:24px;color:#f1d28b}
.prism-board.complete{box-shadow:inset 0 0 0 2px #f5d990,0 0 38px #e3b85e35,0 20px 45px #0008}
.prism-board[data-motion=reduced] .slide-tile{transition:none}
.prism-board[data-theme=aurora] .slide-tile img{filter:hue-rotate(var(--hue)) saturate(.85) brightness(.85)}
.demo-bar small{display:block}
@container gf-page (min-width:600px){.prism-stage{padding-top:18px}.prism-board{max-width:780px;margin-inline:auto}.prism-controls{max-width:660px;margin-inline:auto;padding-top:24px}.tile-layer{--gap:8px}}
@media(prefers-reduced-motion:reduce){.slide-tile,.slide-tile img{transition:none}}

/* Only reserve the lower safe zone when the central anchor is enabled. */
body.has-game-anchor .prism-stage{padding-bottom:calc(62px + env(safe-area-inset-bottom))}

/* Natural materials retain their own colour and surface detail. */
.prism-board[data-material=aluminium] .slide-tile img,.prism-board[data-material=slate] .slide-tile img,.prism-board[data-material=walnut] .slide-tile img{filter:none}
.prism-board[data-material=aluminium] .tile-number{color:#14212d;text-shadow:0 1px 1px #ffffffb0}
.prism-board[data-material=slate] .tile-number,.prism-board[data-material=walnut] .tile-number{color:#fff8e7;text-shadow:0 2px 2px #000b,0 0 6px #0008}
.prism-board[data-material=aluminium] .slide-tile:hover img,.prism-board[data-material=slate] .slide-tile:hover img,.prism-board[data-material=walnut] .slide-tile:hover img{filter:brightness(1.06)}
body.has-game-anchor .prism-board{--banner-reserve:calc(62px + env(safe-area-inset-bottom))}
.prism-board[data-theme] .slide-tile.hinted img{filter:hue-rotate(var(--hue)) saturate(1.12) brightness(1.3)}
.prism-board[data-material="aluminium"] .slide-tile.hinted img,.prism-board[data-material="slate"] .slide-tile.hinted img,.prism-board[data-material="walnut"] .prism-board[data-theme] .slide-tile.hinted img{filter:brightness(1.2)}