:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--sky-dusk: oklch(65% .12 31);--valley-green: oklch(55% .16 145);--water-blue: oklch(55% .13 230);--crystal-cyan: oklch(78% .17 205);--lantern-gold: oklch(82% .15 82);--ink-overlay: oklch(12% .03 260);--hud-surface: oklch(18% .04 255 / .78);--hud-strong: oklch(23% .05 250 / .9);--hud-border: oklch(88% .08 205 / .26);--hud-text: oklch(97% .01 95);--hud-muted: oklch(82% .03 245);--warning-fall: oklch(63% .18 28);--control-glow: oklch(78% .17 205 / .42);--safe-top: max(14px, env(safe-area-inset-top));--safe-right: max(14px, env(safe-area-inset-right));--safe-bottom: max(14px, env(safe-area-inset-bottom));--safe-left: max(14px, env(safe-area-inset-left));background:var(--ink-overlay);color:var(--hud-text);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}body{min-width:320px;min-height:100dvh;background:radial-gradient(circle at 68% 22%,oklch(82% .15 82 / .24),transparent 22rem),linear-gradient(180deg,var(--sky-dusk),var(--water-blue) 44%,var(--ink-overlay))}button,summary{font:inherit;color:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{position:relative;width:100vw;height:100dvh;min-height:100vh;overflow:hidden;background:var(--ink-overlay);isolation:isolate}.game-stage,.game-canvas{position:absolute;inset:0;width:100%;height:100%}.game-stage{z-index:0;background:linear-gradient(180deg,var(--sky-dusk),var(--water-blue) 42%,var(--valley-green))}.game-canvas{display:block;touch-action:none}.game-stage:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,oklch(10% .03 260 / .08),transparent 28%),radial-gradient(circle at 50% 100%,oklch(6% .03 260 / .44),transparent 44%)}.canvas-status{position:absolute;left:50%;bottom:calc(var(--safe-bottom) + 1rem);z-index:1;max-width:min(24rem,calc(100vw - 2rem));transform:translate(-50%);padding:.6rem .85rem;border-radius:8px;background:var(--hud-surface);color:var(--hud-muted);font-size:.86rem;line-height:1.2;text-align:center;backdrop-filter:blur(12px)}.boot-screen{position:absolute;inset:0;z-index:40;display:grid;place-items:center;padding:calc(var(--safe-top) + 1rem) var(--safe-right) calc(var(--safe-bottom) + 1rem) var(--safe-left);overflow:hidden;background:radial-gradient(circle at 50% 28%,oklch(82% .15 82 / .2),transparent 20rem),linear-gradient(180deg,#0c14388c,#000412e6)}.boot-atmosphere{position:absolute;inset:-12%;pointer-events:none;background:radial-gradient(circle at 28% 72%,oklch(78% .17 205 / .18),transparent 17rem),radial-gradient(circle at 72% 68%,oklch(55% .16 145 / .22),transparent 18rem),linear-gradient(120deg,transparent 20%,oklch(97% .01 95 / .08),transparent 48%);filter:saturate(1.2);animation:boot-drift 8s ease-in-out infinite alternate}.boot-start{position:relative;display:grid;justify-items:center;gap:1rem;width:min(46rem,100%);min-height:min(26rem,calc(100dvh - 3rem));padding:1.5rem;border:0;border-radius:0;background:transparent;cursor:pointer}.boot-start:focus-visible,.hud-icon-button:focus-visible,.quality-option:focus-visible,.action-prompt:focus-visible,.touch-button:focus-visible,.quality-menu summary:focus-visible{outline:3px solid var(--crystal-cyan);outline-offset:4px}.boot-logo{align-self:end;display:grid;gap:.24rem;margin:0;max-width:100%;text-align:center;text-shadow:0 2px 0 oklch(8% .04 260),0 10px 28px oklch(4% .03 260 / .65);animation:logo-rise .76s cubic-bezier(.16,1,.3,1) both}.boot-logo__names,.boot-logo__title{display:block;overflow-wrap:anywhere;text-wrap:balance;letter-spacing:0}.boot-logo__names{color:var(--lantern-gold);font-size:clamp(1.4rem,5vw,3.1rem);font-weight:850;line-height:1.02}.boot-logo__title{color:var(--hud-text);font-size:clamp(3rem,10vw,5.8rem);font-weight:950;line-height:.94}.boot-logo__title:after{content:"";display:block;width:min(22rem,78%);height:4px;margin:.7rem auto 0;background:linear-gradient(90deg,transparent,var(--crystal-cyan),var(--lantern-gold),transparent);animation:logo-shimmer 2.4s ease-in-out infinite}.boot-crest{display:inline-grid;grid-template-columns:repeat(2,1fr);gap:.38rem;min-width:7rem;color:var(--ink-overlay);font-weight:950;font-size:1.5rem}.boot-crest span{display:grid;place-items:center;width:3rem;height:3rem;border:2px solid oklch(97% .01 95 / .78);border-radius:50%;background:var(--lantern-gold)}.boot-cta{display:inline-flex;align-items:center;gap:.52rem;min-height:48px;max-width:100%;padding:.72rem 1rem;border:1px solid oklch(97% .01 95 / .3);border-radius:999px;background:#0205119e;color:var(--hud-text);font-size:1rem;font-weight:800;line-height:1;backdrop-filter:blur(10px)}.game-hud{position:absolute;inset:0;z-index:20;pointer-events:none;padding:calc(var(--safe-top) + .55rem) calc(var(--safe-right) + .55rem) calc(var(--safe-bottom) + .55rem) calc(var(--safe-left) + .55rem)}.hud-topline{display:grid;grid-template-columns:minmax(12rem,auto) minmax(10rem,1fr) auto;align-items:start;gap:.7rem}.hud-counters,.hud-controls{display:flex;flex-wrap:wrap;gap:.5rem;pointer-events:auto}.hud-controls{justify-content:flex-end}.hud-counter,.hud-objective,.hud-renderer,.hud-icon-button,.quality-menu summary,.action-prompt,.hud-toast,.quality-menu__panel{border:1px solid var(--hud-border);background:var(--hud-surface);color:var(--hud-text);backdrop-filter:blur(14px)}.hud-counter{display:grid;grid-template-columns:auto auto;grid-template-areas:"icon label" "icon value";align-items:center;column-gap:.48rem;min-width:8.4rem;min-height:52px;padding:.55rem .68rem;border-radius:8px}.hud-counter svg{grid-area:icon;color:var(--lantern-gold)}.hud-counter__label{grid-area:label;color:var(--hud-muted);font-size:.72rem;font-weight:750;line-height:1}.hud-counter strong{grid-area:value;min-width:0;overflow:hidden;font-size:1.06rem;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}.hud-objective{justify-self:center;display:flex;align-items:center;justify-content:center;gap:.48rem;min-height:48px;max-width:min(34rem,100%);padding:.62rem .8rem;border-radius:8px;font-weight:760;line-height:1.2;text-align:center;text-wrap:balance;pointer-events:auto}.hud-objective svg{flex:0 0 auto;color:var(--crystal-cyan)}.hud-renderer{display:inline-flex;align-items:center;gap:.42rem;min-height:46px;padding:0 .66rem;border-radius:8px;color:var(--hud-muted);font-size:.76rem;font-weight:780;line-height:1;white-space:nowrap}.hud-renderer svg{color:var(--crystal-cyan)}.hud-icon-button,.quality-menu summary{display:grid;place-items:center;width:46px;height:46px;padding:0;border-radius:8px;cursor:pointer}.hud-icon-button{border:1px solid var(--hud-border)}.quality-menu{position:relative}.quality-menu summary{list-style:none}.quality-menu summary::-webkit-details-marker{display:none}.quality-menu__panel{position:absolute;top:calc(100% + .48rem);right:0;display:grid;gap:.38rem;min-width:11rem;padding:.45rem;border-radius:8px}.quality-option{min-height:42px;padding:.52rem .62rem;border:0;border-radius:6px;background:transparent;color:var(--hud-text);font-size:.88rem;font-weight:760;text-align:left;cursor:pointer}.quality-option:hover,.quality-option[data-selected=true]{background:oklch(78% .17 205 / .18)}.action-prompt{position:absolute;left:50%;bottom:calc(var(--safe-bottom) + 1rem);display:inline-flex;align-items:center;justify-content:center;gap:.52rem;min-width:10rem;min-height:54px;max-width:min(26rem,calc(100vw - 2rem));padding:.78rem 1rem;border-radius:999px;transform:translate(-50%);font-size:1rem;font-weight:860;line-height:1.05;text-align:center;pointer-events:auto;cursor:pointer}.action-prompt svg{color:var(--lantern-gold);flex:0 0 auto}.hud-toast{position:absolute;left:50%;top:calc(var(--safe-top) + 5rem);max-width:min(22rem,calc(100vw - 2rem));padding:.64rem .82rem;border-radius:8px;transform:translate(-50%);color:var(--lantern-gold);font-size:1rem;font-weight:850;line-height:1.15;text-align:center}.touch-controls{position:absolute;inset:0;z-index:25;display:none;pointer-events:none;user-select:none;-webkit-user-select:none}.touch-controls[data-active=true]{display:block}.touch-zone{position:absolute;pointer-events:auto;touch-action:none}.touch-zone--move{left:calc(var(--safe-left) + 1rem);bottom:calc(var(--safe-bottom) + 1.15rem);width:10rem;height:10rem}.touch-zone--look{right:calc(var(--safe-right) + 1rem);bottom:calc(var(--safe-bottom) + 1.05rem);display:grid;grid-template-columns:8.5rem 6.8rem;grid-template-rows:4rem 4rem;gap:.72rem;align-items:end;justify-items:center}.touch-pad,.touch-button{border:1px solid oklch(97% .01 95 / .28);background:#01071780;color:var(--hud-text);box-shadow:inset 0 0 0 1px oklch(78% .17 205 / .12);backdrop-filter:blur(10px);touch-action:none}.touch-pad{position:relative;display:grid;place-items:center;width:8.8rem;height:8.8rem;border-radius:50%}.move-pad{position:absolute;left:0;bottom:0}.look-pad{grid-row:1 / 3;grid-column:1;width:8.5rem;height:8.5rem;color:var(--crystal-cyan)}.touch-pad:before{content:"";position:absolute;inset:24%;border-radius:50%;border:1px solid oklch(97% .01 95 / .2)}.touch-stick{position:relative;width:3.25rem;height:3.25rem;border-radius:50%;background:var(--crystal-cyan);transition:transform 90ms ease-out}.touch-pad[data-active=true],.touch-button[data-active=true]{border-color:oklch(78% .17 205 / .7);background:oklch(21% .07 245 / .72)}.touch-button{display:grid;place-items:center;min-width:4rem;min-height:4rem;padding:.55rem .7rem;border-radius:8px;font-weight:900;line-height:1;cursor:pointer}.touch-button--swing{grid-column:2;grid-row:1;width:6.8rem;background:#f4b93ce0;color:#00061b}.touch-button--action{grid-column:2;grid-row:2;width:4.2rem;justify-self:end;color:var(--lantern-gold)}.pause-panel{position:absolute;inset:0;z-index:35;display:grid;place-items:center;gap:1rem;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);background:#00010894;backdrop-filter:blur(8px);text-align:center}.pause-panel>div{max-width:min(28rem,calc(100vw - 2rem))}.pause-panel h2,.pause-panel p{margin:0;overflow-wrap:anywhere;text-wrap:balance}.pause-panel h2{margin-top:.25rem;font-size:2rem;line-height:1.08}.pause-panel button{min-height:48px;padding:.74rem 1.2rem;border:0;border-radius:8px;background:var(--lantern-gold);color:#00061b;font-weight:860;cursor:pointer}.pause-kicker{color:var(--crystal-cyan);font-size:.9rem;font-weight:820}@media(hover:hover){.boot-start:hover .boot-cta,.hud-icon-button:hover,.quality-menu summary:hover,.action-prompt:hover,.touch-button:hover{filter:brightness(1.08)}}@media(pointer:coarse),(max-width:900px){.canvas-status{bottom:calc(var(--safe-bottom) + 11rem)}.action-prompt{bottom:calc(var(--safe-bottom) + .7rem)}}@media(max-width:980px){.hud-topline{grid-template-columns:1fr auto}.hud-objective{grid-column:1 / -1;grid-row:2;justify-self:start;max-width:min(34rem,calc(100vw - var(--safe-left) - var(--safe-right) - 1.1rem))}}@media(max-width:700px){.game-hud{padding-top:calc(var(--safe-top) + .45rem)}.hud-topline{gap:.48rem}.hud-counter{min-width:7.2rem;min-height:48px;padding:.48rem .56rem}.hud-renderer{display:none}.touch-zone--move{left:calc(var(--safe-left) + .5rem);bottom:calc(var(--safe-bottom) + .5rem);width:8.4rem;height:8.4rem}.touch-zone--look{right:calc(var(--safe-right) + .5rem);bottom:calc(var(--safe-bottom) + .5rem);grid-template-columns:7rem 5.2rem;grid-template-rows:3.55rem 3.55rem;gap:.5rem}.touch-pad{width:7.5rem;height:7.5rem}.look-pad{width:7rem;height:7rem}.touch-button--swing{width:5.2rem}.touch-button--action{width:3.8rem}}@media(max-height:540px)and (orientation:landscape){.hud-counter,.hud-objective,.hud-renderer,.hud-icon-button,.quality-menu summary{min-height:42px}.touch-zone--move,.touch-zone--look{bottom:calc(var(--safe-bottom) + .35rem)}.touch-pad{width:7.2rem;height:7.2rem}.look-pad{width:7.1rem;height:7.1rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}.boot-atmosphere{animation:none}.boot-logo,.boot-logo__title:after{animation:none}}@keyframes logo-rise{0%{opacity:0;transform:translateY(18px) scale(.96);filter:blur(8px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes logo-shimmer{0%,to{opacity:.55;transform:scaleX(.78)}50%{opacity:1;transform:scaleX(1)}}@keyframes boot-drift{0%{transform:translate3d(-1%,0,0) scale(1)}to{transform:translate3d(1%,-1%,0) scale(1.04)}}