/* =====================================================================
   ACHILLES — "Night Desk" terminal theme
   Amber = the machine (phosphor heritage). Teal = up. Rose = down.
   Signature: telemetry glow — live state glows, static state doesn't.
   Dark is the default; [data-theme="light"] is the day desk.
   ===================================================================== */

:root{
  --bg:#070B14;
  --bg-grad-a:#0B1322;
  --bg-grad-b:#070B14;
  --panel:#0D1420;
  --panel-2:#121B2C;
  --panel-3:#182339;
  --text:#E6EDF8;
  --text-2:#AFBDD4;
  --muted:#5E7191;
  --faint:#3A4A66;
  --border:rgba(148,178,255,.10);
  --border-strong:rgba(148,178,255,.22);

  --amber:#FFB454;            /* the machine */
  --amber-soft:rgba(255,180,84,.13);
  --green:#2CE0B0;            /* market up  */
  --green-soft:rgba(44,224,176,.12);
  --red:#FF5D7E;              /* market down */
  --red-soft:rgba(255,93,126,.12);
  --blue:#6FA8FF;             /* neutral info */
  --blue-soft:rgba(111,168,255,.12);

  --accent:var(--amber);
  --accent-2:#FFD08A;
  --accent-soft:var(--amber-soft);
  --accent-ring:rgba(255,180,84,.30);

  --sans:'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono','SF Mono',Consolas,monospace;

  --r-sm:6px; --r:9px; --r-lg:13px; --r-xl:18px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.45);
  --shadow:0 4px 18px rgba(0,0,0,.40);
  --shadow-lg:0 14px 44px rgba(0,0,0,.55);
  --glow-up:0 0 14px rgba(44,224,176,.45);
  --glow-down:0 0 14px rgba(255,93,126,.45);
  --glow-sys:0 0 12px rgba(255,180,84,.50);
}

[data-theme="light"]{
  --bg:#F4F6FB;
  --bg-grad-a:#FFFFFF;
  --bg-grad-b:#EDF1F8;
  --panel:#FFFFFF;
  --panel-2:#F3F6FB;
  --panel-3:#E9EEF7;
  --text:#141B28;
  --text-2:#3C4A61;
  --muted:#69788F;
  --faint:#A6B2C6;
  --border:rgba(20,32,58,.10);
  --border-strong:rgba(20,32,58,.22);
  --amber:#B96F12;
  --amber-soft:rgba(185,111,18,.10);
  --green:#0B9F7C;
  --green-soft:rgba(11,159,124,.10);
  --red:#D63E63;
  --red-soft:rgba(214,62,99,.10);
  --blue:#3565C9;
  --blue-soft:rgba(53,101,201,.10);
  --accent:var(--amber);
  --accent-2:#8F5610;
  --accent-soft:var(--amber-soft);
  --accent-ring:rgba(185,111,18,.28);
  --shadow-sm:0 1px 2px rgba(23,34,56,.08);
  --shadow:0 4px 16px rgba(23,34,56,.09);
  --shadow-lg:0 14px 40px rgba(23,34,56,.14);
  --glow-up:none; --glow-down:none; --glow-sys:none;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--sans);
  font-size:14px;
  letter-spacing:.01em;
  color:var(--text);
  background:
    radial-gradient(1100px 500px at 75% -10%, var(--bg-grad-a), transparent 60%),
    radial-gradient(900px 600px at -10% 110%, var(--bg-grad-a), transparent 55%),
    var(--bg-grad-b);
  background-attachment:fixed;
  min-height:100vh;
}

/* ---------- header: the console rail ---------- */
header{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;gap:14px;
  padding:13px 26px;
  background:color-mix(in srgb, var(--panel) 84%, transparent);
  backdrop-filter:blur(14px) saturate(1.2);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid var(--border);
}
.brand{
  font-weight:700;font-size:16.5px;letter-spacing:.02em;
}
.brand small{
  display:block;color:var(--muted);font-weight:500;font-size:11px;
  letter-spacing:.06em;margin-top:2px;
}
.spacer{flex:1}

