/* ==========================================================================
   JARVIS / Iron Man HUD — 9-slice frames + content inset + translucent fills
   Stage: solid black for now (stage-bg.jpg disabled until frame fidelity done)
   Frames: border-image 9-slice (corners unwarped; content lives inside border)
   ========================================================================== */

/* —— Full-site stage (black — no photographic plate) —— */
html[data-theme="dark"],
html[data-theme="dark"] body {
  background-color: #000000 !important;
  background-image: none !important;
  background-size: auto !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  color: #e8f4fc !important;
}

html[data-theme="dark"] .shell,
html[data-theme="dark"] .stage,
html[data-theme="dark"] .page,
html[data-theme="dark"] .page.is-active,
html[data-theme="dark"] .rail,
html[data-theme="dark"] .rail-left,
html[data-theme="dark"] .rail-right,
html[data-theme="dark"] .main-col,
html[data-theme="dark"] .mission-main,
html[data-theme="dark"] .desk-col {
  background: transparent !important;
  background-image: none !important;
}

html[data-theme="dark"] {
  /* Wider frame rim + pad = content stays clear of metal border art */
  --hud-frame-w: 24px;
  --hud-content-pad: 0.15rem 0.2rem;
  /* Fully translucent glass — stage detail must read through widgets */
  --hud-void: rgba(4, 12, 22, 0.08);
  --hud-void-dense: rgba(4, 14, 24, 0.1);
  --hud-cell: rgba(4, 12, 22, 0.06);
  --hud-cell-hover: rgba(0, 200, 255, 0.08);
  --hud-inset:
    inset 0 0 0 1px rgba(0, 220, 255, 0.1),
    inset 0 1px 0 rgba(180, 240, 255, 0.1),
    inset 0 0 24px rgba(0, 160, 220, 0.04);
  --hud-outer:
    0 0 12px rgba(0, 200, 255, 0.2),
    0 0 32px rgba(0, 160, 255, 0.1),
    0 8px 24px rgba(0, 0, 0, 0.35);
  --hud-outer-hot:
    0 0 16px rgba(0, 220, 255, 0.28),
    0 0 40px rgba(0, 180, 255, 0.14),
    0 10px 28px rgba(0, 0, 0, 0.4);
  --text: #e8f4fc;
  --muted: #8eb6c9;
  --dim: #5a7a8c;
  --accent: #00d4ff;
  --accent-soft: #00e5ff;
  --accent-dim: rgba(0, 212, 255, 0.12);
  --border-cyan: rgba(0, 220, 255, 0.5);
  --border-cyan-strong: rgba(0, 235, 255, 0.8);
  --glow-cyan: 0 0 12px rgba(0, 210, 255, 0.35);
  --glow-cyan-soft: 0 0 8px rgba(0, 200, 255, 0.22);
  --glass-border: rgba(0, 220, 255, 0.45);
  --glass-border-soft: rgba(0, 180, 220, 0.25);
  --line: rgba(0, 200, 255, 0.28);
  --line-soft: rgba(0, 160, 200, 0.15);
  --bg-panel: rgba(6, 14, 24, 0.55);
  --bg-panel-solid: rgba(6, 12, 20, 0.7);
  --chart-bg: transparent;
  --chart-dot: rgba(0, 200, 255, 0.12);
  --chart-label: #6a8fa8;
  --green: #2dffb2;
  --success: #2dffb2;
}

/*
  Widget shell — 9-slice border-image frame
  Content is INSIDE the border box (cannot spill under frame geometry).
  Slight content scale so dense tables clear the rim.
*/
html[data-theme="dark"] .mission-widget:not(.assets-widget):not(.auto-banner):not(.board-wrap):not(.intel-widget):not(.coin-profile):not(.social-panel):not(.liq-panel),
html[data-theme="dark"] .widget,
html[data-theme="dark"] .ledger-block,
html[data-theme="dark"] .social-panel,
/* assets / auto / board-wrap — operator PNG frames at file end */
html[data-theme="dark"] .glass-panel.mission-widget:not(.assets-widget),
html[data-theme="dark"] .cmd-desk-card,
html[data-theme="dark"] .admin-panel,
html[data-theme="dark"] .admin-sheet,
html[data-theme="dark"] .learn-desk,
html[data-theme="dark"] .cockpit-card,
html[data-theme="dark"] .fleet-panel,
html[data-theme="dark"] .ap-shell-widget {
  position: relative !important;
  box-sizing: border-box !important;
  border-style: solid !important;
  border-color: transparent !important;
  border-width: var(--hud-frame-w) !important;
  border-radius: 0 !important;
  border-image-source: url("/static/img/hud/frame-9slice.svg") !important;
  border-image-slice: 28 !important;
  border-image-width: var(--hud-frame-w) !important;
  border-image-outset: 0 !important;
  border-image-repeat: stretch !important;
  background: var(--hud-void) !important;
  background-clip: padding-box !important;
  box-shadow: var(--hud-outer), var(--hud-inset) !important;
  /* no blur — blur frosts the stage and hides detail */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
  padding: var(--hud-content-pad) !important;
  margin: 0 !important;
  color: #e8f4fc !important;
  /* Scale content smaller so it fits inside the frame opening (not on the rim) */
  font-size: 0.72em;
  line-height: 1.18;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Mission open/closed seats use dual PNG plates (not 9-slice bar) */
html[data-theme="dark"] .ledger-block:not(#open-seats-panel):not(#closed-seats-panel) {
  border-image-source: url("/static/img/hud/frame-9slice-bar.svg") !important;
  background: var(--hud-void-dense) !important;
  box-shadow: var(--hud-outer-hot), var(--hud-inset) !important;
  --hud-frame-w: 24px;
  --hud-content-pad: 0.12rem 0.18rem;
  font-size: 0.72em;
}

/* Operator PNG frames: equity / autopilot / board / open decision / focus / social / liq / seats. */
html[data-theme="dark"] .assets-widget,
html[data-theme="dark"] .auto-banner,
html[data-theme="dark"] .panel.auto-banner,
html[data-theme="dark"] .board-wrap,
html[data-theme="dark"] .board-wrap-tall,
html[data-theme="dark"] .intel-widget,
html[data-theme="dark"] .coin-profile,
html[data-theme="dark"] .social-panel,
html[data-theme="dark"] .liq-panel,
html[data-theme="dark"] #open-seats-panel,
html[data-theme="dark"] #closed-seats-panel {
  --hud-frame-w: 0px;
  --hud-content-pad: 0;
}

/* Side rails — right-corner metal plate (PNG plates excluded) */
html[data-theme="dark"] .rail .mission-widget:not(.board-wrap):not(.intel-widget):not(.coin-profile):not(.social-panel):not(.liq-panel),
html[data-theme="dark"] .rail-left .mission-widget:not(.board-wrap):not(.intel-widget):not(.coin-profile):not(.social-panel):not(.liq-panel),
html[data-theme="dark"] .rail-right .mission-widget:not(.board-wrap):not(.intel-widget):not(.coin-profile):not(.social-panel):not(.liq-panel) {
  border-image-source: url("/static/img/hud/frame-9slice-side.svg") !important;
  --hud-frame-w: 24px;
  font-size: 0.72em;
}

/* Kill old full-bleed ::before frame overlays (they fought border-image + content) */
html[data-theme="dark"] .mission-widget:not(.assets-widget):not(.auto-banner):not(.board-wrap):not(.intel-widget):not(.coin-profile):not(.social-panel):not(.liq-panel)::before,
html[data-theme="dark"] .widget::before,
html[data-theme="dark"] .liq-panel::before,
html[data-theme="dark"] .cmd-desk-card::before,
html[data-theme="dark"] .admin-panel::before,
html[data-theme="dark"] .admin-sheet::before,
html[data-theme="dark"] .learn-desk::before,
html[data-theme="dark"] .cockpit-card::before,
html[data-theme="dark"] .fleet-panel::before,
html[data-theme="dark"] .ap-shell-widget::before,
/* .auto-banner / .assets-widget ::before reserved for operator frame art */
html[data-theme="dark"] .ledger-block::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

html[data-theme="dark"] .mission-widget:not(.assets-widget):not(.auto-banner):not(.intel-widget):not(.coin-profile):not(.social-panel):not(.liq-panel)::after,
html[data-theme="dark"] .ledger-block::after,
html[data-theme="dark"] .intel-widget::after,
html[data-theme="dark"] .coin-profile::after,
html[data-theme="dark"] .board-wrap::after,
html[data-theme="dark"] .social-panel::after,
html[data-theme="dark"] .liq-panel::after,
html[data-theme="dark"] .cmd-desk-card::after,
html[data-theme="dark"] .admin-panel::after,
html[data-theme="dark"] .admin-sheet::after {
  content: none !important;
  display: none !important;
}

/* —— Translucent inner content (everything inside frames) —— */
html[data-theme="dark"] .intel-card,
html[data-theme="dark"] .cp-card,
html[data-theme="dark"] .si-card,
html[data-theme="dark"] .focus-card,
html[data-theme="dark"] .si-channels,
html[data-theme="dark"] .ap-nest-widget,
html[data-theme="dark"] .asset-pill,
html[data-theme="dark"] .stat-pill,
html[data-theme="dark"] .metric-pill,
html[data-theme="dark"] .eq-stat,
html[data-theme="dark"] .auto-stat,
html[data-theme="dark"] .cp-metric,
html[data-theme="dark"] .si-metric,
html[data-theme="dark"] .si-metrics,
html[data-theme="dark"] .intel-slot,
html[data-theme="dark"] .hold-card,
html[data-theme="dark"] .edge-card,
html[data-theme="dark"] .asset-strip--compact > *,
html[data-theme="dark"] .asset-strip > *,
html[data-theme="dark"] .assets-stats > *,
html[data-theme="dark"] .eq-stats > *,
html[data-theme="dark"] .metric-strip > *,
html[data-theme="dark"] .chart-stats > *,
html[data-theme="dark"] .cp-grid > *,
html[data-theme="dark"] .cp-metrics > *,
html[data-theme="dark"] .intel-widget-body > *,
html[data-theme="dark"] .si-block,
html[data-theme="dark"] .si-row,
html[data-theme="dark"] .auto-kpi,
html[data-theme="dark"] .auto-kpis > *,
html[data-theme="dark"] .kpi-chip,
html[data-theme="dark"] .stat-chip {
  border: 1px solid rgba(0, 200, 255, 0.18) !important;
  border-radius: 5px !important;
  background: rgba(4, 12, 22, 0.05) !important;
  box-shadow: inset 0 0 0 1px rgba(0, 200, 255, 0.04) !important;
  color: var(--text) !important;
  backdrop-filter: none !important;
}

/* Tables / board — highly see-through */
html[data-theme="dark"] table thead th,
html[data-theme="dark"] .data-table th,
html[data-theme="dark"] .open-seats th,
html[data-theme="dark"] .learn-dt-table th,
html[data-theme="dark"] .admin-table th,
html[data-theme="dark"] table.board th {
  background: rgba(2, 8, 16, 0.06) !important;
  color: var(--muted) !important;
  border-bottom: 1px solid rgba(0, 180, 220, 0.14) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.62rem;
}
html[data-theme="dark"] table,
html[data-theme="dark"] .data-table,
html[data-theme="dark"] table.board {
  background: transparent !important;
}
html[data-theme="dark"] table tbody tr,
html[data-theme="dark"] .data-table tbody tr,
html[data-theme="dark"] table.board tbody tr {
  background: rgba(4, 12, 22, 0.12) !important;
}
html[data-theme="dark"] table tbody tr:nth-child(even),
html[data-theme="dark"] table.board tbody tr:nth-child(even) {
  background: rgba(4, 12, 22, 0.2) !important;
}
html[data-theme="dark"] table tbody tr:hover,
html[data-theme="dark"] .data-table tbody tr:hover,
html[data-theme="dark"] table.board tbody tr:hover {
  background: rgba(0, 200, 255, 0.08) !important;
}
html[data-theme="dark"] table td,
html[data-theme="dark"] .data-table td {
  border-bottom: 1px solid rgba(0, 160, 200, 0.06) !important;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  background: transparent !important;
}

/* Autopilot / seats inner strips */
html[data-theme="dark"] .auto-banner .field-row,
html[data-theme="dark"] .auto-banner .auto-stats,
html[data-theme="dark"] .auto-banner .stat-row,
html[data-theme="dark"] .auto-banner select,
html[data-theme="dark"] .auto-banner .field-select,
html[data-theme="dark"] .auto-banner .field-input,
html[data-theme="dark"] .auto-banner .auto-status,
html[data-theme="dark"] .auto-banner .auto-row,
html[data-theme="dark"] .auto-banner .ap-row {
  background: rgba(2, 10, 18, 0.06) !important;
}

/* Scroll regions transparent */
html[data-theme="dark"] .mission-widget .table-wrap,
html[data-theme="dark"] .mission-widget .market-table-wrap,
html[data-theme="dark"] .board-wrap .market-table-wrap,
html[data-theme="dark"] .ledger-block .table-wrap,
html[data-theme="dark"] .social-panel .si-body,
html[data-theme="dark"] .liq-panel .liq-body,
html[data-theme="dark"] .liq-chart-wrap,
html[data-theme="dark"] .intel-widget-body,
html[data-theme="dark"] .cp-body,
html[data-theme="dark"] .assets-widget-foot {
  max-width: 100%;
  overflow: auto;
  background: transparent !important;
}

/* Titles — slightly smaller to match content scale */
html[data-theme="dark"] .widget-title,
html[data-theme="dark"] .panel-title,
html[data-theme="dark"] .mission-widget-head .section-label,
html[data-theme="dark"] .mission-widget-head .cp-kicker,
html[data-theme="dark"] .mission-widget-head .si-kicker,
html[data-theme="dark"] .mission-widget-head .liq-kicker,
html[data-theme="dark"] .cockpit-kicker,
html[data-theme="dark"] .section-label,
html[data-theme="dark"] .desk-kicker {
  color: #7eefff !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-shadow: 0 0 10px rgba(0, 220, 255, 0.3);
}

/* Buttons */
html[data-theme="dark"] .btn.primary,
html[data-theme="dark"] button.primary,
html[data-theme="dark"] .btn.apply,
html[data-theme="dark"] .ap-apply,
html[data-theme="dark"] #auto-apply {
  background: linear-gradient(
    180deg,
    rgba(0, 230, 255, 0.32) 0%,
    rgba(0, 120, 180, 0.26) 100%
  ) !important;
  border: 1px solid rgba(0, 235, 255, 0.8) !important;
  color: #e8f7ff !important;
  box-shadow: 0 0 12px rgba(0, 210, 255, 0.35), inset 0 1px 0 rgba(220, 250, 255, 0.25) !important;
  border-radius: 5px !important;
}
html[data-theme="dark"] .btn.primary:hover,
html[data-theme="dark"] .btn.apply:hover,
html[data-theme="dark"] #auto-apply:hover {
  box-shadow: 0 0 20px rgba(0, 230, 255, 0.5) !important;
}
html[data-theme="dark"] .btn.ghost,
html[data-theme="dark"] .btn.secondary,
html[data-theme="dark"] .glass-btn {
  border: 1px solid rgba(0, 180, 220, 0.38) !important;
  color: var(--muted) !important;
  background: rgba(0, 16, 28, 0.35) !important;
  border-radius: 5px !important;
}
html[data-theme="dark"] .btn.ghost:hover {
  color: #7eefff !important;
  border-color: rgba(0, 230, 255, 0.65) !important;
}
html[data-theme="dark"] .btn.warn,
html[data-theme="dark"] .btn.danger,
html[data-theme="dark"] .btn.disengage,
html[data-theme="dark"] #auto-disengage {
  border: 1px solid rgba(255, 150, 50, 0.65) !important;
  color: #ffb060 !important;
  background: rgba(40, 18, 6, 0.4) !important;
  border-radius: 5px !important;
}

/* Segments */
html[data-theme="dark"] .seg-rail,
html[data-theme="dark"] .chip-row,
html[data-theme="dark"] .universe-chips,
html[data-theme="dark"] .tf-seg,
html[data-theme="dark"] .mode-tabs,
html[data-theme="dark"] .board-tabs,
html[data-theme="dark"] .range-seg {
  background: rgba(2, 8, 16, 0.42) !important;
  border: 1px solid rgba(0, 180, 220, 0.25) !important;
  border-radius: 6px !important;
}
html[data-theme="dark"] .seg.is-on,
html[data-theme="dark"] .chip.is-on,
html[data-theme="dark"] .universe-chip.is-on,
html[data-theme="dark"] .tf-btn.is-on,
html[data-theme="dark"] .mode-tab.is-on {
  background: rgba(0, 212, 255, 0.14) !important;
  border-color: rgba(0, 220, 255, 0.5) !important;
  color: #7eefff !important;
  box-shadow: 0 0 8px rgba(0, 200, 255, 0.25);
}
html[data-theme="dark"] .board-tab.is-on,
html[data-theme="dark"] .range-btn.is-on[data-chart-src] {
  background: rgba(0, 255, 159, 0.14) !important;
  border-color: rgba(0, 255, 159, 0.5) !important;
  color: #2dffb2 !important;
  box-shadow: 0 0 10px rgba(0, 255, 159, 0.25);
}
html[data-theme="dark"] .board-tab[data-asset-class="stock"].is-on {
  background: rgba(255, 160, 40, 0.12) !important;
  border-color: rgba(255, 160, 40, 0.5) !important;
  color: #ffb060 !important;
}
html[data-theme="dark"] .range-btn.is-on {
  background: rgba(0, 212, 255, 0.12) !important;
  border-color: rgba(0, 220, 255, 0.45) !important;
  color: #7eefff !important;
}

/* PAPER / LIVE */
html[data-theme="dark"] .badge-paper,
html[data-theme="dark"] .mode-paper,
html[data-theme="dark"] .seg-mode-paper,
html[data-theme="dark"] [data-mode="paper"] .mode-pill {
  border: 1px solid rgba(0, 220, 255, 0.6) !important;
  color: #00e5ff !important;
  background: rgba(0, 200, 255, 0.08) !important;
}
html[data-theme="dark"] .badge-live,
html[data-theme="dark"] .mode-live,
html[data-theme="dark"] .seg-mode-live,
html[data-theme="dark"] [data-mode="live"] .mode-pill {
  border: 1px solid rgba(255, 176, 32, 0.65) !important;
  color: #ffb020 !important;
  background: rgba(255, 176, 32, 0.08) !important;
}

html[data-theme="dark"] .pnl-pos,
html[data-theme="dark"] .t-green,
html[data-theme="dark"] .positive {
  color: #2dffb2 !important;
}
html[data-theme="dark"] .pnl-neg,
html[data-theme="dark"] .t-red,
html[data-theme="dark"] .negative {
  color: #ff4d5e !important;
}

/* Inputs translucent */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .field-input,
html[data-theme="dark"] .field-select {
  background: rgba(2, 8, 16, 0.5) !important;
  border: 1px solid rgba(0, 180, 220, 0.28) !important;
  color: var(--text) !important;
  border-radius: 5px;
}
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] .field-input:focus {
  outline: none !important;
  border-color: rgba(0, 230, 255, 0.7) !important;
  box-shadow: 0 0 0 2px rgba(0, 212, 255, 0.14) !important;
}

