/* ============================================================================
   SORUSTUDIO v1.9 — "Mevcut yapı, daha iyi kullanıcı deneyimi"
   ----------------------------------------------------------------------------
   Bu dosya style.css'ten SONRA yüklenir ve mevcut kuralların üzerine yazar.
   style.css'ten hiçbir kural silinmemiştir; buradaki her şey eklemedir.

   Amaç: görsel hiyerarşiyi sadeleştirmek, kontrastı yükseltmek, üretim
   sürecini tek odaklı bir karta indirmek. Marka kimliği ve koyu tema korunur.
   Eşlik eden davranış katmanı: v19.js
   ============================================================================ */

:root {
  /* v1.9 renk belirteçleri (eski değişken adları korunur). */
  --v19-bg: #080d18;
  --v19-card: #111827;
  --v19-card-2: #172033;
  --v19-input: #182238;
  --v19-line: #27324a;
  --v19-purple: #7357ff;
  --v19-blue: #38bdf8;
  --v19-ok: #2ccb8e;
  --v19-warn: #f4b740;
  --v19-err: #ff6577;
  --v19-text: #f8fafc;
  --v19-text-2: #a5b0c5;
  --v19-text-3: #748198;

  /* Erişilebilirlik: kontrastı düşük gri metin tonları yükseltildi. */
  --text-muted: #a5b0c5;
  --text-light: #748198;

  /* spec §15: yüzey ve çizgi tonları v1.9 paletine hizalandı.
     Değişken ADLARI korunur; yalnızca değerleri güncellenir, böylece
     mevcut hiçbir kural yeniden yazılmak zorunda kalmaz. */
  --bg-main: #080d18;
  --bg-sidebar: #0d1220;
  --bg-card: #111827;
  --border-color: #27324a;
  --border-light: #1d2739;
  --text-dark: #f8fafc;
}

/* spec §15: dokunma hedefleri ve alan yükseklikleri.
   Buton ≥52px, input ≥50px, kart köşeleri 18–22px. */
@media (max-width: 743px) {
  .btn-primary,
  .btn-secondary,
  .btn-action-gradient {
    min-height: 52px;
  }
  .custom-select,
  .search-input,
  .input-text-styled {
    min-height: 50px !important;
    height: auto !important;
  }
  .card {
    border-radius: 20px !important;
  }
}

/* ---------------------------------------------------------------- ALT MENÜ */
@media (max-width: 743px) {
  .menu-item[data-mobile-nav="primary"] {
    min-height: 56px;      /* 48dp dokunma alanı üstünde */
    max-width: none;
    padding: 6px 2px !important;
  }
  .menu-item[data-mobile-nav="primary"] .menu-label-mobile {
    display: block;
    font-size: 0.56rem;
    line-height: 1.15;
    text-align: center;
    white-space: nowrap;   /* etiket sekme içinde bölünmesin */
  }
  .sidebar-menu {
    max-width: 480px;
  }

  /* Üst başlık: Premium ve jeton iki ayrı düğme olarak yarışıyordu.
     Artık tek üyelik bileşeni var; jeton çipi ikisini birden temsil eder. */
  .mobile-premium-pill {
    display: none !important;
  }
  .mobile-credit-chip {
    min-height: 36px;
    padding: 8px 14px !important;
  }
  .mobile-credit-chip.is-premium {
    border: 1px solid rgba(234, 179, 8, 0.5) !important;
    background: linear-gradient(135deg, rgba(234, 179, 8, 0.25), rgba(245, 158, 11, 0.18)) !important;
    box-shadow: 0 0 16px rgba(234, 179, 8, 0.3) !important;
  }

  /* Gövde metni mobilde 15px altına inmesin. */
  body {
    font-size: 15px;
  }
}

/* -------------------------------------------------------- ORTAK BİLEŞENLER */
.v19-card {
  background: var(--v19-card);
  border: 1px solid var(--v19-line);
  border-radius: 20px;
  padding: 16px;
  margin-bottom: 12px;
}
.v19-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.v19-eyebrow {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--v19-text-3);
  margin-bottom: 4px;
}
.v19-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--v19-text);
  line-height: 1.3;
}
.v19-sub {
  margin: 6px 0 0 0;
  font-size: 0.85rem;
  color: var(--v19-text-2);
  line-height: 1.45;
}
.v19-icon-btn {
  width: 48px;
  height: 48px;
  min-width: 48px;
  border-radius: 14px;
  border: 1px solid var(--v19-line);
  background: var(--v19-card-2);
  color: #c4b5fd;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.v19-icon-btn svg { width: 18px; height: 18px; }

.v19-btn {
  min-height: 48px;
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid var(--v19-line);
  background: var(--v19-card-2);
  color: var(--v19-text);
  font-size: 0.86rem;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.v19-btn svg { width: 16px; height: 16px; }
.v19-btn-primary {
  background: var(--v19-purple);
  border-color: var(--v19-purple);
  color: #fff;
}
.v19-btn-danger {
  color: var(--v19-err);
  border-color: rgba(255, 101, 119, 0.35);
}
.v19-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.v19-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.v19-actions .v19-btn { flex: 1; min-width: 110px; }

/* ------------------------------------------------ ANA SAYFA: SEÇİM ÖZETİ */
.v19-summary-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

/* Uyarı yalnızca mobil ana üretim butonunun üstünde yaşar; masaüstünde bu
   buton gizli olduğu için uyarı da gösterilmez. */
.v19-generate-warning { display: none !important; }
@media (max-width: 743px) {
  .v19-generate-warning[data-v19-show="1"] { display: flex !important; }
}
.v19-generate-warning {
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--v19-warn);
  background: rgba(244, 183, 64, 0.1);
  border: 1px solid rgba(244, 183, 64, 0.3);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
}
.v19-generate-warning svg { width: 16px; height: 16px; flex-shrink: 0; }
.v19-generate-hint {
  display: none;
  text-align: center;
  font-size: 0.78rem;
  color: var(--v19-text-3);
  margin: -12px 0 16px 0;
}
@media (max-width: 743px) {
  .v19-generate-hint { display: block; }
}
/* Buton metni tümü büyük harf yerine cümle düzeninde okunur. */
.mobile-home-generate .btn-action-title {
  text-transform: none !important;
  letter-spacing: 0 !important;
}
/* Ana sayfada sorular yokken büyük soluk yer tutucu görünmesin;
   yerini kompakt v1.9 boş durumu alır (spec §5E). */
@media (max-width: 743px) {
  body:not(.v19-has-questions) #panel-soru-uret #questions-container { display: none !important; }
}
.mobile-home-generate.is-disabled {
  filter: grayscale(0.7);
  opacity: 0.55;
  box-shadow: none !important;
}

/* ---------------------------------------------------- BOŞ / DURUM KARTLARI */
.v19-empty {
  text-align: center;
  padding: 20px 16px;
}
.v19-empty-icon {
  width: 46px;
  height: 46px;
  margin: 0 auto 10px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--v19-card-2);
  border: 1px solid var(--v19-line);
  color: var(--v19-text-3);
}
.v19-empty-icon svg { width: 22px; height: 22px; }
.v19-empty h4 {
  margin: 0 0 6px 0;
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--v19-text);
}
.v19-empty p {
  margin: 0 0 14px 0;
  font-size: 0.84rem;
  color: var(--v19-text-2);
  line-height: 1.5;
}
.v19-empty .v19-btn { width: auto; }

/* ------------------------------------------------------ ÜRETİM İLERLEMESİ */
.v19-progress-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.v19-progress-pct {
  margin-left: auto;
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--v19-blue);
  font-variant-numeric: tabular-nums;
}
.v19-steplist {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 14px;
}
.v19-steplist .mobile-progress-step {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.82rem;
  font-weight: 500;
  text-align: left;
  color: var(--v19-text-3);
  background: none !important;
  border: none !important;
  box-shadow: none !important;   /* eski yatay adım rozetinin parıltısı kalmasın */
  padding: 0 !important;
}
.v19-steplist .mobile-progress-step::before {
  content: "";
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid var(--v19-line);
  flex-shrink: 0;
  box-sizing: border-box;
}
.v19-steplist .mobile-progress-step.done { color: var(--v19-ok) !important; }
.v19-steplist .mobile-progress-step.done::before {
  border-color: var(--v19-ok);
  background: var(--v19-ok);
}
.v19-steplist .mobile-progress-step.active {
  color: var(--v19-text) !important;
  font-weight: 700;
}
.v19-steplist .mobile-progress-step.active::before {
  border-color: var(--v19-purple);
  background: var(--v19-purple);
  animation: v19Pulse 1.2s ease-in-out infinite;
}
.v19-steplist .mobile-progress-step.failed { color: var(--v19-err) !important; }
.v19-steplist .mobile-progress-step.failed::before {
  border-color: var(--v19-err);
  background: var(--v19-err);
}
@keyframes v19Pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(115, 87, 255, 0.55); }
  50% { box-shadow: 0 0 0 6px rgba(115, 87, 255, 0); }
}

.v19-progress-actions {
  display: flex;
  gap: 8px;
  margin-top: 14px;
}
.v19-progress-actions .v19-btn { flex: 1; }

/* "Arka planda devam et" seçilince kart mini bir şeride iner. */
.mobile-generate-progress.v19-minimized .v19-steplist,
.mobile-generate-progress.v19-minimized .v19-progress-actions {
  display: none;
}

/* Üretim başlamadan altı büyük "Bekliyor" kutusu görünmesin.
   Masaüstünde kart üretim başlayınca (ya da sorular yüklüyken) açılır.
   Mobilde bu kartın yerini tek odaklı v1.9 ilerleme kartı aldı; hep gizli. */
#panel-soru-uret .stepper-card { display: none; }
body.v19-generating #panel-soru-uret .stepper-card,
body.v19-has-questions #panel-soru-uret .stepper-card { display: block; }
@media (max-width: 743px) {
  #panel-soru-uret .stepper-card,
  body.v19-generating #panel-soru-uret .stepper-card,
  body.v19-has-questions #panel-soru-uret .stepper-card { display: none !important; }
}

/* ---------------------------------------------------------- BAŞARI KARTI */
/* Prototipte sonuç ekranının kendi kutusu yok; içerik doğrudan zemine oturur. */
.v19-success {
  border: none;
  background: none;
}
.v19-stat-row {
  display: flex;
  gap: 8px;
  margin: 14px 0;
}
.v19-stat {
  flex: 1;
  text-align: center;
  padding: 10px 6px;
  border-radius: 14px;
  background: var(--v19-card-2);
  border: 1px solid var(--v19-line);
}
.v19-stat b {
  display: block;
  font-size: 1.1rem;
  color: var(--v19-text);
}
.v19-stat span {
  font-size: 0.68rem;
  color: var(--v19-text-3);
}
.v19-success-secondary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 10px;
}
.v19-success-secondary .v19-btn {
  flex-direction: column;
  gap: 4px;
  font-size: 0.68rem;
  padding: 10px 4px;
  min-width: 0;
}

/* ------------------------------------------------------------ GEÇMİŞ EKRANI */
/* Prototip (dc.html 322–362): başlık satırı + arama/JSON satırı + tarih grupları. */
.v19-screen-head { display: none; }
@media (max-width: 743px) {
  .v19-screen-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  /* Masaüstünün uzun başlığı ve açıklaması mobilde prototip başlığına bırakır. */
  #panel-gecmis > div:first-child { display: none !important; }
}
.v19-screen-title {
  font-family: var(--font-heading);
  font-size: 23px;             /* prototip: font:800 23px */
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.5px;
  color: var(--v19-text);
}
.v19-grid-btn,
.v19-dots-btn {
  display: grid;
  place-items: center;
  padding: 0;
  cursor: pointer;
  color: var(--v19-text-2);
}
.v19-grid-btn {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.09);
}
.v19-dots-btn {
  width: 20px;
  height: 20px;
  border: none;
  background: none;
  color: var(--v19-text-3);
}

