:root{--bg:#fffdf5;--text:#3d4a3a;--board:#cfe8cf;--cell:#e2f2e0;--btn:#f3ecd6;--btn-hover:#ebe2c4;--accent:#8fc7a0;--gap:2%;--tile:23.5%;--step:25.5%}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);margin:0}body{justify-content:center;min-height:100vh;font-family:Nunito,Quicksand,Trebuchet MS,Segoe UI,system-ui,sans-serif;display:flex}#app{flex-direction:column;gap:14px;width:100%;max-width:520px;padding:16px;display:flex}.header{align-items:center;gap:8px;display:flex}.box-value{font-variant-numeric:tabular-nums}.title{flex:1;margin:0;font-size:1.5rem;font-weight:800}.box{background:var(--board);text-align:center;border-radius:12px;min-width:76px;padding:6px 12px}.box-label{text-transform:uppercase;letter-spacing:.06em;font-size:.7rem;display:block}.box-value{font-size:1.2rem;font-weight:800}.board-wrap{width:100%;position:relative}.board{z-index:0;aspect-ratio:1;background:var(--board);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:18px;width:100%;position:relative;container-type:inline-size}.layer{position:absolute;inset:2.5%}.cell,.tile{width:var(--tile);height:var(--tile);left:calc(var(--c) * var(--step));top:calc(var(--r) * var(--step));border-radius:14px;position:absolute}.cell{background:var(--cell)}.tile{transition:left var(--slide-ms) ease-out, top var(--slide-ms) ease-out;z-index:1;background:var(--tile-bg,var(--cell));justify-content:center;align-items:flex-end;padding:4% 3%;display:flex;box-shadow:0 2px #0000000f}.controls{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.btn{font:inherit;color:var(--text);background:var(--btn);cursor:pointer;border:0;border-radius:12px;min-height:44px;padding:10px 14px;font-weight:700}.btn:hover:not(:disabled){background:var(--btn-hover)}.btn:disabled{opacity:.5;cursor:default}.btn.primary{background:var(--accent)}.hint{text-align:center;opacity:.8;margin:0;font-size:.85rem}.overlay{z-index:10;animation:overlay-in var(--overlay-fade-ms) ease-out;background:#fffdf5d9;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.overlay.hidden{display:none}.overlay-text{margin:0;font-size:2rem;font-weight:800}.overlay button[hidden]{display:none}.tile.pop{animation:pop var(--pop-ms) ease-out var(--anim-delay)}.tile.spawn{animation:appear var(--spawn-ms) ease-out var(--anim-delay) backwards}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(var(--pop-scale))}to{transform:scale(1)}}@keyframes appear{0%{transform:scale(var(--spawn-from));opacity:0}to{opacity:1;transform:scale(1)}}.overlay[data-status=won]{background:#3d5a3d99}.overlay[data-status=lost]{background:#5a3d3d99}.overlay-text,.overlay-stats{color:#fffdf5;text-shadow:0 1px 3px #00000059}.overlay-stats{margin:0;font-size:1.1rem;font-weight:700}@media (width<=420px){#app{gap:10px;padding:10px}.title{font-size:1.05rem}.box{min-width:0;padding:4px 6px}.box-value{font-size:1rem}.header{flex-wrap:wrap;row-gap:6px}.title{flex:72px;min-width:72px}.header{gap:6px}.btn{flex:1;padding:10px;font-size:.9rem}.icon-btn{flex:none;width:36px;min-height:40px;padding:6px}.hint{font-size:.78rem}.overlay-text{font-size:1.6rem}}.overlay .btn{flex:none;min-width:140px}.plant{width:calc(var(--s) * 100%);aspect-ratio:1;line-height:0;display:block}.plant svg{width:100%;height:100%;display:block;overflow:visible}.icon-btn{flex:none;width:44px;padding:8px}.icon-btn svg{width:100%;height:100%;display:block}.help{z-index:100;background:#3d4a3a8c;justify-content:center;align-items:center;padding:12px;display:flex;position:fixed;inset:0}.help[hidden]{display:none}.help-dialog{background:var(--bg);border-radius:18px;width:100%;max-width:440px;max-height:calc(100dvh - 24px);padding:14px 16px 16px;overflow-y:auto;box-shadow:0 8px 30px #00000040}.help-top{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.help-title{margin:0;font-size:1.25rem;font-weight:800}.help .help-close{flex:none;width:44px;padding:0;font-size:1.5rem;line-height:1}.help-levels{flex-wrap:wrap;justify-content:center;gap:8px 4px;margin:0 0 10px;padding:0;list-style:none;display:flex}.help-level{text-align:center;flex-direction:column;align-items:center;gap:3px;width:calc(20% - 3.2px);display:flex}.help-plant{aspect-ratio:1;background:var(--tile-bg);border-radius:10px;justify-content:center;align-items:flex-end;width:100%;padding:4% 3%;display:flex}.help-level-name{font-size:.62rem;font-weight:700;line-height:1.15}.help-list{flex-direction:column;gap:4px;margin:0;padding-left:1.2em;font-size:.92rem;line-height:1.4;display:flex}