/* Takuzu · stärkere Kontraste (18.10.2026)
   Wird NACH app.css geladen. Hohe Spezifität + !important, weil im Spiel
   noch Regeln des alten Designs mit !important stecken. */
html{
  --k-cell:#ffffff;--k-given:#dde8ee;--k-line:#a3b7c2;--k-frame:#17212b;
  --k-zero:#054e63;--k-one:#7a2d0c;
  --k-peer:#9bd6e6;
  --k-sel:#0b6b7d;--k-sel-text:#ffffff;--k-sel-ring:#03323a;
  --k-err:#c0284f;--k-err-text:#ffffff;
  --k-hint:#c8f1e3;--k-hint-ring:#0a7d5c;
  --tk-muted:#52646f;
}
html[data-theme="dark"]{
  --k-cell:#1b2a35;--k-given:#263b48;--k-line:#3c5563;--k-frame:#e3eef3;
  --k-zero:#a8f0f6;--k-one:#ffd2b8;
  --k-peer:#2f6276;
  --k-sel:#62d8e5;--k-sel-text:#062a33;--k-sel-ring:#e9fbfd;
  --k-err:#ff7a96;--k-err-text:#2b0610;
  --k-hint:#1f4a40;--k-hint-ring:#75dfc0;
  --tk-muted:#b8c9d2;
}

html[data-theme] body .board{background:var(--k-line)!important;border-color:var(--k-frame)!important}
html[data-theme] body .board .cell{
  background:var(--k-cell)!important;border-color:var(--k-line)!important;
  box-shadow:none!important;animation:none;
}
html[data-theme] body .board .cell.given{background:var(--k-given)!important}
html[data-theme] body .board .cell .token.zero{color:var(--k-zero)!important}
html[data-theme] body .board .cell .token.one{color:var(--k-one)!important}
html[data-theme] body .board .cell:not(.given) .token{font-weight:800}

/* Markierte Zeile und Spalte: kräftige Fläche */
html[data-theme] body .board .cell.peer:not(.selected){background:var(--k-peer)!important}
html[data-theme] body .board .cell.selected{
  z-index:3;background:var(--k-sel)!important;box-shadow:inset 0 0 0 3px var(--k-sel-ring)!important;
}
html[data-theme] body .board .cell.selected .token{color:var(--k-sel-text)!important}
html[data-theme] body .board .cell.hint{background:var(--k-hint)!important;box-shadow:inset 0 0 0 4px var(--k-hint-ring)!important}
html[data-theme] body .board .cell.error.error.error{background:var(--k-err)!important;box-shadow:none!important}
html[data-theme] body .board .cell.error.error.error .token{color:var(--k-err-text)!important}

/* Hinweis-Zeile unter dem Feld */
html[data-theme="light"] body .cycle-hint{color:#05596a!important;border-color:#7fc6d3!important}
/* Hinweis-Feld ist zugleich ausgewählt: Zahl in ihrer normalen Farbe auf Hellgrün */
html[data-theme] body .board .cell.hint .token.zero{color:var(--k-zero)!important}
html[data-theme] body .board .cell.hint .token.one{color:var(--k-one)!important}