/* Kerpace — tokens (docs/DESIGN.md). Seule source des couleurs, tailles, rayons, ombres et mouvements.
   Sombre : on redéfinit les tokens, jamais un sélecteur de composant. */

/* Polices auto-hébergées (OFL) : Geist pour le texte, Space Grotesk pour les chiffres et grands titres (charte Kerpace). */
@font-face{font-family:"Geist";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/geist-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Geist";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/geist-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Geist";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/geist-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Geist";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/geist-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Geist";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/geist-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Geist";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/geist-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Geist";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/geist-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Geist";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/geist-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/space-grotesk-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root {
  /* couleurs (clair) */
  --bg: #F6F4F8; --surface: #FFFFFF; --surface-2: #EFECF4; --surface-3: #E3DFEC;
  --line: #E3DFEC; --line-strong: #CDC7DC;
  --ink: #1E1A3F; --ink-2: #4A4668; --ink-3: #5B5870;
  --brand: #4A3FB0; --brand-strong: #3B3190; --brand-ink: #FFFFFF; --brand-wash: #E9E6F8;
  --hero: #4A3FB0; --hero-line: #6B60CF; --hero-ink: #FFFFFF;
  --eos: #EE6A8E; --eos-ink: #B02F5C;
  --logo-ker: #6B6788; --logo-pace: #1E1A3F; --logo-lane: #4A3FB0; --logo-dot: #EE6A8E;
  --good: #17724A; --warn: #8A5600; --bad: #B8352A;
  --good-wash: #E1F2EA; --warn-wash: #F8EED9; --bad-wash: #F9E4E1;
  --run: #DE6428; --bike: #2D69DE; --swim: #0D9BC2; --str: #B3358F; --prev: #1C9260;
  /* variantes « encre » : texte et pastilles pleines portant du blanc (≥ 4,5:1) ; en sombre, les teintes vives suffisent */
  --run-ink: #B4460F; --bike-ink: #2358C4; --swim-ink: #07708F; --str-ink: #A02C7E; --prev-ink: #137048;
  --good-ink: var(--good); --warn-ink: var(--warn); --bad-ink: var(--bad);
  --on-fill: #FFFFFF;
  --scrim: rgba(14, 10, 40, .46);
  --navbar-bg: rgba(246, 244, 248, .78);
  --tabbar-bg: rgba(251, 250, 253, .92);
  --press: rgba(30, 26, 63, .06);
  --map-filter: saturate(.75) contrast(.95); --map-veil: #fff; --map-veil-o: .12;
  --skeleton-hi: #F9F7FC;

  /* typographie */
  --font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --display: "Space Grotesk", var(--font);
  --fs-hero: 2.75rem; --lh-hero: 1;
  --fs-large: 2rem; --lh-large: 1.1;
  --fs-title: 1.375rem; --lh-title: 1.2;
  --fs-head: 1.0625rem; --lh-head: 1.3;
  --fs-body: 0.9375rem; --lh-body: 1.45;
  --fs-sub: 0.8125rem; --lh-sub: 1.35;
  --fs-cap: 0.6875rem; --lh-cap: 1.3;

  /* espace (grille de 4) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px;
  --gutter: 16px; --section-gap: 24px;

  /* formes et profondeur */
  --r-s: 8px; --r-m: 12px; --r-l: 20px; --r-full: 999px;
  --hairline: .5px;
  --shadow-float: 0 8px 28px -6px rgba(30, 26, 63, .22), 0 1px 2px rgba(30, 26, 63, .08);

  /* coque */
  --navbar-h: 44px; --tabbar-h: 56px; --side-w: 248px; --tap: 44px;

  /* mouvement */
  --ease-ios: cubic-bezier(.32, .72, 0, 1);
  --dur-push: 320ms; --dur-sheet-in: 360ms; --dur-sheet-out: 240ms; --dur-fast: 120ms;

  /* alias historiques (écrans pas encore refondus en vague 2) */
  --accent: var(--brand); --accent-ink: var(--brand-ink); --accent-wash: var(--brand-wash);
  --line-2: var(--line); --shadow: none;

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #14112B; --surface: #1E1A3F; --surface-2: #27224F; --surface-3: #322C61;
    --line: #322C61; --line-strong: #443D7A;
    --ink: #F6F4F8; --ink-2: #BDB9DA; --ink-3: #A7A2CA;
    --brand: #8C80F0; --brand-strong: #A99FF6; --brand-ink: #14112B; --brand-wash: #26215A;
    --hero: #2B2566; --hero-line: #4A3FB0;
    --logo-ker: #A8A3CC; --logo-pace: #F6F4F8; --logo-lane: #8C80F0; --logo-dot: #EE6A8E;
    --good: #4CC18F; --warn: #E3AB3E; --bad: #EF7B6F;
    --good-wash: #0F2A1F; --warn-wash: #2B2210; --bad-wash: #2E1714;
    --run: #F08A52; --bike: #6F9CF5; --swim: #46BFE0; --str: #E07BC0; --prev: #46C08D;
  --run-ink: var(--run); --bike-ink: var(--bike); --swim-ink: var(--swim); --str-ink: var(--str); --prev-ink: var(--prev); --on-fill: #14112B;
    --scrim: rgba(0, 0, 0, .6);
    --navbar-bg: rgba(20, 17, 43, .78);
    --tabbar-bg: rgba(30, 26, 63, .92);
    --press: rgba(246, 244, 248, .08);
    --map-filter: invert(1) hue-rotate(180deg) saturate(.6) brightness(.82) contrast(.92); --map-veil: #000; --map-veil-o: .18;
    --skeleton-hi: #2A2557;
    --shadow-float: 0 10px 32px -6px rgba(0, 0, 0, .7), 0 0 0 .5px rgba(255, 255, 255, .06);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #14112B; --surface: #1E1A3F; --surface-2: #27224F; --surface-3: #322C61;
  --line: #322C61; --line-strong: #443D7A;
  --ink: #F6F4F8; --ink-2: #BDB9DA; --ink-3: #A7A2CA;
  --brand: #8C80F0; --brand-strong: #A99FF6; --brand-ink: #14112B; --brand-wash: #26215A;
  --hero: #2B2566; --hero-line: #4A3FB0;
  --logo-ker: #A8A3CC; --logo-pace: #F6F4F8; --logo-lane: #8C80F0; --logo-dot: #EE6A8E;
  --good: #4CC18F; --warn: #E3AB3E; --bad: #EF7B6F;
  --good-wash: #0F2A1F; --warn-wash: #2B2210; --bad-wash: #2E1714;
  --run: #F08A52; --bike: #6F9CF5; --swim: #46BFE0; --str: #E07BC0; --prev: #46C08D;
  --run-ink: var(--run); --bike-ink: var(--bike); --swim-ink: var(--swim); --str-ink: var(--str); --prev-ink: var(--prev); --on-fill: #14112B;
  --scrim: rgba(0, 0, 0, .6);
  --navbar-bg: rgba(20, 17, 43, .78);
  --tabbar-bg: rgba(30, 26, 63, .92);
  --press: rgba(246, 244, 248, .08);
  --map-filter: invert(1) hue-rotate(180deg) saturate(.6) brightness(.82) contrast(.92); --map-veil: #000; --map-veil-o: .18;
  --skeleton-hi: #2A2557;
  --shadow-float: 0 10px 32px -6px rgba(0, 0, 0, .7), 0 0 0 .5px rgba(255, 255, 255, .06);
  color-scheme: dark;
}

/* Logo Kerpace (app/brand.js) : couleurs pilotées par les tokens --logo-*, donc clair/sombre automatiques. */
.kp-ker { fill: var(--logo-ker); } .kp-pace { fill: var(--logo-pace); } .kp-lane { fill: var(--logo-lane); } .kp-dot { fill: var(--logo-dot); }
.kp-on-brand .kp-ker, .kp-on-brand.kp-logo .kp-ker { fill: #CFCBF5; } .kp-on-brand .kp-pace, .kp-on-brand .kp-lane { fill: #FFFFFF; }