:root{--hud-bg:#faf6eae0;--hud-text:#2f3b24;--hud-muted:#6b6a55;--hud-good:#6f9a3a;--hud-low:#c8643a;--hud-track:#2f3b2426}html,body{background:#a9c3d6;height:100%;margin:0;font-family:Be Vietnam Pro,system-ui,sans-serif;overflow:hidden}#app{position:fixed;inset:0}#loading{color:var(--hud-text);pointer-events:none;place-items:center;font-size:1.25rem;display:grid;position:fixed;inset:0}#loading[hidden]{display:none}#hud{pointer-events:none;color:var(--hud-text);font-size:14px;position:fixed;inset:0}.hud-top{flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%)}.hud-forecast{background:var(--hud-bg);border-radius:999px;padding:3px 10px;font-size:12px}.hud-forecast[hidden]{display:none}.hud-clock{background:var(--hud-bg);white-space:nowrap;border-radius:999px;padding:6px 14px;font-weight:600}.hud-card{background:var(--hud-bg);border-radius:10px;width:190px;padding:10px 12px;position:absolute;top:64px;left:12px}.hud-cow-name{font-size:16px;font-weight:700}.hud-cow-stage{color:var(--hud-muted);font-size:12px}.hud-cow-mood{margin:6px 0 8px;font-weight:600}.hud-stat{grid-template-columns:44px 1fr;align-items:center;gap:6px;margin-top:4px;font-size:12px;display:grid}.hud-stat-track{background:var(--hud-track);border-radius:4px;height:8px;overflow:hidden}.hud-stat-fill{background:var(--hud-good);height:100%;transition:width .3s}.hud-stat-fill.low{background:var(--hud-low)}.hud-hints{gap:10px;display:flex;position:absolute;bottom:96px;left:50%;transform:translate(-50%)}.hud-hint{background:var(--hud-bg);white-space:nowrap;border-radius:8px;padding:6px 12px;font-weight:600}.hud-hint kbd{background:var(--hud-text);color:#fff;text-align:center;border-radius:4px;min-width:1.2em;padding:1px 6px;font-family:inherit;display:inline-block}.hud-toast{background:var(--hud-bg);white-space:pre-line;opacity:0;border-radius:8px;max-width:min(420px,100vw - 32px);padding:6px 12px;transition:opacity .3s;position:absolute;bottom:16px;right:16px}.hud-toast.visible{opacity:1}.hud-help{color:#ffffffe6;white-space:nowrap;text-shadow:0 1px 2px #0009;font-size:12px;position:absolute;bottom:12px;left:12px}.overlay-card.help-card{width:min(760px,100vw - 32px);max-height:calc(100vh - 48px);overflow-y:auto}.help-content{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0 28px;display:grid}.help-content h3{margin:12px 0 6px}.help-list{grid-template-columns:124px 1fr;align-items:baseline;gap:5px 12px;font-size:14px;display:grid}.help-key{font:inherit;white-space:nowrap;background:#fff;border:1px solid #2f3b2440;border-bottom-width:2px;border-radius:5px;justify-self:start;padding:1px 7px;font-size:13px;font-weight:600}.screen-fade{z-index:5;opacity:0;pointer-events:none;background:#000;transition-property:opacity;transition-timing-function:ease-in-out;position:fixed;inset:0}.overlay{z-index:6;color:var(--hud-text);pointer-events:auto;background:#141c128c;place-items:center;display:grid;position:fixed;inset:0}.overlay[hidden]{display:none}.overlay-card{background:#faf6ea;border-radius:14px;width:min(440px,100vw - 32px);max-height:calc(100vh - 32px);padding:20px 24px;overflow-y:auto;box-shadow:0 10px 30px #0000004d}.overlay-card h2{margin:0 0 12px;font-size:20px}.overlay-card p{margin:6px 0;line-height:1.4}.summary-note{color:var(--hud-muted);font-style:italic}.summary-highlight{color:#4f7a24;font-weight:700}.overlay-card .summary-weather{margin-top:12px;font-weight:600}.overlay-button{color:#fff;width:100%;font:inherit;cursor:pointer;background:#4f7a24;border:0;border-radius:8px;margin-top:16px;padding:10px;font-weight:700;display:block}.overlay-button:focus-visible{outline:3px solid #c8a24a}.hotbar-wrap{flex-direction:column;align-items:center;gap:4px;display:flex;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.hotbar-label{background:var(--hud-bg);border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600}.hotbar{gap:4px;display:flex}.hotbar-slot{background:var(--hud-bg);pointer-events:auto;cursor:pointer;border:2px solid #0000;border-radius:8px;place-items:center;width:44px;height:44px;display:grid;position:relative}.hotbar-slot:hover:not(.selected){border-color:#c8a24a80}.hotbar-slot.selected{background:#fff8e0;border-color:#c8a24a}.hotbar-icon{font-size:22px}.hotbar-key{color:var(--hud-muted);font-size:10px;position:absolute;top:1px;left:4px}.hotbar-badge{font-size:11px;font-weight:700;position:absolute;bottom:1px;right:3px}.shop-header{justify-content:space-between;align-items:baseline;display:flex}.shop-coins{font-weight:700}.overlay-card h3{margin:14px 0 6px;font-size:15px}.shop-row{border-bottom:1px solid #2f3b241a;grid-template-columns:1fr auto auto auto;align-items:center;gap:10px;padding:4px 0;font-size:13px;display:grid}.shop-owned,.shop-note{color:var(--hud-muted);font-size:12px}.shop-button{color:#fff;font:inherit;cursor:pointer;background:#4f7a24;border:0;border-radius:6px;padding:4px 10px}.shop-button:disabled{cursor:default;background:#b9b7a8}.shop-message{min-height:1.4em;font-weight:600}.panel-bar{background:var(--hud-track);border-radius:4px;height:8px;overflow:hidden}.panel-bar-fill{background:var(--hud-good);height:100%}.panel-note{color:var(--hud-muted);margin:4px 0 8px;font-size:13px}.skill-row{border-bottom:1px solid #2f3b241a;gap:4px;padding:8px 0;display:grid}.skill-header{justify-content:space-between;font-weight:600;display:flex}.skill-xp,.skill-howto{color:var(--hud-muted);font-size:12px}.skill-next{font-size:13px}.panel-choice{width:100%;color:var(--hud-text);font:inherit;text-align:left;cursor:pointer;background:#ffffff8c;border:1px solid #2f3b2426;border-radius:8px;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 10px;margin:4px 0;padding:8px 10px;display:grid}.panel-choice:hover:not(:disabled){background:#ffffffd9;border-color:#c8a24a}.panel-choice:disabled{cursor:default;opacity:.55}.panel-choice-key{background:var(--hud-text);color:#fff;text-align:center;border-radius:4px;min-width:18px;padding:1px 5px;font-size:11px}.panel-choice-name{font-weight:600}.panel-choice-info{color:var(--hud-muted);font-size:12px}.panel-choice-bar{grid-column:2/4;height:5px}.hud-flute{flex-direction:column;align-items:center;display:inline-flex}.hud-flute small{color:var(--hud-muted);font-size:11px}@media (max-width:480px){.panel-choice{grid-template-columns:auto 1fr}.panel-choice-info{grid-column:2}}.dialogue{background:var(--hud-bg);width:min(640px,100vw - 32px);color:var(--hud-text);pointer-events:auto;cursor:pointer;border-radius:12px;padding:14px 18px 10px;position:absolute;bottom:150px;left:50%;transform:translate(-50%);box-shadow:0 6px 24px #00000040}.dialogue[hidden]{display:none}.dialogue.narrator .dialogue-text{font-style:italic}.dialogue-speaker{color:#7a5a1e;margin-bottom:4px;font-weight:700}.dialogue-text{font-size:16px;line-height:1.5}.dialogue-footer{text-align:right;margin-top:8px}.dialogue-hint{color:var(--hud-muted);font-size:12px}.dialogue-name{cursor:default;flex-wrap:wrap;align-items:center;gap:8px;display:flex}.dialogue-name-field{font:inherit;border:1px solid #2f3b244d;border-radius:6px;flex:160px;padding:6px 10px}.dialogue-suggestions{gap:4px;display:flex}.dialogue-chip{font:inherit;cursor:pointer;background:#fff;border:1px solid #2f3b2440;border-radius:999px;padding:4px 10px}.dialogue-ok{width:auto;margin:0;padding:6px 16px}.quest-panel{background:var(--hud-bg);border-radius:10px;width:190px;padding:8px 12px;font-size:13px;position:absolute;top:232px;left:12px}.quest-panel[hidden]{display:none}.quest-title{margin-bottom:4px;font-weight:700}.quest-subtitle{color:var(--hud-muted);text-transform:uppercase;margin:6px 0 2px;font-size:11px}.quest-row{align-items:baseline;gap:6px;padding:1px 0;display:flex}.quest-row.done{color:var(--hud-muted);text-decoration:line-through}.quest-story .quest-name{font-weight:600}.quest-row.waiting{color:var(--hud-muted)}.quest-name{flex:1}.quest-note{color:var(--hud-muted);margin:2px 0 2px 18px;font-size:12px}.quest-hint .quest-check{color:var(--hud-muted)}.quest-count{color:var(--hud-muted);white-space:nowrap;font-size:12px}.achievement-row{color:var(--hud-muted);gap:8px;padding:3px 0;display:flex}.achievement-row.done{color:var(--hud-text);font-weight:600}.hotbar-slot.locked{opacity:.35}.title-screen{pointer-events:auto;background:linear-gradient(90deg,#141c128c,#141c1200 60%);justify-content:flex-start;align-items:center;padding:16px max(16px,8vw);display:flex;position:absolute;inset:0}.title-screen[hidden]{display:none}.title-menu{color:#f6f1e2;flex-direction:column;gap:10px;width:min(340px,100%);display:flex}.title-name{text-shadow:0 2px 12px #00000073;margin:0;font-size:clamp(34px,6vw,56px);line-height:1.1}.title-tagline{opacity:.9;margin:0 0 18px;font-size:17px}.title-note{opacity:.8;margin:0;font-size:12px}.title-button{color:#f6f1e2;font:inherit;cursor:pointer;background:#f6f1e21f;border:1px solid #f6f1e299;border-radius:10px;padding:10px 16px;font-size:16px}.title-button:hover{background:#f6f1e240}.title-primary{background:#4f7a24;border-color:#c8a24a;font-weight:700}.title-primary:hover{background:#5d8c2c}.title-form{background:#141c1299;border-radius:14px;padding:18px}.title-form h2{margin:0 0 4px}.title-label{opacity:.85;margin-top:4px;font-size:13px}.title-input{font:inherit;border:0;border-radius:8px;padding:8px 10px;font-size:16px}.title-swatches{gap:8px;display:flex}.title-swatch{border:2px solid #0000;border-radius:50%;width:36px;height:36px;padding:0}.title-swatch.selected{border-color:#c8a24a;box-shadow:0 0 0 2px #c8a24a80}.character-fields{flex-direction:column;gap:6px;display:flex}.character-bodies{gap:8px;display:flex}.character-body{flex:1}.character-body.selected{background:#4f7a24;border-color:#c8a24a;font-weight:700}.pause-card .character-body{color:var(--hud-text);background:#fff;border-color:#2f3b2433}.pause-card .character-body.selected{color:#fff;background:#4f7a24;border-color:#4f7a24}.pause-card .title-input{border:1px solid #2f3b2440}.fullscreen-button{z-index:10;background:var(--hud-bg);width:36px;height:36px;color:var(--hud-text);cursor:pointer;pointer-events:auto;border:none;border-radius:10px;padding:7px;position:absolute;top:12px;right:16px}.fullscreen-button:hover{background:#fffaf0}.fullscreen-button svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%}.fullscreen-button.beside-dev-panel{right:270px}.fullscreen-note{z-index:10;background:var(--hud-bg);border-radius:10px;max-width:280px;padding:8px 12px;line-height:1.4;position:absolute;top:56px;right:16px}.fullscreen-note[hidden]{display:none}.fullscreen-note.beside-dev-panel{right:270px}#hud.cinematic>:not(.ending-card):not(.credits){visibility:hidden}.ending-card{z-index:19;color:#f6f1e2;text-align:center;text-shadow:0 2px 16px #0000008c;flex-direction:column;justify-content:center;align-items:center;padding:16px;animation:3s ease-out both ending-fade;display:flex;position:absolute;inset:0}.ending-card[hidden]{display:none}.ending-title{margin:0;font-size:clamp(36px,7vw,64px)}.ending-line{opacity:.9;margin:8px 0 0;font-size:clamp(16px,2.4vw,20px)}@keyframes ending-fade{0%{opacity:0}}.credits{z-index:20;color:#f6f1e2;pointer-events:auto;background:#0e130cd6;flex-direction:column;align-items:center;gap:12px;padding:16px 16px 24px;animation:1.5s ease-out both ending-fade;display:flex;position:absolute;inset:0}.credits[hidden]{display:none}.credits-viewport{flex:1;width:min(620px,100%);position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#0000,#000 10% 90%,#0000);mask-image:linear-gradient(#0000,#000 10% 90%,#0000)}.credits-roll{text-align:center;transform:translateY(var(--roll-to));animation:linear both credits-roll;position:absolute;left:0;right:0}@keyframes credits-roll{0%{transform:translateY(var(--roll-from))}to{transform:translateY(var(--roll-to))}}.credits-title{margin:0;font-size:clamp(30px,5vw,46px)}.credits-heading{opacity:.85;margin:6px 0 0}.credits-section h2{letter-spacing:.08em;text-transform:uppercase;opacity:.7;margin:30px 0 6px;font-size:13px;font-weight:600}.credits-section p{overflow-wrap:anywhere;margin:4px 0;font-size:16px;line-height:1.5}@media (prefers-reduced-motion:reduce){.credits-viewport{overflow:auto;-webkit-mask-image:none;mask-image:none}.credits-roll{animation:none;position:static;transform:none}}.panel-bar.low .panel-bar-fill{background:var(--hud-low)}.cow-card-line{color:var(--hud-muted)}.cow-card-stat{grid-template-columns:96px 1fr 36px;align-items:center;gap:10px;padding:3px 0;font-size:13px;display:grid}.cow-card-value{text-align:right;font-variant-numeric:tabular-nums}.bag-grid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px;display:grid}.bag-slot{background:#2f3b240f;border-radius:8px;justify-items:center;gap:2px;padding:8px 4px;font-size:13px;display:grid}.bag-icon{font-size:22px}.bag-note{color:var(--hud-muted);font-size:11px}.map-card{width:min(620px,100vw - 32px)}.map-canvas{aspect-ratio:1;cursor:grab;touch-action:none;border-radius:8px;width:min(100%,100vh - 210px);margin:0 auto;display:block}.map-canvas:active{cursor:grabbing}.pause-card{width:min(360px,100vw - 32px)}.pause-button,.settings-choice{width:100%;color:var(--hud-text);font:inherit;cursor:pointer;background:#fff;border:1px solid #2f3b2433;border-radius:8px;margin-top:8px;padding:9px;font-weight:600;display:block}.pause-button:hover,.settings-choice:hover{background:#f1ecdc}.pause-button:focus-visible,.settings-choice:focus-visible{outline:3px solid #c8a24a}.settings-choices{gap:6px;display:flex}.settings-choices .settings-choice{margin-top:0}.settings-choice.selected{color:#fff;background:#4f7a24;border-color:#4f7a24}.settings-row{grid-template-columns:1fr auto;align-items:center;gap:12px;padding:4px 0;font-size:13px;display:grid}.settings-row input[type=range]{accent-color:#4f7a24;width:150px}.settings-row input[type=checkbox]{accent-color:#4f7a24;width:18px;height:18px}#hud.photo>:not(.photo-bar,.photo-mist,.photo-flash){display:none!important}body.photo-mode .lil-gui.root{display:none}.photo-bar{background:var(--hud-bg);pointer-events:auto;border-radius:12px;justify-items:center;gap:6px;width:max-content;max-width:calc(100vw - 32px);padding:10px 14px;display:grid;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.photo-bar[hidden]{display:none}.photo-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.photo-filters{gap:4px;display:flex}.photo-chip{color:var(--hud-text);font:inherit;cursor:pointer;background:#fff;border:1px solid #2f3b2433;border-radius:999px;padding:5px 10px;font-size:12px}.photo-chip.selected{color:#fff;background:#4f7a24;border-color:#4f7a24}.photo-slider{align-items:center;gap:6px;font-size:12px;display:flex}.photo-slider input{accent-color:#4f7a24;width:90px}.photo-shoot{color:#fff;font:inherit;cursor:pointer;background:#4f7a24;border:0;border-radius:8px;padding:7px 14px;font-weight:700}.photo-help{color:var(--hud-muted);font-size:11px}.photo-saved{color:#4f7a24;font-size:12px;font-weight:600}.photo-saved:empty{display:none}.photo-mist{pointer-events:none;background:linear-gradient(#ffffff59,#ffffff1f 60%,#fff0);position:absolute;inset:0}.photo-flash{opacity:0;pointer-events:none;background:#fff;position:absolute;inset:0}.photo-flash.go{animation:.35s ease-out photo-flash}@keyframes photo-flash{0%{opacity:.8}to{opacity:0}}#app canvas{touch-action:none}.touch-stick{left:calc(env(safe-area-inset-left) + 36px);top:calc(100% - env(safe-area-inset-bottom) - 156px);box-sizing:border-box;opacity:.55;pointer-events:none;background:#2f3b242e;border:2px solid #faf6ea99;border-radius:50%;display:none;position:fixed}body.touch .touch-stick{place-items:center;display:grid}.touch-stick.held{opacity:.9}.touch-knob{background:var(--hud-bg);border-radius:50%;width:50px;height:50px;box-shadow:0 2px 6px #00000040}.touch-knob.running{background:#f3d27a}.hud-hint.pressable{pointer-events:auto;cursor:pointer}body.touch .hud-hint{padding:10px 16px;font-size:15px}body.touch .hud-hint.pressable kbd,body.touch .hud-help{display:none}body.touch .hud-toast{top:64px;bottom:auto;right:50%;transform:translate(50%)}.touch-actions,.touch-menu-button{display:none}body.touch .touch-actions{right:calc(env(safe-area-inset-right) + 20px);bottom:calc(env(safe-area-inset-bottom) + 24px);align-items:flex-end;gap:12px;display:flex;position:absolute}.touch-button{background:var(--hud-bg);color:var(--hud-text);font:inherit;pointer-events:auto;touch-action:manipulation;border:none;border-radius:50%;place-items:center;font-weight:700;line-height:1.1;display:grid;box-shadow:0 2px 6px #00000040}.touch-button:active{background:#fff8e0}.touch-jump{width:72px;height:72px}.touch-whistle{width:56px;height:56px;margin-bottom:44px;font-size:12px}body.touch .touch-menu-button{top:12px;right:calc(env(safe-area-inset-right) + 60px);background:var(--hud-bg);width:36px;height:36px;color:var(--hud-text);pointer-events:auto;border:none;border-radius:8px;font-size:20px;line-height:1;display:block;position:absolute}.touch-menu{top:56px;right:calc(env(safe-area-inset-right) + 16px);pointer-events:auto;background:#faf6ea;border-radius:10px;flex-direction:column;gap:4px;max-height:calc(100% - 72px);padding:6px;display:flex;position:absolute;overflow-y:auto;box-shadow:0 4px 14px #00000040}.touch-menu[hidden]{display:none}.touch-menu-item{color:var(--hud-text);font:inherit;text-align:left;background:0 0;border:none;border-radius:6px;padding:9px 14px;font-weight:600}.touch-menu-item:active{background:#fff8e0}:is(#hud:has(>.overlay:not([hidden])) .touch-actions,#hud:has(>.overlay:not([hidden])) .touch-menu-button){display:none}body.touch .hud-card{left:calc(env(safe-area-inset-left) + 12px)}body.touch .quest-panel{top:56px;left:auto;right:calc(env(safe-area-inset-right) + 12px)}body.touch .fullscreen-button{right:calc(env(safe-area-inset-right) + 16px)}body.touch .hotbar-wrap{bottom:calc(env(safe-area-inset-bottom) + 30px)}.touch-rotate{display:none}@media (orientation:portrait){body.touch .touch-rotate{z-index:50;color:#fff;text-align:center;pointer-events:auto;background:#2f3b24eb;place-items:center;padding:24px;font-size:18px;font-weight:600;display:grid;position:fixed;inset:0}}