.v19-history-toolbar {
  display: flex;
  gap: 11px;
  align-items: stretch;
  margin: 18px 0 0;
}
.v19-search-wrap {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
  background: var(--v19-card);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 13px;
  padding: 12px 14px;
}
.v19-search-icon { flex: none; color: #7b839a; }
.v19-search {
  flex: 1;
  min-width: 0;
  border: none;
  background: none;
  color: var(--v19-text);
  padding: 0;
  font-family: inherit;
  font-size: 13px;             /* prototip: font:500 13px */
  font-weight: 500;
  line-height: 1.4;
}
.v19-search::placeholder { color: #6d768d; }
.v19-search:focus { outline: none; }
.v19-toolbar-btn {
  flex: none;
  padding: 12px 15px;
  border-radius: 13px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.05);
  color: var(--v19-text-2);
  font-family: inherit;
  font-size: 13px;             /* prototip: font:600 13px */
  font-weight: 600;
  cursor: pointer;
}
.v19-toolbar-btn:hover { background: rgba(255, 255, 255, 0.1); }

/* ------------------------------------------------------------- GEÇMİŞ KARTI */
.v19-hist-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.v19-hist-info {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.v19-hist-title {
  font-size: 14.5px;           /* prototip: font:700 14.5px */
  font-weight: 700;
  line-height: 1.35;
  color: var(--v19-text);
}
.v19-hist-meta {
  font-size: 12.5px;           /* prototip: font:500 12.5px */
  font-weight: 500;
  line-height: 1.35;
  color: var(--v19-text-3);
}
.v19-hist-time {
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--v19-text-4);
}
.v19-hist-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 12px;
}
.v19-hist-act {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: none;
  color: var(--v19-text-2);
  display: grid;
  place-items: center;
  cursor: pointer;
  padding: 0;
}
.v19-hist-act:hover { background: rgba(255, 255, 255, 0.08); }
.v19-hist-act-plus {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
}
.v19-filter-panel {
  display: none;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.v19-filter-panel.open { display: flex; }
.v19-filter-panel select {
  flex: 1;
  min-width: 130px;
  min-height: 44px;
  border-radius: 12px;
  border: 1px solid var(--v19-line);
  background: var(--v19-input);
  color: var(--v19-text);
  padding: 0 10px;
  font-size: 0.82rem;
}
/* Prototip tarih grubu başlığı: "Bugün / Dün / Bu Hafta". */
.v19-group-title {
  font-size: 12.5px;           /* prototip: font:600 12.5px */
  font-weight: 600;
  letter-spacing: 0.2px;
  text-transform: none;
  color: #7b839a;
  margin: 24px 0 11px;
}
.v19-group-title:first-child { margin-top: 24px; }

@media (max-width: 743px) {
  /* Geçmiş kartı prototip ölçüleri (dc.html 341). */
  #history-cards-list { display: block; }
  #history-cards-list .history-card {
    background: var(--v19-card) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    border-radius: 17px !important;
    padding: 16px !important;
    margin: 0 0 11px !important;
    box-shadow: none !important;
  }
  #history-cards-list .history-card + .v19-group-title { margin-top: 24px; }
}

.v19-menu-anchor { position: relative; }
.v19-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 210px;
  background: var(--v19-card-2);
  border: 1px solid var(--v19-line);
  border-radius: 14px;
  padding: 6px;
  z-index: 1300;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55);
}
.v19-menu button {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  padding: 8px 12px;
  border: none;
  background: none;
  color: var(--v19-text);
  font-size: 0.85rem;
  text-align: left;
  border-radius: 10px;
  cursor: pointer;
}
.v19-menu button:hover { background: rgba(255, 255, 255, 0.06); }
.v19-menu button.danger { color: var(--v19-err); }
.v19-menu svg { width: 16px; height: 16px; flex-shrink: 0; }

/* Geçmiş kartındaki sürekli kırmızı "Sil" düğmesi ⋮ menüsüne taşındı. */
.history-card .btn-delete-history,
.history-table .btn-delete-history { display: none !important; }

/* -------------------------------------------- KATLANABİLİR BİLGİ SATIRI */
.v19-disclosure-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--v19-line);
  background: var(--v19-card-2);
  color: var(--v19-text-2);
  font-size: 0.83rem;
  font-weight: 600;
  cursor: pointer;
  text-align: left;
}
.v19-disclosure-btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.v19-chevron { margin-left: auto; transition: transform 0.2s ease; }
[aria-expanded="true"] > .v19-chevron { transform: rotate(180deg); }
.v19-collapsed { display: none !important; }

/* ------------------------------------------------------- AYAR ÇEKMECESİ */
.v19-advanced-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--v19-line);
  background: var(--v19-card-2);
  color: var(--v19-text);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
}

/* Mobilde tüm alan etiketleri gizleniyordu; ayar çekmecesinde ve ayar alt
   sayfalarında alanın ne olduğu görünmeliydi (spec §6 ve §13). */
@media (max-width: 743px) {
  #mobile-settings-drawer .form-label,
  #mobile-settings-drawer .custom-select-label,
  .v19-sheet-body .form-label,
  .v19-sheet-body .custom-select-label {
    display: block !important;
    margin-bottom: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--v19-text-2);
  }
}

.v19-drawer-footer { display: none; }
@media (max-width: 743px) {
  .v19-drawer-footer {
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 12px -14px -14px;
    padding: 12px 14px calc(12px + var(--sa-bottom));
    background: rgba(11, 14, 21, 0.97);
    border-top: 1px solid var(--v19-line);
    z-index: 5;
  }
  .v19-drawer-footer-info {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--v19-text-2);
  }
}

/* ---------------------------------------------------- SORU KARTI İŞLEMLERİ */
.v19-q-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--v19-line);
}
.v19-q-actions .v19-btn {
  min-height: 44px;
  padding: 8px 12px;
  font-size: 0.78rem;
}
.v19-q-actions .v19-btn-icon { flex: 0 0 44px; padding: 8px; }
.question-card.is-locked { border-color: rgba(244, 183, 64, 0.45) !important; }
.v19-lock-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.66rem;
  font-weight: 700;
  color: var(--v19-warn);
  background: rgba(244, 183, 64, 0.12);
  border: 1px solid rgba(244, 183, 64, 0.3);
  border-radius: 999px;
  padding: 3px 8px;
}
.v19-lock-badge svg { width: 12px; height: 12px; }
/* Başlıktaki küçük kalem simgesi yerini alt satırdaki net "Düzenle" düğmesine bıraktı. */
.question-card-header .question-edit-btn { display: none !important; }

/* ------------------------------------------------------------ AYARLAR LİSTESİ */
.v19-settings-group-title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--v19-text-3);
  margin: 20px 0 8px;
}
.v19-settings-group-title:first-of-type { margin-top: 12px; }

.v19-settings-group {
  background: var(--v19-card);
  border: 1px solid var(--v19-line);
  border-radius: 20px;
  overflow: hidden;
}
.v19-settings-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 64px;
  padding: 12px 14px;
  background: none;
  border: none;
  border-bottom: 1px solid var(--v19-line);
  color: var(--v19-text);
  text-align: left;
  cursor: pointer;
}
.v19-settings-row:last-child { border-bottom: none; }
.v19-settings-row:hover { background: rgba(255, 255, 255, 0.04); }
.v19-settings-icon {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 12px;
  background: var(--v19-card-2);
  border: 1px solid var(--v19-line);
  color: #c4b5fd;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.v19-settings-icon svg { width: 18px; height: 18px; }
.v19-settings-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.v19-settings-text b { font-size: 0.92rem; font-weight: 600; }
.v19-settings-text small {
  font-size: 0.76rem;
  color: var(--v19-text-3);
  line-height: 1.35;
  margin-top: 2px;
}
.v19-settings-chevron { width: 18px; height: 18px; color: var(--v19-text-3); flex-shrink: 0; }

/* Eski ayar düzeni gizlenir ama DOM'da kalır: alt sayfa açıldığında
   kartın kendisi (input'ları ve dinleyicileriyle) oraya TAŞINIR. */
#panel-ayarlar.v19-settings-managed > .settings-desktop-intro,
#panel-ayarlar.v19-settings-managed > .settings-native-intro,
#panel-ayarlar.v19-settings-managed > #btn-open-help,
#panel-ayarlar.v19-settings-managed > .settings-layout,
#panel-ayarlar.v19-settings-managed > .card.settings-card,
#panel-ayarlar.v19-settings-managed > div:last-child:not(#v19-settings-list) {
  display: none !important;
}

/* ------------------------------------------------------- ALT SAYFA (SHEET) */
.v19-sheet-wrap { display: none; }
.v19-sheet-wrap.open {
  display: block;
  position: fixed;
  inset: 0;
  z-index: 1250;
}
.v19-sheet-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.62);
}
.v19-sheet {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: 86vh;
  display: flex;
  flex-direction: column;
  background: var(--v19-card);
  border-top: 1px solid var(--v19-line);
  border-radius: 22px 22px 0 0;
  box-shadow: 0 -20px 60px rgba(0, 0, 0, 0.6);
}
@media (min-width: 744px) {
  .v19-sheet {
    left: 50%;
    right: auto;
    bottom: auto;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(560px, 92vw);
    border-radius: 22px;
    border: 1px solid var(--v19-line);
  }
}
.v19-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--v19-line);
  flex-shrink: 0;
}
.v19-sheet-head h4 {
  margin: 0;
  font-size: 1.02rem;
  font-weight: 700;
  color: var(--v19-text);
}
.v19-sheet-body {
  padding: 16px;
  padding-bottom: calc(16px + var(--sa-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
}
/* Alt sayfaya taşınan kart, sayfanın kendi kabuğu olduğu için çerçevesizleşir. */
.v19-sheet-body > .card {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.v19-sheet-body .v19-card-inline {
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--v19-card-2);
  border: 1px solid var(--v19-line);
}
/* --------------------------------------------- TEK DOKUNUŞLA SEÇİM LİSTESİ */
/* Ders / Sınıf / Soru Tipi seçenekleri alt sayfada alt alta listelenir; eskiden
   yerleşik <select> ödünç alınıyor ve ikinci bir dokunuş gerekiyordu. */
.v19-optlist {
  display: flex;
  flex-direction: column;
  margin: 2px 0 4px;
}
.v19-optrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  padding: 12px 14px;
  border: none;
  border-bottom: 1px solid var(--v19-line);
  background: none;
  color: var(--v19-text);
  font: inherit;
  font-size: 0.95rem;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.v19-optrow:last-child { border-bottom: none; }
.v19-optrow:active { background: rgba(255, 255, 255, 0.05); }
.v19-optrow.is-on { color: var(--v19-purple); font-weight: 700; }
.v19-optcheck { flex: none; color: var(--v19-purple); }
.v19-optlabel { min-width: 0; }

.v19-field-label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--v19-text-2);
  margin: 14px 0 6px;
}
.v19-field {
  width: 100%;
  min-height: 50px;
  border-radius: 14px;
  border: 1px solid var(--v19-line);
  background: var(--v19-input);
  color: var(--v19-text);
  padding: 0 12px;
  font-size: 0.88rem;
}
body.v19-sheet-open { overflow: hidden; }

