:root{--bg: #1a2e1f;--panel: rgba(18, 28, 22, .92);--panel-border: rgba(210, 230, 200, .25);--panel-radius: 14px;--text: #f2f7ef;--muted: #b7c9b4;--accent: #7ec8a3;--accent-strong: #4faf7f;--danger: #e07a6a;--shadow: 0 8px 28px rgba(0, 0, 0, .35);--font: "Segoe UI", "Trebuchet MS", sans-serif;--item-icon-size: 40px;--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font);touch-action:none;user-select:none}#app{position:relative;width:100%;height:100%}#game-canvas{display:block;width:100%;height:100%;position:relative;z-index:0}#ui-root{position:absolute;inset:0;pointer-events:none;z-index:2}#ui-root .panel,#ui-root .ui-btn,#mobile-controls,#orientation-hint{pointer-events:auto}#hud{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px 14px;padding-left:calc(14px + var(--safe-left));padding-right:calc(14px + var(--safe-right))}#hud-left{display:flex;flex-direction:column;gap:4px}#area-label{font-size:15px;font-weight:650;letter-spacing:.02em;text-shadow:0 1px 8px rgba(0,0,0,.55)}#save-status{font-size:12px;color:var(--muted);min-height:1em}#hud-right{display:flex;gap:8px;pointer-events:auto}.ui-btn{appearance:none;border:1px solid var(--panel-border);background:var(--panel);color:var(--text);border-radius:10px;padding:8px 12px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;box-shadow:var(--shadow)}.ui-btn:active{transform:translateY(1px)}.ui-btn.secondary{background:transparent;box-shadow:none}.ui-btn.primary{background:var(--accent-strong);border-color:transparent;color:#102016}.panel{position:absolute;left:50%;bottom:calc(18px + var(--safe-bottom));transform:translate(-50%);width:min(420px,calc(100% - 24px));background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--panel-radius);padding:14px 16px;box-shadow:var(--shadow)}.panel.hidden,.hidden{display:none!important}#action-title,#dialogue-speaker{margin:0 0 8px;font-weight:700}#dialogue-text{margin:0 0 14px;line-height:1.45;color:var(--muted)}#action-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}#inventory-title{margin:0 0 10px;font-weight:700}#inventory-list{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:6px;max-height:40vh;overflow-y:auto}#inventory-list li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:#ffffff0f;border:1px solid rgba(210,230,200,.12)}#inventory-list .item-icon{width:var(--item-icon-size);height:var(--item-icon-size);border-radius:8px;flex-shrink:0;image-rendering:pixelated;background:#0003;object-fit:contain}#inventory-list .item-swatch{width:14px;height:14px;border-radius:4px;flex-shrink:0}#inventory-list .item-name{font-size:14px;font-weight:600}#inventory-empty.muted,.muted{color:var(--muted);margin:0 0 12px;font-size:13px}#toast{position:absolute;top:64px;left:50%;transform:translate(-50%);background:var(--panel);border:1px solid var(--panel-border);border-radius:999px;padding:8px 14px;font-size:13px;box-shadow:var(--shadow);pointer-events:none}#travel-fade{position:absolute;inset:0;background:#1a1510;opacity:0;pointer-events:none;z-index:15;transition:opacity .22s ease;display:grid;place-items:center}#travel-fade.active{opacity:1;pointer-events:auto}#travel-fade-title{margin:0;padding:0 24px;color:#f3e6d0;font-size:clamp(18px,3.5vw,28px);letter-spacing:.04em;text-align:center;text-shadow:0 2px 12px rgba(0,0,0,.45)}#bus-ride{position:fixed;inset:0;z-index:40;overflow:hidden;pointer-events:none;opacity:0;visibility:hidden;background:#1a1e22;contain:strict;transform:translateZ(0)}#bus-ride.hidden{display:none!important;pointer-events:none}#bus-ride.is-active{display:block;pointer-events:auto;visibility:visible;opacity:1;transition:opacity .25s ease}#bus-ride.is-active.is-covering .bus-ride-veil{opacity:1}#bus-ride.is-active.is-exiting{opacity:0;transition:opacity .34s ease}#bus-ride.is-frozen .bus-ride-track,#bus-ride.is-frozen .bus-ride-dashes,#bus-ride.is-frozen .bus-ride-bus,#bus-ride.is-frozen .bus-wheel,#bus-ride.is-frozen .bus-ride-sign,#bus-ride.is-frozen .bus-ride-bar i,#bus-ride.is-frozen .bus-ride-sky,#bus-ride.is-frozen .bus-ride-scenery{animation-play-state:paused!important}.bus-ride-sky{position:absolute;inset:0;opacity:0;transform:translateZ(0);backface-visibility:hidden}.bus-ride-sky.sky-meadow{background:linear-gradient(180deg,#7eb8e8,#c8e4a8 52%,#6faf5a 52%,#5a8f48 70%,#4a4e52 70%)}.bus-ride-sky.sky-city{background:linear-gradient(180deg,#6a90b8,#a8b4b0 52%,#8a8f88 52%,#6e7270 70%,#4a4e52 70%)}#bus-ride.from-meadow .sky-meadow,#bus-ride.from-city .sky-city{opacity:1}#bus-ride.is-playing.from-meadow.to-city .sky-meadow{animation:bus-fade-out calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}#bus-ride.is-playing.from-meadow.to-city .sky-city{animation:bus-fade-in calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}#bus-ride.is-playing.from-city.to-meadow .sky-city{animation:bus-fade-out calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}#bus-ride.is-playing.from-city.to-meadow .sky-meadow{animation:bus-fade-in calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}@keyframes bus-fade-out{0%{opacity:1}to{opacity:0}}@keyframes bus-fade-in{0%{opacity:0}to{opacity:1}}.bus-ride-scenery{position:absolute;left:0;right:0;top:46%;height:24%;opacity:0;pointer-events:none;overflow:hidden;transform:translateZ(0);backface-visibility:hidden;contain:layout paint}#bus-ride.from-meadow .scenery-meadow,#bus-ride.from-city .scenery-city{opacity:1}#bus-ride.is-playing.from-meadow.to-city .scenery-meadow{animation:bus-fade-out calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}#bus-ride.is-playing.from-meadow.to-city .scenery-city{animation:bus-fade-in calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}#bus-ride.is-playing.from-city.to-meadow .scenery-city{animation:bus-fade-out calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}#bus-ride.is-playing.from-city.to-meadow .scenery-meadow{animation:bus-fade-in calc(var(--bus-ride-ms, 3.6s) * .28) ease calc(var(--bus-ride-ms, 3.6s) * .22) forwards}.bus-ride-track{position:absolute;left:0;top:0;bottom:0;display:flex;align-items:flex-end;gap:clamp(56px,11vw,100px);padding-bottom:4px;width:max-content;transform:translateZ(0);will-change:transform;backface-visibility:hidden}#bus-ride.is-playing .bus-ride-track{animation:bus-track-scroll calc(var(--bus-ride-ms, 3.6s) * 1.1) linear infinite}@keyframes bus-track-scroll{0%{transform:translateZ(0)}to{transform:translate3d(-50%,0,0)}}.prop{flex:0 0 auto;display:block;position:relative}.prop.tree{width:28px;height:52px;background:#3f8a3a;border-radius:50% 50% 40% 40%;box-shadow:10px 18px 0 -6px #6b4a2e}.prop.tree.tall{height:64px;width:32px}.prop.block{width:42px;height:68px;border-radius:2px 2px 0 0;background:#b0a89a;box-shadow:inset 0 -10px #6a6060}.prop.block.tall{height:90px;width:50px;background:#9a9088}.prop.block.disco{height:82px;width:48px;background:#3a2a55;box-shadow:inset 0 -10px #1a1028}.prop.block.tapas{height:66px;width:44px;background:#c4785a;box-shadow:inset 0 -10px #5a2820}@media(max-width:700px){.bus-ride-track .prop:nth-child(n+5){display:none}.bus-ride-track{gap:64px}}.bus-ride-haze{position:absolute;inset:0;background:#10141838;pointer-events:none;z-index:2}.bus-ride-road{position:absolute;left:0;right:0;bottom:0;height:34%;background:#454a50;overflow:hidden;z-index:1;transform:translateZ(0)}.bus-ride-road:before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:#3a3e42}.bus-ride-dashes{position:absolute;left:0;top:48%;height:5px;width:200%;background:repeating-linear-gradient(90deg,#e8dcb0 0 44px,transparent 44px 80px);transform:translateZ(0);will-change:transform;opacity:.9;backface-visibility:hidden}#bus-ride.is-playing .bus-ride-dashes{animation:bus-dash-scroll .55s linear infinite}@keyframes bus-dash-scroll{0%{transform:translateZ(0)}to{transform:translate3d(-80px,0,0)}}.bus-ride-bus{position:absolute;left:50%;bottom:14%;width:min(200px,44vw);height:82px;transform:translate3d(-50%,0,0);z-index:3;backface-visibility:hidden;will-change:transform}#bus-ride.is-playing .bus-ride-bus{animation:bus-bob .65s ease-in-out infinite}@keyframes bus-bob{0%,to{transform:translate3d(-50%,0,0)}50%{transform:translate3d(-50%,-4px,0)}}.bus-body{position:absolute;inset:8px 8% 16px 0;background:#e05038;border-radius:12px 20px 8px 8px;overflow:hidden;box-shadow:0 8px #00000047}.bus-windows{position:absolute;left:10%;right:18%;top:14%;height:34%;background:#9fd0ea;border-radius:4px}.bus-stripe{position:absolute;left:0;right:0;top:55%;height:10%;background:#f5e6a0}.bus-door{position:absolute;right:8%;top:18%;width:14%;bottom:8%;background:#4a2020;border-radius:3px}.bus-headlight{position:absolute;right:2%;bottom:22%;width:9px;height:9px;border-radius:50%;background:#ffe8a0}.bus-wheel{position:absolute;bottom:0;width:20px;height:20px;border-radius:50%;background:#222;box-shadow:inset 0 0 0 5px #555}#bus-ride.is-playing .bus-wheel{animation:bus-wheel-spin .45s linear infinite}.bus-wheel-front{right:18%}.bus-wheel-back{left:16%}@keyframes bus-wheel-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.bus-ride-sign{position:absolute;top:30%;left:0;padding:10px 16px;background:#c9a66b;color:#3d2a18;font-weight:700;font-size:clamp(13px,2.4vw,16px);border-radius:6px;border:3px solid #5a3d22;white-space:nowrap;z-index:2;opacity:0;transform:translate3d(110vw,0,0);will-change:transform,opacity;backface-visibility:hidden;contain:layout paint}#bus-ride.is-playing .bus-ride-sign{animation:bus-sign-pass var(--bus-ride-ms, 3.6s) linear forwards}@keyframes bus-sign-pass{0%{transform:translate3d(110vw,0,0);opacity:0}48%{transform:translate3d(110vw,0,0);opacity:0}52%{opacity:1}62%{transform:translate3d(38vw,0,0);opacity:1}78%{transform:translate3d(-10vw,0,0);opacity:1}90%{transform:translate3d(-55vw,0,0);opacity:0}to{transform:translate3d(-55vw,0,0);opacity:0}}.bus-ride-chrome{position:absolute;left:0;right:0;top:0;padding:calc(18px + env(safe-area-inset-top,0px)) 20px 12px;text-align:center;z-index:4;background:linear-gradient(180deg,rgba(12,16,20,.5),transparent);pointer-events:none}#bus-ride-route{margin:0 0 4px;color:#d8e8f0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.85}#bus-ride-title{margin:0 0 12px;color:#fff8ec;font-size:clamp(20px,4vw,30px);font-weight:700;letter-spacing:.03em;text-shadow:0 2px 10px rgba(0,0,0,.4)}.bus-ride-bar{width:min(280px,55vw);height:4px;margin:0 auto;border-radius:999px;background:#fff3;overflow:hidden}.bus-ride-bar i{display:block;height:100%;width:100%;border-radius:inherit;background:#e85a3a;transform:scaleX(0);transform-origin:left center;will-change:transform}#bus-ride.is-playing .bus-ride-bar i{animation:bus-progress var(--bus-ride-ms, 3.6s) linear forwards}@keyframes bus-progress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.bus-ride-veil{position:absolute;inset:0;background:#12151a;opacity:0;z-index:8;pointer-events:none;transition:opacity .2s linear;transform:translateZ(0)}#orientation-hint{position:absolute;inset:0;display:grid;place-items:center;background:#080e0aeb;z-index:20;text-align:center;padding:24px;font-size:18px}#mobile-controls{position:absolute;left:calc(18px + var(--safe-left));bottom:calc(18px + var(--safe-bottom));z-index:5}#joystick-zone{width:140px;height:140px;display:grid;place-items:center;touch-action:none}#joystick-base{position:relative;width:120px;height:120px;border-radius:50%;background:#14201873;border:2px solid rgba(255,255,255,.22)}#joystick-knob{position:absolute;left:50%;top:50%;width:52px;height:52px;margin-left:-26px;margin-top:-26px;border-radius:50%;background:#7ec8a3d9;border:2px solid rgba(255,255,255,.35);touch-action:none}#hud-right .ui-btn{min-height:40px;min-width:52px;padding:10px 12px}@media(pointer:fine){#mobile-controls{display:none!important}}@media(pointer:coarse){#mobile-controls:not(.hidden){display:block}}@media(orientation:portrait)and (pointer:coarse){#orientation-hint:not(.hidden){display:grid}}