/* QTC Swap Desk — trading-desk / mission-control identity.
 * Deep navy-black, amber ticker accents, cyan data readouts. */
:root{
  --bg:#060a12;
  --panel:#0b1220;
  --panel2:#0e1626;
  --line:#1c2a44;
  --ink:#eef3fb;
  --dim:#9db0cc;
  --amber:#ffc357;
  --amber-dim:#8a6a2f;
  --cyan:#57e6ff;
  --green:#4ade80;
  --red:#ff6b6b;
  --radius:14px;
}
html{background:var(--bg);}
body{
  color:var(--ink);
  background:
    radial-gradient(1100px 500px at 15% -5%, rgba(255,195,87,.07), transparent 60%),
    radial-gradient(900px 500px at 90% 0%, rgba(87,230,255,.06), transparent 60%),
    var(--bg);
}
#sigrain{position:fixed;inset:0;pointer-events:none;opacity:.5;z-index:0;}
main{position:relative;z-index:1;}

/* hero */
.hero{position:relative;overflow:hidden;padding:56px 24px 40px;max-width:1180px;margin:0 auto;}
.sweep{position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(90deg, transparent 0 118px, rgba(255,195,87,.045) 118px 120px);}
.eyebrow{color:var(--amber);letter-spacing:.18em;text-transform:uppercase;font-size:12px;font-weight:700;}
.hero h1{font-size:clamp(38px,6vw,64px);margin:.35em 0 .3em;letter-spacing:-.01em;}
.hero h1 .hl{color:var(--amber);text-shadow:0 0 26px rgba(255,195,87,.35);}
.lede{max-width:72ch;color:var(--dim);font-size:17px;line-height:1.65;}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:28px 0 8px;}
.fact{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);
  border-radius:var(--radius);padding:14px 16px;display:flex;flex-direction:column;gap:4px;}
.fact .k{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);}
.fact .v{font-size:24px;font-weight:800;color:var(--cyan);}
.fact .s{font-size:12px;color:var(--dim);}
.hero-note{color:var(--dim);font-size:13px;margin-top:10px;}

/* cards */
.card{max-width:1180px;margin:22px auto;padding:26px;background:linear-gradient(180deg,rgba(14,22,38,.92),rgba(11,18,32,.92));
  border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.35);}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:6px;flex-wrap:wrap;}
.card h2{font-size:24px;margin:0;letter-spacing:-.01em;}
.card-lede{color:var(--dim);line-height:1.65;max-width:80ch;}
.card-tools{display:flex;align-items:center;gap:12px;}
.auto{font-size:12px;color:var(--dim);}
.btn{background:var(--amber);color:#1a1206;border:0;border-radius:10px;padding:9px 16px;font-weight:800;cursor:pointer;}
.btn:hover{filter:brightness(1.08);}
.btn:disabled{opacity:.55;cursor:wait;}
.badge{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:4px 10px;}
.b-estimate{background:rgba(255,195,87,.14);color:var(--amber);border:1px solid var(--amber-dim);}
code{background:#0a1220;border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:.86em;color:var(--cyan);}

/* watch */
.watch-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;margin-top:14px;}
@media(max-width:860px){.watch-grid{grid-template-columns:1fr;}}
.status-pill{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:20px;
  border-radius:999px;padding:10px 20px;border:1px solid var(--line);background:#0a1322;}
.status-pill .dot{width:12px;height:12px;border-radius:50%;background:#8a93a5;}
.status-pill.unlisted{border-color:rgba(255,107,107,.5);}
.status-pill.unlisted .dot{background:var(--red);box-shadow:0 0 12px var(--red);animation:pulse 2s infinite;}
.status-pill.listed{border-color:rgba(74,222,128,.5);}
.status-pill.listed .dot{background:var(--green);box-shadow:0 0 12px var(--green);}
.status-pill.unknown .dot{background:var(--amber);box-shadow:0 0 12px var(--amber);}
@keyframes pulse{50%{opacity:.4;}}
.status-sub{color:var(--dim);line-height:1.6;max-width:60ch;}
.watch-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:16px;}
.watch-meta>div{background:#0a1322;border:1px solid var(--line);border-radius:10px;padding:10px 12px;
  display:flex;flex-direction:column;gap:4px;font-size:13px;}
.watch-meta .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);}
.watch-side h3{margin:0 0 8px;font-size:15px;color:var(--amber);}
.ticks{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:8px;color:var(--dim);font-size:14px;line-height:1.55;}
.ticks li{padding-left:22px;position:relative;}
.ticks li::before{content:"▸";position:absolute;left:4px;color:var(--amber);}
.fine{font-size:12.5px;color:var(--dim);line-height:1.6;}

/* steps */
.dir-toggle{display:flex;gap:10px;margin:14px 0 6px;flex-wrap:wrap;}
.dir-toggle button,.slip-row button{background:#0a1322;color:var(--dim);border:1px solid var(--line);
  border-radius:10px;padding:9px 16px;font-weight:700;cursor:pointer;font-size:14px;}
