.launcher-page { width:min(1240px,calc(100% - 32px)); }
.launcher-panel { padding:18px; }
.launcher-stage { position:relative; width:100%; overflow:hidden; border:1px solid var(--line); border-radius:23px; background:#07151c; box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 24px 58px rgba(0,0,0,.3); isolation:isolate; transition:border-color .22s ease,box-shadow .22s ease; }
.launcher-stage::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0; background:radial-gradient(circle at 50% 62%,rgba(104,208,223,.22),transparent 55%); mix-blend-mode:screen; }
.launcher-stage[data-phase="rolling"] { border-color:rgba(139,207,155,.32); box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 24px 58px rgba(0,0,0,.3),0 0 34px rgba(139,207,155,.08); }
.launcher-stage.is-perfect::after { background:radial-gradient(circle at 25% 68%,rgba(242,199,92,.48),transparent 52%); animation:stageFlash .68s ease-out; }
.launcher-stage.is-impact::after { animation:stageFlash .34s ease-out; }
.launcher-stage.is-boosting::after { background:linear-gradient(105deg,transparent 30%,rgba(242,199,92,.27),transparent 70%); animation:boostFlash .46s ease-out; }
.launcher-stage.is-ring::after { background:radial-gradient(circle,rgba(242,199,92,.25),transparent 42%); animation:stageFlash .4s ease-out; }
.launcher-stage.is-upgraded::after { background:radial-gradient(circle at 50% 100%,rgba(139,207,155,.2),transparent 50%); animation:stageFlash .55s ease-out; }
#launcherCanvas { display:block; width:100%; height:auto; touch-action:manipulation; cursor:pointer; }
.flight-hud { position:absolute; top:13px; left:13px; right:13px; z-index:2; display:flex; justify-content:space-between; gap:8px; pointer-events:none; }
.flight-hud > div { display:flex; gap:6px; }
.flight-hud span { padding:6px 9px; border:1px solid rgba(104,208,223,.26); border-radius:999px; color:#c6f5fa; background:rgba(3,14,19,.62); box-shadow:0 8px 20px rgba(0,0,0,.18); backdrop-filter:blur(8px); font-size:.58rem; font-weight:900; letter-spacing:.08em; }
#phaseLabel { color:#071117; border-color:transparent; background:var(--cyan); }
.launcher-stage[data-phase="rolling"] #phaseLabel { background:var(--mint); }
.launcher-stage[data-phase="landed"] #phaseLabel { background:var(--gold); }
.game-message { z-index:3; background:rgba(3,12,17,.25); backdrop-filter:blur(3px); transition:opacity .2s ease,visibility .2s ease; }
.game-message.hidden { display:grid; opacity:0; visibility:hidden; }
.game-message > div { max-width:390px; }
.game-message .eyebrow { margin-bottom:7px; }
.game-message h2 { font-size:clamp(2rem,5vw,3.3rem); }

.launch-console { margin-top:14px; padding:15px; display:grid; grid-template-columns:auto minmax(230px,1fr) auto; align-items:center; gap:18px; border:1px solid var(--line); border-radius:18px; background:rgba(5,18,24,.72); }
.angle-control > span,.power-control span { color:var(--muted); font-size:.61rem; font-weight:900; letter-spacing:.08em; }
.angle-control > div { margin-top:7px; display:flex; padding:4px; border:1px solid var(--line); border-radius:12px; background:rgba(1,9,13,.55); }
.angle-control button { min-width:48px; min-height:35px; padding:6px 9px; border:0; border-radius:9px; color:var(--muted); background:transparent; cursor:pointer; font-size:.69rem; font-weight:900; }
.angle-control button.active { color:#061117; background:var(--cyan); }
.angle-control button:disabled { cursor:not-allowed; opacity:.45; }
.power-control > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; }
.power-control strong { color:var(--cyan); font-size:.74rem; }
.power-track { position:relative; height:13px; overflow:hidden; border:1px solid var(--line); border-radius:999px; background:rgba(1,9,13,.72); box-shadow:inset 0 2px 7px rgba(0,0,0,.35); }
.power-track span { display:block; width:25%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--cyan),var(--mint) 56%,var(--gold)); box-shadow:0 0 18px rgba(104,208,223,.36); transition:width .06s linear; }
.power-track i { position:absolute; top:-2px; bottom:-2px; left:88%; width:2px; background:rgba(255,255,255,.76); box-shadow:0 0 8px white; }
.launch-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.launch-button { min-width:150px; touch-action:none; user-select:none; }
.launch-button.is-charging { color:#2b2108; border-color:rgba(242,199,92,.6); background:var(--gold); box-shadow:0 0 28px rgba(242,199,92,.18); animation:chargePulse .72s ease-in-out infinite; }
.launcher-save-bar { min-height:42px; margin:10px 2px 0; padding:9px 12px; display:flex; align-items:center; gap:9px; border:1px solid rgba(104,208,223,.16); border-radius:13px; color:var(--muted); background:rgba(3,14,19,.52); font-size:.67rem; font-weight:750; }
.launcher-save-dot { width:8px; height:8px; flex:0 0 auto; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 4px rgba(104,208,223,.08),0 0 14px rgba(104,208,223,.38); animation:saveDotPulse 1.4s ease-in-out infinite; }
.launcher-save-bar[data-state="saved"] { border-color:rgba(139,207,155,.18); }
.launcher-save-bar[data-state="saved"] .launcher-save-dot { background:var(--mint); box-shadow:0 0 0 4px rgba(139,207,155,.08),0 0 14px rgba(139,207,155,.32); animation:none; }
.launcher-save-bar[data-state="local"] .launcher-save-dot { background:var(--gold); box-shadow:0 0 0 4px rgba(242,199,92,.08),0 0 14px rgba(242,199,92,.28); animation:none; }
.launcher-save-bar[data-state="error"] .launcher-save-dot { background:var(--danger,#ef7b76); box-shadow:0 0 0 4px rgba(239,123,118,.08); animation:none; }
.launcher-save-bar a { margin-left:auto; padding:5px 8px; border:1px solid rgba(104,208,223,.22); border-radius:999px; color:var(--cyan); font-size:.62rem; font-weight:900; white-space:nowrap; }
.launcher-save-bar a:hover { border-color:rgba(104,208,223,.48); background:rgba(104,208,223,.055); }

.launcher-upgrades { margin-top:18px; padding:20px; border:1px solid var(--line); border-radius:21px; background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 28%),rgba(5,19,25,.72); }
.upgrade-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:15px; }
.upgrade-heading h2 { margin:0 0 7px; font-size:clamp(1.7rem,3vw,2.45rem); }
.upgrade-heading p:last-child { margin:0; color:var(--muted); font-size:.72rem; line-height:1.5; }
.upgrade-heading > span { color:var(--muted); font-size:.67rem; font-weight:850; }
.launcher-upgrade-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; }
.launcher-upgrade-card { min-height:166px; padding:14px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:15px; color:var(--text); background:rgba(255,255,255,.018); cursor:pointer; text-align:left; transition:transform .16s ease,border-color .16s ease,background .16s ease,opacity .16s ease; }
.launcher-upgrade-card:hover:not(:disabled) { transform:translateY(-3px); border-color:rgba(104,208,223,.36); background:rgba(104,208,223,.04); }
.launcher-upgrade-card:disabled { cursor:not-allowed; opacity:.46; }
.launcher-upgrade-card.is-max { border-color:rgba(139,207,155,.25); background:rgba(139,207,155,.035); opacity:.78; }
.upgrade-icon { width:38px; height:38px; margin-bottom:12px; display:grid; place-items:center; border:1px solid rgba(104,208,223,.22); border-radius:12px; color:var(--cyan); background:rgba(104,208,223,.055); font-size:1.05rem; }
.launcher-upgrade-card strong { font-size:.77rem; }
.launcher-upgrade-card p { margin:6px 0 12px; color:var(--muted); font-size:.61rem; line-height:1.45; }
.launcher-upgrade-card span:last-child { margin-top:auto; color:var(--gold); font-size:.64rem; font-weight:900; }
.launcher-upgrade-card.is-max span:last-child { color:#9fe1ab; }
.launcher-upgrade-card.just-upgraded { animation:upgradeInstall .8s cubic-bezier(.16,.8,.24,1); }
.upgrade-levels { width:100%; margin:0 0 11px; display:grid; grid-template-columns:repeat(10,minmax(3px,1fr)); gap:3px; }
.upgrade-levels i { height:4px; border-radius:999px; background:rgba(255,255,255,.07); box-shadow:inset 0 1px rgba(255,255,255,.035); transition:background .18s ease,box-shadow .18s ease; }
.upgrade-levels i.is-filled { background:linear-gradient(90deg,var(--cyan),var(--mint)); box-shadow:0 0 8px rgba(104,208,223,.28); }
.launcher-upgrade-card[data-upgrade="boost"] .upgrade-levels { grid-template-columns:repeat(8,minmax(3px,1fr)); }
.flight-report { margin-top:14px; padding:13px 15px; display:flex; align-items:center; gap:15px; border:1px solid var(--line); border-radius:15px; color:var(--muted); background:rgba(255,255,255,.018); }
.flight-report span { flex:0 0 auto; color:var(--cyan); font-size:.6rem; font-weight:900; letter-spacing:.08em; }
.flight-report p { margin:0; font-size:.71rem; line-height:1.5; }

.launcher-toast-layer { position:fixed; right:18px; bottom:18px; z-index:80; width:min(330px,calc(100vw - 28px)); display:grid; gap:8px; pointer-events:none; }
.launcher-toast { padding:12px; display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; gap:10px; border:1px solid rgba(104,208,223,.26); border-radius:14px; opacity:0; transform:translateY(12px) scale(.97); color:var(--text); background:rgba(4,18,24,.94); box-shadow:0 18px 45px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.04); backdrop-filter:blur(14px); transition:opacity .22s ease,transform .22s ease; }
.launcher-toast.is-visible { opacity:1; transform:none; }
.launcher-toast > span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#061117; background:var(--cyan); font-weight:950; }
.launcher-toast.tone-mint { border-color:rgba(139,207,155,.3); }
.launcher-toast.tone-mint > span { background:var(--mint); }
.launcher-toast.tone-gold { border-color:rgba(242,199,92,.34); }
.launcher-toast.tone-gold > span { background:var(--gold); }
.launcher-toast strong,.launcher-toast small { display:block; }
.launcher-toast strong { font-size:.7rem; }
.launcher-toast small { margin-top:3px; color:var(--muted); font-size:.59rem; line-height:1.4; }

