@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Exo+2:wght@300;400;600;700&display=swap');
:root{
  --bg:#0a0c10;--bg2:#111418;--bg3:#181c24;--panel:#1a1e28;
  --border:#2a3040;--border-hi:#3a4860;
  --gold:#c8963c;--gold2:#f0c060;
  --red:#c0392b;--red2:#e74c3c;
  --green:#1a7a3a;--green2:#27ae60;
  --cyan:#16a085;--cyan2:#1abc9c;
  --purple:#6c3483;--purple2:#9b59b6;
  --amber:#d4850a;--amber2:#f39c12;
  --text:#d0d8e8;--text2:#8a96a8;--text3:#505870;
  /* Typography — overwritten by applyTypography() on load and options save */
  --font-ui:'Share Tech Mono',monospace;
  --font-content:'Exo 2',sans-serif;
  --fs-xxs:7px;--fs-xs:8px;--fs-chrome:9px;--fs-md:10px;
  --fs-unit:11px;--fs-modal:12px;--fs-body:13px;
  --fs-die:17px;--fs-hs:22px;--fs-heading:28px;--fs-hero:52px;
  --ls-0:0.5px;--ls-1:1px;--ls-2:2px;--ls-3:3px;
  --ls-4:4px;--ls-5:6px;--ls-6:8px;
  --text-scale:1;  /* overwritten by applyTypography() — drives text-aware panel widths */
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:var(--font-content);font-size:var(--fs-body);height:100vh;overflow:hidden;display:flex;flex-direction:column;user-select:none;}
#header{background:var(--bg2);border-bottom:1px solid var(--border);padding:5px 12px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
#header h1{font-family:var(--font-ui);font-size:var(--fs-body);color:var(--gold);letter-spacing:var(--ls-3);text-transform:uppercase;}
#round-info{display:flex;gap:12px;align-items:center;}
.info-pill{background:var(--bg3);border:1px solid var(--border);padding:2px 9px;border-radius:3px;font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text2);}
.info-pill span{color:var(--gold);}
.turn-ind{font-family:var(--font-ui);font-size:var(--fs-md);padding:2px 8px;border-radius:2px;letter-spacing:var(--ls-1);}
.turn-p{background:rgba(200,150,60,0.15);color:var(--gold);border:1px solid var(--gold);}
.turn-e{background:rgba(192,57,43,0.15);color:var(--red2);border:1px solid var(--red);}
#p-score-label.score-active{color:var(--gold);font-weight:700;}
#e-score-label.score-active{color:var(--red2);font-weight:700;}
.turn-x{background:rgba(80,88,112,0.2);color:var(--text3);border:1px solid var(--border);}
#main{flex:1;display:flex;overflow:hidden;}
/* Panel widths scale with the chosen text size (--text-scale, set by applyTypography)
   so larger fonts get a proportionally wider panel instead of overflowing. Clamped so
   the two panels never eat more than ~80vw combined. overflow-x:hidden pairs with
   overflow-y:auto to keep the vertical scroll while suppressing the spurious horizontal
   scrollbar (a lone overflow-y:auto lets overflow-x compute to auto). */
#left-panel{width:calc(215px * var(--text-scale, 1));max-width:40vw;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto;overflow-x:hidden;}
#right-panel{width:calc(235px * var(--text-scale, 1));max-width:40vw;background:var(--panel);border-left:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto;overflow-x:hidden;}
.ph{background:var(--bg3);border-bottom:1px solid var(--border);padding:5px 10px;font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;flex-shrink:0;}
#center{flex:1;display:flex;flex-direction:column;overflow:hidden;}
#canvas-wrap{flex:1;overflow:hidden;}
canvas{display:block;}
#log-header{background:var(--bg2);border-top:1px solid var(--border);padding:2px 6px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
#log-tabs{display:flex;}
.log-tab{background:none;border:none;border-right:1px solid var(--border);color:var(--text3);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:2px 10px;cursor:pointer;letter-spacing:var(--ls-1);text-transform:uppercase;}
.log-tab:hover{color:var(--text2);}
.log-tab.active{color:var(--text);background:var(--bg3);}
#log-header-actions{display:flex;gap:4px;align-items:center;}
#log-copy-btn,#debug-ctx-btn,#log-export-btn{background:none;border:1px solid var(--border);color:var(--text3);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:1px 6px;cursor:pointer;line-height:1.4;}
#log-copy-btn:hover,#debug-ctx-btn:hover,#log-export-btn:hover{color:var(--text2);border-color:var(--text3);}
#log-level-sel{background:var(--bg3);border:1px solid var(--border);color:var(--text2);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:1px 4px;cursor:pointer;}
#log-search{background:var(--bg3);border:1px solid var(--border);color:var(--text2);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:1px 6px;width:120px;}
#log-search:focus{outline:none;border-color:var(--gold);color:var(--text);}
/* Level dropdown filtering — Minimal hides detail+verbose, Detail hides verbose,
   All (verbose) shows everything. Acts on the data-level emitted by renderMainLogEntry. */
#log-panel[data-level="milestone"] p[data-level="detail"],
#log-panel[data-level="milestone"] p[data-level="verbose"]{display:none;}
#log-panel[data-level="detail"] p[data-level="verbose"]{display:none;}
/* Search filter — _applyLogSearch toggles .log-hide-search on rows that don't match */
#log-panel p.log-hide-search{display:none;}
/* Export popover */
#log-export-menu{position:absolute;background:var(--bg2);border:1px solid var(--gold);border-radius:4px;padding:4px;z-index:200;box-shadow:0 4px 12px rgba(0,0,0,0.5);}
#log-export-menu button{display:block;width:100%;background:none;border:none;color:var(--text2);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:5px 12px;cursor:pointer;text-align:left;letter-spacing:var(--ls-1);}
#log-export-menu button:hover{background:var(--bg3);color:var(--gold);}
.dl-ctx{color:var(--text3);opacity:0.6;font-family:var(--font-ui);font-size:var(--fs-chrome);}
#log-panel{height:105px;background:var(--bg2);overflow-y:auto;padding:5px 10px;flex-shrink:0;}
#log-panel p{font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text2);line-height:1.55;}
.lh{color:var(--gold2);} .ld{color:var(--red2);} .ls{color:var(--green2);} .li{color:var(--cyan2);} .lw{color:var(--amber2);} .lk{color:var(--text2);}
.main-log-side{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);margin-right:6px;padding:0 4px;border-radius:2px;opacity:0.85;}
.main-log-side.p{color:var(--cyan2);background:rgba(80,160,200,0.10);border:1px solid rgba(80,160,200,0.30);}
.main-log-side.e{color:var(--red2);background:rgba(200,90,90,0.10);border:1px solid rgba(200,90,90,0.30);}
#debug-panel{display:none;height:105px;background:var(--bg2);overflow-y:auto;padding:4px 8px;flex-shrink:0;}
#debug-panel p{font-family:monospace;font-size:10px;color:var(--text2);line-height:1.7;margin:0;}
.dl-move{color:var(--cyan2);} .dl-shoot{color:var(--green2);} .dl-melee{color:var(--red2);} .dl-morale{color:var(--amber2);} .dl-info{color:var(--text3);}
.dl-ts{color:var(--text3);opacity:0.6;}
#score-panel{display:none;height:105px;background:var(--bg2);overflow-y:auto;padding:6px 10px;flex-shrink:0;}
.score-mode{color:var(--text3);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);text-transform:uppercase;margin-bottom:5px;}
.score-table{width:100%;border-collapse:collapse;font-family:var(--font-ui);font-size:var(--fs-md);}
.score-table th,.score-table td{padding:3px 8px;text-align:center;border-bottom:1px solid var(--border);color:var(--text2);}
.score-table th{color:var(--text3);font-size:var(--fs-chrome);text-transform:uppercase;letter-spacing:var(--ls-1);}
.score-table th:first-child,.score-table td:first-child{text-align:left;}
.score-table th.sc-p,.score-table td.sc-p{color:var(--gold);}
.score-table th.sc-e,.score-table td.sc-e{color:var(--red2);}
.score-table tfoot td{font-weight:700;border-top:1px solid var(--border-hi);border-bottom:none;}

/* Squad cards */
.sq-card{border-bottom:1px solid var(--border);padding:7px 10px;transition:background 0.1s;position:relative;}
.sq-card-header{cursor:pointer;}
.sq-card-header:hover .sq-name{opacity:0.85;}
.sq-card-detail{display:none;margin-top:6px;padding-top:6px;border-top:1px solid var(--border);}
.sq-card-detail.open{display:block;}
.sq-expand-btn{font-size:var(--fs-xs);color:var(--text3);background:none;border:none;cursor:pointer;padding:0;font-family:var(--font-ui);letter-spacing:var(--ls-1);float:right;margin-left:6px;}
.sq-expand-btn:hover{color:var(--text);}
.sq-wpn-table{width:100%;border-collapse:collapse;margin-bottom:5px;}
.sq-wpn-table th{font-size:var(--fs-xxs);color:var(--text3);font-family:var(--font-ui);text-align:left;padding:2px 3px;border-bottom:1px solid var(--border);letter-spacing:var(--ls-1);}
.sq-wpn-table td{font-size:var(--fs-xs);color:var(--text2);font-family:var(--font-ui);padding:2px 3px;vertical-align:top;}
.sq-wpn-table tr:hover td{background:var(--bg3);}
.sq-wpn-name{color:var(--text);font-weight:600;}
.sq-rule-tag{display:inline-block;font-size:var(--fs-xxs);font-family:var(--font-ui);color:var(--purple2);background:var(--bg);border:1px solid var(--border);padding:1px 3px;border-radius:2px;margin:1px;}
.sq-card:hover{background:var(--bg3);}
.sq-card.sel{background:rgba(200,150,60,0.07);border-left:2px solid var(--gold);}
.sq-card.routed{opacity:0.28;pointer-events:none;}
.sq-card.shaken{border-left:2px solid var(--amber2);}
.sq-card.activated{opacity:0.44;}
.sq-card.deploy-done{opacity:0.44;}
.sq-card.loaded{border-left:2px solid var(--purple2);background:rgba(155,89,182,0.05);}
.sq-card.ambushed{opacity:0.5;border-left:2px solid var(--text3);}
.sq-loaded-note{font-size:var(--fs-xs);color:var(--purple2);font-style:italic;margin:2px 0;}
.sq-name{font-weight:700;font-size:var(--fs-unit);margin-bottom:2px;display:flex;justify-content:space-between;align-items:center;}
.badge{font-size:var(--fs-xs);background:var(--bg);border:1px solid var(--border);padding:1px 4px;border-radius:2px;font-family:var(--font-ui);}
.spell-token-badge{font-size:var(--fs-xs);background:#3a1f6e;border:1px solid #7d3c98;color:#d7b4f5;padding:1px 4px;border-radius:2px;font-family:var(--font-ui);cursor:default;}
.badge.rdy{color:var(--cyan2);border-color:var(--cyan);}
.badge.act{color:var(--gold2);border-color:var(--gold);background:rgba(200,150,60,0.1);}
.badge.done{color:var(--text3);}
.badge.shk{color:var(--amber2);border-color:var(--amber);}
.badge.rout{color:var(--red2);border-color:var(--red);}
.badge.loaded{color:var(--purple2);border-color:var(--purple);background:rgba(155,89,182,0.1);}
.badge.amb{color:var(--text3);border-color:var(--text3);}
.stat-row{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px;}
.sb{background:var(--bg);border:1px solid var(--border);padding:2px 3px;border-radius:2px;font-family:var(--font-ui);font-size:var(--fs-xs);text-align:center;min-width:28px;}
.sb .sl{color:var(--text3);font-size:var(--fs-xxs);}
.sb .sv{color:var(--gold);}
.modhp{margin-top:4px;display:flex;gap:2px;flex-wrap:wrap;}
.mhp-pip{width:7px;height:7px;border-radius:1px;background:var(--green2);}
.mhp-pip.dead{background:var(--border);}
.mhp-pip.shaken{background:var(--amber2);}

/* Actions */
#acts{padding:7px;border-bottom:1px solid var(--border);}
.ab{display:block;width:100%;margin-bottom:4px;padding:5px 9px;background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-content);font-size:var(--fs-md);font-weight:600;cursor:pointer;border-radius:3px;text-align:left;transition:all 0.1s;letter-spacing:var(--ls-0);}
.ab:hover:not(:disabled){background:rgba(200,150,60,0.1);border-color:var(--gold);color:var(--gold2);}
.ab:disabled{opacity:0.2;cursor:not-allowed;}
.ab.active{background:rgba(200,150,60,0.13);border-color:var(--gold);color:var(--gold2);}
.ab .k{float:right;font-size:var(--fs-xs);color:var(--text3);background:var(--bg);border:1px solid var(--border);padding:0 3px;border-radius:2px;font-family:var(--font-ui);}
#pips-wrap{padding:6px 10px;border-bottom:1px solid var(--border);}
.pw-lbl{font-family:var(--font-ui);font-size:var(--fs-xs);color:var(--text3);letter-spacing:var(--ls-1);margin-bottom:3px;}
.pw-row{display:flex;gap:3px;align-items:center;margin-bottom:3px;}
.pw-side{font-size:var(--fs-xs);width:50px;flex-shrink:0;font-family:var(--font-ui);}
.pw-pips{display:flex;gap:3px;flex-wrap:wrap;}
.pip{width:8px;height:8px;border-radius:1px;}
.pip.rdy{background:var(--cyan2);}
.pip.done{background:var(--border);}
.pip.shk{background:var(--amber2);}
.pip.cur{background:var(--gold2);outline:1px solid var(--gold);}
#flow{padding:5px 8px;background:var(--bg3);border-top:1px solid var(--border);font-family:var(--font-ui);font-size:var(--fs-chrome);text-align:center;letter-spacing:var(--ls-1);flex-shrink:0;color:var(--gold);margin-top:auto;}

