/* SIXTH PATH // ui_an.css :: Sürüm "KİLİT AN GÖRSELLERİ" — kilit anın resmi ve onun yerini alan yazı/işaret düzenleri
   (js/sim/kilit_an.js; scratchpad kilit_plan/SPEC.md §3, §6).
   Görünüş: düz premium — obsidyen #0d0a06 / #121110, altın #D2AC52, fildişi #EEE6D4; Cinzel başlık, Alegreya gövde. Resim
   tam genişlikte, altında 1 px altın kıl, sonra etiket · başlık · satır · basılı tutma düğmesi. Sinematik giriş tek atım:
   resim 600 ms (opacity + 1,035 → 1; kartın kayboluşu bitince), yazı 280 ms, düğme resmin +600 ms'sinde; animation-fill-mode backwards (bitince stil sabit).
   KURAL (Android WebView): sonsuz animasyon, kalıcı will-change, mask, blend, backdrop-filter, filter YOK. Yazının altındaki
   koyulaşma düz linear-gradient zemin (maske değil). Az harekette hiçbir şey kıpırdamaz.
   § 1 ortak (.an-resim, .an-yazi) · § 2 O kart arkasının örtüsü (.hk-an) · § 3 S set piece (.sd-an, .sd-metin) ·
   § 4 G Genelge başlığı (.ck-an) · § 5 E vasiyet (.vs-an) · § 6 kapanışın işaret madalyonları (.ck-hal) ·
   § 7 ARŞİV kil karoları (.ar-hal) · § 8 GAZETE yazılı ön sayfa (.gz-metin) · § 9 KARANLIK ODA negatifleri (.ko-negatif) ·
   § 10 kapı işareti (.kapi-glif) · § 11 hafıza bandı / kadro işareti (.sg-hal, .kd-hal) */

/* ---- § 1 ORTAK ------------------------------------------------------------------------------------------------------- */
:root { --an-obs: #0d0a06; --an-obs2: #121110; --an-altin: #D2AC52; --an-altin-sonuk: #A88D57; --an-fil: #EEE6D4; --an-fil2: #BDB29C; }
.an-resim { position: relative; margin: 0; overflow: hidden; background: var(--an-obs); }
.an-resim img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* resmin alt kenarı yazıya kararır: düz degrade zemin (maske değil), resmin üstünde ayrı öğe */
.an-resim::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 22%; pointer-events: none;
  background: linear-gradient(180deg, rgba(13, 10, 6, 0) 0%, rgba(13, 10, 6, .78) 100%); }
.an-yazi { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center;
  border-top: 1px solid var(--an-altin); padding: 12px 18px 0; color: var(--an-fil); }
.an-etiket { font: 700 10.5px/1.3 var(--a-baslik, 'Cinzel', serif); letter-spacing: .22em; color: var(--an-altin-sonuk); text-transform: uppercase; }
.an-baslik { margin: 0; font: 700 20px/1.15 var(--a-baslik, 'Cinzel', serif); letter-spacing: .1em; color: var(--an-altin); }
.an-satir { margin: 0; max-width: 30em; font: italic 500 15px/1.4 var(--a-govde, 'Alegreya', serif); color: var(--an-fil); }
/* düğme: oyunun basılı tutma düğmesi (altın, katı kenar; dolgu çizgisi tutuş boyunca dolar) */
.an-tut:is(#pr-k, *) { position: relative; flex: none; display: flex; width: 100%; max-width: 440px; min-height: 50px; margin: 6px auto 0;
  padding: 0 14px 4px; font-size: 13px; letter-spacing: .14em; overflow: hidden; }
.an-tut span { position: relative; }
.an-tut s { position: absolute; left: 16px; right: 16px; bottom: 8px; height: 3px; border-radius: 2px; overflow: hidden;
  background: rgba(28, 21, 6, .2); text-decoration: none; pointer-events: none; }
