/* The Ledger — Dark Board ("The Hooded Market").
 *
 * The underworld floor: near-black, red-identified, scanned like a CRT. Every
 * selector is scoped under #panel-darkboard so the rest of the app is untouched.
 * Theme vars (--panel, --border, --mono, --sans, …) supply structure; the red
 * danger tokens below are local to this panel. */

#panel-darkboard {
  --db-bg: #0a0608;
  --db-panel: #120a0d;
  --db-panel-2: #1a1014;
  --db-border: #2c1620;
  --db-red: #ff5c7a;
  --db-red-bright: #ff8fa3;
  --db-red-hot: #ff2e4d;
  --db-glow: rgba(255, 92, 122, 0.35);
  --db-muted: #7d6872;
  --db-text: #e6d8dc;

  position: relative;
  background:
    repeating-linear-gradient(0deg, rgba(255, 92, 122, 0.03) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(255, 92, 122, 0.018) 0 1px, transparent 1px 3px),
    radial-gradient(130% 100% at 50% -12%, #1e0a12 0%, var(--db-bg) 55%);
  border-color: var(--db-border);
  box-shadow: inset 0 0 44px rgba(0, 0, 0, 0.55), var(--shadow-1);
}

/* Red accent bar replaces the app's blue/green h2 accent. */
#panel-darkboard h2 {
  color: var(--db-red-bright);
  font-family: var(--mono);
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  margin: 0;
}
#panel-darkboard h2::before {
  background: linear-gradient(180deg, var(--db-red), #7a1830);
  box-shadow: 0 0 8px rgba(255, 92, 122, 0.55);
}

#panel-darkboard .db-shell { position: relative; }
/* Thin CRT scanline layer over everything (clicks pass through). */
#panel-darkboard .db-shell::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: 11px;
  background: repeating-linear-gradient(0deg, rgba(255, 92, 122, 0.025) 0 1px, transparent 1px 3px);
}

/* ── Header ──────────────────────────────────────────────────────────────── */
#panel-darkboard .db-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
#panel-darkboard .db-head-title {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
#panel-darkboard .db-tag {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--db-muted);
}
#panel-darkboard .db-head-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* DETECTION LED — stays dim offline; pulses red if detection is ever enabled. */
#panel-darkboard .db-led {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--db-muted);
  border: 1px solid var(--db-border);
  border-radius: 999px;
  padding: 3px 9px;
  background: var(--db-panel-2);
  white-space: nowrap;
}
#panel-darkboard .db-led .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #3a2a30;
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.8);
}
#panel-darkboard .db-led.on {
  border-color: rgba(255, 46, 77, 0.6);
  color: var(--db-red-bright);
}
#panel-darkboard .db-led.on .dot {
  background: var(--db-red-hot);
  box-shadow: 0 0 8px rgba(255, 46, 77, 0.95), inset 0 0 2px #fff;
  animation: db-pulse 1.6s ease-in-out infinite;
}

/* ── Buttons ─────────────────────────────────────────────────────────────── */
#panel-darkboard .db-btn {
  background: #1a0f14;
  color: var(--db-red-bright);
  border: 1px solid #3a1b26;
  border-radius: 6px;
  padding: 6px 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: 0.03em;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease, transform 0.06s ease;
}
#panel-darkboard .db-btn:hover:not(:disabled) {
  border-color: var(--db-red);
  background: #241018;
  box-shadow: 0 0 12px rgba(255, 92, 122, 0.22);
}
#panel-darkboard .db-btn:active:not(:disabled) { transform: translateY(0); }
#panel-darkboard .db-btn:disabled { opacity: 0.45; cursor: wait; }

#panel-darkboard .db-refresh {
  width: 34px;
  height: 34px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}
#panel-darkboard .db-refresh.busy { animation: db-spin 0.9s linear infinite; }