/* ------------------------------------------------- SABİT ALT OLUŞTURMA ALANI */
.v19-sticky-bar {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 16px -16px 0;
  padding: 12px 16px calc(12px + var(--sa-bottom));
  /* Tam opak: yarı saydam zeminde altından akan sınav metni bara karışıyordu. */
  background: var(--v19-bg);
  border-top: 1px solid var(--v19-line);
  z-index: 20;
}
.v19-sticky-info {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--v19-text-2);
  white-space: nowrap;
}
.v19-meb-cta {
  flex: 1;
  min-height: 52px;
  padding: 12px 16px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
.v19-meb-cta .btn-action-title {
  font-size: 0.92rem !important;
  letter-spacing: 0 !important;
}
@media (max-width: 480px) {
  .v19-sticky-bar { flex-direction: column; align-items: stretch; gap: 8px; }
  .v19-sticky-info { text-align: center; }
}

/* Yapışkan bar KENDİ kapsayıcı bloğunu (panelin içerik kutusu) aşamaz; panelin
   alt dolgusu kadar yukarıda çakılıp kalır ve sınav metni barın altından akmaya
   devam eder. Mobilde bu dolgu alt menü için ayrılan 118px'ti — ama alt menü bu
   ekranda zaten gizli. Boşluğu sıfırlıyoruz: alt boşluğu (güvenli alan dahil)
   barın kendi dolgusu veriyor. */
#panel-kaynaklar { padding-bottom: 0 !important; }
/* Masaüstünde panelin yan dolgusu 24px; bar kenardan kenara uzanmalı. */
#panel-kaynaklar .v19-sticky-bar { margin: 16px -24px 0; padding-left: 24px; padding-right: 24px; }

/* -------------------------------------------------- ÇEVRİMDIŞI / HATA DURUMU */
.v19-offline-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  font-size: 0.82rem;
  line-height: 1.4;
  color: #ffe9b8;
  background: rgba(244, 183, 64, 0.14);
  border-bottom: 1px solid rgba(244, 183, 64, 0.3);
}
.v19-offline-banner svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--v19-warn); }

.v19-error-card {
  border: 1px solid rgba(255, 101, 119, 0.4);
  background: linear-gradient(180deg, rgba(255, 101, 119, 0.1), var(--v19-card));
}

/* Geçmiş kartındaki ek bilgi (kazanım sayısı · soru türü) */
.v19-history-meta {
  color: var(--v19-text-3);
  font-weight: 500;
}

.v19-inline-note {
  font-size: 0.8rem;
  color: var(--v19-text-3);
  margin: 8px 0 0 0;
  line-height: 1.5;
}

/* ============================================================================
   AŞAMA 1 — PROTOTİP GÖRSEL TEMELİ
   ----------------------------------------------------------------------------
   Kaynak: tasarim-prototip-v1.9/mobile-app-interactive-prototype/project/
           SoruStudio.dc.html  (+ uploads/01-ana-sayfa.png)

   Bu bölüm YALNIZCA görünüm değiştirir: renk belirteçleri, tipografi, köşe
   yarıçapları, üst başlık ve alt menü. Hiçbir ID, sınıf adı, dinleyici veya
   akış değişmez; prototipin iç yapısı kopyalanmaz.

   Prototipten SAPMA (bilerek, işlev korunsun diye):
   - Prototipin alt menüsündeki ortadaki "+ Oluştur" FAB'ı alınmadı; mevcut
     beş sekmeli sıra (Ana Sayfa · Geçmiş · MEB Senaryo · Değerlendirme ·
     Daha Fazla) K-24 ile onaylandı ve MEB Senaryo erişimi FAB'a kurban
     edilmemeli.
   - Prototipin sol üstündeki hamburger menü alınmadı; uygulamada o işlevi
     "Daha Fazla" sekmesi görüyor. Yerinde marka logosu kalır.
   ========================================================================== */

:root {
  /* Prototip Manrope kullanıyor. Yerel kopya fonts/manrope-*.woff2;
     yüklenemezse eski Outfit/Inter yedeği devrede kalır. */
  --font-heading: 'Manrope', 'Outfit', sans-serif;
  --font-body: 'Manrope', 'Inter', sans-serif;

  /* Prototip renkleri (SoruStudio.dc.html satır 40, 73, 598 …) */
  --v19-bg: #080b12;         /* telefon yüzeyi        */
  --v19-card: #0e1421;       /* kart                  */
  --v19-card-2: #131b2b;     /* ikincil yüzey / hover */
  --v19-input: #121a2a;      /* giriş alanı           */
  --v19-line: rgba(255, 255, 255, 0.07);
  --v19-line-strong: rgba(255, 255, 255, 0.12);
  --v19-purple: #6c4df6;
  --v19-purple-2: #8a72f9;
  --v19-purple-soft: rgba(108, 77, 246, 0.16);
  --v19-blue: #6fa2f7;
  --v19-ok: #34d399;
  --v19-warn: #f5b70a;
  --v19-err: #f87171;
  --v19-text: #f2f4f8;
  --v19-text-2: #c9cede;
  --v19-text-3: #8b93a7;
  --v19-text-4: #6d768d;

  /* Eski değişken adları korunur, değerleri prototipe hizalanır. */
  --bg-main: #080b12;
  --bg-sidebar: #090c14;
  --bg-card: #0e1421;
  --border-color: rgba(255, 255, 255, 0.07);
  --border-light: rgba(255, 255, 255, 0.05);
  --text-dark: #f2f4f8;
  --text-muted: #a3abbf;   /* prototip gövde metni; kontrast korunur */
  --text-light: #8b93a7;

  --primary: #8a72f9;
  --primary-hover: #6c4df6;
  --primary-light: #171235;
  --primary-glow: rgba(108, 77, 246, 0.28);
  --secondary: #6c4df6;
  --secondary-gradient: linear-gradient(135deg, #8f79ff 0%, #6c4df6 100%);
  --secondary-glow: rgba(108, 77, 246, 0.45);

  --success: #34d399;
  --success-text: #34d399;
  --warning: #f5b70a;
  --danger: #f87171;

  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 22px;

  --shadow-primary: 0 18px 40px -18px rgba(108, 77, 246, 0.8);
}

/* ------------------------------------------------------------ MARKA SİMGESİ */
/* Uygulama simgesi kare bir görsel; launcher onu maskeliyor, uygulama içinde
   aynı yuvarlaklığı biz veriyoruz. */
.brand-mark {
  display: block;
  border-radius: 22%;
  object-fit: contain;
}

/* --------------------------------------------------------------- TİPOGRAFİ */
/* Prototipte gövde 13–15px, başlık 23–27px, harf aralığı sıkı. */
h1, h2, h3, h4 { letter-spacing: -0.4px; }

/* ------------------------------------------------------------------ YÜZEY */
.card {
  border-radius: 18px;
  box-shadow: none;
}
.card:hover { border-color: var(--v19-line-strong); box-shadow: none; }

.v19-card {
  border-radius: 18px;
  padding: 18px;
}

@media (max-width: 743px) {
  /* Prototipte arka plan düz; kart/ekran üstünde parıltı yok. */
  body {
    background: var(--v19-bg) !important;
  }

  .card { border-radius: 18px !important; }

  /* Prototipte kaydırılan alan ÜST BAŞLIĞI DA İÇİNE ALIR: ana ekranda yukarı
     kaydırınca "SoruStudio" satırı da yukarı çıkar. Uygulamada .panel kaydırma
     kabıydı ve başlık üstte sabit kalıyordu; mobilde kaydırmayı bir seviye
     yukarı, .main-wrapper'a alıyoruz. Panel içi yapışkan alt barlar (kazanım,
     editör) en yakın kaydırma atasına göre çalıştığı için etkilenmez. */
  .main-wrapper {
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
  }
  .panel {
    overflow: visible;
    /* Prototip yatay kenar boşluğu 22px; her ekranın kendi dikey boşluğu var. */
    padding: 12px 22px !important;
    padding-bottom: calc(118px + var(--sa-bottom)) !important;
  }

  /* Durum çubuğu boşluğunu ana ekranda üst başlığın margin'i veriyor. Başlığın
     gizli olduğu ekranlarda (Geçmiş, Değerlendirme, MEB, Kazanım, Ayarlar…)
     bunu panelin kendisi vermeli; yoksa başlık saatin/pil simgesinin altına
     giriyordu. */
  body[data-v19-panel]:not([data-v19-panel="panel-soru-uret"]) .panel {
    padding-top: calc(12px + var(--sa-top)) !important;
  }
}

/* ------------------------------------------------------------- ÜST BAŞLIK */
/* Prototipte bu satır YALNIZCA ana ekranda vardır (dc.html 55–66):
   solda üç çizgi, ortada "SoruStudio", sağda "⚡ jeton". Diğer ekranlar
   kendi başlığını panel içinde taşır. */
@media (max-width: 743px) {
  .header {
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 22px !important;
    margin-top: calc(8px + var(--sa-top));
    background: transparent !important;
    border-bottom: none !important;
    flex-shrink: 0;
    gap: 12px !important;
  }
  /* Ana ekran dışında üst başlık yok. */
  body[data-v19-panel]:not([data-v19-panel="panel-soru-uret"]) .header {
    display: none !important;
  }

  /* Marka bloğu ortada durur; iki yandaki düğmeler kendi genişliğinde kalır. */
  .header-brand {
    flex: 0 1 auto;
    min-width: 0;
    align-items: center;
  }
  .mobile-header-logo { display: none !important; }

  /* Prototipte uygulama adı düz beyaz; degrade metin dolgusu kaldırıldı. */
  .header-title {
    font-size: 19px !important;
    font-weight: 700 !important;
    letter-spacing: -0.3px !important;
    line-height: 1.35 !important;
    background: none !important;
    -webkit-text-fill-color: var(--v19-text) !important;
    color: var(--v19-text) !important;
  }

  /* Üç çizgili menü düğmesi 06.08.2026'da kaldırıldı (alt menüdeki "Daha Fazla"
     ile aynı sayfayı açan kopya giriş noktasıydı). Başlık artık iki parçalı:
     marka solda, jeton sağda. Başlık satırı space-between ile hizalanıyor ve
     en sağda genişliği sıfır olan .header-widgets duruyor; düğme kalkınca
     jeton göstergesi ortada asılı kalıyordu, sağ kenara itiliyor. */
  .header .mobile-header-actions { margin-left: auto; }

  /* Tek üyelik bileşeni: prototipte çıplak "⚡ 421". Kutu/parıltı yok. */
  .mobile-header-actions { gap: 0 !important; }
  .mobile-credit-chip {
    min-height: 0;
    gap: 5px;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--v19-text) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
  }
  .mobile-credit-chip i,
  .mobile-credit-chip svg {
    color: var(--v19-warn) !important;
    width: 17px !important;
    height: 17px !important;
  }
  .mobile-credit-chip.is-premium {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--v19-warn) !important;
  }
}

/* --------------------------------------------------------------- ALT MENÜ */
/* Prototip (dc.html 451–473): 96px yükseklik, yarı saydam + bulanık zemin,
   beş eşit sütun, ortada yükseltilmiş mor "+" düğmesi. İçerik menünün ALTINDAN
   akar; bu yüzden menü sabit konumlanır ve panellere 118px alt boşluk verilir. */
