/* Sudoku: nur Spielfeld + Figuren-Leiste. Retro-Optik kommt aus _shared/spiele.css. */
.sd-board-wrap{border:3px solid;border-color:#808080 #fff #fff #808080;background:#fff}
.sd-board{display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr);aspect-ratio:1/1;border:2px solid #000}
.cs-root .sd-cell{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;padding:0;margin:0;background:#fff;border:0;border-right:1px solid #b0b0b0;border-bottom:1px solid #b0b0b0;box-shadow:none;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:pointer}
.cs-root .sd-cell:nth-child(9n){border-right:0}
.cs-root .sd-cell:nth-child(n+73){border-bottom:0}
.cs-root .sd-cell.sd-cb{border-right:2px solid #000}
.cs-root .sd-cell.sd-rb{border-bottom:2px solid #000}
.cs-root .sd-cell.sd-given{background:#dcdcdc}
.cs-root .sd-cell.sd-peer{background:#e6ebff}
.cs-root .sd-cell.sd-given.sd-peer{background:#cdd3ea}
.cs-root .sd-cell.sd-same{background:#fff1a8}
.cs-root .sd-cell.sd-bad{background:#ffb0b0}
.cs-root .sd-cell.sd-sel{background:#fffbd0;outline:2px solid #000080;outline-offset:-2px;z-index:1}
.cs-root .sd-cell:focus-visible{outline:2px dotted #000;outline-offset:-3px}
.sd-cell img{width:88%;height:88%;object-fit:contain;pointer-events:none;display:block}
.sd-num{display:none;position:absolute;right:1px;bottom:0;font:700 9px/1 Tahoma,Arial,sans-serif;color:#000080;background:rgba(255,255,255,.85);padding:1px 2px;pointer-events:none}
.sd-shownums .sd-num{display:block}
.sd-notes{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:100%;height:100%;padding:1px;pointer-events:none}
.sd-notes span{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0}
.sd-notes img{width:100%;height:100%;object-fit:contain;opacity:.85}
.cs-root .sd-board.sd-won .sd-cell{background:#e8ffe8;cursor:default}
.sd-palette{display:grid;grid-template-columns:repeat(9,1fr);gap:3px;margin-top:8px}
.cs-root .sd-pick{position:relative;aspect-ratio:1/1;padding:2px;display:flex;align-items:center;justify-content:center;min-height:0}
.sd-pick img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.cs-root .sd-pick[aria-pressed=true]{background:#fffbd0}
.cs-root .sd-pick.sd-done{opacity:.35}
.sd-numtoggle{display:flex;align-items:center;gap:3px;margin-left:6px;font-weight:400}
.cs-root .sd-numtoggle input{margin:0;width:13px;height:13px}

/* ---------- Modernes Design (nur mit .cs-modern) ---------- */
.cs-modern .sd-board-wrap{border:0;border-radius:14px;overflow:hidden;box-shadow:0 0 0 2px var(--nv);background:#fff}
.cs-modern .sd-board{border:0}
.cs-root.cs-modern .sd-cell{border:0;border-radius:0;border-right:1px solid var(--ln);border-bottom:1px solid var(--ln);background:#fff}
.cs-root.cs-modern .sd-cell.sd-cb{border-right:2px solid var(--nv)}
.cs-root.cs-modern .sd-cell.sd-rb{border-bottom:2px solid var(--nv)}
.cs-root.cs-modern .sd-cell.sd-given{background:var(--cr)}
.cs-root.cs-modern .sd-cell.sd-peer{background:#eef4f3}
.cs-root.cs-modern .sd-cell.sd-given.sd-peer{background:#e3e7de}
.cs-root.cs-modern .sd-cell.sd-same{background:#f6ecd2}
.cs-root.cs-modern .sd-cell.sd-bad{background:#f5d2d2}
.cs-root.cs-modern .sd-cell.sd-sel{background:#dcebea;outline:2px solid var(--pt);outline-offset:-2px}
.cs-modern .sd-num{color:var(--pt);background:rgba(255,255,255,.9);border-radius:3px}
.cs-root.cs-modern .sd-board.sd-won .sd-cell{background:#eef6f1}
.cs-modern .sd-palette{gap:5px;margin-top:12px}
.cs-root.cs-modern .sd-pick{border:1.5px solid var(--ln);border-radius:12px;background:#fff;padding:3px;box-shadow:none}
.cs-root.cs-modern .sd-pick:active,.cs-root.cs-modern .sd-pick[aria-pressed=true]{border-color:var(--pt);background:#dcebea}
.cs-root.cs-modern .sd-pick.sd-done{opacity:.3}