/* Design systemin värit · perusta. Päätökset: DESIGN-SYSTEM-PERUSTAT-2026-11.md §1,
   tutkimus: DESIGN-SYSTEM-TUTKIMUS-2026-11.md.
   Neutraalit yhdestä kaavasta: OKLCH, sävy 258, kylläisyys kapenee ääripäissä.
   Ladataan luonnosten viimeisenä tyylinä; :root:root:root voittaa vanhat tokenit
   (kokonaisuus-03/tokens.css, chat colors.css) ilman !importantia.
   Kerrokset: 1) neutraalit ja värit, 2) merkitykset, 3) vanhat nimet aliaksina. */

:root:root:root{
 color-scheme:light;
 --customer-logo-filter:brightness(0);
 /* Neutraalit: sivupalkki · sivun tausta · pinta · kohotettu · korostus · viiva · kentän reuna */
 --side:oklch(.965 .005 258);--paper:oklch(.978 .004 258);--surface:oklch(1 0 0);--raised:oklch(1 0 0);
 --wash:oklch(.953 .006 258);--line:oklch(.905 .008 258);--field-line:oklch(.62 .018 258);
 /* Teksti: kolme tasoa, haalein ≥ 4,5:1 jokaisella pinnalla */
 --ink:oklch(.255 .02 258);--muted:oklch(.47 .022 258);--faint:oklch(.53 .02 258);
 /* Alfaneutraalit: hover · valittu · painettu · hiusviiva · vahva hiusviiva */
 --ink-a1:oklch(.255 .02 258 / .04);--ink-a2:oklch(.255 .02 258 / .07);--ink-a3:oklch(.255 .02 258 / .10);
 --hairline:oklch(.255 .02 258 / .09);--hairline-strong:oklch(.255 .02 258 / .16);--tone-sheen:oklch(1 0 0 / .9);
 /* Suunta-vihreä: edistyminen, vahvistus, Suunta.ai:n ehdotus */
 --green:oklch(.56 .12 160);--green-text:oklch(.47 .10 160);--green-bg:oklch(.965 .025 160);
 /* Tilat samalla painolla: sama vaaleus ja kylläisyys, eri sävy */
 --success-text:oklch(.48 .11 160);--success-solid:oklch(.58 .13 160);--success-bg:oklch(.965 .025 160);
 --warning-text:oklch(.48 .11 70);--warning-solid:oklch(.58 .14 70);--warning-bg:oklch(.965 .025 70);
 --danger-text:oklch(.48 .11 25);--danger-solid:oklch(.58 .14 25);--danger-bg:oklch(.965 .025 25);
 --info-text:oklch(.48 .11 255);--info-solid:oklch(.58 .14 255);--info-bg:oklch(.965 .025 255);
 /* Tunnistesävyt (projekti, kaavio), ei koskaan tila */
 --id-blue:var(--viz-1);--id-blue-bg:oklch(.965 .025 255);--id-blue-text:oklch(.48 .11 255);
 --id-amber:var(--viz-4);--id-amber-bg:oklch(.965 .025 70);--id-amber-text:oklch(.48 .11 70);
 --id-berry:var(--viz-5);--id-berry-bg:oklch(.965 .025 350);--id-berry-text:oklch(.48 .11 350);
 --id-teal:var(--viz-3);--id-teal-bg:oklch(.965 .022 195);--id-teal-text:oklch(.48 .085 195);
 /* Visualisoinnin tunnistesävyt (PERUSTAT §8): kiinteä järjestys, vain merkeissä, aina nimen kanssa.
    Validoitu värisokeudelle 4.11.2026 (dataviz validate_palette: vaalea ΔE ≥ 9,3, tumma ≥ 8,5). */
 --viz-1:#2e69b2;--viz-2:#e27641;--viz-3:#009589;--viz-4:#daa932;--viz-5:#b55386;--viz-6:#644b9e;
 --viz-context:oklch(.82 .012 258);--viz-track:oklch(.255 .02 258 / .08);
 /* Fokus ja kelluvat pinnat */
 --focus:var(--green);--edge-light:0 0 #0000;
 /* Logon merkki: sama Suunta-vihreä kuin käyttöliittymässä (päätös §5.1) */
 --logo-mark:var(--green);
 /* Ensisijaisen painikkeen hover: musteesta askel kohti pintaa */
 --btn-hover:oklch(.36 .025 258);
 --ds-pop-shadow:0 12px 32px oklch(.255 .02 258 / .12),0 1px 3px oklch(.255 .02 258 / .08);
 --ds-surface-shadow:0 24px 64px oklch(.255 .02 258 / .16),0 2px 6px oklch(.255 .02 258 / .06);
 --ds-composer-shadow:0 1px 2px oklch(.255 .02 258 / .04),0 6px 20px oklch(.255 .02 258 / .06);
 --selection:oklch(.255 .02 258 / .14);
 --ds-scrim:oklch(.255 .02 258 / .32);
 --ds-segment-shadow:0 1px 2px oklch(.255 .02 258 / .10),0 0 0 1px oklch(.255 .02 258 / .04);

 /* Vanhat luonnosnimet → uudet merkitykset (siirtymäkerros) */
 --brand:var(--green);--accent-bg:var(--green-bg);--accent-text:var(--green-text);
 --strong-line:var(--field-line);--warn:var(--warning-text);--warn-bg:var(--warning-bg);
 --blue:var(--id-blue);--blue-bg:var(--id-blue-bg);--blue-text:var(--id-blue-text);
 --amber:var(--id-amber);--amber-bg:var(--id-amber-bg);--amber-text:var(--warning-text);
 --berry:var(--id-berry);--berry-bg:var(--id-berry-bg);--berry-text:var(--danger-text);
 --teal:var(--id-teal);--teal-bg:var(--id-teal-bg);--teal-text:var(--success-text);
 --chat-work:var(--surface);--chat-input:var(--raised);--chat-menu:var(--raised);--chat-message:var(--wash);
 --chat-edge:var(--line);--chat-input-edge:var(--field-line);--chat-menu-hover:var(--ink-a1);--chat-menu-field:var(--wash);
 --chat-menu-edge:var(--line);--chat-divider:var(--line);--chat-focus:var(--focus);--chat-selected:var(--ink-a2);--chat-hint:var(--info-bg);
 --chat-shadow:var(--ds-pop-shadow);
}