/* Modals */
html[data-theme="dark"] .modal,
html[data-theme="dark"] .modal-sheet,
html[data-theme="dark"] .inbox-modal,
html[data-theme="dark"] .cmd-modal,
html[data-theme="dark"] .admin-modal,
html[data-theme="dark"] .liq-modal-sheet {
  position: relative !important;
  border-style: solid !important;
  border-color: transparent !important;
  border-width: 16px !important;
  border-radius: 0 !important;
  border-image-source: url("/static/img/hud/frame-9slice-focus.svg") !important;
  border-image-slice: 28 !important;
  border-image-width: 16px !important;
  border-image-repeat: stretch !important;
  background: rgba(4, 12, 22, 0.78) !important;
  background-clip: padding-box !important;
  box-shadow: var(--hud-outer-hot), 0 28px 70px rgba(0, 0, 0, 0.6) !important;
  backdrop-filter: blur(16px);
  overflow: hidden !important;
  color: var(--text) !important;
  padding: 0.75rem !important;
}
html[data-theme="dark"] .modal::before,
html[data-theme="dark"] .modal-sheet::before,
html[data-theme="dark"] .inbox-modal::before,
html[data-theme="dark"] .cmd-modal::before,
html[data-theme="dark"] .admin-modal::before,
html[data-theme="dark"] .liq-modal-sheet::before {
  content: none !important;
  display: none !important;
}

/* Chart stage — nested chrome for non-equity charts only.
   Equity (#assets-widget) intentionally has NO inner frame — see EQUITY WIDGET ONLY. */
html[data-theme="dark"] .chart-wrap:not(#equity-chart-wrap),
html[data-theme="dark"] .focus-chart,
html[data-theme="dark"] .equity-chart-host,
html[data-theme="dark"] .chart-wrap--modern:not(#equity-chart-wrap),
html[data-theme="dark"] .liq-chart-wrap {
  position: relative !important;
  background:
    radial-gradient(ellipse 95% 55% at 50% 100%, rgba(0, 210, 255, 0.12), transparent 58%),
    transparent !important;
  border: 1px solid rgba(0, 200, 255, 0.22) !important;
  border-radius: 4px !important;
  box-shadow:
    0 0 12px rgba(0, 200, 255, 0.08),
    inset 0 0 30px rgba(0, 140, 200, 0.05) !important;
  overflow: hidden !important;
  max-width: 100%;
}

html[data-theme="dark"] .chart-wrap:not(#equity-chart-wrap)::before,
html[data-theme="dark"] .chart-wrap--modern:not(#equity-chart-wrap)::before {
  content: "" !important;
  pointer-events: none !important;
  position: absolute !important;
  left: -6% !important;
  right: -6% !important;
  bottom: -10% !important;
  height: 55% !important;
  width: auto !important;
  top: auto !important;
  z-index: 0 !important;
  background:
    linear-gradient(to top, rgba(0, 220, 255, 0.18) 0%, transparent 72%),
    repeating-linear-gradient(
      90deg,
      transparent 0,
      transparent 30px,
      rgba(0, 220, 255, 0.12) 31px,
      transparent 32px
    ),
    repeating-linear-gradient(
      0deg,
      transparent 0,
      transparent 14px,
      rgba(0, 200, 255, 0.08) 15px,
      transparent 16px
    ) !important;
  transform: perspective(340px) rotateX(64deg) !important;
  transform-origin: 50% 100% !important;
  border: none !important;
  box-shadow: none !important;
  mask-image: linear-gradient(to top, black 18%, transparent 95%);
  -webkit-mask-image: linear-gradient(to top, black 18%, transparent 95%);
}

html[data-theme="dark"] .chart-wrap:not(#equity-chart-wrap)::after,
html[data-theme="dark"] .chart-wrap--modern:not(#equity-chart-wrap)::after {
  content: "" !important;
  pointer-events: none !important;
  position: absolute !important;
  left: 10% !important;
  right: 10% !important;
  bottom: 14% !important;
  height: 2px !important;
  width: auto !important;
  top: auto !important;
  z-index: 0 !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(0, 230, 255, 0.2) 18%,
    rgba(0, 245, 255, 0.9) 50%,
    rgba(0, 230, 255, 0.2) 82%,
    transparent
  ) !important;
  box-shadow: 0 0 14px rgba(0, 230, 255, 0.7) !important;
  border: none !important;
  display: block !important;
}

html[data-theme="dark"] .chart-wrap:not(#equity-chart-wrap) > * {
  position: relative;
  z-index: 1;
}
html[data-theme="dark"] .chart-wrap canvas {
  background: transparent !important;
  max-width: 100%;
}

html[data-theme="dark"] .metric-strip,
html[data-theme="dark"] .chart-stats,
html[data-theme="dark"] .focus-metrics,
html[data-theme="dark"] .assets-stats,
html[data-theme="dark"] .eq-stats,
html[data-theme="dark"] .asset-strip--compact,
html[data-theme="dark"] .asset-strip {
  border-top: 1px solid rgba(0, 180, 220, 0.12);
  background: transparent !important;
}

html[data-theme="dark"] .status-dot.ok,
html[data-theme="dark"] .led-ok,
html[data-theme="dark"] .is-engaged,
html[data-theme="dark"] .auto-dot {
  color: #00e8ff !important;
  text-shadow: 0 0 10px rgba(0, 230, 255, 0.65);
}

/* Top bar — solid black (no glass / translucency) */
html[data-theme="dark"] .portal-topbar {
  background: #000000 !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html[data-theme="dark"] .portal-topbar::after {
  height: 2px !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(0, 200, 255, 0.15) 15%,
    rgba(0, 240, 255, 0.85) 50%,
    rgba(0, 200, 255, 0.15) 85%,
    transparent 100%
  ) !important;
  box-shadow: 0 0 12px rgba(0, 220, 255, 0.45);
  opacity: 1 !important;
}
html[data-theme="dark"] .portal-link {
  color: var(--muted) !important;
}
html[data-theme="dark"] .portal-link.is-on {
  color: #7eefff !important;
  background: rgba(0, 212, 255, 0.1) !important;
  border-color: rgba(0, 220, 255, 0.45) !important;
  box-shadow: 0 0 10px rgba(0, 200, 255, 0.2);
}
/* Primary nav uses metal plate art — do not override with flat fills */
html[data-theme="dark"] .portal-nav .portal-link:not(.portal-link--icon),
html[data-theme="dark"] .portal-nav .portal-link:not(.portal-link--icon):hover,
html[data-theme="dark"] .portal-nav .portal-link:not(.portal-link--icon).is-on {
  background-color: transparent !important;
  background-image: url("/static/img/hud/btn-portal-nav.png?v=1") !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  border: 0 !important;
  border-radius: 0 !important;
}
html[data-theme="dark"] .portal-nav .portal-link:not(.portal-link--icon) {
  color: #a8c8d6 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .portal-nav .portal-link:not(.portal-link--icon):hover {
  color: #e8fbff !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .portal-nav .portal-link:not(.portal-link--icon).is-on {
  color: #7eefff !important;
  box-shadow: 0 0 14px rgba(0, 220, 255, 0.28) !important;
}
/* Primary nav square icons — no wide pill background */
html[data-theme="dark"] .portal-nav .portal-link.portal-link--icon,
html[data-theme="dark"] .portal-nav .portal-mission-btn,
html[data-theme="dark"] .portal-nav .portal-lab-btn,
html[data-theme="dark"] .portal-nav .portal-whats-new-btn,
html[data-theme="dark"] .portal-nav .portal-metrics-btn,
html[data-theme="dark"] .portal-nav .portal-subscription-btn,
html[data-theme="dark"] .portal-nav .portal-link.portal-link--icon:hover,
html[data-theme="dark"] .portal-nav .portal-mission-btn:hover,
html[data-theme="dark"] .portal-nav .portal-lab-btn:hover,
html[data-theme="dark"] .portal-nav .portal-whats-new-btn:hover,
html[data-theme="dark"] .portal-nav .portal-metrics-btn:hover,
html[data-theme="dark"] .portal-nav .portal-subscription-btn:hover,
html[data-theme="dark"] .portal-nav .portal-link.portal-link--icon.is-on,
html[data-theme="dark"] .portal-nav .portal-mission-btn.is-on,
html[data-theme="dark"] .portal-nav .portal-lab-btn.is-on,
html[data-theme="dark"] .portal-nav .portal-whats-new-btn.is-on,
html[data-theme="dark"] .portal-nav .portal-metrics-btn.is-on,
html[data-theme="dark"] .portal-nav .portal-subscription-btn.is-on {
  background-image: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: transparent !important;
}

/* Admin stage — solid black (same as Mission for now) */
html[data-theme="dark"] .admin-page,
html[data-theme="dark"] .admin-shell,
html[data-theme="dark"] body.admin-page {
  background-color: #000000 !important;
  background-image: none !important;
  background-size: auto !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
}
html[data-theme="dark"] .admin-nav,
html[data-theme="dark"] .ac-nav,
html[data-theme="dark"] .admin-side {
  border-right: 1px solid rgba(0, 180, 220, 0.2) !important;
  background: rgba(4, 10, 18, 0.55) !important;
  backdrop-filter: blur(12px);
}
html[data-theme="dark"] .ac-nav-btn.is-on,
html[data-theme="dark"] .admin-nav a.is-on {
  color: #7eefff !important;
  border-color: rgba(0, 220, 255, 0.5) !important;
  background: rgba(0, 212, 255, 0.1) !important;
}

html[data-theme="dark"] .widget-min-btn {
  border: 1px solid rgba(0, 200, 255, 0.35) !important;
  background: rgba(0, 16, 28, 0.4) !important;
  color: #8eb6c9 !important;
  border-radius: 3px !important;
  flex-shrink: 0;
}
html[data-theme="dark"] .widget-min-btn:hover {
  color: #00e5ff !important;
  border-color: rgba(0, 230, 255, 0.7) !important;
}

/* Heads stay on one line inside frame */
html[data-theme="dark"] .mission-widget-head {
  min-width: 0;
  gap: 0.35rem;
}
html[data-theme="dark"] .mission-widget-head .section-label,
html[data-theme="dark"] .mission-widget-head .cp-kicker,
html[data-theme="dark"] .mission-widget-head .si-kicker,
html[data-theme="dark"] .mission-widget-head .liq-kicker {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

html[data-theme="dark"] ::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}
html[data-theme="dark"] ::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.25);
}
html[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 180, 220, 0.35);
  border-radius: 4px;
}

html[data-theme="dark"] a {
  color: #5ee8ff;
}
html[data-theme="dark"] a:hover {
  color: #a8f4ff;
}

html[data-theme="dark"] .mission-widget.is-minimized {
  overflow: hidden !important;
  padding: 0.15rem 0.2rem !important;
  font-size: 0.72em !important;
}
/* Market board collapse under HUD chrome (match other rail widgets) */
html[data-theme="dark"] .board-wrap.mission-widget.is-minimized,
html[data-theme="dark"] .board-wrap-tall.mission-widget.is-minimized {
  flex: 0 0 auto !important;
  max-height: none !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden !important;
}
html[data-theme="dark"] .board-wrap.mission-widget.is-minimized > *:not(.mission-widget-head),
html[data-theme="dark"] .board-wrap-tall.mission-widget.is-minimized > *:not(.mission-widget-head) {
  display: none !important;
}

/*
  ==========================================================================
  SAFE GLASS (v10) — translucent without breaking Mission boot
  - No contain:paint (can blank/hang layout in Chromium)
  - No forced position/z-index on all children
  - Keep shell + cells translucent; stage-bg remains visible
  - Guarantee #app / .page visibility
  ==========================================================================
*/

/* Mission shell must always paint */
html[data-theme="dark"] #app.shell,
html[data-theme="dark"] .shell {
  min-height: 100vh !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: transparent !important;
}
html[data-theme="dark"] .stage {
  opacity: 1 !important;
  visibility: visible !important;
  background: transparent !important;
}
html[data-theme="dark"] .page.is-active {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Widget shells — clear glass, clip only overflow inside frame
   (operator PNG frames excluded: assets / auto / board / intel / coin / social / liq) */
html[data-theme="dark"] .mission-widget:not(.assets-widget):not(.auto-banner):not(.board-wrap):not(.intel-widget):not(.coin-profile):not(.social-panel):not(.liq-panel),
html[data-theme="dark"] .ledger-block,
html[data-theme="dark"] .social-panel,
html[data-theme="dark"] .glass-panel.mission-widget:not(.assets-widget),
html[data-theme="dark"] .cmd-desk-card,
html[data-theme="dark"] .admin-panel,
html[data-theme="dark"] .admin-sheet,
html[data-theme="dark"] .learn-desk {
  background: rgba(4, 12, 22, 0.08) !important;
  background-image: none !important;
  background-clip: padding-box !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: hidden !important;
  /* DO NOT use contain:paint here — it can blank widgets/pages */
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
}

/* Force nested solid fills open (targeted classes only — not universal *) */
html[data-theme="dark"] .mission-widget .intel-card,
html[data-theme="dark"] .mission-widget .cp-card,
html[data-theme="dark"] .mission-widget .si-card,
html[data-theme="dark"] .mission-widget .si-block,
html[data-theme="dark"] .mission-widget .si-channels,
html[data-theme="dark"] .mission-widget .asset-pill,
html[data-theme="dark"] .mission-widget .stat-pill,
html[data-theme="dark"] .mission-widget .metric-pill,
html[data-theme="dark"] .mission-widget .eq-stat,
html[data-theme="dark"] .mission-widget .kpi-chip,
html[data-theme="dark"] .mission-widget .stat-chip,
html[data-theme="dark"] .mission-widget .auto-kpi,
html[data-theme="dark"] .mission-widget .cp-metric,
html[data-theme="dark"] .mission-widget .si-metric,
html[data-theme="dark"] .mission-widget .hold-card,
html[data-theme="dark"] .mission-widget .edge-card,
html[data-theme="dark"] .mission-widget .table-wrap,
html[data-theme="dark"] .mission-widget .market-table-wrap,
html[data-theme="dark"] .mission-widget .chart-wrap,
html[data-theme="dark"] .mission-widget .asset-strip,
html[data-theme="dark"] .mission-widget .asset-strip--compact,
html[data-theme="dark"] .mission-widget .metric-strip,
html[data-theme="dark"] .assets-widget .chart-wrap,
html[data-theme="dark"] .assets-widget .asset-pill,
html[data-theme="dark"] .auto-banner .field-row,
html[data-theme="dark"] .auto-banner .stat-row,
html[data-theme="dark"] .auto-banner .auto-stats,
html[data-theme="dark"] .board-wrap .board-search,
html[data-theme="dark"] .board-wrap .board-tabs,
html[data-theme="dark"] .board-wrap .market-table-wrap,
html[data-theme="dark"] .liq-panel .liq-chart-wrap:not(.liq-zone),
html[data-theme="dark"] .ledger-block .table-wrap {
  background-color: rgba(4, 14, 26, 0.06) !important;
  background-image: none !important;
}
/* Plate chart zone stays transparent over frame art */
html[data-theme="dark"] #liq-panel .liq-zone--chart {
  background-color: transparent !important;
  background-image: none !important;
}

html[data-theme="dark"] .mission-widget table,
html[data-theme="dark"] .mission-widget th,
html[data-theme="dark"] .mission-widget td,
html[data-theme="dark"] .mission-widget tr,
html[data-theme="dark"] .board-wrap table,
html[data-theme="dark"] .board-wrap th,
html[data-theme="dark"] .board-wrap td,
html[data-theme="dark"] .board-wrap tr,
html[data-theme="dark"] .ledger-block table,
html[data-theme="dark"] .ledger-block th,
html[data-theme="dark"] .ledger-block td,
html[data-theme="dark"] .ledger-block tr {
  background-color: transparent !important;
  background-image: none !important;
  color: #e8f4fc !important;
}

/* Readable text on glass */
html[data-theme="dark"] .mission-widget,
html[data-theme="dark"] .auto-banner,
html[data-theme="dark"] .assets-widget,
html[data-theme="dark"] .board-wrap,
html[data-theme="dark"] .ledger-block {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
}

/* Buttons still translucent but clickable */
html[data-theme="dark"] .mission-widget .btn,
html[data-theme="dark"] .mission-widget button,
html[data-theme="dark"] .auto-banner .btn,
html[data-theme="dark"] .auto-banner button,
html[data-theme="dark"] .board-wrap button,
html[data-theme="dark"] .assets-widget button {
  background-color: rgba(0, 20, 36, 0.18) !important;
  background-image: none !important;
  color: #e8f4fc !important;
}
html[data-theme="dark"] .mission-widget .btn.primary,
html[data-theme="dark"] .auto-banner .btn.primary,
html[data-theme="dark"] .auto-banner #auto-apply {
  background-color: rgba(0, 180, 220, 0.18) !important;
  border-color: rgba(0, 230, 255, 0.75) !important;
}
html[data-theme="dark"] .mission-widget input,
html[data-theme="dark"] .mission-widget select,
html[data-theme="dark"] .auto-banner input,
html[data-theme="dark"] .auto-banner select,
html[data-theme="dark"] .board-wrap input {
  background-color: rgba(2, 8, 16, 0.2) !important;
  color: #e8f4fc !important;
}

/* Content scale — smaller so it clears metal frame art */
html[data-theme="dark"] .mission-widget,
html[data-theme="dark"] .auto-banner,
html[data-theme="dark"] .ledger-block,
html[data-theme="dark"] .assets-widget,
html[data-theme="dark"] .board-wrap,
html[data-theme="dark"] .intel-widget,
html[data-theme="dark"] .coin-profile,
html[data-theme="dark"] .social-panel {
  font-size: 0.72em !important;
}
/* liq-panel: own plate font-size under #liq-panel rules (not 0.72em shell scale) */

/* Keep dense tables/controls from spilling into the border-image rim */
html[data-theme="dark"] .mission-widget .table-wrap,
html[data-theme="dark"] .mission-widget .market-table-wrap,
html[data-theme="dark"] .board-wrap .market-table-wrap,
html[data-theme="dark"] .ledger-block .table-wrap,
html[data-theme="dark"] .assets-widget .chart-wrap,
html[data-theme="dark"] .mission-widget .chart-wrap,
html[data-theme="dark"] .mission-widget .asset-strip,
html[data-theme="dark"] .mission-widget .asset-strip--compact {
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: auto !important;
}

/* Heads / titles slightly tighter so they don't collide with top frame LED */
html[data-theme="dark"] .mission-widget-head .section-label,
html[data-theme="dark"] .mission-widget-head .cp-kicker,
html[data-theme="dark"] .mission-widget-head .si-kicker,
html[data-theme="dark"] .mission-widget-head .liq-kicker {
  font-size: 9px !important;
  letter-spacing: 0.08em !important;
}

