:root{
  --bg:#030711;--ink:#eef6ff;--muted:#91a7c0;--muted-2:#6f8299;
  --panel:rgba(6,13,26,.86);--stroke:rgba(130,190,255,.24);
  --accent:#ff7a4d;--accent-ink:#2a1005;--green:#7bd9a7;
  --font:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}
body{overscroll-behavior:none}
#app{position:fixed;inset:0}
#hud,#info,#scoreboard{position:fixed;z-index:6;background:var(--panel);border:1px solid var(--stroke);backdrop-filter:blur(14px);border-radius:16px;box-shadow:0 16px 40px #0009}

/* HUD */
#hud{top:16px;left:16px;padding:14px 16px;min-width:230px}
#hud .brand{font-weight:700;font-size:17px;letter-spacing:.2px}
#hud .brand .globe{font-size:18px}.build-tag{font-size:9px;color:#7fa1c4;background:#10213a;border:1px solid #ffffff12;border-radius:12px;padding:2px 5px;vertical-align:middle;margin-left:3px}
#hud .stat-line{color:var(--muted);font-size:12.5px;margin-top:6px}
#hud .treasury{margin-top:10px;font-size:12.5px;color:var(--muted)}
#hud .treasury b{color:#ffd9a8;font-variant-numeric:tabular-nums}
.live-sim{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-size:10.5px;color:#8fdcb4;text-transform:uppercase;letter-spacing:.55px}
.live-sim::before{content:"";width:7px;height:7px;border-radius:50%;background:#69d49c;box-shadow:0 0 0 4px #69d49c18;animation:livePulse 1.8s ease-in-out infinite}
@keyframes livePulse{50%{opacity:.45;box-shadow:0 0 0 7px #69d49c08}}

/* Painel único */
#info{top:16px;right:16px;width:310px;padding:12px;max-height:calc(100vh - 32px);overflow:auto}
.panel-topbar{display:flex;align-items:center;gap:8px;margin-bottom:12px;position:sticky;top:-12px;z-index:8;background:rgba(6,13,26,.97);padding:12px 0 6px}
.panel-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;flex:1;min-width:0}
.panel-tab{margin:0;padding:9px 8px;background:#10213a;color:#aebfd3;border:1px solid transparent;border-radius:10px;font-size:12px}
.panel-tab.active{background:#183756;color:#fff;border-color:#3c6792}
.panel-pane[hidden]{display:none!important}
.mobile-close{display:none}

#badge{display:inline-block;padding:4px 9px;border-radius:20px;background:#123054;color:#bfe0ff;font-size:10.5px;letter-spacing:.6px;margin-bottom:10px}
#info h2{font-size:16px;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.team-dot{width:12px;height:12px;border-radius:50%;background:#2a3a52;display:inline-block;flex:0 0 auto;box-shadow:0 0 0 3px #ffffff10}
.row{display:flex;justify-content:space-between;gap:15px;margin:8px 0;font-size:13px}.row span:first-child{color:var(--muted)}.value{text-align:right;font-variant-numeric:tabular-nums}

button{font-family:inherit;border:0;border-radius:10px;padding:11px;width:100%;cursor:pointer;font-size:13.5px;font-weight:600;transition:.15s;-webkit-appearance:none;appearance:none}
button:focus-visible{outline:2px solid #ffe66d;outline-offset:2px}.primary{margin-top:12px;background:var(--accent);color:var(--accent-ink)}.primary:hover:not(:disabled){filter:brightness(1.08)}.primary:disabled{background:#1b2b40;color:#5f7590;cursor:not-allowed}.ghost{margin-top:8px;background:#12233a;color:#cfe0f5}.ghost:hover{background:#1a3251}.ghost.sm{margin-top:12px;padding:8px;font-weight:500;font-size:12px}
.atk-label{display:block;margin:14px 0 6px;font-size:11px;color:var(--muted-2);letter-spacing:.4px;text-transform:uppercase}
select{width:100%;padding:10px;border-radius:10px;background:#0d1a2c;color:var(--ink);border:1px solid var(--stroke);font-family:inherit;font-size:13px}
.combat-box{margin-top:13px;padding:11px;border:1px solid #ffffff12;background:#091525;border-radius:12px}.combat-box .atk-label:first-child{margin-top:0}.qty-line{display:grid;grid-template-columns:72px 1fr;gap:8px;align-items:center}#attackQty{width:100%;height:40px;border-radius:9px;border:1px solid var(--stroke);background:#0d1a2c;color:var(--ink);padding:0 9px;font:600 14px var(--font)}.qty-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.qty-presets button{padding:8px 4px;background:#12233a;color:#cfe0f5;font-size:11px;border-radius:8px}.mode-summary{margin-top:9px;padding:9px 10px;background:#07111e;border-radius:9px;color:#9fb4cb;font-size:11px;line-height:1.45}.mode-summary strong{color:#ffd9a8}.mode-summary.nuke{border:1px solid #ff8a4d40;color:#ffd4be}.mode-summary.reconstruct{border:1px solid #74d6a740;color:#bfead5}

/* Impacto dentro do mesmo painel */
.impact-kicker{font-size:10px;letter-spacing:1.2px;color:#8fb4d8;font-weight:700;margin:4px 0 10px}.impact-main{display:flex;align-items:center;gap:12px}.impact-main strong{font-size:40px;line-height:1;color:var(--green)}.impact-main span{font-size:13px;line-height:1.4;color:#d8e6f5}.impact-rule{height:5px;background:#0d1d2e;border-radius:5px;overflow:hidden;margin:16px 0}.impact-rule i{display:block;width:70%;height:100%;background:#63c995;border-radius:5px}.impact-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.impact-stats div{background:#0b1727;border:1px solid #ffffff0b;border-radius:12px;padding:11px}.impact-stats span{display:block;color:var(--muted-2);font-size:9.5px;text-transform:uppercase;letter-spacing:.4px}.impact-stats b{display:block;margin-top:5px;font-size:14px;font-variant-numeric:tabular-nums}.impact-copy{font-size:11.5px;line-height:1.5;color:var(--muted);margin:14px 2px 2px}

/* Placar */
#scoreboard{left:16px;bottom:16px;width:290px;padding:14px 16px;max-height:52vh;overflow:auto}#scoreboard h3{margin:0 0 10px;font-size:12px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}#scoreboard h3.feed-title{margin-top:14px}.lb-row{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center;margin:7px 0;font-size:12.5px}.lb-name{display:flex;align-items:center;gap:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lb-dot{width:8px;height:8px;border-radius:2px;display:inline-block;flex:0 0 auto}.lb-val{text-align:right;font-variant-numeric:tabular-nums;color:#dfe9f5}.lb-val small{color:var(--muted-2)}.lb-bar{grid-column:1/-1;height:5px;border-radius:5px;background:#0e1c2e;overflow:hidden}.lb-bar i{display:block;height:100%;border-radius:5px;transition:width .35s}#feed{list-style:none;margin:0;padding:0;font-size:12px;color:#c3d2e4}#feed li{padding:5px 0;border-bottom:1px solid #ffffff08}#feed li b{color:#eaf3ff;font-weight:600}#feed .muted{color:var(--muted-2);border:0}
#tip{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:5;background:#07101dcc;border:1px solid #ffffff18;border-radius:20px;padding:8px 14px;font-size:12px;color:#b8c7d8;pointer-events:none}#loading{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);z-index:20;font-size:14px;color:#b9d8f6}

/* Checkout */
#checkout{position:fixed;inset:0;z-index:80;display:none;place-items:center;background:#02050caa;backdrop-filter:blur(4px)}#checkout.show{display:grid}.ck-card{width:min(340px,92vw);background:#0a1526;border:1px solid var(--stroke);border-radius:18px;padding:20px;box-shadow:0 24px 70px #000c}.ck-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.ck-badge{font-size:10px;letter-spacing:.6px;color:#8fb4d8;background:#10233a;padding:4px 8px;border-radius:20px}.ck-x{width:38px!important;height:38px!important;padding:0!important;background:#12233a!important;color:#dce9f8!important;font-size:16px!important;border-radius:50%!important}.ck-card h3{margin:2px 0 6px;font-size:18px}.ck-sub{margin:0 0 12px;font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}.ck-dot{width:10px;height:10px;border-radius:50%;display:inline-block;background:#2a3a52}.ck-price{font-size:30px;font-weight:700;color:#ffd9a8;font-variant-numeric:tabular-nums;margin-bottom:14px}.ck-methods{display:flex;gap:8px;margin-bottom:14px}.ck-methods button{background:#0e1c2e;color:#b7c9dd;border:1px solid var(--stroke)}.ck-methods button.on{background:#16324f;color:#fff;border-color:#3a6da8}#ck-pay{background:var(--accent);color:var(--accent-ink)}#ck-pay:disabled{opacity:.7;cursor:progress}.ck-status{margin:12px 0 0;font-size:11.5px;color:var(--muted-2);text-align:center}.ck-details{margin:-2px 0 10px;color:#9fb4cb;font-size:12px;line-height:1.4}

/* Mobile v10: um único bottom sheet real, sem scrim e sem segundo popup. */
#mobileBar,#mobileScrim{display:none}
@media (max-width:760px){
  #app{inset:0}
  #hud{top:8px;left:8px;right:8px;width:auto;min-width:0;padding:9px 11px;border-radius:13px;display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;backdrop-filter:none}
  #hud .brand{font-size:14px}#hud .stat-line{font-size:10.5px;margin-top:2px}#hud .treasury{grid-column:2;grid-row:1/3;margin:0;text-align:right;font-size:9.5px;max-width:128px}#hud .treasury b{display:block;font-size:12px;margin-top:2px}#hud .live-sim{grid-column:1/-1;margin-top:3px;font-size:8.8px}
  #scoreboard,#tip{display:none}

  /* O painel inteiro é UMA janela. Arsenal e Impacto são apenas abas internas. */
  #info{
    display:none!important;
    position:fixed!important;
    left:8px!important;right:8px!important;top:auto!important;
    bottom:calc(72px + env(safe-area-inset-bottom))!important;
    width:auto!important;max-width:none!important;
    max-height:48dvh!important;
    overflow-y:auto!important;overflow-x:hidden!important;
    padding:10px 11px 12px!important;
    border-radius:18px!important;
    z-index:52!important;
    background:rgba(6,13,26,.985)!important;
    backdrop-filter:none!important;
    box-shadow:0 -10px 28px rgba(0,0,0,.52)!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-gutter:stable;
  }
  body.mobile-panel-open #info{display:block!important;animation:sheetUp .16s ease-out}
  @keyframes sheetUp{from{transform:translateY(10px);opacity:.62}to{transform:none;opacity:1}}

  .panel-topbar{top:-10px;padding-top:10px;margin-bottom:8px;background:rgba(6,13,26,.99);backdrop-filter:none}
  .mobile-close{display:flex!important;align-items:center!important;justify-content:center!important;flex:0 0 38px;width:38px!important;height:38px!important;min-width:38px!important;padding:0!important;margin:0!important;border-radius:50%!important;background:#12233a!important;color:#e6f1ff!important;font-size:17px!important;border:1px solid rgba(130,190,255,.18)!important}
  .panel-tab{min-height:38px;padding:8px 5px;font-size:11px}
  #info h2{font-size:14px;margin-bottom:7px}.row{font-size:11.8px;margin:5px 0}
  .combat-box{margin-top:7px;padding:9px}.atk-label{margin:9px 0 5px;font-size:9.8px}
  .qty-line{display:block}.qty-line input{margin-bottom:7px}.qty-presets{gap:5px}.qty-presets button{min-width:0;padding:8px 3px;font-size:10px}
  .mode-summary{font-size:10.3px;padding:8px;margin-top:7px}
  .primary{margin-top:9px}.ghost{margin-top:6px}
  .impact-main{gap:9px}.impact-main strong{font-size:30px}.impact-main span{font-size:11.8px}.impact-rule{margin:10px 0}.impact-stats{grid-template-columns:1fr 1fr;gap:6px}.impact-stats div{padding:9px}.impact-stats b{font-size:13px}.impact-copy{font-size:10.2px;line-height:1.4;margin-top:9px}

  /* Sem overlay de tela inteira: o planeta continua totalmente visível e interativo. */
  #mobileScrim{display:none!important}
  #mobileBar{display:grid;grid-template-columns:1fr 1fr;gap:7px;position:fixed;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));z-index:60;padding:5px;background:rgba(5,11,22,.96);border:1px solid var(--stroke);border-radius:15px;backdrop-filter:none}
  #mobileBar button{margin:0;padding:10px 7px;background:#10213a;color:#dcecff;border-radius:10px;font-size:12px}#mobileBar button.active{background:#1d426b;color:white}
  #checkout{padding:10px}.ck-card{width:100%;max-width:360px;max-height:82dvh;overflow:auto;padding:15px}
}
@media (max-width:600px){#info{max-height:42dvh!important}}
@media (max-width:480px){
  #info{max-height:36dvh!important;padding:9px 10px 11px!important}
  #hud .treasury{max-width:112px}
  .impact-main strong{font-size:27px}
  .impact-copy{font-size:10px}
}
@media (max-width:390px){
  #info{max-height:34dvh!important}
  #hud .treasury{max-width:102px}#hud .stat-line{max-width:165px}
  .impact-stats{grid-template-columns:1fr 1fr}
  .impact-main strong{font-size:24px}
  .panel-tab{font-size:10.2px;padding:7px 3px}
}
@media (max-width:350px){#info{max-height:32dvh!important}.impact-stats{grid-template-columns:1fr}.mobile-close{flex-basis:36px;width:36px!important;height:36px!important;min-width:36px!important}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