.badge{
  font-family:var(--mono);font-size:10.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;
  padding:5px 11px;border-radius:999px;
  border:1px solid var(--border-strong);
}
.badge.simulation{color:var(--blue);background:var(--blue-soft);border-color:transparent}
.badge.paper{color:var(--amber);background:var(--amber-soft);border-color:transparent}
.badge.live{color:var(--red);background:var(--red-soft);border-color:transparent;box-shadow:var(--glow-down)}

.conn{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12.5px}
.dot{width:9px;height:9px;border-radius:50%;background:var(--faint);flex:0 0 auto}
.dot.on{background:var(--green);box-shadow:var(--glow-up);animation:pulse 2.2s ease-in-out infinite}
.dot.off{background:var(--faint)}
@keyframes pulse{
  0%,100%{opacity:1}
  50%{opacity:.45}
}

.toggle{
  font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:.10em;
  padding:10px 22px;border-radius:var(--r);border:1px solid transparent;cursor:pointer;
  transition:transform .12s ease, box-shadow .2s ease, filter .2s ease;
}
.toggle:active{transform:translateY(1px)}
.toggle.start{background:var(--accent);color:#14100A;box-shadow:var(--glow-sys)}
.toggle.start:hover{filter:brightness(1.08)}
.toggle.stop{background:var(--red-soft);color:var(--red);border-color:var(--red)}
.toggle.stop:hover{background:var(--red);color:#fff}

.icon-btn{
  background:transparent;border:1px solid var(--border);color:var(--muted);
  width:34px;height:34px;border-radius:var(--r-sm);cursor:pointer;font-size:15px;
  transition:color .15s, border-color .15s;
}
.icon-btn:hover{color:var(--text);border-color:var(--border-strong)}

/* ---------- nav: sector tabs ---------- */
nav{
  display:flex;gap:2px;flex-wrap:wrap;
  padding:10px 26px 0;
  border-bottom:1px solid var(--border);
  background:color-mix(in srgb, var(--panel) 55%, transparent);
}
nav button{
  appearance:none;background:transparent;border:none;cursor:pointer;
  font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.03em;
  color:var(--muted);
  padding:10px 15px 13px;
  border-bottom:2px solid transparent;
  transition:color .15s ease;
  position:relative;top:1px;
}
nav button:hover{color:var(--text-2)}
nav button.active{color:var(--accent);border-bottom-color:var(--accent);text-shadow:var(--glow-sys)}

main{padding:24px 26px 70px;max-width:1480px;margin:0 auto}

/* ---------- status line: the heads-up strip ---------- */
.statusline{
  font-family:var(--mono);font-size:13px;
  background:linear-gradient(180deg, var(--panel-2), var(--panel));
  border:1px solid var(--border);border-radius:var(--r-lg);
  padding:14px 20px;margin-bottom:20px;
  box-shadow:var(--shadow);
  color:var(--text-2);
  overflow-x:auto;white-space:nowrap;
}
.statusline b{color:var(--text);font-weight:600}

/* ---------- warnboxes: annunciator panel ---------- */
.warnbox{
  border-radius:var(--r-lg);padding:14px 18px;margin-bottom:18px;
  font-size:13.5px;line-height:1.55;
  border:1px solid;
  display:flow-root;
}
.warnbox.danger{background:var(--red-soft);border-color:var(--red);color:var(--text)}
.warnbox.danger b{color:var(--red)}
.warnbox.caution{background:var(--amber-soft);border-color:var(--amber);color:var(--text)}
.warnbox.caution b{color:var(--amber)}
.warnbox.info{background:var(--blue-soft);border-color:transparent;color:var(--text-2)}

/* ---------- market bar: the tape ---------- */
.marketbar{
  display:flex;gap:30px;flex-wrap:wrap;align-items:center;
  background:var(--panel);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:15px 22px;margin-bottom:22px;box-shadow:var(--shadow);
}
.marketbar span{
  color:var(--muted);display:block;
  font-size:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:600;
  margin-bottom:3px;
}
.marketbar b{
  color:var(--text);font-family:var(--mono);font-size:16px;font-weight:600;
  font-variant-numeric:tabular-nums;
}

/* ---------- metric cards: instruments ---------- */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:12px;margin-bottom:24px}
.metric{
  background:linear-gradient(180deg, var(--panel-2), var(--panel));
  border:1px solid var(--border);border-radius:var(--r-lg);
  padding:15px 17px;box-shadow:var(--shadow-sm);
  transition:border-color .2s ease, transform .15s ease;
}
.metric:hover{border-color:var(--border-strong);transform:translateY(-1px)}
.metric .label{
  color:var(--muted);font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:.14em;
  display:flex;align-items:center;gap:6px;
}
.metric .label::before{
  content:"";width:5px;height:5px;border-radius:1px;background:var(--faint);
}
.metric .value{
  font-family:var(--mono);font-size:21px;font-weight:600;margin-top:7px;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;
}
.metric .sub{color:var(--muted);font-size:11.5px;margin-top:4px}
.metric .value.pos{color:var(--green);text-shadow:var(--glow-up)}
.metric .value.neg{color:var(--red);text-shadow:var(--glow-down)}

.green{color:var(--green)}
.red{color:var(--red)}
.amber{color:var(--amber)}
.blue{color:var(--blue)}
.pos{color:var(--green)}
.neg{color:var(--red)}

/* ---------- section headers: instrument labels ---------- */
h2.section{
  font-size:11px;color:var(--muted);
  text-transform:uppercase;letter-spacing:.18em;font-weight:700;
  margin:26px 0 12px;
  display:flex;align-items:center;gap:9px;
}
h2.section::before{
  content:"";width:14px;height:2px;background:var(--accent);border-radius:2px;
  box-shadow:var(--glow-sys);
}

/* ---------- tables: the blotter ---------- */
.tablebar{display:flex;align-items:center;gap:6px;font-size:13px}
.tablebar select{
  background:var(--panel-2);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:7px 11px;color:var(--text);font-size:12.5px;font-family:var(--sans);
  cursor:pointer;
}
.tablebar select:focus{outline:2px solid var(--accent-ring);outline-offset:1px}

.tablewrap{
  background:var(--panel);border:1px solid var(--border);border-radius:var(--r-lg);
  overflow:auto;box-shadow:var(--shadow);
}
table{width:100%;border-collapse:collapse;font-size:13px}
th{
  background:var(--panel-3);
  padding:10px 14px;text-align:left;
  color:var(--muted);font-size:10px;font-weight:700;
  text-transform:uppercase;letter-spacing:.12em;
  position:sticky;top:0;z-index:2;
  border-bottom:1px solid var(--border-strong);
  white-space:nowrap;
}
td{
  padding:10px 14px;border-bottom:1px solid var(--border);
  color:var(--text-2);vertical-align:top;
  font-variant-numeric:tabular-nums;
}
td:first-child{font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap}
tbody tr{transition:background .12s ease}
tbody tr:hover{background:var(--panel-2)}
tbody tr:last-child td{border-bottom:none}
.empty{color:var(--faint);padding:26px;text-align:center;font-size:13px}

/* status chips in tables */
.status-filled{color:var(--green);font-weight:600}
.status-paper{color:var(--green);font-weight:600}
.status-sim{color:var(--blue);font-weight:600}
.status-closed{color:var(--blue)}
.status-aborted{color:var(--red);font-weight:600}
.status-warn{color:var(--amber);font-weight:600}

/* ---------- buttons ---------- */
.btn{
  font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.02em;
  padding:9px 18px;border-radius:var(--r);cursor:pointer;
  border:1px solid transparent;
  transition:transform .12s ease, filter .15s ease, background .15s ease, color .15s ease;
  text-decoration:none;display:inline-block;
}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--accent);color:#14100A;box-shadow:var(--glow-sys)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--text-2);border-color:var(--border-strong)}
.btn.ghost:hover{color:var(--text);border-color:var(--accent);background:var(--accent-soft)}
.btn.danger{background:var(--red-soft);color:var(--red);border-color:var(--red)}
.btn.danger:hover{background:var(--red);color:#fff}
.btn:focus-visible,.toggle:focus-visible,nav button:focus-visible,.icon-btn:focus-visible{
  outline:2px solid var(--accent-ring);outline-offset:2px;
}

/* ---------- config form ---------- */
.cfg-group{
  background:var(--panel);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:20px 22px;margin-bottom:18px;box-shadow:var(--shadow-sm);
}
.cfg-group h3{
  margin:0 0 14px;font-size:11px;color:var(--amber);
  text-transform:uppercase;letter-spacing:.16em;font-weight:700;
}
.field{display:flex;align-items:center;gap:12px;margin-bottom:11px;flex-wrap:wrap}
.field label{flex:0 0 260px;color:var(--text-2);font-size:13px}
.field input[type=text],.field input[type=number],.field input[type=time],.field select{
  background:var(--panel-2);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:8px 12px;color:var(--text);font-size:13px;font-family:var(--mono);
  min-width:130px;
}
.field input:focus,.field select:focus{outline:2px solid var(--accent-ring);outline-offset:1px;border-color:var(--accent)}
.field .help{color:var(--muted);font-size:11.5px;flex-basis:100%;margin-left:272px;margin-top:-5px}
.cfg-actions{display:flex;gap:12px;align-items:center;margin-top:18px}
.savemsg{color:var(--green);font-size:13px;font-family:var(--mono)}
.err{color:var(--red)}

input[type=checkbox]{accent-color:var(--accent);width:15px;height:15px}

/* ---------- log lines: terminal output ---------- */
#logBox,#dbLogs{
  font-family:var(--mono);font-size:12.3px;
  padding:6px 0;
}
.logline{
  display:flex;gap:12px;align-items:baseline;
  padding:6px 16px;
  border-bottom:1px solid var(--border);
  line-height:1.55;
}
.logline:hover{background:var(--panel-2)}
.logline .ts{color:var(--faint);flex:0 0 auto;font-size:11.3px}
.lvl{
  flex:0 0 62px;text-align:center;
  font-size:9.5px;font-weight:700;letter-spacing:.10em;
  padding:2.5px 0;border-radius:4px;
}
.lvl.INFO{color:var(--blue);background:var(--blue-soft)}
.lvl.WARN{color:var(--amber);background:var(--amber-soft)}
.lvl.ERROR,.lvl.CRITICAL{color:var(--red);background:var(--red-soft);box-shadow:var(--glow-down)}
.lvl.ALERT{color:var(--green);background:var(--green-soft)}

