/* CW Design System 0.1. Light by default; dark only by explicit choice.
 * Color values are checked by scripts/check_contrast.py.
 * No component or interaction behavior is supplied by this file.
 */
.cw-theme-blog,
.cw-theme-app {
  --cw-font-sans: Arial, Helvetica, sans-serif;
  --cw-font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
  --cw-weight-normal: 400;
  --cw-weight-medium: 500;
  --cw-text-small: 0.75rem;
  --cw-text-ui: 0.875rem;
  --cw-text-reading: 1.125rem;
  --cw-line-ui: 1.6;
  --cw-line-reading: 1.75;
  --cw-line-small: 1.5;
  --cw-h1: 2.6875rem;
  --cw-h1-mobile: 2.25rem;
  --cw-h2: 1.625rem;
  --cw-h3: 1.25rem;
  --cw-line-h1: 1.1;
  --cw-line-h2: 1.25;
  --cw-line-h3: 1.35;
  --cw-space-0: 0;
  --cw-space-half: 0.125rem;
  --cw-space-1: 0.25rem;
  --cw-space-2: 0.5rem;
  --cw-space-3: 0.75rem;
  --cw-space-4: 1rem;
  --cw-space-5: 1.25rem;
  --cw-space-6: 1.5rem;
  --cw-space-8: 2rem;
  --cw-space-10: 2.5rem;
  --cw-space-12: 3rem;
  --cw-space-16: 4rem;
  --cw-border-width: 1px;
  --cw-focus-width: 3px;
  --cw-focus-offset: 3px;
  --cw-target-min: 1.5rem;
  --cw-touch-target: 2.75rem;
  --cw-duration-fast: 120ms;
  --cw-duration-panel: 180ms;
  --cw-easing: ease-out;
  --cw-radius-control: 3px;
  --cw-radius-panel: 3px;
  --cw-control-height: 2.25rem;
  --cw-sidebar-width: 11.5625rem;
  --cw-page-padding: 2rem;
  --cw-page-padding-mobile: 1.25rem;
  --cw-content-max: 72rem;
  --cw-reading-max: 68ch;
  color: var(--cw-text);
  background-color: var(--cw-surface);
  font-family: var(--cw-font-sans);
  font-size: 100%;
  line-height: var(--cw-line-ui);
}

/* Keep rem based on the user's root size, not the smaller UI size. */
.cw-theme-blog > body,
.cw-theme-app > body {
  margin: 0;
  font-size: var(--cw-text-ui);
}

.cw-theme-blog {
  color-scheme: light;
  --cw-surface: #f6f3ec;
  --cw-surface-muted: #eee9de;
  --cw-surface-raised: #fbf9f4;
  --cw-text: #2c2b27;
  --cw-text-muted: #625e55;
  --cw-border-subtle: #d9d4c8;
  --cw-border-control: #827c70;
  --cw-action: #2155d1;
  --cw-action-hover: #1c49b5;
  --cw-action-pressed: #183d99;
  --cw-on-action: #ffffff;
  --cw-link: #2155d1;
  --cw-selection: #e8edf9;
  --cw-focus-ring: #2155d1;
  --cw-positive: #355e40;
  --cw-warning: #76510d;
  --cw-negative: #a13528;
}

.cw-theme-blog[data-theme="dark"] {
  color-scheme: dark;
  --cw-surface: #201f1c;
  --cw-surface-muted: #2c2923;
  --cw-surface-raised: #26241f;
  --cw-text: #efebe1;
  --cw-text-muted: #bab4a7;
  --cw-border-subtle: #48443d;
  --cw-border-control: #898276;
  --cw-action: #95b4ff;
  --cw-action-hover: #b8ccff;
  --cw-action-pressed: #92afe9;
  --cw-on-action: #172138;
  --cw-link: #95b4ff;
  --cw-selection: #2c354a;
  --cw-focus-ring: #95b4ff;
  --cw-positive: #a4c39b;
  --cw-warning: #edc575;
  --cw-negative: #ffafa1;
}

.cw-theme-app {
  color-scheme: light;
  --cw-text-ui: 0.8125rem;
  --cw-text-reading: 0.875rem;
  --cw-line-ui: 1.5;
  --cw-line-reading: 1.6;
  --cw-h1: 1.5625rem;
  --cw-h1-mobile: 1.5625rem;
  --cw-h2: 1.125rem;
  --cw-h3: 0.875rem;
  --cw-line-h1: 1.2;
  --cw-line-h2: 1.3;
  --cw-line-h3: 1.4;
  --cw-radius-control: 2px;
  --cw-radius-panel: 2px;
  --cw-control-height: 2rem;
  --cw-sidebar-width: 11.125rem;
  --cw-page-padding: 1.5rem;
  --cw-page-padding-mobile: 1rem;
  --cw-content-max: none;
  --cw-surface: #f5f6f7;
  --cw-surface-muted: #e9ecf0;
  --cw-surface-raised: #ffffff;
  --cw-text: #20252b;
  --cw-text-muted: #535c66;
  --cw-border-subtle: #d4d8dd;
  --cw-border-control: #747e8b;
  --cw-action: #244bb7;
  --cw-action-hover: #1e409c;
  --cw-action-pressed: #193580;
  --cw-on-action: #ffffff;
  --cw-link: #244bb7;
  --cw-selection: #e7edf9;
  --cw-focus-ring: #244bb7;
  --cw-positive: #355e40;
  --cw-warning: #76510d;
  --cw-negative: #a13528;
}

.cw-theme-app[data-theme="dark"] {
  color-scheme: dark;
  --cw-surface: #181b20;
  --cw-surface-muted: #22272e;
  --cw-surface-raised: #20252c;
  --cw-text: #f0f2f6;
  --cw-text-muted: #b0b9c6;
  --cw-border-subtle: #39414b;
  --cw-border-control: #8591a2;
  --cw-action: #a6beff;
  --cw-action-hover: #c0d0ff;
  --cw-action-pressed: #94afea;
  --cw-on-action: #15233f;
  --cw-link: #a6beff;
  --cw-selection: #2b3650;
  --cw-focus-ring: #a6beff;
  --cw-positive: #a4c39b;
  --cw-warning: #edc575;
  --cw-negative: #ffafa1;
}

@media (prefers-reduced-motion: reduce) {
  .cw-theme-blog,
  .cw-theme-app {
    --cw-duration-fast: 0ms;
    --cw-duration-panel: 0ms;
  }
}