/* /ftf/styles/anomaly-lab.css v2
 * Anomaly Lab — module styles.
 * Two-prefix system: ftf-al-* for the page-level wrappers (matching the FTF module shell),
 * and al-* for inner elements rendered by anomaly-lab.js.
 */

:root {
  --al-bg: var(--bg-app, #0a0a0a);
  --al-bg-deep: var(--bg-deep, #050505);
  --al-panel: var(--bg-panel, #141414);
  --al-panel-hover: var(--bg-hover, #1a1a1a);
  --al-border: var(--border-strong, #2a2a2a);
  --al-border-strong: var(--border-hover, #3a3a3a);
  --al-text: var(--text-primary, #e8e8e8);
  --al-text-dim: var(--text-muted, #999);
  --al-text-faint: var(--text-muted-strong, #666);
  --al-accent: #60a5fa;
  --al-accent-soft: rgba(96,165,250,0.14);
  --al-warn: #fbbf24;
  --al-warn-soft: rgba(251,191,36,0.14);
  --al-good: #34d399;
  --al-radius: 6px;
  --al-radius-lg: 10px;

  /* ============================================================
     FTF COLOR PALETTE  (edit colors here — used app-wide)
     ============================================================ */
  --ftf-brand: #60a5fa;          /* company / brand color (placeholder = accent) */
  --ftf-brand-rgb: 96,165,250;   /* same as r,g,b for glows/alpha */

  /* Anomaly Lab signal-mix factor colors (fader === its donut slice) */
  --ff-volume-strength: #00bfff;
  --ff-price-action: #f8fbff;
  --ff-price-compression: #d7e3fc;
  --ff-dollar-volume: #ffc6ff;
  --ff-repeated-activity: #ffb000;
  --ff-off: #5a6066;             /* dormant / off grey */

  --fader-track-grey: #2a2f3a;   /* unlit slider line */
}

/* ============================================================
   PAGE WRAPPER (matches the FTF module shell pattern)
   ============================================================ */
.ftf-al-body { background: var(--al-bg); color: var(--al-text); margin: 0; font-family: Inter, system-ui, -apple-system, sans-serif; }
.ftf-al-shell { display: flex; min-height: calc(100vh - 56px); }
.ftf-al-main { flex: 1; min-width: 0; padding: 5px 10px 50px; }

.ftf-al-back { display: inline-block; color: var(--al-text-faint); font-size: 12px; text-decoration: none; margin-bottom: 14px; transition: color 120ms; }
.ftf-al-back:hover { color: var(--al-text-dim); }

.ftf-al-head { margin-bottom: 24px; }
.ftf-al-head-row { display: flex; align-items: center; gap: 16px; }
.ftf-al-head-icon { width: 56px; height: 56px; border-radius: var(--al-radius-lg); background: var(--al-accent-soft); border: 1px solid var(--al-border); display: flex; align-items: center; justify-content: center; color: var(--mod-color, var(--al-accent)); flex-shrink: 0; }
.ftf-al-head-icon svg { width: 28px; height: 28px; }
.ftf-al-head-row h1 { margin: 0 0 2px; font-size: 22px; font-weight: 600; letter-spacing: -0.01em; color: var(--al-text); }
.ftf-al-head-row p { margin: 0; color: var(--al-text-dim); font-size: 13px; }
.ftf-al-head-row > div:nth-child(2) { flex: 1; min-width: 0; }
.ftf-al-status-pill { font-size: 9px; font-weight: 700; letter-spacing: 0.12em; padding: 4px 9px; border-radius: 5px; background: var(--al-accent, #60a5fa); color: #eaf4ff; text-shadow: 0 0 5px rgba(255,255,255,0.55), 0 0 11px rgba(191,219,254,0.9); border: 1px solid rgba(255,255,255,0.28);}

.ftf-al-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 10px; align-items: start; }
.ftf-al-content { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.ftf-al-sidebar { display: flex; flex-direction: column; gap: 14px; }

/* ============================================================
   BOX (the per-section container in main content)
   ============================================================ */
.ftf-al-box { background: var(--al-panel); border: 1px solid var(--al-border); border-radius: var(--al-radius); padding: 8px 14px; }
.ftf-al-box-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 7px; flex-wrap: wrap; }
.ftf-al-box-label { font-size: 10px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--al-text-faint); }
.ftf-al-box-sub { font-size: 11px; color: var(--al-text-faint); }

/* Collapsible box (Section 4: Advanced Signal Mix) */
.ftf-al-box-collapsible .ftf-al-box-head-collapsible { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; background: transparent; border: 0; padding: 0; margin: 0; cursor: pointer; color: inherit; font-family: inherit; }
.ftf-al-box-chevron { display: inline-flex; color: var(--al-text-dim); transition: transform 180ms ease; }
.ftf-al-box-collapsible.is-open .ftf-al-box-chevron { transform: rotate(180deg); }
.ftf-al-box-body { margin-top: 14px; }
.ftf-al-box-body.is-hidden { display: none; }

/* ============================================================
   RIGHT SIDEBAR CARDS
   ============================================================ */
.ftf-al-side-card { background: var(--al-panel); border: 1px solid var(--al-border); border-radius: var(--al-radius-lg); padding: 14px 16px; }
.ftf-al-side-card h3 { font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--al-text-faint); margin: 0 0 10px; }
.ftf-al-side-card p { font-size: 12px; color: var(--al-text-dim); line-height: 1.55; margin: 0; }

.ftf-al-config { margin: 0; display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; }
.ftf-al-config dt { font-size: 12px; color: var(--al-text-dim); margin: 0; }
.ftf-al-config dd { font-size: 12px; color: var(--al-text); margin: 0; text-align: right; font-variant-numeric: tabular-nums; }

.ftf-al-detectors { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.ftf-al-detectors li { padding-bottom: 8px; border-bottom: 1px solid var(--al-border); }
.ftf-al-detectors li:last-child { border-bottom: 0; padding-bottom: 0; }
.ftf-al-detectors li.planned .ftf-al-det-name { color: var(--al-text-faint); }
.ftf-al-det-head { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.ftf-al-det-name { font-size: 12px; font-weight: 500; color: var(--al-text); }
.ftf-al-det-pill { font-size: 8px; font-weight: 700; letter-spacing: 0.1em; padding: 2px 5px; border-radius: 3px; }
.ftf-al-det-pill.live { background: rgba(52,211,153,0.14); color: var(--al-good); }
.ftf-al-det-pill.planned { background: var(--al-border); color: var(--al-text-faint); }
.ftf-al-detectors li p { margin: 4px 0 0; font-size: 11px; color: var(--al-text-faint); line-height: 1.4; }

/* ============================================================
   INNER ELEMENTS (rendered by anomaly-lab.js)
   ============================================================ */

/* Preset cards */
.al-preset-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.al-preset-card { background: var(--al-bg-deep); border: 1px solid var(--al-border); border-radius: var(--al-radius); padding: 12px; cursor: pointer; transition: border-color 120ms, background 120ms; }
.al-preset-card:hover { border-color: var(--al-border-strong); background: var(--al-panel-hover); }
.al-preset-card.is-selected { border-color: var(--al-accent); background: var(--al-accent-soft); }
.al-preset-icon { width: 32px; height: 22px; color: var(--al-accent); display: block; margin-bottom: 6px; }
.al-preset-name { font-size: 13px; font-weight: 600; margin: 4px 0 3px; color: var(--al-text); }
.al-preset-desc { font-size: 11px; color: var(--al-text-dim); line-height: 1.45; margin: 0; }

/* Scope picker */
.al-scope-list { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.al-scope-option { background: var(--al-bg-deep); border: 1px solid var(--al-border); border-radius: var(--al-radius); padding: 10px 12px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 8px; transition: border-color 120ms; }
.al-scope-option:hover:not(.is-disabled) { border-color: var(--al-border-strong); }
.al-scope-option.is-active { border-color: var(--al-accent); background: var(--al-accent-soft); }
.al-scope-option.is-disabled { cursor: not-allowed; opacity: 0.5; }
.al-scope-option-name { font-size: 12px; color: var(--al-text); }
.al-scope-option.is-disabled .al-scope-option-name { color: var(--al-text-faint); }

.al-pill { font-size: 8px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 2px 5px; border-radius: 3px; background: var(--al-border); color: var(--al-text-dim); white-space: nowrap; }
.al-pill.is-beta { background: var(--al-warn-soft); color: var(--al-warn); }
.al-pill.is-soon { background: var(--al-border); color: var(--al-text-faint); }

/* Basic controls grid */
.al-controls { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.al-control { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.al-control label { font-size: 10px; color: var(--al-text-dim); letter-spacing: 0.06em; text-transform: uppercase; }
.al-control input[type="number"], .al-control input[type="text"] { background: var(--al-bg-deep); border: 1px solid var(--al-border); color: var(--al-text); padding: 7px 9px; border-radius: var(--al-radius); font-size: 12px; font-family: inherit; min-width: 0; width: 100%; box-sizing: border-box; }
.al-control input[type="number"]:focus, .al-control input[type="text"]:focus { outline: none; border-color: var(--al-accent); }
.al-control input[type="range"] { width: 100%; accent-color: var(--al-accent); }
.al-control-range { display: grid; grid-template-columns: 1fr auto 1fr; gap: 4px; align-items: center; min-width: 0; }
.al-control-range .al-range-sep { color: var(--al-text-faint); font-size: 10px; text-align: center; }

.al-segmented { display: inline-flex; background: var(--al-bg-deep); border: 1px solid var(--al-border); border-radius: var(--al-radius); overflow: hidden; width: 100%; }
.al-segmented button { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--al-text-dim); font-size: 11px; font-family: inherit; padding: 7px 6px; cursor: pointer; border-right: 1px solid var(--al-border); }
.al-segmented button:last-child { border-right: 0; }
.al-segmented button.is-active { background: var(--al-accent-soft); color: var(--al-accent); }
.al-segmented button:hover:not(.is-active) { color: var(--al-text); }

.al-toggle { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; cursor: pointer; user-select: none; color: var(--al-text); }
.al-toggle input { accent-color: var(--al-accent); }

/* Advanced signal mix — inside collapsible box body */
.al-advanced { display: grid; grid-template-columns: 200px 1fr; gap: 22px; align-items: start; }
.al-advanced.is-hidden { display: none; }
.al-piechart { width: 180px; height: 180px; margin: 0 auto; display: block; }
.al-slider-list { display: flex; flex-direction: column; gap: 10px; }
.al-slider-row { display: grid; grid-template-columns: 130px 1fr 42px; gap: 10px; align-items: center; }
.al-slider-row .al-slider-name { font-size: 11px; color: var(--al-text); }
.al-slider-row .al-slider-value { font-size: 11px; color: var(--al-text-dim); text-align: right; font-variant-numeric: tabular-nums; }

.al-future-factors { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--al-border); grid-column: 1 / -1; }
.al-future-factors-head { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--al-text-faint); margin-bottom: 8px; }
.al-future-factor-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 6px; }
.al-future-factor { background: var(--al-bg-deep); border: 1px dashed var(--al-border); border-radius: var(--al-radius); padding: 7px 9px; display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: var(--al-text-faint); }

/* Save panel */
.al-save-panel { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; }
.al-save-status { font-size: 12px; color: var(--al-text-dim); }
.al-save-status.is-dirty { color: var(--al-warn); }
.al-save-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.al-input-name { background: var(--al-bg-deep); border: 1px solid var(--al-border); color: var(--al-text); padding: 7px 11px; border-radius: var(--al-radius); font-size: 12px; width: 200px; font-family: inherit; min-width: 0; }
.al-input-name:focus { outline: none; border-color: var(--al-accent); }
.al-btn { background: var(--al-accent); color: #000; border: 0; padding: 8px 14px; border-radius: var(--al-radius); font-size: 12px; font-weight: 600; cursor: pointer; font-family: inherit; white-space: nowrap; }
.al-btn:disabled { opacity: 0.4; cursor: not-allowed; }

/* Empty state */
.al-empty { padding: 22px 18px; text-align: center; color: var(--al-text-faint); font-size: 12px; background: var(--al-bg-deep); border: 1px solid var(--al-border); border-radius: var(--al-radius); line-height: 1.5; }

/* Responsive */
@media (max-width: 1100px) {
  .ftf-al-layout { grid-template-columns: 1fr; }
  .ftf-al-sidebar { order: 2; }
  .al-advanced { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .ftf-al-main { padding: 18px 14px 60px; }
  .al-save-panel { grid-template-columns: 1fr; }
  .al-save-actions { flex-direction: column; align-items: stretch; }
  .al-input-name { width: 100%; }
  .al-slider-row { grid-template-columns: 100px 1fr 36px; gap: 8px; }
}

/* ============================================================
   OUTER FRAME — the self-contained module shell
   ============================================================ */
.ftf-al-frame { background: var(--al-bg-deep); border: 1px solid var(--al-border); border-radius: var(--al-radius-lg); padding: 10px; }
.ftf-al-frame .ftf-al-head { margin-bottom: 5px; padding: 10px 12px 8px; border-bottom: 0; }

/* ============================================================
   HELP BUTTON + POPOVER
   ============================================================ */
.al-label-row { display: flex; align-items: center; gap: 6px; }
.al-help-btn { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--al-border-strong); background: transparent; color: var(--al-text-faint); font-size: 9px; font-weight: 700; font-family: inherit; cursor: pointer; padding: 0; line-height: 1; transition: color 120ms, border-color 120ms; }
.al-help-btn:hover, .al-help-btn:focus { color: var(--al-accent); border-color: var(--al-accent); outline: none; }

.al-popover { position: fixed; max-width: 280px; background: var(--bg-elevated, #1e1e1e); border: 1px solid var(--al-border-strong); border-radius: var(--al-radius); padding: 10px 12px; font-size: 12px; color: var(--al-text); line-height: 1.5; z-index: 1000; box-shadow: 0 6px 20px rgba(0,0,0,0.5); }

/* Narrow-viewport fallback: allow preset & markets to wrap when too cramped */
@media (max-width: 900px) {
  .al-preset-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
  .al-scope-list  { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
}


/* ============================================================
   TOP INFO STRIP — About / Default Config / Detectors
   moved out of the wrapper, now a horizontal row above it
   ============================================================ */
.ftf-al-top-info { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; align-items: start; }
.ftf-al-top-info .ftf-al-side-card { background: var(--al-panel); }
@media (max-width: 900px) { .ftf-al-top-info { grid-template-columns: 1fr; } }

/* === MOCK_MODE panels (added by sitewide mock-data pass) ============= */
/* Hit rows (Today\'s Hits) */
.al-hits-list { display: flex; flex-direction: column; gap: 8px; }
.al-hit-row {
  background: var(--al-bg-deep, var(--bg-deep, #050505));
  border: 1px solid var(--border-subtle, #1a1a1a);
  border-radius: 6px;
  padding: 10px 12px;
}
.al-hit-head { display: flex; align-items: center; gap: 10px; }
.al-hit-ticker { font-weight: 600; font-size: 13px; color: var(--text-primary, #e4e4e4); font-family: "JetBrains Mono", monospace; }
.al-hit-detector { font-size: 11px; color: var(--al-text-faint, var(--text-muted, #888)); text-transform: uppercase; letter-spacing: 0.06em; }
.al-hit-score { margin-left: auto; background: var(--bg-panel, #0f0f0f); border: 1px solid var(--border-strong, #2a2a2a); padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; color: #4a9eff; font-family: "JetBrains Mono", monospace; }
.al-hit-sub { font-size: 11px; color: var(--text-muted-strong, #6a6a6a); margin-top: 3px; }
.al-hit-reason { font-size: 12px; color: #b8b8b8; margin-top: 6px; line-height: 1.45; }
.al-hit-meta { font-size: 10px; color: var(--al-text-faint, #777); margin-top: 5px; letter-spacing: 0.03em; font-family: "JetBrains Mono", monospace; }

/* History rows (compact one-line) */
.al-history-list { display: flex; flex-direction: column; gap: 2px; }
.al-history-row {
  display: grid;
  grid-template-columns: 80px 70px 1fr 50px 2.5fr;
  gap: 10px;
  align-items: baseline;
  padding: 7px 10px;
  background: var(--al-bg-deep, var(--bg-deep, #050505));
  border: 1px solid var(--border-subtle, #151515);
  border-radius: 4px;
  font-size: 11px;
}
.al-history-date { color: var(--al-text-faint, #777); font-family: "JetBrains Mono", monospace; }
.al-history-ticker { color: var(--text-primary, #e4e4e4); font-weight: 600; font-family: "JetBrains Mono", monospace; }
.al-history-detector { color: #aaa; }
.al-history-score { color: #4a9eff; font-weight: 600; font-family: "JetBrains Mono", monospace; text-align: right; }
.al-history-reason { color: var(--text-muted, #888); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Saved Detectors panel */
.al-saved-list-panel { padding: 0; }
.al-saved-list { display: flex; flex-direction: column; gap: 6px; }
.al-saved-row {
  background: var(--al-bg-deep, var(--bg-deep, #050505));
  border: 1px solid var(--border-subtle, #1a1a1a);
  border-left: 2px solid var(--border-strong, #2a2a2a);
  border-radius: 4px;
  padding: 9px 12px;
}
.al-saved-row.is-enabled { border-left-color: #4a9eff; }
.al-saved-row.is-disabled { border-left-color: var(--border-hover, #444); opacity: 0.6; }
.al-saved-head { display: flex; align-items: center; gap: 10px; }
.al-saved-name { font-size: 12px; font-weight: 500; color: var(--text-primary, #e4e4e4); }
.al-saved-state { margin-left: auto; font-size: 9px; letter-spacing: 0.08em; color: var(--text-muted-strong, #6a6a6a); font-weight: 600; }
.al-saved-row.is-enabled .al-saved-state { color: #4a9eff; }
.al-saved-meta { font-size: 10px; color: var(--al-text-faint, #777); margin-top: 3px; font-family: "JetBrains Mono", monospace; }
.al-saved-summary { font-size: 11px; color: var(--text-muted, #999); margin-top: 5px; line-height: 1.4; }
/* === end MOCK_MODE panels =========================================== */

/* === MOCK_MODE preview button + banner =============================== */
.al-btn-ghost {
  background: transparent;
  border: 1px solid var(--border-strong, #2a2a2a);
  color: #aaa;
  margin-right: 6px;
}
.al-btn-ghost:hover { border-color: #4a9eff; color: #4a9eff; }
.al-preview-banner {
  font-size: 11px;
  color: var(--al-text-faint, var(--text-muted, #888));
  padding: 7px 10px;
  background: rgba(74, 158, 255, 0.08);
  border: 1px solid rgba(74, 158, 255, 0.25);
  border-radius: 4px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.al-preview-banner strong { color: #4a9eff; font-weight: 600; }
.al-preview-banner a { color: #aaa; text-decoration: none; margin-left: auto; }
.al-preview-banner a:hover { color: #4a9eff; }
/* === end preview button + banner ===================================== */


/* === Advanced Signal Mix on/off widget (2026-06-08) === */
.al-mix-donut-wrap { position: relative; display: block; width: 180px; margin: 0 auto; }
.al-piechart { transition: filter 220ms ease; }
.al-advanced.is-on .al-piechart { filter: drop-shadow(0 0 5px rgba(96,165,250,0.55)); }
.al-advanced.is-off .al-piechart { filter: grayscale(1) brightness(0.65); opacity: 0.85; }
.al-mix-toggle { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 56px; height: 56px; border-radius: 50%; border: 1px solid var(--border-strong, #2a2f3a); font-weight: 700; font-size: 12px; letter-spacing: 0.08em; cursor: pointer; transition: all 200ms ease; }
.al-mix-toggle.is-on { background: radial-gradient(circle at 50% 35%, #1b2740, #0b1120); color: #cfe3ff; border-color: #3b82f6; box-shadow: 0 0 16px rgba(59,130,246,0.6), inset 0 0 10px rgba(59,130,246,0.3); }
.al-mix-toggle.is-off { background: var(--bg-elevated, #14171c); color: #6b7280; box-shadow: none; }
.al-mix-toggle:hover { transform: translate(-50%, -50%) scale(1.05); }
.al-advanced .al-slider-row input[type="range"] { accent-color: var(--f, #60a5fa); }
.al-advanced.is-off .al-slider-row { opacity: 0.5; }
.al-advanced.is-off .al-slider-row .al-slider-value { color: #6b7280; }
.al-advanced.is-on .al-slider-row .al-slider-value { color: var(--f, #cfe3ff); }


/* === Advanced Signal Mix refinements (2026-06-08 b) === */
.al-advanced .al-slider-row .al-slider-name { text-align: right; }
.al-advanced .al-slider-row input[type="range"] { -webkit-appearance: none; appearance: none; height: 14px; background: transparent; cursor: pointer; }
.al-advanced .al-slider-row input[type="range"]::-webkit-slider-runnable-track { height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--f,#60a5fa) 0 var(--p,0%), #2a2f3a var(--p,0%) 100%); }
.al-advanced .al-slider-row input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; margin-top: -4.5px; border-radius: 50%; background: #fff; box-shadow: 0 0 var(--gblur,0px) var(--gspread,0px) var(--gcol,transparent); transition: box-shadow 100ms ease; }
.al-advanced .al-slider-row input[type="range"]::-moz-range-track { height: 3px; border-radius: 3px; background: #2a2f3a; }
.al-advanced .al-slider-row input[type="range"]::-moz-range-progress { height: 3px; border-radius: 3px; background: var(--f,#60a5fa); }
.al-advanced .al-slider-row input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border: none; border-radius: 50%; background: #fff; box-shadow: 0 0 var(--gblur,0px) var(--gspread,0px) var(--gcol,transparent); }
.al-advanced.is-off .al-slider-row input[type="range"]::-webkit-slider-runnable-track { background: linear-gradient(90deg, #3a4048 0 var(--p,0%), #23272e var(--p,0%) 100%); }
.al-advanced.is-off .al-slider-row input[type="range"]::-webkit-slider-thumb { background: #9aa0a8; box-shadow: none; }
.al-advanced.is-off .al-slider-row input[type="range"]::-moz-range-thumb { background: #9aa0a8; box-shadow: none; }
.al-advanced.is-off .al-slider-row input[type="range"]::-moz-range-progress { background: #3a4048; }
/* button: outer glow only (intensity set inline via JS) */
.al-mix-toggle.is-on { box-shadow: 0 0 16px rgba(59,130,246,0.5); }
/* donut inner-edge glow when on */
.al-donut-innerglow { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 118px; height: 118px; border-radius: 50%; pointer-events: none; opacity: 0; transition: opacity 220ms ease; box-shadow: inset 0 0 16px 1px rgba(96,165,250,0.55); }
.al-advanced.is-on .al-donut-innerglow { opacity: 1; }
/* Markets scope chips: centered, uppercase, normal weight, no pills */
.al-scope-option .al-pill { display: none; }
.al-scope-option { justify-content: center; }
.al-scope-option .al-scope-option-name { text-transform: uppercase; font-weight: 400; text-align: center; letter-spacing: 0.04em; width: 100%; }


/* === Advanced Signal Mix refinements v3 (2026-06-08 c) === */
/* thin slider: lit color line stays 3px, unlit grey line thinner (2px). Reused for the score slider. */
.al-advanced .al-slider-row input[type="range"],
.al-control input[type="range"] {
  -webkit-appearance: none; appearance: none; width: 100%; height: 14px; cursor: pointer;
  background: linear-gradient(var(--fader-track-grey), var(--fader-track-grey)) no-repeat center / 100% 2px;
}
.al-advanced .al-slider-row input[type="range"]::-webkit-slider-runnable-track,
.al-control input[type="range"]::-webkit-slider-runnable-track {
  height: 3px; border-radius: 3px;
  background: linear-gradient(90deg, var(--f, var(--ftf-brand)) 0 var(--p,0%), transparent var(--p,0%) 100%);
}
.al-advanced .al-slider-row input[type="range"]::-webkit-slider-thumb,
.al-control input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 12px; height: 12px; margin-top: -4.5px;
  border-radius: 50%; background: #fff;
  box-shadow: 0 0 var(--gblur,0px) var(--gspread,0px) var(--gcol, transparent);
  transition: box-shadow 100ms ease;
}
.al-advanced .al-slider-row input[type="range"]::-moz-range-track,
.al-control input[type="range"]::-moz-range-track { height: 2px; border-radius: 3px; background: var(--fader-track-grey); }
.al-advanced .al-slider-row input[type="range"]::-moz-range-progress,
.al-control input[type="range"]::-moz-range-progress { height: 3px; border-radius: 3px; background: var(--f, var(--ftf-brand)); }
.al-advanced .al-slider-row input[type="range"]::-moz-range-thumb,
.al-control input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border: none; border-radius: 50%; background: #fff; box-shadow: 0 0 var(--gblur,0px) var(--gspread,0px) var(--gcol,transparent); }
.al-advanced.is-off .al-slider-row input[type="range"]::-webkit-slider-thumb { background: #9aa0a8; box-shadow: none; }
.al-advanced.is-off .al-slider-row input[type="range"]::-moz-range-thumb { background: #9aa0a8; box-shadow: none; }
/* score slider uses the brand color */
.al-control input[type="range"] { --f: var(--ftf-brand); }

/* glows driven by brand color */
.al-advanced.is-on .al-piechart { filter: drop-shadow(0 0 5px rgba(var(--ftf-brand-rgb), 0.55)); }
.al-donut-innerglow { box-shadow: inset 0 0 16px 1px rgba(var(--ftf-brand-rgb), 0.55); }
.al-mix-toggle.is-on { box-shadow: 0 0 16px rgba(var(--ftf-brand-rgb), 0.5); border-color: var(--ftf-brand); }

/* ===== Master "Activate" toggle (header) ===== */
.ftf-al-master { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; cursor: pointer; user-select: none; }
.ftf-al-master-label { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--al-text-dim); }
.ftf-al-master input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.ftf-al-master-track { position: relative; width: 38px; height: 20px; border-radius: 999px; background: #2a2f3a; border: 1px solid var(--al-border-strong); transition: background 200ms ease, border-color 200ms ease; }
.ftf-al-master-track::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #e8e8e8; transition: transform 200ms ease; }
.ftf-al-master input:checked + .ftf-al-master-track { background: var(--ftf-brand); border-color: var(--ftf-brand); }
.ftf-al-master input:checked + .ftf-al-master-track::after { transform: translateX(18px); }

/* LIVE pill glows when active, dims when dormant */
.ftf-al-status-pill { transition: box-shadow 220ms ease, opacity 220ms ease; }
#al-root .ftf-al-status-pill { box-shadow: 0 0 5px rgba(96,165,250,0.40); }
#al-root.al-dormant .ftf-al-status-pill { box-shadow: none; opacity: 0.4; }

/* master OFF => whole module dormant (color drained) */
#al-root .ftf-al-content,
#al-root .ftf-al-sidebar { filter: grayscale(0) brightness(1); transition: filter 250ms ease; }
#al-root.al-dormant .ftf-al-content { filter: grayscale(0.75); opacity: 0.5; }


/* ───────────────────────────────────────────────
   Glow OFF — slider balls (advanced faders + score
   threshold) and donut chart (inner + outer glow).
   Center mix button glow intentionally left ON.
   (appended 2026-06-08) — delete this block to restore glows.
   ─────────────────────────────────────────────── */
.al-advanced.is-on .al-piechart { filter: none; }
.al-advanced.is-on .al-donut-innerglow { opacity: 0; }
.al-advanced .al-slider-row input[type="range"]::-webkit-slider-thumb,
.al-control input[type="range"]::-webkit-slider-thumb { box-shadow: none; }
.al-advanced .al-slider-row input[type="range"]::-moz-range-thumb,
.al-control input[type="range"]::-moz-range-thumb { box-shadow: none; }


/* ───────────────────────────────────────────────
   Title icon: grey background (matches the box bg)
   instead of the transparent blue; + blue border
   highlight when the module master is ON, grey when
   OFF. Switches instantly (no border transition — the
   fade hit the stuck-transition issue); the module-body
   on/off animation is untouched.
   (appended 2026-06-08) — delete this block to restore.
   ─────────────────────────────────────────────── */
.ftf-al-head-icon { background: var(--al-panel); }
#al-root .ftf-al-head-icon { border-color: var(--al-accent); }
#al-root.al-dormant .ftf-al-head-icon { border-color: var(--al-border); }

/* ============================================================================
   MERGED FROM volume-intelligence-v1.css on 2026-07-12
   Everything below styles the DETECTOR PANEL (all .alv1-* classes):
   detector buttons, modifier chips, score rows, section titles, scope pickers.
   Everything ABOVE styles the page shell (.ftf-al-* boxes, header, master toggle,
   scope list, advanced signal mix).
   The two files had ZERO overlapping selectors, so this merge is a pure
   concatenation - appended in the original load order, so the cascade is unchanged.
   ============================================================================ */

/* Anomaly Lab V1 -- Volume Detector Family. Self-contained, dark theme, reuses --ftf-brand. */
#al-v1-panel, #al-v1-results { color: var(--text-primary, #e7ecf3); }
.alv1-section { margin: 14px 0; }
.alv1-section-title { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: #8aa0b6; margin-bottom: 8px; font-weight: 700; }
.alv1-family-pill { display:inline-block; padding:6px 14px; border-radius:999px; background: var(--ftf-brand, #2f81f7); color: var(--text-strong, #fff); font-weight:700; font-size:13px; }
.alv1-detectors { display:flex; flex-wrap:wrap; gap:8px; }
.alv1-det-btn { padding:10px 14px; border-radius:10px; border: 1px solid #2b3a4d; background: #141c27; color: #cdd8e4; cursor:pointer; font-size:13px; font-weight:600; transition: all .12s ease; }
.alv1-det-btn:hover { border-color: var(--ftf-brand, #2f81f7); color: var(--text-strong, #fff); }
.alv1-det-btn.active { background: var(--ftf-brand, #2f81f7); border-color: var(--ftf-brand, #2f81f7); color: var(--text-strong, #fff); }
.alv1-det-purpose { margin-top:8px; font-size:12px; color: #8aa0b6; font-style:italic; }
.alv1-mods { display:flex; flex-direction:column; gap:10px; }
.alv1-mod-row { background: var(--bg-elevated, #10171f); border: 1px solid var(--border, #b5b5b5); border-radius:10px; padding:10px 12px; }
.alv1-mod-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; gap:10px; flex-wrap:wrap; }
.alv1-mod-label { font-size:13px; font-weight:700; color: var(--text-primary, #e7ecf3);  opacity: 0.9;}
.alv1-mod-current { font-size:12px; color: #8aa0b6; }
.alv1-class-row { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.alv1-class-btn { padding:5px 10px; border-radius:7px; border: 1px solid var(--border, #2b3a4d); background: var(--bg-input, #0c121a); color: var(--text-body, #aab8c8); cursor:pointer; font-size:12px; }
.alv1-class-btn:hover { border-color: var(--border-hover, #3d5a7d); color: var(--text-primary, #e7ecf3); }
.alv1-class-btn.active { background: var(--accent-muted, #1d3a5f); border-color: var(--ftf-brand, #2f81f7); color: var(--text-primary, #fff); font-weight:600; }
.alv1-num { display:flex; align-items:center; gap:6px; margin-top:8px; }
.alv1-num input { width:110px; padding:5px 8px; border-radius:7px; border: 1px solid var(--border, #2b3a4d); background: var(--bg-input, #0c121a); color: var(--text-primary, #fff); font-size:12px; }
.alv1-num-unit { font-size:11px; color: #7c8ea2; }
.alv1-scope-opts { display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
.alv1-scope-opt { display:flex; align-items:center; gap:6px; font-size:13px; color: #cdd8e4; cursor:pointer; }
.alv1-ticker-input { margin-top:8px; width:100%; max-width:440px; padding:8px 10px; border-radius:8px; border: 1px solid var(--border, #2b3a4d); background: var(--bg-input, #0c121a); color: var(--text-primary, #fff); font-size:13px; }
.alv1-preview-btn { padding:11px 24px; border:none; border-radius:10px; background: var(--ftf-brand, #2f81f7); color: var(--text-strong, #fff); font-weight:700; font-size:14px; cursor:pointer; }
.alv1-preview-btn:hover { filter:brightness(1.08); }
.alv1-result-head { font-size:13px; color: #8aa0b6; margin:4px 0 12px; line-height:1.5; }
.alv1-hit { background: var(--bg-elevated, #10171f); border: 1px solid var(--border, #1f2a37); border-radius:10px; padding:12px 14px; margin-bottom:8px; }
.alv1-hit-top { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.alv1-ticker { font-size:16px; font-weight:800; color: var(--text-strong, #fff); opacity:0.9;}
.alv1-company { font-size:12px; color: #8aa0b6; }
.alv1-date { font-size:12px; color: #7c8ea2; margin-left:auto; }
.alv1-score { padding:3px 11px; border-radius:999px; font-weight:800; font-size:13px; color: var(--text-strong, #fff); background: #3d5a7d; }
.alv1-score.s-high { background: #1f9d55; }
.alv1-score.s-mid { background: #2f81f7; }
.alv1-score.s-low { background: #5a6b7d; }
.alv1-expl { margin:8px 0 0; padding-left:18px; }
.alv1-expl li { font-size:12.5px; color: var(--text-body, #c5d2e0); margin:3px 0; }
.alv1-debug-toggle { margin-top:8px; font-size:12px; color: #6fa8ff; cursor:pointer; user-select:none; display:inline-block; }
.alv1-debug { margin-top:8px; border-top: 1px solid var(--border, #1f2a37); padding-top:8px; display:none; }
.alv1-debug.open { display:block; }
.alv1-factor { display:flex; justify-content:space-between; gap:12px; font-size:12px; padding:2px 0; color: #aab8c8; }
.alv1-factor .fname { color: #cdd8e4; font-weight:600; }
.alv1-kv { font-size:11.5px; color: #7c8ea2; margin-top:8px; word-break:break-word; line-height:1.6; }
.alv1-empty, .alv1-loading { font-size:13px; color: #8aa0b6; padding:10px 0; }
.alv1-error { font-size:13px; color: #ff8a8a; padding:10px 0; }


/* modifier in-box descriptions */
.alv1-mod-btnrow { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.alv1-mod-btnrow .alv1-class-row { flex:1 1 auto; min-width:0; }
.alv1-mod-desc { max-width:44%; text-align:right; font-size:11px; line-height:1.35; color: #8aa0b6; }


/* Markets scope: boxed-button look (mimics preset cards) */
.alv1-scope-opts { display:flex; gap:10px; flex-wrap:wrap; align-items:stretch; }
.alv1-scope-box { background: var(--al-bg-deep); border: 1px solid var(--al-border); border-radius: var(--al-radius); padding: 10px 14px; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--al-text); transition: border-color 120ms, background 120ms; }
.alv1-scope-box:hover { border-color: var(--al-border-strong); background: var(--al-panel-hover); }
.alv1-scope-box.is-selected { border-color: var(--al-accent); background: var(--al-accent-soft); }
.alv1-scope-detail { margin-top: 10px; }

/* V1 scope now owns #al-scope: drop the legacy grid so boxes sit in a row */
#al-scope { display: block; }

/* Sector scope: dotted sector list */
.alv1-sector-list { display:flex; flex-wrap:wrap; gap:8px 18px; }
.alv1-sector-opt { display:flex; align-items:center; gap:6px; font-size:13px; color: var(--al-text-dim, #8aa0b6); cursor:pointer; }
.alv1-sector-opt.is-selected { color: var(--al-text, var(--text-primary, #e8e8e8)); font-weight:600; }
.alv1-scope-hint { font-size:12px; color: var(--al-text-dim, #8aa0b6); }


/* box header already reads DETECTOR MODIFIERS - hide the duplicate inner MODIFIERS title */
.alv1-section-title.ftfmod-hide-title{display:none}