/* ---------- misc ---------- */
.hidden{display:none!important}
.how{color:var(--muted);font-size:12.5px;line-height:1.6}
.label{color:var(--muted)}
.value{color:var(--text)}
.info{color:var(--blue)}
.warn{color:var(--amber)}

a{color:var(--blue)}
a:hover{color:var(--accent)}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:6px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--faint)}

::selection{background:var(--accent-soft);color:var(--text)}

@media (max-width:760px){
  header{padding:11px 14px;gap:9px;flex-wrap:wrap}
  nav{padding:6px 14px 0}
  main{padding:16px 14px 60px}
  .field label{flex-basis:100%}
  .field .help{margin-left:0}
  .brand small{display:none}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ---------- metric edge stripes (state at a glance) ---------- */
.metric{position:relative;overflow:hidden}
.metric::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:transparent;border-radius:3px 0 0 3px;
}
.metric.pos::before{background:var(--green);box-shadow:var(--glow-up)}
.metric.neg::before{background:var(--red);box-shadow:var(--glow-down)}
.metric.warn::before{background:var(--amber);box-shadow:var(--glow-sys)}

/* ---------- explainer tooltips ---------- */
.tip{cursor:help;border-bottom:1px dotted var(--faint)}
.tip:hover{color:var(--text)}
.tip.open{color:var(--accent)}
.tip-pop{
  position:fixed;z-index:200;max-width:330px;
  background:var(--panel-2);color:var(--text);
  border:1px solid var(--border-strong);border-radius:var(--r);
  box-shadow:var(--shadow-lg);padding:14px 16px;
  font-family:var(--sans);font-size:13px;line-height:1.55;
  text-transform:none;letter-spacing:normal;font-weight:400;
  backdrop-filter:blur(10px);
}
.tip-pop h4{
  margin:0 0 7px;font-size:13.5px;font-weight:700;color:var(--accent);
  text-transform:none;letter-spacing:normal;
}
.tip-pop .how{
  margin-top:9px;padding-top:9px;border-top:1px solid var(--border);
  color:var(--muted);font-size:12px;
}
.tip-pop .how b{color:var(--text-2);font-weight:600}
.tip-pop code{
  font-family:var(--mono);font-size:11.5px;background:var(--panel-3);
  padding:1.5px 6px;border-radius:4px;
}