/* ── Body / sections ─────────────────────────────────────────────────────── */
#panel-darkboard .db-body {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
#panel-darkboard .db-loading {
  color: var(--db-muted);
  font-family: var(--mono);
  font-size: 12px;
  padding: 22px 0;
  overflow-wrap: anywhere;
  animation: db-blink 1s ease-in-out infinite alternate;
}
#panel-darkboard .db-error {
  color: var(--db-red);
  border: 1px solid rgba(255, 92, 122, 0.4);
  background: rgba(255, 92, 122, 0.06);
  border-radius: 8px;
  padding: 12px;
  font-size: 13px;
  overflow-wrap: anywhere;
}
#panel-darkboard .db-empty { color: var(--db-muted); font-size: 12px; padding: 10px 0; overflow-wrap: anywhere; }
#panel-darkboard .db-empty-sub { color: #5e4a53; font-size: 11px; margin-top: 3px; overflow-wrap: anywhere; }
#panel-darkboard .db-sec { min-width: 0; }
#panel-darkboard .db-sec-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
#panel-darkboard .db-sec-title {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--db-red);
  min-width: 0;
  overflow-wrap: anywhere;
}
#panel-darkboard .db-chip {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--db-red-bright);
  border: 1px solid rgba(255, 92, 122, 0.3);
  border-radius: 999px;
  padding: 1px 8px;
}

/* Clearance rail — the floor's posting cap + unlock hint. A quiet sub-line
   under the section head: clearance chip on the left, "X of Y posted" muted on
   the right; wraps on phones without crowding the contract grid. */
#panel-darkboard .db-clearance {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}
#panel-darkboard .db-clearance-note { font-size: 11px; color: var(--db-muted); }
#panel-darkboard .db-clearance-hint { font-size: 10px; color: var(--db-muted); margin: -2px 0 8px; overflow-wrap: anywhere; }

/* ── Risk Meter block ────────────────────────────────────────────────────── */
#panel-darkboard .db-risk {
  display: grid;
  grid-template-columns: minmax(0, 250px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  border: 1px solid var(--db-border);
  border-radius: 10px;
  padding: 12px;
  background: linear-gradient(180deg, rgba(26, 16, 20, 0.85), rgba(10, 6, 8, 0.9));
}
#panel-darkboard .db-risk.hot {
  border-color: rgba(255, 46, 77, 0.4);
  box-shadow: 0 0 22px rgba(255, 46, 77, 0.12);
}
@media (max-width: 640px) { #panel-darkboard .db-risk { grid-template-columns: 1fr; } }

/* Trading-suspension banner (Release D) — red alert bar at the top of the
   Risk Meter block while dark_trading_banned_until is in the future. */
#panel-darkboard .db-ban {
  grid-column: 1 / -1;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  padding: 9px 12px;
  border: 1px solid var(--db-red);
  background: rgba(255, 92, 122, 0.09);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
#panel-darkboard .db-ban b {
  color: var(--db-red-hot);
}
#panel-darkboard .db-ban span {
  color: var(--db-text);
  font-family: var(--sans);
  font-size: 12px;
  letter-spacing: 0.02em;
  text-transform: none;
}

/* Gauge */
#panel-darkboard .db-gauge-wrap { position: relative; max-width: 250px; width: 100%; margin: 0 auto; }
#panel-darkboard .db-gauge { display: block; width: 100%; height: auto; }
#panel-darkboard .db-track { fill: none; stroke: #241318; stroke-width: 13; stroke-linecap: round; }
#panel-darkboard .db-fill { fill: none; stroke: url(#dbFillGrad); stroke-width: 13; stroke-linecap: round; }
#panel-darkboard .db-danger {
  fill: none;
  stroke: var(--db-red-hot);
  stroke-width: 13;
  stroke-linecap: round;
  filter: drop-shadow(0 0 5px rgba(255, 46, 77, 0.85));
}
#panel-darkboard .db-ticks line { stroke: #3a2a30; stroke-width: 1; }
#panel-darkboard .db-ticks line.maj { stroke: #4f3340; stroke-width: 1.4; }
#panel-darkboard .db-fined-mark { stroke: rgba(255, 46, 77, 0.8); stroke-width: 1.6; }
#panel-darkboard .db-needle {
  stroke: var(--db-red-bright);
  stroke-width: 2;
  stroke-linecap: round;
  filter: drop-shadow(0 0 3px rgba(255, 92, 122, 0.7));
}
#panel-darkboard .db-pivot {
  fill: var(--db-red-hot);
  stroke: #1a0f14;
  stroke-width: 2;
}
#panel-darkboard .db-fined-label {
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.05em;
  fill: var(--db-red);
}