/* Detail panel */
#sel-detail{padding:10px;overflow-y:auto;flex:1;}
.dl{font-family:var(--font-ui);font-size:var(--fs-xs);color:var(--text3);letter-spacing:var(--ls-1);margin-bottom:4px;text-transform:uppercase;}
.we{background:var(--bg3);border:1px solid var(--border);padding:4px 7px;border-radius:3px;margin-bottom:3px;}
.wn{color:var(--cyan2);font-size:var(--fs-md);font-weight:600;}
.ws{color:var(--text2);font-size:var(--fs-chrome);margin-top:1px;font-family:var(--font-ui);}
.sp{background:var(--bg3);border:1px solid var(--border);padding:2px 6px;border-radius:2px;margin-bottom:2px;font-size:var(--fs-chrome);color:var(--purple2);}
.status-box{padding:3px 7px;border-radius:3px;font-size:var(--fs-chrome);margin-bottom:4px;}
.status-shaken{background:rgba(212,133,10,0.12);border:1px solid var(--amber);color:var(--amber2);}
.status-fatigued{background:rgba(80,88,112,0.15);border:1px solid var(--border);color:var(--text3);}
.status-scout{background:rgba(60,180,120,0.10);border:1px solid var(--green2);color:var(--green2);}
.sq-wpn-compact{margin-top:5px;}
.status-cover{background:rgba(26,122,58,0.12);border:1px solid var(--green);color:var(--green2);}

/* Objectives */
.oe{padding:4px 10px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;font-size:var(--fs-md);}
.oc{color:var(--cyan2);font-weight:600;} .oe-e{color:var(--red2);font-weight:600;} .oct{color:var(--gold);font-weight:600;} .of{color:var(--text3);}

/* Dice overlay */
#dice-ov{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg2);border:1px solid var(--gold);padding:18px 22px;z-index:100;border-radius:6px;text-align:center;min-width:320px;max-width:860px;width:92vw;max-height:86vh;overflow-y:auto;box-shadow:0 0 40px rgba(0,0,0,0.7);}
.dice-center{flex:1;min-width:280px}
.dice-side-card{width:250px;min-width:180px;max-width:300px;flex-shrink:0;padding:0;display:none}
.dice-side-card .sq-card{margin:0;max-width:100%;border:1px solid var(--border);border-radius:4px;background:rgba(0,0,0,0.25)}
.dice-side-card .sq-card.attacking{border-color:var(--gold);box-shadow:0 0 12px rgba(200,150,60,0.35)}
.dice-side-card .sq-card .sq-card-detail{display:none !important}
#dice-phase-label{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-3);color:var(--gold);margin-bottom:4px;text-transform:uppercase;}
#dice-subtitle{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);margin-bottom:10px;letter-spacing:var(--ls-1);}
/* Weapon boxes */
#dice-weapons{text-align:left;margin-bottom:10px;}
/* Two-panel layout used by attack→defense combat phases. Attack panel
   stays visible while the defender rolls so the player can compare. */
.dice-panel{background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:10px 12px;margin-bottom:10px;}
.dice-panel.atk{border-color:var(--green2);box-shadow:0 0 8px rgba(96,196,128,0.18);}
.dice-panel.def{border-color:var(--red2);box-shadow:0 0 8px rgba(220,108,108,0.18);}
.dice-panel-side{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-3);text-transform:uppercase;margin-bottom:2px;}
.dice-panel.atk .dice-panel-side{color:var(--green2);}
.dice-panel.def .dice-panel-side{color:var(--red2);}
.dice-panel-action{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);margin-bottom:8px;text-transform:uppercase;}
.dice-weapon-box{background:var(--bg3);border:1px solid var(--border);border-radius:4px;padding:9px 12px;margin-bottom:7px;}
.dice-wpn-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px;gap:8px;}
.dice-wpn-name{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);color:var(--gold);white-space:nowrap;}
.dice-wpn-target{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);text-align:right;}
.dice-row{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:5px;}
.dice-wpn-result{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);text-align:right;letter-spacing:var(--ls-1);}
.dg{color:var(--green2);font-weight:600;} .dr{color:var(--red2);font-weight:600;}
.dice-triggered{margin-top:5px;text-align:left;color:var(--gold2);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);}
.dice-trig-lead{color:var(--gold);font-weight:600;margin-right:4px;}
.dice-trig-chip{display:inline-block;background:rgba(200,150,60,0.12);color:var(--gold2);border:1px solid var(--gold);border-radius:3px;padding:1px 6px;margin:1px 3px 1px 0;font-size:var(--fs-chrome);letter-spacing:var(--ls-1);cursor:help;}
.dice-phase-hdr{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;padding:4px 0 2px;border-top:1px solid var(--border);margin-top:6px;margin-bottom:4px;}
/* Dice mode toggle */
.dm-btn{cursor:pointer;background:var(--bg3);border:1px solid var(--border);color:var(--text3);font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);padding:3px 8px;border-radius:3px;transition:color 0.1s,border-color 0.1s;}
.dm-btn:hover{color:var(--gold);border-color:var(--gold);}
.dc{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:12px;min-height:42px;}
/* Die base */
.die{
  width:38px;height:38px;
  background:var(--bg3);
  border:2px solid var(--border-hi);
  border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-ui);font-size:var(--fs-die);font-weight:700;
  color:var(--text2);
  position:relative;
  transition:border-color 0.15s, color 0.15s, transform 0.1s;
}
/* Rolling state — die tumbles */
.die.rolling{
  animation: dieTumble 0.06s steps(1) infinite;
  border-color:var(--border-hi);
  color:var(--text3);
}
@keyframes dieTumble{
  0%  {transform:rotate(0deg)   scale(1.05);}
  25% {transform:rotate(-8deg)  scale(1.08);}
  50% {transform:rotate(5deg)   scale(1.05);}
  75% {transform:rotate(-4deg)  scale(1.07);}
  100%{transform:rotate(2deg)   scale(1.06);}
}
/* Landed states */
.die.settling{
  animation: dieSettle 0.18s ease-out forwards;
}
@keyframes dieSettle{
  0%  {transform:rotate(var(--final-rot,0deg)) scale(1.15);}
  60% {transform:rotate(0deg) scale(0.95);}
  100%{transform:rotate(0deg) scale(1);}
}
.die.hit {border-color:var(--green2);color:var(--green2);}
.die.miss{border-color:var(--red2);color:var(--red2);}
.die.spc {border-color:var(--gold);color:var(--gold2);}
.die.bonus{border-color:#4a9eff;color:#4a9eff;border-width:2px;box-shadow:0 0 6px rgba(74,158,255,0.35);}
/* Hit flash */
.die.hit.settling{ animation: dieSettleHit 0.22s ease-out forwards; }
@keyframes dieSettleHit{
  0%  {transform:scale(1.2); box-shadow:0 0 12px var(--green2)44;}
  70% {transform:scale(0.94);}
  100%{transform:scale(1); box-shadow:none;}
}
.die.miss.settling{ animation: dieSettleMiss 0.18s ease-out forwards; }
@keyframes dieSettleMiss{
  0%  {transform:scale(1.15); box-shadow:0 0 8px var(--red2)33;}
  70% {transform:scale(0.96);}
  100%{transform:scale(1); box-shadow:none;}
}
.die.spc.settling{ animation: dieSettleSpc 0.22s ease-out forwards; }
@keyframes dieSettleSpc{
  0%  {transform:scale(1.25); box-shadow:0 0 14px var(--gold2)55;}
  70% {transform:scale(0.93);}
  100%{transform:scale(1); box-shadow:none;}
}
/* Result row */
#dice-res{font-family:var(--font-ui);font-size:var(--fs-unit);color:var(--text);margin-bottom:10px;min-height:16px;transition:opacity 0.2s;}
#dice-res.hidden{opacity:0;}
#dice-res .h{color:var(--green2);} #dice-res .w{color:var(--red2);}
/* Continue button — hidden while rolling, appears after */
#dice-cont{
  background:var(--bg3);border:1px solid var(--gold);color:var(--gold);
  font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-2);
  padding:6px 18px;cursor:pointer;border-radius:3px;text-transform:uppercase;
  opacity:0;pointer-events:none;transition:opacity 0.25s;
}
#dice-cont.ready{opacity:1;pointer-events:auto;}
#dice-cont:hover{background:rgba(200,150,60,0.12);}
/* Roll summary bar */
#dice-summary{
  font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);
  margin-top:8px;letter-spacing:var(--ls-1);
}

/* Melee choice dialog */
#melee-choice{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg2);border:1px solid var(--red2);padding:18px 24px;z-index:150;border-radius:4px;text-align:center;min-width:260px;}
#melee-choice h2{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-2);color:var(--red2);margin-bottom:8px;text-transform:uppercase;}

/* Hero morale choice dialog */
#hero-morale-choice{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg2);border:1px solid var(--amber2);padding:18px 24px;z-index:150;border-radius:4px;text-align:center;min-width:260px;}
#hero-morale-choice h2{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-2);color:var(--amber2);margin-bottom:8px;text-transform:uppercase;}
#melee-choice p{font-size:var(--fs-unit);color:var(--text2);margin-bottom:14px;}
.mc-btn{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:6px 16px;cursor:pointer;border-radius:3px;text-transform:uppercase;margin:0 4px;}
.mc-btn:hover{background:var(--bg3);border-color:var(--red2);color:var(--red2);}
.mc-btn.yes{border-color:var(--red2);color:var(--red2);}

/* Casualty picker dialog */
#casualty-pick{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg2);border:1px solid var(--red2);padding:18px 24px;z-index:150;border-radius:4px;text-align:center;min-width:280px;max-width:380px;}
#casualty-pick h2{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-2);color:var(--red2);margin-bottom:6px;text-transform:uppercase;}
#casualty-pick p{font-size:var(--fs-unit);color:var(--text2);margin-bottom:12px;}
#casualty-pick-btns{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;}
.cp-btn{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);padding:5px 10px;cursor:pointer;border-radius:3px;text-transform:uppercase;}
.cp-btn:hover{border-color:var(--red2);color:var(--red2);}
.cp-btn.cp-picked{border-color:var(--red2);color:var(--red2);background:rgba(180,30,30,0.15);}

/* Banner */
#banner{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,0.92);border:1px solid var(--gold);padding:12px 36px;z-index:200;border-radius:4px;text-align:center;pointer-events:none;}
#banner h2{font-family:var(--font-ui);font-size:var(--fs-die);letter-spacing:var(--ls-4);color:var(--gold);text-transform:uppercase;}
#banner p{font-size:var(--fs-md);color:var(--text2);margin-top:3px;}
#tooltip{display:none;position:fixed;background:var(--bg2);border:1px solid var(--border-hi);padding:7px 10px;border-radius:4px;font-size:var(--fs-md);color:var(--text);pointer-events:none;z-index:300;max-width:300px;font-family:var(--font-ui);line-height:1.5;}
#game-opts-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.82);z-index:450;align-items:flex-start;justify-content:center;overflow-y:auto;padding:24px 12px;}
#game-opts-overlay.show{display:flex;}
#game-opts-inner{background:var(--bg2);border:1px solid var(--border-hi);border-radius:6px;padding:18px 22px;width:520px;max-width:96vw;}
#game-opts-inner #options-panel.show{background:none;border:none;border-radius:0;padding:0;margin:0;width:100%;max-width:100%;}
#victory{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.9);z-index:500;align-items:center;justify-content:center;flex-direction:column;text-align:center;}
#victory.show{display:flex;}
#victory h1{font-family:var(--font-ui);font-size:var(--fs-heading);letter-spacing:var(--ls-5);text-transform:uppercase;margin-bottom:8px;}
#victory p{color:var(--text2);margin-bottom:18px;font-size:var(--fs-body);}
#victory-history{max-height:160px;overflow-y:auto;margin-bottom:18px;min-width:220px;}
#restart{background:var(--bg3);border:1px solid var(--gold);color:var(--gold);font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-2);padding:9px 28px;cursor:pointer;border-radius:3px;text-transform:uppercase;}
#restart:hover{background:rgba(200,150,60,0.18);}
::-webkit-scrollbar{width:4px;} ::-webkit-scrollbar-track{background:var(--bg);} ::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px;}

/* ---- Start menu ---- */
#start-menu{position:fixed;inset:0;background:var(--bg);z-index:800;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow-y:auto;}
#start-menu.hidden{display:none;}
.sm-title{font-family:var(--font-ui);font-size:var(--fs-heading);letter-spacing:var(--ls-5);color:var(--gold);text-transform:uppercase;margin-bottom:4px;text-align:center;}
.sm-sub{font-family:var(--font-ui);font-size:var(--fs-unit);color:var(--text3);letter-spacing:var(--ls-3);margin-bottom:40px;text-align:center;}
.sm-main-btns{display:flex;gap:16px;margin-bottom:40px;}
.sm-main-btn{font-family:var(--font-ui);font-size:var(--fs-body);letter-spacing:var(--ls-2);text-transform:uppercase;padding:14px 36px;border-radius:4px;cursor:pointer;transition:all 0.15s;}
.sm-main-btn.primary{background:rgba(200,150,60,0.12);border:1px solid var(--gold);color:var(--gold);}
.sm-main-btn.primary:hover{background:rgba(200,150,60,0.22);}
.sm-main-btn.disabled{background:var(--bg3);border:1px solid var(--border);color:var(--text3);cursor:not-allowed;opacity:0.5;}

