@font-face{font-family:Plot;src:local('Avenir Next'),local('Avenir'),local('Trebuchet MS');font-display:swap}
:root{color-scheme:light;--paper:#f5f1e7;--ink:#244a39;--muted:#637267;--green:#285f48;--orange:#c55735;--line:#dcded0;--cell:#e0e5d7;--c1:#a5c781;--c2:#efa580;--c3:#c0acd9;--c4:#efd079;--c5:#8ebfbc}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Plot,'Trebuchet MS',sans-serif;-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #be4d2f;outline-offset:4px}button:disabled{cursor:default;opacity:.4}button{border:0}button:hover:not(:disabled){filter:brightness(.97)}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}.skip{position:fixed;top:-100px;left:12px;z-index:10;background:white;padding:15px}.skip:focus{top:12px}.topbar{max-width:1400px;margin:auto;padding:26px 5%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font-size:21px;font-weight:800;letter-spacing:-1px}.brand span{color:var(--orange)}.back{font-size:13px;text-decoration:none;font-weight:700}.layout{max-width:1360px;margin:0 auto;padding:44px 5% 35px;display:grid;grid-template-columns:minmax(240px,1fr) minmax(340px,440px) 110px;gap:52px;align-items:start}.intro{padding-top:25px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.8px;line-height:1.6}.intro h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(58px,6vw,86px);letter-spacing:-5px;line-height:.97;position:relative;margin:24px 0 16px}.intro h1 span{font-style:italic;color:var(--orange)}.intro h1 svg{height:64px;width:64px;color:var(--green);transform:rotate(15deg);margin-left:10px}.tagline{font-size:22px;margin:22px 0 16px}.intro-copy{color:var(--muted);font-size:15px;line-height:1.8}.promise{font-size:12px;font-weight:800;margin:25px 0 35px}.promise>span{font-size:20px;color:var(--orange);margin-right:4px}.promise small{display:block;font-size:11px;font-weight:400;padding:7px 0 0 24px;color:var(--muted)}.desktop-guide{border-top:1px solid var(--line);padding-top:18px;max-width:320px}.desktop-guide ol{padding:0;counter-reset:guide;list-style:none}.desktop-guide li{position:relative;padding-left:35px;margin:21px 0;font-size:13px}.desktop-guide li:before{counter-increment:guide;content:counter(guide);position:absolute;left:0;top:0;border:1px solid #c2cbb9;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:11px}.desktop-guide li span{display:block;color:var(--muted);line-height:1.6;margin-top:5px}.gentle{font-family:Georgia,serif;font-style:italic;color:var(--muted);font-size:15px}.game{background:#fffdf6;border:1px solid #d2d9c8;border-radius:26px;padding:20px;box-shadow:0 8px 0 #e2e5d8,0 18px 35px #314e3510;min-width:0}.game-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.mode-switch{display:flex;padding:4px;background:#edf0e5;border-radius:11px;gap:3px}.mode-switch button{padding:10px 13px;font-size:12px;font-weight:700;background:transparent;border-radius:8px;min-height:40px}.mode-switch button[aria-pressed=true]{background:var(--green);color:white;box-shadow:0 2px 3px #244a3920}.mode-switch span{color:#efcc7e}.icon-button{background:transparent;min-width:44px;min-height:44px;font-size:18px;letter-spacing:1px}.scorebar{display:flex;align-items:center;gap:24px;padding:19px 2px 13px}.scorebar .label{display:block;letter-spacing:1.2px;font-size:9px;font-weight:800;color:var(--muted)}.scorebar strong{font-size:34px;letter-spacing:-1px;font-variant-numeric:tabular-nums;display:block;line-height:1.3}.scorebar .best strong{font-size:23px;padding-top:8px;color:#617563}.garden-badge{margin-left:auto;height:55px;width:55px;display:grid;place-items:center;background:#eff2e2;border-radius:50%}.garden-badge svg{height:40px;width:40px;color:#609556}.progress-label{display:flex;justify-content:space-between;font-size:10px;font-weight:700;margin:1px 2px 7px;gap:5px}.progress-label span:last-child{color:var(--muted)}.progress-track{height:5px;background:#e9eddf;border-radius:4px;margin-bottom:17px;overflow:hidden}.progress-track>div{height:100%;background:#7fa95d;border-radius:4px;transition:width .35s;width:0}.board-wrap{position:relative}.board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;padding:7px;background:#cad4bf;border:1px solid #c0ccb4;border-radius:12px;aspect-ratio:1;touch-action:none;user-select:none;-webkit-user-select:none}.cell{border-radius:6px;min-width:0;min-height:0;padding:1px;background:var(--cell);aspect-ratio:1;position:relative;box-shadow:inset 0 1px 2px #36552c06;transition:background .12s,transform .12s;display:grid;place-items:center}.cell.filled{box-shadow:inset 0 2px 0 #ffffff45,0 2px 0 #30542522}.tile-svg{width:85%;height:85%;pointer-events:none;opacity:.86}.color-1{background:var(--c1);color:#466d36}.color-2{background:var(--c2);color:#a24c2c}.color-3{background:var(--c3);color:#73548f}.color-4{background:var(--c4);color:#987226}.color-5{background:var(--c5);color:#376d69}.cell.preview{outline:2px solid #37653d;outline-offset:-2px;opacity:.75;transform:scale(.95)}.cell.invalid{outline:2px solid #bd442f;outline-offset:-2px;background:#e7b0a0}.cell.line-preview{box-shadow:inset 0 0 0 2px #fff7cc;background:#d6dc99}.cell.anchor:after{content:'+';position:absolute;inset:0;display:grid;place-items:center;font-size:25px;font-weight:800;color:#284d37;text-shadow:0 1px 2px white}.cell.just-placed{animation:planted .25s ease-out}.cell.popped{animation:pop .48s ease-out}.instruction{text-align:center;min-height:34px;margin:13px 0 0;font-size:12px;line-height:1.45;color:var(--muted);display:flex;align-items:center;justify-content:center}.tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:5px 0 13px}.piece{height:92px;display:flex;align-items:center;justify-content:center;position:relative;background:#f3f3e9;border-radius:12px;border:2px solid transparent;touch-action:none;user-select:none;-webkit-user-select:none;padding:9px}.piece[aria-pressed=true]{border-color:#285f48;background:#e8efde}.piece.used{background:transparent;border:1px dashed #e2e5d8;opacity:1}.piece.used:after{content:'✓';color:#b6c4aa;font-size:24px}.piece-grid{display:grid;gap:3px;pointer-events:none}.mini-cell{width:19px;height:19px;border-radius:4px;box-shadow:inset 0 2px 0 #ffffff40,0 2px 0 #254b3920;display:grid;place-items:center}.mini-cell .tile-svg{width:18px;height:18px}.piece-num{position:absolute;top:5px;left:7px;color:#607160;font-size:9px}.actions{display:flex;justify-content:space-between;gap:4px;padding-bottom:12px;border-bottom:1px solid #e7e9de}.actions button{background:transparent;min-height:44px;padding:4px 8px;font-size:11px;font-weight:700}.actions button span{font-size:19px;vertical-align:-1px;margin-right:5px}.game-foot{display:flex;align-items:center;gap:5px;font-size:9px;color:#75816f;padding:9px 1px 0;min-height:28px}.save-dot{background:#8fae77;border-radius:50%;width:5px;height:5px}.game-foot button{background:transparent;margin-left:auto;color:#596b59;font-size:10px;min-height:30px}.side-note{align-self:end;padding-bottom:80px;color:#6c7b66}.side-note>span{font-size:45px;color:#bd7655}.side-note p{font-size:12px;line-height:1.8}.side-note em{font-family:Georgia,serif;font-size:15px}.footer{display:flex;justify-content:center;gap:24px;font-size:10px;color:#6b786a;max-width:1300px;margin:10px auto 25px;padding:0 20px}.footer a{text-underline-offset:3px}.celebration{pointer-events:none;position:absolute;inset:0;overflow:hidden;border-radius:12px;display:grid;place-items:center}.celebrate-text{padding:15px 24px;border-radius:18px;background:#285f48f0;box-shadow:0 4px 20px #183d3c25;color:#fff6d9;font-size:24px;font-weight:800;animation:celebrate 1.4s both;transform:rotate(-4deg);text-align:center}.celebrate-text small{display:block;font-size:13px;margin-top:4px}.petal{position:absolute;left:50%;top:50%;width:10px;height:16px;border-radius:50% 0 50% 50%;background:var(--c2);animation:petal .9s ease-out both}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}dialog{border:1px solid #d7decb;border-radius:24px;color:var(--ink);background:#fffdf6;padding:32px;width:min(420px,calc(100% - 28px));max-height:90dvh;box-shadow:0 20px 100px #163c3930}dialog::backdrop{background:#1d392977;backdrop-filter:blur(4px)}dialog h2{font-family:Georgia,serif;font-weight:400;font-size:34px;letter-spacing:-1px;margin:7px 0 15px}dialog p{font-size:14px;line-height:1.7;color:var(--muted)}dialog ul{padding-left:18px;font-size:13px;line-height:1.9}.close-dialog{position:absolute;right:11px;top:10px;width:40px;height:40px;border-radius:50%;background:transparent;font-size:25px}dialog .primary,dialog .secondary{min-height:48px;padding:13px 20px;border-radius:12px;width:100%;margin-top:8px;font-weight:700;font-size:14px}dialog .primary{background:var(--green);color:white}dialog .secondary{background:#edf0e5}dialog .tiny{font-size:11px}dialog .result-score{font-size:58px;font-weight:800;letter-spacing:-3px;line-height:1.1;margin:20px 0 0}dialog .result-mark{font-size:50px;color:var(--orange)}.feedback{display:flex;gap:6px}.feedback button{flex:1;background:#edf0e5;padding:12px 4px;font-size:11px;border-radius:8px;min-height:44px}.feedback button[aria-pressed=true]{background:var(--green);color:white}.noscript{position:fixed;inset:auto 10px 10px;background:#fff3c9;border:2px solid var(--orange);padding:20px;z-index:10}.drag-ghost{position:fixed;z-index:20;pointer-events:none;opacity:.85;transform:translate(-50%,-100%);filter:drop-shadow(0 6px 6px #183d3c35)}
@keyframes planted{0%{transform:scale(.75)}65%{transform:scale(1.07)}100%{transform:scale(1)}}@keyframes pop{0%{background:#fff1b4;transform:scale(.88);box-shadow:0 0 10px #f8edb3}100%{transform:scale(1)}}@keyframes celebrate{0%{opacity:0;scale:.6}15%,75%{opacity:1;scale:1}100%{opacity:0;translate:0 -25px}}@keyframes petal{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(260deg)}}
@media(min-width:1400px){.layout{padding-top:65px}}
@media(max-width:1100px){.layout{grid-template-columns:minmax(230px,1fr) minmax(320px,420px);gap:40px}.side-note{display:none}}
@media(max-width:720px){.topbar{padding:16px 20px}.brand{font-size:17px}.back{font-size:12px}.layout{display:block;padding:20px 14px 18px;max-width:470px}.intro{padding:0}.intro .eyebrow,.intro-copy,.promise,.desktop-guide{display:none}.intro h1{font-size:37px;letter-spacing:-1.8px;margin:0;line-height:1.1}.intro h1 br{display:none}.intro h1 span:before{content:' '}.intro h1 svg{width:29px;height:29px;margin-left:5px}.tagline{font-size:12px;margin:8px 0 18px;color:var(--muted)}.game{padding:14px;border-radius:22px}.scorebar{padding-top:12px;padding-bottom:8px}.scorebar strong{font-size:31px}.scorebar .best strong{font-size:21px}.garden-badge{width:44px;height:44px}.garden-badge svg{width:32px;height:32px}.progress-track{margin-bottom:12px}.mode-switch button{font-size:11px;padding:7px 11px;min-height:36px}.board{gap:3px;padding:6px}.cell{border-radius:5px}.piece{height:80px}.mini-cell{width:18px;height:18px}.instruction{font-size:11px;margin-top:9px;min-height:32px}.tray{margin:4px 0 8px;gap:8px}.actions{padding-bottom:7px}.actions button{padding:4px 5px}.footer{font-size:9px;gap:9px;flex-wrap:wrap;margin:4px auto 22px}.footer>span:last-child{width:100%;text-align:center}.game-foot{padding-top:5px}.game-foot button{min-height:32px}}
@media(max-width:360px){.layout{padding:14px 8px}.game{padding:10px}.intro h1{font-size:33px}.topbar{padding:12px 14px}.board{gap:2px}.piece{height:76px}.mini-cell{width:16px;height:16px}.mini-cell .tile-svg{width:15px;height:15px}.mode-switch button{padding:7px 9px}}
@media(max-height:780px) and (max-width:720px){.layout{padding-top:12px}.tagline{margin:5px 0 12px}.scorebar{padding-top:7px}.game-top .icon-button{min-height:38px}.instruction{min-height:28px}.piece{height:70px}.actions{padding-bottom:2px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.celebrate-text{display:none}}
/* Keep the complete play surface within a typical phone, with scrolling on very short screens. */
@media(max-width:720px){
 .topbar{padding:12px 18px}.layout{padding-top:12px}.intro h1{font-size:32px}.tagline{margin:5px 0 12px}.game{padding:12px}.game-top{height:40px}.game-top .icon-button{min-height:40px}.scorebar{padding:8px 2px 5px}.scorebar strong{font-size:29px;line-height:1.1}.scorebar .best strong{font-size:20px;padding-top:4px}.scorebar .label{font-size:8px}.garden-badge{width:38px;height:38px}.progress-label{margin-top:4px}.progress-track{margin-bottom:9px}.instruction{margin-top:6px;min-height:30px}.tray{margin:3px 0 5px}.piece{height:68px}.actions{padding-bottom:2px}.actions button{min-height:40px}.game-foot{padding-top:3px}.game-foot button{min-height:28px}
}
@media(max-width:720px) and (max-height:760px){
 .topbar{padding:9px 16px}.intro h1{font-size:28px}.tagline{display:none}.intro{margin-bottom:10px}.board-wrap{max-width:calc(100svh - 345px);min-width:240px;margin:auto}.piece{height:62px}.piece-grid{gap:2px}.mini-cell{width:16px;height:16px}.mini-cell .tile-svg{width:15px;height:15px}.scorebar{padding:5px 2px}.game{padding:10px}.instruction{font-size:10px}.game-foot{font-size:8px}
}
@media(min-width:721px) and (max-height:1050px){
 .topbar{padding-top:18px;padding-bottom:18px}.layout{padding-top:22px;grid-template-columns:minmax(240px,1fr) 380px 100px;gap:36px}.intro{padding-top:10px}.intro h1{font-size:68px}.promise{margin:18px 0 22px}.desktop-guide li{margin:14px 0}.game{padding:14px}.game-top{height:40px}.scorebar{padding:10px 2px 7px}.scorebar strong{font-size:28px}.scorebar .best strong{font-size:21px}.garden-badge{width:40px;height:40px}.progress-track{margin-bottom:10px}.board-wrap{width:min(100%,calc(100svh - 405px));min-width:260px;margin:auto}.instruction{font-size:11px;min-height:30px;margin-top:6px}.piece{height:70px}.tray{margin:3px 0 7px}.actions{padding-bottom:5px}.actions button{min-height:40px}.game-foot{padding-top:4px}.game-foot button{min-height:26px}
}
@media(min-width:721px) and (max-width:1100px) and (max-height:1050px){.layout{grid-template-columns:minmax(240px,1fr) 370px;gap:24px}}
/* The play surface never scrolls. Only dialogs and the desktop introduction can. */
body{height:100dvh;overflow:hidden;display:flex;flex-direction:column;overscroll-behavior:none}
.topbar{width:100%;flex:0 0 auto}
.layout{width:100%;flex:1 1 0;min-height:0;padding-top:20px;padding-bottom:16px;align-items:stretch}
.intro{min-height:0;overflow:auto;scrollbar-width:thin}
.game{height:100%;min-height:0;display:flex;flex-direction:column}
.game>*{flex:0 0 auto}
.game .board-wrap{position:relative;flex:1 1 0;min-height:0;min-width:0;max-width:none;width:100%;margin:0;container-type:size;display:grid;place-items:center}
.board{width:min(100cqw,100cqh);height:min(100cqw,100cqh);aspect-ratio:1}
.celebration{inset:0;max-width:100%;max-height:100%}
.footer{flex:0 0 auto;margin:0 auto 12px;line-height:1.3}
.instruction{margin-top:6px;min-height:30px}
.tray{margin-top:3px;margin-bottom:6px}
@media(max-width:720px){
 .layout{display:flex;flex-direction:column;padding:10px 12px 12px}.intro{flex:none;overflow:visible}.intro h1{font-size:30px}.tagline{margin:4px 0 10px}.game{flex:1 1 0;min-height:0}.footer{display:none}.piece{height:66px}.topbar{padding:11px 16px}.side-note{display:none}.scorebar{padding-top:7px;padding-bottom:5px}
}
@media(max-width:720px) and (max-height:740px){
 .topbar{padding:8px 14px}.brand{font-size:15px}.layout{padding:7px 8px 8px}.intro{margin-bottom:7px}.intro h1{font-size:25px;line-height:1}.intro h1 svg{width:22px;height:22px}.tagline{display:none}.game{padding:9px;border-radius:17px}.game-top{height:33px}.mode-switch{padding:2px}.mode-switch button{min-height:29px;padding:5px 9px;font-size:10px}.game-top .icon-button{min-height:32px}.scorebar{padding:5px 1px 3px}.scorebar strong{font-size:23px}.scorebar .best strong{font-size:18px;padding-top:1px}.garden-badge{width:30px;height:30px}.garden-badge svg{width:25px;height:25px}.progress-label{margin:3px 1px 4px;font-size:9px}.progress-track{height:4px;margin-bottom:6px}.instruction{min-height:24px;font-size:10px;margin-top:4px}.piece{height:54px;padding:5px}.tray{margin:2px 0 3px}.mini-cell{width:14px;height:14px;border-radius:3px}.mini-cell .tile-svg{width:13px;height:13px}.actions{padding:0}.actions button{min-height:34px;font-size:10px}.actions button span{font-size:16px}.game-foot{min-height:22px;padding-top:1px;font-size:8px}.game-foot button{min-height:22px}.board{padding:4px;gap:2px}.cell{border-radius:4px}
}
@media(min-width:600px) and (max-height:500px){
 .topbar{padding:8px 20px}.brand{font-size:16px}.intro,.footer,.side-note{display:none}.layout{display:block;max-width:900px;padding:8px 14px}.game{display:grid;grid-template-columns:minmax(0,1fr) 235px;grid-template-rows:33px 42px 16px 26px minmax(45px,1fr) 34px 22px;column-gap:15px;padding:10px}.game .board-wrap{grid-column:1;grid-row:1/-1;height:100%}.game-top{grid-column:2;grid-row:1;height:auto}.scorebar{grid-column:2;grid-row:2;padding:3px 0}.scorebar strong{font-size:23px}.scorebar .best strong{font-size:18px;padding-top:3px}.garden-badge{width:32px;height:32px}.progress-label{grid-column:2;grid-row:3;margin:2px 0;font-size:9px}.progress-track{display:none}.instruction{grid-column:2;grid-row:4;margin:0;min-height:0;font-size:10px}.tray{grid-column:2;grid-row:5;margin:2px 0}.piece{height:100%;min-height:0;padding:4px}.mini-cell{width:13px;height:13px}.mini-cell .tile-svg{width:12px;height:12px}.piece-grid{gap:2px}.actions{grid-column:2;grid-row:6;padding:0}.actions button{min-height:32px;font-size:10px;padding:2px}.actions button span{font-size:16px}.game-foot{grid-column:2;grid-row:7;padding:0;min-height:22px;font-size:8px}.game-foot button{min-height:22px}.mode-switch button{min-height:28px;padding:4px 9px;font-size:10px}.game-top .icon-button{min-height:30px}.mode-switch{padding:2px}.game .board{padding:5px;gap:3px}
}
@media(max-width:720px){.layout{gap:0}}
