/* OpenAkita desktop design tokens, from apps/setup-center/src/styles.css. */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --bg-app: #f4f5f7;
  --bg-app-grad: linear-gradient(180deg, #f4f5f7, #e2e8f0);
  --bg1: #f0f2f5;
  --panel: rgba(255, 255, 255, 0.88);
  --panel2: rgba(255, 255, 255, 0.95);
  --line: rgba(17, 24, 39, 0.10);
  --text: rgba(17, 24, 39, 0.95);
  --muted: rgba(17, 24, 39, 0.55);
  --muted2: rgba(17, 24, 39, 0.40);
  --danger: #ef4444;
  --ok: #10b981;
  --brand: #2563eb;
  --brand2: #1d4ed8;
  --shadow: 0 8px 32px rgba(17, 24, 39, 0.08);
  --glow-shadow: 0 4px 24px rgba(37, 99, 235, 0.15);
  --glass-blur: blur(16px);
  --radius: 12px;
  --radius-sm: 8px;
  --fg: var(--text);
  --matrix-dot: rgba(17, 24, 39, 0.06);
  --matrix-bg: var(--bg-app);
  --nav-hover: rgba(37, 99, 235, 0.06);
  --nav-active: rgba(37, 99, 235, 0.1);
  --nav-active-border: rgba(37, 99, 235, 0.18);
  --bg: #f4f5f7;
  --border: rgba(17, 24, 39, 0.12);
  --warning: #f59e0b;
  --primary: #2563eb;
  --success: #10b981;
  --error: #ef4444;
  --text-secondary: rgba(17, 24, 39, 0.55);
  --fg-secondary: rgba(17, 24, 39, 0.50);
  --panel-glass: rgba(255, 255, 255, 0.06);
  --card-bg: #ffffff;
  --bg-subtle: #f1f5f9;
  --ok-bg: #dcfce7;
  --err-bg: #fee2e2;
  --warn-bg: #fef3c7;
  --warn: #d97706;
  --err: #dc2626;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg-app: #09090b;
  --bg-app-grad: linear-gradient(180deg, #09090b, #18181b);
  --bg1: #18181b;
  --panel: rgba(24, 24, 27, 0.88);
  --panel2: rgba(39, 39, 42, 0.92);
  --line: rgba(255, 255, 255, 0.12);
  --text: rgba(255, 255, 255, 0.92);
  --muted: rgba(255, 255, 255, 0.55);
  --muted2: rgba(255, 255, 255, 0.35);
  --danger: #ef4444;
  --ok: #10b981;
  --brand: #60a5fa;
  --brand2: #93c5fd;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  --glow-shadow: 0 4px 24px rgba(96, 165, 250, 0.2);
  --glass-blur: blur(16px);
  --radius: 12px;
  --radius-sm: 8px;
  --fg: var(--text);
  --matrix-dot: rgba(255, 255, 255, 0.06);
  --matrix-bg: var(--bg-app);
  --nav-hover: rgba(96, 165, 250, 0.1);
  --nav-active: rgba(96, 165, 250, 0.15);
  --nav-active-border: rgba(96, 165, 250, 0.3);
  --bg: #09090b;
  --border: rgba(255, 255, 255, 0.14);
  --warning: #fbbf24;
  --primary: #60a5fa;
  --success: #34d399;
  --error: #f87171;
  --card-bg: #27272a;
  --text-secondary: rgba(255, 255, 255, 0.50);
  --fg-secondary: rgba(255, 255, 255, 0.45);
  --panel-glass: rgba(255, 255, 255, 0.03);
  --bg-subtle: rgba(255, 255, 255, 0.07);
  --ok-bg: rgba(16, 185, 129, 0.15);
  --err-bg: rgba(239, 68, 68, 0.15);
  --warn-bg: rgba(245, 158, 11, 0.15);
  --warn: #fbbf24;
  --err: #f87171;
}

/* ── Daltonized (colorblind-friendly) themes ── */
:root[data-theme="daltonized-light"] {
  color-scheme: light;
  --bg-app: #f4f5f7;
  --bg-app-grad: linear-gradient(180deg, #f4f5f7, #e2e8f0);
  --bg1: #f0f2f5;
  --panel: rgba(255, 255, 255, 0.88);
  --panel2: rgba(255, 255, 255, 0.95);
  --line: rgba(17, 24, 39, 0.10);
  --text: rgba(17, 24, 39, 0.95);
  --muted: rgba(17, 24, 39, 0.55);
  --muted2: rgba(17, 24, 39, 0.40);
  --danger: #d97706;
  --ok: #2563eb;
  --brand: #2563eb;
  --brand2: #1d4ed8;
  --shadow: 0 8px 32px rgba(17, 24, 39, 0.08);
  --glow-shadow: 0 4px 24px rgba(37, 99, 235, 0.15);
  --glass-blur: blur(16px);
  --radius: 12px;
  --radius-sm: 8px;
  --fg: var(--text);
  --matrix-dot: rgba(17, 24, 39, 0.06);
  --matrix-bg: var(--bg-app);
  --nav-hover: rgba(37, 99, 235, 0.06);
  --nav-active: rgba(37, 99, 235, 0.1);
  --nav-active-border: rgba(37, 99, 235, 0.18);
  --bg: #f4f5f7;
  --border: rgba(17, 24, 39, 0.12);
  --warning: #7c3aed;
  --primary: #2563eb;
  --success: #2563eb;
  --error: #d97706;
  --text-secondary: rgba(17, 24, 39, 0.55);
  --fg-secondary: rgba(17, 24, 39, 0.50);
  --panel-glass: rgba(255, 255, 255, 0.06);
  --card-bg: #ffffff;
  --bg-subtle: #f1f5f9;
  --ok-bg: #dbeafe;
  --err-bg: #fef3c7;
  --warn-bg: #ede9fe;
  --warn: #7c3aed;
  --err: #b45309;
}

:root[data-theme="daltonized-dark"] {
  color-scheme: dark;
  --bg-app: #09090b;
  --bg-app-grad: linear-gradient(180deg, #09090b, #18181b);
  --bg1: #18181b;
  --panel: rgba(24, 24, 27, 0.88);
  --panel2: rgba(39, 39, 42, 0.92);
  --line: rgba(255, 255, 255, 0.12);
  --text: rgba(255, 255, 255, 0.92);
  --muted: rgba(255, 255, 255, 0.55);
  --muted2: rgba(255, 255, 255, 0.35);
  --danger: #fbbf24;
  --ok: #60a5fa;
  --brand: #60a5fa;
  --brand2: #93c5fd;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  --glow-shadow: 0 4px 24px rgba(96, 165, 250, 0.2);
  --glass-blur: blur(16px);
  --radius: 12px;
  --radius-sm: 8px;
  --fg: var(--text);
  --matrix-dot: rgba(255, 255, 255, 0.06);
  --matrix-bg: var(--bg-app);
  --nav-hover: rgba(96, 165, 250, 0.1);
  --nav-active: rgba(96, 165, 250, 0.15);
  --nav-active-border: rgba(96, 165, 250, 0.3);
  --bg: #09090b;
  --border: rgba(255, 255, 255, 0.14);
  --warning: #a78bfa;
  --primary: #60a5fa;
  --success: #60a5fa;
  --error: #fbbf24;
  --card-bg: #27272a;
  --text-secondary: rgba(255, 255, 255, 0.50);
  --fg-secondary: rgba(255, 255, 255, 0.45);
  --panel-glass: rgba(255, 255, 255, 0.03);
  --bg-subtle: rgba(255, 255, 255, 0.07);
  --ok-bg: rgba(96, 165, 250, 0.15);
  --err-bg: rgba(251, 191, 36, 0.15);
  --warn-bg: rgba(167, 139, 250, 0.15);
  --warn: #a78bfa;
  --err: #fbbf24;
}

/* ── High Contrast theme ── */
:root[data-theme="high-contrast"] {
  color-scheme: dark;
  --bg-app: #000000;
  --bg-app-grad: linear-gradient(180deg, #000000, #0a0a0a);
  --bg1: #0a0a0a;
  --panel: rgba(0, 0, 0, 0.95);
  --panel2: rgba(20, 20, 20, 0.95);
  --line: rgba(255, 255, 255, 0.30);
  --text: #ffffff;
  --muted: rgba(255, 255, 255, 0.75);
  --muted2: rgba(255, 255, 255, 0.60);
  --danger: #ff6b6b;
  --ok: #51cf66;
  --brand: #74c0fc;
  --brand2: #a5d8ff;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.8);
  --glow-shadow: 0 4px 24px rgba(116, 192, 252, 0.3);
  --glass-blur: blur(16px);
  --radius: 12px;
  --radius-sm: 8px;
  --fg: var(--text);
  --matrix-dot: rgba(255, 255, 255, 0.12);
  --matrix-bg: var(--bg-app);
  --nav-hover: rgba(116, 192, 252, 0.15);
  --nav-active: rgba(116, 192, 252, 0.25);
  --nav-active-border: rgba(116, 192, 252, 0.5);
  --bg: #000000;
  --border: rgba(255, 255, 255, 0.30);
  --warning: #ffd43b;
  --primary: #74c0fc;
  --success: #51cf66;
  --error: #ff6b6b;
  --card-bg: #141414;
  --text-secondary: rgba(255, 255, 255, 0.70);
  --fg-secondary: rgba(255, 255, 255, 0.65);
  --panel-glass: rgba(255, 255, 255, 0.05);
  --bg-subtle: rgba(255, 255, 255, 0.10);
  --ok-bg: rgba(81, 207, 102, 0.20);
  --err-bg: rgba(255, 107, 107, 0.20);
  --warn-bg: rgba(255, 212, 59, 0.20);
  --warn: #ffd43b;
  --err: #ff6b6b;
}


/* Shared Account surfaces use the desktop palette above. Keep semantic status
   colors separate from the blue navigation/action color. */
:root {
  --font-sans: "Noto Sans SC", ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-brand: "Noto Serif SC", ui-serif, Georgia, serif;
  --surface: var(--card-bg);
  --surface-soft: var(--bg1);
  --control-bg: var(--card-bg);
  --control-hover: var(--nav-hover);
  --control-border: var(--border);
  --focus-ring: var(--brand);
  --action-bg: #2563eb;
  --action-hover: #1d4ed8;
  --action-fg: #ffffff;
  --success-fg: #047857;
  --overlay: rgba(17, 24, 39, .42);

}
:root[data-theme="dark"], :root[data-theme="daltonized-dark"] {
  --control-bg: #18181b;
  --success-fg: var(--success);
  --overlay: rgba(0, 0, 0, .65);
}
:root[data-theme="daltonized-light"] { --success-fg: #1d4ed8; }
:root[data-theme="high-contrast"] {
  --action-bg: #74c0fc;
  --action-hover: #a5d8ff;
  --action-fg: #000000;
  --success-fg: var(--success);
  --overlay: rgba(0, 0, 0, .8);
}