/**
 * WLF Systems Dashboard - Lighthouse page styles (v1, v3 design pass: docs/lighthouse-design-v3.md)
 * Ported from design/lighthouse-preview (docs/lighthouse-design-spec.md §6, §12). The live page is light; dark tokens are for the harness.
 * Every selector is scoped under #wlf-lighthouse (the page) or :is(#wlf-lighthouse, .lh-jr-root) (the shared layer the lead drawer uses).
 * Font stacks match dashboard.css (no web fonts).
 */
/* ===== Lighthouse v3 shared layer (docs/lighthouse-design-v3.md §3). Owner: Builder P.
   The lead drawer (.lh-jr-root, appended to <body>) uses these tokens and classes and never redefines them. ===== */
#wlf-lighthouse, .lh-jr-root {
  color-scheme: light;
  --lh-page: #f4f6fa; --lh-card: #ffffff; --lh-surface-2: #f8f9fc; --lh-info-bg: #eef1f6;
  --lh-border: #e3e7ef; --lh-card-border: #d5dbe6; --lh-control-border: #6b7590;
  --lh-ink: #1e2a4a; --lh-ink-muted: #4f5b76; --lh-ink-faint: #5f6b85; --lh-ink-disabled: #8a93a9;
  --lh-line: #4b5263; --lh-grid: #edf0f5; --lh-band: #e9edf4; --lh-band-edge: #808aa1; --lh-hatch: #808aa1;
  --lh-selected-bg: #0f1b3d; --lh-selected-ink: #ffffff;
  --lh-primary: #0f1b3d; --lh-primary-hover: #24305a; --lh-primary-active: #0a1330; --lh-primary-ink: #ffffff;
  --lh-hover-bg: #eef1f6; --lh-active-bg: #e3e7ef; --lh-chip-bg: #e6ebf5; --lh-row-current: #e8eefb;
  --lh-focus: #2f6fdb; --lh-rail: #c9d0dd; --lh-scrim: rgba(15, 27, 61, .16);
  --lh-sys: #a8173a; --lh-sys-bg: #fdecef; --lh-sys-border: #c9536f;
  --lh-unfav: #bf6b00; --lh-unfav-text: #8f4f00; --lh-unfav-bg: #fdf1e3;
  --lh-fav-text: #1a5ea8; --lh-fav-bg: #eaf2fc;
  --lh-ev-hatch: #e3e6ec; --lh-ev-hatch-2: #f6f7fa;
  --lh-t-call: #136b45; --lh-t-call-bg: #e2f4ea;
  --lh-t-ai: #7a2ea8; --lh-t-ai-bg: #f4e9fb;
  --lh-t-text: #2b4db3; --lh-t-text-bg: #e7ecfb;
  --lh-t-zap: #4a556f; --lh-t-zap-bg: #eceff4;
  --lh-t-sf: #1e2a4a; --lh-t-sf-ink: #ffffff;
  --lh-t-neutral: #4f5b76; --lh-t-neutral-bg: #eef1f6;
  --lh-ft-ai: #3d4a6b; --lh-ft-team: #6b7797; --lh-ft-none: #a3acc2;
  --lh-step-1: #4b5263; --lh-step-2: #6b7385; --lh-step-3: #8a91a1; --lh-step-4: #a7adba; --lh-step-5: #c3c8d2; --lh-step-6: #d6dae2;
  --lh-heat-1: #f1f3f8; --lh-heat-2: #d9dfeb; --lh-heat-3: #b4c0d8; --lh-heat-4: #8397bf; --lh-heat-5: #566ea0; --lh-heat-6: #2f4a82;
  --lh-heat-ink-lo: #1e2a4a; --lh-heat-ink-hi: #ffffff;
  --ch-paid: #00917f; --ch-local: #6553c8; --ch-organic: #6f7d1c; --ch-social: #c2479a; --ch-media: #2b7bb9;
  --ch-partner: #4d8a2a; --ch-referral: #9a5b2e; --ch-other: #5b6b8c; --ch-unmapped: #808aa1; --ch-none: #c3c8d2;
  --oc-signed: #1e2a4a; --oc-turned: #8b93a7; --oc-referred: #b3bac8; --oc-bad: #d9dde6; --oc-open: #808aa1;
  --lh-sp-1: 4px; --lh-sp-2: 8px; --lh-sp-3: 12px; --lh-sp-4: 16px; --lh-sp-5: 24px; --lh-sp-6: 32px;
  --lh-r-sm: 4px; --lh-r-md: 8px; --lh-r-lg: 12px; --lh-r-pill: 999px;
  --lh-e0: 0 1px 2px rgba(15, 27, 61, .06); --lh-shadow: 0 4px 16px rgba(15, 27, 61, .12); --lh-e2: -12px 0 32px rgba(15, 27, 61, .18);
  --lh-f-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --lh-f-cond: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --lh-f-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
}
#wlf-lighthouse[data-theme="dark"], .lh-jr-root[data-theme="dark"] {
  color-scheme: dark;
  --lh-page: #0b1530; --lh-card: #15213f; --lh-surface-2: #1a2748; --lh-info-bg: #1d2b4d;
  --lh-border: #26345c; --lh-card-border: #2e3d68; --lh-control-border: #7584a8;
  --lh-ink: #e8ecf4; --lh-ink-muted: #b3bdd1; --lh-ink-faint: #8f9bb5; --lh-ink-disabled: #5d6a8a;
  --lh-line: #b4bccc; --lh-grid: #22305a; --lh-band: #1f2d52; --lh-band-edge: #7383a8; --lh-hatch: #7383a8;
  --lh-selected-bg: #e8ecf4; --lh-selected-ink: #0b1530;
  --lh-primary: #e8ecf4; --lh-primary-hover: #c9d1e3; --lh-primary-active: #b3bdd1; --lh-primary-ink: #0b1530;
  --lh-hover-bg: #1d2b4d; --lh-active-bg: #26345c; --lh-chip-bg: #24345e; --lh-row-current: #24345e;
  --lh-focus: #6ea0ff; --lh-rail: #3a4870; --lh-scrim: rgba(0, 0, 0, .45);
  --lh-sys: #ff9ab0; --lh-sys-bg: #3d1624; --lh-sys-border: #c24466;
  --lh-unfav: #cc7f22; --lh-unfav-text: #f2b46b; --lh-unfav-bg: #3a2a14;
  --lh-fav-text: #8fc3f7; --lh-fav-bg: #16335e;
  --lh-ev-hatch: #26324f; --lh-ev-hatch-2: #1a2748;
  --lh-t-call: #5cd39a; --lh-t-call-bg: #11301f;
  --lh-t-ai: #d0a6f7; --lh-t-ai-bg: #2d1b47;
  --lh-t-text: #9fb5ff; --lh-t-text-bg: #1a2752;
  --lh-t-zap: #b3bdd1; --lh-t-zap-bg: #243154;
  --lh-t-sf: #e8ecf4; --lh-t-sf-ink: #15213f;
  --lh-t-neutral: #b3bdd1; --lh-t-neutral-bg: #1d2b4d;
  --ch-paid: #1fa596; --ch-local: #8c7ef0; --ch-organic: #9aa83a; --ch-social: #d160ad; --ch-media: #5aa2dc;
  --ch-partner: #5f9e36; --ch-referral: #c08457; --ch-other: #8d9ab8; --ch-unmapped: #7383a8; --ch-none: #3a4668;
  --oc-signed: #e8ecf4; --oc-turned: #8e99b3; --oc-referred: #5d6a8a; --oc-bad: #2c3a60; --oc-open: #7383a8;
  --lh-e0: 0 1px 2px rgba(0, 0, 0, .4); --lh-shadow: 0 4px 16px rgba(0, 0, 0, .45); --lh-e2: -12px 0 32px rgba(0, 0, 0, .5);
}

