/* Vilni Local — design tokens. T10b (03.11.2026): palette A «Кольори Карт» of the owner-approved home v8 / check v4
   (owner: «5 да цвет а») replaced the T6a violet; the token NAMES are unchanged, so every surface follows.
   ONE place for colours / type / radii: every /local-check surface and the shared map (map-kit.js / map-live.js
   read the --lc-band-* and --lc-map-* values at runtime) follow it. Do not hardcode colours elsewhere.

   One colour = one meaning:
   · brand — one blue (no orange, no gradient brand); one solid primary button per screen; yellow ONLY for the
     «ваша адреса» pin (--lc-pin) — never text, never a button;
   · status good / mid / bad — each in three steps (mark, soft background, ink ≥ 5.9:1) and ONLY for status,
     always with an SVG icon and a word (lc-components.css + _lc_ui.html.j2);
   · map — an ordinal scale of one blue (1–3 strongest), «немає» grey hatch, «не відповіла» dashed neutral;
   · «Ви» = brand, «Лідер» = neutral grey;
   · glow (--lc-glow) — a point light on «you» and the result only, never a background; static under reduced motion.
   Dark theme follows the visitor's system (prefers-color-scheme); data-theme="light|dark" on <html> forces one. */
@font-face { font-family: "Manrope"; font-weight: 200 800; font-display: swap;
  src: url("/static/local/fonts/manrope-cyrillic-wght-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Manrope"; font-weight: 200 800; font-display: swap;
  src: url("/static/local/fonts/manrope-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Unbounded"; font-weight: 200 900; font-display: swap;
  src: url("/static/local/fonts/unbounded-cyrillic-wght-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Unbounded"; font-weight: 200 900; font-display: swap;
  src: url("/static/local/fonts/unbounded-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ── light (default) ── */
:root {
  color-scheme: light;
  /* surfaces + text: white sheet, cold light-blue sections (owner: no grey/cream page background) */
  --lc-bg: #FFFFFF;
  --lc-card: #FFFFFF;
  --lc-surface-2: #F4F7FD;
  --lc-line: #E3E9F4;
  --lc-line-strong: #CBD5E6;
  --lc-ink: #0F1B33;
  --lc-ink-2: #33405A;
  --lc-mut: #5A6377;
  /* brand */
  --lc-primary: #1554D1;
  --lc-primary-deep: #1247B3;
  --lc-primary-soft: #EAF0FD;
  --lc-primary-ring: rgba(21, 84, 209, .28);
  --lc-on-primary: #FFFFFF;
  --lc-btn: #1554D1;           /* solid primary button (white text ≥ 4.5:1 in both themes) */
  --lc-btn-hover: #0F43AB;
  --lc-chip-b-ink: #0F3F9E;    /* brand chip text on --lc-primary-soft */
  /* status: mark / soft background / ink */
  --lc-good: #12804F; --lc-good-soft: #E7F5EC; --lc-good-ink: #0B6B3A;
  --lc-mid: #B87300;  --lc-mid-soft: #FFF2D2;  --lc-mid-ink: #7A4D00;
  --lc-bad: #C62F3A;  --lc-bad-soft: #FCEBEB;  --lc-bad-ink: #A3202B;
  /* you vs leader */
  --lc-you: #1554D1;
  --lc-lead: #7C879D;          /* ≥ 3:1 on --lc-surface-2 (bar track) */
  /* fields */
  --lc-field-bg: #FFFFFF;
  --lc-field-line: #7C879D;    /* ≥ 3:1 on the field background (WCAG 1.4.11) */
  --lc-ph: #5A6377;
  /* overlays */
  --lc-overlay: rgba(15, 27, 51, .55);
  --lc-caption-bg: rgba(15, 27, 51, .86);
  --lc-caption-ink: #FFFFFF;
  --lc-pop-bg: rgba(255, 255, 255, .97);
  /* map: ordinal blue scale + «немає» grey hatch + «не відповіла» neutral; inks ≥ 4.5:1 on their fill */
  --lc-band-top3: #1554D1;
  --lc-band-mid: #6E97EE;
  --lc-band-low: #C2D5F8;
  --lc-band-none: #BFC8D8;        /* the stripes of the «немає» hatch */
  --lc-band-failed: #7C879D;      /* dashed outline of «не відповіла»: ≥ 3:1 on --lc-map-ground */
  --lc-band-water: #D6E4F5;
  --lc-band-top3-ink: #FFFFFF;
  --lc-band-mid-ink: #0F1B33;
  --lc-band-low-ink: #0F1B33;
  --lc-band-none-ink: #4D586D;    /* «—» on the hatch, haloed with --lc-band-none-soft */
  --lc-band-none-soft: #F2F5FA;   /* the gaps of the «немає» hatch */
  --lc-band-failed-ink: #4D586D;  /* «?» on the empty dashed hexagon (over --lc-map-ground) */
  --lc-band-you-line: #0F1B33;    /* ring of the «ваша адреса» hexagon … */
  --lc-band-you-halo: #FFFFFF;    /* … edged on both sides, so it reads on every band (light or dark blue, hatch) */
  --lc-band-ink-dark: #0F1B33;
  --lc-band-ink-light: #FFFFFF;
  --lc-map-scheme: light;      /* map-live.js picks the basemap style by it */
  --lc-map-ground: #EEF2F8;
  --lc-map-base: #D6DFEE;      /* the plinth of the 3-D hexagons */
  --lc-map-hl: #0F1B33;        /* outline of the chosen hexagon */
  --lc-map-hover: #FFFFFF;
  --lc-map-hex-opacity: .62;   /* 3-D hexagons let the streets show through (owner 30.10) */
  --lc-radar: rgba(21, 84, 209, .26);  /* the scan sweep of the waiting map */
  --lc-radar-blend: multiply;
  --lc-marker-shadow: rgba(15, 27, 51, .35);
  /* the «ваша адреса» pin (yellow, palette A) + the drawn streets of the static maps */
  --lc-pin: #F2A900;
  --lc-pin-line: #0F1B33;
  --lc-street: #FFFFFF;
  --lc-street-2: #D6DFEE;
  /* deep band (final call of the home page): white text on a dark brand blue */
  --lc-deep: #0B2C6E;
  --lc-deep-ink: #FFFFFF;
  --lc-deep-mut: #C9D7F6;
  /* glow: a coloured shadow on «you» / the result in light, a lit edge in dark */
  --lc-glow: rgba(21, 84, 209, .42);
  --lc-glow-pin: rgba(224, 154, 0, .5);
  --lc-glow-r: 6px;
  /* the crown of the map leader (v8): gold line + fill, never on «you» */
  --lc-crown: #B07F0A;
  --lc-crown-fill: #EBC65E;
  /* type, radii, shadows */
  --lc-font-display: "Unbounded", "Manrope", system-ui, sans-serif;   /* H1 and big numbers only */
  --lc-font: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --lc-r-chip: 999px;
  --lc-r-ctl: 12px;
  --lc-r-tile: 16px;
  --lc-r-card: 20px;
  --lc-sh-1: 0 1px 2px rgba(15, 27, 51, .06);
  --lc-shadow: 0 14px 34px -16px rgba(15, 27, 51, .22);   /* main cards only */
}

/* ── dark: by the visitor's system unless data-theme="light" forces light ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --lc-bg: #0B1220; --lc-card: #121B2E; --lc-surface-2: #0E1727; --lc-line: #22304A; --lc-line-strong: #33435F;
    --lc-ink: #EAF0FA; --lc-ink-2: #C3CCDD; --lc-mut: #97A3BA;
    --lc-primary: #7EA4FF; --lc-primary-deep: #9AB8FF; --lc-primary-soft: #17284D; --lc-primary-ring: rgba(126, 164, 255, .38);
    --lc-on-primary: #FFFFFF; --lc-btn: #2563E6; --lc-btn-hover: #1D55CC; --lc-chip-b-ink: #BDD0FF;
    --lc-good: #34C17E; --lc-good-soft: #12301F; --lc-good-ink: #7BE3AE;
    --lc-mid: #E6A93A;  --lc-mid-soft: #33270F;  --lc-mid-ink: #F7C76A;
    --lc-bad: #F0626A;  --lc-bad-soft: #3A1A20;  --lc-bad-ink: #FF9EA3;
    --lc-you: #7EA4FF; --lc-lead: #6F7E9C;
    --lc-field-bg: #0E1727; --lc-field-line: #6F7E9C; --lc-ph: #97A3BA;
    --lc-overlay: rgba(0, 0, 0, .66); --lc-caption-bg: rgba(11, 18, 32, .9); --lc-pop-bg: rgba(18, 27, 46, .97);
    --lc-band-top3: #8FB2FF; --lc-band-mid: #3A6AD6; --lc-band-low: #22407E; --lc-band-none: #3A465E;
    --lc-band-failed: #6F7E9C; --lc-band-water: #13213A;
    --lc-band-top3-ink: #0B1220; --lc-band-mid-ink: #FFFFFF; --lc-band-low-ink: #E3ECFF; --lc-band-none-ink: #AAB5CA;
    --lc-band-none-soft: #141E31; --lc-band-failed-ink: #AAB5CA; --lc-band-you-line: #FFFFFF; --lc-band-you-halo: #0B1220;
    --lc-band-ink-dark: #0F1B33; --lc-band-ink-light: #FFFFFF;
    --lc-map-scheme: dark; --lc-map-ground: #0F1829; --lc-map-base: #22304A; --lc-map-hl: #EAF0FA; --lc-map-hover: #121B2E; --lc-map-hex-opacity: .86; --lc-radar: rgba(126, 164, 255, .34); --lc-radar-blend: screen; --lc-marker-shadow: rgba(0, 0, 0, .6);
    --lc-pin: #F5B82E; --lc-pin-line: #0B1220; --lc-street: #1B2740; --lc-street-2: #2A3B5C;
    --lc-deep: #102B66; --lc-deep-ink: #FFFFFF; --lc-deep-mut: #C3D3F6;
    --lc-glow: rgba(92, 155, 255, .8); --lc-glow-pin: rgba(255, 210, 74, .8); --lc-glow-r: 8px;
    --lc-crown: #E8BF4A; --lc-crown-fill: #F5D77E;
    --lc-sh-1: none; --lc-shadow: 0 18px 40px -18px rgba(0, 0, 0, .75);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --lc-bg: #0B1220; --lc-card: #121B2E; --lc-surface-2: #0E1727; --lc-line: #22304A; --lc-line-strong: #33435F;
  --lc-ink: #EAF0FA; --lc-ink-2: #C3CCDD; --lc-mut: #97A3BA;
  --lc-primary: #7EA4FF; --lc-primary-deep: #9AB8FF; --lc-primary-soft: #17284D; --lc-primary-ring: rgba(126, 164, 255, .38);
  --lc-on-primary: #FFFFFF; --lc-btn: #2563E6; --lc-btn-hover: #1D55CC; --lc-chip-b-ink: #BDD0FF;
  --lc-good: #34C17E; --lc-good-soft: #12301F; --lc-good-ink: #7BE3AE;
  --lc-mid: #E6A93A;  --lc-mid-soft: #33270F;  --lc-mid-ink: #F7C76A;
  --lc-bad: #F0626A;  --lc-bad-soft: #3A1A20;  --lc-bad-ink: #FF9EA3;
  --lc-you: #7EA4FF; --lc-lead: #6F7E9C;
  --lc-field-bg: #0E1727; --lc-field-line: #6F7E9C; --lc-ph: #97A3BA;
  --lc-overlay: rgba(0, 0, 0, .66); --lc-caption-bg: rgba(11, 18, 32, .9); --lc-pop-bg: rgba(18, 27, 46, .97);
  --lc-band-top3: #8FB2FF; --lc-band-mid: #3A6AD6; --lc-band-low: #22407E; --lc-band-none: #3A465E;
  --lc-band-failed: #6F7E9C; --lc-band-water: #13213A;
  --lc-band-top3-ink: #0B1220; --lc-band-mid-ink: #FFFFFF; --lc-band-low-ink: #E3ECFF; --lc-band-none-ink: #AAB5CA;
  --lc-band-none-soft: #141E31; --lc-band-failed-ink: #AAB5CA; --lc-band-you-line: #FFFFFF; --lc-band-you-halo: #0B1220;
  --lc-band-ink-dark: #0F1B33; --lc-band-ink-light: #FFFFFF;
  --lc-map-scheme: dark; --lc-map-ground: #0F1829; --lc-map-base: #22304A; --lc-map-hl: #EAF0FA; --lc-map-hover: #121B2E; --lc-map-hex-opacity: .86; --lc-radar: rgba(126, 164, 255, .34); --lc-radar-blend: screen; --lc-marker-shadow: rgba(0, 0, 0, .6);
  --lc-pin: #F5B82E; --lc-pin-line: #0B1220; --lc-street: #1B2740; --lc-street-2: #2A3B5C;
  --lc-deep: #102B66; --lc-deep-ink: #FFFFFF; --lc-deep-mut: #C3D3F6;
  --lc-glow: rgba(92, 155, 255, .8); --lc-glow-pin: rgba(255, 210, 74, .8); --lc-glow-r: 8px;
  --lc-crown: #E8BF4A; --lc-crown-fill: #F5D77E;
  --lc-sh-1: none; --lc-shadow: 0 18px 40px -18px rgba(0, 0, 0, .75);
}
