@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fredoka:wght@400;500;600;700&display=swap');
/* The generated art defines every raised control and panel. */
:root{--ink:#2c4128;--muted:#657257;--cream:#fff9e3;--button-cream:url('assets/ui/button-cream.webp');--button-green:url('assets/ui/button-green.webp');--button-honey:url('assets/ui/button-honey.webp');--button-rose:url('assets/ui/button-rose.webp');font-family:'DM Sans',system-ui,sans-serif;color:var(--ink);background:#e6ebcf;color-scheme:light;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.42;cursor:default}button:focus,summary:focus,[tabindex="-1"]:focus{outline:none}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
h1,h2,h3{font-family:'Fredoka',system-ui,sans-serif;font-weight:500;line-height:1.12;letter-spacing:-.02em;margin:0}h2{font-size:1.8rem}p{line-height:1.5}.eyebrow{font-size:.75rem;letter-spacing:.1em;font-weight:700;margin:0;color:#566343}
button,summary,.sprite-panel,.info-card{position:relative;isolation:isolate;--surface-art:var(--button-cream);--surface-cap:23px}
button,summary{background:none;border:0;box-shadow:none;border-radius:14px;min-height:44px}
button::before,summary::before,.sprite-panel::before,.info-card::before{content:'';position:absolute;inset:-2px;z-index:-1;pointer-events:none;border:solid transparent;border-width:var(--surface-cap);border-image-source:var(--surface-art);border-image-slice:30% fill;border-image-width:var(--surface-cap);border-image-repeat:stretch;opacity:1;background:none;mask-image:none}
.info-card{--surface-art:url('assets/ui/card-cream.webp');--surface-cap:30px}
button:not(.tile){font-family:'Fredoka',system-ui,sans-serif;font-weight:500;font-size:1rem;transition:transform .12s}
button:not(.tile):active:not(:disabled){transform:translateY(2px)}
.primary-button,.secondary-button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;padding:15px 22px;font-size:1.125rem!important;line-height:1.25}
.primary-button{--surface-art:var(--button-green);--surface-cap:27px;color:#fffdf0;text-shadow:0 1px 1px #1c351c77}
.primary-button:active{box-shadow:none}.secondary-button{color:#3f542c}
.text-button{padding:10px 18px;min-height:44px}.wallet{--surface-art:var(--button-honey);display:flex;justify-content:center;align-items:center;gap:7px;padding:10px 16px;min-height:44px;min-width:74px;color:#483d1b;font-size:1rem}
.wallet b{max-width:78px;overflow:hidden;text-overflow:ellipsis}.icon-button{width:46px;height:46px;padding:0;font-size:1.35rem!important;--surface-cap:21px}
.app-mode,.app-mode body{height:100%;overflow:hidden;overscroll-behavior:none}
.app-shell{position:relative;height:100svh;height:var(--app-height,100dvh);min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:max(8px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));background:#f5f6e7 url('assets/ui/app-texture.webp') repeat;background-size:384px 384px}
main{width:100%;margin:0 auto;min-height:0;max-width:460px;flex:1 1 0;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;justify-content:flex-start}
main>*{flex-shrink:0}
.title-screen{max-width:380px;min-height:0;padding:0 6px max(12px,env(safe-area-inset-bottom));gap:12px;align-items:stretch}
.home-top{display:flex;justify-content:flex-end;padding:3px 0 0;margin:0}
.title-logo{display:block;width:min(100%,270px);height:auto;min-height:64px;max-height:180px;flex-shrink:1;aspect-ratio:3/2;object-fit:contain;margin:auto auto 0}
.home-record{position:relative;display:flex;align-items:center;gap:14px;min-height:86px;padding:10px 20px 10px 92px;margin:0 4px 4px;--surface-cap:30px}
.home-record>img{position:absolute;left:3px;bottom:4px;width:92px;height:92px;object-fit:contain}
.home-record>div{display:flex;flex-direction:column;gap:3px}.home-record div>span{font-size:.875rem;color:var(--muted)}.home-record strong{font-family:'Fredoka',system-ui,sans-serif;font-size:1.75rem;font-weight:500;line-height:1.1}.record-trophy{font-size:1.55rem;margin-left:auto}
.home-play{display:flex;flex-direction:column;gap:12px}.home-play button{min-height:58px}.home-continue{flex-direction:column;gap:5px;padding:18px 24px!important}.home-continue>span{display:flex;justify-content:space-between;width:100%}.home-continue small{font-family:'DM Sans',sans-serif;font-size:.875rem;align-self:flex-start;font-weight:500;color:#f0f4d9}
.home-links{display:grid;grid-template-columns:1fr 1fr;gap:12px}.home-links button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:58px;padding:12px 8px;--surface-cap:27px;font-size:1rem}.home-links button>span{font-size:1.4rem;line-height:1.1}
.home-guide{align-self:center;min-width:150px;text-decoration:none;margin:0 0 auto}.home-status{font-size:.875rem;color:#824128;text-align:center;margin:0}.home-status:empty{display:none}
.app-version{display:block;text-align:center;font-size:.6875rem;line-height:1.4;color:var(--muted);padding-top:2px}
.desktop-mode{overflow:hidden;background:#456439}
#desktop{height:100svh;min-height:0;display:flex;align-items:center;justify-content:center;gap:clamp(36px,7vw,110px);padding:22px;position:relative;isolation:isolate;overflow:clip;background:radial-gradient(ellipse at 12% 18%,#e1e9b6 0,transparent 46%),radial-gradient(ellipse at 88% 70%,#f4d67f55,transparent 45%),#769160}
#desktop::before,#desktop::after{display:none}
.desktop-brand{width:clamp(220px,30vw,380px);display:flex;align-items:center;flex-direction:column;text-align:center}.desktop-brand .brand-logo{width:100%;height:auto;object-fit:contain;mix-blend-mode:normal;transform:none;margin:0}.desktop-brand>img:not(.brand-logo){width:220px;height:220px;object-fit:contain;mix-blend-mode:normal;transform:rotate(-6deg);margin:0}.desktop-brand small{font-size:.875rem;letter-spacing:.04em;color:#2f482c;margin-top:16px}
.phone-frame{flex-shrink:0;border:8px solid #243e2b;border-radius:48px;padding:16px 0 8px;background:#243e2b;box-shadow:0 0 0 2px #b4bf8d,0 25px 70px #24341d55;overflow:hidden;position:relative}
.phone-speaker{position:absolute;top:5px;left:50%;transform:translateX(-50%);width:54px;height:5px;border-radius:9px;background:#122319}.phone-frame iframe{width:100%;height:100%;border:0;border-radius:31px;background:#e6ebcf}
@media(max-height:730px){.title-screen{gap:8px}.title-logo{width:230px}.home-record{min-height:76px}.home-record>img{width:80px;height:80px}.home-record strong{font-size:1.5rem}.home-links button{min-height:52px;padding-block:10px}.home-play button{min-height:52px}.home-continue{padding:14px 22px!important}}
@media(max-width:350px){.app-shell{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.title-screen{padding-inline:2px}.home-record{padding-left:78px;gap:6px}.home-record>img{width:76px;height:76px}.record-trophy{font-size:1.2rem}.home-links button{font-size:.875rem}}

/* The board receives the remaining space; secondary content adapts around it. */
.app-shell.is-playing{padding:max(6px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));gap:5px}
.masthead{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;flex:0 0 54px;min-height:0;width:100%;margin:0 auto}
.masthead .icon-button{justify-self:start}.masthead .wallet{justify-self:end;min-width:66px;max-width:100%;padding-inline:12px}.game-logo{display:block;width:126px;height:60px;object-fit:contain}
#game{gap:6px;padding:2px;max-width:none;overflow:hidden;min-height:0}
.garden-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:0 3px;min-height:36px}.garden-heading h1{margin:0;line-height:1.15}.garden-heading .eyebrow{color:#6c7348;font-size:.75rem}.level-detail{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-size:.75rem;white-space:nowrap;color:#64704e}.honey-totals{display:flex;align-items:center;gap:7px}.honey-totals>#reward-label{color:#755422}.honey-totals>#best-label::before{content:"·";margin-right:7px}
#game .board-surface{position:relative;isolation:isolate;width:100%;margin:0;flex:1 1 0;min-height:0;min-width:0;padding:8px 6px;--surface-cap:30px;display:flex;flex-direction:column}
.board-top{flex:none;font-size:.8125rem;font-weight:600;text-align:center;line-height:1.25}.progress-track{flex:none;height:4px;border-radius:6px;background:#c6cfac;margin:6px 6px 4px;overflow:hidden}#safe-progress{height:100%;border-radius:inherit;background:#6e952c;transition:width .25s}
.board-wrap{flex:1 1 0;min-height:0;min-width:0;contain:size;display:grid;place-items:center;margin:0;padding:4px;overflow:hidden}.board{display:grid;grid-template-columns:var(--label-size,20px) repeat(var(--size,4),var(--tile-size,48px));grid-template-rows:var(--label-size,20px) repeat(var(--size,4),var(--tile-size,48px));gap:var(--board-gap,4px);align-items:stretch;align-content:start;flex:none}.edge-corner{visibility:hidden}.col-count,.row-count{display:flex;align-items:center;justify-content:center;min-height:0;font-size:.75rem;color:#697252;font-weight:600}
.tile{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:auto;width:var(--tile-size,48px);height:var(--tile-size,48px);min-width:0;min-height:0;padding:0;border:0;border-radius:12px;box-shadow:none;background:none;isolation:isolate;user-select:none;-webkit-user-select:none;touch-action:none;transition:transform .12s;font-size:var(--cell-font,24px);--surface-cap:22px;--surface-art:var(--button-green)}
.tile::before{inset:-1px}.tile-content{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.tile-image{display:block;width:94%;height:94%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}.tile.revealed{background:#cdd3c5;box-shadow:inset 0 1px 2px #52633c14;color:#5c7441;cursor:default}.tile.revealed::before{display:none}.tile .grass-art{width:100%;height:100%;opacity:.8}.tile.flower{cursor:pointer;background:#fffced;box-shadow:inset 0 0 0 1px #b7c094;color:#31552d}.flower-art{width:88%;height:88%;transform:translate(-4%,-4%)}.flower-number{position:absolute;right:3px;bottom:3px;z-index:1;min-width:1.2em;padding:2px;border-radius:6px;background:#fffcedf2;font-family:'Fredoka',sans-serif;font-size:1.25rem;font-weight:500;line-height:1;text-align:center}.tile.marker-bee,.tile.bee-hit{--surface-art:var(--button-honey)}.tile.marker-maybe{--surface-art:var(--button-cream);color:#37502c;font-family:'Fredoka',sans-serif;font-size:1.8rem}
.tile.actual-bee .bee-art{opacity:.53}.tile.incorrect-bee-mark{outline:2px solid #a82028;outline-offset:-1px}.tile.correct-bee-mark{outline:2px solid #23834a;outline-offset:-1px}.tile.failed-hit-bee{outline:3px solid #b65d19;outline-offset:-1px}.incorrect-mark-overlay,.correct-mark-overlay{position:absolute;inset:1px;z-index:2;width:calc(100% - 2px);height:calc(100% - 2px);border-radius:11px;overflow:hidden;pointer-events:none}.incorrect-mark-overlay{fill:#b21b25;fill-opacity:.58}.correct-mark-overlay{fill:#168947;fill-opacity:.5}.failed-hit-badge{position:absolute;top:0;right:0;z-index:4;display:grid;place-items:center;width:24%;height:24%;min-width:18px;min-height:18px;border:2px solid #fff9e3;border-radius:50%;background:#aa4c19;color:#fff9e3;font:800 14px/1 'Fredoka',system-ui,sans-serif;pointer-events:none}.board.failed-review .tile{cursor:pointer}
/* Flowerbed colors are part of the generated ground, not tint overlays. */
.region-symbol{display:inline-block;flex:none;width:9px;height:9px;background:var(--bed-ink);border:1px solid var(--bed-light);border-radius:50%;pointer-events:none}
.region-alternate>.region-symbol{border-radius:1px;transform:rotate(45deg)}
.tile>.region-symbol{position:absolute;top:5px;left:5px;z-index:3;box-shadow:0 0 0 1px var(--bed-ink)}
.region-legend{display:flex;justify-content:center;flex-wrap:wrap;flex:none;gap:6px;font-size:.75rem;margin-top:8px}.region-legend:empty{display:none}
.region-chip,button.region-chip{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:7px 10px;border-radius:10px;border:1px solid var(--bed-color);background:var(--bed-light);color:var(--bed-ink);font:600 .8125rem/1.2 'DM Sans',system-ui,sans-serif;white-space:nowrap}
button.region-chip{min-height:38px}.region-chip::before{display:none}
.game-actions{display:flex;flex-direction:column;flex:0 1 auto;min-height:48px;max-height:35%;gap:6px;padding:2px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.game-actions>*{flex-shrink:0}.tutorial-active .game-actions{min-height:0}.gesture-tip{font-size:.8125rem;text-align:center;color:#5e704b;margin:0;line-height:1.35}.gesture-tip span{padding:0 7px;color:#85916d}.play-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin:0}
.powerup-control{min-width:0;display:flex;flex-direction:column;gap:5px}
.play-tools .powerup-button{width:100%;min-height:88px;display:flex;align-items:center;justify-content:flex-start;gap:5px;padding:9px 10px;--surface-cap:25px;text-align:left}
.powerup-nudge{--surface-art:var(--button-green);color:#fffce7}.powerup-peek{--surface-art:var(--button-honey);color:#4b3515}
.powerup-icon{display:block;flex:0 0 52px;width:52px;height:60px;object-fit:contain;pointer-events:none}
.powerup-details{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;transform:translateX(-8px)}.powerup-name{font-size:1rem;line-height:1.15;white-space:nowrap}
.powerup-quantity{display:flex;align-items:baseline;gap:4px;line-height:1}.powerup-quantity b{font-size:2rem;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.powerup-quantity>span{font-size:1.25rem;line-height:1;font-variant-numeric:tabular-nums;opacity:.8}
.powerup-reserve{display:block;text-align:center;font:500 .6875rem/1.25 'DM Sans',sans-serif;color:var(--muted);padding-inline:2px;overflow-wrap:anywhere}
.sweep-status{display:flex;align-items:center;justify-content:flex-end;gap:4px;line-height:1.2;white-space:nowrap}.sweep-status img{width:18px;height:18px;object-fit:contain}.sweep-status b{font-weight:600;font-variant-numeric:tabular-nums}
.life-hearts{display:inline-flex;align-items:center;gap:3px;vertical-align:middle;white-space:nowrap}
.life-heart{display:block;flex:none;width:22px;height:22px;color:#cb9;overflow:visible}
.life-heart-shape{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.life-heart.is-full{color:#bd5a50}.life-heart.is-full .life-heart-shape,.life-heart.is-locked .life-heart-shape{fill:currentColor}
.life-lock{color:#fff;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.life-lock rect{fill:currentColor;stroke:none}
.home-continue small{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
.home-continue .life-heart:not(.is-full){color:#c2dfa0;opacity:.6}
button.lives-count{min-height:36px;padding:7px 3px;line-height:1}.lives-count::before{display:none}
.reset-progress{color:#8b4840}

.bottom-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex:0 0 auto;width:100%;margin:0 auto;padding:2px;border:0}.bottom-nav button{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 4px;min-height:44px;font-size:.875rem!important;color:#485e36;--surface-cap:20px}.bottom-nav span{font-size:1.15rem;line-height:1}
.hint-copy{font-size:.875rem;line-height:1.5;padding:17px 20px;--surface-art:var(--button-honey);--surface-cap:28px}.hint-copy strong{display:block;margin-bottom:5px}
.tile.hint-tile{outline:3px solid #d4a530;outline-offset:2px;z-index:2}.tile.holding{transform:translateY(-3px) scale(1.025);outline:3px solid #ffe79a;outline-offset:2px}.hold-meter{position:absolute;inset:2px;border-radius:10px;background:#fff0a2;opacity:.8;pointer-events:none;transform:scaleY(0);transform-origin:bottom;z-index:2;mix-blend-mode:screen}.holding .hold-meter{animation:hold-fill .5s linear forwards}@keyframes hold-fill{to{transform:scaleY(1)}}
.board-wrap.is-explorable{display:block;overflow:auto;overscroll-behavior:contain;touch-action:none;scrollbar-width:thin;scrollbar-color:#839959 #dbe1bf}.is-explorable .tile{font-size:var(--cell-font,24px)}.is-explorable .flower-number{font-size:max(14px,.8em)}.is-explorable .row-count,.is-explorable .col-count{font-size:max(10px,calc(var(--cell-font,24px)*.5))}
.zoom-controls{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:.75rem;color:#526845}.zoom-controls>span{max-width:105px;line-height:1.4}.zoom-controls>div{display:flex;align-items:center;gap:4px}.zoom-controls button{min-width:40px;min-height:40px;padding:5px 10px;--surface-cap:18px}.zoom-controls output{width:42px;text-align:center;font-size:.875rem}#zoom-fit{font-size:.875rem}
/* Menus, shop and records share the same illustrated surface system. */
dialog{isolation:isolate;color:var(--ink);width:calc(100% - 24px);max-width:430px;max-height:calc(var(--app-height,100dvh) - 24px);margin:auto;padding:22px 5px 12px;border:24px solid transparent;border-image:var(--button-cream) 30% fill / 34px stretch;background:transparent;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y pinch-zoom;scrollbar-width:thin}
dialog>*{min-width:0;max-width:100%}dialog p,dialog h2,dialog h3,dialog h4{overflow-wrap:anywhere}dialog button{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
dialog::backdrop{background:#1a302daf}dialog h2{padding-right:36px;margin:0 0 14px}dialog>p{font-size:1rem;line-height:1.5;margin:12px 0;color:#526047}.close-dialog{position:absolute;top:0;right:0;width:42px;height:42px;padding:0;font-size:1.5rem!important;--surface-cap:19px;z-index:2}.dialog-actions{display:flex;flex-direction:column;gap:10px;margin-top:20px}.profile-avatar{display:flex;justify-content:center;align-items:center;width:100px;height:100px;margin:0 auto 12px;border:3px solid #a5b37e;border-radius:50%;background:#e7ebcf}.profile-avatar img{width:100%;height:100%;object-fit:contain;border:0;border-radius:50%}#menu-dialog{text-align:center}#menu-dialog h2{padding:0}#menu-dialog>.text-button{width:100%;margin-top:10px}#restart-button{--surface-art:var(--button-rose);color:#543427}
.shop-balance{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;--surface-art:var(--button-honey);--surface-cap:25px}.shop-balance b{margin-left:auto;margin-right:8px;font-size:1.25rem;color:#483611}.shop-section{margin-top:22px}.shop-section>h3{font-size:1.15rem;margin:0 0 10px}.shop-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.shop-item{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;padding:14px 12px 12px;--surface-cap:27px;min-width:0}.shop-art{width:64px;height:64px;object-fit:contain;display:grid;place-items:center;font-size:2.2rem;margin:0}.shop-section[data-kind='portrait'] .shop-art{width:88px;height:88px;border-radius:16px}.shop-item h4{font-family:'Fredoka',sans-serif;font-weight:500;font-size:1rem;margin:0 0 6px}.shop-item p{font-size:.875rem;line-height:1.4;margin:0;color:#5d684b}.shop-item button{margin-top:auto;width:100%;min-height:44px;--surface-art:var(--button-honey);font-size:.875rem!important;padding:10px 5px}.shop-item button:disabled{opacity:.52}.shop-stock{display:block;margin-top:6px;font-weight:600;color:#3e5a32}
.run-summary{display:flex;justify-content:space-between;gap:12px;margin:14px 0 20px;font-size:.875rem;color:#65744e}.run-summary strong{display:block;font-family:'Fredoka',sans-serif;font-size:1.5rem;color:#37512c;font-weight:500}.run-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:10px;padding:17px 14px;margin:8px 0;--surface-cap:25px}.run-row:first-child{--surface-art:var(--button-honey)}.run-row>b{font-family:'Fredoka',sans-serif;font-size:1.4rem}.run-row strong{font-size:1rem}.run-row small{display:block;font-size:.75rem;margin-top:4px;color:#52623c}.run-row>span:last-child{font-size:.875rem;white-space:normal;overflow-wrap:anywhere;text-align:right}.empty-runs{text-align:center;padding:22px 10px;font-size:1rem;color:#5e6e48}.fine-print{font-size:.75rem!important;color:#66714e!important}
.guide-list{list-style:none;counter-reset:guide;padding:0;display:grid;gap:18px;margin:20px 0}.guide-list li{counter-increment:guide;position:relative;padding-left:34px;font-size:1rem}.guide-list li::before{content:counter(guide);position:absolute;left:0;top:0;width:25px;height:25px;border-radius:50%;background:#d8e1b8;color:#435c32;display:grid;place-items:center;font-family:'Fredoka',sans-serif}.guide-list p{font-size:.875rem;margin:5px 0 0;color:#5e6a4d;line-height:1.5}.guide-list p+p{margin-top:10px}.guide-powerups{padding-left:20px;margin:0 0 16px;font-size:1rem;line-height:1.5}.guide-powerups li+li{margin-top:8px}details{font-size:.875rem;margin:18px 0}summary{padding:13px 16px;cursor:pointer}details>p{padding:0 8px}
.outcome-art{height:116px;position:relative;overflow:hidden;text-align:center;margin:0 auto 10px}.outcome-art img{width:116px;height:116px;object-fit:contain}.outcome-art+.eyebrow{text-align:center}#outcome-dialog{text-align:center}#outcome-dialog h2{padding:0;margin:10px 0;font-size:2rem}#outcome-dialog.failure h2{color:#9a592c}.toast{position:fixed;left:50%;bottom:max(84px,calc(env(safe-area-inset-bottom) + 72px));transform:translate(-50%,12px);max-width:calc(100vw - 36px);width:max-content;padding:12px 18px;border-radius:14px;background:#2f482b;color:#fffce9;font-size:.875rem;line-height:1.4;box-shadow:0 7px 20px #1e372933;opacity:0;transition:opacity .15s,transform .15s;pointer-events:none;z-index:60}.toast.visible{opacity:1;transform:translate(-50%,0)}
.outcome-art.fail-swarm{width:min(100%,310px);height:166px;overflow:hidden;margin-bottom:4px}
.outcome-art.fail-swarm .outcome-logo{position:absolute;z-index:1;left:50%;top:50%;width:78%;height:150px;transform:translate(-50%,-50%);object-fit:contain}
.outcome-art.fail-swarm .outcome-flyer{position:absolute;width:39px;height:39px;object-fit:contain;pointer-events:none;will-change:transform}
.outcome-art.fail-swarm :is(.outcome-flyer-3,.outcome-flyer-6){z-index:2}
.outcome-flyer-1{left:0;top:5px;animation:outcome-dart-right 2.05s -.7s linear infinite}
.outcome-flyer-2{right:0;top:8px;animation:outcome-dart-left 1.82s -1.25s linear infinite}
.outcome-flyer-3{left:2px;top:68px;animation:outcome-dart-right 1.72s -1.5s linear infinite}
.outcome-flyer-4{right:3px;top:67px;animation:outcome-dart-left 2.18s -.35s linear infinite}
.outcome-flyer-5{left:20px;bottom:0;animation:outcome-dart-up-right 1.96s -1.1s linear infinite}
.outcome-flyer-6{right:20px;bottom:0;animation:outcome-dart-up-left 2.12s -1.7s linear infinite}
.outcome-art.fail-swarm .outcome-flyer-7{left:92px;top:0;width:33px;height:33px;animation:outcome-dart-right 1.65s -.95s linear infinite}
.outcome-art.fail-swarm .outcome-flyer-8{right:93px;bottom:1px;width:35px;height:35px;animation:outcome-dart-up-left 1.88s -.45s linear infinite}
@keyframes outcome-dart-right{0%,100%{transform:translate3d(0,8px,0) rotate(-18deg)}14%{transform:translate3d(40px,-4px,0) rotate(21deg)}31%{transform:translate3d(76px,19px,0) rotate(-25deg)}48%{transform:translate3d(34px,32px,0) rotate(26deg)}65%{transform:translate3d(92px,7px,0) rotate(-18deg)}82%{transform:translate3d(52px,-7px,0) rotate(22deg)}}
@keyframes outcome-dart-left{0%,100%{transform:translate3d(0,5px,0) rotate(18deg)}16%{transform:translate3d(-48px,25px,0) rotate(-24deg)}32%{transform:translate3d(-83px,-2px,0) rotate(20deg)}51%{transform:translate3d(-37px,-12px,0) rotate(-28deg)}72%{transform:translate3d(-93px,18px,0) rotate(17deg)}86%{transform:translate3d(-51px,30px,0) rotate(-16deg)}}
@keyframes outcome-dart-up-right{0%,100%{transform:translate3d(0,0,0) rotate(-15deg)}18%{transform:translate3d(39px,-30px,0) rotate(27deg)}35%{transform:translate3d(71px,-68px,0) rotate(-23deg)}52%{transform:translate3d(27px,-43px,0) rotate(20deg)}71%{transform:translate3d(83px,-79px,0) rotate(-18deg)}86%{transform:translate3d(48px,-25px,0) rotate(24deg)}}
@keyframes outcome-dart-up-left{0%,100%{transform:translate3d(0,0,0) rotate(15deg)}15%{transform:translate3d(-42px,-43px,0) rotate(-26deg)}34%{transform:translate3d(-74px,-17px,0) rotate(23deg)}53%{transform:translate3d(-30px,-69px,0) rotate(-22deg)}72%{transform:translate3d(-86px,-84px,0) rotate(18deg)}87%{transform:translate3d(-49px,-39px,0) rotate(-25deg)}}
/* Flower help uses the same generated tiles to explain visible neighbors. */
:is(#flower-dialog,#flowerbed-dialog,#review-dialog){border-image-source:url('assets/ui/card-cream.webp')}#flower-location{padding-right:40px;margin:0 0 8px}#flower-dialog h2{font-size:1.65rem}:is(#flower-close,#flowerbed-close){margin-top:18px}
#review-dialog{width:min(calc(100% - 24px),430px);padding:20px 8px 14px}#review-dialog .eyebrow{padding-right:42px;margin:0 0 8px}#review-dialog h2{font-size:1.5rem;line-height:1.2;margin:0 0 12px}#review-copy{color:var(--muted);font-size:.9375rem;line-height:1.4}#review-dialog[data-kind="wrong"] h2{color:#a82028}#review-dialog[data-kind="correct"] h2{color:#23834a}#review-dialog[data-kind="hit"] h2{color:#a54b1b}
#review-logic{font-size:.9375rem;line-height:1.5;overflow-wrap:anywhere}#review-reason{color:var(--theme-ink,var(--ink));font-weight:600;margin:16px 0 12px}#review-basis{color:var(--theme-muted,var(--muted));font-size:.8125rem;margin:0 0 16px}#review-details{border-top:1px solid var(--theme-edge,#8b9c6e);padding-top:12px}#review-details summary{cursor:pointer;min-height:44px;align-content:center;color:var(--theme-ink,var(--ink));font-weight:600}#review-steps{margin:8px 0 0;padding-left:24px;color:var(--theme-ink,var(--ink))}#review-steps li{padding-left:3px;margin-bottom:14px}#review-steps li:last-child{margin-bottom:0}
#review-illustration{margin:14px 0}.review-map-scroll{overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;padding:5px;scrollbar-width:thin;border-radius:8px;background:var(--theme-control,#edf0db)}.review-map{display:grid;grid-template-columns:18px repeat(var(--size),minmax(28px,1fr));gap:5px;width:min(100%,280px);min-width:calc(23px + var(--size)*33px);margin:0 auto;padding:4px}.review-axis{display:grid;place-items:center;border-radius:4px;font-size:.75rem;font-weight:700;line-height:18px;color:var(--theme-ink,var(--ink))}.review-map .tile{border-radius:7px;transition:none}.review-map .tile:not(.review-target):not(.review-evidence):not(.review-clue){opacity:.32}.review-map .flower-number{font-size:clamp(10px,calc(75px / var(--size)),17px);padding:1px;right:2px;bottom:2px;min-width:1em;border-radius:3px}.review-map .maybe-marker{font-size:clamp(14px,calc(100px / var(--size)),28px)}.review-map .tile>.region-symbol{width:6px;height:6px;top:3px;left:3px}
.tile.review-evidence{outline:2px dashed var(--theme-ink,var(--ink));outline-offset:0}.tile.review-clue{outline:2px dashed var(--theme-focus,#ad861d);outline-offset:1px}.tile.review-target{outline:3px solid var(--theme-focus,#ad861d);outline-offset:1px;z-index:3}.review-clue:is(.review-axis,.col-count,.row-count){background:var(--theme-primary,#427c35);color:var(--theme-on-primary,#fffbed);outline:2px dashed var(--theme-focus,#ad861d);outline-offset:0}.review-clue .flower-number{outline:2px solid var(--theme-focus,#ad861d);outline-offset:1px}.region-chip.review-clue{outline:2px dashed var(--theme-focus,#ad861d);outline-offset:1px}
.review-map .review-proved-bee .bee-art{opacity:1}
#review-clues{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin:10px 0}.review-clue-tag{padding:3px 7px;border:2px dashed var(--theme-focus,#ad861d);border-radius:6px;font-size:.75rem;line-height:1.3;color:var(--theme-ink,var(--ink));background:var(--theme-control,#edf0db)}#review-illustration figcaption{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;font-size:.6875rem;line-height:1.4;color:var(--theme-muted,var(--muted))}.review-key-target::before,.review-key-clue::before{content:'';display:inline-block;width:10px;height:10px;margin-right:5px;border:2px solid var(--theme-focus,#ad861d);border-radius:2px;vertical-align:-2px}.review-key-clue::before{border-style:dashed;border-color:var(--theme-ink,var(--ink))}#review-map-hint{text-align:center;font-size:.75rem;margin:8px 0 0}
#review-step-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px}#review-step-nav button{min-height:44px;padding:7px 10px;font-size:.8125rem!important;color:var(--theme-ink,var(--ink))}#review-step-status{font-size:.75rem;white-space:nowrap;color:var(--theme-muted,var(--muted))}#review-reason mark{color:inherit;background:var(--theme-control,#edf0db);padding:0 2px;border-bottom:2px solid var(--theme-focus,#ad861d);border-radius:2px}#review-reason .review-text-clue{border-bottom-style:dashed}.review-step-button{display:block;text-align:left;width:100%;padding:9px 10px;min-height:44px;font:inherit;line-height:1.5;color:var(--theme-ink,var(--ink));background:transparent;border:1px solid var(--theme-edge,#8b9c6e);border-radius:7px}.review-step-button::before{display:none}.review-step-button[aria-current='step']{outline:2px solid var(--theme-focus,#ad861d);background:var(--theme-control,#edf0db)}
#flowerbed-dialog>.eyebrow{padding-right:40px}#flowerbed-dialog h2{font-size:1.65rem}
.flowerbed-illustration{margin:18px 0}.flowerbed-diagram{display:grid;grid-template-columns:repeat(var(--size),minmax(0,1fr));gap:4px;width:min(100%,300px);margin:auto;container-type:inline-size}.flowerbed-illustration figcaption{font-size:.8125rem;line-height:1.4;text-align:center;margin-top:10px;color:var(--muted)}
.flower-illustration{margin:20px 0}.flower-diagram{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:min(100%,238px);margin:auto;padding:3px}.flower-example-cell.outside{visibility:hidden;aspect-ratio:1}.flower-illustration figcaption{font-size:.875rem;line-height:1.4;text-align:center;margin-top:12px;color:var(--muted)}
.tile.help-tile{width:100%;height:auto;aspect-ratio:1;pointer-events:none;cursor:default}.help-tile.center{outline:2px solid var(--theme-focus,#ad861d);outline-offset:2px}.flowerbed-diagram .tile .flower-number{font-size:clamp(5px,calc(40cqw / var(--size)),18px);padding:1px;right:4%;bottom:4%;border-radius:3px}.flowerbed-diagram .tile>.region-symbol{width:clamp(2px,calc(16cqw / var(--size)),9px);height:clamp(2px,calc(16cqw / var(--size)),9px);top:7%;left:7%}.flowerbed-diagram .maybe-marker{font-size:clamp(8px,calc(55cqw / var(--size)),28px)}
/* Tutorial explanations continue to point directly to the tile. */
.tutorial-active .garden-heading{margin-top:0}.tutorial-active .level-detail{display:none}.tutorial-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px;font-size:.75rem;color:#536946}.tutorial-tools{display:flex;flex-wrap:wrap;gap:5px;max-width:100%;margin-left:auto}.tutorial-tools .text-button{min-height:40px;padding:8px 10px;font-size:.875rem!important;--surface-cap:18px}
.tutorial-panel{position:fixed;z-index:50;width:336px;max-width:calc(100vw - 24px);height:auto;visibility:hidden}.tutorial-card{min-width:0;height:auto;border:16px solid transparent;border-image:url('assets/ui/card-cream.webp') 30% fill / 25px stretch;background:transparent;padding:6px 8px 10px;max-height:var(--tip-max-height,none);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y pinch-zoom;scrollbar-width:thin;overflow-wrap:anywhere}.tutorial-card .eyebrow{font-size:.75rem;letter-spacing:.03em;color:#796026;margin-bottom:6px}.tutorial-card h2{font-size:1.45rem;line-height:1.12}.tutorial-card>p:not(.eyebrow):not(.sr-only){font-size:.875rem;line-height:1.4;margin:8px 0 0}.tutorial-card .tutorial-feedback{font-size:.75rem!important;color:#5b6b46}.tutorial-card .primary-button{min-height:44px;min-width:0;max-width:100%;height:auto;padding:12px 15px;margin:14px 0 4px;font-size:1rem!important;white-space:normal;overflow-wrap:anywhere;--surface-cap:20px}.tutorial-pointer{position:absolute;display:block;left:var(--arrow-x,50%);width:28px;height:14px;object-fit:contain;pointer-events:none}.tutorial-panel[data-placement='above'] .tutorial-pointer{bottom:-11px;transform:translateX(-50%)}.tutorial-panel[data-placement='below'] .tutorial-pointer{top:-11px;transform:translateX(-50%) rotate(180deg)}
.tutorial-panel.is-prompt[data-placement='above']{animation:tip-bounce-up 1.3s ease-in-out infinite}.tutorial-panel.is-prompt[data-placement='below']{animation:tip-bounce-down 1.3s ease-in-out infinite}.tutorial-panel:hover,.tutorial-panel:focus-within{animation-play-state:paused!important}@keyframes tip-bounce-up{50%{transform:translateY(5px)}}@keyframes tip-bounce-down{50%{transform:translateY(-5px)}}
.board .tutorial-clue{background:#ffe096;border:2px dashed #947127;border-radius:6px;color:#44381b}.tile.tutorial-evidence{outline:2px dashed #907022;outline-offset:1px}.tile.tutorial-target{outline:3px solid #d4a530;outline-offset:2px;z-index:3;animation:target-pulse 1.3s ease-in-out infinite}@keyframes target-pulse{50%{outline-offset:5px;outline-color:#ffe79a}}
/* Generated leaf sprites scatter after a safe empty reveal. */
.leaf-burst{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:45}
.burst-leaf{position:absolute;display:block;width:var(--leaf-size);height:var(--leaf-size);object-fit:contain;opacity:0;will-change:transform,opacity;animation:leaf-scatter 800ms var(--delay) cubic-bezier(.2,.65,.35,1) both}
@keyframes leaf-scatter{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--start-turn)) scale(.45)}10%{opacity:1}45%{opacity:1;transform:translate(calc(-50% + var(--fly-x)*.45),calc(-50% + var(--lift-y))) rotate(var(--turn)) scale(1.15)}72%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--fly-x)),calc(-50% + var(--fly-y))) rotate(calc(var(--turn)*1.8)) scale(.7)}}
/* Bee-hit animation stays anchored to the uncovered tile. */
.tile.bee-hit{animation:bee-tile-pop .45s ease-out}.bee-burst{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:55}.burst-bee{position:absolute;display:block;width:var(--size);height:var(--size);object-fit:contain;opacity:0;will-change:transform,opacity;animation:bee-emerge 1100ms var(--delay) cubic-bezier(.2,.65,.35,1) both}
@keyframes bee-tile-pop{40%{transform:scale(1.18) rotate(-6deg)}75%{transform:scale(.98) rotate(2deg)}}@keyframes bee-emerge{0%{opacity:0;transform:translate(-50%,-50%) scale(.15)}12%{opacity:1;transform:translate(-50%,-65%) scale(.8)}48%{opacity:1;transform:translate(calc(-50% + var(--bend-x)),calc(-50% + var(--bend-y))) scale(1.3) rotate(var(--tilt))}82%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--fly-x)),calc(-50% + var(--fly-y))) scale(1) rotate(var(--tilt))}}
.bee-burst.is-still .burst-bee{animation:none;opacity:1;transform:translate(calc(-50% + var(--rest-x)),calc(-50% - 18px))}
@media(hover:hover){.tile.covered:hover{transform:translateY(-2px)}}

@media(max-width:350px){.masthead{gap:3px}.game-logo{width:116px}.masthead .wallet{padding-inline:8px;min-width:58px}.board-top{font-size:.75rem}.garden-heading{gap:6px}.play-tools,.bottom-nav{gap:5px}.play-tools .powerup-button{gap:3px;padding-inline:7px}.powerup-icon{flex-basis:42px;width:42px;height:52px}.powerup-name{font-size:.875rem}.powerup-quantity b{font-size:1.75rem}.bottom-nav button{font-size:.75rem!important;gap:4px}.flower-number{font-size:1.125rem}dialog{border-width:20px;padding-inline:2px}.shop-items{gap:7px}.shop-item{padding-inline:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.holding .hold-meter{transform:scaleY(1);opacity:.45}.burst-bee{opacity:1;transform:translate(-50%,-50%);will-change:auto}.outcome-art.fail-swarm .outcome-flyer{will-change:auto}}

@media(pointer:coarse){.keyboard-controls{display:none}}

.shop-section>p{font-size:.875rem;line-height:1.45;margin:0 0 12px;color:var(--muted)}
.shop-section:is([data-kind='upgrade'],[data-kind='life']) .shop-items{grid-template-columns:1fr}
.shop-section:is([data-kind='upgrade'],[data-kind='life']) .shop-item{display:grid;grid-template-columns:56px minmax(0,1fr);text-align:left;align-items:start;column-gap:12px}
.shop-section:is([data-kind='upgrade'],[data-kind='life']) .shop-art{width:56px;height:56px;align-self:center}
.shop-section:is([data-kind='upgrade'],[data-kind='life']) .shop-item button{grid-column:1/-1;margin-top:3px}
.shop-rank{display:block;font-size:.75rem;color:var(--muted);margin:0 0 7px}
.shop-item .upgrade-next{margin-top:8px}

/* Compact controls use the actual visible height, including Safari's toolbar. */
[data-compact] .is-playing .masthead{flex-basis:44px}
[data-compact] .is-playing .game-logo{width:110px;height:48px}
[data-compact] .is-playing .garden-heading{min-height:20px}
[data-compact] .is-playing .bottom-nav{display:none}
[data-compact] .play-tools .powerup-button{min-height:76px;padding-block:6px}
[data-compact] .powerup-icon{height:48px;flex-basis:44px;width:44px}
[data-compact] .powerup-quantity b{font-size:1.75rem}
[data-tight] .is-playing .gesture-tip{display:none}
[data-tight] .is-playing .board-top{font-size:.75rem}
[data-tight] .is-playing .region-legend{margin-top:4px}
/* In landscape the garden uses the height; controls occupy the space beside it. */
[data-landscape] .app-shell.is-playing{display:grid;grid-template-columns:minmax(0,1fr) clamp(170px,27vw,230px);grid-template-rows:44px auto auto minmax(0,1fr);column-gap:10px;row-gap:5px}
[data-landscape] #game{display:contents}
[data-landscape] #game .board-surface{grid-column:1;grid-row:1/-1;height:100%}
[data-landscape] .is-playing .masthead{grid-column:2;grid-row:1;grid-template-columns:44px minmax(0,1fr) auto;gap:2px}
[data-landscape] .is-playing .game-logo{width:100%;height:42px}
[data-landscape] .is-playing .masthead .wallet{padding-inline:8px;min-width:56px;font-size:.875rem}
[data-landscape] .garden-heading{grid-column:2;grid-row:2;flex-wrap:wrap;gap:3px}
[data-landscape] .tutorial-toolbar{grid-column:2;grid-row:3}
[data-landscape] .game-actions{grid-column:2;grid-row:4;max-height:none;min-height:0;align-self:stretch;gap:8px;padding:3px}
[data-landscape] .play-tools{grid-template-columns:1fr;gap:6px}
[data-landscape] .gesture-tip,[data-landscape] .zoom-controls>span{display:none}
[data-landscape] .zoom-controls{justify-content:center;flex-wrap:wrap}
[data-landscape] .zoom-controls>div{gap:2px;flex-wrap:wrap;justify-content:center}
[data-landscape] .zoom-controls button{min-width:36px;padding-inline:6px}

/* Reuse the generated controls for shop tabs and keep lives in the level row. */
.shop-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0 6px}.shop-tabs button{min-height:52px;padding:10px 8px;line-height:1.2}.shop-tabs button[aria-selected="true"]{--surface-art:var(--button-green);color:#fffdf0}.level-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.lives-count{font-size:.75rem;font-weight:700;white-space:nowrap}.flower-example-cell.bee{--surface-art:var(--button-honey)}

.tile[aria-disabled="true"]{cursor:default}

/* Icons use geometric centers, independent of each theme font's text baseline. */
.icon-button,.close-dialog{display:grid;place-items:center;line-height:1}
.control-icon{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}

/* Flip generated tile art to reveal the remaining bees after a solved garden. */
.bee-flipping{perspective:650px}.bee-flipping .tile-content{transform-style:preserve-3d;animation:solved-bee-flip 650ms var(--flip-delay) cubic-bezier(.25,.7,.3,1) both}
.bee-flip-front,.bee-flip-back{position:absolute;backface-visibility:hidden;-webkit-backface-visibility:hidden}.bee-flip-front{transform:rotateY(0deg);font-family:'Fredoka',sans-serif;font-size:1.8rem;color:#37502c}.bee-flip-back{transform:rotateY(180deg)}
@keyframes solved-bee-flip{0%{transform:rotateY(0deg) scale(1)}45%{transform:rotateY(85deg) scale(1.12)}100%{transform:rotateY(180deg) scale(1)}}

/* Each solved bee sends its level-sized honey reward into the run total. */
.honey-collection{position:fixed;inset:0;pointer-events:none;z-index:55;overflow:hidden}
.honey-flight{position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap;padding:5px 9px;border-radius:14px;background:#ffe69b;color:#543b10;box-shadow:0 3px 8px #4b351533;font:600 1rem/1.2 'Fredoka',system-ui,sans-serif;opacity:0;animation:honey-collect 1100ms var(--honey-delay) cubic-bezier(.45,0,.35,1) both}
@keyframes honey-collect{0%{opacity:0;transform:translate(-50%,-35%) scale(.5)}18%,40%{opacity:1;transform:translate(-50%,-90%) scale(1.08)}88%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--honey-x)),calc(-50% + var(--honey-y))) scale(.4)}}
@media(prefers-reduced-motion:reduce){.honey-flight{animation:none}}

.home-guide-links{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:12px;padding-inline:16px;margin:0 0 auto}.home-guide-links :is(button,a){display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 2px;margin:0;min-width:0;font:500 clamp(.65rem,2.8vw,.78rem)/1.3 var(--theme-body,'DM Sans',sans-serif)!important;white-space:nowrap;color:var(--theme-muted,var(--muted));text-decoration:underline;text-underline-offset:3px}.home-guide-links button::before{display:none}.privacy-link{font-size:.8rem}a.privacy-link{color:var(--theme-ink,var(--ink));text-underline-offset:3px}a.privacy-link:focus-visible{outline:2px solid var(--theme-focus);outline-offset:4px}

.cookie-banner{position:absolute;z-index:100;bottom:max(12px,env(safe-area-inset-bottom));left:12px;right:12px;max-width:430px;margin:0 auto;padding:18px;border:1px solid var(--theme-edge);border-radius:18px;background:var(--theme-panel);color:var(--theme-ink);box-shadow:0 8px 28px #24351d30;max-height:calc(100% - 24px);overflow:auto;text-align:center;font-family:var(--theme-body)}
.cookie-banner h2{font-family:var(--theme-display);font-size:1.1rem;line-height:1.3;margin:0 0 8px}.cookie-banner p{font-size:.84rem;line-height:1.45;margin:0 0 16px}.cookie-banner a{color:inherit;text-decoration:underline;text-underline-offset:3px}.cookie-actions{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:10px}#cookie-banner button{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:48px;padding:12px 10px!important;font:600 .875rem/1.35 var(--theme-body)!important;letter-spacing:normal;text-align:center;--surface-cap:20px}.cookie-banner>.text-button{margin:10px 0 0}.cookie-choice{display:flex;gap:10px;align-items:flex-start;margin:16px 0;font-size:.86rem;line-height:1.4;text-align:left}.cookie-choice input{width:18px;height:18px;margin:2px 0;flex-shrink:0;accent-color:var(--theme-primary)}.cookie-choice small{display:block;font-size:.78rem;line-height:1.4;margin-top:3px}.cookie-banner #cookie-save{margin-top:4px}.cookie-banner :is(button,input,a):focus-visible{outline-color:var(--theme-focus)}
.cookie-banner{container-type:inline-size}@container(max-width:260px){.cookie-actions{grid-template-columns:1fr}}

/* Device choices sit below the preview, with no raised button surface. */
.device-preview{display:flex;flex-direction:column;align-items:center;gap:12px;flex:none;min-width:0}
.layout-picker{display:flex;justify-content:center;gap:14px;height:48px}
#desktop .layout-picker button{display:grid;place-items:center;width:48px;min-width:48px;height:48px;padding:4px 8px 8px;border:0;border-radius:4px;background:none;box-shadow:none;color:#263f29;opacity:.55;transition:opacity .15s,transform .15s}
#desktop .layout-picker button::before{display:none}
.layout-picker svg{width:32px;height:36px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#desktop .layout-picker button:hover{opacity:.85}
#desktop .layout-picker button[aria-pressed="true"]{opacity:1;color:#213d24}
.layout-picker button[aria-pressed="true"] svg rect{fill:#e8f4bd}
.layout-picker button[aria-pressed="true"]::after{content:'';position:absolute;bottom:0;left:17px;right:17px;height:3px;border-radius:2px;background:currentColor}
.layout-picker button:focus-visible,.cookie-banner button:focus-visible,.cookie-banner input:focus-visible{outline:3px solid #48682d;outline-offset:4px}
#desktop[data-layout="tablet"]{gap:24px}
.desktop-brand{flex-shrink:0}
.desktop-brand>img:not(.brand-logo){width:min(220px,100%);height:auto;aspect-ratio:1}
.desktop-brand[data-compact]>img:not(.brand-logo){display:none}
#desktop[data-layout="tablet"] .phone-frame{border-radius:32px;padding:12px 0 4px}
#desktop[data-layout="tablet"] .phone-frame iframe{border-radius:18px}
@media(max-width:1000px){
 #desktop,#desktop[data-layout="tablet"]{height:100svh;min-height:0;padding:12px;gap:0}
 .desktop-brand,#desktop[data-layout="tablet"] .desktop-brand{display:none}
}

/* Keep the native modal and its backdrop mounted until the exit finishes. */
dialog[open]{animation:dialog-enter 320ms cubic-bezier(.16,1,.3,1) both;transform-origin:center}
dialog[open]::backdrop{animation:dialog-backdrop-enter 200ms ease-out both}
dialog[open].is-closing{animation:dialog-exit 220ms cubic-bezier(.4,0,1,1) both;pointer-events:none}
dialog[open].is-closing::backdrop{animation:dialog-backdrop-exit 220ms ease-in both}
@keyframes dialog-enter{from{opacity:0;transform:translateY(56px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes dialog-exit{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(44px) scale(.97)}}
@keyframes dialog-backdrop-enter{from{opacity:0}to{opacity:1}}
@keyframes dialog-backdrop-exit{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){dialog[open],dialog[open]::backdrop,dialog[open].is-closing,dialog[open].is-closing::backdrop{animation:none}.layout-picker button{transition:none!important}}

/* Rotate the actual viewport, keeping the same running game inside it. */
.layout-picker svg{transition:transform .18s ease}
.layout-picker [data-orientation="landscape"] svg{transform:rotate(90deg)}
#desktop[data-orientation="landscape"] .phone-frame{padding:0 8px 0 16px}
#desktop[data-layout="tablet"][data-orientation="landscape"] .phone-frame{padding:0 4px 0 12px}
#desktop[data-orientation="landscape"] .phone-speaker{top:50%;left:5px;width:5px;height:54px;transform:translateY(-50%)}
@media(prefers-reduced-motion:reduce){.layout-picker svg{transition:none}}

/* Flowerbed symbols are an optional color-vision aid, not permanent tile chrome. */
.region-symbol{display:none}
.visual-aid .region-symbol{display:inline-block}
.visual-aid-toggle{display:flex;align-items:center;gap:12px;text-align:left;padding:12px 10px;margin:8px 0;color:var(--theme-ink,var(--ink))}
.visual-aid-toggle input{width:22px;height:22px;flex:none;accent-color:var(--theme-primary,#577738)}
.visual-aid-toggle strong,.visual-aid-toggle small{display:block}.visual-aid-toggle small{font-size:.75rem;line-height:1.4;margin-top:2px;color:var(--muted)}
.visual-aid-toggle:focus-within{outline:2px solid var(--theme-focus,#6c902e);outline-offset:2px;border-radius:8px}
.shop-run-note{padding:10px 12px;border-radius:10px;background:#fff0ca;color:#5d4724!important;font-size:.875rem!important;margin:10px 0!important}
button.app-version{display:block;width:auto;min-height:30px;margin:0 auto;padding:4px 10px;font:600 .75rem/1.4 'DM Sans',sans-serif!important;color:var(--theme-ink,var(--ink));text-decoration:underline;text-underline-offset:3px}
button.app-version::before{display:none}
button.app-version:focus-visible{outline:2px solid var(--theme-focus,#6c902e);outline-offset:2px}
#changelog-dialog h2{margin-bottom:20px}
.changelog-entry{margin:0 0 20px;padding:14px;border-radius:14px;background:#fffcf1;border:1px solid #dfe3c7}
.changelog-entry h3{font-size:1.3rem}.changelog-date{font-size:.75rem;color:var(--muted);margin:4px 0 10px}.changelog-entry ul{margin:0;padding-left:20px;font-size:.9rem;line-height:1.5}.changelog-entry li+li{margin-top:7px}
#changelog-close{margin-top:10px}
@media(prefers-reduced-motion:reduce){.tile.swept-tile{animation:none}}
/* The ring marks the tracked upgrade; savings progress appears only at run end. */
.refill-summary{padding:16px;margin:16px 0;--surface-cap:25px;text-align:center}
.refill-summary h3{font-size:1rem;margin:0 0 12px}.refill-summary button{width:100%}
.refill-summary .fine-print{margin-bottom:0}
#shop-list button[data-goal]{display:inline-flex;align-items:center;width:auto;min-height:44px;margin-top:2px;padding:8px 0;border:0;border-radius:4px;background:none;box-shadow:none;font:400 .8rem/1.35 var(--theme-body,'DM Sans',sans-serif)!important;letter-spacing:normal;text-align:left;text-shadow:none;color:var(--theme-muted,#657257);text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);text-underline-offset:3px}
#shop-list button[data-goal]::before{display:none}
#shop-list button[data-goal][aria-pressed="true"]{font-weight:500!important;text-decoration:none}
#shop-list button[data-goal]:hover{color:var(--theme-ink,#2c4128);text-decoration-color:currentColor}
#shop-list button[data-goal]:active:not(:disabled){transform:none}
#shop-list button[data-goal]:focus-visible{outline:2px solid var(--theme-focus,#957326);outline-offset:2px}
.home-goal{padding:10px 16px 12px;margin:0 4px;--surface-cap:26px;color:var(--theme-ink,var(--ink));font-family:var(--theme-body,'DM Sans',sans-serif)}
.home-goal-heading{display:flex;align-items:center;gap:10px;width:100%;padding:0;min-height:42px;text-align:left}.home-goal-heading::before{display:none}.home-goal-art{display:grid;place-items:center;flex:none;width:38px;height:38px;font-size:1.8rem}.home-goal-art img{width:100%;height:100%;object-fit:contain}.home-goal-title{display:flex;flex-direction:column;gap:3px;min-width:0}.home-goal-kicker{font:700 .6rem/1.2 var(--theme-body,'DM Sans',sans-serif);letter-spacing:.08em;color:var(--theme-muted,var(--muted))}.home-goal-title strong{font:600 .9rem/1.25 var(--theme-body,'DM Sans',sans-serif)}.home-goal-arrow{margin-left:auto;font-size:1.1rem;color:var(--theme-primary)}
.home-goal progress{display:block;appearance:none;width:100%;height:8px;margin:7px 0;border:0;border-radius:8px;overflow:hidden;background:var(--theme-control,#e5dcc0);color:var(--theme-primary,#6e952c)}.home-goal progress::-webkit-progress-bar{background:var(--theme-control,#e5dcc0);border-radius:8px}.home-goal progress::-webkit-progress-value{background:var(--theme-primary,#6e952c);border-radius:8px}.home-goal progress::-moz-progress-bar{background:var(--theme-primary,#6e952c);border-radius:8px}.home-goal-details{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.72rem;line-height:1.35}.home-goal-details>span{color:var(--theme-muted,var(--muted))}.home-goal-details>strong{font-weight:600;white-space:nowrap}
.shop-item.tracked-upgrade{outline:3px solid #d89c19;outline-offset:-3px;border-radius:22px}
.tracked-upgrade-progress{margin:18px 0;padding:14px 16px;border-radius:18px;background:#fff9df;border:1px solid #e2d4a7;text-align:left;color:#3e4e2d}
.tracked-upgrade-heading{display:flex;align-items:center;gap:12px}
.tracked-upgrade-heading>img,.tracked-upgrade-heading>span{width:44px;height:44px;object-fit:contain;display:grid;place-items:center;font-size:2rem;flex:none}
.tracked-upgrade-heading .eyebrow{font-size:.65rem;margin:0 0 4px}
.tracked-upgrade-heading h3{font-size:1rem;margin:0}
.tracked-upgrade-progress progress{display:block;appearance:none;width:100%;height:10px;margin:14px 0 10px;border:0;border-radius:10px;overflow:hidden;background:#e5dcc0;color:#bd8516}
.tracked-upgrade-progress progress::-webkit-progress-bar{background:#e5dcc0;border-radius:10px}
.tracked-upgrade-progress progress::-webkit-progress-value{background:#bd8516;border-radius:10px}
.tracked-upgrade-progress progress::-moz-progress-bar{background:#bd8516;border-radius:10px}
.tracked-upgrade-progress>p{font-size:.8rem;line-height:1.4;margin:0 0 4px}
.tracked-upgrade-progress>strong{font-size:.85rem}
.tracked-upgrade-progress>button{width:100%;min-height:44px;margin-top:10px;font-size:.9rem}
.tracked-upgrade-progress>.upgrade-purchased{margin-bottom:12px;font-weight:700}