/* ---- Hover tooltips (unit card + terrain) ---- */
.hover-tooltip{position:fixed;z-index:700;pointer-events:none;background:var(--bg2);border:1px solid var(--border-hi);border-radius:6px;box-shadow:0 4px 20px rgba(0,0,0,0.75);font-family:var(--font-ui);}
/* Unit hover card */
.hover-unit-card{padding:10px 12px;min-width:220px;max-width:300px;}
.htc-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px;border-bottom:1px solid var(--border);padding-bottom:5px;}
.htc-name{font-size:var(--fs-unit);font-weight:700;color:var(--gold);letter-spacing:var(--ls-1);}
.htc-models{font-size:var(--fs-xs);color:var(--text3);white-space:nowrap;margin-left:6px;}
.htc-stats{display:flex;gap:10px;margin-bottom:6px;}
.htc-sb{text-align:center;}
.htc-sl{font-size:var(--fs-xxs);letter-spacing:var(--ls-1);color:var(--text3);text-transform:uppercase;}
.htc-sv{font-size:var(--fs-modal);color:var(--text1);font-weight:700;}
.htc-rules{display:flex;flex-wrap:wrap;gap:3px;margin-bottom:6px;}
.htc-rule-tag{font-size:var(--fs-xs);padding:1px 5px;border-radius:2px;background:rgba(120,80,220,0.15);border:1px solid rgba(120,80,220,0.35);color:var(--purple2);}
.htc-wpn-table{width:100%;border-collapse:collapse;border-top:1px solid var(--border);margin-top:4px;}
.htc-wpn-table td{font-size:var(--fs-xs);padding:2px 4px;color:var(--text2);}
.htc-wpn-name{color:var(--text1);font-weight:600;}
.htc-wpn-rng{color:var(--text3);white-space:nowrap;}
.htc-wpn-atk{color:var(--text2);}
/* Terrain hover tip */
.hover-terrain-tip{padding:10px 14px;min-width:200px;max-width:280px;}
.htt-name{font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--gold);text-transform:uppercase;margin-bottom:8px;border-bottom:1px solid var(--border);padding-bottom:5px;}
.htt-rule{margin-bottom:8px;}
.htt-rule:last-child{margin-bottom:0;}
.htt-rule-name{font-size:var(--fs-chrome);font-weight:700;color:var(--text1);margin-bottom:2px;letter-spacing:var(--ls-0);}
.htt-rule-desc{font-size:var(--fs-chrome);color:var(--text3);line-height:1.5;font-family:sans-serif;letter-spacing:0;}

/* ---- Battle Options Modal ---- */
.sp-modal-overlay{position:fixed;inset:0;background:rgba(5,7,11,0.88);z-index:800;display:flex;align-items:center;justify-content:center;}
.sp-modal{background:var(--bg2);border:1px solid var(--border-hi);border-radius:8px;padding:28px 32px;width:420px;max-width:96vw;max-height:90vh;overflow-y:auto;}
.sp-modal-title{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-3);color:var(--gold);margin-bottom:20px;text-align:center;}
.sp-opts .opt-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.sp-opts .opt-label{width:120px;flex-shrink:0;margin-bottom:0;}
.sp-modal-footer{display:flex;gap:12px;justify-content:flex-end;margin-top:20px;border-top:1px solid var(--border);padding-top:16px;}
.spm-cancel-btn{font-family:var(--font-ui);font-size:var(--fs-unit);letter-spacing:var(--ls-1);padding:10px 22px;border-radius:4px;cursor:pointer;background:rgba(100,120,160,0.08);border:1px solid var(--border-hi);color:var(--text2);transition:all 0.15s;}
.spm-cancel-btn:hover{border-color:var(--text2);color:var(--text1);}
.spm-icon-btn{font-family:var(--font-ui);font-size:var(--fs-body);padding:4px 8px;border-radius:3px;cursor:pointer;background:var(--bg3);border:1px solid var(--border);color:var(--text2);flex-shrink:0;line-height:1.3;transition:border-color 0.1s,color 0.1s;}
.spm-icon-btn:hover{border-color:var(--gold);color:var(--gold);}
.spm-list-pill{flex:1;min-width:0;font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);color:var(--gold);background:rgba(200,150,60,0.08);border:1px solid rgba(200,150,60,0.3);border-radius:3px;padding:5px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.spm-list-row:hover{background:rgba(200,150,60,0.06) !important;}
.spm-list-del:hover{color:var(--red2) !important;border-color:var(--red2) !important;}
#spm-custom-pts{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-md);padding:5px 8px;border-radius:3px;width:90px;outline:none;}
#spm-custom-pts:focus{border-color:var(--gold);}
.deploy-preview-tip{display:none;position:fixed;background:var(--bg);border:1px solid var(--border-hi);border-radius:5px;padding:8px;z-index:850;pointer-events:none;box-shadow:0 4px 16px rgba(0,0,0,0.6);}
.deploy-preview-tip canvas{display:block;}
.deploy-preview-tip .dp-label{font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:var(--ls-1);color:var(--text3);text-align:center;margin-top:5px;text-transform:uppercase;}

/* ---- Roll-off overlay ---- */
.rolloff-overlay{position:fixed;inset:0;background:rgba(5,7,11,0.92);z-index:900;display:flex;align-items:center;justify-content:center;}
.rolloff-panel{background:var(--bg2);border:1px solid var(--border-hi);border-radius:8px;padding:36px 48px;min-width:360px;text-align:center;}
.ro-title{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-4);color:var(--text3);margin-bottom:28px;text-transform:uppercase;}
.ro-dice-row{display:flex;align-items:center;justify-content:center;gap:32px;margin-bottom:24px;}
.ro-side{display:flex;flex-direction:column;align-items:center;gap:10px;}
.ro-side-label{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);}
.ro-die{font-size:72px;line-height:1;width:90px;height:90px;display:flex;align-items:center;justify-content:center;background:var(--bg3);border:2px solid var(--border);border-radius:10px;transition:all 0.3s;}
#ro-pdie{color:#4caf7d;border-color:#2d6e4a;}
#ro-edie{color:#e05555;border-color:#8a2929;}
.ro-die.ro-winner{filter:brightness(1.3);}
#ro-pdie.ro-winner{box-shadow:0 0 16px rgba(76,175,125,0.5);}
#ro-edie.ro-winner{box-shadow:0 0 16px rgba(224,85,85,0.5);}
.ro-die.ro-loser{opacity:0.35;filter:grayscale(0.6);}
.ro-vs{font-family:var(--font-ui);font-size:var(--fs-unit);color:var(--text3);letter-spacing:var(--ls-2);}
.ro-result{font-family:var(--font-ui);font-size:var(--fs-body);letter-spacing:var(--ls-3);min-height:20px;margin-bottom:6px;}
.ro-result.p-wins{color:var(--gold);}
.ro-result.e-wins{color:var(--red2);}
.ro-zone-info{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text2);margin-top:10px;line-height:1.8;letter-spacing:var(--ls-1);}
.ro-continue{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);margin-top:18px;animation:blink 1.2s step-start infinite;}