/* Topbar solid black */
html[data-theme="dark"] .portal-topbar {
  background: #000000 !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #e8f4fc !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html[data-theme="dark"] .admin-nav,
html[data-theme="dark"] .ac-nav,
html[data-theme="dark"] .admin-side {
  background: rgba(4, 10, 18, 0.2) !important;
  backdrop-filter: none !important;
}

/* ==========================================================================
   EQUITY WIDGET ONLY (Total assets / #assets-widget)
   Frame paints on ::before (reliable). Content sits above on black fill.
   Slightly scaled content + modest inset so chrome never overlaps metal rim.
   ========================================================================== */
html[data-theme="dark"] #assets-widget.assets-widget,
html[data-theme="dark"] #assets-widget.assets-widget.mission-widget,
html[data-theme="dark"] #assets-widget.assets-widget.glass-panel,
html:not([data-theme="light"]) #assets-widget.assets-widget {
  /* Pinch content clear of left/right metal rails (frame ~838 wide) */
  --hud-equity-pad-y: 22px;
  /* Was 52 → 16 → 28; +1/16" (~6px) → 34px */
  --hud-equity-pad-x: 34px;
  position: relative !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  border-image: none !important;
  border-image-source: none !important;
  background: #000000 !important;
  background-color: #000000 !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: var(--hud-equity-pad-y) var(--hud-equity-pad-x) !important;
  margin: 0.65rem 0 0.45rem !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
  /* Scale head / chart chrome / metric pills slightly smaller to clear rim */
  font-size: 0.68em !important;
  line-height: 1.15 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  isolation: isolate;
}

/* Frame layer — expanded only. Collapsed uses onebar on element background. */
html[data-theme="dark"] #assets-widget.assets-widget:not(.is-minimized)::before,
html:not([data-theme="light"]) #assets-widget.assets-widget:not(.is-minimized)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background-color: transparent !important;
  /* Themes/Dark/PopUpMedium.jpg — equity + focus chart plate */
  background-image: url("/static/img/hud/frame-popup-medium.jpg?v=equity-popup-1") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}
/* Collapsed: never paint expanded equity plate */
html[data-theme="dark"] #assets-widget.assets-widget.is-minimized::before,
html[data-theme="dark"] #assets-widget.assets-widget.is-minimized::after,
html:not([data-theme="light"]) #assets-widget.assets-widget.is-minimized::before,
html:not([data-theme="light"]) #assets-widget.assets-widget.is-minimized::after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

html[data-theme="dark"] #assets-widget.assets-widget::after,
html:not([data-theme="light"]) #assets-widget.assets-widget::after {
  content: none !important;
  display: none !important;
}

/* Content above the frame art — never spill into L/R metal rails */
html[data-theme="dark"] #assets-widget.assets-widget > *,
html:not([data-theme="light"]) #assets-widget.assets-widget > * {
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
html[data-theme="dark"] #assets-widget .assets-widget-head,
html[data-theme="dark"] #assets-widget .chart-wrap,
html[data-theme="dark"] #assets-widget #equity-chart-wrap,
html[data-theme="dark"] #assets-widget .metrics-grid,
html[data-theme="dark"] #assets-widget .metrics-grid--12,
html[data-theme="dark"] #assets-widget .eq-legend {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}
html[data-theme="dark"] #assets-widget #equity-chart,
html[data-theme="dark"] #assets-widget canvas {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Head / toolbar — sit inside the void, not on the top LED bar */
html[data-theme="dark"] #assets-widget .assets-widget-head,
html[data-theme="dark"] #assets-widget .mission-widget-head,
html[data-theme="dark"] #assets-widget .chart-toolbar,
html[data-theme="dark"] #assets-widget .chart-toolbar--head,
html[data-theme="dark"] #assets-widget .section-row {
  margin: 0 0 0.22rem !important;
  padding: 0 !important;
  gap: 0.28rem 0.35rem !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  min-width: 0 !important;
}
html[data-theme="dark"] #assets-widget .section-label,
html[data-theme="dark"] #assets-widget #assets-chart-title {
  font-size: 0.95em !important;
  letter-spacing: 0.08em !important;
  line-height: 1.1 !important;
  margin: 0 !important;
  white-space: nowrap !important;
}
html[data-theme="dark"] #assets-widget .chart-toolbar--head {
  gap: 0.2rem 0.28rem !important;
}
html[data-theme="dark"] #assets-widget .range-btn,
html[data-theme="dark"] #assets-widget .btn.xs,
html[data-theme="dark"] #assets-widget .btn.ghost.xs,
html[data-theme="dark"] #assets-widget .glass-btn {
  font-size: 0.88em !important;
  line-height: 1.1 !important;
  padding: 0.18rem 0.32rem !important;
  min-height: 0 !important;
}
html[data-theme="dark"] #assets-widget .widget-min-btn {
  width: 1.25rem !important;
  height: 1.25rem !important;
  min-width: 1.25rem !important;
  font-size: 0.9em !important;
  padding: 0 !important;
}

/* Chart: bare glass in the transparent void — stage-bg reads through */
html[data-theme="dark"] #assets-widget .chart-wrap,
html[data-theme="dark"] #assets-widget .chart-wrap--modern,
html[data-theme="dark"] #assets-widget #equity-chart-wrap,
html[data-theme="dark"] .assets-widget .chart-wrap,
html[data-theme="dark"] .assets-widget .chart-wrap--modern {
  position: relative !important;
  border: none !important;
  border-width: 0 !important;
  border-style: none !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  margin: 0.08rem 0 0.22rem !important;
  padding: 0 !important;
  overflow: hidden !important;
  max-width: 100% !important;
}

html[data-theme="dark"] #assets-widget .chart-wrap::before,
html[data-theme="dark"] #assets-widget .chart-wrap::after,
html[data-theme="dark"] #assets-widget .chart-wrap--modern::before,
html[data-theme="dark"] #assets-widget .chart-wrap--modern::after,
html[data-theme="dark"] .assets-widget .chart-wrap::before,
html[data-theme="dark"] .assets-widget .chart-wrap::after,
html[data-theme="dark"] .assets-widget .chart-wrap--modern::before,
html[data-theme="dark"] .assets-widget .chart-wrap--modern::after {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
  border: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
}

html[data-theme="dark"] #assets-widget canvas,
html[data-theme="dark"] #assets-widget #equity-chart,
html[data-theme="dark"] .assets-widget canvas {
  background: transparent !important;
  display: block !important;
  max-width: 100% !important;
}

/* Metrics float in same void — fully clear, stage shows through */
html[data-theme="dark"] #assets-widget .metrics-grid,
html[data-theme="dark"] #assets-widget .metrics-grid--12,
html[data-theme="dark"] .assets-widget .metrics-grid {
  border: none !important;
  border-top: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  margin-top: 0.12rem !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  gap: 0.18rem !important;
}

html[data-theme="dark"] #assets-widget .m-cell,
html[data-theme="dark"] .assets-widget .m-cell {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(0, 200, 255, 0.1) !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0.18rem 0.28rem 0.2rem !important;
  min-height: 0 !important;
}
html[data-theme="dark"] #assets-widget .metrics-grid--12 .m-cell .t {
  font-size: 0.72em !important;
  letter-spacing: 0.08em !important;
  line-height: 1.1 !important;
  margin: 0 !important;
}
html[data-theme="dark"] #assets-widget .metrics-grid--12 .m-cell .v {
  font-size: 1.05em !important;
  margin: 0.06rem 0 0 !important;
  line-height: 1.1 !important;
}
html[data-theme="dark"] #assets-widget .metrics-grid--12 .m-cell .asset-sub {
  font-size: 0.78em !important;
  margin: 0.02rem 0 0 !important;
  line-height: 1.1 !important;
}

html[data-theme="dark"] #assets-widget .eq-legend,
html[data-theme="dark"] .assets-widget .eq-legend {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 0.1rem 0 0 !important;
  font-size: 0.85em !important;
}

/* Controls stay readable but not opaque slabs */
html[data-theme="dark"] #assets-widget .range-seg,
html[data-theme="dark"] #assets-widget .range-btn,
html[data-theme="dark"] #assets-widget .btn,
html[data-theme="dark"] #assets-widget button,
html[data-theme="dark"] #assets-widget .glass-btn {
  background-color: rgba(0, 20, 36, 0.12) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}
html[data-theme="dark"] #assets-widget .range-btn.is-on {
  background-color: rgba(0, 180, 220, 0.16) !important;
}

/* Minimized Total assets — nameplate above; one-bar under (module-collapsed) */
html[data-theme="dark"] #assets-widget.assets-widget.is-minimized,
html:not([data-theme="light"]) #assets-widget.assets-widget.is-minimized {
  padding: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
  aspect-ratio: auto !important;
  background: transparent !important;
  background-image: none !important;
  font-size: 0.72em !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Chart stage — a hair shorter so head + metrics stay inside the void */
html[data-theme="dark"] #assets-widget #equity-chart-wrap,
html[data-theme="dark"] #assets-widget .chart-wrap {
  height: 188px !important;
  max-height: 188px !important;
  min-height: 140px !important;
}

/* ==========================================================================
   AUTOPILOT WIDGET ONLY (#auto-banner)
   frame-autopilot.png is a LAYOUT PLATE (836×162), not a flat overlay.
   Designed zones (approx % of plate height):
     top rail  ~9–25%   → .auto-zone--head  (title / universe / tools)
     upper bay ~26–45%  → status + decision
     mid bay   ~48–70%  → style / aggression / engage
     bot slots ~74–91%  → 6 telemetry cells (one per metal slot)
   Lock aspect-ratio so slots stay true; map content with absolute zones.
   ========================================================================== */
/*
  CRITICAL: all content zones are position:absolute. Without an in-flow
  height source the box collapses to 0 and the frame "doesn't load".
  .auto-frame-sizer uses padding-top % (of WIDTH) = 162/836 plate ratio.
*/
/*
 * Expanded Autopilot: chrome shell only — frame art lives on .auto-plate-host
 * (module-collapsed). Do NOT paint/stretch the PNG on #auto-banner itself.
 */
#auto-banner.auto-banner,
html[data-theme="dark"] #auto-banner.auto-banner,
html[data-theme="dark"] #auto-banner.panel.auto-banner,
html[data-theme="dark"] #auto-banner.auto-banner.mission-widget,
html:not([data-theme="light"]) #auto-banner.auto-banner {
  --ap-inset-x: 3.6%;
  --ap-plate-h: 19.378%; /* 162/836 — kept for zone math */
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  /* Shell is not the plate — AR/art are on .auto-plate-host */
  aspect-ratio: auto !important;
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  border-image: none !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  margin: 0.45rem 0 0.35rem !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
  font-size: clamp(8px, 0.9vw, 10.5px) !important;
  line-height: 1.12 !important;
  display: flex !important;
  flex-direction: column !important;
  isolation: isolate;
}

/* In-flow height keeper (absolute kids do not stretch the parent) */
#auto-banner .auto-frame-sizer,
html[data-theme="dark"] #auto-banner .auto-frame-sizer,
html:not([data-theme="light"]) #auto-banner .auto-frame-sizer {
  display: block !important;
  width: 100% !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  padding-top: var(--ap-plate-h, 19.378%) !important;
  border: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  overflow: hidden !important;
  z-index: 0 !important;
}

/* No covering pseudo frame */
#auto-banner.auto-banner::before,
#auto-banner.auto-banner::after,
html[data-theme="dark"] #auto-banner.auto-banner::before,
html:not([data-theme="light"]) #auto-banner.auto-banner::before,
html[data-theme="dark"] #auto-banner.auto-banner::after,
html:not([data-theme="light"]) #auto-banner.auto-banner::after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
}

/* —— Zone: TOP RAIL (title · universe · tools · min) ——
   Nudge: right ~2 lines, up ~2 lines from prior placement. */
html[data-theme="dark"] #auto-banner .auto-zone--head,
html:not([data-theme="light"]) #auto-banner .auto-zone--head {
  position: absolute !important;
  /* Base inset + prior shift + 2 lines right (~2.2em) */
  left: calc(var(--ap-inset-x) + 3.55em) !important;
  right: max(0.2%, calc(var(--ap-inset-x) - 1.1em)) !important;
  /* Prior up-shift, then drop ~1 line + 4 hairs */
  top: calc(11.5% - 0.55em) !important;
  height: 14% !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 0 0.15em 0 0.1em !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.35em !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
html[data-theme="dark"] #auto-banner .auto-zone--head .section-label {
  font-size: 0.85em !important;
  letter-spacing: 0.12em !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
  text-align: left !important;
  justify-self: start !important;
  align-self: center !important;
  padding-left: 0.1em !important;
}
/* Restart / Refresh / Settings — up 2 hairs, right +5 hairs (title untouched) */
html[data-theme="dark"] #auto-banner .auto-tool-btn,
#auto-banner .auto-tool-btn {
  position: relative !important;
  transform: translate(1.15em, 0.3em) !important;
}
html[data-theme="dark"] #auto-banner .auto-head-right {
  margin-left: auto !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.35em !important;
  flex-wrap: nowrap !important;
}
html[data-theme="dark"] #auto-banner .auto-head-universe {
  flex-wrap: nowrap !important;
  overflow: hidden !important;
}
html[data-theme="dark"] #auto-banner .auto-universe-chips {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0.55em !important; /* space between Big / Mid / Small / Micro / Stocks */
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
html[data-theme="dark"] #auto-banner .auto-universe-chips > li {
  margin: 0 !important;
  padding: 0 !important;
}
html[data-theme="dark"] #auto-banner .auto-uni-chip {
  font-size: 0.78em !important;
  padding: 0.12em 0.4em !important;
  background: rgba(0, 30, 45, 0.25) !important;
  border: 1px solid rgba(0, 200, 255, 0.18) !important;
  border-radius: 2px !important;
  color: #e8f4fc !important;
  gap: 0.25em !important;
  display: inline-flex !important;
  align-items: center !important;
}
/* Universe checks: charcoal box · WHITE mark (never black-on-black) */
#auto-banner .auto-uni-chip input[type="checkbox"],
html[data-theme="dark"] #auto-banner .auto-uni-chip input[type="checkbox"],
html:not([data-theme="light"]) #auto-banner .auto-uni-chip input[type="checkbox"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 0.85em !important;
  height: 0.85em !important;
  min-width: 0.85em !important;
  min-height: 0.85em !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  border: 1.5px solid #8a9aaa !important;
  border-radius: 2px !important;
  background-color: #141a20 !important;
  background-image: none !important;
  cursor: pointer !important;
  vertical-align: middle !important;
  accent-color: #ffffff !important;
  color-scheme: dark !important;
}
#auto-banner .auto-uni-chip input[type="checkbox"]:checked,
html[data-theme="dark"] #auto-banner .auto-uni-chip input[type="checkbox"]:checked,
html:not([data-theme="light"]) #auto-banner .auto-uni-chip input[type="checkbox"]:checked {
  background-color: #1a222c !important;
  border-color: #e8f4fc !important;
  /* white check on charcoal */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5l3 3 6-6'/%3E%3C/svg%3E") !important;
  background-size: 0.7em 0.7em !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
#auto-banner .auto-uni-chip:has(input:checked),
html[data-theme="dark"] #auto-banner .auto-uni-chip:has(input:checked) {
  border-color: rgba(0, 220, 255, 0.45) !important;
  background: rgba(0, 40, 55, 0.4) !important;
  color: #ffffff !important;
  opacity: 1 !important;
}
#auto-banner .auto-uni-chip:has(input:not(:checked)),
html[data-theme="dark"] #auto-banner .auto-uni-chip:has(input:not(:checked)) {
  opacity: 0.72 !important;
}
html[data-theme="dark"] #auto-banner .auto-tool-btn,
html[data-theme="dark"] #auto-banner .widget-min-btn {
  height: 1.5em !important;
  min-height: 1.5em !important;
  padding: 0 0.4em !important;
  font-size: 0.78em !important;
  background: rgba(0, 30, 45, 0.25) !important;
  border: 1px solid rgba(0, 200, 255, 0.2) !important;
  box-shadow: none !important;
}

/* —— Zone: BODY (upper status bay + mid control bay) —— */
html[data-theme="dark"] #auto-banner .auto-zone--body,
html:not([data-theme="light"]) #auto-banner .auto-zone--body {
  position: absolute !important;
  left: var(--ap-inset-x) !important;
  right: var(--ap-inset-x) !important;
  top: 26% !important;
  bottom: 28% !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4% !important;
  min-height: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html[data-theme="dark"] #auto-banner .auto-nest,
html[data-theme="dark"] #auto-banner .auto-nest--status,
html[data-theme="dark"] #auto-banner .auto-nest--control,
html[data-theme="dark"] #auto-banner .auto-identity,
html[data-theme="dark"] #auto-banner .auto-identity.auto-status-line,
html[data-theme="dark"] #auto-banner .auto-head,
html[data-theme="dark"] #auto-banner .auto-control-row {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  margin: 0 !important;
}

/* Upper bay — status on ONE line: PAPER|LIVE · ENGAGED · Scanning · decision */
html[data-theme="dark"] #auto-banner .auto-nest--status {
  flex: 0 0 42% !important;
  padding: 0.15em 0.35em !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
}
html[data-theme="dark"] #auto-banner .auto-identity,
html[data-theme="dark"] #auto-banner .auto-identity.auto-status-line {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0.35em !important;
  width: 100% !important;
  min-width: 0 !important;
}
html[data-theme="dark"] #auto-banner .auto-mode-chip {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0.1em 0.45em !important;
  border-radius: 999px !important;
  border: 1px solid rgba(96, 165, 250, 0.5) !important;
  background: rgba(59, 130, 246, 0.16) !important;
  color: #93c5fd !important;
  font-size: 0.72em !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.15 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  font-family: inherit !important;
  box-shadow: none !important;
}
html[data-theme="dark"] #auto-banner .auto-mode-chip.is-live {
  border-color: rgba(74, 222, 128, 0.55) !important;
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
}
html[data-theme="dark"] #auto-banner .auto-status-sep {
  flex: 0 0 auto !important;
  opacity: 0.7 !important;
  color: rgba(160, 200, 220, 0.75) !important;
}
html[data-theme="dark"] #auto-banner .auto-status {
  font-size: 0.8em !important;
  letter-spacing: 0.14em !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}
html[data-theme="dark"] #auto-banner .auto-title {
  font-size: 1.05em !important;
  margin: 0 !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
}
html[data-theme="dark"] #auto-banner .auto-decision {
  font-size: 0.85em !important;
  margin: 0 !important;
  opacity: 0.85 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Mid bay — style · aggression · universe · engage (all inside plate) */
html[data-theme="dark"] #auto-banner .auto-nest--control {
  flex: 1 1 auto !important;
  padding: 0.08em 0.15em !important;
  min-height: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  align-items: center !important;
  /* visible so universe can nudge right without hard clip */
  overflow: visible !important;
  box-sizing: border-box !important;
}
html[data-theme="dark"] #auto-banner .auto-control-row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 0.28em !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  align-items: flex-end !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}
html[data-theme="dark"] #auto-banner .auto-field-lab,
html[data-theme="dark"] #auto-banner .auto-control-universe .auto-nest-label {
  font-size: 0.58em !important;
  margin: 0 0 0.1em !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: rgba(140, 190, 210, 0.75) !important;
  white-space: nowrap !important;
  line-height: 1.1 !important;
  display: block !important;
}
/* Style / aggression — 10% wider, raised ~5 hairs */
html[data-theme="dark"] #auto-banner .auto-field--style,
html[data-theme="dark"] #auto-banner .auto-field--agg {
  flex: 0 1 12.32em !important;
  min-width: 9.68em !important;
  max-width: 13.64em !important;
  box-sizing: border-box !important;
  position: relative !important;
  transform: translateY(-0.25em) !important; /* 5 hairs up */
}
html[data-theme="dark"] #auto-banner select,
html[data-theme="dark"] #auto-banner .field-select,
html[data-theme="dark"] #auto-banner .auto-select {
  width: 100% !important;
  max-width: 100% !important;
  height: 1.55em !important;
  min-height: 1.55em !important;
  font-size: 0.72em !important;
  padding: 0 0.25em !important;
  background: rgba(0, 20, 32, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.22) !important;
  border-radius: 3px !important;
  color: #e8f4fc !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}