/* focus: blue, outside, no radius change (F4) */
:is(#wlf-lighthouse, .lh-jr-root) :focus { outline: none; }
:is(#wlf-lighthouse, .lh-jr-root) :focus-visible { outline: 2px solid var(--lh-focus); outline-offset: 2px; }

/* buttons: .lh-btn = SECONDARY; modifiers = primary, tertiary, icon, sm */
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; box-sizing: border-box;
  min-height: 32px; padding: 0 12px; margin: 0; border-radius: var(--lh-r-md);
  font: 500 14px/20px var(--lh-f-sans); letter-spacing: normal; text-transform: none; text-decoration: none; white-space: nowrap; cursor: pointer;
  background: var(--lh-card); color: var(--lh-ink); border: 1px solid var(--lh-control-border); box-shadow: none;
  transition: background-color 120ms, border-color 120ms, color 120ms;
}
:is(#wlf-lighthouse, .lh-jr-root) a.lh-btn:visited { color: var(--lh-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn:hover { background: var(--lh-hover-bg); border-color: var(--lh-ink); color: var(--lh-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn:active { background: var(--lh-active-bg); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn[aria-pressed="true"] { background: var(--lh-selected-bg); border-color: var(--lh-selected-bg); color: var(--lh-selected-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn svg { width: 16px; height: 16px; flex: none; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-primary,
:is(#wlf-lighthouse, .lh-jr-root) a.lh-btn.lh-btn-primary:visited { background: var(--lh-primary); border-color: var(--lh-primary); color: var(--lh-primary-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-primary:hover { background: var(--lh-primary-hover); border-color: var(--lh-primary-hover); color: var(--lh-primary-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-primary:active { background: var(--lh-primary-active); border-color: var(--lh-primary-active); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-tertiary,
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-ghost { background: transparent; border-color: transparent; color: var(--lh-ink); padding: 0 8px; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-tertiary:hover,
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-ghost:hover { background: var(--lh-hover-bg); border-color: transparent; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-icon { width: 32px; padding: 0; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-sm,
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-small { min-height: 28px; padding: 0 10px; font-size: 12px; line-height: 18px; gap: 4px; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-sm.lh-btn-icon,
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-small.lh-btn-icon { width: 28px; padding: 0; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn:disabled,
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn[aria-disabled="true"] { background: var(--lh-surface-2); border-color: var(--lh-card-border); color: var(--lh-ink-disabled); cursor: not-allowed; opacity: 1; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-tertiary:disabled,
:is(#wlf-lighthouse, .lh-jr-root) .lh-btn.lh-btn-tertiary[aria-disabled="true"] { background: transparent; border-color: transparent; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-link-btn { color: var(--lh-ink); font: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--lh-control-border); background: none; border: 0; padding: 0; cursor: pointer; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-link-btn:hover { text-decoration-color: currentColor; }

/* segmented control */
:is(#wlf-lighthouse, .lh-jr-root) .lh-seg { display: inline-flex; max-width: 100%; border: 1px solid var(--lh-control-border); border-radius: var(--lh-r-md); overflow: hidden; background: var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-seg button { min-height: 30px; padding: 0 12px; background: transparent; border: 0; border-radius: 0; font: 500 14px/20px var(--lh-f-sans); color: var(--lh-ink-muted); white-space: nowrap; cursor: pointer; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-seg button + button { border-left: 1px solid var(--lh-control-border); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-seg button:hover { background: var(--lh-hover-bg); color: var(--lh-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-seg button[aria-pressed="true"] { background: var(--lh-selected-bg); color: var(--lh-selected-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-seg button:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--lh-focus), inset 0 0 0 4px var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-seg.lh-seg-sm button { min-height: 26px; padding: 0 10px; font-size: 12px; line-height: 18px; }

/* filter chips: FILLED (F3) */
:is(#wlf-lighthouse, .lh-jr-root) .lh-fchip { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; max-width: 100%; min-width: 0; padding: 0 2px 0 10px;
  border: 1px solid var(--lh-control-border); border-radius: var(--lh-r-pill); background: var(--lh-chip-bg); color: var(--lh-ink); font: 500 12px/16px var(--lh-f-sans); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-fchip .lh-body { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; font: inherit; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-fchip.lh-ex { border-style: dashed; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-fchip.lh-ex .lh-body { text-decoration: line-through; text-decoration-thickness: 1px; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-x { width: 24px; height: 24px; flex: none; display: inline-grid; place-items: center; border-radius: 50%; color: var(--lh-ink-muted); cursor: pointer; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-x:hover { background: var(--lh-card); color: var(--lh-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-x svg { width: 12px; height: 12px; }

/* tags: labels, never clickable (lock badge, frame tag, not-applied, milestone tag) */
:is(#wlf-lighthouse, .lh-jr-root) .lh-tagx { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border: 0; border-radius: var(--lh-r-sm); background: var(--lh-info-bg); color: var(--lh-ink-muted); font: 500 12px/16px var(--lh-f-sans); white-space: nowrap; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-tagx svg { width: 14px; height: 14px; }

/* status / outcome pills: no border = a state */
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: var(--lh-r-pill); border: 0;
  background: var(--lh-info-bg); color: var(--lh-ink); font: 500 12px/16px var(--lh-f-sans); white-space: nowrap; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill svg { width: 14px; height: 14px; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--oc-open); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill[data-oc="signed"] { background: var(--oc-signed); color: var(--lh-card); font-weight: 600; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill[data-oc="signed"] .lh-pill-dot { display: none; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill[data-oc="turned_down"] .lh-pill-dot { background: var(--oc-turned); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill[data-oc="referred_out"] .lh-pill-dot { background: var(--oc-referred); box-shadow: inset 0 0 0 1px var(--lh-band-edge); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill[data-oc="bad_lead"] .lh-pill-dot { background: var(--oc-bad); box-shadow: inset 0 0 0 1px var(--lh-band-edge); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill[data-oc="open"] .lh-pill-dot { background: repeating-linear-gradient(135deg, var(--oc-open) 0 1.5px, var(--lh-band) 1.5px 3px); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill.lh-pill-leak { background: var(--lh-info-bg); color: var(--lh-ink); font-weight: 700; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-pill.lh-pill-fail { background: var(--lh-sys-bg); color: var(--lh-sys); font-weight: 600; }

/* channel chip: <span class="lh-chan" data-ch="paid"><span class="lh-chan-dot"></span>Paid search</span> */
:is(#wlf-lighthouse, .lh-jr-root) .lh-chan { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px 0 8px; border-radius: var(--lh-r-pill);
  background: var(--lh-info-bg); color: var(--lh-ink); font: 500 12px/16px var(--lh-f-sans); white-space: nowrap; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-chan-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; background: var(--ch-other); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="paid"] > .lh-chan-dot { background: var(--ch-paid); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="local"] > .lh-chan-dot { background: var(--ch-local); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="organic"] > .lh-chan-dot { background: var(--ch-organic); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="social"] > .lh-chan-dot { background: var(--ch-social); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="media"] > .lh-chan-dot { background: var(--ch-media); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="partner"] > .lh-chan-dot { background: var(--ch-partner); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="referral"] > .lh-chan-dot { background: var(--ch-referral); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="other"] > .lh-chan-dot { background: var(--ch-other); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="unmapped"] > .lh-chan-dot { background: repeating-linear-gradient(135deg, var(--ch-unmapped) 0 2px, var(--lh-band) 2px 4px); }
:is(#wlf-lighthouse, .lh-jr-root) [data-ch="none"] > .lh-chan-dot { background: repeating-linear-gradient(135deg, var(--ch-none) 0 2px, var(--lh-band) 2px 4px); box-shadow: inset 0 0 0 1px var(--lh-band-edge); }

/* AI badge after a name: "Nova Test [AI]" */
:is(#wlf-lighthouse, .lh-jr-root) .lh-ai { display: inline-flex; align-items: center; height: 18px; padding: 0 5px; margin-left: 4px; border-radius: var(--lh-r-sm);
  background: var(--lh-t-ai-bg); color: var(--lh-t-ai); font: 600 12px/16px var(--lh-f-sans); vertical-align: 1px; }

/* evidence badges (contract §12): Confirmed solid, Inferred outlined, Unknown hatched. Ink only. */
:is(#wlf-lighthouse, .lh-jr-root) .lh-ev { display: inline-flex; align-items: center; height: 20px; padding: 0 6px; border-radius: var(--lh-r-sm); border: 1px solid var(--lh-ink);
  font: 600 12px/16px var(--lh-f-sans); white-space: nowrap; vertical-align: middle; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ev-c { background: var(--lh-ink); color: var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ev-i { background: var(--lh-card); color: var(--lh-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ev-u { border-color: var(--lh-ink-faint); color: var(--lh-ink-muted);
  background: repeating-linear-gradient(45deg, var(--lh-ev-hatch) 0 3px, var(--lh-ev-hatch-2) 3px 6px); }

/* timeline type icon: <span class="lh-ticon" data-kind="call|ai|text|zap|sf|analysis|tracked|neutral"><svg/></span> */
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon { position: relative; flex: none; width: 28px; height: 28px; border-radius: 50%; display: inline-grid; place-items: center;
  background: var(--lh-t-neutral-bg); color: var(--lh-t-neutral); box-shadow: 0 0 0 3px var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon[data-kind="call"] { background: var(--lh-t-call-bg); color: var(--lh-t-call); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon[data-kind="ai"] { background: var(--lh-t-ai-bg); color: var(--lh-t-ai); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon[data-kind="text"] { background: var(--lh-t-text-bg); color: var(--lh-t-text); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon[data-kind="zap"] { background: var(--lh-t-zap-bg); color: var(--lh-t-zap); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon[data-kind="sf"] { background: var(--lh-t-sf); color: var(--lh-t-sf-ink); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon[data-kind="analysis"] { background: var(--lh-card); color: var(--lh-t-ai); box-shadow: inset 0 0 0 1.5px var(--lh-t-ai), 0 0 0 3px var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon[data-kind="tracked"] { background: var(--lh-card); color: var(--lh-ink); box-shadow: inset 0 0 0 1.5px var(--lh-ink-muted), 0 0 0 3px var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon.lh-ticon-fail::after { content: ""; position: absolute; top: -2px; right: -2px; width: 10px; height: 10px; border-radius: 50%; background: var(--lh-sys); box-shadow: 0 0 0 2px var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon.lh-ticon-sm { width: 20px; height: 20px; box-shadow: 0 0 0 2px var(--lh-card); }
:is(#wlf-lighthouse, .lh-jr-root) .lh-ticon.lh-ticon-sm svg { width: 12px; height: 12px; }

/* keyboard hint */
:is(#wlf-lighthouse, .lh-jr-root) .lh-kbd { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 4px; box-sizing: border-box;
  border: 1px solid var(--lh-card-border); border-bottom-width: 2px; border-radius: var(--lh-r-sm); background: var(--lh-card); color: var(--lh-ink-muted); font: 500 12px/16px var(--lh-f-mono); }

@media (prefers-reduced-motion: reduce) {
  :is(#wlf-lighthouse, .lh-jr-root) .lh-btn, :is(#wlf-lighthouse, .lh-jr-root) .lh-seg button { transition: none; }
}

#wlf-lighthouse { display: block; background: var(--lh-page); color: var(--lh-ink); font: 400 14px/20px var(--lh-f-sans); -webkit-font-smoothing: antialiased; text-align: left; overflow-wrap: anywhere; }

/* ---------- scoped resets (keep theme styles out) ---------- */
#wlf-lighthouse, #wlf-lighthouse *, #wlf-lighthouse *::before, #wlf-lighthouse *::after { box-sizing: border-box; }
#wlf-lighthouse h1, #wlf-lighthouse h2, #wlf-lighthouse h3, #wlf-lighthouse p, #wlf-lighthouse ol, #wlf-lighthouse ul,
#wlf-lighthouse dl, #wlf-lighthouse dd, #wlf-lighthouse dt, #wlf-lighthouse figure {
  margin: 0; padding: 0; font-family: inherit; color: inherit; text-transform: none; letter-spacing: normal; border: 0; background: none;
}
#wlf-lighthouse h1, #wlf-lighthouse h2, #wlf-lighthouse h3 { text-wrap: balance; font-weight: 600; }
#wlf-lighthouse button, #wlf-lighthouse input, #wlf-lighthouse select {
  font: inherit; color: inherit; margin: 0; text-transform: none; letter-spacing: normal; box-shadow: none; text-shadow: none; min-height: 0; width: auto; max-width: 100%;
}
#wlf-lighthouse button { cursor: pointer; background: none; border: 0; padding: 0; border-radius: 0; line-height: inherit; }
#wlf-lighthouse button:disabled { cursor: not-allowed; }
#wlf-lighthouse table { border: 0; border-collapse: collapse; margin: 0; width: 100%; background: none; table-layout: auto; }
#wlf-lighthouse th, #wlf-lighthouse td { border: 0; background: none; vertical-align: middle; }
#wlf-lighthouse summary { display: block; }
#wlf-lighthouse [hidden] { display: none !important; }
#wlf-lighthouse svg { overflow: visible; }
#wlf-lighthouse svg text { fill: var(--lh-ink-faint); font: 400 12px var(--lh-f-cond); font-variant-numeric: tabular-nums; }

/* ---------- utilities ---------- */
#wlf-lighthouse .lh-muted { color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-faint { color: var(--lh-ink-faint); }
#wlf-lighthouse .lh-mono { font-family: var(--lh-f-mono); font-size: 13px; }
#wlf-lighthouse .lh-caps { font: 600 12px/16px var(--lh-f-sans); letter-spacing: .04em; text-transform: uppercase; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#wlf-lighthouse .lh-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
#wlf-lighthouse .lh-icon { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
#wlf-lighthouse .lh-line { margin: 8px 0 0; font-size: 13px; line-height: 20px; }
#wlf-lighthouse .lh-small-note { font-size: 12px; line-height: 16px; }
#wlf-lighthouse .lh-gap { margin-left: 12px; }

/* ---------- page frame ---------- */
/* Fill the white container: the theme-builder body row is already 100%, but the Lighthouse page's own Divi row keeps
   Divi's default cap (80% / ~1080px). Widen only the row that holds the Lighthouse. */
.et_pb_row:has(#wlf-lighthouse) { width: 100% !important; max-width: 100% !important; padding-top: 0 !important; }
/* ...and drop the default Divi section top padding (54px) above it, so the page starts right under the header. */
.et_pb_section:has(#wlf-lighthouse) { padding-top: 0 !important; }
/* v3 (F6): the page is full-bleed on the Lighthouse page color (a literal: tokens do not reach the theme) */
.et_pb_section:has(#wlf-lighthouse), .et_pb_row:has(#wlf-lighthouse) { background-color: #f4f6fa !important; }
#wlf-lighthouse .lh-page { max-width: none; width: 100%; box-sizing: border-box; margin: 0 auto; padding: 24px; display: flex; flex-direction: column; gap: 24px; min-width: 0; }
#wlf-lighthouse .lh-card { background: var(--lh-card); border: 1px solid var(--lh-card-border); border-radius: var(--lh-r-lg); box-shadow: var(--lh-e0); padding: var(--lh-sp-5); min-width: 0; scroll-margin-top: 150px; }
#wlf-lighthouse .lh-card:focus-visible { outline-offset: 0; }
#wlf-lighthouse .lh-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
#wlf-lighthouse .lh-span-7 { grid-column: span 7; }
#wlf-lighthouse .lh-span-5 { grid-column: span 5; }
#wlf-lighthouse .lh-span-12 { grid-column: span 12; }
#wlf-lighthouse .lh-section-head { display: flex; flex-wrap: wrap; gap: var(--lh-sp-3) var(--lh-sp-5); align-items: flex-start; justify-content: space-between; margin-bottom: var(--lh-sp-4); }
#wlf-lighthouse .lh-section-head > div:first-child { min-width: 0; flex: 1 1 320px; }
#wlf-lighthouse .lh-section-head h2 { font: 600 20px/28px var(--lh-f-sans); color: var(--lh-ink); }
#wlf-lighthouse .lh-section-head p { margin: var(--lh-sp-1) 0 0; color: var(--lh-ink-muted); font-size: 14px; line-height: 20px; max-width: 90ch; }
#wlf-lighthouse .lh-controls { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ---------- page head ---------- */
#wlf-lighthouse .lh-head { display: flex; flex-wrap: wrap; gap: 16px 32px; justify-content: space-between; align-items: flex-start; }
#wlf-lighthouse .lh-head h1 { font: 600 28px/36px var(--lh-f-sans); display: flex; align-items: center; gap: var(--lh-sp-3); flex-wrap: wrap; color: var(--lh-ink); }
#wlf-lighthouse .lh-head-left { display: flex; flex-direction: column; gap: var(--lh-sp-2); min-width: 0; }
#wlf-lighthouse .lh-sub { margin: 0; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-tagline { font: 500 15px/22px var(--lh-f-sans); letter-spacing: .01em; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-lock { display: inline-flex; gap: 4px; align-items: center; border: 0; border-radius: var(--lh-r-sm); background: var(--lh-info-bg); color: var(--lh-ink-muted); font: 500 12px/16px var(--lh-f-sans); padding: 2px 8px; white-space: nowrap; letter-spacing: normal; text-transform: none; }
#wlf-lighthouse .lh-lock .lh-icon { width: 14px; height: 14px; }
#wlf-lighthouse .lh-head-right { display: flex; flex-direction: column; align-items: flex-end; gap: var(--lh-sp-2); }
#wlf-lighthouse .lh-head-meta { font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); display: flex; gap: var(--lh-sp-1) var(--lh-sp-3); flex-wrap: wrap; justify-content: flex-end; align-items: center; }
#wlf-lighthouse .lh-status-link { color: var(--lh-ink-muted); display: inline-flex; gap: 6px; align-items: center; font-size: 12px; line-height: 16px; }
#wlf-lighthouse .lh-status-link.lh-sys { color: var(--lh-sys); font-weight: 600; }
#wlf-lighthouse .lh-btn-row { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
#wlf-lighthouse .lh-link-btn[aria-pressed="true"] { font-weight: 600; text-decoration-color: currentColor; }

/* ---------- compact status line (shared, under the head; contract §9) ---------- */
#wlf-lighthouse .lh-statusline { display: flex; flex-wrap: wrap; gap: var(--lh-sp-1) var(--lh-sp-3); align-items: center; margin: 0; font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-sl-lab { display: inline-flex; gap: 6px; align-items: center; font-weight: 600; color: var(--lh-ink); }
#wlf-lighthouse .lh-statusline .lh-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lh-line); flex: none; }
#wlf-lighthouse .lh-statusline .lh-dot-off { background: transparent; border: 1.5px solid var(--lh-ink-faint); }
#wlf-lighthouse .lh-sl-down { display: inline-flex; gap: 4px; align-items: center; color: var(--lh-sys); font-weight: 600; }
#wlf-lighthouse .lh-sl-down .lh-icon { width: 14px; height: 14px; }
#wlf-lighthouse .lh-sl-link { font-size: 12px; line-height: 16px; }
/* feed baselines (contract §15): amber Late, red No data, and the status line takes the worst color */
#wlf-lighthouse .lh-sl-late { display: inline-flex; gap: 4px; align-items: center; color: var(--lh-unfav-text); font-weight: 600; }
#wlf-lighthouse .lh-sl-late .lh-icon { width: 14px; height: 14px; }
#wlf-lighthouse .lh-statusline .lh-dot-late { background: var(--lh-unfav-text); }
#wlf-lighthouse .lh-statusline .lh-dot-bad { background: var(--lh-sys); }
#wlf-lighthouse .lh-statusline.lh-sl-warn .lh-sl-lab { color: var(--lh-unfav-text); }
#wlf-lighthouse .lh-statusline.lh-sl-bad .lh-sl-lab { color: var(--lh-sys); }

/* ---------- tabs (contract §9): the tab bar sits in the sticky block with the filter bar; one panel per tab ---------- */
#wlf-lighthouse .lh-panel { display: flex; flex-direction: column; gap: 24px; min-width: 0; scroll-margin-top: 150px; }
#wlf-lighthouse .lh-panel:focus-visible { outline-offset: 4px; }
#wlf-lighthouse .lh-tab { padding: 10px 12px 9px; font: 600 13px/18px var(--lh-f-sans); color: var(--lh-ink-muted); white-space: nowrap; border-radius: 6px 6px 0 0; }
#wlf-lighthouse .lh-tab:hover { color: var(--lh-ink); background: var(--lh-surface-2); }
#wlf-lighthouse .lh-tab[aria-selected="true"] { color: var(--lh-ink); box-shadow: inset 0 -3px 0 var(--lh-selected-bg); }
#wlf-lighthouse .lh-tab:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--lh-focus); }
#wlf-lighthouse .lh-tab[aria-selected="true"]:focus-visible { box-shadow: inset 0 -3px 0 var(--lh-selected-bg), inset 0 0 0 2px var(--lh-focus); }
#wlf-lighthouse .lh-pages-host { min-width: 0; display: flex; flex-direction: column; gap: 24px; }
@media (min-width: 600px) {
  #wlf-lighthouse .lh-sticky { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 30; background: var(--lh-card); border: 1px solid var(--lh-card-border); border-radius: var(--lh-r-lg); box-shadow: var(--lh-e0); transition: box-shadow 150ms; }
  #wlf-lighthouse .lh-sticky.lh-scrolled { box-shadow: var(--lh-shadow); }
  #wlf-lighthouse .lh-sticky > .lh-filterbar { position: static; border: 0; border-radius: var(--lh-r-lg) var(--lh-r-lg) 0 0; background: transparent; box-shadow: none; }
  #wlf-lighthouse .lh-tabs { display: flex; gap: 2px; padding: 0 8px; border-top: 1px solid var(--lh-border); overflow-x: auto; scrollbar-width: thin; }
}
@media (max-width: 599px) {
  /* phones: only the filter bar sticks; the tab bar is a 3 × 2 grid that scrolls with the page */
  #wlf-lighthouse .lh-sticky { display: contents; }
  #wlf-lighthouse .lh-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 4px; background: var(--lh-card); border: 1px solid var(--lh-border); border-radius: 12px; }
  #wlf-lighthouse .lh-tab { white-space: normal; text-align: center; padding: 6px 4px; min-height: 40px; font-size: 12px; line-height: 15px; border-radius: 8px; }
  #wlf-lighthouse .lh-tab[aria-selected="true"] { background: var(--lh-selected-bg); color: var(--lh-selected-ink); box-shadow: none; }
  #wlf-lighthouse .lh-tab:focus-visible, #wlf-lighthouse .lh-tab[aria-selected="true"]:focus-visible { box-shadow: inset 0 0 0 2px var(--lh-focus), inset 0 0 0 4px var(--lh-card); }
  #wlf-lighthouse .lh-panel { gap: 16px; scroll-margin-top: 110px; }
  #wlf-lighthouse .lh-pages-host { gap: 16px; }
  #wlf-lighthouse .lh-card { scroll-margin-top: 110px; }
}

/* ---------- status strip (Data & health tab) ---------- */
#wlf-lighthouse .lh-status { display: flex; flex-direction: column; gap: 12px; }
#wlf-lighthouse .lh-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
#wlf-lighthouse .lh-chip { display: inline-flex; gap: var(--lh-sp-2); align-items: center; border: 1px solid var(--lh-control-border); background: var(--lh-card); border-radius: var(--lh-r-pill); min-height: 28px; padding: 0 12px; font-size: 12px; line-height: 16px; color: var(--lh-ink); text-align: left; max-width: 100%; }
#wlf-lighthouse button.lh-chip:hover { background: var(--lh-hover-bg); border-color: var(--lh-ink); }
#wlf-lighthouse .lh-chip .lh-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lh-line); flex: none; }
#wlf-lighthouse .lh-chip.lh-quiet .lh-dot { background: transparent; border: 1.5px solid var(--lh-ink-faint); }
#wlf-lighthouse .lh-chip.lh-off { border-style: dashed; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-chip.lh-off .lh-dot { background: transparent; border: 1.5px solid var(--lh-ink-faint); }
#wlf-lighthouse .lh-chip.lh-delayed { color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-chip.lh-issue { color: var(--lh-sys); border-color: var(--lh-sys-border); background: var(--lh-sys-bg); font-weight: 600; }
#wlf-lighthouse .lh-chip.lh-late { color: var(--lh-unfav-text); border-color: var(--lh-unfav-text); background: var(--lh-unfav-bg); font-weight: 600; }
#wlf-lighthouse button.lh-chip.lh-issue:hover { background: var(--lh-sys-bg); border-color: var(--lh-sys); }
#wlf-lighthouse button.lh-chip.lh-late:hover { background: var(--lh-unfav-bg); border-color: var(--lh-unfav-text); }

/* ---------- filter bar (sticky, clears the WordPress admin bar) ---------- */
#wlf-lighthouse .lh-filterbar { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 30; background: var(--lh-card); border: 1px solid var(--lh-card-border); border-radius: var(--lh-r-lg); padding: var(--lh-sp-2) var(--lh-sp-4); display: flex; flex-direction: column; gap: var(--lh-sp-2); transition: box-shadow 150ms; }
#wlf-lighthouse .lh-filterbar.lh-scrolled { box-shadow: var(--lh-shadow); }
#wlf-lighthouse .lh-fb-row { display: flex; flex-wrap: wrap; gap: var(--lh-sp-2) var(--lh-sp-4); align-items: center; }
#wlf-lighthouse .lh-fb-window { display: flex; gap: var(--lh-sp-2); align-items: center; flex-wrap: wrap; min-width: 0; }
#wlf-lighthouse .lh-fb-right { margin-left: auto; display: flex; gap: var(--lh-sp-2) var(--lh-sp-4); align-items: center; flex-wrap: wrap; }
#wlf-lighthouse .lh-fb-result { font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-fb-result .lh-fb-n { font-weight: 600; color: var(--lh-ink); }
#wlf-lighthouse .lh-map-note { margin: 0 0 var(--lh-sp-3); font-size: 12px; line-height: 16px; max-width: 110ch; }
/* Every lead map: view select ("Every lead" + System views) and the processor time line (neutral, never red) */
#wlf-lighthouse .lh-view { display: inline-flex; gap: 8px; align-items: center; min-width: 0; max-width: 100%; }
#wlf-lighthouse .lh-select { appearance: none; -webkit-appearance: none; height: 32px; padding: 0 32px 0 10px; font: 400 14px/20px var(--lh-f-sans);
  border: 1px solid var(--lh-control-border); border-radius: var(--lh-r-md); background-color: var(--lh-card); color: var(--lh-ink); min-width: 0; max-width: 100%; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f5b76' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 14px; }
#wlf-lighthouse .lh-select:hover { border-color: var(--lh-ink); }
#wlf-lighthouse[data-theme="dark"] .lh-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b3bdd1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); }
#wlf-lighthouse .lh-map-meta { margin: 0 0 var(--lh-sp-4); display: flex; gap: 6px; align-items: flex-start; font-size: 12px; line-height: 16px; max-width: 110ch; }
#wlf-lighthouse .lh-map-meta .lh-icon { width: 14px; height: 14px; margin-top: 1px; }
#wlf-lighthouse .lh-map-meta:has(+ .lh-map-meta) { margin-bottom: var(--lh-sp-1); }
#wlf-lighthouse .lh-map-meta + .lh-map-note { margin-top: 0; }
#wlf-lighthouse .lh-chip-row { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; }

/* ---------- not connected / notes / tags ---------- */
#wlf-lighthouse .lh-nc { background: none; border: 0; border-radius: 0; padding: 0; color: var(--lh-ink-muted); font-size: 14px; line-height: 20px; display: flex; gap: var(--lh-sp-2); align-items: flex-start; }
#wlf-lighthouse .lh-nc strong { color: var(--lh-ink); font-weight: 600; }
#wlf-lighthouse .lh-nc .lh-icon { margin-top: 2px; width: 16px; height: 16px; }
#wlf-lighthouse .lh-not-applied { display: inline-flex; gap: 4px; align-items: center; align-self: flex-start; border: 0; border-radius: var(--lh-r-sm); background: var(--lh-info-bg); color: var(--lh-ink-muted); font: 500 12px/16px var(--lh-f-sans); padding: 2px 8px; white-space: nowrap; letter-spacing: normal; text-transform: none; }
#wlf-lighthouse .lh-not-applied .lh-icon { width: 14px; height: 14px; }
#wlf-lighthouse .lh-frame-tag { display: inline-flex; align-items: center; border: 0; border-radius: var(--lh-r-sm); background: var(--lh-info-bg); color: var(--lh-ink-muted); font: 500 12px/16px var(--lh-f-sans); padding: 2px 8px; white-space: nowrap; letter-spacing: normal; text-transform: none; }

/* ---------- flow map ---------- */
#wlf-lighthouse .lh-focus-actions { display: flex; gap: 10px; align-items: center; margin-left: auto; flex-wrap: wrap; }
#wlf-lighthouse .lh-sankey-wrap { position: relative; min-width: 0; }
#wlf-lighthouse .lh-sankey { display: block; max-width: 100%; height: auto; }
#wlf-lighthouse .lh-sankey .lh-link { transition: opacity 150ms; cursor: pointer; }
#wlf-lighthouse .lh-sankey.lh-hovering .lh-link.lh-base { opacity: .08 !important; }
#wlf-lighthouse .lh-sankey .lh-node { cursor: pointer; outline: none; }
#wlf-lighthouse .lh-sankey .lh-node.lh-single { cursor: default; }
#wlf-lighthouse .lh-sankey .lh-node .lh-bar { stroke: var(--lh-control-border); stroke-width: 1; }
#wlf-lighthouse .lh-sankey .lh-node .lh-bar.lh-in { stroke: none; }
#wlf-lighthouse .lh-sankey .lh-node .lh-hit { stroke: none; }
#wlf-lighthouse .lh-sankey .lh-node.lh-hover .lh-bar, #wlf-lighthouse .lh-sankey .lh-node.lh-pressed .lh-bar { stroke: var(--lh-ink); stroke-width: 2; }
#wlf-lighthouse .lh-sankey .lh-node.lh-excluded .lh-bar { stroke: var(--lh-ink); stroke-width: 2; stroke-dasharray: 3 2; }
#wlf-lighthouse .lh-sankey .lh-node.lh-crumb-hl .lh-bar { stroke: var(--lh-focus); stroke-width: 3; }
#wlf-lighthouse .lh-sankey .lh-node:focus-visible .lh-bar { stroke: var(--lh-focus); stroke-width: 2.5; }
#wlf-lighthouse .lh-sankey .lh-col-title { fill: var(--lh-ink-faint); font: 600 11px var(--lh-f-sans); letter-spacing: .06em; }
#wlf-lighthouse .lh-sankey .lh-col-sub { font-weight: 400; letter-spacing: 0; }
#wlf-lighthouse .lh-sankey .lh-node-label { fill: var(--lh-ink); font: 500 12px var(--lh-f-cond); paint-order: stroke; stroke: var(--lh-card); stroke-width: 3px; stroke-linejoin: round; }
#wlf-lighthouse .lh-sankey .lh-node-label.lh-on { font-weight: 700; }
#wlf-lighthouse .lh-sankey .lh-node-label.lh-dimmed { fill: var(--lh-ink-muted); }
#wlf-lighthouse .lh-sankey .lh-node-label .lh-sub, #wlf-lighthouse .lh-sankey .lh-node-sub { fill: var(--lh-ink-faint); font: 400 11px var(--lh-f-cond); paint-order: stroke; stroke: var(--lh-card); stroke-width: 3px; stroke-linejoin: round; }
#wlf-lighthouse .lh-sankey .lh-leader { stroke: var(--lh-ink-faint); stroke-width: .75; }
#wlf-lighthouse .lh-legend { display: flex; flex-wrap: wrap; gap: var(--lh-sp-1) var(--lh-sp-4); font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); margin-top: var(--lh-sp-3); }
#wlf-lighthouse .lh-sw { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; border: 1px solid var(--lh-control-border); }
#wlf-lighthouse .lh-sw.lh-faded { background: var(--lh-line); opacity: .15; }
#wlf-lighthouse .lh-hatch { background-image: repeating-linear-gradient(135deg, var(--lh-hatch) 0 1.25px, var(--lh-band) 1.25px 6px); }
#wlf-lighthouse .lh-empty { margin-top: 4px; }
#wlf-lighthouse .lh-stack-cols { display: flex; flex-direction: column; gap: 14px; }
#wlf-lighthouse .lh-stack-col .lh-caps { margin-bottom: 4px; }
#wlf-lighthouse .lh-stack-bar { display: flex; height: 28px; border-radius: 6px; overflow: hidden; border: 1px solid var(--lh-control-border); }
#wlf-lighthouse .lh-stack-bar button { height: 100%; min-width: 3px; border-radius: 0; }
#wlf-lighthouse .lh-stack-bar button + button { box-shadow: inset 1px 0 0 var(--lh-card); }
#wlf-lighthouse .lh-stack-bar button.lh-pressed { outline: 2px solid var(--lh-ink); outline-offset: -2px; }
#wlf-lighthouse .lh-stack-sub { font-size: 11px; margin: 4px 0 2px; }
#wlf-lighthouse .lh-stack-legend { display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 12px; color: var(--lh-ink-muted); margin-top: 4px; }
#wlf-lighthouse .lh-scroll-x { overflow-x: auto; max-width: 100%; position: relative; } /* relative: clips visually-hidden children too */
#wlf-lighthouse .lh-table-view { font-size: 13px; }
#wlf-lighthouse .lh-table-view th { font: 600 11px/16px var(--lh-f-sans); letter-spacing: .04em; text-transform: uppercase; color: var(--lh-ink-faint); text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--lh-border); white-space: nowrap; }
#wlf-lighthouse .lh-table-view td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--lh-border); }
#wlf-lighthouse .lh-table-view .lh-n, #wlf-lighthouse .lh-lead-table .lh-n { text-align: right; font-variant-numeric: tabular-nums; }

/* ---------- tiles ---------- */
#wlf-lighthouse .lh-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
#wlf-lighthouse .lh-tile { background: var(--lh-card); border: 1px solid var(--lh-card-border); border-radius: var(--lh-r-lg); box-shadow: var(--lh-e0); padding: var(--lh-sp-4); display: flex; flex-direction: column; gap: var(--lh-sp-1); min-width: 0; color: var(--lh-ink); }
#wlf-lighthouse .lh-tile .lh-val { font: 600 28px/32px var(--lh-f-cond); font-variant-numeric: tabular-nums; color: var(--lh-ink); }
#wlf-lighthouse .lh-tile-sub { font-size: 12px; line-height: 16px; color: var(--lh-ink-faint); font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-tile .lh-cmp { font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-tile .lh-extra { font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); background: none; border-top: 1px solid var(--lh-border); border-radius: 0; padding: var(--lh-sp-1) 0 0; font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-tile .lh-foot { font-size: 12px; line-height: 16px; color: var(--lh-ink-faint); border-top: 1px solid var(--lh-border); padding-top: 6px; margin-top: auto; }
#wlf-lighthouse .lh-strip-wrap { margin-top: 2px; }
#wlf-lighthouse .lh-strip { display: block; width: 100%; height: 36px; }
#wlf-lighthouse .lh-strip-axis { display: flex; justify-content: space-between; font-size: 11px; line-height: 14px; color: var(--lh-ink-faint); margin-top: 2px; }
#wlf-lighthouse .lh-tile.lh-tile-nc { background: var(--lh-card); }
#wlf-lighthouse .lh-tile.lh-tile-nc .lh-val { font-size: 20px; line-height: 28px; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-tile-wide { grid-column: span 2; }
/* CallRail: how tracked calls ended (neutral ramp; voicemail hatched) */
#wlf-lighthouse .lh-split { display: flex; height: 10px; border-radius: 5px; overflow: hidden; border: 1px solid var(--lh-control-border); margin-top: 2px; }
#wlf-lighthouse .lh-split-seg { display: block; height: 100%; min-width: 2px; }
#wlf-lighthouse .lh-split-seg + .lh-split-seg { box-shadow: inset 1px 0 0 var(--lh-card); }
#wlf-lighthouse .lh-src-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 4px; }
#wlf-lighthouse .lh-src-list li { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(40px, 1fr) auto; gap: 10px; align-items: center; font-size: 13px; line-height: 18px; }
#wlf-lighthouse .lh-src-lab { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--lh-ink); }
#wlf-lighthouse .lh-src-bar { display: block; height: 8px; background: var(--lh-grid); border-radius: 4px; overflow: hidden; }
#wlf-lighthouse .lh-src-bar span { display: block; height: 100%; background: var(--lh-ft-ai); border-radius: 4px; }
#wlf-lighthouse .lh-src-n { font-variant-numeric: tabular-nums; color: var(--lh-ink-muted); font-size: 12px; white-space: nowrap; text-align: right; }

/* ---------- Salesforce outcomes: headline counts + cohort table (neutral; hatched = still maturing) ---------- */
#wlf-lighthouse .lh-sf-since { font: 600 14px/20px var(--lh-f-sans); color: var(--lh-ink); margin: 0 0 12px; }
#wlf-lighthouse .lh-sf-counts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--lh-sp-5); }
#wlf-lighthouse .lh-sf-count { border: 0; border-radius: 0; padding: 0; background: none; min-width: 0; }
#wlf-lighthouse .lh-sf-count .lh-val { font: 600 28px/32px var(--lh-f-cond); font-variant-numeric: tabular-nums; color: var(--lh-ink); margin-top: 2px; }
#wlf-lighthouse .lh-sf-cap { margin: 10px 0 0; font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); max-width: 75ch; }
#wlf-lighthouse .lh-cohort { font-size: 13px; font-variant-numeric: tabular-nums; border-collapse: separate; border-spacing: 2px; }
#wlf-lighthouse .lh-cohort thead th { font: 600 11px/16px var(--lh-f-sans); letter-spacing: .04em; text-transform: uppercase; color: var(--lh-ink-faint); text-align: left; padding: 4px 6px; vertical-align: bottom; }
#wlf-lighthouse .lh-cohort tbody th { font-weight: 500; text-align: left; padding: 5px 6px; white-space: nowrap; color: var(--lh-ink); }
#wlf-lighthouse .lh-cohort td { padding: 5px 6px; border-radius: 4px; white-space: nowrap; }
#wlf-lighthouse .lh-cohort .lh-n { text-align: right; }
#wlf-lighthouse .lh-cohort td.lh-prog { font-style: italic; color: var(--lh-ink-muted); background-image: repeating-linear-gradient(135deg, var(--lh-hatch) 0 1px, transparent 1px 6px); }
#wlf-lighthouse .lh-cohort td.lh-prog span { background: var(--lh-card); border-radius: 3px; padding: 0 4px; }
#wlf-lighthouse .lh-cohort td:focus-visible { outline-offset: -2px; }
#wlf-lighthouse .lh-cohort-bf thead th.lh-n { text-align: right; }
#wlf-lighthouse .lh-cohort td.lh-na { color: var(--lh-ink-faint); }
#wlf-lighthouse .lh-cohort td.lh-few { color: var(--lh-ink-faint); background: var(--lh-surface-2); }
#wlf-lighthouse .lh-cohort td.lh-cell:hover { outline: 1px solid var(--lh-ink); }
#wlf-lighthouse .lh-cohort-more { margin-top: var(--lh-sp-3); }
/* signed-rate headline (spec §3.5): big number never colored; only the status chip carries fav/unfav */
#wlf-lighthouse .lh-big-row { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin: 4px 0; }
#wlf-lighthouse .lh-big { font: 600 40px/44px var(--lh-f-cond); letter-spacing: -.01em; font-variant-numeric: tabular-nums; color: var(--lh-ink); }
#wlf-lighthouse .lh-flag { display: inline-flex; gap: 4px; align-items: center; border-radius: 999px; padding: 1px 8px; font: 600 12px/18px var(--lh-f-sans); white-space: nowrap; }
#wlf-lighthouse .lh-flag .lh-icon { width: 13px; height: 13px; }
#wlf-lighthouse .lh-flag-neutral { background: var(--lh-info-bg); color: var(--lh-ink-muted); font-weight: 500; }
#wlf-lighthouse .lh-flag-fav { background: var(--lh-fav-bg); color: var(--lh-fav-text); }
#wlf-lighthouse .lh-flag-unfav { background: var(--lh-unfav-bg); color: var(--lh-unfav-text); }
#wlf-lighthouse .lh-spark-wrap { margin-top: 10px; }
#wlf-lighthouse .lh-spark { display: block; }
#wlf-lighthouse .lh-spark:focus-visible { outline-offset: 3px; }
#wlf-lighthouse .lh-spark .lh-spark-zone { fill: var(--lh-ink-muted); font: 600 10px var(--lh-f-sans); letter-spacing: .06em; }
#wlf-lighthouse .lh-spark .lh-spark-end { fill: var(--lh-ink); font: 600 12px var(--lh-f-cond); }
#wlf-lighthouse .lh-hl-live { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--lh-border); }
#wlf-lighthouse .lh-hl-live .lh-line { margin-top: 2px; }

/* ---------- timing ---------- */
#wlf-lighthouse .lh-heat { display: grid; grid-template-columns: 36px repeat(24, minmax(0, 1fr)); gap: 2px; font-size: 11px; min-width: 520px; user-select: none; }
#wlf-lighthouse .lh-heat .lh-hl { color: var(--lh-ink-faint); display: flex; align-items: center; font: 600 11px var(--lh-f-sans); }
#wlf-lighthouse .lh-heat .lh-hh { color: var(--lh-ink-faint); text-align: center; font: 400 11px var(--lh-f-cond); }
#wlf-lighthouse .lh-heat .lh-c { height: 24px; border-radius: 3px; }
#wlf-lighthouse .lh-heat-legend { display: flex; gap: 4px; align-items: center; font-size: 12px; color: var(--lh-ink-muted); margin-top: 8px; flex-wrap: wrap; }
#wlf-lighthouse .lh-heat-legend .lh-sw { width: 22px; height: 12px; margin: 0; border: 0; }
#wlf-lighthouse .lh-who-svg { display: block; width: 100%; height: 140px; }
#wlf-lighthouse .lh-who-axis { position: relative; height: 18px; font-size: 11px; color: var(--lh-ink-faint); }
#wlf-lighthouse .lh-who-axis span { position: absolute; top: 2px; transform: translateX(-50%); white-space: nowrap; }
#wlf-lighthouse .lh-who-axis span:last-child { transform: translateX(-100%); }

/* ---------- finder ---------- */
#wlf-lighthouse .lh-finder-top { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
#wlf-lighthouse .lh-search { flex: 1 1 320px; min-width: 0; height: 32px; display: flex; align-items: center; gap: var(--lh-sp-2); border: 1px solid var(--lh-control-border); border-radius: var(--lh-r-md); padding: 0 10px; background: var(--lh-card); color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-search:hover { border-color: var(--lh-ink); }
#wlf-lighthouse .lh-search input { border: 0; outline: 0; background: transparent; padding: 0; flex: 1; min-width: 0; height: 30px; font-size: 14px; line-height: 20px; color: var(--lh-ink); box-shadow: none; }
#wlf-lighthouse .lh-search input:focus-visible { outline: none; }
#wlf-lighthouse .lh-search:focus-within { outline: 2px solid var(--lh-focus); outline-offset: 2px; }
#wlf-lighthouse .lh-finder-cap { margin-top: 16px; }
#wlf-lighthouse .lh-finder-msg { margin: 12px 0 0; font-size: 13px; }
#wlf-lighthouse .lh-finder-foot { font-size: 12px; line-height: 16px; margin: 0; }
#wlf-lighthouse .lh-lead-table { font-size: 13px; margin-top: 8px; }
#wlf-lighthouse .lh-lead-table th { font: 600 11px/16px var(--lh-f-sans); letter-spacing: .04em; text-transform: uppercase; color: var(--lh-ink-faint); text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--lh-border); white-space: nowrap; }
#wlf-lighthouse .lh-lead-table.lh-jn-table th:nth-child(5) { text-align: right; }
#wlf-lighthouse .lh-lead-table td { padding: 8px; border-bottom: 1px solid var(--lh-border); white-space: nowrap; text-align: left; }
#wlf-lighthouse .lh-lead-table td.lh-lines { max-width: 280px; overflow: hidden; text-overflow: ellipsis; }
#wlf-lighthouse .lh-lead-table td.lh-clip { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
#wlf-lighthouse .lh-lead-table tbody tr { cursor: pointer; }
#wlf-lighthouse .lh-lead-table tbody tr:hover td { background: var(--lh-surface-2); }
#wlf-lighthouse .lh-lead-table tbody tr:focus-visible { outline: 2px solid var(--lh-focus); outline-offset: -2px; }
/* the lead open in the drawer (v3 §5.1) */
#wlf-lighthouse .lh-lead-table tbody tr.lh-row-current td { background: var(--lh-row-current); }
#wlf-lighthouse .lh-lead-table tbody tr.lh-row-current td:first-child { box-shadow: inset 3px 0 0 var(--lh-selected-bg); }
/* Salesforce ↗ per lead row (contract §9) */
#wlf-lighthouse .lh-lead-table td.lh-sf-cell { padding-top: 4px; padding-bottom: 4px; }
#wlf-lighthouse .lh-sf-link, #wlf-lighthouse .lh-sf-link:visited { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: var(--lh-r-md); border: 1px solid transparent; background: transparent; color: var(--lh-ink); text-decoration: none; font-size: 14px; line-height: 1; }
#wlf-lighthouse .lh-sf-link:hover { border-color: var(--lh-control-border); background: var(--lh-hover-bg); color: var(--lh-ink); }
#wlf-lighthouse .lh-fl-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lh-sp-2) var(--lh-sp-4); margin-top: var(--lh-sp-3); }
#wlf-lighthouse .lh-tag { display: inline-flex; align-items: center; margin-left: 8px; border: 0; border-radius: var(--lh-r-sm); background: var(--lh-info-bg); color: var(--lh-ink-muted); font: 500 12px/16px var(--lh-f-sans); padding: 2px 8px; white-space: nowrap; letter-spacing: normal; text-transform: none; }

/* ---------- about ---------- */
#wlf-lighthouse details.lh-about summary { cursor: pointer; font: 600 16px/22px var(--lh-f-sans); list-style: none; display: flex; justify-content: space-between; align-items: center; color: var(--lh-ink); }
#wlf-lighthouse details.lh-about summary::-webkit-details-marker { display: none; }
#wlf-lighthouse details.lh-about summary::marker { content: ""; }
#wlf-lighthouse details.lh-about .lh-chev { transition: transform 150ms; }
#wlf-lighthouse details.lh-about[open] .lh-chev { transform: rotate(180deg); }
#wlf-lighthouse .lh-about-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 32px; margin-top: 16px; }
#wlf-lighthouse .lh-about-h { margin-top: 18px; }
#wlf-lighthouse .lh-about-grid > div > .lh-about-h:first-child { margin-top: 4px; }
#wlf-lighthouse .lh-about-grid dt { font-weight: 600; margin-top: 10px; }
#wlf-lighthouse .lh-about-grid dd { margin: 2px 0 0; color: var(--lh-ink-muted); max-width: 65ch; }
#wlf-lighthouse .lh-health-grid { margin-top: 0; }

/* ---------- tooltip, toast, denied ---------- */
#wlf-lighthouse .lh-tooltip { position: fixed; z-index: 99990; pointer-events: none; background: var(--lh-card); color: var(--lh-ink); border: 1px solid var(--lh-border); border-radius: 8px; padding: 10px 12px; font-size: 13px; line-height: 18px; max-width: 280px; box-shadow: var(--lh-shadow); }
#wlf-lighthouse .lh-tooltip strong { display: block; font-weight: 600; margin-bottom: 2px; }
#wlf-lighthouse .lh-tooltip .lh-muted { font-size: 12px; }
#wlf-lighthouse .lh-toast { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); background: var(--lh-selected-bg); color: var(--lh-selected-ink); padding: 10px 16px; border-radius: 8px; z-index: 99991; font-size: 13px; box-shadow: var(--lh-shadow); max-width: calc(100vw - 32px); display: flex; gap: 12px; align-items: center; }
#wlf-lighthouse .lh-denied h1 { font: 600 24px/30px var(--lh-f-sans); display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }

/* ---------- responsive ---------- */
@media (max-width: 1199px) {
  #wlf-lighthouse .lh-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  #wlf-lighthouse .lh-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  #wlf-lighthouse .lh-span-7, #wlf-lighthouse .lh-span-5, #wlf-lighthouse .lh-span-12 { grid-column: auto; }
  #wlf-lighthouse .lh-page { padding: 16px; gap: 16px; }
  #wlf-lighthouse .lh-card { padding: 16px; }
  #wlf-lighthouse .lh-head-right { align-items: flex-start; }
  #wlf-lighthouse .lh-head-meta, #wlf-lighthouse .lh-btn-row { justify-content: flex-start; }
  #wlf-lighthouse .lh-about-grid { grid-template-columns: minmax(0, 1fr); }
  #wlf-lighthouse .lh-focus-actions { margin-left: 0; }
  #wlf-lighthouse .lh-fb-right { margin-left: 0; }
}
@media (max-width: 599px) {
  #wlf-lighthouse .lh-tiles { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  #wlf-lighthouse .lh-tile-wide { grid-column: auto; }
  #wlf-lighthouse .lh-big { font-size: 40px; line-height: 44px; }
  #wlf-lighthouse .lh-src-list li { grid-template-columns: minmax(0, 1fr) auto; }
  #wlf-lighthouse .lh-src-bar { display: none; }
  #wlf-lighthouse .lh-page { padding: 16px 12px; }
  #wlf-lighthouse .lh-head h1 { font-size: 24px; line-height: 30px; }
  /* compact sticky bar on phones: one-row window control; the compare note is on every tile */
  #wlf-lighthouse .lh-filterbar { padding: var(--lh-sp-2) var(--lh-sp-3); gap: var(--lh-sp-2); }
  #wlf-lighthouse .lh-fb-row { gap: var(--lh-sp-2) var(--lh-sp-3); }
  #wlf-lighthouse .lh-fb-window { width: 100%; }
  #wlf-lighthouse .lh-fb-window > .lh-caps { display: none; }
  #wlf-lighthouse .lh-seg-win { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
  #wlf-lighthouse .lh-seg-win button { white-space: normal; padding: 4px; line-height: 16px; text-align: center; }
  #wlf-lighthouse .lh-view { flex: 1 1 auto; }
  #wlf-lighthouse .lh-select { flex: 1 1 auto; }
  #wlf-lighthouse .lh-fb-result { font-size: 12px; }
  #wlf-lighthouse .lh-search { flex-basis: 100%; }
  #wlf-lighthouse .lh-sf-counts { gap: var(--lh-sp-4); }
  #wlf-lighthouse .lh-sf-count .lh-val { font-size: 22px; line-height: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  #wlf-lighthouse *, #wlf-lighthouse *::before, #wlf-lighthouse *::after { transition: none !important; animation: none !important; }
}

#wlf-lighthouse .lh-lm-sankey .lh-node .lh-bar { stroke: none; }
#wlf-lighthouse .lh-lm-sankey .lh-node.lh-pressed .lh-bar, #wlf-lighthouse .lh-lm-sankey .lh-node:hover .lh-bar { stroke: var(--lh-ink); stroke-width: 1.25; }
#wlf-lighthouse .lh-lm-sankey .lh-node.lh-excluded .lh-bar { stroke: var(--lh-ink); stroke-width: 1.25; stroke-dasharray: 3 2; }
#wlf-lighthouse .lh-lm-sankey .lh-node:focus-visible .lh-bar { stroke: var(--lh-focus); stroke-width: 2; }
#wlf-lighthouse .lh-lm-sankey .lh-leak-ring { stroke: var(--lh-ink-muted); stroke-width: 2; stroke-dasharray: 4 3; }
#wlf-lighthouse .lh-lm-sankey .lh-link { cursor: pointer; }
#wlf-lighthouse .lh-lm-sankey .lh-link:hover { opacity: .8; }
#wlf-lighthouse .lh-sw.lh-sw-leak { border: 2px dashed var(--lh-ink-muted); background: transparent; }
#wlf-lighthouse .lh-hatch.lh-hatch-unmapped, #wlf-lighthouse .lh-ch-dot.lh-hatch-unmapped { background-image: repeating-linear-gradient(135deg, var(--ch-unmapped) 0 2px, var(--lh-band) 2px 5px); }
#wlf-lighthouse .lh-hatch.lh-hatch-none, #wlf-lighthouse .lh-ch-dot.lh-hatch-none { background-image: repeating-linear-gradient(135deg, var(--ch-none) 0 2px, var(--lh-band) 2px 5px); }
#wlf-lighthouse .lh-lm-cov { margin: 0 0 var(--lh-sp-4); }
#wlf-lighthouse .lh-lm-chips { margin: 0; padding-top: var(--lh-sp-2); border-top: 1px solid var(--lh-border); }
#wlf-lighthouse .lh-lm-chips > .lh-caps { margin-right: var(--lh-sp-1); }
#wlf-lighthouse .lh-lm-chips .lh-btn .lh-kbd { margin-left: 2px; height: 18px; min-width: 0; font-size: 12px; line-height: 14px; }
#wlf-lighthouse .lh-lm-old { display: inline-flex; align-items: center; gap: 6px; font: 400 12px/16px var(--lh-f-sans); color: var(--lh-ink-muted); cursor: pointer; }
#wlf-lighthouse .lh-lm-old input { width: 16px; height: 16px; margin: 0; accent-color: var(--lh-selected-bg); }
#wlf-lighthouse .lh-lm-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--lh-sp-4); margin: 0; }
#wlf-lighthouse .lh-lm-stat { background: var(--lh-card); border: 1px solid var(--lh-card-border); border-radius: var(--lh-r-lg); box-shadow: var(--lh-e0); padding: var(--lh-sp-3) var(--lh-sp-4); display: grid; gap: var(--lh-sp-1); }
#wlf-lighthouse .lh-lm-stat .lh-val { font: 600 22px/26px var(--lh-f-cond); font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-lm-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lh-sp-2) var(--lh-sp-4); margin: 0 0 var(--lh-sp-3); }
#wlf-lighthouse .lh-lm-toolbar .lh-search { flex: 0 1 300px; }
#wlf-lighthouse .lh-lm-count { margin-left: auto; font-size: 12px; }
#wlf-lighthouse .lh-lm-scroll { overflow: auto; max-height: 70vh; max-width: 100%; border-top: 1px solid var(--lh-border); }
#wlf-lighthouse .lh-lm-leads { margin-top: 0; }
#wlf-lighthouse .lh-lm-leads thead th { position: sticky; top: 0; z-index: 2; background: var(--lh-card); box-shadow: inset 0 -1px 0 var(--lh-border); }
#wlf-lighthouse .lh-lm-leads th:first-child, #wlf-lighthouse .lh-lm-leads td:first-child { position: sticky; left: 0; z-index: 1; background: var(--lh-card); }
#wlf-lighthouse .lh-lm-leads thead th:first-child { z-index: 3; }
#wlf-lighthouse .lh-lm-leads .lh-sort { font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; display: inline-flex; align-items: center; gap: 2px; }
#wlf-lighthouse .lh-lm-leads .lh-sort.lh-on { color: var(--lh-ink); }
#wlf-lighthouse .lh-lm-leads .lh-sort .lh-icon { width: 12px; height: 12px; }
#wlf-lighthouse .lh-lm-leads .lh-sort:focus-visible { outline-offset: -2px; }
#wlf-lighthouse .lh-lm-leads td.lh-clip { max-width: 240px; overflow: hidden; text-overflow: ellipsis; }
#wlf-lighthouse .lh-cellf { font-size: 14px; line-height: 20px; text-align: left; text-decoration: none; text-underline-offset: 3px; }
#wlf-lighthouse .lh-lead-table tbody tr:hover .lh-cellf, #wlf-lighthouse .lh-lead-table tbody tr:focus-within .lh-cellf { text-decoration: underline dotted; text-decoration-color: var(--lh-control-border); }
#wlf-lighthouse .lh-lead-table tbody tr:hover .lh-cellf::after, #wlf-lighthouse .lh-lead-table tbody tr:focus-within .lh-cellf::after {
  content: ""; display: inline-block; width: 12px; height: 12px; margin-left: 4px; vertical-align: -1px; opacity: .7;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f5b76' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5h18l-7 8v6l-4 2v-8z'/%3E%3C/svg%3E") center / 12px no-repeat; }
#wlf-lighthouse .lh-lead-table tbody tr .lh-cellf:hover { text-decoration: underline solid; text-decoration-color: currentColor; }
#wlf-lighthouse .lh-cellf + .lh-cellf { margin-left: 6px; color: var(--lh-ink-faint); font-size: 12px; line-height: 16px; }
#wlf-lighthouse .lh-ch-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 0; background: var(--lh-band-edge); }
#wlf-lighthouse .lh-chg { display: inline-block; margin-left: 6px; padding: 0 5px; border-radius: 4px; font-size: 11px; line-height: 14px; background: transparent; color: var(--lh-ink-muted); border: 1px solid var(--lh-control-border); cursor: help; }
@media (max-width: 899px) {
  #wlf-lighthouse .lh-lm-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
  #wlf-lighthouse .lh-lm-old { margin-left: 0; }
  #wlf-lighthouse .lh-lm-toolbar .lh-search { flex-basis: 100%; }
  #wlf-lighthouse .lh-lm-count { margin-left: 0; }
}

/* ---------- Concept A2 shell (approved by Hratch 2026-10-01): sidebar navigation + filters, navy filter bar, headline numbers ---------- */
/* full window: no Divi section/row spacing around the app (the Divi header and footer are removed on this page) */
.et_pb_section:has(#wlf-lighthouse), .et_pb_row:has(#wlf-lighthouse) { padding: 0 !important; }
.et_pb_row:has(#wlf-lighthouse) .et_pb_column, .et_pb_row:has(#wlf-lighthouse) .et_pb_module { margin: 0 !important; }
#wlf-lighthouse .lh-page { padding: 0; max-width: none; gap: 0; display: block; }
#wlf-lighthouse .lh-app { display: grid; grid-template-columns: 272px minmax(0, 1fr); min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px)); background: #f4f6fa; }
#wlf-lighthouse .lh-side { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); height: calc(100vh - var(--wp-admin--admin-bar--height, 0px)); display: flex; flex-direction: column; gap: 16px; padding: 18px 14px 14px; background: #0f1b3d; color: #cfd6e6; overflow: hidden; z-index: 6; }
#wlf-lighthouse .lh-brand { display: flex; flex-direction: column; gap: 4px; padding: 0 8px; }
#wlf-lighthouse .lh-backlink { color: #9fa9c3; font-size: 12px; font-weight: 600; line-height: 16px; text-decoration: none; }
#wlf-lighthouse .lh-backlink:hover, #wlf-lighthouse .lh-backlink:focus-visible { color: #fff; }
#wlf-lighthouse .lh-brand-name { color: #fff; font: 700 22px/28px var(--lh-f-sans); margin-top: 8px; letter-spacing: .01em; }
#wlf-lighthouse .lh-brand-tag { color: #9fa9c3; font-size: 12px; line-height: 16px; }
/* vertical navigation (the tablist moved into the sidebar) */
#wlf-lighthouse .lh-side .lh-tabs { display: flex; flex-direction: column; gap: 4px; border: 0; padding: 0; margin: 0; background: none; overflow: visible; box-shadow: none; }
#wlf-lighthouse .lh-side .lh-tab { display: flex; align-items: center; gap: 12px; width: 100%; height: 40px; min-height: 40px; padding: 0 12px; margin: 0; border: 0; border-radius: 10px; background: transparent; color: #cfd6e6; font: 600 14px/20px var(--lh-f-sans); text-align: left; cursor: pointer; box-shadow: none; }
#wlf-lighthouse .lh-side .lh-tab::after, #wlf-lighthouse .lh-side .lh-tab::before { display: none; }
#wlf-lighthouse .lh-side .lh-tab:hover { background: #1c2a52; color: #fff; }
#wlf-lighthouse .lh-side .lh-tab.lh-on, #wlf-lighthouse .lh-side .lh-tab[aria-selected="true"] { background: #fff; color: #0f1b3d; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); }
#wlf-lighthouse .lh-side .lh-tab .lh-icon { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wlf-lighthouse .lh-side .lh-tab:focus-visible { outline: 2px solid #6ea0ff; outline-offset: 2px; box-shadow: none; }
#wlf-lighthouse .lh-nav-badge { margin-left: auto; font-size: 11px; font-weight: 700; line-height: 18px; padding: 0 7px; border-radius: 999px; background: #8f4f00; color: #fff; }
#wlf-lighthouse .lh-nav-badge.lh-bad { background: #b42318; }
#wlf-lighthouse .lh-nav-badge[hidden] { display: none; }
/* sidebar filters: checkbox groups with live counts (shown on the Lead map) */
#wlf-lighthouse .lh-fx { display: flex; flex-direction: column; min-height: 0; flex: 1; border-top: 1px solid #23325e; padding-top: 12px; }
#wlf-lighthouse .lh-fx[hidden] { display: none; }
#wlf-lighthouse .lh-fx-head { display: flex; align-items: center; justify-content: space-between; padding: 0 8px 8px; }
#wlf-lighthouse .lh-fx-title { color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
#wlf-lighthouse .lh-fx-clear { height: 28px; padding: 0 10px; border-radius: 8px; border: 1.5px solid #8fa2d6; background: transparent; color: #fff; font: 700 12px/1 var(--lh-f-sans); cursor: pointer; }
#wlf-lighthouse .lh-fx-clear:hover { background: #fff; color: #0f1b3d; }
#wlf-lighthouse .lh-fx-clear[disabled] { border-color: #2d3c68; color: #6b779a; background: transparent; cursor: default; }
#wlf-lighthouse .lh-fx-list { overflow: auto; padding: 0 2px 8px; scrollbar-width: thin; scrollbar-color: #33437a transparent; }
#wlf-lighthouse .lh-fx-g { border-radius: 10px; margin: 0 0 4px; }
#wlf-lighthouse .lh-fx-g[open] { background: #15244b; padding-bottom: 6px; }
#wlf-lighthouse .lh-fx-g > summary { list-style: none; display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 10px; border-radius: 10px; cursor: pointer; color: #e6eaf3; font-weight: 700; font-size: 13px; }
#wlf-lighthouse .lh-fx-g > summary::-webkit-details-marker { display: none; }
#wlf-lighthouse .lh-fx-g > summary:hover { background: #1c2a52; }
#wlf-lighthouse .lh-fx-g > summary:focus-visible { outline: 2px solid #6ea0ff; outline-offset: 1px; }
#wlf-lighthouse .lh-fx-chev { margin-left: auto; width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.5; opacity: .7; transition: transform .15s; }
#wlf-lighthouse .lh-fx-g[open] .lh-fx-chev { transform: rotate(90deg); }
#wlf-lighthouse .lh-fx-n { font-size: 11px; font-weight: 800; line-height: 18px; padding: 0 7px; border-radius: 999px; background: #6ea0ff; color: #0f1b3d; }
#wlf-lighthouse .lh-fx-opt { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 5px 10px; border-radius: 8px; cursor: pointer; color: #dfe4ef; font-size: 13px; line-height: 18px; }
#wlf-lighthouse .lh-fx-opt:hover { background: #22325f; }
#wlf-lighthouse .lh-fx-opt input { width: 16px; height: 16px; margin: 0; accent-color: #6ea0ff; }
#wlf-lighthouse .lh-fx-nm { display: flex; align-items: center; gap: 7px; min-width: 0; }
#wlf-lighthouse .lh-fx-nm > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wlf-lighthouse .lh-fx-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; display: inline-block; }
#wlf-lighthouse .lh-fx-ct { font-size: 12px; font-weight: 700; color: #9fa9c3; }
#wlf-lighthouse .lh-fx-opt.lh-on { color: #fff; font-weight: 700; }
#wlf-lighthouse .lh-fx-opt.lh-on .lh-fx-ct { color: #fff; }
#wlf-lighthouse .lh-fx-opt.lh-zero { opacity: .45; }
#wlf-lighthouse .lh-fx-none { margin: 4px 10px; color: #9fa9c3; font-size: 12px; }
#wlf-lighthouse .lh-side-foot { display: flex; align-items: center; gap: 6px; padding: 8px 8px 0; border-top: 1px solid #23325e; color: #9fa9c3; font-size: 12px; }
#wlf-lighthouse .lh-side-foot .lh-icon { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
/* main column: page title, window, About */
#wlf-lighthouse .lh-main { min-width: 0; padding: 24px 32px 48px; display: flex; flex-direction: column; gap: 20px; }
#wlf-lighthouse .lh-main .lh-head { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 0; margin: 0; background: none; border: 0; }
#wlf-lighthouse .lh-main .lh-head h1 { font: 700 26px/32px var(--lh-f-sans); margin: 0; color: #1e2a4a; }
#wlf-lighthouse .lh-main .lh-head .lh-sub { margin: 2px 0 0; font-size: 13px; line-height: 18px; color: #4f5b76; }
#wlf-lighthouse .lh-main .lh-head-left { flex: 1 1 420px; min-width: 0; }
#wlf-lighthouse .lh-main .lh-head-right { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex-wrap: nowrap; flex: 0 1 auto; min-width: 0; max-width: 100%; }
#wlf-lighthouse .lh-main .lh-head .lh-statusline { margin-top: 6px; }
/* headline numbers (Lead map) */
#wlf-lighthouse .lh-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0 0 20px; }
#wlf-lighthouse .lh-kpis:empty { display: none; }
#wlf-lighthouse .lh-kpi { background: #fff; border: 1px solid #d5dbe6; border-radius: 14px; padding: 16px 18px; box-shadow: 0 1px 2px rgba(15, 27, 61, .05); }
#wlf-lighthouse .lh-kpi-l { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #4f5b76; }
#wlf-lighthouse .lh-kpi-v { font: 700 30px/38px var(--lh-f-sans); margin-top: 6px; color: #1e2a4a; }
#wlf-lighthouse .lh-kpi-s { font-size: 13px; color: #4f5b76; }
/* navy filter bar: what is shown, the count, Back and Clear all, sticky above everything they change */
#wlf-lighthouse .lh-main .lh-sticky { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 5; padding: 0; margin: 0; background: none; border: 0; box-shadow: none; }
#wlf-lighthouse .lh-main .lh-sticky[hidden] { display: none; }
#wlf-lighthouse .lh-main .lh-filterbar { background: #0f1b3d; color: #fff; border-radius: 14px; padding: 12px 16px; box-shadow: 0 6px 16px rgba(15, 27, 61, .18); border: 0; margin: 0; }
#wlf-lighthouse .lh-main .lh-fb-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#wlf-lighthouse .lh-main .lh-fb-lab { color: #aab4cf; }
#wlf-lighthouse .lh-main .lh-fb-hint { color: #c9d1e4; font-size: 13px; }
#wlf-lighthouse .lh-main .lh-fb-right { margin-left: auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; color: #fff; }
#wlf-lighthouse .lh-main .lh-fb-result { color: #fff; font-size: 14px; }
#wlf-lighthouse .lh-main .lh-fb-result strong, #wlf-lighthouse .lh-main .lh-fb-n { font-size: 18px; color: #fff; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-lm-old { color: #c9d1e4; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-chip-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; border: 0; background: none; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-fchip { background: #fff; color: #0f1b3d; border: 0; min-height: 30px; font-weight: 600; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-fchip .lh-x { background: #e6ebf5; color: #0f1b3d; border-radius: 50%; border: 0; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-btn { background: transparent; color: #fff; border: 1.5px solid #fff; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-btn:hover { background: #fff; color: #0f1b3d; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-btn-tertiary { border-color: transparent; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-btn .lh-icon { stroke: currentColor; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-kbd { border-color: rgba(255, 255, 255, .5); color: inherit; background: transparent; }
#wlf-lighthouse .lh-main .lh-filterbar :focus-visible { outline: 2px solid #6ea0ff; outline-offset: 2px; }
/* map card: Simple / Detailed switch and the selection panel */
#wlf-lighthouse .lh-seg-steps small { font-weight: 600; opacity: .75; margin-left: 4px; font-size: 11px; }
#wlf-lighthouse .lh-lm-body { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; margin-top: 12px; align-items: start; }
#wlf-lighthouse .lh-lm-body.lh-lm-wide { grid-template-columns: minmax(0, 1fr); }
#wlf-lighthouse .lh-sp { border-left: 1px solid #d5dbe6; padding-left: 24px; display: flex; flex-direction: column; gap: 14px; }
#wlf-lighthouse .lh-lm-wide .lh-sp { border-left: 0; padding-left: 0; border-top: 1px solid #d5dbe6; padding-top: 16px; display: grid; grid-template-columns: 220px minmax(0, 1fr) minmax(0, 1fr) auto; gap: 24px; align-items: start; }
#wlf-lighthouse .lh-sp-big { margin-top: 4px; font-size: 15px; color: #4f5b76; font-weight: 600; }
#wlf-lighthouse .lh-sp-big b { font: 700 34px/40px var(--lh-f-sans); color: #1e2a4a; }
#wlf-lighthouse .lh-sp-mix { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: #eef1f6; margin-top: 8px; }
#wlf-lighthouse .lh-sp-stat { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid #edf0f5; padding: 6px 0; font-size: 14px; }
#wlf-lighthouse .lh-sp-stat b { font-weight: 700; color: #1e2a4a; }
#wlf-lighthouse .lh-sp-stat b.lh-sp-warn { color: var(--lh-ink); font-weight: 800; }
#wlf-lighthouse .lh-sp-who > .lh-caps { display: block; margin-bottom: 2px; }
#wlf-lighthouse .lh-sp-actions { display: flex; gap: 8px; flex-wrap: wrap; align-self: start; }
@media (max-width: 1180px) {
  #wlf-lighthouse .lh-lm-body { grid-template-columns: minmax(0, 1fr); }
  #wlf-lighthouse .lh-sp, #wlf-lighthouse .lh-lm-wide .lh-sp { border-left: 0; padding-left: 0; border-top: 1px solid #d5dbe6; padding-top: 16px; display: flex; }
  #wlf-lighthouse .lh-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  #wlf-lighthouse .lh-app { grid-template-columns: minmax(0, 1fr); }
  #wlf-lighthouse .lh-side { position: static; height: auto; }
  #wlf-lighthouse .lh-side .lh-tabs { flex-direction: row; overflow-x: auto; }
  #wlf-lighthouse .lh-side .lh-tab { width: auto; white-space: nowrap; }
  #wlf-lighthouse .lh-fx-list { max-height: 50vh; }
  #wlf-lighthouse .lh-main { padding: 16px; }
}

/* ===================== 1.21.0 shell (docs/lighthouse-ui-overhaul-spec.md) ===================== */
/* the sticky block on every tab: the notice bar (N-1), then the active tab's SHOWING slot (spec 1.6/1.7) */
#wlf-lighthouse .lh-main .lh-sticky { display: flex; flex-direction: column; gap: 6px; }
#wlf-lighthouse .lh-fslot:empty { display: none; }
#wlf-lighthouse .lh-notice { display: flex; align-items: flex-start; gap: 6px; padding: 4px 10px; border-radius: 8px; background: var(--lh-band); color: var(--lh-ink-muted); font-size: 12px; line-height: 16px; }
#wlf-lighthouse .lh-notice .lh-icon { width: 14px; height: 14px; flex: none; margin-top: 1px; }
#wlf-lighthouse .lh-notice-text { min-width: 0; flex: 1 1 auto; }
#wlf-lighthouse .lh-notice-more { display: none; flex: none; font-size: 12px; line-height: 16px; color: var(--lh-ink); }
@media (max-width: 600px) {
  #wlf-lighthouse .lh-notice-more { display: inline; }
  #wlf-lighthouse .lh-notice:not(.lh-open) .lh-notice-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #wlf-lighthouse .lh-notice:not(.lh-open) .lh-notice-rest { display: none; }
}
@media (max-width: 599px) {
  /* phones: the whole sticky block sticks (notice + SHOWING bar), not only the filter bar */
  #wlf-lighthouse .lh-main .lh-sticky { display: flex; position: sticky; top: var(--wp-admin--admin-bar--height, 0px); }
  #wlf-lighthouse .lh-main .lh-sticky .lh-filterbar { position: static; }
}
/* the SHOWING bar standard: the navy bar on every tab that renders one */
#wlf-lighthouse .lh-showing { width: 100%; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-fb-clear { gap: 4px; }
#wlf-lighthouse .lh-restored { flex-basis: 100%; margin: 2px 0 0; font-size: 12px; line-height: 16px; color: #c9d1e4; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-restored .lh-link-btn { color: #fff; text-decoration-color: rgba(255, 255, 255, .6); }
#wlf-lighthouse .lh-main .lh-filterbar .lh-link-btn { color: #fff; }
#wlf-lighthouse .lh-main .lh-filterbar label { color: #c9d1e4; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-seg { background: transparent; border-color: #8fa2d6; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-seg button { color: #dfe4ef; }
#wlf-lighthouse .lh-main .lh-filterbar .lh-seg button[aria-pressed="true"] { background: #fff; color: #0f1b3d; }

/* the head: freshness line (W-20), loader errors (W-21), the range control (K-02), compare (K-03), actions */
#wlf-lighthouse .lh-fresh { margin: 0; font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-loaderr { display: inline-flex; gap: 6px; align-items: flex-start; font-size: 12px; line-height: 16px; color: var(--lh-unfav-text); background: var(--lh-unfav-bg); border-radius: 6px; padding: 4px 8px; font-weight: 600; max-width: 70ch; }
#wlf-lighthouse .lh-loaderr .lh-icon { width: 14px; height: 14px; margin-top: 1px; }
#wlf-lighthouse .lh-head-btns { display: flex; flex-wrap: wrap; gap: 2px 4px; justify-content: flex-end; }
#wlf-lighthouse .lh-range-ctl { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; position: relative; }
#wlf-lighthouse details.lh-range { position: relative; }
#wlf-lighthouse .lh-range-sum { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 10px; border: 1px solid var(--lh-control-border); border-radius: var(--lh-r-md); background: var(--lh-card); color: var(--lh-ink); font: 600 13px/18px var(--lh-f-sans); cursor: pointer; list-style: none; white-space: nowrap; }
#wlf-lighthouse .lh-range-sum::-webkit-details-marker { display: none; }
#wlf-lighthouse .lh-range-sum:hover { border-color: var(--lh-ink); background: var(--lh-hover-bg); }
#wlf-lighthouse .lh-range-sum .lh-chev { width: 14px; height: 14px; transition: transform 150ms; }
#wlf-lighthouse details.lh-range[open] > .lh-range-sum .lh-chev { transform: rotate(180deg); }
#wlf-lighthouse .lh-range-lab { overflow: hidden; text-overflow: ellipsis; max-width: 46ch; }
#wlf-lighthouse .lh-range-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; width: min(360px, calc(100vw - 24px)); background: var(--lh-card); border: 1px solid var(--lh-card-border); border-radius: var(--lh-r-lg); box-shadow: var(--lh-shadow); padding: 10px; display: flex; flex-direction: column; gap: 10px; }
#wlf-lighthouse .lh-range-presets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
#wlf-lighthouse .lh-range-p { text-align: left; padding: 6px 10px; border-radius: 6px; font: 500 13px/18px var(--lh-f-sans); color: var(--lh-ink); }
#wlf-lighthouse .lh-range-p:hover { background: var(--lh-hover-bg); }
#wlf-lighthouse .lh-range-p[aria-pressed="true"] { background: var(--lh-selected-bg); color: var(--lh-selected-ink); }
#wlf-lighthouse .lh-range-custom { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 10px; border-top: 1px solid var(--lh-border); padding-top: 8px; }
#wlf-lighthouse .lh-range-custom .lh-caps { flex-basis: 100%; }
#wlf-lighthouse .lh-range-custom label { display: flex; flex-direction: column; gap: 2px; font-size: 12px; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-range-custom input[type="date"] { height: 30px; padding: 0 6px; border: 1px solid var(--lh-control-border); border-radius: 6px; background: var(--lh-card); color: var(--lh-ink); font-size: 13px; }
#wlf-lighthouse .lh-range-msg { margin: 0; font-size: 12px; color: var(--lh-ink); font-weight: 600; }
#wlf-lighthouse .lh-range-msg:empty { display: none; }
#wlf-lighthouse .lh-range-arrow svg { width: 14px; height: 14px; }
#wlf-lighthouse .lh-copy-inp { min-width: 0; width: min(60vw, 520px); height: 28px; padding: 0 6px; border-radius: 4px; border: 0; font-size: 12px; color: #0f1b3d; background: #fff; }

/* KPI basis lines (W-05), deltas (K-03), (i) buttons and popover (C-13), clickable numbers (K-10) */
#wlf-lighthouse .lh-kpi-l { display: flex; align-items: center; gap: 4px; }
#wlf-lighthouse .lh-basis { font-size: 12px; line-height: 16px; color: var(--lh-ink-faint); margin-top: 2px; }
#wlf-lighthouse .lh-delta { font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); margin-top: 2px; font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-nocmp { margin: -8px 0 12px; }
#wlf-lighthouse .lh-info { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; color: var(--lh-ink-faint); flex: none; vertical-align: middle; }
#wlf-lighthouse .lh-info:hover, #wlf-lighthouse .lh-info[aria-expanded="true"] { color: var(--lh-ink); background: var(--lh-hover-bg); }
#wlf-lighthouse .lh-info .lh-icon { width: 14px; height: 14px; }
#wlf-lighthouse .lh-pop { position: fixed; z-index: 99992; max-width: min(340px, calc(100vw - 16px)); background: var(--lh-card); color: var(--lh-ink); border: 1px solid var(--lh-card-border); border-radius: 8px; padding: 10px 12px; box-shadow: var(--lh-shadow); font-size: 13px; line-height: 18px; }
#wlf-lighthouse .lh-pop strong { display: block; margin-bottom: 4px; }
#wlf-lighthouse .lh-pop p { margin: 0 0 4px; }
#wlf-lighthouse .lh-kpi-go { display: block; text-align: left; border-radius: 6px; margin-left: -4px; padding: 0 4px; }
#wlf-lighthouse .lh-kpi-go:hover { background: var(--lh-hover-bg); text-decoration: underline dotted; text-underline-offset: 6px; text-decoration-thickness: 1px; }
#wlf-lighthouse .lh-kpi-skel { min-height: 104px; display: flex; flex-direction: column; gap: 10px; }

/* the scoped About panel (C-13): a right side panel, not modal */
#wlf-lighthouse .lh-about-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(440px, 100vw); z-index: 99985; background: var(--lh-card); color: var(--lh-ink); box-shadow: var(--lh-e2); display: flex; flex-direction: column; border-left: 1px solid var(--lh-card-border); }
#wlf-lighthouse .lh-ap-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 16px; border-bottom: 1px solid var(--lh-border); }
#wlf-lighthouse .lh-ap-head h2 { font: 600 16px/22px var(--lh-f-sans); }
#wlf-lighthouse .lh-ap-body { padding: 4px 16px 24px; overflow: auto; }
#wlf-lighthouse .lh-ap-body dt { font-weight: 600; margin-top: 10px; }
#wlf-lighthouse .lh-ap-body dd { margin: 2px 0 0; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-ap-more { margin-top: 18px; }

/* exports (K-01) */
#wlf-lighthouse .lh-export svg { width: 14px; height: 14px; }
#wlf-lighthouse .lh-recon th[scope="row"] { font-weight: 600; text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--lh-border); white-space: nowrap; }
#wlf-lighthouse .lh-recon td.lh-n { white-space: nowrap; font-weight: 600; }
#wlf-lighthouse .lh-recon td.lh-n.lh-faint { font-weight: 400; }
#wlf-lighthouse .lh-affects { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 2px; font-size: 12px; line-height: 16px; color: var(--lh-ink-muted); }
#wlf-lighthouse .lh-affects li { margin: 0; padding: 0; }
#wlf-lighthouse .lh-affects strong { color: var(--lh-ink); font-weight: 600; }
#wlf-lighthouse .lh-counters .lh-section-head { margin-top: 8px; }

/* K-08 day charts */
#wlf-lighthouse .lh-chart { display: block; max-width: 100%; height: auto; }
#wlf-lighthouse .lh-chart .lh-ch-line { stroke: var(--lh-line); stroke-width: 1.8; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
#wlf-lighthouse .lh-chart .lh-ch-cmp { stroke: var(--lh-ink-faint); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
#wlf-lighthouse .lh-chart .lh-ch-base { stroke: var(--lh-grid); vector-effect: non-scaling-stroke; }
#wlf-lighthouse .lh-chart .lh-ch-cursor { stroke: var(--lh-ink-faint); stroke-dasharray: 2 2; vector-effect: non-scaling-stroke; }
#wlf-lighthouse .lh-chart .lh-ch-lab { fill: var(--lh-ink-muted); font: 600 12px var(--lh-f-sans); }
#wlf-lighthouse .lh-chart .lh-ch-end { fill: var(--lh-ink); font: 600 12px var(--lh-f-cond); }
#wlf-lighthouse .lh-chart:focus-visible { outline-offset: 3px; }
#wlf-lighthouse .lh-sw.lh-sw-line { height: 2px; border: 0; background: var(--lh-line); vertical-align: 3px; width: 16px; }
#wlf-lighthouse .lh-sw.lh-sw-dash { height: 0; border: 0; border-top: 2px dashed var(--lh-ink-faint); vertical-align: 3px; width: 16px; background: none; }
#wlf-lighthouse .lh-chart-tog { margin-left: auto; font-size: 12px; }

/* P-01b skeleton blocks (no animation under reduced motion) */
#wlf-lighthouse .lh-skel-wrap { display: flex; flex-direction: column; gap: 10px; padding: 8px 0; }
#wlf-lighthouse .lh-skel { display: block; height: 14px; border-radius: 6px; background: linear-gradient(90deg, var(--lh-band) 0%, var(--lh-surface-2) 50%, var(--lh-band) 100%); background-size: 200% 100%; animation: lh-skel 1.4s ease-in-out infinite; }
#wlf-lighthouse .lh-skel-l { width: 70%; height: 22px; }
#wlf-lighthouse .lh-skel-m { width: 50%; }
#wlf-lighthouse .lh-skel-s { width: 30%; }
@keyframes lh-skel { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

/* sidebar filters: left out values (C-06), show all (C-36), "Also filtered by" */
#wlf-lighthouse .lh-fx-opt.lh-ex .lh-fx-nm > span { text-decoration: line-through; text-decoration-thickness: 1px; }
#wlf-lighthouse .lh-fx-not { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; padding: 0 5px; border-radius: 999px; border: 1px solid #8fa2d6; color: #dfe4ef; }
#wlf-lighthouse .lh-fx-n.lh-fx-nx { background: transparent; color: #dfe4ef; border: 1px dashed #8fa2d6; }
#wlf-lighthouse .lh-fx-more { margin: 2px 10px 4px; font-size: 12px; font-weight: 700; color: #9fb7ff; text-decoration: underline; text-underline-offset: 3px; }
#wlf-lighthouse .lh-fx-also { margin: 0 8px 10px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; font-size: 12px; color: #c9d1e4; }
#wlf-lighthouse .lh-fx-also-t { flex-basis: 100%; font-weight: 700; }
#wlf-lighthouse .lh-fx-also-c { display: inline-flex; align-items: center; gap: 2px; padding: 0 2px 0 8px; min-height: 24px; border-radius: 999px; background: #1c2a52; color: #fff; }
#wlf-lighthouse .lh-fx-also-c.lh-ex > span { text-decoration: line-through; }
#wlf-lighthouse .lh-fx-also-x { width: 20px; height: 20px; display: inline-grid; place-items: center; border-radius: 50%; color: #c9d1e4; }
#wlf-lighthouse .lh-fx-also-x svg { width: 10px; height: 10px; }

/* the lead table: column chooser, page size, cells (C-22, C-23) */
#wlf-lighthouse details.lh-cols { position: relative; }
#wlf-lighthouse details.lh-cols > summary { list-style: none; }
#wlf-lighthouse details.lh-cols > summary::-webkit-details-marker { display: none; }
#wlf-lighthouse .lh-cols-menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 40; background: var(--lh-card); border: 1px solid var(--lh-card-border); border-radius: 10px; box-shadow: var(--lh-shadow); padding: 8px 12px; display: grid; gap: 4px; min-width: 200px; }
#wlf-lighthouse .lh-cols-menu label { display: flex; align-items: center; gap: 8px; font-size: 13px; white-space: nowrap; cursor: pointer; }
#wlf-lighthouse .lh-select.lh-select-sm { height: 28px; font-size: 12px; }
#wlf-lighthouse .lh-lead-table td.lh-proc { font-style: italic; }
#wlf-lighthouse .lh-chgw { display: inline-flex; align-items: center; gap: 0; }
#wlf-lighthouse[data-lh-tables] .lh-lm-scroll.lh-lm-flow { max-height: none; overflow-x: auto; overflow-y: visible; }
#wlf-lighthouse[data-lh-tables] .lh-lm-sticky th:first-child, #wlf-lighthouse[data-lh-tables] .lh-lm-sticky td:first-child { min-width: 132px; width: 132px; }
#wlf-lighthouse[data-lh-tables] .lh-lm-sticky th:nth-child(2), #wlf-lighthouse[data-lh-tables] .lh-lm-sticky td:nth-child(2) { position: sticky; left: 132px; z-index: 1; background: var(--lh-card); box-shadow: inset -1px 0 0 var(--lh-border); }
#wlf-lighthouse[data-lh-tables] .lh-lm-sticky thead th:nth-child(2) { z-index: 3; }
#wlf-lighthouse[data-lh-tables] .lh-lm-sticky tbody tr:hover td:nth-child(-n+2) { background: var(--lh-surface-2); }
#wlf-lighthouse[data-lh-tables] .lh-lm-sticky tbody tr.lh-row-current td:nth-child(-n+2) { background: var(--lh-row-current); }

/* Outcomes: In this window (C-07) */
#wlf-lighthouse #lh-oc-window .lh-sf-counts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
#wlf-lighthouse .lh-oc-later { margin: 0; }
#wlf-lighthouse .lh-cohort thead th { white-space: nowrap; }

/* MB-03 (phones): the lead map as ranked bars, the leads as cards */
#wlf-lighthouse .lh-lm-bars { display: flex; flex-direction: column; gap: 14px; }
#wlf-lighthouse .lh-lm-bars-step { display: flex; flex-direction: column; gap: 4px; }
#wlf-lighthouse .lh-lm-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 6px; gap: 2px 8px; text-align: left; padding: 6px 8px; border-radius: 8px; border: 1px solid var(--lh-border); background: var(--lh-card); }
#wlf-lighthouse .lh-lm-bar.lh-on { border-color: var(--lh-ink); box-shadow: inset 0 0 0 1px var(--lh-ink); }
#wlf-lighthouse .lh-lm-bar-lab { font-size: 13px; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wlf-lighthouse .lh-lm-bar-n { font-size: 12px; color: var(--lh-ink-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
#wlf-lighthouse .lh-lm-bar-track { grid-column: 1 / -1; display: block; height: 6px; border-radius: 3px; background: var(--lh-grid); overflow: hidden; }
#wlf-lighthouse .lh-lm-bar-track span { display: block; height: 100%; background: var(--lh-ft-ai); border-radius: 3px; }
#wlf-lighthouse .lh-lead-cards { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
#wlf-lighthouse .lh-lead-card { list-style: none; margin: 0; padding: 10px 12px; border: 1px solid var(--lh-card-border); border-radius: 10px; background: var(--lh-card); display: flex; flex-direction: column; gap: 4px; cursor: pointer; font-size: 13px; }
#wlf-lighthouse .lh-lead-card:focus-visible { outline: 2px solid var(--lh-focus); outline-offset: 2px; }
#wlf-lighthouse .lh-lc-top, #wlf-lighthouse .lh-lc-row { display: flex; justify-content: space-between; gap: 8px; min-width: 0; }
#wlf-lighthouse .lh-lc-top > span, #wlf-lighthouse .lh-lc-row > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* MB-01 (≤ 900 px): the range control first in the head, a compact sidebar, the filters as a bottom sheet */
@media (max-width: 900px) {
  #wlf-lighthouse .lh-main .lh-head-right { order: -1; width: 100%; align-items: stretch; margin-left: 0; }
  #wlf-lighthouse .lh-range-ctl, #wlf-lighthouse .lh-head-btns { justify-content: flex-start; }
  #wlf-lighthouse .lh-range-menu { left: 0; right: auto; }
  #wlf-lighthouse[data-lh-sheets] .lh-side { padding: 8px 10px; gap: 6px; }
  #wlf-lighthouse[data-lh-sheets] .lh-brand { flex-direction: row; align-items: baseline; gap: 10px; padding: 0 4px; }
  #wlf-lighthouse[data-lh-sheets] .lh-brand-name { margin-top: 0; font-size: 18px; line-height: 24px; }
  #wlf-lighthouse[data-lh-sheets] .lh-brand-tag, #wlf-lighthouse[data-lh-sheets] .lh-side-foot { display: none; }
  #wlf-lighthouse[data-lh-sheets] .lh-side .lh-tab { height: 34px; min-height: 34px; padding: 0 10px; font-size: 13px; }
  #wlf-lighthouse[data-lh-sheets] .lh-side .lh-tabs { flex-wrap: nowrap; scrollbar-width: thin; }
  #wlf-lighthouse[data-lh-sheets] :is(#lh-facets, #lh-cx-facets):not(.lh-sheet-open) { display: none; }
  #wlf-lighthouse[data-lh-sheets] :is(#lh-facets, #lh-cx-facets).lh-sheet-open { position: fixed; left: 0; right: 0; bottom: 0; max-height: 78vh; z-index: 99980; background: #0f1b3d; border-radius: 16px 16px 0 0; padding: 12px 10px calc(12px + env(safe-area-inset-bottom, 0px)); box-shadow: 0 -12px 32px rgba(15, 27, 61, .35); }
  #wlf-lighthouse[data-lh-sheets] :is(#lh-facets, #lh-cx-facets).lh-sheet-open { overflow: auto; }
  #wlf-lighthouse[data-lh-sheets] :is(#lh-facets, #lh-cx-facets).lh-sheet-open .lh-fx-list { max-height: none; overflow: visible; }
  #wlf-lighthouse[data-lh-sheets] .lh-main .lh-filterbar .lh-chip-row { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
}
@media (max-width: 600px) {
  #wlf-lighthouse .lh-range-lab { max-width: 24ch; }
  #wlf-lighthouse .lh-head-btns .lh-btn { padding: 0 6px; }
  #wlf-lighthouse #lh-oc-window .lh-sf-counts { gap: 8px; }
}

/* screen only: the print stamp */
#wlf-lighthouse .lh-print-only { display: none; }
/* K-13 print: only while FEATURES.print sets :root[data-lh-print] */
@media print {
  :root[data-lh-print] .et_pb_section:has(#wlf-lighthouse), :root[data-lh-print] .et_pb_row:has(#wlf-lighthouse) { background: #fff !important; }
  :root[data-lh-print] #wlf-lighthouse { background: #fff; }
  :root[data-lh-print] #wlf-lighthouse .lh-app { display: block; min-height: 0; background: #fff; }
  :root[data-lh-print] #wlf-lighthouse .lh-side, :root[data-lh-print] #wlf-lighthouse .lh-head-btns, :root[data-lh-print] #wlf-lighthouse .lh-range-arrow,
  :root[data-lh-print] #wlf-lighthouse .lh-btn, :root[data-lh-print] #wlf-lighthouse details.lh-cols, :root[data-lh-print] #wlf-lighthouse .lh-fx,
  :root[data-lh-print] #wlf-lighthouse .lh-lm-toolbar, :root[data-lh-print] #wlf-lighthouse .lh-fl-actions, :root[data-lh-print] #wlf-lighthouse .lh-statusline,
  :root[data-lh-print] #wlf-lighthouse .lh-info, :root[data-lh-print] #wlf-lighthouse .lh-toast, :root[data-lh-print] #wlf-lighthouse .lh-tooltip,
  :root[data-lh-print] #wlf-lighthouse .lh-pop, :root[data-lh-print] #wlf-lighthouse .lh-about-panel, :root[data-lh-print] #wlf-lighthouse .lh-notice-more,
  :root[data-lh-print] #wlf-lighthouse .lh-fb-right, :root[data-lh-print] #wlf-lighthouse .lh-sp-actions, :root[data-lh-print] #wlf-lighthouse .lh-chart-tog,
  :root[data-lh-print] #wlf-lighthouse .lh-range-menu, :root[data-lh-print] #wlf-lighthouse .lh-cmp { display: none !important; }
  :root[data-lh-print] #wlf-lighthouse .lh-print-only { display: block; margin: 0 0 6px; font-size: 11px; color: #4f5b76; }
  :root[data-lh-print] #wlf-lighthouse .lh-main { padding: 0; gap: 10px; }
  :root[data-lh-print] #wlf-lighthouse .lh-main .lh-sticky { position: static; }
  :root[data-lh-print] #wlf-lighthouse .lh-notice .lh-notice-text { white-space: normal !important; }
  :root[data-lh-print] #wlf-lighthouse .lh-notice .lh-notice-rest { display: inline !important; }
  :root[data-lh-print] #wlf-lighthouse .lh-range-sum { border: 0; padding: 0; }
  :root[data-lh-print] #wlf-lighthouse .lh-main .lh-filterbar { background: #fff; color: #1e2a4a; box-shadow: none; border: 1px solid #d5dbe6; }
  :root[data-lh-print] #wlf-lighthouse .lh-main .lh-filterbar * { color: #1e2a4a !important; }
  :root[data-lh-print] #wlf-lighthouse .lh-card, :root[data-lh-print] #wlf-lighthouse .lh-kpi, :root[data-lh-print] #wlf-lighthouse .lh-lm-stat { break-inside: avoid; box-shadow: none; }
  :root[data-lh-print] #wlf-lighthouse .lh-lm-scroll { max-height: none !important; overflow: visible !important; }
  :root[data-lh-print] #wlf-lighthouse tbody tr:nth-child(n+26) { display: none; }
  :root[data-lh-print] #wlf-lighthouse .lh-lm-body { grid-template-columns: minmax(0, 1fr); }
  :root[data-lh-print] #wlf-lighthouse .lh-sp { display: none; }
  :root[data-lh-print] #wlf-lighthouse .lh-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  :root[data-lh-print] #wlf-lighthouse .lh-lm-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  /* K-13: the Lead map (7 days) fits about 2 Letter / A4 pages */
  :root[data-lh-print] #wlf-lighthouse .lh-main { zoom: .64; }
  :root[data-lh-print] #wlf-lighthouse .lh-card { padding: 12px 14px; }
  :root[data-lh-print] #wlf-lighthouse .lh-panel, :root[data-lh-print] #wlf-lighthouse .lh-main { gap: 8px; }
  :root[data-lh-print] #wlf-lighthouse .lh-kpis { margin: 0 0 8px; gap: 8px; }
  :root[data-lh-print] #wlf-lighthouse .lh-map-legend, :root[data-lh-print] #wlf-lighthouse .lh-lm-cov, :root[data-lh-print] #wlf-lighthouse .lh-select,
  :root[data-lh-print] #wlf-lighthouse .lh-seg, :root[data-lh-print] #wlf-lighthouse .lh-controls .lh-caps, :root[data-lh-print] #wlf-lighthouse .lh-section-head p { display: none !important; }
  :root[data-lh-print] #wlf-lighthouse .lh-section-head { margin-bottom: 6px; }
  :root[data-lh-print] #wlf-lighthouse .lh-lead-table td { padding: 3px 6px; }
}
