:root{--ink:#283e2e;--green:#446b3d;--deep:#284b31;--cream:#fffdf2;--muted:#6e7c65;--line:#d5dfc5;--tile:40px;font-family:ui-rounded,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:var(--ink);background:#eff2e5}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 10%,#dce8c7,transparent 45%),radial-gradient(ellipse at 90% 90%,#e1ead2,transparent 45%);min-height:100vh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #da9d3e;outline-offset:3px}button:disabled{cursor:default}.game-shell{width:min(100%,500px);margin:auto;padding:24px 24px max(16px,env(safe-area-inset-bottom))}.masthead{display:flex;align-items:center;gap:12px}.back,.icon-button{width:40px;height:40px;display:grid;place-items:center;background:#ffffff70;border:1px solid var(--line);border-radius:50%;color:var(--ink);text-decoration:none;font-size:26px}.icon-button{margin-left:auto;font-size:19px;font-weight:800}.eyebrow{margin:0 0 3px;letter-spacing:3px;font-size:9px;font-weight:800;color:var(--green)}h1{font-size:22px;letter-spacing:2px;margin:0}h2{margin:8px 0;font-size:19px}.intro{margin:24px 0 18px}.challenge-label{font-size:10px;background:#d8e6bf;color:#4b6539;padding:4px 8px;border-radius:5px;font-weight:800;letter-spacing:1px}.intro p{font-size:12px;color:var(--muted);margin:7px 0}.levels{display:flex;gap:7px;margin-bottom:18px}.level{flex:1;border:1px solid #cfdbbd;background:#f9fbf1;border-radius:10px;padding:9px 3px;color:#64745b;font-size:12px}.level strong{font-size:16px;display:block;margin-bottom:3px}.level[aria-current="step"]{background:var(--deep);color:#fffcef;border-color:var(--deep);box-shadow:0 3px 0 #b4c69b}.level small{font-size:9px;white-space:nowrap}.board-heading{display:flex;justify-content:space-between;font-size:11px;font-weight:700;padding:0 3px 10px;letter-spacing:.3px}.board-heading span:last-child{color:var(--muted);font-weight:500}.field{border:1px solid #c5d4b2;background:linear-gradient(150deg,#dce7c9,#c8d9b5);border-radius:20px;position:relative;overflow:hidden;box-shadow:inset 0 1px 0 #f5f9eb;padding:12px 0}.field-decoration{position:absolute;inset:0;display:flex;justify-content:space-between;padding:20px;color:#a8bf8e;font-size:28px;pointer-events:none}.board{width:360px;height:375px;position:relative;margin:auto;transform-origin:top left}.tile{width:40px;height:40px;border:1px solid #bbcab0;border-radius:7px;background:#fffcf1;position:absolute;display:grid;place-items:center;padding:0;box-shadow:0 3px 0 #aab994,0 4px 5px #3c55232b;transition:filter .12s,transform .12s;touch-action:manipulation;isolation:isolate}.tile.available:hover{transform:translateY(-2px);box-shadow:0 5px 0 #aab994,0 6px 6px #3c55233b}.tile.available:active{transform:translateY(2px);box-shadow:0 1px 0 #aab994}.tile.covered{filter:brightness(.73) saturate(.6);background:#e3e8d8}.tile svg{width:29px;height:29px;pointer-events:none}.play-dock{position:relative;margin-top:18px;padding:15px 14px 9px;border:1px solid #d3dcc4;background:#fbfcf2;border-radius:16px;box-shadow:0 6px 20px #34492708}.rack-heading{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin-bottom:9px}.rack-heading small{font-size:9px;color:#8b927e;margin-left:5px}.rack-heading strong{font-size:11px;color:#68785c}.rack{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;background:#dfe7d2;border-radius:9px;padding:7px;min-height:51px}.slot{aspect-ratio:1;min-width:0;border:1px dashed #becbac;border-radius:5px;display:grid;place-items:center}.slot.filled{border:1px solid #c3ceb3;background:var(--cream);box-shadow:0 2px 0 #c1cead}.slot svg{width:85%;height:85%}.rack.danger{background:#f0d7be}.holding-row{display:flex;gap:8px;align-items:center;margin-top:10px;font-size:10px;color:var(--muted);height:36px}.holding{display:flex;gap:4px}.holding .slot{width:31px;height:31px;aspect-ratio:auto}.holding-row small{margin-left:auto;font-size:9px}.message{min-height:30px;margin:12px 0 7px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;line-height:1.5;color:#748367}.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tool{display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #c9d6ba;border-radius:10px;background:#edf3df;min-height:48px;padding:8px 3px;font-size:10px;color:var(--deep);position:relative}.tool-icon{font-size:21px;font-weight:600;line-height:1}.tool b{background:#46623a;color:#fffdf1;border-radius:50%;font-size:10px;width:17px;height:17px;display:grid;place-items:center}.tool:disabled{opacity:.4}.footer-controls{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:9px;color:#8b947e}.footer-controls button{border:0;background:transparent;color:#6a7e5d;font-size:10px;min-height:32px;padding:0 3px}.page-footer{text-align:center;font-size:9px;color:#8d9781;margin-top:17px;letter-spacing:.5px}.result{margin:16px 0 0;padding:22px;border:1px solid #c7d5b5;border-radius:16px;background:#fffdf1;text-align:center}.result[hidden]{display:none}.result-mark{color:#c39641;font-size:32px}.result p{font-size:12px;line-height:1.7;color:var(--muted)}.primary{border:0;border-radius:10px;background:var(--deep);color:var(--cream);padding:12px 20px;min-height:44px;font-weight:700;font-size:13px}.result .primary[hidden]{display:none}dialog{border:1px solid #d2ddc1;border-radius:20px;background:#fffdf2;width:min(90vw,420px);padding:28px;color:var(--ink);box-shadow:0 20px 80px #17281040}dialog::backdrop{background:#1c301d70;backdrop-filter:blur(3px)}dialog h2{margin:14px 0}dialog ol{padding-left:20px;font-size:13px;line-height:1.8}dialog p{font-size:11px;line-height:1.8;color:var(--muted)}dialog .primary{width:100%;margin-top:8px}.close-help{position:absolute;right:13px;top:10px;border:0;background:transparent;font-size:26px;color:var(--muted);width:32px;height:32px}@media(max-width:400px){.game-shell{padding:16px 12px}.intro{margin:19px 0 15px}.play-dock{padding:12px 10px 7px}.tools{gap:5px}.tool{gap:4px;font-size:9px}.rack{gap:4px}.holding-row small{font-size:8px}}@media(min-width:720px){.game-shell{padding-top:35px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media(max-width:500px){.game-shell{padding-top:12px}.masthead h1{font-size:20px}.intro{margin:12px 0}.intro>div{display:flex;align-items:center;gap:8px}.intro h2{font-size:12px;margin:0}.intro p{display:none}.levels{margin-bottom:12px}.level{padding:6px 3px}.level strong{font-size:14px;margin-bottom:2px}.play-dock{margin-top:12px}.message{margin:5px 0;min-height:25px}.holding-row{margin-top:7px}.page-footer{margin-top:10px}.footer-controls{margin-top:4px}.field{border-radius:14px}}

/* Fit the play surface to the viewport, with a readable dock instead of a
   phone-width column on desktop. Short screens may scroll rather than shrink
   the cards or controls below usable sizes. */
.game-shell{width:min(100%,1440px);min-height:100svh;padding:14px 20px max(10px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px}
.intro{margin:0}.intro>div{display:flex;align-items:center;gap:10px}.intro h2{font-size:13px;margin:0}.intro p{display:none}
.levels{margin:0;gap:8px}.level{min-height:46px;padding:5px}.level strong{font-size:15px;margin-bottom:1px}
.board-heading{padding:0 3px}.field{flex:1;min-height:310px;padding:0}.board{position:absolute;margin:0;width:360px;height:375px}
.play-dock{margin:0;padding:12px}.rack{max-width:460px;margin:auto}.holding-row{height:40px;margin-top:6px}.holding .slot{width:40px;height:40px}
.message{margin:5px 0;min-height:30px}.footer-controls{margin-top:4px}.footer-controls button{min-height:40px;font-size:12px}.page-footer{margin:0}.tool{min-height:46px;font-size:11px}
.music-controls{display:flex;align-items:center;gap:10px;margin-top:8px;padding-top:8px;border-top:1px solid var(--line);font-size:11px}.music-controls button{min-height:40px;border:1px solid var(--line);background:#edf3df;border-radius:8px;color:var(--deep);padding:6px 10px;white-space:nowrap}.music-controls button[aria-pressed="true"]{background:var(--deep);color:var(--cream)}.music-controls label{display:flex;align-items:center;gap:6px;flex:1}.music-controls input{width:100%;min-width:50px;accent-color:var(--green);min-height:40px}.music-status{font-size:10px;color:var(--muted);margin:4px 0 0}
@media(min-width:800px){
 .game-shell{height:100dvh;min-height:650px;display:grid;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:48px 52px 20px minmax(0,1fr) auto;gap:12px 24px;padding:20px 28px}
 .masthead{grid-column:1 / -1}.intro{display:none}.levels{grid-column:1 / -1}.board-heading{grid-column:1;grid-row:3}.field{grid-column:1;grid-row:4;min-height:0}.play-dock{grid-column:2;grid-row:3 / 5;align-self:center;padding:18px 14px}.page-footer{grid-column:1 / -1;grid-row:5}.result{grid-column:1 / -1;margin:0}.game-shell:has(.result:not([hidden])){height:auto;min-height:100dvh;grid-template-rows:48px 52px 20px minmax(430px,1fr) auto auto}.result:not([hidden]){grid-row:5}.game-shell:has(.result:not([hidden])) .page-footer{grid-row:6}.rack-heading small{font-size:8px}.holding-row{margin-top:14px}.holding-row small{max-width:52px}.message{min-height:55px;margin:10px 0}.tools{gap:5px}.tool{flex-wrap:wrap;gap:4px;padding:10px 2px}.footer-controls{margin-top:12px}.music-controls{margin-top:16px}
}
@media(max-width:799px){.game-shell{height:100dvh;min-height:830px;width:min(100%,680px)}.intro{display:none}.masthead h1{font-size:19px}.eyebrow{font-size:8px}.play-dock{padding:9px 10px}.holding-row small{font-size:9px}.rack{padding:5px}.rack .slot{max-height:45px}.page-footer{font-size:8px}.music-controls{margin-top:4px;padding-top:4px}.music-status{margin:0}.result:not([hidden]){flex-shrink:0}.game-shell:has(.result:not([hidden])){height:auto}}
@media(max-width:400px){.game-shell{padding:10px 10px max(8px,env(safe-area-inset-bottom));gap:8px;min-height:810px}.tool{font-size:10px}.rack-heading small{font-size:8px}}

.music-controls label{white-space:nowrap}

.level{min-width:0}.music-controls label{min-width:0}@media(max-width:360px){.levels{gap:4px}.level{padding:5px 2px}.level small{font-size:8px}}
@media(max-width:799px){.game-shell{min-height:100dvh;height:auto}.field{min-height:calc(min(100vw,680px)*1.04167 - 40px)}.holding-row{height:34px;margin-top:5px}.holding .slot{width:34px;height:34px}.message{min-height:20px;margin:4px 0;font-size:10px}.rack-heading{margin-bottom:6px}.rack .slot{max-height:40px}.tool{min-height:44px}.footer-controls button{min-height:32px}.music-controls button,.music-controls input{min-height:34px}.music-controls{font-size:10px}.music-status{font-size:9px}}