/* Options panel */
#options-panel{display:none;margin-top:10px;background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:18px 24px;width:480px;max-width:96vw;}
#options-panel.show{display:block;}
.opt-title{font-family:var(--font-ui);font-size:var(--fs-unit);letter-spacing:var(--ls-3);color:var(--gold);margin-bottom:14px;text-align:center;}
.opt-section{margin-bottom:16px;}
.opt-label{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);margin-bottom:8px;text-transform:uppercase;}
.opt-hint{color:var(--text3);font-size:var(--fs-md);margin-left:6px;}
.opt-row{display:flex;align-items:center;gap:10px;}
.opt-themes{display:flex;flex-wrap:wrap;gap:8px;}
.opt-theme-btn{font-family:var(--font-ui);font-size:var(--fs-chrome);padding:5px 12px;border-radius:3px;cursor:pointer;border:1px solid var(--border);background:var(--bg3);color:var(--text2);letter-spacing:var(--ls-1);transition:all 0.1s;}
.opt-theme-btn:hover,.opt-theme-btn.active{border-color:var(--gold);color:var(--gold);}
.sm-select{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);color:var(--text1);background:var(--bg3);border:1px solid var(--border);border-radius:3px;padding:5px 10px;flex:1;cursor:pointer;outline:none;transition:border-color 0.1s;}
.sm-select:hover,.sm-select:focus{border-color:var(--gold);}
#sm-config .opt-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
#sm-config .opt-label{width:120px;flex-shrink:0;margin-bottom:0;}
#opt-font-range{flex:1;accent-color:var(--gold);cursor:pointer;}
#opt-accent-pick{width:36px;height:28px;border:1px solid var(--border);border-radius:3px;background:var(--bg3);cursor:pointer;padding:2px;}
.opt-reset-btn{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);padding:6px 16px;border:1px solid var(--border);background:var(--bg3);color:var(--text3);border-radius:3px;cursor:pointer;transition:all 0.1s;}
.opt-reset-btn:hover{border-color:var(--red2);color:var(--red2);}
.opt-tabs{display:flex;gap:0;margin-bottom:16px;border-bottom:1px solid var(--border);}
.opt-tab{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);padding:6px 16px;border:1px solid transparent;border-bottom:none;border-radius:4px 4px 0 0;background:transparent;color:var(--text3);cursor:pointer;transition:all 0.15s;}
.opt-tab.active{background:var(--bg3);color:var(--gold);border-color:var(--border);}
.opt-tab:hover:not(.active){color:var(--text2);}
.opt-tabpane{display:none;max-height:60vh;overflow-y:auto;padding-right:4px;}
.opt-tabpane.active{display:block;}
.opt-cf-group{margin-bottom:14px;border:1px solid var(--border);border-radius:4px;overflow:hidden;}
.opt-cf-group-hdr{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--gold2);background:var(--bg3);padding:5px 10px;text-transform:uppercase;}
.opt-cf-row{display:flex;align-items:center;gap:8px;padding:4px 10px;border-top:1px solid var(--border);}
.opt-cf-label{font-size:var(--fs-md);color:var(--text2);flex:1;}
.opt-cf-hint{display:block;font-size:var(--fs-xs);color:var(--text3);margin-top:1px;font-family:var(--font-ui);letter-spacing:0;}
.opt-cf-op{width:38px;text-align:right;font-size:var(--fs-chrome);padding:2px 3px;background:var(--bg3);border:1px solid var(--border);color:var(--text2);border-radius:3px;font-family:var(--font-ui);-moz-appearance:textfield;}
.opt-cf-op::-webkit-inner-spin-button,.opt-cf-op::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
.opt-cf-op-pct{font-size:var(--fs-chrome);color:var(--text3);font-family:var(--font-ui);}
.opt-cf-pick{width:32px;height:22px;border:1px solid var(--border);border-radius:3px;cursor:pointer;padding:1px;background:var(--bg3);}
.opt-cf-select{font-family:var(--font-ui);font-size:var(--fs-chrome);background:var(--bg3);color:var(--text2);border:1px solid var(--border);border-radius:3px;padding:3px 6px;cursor:pointer;}
/* Setup panel */
#setup-panel{display:none;width:100%;max-width:900px;padding:0 20px 40px;}
#setup-panel.show{display:block;}
.sp-section{margin-bottom:28px;}
.sp-label{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;margin-bottom:10px;border-bottom:1px solid var(--border);padding-bottom:5px;}
/* Army cards */
.army-grid{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.army-select{font-family:var(--font-ui);font-size:var(--fs-modal);padding:10px 14px;border-radius:4px;border:1px solid var(--border-hi);background:var(--bg3);color:var(--text);cursor:pointer;min-width:260px;max-width:420px;flex:1;outline:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23888' d='M0 0l6 8 6-8z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;}
.army-select:focus{border-color:var(--gold);}
.army-select-preview{font-size:var(--fs-unit);color:var(--text3);font-family:var(--font-ui);padding:4px 0;}
/* Points selector */
.pts-row{display:flex;gap:10px;flex-wrap:wrap;}
.pts-btn{font-family:var(--font-ui);font-size:var(--fs-unit);padding:8px 18px;border-radius:3px;cursor:pointer;border:1px solid var(--border-hi);background:var(--bg3);color:var(--text2);transition:all 0.12s;letter-spacing:var(--ls-1);}
.pts-btn:hover{border-color:var(--gold);color:var(--gold);}
.pts-btn.selected{background:rgba(200,150,60,0.12);border-color:var(--gold);color:var(--gold2);}
.pts-custom{display:flex;align-items:center;gap:10px;margin-top:10px;}
.pts-custom input{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-modal);padding:7px 12px;border-radius:3px;width:100px;}
.pts-custom input:focus{outline:none;border-color:var(--gold);}
.sp-diff-btn{font-family:var(--font-ui);font-size:var(--fs-chrome);padding:7px 8px;border-radius:3px;cursor:pointer;border:1px solid;background:var(--bg3);transition:all 0.12s;text-align:left;opacity:0.55;}
.sp-diff-btn:hover{opacity:0.85;}
.sp-diff-btn.selected{opacity:1;background:rgba(255,255,255,0.05);outline:2px solid currentColor;outline-offset:-1px;}
.sp-diff-name{font-size:var(--fs-chrome);letter-spacing:var(--ls-0);margin-bottom:2px;}
.sp-diff-sub{font-size:var(--fs-xs);color:var(--text3);font-weight:normal;}
/* Hot Seat */
.hs-toggle-row{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 10px;background:var(--bg3);border:1px solid var(--border);border-radius:3px;cursor:pointer;user-select:none;transition:border-color 0.15s;}
.hs-toggle-row:hover{border-color:var(--cyan2);}
.hs-toggle-row.on{border-color:var(--cyan2);background:#0d2a30;}
.hs-check{width:14px;height:14px;border:1px solid var(--border-hi);border-radius:2px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:var(--fs-md);color:transparent;transition:all 0.15s;}
.hs-check.on{background:var(--cyan2);border-color:var(--cyan2);color:#000;}
.hs-toggle-label{font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text2);letter-spacing:0.4px;}
.hs-toggle-label b{color:var(--cyan2);}
#hs-interstitial{display:none;position:fixed;inset:0;z-index:9999;background:#07090d;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;}
#hs-interstitial.show{display:flex;}
#hs-interstitial .hs-p-num{font-family:var(--font-ui);font-size:var(--fs-hero);font-weight:900;letter-spacing:var(--ls-5);margin-bottom:4px;}
#hs-interstitial .hs-army{font-family:var(--font-ui);font-size:var(--fs-body);letter-spacing:var(--ls-3);color:var(--text2);margin-bottom:36px;text-transform:uppercase;}
#hs-interstitial .hs-your-turn{font-family:var(--font-ui);font-size:var(--fs-hs);letter-spacing:var(--ls-6);color:var(--text1);margin-bottom:52px;}
#hs-interstitial .hs-click{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-3);color:var(--text3);animation:blink 1.4s step-start infinite;}
@keyframes blink{50%{opacity:0;}}

/* Opponent */
.opp-row{display:flex;gap:10px;flex-wrap:wrap;}
.opp-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
/* Start battle button */
.start-battle-wrap{display:flex;justify-content:flex-end;margin-top:24px;}
#start-battle-btn{font-family:var(--font-ui);font-size:var(--fs-body);letter-spacing:var(--ls-2);text-transform:uppercase;padding:12px 36px;border-radius:4px;cursor:pointer;background:rgba(200,150,60,0.12);border:1px solid var(--gold);color:var(--gold);transition:all 0.15s;}
#start-battle-btn:hover:not(:disabled){background:rgba(200,150,60,0.25);color:var(--gold2);}
#start-battle-btn:disabled{opacity:0.3;cursor:not-allowed;}
.setup-error{font-family:var(--font-ui);font-size:var(--fs-md);color:var(--red2);margin-top:8px;min-height:16px;}
/* Saved-list picker inside setup panel */
.sp-list-toggle{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);padding:4px 12px;border-radius:3px;cursor:pointer;border:1px solid var(--border-hi);background:var(--bg3);color:var(--text3);text-transform:uppercase;transition:all 0.12s;margin-top:10px;}
.sp-list-toggle:hover{border-color:var(--gold);color:var(--gold);}
.sp-list-toggle.active{border-color:var(--cyan);color:var(--cyan2);background:rgba(22,160,133,0.08);}
.sp-saved-lists{margin-top:10px;display:none;}
.sp-saved-lists.open{display:block;}
.sp-saved-list-row{display:flex;align-items:center;gap:8px;padding:7px 10px;background:var(--bg3);border:1px solid var(--border);border-radius:3px;margin-bottom:5px;cursor:pointer;transition:border-color 0.1s;}
.sp-saved-list-row:hover{border-color:var(--gold);}
.sp-saved-list-row.selected{border-color:var(--gold);background:rgba(200,150,60,0.08);}
.sp-saved-list-row.selected::before{content:'✓';color:var(--gold);font-weight:700;margin-right:2px;}
.sp-saved-list-info{flex:1;min-width:0;}
.sp-saved-list-name{font-family:var(--font-ui);font-size:var(--fs-md);font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sp-saved-list-meta{font-family:var(--font-ui);font-size:var(--fs-xs);color:var(--text3);margin-top:1px;}
.sp-no-saves{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);padding:8px 0;}
.sp-clear-list-btn{font-family:var(--font-ui);font-size:var(--fs-xs);padding:3px 8px;border-radius:2px;cursor:pointer;background:none;border:1px solid var(--border);color:var(--text3);}
.sp-clear-list-btn:hover{border-color:var(--red2);color:var(--red2);}
/* ---- List Builder setup panel (points picker before entering builder) ---- */
#lb-setup-panel{display:none;width:100%;max-width:520px;padding:0 20px 40px;}
#lb-setup-panel.show{display:block;}
#lb-edit-panel{display:none;width:100%;max-width:520px;padding:0 20px 40px;}
#lb-edit-panel.show{display:block;}
.lb-sp-label{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;margin-bottom:12px;border-bottom:1px solid var(--border);padding-bottom:5px;}
.lb-sp-sub{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);margin-bottom:16px;letter-spacing:var(--ls-0);line-height:1.6;}
.lb-sp-pts-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.lb-sp-btn{font-family:var(--font-ui);font-size:var(--fs-modal);padding:9px 22px;border-radius:3px;cursor:pointer;border:1px solid var(--border-hi);background:var(--bg3);color:var(--text2);transition:all 0.12s;letter-spacing:var(--ls-1);}
.lb-sp-btn:hover{border-color:var(--gold);color:var(--gold);}
.lb-sp-btn.selected{background:rgba(200,150,60,0.12);border-color:var(--gold);color:var(--gold2);}
.lb-sp-custom{display:flex;align-items:center;gap:10px;margin-bottom:22px;}
.lb-sp-custom span{font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text3);}
.lb-sp-custom input{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-modal);padding:7px 12px;border-radius:3px;width:100px;}
.lb-sp-custom input:focus{outline:none;border-color:var(--gold);}
.lb-sp-actions{display:flex;gap:12px;align-items:center;}
.lb-sp-army-wrap{margin-bottom:22px;}
.lb-sp-army-wrap select{width:100%;background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-unit);padding:8px 12px;border-radius:3px;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23888'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;}
.lb-sp-army-wrap select:focus{outline:none;border-color:var(--gold);}
.lb-sp-army-wrap select option{background:var(--bg3);color:var(--text);}
#lb-enter-btn{font-family:var(--font-ui);font-size:var(--fs-body);letter-spacing:var(--ls-2);text-transform:uppercase;padding:12px 32px;border-radius:4px;cursor:pointer;background:rgba(200,150,60,0.12);border:1px solid var(--gold);color:var(--gold);transition:all 0.15s;}
#lb-enter-btn:hover:not(:disabled){background:rgba(200,150,60,0.25);color:var(--gold2);}
#lb-enter-btn:disabled{opacity:0.3;cursor:not-allowed;}
/* ---- Army List Builder ---- */
#list-builder{position:fixed;inset:0;background:var(--bg);z-index:810;display:none;flex-direction:column;}
#list-builder.show{display:flex;}
#lb-header{background:var(--bg2);border-bottom:1px solid var(--border);padding:8px 16px;display:flex;align-items:center;gap:14px;flex-shrink:0;}
#lb-header h2{font-family:var(--font-ui);font-size:var(--fs-body);color:var(--gold);letter-spacing:var(--ls-3);text-transform:uppercase;flex:1;}
#lb-pts-display{font-family:var(--font-ui);font-size:var(--fs-unit);color:var(--text2);white-space:nowrap;}
#lb-pts-display span{color:var(--gold);}
#lb-pts-display.over span{color:var(--red2);}
.lb-hdr-btn{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:5px 12px;border-radius:3px;cursor:pointer;text-transform:uppercase;border:1px solid var(--border-hi);background:var(--bg3);color:var(--text2);transition:all 0.12s;}
.lb-hdr-btn:hover{border-color:var(--gold);color:var(--gold);}
.lb-hdr-btn.primary{border-color:var(--gold);color:var(--gold);background:rgba(200,150,60,0.1);}
#lb-body{flex:1;display:flex;overflow:hidden;}
#lb-factions{display:none;}
.lb-faction-btn{display:block;width:100%;padding:9px 12px;border:none;background:transparent;color:var(--text2);font-family:var(--font-ui);font-size:var(--fs-chrome);text-align:left;cursor:pointer;border-bottom:1px solid var(--border);transition:background 0.1s;letter-spacing:var(--ls-0);}
.lb-faction-btn:hover{background:var(--bg3);}
.lb-faction-btn.active{background:rgba(200,150,60,0.07);color:var(--gold);border-left:2px solid var(--gold);}
.lb-faction-btn.locked{pointer-events:none;}
#lb-mix-info{display:none!important;}
.lb-model-preview{margin:8px 0 4px;padding:8px;background:var(--bg);border:1px solid var(--border);border-radius:3px;}
.lb-model-preview-title{font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:1.5px;color:var(--text3);text-transform:uppercase;margin-bottom:6px;}
.lb-model-preview svg{display:block;}
.lb-faction-icon{font-size:var(--fs-body);margin-right:6px;}
#lb-units{flex:1;overflow-y:auto;padding:10px 14px;}
.lb-unit-card{background:var(--bg2);border:1px solid var(--border);border-radius:4px;margin-bottom:8px;overflow:hidden;}
.lb-unit-hdr{display:flex;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;user-select:none;}
.lb-unit-hdr:hover{background:var(--bg3);}
.lb-unit-chevron{font-size:var(--fs-chrome);color:var(--text3);transition:transform 0.15s;flex-shrink:0;}
.lb-unit-chevron.open{transform:rotate(90deg);}
.lb-unit-name{font-family:var(--font-ui);font-size:var(--fs-unit);font-weight:700;flex:1;}
.lb-unit-meta{font-size:var(--fs-chrome);color:var(--text3);font-family:var(--font-ui);}
.lb-unit-cost{font-family:var(--font-ui);font-size:var(--fs-unit);color:var(--gold);margin-left:6px;}
.lb-add-btn{background:rgba(200,150,60,0.1);border:1px solid var(--gold);color:var(--gold);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:3px 10px;border-radius:3px;cursor:pointer;white-space:nowrap;transition:all 0.1s;}
.lb-add-btn:hover{background:rgba(200,150,60,0.25);}
.lb-unit-body{padding:0 12px 10px;display:none;}
.lb-unit-body.open{display:block;}
.lb-stat-row{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap;}
.lb-stat{background:var(--bg3);border:1px solid var(--border);padding:3px 8px;border-radius:3px;font-family:var(--font-ui);font-size:var(--fs-chrome);text-align:center;}
.lb-stat .lb-sl{color:var(--text3);font-size:var(--fs-xs);} .lb-stat .lb-sv{color:var(--gold);}
.lb-wpn-table{width:100%;border-collapse:collapse;font-size:var(--fs-chrome);margin-bottom:8px;}
.lb-wpn-table th{color:var(--text3);font-weight:400;padding:3px 4px;border-bottom:1px solid var(--border);text-align:left;font-family:var(--font-ui);white-space:nowrap;}
.lb-wpn-table td{padding:3px 4px;color:var(--text2);font-family:var(--font-ui);border-bottom:1px solid rgba(42,48,64,0.35);vertical-align:top;}
.lb-wpn-table td:first-child{color:var(--cyan2);font-weight:700;}
.lb-wpn-table td:nth-child(2),.lb-wpn-table td:nth-child(3),.lb-wpn-table td:nth-child(4){white-space:nowrap;}
.lb-wpn-table td:last-child{min-width:60px;}
.lb-rules-wrap{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:6px;}
.lb-rule-tag{font-size:var(--fs-xs);font-family:var(--font-ui);padding:2px 6px;border-radius:2px;background:var(--bg3);border:1px solid var(--border);color:var(--purple2);}
.lb-rule-tag.has-desc{cursor:help;border-color:rgba(155,89,182,0.5);}
.lb-rule-tag.has-desc:hover{background:rgba(155,89,182,0.15);border-color:var(--purple2);}
/* Floating rule tooltip */
#rule-tooltip{
  display:none;
  position:fixed;
  z-index:9999;
  max-width:260px;
  background:var(--bg2);
  border:1px solid var(--purple2);
  border-radius:4px;
  padding:7px 10px;
  font-family:var(--font-ui);
  pointer-events:none;
}
#rule-tooltip .rt-name{font-size:var(--fs-md);font-weight:700;color:var(--purple2);margin-bottom:4px;}
#rule-tooltip .rt-desc{font-size:var(--fs-chrome);color:var(--text2);line-height:1.5;}
/* List-builder weapon option tooltip */
#lb-wpn-tip{
  display:none;
  position:fixed;
  z-index:9999;
  max-width:260px;
  min-width:140px;
  background:var(--bg2);
  border:1px solid var(--border-hi);
  border-radius:4px;
  padding:8px 10px;
  box-shadow:0 4px 20px rgba(0,0,0,0.5);
  font-family:var(--font-ui);
  pointer-events:none;
}
/* Casualty-removal model stat/weapon tooltip */
#model-tip{
  display:none;
  position:fixed;
  z-index:9999;
  max-width:300px;
  min-width:180px;
  background:var(--bg2);
  border:1px solid var(--border-hi);
  border-radius:4px;
  padding:8px 10px;
  box-shadow:0 4px 20px rgba(0,0,0,0.5);
  font-family:var(--font-ui);
  pointer-events:none;
}
#model-tip .mt-name{font-size:var(--fs-md);font-weight:700;color:var(--text);margin-bottom:5px;}
#model-tip .mt-tough{font-size:var(--fs-xs);font-weight:400;color:var(--text3);}
#model-tip .mt-wpn-table{width:100%;border-collapse:collapse;margin-top:4px;}
#model-tip .mt-wpn-name{font-size:var(--fs-xs);color:var(--text2);padding:3px 4px 3px 0;border-top:1px solid rgba(255,255,255,0.06);}
#model-tip .mt-wpn-stat{font-size:var(--fs-xs);color:var(--text3);text-align:center;padding:3px 4px;white-space:nowrap;border-top:1px solid rgba(255,255,255,0.06);}
#model-tip .mt-wpn-rules{padding:0 0 4px;}
.lb-upg-section{margin-top:8px;border-top:1px solid var(--border);padding-top:8px;}
.lb-upg-title{font-size:var(--fs-xs);color:var(--text3);letter-spacing:var(--ls-1);margin-bottom:5px;text-transform:uppercase;font-family:var(--font-ui);}
.lb-upg-row{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid rgba(42,48,64,0.3);}
.lb-upg-row:last-child{border-bottom:none;}
.lb-upg-row:hover{background:rgba(200,150,60,0.05);}
.lb-upg-row input[type=checkbox]:checked + label{color:var(--gold);}
.lb-upg-row label{font-size:var(--fs-chrome);color:var(--text2);flex:1;cursor:pointer;font-family:var(--font-ui);line-height:1.4;}
.lb-upg-pts{font-size:var(--fs-chrome);color:var(--amber2);font-family:var(--font-ui);min-width:38px;text-align:right;}
.lb-stepper-row label{cursor:default!important;}
.lb-step-btn{background:var(--bg3);border:1px solid var(--border);color:var(--gold);font-size:var(--fs-unit);font-family:var(--font-ui);width:18px;height:18px;border-radius:2px;cursor:pointer;padding:0;flex-shrink:0;display:flex;align-items:center;justify-content:center;line-height:1;}
.lb-step-btn:hover:not(:disabled){background:rgba(200,150,60,0.2);border-color:var(--gold);}
.lb-step-btn:disabled{cursor:default;}
.lb-step-qty{font-size:var(--fs-md);font-family:var(--font-ui);color:var(--gold);min-width:14px;text-align:center;font-weight:700;}
.lb-sec-badge{font-size:var(--fs-xxs);color:var(--text3);background:var(--bg3);border:1px solid var(--border);border-radius:2px;padding:1px 5px;margin-left:5px;font-family:var(--font-ui);letter-spacing:var(--ls-0);text-transform:lowercase;vertical-align:middle;}
#lb-list{width:250px;background:var(--panel);border-left:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;}
#lb-list-hdr{padding:7px 12px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;}
#lb-list-hdr h3{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;}
#lb-list-scroll{flex:1;overflow-y:auto;padding:8px;}
.lb-list-entry{background:var(--bg2);border:1px solid var(--border);border-radius:4px;padding:7px 9px;margin-bottom:5px;}
.lb-list-name{font-family:var(--font-ui);font-size:var(--fs-md);font-weight:700;color:var(--text);display:flex;justify-content:space-between;align-items:center;gap:4px;}
.lb-list-name-left{display:flex;align-items:center;gap:4px;min-width:0;flex:1;}
.lb-list-name-left>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lb-list-name-right{display:flex;align-items:center;gap:5px;flex-shrink:0;}
.lb-list-pts{color:var(--gold);white-space:nowrap;}
.lb-list-detail{font-size:var(--fs-chrome);color:var(--text3);margin-top:2px;font-family:var(--font-ui);}
.lb-list-upgs{font-size:var(--fs-xs);color:var(--purple2);font-family:var(--font-ui);margin-top:3px;line-height:1.5;}
.lb-remove{background:none;border:none;color:var(--red2);cursor:pointer;font-size:var(--fs-modal);line-height:1;padding:0;}
.lb-remove:hover{color:#ff6b6b;}
.lb-edit{background:none;border:none;color:var(--gold);cursor:pointer;font-size:var(--fs-modal);line-height:1;padding:0;}
.lb-edit:hover{color:var(--gold2);}
.lb-combine{background:none;border:none;color:var(--cyan2);cursor:pointer;font-size:var(--fs-unit);line-height:1;padding:0;font-family:var(--font-ui);}
.lb-combine:hover{color:var(--cyan);}
.lb-split{background:none;border:none;color:var(--amber2);cursor:pointer;font-size:var(--fs-unit);line-height:1;padding:0;font-family:var(--font-ui);}
.lb-split:hover{color:var(--amber);}
.lb-combined-badge{font-size:var(--fs-xs);font-family:var(--font-ui);color:var(--cyan2);border:1px solid var(--cyan);padding:1px 4px;border-radius:2px;margin-left:4px;}
.lb-hero-entry{border-left:2px solid var(--gold);}
.lb-hero-attach-row{font-size:var(--fs-xs);margin-top:5px;display:flex;align-items:center;gap:5px;}
.lb-hero-attach-row label{color:var(--gold);white-space:nowrap;font-family:var(--font-ui);}
.lb-hero-attach-row select{font-size:var(--fs-xs);background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:3px;padding:1px 4px;max-width:132px;cursor:pointer;font-family:var(--font-ui);}
.lb-hero-attach-row select:focus{outline:none;border-color:var(--gold);}
.lb-attached-hero-line{font-size:var(--fs-xs);color:var(--gold);margin-top:3px;font-family:var(--font-ui);line-height:1.6;}
.lb-expand-btn{background:none;border:none;color:var(--green2);cursor:pointer;font-size:var(--fs-md);line-height:1;padding:0;font-family:var(--font-ui);flex-shrink:0;}
.lb-expand-btn:hover{color:var(--green);}
.lb-list-stats{margin-top:6px;border-top:1px solid var(--border);padding-top:6px;animation:lbFadeIn .12s ease;}
@keyframes lbFadeIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}
.lb-stat-bar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:5px;font-size:var(--fs-xs);font-family:var(--font-ui);color:var(--text3);align-items:center;}
.lb-stat-bar .sv{color:var(--text2);font-weight:700;}
.lb-stat-bar .sk{color:var(--text3);margin-right:1px;}
.lb-stat-mv{color:var(--cyan2) !important;}
.lb-stat-sep{color:var(--border);user-select:none;}
.lb-stats-rules{margin-top:5px;display:flex;flex-wrap:wrap;gap:3px;}
.lb-upg-subgroup{font-size:var(--fs-xs);color:var(--text3);letter-spacing:var(--ls-1);text-transform:uppercase;font-family:var(--font-ui);margin:8px 0 4px;padding-bottom:3px;border-bottom:1px solid var(--border);}
.lb-unit-group-hdr{font-size:var(--fs-xs);color:var(--text3);letter-spacing:var(--ls-2);text-transform:uppercase;font-family:var(--font-ui);padding:10px 0 4px;border-bottom:1px solid var(--border);margin-bottom:6px;display:flex;align-items:center;gap:6px;}
.lb-unit-group-hdr:first-child{padding-top:2px;}
.lb-unit-group-hdr .lg-count{font-size:var(--fs-xxs);color:var(--border);background:var(--bg3);border:1px solid var(--border);border-radius:2px;padding:1px 4px;letter-spacing:0;}
#lb-empty{padding:24px 16px;text-align:center;font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text3);line-height:1.8;}
#lb-pts-bar-wrap{padding:10px 12px;border-top:1px solid var(--border);flex-shrink:0;}
.lb-pts-numbers{display:flex;justify-content:space-between;font-family:var(--font-ui);font-size:var(--fs-md);margin-bottom:5px;color:var(--text2);}
.lb-pts-numbers .used{color:var(--gold);}
.lb-pts-numbers .limit{color:var(--text3);}
.lb-pts-track{height:5px;background:var(--bg3);border-radius:3px;overflow:hidden;}
.lb-pts-fill{height:100%;border-radius:3px;transition:width 0.3s,background 0.3s;}
#lb-limit-wrap{display:flex;gap:8px;align-items:center;margin-bottom:8px;font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);}
#lb-limit-wrap input{width:70px;background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-md);padding:4px 7px;border-radius:3px;}
#lb-limit-wrap input:focus{outline:none;border-color:var(--gold);}
.lb-action-btns{display:flex;gap:6px;margin-top:6px;}
.lb-action-btn{flex:1;padding:7px 4px;font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);text-transform:uppercase;border-radius:3px;cursor:pointer;text-align:center;transition:all 0.12s;}
.lb-action-btn.play{background:rgba(200,150,60,0.1);border:1px solid var(--gold);color:var(--gold);}
/* Force Org violation popup */
#lb-violation-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.82);z-index:600;align-items:center;justify-content:center;}
#lb-violation-modal.show{display:flex;}
#lb-violation-inner{background:var(--bg2);border:1px solid var(--red2);border-radius:5px;padding:20px 22px;min-width:310px;max-width:440px;width:88vw;}
#lb-violation-inner h2{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-2);color:var(--red2);text-transform:uppercase;margin:0 0 12px 0;}
.lb-viol-row{display:flex;align-items:flex-start;gap:9px;margin-bottom:8px;font-family:var(--font-ui);font-size:var(--fs-md);line-height:1.45;color:var(--text2);}
.lb-viol-icon{color:var(--red2);font-size:var(--fs-body);flex-shrink:0;margin-top:1px;}
#lb-violation-inner button{margin-top:14px;width:100%;background:var(--bg3);border:1px solid var(--red2);color:var(--red2);font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:7px 0;cursor:pointer;border-radius:3px;text-transform:uppercase;}
#lb-violation-inner button:hover{background:rgba(192,57,43,0.15);}
#lb-fo-rules{padding:8px 10px;border-top:1px solid var(--border);background:var(--bg3);}
#lb-fo-rules .fo-title{font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:1.5px;color:var(--text3);text-transform:uppercase;margin-bottom:5px;}
.fo-rule{display:flex;align-items:center;gap:6px;font-family:var(--font-ui);font-size:var(--fs-chrome);margin-bottom:3px;line-height:1.3;}
.fo-rule .fo-icon{font-size:var(--fs-md);flex-shrink:0;width:14px;text-align:center;}
.fo-rule .fo-text{color:var(--text2);}
.fo-rule.fo-ok .fo-text{color:var(--green2);}
.fo-rule.fo-err .fo-text{color:var(--red2);}
.lb-add-btn:disabled{opacity:0.35;cursor:not-allowed;pointer-events:none;}
.lb-action-btn.play:hover{background:rgba(200,150,60,0.22);}
.lb-action-btn.export{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text2);}
.lb-action-btn.export:hover{border-color:var(--cyan);color:var(--cyan2);}
/* Save / Load modal */
#lb-sl-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:920;align-items:center;justify-content:center;}
#lb-sl-modal.show{display:flex;}
#lb-sl-box{background:var(--bg2);border:1px solid var(--border-hi);border-radius:5px;padding:20px 22px;width:420px;max-width:92vw;max-height:80vh;display:flex;flex-direction:column;}
#lb-sl-box h3{font-family:var(--font-ui);font-size:var(--fs-modal);color:var(--gold);letter-spacing:var(--ls-2);margin-bottom:14px;text-transform:uppercase;}
#lb-sl-name-row{display:flex;gap:8px;margin-bottom:14px;}
#lb-sl-name-row input{flex:1;background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-unit);padding:7px 10px;border-radius:3px;}
#lb-sl-name-row input:focus{outline:none;border-color:var(--gold);}
#lb-sl-save-btn{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:7px 16px;border-radius:3px;cursor:pointer;text-transform:uppercase;background:rgba(200,150,60,0.12);border:1px solid var(--gold);color:var(--gold);white-space:nowrap;}
#lb-sl-save-btn:hover{background:rgba(200,150,60,0.24);}
#lb-sl-save-btn:disabled{opacity:0.3;cursor:not-allowed;}
.lb-sl-section{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;margin-bottom:8px;}
#lb-sl-list{flex:1;overflow-y:auto;min-height:80px;max-height:300px;}
.lb-sl-entry{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--bg3);border:1px solid var(--border);border-radius:3px;margin-bottom:5px;cursor:pointer;transition:border-color 0.1s;}
.lb-sl-entry:hover{border-color:var(--gold);}
.lb-sl-entry-info{flex:1;min-width:0;}
.lb-sl-entry-name{font-family:var(--font-ui);font-size:var(--fs-md);font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-sl-entry-meta{font-family:var(--font-ui);font-size:var(--fs-xs);color:var(--text3);margin-top:2px;}
.lb-sl-load-btn{font-family:var(--font-ui);font-size:var(--fs-chrome);padding:4px 10px;border-radius:2px;cursor:pointer;background:rgba(200,150,60,0.08);border:1px solid var(--gold);color:var(--gold);white-space:nowrap;}
.lb-sl-load-btn:hover{background:rgba(200,150,60,0.2);}
.lb-sl-del-btn{font-family:var(--font-ui);font-size:var(--fs-unit);padding:3px 7px;border-radius:2px;cursor:pointer;background:none;border:1px solid var(--border);color:var(--text3);line-height:1;}
.lb-sl-del-btn:hover{border-color:var(--red2);color:var(--red2);}
.lb-sl-empty{font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text3);text-align:center;padding:20px 0;}
#lb-sl-close{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:7px 16px;border-radius:3px;cursor:pointer;text-transform:uppercase;background:var(--bg3);border:1px solid var(--border-hi);color:var(--text2);margin-top:14px;align-self:flex-end;}
#lb-sl-close:hover{border-color:var(--red2);color:var(--red2);}
#lb-sl-msg{font-family:var(--font-ui);font-size:var(--fs-chrome);min-height:14px;margin-bottom:4px;}
#lb-export-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:900;align-items:center;justify-content:center;}
#lb-export-modal.show{display:flex;}
#lb-export-box{background:var(--bg2);border:1px solid var(--border-hi);border-radius:5px;padding:20px;width:500px;max-width:90vw;max-height:80vh;display:flex;flex-direction:column;}
#lb-export-box h3{font-family:var(--font-ui);font-size:var(--fs-modal);color:var(--gold);letter-spacing:var(--ls-2);margin-bottom:12px;text-transform:uppercase;}
#lb-export-text{flex:1;overflow-y:auto;background:var(--bg3);border:1px solid var(--border);border-radius:3px;padding:10px;font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text);white-space:pre-wrap;line-height:1.6;min-height:200px;max-height:50vh;}
.lb-export-btns{display:flex;gap:8px;margin-top:12px;}
.lb-export-btns button{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:6px 16px;border-radius:3px;cursor:pointer;text-transform:uppercase;}
.lb-copy-btn{background:rgba(200,150,60,0.1);border:1px solid var(--gold);color:var(--gold);}
.lb-copy-btn:hover{background:rgba(200,150,60,0.2);}
.lb-close-exp{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text2);}
.lb-close-exp:hover{border-color:var(--red2);color:var(--red2);}
#lb-factions-hdr{display:none;}
/* Play modal */
#lb-play-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:920;align-items:center;justify-content:center;}
#lb-play-modal.show{display:flex;}
#lb-play-box{background:var(--bg2);border:1px solid var(--gold);border-radius:5px;padding:22px 24px;width:380px;max-width:92vw;}
#lb-play-box h3{font-family:var(--font-ui);font-size:var(--fs-modal);color:var(--gold);letter-spacing:var(--ls-2);margin-bottom:4px;text-transform:uppercase;}
#lb-play-box .lpm-sub{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);margin-bottom:16px;letter-spacing:var(--ls-1);}
.lpm-pts-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.lpm-pts-btn{font-family:var(--font-ui);font-size:var(--fs-unit);padding:7px 14px;border-radius:3px;cursor:pointer;border:1px solid var(--border-hi);background:var(--bg3);color:var(--text2);transition:all 0.12s;letter-spacing:var(--ls-1);}
.lpm-pts-btn:hover{border-color:var(--gold);color:var(--gold);}
.lpm-pts-btn.selected{background:rgba(200,150,60,0.14);border-color:var(--gold);color:var(--gold2);}
.lpm-custom-row{display:flex;align-items:center;gap:10px;margin-bottom:18px;}
.lpm-custom-row span{font-family:var(--font-ui);font-size:var(--fs-md);color:var(--text3);}
.lpm-custom-row input{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-modal);padding:6px 10px;border-radius:3px;width:90px;}
.lpm-custom-row input:focus{outline:none;border-color:var(--gold);}
.lpm-btns{display:flex;gap:8px;justify-content:flex-end;}
.lpm-btns button{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:7px 18px;border-radius:3px;cursor:pointer;text-transform:uppercase;}
.lpm-launch{background:rgba(200,150,60,0.12);border:1px solid var(--gold);color:var(--gold);}
.lpm-launch:hover{background:rgba(200,150,60,0.24);}
.lpm-cancel{background:var(--bg3);border:1px solid var(--border-hi);color:var(--text2);}
.lpm-cancel:hover{border-color:var(--red2);color:var(--red2);}

