:root {
  /* 17px base, 1.7 line-height, and system fonts keep Japanese text legible at zoom. */
  --pico-font-size: 106.25%;
  --pico-line-height: 1.7;
  --pico-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  --pico-font-weight: 450;
  --pico-spacing: 1.25rem;
  --pico-typography-spacing-vertical: 1.25rem;
  --pico-border-radius: 8px;

  --slope-section-spacing: clamp(3.5rem, 9vw, 7rem);
  --slope-card-spacing: clamp(1.25rem, 3vw, 2rem);
  --slope-content-measure: 46rem;
  --slope-card-min: 17.5rem;
  --slope-card-radius: 12px;
  --slope-panel-radius: 16px;
  --slope-control-radius: 8px;
  --slope-pill-radius: 999px;
  --slope-transition-fast: 160ms ease;

  /* Client replacement point: re-evaluate all public neutrals when brand colors are approved. */
  /* Ink on white: 18.47:1, above the 4.5:1 text requirement. */
  --slope-ink: #111418;
  /* Hover ink on white: 13.48:1, above the 4.5:1 text requirement. */
  --slope-ink-hover: #2a2f36;
  /* White surface under ink: 18.47:1. */
  --slope-surface: #ffffff;
  /* Alternate surface under ink: 17.05:1. */
  --slope-surface-alt: #f4f6f8;
  /* Line on white is 1.35:1 and decorative only; controls use muted at 6.42:1 for their visible boundary. */
  --slope-line: #d9dee3;
  /* Muted ink on white: 6.42:1, above the 4.5:1 text requirement. */
  --slope-muted: #55606b;
  /* Footer background under footer ink: 17.54:1. */
  --slope-footer-bg: #0c0e10;
  /* Footer ink on footer background: 17.54:1. */
  --slope-footer-ink: #f2f4f6;
  /* Footer muted ink on footer background: 9.18:1. */
  --slope-footer-muted: #aab4bd;

  /* Client replacement point: re-evaluate the admin accent when brand colors are approved. */
  /* Sidebar background under sidebar ink: 14.73:1. */
  --admin-sidebar-bg: #17181c;
  /* Sidebar ink on sidebar background: 14.73:1. */
  --admin-sidebar-ink: #e8eaee;
  /* Sidebar muted ink on sidebar background: 6.94:1. */
  --admin-sidebar-muted: #9aa3ad;
  /* White text on admin accent: 6.39:1, meeting WCAG AA. */
  --admin-accent: #0b57d0;
  /* White text on admin accent hover: 7.67:1, meeting WCAG AA. */
  --admin-accent-hover: #0a4cb8;
  /* Admin page background under ink: 16.76:1. */
  --admin-page-bg: #f2f4f7;
  /* Admin card background under ink: 18.47:1. */
  --admin-card-bg: #ffffff;
  /* Decorative shadow only; cards retain a visible one-pixel boundary. */
  --admin-shadow: 0 1px 3px rgba(16,24,40,.08);

  /* Client replacement point: status colors are semantic and must retain text labels. */
  /* OK green on white: 5.08:1, above the 3:1 non-text status-dot requirement. */
  --slope-success: #1a7f37;
  /* Info blue on white: 6.39:1, above the 3:1 non-text status-dot requirement. */
  --slope-info: #0b57d0;
  /* Warning amber on white: 5.02:1, above the 3:1 non-text status-dot requirement. */
  --slope-warning: #b45309;
  /* Danger red on white: 6.54:1, above the 3:1 non-text status-dot requirement. */
  --slope-danger: #b3261e;
  /* Neutral gray on white: 6.42:1, above the 4.5:1 text requirement. */
  --slope-neutral: #55606b;

  --pico-color: var(--slope-ink);
  --pico-muted-color: var(--slope-muted);
  --pico-background-color: var(--slope-surface);
  --pico-form-element-background-color: var(--slope-surface-alt);
  --pico-form-element-border-color: var(--slope-muted);
  --pico-form-element-active-border-color: var(--admin-accent);
  --pico-form-element-focus-color: var(--admin-accent);
  --pico-form-element-spacing-vertical: 0.75rem;
  --pico-form-element-spacing-horizontal: 0.875rem;
  --pico-primary: var(--admin-accent);
  --pico-primary-background: var(--admin-accent);
  --pico-primary-border: var(--admin-accent);
  --pico-primary-hover: var(--admin-accent-hover);
  --pico-primary-hover-background: var(--admin-accent-hover);
  --pico-primary-hover-border: var(--admin-accent-hover);
  --pico-primary-focus: var(--admin-accent);
  --pico-primary-inverse: var(--slope-surface);
}

html[data-theme="light"] {
  /* Light is explicit; no dark-mode inference is enabled in this phase. */
  --pico-background-color: var(--slope-surface);
  --pico-color: var(--slope-ink);
}