*{box-sizing:border-box}body{margin:0;background:#a1d8df;overflow:hidden;font-family:system-ui,-apple-system,sans-serif;color:#203f3b}canvas{display:block;width:100vw;height:100vh}header{position:absolute;inset:0 0 auto;display:flex;align-items:center;gap:14px;padding:24px 30px;background:linear-gradient(#f7fff3bc,transparent)}.brand{display:flex;align-items:center;gap:12px;font-size:33px;margin-right:auto}.brand div{font-size:18px;letter-spacing:2px;font-weight:900}.brand small{display:block;font-size:9px;letter-spacing:3px;margin-top:5px;color:#5b7970}.stat,button{border:1px solid #ffffff99;border-radius:14px;background:#fffdf0e8;padding:13px 20px;box-shadow:0 5px 15px #254f3510}.stat{font-size:10px;letter-spacing:1px}.stat b{display:block;font-size:19px;margin-top:3px;letter-spacing:0}button{cursor:pointer;font:inherit;color:inherit;transition:transform .15s,background .15s}button:hover{background:#fff;transform:translateY(-2px)}button:focus-visible{outline:3px solid #e79438;outline-offset:3px}aside{position:absolute;top:124px;left:30px;background:#fffdf0eb;border:1px solid #fff;border-radius:22px;padding:23px;width:245px;box-shadow:0 12px 35px #254f3515}small{font-size:9px;letter-spacing:1.5px;color:#778879}h2{font-size:23px;margin:9px 0 22px}aside p{font-size:13px}.bar{height:8px;background:#dfe8d9;border-radius:10px;overflow:hidden}.bar i{height:100%;width:0;display:block;background:#e8a253;border-radius:10px;transition:width .1s}.stats{display:flex;justify-content:space-between;margin:23px 0 10px;font-size:13px}.energy i{background:#6aab8e;width:100%}.hint{color:#7c8c7a;line-height:1.6;margin-bottom:0}footer{position:absolute;bottom:23px;left:50%;transform:translateX(-50%);display:flex;gap:25px;background:#fffdf0e8;padding:16px 24px;border-radius:18px;white-space:nowrap;font-size:12px}kbd{font:11px system-ui;background:#eaf0e3;border:1px solid #c8d7c1;border-radius:5px;padding:4px 7px}#overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;padding:20px;background:#233c394c;backdrop-filter:blur(6px)}#overlay.hidden{display:none}#panel{background:#fffdf0f5;border:1px solid white;box-shadow:0 25px 90px #23443240;text-align:center;max-width:490px;width:100%;padding:38px;border-radius:30px;max-height:90vh;overflow:auto}.emblem{font-size:62px}h1{font-family:Georgia,serif;font-size:46px;font-weight:500;line-height:1.05;margin:16px 0}#panel p{color:#6d8073;font-size:14px;line-height:1.8}.primary{background:#285e4b;color:white;border:0;display:block;margin:22px auto 0;padding:16px 30px;font-weight:700}.primary:hover{background:#397e65}.sub{display:block;margin:12px auto 0;background:transparent;border:0;box-shadow:none;font-size:12px}#toast{position:absolute;left:50%;top:110px;transform:translateX(-50%);padding:12px 23px;background:#fffdf0ef;border-radius:30px;opacity:0;transition:opacity .2s;pointer-events:none;font-weight:700}.touch{display:none;position:absolute;bottom:25px;left:20px;right:20px;justify-content:space-between;align-items:end;pointer-events:none}.touch button{pointer-events:auto;touch-action:none;min-width:48px;padding:14px}.touch>button{font-size:25px;width:75px;height:75px}@media(pointer:coarse){.touch{display:flex}footer{display:none}}@media(max-width:650px){header{padding:12px;gap:7px}.brand{font-size:25px}.brand div{font-size:12px;letter-spacing:1px}.brand small{font-size:7px;letter-spacing:1px}.stat{padding:9px;font-size:8px}.stat b{font-size:14px}header button{padding:11px}aside{left:12px;top:90px;width:175px;padding:15px}aside small{font-size:7px}h2{font-size:18px;margin-bottom:12px}.hint{display:none}footer{font-size:10px;gap:12px;padding:12px}footer span:last-child{display:none}#panel{padding:27px}h1{font-size:38px}}

.shop-item{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:15px;border-top:1px solid #d9e2d0;padding:17px 0}.shop-item b{font-size:15px}.shop-item small{display:block;letter-spacing:0;font-size:12px;line-height:1.5;margin:6px 0}.shop-item span{font-size:11px;color:#548569}.shop-item button{white-space:nowrap;min-width:80px;font-weight:700;background:#e8edcd}.shop-item button:disabled{opacity:.45;cursor:default;transform:none}.shop-note{font-size:11px!important}.treats{background:#fff0ca}#shop{font-weight:700}#shop kbd{margin-left:5px}@media(max-width:800px){header{flex-wrap:wrap;gap:7px;padding:12px}.brand{flex:1}.stat{padding:8px;font-size:8px}.stat b{font-size:14px}#shop{padding:10px;font-size:11px}#shop kbd{display:none}aside{top:145px}header .brand small{letter-spacing:1px}.shop-item{gap:8px}.shop-item button{padding:12px}}