#radial-backdrop{display:none;position:fixed;inset:0;z-index:90;}
#radial-backdrop.open{display:block;}
#radial-menu{display:none;position:fixed;z-index:91;pointer-events:none;}
#radial-menu.open{display:block;pointer-events:auto;}
#radial-label{position:absolute;transform:translate(-50%,-50%);background:rgba(10,12,16,0.9);border:1px solid var(--border-hi);border-radius:3px;padding:3px 10px;font-family:var(--font-ui);font-size:var(--fs-md);white-space:nowrap;pointer-events:none;color:var(--text);text-align:center;}
.radial-btn{position:absolute;width:62px;height:62px;border-radius:50%;border:2px solid var(--border-hi);background:var(--bg2);color:var(--text2);font-family:var(--font-ui);font-size:var(--fs-xs);font-weight:700;letter-spacing:var(--ls-0);text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transform:translate(-50%,-50%);transition:background 0.1s,border-color 0.1s,transform 0.12s;text-transform:uppercase;line-height:1.2;}
.radial-btn:hover{transform:translate(-50%,-50%) scale(1.13);}
.radial-btn .ri{font-size:20px;line-height:1;}
.radial-btn.adv{border-color:var(--cyan);color:var(--cyan2);}
.radial-btn.adv:hover{background:rgba(22,160,133,0.2);}
.radial-btn.rush{border-color:#8e44ad;color:#bb8fce;}
.radial-btn.rush:hover{background:rgba(142,68,173,0.2);}
.radial-btn.hold{border-color:var(--amber);color:var(--amber2);}
.radial-btn.hold:hover{background:rgba(212,133,10,0.2);}
.radial-btn.chrg{border-color:var(--red);color:var(--red2);}
.radial-btn.chrg:hover{background:rgba(192,57,43,0.2);}
.radial-btn.xbtn{width:40px;height:40px;border-color:var(--border-hi);color:var(--text3);font-size:18px;background:var(--bg3);}
.radial-btn.xbtn:hover{border-color:var(--red2);color:var(--red2);background:rgba(192,57,43,0.15);}
/* Radial card — unit profile shown to the right of the menu */
#radial-card{
  position:absolute;
  /* Anchored to Rush button (angle 0°, right side of ring) */
  /* Rush centre x = RADIAL_RADIUS(88) + half-btn(31) + gap(8) + extra(140) = 267px from menu centre */
  left:267px;
  top:0px;
  transform:translateY(-50%);
  width:240px;
  background:var(--bg2);
  border:1px solid var(--border-hi);
  border-radius:5px;
  padding:10px 12px;
  font-family:var(--font-ui);
  font-size:var(--fs-md);
  pointer-events:none; /* don't intercept clicks */
  animation:rPop 0.2s ease both;
  animation-delay:100ms;
}
#radial-card .rc-name{font-size:var(--fs-modal);font-weight:700;margin-bottom:2px;}
#radial-card .rc-sub{font-size:var(--fs-xs);color:var(--text3);margin-bottom:7px;letter-spacing:var(--ls-0);}
#radial-card .rc-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin-bottom:7px;}
#radial-card .rc-stat{background:var(--bg3);border:1px solid var(--border);padding:2px 3px;text-align:center;border-radius:2px;}
#radial-card .rc-stat .sl{color:var(--text3);font-size:var(--fs-xxs);}
#radial-card .rc-stat .sv{color:var(--gold);font-size:var(--fs-md);}
#radial-card .rc-bar-wrap{margin-bottom:6px;}
#radial-card .rc-bar-lbl{font-size:var(--fs-xs);color:var(--text3);margin-bottom:2px;}
#radial-card .rc-bar{height:3px;background:var(--bg3);border-radius:2px;overflow:hidden;}
#radial-card .rc-bar-fill{height:100%;border-radius:2px;transition:width 0.3s;}
#radial-card .rc-wpn-title{font-size:var(--fs-xs);color:var(--text3);letter-spacing:var(--ls-1);border-bottom:1px solid var(--border);padding-bottom:3px;margin-bottom:5px;text-transform:uppercase;}
#radial-card .rc-wpn{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px;padding-bottom:4px;border-bottom:1px solid rgba(42,48,64,0.5);}
#radial-card .rc-wpn:last-child{border-bottom:none;margin-bottom:0;}
#radial-card .rc-wpn-name{font-size:var(--fs-md);font-weight:700;}
#radial-card .rc-wpn-stats{font-size:var(--fs-xs);color:var(--text2);text-align:right;}
#radial-card .rc-rules{margin-top:6px;border-top:1px solid var(--border);padding-top:5px;font-size:var(--fs-xs);color:var(--purple2);line-height:1.5;}
@keyframes rPop{from{opacity:0;transform:translate(-50%,-50%) scale(0.4);}to{opacity:1;transform:translate(-50%,-50%) scale(1);}}
.radial-btn{animation:rPop 0.2s cubic-bezier(0.34,1.56,0.64,1) both;}
.radial-btn:nth-child(1){animation-delay:0ms;}.radial-btn:nth-child(2){animation-delay:35ms;}.radial-btn:nth-child(3){animation-delay:70ms;}.radial-btn:nth-child(4){animation-delay:105ms;}.radial-btn:nth-child(5){animation-delay:140ms;}
#radial-label{animation:rPop 0.15s ease both;}