/* ---------- login: the airlock ---------- */
.login-body{
  display:flex;align-items:center;justify-content:center;min-height:100vh;
}
.login-card{
  background:linear-gradient(180deg, var(--panel-2), var(--panel));
  border:1px solid var(--border-strong);border-radius:var(--r-xl);
  box-shadow:var(--shadow-lg);
  padding:38px 40px;width:min(380px, 92vw);
  display:flex;flex-direction:column;gap:14px;
}
.login-card h1{
  margin:0;font-size:19px;font-weight:700;letter-spacing:.02em;
  display:flex;align-items:center;gap:10px;
}
.login-card h1::before{
  content:"";width:9px;height:9px;border-radius:50%;
  background:var(--accent);box-shadow:var(--glow-sys);
}
.login-card .sub{color:var(--muted);font-size:12.5px;margin-top:-6px}
.login-card input[type=password]{
  background:var(--bg);border:1px solid var(--border-strong);border-radius:var(--r);
  padding:12px 14px;color:var(--text);font-size:14px;font-family:var(--mono);
}
.login-card input[type=password]:focus{outline:2px solid var(--accent-ring);border-color:var(--accent)}
.login-card button{
  background:var(--accent);color:#14100A;font-weight:700;letter-spacing:.08em;
  border:none;border-radius:var(--r);padding:12px;cursor:pointer;font-size:13.5px;
  font-family:var(--sans);box-shadow:var(--glow-sys);
  transition:filter .15s ease;
}
.login-card button:hover{filter:brightness(1.08)}
.login-card .err{color:var(--red);font-size:12.5px;min-height:16px}