@media (max-width: 743px) {
  .sidebar {
    height: calc(96px + var(--sa-bottom)) !important;
    padding: 11px 0 0 !important;
    padding-bottom: var(--sa-bottom) !important;
    background: rgba(9, 12, 20, 0.92) !important;
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    border-top: 1px solid rgba(255, 255, 255, 0.07) !important;
    overflow: visible;
    align-items: flex-start;
  }
  .sidebar-menu {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr);
    align-items: start;
    justify-content: initial !important;
    gap: 0 !important;
    max-width: none;
    margin: 0;
    overflow: visible;
  }
  .sidebar .menu-item[data-mobile-nav="primary"] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    min-width: 0;
    min-height: 0 !important;
    max-width: none !important;
    padding: 0 2px !important;
    border-radius: 0;
    background: none !important;
  }
  .sidebar .menu-item[data-mobile-nav="primary"] svg {
    width: 21px !important;
    height: 21px !important;
  }
  .sidebar .menu-item[data-mobile-nav="primary"],
  .sidebar .menu-item[data-mobile-nav="primary"] svg {
    color: #6b7490 !important;
    filter: none !important;
  }
  .sidebar .menu-item[data-mobile-nav="primary"] .menu-label-mobile {
    font-size: 9.5px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
  }
  /* Aktif sekme: prototipte kutu/parıltı yok — yalnızca ikon moru, etiket açılır.
     style.css:284'teki "box-shadow: 0 0 0 1px var(--primary-glow)" masaüstü
     kenar çubuğu için; mobil alt menüde sekmenin etrafında 1px mor çerçeve
     bırakıyordu. Masaüstünde korunur, burada kaldırılır. */
  .sidebar .menu-item.active,
  .sidebar .menu-item[data-mobile-nav="primary"].active {
    color: #e6e8f0 !important;
    background: none !important;
    box-shadow: none !important;
  }
  .sidebar .menu-item[data-mobile-nav="primary"].active svg {
    color: var(--v19-purple) !important;
    filter: none !important;
  }
  .sidebar .menu-item[data-mobile-nav="primary"].active::before {
    display: none !important;
  }

  /* Ortadaki yükseltilmiş "+" düğmesi. */
  .v19-nav-fab {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    margin-top: -16px;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .v19-nav-fab-circle {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--v19-purple);
    box-shadow: 0 12px 28px -8px rgba(108, 77, 246, 0.8);
    display: grid;
    place-items: center;
  }
  .v19-nav-fab:active .v19-nav-fab-circle { filter: brightness(1.12); }
}
/* Masaüstünde alt menünün "+" düğmesi yok. */
@media (min-width: 744px) {
  .v19-nav-fab { display: none !important; }
}

/* Çok dar ekranda uygulama adı gizleniyordu; jeton göstergesi artık yalnızca
   sayı olduğu için satır sığıyor ve prototipteki üç parçalı başlık korunur. */
@media (max-width: 380px) {
  .header-title { display: block !important; }
}

/* ------------------------------------------------------------- ANA BUTON */
/* Prototipte ana üretim butonu DÜZ mor, köşe 20px, tek yumuşak gölge —
   pembe/mavi degrade ve çift parıltı kaldırıldı (brief: "her karta glow YOK"). */
@media (max-width: 743px) {
  .btn-action-gradient {
    background: var(--v19-purple) !important;
    border-radius: 20px !important;
    padding: 22px 18px !important;   /* prototip: padding:22px 18px */
    gap: 0 !important;               /* aralığı alt satırın kendi margin'i verir */
    box-shadow: 0 18px 40px -18px rgba(108, 77, 246, 0.8) !important;
  }
  .btn-action-gradient .btn-action-title {
    font-size: 20px !important;      /* prototip: font:800 20px */
    font-weight: 800 !important;
    letter-spacing: -0.3px !important;
    line-height: 1.4 !important;
  }
  /* Ana ekranın üretim butonu prototipte 22px aralıkla özet kartını izler. */
  .mobile-home-generate { margin-top: 22px !important; }
  /* Prototipte buton metinleri cümle düzeninde ve parıltı katmanı yok. */
  .btn-action-gradient .btn-action-title {
    text-transform: none !important;
    letter-spacing: -0.3px !important;
  }
  .btn-action-gradient::before,
  .btn-action-gradient::after { display: none !important; }

  /* Sabit alt bardaki MEB butonu kompakt kalmalı. */
  .v19-meb-cta {
    padding: 17px !important;
    border-radius: 15px !important;
    box-shadow: none !important;
  }
  .v19-meb-cta .btn-action-title {
    font-size: 15.5px !important;   /* prototip: font:700 15.5px */
    font-weight: 700 !important;
  }
  .v19-meb-cta .btn-action-title svg { display: none !important; }
}

/* ------------------------------------------------- İKİNCİL BUTON / GİRİŞ */
.v19-btn {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.09);
}
.v19-btn:hover { background: rgba(255, 255, 255, 0.1); }
.v19-btn-primary,
.v19-btn-primary:hover {
  background: var(--v19-purple);
  border-color: var(--v19-purple);
}
.v19-icon-btn {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.09);
  color: var(--v19-text-2);
}

/* ============================================================================
   AŞAMA 2 — ANA SAYFA (prototip "home" ekranı)
   Kaynak: SoruStudio.dc.html satır 53–110 + uploads/01-ana-sayfa.png
   ========================================================================== */

/* ------------------------------------------------------------- KARŞILAMA */
.v19-greeting { display: none; }
@media (max-width: 743px) {
  .v19-greeting { display: block; margin: 18px 0 0; }
  .v19-greeting-title {
    margin: 0;
    font-family: var(--font-heading);
    font-size: 27px;           /* prototip: font:800 27px/1.2 */
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.7px;
    color: var(--v19-text);
  }
  .v19-greeting-wave { font-size: 24px; }
  .v19-greeting-sub {
    margin: 10px 0 0;
    font-size: 14px;           /* prototip: font:500 14px */
    font-weight: 500;
    line-height: 1.35;
    color: var(--v19-text-3);
  }
}

/* ------------------------------------------------- SORU AYARLARI ÖZETİ */
@media (max-width: 743px) {
  .mobile-create-panel { margin-top: 26px; }
  .mobile-create-panel-inner {
    background: var(--v19-card);
    border: 1px solid var(--v19-line);
    border-radius: 18px;
    padding: 18px 18px 16px;
  }
}
.v19-sum-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.v19-sum-heading {
  font-size: 15px;             /* prototip: font:700 15px */
  font-weight: 700;
  line-height: 1.4;
  color: var(--v19-text);
}
.v19-sum-edit {
  flex: none;
  padding: 6px 11px;
  border-radius: 9px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.06);
  color: var(--v19-text-2);
  font-family: inherit;
  font-size: 12.5px;           /* prototip: font:600 12.5px */
  font-weight: 600;
  line-height: normal;
  cursor: pointer;
}
.v19-sum-edit:hover { background: rgba(255, 255, 255, 0.11); }

.v19-sum-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 18px;
}
.v19-sum-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.v19-sum-cell + .v19-sum-cell {
  padding-left: 16px;
  border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.v19-sum-cell span {
  font-size: 11.5px;           /* prototip: font:500 11.5px */
  font-weight: 500;
  line-height: 1.3;
  color: #7b839a;              /* prototip etiket tonu */
}
.v19-sum-cell b {
  font-size: 15px;             /* prototip: font:700 15px */
  font-weight: 700;
  line-height: 1.4;
  color: var(--v19-text);
  overflow-wrap: break-word;
}

.v19-sum-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 12px;             /* prototip: font:500 12px */
  font-weight: 500;
  line-height: 1.4;
  color: var(--v19-text-3);
}
.v19-sum-dot { color: #39405a; }
.v19-sum-warn { color: var(--v19-warn); font-weight: 600; }

/* ---------------------------------------------------------- ANA CTA ALTI */
/* Süre/maliyet satırı artık butonun içinde; dışarıdaki ipucu gereksiz. */
@media (max-width: 743px) {
  .v19-generate-hint { display: none !important; }
}
.v19-cta-sub {
  display: block;
  margin-top: 6px;
  font-size: 12.5px;           /* prototip: font:500 12.5px */
  font-weight: 500;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.35;
}
.mobile-home-generate.is-generating .v19-cta-sub,
.mobile-home-generate.is-disabled .v19-cta-sub { opacity: 0.8; }

/* ------------------------------------------------------ SON ÇALIŞMA KARTI */
.v19-last-heading {
  font-size: 15px;             /* prototip: font:700 15px */
  font-weight: 700;
  line-height: 1.4;
  color: var(--v19-text);
}
.v19-last-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
}
.v19-last-info {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.v19-last-title {
  font-size: 14px;             /* prototip: font:600 14px */
  font-weight: 600;
  line-height: 1.35;
  color: var(--v19-text);
}
.v19-last-meta {
  font-size: 12.5px;           /* prototip: font:500 12.5px */
  font-weight: 500;
  line-height: 1.35;
  color: var(--v19-text-3);
}
.v19-last-time {
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--v19-text-4);
}
.v19-last-cta {
  flex: none;
  padding: 10px 14px;
  border-radius: 11px;
  border: 1px solid rgba(108, 77, 246, 0.4);
  background: var(--v19-purple-soft);
  color: #e8eaf2;
  font-family: inherit;
  font-size: 13px;             /* prototip: font:700 13px */
  font-weight: 700;
  line-height: normal;
  cursor: pointer;
}
.v19-last-cta:hover { background: rgba(108, 77, 246, 0.28); }

/* Kartlar arası ritim: prototipte 22px. */
#v19-home-stack > .v19-card { margin-bottom: 0; }
#v19-home-stack > .v19-card + .v19-card { margin-top: 22px; }
@media (max-width: 743px) {
  #v19-home-stack { margin-top: 22px; }
}

/* ============================================================================
   AŞAMA 3 — ÜRETİM SÜRECİ VE SONUÇ
   Kaynak: SoruStudio.dc.html satır 112–203
           + uploads/02-uretim-ilerleme.png, uploads/03-sonuc-ekrani.png
   ========================================================================== */

/* Üretim sürerken ana sayfanın geri kalanı ekrandan çekilir; prototipte
   ilerleme kendi tam ekranıdır. Masaüstünde mevcut düzen korunur. */
@media (max-width: 743px) {
  body.v19-generating #v19-greeting,
  body.v19-generating #panel-soru-uret .mobile-create-panel,
  body.v19-generating #btn-mobile-generate,
  body.v19-generating #v19-generate-warning,
  body.v19-generating #v19-home-stack { display: none !important; }
}

/* Prototipte üretim kendi tam ekranıdır: üst başlık yok, sol üstte kapatma
   düğmesi, altta iki düğme sayfanın dibine yaslanır (dc.html 112–154). */
@media (max-width: 743px) {
  body.v19-generating .header { display: none !important; }
  body.v19-generating #panel-soru-uret {
    padding-top: calc(8px + var(--sa-top)) !important;
    padding-bottom: calc(34px + var(--sa-bottom)) !important;
  }
  body.v19-generating .sidebar { display: none !important; }
}
.v19-gen-screen {
  display: flex;
  flex-direction: column;
  min-height: calc(100dvh - 42px - var(--sa-top) - var(--sa-bottom));
  padding: 0 !important;
  border: none !important;
  background: none !important;
  box-shadow: none !important;
}
.v19-gen-close {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  padding: 0;
  border: none;
  background: none;
  color: var(--v19-text-2);
  cursor: pointer;
}
.v19-gen-head { text-align: center; margin-top: 24px; }
.v19-gen-title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 24px;             /* prototip: font:800 24px/1.25 */
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.5px;
  color: var(--v19-text);
}
.v19-gen-lead {
  margin: 9px 0 0;
  font-size: 13.5px;           /* prototip: font:500 13.5px */
  font-weight: 500;
  line-height: 1.35;
  color: var(--v19-text-3);
}

