:root{--ink:#1d2414;--blue:#25a9f2;--green:#baff7c;--lime:#8fd126;--cream:#f8ffd9;--wood:#a76018;--tile:58px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:#0c1015;font-family:"Arial Rounded MT Bold","Microsoft YaHei",sans-serif;color:var(--ink);overflow:hidden}
button{font:inherit;cursor:pointer;touch-action:manipulation}
.app{position:relative;width:min(100vw,430px);height:100dvh;min-height:620px;margin:auto;overflow:hidden;background:#baff7c url('assets/farm-background.png') center/cover no-repeat;box-shadow:0 0 40px #000}
.screen{position:absolute;inset:0;display:none}.screen.active{display:block}
.home{background:linear-gradient(#0087ff11,#a7ff6133),url('assets/farm-background.png') center/cover no-repeat;padding:28px 18px calc(20px + env(safe-area-inset-bottom))}
.home-top{display:flex;justify-content:space-between;align-items:center}.menu-button,.square-button{width:52px;height:52px;border:4px solid #111;border-radius:14px;background:#fff;box-shadow:0 6px 0 #23333a;padding:8px}.menu-button span{display:block;height:5px;background:#111;border-radius:4px;margin:5px}.streak{display:flex;align-items:center;gap:8px;background:#2d2d2d;border:4px solid #111;border-radius:22px;padding:7px 18px;color:#fff;font-size:22px}.bell-mark{color:#ffd719;text-shadow:0 0 0 #111}.planet-title{position:absolute;top:22%;left:50%;transform:translateX(-50%);white-space:nowrap;color:#d8ff00;background:#050505;padding:12px 25px;border-radius:18px;font-size:29px;box-shadow:0 6px 0 #0008}.planet-title:first-letter{color:#26ff22}.planet-title i{color:#ff55cd;font-style:normal}.home-copy{position:absolute;left:50%;top:57%;transform:translateX(-50%);width:82%;text-align:center;background:#fffde9df;border:4px solid #202020;border-radius:20px;padding:12px;box-shadow:0 7px 0 #0006}.home-copy p{margin:0;font-size:23px;font-weight:900}.home-copy small{font-weight:700}.join-button{position:absolute;bottom:78px;left:50%;transform:translateX(-50%);width:62%;padding:14px 12px;border:5px solid #111;border-radius:18px;background:#fff;font-size:34px;font-weight:1000;box-shadow:0 8px 0 #111}.join-button:active{transform:translate(-50%,5px);box-shadow:0 3px 0 #111}.home-footer{position:absolute;bottom:16px;left:10px;right:10px;display:flex;justify-content:space-between}.home-footer button{border:3px solid #111;border-radius:14px;background:#fff;padding:8px 12px;font-weight:900;box-shadow:0 4px 0 #111}
.game{background:#baff7c;padding:calc(14px + env(safe-area-inset-top)) 14px calc(8px + env(safe-area-inset-bottom));background-image:radial-gradient(circle at 15% 30%,#80c932 0 2px,transparent 3px),radial-gradient(circle at 80% 15%,#80c932 0 2px,transparent 3px)}
.game-header{height:72px;display:grid;grid-template-columns:54px 1fr 54px;align-items:start;gap:12px}.square-button{width:48px;height:48px;background:#22a9f4;color:#fff;font-size:40px;line-height:24px;text-shadow:0 3px #111}.square-button.sound{font-size:26px}.date-badge{text-align:center;background:#050505;border-radius:14px;color:#fff;padding:6px 22px;font-size:22px;justify-self:center;box-shadow:0 4px 0 #0007}.date-badge small{display:block;font-size:11px;color:#d8ff86}.progress{height:9px;background:#5f951e;border:2px solid #30430d;border-radius:10px;margin:0 18%;overflow:hidden}.progress i{display:block;height:100%;width:0;background:#fff62c;transition:width .25s}.hint{text-align:center;margin:5px 0 0;font-size:12px;font-weight:900;color:#47750d}.board{position:relative;height:52vh;min-height:330px;max-height:500px;margin-top:0;transform-origin:top center}.tile{position:absolute;width:var(--tile);height:var(--tile);border:3px solid #455419;border-radius:9px;background:#f6ffd9;box-shadow:0 6px 0 #77a716,0 8px 5px #38550055;transition:transform .18s,opacity .18s,filter .18s;display:grid;place-items:center;padding:5px}.tile.covered{filter:brightness(.68) saturate(.65);cursor:not-allowed}.tile.covered:after{content:"";position:absolute;inset:0;background:#2e411244;border-radius:5px}.tile.available:hover{transform:translateY(-3px)}.tile.removing{transform:scale(.3) translateY(80px);opacity:0}.sprite{display:block;width:100%;height:100%;background-image:url('assets/farm-sprites.png');background-size:400% 200%;background-repeat:no-repeat}.sprite.carrot{background-position:0 0}.sprite.corn{background-position:33.333% 0}.sprite.grass{background-position:66.666% 0}.sprite.bell{background-position:100% 0}.sprite.milk{background-position:0 100%}.sprite.shears{background-position:33.333% 100%}.sprite.fire{background-position:66.666% 100%}.sprite.yarn{background-position:100% 100%}
.holding{height:38px;display:flex;gap:5px;justify-content:center;align-items:center}.holding .mini{width:36px;height:36px;border:2px solid #38450e;border-radius:7px;background:#f7ffdb;padding:2px}.trough-wrap{background:#925117;border:5px solid #613408;border-radius:12px;padding:8px 8px 10px;box-shadow:inset 0 6px #c37a27,0 6px 0 #53310d;margin:0 4px}.tray{height:54px;display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.slot{min-width:0;border:2px solid #6d390c;border-radius:7px;background:#b87127;box-shadow:inset 0 3px #75400e;padding:2px}.slot.filled{background:#f7ffdb;border-color:#39450f;animation:drop .2s ease-out}.slot.match{animation:match .3s forwards}.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:15px 8px 0}.tools button{position:relative;height:74px;background:#26a9ef;border:4px solid #284516;border-radius:12px;box-shadow:0 7px 0 #426d1c;color:#fff;text-shadow:0 3px #111;display:flex;flex-direction:column;align-items:center;justify-content:center}.tools button:disabled{filter:grayscale(.8);opacity:.55}.tools b{font-size:18px}.tools em{position:absolute;right:-7px;top:-10px;background:#050505;border-radius:50%;width:27px;height:27px;display:grid;place-items:center;font-style:normal}.tool-icon{font-size:28px;line-height:25px;color:#ffd922}.modal{position:absolute;inset:0;z-index:100;background:#0008;display:grid;place-items:center;padding:26px}.modal[hidden]{display:none}.modal-card{width:100%;background:#fffde6;border:5px solid #15190b;border-radius:24px;padding:26px 22px;text-align:center;box-shadow:0 10px 0 #111}.modal-badge{width:64px;height:64px;margin:-60px auto 8px;border-radius:50%;background:#ffe129;border:5px solid #111;display:grid;place-items:center;font-size:38px;font-weight:1000}.modal h2{font-size:31px;margin:6px}.modal p{line-height:1.6}.modal button{display:block;width:100%;margin-top:10px;padding:12px;border:4px solid #111;border-radius:14px;background:#23aaeF;font-size:20px;font-weight:900;box-shadow:0 5px 0 #173d50}.modal button.secondary{background:#fff;box-shadow:0 5px 0 #777}.toast{position:absolute;z-index:120;left:50%;bottom:145px;transform:translate(-50%,20px);background:#111e;color:#fff;border-radius:18px;padding:9px 18px;opacity:0;pointer-events:none;transition:.2s;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes drop{from{transform:translateY(-60px) scale(.6)}to{transform:none}}@keyframes match{to{opacity:0;transform:scale(.2) rotate(12deg)}}
@media(max-height:720px){:root{--tile:52px}.board{height:46vh;min-height:285px}.tools{margin-top:10px}.tools button{height:62px}.game-header{height:62px}}