.pk35-sudoku,
.pk35-sudoku * { box-sizing: border-box; }

.pk35-sudoku {
  --pk35-ink: #17202a;
  --pk35-line: #7b8794;
  --pk35-accent: #e86f32;
  --pk35-soft: #eef5fb;
  width: 100%;
  max-width: 720px;
  margin: 1.5rem auto;
  color: var(--pk35-ink);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.pk35-sudoku__topbar { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; font-size: 1rem; }
.pk35-sudoku__game { display: grid; grid-template-columns: minmax(0, 1fr) 136px; align-items: start; gap: 16px; }
.pk35-sudoku__board {
  display: grid !important;
  grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(9, minmax(0, 1fr)) !important;
  gap: 0 !important;
  width: 100% !important;
  aspect-ratio: 1 / 1;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden;
  border: 3px solid var(--pk35-ink) !important;
  border-radius: 8px;
  background: #fff !important;
}
.pk35-sudoku__cell {
  appearance: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-right: 1px solid var(--pk35-line) !important;
  border-bottom: 1px solid var(--pk35-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
  color: #1261a0 !important;
  font: 600 clamp(16px, 4.3vw, 32px)/1 system-ui, sans-serif !important;
  cursor: pointer;
}
.pk35-sudoku__cell:nth-child(9n) { border-right: 0 !important; }
.pk35-sudoku__cell:nth-child(n+73) { border-bottom: 0 !important; }
.pk35-sudoku__cell:nth-child(9n+3), .pk35-sudoku__cell:nth-child(9n+6) { border-right: 3px solid var(--pk35-ink) !important; }
.pk35-sudoku__cell:nth-child(n+19):nth-child(-n+27), .pk35-sudoku__cell:nth-child(n+46):nth-child(-n+54) { border-bottom: 3px solid var(--pk35-ink) !important; }
.pk35-sudoku__cell.is-fixed { color: var(--pk35-ink) !important; font-weight: 750 !important; }
.pk35-sudoku__cell.is-related { background: var(--pk35-soft) !important; }
.pk35-sudoku__cell.is-same { background: #dbeaf6 !important; }
.pk35-sudoku__cell.is-selected { background: #ffe2cf !important; outline: 3px solid var(--pk35-accent); outline-offset: -3px; }
.pk35-sudoku__cell.is-wrong { color: #b42318 !important; background: #fee4e2 !important; }
.pk35-sudoku__cell:focus-visible { position: relative; z-index: 2; outline: 3px solid var(--pk35-accent); outline-offset: -3px; }

.pk35-sudoku__numbers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pk35-sudoku__numbers button,
.pk35-sudoku__actions button {
  appearance: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  min-height: 42px;
  margin: 0 !important;
  border: 2px solid var(--pk35-ink) !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  background: #fff !important;
  color: var(--pk35-ink) !important;
  -webkit-text-fill-color: var(--pk35-ink) !important;
  font: 700 20px/1 system-ui, sans-serif !important;
  text-shadow: none !important;
  cursor: pointer;
}
.pk35-sudoku__numbers button:hover, .pk35-sudoku__numbers button:focus-visible { background: var(--pk35-soft) !important; }
.pk35-sudoku__numbers .erase { grid-column: 1 / -1; display: flex !important; align-items: center; justify-content: center; gap: 7px; color: var(--pk35-ink) !important; -webkit-text-fill-color: var(--pk35-ink) !important; }
.pk35-sudoku__erase-text { font-size: 14px; }
.pk35-sudoku__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.pk35-sudoku__actions button { min-height: 44px; padding: 9px 17px !important; font-size: 16px !important; }
.pk35-sudoku__actions button:first-child { background: var(--pk35-accent) !important; border-color: var(--pk35-accent) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; }
.pk35-sudoku__message { min-height: 1.5em; margin: .75rem 0 0; font-weight: 600; }

@media (max-width: 620px) {
  .pk35-sudoku { max-width: 520px; }
  .pk35-sudoku__game { grid-template-columns: 1fr; gap: 12px; }
  .pk35-sudoku__numbers { grid-template-columns: repeat(5, 1fr); gap: 6px; }
  .pk35-sudoku__numbers .erase { grid-column: auto; }
  .pk35-sudoku__erase-text { display: none; }
  .pk35-sudoku__numbers button { min-height: 44px; font-size: 18px !important; }
}

@media (max-width: 380px) {
  .pk35-sudoku__board { border-width: 2px !important; border-radius: 5px; }
  .pk35-sudoku__cell:nth-child(9n+3), .pk35-sudoku__cell:nth-child(9n+6),
  .pk35-sudoku__cell:nth-child(n+19):nth-child(-n+27), .pk35-sudoku__cell:nth-child(n+46):nth-child(-n+54) { border-width: 2px !important; }
}