:root{--bg:#0b1020;--panel:#0f1628e0;--panel-border:#94b4ff38;--text:#eef3ff;--muted:#9aabc8;--accent:#7dd3fc;--accent-2:#fbbf24;--danger:#fb7185;--success:#4ade80;--ember:#ff6b3d;--radius:16px;--font:"Outfit", system-ui, sans-serif;--display:"Cormorant Garamond", Georgia, serif;--ui-scale:1;--shadow:0 12px 40px #00000073;--focus:0 0 0 3px #7dd3fc8c}*{box-sizing:border-box}html,body{background:var(--bg);width:100%;height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;touch-action:none;-webkit-user-select:none;user-select:none;margin:0;padding:0;overflow:hidden}#app{width:100%;height:100%;position:relative}#game-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}#ui-root{pointer-events:none;z-index:10;font-size:calc(16px * var(--ui-scale));position:absolute;inset:0}#ui-root .panel,#ui-root button,#ui-root input,#ui-root select,#ui-root a,#ui-root .interactive{pointer-events:auto}.screen{opacity:0;visibility:hidden;pointer-events:none;background:radial-gradient(at 50% 20%,#283c648c,#080c18eb);flex-direction:column;justify-content:center;align-items:center;padding:1.25rem;transition:opacity .28s,visibility .28s;display:flex;position:absolute;inset:0}.screen.active{opacity:1;visibility:visible;pointer-events:auto}.brand{font-family:var(--display);letter-spacing:.04em;background:linear-gradient(120deg,#ff9a5c,#7dd3fc 45%,#c084fc);color:#0000;text-shadow:0 0 40px #7dd3fc40;-webkit-background-clip:text;background-clip:text;margin:0 0 .25rem;font-size:clamp(2.6rem,8vw,4.2rem);font-weight:700}.tagline{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:0 0 2rem;font-size:.78rem;font-weight:500}.panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);width:min(100%,520px);max-width:520px;padding:1.25rem 1.5rem}.btn{appearance:none;color:var(--text);font-family:var(--font);cursor:pointer;background:linear-gradient(#5082c859,#28467873);border:1px solid #7dd3fc59;border-radius:999px;min-width:48px;min-height:48px;padding:.85rem 1.4rem;font-size:1rem;font-weight:600;transition:transform .12s,box-shadow .12s,border-color .12s}.btn:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 6px 20px #7dd3fc33}.btn:active{transform:translateY(1px)}.btn:focus-visible{box-shadow:var(--focus);outline:none}.btn.primary{color:#041018;background:linear-gradient(#38bdf8,#0284c7);border-color:#7dd3fc}.btn.ghost{background:0 0}.btn.danger{background:linear-gradient(#b4324666,#64142880);border-color:#fb718580}.btn-row{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:1rem;display:flex}.hud{pointer-events:none;display:none;position:absolute;inset:0}.hud.active{display:block}.hud-top{padding:max(.75rem, env(safe-area-inset-top)) .9rem 0;pointer-events:none;justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex;position:absolute;top:0;left:0;right:0}.hud-chip{pointer-events:auto;background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow);text-align:center;border-radius:14px;min-width:4.5rem;padding:.55rem .85rem}.hud-chip .label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:.65rem;display:block}.hud-chip .value{color:var(--accent-2);font-size:1.15rem;font-weight:700}.objectives{pointer-events:auto;flex-direction:column;gap:.35rem;max-width:min(360px,70vw);display:flex}.obj-item{background:var(--panel);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;justify-content:space-between;gap:.75rem;padding:.4rem .7rem;font-size:.85rem;display:flex}.obj-item.done{color:var(--success);border-color:#4ade8073}.hud-actions{bottom:max(.75rem, env(safe-area-inset-bottom));pointer-events:auto;justify-content:center;gap:.6rem;padding:0 .75rem;display:flex;position:absolute;left:0;right:0}.hud-actions .btn{padding:.65rem 1rem;font-size:.9rem}.world-map{width:min(960px,100%);max-height:min(80vh,720px);padding:.5rem;overflow:auto}.world-section{margin-bottom:1.25rem}.world-section h2{font-family:var(--display);margin:0 0 .25rem;font-size:1.6rem}.world-section p{color:var(--muted);margin:0 0 .75rem;font-size:.9rem}.level-grid{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:.55rem;display:grid}.level-btn{aspect-ratio:1;border:1px solid var(--panel-border);color:var(--text);cursor:pointer;font-weight:700;font-family:var(--font);background:#141e37e6;border-radius:14px;transition:transform .12s,border-color .12s;position:relative}.level-btn:hover:not(:disabled){border-color:var(--accent);transform:translateY(-2px)}.level-btn:focus-visible{box-shadow:var(--focus);outline:none}.level-btn:disabled{opacity:.35;cursor:not-allowed}.level-btn .stars{color:var(--accent-2);letter-spacing:1px;font-size:.65rem;position:absolute;bottom:4px;left:0;right:0}.settings-grid{gap:.85rem;display:grid}.settings-grid label{color:var(--muted);gap:.35rem;font-size:.9rem;display:grid}.settings-grid input[type=range]{width:100%;accent-color:var(--accent)}.settings-grid .check{color:var(--text);align-items:center;gap:.55rem;display:flex}.overlay-title{font-family:var(--display);text-align:center;margin:0 0 .5rem;font-size:2.4rem}.stars-big{color:var(--accent-2);letter-spacing:.2em;text-align:center;margin:.5rem 0 1rem;font-size:2rem}.muted{color:var(--muted);text-align:center}.tutorial-box{max-width:420px;margin:0 auto 1rem;line-height:1.5}.tutorial-box li{margin:.35rem 0}body.high-contrast{--panel:#000000eb;--panel-border:#fff;--text:#fff;--muted:#ddd;--accent:#00e5ff;--accent-2:#ffe600}body.high-contrast .btn{border-width:2px}body.reduced-motion .screen,body.reduced-motion .btn{transition:none}@media (max-width:640px){.hud-top{flex-wrap:wrap}.objectives{order:3;width:100%;max-width:100%}.brand{font-size:2.4rem}.panel{padding:1rem}}@media (orientation:landscape) and (max-height:500px){.hud-chip .value{font-size:1rem}.obj-item{padding:.25rem .5rem;font-size:.75rem}}