.an-tut s i { position: absolute; inset: 0; border-radius: inherit; background: #1c1506; transform: scaleX(0); transform-origin: 0 50%; }
.an-tut.tut-dolu s i { transform: scaleX(1); transition: transform var(--tut-ms, 600ms) linear; }
.an-tut.tut-dolu:is(#pr-k, *) { transform: translateY(4px); box-shadow: 0 0 0 var(--a-altin-kenar, #8c6a1e); }
.an-tut:is(#pr-k, *):disabled { opacity: 1; cursor: default; }
@keyframes anResim { from { opacity: 0; transform: scale(1.035); } }
@keyframes anYazi { from { opacity: 0; transform: translateY(6px); } }
@keyframes anDugme { from { opacity: 0; } }

/* ---- § 2 O · KART ARKASININ ÖRTÜSÜ (#dc-hukum > .hk-an) ------------------------------------------------------------- */
/* örtü opak obsidyen; arkadaki rapor satırları açık değil (görünmez ve animasyonsuz) — örtü kalkınca normal girişleri oynar */
html body.kartli .dc-box.muhurlu #dc-hukum.hk-c > .hk-an { position: absolute; inset: 0; z-index: 4; display: flex; flex-direction: column;
  border-radius: 14px; overflow: hidden; background: var(--an-obs); box-shadow: inset 0 0 0 1px rgba(210, 172, 82, .28);
  opacity: 1; transition: opacity 200ms ease-in; touch-action: none; }
body.kartli #dc-hukum.hk-c > .hk-an.an-cik { opacity: 0; pointer-events: none; }
body.kartli #dc-hukum.hk-c.hk-an-acik .hk-kirp, body.kartli #dc-hukum.hk-c.hk-an-acik .hk-rulo { visibility: hidden; }
body.kartli #dc-hukum.hk-c.hk-an-acik .hk-g, body.kartli #dc-hukum.hk-c.hk-an-acik .hk-muhur,
body.kartli #dc-hukum.hk-c.hk-an-acik .hk-iz4 b { animation: none !important; }
/* resim: yazının bıraktığı bütün yer (yazı ve düğme dipte) — kartın üst payı (rütbe şeridi, PERDE · YIL dizini, ayar düğmesi) resmin üstüne biner */
body.kartli #dc-hukum > .hk-an .an-resim { flex: 1 1 auto; min-height: 38%; }
body.kartli #dc-hukum > .hk-an .an-yazi { flex: none; padding: 12px 16px 14px; background: var(--an-obs); }
/* açılış: kayboluş (kutu + toz tuvali, ≤ 800 ms) bittikten SONRA — kilit_an.js 800. ms'de .an-gir ekler: resim 600 ms, +200 ms yazı,
   +600 ms düğme. Animasyon gecikmeyle değil sınıfla başlar: gecikmedeki animasyon da katman açar, toz ile resim üst üste binerdi
   (WebView ≤ 60 MB @3x; birlikteyken 68 MB ölçüldü — kilit_uyg/katman_iz_karta.mjs). an-gir'den önce resim ve yazı durağan gizli. */
body.kartli #dc-hukum > .hk-an:not(.an-gir) .an-resim img, body.kartli #dc-hukum > .hk-an:not(.an-gir) .an-yazi > :not(.an-tut) { opacity: 0; }
body.kartli #dc-hukum > .hk-an.an-gir .an-resim img { animation: anResim 600ms cubic-bezier(.2, .7, .3, 1) 1 backwards; }
body.kartli #dc-hukum > .hk-an.an-gir .an-yazi > :not(.an-tut) { animation: anYazi 280ms ease-out 200ms 1 backwards; }
body.kartli #dc-hukum > .hk-an .an-tut { visibility: hidden; }
body.kartli #dc-hukum > .hk-an.an-hazir .an-tut { visibility: visible; animation: anDugme 220ms ease-out 1 backwards; }
body.kartli #dc-hukum > .hk-an.an-az *, body.az-hareket #dc-hukum > .hk-an * { animation: none !important; transition: none !important; }
@media (max-height: 700px) {
  body.kartli #dc-hukum > .hk-an .an-yazi { gap: 4px; padding: 9px 14px 10px; }
  body.kartli #dc-hukum > .hk-an .an-baslik { font-size: 18px; }
  body.kartli #dc-hukum > .hk-an .an-satir { font-size: 14px; line-height: 1.32; }
  body.kartli #dc-hukum > .hk-an .an-tut:is(#pr-k, *) { min-height: 46px; }
}

/* ---- § 3 S · SET PIECE SAYFASI (#sd-dizi .sd-an / .sd-metin) --------------------------------------------------------- */
/* resim tam genişlikte (gövdenin 16 px yan payını taşar), uzun ekranda 4:5'e dek uzar (kare kenarlardan kırpılır): boyu
   min(125vw, 60dvh); yazı kalan yerin ortasında (resim ile düğme arasında boşluk dengeli) */
#sd-dizi .sd-sayfa.sd-an { justify-content: flex-start; gap: 0; }
#sd-dizi .sd-an .an-resim { flex: none; width: calc(100% + 32px); max-width: 100vw; margin: 0 -16px; height: min(125vw, 60vh); height: min(125vw, 60dvh); }
#sd-dizi .sd-an .an-yazi { width: 100%; box-sizing: border-box; padding: 12px 6px; margin-block: auto; }
#sd-dizi .sd-an .sd-ek { margin-top: 8px; }
/* başlık ve satır motorun sınıflarını da taşır (sd-baslik / sd-satir): kilit anın yazı biçimi kazanır */
#sd-dizi .sd-an .an-baslik.sd-baslik { margin: 0; font: 700 20px/1.15 var(--a-baslik, 'Cinzel', serif); letter-spacing: .1em; color: var(--an-altin); }
#sd-dizi .sd-an .an-satir.sd-satir { margin: 0; padding: 0; max-width: 30em; font: italic 500 15px/1.4 var(--a-govde, 'Alegreya', serif); color: var(--an-fil); }
/* foto banyosu (karanlık oda baskıları: sd-foto): resim 600 ms'de banyodan çıkar (ui_r3.css § 0 ile aynı süre) */
#sd-dizi .sd-an:not(.sd-gir) .an-resim img { animation: anResim 600ms cubic-bezier(.2, .7, .3, 1) 1 backwards; }
#sd-dizi .sd-an:not(.sd-gir) .an-yazi { animation: anYazi 280ms ease-out 220ms 1 backwards; }
/* resimsiz sayfa: ortada yazı, çağın düz zemini; boş plaka çerçevesi yok */
#sd-dizi .sd-sayfa.sd-metin { justify-content: center; gap: 12px; padding: 0 8px; }
#sd-dizi .sd-metin::before { content: ''; display: block; width: 120px; height: 1px; background: var(--an-altin); opacity: .7; }
#sd-dizi .sd-metin .sd-baslik { margin-top: 0; }
#sd-dizi .sd-metin .sd-satir { font-style: italic; font-size: 17px; line-height: 1.45; }
body.az-hareket #sd-dizi .sd-an * { animation: none !important; }
@media (max-height: 700px) {
  #sd-dizi .sd-an .an-resim { height: min(100vw, 46vh); height: min(100vw, 46dvh); }
  #sd-dizi .sd-an .an-yazi { gap: 4px; padding-top: 9px; }
  #sd-dizi .sd-an .an-baslik.sd-baslik { font-size: 18px; }
  #sd-dizi .sd-an .an-satir.sd-satir { font-size: 14px; line-height: 1.32; }
}

/* ---- § 4 G · GENELGE BAŞLIĞI (#ck-tore .ck-an) ------------------------------------------------------------------- */
/* tam genişlikte başlık: kökün yan ve üst payını taşar; boyu min(40dvh, 100vw), yer yoksa 120 px'e dek esner.
   120 px'te de sığmayan kalabalık Genelge'de gizlenir (ck-sik1; cag_kapi.js sigdirKapi) */
#ck-tore.ck-anli:not(.ck-sik1) { padding-top: 0; }
#ck-tore .ck-an-kok { flex: 0 1 auto; min-height: 120px; display: flex; flex-direction: column; margin: 0 -16px; }
#ck-tore .ck-an { flex: 0 1 auto; min-height: 120px; height: min(40vh, 100vw); height: min(40dvh, 100vw); border-bottom: 1px solid var(--ck-altin, #d2ac52); }
#ck-tore.ck-anli .ck-sahne { flex: 1 0 auto; justify-content: flex-start; padding-top: 2px; }
#ck-tore .ck-an img { animation: anResim 600ms cubic-bezier(.2, .7, .3, 1) 300ms 1 backwards; }
#ck-tore.ck-sik1 .ck-an-kok { display: none; }
#ck-tore.ck-sik1.ck-anli .ck-sahne { flex: 1 1 auto; justify-content: center; }
#ck-tore.atla .ck-an img, #ck-tore.bitti .ck-an img { animation: none; }

/* ---- § 5 E · VASİYETİN İLK SLAYTI (#vasiyet .vs-an) ------------------------------------------------------------- */
html body #vasiyet .vs-kutu.vs-anli { padding-top: 0; }
html body #vasiyet .vs-an { flex: none; width: calc(100% + 44px); margin: 0 -22px 20px; height: min(42vh, 100vw); height: min(42dvh, 100vw);
  border-bottom: 1px solid var(--an-altin); border-radius: 8px 8px 0 0; }
html body #vasiyet .vs-an img { animation: anResim 600ms cubic-bezier(.2, .7, .3, 1) 200ms 1 backwards; }
html body #vasiyet .vs-anli .vs-metin { min-height: 4.5em; }
/* resimli slaytta öğeler büzülmez (uzun metin düğmenin ve sayacın üstüne binmesin; sığmazsa kutu kayar); kısa ekranda resim küçülür */
html body #vasiyet .vs-kutu.vs-anli > * { flex-shrink: 0; }
@media (max-height: 700px) { html body #vasiyet .vs-an { height: min(24vh, 100vw); height: min(24dvh, 100vw); margin-bottom: 12px; } }
body.az-hareket #vasiyet .vs-an img { animation: none; }

/* ---- § 6 KAPANIŞIN "NE KURDUN" MADALYONLARI (#ck-tore .ck-hal) -------------------------------------------------- */
/* üç kil madalyon, içinde hükmün mağara işareti (hal.js) — fildişi parşömenin üstünde, durağan */
#ck-tore .ck-hal-uc .ck-hal { align-items: center; text-align: center; }
#ck-tore .ck-hal-mad { display: flex; align-items: center; justify-content: center; width: min(64px, 100%); aspect-ratio: 1; border-radius: 50%;
  color: #3a1d0c; background: radial-gradient(circle at 38% 32%, #d9a873 0%, #b47b46 52%, #8a5a2f 100%);
  box-shadow: inset 0 0 0 1px rgba(58, 29, 12, .45), inset 0 -3px 6px rgba(58, 29, 12, .28), 0 0 0 1px #c9a452; }
#ck-tore .ck-hal-mad svg { width: 58%; height: 58%; }
#ck-tore .ck-hal-uc .ck-hal-mad { width: min(46px, 100%); }
@media (max-height: 700px) { #ck-tore .ck-hal-uc .ck-hal-mad { width: min(40px, 100%); } }

/* ---- § 7 ARŞİV: pişmiş kil karolar (#od-perde.arsiv .ar-hal) ---------------------------------------------------- */
#od-perde.arsiv .ar-tas.ar-hal { display: flex; align-items: center; justify-content: center; }
#od-perde.arsiv .ar-tas.ar-hal:not(.ar-kul-tas) { color: #3e1f0c;
  background: linear-gradient(150deg, #c99862 0%, #ad7643 55%, #8f5d31 100%);
  box-shadow: inset 0 0 0 1px rgba(58, 29, 12, .4), inset 0 1px 0 rgba(255, 226, 180, .3); }
#od-perde.arsiv .ar-tas.ar-hal svg { width: 26px; height: 26px; }
#od-perde.arsiv .ar-tas.ar-hal.ar-kul-tas { color: #b9b4ab; }
#od-perde.arsiv .ar-altin .ar-tas.ar-hal:not(.ar-kul-tas) { box-shadow: inset 0 0 0 1px #e1c070, inset 0 1px 0 rgba(255, 236, 190, .35); }

/* ---- § 8 GAZETE: yazılı ön sayfa (.gz-metin) — fotoğrafsız, 1900'lerin ön sayfası, tek sütun defter; kutu aynı ----------------- */
#dc-hukum .gz-sayfa .gz-metin { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 1.2cqmin; overflow: hidden;
  border-top: 1px solid var(--r3-gumus, #8d8a83); padding-top: 1.4cqmin; text-align: left; }
#dc-hukum .gz-sayfa .gz-soz { margin: 0; font: italic 600 max(10px, 3.9cqmin)/1.22 var(--a-govde, 'Alegreya', serif); color: #1d1a14;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
#dc-hukum .gz-sayfa .gz-soz q { quotes: '\201C' '\201D'; }
#dc-hukum .gz-sayfa .gz-olay-bas { margin: 0; padding: .6cqmin 0; border-top: .5cqmin double #1d1a14; border-bottom: 1px solid #1d1a14; text-align: center;
  font: 700 max(8px, 2.9cqmin)/1.1 var(--a-baslik, 'Cinzel', serif); letter-spacing: .18em; color: #1d1a14; }
#dc-hukum .gz-sayfa .gz-olaylar { flex: 1 1 auto; min-height: 0; margin: 0; padding: 0 10cqmin 0 0; list-style: none;
  display: flex; flex-direction: column; gap: 1.3cqmin; overflow: hidden; }
#dc-hukum .gz-sayfa .gz-olaylar li { flex: none; min-width: 0; padding-left: 2.2cqmin; border-left: 1px solid rgba(29, 26, 20, .4); }
#dc-hukum .gz-sayfa .gz-olaylar b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font: 700 max(9px, 3.2cqmin)/1.2 var(--a-govde, 'Alegreya', serif); color: #1d1a14; }
#dc-hukum .gz-sayfa .gz-olaylar small { display: block; margin-top: .3cqmin; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  font: 700 max(7px, 2.4cqmin)/1.1 var(--a-baslik, 'Cinzel', serif); letter-spacing: .1em; color: #5a5446; }
@container (max-height: 360px) { #dc-hukum .gz-sayfa .gz-olaylar li:nth-child(n+3) { display: none; } }

/* ---- § 9 KARANLIK ODA (#sd-dizi): negatifler (.ko-negatif) ve baskılar (.ko-baski) ----------------------------------- */
/* film kareleri koyu, dişli kenar repeating-linear-gradient (durağan); içinde hükmün işareti fildişi (negatif) */
#sd-dizi .ko-neg .sd-ek { width: 100%; }
#sd-dizi .ko-negatif { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; width: 100%; max-width: 420px; margin: 0 auto; }
#sd-dizi .ko-kare { margin: 0; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
#sd-dizi .ko-film { position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 3 / 4;
  color: #e9dfc8; background:
    repeating-linear-gradient(180deg, transparent 0 5px, #0a0807 5px 9px) left 3px top 0 / 5px 100% no-repeat,
    repeating-linear-gradient(180deg, transparent 0 5px, #0a0807 5px 9px) right 3px top 0 / 5px 100% no-repeat,
    linear-gradient(180deg, #2a2420 0%, #1c1815 100%);
  box-shadow: inset 0 0 0 1px rgba(233, 223, 200, .18), 0 0 0 1px #0a0807; }
#sd-dizi .ko-film svg { width: 52%; height: auto; opacity: .92; }
#sd-dizi .ko-kare figcaption { text-align: center; min-width: 0; }
#sd-dizi .ko-kare figcaption b { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
  font: italic 500 12px/1.22 var(--a-govde, 'Alegreya', serif); color: var(--an-fil); }
#sd-dizi .ko-kare figcaption small { display: block; margin-top: 3px; font: 700 8.5px/1.2 var(--a-baslik, 'Cinzel', serif); letter-spacing: .12em; color: #b4a98f; }
/* baskı: kâğıt kenarlı fotoğraf, banyoda belirir (§ 3 .sd-an açılışı) */
#sd-dizi .sd-an.ko-baski .an-resim { box-shadow: inset 0 0 0 6px #e9e4d8, inset 0 0 0 7px rgba(29, 26, 20, .4); }
#sd-dizi .sd-an.ko-baski .an-resim img { padding: 6px; box-sizing: border-box; background: #e9e4d8; }
@media (max-height: 700px) { #sd-dizi .ko-kare figcaption b { -webkit-line-clamp: 2; font-size: 11px; } }

/* ---- § 10 KAPI İŞARETİ (kapi7.js kapiGlif): yedi taşlı kemer, geçilen kapının taşı altın ------------------------------ */
#ck-tore .ck-kapi svg.kapi-glif { flex: none; display: block; width: 44px; height: 44px; margin: 1px 2px 0 0; color: var(--kn-altin, #d2ac52); }
#ck-tore .ck-kapi svg.kapi-glif circle.yan { fill: var(--kn-altin, #d2ac52); }
#ck-tore .ck-kapi svg.kapi-glif circle.son { fill: none; stroke: rgba(210, 172, 82, .45); stroke-width: 1; }
#ck-tore.ck-sik1 .ck-kapi svg.kapi-glif { display: none; }
@media (max-height: 700px) { #ck-tore .ck-kapi svg.kapi-glif { width: 36px; height: 36px; } }

/* ---- § 11 HAFIZA BANDI (#dc-cause .sg-hal) ve KADRONUN HATIRASI (#od-hatira .kd-hal): hükmün mağara işareti ----------- */
html body.kartli #dc-cause.sg-bas .sg-foto.sg-hal { display: flex; align-items: center; justify-content: center; color: #3e1f0c;
  background: linear-gradient(150deg, #c99862 0%, #ad7643 55%, #8f5d31 100%); box-shadow: 0 0 0 1px #6B4C14, inset 0 1px 0 rgba(255, 226, 180, .3); }
html body.kartli #dc-cause.sg-bas .sg-foto.sg-hal svg { width: 28px; height: 28px; }
html body.kartli #od-hatira .kd-hal { flex: none; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 4px;
  color: #3e1f0c; background: linear-gradient(150deg, #c99862 0%, #ad7643 55%, #8f5d31 100%); box-shadow: 0 0 0 1px rgba(90, 66, 16, .6); }
html body.kartli #od-hatira .kd-hal svg { width: 20px; height: 20px; }

/* ---- § 12 KRİZ ve BELA KARTININ ÖNÜ (D5): portresiz kartta ikon madalyonu (#dc-art .kz-madalyon) ------------------- */
html body.kartli #decision .dc-box #dc-art.kz-art > .kz-madalyon { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
  min-height: 120px; background: radial-gradient(circle at 50% 45%, #2a2117 0%, #121110 70%); color: var(--kz-altin, #d2ac52); }
html body.kartli #decision .dc-box.bl-kart #dc-art.kz-art > .kz-madalyon { color: #C98A4E; }
html body.kartli #decision .dc-box #dc-art.kz-art > .kz-madalyon svg { width: min(38%, 120px); height: auto; }

/* ---- § 13 UZAK EL DOSYASI'nın klasörü (set piece 'dosya' 1. sayfa .ue-klasor): manila dosya, CSS, resim yok ---------- */
#sd-dizi .ue-klasor { position: relative; width: min(70vw, 300px); aspect-ratio: 4 / 3; margin: 14px auto 6px; box-sizing: border-box; padding: 22% 9% 0;
  border-radius: 3px 6px 4px 4px; background: linear-gradient(170deg, #d9bf8a 0%, #c9a96d 60%, #b8955a 100%);
  box-shadow: inset 0 0 0 1px rgba(60, 40, 10, .35), inset 0 -10px 18px rgba(80, 50, 10, .18), 0 10px 22px rgba(0, 0, 0, .55); color: #3a2a10; text-align: left; }
#sd-dizi .ue-klasor-sekme { position: absolute; left: 7%; top: -14px; width: 34%; height: 18px; border-radius: 5px 5px 0 0; background: #d3b77e;
  box-shadow: inset 0 0 0 1px rgba(60, 40, 10, .3); font: 700 11px/18px var(--a-baslik, 'Cinzel', serif); text-align: center; color: #5a3d0e; }
#sd-dizi .ue-klasor b { display: block; font: 700 clamp(13px, 4.4vw, 17px)/1.15 var(--a-baslik, 'Cinzel', serif); letter-spacing: .12em; }
#sd-dizi .ue-klasor-cizgi { display: block; height: 1px; margin-top: 12px; background: rgba(58, 42, 16, .45); }
#sd-dizi .ue-klasor-muhur { position: absolute; right: 9%; bottom: 12%; width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  border: 2px solid rgba(143, 46, 24, .75); color: rgba(143, 46, 24, .85); font: 700 15px/1 var(--a-baslik, 'Cinzel', serif); font-style: normal; rotate: -12deg; }