:where(.plus-app-2026-07-hintojen-kehitys) {
  --plus-korostus: #f57f74; /* yds-color-news-orange-40 */
  --plus-korostus-2: #7c59fa; /* yds-color-news-violet-40 */
  --plus-korostus-3: #694bd7; /* yds-color-news-violet-50 */

  /* Teemavärit: käytä aina prioriteettijärjestyksessä 1 → N, ks. AGENTS.md */
  --plus-teemavari-1: #7c59fa; /* yds-color-news-violet-40 */
  --plus-teemavari-2: #29ccde; /* yds-color-turquoise-40 */
  --plus-teemavari-3: #ffe387; /* yds-color-info-yellow-20 */
  --plus-teemavari-4: #ff8f33; /* yds-color-info-orange-50 */
  --plus-teemavari-5: #9436b5; /* yds-color-info-purple-50 */
  --plus-teemavari-6: #fff3e2; /* yds-color-info-orange-5 */
  --plus-teemavari-aksentti: #f26659; /* yds-color-news-orange-50 */

  /* Visualisointien oletusasteikko (vaihda projektikohtaisesti). Ks. docs/varipaletit.md.
     sequential = absoluuttinen data (matala→korkea); diverging = etumerkillinen/keskitetty data. */
  --plus-teemavari-asteikko: var(--plus-asteikko-violetti-5);
  --plus-teemavari-asteikko-diverging: var(--plus-asteikko-violetti-oranssi-9);

  /* WCAG-kontrastin mukaan valitut tekstivärit teemavärien päälle, ks. AGENTS.md */
  --plus-teemavari-1-teksti: var(--yds-color-text-light);
  --plus-teemavari-2-teksti: var(--yds-color-text-dark);
  --plus-teemavari-3-teksti: var(--yds-color-text-dark);
  --plus-teemavari-4-teksti: var(--yds-color-text-dark);
  --plus-teemavari-5-teksti: var(--yds-color-text-light);
  --plus-teemavari-6-teksti: var(--yds-color-text-dark);
  --plus-teemavari-aksentti-teksti: var(--yds-color-text-dark);
}

:where(.plus-app-2026-07-pintavedet).taustavari,
:where(.plus-app-2026-07-pintavedet) .taustavari {
  --color-background: #2f2372; /* yds-color-news-violet-80 */
  --color-leipis-background: #2f2372;
}