/* ------------------------------------------------------------------- KÜRE */
.v19-orb {
  position: relative;
  width: 186px;
  height: 186px;
  margin: 30px auto 0;
  display: grid;
  place-items: center;
}
.v19-orb-ring,
.v19-orb-ring2 {
  position: absolute;
  border-radius: 50%;
}
.v19-orb-ring {
  inset: 0;
  border: 1px solid rgba(108, 77, 246, 0.28);
  border-top-color: var(--v19-purple-2);
  animation: v19OrbSpin 3.4s linear infinite;
}
.v19-orb-ring2 {
  inset: 18px;
  border: 1px dashed rgba(108, 77, 246, 0.18);
  animation: v19OrbSpin 9s linear infinite reverse;
}
.v19-orb-core {
  width: 104px;
  height: 104px;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 28%, #8f79ff, #5a37e0 62%, #3a1fa8);
  box-shadow: 0 0 60px -8px rgba(108, 77, 246, 0.65);
  display: grid;
  place-items: center;
  font: 700 0.63rem ui-monospace, Menlo, monospace;
  letter-spacing: 0.6px;
  color: rgba(255, 255, 255, 0.62);
  animation: v19OrbPulse 2.6s ease-in-out infinite;
}
@keyframes v19OrbSpin { to { transform: rotate(360deg); } }
@keyframes v19OrbPulse {
  0%, 100% { transform: scale(1); opacity: 0.85; }
  50% { transform: scale(1.06); opacity: 1; }
}
/* Hareket azaltma tercihine saygı: küre döner ama nabız atmaz. */
@media (prefers-reduced-motion: reduce) {
  .v19-orb-ring, .v19-orb-ring2, .v19-orb-core { animation: none !important; }
}

/* ------------------------------------------------------- İLERLEME KARTI */
.v19-gen-card {
  margin-top: 32px;
  background: var(--v19-card);
  border: 1px solid var(--v19-line);
  border-radius: 18px;
  overflow: hidden;
  padding: 0;
}
.v19-gen-card-top { padding: 16px 18px 18px; }
.v19-gen-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.v19-gen-card-head strong {
  font-size: 13.5px;           /* prototip: font:600 13.5px */
  font-weight: 600;
  line-height: 1.35;
  color: var(--v19-text-2);
  min-width: 0;
}
.v19-gen-card .v19-progress-pct {
  margin-left: auto;
  font-size: 13.5px;           /* prototip: font:700 13.5px */
  font-weight: 700;
  line-height: 1.35;
  color: var(--v19-purple-2);
  font-variant-numeric: tabular-nums;
}
.v19-gen-card .mobile-generate-progress-track {
  margin-top: 12px;
  margin-bottom: 0;
  height: 8px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.07);
  overflow: hidden;
}
.v19-gen-card .mobile-generate-progress-fill {
  height: 100%;
  border-radius: 99px;
  background: linear-gradient(90deg, #8f79ff, var(--v19-purple));
  transition: width 0.25s linear;
}
/* Prototipte ara durum metni yok; ilerlemeyi adım listesi anlatır. */
.v19-gen-substatus { display: none; }
.v19-gen-card .v19-steplist {
  margin-top: 0;
  padding: 6px 18px 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  gap: 0;
}
.v19-gen-card .v19-steplist .mobile-progress-step {
  padding: 9px 0 !important;
  gap: 12px;
  font-size: 13.5px;           /* prototip: font:500/700 13.5px */
  line-height: 1.35;
}
.v19-gen-card .v19-steplist .mobile-progress-step::before {
  width: 18px;
  height: 18px;
  border-width: 1.5px;
  border-color: rgba(255, 255, 255, 0.18);
}
/* Prototipte tamamlanan adımın metni yeşil değil, sönük beyazdır; yeşil olan
   yalnızca noktadır (dc.html 619). Etkin adımın noktası mor halka. */
.v19-gen-card .v19-steplist .mobile-progress-step.done { color: var(--v19-text-2) !important; }
.v19-gen-card .v19-steplist .mobile-progress-step.done::before {
  border: none;
  background: #22c55e;
  box-shadow: inset 0 0 0 6px rgba(34, 197, 94, 0.25);
}
.v19-gen-card .v19-steplist .mobile-progress-step.active { color: var(--v19-text) !important; }
.v19-gen-card .v19-steplist .mobile-progress-step.active::before {
  border: 2px solid var(--v19-purple);
  background: none;
  box-shadow: inset 0 0 0 4px var(--v19-purple);
  animation: v19Shimmer 1.4s ease-in-out infinite;
}
@keyframes v19Shimmer {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 0.9; }
}
@media (prefers-reduced-motion: reduce) {
  .v19-gen-card .v19-steplist .mobile-progress-step.active::before { animation: none; }
}

/* ------------------------------------------------------------- DÜĞMELER */
/* Prototip: solda dar İptal Et, sağda geniş mor Arka planda devam et. */
.v19-progress-actions { margin-top: auto; padding-top: 26px; gap: 12px; }
.v19-gen-cancel,
.v19-gen-bg {
  min-height: 0;
  border-radius: 14px;
  font-size: 14px;             /* prototip: font:700 14px */
  font-weight: 700;
}
.v19-gen-cancel { flex: none !important; padding: 15px 20px; }
.v19-gen-bg { flex: 1 !important; padding: 15px 12px; }

/* Arka plana alınınca kart mini şeride iner (mevcut davranış korunur). */
.mobile-generate-progress.v19-minimized .v19-gen-head,
.mobile-generate-progress.v19-minimized .v19-orb,
.mobile-generate-progress.v19-minimized .v19-steplist,
.mobile-generate-progress.v19-minimized .v19-progress-actions { display: none; }
.mobile-generate-progress.v19-minimized .v19-gen-screen { min-height: 0; }
@media (max-width: 743px) {
  /* Şeride inince ana sayfa geri gelmeli. */
  body.v19-generating .mobile-generate-progress.v19-minimized ~ #v19-home-stack { display: block !important; }
  body.v19-generating .mobile-generate-progress.v19-minimized ~ #btn-mobile-generate { display: flex !important; }
}

/* ----------------------------------------------------------- SONUÇ KARTI */
/* Prototipte sonuç kendi ekranıdır (dc.html 157–202): üst başlık ve ana
   ekranın diğer blokları görünmez, içerik 34px yukarıdan başlar. */
@media (max-width: 743px) {
  body.v19-result .header { display: none !important; }
  body.v19-result #v19-greeting,
  body.v19-result #panel-soru-uret .mobile-create-panel,
  body.v19-result #btn-mobile-generate,
  body.v19-result #v19-generate-warning { display: none !important; }
  body.v19-result #v19-home-stack { margin-top: 0 !important; }
  body.v19-result #panel-soru-uret { padding-top: calc(34px + var(--sa-top)) !important; }
}
.v19-success {
  text-align: center;
  padding: 0;
}
.v19-success-emoji {
  font-size: 64px;             /* prototip: font-size:64px */
  line-height: 1;
  animation: v19Pop 0.5s cubic-bezier(0.2, 1.4, 0.4, 1) both;
}
@keyframes v19Pop {
  0% { transform: scale(0.7); opacity: 0; }
  60% { transform: scale(1.08); }
  100% { transform: scale(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .v19-success-emoji { animation: none; }
}
.v19-success-title {
  margin: 26px 0 0;
  font-family: var(--font-heading);
  font-size: 25px;             /* prototip: font:800 25px */
  font-weight: 800;
  letter-spacing: -0.5px;
  color: var(--v19-text);
}
.v19-success-lead {
  margin: 14px 0 0;
  font-size: 14px;             /* prototip: font:600 14px */
  font-weight: 600;
  color: var(--v19-text-2);
}
.v19-success-sep { color: #4a5170; margin: 0 6px; }

.v19-stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 11px;
  margin: 26px 0 0;
}
.v19-stat {
  padding: 17px 8px;
  border-radius: 16px;
  background: var(--v19-card);
  border: 1px solid var(--v19-line);
}
.v19-stat b {
  display: block;
  font-family: var(--font-heading);
  font-size: 22px;             /* prototip: font:800 22px */
  font-weight: 800;
  color: var(--v19-text);
  line-height: 1.1;
  overflow-wrap: break-word;
}
.v19-stat span {
  display: block;
  margin-top: 5px;
  font-size: 12px;             /* prototip: font:500 12px */
  font-weight: 500;
  color: var(--v19-text-3);
}

.v19-success-cta {
  width: 100%;
  margin-top: 20px;
  padding: 19px;
  border: none;
  border-radius: 17px;
  background: var(--v19-purple);
  color: #fff;
  font-family: var(--font-heading);
  font-size: 18px;             /* prototip: font:800 18px */
  font-weight: 800;
  cursor: pointer;
}
.v19-success-cta:hover { filter: brightness(1.08); }

.v19-success-secondary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 22px;
}
.v19-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  padding: 0;
  border: none;
  background: none;
  color: var(--v19-text-2);
  font-family: inherit;
  font-size: 11.5px;           /* prototip: font:600 11.5px */
  font-weight: 600;
  cursor: pointer;
}
.v19-tile:hover { opacity: 0.75; }
.v19-tile-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.v19-tile-icon svg { width: 21px; height: 21px; }
.v19-tile-word {
  background: rgba(58, 130, 246, 0.14);
  border-color: rgba(58, 130, 246, 0.28);
  color: #6fa2f7;
}
.v19-tile-pdf {
  background: rgba(239, 68, 68, 0.13);
  border-color: rgba(239, 68, 68, 0.26);
  color: #f87171;
}
@media (max-width: 380px) {
  .v19-tile-icon { width: 48px; height: 48px; border-radius: 14px; }
  .v19-tile { font-size: 0.66rem; }
}

/* ============================================================================
   AŞAMA 4 — DİĞER EKRANLAR (Geçmiş · MEB Senaryo · Değerlendirme · Ayarlar)
   Kaynak: SoruStudio.dc.html satır 205–446 + uploads/05-meb-senaryo.png,
           uploads/09-degerlendirme.png, uploads/11-profil-premium.png
   Yalnızca görünüm; panel içerikleri, ID'ler ve akışlar korunur.
   ========================================================================== */

/* ------------------------------------------------------- ORTAK PANEL BAŞLIĞI */
@media (max-width: 743px) {
  .panel-title,
  #panel-gecmis h2,
  #panel-ayarlar h2 {
    font-family: var(--font-heading);
    font-size: 1.44rem;          /* prototip: 23px/800 */
    font-weight: 800;
    letter-spacing: -0.5px;
    color: var(--v19-text);
  }
  /* Geçmiş ve Ayarlar'da uzun açıklama paragrafı kaydırmayı büyütüyordu;
     prototipte yok. MEB ve Yardım panellerindeki metinlere DOKUNULMAZ
     (resmî kaynak / sorumluluk bilgisi orada yaşıyor). */
  #panel-gecmis p.panel-desc,
  #v19-settings-list > p.panel-desc { display: none; }
}

/* ------------------------------------------------------------ GEÇMİŞ EKRANI */
.v19-group-title {
  font-size: 0.78rem;            /* prototip: 12.5px/600 */
  font-weight: 600;
  letter-spacing: 0.2px;
  text-transform: none;
  color: var(--v19-text-3);
  margin: 24px 0 11px;
}
.v19-history-toolbar { gap: 11px; margin-bottom: 4px; }
.v19-search {
  border-radius: 13px;
  background: var(--v19-card);
  border-color: rgba(255, 255, 255, 0.08);
  font-size: 0.81rem;
}
.v19-search::placeholder { color: var(--v19-text-4); }

@media (max-width: 743px) {
  .history-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: var(--v19-card) !important;
    border: 1px solid var(--v19-line) !important;
    border-radius: 17px !important;
    padding: 16px !important;
    box-shadow: none !important;
  }
  /* Prototipte kartın ilk satırı ders/sınıf; tarih ve zorluk onun altında. */
  .history-card .history-card-course {
    order: -1;
    font-size: 0.91rem;          /* prototip: 14.5px/700 */
    font-weight: 700;
    color: var(--v19-text);
  }
  .history-card .history-card-top { order: 0; }
  .history-card .history-card-date {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--v19-text-4);
  }
  .history-card .history-card-topics,
  .history-card .history-card-count,
  .history-card .v19-history-meta {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--v19-text-3);
  }
  .history-card .history-card-footer {
    border-top: none !important;
    padding-top: 6px !important;
  }
  .history-card .history-card-actions { gap: 9px; }
  .history-card .history-card-actions .v19-btn,
  .history-card .history-card-actions .btn-load-history {
    min-height: 40px;
    border-radius: 11px;
    font-size: 0.78rem;
  }
}

