:root{--app-height: 100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f7fff0;background:#c4dceb;font-synthesis:none;text-rendering:optimizeLegibility}@supports (height: 100dvh){:root{--app-height: 100dvh}}*{box-sizing:border-box}html{height:-webkit-fill-available}html,body,#root{width:100%;min-width:320px;height:100%;min-height:100%;min-height:var(--app-height);margin:0;overflow:hidden;overscroll-behavior:none}body{position:fixed;top:0;right:0;bottom:0;left:0;min-height:-webkit-fill-available;-webkit-font-smoothing:antialiased}button,canvas{-webkit-tap-highlight-color:transparent}.experience,.canvas-shell{width:100%;height:var(--app-height);min-height:-webkit-fill-available}.experience{position:fixed;top:0;right:0;bottom:0;left:0;isolation:isolate;background:#c4dceb;overflow:hidden}.canvas-shell{position:absolute;top:0;right:0;bottom:0;left:0}.canvas-shell canvas{display:block;width:100%;height:100%;cursor:grab;outline:none;touch-action:none}.canvas-shell canvas:active{cursor:grabbing}.experience.is-selecting{display:grid;place-items:center;background:#d7e7df}.experience.is-selecting .canvas-shell{display:none}.world-select{position:relative;z-index:3;display:grid;gap:22px;width:min(920px,calc(100vw - 40px));max-height:calc(var(--app-height) - 40px);padding:max(22px,env(safe-area-inset-top)) 0 max(22px,env(safe-area-inset-bottom));color:#173a2a;overflow:auto}.world-select .eyebrow{margin:0}.world-select h1{margin:0;font-size:clamp(34px,5vw,62px);font-weight:850;line-height:1;letter-spacing:0}.world-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.world-card{position:relative;display:grid;min-height:230px;align-content:end;gap:10px;padding:18px;border:1px solid rgba(23,58,42,.14);border-radius:8px;color:#153327;background:#edf5e6;box-shadow:0 18px 50px #29513e24;font:inherit;text-align:left;cursor:pointer;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.world-card.world-meadow{background:#cce8a8}.world-card.world-snow{background:#dcebf0}.world-card.world-falls{background:#b8ddd0}.world-card:hover{border-color:#173a2a47;box-shadow:0 22px 58px #29513e2e;transform:translateY(-3px)}.world-card:focus-visible{outline:3px solid rgba(28,91,57,.58);outline-offset:3px}.world-card span,.world-card strong,.world-card small{position:relative;z-index:1}.world-card span{font-size:11px;font-weight:850;opacity:.72}.world-card strong{font-size:clamp(26px,3vw,38px);font-weight:850;line-height:1;letter-spacing:0}.world-card small{max-width:230px;font-size:13px;font-weight:650;line-height:1.55;opacity:.72}.intro{position:absolute;z-index:2;top:max(clamp(24px,5vw,64px),env(safe-area-inset-top));left:max(clamp(24px,5vw,72px),env(safe-area-inset-left));width:min(390px,calc(100vw - 48px));color:#174f2c;pointer-events:none;opacity:0;transform:translateY(10px);transition:opacity .8s ease .15s,transform .8s cubic-bezier(.22,1,.36,1) .15s}.intro.is-ready{opacity:1;transform:translateY(0)}.experience.is-night .intro{color:#fffffff0;text-shadow:0 2px 18px rgba(3,14,24,.46)}.experience.is-night .intro>p:last-child,.experience.is-night .eyebrow{opacity:.86}.eyebrow{margin:0 0 10px;font-size:10px;font-weight:800;line-height:1;letter-spacing:.22em;opacity:.65}.intro h1{margin:0;font-size:clamp(38px,5vw,72px);font-weight:850;line-height:.95;letter-spacing:0}.intro>p:last-child{max-width:330px;margin:17px 0 0;font-size:clamp(13px,1.3vw,16px);font-weight:550;line-height:1.65;opacity:.72}.intro>p:last-child span{display:block}.hud-stack{position:absolute;z-index:3;top:max(clamp(24px,4vw,54px),env(safe-area-inset-top));right:max(clamp(20px,3.6vw,52px),env(safe-area-inset-right));display:flex;flex-direction:column;align-items:stretch;gap:10px;width:min(248px,calc(100vw - 40px));pointer-events:none}.environment-panel,.shop-panel{width:100%;min-width:178px;padding:13px 16px 12px;border:1px solid rgba(255,255,255,.34);border-radius:16px;color:#fffffff0;background:#1731363d;box-shadow:0 12px 32px #0f272d1f;text-shadow:0 1px 8px rgba(12,33,40,.38);pointer-events:auto;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.shop-panel{padding:0;overflow:hidden}.shop-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:0;color:inherit;background:transparent;font:inherit;text-align:left;cursor:pointer}.shop-toggle span{display:grid;gap:3px;font-size:12px;font-weight:850;letter-spacing:.08em}.shop-toggle small{font-size:9px;font-weight:750;letter-spacing:.12em;opacity:.62}.shop-toggle strong{padding:5px 9px;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:#ffffff21;font-size:10px;font-weight:850}.shop-list{display:grid;gap:8px;max-height:min(370px,calc(var(--app-height) - 230px));padding:0 10px 11px;overflow:auto}.shop-item{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:13px;background:#ffffff1a}.shop-item h2{margin:0;font-size:11px;font-weight:850;letter-spacing:.03em}.shop-item p{margin:4px 0 0;font-size:9px;font-weight:650;line-height:1.4;opacity:.72}.shop-item-actions{display:flex;flex-wrap:wrap;gap:6px}.shop-item button,.placement-hint button{padding:6px 8px;border:1px solid rgba(255,255,255,.32);border-radius:999px;color:inherit;background:#ffffff29;font:inherit;font-size:9px;font-weight:850;cursor:pointer}.shop-item button.is-danger{color:#ffebe6f5;border-color:#ffcdc14d;background:#96302347}.shop-toggle:hover strong,.shop-item button:hover,.placement-hint button:hover{background:#ffffff40}.environment-time,.environment-status{display:flex;align-items:center}.environment-time,.environment-status{pointer-events:none}.environment-time{justify-content:space-between;gap:24px}.environment-time span{font-size:9px;font-weight:850;letter-spacing:.2em;opacity:.66}.environment-time strong{font-size:20px;font-weight:760;line-height:1;letter-spacing:0}.environment-status{gap:7px;margin-top:9px;font-size:11px;font-weight:700;opacity:.82}.environment-status i{width:3px;height:3px;border-radius:50%;background:currentColor}.environment-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:11px;padding-top:10px;border-top:1px solid rgba(255,255,255,.18)}.environment-actions button{padding:6px 9px;border:1px solid rgba(255,255,255,.35);border-radius:999px;color:inherit;background:#ffffff1f;font:inherit;font-size:10px;font-weight:800;cursor:pointer;transition:background .16s ease,transform .16s ease}.environment-actions button:hover{background:#ffffff38}.environment-actions button:active{transform:scale(.96)}.environment-actions button:focus-visible{outline:2px solid rgba(255,255,255,.9);outline-offset:2px}.environment-actions span{flex-basis:100%;font-size:10px;font-weight:760;opacity:.76}.controls{position:absolute;z-index:2;bottom:max(clamp(20px,3vw,40px),env(safe-area-inset-bottom));left:max(clamp(20px,3.6vw,52px),env(safe-area-inset-left));display:flex;align-items:center;gap:12px;color:#ffffffeb;text-shadow:0 1px 8px rgba(22,57,26,.36);pointer-events:none}.animal-reaction{position:absolute;z-index:3;bottom:clamp(24px,3.2vw,44px);left:50%;display:flex;align-items:center;gap:9px;min-width:max-content;padding:10px 16px;border:1px solid rgba(255,255,255,.48);border-radius:999px;color:#174f2c;background:#f1fbeedb;box-shadow:0 10px 30px #1a4a2829;font-size:12px;line-height:1;pointer-events:none;opacity:0;transform:translate(-50%,10px) scale(.96);transition:opacity .22s ease,transform .35s cubic-bezier(.22,1,.36,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.animal-reaction.is-visible{opacity:1;transform:translate(-50%) scale(1)}.animal-reaction strong{font-weight:850}.animal-reaction span{opacity:.72}.placement-hint{position:absolute;z-index:4;bottom:max(clamp(74px,8vw,104px),env(safe-area-inset-bottom));left:50%;display:grid;gap:7px;width:min(430px,calc(100vw - 38px));padding:13px 16px;border:1px solid rgba(255,255,255,.45);border-radius:18px;color:#fffffff2;background:#132b3094;box-shadow:0 16px 42px #08171933;text-align:center;transform:translate(-50%);pointer-events:auto;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.placement-hint strong{font-size:13px;font-weight:850}.placement-hint span{font-size:11px;font-weight:650;line-height:1.45;opacity:.78}.placement-hint button{justify-self:center;color:inherit;background:#ffffff21}.startup-error{position:absolute;z-index:4;left:50%;bottom:max(clamp(24px,5vw,72px),env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:7px;width:min(420px,calc(100vw - 40px));padding:16px 18px;border:1px solid rgba(255,255,255,.48);border-radius:18px;color:#174f2c;background:#f1fbeee6;box-shadow:0 16px 42px #1a4a282e;transform:translate(-50%);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.startup-error strong{font-size:16px;font-weight:850}.startup-error span{font-size:12px;font-weight:650;line-height:1.55;opacity:.78}.controls p{margin:0;font-size:12px;font-weight:650;line-height:1.6}.performance{opacity:.72}.performance span{display:inline-block;width:3px;height:3px;margin:0 8px 2px;border-radius:50%;background:currentColor}.mouse-icon{position:relative;display:grid;width:22px;height:32px;place-items:start center;border:2px solid currentColor;border-radius:12px;opacity:.8}.mouse-icon i{width:2px;height:6px;margin-top:5px;border-radius:2px;background:currentColor;animation:scroll-hint 1.8s ease-in-out infinite}.vignette{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(118,166,190,.08),transparent 30%,transparent 70%,rgba(28,70,37,.2));pointer-events:none}@keyframes scroll-hint{0%,to{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(7px)}}@media(max-width:720px){.world-select{width:min(420px,calc(100vw - 36px));gap:16px;padding-top:max(18px,env(safe-area-inset-top))}.world-select h1{font-size:38px}.world-grid{grid-template-columns:1fr}.world-card{min-height:148px;padding:15px}.intro{top:max(22px,env(safe-area-inset-top));left:max(22px,env(safe-area-inset-left))}.intro h1{font-size:42px}.intro>p:last-child{max-width:270px;font-size:13px}.hud-stack{top:auto;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));width:min(220px,calc(100vw - 36px))}.environment-panel,.shop-panel{min-width:150px;padding:10px 12px}.shop-panel{padding:0}.shop-toggle{padding:10px 11px}.shop-list{max-height:min(285px,calc(var(--app-height) - 170px));padding:0 8px 9px}.shop-item{gap:8px;padding:8px}.shop-item-actions{gap:5px}.environment-time{gap:16px}.environment-time strong{font-size:17px}.environment-status{margin-top:6px;font-size:10px}.environment-actions{margin-top:7px;padding-top:7px}.environment-actions button,.environment-actions span{font-size:9px}.controls{bottom:max(218px,calc(env(safe-area-inset-bottom) + 218px));left:max(18px,env(safe-area-inset-left));max-width:calc(100vw - 36px)}.animal-reaction{bottom:82px;max-width:calc(100vw - 36px);min-width:0;white-space:nowrap}.placement-hint{bottom:max(86px,env(safe-area-inset-bottom))}.controls p:first-child{font-size:11px}}@media(orientation:landscape)and (max-height:520px){.world-select{width:min(820px,calc(100vw - 32px));gap:12px;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}.world-select h1{font-size:clamp(30px,8vh,42px)}.world-card{min-height:150px;padding:14px}.world-card strong{font-size:25px}.world-card small{font-size:11px;line-height:1.4}.intro{top:max(12px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));width:min(330px,42vw)}.eyebrow{margin-bottom:6px;font-size:8px}.intro h1{font-size:clamp(30px,7vh,44px)}.intro>p:last-child{margin-top:9px;font-size:11px;line-height:1.45}.hud-stack{top:max(10px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));bottom:auto;transform:scale(.86);transform-origin:top right}.shop-list{max-height:min(250px,calc(var(--app-height) - 120px))}.controls{bottom:max(10px,env(safe-area-inset-bottom));left:max(14px,env(safe-area-inset-left))}.animal-reaction{bottom:max(12px,env(safe-area-inset-bottom))}}@media(prefers-reduced-motion:reduce){.intro,.mouse-icon i{animation:none;transition:none}}
