:root{color-scheme:light;--ink:#314835;--olive:#517b50;--deep:#34583f;--muted:#7b907a;--cream:#fffcf2;--linen:#f6f5e8;--line:#d6e5cd;--gold:#edbc61;--soil:#a07154;--pink:#cf8e83;--shadow:0 12px 35px #42734d18}
*{box-sizing:border-box}html{background:#eaf2df;min-height:100%}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 4% 4%,#fff9e9 0%,transparent 40%),radial-gradient(ellipse at 98% 20%,#d0e5d1 0%,transparent 40%),#ecf3e6;color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:not-allowed;opacity:.48}[hidden]{display:none!important}
:focus-visible{outline:3px solid #faab53;outline-offset:3px}
.app{max-width:1190px;padding:0 17px;margin:0 auto}
.top{display:flex;align-items:center;justify-content:space-between;height:62px;border-bottom:1px solid #bed3b8;gap:10px}
.studio{color:#536b50;text-decoration:none;font-size:11px;font-weight:900;letter-spacing:.16em;display:flex;gap:9px;align-items:center}.studio strong{color:#c5846f}
.studio:first-letter{font-size:21px}.top-actions{display:flex;align-items:center;gap:14px}
.beta{color:#8ea28a;font-size:9px;letter-spacing:.1em;font-weight:850}.sound,.help,.small-btn{background:#fffdf3;border:1px solid #cdddca;border-radius:10px;padding:9px 11px;color:#577456;font-weight:850}
.sound{width:35px;height:35px;border-radius:50%;font-size:19px;display:grid;place-items:center;padding:0}
.titlebar{display:flex;justify-content:space-between;align-items:center;padding:24px 4px 19px;gap:14px}
.eyebrow,.caps{font-size:9px;letter-spacing:.16em;font-weight:950;color:#8ca37a}.eyebrow span{color:#d7a864}
h1,h2,h3,p{margin-top:0}
h1{font:900 clamp(27px,4.6vw,48px)/1.06 Georgia,"Times New Roman",serif;letter-spacing:-.055em;color:#365b3e;margin:7px 0}
h1 span{font-size:.56em;color:#7ca078;letter-spacing:-.02em;vertical-align:middle}
.titlebar p{font-size:13px;color:#819379;margin:6px 0 0}
.season{display:flex;align-items:center;gap:10px;background:#f9f8e8;padding:11px 16px;border-radius:16px;border:1px solid #dae4c4;box-shadow:0 3px 0 #d1ddbf;min-width:155px}
.season-icon{font-size:30px}.season strong{font-size:11px;color:#637c4f;letter-spacing:.09em;display:block}.season small{display:block;font-size:11px;color:#a1a88a;margin-top:2px}
main{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(330px,.82fr);gap:16px;align-items:start}
.farm-card,.sidebar{background:#fffdf6;border:1px solid #dae4d3;border-radius:22px;box-shadow:var(--shadow);overflow:hidden}
.bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:16px 19px 12px;background:linear-gradient(120deg,#f8f9e9,#f9f6ec)}
.day{display:flex;align-items:center;gap:7px}.day-leaf{font-size:29px;color:#86a784}.day small,.day b{display:block}.day small{font-size:9px;letter-spacing:.1em;color:#8ea482;font-weight:850}.day b{font:800 24px Georgia,serif;color:#4d704c}
.resources{display:flex;align-items:center;gap:6px}.resource{display:flex;align-items:center;gap:5px;padding:7px 9px;background:#fffef9;border:1px solid #e2e6d0;border-radius:12px;font-size:13px;min-width:68px;justify-content:center}
.resource b{font-size:14px;color:#476a48;font-weight:900;font-variant-numeric:tabular-nums}.resource small{color:#a3b09a;font-size:10px}.resource span{font-size:16px}
.farm-head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:17px 20px 12px}
.farm-head h2{font:800 28px Georgia,serif;letter-spacing:-.035em;margin:4px 0 0;color:#52724f}.help{font-size:11px;white-space:nowrap}
.farm-scene{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(#b5dbed 0 24%,#9ed3a6 25% 40%,#86bd78 41% 100%);min-height:540px;border-top:1px solid #e4ecdc;border-bottom:4px solid #d5e3c9}
.hills{position:absolute;width:130%;height:180px;border-radius:50% 50% 0 0;left:-11%;pointer-events:none}
.h1{background:#93c49a;top:68px;transform:rotate(-4deg)}.h2{background:#78b47f;top:112px;transform:rotate(9deg);left:-12%}
.sun{position:absolute;top:22px;right:17%;width:57px;height:57px;background:#ffe9a7;border-radius:50%;box-shadow:0 0 0 12px #fff9cb31,0 0 60px #ffe99d80}
.cloud{position:absolute;width:82px;height:22px;background:#fff9e9a9;border-radius:50%;top:45px;left:14%}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.cloud:before{width:42px;height:34px;left:16px;bottom:3px}.cloud:after{width:38px;height:29px;left:40px;bottom:1px}.cloud.two{top:79px;left:71%;transform:scale(.68);opacity:.75}
.scene-decor{position:absolute;font-size:55px;z-index:1;opacity:.8;filter:drop-shadow(0 4px 5px #3961372a);pointer-events:none}.deco-left{left:-8px;top:182px}.deco-right{right:-11px;bottom:87px}
.farm-grounds{position:relative;z-index:2;margin:112px 15px 50px;padding:12px;border:8px solid #dcc5a0;border-radius:22px;background:#81b86a;box-shadow:inset 0 0 30px #4c91454f,0 14px 0 #78965c,0 22px 25px #42614255;min-height:380px}
.farm-grounds:before{position:absolute;content:"";inset:-12px;border:2px dashed #f3e8c5;border-radius:23px;pointer-events:none;opacity:.9}
.farm-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;position:relative;width:100%;align-items:stretch}
.tile{min-width:0;position:relative;aspect-ratio:1/1;border-radius:10px;border:2px solid #76a65d;background:linear-gradient(140deg,#a7d184,#7bad63);box-shadow:inset 0 2px #d7ecac,0 3px 0 #5d914d;display:grid;place-items:center;padding:1px;overflow:hidden;isolation:isolate;transition:transform .12s,filter .12s}
.tile:focus-visible{outline-offset:0;z-index:3}
.tile:hover{filter:brightness(1.07)}.tile:active{transform:translateY(2px);box-shadow:inset 0 2px #d7ecac,0 1px 0 #5d914d}
.tile .tile-icon{font-size:clamp(19px,3vw,35px);filter:drop-shadow(0 2px 1px #45634120);line-height:1}
.tile.ground:before{content:"";position:absolute;inset:6px 4px 5px;border-radius:7px;background:repeating-linear-gradient(15deg,#a56d4f 0 5px,#a56d4f 7px,#b47b59 8px 11px);border:2px solid #966446;box-shadow:inset 0 3px 3px #65462d55,0 2px 1px #e5c19e70}
.tile.ground .tile-icon{position:relative;z-index:1}
.tile.locked:before{background:repeating-linear-gradient(45deg,#87aa71,#87aa71 6px,#91b67b 7px,#91b67b 11px);border-color:#82a56b}
.tile.locked .tile-icon{font-size:23px;opacity:.8}
.tile.ready{border-color:#ffe0a0;box-shadow:inset 0 2px #fff4d0,0 3px 0 #9b9760,0 0 0 2px #fff2bb;animation:ready-glow 1.7s ease-in-out infinite}
@keyframes ready-glow{50%{filter:brightness(1.12)}}
.tile.watered:after{content:"💧";position:absolute;bottom:1px;right:1px;font-size:12px;z-index:2}
.tile .growth{position:absolute;bottom:3px;left:4px;right:4px;height:3px;border-radius:10px;background:#5d4937;z-index:2;overflow:hidden}.tile .growth span{display:block;height:100%;background:#d1e17e}
.tile.structure{background:linear-gradient(135deg,#aed189,#86b968);border-color:#b4d7a2}
.tile.structure .tile-icon{font-size:clamp(22px,4vw,41px)}.tile.structure.house{background:linear-gradient(140deg,#e9d8ad,#c0c998)}.tile.structure.path{border-color:transparent;background:#d4bd94;box-shadow:inset 0 2px #ebdcba}
.tile.structure.path .tile-icon{font-size:16px;opacity:.7}
.tile.structure.pond{background:radial-gradient(#8ce0db,#5bb7c0);border-color:#afdbbb;box-shadow:inset 0 2px #c5f1f0}
.tile.structure.pond .tile-icon{font-size:25px}
.tile.structure.forest{background:linear-gradient(145deg,#aed482,#83ad69);border-color:#91bd79}
.tile .plot-status{position:absolute;z-index:2;bottom:1px;left:2px;right:2px;border-radius:5px;background:#f9edd5e8;color:#70614a;font-size:8px;font-weight:900;text-align:center;white-space:nowrap}
.tile .plot-status.ready{background:#ffe9a2;color:#756032}
.tile svg{width:90%;height:90%;position:relative;z-index:1;overflow:visible;filter:drop-shadow(0 1px 2px #50391d45)}
.scene-caption{position:absolute;bottom:11px;left:17px;right:17px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#f9ffdc;text-shadow:0 1px 3px #32593d;font-weight:850;font-size:10px;letter-spacing:.03em}
.actions{padding:15px 17px 18px}.actions-label,.shelf-label{display:flex;justify-content:space-between;align-items:center;gap:10px}.actions-label b{font-size:14px}.actions-label span,.shelf-label small{font-size:11px;color:#93a18e}
.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:11px 0 18px}
.tool{background:#f3f6e9;border:1px solid #dce6d4;border-radius:12px;color:#638067;min-height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.tool span{font-size:25px}.tool b{font-size:11px;font-weight:800}.tool.selected{background:#e5f0d9;border:2px solid #78a478;box-shadow:0 3px 0 #bbd1ae;color:#426f45}
.shelf-label strong{font-size:13px}.seed-tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:10px}
.seed{background:#fff9ed;border:1px solid #e5e3d1;border-radius:12px;padding:10px 7px;display:flex;gap:6px;align-items:center;text-align:left;color:#506a4e;min-width:0}
.seed.selected{background:#e7f1dc;border:2px solid #7cab72;padding:9px 6px}
.seed .seed-symbol{font-size:23px}.seed .seed-copy{min-width:0}.seed b{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.seed small{display:block;font-size:9px;color:#94a28a;margin-top:4px}.seed.locked{opacity:.45}
.farm-message{background:#f6f7ee;margin-top:11px;border-radius:9px;padding:10px 11px;color:#72926e;font-size:11px;min-height:34px;line-height:1.3;text-align:center}
.sidebar{display:flex;flex-direction:column}
.nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:11px 11px 0;border-bottom:1px solid #e4e9d8;gap:2px}
.nav-tab{min-width:0;border:0;border-bottom:3px solid transparent;background:transparent;color:#879c7d;font-size:11px;font-weight:900;padding:9px 3px 11px;white-space:nowrap}
.nav-tab span{display:block;font-size:22px;margin-bottom:4px}.nav-tab.active{border-bottom-color:#73a274;background:#f0f5e8;color:#537551;border-radius:9px 9px 0 0}
.tab-body{min-height:420px;padding:18px 16px 12px}
.panel-head h2{font:800 27px/1.06 Georgia,serif;color:#4a6848;margin:6px 0}
.panel-head p{color:#889884;font-size:12px;line-height:1.55;margin:8px 0 15px}
.orders,.cards{display:grid;gap:9px}
.order,.card{background:#fbfaf1;border:1px solid #e4e9d9;border-radius:13px;padding:13px;display:flex;align-items:center;gap:9px;min-width:0}
.order .face,.card .face{font-size:26px;flex-shrink:0}.order-copy,.card-copy{flex:1;min-width:0}.order-copy strong,.card-copy strong{font-size:13px;display:block;color:#4d684d}
.order-copy small,.card-copy small{display:block;font-size:11px;color:#8b9b8b;line-height:1.35;margin-top:5px}.order.complete{background:#eff8e9;border-color:#b9d6b5}
.order button,.card button{background:#5e9670;border:0;border-radius:9px;color:white;padding:10px 11px;font-size:11px;font-weight:900;white-space:nowrap}.order button:disabled,.card button:disabled{background:#b4c9ad}
.welcome-mini{border-radius:12px;background:#f4f8e8;padding:12px;color:#7d9873;font-size:12px;line-height:1.5}
.card.recipe{align-items:start}.requirements{color:#779474;font-size:10px;margin-top:5px;font-weight:750}
.inventory{border-top:1px solid #e2e9d9;padding:16px;background:#f9fbf5}
.inventory-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.inventory h3{font:800 21px Georgia,serif;color:#4e6c4b;margin:6px 0 0}.inventory h3 span{font:600 12px system-ui;color:#9daf8b}.small-btn{font-size:11px}
.inventory-items{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.stock{display:flex;align-items:center;gap:5px;background:#fffdf6;border:1px solid #e3e9d9;border-radius:10px;padding:7px 9px;color:#608264;font-size:11px;font-weight:800}.stock span{font-size:19px}.stock em{font-style:normal;color:#9fae9b}
.next{padding:14px 15px;background:#e8f1df;border-top:1px solid #d1e3c6;display:flex;align-items:center;justify-content:space-between;gap:10px}
.next strong{display:block;font-size:12px;color:#58774f}.next span{display:block;font-size:10px;color:#86a079;margin-top:5px;line-height:1.4}
.next-btn{background:#4b875d;border:0;border-radius:11px;padding:13px 12px;color:#fff;font-size:11px;white-space:nowrap;font-weight:950;box-shadow:0 3px 0 #35654a;min-width:140px}.next-btn span{display:inline;color:#fff;font-size:12px;margin-left:4px}
.quest{background:#f4f6e9;border:1px solid #dae6ca;border-radius:13px;padding:14px 13px;margin:0 0 13px}.quest strong{display:block;font-size:14px}.quest p{font-size:11px;line-height:1.5;color:#879b7c;margin:8px 0}.quest-meter{height:9px;border-radius:10px;background:#d5e4cc;overflow:hidden}.quest-meter span{display:block;height:100%;background:linear-gradient(90deg,#7fb880,#b4d29b)}.quest small{display:block;font-size:10px;margin-top:7px;color:#7b9472}
.farm-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}.farm-stats div{border:1px solid #e1e9d6;background:#f7faf0;border-radius:10px;padding:12px;text-align:center}.farm-stats b{display:block;font-size:23px;color:#5c815a}.farm-stats small{font-size:10px;color:#92a58a}
.promise{display:flex;justify-content:center;gap:40px;text-align:center;margin:28px auto 0;color:#8fa487}.promise>div{display:flex;flex-direction:column;gap:4px}.promise span{font-size:25px}.promise b{font-size:12px;color:#617f5c}.promise small{font-size:10px}
footer{display:flex;justify-content:space-between;gap:12px;color:#9baa92;font-size:9px;font-weight:850;letter-spacing:.12em;padding:26px 4px 35px}
.toast-layer{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);z-index:20;pointer-events:none;width:min(90%,400px)}.toast{background:#496f4e;color:#fff;text-align:center;padding:12px;border-radius:11px;font-size:12px;font-weight:850;box-shadow:0 5px 20px #253e2860;animation:toastin .22s ease-out}.toast.warn{background:#b67b57}
@keyframes toastin{from{opacity:0;transform:translateY(8px)}}
.modal-layer{position:fixed;inset:0;display:grid;place-items:center;padding:15px;z-index:30;background:#233c2d9c;backdrop-filter:blur(4px)}
.dialog{background:#fffdf3;border:6px solid #e8eed9;border-radius:22px;padding:24px;max-width:380px;width:100%;box-shadow:0 20px 60px #14291960;text-align:center}
.dialog-icon{font-size:50px}.dialog h2{font:800 30px Georgia,serif;color:#52764f;margin:9px 0}.dialog p{font-size:13px;line-height:1.6;color:#80917b}
.dialog-btn{border:0;border-radius:11px;padding:15px;background:#5c9870;color:#fff;font-size:12px;font-weight:950;width:100%}.dialog-btn span{margin-left:6px}
@media(max-width:930px){.app{max-width:650px}main{display:flex;flex-direction:column}.farm-card,.sidebar{width:100%}.farm-scene{min-height:520px}.tab-body{min-height:315px}.titlebar{padding:16px 5px}}
@media(max-width:580px){.app{padding:0 7px}.top{height:49px;padding:0 8px}.beta{display:none}.titlebar{padding:13px 7px 13px}.titlebar h1{font-size:clamp(26px,7vw,35px)}.titlebar h1 span{display:block;font-size:.62em;margin-top:4px}.titlebar p{font-size:11px}.eyebrow{font-size:8px}.season{min-width:112px;padding:8px;gap:5px}.season-icon{font-size:23px}.season strong{font-size:8px}.season small{font-size:10px}.farm-card,.sidebar{border-radius:15px}
.bar{padding:10px 11px}.resource{min-width:56px;padding:5px 6px;gap:3px}.resource span{font-size:13px}.resource b{font-size:12px}.day b{font-size:21px}.day-leaf{font-size:24px}.farm-head{padding:13px 12px 10px}.farm-head h2{font-size:22px}.farm-head .caps{font-size:8px}.help span{display:none}
.farm-scene{min-height:410px}.hills{height:140px}.h1{top:47px}.h2{top:75px}.sun{width:40px;height:40px;top:12px}
.farm-grounds{margin:83px 9px 43px;padding:6px;border-width:6px;border-radius:17px;min-height:300px}
.farm-grid{gap:2px}.tile{border-width:1px;border-radius:7px}.tile.ground:before{inset:3px 2px 3px;border-width:1px;border-radius:4px}.tile .tile-icon{font-size:21px}.tile.structure .tile-icon{font-size:22px}.tile.locked .tile-icon{font-size:17px}.tile .plot-status{font-size:7px}.tile.watered:after{font-size:10px}.tile svg{width:90%;height:85%}.scene-caption{left:11px;right:11px;font-size:8px}
.actions{padding:13px 11px}.tool{min-height:64px}.tools{gap:5px;margin:9px 0 13px}.tool span{font-size:23px}.tool b{font-size:10px}
.seed-tray{gap:5px}.seed{padding:8px 4px;gap:3px}.seed.selected{padding:7px 3px}.seed .seed-symbol{font-size:21px}.seed b{font-size:9px}.seed small{font-size:8px}.tab-body{padding:15px 11px;min-height:285px}.panel-head h2{font-size:25px}.nav{padding:9px 6px 0}.nav-tab{font-size:10px}.nav-tab span{font-size:20px}.order button,.card button{font-size:10px;padding:9px 8px}.order,.card{padding:10px 9px;gap:6px}.order .face,.card .face{font-size:23px}.inventory{padding:12px}.next{padding:12px}.next-btn{min-width:127px;padding:11px 8px;font-size:10px}.promise{gap:25px;margin-top:21px}.promise small{font-size:9px}footer{padding:20px 7px 28px;font-size:8px}footer span{display:none}
}
@media(max-width:350px){.app{padding:0 4px}.resource{min-width:50px;padding:4px}.titlebar{gap:6px}.season{min-width:104px}.farm-grounds{margin-left:6px;margin-right:6px}.farm-grid{gap:1px}.tile .plot-status{font-size:6px}.seed .seed-symbol{font-size:17px}.seed b{font-size:9px}.tool b{font-size:9px}.resource b{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::after,*::before{animation-duration:.01ms!important;transition-duration:.01ms!important}}