/* -------------------------------------------------------- MEB SENARYO EKRANI */
/* Prototip: mavi tonlu, katlanabilir bilgi şeridi. */
.v19-disclosure-btn {
  border-radius: 14px;
  background: rgba(58, 130, 246, 0.08);
  border-color: rgba(58, 130, 246, 0.2);
  color: #a9b6d0;
  font-size: 0.78rem;
  font-weight: 500;
  line-height: 1.5;
}
.v19-disclosure-btn > svg:first-child { color: #6fa2f7; }
.v19-disclosure-btn:hover { background: rgba(58, 130, 246, 0.13); }

@media (max-width: 743px) {
  #panel-kaynaklar .scenario-card,
  #panel-kaynaklar .card {
    background: var(--v19-card) !important;
    border: 1px solid var(--v19-line) !important;
    border-radius: 18px !important;
    box-shadow: none !important;
  }
  /* Uzun tanıtım paragrafı üstte yer kaplıyordu; resmî metin katlanabilir
     şeridin İÇİNDE duruyor, burada kaldırılan yalnızca pazarlama cümlesi. */
  #panel-kaynaklar > div:first-child > p { display: none !important; }
  /* h2 satır içi stil taşıyor; geçersiz kılmak için !important şart. */
  #panel-kaynaklar > div:first-child > h2 {
    font-family: var(--font-heading) !important;
    font-size: 1.44rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.5px !important;
  }

  /* 5 adımlı süreç şeridi: düğümler satır içi stille sabit genişlikte değil,
     içeriğe göre büyüyordu. Telefonda "1. Analiz" + "Tamamlandı" etiketleri
     komşu düğümün üstüne taşıyor, 5. düğüm de şeridin dışına çıkıyordu.
     Düğümler eşit paya bölünür, durum metni ekrana sığmadığında düşer;
     ilerleme zaten yeşil daire ve çizgiyle okunuyor. */
  #meb-stepper-container { padding: 12px 6px !important; }
  #meb-stepper-container .meb-step-node {
    flex: 1 1 0;
    min-width: 0;
  }
  #meb-stepper-container .meb-step-node > span {
    font-size: 10.5px !important;
    line-height: 1.25;
    overflow-wrap: break-word;
    hyphens: none;
  }
}
@media (max-width: 480px) {
  #meb-stepper-container .meb-step-node > span[id^="meb-step-status-"] {
    display: none !important;
  }
}

/* --------------------------------------------------------- DEĞERLENDİRME */
@media (max-width: 743px) {
  #panel-degerlendirme .card {
    background: var(--v19-card) !important;
    border: 1px solid var(--v19-line) !important;
    border-radius: 18px !important;
    box-shadow: none !important;
  }
  #panel-degerlendirme h2 {
    font-family: var(--font-heading);
    font-size: 1.44rem;
    font-weight: 800;
    letter-spacing: -0.5px;
  }
}
/* Prototipteki hap biçimli sekmeler (Genel Bakış · Kazanımlar · Öğrenciler). */
#panel-degerlendirme .tab-btn,
#panel-degerlendirme .eval-tab {
  border-radius: 999px !important;
  min-height: 40px;
  padding: 9px 15px !important;
  font-size: 0.78rem;
  font-weight: 600;
  border: 1px solid rgba(255, 255, 255, 0.11) !important;
  background: transparent !important;
  color: var(--v19-text-3) !important;
}
#panel-degerlendirme .tab-btn.active,
#panel-degerlendirme .eval-tab.active {
  background: var(--v19-purple) !important;
  border-color: var(--v19-purple) !important;
  color: #fff !important;
}

/* ------------------------------------------------------------- AYARLAR */
/* Prototip profil satırları: 16px dikey, ikon + başlık + sağ ok. */
.v19-settings-group {
  border-radius: 18px;
  background: var(--v19-card);
}
.v19-settings-row { min-height: 62px; padding: 14px 16px; }
.v19-settings-row:hover { background: rgba(255, 255, 255, 0.03); }
.v19-settings-text b { font-size: 0.91rem; font-weight: 600; }
.v19-settings-text small { font-size: 0.75rem; color: var(--v19-text-4); }
.v19-settings-group-title {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.2px;
  text-transform: none;
  color: var(--v19-text-3);
  margin: 22px 0 10px;
}
.v19-settings-icon {
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.09);
  color: #b6a9ff;
}

/* --------------------------------------------------------- AÇILIR MENÜ */
.v19-menu {
  background: var(--v19-card);
  border-color: rgba(255, 255, 255, 0.09);
  border-radius: 14px;
}
.v19-menu button { font-size: 0.81rem; }

/* ============================================================================
   SORU AYARLARI ÇEKMECESİ (prototip "settings" ekranı, dc.html 476–517)
   Üstten 44px boşluklu tam sayfa sheet; içinde "Temel Ayarlar" kartı ve iki
   gezinme satırı. Gerçek kontroller alt sayfaya ödünç verilir (v19.js).
   ========================================================================== */
.v19-qs { display: none; }

@media (max-width: 743px) {
  .v19-qs { display: block; }

  /* Çekmecenin kendisi: prototip ölçüleri. */
  body.mobile-settings-open #panel-soru-uret .input-column {
    top: calc(44px + var(--sa-top)) !important;
    bottom: 0 !important;           /* prototipte sheet alt menünün üstünü örter */
    height: auto !important;
    max-height: none !important;
    border-radius: 26px 26px 0 0 !important;
    background: #0a0e18 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.09) !important;
    padding: 0 !important;
    gap: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .mobile-settings-drawer-head { flex: none; }
  /* Gövde kaydırılır, alt düğme sabit kalır (prototip: body flex:1). */
  .v19-qs { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .v19-drawer-footer { flex: none; position: static !important; }
  .mobile-settings-drawer-head {
    padding: 22px 22px 14px !important;
    border-bottom: none !important;
    background: transparent !important;
  }
  .mobile-settings-drawer-head h4 {
    font-family: var(--font-heading);
    font-size: 21px !important;    /* prototip: font:800 21px */
    font-weight: 800 !important;
    letter-spacing: -0.4px !important;
    color: var(--v19-text) !important;
  }
  .mobile-settings-close-btn {
    background: none !important;
    border: none !important;
    color: var(--v19-text) !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
  }
  .mobile-settings-close-btn svg { width: 18px !important; height: 18px !important; }

  .v19-qs { padding: 0 22px 8px; }

  /* Çekmecedeki özgün kartlar gizlenir; alt sayfaya ödünç verildiklerinde
     (yani çekmecenin dışına taşındıklarında) yeniden görünür olurlar. */
  #mobile-settings-drawer > .card { display: none !important; }
  /* Panel kısayolları prototipte "Daha Fazla" çekmecesinde; burada yok. */
  #mobile-settings-drawer .mobile-drawer-links,
  #mobile-settings-drawer #v19-advanced-toggle,
  #mobile-settings-drawer #v19-advanced-body { display: none !important; }

  /* Alt sabit alan: prototipte tek, tam genişlikte düğme. */
  .v19-drawer-footer {
    margin: 0 !important;
    padding: 14px 22px calc(26px + var(--sa-bottom)) !important;
    background: #0a0e18 !important;
    border-top: none !important;
    display: block !important;
  }
  .v19-drawer-footer-info { display: none !important; }
}

/* Y-12: "Kaydet" ve "Oluştur" yan yana. Oluştur baskın (mor) kalır ki
   asıl eylem hangisiyse gözle ayırt edilebilsin. */
.v19-drawer-actions {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.v19-drawer-cta {
  display: block;
  width: 100%;
  padding: 17px;
  border: none;
  border-radius: 15px;
  background: var(--v19-purple);
  color: #fff;
  font-family: var(--font-heading);
  font-size: 15.5px;             /* prototip: font:700 15.5px */
  font-weight: 700;
  cursor: pointer;
}
.v19-drawer-cta:hover { filter: brightness(1.08); }
/* İkincil düğme aynı yükseklik/tipografiyi paylaşır, yalnız zemini yok.
   Daha dar tutulur: "Oluştur" görsel olarak baskın kalmalı. */
.v19-drawer-cta-secondary {
  flex: 0 0 38%;
  background: transparent;
  border: 1.5px solid rgba(255, 255, 255, 0.22);
  color: rgba(255, 255, 255, 0.88);
}
.v19-drawer-cta-secondary:hover {
  filter: none;
  background: rgba(255, 255, 255, 0.07);
}

.v19-qs-card {
  background: var(--v19-card);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 18px;
  padding: 16px;
}
.v19-qs-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;               /* prototip: font:700 15px */
  font-weight: 700;
  color: var(--v19-text-2);
}
.v19-qs-card-head .v19-qs-chev { color: #7b839a; }
.v19-qs-fields {
  display: flex;
  flex-direction: column;
  gap: 11px;
  margin-top: 14px;
}
.v19-qs-field {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  text-align: left;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 13px;
  padding: 12px 14px;
  cursor: pointer;
  font-family: inherit;
  color: var(--v19-text);
}
.v19-qs-field:hover { background: rgba(255, 255, 255, 0.07); }
.v19-qs-col {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.v19-qs-label {
  font-size: 11px;               /* prototip: font:500 11px */
  font-weight: 500;
  line-height: 1.3;
  color: #7b839a;
}
.v19-qs-value {
  font-size: 15px;               /* prototip: font:700 15px */
  font-weight: 700;
  line-height: 1.4;
  color: var(--v19-text);
  overflow-wrap: break-word;
}
.v19-qs-field .v19-qs-chev { flex: none; color: var(--v19-text-3); margin-bottom: 6px; }

.v19-qs-row {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  margin-top: 12px;
  padding: 17px;
  background: var(--v19-card);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 16px;
  cursor: pointer;
  font-family: inherit;
  color: var(--v19-text);
}
.v19-qs-row + .v19-qs-row { margin-top: 11px; }
.v19-qs-row:hover { background: #121a2a; }
.v19-qs-emoji { font-size: 15px; line-height: 1; }
.v19-qs-row-label {
  flex: 1;
  text-align: left;
  font-size: 14.5px;             /* prototip: font:700 14.5px */
  font-weight: 700;
}
.v19-qs-chev-r { flex: none; color: #5b6480; }

/* ============================================================================
   KAZANIM SEÇİMİ EKRANI
   Kaynak: dc.html 236–285. Ayar çekmecesindeki gerçek konu/kazanım kartı bu
   ekrana taşınır; altta yapışkan sayaç şeridi ve "Devam Et" durur.
   ========================================================================== */
.v19-outcomes-host { display: none; }
.v19-outcomes-bar { display: none; }

@media (max-width: 743px) {
  .v19-outcomes-host { display: block; }

  /* Kart bu ekrana taşındığında kutu görünümünü bırakır: prototipte arama ve
     ünite listesi doğrudan ekranda durur. */
  .v19-outcomes-host > .card {
    display: block !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 12px 0 0 !important;
  }
  .v19-outcomes-host > .card > .card-title-main { display: none !important; }
  .v19-outcomes-host .topic-list {
    max-height: none !important;
    overflow: visible !important;
  }

  /* Kazanım ekranı açıkken panelin kendi referans listesi görünmez:
     taşınan kartın yaşadığı kap dışındaki her şey gizlenir. */
  body.v19-outcomes-open #panel-kazanimlar > *:not(.v19-back-head):not(.v19-outcomes-host):not(.v19-outcomes-bar) {
    display: none !important;
  }
  body.v19-outcomes-open #panel-kazanimlar { padding-bottom: 150px !important; }

  /* Prototipte MEB Senaryo ve Kazanım Seçimi alt ekrandır; alt menü yoktur,
     geri okuyla çıkılır (dc.html 579: showTabs yalnızca dört ekranda açık). */
  body[data-v19-panel="panel-kaynaklar"] .sidebar,
  body[data-v19-panel="panel-kazanimlar"] .sidebar { display: none !important; }

  /* Mobilde panelin yan dolgusu 22px; bar kenardan kenara uzanmalı. */
  #panel-kaynaklar .v19-sticky-bar { margin: 16px -22px 0; padding-left: 22px; padding-right: 22px; }

  /* Yapışkan alt şerit (dc.html 280–283). */
  body.v19-outcomes-open .v19-outcomes-bar {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 21;
    padding: 16px 22px calc(22px + var(--sa-bottom));
    background: linear-gradient(to top, var(--v19-bg) 60%, rgba(8, 11, 18, 0));
  }
}

.v19-outcomes-count {
  text-align: center;
  font-size: 12.5px;           /* prototip: font:600 12.5px */
  font-weight: 600;
  color: var(--v19-text-3);
  background: rgba(255, 255, 255, 0.05);
  border-radius: 99px;
  padding: 9px;
  margin-bottom: 12px;
}
.v19-outcomes-cta {
  display: block;
  width: 100%;
  padding: 17px;
  border: none;
  border-radius: 15px;
  background: var(--v19-purple);
  color: #fff;
  font-family: var(--font-heading);
  font-size: 15.5px;           /* prototip: font:700 15.5px */
  font-weight: 700;
  cursor: pointer;
}
.v19-outcomes-cta:hover { filter: brightness(1.08); }

/* ============================================================================
   DEĞERLENDİRME ÖZETİ
   Kaynak: dc.html 365–406. Sınıf satırı, sekmeler, ortalama kartı, kazanım
   çubukları, "Tüm Raporu Görüntüle". Veriler uygulamanın kendi kayıtlarından.
   ========================================================================== */
.v19-eval { display: none; }

@media (max-width: 743px) { .v19-eval { display: block; } }

.v19-eval-class {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--v19-card);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 15px 16px;
}
.v19-eval-class-name {
  font-size: 15px;               /* prototip: font:700 15px */
  font-weight: 700;
  color: var(--v19-text);
}
.v19-eval-class-meta {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--v19-text-3);
}

.v19-eval-tabs { display: flex; gap: 9px; margin-top: 16px; flex-wrap: wrap; }
.v19-eval-tab {
  padding: 9px 15px;
  border-radius: 99px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  background: none;
  color: var(--v19-text-3);
  font-family: inherit;
  font-size: 12.5px;             /* prototip: font:600 12.5px */
  font-weight: 600;
  cursor: pointer;
}
.v19-eval-tab.is-active {
  background: var(--v19-purple);
  border-color: var(--v19-purple);
  color: #fff;
}

.v19-eval-card {
  margin-top: 18px;
  background: var(--v19-card);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 18px;
  padding: 18px;
}
.v19-eval-card + .v19-eval-card { margin-top: 14px; }
.v19-eval-card-title {
  font-size: 14.5px;             /* prototip: font:700 14.5px */
  font-weight: 700;
  color: var(--v19-text);
}
.v19-eval-avg-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
}
.v19-eval-avg {
  font-family: var(--font-heading);
  font-size: 40px;               /* prototip: font:800 40px */
  font-weight: 800;
  letter-spacing: -1.5px;
  line-height: 1.05;
  color: var(--v19-text);
}
.v19-eval-trend {
  font-size: 12.5px;             /* prototip: font:700 12.5px */
  font-weight: 700;
  color: #34d399;
  background: rgba(52, 211, 153, 0.12);
  border-radius: 9px;
  padding: 6px 10px;
}
.v19-eval-trend.is-down {
  color: #f87171;
  background: rgba(248, 113, 113, 0.12);
}
.v19-eval-note {
  margin-top: 10px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--v19-text-4);
}

