/* Raqam — sudoku. */
.rq-col { gap: 12px; }
.rq-grid {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  grid-template-rows: repeat(9, 1fr);
  width: var(--w, 320px);
  height: var(--w, 320px);
  padding: 3px;
  border-radius: 14px;
  background: rgba(232, 182, 90, 0.5);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32);
  gap: 1px;
  font-variant-numeric: tabular-nums;
}
.rq-cell {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: #0E1A52;
  color: var(--sky);
  font: inherit;
  font-weight: 650;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  transition: background-color 0.15s linear;
}
.rq-cell:nth-child(1) { border-top-left-radius: 11px; }
.rq-cell:nth-child(9) { border-top-right-radius: 11px; }
.rq-cell:nth-child(73) { border-bottom-left-radius: 11px; }
.rq-cell:nth-child(81) { border-bottom-right-radius: 11px; }
[dir="rtl"] .rq-grid { direction: ltr; }
.rq-cell.is-br { margin-right: 2px; }
.rq-cell.is-bb { margin-bottom: 2px; }
.rq-cell.is-given { color: var(--parchment); font-weight: 750; }
.rq-cell.is-user { color: #A9C4FF; }
.rq-cell.is-peer { background: #15246A; }
.rq-cell.is-same { background: #263A8F; }
.rq-cell.is-sel { background: var(--gold); color: var(--lapis); }
.rq-cell.is-bad { color: var(--danger); }
.rq-cell.is-sel.is-bad { color: #8B1E12; }
.rq-cell.is-win { animation: rq-win 0.6s var(--ease-out); }
@keyframes rq-win { 0% { background: #0E1A52; } 40% { background: var(--gold); color: var(--lapis); } 100% { background: #0E1A52; } }
.rq-v { pointer-events: none; }
.rq-notes {
  position: absolute;
  top: 2px; right: 2px; bottom: 2px; left: 2px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  pointer-events: none;
}
.rq-notes i {
  display: flex;
  align-items: center;
  justify-content: center;
  font-style: normal;
  font-size: 0.36em;
  font-weight: 650;
  color: var(--mist);
  line-height: 1;
}
.rq-cell.is-sel .rq-notes i { color: var(--lapis); }

.rq-pad {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 5px;
  width: var(--w, 320px);
  flex: none;
}
.rq-key {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 52px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: rgba(17, 30, 90, 0.8);
  box-shadow: inset 0 0 0 1px var(--hairline);
  color: var(--parchment);
  cursor: pointer;
  touch-action: manipulation;
}
.rq-key:active { background: var(--gold); color: var(--lapis); }
.rq-key[disabled] { opacity: 0.25; }
.rq-key__d { font-size: 1.45rem; font-weight: 700; line-height: 1; }
.rq-key__n { font-size: 0.66rem; color: var(--mist-dim); margin-top: 2px; line-height: 1; min-height: 0.66rem; }
.rq-new { display: grid; gap: 12px; }
.rq-new .kit-pills { margin: 0; }
@media (max-height: 700px) { .rq-key { height: 44px; } .rq-key__d { font-size: 1.2rem; } }