.sudoku-wrap { max-width: 680px; margin: 1rem auto; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
.sudoku-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem; margin-bottom:.75rem; }
.sudoku-meta .badge { background:#f5f5f5; border:1px solid #e5e5e5; padding:.25rem .5rem; border-radius:8px; margin-right:.25rem; }
.sudoku-controls .btn { margin-right:.25rem; padding:.45rem .6rem; border:1px solid #ddd; border-radius:6px; background:#fff; cursor:pointer; }
.sudoku-controls .btn:hover { background:#f7f7f7; }
.sudoku-timer { font-weight:600; }

.sudoku-grid { display:grid; grid-template-columns: repeat(9, 1fr); border:2px solid #222; }
.sudoku-cell {
  position:relative; border:1px solid #ccc; width: calc(680px / 9); aspect-ratio:1/1;
  display:flex; align-items:center; justify-content:center; background:#fff;
}
.sudoku-cell input {
  width:100%; height:100%; text-align:center; font-size:1.3rem; border:0; outline:0;
}
.sudoku-cell.given { background:#fbfbfb; font-weight:700; }
.sudoku-cell.error { background:#ffe8e8; }
.sudoku-cell.highlight { background:#f1faff; }
.sudoku-cell .notes {
  position:absolute; inset:2px; font-size:.6rem; line-height:1.1; color:#666; display:grid; grid-template-columns:repeat(3,1fr);
  gap:2px; text-align:center; pointer-events:none; padding:2px; visibility:hidden;
}
.sudoku-cell.notes-on input { visibility:hidden; }
.sudoku-cell.notes-on .notes { visibility:visible; }

.sudoku-keypad { display:flex; flex-wrap:wrap; gap:.25rem; justify-content:center; margin:.75rem 0; }
.sudoku-keypad button { padding:.5rem .6rem; border:1px solid #ddd; border-radius:6px; background:#fff; cursor:pointer; min-width:42px; }
.sudoku-keypad button.muted { color:#777; }
.sudoku-status { margin-top:.5rem; min-height:1.2rem; }

@media (max-width: 720px){
  .sudoku-cell { width: calc(100vw - 40px)/9; } /* fallback; theme may set width differently */
}

/* Thick borders between 3x3 boxes */
.sudoku-cell:nth-child(3n+1) { border-left-width:2px; }
.sudoku-cell:nth-child(-n+9) { border-top-width:2px; }
.sudoku-cell:nth-child(9n) { border-right-width:2px; }
.sudoku-cell:nth-child(n+73) { border-bottom-width:2px; }
.sudoku-cell.box-right { border-right-width:2px; }
.sudoku-cell.box-bottom { border-bottom-width:2px; }

/* Print styles (to create a clean PDF via browser) */
@media print {
  .sudoku-controls, .sudoku-keypad, .sudoku-timer, .sudoku-status, .sudoku-notes { display:none !important; }
  .sudoku-wrap { max-width: 100%; }
  .sudoku-cell input { font-size:16pt; }
}