#panel-darkboard .db-gauge-readout {
  position: absolute;
  left: 50%;
  bottom: 2px;
  transform: translateX(-50%);
  text-align: center;
  pointer-events: none;
  z-index: 3;
  max-width: 100%;
  overflow-wrap: anywhere;
}
#panel-darkboard .db-gauge-score {
  font-family: var(--mono);
  font-size: 26px;
  font-weight: 700;
  line-height: 1;
  color: var(--db-red-bright);
  text-shadow: 0 0 12px rgba(255, 92, 122, 0.5);
}
#panel-darkboard .db-gauge-meta {
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--db-muted);
  margin-top: 2px;
  overflow-wrap: anywhere;
}

/* Meter event log */
#panel-darkboard .db-events { min-width: 0; }
#panel-darkboard .db-event {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  font-family: var(--mono);
  font-size: 11px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255, 92, 122, 0.07);
}
#panel-darkboard .db-event:last-child { border-bottom: none; }
#panel-darkboard .db-event-delta { text-align: right; }
#panel-darkboard .db-up { color: var(--db-red); }
#panel-darkboard .db-down { color: var(--db-muted); }
#panel-darkboard .db-event-reason {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--db-text);
}
#panel-darkboard .db-event-bal { color: var(--db-muted); }
#panel-darkboard .db-event-time { color: #5e4a53; font-size: 10px; white-space: nowrap; }

/* ── Gig catalog ─────────────────────────────────────────────────────────── */
#panel-darkboard .db-gigs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 640px) { #panel-darkboard .db-gigs { grid-template-columns: 1fr; } }

#panel-darkboard .db-gig {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px;
  border-radius: 9px;
  border: 1px solid var(--db-border);
  background:
    repeating-linear-gradient(0deg, rgba(255, 92, 122, 0.02) 0 1px, transparent 1px 3px),
    linear-gradient(180deg, #160c10, #0f080c);
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
/* Blood-edge top — a contract you should think twice about signing. */
#panel-darkboard .db-gig::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, rgba(255, 92, 122, 0.75), transparent 85%);
  border-radius: 9px 9px 0 0;
}
#panel-darkboard .db-gig:hover {
  border-color: rgba(255, 92, 122, 0.5);
  box-shadow: 0 0 0 1px rgba(255, 92, 122, 0.15), 0 8px 20px rgba(0, 0, 0, 0.45);
}
#panel-darkboard .db-gig-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
#panel-darkboard .db-gig-payout {
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 700;
  color: var(--db-text);
}
#panel-darkboard .db-gig-title { font-size: 14px; font-weight: 650; color: var(--db-text); overflow-wrap: anywhere; }
#panel-darkboard .db-gig-desc { font-size: 11.5px; color: var(--db-muted); line-height: 1.4; flex: 1 1 auto; overflow-wrap: anywhere; }
/* Corps-lore target line — the corp this contract hits and its trust price.
   Amber, like a lit fuse: the name you're about to hurt. */