.dir-toggle button.on,.slip-row button.on{background:rgba(255,195,87,.14);color:var(--amber);border-color:var(--amber-dim);}
.steps{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;counter-reset:st;}
.steps li{display:flex;gap:14px;background:#0a1322;border:1px solid var(--line);border-radius:12px;padding:14px 16px;}
.steps .n{flex:0 0 30px;height:30px;border-radius:50%;background:rgba(255,195,87,.14);color:var(--amber);
  font-weight:800;display:flex;align-items:center;justify-content:center;border:1px solid var(--amber-dim);}
.steps strong{color:var(--ink);}
.steps p{margin:6px 0 0;color:var(--dim);font-size:14px;line-height:1.6;}
.honest{margin-top:16px;background:rgba(87,230,255,.06);border:1px solid rgba(87,230,255,.25);
  border-radius:12px;padding:14px 16px;color:var(--dim);font-size:14px;line-height:1.6;}
.honest strong{color:var(--cyan);}

/* fee lab */
.lab-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:14px;}
@media(max-width:860px){.lab-grid{grid-template-columns:minmax(0,1fr)}.lab-grid>*{min-width:0}}
.lab-inputs{display:flex;flex-direction:column;gap:14px;}
.lab-inputs label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--dim);font-weight:600;}
.lab-inputs select,.lab-inputs input{background:#0a1322;border:1px solid var(--line);color:var(--ink);
  border-radius:10px;padding:10px 12px;font-size:15px;}
.slip{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:0;}
.slip legend{font-size:12px;color:var(--dim);padding:0 6px;}
.slip-row{display:flex;gap:8px;flex-wrap:wrap;}
.lab-out{background:#0a1322;border:1px solid var(--line);border-radius:12px;padding:18px;}
.ro-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed #1c2a44;font-size:14px;}
.ro-row:last-of-type{border-bottom:0;}
.rk{color:var(--dim);}
.rv{font-weight:700;text-align:right;}
.rv.hl2{color:var(--cyan);font-size:18px;}
.ro-total .rv{color:var(--amber);}
.ro-math{margin-top:12px;font-family:ui-monospace,monospace;font-size:12px;color:var(--dim);
  background:#080e18;border:1px solid var(--line);border-radius:8px;padding:10px 12px;overflow-x:auto;white-space:nowrap;}

/* states */
.states{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0;}
.state{background:#0a1322;color:var(--dim);border:1px solid var(--line);border-radius:999px;
  padding:8px 16px;font-size:12.5px;font-weight:700;letter-spacing:.04em;cursor:pointer;}
.state.on{background:rgba(87,230,255,.12);color:var(--cyan);border-color:rgba(87,230,255,.4);}
.state-detail{background:#0a1322;border:1px solid var(--line);border-radius:12px;padding:16px 18px;min-height:96px;}
.state-detail h3{margin:0 0 8px;color:var(--cyan);font-size:16px;letter-spacing:.04em;}
.state-detail p{margin:6px 0;color:var(--dim);font-size:14px;line-height:1.6;}
.state-detail strong{color:var(--ink);}

/* safety */
.safe-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin-top:14px;}
.safe{background:#0a1322;border:1px solid var(--line);border-radius:12px;padding:16px 18px;}
.safe h3{margin:0 0 8px;font-size:15px;color:var(--amber);}
.safe p{margin:0;color:var(--dim);font-size:13.5px;line-height:1.65;}

/* timeline */
.timeline{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:0;}
.timeline li{display:flex;gap:18px;padding:16px 4px;border-left:2px solid var(--line);padding-left:22px;position:relative;}
.timeline li::before{content:"";position:absolute;left:-7px;top:22px;width:12px;height:12px;border-radius:50%;
  background:var(--amber);box-shadow:0 0 10px rgba(255,195,87,.6);}
.timeline .t-date{flex:0 0 130px;font-weight:800;color:var(--cyan);font-size:13px;padding-top:2px;}
.timeline strong{color:var(--ink);}
.timeline p{margin:6px 0;color:var(--dim);font-size:14px;line-height:1.6;max-width:70ch;}
.timeline a.src{font-size:13px;color:var(--amber);}

/* meanwhile */
.mean-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:14px;}
.mean{display:flex;gap:12px;background:#0a1322;border:1px solid var(--line);border-radius:12px;
  padding:16px;text-decoration:none;color:var(--dim);font-size:14px;line-height:1.55;}
.mean:hover{border-color:var(--amber-dim);}
.mean .mi{font-size:22px;}
.mean strong{color:var(--ink);}

/* sources */
.source-list{list-style:none;margin:12px 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.source-list li{background:#0a1322;border:1px solid var(--line);border-radius:10px;padding:12px 16px;}
.source-list a{color:var(--cyan);font-weight:700;text-decoration:none;font-size:14px;}
.source-list span{display:block;color:var(--dim);font-size:13px;margin-top:4px;line-height:1.55;}

footer{max-width:1180px;margin:34px auto 40px;padding:22px 24px 0;border-top:1px solid var(--line);
  color:var(--dim);font-size:13px;line-height:2;}
footer a{color:var(--cyan);}
.addr{background:#0a1322;border:1px solid var(--line);color:var(--amber);border-radius:8px;
  padding:3px 10px;font-family:ui-monospace,monospace;font-size:12px;cursor:pointer;}
.skip-link{position:absolute;left:-9999px;}
.skip-link:focus{left:12px;top:12px;z-index:99;background:var(--amber);color:#111;padding:8px 14px;border-radius:8px;}
.qmb-menu a.current{background:rgba(255,195,87,.1);}

/* a11y 2026-10-01: explicit link color (was browser-default #0000ee, fails on dark bg) */
a,a:visited{color:#57e6ff}