/* Universe chips on control bar — right 100 hairs, up 3 hairs */
html[data-theme="dark"] #auto-banner .auto-control-universe,
#auto-banner .auto-control-universe {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  position: relative !important;
  /* prior right shift, then ~0.5in left — style/agg stay put */
  transform: translate(calc(5em - 0.5in), -0.15em) !important;
}
html[data-theme="dark"] #auto-banner .auto-control-universe .auto-universe-chips,
#auto-banner .auto-control-universe .auto-universe-chips {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0.5em !important; /* space between universe options */
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  align-items: center !important;
}
html[data-theme="dark"] #auto-banner .auto-control-universe .auto-universe-chips > li,
#auto-banner .auto-control-universe .auto-universe-chips > li {
  margin: 0 !important;
  padding: 0 !important;
}
html[data-theme="dark"] #auto-banner .auto-control-universe .auto-uni-chip,
#auto-banner .auto-control-universe .auto-uni-chip {
  font-size: 0.62em !important;
  padding: 0.12em 0.28em !important;
  background: rgba(0, 30, 45, 0.25) !important;
  border: 1px solid rgba(0, 200, 255, 0.18) !important;
  border-radius: 2px !important;
  color: #e8f4fc !important;
  gap: 0.18em !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
  height: 1.55em !important;
  box-sizing: border-box !important;
}
html[data-theme="dark"] #auto-banner .auto-control-universe .auto-uni-chip input[type="checkbox"],
#auto-banner .auto-control-universe .auto-uni-chip input[type="checkbox"] {
  width: 0.72em !important;
  height: 0.72em !important;
  min-width: 0.72em !important;
  min-height: 0.72em !important;
}
html[data-theme="dark"] #auto-banner .auto-actions {
  display: flex !important;
  gap: 0.22em !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  margin-left: 0.1em !important;
}
html[data-theme="dark"] #auto-banner .auto-actions .btn {
  height: 1.55em !important;
  min-height: 1.55em !important;
  padding: 0 0.45em !important;
  font-size: 0.72em !important;
  background: rgba(0, 30, 45, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.28) !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}
/* Engage/Disengage colors live in module-collapsed.css (green/red).
   Do not force cyan here — it washed out Disengage red until hover. */
html[data-theme="dark"] #auto-banner #btn-engage {
  /* intentionally no cyan background/border defaults */
}

/* —— Zone: BOTTOM 6 SLOTS (telemetry) ——
   Six equal cells sit inside the pre-drawn rounded metal bays. */
html[data-theme="dark"] #auto-banner .auto-zone--slots,
html:not([data-theme="light"]) #auto-banner .auto-zone--slots {
  position: absolute !important;
  left: var(--ap-inset-x) !important;
  right: var(--ap-inset-x) !important;
  top: 73.5% !important;
  height: 16.5% !important;
  bottom: auto !important;
  z-index: 2 !important;
  margin: 0 !important;
  padding: 0 0.15% !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: stretch !important;
}
html[data-theme="dark"] #auto-banner .auto-telemetry,
html:not([data-theme="light"]) #auto-banner .auto-telemetry {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 0.55% !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  background: transparent !important;
  border: none !important;
}
html[data-theme="dark"] #auto-banner .auto-telemetry li {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.1em !important;
  margin: 0 !important;
  padding: 0.15em 0.2em !important;
  min-width: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] #auto-banner .auto-telemetry .k {
  font-size: 0.62em !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: rgba(130, 180, 200, 0.7) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}
html[data-theme="dark"] #auto-banner .auto-telemetry .v {
  font-size: 0.95em !important;
  font-weight: 700 !important;
  color: #e8f4fc !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}

/*
  Minimized: nameplate above; one-bar under (module-collapsed owns bar art).
*/
#auto-banner.auto-banner.is-minimized,
html[data-theme="dark"] #auto-banner.auto-banner.is-minimized,
html:not([data-theme="light"]) #auto-banner.auto-banner.is-minimized {
  aspect-ratio: auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0.35rem 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 0.62rem !important;
  line-height: 1.1 !important;
  display: flex !important;
  flex-direction: column !important;
}
#auto-banner.auto-banner.is-minimized .auto-frame-sizer {
  display: block !important;
  padding-top: var(--ap-plate-h) !important;
  min-height: 0 !important;
  height: 0 !important;
}
#auto-banner.auto-banner.is-minimized .auto-zone--body,
#auto-banner.auto-banner.is-minimized .auto-zone--slots,
#auto-banner.auto-banner.is-minimized .auto-stack,
#auto-banner.auto-banner.is-minimized .auto-nest,
html[data-theme="dark"] #auto-banner.auto-banner.is-minimized .auto-zone--body,
html[data-theme="dark"] #auto-banner.auto-banner.is-minimized .auto-zone--slots {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
#auto-banner.auto-banner.is-minimized .auto-zone--head,
html[data-theme="dark"] #auto-banner.auto-banner.is-minimized .auto-zone--head {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 2.4% 0 3.2% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important; /* vertical center in frame */
  justify-content: flex-start !important;
  gap: 0.5rem !important;
  transform: none !important;
  overflow: hidden !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Collapsed title stays visible (blue left) — only hide expanded-zone chrome */
#auto-banner.auto-banner.is-minimized .auto-tool-btn,
#auto-banner.auto-banner.is-minimized .auto-head-universe {
  display: none !important;
}
/* Collapsed status stream layout/colors live in module-collapsed.css */
#auto-banner.auto-banner.is-minimized .auto-head-right,
#auto-banner.auto-banner.is-minimized .auto-head-tools {
  display: flex !important;
  flex: 0 0 auto !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  min-width: 0 !important;
  transform: none !important;
}
#auto-banner.auto-banner.is-minimized .widget-min-btn {
  position: relative !important;
  transform: none !important;
  margin: 0 !important;
  width: 1.35rem !important;
  height: 1.35rem !important;
  min-width: 1.35rem !important;
  font-size: 0.9rem !important;
  flex: 0 0 auto !important;
}
/* Expanded: hide collapsed status block */
#auto-banner.auto-banner:not(.is-minimized) .auto-min-status {
  display: none !important;
}

/* ==========================================================================
   MARKET BOARD (#market-board / .board-wrap-tall)
   Operator plate: frame-marketboard.png (native 273×489 — lock aspect).
   Never flex-grow the host: growing stretches the frame art after expand.
   Head / tabs / search stay fixed; pair list scrolls in .market-table-scroll.
   ========================================================================== */
#market-board.board-wrap,
#market-board.board-wrap:not(.is-minimized),
html[data-theme="dark"] #market-board.board-wrap,
html[data-theme="dark"] #market-board.board-wrap:not(.is-minimized),
html[data-theme="dark"] .board-wrap.board-wrap-tall.mission-widget[data-widget="market-board"],
html:not([data-theme="light"]) #market-board.board-wrap {
  /* Inset content into the void so chrome never overlaps metal rim */
  --mb-inset-t: 8.5%;
  --mb-inset-r: 10.5%;
  --mb-inset-b: 9.5%;
  --mb-inset-l: 10.5%;
  /* Native plate size — width drives height; do not grow into leftover rail */
  --mb-aspect-w: 273;
  --mb-aspect-h: 489;
  position: relative !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  /* Fixed plate geometry — matches frame-marketboard.png pixels */
  aspect-ratio: var(--mb-aspect-w) / var(--mb-aspect-h) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-image: none !important;
  background-color: #000000 !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: var(--mb-inset-t) var(--mb-inset-r) var(--mb-inset-b) var(--mb-inset-l) !important;
  margin: 0.35rem 0 0 !important;
  /* Shell must NOT scroll — only .market-table-scroll does. */
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
  /* Scale all board chrome + rows smaller so the void fits cleanly */
  font-size: 0.64em !important;
  isolation: isolate;
}

/* Frame art on ::before (content + scroll sit above) */
#market-board.board-wrap:not(.is-minimized)::before,
html[data-theme="dark"] #market-board.board-wrap:not(.is-minimized)::before,
html:not([data-theme="light"]) #market-board.board-wrap:not(.is-minimized)::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  background-color: transparent !important;
  background-image: url("/static/img/hud/frame-marketboard.png?v=2") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}
#market-board.board-wrap::after,
html[data-theme="dark"] #market-board.board-wrap::after {
  content: none !important;
  display: none !important;
}

/* All direct chrome above the frame */
#market-board.board-wrap > *,
html[data-theme="dark"] #market-board.board-wrap > * {
  position: relative !important;
  z-index: 1 !important;
}

#market-board:not(.is-minimized) .mission-widget-head,
#market-board:not(.is-minimized) .board-widget-head {
  flex: 0 0 auto !important;
  order: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 0 0.12rem !important;
  padding: 0 !important;
  min-height: 0 !important;
  gap: 0.2rem !important;
}
#market-board:not(.is-minimized) .section-label {
  font-size: 0.92em !important;
  letter-spacing: 0.08em !important;
  line-height: 1.1 !important;
  margin: 0 !important;
}
#market-board:not(.is-minimized) .widget-min-btn {
  width: 1.2rem !important;
  height: 1.2rem !important;
  min-width: 1.2rem !important;
  font-size: 0.85em !important;
  line-height: 1 !important;
  padding: 0 !important;
}

/* Chrome stack: Crypto/Stocks tabs → search typing bar → hint */
#market-board:not(.is-minimized) .board-chrome {
  flex: 0 0 auto !important;
  order: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.18rem !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 0.15rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  position: relative !important;
  z-index: 1 !important;
}
#market-board:not(.is-minimized) .board-tabs {
  display: flex !important;
  flex-direction: row !important;
  gap: 0.18rem !important;
  order: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  position: static !important;
  top: auto !important;
}
#market-board:not(.is-minimized) .board-tab {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  padding: 0.22rem 0.28rem !important;
  font-size: 0.88em !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  background: rgba(0, 25, 40, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.2) !important;
  border-radius: 4px !important;
  color: #c8e8f5 !important;
  box-shadow: none !important;
}
#market-board:not(.is-minimized) .board-tab.is-on {
  background: rgba(0, 160, 200, 0.22) !important;
  border-color: rgba(0, 230, 255, 0.55) !important;
  color: #ffffff !important;
}
/* Typing / search bar — always full width under the tab buttons */
#market-board:not(.is-minimized) .board-search-row {
  order: 1 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  position: static !important;
  top: auto !important;
}
#market-board:not(.is-minimized) .board-search,
#market-board:not(.is-minimized) #market-board-search {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0.24rem 0.38rem !important;
  font-size: 0.9em !important;
  line-height: 1.15 !important;
  background: rgba(0, 15, 25, 0.45) !important;
  border: 1px solid rgba(0, 200, 255, 0.22) !important;
  border-radius: 4px !important;
  color: #e8f4fc !important;
  box-shadow: none !important;
}
#market-board:not(.is-minimized) .board-tab-hint {
  order: 2 !important;
  color: rgba(140, 190, 210, 0.72) !important;
  margin: 0 !important;
  padding: 0 0.04rem !important;
  font-size: 0.72em !important;
  line-height: 1.15 !important;
  background: transparent !important;
  border: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#market-board .market-table-scroll {
  order: 3 !important;
}

/*
  SCROLL SURFACE — this is the only scroller.
  min-height:0 lets flex shrink inside the fixed-aspect plate void.
*/
#market-board:not(.is-minimized) .market-table-scroll,
html[data-theme="dark"] #market-board:not(.is-minimized) .market-table-scroll {
  /* Fill remaining height inside the fixed-aspect plate (no host grow) */
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  /* Reserve scrollbar space so mark/vol don't jump when overflow appears */
  scrollbar-gutter: stable !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  margin: 0 !important;
  padding: 0 0.05rem 0.1rem !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  touch-action: pan-y !important;
  /* Visible scrollbar on dark plate */
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 200, 255, 0.45) rgba(0, 0, 0, 0.35) !important;
}
/* Left rail: full column height (never shorter clamp that cuts widgets). */
html[data-theme="dark"] .rail-left,
html[data-theme="dark"] .rail-right {
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
#market-board:not(.is-minimized) .market-table-scroll::-webkit-scrollbar {
  width: 5px !important;
}
#market-board:not(.is-minimized) .market-table-scroll::-webkit-scrollbar-thumb {
  background: rgba(0, 200, 255, 0.4) !important;
  border-radius: 3px !important;
}
#market-board:not(.is-minimized) .market-table-scroll::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.35) !important;
}

#market-board:not(.is-minimized) table.board {
  width: 100% !important;
  border-collapse: collapse !important;
  background: transparent !important;
  font-size: 0.92em !important;
  table-layout: fixed !important;
}
/* Pair | Mark | Vol — market-cap order (Scan column removed) */
#market-board:not(.is-minimized) table.board th:nth-child(1),
#market-board:not(.is-minimized) table.board td[data-col="pair"] {
  width: auto !important;
  min-width: 0 !important;
}
#market-board:not(.is-minimized) table.board th:nth-child(2),
#market-board:not(.is-minimized) table.board td[data-col="mark"] {
  width: 5.4rem !important;
  max-width: 5.6rem !important;
  text-align: left !important;
  font-variant-numeric: tabular-nums !important;
}
#market-board:not(.is-minimized) table.board th:nth-child(3),
#market-board:not(.is-minimized) table.board td[data-col="vol"] {
  width: 3.6rem !important;
  max-width: 3.8rem !important;
  text-align: left !important;
  font-variant-numeric: tabular-nums !important;
}
#market-board:not(.is-minimized) table.board td[data-col="seat"] {
  display: none !important;
}
#market-board:not(.is-minimized) table.board thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 2 !important;
  padding: 0.22rem 0.18rem !important;
  font-size: 0.78em !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.1 !important;
  background: rgba(4, 10, 16, 0.96) !important;
  color: rgba(160, 200, 220, 0.85) !important;
  border-bottom: 1px solid rgba(0, 200, 255, 0.2) !important;
  backdrop-filter: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#market-board:not(.is-minimized) table.board tbody td {
  padding: 0.2rem 0.16rem !important;
  font-size: 0.92em !important;
  line-height: 1.15 !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(0, 180, 220, 0.08) !important;
  color: #e8f4fc !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#market-board:not(.is-minimized) table.board tbody tr:hover td {
  background: rgba(0, 180, 220, 0.06) !important;
}
#market-board:not(.is-minimized) table.board tbody tr.focus td {
  background: rgba(0, 200, 255, 0.1) !important;
}
#market-board:not(.is-minimized) table.board .pair-cell {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.22rem !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
#market-board:not(.is-minimized) table.board .coin-icon,
#market-board:not(.is-minimized) .coin-icon {
  width: 0.95rem !important;
  height: 0.95rem !important;
  min-width: 0.95rem !important;
  min-height: 0.95rem !important;
  flex: 0 0 auto !important;
}
#market-board:not(.is-minimized) table.board .pair {
  font-size: 0.95em !important;
  font-weight: 700 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#market-board:not(.is-minimized) table.board td.vol-cell {
  font-size: 0.88em !important;
}

/* Minimized: title only */
#market-board.board-wrap.is-minimized,
html[data-theme="dark"] #market-board.board-wrap.is-minimized {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 12px 16px !important;
}
#market-board.board-wrap.is-minimized > .board-chrome,
#market-board.board-wrap.is-minimized > .board-tabs,
#market-board.board-wrap.is-minimized > .board-search-row,
#market-board.board-wrap.is-minimized > .board-tab-hint,
#market-board.board-wrap.is-minimized > .market-table-scroll {
  display: none !important;
}

/* ==========================================================================
   OPEN DECISION (.intel-widget) — mid left rail
   Operator plate: frame-open-decision.png (same approach as Market Board)
   ========================================================================== */
.intel-widget.mission-widget[data-widget="intel"],
html[data-theme="dark"] .intel-widget.mission-widget[data-widget="intel"],
html[data-theme="dark"] .intel-widget,
html:not([data-theme="light"]) .intel-widget.mission-widget[data-widget="intel"] {
  --od-pad: 14px;
  position: relative !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-image: none !important;
  background-color: #000000 !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: var(--od-pad) !important;
  margin: 0 0 0.35rem !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
  font-size: 0.78em !important;
  isolation: isolate;
}

/* Frame art (content sits above) */
.intel-widget.mission-widget[data-widget="intel"]::before,
html[data-theme="dark"] .intel-widget.mission-widget[data-widget="intel"]::before,
html[data-theme="dark"] .intel-widget::before,
html:not([data-theme="light"]) .intel-widget.mission-widget[data-widget="intel"]::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  background-color: transparent !important;
  background-image: url("/static/img/hud/frame-open-decision.png?v=1") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}
.intel-widget.mission-widget[data-widget="intel"]::after,
html[data-theme="dark"] .intel-widget::after {
  content: none !important;
  display: none !important;
}

.intel-widget.mission-widget[data-widget="intel"] > *,
html[data-theme="dark"] .intel-widget > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Head: transparent title bar inside void (leave room for top-right cut) */
html[data-theme="dark"] .intel-widget .mission-widget-head,
html[data-theme="dark"] .intel-widget .intel-widget-head {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.35rem !important;
  margin: 0 1.6rem 0.35rem 0 !important; /* clear diagonal cut corner */
  padding: 0.05rem 0.1rem 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .intel-widget .section-label {
  margin: 0 !important;
  color: rgba(160, 210, 230, 0.9) !important;
  letter-spacing: 0.08em !important;
}
html[data-theme="dark"] .intel-widget .widget-min-btn {
  background: rgba(0, 30, 45, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.25) !important;
  color: #c8e8f5 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .intel-widget .intel-widget-body {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.35rem !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0.1rem 0.15rem !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Inner cards — glass chips in the void, not solid plates */
html[data-theme="dark"] .intel-widget .intel-strip {
  display: grid !important;
  gap: 0.35rem !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
}
html[data-theme="dark"] .intel-widget .intel-card {
  background: rgba(0, 18, 30, 0.28) !important;
  background-image: none !important;
  border: 1px solid rgba(0, 200, 255, 0.18) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  padding: 0.4rem 0.5rem 0.5rem !important;
}
html[data-theme="dark"] .intel-widget .intel-card .t,
html[data-theme="dark"] .intel-widget .intel-card .intel-title {
  color: rgba(140, 190, 210, 0.85) !important;
}
html[data-theme="dark"] .intel-widget .intel-card .big {
  color: #f0fbff !important;
}

/* Minimized: head only */
html[data-theme="dark"] .intel-widget.is-minimized,
.intel-widget.mission-widget[data-widget="intel"].is-minimized {
  flex: 0 0 auto !important;
  padding: 10px 14px !important;
  min-height: 0 !important;
}
html[data-theme="dark"] .intel-widget.is-minimized .intel-widget-body,
.intel-widget.mission-widget[data-widget="intel"].is-minimized .intel-widget-body {
  display: none !important;
}

/* ==========================================================================
   FOCUS ASSET (#coin-profile / .coin-profile)
   Operator plate: frame-focus-asset.png (same approach as Open Decision)
   ========================================================================== */
#coin-profile.coin-profile,
html[data-theme="dark"] #coin-profile.coin-profile,
html[data-theme="dark"] .coin-profile.mission-widget[data-widget="focus-asset"],
html[data-theme="dark"] .coin-profile,
html:not([data-theme="light"]) #coin-profile.coin-profile {
  --fa-pad: 14px;
  position: relative !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-image: none !important;
  background-color: #000000 !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: var(--fa-pad) !important;
  margin: 0 0 0.35rem !important;
  /* visible so Decision/Edge data-tip bubbles are not clipped by the metal rim */
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
  font-size: 0.78em !important;
  isolation: isolate;
}

#coin-profile.coin-profile::before,
html[data-theme="dark"] #coin-profile.coin-profile::before,
html[data-theme="dark"] .coin-profile.mission-widget[data-widget="focus-asset"]::before,
html[data-theme="dark"] .coin-profile::before,
html:not([data-theme="light"]) #coin-profile.coin-profile::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  background-color: transparent !important;
  background-image: url("/static/img/hud/frame-focus-asset.png?v=1") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  transform: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}