#panel-darkboard .db-gig-target {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.05em;
  color: #d4a64a;
  border: 1px solid rgba(212, 166, 74, 0.3);
  background: rgba(212, 166, 74, 0.07);
  border-radius: 6px;
  padding: 3px 8px;
  align-self: flex-start;
  overflow-wrap: anywhere;
}
#panel-darkboard .db-gig-target b { color: var(--db-text); font-weight: 700; }
#panel-darkboard .db-gig-target .db-neg { color: var(--db-red-bright); }
#panel-darkboard .db-gig-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 4px;
  flex-wrap: wrap;
}
#panel-darkboard .db-risk-up { font-family: var(--mono); font-size: 11px; color: var(--db-red); }
/* Live exposure readouts on each contract — heat (detection chance at your
   current meter) and fine exposure (what a catch costs), plus the Fresh Start
   first-gig shield badge. */
#panel-darkboard .db-heat {
  font-family: var(--mono);
  font-size: 10px;
  color: #d4a64a;
  border: 1px solid rgba(212, 166, 74, 0.35);
  background: rgba(212, 166, 74, 0.08);
  padding: 1px 6px;
  border-radius: 3px;
  white-space: nowrap;
}
#panel-darkboard .db-fine {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--db-red-bright);
  border: 1px solid rgba(255, 92, 122, 0.3);
  background: rgba(255, 92, 122, 0.07);
  padding: 1px 6px;
  border-radius: 3px;
  white-space: nowrap;
}
#panel-darkboard .db-shield {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7ee0a3;
  border: 1px solid rgba(126, 224, 163, 0.35);
  background: rgba(126, 224, 163, 0.08);
  padding: 1px 6px;
  border-radius: 3px;
  white-space: nowrap;
}
#panel-darkboard .db-gig.shielded { border-color: rgba(126, 224, 163, 0.45); }
#panel-darkboard .db-gig.shielded::before {
  background: linear-gradient(90deg, rgba(126, 224, 163, 0.75), transparent 85%);
}
/* Gauge subtitle line — detection % + shield state under the meter readout. */
#panel-darkboard .db-gauge-sub {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 4px;
}
#panel-darkboard .db-detect-pct {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #d4a64a;
}
/* Ban countdown — the mono timer is the loudest thing in the banner. */
#panel-darkboard .db-ban .db-ban-cd {
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 700;
  color: var(--db-red-bright);
  letter-spacing: 0.08em;
}

/* Threat-class badges (I–V) */
#panel-darkboard .db-threat {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 2px 7px;
  border-radius: 3px;
  border: 1px solid;
  white-space: nowrap;
}
#panel-darkboard .db-threat.t1 { color: #c98a98; border-color: rgba(255, 92, 122, 0.28); background: rgba(255, 92, 122, 0.05); }
#panel-darkboard .db-threat.t2 { color: var(--db-red); border-color: rgba(255, 92, 122, 0.45); background: rgba(255, 92, 122, 0.09); }
#panel-darkboard .db-threat.t3 {
  color: #ff3b5c;
  border-color: rgba(255, 59, 92, 0.65);
  background: rgba(255, 59, 92, 0.13);
  text-shadow: 0 0 6px rgba(255, 59, 92, 0.45);
}
#panel-darkboard .db-threat.t4 {
  color: var(--db-red-hot);
  border-color: var(--db-red-hot);
  background: rgba(255, 46, 77, 0.16);
  text-shadow: 0 0 8px rgba(255, 46, 77, 0.75);
  box-shadow: 0 0 10px rgba(255, 46, 77, 0.25);
}
/* t5 = the endgame contracts (risk 50 — one hit crosses the trading-ban line).
   Loudest rung on the ladder: near-white text burning on the red glow. */
#panel-darkboard .db-threat.t5 {
  color: #ffe6ea;
  border-color: #ff2e4d;
  background: rgba(255, 46, 77, 0.22);
  text-shadow: 0 0 10px rgba(255, 46, 77, 0.95), 0 0 20px rgba(255, 46, 77, 0.55);
  box-shadow: 0 0 12px rgba(255, 46, 77, 0.4), inset 0 0 8px rgba(255, 46, 77, 0.18);
}

/* ── Assignments ─────────────────────────────────────────────────────────── */
#panel-darkboard .db-active-list,
#panel-darkboard .db-history-list { display: flex; flex-direction: column; gap: 8px; }

