/* ===================== APOLLO LOADER (scoped) ===================== */
.apw .ds-back{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;
  color:var(--txm);background:transparent;border:1px solid var(--bdr);border-radius:var(--r-sm);
  padding:7px 13px;cursor:pointer;margin-bottom:var(--sp4);transition:all .15s}
.apw .ds-back:hover{border-color:var(--accent);color:var(--accent)}
/* --- Page header ---------------------------------------------------------- */
.apw .ap-hd{margin-bottom:var(--sp5)}
.apw .ap-hd h2{font-size:19px;font-weight:650;letter-spacing:-.02em;margin-bottom:5px}
.apw .ap-hd p{font-size:12.5px;color:var(--txm);line-height:1.55;max-width:76ch}
.apw .ap-main{display:grid;grid-template-columns:390px 1fr;gap:var(--sp4);align-items:start}
@media(max-width:1000px){.apw .ap-main{grid-template-columns:1fr}}
/* Both columns were inline flex styles repeated in the markup. */
.apw .ap-col{display:flex;flex-direction:column;gap:var(--sp3)}
.apw .panel{background:var(--card);border:1px solid var(--bdr);border-radius:var(--r-md);
  overflow:hidden;box-shadow:var(--shadow)}
.apw .panel-hd{padding:var(--sp3) var(--sp4);border-bottom:1px solid var(--bdr);display:flex;
  align-items:center;gap:var(--sp2)}
.apw .panel-hd .title{font-size:13.5px;font-weight:550}
.apw .panel-hd .badge{font-size:11.5px;color:var(--txd);font-weight:400;margin-left:auto}
.apw .panel-body{padding:var(--sp4)}
.apw .tech-fixed{display:flex;flex-wrap:wrap;gap:6px;padding:var(--sp2) var(--sp3);
  background:var(--ibg);border:1px solid var(--bdr);border-radius:var(--r-sm)}
.apw .tech-tag{font-family:'JetBrains Mono',monospace;font-size:11.5px;padding:3px 8px;border-radius:5px;
  background:color-mix(in srgb,var(--blue) 12%,transparent);color:var(--blue);
  border:1px solid color-mix(in srgb,var(--blue) 24%,transparent)}
.apw .field{margin-bottom:var(--sp4)}
.apw .field:last-child{margin-bottom:0}
.apw .field label{display:block;font-size:11px;letter-spacing:.07em;text-transform:uppercase;
  color:var(--txd);margin-bottom:6px;font-weight:600}
/* A label is uppercase with wide tracking; the notes inside one are not. The
   plan badge was inheriting both and wrapping to two shouting lines. */
.apw .field label span{text-transform:none;letter-spacing:0;font-weight:400;color:var(--txm)}

.apw .field input,.apw .field select{width:100%;background:var(--ibg);color:var(--tx);
  border:1px solid var(--bdr);border-radius:var(--r-sm);font-size:13px;padding:8px 11px;outline:none}
.apw .field input:focus,.apw .field select:focus{border-color:var(--accent);box-shadow:var(--ring)}
.apw .field .hint{color:var(--txd);font-size:11.5px;margin-top:5px;line-height:1.5}

/* --- Employee range ------------------------------------------------------
   These are option TILES, not a checkbox list. The native box is hidden and
   the whole tile is the hit target, so the label and its control cannot drift
   to opposite ends of the row the way an unstyled checkbox does. */
.apw .emp-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.apw .emp-opt{display:flex;align-items:center;gap:8px;padding:8px 10px;cursor:pointer;
  background:var(--ibg);border:1px solid var(--bdr);border-radius:var(--r-sm);
  font-size:12.5px;color:var(--txm);user-select:none;transition:all .15s;
  font-variant-numeric:tabular-nums}
.apw .emp-opt:hover{border-color:var(--bdr-str);color:var(--tx)}
/* pointer-events:none is load-bearing. The tile's click handler flips the box
   itself, so a click landing ON the box toggled it twice and appeared dead. */