.v19-eval-bars { margin-top: 16px; display: flex; flex-direction: column; gap: 16px; }
.v19-eval-bar-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.v19-eval-bar-code {
  font-size: 13.5px;             /* prototip: font:700 13.5px */
  font-weight: 700;
  color: #d3d8e6;
  min-width: 0;
  overflow-wrap: anywhere;
}
.v19-eval-bar-pct { font-size: 13.5px; font-weight: 700; flex: none; }
.v19-eval-bar-track {
  margin-top: 9px;
  height: 8px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.07);
  overflow: hidden;
}
.v19-eval-bar-fill { height: 100%; border-radius: 99px; }

.v19-eval-students { margin-top: 14px; display: flex; flex-direction: column; }
.v19-eval-student {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.v19-eval-student:last-child { border-bottom: none; }
.v19-eval-student-name { flex: 1; font-size: 13.5px; font-weight: 700; color: var(--v19-text); min-width: 0; }
.v19-eval-student-meta { font-size: 12px; font-weight: 500; color: var(--v19-text-3); }
.v19-eval-student-score { font-size: 15px; font-weight: 800; flex: none; }
.v19-eval-empty { margin: 0; font-size: 12.5px; color: var(--v19-text-3); }

.v19-eval-cta {
  display: block;
  width: 100%;
  margin-top: 20px;
  padding: 18px;
  border: none;
  border-radius: 16px;
  background: var(--v19-purple);
  color: #fff;
  font-family: var(--font-heading);
  font-size: 16px;               /* prototip: font:700 16px */
  font-weight: 700;
  cursor: pointer;
}
.v19-eval-cta:hover { filter: brightness(1.08); }

/* ============================================================================
   PROFİL & PREMIUM ("Daha Fazla" çekmecesi)
   Kaynak: dc.html 408–446. Avatar, altın üyelik kartı, jeton kartı ve
   çizgiyle ayrılmış panel satırları.
   ========================================================================== */
.v19-profile { display: none; }

@media (max-width: 743px) {
  .v19-profile { display: block; padding: 12px 22px calc(26px + var(--sa-bottom)); }
  /* Eski çekmece başlığı ve kısayol ızgarası yerini profil ekranına bırakır. */
  .mobile-more-content .mobile-more-header,
  .mobile-more-content .mobile-more-links { display: none !important; }
  /* Prototipte Profil kendi tam ekranıdır; çekmece de üstten 44px boşlukla
     ekranın dibine kadar uzanır ve içerik kendi içinde kayar. */
  .mobile-more-content {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(44px + var(--sa-top)) !important;
    bottom: 0 !important;
    max-height: none !important;
    height: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    background: var(--v19-bg) !important;
    border-radius: 26px 26px 0 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.09) !important;
    padding: 0 !important;
  }
}

.v19-profile-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.v19-profile-close {
  padding: 0;
  border: none;
  background: none;
  color: var(--v19-text);
  display: grid;
  place-items: center;
  cursor: pointer;
}

.v19-profile-user {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-top: 20px;
}
.v19-avatar {
  flex: none;
  width: 66px;
  height: 66px;
  border-radius: 50%;
  background: linear-gradient(150deg, #8f79ff, #5a37e0);
  box-shadow: 0 0 0 2px rgba(245, 183, 10, 0.55);
  display: grid;
  place-items: center;
  font-family: var(--font-heading);
  font-size: 26px;             /* prototip: font:800 26px */
  font-weight: 800;
  color: var(--v19-text);
}
.v19-profile-id {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.v19-profile-name {
  font-size: 16px;             /* prototip: font:700 16px */
  font-weight: 700;
  line-height: 1.35;
  color: var(--v19-text);
}
.v19-profile-sub {
  font-size: 13px;             /* prototip: font:500 13px */
  font-weight: 500;
  line-height: 1.35;
  color: var(--v19-text-3);
  overflow-wrap: anywhere;
}

.v19-premium-card {
  display: block;
  width: 100%;
  text-align: left;
  margin-top: 22px;
  padding: 18px;
  border: 1px solid rgba(245, 183, 10, 0.32);
  border-radius: 18px;
  background: linear-gradient(140deg, rgba(245, 183, 10, 0.16), rgba(245, 183, 10, 0.05));
  font-family: inherit;
  cursor: pointer;
}
.v19-premium-top { display: flex; align-items: center; gap: 10px; }
.v19-premium-crown { font-size: 22px; line-height: 1; }
.v19-premium-title {
  font-family: var(--font-heading);
  font-size: 18px;             /* prototip: font:800 18px */
  font-weight: 800;
  color: #f5b70a;
}
.v19-premium-line {
  display: block;
  margin-top: 13px;
  font-size: 13.5px;           /* prototip: font:600 13.5px */
  font-weight: 600;
  color: #e2dcc6;
}
.v19-premium-note {
  display: block;
  margin-top: 6px;
  font-size: 13px;             /* prototip: font:500 13px */
  font-weight: 500;
  color: #b0a888;
}

.v19-tokens-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 14px;
  padding: 18px;
  background: var(--v19-card);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 18px;
  font-family: inherit;
  cursor: pointer;
}
.v19-tokens-col { display: flex; flex-direction: column; gap: 6px; text-align: left; }
.v19-tokens-label {
  font-size: 13px;             /* prototip: font:500 13px */
  font-weight: 500;
  color: var(--v19-text-3);
}
.v19-tokens-value {
  font-family: var(--font-heading);
  font-size: 30px;             /* prototip: font:800 30px */
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1.1;
  color: var(--v19-text);
}
.v19-tokens-bolt { font-size: 30px; line-height: 1; }

.v19-profile-group-title {
  margin: 22px 0 2px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.2px;
  color: #7b839a;
}
.v19-profile-rows { margin-top: 4px; display: flex; flex-direction: column; }
.v19-profile-row {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 16px 2px;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  background: none;
  font-family: inherit;
  color: var(--v19-text);
  cursor: pointer;
}
.v19-profile-row:hover { background: rgba(255, 255, 255, 0.03); }
.v19-profile-icon { width: 20px; text-align: center; font-size: 15px; }
.v19-profile-label {
  flex: 1;
  text-align: left;
  font-size: 14.5px;           /* prototip: font:600 14.5px */
  font-weight: 600;
}

/* ============================================================================
   GERİ OKLU EKRAN BAŞLIĞI + MEB SENARYO EKRANI
   Kaynak: dc.html 205–233 (MEB Senaryo), 236–243 (Kazanım Seçimi başlığı)
   ========================================================================== */
.v19-back-head { display: none; }

@media (max-width: 743px) {
  .v19-back-head {
    display: flex;
    align-items: center;
    gap: 14px;
    height: 52px;
  }
  .v19-back-btn {
    display: grid;
    place-items: center;
    padding: 0;
    border: none;
    background: none;
    color: var(--v19-text);
    cursor: pointer;
  }
  .v19-back-title {
    font-family: var(--font-heading);
    font-size: 18px;             /* prototip: font:700 18px */
    font-weight: 700;
    letter-spacing: -0.2px;
    color: var(--v19-text);
  }

  /* Uygulamanın uzun başlıkları yerini prototipin geri oklu başlığına bırakır. */
  #panel-kaynaklar > div[style*="text-align: center"] { display: none !important; }
  #panel-kazanimlar > h2,
  #panel-kazanimlar > h2 + p { display: none !important; }

  /* Kaynak/sorumluluk kutusu: prototipin mavi bilgi şeridi. */
  #panel-kaynaklar .meb-source-notice {
    margin-top: 14px !important;
    background: rgba(58, 130, 246, 0.08) !important;
    border: 1px solid rgba(58, 130, 246, 0.2) !important;
    border-radius: 14px !important;
    padding: 14px 16px !important;
  }
  #panel-kaynaklar .meb-source-notice p {
    font-size: 12.5px !important;
    line-height: 1.5 !important;
    color: #a9b6d0 !important;
  }

  /* Ders / Sınıf / Dönem: prototipte kart değil, çizgiyle ayrılmış satırlar
     (etiket üstte küçük, değer altta kalın, sağda ok). */
  #panel-kaynaklar .scenario-card {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin-top: 8px !important;
  }
  #panel-kaynaklar .scenario-card > div:first-child { display: none !important; }
  #panel-kaynaklar .scenario-card .form-label {
    display: block !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    color: #7b839a !important;
    margin-bottom: 6px !important;
  }
  #panel-kaynaklar .scenario-card select.custom-select {
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 24px 0 2px !important;
    font-size: 15.5px !important;   /* prototip: font:700 15.5px */
    font-weight: 700 !important;
    background-position: right 2px center !important;
    height: auto !important;
    min-height: 0 !important;
  }
  #panel-kaynaklar .scenario-card select.custom-select + *,
  #panel-kaynaklar .scenario-card > div > div {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  #panel-kaynaklar .scenario-card > div > div {
    padding: 15px 0 !important;
  }
  /* Y-24 (09.09.2026): yukarıdaki kural "Ders Seçin / Sınıf Seviyesi" alan
     satırları için yazıldı — onlar çerçevesiz, altlarında ince çizgi var, o
     yüzden yatay dolgu sıfırlanıyor. Ama aynı seçici MEB KAZANIM satırlarını
     da yakalıyor; onların kendi çerçevesi ve 8px köşesi var, dolgu sıfırlanınca
     sağdaki "Soru" etiketi çerçeveye yapışıyordu (iPhone'da ölçüldü: metin
     412pt'de bitiyor, çerçeve 413.7pt'de — aynı işaretleme Android'de de var).
     Sıfırlama kaldırılmıyor, kazanım satırına yatay dolgu GERİ VERİLİYOR:
     `:has()` desteklenmezse davranış bugünküyle birebir aynı kalır, kötüye
     gitmez. Satır, `.meb-outcome-checkbox` içeren label'ı doğrudan çocuk
     olarak taşıdığı için derinlikten bağımsız hedefleniyor. */
  #panel-kaynaklar .scenario-card div:has(> label > .meb-outcome-checkbox) {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* ============================================================================
   ORTAK PROTOTİP YÜZEYİ
   ----------------------------------------------------------------------------
   Prototipin bütün ekranlarında aynı üç şey tekrar eder: 23px/800 ekran
   başlığı, #0e1421 zeminli 18px köşeli kart, ve 13px/500 metinli 13px köşeli
   giriş alanı. Bunları tek yerde tanımlayınca MEB, Kazanım, Değerlendirme,
   Konularım, Ayarlar ve Yardım ekranları da prototipin diline oturur.
   ========================================================================== */