#panel-darkboard .db-active {
  padding: 12px;
  border: 1px solid var(--db-border);
  border-left: 2px solid var(--db-red);
  border-radius: 8px;
  background: linear-gradient(180deg, #140b0f, #0f080c);
}
#panel-darkboard .db-active-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 4px;
  flex-wrap: wrap;
}
#panel-darkboard .db-risk-arrow { font-family: var(--mono); font-size: 11px; color: var(--db-muted); }
#panel-darkboard .db-arrow { color: var(--db-red); }

#panel-darkboard .db-history {
  padding: 9px 12px;
  border: 1px solid rgba(255, 92, 122, 0.08);
  border-radius: 7px;
  background: rgba(26, 16, 20, 0.5);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#panel-darkboard .db-history-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
#panel-darkboard .db-history-title {
  font-size: 12.5px;
  color: var(--db-text);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#panel-darkboard .db-history-meta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
#panel-darkboard .db-neg { font-family: var(--mono); font-size: 11px; color: var(--db-red-hot); }
#panel-darkboard .db-payout { font-family: var(--mono); font-size: 11px; color: var(--db-text); }

/* Status badges */
#panel-darkboard .db-status {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  padding: 2px 7px;
  border-radius: 3px;
  border: 1px solid;
}
#panel-darkboard .db-status.active {
  color: var(--db-red-bright);
  border-color: rgba(255, 92, 122, 0.5);
  background: rgba(255, 92, 122, 0.1);
  animation: db-pulse 1.8s ease-in-out infinite;
}
#panel-darkboard .db-status.done {
  color: var(--db-muted);
  border-color: rgba(255, 92, 122, 0.25);
  background: rgba(255, 92, 122, 0.05);
}
#panel-darkboard .db-status.detected {
  color: var(--db-red-hot);
  border-color: var(--db-red-hot);
  background: rgba(255, 46, 77, 0.14);
  text-shadow: 0 0 6px rgba(255, 46, 77, 0.6);
}

/* ── Dev seed tools ───────────────────────────────────────────────────────── */
#panel-darkboard .db-seed {
  margin-top: 16px;
  border-top: 1px dashed #24131a;
  padding-top: 10px;
}
#panel-darkboard .db-seed summary {
  cursor: pointer;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #5e4a53;
  list-style: none;
  user-select: none;
}
#panel-darkboard .db-seed summary::-webkit-details-marker { display: none; }
#panel-darkboard .db-seed summary:hover { color: var(--db-muted); }
#panel-darkboard .db-seed summary::before { content: '▸ '; }
#panel-darkboard .db-seed[open] summary::before { content: '▾ '; }
#panel-darkboard .db-seed-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
#panel-darkboard .db-seed-btn {
  font-size: 10px;
  padding: 4px 9px;
  color: #8a6a74;
  border-color: #2c1620;
  background: transparent;
}
#panel-darkboard .db-seed-btn:hover:not(:disabled) {
  color: var(--db-red-bright);
  border-color: rgba(255, 92, 122, 0.4);
  box-shadow: none;
}

/* ── Animations ──────────────────────────────────────────────────────────── */
@keyframes db-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }
@keyframes db-spin { to { transform: rotate(360deg); } }
@keyframes db-blink { from { opacity: 0.35; } to { opacity: 1; } }

/* ── The act — a contract's scenario chain (§5.90) ───────────────────────────
   Every accepted contract walks an authored reading act against the target:
   step meta, the opener scene, the numbers in front of you, then the moves.
   Money stays on the floor's detection roll — the walk decides how the job
   lands on the target (the rail on the result), never the payout. No timers,
   no reflex; the block is a fluid column, so a 360px phone reads it as cleanly
   as a wide pane (scene/finale/options wrap — nothing is allowed to overflow). */
#panel-darkboard .db-chain {
  margin-top: 10px;
  border-top: 1px dashed rgba(255, 92, 122, 0.25);
  padding-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
