.dm {
    --dm-0: light-dark(#cfe9e5, #1d4b47); --dm-1: light-dark(#f6d6bf, #5a3215); --dm-2: light-dark(#e4d4f4, #3f2a5c); --dm-3: light-dark(#d6e8c4, #2f4a1d);
    --dm-4: light-dark(#f4d0dc, #5c2236); --dm-5: light-dark(#cfdcf5, #22355c); --dm-6: light-dark(#efe3b8, #4d4115); --dm-7: light-dark(#dcdcdc, #3a3a3a);
    --dm-nokta: light-dark(#1b1b1b, #f2f2f2);
    display: grid; justify-items: center; gap: 10px; max-width: 720px; margin: 0 auto 24px; container-type: inline-size; padding: 0 12px; color: var(--body-txt-color);
}
.dm-ust { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 8px 16px; }
.dm-tarih { margin: 0; font-size: 1.3rem; }
.dm-bugune { color: var(--baglanti); }
.dm-sure { font-weight: 700; font-variant-numeric: tabular-nums; }
.dm-sekmeler { display: flex; gap: 6px; }
.dm-sekme { min-height: 40px; padding: 0 18px; border: 2px solid var(--cizgi-guclu); border-radius: 999px; background: var(--yuzey); color: var(--body-txt-color); font: inherit; font-weight: 700; cursor: pointer; }
.dm-sekme[aria-selected="true"] { border-color: var(--body-txt-color); background: var(--body-txt-color); color: var(--body-bg-color); }
.dm-tahta { --dm-k: min(56px, calc(100cqi / var(--dm-sutun))); position: relative; display: grid; grid-template-columns: repeat(var(--dm-sutun), var(--dm-k)); grid-auto-rows: var(--dm-k); max-width: 100%; }
.dm-bos { pointer-events: none; }
.dm-hucre { position: relative; display: flex; align-items: center; justify-content: center; padding: 0; border: 1px dashed color-mix(in srgb, var(--body-txt-color) 30%, transparent); color: var(--body-txt-color); font: inherit; cursor: pointer; touch-action: none; -webkit-tap-highlight-color: transparent; }
.dm-b0 { background: var(--dm-0); } .dm-b1 { background: var(--dm-1); } .dm-b2 { background: var(--dm-2); } .dm-b3 { background: var(--dm-3); }
.dm-b4 { background: var(--dm-4); } .dm-b5 { background: var(--dm-5); } .dm-b6 { background: var(--dm-6); } .dm-b7 { background: var(--dm-7); }
.dm-hucre.dm-kust { border-top: 3px solid var(--body-txt-color); }
.dm-hucre.dm-kalt { border-bottom: 3px solid var(--body-txt-color); }
.dm-hucre.dm-ksol { border-left: 3px solid var(--body-txt-color); }
.dm-hucre.dm-ksag { border-right: 3px solid var(--body-txt-color); }
.dm-imlec { box-shadow: inset 0 0 0 3px var(--focus-otl-color); }
.dm-hucre:focus-visible { outline: 3px solid var(--focus-otl-color); outline-offset: -4px; }
.dm-bozuk { background-image: repeating-linear-gradient(45deg, transparent 0 6px, color-mix(in srgb, var(--hata) 35%, transparent) 6px 9px); }
.dm-rozet { position: absolute; top: 1px; left: 2px; z-index: 2; padding: 0 4px; border-radius: 6px; background: var(--body-txt-color); color: var(--body-bg-color); font-size: .68rem; font-weight: 800; line-height: 1.35; pointer-events: none; }
.dm-tamam .dm-rozet::after { content: " \2713"; }
.dm-cerceve { z-index: 1; margin: 4px; border: 3px solid var(--body-txt-color); border-radius: 10px; pointer-events: none; }
.dm-yari { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); width: 62%; height: 62%; }
.dm-nokta { display: block; margin: auto; width: 60%; height: 60%; border-radius: 50%; }
.dm-nokta.dm-dolu { background: var(--dm-nokta); }
.dm-hucre .dm-nokta.dm-dolu { background: var(--body-txt-color); }
.dm-geri { min-height: 1.5rem; margin: 0; font-weight: 700; text-align: center; }
.dm-geri-hata { color: var(--hata); }
.dm-geri-iyi { color: var(--body-txt-color); }
.dm-geri-bilgi { color: var(--yazi-2); }
.dm-tepsi { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; width: 100%; }
.dm-tas { display: flex; align-items: center; gap: 2px; width: 88px; height: 46px; padding: 3px; border: 2px solid var(--body-txt-color); border-radius: 10px; background: var(--yuzey); color: var(--body-txt-color); cursor: grab; touch-action: none; -webkit-tap-highlight-color: transparent; }
.dm-tas .dm-yari { width: 50%; height: 100%; }
.dm-tas .dm-yari + .dm-yari { border-left: 2px solid var(--body-txt-color); }
.dm-tas .dm-nokta.dm-dolu { background: var(--body-txt-color); }
.dm-tas.dm-dikey { flex-direction: column; width: 46px; height: 88px; }
.dm-tas.dm-dikey .dm-yari { width: 100%; height: 50%; }
.dm-tas.dm-dikey .dm-yari + .dm-yari { border-left: 0; border-top: 2px solid var(--body-txt-color); }
.dm-tas.dm-secili { box-shadow: 0 0 0 4px var(--focus-otl-color); }
.dm-tas:focus-visible, .dm-dugme:focus-visible, .dm-sekme:focus-visible { outline: 3px solid var(--focus-otl-color); outline-offset: 2px; }
.dm-hayalet { position: fixed; z-index: 1003; margin: -23px 0 0 -44px; opacity: .85; pointer-events: none; }
.dm-araclar { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.dm-dugme { min-height: 40px; padding: 0 14px; border: 2px solid var(--cizgi-guclu); border-radius: 999px; background: var(--yuzey); color: var(--body-txt-color); font: inherit; font-weight: 700; cursor: pointer; }
.dm-secenek { display: flex; align-items: center; gap: 6px; }
.dm-klavye { margin: 0; color: var(--yazi-soluk); font-size: .85rem; text-align: center; }
.dm-sonuc { display: grid; justify-items: center; gap: 6px; text-align: center; }
.dm-sonuc[hidden] { display: none; }
.dm-sonuc p { margin: 0; }
.dm-soluk { margin: 0; color: var(--yazi-2); font-size: .92rem; }
.dm-kutu { box-sizing: border-box; width: 100%; max-width: 720px; margin: 0 auto 16px; padding: 12px 14px; border: 1px solid var(--cizgi-guclu); border-radius: 12px; background: var(--yuzey); }
.dm-kutu summary { cursor: pointer; font-weight: 700; }
.dm-kutu h3 { margin: 0 0 6px; font-size: 1.05rem; }
.dm-dun-izgaralar { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 10px; }
.dm-dun-izgaralar figure { margin: 0; }
.dm-dun-izgaralar figcaption { font-weight: 700; margin-bottom: 4px; }
.dm-kucuk { display: grid; grid-template-columns: repeat(var(--dm-sutun), 24px); grid-auto-rows: 24px; gap: 1px; }
.dm-k { display: flex; align-items: center; justify-content: center; border: 1px solid var(--cizgi-guclu); background: var(--yuzey-2); font-weight: 700; font-size: .85rem; }
.dm-arsiv ul { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; padding: 0; list-style: none; }
.dm-arsiv a { color: var(--baglanti); }
.oyun-diger { box-sizing: border-box; max-width: 720px; margin: 0 auto 16px; padding: 12px 14px; border: 1px solid var(--cizgi-guclu); border-radius: 12px; background: var(--yuzey); }
.oyun-diger h3 { margin: 0 0 6px; font-size: 1.05rem; }
.oyun-diger ul { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; padding: 0; list-style: none; }
.oyun-diger a { color: var(--baglanti); }
.dm-icerik table { border-collapse: collapse; margin: 8px 0 16px; }
.dm-icerik th, .dm-icerik td { padding: 4px 10px; border: 1px solid var(--cizgi-guclu); text-align: left; }
@media (prefers-reduced-motion: reduce) {
    .dm * { transition: none !important; }
}
@media (forced-colors: active) {
    .dm-hucre { forced-color-adjust: none; }
}