/* =============================================================
   vaka.css — "VAKA DOSYASI" OYUNUNA ÖZEL GÖRÜNÜM
   Ortak oyun stilleri css/oyun.css içinde. Renkler css/tema.css'te
   (--vaka-kagit, --vaka-murekkep, --vaka-damga …). Burada sabit renk kodu yok.
   Belgeler koyu site zemininde krem rengi kâğıt gibi durur.
   ============================================================= */

/* ---------- ortak parçalar ---------- */
.btn.buyuk{font-size:18px;padding:18px 28px;width:100%;max-width:360px}
.btn[hidden],.linkbtn[hidden]{display:none}
.vk-etiket{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.vk-ipucu{margin:0;font-size:15px;color:var(--muted);max-width:52ch}
.vk-ipucu b{color:var(--text);font-weight:600}
.vk-not{margin:0;font-size:13px;color:var(--muted)}
.vk-sayi{font-family:var(--f-mono);font-size:12px;color:var(--vaka-dosya);font-variant-numeric:tabular-nums;letter-spacing:.04em}
/* ekranda görünmez ama ekran okuyucu okur */
.vk-gizli{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.vk-kutu{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:22px 20px}
.vk-kutu h2,.vk-kutu h3{font-family:var(--f-display);font-weight:800;font-size:24px;margin:0 0 10px;letter-spacing:.02em}
.vk-kutubas{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.vk-kutubas h2{margin:0}

.vk-kucukbtn{
  font:600 14px/1 var(--f-body);color:var(--text);background:var(--bg-2);
  border:1px solid var(--line);border-radius:999px;padding:0 16px;min-height:44px;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;
}
.vk-kucukbtn:hover{border-color:var(--muted)}
.vk-mini{
  min-width:44px;min-height:44px;border-radius:8px;border:1px solid transparent;flex:none;
  background:none;color:var(--muted);font-size:16px;cursor:pointer;
}
.vk-mini:hover{color:var(--text);border-color:var(--line)}
.vk-bos{
  margin:0;border:1px dashed var(--line);border-radius:var(--r);
  padding:18px 16px;text-align:center;color:var(--muted);font-size:14px;
}
/* "altı noktalı" örneği: gerçek ipucunun görünüşünü taklit eder */
.vk-iz-ornek{border-bottom:2px dotted var(--vaka-dosya);color:var(--text);font-weight:600}

/* renkli olmayan vesikalık: baş harfler, kâğıt üstünde fotoğraf yeri gibi */
.vk-vesika,.vk-vesika-mini{
  display:inline-grid;place-items:center;flex:none;
  font-family:var(--f-display);font-weight:800;letter-spacing:.03em;
  background:var(--vaka-kagit-2);color:var(--vaka-murekkep);
  border:2px solid var(--vaka-murekkep);
}
.vk-vesika{width:52px;height:62px;border-radius:4px;font-size:22px}
.vk-vesika-mini{width:32px;height:32px;border-radius:50%;font-size:14px;border-width:1.5px}


/* =============================================================
   KAPAK (MENÜ)
   ============================================================= */
/* vaka rafı: kapağın üstünde, her vaka bir dosya sekmesi */
.vk-raf{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:8px;
  max-width:640px;margin-top:22px;
}
.vk-raf[hidden]{display:none}
.vk-raf-dosya{
  display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:68px;padding:10px 14px;
  text-align:left;cursor:pointer;font:inherit;color:var(--muted);
  background:var(--bg-2);border:1.5px dashed var(--line);border-radius:10px 10px 4px 4px;
  transition:border-color .15s, background .15s, color .15s;
}
@media (hover:hover){.vk-raf-dosya:hover{border-color:var(--vaka-dosya);color:var(--text)}}
.vk-raf-dosya strong{font-family:var(--f-display);font-weight:800;font-size:20px;line-height:1.05;letter-spacing:.02em;color:var(--text)}
.vk-raf-no{font-family:var(--f-daktilo);font-weight:700;font-size:12px;letter-spacing:.12em}
.vk-raf-durum{font-family:var(--f-mono);font-size:11px;letter-spacing:.03em}
.vk-raf-dosya[aria-pressed="true"]{
  border:1.5px solid var(--vaka-dosya);color:var(--vaka-murekkep);background:var(--vaka-dosya);cursor:default;
}
.vk-raf-dosya[aria-pressed="true"] strong{color:var(--vaka-murekkep)}
.vk-kapak.degisti .vk-kapak-ic{animation:vk-kay .35s ease-out both}

.vk-kapak{margin-top:26px;position:relative;max-width:640px}
.vk-raf:not([hidden]) + .vk-kapak{margin-top:14px}
.vk-kapak-sekme{
  display:inline-block;background:var(--vaka-dosya);color:var(--vaka-murekkep);
  font-family:var(--f-daktilo);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  padding:8px 18px 6px;border-radius:10px 10px 0 0;margin-left:18px;
}
.vk-kapak-ic{
  position:relative;overflow:hidden;
  background:var(--vaka-dosya);color:var(--vaka-murekkep);
  border-radius:4px 14px 14px 14px;padding:26px 22px 22px;
  box-shadow:0 18px 40px color-mix(in srgb, var(--bg) 70%, transparent),
             inset 0 0 0 1px color-mix(in srgb, var(--vaka-dosya-deep) 50%, transparent);
  display:flex;flex-direction:column;gap:8px;
}
/* kartonun üstündeki ince beyaz etiket kâğıdı */
.vk-kapak-ic::before{
  content:"";position:absolute;inset:14px 14px auto auto;width:64px;height:10px;
  background:color-mix(in srgb, var(--vaka-kagit) 60%, transparent);border-radius:2px;
}
.vk-kapak-kurum{font-family:var(--f-daktilo);font-size:12px;letter-spacing:.06em;text-transform:uppercase;max-width:30ch}
.vk-kapak-no{font-family:var(--f-daktilo);font-size:15px}
.vk-kapak-no b{font-weight:700;letter-spacing:.04em}
.vk-kapak-baslik{
  font-family:var(--f-display);font-weight:800;font-size:clamp(40px,11vw,68px);line-height:.92;
  margin:8px 0 2px;text-transform:uppercase;letter-spacing:.005em;text-wrap:balance;max-width:12ch;
}
.vk-kapak-on{margin:0;font-size:16px;max-width:44ch;line-height:1.45}
.vk-kapak-bilgi{
  display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;padding-top:12px;
  border-top:1px dashed var(--vaka-dosya-deep);
  font-family:var(--f-daktilo);font-size:13.5px;
}
.vk-kapak-bilgi b{letter-spacing:.12em;font-weight:700}
.vk-kapak-damga{
  position:absolute;right:14px;top:58px;
  font-family:var(--f-daktilo);font-weight:700;font-size:26px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--vaka-damga);border:3px solid var(--vaka-damga);border-radius:6px;padding:4px 12px 2px;
  transform:rotate(-12deg);opacity:.85;pointer-events:none;
}

/* kurgu uyarısı: kapağın altında, gözden kaçmasın diye kırmızı çerçeveli */
.vk-kurgu{
  display:flex;gap:14px;align-items:flex-start;max-width:640px;margin-top:16px;
  padding:16px 16px 16px 14px;border-radius:var(--r);
  border:2px solid var(--vaka-damga);background:color-mix(in srgb, var(--vaka-damga) 10%, var(--bg-2));
}
.vk-kurgu-isaret{
  flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:var(--vaka-damga);color:var(--vaka-kagit);font-family:var(--f-display);font-weight:800;font-size:22px;
}
.vk-kurgu h2{font-family:var(--f-display);font-weight:800;font-size:24px;line-height:1;margin:5px 0 8px;letter-spacing:.02em}
.vk-kurgu p{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
.vk-kurgu b{color:var(--text);font-weight:600}

.vk-baslat{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:20px;max-width:640px}
.vk-durum{margin:0;font-family:var(--f-mono);font-size:12.5px;color:var(--muted);letter-spacing:.02em}
.vk-durum:empty{display:none}
.vk-durum b{color:var(--vaka-dosya);font-weight:600}
.vk-baslat-ikincil{display:flex;gap:14px;flex-wrap:wrap}

.vk-menu-izgara{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
  gap:14px;margin-top:26px;align-items:start;
}
.vk-menu-izgara .vk-ipucu{font-size:14px;margin-top:6px}
.vk-ekle{display:flex;gap:8px;margin-top:14px}
.vk-ekle input[type="text"]{font:500 18px var(--f-body);text-align:left;letter-spacing:0;padding:12px 14px;min-height:50px}
.vk-ekle .btn{flex:none;padding-inline:20px}
.vk-uyari{min-height:1.4em;margin:6px 0 0;font-size:13px;color:var(--bad)}
.vk-isimler{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.vk-isim{
  display:flex;align-items:center;gap:8px;padding:2px 2px 2px 6px;
  background:var(--bg);border:1px solid var(--line-soft);border-radius:999px;font-weight:600;
}
.vk-nasil ol{margin:0;padding-left:1.3em;color:var(--muted);font-size:15px}
.vk-nasil li{margin-bottom:9px}
.vk-nasil li::marker{color:var(--vaka-dosya);font-family:var(--f-mono)}
.vk-nasil b{color:var(--text);font-weight:600}
.vk-nasil .vk-not{margin-top:12px;border-left:2px solid var(--vaka-dosya-deep);padding-left:10px}


/* =============================================================
   SORUŞTURMA — oyun sırasında site başlığı gizlenir
   ============================================================= */
body.sahnede .sitehead,
body.sahnede .sitefoot{display:none}
body.sahnede .wrap{padding-block:10px 0}
body.sahnede .screen{margin-top:0}
body.perdeli{overflow:hidden}

#s-dosya{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
.vk-gorunum{max-width:760px;margin:0 auto}
.vk-gorunum:focus{outline:none}
.vk-gorunum[hidden]{display:none}

/* üst şerit */
.vk-ust{
  display:flex;align-items:center;gap:10px;max-width:760px;margin:0 auto 14px;
  padding-bottom:10px;border-bottom:1px solid var(--line);
}
.vk-ust-baslik{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.vk-ust-baslik strong{
  font-family:var(--f-display);font-weight:800;font-size:19px;line-height:1.05;letter-spacing:.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.vk-ust-baslik .vk-etiket{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vk-muhurler{list-style:none;margin:0;padding:0;display:flex;gap:5px;flex:none}
.vk-muhurler li{
  width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--f-mono);font-size:11px;font-weight:600;color:var(--muted);
  border:1.5px dashed var(--line);
}
.vk-muhurler li.simdi{border:1.5px solid var(--vaka-dosya);color:var(--vaka-dosya)}
.vk-muhurler li.tamam{background:var(--vaka-damga);border:1.5px solid var(--vaka-damga);color:var(--vaka-kagit)}

/* alt menü */
.vk-altmenu{
  position:fixed;left:0;right:0;bottom:0;z-index:30;
  display:grid;grid-template-columns:repeat(4,1fr);
  padding:6px max(8px, calc((100% - 560px) / 2)) calc(6px + env(safe-area-inset-bottom));
  background:var(--bg-2);   /* eski telefonlar için yedek */
  background:color-mix(in srgb, var(--bg-2) 94%, transparent);
  border-top:1px solid var(--line);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
#s-dosya:not(.live) .vk-altmenu{display:none}
.vk-altmenu button{
  position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;
  min-height:58px;padding:6px 4px;border:none;border-radius:12px;background:none;cursor:pointer;
  color:var(--muted);font:600 12.5px/1 var(--f-body);
}
.vk-altmenu button:hover{color:var(--text)}
.vk-altmenu svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.vk-altmenu button[aria-current="page"]{color:var(--vaka-dosya);background:color-mix(in srgb, var(--vaka-dosya) 12%, transparent)}
.vk-rozet{
  position:absolute;top:4px;left:calc(50% + 8px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:var(--vaka-dosya);color:var(--vaka-murekkep);font:600 11px/18px var(--f-mono);font-style:normal;text-align:center;
}
.vk-nokta{
  position:absolute;top:7px;left:calc(50% + 10px);width:10px;height:10px;border-radius:50%;
  background:var(--vaka-damga);box-shadow:0 0 0 3px var(--bg-2);
  animation:vk-nabiz 1.8s ease-in-out infinite;
}
.vk-rozet[hidden],.vk-nokta[hidden]{display:none}
@keyframes vk-nabiz{0%,100%{transform:scale(1)}50%{transform:scale(1.35)}}

/* küçük bildirim */
.vk-bildirim{
  position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));z-index:35;
  transform:translate(-50%,16px);opacity:0;pointer-events:none;
  background:var(--vaka-kagit);color:var(--vaka-murekkep);font:600 14px/1.2 var(--f-body);
  padding:11px 16px;border-radius:999px;max-width:calc(100% - 32px);text-align:center;
  box-shadow:0 10px 30px color-mix(in srgb, var(--bg) 70%, transparent);
  transition:opacity .2s, transform .2s;
}
.vk-bildirim.acik{opacity:1;transform:translate(-50%,0)}
.vk-bildirim:empty{display:none}


/* =============================================================
   BELGELER — liste
   ============================================================= */
.vk-rehber{
  display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:12px;
  border:1px solid var(--vaka-dosya-deep);border-radius:var(--r);padding:14px 16px;
  background:color-mix(in srgb, var(--vaka-dosya) 8%, var(--bg-2));
}
.vk-rehber[hidden]{display:none}
.vk-rehber p{margin:0;font-size:14.5px;color:var(--muted)}
.vk-rehber b{color:var(--text)}

.vk-devam{
  display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 12px;width:100%;
  text-align:left;cursor:pointer;padding:16px 18px;border-radius:var(--r);
  background:var(--vaka-kagit);color:var(--vaka-murekkep);border:none;
  box-shadow:0 8px 24px color-mix(in srgb, var(--bg) 60%, transparent);
}
.vk-devam .vk-etiket{color:var(--vaka-soluk);grid-column:1}
.vk-devam strong{font-family:var(--f-display);font-weight:800;font-size:23px;line-height:1.05;letter-spacing:.01em;grid-column:1}
.vk-devam .vk-ok{grid-column:2;grid-row:1 / span 2;font-size:26px;color:var(--vaka-damga)}
.vk-devam:hover{background:var(--vaka-kagit-2)}
.vk-devam:focus-visible{outline-offset:3px}

.vk-grup{margin-top:22px}
.vk-grup-baslik{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 8px;
  font-family:var(--f-display);font-weight:800;font-size:22px;letter-spacing:.02em;
}
.vk-belgeler{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.vk-belge{
  display:flex;align-items:center;gap:12px;width:100%;min-height:62px;padding:9px 12px;text-align:left;
  background:var(--bg-2);border:1px solid var(--line);border-left:4px solid var(--vaka-dosya);
  border-radius:var(--r);color:var(--text);cursor:pointer;font:inherit;transition:border-color .15s, background .15s;
}
@media (hover:hover){.vk-belge:hover{border-color:var(--vaka-dosya);background:color-mix(in srgb, var(--vaka-dosya) 6%, var(--bg-2))}}
.vk-belge.okundu{border-left-color:var(--line)}
.vk-belge.kilitli{
  cursor:not-allowed;border-style:dashed;border-left:4px solid var(--line);color:var(--muted);
  background:repeating-linear-gradient(135deg, var(--bg-2) 0 10px, var(--bg) 10px 20px);
}
.vk-belge.kilitli:hover{border-color:var(--line)}
.vk-belge-ikon{
  width:32px;height:32px;flex:none;border-radius:6px;display:grid;place-items:center;
  background:var(--vaka-kagit-2);color:var(--vaka-damga);font-weight:700;
}
.vk-belge-ikon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.vk-belge.kilitli .vk-belge-ikon{background:none;border:1.5px dashed var(--line);color:var(--muted)}
.vk-belge-yazi{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.vk-belge-etiket{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.vk-belge-baslik{font-weight:600;font-size:17px;line-height:1.2}
.vk-belge-rol{font-size:12.5px;color:var(--vaka-dosya)}
.vk-belge-durum{flex:none;font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;color:var(--muted);text-align:right}
.vk-belge-durum.okundu{color:var(--green);font-size:17px}
.vk-belge-durum.kilit{max-width:9em}
.vk-belge-durum.yeni{
  font-family:var(--f-daktilo);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--vaka-damga);border:2px solid var(--vaka-damga);border-radius:4px;padding:2px 7px 0;transform:rotate(-6deg);
}


/* =============================================================
   OKUMA — kâğıt
   ============================================================= */
.vk-okuma-ust{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}

.vk-kagit{
  background:var(--vaka-kagit);color:var(--vaka-murekkep);
  border-radius:3px;padding:26px clamp(16px,5vw,40px) 18px;
  box-shadow:0 20px 50px color-mix(in srgb, var(--bg) 75%, transparent);
  font-size:17px;line-height:1.6;position:relative;
}
.vk-kagit:focus{outline:none}
.vk-kagit :focus-visible{outline-color:var(--vaka-damga)}
.vk-kagit b{font-weight:700}

.vk-kagit-bas{border-bottom:2px solid var(--vaka-murekkep);padding-bottom:14px;margin-bottom:18px;display:flex;flex-direction:column;gap:6px}
.vk-kagit-kurum{font-family:var(--f-daktilo);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;line-height:1.4;color:var(--vaka-soluk)}
.vk-kagit-dosyano{font-family:var(--f-daktilo);font-size:12px;color:var(--vaka-soluk)}
.vk-kagit-etiket{
  align-self:flex-start;margin-top:6px;
  font-family:var(--f-daktilo);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  border:2px solid var(--vaka-murekkep);padding:3px 9px 1px;border-radius:3px;
}
.vk-kagit h1{
  display:flex;align-items:center;gap:14px;margin:4px 0 0;
  font-family:var(--f-display);font-weight:800;font-size:clamp(32px,8vw,48px);line-height:.98;letter-spacing:.01em;text-wrap:balance;
}
.vk-canlandir{
  margin:6px 0 0;font-size:14px;padding:8px 12px;border-radius:6px;
  background:color-mix(in srgb, var(--vaka-dosya) 28%, var(--vaka-kagit));
}

.vk-kagit-govde > p{margin:0 0 14px}
.vk-ara{
  font-family:var(--f-daktilo);font-weight:700;font-size:15px;letter-spacing:.1em;text-transform:uppercase;
  margin:26px 0 10px;padding-bottom:4px;border-bottom:1px solid var(--vaka-cizgi);
}
.vk-meta{font-family:var(--f-daktilo);font-size:13.5px;color:var(--vaka-soluk);margin:0 0 14px !important;font-style:italic}

.vk-liste{margin:0 0 14px;padding-left:1.2em}
.vk-liste li{margin-bottom:8px}
.vk-liste li::marker{color:var(--vaka-soluk)}

.vk-bilgi{margin:0 0 16px;border-top:1px solid var(--vaka-cizgi)}
.vk-bilgi div{display:grid;grid-template-columns:minmax(0,9.5em) minmax(0,1fr);gap:4px 14px;padding:8px 0;border-bottom:1px solid var(--vaka-cizgi)}
.vk-bilgi dt{font-family:var(--f-daktilo);font-weight:700;font-size:13.5px;line-height:1.5;color:var(--vaka-soluk)}
.vk-bilgi dd{margin:0}

/* ifade: tırnak içinde konuşma */
.vk-alinti{margin:0 0 16px;padding:4px 0 4px 16px;border-left:3px solid var(--vaka-murekkep)}
.vk-alinti p{margin:0 0 12px}
.vk-alinti p:first-child::before{content:"“";font-family:var(--f-display);font-weight:800;font-size:1.6em;line-height:0;margin-right:2px;vertical-align:-.25em;color:var(--vaka-soluk)}
.vk-alinti p:last-child{margin-bottom:0}
.vk-alinti p:last-child::after{content:"”";font-family:var(--f-display);font-weight:800;font-size:1.6em;line-height:0;margin-left:2px;vertical-align:-.25em;color:var(--vaka-soluk)}

/* soruşturmacı notu: kırmızı çerçeve */
.vk-not-kutu{
  margin:18px 0 14px;padding:14px 14px 12px;border:2px solid var(--vaka-damga);border-radius:4px;position:relative;
  background:color-mix(in srgb, var(--vaka-damga) 5%, var(--vaka-kagit));
}
.vk-not-kutu p{margin:0;font-family:var(--f-daktilo);font-size:15.5px;line-height:1.55}
.vk-not-etiket{
  position:absolute;top:-11px;left:10px;background:var(--vaka-kagit);padding:0 6px;
  font-family:var(--f-daktilo);font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--vaka-damga);
}

/* numaralı rapor maddesi */
.vk-madde{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:10px 0;border-bottom:1px dashed var(--vaka-cizgi);scroll-margin:80px}
.vk-madde p{margin:0}
.vk-madde-no{
  width:28px;height:28px;border-radius:50%;display:grid;place-items:center;margin-top:1px;
  font-family:var(--f-mono);font-weight:600;font-size:13px;border:1.5px solid var(--vaka-murekkep);
}
.vk-madde.parla{animation:vk-parla 1.6s ease-out}
@keyframes vk-parla{0%,30%{background:color-mix(in srgb, var(--vaka-isaret) 55%, transparent)}100%{background:transparent}}

.vk-tablo-kap{overflow-x:auto;margin:0 0 14px;-webkit-overflow-scrolling:touch}
.vk-tablo{border-collapse:collapse;width:100%;min-width:440px;font-size:15px}
.vk-tablo th{font-family:var(--f-daktilo);font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;text-align:left;color:var(--vaka-soluk);border-bottom:2px solid var(--vaka-murekkep);padding:6px 8px}
.vk-tablo td{border-bottom:1px solid var(--vaka-cizgi);padding:8px;font-variant-numeric:tabular-nums}

/* el yazısı defter sayfası: çizgili kâğıt */
.vk-defter{
  margin:6px 0 18px;padding:14px 16px 12px 44px;border-radius:2px;position:relative;
  background:
    linear-gradient(90deg, transparent 32px, color-mix(in srgb, var(--vaka-damga) 45%, transparent) 32px 34px, transparent 34px),
    repeating-linear-gradient(180deg, var(--vaka-kagit) 0 33px, var(--vaka-cizgi) 33px 34px);
  box-shadow:inset 0 0 0 1px var(--vaka-cizgi);
  font-family:var(--f-el);font-size:clamp(21px,5.6vw,27px);line-height:34px;color:var(--vaka-murekkep);
  display:flex;flex-direction:column;white-space:pre;overflow-x:auto;transform:rotate(-.6deg);
}
.vk-defter span{display:block;min-height:34px}
.vk-defter span:last-child{color:var(--vaka-damga)}

/* şüpheli profili */
.vk-profil{padding:18px 0 20px;border-bottom:2px solid var(--vaka-murekkep);scroll-margin:70px}
.vk-profil:first-child{padding-top:0}
.vk-profil:last-child{border-bottom:none}
.vk-profil-bas{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.vk-profil h2{font-family:var(--f-display);font-weight:800;font-size:30px;line-height:1;margin:0;letter-spacing:.01em}
.vk-profil h2 span{font-family:var(--f-mono);font-size:15px;font-weight:500;color:var(--vaka-soluk)}
.vk-profil-rol{font-family:var(--f-daktilo);font-size:14px;color:var(--vaka-soluk)}
.vk-profil h3{font-family:var(--f-daktilo);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:14px 0 4px;color:var(--vaka-damga)}
.vk-profil p{margin:0 0 8px}

/* şüphe notu: Temiz / Emin değilim / Şüpheli */
.vk-suphe{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.vk-suphe-btn{
  min-height:40px;padding:0 13px;border-radius:999px;cursor:pointer;
  font:600 13.5px/1 var(--f-body);background:transparent;color:var(--vaka-soluk);border:1.5px solid var(--vaka-cizgi);
}
.vk-suphe-btn:hover{border-color:var(--vaka-soluk);color:var(--vaka-murekkep)}
.vk-suphe-btn[aria-pressed="true"].temiz{background:var(--green-deep);border-color:var(--green-deep);color:var(--vaka-kagit)}
.vk-suphe-btn[aria-pressed="true"].belirsiz{background:var(--vaka-dosya);border-color:var(--vaka-dosya-deep);color:var(--vaka-murekkep)}
.vk-suphe-btn[aria-pressed="true"].supheli{background:var(--vaka-damga);border-color:var(--vaka-damga);color:var(--vaka-kagit)}

/* iğnelenebilir ipucu */
.vk-iz{
  cursor:pointer;border-radius:2px;
  background-image:linear-gradient(90deg, var(--vaka-soluk) 50%, transparent 50%);
  background-size:5px 2px;background-repeat:repeat-x;background-position:0 100%;
  padding-bottom:1px;transition:background-color .2s;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.vk-iz:hover{background-color:color-mix(in srgb, var(--vaka-isaret) 30%, transparent)}
.vk-iz[aria-pressed="true"]{
  background-color:color-mix(in srgb, var(--vaka-isaret) 85%, transparent);
  background-image:none;
}
.vk-iz.iglendi{animation:vk-igne .5s ease-out}
@keyframes vk-igne{0%{background-color:var(--vaka-isaret);box-shadow:0 0 0 4px var(--vaka-isaret)}100%{box-shadow:0 0 0 0 transparent}}

/* başka belgeye bağlantı */
.vk-bag{
  font:inherit;color:var(--vaka-damga);background:none;border:none;padding:0;cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;font-weight:700;
}

/* olay yeri krokisi (temsili) */
.vk-kroki{margin:4px 0 16px;padding:10px;border:1.5px solid var(--vaka-murekkep);border-radius:3px;background:var(--vaka-kagit)}
.vk-kroki svg{display:block;width:100%;max-width:560px;height:auto;margin:0 auto}
.vk-kroki .zemin{fill:color-mix(in srgb, var(--vaka-kagit-2) 60%, var(--vaka-kagit));stroke:var(--vaka-murekkep);stroke-width:3}
.vk-kroki .raf{fill:var(--vaka-cizgi)}
.vk-kroki .sominesi{fill:var(--vaka-kagit-2);stroke:var(--vaka-murekkep);stroke-width:1.5}
.vk-kroki .kan-iz,.vk-kroki .kan{fill:var(--vaka-damga)}
.vk-kroki .kan{opacity:.75}
.vk-kroki .kan.hafif{opacity:.35}
.vk-kroki .ceset{fill:none;stroke:var(--vaka-murekkep);stroke-width:1.6;stroke-dasharray:4 3}
.vk-kroki .destek{fill:var(--vaka-dosya-deep)}
.vk-kroki .masa{fill:var(--vaka-dosya);stroke:var(--vaka-dosya-deep);stroke-width:1.5}
.vk-kroki .bardak{fill:var(--vaka-kagit);stroke:var(--vaka-murekkep);stroke-width:1.2}
.vk-kroki .gozluk{stroke:var(--vaka-murekkep);stroke-width:2.2;fill:none;stroke-linecap:round}
.vk-kroki .duvar-bosluk{stroke:var(--vaka-kagit);stroke-width:5}
.vk-kroki .cakil circle{fill:var(--vaka-soluk)}
.vk-kroki .ayakizi ellipse{fill:var(--vaka-murekkep);opacity:.55}
.vk-kroki .ok{stroke:var(--vaka-damga);stroke-width:2;fill:none;stroke-linecap:round}
.vk-kroki .yazi{font-family:var(--f-daktilo);font-size:10px;fill:var(--vaka-soluk)}
/* genel çizim parçaları (kule kesiti gibi başka krokiler için) */
.vk-kroki .cizgi{fill:none;stroke:var(--vaka-murekkep);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.vk-kroki .kalin{fill:none;stroke:var(--vaka-murekkep);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.vk-kroki .kesik{fill:none;stroke:var(--vaka-soluk);stroke-width:1.3;stroke-dasharray:3 3}
.vk-kroki .demir{fill:none;stroke:var(--vaka-dosya-deep);stroke-width:2;stroke-linecap:round}
.vk-kroki .koyu{fill:var(--vaka-murekkep)}
.vk-kroki .acik{fill:var(--vaka-kagit-2);stroke:var(--vaka-murekkep);stroke-width:1.3}
.vk-kroki-isaret{cursor:pointer;outline:none}
.vk-kroki-isaret .alan{fill:transparent}
.vk-kroki-isaret .daire{fill:var(--vaka-murekkep);stroke:var(--vaka-kagit);stroke-width:2;transition:transform .15s}
.vk-kroki-isaret text{fill:var(--vaka-kagit);font-family:var(--f-mono);font-weight:600;font-size:11px;text-anchor:middle;pointer-events:none}
.vk-kroki-isaret:hover .daire,.vk-kroki-isaret:focus-visible .daire{fill:var(--vaka-damga)}
.vk-kroki-isaret.secili .daire{fill:var(--vaka-damga);transform:scale(1.25)}
.vk-kroki-yazi{margin-top:8px;font-size:15px;line-height:1.5;min-height:3em}
.vk-kroki-yazi small{display:block;font-family:var(--f-daktilo);font-size:12px;color:var(--vaka-soluk)}
.vk-kroki-yazi .linkbtn{color:var(--vaka-damga);font-weight:600}

.vk-kagit-alt{
  margin-top:20px;padding-top:10px;border-top:1px solid var(--vaka-cizgi);
  font-family:var(--f-daktilo);font-size:12px;color:var(--vaka-soluk);
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;
}
.vk-kurgu-satir{color:var(--vaka-damga);font-weight:700;letter-spacing:.02em}

/* önceki / sonraki belge */
.vk-okuma-alt{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.vk-sayfa{
  display:flex;flex-direction:column;gap:3px;min-height:64px;padding:10px 14px;text-align:left;cursor:pointer;
  background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);color:var(--text);font:inherit;
}
.vk-sayfa strong{font-weight:600;font-size:16px}
.vk-sayfa:hover{border-color:var(--vaka-dosya)}
.vk-sayfa.sonraki{grid-column:2;text-align:right;align-items:flex-end;border-color:var(--vaka-dosya-deep)}
.vk-sayfa[hidden]{display:flex;visibility:hidden}


/* =============================================================
   PANO
   ============================================================= */
.vk-gorunum-baslik{font-family:var(--f-display);font-weight:800;font-size:clamp(32px,8vw,44px);margin:6px 0 8px;letter-spacing:.01em;line-height:1}
.vk-pano-bolum{margin-top:22px}
.vk-pano-bolum h3{display:flex;align-items:baseline;gap:10px;font-family:var(--f-display);font-weight:800;font-size:22px;margin:0 0 10px;letter-spacing:.02em}

.vk-kisiler{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:8px}
.vk-kisilejant{margin:-4px 0 10px;font-size:13px;color:var(--muted)}
.vk-kisikart{
  background:var(--vaka-kagit);color:var(--vaka-murekkep);border-radius:6px;padding:8px 8px 8px;
  border-top:5px solid var(--vaka-cizgi);display:flex;flex-direction:column;gap:6px;min-width:0;
}
.vk-kisikart[data-durum="temiz"]{border-top-color:var(--green-deep)}
.vk-kisikart[data-durum="belirsiz"]{border-top-color:var(--vaka-dosya)}
.vk-kisikart[data-durum="supheli"]{border-top-color:var(--vaka-damga)}
.vk-kisikart-bas{
  display:flex;align-items:center;gap:8px;width:100%;min-height:44px;text-align:left;cursor:pointer;
  background:none;border:none;padding:0 2px;color:inherit;font:inherit;min-width:0;
}
.vk-kisikart-bas > span:last-child{min-width:0}
.vk-kisikart-bas strong{display:block;font-size:15px;line-height:1.15;overflow-wrap:anywhere}
.vk-kisikart-bas span span{display:block;font-size:12px;line-height:1.2;color:var(--vaka-soluk)}
.vk-suphe.kisa{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:0}
.vk-suphe.kisa .vk-suphe-btn{min-height:40px;padding:0;font-size:17px;font-weight:700}

.vk-izgrup{background:var(--vaka-kagit);color:var(--vaka-murekkep);border-radius:6px;padding:6px 6px 6px 14px;margin-bottom:8px}
.vk-izgrup-bas{
  background:none;border:none;padding:8px 0 4px;cursor:pointer;color:var(--vaka-damga);text-align:left;
  font-family:var(--f-daktilo);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;
}
.vk-izgrup ul{list-style:none;margin:0;padding:0}
.vk-izgrup li{display:flex;align-items:flex-start;gap:6px;border-top:1px dashed var(--vaka-cizgi);padding:6px 0 4px;font-size:15.5px;line-height:1.45}
.vk-izgrup li span{flex:1;padding-top:10px;padding-bottom:6px}
.vk-izgrup li span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--vaka-damga);margin-right:8px;vertical-align:.1em}
.vk-izgrup .vk-mini{color:var(--vaka-soluk)}
.vk-izgrup .vk-mini:hover{color:var(--vaka-murekkep);border-color:var(--vaka-cizgi)}

.vk-notdefteri{
  width:100%;min-height:150px;resize:vertical;padding:12px 14px;border-radius:6px;
  background:var(--vaka-kagit);color:var(--vaka-murekkep);border:none;
  font:400 16px/1.6 var(--f-daktilo);
}
.vk-notdefteri::placeholder{color:var(--vaka-soluk)}
.vk-notdefteri:focus{outline:2px solid var(--vaka-dosya);outline-offset:2px}
.vk-sorulistesi{margin:0;padding-left:1.4em;color:var(--muted);font-size:15px}
.vk-sorulistesi li{margin-bottom:8px}
.vk-sorulistesi li::marker{color:var(--vaka-dosya);font-family:var(--f-mono)}


/* =============================================================
   ZAMAN ÇİZELGESİ
   ============================================================= */
.vk-zaman{list-style:none;margin:16px 0 0;padding:0 0 0 14px;position:relative}
.vk-zaman::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:var(--line)}
.vk-zaman-satir{
  position:relative;display:grid;grid-template-columns:minmax(0,6.6em) minmax(0,1fr);gap:0 12px;
  padding:10px 12px 10px 14px;margin-bottom:6px;border-radius:var(--r);background:var(--bg-2);border:1px solid var(--line-soft);
}
.vk-zaman-satir::before{
  content:"";position:absolute;left:-15px;top:17px;width:10px;height:10px;border-radius:50%;
  background:var(--bg);border:2px solid var(--muted);
}
.vk-zaman-satir .saat{font-family:var(--f-mono);font-weight:600;font-size:14px;font-variant-numeric:tabular-nums;color:var(--vaka-dosya);grid-row:span 2}
.vk-zaman-satir .olay{font-size:16px;font-weight:500;line-height:1.3}
.vk-zaman-satir .kaynak{font-size:13px;color:var(--muted);margin-top:2px}
.vk-zaman-satir.vurgu{border-color:var(--vaka-damga);background:color-mix(in srgb, var(--vaka-damga) 10%, var(--bg-2))}
.vk-zaman-satir.vurgu::before{background:var(--vaka-damga);border-color:var(--vaka-damga)}
.vk-zaman-satir.vurgu .olay{font-weight:700}
.vk-zaman-satir.kilitli{border-style:dashed;border-color:var(--line);background:repeating-linear-gradient(135deg, var(--bg-2) 0 10px, var(--bg) 10px 20px)}
.vk-zaman-satir.kilitli .saat,.vk-zaman-satir.kilitli .olay{color:var(--muted);font-weight:500}
.vk-zaman-satir.kilitli .olay{font-size:14px}
/* saat kırılmasından sonra: büyük saat gerçek saat, altında kasabanın gördüğü kule saati */
.vk-zaman-satir .saat small{display:block;font-size:11px;font-weight:500;color:var(--muted);letter-spacing:.02em;white-space:nowrap}
#g-zaman.saat-kirildi .vk-zaman-satir:not(.kilitli) .saat{color:var(--green)}
@media (max-width:520px){
  .vk-zaman-satir .saat small{display:inline;margin-left:8px}
}


/* =============================================================
   RAPOR
   ============================================================= */
.vk-rapor-bas{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin:6px 0 16px}
.vk-rapor-baslik{font-family:var(--f-display);font-weight:800;font-size:clamp(32px,8vw,46px);line-height:.98;margin:0;letter-spacing:.01em;text-wrap:balance}
.vk-acilacak{margin:4px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.vk-acilacak .vk-etiket{width:100%}
.vk-muhurlu-etiket{
  font-family:var(--f-daktilo);font-weight:700;font-size:12.5px;letter-spacing:.06em;
  color:var(--muted);border:1.5px dashed var(--line);border-radius:4px;padding:4px 8px 2px;
}

.vk-soru{
  background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 16px 16px;margin-bottom:12px;display:flex;flex-direction:column;gap:10px;scroll-margin:70px;
}
.vk-soru h3{font-family:var(--f-body);font-weight:600;font-size:20px;line-height:1.3;margin:0}
.vk-soru.aktif{border-color:var(--vaka-dosya-deep);box-shadow:0 0 0 1px var(--vaka-dosya-deep)}
.vk-soru.sirada{border-style:dashed;background:transparent;padding-block:14px}
.vk-soru.sirada p{margin:0;color:var(--muted);font-size:14px}
.vk-soru.cozuldu{border-color:var(--green-deep)}
.vk-soru.cozuldu .vk-etiket{color:var(--green)}
.vk-soru.yeni-kabul{animation:vk-kabul .6s ease-out}
@keyframes vk-kabul{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--green) 60%, transparent)}100%{box-shadow:0 0 0 14px transparent}}

.vk-secenekler{display:flex;flex-direction:column;gap:8px}
.vk-secenek{
  display:flex;align-items:flex-start;gap:12px;width:100%;min-height:56px;padding:12px 14px;text-align:left;cursor:pointer;
  background:var(--bg);border:1.5px solid var(--line);border-radius:var(--r);color:var(--text);
  font:500 16.5px/1.4 var(--f-body);transition:border-color .15s, background .15s;margin:0;
}
@media (hover:hover){.vk-secenek:hover:not(:disabled){border-color:var(--vaka-dosya);background:color-mix(in srgb, var(--vaka-dosya) 7%, var(--bg))}}
.vk-secenek-harf{
  flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;margin-top:-1px;
  font-family:var(--f-mono);font-weight:600;font-size:13px;border:1.5px solid var(--line);color:var(--muted);
}
.vk-secenek.yanlis{border-color:color-mix(in srgb, var(--bad) 50%, var(--line));color:var(--muted);cursor:default;text-decoration:line-through;text-decoration-color:color-mix(in srgb, var(--bad) 60%, transparent)}
.vk-secenek.yanlis .vk-secenek-harf{border-color:var(--bad);color:var(--bad)}
.vk-secenek.dogru{border-color:var(--green);background:color-mix(in srgb, var(--green) 9%, var(--bg))}
.vk-secenek.dogru .vk-secenek-harf{background:var(--green);border-color:var(--green);color:var(--bg)}
.vk-secenek.sabit{cursor:default}
.vk-secenek[aria-pressed="true"]{border-color:var(--vaka-dosya);background:color-mix(in srgb, var(--vaka-dosya) 14%, var(--bg))}
.vk-secenek[aria-pressed="true"] .vk-secenek-harf{background:var(--vaka-dosya);border-color:var(--vaka-dosya);color:var(--vaka-murekkep)}

.vk-geri{
  margin:-2px 0 4px 12px;padding:8px 12px;font-size:14.5px;line-height:1.45;color:var(--text);
  border-left:3px solid var(--bad);background:color-mix(in srgb, var(--bad) 8%, transparent);border-radius:0 6px 6px 0;
}
.vk-geri:focus{outline:none}
.vk-geri b{color:var(--bad)}
.vk-geri.salla{animation:vk-salla .4s ease-out}
@keyframes vk-salla{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}60%{transform:translateX(5px)}}

.vk-ipucu-kutu{
  margin:0;display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-radius:6px;font-size:15px;
  background:color-mix(in srgb, var(--vaka-isaret) 10%, var(--bg));border:1px solid color-mix(in srgb, var(--vaka-isaret) 35%, var(--line));
}
.vk-ipucu-kutu .vk-etiket{color:var(--vaka-isaret)}
.vk-soru-alt{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.vk-soru-alt:empty{display:none}
.vk-aciklama{
  margin:0;font-size:15px;line-height:1.5;padding:10px 12px;border-radius:6px;
  background:var(--bg);border-left:3px solid var(--green-deep);
}

.vk-gonder{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;margin:18px 0 8px}

.vk-oylama-kart{
  display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:14px;
  padding:18px 16px;border-radius:var(--r);border:1.5px dashed var(--vaka-dosya);
  background:color-mix(in srgb, var(--vaka-dosya) 7%, var(--bg-2));
}
.vk-oylama-kart h3{font-family:var(--f-display);font-weight:800;font-size:26px;margin:0;line-height:1}
.vk-oylama-kart p{margin:0}
.vk-oylama-kart.tamam{border-style:solid;border-color:var(--line)}

.vk-kisisecim{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.vk-kisisec{
  display:flex;align-items:center;gap:10px;min-height:58px;padding:8px 12px;text-align:left;cursor:pointer;
  background:var(--bg);border:1.5px solid var(--line);border-radius:var(--r);color:var(--text);font:600 15.5px/1.2 var(--f-body);
  overflow-wrap:anywhere;
}
@media (hover:hover){.vk-kisisec:hover{border-color:var(--vaka-dosya)}}
.vk-kisisec[aria-pressed="true"]{border-color:var(--vaka-damga);background:color-mix(in srgb, var(--vaka-damga) 14%, var(--bg))}
.vk-kisisec[aria-pressed="true"] .vk-vesika-mini{background:var(--vaka-damga);border-color:var(--vaka-damga);color:var(--vaka-kagit)}
.vk-kisisecim.perdede{width:100%}


/* =============================================================
   PERDE (soru kutusu, açılış töreni)
   ============================================================= */
.vk-perde{
  position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:16px;overflow-y:auto;
  grid-template-columns:minmax(0,1fr);
  background:var(--bg);   /* color-mix'i tanımayan eski telefonlarda perde saydam kalmasın */
  background:color-mix(in srgb, var(--bg) 92%, transparent);
}
.vk-perde[hidden]{display:none}
.vk-perde-ic{
  background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 20px 22px;width:100%;max-width:440px;position:relative;
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;
}
.vk-perde-ic:focus{outline:none}
.vk-perde-ic [hidden]{display:none}
.vk-perde-ic h2{font-family:var(--f-display);font-weight:800;font-size:34px;line-height:1;margin:0;letter-spacing:.01em;overflow-wrap:anywhere;text-wrap:balance}
.vk-perde-ic p{margin:0;color:var(--muted);font-size:15.5px;max-width:40ch}
.vk-perde-govde{width:100%}
.vk-perde-dugmeler{display:flex;flex-direction:column;gap:8px;width:100%;align-items:center}
.vk-perde-dugmeler .btn{width:100%;max-width:360px}
.vk-perde-damga{
  font-family:var(--f-daktilo);font-weight:700;font-size:28px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--vaka-damga);border:3.5px solid var(--vaka-damga);border-radius:6px;padding:6px 16px 3px;transform:rotate(-7deg);
}
.vk-perde-damga.vur{animation:vk-damga .55s .1s cubic-bezier(.2,1.6,.4,1) both}
@keyframes vk-damga{0%{transform:scale(2.6) rotate(-18deg);opacity:0}100%{transform:scale(1) rotate(-7deg);opacity:1}}

.vk-yeniler{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;width:100%}
.vk-yeni-belge{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:10px 14px;cursor:pointer;text-align:left;
  background:var(--vaka-kagit);color:var(--vaka-murekkep);border:none;border-radius:6px;font:inherit;
}
.vk-yeni-belge .vk-etiket{color:var(--vaka-damga)}
.vk-yeni-belge strong{font-size:16px}
.vk-yeni-belge:hover{background:var(--vaka-kagit-2)}
.vk-perde-ic .vk-yeniler li{animation:vk-kay .4s ease-out both}
.vk-perde-ic .vk-yeniler li:nth-child(2){animation-delay:.08s}
.vk-perde-ic .vk-yeniler li:nth-child(3){animation-delay:.16s}
.vk-perde-ic .vk-yeniler li:nth-child(4){animation-delay:.24s}
.vk-perde-ic .vk-yeniler li:nth-child(5){animation-delay:.32s}
.vk-perde-ic .vk-yeniler li:nth-child(6){animation-delay:.40s}
@keyframes vk-kay{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}

/* açılış perdesindeki kule saati: yelkovan kule saatinden gerçek saate döner */
.vk-saat{margin:2px 0 6px;display:flex;flex-direction:column;align-items:center;gap:8px}
.vk-saat svg{width:132px;height:132px}
.vk-saat .kadran{fill:var(--vaka-kagit);stroke:var(--vaka-dosya-deep);stroke-width:4}
.vk-saat .cizgiler line{stroke:var(--vaka-murekkep);stroke-width:2;stroke-linecap:round}
.vk-saat .akrep,.vk-saat .yelkovan{
  stroke:var(--vaka-murekkep);stroke-linecap:round;
  transform-box:view-box;transform-origin:50px 50px;
  transition:transform 2.4s cubic-bezier(.45,0,.2,1);
}
.vk-saat .akrep{stroke-width:4.5}
.vk-saat .yelkovan{stroke-width:2.6}
.vk-saat.dondu .yelkovan{stroke:var(--vaka-damga)}
.vk-saat .mil{fill:var(--vaka-damga)}
.vk-saat figcaption{display:flex;align-items:center;gap:12px}
.vk-saat figcaption > span:not(.ok){display:flex;flex-direction:column;align-items:center;gap:2px}
.vk-saat figcaption b{font-family:var(--f-mono);font-weight:600;font-size:22px;font-variant-numeric:tabular-nums}
.vk-saat .once b{color:var(--muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb, var(--vaka-damga) 70%, transparent)}
.vk-saat .sonra{opacity:.25;transition:opacity .6s 2s}
.vk-saat.dondu .sonra{opacity:1}
.vk-saat .sonra b{color:var(--green)}
.vk-saat .ok{color:var(--muted);font-size:20px}


/* =============================================================
   SONUÇ
   ============================================================= */
.vk-sonuc{max-width:760px;margin:0 auto;padding-bottom:40px;display:flex;flex-direction:column;gap:14px}
.vk-sonuc-bas{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:28px 8px 10px}
.vk-buyukdamga{
  font-family:var(--f-daktilo);font-weight:700;font-size:clamp(34px,10vw,56px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--green);border:5px solid var(--green);border-radius:8px;padding:6px 20px 2px;margin:8px 0 12px;transform:rotate(-6deg);
}
.vk-buyukdamga.acik{color:var(--vaka-damga);border-color:var(--vaka-damga)}
#s-sonuc.toren .vk-buyukdamga{animation:vk-buyukdamga .7s .25s cubic-bezier(.2,1.5,.4,1) both}
@keyframes vk-buyukdamga{0%{transform:scale(3) rotate(-20deg);opacity:0}100%{transform:scale(1) rotate(-6deg);opacity:1}}
.vk-rutbe{
  font-family:var(--f-display);font-weight:800;font-size:clamp(44px,13vw,82px);line-height:.92;margin:0;
  text-transform:uppercase;letter-spacing:.01em;text-wrap:balance;
}
.vk-rutbe:focus{outline:none}
.vk-sonuc-mesaj{margin:4px 0 0;font-size:18px;max-width:36ch;text-wrap:balance}
.vk-sayilar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;max-width:460px;margin-top:10px}
.vk-sayilar div{display:flex;flex-direction:column;gap:2px;padding:10px 6px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2)}
.vk-sayilar b{font-family:var(--f-mono);font-weight:600;font-size:24px;font-variant-numeric:tabular-nums;color:var(--vaka-dosya)}
.vk-sayilar span{font-size:12.5px;color:var(--muted)}

.vk-cevaplar,.vk-oylar{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.vk-cevaplar li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px dashed var(--line)}
.vk-cevaplar li:first-child{border-top:none;padding-top:0}
.vk-cevaplar div{display:flex;flex-direction:column;gap:3px;min-width:0}
.vk-cevaplar .soru{font-size:13.5px;color:var(--muted)}
.vk-cevaplar .cevap{font-size:16.5px;font-weight:600}
.vk-cevaplar li.yanlis .cevap{text-decoration:line-through;text-decoration-color:color-mix(in srgb, var(--bad) 60%, transparent);color:var(--muted)}
.vk-cevaplar .dogrusu{font-size:15px;color:var(--green)}
.vk-cevap-isaret{
  flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:700;
}
li.dogru > .vk-cevap-isaret{background:var(--green);color:var(--bg)}
li.yanlis > .vk-cevap-isaret{background:var(--bad);color:var(--bg)}
.vk-oylar li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:6px 0;border-top:1px dashed var(--line)}
.vk-oylar li:first-child{border-top:none}
.vk-oylar li > span:not(.vk-cevap-isaret){display:flex;align-items:center;gap:8px;color:var(--muted)}

.vk-muhurkir{
  display:flex;align-items:center;justify-content:center;gap:16px;width:100%;padding:22px 18px;cursor:pointer;
  background:var(--vaka-dosya);color:var(--vaka-murekkep);border:none;border-radius:var(--r);text-align:left;
  font:500 16px/1.3 var(--f-body);
  box-shadow:0 14px 34px color-mix(in srgb, var(--bg) 65%, transparent);
}
.vk-muhurkir b{font-family:var(--f-display);font-weight:800;font-size:28px;letter-spacing:.02em;text-transform:uppercase}
.vk-muhurkir:hover{background:color-mix(in srgb, var(--vaka-dosya) 88%, var(--vaka-kagit))}
.vk-muhurkir[hidden]{display:none}
.vk-muhur-yuvarlak{
  width:62px;height:62px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--vaka-damga);color:var(--vaka-kagit);font-family:var(--f-display);font-weight:800;font-size:28px;
  box-shadow:inset 0 0 0 4px color-mix(in srgb, var(--vaka-murekkep) 25%, transparent), 0 3px 0 var(--vaka-dosya-deep);
}
.vk-muhurkir:hover .vk-muhur-yuvarlak{animation:vk-titre .35s ease-in-out}
@keyframes vk-titre{0%,100%{transform:rotate(0)}30%{transform:rotate(-10deg)}70%{transform:rotate(8deg)}}

/* yanlış son: katil yanlışsa, mührün üstünde */
.vk-epilog{border-color:var(--vaka-damga);display:flex;flex-direction:column;gap:8px}
.vk-epilog[hidden]{display:none}
.vk-epilog .vk-etiket{color:var(--vaka-damga)}
.vk-epilog p{margin:0;font-family:var(--f-daktilo);font-size:16px;line-height:1.6}

/* son karar: çözümün altında */
.vk-karar{display:flex;flex-direction:column;gap:12px;border-color:var(--vaka-dosya-deep)}
.vk-karar[hidden]{display:none}
.vk-karar:focus{outline:none}
.vk-karar h3{margin:0}
.vk-karar .vk-etiket{color:var(--vaka-dosya)}
.vk-karar-secim{display:flex;align-items:center;gap:12px;margin:0;font-size:18px}
.vk-karar-secim .vk-secenek-harf{background:var(--vaka-dosya);border-color:var(--vaka-dosya);color:var(--vaka-murekkep)}
.vk-karar-son{background:var(--vaka-kagit);color:var(--vaka-murekkep);border-radius:4px;padding:16px clamp(14px,4vw,24px)}
.vk-karar-son p{margin:0 0 10px;font-family:var(--f-daktilo);font-size:16px;line-height:1.65}
.vk-karar-son p:last-child{margin-bottom:0}
.vk-karar-diger summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;color:var(--muted);font-weight:600;list-style:none}
.vk-karar-diger summary::-webkit-details-marker{display:none}
.vk-karar-diger summary::before{content:"▸";transition:transform .15s}
.vk-karar-diger[open] summary::before{transform:rotate(90deg)}
.vk-karar-diger > div{border-top:1px dashed var(--line);padding:10px 0}
.vk-karar-diger p{margin:6px 0 0;font-size:15px;color:var(--muted)}

.vk-cozum:focus{outline:none}
.vk-cozum[hidden]{display:none}
.vk-cozum-kagit.canli{animation:vk-kay .5s ease-out both}
.vk-cozum-bolum{padding-bottom:10px;margin-bottom:10px;border-bottom:2px solid var(--vaka-murekkep)}
.vk-cozum-bolum p{margin:0 0 12px}
.vk-cozum-baslik{display:flex;align-items:center;gap:12px;font-family:var(--f-display);font-weight:800;font-size:clamp(26px,6.5vw,34px);line-height:1;margin:4px 0 12px;letter-spacing:.01em;text-wrap:balance}

.vk-gercek{list-style:none;margin:0 0 10px;padding:0 0 0 14px;position:relative}
.vk-gercek::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:var(--vaka-cizgi)}
.vk-gercek li{position:relative;display:flex;flex-direction:column;gap:2px;padding:8px 0 10px 12px;border-bottom:1px dashed var(--vaka-cizgi)}
.vk-gercek li::before{content:"";position:absolute;left:-14px;top:13px;width:10px;height:10px;border-radius:50%;background:var(--vaka-kagit);border:2px solid var(--vaka-murekkep)}
.vk-gercek .saat{font-family:var(--f-mono);font-weight:600;font-size:14px;font-variant-numeric:tabular-nums}
.vk-gercek .olay{font-size:16px;line-height:1.45}
.vk-gercek .kim{
  display:inline-block;margin-right:6px;padding:1px 7px 0;border-radius:3px;vertical-align:.08em;
  font-family:var(--f-daktilo);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  background:var(--vaka-murekkep);color:var(--vaka-kagit);
}
.vk-gercek li.vurgu .saat,.vk-gercek li.vurgu .olay{color:var(--vaka-damga);font-weight:700}
.vk-gercek li.vurgu::before{background:var(--vaka-damga);border-color:var(--vaka-damga)}
.vk-cozum-kagit.canli .vk-gercek li{animation:vk-kay .45s ease-out both;animation-delay:calc(.35s + var(--sira) * .14s)}

.vk-yaniltici{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:10px;margin-bottom:14px}
.vk-yaniltici-kart{border:1.5px solid var(--vaka-murekkep);border-radius:4px;padding:12px}
.vk-yaniltici-kart h3{display:flex;align-items:center;gap:8px;font-family:var(--f-display);font-weight:800;font-size:22px;margin:0 0 8px}
.vk-yaniltici-kart p{margin:0 0 8px;font-size:15px;line-height:1.5;display:flex;flex-direction:column;gap:2px}
.vk-yaniltici-kart .vk-etiket{color:var(--vaka-damga)}
.vk-zincir{margin:0;padding-left:1.4em}
.vk-zincir li{margin-bottom:8px}
.vk-zincir li::marker{font-family:var(--f-mono);font-weight:600;color:var(--vaka-damga)}

/* ---------- değerlendirme: puan, hazır sorular, yorum (sonuç ekranı) ---------- */
.vk-dg fieldset{border:none;margin:0;padding:22px 0 0;min-width:0}
/* legend normalde fieldset çizgisinin üstüne oturur; float ile sıradan bir başlık gibi davranır */
.vk-dg legend{float:left;width:100%;padding:0;margin:0 0 10px;font-size:16px;font-weight:600;color:var(--text)}
.vk-dg legend + *{clear:both}
.vk-dg-not{margin:10px 0 0;font-size:13px;color:var(--muted);max-width:60ch}
.vk-dg-not b{color:var(--text);font-weight:600}
.vk-dg-not a{color:var(--green)}
.vk-tuzak{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* radyo düğmelerinin kendisi görünmez ama klavyeyle seçilebilir (← → ile gezilir);
   görünen kısım yanındaki <label> */
.vk-dg input[type="radio"]{position:absolute;opacity:0;width:1px;height:1px;margin:0}

/* yıldızlar */
.vk-yildizlar{display:flex;gap:4px}
.vk-yildizlar label{
  display:grid;place-items:center;width:52px;height:52px;cursor:pointer;border-radius:10px;
  font-size:38px;line-height:1;color:var(--line);transition:color .12s, transform .12s;
}
.vk-yildizlar label.dolu{color:var(--vaka-isaret)}
@media (hover:hover){.vk-yildizlar label:hover{transform:scale(1.08)}}
.vk-yildizlar input:focus-visible + label{outline:2px solid var(--lime);outline-offset:2px}
.vk-dg-puanyazi{display:block;clear:both;margin-top:4px;font-family:var(--f-mono);font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}

/* hazır soruların seçenekleri: dokunması kolay hap düğmeler */
.vk-dg-secenekler{display:flex;flex-wrap:wrap;gap:8px}
.vk-dg-secenekler label{
  display:inline-flex;align-items:center;min-height:44px;padding:8px 15px;cursor:pointer;
  border:1.5px solid var(--line);border-radius:999px;background:var(--bg);
  font:500 15px/1.25 var(--f-body);color:var(--muted);transition:border-color .15s, background .15s, color .15s;
}
@media (hover:hover){.vk-dg-secenekler label:hover{border-color:var(--vaka-dosya);color:var(--text)}}
.vk-dg-secenekler input:checked + label{background:var(--vaka-dosya);border-color:var(--vaka-dosya);color:var(--vaka-murekkep);font-weight:600}
.vk-dg-secenekler input:focus-visible + label{outline:2px solid var(--lime);outline-offset:2px}

/* serbest yorum */
.vk-dg-yorum{margin-top:22px;display:flex;flex-direction:column;gap:8px}
.vk-dg-yorum label{font-size:16px;font-weight:600}
.vk-dg-ops{font-weight:400;font-size:13px;color:var(--muted);margin-left:4px}
.vk-dg-yorum textarea{
  width:100%;min-height:120px;resize:vertical;padding:12px 14px;border-radius:6px;
  background:var(--vaka-kagit);color:var(--vaka-murekkep);border:none;
  font:400 16px/1.5 var(--f-body);   /* 16px: iPhone'da dokununca sayfa yakınlaşmasın */
}
.vk-dg-yorum textarea::placeholder{color:var(--vaka-soluk)}
.vk-dg-yorum textarea:focus{outline:2px solid var(--vaka-dosya);outline-offset:2px}
.vk-dg-yorum .vk-dg-not{margin-top:0}

.vk-dg-gonder{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:20px}
.vk-dg-durum{margin:0;flex:1 1 200px;font-family:var(--f-mono);font-size:12.5px;color:var(--muted)}
.vk-dg-durum[data-tur="iyi"]{color:var(--green)}
.vk-dg-durum[data-tur="kotu"]{color:var(--bad)}

.vk-dg-tesekkur{display:flex;flex-direction:column;gap:6px}
.vk-dg-tesekkur[hidden]{display:none}
.vk-dg-tesekkur .vk-etiket{color:var(--green)}
.vk-dg-tesekkur p{margin:0;font-size:16px}
.vk-dg-tesekkur:focus{outline:none}

@media (max-width:400px){
  .vk-yildizlar label{width:46px;height:48px;font-size:34px}
  .vk-dg-gonder .btn{width:100%}
}

.vk-dugmeler{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:10px}
.vk-dugmeler .btn{width:100%;max-width:360px}


/* ---------- dar ekranlar: saat üstte, olay altta ---------- */
@media (max-width:520px){
  .vk-zaman-satir{grid-template-columns:minmax(0,1fr)}
  .vk-zaman-satir .saat{grid-row:auto}
}

/* ---------- geniş ekranlar ---------- */
@media (min-width:760px){
  .vk-kapak-ic{padding:34px 34px 28px}
  .vk-kapak-damga{top:34px;right:30px;font-size:32px}
  .vk-bildirim{bottom:96px}
}

/* ---------- hareket azaltma tercihi ---------- */
@media (prefers-reduced-motion:reduce){
  .vk-nokta,
  .vk-perde-damga.vur,
  #s-sonuc.toren .vk-buyukdamga,
  .vk-cozum-kagit.canli,
  .vk-cozum-kagit.canli .vk-gercek li,
  .vk-perde-ic .vk-yeniler li,
  .vk-kapak.degisti .vk-kapak-ic{animation:none !important}
  .vk-saat .akrep,.vk-saat .yelkovan,.vk-saat .sonra{transition:none}
}