/* Dokuzluk */
.oyun[data-oyun="dokuzluk"] { --hucre: min(9.6vw, 50px); }
.d-tablo {
  display: grid; grid-template-columns: repeat(9, var(--hucre)); width: fit-content;
  margin: 0 auto 16px; border: 3px solid var(--metin); border-radius: 10px; overflow: hidden;
  background: var(--metin);
}
.d-hucre {
  font: inherit; width: var(--hucre); height: var(--hucre); padding: 0;
  display: grid; place-items: center; font-size: calc(var(--hucre) * 0.55); font-weight: 600;
  border: 0; border-right: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi);
  background: var(--yuzey); color: var(--k); cursor: pointer; touch-action: manipulation;
  font-variant-numeric: tabular-nums;
}
.d-hucre:nth-child(9n) { border-right: 0; }
.d-hucre:nth-child(n + 73) { border-bottom: 0; }
.d-hucre.d-koyu { background: color-mix(in srgb, var(--k) 6%, var(--yuzey)); }
.d-hucre.d-sag { border-right: 2px solid var(--metin); }
.d-hucre.d-alt { border-bottom: 2px solid var(--metin); }
.d-hucre.d-sabit { color: var(--metin); font-weight: 800; }
.d-hucre.d-bagli { background: color-mix(in srgb, var(--k) 14%, var(--yuzey)); }
.d-hucre.d-ayni { background: color-mix(in srgb, var(--k) 30%, var(--yuzey)); }
.d-hucre.d-secili { background: color-mix(in srgb, var(--k) 45%, var(--yuzey)); box-shadow: inset 0 0 0 2px var(--k); }
.d-hucre.d-cakisan { color: var(--tehlike); text-decoration: underline wavy; text-underline-offset: 3px; }
.d-hucre:focus-visible { outline: 3px solid var(--odak); outline-offset: -3px; border-radius: 0; }
.d-hucre.d-notlu {
  grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr);
  font-size: calc(var(--hucre) * 0.24); color: var(--metin-2); font-weight: 600; line-height: 1;
}
.d-tablo--bitti .d-hucre { animation: d-parla 0.8s ease; }
@keyframes d-parla { 50% { background: color-mix(in srgb, var(--basari) 30%, var(--yuzey)); } }

.d-tuslar { display: grid; grid-template-columns: repeat(9, 1fr); gap: 5px; max-width: 470px; margin: 0 auto 12px; }
.d-tus {
  font: inherit; position: relative; min-height: 54px; padding: 0; border-radius: 10px;
  border: 1px solid var(--cizgi); background: var(--yuzey-2); color: var(--metin);
  cursor: pointer; touch-action: manipulation; display: grid; place-items: center;
}
.d-tus span { font-size: 1.4rem; font-weight: 700; }
.d-tus small { position: absolute; right: 4px; bottom: 1px; font-size: 0.7rem; color: var(--metin-2); }
.d-tus--bitti { opacity: 0.35; }
.d-eylemler { display: flex; justify-content: center; gap: 10px; }
#d-not[aria-pressed="true"] { background: var(--k); color: #fff; border-color: transparent; }
@media (prefers-color-scheme: dark) { #d-not[aria-pressed="true"] { color: #14162a; } }