.apw .emp-opt input{appearance:none;-webkit-appearance:none;flex:none;width:15px;height:15px;
  margin:0;border:1.5px solid var(--bdr-str);border-radius:4px;background:var(--bg);
  pointer-events:none;position:relative;transition:all .15s}
.apw .emp-opt input:checked{background:var(--accent);border-color:var(--accent)}
/* Drawn rather than a glyph: a text tick inherits the body font and sits off
   centre at this size. */
.apw .emp-opt input:checked::after{content:'';position:absolute;left:4.5px;top:1.5px;
  width:4px;height:8px;border:solid #04121a;border-width:0 2px 2px 0;transform:rotate(45deg)}
.apw .emp-opt.checked{border-color:color-mix(in srgb,var(--accent) 40%,transparent);
  background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--tx)}
@media(max-width:520px){.apw .emp-grid{grid-template-columns:1fr}}

/* --- Buttons -------------------------------------------------------------
   The markup here says `btn primary` / `btn sim` where the rest of the app
   says `btn-p` / `btn-a`. Mapped rather than renamed, so this file stays the
   one place the Apollo screen differs. */
.apw .btn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:var(--sp4)}
.apw .btn{padding:8px 14px;border-radius:var(--r-sm);border:1px solid var(--bdr);cursor:pointer;
  font-size:12.5px;font-weight:600;background:transparent;color:var(--txm);transition:all .15s;
  display:inline-flex;align-items:center;gap:6px}
