/* Ether-X Hub design tokens. Light by default; dark under [data-theme="dark"]
   and, for [data-theme="system"], under the system preference. No shadows in
   either theme: depth comes from lightness. Coral appears in the mark only. */
:root {
  --font-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-heading: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --radius-s: 6px; --radius-m: 8px; --radius-l: 12px; --nav-h: 64px;

  --page: #F8FAFC; --surface: #FFFFFF; --raised: #F1F5F9;
  --border: #E2E8F0; --border-strong: #CBD5E1; --divider: #E8EDF3; --dashed: #94A3B8;
  --text: #0F172A; --text-2: #334155; --muted: #475569;
  --action: #6520E8; --action-hover: #5016BF; --on-action: #FFFFFF;
  --link: #6520E8; --link-hover: #5016BF;
  --mark: #7C3AFF; --tint: #F5F0FF; --tint-text: #3D1296; --coral: #FF8A5B;
  --review-bg: #FBF0D9; --review-text: #6B4500;
  --good-bg: #ECFDF5; --good-text: #047857;
  --attention-bg: #FEF2F2; --attention-text: #B91C1C;
  --neutral-bg: #F1F5F9; --neutral-text: #334155;
  --avatar-bg: #E2E8F0; --avatar-text: #334155; --avatar-alt-bg: #CFFAFE; --avatar-alt-text: #155E75;
  --overlay: rgba(15, 23, 42, 0.55);
  --focus: #7C3AFF;
  color-scheme: light;
}
[data-theme="dark"] {
  --page: #020617; --surface: #0F172A; --raised: #1E293B;
  --border: #243044; --border-strong: #334155; --divider: #1B2436; --dashed: #475569;
  --text: #F8FAFC; --text-2: #CBD5E1; --muted: #94A3B8;
  --action: #7C3AFF; --action-hover: #9B68FF; --on-action: #FFFFFF;
  --link: #B894FF; --link-hover: #D4BFFF;
  --mark: #9B68FF; --tint: #1F1842; --tint-text: #D4BFFF;
  --review-bg: #2B1F06; --review-text: #FCD34D;
  --good-bg: #052E22; --good-text: #6EE7B7;
  --attention-bg: #2A0F12; --attention-text: #FCA5A5;
  --neutral-bg: #1E293B; --neutral-text: #CBD5E1;
  --avatar-bg: #334155; --avatar-text: #CBD5E1; --avatar-alt-bg: #164E63; --avatar-alt-text: #A5F3FC;
  --overlay: rgba(2, 6, 23, 0.72);
  --focus: #B894FF;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  [data-theme="system"] {
    --page: #020617; --surface: #0F172A; --raised: #1E293B;
    --border: #243044; --border-strong: #334155; --divider: #1B2436; --dashed: #475569;
    --text: #F8FAFC; --text-2: #CBD5E1; --muted: #94A3B8;
    --action: #7C3AFF; --action-hover: #9B68FF; --on-action: #FFFFFF;
    --link: #B894FF; --link-hover: #D4BFFF;
    --mark: #9B68FF; --tint: #1F1842; --tint-text: #D4BFFF;
    --review-bg: #2B1F06; --review-text: #FCD34D;
    --good-bg: #052E22; --good-text: #6EE7B7;
    --attention-bg: #2A0F12; --attention-text: #FCA5A5;
    --neutral-bg: #1E293B; --neutral-text: #CBD5E1;
    --avatar-bg: #334155; --avatar-text: #CBD5E1; --avatar-alt-bg: #164E63; --avatar-alt-text: #A5F3FC;
    --overlay: rgba(2, 6, 23, 0.72);
    --focus: #B894FF;
    color-scheme: dark;
  }
}