:root{
  --bg:#0b1222;
  --surface:#131d33;
  --surface2:#1a2744;
  --line:#2a3a5f;
  --text:#e7ecf6;
  --muted:#93a0bd;
  --accent:#f4b63f;      /* sun gold */
  --navy:#2d4373;
  --blue:#6f8fd8;
  --good:#6fd39a;
  --bad:#ff6b5e;
  --wz:#c58cf2;
  --pri:#f4b63f;
  --aux:#6fc3f2;
  --radius:12px;
  --safe-b:env(safe-area-inset-bottom,0px);
  --safe-t:env(safe-area-inset-top,0px);
  color-scheme:dark;
}
*{box-sizing:border-box;}
html,body{margin:0;background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.35;-webkit-text-size-adjust:100%;}
button,input,select,textarea{font:inherit;color:inherit;}
[hidden]{display:none !important;}

/* app bar */
.appbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:calc(10px + var(--safe-t)) 16px 10px;background:rgba(11,18,34,.92);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.brand{display:flex;flex-direction:column;min-width:0;}
.logo{font-size:20px;letter-spacing:.5px;font-weight:300;}
.logo b{font-weight:800;}
.corp{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.capital-pill{display:flex;flex-direction:column;align-items:flex-end;padding:4px 12px;border-radius:999px;
  background:var(--surface2);border:1px solid var(--line);}
.capital-pill .lab{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);}
.capital-pill .val{font-size:18px;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums;}
.capital-pill.neg .val{color:var(--bad);}

main{padding:12px 16px calc(84px + var(--safe-b));max-width:760px;margin:0 auto;}

/* tab bar */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;background:rgba(13,21,40,.96);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);
  padding-bottom:var(--safe-b);}
.tabbar button{flex:1;background:none;border:0;padding:8px 0 6px;display:flex;flex-direction:column;
  align-items:center;gap:2px;color:var(--muted);font-size:11px;cursor:pointer;min-height:56px;}
.tabbar svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.tabbar button[aria-current="page"]{color:var(--accent);}

/* shared */
.sect{font-size:13px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);margin:22px 2px 8px;
  display:flex;justify-content:space-between;font-weight:700;}
.hint{color:var(--muted);font-size:14px;margin:4px 2px 10px;}
.group{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px;}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;min-width:0;}
.field > span{font-size:12px;color:var(--muted);font-weight:600;}
.field input,.field select,.field textarea,textarea.notes{width:100%;background:var(--bg);border:1px solid var(--line);
  border-radius:8px;padding:10px;font-size:16px;}
.field textarea,textarea.notes{resize:vertical;}
input:focus,select:focus,textarea:focus{outline:2px solid var(--blue);outline-offset:0;}
.field.check{flex-direction:row;align-items:center;gap:8px;align-self:end;padding-bottom:10px;}
.field.check span{font-size:14px;color:var(--text);font-weight:400;}
input[type=checkbox]{width:22px;height:22px;accent-color:var(--accent);flex:none;margin:0;}

.btn{background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:11px 14px;cursor:pointer;
  font-size:15px;font-weight:600;}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#1b1300;}
.btn.danger{color:var(--bad);}
.btn.wide{width:100%;}
.btns{display:grid;gap:8px;}
.status{color:var(--good);font-size:14px;min-height:1.4em;}
.status.err{color:var(--bad);}

.fold{margin-top:14px;}
.fold summary{cursor:pointer;font-weight:700;padding:2px 0;list-style:none;display:flex;align-items:center;gap:8px;}
.fold summary::-webkit-details-marker{display:none;}
.fold summary::before{content:"›";display:inline-block;transition:transform .15s;font-size:20px;line-height:1;color:var(--muted);}
.fold[open] summary::before{transform:rotate(90deg);}
.fold[open] summary{margin-bottom:10px;}

/* campaign tiles */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px;
  display:flex;flex-direction:column;gap:4px;min-width:0;}
.tile .lab{font-size:12px;color:var(--muted);font-weight:600;}
.tile .lab small{font-weight:400;}
.tile .big{font-size:30px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1;}
.tile input.big{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:0;width:100%;}
.tile.calc .big{color:var(--accent);}
.tile.calc .big.neg{color:var(--bad);}
.tile .note{font-size:11px;color:var(--muted);}

