:root{--ink:#3c3422;--muted:#807459;--cream:#fff4d5;--wood:#8c5d32;--dark:#2e3827;--green:#48783b;--gold:#e5b64d;--line:#c6a56a;font-family:Georgia,'Times New Roman',serif;color:var(--ink);font-size:16px}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#263322}button,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,canvas:focus-visible{outline:3px solid #ffd25c;outline-offset:3px}[hidden]{display:none!important}.topbar{height:68px;background:#f8f2dc;display:flex;align-items:center;padding:0 28px;gap:40px;border-bottom:3px solid #514a32;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:bold;letter-spacing:2px;white-space:nowrap}.brand small{display:block;font:9px monospace;letter-spacing:2.1px;margin-top:3px;color:#837b5d}.brand-flower{font-size:34px;color:#9f7430}.location{display:flex;gap:15px;font:12px monospace;color:#817c63}.location>span:first-child{color:#485039;font-weight:bold}.separator{color:#c7bc9c}.top-actions{display:flex;align-items:center;gap:16px;margin-left:auto}.test-pill{font:10px monospace;letter-spacing:.6px;border:1px solid #d2c7a7;padding:5px 7px;color:#8c8161}.top-actions button{border:0;background:none;font-size:14px}.top-actions .icon-button{border:1px solid #bfb596;border-radius:50%;width:25px;height:25px;padding:0}.top-actions button span{margin-left:9px}#game{position:relative;width:100%;height:calc(100dvh - 68px);isolation:isolate;overflow:hidden}#world{display:block;width:100%;height:100%;image-rendering:pixelated;outline:none;touch-action:none}.vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 120px #193d382e;z-index:1}.hud{background:#fff2d4f5;border:2px solid #725436;box-shadow:inset 0 0 0 2px #ffefd0,inset 0 0 0 3px #c1a776,3px 4px 0 #23342750}.welcome{position:absolute;left:26px;top:24px;padding:17px 20px;min-width:245px}.mini-label{display:block;font:10px monospace;letter-spacing:1.3px;color:#8e7650}.welcome h1{font-size:23px;margin:7px 0 9px;font-weight:normal}.season{font-size:13px;display:flex;align-items:center;gap:9px;color:#64744a}.leaf{font-size:22px;line-height:12px}.save-status{font:10px monospace;color:#998762;margin-top:11px}.clock-card{position:absolute;right:26px;top:24px;width:244px;padding:9px 13px}.clock-top{display:flex;align-items:center;gap:9px;border-bottom:1px solid #d1ba87;padding:2px 0 10px}.clock-top strong{display:block;font-size:15px;font-weight:normal;margin-top:4px}.clock-top .mini-label{font-size:9px}.sun{color:#d8a234;font-size:35px;line-height:35px}.wallet-line{border:0;width:100%;background:none;padding:10px 0 2px;display:flex;align-items:center;gap:8px}.wallet-line strong{font:700 18px monospace}.wallet-line>span:nth-of-type(2){font-size:10px;color:#8a7656}.wallet-line b{margin-left:auto;color:#937039}.coin-icon{display:inline-grid;place-items:center;width:22px;height:22px;background:#efd16c;border:2px solid #b18431;border-radius:50%;font:12px monospace;color:#8f5f21}.side-actions{position:absolute;right:26px;top:155px;display:flex;flex-direction:column;gap:11px}.side-actions button{width:63px;height:66px;background:#fff0cc;border:2px solid #705134;box-shadow:inset 0 0 0 2px #e8cf99,2px 3px 0 #29412266;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px}.side-actions button:hover,.hotbar button:hover{background:#ffe5a0;transform:translateY(-2px)}.side-actions span{font:10px monospace}.item-icon{width:30px;height:30px;image-rendering:pixelated;display:block}.map-controls{position:absolute;left:27px;top:170px;display:flex;border:2px solid #775635;box-shadow:2px 3px #23342744}.map-controls button{border:0;border-right:1px solid #c4a775;background:#fff0cf;width:32px;height:30px;font-size:21px;line-height:20px}.map-controls button:last-child{border-right:0}.map-position{position:absolute;left:27px;top:214px;background:#283e26bc;color:#f3edce;padding:6px 10px;font:10px monospace;letter-spacing:.6px}.bottom-left{position:absolute;bottom:63px;left:26px;display:flex;align-items:center;gap:12px;color:#fff3d0;text-shadow:1px 2px #334428}.bottom-left>canvas{width:62px;height:62px;background:#f0dca4;border:3px solid #795532;box-shadow:inset 0 0 0 2px #f8ecc7;image-rendering:pixelated}.bottom-left .mini-label{color:#dbddb4;font-size:9px}.bottom-left strong{display:block;margin:5px 0;font-size:17px}.bottom-left button{border:0;background:none;padding:0;color:#ede7c2;text-shadow:1px 1px #334428;font-size:11px;text-decoration:underline}.hotbar{position:absolute;bottom:49px;left:50%;transform:translateX(-50%);display:flex;background:#a7783a;border:3px solid #563e27;padding:5px;box-shadow:inset 0 0 0 2px #e6c37d,4px 5px 0 #21382766;gap:4px}.hotbar button{position:relative;width:65px;height:64px;background:#e8d6a6;border:2px solid #aa834e;box-shadow:inset 0 0 0 2px #f6e9c1;display:flex;align-items:center;justify-content:center;flex-direction:column}.hotbar button.selected{border-color:#5b703c;background:#f8e29b;box-shadow:inset 0 0 0 2px #d9b45e;outline:2px solid #edd784}.hotbar kbd{position:absolute;top:2px;left:4px;font:9px monospace;color:#94774f}.hotbar span{font:9px monospace;margin-top:3px}.hotbar .item-icon{width:32px;height:32px}.minimap{position:absolute;right:26px;bottom:48px;padding:7px;width:182px}.minimap>div{display:flex;justify-content:space-between;font:9px monospace;color:#8c7957;padding:2px 2px 7px}#mini{width:164px;height:104px;display:block;image-rendering:pixelated;border:1px solid #a58c58}.bottom-hint{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:23px;color:#eff0d6;text-shadow:1px 1px #314127;font-size:11px;white-space:nowrap}kbd{font:10px monospace;background:#fff4d5cc;color:#5e5c44;padding:3px 5px;border:1px solid #b3b38d;box-shadow:0 1px #52613f;margin-right:3px}.interaction{position:absolute;left:50%;bottom:144px;transform:translateX(-50%);background:#fff4d9;border:2px solid #735432;padding:9px 13px;box-shadow:3px 3px #2c382044;display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:14px}.interaction button{border:0;border-left:1px solid #b99d6b;background:none;margin-left:6px;padding-left:12px;font-size:12px;color:#527144}.touch-pad{display:none}#toast{position:absolute;bottom:154px;left:50%;transform:translate(-50%,12px);opacity:0;transition:opacity .2s,transform .2s;background:#fff0ce;color:#574221;border:2px solid #87663b;padding:12px 20px;max-width:90%;text-align:center;box-shadow:3px 4px #24392755;pointer-events:none;z-index:6;font-size:14px}#toast.show{opacity:1;transform:translate(-50%,0)}#connection-error{position:absolute;bottom:130px;left:25px;background:#faf0d5;color:#8f4329;padding:12px;font-size:13px;max-width:300px}dialog{border:3px solid #705134;padding:0;background:#fff1d4;color:var(--ink);width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 48px);box-shadow:inset 0 0 0 2px #efd3a0,8px 8px #162b2555;overflow-y:auto}dialog::backdrop{background:#182c2c80;backdrop-filter:blur(3px)}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:22px 25px 16px;background:#f0dcaf;border-bottom:2px solid #c3a879;position:sticky;top:0;z-index:2}.panel-head h2{font-size:27px;margin:5px 0 0;font-weight:normal}.close{border:1px solid #b29460;box-shadow:inset 0 0 0 1px #ffedc7;background:#e7d09f;color:#80603e;width:31px;height:31px;font-size:25px;line-height:25px}#panel-body{padding:22px 25px}.panel-foot{border-top:1px solid #d3bd8e;padding:14px 25px;display:flex;justify-content:space-between;color:#947e5a;font:10px monospace}.subtext{font-size:14px;line-height:1.6;color:#887658;margin:0 0 19px}.shop-row,.inventory-row,.animal-row,.history-row{display:flex;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid #dcc69b}.shop-row:last-child,.inventory-row:last-child{border-bottom:0}.shop-row canvas,.inventory-row canvas,.animal-row canvas{width:52px;height:52px;image-rendering:pixelated;background:#e9dbad;border:1px solid #cab286}.row-info{flex:1}.row-info h3{font-size:19px;font-weight:normal;margin:0 0 5px}.row-info p{font-size:12px;color:#877251;margin:0;line-height:1.6}.primary,.secondary{border:2px solid #3f5b31;box-shadow:inset 0 0 0 1px #799050,0 2px #2a442a;background:#547643;color:#fff1cc;padding:10px 16px;font-size:14px}.primary:hover{background:#65894a}.secondary{background:#ebd09a;border-color:#ab844a;box-shadow:inset 0 0 0 1px #fff0c8,0 2px #9b783e;color:#76512d}.full{width:100%;margin-top:14px}.empty{padding:25px 0;text-align:center;color:#98815a;font-size:14px;line-height:1.7}.sum-line{display:flex;align-items:center;justify-content:space-between;margin:22px 0;font-size:17px}.wallet-big{font:36px monospace;text-align:center;margin:28px 0}.history-row{justify-content:space-between;font-size:13px}.history-row strong{font-family:monospace}.history-row .positive{color:#5d7d3b}.upgrade{border:1px solid #cdb488;padding:20px;margin-bottom:14px;background:#fae8c0}.upgrade h3{font-size:19px;font-weight:normal;margin:0 0 9px}.upgrade p{font-size:14px;color:#897554;line-height:1.5}.upgrade button{margin-top:6px}.key-row{display:flex;gap:20px;border-bottom:1px solid #d8c299;padding:13px 0;font-size:14px;align-items:center}.key-row>span:first-child{min-width:100px}.character-options{display:flex;justify-content:center;gap:20px}.character-options button{padding:15px;border:2px solid #b09259;background:#efdfb1;display:flex;flex-direction:column;align-items:center;gap:10px}.character-options button.active{border-color:#547b38;outline:2px solid #80a253}.character-options canvas{width:85px;height:85px;image-rendering:pixelated}.auth-flower{display:block;font-size:46px;color:#a87f35}#auth-form{padding:28px;position:relative}#auth-form .close{position:absolute;right:20px;top:20px}#auth-form h2{font-size:30px;font-weight:normal;margin:10px 0}#auth-subtitle{font-size:14px;line-height:1.5;color:#8e7b58}label{display:block;font-size:14px;margin-top:17px}input{display:block;width:100%;padding:11px;border:1px solid #bea16d;background:#fff8e8;color:#493d2b;margin-top:7px;border-radius:0}input:focus{outline:2px solid #899647}#auth-error{font-size:14px;color:#a2442f}.link-button{display:block;margin:18px auto 0;border:0;background:none;color:#6f773e;font-size:14px;text-decoration:underline}
@media(max-width:950px){.location{display:none}.topbar{padding:0 18px;gap:15px}.test-pill{display:none}.welcome{left:16px;top:16px;min-width:210px;padding:14px}.clock-card{right:16px;top:16px;width:220px}.side-actions{right:16px;top:145px}.minimap{right:16px;width:135px}.minimap #mini{width:117px;height:82px}.bottom-left{left:16px}.bottom-left>div{display:none}.hotbar button{width:56px}.map-controls{left:17px;top:158px}.map-position{left:17px;top:199px}.bottom-hint{font-size:10px;gap:14px}.bottom-hint>span:last-child{display:none}}
@media(max-width:600px){.topbar{height:57px;padding:0 12px}.brand{font-size:16px;letter-spacing:1px}.brand small{font-size:7px}.brand-flower{font-size:27px}.top-actions{gap:8px}.top-actions .icon-button{display:none}#account-button{font-size:11px;max-width:130px}.top-actions button span{display:none}#game{height:calc(100dvh - 57px)}.welcome{min-width:0;max-width:51%;left:10px;top:10px;padding:10px}.welcome h1{font-size:17px;margin:6px 0}.welcome .mini-label{font-size:8px}.season{font-size:10px;gap:4px}.save-status{font-size:8px;max-width:155px;line-height:1.5}.clock-card{right:10px;top:10px;width:155px;padding:7px}.clock-top .mini-label{font-size:7px}.clock-top strong{font-size:12px;line-height:1.3}.sun{font-size:26px}.wallet-line>span:nth-of-type(2){display:none}.wallet-line strong{font-size:16px}.side-actions{right:10px;top:143px;gap:8px}.side-actions button{width:48px;height:52px}.side-actions .item-icon{width:26px;height:26px}.side-actions span{font-size:8px}.map-controls{left:10px;top:145px}.map-position{left:10px;top:185px;font-size:9px}.bottom-left{bottom:154px;left:12px}.bottom-left>canvas{width:45px;height:45px}.minimap{display:none}.hotbar{bottom:33px;padding:4px;gap:3px}.hotbar button{width:54px;height:58px}.hotbar span{font-size:8px}.bottom-hint{bottom:9px;font-size:9px}.bottom-hint>span{display:none}.bottom-hint:after{content:'Toca el sendero para caminar · Toca los edificios para entrar'}.interaction{bottom:112px;font-size:12px;max-width:90%;white-space:normal;padding:7px}.panel-head{padding:18px}#panel-body{padding:18px}.panel-foot{padding:12px;gap:10px;font-size:9px}.shop-row{gap:9px}.shop-row canvas{width:40px;height:40px}.shop-row button{padding:8px;font-size:12px}.row-info h3{font-size:17px}.row-info p{font-size:11px}.touch-pad{position:absolute;bottom:220px;left:12px;display:grid;grid-template-columns:repeat(3,32px);grid-template-rows:repeat(2,30px);gap:3px}.touch-pad button{background:#fff0c9cc;border:1px solid #8e774e;font-size:12px;touch-action:none}.touch-pad [data-dir=up]{grid-column:2}.touch-pad [data-dir=left]{grid-row:2;grid-column:1}.touch-pad [data-dir=down]{grid-row:2;grid-column:2}.touch-pad [data-dir=right]{grid-row:2;grid-column:3}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

#panel-feedback{margin:0 24px 18px;padding:12px 15px;border:1px solid #bccb9f;background:#edf3de;color:#4e6538;border-radius:8px;font-size:14px;line-height:1.5}
@media(max-height:800px) and (min-width:601px){.minimap{width:142px!important}.minimap #mini{width:124px!important;height:78px!important}.side-actions button{height:66px!important;width:65px!important}.side-actions{gap:9px!important}}
/* Crisp interface typography, independent of the pixel-art world. */
:root{font-family:"Segoe UI",Tahoma,Arial,sans-serif}
button,input,select{font-family:inherit}select{display:block;width:100%;padding:12px;border:1px solid #b69e73;background:#fffaf0;color:#403b2d;margin-top:8px;font-size:15px;border-radius:8px}
body{font-size:16px}.brand,.welcome h1,.panel-head h2,#auth-form h2{font-family:Georgia,serif}
.brand small{font:10px "Segoe UI",sans-serif;letter-spacing:1.5px}.location{font:13px "Segoe UI",sans-serif}
.test-pill{font:11px "Segoe UI",sans-serif}.top-actions button{font-size:14px}
.mini-label{font:600 12px "Segoe UI",sans-serif;letter-spacing:1px}.clock-top .mini-label{font-size:11px}
.save-status{font:12px "Segoe UI",sans-serif;line-height:1.5}.season{font-size:14px}
.wallet-line>span:nth-of-type(2){font-size:12px}.wallet-line strong{font:700 20px "Segoe UI",sans-serif}
.side-actions span{font:600 12px "Segoe UI",sans-serif}.side-actions button{width:72px;height:74px;border-radius:9px;box-shadow:inset 0 1px #fff8df,0 4px 12px #263c2633;border-color:#947344}
.hotbar{border-radius:13px;box-shadow:inset 0 0 0 2px #e6c37d,0 5px 18px #21382766}
.hotbar button{width:74px;height:70px;border-radius:7px}.hotbar span{font:600 12px "Segoe UI",sans-serif}
.hotbar kbd{font:11px "Segoe UI",sans-serif}.hotbar .item-icon{width:36px;height:36px}.item-icon{image-rendering:auto}
.bottom-hint{font-size:13px}.bottom-hint kbd{font:12px "Segoe UI",sans-serif}.map-position{font:13px "Segoe UI",sans-serif;border-radius:6px}
.minimap>div{font:12px "Segoe UI",sans-serif}.bottom-left .mini-label{font-size:11px}.bottom-left button{font-size:13px}
#world{image-rendering:auto}
#map-overlays{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.map-sign{position:absolute;left:0;top:0;pointer-events:auto;min-width:120px;padding:8px 17px 8px;background:linear-gradient(#fff9df,#f1dfb7);border:1px solid #a58753;border-radius:9px;box-shadow:0 3px 0 #896c40,0 6px 12px #243c2b36;display:flex;align-items:center;flex-direction:column;gap:2px;white-space:nowrap}
.map-sign:before,.map-sign:after{content:"";position:absolute;top:13px;width:4px;height:4px;background:#b49d73;box-shadow:inset 0 1px #725b35;border-radius:50%}.map-sign:before{left:7px}.map-sign:after{right:7px}
.map-sign strong{font-size:14px;font-weight:650;color:#4b4f34}.map-sign small{font-size:12px;color:#8e7b56}
.map-sign:hover,.map-sign.near{border-color:#6f8a42;background:linear-gradient(#fffcdd,#eddfab);box-shadow:0 3px #698141,0 6px 12px #243c2b36}
.map-animal-target,.map-plot-target{position:absolute;pointer-events:auto;background:transparent;border:0;padding:0;border-radius:10px}
.map-animal-target:hover{outline:2px solid #f4eab099;background:#fbf5c014}.map-plot-target:hover{outline:2px solid #e7d585;outline-offset:-2px}
.floating-energy{position:absolute;transform:translate(-50%,-100%);background:#fffae7f5;border:1px solid #9a9d79;border-radius:7px;padding:5px 7px;min-width:98px;box-shadow:0 3px 6px #233d2844;z-index:2}
.floating-energy>span:first-child{display:flex;justify-content:space-between;gap:8px;color:#43533b;font-size:11px;line-height:1.3}.floating-energy strong{font-size:11px}.energy-track{display:block;background:#d7ddc2;height:6px;border-radius:4px;overflow:hidden;margin-top:4px}.energy-track i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#5f8c4c,#a9c16c)}
.animal-energy{pointer-events:none}.hud,.side-actions,.map-controls,.map-position,.bottom-left,.hotbar,.minimap,.bottom-hint,.touch-pad{z-index:3}.interaction{z-index:4}.vignette{z-index:0}
dialog{border-radius:15px;border:1px solid #9a8055;box-shadow:0 18px 65px #14282155;width:min(660px,calc(100% - 28px));background:#fff8e8}
.panel-head{background:linear-gradient(#f3e9cd,#efe0ba);border-bottom:1px solid #d0bc90}.panel-head h2{font-size:28px}.close{border-radius:8px}
.panel-foot{font:12px "Segoe UI",sans-serif;background:#f5ebd5}.subtext{font-size:15px;line-height:1.6}
.primary,.secondary{border-radius:8px;font-size:15px;min-height:43px;border-width:1px;box-shadow:inset 0 1px #ffffff30,0 2px #304f2433}
.primary{background:#547b48;border-color:#486638}.secondary{background:#f4e7c8;border-color:#c4ab77;color:#67543a}
.full{margin-top:14px}.row-info h3{font-size:19px;font-weight:600}.row-info p{font-size:14px}
.shop-row canvas,.inventory-row canvas,.animal-row canvas{width:64px;height:64px;image-rendering:auto;border-radius:12px;padding:3px;background:#f2e8c9}
label{font-size:15px}input{border-radius:8px;font-size:16px}.link-button{font-size:15px}.history-row{font-size:14px;line-height:1.5}
.animal-profile{display:flex;gap:20px;align-items:center;margin-bottom:20px}.animal-profile canvas{width:105px;height:105px;image-rendering:auto;background:#eef0d9;border:1px solid #d3d6b4;border-radius:20px;padding:8px}.animal-profile h3{font-size:24px;margin:0 0 6px}.animal-profile p{font-size:14px;line-height:1.4;color:#7a8264;margin:0 0 8px}
.stat-meter{margin:16px 0}.stat-meter>div:first-child{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:7px;font-size:15px}.stat-meter strong{font:600 14px "Segoe UI",sans-serif;color:#597144}.meter-track{background:#e5e8d7;border:1px solid #d2d9be;height:13px;border-radius:8px;overflow:hidden}.meter-track i{height:100%;display:block;background:linear-gradient(90deg,#759b58,#b4c987);border-radius:7px}.stat-meter.amber .meter-track{background:#ede4d1;border-color:#e2d5b7}.stat-meter.amber i{background:linear-gradient(90deg,#c59853,#e5c177)}.stat-meter.blue .meter-track{background:#dfeceb;border-color:#c3d9d6}.stat-meter.blue i{background:linear-gradient(90deg,#609aab,#8fbdc9)}
.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.action-grid button{width:100%}
.panel-tabs{display:flex;gap:9px;margin-bottom:20px;border-bottom:1px solid #dfd1ac;padding-bottom:12px}.panel-tabs button{border:1px solid #d5c5a0;background:#fbf0d8;border-radius:20px;padding:9px 17px;font-size:14px}.panel-tabs button.active{background:#e3ebd2;border-color:#a7b88b;color:#526943;font-weight:600}
.seed-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.seed-card{padding:17px;background:#faf3df;border:1px solid #e0d4b8;border-radius:13px}.seed-card canvas{width:52px;height:52px;float:right}.seed-card h3{font-size:18px;margin:0 0 10px}.seed-card p{font-size:13px;color:#8b7958;line-height:1.7}.seed-card button{font-size:14px}
.animal-card-select,.shelter-tile{width:100%;background:#fbf5e4;border:1px solid #ded3b5;border-radius:12px;display:flex;align-items:center;gap:14px;padding:12px;margin:12px 0;text-align:left}.animal-card-select:hover,.shelter-tile:hover{background:#f0ecd5;border-color:#afb989}.animal-card-select canvas,.shelter-tile canvas{width:52px;height:52px;image-rendering:auto}.animal-card-select strong{font-size:16px;display:block}.animal-card-select small{font-size:12px;color:#8a795c;display:block;margin-top:5px}.animal-card-select b{font-size:13px;margin-left:auto;color:#647950}.shelter-tile span{margin-left:auto;font-size:14px;color:#8c7e60}
.capacity-card{padding:17px;border-radius:14px;background:#eaf0db;display:flex;gap:15px;align-items:center}.capacity-card strong{font-size:30px;color:#567448}.capacity-card span{font-size:15px;color:#798866}
.well-title{text-align:center;margin:5px 0 20px}.well-title>span{display:block;font-size:13px;color:#74919a}.well-title strong{font-size:48px;color:#527f8b;line-height:1.5}.well-title strong small{font-size:22px;font-weight:400;color:#91a5a7}
.level-steps{display:flex;gap:6px;margin-bottom:22px}.level-steps span{flex:1;text-align:center;padding:9px 0;background:#f0efe6;border:1px solid #dadbce;border-radius:6px;font-size:13px;color:#a1a28f}.level-steps .unlocked{background:#d3e6df;border-color:#92b9ae;color:#427b6d;font-weight:bold}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0}.facts>div{padding:14px 9px;text-align:center;background:#f0f3e8;border-radius:10px}.facts strong{display:block;font-size:16px;margin-bottom:6px;color:#5a7864}.facts span{font-size:12px;color:#81917b}
.plot-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.plot-card{border:1px solid #d2cfaf;background:#f1f2e2;border-radius:12px;padding:12px;text-align:left}.plot-card canvas{width:48px;height:48px;image-rendering:auto}.plot-card strong,.plot-card span{display:block;margin-top:7px;font-size:14px}.plot-card span{font-size:12px;color:#7f8968}
.treasury-box{background:#e8eedb;border:1px solid #c3d0ac;border-radius:13px;padding:18px;margin:25px 0}.treasury-box>span{display:block;font-size:12px;letter-spacing:1px;color:#788663}.treasury-box strong{font-size:28px;display:block;color:#587546;margin:8px 0}.treasury-box p{font-size:14px;line-height:1.5;color:#778665;margin:0}
.character-options button{border-radius:14px}.character-options canvas{width:112px;height:112px;image-rendering:auto}
.help-steps{padding-left:22px;font-size:15px;line-height:1.8}.demo-note{background:#f6ecd3;border-radius:8px;padding:11px;font-size:13px}
#toast{position:fixed;bottom:28px;z-index:1000;border-radius:9px;font-size:15px}
@media(max-width:950px){.hotbar button{width:61px}.hotbar span{font-size:11px}.welcome{max-width:270px}.side-actions button{width:65px}.side-actions span{font-size:11px}.bottom-hint{font-size:12px}}
@media(max-width:600px){.brand small{font-size:8px}.welcome{max-width:50%;padding:10px}.welcome .mini-label{font-size:9px}.welcome h1{font-size:17px}.save-status{font-size:10px}.season{font-size:12px}.clock-top .mini-label{font-size:9px}.clock-top strong{font-size:13px}.side-actions button{width:52px;height:59px}.side-actions span{font-size:10px}.side-actions{top:154px}.map-controls{top:168px}.map-position{top:209px;font-size:11px}.hotbar button{width:53px;height:66px}.hotbar span{font-size:10px}.bottom-hint{font-size:10px}.map-sign{padding:6px 12px;min-width:99px}.map-sign strong{font-size:12px}.map-sign small{font-size:10px}.floating-energy{min-width:82px;padding:4px 5px}.floating-energy>span:first-child,.floating-energy strong{font-size:10px}.panel-head h2{font-size:23px}.panel-foot{font-size:10px;flex-wrap:wrap}.row-info p{font-size:12px}.seed-grid{gap:9px}.seed-card{padding:12px}.seed-card canvas{width:37px;height:37px}.seed-card h3{font-size:16px}.seed-card p{font-size:12px}.seed-card button{font-size:12px;padding:9px}.action-grid{gap:8px}.action-grid button{font-size:13px;padding:10px}.animal-card-select b{display:none}.plot-list{grid-template-columns:1fr 1fr}.facts strong{font-size:14px}.facts span{font-size:11px}.animal-profile canvas{width:86px;height:86px}.level-steps{gap:3px}.level-steps span{font-size:12px}.subtext{font-size:14px}#toast{bottom:16px;font-size:13px}}
/* Expanded farm and the two market counters. */
.panel-tabs{flex-wrap:wrap}.market-main{position:static;background:#fff8e8;padding-top:8px}.market-categories button{font-size:13px;padding:8px 11px}.market-balance{font-size:13px;padding:12px;background:#eaf0dc;border-radius:9px;line-height:1.8}
.trough-card,.offer-compose{padding:17px;border:1px solid #c9d1b0;background:#f0f3e4;border-radius:12px;margin:18px 0}.offer-compose summary{cursor:pointer;font-weight:650;padding:5px}.offer-card{display:flex;align-items:center;gap:12px;padding:16px;border:1px solid #ded3b5;border-radius:13px;background:#faf2df;margin:12px 0}.offer-card canvas{width:48px;height:48px;flex-shrink:0}.offer-card>div{flex:1}.offer-card h3{font-size:17px;margin:0 0 8px}.offer-card p{font-size:12px;color:#827454;line-height:1.6}.offer-card strong{font-size:14px;color:#547448}.offer-card button{font-size:13px}.fish-stock p{font-size:14px;line-height:1.7}.destination-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}.destination-grid button{font-size:13px}
#overview-map{width:100%;height:auto;image-rendering:pixelated;border:5px solid #b9a174;border-radius:12px}#market-quote{font-size:14px;line-height:1.7;margin:20px 0;display:block}
@media(max-width:600px){.offer-card{flex-wrap:wrap}.offer-card button{width:100%}.market-main button{font-size:12px;padding:8px 10px}.market-categories{gap:5px}.market-categories button{font-size:12px;padding:7px}.destination-grid{grid-template-columns:1fr 1fr}}
/* Small world labels, with details on hover or keyboard focus. */
.map-sign{min-width:0;max-width:155px;padding:5px 10px;gap:0;border-radius:7px;border-color:#aa9465;background:linear-gradient(160deg,#fff9e8,#eee1bc);box-shadow:0 2px 0 #8d774e,0 3px 7px #253c2826;transition:padding .16s ease,max-width .16s ease,scale .16s ease,box-shadow .16s ease;transform-origin:50% 0}
.map-sign strong{font-size:11px;line-height:1.3;font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.map-sign small{font-size:11px;line-height:1.4;max-height:0;opacity:0;overflow:hidden;transition:max-height .16s ease,opacity .16s ease}
.map-sign:before,.map-sign:after{display:none}
.map-sign.expanded{max-width:240px;padding:8px 13px;scale:1.08;z-index:5;box-shadow:0 2px 0 #758251,0 7px 18px #20372133}
.map-sign.expanded strong{font-size:12px}
.map-sign.expanded small{max-height:22px;opacity:1}
.map-sign.near:not(:hover):not(:focus-visible){box-shadow:0 2px 0 #758251,0 3px 7px #253c2826}

/* Soft parchment cards and botanical accents above the map. */
.welcome,.clock-card{border:1px solid #fff8e0bb;background:linear-gradient(135deg,#fffae9f5,#f0ecd5ed);box-shadow:0 7px 24px #233c2926,inset 0 1px 0 #fffef4;border-radius:23px;backdrop-filter:blur(9px)}
.welcome{padding:17px 22px 15px;min-width:235px;max-width:290px;border-radius:9px 26px 26px 26px;overflow:hidden}
.welcome:after{content:'❧';position:absolute;right:8px;top:-16px;font:100px Georgia,serif;color:#7e985d15;transform:rotate(-23deg);pointer-events:none}
.welcome .mini-label{font-size:10px;letter-spacing:1.3px;color:#75885e;position:relative}
.welcome h1{font-size:23px;color:#41523a;margin:7px 0 10px;line-height:1.1;position:relative}
.welcome .season{display:inline-flex;gap:6px;font-size:12px;background:#dde6c68c;color:#637b4d;padding:5px 10px;border-radius:20px}
.welcome .leaf{font-size:19px}
.welcome .save-status{font-size:10px;line-height:1.4;color:#869173;margin-top:9px;max-width:245px}
.clock-card{padding:13px;width:224px;border-radius:26px 9px 26px 26px}
.clock-top{gap:11px;border-bottom:0;padding:0 1px 10px}
.clock-top .mini-label{font-size:9px;letter-spacing:1.1px;color:#8b916f}
.clock-top strong{font-size:16px;font-weight:600;color:#59684a;margin-top:5px}
.sun{display:grid;place-items:center;flex:0 0 43px;height:43px;background:radial-gradient(circle at 35% 30%,#fff5bc,#efdba0);border:1px solid #e1d49c88;border-radius:50%;font-size:29px;color:#b68f35;box-shadow:0 3px 9px #b69c4320}
.wallet-line{background:#ffffff80;border:1px solid #e5e3ce;border-radius:17px;padding:8px 10px;gap:7px}
.wallet-line strong{font-size:17px;color:#647347}.wallet-line>span:nth-of-type(2){font-size:10px}.wallet-line b{display:grid;place-items:center;border-radius:50%;width:21px;height:21px;background:#e8ecd9;color:#74815b}
.map-controls{border:1px solid #e4dab8;border-radius:12px;overflow:hidden;box-shadow:0 3px 10px #253c2826;top:187px}
.map-controls button{background:#fff9e8f2;border-color:#e3d8ba;font-size:19px}
.map-position{top:226px;border-radius:15px;padding:5px 10px;font-size:11px;background:#3e593ebd}
.hotbar{max-width:calc(100% - 24px)}
.hotbar button{width:68px}
@media(max-width:950px){.welcome{min-width:210px;max-width:260px}.hotbar button{width:57px}.clock-card{width:214px}.map-controls{top:179px}.map-position{top:218px}}
@media(max-width:600px){
 .welcome{min-width:0;width:calc(54% - 16px);max-width:none;padding:12px;border-radius:9px 20px 20px 20px}
 .welcome h1{font-size:17px;line-height:1.1;margin:7px 0}.welcome .mini-label{font-size:8px;letter-spacing:.7px}
 .welcome .season{font-size:10px;padding:4px 6px;gap:3px}.welcome .save-status{font-size:9px}
 .clock-card{width:calc(46% - 14px);padding:9px;border-radius:20px 9px 20px 20px}
 .clock-top{gap:6px;padding-bottom:8px}.clock-top .mini-label{font-size:8px;letter-spacing:.4px}.clock-top strong{font-size:12px}
 .sun{flex-basis:30px;height:30px;font-size:23px}.wallet-line{padding:6px}.wallet-line strong{font-size:15px}
 .hotbar{gap:3px;padding:4px}.hotbar button{width:clamp(41px,12.8vw,53px);height:62px}.hotbar span{font-size:9px}.hotbar .item-icon{width:30px;height:30px}
 .map-sign{max-width:135px;padding:5px 8px}.map-sign strong{font-size:10px}
 .map-controls{top:162px}.map-position{top:200px}
}
@media(hover:none){.map-sign small{max-height:16px;opacity:1;font-size:9px}.map-sign{min-height:36px}}
@media(prefers-reduced-motion:reduce){.map-sign,.map-sign small{transition:none}}
.market-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}.market-filters label{margin:0}textarea{width:100%;box-sizing:border-box;resize:vertical;font:inherit;padding:12px;border:1px solid #b9ac89;border-radius:10px;background:#fffbed;color:#424b35}.sale-description{white-space:pre-wrap;overflow-wrap:anywhere}.offer-card>div{min-width:0}.animal-card-select .action-grid{margin-top:10px}@media(max-width:600px){.market-filters{grid-template-columns:1fr}}

/* Valley pixel UI: stepped edges, flat highlights and tactile two-dimensional controls. */
:root{--pixel-dark:#5b4830;--pixel-light:#fff2cd;--pixel-moss:#557443;--pixel-gold:#d9b668}
dialog{border:4px solid var(--pixel-dark);border-radius:0;background:#fff4d9;box-shadow:0 0 0 3px #d8b573,0 0 0 6px #6d5235,10px 12px 0 #20332970;scrollbar-color:#a7824e #f3e3bd;scrollbar-width:thin}
dialog::backdrop{backdrop-filter:none;background:#20342780}
.panel-head{padding:20px 24px;background:linear-gradient(#f4d998 0 5px,#e6c27d 5px 9px,#f1dcad 9px calc(100% - 5px),#c39b59 calc(100% - 5px));border-bottom:3px solid #8e6a3d}
.panel-head h2,#auth-form h2{font-family:Consolas,'Courier New',monospace;font-weight:800;font-size:25px;line-height:1.25;letter-spacing:-.6px;text-shadow:2px 2px #fff6d8}
.panel-head .mini-label{font:700 11px Consolas,monospace;letter-spacing:2.2px;color:#87653b}
.panel-foot{border-top:3px solid #d2b37a;background:#eee0b8;color:#726044}
#panel-body{background:repeating-linear-gradient(0deg,#fff4d9 0 3px,#fdf1d5 3px 4px);padding:24px}
.primary,.secondary,.panel-tabs button,.close,.hotbar button,.destination-grid button,.character-options button{
 border:3px solid #5f4c32;border-radius:0;box-shadow:inset 0 3px #fff7cfaa,inset 3px 0 #fff7cf55,inset 0 -4px #493e3440,0 4px 0 #5f4c32;
 clip-path:polygon(6px 0,calc(100% - 6px) 0,calc(100% - 6px) 3px,100% 3px,100% calc(100% - 6px),calc(100% - 3px) calc(100% - 6px),calc(100% - 3px) 100%,6px 100%,6px calc(100% - 3px),0 calc(100% - 3px),0 6px,3px 6px,3px 3px,6px 3px);
 font-family:Consolas,'Courier New',monospace;font-weight:700;letter-spacing:.2px;min-height:46px;transition:filter .1s;
}
.primary{background:linear-gradient(#78965b 0 48%,#63814d 48%);color:#fff7dd;text-shadow:1px 2px #465c38}
.secondary,.destination-grid button{background:linear-gradient(#f2d799 0 48%,#e3c17b 48%);color:#5a472b}
.primary:hover,.secondary:hover,.panel-tabs button:hover,.hotbar button:hover{filter:brightness(1.08);transform:none}
.primary:active,.secondary:active,.panel-tabs button:active,.hotbar button:active{box-shadow:inset 0 4px #463c3155,inset 0 -2px #fff5d677;filter:brightness(.97)}
button:disabled{filter:grayscale(.5);opacity:.55}
.panel-tabs{gap:10px;border-bottom:3px solid #ddc394;padding-bottom:16px}
.panel-tabs button{background:#edd49b;padding:10px 14px;color:#78603c;font-size:14px}
.panel-tabs button.active{background:linear-gradient(#abc284 0 48%,#8ea766 48%);color:#304629;border-color:#52683c}
.close{background:linear-gradient(#e7b184 0 45%,#cd8d67 45%);color:#583b2c;min-height:38px;width:40px;height:38px;font-size:25px;text-shadow:1px 1px #f8d9af;padding:0;flex:none}
input,select,textarea{border:2px solid #aa8956;border-radius:0;background:#fff9e8;box-shadow:inset 3px 3px #d5c39d66}
input:focus,select:focus,textarea:focus{outline:2px solid #718c4f;outline-offset:2px}
.seed-card,.upgrade,.offer-card,.trough-card,.animal-card-select,.plot-card,.shelter-tile,.facts>div,.treasury-box,.offer-compose{border:2px solid #bc9d65;border-radius:0;background:#f6e7c2;box-shadow:inset 2px 2px #fff8df,inset -2px -2px #dac28e}
.capacity-card,.market-balance,.demo-note,#panel-feedback{border:2px solid #a4af79;border-radius:0;box-shadow:inset 2px 2px #fff7d9;background:#e5eac9}
.capacity-card strong{font-family:Consolas,monospace;font-size:27px;color:#50653c}
.meter-track,.energy-track{border:2px solid #766647;border-radius:0;background:#d5c59b;height:15px;box-shadow:inset 2px 2px #8b7c5744}
.meter-track i,.energy-track i{border-radius:0;background:repeating-linear-gradient(90deg,#8fab62 0 12px,#7c9958 12px 14px);box-shadow:inset 0 3px #c8d997}
.stat-meter.blue i{background:repeating-linear-gradient(90deg,#77aeb1 0 12px,#699b9e 12px 14px);box-shadow:inset 0 3px #b9d5d0}
.stat-meter.amber i{background:repeating-linear-gradient(90deg,#d6ad5e 0 12px,#bb944c 12px 14px);box-shadow:inset 0 3px #edcc86}
.energy-track{height:9px;border-width:1px}.floating-energy{border:2px solid #807247;border-radius:0;box-shadow:2px 2px #4d533a55}
.shop-row canvas,.inventory-row canvas,.animal-profile canvas,.seed-card canvas,.animal-card-select canvas,.shelter-tile canvas,.plot-card canvas,.item-icon,.character-options canvas{image-rendering:pixelated;border-radius:0}
.animal-profile canvas{border:3px solid #a3ad73;box-shadow:inset 3px 3px #faf1cb;background:#e6e7c1}
.hotbar{border-radius:0;background:#ab8249;border:3px solid #5a442d;box-shadow:inset 3px 3px #e8c884,0 0 0 2px #eccd92,5px 6px #26382177}
.hotbar button{background:linear-gradient(#f0dca4 0 50%,#dfc38a 50%);border-color:#896a3f;min-height:70px}
.hotbar button.selected{background:#d9df9b;border-color:#57753a;outline:0}
.hotbar span{font-family:Consolas,monospace;font-size:12px;font-weight:700}
.map-sign{border:2px solid #886b40;border-radius:0;box-shadow:inset 0 2px #fff8df,2px 3px #57482f66;background:#f0dfb1}
.map-sign strong{font-family:Consolas,monospace;font-weight:700}
.map-sign.expanded{border-color:#637641;background:#f4e6bf;box-shadow:inset 0 2px #fff8df,3px 4px #53603777}
.level-steps span{border-radius:0;border:2px solid #b49a69;font-family:Consolas,monospace}.level-steps .unlocked{background:#bed19a;border-color:#7c925c;color:#3d5839}
.market-main{background:transparent}
#toast{border:3px solid #775b37;border-radius:0;box-shadow:inset 2px 2px #fff8df,4px 5px #253a2d55}
@media(max-width:600px){.panel-head h2{font-size:21px}.panel-head,#panel-body{padding:16px}.panel-tabs button{padding:8px 9px;font-size:12px}.primary,.secondary{font-size:13px}.capacity-card{flex-wrap:wrap}.hotbar button{min-height:64px}.hotbar span{font-size:10px}}
.energy-cost{display:block;font:600 11px "Segoe UI",sans-serif;letter-spacing:0;opacity:.85;margin-top:4px;text-shadow:none}
 .water-line{border:0;border-top:1px solid #d1ba87;width:100%;background:none;padding:8px 0 2px;display:flex;align-items:center;gap:8px;color:#466c74}.water-line strong{font:700 15px monospace}.water-line span:last-child{font-size:10px;color:#8a7656}#tutorial-dialog{max-width:480px}#tutorial-box{padding:28px}.tutorial-box ol{line-height:1.8}
 .resource-card{position:absolute;right:26px;top:154px;width:224px;padding:7px 10px;display:flex;gap:8px;border-radius:12px;background:#fff8e6eF}.resource-card button{flex:1;border:0;border-right:1px solid #d6c496;background:none;display:grid;grid-template-columns:25px 1fr;grid-template-rows:1fr 1fr;text-align:left;align-items:center}.resource-card button:last-child{border:0}.resource-card button>span{grid-row:1/3;font-size:23px}.resource-card strong{font:700 15px monospace}.resource-card small{font-size:9px;color:#8a7656}.resource-card button:hover{background:#ffedbd}
@media(max-width:600px){.resource-card{right:10px;top:112px;width:155px;padding:5px}.resource-card button>span{font-size:18px}.resource-card strong{font-size:12px}.resource-card small{font-size:8px}}