:root:root:root[data-theme=dark]{
 --customer-logo-filter:brightness(0) invert(1);
 color-scheme:dark;
 --side:oklch(.19 .014 258);--paper:oklch(.235 .015 258);--surface:oklch(.285 .015 258);--raised:oklch(.31 .016 258);
 --wash:oklch(.34 .016 258);--line:oklch(.365 .016 258);--field-line:oklch(.63 .02 258);
 --ink:oklch(.97 .006 258);--muted:oklch(.80 .016 258);--faint:oklch(.72 .018 258);
 --ink-a1:oklch(.97 .006 258 / .05);--ink-a2:oklch(.97 .006 258 / .08);--ink-a3:oklch(.97 .006 258 / .12);
 --hairline:oklch(.97 .006 258 / .09);--hairline-strong:oklch(.97 .006 258 / .16);--tone-sheen:oklch(1 0 0 / .07);
 --green:oklch(.74 .13 160);--green-text:oklch(.82 .10 160);--green-bg:oklch(.30 .045 160);
 --success-text:oklch(.82 .09 160);--success-solid:oklch(.70 .13 160);--success-bg:oklch(.30 .045 160);
 --warning-text:oklch(.82 .09 70);--warning-solid:oklch(.70 .13 70);--warning-bg:oklch(.30 .045 70);
 --danger-text:oklch(.82 .09 25);--danger-solid:oklch(.70 .13 25);--danger-bg:oklch(.30 .045 25);
 --info-text:oklch(.82 .09 255);--info-solid:oklch(.70 .13 255);--info-bg:oklch(.30 .045 255);
 --viz-1:#4682cc;--viz-2:#db703b;--viz-3:#00988c;--viz-4:#b58e18;--viz-5:#ca5e96;--viz-6:#7c60bd;
 --viz-context:oklch(.46 .016 258);--viz-track:oklch(.97 .006 258 / .10);
 --id-blue:var(--viz-1);--id-blue-bg:oklch(.30 .045 255);--id-blue-text:oklch(.82 .09 255);
 --id-amber:var(--viz-4);--id-amber-bg:oklch(.30 .045 70);--id-amber-text:oklch(.82 .09 70);
 --id-berry:var(--viz-5);--id-berry-bg:oklch(.30 .045 350);--id-berry-text:oklch(.82 .09 350);
 --id-teal:var(--viz-3);--id-teal-bg:oklch(.30 .04 195);--id-teal-text:oklch(.82 .08 195);
 /* Tummassa kelluva pinta saa vaaleamman yläreunan (Apple: edessä oleva on vaaleampi) */
 --edge-light:inset 0 1px 0 oklch(1 0 0 / .06);
 --ds-pop-shadow:var(--edge-light),0 12px 32px oklch(0 0 0 / .45),0 1px 3px oklch(0 0 0 / .3);
 --ds-surface-shadow:var(--edge-light),0 24px 64px oklch(0 0 0 / .5),0 2px 6px oklch(0 0 0 / .35);
 --ds-composer-shadow:var(--edge-light),0 1px 2px oklch(0 0 0 / .3),0 8px 24px oklch(0 0 0 / .35);
 --selection:oklch(.97 .006 258 / .20);
 --ds-scrim:oklch(0 0 0 / .5);
 --ds-segment-shadow:0 1px 2px oklch(0 0 0 / .4),var(--edge-light);
 --btn-hover:oklch(.88 .012 258);
}

/* P3-näytöillä vihreä hieman eloisampi; sRGB-näytöt saavat yllä olevan. */
@media (color-gamut:p3){
 :root:root:root{--green:oklch(.56 .145 160);--success-solid:oklch(.58 .155 160)}
 :root:root:root[data-theme=dark]{--green:oklch(.74 .16 160);--success-solid:oklch(.70 .16 160)}
}

/* Korkea kontrasti samasta kaavasta: tasot tiivistyvät kohti mustetta. */
@media (prefers-contrast:more){
 :root:root:root{--muted:oklch(.36 .02 258);--faint:oklch(.42 .02 258);--line:oklch(.70 .015 258);--field-line:oklch(.45 .02 258);--hairline:oklch(.255 .02 258 / .25)}
 :root:root:root[data-theme=dark]{--muted:oklch(.90 .01 258);--faint:oklch(.84 .012 258);--line:oklch(.55 .02 258);--field-line:oklch(.78 .02 258);--hairline:oklch(.97 .006 258 / .28)}
}

/* Pienet yksityiskohdat. Muste, ei vihreää: valinta ja kursori ovat käyttäjän omaa
   toimintaa, eivät edistymistä tai vahvistusta (vihreä ei tee kahta asiaa). */
::selection{background:var(--selection)}
:root:root:root{caret-color:var(--ink);accent-color:var(--ink);scrollbar-color:var(--hairline-strong) transparent}