#coin-profile.coin-profile::after,
html[data-theme="dark"] .coin-profile::after {
  content: none !important;
  display: none !important;
}

#coin-profile.coin-profile > *,
html[data-theme="dark"] .coin-profile > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Head: logo + name + min — clear diagonal cut */
html[data-theme="dark"] #coin-profile .cp-head,
html[data-theme="dark"] #coin-profile .mission-widget-head {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  margin: 0 1.6rem 0.4rem 0 !important;
  padding: 0.05rem 0.1rem 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
html[data-theme="dark"] #coin-profile .cp-kicker {
  margin: 0 !important;
  color: rgba(160, 210, 230, 0.9) !important;
  letter-spacing: 0.08em !important;
}
html[data-theme="dark"] #coin-profile .cp-name {
  color: #f0fbff !important;
}
html[data-theme="dark"] #coin-profile .cp-ticker {
  color: rgba(140, 190, 210, 0.85) !important;
}
html[data-theme="dark"] #coin-profile .widget-min-btn {
  background: rgba(0, 30, 45, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.25) !important;
  color: #c8e8f5 !important;
  box-shadow: none !important;
  margin-left: auto !important;
}
html[data-theme="dark"] #coin-profile .cp-logo {
  background: rgba(0, 18, 30, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.2) !important;
  box-shadow: none !important;
}

/* Metric grid + L/S in the void */
html[data-theme="dark"] #coin-profile .cp-grid {
  display: grid !important;
  background: transparent !important;
  border: none !important;
  margin: 0 0 0.35rem !important;
  padding: 0 0.05rem !important;
  gap: 0.3rem !important;
}
html[data-theme="dark"] #coin-profile .cp-cell {
  background: rgba(0, 18, 30, 0.28) !important;
  background-image: none !important;
  border: 1px solid rgba(0, 200, 255, 0.16) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  padding: 0.35rem 0.4rem !important;
}
html[data-theme="dark"] #coin-profile .cp-lab {
  color: rgba(140, 190, 210, 0.8) !important;
}
html[data-theme="dark"] #coin-profile .cp-val {
  color: #f0fbff !important;
}
html[data-theme="dark"] #coin-profile .cp-sub {
  color: rgba(140, 190, 210, 0.72) !important;
  font-size: 0.72em !important;
  margin-top: 0.1rem !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
html[data-theme="dark"] #coin-profile .cp-val.is-up,
html[data-theme="dark"] #coin-profile .cp-val.allow {
  color: #3dffb0 !important;
}
html[data-theme="dark"] #coin-profile .cp-val.is-down,
html[data-theme="dark"] #coin-profile .cp-val.block {
  color: #ff6b7a !important;
}
html[data-theme="dark"] #coin-profile .cp-val.is-muted {
  color: rgba(200, 220, 235, 0.72) !important;
}
/* Decision + Edge sit in the same 2-col grid as Mkt / Vol */
html[data-theme="dark"] #coin-profile .cp-grid {
  grid-template-columns: 1fr 1fr !important;
  overflow: visible !important;
}
/* Short tips that escape the plate without getting cut by the left metal rail */
#coin-profile .cp-cell--decision,
#coin-profile .cp-cell--edge {
  overflow: visible !important;
  z-index: 6 !important;
}
#coin-profile .cp-cell--decision[data-tip]:hover::after,
#coin-profile .cp-cell--decision[data-tip]:focus-visible::after,
#coin-profile .cp-cell--edge[data-tip]:hover::after,
#coin-profile .cp-cell--edge[data-tip]:focus-visible::after {
  bottom: calc(100% + 6px) !important;
  top: auto !important;
  max-width: 10.5rem !important;
  width: max-content !important;
  padding: 0.32rem 0.45rem !important;
  font-size: 0.6rem !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  z-index: 9000 !important;
  transform: none !important;
}
/* Decision (left col): tip anchors left, opens up into free space */
#coin-profile .cp-cell--decision[data-tip]:hover::after,
#coin-profile .cp-cell--decision[data-tip]:focus-visible::after {
  left: 0 !important;
  right: auto !important;
}
/* Edge (right col): tip anchors right so it grows into the center stage, not the left frame */
#coin-profile .cp-cell--edge[data-tip]:hover::after,
#coin-profile .cp-cell--edge[data-tip]:focus-visible::after {
  left: auto !important;
  right: 0 !important;
}
html[data-theme="dark"] #coin-profile .cp-ls {
  background: rgba(0, 18, 30, 0.28) !important;
  background-image: none !important;
  border: 1px solid rgba(0, 200, 255, 0.18) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  margin: 0 !important;
  color: #e8f4fc !important;
}
html[data-theme="dark"] #coin-profile .cp-ls:hover {
  border-color: rgba(0, 230, 255, 0.4) !important;
  background: rgba(0, 30, 45, 0.35) !important;
}

/* Minimized: head only */
html[data-theme="dark"] #coin-profile.coin-profile.is-minimized,
#coin-profile.coin-profile.is-minimized {
  flex: 0 0 auto !important;
  padding: 10px 14px !important;
  min-height: 0 !important;
}
html[data-theme="dark"] #coin-profile.is-minimized .cp-grid,
#coin-profile.is-minimized .cp-grid {
  display: none !important;
}
/* L/S lives on Liquidations now — never show under Focus asset */
#coin-profile .cp-ls,
html[data-theme="dark"] #coin-profile .cp-ls {
  display: none !important;
}
/* ==========================================================================
   FOCUS SOCIAL (#social-panel)
   frame-focus-social.png LAYOUT PLATE 268×297 — measured horizontal edges:
     twin metrics metal   32.3% – 56.6%
     bar1 post body       64.0% – 74.1%   (most recent X post text · scroll)
     bar2 nameplate       74.1% – 83.5%   (influencer selector)
     body bay metal       85.5% – 94.9%   (3 logo bubbles · X · Meta · YouTube)
   Content sits INSIDE those metal fields via absolute si-zone % (not document flow).
   CRITICAL: kill app.css .social-panel padding/flex/max-height — they shift
   absolute zones off the plate art and let body text spill the frame.
   ========================================================================== */
#social-panel.social-panel,
html[data-theme="dark"] #social-panel.social-panel,
html[data-theme="dark"] .social-panel.mission-widget[data-widget="social"],
html:not([data-theme="light"]) #social-panel.social-panel,
html[data-theme="dark"] #social-panel.social-panel.mission-widget {
  --si-inset-x: 8.5%;
  /* 297÷268 plate height as % of width */
  --si-plate-h: 110.821%;
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  /* Beat app.css max-height:min(56vh,…) which squashes the plate */
  max-height: none !important;
  aspect-ratio: 268 / 297 !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-image: none !important;
  background-color: #000000 !important;
  background-image: url("/static/img/hud/frame-focus-social.png?v=7") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  /* Padding MUST be 0 — % zones are relative to padding box */
  padding: 0 !important;
  margin: 0 0 0.35rem !important;
  /* hidden when closed; open class allows picker overlay without reflow */
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
  font-size: clamp(8px, 0.95vw, 11px) !important;
  line-height: 1.12 !important;
  /* Not flex column — plate uses absolute zones + sizer */
  display: block !important;
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  gap: 0 !important;
  isolation: isolate;
  /* Note: avoid CSS contain — can blank layout in some engines with absolute zones */
}
/* While picker is open, allow the overlay to paint (still no layout reflow) */
#social-panel.social-panel.is-picking,
html[data-theme="dark"] #social-panel.social-panel.is-picking {
  overflow: visible !important;
  z-index: 40 !important;
}

/* In-flow height keeper (absolute zones do not stretch parent) */
#social-panel .si-frame-sizer,
html[data-theme="dark"] #social-panel .si-frame-sizer {
  display: block !important;
  width: 100% !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  padding-top: var(--si-plate-h, 110.821%) !important;
  border: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  overflow: hidden !important;
  z-index: 0 !important;
}

#social-panel.social-panel::before,
#social-panel.social-panel::after,
html[data-theme="dark"] #social-panel::before,
html[data-theme="dark"] #social-panel::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Shared zone base — fixed % boxes; content never grows the plate */
#social-panel .si-zone,
html[data-theme="dark"] #social-panel .si-zone {
  position: absolute !important;
  left: var(--si-inset-x) !important;
  right: var(--si-inset-x) !important;
  z-index: 2 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
  flex: none !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  transform: none !important;
}

/* —— HEAD —— */
#social-panel .si-zone--head,
html[data-theme="dark"] #social-panel .si-zone--head {
  top: 8.5% !important;
  height: 10.5% !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.3em !important;
  padding: 0.15em 0.2em !important;
}
#social-panel .si-zone--head .si-id {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  line-height: 1.05 !important;
}
#social-panel .si-zone--head .si-kicker {
  margin: 0 !important;
  font-size: 0.58em !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: rgba(160, 210, 230, 0.9) !important;
}
#social-panel .si-zone--head .si-name {
  margin: 0 !important;
  font-size: 0.82em !important;
  font-weight: 800 !important;
  color: #f0fbff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#social-panel .si-zone--head .si-ticker {
  margin: 0 !important;
  font-size: 0.62em !important;
  color: rgba(140, 190, 210, 0.85) !important;
}
#social-panel .si-zone--head .si-head-actions {
  display: flex !important;
  align-items: center !important;
  gap: 0.3em !important;
  flex: 0 0 auto !important;
}
#social-panel .si-zone--head .si-logo {
  width: 1.35em !important;
  height: 1.35em !important;
  border-radius: 50% !important;
  background: rgba(0, 18, 30, 0.4) !important;
  border: 1px solid rgba(0, 200, 255, 0.22) !important;
  overflow: hidden !important;
}
#social-panel .si-zone--head .widget-min-btn {
  width: 1.35em !important;
  height: 1.35em !important;
  font-size: 0.85em !important;
  background: rgba(0, 30, 45, 0.4) !important;
  border: 1px solid rgba(0, 200, 255, 0.28) !important;
  color: #c8e8f5 !important;
  box-shadow: none !important;
}

/* —— CHANNELS (void above twin panels) —— */
#social-panel .si-zone--channels,
html[data-theme="dark"] #social-panel .si-zone--channels {
  top: 20% !important;
  height: 7% !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.3em !important;
  padding: 0 0.15em !important;
}
#social-panel .si-zone--channels .si-channels-lab {
  flex: 0 0 auto !important;
  font-size: 0.55em !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: rgba(140, 190, 210, 0.75) !important;
  margin: 0 !important;
}
#social-panel .si-zone--channels .si-channel-links {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0.25em !important;
  overflow: hidden !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
#social-panel .si-zone--channels .si-chip {
  flex: 0 0 auto !important;
  font-size: 0.58em !important;
  padding: 0.12em 0.35em !important;
  background: rgba(0, 30, 45, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.22) !important;
  border-radius: 3px !important;
  color: #c8e8f5 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
#social-panel .si-zone--channels .si-muted {
  font-size: 0.58em !important;
  color: rgba(140, 190, 210, 0.55) !important;
}

/* —— TWIN METRICS inside metal bubbles (32.3%–56.6%) —— */
#social-panel .si-zone--metrics,
html[data-theme="dark"] #social-panel .si-zone--metrics {
  top: 33.5% !important;
  height: 22% !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 5% !important;
  padding: 2.2% 1.8% 1.8% !important;
  align-items: center !important;
  left: 8.5% !important;
  right: 8.5% !important;
  /* Mid scale: larger than plate base, not oversized in the bubbles */
  font-size: clamp(9.5px, 1.05vw, 12px) !important;
}
#social-panel .si-zone--metrics .si-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0.25em 0.3em !important;
  gap: 0.08em !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}
#social-panel .si-zone--metrics .si-lab {
  margin: 0 !important;
  font-size: 0.62em !important;
  font-weight: 700 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  color: rgba(150, 200, 220, 0.88) !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#social-panel .si-zone--metrics .si-big {
  margin: 0.1em 0 0 !important;
  font-size: 1.22em !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  color: #f0fbff !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: 0.01em !important;
}
#social-panel .si-zone--metrics .si-sub {
  margin: 0.06em 0 0 !important;
  font-size: 0.58em !important;
  font-weight: 550 !important;
  line-height: 1.15 !important;
  color: rgba(150, 200, 215, 0.8) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#social-panel .si-zone--metrics .si-bar {
  margin-top: 0.25em !important;
  height: 0.22em !important;
  border-radius: 2px !important;
  background: rgba(0, 40, 60, 0.45) !important;
  overflow: hidden !important;
  max-width: 92% !important;
  flex: 0 0 auto !important;
}
#social-panel .si-zone--metrics .si-bar i {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, rgba(0, 200, 255, 0.55), rgba(0, 255, 200, 0.75)) !important;
}

/*
 * Field order on plate:
 *   TOP    bar1 → post body text only (scroll)
 *   MIDDLE bar2 → influencer selector
 *   BOTTOM bay  → 3 equal logo bubbles (X · Meta · YouTube)
 */
/* —— FEED / post contents only (metal bar 1 · fit art · scroll) —— */
#social-panel .si-zone--feed,
html[data-theme="dark"] #social-panel .si-zone--feed {
  /* Metal bar1 interior — readable post body with internal scroll */
  top: 64.5% !important;
  height: 9.2% !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0.7% 0.8em !important;
  gap: 0 !important;
  left: 9% !important;
  right: 9% !important;
  overflow: hidden !important;
  z-index: 3 !important;
  flex: none !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#social-panel .si-zone--feed .si-posts {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: 100% !important;
  height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  margin: 0 !important;
  padding: 0 0.2em 0 0 !important;
  gap: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 220, 255, 0.55) rgba(0, 20, 30, 0.35) !important;
}
#social-panel .si-zone--feed .si-posts::-webkit-scrollbar {
  width: 4px !important;
}
#social-panel .si-zone--feed .si-posts::-webkit-scrollbar-track {
  background: rgba(0, 20, 30, 0.35) !important;
  border-radius: 3px !important;
}
#social-panel .si-zone--feed .si-posts::-webkit-scrollbar-thumb {
  background: rgba(0, 220, 255, 0.45) !important;
  border-radius: 3px !important;
}
#social-panel .si-zone--feed .si-post {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  max-height: none !important;
  overflow: visible !important;
  flex-shrink: 0 !important;
  display: block !important;
  height: auto !important;
}
/* No influencer name / meta — post body only */
#social-panel .si-zone--feed .si-post-top {
  display: none !important;
}
#social-panel .si-zone--feed .si-post-author,
#social-panel .si-zone--feed .si-post-eng {
  display: none !important;
}
#social-panel .si-zone--feed .si-post-text {
  margin: 0 !important;
  font-size: 0.72em !important;
  line-height: 1.28 !important;
  color: #e8f4fc !important;
  white-space: pre-wrap !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-overflow: unset !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#social-panel .si-zone--feed .si-post-body-link {
  color: inherit !important;
  text-decoration: none !important;
}
#social-panel .si-zone--feed .si-post-body-link:hover {
  color: rgba(0, 230, 255, 0.95) !important;
  text-decoration: underline !important;
}
#social-panel .si-zone--feed .si-empty {
  font-size: 0.6em !important;
  color: rgba(140, 190, 210, 0.55) !important;
  margin: 0 !important;
  padding: 0.1em 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* —— SUBJECT legacy (hidden) —— */
#social-panel .si-zone--subject,
html[data-theme="dark"] #social-panel .si-zone--subject {
  display: none !important;
}
#social-panel .si-subject-lab,
#social-panel .si-subject {
  display: none !important;
}

/* —— NAMEPLATE / influencer selector (middle metal bar) —— */
#social-panel .si-zone--nameplate,
html[data-theme="dark"] #social-panel .si-zone--nameplate {
  top: 75.2% !important;
  height: 7.5% !important;
  display: flex !important;
  align-items: center !important;
  padding: 0.4% 1.2% !important;
  overflow: hidden !important;
  z-index: 5 !important;
  left: 9% !important;
  right: 9% !important;
}
#social-panel .si-nameplate {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.35em !important;
  margin: 0 !important;
  padding: 0 0.55em !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #e8f4fc !important;
  cursor: pointer !important;
  text-align: left !important;
  font: inherit !important;
  min-height: 0 !important;
  max-height: 100% !important;
  height: 100% !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
}
#social-panel .si-nameplate:hover,
#social-panel .si-nameplate.is-open {
  background: rgba(0, 180, 220, 0.06) !important;
}
#social-panel .si-nameplate-handle {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  font-size: 0.72em !important;
  font-weight: 650 !important;
  letter-spacing: 0.02em !important;
  color: #d8eef8 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 1.1 !important;
}
#social-panel .si-nameplate-handle.is-empty {
  color: rgba(160, 200, 220, 0.5) !important;
  font-weight: 550 !important;
  font-style: italic !important;
}
#social-panel .si-nameplate-chev {
  flex: 0 0 auto !important;
  font-size: 0.75em !important;
  color: rgba(0, 220, 255, 0.7) !important;
  line-height: 1 !important;
}
/*
 * Account picker — panel-level overlay. Opens upward above the middle
 * selector bar so metal field % never reflow.
 */
#social-panel > .si-nameplate-menu,
#social-panel .si-nameplate-menu {
  position: absolute !important;
  left: 8% !important;
  right: 8% !important;
  top: 38% !important;
  bottom: 25.5% !important;
  height: auto !important;
  max-height: none !important;
  z-index: 50 !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  padding: 0.4em 0.35em 0.45em !important;
  background: rgba(4, 12, 20, 0.98) !important;
  border: 1px solid rgba(0, 200, 255, 0.35) !important;
  border-radius: 6px !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.6) !important;
  box-sizing: border-box !important;
  flex: none !important;
}