@keyframes stageFlash { 0% { opacity:0; } 24% { opacity:1; } 100% { opacity:0; } }
@keyframes boostFlash { 0% { opacity:0; transform:translateX(-35%); } 35% { opacity:1; } 100% { opacity:0; transform:translateX(35%); } }
@keyframes chargePulse { 50% { transform:translateY(-1px); box-shadow:0 0 38px rgba(242,199,92,.32); } }
@keyframes upgradeInstall { 0% { transform:scale(.93); } 45% { transform:scale(1.025); border-color:rgba(139,207,155,.7); box-shadow:0 0 36px rgba(139,207,155,.18); } 100% { transform:none; } }
@keyframes saveDotPulse { 50% { opacity:.48; transform:scale(.76); } }

@media (max-width: 1020px) {
  .launch-console { grid-template-columns:auto 1fr; }
  .launch-actions { grid-column:1/-1; justify-content:center; }
  .launcher-upgrade-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width: 700px) {
  .launcher-page { width:calc(100% - 22px); }
  .launcher-panel { padding:9px; }
  .launcher-stage { border-radius:18px; }
  .flight-hud { top:8px; left:8px; right:8px; }
  .flight-hud > div { gap:4px; }
  .flight-hud span { padding:5px 6px; font-size:.46rem; }
  .game-message > div { width:calc(100% - 30px); padding:14px; }
  .game-message h2 { font-size:1.75rem; }
  .launch-console { padding:12px; grid-template-columns:1fr; gap:13px; }
  .angle-control > div { width:100%; }
  .angle-control button { min-height:44px; flex:1; }
  .launch-actions { grid-column:auto; display:grid; grid-template-columns:1fr 1fr; }
  .launch-actions .launch-button { grid-column:1/-1; min-width:0; }
  .launcher-save-bar { align-items:flex-start; flex-wrap:wrap; }
  .launcher-save-bar a { margin-left:17px; }
  .launcher-upgrades { padding:15px; }
  .upgrade-heading { align-items:flex-start; flex-direction:column; }
  .launcher-upgrade-grid { grid-template-columns:1fr 1fr; }
  .launcher-upgrade-card { min-height:150px; }
  .flight-report { align-items:flex-start; flex-direction:column; gap:6px; }
  .launcher-toast-layer { right:14px; bottom:14px; }
}

@media (max-width: 430px) {
  .launcher-upgrade-grid { grid-template-columns:1fr; }
  .launcher-upgrade-card { min-height:0; }
}

@media (prefers-reduced-motion: reduce) {
  .game-message,.power-track span,.launcher-upgrade-card,.launcher-stage,.launcher-toast,.upgrade-levels i { transition:none; }
  .launcher-stage::after,.launch-button.is-charging,.launcher-upgrade-card.just-upgraded,.launcher-save-dot { animation:none!important; }
}