@media (max-width: 743px) {
  /* Ekran başlığı ve açıklaması (dc.html 290–291, 325, 410). */
  .panel-title {
    font-family: var(--font-heading);
    font-size: 23px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.5px !important;
    color: var(--v19-text) !important;
    margin-bottom: 0 !important;
  }
  .panel-desc {
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    color: var(--v19-text-3) !important;
    margin: 7px 0 0 !important;
  }

  /* Kart: prototipte düz #0e1421, ince çizgi, 18px köşe, gölge yok. */
  .card,
  .settings-card {
    background: var(--v19-card) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    border-radius: 18px !important;
    box-shadow: none !important;
    padding: 18px !important;
  }

  /* Kart içi başlık: prototipte 14.5px/700, altında çizgi yok. */
  .card-title-main {
    font-size: 14.5px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.2px !important;
    color: var(--v19-text) !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 14px !important;
  }

  /* Giriş alanları: prototipte kart zeminli, 13px köşeli, 12/14 dolgulu. */
  .custom-select,
  .search-input,
  .input-text-styled,
  .counter-control,
  .segmented-control {
    background-color: var(--v19-card) !important;
    background-image: none;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 13px !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: var(--v19-text) !important;
  }
  .custom-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 8' fill='none' stroke='%238b93a7' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M1 1.5 6.5 6.5 12 1.5'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 13px 8px !important;
    padding: 12px 34px 12px 14px !important;
  }
  .search-input { padding: 12px 14px 12px 40px !important; }

  /* Ana eylem düğmesi: prototipte düz mor, 15px köşe, 17px dolgu. */
  .btn-primary {
    background: var(--v19-purple) !important;
    border: none !important;
    border-radius: 15px !important;
    box-shadow: none !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
    color: #fff !important;
  }
  .btn-secondary {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 13px !important;
    box-shadow: none !important;
    color: var(--v19-text-2) !important;
  }
}

/* ============================================================================
   AŞAMA 5 — SORU KARTI VE TASLAK
   Kaynak: SoruStudio.dc.html satır 287–320 (Sınav Editörü) + uploads/07-sinav-editoru.png
   Taslak sistemi (sorustudio_exam_draft_v1) davranış olarak hazırdı; burada
   yalnızca soru kartı prototip ölçülerine getiriliyor.
   ========================================================================== */

@media (max-width: 743px) {
  .question-card {
    background: var(--v19-card) !important;
    border: 1px solid var(--v19-line) !important;
    border-radius: 17px !important;
    padding: 16px !important;
    box-shadow: none !important;
  }
  /* Kart üstündeki mor degrade şerit/parıltı prototipte yok. */
  .question-card::before,
  .question-card::after { display: none !important; }

  /* Prototipte soru kartları düz bir dikey listedir (dc.html 293–313):
     üst üste binen "akış" yığını, ölçek/saydamlık farkı ve ilk kartın
     degrade çerçevesi yok. Kartlar arası boşluk 13px. */
  .questions-layout.mobile-feed .question-card,
  .questions-layout.mobile-feed .question-card:first-child {
    transform: none !important;
    opacity: 1 !important;
    margin-bottom: 13px !important;
    pointer-events: auto !important;
    background: var(--v19-card) !important;
    border: 1px solid var(--v19-line) !important;
    box-shadow: none !important;
  }

  /* Çözüm düğmesi de prototipin sakin yüzeyine iner: degrade ve parıltı yok. */
  .question-toggle-solution-btn {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 11px !important;
    box-shadow: none !important;
    padding: 9px 13px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: var(--v19-text-2) !important;
  }

  /* Prototipte soru metni çıplak paragraftır; kutu içinde değildir. */
  .question-card .question-text {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 10px 0 0 !important;
    font-size: 13px !important;      /* prototip: font:500 13px/1.55 */
    font-weight: 500 !important;
    line-height: 1.55 !important;
    color: #a3abbf !important;
  }
}

/* Başlıktaki tek dokunuşluk kilit düğmesi (prototip: 28x28, kilitliyken altın). */
.v19-lock-toggle {
  margin-left: 8px;
  width: 34px;
  height: 34px;
  min-width: 34px;
  display: inline-grid;
  place-items: center;
  border: none;
  border-radius: 9px;
  background: transparent;
  color: var(--v19-text-4);
  cursor: pointer;
}
.v19-lock-toggle svg { width: 15px; height: 15px; }
.v19-lock-toggle:hover { background: rgba(255, 255, 255, 0.06); }
.v19-lock-toggle.is-on {
  color: var(--v19-warn);
  background: rgba(245, 183, 10, 0.13);
}

/* İşlem satırı: prototipteki hap düğmeler + sağa yaslı ⋮ */
.v19-q-actions {
  gap: 9px;
  margin-top: 15px;
  padding-top: 0;
  border-top: none;
}
.v19-q-actions .v19-btn {
  min-height: 40px;
  padding: 9px 13px;
  border-radius: 11px;
  font-size: 12.5px;           /* prototip: font:600 12.5px */
  font-weight: 600;
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.09);
  color: #d3d8e6;
}
.v19-q-actions .v19-btn:hover { background: rgba(255, 255, 255, 0.1); }
.v19-q-actions .v19-menu-anchor { margin-left: auto; }
.v19-q-actions .v19-btn-icon {
  flex: 0 0 36px !important;
  width: 36px;
  min-height: 36px;
  padding: 0 !important;
  border-radius: 11px;
}
.question-card.is-locked {
  border-color: rgba(245, 183, 10, 0.45) !important;
}
.v19-lock-badge {
  color: var(--v19-warn);
  background: rgba(245, 183, 10, 0.12);
  border-color: rgba(245, 183, 10, 0.3);
}

/* Taslak sorusu alt sayfası prototipteki gibi sade dursun. */
#v19-sheet .v19-card-inline b { font-size: 15px; font-weight: 700; }

/* --------------------------------------------------- SATIR İKONLARI (LUCIDE)
   Profil sayfasının ve Soru Ayarları listesinin satır ikonları 01.09.2026'da
   renkli emojiden (📋 📁 ⚙️ ❓ 🧩) Lucide çizgi ikonlarına geçti: aynı
   uygulamada Ayarlar paneli çizgi ikon, bu iki liste emoji kullanıyordu ve
   kırmızı ❓ göze batıyordu. Sarmalayıcı span'lar korundu; ölçü SVG'ye
   burada verilir (emojide ölçüyü font-size veriyordu, SVG'de vermiyor). */
.v19-profile-icon svg {
  width: 18px;
  height: 18px;
  display: block;
  margin: 0 auto;
  color: var(--v19-text-2);
}
.v19-qs-emoji svg {
  width: 17px;
  height: 17px;
  display: block;
  color: var(--v19-text-2);
}

/* ------------------------------------------------------------ PASİF DÜĞMELER
   Değerlendirme'deki "Cevap Girişine Başla" pasifken de dolu mor duruyordu
   (yalnızca inline opacity 0.5 vardı); koyu zeminde bu hâlâ aktif bir düğme
   gibi okunuyordu. Pasif düğme artık dolgusunu tamamen bırakır. */
.btn-primary:disabled,
.btn-primary[disabled] {
  background: var(--v19-card-2) !important;
  color: var(--v19-text-3) !important;
  border: 1px solid var(--v19-line) !important;
  box-shadow: none !important;
  cursor: not-allowed;
}

/* ------------------------------------------- REKLAM: BANNER + FİLİGRAN (K-149) */
/* Banner yerel bir katmandır, ekranın en altına (sistem çubuğunun üstüne)
   oturur. Görünürken alt menü banner'ın ÜSTÜNE kalkar ve sistem çubuğu boşluğunu
   artık banner kapladığı için menünün iç alt boşluğu sıfırlanır. Banner'ı
   menünün üstüne taşımak mümkün değil: eklenti Android 15+'ta kendi kenar
   boşluğunu sistem çubuğu boşluğuyla eziyor. */
@media (max-width: 743px) {
  body.reklam-banner-acik .sidebar {
    bottom: calc(var(--reklam-banner-h, 50px) + var(--sa-bottom)) !important;
    height: 96px !important;
    padding-bottom: 0 !important;
  }
  /* İçeriğin sonu banner + menünün altında kalmasın. */
  body.reklam-banner-acik .panel.active::after {
    content: "";
    display: block;
    height: var(--reklam-banner-h, 50px);
  }
}

.filigran-secim-backdrop {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: rgba(0, 0, 0, 0.55);
  padding: 16px;
  padding-bottom: calc(16px + var(--sa-bottom));
}
.filigran-secim-kutu {
  width: 100%;
  max-width: 420px;
  background: var(--bg-card);
  color: var(--text-dark);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  padding: 18px 16px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: var(--shadow-lg);
}
.filigran-secim-kutu h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
}
.filigran-secim-kutu p {
  margin: 0 0 4px;
  font-size: 0.85rem;
  line-height: 1.45;
  color: var(--text-muted);
}
.filigran-secim-dugme {
  width: 100%;
  min-height: 46px;
  justify-content: center;
  font-weight: 700;
}
.filigran-secim-bag {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 0.82rem;
  padding: 8px;
  cursor: pointer;
}
.filigran-secim-bag[data-secim="premium"] {
  color: var(--primary);
  font-weight: 600;
}
@media (min-width: 744px) {
  .filigran-secim-backdrop { align-items: center; }
}