/* Default theme: precise, quiet, technical. Neutral zinc greys, one indigo
 * accent for the current/active state, a muted clay for errors, hairlines
 * instead of boxes, Inter + JetBrains Mono, thin display figures and a faint
 * dot grid behind the workspace. */
:root[data-theme="default"] {
  color-scheme: light;

  --color-bg: #fafafa;
  --color-bg-auth: #fafafa;
  --color-surface: #fff;
  --color-surface-subtle: #f7f7f8;
  --color-surface-sidebar: #f7f7f8;
  --color-surface-glass: rgb(250 250 250 / 86%);
  --color-line: #ededef;
  --color-line-soft: #f4f4f5;
  --color-line-input: #e4e4e7;
  --color-line-input-hover: #a1a1aa;

  --color-text: #18181b;
  --color-text-strong: #27272a;
  --color-text-secondary: #52525b;
  --color-text-muted: #71717a;
  --color-text-faint: #a1a1aa;
  --color-text-nav: #52525b;
  --color-icon: #a1a1aa;

  --color-primary: #5e6ad2;
  --color-primary-strong: #4651b8;
  --color-primary-soft: #eef0fb;
  --color-primary-faint: #f6f7fd;
  --color-primary-line: #c7caf0;
  --color-on-primary: #fff;
  --color-track: #e4e4e7;
  --color-brand-ink: #18181b;
  --color-brand-bit: #5e6ad2;

  --color-success: #2f7d68;
  --color-success-soft: #eef6f3;
  --color-warning: #a16207;
  --color-warning-soft: #fbf6ea;
  --color-warning-strong: #7c4a03;
  --color-accent: #8b6cc9;
  --color-accent-soft: #f4f0fb;
  --color-danger: #9f5548;
  --color-danger-strong: #84413a;
  --color-danger-soft: #f8efec;
  --color-danger-field: #9f5548;
  --color-overlay: rgb(24 24 27 / 32%);

  /* first-check result scale (WFD ruler): perfect, then 1 … 5+ errors */
  --color-perfect: #3a9a5f;
  --color-error-1: #f3c1b9;
  --color-error-2: #e99484;
  --color-error-3: #d9624f;
  --color-error-4: #bb3b2b;
  --color-error-5: #8c2417;

  --button-primary-bg: #eef0fb;
  --button-primary-bg-hover: #e2e6fa;
  --button-primary-text: #3d47a8;
  --button-primary-shadow: inset 0 0 0 1px #c7caf0;

  --gradient-workspace: none;
  --gradient-aside: none;
  --gradient-primary: linear-gradient(#eef0fb, #eef0fb);
  --gradient-page: none;
  --gradient-hero: linear-gradient(180deg, #fff, #fafafa);

  --radius-control: 8px;
  --radius-panel: 12px;
  --radius-card: 10px;
  --radius-small: 6px;
  --radius-pill: 999px;

  --shadow-panel: 0 0 0 1px #ededef;
  --shadow-raised: 0 0 0 1px #ededef, 0 12px 40px -24px rgb(24 24 27 / 22%);
  --shadow-inset: none;
  --shadow-auth-panel: 0 0 0 1px #ededef, 0 12px 40px -24px rgb(24 24 27 / 18%);
  --shadow-floating: 0 0 0 1px #ededef, 0 16px 40px -16px rgb(24 24 27 / 20%);
  --shadow-primary: none;
  --shadow-focus: 0 0 0 3px rgb(94 106 210 / 14%);
  --shadow-focus-danger: 0 0 0 3px rgb(159 85 72 / 12%);
  --outline-focus: 2px solid rgb(94 106 210 / 45%);

  --font-sans: "Inter Variable", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Noto Sans SC", sans-serif;
  --font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular, Menlo, Consolas, "PingFang SC", monospace;
  --weight-regular: 400;
  --weight-heading: 500;
  --weight-display: 200;
  --font-label: var(--font-mono);
  --label-size: 10.5px;
  --label-tracking: .1em;
  --label-transform: uppercase;

  --page-texture: radial-gradient(circle at 1px 1px, rgb(24 24 27 / 7.5%) 1px, transparent 0);
  --page-texture-size: 24px 24px;
  --section-index-display: inline-block;
  --chart-stroke: 1.2;
  --effect-glow: drop-shadow(0 0 3px rgb(94 106 210 / 55%));
}