*{box-sizing:border-box}
:root{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#593c2c;background:#eadbc0;font-synthesis:none;--app-height:100dvh}
html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
body{height:var(--app-height);background:radial-gradient(ellipse at 30% 0,#fff7e7,#eadbc0 75%)}
button{font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:focus-visible{outline:3px solid #226c65;outline-offset:2px}
button:disabled{opacity:.38;cursor:default}
[hidden]{display:none!important}
.game{width:min(100%,460px);height:100%;margin:0 auto;padding:max(6px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom));display:grid;grid-template-rows:auto 3px minmax(0,1fr);gap:7px;min-height:0;background:linear-gradient(145deg,#fff8e8,#f6e7c9);overflow:hidden}
.hud{min-width:0}
.status{display:flex;align-items:center;gap:7px;height:40px}
.stage{font-size:10px;letter-spacing:1.2px;font-weight:700;color:#8c7156;background:#ede0c1;padding:6px 9px;border-radius:8px;white-space:nowrap}
#progress{margin-left:auto;font-size:11px;color:#8c7156;font-weight:700;white-space:nowrap}
.icon-button{width:40px;height:40px;flex:0 0 40px;border:1px solid #dfcbab;background:#fff8e8;border-radius:12px;color:#806145;font-size:24px;line-height:1}
#menu{font-size:26px}
.campaign{display:flex;align-items:center;gap:8px;margin-top:3px;height:34px;font-size:10px;color:#947554}
.campaign button{height:34px;min-width:44px;border:1px solid #dec6a0;background:#fff7e5;border-radius:10px;padding:4px 9px;color:#79552e;font-size:10px;white-space:nowrap}
#moves{font-size:10px;color:#9b7b57}
#collection{margin-left:auto}
#wallet{font-weight:bold;color:#a16f1d}
.meter{height:3px;background:#e8d8b7;border-radius:9px;overflow:hidden}
#bar{height:100%;width:0;background:#85a185;transition:width .35s}
.scene{position:relative;width:100%;height:100%;max-height:calc(var(--shelf-rows,3)*112px + 24px);align-self:start;min-height:0;padding:12px 5px 14px;border-radius:38px 38px 10px 10px;overflow:hidden;background:linear-gradient(105deg,#c79966,#d7ae7d 50%,#af7b4e);box-shadow:inset 0 2px 4px #7c48284a,0 4px 8px #5e38231c;touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.scene:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 67px,#794f3220 68px 70px,transparent 71px 140px);pointer-events:none}
.window-light{position:absolute;top:-100px;right:25%;width:180px;height:600px;transform:rotate(30deg);background:linear-gradient(90deg,#fff0b700,#fff0b75a,#fff0b700);pointer-events:none}
.cabinet{position:relative;z-index:1;display:grid;grid-template-rows:repeat(var(--shelf-rows,3),minmax(0,1fr));height:100%;min-height:0;border:7px solid #d59950;border-top-color:#f3c17b;border-left-color:#edb873;border-right-color:#b37437;border-bottom-width:9px;border-radius:12px 12px 3px 3px;background:#a26335;box-shadow:3px 5px 6px #66351c66,inset 2px 2px 7px #63371e88;touch-action:none}
.shelf-row{display:grid;grid-template-columns:1fr 1fr;position:relative;min-height:0;border-bottom:8px solid #dfa155;border-top:1px solid #f8ca83;background:linear-gradient(100deg,#996032,#bc824d 55%,#996032);box-shadow:inset 0 10px 12px #4828126b}
.shelf-row:last-child{border-bottom:0}
.shelf-row:after{content:"";position:absolute;left:50%;top:0;bottom:-8px;width:7px;transform:translateX(-50%);background:linear-gradient(90deg,#f2c27e,#c58642);box-shadow:2px 0 3px #51321e55;pointer-events:none;z-index:4}
.shelf-row:last-child:after{bottom:0}
.compartment{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:relative;min-height:0;min-width:0;padding:4px 1px 2px}
.compartment:nth-child(2){padding-left:5px}
.sort-position{position:relative;width:100%;height:100%;min-width:0;min-height:0;isolation:isolate;touch-action:none}
.sort-slot{position:absolute;z-index:2;left:0;bottom:1px;width:100%;height:calc(100% - 12px);max-height:90px;min-height:0;padding:0;border:0;border-radius:8px;background:none;display:flex;align-items:flex-end;justify-content:center;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
.sort-slot:disabled{opacity:1;cursor:default}
.front-stock{position:relative;display:flex;align-items:flex-end;justify-content:center;width:100%;height:100%;pointer-events:none}
.front-stock svg{width:100%;height:100%;max-height:90px;pointer-events:none;filter:drop-shadow(1px 3px 2px #45200b66)}
.back-stock{position:absolute;z-index:1;left:0;bottom:1px;display:flex;align-items:flex-end;justify-content:center;width:100%;height:calc(100% - 12px);max-height:90px;transform:translate(5px,-12px) scale(.94);transform-origin:center bottom;color:#39291f;opacity:.32;pointer-events:none}
.back-stock svg{width:100%;height:100%;max-height:90px;fill:currentColor;color:inherit;filter:none;pointer-events:none}
.back-stock svg [fill]:not([fill="none"]){fill:currentColor!important}
.back-stock svg [stroke]:not([stroke="none"]){stroke:currentColor!important}
.back-stock svg text{fill:currentColor!important}


.vacant{align-items:flex-end}
.vacancy{display:flex;align-items:center;justify-content:center;width:80%;height:70%;max-height:55px;border-radius:9px;border:1px dashed #f6d7a354;background:#55311b13;color:#f4d39b55;font-size:19px;pointer-events:none}
.chosen{background:#ffe2a62b;box-shadow:inset 0 0 0 2px #ffe7a1}
.chosen .front-stock svg{transform:translateY(-3px)}
.drop-target{background:#fff0a840;outline:2px solid #ffe7a1;outline-offset:-2px}
.drag-source .front-stock{opacity:.16}
.drag-ghost{position:fixed;z-index:25;pointer-events:none;filter:drop-shadow(0 7px 3px #43200a70);transform:none}
.drag-ghost svg{width:100%;height:100%}
.matched-cell .front-stock svg{animation:match .35s both}
.newly-revealed{animation:reveal-stock .3s both}
.floor{position:absolute;bottom:0;height:16px;left:0;right:0;background:repeating-linear-gradient(110deg,transparent 0 60px,#a877482a 61px 62px),linear-gradient(#c49360,#edc896)}
.next-stage{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;width:min(230px,85%);min-height:46px;border:0;border-bottom:3px solid #6b865b;border-radius:12px;background:#a4b68e;color:#263e2c;font-size:14px;font-weight:bold}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
dialog{border:1px solid #e5ca9d;border-radius:22px;padding:24px 20px;width:min(88vw,360px);max-height:calc(var(--app-height) - 24px);overflow:auto;color:#593c2c;background:#fff8e8;box-shadow:0 20px 80px #34200b55;touch-action:pan-y;overscroll-behavior:contain}
dialog::backdrop{background:#38261180;backdrop-filter:blur(4px)}
dialog h2{text-align:center;font-size:21px;margin:4px 0 16px}
dialog p,.dialog-copy{font-size:13px;line-height:1.8}
/* Keep editable text at a readable size; focusing a small iPhone input zooms. */
.stage-number-input{min-width:0;flex:1;min-height:44px;font:inherit;font-size:16px;line-height:1.4;padding:10px}
dialog .badge{text-align:center;font-size:40px;margin:0;color:#b48a3c}
.dialog-actions,.menu-actions{display:grid;gap:9px;margin-top:18px}
.dialog-actions button,.menu-actions button{border:0;border-bottom:3px solid #977442;border-radius:11px;background:#a4b68e;color:#263e2c;min-height:46px;padding:8px 10px;font-size:13px;font-weight:700}
.dialog-actions .secondary,.menu-actions .secondary{background:#e9d8b8;border-bottom-color:#c2aa83;color:#72583e}
.menu-actions #reset-stage{font-size:11px;background:#efe3cc;color:#8e7049;border-bottom-color:#d0b98d}
.reward{border-radius:14px;text-align:center;padding:12px;background:#f2e2b9;color:#a16f1d;font-size:28px;font-weight:bold}
.reward small{display:block;font-size:10px;color:#8e7049;font-weight:normal;margin-top:5px}
.unlock{background:#e4edda;border-radius:12px;padding:11px;color:#526946}
.theme-list{display:grid;gap:7px}
.theme-choice{display:flex;align-items:center;gap:11px;text-align:left;min-height:56px;padding:7px 9px;background:#fffaf0;border:1px solid #ddc8a6;border-radius:11px;color:#674b35;font-size:12px}
.theme-choice.selected{border:2px solid #84a16f}
.theme-choice:disabled{opacity:.48}
.theme-choice small{display:block;font-size:10px;margin-top:4px}
.swatch{width:36px;height:32px;border:5px solid #d59950;background:#bc824d;border-radius:5px;box-shadow:inset 2px 3px 3px #0003}
.swatch.sage{border-color:#a8bb8d;background:#657d5b}
.swatch.rose{border-color:#d9a1a0;background:#a36e6d}
.swatch.night{border-color:#748397;background:#38495d}
.collection-note{font-size:10px!important;color:#967d61}
#effects{position:fixed;inset:0;pointer-events:none;z-index:10;overflow:hidden}
.spark{position:fixed;color:#e6ac37;font-size:23px;animation:spark .75s both}
body[data-theme="sage"] .cabinet{border-color:#a8bb8d;border-top-color:#c9d8ae;border-right-color:#71845e;background:#657d5b}
body[data-theme="sage"] .shelf-row{background:linear-gradient(100deg,#596e4e,#7e936c,#596e4e);border-bottom-color:#a8bb8d;border-top-color:#c9d8ae}
body[data-theme="sage"] .shelf-row:after{background:linear-gradient(90deg,#c9d8ae,#8d9f73)}
body[data-theme="sage"] .back-stock{color:#263421;opacity:.35}
body[data-theme="rose"] .cabinet{border-color:#d9a1a0;border-top-color:#f0c1b9;border-right-color:#b17c79;background:#a36e6d}
body[data-theme="rose"] .shelf-row{background:linear-gradient(100deg,#966366,#b57f7b,#966366);border-bottom-color:#d9a1a0;border-top-color:#f0c1b9}
body[data-theme="rose"] .shelf-row:after{background:linear-gradient(90deg,#f0c1b9,#c18d88)}
body[data-theme="night"] .cabinet{border-color:#748397;border-top-color:#9eafc1;border-right-color:#4b5a6e;background:#38495d}
body[data-theme="night"] .shelf-row{background:linear-gradient(100deg,#304054,#52627a,#304054);border-bottom-color:#748397;border-top-color:#9eafc1}
body[data-theme="night"] .shelf-row:after{background:linear-gradient(90deg,#9eafc1,#66788f)}
body[data-theme="night"] .back-stock{color:#f3e4c9;opacity:.42}
@keyframes match{50%{transform:scale(1.1)}to{transform:scale(.1);opacity:0}}
@keyframes reveal-stock{from{transform:translateY(-9px) scale(.92);filter:brightness(.7)}to{transform:none;filter:brightness(1)}}
@keyframes spark{to{transform:translate(var(--dx),var(--dy)) rotate(90deg);opacity:0}}
@media(max-width:340px){.game{padding-left:8px;padding-right:8px;gap:5px}.status{gap:5px}.stage{font-size:9px;padding:5px 7px}.icon-button{width:36px;height:36px;flex-basis:36px}.campaign{height:30px}.campaign button{height:30px}.scene{padding-top:10px;padding-bottom:12px}}
@media(orientation:landscape) and (max-height:480px){.game{max-width:800px;padding-top:4px;padding-bottom:4px;gap:4px}.hud{display:flex;align-items:center;gap:12px}.status{flex:1}.campaign{flex:1;margin-top:0}.cabinet{grid-template-columns:1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr))}.scene{padding-top:8px;padding-bottom:10px}.shelf-row{border-right:5px solid #d59950}.shelf-row:nth-child(-n+2){border-bottom-width:8px}.shelf-row:nth-child(n+3){border-bottom:0}.shelf-row:after{bottom:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

#timer{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;color:#805b37}#timer.urgent{color:#b33830}.campaign{gap:6px}#moves{font-size:11px}

.compartment{position:relative}.shelf-lock{position:absolute;inset:2px;z-index:8;display:grid;place-items:center;background:#533c2c55;border-radius:4px;pointer-events:auto}.locked .sort-position{filter:brightness(.64);pointer-events:none}.locked .sort-slot:disabled{opacity:1}.lock-chain{position:absolute;width:106%;height:6px;transform:rotate(25deg);border:2px dashed #f6d47c;background:#9c6c2f;box-shadow:0 1px 3px #543618}.lock-chain:after{content:"";position:absolute;width:100%;height:6px;left:-2px;top:-2px;transform:rotate(-50deg);border:2px dashed #f6d47c;background:#9c6c2f}.lock-label{position:relative;z-index:1;background:#fff1cb;color:#775027;border:2px solid #d4a851;box-shadow:0 2px 5px #54361866;border-radius:20px;padding:6px 8px;font-size:12px;font-weight:800;white-space:nowrap}.just-unlocked{animation:unlock-glow .9s ease-out}@keyframes unlock-glow{0%{box-shadow:inset 0 0 0 5px #ffdb67;background:#f7d787}100%{box-shadow:inset 0 0 0 0 transparent}}.new-goods{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.new-goods figure{margin:4px 0 14px;display:grid;justify-items:center;gap:8px}.new-goods svg{width:130px;height:145px;filter:drop-shadow(0 8px 8px #7f593333)}.new-goods figcaption{font-size:15px;font-weight:700}

/* Stage scenery changes without changing slot addresses or drag targets. */
.scene[data-auto="true"]{background:linear-gradient(105deg,var(--shelf-light),var(--shelf-frame) 60%,var(--shelf-edge))}.scene[data-auto="true"] .cabinet{border-color:var(--shelf-frame);border-top-color:var(--shelf-light);border-left-color:var(--shelf-light);border-right-color:var(--shelf-edge);background:var(--shelf-dark)}.scene[data-auto="true"] .shelf-row{background:linear-gradient(105deg,var(--shelf-dark),var(--shelf-back) 55%,var(--shelf-dark));border-bottom-color:var(--shelf-frame);border-top-color:var(--shelf-light)}.scene[data-auto="true"] .shelf-row:after{background:linear-gradient(90deg,var(--shelf-light),var(--shelf-frame))}.scene[data-auto="true"] .floor{background:linear-gradient(var(--shelf-frame),var(--shelf-light))}.scene[data-auto="true"] .back-stock{color:#302821;opacity:.32}
.scene[data-design="arched"]{border-radius:70px 70px 12px 12px;padding-top:15px}.scene[data-design="arched"] .cabinet{border-radius:42px 42px 5px 5px;overflow:hidden}.single-cell{grid-template-columns:1fr!important;padding-left:25%;padding-right:25%}.single-cell:after{display:none}.single-cell .compartment{border-left:2px solid var(--shelf-frame,#dca361);border-right:2px solid var(--shelf-frame,#dca361)}
.scene[data-design="cubes"],.scene[data-design="staggered"]{background:transparent;box-shadow:none;border-radius:0;padding-left:1px;padding-right:1px}.scene[data-design="cubes"]:before,.scene[data-design="staggered"]:before{display:none}.scene[data-design="cubes"] .cabinet,.scene[data-design="staggered"] .cabinet{border:0;background:none;box-shadow:none;gap:7px}.scene[data-design="cubes"] .shelf-row,.scene[data-design="staggered"] .shelf-row{border:0;box-shadow:none;background:none;gap:6px}.scene[data-design="cubes"] .shelf-row:after,.scene[data-design="staggered"] .shelf-row:after{display:none}.scene[data-design="cubes"] .compartment,.scene[data-design="staggered"] .compartment{padding:2px 0;border:5px solid var(--shelf-frame,#dca361);border-top-color:var(--shelf-light,#f5cd8f);border-right-color:var(--shelf-edge,#a76b39);background:linear-gradient(105deg,var(--shelf-dark,#82512f),var(--shelf-back,#b47b49));box-shadow:2px 3px 4px #50351c44,inset 0 6px 8px #30211344;border-radius:5px}.scene[data-design="cubes"] .floor,.scene[data-design="staggered"] .floor{display:none}.scene[data-design="staggered"] .cabinet{padding-top:5px;padding-bottom:5px}.scene[data-design="staggered"] .shelf-row:nth-child(odd) .compartment:first-child,.scene[data-design="staggered"] .shelf-row:nth-child(even) .compartment:last-child{transform:translateY(-5px)}.scene[data-design="staggered"] .shelf-row:nth-child(odd) .compartment:last-child,.scene[data-design="staggered"] .shelf-row:nth-child(even) .compartment:first-child{transform:translateY(5px)}
@media(orientation:landscape) and (max-height:480px){.single-cell{padding-left:0;padding-right:0}.scene[data-design="arched"]{padding-top:8px;border-radius:24px 24px 8px 8px}.scene[data-design="arched"] .cabinet{border-radius:12px}.scene[data-design="staggered"] .compartment{transform:none!important}}

/* A clear game HUD: level and collection, a central clock, and pause. */
.game{background:linear-gradient(#f6e4ce,#fbe9c6 55%,#f0dcc0)}.hud{padding:5px 0 0}.status{display:grid;grid-template-columns:1fr 1.05fr 1fr;height:60px;gap:8px;align-items:center}.level-stack{display:grid;gap:3px;justify-items:start}.stage{padding:0 4px;background:none;color:#885a37;font-size:12px;letter-spacing:.7px}.level-stack #collection{margin:0;min-height:24px;min-width:75px;padding:2px 12px;background:#e7cfb3;border:1px solid #c8a584;border-radius:16px;box-shadow:inset 0 2px 2px #fff8e580;font-size:12px}.clock-face{border-radius:14px;padding:6px 8px;text-align:center;background:linear-gradient(#fff8ed,#efd7ba);border:1px solid #c6a184;box-shadow:0 3px 0 #c3a27c55,inset 0 2px 1px #fff9ee}#timer{font-size:31px;line-height:1.2;color:#87451f;text-shadow:1px 2px #fff9e7;letter-spacing:.5px}.hud-actions{display:flex;justify-content:flex-end;gap:6px}.hud-actions .icon-button{width:34px;height:38px;flex-basis:34px;font-size:22px;border-radius:12px}.hud-actions .pause-button{width:40px;height:44px;flex-basis:40px;font-size:27px;font-weight:900;background:linear-gradient(#70b6ee,#3786cc);border-color:#357baf;border-bottom:3px solid #28679f;color:#fff8e9;text-shadow:0 2px #28679f;box-shadow:inset 0 2px 2px #c5e8ff80,0 2px 2px #7b5c3626}.campaign{height:27px;margin-top:4px}.campaign button{height:25px;min-width:44px;border-radius:8px;padding:2px 7px;background:#f5e5d0}.campaign #progress{font-size:13px;color:#73543c}.meter{height:5px;background:#d8c1a2;box-shadow:inset 0 1px 2px #815d3326}#bar{background:linear-gradient(#b7ce78,#7c9d48)}.scene{align-self:center}.scene[data-design="classic"]{border-radius:10px}.scene[data-design="classic"] .cabinet{border-radius:2px}.scene[data-design="cubes"] .compartment,.scene[data-design="staggered"] .compartment{border-radius:1px;box-shadow:3px 5px 0 #77533133,inset 0 7px 9px #30211355}.scene[data-design="cubes"] .cabinet,.scene[data-design="staggered"] .cabinet{gap:9px}
@media(max-width:340px){.status{gap:5px}.stage{font-size:10px}#timer{font-size:27px}.hud-actions{gap:4px}.hud-actions .icon-button{width:30px;flex-basis:30px;height:34px}.hud-actions .pause-button{width:35px;flex-basis:35px;height:40px}.clock-face{padding:6px 4px}.campaign{height:25px}.campaign #progress{font-size:12px}}
@media(orientation:landscape) and (max-height:480px){.hud{padding:0;gap:12px}.status{height:46px;gap:8px;flex:1.6}.campaign{flex:1;height:30px;margin:0}.stage{font-size:9px}.level-stack #collection{min-height:20px;font-size:10px;padding:1px 9px}.clock-face{padding:3px 5px}#timer{font-size:27px}.hud-actions .icon-button{height:32px}.hud-actions .pause-button{height:38px}.campaign #progress{font-size:11px}.scene{align-self:start}}

.compartment.drop-compartment{outline:2px solid #ffe5a0;outline-offset:-3px;box-shadow:inset 0 0 22px #fff2b64d}

.shelf-row{grid-template-columns:repeat(var(--row-columns,2),minmax(0,1fr))}.scene[data-columns="3"] .shelf-row:after{display:none}.scene[data-columns="3"] .compartment{padding-left:1px;padding-right:1px}.scene[data-columns="3"] .compartment:not(:last-of-type){border-right:4px solid var(--shelf-frame,#dca361)}
.scene[data-dense="true"]{max-height:calc(var(--shelf-rows)*88px + 16px);padding-top:7px;padding-bottom:9px}.scene[data-dense="true"] .cabinet{border-width:5px;border-bottom-width:6px}.scene[data-dense="true"] .shelf-row{border-bottom-width:4px}.scene[data-dense="true"] .shelf-row:last-child{border-bottom:0}.scene[data-dense="true"] .compartment{padding-top:1px;padding-bottom:1px}.scene[data-dense="true"] .sort-slot{height:100%;max-height:none;bottom:0}.scene[data-dense="true"] .front-stock{height:calc(100% - 7px);max-height:72px}.scene[data-dense="true"] .front-stock svg{max-height:72px}.scene[data-dense="true"] .back-stock{height:calc(100% - 7px);max-height:72px;transform:translate(3px,-8px) scale(.94)}.scene[data-dense="true"] .back-stock svg{max-height:72px}.scene[data-dense="true"] .lock-label{font-size:10px;padding:4px 5px}.scene[data-dense="true"][data-design="cubes"] .cabinet,.scene[data-dense="true"][data-design="staggered"] .cabinet{border:0;gap:4px;padding-top:3px;padding-bottom:3px}.scene[data-dense="true"][data-design="cubes"] .shelf-row,.scene[data-dense="true"][data-design="staggered"] .shelf-row{border:0;gap:4px}.scene[data-dense="true"][data-design="cubes"] .compartment,.scene[data-dense="true"][data-design="staggered"] .compartment{border-width:3px;padding:0}.scene[data-dense="true"][data-design="staggered"] .compartment{transform:none!important}.scene[data-dense="true"][data-design="arched"]{padding-top:7px;border-radius:24px 24px 8px 8px}.scene[data-dense="true"][data-design="arched"] .cabinet{border-radius:12px 12px 2px 2px}
@media(orientation:landscape) and (max-height:480px){.cabinet{grid-template-rows:repeat(var(--landscape-rows,2),minmax(0,1fr))}.scene[data-dense="true"]{max-height:none;padding-top:4px;padding-bottom:5px}.scene[data-columns="3"] .compartment:not(:last-of-type){border-right-width:3px}}

@media(orientation:landscape) and (max-height:480px){.game{width:min(100%,800px)}}

/* Keep the original artwork proportions, including while dragging. */
.front-stock svg,.back-stock svg{height:100%;max-height:78px}.scene[data-dense="true"] .front-stock svg,.scene[data-dense="true"] .back-stock svg{height:100%;max-height:72px}.drag-ghost svg{height:100%;max-height:100%}.compartment{column-gap:0}

/* Varied silhouettes for 3-column boards, with stable cell addresses. */
.scene[data-columns="3"] .single-cell{padding:0;grid-template-columns:repeat(6,minmax(0,1fr))!important}.scene[data-columns="3"] .shelf-row{grid-template-columns:repeat(6,minmax(0,1fr))}.scene[data-columns="3"]{max-height:calc(var(--shelf-rows)*100px + 16px)}
.scene[data-form]:not([data-form="grid"]){background:transparent;box-shadow:none;border-radius:0;padding-left:1px;padding-right:1px}.scene[data-form]:not([data-form="grid"]):before{display:none}.scene[data-form]:not([data-form="grid"]) .cabinet{border:0;box-shadow:none;background:none;gap:4px;padding:7px 0}.scene[data-form]:not([data-form="grid"]) .shelf-row{border:0;box-shadow:none;background:none;gap:0 3px}.scene[data-form]:not([data-form="grid"]) .shelf-row:after{display:none}.scene[data-form]:not([data-form="grid"]) .compartment{border:3px solid var(--shelf-frame,#dca361);border-top-color:var(--shelf-light,#f5cd8f);border-right-color:var(--shelf-edge,#a76b39);background:linear-gradient(105deg,var(--shelf-dark,#82512f),var(--shelf-back,#b47b49));box-shadow:2px 3px 3px #50351c33,inset 0 6px 8px #30211344;padding:0;border-radius:2px}.scene[data-form]:not([data-form="grid"]) .floor{display:none}.scene[data-form="towers"] .compartment:nth-child(2){transform:translateY(-6px)!important}.scene[data-form="towers"] .compartment:not(:nth-child(2)){transform:translateY(3px)!important}.scene[data-form="islands"] .compartment{border-radius:9px}.scene[data-form="islands"] .cabinet{gap:7px}
#assist{margin-left:5px;font-weight:700;color:#735d35}#hint-note{font-size:9px;color:#8c6b30;max-width:105px}.hint-source{outline:3px solid #fff1a3;outline-offset:-2px;animation:hint-glow .8s alternate infinite}.hint-target{background:#fff2a954;outline:3px solid #c7e5ad;outline-offset:-2px;animation:hint-glow .8s alternate infinite}@keyframes hint-glow{to{filter:brightness(1.25)}}.aid-list{display:grid;gap:9px}.aid-list button{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px;width:100%;min-height:50px;padding:10px;border:1px solid #d3bd91;border-radius:11px;color:#654b32;background:#f5e6c9;text-align:left;font-size:13px}.aid-list button b{font-size:11px;color:#9b722b}.aid-list small{flex-basis:100%;font-size:10px;color:#967e5e;line-height:1.5}.aid-list .rescue-choice{background:#e7edd9;border-color:#b4c59f}.shop-note{font-size:11px!important;color:#8c7559}.shop-balance{text-align:center;font-weight:700;font-size:20px!important;color:#a57628}
@media(max-width:340px){#hint-note{max-width:68px;font-size:8px}#assist{font-size:9px;padding:2px 5px}.scene[data-form="islands"] .cabinet{gap:4px}}
@media(orientation:landscape) and (max-height:480px){.scene[data-columns="3"]{max-height:none}.scene[data-form]:not([data-form="grid"]) .cabinet{padding-top:4px;padding-bottom:4px}.scene[data-form="towers"] .compartment{transform:none!important}#hint-note{display:none}}

/* Compact shelves, and a clipped, higher rear layer that cannot leak below the floor. */
.scene{max-height:calc(var(--shelf-rows,3)*90px + 20px)}.scene[data-columns="3"]{max-height:calc(var(--shelf-rows)*78px + 20px)}.compartment{overflow:hidden}.scene[data-columns] .back-stock{transform:translate(4px,max(-20px,-34%)) scale(.94);opacity:.46}.scene[data-dense="true"] .front-stock{height:calc(100% - 9px);max-height:68px}.scene[data-dense="true"] .front-stock svg{max-height:68px}.chosen .front-stock svg{transform:none}
.supply-spot{position:relative;min-height:0;min-width:0;isolation:isolate;touch-action:none}.supply-spot:before{content:"";position:absolute;left:20%;right:20%;bottom:15px;height:25%;background:linear-gradient(#dfbc85aa,#c99150);border:2px solid #d1a164;box-shadow:2px 3px 2px #6d4a2833;pointer-events:none}.supply-spot .supply-source{height:100%;max-height:none;bottom:0;padding:0 18% 18px;z-index:2}.scene .supply-spot .front-stock{height:100%;max-height:72px}.supply-count{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:700;background:#795835;color:#fff3cc;border-radius:5px;padding:1px 6px;z-index:3;white-space:nowrap;pointer-events:none}.supply-track{position:absolute;bottom:0;left:8%;right:8%;height:7px;border:1px solid #577d7d;border-radius:7px;background:#d7cdb4;overflow:hidden;z-index:3;pointer-events:none}.supply-track i{display:block;height:100%;background:linear-gradient(#6fd8da,#3bafb7);transition:width .2s}.supply-spot.exhausted{opacity:.4}.scene[data-form="supplies"] .cabinet{gap:4px}.scene[data-form="supplies"] .supply-spot{overflow:hidden}
@media(orientation:landscape) and (max-height:480px){.scene[data-columns="3"]{max-height:none}}

/* The finite dispenser sits outside the shelf frame; all eight rows stay onscreen. */
.scene[data-supply="true"]{padding-bottom:76px;max-height:calc(var(--shelf-rows)*78px + 90px);background:transparent;box-shadow:none}.scene[data-supply="true"]:before,.scene[data-supply="true"] .floor{display:none}.scene .external-supply{position:absolute;left:calc(50% - 48px);bottom:-67px;width:96px;height:60px;overflow:visible}.scene .external-supply .supply-source{height:60px;padding:0 20px 15px}.scene .external-supply .front-stock{height:46px;max-height:46px}.external-supply .supply-count{bottom:6px}.external-supply .supply-track{height:5px}.scene[data-rows="8"] .back-stock{transform:translate(3px,-12px) scale(.94)}
@media(max-height:600px){.scene[data-supply="true"]{padding-bottom:56px}.scene .external-supply{bottom:-49px;height:44px}.scene .external-supply .supply-source{height:44px;padding-bottom:10px}.scene .external-supply .front-stock{height:33px}.scene .external-supply .supply-count{font-size:8px;bottom:4px}.scene[data-rows="8"] .lock-label{font-size:8px;padding:2px}.scene[data-rows="8"] .back-stock{transform:translate(2px,-8px) scale(.94)}}

.scene[data-supply="true"] .cabinet{overflow:visible}
@media(max-height:550px) and (orientation:portrait){.game{gap:4px;padding-top:4px}.hud{padding-top:0}.status{height:44px}.campaign{margin-top:2px;height:25px}.scene[data-dense="true"]{padding-top:4px}.scene[data-form]:not([data-form="grid"]) .cabinet{padding-top:0;padding-bottom:0;gap:2px}.scene[data-form]:not([data-form="grid"]) .compartment{border-width:2px}}

.scene .back-stock.hint-source{z-index:3;opacity:1;color:#fff3a1}
.hint-deep{outline:3px solid #fff1a3;outline-offset:-3px;animation:hint-glow .8s alternate infinite}

#combo{min-height:15px;text-align:right;font-size:10px;line-height:15px;color:#735d35;font-weight:700}

.aid-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:3px 0 0}
.aid-toolbar button{display:flex;align-items:center;justify-content:center;gap:5px;min-height:40px;padding:2px 4px;border:1px solid #dec6a0;border-radius:9px;background:#fff6e7;color:#79552e;font:inherit;font-size:10px;font-weight:700;line-height:1.2;white-space:nowrap;touch-action:manipulation}
.aid-toolbar .aid-icon{font-size:19px;line-height:1}
.aid-toolbar small{display:block;margin-top:2px;font-size:9px;color:#735d35}
.aid-toolbar button:disabled{opacity:.48}
.game>.aid-toolbar.aid-footer button{position:relative}
.game>.aid-toolbar.aid-footer button>.aid-badge{position:absolute;right:0;bottom:0;z-index:1;display:flex;align-items:center;justify-content:center;min-width:22px;height:21px;box-sizing:border-box;padding:0 4px;border:2px solid #fff8e9;border-radius:11px;background:#3e6c58;color:#fffcef;box-shadow:0 1px 2px #382c2633;font:800 12px/1 system-ui,sans-serif;letter-spacing:0;pointer-events:none}
.game>.aid-toolbar.aid-footer button>.aid-badge[data-kind="price"]{min-width:29px;background:#f0cf79;color:#62431e;font-size:11px}
.game>.aid-toolbar.aid-footer button>.aid-badge[data-kind="price"]::after{content:'✦';margin-left:2px;font-size:8px}
.game>.aid-toolbar.aid-footer button>.aid-badge[data-empty="true"]{background:#776d63}

.campaign{height:19px;gap:5px}.campaign #combo{white-space:nowrap}.campaign #hint-note{min-width:0}
@media (min-height:551px) and (max-height:600px){
 .status{height:50px}
 .scene[data-form]:not([data-form="grid"]) .cabinet{gap:2px}
}

[data-background="garden"]{background:radial-gradient(ellipse at 12% 0,#fff9d9 0,transparent 58%),radial-gradient(circle at 4px 4px,#91ad8429 1.5px,transparent 2px) 0 0/18px 18px,linear-gradient(#e2eed3,#f5edcc 68%,#c3d7b4)}
[data-background="starlight"]{background:radial-gradient(circle at 7px 8px,#fff9e3 1px,transparent 2px) 0 0/27px 29px,radial-gradient(circle at 12px 16px,#fff9e3 1px,transparent 2px) 9px 13px/42px 47px,linear-gradient(#e6e2f1,#c6c7e2 68%,#aab0d0)}
.cosmetic-choice svg,.cosmetic-swatch{width:24px;height:25px;flex:none}
.cosmetic-swatch{display:grid;place-items:center;border:1px solid #d5c0a3;border-radius:6px}
.cosmetic-swatch[data-background="plain"]{background:#f6e4ce}
.level-stack{grid-template-columns:max-content minmax(0,1fr);column-gap:2px}
.level-stack #stage,.level-stack #collection{grid-column:1}
#ornament{grid-column:2;grid-row:1 / span 2;align-self:center;max-width:29px;width:100%;pointer-events:none}
#ornament svg{display:block;width:100%;height:auto}
.supply-spot:not(.exhausted){
 border-radius:10px;
 box-shadow:inset 0 0 0 2px #bd842e;
}
.supply-spot:not(.exhausted) .supply-count{
 background:#62441f;
 font-size:11px;
}
@media (prefers-reduced-motion:no-preference){
 .supply-spot:not(.exhausted){animation:supply-pulse 1.8s ease-in-out infinite alternate}
}
@keyframes supply-pulse{
 from{box-shadow:inset 0 0 0 2px #bd842e}
 to{box-shadow:inset 0 0 0 2px #c88c30,inset 0 0 16px #efb34b95}
}
.game[data-background]:not([data-background="plain"]) .scene .back-stock:not(.hint-source){
 color:#30251d;
 opacity:.64;
}
.game[data-background]:not([data-background="plain"]) .scene[data-palette="night"] .back-stock:not(.hint-source){
 color:#d7e4f5;
 opacity:.82;
}
.game[data-background]:not([data-background="plain"]) .back-stock:not(.hint-source) svg{
 filter:drop-shadow(0 1px 1px #171a2390);
}

.scene[data-rows="9"] .back-stock{transform:translate(3px,-10px) scale(.94)}
@media(max-height:550px){
 .scene[data-rows="9"] .back-stock{transform:translate(2px,-7px) scale(.94)}
 .scene[data-rows="9"] .lock-label{font-size:8px;padding:2px}
}

.scene{align-self:start}
.meter.time-critical #bar{background:#cf3636;animation:time-warning .7s ease-in-out infinite alternate}
@keyframes time-warning{from{opacity:1}to{opacity:.35}}
@media(prefers-reduced-motion:reduce){.meter.time-critical #bar{animation:none;opacity:1}}

.game{grid-template-rows:auto 12px minmax(0,1fr)}
.meter{height:12px;border-radius:7px}

#reload-game.is-loading{display:flex;align-items:center;justify-content:center;gap:9px;opacity:1;background:#e8dfca;cursor:wait}
#reload-game.is-loading::before{content:"";width:15px;height:15px;border:2px solid #b7a485;border-top-color:#745736;border-radius:50%;animation:reload-spin .7s linear infinite}
@keyframes reload-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#reload-game.is-loading::before{animation:none;border-style:dotted}}

#obstacle-toolbar{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:25px;margin-top:4px}
#obstacle-toolbar[hidden],#wait-turn[hidden]{display:none}
#obstacle-toolbar button{border:1px solid #c7ad7b;border-radius:8px;background:#fff4d7;color:#75502e;padding:4px 8px;font-size:11px;min-height:26px;font-weight:700}
#wait-turn{white-space:nowrap}
.obstacle-label{position:absolute;top:2px;left:3px;z-index:7;max-width:calc(100% - 6px);border:1px solid #b7955c;border-radius:5px;background:#fff1cf;color:#64472c;padding:1px 3px;font-size:9px;line-height:1.3;font-weight:700;pointer-events:none;white-space:nowrap}
.obstacle-label[hidden]{display:none}
.obstacle-neighbor{outline:2px dashed #f9d277;outline-offset:-5px}
.compartment[data-obstacle="ice"]{box-shadow:inset 0 0 14px 3px #c2f2ff}
.compartment[data-obstacle="ice"] .front-stock{filter:saturate(.4) hue-rotate(20deg)}
.compartment[data-obstacle="wrapped"] .front-stock{filter:brightness(.65) sepia(.8)}
.compartment[data-obstacle="shutter"].obstacle-closed:after{content:"";position:absolute;inset:3px;z-index:6;pointer-events:none;background:repeating-linear-gradient(0deg,#788c9a80 0 5px,#b7c7cf44 5px 9px);border:2px solid #97adb6}
.compartment[data-obstacle="sandwich"].obstacle-closed{box-shadow:inset 0 0 10px #dfb174}
.compartment.misty .back-stock{visibility:hidden}
.scene[data-rows="9"] .obstacle-label{font-size:8px;top:0;padding:0 2px}
.compartment[data-obstacle="hourglass"]::after{content:"";position:absolute;inset:0;z-index:6;border:2px solid #b94927;border-radius:inherit;pointer-events:none}
.compartment[data-obstacle="hourglass"] .obstacle-label{border-color:#8e2e18;background:#a63b20;color:#fff9e9;padding:1px 5px;font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}
.scene[data-rows="9"] .compartment[data-obstacle="hourglass"] .obstacle-label{padding:0 4px;font-size:10px}
#obstacle-toast{position:fixed;left:50%;top:calc(env(safe-area-inset-top) + 190px);transform:translateX(-50%);z-index:30;max-width:90vw;width:max-content;border:1px solid #c9ac73;border-radius:12px;padding:10px 14px;background:#fff5ddf5;box-shadow:0 5px 20px #49372133;color:#72502f;font-size:13px;font-weight:700;pointer-events:none;text-align:center}
#obstacle-toast[hidden]{display:none}
.new-mechanism{padding:12px;border:1px solid #d5bb87;border-radius:12px;background:#f4e7c8}
.album-link{width:100%;margin-bottom:14px;background:#e8eddc}.album-link b{margin-left:auto;font-size:12px}
.album-count{text-align:center;font-size:23px!important;font-weight:700;margin:0;color:#8a683a}
.album-note{font-size:11px!important;text-align:center}.album-filter{font-size:12px;display:flex;align-items:center;gap:7px;margin:10px 0}
.album-topbar{position:sticky;top:0;z-index:12;display:flex;justify-content:flex-end;height:44px;margin-bottom:-44px;pointer-events:none}
#album-close{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:1px solid #bca684;border-radius:50%;background:#fff9ec;color:#62492d;font-size:30px;line-height:1;box-shadow:0 1px 4px #49372126;pointer-events:auto;touch-action:manipulation}
#album-close:focus-visible{outline:3px solid #39754b;outline-offset:2px}
.menu-actions .mode-switch.mode-infinity,.dialog-actions .mode-switch.mode-infinity{background:#76526e;border-bottom-color:#503449;color:#fff8ee}
.menu-actions .mode-switch.mode-timed,.dialog-actions .mode-switch.mode-timed{background:#3b7173;border-bottom-color:#254b4d;color:#fff8ee}
.mode-switch:focus-visible{outline:3px solid #c69b42;outline-offset:2px}
.album-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.album-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:0;border:1px solid #dbc7a5;border-radius:12px;background:#fffcf4;color:#644c36;padding:6px 3px;min-height:119px}
.album-card svg{width:100%;height:76px;flex-shrink:0}.album-card span{font-size:10px;line-height:1.3;min-height:26px;display:grid;place-items:center}.album-card small{font-size:9px;color:#9b825d}
.album-card.unknown{background:#eee7d9;opacity:1}.album-card.unknown svg{filter:brightness(0);opacity:.12}
.album-pages{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:14px;font-size:12px}.album-pages button{border:1px solid #cbb28a;background:#f3e4c7;border-radius:8px;width:45px;min-height:36px;color:#6f5238}
.album-detail{display:flex;justify-content:center}.album-detail svg{width:150px;height:180px}

/* Mechanism help lives in the pause menu; it reserves no gameplay height. */
#obstacle-info{font-size:12px}
.compartment.relation-wrapped{outline:3px dashed #39754b;outline-offset:-4px}
.compartment[data-obstacle="wrapped"]{outline:3px solid #39754b;outline-offset:-4px}
.compartment.relation-sandwich{outline:3px dashed #326f9d;outline-offset:-4px}
.compartment[data-obstacle="sandwich"]{outline:3px solid #326f9d;outline-offset:-4px}
.compartment.relation-wrapped.relation-sandwich{outline-color:#39754b;box-shadow:inset 0 0 0 1px #fffbed,inset 0 0 0 5px #326f9d}
.compartment[data-obstacle="wrapped"] .obstacle-label{background:#e8f4df;border-color:#88aa7a;color:#3f623a}
.compartment[data-obstacle="sandwich"] .obstacle-label{background:#e4f2f7;border-color:#86a8bd;color:#365d73}
.item-peek{position:fixed;z-index:12;pointer-events:none;border:1px solid #cbb88e;background:#fff8e9f5;color:#5e4934;padding:5px 9px;border-radius:9px;box-shadow:0 3px 9px #43331d25;font-size:12px;font-weight:700;max-width:calc(100vw - 16px)}
.item-peek[hidden]{display:none}
.album-genre{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0;font-size:12px}
.album-genre select{max-width:72%;font:inherit;border:1px solid #ceb992;border-radius:8px;background:#fffaf0;color:#674d34;padding:7px;min-height:36px}
.tutorial-choice{display:grid;gap:5px;width:100%;text-align:left;border:1px solid #d5bd96;border-radius:12px;padding:12px;margin:8px 0;background:#fffaf0;color:#624b35;font-size:12px}
.tutorial-choice span{line-height:1.7}.tutorial-choice small{color:#6e8258;font-weight:700}

/* Raster alpha follows the same rear silhouette and hint colors as SVG goods. */
.back-stock svg.puffy-art image{filter:var(--puffy-flat)}
.back-stock:has(svg.puffy-art){filter:drop-shadow(0 0 1px #fff9)}
.back-stock.hint-source svg.puffy-art image{filter:var(--puffy-flat)}

/* Empty space stays visually quiet; the full slot remains a drop/tap target. */
.vacancy{display:none!important}

.help-frame{display:block;width:100%;height:clamp(140px,calc(var(--app-height) - 235px),460px);border:0;border-radius:10px;background:#fff9ed}

/* Use more shelf height for the retro trial without changing slot hit areas.
   Natural-outline SVG viewBoxes keep the same horizontal and vertical scale. */
.scene[data-dense="true"] .front-stock:has(>svg.retro-art){height:calc(100% - 4px);max-height:74px}
.scene[data-dense="true"] .front-stock svg.retro-art{max-height:74px}
/* Leave room for the countdown while keeping the whole slot tappable. */
.scene .compartment[data-obstacle="hourglass"] .front-stock{max-height:min(74px,calc(100% - 21px))}
.scene[data-rows="9"] .compartment[data-obstacle="hourglass"] .front-stock{max-height:min(74px,calc(100% - 16px))}

/* A single three-slot tray stays directly below the unchanged main layout. */
.scene[data-extra-shelf][data-form]{--extra-shelf-reserve:56px;max-height:calc(var(--shelf-rows,3)*100px + 16px + var(--extra-shelf-reserve));padding-bottom:calc(var(--extra-shelf-reserve) + 9px)}
.scene[data-extra-shelf][data-form] .cabinet{overflow:visible}
.scene[data-extra-shelf][data-form] .cabinet>.extra-shelf{position:absolute;left:50%;bottom:calc(-1*var(--extra-shelf-reserve));transform:translateX(-50%)!important;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:clamp(132px,45%,186px);height:48px;min-height:48px;padding:0;border:2px solid transparent!important;border-radius:0;background:none!important;box-shadow:none!important;z-index:4}
/* The transparent 2px inset preserves the established three-slot hit geometry. */
.scene[data-extra-shelf][data-form] .cabinet>.extra-shelf::after{content:"";position:absolute;left:-2px;right:-2px;bottom:-2px;height:5px;border-radius:1px;background:linear-gradient(var(--skin-light,var(--shelf-light,#ead9ba)) 0 32%,var(--skin-frame,var(--shelf-frame,#c9ac83)) 32% 76%,var(--skin-edge,var(--shelf-edge,#9e805d)) 76%);box-shadow:0 2px 2px #34282022;pointer-events:none;z-index:3}
.scene[data-extra-shelf][data-form] .extra-shelf .sort-slot{height:100%;max-height:none;bottom:0}
.scene[data-extra-shelf][data-form] .extra-shelf .front-stock,.scene[data-extra-shelf][data-form] .extra-shelf .front-stock svg{height:100%;max-height:none}
.scene[data-extra-shelf][data-form] .floor{bottom:var(--extra-shelf-reserve)}
.extra-shelf-offer>button{position:relative;grid-column:1 / -1;width:100%;height:100%;min-height:44px;padding:2px;border:0;border-radius:2px;background:transparent;color:#654c31;font-family:inherit;font-size:11px;font-weight:700;line-height:1.2;touch-action:manipulation}
.extra-shelf-bays{position:absolute;inset:3px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));pointer-events:none}
.extra-shelf-bays i{border:0;border-radius:0;margin:1px}
.extra-shelf-offer-label{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:4px 7px;border-radius:12px;background:#fff8e9ed;box-shadow:0 1px 2px #34282020;white-space:nowrap;pointer-events:none}
.extra-shelf-price{border-radius:7px;padding:3px 4px;background:#f2d68d;color:#654817;font-size:11px}
@media(orientation:landscape) and (max-height:480px){.scene[data-extra-shelf][data-form]{max-height:none}}