/* —— SOCIAL LINK BUBBLES (bottom bay · X · Meta · YouTube) —— */
#social-panel .si-zone--social-links,
html[data-theme="dark"] #social-panel .si-zone--social-links {
  top: 86.2% !important;
  height: 8.2% !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 4% !important;
  padding: 0.6% 6% !important;
  left: 9% !important;
  right: 9% !important;
  overflow: hidden !important;
  z-index: 4 !important;
  box-sizing: border-box !important;
}
#social-panel .si-bubble-link {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 2.15em !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  max-height: 92% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid rgba(0, 210, 255, 0.35) !important;
  background: radial-gradient(
    circle at 35% 30%,
    rgba(0, 80, 110, 0.55),
    rgba(0, 18, 28, 0.85)
  ) !important;
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.35) inset,
    0 0 10px rgba(0, 200, 255, 0.12) !important;
  color: #e8f7ff !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: border-color 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease,
    opacity 0.12s ease !important;
}
#social-panel .si-bubble-link:hover:not(.is-off) {
  border-color: rgba(0, 240, 255, 0.7) !important;
  box-shadow:
    0 0 0 1px rgba(0, 230, 255, 0.2) inset,
    0 0 14px rgba(0, 220, 255, 0.28) !important;
  transform: translateY(-1px) !important;
  color: #ffffff !important;
}
/* Dead/missing: still clickable so pilot can save a handle for that platform */
#social-panel .si-bubble-link.is-off {
  opacity: 0.5 !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  filter: grayscale(0.25) !important;
  border-style: dashed !important;
}
#social-panel .si-bubble-link.is-off:hover {
  opacity: 0.85 !important;
  border-color: rgba(0, 240, 255, 0.55) !important;
  filter: none !important;
}
#social-panel .si-bubble-ico {
  width: 52% !important;
  height: 52% !important;
  display: block !important;
}
#social-panel .si-bubble-ico--yt {
  width: 58% !important;
  height: 58% !important;
}
/* Brand tints (still HUD-readable) */
#social-panel .si-bubble-link[data-si-net="x"]:not(.is-off) {
  color: #f0f4f8 !important;
}
#social-panel .si-bubble-link[data-si-net="meta"]:not(.is-off) {
  color: #7eb6ff !important;
}
#social-panel .si-bubble-link[data-si-net="youtube"]:not(.is-off) {
  color: #ff7b7b !important;
}
#social-panel .si-nameplate-menu[hidden] {
  display: none !important;
}
#social-panel .si-nameplate-menu-h {
  margin: 0 0.3em 0.3em !important;
  font-size: 0.6em !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: rgba(140, 190, 210, 0.75) !important;
}
#social-panel .si-nameplate-opt {
  display: block !important;
  width: 100% !important;
  text-align: left !important;
  margin: 0 0 0.12em !important;
  padding: 0.32em 0.45em !important;
  background: rgba(0, 30, 45, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.12) !important;
  border-radius: 4px !important;
  color: #e8f4fc !important;
  cursor: pointer !important;
  font-size: 0.78em !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#social-panel .si-nameplate-opt:hover,
#social-panel .si-nameplate-opt.is-on {
  border-color: rgba(0, 230, 255, 0.45) !important;
  background: rgba(0, 160, 200, 0.18) !important;
}
#social-panel .si-nameplate-custom {
  margin: 0.4em 0.15em 0.25em !important;
  padding: 0.35em 0.3em !important;
  border-top: 1px solid rgba(0, 200, 255, 0.15) !important;
}
#social-panel .si-nameplate-custom-lab {
  display: block !important;
  margin: 0 0 0.25em !important;
  font-size: 0.58em !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(140, 190, 210, 0.75) !important;
}
#social-panel .si-nameplate-custom-row {
  display: flex !important;
  gap: 0.3em !important;
  align-items: center !important;
}
#social-panel .si-nameplate-input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  padding: 0.35em 0.45em !important;
  font-size: 0.75em !important;
  color: #e8f4fc !important;
  background: rgba(0, 15, 25, 0.65) !important;
  border: 1px solid rgba(0, 200, 255, 0.28) !important;
  border-radius: 4px !important;
  outline: none !important;
}
#social-panel .si-nameplate-input::placeholder {
  color: rgba(140, 190, 210, 0.45) !important;
}
#social-panel .si-nameplate-input:focus {
  border-color: rgba(0, 230, 255, 0.55) !important;
}
#social-panel .si-nameplate-add {
  flex: 0 0 auto !important;
  padding: 0.35em 0.55em !important;
  font-size: 0.7em !important;
  font-weight: 700 !important;
  color: #041018 !important;
  background: rgba(0, 220, 200, 0.85) !important;
  border: none !important;
  border-radius: 4px !important;
  cursor: pointer !important;
}
#social-panel .si-nameplate-add:hover {
  background: rgba(0, 240, 220, 0.95) !important;
}
#social-panel .si-nameplate-clear {
  display: block !important;
  width: 100% !important;
  margin-top: 0.15em !important;
  padding: 0.28em !important;
  background: transparent !important;
  border: 1px dashed rgba(0, 200, 255, 0.22) !important;
  border-radius: 4px !important;
  color: rgba(180, 210, 220, 0.7) !important;
  font-size: 0.65em !important;
  cursor: pointer !important;
}

/* Minimized: head strip only */
#social-panel.social-panel.is-minimized,
html[data-theme="dark"] #social-panel.social-panel.is-minimized {
  aspect-ratio: auto !important;
  height: auto !important;
  min-height: 2.4rem !important;
  padding: 0.45rem 0.65rem !important;
  background-size: 100% 100% !important;
}
#social-panel.is-minimized .si-frame-sizer {
  display: none !important;
  padding-top: 0 !important;
}
#social-panel.is-minimized .si-zone--head {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  height: auto !important;
}
#social-panel.is-minimized .si-zone--channels,
#social-panel.is-minimized .si-zone--metrics,
#social-panel.is-minimized .si-zone--nameplate,
#social-panel.is-minimized .si-zone--subject,
#social-panel.is-minimized .si-zone--feed,
#social-panel.is-minimized .si-zone--social-links {
  display: none !important;
}

/* ==========================================================================
   LIQUIDATIONS (#liq-panel)
   frame-liquidations.png LAYOUT PLATE 270×331 — empty metal frame.
   Content locked inside via absolute liq-zone % (never overlaps rim / never
   grows past plate aspect). Kill app.css flex/padding/max-height on panel.
   ========================================================================== */
#liq-panel.liq-panel,
html[data-theme="dark"] #liq-panel.liq-panel,
html[data-theme="dark"] .liq-panel.mission-widget[data-widget="liq-heatmap"],
html:not([data-theme="light"]) #liq-panel.liq-panel,
html[data-theme="dark"] #liq-panel.liq-panel.mission-widget {
  /* Measured rim: metal glow ~3–6% L, ~94–98% R — keep content clear of rim */
  --liq-inset-l: 9.5%;
  --liq-inset-r: 10.5%;
  /* 331÷270 */
  --liq-plate-h: 122.593%;
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 270 / 331 !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-image: none !important;
  background-color: #000000 !important;
  background-image: url("/static/img/hud/frame-liquidations.png?v=2") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  margin: 0 0 0.35rem !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: #e8f4fc !important;
  font-size: clamp(8px, 0.95vw, 11px) !important;
  line-height: 1.12 !important;
  display: block !important;
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  gap: 0 !important;
  isolation: isolate;
}

#liq-panel .liq-frame-sizer,
html[data-theme="dark"] #liq-panel .liq-frame-sizer {
  display: block !important;
  width: 100% !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  padding-top: var(--liq-plate-h, 122.593%) !important;
  border: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  overflow: hidden !important;
  z-index: 0 !important;
}

#liq-panel.liq-panel::before,
#liq-panel.liq-panel::after,
html[data-theme="dark"] #liq-panel::before,
html[data-theme="dark"] #liq-panel::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Shared absolute zone base — fixed % boxes inside the metal rim */
#liq-panel .liq-zone,
html[data-theme="dark"] #liq-panel .liq-zone {
  position: absolute !important;
  left: var(--liq-inset-l, 9.5%) !important;
  right: var(--liq-inset-r, 10.5%) !important;
  z-index: 2 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  min-height: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  flex: none !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  /* never paint under the rim */
  width: auto !important;
}

/* —— HEAD (title + range + actions) —— */
#liq-panel .liq-zone--head,
html[data-theme="dark"] #liq-panel .liq-zone--head {
  top: 5.5% !important;
  height: 13.5% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.3em !important;
  padding: 0.15em 0.15em 0.15em 0.1em !important;
  overflow: hidden !important;
}
#liq-panel .liq-zone--head .liq-id {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  line-height: 1.05 !important;
}
#liq-panel .liq-zone--head .liq-kicker {
  margin: 0 !important;
  font-size: 0.58em !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: rgba(160, 210, 230, 0.9) !important;
}
#liq-panel .liq-zone--head .liq-title {
  margin: 0.08em 0 0 !important;
  font-size: 0.95em !important;
  font-weight: 800 !important;
  color: #f0fbff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#liq-panel .liq-zone--head .liq-sub {
  margin: 0.06em 0 0 !important;
  font-size: 0.58em !important;
  color: rgba(140, 190, 210, 0.8) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#liq-panel .liq-zone--head .liq-head-actions {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.2em !important;
  flex: 0 1 auto !important;
  /* Keep range/details off the right metal rim */
  max-width: 52% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding-right: 0.1em !important;
}
#liq-panel .liq-zone--head .liq-window-seg {
  display: inline-flex !important;
  gap: 0.1em !important;
  padding: 0.1em !important;
  border-radius: 5px !important;
  border: 1px solid rgba(0, 200, 255, 0.22) !important;
  background: rgba(0, 18, 28, 0.45) !important;
  flex: 0 0 auto !important;
}
#liq-panel .liq-zone--head .liq-win-btn {
  border: 0 !important;
  background: transparent !important;
  color: rgba(160, 200, 220, 0.75) !important;
  font-size: 0.55em !important;
  font-weight: 750 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 0.22em 0.35em !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  line-height: 1 !important;
}
#liq-panel .liq-zone--head .liq-win-btn.is-on {
  background: rgba(0, 160, 200, 0.22) !important;
  color: #e8f7ff !important;
  border: 1px solid rgba(0, 220, 255, 0.35) !important;
}
#liq-panel .liq-zone--head .liq-open-link {
  font-size: 0.58em !important;
  padding: 0.2em 0.4em !important;
  min-height: 0 !important;
  height: auto !important;
  background: rgba(0, 30, 45, 0.35) !important;
  border: 1px solid rgba(0, 200, 255, 0.25) !important;
  color: #c8e8f5 !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}
#liq-panel .liq-zone--head .widget-min-btn {
  width: 1.35em !important;
  height: 1.35em !important;
  font-size: 0.85em !important;
  background: rgba(0, 30, 45, 0.4) !important;
  border: 1px solid rgba(0, 200, 255, 0.28) !important;
  color: #c8e8f5 !important;
  box-shadow: none !important;
  flex: 0 0 auto !important;
}

/* —— CHART (main bay inside frame) —— */
#liq-panel .liq-zone--chart,
html[data-theme="dark"] #liq-panel .liq-zone--chart {
  top: 19% !important;
  height: 46% !important;
  padding: 0 !important;
  border-radius: 0 !important;
  border: none !important;
  background: transparent !important;
  overflow: hidden !important;
  cursor: pointer !important;
  /* kill app.css fixed height:18rem which blows past the plate */
  min-height: 0 !important;
  max-height: none !important;
}
#liq-panel .liq-zone--chart #liq-chart {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
}
#liq-panel .liq-zone--chart .liq-empty {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35em !important;
  padding: 0.6em !important;
  text-align: center !important;
  background: rgba(0, 0, 0, 0.55) !important;
  backdrop-filter: none !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  z-index: 3 !important;
}
/* [hidden] must always win — was flashing over live chart on reload */
#liq-panel .liq-zone--chart .liq-empty[hidden],
#liq-panel .liq-empty[hidden],
html[data-theme="dark"] #liq-panel .liq-zone--chart .liq-empty[hidden] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}
#liq-panel .liq-zone--chart .liq-empty-title {
  margin: 0 !important;
  font-size: 0.85em !important;
  font-weight: 700 !important;
  color: #e8f4fc !important;
}
#liq-panel .liq-zone--chart .liq-empty-msg {
  margin: 0 !important;
  font-size: 0.62em !important;
  color: rgba(160, 200, 220, 0.75) !important;
  max-width: 100% !important;
  line-height: 1.3 !important;
}
#liq-panel .liq-zone--chart .liq-empty .btn {
  font-size: 0.65em !important;
  padding: 0.3em 0.55em !important;
  min-height: 0 !important;
}
#liq-panel .liq-zone--chart .liq-hover {
  position: absolute !important;
  z-index: 5 !important;
  min-width: 8.5em !important;
  max-width: 70% !important;
  padding: 0.35em 0.45em !important;
  border-radius: 5px !important;
  border: 1px solid rgba(0, 200, 255, 0.28) !important;
  background: rgba(4, 12, 20, 0.94) !important;
  color: #e8f4fc !important;
  font-size: 0.62em !important;
  pointer-events: none !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5) !important;
  box-sizing: border-box !important;
}

/* —— STATS strip —— */
#liq-panel .liq-zone--stats,
html[data-theme="dark"] #liq-panel .liq-zone--stats {
  top: 66.5% !important;
  height: 8% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 3% !important;
  padding: 0.4% 0.2em !important;
  align-items: stretch !important;
}

/* —— LONGS VS SHORTS (moved from Focus asset) — expanded plate only —— */
#liq-panel:not(.is-minimized) .liq-zone--ls,
html[data-theme="dark"] #liq-panel:not(.is-minimized) .liq-zone--ls,
#liq-panel:not(.is-minimized) #cp-ls.liq-ls {
  top: 75.5% !important;
  height: 15.5% !important;
  left: var(--liq-inset-l, 9.5%) !important;
  right: var(--liq-inset-r, 10.5%) !important;
  width: auto !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 0.15em !important;
  margin: 0 !important;
  padding: 0.28em 0.4em !important;
  border-radius: 5px !important;
  border: 1px solid rgba(0, 200, 255, 0.2) !important;
  background: rgba(0, 14, 24, 0.55) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  cursor: pointer !important;
  color: #e8f4fc !important;
  font: inherit !important;
  text-align: left !important;
  min-height: 0 !important;
  max-height: none !important;
  position: absolute !important;
}
#liq-panel .liq-zone--ls .cp-ls-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.35em !important;
  margin: 0 0 0.12em !important;
}
#liq-panel .liq-zone--ls .cp-ls-lab {
  font-size: 0.52em !important;
  font-weight: 750 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: rgba(140, 190, 210, 0.85) !important;
}
#liq-panel .liq-zone--ls .cp-ls-src {
  font-size: 0.52em !important;
  font-weight: 650 !important;
  color: rgba(160, 200, 220, 0.75) !important;
}
#liq-panel .liq-zone--ls .cp-ls-bar {
  display: flex !important;
  width: 100% !important;
  height: 6px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(0, 200, 255, 0.12) !important;
  margin: 0 !important;
}
#liq-panel .liq-zone--ls .cp-ls-fill {
  display: block !important;
  height: 100% !important;
  min-width: 0 !important;
}
#liq-panel .liq-zone--ls .cp-ls-fill-long {
  background: linear-gradient(90deg, #16a34a 0%, #4ade80 100%) !important;
}
#liq-panel .liq-zone--ls .cp-ls-fill-short {
  background: linear-gradient(90deg, #f87171 0%, #dc2626 100%) !important;
}
#liq-panel .liq-zone--ls .cp-ls-nums {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.25em !important;
  margin: 0.12em 0 0 !important;
  font-size: 0.68em !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
}
#liq-panel .liq-zone--ls .cp-ls-l {
  color: #4ade80 !important;
}
#liq-panel .liq-zone--ls .cp-ls-s {
  color: #f87171 !important;
  text-align: right !important;
}
#liq-panel .liq-zone--ls .cp-ls-r {
  color: rgba(160, 200, 220, 0.8) !important;
  font-size: 0.9em !important;
  font-weight: 600 !important;
}
#liq-panel .liq-zone--ls .cp-ls-cta {
  display: none !important; /* expanded plate is tight — detail via click */
}
#liq-panel .liq-zone--stats[hidden] {
  display: none !important;
}
#liq-panel .liq-zone--stats span {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 0.1em !important;
  padding: 0.25em 0.35em !important;
  border-radius: 4px !important;
  border: 1px solid rgba(0, 200, 255, 0.18) !important;
  background: rgba(0, 18, 28, 0.35) !important;
  min-width: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
#liq-panel .liq-zone--stats em {
  font-style: normal !important;
  font-size: 0.55em !important;
  font-weight: 750 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(140, 190, 210, 0.8) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#liq-panel .liq-zone--stats b {
  font-size: 0.78em !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  color: #e8f4fc !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* —— FOOT (tucked under L/S) —— */
#liq-panel .liq-zone--foot,
html[data-theme="dark"] #liq-panel .liq-zone--foot {
  top: 92% !important;
  height: 5% !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 0.25em !important;
  margin: 0 !important;
  font-size: 0.52em !important;
  color: rgba(140, 190, 210, 0.65) !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Minimized: head strip only */
#liq-panel.liq-panel.is-minimized,
html[data-theme="dark"] #liq-panel.liq-panel.is-minimized {
  aspect-ratio: auto !important;
  height: auto !important;
  min-height: 2.4rem !important;
  padding: 0.45rem 0.65rem !important;
  background-size: 100% 100% !important;
}
#liq-panel.is-minimized .liq-frame-sizer {
  display: none !important;
  padding-top: 0 !important;
}
#liq-panel.is-minimized .liq-zone--head {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  height: auto !important;
  max-width: 100% !important;
}
#liq-panel.is-minimized .liq-zone--chart,
#liq-panel.is-minimized .liq-zone--stats,
#liq-panel.is-minimized .liq-zone--foot {
  display: none !important;
}

/* ==========================================================================
   OPEN / CLOSED SEATS (#open-seats-panel · #closed-seats-panel)
   Structure:
     [ title row — centered ABOVE the frame ]   min right
     [ .ledger-plate  metal frame + content    ]
   expanded  (2–5 rows): frame-orders-expanded.png  1048×442
   collapsed (0–1 row):  frame-orders-collapsed.png ~1046×118
   ========================================================================== */

/* Shell: no plate art — title lives outside the metal frame */
#open-seats-panel.ledger-block,
#closed-seats-panel.ledger-block,
html[data-theme="dark"] #open-seats-panel.ledger-block,
html[data-theme="dark"] #closed-seats-panel.ledger-block {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 0.65rem !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-image: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #e8f4fc !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.28rem !important;
  isolation: isolate;
  padding: 0 !important;
  font-size: clamp(10px, 1.05vw, 13px) !important;
  line-height: 1.2 !important;
  aspect-ratio: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
}

#open-seats-panel::before,
#open-seats-panel::after,
#closed-seats-panel::before,
#closed-seats-panel::after,
html[data-theme="dark"] #open-seats-panel::before,
html[data-theme="dark"] #open-seats-panel::after,
html[data-theme="dark"] #closed-seats-panel::before,
html[data-theme="dark"] #closed-seats-panel::after {
  content: none !important;
  display: none !important;
}

/* Title row ABOVE the plate — title centered, min/actions right */
#open-seats-panel > .ledger-zone--head,
#closed-seats-panel > .ledger-zone--head {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 2.4rem !important; /* room for min / Full log without shifting center */
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 1.65rem !important;
  overflow: visible !important;
  text-align: center !important;
  background: transparent !important;
  z-index: 3 !important;
}
#open-seats-panel > .ledger-zone--head .section-label,
#closed-seats-panel > .ledger-zone--head .section-label {
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: calc(100% - 0.5rem) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  position: relative !important;
  z-index: 1 !important;
}
#open-seats-panel > .ledger-zone--head > .widget-min-btn,
#closed-seats-panel > .ledger-zone--head > .widget-min-btn,
#open-seats-panel > .ledger-zone--head > .section-head-actions,
#closed-seats-panel > .ledger-zone--head > .section-head-actions {
  position: absolute !important;
  right: 0.15rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  z-index: 2 !important;
}

