/* tokens.css — Living SR&MA Design Tokens (single source of truth)
 * ================================================================
 * All pages import this file. Do NOT redefine these variables in
 * individual HTML <style> blocks.
 *
 * Theme: default is dark. Add data-theme="light" on <html> for light mode.
 */

/* ── Dark theme (default) ─────────────────────────────────────────── */
:root {
  /* Backgrounds */
  --bg-base: #0f1117;
  --bg-card: #1a1f2e;
  --bg-input: #0d1117;
  --bg-hover: #1e2535;
  --bg-elevated: #162233;

  /* Borders */
  --border: #2d3748;
  --border-hover: #4a5568;
  --border-light: #3d4a5c;

  /* Text */
  --text-primary: #e2e8f0;
  --text-secondary: #a0aec0;
  --text-muted: #8a9bb5;
  --text-dim: #7b88a0;
  --text-on-accent: #fff;
  --text-on-amber: #1a202c;
  /* ページ下地（--bg-base / -card / -elevated / -hover）に置く「完了・成功」の
     緑の文字。背景トークン（--btn-success-bg 等）を color に流用すると、塗りを
     AA 対応で濃くしたとたん dark で読めなくなる（2026-09-12 実測 2.0 台）。
     --text-on-blue-bg と同型の**文字専用**トークン。gate:
     tests/test_decision_button_contrast.py */
  --text-success: var(--accent-green);
  /* --text-success の鏡。ページ下地 4 面に置く「除外・危険」の赤い文字専用で、
     ハイライト帯の文字（--hl-exclude-text）を流用しないためのトークン。
     dark は --accent-red（4 面で 6.27 以上）。gate:
     tests/test_blue_fill_text_contrast.py */
  --text-danger: var(--accent-red);

  /* Accent: Blue */
  --accent-blue: #63b3ed;
  --accent-blue-bg: #1e3a5f;
  --accent-blue-border: #2b6cb0;
  --accent-blue-light: #90cdf4;
  --accent-blue-hover: #4299e1;
  --accent-blue-dark: #2c5282;
  --accent-blue-solid: #3182ce;
  /* --accent-blue-bg（青ティント）の上に置く文字専用。--text-on-amber と向きが
     逆で、こちらは**ティント専用**（solid の青に載せると light で同色になる）。
     dark は --accent-blue（--accent-blue-bg 上で 5.04）、light は
     --accent-blue-dark（同 7.36。--accent-blue は 3.72 で AA 未達）。
     gate: tests/test_blue_tint_contrast.py */
  --text-on-blue-bg: var(--accent-blue);
  /* ページの素の下地（--bg-base / -card / -elevated / -hover）に置く青い**文字**
     専用。`--text-on-blue-bg` が青ティント面の上の文字なのに対し、こちらはその
     反対の面。dark の --accent-blue は 4 面で 6.71 以上なので値をそのまま使う。
     border / outline / focus ring は非テキスト基準 3:1 で足りるので
     --accent-blue のまま（青 = 「作業中」の信号を弱めない）。gate:
     tests/test_blue_text_on_surface_contrast.py */
  --accent-blue-text: var(--accent-blue);
  /* --accent-blue-border を**塗り**として敷いた面の上の文字専用。この面だけは
     テーマで明暗が反転する（dark #2b6cb0 = solid / light #90cdf4 = ティント）
     ので、白も --text-on-blue-bg も片テーマで落ちる（白 light 1.72 /
     --text-on-blue-bg dark 2.37）。dark は白（5.42）、light は同じ青相のまま
     明度だけ深い --accent-blue-dark（4.64）。塗り（= 信号）は変えていない。
     gate: tests/test_blue_fill_text_contrast.py */
  --text-on-blue-border: var(--text-on-accent);

  /* Accent: Green */
  --accent-green: #68d391;
  --accent-green-bg: #1c4532;
  --accent-green-border: #276749;
  --accent-green-light: #c6f6d5;
  --accent-green-pale: #9ae6b4;
  --accent-green-dark: #38a169;
  --accent-green-deep: #2f855a;
  /* Solid success/complete badge bg (white text, contrast 6.7:1 — same both
     themes, mirrors --accent-red-solid). --accent-green 自体は dark で明るく
     white 文字が 1.86 なので、文字を載せる solid はこちら。 */
  --accent-green-solid: #276749;

  /* Accent: Red */
  --accent-red: #fc8181;
  --accent-red-bg: #742a2a;
  --accent-red-border: #e53e3e;
  --accent-red-light: #fed7d7;
  --accent-red-dark: #c53030;
  --accent-red-deep: #9b2c2c;
  /* Solid destructive-button bg (white text, contrast 5.5:1 — same both themes,
     mirrors --accent-blue-solid) */
  --accent-red-solid: #c53030;

  /* TA screening keyword highlight — 背景/文字を専用化し両テーマで AA コントラスト確保 */
  --hl-include-bg: #276749;
  --hl-include-text: #c6f6d5;
  --hl-exclude-bg: #742a2a;
  --hl-exclude-text: #fed7d7;

  /* Accent: Orange */
  --accent-orange: #f6ad55;
  --accent-orange-bg: #3d2314;
  --accent-orange-dark: #ed8936;

  /* Accent: Yellow */
  --accent-yellow: #d69e2e;
  /* Soft yellow (RoB traffic-light "Some concerns" — bg/border は accent-amber と同型) */
  --accent-yellow-bg: rgba(214, 158, 46, 0.12);
  --accent-yellow-border: rgba(214, 158, 46, 0.35);
  /* Filled nav count-badge bg (暗色文字を載せる). dark theme の amber は十分明るく
     暗色文字でコントラスト ~6.8 のため accent-yellow と同値。light で明るい値に上書き。 */
  --nav-badge-bg: #d69e2e;

  /* RoB traffic-light soft 文字 (Low / Some concerns / High。--accent-*-bg の上)。
     3 色まとめて扱う (1 色だけ中立化すると 3 判定の対称が崩れる — owner feedback
     spec: feedback-de-rob-color-2026-09-06.md)。dark は green / yellow をそのまま
     参照 (5.81 / 5.21-6.61)。red だけ --accent-red (#fc8181) が --accent-red-bg
     の上で 4.08 と AA 未達のため、色相を保って明度だけ上げた red-300 にする
     (5.80)。light は下で色相同一・明度のみ深い値に上書き。gate:
     tests/test_solid_green_red_contrast.py */
  --rob-low-text: var(--accent-green);
  --rob-some-text: var(--accent-yellow);
  --rob-high-text: #feb2b2;

  /* Accent: Purple */
  --accent-purple: #b794f4;
  --accent-purple-bg: #2d1f5e;

  /* Accent: Amber (warn — distinct from orange/yellow) */
  --accent-amber: #d4a017;
  --accent-amber-bg: rgba(212, 160, 23, 0.12);
  --accent-amber-border: rgba(212, 160, 23, 0.35);

  /* Subproject identity (kept separate from blue stage badges) */
  --subpj-bg-tint: #11131c;
  --subpj-accent: #5eead4;
  --subpj-accent-bg: rgba(94, 234, 212, 0.14);
  --subpj-accent-border: rgba(94, 234, 212, 0.42);

  /* Plan badge: Institution chip (independent of accent-purple to keep brand control) */
  --plan-institution-fg: #b794f4;
  --plan-institution-bg: rgba(183, 148, 244, 0.12);
  --plan-institution-border: rgba(183, 148, 244, 0.35);

  /* Misc */
  --text-soft: #cbd5e0;
  --shadow-color: rgba(0, 0, 0, 0.6);
  --shadow-heavy: rgba(0, 0, 0, 0.5);
  --overlay-bg: rgba(0, 0, 0, 0.5);
  --overlay-strong: rgba(0, 0, 0, 0.6);

  /* PDF viewer (shared by dark and light: page stays white, highlights stay bright) */
  --pdf-page-bg: #ffffff;
  --pdf-page-shadow: rgba(0, 0, 0, 0.4);
  --pdf-text-selection-bg: rgba(0, 100, 200, 0.55);
  --pdf-link-hover-bg: rgba(60, 130, 255, 0.18);
  --pdf-link-hover-outline: rgba(60, 130, 255, 0.5);
  --pdf-note-border: #FFEB3B;
  --pdf-search-highlight-bg: rgba(255, 165, 0, 0.35);
  --pdf-search-current-bg: rgba(255, 100, 0, 0.6);
  --pdf-search-current-outline: rgba(255, 100, 0, 0.8);
  --pdf-drop-has-file-border: #4CAF50;

  /* Spinner track (e.g. on solid accent buttons — white 30% both themes) */
  --spinner-track-on-accent: rgba(255, 255, 255, 0.3);

  /* Accent glows (semi-transparent for box-shadow focus rings / flashes) */
  --accent-green-glow: rgba(56, 161, 105, 0.3);
  --accent-red-glow: rgba(229, 62, 62, 0.3);
  --accent-blue-glow: rgba(66, 153, 225, 0.3);

  /* Toast */
  --toast-include-bg: #1a3a2a;
  --toast-exclude-bg: #3a1a1a;
  --toast-save-bg: #1a2a3a;

  /* Chips / Hold button */
  --chip-selected-red-bg: #4a2020;
  --chip-selected-blue-bg: #1a2a3d;

  /* Overlay glass (PDF viewer floating buttons) */
  --overlay-glass: rgba(45, 55, 72, 0.8);
  --overlay-glass-hover: rgba(74, 85, 104, 0.9);

  /* Note panel */
  --note-panel-bg: #141720;

  /* Banners */
  --banner-peer-bg: #1a2d4a;
  --banner-warning-bg: #2d2200;
  --banner-warning-border: #744210;
  --banner-warning-text: #fbd38d;

  /* Dedup match badges */
  --badge-match-title-bg: #2c2a0a;
  --badge-match-fuzzy-bg: #3d2314;
  --badge-match-field-bg: #1a2635;

  /* Escalation */
  --escalation-bg: #1c1525;
  --escalation-border: #553c9a;

  /* Decision buttons (dark: tinted bg + light text, light: solid bg + white text) */
  --btn-include-bg: var(--accent-green-border);
  --btn-include-text: var(--accent-green-light);
  --btn-include-border: var(--accent-green-dark);
  --btn-include-hover: var(--accent-green-deep);
  --btn-exclude-bg: var(--accent-red-bg);
  --btn-exclude-text: var(--accent-red-light);
  --btn-exclude-border: var(--accent-red-border);
  --btn-exclude-hover: var(--accent-red-deep);
  --btn-hold-bg: var(--chip-selected-blue-bg);
  --btn-hold-text: var(--accent-blue-light);
  --btn-hold-border: var(--accent-blue-solid);
  --btn-hold-hover: var(--accent-blue-dark);
  --btn-primary-bg: var(--accent-blue-dark);
  --btn-primary-text: var(--accent-blue-light);
  --btn-primary-border: var(--accent-blue-solid);
  /* dark でも #2f855a × #f0fff4 は 4.39 で AA をわずかに割るため、両テーマ同値の
     solid 緑（6.51）へ寄せる。色相は動かさない（塗り = 「完了」の信号）。 */
  --btn-success-bg: var(--accent-green-solid);
  --btn-success-text: #f0fff4;
  /* 塗りを solid 緑へ深めた結果、生 hex の #276749 だと border が塗りと同色になり
     枠が消える。light と同じ「塗りより 1 段明るい緑」で分離する。 */
  --btn-success-border: var(--accent-green-deep);

  /* Status badges */
  --badge-status-active-bg: #1e2d1e;
  --badge-status-active-text: var(--accent-green);
  --badge-status-honorary-bg: #2d2150;
  --badge-status-honorary-text: #d6bcfa;
  --badge-ob-logged-bg: #744210;
  --badge-ob-logged-text: #fbd38d;
  --badge-ob-profile-bg: #2a4365;
  --badge-ob-profile-text: var(--accent-blue-light);
  --badge-ob-done-bg: #22543d;
  --badge-ob-done-text: var(--accent-green-pale);

  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Criteria lists */
  --list-gap: 4px;
  --list-indent: 1.4em;
  --list-marker-inc: '\2713';
  --list-marker-exc: '\2715';
  --list-marker-color-inc: var(--accent-green);
  --list-marker-color-exc: var(--accent-red);

  /* Button sizing (Track C-2 Phase 1, 2026-05-01 — see app/static/css/buttons.css) */
  --btn-radius: 6px;
  --btn-padding-md: 8px 16px;
  --btn-padding-sm: 4px 12px;
  --btn-font-size-md: 13px;
  --btn-font-size-sm: 12px;
  --btn-font-weight: 600;

  /* ── Primitives (design system, 2026-06-13 — see docs/DESIGN_SYSTEM.md) ──
     px系はテーマ非依存。:root に一度だけ定義し light には重複させない(cascade)。 */
  /* Spacing scale (4px grid) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  /* Typography scale */
  --text-2xs: 10px;
  --text-xs: 11px;
  --text-sm: 12px;
  --text-base: 13px;
  --text-md: 14px;
  --text-lg: 16px;
  --text-xl: 18px;
  --text-2xl: 22px;
  --text-3xl: 28px;
  /* Radius scale (--radius-btn == existing --btn-radius) */
  --radius-sm: 4px;
  --radius-btn: 6px;
  --radius-card: 8px;
  --radius-modal: 12px;
  --radius-pill: 999px;
  /* Shadow scale (references theme-adaptive --shadow-color / --shadow-heavy) */
  --shadow-sm: 0 1px 2px var(--shadow-color);
  --shadow-md: 0 4px 12px var(--shadow-color);
  --shadow-lg: 0 8px 32px var(--shadow-heavy);
  /* z-index scale */
  --z-sticky: 100;
  --z-dropdown: 500;
  --z-drawer: 800;
  --z-overlay: 1000;
  --z-overlay-nested: 1100;
  --z-toast: 2000;
  --z-banner: 9000;
  --z-app-loading: 9999;
  /* Motion scale (2026-06-22 — theme-independent: duration + easing) */
  --motion-duration-instant: 0ms;
  --motion-duration-fast: 100ms;
  --motion-duration-short: 150ms;
  --motion-duration-base: 200ms;
  --motion-duration-slow: 300ms;
  --motion-duration-slower: 500ms;
  /* 連続演出（2026-09-06 owner 承認）: spin = 回転スピナー一律 / pulse = 点滅・鼓動 */
  --motion-duration-spin: 0.8s;
  --motion-duration-pulse: 1.2s;
  --motion-ease-linear: linear;
  --motion-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --motion-ease-in: cubic-bezier(0.4, 0, 1, 1);
  --motion-ease-out: cubic-bezier(0, 0, 0.2, 1);
  --motion-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Light theme ──────────────────────────────────────────────────── */
html[data-theme="light"] {
  /* Backgrounds */
  --bg-base: #f7fafc;
  --bg-card: #ffffff;
  --bg-input: #ffffff;
  --bg-hover: #edf2f7;
  --bg-elevated: #f0f4f8;

  /* Borders */
  --border: #e2e8f0;
  --border-hover: #cbd5e0;
  --border-light: #e2e8f0;

  /* Text */
  --text-primary: #1a202c;
  --text-secondary: #4a5568;
  --text-muted: #64748b;
  --text-dim: #6b7280;
  --text-on-accent: #fff;
  /* light の solid amber (--accent-yellow #b7791f) は最も暗い solid 面で、
     #1a202c だと 4.48 で AA(4.5) をわずかに割る。前景の明度だけを下げて 4.84 に
     する (色相は動かさない = RoB traffic-light "Some concerns" の信号の意味を
     変えない)。dark 側 (:root) は別値で 6.83 以上を満たしており、**明るい方向へ
     変えると solid 8 箇所が全滅する**ので触らない。gate:
     tests/test_solid_accent_contrast.py::test_solid_amber_family_meets_aa_on_text_on_amber */
  --text-on-amber: #141922;
  /* light は白地に載るので、同じ緑相のまま明度だけ深い値を採る（#276749 で
     白地 6.73）。gate: tests/test_decision_button_contrast.py */
  --text-success: var(--accent-green-dark);
  /* light は白地に載るので、同じ赤相のまま明度だけ深い --accent-red-dark を採る
     （4 面で 4.86 以上。--accent-red は 3.66 で AA 未達）。gate:
     tests/test_blue_fill_text_contrast.py */
  --text-danger: var(--accent-red-dark);

  /* Accent: Blue */
  --accent-blue: #3182ce;
  --accent-blue-bg: #ebf8ff;
  --accent-blue-border: #90cdf4;
  --accent-blue-hover: #2b6cb0;
  --accent-blue-dark: #2c5282;
  --accent-blue-solid: #3182ce;
  --accent-blue-light: #63b3ed;
  /* light の --accent-blue-bg（#ebf8ff）上では --accent-blue が 3.72 で AA 未達
     なので --accent-blue-dark（7.36）を採る。gate:
     tests/test_blue_tint_contrast.py */
  --text-on-blue-bg: var(--accent-blue-dark);
  /* light の --accent-blue は素の 4 面で 3.58-4.03 と AA 未達なので、同じ青相の
     まま明度だけ深い --accent-blue-dark（7.07-7.97）を文字に採る。新しい色相は
     足していない。gate: tests/test_blue_text_on_surface_contrast.py */
  --accent-blue-text: var(--accent-blue-dark);
  /* light の --accent-blue-border（#90cdf4）はティントなので、白（1.72）ではなく
     --accent-blue-dark（4.64）を採る。dark 側（:root）は白。塗りは動かさない。
     gate: tests/test_blue_fill_text_contrast.py */
  --text-on-blue-border: var(--accent-blue-dark);

  /* Accent: Green */
  --accent-green: #38a169;
  --accent-green-bg: #f0fff4;
  --accent-green-border: #9ae6b4;
  --accent-green-light: #c6f6d5;
  --accent-green-pale: #68d391;
  --accent-green-dark: #276749;
  --accent-green-deep: #276749;
  /* Solid success/complete badge bg (white text — same value both themes) */
  --accent-green-solid: #276749;

  /* Accent: Red */
  --accent-red: #e53e3e;
  --accent-red-bg: #fff5f5;
  --accent-red-border: #fc8181;
  --accent-red-light: #fed7d7;
  --accent-red-dark: #c53030;
  --accent-red-deep: #9b2c2c;
  /* Solid destructive-button bg (white text — same value both themes) */
  --accent-red-solid: #c53030;

  /* TA screening keyword highlight — 背景/文字を専用化し両テーマで AA コントラスト確保 */
  --hl-include-bg: #9ae6b4;
  --hl-include-text: #1c4532;
  --hl-exclude-bg: #fed7d7;
  --hl-exclude-text: #822727;

  /* Accent: Orange */
  --accent-orange: #dd6b20;
  --accent-orange-bg: #fff3e0;
  --accent-orange-dark: #c05621;

  /* Accent: Yellow */
  --accent-yellow: #b7791f;
  /* Soft yellow (RoB traffic-light "Some concerns" — bg/border は accent-amber と同型) */
  --accent-yellow-bg: rgba(183, 121, 31, 0.10);
  --accent-yellow-border: rgba(183, 121, 31, 0.30);
  /* Filled nav count-badge bg: light の accent-yellow(#b7791f bronze)は暗色文字との
     コントラストが 4.48 と低く数字が読みづらい。明るい amber/gold に上げて暗色文字を
     くっきり見せる(コントラスト ~8.8)。accent-yellow 自体は他 UI で使うため据え置き。 */
  --nav-badge-bg: #f0b429;

  /* RoB traffic-light soft 文字 (light)。--accent-green / -yellow / -red のままだと
     対応する --accent-*-bg の上で 3.14 / 2.92-3.27 / 3.86 と AA 未達。色相を変えず
     明度だけ深くして 6.51 / 5.01-5.62 / 5.11 (yellow はティント 4 面の最小-最大)。
     #975a16 は --bg-hover 面で 4.44 に落ちるので採らない。 */
  --rob-low-text: #276749;
  --rob-some-text: #8a5412;
  --rob-high-text: #c53030;

  /* Accent: Purple */
  --accent-purple: #805ad5;
  --accent-purple-bg: #faf5ff;

  /* Accent: Amber (warn — distinct from orange/yellow) */
  --accent-amber: #c08000;
  --accent-amber-bg: rgba(200, 140, 0, 0.08);
  --accent-amber-border: rgba(200, 140, 0, 0.3);

  /* Subproject identity (kept separate from blue stage badges) */
  --subpj-bg-tint: #f3f6fc;
  --subpj-accent: #0f766e;
  --subpj-accent-bg: #dff7f2;
  --subpj-accent-border: #7dd3c7;

  /* Plan badge: Institution chip (independent of accent-purple to keep brand control) */
  --plan-institution-fg: #8b5cf6;
  --plan-institution-bg: rgba(139, 92, 246, 0.12);
  --plan-institution-border: rgba(139, 92, 246, 0.35);

  /* Misc */
  --text-soft: #4a5568;
  --shadow-color: rgba(0, 0, 0, 0.08);
  --shadow-heavy: rgba(0, 0, 0, 0.12);
  --overlay-bg: rgba(0, 0, 0, 0.3);
  --overlay-strong: rgba(0, 0, 0, 0.45);

  /* PDF viewer (shared with dark theme — page/highlight colors don't flip) */
  --pdf-page-bg: #ffffff;
  --pdf-page-shadow: rgba(0, 0, 0, 0.12);
  --pdf-text-selection-bg: rgba(0, 100, 200, 0.35);
  --pdf-link-hover-bg: rgba(60, 130, 255, 0.18);
  --pdf-link-hover-outline: rgba(60, 130, 255, 0.5);
  --pdf-note-border: #FFEB3B;
  --pdf-search-highlight-bg: rgba(255, 165, 0, 0.35);
  --pdf-search-current-bg: rgba(255, 100, 0, 0.6);
  --pdf-search-current-outline: rgba(255, 100, 0, 0.8);
  --pdf-drop-has-file-border: #4CAF50;

  /* Spinner track (e.g. on solid accent buttons — white 30% both themes) */
  --spinner-track-on-accent: rgba(255, 255, 255, 0.5);

  /* Accent glows (semi-transparent for box-shadow focus rings / flashes) */
  --accent-green-glow: rgba(56, 161, 105, 0.25);
  --accent-red-glow: rgba(229, 62, 62, 0.25);
  --accent-blue-glow: rgba(66, 153, 225, 0.25);

  /* Toast */
  --toast-include-bg: #f0fff4;
  --toast-exclude-bg: #fff5f5;
  --toast-save-bg: #ebf8ff;

  /* Chips / Hold button */
  --chip-selected-red-bg: #fff5f5;
  --chip-selected-blue-bg: #ebf8ff;

  /* Overlay glass (PDF viewer floating buttons) */
  --overlay-glass: rgba(226, 232, 240, 0.85);
  --overlay-glass-hover: rgba(203, 213, 224, 0.95);

  /* Note panel */
  --note-panel-bg: #ffffff;

  /* Banners */
  --banner-peer-bg: #ebf8ff;
  --banner-warning-bg: #fffff0;
  --banner-warning-border: #d69e2e;
  --banner-warning-text: #744210;

  /* Dedup match badges */
  --badge-match-title-bg: #fffff0;
  --badge-match-fuzzy-bg: #fffaf0;
  --badge-match-field-bg: #ebf8ff;

  /* Escalation */
  --escalation-bg: #faf5ff;
  --escalation-border: #d6bcfa;

  /* Decision buttons — solid bg + white text for readability.
     owner 判断 2026-09-12: 白文字が 3.25 / 4.13 と AA 未達だったため、色相は
     動かさず明度だけ下げて両テーマ同値の solid（6.73 / 5.47）に寄せた。塗り
     そのものが判定の信号なので緑・赤は入れ替えない。hover は base より深い、
     という light の既存の向きを保つため同時に深くする（そうしないと exclude の
     hover が新しい base と同色になり、押下のフィードバックが消える）。 */
  --btn-include-bg: var(--accent-green-solid);
  --btn-include-text: #fff;
  --btn-include-border: #2f855a;
  --btn-include-hover: #1c4532;
  --btn-exclude-bg: var(--accent-red-solid);
  --btn-exclude-text: #fff;
  --btn-exclude-border: #c53030;
  --btn-exclude-hover: var(--accent-red-deep);
  --btn-hold-bg: #3182ce;
  --btn-hold-text: #fff;
  --btn-hold-border: #2b6cb0;
  --btn-hold-hover: #2b6cb0;
  --btn-primary-bg: #3182ce;
  --btn-primary-text: #fff;
  --btn-primary-border: #2b6cb0;
  --btn-success-bg: var(--accent-green-solid);
  --btn-success-text: #ffffff;
  --btn-success-border: #2f855a;

  /* Status badges — use colored bg + white text */
  --badge-status-active-bg: #c6f6d5;
  --badge-status-active-text: #22543d;
  --badge-status-honorary-bg: #e9d8fd;
  --badge-status-honorary-text: #553c9a;
  --badge-ob-logged-bg: #fefcbf;
  --badge-ob-logged-text: #744210;
  --badge-ob-profile-bg: #bee3f8;
  --badge-ob-profile-text: #2a4365;
  --badge-ob-done-bg: #c6f6d5;
  --badge-ob-done-text: #22543d;

  /* Criteria lists */
  --list-gap: 4px;
  --list-indent: 1.4em;
  --list-marker-inc: '\2713';
  --list-marker-exc: '\2715';
  --list-marker-color-inc: var(--accent-green);
  --list-marker-color-exc: var(--accent-red);
}

/* ── Shared modal overlay ─────────────────────────────────────────── */
.modal-overlay {
  position: fixed; inset: 0;
  background: var(--overlay-bg);
  display: none;
  z-index: 500;  /* canonical 値は B2 で defer 確定（変更しない）。tokenize は別途 owner 判断 */
  align-items: center;
  justify-content: center;
}
.modal-overlay.open { display: flex; }

/* ── Focus ring (§2.5) — 全ページに保証。component の outline:none で消えないよう :focus-visible で適用 ── */
:focus-visible {
  outline: 2px solid var(--accent-blue);
  outline-offset: 2px;
}

/* ── Reduced motion (§1.7) — OS で動きを抑制している利用者には transition/animation を即時化 ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: var(--motion-duration-instant) !important;
    animation-iteration-count: 1 !important;
    transition-duration: var(--motion-duration-instant) !important;
    scroll-behavior: auto !important;
  }
}