.apw .btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:var(--card-h)}
.apw .btn:disabled{opacity:.45;cursor:not-allowed}
.apw .btn.primary{background:linear-gradient(135deg,var(--accent-h),var(--brand-2));
  color:#04121a;border:none;font-weight:600}
.apw .btn.primary:hover:not(:disabled){background:linear-gradient(135deg,var(--accent-h),var(--brand-2));
  filter:brightness(1.08);color:#04121a}
.apw .btn.sim{background:color-mix(in srgb,var(--amber) 12%,transparent);color:var(--amber);
  border-color:color-mix(in srgb,var(--amber) 30%,transparent)}
.apw .btn.sim:hover:not(:disabled){border-color:var(--amber);color:var(--amber);
  background:color-mix(in srgb,var(--amber) 18%,transparent)}

/* --- The run's figures ---------------------------------------------------
   Read across, not down. Three now, not four: the fourth was "Page", meaning
   which page of Apollo's API the fetch had reached, printed at the same size
   as the number of companies added. */
.apw .stat-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.apw .stat-cell{padding:var(--sp3) var(--sp4);border-right:1px solid var(--bdr);min-width:0}
.apw .stat-cell:last-child{border-right:none}
.apw .stat-cell .k{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  color:var(--txd);margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.apw .stat-cell .v{font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1.1;
  font-variant-numeric:tabular-nums}
@media(max-width:620px){
  .apw .stat-grid{grid-template-columns:1fr}
  .apw .stat-cell{border-right:none;border-bottom:1px solid var(--bdr)}
  .apw .stat-cell:last-child{border-bottom:none}
}
/* A section inside a panel, for the parts of one run. These used to be
   separate bordered cards — "Latest run", then "What happened to the rest",
   then "Companies added", stacked down the page as though they were three
   unrelated things. They are one run described three ways, and a rule with a
   label says so where a card border denied it. */
.apw .ap-sec{display:flex;align-items:center;gap:var(--sp2);
  padding:9px var(--sp4);border-top:1px solid var(--bdr);background:var(--bg-alt);
  font-size:12px;font-weight:600;color:var(--tx)}
.apw .ap-sec-n{margin-left:auto;font-weight:400;font-size:11.5px;color:var(--txd)}
.apw .ap-sec-a{font-size:11.5px;color:var(--accent);text-decoration:none;font-weight:600}
.apw .ap-sec-a:hover{text-decoration:underline}
/* The count sits right of the title and the link right of everything, so the
   link takes the auto margin when both are present. */
.apw .ap-sec .ap-sec-n + .ap-sec-a{margin-left:var(--sp3)}
.apw .ap-sec-body{padding:8px var(--sp4) 12px}
.apw .ap-err{padding:10px var(--sp4);border-top:1px solid var(--bdr);
  color:var(--red);font-size:12.5px;white-space:pre-wrap;line-height:1.5}
/* The smaller half of "10 of 78 Apollo had" — one figure, two weights. */
.apw .stat-cell .v .sub{font-size:12px;font-weight:400;color:var(--txd);
  letter-spacing:0}
.apw .prog-top{display:flex;justify-content:space-between;font-size:11.5px;
  color:var(--txd);margin-bottom:5px}
.apw .prog-wrap{padding:var(--sp3) var(--sp4);border-top:1px solid var(--bdr)}
.apw .prog-bar{height:5px;background:var(--ibg);border-radius:20px;overflow:hidden;
  border:1px solid var(--bdr)}
.apw .prog-fill{height:100%;background:linear-gradient(90deg,var(--brand-2),var(--accent));
  border-radius:20px;transition:width .4s cubic-bezier(.2,.8,.2,1)}
.apw .job-footer{display:flex;align-items:center;gap:var(--sp2);padding:10px var(--sp4);
  border-top:1px solid var(--bdr);font-size:12px;color:var(--txd);flex-wrap:wrap}
/* The uuid is long and must not push the Cancel button off the panel. */
.apw .job-footer .mono{color:var(--txm);word-break:break-all}

/* --- Status pills --------------------------------------------------------- */
.apw .pill.s-completed{background:color-mix(in srgb,var(--green) 14%,transparent);
  color:var(--green);border-color:color-mix(in srgb,var(--green) 32%,transparent)}
.apw .pill.s-running{background:color-mix(in srgb,var(--amber) 14%,transparent);
  color:var(--amber);border-color:color-mix(in srgb,var(--amber) 32%,transparent);
  animation:pulse 1.8s ease-in-out infinite}
.apw .pill.s-failed{background:color-mix(in srgb,var(--red) 14%,transparent);
  color:var(--red);border-color:color-mix(in srgb,var(--red) 32%,transparent)}
.apw .pill.s-cancelled,.apw .pill.s-queued{background:var(--ibg);color:var(--txd);
  border-color:var(--bdr)}

/* --- What a run actually asked for ---------------------------------------
   The form on the left is what is typed now; a run is what was typed then.
   These chips print the second, under the figures for that run. */
.apw .ap-ran{display:flex;flex-wrap:wrap;gap:5px;padding:10px var(--sp4);
  border-top:1px solid var(--bdr)}
.apw .ap-chip{display:inline-flex;align-items:baseline;gap:5px;font-size:11.5px;
  padding:3px 8px;border-radius:5px;background:var(--ibg);border:1px solid var(--bdr);
  color:var(--tx);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.apw .ap-chip i{font-style:normal;color:var(--txd);font-size:10.5px;
  text-transform:uppercase;letter-spacing:.06em;flex:none}
.apw .ap-ran-n{font-size:11.5px;color:var(--txd)}

/* --- The free check -------------------------------------------------------
   THIS HAD NO STYLES AT ALL. The markup used .sim-panel / .sh / .sim-grid /
   .sk / .sv / .ss and none of them existed in this file, so the panel drew as
   unstyled divs — and .sv matched a rule in the bars stylesheet that is 80px
   wide and grey, which is why the headline number came out looking like a
   caption. Scoped here, where the rest of this screen lives. */
.apw .sim-panel{margin-top:var(--sp3);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);
  border-radius:var(--r-md);background:color-mix(in srgb,var(--accent) 6%,transparent);
  overflow:hidden}
.apw .sim-panel .sh{padding:10px var(--sp3);font-size:13px;color:var(--tx);
  border-bottom:1px solid color-mix(in srgb,var(--accent) 20%,transparent)}
.apw .sim-panel .sh b{font-weight:700;font-variant-numeric:tabular-nums}
.apw .sim-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.apw .sim-cell{padding:10px var(--sp3);border-right:1px solid
  color-mix(in srgb,var(--accent) 16%,transparent);min-width:0}
.apw .sim-cell:last-child{border-right:none}
/* WRAPS RATHER THAN CLIPS. These sit in a 390px column split three ways, so
   a nowrap label with an ellipsis rendered "WOULD BE AD…" — a heading you
   cannot read is worse than one on two lines. */
.apw .sim-cell .sk{font-size:10.5px;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:var(--txd);margin-bottom:4px;line-height:1.35}
/* Scoped width:auto on purpose: .sv is an 80px grey label in 11-bars.css and
   that rule wins on specificity unless this one is at least as specific. */
.apw .sim-cell .sv{width:auto;text-align:left;font-size:17px;font-weight:700;
  letter-spacing:-.02em;line-height:1.2;color:var(--tx);
  font-variant-numeric:tabular-nums}
.apw .sim-cell .ss{font-size:11px;color:var(--txd);margin-top:3px;line-height:1.4}
.apw .sim-note{padding:9px var(--sp3);font-size:11.5px;color:var(--txm);
  line-height:1.5;border-top:1px solid color-mix(in srgb,var(--accent) 16%,transparent)}
@media(max-width:560px){.apw .sim-grid{grid-template-columns:1fr}
  .apw .sim-cell{border-right:none;border-bottom:1px solid
    color-mix(in srgb,var(--accent) 16%,transparent)}
  .apw .sim-cell:last-child{border-bottom:none}}

/* --- Presets -------------------------------------------------------------- */
.apw .tier-list{display:flex;flex-direction:column;gap:6px}
.apw .tier{padding:9px 11px;border:1px solid var(--bdr);border-radius:var(--r-sm);
  background:var(--ibg);cursor:pointer;transition:all .15s}
.apw .tier:hover{border-color:var(--bdr-str);background:var(--card-h)}
.apw .tier.active{border-color:color-mix(in srgb,var(--accent) 45%,transparent);
  background:color-mix(in srgb,var(--accent) 8%,transparent)}
.apw .tier .t-label{font-size:12.5px;font-weight:600;color:var(--tx);margin-bottom:2px}
.apw .tier.active .t-label{color:var(--accent)}
.apw .tier .t-desc{font-size:11.5px;color:var(--txd);line-height:1.45}

/* --- Tables --------------------------------------------------------------- */
.apw .panel table{width:100%;border-collapse:collapse}
.apw .panel th{text-align:left;font-size:10.5px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--txd);padding:9px var(--sp4);
  border-bottom:1px solid var(--bdr);white-space:nowrap;background:var(--bg-alt)}
.apw .panel td{padding:9px var(--sp4);font-size:12.5px;border-bottom:1px solid var(--bdr);
  color:var(--txm)}
.apw .panel tbody tr:last-child td{border-bottom:none}
.apw .panel tbody tr{transition:background .12s}
.apw .panel tbody tr:hover{background:var(--card-h)}
.apw .panel tbody tr.sel{background:color-mix(in srgb,var(--accent) 7%,transparent)}
.apw .panel td.mono,.apw .panel th[style*="right"]+td{font-variant-numeric:tabular-nums}
.apw .empty{padding:var(--sp5) var(--sp4);text-align:center;color:var(--txd);font-size:12.5px}

/* --- Toast ---------------------------------------------------------------- */
.apw .toast{position:fixed;bottom:24px;right:24px;z-index:1100;padding:10px 16px;
  border-radius:var(--r-sm);background:var(--card);border:1px solid var(--bdr);
  box-shadow:var(--shadow-lg);font-size:12.5px;font-weight:500;color:var(--tx);
  opacity:0;transform:translateY(8px);pointer-events:none;transition:all .22s cubic-bezier(.2,.8,.2,1)}
.apw .toast.show{opacity:1;transform:none}
.apw .toast.err{border-color:color-mix(in srgb,var(--red) 45%,transparent);color:var(--red)}

@media(max-width:880px){
  .hd{height:auto;padding:var(--sp3) var(--sp4);flex-wrap:wrap;position:static}
  .navbar{position:static;padding:0 var(--sp4)}
  .cnt{padding:0 var(--sp4) var(--sp6)}
  thead th{position:static}
  .phd-t{font-size:19px}
  .strow .stl{width:132px}
  .wsw-menu{min-width:280px}
}