/* Ark A+B design tokens v1.0.0 (Kepp, 2026-10-19). Shelter mark, Indigo and Gold palette (Direction B's colours only).
   Fonts (OFL): @import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');
   Rules: white text on Indigo only. Gold (--ark-gold / --color-accent) is a fill or a glow; gold-coloured words on light use --color-accent-text.
   --color-lamp is the light in the mark. Body text never below --text-body. Tap targets at least --size-tap-min.
   Dark mode follows the system unless <html data-theme="light|dark"> forces one. */
:root {
  --ark-indigo: #262D6B;
  --ark-indigo-deep: #1E2459;
  --ark-indigo-night: #171B45;
  --ark-gold: #F2B544;
  --ark-gold-deep: #C47E10;
  --ark-gold-text: #8F5300;
  --ark-gold-light: #F6C66B;
  --ark-cream: #FAF7F2;
  --ark-ink: #1C1E2E;
  --ark-periwinkle: #A9B0F5;
  --ark-icon-from: #343C8A;
  --ark-icon-to: #161A42;
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-ui: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  --font-weight-display: 600;
  --text-label: 0.75rem;
  --text-caption: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-body: 1rem;
  --text-button: 1.0625rem;
  --text-lg: 1.125rem;
  --text-title-s: 1.1875rem;
  --text-title: 1.5625rem;
  --text-title-l: 1.6875rem;
  --text-display: 2.75rem;
  --text-display-xl: 4.375rem;
  --leading-tight: 1.12;
  --leading-snug: 1.25;
  --leading-body: 1.45;
  --leading-relaxed: 1.5;
  --tracking-display: -0.01em;
  --tracking-display-xl: -0.02em;
  --tracking-label: 0.12em;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 32px;
  --radius-pill: 999px;
  --radius-icon: 22.37%;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 56px;
  --space-10: 80px;
  --size-tap-min: 44px;
  --size-button-h: 54px;
  --size-button-h-site: 62px;
  --size-gutter: 16px;
  --size-tab-bar: 60px;
  --color-bg: #FAF7F2;
  --color-surface: #FFFFFF;
  --color-surface-2: #F1EEF7;
  --color-line: #E8E3DA;
  --color-text: #1C1E2E;
  --color-text-muted: #5A5D70;
  --color-primary: #262D6B;
  --color-primary-pressed: #1E2459;
  --color-on-primary: #FFFFFF;
  --color-link: #262D6B;
  --color-accent: #F2B544;
  --color-accent-text: #8F5300;
  --color-on-accent: #1C1E2E;
  --color-lamp: #C47E10;
  --color-chip-bg: #FCEBD9;
  --color-chip-text: #94450F;
  --color-avatar-bg: #ECEDF7;
  --color-avatar-text: #262D6B;
  --color-card-feature-from: #323A85;
  --color-card-feature-to: #1A1F4E;
  --color-card-feature-label: #F6C66B;
  --color-card-feature-meta: #DADDF3;
  --color-success: #1D7A4F;
  --color-success-bg: #E3F3EA;
  --color-warning: #A35700;
  --color-warning-bg: #FBEEDC;
  --color-error: #B3261E;
  --color-error-bg: #FBE6E4;
  --color-tab: #4C4F63;
  --color-focus: #4B53B8;
  --color-memorial: #C9A24D;
  --shadow-card: 0 0 0 1px #E8E3DA, 0 1px 2px rgba(28,30,46,.04), 0 10px 24px rgba(28,30,46,.06);
  --shadow-raised: 0 14px 30px rgba(26,31,78,.26);
  --shadow-button: 0 2px 0 rgba(0,0,0,.14), 0 8px 18px rgba(0,0,0,.14);
  --shadow-photo: 0 30px 60px rgba(0,0,0,.22);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #10112A;
    --color-surface: #1A1C3D;
    --color-surface-2: #24275A;
    --color-line: #30336A;
    --color-text: #F1F0F8;
    --color-text-muted: #B2B4CF;
    --color-primary: #4B53B8;
    --color-primary-pressed: #5A63C9;
    --color-on-primary: #FFFFFF;
    --color-link: #A9B0F5;
    --color-accent: #F2B544;
    --color-accent-text: #F6C66B;
    --color-on-accent: #1C1E2E;
    --color-lamp: #F2B544;
    --color-chip-bg: #3A2A12;
    --color-chip-text: #F6C66B;
    --color-avatar-bg: #262A5C;
    --color-avatar-text: #C9CCF5;
    --color-card-feature-from: #323A85;
    --color-card-feature-to: #1A1F4E;
    --color-card-feature-label: #F6C66B;
    --color-card-feature-meta: #DADDF3;
    --color-success: #5CCB94;
    --color-success-bg: #12301F;
    --color-warning: #F2B061;
    --color-warning-bg: #33240F;
    --color-error: #F59187;
    --color-error-bg: #3A1714;
    --color-tab: #B2B4CF;
    --color-focus: #A9B0F5;
    --color-memorial: #C9A24D;
    --shadow-card: 0 0 0 1px #30336A, 0 10px 24px rgba(0,0,0,.4);
    --shadow-raised: 0 14px 30px rgba(0,0,0,.5);
    --shadow-button: 0 2px 0 rgba(0,0,0,.3), 0 8px 18px rgba(0,0,0,.35);
    --shadow-photo: 0 30px 60px rgba(0,0,0,.5);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --color-bg: #10112A;
  --color-surface: #1A1C3D;
  --color-surface-2: #24275A;
  --color-line: #30336A;
  --color-text: #F1F0F8;
  --color-text-muted: #B2B4CF;
  --color-primary: #4B53B8;
  --color-primary-pressed: #5A63C9;
  --color-on-primary: #FFFFFF;
  --color-link: #A9B0F5;
  --color-accent: #F2B544;
  --color-accent-text: #F6C66B;
  --color-on-accent: #1C1E2E;
  --color-lamp: #F2B544;
  --color-chip-bg: #3A2A12;
  --color-chip-text: #F6C66B;
  --color-avatar-bg: #262A5C;
  --color-avatar-text: #C9CCF5;
  --color-card-feature-from: #323A85;
  --color-card-feature-to: #1A1F4E;
  --color-card-feature-label: #F6C66B;
  --color-card-feature-meta: #DADDF3;
  --color-success: #5CCB94;
  --color-success-bg: #12301F;
  --color-warning: #F2B061;
  --color-warning-bg: #33240F;
  --color-error: #F59187;
  --color-error-bg: #3A1714;
  --color-tab: #B2B4CF;
  --color-focus: #A9B0F5;
  --color-memorial: #C9A24D;
  --shadow-card: 0 0 0 1px #30336A, 0 10px 24px rgba(0,0,0,.4);
  --shadow-raised: 0 14px 30px rgba(0,0,0,.5);
  --shadow-button: 0 2px 0 rgba(0,0,0,.3), 0 8px 18px rgba(0,0,0,.35);
  --shadow-photo: 0 30px 60px rgba(0,0,0,.5);
  color-scheme: dark;
}
body { background: var(--color-bg); color: var(--color-text); font: var(--font-weight-regular) var(--text-body)/var(--leading-body) var(--font-ui); }