/* medimichi design tokens v2026.10 (prototype)
   - 2 worlds: [data-world="health"] calm teal/green, [data-world="exam"] indigo.
   - All text/background pairs below are checked >= WCAG AA (see tools/contrast_check.py).
   - No external fonts: Japanese system font stack. */
:root {
  color-scheme: light dark;

  /* ---- neutral ---- */
  --c-bg: #f7f9fb;
  --c-surface: #ffffff;
  --c-surface-2: #eef2f6;
  --c-text: #17212e;
  --c-text-muted: #4a5565;
  --c-border: #d3dae3;
  --c-border-strong: #8592a3;
  --c-focus: #1d4ed8;
  --c-overlay: rgb(10 16 24 / .55);

  /* ---- world: health (general public) ---- */
  --c-health: #0f766e;          /* white on this = 5.47:1 */
  --c-health-strong: #115e59;
  --c-health-tint: #e3f3f0;
  --c-health-ink: #0b4f4a;      /* text on tint */
  --c-health-accent: #2f855a;   /* green for secondary marks */

  /* ---- world: exam (learners) ---- */
  --c-exam: #4338ca;            /* white on this = 7.0:1 */
  --c-exam-strong: #3730a3;
  --c-exam-tint: #eceeff;
  --c-exam-ink: #312e81;

  /* ---- semantic ---- */
  --c-danger: #b42318;          /* 緊急 */
  --c-danger-tint: #fdeceb;
  --c-danger-ink: #8f1d14;
  --c-warn: #8a4b00;            /* 受診の目安 */
  --c-warn-tint: #fff4e0;
  --c-warn-border: #e7b766;
  --c-ok: #166534;
  --c-ok-tint: #e7f6ec;
  --c-ng: #b42318;
  --c-ng-tint: #fdeceb;
  --c-ad: #6b4a12;              /* 広告 label */
  --c-ad-tint: #fbf3e2;
  --c-ad-border: #d9b979;

  /* ---- active world (defaults to health) ---- */
  --c-primary: var(--c-health);
  --c-primary-strong: var(--c-health-strong);
  --c-primary-tint: var(--c-health-tint);
  --c-primary-ink: var(--c-health-ink);
  --c-on-primary: #ffffff;

  /* ---- type ---- */
  --font-sans: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", "Meiryo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-num: ui-rounded, "SF Pro Rounded", "Segoe UI", system-ui, sans-serif;
  --fs-xs: .8125rem;   /* 13 – meta only, never body */
  --fs-sm: .875rem;    /* 14 – sources, captions */
  --fs-md: 1rem;       /* 16 – UI */
  --fs-body: 1.0625rem;/* 17 – article body */
  --fs-lg: 1.1875rem;  /* 19 */
  --fs-xl: 1.375rem;   /* 22 */
  --fs-2xl: clamp(1.5rem, 1.2rem + 1.2vw, 1.875rem);
  --fs-3xl: clamp(1.75rem, 1.25rem + 2.2vw, 2.5rem);
  --lh-tight: 1.35;
  --lh-body: 1.8;
  --fw-regular: 400;
  --fw-bold: 700;

  /* ---- space (4px base) ---- */
  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem;
  --sp-5: 1.25rem; --sp-6: 1.5rem; --sp-8: 2rem; --sp-10: 2.5rem; --sp-12: 3rem; --sp-16: 4rem;
  --gutter: 1rem;          /* 16px side gutter at phone width */
  --container: 72rem;
  --measure: 42rem;        /* readable line length for articles */
  --tap: 44px;             /* minimum touch target */

  /* ---- radius / shadow ---- */
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgb(16 24 40 / .06), 0 1px 3px rgb(16 24 40 / .08);
  --shadow-2: 0 4px 12px rgb(16 24 40 / .08), 0 2px 4px rgb(16 24 40 / .05);
  --shadow-3: 0 16px 40px rgb(16 24 40 / .16);

  /* ---- motion ---- */
  --dur-1: 120ms; --dur-2: 200ms; --dur-3: 320ms; --dur-4: 600ms;
  --ease-out: cubic-bezier(.2, .7, .2, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
}

[data-world="exam"] {
  --c-primary: var(--c-exam);
  --c-primary-strong: var(--c-exam-strong);
  --c-primary-tint: var(--c-exam-tint);
  --c-primary-ink: var(--c-exam-ink);
}

@media (min-width: 48rem) { :root { --gutter: 1.5rem; } }

/* ---- dark ---- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-bg: #0d131a; --c-surface: #151e28; --c-surface-2: #1d2834;
    --c-text: #e7edf3; --c-text-muted: #a9b5c3; --c-border: #2f3c4b; --c-border-strong: #6b7a8c;
    --c-focus: #8ab4ff; --c-overlay: rgb(0 0 0 / .65);
    --c-health: #5ccfc0; --c-health-strong: #82ddd1; --c-health-tint: #0f2e2b; --c-health-ink: #9fe6dc; --c-health-accent: #6fd39b;
    --c-exam: #a5adff; --c-exam-strong: #c3c8ff; --c-exam-tint: #1c1f45; --c-exam-ink: #c9ceff;
    --c-danger: #ff8a7f; --c-danger-tint: #3a1614; --c-danger-ink: #ffb4ad;
    --c-warn: #f5bd5c; --c-warn-tint: #33240a; --c-warn-border: #7a5a1c;
    --c-ok: #74d69a; --c-ok-tint: #12301e; --c-ng: #ff8a7f; --c-ng-tint: #3a1614;
    --c-ad: #e8c987; --c-ad-tint: #2c2412; --c-ad-border: #6d5626;
    --c-on-primary: #08201d;
    --shadow-1: 0 1px 2px rgb(0 0 0 / .4); --shadow-2: 0 4px 12px rgb(0 0 0 / .45); --shadow-3: 0 16px 40px rgb(0 0 0 / .6);
  }
  :root:not([data-theme="light"]) [data-world="exam"], :root:not([data-theme="light"])[data-world="exam"] { --c-on-primary: #13154a; }
}
:root[data-theme="dark"] {
  --c-bg: #0d131a; --c-surface: #151e28; --c-surface-2: #1d2834;
  --c-text: #e7edf3; --c-text-muted: #a9b5c3; --c-border: #2f3c4b; --c-border-strong: #6b7a8c;
  --c-focus: #8ab4ff; --c-overlay: rgb(0 0 0 / .65);
  --c-health: #5ccfc0; --c-health-strong: #82ddd1; --c-health-tint: #0f2e2b; --c-health-ink: #9fe6dc; --c-health-accent: #6fd39b;
  --c-exam: #a5adff; --c-exam-strong: #c3c8ff; --c-exam-tint: #1c1f45; --c-exam-ink: #c9ceff;
  --c-danger: #ff8a7f; --c-danger-tint: #3a1614; --c-danger-ink: #ffb4ad;
  --c-warn: #f5bd5c; --c-warn-tint: #33240a; --c-warn-border: #7a5a1c;
  --c-ok: #74d69a; --c-ok-tint: #12301e; --c-ng: #ff8a7f; --c-ng-tint: #3a1614;
  --c-ad: #e8c987; --c-ad-tint: #2c2412; --c-ad-border: #6d5626;
  --c-on-primary: #08201d;
}
:root[data-theme="dark"] [data-world="exam"], :root[data-theme="dark"][data-world="exam"] { --c-on-primary: #13154a; }

@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; --dur-4: 0ms; }
}