/* ===== SPLIT FIRE PANEL ===== */
#split-fire-panel{
  display:none;position:fixed;z-index:160;
  background:var(--bg2);border:1px solid var(--cyan);border-radius:5px;
  padding:10px 13px;font-family:var(--font-ui);font-size:var(--fs-chrome);
  min-width:240px;max-width:310px;
  box-shadow:0 0 24px rgba(0,0,0,0.7);
}
#split-fire-panel.show{display:block;}
#split-fire-panel h3{font-size:var(--fs-md);letter-spacing:1.5px;color:var(--cyan);margin:0 0 6px 0;text-transform:uppercase;}
#split-fire-panel .sf-sub{font-size:var(--fs-xs);color:var(--text3);margin-bottom:8px;line-height:1.4;}
.sf-wpn-row{display:flex;align-items:center;justify-content:space-between;gap:6px;
  border:1px solid var(--border);border-radius:3px;padding:4px 7px;margin-bottom:4px;}
.sf-wpn-name{color:var(--text);flex:1;font-size:var(--fs-chrome);}
.sf-tgt-toggle{display:flex;gap:3px;}
.sf-tgt-btn{
  background:var(--bg3);border:1px solid var(--border-hi);color:var(--text3);
  font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:var(--ls-0);
  padding:2px 7px;cursor:pointer;border-radius:2px;transition:all 0.1s;
}
.sf-tgt-btn.active-a{border-color:var(--cyan);color:var(--cyan);background:rgba(26,188,156,0.15);}
.sf-tgt-btn.active-b{border-color:var(--amber2);color:var(--amber2);background:rgba(230,126,34,0.15);}
#split-fire-tgt-a{font-size:var(--fs-xs);color:var(--cyan);margin-bottom:4px;padding:2px 4px;background:rgba(26,188,156,0.08);border-radius:2px;}
#split-fire-tgt-b{font-size:var(--fs-xs);color:var(--amber2);margin-bottom:8px;padding:2px 4px;background:rgba(230,126,34,0.08);border-radius:2px;display:none;}
#split-fire-prompt{font-size:var(--fs-xs);color:var(--gold);font-style:italic;margin-bottom:7px;}
/* ── Strafing picker panel ── */
#strafe-panel{
  display:none;position:fixed;z-index:160;
  background:var(--bg2);border:1px solid var(--amber2);border-radius:5px;
  padding:10px 13px;font-family:var(--font-ui);font-size:var(--fs-chrome);
  min-width:240px;max-width:320px;
  box-shadow:0 0 24px rgba(0,0,0,0.7);
}
#strafe-panel h3{font-size:var(--fs-md);letter-spacing:1.5px;color:var(--amber2);margin:0 0 5px 0;text-transform:uppercase;}
#strafe-panel .st-sub{font-size:var(--fs-xs);color:var(--text3);margin-bottom:8px;line-height:1.4;}
#strafe-target-list{margin-bottom:8px;}
.st-tgt-btn{
  display:block;width:100%;text-align:left;
  background:var(--bg3);border:1px solid var(--border-hi);color:var(--text);
  font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-0);
  padding:4px 8px;cursor:pointer;border-radius:2px;margin-bottom:3px;transition:all 0.1s;
}
.st-tgt-btn:hover,.st-tgt-btn.st-selected{border-color:var(--amber2);color:var(--amber2);background:rgba(230,126,34,0.15);}
.st-skip-btn{
  display:block;width:100%;text-align:center;
  background:var(--bg3);border:1px solid var(--border);color:var(--text3);
  font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:var(--ls-0);
  padding:3px 8px;cursor:pointer;border-radius:2px;margin-top:4px;transition:all 0.1s;
}
.st-skip-btn:hover{border-color:var(--text2);color:var(--text2);}
.st-fire-btn{
  display:block;width:100%;text-align:center;
  background:rgba(230,126,34,0.2);border:1px solid var(--amber2);color:var(--amber2);
  font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);
  padding:4px 8px;cursor:pointer;border-radius:2px;margin-top:5px;
}
.st-fire-btn:disabled{opacity:0.4;cursor:default;}
.sf-actions{display:flex;gap:5px;}
.sf-btn{flex:1;background:var(--bg3);border:1px solid var(--border-hi);color:var(--text2);
  font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:0.8px;
  padding:4px 0;cursor:pointer;border-radius:3px;text-transform:uppercase;}
.sf-btn.primary{border-color:var(--cyan);color:var(--cyan);}
.sf-btn:hover{border-color:var(--text);color:var(--text);}
.sf-btn.primary:hover{border-color:var(--cyan2);color:var(--cyan2);}

