/* Prism is presentation-only; all game layout and controls remain shared. */
html:has(body[data-skin=prism]){background:#111d2b;color-scheme:dark}
body[data-skin=prism]{--paper:#111d2b;--panel:#203247;--ink:#eef5fc;--muted:#a8b8ca;--accent:#f5bd68;--selection:#6dd9ec;--line:#40566e;--success:#80dfaf;color:var(--ink);background:radial-gradient(ellipse at 65% 0,#243b51 0,transparent 65%),var(--paper);background-size:auto;font-family:"Avenir Next",ui-rounded,system-ui,sans-serif}
body[data-skin=prism]::before{background:linear-gradient(90deg,#111d2bff 0%,#111d2bf5 27%,#111d2bc9 46%,#111d2b44 74%,#111d2b22 100%)}
[data-skin=prism] #intro-canvas{filter:none}
[data-skin=prism] :is(button,select){border:1px solid var(--line);border-radius:12px;background:linear-gradient(#2d435b,#23364c);box-shadow:inset 0 1px 0 #ffffff12,0 3px 0 #091322;color:var(--ink);font-weight:650;transition:background .12s,border-color .12s,transform .12s}
[data-skin=prism] button:hover:not(:disabled){background:#354e66;border-color:var(--muted)}
[data-skin=prism] button:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 1px 4px #0003}
[data-skin=prism] :is(button,select,canvas):focus-visible{outline:3px solid var(--selection);outline-offset:4px}
[data-skin=prism] button:disabled{opacity:.42}
[data-skin=prism] .setup-screen{width:min(650px,50%);min-height:100dvh;display:flex;flex-direction:column;justify-content:center;padding:40px clamp(24px,3.5vw,64px)}
[data-skin=prism] .title-screen h1{font-weight:850;font-size:clamp(44px,4.8vw,74px);line-height:1;letter-spacing:-3px;text-shadow:none;margin:0 0 32px;max-width:6em}
[data-skin=prism] .title-screen h1::before{content:"";display:block;width:36px;height:10px;background:var(--selection);border-radius:3px;margin-bottom:20px;box-shadow:13px -10px 0 var(--accent)}
[data-skin=prism] .setup-sheet{grid-template-columns:1fr;gap:22px;padding:0;min-width:0}
[data-skin=prism] .picture-picker{display:grid;grid-template-columns:140px minmax(0,1fr);grid-template-rows:44px 44px 14px;gap:10px 18px;text-align:left;width:100%;max-width:none;margin:0}
[data-skin=prism] .reference-image{grid-column:1;grid-row:1/3;margin:0;transform:none;padding:5px;border:1px solid var(--line);border-radius:14px;background:#0b1522;box-shadow:0 8px 20px #0004;align-self:stretch;display:grid;place-items:center;overflow:hidden}
[data-skin=prism] .reference-image canvas{width:100%;height:100%;max-height:86px;object-fit:cover;border-radius:8px}
[data-skin=prism] .tape{display:none}
[data-skin=prism] .picture-picker h2{grid-column:2;grid-row:1;font-size:17px;font-weight:700;line-height:1.25;align-self:center;margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
[data-skin=prism] .gallery-picker{grid-column:2;margin:0}
[data-skin=prism] .generate-button{grid-column:2;grid-row:2;font:650 13px var(--hand);color:var(--ink);min-height:44px}
[data-skin=prism] #image-credit{grid-column:1/-1;grid-row:3;font-size:10px;line-height:14px;text-align:left;margin:0}
[data-skin=prism] #image-credit:empty{display:none}
[data-skin=prism] .round-settings{display:grid;grid-template-columns:1fr 1fr;gap:14px}
[data-skin=prism] .round-settings>.setting:first-child{grid-column:1/-1}
[data-skin=prism] .setting{font-size:11px;font-weight:600;gap:6px;margin:0}
[data-skin=prism] .setting select{font-size:13px;padding:10px 12px;min-height:46px;min-width:0;background-color:var(--panel)}
[data-skin=prism] option{background:var(--panel);color:var(--ink)}
[data-skin=prism] .audio-controls{grid-column:1/-1;margin:2px 0;gap:12px}
[data-skin=prism] .audio-controls button{font-size:12px;min-height:44px}
[data-skin=prism] .audio-controls button[aria-pressed=true]{border-color:var(--selection);color:var(--selection)}
[data-skin=prism] .start-button{grid-column:1/-1;justify-content:center;font:800 20px var(--hand);background:linear-gradient(#ffd18a,#f0b257);border-color:#ffd798;color:#202a36;box-shadow:inset 0 1px 0 #fff6,0 4px 0 #895e30,0 10px 26px #0003;min-height:58px}
[data-skin=prism] .start-button:hover:not(:disabled){background:#ffd18a;color:#202a36;border-color:#ffe2b6;filter:none}
[data-skin=prism] .setup-message,[data-skin=prism] .setup-message:empty{display:block;min-height:20px;line-height:20px;margin:12px 0 0}
[data-skin=prism] .game-hud{border-color:#40566e66}
.playability{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:48px;align-self:center;line-height:1;gap:2px;color:var(--muted)}
.round-readout .playability strong{min-width:0;text-align:center;font-size:24px}
.round-readout .playability small{display:block;font-size:8px;letter-spacing:.3px;color:inherit}
.playability[data-level=easy]{color:var(--success)}
.playability[data-level=moderate]{color:var(--accent)}
.playability[data-level=hard],.playability[data-level=none]{color:var(--danger,#ff8e88)}
@media(max-width:600px){.game-hud .game-wordmark{display:none}.game-hud .round-readout{flex:1;justify-content:flex-end;gap:10px}.game-hud .playability{margin-right:auto}}
[data-skin=prism] .game-wordmark{font-size:22px;font-weight:800;letter-spacing:-1px}
[data-skin=prism] .round-readout strong{font-weight:800;font-variant-numeric:tabular-nums;font-size:26px}
[data-skin=prism] .quiet-button{background:transparent;box-shadow:none;border-color:transparent;font-size:12px}
[data-skin=prism] .piece-rack{border:0;background:linear-gradient(#1b2b3d,#172637);border-radius:18px 18px 0 0;padding:8px 18px 0;gap:8px}
[data-skin=prism] .rack-heading h2{font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.4px}
[data-skin=prism] .rack-heading>span{font-size:10px}
[data-skin=prism] .piece-tile{border-radius:8px}
[data-skin=prism] .piece-tile.front{border:1px solid #66859f;box-shadow:inset 0 1px 0 #ffffff22,0 3px 0 #080f1b;background:linear-gradient(#3a526a,#253b51)}
[data-skin=prism] .piece-tile.queued{background:#26394c;border:1px solid #40566e88;opacity:.75}
[data-skin=prism] .piece-number{background:#0e1a29;border-color:#4a6178;color:var(--ink);border-radius:4px}
[data-skin=prism] .overflow-slot{border-radius:9px}
[data-skin=prism] .overflow-slot.empty{opacity:1;background:#101d2c;border:1px solid #526980;box-shadow:inset 0 3px 7px #0005}
[data-skin=prism] .overflow-slot.occupied{border:1px solid var(--selection)}
/* Dim the artwork, not its shortcut label or focus ring. Still dispatchable. */
.piece-rack .unplayable canvas{filter:brightness(.38) saturate(.45)}
[data-skin=prism] .piece-rack .unplayable{border-color:var(--line);background:var(--panel);box-shadow:none}
[data-skin=prism] .play-controls{border-color:#40566e66}
[data-skin=prism] .action-button{border-width:1px;border-radius:16px}
[data-skin=prism] .action-button strong{font-size:23px;font-weight:800}
[data-skin=prism] .action-button small{color:var(--muted)}
[data-skin=prism] .place-button{background:linear-gradient(#ffd18a,#f0b257);border-color:#ffd798;color:#202a36;box-shadow:0 4px 0 #895e30}
[data-skin=prism] .place-button small{color:#3b4653}
[data-skin=prism] .place-button:hover:not(:disabled){background:#ffd18a;border-color:#ffe2b6}
[data-skin=prism] .place-button.ready,[data-skin=prism] .place-button.ready:hover{background:var(--success);border-color:#b4f3d2;color:#122e24;box-shadow:0 4px 0 #3e8665}
[data-skin=prism] .travelers button[aria-pressed=true]{color:#102b37;background:var(--selection);border-color:#b5f4ff;box-shadow:0 2px 0 #267a8b}
[data-skin=prism] .result{border:1px solid var(--line);border-radius:20px;box-shadow:0 20px 60px #0008}
[data-skin=prism] .result h2{font-size:32px;font-weight:800;letter-spacing:-1px}
@media(max-width:1000px){[data-skin=prism] .setup-screen{width:54%;padding:28px 24px}[data-skin=prism] .picture-picker{grid-template-columns:110px minmax(0,1fr);gap:10px 12px}[data-skin=prism] .title-screen h1{font-size:54px;margin-bottom:24px}}
@media(max-width:650px){body[data-skin=prism]::before{background:linear-gradient(90deg,#111d2bfa,#111d2bed 60%,#111d2b88 86%,#111d2b44)}[data-skin=prism] .setup-screen{width:82%;padding:24px 18px}[data-skin=prism] .title-screen h1{font-size:44px;letter-spacing:-2px}[data-skin=prism] .picture-picker{grid-template-columns:80px minmax(0,1fr)}[data-skin=prism] .setting select{font-size:12px;padding:8px}[data-skin=prism] .piece-rack{padding:6px 8px}[data-skin=prism] .game-wordmark{font-size:18px}[data-skin=prism] .action-button strong{font-size:21px}}
@media(max-height:650px){[data-skin=prism] .setup-screen{justify-content:flex-start;padding-top:24px}[data-skin=prism] .title-screen h1{font-size:42px;margin-bottom:20px}[data-skin=prism] .title-screen h1::before{display:none}[data-skin=prism] .setup-sheet{gap:16px}}
@media(prefers-reduced-motion:reduce){[data-skin=prism] :is(button,select){transition:none}}
/* Larger playable fragments, with four visible previews below each column. */
[data-skin=prism] .game-screen{grid-template-rows:52px minmax(100px,1fr) 24px 300px 90px}
[data-skin=prism] .piece-tile.front{width:88px;height:80px;min-height:80px}
[data-skin=prism] .piece-tile.queued{width:72px;height:26px;min-height:26px}
[data-skin=prism] .columns{height:196px}
[data-skin=prism] .overflow-slot{width:88px;height:76px;min-height:76px}
@media(max-width:650px){[data-skin=prism] .game-screen{grid-template-rows:46px minmax(100px,1fr) 24px 250px 86px}[data-skin=prism] .piece-tile.front{width:68px;height:64px;min-height:64px}[data-skin=prism] .piece-tile.queued{width:56px;height:23px;min-height:23px}[data-skin=prism] .columns{height:168px}[data-skin=prism] .overflow-slot{width:54px;height:54px;min-height:54px}}
@media(max-height:650px) and (orientation:landscape){[data-skin=prism] .game-screen{grid-template-rows:42px minmax(80px,1fr) 20px 212px 74px}[data-skin=prism] .piece-tile.front{width:76px;height:58px;min-height:58px}[data-skin=prism] .piece-tile.queued{height:19px;min-height:19px}[data-skin=prism] .columns{height:142px}[data-skin=prism] .overflow-slot{width:76px;height:44px;min-height:44px}}
[data-skin=prism] .choice-setting{grid-column:1/-1}
.choice-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
[data-skin=prism] .choice-buttons button{padding:12px 5px;font-size:12px;min-height:48px}
.choice-buttons small{display:block;font-size:10px;margin-top:5px;font-weight:400;color:var(--muted)}
[data-skin=prism] .choice-buttons button[aria-pressed=true]{border-color:var(--selection);background:#254b5e;box-shadow:inset 0 -3px 0 var(--selection),0 3px 0 #091322;color:#e9fbff}
[data-skin=prism] .choice-buttons button[aria-pressed=true] small{color:#b6e7ee}
[data-skin=prism] .overflow-slots{min-width:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
[data-skin=prism] .overflow-slot{max-width:100%;justify-self:center}
[data-skin=prism] .piece-tile.front{max-width:100%}
@media(max-width:650px){[data-skin=prism] .holding-rack{grid-template-columns:1fr}[data-skin=prism] .holding-rack .rack-heading{display:none}[data-skin=prism] .overflow-slots{gap:7px}}
/* Full-viewport reference, not a thumbnail constrained by the puzzle canvas. */
[data-skin=prism] .picture-overlay{position:fixed;inset:0;z-index:10;display:block;padding:calc(76px + env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:#0b1522f7}
[data-skin=prism] .picture-overlay canvas{display:block;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain}
[data-skin=prism] .picture-overlay button{position:absolute;top:max(18px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));min-width:80px;min-height:48px;box-shadow:0 4px 16px #0008}

/* The rack is flanked by full-height touch zones, not a small button row. */
[data-skin] .game-screen{--hud-height:52px;--rack-height:320px;padding:0;grid-template-columns:minmax(88px,1fr) minmax(0,3.4fr) minmax(88px,1fr);grid-template-rows:var(--hud-height) minmax(80px,min(var(--circuit-natural-height,100dvh),calc(100dvh - var(--hud-height) - var(--rack-height)))) minmax(var(--rack-height),1fr);grid-template-areas:"hud hud hud" "board board board" "rotate rack place";column-gap:8px}
[data-skin] .game-hud{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
.game-hud{grid-area:hud}.canvas-wrap{grid-area:board}.piece-rack{grid-area:rack;min-width:0}
/* Feedback overlays the circuit only when needed; no permanently empty row. */
.play-feedback{grid-area:board;align-self:end;z-index:1;pointer-events:none;margin-bottom:14px}
.play-feedback p:not(:empty){background:var(--panel);border-radius:6px;padding:4px 10px}
[data-skin] .play-controls{display:contents}
.play-controls .control-center{display:none}
[data-skin] .play-controls .action-button{width:100%;height:100%;margin:0;min-width:0;min-height:44px;align-self:stretch;flex-direction:column;gap:16px;text-align:center;padding:18px 6px;border-radius:0;border-bottom:0;box-shadow:none}
[data-skin] .play-controls .action-button:active:not(:disabled){transform:none;filter:brightness(1.1)}
#rotate{grid-area:rotate}#drop{grid-area:place}
[data-skin] .play-controls #rotate{border-radius:0 18px 18px 0;border-left:0;padding-left:max(6px,env(safe-area-inset-left));padding-bottom:max(18px,env(safe-area-inset-bottom))}
[data-skin] .play-controls #drop{border-radius:18px 0 0 18px;border-right:0;padding-right:max(6px,env(safe-area-inset-right));padding-bottom:max(18px,env(safe-area-inset-bottom))}
[data-skin] .play-controls .action-button strong{font-size:clamp(22px,2.8vw,42px)}
.play-controls .action-icon{order:-1;font-size:clamp(42px,6vw,80px)}
[data-skin] .piece-rack{max-width:none;padding-left:6px;padding-right:6px}
[data-skin] .piece-rack .holding-rack{grid-template-columns:1fr;gap:4px}
[data-skin] .holding-rack .rack-heading{display:none}
[data-skin] .piece-rack .columns{grid-template-columns:repeat(5,minmax(0,1fr))}
[data-skin] .piece-rack .piece-tile.front{width:100%;height:clamp(64px,6.6vw,96px);min-height:clamp(64px,6.6vw,96px)}
[data-skin] .piece-rack .overflow-slot{width:100%;height:clamp(54px,6vw,84px);min-height:clamp(54px,6vw,84px)}
[data-skin] .piece-tile.queued{max-width:100%}
[data-skin] .dealt-rack{flex:1;min-height:0;display:flex;flex-direction:column}
[data-skin] .piece-rack .columns{flex:1;min-height:0;height:auto}
[data-skin] .piece-rack .column{height:100%;min-height:0}
[data-skin] .piece-rack .piece-tile.queued{width:90%;flex:1;min-height:12px;max-height:none}
@media(max-width:850px){[data-skin] .game-screen{grid-template-columns:minmax(68px,1fr) minmax(0,3.8fr) minmax(68px,1fr);column-gap:6px}}
@media(max-width:650px){[data-skin] .game-screen{--hud-height:46px;--rack-height:250px;grid-template-columns:minmax(52px,1fr) minmax(0,4.4fr) minmax(52px,1fr);column-gap:4px}[data-skin] .piece-rack{padding-left:2px;padding-right:2px}[data-skin] .play-controls .action-button{gap:10px;padding:12px 2px;border-radius:12px 12px 0 0}[data-skin] .play-controls .action-button strong{font-size:15px}.play-controls .action-icon{font-size:38px}.play-controls .action-button small{display:none}}
@media(max-height:650px) and (orientation:landscape){[data-skin] .game-screen{--hud-height:42px;--rack-height:224px}[data-skin] .piece-rack .piece-tile.front{height:58px;min-height:58px}[data-skin] .piece-rack .overflow-slot{height:44px;min-height:44px}}