/* DevCN design tokens — single source of truth.
 * Replaces the three parallel variable families (--dc-*, --ui-*, --community-*).
 * Legacy names are kept at the bottom as aliases pointing here, so old CSS keeps
 * working but now reads from one place.
 *
 * Load order matters: this file must come AFTER design-system.css and
 * main-editorial.css, otherwise their redefinitions win.
 */

:root {
  /* Brand */
  --primary: #2563eb;
  --primary-2: #1d4ed8;
  --primary-soft: rgba(37, 99, 235, .1);
  --primary-ink: var(--primary);
  --accent: #f59e0b;
  --accent-soft: rgba(245, 158, 11, .12);

  /* Surfaces */
  --bg: #ffffff;
  --bg-soft: #f6f8fc;
  --bg-sunken: #f1f4f9;
  --paper: #ffffff;
  --card-bg: #ffffff;
  --input-bg: #ffffff;
  --head-bg: rgba(255, 255, 255, .92);
  --nav-bg: rgba(255, 255, 255, .9);
  --code-bg: #1e2230;
  --code-text: #e6e9ef;
  --mark: rgba(127, 127, 127, .12);

  /* Ink */
  --text: #1f2937;
  --text-soft: #5b6472;
  --text-faint: #8a93a2;
  --text-invert: #ffffff;

  /* Lines */
  --border: #e6eaf2;
  --border-strong: #cfd8e6;
  --focus-ring: rgba(37, 99, 235, .22);

  /* Semantic */
  --success: #12a150;
  --success-soft: rgba(18, 161, 80, .12);
  --warn: #d97706;
  --warn-soft: rgba(217, 119, 6, .12);
  --danger: #dc2626;
  --danger-soft: rgba(220, 38, 38, .12);

  /* Geometry */
  --radius: 14px;
  --radius-sm: 10px;
  --radius-xs: 7px;
  --radius-pill: 999px;
  --maxw: 1200px;
  --gutter: 24px;
  --nav-h: 76px;

  /* Elevation */
  --shadow: 0 8px 30px rgba(16, 24, 40, .08);
  --shadow-sm: 0 2px 10px rgba(16, 24, 40, .06);
  --shadow-none: none;

  /* Type */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --fs-base: 15px;
  --lh-base: 1.75;
}

/* Dark theme — driven by <html data-theme="dark">, see site-ui.js */
[data-theme="dark"] {
  --primary: #6b9bff;
  --primary-2: #8fb3ff;
  --primary-soft: rgba(107, 155, 255, .16);
  --primary-ink: #8fb3ff;
  --accent: #fbbf24;

  --bg: #0e1116;
  --bg-soft: #161b22;
  --bg-sunken: #1b2129;
  --paper: #151a21;
  --card-bg: #151a21;
  --input-bg: #1b2129;
  --head-bg: rgba(14, 17, 22, .92);
  --nav-bg: rgba(14, 17, 22, .9);
  --code-bg: #0b0e13;
  --code-text: #d8dee9;
  --mark: rgba(200, 200, 200, .16);

  --text: #e6e9ef;
  --text-soft: #a3adbb;
  --text-faint: #7b8494;
  --text-invert: #0e1116;

  --border: #262d38;
  --border-strong: #333c4a;
  --focus-ring: rgba(107, 155, 255, .32);

  --success: #35c26a;
  --success-soft: rgba(53, 194, 106, .16);
  --warn: #f0a63a;
  --warn-soft: rgba(240, 166, 58, .16);
  --danger: #f2626b;
  --danger-soft: rgba(242, 98, 107, .16);

  --shadow: 0 8px 30px rgba(0, 0, 0, .4);
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, .3);
}

/* ---------------------------------------------------------------
 * Legacy aliases.
 * --dc-orange was misnamed (it has always been blue); it now points
 * at --primary so existing rules follow the new palette for free.
 * --------------------------------------------------------------- */
:root,
body.front-ui,
body.admin-layout,
body.front-ui.media-template,
body.admin-layout.admin-ui-unified {
  --dc-shell: var(--maxw);
  --dc-bg: var(--bg);
  --dc-paper: var(--paper);
  --dc-ink: var(--text);
  --dc-muted: var(--text-soft);
  --dc-line: var(--border);
  --dc-soft: var(--bg-soft);
  --dc-orange: var(--primary);
  --dc-orange-text: var(--primary);
  --dc-radius: var(--radius-sm);
  --dc-gap: var(--gutter);

  --community-shell: min(var(--maxw), calc(100% - 48px));
  --community-bg: var(--bg);
  --community-ink: var(--text);
  --community-muted: var(--text-soft);
  --community-line: var(--border);
  --community-green: var(--primary);

  --ui-bg: var(--bg);
  --ui-surface: var(--paper);
  --ui-surface-soft: var(--bg-soft);
  --ui-ink: var(--text);
  --ui-muted: var(--text-soft);
  --ui-faint: var(--text-faint);
  --ui-line: var(--border);
  --ui-line-strong: var(--border-strong);
  --ui-accent: var(--primary);
  --ui-accent-strong: var(--primary-2);
  --ui-accent-soft: var(--primary-soft);
  --ui-shadow: var(--shadow-sm);
  --ui-radius: var(--radius-sm);
}