/* ===== SPELL RADIAL ===== */
#spell-radial-backdrop{display:none;position:fixed;inset:0;z-index:190;background:rgba(0,0,0,0.25);}
#spell-radial-backdrop.open{display:block;}
#spell-radial{display:none;position:fixed;z-index:200;pointer-events:none;}
#spell-radial.open{display:block;}
.sp-btn{
  position:absolute;
  width:64px;height:64px;
  transform:translate(-50%,-50%);
  border-radius:6px;
  border:1.5px solid #7d3c98;
  background:rgba(20,5,35,0.92);
  color:var(--purple2);
  font-family:var(--font-ui);
  font-size:var(--fs-xs);letter-spacing:0.3px;
  cursor:pointer;pointer-events:all;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:2px;padding:4px;
  transition:border-color 0.12s,background 0.12s,transform 0.12s;
  animation:spPop 0.22s cubic-bezier(0.34,1.56,0.64,1) both;
}
.sp-btn:hover{border-color:#bb8fce;background:rgba(88,28,135,0.55);transform:translate(-50%,-50%) scale(1.12);}
.sp-btn.unaffordable{border-color:#4a235a;color:#6c3483;cursor:not-allowed;opacity:0.5;}
.sp-btn.unaffordable:hover{transform:translate(-50%,-50%) scale(1);background:rgba(20,5,35,0.92);}
.sp-btn .sp-name{font-size:7.5px;line-height:1.2;font-weight:700;}
.sp-btn .sp-cost{font-size:var(--fs-chrome);color:var(--gold);font-weight:700;margin-top:1px;}
.sp-btn .sp-type{font-size:6px;letter-spacing:var(--ls-0);text-transform:uppercase;opacity:0.7;margin-top:1px;}
#sp-cancel{
  position:absolute;
  width:38px;height:38px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  border:1.5px solid var(--border-hi);
  background:var(--bg3);
  color:var(--text3);
  font-family:var(--font-ui);
  font-size:16px;
  cursor:pointer;pointer-events:all;
  display:flex;align-items:center;justify-content:center;
  transition:border-color 0.12s,color 0.12s;
  animation:rPop 0.15s ease both;
  z-index:5;
}
#sp-cancel:hover{border-color:var(--red2);color:var(--red2);}
#sp-header{
  display:none;
  position:fixed;
  z-index:200;
  background:rgba(20,5,35,0.92);
  border:1px solid #7d3c98;
  border-radius:4px;
  padding:5px 10px;
  font-family:var(--font-ui);
  font-size:8.5px;
  color:var(--purple2);
  white-space:nowrap;
  pointer-events:all;
  text-align:center;
  transform:translateX(-50%);
  animation:rPop 0.15s ease both;
}
#sp-header.open{display:block;}
#sp-header .sp-hdr-name{font-size:var(--fs-md);font-weight:700;color:#d7bde2;margin-bottom:2px;}
#sp-header .sp-hdr-tok{color:var(--gold);}
#sp-boost-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:6px;pointer-events:all;}
#sp-boost-label{font-size:var(--fs-md);color:#d7bde2;font-weight:700;min-width:76px;text-align:center;letter-spacing:var(--ls-0);}
#sp-boost-dec,#sp-boost-inc{width:22px;height:22px;border-radius:3px;border:1.5px solid #7d3c98;background:rgba(88,28,135,0.55);color:#e8b4f8;font-size:15px;line-height:1;cursor:pointer;font-family:var(--font-ui);display:flex;align-items:center;justify-content:center;transition:border-color 0.1s,background 0.1s;padding:0;}
#sp-boost-dec:hover:not(:disabled),#sp-boost-inc:hover:not(:disabled){border-color:#bb8fce;background:rgba(130,50,180,0.75);}
#sp-boost-dec:disabled,#sp-boost-inc:disabled{opacity:0.25;cursor:not-allowed;}
#sp-tooltip{
  position:absolute;
  pointer-events:none;
  width:210px;
  background:rgba(20,5,35,0.96);
  border:1px solid #9b59b6;
  border-radius:5px;
  padding:9px 11px;
  font-family:var(--font-ui);
  font-size:var(--fs-chrome);
  color:var(--text2);
  line-height:1.45;
  z-index:10;
  animation:rPop 0.15s ease both;
  display:none;
}
#sp-tooltip.visible{display:block;}
#sp-tooltip .sp-tt-name{font-size:var(--fs-unit);font-weight:700;color:#d7bde2;margin-bottom:3px;}
#sp-tooltip .sp-tt-row{display:flex;gap:8px;margin-bottom:4px;font-size:var(--fs-xs);flex-wrap:wrap;}
#sp-tooltip .sp-tt-badge{background:rgba(88,28,135,0.45);border:1px solid #7d3c98;border-radius:3px;padding:1px 5px;color:var(--purple2);text-transform:uppercase;letter-spacing:var(--ls-0);}
#sp-tooltip .sp-tt-badge.dmg{border-color:#c0392b;color:#e74c3c;background:rgba(120,20,20,0.3);}
#sp-tooltip .sp-tt-badge.buff{border-color:#27ae60;color:#2ecc71;background:rgba(20,80,40,0.3);}
#sp-tooltip .sp-tt-badge.debuff{border-color:#d35400;color:#e67e22;background:rgba(100,40,0,0.3);}
#sp-tooltip .sp-tt-badge.move{border-color:#2980b9;color:#3498db;background:rgba(20,50,100,0.3);}
#sp-tooltip .sp-tt-desc{color:var(--text);line-height:1.5;margin-top:4px;}
@keyframes spPop{from{opacity:0;transform:translate(-50%,-50%) scale(0.3);}to{opacity:1;transform:translate(-50%,-50%) scale(1);}}
.sp-btn:nth-child(1){animation-delay:0ms;}.sp-btn:nth-child(2){animation-delay:30ms;}.sp-btn:nth-child(3){animation-delay:60ms;}.sp-btn:nth-child(4){animation-delay:90ms;}.sp-btn:nth-child(5){animation-delay:120ms;}.sp-btn:nth-child(6){animation-delay:150ms;}
/* Spell target highlight on canvas */
.sp-target-chosen{outline:2px solid #bb8fce;}

/* ── MAP EDITOR ─────────────────────────────────────────────── */
#map-editor{position:fixed;inset:0;background:var(--bg);z-index:800;display:none;flex-direction:column;}
#map-editor.me-show{display:flex;}
#me-toolbar{display:flex;align-items:center;gap:6px;padding:5px 10px;background:var(--bg2);border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;}
#me-toolbar-title{font-family:var(--font-ui);font-size:var(--fs-unit);letter-spacing:var(--ls-2);color:var(--gold);text-transform:uppercase;margin-right:6px;}
.me-toolbar-label{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);color:var(--text3);white-space:nowrap;margin-left:2px;}
.me-sep{width:1px;height:20px;background:var(--border);margin:0 2px;flex-shrink:0;}
.me-btn{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);text-transform:uppercase;padding:4px 9px;border-radius:3px;cursor:pointer;border:1px solid var(--border);background:var(--bg3);color:var(--text2);transition:all 0.1s;}
.me-btn:hover{border-color:var(--border-hi);color:var(--text);}
.me-btn.me-active{background:rgba(200,150,60,0.12);border-color:var(--gold);color:var(--gold2);}
.me-btn.me-planet{font-size:var(--fs-chrome);padding:3px 8px;}
.me-btn.me-planet.me-active{border-color:var(--cyan2);color:var(--cyan2);background:rgba(22,160,133,0.1);}
.me-btn.me-use{background:rgba(26,122,58,0.15);border-color:var(--green2);color:var(--green2);}
.me-btn.me-use:hover{background:rgba(26,122,58,0.28);}
.me-btn.me-danger{border-color:var(--red);color:var(--red2);}
.me-btn.me-danger:hover{background:rgba(192,57,43,0.15);}
.me-deploy-sel{font-family:var(--font-ui);font-size:var(--fs-chrome);background:var(--bg3);border:1px solid var(--border);color:var(--text2);padding:4px 6px;border-radius:3px;cursor:pointer;}
#me-body{flex:1;display:flex;overflow:hidden;}
#me-sidebar{width:200px;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0;}
#me-sidebar-head{background:var(--bg3);border-bottom:1px solid var(--border);padding:5px 8px;font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;flex-shrink:0;}
#me-terrain-list{flex:1;overflow-y:auto;padding:4px;}
.me-terrain-cat{font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;padding:6px 7px 3px;border-top:1px solid var(--border);margin-top:2px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none;}
.me-terrain-cat:hover{color:var(--text2);}
.me-terrain-cat.me-terrain-cat-first{border-top:none;margin-top:0;padding-top:4px;}
.me-terrain-cat-arrow{font-style:normal;opacity:0.7;flex-shrink:0;margin-left:4px;}
.me-terrain-item{padding:5px 7px;border:1px solid var(--border);border-radius:3px;margin-bottom:3px;cursor:pointer;transition:all 0.1s;display:flex;align-items:center;gap:6px;}
.me-ti-content{flex:1;min-width:0;}
.me-ti-preview{width:44px;height:44px;flex-shrink:0;background:rgba(255,255,255,0.05);border-radius:2px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.me-ti-preview img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
.me-terrain-item:hover{border-color:var(--border-hi);background:var(--bg3);}
.me-terrain-item.me-selected{border-color:var(--gold);background:rgba(200,150,60,0.08);}
.me-ti-name{font-size:var(--fs-md);font-weight:600;color:var(--text);margin-bottom:2px;}
.me-ti-types{display:flex;flex-wrap:wrap;gap:2px;}
.me-ti-type{font-size:var(--fs-xxs);font-family:var(--font-ui);padding:1px 3px;border-radius:2px;border:1px solid var(--border);color:var(--text3);}
.me-ti-type.cover{color:#27ae60;border-color:#1a6b3a;}
.me-ti-type.blocking{color:#c0392b;border-color:#7b241c;}
.me-ti-type.difficult{color:#2980b9;border-color:#1a5276;}
.me-ti-type.dangerous{color:#e67e22;border-color:#9c4f0a;}
.me-ti-type.impassable{color:#8e44ad;border-color:#5b2c6f;}
.me-ti-type.elevated,.me-ti-type.steep{color:var(--text3);border-color:var(--border);}
.me-ti-type.dense,.me-ti-type.treacherous{color:var(--amber2);border-color:var(--amber);}
#me-size-row{padding:6px 8px;border-top:1px solid var(--border);display:flex;align-items:center;gap:5px;flex-shrink:0;flex-wrap:wrap;}
#me-size-row label{font-family:var(--font-ui);font-size:var(--fs-xs);color:var(--text3);display:flex;align-items:center;gap:3px;}
#me-size-row input[type=number]{width:38px;background:var(--bg3);border:1px solid var(--border);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:2px 4px;border-radius:2px;text-align:center;}
#me-size-row input[type=number]:disabled{opacity:0.3;cursor:not-allowed;}
#me-scale-row{display:flex;gap:3px;width:100%;margin-top:4px;}
#me-scale-row .me-btn{flex:1;text-align:center;padding:3px 4px;font-size:var(--fs-xs);}
#me-transform-row{display:none;gap:3px;width:100%;margin-top:3px;}
#me-transform-row.me-tr-show{display:flex;}
#me-transform-row .me-btn{flex:1;text-align:center;padding:3px 4px;font-size:var(--fs-xs);}
.me-btn:disabled{opacity:0.3;cursor:not-allowed;pointer-events:none;}
#me-canvas-area{flex:1;overflow:hidden;position:relative;background:#050709;cursor:crosshair;}
#me-canvas-area.me-cursor-delete{cursor:not-allowed;}
#me-canvas-area.me-cursor-obj{cursor:cell;}
#me-canvas-area.me-cursor-pan{cursor:grab;}
#me-canvas-area.me-cursor-panning{cursor:grabbing;}
#me-canvas-area.me-cursor-scale{cursor:nwse-resize;}
#me-canvas-area.me-cursor-select{cursor:grab;}
#me-canvas{display:block;width:100%;height:100%;}
#me-statusbar{height:22px;background:var(--bg2);border-top:1px solid var(--border);display:flex;align-items:center;gap:18px;padding:0 12px;font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);flex-shrink:0;}
#me-status-warn{color:var(--amber2);}
#me-obj-count{font-size:var(--fs-xs);display:flex;gap:6px;padding:4px 8px;border-top:1px solid var(--border);flex-shrink:0;}
#me-obj-cfg{display:none;align-items:center;gap:5px;padding:4px 8px;border-top:1px solid var(--border);flex-shrink:0;flex-wrap:wrap;}
.me-obj-cfg-label{font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:var(--ls-1);color:var(--text3);white-space:nowrap;}
.me-obj-cfg-input{width:42px;background:var(--bg3);border:1px solid var(--border);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-chrome);padding:2px 4px;border-radius:2px;text-align:center;}
.me-obj-cfg-input:disabled{opacity:0.3;cursor:not-allowed;}
.me-obj-chip{padding:2px 5px;border-radius:2px;border:1px solid var(--border);font-family:var(--font-ui);font-size:var(--fs-xs);color:var(--text3);cursor:pointer;}
.me-obj-chip.placed{color:var(--gold2);border-color:var(--gold);}
.me-obj-chip.selected{background:rgba(200,150,60,0.15);border-color:var(--gold2);color:var(--gold2);}
#me-saved-banner{display:none;position:absolute;top:10px;left:50%;transform:translateX(-50%);background:rgba(26,122,58,0.85);border:1px solid var(--green2);color:var(--green2);font-family:var(--font-ui);font-size:var(--fs-md);padding:5px 16px;border-radius:3px;pointer-events:none;z-index:10;}
#me-save-modal{display:none;position:absolute;inset:0;background:rgba(5,7,9,0.82);z-index:20;align-items:center;justify-content:center;}
#me-save-modal.me-show{display:flex;}
.me-save-modal-box{background:var(--bg2);border:1px solid var(--border-hi);border-radius:5px;padding:18px 20px;min-width:300px;max-width:380px;width:90%;}
.me-save-modal-title{font-family:var(--font-ui);font-size:var(--fs-unit);letter-spacing:var(--ls-2);color:var(--gold);text-transform:uppercase;margin-bottom:12px;}
.me-save-name-row{display:flex;gap:6px;margin-bottom:10px;align-items:center;}
.me-save-name-row label{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);letter-spacing:var(--ls-1);white-space:nowrap;}
#me-save-name-input{flex:1;background:var(--bg3);border:1px solid var(--border);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-md);padding:4px 7px;border-radius:3px;outline:none;}
#me-save-name-input:focus{border-color:var(--gold);}
.me-save-list{max-height:180px;overflow-y:auto;margin-bottom:10px;display:flex;flex-direction:column;gap:3px;}
.me-save-row{display:flex;align-items:center;gap:5px;padding:5px 7px;border:1px solid var(--border);border-radius:3px;background:var(--bg3);cursor:pointer;transition:all 0.1s;}
.me-save-row:hover{border-color:var(--border-hi);background:var(--bg);}
.me-save-row-name{flex:1;font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text);}
.me-save-row-del{font-size:var(--fs-xs);color:var(--red2);background:none;border:none;cursor:pointer;font-family:var(--font-ui);padding:1px 4px;border-radius:2px;flex-shrink:0;}
.me-save-row-del:hover{background:rgba(192,57,43,0.18);}
.me-save-modal-btns{display:flex;gap:6px;justify-content:flex-end;}
.me-save-empty{font-family:var(--font-ui);font-size:var(--fs-chrome);color:var(--text3);text-align:center;padding:12px;}
#me-log-panel{width:230px;background:var(--bg2);border-left:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;}
#me-log-panel.me-log-hidden{width:auto;}
#me-log-panel.me-log-hidden #me-log-entries,#me-log-panel.me-log-hidden #me-log-head-label,#me-log-panel.me-log-hidden #me-log-copy,#me-log-panel.me-log-hidden #me-log-clear{display:none;}
#me-log-head{background:var(--bg3);border-bottom:1px solid var(--border);padding:4px 8px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
#me-log-head-label{font-family:var(--font-ui);font-size:var(--fs-xs);letter-spacing:1.5px;color:var(--text3);text-transform:uppercase;}
#me-log-clear,#me-log-copy,#me-log-hide{font-size:var(--fs-xs);cursor:pointer;color:var(--text3);background:none;border:1px solid var(--border);border-radius:2px;padding:1px 6px;font-family:var(--font-ui);letter-spacing:var(--ls-0);}
#me-log-clear:hover,#me-log-copy:hover,#me-log-hide:hover{color:var(--text);border-color:var(--border-hi);}
#me-log-copy.me-log-copied{color:#27ae60;border-color:#27ae60;}
#me-log-entries{flex:1;overflow-y:auto;padding:4px;display:flex;flex-direction:column;gap:1px;}
.me-log-entry{padding:2px 4px;border-bottom:1px solid rgba(255,255,255,0.03);font-family:var(--font-ui);font-size:var(--fs-xs);color:var(--text3);line-height:1.45;word-break:break-all;}
.me-log-entry.me-log-ok{color:#27ae60;}
.me-log-entry.me-log-warn{color:var(--amber2);}
.me-log-entry.me-log-err{color:#e74c3c;}
.me-log-entry.me-log-info{color:var(--text2);}
.me-log-ts{color:var(--text3);margin-right:5px;font-size:var(--fs-xxs);opacity:0.7;}

/* Programmatic modal utility classes — used by hud.js showXxxModal() functions */
.m-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.87);z-index:860;display:flex;align-items:center;justify-content:center;}
.m-box{background:var(--bg2);border:1px solid var(--border-hi);border-radius:4px;padding:22px 26px;min-width:300px;max-width:500px;font-family:var(--font-ui);}
.m-box-sm{max-width:420px;min-width:280px;}
.m-title{font-size:var(--fs-unit);letter-spacing:var(--ls-2);color:var(--amber);margin-bottom:5px;}
.m-sub{font-size:var(--fs-md);color:var(--text3);margin-bottom:14px;}
.m-msg{font-size:var(--fs-unit);color:var(--text);margin-bottom:18px;line-height:1.5;}
.m-grid{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;}
.m-row{display:flex;gap:10px;}
.m-item-btn{padding:8px 12px;font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);border:1px solid var(--border);background:var(--bg3);color:var(--text);cursor:pointer;border-radius:3px;text-align:left;width:100%;transition:border-color 0.1s;}
.m-item-btn:hover{border-color:var(--border-hi);}
.m-confirm-btn{width:100%;padding:9px;font-family:var(--font-ui);font-size:var(--fs-unit);letter-spacing:var(--ls-2);border:1px solid var(--green);background:rgba(40,120,80,0.12);color:var(--green2);cursor:pointer;border-radius:3px;}
.m-skip-btn{width:100%;padding:7px;font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);border:1px solid var(--border);background:transparent;color:var(--text3);cursor:pointer;border-radius:3px;}
.trload-box{max-width:520px;min-width:360px;}
.trload-section{border:1px solid var(--border);border-radius:4px;padding:10px 12px;margin-bottom:10px;}
.trload-header{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-ui);font-size:var(--fs-unit);letter-spacing:var(--ls-1);margin-bottom:6px;}
.trload-cap{font-size:var(--fs-md);color:var(--text2);}
.trload-cap.trload-over{color:#e05555;}
.trload-passenger,.trload-candidate{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-top:1px solid var(--border);}
.trload-spaces{color:var(--text3);font-size:0.85em;}
.trload-remove-btn{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:3px 10px;border:1px solid #e05555;background:transparent;color:#e05555;cursor:pointer;border-radius:3px;}
.trload-avail-header{font-size:var(--fs-md);color:var(--text3);margin:8px 0 4px;}
.trload-load-btn{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:3px 10px;border:1px solid var(--green2,#4dbf78);background:transparent;color:var(--green2,#4dbf78);cursor:pointer;border-radius:3px;}
.trload-none{color:var(--text3);font-size:var(--fs-md);font-style:italic;padding:4px 0;}
.tdtip{position:fixed;z-index:10000;pointer-events:none;display:none;background:var(--bg2);border:1px solid var(--border-hi);border-radius:4px;padding:8px 10px;font-family:var(--font-ui);font-size:var(--fs-md);min-width:160px;max-width:260px;line-height:1.45;}
.tdtip-name{font-size:var(--fs-unit);letter-spacing:var(--ls-1);margin-bottom:2px;}
.tdtip-hero{color:var(--amber);}
.tdtip-hp{color:var(--amber);font-size:0.9em;margin-bottom:2px;}
.tdtip-sep{border-top:1px solid var(--border);margin:5px 0;}
.tdtip-wpn{font-size:0.9em;margin-bottom:2px;}
.tdtip-wpn-name{color:var(--text);}
.tdtip-wpn-rules{color:var(--text3);}
.tdtip-rules{font-size:0.9em;color:var(--text3);font-style:italic;}
.fm-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px;}
.fm-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 8px;border:1px solid var(--border);background:var(--bg3);color:var(--text);cursor:pointer;border-radius:4px;transition:border-color 0.1s,background 0.1s;}
.fm-card:hover{border-color:var(--gold);background:rgba(200,150,60,0.08);}
.fm-preview{height:66px;display:flex;align-items:center;justify-content:center;}
.fm-svg circle{fill:rgba(60,160,235,0.55);stroke:rgba(120,200,255,0.9);stroke-width:1;}
.fm-label{font-size:var(--fs-md);letter-spacing:var(--ls-2);color:var(--gold2);text-transform:uppercase;}
.fm-desc{font-size:var(--fs-xs);color:var(--text3);text-align:center;line-height:1.3;}
.m-yes-btn{flex:1;padding:8px;font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);border:1px solid var(--amber);background:rgba(200,150,60,0.12);color:var(--amber);cursor:pointer;border-radius:3px;}
.m-no-btn{flex:1;padding:8px;font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);border:1px solid var(--border);background:transparent;color:var(--text3);cursor:pointer;border-radius:3px;}
.m-toast{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-1);padding:6px 14px;border-radius:3px;margin-top:4px;}