/* checklists */
.list{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.item{display:flex;align-items:center;gap:12px;padding:12px;border-bottom:1px solid var(--line);cursor:pointer;}
.item:last-child{border-bottom:0;}
.item .name{flex:1;min-width:0;}
.item .name small{display:block;color:var(--muted);font-size:13px;margin-top:2px;}
.item .cost{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:700;min-width:28px;text-align:right;}
.item.on .cost{color:var(--accent);}
.item.locked{cursor:default;opacity:.8;}
.tree{margin-top:12px;}
.tree h3{font-size:14px;margin:0 0 6px 2px;color:var(--text);}
.lvl{display:inline-block;font-size:11px;font-weight:800;border:1px solid var(--line);border-radius:6px;
  padding:1px 5px;margin-right:6px;color:var(--muted);vertical-align:1px;}
.badge{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.5px;border-radius:5px;padding:1px 5px;
  vertical-align:2px;margin-left:6px;}
.badge.wz{color:var(--wz);border:1px solid var(--wz);}
.badge.own{color:#0b1222;background:var(--good);}
.badge.free{color:var(--good);border:1px solid var(--good);}

/* games */
#btn-add-game{margin-bottom:12px;}
.game{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px;
  margin-bottom:10px;cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;gap:4px 12px;align-items:center;}
.game .num{grid-row:span 2;font-size:22px;font-weight:800;color:var(--muted);min-width:30px;text-align:center;}
.game .opp{font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.game .meta{font-size:13px;color:var(--muted);grid-column:2 / 4;}
.game .res{font-size:12px;font-weight:800;border-radius:6px;padding:2px 8px;background:var(--surface2);}
.game .res.Win{color:#0b1222;background:var(--good);}
.game .res.Loss{color:#fff;background:#8a2d27;}
.game .extra{grid-column:1 / 4;font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:6px;margin-top:4px;white-space:pre-wrap;}
.empty{color:var(--muted);text-align:center;padding:30px 10px;}

dialog{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 40px);background:var(--surface);color:var(--text);
  border:1px solid var(--line);border-radius:16px;padding:16px;}
dialog::backdrop{background:rgba(0,0,0,.6);}
dialog h3{margin:0 0 12px;}
.dlg-actions{display:flex;gap:8px;align-items:center;margin-top:6px;}
.dlg-actions .spacer{flex:1;}

/* ship cards */
.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:6px;}
.seg{display:flex;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:3px;flex:1;min-width:230px;}
.seg button{flex:1;border:0;background:none;padding:9px 8px;border-radius:8px;cursor:pointer;font-weight:700;font-size:14px;color:var(--muted);}
.seg button[aria-selected="true"]{background:var(--navy);color:#fff;}
.seg span{font-weight:400;opacity:.8;}
.switch{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);cursor:pointer;}
.switch input{width:20px;height:20px;}
.advs-owned{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;margin:8px 0 12px;}
.advs-owned .adv{padding:6px 0;border-top:1px solid var(--line);font-size:14px;}
.advs-owned .adv:first-child{border-top:0;}
.advs-owned .adv small{display:block;color:var(--muted);font-size:13px;}
.advs-owned .none{color:var(--muted);font-size:14px;}

#ship-cards{display:grid;gap:12px;}
@media (min-width:700px){ #ship-cards{grid-template-columns:repeat(2,minmax(0,1fr));} }
.card{background:linear-gradient(180deg,var(--surface2),var(--surface));border:1px solid var(--line);
  border-radius:14px;overflow:hidden;}
.card.locked{opacity:.72;}
.card header{display:flex;align-items:flex-start;gap:10px;padding:12px 12px 8px;border-bottom:1px solid var(--line);
  background:linear-gradient(90deg,rgba(45,67,115,.6),rgba(45,67,115,0));}
.card .title{flex:1;min-width:0;}
.card h3{margin:0;font-size:18px;line-height:1.2;}
.card .cls{font-size:12px;color:var(--muted);margin-top:2px;}
.card .costtag{text-align:right;flex:none;}
.card .costtag b{display:block;font-size:22px;color:var(--accent);line-height:1;}
.card .costtag span{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);}
.stats{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;border-bottom:1px solid var(--line);}
.stats div{padding:8px 2px;border-right:1px solid var(--line);}
.stats div:last-child{border-right:0;}
.stats b{display:block;font-size:22px;font-variant-numeric:tabular-nums;line-height:1.1;}
.stats > div > span{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);}
.weap{padding:6px 12px 2px;}
.wrow{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;align-items:baseline;padding:6px 0;border-bottom:1px dashed var(--line);}
.wrow:last-child{border-bottom:0;}
.wrow .kind{font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;border-radius:4px;padding:2px 5px;}
.wrow .kind.pri{color:#1b1300;background:var(--pri);}
.wrow .kind.aux{color:#04202e;background:var(--aux);}
.wrow .wn{font-weight:700;min-width:0;}
.wrow .wn small{color:var(--muted);font-weight:400;font-size:12px;margin-left:4px;}
.wrow .wv{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:14px;}
.wrow .wv b{color:var(--accent);}
.wrow.none .wn{color:var(--muted);font-weight:400;}
.derived{display:flex;gap:14px;flex-wrap:wrap;padding:6px 12px;font-size:12px;color:var(--muted);border-top:1px solid var(--line);}
.derived b{color:var(--text);}
.rules{margin:0;padding:8px 12px 12px 28px;font-size:13px;color:#c9d2e6;border-top:1px solid var(--line);}
.rules li{margin:3px 0;}
.legend{font-size:12px;color:var(--muted);margin-top:14px;}

textarea.notes{min-height:200px;}

@media (min-width:560px){ .tiles{grid-template-columns:repeat(3,1fr);} }

/* ---------- v2: overview / unlocks ---------- */
.tile.span2{grid-column:1 / -1;}
.avail-bar{position:sticky;top:calc(64px + var(--safe-t));z-index:5;display:flex;justify-content:space-between;align-items:center;
  background:var(--surface2);border:1px solid var(--line);border-radius:var(--radius);padding:10px 14px;margin-bottom:6px;}
.avail-bar span{color:var(--muted);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.6px;}
.avail-bar b{font-size:22px;color:var(--accent);font-variant-numeric:tabular-nums;}
.avail-bar b.neg{color:var(--bad);}
.hint.small{font-size:12px;}
.field > span small{font-weight:400;}
.sect .warn,.sect .rt{font-weight:600;text-transform:none;letter-spacing:0;}
.warn{color:var(--bad) !important;}

/* ---------- v2: battle ---------- */
.stepper{display:flex;align-items:center;justify-content:space-between;gap:6px;}
.stepper button{width:44px;height:44px;border-radius:10px;border:1px solid var(--line);background:var(--surface2);
  font-size:24px;line-height:1;cursor:pointer;flex:none;}
.stepper b{font-size:30px;font-weight:800;font-variant-numeric:tabular-nums;text-align:center;flex:1;}
.stepper.sm button{width:38px;height:38px;font-size:20px;}
.stepper.sm b{font-size:20px;min-width:24px;}

.helm{display:grid;gap:10px;}
.slot{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:var(--radius);padding:10px 12px;}
.slot-seize{border-left-color:var(--wz);}
.slot-jump{border-left-color:var(--aux);}
.slot-tac{border-left-color:var(--accent);}
.slot-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px;}
.slot-h span{font-size:13px;color:var(--muted);}
.slot-h span b{color:var(--text);font-size:15px;}
.slot-body{display:flex;align-items:center;gap:10px;}
.slot-body .stepper{flex:none;width:130px;}
.pips{flex:1;display:flex;flex-wrap:wrap;gap:6px;min-height:30px;align-items:center;}
.pip{width:28px;height:28px;border-radius:50%;border:2px solid var(--accent);background:radial-gradient(circle at 35% 35%,#ffe3a3,var(--accent));
  cursor:pointer;padding:0;}
.slot-seize .pip{border-color:var(--wz);background:radial-gradient(circle at 35% 35%,#ecd3ff,var(--wz));cursor:default;}
.slot-jump .pip{border-color:var(--aux);background:radial-gradient(circle at 35% 35%,#d6f1ff,var(--aux));}
.pip.used{background:transparent;opacity:.45;}
.nopip{color:var(--muted);font-size:13px;}
.slot-help{margin:8px 0 0;font-size:12px;color:var(--muted);}

.credits{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px;}
.cred-main{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;}
.cred-main b{font-size:44px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;}
.cred-main span{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);}
.credits.profit .cred-main b,.credits.profit .cred-main span{color:var(--good);}
.credits.deficit .cred-main b,.credits.deficit .cred-main span{color:var(--bad);}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.chip{flex:1;min-width:52px;padding:10px 0;border-radius:10px;border:1px solid var(--good);color:var(--good);background:transparent;
  font-weight:800;cursor:pointer;}
.chip.neg{border-color:var(--bad);color:var(--bad);}
.earn-form{display:grid;grid-template-columns:90px 1fr auto;gap:8px;}
.earn-form input{min-width:0;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px;font-size:16px;}

#btn-req{margin-bottom:10px;}
.bg{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:10px 12px;margin-bottom:8px;}
.bg-main{flex:1;min-width:0;}
.bg-main small{display:block;color:var(--muted);font-size:12px;}
.bg .status{border:1px solid var(--good);color:var(--good);background:transparent;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;}
.bg.st-out .status{border-color:var(--aux);color:var(--aux);}
.bg.st-dead{opacity:.6;}
.bg.st-dead .status{border-color:var(--bad);color:var(--bad);}
.x{background:none;border:0;color:var(--muted);font-size:22px;line-height:1;width:34px;height:34px;cursor:pointer;flex:none;}

.round-block{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:8px 12px;margin-bottom:8px;}
.round-h{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);padding-bottom:4px;border-bottom:1px solid var(--line);}
.round-h span{font-weight:800;color:var(--text);}
.entry{display:flex;align-items:center;gap:10px;padding:5px 0;font-size:14px;min-height:34px;}
.entry .amt{font-weight:800;min-width:36px;font-variant-numeric:tabular-nums;}
.entry .amt.pos{color:var(--good);}
.entry .amt.neg{color:var(--bad);}
.entry .what{flex:1;min-width:0;}
.empty.sm{padding:12px;font-size:14px;}
.btns.two{grid-template-columns:1fr 1fr;margin-top:20px;}
.req-cost{font-size:16px;margin:4px 0;}
.req-cost b{color:var(--accent);font-size:20px;}
.req-cost span{color:var(--muted);font-size:13px;}
.tabbar button{font-size:10.5px;}

.switch.noncamp{margin:0 2px 12px;color:var(--text);align-items:flex-start;}
.switch.noncamp small{display:block;color:var(--muted);font-size:12px;}

/* ---------- v3: expanders ---------- */
.item{cursor:default;}
.item-wrap{border-bottom:1px solid var(--line);}
.item-wrap:last-child{border-bottom:0;}
.item-wrap .item{border-bottom:0;}
.namebtn{background:none;border:0;padding:4px 0;text-align:left;cursor:pointer;font-size:16px;display:block;}
.chev{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
  vertical-align:-3px;margin-left:4px;color:var(--muted);transition:transform .15s;}
.open > .item .chev,.open .chevbtn .chev,.slot.open .slot-h .chev,.contract.open header .chev{transform:rotate(180deg);}
.namebtn[aria-expanded="true"] .chev,.chevbtn[aria-expanded="true"] .chev{transform:rotate(180deg);}
.chevbtn{background:none;border:1px solid var(--line);border-radius:8px;width:36px;height:36px;flex:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;}
.chevbtn .chev{margin:0;width:20px;height:20px;}
.expand-body{padding:0 12px 12px;font-size:14px;color:#c9d2e6;}
.expand-body p{margin:6px 0;}
.ship-mini{padding:0;background:var(--bg);border-top:1px solid var(--line);}
.ship-mini .stats{border-bottom:1px solid var(--line);}
.ship-mini .derived{border-top:1px solid var(--line);}
.req{color:var(--muted);}
.req b{color:var(--text);}
.adv-full{padding-left:46px;}
.advs-owned .adv-h{display:flex;gap:10px;align-items:flex-start;}
.advs-owned .adv-h > div{flex:1;}
.advs-owned .adv-full{padding:4px 0 8px;}
.tree-name{color:var(--muted);font-size:12px;}

/* helm rules */
.slot-h{align-items:center;}
.slot-h b{flex:1;}
.slot-h .chevbtn{width:32px;height:32px;}
.helm-info{margin:10px 0 0;padding:10px 0 0;border-top:1px solid var(--line);}
.helm-info dt{font-weight:700;color:var(--text);margin-top:8px;font-size:13px;}
.helm-info dt:first-child{margin-top:0;}
.helm-info dd{margin:2px 0 0;font-size:13px;color:#c9d2e6;}
.rulebox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:8px 12px;margin:0 0 10px;font-size:14px;}
.rulebox p{margin:0;color:#c9d2e6;font-size:13px;}

/* battlegroup damage & losses */
.bg{display:block;}
.bg-top{display:flex;align-items:center;gap:8px;}
.bg-track{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);}
.trk-l{font-size:12px;color:var(--muted);display:block;margin-bottom:6px;}
.trk-l b{color:var(--text);font-size:14px;}
.trk-l em{font-style:normal;color:var(--bad);font-weight:700;}
.trk-l em.crit{display:inline-block;font-size:10px;text-transform:uppercase;letter-spacing:.4px;border:1px solid var(--bad);border-radius:4px;padding:0 4px;}
.trk-row{display:flex;align-items:center;gap:8px;}
.trk-row .stepper{flex:none;gap:4px;}
.trk-row .stepper button{width:34px;height:34px;font-size:18px;}
.shippips{flex:1;display:flex;flex-wrap:wrap;gap:4px;}
.shippip{width:14px;height:14px;transform:rotate(45deg);background:var(--good);border-radius:2px;}
.shippip.lost{background:transparent;border:2px solid var(--bad);opacity:.7;}
.dmgbar{flex:1;height:10px;border-radius:5px;background:var(--bg);border:1px solid var(--line);overflow:hidden;}
.dmgbar span{display:block;height:100%;background:linear-gradient(90deg,#f4b63f,#ff6b5e);}
.bg-msg{grid-column:1 / -1;margin:0;font-size:13px;color:var(--accent);}
.bg.st-dead .bg-track{opacity:.6;}

/* contracts */
#btn-contracts{margin-bottom:10px;}
.contract{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--muted);border-radius:var(--radius);margin-bottom:10px;overflow:hidden;}
.contract.suit-S,.contract.suit-C{border-left-color:#c9d2e6;}
.contract.suit-H,.contract.suit-D{border-left-color:#ff6b5e;}
.contract header{display:flex;align-items:center;gap:10px;padding:10px 12px;}
.contract .rank{font-size:20px;font-weight:800;min-width:36px;text-align:center;}
.contract .rank i{font-style:normal;margin-left:1px;}
.contract.suit-H .rank i,.contract.suit-D .rank i{color:#ff6b5e;}
.contract .ct{flex:1;min-width:0;}
.contract .ct b{display:block;font-size:16px;}
.contract .ct small{display:block;color:var(--muted);font-size:12px;}
.contract .expand-body{border-top:1px solid var(--line);padding-top:6px;}
.contract h4{margin:12px 0 4px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);}
.scaleline{color:var(--accent);font-weight:700;}
.cnote{color:var(--muted);font-size:13px;}
.cl{list-style:none;margin:0;padding:0;}
.cl li{display:flex;gap:8px;margin:5px 0;}
.cl .mk{flex:none;width:14px;color:var(--muted);}
.cl li.up .mk{color:var(--good);}
.cl li.down .mk{color:var(--bad);}
.ctab{width:100%;border-collapse:collapse;margin:8px 0;font-size:13px;}
.ctab th{font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);text-align:left;padding:4px;border-bottom:1px solid var(--line);font-weight:700;}
.ctab td{padding:5px 4px;border-bottom:1px solid var(--line);}
.pick-suit h4{margin:12px 0 4px;color:var(--muted);font-size:13px;}
.pick{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);cursor:pointer;}
.pick small{color:var(--muted);}

/* v4: helm title chevron, clickable contracts */
.slot-title{flex:1;background:none;border:0;padding:4px 0;text-align:left;font-weight:700;font-size:16px;cursor:pointer;
  display:flex;align-items:center;gap:2px;}
.slot-title .chev{width:20px;height:20px;}
.slot-title[aria-expanded="true"] .chev{transform:rotate(180deg);}
.contract{cursor:pointer;}
.contract:focus-visible{outline:2px solid var(--blue);outline-offset:2px;}
.contract header .chevbtn{pointer-events:none;}

/* v5: buy-now list, prerequisites, modded stats */
.buynow{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;margin:4px 0 6px;}
.buy-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);}
.buy-row .bn{flex:1;min-width:0;}
.buy-row .bn small{display:block;color:var(--muted);font-size:12px;}
.buy-row .cost{font-weight:800;color:var(--accent);min-width:24px;text-align:right;}
.buy-row.later{opacity:.6;}
.buy-row.later .cost{color:var(--muted);}
.btn.sm{padding:6px 12px;font-size:13px;border-radius:8px;}
.later-h{margin:12px 0 2px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-weight:700;}
.buynow .none{color:var(--muted);font-size:14px;margin:6px 0;}
.item.blocked .name{opacity:.55;}
.needs{color:var(--bad) !important;}
button.mod{background:none;border:0;padding:0;margin:0;font:inherit;color:var(--good);cursor:pointer;
  text-decoration:underline dotted;text-underline-offset:3px;}
button.mod.base{color:var(--accent);}
.applied{margin:0;padding:6px 12px;font-size:12px;color:var(--good);border-top:1px solid var(--line);}

/* v5: helm spend area, adv notes */
.pips[data-spend]{cursor:pointer;border-radius:8px;padding:2px;}
.pips[data-spend]:focus-visible{outline:2px solid var(--blue);}
.pips span.pip{display:inline-block;}
.helm-info dt.adv-note{color:var(--good);}

/* v5: activation, next round, toast */
.bg-main[data-bgact]{cursor:pointer;}
.act-chip{display:inline-block;margin-top:6px;font-size:12px;font-weight:700;color:var(--muted);border:1px dashed var(--line);border-radius:999px;padding:3px 10px;}
.bg.acted{opacity:.5;background:var(--bg);}
.bg.acted .act-chip{border-style:solid;}
.next-round{margin-top:20px;font-size:17px;padding:14px;}
.btns.two{margin-top:10px;}

/* v6 */
.buy-group h4{margin:10px 0 2px;font-size:13px;color:var(--text);}
.buy-group + .buy-group{margin-top:8px;padding-top:6px;border-top:2px solid var(--line);}
.later-h{border-top:2px solid var(--line);padding-top:10px;}
.later-group h4{color:var(--muted);font-size:12px;}
.later-group + .later-group{border-top:0;}
.round-list{font-weight:700;color:var(--accent);}
.tile.flash{animation:flash 1.2s ease-out;}
@keyframes flash{0%{background:var(--accent);}100%{background:var(--surface);}}
.version-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 2px 8px;color:var(--muted);font-size:14px;}

/* 0.12: contract draw, limited-use advantages */
#btn-draw-contracts{margin:4px 0 6px;}
.uses{display:grid;gap:8px;}
.use{display:flex;align-items:center;gap:10px;text-align:left;background:var(--surface);border:1px solid var(--good);
  border-radius:var(--radius);padding:10px 12px;cursor:pointer;}
.use-name{flex:1;font-weight:700;}
.use-name small{display:block;font-weight:400;color:var(--muted);font-size:12px;}
.use-state{font-size:12px;font-weight:800;color:var(--good);white-space:nowrap;}
.use.used{border-color:var(--line);opacity:.5;}
.use.used .use-state{color:var(--muted);}

/* 0.13: scale rule, purchase history, summaries, battlegroup stats, objects */
.scale-rule{display:flex;flex-direction:column;gap:4px;margin-top:10px;}
.scale-rule span{font-size:12px;color:var(--muted);font-weight:600;}
.scale-rule select{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px;font-size:15px;}
#btn-same-contracts{margin-bottom:10px;font-size:14px;}
.buys{margin:-2px 0 10px 14px;padding:8px 12px;border-left:3px solid var(--accent);background:var(--surface);border-radius:0 10px 10px 0;}
.buys-h{display:flex;justify-content:space-between;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;}
.buys-h span{color:var(--accent);}
.buy-item{display:flex;justify-content:space-between;font-size:14px;padding:2px 0;}
.buy-item small{color:var(--muted);}
.sumbtn{grid-column:1 / 4;justify-self:start;background:none;border:1px solid var(--line);border-radius:8px;padding:6px 10px;
  font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:4px;margin-top:6px;}
.sumbtn[aria-expanded="true"] .chev{transform:rotate(180deg);}
.sum-wrap{grid-column:1 / 4;margin-top:8px;cursor:default;}
.sum h4{margin:12px 0 6px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);}
.sum-head{display:flex;align-items:baseline;gap:10px;}
.sum-head b{font-size:36px;font-weight:800;}
.sum-head span{color:var(--muted);font-size:13px;}
.sum-head.profit b{color:var(--good);}
.sum-head.deficit b{color:var(--bad);}
.sum-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px;text-align:center;}
.sum-tiles div{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 2px;}
.sum-tiles b{display:block;font-size:18px;}
.sum-tiles span{font-size:10px;text-transform:uppercase;color:var(--muted);letter-spacing:.4px;}
.pos{color:var(--good);}
.neg{color:var(--bad);}
.sum-contracts{font-size:13px;color:#c9d2e6;margin:8px 0 0;}
.rrow{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;font-size:13px;margin:4px 0;}
.rl{color:var(--muted);font-weight:700;}
.rbars{display:flex;flex-direction:column;gap:2px;}
.bar{display:block;height:6px;border-radius:3px;min-width:2px;}
.bar.earn{background:var(--good);}
.bar.spend{background:var(--bad);}
.rv{font-variant-numeric:tabular-nums;white-space:nowrap;}
.bg-stats{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:13px;color:var(--muted);}
.bg-stats b{color:var(--text);}
.bg-stats .w{flex-basis:100%;color:#c9d2e6;}
.bg-stats .kind{font-style:normal;font-size:9px;font-weight:800;text-transform:uppercase;border-radius:3px;padding:1px 4px;margin-right:6px;vertical-align:1px;}
.bg-stats .kind.pri{background:var(--pri);color:#1b1300;}
.bg-stats .kind.aux{background:var(--aux);color:#04202e;}
.obj-scale{display:flex;align-items:center;justify-content:space-between;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:8px 12px;margin:6px 0 12px;font-weight:700;}
.obj-scale .stepper{width:130px;}
#object-cards{display:grid;gap:12px;}
@media (min-width:700px){ #object-cards{grid-template-columns:repeat(2,minmax(0,1fr));} }
.seg button{padding:9px 4px;}

/* 0.14: rivals */
.rival-btns{margin-top:0;}
.standings{margin-top:10px;}
.standing .rank-n{font-weight:800;color:var(--muted);min-width:18px;text-align:center;}
.standing .rep-n{font-size:22px;font-weight:800;color:var(--accent);text-align:center;line-height:1;}
.standing .rep-n small{display:block;font-size:10px;color:var(--muted);font-weight:700;text-transform:uppercase;}
.standing.me{background:rgba(45,67,115,.35);}
.chev-spacer{width:36px;flex:none;}
.rival-body p{margin:6px 0;}
.rival-banner{display:flex;align-items:center;gap:10px;background:rgba(197,140,242,.12);border:1px solid var(--wz);
  border-radius:var(--radius);padding:10px 12px;margin:6px 0 12px;}
.rival-banner > div{flex:1;min-width:0;}
.rival-banner small{display:block;color:var(--muted);font-size:12px;margin-top:2px;}

/* 0.15 */
#advs-owned-list .adv{cursor:pointer;}
button.buy-item{width:100%;background:none;border:0;border-radius:6px;cursor:pointer;text-align:left;font-size:14px;padding:5px 4px;}
button.buy-item:active{background:var(--surface2);}
button.buy-item small{color:var(--accent);}

/* 0.16: rules button, contract tracker, stats, photos, print */
.appbar{gap:8px;}
.brand{flex:1;}
.icon-btn{display:flex;flex-direction:column;align-items:center;gap:1px;background:none;border:1px solid var(--line);border-radius:12px;
  padding:5px 10px;cursor:pointer;color:var(--muted);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;}
.icon-btn svg{width:20px;height:20px;fill:none;stroke:var(--text);stroke-width:2;stroke-linecap:round;}
dialog.tall{height:calc(100dvh - 40px);display:flex;flex-direction:column;}
dialog.tall:not([open]){display:none;}
.rules-top{display:flex;justify-content:space-between;align-items:center;}
.rules-top h3{margin:0;}
#rules-search{width:100%;margin:12px 0 4px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px;font-size:16px;}
#rules-list{overflow-y:auto;flex:1;}
.rule-item{padding:10px 0;border-bottom:1px solid var(--line);}
.rule-h{display:flex;justify-content:space-between;gap:10px;}
.rule-h span{color:var(--muted);font-size:12px;white-space:nowrap;}
.rule-item p{margin:4px 0 0;font-size:14px;color:#c9d2e6;}
.ct-track{display:flex;align-items:center;gap:10px;padding:0 12px 10px;cursor:default;}
.ct-l{font-size:12px;color:var(--muted);font-weight:600;}
.ct-track .stepper{flex:none;gap:6px;}
.ct-track .stepper b{font-size:18px;min-width:20px;}
.ct-ex{margin-left:auto;border:1px solid var(--good);color:var(--good);background:transparent;border-radius:999px;padding:6px 12px;
  font-size:12px;font-weight:800;cursor:pointer;}
.ct-ex.on{border-color:var(--bad);color:var(--bad);}
.maxrev{color:var(--muted);font-size:13px;}
.endwarn{background:rgba(255,107,94,.12);border:1px solid var(--bad);color:var(--bad);border-radius:10px;padding:10px 12px;font-weight:700;font-size:14px;}
.ceos-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 2px 10px;font-size:14px;}
.ceos-row small{display:block;color:var(--muted);font-size:12px;}
.ceos-row .stepper{width:130px;}
.statsbox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;margin:0 0 12px;}
.stats4{margin-top:8px;}
.stats4 b{font-size:16px;}
.gbars{display:flex;gap:6px;align-items:flex-end;overflow-x:auto;padding-bottom:4px;}
.gbar{display:flex;flex-direction:column;align-items:center;min-width:34px;font-size:11px;}
.gcol{height:70px;width:16px;display:flex;align-items:flex-end;background:var(--bg);border-radius:4px;overflow:hidden;}
.gcol span{display:block;width:100%;}
.gcol .up{background:var(--good);}
.gcol .down{background:var(--bad);}
.gbar b{font-size:11px;margin-top:2px;}
.gbar small{color:var(--muted);}
.repline{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:13px;}
.repline span{display:flex;flex-direction:column;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:2px 6px;}
.repline b{color:var(--accent);}
.repline small{color:var(--muted);font-size:10px;}
.repline i{color:var(--muted);font-style:normal;}
.photo-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.game-thumbs{display:flex;gap:6px;flex-wrap:wrap;}
.game .game-thumbs{grid-column:1 / 4;margin-top:6px;}
.thumb{position:relative;width:64px;height:64px;border-radius:8px;overflow:hidden;background:var(--bg);border:1px solid var(--line);}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in;}
.thumb.missing::after{content:'?';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);}
.thumb .x{position:absolute;top:0;right:0;width:24px;height:24px;font-size:16px;background:rgba(0,0,0,.6);color:#fff;border-radius:0 0 0 8px;}
.photo-dlg{padding:8px;}
.photo-dlg img{width:100%;max-height:calc(100dvh - 120px);object-fit:contain;display:block;border-radius:8px;}
#print-view{display:none;}

@media print {
  @page{size:letter;margin:14mm;}
  html,body{background:#fff !important;color:#000 !important;}
  .appbar,.tabbar,main,dialog{display:none !important;}
  #print-view{display:block !important;font:11pt/1.35 Helvetica,Arial,sans-serif;color:#000;}
  #print-view h1{margin:0;font-size:18pt;letter-spacing:1px;}
  #print-view h2{font-size:11pt;text-transform:uppercase;letter-spacing:.5px;background:#1b2a4a;color:#fff;padding:3pt 6pt;margin:12pt 0 4pt;
    -webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .p-head{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2pt solid #1b2a4a;padding-bottom:4pt;}
  .p-corp{text-align:right;}
  .p-corp b{display:block;font-size:14pt;}
  .p-stat{width:100%;border-collapse:collapse;margin-top:8pt;}
  .p-stat td{border:1px solid #888;text-align:center;padding:4pt;font-size:8pt;text-transform:uppercase;}
  .p-stat b{display:block;font-size:16pt;}
  .p-cols{display:flex;gap:14pt;}
  .p-cols section{flex:1;}
  #print-view ul{list-style:none;margin:0;padding:0;}
  #print-view li{display:flex;justify-content:space-between;border-bottom:1px solid #ddd;padding:2pt 0;}
  #print-view li i{color:#555;margin-left:4pt;flex:1;}
  .p-table{width:100%;border-collapse:collapse;font-size:9.5pt;}
  .p-table th{text-align:left;border-bottom:1.5pt solid #000;padding:3pt;}
  .p-table td{border-bottom:1px solid #ccc;padding:3pt;vertical-align:top;}
  .p-table tr{break-inside:avoid;}
  .p-notes{white-space:pre-wrap;}
}

/* 0.17 */
.dlg-buys{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 10px;}
.dlg-buys .hint{margin:4px 0;}

/* 0.18: online campaign */
.online-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;margin-bottom:8px;}
.online-box .hint{margin:0 0 8px;}
.online-join{display:grid;gap:8px;}
.online-join-form{display:grid;grid-template-columns:1fr auto;gap:8px;}
.online-join-form input{min-width:0;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px;font-size:16px;text-transform:uppercase;letter-spacing:1px;}
.online-on small{display:block;color:var(--muted);font-size:12px;margin:2px 0 8px 16px;}
.online-btns{display:flex;gap:8px;flex-wrap:wrap;}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--good);margin-right:8px;vertical-align:1px;}
.dot.bad{background:var(--bad);}
.badge.online{color:var(--aux);border:1px solid var(--aux);}
.online-box .status{margin:6px 0 0;}

/* 0.19: Google sign-in */
.gsi-btn{min-height:44px;display:flex;justify-content:center;}
#gsi-btn iframe{color-scheme:normal;}