/**
 * Editor design tokens (PR0a).
 * Load before style.css / splitpane.css. Prefer --ed-* for tone tweaks.
 * --sp-* and legacy --accent* / --bg / --text / --header-height are compatibility aliases.
 */

:root {
  /* ---------- Color ---------- */
  --ed-color-ink: #212121;
  --ed-color-ink-muted: #666666;
  --ed-color-ink-faint: #999999;

  --ed-color-surface: #ffffff;
  --ed-color-surface-subtle: #f8f9fa;
  --ed-color-surface-hover: #f5f5f5;
  --ed-color-surface-selected: #f7fafc;

  --ed-color-chrome: #2d3748;
  --ed-color-chrome-mid: #4a5568;
  --ed-color-chrome-dim: #718096;

  --ed-color-accent: #3182ce;
  --ed-color-accent-strong: #1976d2;
  --ed-color-accent-soft: #e3f2fd;

  --ed-color-border: #c6cace;
  --ed-color-border-strong: #868a8e;
  --ed-color-border-subtle: #e0e0e0;
  --ed-color-divider: #e8e8e8;

  --ed-color-success: #208b62;
  --ed-color-warning-bg: #fffef5;
  --ed-color-warning-tint: #fbf4ea;
  --ed-color-warning-ink: #c5721a;

  /* Alert / toast status (style.css ruibetsu + notifications; keep hex exact) */
  --ed-color-alert-success-bg: #e8f5e9;
  --ed-color-alert-success-ink: #2e7d32;
  --ed-color-alert-success-border: #a5d6a7;
  --ed-color-alert-error-bg: #ffebee;
  --ed-color-alert-error-ink: #c62828;
  --ed-color-alert-error-border: #ef9a9a;
  --ed-color-toast-success: #4caf50;
  --ed-color-toast-error: #f44336;
  --ed-color-toast-info: #2196f3;

  /* Scrollbar (style.css .main-content) */
  --ed-color-scrollbar-track: #f1f1f1;
  --ed-color-scrollbar-thumb: #888888;
  --ed-color-scrollbar-thumb-soft: #dedede;

  --ed-color-on-chrome: rgba(255, 255, 255, 0.9);
  --ed-color-on-chrome-muted: rgba(255, 255, 255, 0.85);
  --ed-color-on-chrome-hover: rgba(255, 255, 255, 0.15);

  /* ---------- Space / radius ---------- */
  --ed-space-1: 2px;
  --ed-space-2: 4px;
  --ed-space-3: 6px;
  --ed-space-4: 8px;
  --ed-space-5: 12px;
  --ed-gap: 0.35rem;
  --ed-radius: 3px;

  /* ---------- Layout (keep in sync with src/client/styles/layout.ts) ---------- */
  --ed-header-height: 36px;
  --ed-search-control-height: 32px;
  --ed-divider-width: 6px;
  --ed-list-default-split: 65%;
  --ed-list-checkbox-width: 32px;
  --ed-breakpoint-stack: 900px;
  --ed-breakpoint-parts-md: 1100px;
  --ed-breakpoint-parts-sm: 800px;

  /* ---------- Type ---------- */
  --ed-font-sans: var(--sans-font, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  --ed-font-mono-jp: var(--monospace-jp-font, "Source Han Code JP", "MS Gothic", monospace);
  --ed-font-size-ui: 12px;
  --ed-font-size-table: 11px;

  /* ---------- Z-index ---------- */
  --ed-z-header: 20;
  --ed-z-splitter: 30;
  --ed-z-dropdown: 40;
  --ed-z-overlay: 50;

  /* ---------- Compatibility: splitpane --sp-* ---------- */
  --sp-primary: var(--ed-color-chrome-mid);
  --sp-primary-dim: var(--ed-color-chrome-dim);
  --sp-primary-bg: var(--ed-color-surface-selected);
  --sp-primary-dark: var(--ed-color-chrome);
  --sp-accent: var(--ed-color-accent);
  --sp-header-height: var(--ed-header-height);
  --sp-search-height: auto;
  --sp-divider-width: var(--ed-divider-width);
  --sp-default-split: var(--ed-list-default-split);
  --sp-gap: var(--ed-gap);
  --sp-radius: var(--ed-radius);

  /* ---------- Compatibility: legacy style.css ---------- */
  --bg: var(--ed-color-surface);
  --text: var(--ed-color-ink);
  --accent: var(--ed-color-chrome-mid);
  --accent-dim: var(--ed-color-chrome-dim);
  --accent-bg: var(--ed-color-surface-selected);
  --accent-dark: var(--ed-color-chrome);
  --accent-link: var(--ed-color-accent);
  --border: var(--ed-color-border);
  --border-dark: var(--ed-color-border-strong);
  --border-radius: 2px; /* legacy; --ed-radius / --sp-radius stay 3px */
  --standard-border-radius: var(--ed-radius);
  --border-width: 1px;
  --border-width-wide: 2px;
  --gap: var(--ed-gap);
  --header-height: var(--ed-header-height);
  --bold-text: #495057;
}