/* Exact FeedGrowly tokens, source apps/web/src/styles/tokens.css (2026-09-05). */
html:root[data-theme] {

  --bg: #000000 !important;

  --scrim: oklch(0.08 0.01 265 / 0.68) !important;
  --surface-1: #121214 !important;
  --surface-2: #1b1b1f !important;
  --surface-3: #26262c !important;
  --ink-1: #fafafa !important;
  --ink-2: #d0d0d8 !important;

  --ink-3: #a4a4b0 !important;
  --line: #323238 !important;


  --accent: oklch(0.76 0.207 6) !important;
  --accent-soft: oklch(0.76 0.207 6 / 0.14) !important;
  --accent-line: oklch(0.76 0.207 6 / 0.42) !important;
  --accent-press: oklch(0.72 0.20 6) !important;

  --accent-ink: oklch(0.18 0.04 8) !important;


  --accent-2: oklch(0.75 0.18 313) !important;
  --accent-2-soft: oklch(0.75 0.18 313 / 0.16) !important;

  --info: oklch(0.755 0.19 267) !important;
  --info-soft: oklch(0.755 0.19 267 / 0.16) !important;

  --warm: oklch(0.74 0.165 47) !important;
  --warm-soft: oklch(0.74 0.165 47 / 0.16) !important;

  --warm-ink: oklch(0.18 0.03 47) !important;

  --gold: oklch(0.80 0.13 74) !important;
  --gold-soft: oklch(0.80 0.13 74 / 0.16) !important;

  --ok: oklch(0.72 0.15 155) !important;
  --ok-soft: oklch(0.72 0.15 155 / 0.16) !important;
  --danger: oklch(0.78 0.20 22) !important;
  --danger-soft: oklch(0.78 0.20 22 / 0.16) !important;

  --data: oklch(0.72 0.125 205) !important;
  --data-soft: oklch(0.72 0.125 205 / 0.15) !important;
  --data-line: oklch(0.72 0.125 205 / 0.40) !important;

  color-scheme: dark;
}
html:root[data-theme] {
  --shadow-pop: 0 1px 2px oklch(0 0 0 / 0.32), 0 12px 32px -10px oklch(0 0 0 / 0.55) !important;
}
html:root[data-theme="light"], html:root[data-theme="hybrid"] {

  --bg: #ffffff !important;
  --surface-1: oklch(1 0 0) !important;
  --surface-2: #f6f6f8 !important;
  --surface-3: #ededf0 !important;
  --ink-1: #18181b !important;
  --ink-2: #45454f !important;

  --ink-3: #64646e !important;
  --line: #dedee5 !important;


  --accent: oklch(0.50 0.20 8) !important;
  --accent-soft: oklch(0.50 0.20 8 / 0.12) !important;
  --accent-line: oklch(0.50 0.20 8 / 0.40) !important;
  --accent-press: oklch(0.46 0.20 8) !important;
  --accent-ink: oklch(0.99 0 0) !important;

  --accent-2: oklch(0.44 0.17 313) !important;
  --accent-2-soft: oklch(0.44 0.17 313 / 0.12) !important;

  --info: oklch(0.50 0.19 267) !important;
  --info-soft: oklch(0.50 0.19 267 / 0.12) !important;

  --warm: oklch(0.49 0.16 47) !important;
  --warm-soft: oklch(0.49 0.16 47 / 0.13) !important;

  --warm-ink: oklch(0.99 0 0) !important;

  --gold: oklch(0.465 0.13 74) !important;
  --gold-soft: oklch(0.465 0.13 74 / 0.14) !important;


  --ok: oklch(0.45 0.15 155) !important;
  --ok-soft: oklch(0.45 0.15 155 / 0.13) !important;
  --danger: oklch(0.495 0.20 22) !important;
  --danger-soft: oklch(0.495 0.20 22 / 0.13) !important;


  --data: oklch(0.455 0.125 210) !important;
  --data-soft: oklch(0.455 0.125 210 / 0.12) !important;
  --data-line: oklch(0.455 0.125 210 / 0.38) !important;


  --scrim: oklch(0.22 0.012 265 / 0.55) !important;

  color-scheme: light;
}
html:root[data-theme="light"], html:root[data-theme="hybrid"] {
  --ease: cubic-bezier(0.25, 1, 0.5, 1) !important;
  --dur-1: 140ms !important;
  --dur-2: 200ms !important;
  --dur-3: 280ms !important;

  --shadow-pop: 0 1px 2px oklch(0 0 0 / 0.06), 0 8px 24px -8px oklch(0 0 0 / 0.14) !important;
}