/* ---------- remaining coverage ---------- */
.mono{font-family:var(--mono)}
.savemsg.err{color:var(--red)}
.field input[type=file]{color:var(--text-2);font-size:12.5px}
.field input[type=checkbox]{margin:0}
.field:first-of-type{margin-top:2px}
.toggle:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.warnbox b{font-weight:700}
.warnbox.info b{color:var(--blue)}
.warnbox.accent{background:var(--accent-soft);border-color:var(--accent);color:var(--text)}
.warnbox.accent b{color:var(--accent)}
.warnbox button{margin-top:8px}

/* SPX Strategic Engine merge-era addition + config jump-nav (added for
   config-tab reorg: gateway-to-top, botwise categories, jump links) */
.cfg-jump-link{color:var(--accent);text-decoration:none;font-size:.9em;white-space:nowrap;line-height:1.8}
.cfg-jump-link:hover{text-decoration:underline}

/* ===== Brain Trust tab (2026-08-29) ===== */
.bt-badge{display:inline-block;padding:1px 7px;border-radius:9px;font-size:.68em;font-weight:700;vertical-align:middle;margin-left:4px}
.bt-on{background:#1d4a1d;color:#8fe08f}.bt-off{background:#4a1d1d;color:#e08f8f}
.bt-run{background:#1d3a4a;color:#8fc8e0}.bt-stop{background:#4a3a1d;color:#e0c88f}
.bt-struct{background:#333;color:#bbb}.bt-warn{background:#4a421d;color:#e0d68f}
.bt-flow{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.82em;line-height:1.55;white-space:pre-wrap;background:var(--panel,#111);border:1px solid var(--border,#333);border-radius:8px;padding:14px 16px;overflow-x:auto}
details.bt-panel{margin-bottom:14px;border:1px solid var(--border,#333);border-radius:8px}
details.bt-panel>summary{cursor:pointer;padding:10px 14px;font-weight:700;list-style:none}
details.bt-panel>summary::before{content:'▸ '}details.bt-panel[open]>summary::before{content:'▾ '}
details.bt-panel>div{padding:0 14px 14px}