/* Options modal tabs */
.opts-tab{background:var(--bg3);border:1px solid var(--border);color:var(--text2);font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-1);padding:4px 14px;cursor:pointer;border-radius:2px;transition:all 0.1s;}
.opts-tab.opts-tab-active{background:rgba(200,150,60,0.12);border-color:var(--gold);color:var(--gold);}
/* Options modal — section heads, theme buttons, misc */
.opts-section-head{font-family:var(--font-ui);font-size:var(--fs-xxs);letter-spacing:var(--ls-2);color:var(--text3);text-transform:uppercase;margin:14px 0 7px;padding-bottom:4px;border-bottom:1px solid var(--border);}
.opts-section-head:first-child{margin-top:2px;}
.opts-theme-btn{background:var(--bg3);border:1px solid var(--border);color:var(--text2);font-family:var(--font-ui);font-size:var(--fs-xxs);letter-spacing:var(--ls-1);padding:4px 10px;cursor:pointer;border-radius:2px;transition:all 0.1s;}
.opts-theme-btn:hover{border-color:var(--gold);color:var(--gold);}
.opts-auto-hint{font-size:var(--fs-xxs);color:var(--text3);margin-left:2px;}
.opts-pct-lbl{font-size:var(--fs-xxs);color:var(--text3);width:28px;text-align:right;flex-shrink:0;}

/* ---- Tutorial panel ---- */
#tutorial-panel{position:fixed;left:16px;bottom:16px;width:340px;max-width:92vw;background:var(--bg2);border:1px solid var(--gold);border-radius:6px;padding:14px 16px;z-index:160;box-shadow:0 4px 20px rgba(0,0,0,0.6);}
.tut-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.tut-round{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--gold);text-transform:uppercase;border:1px solid var(--gold);border-radius:3px;padding:2px 8px;}
.tut-exit-btn{font-family:var(--font-ui);font-size:var(--fs-xxs);letter-spacing:var(--ls-1);color:var(--text3);background:transparent;border:1px solid var(--border);border-radius:3px;padding:3px 8px;cursor:pointer;transition:all 0.1s;}
.tut-exit-btn:hover{color:var(--red2);border-color:var(--red2);}
.tut-title{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-2);color:var(--gold2);text-transform:uppercase;margin-bottom:6px;}
.tut-body{font-size:var(--fs-unit);color:var(--text);line-height:1.5;margin-bottom:10px;}
.tut-footer{display:flex;justify-content:flex-end;}
.tut-next-btn{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-2);text-transform:uppercase;padding:7px 22px;border-radius:3px;cursor:pointer;background:rgba(200,150,60,0.12);border:1px solid var(--gold);color:var(--gold);transition:all 0.15s;}
.tut-next-btn:hover{background:rgba(200,150,60,0.22);}

/* Tutorial highlight — pulsing glow on the sidebar action button the step expects */
.ab.tutorial-highlight{border-color:var(--gold2);animation:tutPulse 1.2s ease-in-out infinite;}
@keyframes tutPulse{
  0%,100%{box-shadow:0 0 4px 1px rgba(255,210,60,0.35);}
  50%{box-shadow:0 0 14px 4px rgba(255,210,60,0.85);}
}

/* Tutorial highlight — pulsing glow on a squad's sidebar card */
.sq-card.tut-card-highlight{border-radius:4px;animation:tutPulse 1.2s ease-in-out infinite;}

/* ---- List Builder tutorial panel ---- */
#lbtut-panel{position:fixed;left:16px;bottom:16px;width:340px;max-width:92vw;background:var(--bg2);border:1px solid var(--gold);border-radius:6px;padding:14px 16px;z-index:900;box-shadow:0 4px 20px rgba(0,0,0,0.6);}
.lbtut-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.lbtut-badge{font-family:var(--font-ui);font-size:var(--fs-chrome);letter-spacing:var(--ls-2);color:var(--gold);text-transform:uppercase;border:1px solid var(--gold);border-radius:3px;padding:2px 8px;}
.lbtut-exit-btn{font-family:var(--font-ui);font-size:var(--fs-xxs);letter-spacing:var(--ls-1);color:var(--text3);background:transparent;border:1px solid var(--border);border-radius:3px;padding:3px 8px;cursor:pointer;transition:all 0.1s;}
.lbtut-exit-btn:hover{color:var(--red2);border-color:var(--red2);}
.lbtut-title{font-family:var(--font-ui);font-size:var(--fs-modal);letter-spacing:var(--ls-2);color:var(--gold2);text-transform:uppercase;margin-bottom:6px;}
.lbtut-body{font-size:var(--fs-unit);color:var(--text);line-height:1.5;margin-bottom:10px;}
.lbtut-footer{display:flex;justify-content:flex-end;}
.lbtut-next-btn{font-family:var(--font-ui);font-size:var(--fs-md);letter-spacing:var(--ls-2);text-transform:uppercase;padding:7px 22px;border-radius:3px;cursor:pointer;background:rgba(200,150,60,0.12);border:1px solid var(--gold);color:var(--gold);transition:all 0.15s;}
.lbtut-next-btn:hover{background:rgba(200,150,60,0.22);}

/* Generic pulsing highlight for any list-builder element a tutorial step targets */
.lbtut-highlight{border-radius:4px;animation:tutPulse 1.2s ease-in-out infinite;}