/* ============================================================
   tokens.css — 見た目の正本（全サイト共通）。色・文字・角丸・影はここだけ直せば全サイトに入る。
   サイトごとに変えるのは --accent 系だけ＝各サイトの config/site.php の colors（build-static が assets/css/site-vars.css にする）。
   ============================================================ */
:root {
  --bg-primary: #ffffff;
  --bg-secondary: #F5F9FD;
  --bg-surface: #EEF4FB;
  --bg-dark: #0f172a;
  --text-primary: #16263B;
  --text-secondary: #475569;
  --text-muted: #94a3b8;
  --text-white: #ffffff;
  --accent: #1B7FE6;
  --accent-dark: #125FB3;
  --accent-light: #E6F1FD;
  --accent-green: #16a34a;
  --accent-green-light: #f0fdf4;
  --accent-orange: #ea580c;
  --accent-orange-light: #fff7ed;
  --border: #e2e8f0;
  --border-light: #f1f5f9;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.08), 0 4px 6px -4px rgba(0,0,0,0.04);
  --radius-sm: 12px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 16px;
  --font-sans: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic UI', 'Yu Gothic', YuGothic, 'Meiryo', 'Noto Sans JP', 'Noto Sans CJK JP', sans-serif;
  --font-display: var(--font-sans);
  --container: 1140px;
  --header-h: 64px;
  --transition: 0.2s ease;
  /* hv2 の色はサイトの colors（site-vars.css の --accent 系）から作る＝config/site.php の色だけで3サイトの見た目が決まる（FRONTIER_THEME_2026_11_04） */
  --hv2-navy: color-mix(in srgb, var(--accent) 8%, #FFFFFF);
  --hv2-navy-2: #FFFFFF;
  --hv2-navy-line: color-mix(in srgb, var(--accent) 20%, #FFFFFF);
  --hv2-amber: var(--accent);
  --hv2-amber-hi: color-mix(in srgb, var(--accent) 85%, #FFFFFF);
  --hv2-amber-ink: var(--accent-dark);
  --hv2-amber-bg: var(--accent-tint);
  --hv2-ink: #16263B;
  --hv2-ink-dim: #4A5B70;
  --hv2-font: var(--font-sans);
  --sk-navy: #FFFFFF;
  --sk-navy-2: #F3F7FC;
  --sk-navy-line: #DCE6F2;
  --sk-footer: #F3F6FA;
  --sk-on-navy: #16263B;
  --sk-on-navy-dim: #4A5B70;
  --sk-on-navy-mute: #64748B;
  --sk-amber: #1B7FE6;
  --sk-amber-hi: #3B93EE;
  --sk-amber-ring: rgba(27,127,230,0.25);
  --color-primary: #1B7FE6;
  --color-primary-dark: #125FB3;
  --v3-yellow-bg: #FFFAE8;
  --v3-yellow-ink: #6B4E00;
  --accent-tint: #E6F1FD;
  --hero-bg: #DDEBF8;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-primary: #0B1426;
    --bg-secondary: #111D35;
    --bg-surface: #182644;
    --bg-dark: #0a0a0e;
    --text-primary: #E2E8F0;
    --text-secondary: #B8C4D6;
    --text-muted: #8A99B3;
    --border: #24365A;
    --border-light: #1A2948;
    --accent-light: #3B2305;
    --hv2-amber-ink: #FBBF24;
    --hv2-amber-bg: rgba(245,158,11,0.16);
    --accent: #F59E0B;
    --accent-dark: #FBBF24;
    --sk-amber-ring: rgba(245, 158, 11, 0.30);
  }
}
:root[data-theme="dark"] {
    --bg-primary: #0B1426;
    --bg-secondary: #111D35;
    --bg-surface: #182644;
    --bg-dark: #0a0a0e;
    --text-primary: #E2E8F0;
    --text-secondary: #B8C4D6;
    --text-muted: #8A99B3;
    --border: #24365A;
    --border-light: #1A2948;
    --accent-light: #3B2305;
    --hv2-amber-ink: #FBBF24;
    --hv2-amber-bg: rgba(245,158,11,0.16);
    --accent: #F59E0B;
    --accent-dark: #FBBF24;
    --sk-amber-ring: rgba(245, 158, 11, 0.30);
}
