/* Aus Figma-Variablen generiert. Erster Modus = :root-Standard.
   FLOAT-Tokens sind einheitenlos — wo eine Länge nötig ist, in calc() mit 1px multiplizieren. */

:root {
  --color-black: rgb(0,0,0); /* @kind color */
  --color-cyan: rgb(153,255,255); /* @kind color */
  --color-green: rgb(204,255,153); /* @kind color */
  --color-grey: rgb(217,217,217); /* @kind color */
  --color-pink: rgb(238,153,255); /* @kind color */
  --color-white: rgb(255,255,255); /* @kind color */
  --color-yellow: rgb(255,221,153); /* @kind color */
  --hintergrund: var(--color-black); /* @kind color */
  --vordergrund: var(--color-yellow); /* @kind color */
}

:root[data-mode="schwarzer-hintergrund-gr-n"] {
  --hintergrund: var(--color-black); /* @kind color */
  --vordergrund: var(--color-green); /* @kind color */
}

:root[data-mode="schwarzer-hintergrund-pink"] {
  --hintergrund: var(--color-black); /* @kind color */
  --vordergrund: var(--color-pink); /* @kind color */
}

:root[data-mode="schwarzer-hintergrund-cyan"] {
  --hintergrund: var(--color-black); /* @kind color */
  --vordergrund: var(--color-cyan); /* @kind color */
}

:root[data-mode="schwarze-schrift-gelb"] {
  --hintergrund: var(--color-yellow); /* @kind color */
  --vordergrund: var(--color-black); /* @kind color */
}

:root[data-mode="schwarze-schrift-gr-n"] {
  --hintergrund: var(--color-green); /* @kind color */
  --vordergrund: var(--color-black); /* @kind color */
}

:root[data-mode="schwarze-schrift-pink"] {
  --hintergrund: var(--color-pink); /* @kind color */
  --vordergrund: var(--color-black); /* @kind color */
}

:root[data-mode="schwarze-schrift-cyan"] {
  --hintergrund: var(--color-cyan); /* @kind color */
  --vordergrund: var(--color-black); /* @kind color */
}