#panel-darkboard .db-chain.is-done { border-top-color: rgba(126, 224, 163, 0.3); }
#panel-darkboard .db-chain-meta {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--db-muted);
}
#panel-darkboard .db-chain-step { color: var(--db-red-bright, #ff8fa3); font-weight: 700; }
#panel-darkboard .db-chain-answered { color: var(--db-muted); }
#panel-darkboard .db-chain-opener {
  font-size: 12px;
  line-height: 1.5;
  color: #c9a0ac;
  font-style: italic;
  overflow-wrap: anywhere;
}
#panel-darkboard .db-chain-scene {
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--db-text);
  overflow-wrap: anywhere;
}
#panel-darkboard .db-chain-figs {
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
#panel-darkboard .db-chain-figs li {
  font-family: var(--mono);
  font-size: 10.5px;
  color: #e9dfe2;
  background: #160d12;
  border: 1px solid #2c1620;
  border-radius: 4px;
  padding: 2px 6px;
}
#panel-darkboard .db-chain-options {
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
#panel-darkboard .db-chain-opt {
  text-align: left;
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.4;
  color: #e9dfe2;
  background: linear-gradient(180deg, #1a0f14, #150b10);
  border: 1px solid #3a1b26;
  border-radius: 6px;
  padding: 7px 9px;
  cursor: pointer;
  overflow-wrap: anywhere;
  transition: border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
#panel-darkboard .db-chain-opt:hover:not(:disabled) {
  border-color: var(--db-red, #ff5c7a);
  color: var(--db-red-bright, #ff8fa3);
  box-shadow: 0 0 10px rgba(255, 92, 122, 0.18);
}
#panel-darkboard .db-chain-opt:disabled { opacity: 0.45; cursor: wait; }

/* Resolved-act banner: the severity verdict + note, then the authored finale. */
#panel-darkboard .db-chain-banner {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.08em;
}
#panel-darkboard .db-chain-sev {
  font-weight: 700;
  text-transform: uppercase;
  color: #7ee0a3;
  border: 1px solid rgba(126, 224, 163, 0.35);
  border-radius: 3px;
  padding: 1px 6px;
}
#panel-darkboard .db-chain-note { color: var(--db-muted); }
#panel-darkboard .db-chain-finale {
  font-size: 12px;
  line-height: 1.5;
  font-style: italic;
  color: #c9a0ac;
  overflow-wrap: anywhere;
}

/* The floor's verdict, painted inline where the act was playing. */
#panel-darkboard .db-chain-result {
  margin-top: 10px;
  border: 1px solid #2c1620;
  border-radius: 10px;
  padding: 12px;
  background: linear-gradient(180deg, #160c10, #0f080c);
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
#panel-darkboard .db-chain-result.is-clean { border-top: 2px solid rgba(126, 224, 163, 0.5); }
#panel-darkboard .db-chain-result.is-detected {
  border-top: 2px solid var(--db-red, #ff5c7a);
  background: rgba(255, 92, 122, 0.07);
}
#panel-darkboard .db-chain-verdict {
  font-family: var(--mono);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.1em;
}
#panel-darkboard .db-chain-result.is-clean .db-chain-verdict { color: #7ee0a3; }
#panel-darkboard .db-chain-result.is-detected .db-chain-verdict { color: var(--db-red-hot, #ff2e4d); }
#panel-darkboard .db-chain-line {
  font-family: var(--mono);
  font-size: 12px;
  color: #e9dfe2;
  overflow-wrap: anywhere;
}
#panel-darkboard .db-chain-scn {
  font-size: 11.5px;
  line-height: 1.45;
  color: #c9a0ac;
  border-left: 2px solid rgba(255, 92, 122, 0.4);
  padding-left: 8px;
  overflow-wrap: anywhere;
}
#panel-darkboard .db-chain-ban { color: var(--db-red-hot, #ff2e4d); font-size: 11px; }
#panel-darkboard .db-chain-close { align-self: flex-start; }