:root{--bg: #0b0f1a;--green: #35e08f;--red: #e0364f;--gold: #f7c948;--text: #e8ecf5}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;overflow:hidden;background:var(--bg);font-family:Avenir Next,Segoe UI,system-ui,sans-serif;color:var(--text);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none}.app{position:relative;height:100%}.phaser-host,.phaser-host canvas{width:100%;height:100%}.topbar{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left));z-index:30;display:flex;gap:8px;pointer-events:none}.icon-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;font-size:18px;line-height:1;color:var(--text);background:#0b0f1a8c;border:1px solid rgba(255,255,255,.14);border-radius:10px;cursor:pointer;pointer-events:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.icon-btn:active{transform:scale(.94)}.exit-btn{position:absolute;top:calc(12px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));z-index:30;font-size:20px;font-weight:700}.settings-panel{position:absolute;top:48px;left:0;width:max-content;min-width:180px;padding:12px;color:var(--text);background:#0b0f1aeb;border:1px solid rgba(255,255,255,.14);border-radius:12px;pointer-events:auto;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 10px 30px #0006}.settings-panel__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#e8ecf5b3}.settings-panel__close{padding:0;font-size:13px;line-height:1;color:var(--text);background:none;border:none;cursor:pointer}.track-list{list-style:none;display:flex;flex-direction:column;gap:2px}.track-option{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:8px;cursor:pointer;font-size:14px}.track-option:hover{background:#ffffff0f}.track-option input{accent-color:var(--green);cursor:pointer}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;flex-direction:column;align-items:center;padding-top:calc(18px + env(safe-area-inset-top))}.gain{font-size:clamp(34px,9vw,52px);font-weight:800;color:var(--green);text-shadow:0 0 18px rgba(53,224,143,.45);font-variant-numeric:tabular-nums}.gain.danger{color:var(--red);text-shadow:0 0 18px rgba(224,54,79,.5)}.liq-meter{margin-top:8px;width:clamp(120px,38vw,200px);height:5px;border-radius:999px;background:#ffffff1a;overflow:hidden}.liq-meter__fill{height:100%;border-radius:999px;transition:width .12s linear}.liq-meter__fill--safe{background:var(--green)}.liq-meter__fill--warn{background:var(--gold)}.liq-meter__fill--danger{background:var(--red);animation:blink .6s step-end infinite}.combo{margin-top:2px;font-size:clamp(20px,5.5vw,30px);font-weight:800;color:var(--gold);animation:pop .25s ease}.mode-pill{margin-top:10px;padding:5px 14px;border-radius:999px;font-size:clamp(12px,3.4vw,15px);font-weight:800;letter-spacing:.08em;border:1px solid rgba(255,255,255,.16);background:#080a1299;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.mode-gas{color:var(--green);border-color:#35e08fa6}.mode-jump{color:var(--gold);border-color:#f7c94880}.mode-dive{color:var(--red);border-color:#e0364f8c}.mode-glide{color:var(--green);border-color:#35e08f80}.warning{margin-top:8px;font-size:clamp(14px,4vw,20px);font-weight:700;letter-spacing:.12em;color:var(--red);animation:blink .6s step-end infinite}.toast{position:absolute;top:38%;font-size:clamp(22px,6vw,34px);font-weight:800;color:var(--green);text-shadow:0 0 16px rgba(53,224,143,.6);animation:toast-rise 1.1s ease forwards}.level-row{display:flex;flex-direction:column;align-items:center;gap:5px;margin-top:4px}.level-badge{padding:3px 12px;border-radius:999px;font-size:clamp(13px,3.4vw,16px);font-weight:800;letter-spacing:.1em;color:var(--gold);border:1px solid rgba(247,201,72,.5);background:#080a1299;font-variant-numeric:tabular-nums}.level-progress{width:clamp(72px,22vw,110px);height:4px;border-radius:999px;background:#ffffff1f;overflow:hidden}.level-progress__fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--gold),var(--green));transition:width .15s linear}.level-banner{position:absolute;top:30%;display:flex;flex-direction:column;align-items:center;gap:2px;animation:pop .3s ease,banner-fade 1.2s ease forwards}.level-banner__title{font-size:clamp(32px,9vw,52px);font-weight:900;letter-spacing:.04em;color:var(--gold);text-shadow:0 0 24px rgba(247,201,72,.6)}.level-banner__sub{font-size:clamp(16px,4.4vw,22px);font-weight:800;letter-spacing:.22em;color:var(--green);text-shadow:0 0 14px rgba(53,224,143,.5)}.level-banner__hint{margin-top:6px;font-size:clamp(13px,3.6vw,17px);font-weight:600;letter-spacing:.04em;color:var(--text);opacity:.85}@keyframes banner-fade{0%,70%{opacity:1}to{opacity:0}}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:#0b0f1ae0;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);text-align:center;padding:24px;cursor:pointer}.overlay--over{justify-content:space-between;padding-top:calc(18px + env(safe-area-inset-top,0px));padding-bottom:max(28px,calc(16px + env(safe-area-inset-bottom,0px)));gap:16px}.overlay__body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,3.5vw,22px);width:100%;min-height:0;overflow-y:auto}.title{font-size:clamp(44px,12vw,72px);font-weight:900;letter-spacing:.04em;line-height:.95;color:var(--gold);text-shadow:0 4px 0 #7a5b10,0 0 30px rgba(247,201,72,.35)}.title span{display:block;color:var(--green);text-shadow:0 4px 0 #14573a,0 0 30px rgba(53,224,143,.35)}.tagline{font-size:clamp(15px,4.2vw,20px);opacity:.85}.howto{display:flex;flex-direction:column;gap:6px;font-size:clamp(13px,3.8vw,17px);font-weight:600;opacity:.75}.best{font-size:clamp(14px,4vw,18px);color:var(--gold);font-weight:700}.leaderboard{width:min(100%,360px);max-height:min(42vh,280px);overflow-y:auto;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#080a128c;text-align:left;touch-action:pan-y}.leaderboard__title{margin-bottom:8px;font-size:clamp(11px,3vw,13px);font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#e8ecf58c}.leaderboard__list{list-style:none;display:flex;flex-direction:column;gap:4px}.leaderboard__row{display:grid;grid-template-columns:1.4em 1fr auto;grid-template-rows:auto auto;gap:0 8px;align-items:baseline;padding:6px 8px;border-radius:8px;font-size:clamp(12px,3.4vw,14px);font-variant-numeric:tabular-nums}.leaderboard__row--highlight{background:#35e08f1f;border:1px solid rgba(53,224,143,.35)}.leaderboard__rank{grid-row:1 / span 2;align-self:center;font-weight:800;color:#e8ecf573}.leaderboard__gain{font-weight:800;color:var(--green)}.leaderboard__meta{font-weight:600;color:#e8ecf5a6;white-space:nowrap}.leaderboard__when{grid-column:2 / span 2;font-size:.9em;font-weight:600;color:#e8ecf566}.cta{font-size:clamp(20px,6vw,30px);font-weight:800;letter-spacing:.1em;color:var(--text);animation:blink 1.2s ease-in-out infinite}.cta--pinned{flex-shrink:0;width:min(100%,360px);padding:14px 20px;border-radius:14px;background:#0b0f1af2;border:1px solid rgba(255,255,255,.12);text-shadow:0 0 20px rgba(232,236,245,.35);animation:cta-pulse 1.2s ease-in-out infinite}.cta--waiting{color:#e8ecf573;animation:none}@keyframes cta-pulse{50%{opacity:.55}}.liquidated{font-size:clamp(40px,11vw,64px);font-weight:900;letter-spacing:.06em;color:var(--red);text-shadow:0 0 28px rgba(224,54,79,.5)}.result{display:flex;flex-direction:column;gap:10px}.result-gain{font-size:clamp(36px,10vw,56px);font-weight:800;color:var(--green);font-variant-numeric:tabular-nums}.result-rows{display:flex;gap:20px;justify-content:center;font-size:clamp(14px,4vw,18px);font-weight:600;opacity:.85}@keyframes blink{50%{opacity:.35}}@keyframes pop{0%{transform:scale(1.6)}to{transform:scale(1)}}@keyframes toast-rise{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-46px)}}.controls-legend{position:absolute;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translate(-50%);pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px 18px;border-radius:14px;background:#080a12b8;border:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.controls-row{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap}.controls-row--center{margin-bottom:2px}.control-item{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#e8ecf5e0;white-space:nowrap}.key-cap{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 8px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,#2a3144,#1a2030);box-shadow:0 2px #00000073,inset 0 1px #ffffff14;font-family:inherit;font-size:15px;font-weight:700;color:#f2f5fb;line-height:1}.key-cap--wide{min-width:72px;font-size:13px;letter-spacing:.02em}.controls-hint{font-size:12px;font-weight:600;color:#e8ecf580;letter-spacing:.02em}.controls-legend--touch{padding:10px 16px;bottom:max(52px,calc(14px + env(safe-area-inset-bottom,0px)))}html[data-view-mode=mobile] .overlay{padding-bottom:max(28px,calc(16px + env(safe-area-inset-bottom,0px)));gap:clamp(14px,3.5vw,22px)}.controls-legend--touch p{font-size:13px;font-weight:600;color:#e8ecf5a6;letter-spacing:.03em}html[data-view-mode=mobile] .controls-legend:not(.controls-legend--touch){display:none}html[data-view-mode=desktop] .controls-legend--touch,html[data-view-mode=mobile] .howto--desktop,html[data-view-mode=desktop] .howto--mobile{display:none}