:root {
  color-scheme: dark;
  --bg: #151b27;
  --bg-2: #1b2331;
  --text: #d2d9e6;
  --muted: #8f99ab;
  --accent: #7b879a;
  --accent-2: #6f8ba8;
  --accent-3: #7f6e95;
  --card: rgba(28, 37, 52, 0.94);
  --deals-table-bg: rgba(10, 12, 30, 0.55);
  --border: rgba(156, 171, 196, 0.16);
  --mono: "IBM Plex Mono", "Courier New", monospace;
  --sans: "Space Grotesk", "Helvetica Neue", Arial, sans-serif;
  --ui-arrow-size: 13px;
  --ui-arrow-color: var(--text);
}

body.theme-alt-disabled {
  --bg: #0f1121;
  --bg-2: #0f1121;
  --text: #f5f7ff;
  --muted: #b8c0e6;
  --accent: #ffb454;
  --accent-2: #4dd5ff;
  --accent-3: #ff5d93;
  --card: rgba(20, 25, 52, 0.85);
  --deals-table-bg: rgba(10, 12, 30, 0.55);
  --border: rgba(255, 255, 255, 0.08);
}

body.theme-alt-disabled {
  color-scheme: light;
  --bg: #ffffff;
  --bg-2: #f8f9fc;
  --text: #1a1d2e;
  --muted: #5f6785;
  --accent: #d4882a;
  --accent-2: #1a9ec2;
  --accent-3: #d93d6f;
  --card: rgba(248, 249, 252, 0.96);
  --deals-table-bg: #ffffff;
  --border: rgba(0, 0, 0, 0.1);
}

body.theme-alt-disabled {
  background: linear-gradient(180deg, #c3c6ce 0%, #b1b6c0 56%, #9ea4af 100%) !important;
}

body.theme-alt-disabled .bg-orb {
  opacity: 0.78;
  filter: blur(0px);
  z-index: 1;
}

body.theme-alt-disabled .orb-a {
  background: radial-gradient(circle, rgba(255, 180, 84, 0.20), transparent 72%) !important;
}

body.theme-alt-disabled .orb-b {
  background: radial-gradient(circle, rgba(77, 213, 255, 0.38), transparent 72%) !important;
}

body.theme-alt-disabled .orb-c {
  background: radial-gradient(circle, rgba(255, 93, 147, 0.05), transparent 72%) !important;
}

body.theme-alt-disabled .app-shell,
body.theme-alt-disabled .main,
body.theme-alt-disabled .topbar,
body.theme-alt-disabled .content {
  background: transparent !important;
}

/* Blanket reset: remove all dark backgrounds in alternate mode */
body.theme-alt-disabled *:not(.bg-orb):not(.orb-a):not(.orb-b):not(.orb-c):not(.topbar):not(.sidebar):not(.toggle-btn):not(.chart-btn):not(.timeframe-btn):not(.positions-tab):not(.report-subtab):not(.switch-slider):not(.info-tip),
body.theme-alt-disabled *:not(.bg-orb):not(.orb-a):not(.orb-b):not(.orb-c):not(.topbar):not(.sidebar):not(.toggle-btn):not(.chart-btn):not(.timeframe-btn):not(.positions-tab):not(.report-subtab):not(.switch-slider):not(.info-tip)::before,
body.theme-alt-disabled *:not(.bg-orb):not(.orb-a):not(.orb-b):not(.orb-c):not(.topbar):not(.sidebar):not(.toggle-btn):not(.chart-btn):not(.timeframe-btn):not(.positions-tab):not(.report-subtab):not(.switch-slider):not(.info-tip)::after {
  background: transparent !important;
  scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
}

body.theme-alt-disabled .chart-card.chart-card,
body.theme-alt-disabled .chart-wrap.chart-wrap {
  background: var(--bg-2) !important;
}

body.theme-alt-disabled .switch-slider.switch-slider {
  background: linear-gradient(180deg, rgba(155, 164, 176, 0.94), rgba(232, 238, 246, 0.96)) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  box-shadow: 0 0 0 1px rgba(12, 18, 30, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
}

body.theme-alt-disabled .switch-slider.switch-slider::after {
  background: linear-gradient(180deg, #ffffff, #b8c2d1) !important;
}

body.theme-alt-disabled .switch input:checked + .switch-slider.switch-slider {
  box-shadow:
    0 0 0 1px rgba(12, 18, 30, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.7),
    0 0 12px rgba(46, 221, 243, 0.32) !important;
}

body.theme-alt-disabled .switch input:checked + .switch-slider.switch-slider::after {
  background: linear-gradient(180deg, #ffffff, #c7d7e9) !important;
}

body.theme-alt-disabled .tab-btn {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1);
}

body.theme-alt-disabled .tab-btn,
body.theme-alt-disabled .report-subtab,
body.theme-alt-disabled .report-tab,
body.theme-alt-disabled .positions-tab,
body.theme-alt-disabled .chart-btn,
body.theme-alt-disabled .timeframe-btn {
  border: 1px solid rgba(0, 0, 0, 0.14) !important;
}

body.theme-alt-disabled .tab-btn.is-active {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(26, 158, 194, 0.5);
  color: #1a9ec2;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 1px 4px rgba(0, 0, 0, 0.08);
}

body.theme-alt-disabled .notif-btn.notif-btn:hover,
body.theme-alt-disabled .user-action.user-action:hover {
  background: rgba(26, 158, 194, 0.08) !important;
}

body.theme-alt-disabled .toggle-btn.is-active,
body.theme-alt-disabled .chart-btn.is-active,
body.theme-alt-disabled .positions-tab.is-active,
body.theme-alt-disabled .report-subtab.is-active,
body.theme-alt-disabled .timeframe-btn.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.4);
  color: #0f3f67;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 2px 6px rgba(45, 123, 173, 0.14);
}

body.theme-alt-disabled .toggle-btn,
body.theme-alt-disabled .chart-btn,
body.theme-alt-disabled .timeframe-btn {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14);
  color: #3f4e66;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1);
}

body.theme-alt-disabled .positions-tab {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14);
  color: #3f4e66;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Keep active toggles visibly blue on Home cards */
body.theme-alt-disabled .toggle-btn.is-active,
body.theme-alt-disabled .chart-btn.is-active,
body.theme-alt-disabled .timeframe-btn.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.4) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 2px 6px rgba(45, 123, 173, 0.14) !important;
}

body.theme-alt-disabled .key-banner.key-banner {
  background: rgba(212, 136, 42, 0.08) !important;
}

body.theme-alt-disabled .card.card {
  background: var(--bg-2) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.14) !important;
  backdrop-filter: none;
}

body.theme-alt-disabled .status-card {
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border: 1px solid rgba(255, 255, 255, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
}

body.theme-alt-disabled .secondary-btn {
  border-color: rgba(0, 0, 0, 0.15);
  color: var(--text);
}

body.theme-alt-disabled .icon-btn {
  color: var(--muted);
}

body.theme-alt-disabled .icon-btn:hover {
  color: var(--accent-2);
}

body.theme-alt-disabled .edit-icon-ico {
  filter: brightness(0) saturate(100%) opacity(0.6);
}

body.theme-alt-disabled .sidebar.sidebar {
  background: var(--bg-2) !important;
}

body.theme-alt-disabled .ring-track {
  stroke: rgba(0, 0, 0, 0.1);
}

body.theme-alt-disabled .ring-tile.ring-tile,
body.theme-alt-disabled .ring-indicators-panel.ring-indicators-panel,
body.theme-alt-disabled .ring-summary-panel.ring-summary-panel,
body.theme-alt-disabled .report-metric.report-metric,
body.theme-alt-disabled .connection-status.connection-status,
body.theme-alt-disabled .connection-block.connection-block,
body.theme-alt-disabled .quote-ring-settings.quote-ring-settings,
body.theme-alt-disabled .scanner-row.scanner-row,
body.theme-alt-disabled .deals-row.deals-row,
body.theme-alt-disabled .deals-details.deals-details,
body.theme-alt-disabled .report-row.report-row,
body.theme-alt-disabled .config-section.config-section,
body.theme-alt-disabled .api-exchange-static.api-exchange-static,
body.theme-alt-disabled .settings-block.settings-block,
body.theme-alt-disabled .settings-row.settings-row,
body.theme-alt-disabled .ring-config.ring-config,
body.theme-alt-disabled .quote-ring.quote-ring,
body.theme-alt-disabled .quotes-table.quotes-table,
body.theme-alt-disabled .connection-log-list.connection-log-list,
body.theme-alt-disabled .quotes-leg.quotes-leg {
  background: var(--bg-2) !important;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.07) !important;
  border-radius: 12px;
}

body.theme-alt-disabled .avatar.avatar {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
  color: #fff;
}

body.theme-alt-disabled #user-menu-btn .avatar {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
  color: #121826 !important;
  border: none !important;
}

body.theme-alt-disabled .ring-card .ring-label,
body.theme-alt-disabled .ring-card .ring-indicators-header,
body.theme-alt-disabled .ring-card .ring-indicator .label,
body.theme-alt-disabled .ring-card .ring-indicator .value,
body.theme-alt-disabled .ring-card .ring-summary-row .label,
body.theme-alt-disabled .ring-card .ring-summary-row .value,
body.theme-alt-disabled .ring-card .ring-summary-open,
body.theme-alt-disabled .ring-card .ring-summary-balance,
body.theme-alt-disabled .ring-card .ring-summary-pnl,
body.theme-alt-disabled .ring-card .ring-summary-daily {
  font-weight: 700 !important;
}

body.theme-alt-disabled .quotes-card .quotes-leg .quotes-exchange,
body.theme-alt-disabled .quotes-card .quotes-leg .quotes-symbol,
body.theme-alt-disabled .quotes-card .quotes-leg .quotes-price,
body.theme-alt-disabled .quotes-card .quotes-leg .quotes-spread,
body.theme-alt-disabled .quotes-card .quotes-leg .quotes-depth,
body.theme-alt-disabled .quotes-card .quotes-leg .quotes-status,
body.theme-alt-disabled .quotes-card .quotes-ring-metrics,
body.theme-alt-disabled .quotes-card .quotes-ring-metrics .quotes-value,
body.theme-alt-disabled .quotes-card .quotes-ring-metrics .quotes-label {
  font-weight: 700 !important;
}

body.theme-alt-disabled .scanner-signals .scanner-signal {
  font-weight: 700 !important;
}

body.theme-alt-disabled .scanner-signals .scanner-signal {
  border-color: rgba(97, 113, 140, 0.55) !important;
  background: rgba(255, 255, 255, 0.92) !important;
}

body.theme-alt-disabled .user-pill {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
}

body.theme-alt-disabled .status-pill {
  background: rgba(236, 240, 247, 0.95) !important;
  border-color: rgba(73, 95, 128, 0.35) !important;
  color: #2f3e55 !important;
}

body.theme-alt-disabled .primary-btn.primary-btn {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
}

body.theme-alt-disabled .quote-add-btn.quote-add-btn {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
}

body.theme-alt-disabled .user-caret {
  color: var(--muted);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--sans);
  color: var(--text);
  background: var(--bg);
  overflow-x: hidden;
}

/* Main UI background inspired by Clerk docs look (dark, soft mesh gradient) */
body:not(.theme-alt-disabled) {
  background:
    radial-gradient(1200px 700px at -8% -18%, rgba(132, 99, 255, 0.24), transparent 60%),
    radial-gradient(980px 620px at 108% -10%, rgba(73, 206, 255, 0.18), transparent 62%),
    radial-gradient(760px 520px at 48% 108%, rgba(255, 130, 186, 0.1), transparent 66%),
    linear-gradient(180deg, #090d1d 0%, #0b1227 52%, #090f1f 100%);
}

body.test-mode:not(.theme-alt-disabled) .app-shell {
  background:
    repeating-linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.02) 0px,
      rgba(255, 255, 255, 0.02) 1px,
      transparent 1px,
      transparent 12px
    ),
    repeating-linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.015) 0px,
      rgba(255, 255, 255, 0.015) 1px,
      transparent 1px,
      transparent 12px
    );
}

.bg-orb {
  position: fixed;
  border-radius: 50%;
  filter: blur(0px);
  opacity: 0.78;
  pointer-events: none;
  z-index: 0;
}

.orb-a {
  width: 560px;
  height: 560px;
  background: radial-gradient(circle, rgba(255, 180, 84, 0.20), transparent 72%);
  right: -140px;
  bottom: -170px;
}

.orb-b {
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, rgba(77, 213, 255, 0.38), transparent 72%);
  bottom: -160px;
  left: -140px;
}

.orb-c {
  width: 840px;
  height: 840px;
  background: radial-gradient(circle, rgba(255, 93, 147, 0.05), transparent 72%);
  top: -120px;
  right: -90px;
}

.app-shell {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  min-height: 100vh;
  background: var(--bg);
}

.app-shell.is-collapsed {
  grid-template-columns: 72px minmax(0, 1fr);
}

.sidebar {
  background: transparent;
  border-right: 1px solid var(--border);
  padding: 28px 18px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.app-shell.is-collapsed .sidebar {
  padding: 20px 10px;
  align-items: center;
}

.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 0;
  font-weight: 600;
  letter-spacing: 0.4px;
}

.topbar-brand {
  display: flex;
  align-items: center;
  min-width: 0;
}

.topbar-logo {
  width: auto;
  height: auto;
  max-height: 38px;
  display: block;
}

.sidebar-toggle {
  margin-left: auto;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.sidebar-toggle svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.2s ease;
}

.app-shell.is-collapsed .sidebar-toggle svg {
  transform: rotate(180deg);
}

.app-shell.is-collapsed .sidebar-brand {
  width: 100%;
  justify-content: center;
  gap: 0;
}

.app-shell.is-collapsed .sidebar-toggle {
  margin-left: 0;
}

.brand-text {
  font-size: 16px;
  text-transform: uppercase;
  margin-left: 0;
}

.sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 25px;
  width: 100%;
}

.app-shell.is-collapsed .sidebar-nav {
  align-items: center;
  margin-top: 35px;
}

.sidebar-footer {
  margin-top: auto;
  font-size: 12px;
  color: var(--muted);
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.app-shell.is-collapsed .sidebar-footer {
  display: none;
}

.sidebar-version {
  font-size: 8px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}

.main {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 28px;
  gap: 18px;
  border-bottom: 1px solid var(--border);
  background: var(--bg);
}

.topbar-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-left: auto;
}

.notif-menu {
  position: relative;
}

.notif-menu::after {
  content: '';
  position: absolute;
  left: -6px;
  right: -6px;
  top: 100%;
  height: 12px;
}

.notif-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  cursor: pointer;
}

.notif-btn svg {
  width: 18px;
  height: 18px;
}

.notif-btn:hover {
  border-color: rgba(77, 213, 255, 0.6);
  color: var(--accent-2);
  background: rgba(77, 213, 255, 0.08);
}

.notif-btn.has-new {
  color: #4dd5ff;
  border-color: rgba(77, 213, 255, 0.7);
  box-shadow: 0 0 0 1px rgba(77, 213, 255, 0.26), 0 4px 16px rgba(77, 213, 255, 0.2);
  background: rgba(77, 213, 255, 0.12);
}

body:not(.theme-alt-disabled) .notif-btn.has-new {
  color: #ffe1b6;
  border-color: rgba(255, 180, 84, 0.7);
  box-shadow: 0 0 0 1px rgba(255, 180, 84, 0.26), 0 4px 16px rgba(255, 180, 84, 0.2);
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.22), rgba(255, 180, 84, 0.26));
}

.notif-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  min-width: 220px;
  background: rgba(12, 14, 26, 0.98);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px;
  display: none;
  box-shadow: 0 18px 30px rgba(0, 0, 0, 0.35);
  z-index: 3000;
}

.notif-dropdown.is-open {
  display: grid;
  gap: 8px;
}

.notif-menu:hover .notif-dropdown {
  display: grid;
  gap: 8px;
}

.notif-dropdown-header {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
  padding-bottom: 6px;
}

.notif-list {
  display: grid;
  gap: 8px;
  max-height: 320px;
  overflow: auto;
  padding-right: 2px;
}

.notif-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px;
  display: grid;
  gap: 4px;
  background: rgba(255, 255, 255, 0.02);
}

.notif-item.is-unread {
  border-color: rgba(77, 213, 255, 0.45);
  background: rgba(77, 213, 255, 0.08);
}

.notif-item-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
}

.notif-item-message {
  font-size: 12px;
  line-height: 1.35;
  color: var(--text);
  opacity: 0.94;
}

.notif-item-meta {
  font-size: 11px;
  color: var(--muted);
}

.notif-empty {
  font-size: 12px;
  color: var(--text);
  padding: 6px 2px;
}

.notif-note {
  font-size: 11px;
  color: var(--muted);
  padding: 0 2px 4px;
}

.user-menu {
  position: relative;
}

.user-menu::after {
  content: '';
  position: absolute;
  left: -6px;
  right: -6px;
  top: 100%;
  height: 12px;
}

.user-pill {
  display: flex;
  align-items: center;
  gap: 10px;
  background: transparent;
  border: 0;
  padding: 0;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
}

.user-pill .user-name {
  display: none;
}

.avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 600;
  color: #0b0b0d;
}

#user-menu-btn .avatar {
  min-width: 28px;
  display: grid !important;
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.user-caret {
  font-size: 11px;
  opacity: 0.7;
}

.user-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  min-width: 200px;
  background: rgba(12, 14, 26, 0.98);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px;
  display: none;
  box-shadow: 0 18px 30px rgba(0, 0, 0, 0.35);
  z-index: 3000;
}

.user-dropdown.is-open {
  display: grid;
  gap: 0;
}

.user-menu:hover .user-dropdown {
  display: grid;
  gap: 0;
}

.user-dropdown-header {
  display: grid;
  gap: 4px;
  padding: 6px 6px 8px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 8px;
}

.user-meta {
  font-size: 12px;
  color: var(--muted);
}

.user-action {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  color: var(--text);
  text-decoration: none;
  font-size: 13px;
  border: 1px solid transparent;
}

.user-action-icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
}

.user-action-icon svg {
  width: 16px;
  height: 16px;
}

.user-action-label {
  flex: 1;
}

.user-action:hover {
  border-color: rgba(77, 213, 255, 0.6);
  background: rgba(77, 213, 255, 0.08);
}

.user-theme-toggle {
  cursor: pointer;
  justify-content: space-between;
}

.user-theme-toggle .switch {
  pointer-events: none;
}

.user-color-mode {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  cursor: default;
}

.user-color-mode:hover {
  border-color: transparent;
  background: transparent;
}

.color-mode-switch {
  display: inline-flex;
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 7px;
  overflow: hidden;
  background: rgba(10, 12, 30, 0.55);
}

.color-mode-btn {
  flex: 1;
  border: none;
  border-right: 1px solid var(--border);
  background: transparent;
  color: var(--muted);
  font-size: 10px;
  font-family: var(--sans);
  font-weight: 600;
  padding: 4px 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.color-mode-btn svg {
  width: 14px;
  height: 14px;
}

.color-mode-btn:last-child {
  border-right: none;
}

.color-mode-btn.is-active {
  background: rgba(77, 213, 255, 0.14);
  color: var(--text);
}

body.theme-alt-disabled .color-mode-switch {
  background: rgba(236, 241, 249, 0.95);
  border-color: rgba(120, 128, 146, 0.35);
}

body.theme-alt-disabled .color-mode-btn {
  border-right-color: rgba(120, 128, 146, 0.25);
  color: #5a667c;
}

body.theme-alt-disabled .color-mode-btn.is-active {
  background: rgba(222, 230, 242, 0.95);
  color: #2f3a4d;
}

.user-action:hover .user-action-icon {
  color: var(--accent-2);
}

.content {
  padding: 24px 28px 40px;
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
}

.key-banner {
  border: 1px solid rgba(255, 180, 84, 0.5);
  background: rgba(255, 180, 84, 0.08);
  color: var(--text);
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 13px;
  margin-bottom: 16px;
}

.tab-btn {
  border: 1px solid rgba(120, 140, 200, 0.24);
  background: rgba(10, 12, 30, 0.36);
  color: var(--muted);
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-family: Verdana, Geneva, sans-serif;
  text-align: left;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  position: relative;
  transition: transform 0.12s ease, color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
  text-decoration: none;
  margin-bottom: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18);
}

.sidebar-nav .tab-btn {
  border-radius: 8px;
}

.sidebar-nav .tab-btn + .tab-btn {
  border-top: 1px solid rgba(120, 140, 200, 0.24);
}

/* Restore older open-sidebar nav style (flat list with separators). */
.app-shell:not(.is-collapsed) .sidebar-nav {
  margin-top: 10px;
}

.app-shell:not(.is-collapsed) .tab-btn {
  border: none;
  background: transparent !important;
  border-radius: 0;
  box-shadow: none;
  border-bottom: 1px solid rgba(120, 140, 200, 0.18);
  transition: border-color 0.25s ease, color 0.12s ease;
}

.app-shell:not(.is-collapsed) .sidebar-nav .tab-btn + .tab-btn {
  border-top: none;
}

.app-shell:not(.is-collapsed) .tab-btn:hover,
.app-shell:not(.is-collapsed) .tab-btn.is-active,
body:not(.theme-alt-disabled) .app-shell:not(.is-collapsed) .tab-btn:hover,
body:not(.theme-alt-disabled) .app-shell:not(.is-collapsed) .tab-btn.is-active,
body:not(.theme-alt-disabled) .app-shell:not(.is-collapsed) .sidebar-nav .tab-btn.is-active {
  background: transparent !important;
  box-shadow: none !important;
  color: #4dd5ff !important;
  border-bottom-color: rgba(77, 213, 255, 0.45) !important;
}

.app-shell.is-collapsed .tab-btn {
  justify-content: center;
  padding: 8px;
}

.app-shell.is-collapsed .tab-btn:not(.is-active) {
  color: rgba(100, 112, 130, 0.6);
}

.tab-btn::after {
  content: none;
}

.app-shell.is-collapsed .tab-btn::after {
  content: none;
}

.app-shell.is-collapsed .tab-label {
  display: none;
}

.app-shell.is-collapsed .tab-icon {
  margin: 0;
}

.tab-icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
}

.tab-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tab-btn:hover {
  background: rgba(77, 213, 255, 0.12);
  color: #4dd5ff;
}

.tab-btn.is-active {
  background: rgba(10, 12, 30, 0.36);
  color: #4dd5ff;
  border-color: rgba(77, 213, 255, 0.45);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 4px rgba(0, 0, 0, 0.12);
}

.sidebar-nav .tab-btn.is-active {
  border-top-color: rgba(77, 213, 255, 0.45);
}

body:not(.theme-alt-disabled) .tab-btn:hover {
  background: rgba(77, 213, 255, 0.12);
  color: #4dd5ff;
}

body:not(.theme-alt-disabled) .tab-btn.is-active,
body:not(.theme-alt-disabled) .sidebar-nav .tab-btn.is-active {
  background: rgba(10, 12, 30, 0.36);
  color: #4dd5ff;
  border-color: var(--border);
  border-top-color: var(--border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 4px rgba(0, 0, 0, 0.12);
}

.tab-panel {
  display: none;
}

.tab-panel.is-active {
  display: block;
}

.hero {
  display: none;
}

.hero > div:first-child {
  display: none;
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.32em;
  font-size: 10px;
  margin: 0;
  color: var(--muted);
}

h1 {
  font-size: clamp(2.3rem, 4vw, 3.3rem);
  margin: 0 0 12px;
}

.logo {
  width: 160px;
  height: 44px;
  margin: 0;
  display: block;
}

.subtext {
  display: none;
}

.status-card {
  min-width: 0;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #10121a;
  backdrop-filter: blur(12px);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.theme-alt-disabled .status-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
}

body.theme-alt-disabled #dashboard-panel .status-card {
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
}

body.theme-alt-disabled .topbar .status-card {
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
}

body.theme-alt-disabled .status-card::before {
  content: '';
  position: absolute;
  left: 6px;
  right: 6px;
  top: 0;
  height: 45%;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0));
}

.status-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
}

.status-rows {
  margin-top: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: max-content;
}

#top-status-feed .status-rows {
  flex-direction: row;
  gap: 8px;
}

#top-status-feed .status-row {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 4px 8px;
  background: rgba(255, 255, 255, 0.08);
  min-width: 110px;
  justify-content: flex-start;
  gap: 2px;
}

.status-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  font-size: 10px;
  color: var(--text);
}

.status-row span:first-child {
  font-size: 8px !important;
  font-weight: 700;
  font-family: var(--sans);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  min-width: 78px;
}

.status-rows .status-pill {
  width: auto;
  padding: 2px 6px;
  font-size: 8px;
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: 0.1em;
}

#top-status-feed .status-feed-queue {
  min-width: 34px;
  font-size: 9px;
  font-family: var(--mono);
  letter-spacing: 0.04em;
  color: var(--muted);
  text-align: right;
}

.status-value {
  font-size: 14px;
  font-weight: 600;
  margin-top: 0;
}

.status-meta {
  margin-top: 0;
  font-family: var(--mono);
  color: var(--muted);
  font-size: 11px;
}

.grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 15px;
  align-items: start;
}

.full-row {
  grid-column: 1 / -1;
}

.span-2 {
  grid-column: span 2;
}

.span-3 {
  grid-column: span 3;
}

.span-4 {
  grid-column: span 4;
}

.ring-card {
  grid-column: span 1;
}

.ring-card-dual {
  grid-column: span 1;
}

.ring-dual {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: center;
  justify-items: center;
}

.ring-dual .ring-wrap {
  justify-self: center;
}

.ring-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(100% + 6px);
  margin-left: -3px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(6, 10, 25, 0.6), rgba(6, 10, 25, 0.2));
  position: relative;
}


.ring-label {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  text-align: center;
  white-space: nowrap;
}

.ring-indicators-panel {
  margin-top: 12px;
  padding: 12px 14px;
  width: calc(100% + 6px);
  margin-left: -3px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(6, 10, 25, 0.6), rgba(6, 10, 25, 0.2));
}

.ring-summary-panel {
  margin-top: 12px;
  padding: 12px 14px;
  width: calc(100% + 6px);
  margin-left: -3px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(6, 10, 25, 0.6), rgba(6, 10, 25, 0.2));
}

.ring-summary {
  display: grid;
  gap: 6px;
}

.ring-summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 11px;
}

.ring-summary-row .label {
  color: var(--muted);
}

.ring-summary-row .value {
  font-weight: 600;
  font-size: 10px;
  margin-left: auto;
}

.ring-summary-open {
  font-size: 10px;
}

.ring-summary-balance,
.ring-summary-pnl,
.ring-summary-daily {
  font-size: 10px;
}

.ring-indicators-header {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-bottom: 8px;
}

.ring-indicators {
  margin-top: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}

.ring-indicator {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  font-size: 11px;
  color: var(--muted);
  width: 100%;
}

.ring-indicator .label {
  margin-right: 0;
  flex: 0 0 auto;
}

.ring-indicator .value {
  color: var(--text);
  font-weight: 600;
  font-size: 10px;
  text-align: right;
  white-space: nowrap;
  max-width: 100%;
  flex: 0 0 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

.signal-bar {
  flex: 1;
  height: 8px;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 2px;
  background: transparent;
  border: none;
  overflow: visible;
  box-shadow: none;
  min-width: 0;
}

.signal-bar span {
  display: block;
  height: 100%;
  width: 100%;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.08);
  transition: background-color 0.2s ease;
}

.signal-bar .gauge-1.is-on { background: #f6e45a; }
.signal-bar .gauge-2.is-on { background: #f7d44a; }
.signal-bar .gauge-3.is-on { background: #f8c13c; }
.signal-bar .gauge-4.is-on { background: #f9ad32; }
.signal-bar .gauge-5.is-on { background: #fa962d; }
.signal-bar .gauge-6.is-on { background: #fb7c2c; }
.signal-bar .gauge-7.is-on { background: #fc5f2f; }
.signal-bar .gauge-8.is-on { background: #ff3b30; }

.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(9, 11, 25, 0.7);
  font-size: 10px;
  letter-spacing: 0.02em;
  color: var(--muted);
}

#status-trading.status-pill,
#status-market.status-pill {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  min-width: 0 !important;
}

.status-pill.is-ok {
  color: #4fd7a7;
  border-color: rgba(79, 215, 167, 0.5);
}

.status-pill.is-warn {
  color: #f0c36c;
  border-color: rgba(240, 195, 108, 0.5);
}

.status-pill.is-bad {
  color: #ff6d6d;
  border-color: rgba(255, 109, 109, 0.5);
}


.quotes-card {
  grid-column: span 2;
  margin-top: 14px;
  margin-bottom: 14px;
}

.quotes-card .card-header {
  margin-bottom: 0;
}

#settings-panel .quotes-card {
  margin-bottom: 0;
}

.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 22px 24px;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(10px);
  align-self: start;
}

/* Home screen cards: iOS-like visual treatment (no press/active behavior) */
body.theme-alt-disabled #dashboard-panel .card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
  backdrop-filter: blur(12px) !important;
}

body.theme-alt-disabled #dashboard-panel .card::before {
  content: '';
  position: absolute;
  left: 8px;
  right: 8px;
  top: 0;
  height: 38%;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0));
}

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}

.card-title-with-tip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.connections-card > .card-header {
  display: grid;
  grid-template-columns: 1fr 190px;
  align-items: center;
}

.connections-card > .card-header .primary-btn {
  justify-self: end;
}

.trading-feed-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}


#settings-panel .card-header {
  margin-bottom: 0;
}

.ring-card-dual .card-header {
  margin-bottom: 0;
}

.card-header h2 {
  font-size: 16px !important;
  margin: 0;
}

.chart-card > .card-header h2,
.quotes-card > .card-header h2,
.table-card > .card-header h2 {
  font-size: 16px;
}

.reports-summary-card {
}

.reports-summary-card .report-metric {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  border-radius: 12px !important;
  padding: 12px 14px;
}

.reports-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}

.report-card > .card-header h2 {
  font-size: 15px;
}

.report-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 16px;
}

.report-subtab {
  background: rgba(12, 16, 35, 0.7);
  border: 1px solid var(--border);
  color: var(--muted);
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.report-subtab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1));
  border-color: rgba(77, 213, 255, 0.55);
  color: #4dd5ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 6px rgba(77, 213, 255, 0.14);
}

#support-panel .report-subtab {
  border: 1px solid rgba(120, 140, 200, 0.24);
  background: rgba(10, 12, 30, 0.36) !important;
  border-radius: 6px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18);
}

#support-panel .report-subtab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1)) !important;
  border-color: rgba(77, 213, 255, 0.55);
  color: #4dd5ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 3px 10px rgba(77, 213, 255, 0.2);
}

body.theme-alt-disabled #support-panel .report-subtab {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1);
}

body.theme-alt-disabled #support-panel .report-subtab.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.4);
  color: #0f3f67;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 3px 10px rgba(45, 123, 173, 0.22);
}

body.theme-alt-disabled #reports-panel .report-subtab {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.12);
  color: #3f4e66;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1);
}

body.theme-alt-disabled #reports-panel .report-subtab.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.4);
  color: #0f3f67;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 3px 10px rgba(45, 123, 173, 0.22);
}

/* Tighter spacing in reports tab (tabs, cards, and metric tiles). */
#reports-panel .report-subtabs {
  gap: 6px;
  margin-bottom: 10px;
}

#reports-panel .report-card {
}

#reports-panel .reports-summary {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}

#reports-panel .report-export-grid {
  gap: 10px;
}

#reports-panel .report-tabs {
  gap: 6px;
}

/* Tighter spacing between cards/tiles in settings tab. */
#settings-panel .settings-grid {
  gap: 12px;
}

#settings-panel .settings-grid.two-col {
  gap: 12px;
}

#settings-panel .settings-grid-2x2 {
  gap: 12px;
}

#settings-panel .feed-row {
  gap: 12px;
}

.report-panel {
  display: none;
}

.report-panel.is-active {
  display: block;
}

.report-panel.is-active > * + * {
  margin-top: 15px;
}

.support-panel {
  display: none;
}

.support-panel.is-active {
  display: block;
}

.report-export-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.report-export-tile {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(10, 12, 30, 0.45);
  padding: 14px;
}

.report-export-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.report-export-field input,
.report-export-field select,
.report-export-field textarea {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 10px;
  color: var(--text);
  font-family: var(--mono);
}

body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.14);
}

.report-export-field textarea {
  resize: vertical;
}

.report-export-field select {
  appearance: none;
}

.support-status {
  font-size: 12px;
  color: var(--muted);
  min-height: 16px;
}

#report-export-status {
  grid-column: 1 / -1;
}

#report-export-status[data-tone="pending"] {
  color: #f8d477;
}

#report-export-status[data-tone="success"] {
  color: #79f2b6;
}

#report-export-status[data-tone="error"] {
  color: #ff8da1;
}

.manual {
  display: block;
  font-size: 13px;
  color: var(--text);
}

.manual-header-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}

.manual-search-input {
  width: 240px;
  max-width: 32vw;
  height: 30px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--text);
  font-size: 12px;
}

.manual-search-status {
  min-width: 72px;
  font-size: 11px;
  color: var(--muted);
  text-align: right;
}

.manual-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 18px;
  align-items: stretch;
}

.manual a {
  color: #4dd5ff;
  text-decoration: none;
}

.manual a:hover {
  text-decoration: underline;
}

.manual-toc {
  border: 1px solid rgba(120, 140, 200, 0.2);
  background: rgba(6, 8, 20, 0.75);
  border-radius: 12px;
  padding: 12px 14px;
  position: sticky;
  top: 12px;
  height: 100%;
}

.manual-toc ul {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: grid;
  gap: 6px;
}

.manual-link {
  width: 100%;
  text-align: left;
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 12px;
  cursor: pointer;
}

.manual-link.is-active {
  color: var(--text);
  border-color: rgba(120, 148, 255, 0.45);
  background: rgba(20, 28, 60, 0.7);
}

.manual-section {
  display: none;
  background: rgba(6, 8, 20, 0.75);
  border: 1px solid rgba(120, 140, 200, 0.2);
  border-radius: 12px;
  padding: 12px 14px;
  min-height: 100%;
  height: auto;
  min-width: 0;
  max-width: 100%;
  align-items: flex-start;
  text-align: left;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.manual-section.is-active {
  display: flex;
  flex-direction: column;
}

.manual-section h3 {
  margin: 0 0 8px;
  font-size: 14px;
  width: 100%;
  max-width: 78ch;
  text-align: left;
}

.manual-section h4 {
  margin: 12px 0 8px;
  font-size: 13px;
  font-weight: 600;
  width: 100%;
  max-width: 78ch;
  text-align: left;
}

.manual-section p {
  margin: 0 0 10px;
  line-height: 1.6;
  width: 100%;
}

.manual-section li {
  line-height: 1.5;
}

.manual-content {
  display: grid;
  gap: 16px;
  max-height: min(72vh, 680px);
  overflow-y: auto;
  overflow-x: hidden;
  min-width: 0;
  padding-right: 6px;
  scrollbar-gutter: stable;
}

.manual-content::-webkit-scrollbar {
  width: 8px;
}

.manual-content::-webkit-scrollbar-track {
  background: rgba(120, 140, 200, 0.08);
  border-radius: 999px;
}

.manual-content::-webkit-scrollbar-thumb {
  background: rgba(120, 148, 255, 0.35);
  border-radius: 999px;
}

.manual-section p {
  max-width: 78ch;
  text-align: left;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.manual-section p.manual-spaced {
  margin-top: 10px;
}
.manual-section p:last-of-type {
  margin-top: 10px;
}
.manual-section[data-manual-page="overview"] p {
  max-width: 100%;
  text-align: left;
}
.manual-section ul,
.manual-section ol {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
  width: 100%;
  max-width: 78ch;
  min-width: 0;
  text-align: left;
}

.manual-section h3,
.manual-section h4,
.manual-section li {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.community-layout {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 12px;
  height: 646px;
  align-items: stretch;
}

.community-sidebar {
  background: rgba(10, 12, 24, 0.75);
  border: 1px solid rgba(120, 140, 200, 0.18);
  border-radius: 12px;
  padding: 12px 10px;
  display: grid;
  gap: 10px;
  height: 100%;
  align-content: start;
  width: max-content;
}

.community-sidebar-title {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  padding: 0 6px;
}

.community-channels {
  display: grid;
  gap: 6px;
  justify-items: start;
}

.community-channel {
  border: 1px solid transparent;
  background: transparent;
  color: var(--muted);
  text-align: left;
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 12px;
  cursor: pointer;
}

.community-channel.is-active {
  color: var(--text);
  border-color: rgba(120, 148, 255, 0.35);
  background: rgba(20, 28, 60, 0.6);
}

.community-main {
  background: rgba(10, 12, 24, 0.6);
  border: 1px solid rgba(120, 140, 200, 0.18);
  border-radius: 12px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 10px;
  padding: 16px;
  height: 100%;
  min-height: 100%;
}

.community-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.community-channel-name {
  font-size: 13px;
  color: var(--text);
  font-weight: 600;
}

.community-feed {
  display: grid;
  gap: 10px;
  overflow: auto;
  min-height: 0;
  max-height: 100%;
}

.community-post-body {
  font-size: 13px;
  color: var(--text);
  line-height: 1.5;
  white-space: pre-wrap;
}

.community-post {
  display: grid;
  gap: 4px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(120, 140, 200, 0.12);
  position: relative;
}

.community-post:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.community-post-header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
}

.community-post-author {
  color: var(--text);
  font-weight: 600;
}

.community-reactions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.community-reaction {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid rgba(120, 140, 200, 0.25);
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
  color: var(--text);
  cursor: pointer;
}

.community-reaction-add {
  align-self: flex-start;
  width: fit-content;
  min-width: 0;
  background: transparent;
  border: 1px dashed rgba(120, 140, 200, 0.35);
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
  color: var(--muted);
  cursor: pointer;
}

.community-reaction-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.community-reaction-applied {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid rgba(120, 140, 200, 0.25);
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 12px;
  color: var(--text);
}

.community-reaction-picker {
  display: none;
  gap: 6px;
  margin-top: 6px;
}

.community-reaction-picker.is-open {
  display: flex;
  flex-wrap: wrap;
}

.community-reaction-option {
  background: rgba(10, 12, 30, 0.7);
  border: 1px solid rgba(120, 140, 200, 0.3);
  border-radius: 8px;
  padding: 2px 6px;
  font-size: 12px;
  color: var(--text);
  cursor: pointer;
}

.community-composer {
  display: flex;
  align-items: center;
  gap: 8px;
}

.community-composer .input {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 8px;
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
  flex: 1;
}

.community-composer .input::placeholder {
  color: var(--muted);
}

.community-actions {
  display: flex;
  justify-content: flex-end;
}

#community-submit {
  padding: 5px 13px;
  font-size: 11px;
}

/* Match support/community action buttons to settings connect/disconnect style */
#support-submit.primary-btn,
#community-submit.primary-btn {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #0b0d20 !important;
}

body.theme-alt-disabled #support-submit.primary-btn,
body.theme-alt-disabled #community-submit.primary-btn {
  background: linear-gradient(180deg, rgba(228, 232, 240, 0.96), rgba(208, 214, 226, 0.94)) !important;
  border-color: rgba(120, 128, 146, 0.5) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 2px 6px rgba(62, 70, 86, 0.14) !important;
}

.community-empty {
  font-size: 12px;
  color: var(--muted);
  text-align: center;
  padding: 12px;
  border: 1px dashed rgba(120, 140, 200, 0.25);
  border-radius: 12px;
}

.report-export-field input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  opacity: 0.9;
}

.report-export-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

.report-export-actions .primary-btn,
.report-export-actions .secondary-btn {
  padding: 4px 12px;
  font-size: 10px;
  min-height: 20px;
  height: 20px;
  line-height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.report-tabs {
  display: flex;
  gap: 8px;
  align-items: center;
}

.report-tab {
  background: rgba(12, 16, 35, 0.7);
  border: 1px solid var(--border);
  color: var(--muted);
  font-size: 11px;
  padding: 6px 10px;
  border-radius: 999px;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.report-tab.is-active {
  color: var(--text);
  border-color: rgba(120, 148, 255, 0.5);
  background: rgba(20, 28, 60, 0.9);
}

.report-chart {
  width: 100%;
  height: 260px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(6, 10, 25, 0.6), rgba(6, 10, 25, 0.2));
  overflow: hidden;
}

.report-chart canvas {
  width: 100%;
  height: 100%;
  display: block;
}

.report-metric {
  padding: 16px 18px;
  height: 100%;
}

.report-metric .report-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}

.report-metric .report-value {
  font-size: 14px;
  font-weight: 600;
  margin-top: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.report-metric .report-sub {
  font-size: 10px;
  color: var(--muted);
  margin-top: 4px;
}

.report-table {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(10, 12, 30, 0.55);
}

.report-table.daily,
.report-table.closed,
.report-table.deals,
.report-table.audit {
  max-height: min(520px, 62vh);
  overflow-y: auto;
  overflow-x: hidden;
}

.report-row {
  display: grid;
  gap: 0;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  font-family: var(--sans);
}

.report-row.report-head {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  background: rgba(6, 10, 25, 0.85);
}

.report-row.is-empty {
  grid-template-columns: 1fr;
  justify-items: center;
  align-items: center;
  text-align: center;
  color: var(--muted);
  white-space: nowrap;
}

.report-row.is-empty > div {
  justify-content: center;
}

.report-row div {
  padding: 8px 10px;
  border-right: 1px solid var(--border);
  display: flex;
  align-items: center;
  min-height: 34px;
}

.metric-breakdown {
  display: flex;
  flex-direction: column;
  align-items: inherit;
  justify-content: center;
  gap: 2px;
  width: 100%;
  min-width: 0;
}

.metric-breakdown-primary {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.metric-breakdown-sub {
  display: block;
  min-width: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.2;
  white-space: normal;
}

.metric-breakdown-primary.is-pos {
  color: #63e6a4;
}

.metric-breakdown-primary.is-neg {
  color: #ff8aa3;
}

.metric-breakdown-primary.is-flat {
  color: var(--muted);
}

.report-row div:last-child {
  border-right: none;
  justify-content: flex-end;
}

/* Ensure empty-state placeholders are centered even though the cell is also the last-child. */
.report-row.is-empty > div:last-child {
  justify-content: center;
}

.report-row .is-pos {
  color: #63e6a4;
}

.report-row .is-neg {
  color: #ff8aa3;
}

.report-row .is-flat {
  color: var(--muted);
}

.report-row.error > div {
  color: #ffb454;
}

.report-table.closed .report-row {
  grid-template-columns: 160px 90px 95px 105px 58px 76px 86px 86px 75px 95px 50px 88px;
}

.report-table.closed .report-row div:first-child {
  white-space: nowrap;
}

.report-table.deals .report-row {
  display: grid;
  grid-template-columns: 44px 90px 90px 1fr 1fr 70px 70px 76px 160px 100px;
}

.report-table.deals .report-row div {
  min-width: 0;
}

.report-table.deals .report-row:not(.report-child) div:nth-child(6),
.report-table.deals .report-row:not(.report-child) div:nth-child(7),
.report-table.deals .report-row:not(.report-child) div:nth-child(8) {
  justify-content: center;
  text-align: center;
}

.report-table.deals .report-row:not(.report-child) div:nth-child(4),
.report-table.deals .report-row:not(.report-child) div:nth-child(5) {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.25;
}

.report-table.deals .report-row:not(.report-child) div:nth-child(10) {
  justify-content: flex-end;
  text-align: right;
  padding-right: 12px;
}

.report-table.deals .report-row:not(.report-child) div:nth-child(1) {
  justify-content: center;
  text-align: center;
}

.report-table.deals .report-row.report-child {
  display: none;
  grid-template-columns: 1fr;
}

.report-table.deals .report-row.report-child.is-open {
  display: grid;
}

.report-table.deals .report-row.report-child > div {
  grid-column: 1 / -1;
  padding: 0;
}

.report-table.audit .report-row {
  display: grid;
  grid-template-columns: 34px 82px 86px 158px 158px 120px 128px 1fr 72px;
}

.audit-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.audit-view-tabs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

#report-panel-audit .audit-view-tab {
  padding: 5px 10px;
  font-size: 10px;
}

.report-table.audit {
  border-radius: 11px;
}

.report-table.audit-slippage .report-row {
  display: grid;
  grid-template-columns: 34px 88px 166px 166px 88px 68px 112px 127px 118px 78px;
}

.report-table.audit-slippage .report-row > div {
  justify-content: center;
  text-align: center;
}

#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(10) {
  justify-content: center !important;
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(10) > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-align: center;
}

#report-panel-audit .report-table.audit-slippage .report-row > .audit-slippage-status-cell {
  justify-content: center !important;
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#report-panel-audit .report-table.audit-slippage .report-row > .audit-slippage-status-cell > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-align: center;
}

#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(3),
#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(4),
#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(5) {
  white-space: nowrap;
}

#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(2),
#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(3),
#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(4) {
  justify-content: flex-start;
  text-align: left;
}

#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(5) {
  justify-content: center;
  text-align: center;
}

#report-panel-audit .report-table.audit-slippage .report-row.report-head > div:nth-child(7),
#report-panel-audit .report-table.audit-slippage .report-row.report-head > div:nth-child(8),
#report-panel-audit .report-table.audit-slippage .report-row.report-head > div:nth-child(9) {
  white-space: nowrap;
  letter-spacing: 0.08em;
}

#report-panel-audit .report-table.audit-slippage .report-row > div:nth-child(8) {
  justify-content: center;
  text-align: center;
}

.report-table.audit-slippage .report-row.report-audit-slip-child {
  display: none;
  grid-template-columns: 1fr;
  background: var(--deals-table-bg);
}

.report-table.audit-slippage .report-row.report-audit-slip-child.is-open {
  display: grid;
}

.report-table.audit-slippage .report-row.report-audit-slip-child > div {
  grid-column: 1 / -1;
  border-right: none;
  padding: 0;
  justify-content: flex-start !important;
  align-items: stretch !important;
  width: 100%;
}

.audit-slippage-detail-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

.audit-slippage-section {
  width: 100%;
  display: block;
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(7, 12, 26, 0.72);
}

.audit-slippage-section.is-plain {
  border: none;
  border-radius: 0;
  background: transparent;
}

.audit-slippage-section-title {
  padding: 7px 10px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  color: var(--muted);
  background: rgba(6, 10, 25, 0.85);
  border-bottom: 1px solid var(--border);
}

.audit-slippage-detail-table {
  width: 100%;
  min-width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 11px;
}

.audit-slippage-detail-table th,
.audit-slippage-detail-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-align: left;
}

.audit-slippage-detail-table th {
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  background: rgba(6, 10, 25, 0.72);
}

.audit-slippage-detail-table tr:last-child td {
  border-bottom: none;
}

.audit-slippage-detail-table th.is-right,
.audit-slippage-detail-table td.is-right {
  text-align: center;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  font-variant-numeric: tabular-nums;
}

.audit-slippage-empty {
  padding: 8px 10px;
  font-size: 11px;
  color: var(--muted);
}

.audit-slip-value.is-adverse {
  color: #ff8aa3;
}

.audit-slip-value.is-favorable {
  color: #63e6a4;
}

.audit-slip-value.is-flat {
  color: var(--muted);
}

.report-table.audit .report-row > div {
  min-width: 0;
}

.report-table.audit .report-row > div:nth-child(1) {
  justify-content: center;
  padding: 4px 0;
}

.report-table.audit .report-row > div:nth-child(2),
.report-table.audit .report-row > div:nth-child(4),
.report-table.audit .report-row > div:nth-child(5) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.report-table.audit .report-row > div:nth-child(3) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Audit header info-tip cells: keep tips visible and aligned. */
#report-panel-audit .report-table.audit .report-row.report-head > div:nth-child(4),
#report-panel-audit .report-table.audit .report-row.report-head > div:nth-child(5),
#report-panel-audit .report-table.audit .report-row.report-head > div:nth-child(6),
#report-panel-audit .report-table.audit .report-row.report-head > div:nth-child(7) {
  overflow: visible !important;
}

#report-panel-audit .report-table.audit .report-row.report-head .settings-label-with-tip {
  display: inline-flex;
  align-items: center;
  width: 100%;
  min-width: 0;
  white-space: nowrap;
}

#report-panel-audit .report-table.audit .report-row.report-head .settings-label-with-tip > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#report-panel-audit .report-table.audit .report-row.report-head .settings-label-with-tip .metric-info {
  flex: 0 0 14px;
  margin-left: 4px;
}

#report-panel-audit .report-table.audit .report-row.report-head > div:nth-child(6) .settings-label-with-tip > span:first-child,
#report-panel-audit .report-table.audit .report-row.report-head > div:nth-child(7) .settings-label-with-tip > span:first-child {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1;
  text-align: center;
}

.report-table.audit .report-row > div:nth-child(3),
.report-table.audit .report-row > div:nth-child(9) {
  justify-content: center;
  text-align: center;
}

.report-table.audit .report-row > div:nth-child(8) {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.25;
  justify-content: flex-start;
  text-align: left;
}

.report-table.audit .report-row.report-head > div:first-child {
  padding: 0;
}

#report-panel-audit .report-table.audit .report-row.report-head > div:nth-child(8) {
  justify-content: flex-start;
  text-align: left;
}

#report-panel-audit .report-table.audit .report-row.is-empty > div {
  transform: none;
}

.report-table.audit .report-row.report-audit-child {
  display: none;
  grid-template-columns: 1fr;
  background: var(--deals-table-bg);
}

.report-table.audit .report-row.report-audit-child.is-open {
  display: grid;
}

.report-table.audit .report-row.report-audit-child > div {
  grid-column: 1 / -1;
  border-right: none;
  padding: 0;
  justify-content: flex-start !important;
  align-items: stretch !important;
  width: 100%;
}

.report-table.audit .report-row.report-audit-child .audit-topology-wrap div {
  border-right: none !important;
}

.report-table.audit .report-row.report-audit-child .audit-topology-step-label,
.report-table.audit .report-row.report-audit-child .audit-topology-step-meta,
.report-table.audit .report-row.report-audit-child .audit-topology-axis-stamp {
  display: block !important;
  min-height: 0 !important;
  padding: 0 !important;
}

.audit-topology-wrap {
  width: 100%;
  padding: 6px 0 8px;
  background: #121826 !important;
  overflow-x: auto;
}

#report-panel-audit .audit-topology-wrap {
  overflow-x: hidden !important;
}

.audit-topology-map {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
  overflow-x: hidden;
  padding-bottom: 2px;
  min-width: 0;
  flex-wrap: nowrap;
}

#report-panel-audit .audit-topology-map {
  display: flex !important;
  flex-direction: row !important;
  gap: 8px !important;
}

.audit-topology-row {
  min-width: 0;
}

.audit-topology-row-primary {
  display: flex;
  align-items: stretch;
  gap: 8px;
  flex-wrap: wrap;
}

#report-panel-audit .audit-topology-row-primary {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
}

#report-panel-audit .audit-topology-row-primary .audit-topology-arrow {
  display: none !important;
}

.audit-topology-row-extra {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: stretch;
  column-gap: 8px;
}

.audit-topology-row-legs-column {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: stretch;
  column-gap: 8px;
}

.audit-topology-legs-column {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  min-width: 0;
}

.audit-topology-item {
  min-width: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: 1fr;
  gap: 6px;
  flex: 1 1 0;
  width: 0;
  align-items: center;
  justify-items: start;
}

.audit-topology-connector-bar {
  align-self: center;
  width: 16px;
  height: 2px;
  background: rgba(143, 153, 171, 0.55);
  border-radius: 2px;
  position: relative;
  flex: 0 0 16px;
  margin: 0 1px;
}

.audit-topology-connector-bar::after {
  content: "";
  position: absolute;
  right: -3px;
  top: 50%;
  margin-top: -3px;
  border-left: 4px solid rgba(143, 153, 171, 0.75);
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
}

.audit-topology-axis {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 2px;
  min-width: 42px;
  width: 42px;
  flex: 0 0 42px;
  margin-left: 0;
  padding-left: 0;
}

.audit-topology-axis-stamp {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
  max-width: none;
}

.audit-topology-axis-line {
  display: none !important;
}

.audit-topology-axis-arrow {
  color: rgba(143, 153, 171, 0.8);
  font-size: 11px;
  line-height: 1;
  font-weight: 700;
  text-align: center;
  display: none;
}

.audit-topology-axis.is-first .audit-topology-axis-line,
.audit-topology-axis.is-first .audit-topology-axis-arrow {
  display: none;
}

.audit-topology-item:first-child .audit-topology-axis-stamp {
  visibility: hidden;
}

.audit-topology-item:first-child .audit-topology-axis-arrow {
  visibility: hidden;
}

.audit-topology-item:first-child .audit-topology-axis {
  width: 0 !important;
  min-width: 0 !important;
  flex: 0 0 0 !important;
  gap: 0 !important;
  overflow: hidden;
}

.audit-topology-step {
  min-width: 60px;
  width: 60px;
  max-width: 60px;
  flex: 0 0 60px;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.04) !important;
  padding: 4px 3px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2px;
  text-align: left;
}

.audit-topology-step::before,
.audit-topology-step::after {
  content: none !important;
}

.audit-topology-step.is-leg {
  min-width: 0;
  flex: 0 0 auto;
}

.audit-topology-step.is-signal-confirm {
  min-width: 100px;
  width: 100px;
  max-width: 100px;
  flex: 0 0 100px;
}

body.test-mode #report-panel-audit .audit-topology-step {
  background: rgba(31, 41, 58, 0.92) !important;
  border-color: rgba(146, 162, 186, 0.16) !important;
}

body.test-mode #report-panel-audit .audit-topology-flow {
  background: #121826 !important;
  border: none !important;
  box-shadow: none !important;
}

body.theme-alt-disabled #report-panel-audit .audit-topology-step {
  background: #ffffff !important;
  border-color: var(--border) !important;
}

body.theme-alt-disabled #report-panel-audit .audit-topology-flow {
  background: #121826 !important;
  border: none !important;
  box-shadow: none !important;
}

body.theme-alt-disabled.test-mode #report-panel-audit .audit-topology-step {
  background: #ffffff !important;
  border-color: var(--border) !important;
}

body.theme-alt-disabled.test-mode #report-panel-audit .audit-topology-flow {
  background: #121826 !important;
  border: none !important;
  box-shadow: none !important;
}

.audit-topology-step-label {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 8px;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.audit-topology-step-meta {
  margin-top: 0;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.audit-topology-step-value {
  margin-top: 0;
  color: var(--text);
  font-size: 9px;
  font-weight: 700;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.audit-topology-arrow {
  color: var(--ui-arrow-color) !important;
  font-size: var(--ui-arrow-size) !important;
  font-weight: 700;
  line-height: 1;
  align-self: center;
}


#dashboard-panel .quotes-minimize-btn,
#reports-panel .audit-topology-arrow {
  color: var(--ui-arrow-color) !important;
  font-size: var(--ui-arrow-size) !important;
}

#reports-panel .report-toggle.audit-toggle {
  color: var(--text) !important;
  font-size: 14px !important;
  padding: 0 !important;
  min-height: 20px !important;
  height: 20px !important;
  line-height: 1 !important;
  min-width: 20px !important;
  width: 20px !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  isolation: isolate;
  position: relative;
}

#reports-panel .report-toggle.audit-toggle .audit-toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: inherit;
  font-weight: 800;
}

#reports-panel .report-toggle.audit-toggle .audit-toggle-icon-close {
  width: 14px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask: url('audit-close-2d.svg') center / 12px 12px no-repeat;
  mask: url('audit-close-2d.svg') center / 12px 12px no-repeat;
}

#reports-panel .report-toggle.audit-toggle .audit-toggle-icon-search {
  width: 15px;
  height: 15px;
  transform: translateY(-0.5px);
  background-color: currentColor;
  -webkit-mask: url('audit-magnifier-2d.svg') center / 15px 15px no-repeat;
  mask: url('audit-magnifier-2d.svg') center / 15px 15px no-repeat;
  position: relative;
  z-index: 2;
}

#reports-panel .report-toggle.audit-toggle:not(.is-open) {
  background: rgba(156, 171, 196, 0.08) !important;
  border-color: rgba(156, 171, 196, 0.28) !important;
}

/* Audit topology redesign (hard override). */
#report-panel-audit .audit-topology-wrap .audit-topology-stack {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
}

#report-panel-audit .audit-topology-wrap .audit-topology-flow-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
}

#report-panel-audit .audit-topology-wrap .audit-topology-flow-row.is-close {
  margin-top: 2px !important;
  padding-top: 4px !important;
  border-top: 1px solid rgba(66, 82, 112, 0.35) !important;
}

#report-panel-audit .audit-topology-wrap .audit-topology-flow-label {
  display: inline-grid !important;
  grid-template-rows: repeat(2, min-content) !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 1px !important;
  font-size: 11px !important;
  line-height: 1.02 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(182, 197, 223, 0.96) !important;
  font-weight: 700 !important;
  padding-left: 0 !important;
  white-space: normal !important;
}

#report-panel-audit .audit-topology-wrap .audit-topology-flow-label-line {
  display: block !important;
  white-space: nowrap !important;
}

#report-panel-audit .audit-topology-wrap .audit-topology-flow-label-separator {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  width: 14px !important;
  height: 40px !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  font-weight: 400 !important;
  transform: translateY(-0.5px) !important;
}

#report-panel-audit .audit-topology-wrap .audit-topology-flow-label-separator::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 1px !important;
  background: rgba(66, 82, 112, 0.35) !important;
}

#report-panel-audit .audit-topology-map.is-redesign {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  padding: 1px 0 !important;
}

#report-panel-audit .audit-topology-wrap .audit-topology-flow-row .audit-topology-map.is-redesign {
  width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}

#report-panel-audit .audit-topology-map.is-redesign.is-close-flow {
  padding-top: 0 !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-item {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-item.is-core-item {
  flex: 0 0 85px !important;
  width: 85px !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-item.is-decision-submit-item {
  flex: 0 0 105px !important;
  width: 105px !important;
  min-width: 105px !important;
  max-width: 105px !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item {
  flex: 0 0 135px !important;
  width: 135px !important;
  min-width: 135px !important;
  max-width: 135px !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-item.is-leg-item {
  flex: 0 0 131px !important;
  width: 131px !important;
  min-width: 131px !important;
  max-width: 131px !important;
}

/* Non-async: let each topology box shrink-wrap to its own content. */
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-core-item,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-decision-submit-item,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-leg-item {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: fit-content !important;
  max-width: none !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign {
  position: relative !important;
  left: -20px !important;
  width: calc(100% + 20px) !important;
  min-width: calc(100% + 20px) !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item .audit-topology-step {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
}

#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-item,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-item {
  flex: 0 0 209px !important;
  width: 209px !important;
  min-width: 209px !important;
  max-width: 209px !important;
}

#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-core-item,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-core-item {
  flex: 0 0 102px !important;
  width: 102px !important;
  min-width: 102px !important;
  max-width: 102px !important;
}

#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-decision-submit-item,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-decision-submit-item {
  flex: 0 0 122px !important;
  width: 122px !important;
  min-width: 122px !important;
  max-width: 122px !important;
}

#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item {
  flex: 0 0 152px !important;
  width: 152px !important;
  min-width: 152px !important;
  max-width: 152px !important;
}

#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-core-item,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-decision-submit-item,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-core-item,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-decision-submit-item,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item {
  align-self: center !important;
}

#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-core-item .audit-topology-step,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-decision-submit-item .audit-topology-step,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-step,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-core-item .audit-topology-step,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-decision-submit-item .audit-topology-step,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item .audit-topology-step {
  min-height: 41px !important;
  height: 41px !important;
  max-height: 41px !important;
  padding: 2px 1px !important;
  box-sizing: border-box !important;
}

#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item:not(.is-leg-item),
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item:not(.is-leg-item) {
  align-self: center !important;
}

/* Async map: move ack/fill-confirmed content 5px down across both regular and parallel-leg tiles. */
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-step-label,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-step-value,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-step-label,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-step-value,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-label,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-value,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-parallel-leg-row,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-parallel-leg-row,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-parallel-leg-row,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-ack-item .audit-topology-step-label,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-ack-item .audit-topology-step-value,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-ack-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item .audit-topology-step-label,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item .audit-topology-step-value,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-label,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-value,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-ack-item .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-ack-item .audit-topology-parallel-leg-row,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-fill-confirm-item .audit-topology-parallel-leg-row,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-fill-confirm-item .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-fill-confirm-item .audit-topology-parallel-leg-row {
  position: relative !important;
  top: 5px !important;
  transform: none !important;
}

/* Async map: fill-confirmed parallel legs are rendered as non-ack leg items ("Legs Async"). */
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-item:not(.is-ack-item) .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-item.is-leg-item:not(.is-ack-item) .audit-topology-parallel-leg-row,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-item:not(.is-ack-item) .audit-topology-parallel-leg-label,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-item.is-leg-item:not(.is-ack-item) .audit-topology-parallel-leg-row {
  position: relative !important;
  top: 5px !important;
  transform: none !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-axis {
  display: none !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-axis-stamp {
  display: none !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-axis-arrow,
#report-panel-audit .audit-topology-map.is-redesign .audit-topology-axis-line {
  display: none !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-item:first-child .audit-topology-axis-stamp {
  display: none !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: row !important;
  gap: 2px !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  flex: 1 1 auto !important;
  min-height: 26px !important;
  padding: 2px 1px !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  background: rgba(22, 30, 47, 0.95) !important;
  text-align: center !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step.is-parallel-legs {
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step.is-leg {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  min-width: 0 !important;
  padding-left: 3px !important;
  padding-right: 3px !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step.is-leg .audit-topology-step-label {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  align-self: auto !important;
  height: auto !important;
  min-width: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
  display: block !important;
  align-items: unset !important;
  position: relative !important;
  top: 0 !important;
  text-align: center !important;
}

/* Non-async leg labels: reclaim left space so LEG text stays visible. */
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-step.is-leg .audit-topology-step-label {
  width: 100% !important;
  max-width: 100% !important;
  justify-content: center !important;
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  top: 0 !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-step.is-leg {
  justify-content: center !important;
  align-items: center !important;
  gap: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 5px !important;
  padding-right: 5px !important;
  box-sizing: border-box !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item .audit-topology-step {
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign.is-close-flow .audit-topology-item:first-child .audit-topology-step {
  padding-left: 4.5px !important;
  padding-right: 4.5px !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-step.is-leg .audit-topology-step-value-single {
  display: flex !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-step,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-step,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step {
  justify-content: center !important;
  align-items: center !important;
  gap: 1px !important;
  padding-top: 10px !important;
  padding-bottom: 0 !important;
}

#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-step-label,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-step-label,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-label,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-ack-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-fill-confirm-item .audit-topology-step-value-single,
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-item.is-leg-fill-confirm-item .audit-topology-step-value-single {
  width: fit-content !important;
  max-width: 100% !important;
  align-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  transform: none !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step.is-leg .audit-topology-step-value-single {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  align-self: auto !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-right: 0 !important;
  text-align: center !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step.is-parallel-legs .audit-topology-step-label {
  width: 100% !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 3px !important;
  width: 100% !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1px !important;
  min-height: 24px !important;
  padding: 2px 3px !important;
  border: 1px solid rgba(90, 110, 142, 0.42) !important;
  border-radius: 4px !important;
  background: rgba(18, 25, 40, 0.9) !important;
  color: rgba(198, 208, 226, 0.92) !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  top: 0 !important;
  opacity: 0.98 !important;
  color: rgba(210, 224, 246, 0.96) !important;
  text-align: center !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg-timing {
  align-self: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  width: 100% !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg-row {
  margin-left: 0 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-variant-numeric: tabular-nums !important;
  text-align: center !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg-open,
#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg-close {
  font-weight: 700 !important;
  opacity: 0.98 !important;
  color: rgba(235, 244, 255, 0.98) !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-label {
  font-size: 11px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.03em !important;
  color: rgba(210, 224, 246, 0.96) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  width: 100% !important;
  text-align: center !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-label.has-fail-tip,
#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg-label.has-fail-tip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-label-text,
#report-panel-audit .audit-topology-map.is-redesign .audit-topology-parallel-leg-label-text {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-fail-tip {
  margin-left: 0 !important;
  flex: 0 0 auto !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-meta {
  display: none !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-value {
  margin-top: 0 !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: rgba(235, 244, 255, 0.98) !important;
  white-space: nowrap !important;
  text-align: center !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-value-single {
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  color: rgba(235, 244, 255, 0.98) !important;
  text-transform: none !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step.is-leg .audit-topology-step-value {
  font-size: 11px !important;
  line-height: 1.1 !important;
  letter-spacing: 0.01em !important;
}

#report-panel-audit .audit-topology-map.is-redesign.is-close-flow .audit-topology-step.is-leg .audit-topology-step-value-single {
  font-size: 10px !important;
  margin-right: 0 !important;
}

#report-panel-audit .audit-topology-map.is-redesign.is-close-flow .audit-topology-parallel-leg-timing {
  justify-content: center !important;
  margin-right: 0 !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-value-roundtrip {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1px !important;
  justify-items: center !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step-value-row {
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  color: rgba(235, 244, 255, 0.98) !important;
  text-transform: uppercase !important;
  font-variant-numeric: tabular-nums !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-step.is-signal-confirm {
  min-width: 180px !important;
  width: 180px !important;
  max-width: 180px !important;
  justify-content: space-between !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-connector-bar {
  min-width: 64px !important;
  width: 64px !important;
  height: 26px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 64px !important;
  margin: 0 !important;
  align-self: center !important;
  background: rgba(18, 25, 40, 0.9) !important;
  color: rgba(194, 208, 232, 0.94) !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
  border-radius: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  background: linear-gradient(90deg, rgba(18, 25, 40, 0.9) 0%, rgba(77, 213, 255, 0.24) 48%, rgba(18, 25, 40, 0.9) 100%) !important;
  background-size: 220% 100% !important;
  animation: audit-topology-flow-bar 1.2s linear infinite !important;
  white-space: nowrap !important;
}

/* Shift connector ms value 4px left without moving connector block. */
#report-panel-audit .audit-topology-map.is-redesign .audit-topology-connector-ms {
  display: inline-block !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 2 !important;
  transform: translateX(-4px) !important;
}

/* Non-async flows: tighten step-to-step spacing by 5px. */
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign .audit-topology-connector-bar {
  min-width: 59px !important;
  width: 59px !important;
  flex: 0 0 59px !important;
}

/* Close flow only: tighten Signal -> first connector spacing by 3px. */
#report-panel-audit .audit-topology-wrap:not(.is-async) .audit-topology-map.is-redesign.is-close-flow .audit-topology-item:first-child + .audit-topology-connector-bar {
  min-width: 56px !important;
  width: 56px !important;
  flex: 0 0 56px !important;
}

/* Async flows: increase spacing between tiles by 2px. */
#report-panel-audit .audit-topology-wrap.is-async .audit-topology-map.is-redesign .audit-topology-connector-bar,
#report-panel-audit .audit-topology-map.is-redesign.is-async-flow .audit-topology-connector-bar {
  min-width: 66px !important;
  width: 66px !important;
  flex: 0 0 66px !important;
}

#report-panel-audit .audit-topology-map.is-redesign .audit-topology-connector-bar::after {
  content: "" !important;
  position: absolute !important;
  right: 1px !important;
  top: calc(50% + 3px) !important;
  transform: translateY(-50%) !important;
  width: 0 !important;
  height: 0 !important;
  border-left: 8px solid rgba(255, 255, 255, 0.98) !important;
  border-top: 6px solid transparent !important;
  border-bottom: 6px solid transparent !important;
  filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.35)) !important;
  animation: audit-topology-flow-arrow 0.9s ease-in-out infinite !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

@keyframes audit-topology-flow-bar {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}

@keyframes audit-topology-flow-arrow {
  0% {
    transform: translate(-1px, -50%);
    opacity: 0.72;
  }
  50% {
    transform: translate(1px, -50%);
    opacity: 1;
  }
  100% {
    transform: translate(-1px, -50%);
    opacity: 0.72;
  }
}

.report-row.report-child {
  background: rgba(6, 10, 25, 0.45);
  font-size: 11px;
}

.report-row.report-child > div:first-child {
  color: var(--muted);
}

.report-row.report-child > div {
  border-right: none;
}

.report-deals-details {
  width: 100%;
  padding: 10px 12px 12px;
  background: rgba(8, 10, 22, 0.6);
  overflow-x: hidden;
}

.report-deals-signals {
  display: grid;
  gap: 6px;
}

.report-deal-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 11px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.report-deal-table th,
.report-deal-table td {
  padding: 6px 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  border-right: 1px solid rgba(255, 255, 255, 0.04);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  vertical-align: middle;
}

.report-deal-table td.metric-breakdown-cell {
  white-space: normal;
  overflow: visible;
  text-overflow: initial;
  vertical-align: top;
}

.report-deal-table thead th {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  background: rgba(8, 10, 22, 0.6);
  border-top: none;
  font-weight: 600;
}

.report-deal-table th:last-child,
.report-deal-table td:last-child {
  border-right: none;
}

.report-deal-table th:nth-child(1),
.report-deal-table td:nth-child(1) { width: 10%; }
.report-deal-table th:nth-child(2),
.report-deal-table td:nth-child(2) { width: 9%; }
.report-deal-table th:nth-child(3),
.report-deal-table td:nth-child(3) { width: 10%; }
.report-deal-table th:nth-child(4),
.report-deal-table td:nth-child(4) {
  width: 6%;
  text-align: center;
}
.report-deal-table th:nth-child(5),
.report-deal-table td:nth-child(5) {
  width: 7%;
  text-align: center;
}
.report-deal-table th:nth-child(6),
.report-deal-table td:nth-child(6) { width: 7%; }
.report-deal-table th:nth-child(7),
.report-deal-table td:nth-child(7) { width: 7%; }
.report-deal-table th:nth-child(8),
.report-deal-table td:nth-child(8) { width: 23ch; }
.report-deal-table th:nth-child(9),
.report-deal-table td:nth-child(9) { width: 23ch; }
.report-deal-table th:nth-child(10),
.report-deal-table td:nth-child(10) { width: 7%; }
.report-deal-table th:nth-child(11),
.report-deal-table td:nth-child(11) { width: 6%; }
.report-deal-table th:nth-child(12),
.report-deal-table td:nth-child(12) { width: 7%; }

.report-deal-table th.net-pnl-cell,
.report-deal-table td.net-pnl-cell {
  text-align: right !important;
  padding-right: 12px !important;
}

.report-deal-table td.is-pos {
  color: #63e6a4;
}

.report-deal-table td.is-neg {
  color: #ff8aa3;
}

.report-deal-table td.is-flat {
  color: var(--muted);
}

.report-deal-signal {
  grid-template-columns: 0.9fr 1.4fr 0.7fr 0.9fr 1fr 1fr 0.8fr;
}

.report-toggle {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--deals-table-bg);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  cursor: pointer;
}

.report-toggle.is-open {
  background: rgba(156, 171, 196, 0.08);
  border-color: rgba(156, 171, 196, 0.28);
  color: var(--text);
}

#reports-panel #report-panel-deals .report-toggle.report-deals-toggle,
#reports-panel #report-panel-deals .report-toggle.report-deals-toggle.is-open {
  width: 22px;
  height: 20px;
  border-radius: 4px;
  border: 1px solid rgba(90, 120, 220, 0.6);
  background: rgba(12, 16, 32, 0.85);
  color: var(--text);
  font-size: 13px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

body.test-mode #reports-panel #report-panel-deals .report-toggle.report-deals-toggle,
body.test-mode #reports-panel #report-panel-deals .report-toggle.report-deals-toggle.is-open {
  border-color: rgba(146, 162, 186, 0.34) !important;
  background: rgba(35, 45, 63, 0.96) !important;
  color: #d2d9e6 !important;
}

body.test-mode #reports-panel #report-panel-deals .report-toggle.report-deals-toggle:hover,
body.test-mode #reports-panel #report-panel-deals .report-toggle.report-deals-toggle:focus-visible {
  background: rgba(42, 54, 74, 0.98) !important;
}

body.theme-alt-disabled #reports-panel #report-panel-deals .report-toggle.report-deals-toggle,
body.theme-alt-disabled #reports-panel #report-panel-deals .report-toggle.report-deals-toggle.is-open {
  border-color: rgba(120, 128, 146, 0.34) !important;
  background: rgba(238, 244, 252, 0.98) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #reports-panel #report-panel-deals .report-toggle.report-deals-toggle:hover,
body.theme-alt-disabled #reports-panel #report-panel-deals .report-toggle.report-deals-toggle:focus-visible {
  background: rgba(230, 238, 248, 0.98) !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-deals .report-toggle.report-deals-toggle,
body.theme-alt-disabled.test-mode #reports-panel #report-panel-deals .report-toggle.report-deals-toggle.is-open {
  border-color: rgba(126, 136, 152, 0.34) !important;
  background: rgba(233, 239, 247, 0.98) !important;
  color: #3c475c !important;
}

/* Audit slippage collapse arrows: match scanner toggle size/colors. */
#reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle,
#reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle.is-open {
  width: 22px;
  height: 22px;
  border-radius: 4px;
  border: 1px solid rgba(90, 120, 220, 0.6);
  background: rgba(12, 16, 32, 0.85);
  color: var(--text);
  font-size: 13px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

body.test-mode #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle,
body.test-mode #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle.is-open {
  border-color: rgba(146, 162, 186, 0.34) !important;
  background: rgba(35, 45, 63, 0.96) !important;
  color: #d2d9e6 !important;
}

body.test-mode #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle:hover,
body.test-mode #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle:focus-visible {
  background: rgba(42, 54, 74, 0.98) !important;
}

body.theme-alt-disabled #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle,
body.theme-alt-disabled #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle.is-open {
  border-color: rgba(120, 128, 146, 0.34) !important;
  background: rgba(238, 244, 252, 0.98) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle:hover,
body.theme-alt-disabled #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle:focus-visible {
  background: rgba(230, 238, 248, 0.98) !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle,
body.theme-alt-disabled.test-mode #reports-panel #report-panel-audit .report-toggle.audit-slippage-toggle.is-open {
  border-color: rgba(126, 136, 152, 0.34) !important;
  background: rgba(233, 239, 247, 0.98) !important;
  color: #3c475c !important;
}

.report-table.exchange .report-row {
  grid-template-columns: 140px 80px 80px 110px 90px 120px;
}

.report-table.daily .report-row {
  grid-template-columns: 120px 80px 80px 120px 120px 120px;
}

.report-table.accounts .report-row {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.report-table.accounts .report-row div:nth-child(4),
.report-table.accounts .report-row div:nth-child(5),
.report-table.accounts .report-row div:nth-child(6) {
  justify-content: center;
}

.report-table.accounts .report-row > div {
  justify-content: center;
  text-align: center;
}

.panel-tab-view {
  display: none;
}

.panel-tab-view.is-active {
  display: block;
}

.chart-header-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.chart-wrap {
  position: relative;
  overflow: hidden;
}

.chart-wrap .chart-plot {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.chart-spinner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(6, 8, 20, 0.55);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 3;
}

.chart-spinner .spinner-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 3px solid rgba(77, 213, 255, 0.35);
  border-top-color: rgba(77, 213, 255, 0.95);
  animation: chartSpin 0.9s linear infinite;
}

.chart-spinner.is-active {
  opacity: 1;
}

@keyframes chartSpin {
  to {
    transform: rotate(360deg);
  }
}



.pill {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--muted);
}

.pill.mono {
  padding: 3px 8px;
  font-size: 10px;
}

.quotes-card .quote-meta .pill.mono {
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

body.theme-alt-disabled .quotes-card .quote-meta .pill.mono {
  background: rgba(227, 235, 248, 0.9);
  border: 1px solid rgba(73, 95, 128, 0.35);
  color: #2d3e56;
}

body.theme-alt-disabled .pill.mono {
  background: rgba(227, 235, 248, 0.9) !important;
  border: 1px solid rgba(73, 95, 128, 0.35) !important;
  color: #2d3e56 !important;
}

#quote-exchange-count,
#quote-symbol-count {
  font-size: 11px;
  letter-spacing: 0.08em;
}

#dashboard-panel .quotes-card .quote-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.quotes-minimize-btn {
  height: auto;
  min-height: 0;
  padding: 1px 4px;
  line-height: 1;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mono {
  font-family: var(--sans);
}

.ring-card {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  height: 440px;
  min-height: 440px;
}

.ring-wrap {
  position: relative;
  width: 152px;
  height: 152px;
  align-self: center;
}

.ring {
  width: 152px;
  height: 152px;
  transform: rotate(-90deg);
  margin-top: 0;
}

.ring-card .ring-wrap,
.ring-card .ring {
  width: 152px;
  height: 152px;
}

.ring-track {
  fill: none;
  stroke: rgba(255, 255, 255, 0.08);
  stroke-width: 10;
}

.ring-progress {
  fill: none;
  stroke: var(--accent);
  stroke-width: 10;
  stroke-linecap: round;
  stroke-dasharray: 390;
  stroke-dashoffset: 390;
  transition: stroke-dashoffset 0.4s ease, stroke 0.4s ease;
}

.ring-center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translate(0, 0);
}


.ring-value {
  font-size: 24px;
  font-weight: 700;
}

.ring-unit {
  font-size: 10px;
  color: var(--muted);
  letter-spacing: 0.3em;
  text-transform: uppercase;
}

.ring-pnl {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 6px;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.55);
  font-family: var(--sans);
  font-size: 11px;
  color: var(--muted);
}

.ring-pnl strong {
  color: var(--text);
  font-weight: 600;
  font-family: var(--mono);
  font-size: 12px;
}

.card-note {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.quotes-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.quotes-leg-header {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
  margin-bottom: 10px;
}

.settings-quotes-card .quotes-table {
  width: 100%;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.5);
  overflow-x: hidden;
}

.quote-save-error {
  margin: 10px 0 8px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 138, 167, 0.35);
  background: rgba(40, 16, 28, 0.35);
  color: #ff8aa7;
  font-size: 12px;
}

.quote-save-error:empty {
  display: none;
}

.settings-quotes-card .quotes-head,
.settings-quotes-card .quotes-row {
  display: grid;
  grid-template-columns: 90px repeat(3, minmax(60px, 0.9fr)) minmax(0, 0.6fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.35fr);
  gap: 8px;
  align-items: center;
}

body.arb-two .settings-quotes-card .quotes-head,
body.arb-two .settings-quotes-card .quotes-row {
  grid-template-columns: 90px repeat(2, minmax(60px, 0.9fr)) minmax(0, 0.6fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.35fr);
}

.settings-quotes-card .quotes-head {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  font-family: var(--sans);
}

.settings-quotes-card .quotes-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px 12px;
  min-width: 0;
}

.settings-quotes-card .quotes-row {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--text);
}

.settings-quotes-card .quotes-row > div,
.settings-quotes-card .quotes-head > div,
.settings-quotes-card .quotes-cell {
  min-width: 0;
}

.settings-quotes-card .quotes-row.is-missing {
  border: 1px solid rgba(255, 120, 150, 0.6);
  border-radius: 10px;
  box-shadow: 0 0 0 1px rgba(255, 120, 150, 0.25);
}

.settings-quotes-card .quotes-cell {
  display: flex;
  flex-direction: row !important;
  align-items: center;
  gap: 4px;
  justify-content: space-between;
  flex-wrap: nowrap;
  padding: 8px 10px;
  border: 1px solid var(--border);
  background: #161e2cf7;
  text-transform: uppercase;
  font-size: 12px;
  border-radius: 0 !important;
}

.settings-quotes-card .quotes-row:first-child > .quotes-cell:first-child {
  border-top-left-radius: 12px;
}

.settings-quotes-card .quotes-row:first-child > .quotes-cell:last-child {
  border-top-right-radius: 12px;
}

.settings-quotes-card .quotes-row:last-child > .quotes-cell:first-child {
  border-bottom-left-radius: 12px;
}

.settings-quotes-card .quotes-row:last-child > .quotes-cell:last-child {
  border-bottom-right-radius: 12px;
}

.quote-config-span.is-missing {
  border: 1px solid rgba(255, 120, 150, 0.6);
  border-radius: 10px;
  padding: 6px 8px;
  background: rgba(30, 10, 20, 0.35);
  display: flex;
  align-items: center;
  gap: 8px;
}

.quote-config-span.is-missing .quote-input {
  border-color: rgba(255, 120, 150, 0.6);
}

.missing-label {
  font-size: 10px;
  color: #ff7b94;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}


.quotes-leg-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
}

.quotes-ring {
  border-radius: 14px;
  border: 1px solid var(--border);
  background: #121a28e6;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.quotes-ring-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
}

.quotes-ring-title-main {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.quotes-ring-collapse-tile {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.55);
  border-radius: 8px;
  padding: 1px 4px;
}

.quotes-ring-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.quotes-ring-toggle-label {
  font-size: 9px;
  letter-spacing: 0.12em;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  white-space: nowrap;
  --quotes-toggle-status-width: calc(21ch + 29px);
  margin-right: 3px;
  min-width: var(--quotes-toggle-status-width);
  width: var(--quotes-toggle-status-width);
  max-width: var(--quotes-toggle-status-width);
  text-transform: uppercase;
}

.quotes-ring-toggle-label.is-kill-switch {
  color: #ff6b6b;
}

.quotes-ring-inline-metrics {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.quotes-ring-inline-metric {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  padding: 0 7px;
  min-width: 110px;
  border-radius: 5px;
  border: 1px solid rgba(120, 142, 178, 0.24);
  background: rgba(10, 14, 24, 0.74);
  color: var(--muted);
  font-size: 11px !important;
  font-family: var(--sans) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

#dashboard-panel .quotes-ring-inline-metric.is-open-pnl {
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 22px !important;
  padding-right: 7px !important;
}

#dashboard-panel .quotes-ring-inline-metric.is-pdelta {
  justify-content: center !important;
  text-align: center !important;
}

.quotes-ring-inline-metric.is-pos {
  color: #8ee2bd;
}

.quotes-ring-inline-metric.is-neg {
  color: #ff9fb2;
}

.quotes-ring-inline-metric.is-flat {
  color: var(--muted);
}

.quotes-ring.is-minimized {
  gap: 8px;
}

.quotes-ring-minimized {
  display: flex;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  gap: 0;
  align-items: stretch;
}

.quotes-ring-minimized-shell {
  display: flex;
  align-items: stretch;
  gap: 6px;
  width: 100%;
}

.quotes-mini-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(10, 12, 30, 0.55);
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 0;
  min-width: 0;
}

.quotes-mini-label {
  font-family: var(--sans);
  color: var(--muted);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.quotes-mini-value {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.quotes-mini-value.is-numeric {
  font-family: var(--sans);
  font-weight: 700;
  letter-spacing: 0.02em;
}

.quotes-mini-ring-head {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.quotes-mini-pair-token {
  font-family: var(--sans);
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.settings-quotes-card .tp-col {
  padding-left: 10px;
}

.settings-quotes-card .slippage-col,
.settings-quotes-card .retries-col {
  padding-right: 10px;
}

body.arb-three #settings-panel .settings-quotes-card .leg-col,
body.arb-three #settings-panel .settings-quotes-card .size-col {
  margin-left: 5px;
}

.quotes-mini-quotes {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.quotes-mini-quote {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.quotes-mini-quote-pair {
  color: var(--muted);
  opacity: 0.95;
}

.quotes-mini-quote-price {
  color: var(--text);
  display: inline-flex;
  align-items: center;
  transition: color 0.2s ease, text-shadow 0.2s ease;
}

.quotes-mini-quote-price::after {
  content: "";
  display: inline-block;
  width: 0.8em;
  margin-left: 2px;
  text-align: center;
  opacity: 0;
}

.quotes-mini-quote-price.tick-up {
  color: #73efb0;
  text-shadow: 0 0 8px rgba(88, 245, 164, 0.5);
}

.quotes-mini-quote-price.tick-up::after {
  content: "↑";
  opacity: 1;
  color: #73efb0;
  text-shadow: 0 0 8px rgba(88, 245, 164, 0.55);
}

.quotes-mini-quote-price.tick-down {
  color: #ff8fa7;
  text-shadow: 0 0 8px rgba(255, 104, 141, 0.48);
}

.quotes-mini-quote-price.tick-down::after {
  content: "↓";
  opacity: 1;
  color: #ff8fa7;
  text-shadow: 0 0 8px rgba(255, 104, 141, 0.52);
}

.quotes-mini-value.is-pos {
  color: #63e6a4;
}

.quotes-mini-value.is-neg {
  color: #ff8aa3;
}

.quotes-mini-value.is-flat {
  color: var(--muted);
}

.quotes-ring-minimized .quotes-ring-toggle {
  justify-content: flex-end;
  align-self: center;
  margin-left: 2px;
}

.quotes-ring-minimized .quotes-ring-inline-metrics {
  display: none;
}

.quotes-ring-minimized .quotes-ring-toggle-label {
  display: none;
}

.quotes-ring:not(.is-minimized) .quotes-ring-toggle-label {
  transform: none;
}

body.theme-alt-disabled .quotes-mini-item {
  background: rgba(246, 250, 255, 0.96);
  border-color: rgba(120, 128, 146, 0.26);
}

/* Keep minimized tiles single-line inside each tile (Label: Value). */
#dashboard-panel .quotes-ring-minimized .quotes-mini-item {
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 9px 12px !important;
  border-radius: 0 !important;
  border: 1px solid var(--card) !important;
  border-color: var(--card) !important;
  box-shadow: none !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item:first-child {
  border-top-left-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item:last-child {
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item + .quotes-mini-item {
  margin-left: 3px !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-label,
#dashboard-panel .quotes-ring-minimized .quotes-mini-value {
  line-height: 1 !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-label::after {
  content: ":" !important;
  margin-left: 2px !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-label:empty {
  display: none !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-label:empty::after {
  content: "" !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-toggle-status {
  flex: 0 0 auto !important;
  justify-content: flex-start !important;
  gap: 3px !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-toggle-status .quotes-mini-value {
  width: calc(22ch + 10px) !important;
  min-width: calc(22ch + 10px) !important;
  max-width: calc(22ch + 10px) !important;
  flex: 0 0 auto !important;
  text-align: right !important;
  white-space: nowrap !important;
  color: var(--muted) !important;
  font-size: 9px !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-toggle-status .quotes-mini-value.is-kill-switch,
#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-toggle-status .quotes-mini-value.is-no-quotes {
  color: #ff6b6b !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-pspread {
  justify-content: center !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-pspread .quotes-mini-value {
  text-align: center !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-open-pnl {
  justify-content: flex-start !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-open-pnl .quotes-mini-value {
  text-align: left !important;
  padding-left: 15px !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-toggle-switch {
  flex: 0 0 auto !important;
  justify-content: center !important;
  gap: 0 !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-toggle-switch .quotes-mini-label::after {
  content: "" !important;
}

#dashboard-panel .quotes-ring-minimized .quotes-mini-item.is-toggle-switch .quotes-mini-value {
  width: auto !important;
  flex: 0 0 auto !important;
  justify-content: center !important;
  display: inline-flex !important;
  overflow: visible !important;
}

.quotes-ring-legs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
}

body.arb-two .quotes-ring-legs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.quotes-leg-grid {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.quotes-leg-grid.is-minimized {
  gap: 5px;
}

.quotes-leg {
  border-radius: 14px;
  border: 0 !important;
  background: rgba(10, 12, 30, 0.55);
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: var(--mono);
  font-size: 12px;
  position: relative;
  min-width: 0;
}

.quotes-ring-metrics {
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.55);
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-family: var(--mono);
  font-size: 12px;
}

.quotes-ring-legs > .quotes-leg,
.quotes-ring-legs > .quotes-ring-metrics {
  background: rgba(10, 12, 30, 0.55) !important;
}

.quotes-metric {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--text);
}

.quotes-metric span {
  font-family: var(--sans);
  color: var(--muted);
  font-size: 11px;
}

.quotes-metric strong {
  font-weight: 600;
  color: var(--text);
}

.quotes-metric strong.is-pos {
  color: #63e6a4;
}

.quotes-metric strong.is-neg {
  color: #ff8aa3;
}

.quotes-metric strong.is-flat {
  color: var(--muted);
}

.quotes-metric.toggle-row {
  padding-top: 6px;
}

.quotes-trading-note {
  margin-left: 10px;
  font-size: 11px;
  color: var(--accent-3);
  opacity: 0.9;
}

.quotes-toggle {
  padding: 4px 10px;
  font-size: 11px;
  border-radius: 999px;
}

.quotes-leg .quotes-exchange {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 9px;
  font-family: var(--sans);
  color: rgba(164, 181, 214, 0.8);
}

.quotes-leg .quotes-symbol {
  color: #dfe8ff;
  font-size: 12px;
  font-weight: 700;
  font-family: var(--sans);
}

.quotes-leg .quotes-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
}

.quotes-leg .quotes-price {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  font-size: 12px;
}

.quotes-leg .quotes-price > span {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex: 1 1 0;
  min-width: 0;
  padding: 4px 4px;
  border-radius: 10px;
  background: rgba(12, 18, 30, 0.72);
  border: 0 !important;
}

.quotes-leg .quotes-price > span > span:first-child {
  font-size: 9px;
  color: rgba(169, 186, 216, 0.85);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.quotes-leg .quotes-price > span > span:last-child {
  font-size: 20px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #ecf2ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 8ch;
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  position: relative;
}

.quotes-leg .quotes-price > span > span:last-child::after {
  content: none;
}

.quotes-leg .quotes-price .quotes-tick-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 8px;
  height: 6px;
  margin-left: 4px;
  opacity: 0;
}

.quotes-leg .quotes-price .quotes-tick-arrow::before {
  content: '';
  width: 0;
  height: 0;
}

.quotes-leg .quotes-price .quotes-tick-arrow.is-up {
  opacity: 1;
  transform: translateY(-1px);
}

.quotes-leg .quotes-price .quotes-tick-arrow.is-up::before {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 6px solid #2dd4bf;
}

.quotes-leg .quotes-price .quotes-tick-arrow.is-down {
  opacity: 1;
  transform: translateY(1px);
}

.quotes-leg .quotes-price .quotes-tick-arrow.is-down::before {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid #f87171;
}

.quotes-leg .quotes-price > span.is-bid > span:last-child {
  color: #b8caf8;
}

.quotes-leg .quotes-price > span.is-ask > span:last-child {
  color: #c8d6f5;
}

.quotes-leg .quotes-price .tick-up {
  color: #2dd4bf;
  animation: quotePulseUp 0.6s ease-out;
}

.quotes-leg .quotes-price > span > span:last-child.tick-up {
  color: #2dd4bf !important;
}

.quotes-leg .quotes-price .tick-up::after {
  content: none;
}

.quotes-leg .quotes-price .tick-down {
  color: #f87171;
  animation: quotePulseDown 0.6s ease-out;
}

.quotes-leg .quotes-price > span > span:last-child.tick-down {
  color: #f87171 !important;
}

.quotes-leg .quotes-price .tick-down::after {
  content: none;
}

@keyframes quotePulseUp {
  0% { text-shadow: 0 0 0 rgba(45, 212, 191, 0); }
  30% { text-shadow: 0 0 14px rgba(45, 212, 191, 0.75), 0 0 28px rgba(45, 212, 191, 0.35); }
  100% { text-shadow: 0 0 0 rgba(45, 212, 191, 0); }
}

@keyframes quotePulseDown {
  0% { text-shadow: 0 0 0 rgba(248, 113, 113, 0); }
  30% { text-shadow: 0 0 14px rgba(248, 113, 113, 0.75), 0 0 28px rgba(248, 113, 113, 0.35); }
  100% { text-shadow: 0 0 0 rgba(248, 113, 113, 0); }
}

.quotes-leg .quotes-spread {
  font-size: 11px;
  color: var(--accent);
}

.quotes-leg .quotes-depth {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 2px;
}

.quotes-leg .quotes-depth-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
  opacity: 0.95;
}

.quotes-leg .quotes-depth-table {
  display: flex;
  flex-direction: column;
  gap: 3px;
  background: rgba(8, 13, 24, 0.75);
  border: 0 !important;
  border-radius: 10px;
  padding: 4px;
}

.quotes-leg .quotes-depth-book-head,
.quotes-leg .quotes-depth-book-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 3px;
  align-items: center;
}

.quotes-leg .quotes-depth-book-head {
  color: rgba(170, 186, 216, 0.82);
  font-size: 9px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0 2px;
}

.quotes-leg .quotes-depth-book-cell {
  position: relative;
  height: 20px;
  border: 0 !important;
  border-radius: 4px;
  background: rgba(12, 19, 34, 0.86);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  min-width: 0;
}

.quotes-leg .quotes-depth-book-cell .depth-cell-value {
  position: relative;
  z-index: 2;
  font-size: 10px;
  font-family: var(--mono);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.quotes-leg .quotes-depth-book-cell .depth-cell-bar {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 1;
}

.quotes-leg .quotes-depth-book-cell.is-bid-qty {
  justify-content: flex-start;
  padding-left: 6px;
  color: #9dbdff;
}

.quotes-leg .quotes-depth-book-cell.is-bid-qty .depth-cell-bar {
  left: 0;
  background: linear-gradient(90deg, rgba(101, 132, 255, 0.45), rgba(101, 132, 255, 0.1));
}

.quotes-leg .quotes-depth-book-cell.is-bid-px {
  color: #c8d6f5;
}

.quotes-leg .quotes-depth-book-cell.is-spread {
  background: rgba(48, 62, 102, 0.86);
  color: #bcd3ff;
}

.quotes-leg .quotes-depth-book-cell.is-ask-px {
  color: #ffd7b0;
}

.quotes-leg .quotes-depth-book-cell.is-ask-qty {
  justify-content: flex-end;
  padding-right: 6px;
  color: #ffbf7a;
}

.quotes-leg .quotes-depth-book-cell.is-ask-qty .depth-cell-bar {
  right: 0;
  background: linear-gradient(270deg, rgba(255, 166, 77, 0.48), rgba(255, 166, 77, 0.12));
}

.quotes-leg .quotes-depth-book-row.is-top .quotes-depth-book-cell.is-spread {
  background: rgba(69, 91, 148, 0.95);
  color: #e8f0ff;
  box-shadow: inset 0 0 0 1px rgba(160, 188, 255, 0.4);
}

.quotes-leg .quotes-depth-empty {
  font-size: 10px;
  color: var(--muted);
  opacity: 0.9;
  padding: 6px 4px;
}

body:not(.theme-alt-disabled) #dashboard-panel .quotes-ring-legs > .quotes-leg {
  background: rgba(19, 28, 43, 0.94) !important;
  border-color: rgba(122, 144, 180, 0.26) !important;
  box-shadow: none !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-ring-legs > .quotes-leg {
  background: rgba(19, 26, 48, 0.95) !important;
  border-color: rgba(136, 150, 212, 0.28) !important;
  box-shadow: none !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-ring-legs .quotes-price > span {
  background: #141d2ceb !important;
  border-color: rgba(128, 145, 205, 0.24) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-ring-legs .quotes-depth-table {
  background: rgba(16, 24, 45, 0.78) !important;
  border-color: rgba(128, 145, 205, 0.24) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-ring-legs .quotes-depth-book-cell {
  background: rgba(19, 29, 54, 0.88) !important;
  border-color: rgba(128, 145, 205, 0.22) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-ring-legs .quotes-depth-book-cell.is-spread {
  background: rgba(59, 76, 126, 0.9) !important;
  color: #d7e4ff !important;
}

.quotes-leg .quotes-status,
.settings-quotes-card .quotes-status {
  font-size: 11px;
  color: #ff7b8a;
}

.quotes-leg.is-missing {
  border-color: rgba(255, 123, 138, 0.35);
}

.quotes-leg-tag {
  position: absolute;
  top: 8px;
  right: 10px;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  font-family: var(--sans);
}

body.arb-two .quotes-leg-header,
body.arb-two .quotes-leg-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.settings-quotes-card {
  margin-top: 0;
}

.quote-rings {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}

.quote-ring {
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.5);
  padding: 12px 9px;
}

.quote-ring + .quote-ring {
  margin-top: 8px;
}

.quote-ring.is-collapsed {
  margin-top: 8px;
  padding: 21px 18px;
}

.quote-ring-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  margin-bottom: 10px;
}

.quote-ring-header-main {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.quote-ring-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.quote-ring-apply-alert {
  border-color: rgba(255, 114, 138, 0.85) !important;
  background: rgba(64, 18, 30, 0.82) !important;
  color: #ff8ea5 !important;
  box-shadow: 0 0 0 1px rgba(255, 114, 138, 0.24) !important;
}

body.theme-alt-disabled .quote-ring-apply-alert {
  border-color: rgba(185, 38, 68, 0.55) !important;
  background: rgba(255, 241, 245, 0.95) !important;
  color: #b92644 !important;
  box-shadow: 0 0 0 1px rgba(185, 38, 68, 0.12) !important;
}

.quote-ring-params {
  border: 1px solid rgba(120, 190, 255, 0.4);
  background: rgba(10, 12, 30, 0.6);
  color: #9fd6ff;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 11px;
  font-family: var(--mono);
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}

.quote-ring-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.quote-ring-remove {
  border: 1px solid rgba(255, 93, 147, 0.4);
  background: rgba(10, 12, 30, 0.6);
  color: #ff7b94;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 11px;
  font-family: var(--mono);
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}

.quote-ring-params:hover {
  background: rgba(120, 190, 255, 0.14);
  box-shadow: 0 0 0 1px rgba(120, 190, 255, 0.25) inset;
}

body.theme-alt-disabled .quote-ring-params {
  color: #2a5ea8;
  border-color: rgba(42, 94, 168, 0.35);
}

.quote-ring-remove:hover {
  background: rgba(255, 93, 147, 0.12);
  box-shadow: 0 0 0 1px rgba(255, 93, 147, 0.25) inset;
}

.quote-ring-params:active,
.quote-ring-remove:active {
  transform: translateY(1px) scale(0.98);
  box-shadow: inset 0 2px 6px rgba(5, 8, 20, 0.35);
}

.quote-ring-settings {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 8px;
  background: rgba(10, 12, 30, 0.55);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.quote-settings-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-template-rows: repeat(2, auto);
  grid-auto-flow: row;
  gap: 8px;
}

.quote-settings-grid--advanced {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.quote-settings-grid--entry {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.quote-settings-tile {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: transparent;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.quote-settings-tile.is-disabled {
  border-color: rgba(90, 120, 180, 0.25);
}

.quote-settings-tile.is-disabled .quote-settings-tile-title {
  color: rgba(140, 160, 200, 0.55);
}

/* Keep advanced ring-setting tiles on the same surface as current environment/theme. */
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel #settings-quotes-body .quote-settings-tile {
  background: transparent !important;
}

body.theme-alt-disabled:not(.test-mode) #settings-panel #settings-quotes-body .quote-settings-tile {
  background: transparent !important;
}

body.test-mode:not(.theme-alt-disabled) #settings-panel #settings-quotes-body .quote-settings-tile {
  background: transparent !important;
}

body.theme-alt-disabled.test-mode #settings-panel #settings-quotes-body .quote-settings-tile {
  background: transparent !important;
}

.quote-settings-tile-title {
  display: inline-flex;
  align-items: center;
  margin: 0;
  margin-bottom: 6px;
  font-size: 10px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  text-shadow: none;
}

.quote-settings-tile-body {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

@media (max-width: 1200px) {
  .quote-settings-grid--entry,
  .quote-settings-grid--advanced {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .quote-settings-tile-body {
    grid-template-columns: 1fr;
  }

  .quote-settings-inline-row--dynamic-threshold {
    grid-template-columns: 1fr;
  }
}

.quote-settings-tabs {
  align-self: flex-start;
}

.quote-settings-tabs--header {
  align-self: center;
  margin-left: 20px;
}

.quote-settings-tabs--header .toggle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 76px;
  text-align: center;
  line-height: 1;
  transform: translateY(-1px);
  border: none !important;
  box-shadow: none !important;
}

.quote-settings-tabs--header .toggle-btn + .toggle-btn {
  border-left: 1px solid rgba(148, 163, 184, 0.35) !important;
}

.quote-settings-tabs--header .toggle-btn.is-active {
  border: none !important;
  box-shadow: none !important;
}

.quote-settings-tabs--header .toggle-btn:hover,
body.theme-alt-disabled .quote-settings-tabs--header .toggle-btn,
body.theme-alt-disabled .quote-settings-tabs--header .toggle-btn.is-active {
  box-shadow: none !important;
}

.quote-settings-tabs--header .toggle-btn .quote-settings-tab-label {
  display: inline-block;
  transform: translateY(-1px);
}

.quote-settings-pane {
  display: none;
}

.quote-settings-pane.is-active {
  display: block;
}

.quote-settings-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.quote-settings-inline-row {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
}

.quote-settings-inline-row--dynamic-threshold {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.quote-settings-item.size-strategy-item {
  grid-column: 1;
  grid-row: 1;
}

.quote-settings-item.max-size-item {
  grid-column: 2;
  grid-row: 1;
}

.quote-settings-item.entry-execution-strategy-item {
  grid-column: 1;
  grid-row: 2;
}

.quote-settings-item.auto-vol-throttle-item {
  grid-column: 1;
  grid-row: 2;
}

.quote-settings-item.entry-execution-strategy-item .quote-config-label {
  white-space: nowrap;
  letter-spacing: 0.08em;
}

.quote-ring-preset-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 2px;
}

.quote-ring-preset-status {
  margin-right: auto;
  min-height: 14px;
  font-size: 10px;
  color: var(--muted);
  opacity: 0;
}

.quote-ring-preset-status.is-visible {
  opacity: 1;
}

.quote-ring-preset-status.is-error {
  color: #ff8ea5;
}

body.theme-alt-disabled .quote-ring-preset-status.is-error {
  color: #b92644;
}

.quote-ring-preset-btn {
  padding: 3px 10px;
  font-size: 10px;
  min-height: 22px;
}

.quote-settings-item.is-missing .quote-input {
  border-color: rgba(255, 120, 150, 0.6);
}

.quote-settings-order {
  margin-top: 4px;
}

.quote-config-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}

.quote-config {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
}

.quote-config-row {
  display: grid;
  grid-template-columns: 80px 1fr 1fr;
  column-gap: 6px;
  row-gap: 10px;
  align-items: center;
}

.quote-config-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
}

.quote-input {
  width: 100%;
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 10px;
  color: var(--text);
  font-family: var(--sans);
  font-size: 11px;
}

.quote-input:disabled {
  cursor: not-allowed;
  color: rgba(220, 230, 255, 0.55);
  -webkit-text-fill-color: rgba(220, 230, 255, 0.55);
  background: rgba(8, 10, 24, 0.45);
  border-color: rgba(90, 120, 180, 0.25);
  opacity: 1;
}

.quote-select:disabled {
  cursor: not-allowed;
  color: rgba(220, 230, 255, 0.55);
  -webkit-text-fill-color: rgba(220, 230, 255, 0.55);
  background: rgba(8, 10, 24, 0.45);
  border-color: rgba(90, 120, 180, 0.25);
  opacity: 1;
}

.quote-settings-item.is-disabled .quote-config-label {
  color: rgba(140, 160, 200, 0.55);
}

.quote-settings-item.is-disabled .quote-input {
  opacity: 0.75;
}

.quote-config-span {
  grid-column: 2 / 4;
}

.quote-trade-config {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 6px;
}

.quote-select {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 10px;
  color: var(--text);
  font-family: var(--sans);
  font-size: 11px;
}

/* Analytics card ring selector: reduce height and corner radius. */
#dashboard-panel #ring-select.quote-select {
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  line-height: 22px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-radius: 5px !important;
  background: rgba(10, 12, 30, 0.55) !important;
}

#settings-panel #chart-history-select {
  height: 22.67px !important;
  min-height: 22.67px !important;
  max-height: 22.67px !important;
  line-height: 22.67px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.quote-order-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: nowrap;
}

.quote-settings-item.order-row {
  grid-column: 2 / -1;
}

.quote-settings-item.mean-reversion-item {
  grid-column: 1 / 2;
  margin-left: 0;
}

.quote-settings-item.trade-available-item {
  grid-column: 2 / 3;
  margin-left: 0;
}

.quote-settings-item.auto-hedge-z-auto-item > .toggle,
.quote-settings-item.trade-available-item > .toggle {
  margin-top: 4px;
}

.quote-settings-item.execution-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 3fr);
  gap: 12px;
  align-items: start;
}

.quote-settings-item.execution-row > .quote-settings-item.mean-reversion-item,
.quote-settings-item.execution-row > .quote-settings-item.trade-available-item,
.quote-settings-item.execution-row > .quote-settings-item.order-row {
  grid-column: auto;
  margin-left: 0;
}

.quote-settings-item.execution-row > .quote-settings-item.trade-available-item {
  margin-left: 100px;
  min-width: max-content;
}

.quote-settings-item.execution-row > .quote-settings-item.trade-available-item .quote-config-label.settings-label-with-tip {
  display: inline-flex;
  width: max-content;
  overflow: visible !important;
}

.quote-order-select {
  min-width: 88px;
}

.quote-order-select .quote-select {
  padding-top: 4px;
  padding-bottom: 4px;
}

.quote-order-select.is-disabled {
  opacity: 0.55;
  pointer-events: none;
}

.quote-config-readonly .quote-config-value {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 10px;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--text);
}

.quote-leg3 {
  display: grid;
}

body.arb-two .quote-leg3 {
  display: none;
}

body.arb-two .settings-leg3 {
  display: none;
}

.connections-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.trading-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.simulator-balance-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.simulator-reset-row {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
}

.settings-row .simulator-reset-row {
  flex: 1;
  width: 100%;
}

.simulator-reset-row > input {
  flex: 1 1 auto;
  min-width: 0;
}

.simulator-reset-row .input-prefix,
.scanner-threshold-row .input-prefix {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 1 150px;
  min-width: 0;
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 8px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12);
}

.scanner-lookback-wrap {
  flex: 0 1 110px;
  min-width: 0;
}

.scanner-lookback-select {
  width: 100%;
  height: 32px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
  padding: 0 10px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12);
}

.simulator-reset-row .input-prefix span,
.scanner-threshold-row .input-prefix span {
  color: var(--muted);
  font-family: var(--mono);
  font-size: 12px;
}

.simulator-reset-row .input-prefix input,
.scanner-threshold-row .input-prefix input {
  border: none;
  background: transparent;
  padding: 0;
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
  width: 100%;
  min-width: 0;
}

.simulator-reset-row .secondary-btn {
  flex: 0 0 auto;
  width: 59.34px;
  height: 24.67px;
  min-width: 59.34px;
  padding: 0;
  font-size: 10px;
}

.simulator-balance-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  align-items: center;
}

.simulator-balance-row label {
  font-size: 12px;
  color: var(--text);
}

.simulator-balance-row input,
.simulator-reset-row > input {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 8px;
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
  width: 100%;
}

.simulator-actions {
  display: flex;
  justify-content: flex-end;
}

.trading-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

.trading-grid .toggle-group {
  justify-content: flex-start;
}

.trading-row {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 12px;
  grid-column: 1 / -1;
  width: 100%;
}

.trading-row label {
  flex: 1;
}

.trading-row .primary-btn {
  margin-left: auto;
}

.trade-signal {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
}

.trade-signal[data-state="ready"] {
  border-color: rgba(77, 213, 255, 0.6);
  color: #4dd5ff;
  box-shadow: 0 0 0 1px rgba(77, 213, 255, 0.2);
}

.trade-signal[data-state="wait"] {
  border-color: rgba(255, 93, 147, 0.4);
  color: #ff5d93;
}
.trading-grid label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 11px;
  color: var(--muted);
  text-transform: none;
  letter-spacing: 0.12em;
}

.trading-grid input {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px 8px;
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
}

.accounts-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.accounts-tile {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(10, 12, 30, 0.45);
  padding: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.orders-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.orders-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.orders-row {
  display: grid;
  grid-template-columns: 140px 1fr 120px 120px 140px;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(10, 12, 30, 0.6);
  font-family: var(--mono);
  font-size: 12px;
}

.orders-row.header {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  background: transparent;
  font-family: var(--sans);
}
.accounts-list {
  width: 100%;
  overflow-x: auto;
}

.accounts-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 3px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--card);
  background: transparent;
  box-shadow: none;
  font-family: var(--sans);
  font-size: 12px;
}

body.theme-alt-disabled .accounts-table {
  background: #f3f5fa !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

.accounts-table th,
.accounts-table td {
  padding: 10px 12px;
  border: none;
  text-align: left;
  white-space: nowrap;
}

.accounts-table th {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 10px;
  font-weight: 600;
  background: rgba(8, 12, 24, 0.7);
}

.accounts-table tbody tr {
  background: rgba(10, 14, 28, 0.65);
}

.accounts-table tbody tr td:first-child {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.accounts-table tbody tr td:last-child {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.accounts-table tbody tr:last-child td {
  border-bottom: none;
}

.accounts-mode {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  font-size: 10px;
}

.accounts-row.error {
  border: 1px solid rgba(255, 93, 147, 0.4);
}

.accounts-table tr.error td,
.accounts-table td.accounts-message {
  color: #ff8fa9;
}

.accounts-asset {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 11px;
  color: var(--muted);
}
.settings-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
}

.settings-grid.two-col {
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  align-items: stretch;
  gap: 16px;
}

.settings-grid.two-col .card {
  height: 100%;
}

.settings-grid .full-row {
  grid-column: 1 / -1;
}

.settings-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.feed-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.scanner-config-card .scanner-threshold-row {
  margin-bottom: 10px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);
}

.feed-dual {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 12px;
}

.feed-pane {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(24, 33, 48, 0.78);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);
}

.feed-pane-title {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
}

.feed-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

.feed-actions .feed-btn {
  min-width: 72px;
  justify-content: center;
}

.feed-select {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px;
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
  min-height: 140px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12);
}

.feed-select option {
  padding: 6px 8px;
}

.feed-selected {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 160px;
  overflow-y: auto;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--text);
}

.feed-selected-row {
  padding: 6px 8px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.45);
}

.feed-empty {
  color: var(--muted);
  font-size: 12px;
}

.settings-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
}

.settings-row .settings-label {
  flex: 0 0 auto;
}

.settings-row .toggle-group,
.settings-row .simulator-reset-row {
  flex: 1 1 auto;
  min-width: 0;
}

.settings-grid-2x2 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 1200px) {
  .settings-grid-2x2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .settings-grid-2x2 {
    grid-template-columns: 1fr;
  }
}

.settings-label {
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}

#settings-panel label,
#settings-panel .quote-config-label,
#settings-panel .settings-label {
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  font-weight: 700;
}

.settings-label-stack {
  line-height: 1.1;
}

.toggle-group {
  display: inline-flex;
  gap: 8px;
  flex-wrap: nowrap;
}

.multi-select {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.multi-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
}

.multi-option input {
  accent-color: var(--accent-2);
}

.ring-config .ring-preset-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.ring-config select,
.ring-config input {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 10px;
  color: var(--text);
  font-family: var(--mono);
}

.ring-custom {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}

.ring-custom label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

body.arb-two .ring-custom-tri {
  display: none;
}

body:not(.arb-two) .ring-custom-two {
  display: none;
}

.toggle-btn {
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--muted);
  padding: 6px 14px;
  border-radius: 12px;
  font-size: 11px;
  font-family: var(--mono);
  white-space: nowrap;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 2px 8px rgba(0, 0, 0, 0.14);
}

.toggle-btn.is-active {
  color: var(--text);
  border-color: rgba(255, 180, 84, 0.7);
  box-shadow: 0 0 0 1px rgba(255, 180, 84, 0.25);
}

#settings-panel .toggle-btn,
#settings-panel .primary-btn,
#settings-panel .secondary-btn,
body.test-mode #settings-panel .quote-ring-params,
#settings-panel .quote-ring-remove {
  font-family: var(--sans);
}

#settings-panel .toggle-btn {
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--muted);
  padding: 5px 12px;
  border-radius: 0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

#settings-panel .toggle-group {
  gap: 0;
}

#settings-panel .toggle-group .toggle-btn + .toggle-btn {
  border-left: none;
}

#settings-panel .toggle-group .toggle-btn:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

#settings-panel .toggle-group .toggle-btn:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

#settings-panel .toggle-btn.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

body:not(.theme-alt-disabled) #settings-panel .toggle-btn.is-active {
  background: linear-gradient(180deg, rgba(255, 180, 84, 0.2), rgba(255, 180, 84, 0.1)) !important;
  border-color: var(--border) !important;
  color: rgba(255, 180, 84, 0.98) !important;
  box-shadow: none !important;
}

body.test-mode #settings-panel .quote-ring-settings,
body.test-mode #settings-panel .quote-ring-settings .quote-config-label,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings button {
  font-family: var(--sans);
}

#settings-panel .settings-quotes-card,
#settings-panel .settings-quotes-card * {
  font-family: var(--sans);
}

.info-tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  margin-left: 0;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.8);
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
  line-height: 1;
  padding: 0;
  background: rgba(10, 12, 30, 0.6);
  position: relative;
  z-index: 5;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
}

body.has-global-info-tip .info-tip::after {
  display: none !important;
}

.settings-row {
  position: relative;
}

.settings-label-with-tip {
  display: inline-flex;
  align-items: center;
  gap: 0;
}

.settings-label-with-tip .metric-info {
  position: relative;
  margin-left: 6px;
  margin-right: 0;
}

.settings-label-with-tip .metric-info.scanner-historical-tip {
  margin-left: 2px;
}

/* Keep scanner/ring-setup tooltips behaving exactly like settings tooltips. */
.scanner-config-card,
.scanner-threshold-row,
.quote-ring-settings,
.quote-settings-tabs,
.quote-settings-pane,
.quote-settings-grid,
.quote-settings-item,
.quote-config-label.settings-label-with-tip {
  overflow: visible;
}

.scanner-config-card .settings-label-with-tip,
.quote-ring-settings .settings-label-with-tip {
  display: inline-flex;
  align-items: center;
  gap: 0;
}

.info-tip::after {
  content: attr(data-info);
  position: absolute;
  top: 22px;
  left: 50%;
  z-index: 5001;
  min-width: 220px;
  max-width: 280px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.95) !important;
  color: var(--text);
  font-size: 11px;
  line-height: 1.3;
  text-transform: none;
  letter-spacing: 0;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3);
  opacity: 0;
  transform: translate(-50%, -4px);
  pointer-events: none;
  transition: opacity 0.12s ease, transform 0.12s ease;
}

.info-tip-popover {
  position: fixed;
  left: -9999px;
  top: -9999px;
  z-index: 20000;
  min-width: 220px;
  max-width: 280px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid rgba(124, 142, 176, 0.34);
  background: linear-gradient(180deg, rgba(27, 35, 54, 0.98), rgba(20, 27, 44, 0.96));
  color: #d5dfef;
  font-size: 11px;
  line-height: 1.3;
  letter-spacing: 0;
  text-transform: none;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.38), 0 0 0 1px rgba(124, 142, 176, 0.12) inset;
  backdrop-filter: blur(8px);
  opacity: 0;
  transform: translate(-50%, -4px);
  transition: opacity 0.12s ease, transform 0.12s ease;
  pointer-events: none;
}

.info-tip-popover.is-open {
  opacity: 1;
  transform: translate(-50%, 0);
}

.info-tip.is-open {
  z-index: 5000;
}

.info-tip.is-open::after {
  opacity: 1;
  transform: translate(-50%, 0);
}

body:not(.theme-alt-disabled) .info-tip {
  border-color: rgba(140, 156, 186, 0.55);
  background: rgba(16, 22, 36, 0.78);
  color: #9eafca;
  box-shadow: 0 0 0 1px rgba(136, 154, 186, 0.2);
}

body:not(.theme-alt-disabled) .info-tip::after {
  border-color: rgba(124, 142, 176, 0.34);
  background: linear-gradient(180deg, rgba(27, 35, 54, 0.98), rgba(20, 27, 44, 0.96)) !important;
  color: #d5dfef;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.38), 0 0 0 1px rgba(124, 142, 176, 0.12) inset;
  backdrop-filter: blur(8px);
}

body.theme-alt-disabled .info-tip {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.35);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
  color: #4b5568;
}

body.theme-alt-disabled .info-tip::after {
  background: rgba(255, 255, 255, 1) !important;
  border-color: rgba(0, 0, 0, 0.16);
  color: #1f2a37;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
  backdrop-filter: none !important;
}

body.theme-alt-disabled .info-tip-popover {
  border-color: rgba(0, 0, 0, 0.16);
  background: rgba(255, 255, 255, 1);
  color: #1f2a37;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
  backdrop-filter: none;
}

.connections-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}

.connections-grid.two-col {
  grid-template-columns: repeat(2, minmax(260px, 1fr));
}

.api-pass-row input {
  margin-top: 6px;
}

.api-input-row {
  display: flex;
  align-items: center;
  gap: 0;
  width: 100%;
}

.api-toggle {
  margin-left: 6px;
}


.api-input-row input {
  flex: 1 1 auto;
  width: auto;
}

.api-toggle {
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--muted);
  border-radius: 8px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease, color 0.12s ease;
}

.api-toggle:hover {
  color: var(--text);
  box-shadow: 0 0 0 1px rgba(77, 213, 255, 0.25);
}

.api-toggle.is-active {
  color: var(--accent-2);
}

.connection-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  border-radius: 16px;
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
}

.connection-status {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border-radius: 16px;
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
}

.connections-message {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
  min-height: 18px;
}

.connection-title {
  font-size: 14px;
  font-weight: 600;
}

.connection-block label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  width: 100%;
}

.connection-block input {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 10px;
  color: var(--text);
  font-family: var(--mono);
  width: 100%;
}

.connection-block select {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  width: 100%;
  padding: 8px 10px;
  color: var(--text);
  font-family: var(--mono);
}

.connection-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: flex-end;
}

.switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
}

.switch input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.switch-slider {
  width: 54px;
  height: 28px;
  border-radius: 999px;
  background: linear-gradient(180deg, #888, #fff);
  border: 1px solid rgba(120, 136, 154, 0.35);
  position: relative;
  display: inline-block;
  overflow: hidden;
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.12);
  transition: border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease;
}

.switch-slider::after {
  content: '';
  position: absolute;
  width: 30px;
  height: 22px;
  border-radius: 999px;
  top: 2px;
  left: 1px;
  background: linear-gradient(180deg, #ffffff, #afafaf);
  box-shadow:
    0 1px 4px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  z-index: 2;
  transition: transform 0.22s ease, background 0.22s ease;
}

.switch input:checked + .switch-slider {
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.12), 0 0 14px rgba(46, 221, 243, 0.28);
}

.switch-slider::before {
  content: '';
  position: absolute;
  inset: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #2eddf3 50%, #68838d 50%);
  background-size: 200% 100%;
  background-position: 100% 50%;
  transition: background-position 0.22s ease;
  z-index: 1;
}

.switch input:checked + .switch-slider::after {
  transform: translateX(21px);
}

.switch input:checked + .switch-slider::before {
  background-position: 0 50%;
}

.switch input:focus-visible + .switch-slider {
  outline: 2px solid rgba(140, 196, 255, 0.34);
  outline-offset: 2px;
}

.quotes-switch {
  justify-content: flex-end;
}

.primary-btn {
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8));
  color: #0b0d20;
  padding: 6px 14px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 12px;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 3px 10px rgba(16, 28, 60, 0.26);
}

.secondary-btn {
  border: 1px solid rgba(120, 190, 255, 0.4);
  background: rgba(10, 12, 30, 0.5);
  color: #fff;
  padding: 8px 18px;
  border-radius: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18);
}

.secondary-btn:hover {
  color: rgba(255, 180, 84, 0.95);
}

#clear-history-settings {
  border: 1px solid rgba(255, 180, 84, 0.6);
  font-size: 10px;
  font-weight: 600;
  color: #fff;
}

body.theme-alt-disabled #clear-history-settings,
body.theme-alt-disabled #clear-connection-logs,
body.theme-alt-disabled #scanner-clear-signals {
  color: #1f2a37 !important;
}

#clear-history-settings:hover {
  color: rgba(255, 180, 84, 0.95);
}

#reset-sim-balances {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  line-height: 23px;
}

.primary-btn:active,
.secondary-btn:active,
.tab-btn:active,
.toggle-btn:active {
  transform: translateY(1px) scale(0.98);
  box-shadow: inset 0 2px 6px rgba(5, 8, 20, 0.35);
}

.primary-btn.small-btn {
  padding: 4px 12px;
  font-size: 11px;
  line-height: 20px;
  min-height: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.quote-add-btn {
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: linear-gradient(180deg, rgba(228, 232, 240, 0.96), rgba(208, 214, 226, 0.94));
  color: #0b0d20;
  padding: 4px 12px;
  border-radius: 8px;
  font-size: 10px;
  font-family: var(--sans);
  line-height: 20px;
  box-shadow: none;
  height: 20px;
  min-height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.primary-btn.small-btn.quote-add-btn {
  padding: 4px 12px;
  font-size: 10px;
  min-height: 20px;
  height: 20px;
  line-height: 20px;
}

.quote-add-btn:hover {
  color: #0b0d20;
  background: linear-gradient(180deg, rgba(236, 240, 247, 0.98), rgba(216, 222, 234, 0.96));
}

.quote-edit-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.settings-quotes-card .quote-rings,
.settings-quotes-card .quote-edit-actions {
  display: none;
}

.settings-quotes-card.is-editing .quote-rings {
  display: flex;
  flex-direction: column;
}

.settings-quotes-card.is-editing .quote-edit-actions {
  display: block;
}

.settings-quotes-card.is-editing .quote-edit-actions {
  display: inline-flex;
}

.settings-quotes-card.is-editing .quotes-table {
  display: none;
}

.settings-quotes-card.is-editing #quote-edit-toggle {
  display: none;
}

.edit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  line-height: 1;
}

.edit-icon-ico {
  width: 16px;
  height: 16px;
  display: block;
}

.settings-quotes-card #quote-edit-toggle .edit-icon,
.settings-quotes-card #quote-edit-toggle .edit-icon-ico {
  width: 14px;
  height: 14px;
}

.edit-icon-btn {
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}


.quote-add-btn:hover {
  background: radial-gradient(circle at 30% 20%, rgba(255, 205, 112, 0.95), rgba(77, 213, 255, 0.35));
}

.status-inline {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
}

.connection-status {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
}

.connection-status.is-config-open {
  background: transparent;
  border-color: transparent;
  padding: 0;
}

.api-config-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
  justify-self: end;
  margin-left: auto;
}

.inline-api-config-card > .card-header {
  grid-template-columns: 1fr auto;
}

.connection-status-title {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.connection-status-title .primary-btn {
  text-transform: none;
  letter-spacing: 0;
}

.mode-badge {
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid var(--border);
  font-size: 6px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
}

.mode-badge.is-demo {
  color: #ffb454;
  border-color: rgba(255, 180, 84, 0.5);
}

.connection-status-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: var(--mono);
  font-size: 12px;
}

#settings-panel .connection-status-list,
#settings-panel .connection-status-name,
#settings-panel .connection-status-list .status-pill {
  font-family: var(--sans);
}

#settings-panel .connection-status-list .status-pill {
  font-size: 9px;
}

.connection-logs {
  margin-top: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.connection-logs .card-header h2 {
  font-size: 15px;
}

.connection-log-list {
  display: block;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
  max-height: 282px;
  overflow-y: auto;
  padding-right: 4px;
}

#settings-panel .connection-logs .connection-log-list {
  max-height: 282px;
  flex: 1;
}

.connection-log-list::-webkit-scrollbar {
  width: 6px;
}

.connection-logs .card-header .primary-btn,
.connection-logs .card-header .secondary-btn {
  padding: 4px 12px;
  font-size: 10px;
  min-height: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#settings-panel .card-header #save-settings.primary-btn {
  padding: 4px 12px;
  font-size: 10px;
  min-height: 20px;
  height: 20px;
  line-height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#save-quote-rings.primary-btn {
  padding: 4px 12px;
  font-size: 10px;
  min-height: 20px;
  height: 20px;
  line-height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Settings gray iOS-style action buttons */
#settings-panel #save-settings.primary-btn,
body.test-mode #settings-panel #save-connections.quote-ring-params,
#settings-panel #save-quote-rings.primary-btn,
#settings-panel .quote-edit-actions .quote-add-btn.primary-btn,
#settings-panel #trading-feed-add.primary-btn,
#settings-panel #clear-connection-logs.primary-btn {
  background: linear-gradient(180deg, rgba(228, 232, 240, 0.96), rgba(208, 214, 226, 0.94)) !important;
  border-color: rgba(120, 128, 146, 0.5) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 2px 6px rgba(62, 70, 86, 0.14) !important;
}

#settings-panel #save-settings.primary-btn:hover,
body.test-mode #settings-panel #save-connections.quote-ring-params:hover,
#settings-panel #save-quote-rings.primary-btn:hover,
#settings-panel .quote-edit-actions .quote-add-btn.primary-btn:hover,
#settings-panel #trading-feed-add.primary-btn:hover,
#settings-panel #clear-connection-logs.primary-btn:hover {
  background: linear-gradient(180deg, rgba(236, 240, 247, 0.98), rgba(216, 222, 234, 0.96)) !important;
}

/* alternate mode: force settings action buttons to blue on hover. */
body.theme-alt-disabled #settings-panel #save-settings.primary-btn:hover,
body.theme-alt-disabled #settings-panel #save-connections.quote-ring-params:hover,
body.theme-alt-disabled #settings-panel #save-quote-rings.primary-btn:hover,
body.theme-alt-disabled #settings-panel .quote-edit-actions .quote-add-btn.primary-btn:hover,
body.theme-alt-disabled #settings-panel #trading-feed-add.primary-btn:hover,
body.theme-alt-disabled #settings-panel #clear-connection-logs.primary-btn:hover,
body.theme-alt-disabled #settings-panel #delete-connection.quote-ring-remove:hover,
body.theme-alt-disabled #settings-panel .primary-btn:hover,
body.theme-alt-disabled #settings-panel .secondary-btn:hover {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
}

/* Dark mode: restore original gradient style for save/clear actions */
body:not(.theme-alt-disabled) #settings-panel #save-settings.primary-btn,
body:not(.theme-alt-disabled) #settings-panel #save-connections.quote-ring-params,
body:not(.theme-alt-disabled) #settings-panel #save-quote-rings.primary-btn,
body:not(.theme-alt-disabled) #settings-panel .quote-edit-actions .quote-add-btn.primary-btn,
body:not(.theme-alt-disabled) #settings-panel #trading-feed-add.primary-btn,
body:not(.theme-alt-disabled) #settings-panel #delete-connection.quote-ring-remove,
body:not(.theme-alt-disabled) #settings-panel #clear-connection-logs.primary-btn {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #0b0d20 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 3px 10px rgba(16, 28, 60, 0.26) !important;
}

.connection-log-list::-webkit-scrollbar-track {
  background: rgba(10, 12, 30, 0.6);
  border-radius: 999px;
}

.connection-log-list::-webkit-scrollbar-thumb {
  background: rgba(77, 213, 255, 0.35);
  border-radius: 999px;
}

.connection-log-list {
  scrollbar-color: rgba(77, 213, 255, 0.35) rgba(10, 12, 30, 0.6);
  scrollbar-width: thin;
}

.connection-log-item {
  border-bottom: 1px solid var(--border);
}

.connection-logs-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(10, 12, 30, 0.45);
}

body.theme-alt-disabled .connection-logs-table {
  background: #f3f5fa;
}

.connection-logs-table th,
.connection-logs-table td {
  padding: 8px 10px;
  text-align: left;
  border-bottom: 1px solid rgba(120, 140, 180, 0.28);
}

.connection-logs-table th {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  font-size: 10px;
  border-bottom: 1px solid rgba(120, 140, 180, 0.42);
}

.connection-logs-table th + th,
.connection-logs-table td + td {
  border-left: 1px solid rgba(120, 140, 180, 0.28);
}

.connection-logs-table tbody tr:last-child td {
  border-bottom: none;
}

body.theme-alt-disabled .connection-logs-table th,
body.theme-alt-disabled .connection-logs-table td {
  border-bottom-color: rgba(110, 124, 148, 0.36);
}

body.theme-alt-disabled .connection-logs-table th {
  border-bottom-color: rgba(110, 124, 148, 0.46);
}

body.theme-alt-disabled .connection-logs-table th + th,
body.theme-alt-disabled .connection-logs-table td + td {
  border-left-color: rgba(110, 124, 148, 0.34);
}

/* Connection logs: force visible outer border across themes. */
#settings-panel .connection-log-list {
  border: 1px solid rgba(120, 140, 180, 0.38) !important;
}

#settings-panel .connection-log-list .connection-logs-table {
  border: 1px solid rgba(120, 140, 180, 0.42) !important;
}

body.theme-alt-disabled #settings-panel .connection-log-list {
  border-color: rgba(110, 124, 148, 0.42) !important;
}

body.theme-alt-disabled #settings-panel .connection-log-list .connection-logs-table {
  border-color: rgba(110, 124, 148, 0.48) !important;
}

/* Dark mode: connection logs background matches settings surfaces. */
body.test-mode #settings-panel .connection-log-list,
body.test-mode #settings-panel .connection-log-list .connection-logs-table {
  background: rgba(24, 32, 48, 0.78) !important;
}

.connection-logs-table td:first-child {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.connection-logs-table td:last-child {
  white-space: nowrap;
  width: 1%;
}

.connection-log-empty td {
  text-align: center;
  color: var(--muted);
}

.connection-status-row {
  display: grid;
  grid-template-columns: 1fr 190px;
  align-items: center;
  gap: 12px;
}

.connection-status-name {
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}

.status-actions {
  display: inline-flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-self: end;
  min-width: 160px;
}

.status-actions .primary-btn,
.status-actions .primary-btn.conn-btn-connected,
.status-actions .primary-btn.conn-btn-disconnected,
.status-actions .primary-btn[data-conn-state="connected"],
.status-actions .primary-btn[data-conn-state="disconnected"] {
  padding: 0 8px;
  font-size: 9px;
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  height: 21px;
  min-height: 21px;
  max-height: 21px;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
}

#settings-panel #trading-feed-add.primary-btn {
  padding: 2px 8px;
  font-size: 9px;
  min-width: 96px;
  height: 21px;
  min-height: 21px;
  line-height: 21px;
}

.status-actions .primary-btn.conn-btn-connected {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #0b0d20 !important;
}

.status-actions .primary-btn.conn-btn-disconnected {
  background: linear-gradient(120deg, rgba(77, 213, 255, 0.8), rgba(255, 180, 84, 0.8)) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #0b0d20 !important;
}

/* alternate mode: match connect/disconnect buttons to settings save/clear style */
body.theme-alt-disabled .status-actions .primary-btn.conn-btn-connected,
body.theme-alt-disabled .status-actions .primary-btn.conn-btn-disconnected {
  background: linear-gradient(180deg, rgba(228, 232, 240, 0.96), rgba(208, 214, 226, 0.94)) !important;
  border-color: rgba(120, 128, 146, 0.5) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 2px 6px rgba(62, 70, 86, 0.14) !important;
}

body.theme-alt-disabled #settings-panel .status-actions .primary-btn,
body.theme-alt-disabled #settings-panel .status-actions .primary-btn.conn-btn-connected,
body.theme-alt-disabled #settings-panel .status-actions .primary-btn.conn-btn-disconnected,
body.theme-alt-disabled #settings-panel .status-actions .primary-btn[data-conn-state="connected"],
body.theme-alt-disabled #settings-panel .status-actions .primary-btn[data-conn-state="disconnected"] {
  background: linear-gradient(180deg, rgba(228, 232, 240, 0.96), rgba(208, 214, 226, 0.94)) !important;
  border-color: rgba(120, 128, 146, 0.5) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 2px 6px rgba(62, 70, 86, 0.14) !important;
}

/* Dark mode settings: use dark borders for all buttons */
body:not(.theme-alt-disabled) #settings-panel .primary-btn,
body:not(.theme-alt-disabled) #settings-panel .secondary-btn,
body:not(.theme-alt-disabled) #settings-panel .toggle-btn,
body:not(.theme-alt-disabled) #settings-panel .quote-ring-params,
body:not(.theme-alt-disabled) #settings-panel .quote-ring-remove {
  border-color: rgba(20, 26, 38, 0.85) !important;
}


#trading-feed-add.primary-btn {
  padding: 2px 8px;
  font-size: 9px;
  min-width: 96px;
  height: 21px;
  min-height: 21px;
  line-height: 21px;
  text-align: center;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#trading-feed-add.primary-btn:hover {
  color: inherit;
}


.connection-status-list.is-editing .status-actions {
  min-width: 200px;
}

.icon-btn {
  border: none;
  background: none;
  color: #fff;
  width: auto;
  height: auto;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  padding: 0;
  cursor: pointer;
}

.icon-btn-edit .edit-icon,
.icon-btn-edit .edit-icon-ico {
  width: 12px;
  height: 12px;
}

.icon-btn-edit {
  border: none;
  box-shadow: none;
}

.icon-btn-edit:hover {
  background: transparent;
  opacity: 0.8;
}

.icon-btn-edit .edit-icon-ico {
  filter: brightness(0) invert(1);
  opacity: 0.4;
  transition: filter 0.15s ease, opacity 0.15s ease;
}

.icon-btn-edit:hover .edit-icon-ico {
  filter: brightness(0) saturate(100%) invert(70%) sepia(40%) saturate(520%) hue-rotate(353deg) brightness(102%) contrast(102%);
  opacity: 1;
}

/* alternate mode: make trading-feed edit icon match ring-setup edit icon style */
body.theme-alt-disabled .icon-btn-edit {
  border: 1px solid rgba(0, 0, 0, 0.14);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 4px rgba(0, 0, 0, 0.08);
  padding: 1px 5px;
}

body.theme-alt-disabled .icon-btn-edit .edit-icon-ico {
  filter: brightness(0) saturate(100%) opacity(0.6) !important;
  opacity: 1;
}

body.theme-alt-disabled .icon-btn-edit:hover .edit-icon-ico {
  filter: brightness(0) saturate(100%) opacity(0.85) !important;
}

.icon-btn-delete {
  color: #ff5d93;
  border-color: rgba(255, 93, 147, 0.5);
}

.connection-inline-editor {
  padding-left: 12px;
}

.inline-api-config {
  margin-top: 8px;
}

.inline-api-config-card {
  margin-top: 12px;
  padding: 18px 20px;
  box-shadow: none;
  background: rgba(10, 12, 30, 0.5);
  width: 100%;
}

.inline-api-config-card .connection-block label,
.inline-api-config-card .api-exchange-static {
  font-size: 10px;
}

.inline-api-config-card .connection-block select,
.inline-api-config-card .api-exchange-static .api-exchange-value {
  font-size: 13px;
}

.api-exchange-static {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
}

.api-exchange-static .api-exchange-value {
  background: rgba(10, 12, 30, 0.6);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 10px;
  font-family: var(--mono);
  color: var(--text);
}

.api-market-type-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.api-market-type-tabs {
  width: 100%;
  gap: 0;
}

.api-market-type-tabs .toggle-btn {
  flex: 1 1 0;
  justify-content: center;
  min-width: 0;
  border-radius: 0;
}

.api-market-type-tabs .toggle-btn + .toggle-btn {
  margin-left: 0;
  border-left: none;
}

.api-market-type-tabs .toggle-btn:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.api-market-type-tabs .toggle-btn:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

#settings-panel .inline-api-config-card.settings-card .api-market-type-tabs .toggle-btn,
#settings-panel .inline-api-config-card.settings-card .api-market-type-tabs .toggle-btn:hover:not(:disabled),
#settings-panel .inline-api-config-card.settings-card .api-market-type-tabs .toggle-btn:focus-visible:not(:disabled),
#settings-panel .inline-api-config-card.settings-card .api-market-type-tabs .toggle-btn.is-active,
#settings-panel .inline-api-config-card.settings-card .api-market-type-tabs .toggle-btn.is-active:hover:not(:disabled),
#settings-panel .inline-api-config-card.settings-card .api-market-type-tabs .toggle-btn.is-active:focus-visible:not(:disabled) {
  min-height: 25px !important;
  height: 25px !important;
  line-height: 25px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.api-market-type-note {
  margin: 0;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: none;
}

.status-pill {
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  min-width: 96px;
  text-align: center;
  white-space: nowrap;
}

.status-latency {
  text-transform: none;
  letter-spacing: 0;
  width: 72px;
  font-size: 11px;
  color: var(--text);
  font-weight: 700;
  transform: translateY(-1px);
}

.status-latency.status-latency-high {
  background: rgba(255, 93, 147, 0.28) !important;
  color: #ffe3ee !important;
}

body.theme-alt-disabled .status-pill.status-latency.status-latency-high {
  background: rgba(255, 109, 109, 0.24) !important;
  color: #7f1e1e !important;
}

.status-ok {
  color: #4ade80;
  border-color: rgba(74, 222, 128, 0.5);
}

.status-warn {
  color: #f0c36c;
  border-color: rgba(240, 195, 108, 0.5);
}

.status-error {
  color: #ff5d93;
  border-color: rgba(255, 93, 147, 0.5);
}

.status-warn {
  color: #f0c36c;
  border-color: rgba(240, 195, 108, 0.5);
}

.status-pending {
  color: var(--muted);
}


.chart-card {
  display: flex;
  flex-direction: column;
  height: 440px;
  min-width: 0;
}

.chart-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  flex: 1;
  overflow: hidden;
}

.chart-scroll {
  padding-top: 8px;
}

.chart-pan {
  width: 100%;
  -webkit-appearance: none;
  appearance: none;
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  outline: none;
}

.chart-pan::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--accent-2);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

.chart-pan::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: none;
  background: var(--accent-2);
  cursor: pointer;
}

.chart-pan:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}


.chart-card canvas {
  width: 100%;
  flex: 1;
  min-height: 0;
  height: auto;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(6, 10, 25, 0.6), rgba(6, 10, 25, 0.2));
  display: block;
}

.chart-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.chart-extremes {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.chart-extreme {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  border-radius: 5px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.55);
  font-family: var(--mono);
  font-size: 11px;
  color: var(--muted);
  min-width: 90px;
  height: 24px;
  min-height: 24px;
  max-height: 24px;
  box-sizing: border-box;
}

.chart-extremes .primary-btn.small-btn {
  padding: 4px 10px;
  font-size: 11px;
  line-height: 1;
  min-height: 26px;
  height: 26px;
}

.chart-extreme span:last-child {
  color: var(--text);
  font-size: 12px;
}

.chart-controls {
  display: flex;
  gap: 0;
  flex-wrap: wrap;
}

.chart-controls-reset {
  order: 1;
  margin-left: 8px;
  margin-right: 0;
}

.chart-view-toggle {
  display: inline-flex;
  gap: 0;
  margin-left: 0;
}

.chart-view-toggle {
  order: -1;
  margin-right: auto;
}

.chart-view-toggle .chart-btn {
  border-radius: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.chart-view-toggle .chart-btn + .chart-btn {
  border-left: none;
}

body:not(.arb-two) .chart-view-toggle .chart-btn[data-chart-mode="pairs"] {
  display: none;
}

body:not(.arb-two) .chart-view-toggle .chart-btn[data-chart-mode="pspread"] {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.chart-view-toggle .chart-btn:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.chart-view-toggle .chart-btn:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.chart-btn {
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--muted);
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 11px;
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 2px 8px rgba(0, 0, 0, 0.14);
}

.chart-controls .chart-btn {
  border-radius: 0;
}

.chart-controls .toggle-btn {
  border-radius: 0;
  padding: 6px 12px;
  height: auto;
}

.chart-controls .toggle-btn.chart-reset-btn {
  border-radius: 6px;
  height: 23px;
  min-height: 23px;
  line-height: 23px;
  padding: 0 12px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.chart-controls .toggle-btn.chart-reset-btn:hover {
  border-color: rgba(77, 213, 255, 0.55);
  color: #4dd5ff;
  background: rgba(77, 213, 255, 0.14);
  box-shadow: 0 0 0 1px rgba(77, 213, 255, 0.22), 0 3px 10px rgba(0, 0, 0, 0.16);
}

body:not(.theme-alt-disabled) .chart-controls .toggle-btn.chart-reset-btn:hover,
body:not(.theme-alt-disabled) .chart-controls .toggle-btn.chart-reset-btn:focus-visible {
  border-color: rgba(77, 213, 255, 0.55);
  color: #4dd5ff;
  background: rgba(77, 213, 255, 0.14);
  box-shadow: 0 0 0 1px rgba(77, 213, 255, 0.22), 0 3px 10px rgba(0, 0, 0, 0.16);
}

.chart-controls .chart-btn + .chart-btn {
  border-left: none;
}

.chart-controls > .chart-btn:first-of-type {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.chart-controls > .chart-btn:last-of-type {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.chart-zoom-group {
  display: inline-flex;
  gap: 0;
  margin-left: 6px;
}

.chart-zoom-group .chart-zoom-btn {
  padding: 6px 10px;
  min-width: 32px;
  border-radius: 0;
}

.chart-zoom-group .chart-zoom-btn + .chart-zoom-btn {
  border-left: none;
}

.chart-zoom-group .chart-zoom-btn:first-child {
  border-top-left-radius: 999px;
  border-bottom-left-radius: 999px;
}

.chart-zoom-group .chart-zoom-btn:last-child {
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
}

.chart-btn.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1));
  border-color: rgba(77, 213, 255, 0.55);
  color: #4dd5ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 6px rgba(77, 213, 255, 0.14);
}

body:not(.theme-alt-disabled) .chart-btn.is-active,
body:not(.theme-alt-disabled) .positions-tab.is-active,
body:not(.theme-alt-disabled) .report-tab.is-active,
body:not(.theme-alt-disabled) .timeframe-btn.is-active,
body:not(.theme-alt-disabled) .report-subtab.is-active,
body:not(.theme-alt-disabled) #support-panel .report-subtab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1));
  border-color: var(--border);
  color: #4dd5ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 6px rgba(77, 213, 255, 0.14);
  border-left-color: var(--border) !important;
}




.table-card {
  padding-bottom: 10px;
  margin-top: 14px;
}

.scanner-card {
  padding-bottom: 12px;
}

.scanner-card .card-header {
  justify-content: flex-start;
}

.scanner-card .card-header .toggle-group {
  margin-left: auto;
}

.scanner-card .card-header .toggle-group {
  gap: 0;
}

.scanner-card .card-header .toggle-group .toggle-btn {
  border: none;
  box-shadow: none;
  border-radius: 0;
  margin-left: 0;
  font-family: var(--sans);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  font-size: 11px;
  padding: 4px 12px;
  min-height: 24px;
}

.scanner-card .card-header .toggle-group .toggle-btn:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  margin-left: 0;
}

.scanner-card .card-header .toggle-group .toggle-btn:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.scanner-card .card-header .toggle-group .toggle-btn.is-active {
  border: none;
  box-shadow: none;
}

#scanner-replay-signals,
#scanner-clear-signals,
#scanner-refresh,
#scanner-config-toggle {
  padding: 4px 12px;
  font-size: 11px;
}

#scanner-replay-signals,
#scanner-refresh,
#scanner-config-toggle {
  min-width: 88px;
  justify-content: center;
}

#scanner-replay-signals.is-loading,
#scanner-refresh.is-loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
}

#scanner-replay-signals .btn-scan,
#scanner-refresh .btn-scan {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 0;
  vertical-align: middle;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 1.5px solid currentColor;
  position: relative;
  opacity: 0.85;
  transform: translateY(0);
}

#scanner-replay-signals .btn-scan::before,
#scanner-refresh .btn-scan::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1px;
  height: 5px;
  border-radius: 1px;
  background: currentColor;
  transform-origin: 50% 100%;
  transform: translate(-50%, -100%) rotate(0deg);
  animation: scanner-sweep 0.9s linear infinite;
}

#scanner-replay-signals .btn-scan::after,
#scanner-refresh .btn-scan::after {
  content: '';
  position: absolute;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: currentColor;
  left: calc(50% - 1px);
  top: calc(50% - 1px);
  opacity: 0.7;
}

@keyframes scanner-sweep {
  0% { transform: translate(-50%, -100%) rotate(0deg); opacity: 0.35; }
  50% { opacity: 1; }
  100% { transform: translate(-50%, -100%) rotate(360deg); opacity: 0.35; }
}

.scanner-config-card .primary-btn,
.scanner-config-card .secondary-btn {
  padding: 4px 12px;
  font-size: 11px;
}

/* Keep all scanner-config action buttons visually aligned with Scan/Config buttons. */
#scanner-panel .scanner-config-card .primary-btn,
#scanner-panel .scanner-config-card .secondary-btn {
  background: linear-gradient(135deg, rgba(255, 206, 122, 0.95), rgba(118, 208, 245, 0.95));
  border: 1px solid rgba(128, 220, 250, 0.5);
  color: #0b1330;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

#scanner-panel .scanner-config-card .primary-btn:hover,
#scanner-panel .scanner-config-card .secondary-btn:hover {
  filter: brightness(1.03);
}

/* Match scanner config buttons to settings button style in alternate mode */
body.theme-alt-disabled #scanner-replay-signals,
body.theme-alt-disabled #scanner-clear-signals,
body.theme-alt-disabled #scanner-refresh,
body.theme-alt-disabled #scanner-config-toggle,
body.theme-alt-disabled .scanner-config-card .primary-btn,
body.theme-alt-disabled .scanner-config-card .secondary-btn {
  background: linear-gradient(180deg, rgba(228, 232, 240, 0.96), rgba(208, 214, 226, 0.94)) !important;
  border-color: rgba(120, 128, 146, 0.5) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 2px 6px rgba(62, 70, 86, 0.14) !important;
}

/* Ensure scanner animation is visible in alternate mode */
body.theme-alt-disabled #scanner-replay-signals .btn-scan,
body.theme-alt-disabled #scanner-refresh .btn-scan {
  border-color: #2f3a4d !important;
}

body.theme-alt-disabled #scanner-replay-signals .btn-scan::before,
body.theme-alt-disabled #scanner-replay-signals .btn-scan::after,
body.theme-alt-disabled #scanner-refresh .btn-scan::before,
body.theme-alt-disabled #scanner-refresh .btn-scan::after {
  background: #2f3a4d !important;
}

.scanner-table {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(10, 12, 30, 0.55);
}

.scanner-row {
  display: grid;
  grid-template-columns: 36px minmax(220px, 2.1fr) minmax(150px, 1.1fr) minmax(150px, 1.1fr) minmax(86px, 0.85fr) minmax(86px, 0.85fr) minmax(72px, 0.6fr) minmax(88px, 0.72fr) minmax(86px, 0.75fr);
  gap: 12px;
  align-items: center;
  justify-items: start;
  padding: 10px 14px;
  font-size: 12px;
  color: var(--text);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.scanner-table.is-live-only .scanner-row {
  grid-template-columns: 36px minmax(220px, 2.1fr) minmax(150px, 1.1fr) minmax(150px, 1.1fr) minmax(86px, 0.85fr) minmax(86px, 0.85fr) minmax(72px, 0.6fr) minmax(86px, 0.75fr);
}

.scanner-table.is-live-only .scanner-head-historical {
  display: none;
}

.scanner-row > div {
  align-self: center;
}

.scanner-value.threshold-over {
  color: #2dd4bf;
}

.scanner-value.threshold-under {
  color: #f87171;
}

.scanner-status {
  display: inline;
  min-height: 0;
  padding: 0;
  border: none;
  background: transparent;
  font-size: 10px;
  letter-spacing: 0.02em;
  white-space: nowrap;
  color: var(--muted);
}

.scanner-status.is-live {
  color: #34d399;
}

.scanner-status.is-idle {
  color: #fcd34d;
}

.scanner-status.is-skip {
  color: #fbbf24;
}

.scanner-status.is-error {
  color: #fb923c;
}

.scanner-status.is-order-sent {
  color: #34d399;
}

.scanner-status.is-no-capacity {
  color: #f59e0b;
}

.scanner-status.is-not-attempted {
  color: #fb923c;
}

.scanner-row:first-child {
  border-top: none;
}

.scanner-head {
  background: rgba(7, 10, 25, 0.65);
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.scanner-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  font-size: 12px;
  color: var(--muted);
}

.scanner-cell.scanner-ring {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.scanner-toggle {
  width: 22px;
  height: 22px;
  border-radius: 4px;
  border: 1px solid rgba(90, 120, 220, 0.6);
  background: rgba(12, 16, 32, 0.85);
  color: var(--text);
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
}

.scanner-details {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding: 10px 14px 12px;
  background: rgba(8, 10, 22, 0.6);
}

.scanner-skip-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--muted);
}

.scanner-skip-summary > span {
  display: inline-flex;
  align-items: center;
  padding: 3px 7px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(10, 13, 28, 0.8);
}

.scanner-skip-summary > .scanner-skip-title {
  color: var(--text);
  border-color: rgba(77, 213, 255, 0.35);
}

.scanner-signal-section + .scanner-signal-section {
  margin-top: 10px;
}

.scanner-signal-section-title {
  margin-bottom: 6px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--muted);
}

.scanner-signals {
  display: grid;
  gap: 6px;
}

.scanner-signal-empty {
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px dashed rgba(255, 255, 255, 0.12);
  background: rgba(8, 10, 22, 0.45);
  font-size: 11px;
  color: var(--muted);
}

.scanner-signal {
  display: grid;
  grid-template-columns: 0.9fr 1.4fr 0.7fr 1.4fr 1.2fr 0.7fr 0.7fr 0.9fr 1fr 1fr;
  gap: 10px;
  align-items: center;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text);
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(12, 15, 30, 0.8);
}

.scanner-signals.is-live-only .scanner-signal {
  grid-template-columns: 0.9fr 1.4fr 0.7fr 1.4fr 1.2fr 0.7fr 0.7fr 1fr 1fr;
}

.scanner-signal-head {
  background: rgba(8, 10, 22, 0.6);
  border-color: rgba(255, 255, 255, 0.08);
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.positions-tabs {
  display: inline-flex;
  gap: 0;
  flex-wrap: wrap;
}

.positions-tab {
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.6);
  color: var(--muted);
  padding: 6px 12px;
  border-radius: 0;
  font-size: 11px;
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.positions-tab + .positions-tab {
  border-left: none;
}

.positions-tab:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.positions-tab:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.positions-tab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1));
  border-color: rgba(77, 213, 255, 0.55);
  color: #4dd5ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 6px rgba(77, 213, 255, 0.14);
}


.table {
  display: block;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--deals-table-bg);
  margin-bottom: 16px;
  max-height: 420px;
  scrollbar-gutter: stable;
  scrollbar-color: rgba(77, 213, 255, 0.35) rgba(10, 12, 30, 0.6);
  scrollbar-width: thin;
}

.table::-webkit-scrollbar {
  width: 8px;
}

.table::-webkit-scrollbar-track {
  background: rgba(10, 12, 30, 0.6);
  border-radius: 999px;
}

.table::-webkit-scrollbar-thumb {
  background: rgba(77, 213, 255, 0.35);
  border-radius: 999px;
  border: 2px solid rgba(10, 12, 30, 0.6);
}

.deal-logs {
  display: none;
  flex-direction: column;
  gap: 6px;
  font-family: var(--sans);
  font-size: 11px;
  color: var(--muted);
  max-height: 220px;
  overflow-y: scroll;
  scrollbar-gutter: stable;
  padding: 8px 10px;
  scrollbar-color: rgba(77, 213, 255, 0.35) rgba(10, 12, 30, 0.6);
  scrollbar-width: thin;
}

.deal-logs.is-active {
  display: flex;
}

.deal-logs::-webkit-scrollbar {
  width: 8px;
}

.deal-logs::-webkit-scrollbar-track {
  background: rgba(10, 12, 30, 0.6);
  border-radius: 999px;
}

.deal-logs::-webkit-scrollbar-thumb {
  background: rgba(77, 213, 255, 0.35);
  border-radius: 999px;
  border: 2px solid rgba(10, 12, 30, 0.6);
}

.deal-log-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: rgba(10, 12, 30, 0.45);
}

.deal-log-row.is-empty {
  justify-content: center;
  text-align: center;
}

.deal-log-row span:first-child {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.deal-log-row span:last-child {
  white-space: nowrap;
  color: var(--text);
}

.table-row {
  display: grid;
  grid-template-columns: 72px 120px 1fr 60px 96px 100px 100px 150px 90px 52px;
  gap: 0;
  padding: 0;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  font-family: var(--sans);
  background: transparent;
  flex-shrink: 0;
}

.table.is-closed .table-row {
  grid-template-columns: 72px 120px 1fr 60px 96px 100px 100px 150px 90px;
}


.table-row.is-empty {
  grid-template-columns: 1fr;
  text-align: center;
  justify-items: center;
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 14px 12px;
  color: var(--muted);
}

.table-head {
  font-family: var(--sans);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  background: rgba(6, 10, 25, 0.85);
  position: sticky;
  top: 0;
  z-index: 2;
}

.table-row div {
  padding: 8px 10px;
  border-right: 1px solid var(--border);
  display: flex;
  align-items: center;
  min-height: 34px;
}

.table-row div:last-child {
  border-right: none;
  justify-content: center;
}

.table-head-deals {
  display: none;
}

.table-head-positions {
  display: grid;
}

.deals-table {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--deals-table-bg);
}

.deal-logs {
  background: var(--deals-table-bg);
}

.deals-row {
  display: grid;
  grid-template-columns: 120px 90px 1fr 1.2fr 70px 70px 60px 155px 90px 70px;
  gap: 0;
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  font-family: var(--sans);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.14);
}

.deals-row.is-closed {
  grid-template-columns: 125px 85px 1fr 1.2fr 70px 70px 60px 150px 90px;
}

.deals-row.deals-head {
  grid-template-columns: 120px 90px 1fr 1.2fr 70px 70px 60px 155px 90px 70px;
  box-shadow: none;
}

.deals-row.deals-head.is-closed {
  grid-template-columns: 125px 85px 1fr 1.2fr 70px 70px 60px 150px 90px;
}

.deals-row.is-closed div:last-child {
  display: none;
}

.deals-row.deals-head.is-closed div:last-child {
  display: none;
}

.deals-row div {
  padding: 8px 10px;
  border-right: 1px solid var(--border);
  display: flex;
  align-items: center;
  min-height: 34px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.deals-row div:last-child {
  border-right: none;
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}

.deals-row div:nth-child(5) {
  justify-content: center;
}

.deals-row div:nth-child(6),
.deals-row div:nth-child(7) {
  justify-content: center;
}

.deals-row div:nth-child(2) {
  justify-content: center !important;
  text-align: center;
  padding-left: 0 !important;
  padding-right: 0;
  white-space: nowrap;
}

.deals-row div:nth-child(9) {
  justify-content: center;
  text-align: center;
  padding-right: 0;
}



.deal-close-btn {
  background: rgba(255, 90, 120, 0.18);
  border: 1px solid rgba(255, 110, 140, 0.5);
  color: #ff93a8;
  font-size: 9px;
  font-weight: 600;
  padding: 0 6px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  position: relative;
  min-width: 40px;
  height: 18px;
  min-height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  box-sizing: border-box;
  overflow: hidden;
}

.deal-close-btn:hover {
  background: rgba(255, 90, 120, 0.32);
  border-color: rgba(255, 140, 170, 0.75);
  color: #ffd2dc;
}

.deal-close-btn:disabled {
  opacity: 0.5;
  cursor: default;
}

.deal-close-btn.is-loading {
  color: transparent !important;
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(160, 170, 190, 0.45);
  box-shadow: inset 0 0 0 1px rgba(160, 170, 190, 0.25);
  padding: 0 6px;
  min-width: 40px;
  height: 18px;
  min-height: 18px;
  border-radius: 9px;
}

.deal-close-btn.is-loading::after {
  content: '';
  position: absolute;
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(255, 210, 220, 0.35);
  box-shadow: 7px 0 0 rgba(255, 210, 220, 0.35), 14px 0 0 rgba(255, 210, 220, 0.35);
  inset: 0;
  margin: auto;
  transform: translate(-8px, 0);
  animation: deal-dots 1.1s infinite;
  pointer-events: none;
}

@keyframes deal-dots {
  0% {
    background: rgba(255, 210, 220, 0.35);
    box-shadow: 7px 0 0 rgba(255, 210, 220, 0.35), 14px 0 0 rgba(255, 210, 220, 0.35);
  }
  20% {
    background: rgba(255, 210, 220, 0.95);
    box-shadow: 7px 0 0 rgba(255, 210, 220, 0.35), 14px 0 0 rgba(255, 210, 220, 0.35);
  }
  40% {
    background: rgba(255, 210, 220, 0.35);
    box-shadow: 7px 0 0 rgba(255, 210, 220, 0.95), 14px 0 0 rgba(255, 210, 220, 0.35);
  }
  60% {
    background: rgba(255, 210, 220, 0.35);
    box-shadow: 7px 0 0 rgba(255, 210, 220, 0.35), 14px 0 0 rgba(255, 210, 220, 0.95);
  }
  80%,
  100% {
    background: rgba(255, 210, 220, 0.35);
    box-shadow: 9px 0 0 rgba(255, 210, 220, 0.35), 18px 0 0 rgba(255, 210, 220, 0.35);
  }
}

.deal-toggle {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--deals-table-bg);
  color: var(--muted);
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  cursor: pointer;
}

.deal-toggle:hover {
  border-color: rgba(156, 171, 196, 0.3);
  color: var(--text);
}

.deals-details {
  display: none;
  border-bottom: 1px solid var(--border);
  background: rgba(7, 11, 28, 0.8);
  width: 100%;
  box-sizing: border-box;
}

.deals-details.is-open {
  display: block;
}

.deals-detail-list {
  display: flex;
  flex-direction: column;
  padding-left: 0;
  box-sizing: border-box;
}

.deals-detail-row {
  display: grid;
  grid-template-columns: 120px 90px 1fr 0.6fr 0.6fr 0.7fr 0.7fr 1.1fr 0.7fr 0.5fr 90px;
  font-size: 11px;
  color: var(--muted);
  border-top: 1px solid rgba(255, 255, 255, 0.04);
}

.deals-details.is-closed .deals-detail-row {
  grid-template-columns: 120px 90px 1fr 0.6fr 0.6fr 0.7fr 0.7fr 1fr 1fr 0.7fr 0.5fr 90px;
}


.deals-detail-head {
  background: rgba(8, 10, 22, 0.6);
  border-top: none;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 9px;
}

.deals-detail-head div {
  justify-content: flex-start;
  text-align: left;
  padding: 6px 10px;
}

.deals-detail-head div:first-child {
  padding-left: 0;
  padding-right: 0;
  justify-content: center;
  text-align: center;
}

.deals-detail-head div:nth-child(2) {
  justify-content: center !important;
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.deals-detail-row div {
  padding: 6px 10px;
  border-right: 1px solid rgba(255, 255, 255, 0.04);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
  min-height: 28px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.deals-detail-row div.metric-breakdown-cell {
  align-items: flex-start;
  white-space: normal;
  overflow: visible;
  text-overflow: initial;
}

.deals-detail-row div:first-child {
  justify-content: center;
  text-align: center;
}

.deals-detail-row div:last-child {
  border-right: none;
  justify-content: flex-end;
}

.deals-detail-row div:nth-child(4) {
  justify-content: center;
}

.deals-detail-row div:nth-child(3) {
  padding-left: 7px;
  padding-right: 7px;
}

.deals-detail-head div:nth-child(2) {
  justify-content: center;
  text-align: center;
  padding-left: 0;
  padding-right: 0;
}

.deals-detail-row div:nth-child(1) {
  justify-content: center !important;
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  white-space: nowrap;
}

.deals-detail-row div:nth-child(2) {
  justify-content: center !important;
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  white-space: nowrap;
}

.deals-detail-row div:nth-child(3) {
  justify-content: flex-start;
  text-align: left;
}

.deals-detail-row div.net-pnl-cell {
  justify-content: flex-end !important;
  padding-right: 14px !important;
}

.deals-detail-head div.net-pnl-cell {
  justify-content: flex-end;
  text-align: right;
  padding-right: 12px;
}

.deals-detail-row .is-pos {
  color: #63e6a4;
}

.deals-detail-row .is-neg {
  color: #ff8aa3;
}

.deals-detail-row .is-flat {
  color: var(--muted);
}

.deals-row .deals-pnl.is-pos {
  color: #63e6a4;
}

.deals-row .deals-pnl.is-neg {
  color: #ff8aa3;
}

.deals-row .deals-pnl.is-flat {
  color: var(--muted);
}

.deals-row.deals-head {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
  background: rgba(6, 10, 25, 0.85);
}

.deals-row.deals-empty {
  grid-template-columns: 1fr;
  justify-items: center;
  align-items: center;
  text-align: center;
  color: var(--muted);
  padding: 16px 0;
}


.close-pos-btn {
  background: rgba(255, 90, 120, 0.18);
  border: 1px solid rgba(255, 110, 140, 0.5);
  color: #ff93a8;
  font-size: 14px;
  font-weight: 600;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: 6px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.1s ease;
}

.close-pos-btn:hover {
  background: rgba(255, 90, 120, 0.32);
  border-color: rgba(255, 140, 170, 0.75);
}

.close-pos-btn:active {
  transform: translateY(1px);
}

.close-pos-btn:disabled {
  opacity: 0.6;
  cursor: default;
}

.table-row.positive {
  color: #7af0b6;
}

.table-row.negative {
  color: #ff7b94;
}

.table-row.error {
  color: #ffb454;
}

@media (max-width: 900px) {
  .grid {
    grid-template-columns: 1fr;
  }
  .table-row {
    grid-template-columns: 1fr;
  }
  .table-row div {
    display: flex;
    justify-content: space-between;
  }
  .table-row div::before {
    content: attr(data-label);
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 10px;
  }
  .quote-row {
    grid-template-columns: 1fr;
  }
  .quote-controls {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .layout {
    padding: 32px 18px 48px;
  }
  .ring-wrap {
    width: 160px;
    height: 160px;
  }
  .ring {
    width: 160px;
    height: 160px;
  }
  .ring-value {
    font-size: 28px;
  }
}

/* alternate mode dropdowns — must be last to override blanket transparent rule */
body.theme-alt-disabled #notif-dropdown,
body.theme-alt-disabled #notif-dropdown *,
body.theme-alt-disabled #user-dropdown,
body.theme-alt-disabled #user-dropdown * {
  background: #ffffff !important;
}

body.theme-alt-disabled .notif-item {
  border-color: rgba(12, 18, 35, 0.16) !important;
}

body.theme-alt-disabled .notif-item.is-unread {
  background: rgba(77, 213, 255, 0.12) !important;
  border-color: rgba(77, 213, 255, 0.45) !important;
}

body.theme-alt-disabled .notif-btn.has-new {
  color: #1b84f8;
  border-color: rgba(27, 132, 248, 0.5);
  box-shadow: 0 0 0 1px rgba(27, 132, 248, 0.18), 0 3px 10px rgba(27, 132, 248, 0.18);
  background: rgba(27, 132, 248, 0.12);
}

body.theme-alt-disabled #notif-dropdown,
body.theme-alt-disabled #user-dropdown {
  box-shadow: 0 18px 30px rgba(0, 0, 0, 0.12);
}

/* alternate mode shadows — at end of file for maximum source-order priority */
body.theme-alt-disabled .card {
  background: #ffffff !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.14) !important;
  backdrop-filter: none !important;
}

body.theme-alt-disabled .quotes-leg,
body.theme-alt-disabled .quotes-ring-metrics,
body.theme-alt-disabled .quotes-leg-grid,
body.theme-alt-disabled .ring-tile,
body.theme-alt-disabled .ring-indicators-panel,
body.theme-alt-disabled .ring-summary-panel,
body.theme-alt-disabled .report-metric,
body.theme-alt-disabled .connection-status,
body.theme-alt-disabled .connection-block,
body.theme-alt-disabled .quote-ring-settings,
body.theme-alt-disabled .scanner-row,
body.theme-alt-disabled .deals-row,
body.theme-alt-disabled .deals-details,
body.theme-alt-disabled .report-row,
body.theme-alt-disabled .config-section,
body.theme-alt-disabled .api-exchange-static,
body.theme-alt-disabled .settings-block,
body.theme-alt-disabled .settings-row,
body.theme-alt-disabled .ring-config,
body.theme-alt-disabled .quote-ring,
body.theme-alt-disabled .quotes-table,
body.theme-alt-disabled .connection-log-list {
  background: #ffffff !important;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.07) !important;
  border-radius: 12px;
}

body.theme-alt-disabled .quotes-ring-legs > .quotes-leg,
body.theme-alt-disabled .quotes-ring-legs > .quotes-ring-metrics {
  background: var(--bg-2) !important;
}

body.theme-alt-disabled .quotes-ring-legs > .quotes-leg {
  background: linear-gradient(180deg, rgba(248, 252, 255, 0.98), rgba(235, 243, 252, 0.96)) !important;
  border-color: rgba(130, 154, 182, 0.34) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 3px 10px rgba(52, 84, 118, 0.1) !important;
}

body.theme-alt-disabled .quotes-ring-legs > .quotes-ring-metrics {
  background: linear-gradient(180deg, rgba(242, 250, 255, 0.98), rgba(224, 238, 252, 0.96)) !important;
  border-color: rgba(116, 146, 180, 0.38) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 3px 10px rgba(45, 76, 110, 0.12) !important;
}

/* High-priority theme-alt-disabled quote tile gradients (dashboard scope). */
body.theme-alt-disabled #dashboard-panel .quotes-ring-legs .quotes-leg,
body.theme-alt-disabled #dashboard-panel .quotes-leg-grid .quotes-leg {
  background: linear-gradient(180deg, rgba(249, 253, 255, 0.99), rgba(230, 240, 251, 0.97)) !important;
  border-color: rgba(120, 146, 177, 0.38) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 4px 12px rgba(50, 84, 120, 0.12) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-ring-metrics {
  background: linear-gradient(180deg, rgba(249, 253, 255, 0.99), rgba(230, 240, 251, 0.97)) !important;
  border-color: rgba(120, 146, 177, 0.38) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 4px 12px rgba(50, 84, 120, 0.12) !important;
}

/* Make theme-alt-disabled toggle ON state visibly blue. */
body.theme-alt-disabled .toggle .light-on {
  background: #64c6ff !important;
  opacity: 0.45;
}

body.theme-alt-disabled .toggle .toggle-checkbox:checked + .toggle-container {
  background: linear-gradient(180deg, #8bd8ff, #64c6ff) !important;
  box-shadow: inset 0 0.0625em 0.125em rgba(255, 255, 255, 0.32), inset 0 -0.0625em 0.125em rgba(34, 94, 142, 0.22) !important;
}

body.theme-alt-disabled .toggle .toggle-checkbox:checked ~ .lights .light-on {
  opacity: 0.95 !important;
  box-shadow: 0 0 8px rgba(100, 198, 255, 0.6);
}

body.theme-alt-disabled .switch input:checked + .switch-slider::before {
  background: linear-gradient(90deg, #64c6ff 50%, #7f92a8 50%) !important;
}

body.theme-alt-disabled .switch input:checked + .switch-slider::after {
  background: linear-gradient(180deg, #ffffff, #d9e1eb) !important;
}

body.theme-alt-disabled .switch input:not(:checked) + .switch-slider::after {
  background: linear-gradient(180deg, #f5f7fb, #dfe5ee) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-ring {
  background: transparent !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
}

/* Final dark-mode background override (test mode only) */
body.test-mode:not(.theme-alt-disabled),
body.test-mode:not(.theme-alt-disabled) .app-shell {
  background:
    radial-gradient(1200px 700px at -8% -18%, rgba(132, 99, 255, 0.24), transparent 60%),
    radial-gradient(980px 620px at 108% -10%, rgba(73, 206, 255, 0.18), transparent 62%),
    radial-gradient(760px 520px at 48% 108%, rgba(255, 130, 186, 0.1), transparent 66%),
    linear-gradient(180deg, #090d1d 0%, #0b1227 52%, #090f1f 100%) !important;
}

body.test-mode:not(.theme-alt-disabled) .main,
body.test-mode:not(.theme-alt-disabled) .content,
body.test-mode:not(.theme-alt-disabled) .topbar {
  background: transparent !important;
}

/* In dark mode, let sidebar use the same canvas/gradient as main UI. */
body.test-mode:not(.theme-alt-disabled) .sidebar {
  background: transparent !important;
}

/* Only apply this soft gradient in light+test combo mode. */
body.theme-alt-disabled.test-mode,
body.theme-alt-disabled.test-mode .app-shell {
  background:
    radial-gradient(1100px 640px at -8% -16%, rgba(130, 136, 152, 0.16), transparent 62%),
    radial-gradient(900px 560px at 108% -10%, rgba(164, 170, 182, 0.12), transparent 62%),
    linear-gradient(180deg, #c6cad2 0%, #b5bac4 56%, #a3aab5 100%) !important;
}

/* Exclude nav areas from gray canvas by giving them card-like background */
body.theme-alt-disabled.test-mode .sidebar,
body.theme-alt-disabled.test-mode .topbar {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
  backdrop-filter: blur(12px) !important;
}

body.theme-alt-disabled.test-mode .sidebar::before,
body.theme-alt-disabled.test-mode .topbar::before {
  content: '';
  position: absolute;
  left: 8px;
  right: 8px;
  top: 0;
  height: 38%;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0));
}

/* Top bar should blend with the main UI background */
body.theme-alt-disabled.test-mode .topbar {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  overflow: visible !important;
  position: relative;
  z-index: 2000;
}

body.theme-alt-disabled.test-mode .topbar::before {
  content: none !important;
}

/* Keep non-home tab cards on the same light card surface (not gray canvas) */
body.theme-alt-disabled.test-mode #settings-panel .card,
body.theme-alt-disabled.test-mode #accounts-panel .card,
body.theme-alt-disabled.test-mode #scanner-panel .card,
body.theme-alt-disabled.test-mode #reports-panel .card,
body.theme-alt-disabled.test-mode #support-panel .card {
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
}

/* Keep non-home tab cards visible in standard alternate mode (non-test). */
body.theme-alt-disabled:not(.test-mode) #settings-panel .card,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .card,
body.theme-alt-disabled:not(.test-mode) #scanner-panel .card,
body.theme-alt-disabled:not(.test-mode) #reports-panel .card,
body.theme-alt-disabled:not(.test-mode) #support-panel .card {
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.94), rgba(245, 250, 255, 0.9)) !important;
  border-color: rgba(255, 255, 255, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 6px 14px rgba(8, 12, 22, 0.1) !important;
}

/* Global card/tile corner tightening across pages */
.card,
.settings-row,
.quote-ring,
.quote-ring-settings,
.quotes-table,
.quotes-leg,
.quotes-ring-metrics,
.ring-tile,
.ring-indicators-panel,
.ring-summary-panel,
.connection-status,
.accounts-table,
.scanner-row,
.deals-row,
.deals-details,
.report-row,
.report-card,
.report-metric,
.manual-sidebar,
.manual-content,
.community-sidebar,
.community-chat,
.support-form,
.feed-pane,
.connection-block {
  border-radius: 12px !important;
}

body.theme-alt-disabled .status-ok,
body.theme-alt-disabled .status-pill.is-ok {
  color: #1f9d55 !important;
  border-color: rgba(31, 157, 85, 0.65) !important;
}

body.theme-alt-disabled .status-pill.status-ok {
  background: rgba(31, 157, 85, 0.16) !important;
}

body.theme-alt-disabled .status-pill.status-warn {
  background: rgba(240, 195, 108, 0.18) !important;
  color: #9a6c12 !important;
  border-color: rgba(180, 127, 22, 0.5) !important;
}

body.theme-alt-disabled .status-pill.status-error {
  background: rgba(255, 109, 109, 0.16) !important;
  color: #b43838 !important;
  border-color: rgba(190, 76, 76, 0.55) !important;
}

/* Ensure top connection pills remain visible in alternate mode */
body.theme-alt-disabled .status-card .status-pill {
  background: rgba(231, 237, 247, 0.95) !important;
  border-color: rgba(101, 121, 154, 0.45) !important;
  color: #2f3e55 !important;
}

body.theme-alt-disabled .status-card .status-pill.is-ok {
  background: rgba(31, 157, 85, 0.14) !important;
}

body.theme-alt-disabled .status-card .status-pill.is-warn {
  background: rgba(240, 195, 108, 0.18) !important;
  color: #9a6c12 !important;
  border-color: rgba(180, 127, 22, 0.5) !important;
}

body.theme-alt-disabled .status-card .status-pill.is-bad,
body.theme-alt-disabled .status-card .status-pill.status-error {
  background: rgba(255, 109, 109, 0.16) !important;
  color: #b43838 !important;
  border-color: rgba(190, 76, 76, 0.55) !important;
}

body.theme-alt-disabled .status-pill.status-ok {
  background: rgba(31, 157, 85, 0.16) !important;
  border-color: rgba(31, 157, 85, 0.65) !important;
  color: #1f9d55 !important;
}

body.theme-alt-disabled .status-pill.status-warn {
  background: rgba(240, 195, 108, 0.18) !important;
  border-color: rgba(180, 127, 22, 0.5) !important;
  color: #9a6c12 !important;
}

body.theme-alt-disabled .status-pill.status-error,
body.theme-alt-disabled .status-pill.status-bad {
  background: rgba(255, 109, 109, 0.16) !important;
  border-color: rgba(190, 76, 76, 0.55) !important;
  color: #b43838 !important;
}

/* Final override: keep top status card on card-like surface (not gray canvas) */
body.theme-alt-disabled .topbar .status-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 248, 255, 0.94)) !important;
  border: 1px solid rgba(255, 255, 255, 0.9) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 6px 14px rgba(8, 12, 22, 0.14) !important;
}

body.theme-alt-disabled .topbar .status-card::before {
  content: '';
  position: absolute;
  left: 6px;
  right: 6px;
  top: 0;
  height: 45%;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.68), rgba(255, 255, 255, 0));
}

body.theme-alt-disabled #top-status-feed {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

body.theme-alt-disabled #top-status-feed::before {
  content: none !important;
}

/* Explicit topbar connection pills (ids) to beat any generic overrides */
body.theme-alt-disabled #status-trading,
body.theme-alt-disabled #status-market {
  background: rgba(231, 237, 247, 0.95) !important;
  border: 1px solid rgba(101, 121, 154, 0.45) !important;
  color: #2f3e55 !important;
}

body.theme-alt-disabled #status-trading.is-ok,
body.theme-alt-disabled #status-market.is-ok {
  background: rgba(31, 157, 85, 0.14) !important;
  border-color: rgba(31, 157, 85, 0.65) !important;
  color: #1f9d55 !important;
}

body.theme-alt-disabled #status-trading.is-warn,
body.theme-alt-disabled #status-market.is-warn {
  background: rgba(240, 195, 108, 0.18) !important;
  border-color: rgba(180, 127, 22, 0.5) !important;
  color: #9a6c12 !important;
}

body.theme-alt-disabled #status-trading.is-bad,
body.theme-alt-disabled #status-market.is-bad {
  background: rgba(255, 109, 109, 0.16) !important;
  border-color: rgba(190, 76, 76, 0.55) !important;
  color: #b43838 !important;
}

body.theme-alt-disabled #status-trading.status-error,
body.theme-alt-disabled #status-market.status-error {
  background: rgba(255, 109, 109, 0.16) !important;
  border-color: rgba(190, 76, 76, 0.55) !important;
  color: #b43838 !important;
}

body.theme-alt-disabled .chart-toolbar,
body.theme-alt-disabled .chart-toolbar.chart-toolbar {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  border-radius: 0 !important;
}

/* Final override: force connect/disconnect button colors in alternate mode */

@media (max-width: 1024px) {
  .app-shell,
  .app-shell.is-collapsed {
    grid-template-columns: 1fr;
  }

  .sidebar,
  .app-shell.is-collapsed .sidebar {
    padding: 10px 12px;
    gap: 10px;
    border-right: none;
    border-bottom: 1px solid var(--border);
    align-items: stretch;
  }

  .sidebar-brand,
  .app-shell.is-collapsed .sidebar-brand,
  .sidebar-toggle,
  .app-shell.is-collapsed .sidebar-toggle {
    display: none;
  }

  .sidebar-nav,
  .app-shell.is-collapsed .sidebar-nav {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    width: 100%;
    padding-bottom: 2px;
  }

  .tab-btn,
  .app-shell.is-collapsed .tab-btn {
    width: auto;
    min-width: max-content;
    justify-content: flex-start;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    border-bottom: 1px solid var(--border);
  }

  .tab-label,
  .app-shell.is-collapsed .tab-label {
    display: inline;
  }

  .sidebar-footer,
  .app-shell.is-collapsed .sidebar-footer {
    display: none;
  }

  .topbar {
    padding: 14px 16px;
  }

  .content {
    padding: 16px;
  }

  .grid {
    grid-template-columns: 1fr;
  }

  .span-2,
  .span-3,
  .span-4,
  .ring-card,
  .ring-card-dual,
  .quotes-card {
    grid-column: 1 / -1;
  }

  .reports-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-export-grid {
    grid-template-columns: 1fr;
  }

  .manual-layout {
    grid-template-columns: 1fr;
  }

  .manual-toc {
    position: static;
    height: auto;
  }

  .manual-content {
    max-height: min(72vh, 680px);
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 6px;
  }

  .community-layout {
    grid-template-columns: 1fr;
    height: auto;
    min-height: 540px;
  }

  .community-sidebar {
    width: 100%;
    height: auto;
  }

  .community-channels {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }
}

@media (max-width: 768px) {
  .topbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .topbar-actions {
    width: 100%;
    margin-left: 0;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
  }

  .status-card {
    width: 100%;
  }

  .card {
    padding: 14px 12px;
    border-radius: 14px;
  }

  .card-header {
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
  }

  .connections-card > .card-header,
  .inline-api-config-card > .card-header {
    display: flex;
    grid-template-columns: none;
  }

  .connections-card > .card-header .primary-btn {
    justify-self: auto;
    margin-left: auto;
  }

  .chart-toolbar {
    flex-wrap: wrap;
    gap: 8px;
  }

  .chart-view-toggle {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .deals-table,
  .report-table,
  .report-deals-details,
  .settings-quotes-card .quotes-table {
    overflow-x: auto;
  }

  .deals-row,
  .deals-row.deals-head,
  .deals-detail-head,
  .deals-detail-row,
  .report-row,
  .report-deal-table {
    min-width: 980px;
  }

  .settings-row {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .settings-row .settings-label {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .topbar {
    padding: 10px;
  }

  .content {
    padding: 12px 10px 20px;
  }

  .tab-btn {
    font-size: 12px;
    padding: 7px 9px;
  }

  .status-row span:first-child {
    min-width: 64px;
  }

  .reports-summary {
    grid-template-columns: 1fr;
  }

  .ring-wrap {
    width: 148px;
    height: 148px;
  }

  .ring {
    width: 148px;
    height: 148px;
  }

  .ring-value {
    font-size: 24px;
  }
}

/* Global: reduce glow intensity on tabs/buttons in alternate mode only */
body.theme-alt-disabled .primary-btn,
body.theme-alt-disabled .secondary-btn,
body.theme-alt-disabled .toggle-btn,
body.theme-alt-disabled .tab-btn,
body.theme-alt-disabled .report-subtab,
body.theme-alt-disabled .report-tab,
body.theme-alt-disabled .positions-tab,
body.theme-alt-disabled .chart-btn,
body.theme-alt-disabled .timeframe-btn {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 1px 4px rgba(20, 28, 44, 0.14) !important;
}

body.theme-alt-disabled .primary-btn:hover,
body.theme-alt-disabled .secondary-btn:hover,
body.theme-alt-disabled .toggle-btn:hover,
body.theme-alt-disabled .tab-btn:hover,
body.theme-alt-disabled .report-subtab:hover,
body.theme-alt-disabled .report-tab:hover,
body.theme-alt-disabled .positions-tab:hover,
body.theme-alt-disabled .chart-btn:hover,
body.theme-alt-disabled .timeframe-btn:hover,
body.theme-alt-disabled .primary-btn.is-active,
body.theme-alt-disabled .secondary-btn.is-active,
body.theme-alt-disabled .toggle-btn.is-active,
body.theme-alt-disabled .tab-btn.is-active,
body.theme-alt-disabled .report-subtab.is-active,
body.theme-alt-disabled .report-tab.is-active,
body.theme-alt-disabled .positions-tab.is-active,
body.theme-alt-disabled .chart-btn.is-active,
body.theme-alt-disabled .timeframe-btn.is-active {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 6px rgba(20, 28, 44, 0.18) !important;
}

body.theme-alt-disabled button:hover,
body.theme-alt-disabled .primary-btn:hover,
body.theme-alt-disabled .secondary-btn:hover,
body.theme-alt-disabled .toggle-btn:hover,
body.theme-alt-disabled .tab-btn:hover,
body.theme-alt-disabled .report-subtab:hover,
body.theme-alt-disabled .report-tab:hover,
body.theme-alt-disabled .positions-tab:hover,
body.theme-alt-disabled .chart-btn:hover,
body.theme-alt-disabled .timeframe-btn:hover {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
}

/* Keep theme-alt-disabled hover blue even when component-specific rules exist. */
body.theme-alt-disabled #settings-panel button:hover,
body.theme-alt-disabled #scanner-panel button:hover,
body.theme-alt-disabled #reports-panel button:hover,
body.theme-alt-disabled #accounts-panel button:hover,
body.theme-alt-disabled #support-panel button:hover {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
}

/* Topbar feed indicators must stay icon-only (no pill border/background) */
#top-status-feed #status-trading.status-pill,
#top-status-feed #status-market.status-pill,
body.theme-alt-disabled #top-status-feed #status-trading.status-pill,
body.theme-alt-disabled #top-status-feed #status-market.status-pill {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

@keyframes feed-heartbeat {
  0%, 100% { transform: scale(1); }
  12% { transform: scale(1.14); }
  24% { transform: scale(1.02); }
  36% { transform: scale(1.1); }
  48% { transform: scale(1.02); }
}

#top-status-feed #status-trading.status-pill,
#top-status-feed #status-market.status-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 7px !important;
  min-height: 7px !important;
  max-height: 7px !important;
  line-height: 7px !important;
  font-size: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  position: relative !important;
  top: 0.5px !important;
  left: 0 !important;
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: center center;
  will-change: transform;
  animation: none;
}

#top-status-feed #status-trading.status-pill.is-heartbeat,
#top-status-feed #status-market.status-pill.is-heartbeat {
  animation: feed-heartbeat 0.9s ease-in-out 1;
}

#top-status-feed #status-trading.status-pill.status-ok,
#top-status-feed #status-market.status-pill.status-ok {
  filter: none !important;
}

#top-status-feed #status-trading.status-pill.status-warn,
#top-status-feed #status-market.status-pill.status-warn {
  filter: none !important;
}

#top-status-feed #status-trading.status-pill.status-error,
#top-status-feed #status-market.status-pill.status-error {
  filter: none !important;
}

@media (prefers-reduced-motion: reduce) {
  #top-status-feed #status-trading.status-pill,
  #top-status-feed #status-market.status-pill {
    animation: none !important;
  }
}

/* Test mode: slate-gray trading UI inspired by provided screenshot */
body.test-mode {
  --bg: #151b27;
  --bg-2: #1b2331;
  --text: #d2d9e6;
  --muted: #8f99ab;
  --accent: #7b879a;
  --accent-2: #6f8ba8;
  --accent-3: #7f6e95;
  --card: rgba(28, 37, 52, 0.94);
  --border: rgba(156, 171, 196, 0.16);
}

body:not(.theme-alt-disabled).test-mode,
body:not(.theme-alt-disabled).test-mode .app-shell {
  background:
    radial-gradient(1200px 700px at -8% -18%, rgba(88, 106, 135, 0.18), transparent 60%),
    radial-gradient(980px 620px at 108% -10%, rgba(84, 96, 122, 0.16), transparent 62%),
    linear-gradient(180deg, #121824 0%, #161e2c 52%, #141b28 100%) !important;
}

body.theme-alt-disabled.test-mode,
body.theme-alt-disabled.test-mode .app-shell {
  background:
    radial-gradient(1100px 640px at -8% -16%, rgba(154, 162, 178, 0.18), transparent 62%),
    radial-gradient(900px 560px at 108% -10%, rgba(144, 152, 168, 0.14), transparent 62%),
    linear-gradient(180deg, #c3c9d4 0%, #b4bcc9 56%, #a5aebd 100%) !important;
}

body.test-mode .main,
body.test-mode .content,
body.test-mode .topbar,
body.test-mode .sidebar {
  background: transparent !important;
}

body.test-mode .bg-orb,
body.test-mode .orb-a,
body.test-mode .orb-b,
body.test-mode .orb-c {
  filter: grayscale(1) saturate(0.75) brightness(0.72) !important;
  opacity: 0.46 !important;
}

body.test-mode .card,
body.test-mode .chart-card,
body.test-mode .chart-wrap,
body.test-mode .ring-tile,
body.test-mode .ring-indicators-panel,
body.test-mode .ring-summary-panel,
body.test-mode .quotes-leg,
body.test-mode .quotes-ring-metrics,
body.test-mode .report-metric,
body.test-mode .connection-status,
body.test-mode .connection-block,
body.test-mode .quote-ring-settings,
body.test-mode .scanner-row,
body.test-mode .deals-row,
body.test-mode #dashboard-panel .table-row,
body.test-mode .deals-details,
body.test-mode .report-row,
body.test-mode .config-section,
body.test-mode .api-exchange-static,
body.test-mode .settings-block,
body.test-mode .settings-row,
body.test-mode .ring-config,
body.test-mode .quote-ring,
body.test-mode .quotes-table,
body.test-mode .connection-log-list {
  background: rgba(31, 41, 58, 0.92) !important;
  border-color: rgba(146, 162, 186, 0.16) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 10px 24px rgba(7, 10, 18, 0.35) !important;
}

body.test-mode .tab-btn,
body.test-mode .toggle-btn,
body.test-mode .chart-btn,
body.test-mode .timeframe-btn,
body.test-mode .positions-tab,
body.test-mode :not(#reports-panel) > .report-subtabs > .report-tab,
body.test-mode :not(#reports-panel) > .report-subtabs > .report-subtab,
body.test-mode .primary-btn,
body.test-mode .secondary-btn {
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  border-color: rgba(146, 162, 186, 0.22) !important;
  color: #c7d1e0 !important;
}

body.test-mode .tab-btn.is-active,
body.test-mode .toggle-btn.is-active,
body.test-mode .chart-btn.is-active,
body.test-mode .timeframe-btn.is-active,
body.test-mode .positions-tab.is-active,
body.test-mode :not(#reports-panel) > .report-subtabs > .report-tab.is-active,
body.test-mode :not(#reports-panel) > .report-subtabs > .report-subtab.is-active {
  background: linear-gradient(180deg, rgba(89, 104, 126, 0.9), rgba(73, 87, 108, 0.92)) !important;
  border-color: rgba(173, 188, 214, 0.34) !important;
  color: #e2e8f3 !important;
}

body.theme-alt-disabled.test-mode .card,
body.theme-alt-disabled.test-mode .chart-card,
body.theme-alt-disabled.test-mode .chart-wrap,
body.theme-alt-disabled.test-mode .ring-tile,
body.theme-alt-disabled.test-mode .ring-indicators-panel,
body.theme-alt-disabled.test-mode .ring-summary-panel,
body.theme-alt-disabled.test-mode .quotes-leg,
body.theme-alt-disabled.test-mode .quotes-ring-metrics,
body.theme-alt-disabled.test-mode .report-metric,
body.theme-alt-disabled.test-mode .connection-status,
body.theme-alt-disabled.test-mode .connection-block,
body.theme-alt-disabled.test-mode .quote-ring-settings,
body.theme-alt-disabled.test-mode .scanner-row,
body.theme-alt-disabled.test-mode .deals-row,
body.theme-alt-disabled.test-mode .deals-details,
body.theme-alt-disabled.test-mode .report-row,
body.theme-alt-disabled.test-mode .config-section,
body.theme-alt-disabled.test-mode .api-exchange-static,
body.theme-alt-disabled.test-mode .settings-block,
body.theme-alt-disabled.test-mode .settings-row,
body.theme-alt-disabled.test-mode .ring-config,
body.theme-alt-disabled.test-mode .quote-ring,
body.theme-alt-disabled.test-mode .quotes-table,
body.theme-alt-disabled.test-mode .connection-log-list {
  background: rgba(238, 241, 246, 0.93) !important;
  border-color: rgba(126, 136, 152, 0.25) !important;
  box-shadow: 0 8px 16px rgba(74, 83, 96, 0.16) !important;
}

/* Test mode refinement: denser layout + subtler separators (screenshot match) */
body.test-mode .card,
body.test-mode .ring-tile,
body.test-mode .ring-indicators-panel,
body.test-mode .ring-summary-panel,
body.test-mode .quotes-leg,
body.test-mode .quotes-ring-metrics,
body.test-mode .deals-row,
body.test-mode .report-row,
body.test-mode .scanner-row,
body.test-mode .settings-row,
body.test-mode .quote-ring,
body.test-mode .quote-ring-settings,
body.test-mode .connection-status,
body.test-mode .connection-block,
body.test-mode .chart-wrap,
body.test-mode .table {
  border-radius: 7px !important;
}

body.test-mode .card {
  padding: 16px 16px !important;
}

body.test-mode .card-header {
  margin-bottom: 10px !important;
}

body.test-mode .card-header h2,
body.test-mode .table-head,
body.test-mode .deals-head,
body.test-mode .report-head {
  color: #aab6c9 !important;
  letter-spacing: 0.01em;
  font-weight: 600 !important;
}

body.test-mode .deals-row div,
body.test-mode .report-row div,
body.test-mode .table-row div,
body.test-mode .quotes-leg,
body.test-mode .quotes-ring-metrics {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  line-height: 1.22 !important;
}

body.test-mode .table-head div,
body.test-mode .deals-head div,
body.test-mode .report-head div,
body.test-mode .quotes-leg-header {
  color: #8b97ab !important;
  font-size: 11px !important;
  text-transform: uppercase;
}

body.test-mode .table-row,
body.test-mode .deals-row,
body.test-mode .report-row,
body.test-mode .quotes-leg-grid,
body.test-mode .quotes-ring-legs {
  border-color: rgba(143, 157, 181, 0.14) !important;
}

body.test-mode .status-pill,
body.test-mode .pill,
body.test-mode .pill.mono {
  background: rgba(53, 65, 86, 0.9) !important;
  border: 1px solid rgba(142, 157, 182, 0.22) !important;
  color: #c1cddd !important;
}

body.test-mode .status-pill.is-ok,
body.test-mode .status-pill.status-ok {
  color: #9db0c7 !important;
}

body.test-mode .status-pill.is-warn,
body.test-mode .status-pill.status-warn {
  color: #b8b4a2 !important;
}

body.test-mode .status-pill.is-bad,
body.test-mode .status-pill.status-error,
body.test-mode .status-pill.status-bad {
  color: #b59aa5 !important;
}

body.test-mode .chart-toolbar,
body.test-mode .chart-toolbar.chart-toolbar {
  background: transparent !important;
  border-color: rgba(143, 157, 181, 0.16) !important;
  border-radius: 7px !important;
}

body.test-mode .ring-unit,
body.test-mode .ring-label,
body.test-mode .ring-indicator .label,
body.test-mode .muted,
body.test-mode .quotes-label,
body.test-mode .table-head,
body.test-mode .deals-head,
body.test-mode .report-head {
  color: #8f99ab !important;
}

body.test-mode .ring-value,
body.test-mode .ring-indicator .value,
body.test-mode .quotes-value,
body.test-mode .table-row,
body.test-mode .deals-row,
body.test-mode .report-row {
  color: #d2d9e6 !important;
}

body.test-mode .sidebar,
body.test-mode .topbar {
  border-color: rgba(143, 157, 181, 0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02) !important;
}

/* Apply the same tile padding/stretch density to Midnight + alternate modes */
body:not(.theme-alt-disabled):not(.test-mode) .card,
body:not(.theme-alt-disabled):not(.test-mode) .ring-tile,
body:not(.theme-alt-disabled):not(.test-mode) .ring-indicators-panel,
body:not(.theme-alt-disabled):not(.test-mode) .ring-summary-panel,
body:not(.theme-alt-disabled):not(.test-mode) .quotes-leg,
body:not(.theme-alt-disabled):not(.test-mode) .quotes-ring-metrics,
body:not(.theme-alt-disabled):not(.test-mode) .deals-row,
body:not(.theme-alt-disabled):not(.test-mode) .report-row,
body:not(.theme-alt-disabled):not(.test-mode) .scanner-row,
body:not(.theme-alt-disabled):not(.test-mode) .settings-row,
body:not(.theme-alt-disabled):not(.test-mode) .quote-ring,
body:not(.theme-alt-disabled):not(.test-mode) .quote-ring-settings,
body:not(.theme-alt-disabled):not(.test-mode) .connection-status,
body:not(.theme-alt-disabled):not(.test-mode) .connection-block,
body:not(.theme-alt-disabled):not(.test-mode) .chart-wrap,
body:not(.theme-alt-disabled):not(.test-mode) .table,
body.theme-alt-disabled .card,
body.theme-alt-disabled .ring-tile,
body.theme-alt-disabled .ring-indicators-panel,
body.theme-alt-disabled .ring-summary-panel,
body.theme-alt-disabled .quotes-leg,
body.theme-alt-disabled .quotes-ring-metrics,
body.theme-alt-disabled .deals-row,
body.theme-alt-disabled .report-row,
body.theme-alt-disabled .scanner-row,
body.theme-alt-disabled .settings-row,
body.theme-alt-disabled .quote-ring,
body.theme-alt-disabled .quote-ring-settings,
body.theme-alt-disabled .connection-status,
body.theme-alt-disabled .connection-block,
body.theme-alt-disabled .chart-wrap,
body.theme-alt-disabled .table {
  border-radius: 7px !important;
}

body:not(.theme-alt-disabled):not(.test-mode) .card,
body.theme-alt-disabled .card {
  padding: 16px 16px !important;
}

body:not(.theme-alt-disabled):not(.test-mode) .card-header,
body.theme-alt-disabled .card-header {
  margin-bottom: 10px !important;
}

body:not(.theme-alt-disabled):not(.test-mode) .deals-row div,
body:not(.theme-alt-disabled):not(.test-mode) .report-row div,
body:not(.theme-alt-disabled):not(.test-mode) .table-row div,
body:not(.theme-alt-disabled):not(.test-mode) .quotes-leg,
body:not(.theme-alt-disabled):not(.test-mode) .quotes-ring-metrics,
body.theme-alt-disabled .deals-row div,
body.theme-alt-disabled .report-row div,
body.theme-alt-disabled .table-row div,
body.theme-alt-disabled .quotes-leg,
body.theme-alt-disabled .quotes-ring-metrics {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  line-height: 1.22 !important;
}

/* Scanner dropdowns + Support form fields: match active environment surfaces */
body.test-mode #scanner-lookback.scanner-lookback-select,
body.test-mode #scanner-panel .feed-select,
body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #scanner-panel .feed-select option,
body.test-mode #support-category option {
  background: #1a2434;
  color: var(--text);
}

body.test-mode #support-panel-contact .report-export-field input::placeholder,
body.test-mode #support-panel-contact .report-export-field textarea::placeholder {
  color: rgba(171, 184, 204, 0.82);
}

body.theme-alt-disabled #scanner-lookback.scanner-lookback-select,
body.theme-alt-disabled #scanner-panel .feed-select,
body.theme-alt-disabled #support-panel-contact .report-export-field input,
body.theme-alt-disabled #support-panel-contact .report-export-field select,
body.theme-alt-disabled #support-panel-contact .report-export-field textarea {
  background: rgba(246, 250, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #scanner-panel .feed-select option,
body.theme-alt-disabled #support-category option {
  background: #f2f5fa;
  color: #2f3a4d;
}

body.theme-alt-disabled #support-panel-contact .report-export-field input::placeholder,
body.theme-alt-disabled #support-panel-contact .report-export-field textarea::placeholder {
  color: rgba(78, 92, 118, 0.75);
}

body.test-mode #scanner-lookback.scanner-lookback-select,
body.test-mode #scanner-panel .feed-select,
body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(35, 45, 63, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.03), inset 0 -1px 0 rgba(0, 0, 0, 0.2) !important;
}

body.test-mode #scanner-panel .feed-select option,
body.test-mode #support-category option {
  background: #212d3f;
  color: #d2d9e6;
}

body.test-mode #support-panel-contact .report-export-field input::placeholder,
body.test-mode #support-panel-contact .report-export-field textarea::placeholder {
  color: rgba(145, 159, 183, 0.84);
}

body.theme-alt-disabled.test-mode #scanner-lookback.scanner-lookback-select,
body.theme-alt-disabled.test-mode #scanner-panel .feed-select,
body.theme-alt-disabled.test-mode #support-panel-contact .report-export-field input,
body.theme-alt-disabled.test-mode #support-panel-contact .report-export-field select,
body.theme-alt-disabled.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(237, 241, 247, 0.96) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

body.theme-alt-disabled.test-mode #scanner-panel .feed-select option,
body.theme-alt-disabled.test-mode #support-category option {
  background: #e6ebf2;
  color: #3c475c;
}

/* Ring setup + scanner control fields: keep surfaces aligned with environment */
body.test-mode #settings-panel .ring-config select,
body.test-mode #settings-panel .ring-config input,
body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #scanner-panel .scanner-threshold-row .input-prefix,
body.test-mode #scanner-panel .scanner-threshold-row .input-prefix input {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #settings-panel .ring-config select option,
body.test-mode #settings-panel .quote-ring-settings select option,
body.test-mode #scanner-panel .scanner-lookback-select option {
  background: #1a2434;
  color: var(--text);
}

body.theme-alt-disabled #settings-panel .ring-config select,
body.theme-alt-disabled #settings-panel .ring-config input,
body.theme-alt-disabled #settings-panel .quote-ring-settings select,
body.theme-alt-disabled #settings-panel .quote-ring-settings input,
body.theme-alt-disabled #settings-panel .quote-ring-settings .quote-input,
body.theme-alt-disabled #settings-panel .quote-select,
body.theme-alt-disabled #settings-panel .quote-config-readonly .quote-config-value,
body.theme-alt-disabled #scanner-panel .scanner-threshold-row .input-prefix,
body.theme-alt-disabled #scanner-panel .scanner-threshold-row .input-prefix input {
  background: rgba(246, 250, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #settings-panel .ring-config select option,
body.theme-alt-disabled #settings-panel .quote-ring-settings select option,
body.theme-alt-disabled #scanner-panel .scanner-lookback-select option {
  background: #f2f5fa;
  color: #2f3a4d;
}

body.test-mode #settings-panel .ring-config select,
body.test-mode #settings-panel .ring-config input,
body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #scanner-panel .scanner-threshold-row .input-prefix,
body.test-mode #scanner-panel .scanner-threshold-row .input-prefix input {
  background: rgba(35, 45, 63, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode #settings-panel .ring-config select option,
body.test-mode #settings-panel .quote-ring-settings select option,
body.test-mode #scanner-panel .scanner-lookback-select option {
  background: #212d3f;
  color: #d2d9e6;
}

body.theme-alt-disabled.test-mode #settings-panel .ring-config select,
body.theme-alt-disabled.test-mode #settings-panel .ring-config input,
body.theme-alt-disabled.test-mode #settings-panel .quote-ring-settings select,
body.theme-alt-disabled.test-mode #settings-panel .quote-ring-settings input,
body.theme-alt-disabled.test-mode #settings-panel .quote-ring-settings .quote-input,
body.theme-alt-disabled.test-mode #settings-panel .quote-select,
body.theme-alt-disabled.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.theme-alt-disabled.test-mode #scanner-panel .scanner-threshold-row .input-prefix,
body.theme-alt-disabled.test-mode #scanner-panel .scanner-threshold-row .input-prefix input {
  background: rgba(237, 241, 247, 0.96) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

body.theme-alt-disabled.test-mode #settings-panel .ring-config select option,
body.theme-alt-disabled.test-mode #settings-panel .quote-ring-settings select option,
body.theme-alt-disabled.test-mode #scanner-panel .scanner-lookback-select option {
  background: #e6ebf2;
  color: #3c475c;
}

/* Scanner details list (collapsed/expanded signal rows): environment-matched surfaces */
body.test-mode #scanner-panel .scanner-details {
  background: rgba(17, 24, 36, 0.82) !important;
  border-top-color: rgba(156, 171, 196, 0.16) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(20, 28, 42, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(14, 21, 33, 0.88) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
}

body.theme-alt-disabled #scanner-panel .scanner-details {
  background: rgba(236, 242, 250, 0.98) !important;
  border-top-color: rgba(120, 128, 146, 0.2) !important;
}

body.theme-alt-disabled #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(242, 247, 253, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.22) !important;
}

body.theme-alt-disabled #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(231, 238, 247, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.26) !important;
}

body.test-mode #scanner-panel .scanner-details {
  background: rgba(29, 38, 53, 0.95) !important;
  border-top-color: rgba(146, 162, 186, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(33, 43, 60, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(26, 35, 50, 0.97) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
}

body.theme-alt-disabled.test-mode #scanner-panel .scanner-details {
  background: rgba(224, 231, 241, 0.98) !important;
  border-top-color: rgba(126, 136, 152, 0.2) !important;
}

body.theme-alt-disabled.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(233, 239, 247, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.24) !important;
}

body.theme-alt-disabled.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(221, 229, 240, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.28) !important;
}

/* Manual surfaces: keep TOC/content/search backgrounds aligned with active theme */
.manual .manual-search-input,
.manual .manual-toc,
.manual .manual-section {
  background: rgba(10, 12, 24, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

.manual .manual-link.is-active {
  background: rgba(20, 28, 60, 0.6) !important;
  border-color: rgba(120, 148, 255, 0.35) !important;
}

body.theme-alt-disabled .manual .manual-search-input,
body.theme-alt-disabled .manual .manual-toc,
body.theme-alt-disabled .manual .manual-section {
  background: rgba(242, 247, 253, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.3) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled .manual .manual-link.is-active {
  background: rgba(231, 238, 247, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
}

body.test-mode .manual .manual-search-input,
body.test-mode .manual .manual-toc,
body.test-mode .manual .manual-section {
  background: rgba(33, 43, 60, 0.95) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode .manual .manual-link.is-active {
  background: rgba(26, 35, 50, 0.97) !important;
  border-color: rgba(146, 162, 186, 0.32) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled.test-mode .manual .manual-search-input,
body.theme-alt-disabled.test-mode .manual .manual-toc,
body.theme-alt-disabled.test-mode .manual .manual-section {
  background: rgba(233, 239, 247, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

body.theme-alt-disabled.test-mode .manual .manual-link.is-active {
  background: rgba(221, 229, 240, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.34) !important;
  color: #3c475c !important;
}

/* Deals table surfaces: darker backgrounds for open/closed views (Dark mode only) */
body.test-mode .deals-table {
  background: rgba(13, 19, 31, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode .deals-row {
  background: rgba(17, 24, 37, 0.9) !important;
}

body.test-mode .deals-row.deals-head {
  background: rgba(11, 16, 27, 0.95) !important;
}

body.test-mode .deals-details {
  background: rgba(11, 17, 29, 0.9) !important;
}

body.test-mode .deals-detail-head {
  background: rgba(9, 14, 24, 0.92) !important;
}

body.test-mode .deals-detail-row {
  background: rgba(15, 22, 34, 0.86) !important;
}

body.theme-alt-disabled .deals-table {
  background: rgba(223, 230, 240, 0.98) !important;
}

body.theme-alt-disabled .deals-row {
  background: rgba(232, 238, 246, 0.98) !important;
}

body.theme-alt-disabled .deals-row.deals-head {
  background: rgba(218, 226, 237, 0.98) !important;
}

body.theme-alt-disabled .deals-details {
  background: rgba(226, 233, 243, 0.98) !important;
}

body.theme-alt-disabled .deals-detail-head {
  background: rgba(212, 221, 233, 0.98) !important;
}

body.theme-alt-disabled .deals-detail-row {
  background: rgba(229, 236, 245, 0.98) !important;
}

body.test-mode .deals-table {
  background: rgba(24, 33, 48, 0.96) !important;
}

body.test-mode .deals-row,
body.test-mode #dashboard-panel .table-row {
  background: rgba(29, 39, 55, 0.96) !important;
}

body.test-mode .deals-row.deals-head {
  background: rgba(22, 31, 45, 0.98) !important;
}

body.test-mode .deals-details {
  background: rgba(23, 32, 47, 0.96) !important;
}

body.test-mode .deals-detail-head {
  background: rgba(19, 28, 42, 0.97) !important;
}

body.test-mode .deals-detail-row {
  background: rgba(27, 37, 53, 0.95) !important;
}

body.theme-alt-disabled.test-mode .deals-table {
  background: rgba(216, 224, 236, 0.98) !important;
}

body.theme-alt-disabled.test-mode .deals-row {
  background: rgba(225, 233, 243, 0.98) !important;
}

body.theme-alt-disabled.test-mode .deals-row.deals-head {
  background: rgba(210, 220, 233, 0.98) !important;
}

body.theme-alt-disabled.test-mode .deals-details {
  background: rgba(220, 228, 240, 0.98) !important;
}

body.theme-alt-disabled.test-mode .deals-detail-head {
  background: rgba(206, 216, 230, 0.98) !important;
}

body.theme-alt-disabled.test-mode .deals-detail-row {
  background: rgba(223, 231, 242, 0.98) !important;
}

/* Accounts table: match deals table surface colors */
.accounts-table {
  background: rgba(13, 19, 31, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

.accounts-table th {
  background: rgba(11, 16, 27, 0.95) !important;
}

.accounts-table tbody tr {
  background: rgba(17, 24, 37, 0.9) !important;
}

body.theme-alt-disabled .accounts-table {
  background: rgba(223, 230, 240, 0.98) !important;
}

body.theme-alt-disabled .accounts-table th {
  background: rgba(218, 226, 237, 0.98) !important;
}

body.theme-alt-disabled .accounts-table tbody tr {
  background: rgba(232, 238, 246, 0.98) !important;
}

body.test-mode .accounts-table {
  background: transparent !important;
  border-color: var(--card) !important;
  box-shadow: none !important;
}

body.test-mode .accounts-table th {
  background: rgba(12, 18, 28, 0.92) !important;
}

body.test-mode .accounts-table tbody tr {
  background: rgba(14, 20, 32, 0.92) !important;
}

body.theme-alt-disabled.test-mode .accounts-table {
  background: rgba(216, 224, 236, 0.98) !important;
}

body.theme-alt-disabled.test-mode .accounts-table th {
  background: rgba(210, 220, 233, 0.98) !important;
}

body.theme-alt-disabled.test-mode .accounts-table tbody tr {
  background: rgba(225, 233, 243, 0.98) !important;
}

/* Accounts tab table final alignment (container + cells) */
body.test-mode #accounts-panel .accounts-list {
  border: none !important;
  border-radius: 12px !important;
  background: transparent !important;
  padding: 0 !important;
}

body.test-mode #accounts-panel .accounts-table {
  border: none !important;
  border-radius: 12px !important;
  border-collapse: separate !important;
  border-spacing: 0 3px !important;
  overflow: visible !important;
  background: transparent !important;
}

body.test-mode #accounts-panel .accounts-table th,
body.test-mode #accounts-panel .accounts-table td {
  border-bottom: none !important;
}

body.test-mode #accounts-panel .accounts-table th {
  color: #8f99ab !important;
  background: rgba(8, 12, 24, 0.7) !important;
}

body.test-mode #accounts-panel .accounts-table td {
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #accounts-panel .accounts-list {
  border-color: rgba(120, 128, 146, 0.28) !important;
  background: rgba(223, 230, 240, 0.98) !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table th,
body.theme-alt-disabled #accounts-panel .accounts-table td {
  border-bottom-color: rgba(120, 128, 146, 0.24) !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table th {
  color: #5b667c !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table td {
  color: #2f3a4d !important;
}

body.test-mode #accounts-panel .accounts-list {
  border-color: transparent !important;
  background: transparent !important;
}

body.test-mode #accounts-panel .accounts-table th,
body.test-mode #accounts-panel .accounts-table td {
  border-bottom: none !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-list {
  border-color: rgba(126, 136, 152, 0.28) !important;
  background: rgba(216, 224, 236, 0.98) !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-table th,
body.theme-alt-disabled.test-mode #accounts-panel .accounts-table td {
  border-bottom-color: rgba(126, 136, 152, 0.22) !important;
}

/* ABSOLUTE LAST Midnight override */
body.test-mode #support-panel-manual .manual .manual-search-input {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.2) !important;
}

body.test-mode #support-panel-community .community-sidebar {
  background: rgba(10, 12, 24, 0.75) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-main {
  background: rgba(10, 12, 24, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(120, 140, 200, 0.12) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.25) !important;
  color: var(--text) !important;
}

body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea,
body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #report-panel-export .report-export-tile {
  background: rgba(10, 12, 30, 0.45) !important;
  border-color: var(--border) !important;
}

body.test-mode #scanner-panel .scanner-details {
  background: rgba(8, 10, 22, 0.6) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(20, 28, 42, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(14, 21, 33, 0.88) !important;
}

body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #settings-quotes-body .quotes-cell,
body.test-mode #settings-quotes-body .quote-config-span,
body.test-mode #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #accounts-panel .report-table.accounts,
body.test-mode #reports-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head,
body.test-mode #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: transparent !important;
}

/* === TRUE EOF Dark-mode gray restore === */
body.test-mode #support-panel-manual .manual .manual-search-input,
body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(26, 36, 52, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode #manual-search.manual-search-input {
  background: rgba(26, 36, 52, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode #manual-search.manual-search-input::placeholder {
  color: rgba(145, 159, 183, 0.84) !important;
}

body.test-mode #support-panel-community .community-sidebar,
body.test-mode #support-panel-community .community-main {
  background: rgba(21, 30, 45, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(146, 162, 186, 0.16) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(26, 36, 52, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode #scanner-panel .scanner-details {
  background: rgba(29, 38, 53, 0.95) !important;
  border-top-color: rgba(146, 162, 186, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(33, 43, 60, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(26, 35, 50, 0.97) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
}

/* Toggle style (adapted from https://codepen.io/josetxu/pen/Poxwpme) */
.switch {
  --sz: 11px;
  --on: #5fb3ee;
  --of: #68838d;
  --tr: all 0.25s ease 0s;
  position: relative;
  width: calc(var(--sz) * 4 - 2px);
  height: calc(var(--sz) * 2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: Roboto, Arial, Helvetica, sans-serif;
  overflow: hidden;
}

body.theme-alt-disabled .switch {
  --on: #64c6ff;
}

.switch input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 1px !important;
  height: 1px !important;
}

.switch::before,
.switch::after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: calc(var(--sz) / 2.2);
  font-weight: 600;
  color: rgba(240, 247, 255, 0.82);
  opacity: 0;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
  pointer-events: none;
  z-index: 6;
  display: none;
}

.switch::before {
  content: 'ON';
  left: calc(var(--sz) * 0.72);
}

.switch::after {
  content: 'OFF';
  right: calc(var(--sz) * 0.85 - 5px);
}

.switch.quote-toggle::after {
  right: calc(var(--sz) * 0.85 - 3px);
}

.switch:has(input:not(:checked))::after {
  opacity: 1;
}

.switch:has(input:checked)::before {
  opacity: 1;
}

.switch .switch-slider {
  position: absolute;
  width: calc(var(--sz) * 4 - 2px);
  height: calc(var(--sz) * 2);
  background: linear-gradient(180deg, #888, #fff) !important;
  border-radius: var(--sz);
  padding: 0;
  border: 0 !important;
  overflow: hidden;
  box-shadow: 0 0 calc(var(--sz) / 50) calc(var(--sz) / 50) #0002 !important;
  transition: var(--tr);
}

.switch .switch-slider::before {
  content: '';
  position: absolute;
  inset: 2px;
  border-radius: var(--sz);
  background: linear-gradient(90deg, var(--on) 50%, var(--of) 50%);
  background-size: 200% 100%;
  background-position: 100% 50%;
  box-shadow: 0 calc(var(--sz) / -10) calc(var(--sz) / 10) 0 #0005 inset, 0 calc(var(--sz) / 10) calc(var(--sz) / 10) 0 #0005 inset;
  transition: var(--tr);
  z-index: 1;
}

.switch .switch-slider::after {
  content: '';
  position: absolute;
  width: calc(50% - 3px);
  height: calc(100% - 4px);
  top: 2px;
  left: 1px;
  border-radius: var(--sz);
  background: linear-gradient(180deg, #fff, #afafaf) !important;
  box-shadow: 0 0 0 calc(var(--sz) / 50) #0002, 0 calc(var(--sz) / 10) calc(var(--sz) / 10) 0 #0008 !important;
  transition: var(--tr);
  z-index: 2;
  transform: none !important;
}

.switch input:checked + .switch-slider {
  box-shadow: 0 calc(var(--sz) / 50) calc(var(--sz) / 5) #fff9, 0 0 calc(var(--sz) / 50) calc(var(--sz) / 50) #0002 !important;
}

.switch input:checked + .switch-slider::before {
  background-position: 0 50%;
}

.switch input:checked + .switch-slider::after {
  left: calc(50% + 2px);
  background: linear-gradient(180deg, #ffffff, #b9c6d8) !important;
  opacity: 1 !important;
  transform: none !important;
}

/* Accounts tab actual table (rendered as report-table.accounts): header row match */
body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(21, 30, 45, 0.94) !important;
}

body.theme-alt-disabled #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(230, 237, 246, 0.98) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(26, 36, 52, 0.96) !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(223, 231, 242, 0.98) !important;
}

/* alternate mode safeguard: keep these surfaces on original midnight palette.
   Dark mode custom palette remains under body.test-mode. */
body.test-mode #support-panel-manual .manual .manual-search-input {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.2) !important;
}

body.test-mode #support-panel-community .community-sidebar {
  background: rgba(10, 12, 24, 0.75) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-main {
  background: rgba(10, 12, 24, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(120, 140, 200, 0.12) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.25) !important;
  color: var(--text) !important;
}

body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(20, 28, 42, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(14, 21, 33, 0.88) !important;
}

body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #settings-quotes-body .quotes-cell,
body.test-mode #settings-quotes-body .quote-config-span,
body.test-mode #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #scanner-panel .scanner-details {
  background: rgba(8, 10, 22, 0.6) !important;
}

body.test-mode #accounts-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #reports-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: transparent !important;
}

body.test-mode #report-panel-export .report-export-tile {
  background: rgba(10, 12, 30, 0.45) !important;
  border-color: var(--border) !important;
}

body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

/* Community + manual search: match new environment palette */
body.test-mode #support-panel-community .community-sidebar,
body.test-mode #support-panel-community .community-main {
  background: rgba(15, 22, 35, 0.92) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(156, 171, 196, 0.16) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(21, 30, 45, 0.94) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: #d2d9e6 !important;
}

body.test-mode #support-panel-manual .manual .manual-search-input {
  background: rgba(21, 30, 45, 0.94) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #support-panel-community .community-sidebar,
body.theme-alt-disabled #support-panel-community .community-main {
  background: rgba(219, 227, 238, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.28) !important;
}

body.theme-alt-disabled #support-panel-community .community-post {
  border-bottom-color: rgba(120, 128, 146, 0.18) !important;
}

body.theme-alt-disabled #support-panel-community .community-reaction,
body.theme-alt-disabled #support-panel-community .community-reaction-applied,
body.theme-alt-disabled #support-panel-community .community-reaction-option,
body.theme-alt-disabled #support-panel-community .community-composer .input {
  background: rgba(230, 237, 246, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.3) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #support-panel-manual .manual .manual-search-input {
  background: rgba(230, 237, 246, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.3) !important;
  color: #2f3a4d !important;
}

body.test-mode #support-panel-community .community-sidebar,
body.test-mode #support-panel-community .community-main {
  background: rgba(21, 30, 45, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(146, 162, 186, 0.16) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input,
body.test-mode #support-panel-manual .manual .manual-search-input {
  background: rgba(26, 36, 52, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled.test-mode #support-panel-community .community-sidebar,
body.theme-alt-disabled.test-mode #support-panel-community .community-main {
  background: rgba(212, 221, 234, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.28) !important;
}

body.theme-alt-disabled.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(126, 136, 152, 0.18) !important;
}

body.theme-alt-disabled.test-mode #support-panel-community .community-reaction,
body.theme-alt-disabled.test-mode #support-panel-community .community-reaction-applied,
body.theme-alt-disabled.test-mode #support-panel-community .community-reaction-option,
body.theme-alt-disabled.test-mode #support-panel-community .community-composer .input,
body.theme-alt-disabled.test-mode #support-panel-manual .manual .manual-search-input {
  background: rgba(223, 231, 242, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

/* Manual tiles: match community tile backgrounds */
body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(15, 22, 35, 0.92) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.theme-alt-disabled #support-panel-manual .manual .manual-toc,
body.theme-alt-disabled #support-panel-manual .manual .manual-section {
  background: rgba(219, 227, 238, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.28) !important;
}

body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(21, 30, 45, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.theme-alt-disabled.test-mode #support-panel-manual .manual .manual-toc,
body.theme-alt-disabled.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(212, 221, 234, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.28) !important;
}

/* Support form fields: match community/manual tile surfaces */
body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(15, 22, 35, 0.92) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #support-panel-contact .report-export-field input,
body.theme-alt-disabled #support-panel-contact .report-export-field select,
body.theme-alt-disabled #support-panel-contact .report-export-field textarea {
  background: rgba(219, 227, 238, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.3) !important;
  color: #2f3a4d !important;
}

body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(21, 30, 45, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled.test-mode #support-panel-contact .report-export-field input,
body.theme-alt-disabled.test-mode #support-panel-contact .report-export-field select,
body.theme-alt-disabled.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(212, 221, 234, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

/* Scanner signal list rows: match shared tile surface color */
body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(15, 22, 35, 0.92) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(11, 17, 28, 0.94) !important;
}

body.theme-alt-disabled #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(219, 227, 238, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.3) !important;
}

body.theme-alt-disabled #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(210, 220, 233, 0.98) !important;
}

/* alternate mode (non-test): keep key surfaces distinct instead of one shared gray. */
body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-list,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts {
  background: rgba(209, 221, 240, 0.99) !important;
  border-color: rgba(104, 122, 150, 0.34) !important;
}

body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-table th,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(196, 211, 232, 0.99) !important;
}

body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-table tbody tr,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head) {
  background: rgba(221, 232, 246, 0.99) !important;
}

body.theme-alt-disabled:not(.test-mode) #support-panel-contact .report-export-field input,
body.theme-alt-disabled:not(.test-mode) #support-panel-contact .report-export-field select,
body.theme-alt-disabled:not(.test-mode) #support-panel-contact .report-export-field textarea {
  background: rgba(238, 245, 255, 0.99) !important;
  border-color: rgba(112, 128, 154, 0.34) !important;
}

body.theme-alt-disabled:not(.test-mode) #support-panel-manual .manual .manual-toc,
body.theme-alt-disabled:not(.test-mode) #support-panel-manual .manual .manual-section {
  background: rgba(225, 233, 248, 0.99) !important;
  border-color: rgba(108, 124, 149, 0.3) !important;
}

body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-sidebar,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-main {
  background: rgba(215, 226, 241, 0.99) !important;
  border-color: rgba(102, 120, 146, 0.32) !important;
}

body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-reaction,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-reaction-applied,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-reaction-option,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-composer .input {
  background: rgba(228, 237, 249, 0.99) !important;
  border-color: rgba(110, 127, 153, 0.34) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(21, 30, 45, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(17, 25, 38, 0.98) !important;
}

body.theme-alt-disabled.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(212, 221, 234, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
}

body.theme-alt-disabled.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(202, 214, 229, 0.98) !important;
}

/* Ring setup + settings quotes body fields: match current target surface color */
body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #settings-quotes-body .quotes-cell,
body.test-mode #settings-quotes-body .quote-config-span,
body.test-mode #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(21, 30, 45, 0.94) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #settings-panel .quote-ring-settings select,
body.theme-alt-disabled #settings-panel .quote-ring-settings input,
body.theme-alt-disabled #settings-panel .quote-ring-settings .quote-input,
body.theme-alt-disabled #settings-panel .quote-select,
body.theme-alt-disabled #settings-panel .quote-config-readonly .quote-config-value,
body.theme-alt-disabled #settings-quotes-body .quotes-cell,
body.theme-alt-disabled #settings-quotes-body .quote-config-span,
body.theme-alt-disabled #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(230, 237, 246, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.3) !important;
  color: #2f3a4d !important;
}

body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #settings-quotes-body .quotes-cell,
body.test-mode #settings-quotes-body .quote-config-span,
body.test-mode #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(26, 36, 52, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled.test-mode #settings-panel .quote-ring-settings select,
body.theme-alt-disabled.test-mode #settings-panel .quote-ring-settings input,
body.theme-alt-disabled.test-mode #settings-panel .quote-ring-settings .quote-input,
body.theme-alt-disabled.test-mode #settings-panel .quote-select,
body.theme-alt-disabled.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.theme-alt-disabled.test-mode #settings-quotes-body .quotes-cell,
body.theme-alt-disabled.test-mode #settings-quotes-body .quote-config-span,
body.theme-alt-disabled.test-mode #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(223, 231, 242, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

/* Accounts tab column labels: darker minimized-ring style */
body.test-mode #accounts-panel .accounts-table th {
  background: rgba(8, 12, 24, 0.7) !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table th {
  background: rgba(230, 237, 246, 0.98) !important;
}

body.test-mode #accounts-panel .accounts-table th {
  background: rgba(8, 12, 24, 0.7) !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-table th {
  background: rgba(223, 231, 242, 0.98) !important;
}

/* Scanner plus toggle button color */
body.test-mode #scanner-panel .scanner-toggle {
  border-color: rgba(156, 171, 196, 0.34) !important;
  background: rgba(24, 32, 48, 0.88) !important;
  color: #d2d9e6 !important;
}

body.test-mode #scanner-panel .scanner-toggle:hover {
  background: rgba(30, 40, 58, 0.94) !important;
}

body.theme-alt-disabled #scanner-panel .scanner-toggle {
  border-color: rgba(120, 128, 146, 0.34) !important;
  background: rgba(238, 244, 252, 0.98) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #scanner-panel .scanner-toggle:hover {
  background: rgba(230, 238, 248, 0.98) !important;
}

body.test-mode #scanner-panel .scanner-toggle {
  border-color: rgba(146, 162, 186, 0.34) !important;
  background: rgba(35, 45, 63, 0.96) !important;
  color: #d2d9e6 !important;
}

body.test-mode #scanner-panel .scanner-toggle:hover {
  background: rgba(42, 54, 74, 0.98) !important;
}

body.theme-alt-disabled.test-mode #scanner-panel .scanner-toggle {
  border-color: rgba(126, 136, 152, 0.34) !important;
  background: rgba(233, 239, 247, 0.98) !important;
  color: #3c475c !important;
}

/* Reports export tab: match updated environment styling */
body.test-mode #report-panel-export .report-export-tile {
  background: rgba(13, 19, 31, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea {
  background: rgba(20, 28, 42, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: #d2d9e6 !important;
}

body.test-mode #report-panel-export .report-export-actions .primary-btn,
body.test-mode #report-panel-export .report-export-actions .secondary-btn {
  background: rgba(24, 32, 48, 0.86) !important;
  border-color: rgba(156, 171, 196, 0.28) !important;
  color: #d2d9e6 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 8px rgba(7, 10, 18, 0.25) !important;
}

body.theme-alt-disabled #report-panel-export .report-export-tile {
  background: rgba(223, 230, 240, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.28) !important;
}

body.theme-alt-disabled #report-panel-export .report-export-field input,
body.theme-alt-disabled #report-panel-export .report-export-field select,
body.theme-alt-disabled #report-panel-export .report-export-field textarea {
  background: rgba(242, 247, 253, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.3) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #report-panel-export .report-export-actions .primary-btn,
body.theme-alt-disabled #report-panel-export .report-export-actions .secondary-btn {
  background: rgba(246, 250, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 8px rgba(20, 28, 44, 0.14) !important;
}

body.test-mode #report-panel-export .report-export-tile {
  background: rgba(24, 33, 48, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea {
  background: rgba(35, 45, 63, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode #report-panel-export .report-export-actions .primary-btn,
body.test-mode #report-panel-export .report-export-actions .secondary-btn {
  background: rgba(35, 45, 63, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.03), inset 0 -1px 0 rgba(0, 0, 0, 0.2) !important;
}

body.theme-alt-disabled.test-mode #report-panel-export .report-export-tile {
  background: rgba(216, 224, 236, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.28) !important;
}

body.theme-alt-disabled.test-mode #report-panel-export .report-export-field input,
body.theme-alt-disabled.test-mode #report-panel-export .report-export-field select,
body.theme-alt-disabled.test-mode #report-panel-export .report-export-field textarea {
  background: rgba(233, 239, 247, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

body.theme-alt-disabled.test-mode #report-panel-export .report-export-actions .primary-btn,
body.theme-alt-disabled.test-mode #report-panel-export .report-export-actions .secondary-btn {
  background: rgba(237, 241, 247, 0.96) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
  box-shadow: 0 2px 8px rgba(74, 83, 96, 0.14) !important;
}

/* Midnight final override (must be last): restore pre-dark-custom palette */
body.test-mode #support-panel-manual .manual .manual-search-input {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.2) !important;
}

body.test-mode #support-panel-community .community-sidebar {
  background: rgba(10, 12, 24, 0.75) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-main {
  background: rgba(10, 12, 24, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(120, 140, 200, 0.12) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.25) !important;
  color: var(--text) !important;
}

body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #scanner-panel .scanner-details {
  background: rgba(8, 10, 22, 0.6) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(20, 28, 42, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(14, 21, 33, 0.88) !important;
}

body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #settings-quotes-body .quotes-cell,
body.test-mode #settings-quotes-body .quote-config-span,
body.test-mode #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #accounts-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #reports-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: transparent !important;
}

body.test-mode #report-panel-export .report-export-tile {
  background: rgba(10, 12, 30, 0.45) !important;
  border-color: var(--border) !important;
}

body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

/* Reports > Accounts table: darker header + rows distinct from card surface */
body.test-mode #reports-panel .report-table.accounts {
  background: rgba(13, 19, 31, 0.74) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(9, 14, 24, 0.96) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(18, 26, 40, 0.9) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row div {
  border-right-color: rgba(156, 171, 196, 0.2) !important;
}

body.theme-alt-disabled #reports-panel .report-table.accounts {
  background: rgba(223, 230, 240, 0.9) !important;
  border-color: rgba(120, 128, 146, 0.26) !important;
}

body.theme-alt-disabled #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(210, 220, 233, 0.98) !important;
}

body.theme-alt-disabled #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(234, 240, 248, 0.98) !important;
}

body.theme-alt-disabled #reports-panel .report-table.accounts .report-row div {
  border-right-color: rgba(120, 128, 146, 0.22) !important;
}

body.test-mode #reports-panel .report-table.accounts {
  background: rgba(24, 33, 48, 0.9) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(19, 28, 42, 0.98) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(31, 41, 58, 0.95) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row div {
  border-right-color: rgba(146, 162, 186, 0.2) !important;
}

body.theme-alt-disabled.test-mode #reports-panel .report-table.accounts {
  background: rgba(216, 224, 236, 0.9) !important;
  border-color: rgba(126, 136, 152, 0.26) !important;
}

body.theme-alt-disabled.test-mode #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(206, 216, 230, 0.98) !important;
}

body.theme-alt-disabled.test-mode #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(228, 235, 245, 0.98) !important;
}

body.theme-alt-disabled.test-mode #reports-panel .report-table.accounts .report-row div {
  border-right-color: rgba(126, 136, 152, 0.22) !important;
}

/* Ring setup: lighten edit icon for better contrast */
body.test-mode #settings-panel .settings-quotes-card #quote-edit-toggle .edit-icon-ico {
  filter: brightness(0) invert(1) !important;
  opacity: 0.84 !important;
}

body.test-mode #settings-panel .settings-quotes-card #quote-edit-toggle:hover .edit-icon-ico {
  opacity: 1 !important;
}

/* In dark mode, highlighted edit icon should be darker (not white). */
body.test-mode #settings-panel .settings-quotes-card #quote-edit-toggle:hover .edit-icon-ico,
body.test-mode #settings-panel .settings-quotes-card #quote-edit-toggle:focus-visible .edit-icon-ico,
body.test-mode #settings-panel .settings-quotes-card #quote-edit-toggle:active .edit-icon-ico {
  filter: brightness(0) invert(0.42) !important;
  opacity: 1 !important;
}

body.theme-alt-disabled #settings-panel .settings-quotes-card #quote-edit-toggle .edit-icon-ico,
body.theme-alt-disabled.test-mode #settings-panel .settings-quotes-card #quote-edit-toggle .edit-icon-ico {
  filter: brightness(0) saturate(100%) !important;
  opacity: 0.58 !important;
}

/* Sim balance + params/remove actions: match environment surfaces */
body.test-mode #settings-panel .simulator-reset-row .input-prefix,
body.test-mode #settings-panel #sim-balance-default {
  background: #1a2232 !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #settings-panel .quote-ring-params,
body.test-mode #settings-panel .quote-ring-remove,
body.test-mode #settings-panel #save-connections.quote-ring-params,
body.test-mode #settings-panel #delete-connection.quote-ring-remove {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.28) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 2px 8px rgba(7, 10, 18, 0.25) !important;
}

body.test-mode #settings-panel .quote-ring-params:hover,
body.test-mode #settings-panel .quote-ring-remove:hover,
body.test-mode #settings-panel #save-connections.quote-ring-params:hover,
body.test-mode #settings-panel #delete-connection.quote-ring-remove:hover {
  background: rgba(30, 40, 58, 0.84) !important;
}

body.theme-alt-disabled #settings-panel .simulator-reset-row .input-prefix,
body.theme-alt-disabled #settings-panel #sim-balance-default {
  background: rgba(246, 250, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #settings-panel .quote-ring-params,
body.theme-alt-disabled #settings-panel .quote-ring-remove,
body.theme-alt-disabled #settings-panel #save-connections.quote-ring-params,
body.theme-alt-disabled #settings-panel #delete-connection.quote-ring-remove {
  background: rgba(246, 250, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 8px rgba(20, 28, 44, 0.14) !important;
}

body.theme-alt-disabled #settings-panel .quote-ring-params:hover,
body.theme-alt-disabled #settings-panel .quote-ring-remove:hover,
body.theme-alt-disabled #settings-panel #save-connections.quote-ring-params:hover,
body.theme-alt-disabled #settings-panel #delete-connection.quote-ring-remove:hover {
  background: rgba(238, 244, 252, 0.98) !important;
}

body.test-mode #settings-panel .simulator-reset-row .input-prefix,
body.test-mode #settings-panel #sim-balance-default {
  background: #1a2232 !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

/* Dark mode: align API config fields with current settings field surfaces. */
body.test-mode #settings-panel #api-config-card .connection-block input,
body.test-mode #settings-panel #api-config-card .connection-block select,
body.test-mode #settings-panel #api-config-card .api-exchange-static .api-exchange-value,
body.test-mode #settings-panel #api-config-card .api-toggle {
  background: #1a2232 !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

/* API config: remove extra wrapper tile around exchange field/value. */
#settings-panel #api-config-card .api-exchange-static {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

body.test-mode #settings-panel .quote-ring-params,
body.test-mode #settings-panel .quote-ring-remove,
body.test-mode #settings-panel #save-connections.quote-ring-params,
body.test-mode #settings-panel #delete-connection.quote-ring-remove {
  background: rgba(35, 45, 63, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.03), inset 0 -1px 0 rgba(0, 0, 0, 0.2) !important;
}

body.test-mode #settings-panel .quote-ring-params:hover,
body.test-mode #settings-panel .quote-ring-remove:hover,
body.test-mode #settings-panel #save-connections.quote-ring-params:hover,
body.test-mode #settings-panel #delete-connection.quote-ring-remove:hover {
  background: rgba(42, 54, 74, 0.98) !important;
}

body.theme-alt-disabled.test-mode #settings-panel .simulator-reset-row .input-prefix,
body.theme-alt-disabled.test-mode #settings-panel #sim-balance-default {
  background: rgba(237, 241, 247, 0.96) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
}

body.theme-alt-disabled.test-mode #settings-panel .quote-ring-params,
body.theme-alt-disabled.test-mode #settings-panel .quote-ring-remove,
body.theme-alt-disabled.test-mode #settings-panel #save-connections.quote-ring-params,
body.theme-alt-disabled.test-mode #settings-panel #delete-connection.quote-ring-remove {
  background: rgba(237, 241, 247, 0.96) !important;
  border-color: rgba(126, 136, 152, 0.3) !important;
  color: #3c475c !important;
  box-shadow: 0 2px 8px rgba(74, 83, 96, 0.14) !important;
}

/* Accounts table parity: minimized-ring style with darker cells */
body.test-mode #accounts-panel .accounts-list {
  background: transparent !important;
  border-color: transparent !important;
}

body.test-mode #accounts-panel .accounts-table {
  background: transparent !important;
  border-collapse: separate !important;
  border-spacing: 0 3px !important;
}

body.test-mode #accounts-panel .accounts-table th {
  background: rgba(8, 12, 24, 0.7) !important;
  color: #8f99ab !important;
}

body.test-mode #accounts-panel .accounts-table tbody tr {
  background: rgba(10, 14, 28, 0.65) !important;
}

body.test-mode #accounts-panel .accounts-table td {
  color: #d2d9e6 !important;
}

body.test-mode #accounts-panel .accounts-table th,
body.test-mode #accounts-panel .accounts-table td {
  border-bottom: none !important;
}

body.theme-alt-disabled #accounts-panel .accounts-list {
  background: rgba(219, 227, 238, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.28) !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table th {
  background: rgba(208, 218, 232, 0.98) !important;
  color: #5b667c !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table tbody tr {
  background: rgba(230, 237, 246, 0.98) !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table td {
  color: #2f3a4d !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table th,
body.theme-alt-disabled #accounts-panel .accounts-table td {
  border-bottom-color: rgba(120, 128, 146, 0.24) !important;
}

body.test-mode #accounts-panel .accounts-list {
  background: transparent !important;
  border-color: var(--border) !important;
}

body.test-mode #accounts-panel .accounts-table {
  border-collapse: separate !important;
  border-spacing: 0 3px !important;
  background: transparent !important;
}

body.test-mode #accounts-panel .accounts-table th {
  background: rgba(8, 12, 24, 0.7) !important;
  color: #8f99ab !important;
}

body.test-mode #accounts-panel .accounts-table tbody tr {
  background: rgba(10, 14, 28, 0.65) !important;
}

body.test-mode #accounts-panel .accounts-table td {
  color: #d2d9e6 !important;
}

body.test-mode #accounts-panel .accounts-table th,
body.test-mode #accounts-panel .accounts-table td {
  border-bottom: none !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-list {
  background: rgba(212, 221, 234, 0.98) !important;
  border-color: rgba(126, 136, 152, 0.28) !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-table th {
  background: rgba(202, 214, 229, 0.98) !important;
  color: #5b667c !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-table tbody tr {
  background: rgba(223, 231, 242, 0.98) !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-table td {
  color: #2f3a4d !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-table th,
body.theme-alt-disabled.test-mode #accounts-panel .accounts-table td {
  border-bottom-color: rgba(126, 136, 152, 0.22) !important;
}

/* === TRUE EOF Midnight hard override === */
body.test-mode #support-panel-manual .manual .manual-search-input,
body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea,
body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea,
body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-select,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #settings-quotes-body .quotes-cell,
body.test-mode #settings-quotes-body .quote-config-span,
body.test-mode #settings-quotes-body .quote-config-span .quote-input {
  background: rgba(24, 32, 48, 0.78) !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.2) !important;
}

body.test-mode #support-panel-community .community-sidebar {
  background: rgba(10, 12, 24, 0.75) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-main {
  background: rgba(10, 12, 24, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.18) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: rgba(120, 140, 200, 0.25) !important;
  color: var(--text) !important;
}

body.test-mode #scanner-panel .scanner-details {
  background: rgba(8, 10, 22, 0.6) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(20, 28, 42, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(14, 21, 33, 0.88) !important;
}

body.test-mode #report-panel-export .report-export-tile {
  background: rgba(10, 12, 30, 0.45) !important;
  border-color: var(--border) !important;
}

body.test-mode #accounts-panel .report-table.accounts,
body.test-mode #reports-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head,
body.test-mode #reports-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #reports-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: transparent !important;
}

/* === TRUE EOF Dark-mode gray restore (final) === */
body.test-mode #support-panel-manual .manual .manual-search-input,
body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(26, 36, 52, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode #support-panel-community .community-sidebar,
body.test-mode #support-panel-community .community-main {
  background: rgba(21, 30, 45, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #support-panel-community .community-post {
  border-bottom-color: rgba(146, 162, 186, 0.16) !important;
}

body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(26, 36, 52, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
}

body.test-mode #scanner-panel .scanner-details {
  background: rgba(29, 38, 53, 0.95) !important;
  border-top-color: rgba(146, 162, 186, 0.2) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(33, 43, 60, 0.96) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(26, 35, 50, 0.97) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
}

/* === TRUE EOF Dark-mode Accounts header restore === */
body.test-mode #accounts-panel .accounts-table th,
body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 20, 0.88) !important;
  color: #8f99ab !important;
}

body.test-mode #accounts-panel .accounts-table tbody tr {
  background: rgba(7, 11, 22, 0.84) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-table th,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 20, 0.88) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-table tbody tr,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(7, 11, 22, 0.84) !important;
}

body.test-mode #accounts-panel .accounts-table th,
body.test-mode #accounts-panel .accounts-table td,
body.test-mode #accounts-panel .report-table.accounts .report-row.report-head > div {
  border-bottom: none !important;
}

/* === TRUE EOF Dark-mode deals tabs + logs restore === */
body.test-mode .table-card .positions-tabs .positions-tab {
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  border-color: rgba(146, 162, 186, 0.22) !important;
  color: #c7d1e0 !important;
}

body.test-mode .table-card .positions-tabs .positions-tab.is-active {
  background: linear-gradient(180deg, rgba(89, 104, 126, 0.9), rgba(73, 87, 108, 0.92)) !important;
  border-color: rgba(173, 188, 214, 0.34) !important;
  color: #e2e8f3 !important;
}

body.test-mode .table-card .deal-logs {
  background: var(--deals-table-bg) !important;
  border-top: 1px solid rgba(146, 162, 186, 0.18) !important;
  color: #aeb8ca !important;
  scrollbar-color: rgba(146, 162, 186, 0.34) var(--deals-table-bg) !important;
}

body.test-mode .table-card .deal-logs::-webkit-scrollbar-track {
  background: var(--deals-table-bg) !important;
}

body.test-mode .table-card .deal-logs::-webkit-scrollbar-thumb {
  background: rgba(146, 162, 186, 0.34) !important;
  border-color: var(--deals-table-bg) !important;
}

body.test-mode .table-card .deal-log-row {
  background: var(--deals-table-bg) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
  color: #c7d1e0 !important;
}

body.test-mode .table-card .deal-log-row span:last-child {
  color: #d2d9e6 !important;
}

/* === TRUE EOF Toggle style (new) === */
.toggle-wrapper {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
  border-radius: 0.5em;
  padding: 0.125em;
  font-size: 12px;
  background-image: linear-gradient(to bottom, #d0c4b8, #f5ece5);
  box-shadow: 0 1px 1px rgb(255 255 255 / 0.6);
}

.toggle-wrapper.is-disabled {
  opacity: 0.55;
}

.toggle-checkbox {
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  z-index: 2;
  inset: 0;
  border-radius: inherit;
  opacity: 0;
  cursor: pointer;
  margin: 0;
}

.toggle-container {
  display: flex;
  align-items: center;
  position: relative;
  border-radius: 0.375em;
  width: 3em;
  height: 1.5em;
  background-color: #e1dacd;
  box-shadow: inset 0 0 0.0625em 0.125em rgb(255 255 255 / 0.2), inset 0 0.0625em 0.125em rgb(0 0 0 / 0.4);
  transition: background-color 0.4s linear;
}

.toggle-checkbox:checked + .toggle-container {
  background-color: #f3b519;
}

.toggle-button {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0.0625em;
  border-radius: 0.3125em;
  width: 1.375em;
  height: 1.375em;
  background-color: #e4ddcf;
  box-shadow: inset 0 -0.0625em 0.0625em 0.125em rgb(0 0 0 / 0.1), inset 0 -0.125em 0.0625em rgb(0 0 0 / 0.2), inset 0 0.1875em 0.0625em rgb(255 255 255 / 0.3), 0 0.125em 0.125em rgb(0 0 0 / 0.5);
  transition: left 0.4s;
}

.toggle-checkbox:checked + .toggle-container > .toggle-button {
  left: 1.5625em;
}

.toggle-button-circles-container {
  display: grid;
  grid-template-columns: repeat(3, min-content);
  gap: 0.125em;
  margin: 0 auto;
}

.toggle-button-circle {
  border-radius: 50%;
  width: 0.125em;
  height: 0.125em;
  background-image: radial-gradient(circle at 50% 0, #f6f0e9, #bebcb0);
}

/* === TRUE EOF Toggle style (toggle-container + toggle-button + lights) === */
.toggle {
  --h: 18px;
  --w: 44px;
  --pad: 2px;
  --track-off: #2b3344;
  --track-on: #5fb3ee;
  --thumb: #e4ddcf;
  --thumb-shadow: rgba(0, 0, 0, 0.45);
  position: relative;
  width: var(--w);
  height: var(--h);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.theme-alt-disabled .toggle,
body.theme-alt-disabled.test-mode .toggle {
  --track-on: #64c6ff;
}

body.test-mode .toggle {
  --track-on: #5fb3ee;
}

.toggle.is-disabled {
  opacity: 0.55;
}

.toggle .toggle-checkbox {
  -webkit-appearance: none;
  appearance: none;
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  z-index: 3;
  cursor: pointer;
}

.toggle .lights {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
}

.toggle .light-off,
.toggle .light-on {
  position: absolute;
  top: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  transform: translateY(-50%);
  opacity: 0.7;
  transition: opacity 0.28s ease;
}

.toggle .light-off {
  right: 7px;
  background: #8894ac;
}

.toggle .light-on {
  left: 7px;
  background: #b9d7ff;
  opacity: 0.25;
}

.toggle .toggle-checkbox:checked ~ .lights .light-off {
  opacity: 0.22;
}

.toggle .toggle-checkbox:checked ~ .lights .light-on {
  opacity: 0.75;
}

/* Market heartbeat on ring trading toggles: green ON dot + pulse. */
.toggle.quotes-switch .toggle-checkbox:checked ~ .lights .light-on {
  width: 6px !important;
  height: 6px !important;
  background: #46f08f !important;
  opacity: 0.92 !important;
  box-shadow: 0 0 9px rgba(70, 240, 143, 0.68) !important;
}

body.theme-alt-disabled #dashboard-panel .toggle.quotes-switch .toggle-checkbox:checked ~ .lights .light-on,
body.theme-alt-disabled #settings-panel .toggle.quotes-switch .toggle-checkbox:checked ~ .lights .light-on {
  width: 6px !important;
  height: 6px !important;
  background: #46f08f !important;
  opacity: 0.95 !important;
  box-shadow: 0 0 10px rgba(70, 240, 143, 0.72) !important;
}

.toggle.quotes-switch.is-market-heartbeat .light-on {
  animation: feed-heartbeat 0.9s ease-in-out 1;
}

/* Re-apply explicit theme-alt-disabled colors after blanket resets */
body.theme-alt-disabled .toggle .toggle-container {
  background-color: #8ea1b8 !important;
  box-shadow: inset 0 0 0.0625em 0.125em rgba(255, 255, 255, 0.22), inset 0 0.0625em 0.125em rgba(0, 0, 0, 0.22) !important;
}

body.theme-alt-disabled .toggle .light-off {
  background: #7f8da2 !important;
}

body.theme-alt-disabled .toggle .light-on {
  background: #64c6ff !important;
  opacity: 0.45 !important;
}

body.theme-alt-disabled .toggle .toggle-checkbox:checked + .toggle-container {
  background: linear-gradient(180deg, #8bd8ff, #64c6ff) !important;
}

body.theme-alt-disabled .toggle .toggle-checkbox:checked ~ .lights .light-on {
  opacity: 0.95 !important;
  box-shadow: 0 0 8px rgba(100, 198, 255, 0.6) !important;
}

body.theme-alt-disabled .toggle .toggle-button {
  background: linear-gradient(180deg, #f5f7fb, #dfe5ee) !important;
  box-shadow: inset 0 -0.0625em 0.0625em 0.125em rgba(0, 0, 0, 0.1), inset 0 -0.125em 0.0625em rgba(0, 0, 0, 0.18), inset 0 0.1875em 0.0625em rgba(255, 255, 255, 0.5), 0 0.125em 0.125em rgba(40, 64, 92, 0.24) !important;
}

/* High-specificity panel-scoped overrides (beats global theme-alt-disabled blanket reset). */
body.theme-alt-disabled #settings-panel .toggle .toggle-container,
body.theme-alt-disabled #dashboard-panel .toggle .toggle-container {
  background: #8ea1b8 !important;
}

body.theme-alt-disabled #settings-panel .toggle .toggle-checkbox:checked + .toggle-container,
body.theme-alt-disabled #dashboard-panel .toggle .toggle-checkbox:checked + .toggle-container {
  background: linear-gradient(180deg, #8bd8ff, #64c6ff) !important;
}

body.theme-alt-disabled #settings-panel .toggle .light-on,
body.theme-alt-disabled #dashboard-panel .toggle .light-on {
  background: #64c6ff !important;
}

body.theme-alt-disabled #settings-panel .toggle .toggle-button,
body.theme-alt-disabled #dashboard-panel .toggle .toggle-button {
  background: linear-gradient(180deg, #f5f7fb, #dfe5ee) !important;
}

/* === TRUE EOF Settings feed status icon colors (Trading + Market) === */
#settings-panel .connection-status-list .status-pill:not(.status-latency) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* Keep connected/disconnected text neutral; retain dot color coding only. */
#settings-panel .connection-status-list .status-pill.is-ok,
#settings-panel .connection-status-list .status-pill.status-ok,
#settings-panel .connection-status-list .status-pill.is-warn,
#settings-panel .connection-status-list .status-pill.status-warn,
#settings-panel .connection-status-list .status-pill.is-bad,
#settings-panel .connection-status-list .status-pill.status-error,
#settings-panel .connection-status-list .status-pill.status-bad {
  color: var(--text) !important;
  border-color: var(--border) !important;
}

#settings-panel .connection-status-list .status-pill:not(.status-latency)::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff5d5d !important;
  box-shadow: 0 0 6px rgba(255, 93, 93, 0.45) !important;
  flex: 0 0 7px;
  display: inline-block !important;
  opacity: 1 !important;
}

#settings-panel .connection-status-list .status-pill.status-ok::before {
  background: #34d17b !important;
  box-shadow: 0 0 6px rgba(52, 209, 123, 0.45) !important;
}

#settings-panel .connection-status-list .status-pill.status-warn::before,
#settings-panel .connection-status-list .status-pill.status-error::before,
#settings-panel .connection-status-list .status-pill.status-bad::before {
  background: #ff5d5d !important;
  box-shadow: 0 0 6px rgba(255, 93, 93, 0.45) !important;
}

/* === TRUE EOF Dark-mode quote exchange label contrast === */
body.test-mode .quotes-card .quotes-leg .quotes-exchange,
body.test-mode .quotes-ring-legs .quotes-leg .quotes-exchange {
  color: #8fd3ff !important;
  text-shadow: 0 0 8px rgba(77, 181, 255, 0.2);
}

/* Settings card tabs: blue only when selected, neutral on hover in alternate mode. */
body.theme-alt-disabled #settings-panel .toggle-btn:hover {
  background: linear-gradient(180deg, rgba(228, 232, 240, 0.96), rgba(208, 214, 226, 0.94)) !important;
  border-color: rgba(120, 128, 146, 0.5) !important;
  color: #2f3a4d !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 2px 6px rgba(62, 70, 86, 0.14) !important;
}

body.theme-alt-disabled #settings-panel .toggle-btn.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

/* FINAL: settings connect/disconnect buttons must highlight blue on hover in alternate mode. */
body.theme-alt-disabled #settings-panel .connection-status-row .primary-btn.conn-btn-connected:hover:not(:disabled),
body.theme-alt-disabled #settings-panel .connection-status-row .primary-btn.conn-btn-disconnected:hover:not(:disabled),
body.theme-alt-disabled #settings-panel .connection-status-row .primary-btn:hover:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

/* Keep explicit blue hover override only in alternate mode. */
body.theme-alt-disabled #settings-panel .connection-status-row .primary-btn.conn-btn-connected:hover:not(:disabled),
body.theme-alt-disabled #settings-panel .connection-status-row .primary-btn.conn-btn-disconnected:hover:not(:disabled),
body.theme-alt-disabled #settings-panel .connection-status-row .primary-btn:hover:not(:disabled),
body.theme-alt-disabled #settings-panel .connection-status-row .primary-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

/* ABSOLUTE RESET: remove custom theme-alt-disabled section backgrounds; use default card surfaces. */
body.theme-alt-disabled #accounts-panel .accounts-list,
body.theme-alt-disabled #accounts-panel .accounts-table,
body.theme-alt-disabled #accounts-panel .accounts-table th,
body.theme-alt-disabled #accounts-panel .accounts-table tbody tr,
body.theme-alt-disabled #accounts-panel .report-table.accounts,
body.theme-alt-disabled #accounts-panel .report-table.accounts .report-row.report-head,
body.theme-alt-disabled #accounts-panel .report-table.accounts .report-row:not(.report-head),
body.theme-alt-disabled #support-panel-contact .report-export-field input,
body.theme-alt-disabled #support-panel-contact .report-export-field select,
body.theme-alt-disabled #support-panel-contact .report-export-field textarea,
body.theme-alt-disabled #support-panel-manual .manual .manual-search-input,
body.theme-alt-disabled #support-panel-manual .manual .manual-toc,
body.theme-alt-disabled #support-panel-manual .manual .manual-section,
body.theme-alt-disabled #support-panel-community .community-sidebar,
body.theme-alt-disabled #support-panel-community .community-main,
body.theme-alt-disabled #support-panel-community .community-reaction,
body.theme-alt-disabled #support-panel-community .community-reaction-applied,
body.theme-alt-disabled #support-panel-community .community-reaction-option,
body.theme-alt-disabled #support-panel-community .community-composer .input {
  background: transparent !important;
}

/* KILL SWITCH: clear nested theme-alt-disabled tint overrides in target sections. */
body.theme-alt-disabled #accounts-panel .accounts-list *,
body.theme-alt-disabled #accounts-panel .report-table.accounts *,
body.theme-alt-disabled #support-panel-contact .report-export-field *,
body.theme-alt-disabled #support-panel-manual .manual *,
body.theme-alt-disabled #support-panel-community .community-sidebar *,
body.theme-alt-disabled #support-panel-community .community-main * {
  background-image: none !important;
}

body.theme-alt-disabled #accounts-panel .accounts-list *,
body.theme-alt-disabled #accounts-panel .report-table.accounts *,
body.theme-alt-disabled #support-panel-contact .report-export-field input,
body.theme-alt-disabled #support-panel-contact .report-export-field select,
body.theme-alt-disabled #support-panel-contact .report-export-field textarea,
body.theme-alt-disabled #support-panel-manual .manual .manual-search-input,
body.theme-alt-disabled #support-panel-manual .manual .manual-toc,
body.theme-alt-disabled #support-panel-manual .manual .manual-section,
body.theme-alt-disabled #support-panel-community .community-sidebar,
body.theme-alt-disabled #support-panel-community .community-main,
body.theme-alt-disabled #support-panel-community .community-reaction,
body.theme-alt-disabled #support-panel-community .community-reaction-applied,
body.theme-alt-disabled #support-panel-community .community-reaction-option,
body.theme-alt-disabled #support-panel-community .community-composer .input {
  background-color: transparent !important;
}

/* FINAL LIGHT-MODE RESET: remove custom panel tints only in Light (not Midnight/Dark). */
body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-list,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-table,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-table th,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-table td,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
body.theme-alt-disabled:not(.test-mode) #support-panel-contact .report-export-field input,
body.theme-alt-disabled:not(.test-mode) #support-panel-contact .report-export-field select,
body.theme-alt-disabled:not(.test-mode) #support-panel-contact .report-export-field textarea,
body.theme-alt-disabled:not(.test-mode) #support-panel-manual .manual .manual-search-input,
body.theme-alt-disabled:not(.test-mode) #support-panel-manual .manual .manual-toc,
body.theme-alt-disabled:not(.test-mode) #support-panel-manual .manual .manual-section,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-sidebar,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-main,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-post,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-reaction,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-reaction-applied,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-reaction-option,
body.theme-alt-disabled:not(.test-mode) #support-panel-community .community-composer .input {
  background: transparent !important;
  background-image: none !important;
}

/* FINAL toggle implementation: switch-holder + switch-toggle (input + label). */
.toggle.switch-holder {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 24px;
}

.toggle.switch-holder.is-disabled {
  opacity: 0.55;
}

.toggle.switch-holder .switch-toggle {
  position: relative;
  width: 46px;
  height: 24px;
}

.toggle.switch-holder .switch-toggle .toggle-checkbox {
  position: absolute;
  inset: 0;
  opacity: 0 !important;
  cursor: pointer;
  z-index: 3;
  margin: 0;
}

.toggle.switch-holder .switch-toggle label {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: #30384a !important;
  border: 1px solid rgba(128, 144, 170, 0.36) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  transition: background-color 0.25s ease, border-color 0.25s ease;
}

.toggle.switch-holder .switch-toggle label::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: linear-gradient(180deg, #efefe8, #c8c8c1) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  transition: transform 0.25s ease, background 0.25s ease;
}

.toggle.switch-holder .switch-toggle label::after {
  content: '';
  position: absolute;
  left: 8px;
  top: 50%;
  width: 5px;
  height: 5px;
  margin-top: -2.5px;
  border-radius: 50%;
  background: #9eb0ca;
  opacity: 0.28;
  transition: opacity 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.toggle.switch-holder .switch-toggle .toggle-checkbox:checked + label {
  background: #5fb3ee !important;
  border-color: rgba(111, 194, 243, 0.62) !important;
}

.toggle.switch-holder .switch-toggle .toggle-checkbox:checked + label::before {
  transform: translateX(22px);
  background: linear-gradient(180deg, #ffffff, #e5e5df) !important;
}

.toggle.switch-holder .switch-toggle .toggle-checkbox:checked + label::after {
  opacity: 0.2;
}

body.theme-alt-disabled .toggle.switch-holder .switch-toggle label {
  background: #9ba8bc !important;
  border-color: rgba(105, 120, 145, 0.45) !important;
}

body.theme-alt-disabled .toggle.switch-holder .switch-toggle .toggle-checkbox:checked + label {
  background: #64c6ff !important;
  border-color: rgba(58, 150, 206, 0.46) !important;
}

body.theme-alt-disabled .toggle.switch-holder .switch-toggle label::after {
  background: #6f7f96;
}

/* Market heartbeat indicator on active trading toggles. */
.toggle.switch-holder.quotes-switch .switch-toggle .toggle-checkbox:checked + label::after {
  opacity: 0.85;
  background: #46f08f;
  box-shadow: 0 0 8px rgba(70, 240, 143, 0.68);
}

.toggle.switch-holder.quotes-switch.is-market-heartbeat .switch-toggle label::after {
  animation: feed-heartbeat 0.9s ease-in-out 1;
}

/* FINAL Toggle (Uiverse-based) */
.toggle.switch {
  width: 54px;
  height: 26px;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.toggle.switch.is-disabled {
  opacity: 0.55;
}

.toggle.switch input.toggle-checkbox {
  position: absolute;
  inset: 0;
  opacity: 0 !important;
  z-index: 3;
  cursor: pointer;
  margin: 0;
}

.toggle.switch .slider {
  cursor: pointer;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: rgb(8, 8, 8);
  transition: all 0.4s cubic-bezier(0.99, 0.1, 0.1, 0.99);
  border-radius: 5px;
  box-shadow: inset 0 0 1px 0 rgba(0, 0, 0, 1), inset 56px 0 34px -34px rgba(126, 4, 4, 0.56);
  border: 2px solid black;
}

.toggle.switch .slider-btn {
  position: absolute;
  aspect-ratio: 6 / 4;
  border-radius: 3px;
  left: 2px;
  top: 2px;
  bottom: 2px;
  right: auto;
  background: linear-gradient(to bottom, #333333, #242323);
  border: 1px solid #2b2b2b;
  background-color: #333333;
  box-shadow: 0 10px 5px 1px rgba(0, 0, 0, 0.15), inset 10px 0 10px -5px rgba(126, 4, 4, 0.1);
  transition: all 0.4s cubic-bezier(0.99, 0.1, 0.1, 0.99);
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 3px;
}

.toggle.switch .texture {
  width: 2px;
  height: 70%;
  background-color: #202020ea;
  box-shadow: -0.7px -1.5px 1px 0 rgba(192, 192, 192, 0.3), 0 2px 3px rgb(0 0 0 / 0.3);
  transition: 0.25s;
}

.toggle.switch .light {
  width: 4px;
  height: 4px;
  border: 1px solid #222121;
  border-radius: 50%;
  transition: all 0.4s cubic-bezier(0.99, 0.1, 0.1, 0.99);
  background-color: rgb(230, 14, 14);
  box-shadow: 0 0 10px 1px rgb(241, 28, 28);
}

.toggle.switch input.toggle-checkbox:checked + .slider {
  box-shadow: inset 0 0 1px 0 rgba(0, 0, 0, 1), inset -56px 0 34px -34px rgba(1, 78, 4, 0.6);
}

.toggle.switch input.toggle-checkbox:checked + .slider .slider-btn {
  transform: translateX(66%);
  box-shadow: 0 10px 5px 1px rgba(0, 0, 0, 0.15), inset -10px 0 10px -5px rgba(1, 112, 4, 0.1);
}

.toggle.switch input.toggle-checkbox:checked + .slider .slider-btn .light {
  background-color: rgb(35, 158, 4);
  box-shadow: 0 0 10px 0 rgb(57, 230, 14);
}

.toggle.switch.quotes-switch.is-market-heartbeat .slider .slider-btn .light {
  animation: feed-heartbeat 0.9s ease-in-out 1;
}

body.theme-alt-disabled .toggle.switch .slider {
  border-color: rgba(68, 84, 104, 0.8);
}

/* FINAL Toggle (Uiverse onoffswitch by vikramsinghnegi) */
.toggle.onoffswitch {
  position: relative;
  width: 64px;
  user-select: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.toggle.onoffswitch .onoffswitch-checkbox {
  display: none;
}

.toggle.onoffswitch .onoffswitch-label {
  display: block;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid #999999;
  border-radius: 20px;
  width: 100%;
}

.toggle.onoffswitch .onoffswitch-inner {
  display: block;
  width: 200%;
  margin-left: -100%;
  transition: margin 0.3s ease-in 0s;
}

.toggle.onoffswitch .onoffswitch-inner::before,
.toggle.onoffswitch .onoffswitch-inner::after {
  float: left;
  width: 50%;
  height: 22px;
  padding: 0;
  line-height: 22px;
  font-size: 10px;
  color: #fff;
  font-family: Trebuchet, Arial, sans-serif;
  font-weight: 700;
  box-sizing: border-box;
}

.toggle.onoffswitch .onoffswitch-inner::before {
  content: "ON";
  padding-left: 8px;
  background-color: #212f33;
  color: #ffffff;
}

.toggle.onoffswitch .onoffswitch-inner::after {
  content: "OFF";
  padding-right: 8px;
  background-color: #eeeeee;
  color: #999999;
  text-align: right;
}

.toggle.onoffswitch .onoffswitch-switch {
  width: 14px;
  margin: 4px;
  background: #ffffff;
  border: 2px solid #271616;
  border-radius: 20px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 40px;
  transition: all 0.3s ease-in 0s;
}

.toggle.onoffswitch .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
  margin-left: 0;
}

.toggle.onoffswitch .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
  right: 0;
}

.toggle.onoffswitch.is-disabled {
  opacity: 0.55;
}

body.theme-alt-disabled .toggle.onoffswitch .onoffswitch-label {
  border-color: rgba(122, 136, 154, 0.85);
}

body.theme-alt-disabled .toggle.onoffswitch .onoffswitch-inner::before {
  background-color: #4f85a2;
}

.toggle.onoffswitch.quotes-switch.is-market-heartbeat .onoffswitch-switch {
  animation: feed-heartbeat 0.9s ease-in-out 1;
}

/* FINAL Toggle (Uiverse devestter, direction reversed) */
.toggle.devestter {
  position: relative;
  width: 56px;
  height: 24px;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: rgba(99, 99, 99, 0.2) 0 2px 8px 0;
}

.toggle.devestter.is-disabled {
  opacity: 0.55;
}

.toggle.devestter .checkbox {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  opacity: 0 !important;
  cursor: pointer;
  z-index: 3;
}

.toggle.devestter .knobs,
.toggle.devestter .layer {
  position: absolute;
  inset: 0;
}

.toggle.devestter .knobs {
  z-index: 2;
}

.toggle.devestter .layer {
  width: 100%;
  background-color: #524949;
  transition: 0.3s ease all;
  z-index: 1;
  border-radius: 12px;
}

/* Reversed direction: default OFF on right, checked ON on left. */
.toggle.devestter .knobs::before {
  content: "OFF";
  position: absolute;
  top: 3px;
  right: 6px;
  width: 24px;
  height: 18px;
  color: #ffffff;
  font-size: 9px;
  font-weight: 700;
  text-align: center;
  line-height: 1;
  background-color: #f44336;
  border-radius: 30%;
  transition: 0.3s ease all, right 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15), left 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15);
  display: flex;
  align-items: center;
  justify-content: center;
}

.toggle.devestter .checkbox:active + .knobs::before {
  width: 34px;
  border-radius: 4px;
}

.toggle.devestter .checkbox:checked:active + .knobs::before {
  margin-right: -20px;
}

.toggle.devestter .checkbox:checked + .knobs::before {
  content: "ON";
  right: auto;
  left: 6px;
  background-color: #2ba114;
  color: #ffffff;
}

.toggle.devestter .checkbox:checked ~ .layer {
  background-color: #524949;
}

body.theme-alt-disabled .toggle.devestter .layer {
  background-color: #7f8aa0;
}

body.theme-alt-disabled .toggle.devestter .checkbox:checked + .knobs::before {
  background-color: #2ea85b;
}

.toggle.devestter.quotes-switch.is-market-heartbeat .knobs::before {
  animation: feed-heartbeat 0.9s ease-in-out 1;
  box-shadow: 0 0 10px rgba(70, 240, 143, 0.6);
}

/* Elijah and cosmic toggle styles removed — switchbutton is the sole toggle style. */
/* Dark modes: apply light-orange highlight effect on action buttons. */
body:not(.theme-alt-disabled) .primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) .secondary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) .toggle-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) .quote-ring-params:hover:not(:disabled),
body:not(.theme-alt-disabled) .quote-ring-remove:hover:not(:disabled),
body:not(.theme-alt-disabled) .primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) .secondary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) .toggle-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) .quote-ring-params:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) .quote-ring-remove:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 205, 138, 0.95), rgba(255, 177, 98, 0.92)) !important;
  border-color: rgba(191, 123, 56, 0.45) !important;
  color: #4f2f0d !important;
  box-shadow: inset 0 1px 0 rgba(255, 244, 226, 0.72), 0 2px 6px rgba(174, 111, 52, 0.18) !important;
}

/* Dark modes: force light-orange highlight on key settings action buttons (clear/save/new ring). */
body:not(.theme-alt-disabled) #settings-panel #save-settings.primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #save-settings.primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #save-quote-rings.primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #save-quote-rings.primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .quote-edit-actions .quote-add-btn.primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .quote-edit-actions .quote-add-btn.primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #clear-connection-logs.primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #clear-connection-logs.primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #clear-history-settings:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #clear-history-settings:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 205, 138, 0.95), rgba(255, 177, 98, 0.92)) !important;
  border-color: rgba(191, 123, 56, 0.45) !important;
  color: #4f2f0d !important;
  box-shadow: inset 0 1px 0 rgba(255, 244, 226, 0.72), 0 2px 6px rgba(174, 111, 52, 0.18) !important;
}

/* Dark modes: ID-specific orange highlight for key actions across tabs. */
body:not(.theme-alt-disabled) #settings-panel .connection-status-row .primary-btn.conn-btn-connected:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .connection-status-row .primary-btn.conn-btn-disconnected:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .connection-status-row .primary-btn.conn-btn-connected:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .connection-status-row .primary-btn.conn-btn-disconnected:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #trading-feed-add.primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #trading-feed-add.primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #save-connections.quote-ring-params:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel #save-connections.quote-ring-params:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #reports-panel #report-export-pdf:hover:not(:disabled),
body:not(.theme-alt-disabled) #reports-panel #report-export-pdf:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #reports-panel #report-export-csv:hover:not(:disabled),
body:not(.theme-alt-disabled) #reports-panel #report-export-csv:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #support-panel #support-submit:hover:not(:disabled),
body:not(.theme-alt-disabled) #support-panel #support-submit:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #support-panel #community-submit:hover:not(:disabled),
body:not(.theme-alt-disabled) #support-panel #community-submit:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 205, 138, 0.95), rgba(255, 177, 98, 0.92)) !important;
  border-color: rgba(191, 123, 56, 0.45) !important;
  color: #4f2f0d !important;
  box-shadow: inset 0 1px 0 rgba(255, 244, 226, 0.72), 0 2px 6px rgba(174, 111, 52, 0.18) !important;
}

/* Dark modes: do NOT blue-highlight settings card tab buttons. */
body:not(.theme-alt-disabled) #settings-panel .toggle-group .toggle-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .toggle-group .toggle-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .card-header .toggle-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .card-header .toggle-btn:focus-visible:not(:disabled) {
  background: rgba(16, 22, 36, 0.72) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

/* Settings card tabs: no hover highlight (keep base style), all modes. */
body:not(.theme-alt-disabled) #settings-panel .settings-card .toggle-group .toggle-btn:hover:not(.is-active):not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .settings-card .toggle-group .toggle-btn:focus-visible:not(.is-active):not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body.theme-alt-disabled #settings-panel .settings-card .toggle-group .toggle-btn:hover:not(.is-active):not(:disabled),
body.theme-alt-disabled #settings-panel .settings-card .toggle-group .toggle-btn:focus-visible:not(.is-active):not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

/* Reduce chart-tab blue glow intensity (active state). */
body:not(.theme-alt-disabled) .chart-btn.is-active,
body:not(.theme-alt-disabled) .timeframe-btn.is-active {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 1px 3px rgba(77, 213, 255, 0.08) !important;
}

body.theme-alt-disabled .chart-btn.is-active,
body.theme-alt-disabled .timeframe-btn.is-active {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62), 0 1px 3px rgba(45, 123, 173, 0.08) !important;
}

/* FINAL global card radius override (all modes, all breakpoints). */
body .card,
body .chart-card,
body .table-card,
body .quotes-card,
body .ring-card,
body .report-card,
body .scanner-card,
body .connections-card,
body .status-card,
body .inline-api-config-card,
body .ring-tile,
body .ring-indicators-panel,
body .ring-summary-panel,
body .report-metric,
body .connection-status,
body .connection-block,
body .quote-ring-settings,
body .scanner-row,
body .deals-row,
body .deals-details,
body .report-row,
body .config-section,
body .api-exchange-static,
body .settings-block,
body .settings-row,
body .ring-config,
body .quote-ring,
body .quotes-table,
body .connection-log-list,
body .accounts-list,
body .accounts-table,
body .table {
  border-radius: 18px !important;
}

/* Absolute card/tile radius override per mode (beats mode-specific 7px rules). */
body:not(.theme-alt-disabled):not(.test-mode) .card,
body:not(.theme-alt-disabled):not(.test-mode) .ring-tile,
body:not(.theme-alt-disabled):not(.test-mode) .ring-indicators-panel,
body:not(.theme-alt-disabled):not(.test-mode) .ring-summary-panel,
body:not(.theme-alt-disabled):not(.test-mode) .quotes-leg,
body:not(.theme-alt-disabled):not(.test-mode) .quotes-ring-metrics,
body:not(.theme-alt-disabled):not(.test-mode) .deals-row,
body:not(.theme-alt-disabled):not(.test-mode) .report-row,
body:not(.theme-alt-disabled):not(.test-mode) .scanner-row,
body:not(.theme-alt-disabled):not(.test-mode) .settings-row,
body:not(.theme-alt-disabled):not(.test-mode) .quote-ring,
body:not(.theme-alt-disabled):not(.test-mode) .quote-ring-settings,
body:not(.theme-alt-disabled):not(.test-mode) .connection-status,
body:not(.theme-alt-disabled):not(.test-mode) .connection-block,
body:not(.theme-alt-disabled):not(.test-mode) .chart-wrap,
body:not(.theme-alt-disabled):not(.test-mode) .table,
body.theme-alt-disabled .card,
body.theme-alt-disabled .ring-tile,
body.theme-alt-disabled .ring-indicators-panel,
body.theme-alt-disabled .ring-summary-panel,
body.theme-alt-disabled .quotes-leg,
body.theme-alt-disabled .quotes-ring-metrics,
body.theme-alt-disabled .deals-row,
body.theme-alt-disabled .report-row,
body.theme-alt-disabled .scanner-row,
body.theme-alt-disabled .settings-row,
body.theme-alt-disabled .quote-ring,
body.theme-alt-disabled .quote-ring-settings,
body.theme-alt-disabled .connection-status,
body.theme-alt-disabled .connection-block,
body.theme-alt-disabled .chart-wrap,
body.theme-alt-disabled .table,
body.test-mode .card,
body.test-mode .ring-tile,
body.test-mode .ring-indicators-panel,
body.test-mode .ring-summary-panel,
body.test-mode .quotes-leg,
body.test-mode .quotes-ring-metrics,
body.test-mode .deals-row,
body.test-mode .report-row,
body.test-mode .scanner-row,
body.test-mode .settings-row,
body.test-mode .quote-ring,
body.test-mode .quote-ring-settings,
body.test-mode .connection-status,
body.test-mode .connection-block,
body.test-mode .chart-wrap,
body.test-mode .table {
  border-radius: 18px !important;
}

/* Dark mode: darken ring-card tile surfaces only. */
body.test-mode #dashboard-panel .ring-card .ring-tile,
body.test-mode #dashboard-panel .ring-card .ring-indicators-panel,
body.test-mode #dashboard-panel .ring-card .ring-summary-panel,
body.test-mode #dashboard-panel .ring-card-dual .ring-tile,
body.test-mode #dashboard-panel .ring-card-dual .ring-indicators-panel,
body.test-mode #dashboard-panel .ring-card-dual .ring-summary-panel {
  background: rgba(22, 30, 44, 0.97) !important;
  border-color: rgba(132, 149, 176, 0.24) !important;
}

/* Dark mode: darken scanner signal list rows. */
body.test-mode #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(24, 33, 48, 0.97) !important;
  border-color: rgba(140, 156, 182, 0.26) !important;
}

body.test-mode #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(19, 27, 41, 0.98) !important;
  border-color: rgba(140, 156, 182, 0.3) !important;
}

/* Accounts card: make column headers clearly bold in all modes. */
#accounts-panel .accounts-table th {
  font-weight: 700 !important;
}

#accounts-panel .report-table.accounts .report-row.report-head > div {
  font-weight: 700 !important;
}

#scanner-panel .scanner-row.scanner-head > div {
  font-weight: 700 !important;
}

#settings-panel .settings-quotes-card .quotes-head > div {
  font-weight: 700 !important;
}

#reports-panel .report-table.daily .report-row.report-head > div {
  font-weight: 700 !important;
}

#reports-panel #report-panel-orders .report-table .report-row.report-head > div,
#reports-panel #report-panel-deals .report-table .report-row.report-head > div {
  font-weight: 700 !important;
}

/* Keep all table-like surfaces square (no rounded corners). */
body .table-card,
body .deals-table,
body .deals-row,
body .deals-details,
body .deals-detail-list,
body .deals-detail-row,
body .table-head-deals,
body .report-table,
body .report-row,
body .report-deals-details,
body .report-deal-table,
body .report-deal-table thead,
body .report-deal-table tbody,
body .report-deal-table tr,
body .report-deal-table th,
body .report-deal-table td,
body .accounts-table,
body .accounts-table thead,
body .accounts-table tbody,
body .accounts-table tr,
body .accounts-table th,
body .accounts-table td,
body .scanner-row,
body .scanner-table,
body .scanner-signals,
body .scanner-signal,
body .scanner-signal-head,
body .quotes-table,
body .settings-quotes-card .quotes-table {
  border-radius: 0 !important;
}

body .report-row > div,
body .deals-row > div,
body .deals-detail-row > div,
body .deals-detail-head > div,
body .scanner-row > div,
body .scanner-signal > div,
body .table-row > div,
body .accounts-table tr > th,
body .accounts-table tr > td,
body .report-deal-table tr > th,
body .report-deal-table tr > td {
  border-radius: 0 !important;
}

/* Absolute no-radius enforcement for table sections (beats mode/id-specific rules). */
#dashboard-panel .table-card,
#dashboard-panel .deals-table,
#dashboard-panel .deals-row,
#dashboard-panel .deals-row > div,
#dashboard-panel .deals-details,
#dashboard-panel .deals-detail-list,
#dashboard-panel .deals-detail-row,
#dashboard-panel .deals-detail-row > div,
#dashboard-panel .deals-detail-head,
#dashboard-panel .deals-detail-head > div,
#dashboard-panel .table-head-deals,
#scanner-panel .scanner-table,
#scanner-panel .scanner-row,
#scanner-panel .scanner-row > div,
#scanner-panel .scanner-signals,
#scanner-panel .scanner-signal,
#scanner-panel .scanner-signal > div,
#scanner-panel .scanner-signal-head,
#reports-panel .report-table,
#reports-panel .report-row,
#reports-panel .report-row > div,
#reports-panel .report-deals-details,
#reports-panel .report-deal-table,
#reports-panel .report-deal-table thead,
#reports-panel .report-deal-table tbody,
#reports-panel .report-deal-table tr,
#reports-panel .report-deal-table th,
#reports-panel .report-deal-table td,
#accounts-panel .accounts-table,
#accounts-panel .accounts-table thead,
#accounts-panel .accounts-table tbody,
#accounts-panel .accounts-table tr,
#accounts-panel .accounts-table th,
#accounts-panel .accounts-table td {
  border-radius: 0 !important;
}

/* Accounts tab only: force square row corners (header + body). */
#accounts-panel .report-table.accounts .report-row,
#accounts-panel .report-table.accounts .report-row > div,
#accounts-panel .report-table.accounts .report-row > div:first-child,
#accounts-panel .report-table.accounts .report-row > div:last-child,
#accounts-panel .accounts-table tbody tr,
#accounts-panel .accounts-table tbody tr > td,
#accounts-panel .accounts-table thead tr,
#accounts-panel .accounts-table thead tr > th {
  border-radius: 0 !important;
}

/* Scanner signal list typography update. */
#scanner-panel .scanner-signal,
#scanner-panel .scanner-signal-head {
  font-family: var(--sans) !important;
  font-style: normal !important;
}

/* Darker headers for Daily PnL, Order history, Deal history tables. */
#reports-panel #reports-daily-table .report-row.report-head,
#reports-panel #reports-closed-table .report-row.report-head,
#reports-panel #reports-deals-table .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #reports-panel #reports-daily-table .report-row.report-head,
body.test-mode #reports-panel #reports-closed-table .report-row.report-head,
body.test-mode #reports-panel #reports-deals-table .report-row.report-head {
  background: rgba(22, 31, 45, 0.98) !important;
}

body.theme-alt-disabled #reports-panel #reports-daily-table .report-row.report-head,
body.theme-alt-disabled #reports-panel #reports-closed-table .report-row.report-head,
body.theme-alt-disabled #reports-panel #reports-deals-table .report-row.report-head {
  background: rgba(218, 226, 237, 0.98) !important;
}

body.theme-alt-disabled.test-mode #reports-panel #reports-daily-table .report-row.report-head,
body.theme-alt-disabled.test-mode #reports-panel #reports-closed-table .report-row.report-head,
body.theme-alt-disabled.test-mode #reports-panel #reports-deals-table .report-row.report-head {
  background: rgba(210, 220, 233, 0.98) !important;
}

/* Audit table header row: match themed report-table header tone. */
body.test-mode #report-panel-audit .report-table.audit .report-row.report-head,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-audit .report-table.audit .report-row.report-head {
  background: rgba(22, 31, 45, 0.98) !important;
}

body.theme-alt-disabled #report-panel-audit .report-table.audit .report-row.report-head {
  background: rgba(218, 226, 237, 0.98) !important;
}

body.theme-alt-disabled.test-mode #report-panel-audit .report-table.audit .report-row.report-head {
  background: rgba(210, 220, 233, 0.98) !important;
}

/* Reports card: round only the outer table container corners (rows stay square). */
#reports-panel #reports-daily-table,
#reports-panel #reports-closed-table,
#reports-panel #reports-deals-table {
  border-radius: 12px !important;
  overflow: hidden !important;
}

#reports-panel #reports-closed-table .report-row.is-empty,
#reports-panel #reports-deals-table .report-row.is-empty,
#report-panel-audit .report-table.audit .report-row.is-empty {
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  align-items: center !important;
  text-align: center !important;
}

#reports-panel #reports-closed-table .report-row.is-empty > div,
#reports-panel #reports-deals-table .report-row.is-empty > div,
#report-panel-audit .report-table.audit .report-row.is-empty > div {
  transform: none !important;
  justify-content: center !important;
  text-align: center !important;
}

#reports-panel #reports-audit-table,
#reports-panel #reports-audit-slippage-table {
  border-radius: 11px !important;
  display: block !important;
  max-height: min(520px, 62vh) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-gutter: stable !important;
  scrollbar-color: rgba(77, 213, 255, 0.35) rgba(10, 12, 30, 0.6) !important;
  scrollbar-width: thin !important;
}

#reports-panel #reports-audit-table::-webkit-scrollbar,
#reports-panel #reports-audit-slippage-table::-webkit-scrollbar {
  width: 8px;
}

#reports-panel #reports-audit-table::-webkit-scrollbar-track,
#reports-panel #reports-audit-slippage-table::-webkit-scrollbar-track {
  background: rgba(10, 12, 30, 0.6);
  border-radius: 999px;
}

#reports-panel #reports-audit-table::-webkit-scrollbar-thumb,
#reports-panel #reports-audit-slippage-table::-webkit-scrollbar-thumb {
  background: rgba(77, 213, 255, 0.35);
  border-radius: 999px;
  border: 2px solid rgba(10, 12, 30, 0.6);
}

#reports-panel #reports-audit-table[hidden],
#reports-panel #reports-audit-slippage-table[hidden],
#report-panel-audit .report-table[hidden] {
  display: none !important;
}

#report-panel-audit .report-table.audit .report-row.report-head {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
}

#report-panel-audit .report-table.audit .report-row.report-head > div {
  background: inherit !important;
}

#reports-panel #reports-daily-table {
  border-radius: 11px !important;
}

/* Deals card: restore only outer container rounding (keep inner rows/cells square). */
#dashboard-panel .table-card {
  border-radius: 18px !important;
  overflow: hidden !important;
}
#dashboard-panel .table-card .table {
  border-radius: 11px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Quotes table: keep only outer 4 corners rounded; inner rows/cells stay square. */
#dashboard-panel .quotes-table {
  border-radius: 12px !important;
  overflow: hidden !important;
}

/* Settings > Quotes table: outer 4 corners rounded. */
#settings-panel .settings-quotes-card .quotes-table {
  border-radius: 12px !important;
  overflow: hidden !important;
}

/* Sim balance input: reduce field height by ~3px (settings only). */
#settings-panel .simulator-reset-row .input-prefix {
  height: 29px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

#settings-panel #sim-balance-default {
  height: 23px !important;
  line-height: 23px !important;
}

/* Closed deals detail list: match scanner details dark palette. */
body.test-mode #dashboard-panel .deals-details.is-closed {
  background: rgba(8, 10, 22, 0.6) !important;
}

body.test-mode #dashboard-panel .deals-details.is-closed .deals-detail-head {
  background: rgba(14, 21, 33, 0.88) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.test-mode #dashboard-panel .deals-details.is-closed .deals-detail-row {
  background: rgba(20, 28, 42, 0.9) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

/* alternate mode: show visible outer corners on Accounts tab table container. */
body.theme-alt-disabled #accounts-panel .report-table.accounts {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(120, 128, 146, 0.28) !important;
  background: rgba(236, 242, 250, 0.98) !important;
}

body.theme-alt-disabled #accounts-panel .accounts-list,
body.theme-alt-disabled.test-mode #accounts-panel .accounts-list {
  border-radius: 12px !important;
  overflow: visible !important;
}

body.theme-alt-disabled #accounts-panel .report-table.accounts,
body.theme-alt-disabled.test-mode #accounts-panel .report-table.accounts {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(120, 128, 146, 0.28) !important;
}

/* alternate mode: lighten scanner details signal list backgrounds. */
body.theme-alt-disabled #scanner-panel .scanner-signals .scanner-signal {
  background: rgba(245, 249, 253, 0.99) !important;
  border-color: rgba(120, 128, 146, 0.2) !important;
}

body.theme-alt-disabled #scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  background: rgba(236, 243, 251, 0.99) !important;
  border-color: rgba(120, 128, 146, 0.24) !important;
}

/* alternate mode: ring setup quote cells (Ring/Exchange/Symbol...) match lighter scanner-detail tone. */
body.theme-alt-disabled #settings-quotes-body .quotes-cell,
body.theme-alt-disabled #settings-quotes-body .quote-config-span,
body.theme-alt-disabled #settings-quotes-body .quote-config-span .quote-input,
body.theme-alt-disabled #settings-panel .quote-config-readonly .quote-config-value {
  background: rgba(245, 249, 253, 0.99) !important;
  border-color: rgba(120, 128, 146, 0.2) !important;
}

/* Scanner table: round only outer container corners (rows remain square). */
#scanner-panel .scanner-table {
  border-radius: 12px !important;
  overflow: hidden !important;
}

/* Dark mode: scanner header row matches deals-card header tone. */
body.test-mode #scanner-panel .scanner-row.scanner-head {
  background: rgba(22, 31, 45, 0.98) !important;
}

/* Accounts console: always match selected color mode. */
body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-list,
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts {
  background: rgba(236, 242, 250, 0.98) !important;
  border-color: rgba(120, 128, 146, 0.28) !important;
}

body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(221, 230, 242, 0.99) !important;
}

body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(245, 249, 253, 0.99) !important;
}

body.test-mode #accounts-panel .accounts-list,
body.test-mode #accounts-panel .report-table.accounts {
  background: rgba(24, 33, 48, 0.9) !important;
  border-color: rgba(146, 162, 186, 0.24) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(22, 31, 45, 0.98) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(31, 41, 58, 0.95) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-list,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(17, 24, 37, 0.9) !important;
}

/* Accounts tab: keep only the outer table container corners rounded in all modes. */
#accounts-panel .report-table.accounts {
  border-radius: 12px !important;
  overflow: hidden !important;
}

/* Border weight tune: avoid double-thick outer borders (container + inner table). */
#accounts-panel .accounts-list {
  border-width: 1px !important;
}

#accounts-panel .accounts-list .report-table.accounts {
  border-width: 0 !important;
}

#settings-panel .connection-log-list {
  border-width: 0 !important;
  border: 0 !important;
  border-color: transparent !important;
}

/* Connection logs tile: no drop shadow. */
#settings-panel .connection-logs.card,
#settings-panel .connection-logs.connections-card {
  box-shadow: none !important;
}

/* Accounts tab: blend table borders/dividers into background. */
body.test-mode #accounts-panel .accounts-list,
body.test-mode #accounts-panel .report-table.accounts {
  border-color: transparent !important;
}

body.test-mode #accounts-panel .accounts-table th,
body.test-mode #accounts-panel .accounts-table td,
body.test-mode #accounts-panel .report-table.accounts .report-row > div {
  border-bottom: none !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-list,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts {
  border-color: transparent !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-table th,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-table td,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row > div {
  border-bottom: none !important;
}

body.theme-alt-disabled #accounts-panel .accounts-list,
body.theme-alt-disabled #accounts-panel .report-table.accounts {
  border-color: rgba(230, 237, 246, 0.9) !important;
}

body.theme-alt-disabled #accounts-panel .accounts-table th,
body.theme-alt-disabled #accounts-panel .accounts-table td,
body.theme-alt-disabled #accounts-panel .report-table.accounts .report-row > div {
  border-bottom-color: rgba(230, 237, 246, 0.9) !important;
}

#settings-panel .connection-log-list .connection-logs-table {
  border-width: 0 !important;
}

/* Settings: add bottom breathing room under connection logs table (match deals card padding). */
#settings-panel .connection-log-list {
  padding-bottom: 8px !important;
}

/* Connection logs empty-state cell should match connection-log-list background exactly. */
#settings-panel .connection-log-list .connection-logs-table,
#settings-panel .connection-log-list .connection-log-empty td {
  background: inherit !important;
}

/* Quotes ring legs: increase inner tile padding (all modes). */
#dashboard-panel .quotes-ring-legs > .quotes-leg,
#dashboard-panel .quotes-ring-legs > .quotes-ring-metrics {
  padding: 9px !important;
}

/* Final override: ring card container padding +2px. */
#dashboard-panel .quotes-ring {
  padding: 16px !important;
  border: 0 !important;
  border-color: transparent !important;
}

/* Final hard override: sim balance field height in settings (-3px). */
#settings-panel .simulator-reset-row .input-prefix {
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex: 0 0 112px !important;
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;
  margin-left: -10px !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

#settings-panel #sim-balance-default {
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  line-height: 18px !important;
  padding-top: 1px !important;
  padding-bottom: 0 !important;
}

/* Ring setup edit icon: darker when the button is highlighted. */
#settings-panel .settings-quotes-card #quote-edit-toggle:hover .edit-icon-ico,
#settings-panel .settings-quotes-card #quote-edit-toggle:focus-visible .edit-icon-ico,
#settings-panel .settings-quotes-card #quote-edit-toggle:active .edit-icon-ico {
  filter: brightness(0) saturate(100%) !important;
  opacity: 0.82 !important;
}

/* Ring setup edit icon button: match Analytics Reset shadow spec. */
#settings-panel .settings-quotes-card #quote-edit-toggle,
#settings-panel .settings-quotes-card #quote-edit-toggle:hover,
#settings-panel .settings-quotes-card #quote-edit-toggle:focus-visible,
#settings-panel .settings-quotes-card #quote-edit-toggle:active {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

/* FINAL size override: Rings minimize/expand icon button */
#dashboard-panel #quotes-minimize-toggle.quotes-minimize-btn {
  padding: 0 4px !important;
  min-height: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
  min-width: 20px !important;
  width: 20px !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#dashboard-panel .quotes-ring-collapse-tile .quotes-minimize-btn,
#dashboard-panel .quotes-mini-ring-head .quotes-minimize-btn {
  padding: 0 4px !important;
  min-height: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
  min-width: 20px !important;
  width: 20px !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Final hard-size override: all quotes minimize buttons must match. */
#dashboard-panel .quotes-minimize-btn {
  padding: 0 4px !important;
  min-height: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
  min-width: 20px !important;
  width: 20px !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Collapse buttons: flat style (remove glossy/gradient effects). */
#dashboard-panel .quotes-minimize-btn,
#dashboard-panel .quotes-minimize-btn:hover,
#dashboard-panel .quotes-minimize-btn:focus-visible,
#dashboard-panel .quotes-minimize-btn:active {
  background: rgba(10, 12, 30, 0.5) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  color: var(--text) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-minimize-btn,
body.theme-alt-disabled #dashboard-panel .quotes-minimize-btn:hover,
body.theme-alt-disabled #dashboard-panel .quotes-minimize-btn:focus-visible,
body.theme-alt-disabled #dashboard-panel .quotes-minimize-btn:active {
  background: rgba(246, 250, 255, 0.94) !important;
  border: 1px solid rgba(120, 128, 146, 0.24) !important;
  box-shadow: none !important;
  color: #2f3a4d !important;
}

/* Ring card symmetry: avoid right-side extra space from width/margin hacks. */
#dashboard-panel .ring-card .ring-tile,
#dashboard-panel .ring-card .ring-indicators-panel,
#dashboard-panel .ring-card .ring-summary-panel {
  width: 100% !important;
  margin-left: 0 !important;
  box-sizing: border-box !important;
}

/* Ring dual card: increase indicator/summary tile height by 2px total. */
#dashboard-panel .ring-card-dual .ring-indicators-panel,
#dashboard-panel .ring-card-dual .ring-summary-panel {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

#dashboard-panel .quotes-minimize-btn[data-tip] {
  position: relative;
}

#dashboard-panel .quotes-minimize-btn[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 6px);
  transform: translateX(-50%);
  background: rgba(10, 12, 30, 0.96);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 3px 6px;
  font-family: var(--sans);
  font-size: 10px;
  letter-spacing: 0.04em;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  z-index: 60;
  transition: opacity 0.12s ease;
}

#dashboard-panel .quotes-minimize-btn[data-tip]:hover::after,
#dashboard-panel .quotes-minimize-btn[data-tip]:focus-visible::after {
  opacity: 1;
}

/* Per-ring collapse buttons: no hover highlight. */
#dashboard-panel .quotes-ring-title .quotes-minimize-btn:hover,
#dashboard-panel .quotes-ring-title .quotes-minimize-btn:focus-visible,
#dashboard-panel .quotes-ring-title .quotes-minimize-btn:active,
#dashboard-panel .quotes-ring-minimized-shell .quotes-minimize-btn:hover,
#dashboard-panel .quotes-ring-minimized-shell .quotes-minimize-btn:focus-visible,
#dashboard-panel .quotes-ring-minimized-shell .quotes-minimize-btn:active {
  background: transparent !important;
  box-shadow: none !important;
}

/* FINAL override: settings-card tab buttons must not highlight on hover/focus. */
body:not(.theme-alt-disabled) #settings-panel .settings-card .toggle-group .toggle-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .settings-card .toggle-group .toggle-btn:focus-visible:not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body:not(.theme-alt-disabled) #settings-panel .settings-card .toggle-group .toggle-btn.is-active:hover:not(:disabled),
body:not(.theme-alt-disabled) #settings-panel .settings-card .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 180, 84, 0.2), rgba(255, 180, 84, 0.1)) !important;
  border-color: var(--border) !important;
  color: rgba(255, 180, 84, 0.98) !important;
  box-shadow: none !important;
}

/* Final override: tighter corner radius for quotes leg tiles only. */
#dashboard-panel .quotes-ring-legs > .quotes-leg,
#dashboard-panel .quotes-leg-grid .quotes-leg {
  border-radius: 10px !important;
}

#dashboard-panel .quotes-ring-legs .quotes-depth-book-cell {
  border-radius: 4px !important;
}

body.theme-alt-disabled #settings-panel .settings-card .toggle-group .toggle-btn:hover:not(:disabled),
body.theme-alt-disabled #settings-panel .settings-card .toggle-group .toggle-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.theme-alt-disabled #settings-panel .settings-card .toggle-group .toggle-btn.is-active:hover:not(:disabled),
body.theme-alt-disabled #settings-panel .settings-card .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

/* Final override: make P-Spread/Open PnL badge text smaller. */
#dashboard-panel .quotes-ring-inline-metric {
  font-size: 10px !important;
  line-height: 1.15 !important;
}

/* Final override: minimized view should not render an extra outer ring tile. */
body:not(.theme-alt-disabled) #dashboard-panel .quotes-ring.is-minimized {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#dashboard-panel .quotes-ring.is-minimized {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Apply former outer-tile tone to attached minimized tiles. */
body:not(.theme-alt-disabled) #dashboard-panel .quotes-ring.is-minimized .quotes-mini-item {
  background: #161e2cf7 !important;
}


/* Deals card header row background: match ring card leg row surfaces by mode. */
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .table-head.table-head-positions,
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .deals-row.deals-head {
  background: #161e2cf7 !important;
}

body.test-mode #dashboard-panel .table-head.table-head-positions,
body.test-mode #dashboard-panel .deals-row.deals-head {
  background: #161e2cf7 !important;
}

/* Non-alternate modes: only exchange + pair text match deals header text tone. */
body:not(.theme-alt-disabled) #dashboard-panel .quotes-leg .quotes-exchange,
body:not(.theme-alt-disabled) #dashboard-panel .quotes-leg .quotes-symbol {
  color: #8b97ab !important;
}

body.theme-alt-disabled #dashboard-panel .table-head.table-head-positions,
body.theme-alt-disabled #dashboard-panel .deals-row.deals-head {
  background: rgba(245, 249, 253, 0.99) !important;
}

/* Dark mode: quote cells + API config inputs use same tone as deals header row. */
body.test-mode #settings-quotes-body .quotes-cell,
body.test-mode #settings-quotes-body .quote-config-span,
body.test-mode #settings-quotes-body .quote-config-span .quote-input,
body.test-mode #settings-panel .quote-ring-settings select,
body.test-mode #settings-panel .quote-ring-settings input,
body.test-mode #settings-panel .quote-ring-settings .quote-input,
body.test-mode #settings-panel .quote-config-readonly .quote-config-value,
body.test-mode #settings-panel #api-config-card .connection-block input,
body.test-mode #settings-panel #api-config-card .connection-block select,
body.test-mode #settings-panel #api-config-card .api-exchange-static .api-exchange-value {
  background: rgba(24, 32, 48, 0.78) !important;
}

/* Sidebar nav: blue text highlight only (no bg/underline/border glow). */
/* Minimized sidebar: selected tab highlights icon only. */
.app-shell.is-collapsed .sidebar-nav .tab-btn.is-active {
  color: var(--muted) !important;
  background: rgba(10, 12, 30, 0.36) !important;
  border-color: rgba(120, 140, 200, 0.24) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.theme-alt-disabled .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active {
  color: #5a6a83 !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.24) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88), 0 1px 5px rgba(0, 0, 0, 0.08) !important;
}

.app-shell.is-collapsed .sidebar-nav .tab-btn.is-active .tab-icon,
.app-shell.is-collapsed .sidebar-nav .tab-btn.is-active .tab-icon svg {
  color: #4dd5ff !important;
  stroke: #4dd5ff !important;
}

/* FINAL: force bid/ask price tiles to requested background across all modes. */
body.test-mode #dashboard-panel .quotes-leg .quotes-price > span.is-bid,
body.test-mode #dashboard-panel .quotes-leg .quotes-price > span.is-ask,
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-price > span.is-bid,
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-price > span.is-ask,
body.theme-alt-disabled #dashboard-panel .quotes-leg .quotes-price > span.is-bid,
body.theme-alt-disabled #dashboard-panel .quotes-leg .quotes-price > span.is-ask {
  background: #141d2ceb !important;
}

/* FINAL: Accounts tab grid uses single borders with 1px cell spacing. */
#accounts-panel .report-table.accounts {
  border-collapse: separate !important;
  border-spacing: 0 1px !important;
}

#accounts-panel .report-table.accounts .report-row {
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}

#accounts-panel .report-table.accounts .report-row > div {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

#accounts-panel .report-table.accounts .report-row > div + div {
  border-left: 1px solid transparent !important;
  background-clip: padding-box !important;
}

/* FINAL HARD OVERRIDE: quotes bid/ask display span background. */
body.test-mode #dashboard-panel .quotes-leg .quotes-price > span,
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-price > span {
  background: #141d2ceb !important;
}

/* FINAL: connection logs outer card radius matches settings cards. */
#settings-panel .connection-logs.card,
#settings-panel .connection-logs.connections-card {
  box-shadow: none !important;
  border-radius: 18px !important;
}

/* Keep inner connection logs wrappers at existing tighter radius. */
#settings-panel .connection-log-list,
#settings-panel .connection-log-list .connection-logs-table {
  box-shadow: none !important;
  border-radius: 10px !important;
}

/* FINAL: center-fit settings card tab labels. */
#settings-panel .settings-card .toggle-group .toggle-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
}

/* FINAL: quotes table bid/ask tile background. */
#dashboard-panel .quotes-leg .quotes-price > span.is-bid,
#dashboard-panel .quotes-leg .quotes-price > span.is-ask {
  background: #141d2ceb !important;
}

/* Settings > Ring setup leg-row dropdowns: minimal pastel styling, lighter borders. */
#settings-panel .quote-ring-settings .quote-config-row .quote-select {
  -webkit-appearance: none !important;
  appearance: none !important;
  border-width: 0 !important;
  border-style: solid !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  outline: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23a9b8d4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 6px !important;
  padding: 5px 24px 5px 8px !important;
}

body.test-mode #settings-panel .quote-ring-settings .quote-config-row .quote-select {
  background-color: #161e2cf7 !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .quote-ring-settings .quote-config-row .quote-select {
  background-color: #161e2cf7 !important;
  border-color: rgba(136, 150, 176, 0.08) !important;
  color: var(--text) !important;
}

body.theme-alt-disabled #settings-panel .quote-ring-settings .quote-config-row .quote-select {
  background-color: rgba(246, 250, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
}

body.test-mode #settings-panel .quote-ring-settings .quote-config-row .quote-select option {
  background: #263246 !important;
  color: #d2d9e6 !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .quote-ring-settings .quote-config-row .quote-select option {
  background: #1d293e !important;
  color: #c9d4e8 !important;
}

body.theme-alt-disabled #settings-panel .quote-ring-settings .quote-config-row .quote-select option {
  background: #f4f8fd !important;
  color: #2f3a4d !important;
}

/* Apply the same minimal dropdown style to top ring leg selectors (Leg 1/2/3). */
#settings-panel .ring-config select,
#settings-panel #leg1-select,
#settings-panel #leg2-select,
#settings-panel #leg3-select {
  -webkit-appearance: none !important;
  appearance: none !important;
  border-width: 0 !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  outline: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23a9b8d4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 6px !important;
  padding: 5px 24px 5px 8px !important;
}

body.test-mode #settings-panel .ring-config select,
body.test-mode #settings-panel #leg1-select,
body.test-mode #settings-panel #leg2-select,
body.test-mode #settings-panel #leg3-select {
  background-color: #161e2cf7 !important;
  border-color: rgba(156, 171, 196, 0.24) !important;
  color: var(--text) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .ring-config select,
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel #leg1-select,
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel #leg2-select,
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel #leg3-select {
  background-color: #161e2cf7 !important;
  border-color: rgba(136, 150, 176, 0.08) !important;
  color: var(--text) !important;
}

body.theme-alt-disabled #settings-panel .ring-config select,
body.theme-alt-disabled #settings-panel #leg1-select,
body.theme-alt-disabled #settings-panel #leg2-select,
body.theme-alt-disabled #settings-panel #leg3-select {
  background-color: rgba(246, 250, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
}

/* FINAL: leg-row dropdowns should look minimal (almost borderless). */
#settings-panel .ring-config select,
#settings-panel #leg1-select,
#settings-panel #leg2-select,
#settings-panel #leg3-select,
#settings-panel .quote-ring-settings .quote-config-row .quote-select {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

#settings-panel .ring-config select:focus,
#settings-panel #leg1-select:focus,
#settings-panel #leg2-select:focus,
#settings-panel #leg3-select:focus,
#settings-panel .quote-ring-settings .quote-config-row .quote-select:focus {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

/* FINAL FINAL: actual leg-row dropdowns live under .quote-ring-body. */
#settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select {
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  outline: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23a9b8d4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 6px !important;
  padding: 5px 24px 5px 8px !important;
}

body.test-mode #settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select {
  background-color: #161e2cf7 !important;
  color: var(--text) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select {
  background-color: #161e2cf7 !important;
  color: var(--text) !important;
}

body.theme-alt-disabled #settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select {
  background-color: rgba(246, 250, 255, 0.96) !important;
  color: #2f3a4d !important;
}

/* Ring setup cells: borderless surfaces. */
#settings-panel #settings-quotes-body .quotes-cell,
#settings-panel #settings-quotes-body .quote-config-span,
#settings-panel #settings-quotes-body .quote-config-span .quote-input,
#settings-panel .quote-ring-settings,
#settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select,
#settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-input {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Expanded depth cards (quotes leg): minimal pastel look with softer borders. */
body.test-mode #dashboard-panel .quotes-leg .quotes-depth-table {
  background: rgba(18, 26, 40, 0.9) !important;
  border-color: rgba(146, 162, 186, 0.12) !important;
}

body.test-mode #dashboard-panel .quotes-leg .quotes-price > span {
  background: #141d2ceb !important;
}

body.test-mode #dashboard-panel .quotes-leg .quotes-depth-book-cell {
  background: rgba(20, 29, 44, 0.92) !important;
  border-color: rgba(146, 162, 186, 0.1) !important;
}

/* FINAL: quotes leg tile background update. */
body.test-mode #dashboard-panel .quotes-ring-legs > .quotes-leg,
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-ring-legs > .quotes-leg {
  background: #121a28e6 !important;
}

/* FINAL: force bid/ask tiles background color. */
body.test-mode #dashboard-panel .quotes-leg .quotes-price > span.is-bid,
body.test-mode #dashboard-panel .quotes-leg .quotes-price > span.is-ask,
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-price > span.is-bid,
body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-price > span.is-ask {
  background: #141d2ceb !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-depth-table {
  background: rgba(12, 18, 32, 0.92) !important;
  border-color: rgba(136, 150, 176, 0.1) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-price > span {
  background: #141d2ceb !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #dashboard-panel .quotes-leg .quotes-depth-book-cell {
  background: rgba(14, 20, 36, 0.94) !important;
  border-color: rgba(136, 150, 176, 0.08) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-leg .quotes-depth-table {
  background: rgba(244, 249, 254, 0.92) !important;
  border-color: rgba(120, 128, 146, 0.14) !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-leg .quotes-depth-book-cell {
  background: rgba(249, 252, 255, 0.96) !important;
  border-color: rgba(120, 128, 146, 0.1) !important;
}

/* Ring card dual tiles: borderless. */
#dashboard-panel .ring-card-dual .ring-tile,
#dashboard-panel .ring-card-dual .ring-indicators-panel,
#dashboard-panel .ring-card-dual .ring-summary-panel {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}

/* Quotes ring toggle bar: remove all shadow/glow effects. */
#dashboard-panel .quotes-ring-toggle {
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
  gap: 0 !important;
}

#dashboard-panel .quotes-ring-toggle-label {
  min-width: var(--quotes-toggle-status-width) !important;
  width: var(--quotes-toggle-status-width) !important;
  max-width: var(--quotes-toggle-status-width) !important;
  flex: 0 1 auto !important;
  margin-right: 3px !important;
  transform: none !important;
  white-space: nowrap !important;
}


/* Mono pills: flat background, no border, no gradient. */
#dashboard-panel .pill.mono,
.pill.mono {
  background-image: none !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body.theme-alt-disabled #dashboard-panel .pill.mono,
body.theme-alt-disabled .pill.mono {
  background-image: none !important;
  background: rgba(227, 235, 248, 0.9) !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body.test-mode #dashboard-panel .pill.mono,
body.test-mode .pill.mono {
  background-image: none !important;
  background: rgba(53, 65, 86, 0.9) !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Analytics path pill: match ring selector height. */
#dashboard-panel #path.pill.mono {
  height: 21px !important;
  min-height: 21px !important;
  max-height: 21px !important;
  line-height: 21px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

/* Scanner signal details: borderless list/container. */
#scanner-panel .scanner-details,
#scanner-panel .scanner-signals,
#scanner-panel .scanner-signal,
#scanner-panel .scanner-signal.scanner-signal-head,
#scanner-panel .scanner-signal > div {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Scanner detailed signal view: cap height and keep the list scrollable. */
#scanner-panel .scanner-signals {
  position: relative !important;
  max-height: 340px !important;
  overflow-y: auto !important;
}

/* Keep scanner details header pinned while rows scroll. */
#scanner-panel .scanner-signals .scanner-signal.scanner-signal-head {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
}

/* Reports deals detail view: mirror scanner detail-view colors and border style. */
#reports-panel #report-panel-deals .report-deals-details,
#reports-panel #report-panel-deals .report-deal-table,
#reports-panel #report-panel-deals .report-deal-table thead,
#reports-panel #report-panel-deals .report-deal-table tbody,
#reports-panel #report-panel-deals .report-deal-table tr,
#reports-panel #report-panel-deals .report-deal-table th,
#reports-panel #report-panel-deals .report-deal-table td {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Reports deals detail table: fit columns to content width. */
#reports-panel #report-panel-deals .report-deals-details {
  overflow-x: auto !important;
}

#reports-panel #report-panel-deals .report-deal-table {
  width: max-content !important;
  min-width: 100% !important;
  table-layout: auto !important;
}

#reports-panel #report-panel-deals .report-deal-table th,
#reports-panel #report-panel-deals .report-deal-table td {
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-deals .report-deals-details,
body.test-mode #reports-panel #report-panel-deals .report-deals-details {
  background: rgba(29, 38, 53, 0.95) !important;
  border-top: 1px solid rgba(146, 162, 186, 0.2) !important;
  padding: 10px 14px 12px !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-deals .report-deal-table tbody tr,
body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-deals .report-deal-table tbody td,
body.test-mode #reports-panel #report-panel-deals .report-deal-table tbody tr,
body.test-mode #reports-panel #report-panel-deals .report-deal-table tbody td {
  background: rgba(24, 33, 48, 0.97) !important;
  color: #d2d9e6 !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-deals .report-deal-table thead tr,
body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-deals .report-deal-table thead th,
body.test-mode #reports-panel #report-panel-deals .report-deal-table thead tr,
body.test-mode #reports-panel #report-panel-deals .report-deal-table thead th {
  background: rgba(19, 27, 41, 0.98) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #reports-panel #report-panel-deals .report-deals-details {
  background: rgba(236, 242, 250, 0.98) !important;
  border-top: 1px solid rgba(120, 128, 146, 0.2) !important;
}

body.theme-alt-disabled #reports-panel #report-panel-deals .report-deal-table tbody tr,
body.theme-alt-disabled #reports-panel #report-panel-deals .report-deal-table tbody td {
  background: rgba(245, 249, 253, 0.99) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #reports-panel #report-panel-deals .report-deal-table thead tr,
body.theme-alt-disabled #reports-panel #report-panel-deals .report-deal-table thead th {
  background: rgba(236, 243, 251, 0.99) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-deals .report-deals-details {
  background: rgba(224, 231, 241, 0.98) !important;
  border-top: 1px solid rgba(126, 136, 152, 0.2) !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-deals .report-deal-table tbody tr,
body.theme-alt-disabled.test-mode #reports-panel #report-panel-deals .report-deal-table tbody td {
  background: rgba(233, 239, 247, 0.98) !important;
  color: #3c475c !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-deals .report-deal-table thead tr,
body.theme-alt-disabled.test-mode #reports-panel #report-panel-deals .report-deal-table thead th {
  background: rgba(221, 229, 240, 0.98) !important;
  color: #3c475c !important;
}

/* Reports audit slippage detail view: match closed deals detail table colors. */
#reports-panel #report-panel-audit .audit-slippage-detail-wrap,
#reports-panel #report-panel-audit .audit-slippage-section,
#reports-panel #report-panel-audit .audit-slippage-detail-table,
#reports-panel #report-panel-audit .audit-slippage-detail-table thead,
#reports-panel #report-panel-audit .audit-slippage-detail-table tbody,
#reports-panel #report-panel-audit .audit-slippage-detail-table tr,
#reports-panel #report-panel-audit .audit-slippage-detail-table th,
#reports-panel #report-panel-audit .audit-slippage-detail-table td {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-audit .audit-slippage-detail-wrap,
body.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-wrap {
  background: rgba(29, 38, 53, 0.95) !important;
  border-top: 1px solid rgba(146, 162, 186, 0.2) !important;
  padding: 0 !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-audit .audit-slippage-detail-table tbody tr,
body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-audit .audit-slippage-detail-table tbody td,
body.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table tbody tr,
body.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table tbody td {
  background: rgba(24, 33, 48, 0.97) !important;
  color: #d2d9e6 !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-audit .audit-slippage-detail-table thead tr,
body:not(.theme-alt-disabled):not(.test-mode) #reports-panel #report-panel-audit .audit-slippage-detail-table thead th,
body.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table thead tr,
body.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table thead th {
  background: rgba(19, 27, 41, 0.98) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #reports-panel #report-panel-audit .audit-slippage-detail-wrap {
  background: rgba(236, 242, 250, 0.98) !important;
  border-top: 1px solid rgba(120, 128, 146, 0.2) !important;
  padding: 0 !important;
}

body.theme-alt-disabled #reports-panel #report-panel-audit .audit-slippage-detail-table tbody tr,
body.theme-alt-disabled #reports-panel #report-panel-audit .audit-slippage-detail-table tbody td {
  background: rgba(245, 249, 253, 0.99) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #reports-panel #report-panel-audit .audit-slippage-detail-table thead tr,
body.theme-alt-disabled #reports-panel #report-panel-audit .audit-slippage-detail-table thead th {
  background: rgba(236, 243, 251, 0.99) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-wrap {
  background: rgba(224, 231, 241, 0.98) !important;
  border-top: 1px solid rgba(126, 136, 152, 0.2) !important;
  padding: 0 !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table tbody tr,
body.theme-alt-disabled.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table tbody td {
  background: rgba(233, 239, 247, 0.98) !important;
  color: #3c475c !important;
}

body.theme-alt-disabled.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table thead tr,
body.theme-alt-disabled.test-mode #reports-panel #report-panel-audit .audit-slippage-detail-table thead th {
  background: rgba(221, 229, 240, 0.98) !important;
  color: #3c475c !important;
}

/* Slippage detailed view: show table borders/grid lines. */
#reports-panel #report-panel-audit .audit-slippage-section,
#reports-panel #report-panel-audit .audit-slippage-detail-table {
  border: 1px solid var(--border) !important;
}

#reports-panel #report-panel-audit .audit-slippage-detail-table {
  border-collapse: collapse !important;
}

#reports-panel #report-panel-audit .audit-slippage-detail-table th,
#reports-panel #report-panel-audit .audit-slippage-detail-table td {
  border: 1px solid var(--border) !important;
}

/* Settings status pills: match quote-cell backgrounds by mode. */
body.test-mode #settings-panel .connection-status-list .status-pill.status-ok,
body.test-mode #settings-panel .connection-status-list .status-pill.status-latency {
  background: rgba(24, 32, 48, 0.78) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-status-list .status-pill.status-ok,
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-status-list .status-pill.status-latency {
  background: rgba(24, 33, 50, 0.8) !important;
}

body.theme-alt-disabled #settings-panel .connection-status-list .status-pill.status-ok,
body.theme-alt-disabled #settings-panel .connection-status-list .status-pill.status-latency {
  background: rgba(247, 251, 255, 0.92) !important;
}

/* Settings card tabs: borderless in all states. */
#settings-panel .settings-card .toggle-group .toggle-btn,
#settings-panel .settings-card .toggle-group .toggle-btn:hover:not(:disabled),
#settings-panel .settings-card .toggle-group .toggle-btn:focus-visible:not(:disabled),
#settings-panel .settings-card .toggle-group .toggle-btn.is-active,
#settings-panel .settings-card .toggle-group .toggle-btn.is-active:hover:not(:disabled),
#settings-panel .settings-card .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  border: 0 !important;
  border-color: transparent !important;
  min-height: 25px !important;
  height: 25px !important;
  line-height: 25px !important;
}

/* Global settings mode tabs (P-Diff/P-Delta, Arb mode, etc.): -1px effective height. */
#settings-panel .settings-grid-2x2 .settings-row .toggle-group .toggle-btn,
#settings-panel .settings-grid-2x2 .settings-row .toggle-group .toggle-btn:hover:not(:disabled),
#settings-panel .settings-grid-2x2 .settings-row .toggle-group .toggle-btn:focus-visible:not(:disabled),
#settings-panel .settings-grid-2x2 .settings-row .toggle-group .toggle-btn.is-active,
#settings-panel .settings-grid-2x2 .settings-row .toggle-group .toggle-btn.is-active:hover:not(:disabled),
#settings-panel .settings-grid-2x2 .settings-row .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  min-height: 23px !important;
  height: 23px !important;
  line-height: 23px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}


/* Home Analytics tabs: blend with card background. */
#dashboard-panel .chart-view-toggle .chart-btn,
#dashboard-panel .chart-view-toggle .chart-btn:hover,
#dashboard-panel .chart-view-toggle .chart-btn:focus-visible,
#dashboard-panel .chart-view-toggle .chart-btn.is-active {
  border: 0 !important;
  border-color: transparent !important;
}

#dashboard-panel .chart-view-toggle .chart-btn + .chart-btn {
  margin-left: 1px !important;
}

/* Deals card tabs: same as Analytics tabs (borderless, keep highlight, 1px separation). */
#dashboard-panel .deals-tabs .positions-tab,
#dashboard-panel .deals-tabs .positions-tab:hover,
#dashboard-panel .deals-tabs .positions-tab:focus-visible,
#dashboard-panel .deals-tabs .positions-tab.is-active {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

#dashboard-panel .deals-tabs .positions-tab + .positions-tab {
  margin-left: 1px !important;
}

/* Analytics Reset button: blue text only highlight. */
#dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:hover,
#dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:focus-visible,
body:not(.theme-alt-disabled) #dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:hover,
body:not(.theme-alt-disabled) #dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:focus-visible {
  color: #4dd5ff !important;
  background: rgba(77, 213, 255, 0.14) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body.theme-alt-disabled #dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:hover,
body.theme-alt-disabled #dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:focus-visible {
  background: rgba(77, 213, 255, 0.12) !important;
}

#dashboard-panel .chart-controls .toggle-btn.chart-reset-btn,
#dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:hover,
#dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:focus-visible,
#dashboard-panel .chart-controls .toggle-btn.chart-reset-btn:active {
  border: 0 !important;
  border-color: transparent !important;
}

/* FINAL: collapsed sidebar active tab must match non-active tab surface exactly. */
body:not(.theme-alt-disabled):not(.test-mode) .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active,
body:not(.theme-alt-disabled):not(.test-mode) .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active:hover,
body:not(.theme-alt-disabled):not(.test-mode) .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active:focus-visible {
  color: var(--muted) !important;
  background: rgba(10, 12, 30, 0.36) !important;
  border-color: rgba(120, 140, 200, 0.24) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.theme-alt-disabled:not(.test-mode) .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active,
body.theme-alt-disabled:not(.test-mode) .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active:hover,
body.theme-alt-disabled:not(.test-mode) .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active:focus-visible {
  color: #3f4e66 !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.test-mode .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active,
body.test-mode .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active:hover,
body.test-mode .app-shell.is-collapsed .sidebar-nav .tab-btn.is-active:focus-visible {
  color: #c7d1e0 !important;
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  border-color: rgba(146, 162, 186, 0.22) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

.app-shell.is-collapsed .sidebar-nav .tab-btn.is-active .tab-icon,
.app-shell.is-collapsed .sidebar-nav .tab-btn.is-active .tab-icon svg {
  color: #4dd5ff !important;
  stroke: #4dd5ff !important;
}

/* Ring setup: min/max inputs, ring/leg selects background. */
body:not(.theme-alt-disabled) #settings-panel .quote-ring-settings .quote-input,
body:not(.theme-alt-disabled) #settings-panel .quote-ring-settings select,
body:not(.theme-alt-disabled) #settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-input,
body:not(.theme-alt-disabled) #settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select,
body:not(.theme-alt-disabled) #settings-panel .ring-config select,
body:not(.theme-alt-disabled) #settings-panel #leg1-select,
body:not(.theme-alt-disabled) #settings-panel #leg2-select,
body:not(.theme-alt-disabled) #settings-panel #leg3-select,
body:not(.theme-alt-disabled) #settings-quotes-body .quote-config-span .quote-input {
  background-color: #161e2cf7 !important;
}

/* Scanner: remove outer shadows from Scan and Config buttons. */
#scanner-replay-signals,
#scanner-clear-signals,
#scanner-config-toggle {
  box-shadow: none !important;
}

/* Ring setup: inset shadows on dropdown fields. */
#settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select,
#settings-panel .quote-ring-settings .quote-config-row .quote-select,
#settings-panel .ring-config select,
#settings-panel #leg1-select,
#settings-panel #leg2-select,
#settings-panel #leg3-select {
  border: none !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.35), inset 0 0 0 1px rgba(120, 140, 200, 0.14) !important;
}

body.theme-alt-disabled #settings-panel .quote-ring .quote-ring-body .quote-config-row .quote-select,
body.theme-alt-disabled #settings-panel .quote-ring-settings .quote-config-row .quote-select,
body.theme-alt-disabled #settings-panel .ring-config select,
body.theme-alt-disabled #settings-panel #leg1-select,
body.theme-alt-disabled #settings-panel #leg2-select,
body.theme-alt-disabled #settings-panel #leg3-select {
  border: none !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15), inset 0 0 0 1px rgba(120, 128, 146, 0.18) !important;
}

/* Remove borders from connected status pills. */
.status-pill.status-ok {
  border: none !important;
}

/* FINAL: deals header stays fixed while closed/open deal rows scroll. */
#dashboard-panel .table .deals-row.deals-head {
  position: sticky !important;
  top: 0 !important;
  z-index: 4 !important;
}

#dashboard-panel .table .deals-row.deals-head > div {
  background: inherit !important;
}

/* Switch button toggle style (active renderer). */
.toggle.switch-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 19px !important;
}

.toggle.switch-button .switch-button-label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
}

.toggle.switch-button .switch-outer {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(180deg, rgba(34, 45, 66, 0.94), rgba(24, 33, 49, 0.94)) !important;
  border-radius: 4px !important;
  box-shadow: inset 0 2px 6px 0 rgba(8, 10, 20, 0.82), 0 2px 6px -3px rgba(16, 22, 34, 0.9) !important;
  border: 0.15px solid rgba(162, 182, 216, 0.18) !important;
  padding: 2px !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  -webkit-tap-highlight-color: transparent !important;
}

.toggle.switch-button .switch-outer .switch-button-input {
  opacity: 0 !important;
  appearance: none !important;
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
  z-index: 2 !important;
  cursor: pointer !important;
}

.toggle.switch-button.is-disabled .switch-outer .switch-button-input,
.toggle.switch-button .switch-outer .switch-button-input:disabled {
  cursor: not-allowed !important;
}

.toggle.switch-button .switch-outer .button {
  width: 100% !important;
  height: 100% !important;
  position: relative !important;
}

.toggle.switch-button .switch-outer .button-toggle {
  height: 13px !important;
  width: 14px !important;
  background: rgba(34, 46, 70, 0.98) !important;
  border-radius: 3px !important;
  box-shadow: inset 0 1px 2px 0 rgba(118, 140, 176, 0.1), 0 1px 4px 0 rgba(4, 6, 14, 0.55) !important;
  position: absolute !important;
  top: 0 !important;
  transform: none !important;
  z-index: 1 !important;
  transition: left 0.3s ease-in !important;
  left: 0 !important;
}

/* Settings panel only: slightly taller switch knob. */
#settings-panel .toggle.switch-button .switch-outer .button-toggle {
  height: 14px !important;
}

/* Settings panel only: increase switch body + knob by 2px x 2px. */
#settings-panel .toggle.switch-button {
  width: 42px !important;
  height: 21px !important;
}

#settings-panel .toggle.switch-button .switch-outer .button-toggle {
  width: 16px !important;
  height: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

#settings-panel .toggle.switch-button .switch-outer .switch-button-input:checked + .button .button-toggle {
  left: calc(100% - 16px) !important;
}

/* Ring setup zoom-stability: keep indicator dot vertically centered at any browser zoom. */
#settings-panel .toggle.switch-button.quote-toggle .switch-outer .button-indicator,
#settings-panel .toggle.switch-button.quote-toggle .switch-outer .switch-button-input:checked + .button .button-indicator {
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* lines-only texture */

.toggle.switch-button .switch-outer .button-indicator {
  height: 4px !important;
  width: 4px !important;
  top: calc(50% - 1px) !important;
  transform: none !important;
  border-radius: 50% !important;
  border: none !important;
  background: #ef565f !important;
  box-shadow: 0 0 6px rgba(239, 86, 95, 0.55) !important;
  box-sizing: border-box !important;
  right: 8px !important;
  left: auto !important;
  position: absolute !important;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, opacity 0.08s linear !important;
}

/* Keep OFF/ON/heartbeat indicator geometry identical. */
.toggle.switch-button .switch-outer .button-indicator,
.toggle.switch-button .switch-outer .switch-button-input:checked + .button .button-indicator,
.toggle.switch-button.quotes-switch.is-market-heartbeat .button-indicator {
  height: 4px !important;
  width: 4px !important;
  border-radius: 50% !important;
}

.toggle.switch-button .switch-outer .switch-button-input:checked + .button .button-toggle {
  left: calc(100% - 14px) !important;
}

.toggle.switch-button .switch-outer .switch-button-input:checked + .button .button-indicator {
  height: 4px !important;
  width: 4px !important;
  right: auto !important;
  left: 8px !important;
  border: none !important;
  background: #60d480 !important;
  box-shadow: 0 0 6px rgba(96, 212, 128, 0.6) !important;
}

/* Zoom-safe switch feedback: opacity only, never scale/transform. */
.toggle.switch-button .switch-outer .switch-button-input:active + .button,
.toggle.switch-button .switch-outer .switch-button-input:active + .button .button-toggle,
.toggle.switch-button .switch-outer .switch-button-input:active + .button .button-indicator {
  transform: none !important;
}

.toggle.switch-button .switch-outer .switch-button-input:active + .button {
  opacity: 0.85 !important;
}

.toggle.switch-button.quotes-switch.is-market-heartbeat .button-indicator {
  height: 4px !important;
  width: 4px !important;
  border: none !important;
  animation: switch-indicator-heartbeat 0.9s ease-in-out 1 !important;
}

.toggle.switch-button.quotes-switch.is-market-heartbeat.is-market-heartbeat-on .button-indicator {
  background: #60d480 !important;
  box-shadow: 0 0 12px rgba(96, 212, 128, 1), 0 0 18px rgba(96, 212, 128, 0.9) !important;
}

.toggle.switch-button.quotes-switch.is-market-heartbeat.is-market-heartbeat-off .button-indicator {
  background: #ef565f !important;
  box-shadow: 0 0 12px rgba(239, 86, 95, 0.9), 0 0 18px rgba(239, 86, 95, 0.75) !important;
  animation: switch-indicator-heartbeat 0.9s ease-in-out 1 !important;
}

.toggle.switch-button.quotes-switch.is-market-heartbeat .button-indicator {
  opacity: 1 !important;
  transform: none !important;
}

.toggle.switch-button.quotes-switch.is-market-heartbeat.is-market-heartbeat-alt .button-indicator {
  opacity: 0.32 !important;
  transform: none !important;
}

@keyframes switch-indicator-heartbeat {
  0%, 100% { opacity: 1; transform: none; }
  40% { opacity: 0.5; transform: none; }
  75% { opacity: 0.92; transform: none; }
}

/* FINAL EOF: darken Accounts tab table cells (wins over prior duplicated blocks). */
body.test-mode #accounts-panel .accounts-table th,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-table th {
  background: color-mix(in srgb, var(--card) 72%, #000 28%) !important;
}

body.test-mode #accounts-panel .accounts-table tbody tr,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-table tbody tr {
  background: color-mix(in srgb, var(--card) 97%, #000 3%) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head,
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head {
  background: color-mix(in srgb, var(--card) 72%, #000 28%) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: color-mix(in srgb, var(--card) 97%, #000 3%) !important;
}

/* FINAL EOF: Reports Export backgrounds match current theme tokens. */
body.test-mode #report-panel-export .report-export-tile,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-tile {
  background: color-mix(in srgb, var(--card) 92%, #000 8%) !important;
  border-color: color-mix(in srgb, var(--border) 85%, #000 15%) !important;
}

body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field input,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field select,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field textarea {
  background: color-mix(in srgb, var(--card) 82%, #000 18%) !important;
  border-color: color-mix(in srgb, var(--border) 88%, #000 12%) !important;
  color: var(--text) !important;
}

body.test-mode #report-panel-export .report-export-actions .primary-btn,
body.test-mode #report-panel-export .report-export-actions .secondary-btn,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-actions .primary-btn,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-actions .secondary-btn {
  background: color-mix(in srgb, var(--card) 86%, #000 14%) !important;
  border-color: color-mix(in srgb, var(--border) 88%, #000 12%) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 8px rgba(7, 10, 18, 0.2) !important;
}

/* FINAL EOF: Accounts tab cell separation (row + column). */
#accounts-panel .report-table.accounts {
  border-collapse: separate !important;
  border-spacing: 0 2px !important;
}

#accounts-panel .report-table.accounts .report-row > div {
  background-clip: padding-box !important;
}

#accounts-panel .report-table.accounts .report-row > div + div {
  border-left: 1px solid color-mix(in srgb, var(--border) 85%, transparent 15%) !important;
}

/* FINAL EOF: Settings ring setup preview columns use fixed proportional widths. */
#settings-panel .settings-quotes-card .quotes-head,
#settings-panel .settings-quotes-card .quotes-row {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  grid-template-columns: 90px repeat(3, minmax(60px, 0.9fr)) minmax(0, 0.6fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.35fr) !important;
}

#settings-panel .settings-quotes-card .quotes-head > div,
#settings-panel .settings-quotes-card .quotes-row > .quotes-cell > * {
  white-space: nowrap !important;
}

/* Quote cells: minimal text drop shadow for better separation. */
body:not(.theme-alt-disabled) #settings-panel .settings-quotes-card .quotes-row > .quotes-cell > * {
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) !important;
}

body.theme-alt-disabled #settings-panel .settings-quotes-card .quotes-row > .quotes-cell > * {
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.42) !important;
}

/* Ring setup quote cells: same subtle text shadow. */
body:not(.theme-alt-disabled) #settings-panel #settings-quotes-body .quotes-cell,
body:not(.theme-alt-disabled) #settings-panel #settings-quotes-body .quote-config-span .quote-input,
body:not(.theme-alt-disabled) #settings-panel #settings-quotes-body .quote-select {
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) !important;
}

body.theme-alt-disabled #settings-panel #settings-quotes-body .quotes-cell,
body.theme-alt-disabled #settings-panel #settings-quotes-body .quote-config-span .quote-input,
body.theme-alt-disabled #settings-panel #settings-quotes-body .quote-select {
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.42) !important;
}

body.arb-two #settings-panel .settings-quotes-card .quotes-head,
body.arb-two #settings-panel .settings-quotes-card .quotes-row {
  grid-template-columns: 90px repeat(2, minmax(60px, 0.9fr)) minmax(0, 0.6fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.45fr) minmax(0, 0.35fr) !important;
}

#settings-panel #settings-quotes-body .quotes-cell-leg-preview {
  align-items: center !important;
  justify-content: center !important;
  flex-direction: row !important;
  gap: 0 !important;
  text-align: center;
}

/* FINAL EOF: ensure only outer corners are rounded. */
#settings-panel #settings-quotes-body .quotes-cell {
  border-radius: 0 !important;
}

#settings-panel #settings-quotes-body .quotes-row > .quotes-cell:first-child {
  border-top-left-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
}

#settings-panel #settings-quotes-body .quotes-row > .quotes-cell:last-child {
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
}

/* Ring setup quote cells: decrease content font size by 1px. */
#settings-panel #settings-quotes-body .quotes-cell,
#settings-panel #settings-quotes-body .quote-config-span .quote-input,
#settings-panel #settings-quotes-body .quote-select {
  font-size: 11px !important;
}

/* Reports tabs: match support tab styling exactly. */
body.test-mode #reports-panel .report-subtab,
body.test-mode #reports-panel .report-tab {
  border: 1px solid rgba(120, 140, 200, 0.24) !important;
  background: rgba(10, 12, 30, 0.36) !important;
  color: #8f99ab !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.test-mode #reports-panel .report-subtab.is-active,
body.test-mode #reports-panel .report-tab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1)) !important;
  border-color: rgba(77, 213, 255, 0.55) !important;
  color: #4dd5ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 3px 10px rgba(77, 213, 255, 0.2) !important;
}

/* Standardise all deals-card tabs to match open deals. */
body.test-mode #dashboard-panel .table-card .table {
  background: rgba(24, 33, 48, 0.96) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
  box-shadow: inset 0 2px 6px rgba(5, 8, 20, 0.35) !important;
}

body.test-mode #dashboard-panel .table-head.table-head-positions {
  background: rgba(22, 31, 45, 0.98) !important;
  box-shadow: 0 10px 24px rgba(7, 10, 18, 0.35) !important;
}

/* Ring settings card: cap input/dropdown field widths. */
#settings-panel .quote-ring-settings .quote-settings-item .quote-input,
#settings-panel .quote-ring-settings .quote-settings-item input[type="number"],
#settings-panel .quote-ring-settings .quote-settings-item input[type="text"] {
  max-width: 150px !important;
}

#settings-panel .quote-ring-settings .quote-settings-item .quote-select,
#settings-panel .quote-ring-settings .quote-settings-item select {
  max-width: 150px !important;
}

/* Ring settings labels: force single-line labels. */
#settings-panel .quote-ring-settings .quote-settings-item .quote-config-label,
#settings-panel .quote-ring-settings .quote-settings-item .quote-config-label > span {
  white-space: nowrap !important;
}

#settings-panel .quote-ring-settings .quote-settings-item .quote-config-label.settings-label-with-tip {
  display: flex !important;
  align-items: center;
  min-width: 0;
}

#settings-panel .quote-ring-settings .quote-settings-item .quote-config-label.settings-label-with-tip > span {
  min-width: max-content;
  overflow: visible !important;
  text-overflow: clip !important;
}

body.test-mode #dashboard-panel .deal-logs {
  background: rgba(24, 33, 48, 0.96) !important;
}

body.test-mode #dashboard-panel .deal-logs .connection-logs-table,
body.test-mode #dashboard-panel .deal-logs .connection-logs-table td {
  background: rgba(24, 33, 48, 0.96) !important;
}

body.test-mode .card-header h2 {
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

body.test-mode #settings-panel .settings-row {
  border-radius: 12px !important;
}

body.test-mode #report-export-pdf,
body.test-mode #report-export-csv {
  background: linear-gradient(180deg, rgba(45, 130, 210, 0.85), rgba(30, 100, 180, 0.9)) !important;
  border-color: rgba(60, 150, 230, 0.5) !important;
  color: #fff !important;
}

/* Ring settings order type toggle: match settings-card toggle style. */
#settings-panel .quote-ring-settings .toggle-group .toggle-btn,
#settings-panel .quote-ring-settings .toggle-group .toggle-btn:hover:not(:disabled),
#settings-panel .quote-ring-settings .toggle-group .toggle-btn:focus-visible:not(:disabled),
#settings-panel .quote-ring-settings .toggle-group .toggle-btn.is-active,
#settings-panel .quote-ring-settings .toggle-group .toggle-btn.is-active:hover:not(:disabled),
#settings-panel .quote-ring-settings .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  min-height: 22px !important;
  height: 22px !important;
  line-height: 22px !important;
}

/* Order type row: force exact height match with IOC/FOK select field. */
#settings-panel #settings-quotes-body .quote-settings-item.order-row .toggle-group .toggle-btn,
#settings-panel #settings-quotes-body .quote-settings-item.order-row .toggle-group .toggle-btn:hover:not(:disabled),
#settings-panel #settings-quotes-body .quote-settings-item.order-row .toggle-group .toggle-btn:focus-visible:not(:disabled),
#settings-panel #settings-quotes-body .quote-settings-item.order-row .toggle-group .toggle-btn.is-active,
#settings-panel #settings-quotes-body .quote-settings-item.order-row .toggle-group .toggle-btn.is-active:hover:not(:disabled),
#settings-panel #settings-quotes-body .quote-settings-item.order-row .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  min-height: 22.67px !important;
  height: 22.67px !important;
  max-height: 22.67px !important;
  line-height: 22.67px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Order type controls are dynamically generated; enforce on actual row class. */
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn,
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn:hover:not(:disabled),
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn:focus-visible:not(:disabled),
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn.is-active,
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn.is-active:hover:not(:disabled),
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled),
#settings-panel .quote-settings-item.order-row .quote-order-select .quote-select {
  min-height: 22.67px !important;
  height: 22.67px !important;
  max-height: 22.67px !important;
  line-height: 22.67px !important;
}

/* Match manual and community tile backgrounds to support message field. */
body.test-mode #support-panel-manual .manual .manual-toc,
body.test-mode #support-panel-manual .manual .manual-section {
  background: rgba(24, 33, 50, 0.9) !important;
}

body.test-mode #support-panel-community .community-sidebar,
body.test-mode #support-panel-community .community-main {
  background: rgba(24, 33, 50, 0.9) !important;
}

body.test-mode #support-panel-contact .report-export-field input,
body.test-mode #support-panel-contact .report-export-field select,
body.test-mode #support-panel-contact .report-export-field textarea {
  background: rgba(24, 33, 50, 0.9) !important;
}

body.test-mode #support-panel-manual .manual .manual-search-input,
body.test-mode #support-panel-community .community-reaction,
body.test-mode #support-panel-community .community-reaction-applied,
body.test-mode #support-panel-community .community-reaction-option,
body.test-mode #support-panel-community .community-composer .input {
  background: rgba(24, 33, 50, 0.9) !important;
}

body.theme-alt-disabled #support-panel-manual .manual .manual-toc,
body.theme-alt-disabled #support-panel-manual .manual .manual-section,
body.theme-alt-disabled #support-panel-manual .manual .manual-search-input,
body.theme-alt-disabled #support-panel-community .community-sidebar,
body.theme-alt-disabled #support-panel-community .community-main,
body.theme-alt-disabled #support-panel-community .community-reaction,
body.theme-alt-disabled #support-panel-community .community-reaction-applied,
body.theme-alt-disabled #support-panel-community .community-reaction-option,
body.theme-alt-disabled #support-panel-community .community-composer .input,
body.theme-alt-disabled #support-panel-contact .report-export-field input,
body.theme-alt-disabled #support-panel-contact .report-export-field select,
body.theme-alt-disabled #support-panel-contact .report-export-field textarea {
  background: rgba(232, 239, 248, 0.98) !important;
}

body.test-mode #support-panel .report-subtab,
body.test-mode #support-panel .report-tab {
  border: 1px solid rgba(120, 140, 200, 0.24) !important;
  background: rgba(10, 12, 30, 0.36) !important;
  color: #8f99ab !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.test-mode #support-panel .report-subtab.is-active,
body.test-mode #support-panel .report-tab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1)) !important;
  border-color: rgba(77, 213, 255, 0.55) !important;
  color: #4dd5ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 3px 10px rgba(77, 213, 255, 0.2) !important;
}

body.test-mode #scanner-panel .feed-select option:checked,
body.test-mode #scanner-panel .feed-select option:active {
  background: #212d3f !important;
  color: #d2d9e6 !important;
}

/* Scanner config exchange/pair selectors: align with platform field palette. */
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .feed-select,
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .scanner-lookback-select,
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .scanner-threshold-row .input-prefix,
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .scanner-threshold-row .input-prefix input {
  background: rgba(24, 33, 48, 0.78) !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: #d2d9e6 !important;
  box-shadow: none !important;
}

body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .scanner-lookback-select {
  height: 28px !important;
}

body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .feed-select {
  min-height: 136px !important;
}

body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .feed-select option,
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .scanner-lookback-select option {
  background: #182130 !important;
  color: #d2d9e6 !important;
}

body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .feed-select option:checked,
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .feed-select option:active {
  background: #182130 !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #scanner-panel .scanner-config-card .feed-select,
body.theme-alt-disabled #scanner-panel .scanner-config-card .scanner-lookback-select {
  background: rgba(247, 251, 255, 0.94) !important;
  border-color: rgba(120, 128, 146, 0.34) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #scanner-panel .scanner-config-card .scanner-lookback-select {
  height: 28px !important;
}

body.theme-alt-disabled #scanner-panel .scanner-config-card .feed-select {
  min-height: 136px !important;
}

body.theme-alt-disabled #scanner-panel .scanner-config-card .feed-select option,
body.theme-alt-disabled #scanner-panel .scanner-config-card .scanner-lookback-select option {
  background: #f7fbff !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #scanner-panel .scanner-config-card .feed-select option:checked,
body.theme-alt-disabled #scanner-panel .scanner-config-card .feed-select option:active {
  background: #f7fbff !important;
  color: #2f3a4d !important;
}

/* Final override: Support and Reports tab buttons must be visually identical. */
body:not(.theme-alt-disabled) :is(#support-panel, #reports-panel) .report-subtab,
body:not(.theme-alt-disabled) :is(#support-panel, #reports-panel) .report-tab {
  border: 1px solid rgba(120, 140, 200, 0.24) !important;
  background: rgba(10, 12, 30, 0.36) !important;
  color: #8f99ab !important;
  border-radius: 6px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 4px rgba(0, 0, 0, 0.12) !important;
}

body:not(.theme-alt-disabled) :is(#support-panel, #reports-panel) .report-subtab.is-active,
body:not(.theme-alt-disabled) :is(#support-panel, #reports-panel) .report-tab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1)) !important;
  border-color: rgba(77, 213, 255, 0.55) !important;
  color: #4dd5ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 1px 4px rgba(77, 213, 255, 0.11) !important;
}

body.theme-alt-disabled :is(#support-panel, #reports-panel) .report-subtab,
body.theme-alt-disabled :is(#support-panel, #reports-panel) .report-tab {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 1px 4px rgba(0, 0, 0, 0.06) !important;
}

body.theme-alt-disabled :is(#support-panel, #reports-panel) .report-subtab.is-active,
body.theme-alt-disabled :is(#support-panel, #reports-panel) .report-tab.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.4) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 1px 4px rgba(45, 123, 173, 0.12) !important;
}

/* Final layout parity: Support subtab row spacing must match Reports exactly. */
#support-panel .report-subtabs {
  gap: 6px !important;
  margin-bottom: 10px !important;
}

/* Force Support tabs to match Reports in dark/test mode (override broad non-reports rule). */
body.test-mode #support-panel > .report-subtabs > .report-subtab,
body.test-mode #support-panel > .report-subtabs > .report-tab {
  border: 1px solid rgba(120, 140, 200, 0.24) !important;
  background: rgba(10, 12, 30, 0.36) !important;
  color: #8f99ab !important;
  border-radius: 6px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 4px rgba(0, 0, 0, 0.12) !important;
}

body.test-mode #support-panel > .report-subtabs > .report-subtab.is-active,
body.test-mode #support-panel > .report-subtabs > .report-tab.is-active {
  background: linear-gradient(180deg, rgba(77, 213, 255, 0.2), rgba(77, 213, 255, 0.1)) !important;
  border-color: rgba(77, 213, 255, 0.55) !important;
  color: #4dd5ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 1px 4px rgba(77, 213, 255, 0.11) !important;
}

/* Reports Export: match input fields to requested platform surface color. */
body.test-mode #report-panel-export .report-export-field input,
body.test-mode #report-panel-export .report-export-field select,
body.test-mode #report-panel-export .report-export-field textarea,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field input,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field select,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field textarea {
  background: #121826 !important;
  border-color: rgba(146, 162, 186, 0.28) !important;
  color: var(--text) !important;
}

/* Reports Export date icons: keep calendar icon bright in dark modes. */
body.test-mode #report-panel-export .report-export-field input[type="date"],
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field input[type="date"] {
  color-scheme: dark;
}

body.test-mode #report-panel-export .report-export-field input[type="date"]::-webkit-calendar-picker-indicator,
body:not(.theme-alt-disabled):not(.test-mode) #report-panel-export .report-export-field input[type="date"]::-webkit-calendar-picker-indicator {
  filter: brightness(0) invert(1) !important;
  opacity: 1 !important;
}

/* Home + Settings card title labels only: slightly stronger text-shadow. */
body:not(.theme-alt-disabled) #dashboard-panel .card-header h2,
body:not(.theme-alt-disabled) #settings-panel .card-header h2 {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.68) !important;
}

body.theme-alt-disabled #dashboard-panel .card-header h2,
body.theme-alt-disabled #settings-panel .card-header h2 {
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.62) !important;
}

/* Settings non-title labels: restore subtle text-shadow. */
body:not(.theme-alt-disabled) #settings-panel .settings-label,
body:not(.theme-alt-disabled) #settings-panel .quote-config-label,
body:not(.theme-alt-disabled) #settings-panel .quote-settings-tile-title,
body:not(.theme-alt-disabled) #settings-panel label {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.58) !important;
}

body.theme-alt-disabled #settings-panel .settings-label,
body.theme-alt-disabled #settings-panel .quote-config-label,
body.theme-alt-disabled #settings-panel .quote-settings-tile-title,
body.theme-alt-disabled #settings-panel label {
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.54) !important;
}

/* Explicit card-targeted reinforcement for visibility. */
body:not(.theme-alt-disabled) #dashboard-panel .chart-card > .card-header h2,
body:not(.theme-alt-disabled) #dashboard-panel .quotes-card > .card-header h2,
body:not(.theme-alt-disabled) #dashboard-panel .table-card > .card-header h2,
body:not(.theme-alt-disabled) #settings-panel .settings-card > .card-header h2,
body:not(.theme-alt-disabled) #settings-panel .connections-card > .card-header h2,
body:not(.theme-alt-disabled) #settings-panel .accounts-card > .card-header h2 {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.62) !important;
}

body.theme-alt-disabled #dashboard-panel .chart-card > .card-header h2,
body.theme-alt-disabled #dashboard-panel .quotes-card > .card-header h2,
body.theme-alt-disabled #dashboard-panel .table-card > .card-header h2,
body.theme-alt-disabled #settings-panel .settings-card > .card-header h2,
body.theme-alt-disabled #settings-panel .connections-card > .card-header h2,
body.theme-alt-disabled #settings-panel .accounts-card > .card-header h2 {
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.58) !important;
}

/* Scanner action buttons: match Settings reset/action button style. */
body:not(.theme-alt-disabled):not(.test-mode) #scanner-panel #scanner-replay-signals,
body:not(.theme-alt-disabled):not(.test-mode) #scanner-panel #scanner-config-toggle,
body:not(.theme-alt-disabled):not(.test-mode) #scanner-panel #scanner-clear-signals,
body:not(.theme-alt-disabled):not(.test-mode) #scanner-panel .scanner-config-card .primary-btn,
body:not(.theme-alt-disabled):not(.test-mode) #scanner-panel .scanner-config-card .secondary-btn {
  background: rgba(10, 12, 30, 0.5) !important;
  border-color: rgba(20, 26, 38, 0.85) !important;
  color: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.test-mode #scanner-panel #scanner-replay-signals,
body.test-mode #scanner-panel #scanner-config-toggle,
body.test-mode #scanner-panel #scanner-clear-signals,
body.test-mode #scanner-panel .scanner-config-card .primary-btn,
body.test-mode #scanner-panel .scanner-config-card .secondary-btn {
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  border-color: rgba(146, 162, 186, 0.22) !important;
  color: #c7d1e0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.theme-alt-disabled #scanner-panel #scanner-replay-signals,
body.theme-alt-disabled #scanner-panel #scanner-config-toggle,
body.theme-alt-disabled #scanner-panel #scanner-clear-signals,
body.theme-alt-disabled #scanner-panel .scanner-config-card .primary-btn,
body.theme-alt-disabled #scanner-panel .scanner-config-card .secondary-btn {
  background: rgba(10, 12, 30, 0.5) !important;
  border-color: rgba(0, 0, 0, 0.15) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.theme-alt-disabled #scanner-panel #scanner-replay-signals:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-config-toggle:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-clear-signals:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .primary-btn:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .secondary-btn:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-replay-signals:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-config-toggle:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-clear-signals:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .primary-btn:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .secondary-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
}

/* EOF FINAL: force Accounts table/report palette to follow active theme tokens. */
#accounts-panel .accounts-list,
#accounts-panel .report-table.accounts {
  background: color-mix(in srgb, var(--card) 96%, #000 4%) !important;
  border-color: color-mix(in srgb, var(--border) 84%, transparent 16%) !important;
}

#accounts-panel .accounts-table th,
#accounts-panel .report-table.accounts .report-row.report-head,
#accounts-panel .report-table.accounts .report-row.report-head > div {
  background: color-mix(in srgb, var(--card) 76%, #000 24%) !important;
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--border) 86%, transparent 14%) !important;
}

#accounts-panel .accounts-table tbody tr,
#accounts-panel .accounts-table td,
#accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
#accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) > div {
  background: color-mix(in srgb, var(--card) 95%, #000 5%) !important;
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--border) 82%, transparent 18%) !important;
}

/* EOF FINAL: force Accounts table/report palette to follow active theme tokens. */
#accounts-panel .accounts-list,
#accounts-panel .report-table.accounts {
  background: color-mix(in srgb, var(--card) 94%, #000 6%) !important;
  border-color: color-mix(in srgb, var(--border) 84%, transparent 16%) !important;
}

#accounts-panel .accounts-table th,
#accounts-panel .report-table.accounts .report-row.report-head,
#accounts-panel .report-table.accounts .report-row.report-head > div {
  background: color-mix(in srgb, var(--card) 72%, #000 28%) !important;
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--border) 86%, transparent 14%) !important;
}

#accounts-panel .accounts-table tbody tr,
#accounts-panel .accounts-table td,
#accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
#accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) > div {
  background: color-mix(in srgb, var(--card) 92%, #000 8%) !important;
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--border) 82%, transparent 18%) !important;
}

/* FINAL LOCK: Accounts tables always match active theme palette. */
#accounts-panel .accounts-list,
#accounts-panel .report-table.accounts {
  background: color-mix(in srgb, var(--card) 94%, #000 6%) !important;
  border-color: color-mix(in srgb, var(--border) 84%, transparent 16%) !important;
}

#accounts-panel .accounts-table th,
#accounts-panel .report-table.accounts .report-row.report-head > div {
  background: color-mix(in srgb, var(--card) 72%, #000 28%) !important;
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--border) 86%, transparent 14%) !important;
}

#accounts-panel .accounts-table tbody tr,
#accounts-panel .accounts-table td,
#accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
#accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) > div {
  background: color-mix(in srgb, var(--card) 92%, #000 8%) !important;
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--border) 82%, transparent 18%) !important;
}

/* Collapsed nav only: move tab buttons up by 20px, keep icons centered. */
.app-shell.is-collapsed .sidebar-nav {
  margin-top: 15px !important;
}

.app-shell.is-collapsed .sidebar-nav .tab-btn .tab-icon {
  transform: none !important;
}

/* Dashboard top row: keep Analytics card height matched to ring-dual card height. */
#dashboard-panel .chart-card,
#dashboard-panel .ring-card-dual {
  align-self: stretch !important;
  height: auto !important;
  min-height: 440px !important;
}

/* Analytics card: increase top padding only. */
#dashboard-panel .chart-card {
  padding-top: 26px !important;
}

/* Analytics label: move up by 15px without shifting header controls. */
#dashboard-panel .chart-card > .card-header h2 {
  transform: translateY(-5px) !important;
}

/* Ring dual card tiles: mixed fixed-px sizing with grid/flex layout stability. */
#dashboard-panel .ring-card-dual {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  height: auto !important;
  min-height: 440px !important;
}

#dashboard-panel .ring-card-dual .ring-dual {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
  justify-items: stretch !important;
}

#dashboard-panel .ring-card-dual .ring-tile,
#dashboard-panel .ring-card-dual .ring-indicators-panel,
#dashboard-panel .ring-card-dual .ring-summary-panel {
  width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  padding: 12px 14px !important;
}

#dashboard-panel .ring-card-dual .ring-tile {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 0 !important;
}

#dashboard-panel .ring-card-dual .ring-indicators-panel,
#dashboard-panel .ring-card-dual .ring-summary-panel {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 0 !important;
}

#dashboard-panel .ring-card-dual .ring-indicators,
#dashboard-panel .ring-card-dual .ring-summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  row-gap: 6px !important;
}

#dashboard-panel .ring-card-dual .ring-indicator,
#dashboard-panel .ring-card-dual .ring-summary-row {
  display: flex !important;
  align-items: center !important;
  min-height: 18px !important;
}

/* Accounts tab: match Daily PnL table colors. */
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts,
body.test-mode #accounts-panel .report-table.accounts {
  background: rgba(10, 12, 30, 0.55) !important;
  border-color: var(--border) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(6, 10, 25, 0.85) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(22, 31, 45, 0.98) !important;
}

body.theme-alt-disabled #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(218, 226, 237, 0.98) !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(210, 220, 233, 0.98) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
body.test-mode #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
body.theme-alt-disabled #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
body.theme-alt-disabled.test-mode #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: transparent !important;
}

/* Final: Home rings + deals collapse arrows use scanner collapse button style. */
body #dashboard-panel .quotes-minimize-btn.scanner-toggle,
body #dashboard-panel .deal-toggle.scanner-toggle {
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  padding: 0 !important;
  line-height: 1 !important;
  border-radius: 4px !important;
  border: 1px solid rgba(90, 120, 220, 0.6) !important;
  background: rgba(12, 16, 32, 0.85) !important;
  color: var(--text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.test-mode #dashboard-panel .quotes-minimize-btn.scanner-toggle,
body.test-mode #dashboard-panel .deal-toggle.scanner-toggle {
  border-color: rgba(146, 162, 186, 0.34) !important;
  background: rgba(35, 45, 63, 0.96) !important;
  color: #d2d9e6 !important;
}

body.test-mode #dashboard-panel .quotes-minimize-btn.scanner-toggle:hover,
body.test-mode #dashboard-panel .quotes-minimize-btn.scanner-toggle:focus-visible,
body.test-mode #dashboard-panel .deal-toggle.scanner-toggle:hover,
body.test-mode #dashboard-panel .deal-toggle.scanner-toggle:focus-visible {
  background: rgba(42, 54, 74, 0.98) !important;
  border-color: rgba(146, 162, 186, 0.34) !important;
  color: #d2d9e6 !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-minimize-btn.scanner-toggle,
body.theme-alt-disabled #dashboard-panel .deal-toggle.scanner-toggle {
  border-color: rgba(120, 128, 146, 0.34) !important;
  background: rgba(238, 244, 252, 0.98) !important;
  color: #2f3a4d !important;
}

body.theme-alt-disabled #dashboard-panel .quotes-minimize-btn.scanner-toggle:hover,
body.theme-alt-disabled #dashboard-panel .quotes-minimize-btn.scanner-toggle:focus-visible,
body.theme-alt-disabled #dashboard-panel .deal-toggle.scanner-toggle:hover,
body.theme-alt-disabled #dashboard-panel .deal-toggle.scanner-toggle:focus-visible {
  background: rgba(230, 238, 248, 0.98) !important;
}

body.theme-alt-disabled.test-mode #dashboard-panel .quotes-minimize-btn.scanner-toggle,
body.theme-alt-disabled.test-mode #dashboard-panel .deal-toggle.scanner-toggle {
  border-color: rgba(126, 136, 152, 0.34) !important;
  background: rgba(233, 239, 247, 0.98) !important;
  color: #3c475c !important;
}

/* Sidebar collapse button background should match ring arrow buttons. */
body #sidebar-toggle.sidebar-toggle {
  background: rgba(12, 16, 32, 0.85) !important;
}

body.test-mode #sidebar-toggle.sidebar-toggle {
  background: rgba(35, 45, 63, 0.96) !important;
}

/* Sidebar collapse: highlight icon only (keep button surface unchanged). */
body #sidebar-toggle.sidebar-toggle:hover,
body #sidebar-toggle.sidebar-toggle:focus-visible,
body #sidebar-toggle.sidebar-toggle:active {
  background: rgba(12, 16, 32, 0.85) !important;
  border-color: var(--border) !important;
  color: var(--muted) !important;
  box-shadow: none !important;
}

body.test-mode #sidebar-toggle.sidebar-toggle:hover,
body.test-mode #sidebar-toggle.sidebar-toggle:focus-visible,
body.test-mode #sidebar-toggle.sidebar-toggle:active {
  background: rgba(35, 45, 63, 0.96) !important;
  border-color: var(--border) !important;
  color: #d2d9e6 !important;
  box-shadow: none !important;
}

body #sidebar-toggle.sidebar-toggle:hover svg,
body #sidebar-toggle.sidebar-toggle:focus-visible svg,
body #sidebar-toggle.sidebar-toggle:active svg {
  stroke: #4dd5ff !important;
  filter: drop-shadow(0 0 2px rgba(77, 213, 255, 0.45));
}

body:not(.theme-alt-disabled) #scanner-panel #scanner-replay-signals:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel #scanner-config-toggle:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel #scanner-clear-signals:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .secondary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel #scanner-replay-signals:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel #scanner-config-toggle:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel #scanner-clear-signals:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .scanner-config-card .secondary-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 205, 138, 0.95), rgba(255, 177, 98, 0.92)) !important;
  border-color: rgba(191, 123, 56, 0.45) !important;
  color: #4f2f0d !important;
  box-shadow: inset 0 1px 0 rgba(255, 244, 226, 0.72), 0 2px 6px rgba(174, 111, 52, 0.18) !important;
}

/* Keep scanner buttons mode-aware; do not force a single background across themes. */

/* Reports + Support tab buttons: match Settings reset/scanner base button backgrounds. */
body:not(.theme-alt-disabled):not(.test-mode) #reports-panel .report-subtab:not(.is-active),
body:not(.theme-alt-disabled):not(.test-mode) #reports-panel .report-tab:not(.is-active),
body:not(.theme-alt-disabled):not(.test-mode) #support-panel .report-subtab:not(.is-active) {
  background: rgba(10, 12, 30, 0.5) !important;
  border-color: rgba(20, 26, 38, 0.85) !important;
  color: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.test-mode #reports-panel .report-subtab:not(.is-active),
body.test-mode #reports-panel .report-tab:not(.is-active),
body.test-mode #support-panel .report-subtab:not(.is-active) {
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  border-color: rgba(146, 162, 186, 0.22) !important;
  color: #c7d1e0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.theme-alt-disabled #reports-panel .report-subtab:not(.is-active),
body.theme-alt-disabled #reports-panel .report-tab:not(.is-active),
body.theme-alt-disabled #support-panel .report-subtab:not(.is-active) {
  background: rgba(10, 12, 30, 0.5) !important;
  border-color: rgba(0, 0, 0, 0.15) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

/* Chart radius from one container only (chart + axes together). */
#dashboard-panel .chart-card .chart-wrap {
  border-radius: 14px !important;
  overflow: hidden !important;
}

#dashboard-panel .chart-card .chart-plot,
#dashboard-panel .chart-card #profit-chart,
#dashboard-panel .chart-card canvas {
  border-radius: 0 !important;
}

#dashboard-panel .chart-card .chart-corner-zoom {
  position: absolute;
  right: 1px;
  bottom: 1px;
  display: grid;
  grid-template-columns: repeat(2, 27px);
  grid-auto-rows: 27px;
  width: 54px;
  height: 27px;
  gap: 0;
  align-items: stretch;
  justify-items: stretch;
  z-index: 7;
  pointer-events: auto;
  overflow: visible;
}

#dashboard-panel .chart-card .chart-corner-zoom .chart-zoom-btn {
  width: 27px;
  min-width: 27px;
  max-width: 27px;
  height: 27px;
  min-height: 27px;
  max-height: 27px;
  border: 0;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0;
  background: #0e1522;
  color: rgba(152, 168, 194, 0.95);
  font-family: var(--sans);
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  pointer-events: auto;
  transform: none !important;
  transition: opacity 0.12s ease, color 0.12s ease, background-color 0.12s ease !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

#dashboard-panel .chart-card .chart-corner-zoom .chart-zoom-btn + .chart-zoom-btn {
  border-left: 0 !important;
}

#dashboard-panel .chart-card .chart-corner-zoom .chart-zoom-btn:first-child {
  border-right: 0 !important;
}


#dashboard-panel .chart-card .chart-corner-zoom .chart-zoom-btn:hover,
#dashboard-panel .chart-card .chart-corner-zoom .chart-zoom-btn:focus-visible {
  background: #0e1522;
  color: rgba(152, 168, 194, 0.95);
  opacity: 1;
  outline: none;
  transform: none !important;
}

#dashboard-panel .chart-card .chart-corner-zoom .chart-zoom-btn:active {
  opacity: 0.7;
  transform: none !important;
}

/* Global table header text shadow. */
body:not(.theme-alt-disabled) .table-head > div,
body:not(.theme-alt-disabled) .table-head-deals > div,
body:not(.theme-alt-disabled) .report-row.report-head > div,
body:not(.theme-alt-disabled) .scanner-signal-head > div,
body:not(.theme-alt-disabled) .accounts-table th,
body:not(.theme-alt-disabled) .connection-logs-table th,
body:not(.theme-alt-disabled) .report-deal-table thead th,
body:not(.theme-alt-disabled) table thead th {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.62) !important;
}

body.theme-alt-disabled .table-head > div,
body.theme-alt-disabled .table-head-deals > div,
body.theme-alt-disabled .report-row.report-head > div,
body.theme-alt-disabled .scanner-signal-head > div,
body.theme-alt-disabled .accounts-table th,
body.theme-alt-disabled .connection-logs-table th,
body.theme-alt-disabled .report-deal-table thead th,
body.theme-alt-disabled table thead th {
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.58) !important;
}

/* FINAL OVERRIDE: Ring setup Order Type toggles must match IOC/FOK select height exactly. */
#settings-panel .quote-settings-item.order-row .toggle-group,
#settings-panel .quote-settings-item.order-row .quote-order-select,
#settings-panel .quote-settings-item.order-row .quote-order-select .quote-select,
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn,
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn:hover:not(:disabled),
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn:focus-visible:not(:disabled),
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn.is-active,
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn.is-active:hover:not(:disabled),
#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  height: 22.67px !important;
  min-height: 22.67px !important;
  max-height: 22.67px !important;
  line-height: 22.67px !important;
  box-sizing: border-box !important;
}

#settings-panel .quote-settings-item.order-row .toggle-group .toggle-btn {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
}

#settings-panel .quote-settings-item.order-row .quote-order-select .quote-select {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#settings-panel .quote-settings-item.order-row .toggle-group {
  position: relative !important;
  top: 2px !important;
}

#settings-panel .quote-settings-item.order-row .quote-order-select {
  position: relative !important;
  top: 1px !important;
}

/* Scanner details: center Signal status + Order status headers and cells. */
#scanner-panel .scanner-signals .scanner-signal > div:nth-last-child(2),
#scanner-panel .scanner-signals .scanner-signal > div:last-child {
  text-align: center !important;
}

/* FINAL LOCK: scanner buttons must match settings reset button border/effects exactly. */
#scanner-panel #scanner-replay-signals,
#scanner-panel #scanner-config-toggle,
#scanner-panel #scanner-clear-signals,
#scanner-panel .scanner-config-card .primary-btn,
#scanner-panel .scanner-config-card .secondary-btn {
  border: 1px solid rgba(120, 190, 255, 0.4) !important;
  background: rgba(10, 12, 30, 0.5) !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.test-mode #scanner-panel #scanner-replay-signals,
body.test-mode #scanner-panel #scanner-config-toggle,
body.test-mode #scanner-panel #scanner-clear-signals,
body.test-mode #scanner-panel .scanner-config-card .primary-btn,
body.test-mode #scanner-panel .scanner-config-card .secondary-btn {
  border-color: rgba(146, 162, 186, 0.22) !important;
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  color: #c7d1e0 !important;
}

body.theme-alt-disabled #scanner-panel #scanner-replay-signals,
body.theme-alt-disabled #scanner-panel #scanner-config-toggle,
body.theme-alt-disabled #scanner-panel #scanner-clear-signals,
body.theme-alt-disabled #scanner-panel .scanner-config-card .primary-btn,
body.theme-alt-disabled #scanner-panel .scanner-config-card .secondary-btn {
  border-color: rgba(0, 0, 0, 0.15) !important;
  background: rgba(10, 12, 30, 0.5) !important;
  color: var(--text) !important;
}

body.theme-alt-disabled #scanner-panel #scanner-replay-signals:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-config-toggle:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-clear-signals:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .primary-btn:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .secondary-btn:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-replay-signals:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-config-toggle:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel #scanner-clear-signals:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .primary-btn:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .scanner-config-card .secondary-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
}

/* EOF LOCK: Accounts table mirrors Deals card table styles (color, shadow, borders). */
#accounts-panel .accounts-list {
  width: 100% !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px !important;
  background: var(--deals-table-bg) !important;
  box-shadow: inset 0 2px 6px rgba(5, 8, 20, 0.35) !important;
  overflow: hidden !important;
  overflow-x: hidden !important;
}

#accounts-panel .report-table.accounts {
  display: block !important;
  border: 0 !important;
  border-radius: 18px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: var(--deals-table-bg) !important;
  box-shadow: none !important;
  max-height: 420px !important;
  scrollbar-gutter: stable !important;
  scrollbar-color: rgba(77, 213, 255, 0.35) rgba(10, 12, 30, 0.6) !important;
  scrollbar-width: thin !important;
}

#accounts-panel .report-table.accounts::-webkit-scrollbar {
  width: 8px;
}

#accounts-panel .report-table.accounts::-webkit-scrollbar-track {
  background: rgba(10, 12, 30, 0.6);
  border-radius: 999px;
}

#accounts-panel .report-table.accounts::-webkit-scrollbar-thumb {
  background: rgba(77, 213, 255, 0.35);
  border-radius: 999px;
  border: 2px solid rgba(10, 12, 30, 0.6);
}

#accounts-panel .report-table.accounts .report-row {
  border-bottom: 1px solid var(--border) !important;
  background: transparent !important;
}

#accounts-panel .report-table.accounts .report-row.report-head {
  font-family: var(--sans) !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  color: var(--muted) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 2 !important;
}

#accounts-panel .report-table.accounts .report-row.report-head > div {
  background: inherit !important;
  color: inherit !important;
}

#accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) > div {
  background: inherit !important;
  color: var(--text) !important;
}

#accounts-panel .report-table.accounts .report-row > div {
  padding: 8px 10px !important;
  min-height: 34px !important;
  border-right: 1px solid var(--border) !important;
  border-left: 0 !important;
  display: flex !important;
  align-items: center !important;
}

#accounts-panel .report-table.accounts .report-row > div + div {
  border-left: 0 !important;
}

#accounts-panel .report-table.accounts .report-row > div:last-child {
  border-right: none !important;
  justify-content: flex-end !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row.report-head,
body.test-mode #accounts-panel .report-table.accounts .report-row.report-head {
  background: #161e2cf7 !important;
}

body.theme-alt-disabled #accounts-panel .report-table.accounts .report-row.report-head {
  background: rgba(245, 249, 253, 0.99) !important;
}

body.test-mode #accounts-panel .report-table.accounts {
  background: rgba(24, 33, 48, 0.96) !important;
  border-color: rgba(156, 171, 196, 0.2) !important;
}

body.theme-alt-disabled #accounts-panel .report-table.accounts {
  background: rgba(223, 230, 240, 0.98) !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .report-table.accounts {
  background: rgba(216, 224, 236, 0.98) !important;
}

body.test-mode #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
body.theme-alt-disabled.test-mode #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  background: rgba(29, 39, 55, 0.96) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 10px 24px rgba(7, 10, 18, 0.35) !important;
  border-color: rgba(143, 157, 181, 0.14) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty),
body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts .report-row:not(.report-head):not(.is-empty) {
  box-shadow: none !important;
}

/* EOF FIX: avoid duplicate-wrapper look in Settings connection logs. */
#settings-panel .connection-log-list {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-gutter: stable;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 8px 0 !important;
}

#settings-panel .connection-log-list .connection-logs-table {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#settings-panel .connection-log-list .connection-logs-table tbody,
#settings-panel .connection-log-list .connection-logs-table tr,
#settings-panel .connection-log-list .connection-logs-table td,
#settings-panel .connection-log-list .connection-log-empty td {
  background: transparent !important;
}

/* EOF HARD LOCK: remove inner connection-log wrapper visuals in all theme states. */
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-log-list,
body.test-mode #settings-panel .connection-log-list,
body.theme-alt-disabled #settings-panel .connection-log-list,
body.theme-alt-disabled.test-mode #settings-panel .connection-log-list {
  background: #1a2232 !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 10px !important;
}

body.theme-alt-disabled:not(.test-mode) #settings-panel .connection-log-list {
  background: rgba(246, 250, 255, 0.96) !important;
}

body.theme-alt-disabled.test-mode #settings-panel .connection-log-list {
  background: rgba(237, 241, 247, 0.96) !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-log-list .connection-logs-table,
body.test-mode #settings-panel .connection-log-list .connection-logs-table,
body.theme-alt-disabled #settings-panel .connection-log-list .connection-logs-table,
body.theme-alt-disabled.test-mode #settings-panel .connection-log-list .connection-logs-table {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-log-list .connection-logs-table tbody,
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-log-list .connection-logs-table tr,
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-log-list .connection-logs-table td,
body:not(.theme-alt-disabled):not(.test-mode) #settings-panel .connection-log-list .connection-log-empty td,
body.test-mode #settings-panel .connection-log-list .connection-logs-table tbody,
body.test-mode #settings-panel .connection-log-list .connection-logs-table tr,
body.test-mode #settings-panel .connection-log-list .connection-logs-table td,
body.test-mode #settings-panel .connection-log-list .connection-log-empty td,
body.theme-alt-disabled #settings-panel .connection-log-list .connection-logs-table tbody,
body.theme-alt-disabled #settings-panel .connection-log-list .connection-logs-table tr,
body.theme-alt-disabled #settings-panel .connection-log-list .connection-logs-table td,
body.theme-alt-disabled #settings-panel .connection-log-list .connection-log-empty td,
body.theme-alt-disabled.test-mode #settings-panel .connection-log-list .connection-logs-table tbody,
body.theme-alt-disabled.test-mode #settings-panel .connection-log-list .connection-logs-table tr,
body.theme-alt-disabled.test-mode #settings-panel .connection-log-list .connection-logs-table td,
body.theme-alt-disabled.test-mode #settings-panel .connection-log-list .connection-log-empty td {
  background: transparent !important;
  background-image: none !important;
}

#settings-panel .connection-log-list .connection-log-empty td {
  position: relative;
  top: 2px;
}

/* EOF: unify settings feed action controls sizing/alignment. */
#settings-panel .connection-status-row .status-actions {
  align-items: center !important;
}

#settings-panel .connection-status-row .status-actions .status-pill:not(.status-latency),
#settings-panel .connection-status-row .status-actions .primary-btn {
  width: 108px !important;
  min-width: 108px !important;
  max-width: 108px !important;
  height: 21px !important;
  min-height: 21px !important;
  max-height: 21px !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
}

#settings-panel .connection-status-row .status-actions .status-pill.status-latency {
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  height: 21px !important;
  min-height: 21px !important;
  max-height: 21px !important;
  padding: 0 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transform: none !important;
  box-sizing: border-box !important;
}

#settings-panel .connection-status-list .status-pill.status-latency.status-latency-high,
body.test-mode #settings-panel .connection-status-list .status-pill.status-latency.status-latency-high,
body.theme-alt-disabled #settings-panel .connection-status-list .status-pill.status-latency.status-latency-high {
  background: rgba(255, 93, 147, 0.28) !important;
  color: #ffe3ee !important;
}

/* EOF: scanner header controls align left by 10px + match Settings card tab style/colors. */
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle {
  position: relative !important;
  left: -10px !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn {
  border: 0 !important;
  border-color: transparent !important;
  background: rgba(10, 12, 30, 0.6) !important;
  color: var(--muted) !important;
  padding: 5px 12px !important;
  border-radius: 0 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: capitalize !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
  min-height: 24px !important;
  height: 24px !important;
  max-height: 24px !important;
  line-height: 24px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn + .toggle-btn {
  border-left: none !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:first-child {
  border-top-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:last-child {
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn.is-active {
  background: linear-gradient(180deg, rgba(255, 180, 84, 0.2), rgba(255, 180, 84, 0.1)) !important;
  border-color: transparent !important;
  color: rgba(255, 180, 84, 0.98) !important;
  box-shadow: none !important;
}

body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:hover:not(.is-active):not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:focus-visible:not(.is-active):not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: transparent !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn.is-active:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 180, 84, 0.2), rgba(255, 180, 84, 0.1)) !important;
  border-color: transparent !important;
  color: rgba(255, 180, 84, 0.98) !important;
  box-shadow: none !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle,
#scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn,
#scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn {
  border: 1px solid var(--border) !important;
  background: rgba(10, 12, 30, 0.6) !important;
  color: var(--muted) !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: capitalize !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
  min-width: 88px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  line-height: 24px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle {
  width: 88px !important;
  max-width: 88px !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals.is-loading,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh.is-loading {
  width: 88px !important;
  min-width: 88px !important;
  max-width: 88px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  gap: 4px !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals.is-loading .btn-scan,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh.is-loading .btn-scan {
  width: 13px !important;
  min-width: 13px !important;
  max-width: 13px !important;
  height: 13px !important;
  min-height: 13px !important;
  max-height: 13px !important;
  flex: 0 0 13px !important;
  border-width: 1.5px !important;
  transform: none !important;
  line-height: 0 !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals.is-loading .btn-scan::before,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh.is-loading .btn-scan::before {
  width: 1px !important;
  height: 5px !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals.is-loading .btn-scan::after,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh.is-loading .btn-scan::after {
  width: 2px !important;
  height: 2px !important;
}

body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn:focus-visible:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn:focus-visible:not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: var(--border) !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: transparent !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:hover:not(.is-active):not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:focus-visible:not(.is-active):not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: transparent !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals,
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh,
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle,
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn,
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn {
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  border-color: rgba(146, 162, 186, 0.22) !important;
  color: #c7d1e0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals:hover:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh:hover:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle:hover:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals:focus-visible:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh:focus-visible:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle:focus-visible:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn:hover:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn:hover:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn:focus-visible:not(:disabled),
body.test-mode:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(49, 59, 78, 0.9), rgba(42, 52, 70, 0.9)) !important;
  border-color: rgba(146, 162, 186, 0.22) !important;
  color: #c7d1e0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.18) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: transparent !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn.is-active {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: transparent !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: transparent !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn.is-active:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header .toggle-group .toggle-btn.is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: transparent !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals,
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh,
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle,
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn,
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .primary-btn:focus-visible:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .secondary-btn:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

/* FINAL LOCK: scanner 2-leg/3-leg tabs must match settings-card tabs exactly. */
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode] {
  border: 0 !important;
  border-color: transparent !important;
  background: rgba(10, 12, 30, 0.6) !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
  border-radius: 0 !important;
  padding: 5px 12px !important;
  min-height: 24px !important;
  height: 24px !important;
  max-height: 24px !important;
  line-height: 24px !important;
  box-sizing: border-box !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: capitalize !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode]:first-child {
  border-top-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode]:last-child {
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode].is-active,
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode].is-active:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode].is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 180, 84, 0.2), rgba(255, 180, 84, 0.1)) !important;
  border-color: transparent !important;
  color: rgba(255, 180, 84, 0.98) !important;
  box-shadow: none !important;
}

body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode]:hover:not(.is-active):not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode]:focus-visible:not(.is-active):not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: transparent !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode],
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode]:hover:not(.is-active):not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode]:focus-visible:not(.is-active):not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: transparent !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode].is-active,
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode].is-active:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .toggle-group > .toggle-btn[data-scanner-mode].is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: transparent !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

/* ABSOLUTE LOCK: enforce scanner mode tab palette regardless view nesting/cascade. */
body #scanner-panel .toggle-btn[data-scanner-mode] {
  border: 0 !important;
  border-color: transparent !important;
  background: rgba(10, 12, 30, 0.6) !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
  border-radius: 0 !important;
  padding: 5px 12px !important;
  min-height: 24px !important;
  height: 24px !important;
  max-height: 24px !important;
  line-height: 24px !important;
  box-sizing: border-box !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: capitalize !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

body #scanner-panel .toggle-btn[data-scanner-mode]:first-child {
  border-top-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
}

body #scanner-panel .toggle-btn[data-scanner-mode]:last-child {
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
}

body:not(.theme-alt-disabled) #scanner-panel .toggle-btn[data-scanner-mode].is-active,
body:not(.theme-alt-disabled) #scanner-panel .toggle-btn[data-scanner-mode].is-active:hover:not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .toggle-btn[data-scanner-mode].is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 180, 84, 0.2), rgba(255, 180, 84, 0.1)) !important;
  border-color: transparent !important;
  color: rgba(255, 180, 84, 0.98) !important;
  box-shadow: none !important;
}

body:not(.theme-alt-disabled) #scanner-panel .toggle-btn[data-scanner-mode]:hover:not(.is-active):not(:disabled),
body:not(.theme-alt-disabled) #scanner-panel .toggle-btn[data-scanner-mode]:focus-visible:not(.is-active):not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: transparent !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body.theme-alt-disabled #scanner-panel .toggle-btn[data-scanner-mode],
body.theme-alt-disabled #scanner-panel .toggle-btn[data-scanner-mode]:hover:not(.is-active):not(:disabled),
body.theme-alt-disabled #scanner-panel .toggle-btn[data-scanner-mode]:focus-visible:not(.is-active):not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: transparent !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.theme-alt-disabled #scanner-panel .toggle-btn[data-scanner-mode].is-active,
body.theme-alt-disabled #scanner-panel .toggle-btn[data-scanner-mode].is-active:hover:not(:disabled),
body.theme-alt-disabled #scanner-panel .toggle-btn[data-scanner-mode].is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: transparent !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

/* FINAL LOCK: Accounts table outer border + deals-like shadow on wrapper. */
body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .accounts-list {
  border: 1px solid var(--border) !important;
  border-radius: 11px !important;
  background: var(--deals-table-bg) !important;
  box-shadow: inset 0 2px 6px rgba(5, 8, 20, 0.35) !important;
  overflow: hidden !important;
}

body:not(.theme-alt-disabled):not(.test-mode) #accounts-panel .report-table.accounts {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.test-mode #accounts-panel .accounts-list {
  border: 1px solid rgba(156, 171, 196, 0.2) !important;
  border-radius: 11px !important;
  background: rgba(24, 33, 48, 0.96) !important;
  box-shadow: inset 0 2px 6px rgba(5, 8, 20, 0.35) !important;
  overflow: hidden !important;
}

body.test-mode #accounts-panel .report-table.accounts {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.theme-alt-disabled:not(.test-mode) #accounts-panel .accounts-list {
  border: 1px solid rgba(120, 128, 146, 0.28) !important;
  border-radius: 11px !important;
  background: rgba(236, 242, 250, 0.98) !important;
  box-shadow: inset 0 2px 6px rgba(120, 128, 146, 0.14) !important;
  overflow: hidden !important;
}

body.theme-alt-disabled:not(.test-mode) #accounts-panel .report-table.accounts {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .accounts-list {
  border: 1px solid rgba(126, 136, 152, 0.3) !important;
  border-radius: 11px !important;
  background: rgba(216, 224, 236, 0.98) !important;
  box-shadow: inset 0 2px 6px rgba(120, 128, 146, 0.16) !important;
  overflow: hidden !important;
}

body.theme-alt-disabled.test-mode #accounts-panel .report-table.accounts {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Scanner config: match inner settings-tile radius used in main Settings card. */
#scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .settings-row,
#scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .scanner-threshold-row,
#scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .feed-pane,
#scanner-panel .panel-tab-view[data-panel-view="scanner-config"] .scanner-config-card .feed-selected-row {
  border-radius: 12px !important;
}

/* FINAL LOCK: Deals card/table corner radius. */
body #dashboard-panel .table-card {
  border-radius: 18px !important;
  overflow: hidden !important;
}

body #dashboard-panel .table-card .table {
  border-radius: 11px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* FINAL LOCK: center Accounts table Total column header + values. */
#accounts-panel .report-table.accounts .report-row.report-head > div:nth-child(6),
#accounts-panel .report-table.accounts .report-row:not(.is-empty) > div:nth-child(6) {
  justify-content: center !important;
  text-align: center !important;
}

/* FINAL LOCK: keep manual text/content contained inside the manual tile. */
#support-panel-manual .manual-layout,
#support-panel-manual .manual-content,
#support-panel-manual .manual-section {
  min-width: 0 !important;
  max-width: 100% !important;
}

#support-panel-manual .manual-content {
  overflow-x: hidden !important;
}

#support-panel-manual .manual-section {
  overflow-x: hidden !important;
}

#support-panel-manual .manual-section,
#support-panel-manual .manual-section h3,
#support-panel-manual .manual-section h4,
#support-panel-manual .manual-section p,
#support-panel-manual .manual-section li,
#support-panel-manual .manual-section ul,
#support-panel-manual .manual-section ol {
  box-sizing: border-box !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* Recommendations */
#recommendations-panel .panel-body {
  display: grid;
  gap: 16px;
}

.recommendations-card {
  min-height: 420px;
}

.recommendations-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.recommendations-header > h2 {
  margin: 0 0 8px 0;
}

.recommendations-toolbar {
  margin-left: auto;
  width: auto;
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 10px;
  align-items: center;
}

.recommendations-filter {
  display: grid;
  gap: 4px;
  min-width: 110px;
  font-size: 11px;
  color: var(--muted);
}

.recommendations-filter select {
  min-width: 110px;
}

.recommendations-auto-apply {
  display: inline-flex;
  align-items: center;
  gap: 0;
  font-size: 11px;
  color: var(--muted);
  padding: 0;
}

.recommendations-auto-apply-switch.toggle.switch-button {
  margin-left: 2px;
}

.recommendations-view-tabs {
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  margin: 0;
  border: 0;
  border-radius: 6px;
  overflow: hidden;
  background: transparent;
}

.recommendations-view-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--sans);
  padding: 5px 12px;
  border-radius: 0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  min-height: 22px;
  height: 22px;
  line-height: 22px;
  border: 0;
  border-color: transparent;
  background: rgba(10, 12, 30, 0.6);
  color: var(--muted);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.recommendations-view-tabs .recommendations-view-tab + .recommendations-view-tab {
  border-left: none;
}

.recommendations-view-tabs .recommendations-view-tab:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

.recommendations-view-tabs .recommendations-view-tab:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

body:not(.theme-alt-disabled) .recommendations-card .recommendations-view-tab.is-active,
body:not(.theme-alt-disabled) .recommendations-card .recommendations-view-tab.is-active:hover:not(:disabled),
body:not(.theme-alt-disabled) .recommendations-card .recommendations-view-tab.is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 180, 84, 0.2), rgba(255, 180, 84, 0.1)) !important;
  border-color: var(--border) !important;
  color: rgba(255, 180, 84, 0.98) !important;
  box-shadow: none !important;
}

body:not(.theme-alt-disabled) .recommendations-card .recommendations-view-tab:hover:not(.is-active):not(:disabled),
body:not(.theme-alt-disabled) .recommendations-card .recommendations-view-tab:focus-visible:not(.is-active):not(:disabled) {
  background: rgba(10, 12, 30, 0.6) !important;
  border-color: transparent !important;
  color: var(--muted) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

body.theme-alt-disabled .recommendations-card .recommendations-view-tab,
body.theme-alt-disabled .recommendations-card .recommendations-view-tab:hover:not(.is-active):not(:disabled),
body.theme-alt-disabled .recommendations-card .recommendations-view-tab:focus-visible:not(.is-active):not(:disabled) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 245, 252, 0.96)) !important;
  border-color: transparent !important;
  color: #3f4e66 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

body.theme-alt-disabled .recommendations-card .recommendations-view-tab.is-active,
body.theme-alt-disabled .recommendations-card .recommendations-view-tab.is-active:hover:not(:disabled),
body.theme-alt-disabled .recommendations-card .recommendations-view-tab.is-active:focus-visible:not(:disabled) {
  background: linear-gradient(180deg, rgba(136, 216, 255, 0.95), rgba(100, 198, 255, 0.92)) !important;
  border-color: rgba(34, 120, 176, 0.42) !important;
  color: #0f3f67 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 2px 6px rgba(45, 123, 173, 0.16) !important;
}

.recommendations-view-panel {
  display: none;
}

.recommendations-view-panel.is-active {
  display: block;
}

.recommendations-console {
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 290px);
  overflow: auto;
  padding-right: 4px;
}

.recommendations-empty {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
  color: var(--muted);
  background: rgba(16, 24, 39, 0.4);
  font-size: 11px;
}

.recommendation-row {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(16, 24, 39, 0.56);
  overflow: hidden;
}

.recommendation-row-head {
  display: grid;
  grid-template-columns: 30px 168px 128px 120px 108px minmax(0, 1fr) auto;
  gap: 8px;
  row-gap: 6px;
  align-items: center;
  padding: 10px 12px;
}

.recommendation-expand {
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.04);
  color: var(--text);
  border-radius: 8px;
  height: 20px;
  width: 20px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  box-sizing: border-box;
}

.recommendation-toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: inherit;
  font-weight: 800;
}

.recommendation-toggle-icon-close {
  width: 14px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask: url('audit-close-2d.svg') center / 12px 12px no-repeat;
  mask: url('audit-close-2d.svg') center / 12px 12px no-repeat;
}

.recommendation-toggle-icon-search {
  width: 15px;
  height: 15px;
  transform: translateY(-0.5px);
  background-color: currentColor;
  -webkit-mask: url('audit-magnifier-2d.svg') center / 15px 15px no-repeat;
  mask: url('audit-magnifier-2d.svg') center / 15px 15px no-repeat;
}

.recommendation-cell {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 12px;
}

.recommendation-time,
.recommendation-ring {
  color: var(--muted);
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
}

.recommendation-pair {
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: 0.01em;
}

.recommendation-regime {
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: 0.02em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: rgba(12, 18, 28, 0.72);
  text-transform: capitalize;
  white-space: nowrap;
  line-height: 1.15;
}

.recommendation-regime.is-stable {
  color: #5fd39b;
  border-color: rgba(95, 211, 155, 0.45);
  background: rgba(16, 44, 34, 0.48);
}

.recommendation-regime.is-degraded {
  color: #ffd166;
  border-color: rgba(255, 209, 102, 0.45);
  background: rgba(62, 48, 19, 0.48);
}

.recommendation-regime.is-unstable {
  color: #ff6b6b;
  border-color: rgba(255, 107, 107, 0.5);
  background: rgba(62, 22, 22, 0.5);
}

.recommendation-summary {
  color: var(--text);
  grid-column: 2 / 8;
  grid-row: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 8px;
}

.recommendation-summary-text {
  min-width: 0;
  white-space: normal;
  line-height: 1.35;
}

.recommendation-summary-status {
  font-size: 10px;
  line-height: 1.25;
  color: var(--muted);
  text-align: right;
  white-space: nowrap;
  transform: translateX(-100px);
}

.recommendation-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 6px;
  grid-column: 7;
  grid-row: 1;
  justify-self: end;
  justify-content: flex-end;
  max-width: none;
  width: max-content;
}

.recommendation-actions .small-btn {
  white-space: nowrap;
}

.recommendation-actions .secondary-btn,
.recommendation-preview-actions .secondary-btn {
  white-space: nowrap;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  min-height: 24px !important;
  height: 24px !important;
  line-height: 24px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.recommendation-history-row .recommendation-actions .secondary-btn {
  opacity: 0.9;
}

.recommendation-history-row .recommendation-actions .secondary-btn:disabled {
  cursor: default;
}

.recommendation-action-message {
  flex-basis: 100%;
  font-size: 10px;
  line-height: 1.25;
  color: var(--muted);
  text-align: right;
  white-space: nowrap;
}

.recommendation-detail {
  border-top: 1px solid var(--border);
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 8px;
  padding: 10px 12px 12px;
  background: rgba(8, 14, 24, 0.45);
}

.recommendation-block {
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  min-width: 0;
}

.recommendation-factor-grid {
  display: grid;
  gap: 8px;
  padding: 10px 12px 12px;
}

.recommendation-factor-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-items: center;
}

.recommendation-factor-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
}

.recommendation-factor-score {
  min-width: 52px;
  text-align: center;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid var(--border);
  background: rgba(12, 18, 28, 0.72);
}

.recommendation-factor-score.is-healthy {
  color: #5fd39b;
  border-color: rgba(95, 211, 155, 0.45);
  background: rgba(16, 44, 34, 0.48);
}

.recommendation-factor-score.is-watch {
  color: #8fe3ff;
  border-color: rgba(143, 227, 255, 0.4);
  background: rgba(16, 36, 52, 0.52);
}

.recommendation-factor-score.is-warning {
  color: #ffd166;
  border-color: rgba(255, 209, 102, 0.45);
  background: rgba(62, 48, 19, 0.48);
}

.recommendation-factor-score.is-critical {
  color: #ff6b6b;
  border-color: rgba(255, 107, 107, 0.5);
  background: rgba(62, 22, 22, 0.5);
}

.recommendation-factor-score.is-unknown {
  color: var(--muted);
}

.recommendation-factor-note {
  grid-column: 1 / 3;
  font-size: 11px;
  line-height: 1.35;
  color: var(--muted);
}

.recommendation-block-full-height {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.recommendation-block-full-height .recommendation-list {
  flex: 1;
}

.recommendation-block-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.recommendation-json {
  margin: 0;
  padding: 8px;
  font-size: 11px;
  line-height: 1.38;
  color: var(--text);
  max-height: 220px;
  overflow: auto;
  font-family: var(--mono);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.recommendation-text {
  margin: 0;
  padding: 10px 12px 12px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text);
}

.recommendation-sentence + .recommendation-sentence {
  margin-top: 8px;
}

.recommendation-list {
  margin: 0;
  padding: 10px 14px 12px 30px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--text);
}

.recommendation-list li + li {
  margin-top: 6px;
}

.recommendation-preview-actions {
  margin: 0;
  padding: 0 12px 12px;
  display: flex;
  justify-content: flex-end;
}

@media (max-width: 1500px) {
  .recommendation-row-head {
    grid-template-columns: 30px 148px 120px 108px 96px minmax(0, 1fr) auto;
  }
}

@media (max-width: 1240px) {
  .recommendation-row-head {
    grid-template-columns: 30px 128px 108px 92px 88px minmax(0, 1fr) auto;
  }
  .recommendation-detail {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .recommendations-header {
    flex-wrap: wrap;
  }
  .recommendations-toolbar {
    width: 100%;
    justify-content: flex-end;
  }
}

/* Scanner header action buttons: force right alignment in card header. */
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header {
  display: flex;
  align-items: center;
  gap: 8px;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header h2 {
  margin-right: auto !important;
}

#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-replay-signals,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-refresh,
#scanner-panel .panel-tab-view[data-panel-view="scanner-view"] .scanner-card > .card-header #scanner-config-toggle {
  left: 0 !important;
  margin-left: 0 !important;
}