@import"https://fonts.googleapis.com/css2?family=Nothing+You+Could+Do&family=Walter+Turncoat&display=swap";:root{color-scheme:light;font-family:Walter Turncoat,Comic Sans MS,Comic Sans,cursive,ui-sans-serif,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #273126;--muted: #647067;--panel: rgba(255, 252, 244, .92);--panel-strong: #fffaf0;--line: rgba(47, 71, 53, .16);--accent: #dc5f43;--accent-dark: #9f3e2d;--sage: #5f8c61;--blue: #9ec6da;--shadow: 0 18px 45px rgba(68, 53, 36, .18)}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--ink);background:radial-gradient(circle at 18% 15%,rgba(255,246,209,.86),transparent 26rem),linear-gradient(180deg,#f8fbf7,#e8f0dc 56%,#d7cda9)}button,input{font:inherit}button{border:0;cursor:pointer}.app-shell{display:grid;grid-template-columns:minmax(0,1fr) 340px;min-height:100vh;overflow:hidden}.garden-stage{position:relative;display:grid;place-items:center;min-height:100vh;isolation:isolate;overflow:hidden}.garden-stage.is-planting{cursor:crosshair}.garden-stage.is-toying{cursor:copy}.sky-glow{position:absolute;inset:0;background:radial-gradient(circle at 28% 22%,rgba(255,240,166,.8),transparent 15rem),radial-gradient(circle at 72% 18%,rgba(255,255,255,.54),transparent 22rem);z-index:-3}.cloud{position:absolute;width:11rem;height:3.4rem;border-radius:999px;background:#ffffff8f;filter:blur(.2px);z-index:-2}.cloud:before,.cloud:after{position:absolute;content:"";border-radius:50%;background:inherit}.cloud:before{width:4.8rem;height:4.8rem;left:1.4rem;top:-1.9rem}.cloud:after{width:6rem;height:6rem;right:1.2rem;top:-2.5rem}.cloud-one{left:7%;top:14%}.cloud-two{right:10%;top:21%;transform:scale(.78)}.garden-island{position:relative;width:min(78vw,880px);aspect-ratio:1157 / 1120;filter:drop-shadow(0 42px 24px rgba(69,73,53,.18))}.garden-asset{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none}.island-base{position:absolute;bottom:calc(50% - min(38vw,450px));width:min(54vw,610px);height:3.6rem;border-radius:50%;background:#3944301f;z-index:-1;filter:blur(7px)}.planted-flower{position:absolute;transform-origin:center bottom;pointer-events:none;filter:drop-shadow(0 9px 5px rgba(40,65,35,.2))}.plant-preview{position:absolute;right:8%;bottom:9%;transform:rotate(7deg);filter:drop-shadow(0 8px 4px rgba(40,65,35,.22));opacity:.85;pointer-events:none}.garden-toy{position:absolute;width:clamp(74px,12.9%,129px);transform:translate(-50%,-82%);transform-origin:50% 82%;pointer-events:none;-webkit-user-select:none;user-select:none;object-fit:contain;filter:drop-shadow(0 9px 5px rgba(40,65,35,.22))}.garden-toy-dropping,.garden-toy-throwing{width:clamp(90px,15.2%,154px)}.garden-decor-flower{position:absolute;width:var(--decor-width);transform:translate(-50%,-92%) rotate(var(--decor-rotate));transform-origin:center bottom;pointer-events:none;-webkit-user-select:none;user-select:none;object-fit:contain;filter:drop-shadow(0 8px 5px rgba(40,65,35,.2));z-index:var(--decor-depth)}.garden-decor-flower-one{--decor-width: 7.1%;--decor-rotate: -7deg;--decor-depth: 236;left:23%;top:44%}.garden-decor-flower-two{--decor-width: 7.4%;--decor-rotate: 8deg;--decor-depth: 352;left:35%;top:56%}.garden-decor-flower-three{--decor-width: 6.6%;--decor-rotate: 9deg;--decor-depth: 468;left:67%;top:61%}.garden-decor-flower-four{--decor-width: 6.4%;--decor-rotate: -10deg;--decor-depth: 589;left:54%;top:72%}.sprite-animation{display:block;flex:0 0 auto}.animated-corgi{--corgi-scale-desktop: .426;--corgi-scale-mobile: .333;--corgi-scale: var(--corgi-scale-desktop);--corgi-x: 31%;--corgi-y: 62%;--corgi-depth: 620;position:absolute;left:var(--corgi-x);top:var(--corgi-y);width:416px;height:448px;pointer-events:auto;-webkit-user-select:none;user-select:none;cursor:default;transform:translate3d(-50%,-94.32%,0) scale(var(--corgi-scale));transform-origin:50% 94.32%;filter:drop-shadow(0 11px 6px rgba(40,65,35,.22));will-change:left,top,transform;z-index:var(--corgi-depth)}.animated-corgi .sprite-animation{position:absolute;left:50%;bottom:0;transform:translate(-50%);transform-origin:50% 94.32%;will-change:background-position,transform}.animated-corgi .corgi-walk-sprite{transform:translate(-50%) scaleX(var(--sprite-direction))}.animated-cat{--cat-scale-desktop: .42;--cat-scale-mobile: .36;--cat-scale: var(--cat-scale-desktop);--cat-direction: 1;--cat-x: 34%;--cat-y: 63%;--cat-depth: 640;--cat-hop-y: 0px;--cat-shadow-hop-y: 0px;--cat-shadow-opacity: 1;--cat-shadow-scale: 1;--cat-action-scale: 1;position:absolute;left:var(--cat-x);top:var(--cat-y);width:512px;height:512px;pointer-events:auto;cursor:pointer;touch-action:manipulation;transform:translate3d(-50%,calc(-96.5% + var(--cat-hop-y)),0) scale(var(--cat-scale)) scale(var(--cat-action-scale)) scaleX(var(--cat-direction));transform-origin:50% 96.5%;will-change:left,top,transform;z-index:var(--cat-depth)}.animated-cat:focus-visible{outline:3px solid rgba(220,95,67,.72);outline-offset:6px}.animated-cat.is-walking{transition:none}.animated-cat.cat-state-jumping{--cat-action-scale: 1.25}.cat-frame{position:absolute;inset:0;display:block;width:512px;height:512px;object-fit:contain;transform-origin:50% 96.5%;-webkit-user-select:none;user-select:none}.cat-toy-fallback{position:absolute;left:239px;top:321px;width:92px;height:92px;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 6px 3px rgba(40,65,35,.18));transform:translate(-50%,-50%) rotate(-10deg);transform-origin:50% 50%;animation:cat-toy-play-wiggle .96s steps(4,end) infinite}.cat-toy-fallback-carrot{width:104px;height:104px}.cat-ground-shadow{position:absolute;left:145px;top:422px;width:230px;height:44px;border-radius:50%;background:#23371f33;filter:blur(10px);opacity:var(--cat-shadow-opacity);transform:translate3d(0,var(--cat-shadow-hop-y),0) scale(var(--cat-shadow-scale));transform-origin:50% 50%}.cat-duo-interaction{--duo-scale-desktop: .64;--duo-scale-mobile: .55;--duo-scale: var(--duo-scale-desktop);--duo-x: 50%;--duo-y: 60%;--duo-depth: 614;position:absolute;left:var(--duo-x);top:var(--duo-y);width:512px;height:512px;pointer-events:none;transform:translate3d(-50%,-96.5%,0) scale(var(--duo-scale));transform-origin:50% 96.5%;will-change:transform;z-index:var(--duo-depth)}.cat-duo-frame{position:absolute;inset:0;display:block;width:512px;height:512px;object-fit:contain;transform-origin:50% 96.5%;-webkit-user-select:none;user-select:none}.cat-duo-shadow{position:absolute;left:124px;top:421px;width:270px;height:48px;border-radius:50%;background:#23371f36;filter:blur(11px)}@keyframes cat-toy-play-wiggle{0%,to{transform:translate(-50%,-50%) rotate(-12deg) scale(1)}33%{transform:translate(-47%,-54%) rotate(8deg) scale(1.05)}66%{transform:translate(-53%,-48%) rotate(-4deg) scale(.98)}}.tool-panel{display:flex;flex-direction:column;gap:1rem;align-self:stretch;min-width:0;padding:clamp(1rem,2.4vw,1.45rem);background:var(--panel);border-left:1px solid var(--line);box-shadow:-20px 0 45px #4839271a;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);overflow-y:auto}.brand-row,.panel-heading,.section-heading,.utility-row,.status-row,.toolbar,.slider-row{display:flex;align-items:center}.brand-row,.panel-heading,.section-heading{justify-content:space-between;gap:1rem}.eyebrow{margin:0 0 .18rem;color:var(--accent-dark);font-size:.76rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(1.7rem,2.3vw,2.3rem);line-height:.98}h2{margin-bottom:0;font-size:1.05rem}.mode-row{display:grid;grid-template-columns:1fr 1fr;gap:.45rem;padding:.35rem;border:1px solid var(--line);border-radius:8px;background:#ffffff80}.mode-button,.primary-action,.ghost-button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:2.55rem;border-radius:8px;color:var(--ink);transition:transform .16s ease,background .16s ease,box-shadow .16s ease}.mode-button{background:transparent;font-weight:750}.mode-button.active,.icon-button.active{background:#fff;box-shadow:0 5px 18px #56442b1f}.primary-action{width:100%;padding:0 1rem;background:var(--accent);color:#fffdf7;font-weight:800;box-shadow:0 10px 20px #bf493038}.ghost-button,.icon-button{background:#ffffff9e;border:1px solid var(--line)}.ghost-button{flex:1;padding:0 .8rem;font-weight:750}.icon-button{width:2.55rem;flex:0 0 2.55rem}.mode-button:hover,.primary-action:hover,.ghost-button:hover,.icon-button:hover,.cat-control-button:hover,.template-button:hover,.toy-button:hover,.toy-action-button:hover,.gallery-flower:hover{transform:translateY(-1px)}.draw-tools,.plant-card{display:grid;gap:.82rem}.drawing-pad{display:grid;gap:.8rem;justify-items:center}.flower-canvas{width:220px;height:220px;max-width:100%;touch-action:none;border:1px solid rgba(67,91,64,.22);border-radius:8px;background:linear-gradient(45deg,rgba(123,142,119,.08) 25%,transparent 25% 75%,rgba(123,142,119,.08) 75%),linear-gradient(45deg,rgba(123,142,119,.08) 25%,transparent 25% 75%,rgba(123,142,119,.08) 75%);background-position:0 0,10px 10px;background-size:20px 20px;box-shadow:inset 0 0 0 8px #ffffff7a}.toolbar{justify-content:center;gap:.45rem}.palette{display:grid;grid-template-columns:repeat(8,1fr);gap:.44rem}.swatch{aspect-ratio:1;min-width:0;border-radius:50%;border:2px solid rgba(255,255,255,.92);box-shadow:0 0 0 1px #34433233}.swatch.active{box-shadow:0 0 0 2px var(--ink),0 0 0 5px #ffffffe6}.slider-row{gap:.7rem;color:var(--muted);font-size:.9rem;font-weight:700}.slider-row input{flex:1;accent-color:var(--accent)}.slider-row output{width:1.8rem;text-align:right;color:var(--ink)}.plant-card{padding:1rem;border:1px solid var(--line);border-radius:8px;background:#ffffff7a}.plant-card img{width:110px;aspect-ratio:1;justify-self:center;object-fit:contain;filter:drop-shadow(0 8px 6px rgba(55,72,40,.18))}.plant-card p,.empty-copy{margin-bottom:0;color:var(--muted);line-height:1.45}.template-panel,.toy-panel{display:grid;gap:.65rem}.section-heading h2{color:#425443;font-size:.92rem;font-weight:850}.template-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.45rem}.template-button{display:grid;gap:.25rem;justify-items:center;min-width:0;padding:.45rem .32rem;border:1px solid var(--line);border-radius:8px;background:#ffffff8c;color:#40523e;font-size:.72rem;font-weight:800;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}.template-button.active{background:#fff;box-shadow:0 0 0 2px #dc5f4361,0 7px 16px #56442b1a}.template-button img{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 5px 3px rgba(55,72,40,.14))}.template-button span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.toy-action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;padding:.35rem;border:1px solid var(--line);border-radius:8px;background:#ffffff73}.toy-button,.toy-action-button{display:grid;min-width:0;border:1px solid var(--line);border-radius:8px;background:#ffffff8c;color:#40523e;font-weight:850;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}.toy-button{grid-template-columns:3rem minmax(0,1fr);align-items:center;gap:.55rem;min-height:3.35rem;padding:.42rem .55rem;font-size:.8rem;text-align:left}.toy-action-button{display:inline-flex;align-items:center;justify-content:center;gap:.42rem;min-height:2.4rem;padding:0 .6rem;font-size:.82rem}.toy-button.active,.toy-action-button.active{background:#fff;box-shadow:0 0 0 2px #dc5f4357,0 7px 16px #56442b1a}.toy-button img{width:3rem;height:3rem;object-fit:contain;filter:drop-shadow(0 5px 3px rgba(55,72,40,.16))}.toy-button span{min-width:0;line-height:1.08}.utility-row{gap:.55rem}.status-row{gap:.5rem;margin-top:auto;padding:.8rem .9rem;border-radius:8px;color:#375a47;background:#cae1c494;font-weight:750}.cat-controls{display:grid;gap:.75rem}.cat-control-group{display:grid;gap:.45rem}.cat-control-group h3{margin:0;color:#425443;font-size:.86rem;font-weight:850}.cat-control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.cat-control-button{display:inline-flex;align-items:center;justify-content:center;min-width:0;min-height:2.35rem;padding:0 .55rem;border-radius:8px;border:1px solid var(--line);background:#ffffff8f;color:var(--ink);font-size:.82rem;font-weight:800;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}.cat-control-button.active{background:#fff;box-shadow:0 0 0 2px #dc5f4357,0 7px 16px #56442b1a}.cat-control-button:disabled{cursor:not-allowed;opacity:.58;transform:none}.opening-letter-overlay{position:fixed;inset:0;display:grid;place-items:center;padding:1rem;z-index:1200;overflow:hidden;animation:letter-overlay-settle .52s ease-out both}.opening-letter-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 30% 18%,rgba(255,246,202,.72),transparent 18rem),linear-gradient(180deg,#fafcf7e6,#e8f0dce0);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.opening-letter-scene{position:relative;display:grid;place-items:center;width:min(92vw,26rem);transform:translateY(-1.4rem);z-index:1}.garden-letter-card{position:relative;width:273px;height:472px;transform-origin:center bottom;transform:scale(1.2);filter:drop-shadow(0 34px 24px rgba(61,48,36,.25));animation:letter-card-arrive .9s cubic-bezier(.19,1,.22,1) both}.garden-letter-card img{-webkit-user-select:none;user-select:none;pointer-events:none}.letter-envelope-back,.letter-envelope-front{position:absolute;left:0;top:62.7px;width:272.7px;height:409.4px;object-fit:fill}.letter-envelope-back{z-index:1}.letter-envelope-front{z-index:6}.letter-paper-wrap{position:absolute;left:34px;top:140px;width:204.6px;height:204.6px;z-index:4;overflow:hidden;box-shadow:0 3px 9px #281f163d;animation:letter-paper-open 1.5s .55s cubic-bezier(.18,.84,.28,1) forwards}.letter-paper{width:100%;height:100%;object-fit:cover}.letter-copy{position:absolute;inset:1rem 1.12rem 4.1rem;display:flex;flex-direction:column;gap:.24rem;color:#1b1a16bd;font-family:Nothing You Could Do,cursive;font-size:.82rem;line-height:1.16}.letter-copy p{margin:0}.letter-to,.letter-from{color:#1b1a1685}.letter-from{margin-top:.12rem;text-align:right}.letter-flower{--flower-rotate: 0deg;position:absolute;z-index:3;display:block;overflow:visible;filter:drop-shadow(0 5px 4px rgba(34,48,29,.16));opacity:0;animation:letter-flower-bloom .72s ease-out forwards}.letter-flower-one{--flower-rotate: -8deg;left:8px;top:91px;width:77px;height:153px;transform-origin:center bottom;animation-delay:1.3s}.letter-flower-two{--flower-rotate: 7deg;left:39px;top:78px;width:86px;height:120px;transform-origin:center bottom;animation-delay:1.42s}.letter-flower-three{--flower-rotate: 8deg;left:193px;top:104px;width:67px;height:120px;transform-origin:center bottom;animation-delay:1.54s}.letter-flower-four{--flower-rotate: -7deg;left:144px;top:36px;width:62px;height:120px;transform-origin:center bottom;animation-delay:1.66s}.letter-flower-art{position:absolute;display:block;max-width:none;-webkit-user-select:none;user-select:none;pointer-events:none}.letter-flower-one .letter-flower-art{left:-30.77%;top:-8.44%;width:151.31%;height:114.96%}.letter-flower-two .letter-flower-art{left:-20%;top:-.65%;width:140%;height:100.65%}.letter-flower-three .letter-flower-art{left:-25.69%;top:-15.48%;width:152.21%;height:127.74%}.letter-flower-four .letter-flower-art{left:-29.27%;top:-8.81%;width:151.22%;height:116.98%}.letter-close{position:absolute;left:50%;bottom:max(2rem,env(safe-area-inset-bottom));min-width:10rem;min-height:2.7rem;padding:0 1.1rem;border-radius:8px;background:#2f4d37;color:#fffaf0;font-weight:800;box-shadow:0 14px 28px #36452d38;transform:translate(-50%);opacity:0;z-index:2;animation:letter-close-appear .52s 2.3s ease-out forwards}.letter-close:focus-visible{outline:3px solid rgba(220,95,67,.72);outline-offset:4px}@keyframes letter-overlay-settle{0%{opacity:0}to{opacity:1}}@keyframes letter-card-arrive{0%{opacity:0;transform:translateY(2rem) scale(1.08) rotate(-2deg)}to{opacity:1;transform:translateY(0) scale(1.2) rotate(0)}}@keyframes letter-paper-open{0%{top:140px;transform:rotate(0)}66%{top:48px;transform:rotate(-1.2deg)}to{top:72px;transform:rotate(-.5deg)}}@keyframes letter-flower-bloom{0%{opacity:0;transform:translateY(.8rem) rotate(var(--flower-rotate)) scale(.84)}to{opacity:1;transform:translateY(0) rotate(var(--flower-rotate)) scale(1)}}@keyframes letter-close-appear{0%{opacity:0;transform:translate(-50%,.5rem)}to{opacity:1;transform:translate(-50%)}}.modal-backdrop{position:fixed;inset:0;display:grid;place-items:center;padding:1rem;background:#222c244d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:20}.gallery-panel{width:min(560px,100%);max-height:min(620px,88vh);overflow-y:auto;padding:1rem;border-radius:8px;background:var(--panel-strong);box-shadow:var(--shadow)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:.72rem;margin-top:1rem}.gallery-flower{display:grid;place-items:center;aspect-ratio:1;border-radius:8px;border:1px solid var(--line);background:#fff9}.gallery-flower img{width:76%;height:76%;object-fit:contain}@media(max-width:900px){.app-shell{grid-template-columns:1fr;grid-template-rows:minmax(430px,62vh) auto;overflow:visible}.garden-stage{min-height:auto}.garden-island{width:min(94vw,690px)}.tool-panel{border-top:1px solid var(--line);border-left:0;box-shadow:0 -15px 35px #48392714}}@media(max-width:560px){.app-shell{grid-template-rows:minmax(360px,52vh) auto}.garden-island{width:98vw}.animated-cat{--cat-scale: var(--cat-scale-mobile)}.cat-duo-interaction{--duo-scale: var(--duo-scale-mobile)}.animated-corgi{--corgi-scale: var(--corgi-scale-mobile)}.brand-row{align-items:flex-start}.palette{grid-template-columns:repeat(4,1fr)}.template-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.toy-button{grid-template-columns:2.7rem minmax(0,1fr)}.utility-row{flex-direction:column}.ghost-button{width:100%}.opening-letter-scene{width:min(96vw,22rem);transform:translateY(-2rem)}.garden-letter-card{transform:scale(.96)}.letter-copy{font-size:.78rem;line-height:1.18}@keyframes letter-card-arrive{0%{opacity:0;transform:translateY(1.6rem) scale(.9) rotate(-2deg)}to{opacity:1;transform:translateY(0) scale(.96) rotate(0)}}}