/* Metal plate shell — holds frame art + orders / search status */
#open-seats-panel .ledger-plate,
#closed-seats-panel .ledger-plate {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 100% 100% !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  isolation: isolate;
}

/* Expanded plate (2–5 orders) */
#open-seats-panel.is-ledger-expanded .ledger-plate,
#closed-seats-panel.is-ledger-expanded .ledger-plate {
  background-image: url("/static/img/hud/frame-orders-expanded.png?v=4") !important;
  background-color: #050a10 !important;
  aspect-ratio: 1048 / 442 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 3.6% 4.2% 4% 4.2% !important;
  gap: 0.4rem !important;
  justify-content: flex-start !important;
}
#closed-seats-panel.is-ledger-expanded .ledger-plate {
  padding-top: 5.2% !important;
  padding-bottom: 3.2% !important;
}
#closed-seats-panel.is-ledger-expanded .ledger-plate .ledger-zone--hint,
#closed-seats-panel.is-ledger-expanded .ledger-plate .ledger-zone--body {
  position: relative !important;
  top: 0.35rem !important;
}

/* Collapsed plate (0–1 order) */
#open-seats-panel.is-ledger-collapsed .ledger-plate,
#closed-seats-panel.is-ledger-collapsed .ledger-plate {
  background-image: url("/static/img/hud/frame-orders-collapsed.png?v=3") !important;
  background-color: transparent !important;
  aspect-ratio: 1046 / 118 !important;
  min-height: 0 !important;
  height: auto !important;
  /* Clear metal corners; vertical pad slightly top-light so content sits higher */
  padding: 0.28rem 2.55rem 0.55rem 2.55rem !important;
  gap: 0 !important;
  justify-content: center !important;
  align-items: stretch !important;
}

#open-seats-panel .ledger-zone--hint,
#closed-seats-panel .ledger-zone--hint {
  flex: 0 0 auto !important;
  margin: 0 !important;
  color: rgba(160, 200, 220, 0.78) !important;
  font-size: 0.72em !important;
  line-height: 1.25 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#open-seats-panel .ledger-zone--body,
#closed-seats-panel .ledger-zone--body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  gap: 0.4rem !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 220, 255, 0.4) transparent !important;
}

/* Collapsed empty: "Searching…" centered inside the bar (title is above) */
#open-seats-panel.is-ledger-collapsed.is-empty-plate .ledger-plate,
#closed-seats-panel.is-ledger-collapsed.is-empty-plate .ledger-plate {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}
#open-seats-panel.is-ledger-collapsed.is-empty-plate .section-head-actions > *:not(.widget-min-btn),
#closed-seats-panel.is-ledger-collapsed.is-empty-plate .section-head-actions > *:not(.widget-min-btn) {
  display: none !important;
}
#open-seats-panel.is-ledger-collapsed.is-empty-plate .ledger-zone--hint,
#closed-seats-panel.is-ledger-collapsed.is-empty-plate .ledger-zone--hint {
  display: block !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  margin: 0 auto !important;
  padding: 0 0.5rem !important;
  max-width: min(70%, 22rem) !important;
  width: max-content !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  letter-spacing: 0.04em !important;
  color: rgba(180, 210, 225, 0.9) !important;
  text-transform: none !important;
  text-shadow: none !important;
  pointer-events: none !important;
  line-height: 1.2 !important;
}
#open-seats-panel.is-ledger-collapsed.is-empty-plate .ledger-zone--body,
#closed-seats-panel.is-ledger-collapsed.is-empty-plate .ledger-zone--body {
  display: none !important;
}

/* Collapsed with 1 active order: card only, centered high in the bar */
#open-seats-panel.is-ledger-collapsed:not(.is-empty-plate) .ledger-zone--hint,
#closed-seats-panel.is-ledger-collapsed:not(.is-empty-plate) .ledger-zone--hint {
  display: none !important;
}
#open-seats-panel.is-ledger-collapsed:not(.is-empty-plate) .ledger-plate,
#closed-seats-panel.is-ledger-collapsed:not(.is-empty-plate) .ledger-plate {
  display: flex !important;
  flex-direction: column !important;
  /* Bias content upward ~1–2 lines inside the metal channel */
  justify-content: flex-start !important;
  align-items: stretch !important;
  padding-top: 0.18rem !important;
  padding-bottom: 0.62rem !important;
}
#open-seats-panel.is-ledger-collapsed:not(.is-empty-plate) .ledger-zone--body,
#closed-seats-panel.is-ledger-collapsed:not(.is-empty-plate) .ledger-zone--body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
  gap: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
  /* Nudge active order card slightly up inside the frame (fine-tuned) */
  padding: 0 0.15rem !important;
  transform: translateY(-0.08rem) !important;
  box-sizing: border-box !important;
}
/* Only first seat/card visible in collapsed bar */
#open-seats-panel.is-ledger-collapsed .order-card:nth-child(n + 2),
#closed-seats-panel.is-ledger-collapsed .order-card:nth-child(n + 2) {
  display: none !important;
}

/* Compact order cards inside the plate (expanded default) */
#open-seats-panel .order-card,
#closed-seats-panel .order-card {
  background: rgba(0, 20, 32, 0.45) !important;
  border: 1px solid rgba(0, 200, 255, 0.16) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  padding: 0.45rem 0.55rem !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/*
 * Active order in collapsed bar:
 * full width of content channel, compact, nudged up (via body translateY)
 */
#open-seats-panel.is-ledger-collapsed .order-card,
#closed-seats-panel.is-ledger-collapsed .order-card {
  flex: 0 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: 0.16rem 0.55rem !important;
  border-radius: 6px !important;
  background: rgba(0, 18, 28, 0.42) !important;
  border: 1px solid rgba(0, 200, 255, 0.14) !important;
  max-height: 100% !important;
  overflow: hidden !important;
  align-items: center !important;
  column-gap: 0.4rem !important;
  row-gap: 0 !important;
  font-size: clamp(9px, 0.92vw, 11.5px) !important;
  line-height: 1.15 !important;
  box-sizing: border-box !important;
}
#open-seats-panel.is-ledger-collapsed .order-card .oc-detail,
#closed-seats-panel.is-ledger-collapsed .order-card .oc-detail {
  display: none !important;
}
#open-seats-panel.is-ledger-collapsed .order-card .oc-field,
#closed-seats-panel.is-ledger-collapsed .order-card .oc-field {
  min-width: 0 !important;
  overflow: hidden !important;
  gap: 0.05rem !important;
}
#open-seats-panel.is-ledger-collapsed .order-card .oc-label,
#closed-seats-panel.is-ledger-collapsed .order-card .oc-label {
  font-size: 0.58em !important;
  letter-spacing: 0.04em !important;
  line-height: 1.1 !important;
  margin: 0 !important;
  opacity: 0.78 !important;
}
#open-seats-panel.is-ledger-collapsed .order-card .oc-val,
#closed-seats-panel.is-ledger-collapsed .order-card .oc-val {
  font-size: 1em !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#open-seats-panel.is-ledger-collapsed .order-card .oc-pair-val .coin-icon,
#closed-seats-panel.is-ledger-collapsed .order-card .oc-pair-val .coin-icon {
  width: 0.95em !important;
  height: 0.95em !important;
}
#open-seats-panel.is-ledger-collapsed .order-card .oc-sub,
#closed-seats-panel.is-ledger-collapsed .order-card .oc-sub,
#open-seats-panel.is-ledger-collapsed .order-card .oc-fee-tag,
#closed-seats-panel.is-ledger-collapsed .order-card .oc-fee-tag {
  display: none !important;
}

/* User-minimized: title stays; plate collapses to thin bar (empty chrome) */
#open-seats-panel.is-minimized,
#closed-seats-panel.is-minimized {
  background: transparent !important;
  background-image: none !important;
  aspect-ratio: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  gap: 0.28rem !important;
}
#open-seats-panel.is-minimized .ledger-plate,
#closed-seats-panel.is-minimized .ledger-plate {
  display: none !important;
}
#open-seats-panel.is-minimized .section-head-actions > *:not(.widget-min-btn),
#closed-seats-panel.is-minimized .section-head-actions > *:not(.widget-min-btn) {
  display: none !important;
}

/* Full log stays secondary; min-btn styled by uniform mission collapse block */
#open-seats-panel .section-head-actions .btn,
#closed-seats-panel .section-head-actions .btn {
  background: rgba(0, 30, 45, 0.4) !important;
  border: 1px solid rgba(0, 200, 255, 0.28) !important;
  color: #c8e8f5 !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 0.28rem 0.5rem !important;
  min-height: 1.65rem !important;
  height: 1.65rem !important;
  display: inline-flex !important;
  align-items: center !important;
  border-radius: 6px !important;
}

/* ==========================================================================
   MISSION MODULE TITLES + COLLAPSE CONTROLS — uniform across all modules
   Left-centered titles · matching size/weight/color · min-btn top-right nest
   ========================================================================== */
/* Non-plate module heads only — plate modules (auto/social/liq) keep absolute zone geometry */
html[data-theme="dark"] .mission-widget > .mission-widget-head,
html[data-theme="dark"] .mission-widget > .section-head-row.mission-widget-head,
html[data-theme="dark"] .mission-widget > .assets-widget-head,
html[data-theme="dark"] .mission-widget > .board-widget-head,
html[data-theme="dark"] #open-seats-panel > .ledger-zone--head,
html[data-theme="dark"] #closed-seats-panel > .ledger-zone--head,
html[data-theme="dark"] #coin-profile .mission-widget-head,
html[data-theme="dark"] #assets-widget .mission-widget-head,
html[data-theme="dark"] .intel-widget .mission-widget-head,
html[data-theme="dark"] #market-board > .mission-widget-head {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.4rem !important;
  min-height: 1.85rem !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Left-centered module titles (same type across Mission) */
html[data-theme="dark"] .mission-widget-head .section-label,
html[data-theme="dark"] .mission-widget-head .cp-kicker,
html[data-theme="dark"] .mission-widget-head .si-kicker,
html[data-theme="dark"] .mission-widget-head .liq-kicker,
html[data-theme="dark"] .section-head-row .section-label,
html[data-theme="dark"] .assets-widget-head .section-label,
html[data-theme="dark"] .board-widget-head .section-label,
html[data-theme="dark"] .auto-widget-head .section-label,
html[data-theme="dark"] #social-panel .si-zone--head .si-kicker,
html[data-theme="dark"] #liq-panel .liq-zone--head .liq-kicker,
html[data-theme="dark"] #auto-banner .auto-zone--head .section-label,
html[data-theme="dark"] #coin-profile .cp-kicker,
html[data-theme="dark"] .intel-widget .section-label,
html[data-theme="dark"] .section-label {
  margin: 0 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  text-align: left !important;
  font-family: var(--font), -apple-system, BlinkMacSystemFont, "Helvetica Neue",
    Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  font-style: normal !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;
  color: #7eefff !important;
  text-shadow: 0 0 10px rgba(0, 220, 255, 0.3) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

/* Action cluster (Full log + min) stays top-right, min always outermost right */
html[data-theme="dark"] .mission-widget .section-head-actions,
html[data-theme="dark"] #closed-seats-panel .section-head-actions,
html[data-theme="dark"] #open-seats-panel .section-head-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.35rem !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
  min-width: 0 !important;
}

/* Uniform collapse (−/+) for non-plate modules (plate modules override below) */
html[data-theme="dark"] .mission-widget .widget-min-btn,
html[data-theme="dark"] #open-seats-panel .widget-min-btn,
html[data-theme="dark"] #closed-seats-panel .widget-min-btn,
html[data-theme="dark"] #coin-profile .widget-min-btn,
html[data-theme="dark"] #assets-widget .widget-min-btn,
html[data-theme="dark"] .intel-widget .widget-min-btn,
html[data-theme="dark"] #market-board .widget-min-btn {
  flex: 0 0 auto !important;
  width: 1.65rem !important;
  height: 1.65rem !important;
  min-width: 1.65rem !important;
  min-height: 1.65rem !important;
  max-width: 1.65rem !important;
  max-height: 1.65rem !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border-radius: 6px !important;
  border: 1px solid rgba(0, 200, 255, 0.35) !important;
  background: rgba(0, 16, 28, 0.5) !important;
  color: #8eb6c9 !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
html[data-theme="dark"] .mission-widget .widget-min-btn:hover,
html[data-theme="dark"] .mission-widget .widget-min-btn:focus-visible,
html[data-theme="dark"] #open-seats-panel .widget-min-btn:hover,
html[data-theme="dark"] #closed-seats-panel .widget-min-btn:hover {
  color: #00e5ff !important;
  border-color: rgba(0, 230, 255, 0.7) !important;
  background: rgba(0, 40, 55, 0.55) !important;
  outline: none !important;
}
html[data-theme="dark"] .mission-widget .widget-min-btn[aria-expanded="false"],
html[data-theme="dark"] #open-seats-panel .widget-min-btn[aria-expanded="false"],
html[data-theme="dark"] #closed-seats-panel .widget-min-btn[aria-expanded="false"] {
  color: #00e5ff !important;
  border-color: rgba(0, 220, 255, 0.45) !important;
}

/* When min-btn is a direct child of head (not inside actions), pin it right */
html[data-theme="dark"] .mission-widget-head > .widget-min-btn,
html[data-theme="dark"] .section-head-row > .widget-min-btn,
html[data-theme="dark"] #open-seats-panel .ledger-zone--head > .widget-min-btn,
html[data-theme="dark"] .si-head-actions > .widget-min-btn,
html[data-theme="dark"] .liq-head-actions > .widget-min-btn {
  margin-left: 0 !important;
  order: 99 !important;
}

/* Open/Closed seats: title centered ABOVE the metal plate (wins over left-title law) */
html[data-theme="dark"] #open-seats-panel > .ledger-zone--head .section-label,
html[data-theme="dark"] #closed-seats-panel > .ledger-zone--head .section-label,
#open-seats-panel > .ledger-zone--head .section-label,
#closed-seats-panel > .ledger-zone--head .section-label {
  text-align: center !important;
  flex: 0 1 auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
}
html[data-theme="dark"] #open-seats-panel > .ledger-zone--head > .widget-min-btn,
html[data-theme="dark"] #closed-seats-panel > .ledger-zone--head > .widget-min-btn,
html[data-theme="dark"] #open-seats-panel > .ledger-zone--head > .section-head-actions,
html[data-theme="dark"] #closed-seats-panel > .ledger-zone--head > .section-head-actions {
  position: absolute !important;
  right: 0.15rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-left: 0 !important;
}

/*
 * PLATE MODULE COLLAPSE CONTROLS
 * Autopilot / Focus social / Liquidations use absolute head rails inside metal
 * frames. Uniform 1.65rem min-btns + min-height heads overflowed and clipped
 * the collapse control. Pin min inside the head rail (top-right nest).
 */
#auto-banner .auto-zone--head,
html[data-theme="dark"] #auto-banner .auto-zone--head,
#social-panel .si-zone--head,
html[data-theme="dark"] #social-panel .si-zone--head,
#liq-panel .liq-zone--head,
html[data-theme="dark"] #liq-panel .liq-zone--head {
  min-height: 0 !important;
  width: auto !important;
  max-width: none !important;
  box-sizing: border-box !important;
  /* reserve right nest for collapse control so chips/tools never cover it */
  padding-right: 1.75em !important;
  overflow: hidden !important;
}

/* Autopilot only: whole top line — right 2 lines, up ~1 line (after 1-line drop) */
#auto-banner .auto-zone--head,
html[data-theme="dark"] #auto-banner .auto-zone--head {
  left: calc(var(--ap-inset-x) + 3.55em) !important;
  right: max(0.2%, calc(var(--ap-inset-x) - 1.1em)) !important;
  top: calc(11.5% - 0.55em) !important;
  height: 14% !important;
  padding-right: 1.55em !important;
  /* allow title pull-left (~50 hairs) without clipping */
  overflow: visible !important;
}

/* Restore autopilot right cluster (must grow; not flex:0 like seat actions) */
#auto-banner .auto-head-right,
html[data-theme="dark"] #auto-banner .auto-head-right {
  position: static !important;
  transform: none !important;
  display: flex !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin-left: auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.35em !important;
  overflow: hidden !important;
}
#auto-banner .auto-head-tools,
html[data-theme="dark"] #auto-banner .auto-head-tools {
  display: flex !important;
  align-items: center !important;
  gap: 0.3em !important;
  flex: 0 0 auto !important;
  position: static !important;
  overflow: visible !important;
}
/* Restart / Refresh / Settings: up 2 · right +5 (title stays put) */
#auto-banner .auto-head-tools .auto-tool-btn,
html[data-theme="dark"] #auto-banner .auto-head-tools .auto-tool-btn {
  position: relative !important;
  top: 0 !important;
  transform: translate(1.15em, 0.3em) !important;
}
#auto-banner .auto-zone--head .section-label,
html[data-theme="dark"] #auto-banner .auto-zone--head .section-label {
  flex: 0 0 auto !important;
  max-width: 40% !important;
  /* Left-align title; ~70 hairs left, 2 hairs down */
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0.35em !important;
  position: relative !important;
  left: -3.5em !important; /* was -2.5em; +20 hairs left */
  top: 0.1em !important; /* 2 hairs down */
  transform: none !important;
}

#social-panel .si-head-actions,
html[data-theme="dark"] #social-panel .si-head-actions,
#liq-panel .liq-head-actions,
html[data-theme="dark"] #liq-panel .liq-head-actions {
  position: static !important;
  transform: none !important;
  display: flex !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  margin-left: auto !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.25em !important;
  overflow: hidden !important;
  /* leave room for absolute min nest on the head */
  padding-right: 0.15em !important;
  max-width: calc(100% - 0.5em) !important;
}
/* Liq: range/details can shrink; never clip the collapse control nest */
#liq-panel .liq-zone--head .liq-head-actions {
  max-width: calc(58% - 0.2em) !important;
  overflow: hidden !important;
  padding-right: 0 !important;
}

/* Collapse control: fixed nest top-right of each plate head rail */
#auto-banner .widget-min-btn,
html[data-theme="dark"] #auto-banner .widget-min-btn,
#social-panel .widget-min-btn,
html[data-theme="dark"] #social-panel .widget-min-btn,
#liq-panel .widget-min-btn,
html[data-theme="dark"] #liq-panel .widget-min-btn {
  position: absolute !important;
  right: 0.15em !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 6 !important;
  flex: none !important;
  width: 1.3em !important;
  height: 1.3em !important;
  min-width: 1.05rem !important;
  min-height: 1.05rem !important;
  max-width: 1.35rem !important;
  max-height: 1.35rem !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border-radius: 4px !important;
  border: 1px solid rgba(0, 200, 255, 0.4) !important;
  background: rgba(0, 16, 28, 0.65) !important;
  color: #9ec8d8 !important;
  font-size: 0.95em !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* Autopilot min rides with the shifted rail; keep nest flush to rail right */
#auto-banner .widget-min-btn,
html[data-theme="dark"] #auto-banner .widget-min-btn {
  right: 0.05em !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}