html:root[data-theme] {
 --accent-deep: var(--accent-press) !important;
 --fg-cyan: var(--data); --fg-cyan-bright: var(--data);
 --fg-cyan-wire: var(--data); --fg-cyan-selected: var(--data-line);
 --fg-cyan-glow: var(--data-soft);
 --color-acid-lime: var(--accent) !important; --lx-acid-lime: var(--accent) !important;
 --lx-acid-lime-deep: var(--accent-press) !important; --lx-acid-lime-hi: var(--accent) !important;
 --color-pulse-green: var(--ok) !important; --lx-pulse-green: var(--ok) !important; --lx-green-text: var(--ok) !important;
 --color-coral-red: var(--danger) !important; --lx-coral-red: var(--danger) !important; --lx-coral-text: var(--danger) !important;
 --color-signal-teal: var(--data) !important; --lx-signal-teal: var(--data) !important; --lx-teal-text: var(--data) !important;
 --color-lavender: var(--info) !important; --lx-lavender: var(--info) !important; --lx-lavender-text: var(--info) !important;
 --color-iris-violet: var(--accent-2) !important; --lx-iris-violet: var(--accent-2) !important; --lx-violet-text: var(--accent-2) !important;
 --color-amber: var(--warm) !important; --lx-amber: var(--warm) !important;
 --success: var(--ok) !important; --bad: var(--danger) !important; --error: var(--danger) !important;
 --live: var(--ok) !important; --warning: var(--warm) !important;
 --lx-wash-lime: var(--accent-soft) !important; --lx-wash-active: var(--accent-soft) !important;
 --lx-wash-teal: var(--data-soft) !important; --lx-wash-green: var(--ok-soft) !important;
 --lx-wash-coral: var(--danger-soft) !important; --lx-wash-violet: var(--accent-2-soft) !important;
 --lx-wash-lavender: var(--info-soft) !important;
}
html:root[data-theme] .sidebar .nav-item.active,
html:root[data-theme] .fg-nav-group:has(.nav-item.active) > .fg-nav-heading,
html:root[data-theme] .sidebar .nav-item.active .nav-icon,
html:root[data-theme] .fg-global-preferences [aria-pressed="true"] {
 color: var(--accent) !important;
}
html:root[data-theme] .sidebar .nav-item.active { background:var(--accent-soft) !important; border-color:var(--accent-line) !important; }
html:root[data-theme] :is(.auto-subnav-item,.fg-channel-item).active { color:var(--accent) !important; background:var(--accent-soft) !important; border-color:var(--accent-line) !important; }
html:root[data-theme] :is(button,a,input,textarea,select,[tabindex]):focus-visible { outline-color:var(--accent) !important; }
html:root[data-theme] .main-area :is(.page,#page-crm,#page-dashboard) :is(h1,h2,.page-title,.lx-topbar-title) { color:var(--ink-1) !important; }
html:root[data-theme] .main-area :is(.lx-kpi-val,.lx-stat-val,.lx-big,.igm-kpi-value,.igm-eng-kpi-value) { color:var(--data) !important; }
html:root[data-theme] #dnew-root {
 --dn-accent:var(--data) !important; --dn-accent-deep:var(--data) !important; --dn-ig:var(--data) !important;
}
html:root[data-theme] .main-area :is(.page,#page-crm) :is(.crm-card,.crm-column,.auto-card,.wa-auto-card),
html:root[data-theme] :is(#acv-react,#flow-ov) .nc { border-color:var(--line) !important; box-shadow:none !important; }
html:root[data-theme] :is(#acv-react,#flow-ov) .nc.selected { border-color:var(--accent) !important; }
html:root[data-theme] :is(#acv-react,#acv,#flow-ov) .fg-default-edge-label { display:none !important; }
/* One scroll owner. Legacy desktop 100vh + hidden overflow clipped the lower panels. */
html:root[data-theme] #page-ig-metrics.page.active { display:block !important; height:auto !important; min-height:0 !important; overflow:visible !important; }
html:root[data-theme] #page-ig-metrics > .lx-scroll { height:auto !important; max-height:none !important; overflow:visible !important; flex:none !important; }
html:root[data-theme] .main-area:has(#page-ig-metrics.active) { overflow-y:auto !important; align-items:stretch !important; }
html:root[data-theme] #page-ig-metrics > header { flex-wrap:wrap; height:auto !important; }
html:root[data-theme] #ig-profile-root { display:block; min-width:0; width:100%; }
html:root[data-theme] #page-ig-metrics.ig-profile-mirrored > :not(#ig-profile-root) { display:none !important; }
/* Renderer-owned base paths stay continuous; the decorative pass is separate. */
html:root[data-theme] #acv-react .react-flow__edge-path,
html:root[data-theme] #flow-ov .react-flow__edge-path,
html:root[data-theme] #flow-ov #fw-wires .fw-wire-path,
html:root[data-theme] #acv .acv-wire {
  stroke: var(--fg-cyan-wire) !important;
  stroke-width: 1.75 !important;
  stroke-dasharray: none !important;
  animation: none !important;
  filter: none !important;
  opacity: .8;
}
html:root[data-theme] :is(#acv-react,#flow-ov) .react-flow__edge.selected .react-flow__edge-path,
html:root[data-theme] #acv .acv-wire.selected {
  stroke: var(--fg-cyan-bright) !important;
  opacity: 1;
}
html:root[data-theme] :is(#acv-react,#acv,#flow-ov) path.fg-cyan-wire-pass {
  fill: none !important;
  stroke: var(--fg-cyan-bright) !important;
  stroke-width: 2 !important;
  stroke-linecap: round;
  stroke-dasharray: 45 955 !important;
  stroke-dashoffset: 0;
  opacity: .72;
  filter: drop-shadow(0 0 2px var(--fg-cyan-glow)) !important;
  pointer-events: none !important;
  animation: fg-cyan-wire-pass 8s linear infinite !important;
}
html:root[data-theme] :is(#acv-react,#flow-ov) .react-flow__handle,
html:root[data-theme] #acv .acv-port {
  border-color: var(--fg-cyan-selected) !important;
}
html:root[data-theme].fg-cyan-paused path.fg-cyan-wire-pass {
  animation-play-state: paused !important;
}
@keyframes fg-cyan-wire-pass {
  to { stroke-dashoffset: -1000; }
}
@media (prefers-reduced-motion: reduce) {
  html:root[data-theme] :is(#acv-react,#acv,#flow-ov) path.fg-cyan-wire-pass {
    animation: none !important;
    display: none !important;
  }
}
@media (forced-colors: active) {
  html:root[data-theme] :is(#acv-react,#flow-ov) .react-flow__edge-path,
  html:root[data-theme] #acv .acv-wire {
    stroke: CanvasText !important;
  }
  html:root[data-theme] path.fg-cyan-wire-pass { display: none !important; }
}