/* Nonogram · stärkere Kontraste (18.10.2026)
   Wird NACH app.css geladen. */
html{
  --no-muted:#52646f;
  --k-cell:#ffffff;--k-line:#a3b7c2;--k-guide:#17212b;
  --k-cross:#3d4f5a;
  --k-sel-ring:#0b6b7d;--k-sel-bg:#9bd6e6;
  --k-err:#c0284f;--k-err-bg:#ffd9e2;
  --k-hint-ring:#0a7d5c;--k-hint-bg:#c8f1e3;
  --k-done:#065f4b;--k-done-bg:#bdeedd;
}
html[data-theme="dark"]{
  --no-muted:#b8c9d2;
  --k-cell:#1b2a35;--k-line:#3c5563;--k-guide:#e3eef3;
  --k-cross:#c3d3db;
  --k-sel-ring:#62d8e5;--k-sel-bg:#2f6276;
  --k-err:#ff7a96;--k-err-bg:#5a1f30;
  --k-hint-ring:#75dfc0;--k-hint-bg:#1f4a40;
  --k-done:#bff8e7;--k-done-bg:#1f5a4b;
}

/* Feld: feine Linien sichtbar (Farbbild-Felder .art-pixel bleiben unberührt), 5er-Hilfslinien kräftig */
html[data-theme] body .board{background:var(--k-line)!important}
html[data-theme] body .board .board-cell:not(.art-pixel){background:var(--k-cell)!important;border-color:var(--k-line)!important;box-shadow:none!important}
html[data-theme] body .board .board-cell[style*="border-left: 2px"]{border-left-color:var(--k-guide)!important}
html[data-theme] body .board .board-cell[style*="border-top: 2px"]{border-top-color:var(--k-guide)!important}
html[data-theme] body .board .board-cell .cross-mark{color:var(--k-cross)!important;opacity:1!important}
html[data-theme] body .board .board-cell.selected:not(.art-pixel){background:var(--k-sel-bg)!important;box-shadow:inset 0 0 0 3px var(--k-sel-ring)!important}
html[data-theme] body .board .board-cell.hint:not(.art-pixel){background:var(--k-hint-bg)!important;box-shadow:inset 0 0 0 4px var(--k-hint-ring)!important}
html[data-theme] body .board .board-cell.error:not(.art-pixel){background:var(--k-err-bg)!important;box-shadow:inset 0 0 0 4px var(--k-err)!important}

/* Erfüllte Zahlenzeile: deutlich grün */
html[data-theme] body .clue-line.complete{color:var(--k-done)!important;background:var(--k-done-bg)!important}

/* Werkzeug-Knöpfe: aktiver Modus kräftig, Schrift immer lesbar */
html[data-theme="light"] body .mode-btn.active{color:#ffffff!important;background:#0b6b5a!important;border-color:#0b6b5a!important}
html[data-theme="light"] body .mode-btn.cross.active{color:#ffffff!important;background:#5b45cf!important;border-color:#5b45cf!important}
html[data-theme="light"] body .mode-btn.erase.active{color:#ffffff!important;background:#0b6b7d!important;border-color:#0b6b7d!important}
html[data-theme="dark"] body .mode-btn.active{color:#06352b!important;background:#75dfc0!important;border-color:#75dfc0!important}
html[data-theme="dark"] body .mode-btn.cross.active{color:#1d1150!important;background:#ad9cff!important;border-color:#ad9cff!important}
html[data-theme="dark"] body .mode-btn.erase.active{color:#062a33!important;background:#62d8e5!important;border-color:#62d8e5!important}
html[data-theme="dark"] body .control-btn.green{color:#bff8e7!important}

/* Gelöst-Fenster: das fertige Farbbild bleibt sichtbar.
   Keine Abdunklung/Unschärfe, Karte unten (Hochformat) bzw. rechts (Querformat). */
html body #winModal{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;align-items:flex-end!important}
html body #winModal .modal-card{margin:0 auto!important;box-shadow:0 -8px 40px rgba(10,25,32,.35)!important}
@media (min-width:760px) and (orientation:landscape){
  html body #winModal{align-items:center!important;justify-content:flex-end!important}
  html body #winModal .modal-card{width:min(380px,34vw)!important;margin:0 2vw 0 0!important}
}
/* Während das Farbbild gezeigt wird: Kreuze und Auswahlrahmen ausblenden */
html.art-reveal-active[data-theme] body .board .board-cell .cross-mark{opacity:0!important}
html.art-reveal-active[data-theme] body .board .board-cell:is(.selected,.hint,.error):not(.art-pixel){background:var(--k-cell)!important;box-shadow:none!important}
@media (min-width:760px) and (orientation:landscape){
  html body #winModal .win-actions{grid-template-columns:1fr!important}
}