#auto-banner .widget-min-btn:hover,
html[data-theme="dark"] #auto-banner .widget-min-btn:hover,
#social-panel .widget-min-btn:hover,
html[data-theme="dark"] #social-panel .widget-min-btn:hover,
#liq-panel .widget-min-btn:hover,
html[data-theme="dark"] #liq-panel .widget-min-btn:hover,
#auto-banner .widget-min-btn:focus-visible,
#social-panel .widget-min-btn:focus-visible,
#liq-panel .widget-min-btn:focus-visible {
  color: #00e5ff !important;
  border-color: rgba(0, 230, 255, 0.75) !important;
  background: rgba(0, 40, 55, 0.7) !important;
  outline: none !important;
}

/* Head actions: tools/logo/range sit left of the absolute min nest */
#auto-banner .auto-head-tools,
#social-panel .si-head-actions,
#liq-panel .liq-head-actions {
  margin-right: 1.55em !important;
}

/* ==========================================================================
   Mobile landscape cockpit: L|C|R full-height rails with independent scroll.
   Market board keeps native plate aspect (no content-grow stretch).
   ========================================================================== */
@media (max-width: 1100px) and (orientation: landscape) {
  html.mission-mobile-landscape #market-board.board-wrap:not(.is-minimized),
  html.mission-mobile-landscape[data-theme="dark"] #market-board.board-wrap:not(.is-minimized),
  html.mission-mobile-landscape #market-board.board-wrap-tall:not(.is-minimized) {
    flex: 0 0 auto !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
    aspect-ratio: 273 / 489 !important;
    max-height: none !important;
    min-height: 0 !important;
    height: auto !important;
  }
  html.mission-mobile-landscape #market-board:not(.is-minimized) .market-table-scroll,
  html.mission-mobile-landscape[data-theme="dark"] #market-board:not(.is-minimized) .market-table-scroll {
    flex: 1 1 auto !important;
    max-height: none !important;
    height: auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  html.mission-mobile-landscape[data-theme="dark"] .rail-left,
  html.mission-mobile-landscape[data-theme="dark"] .rail-right,
  html.mission-mobile-landscape .rail-left,
  html.mission-mobile-landscape .rail-right {
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    min-height: 0 !important;
    height: 100% !important;
    max-height: 100% !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
  }
  html.mission-mobile-landscape #liq-panel.liq-panel,
  html.mission-mobile-landscape[data-theme="dark"] #liq-panel.liq-panel {
    flex: 0 0 auto !important;
    max-height: none !important;
    height: auto !important;
  }
}

/* ==========================================================================
   SIDE MODULES — collapsed / minimized chrome
   Shared bar plate: frame-module-collapsed.png
   Title left-aligned inside the metal frame; compressed summary + expand btn.
   Applies to every rail (left + right) mission widget when minimized.
   ========================================================================== */
.rail .mission-widget.is-minimized,
html[data-theme="dark"] .rail .mission-widget.is-minimized,
html:not([data-theme="light"]) .rail .mission-widget.is-minimized,
.rail-left .mission-widget.is-minimized,
.rail-right .mission-widget.is-minimized,
html[data-theme="dark"] .rail-left .mission-widget.is-minimized,
html[data-theme="dark"] .rail-right .mission-widget.is-minimized,
/* Explicit plates that carry their own expanded frame art */
#open-decision.intel-widget.is-minimized,
#coin-profile.coin-profile.is-minimized,
#market-board.board-wrap.is-minimized,
#social-panel.social-panel.is-minimized,
#liq-panel.liq-panel.is-minimized,
html[data-theme="dark"] #open-decision.intel-widget.is-minimized,
html[data-theme="dark"] #coin-profile.coin-profile.is-minimized,
html[data-theme="dark"] #market-board.board-wrap.is-minimized,
html[data-theme="dark"] #social-panel.social-panel.is-minimized,
html[data-theme="dark"] #liq-panel.liq-panel.is-minimized {
  --mod-col-pad-x: 0.95rem;
  --mod-col-pad-y: 0.32rem;
  position: relative !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 2.65rem !important;
  max-height: 3.15rem !important;
  aspect-ratio: auto !important;
  margin: 0 0 0.35rem !important;
  padding: var(--mod-col-pad-y) var(--mod-col-pad-x) !important;
  overflow: hidden !important;
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  border-radius: 0 !important;
  border-image: none !important;
  border-image-source: none !important;
  background-color: #000000 !important;
  background-image: url("/static/img/hud/frame-module-collapsed.png?v=1") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  font-size: 0.85rem !important;
}

/* Kill plate sizers / absolute zone layout while collapsed */
.rail .mission-widget.is-minimized .si-frame-sizer,
.rail .mission-widget.is-minimized .liq-frame-sizer,
#social-panel.is-minimized .si-frame-sizer,
#liq-panel.is-minimized .liq-frame-sizer {
  display: none !important;
  padding-top: 0 !important;
  height: 0 !important;
}

/* Head is the only visible row — full width flex bar inside the frame */
.rail .mission-widget.is-minimized > .mission-widget-head,
.rail .mission-widget.is-minimized > .cp-head,
.rail .mission-widget.is-minimized > .si-head,
.rail .mission-widget.is-minimized > .liq-head,
.rail .mission-widget.is-minimized > .board-widget-head,
.rail .mission-widget.is-minimized > .intel-widget-head,
#open-decision.is-minimized > .mission-widget-head,
#coin-profile.is-minimized > .cp-head,
#market-board.is-minimized > .mission-widget-head,
#social-panel.is-minimized > .si-head,
#liq-panel.is-minimized > .liq-head {
  display: flex !important;
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 2.15rem !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.4rem !important;
  flex-wrap: nowrap !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: 0 !important;
  z-index: 2 !important;
}

/* Title — left aligned, never centered / never overlapping frame rim */
.rail .mission-widget.is-minimized .section-label,
.rail .mission-widget.is-minimized .cp-kicker,
.rail .mission-widget.is-minimized .si-kicker,
.rail .mission-widget.is-minimized .liq-kicker,
#open-decision.is-minimized .section-label,
#coin-profile.is-minimized .cp-kicker,
#market-board.is-minimized .section-label,
#social-panel.is-minimized .si-kicker,
#liq-panel.is-minimized .liq-kicker {
  flex: 0 1 auto !important;
  order: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: 38% !important;
  min-width: 0 !important;
  text-align: left !important;
  justify-self: start !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  line-height: 1.15 !important;
  color: #8ec8e0 !important;
  text-shadow: 0 0 8px rgba(0, 180, 255, 0.25);
}

/* Identity blocks collapse to title-only */
#coin-profile.is-minimized .cp-id,
#social-panel.is-minimized .si-id,
#liq-panel.is-minimized .liq-id {
  display: flex !important;
  flex-direction: column !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 38% !important;
  order: 1 !important;
  gap: 0 !important;
  margin: 0 !important;
}
#coin-profile.is-minimized .cp-name,
#coin-profile.is-minimized .cp-ticker,
#social-panel.is-minimized .si-name,
#social-panel.is-minimized .si-ticker,
#liq-panel.is-minimized .liq-title,
#liq-panel.is-minimized .liq-sub {
  display: none !important;
}
/* Small logo stays left of title on focus asset when present */
#coin-profile.is-minimized .cp-logo {
  display: block !important;
  order: 0 !important;
  flex: 0 0 1.35rem !important;
  width: 1.35rem !important;
  height: 1.35rem !important;
  min-width: 1.35rem !important;
  margin: 0 0.15rem 0 0 !important;
  border-radius: 4px !important;
  overflow: hidden !important;
}
#social-panel.is-minimized .si-logo {
  display: none !important;
}

/* Compressed one-line metrics from the expanded body */
.rail .mission-widget.is-minimized .widget-min-summary,
#open-decision.is-minimized .widget-min-summary,
#coin-profile.is-minimized .widget-min-summary,
#market-board.is-minimized .widget-min-summary,
#social-panel.is-minimized .widget-min-summary,
#liq-panel.is-minimized .widget-min-summary {
  display: flex !important;
  order: 2 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.35rem !important;
  margin: 0 0.2rem 0 0.25rem !important;
  padding: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 0.66rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: #d4eef8 !important;
  line-height: 1.15 !important;
  text-align: right !important;
}
.rail .mission-widget.is-minimized .widget-min-summary .wms-sep,
.widget-min-summary .wms-sep {
  opacity: 0.35;
  font-weight: 400;
  margin: 0 0.05rem;
}
.rail .mission-widget.is-minimized .widget-min-summary .wms-up {
  color: #3dffb0 !important;
}
.rail .mission-widget.is-minimized .widget-min-summary .wms-down {
  color: #ff6b7a !important;
}
.rail .mission-widget.is-minimized .widget-min-summary .wms-mute {
  color: rgba(160, 200, 220, 0.72) !important;
  font-weight: 500 !important;
}

/* Head actions: only expand/collapse control stays */
.rail .mission-widget.is-minimized .si-head-actions,
.rail .mission-widget.is-minimized .liq-head-actions,
#social-panel.is-minimized .si-head-actions,
#liq-panel.is-minimized .liq-head-actions {
  display: flex !important;
  order: 3 !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 !important;
  max-width: none !important;
}
#liq-panel.is-minimized .liq-window-seg,
#liq-panel.is-minimized .liq-open-link {
  display: none !important;
}

/* Expand (+) button — right edge, clear of frame rim */
.rail .mission-widget.is-minimized .widget-min-btn,
#open-decision.is-minimized .widget-min-btn,
#coin-profile.is-minimized .widget-min-btn,
#market-board.is-minimized .widget-min-btn,
#social-panel.is-minimized .widget-min-btn,
#liq-panel.is-minimized .widget-min-btn {
  order: 3 !important;
  flex: 0 0 auto !important;
  margin: 0 0 0 0.15rem !important;
  width: 1.55rem !important;
  height: 1.55rem !important;
  min-width: 1.55rem !important;
  padding: 0 !important;
  font-size: 0.95rem !important;
  line-height: 1 !important;
  border-radius: 5px !important;
  border-color: rgba(0, 200, 255, 0.28) !important;
  color: #7fd4ff !important;
  background: rgba(0, 30, 48, 0.45) !important;
}

/* Hide expanded bodies / absolute zones while collapsed */
#open-decision.is-minimized .intel-widget-body,
#coin-profile.is-minimized .cp-grid,
#coin-profile.is-minimized .cp-ls,
#market-board.is-minimized > .board-chrome,
#market-board.is-minimized > .board-tabs,
#market-board.is-minimized > .board-search-row,
#market-board.is-minimized > .board-tab-hint,
#market-board.is-minimized > .market-table-scroll,
#market-board.is-minimized > table.board,
#social-panel.is-minimized .si-zone--channels,
#social-panel.is-minimized .si-zone--metrics,
#social-panel.is-minimized .si-zone--nameplate,
#social-panel.is-minimized .si-zone--subject,
#social-panel.is-minimized .si-zone--feed,
#social-panel.is-minimized .si-zone--social-links,
#social-panel.is-minimized .si-influencers,
#liq-panel.is-minimized .liq-zone--chart,
#liq-panel.is-minimized .liq-zone--stats,
#liq-panel.is-minimized .liq-zone--foot,
#liq-panel.is-minimized .liq-chart-wrap,
#liq-panel.is-minimized .liq-stats,
#liq-panel.is-minimized .liq-foot {
  display: none !important;
  visibility: hidden !important;
  max-height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Mobile portrait stacked rails — same bar chrome */
@media (max-width: 900px) {
  .rail .mission-widget.is-minimized,
  #open-decision.is-minimized,
  #coin-profile.is-minimized,
  #market-board.is-minimized,
  #social-panel.is-minimized,
  #liq-panel.is-minimized {
    min-height: 2.55rem !important;
    max-height: 3rem !important;
    padding: 0.28rem 0.75rem !important;
  }
  .rail .mission-widget.is-minimized .section-label,
  .rail .mission-widget.is-minimized .cp-kicker,
  .rail .mission-widget.is-minimized .si-kicker,
  .rail .mission-widget.is-minimized .liq-kicker {
    max-width: 34% !important;
    font-size: 0.62rem !important;
  }
  .rail .mission-widget.is-minimized .widget-min-summary {
    font-size: 0.6rem !important;
  }
}

/* -------------------------------------------------------------------------
 * Open/closed order densify — jarvis loads last.
 * Desktop type restored; mobile-only shrinks fonts. Layout wrap on phone only.
 * ------------------------------------------------------------------------- */
#open-seats-panel .ledger-zone--body,
#closed-seats-panel .ledger-zone--body {
  container-type: inline-size !important;
  container-name: seats-ledger;
}

/*
 * Desktop / roomy web Mission only — original order-card type.
 * EXCLUDE phone landscape (often width 750–900px) so densify can apply there.
 * Never densify fonts/layout outside mobile selectors (yesterday's regression).
 */
@media (min-width: 901px) {
  #open-seats-panel:not(.is-ledger-collapsed) .order-card,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card,
  #open-seats-panel.is-ledger-expanded .order-card,
  #closed-seats-panel.is-ledger-expanded .order-card {
    font-size: 0.78rem !important;
    padding: 0.45rem 0.55rem !important;
    column-gap: 0.4rem !important;
    row-gap: 0.3rem !important;
    max-width: 100% !important;
    align-items: start !important;
    overflow: visible !important;
    max-height: none !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card.open-card.cols-11 {
    grid-template-columns:
      minmax(5.1rem, 1.15fr)
      minmax(3.1rem, 0.62fr)
      repeat(9, minmax(0, 1fr)) !important;
  }
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card.closed-card.cols-10 {
    grid-template-columns:
      minmax(5.1rem, 1.12fr)
      minmax(3.1rem, 0.62fr)
      repeat(8, minmax(0, 1fr)) !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-label,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-label {
    font-size: 0.58rem !important;
    letter-spacing: 0.09em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.15 !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val {
    font-size: inherit !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    word-break: normal !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val.price-full,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val.price-full {
    font-size: 0.78rem !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-all !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .name,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .name {
    font-size: inherit !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .coin-icon,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .coin-icon {
    width: 18px !important;
    height: 18px !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-sub,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-sub {
    font-size: 0.62rem !important;
  }
}

/*
 * Mobile only (portrait ≤700px OR phone landscape via mission-mobile-landscape
 * OR short landscape height). Multi-row grid + no ellipsis so values fit the bar.
 * Does not apply on desktop web (min-width 901px path above).
 */
@media (max-width: 700px) {
  #open-seats-panel:not(.is-ledger-collapsed) .order-card,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card,
  .order-bars .order-card,
  .open-orders .order-card,
  .closed-orders .order-card {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 0.2rem !important;
    row-gap: 0.22rem !important;
    padding: 0.3rem 0.34rem !important;
    font-size: 0.6rem !important;
    max-width: 100% !important;
    align-items: start !important;
    overflow: visible !important;
    max-height: none !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card.open-card.cols-11 > .oc-field:nth-child(1),
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card.closed-card.cols-10 > .oc-field:nth-child(1) {
    grid-column: span 2 !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-label,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-label,
  .order-bars .order-card .oc-label {
    font-size: 0.42rem !important;
    letter-spacing: 0.03em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val,
  .order-bars .order-card .oc-val {
    font-size: 0.58rem !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-word !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val.price-full,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val.price-full {
    font-size: 0.52rem !important;
    word-break: break-all !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .name,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .name {
    font-size: 0.6rem !important;
    white-space: normal !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .coin-icon,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-pair-val .coin-icon {
    width: 12px !important;
    height: 12px !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-sub,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-sub {
    font-size: 0.46rem !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-field,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-field {
    overflow: visible !important;
    min-width: 0 !important;
  }
  /* Collapsed thin bar: multi-row compact so metrics aren't ellipsized away */
  #open-seats-panel.is-ledger-collapsed .order-card,
  #closed-seats-panel.is-ledger-collapsed .order-card {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    font-size: clamp(8px, 2.4vw, 10px) !important;
    padding: 0.12rem 0.28rem !important;
    column-gap: 0.14rem !important;
    row-gap: 0.1rem !important;
    max-height: none !important;
    overflow: visible !important;
    align-items: start !important;
  }
  #open-seats-panel.is-ledger-collapsed .order-card .oc-field:nth-child(1),
  #closed-seats-panel.is-ledger-collapsed .order-card .oc-field:nth-child(1) {
    grid-column: span 2 !important;
  }
  #open-seats-panel.is-ledger-collapsed .order-card .oc-val,
  #closed-seats-panel.is-ledger-collapsed .order-card .oc-val {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-word !important;
    font-size: 1em !important;
  }
  #open-seats-panel.is-ledger-collapsed .order-card .oc-label,
  #closed-seats-panel.is-ledger-collapsed .order-card .oc-label {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

/* Phone landscape (JS flag) — same densify, desktop rules intentionally not applied */
html.mission-mobile-landscape #open-seats-panel:not(.is-ledger-collapsed) .order-card,
html.mission-mobile-landscape #closed-seats-panel:not(.is-ledger-collapsed) .order-card {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  column-gap: 0.22rem !important;
  row-gap: 0.18rem !important;
  padding: 0.28rem 0.36rem !important;
  font-size: 0.58rem !important;
  max-width: 100% !important;
  overflow: visible !important;
  max-height: none !important;
  align-items: start !important;
}
html.mission-mobile-landscape #open-seats-panel:not(.is-ledger-collapsed) .order-card.open-card.cols-11 > .oc-field:nth-child(1),
html.mission-mobile-landscape #closed-seats-panel:not(.is-ledger-collapsed) .order-card.closed-card.cols-10 > .oc-field:nth-child(1) {
  grid-column: span 2 !important;
}
html.mission-mobile-landscape #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-label,
html.mission-mobile-landscape #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-label {
  font-size: 0.4rem !important;
  letter-spacing: 0.03em !important;
}
html.mission-mobile-landscape #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val,
html.mission-mobile-landscape #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-val {
  font-size: 0.56rem !important;
  line-height: 1.12 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-word !important;
}
html.mission-mobile-landscape #open-seats-panel:not(.is-ledger-collapsed) .order-card .oc-field,
html.mission-mobile-landscape #closed-seats-panel:not(.is-ledger-collapsed) .order-card .oc-field {
  overflow: visible !important;
  min-width: 0 !important;
}
html.mission-mobile-landscape #open-seats-panel.is-ledger-collapsed .order-card,
html.mission-mobile-landscape #closed-seats-panel.is-ledger-collapsed .order-card {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  max-height: none !important;
  overflow: visible !important;
  font-size: clamp(8px, 1.6vw, 10px) !important;
  padding: 0.1rem 0.32rem !important;
  column-gap: 0.16rem !important;
  row-gap: 0.08rem !important;
  align-items: start !important;
}
html.mission-mobile-landscape #open-seats-panel.is-ledger-collapsed .order-card .oc-val,
html.mission-mobile-landscape #closed-seats-panel.is-ledger-collapsed .order-card .oc-val {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-word !important;
}

@media (max-width: 400px) {
  #open-seats-panel:not(.is-ledger-collapsed) .order-card,
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    font-size: 0.6rem !important;
  }
  #open-seats-panel:not(.is-ledger-collapsed) .order-card.open-card.cols-11 > .oc-field:nth-child(1),
  #closed-seats-panel:not(.is-ledger-collapsed) .order-card.closed-card.cols-10 > .oc-field:nth-child(1) {
    grid-column: span 1 !important;
  }
}