/* HAN-LAW — web arayüzü stilleri
   Jetonlar HANVERON standardından alındı (Merkez Stok Kontrol Sistemi/src/app/globals.css, 19 Eki 2026):
   ozalit mavisi vurgu, sıcak "kâğıt" nötrler, tek yazı ailesi League Spartan, iki katmanlı kart gölgesi. */

:root {
  /* Yüzeyler — kâğıt nötrler */
  --bg: #f5f4f1;
  --surface: #ffffff;
  --surface-2: #f5f4f1;
  --surface-3: #eeede9;
  --border: #e1dfd9;
  --border-strong: #d3d0c8;
  --control-border: #8a867e; /* girdi kenarlığı: zemine en az 3:1 */

  /* Metin */
  --text: #0e0e10;
  --text-2: #3d3a34;
  --text-3: #6b6964;

  /* Marka — ozalit mavisi (#0F4C6B) */
  --brand: #0f4c6b;
  --brand-2: #093f5b;
  --brand-soft: #eef2f5;
  --accent: #a04607;
  --accent-soft: #fbf1e6;

  /* Durum */
  --ok: #047857;
  --ok-soft: #e8f5ef;
  --warn: #b45309;
  --warn-soft: #fdf3e2;
  --danger: #b91c1c;
  --danger-soft: #fdeceb;

  /* Mahkeme renkleri */
  --c-AYM: #6b3f86;
  --c-YARGITAY: #0f4c6b;
  --c-DANISTAY: #1f6a64;
  --c-BAM: #8f5317;
  --c-BIM: #56661c;
  --c-YEREL: #54514b;
  --c-KYB: #85304c;
  --c-UYUSMAZLIK: #4a5d23;
  --c-KVKK: #24675b;
  --c-REKABET: #7a4a1c;
  --c-OZELGE: #4b4a8a;
  --c-MEVZUAT: #31779f;

  /* Üzerine yazı renkleri */
  --on-brand: #ffffff;
  --on-badge: #ffffff;

  /* Vurgulama */
  --hl-bg: #fde68a;
  --hl-text: #0e0e10;

  /* Yazı — HANVERON kuralı: uygulamada TEK aile (League Spartan); hiyerarşi boyuttan gelir */
  --font-ui: "League Spartan", ui-sans-serif, system-ui, "Segoe UI", Arial, "Noto Sans", sans-serif;
  --font-doc: var(--font-ui);
  --font-mono: var(--font-ui);

  /* Ölçü — kart 16px (rounded-2xl), düğme/girdi 8px (rounded-lg), arama kutusu 10px */
  --radius-sm: 8px;
  --radius: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 2px rgba(16, 16, 20, 0.05);
  --shadow: 0 1px 2px rgba(16, 16, 20, 0.05), 0 4px 12px -6px rgba(16, 16, 20, 0.1);
  --shadow-lg: 0 16px 48px rgba(16, 16, 20, 0.18);
  --header-h: 56px;
  --focus: #31779f;

  /* Hareket — HANVERON mikro animasyon sistemi: hareket süs değil GERİ BİLDİRİMDİR.
     Mikro (hover/odak/satır girişi) 120-240ms, 4-8px. Tek istisna SAHNE (420ms):
     olaya bağlı, tek seferlik, yalnız opacity+transform, nihai kare öğenin kendi stili. */
  --motion-fast: 120ms;
  --motion-normal: 180ms;
  --motion-slow: 240ms;
  --motion-sahne: 420ms;
  --ease-smooth: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-sahne: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-kapanis: cubic-bezier(0.4, 0, 0.2, 1);

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #08080a;
    --surface: #141419;
    --surface-2: #1a1a20;
    --surface-3: #26262e;
    --border: #26262e;
    --border-strong: #3a3a44;
    --control-border: #74737e;
    
    --text: #f3f1ed;
    --text-2: #c3bfb8;
    --text-3: #9d9a93;
    
    /* Koyu zeminde ozalit: metin/bağlantı için açık ton, düğmede koyu yazı */
    --brand: #9cb8cb;
    --brand-2: #c4d4df;
    --brand-soft: #102633;
    --accent: #f0b46a;
    --accent-soft: #33240f;
    
    --ok: #6ee7b7;
    --ok-soft: #0f2a20;
    --warn: #fcd34d;
    --warn-soft: #33290f;
    --danger: #fca5a5;
    --danger-soft: #3a1717;
    
    --c-AYM: #c9a3df;
    --c-YARGITAY: #9cb8cb;
    --c-DANISTAY: #86d3cb;
    --c-BAM: #e8b07a;
    --c-BIM: #c2d684;
    --c-YEREL: #c3bfb8;
    --c-KYB: #e693ad;
    --c-UYUSMAZLIK: #b9cc86;
    --c-KVKK: #8fd3c4;
    --c-REKABET: #e4b382;
    --c-OZELGE: #b6b5ee;
    --c-MEVZUAT: #8fbad6;
    
    --on-brand: #041f2f;
    --on-badge: #08080a;
    
    --hl-bg: #6b5410;
    --hl-text: #fff7de;
    --focus: #6796b3;
    
    --shadow-sm: 0 1px 0 rgba(255, 255, 255, 0.045) inset;
    --shadow: 0 1px 0 rgba(255, 255, 255, 0.045) inset, 0 2px 8px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #08080a;
  --surface: #141419;
  --surface-2: #1a1a20;
  --surface-3: #26262e;
  --border: #26262e;
  --border-strong: #3a3a44;
  --control-border: #74737e;
  
  --text: #f3f1ed;
  --text-2: #c3bfb8;
  --text-3: #9d9a93;
  
  /* Koyu zeminde ozalit: metin/bağlantı için açık ton, düğmede koyu yazı */
  --brand: #9cb8cb;
  --brand-2: #c4d4df;
  --brand-soft: #102633;
  --accent: #f0b46a;
  --accent-soft: #33240f;
  
  --ok: #6ee7b7;
  --ok-soft: #0f2a20;
  --warn: #fcd34d;
  --warn-soft: #33290f;
  --danger: #fca5a5;
  --danger-soft: #3a1717;
  
  --c-AYM: #c9a3df;
  --c-YARGITAY: #9cb8cb;
  --c-DANISTAY: #86d3cb;
  --c-BAM: #e8b07a;
  --c-BIM: #c2d684;
  --c-YEREL: #c3bfb8;
  --c-KYB: #e693ad;
  --c-UYUSMAZLIK: #b9cc86;
  --c-KVKK: #8fd3c4;
  --c-REKABET: #e4b382;
  --c-OZELGE: #b6b5ee;
  --c-MEVZUAT: #8fbad6;
  
  --on-brand: #041f2f;
  --on-badge: #08080a;
  
  --hl-bg: #6b5410;
  --hl-text: #fff7de;
  --focus: #6796b3;
  
  --shadow-sm: 0 1px 0 rgba(255, 255, 255, 0.045) inset;
  --shadow: 0 1px 0 rgba(255, 255, 255, 0.045) inset, 0 2px 8px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}

/* ---------- Temel ---------- */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.55;
  min-height: 100vh;
  overflow-x: hidden;
}

h1,
h2,
h3,
h4 {
  line-height: 1.25;
  margin: 0 0 0.5em;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* HANVERON PageHeader: 24px, yarı kalın, sıkı harf aralığı — hiyerarşi boyuttan gelir. */
h1 { font-size: 24px; letter-spacing: -0.02em; }
h2 { font-size: 1.2rem; }
h3 { font-size: 1.02rem; }

p { margin: 0 0 0.75em; }

a {
  color: var(--brand-2);
  text-underline-offset: 2px;
}

code,
kbd {
  font-family: var(--font-mono);
  font-size: 0.88em;
}

kbd {
  background: var(--surface-3);
  border: 1px solid var(--border);
  border-bottom-width: 2px;
  border-radius: 4px;
  padding: 0 5px;
  color: var(--text-2);
}

:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
  border-radius: 4px;
}

::selection {
  background: color-mix(in srgb, var(--brand) 22%, transparent);
}

/* "İçeriğe geç": klavye odağında görünür */
.sr-only.skip-link:focus {
  position: fixed !important;
  top: 8px;
  left: 8px;
  z-index: 10000;
  width: auto;
  height: auto;
  margin: 0;
  padding: 8px 14px;
  overflow: visible;
  clip: auto;
  white-space: normal;
  background: var(--surface);
  color: var(--text);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg);
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

[hidden] {
  display: none !important;
}

.muted {
  color: var(--text-3);
}

.small {
  font-size: 13px;
}

.mono {
  font-family: var(--font-mono);
}

.stack > * + * {
  margin-top: 12px;
}

.row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.grow {
  flex: 1 1 auto;
  min-width: 0;
}

.spacer {
  flex: 1;
}

/* ---------- Üst şerit (HANVERON üst gezinme: 56px şerit, 44px başlıklar) ---------- */

.topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  height: var(--header-h);
  background: color-mix(in srgb, var(--surface) 90%, transparent);
  backdrop-filter: saturate(1.4) blur(10px);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--border);
}

.topbar-inner {
  height: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  text-decoration: none;
  color: var(--text);
  min-width: 0;
  flex: none;
  border-radius: var(--radius-sm);
  transition: opacity var(--motion-fast) var(--ease-smooth);
}

.brand:hover {
  opacity: 0.8;
}

.brand-mark {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--brand);
  color: var(--on-brand);
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  padding-top: 2px; /* League Spartan'ın taban çizgisi yüksek — harfi optik ortaya indirir */
  flex: none;
}

.brand-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.15;
}

.brand-name {
  font-weight: 700;
  letter-spacing: 0.04em;
  font-size: 15px;
}

.brand-tagline {
  font-size: 11.5px;
  color: var(--text-3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* `align-self: stretch` — nav şeridin tüm yüksekliğini alır ki kayan iz tam şeridin alt
   kenarına (kenarlığın üstüne) otursun; başlıklar içinde dikeyde ortalı kalır. */
.nav {
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: 2px;
  margin-left: 8px;
  flex: none;
}

.nav-heading {
  display: none;
}

.nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 12px;
  border-radius: var(--radius-sm);
  color: var(--text-2);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  transition: background-color var(--motion-fast) var(--ease-smooth), color var(--motion-fast) var(--ease-smooth);
}

.nav a:hover {
  background: var(--surface-3);
  color: var(--text);
}

.nav a[aria-current="page"] {
  color: var(--brand);
}

/* Kayan üst iz — hangi bölümdeyiz. 1px genişliğinde tanımlı; JS translateX + scaleX ile
   hedef başlığın altına taşır (sahne süresi, ön yüklü eğri: "gelip yerine oturur").
   border-radius YOK: scaleX yarıçapı da gerer, iz iki çizgi gibi görünür (HANVERON notu). */
.nav-iz {
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 1px;
  height: 2px;
  background: var(--brand);
  transform-origin: left center;
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--motion-sahne) var(--ease-sahne),
    opacity var(--motion-sahne) var(--ease-sahne);
}

.topbar-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

/* Komut paleti tetikleyicisi — görünüşü arama KUTUSU, davranışı düğme. Ctrl+K etiketi
   bilerek yazılmaz (HANVERON kararı: "göze güzel gelmedi"); kısayol title'da ve palette. */
.cmdk-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  width: 17rem;
  min-width: 0;
  flex: 0 1 auto;
  padding: 0 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--text-3);
  font: inherit;
  font-size: 14px;
  text-align: left;
  cursor: pointer;
  transition:
    background-color var(--motion-fast) var(--ease-smooth),
    border-color var(--motion-fast) var(--ease-smooth);
}

.cmdk-trigger:hover {
  background: var(--surface-2);
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border-strong));
}

.cmdk-trigger svg {
  width: 16px;
  height: 16px;
  flex: none;
}

.cmdk-trigger-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.status-dot {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-3);
  min-height: 30px;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  cursor: default;
  white-space: nowrap;
}

.status-dot::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text-3);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--text-3) 18%, transparent);
  transition: background-color var(--motion-slow) var(--ease-smooth), box-shadow var(--motion-slow) var(--ease-smooth);
}

.status-dot[data-state="ok"]::before {
  background: var(--ok);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 20%, transparent);
}

.status-dot[data-state="warn"]::before {
  background: var(--warn);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--warn) 22%, transparent);
}

.status-dot[data-state="down"]::before {
  background: var(--danger);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 22%, transparent);
}

/* HANVERON ikon düğmesi: 44×44 dokunma hedefi, çerçevesiz, hover'da kâğıt tonu. */
.icon-btn {
  position: relative;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm);
  border: 0;
  background: transparent;
  color: var(--text-2);
  cursor: pointer;
  flex: none;
  transition:
    background-color var(--motion-fast) var(--ease-smooth),
    color var(--motion-fast) var(--ease-smooth);
}

.icon-btn:hover {
  background: var(--surface-3);
  color: var(--text);
}

.icon-btn:active {
  scale: 0.96;
}

.icon-btn svg {
  width: 20px;
  height: 20px;
}

/* Tema simgesi: ay ↔ güneş, aynı yerde dönerek yer değiştirir. İki simge üst üste
   (grid-area 1/1); görünmeyen dönmüş + küçülmüş durur. */
.theme-icons {
  display: grid;
  place-items: center;
}

.theme-icons svg {
  grid-area: 1 / 1;
  transition:
    opacity var(--motion-slow) var(--ease-smooth),
    transform var(--motion-sahne) var(--ease-sahne);
}

.theme-icons .ic-sun {
  opacity: 0;
  transform: rotate(-90deg) scale(0.5);
}

:root[data-theme="dark"] .theme-icons .ic-moon {
  opacity: 0;
  transform: rotate(90deg) scale(0.5);
}

:root[data-theme="dark"] .theme-icons .ic-sun {
  opacity: 1;
  transform: none;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-icons .ic-moon {
    opacity: 0;
    transform: rotate(90deg) scale(0.5);
  }

  :root:not([data-theme="light"]) .theme-icons .ic-sun {
    opacity: 1;
    transform: none;
  }
}

.menu-toggle,
.cmdk-trigger-mobile {
  display: none;
}

/* Başlıkların tam göründüğü geniş düzende (>1280 px) şerit 1280 px'e sınırlı; başlıklar, durum ve simgeler onu
   dolduruyor, kutu 26 px'e sıkışıp büyüteci kesiliyordu (1.11.2026). Burada çerçevesiz büyüteç simgesi; arama
   kutusu, başlıklar çekmeceye inince (≤1280 px) yer olduğunda görünür. */
@media (min-width: 1281px) {
  .cmdk-trigger {
    display: none;
  }

  .cmdk-trigger-mobile {
    display: grid;
  }

  /* 1281 px'te kaydırma çubuğu 15 px yer: 12 px iç boşlukla tema simgesi kenara 10 px taşıyordu. */
  .nav a {
    padding: 0 10px;
  }
}

/* Tema değişimi — View Transitions: tarayıcı eski/yeni hâlin görüntüsünü compositor'da
   geçirir (öğe sayısından bağımsız tek GPU işi). Yeni tema, tıklanan düğmeden açılan bir
   daireyle gelir; merkez ve yarıçap JS'ten (--vt-x/--vt-y/--vt-r). */
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-new(root) {
  animation: tema-daire var(--motion-sahne) var(--ease-sahne) both;
}

@keyframes tema-daire {
  from {
    clip-path: circle(0 at var(--vt-x, 100%) var(--vt-y, 0));
  }
  to {
    clip-path: circle(var(--vt-r, 150vmax) at var(--vt-x, 100%) var(--vt-y, 0));
  }
}

::view-transition {
  pointer-events: none;
}

/* ---------- Ana yerleşim ---------- */

.page {
  max-width: 1280px;
  margin: 0 auto;
  padding: 24px 20px 64px;
}

.page-head {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.page-head h1 {
  margin: 0;
}

.page-head p {
  margin: 6px 0 0;
  color: var(--text-3);
  font-size: 14px;
  max-width: 60ch;
}

/* HANVERON kartı: rounded-2xl + iki katmanlı "kart" gölgesi. */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 20px;
  min-width: 0;
}

/* Grup başlığı: 10.5px kalın büyük harf, geniş aralık (HANVERON menü başlığı ölçüsü). */
.card-title {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
  font-weight: 700;
  margin: 0 0 12px;
}

.notice {
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  border: 1px solid var(--border);
  background: var(--surface-2);
  color: var(--text-2);
  font-size: 14px;
  animation: rise-in var(--motion-normal) var(--ease-smooth) both;
}

.notice.warn {
  background: var(--warn-soft);
  border-color: color-mix(in srgb, var(--warn) 40%, transparent);
  color: var(--text);
}

.notice.danger {
  background: var(--danger-soft);
  border-color: color-mix(in srgb, var(--danger) 40%, transparent);
  color: var(--text);
}

.notice code {
  background: color-mix(in srgb, var(--text) 8%, transparent);
  padding: 1px 5px;
  border-radius: 4px;
}

/* ---------- Düğmeler ---------- */

/* HANVERON düğmesi: rounded-lg, 44px dokunma hedefi, 14px orta kalınlık. */
.btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 16px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-strong);
  background: var(--surface);
  color: var(--text-2);
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color var(--motion-fast) var(--ease-smooth),
    border-color var(--motion-fast) var(--ease-smooth),
    color var(--motion-fast) var(--ease-smooth),
    box-shadow var(--motion-fast) var(--ease-smooth),
    scale var(--motion-fast) var(--ease-smooth);
}

.btn:hover:not(:disabled) {
  background: var(--surface-2);
  color: var(--text);
}

/* Basış geri bildirimi: %2 ölçek (mikro kural tavanı). */
.btn:active:not(:disabled) {
  scale: 0.98;
}

.btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.btn svg {
  width: 16px;
  height: 16px;
  flex: none;
}

.btn-primary {
  background: var(--brand);
  border-color: var(--brand);
  color: var(--on-brand);
}

.btn-primary:hover:not(:disabled) {
  background: var(--brand-2);
  border-color: var(--brand-2);
  color: var(--on-brand);
  box-shadow: 0 4px 12px -6px color-mix(in srgb, var(--brand) 70%, transparent);
}

.btn-ghost {
  background: transparent;
  border-color: transparent;
  color: var(--text-2);
}

.btn-ghost:hover:not(:disabled) {
  background: var(--surface-3);
}

.btn-danger {
  color: var(--danger);
}

/* Küçük düğme masaüstünde 36px; dokunmatik ekranda 44px'e çıkar (aşağıdaki pointer:coarse). */
.btn-sm {
  min-height: 36px;
  padding: 0 12px;
  font-size: 13px;
  border-radius: var(--radius-sm);
}

.btn-block {
  width: 100%;
}

.btn-stop {
  background: var(--danger-soft);
  border-color: color-mix(in srgb, var(--danger) 45%, transparent);
  color: var(--danger);
}

/* Segmented control — seçili zemin ayrı bir "pul" (.seg-thumb); JS onu seçilen düğmenin
   altına kaydırır. JS yoksa seçili düğme kendi zeminini taşır (aşağıdaki .has-thumb kuralı). */
.segmented {
  position: relative;
  display: inline-flex;
  padding: 3px;
  background: var(--surface-3);
  border-radius: 999px;
  border: 1px solid var(--border);
  gap: 2px;
  isolation: isolate;
}

.segmented button {
  appearance: none;
  position: relative;
  z-index: 1;
  border: 0;
  background: transparent;
  color: var(--text-2);
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: color var(--motion-normal) var(--ease-smooth);
}

.segmented button:hover {
  color: var(--text);
}

.segmented button[aria-pressed="true"],
.segmented button[aria-selected="true"] {
  background: var(--surface);
  color: var(--text);
  font-weight: 600;
  box-shadow: var(--shadow-sm);
}

.segmented.has-thumb button[aria-pressed="true"] {
  background: transparent;
  box-shadow: none;
}

.seg-thumb {
  position: absolute;
  z-index: 0;
  top: 3px;
  left: 0;
  bottom: 3px;
  width: 0;
  border-radius: 999px;
  background: var(--surface);
  box-shadow: var(--shadow);
  pointer-events: none;
  transition:
    translate var(--motion-slow) var(--ease-sahne),
    width var(--motion-slow) var(--ease-sahne);
}

/* Chips */
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.chip {
  appearance: none;
  border: 1px solid var(--border-strong);
  background: var(--surface);
  color: var(--text-2);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition:
    background-color var(--motion-fast) var(--ease-smooth),
    border-color var(--motion-fast) var(--ease-smooth),
    color var(--motion-fast) var(--ease-smooth),
    scale var(--motion-fast) var(--ease-smooth);
}

.chip:hover {
  background: var(--surface-2);
  color: var(--text);
}

.chip:active {
  scale: 0.97;
}

.chip[aria-pressed="true"] {
  border-color: var(--chip-color, var(--brand));
  background: color-mix(in srgb, var(--chip-color, var(--brand)) 12%, var(--surface));
  color: var(--text);
  font-weight: 600;
}

.chip-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--chip-color, var(--brand));
  transition: scale var(--motion-normal) var(--ease-sahne);
}

.chip[aria-pressed="true"] .chip-dot {
  scale: 1.35;
}

/* Mahkeme rozeti — HANVERON rozeti: rounded-full, text-xs (13px), orta kalınlık. */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 1px 9px 0;
  border-radius: 999px;
  color: var(--on-badge);
  background: var(--badge-color, var(--brand));
  white-space: nowrap;
  line-height: 1.6;
}

.badge-muted {
  background: var(--surface-3);
  color: var(--text-2);
  border: 1px solid var(--border);
}

.tag {
  font-size: 12px;
  font-weight: 500;
  padding: 1px 8px 0;
  border-radius: 999px;
  background: var(--surface-3);
  color: var(--text-2);
  border: 1px solid var(--border);
  white-space: nowrap;
}

/* Toplu arşivden gelen (resmî olmayan) kopya: uyarı tonu, metinle de söylenir ("Arşiv kopyası"). */
.tag-arsiv {
  background: var(--warn-soft);
  color: var(--warn);
  border-color: color-mix(in srgb, var(--warn) 30%, transparent);
}

.archive-notice,
.archive-partial {
  margin-bottom: 12px;
}

.archive-partial {
  flex-basis: 100%;
  margin: 8px 0 0;
}

.tag-ok {
  background: var(--ok-soft);
  color: var(--ok);
  border-color: transparent;
}

/* Inputs */
.field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

/* HANVERON alan etiketi: text-xs (13px) orta kalınlık. */
.field > label,
.field > .label {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-2);
}

/* HANVERON girdisi: kâğıt zemin (slate-50), odakta yüzeye döner + 1px ozalit halka. */
.input,
.select,
.textarea {
  appearance: none;
  width: 100%;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--control-border);
  background: var(--surface-2);
  color: var(--text);
  font: inherit;
  font-size: 14px;
  transition:
    border-color var(--motion-fast) var(--ease-smooth),
    background-color var(--motion-fast) var(--ease-smooth),
    box-shadow var(--motion-normal) var(--ease-smooth);
}

.input:hover:not(:focus),
.select:hover:not(:focus),
.textarea:hover:not(:focus) {
  border-color: color-mix(in srgb, var(--text-3) 45%, var(--control-border));
}

.select {
  background-image: linear-gradient(45deg, transparent 50%, var(--text-3) 50%),
    linear-gradient(135deg, var(--text-3) 50%, transparent 50%);
  background-position: calc(100% - 17px) 55%, calc(100% - 12px) 55%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 30px;
}

.textarea {
  resize: vertical;
  line-height: 1.5;
}

.input:focus,
.select:focus,
.textarea:focus {
  outline: none;
  border-color: var(--brand);
  background-color: var(--surface);
  box-shadow: 0 0 0 1px var(--brand), 0 0 0 4px color-mix(in srgb, var(--brand) 14%, transparent);
}

.input::placeholder,
.textarea::placeholder {
  color: var(--text-3);
  opacity: 1;
}

.hint {
  font-size: 13px;
  color: var(--text-3);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.form-grid .span-2 {
  grid-column: 1 / -1;
}

.check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.92rem;
  color: var(--text-2);
  cursor: pointer;
  user-select: none;
}

.check input {
  width: 16px;
  height: 16px;
  accent-color: var(--brand);
  margin: 0;
}

/* ---------- Arama sayfası ---------- */

.search-box {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--control-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 14px 14px 10px;
  transition:
    border-color var(--motion-normal) var(--ease-smooth),
    box-shadow var(--motion-slow) var(--ease-smooth);
}

/* HANVERON arama kutusu odağı: ring-2 ozalit/30. */
.search-box:focus-within {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent), var(--shadow);
}

.search-input {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 1.04rem;
  line-height: 1.55;
  resize: none;
  min-height: 56px;
  max-height: 60vh;
  padding: 4px 4px;
  outline: none;
}

.search-input::placeholder {
  color: var(--text-3);
  opacity: 1;
}

.search-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
}

.search-foot .hint {
  margin-right: auto;
}

.filters {
  margin-top: 14px;
}

.filters-toggle {
  display: none;
}

.filters-body {
  display: grid;
  gap: 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 16px 20px;
}

.filter-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}

.filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.results-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 22px 0 10px;
  font-size: 14px;
  color: var(--text-2);
}

.results-head > * {
  animation: fade-in var(--motion-normal) var(--ease-smooth) both;
}

.results-head strong {
  color: var(--text);
}

.results {
  display: grid;
  gap: 10px;
}

.result {
  position: relative;
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 4px solid var(--badge-color, var(--brand));
  border-radius: 12px;
  padding: 14px 16px 12px;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition:
    border-color var(--motion-fast) var(--ease-smooth),
    box-shadow var(--motion-normal) var(--ease-smooth),
    translate var(--motion-normal) var(--ease-smooth);
}

.result:hover {
  box-shadow: var(--shadow);
  border-color: var(--border-strong);
  border-left-color: var(--badge-color, var(--brand));
  translate: 0 -1px;
}

.result:active {
  translate: 0 0;
}

/* Kademeli giriş (HANVERON "kat"): yeni sonuçlar sırayla 10px aşağıdan yükselir.
   `--i` sırayı taşır; tavan 8 — sonrası bilgi taşımaz, yalnız gecikme olur.
   Nihai kare öğenin kendi stili → animasyon koşmazsa da doğru durum ekranda kalır. */
.kat {
  animation: katgel var(--motion-sahne) var(--ease-sahne) both;
  animation-delay: calc(min(var(--i, 0), 8) * 32ms);
}

.result-top {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.result-date {
  font-size: 0.82rem;
  color: var(--text-3);
}

.result-cite {
  font-weight: 650;
  font-size: 0.98rem;
  line-height: 1.4;
  margin: 2px 0 6px;
  color: var(--text);
}

.result-snippet {
  font-family: var(--font-doc);
  font-size: 0.97rem;
  line-height: 1.6;
  color: var(--text-2);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.result-foot {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 10px;
  flex-wrap: wrap;
}

.score-bars {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 0.75rem;
  color: var(--text-3);
}

.score-bar {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.score-track {
  width: 64px;
  height: 6px;
  border-radius: 999px;
  background: var(--surface-3);
  overflow: hidden;
  position: relative;
}

.score-fill {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: 999px;
  background: var(--brand-2);
  transform-origin: left center;
}

/* Skor çubuğu kart girdikten hemen sonra soldan dolar (kartın kademesine bağlı). */
.kat .score-fill {
  animation: skor-dol 640ms var(--ease-sahne) both;
  animation-delay: calc(min(var(--i, 0), 8) * 32ms + 160ms);
}

.score-bar[data-kind="keyword"] .score-fill {
  background: var(--accent);
}

mark.hl {
  background: var(--hl-bg);
  color: var(--hl-text);
  border-radius: 3px;
  padding: 0 1px;
}

.pager {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}

/* HANVERON boş durumu: kesik çizgili kâğıt kutu. */
.empty {
  text-align: center;
  padding: 32px;
  color: var(--text-3);
  font-size: 14px;
  border: 1px dashed var(--border-strong);
  border-radius: 12px;
  background: var(--surface-2);
  animation: rise-in var(--motion-slow) var(--ease-sahne) both;
}

.examples {
  margin-top: 26px;
  display: grid;
  gap: 10px;
}

.examples-title {
  font-size: 10.5px;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
}

.example-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.example-btn {
  appearance: none;
  font: inherit;
  font-size: 14px;
  text-align: left;
  min-height: 44px;
  padding: 0 16px;
  border-radius: var(--radius);
  border: 1px dashed var(--border-strong);
  background: var(--surface-2);
  color: var(--text-2);
  cursor: pointer;
  transition:
    border-color var(--motion-fast) var(--ease-smooth),
    background-color var(--motion-fast) var(--ease-smooth),
    color var(--motion-fast) var(--ease-smooth),
    box-shadow var(--motion-normal) var(--ease-smooth),
    translate var(--motion-normal) var(--ease-smooth);
}

.example-btn:hover {
  border-style: solid;
  border-color: var(--brand);
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow);
  translate: 0 -1px;
}

.example-btn:active {
  translate: 0 0;
}

.live-row {
  margin-top: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius);
  background: var(--surface-2);
  font-size: 14px;
  animation: rise-in var(--motion-slow) var(--ease-sahne) both;
}

/* ---------- Detay paneli (drawer) ---------- */

.drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(10, 16, 24, 0.38);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  z-index: 70;
  opacity: 0;
  transition: opacity var(--motion-slow) var(--ease-kapanis);
}

.drawer-backdrop.open {
  opacity: 1;
}

.drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(760px, 100vw);
  background: var(--surface);
  border-left: 1px solid var(--border);
  box-shadow: var(--shadow-lg);
  z-index: 80;
  display: flex;
  flex-direction: column;
  transform: translateX(102%);
  /* Kapalıyken gizli: aksi hâlde ekran dışındaki panelin 48px gölgesi sağ kenara sızar.
     visibility kayma BİTTİKTEN sonra kapanır (gecikmeli geçiş). */
  visibility: hidden;
  /* Kapanış: simetrik eğri — giden yüz hızlanarak uzaklaşır. */
  transition:
    transform var(--motion-slow) var(--ease-kapanis),
    visibility 0s linear var(--motion-slow);
}

/* Açılış: sahne süresi + ön yüklü eğri — panel gelip yerine "oturur". */
.drawer.open {
  transform: translateX(0);
  visibility: visible;
  transition:
    transform var(--motion-sahne) var(--ease-sahne),
    visibility 0s;
}

/* Yeni belge içeriği yerinde belirir (önceki belgeden geçişte de). */
.drawer.open .drawer-body > *,
.drawer.open .drawer-actions > * {
  animation: rise-in var(--motion-slow) var(--ease-smooth) both;
}

.drawer-head {
  padding: 16px 20px 14px;
  border-bottom: 1px solid var(--border);
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.drawer-head .grow {
  min-width: 0;
}

.drawer-title {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
  margin: 6px 0 0;
}

.drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 18px 20px 40px;
  -webkit-overflow-scrolling: touch;
}

.drawer-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 12px 20px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-2);
}

.meta-grid {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 14px;
  font-size: 0.9rem;
  margin: 0 0 16px;
}

.meta-grid dt {
  color: var(--text-3);
}

.meta-grid dd {
  margin: 0;
  color: var(--text);
  min-width: 0;
  overflow-wrap: anywhere;
}

.doc-text {
  font-family: var(--font-doc);
  font-size: 1.04rem;
  line-height: 1.75;
  color: var(--text);
  max-width: 68ch;
  overflow-wrap: anywhere;
}

.doc-text p {
  margin: 0 0 1em;
}

.ai-box {
  margin: 0 0 18px;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  background: var(--accent-soft);
  border-radius: var(--radius);
  padding: 14px 16px;
}

.ai-box-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 0.84rem;
  font-weight: 650;
  color: var(--accent);
}

.similar-list {
  display: grid;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.similar-item {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 12px;
  cursor: pointer;
}

.similar-item:hover {
  border-color: var(--border-strong);
  background: var(--surface-3);
}

.similar-item .cite {
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
}

/* ---------- Derin araştırma ---------- */

.research-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: start;
}

.timeline {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 2px;
  font-size: 0.9rem;
}

.timeline li {
  position: relative;
  padding: 6px 0 6px 22px;
  color: var(--text-2);
  overflow-wrap: anywhere;
}

.timeline li::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 14px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--border-strong);
}

.timeline li::after {
  content: "";
  position: absolute;
  left: 8px;
  top: 24px;
  bottom: -8px;
  width: 2px;
  background: var(--border);
}

.timeline li:last-child::after {
  display: none;
}

.timeline li.is-tool::before {
  background: var(--brand-2);
}

.timeline li.is-status::before {
  background: var(--accent);
}

.timeline li.is-error::before {
  background: var(--danger);
}

.timeline li.is-done::before {
  background: var(--ok);
}

.timeline li.is-live::before {
  background: var(--brand-2);
  animation: pulse 1.2s ease-in-out infinite;
}

.timeline .tl-time {
  font-size: 0.74rem;
  color: var(--text-3);
  margin-right: 6px;
  font-variant-numeric: tabular-nums;
}

.report {
  min-height: 320px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 28px clamp(18px, 4vw, 44px);
  box-shadow: var(--shadow-sm);
}

.report-empty {
  color: var(--text-3);
  text-align: center;
  padding: 60px 12px;
}

.report-body {
  font-family: var(--font-doc);
  font-size: 1.02rem;
  line-height: 1.75;
  color: var(--text);
  overflow-wrap: anywhere;
  max-width: 72ch;
  margin: 0 auto;
}

.report-body h1,
.report-body h2,
.report-body h3,
.report-body h4 {
  font-family: var(--font-ui);
  color: var(--text);
  margin: 1.4em 0 0.5em;
}

.report-body h1 { font-size: 1.3rem; }
.report-body h2 { font-size: 1.12rem; border-bottom: 1px solid var(--border); padding-bottom: 4px; }
.report-body h3 { font-size: 1.02rem; }

.report-body ul,
.report-body ol {
  padding-left: 1.4em;
}

.report-body blockquote {
  margin: 1em 0;
  padding: 4px 14px;
  border-left: 3px solid var(--border-strong);
  color: var(--text-2);
}

.report-body table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-ui);
  font-size: 0.9rem;
  display: block;
  overflow-x: auto;
}

.report-body th,
.report-body td {
  border: 1px solid var(--border);
  padding: 6px 8px;
  text-align: left;
  vertical-align: top;
}

.report-body th {
  background: var(--surface-2);
}

.report-body pre,
.report-body code {
  font-family: var(--font-mono);
  font-size: 0.86em;
}

.report-body pre {
  background: var(--surface-2);
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  overflow-x: auto;
}

.cite-link {
  appearance: none;
  border: 0;
  background: var(--brand-soft);
  color: var(--brand);
  font: inherit;
  font-family: var(--font-ui);
  font-size: 0.78em;
  font-weight: 650;
  padding: 1px 6px;
  border-radius: 5px;
  cursor: pointer;
  vertical-align: 1px;
  text-decoration: none;
  white-space: nowrap;
}

.cite-link:hover {
  background: var(--brand);
  color: var(--on-brand);
}

.source-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}

.source-item {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  cursor: pointer;
  font-size: 0.86rem;
  line-height: 1.4;
}

.source-item:hover {
  border-color: var(--border-strong);
}

.source-item .ref {
  display: inline-block;
  font-weight: 700;
  color: var(--brand);
  margin-right: 6px;
  font-variant-numeric: tabular-nums;
}

.stream-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.stream-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.84rem;
  color: var(--text-2);
}

.stream-live::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-2);
  animation: pulse 1.2s ease-in-out infinite;
}

.caret::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 1.05em;
  margin-left: 2px;
  vertical-align: -0.15em;
  background: var(--brand-2);
  animation: blink 1s steps(2, start) infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.8); }
}

@keyframes blink {
  to { visibility: hidden; }
}

/* ---------- Dilekçe editörü ---------- */

/* Üstte tam genişlikte form; altında A4 kâğıt ile düzenleme paneli yan yana (sayfa geniş ekranda genişler). */
.page:has(.draft-layout) {
  max-width: 1640px;
}

.draft-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: 20px;
  align-items: start;
}

.draft-layout > .draft-form {
  grid-column: 1 / -1;
}

.draft-layout .paper {
  padding: clamp(24px, 4vw, 64px) clamp(20px, 4.5vw, 64px);
}

.draft-main {
  min-width: 0;
}

/* Alanlar üç sütunlu ızgarada; uzun metin alanları (taraflar, olaylar, talepler, ek talimat) yan yana. */
.draft-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 16px;
  align-items: start;
}

.draft-form > :not(.field),
.draft-form > .field:has(#dr-notes) {
  grid-column: 1 / -1;
}

/* Üst satır: seçenekler solda, "Taslak hazırla" / "Durdur" sağda. */
.draft-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}

.draft-form-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 20px;
  flex: 1 1 360px;
}

.draft-form-actions > .btn {
  width: auto;
  min-width: 220px;
}

.draft-form .textarea {
  min-height: 70px;
}

@media (max-width: 760px) {
  .draft-layout > .draft-form { /* aşağıdaki 1280 px kuralından sonra da geçerli olsun */
    grid-template-columns: minmax(0, 1fr);
  }

  .draft-form-actions > .btn {
    width: 100%;
  }
}

.draft-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 12px;
}

.paper {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 4px;
  box-shadow: var(--shadow);
  padding: clamp(24px, 6vw, 72px) clamp(20px, 7vw, 80px);
  width: 100%;
  max-width: 210mm;
  min-height: 297mm;
  margin: 0 auto;
}

.paper-editor {
  display: block;
  width: 100%;
  min-height: 260mm;
  border: 0;
  outline: none;
  resize: vertical;
  background: transparent;
  color: var(--text);
  font-family: var(--font-doc);
  font-size: 12pt;
  line-height: 1.7;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  tab-size: 4;
}

.paper-editor:focus-visible {
  outline: none;
}

.paper-wrap:focus-within .paper {
  box-shadow: var(--shadow-lg), 0 0 0 3px color-mix(in srgb, var(--focus) 22%, transparent);
}

/* Sağ sütunda yalnız düzenleme paneli: sütun yapışır, panel uzarsa kendi içinde kayar; panel hep kâğıdın yanında. */
.draft-sidebar {
  display: grid;
  gap: 14px;
  align-content: start;
  position: sticky;
  top: calc(var(--header-h) + 16px);
  /* Sayfanın dibinde düzen biter (altında .page'in 64 px boşluğu): sütun bundan uzunsa yukarı itilir ve panelin başı
     üst şeridin altında kalırdı. */
  max-height: calc(100vh - var(--header-h) - 80px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: 4px; /* son kartın gölgesi kesilmesin */
}

/* Sohbet geçmişi panelin kalan yüksekliğinde kayar (istek kutusu ve düğmeler ≈ 340 px): sütunun kendisi kaymasın. */
.draft-sidebar > .rv-card .rv-log {
  max-height: max(140px, calc(100vh - var(--header-h) - 80px - 340px));
}

/* Kâğıdın altında: kullanılan kaynaklar, eklenen atıflar, kayıtlı taslaklar. */
.draft-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  align-items: start;
  margin-top: 16px;
}

.side-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}

.side-item {
  border: 1px solid var(--border);
  background: var(--surface-2);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  font-size: 0.84rem;
  line-height: 1.4;
  display: grid;
  gap: 6px;
}

.side-item .cite {
  overflow-wrap: anywhere;
}

.side-item .row {
  justify-content: flex-end;
}

.draft-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
}

.draft-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 6px 8px 6px 10px;
  background: var(--surface-2);
  font-size: 0.88rem;
}

.draft-list .name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.draft-list .when {
  font-size: 0.74rem;
  color: var(--text-3);
  white-space: nowrap;
}

/* ---------- Veri kaynakları ---------- */

.stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.stat {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 16px 18px;
  box-shadow: var(--shadow-sm);
  min-width: 0;
}

.stat-label {
  font-size: 0.8rem;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 650;
}

.stat-value {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.stat-sub {
  font-size: 0.82rem;
  color: var(--text-3);
  margin-top: 2px;
  overflow-wrap: anywhere;
}

.stat-value.small-text {
  font-size: 1.05rem;
  font-weight: 650;
  padding-top: 6px;
}

.dot-inline {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  margin-right: 6px;
  vertical-align: 1px;
  background: var(--text-3);
}

.dot-inline.ok { background: var(--ok); }
.dot-inline.warn { background: var(--warn); }
.dot-inline.down { background: var(--danger); }

.two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.bars {
  display: grid;
  gap: 8px;
}

.bar-row {
  display: grid;
  grid-template-columns: minmax(90px, 150px) minmax(0, 1fr) 64px;
  gap: 10px;
  align-items: center;
  font-size: 0.88rem;
}

.bar-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-2);
}

.bar-track {
  height: 12px;
  background: var(--surface-3);
  border-radius: 999px;
  overflow: hidden;
}

.bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: var(--badge-color, var(--brand-2));
  transition: width 640ms var(--ease-sahne);
}

.bar-value {
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: var(--text-2);
  font-size: 0.84rem;
}

.ingest-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.preset-box {
  display: grid;
  gap: 10px;
  align-content: start;
}

.table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.table th,
.table td {
  text-align: left;
  padding: 9px 12px;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}

.table th {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-3);
  background: var(--surface-2);
  font-weight: 650;
  white-space: nowrap;
}

.table tr:last-child td {
  border-bottom: 0;
}

.table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.progress {
  height: 8px;
  background: var(--surface-3);
  border-radius: 999px;
  overflow: hidden;
  min-width: 90px;
}

.progress-fill {
  height: 100%;
  width: 0;
  background: var(--brand-2);
  border-radius: 999px;
  transition: width var(--motion-sahne) var(--ease-sahne);
}

.progress.indeterminate .progress-fill {
  width: 35% !important;
  animation: slide 1.3s ease-in-out infinite;
}

@keyframes slide {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(300%); }
}

.job-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 600;
}

.job-status::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text-3);
}

.job-status.queued::before { background: var(--text-3); }
.job-status.running::before { background: var(--brand-2); animation: pulse 1.2s ease-in-out infinite; }
.job-status.done::before { background: var(--ok); }
.job-status.failed::before { background: var(--danger); }

/* Gece senkronu kartı (Kaynaklar) */
.sync-card .row {
  flex-wrap: wrap;
}

.sync-info {
  display: grid;
  gap: 2px;
  margin-bottom: 12px;
}

.sync-info p {
  margin: 0;
}

.sync-runs {
  display: grid;
  gap: 4px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  color: var(--text-2);
}

.sync-runs .mono {
  color: var(--text-3);
}

/* Gömme kuyruğu ve yarım kalan çekimler (Kaynaklar › Veri toplama işleri) */
.embed-queue {
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}

.embed-queue .row {
  gap: 10px;
  margin-bottom: 4px;
}

.embed-queue .sync-info {
  margin-bottom: 6px;
}

.resume-list {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.resume-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

/* Dar ekranda yalnız hedef + ilerleme ("17 / 940" etiketi sayıları zaten taşır). */
@media (max-width: 760px) {
  .sync-card th:nth-child(n + 3),
  .sync-card td:nth-child(n + 3) {
    display: none;
  }

  .sync-card td:first-child {
    min-width: 132px;
  }

  .sync-card .progress {
    min-width: 56px;
  }
}

/* ---------- Skeleton / yükleme ---------- */

.skeleton {
  position: relative;
  overflow: hidden;
  background: var(--surface-3);
  border-radius: var(--radius-sm);
}

.skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--surface) 70%, transparent), transparent);
  transform: translateX(-100%);
  animation: shimmer 1.4s infinite;
}

@keyframes shimmer {
  100% { transform: translateX(100%); }
}

.skeleton-card {
  height: 112px;
  border-radius: var(--radius);
}

.skeleton-line {
  height: 12px;
  margin: 8px 0;
}

.spinner {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--brand-2) 25%, transparent);
  border-top-color: var(--brand-2);
  animation: spin 0.8s linear infinite;
  display: inline-block;
  flex: none;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ---------- Toast ---------- */

.toasts {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 100;
  display: grid;
  gap: 8px;
  width: min(380px, calc(100vw - 32px));
  pointer-events: none;
}

.toast {
  pointer-events: auto;
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border-strong);
  border-left: 4px solid var(--brand-2);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  padding: 11px 14px;
  font-size: 0.9rem;
  line-height: 1.45;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  animation: toast-in var(--motion-sahne) var(--ease-sahne) both;
}

/* Çıkış eşi: giriş ile aynı mesafe, simetrik eğri (giden yüz). */
.toast.leaving {
  animation: toast-out var(--motion-normal) var(--ease-kapanis) both;
  pointer-events: none;
}

.toast.success { border-left-color: var(--ok); }
.toast.error { border-left-color: var(--danger); }
.toast.warn { border-left-color: var(--warn); }

.toast-msg {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}

.toast-close {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text-3);
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 1;
  padding: 0 2px;
}

@keyframes toast-in {
  from { opacity: 0; transform: translateY(12px) scale(0.98); }
}

@keyframes toast-out {
  to { opacity: 0; transform: translateX(16px); }
}

/* ---------- Hareket keyframe'leri (HANVERON; jetonlar :root'ta) ----------
   `from`-only: bitiş karesi öğenin KENDİ stili → animasyon hiç koşmazsa
   (gizli sekme, azaltılmış hareket) ekranda doğru durum kalır. */

@keyframes fade-in {
  from { opacity: 0; }
}

@keyframes rise-in {
  from { opacity: 0; translate: 0 6px; }
}

@keyframes drop-in {
  from { opacity: 0; translate: 0 -6px; }
}

@keyframes fade-out {
  to { opacity: 0; }
}

@keyframes rise-out {
  to { opacity: 0; translate: 0 6px; }
}

@keyframes katgel {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

@keyframes skor-dol {
  from { transform: scaleX(0); }
}

/* KIRBAÇ — sekme değişiminde içerik GELDİĞİN YÖNDEN süpürülür: sağdaki bölüme
   geçtiysen sağdan, soldakine geçtiysen soldan. Yönün kendisi bilgidir. */
@keyframes kirbac-sag {
  from { opacity: 0; transform: translateX(26px); }
  62% { opacity: 1; transform: translateX(-4px); }
  to { transform: none; }
}

@keyframes kirbac-sol {
  from { opacity: 0; transform: translateX(-26px); }
  62% { opacity: 1; transform: translateX(4px); }
  to { transform: none; }
}

/* KURULUŞ PLANI — oturumun ilk sayfası bir kez "kurulur": kamera yakın başlar, geri
   çekilip sayfayı açar. Odak sol üst (okumaya başlanan yer). Yalnız ilk açılışta. */
@keyframes kurulus {
  from { opacity: 0; transform: scale(1.035) translate(8px, 12px); }
}

#app.kurulus-plani {
  animation: kurulus 920ms cubic-bezier(0.22, 0.72, 0.24, 1) both;
  transform-origin: 26% 20%;
}

#app.sayfa-gecis > * > * {
  animation: kirbac-sag 320ms var(--ease-smooth) both;
  animation-delay: calc(min(var(--i, 0), 6) * 26ms);
}

#app.sayfa-gecis.geri > * > * {
  animation-name: kirbac-sol;
}

/* ---------- Form diyaloğu (yerel <dialog>) ---------- */

.dialog {
  width: min(560px, calc(100vw - 32px));
  max-height: min(86vh, 760px);
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-lg);
  overflow: auto;
  overscroll-behavior: contain;
  animation: cmdk-gel var(--motion-slow) var(--ease-sahne) both;
}

.dialog::backdrop {
  background: color-mix(in srgb, #0e0e10 40%, transparent);
  backdrop-filter: blur(3px);
  animation: fade-in var(--motion-normal) var(--ease-smooth) both;
}

.dialog.closing {
  animation: cmdk-git var(--motion-normal) var(--ease-kapanis) both;
}

.dialog.closing::backdrop {
  animation: fade-out var(--motion-normal) var(--ease-kapanis) both;
}

.dialog-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 8px 0 20px;
}

.dialog-head h2 {
  flex: 1;
  margin: 0;
  font-size: 18px;
}

.dialog-desc {
  margin: 4px 20px 0;
  color: var(--text-3);
  font-size: 14px;
}

.dialog-form {
  display: grid;
  gap: 16px;
  padding: 16px 20px 20px;
}

.dialog-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* Bildirim içinde paragraf + liste (ör. yedek denetimi sorunları) */
.notice > p {
  margin: 0 0 6px;
}

.notice ul {
  margin: 0;
  padding-left: 20px;
}

/* Dilekçe otomatik denetimi: önem rozeti + öneri satırı */
.review-box > div {
  margin-top: 8px;
}

.review-box > div > p {
  margin: 0 0 4px;
  font-weight: 600;
}

.review-box li + li {
  margin-top: 4px;
}

.review-note {
  margin: 2px 0 0;
  font-size: 0.85em;
  color: var(--text-3);
}

.review-onem {
  display: inline-block;
  padding: 0 6px;
  border-radius: 4px;
  font-size: 0.8em;
  font-weight: 600;
  background: color-mix(in srgb, var(--text) 8%, transparent);
}

.review-onem.onem-kritik {
  background: var(--danger-soft);
  color: var(--danger);
}

.review-onem.onem-onemli {
  background: var(--warn-soft);
}

.review-fix {
  margin-top: 2px;
  font-size: 0.9em;
  color: var(--text-2);
}

.review-undo {
  margin-top: 8px;
}

.review-feedback {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 4px 0 6px;
}

.review-feedback-label {
  font-size: 12px;
  color: var(--text-2);
}

/* Bildirim içindeki "Yeniden dene" düğmesi */
.notice > .btn {
  margin-left: 8px;
  vertical-align: middle;
}

.review-feedback .btn {
  min-height: 28px;
  padding: 0 10px;
  font-size: 12px;
}

.review-feedback .btn[aria-pressed="true"] {
  background: var(--brand-soft);
  border-color: var(--brand);
  color: var(--brand);
}

/* Ayarlar · yapay zekâ kartı: kip seçimi */
.ai-mode {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.ai-mode legend {
  margin-bottom: 4px;
  padding: 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-2);
}

.ai-mode .check {
  align-items: flex-start;
  line-height: 1.45;
}

.ai-mode .check input {
  margin-top: 3px;
}

/* Gönderim önizlemesi (components/ai-consent.js): sağlayıcı/konum/model, katlanır metin parçaları, notlar */
.ai-send {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.ai-send-meta {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 4px 12px;
  margin: 0;
  font-size: 14px;
}

.ai-send-meta dt {
  color: var(--text-3);
}

.ai-send-meta dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.ai-send-parts {
  display: grid;
  gap: 8px;
}

.ai-send-part {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.ai-send-part > summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  min-height: 44px;
  padding: 6px 12px;
  border-radius: var(--radius);
  font-size: 14px;
  cursor: pointer;
}

.ai-send-part > summary:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

.ai-send-label {
  font-weight: 600;
}

.ai-send-own {
  padding: 1px 8px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 12px;
  font-weight: 600;
}

.ai-send-size {
  margin-left: auto;
  color: var(--text-3);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.ai-send-text {
  max-height: 220px;
  margin: 0;
  padding: 10px 12px 12px;
  overflow: auto;
  border-top: 1px solid var(--border);
  font: 13px/1.5 var(--font-ui);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--text-2);
}

.ai-send-wrap {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.ai-send-hidden {
  margin: 0;
  font-size: 13px;
  color: var(--text-2);
  overflow-wrap: anywhere;
}

.ai-send-terms {
  flex-wrap: nowrap;
  gap: 8px;
}

.ai-send-terms .input {
  flex: 1;
  min-width: 0;
}

.ai-send-terms .btn {
  flex: none;
}

.ai-send-notes {
  margin: 0;
  padding-left: 18px;
  color: var(--text-3);
  font-size: 13px;
}

.req {
  color: var(--danger);
}

.field[hidden],
.check[hidden] {
  display: none !important;
}

/* Bildirimdeki tek eylem ("Geri al"). */
.toast-action {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--brand);
  font: inherit;
  font-weight: 700;
  padding: 0 4px;
  min-height: 28px;
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
  align-self: center;
}

.toast-action:hover {
  background: var(--brand-soft);
}

/* ---------- Aktif dava dosyası çipi (üst şerit) ---------- */

.case-chip {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 200px;
  height: 36px;
  padding: 0 2px 0 10px;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand);
  border: 1px solid color-mix(in srgb, var(--brand) 30%, transparent);
  flex: 0 1 auto;
  animation: rise-in var(--motion-slow) var(--ease-sahne) both;
}

.case-chip-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
}

.case-chip-link svg {
  width: 16px;
  height: 16px;
  flex: none;
}

.case-chip-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.case-chip-x {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  flex: none;
}

.case-chip-x:hover {
  background: color-mix(in srgb, var(--brand) 14%, transparent);
}

/* ---------- Yaklaşan süreler çipi (üst şerit) ---------- */

.agenda-chip {
  appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: none;
  height: 36px;
  padding: 0 12px 0 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  animation: rise-in var(--motion-slow) var(--ease-sahne) both;
  transition: background-color var(--motion-fast) var(--ease-smooth), border-color var(--motion-fast) var(--ease-smooth);
}

.agenda-chip svg {
  width: 16px;
  height: 16px;
  flex: none;
}

.agenda-chip-n {
  font-variant-numeric: tabular-nums;
}

.agenda-chip.s-gecikti {
  background: var(--danger-soft);
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 35%, transparent);
}

.agenda-chip.s-yakin {
  background: var(--warn-soft);
  color: var(--warn);
  border-color: color-mix(in srgb, var(--warn) 30%, transparent);
}

.agenda-chip:hover {
  border-color: currentColor;
}

/* NABIZ — gecikmiş sayısı artınca çipten iki kez dışa açılan halka. Yalnız olaya bağlı. */
.agenda-chip.nabiz::after {
  content: '';
  position: absolute;
  inset: -1px;
  border: 2px solid currentColor;
  border-radius: inherit;
  pointer-events: none;
  animation: nabiz-halka 1100ms var(--ease-smooth) 2 both;
}

@keyframes nabiz-halka {
  from { opacity: 0.7; scale: 1; }
  to { opacity: 0; scale: 1.3; }
}

/* ---------- Dava Dosyaları sayfası ---------- */

.cases-layout {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.cases-side {
  position: sticky;
  top: calc(var(--header-h) + 16px);
  display: grid;
  gap: 12px;
  padding: 14px;
  max-height: calc(100vh - var(--header-h) - 32px);
  overflow: hidden;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.cases-search {
  position: relative;
}

.cases-search > svg {
  position: absolute;
  left: 12px;
  top: 50%;
  width: 16px;
  height: 16px;
  translate: 0 -50%;
  color: var(--text-3);
  pointer-events: none;
}

.cases-search-input {
  padding-left: 36px;
}

.case-list {
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: 0 -6px;
  padding: 0 6px 4px;
}

.case-group-title {
  display: flex;
  justify-content: space-between;
  padding: 12px 6px 4px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
}

.case-group-count {
  font-weight: 600;
}

.case-row {
  appearance: none;
  display: grid;
  gap: 3px;
  width: 100%;
  min-height: 56px;
  padding: 8px 10px 8px 9px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color var(--motion-fast) var(--ease-smooth), border-color var(--motion-fast) var(--ease-smooth);
  animation: rise-in var(--motion-normal) var(--ease-smooth) both;
  animation-delay: calc(min(var(--i, 0), 8) * 18ms);
}

.case-row:hover {
  background: var(--surface-2);
}

/* Seçili satır yalnız renkle değil 3px'lik sol şeritle de anlatılır. */
.case-row[aria-current="true"] {
  background: var(--brand-soft);
  border-left-color: var(--brand);
}

.case-row-top {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.case-row-title {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}

.case-row-sub {
  font-size: 13px;
  color: var(--text-3);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.case-row-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: var(--text-3);
}

.case-counts {
  display: inline-flex;
  gap: 10px;
}

.case-count {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.case-count svg {
  width: 13px;
  height: 13px;
}

.case-row-skeleton {
  height: 56px;
  margin: 6px 0;
}

.status-pill {
  flex: none;
  font-size: 11px;
  font-weight: 600;
  padding: 1px 8px 0;
  border-radius: 999px;
  background: var(--surface-3);
  color: var(--text-2);
  line-height: 1.6;
}

.status-pill.s-acik { background: var(--brand-soft); color: var(--brand); }
.status-pill.s-hazirlik { background: var(--warn-soft); color: var(--warn); }
.status-pill.s-karar { background: var(--ok-soft); color: var(--ok); }

.cases-main {
  min-width: 0;
  display: grid;
  gap: 14px;
  align-content: start;
}

/* PUNCH-IN — ayrıntı listede TIKLANAN NOKTADAN açılır (transform-origin JS'ten). Sahne
   istisnası: tek seferlik, olaya bağlı, yalnız opacity + scale, nihai kare öğenin kendi stili. */
.cases-main.punch-in {
  animation: punch-in var(--motion-sahne) var(--ease-sahne) both;
}

@keyframes punch-in {
  from { opacity: 0; scale: 0.94; }
}

.case-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr); /* tek satırlık (nowrap) içerik sütunu genişletmesin */
  gap: 12px;
}

.case-back {
  display: none;
  justify-self: start;
}

.case-head-top {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.case-title {
  margin: 4px 0 0;
  font-size: 20px;
  letter-spacing: -0.015em;
}

.case-active svg {
  width: 16px;
  height: 16px;
}

.case-active.on {
  background: var(--brand-soft);
  border-color: color-mix(in srgb, var(--brand) 40%, transparent);
  color: var(--brand);
  font-weight: 600;
}

.case-meta {
  margin: 0;
}

.case-subject {
  margin: 0;
  color: var(--text-2);
  font-size: 14px;
  white-space: pre-line;
}

.case-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.case-actions .btn svg {
  width: 15px;
  height: 15px;
}

.case-tabs {
  justify-self: start;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
}

.tab-count {
  margin-left: 6px;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-3);
}

.case-items {
  display: grid;
  gap: 10px;
}

.case-items.kirbac > .case-item {
  animation: kirbac-sag var(--motion-slow) var(--ease-smooth) both;
  animation-delay: calc(min(var(--i, 0), 8) * 26ms);
}

.case-items.kirbac.geri > .case-item {
  animation-name: kirbac-sol;
}

.case-item {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}

.case-item.k-karar {
  border-left: 4px solid var(--badge-color, var(--brand));
}

.case-item.pinned {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand) 35%, transparent), var(--shadow-sm);
}

/* BOBİN SONU — silinen kart yerinde geri çekilerek söner, sonra liste yeniden çizilir. */
.case-item.leaving {
  animation: bobin-sonu var(--motion-slow) var(--ease-kapanis) both;
  pointer-events: none;
}

@keyframes bobin-sonu {
  to { opacity: 0; scale: 0.97; }
}

.case-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.case-item-kind {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
}

.case-item-kind svg {
  width: 14px;
  height: 14px;
}

.case-item-time {
  font-size: 12px;
  color: var(--text-3);
}

.case-item-body {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.case-item-title {
  font-weight: 600;
  font-size: 15px;
  line-height: 1.4;
}

.case-item-snippet {
  margin: 0;
  color: var(--text-2);
  font-size: 14px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-line;
}

.case-report {
  border-top: 1px dashed var(--border);
  padding-top: 10px;
  animation: rise-in var(--motion-slow) var(--ease-sahne) both;
}

.case-item-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.case-item-actions .btn-danger {
  margin-left: auto;
}

.icon-btn.sm {
  width: 36px;
  height: 36px;
}

.icon-btn.sm svg {
  width: 17px;
  height: 17px;
}

.icon-btn.on {
  color: var(--brand);
  background: var(--brand-soft);
}

.note-wrap {
  position: relative;
}

.note-input {
  min-height: 0;
  resize: vertical;
  font-size: 14px;
  line-height: 1.5;
}

.note-input.big {
  min-height: 96px;
}

.note-status {
  position: absolute;
  right: 10px;
  bottom: 6px;
  font-size: 11px;
  color: var(--text-3);
  pointer-events: none;
}

.case-migrate {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  background: var(--brand-soft);
  border-color: color-mix(in srgb, var(--brand) 30%, transparent);
  color: var(--text);
}

.case-migrate > svg {
  width: 18px;
  height: 18px;
  color: var(--brand);
  flex: none;
}

.cases-empty {
  display: grid;
  justify-items: center;
  gap: 12px;
  padding: 48px 24px;
}

.cases-empty > svg {
  width: 40px;
  height: 40px;
  color: var(--text-3);
}

.cases-empty p {
  margin: 0;
  max-width: 44ch;
}

/* ---------- Takvim: duruşma, hak düşürücü süre, görev ---------- */

/* Durum rozeti: renk + metin ("2 gecikmiş", "Bugün", "3 gün") — yalnız renge dayanmaz. */
.ajanda-rozet {
  flex: none;
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.6;
  padding: 1px 8px 0;
  border-radius: 999px;
  white-space: nowrap;
  background: var(--surface-3);
  color: var(--text-2);
}

.ajanda-rozet.s-gecikti { background: var(--danger-soft); color: var(--danger); }
.ajanda-rozet.s-bugun { background: var(--brand); color: var(--on-brand); }
.ajanda-rozet.s-yakin { background: var(--warn-soft); color: var(--warn); }
.ajanda-rozet.s-ileri { background: var(--surface-3); color: var(--text-2); }
.ajanda-rozet.s-tamam { background: var(--ok-soft); color: var(--ok); }

.tab-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 5px;
  border-radius: 999px;
  background: var(--danger);
  vertical-align: 2px;
}

/* Başlıktaki "sıradaki / gecikmiş" satırı */
.case-next {
  appearance: none;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  color: var(--text-2);
  font: inherit;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
  transition: border-color var(--motion-fast) var(--ease-smooth);
}

.case-next:hover {
  border-color: var(--border-strong);
}

.case-next > svg {
  width: 16px;
  height: 16px;
  flex: none;
}

.case-next.s-gecikti {
  background: var(--danger-soft);
  border-color: color-mix(in srgb, var(--danger) 35%, transparent);
  color: var(--danger);
}

.case-next.s-bugun,
.case-next.s-yakin {
  background: var(--warn-soft);
  border-color: color-mix(in srgb, var(--warn) 30%, transparent);
  color: var(--text);
}

.case-next-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.case-next-text strong {
  font-weight: 600;
}

.agenda-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.agenda-tools .btn svg {
  width: 15px;
  height: 15px;
}

.agenda-group-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
}

.agenda-group-title .n {
  font-weight: 600;
}

.agenda-group-title.s-gecikti {
  color: var(--danger);
}

button.agenda-group-title {
  appearance: none;
  justify-self: start;
  min-height: 36px;
  padding: 0 8px 0 0;
  border: 0;
  background: transparent;
  font-family: inherit;
  cursor: pointer;
}

button.agenda-group-title:hover {
  color: var(--text);
}

button.agenda-group-title svg {
  width: 14px;
  height: 14px;
  transition: rotate var(--motion-normal) var(--ease-smooth);
}

button.agenda-group-title[aria-expanded="true"] svg {
  rotate: 90deg;
}

/* Süre hesaplayıcı (Takvim diyaloğu, tür "Süre"): kâğıt zeminli açılır bölüm; girdiler yüzey renginde. */
.calc {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}

.calc[hidden] {
  display: none;
}

.calc > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 12px;
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
  list-style: none;
}

.calc > summary::-webkit-details-marker {
  display: none;
}

.calc > summary:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

.calc > summary svg {
  width: 14px;
  height: 14px;
  flex: none;
  color: var(--text-3);
  transition: rotate var(--motion-normal) var(--ease-smooth);
}

.calc[open] > summary svg {
  rotate: 90deg;
}

.calc-sub {
  font-size: 13px;
  font-weight: 400;
  color: var(--text-3);
}

.calc-body {
  display: grid;
  gap: 12px;
  padding: 2px 12px 12px;
}

.calc-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 14px;
}

.calc-grid .span-2 {
  grid-column: 1 / -1;
}

.calc .input,
.calc .select {
  background-color: var(--surface);
}

.calc-amount {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 8px;
}

.calc-checks,
.calc-check,
.calc-out {
  display: grid;
  gap: 8px;
}

.calc-check {
  gap: 2px;
}

.calc-check[hidden] {
  display: none;
}

.calc-check .hint {
  padding-left: 24px;
}

.calc-empty {
  margin: 0;
  font-size: 13px;
  color: var(--text-3);
}

.calc-due {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
}

.calc-due-text {
  display: grid;
  gap: 2px;
}

.calc-due-label {
  font-size: 13px;
  color: var(--text-3);
}

.calc-due strong {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--text);
}

.calc-steps {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 20px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-2);
}

.calc-ref {
  margin-left: 6px;
  color: var(--text-3);
}

.calc-ref::before {
  content: "· ";
}

.calc-flag {
  display: inline-block;
  margin-left: 6px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--warn-soft);
  color: var(--warn);
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.6;
  white-space: nowrap;
}

.calc-warn ul {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
}

.calc-diff,
.calc-dayhint {
  margin: 0;
  font-size: 13px;
  color: var(--warn);
}

@media (max-width: 760px) {
  .calc-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .calc-use {
    width: 100%;
  }
}

.event-card {
  grid-template-columns: 56px minmax(0, 1fr) auto;
  align-items: start;
  gap: 14px;
}

.ev-date {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 2px;
  min-height: 66px;
  padding: 6px 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--text-2);
  font-variant-numeric: tabular-nums;
}

.ev-day {
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  color: var(--text);
}

.ev-month {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.ev-wd {
  font-size: 11px;
  color: var(--text-3);
}

.event-card.s-gecikti .ev-date {
  background: var(--danger-soft);
  border-color: color-mix(in srgb, var(--danger) 35%, transparent);
  color: var(--danger);
}

.event-card.s-gecikti .ev-day,
.event-card.s-gecikti .ev-wd {
  color: var(--danger);
}

.event-card.s-bugun .ev-date {
  background: var(--brand);
  border-color: var(--brand);
  color: var(--on-brand);
}

.event-card.s-bugun .ev-day,
.event-card.s-bugun .ev-wd {
  color: var(--on-brand);
}

.event-card.s-yakin .ev-date {
  background: var(--warn-soft);
  border-color: color-mix(in srgb, var(--warn) 30%, transparent);
  color: var(--warn);
}

.event-card.s-gecikti {
  border-color: color-mix(in srgb, var(--danger) 35%, var(--border));
}

.event-card.s-tamam {
  background: var(--surface-2);
  box-shadow: none;
}

.event-card.s-tamam .ev-date {
  opacity: 0.7;
}

.ev-body {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.ev-top {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

/* Tamamlayınca üstü ÇİZİLİR: çizgi baştan var ama saydam; rengi geçişle gelir. */
.ev-title {
  overflow-wrap: anywhere;
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: transparent;
  transition: text-decoration-color var(--motion-slow) var(--ease-smooth), color var(--motion-slow) var(--ease-smooth);
}

.event-card.s-tamam .ev-title,
.event-card.cizili .ev-title {
  color: var(--text-3);
  text-decoration-color: currentColor;
}

.event-card.s-tamam.aciliyor .ev-title {
  color: var(--text);
  text-decoration-color: transparent;
}

.ev-when {
  font-size: 13px;
  color: var(--text-2);
}

.ev-notes {
  margin: 2px 0 0;
  font-size: 13px;
  color: var(--text-3);
  white-space: pre-line;
}

.ev-actions {
  display: flex;
  gap: 4px;
  margin: 4px 0 0 -12px;
}

.ev-done {
  appearance: none;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--text-3);
  cursor: pointer;
  transition: background-color var(--motion-normal) var(--ease-smooth), color var(--motion-normal) var(--ease-smooth),
    border-color var(--motion-normal) var(--ease-smooth), scale var(--motion-fast) var(--ease-smooth);
}

.ev-done svg {
  width: 22px;
  height: 22px;
}

.ev-done:hover {
  color: var(--ok);
  border-color: color-mix(in srgb, var(--ok) 45%, transparent);
  background: var(--ok-soft);
}

.ev-done:active {
  scale: 0.92;
}

.ev-done[aria-pressed="true"] {
  background: var(--ok);
  border-color: var(--ok);
  color: var(--surface);
}

/* Sakin yeniden çizim (tamamla / ekle / sil sonrası): kademeli giriş tekrar oynamaz. */
.case-items.sakin > .case-item:not(.leaving) {
  animation: none;
}

/* Silinen / tamamlanan kart her durumda söner (kırbaçla çizilmiş listede de). */
.case-items.kirbac > .case-item.leaving,
.case-items > .case-item.leaving {
  animation: bobin-sonu var(--motion-slow) var(--ease-kapanis) both;
}

/* VURGU — paletten / şeritten gelinen olay bir kez halkayla işaretlenir. */
.case-items > .event-card.vurgu,
.case-items.sakin > .event-card.vurgu {
  animation: vurgu-halka 1800ms var(--ease-smooth) both;
}

@keyframes vurgu-halka {
  0%, 35% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 45%, transparent), var(--shadow-sm); }
  100% { box-shadow: 0 0 0 0 transparent, var(--shadow-sm); }
}

@media (max-width: 760px) {
  .event-card {
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px;
  }
}

/* Kaynak bağlamı bandı (dilekçe / rapor sayfasında bağlı dava dosyası). */
.case-context {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  background: var(--brand-soft);
  border-color: color-mix(in srgb, var(--brand) 30%, transparent);
  color: var(--text);
}

.case-context > svg {
  width: 18px;
  height: 18px;
  color: var(--brand);
  flex: none;
}

.case-context a {
  color: var(--brand);
  font-weight: 600;
}

/* Çekmece: bu karar hangi dosyalarda */
.doc-cases {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--text-2);
}

.doc-cases > svg {
  width: 16px;
  height: 16px;
  color: var(--brand);
}

.doc-cases a {
  color: var(--brand);
  font-weight: 600;
}

/* ---------- Mahkeme tamamlayıcısı (combobox önerileri) ---------- */

.suggest-wrap {
  position: relative;
}

.suggest {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 30;
  margin: 0;
  padding: 4px;
  list-style: none;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  max-height: 288px;
  overflow-y: auto;
  overscroll-behavior: contain;
  animation: drop-in var(--motion-fast) var(--ease-smooth) both;
}

/* Seçili öneri renkle birlikte 3px'lik sol şeritle de anlatılır (palet satırlarıyla aynı dil). */
.suggest li {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 6px 10px 6px 9px;
  border-left: 3px solid transparent;
  border-radius: 6px;
  font-size: 14px;
  color: var(--text);
  cursor: pointer;
  transition: background-color var(--motion-fast) var(--ease-smooth);
}

.suggest li[aria-selected="true"] {
  background: var(--brand-soft);
  border-left-color: var(--brand);
}

.suggest-text {
  flex: 1;
  min-width: 0;
}

/* İkinci bilgi (ör. "TBK m. 344" yanında madde başlığı): soluk, gerekirse alt satıra sarar. */
.suggest-detail {
  margin-left: 8px;
  font-size: 13px;
  color: var(--text-3);
}

.suggest-src {
  flex: none;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
}

/* ---------- Komut paleti (Ctrl+K) — HANVERON command-palette-panel ---------- */

.cmdk {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 10vh 16px 16px;
  background: color-mix(in srgb, #0e0e10 40%, transparent);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  animation: fade-in var(--motion-normal) var(--ease-smooth) both;
}

.cmdk.closing {
  animation: fade-out var(--motion-normal) var(--ease-kapanis) both;
  pointer-events: none;
}

.cmdk-panel {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 560px;
  max-height: min(560px, 80vh);
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  animation: cmdk-gel var(--motion-slow) var(--ease-sahne) both;
}

.cmdk.closing .cmdk-panel {
  animation: cmdk-git var(--motion-normal) var(--ease-kapanis) both;
}

@keyframes cmdk-gel {
  from { opacity: 0; transform: translateY(-8px) scale(0.98); }
}

@keyframes cmdk-git {
  to { opacity: 0; transform: translateY(-6px) scale(0.98); }
}

@keyframes sayfa-yukari {
  from { transform: translateY(100%); }
}

@keyframes sayfa-asagi {
  to { transform: translateY(100%); }
}

.cmdk-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-bottom: 1px solid var(--border);
  flex: none;
}

.cmdk-box {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 12px;
  border: 1px solid var(--control-border);
  border-radius: var(--radius);
  background: var(--surface);
  transition: border-color var(--motion-fast) var(--ease-smooth), box-shadow var(--motion-normal) var(--ease-smooth);
}

.cmdk-box:focus-within {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent);
}

.cmdk-box > svg {
  width: 16px;
  height: 16px;
  color: var(--text-3);
  flex: none;
}

.cmdk-input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 15px;
}

.cmdk-input::placeholder {
  color: var(--text-3);
  opacity: 1;
}

.cmdk-input::-webkit-search-cancel-button {
  display: none;
}

.cmdk-clear {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text-3);
  width: 28px;
  height: 28px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex: none;
  animation: fade-in var(--motion-fast) var(--ease-smooth) both;
}

.cmdk-clear:hover {
  background: var(--surface-3);
  color: var(--text);
}

.cmdk-clear svg {
  width: 14px;
  height: 14px;
}

.cmdk-cancel {
  display: none;
}

.cmdk-list {
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 4px 0;
}

.cmdk-group-title {
  margin: 0;
  padding: 10px 16px 4px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
}

/* Seçili satır YALNIZ renkle anlatılmaz: 3px'lik sol şerit de var (renk körlüğü /
   yüksek kontrast). Şeffaf kenarlık → seçili olmayan satırlar aynı hizada durur. */
.cmdk-option {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 6px 16px 6px 13px;
  border-left: 3px solid transparent;
  font-size: 14px;
  color: var(--text);
  cursor: pointer;
  transition: background-color var(--motion-fast) var(--ease-smooth), border-color var(--motion-fast) var(--ease-smooth);
}

.cmdk-option[aria-selected="true"] {
  border-left-color: var(--brand);
  background: var(--brand-soft);
}

.cmdk-list.ilk .cmdk-option {
  animation: rise-in var(--motion-normal) var(--ease-smooth) both;
  animation-delay: calc(min(var(--i, 0), 8) * 18ms);
}

.cmdk-option.taze {
  animation: rise-in var(--motion-slow) var(--ease-sahne) both;
  animation-delay: calc(var(--j, 0) * 28ms);
}

.cmdk-icon {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  border: 1px solid var(--border);
  color: var(--text-3);
  flex: none;
  transition: color var(--motion-fast) var(--ease-smooth), background-color var(--motion-fast) var(--ease-smooth);
}

.cmdk-option[aria-selected="true"] .cmdk-icon {
  color: var(--brand);
  background: var(--surface);
}

.cmdk-icon svg {
  width: 16px;
  height: 16px;
}

.cmdk-icon.court {
  background: color-mix(in srgb, var(--badge-color) 14%, var(--surface));
  border-color: color-mix(in srgb, var(--badge-color) 35%, transparent);
  color: var(--badge-color);
}

.cmdk-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.cmdk-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cmdk-sub {
  font-size: 13px;
  color: var(--text-3);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cmdk-label mark,
.cmdk-sub mark {
  background: transparent;
  color: var(--brand);
  font-weight: 700;
}

.cmdk-kind {
  flex: none;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-3);
}

.cmdk-option[aria-selected="true"] .cmdk-kind {
  color: var(--brand);
}

/* Takvim öğelerinde sağdaki etiket geri sayımdır; seçiliyken de durum rengini korur. */
.cmdk-kind.tone-gecikti,
.cmdk-kind.tone-bugun,
.cmdk-kind.tone-yakin {
  padding: 1px 8px 0;
  border-radius: 999px;
  line-height: 1.6;
  text-transform: none;
  letter-spacing: 0;
}

.cmdk-kind.tone-gecikti,
.cmdk-option[aria-selected="true"] .cmdk-kind.tone-gecikti {
  background: var(--danger-soft);
  color: var(--danger);
}

.cmdk-kind.tone-bugun,
.cmdk-option[aria-selected="true"] .cmdk-kind.tone-bugun {
  background: var(--brand);
  color: var(--on-brand);
}

.cmdk-kind.tone-yakin,
.cmdk-option[aria-selected="true"] .cmdk-kind.tone-yakin {
  background: var(--warn-soft);
  color: var(--warn);
}

.cmdk-kind.tone-ileri {
  text-transform: none;
  letter-spacing: 0;
}

.cmdk-empty {
  padding: 28px 16px;
  text-align: center;
  font-size: 14px;
  color: var(--text-3);
  animation: fade-in var(--motion-normal) var(--ease-smooth) both;
}

.cmdk-skeleton {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 6px 16px;
}

.cmdk-skeleton .skeleton:first-child {
  width: 32px;
  height: 32px;
  flex: none;
}

.cmdk-skeleton .lines {
  flex: 1;
  display: grid;
  gap: 6px;
}

.cmdk-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 40px;
  padding: 6px 16px;
  border-top: 1px solid var(--border);
  font-size: 12px;
  color: var(--text-3);
  flex: none;
}

.cmdk-foot button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 4px 0;
  cursor: pointer;
  text-underline-offset: 2px;
}

.cmdk-foot button:hover {
  color: var(--text);
  text-decoration: underline;
}

.cmdk-foot kbd {
  font-size: 11px;
  padding: 0 4px;
}

body.scroll-kilit {
  overflow: hidden;
}

/* ---------- Responsive ---------- */

@media (max-width: 1280px) {
  /* Kâğıt ile düzenleme paneli yan yana kalır; form alanları iki sütun. */
  .draft-layout {
    grid-template-columns: minmax(0, 1fr) 340px;
  }

  .draft-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1024px) {
  .research-layout,
  .draft-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .draft-sidebar {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ingest-grid,
  .two-col {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Durum şeritte yalnız renkli nokta (ad aria-label'da, açıklama dokununca açılan kartta). Yazı eskiden 1440 px üstünde
   görünüyordu; ama şerit her genişlikte 1280 px'e sınırlı ve sekiz başlıkla ona yer kalmıyor: 1446 px'te yardım ve
   tema simgeleri sayfa kenarından taşıyordu (1.11.2026). Bölüm adları KIRPILMAZ. */
.status-dot .status-text {
  display: none;
}

.status-dot {
  padding: 0 10px;
}

@media (max-width: 1280px) {
  .brand-tagline {
    display: none;
  }

  .case-chip {
    max-width: 150px;
  }
}

/* Telefon: gecikmiş rozeti ve yapay zekâ durumu varken menü düğmesi ekrandan taşmasın; marka yalnız simge. */
@media (max-width: 420px) {
  .brand-text {
    display: none;
  }

  .topbar-actions {
    gap: 6px;
  }
}

@media (max-width: 1024px) {
  .cases-layout {
    grid-template-columns: 280px minmax(0, 1fr);
  }
}

/* Sekiz başlık + arama + aktif dosya çipi bu genişliğin altında sığmaz → başlıklar çekmeceye iner. */
@media (max-width: 1280px) {
  .topbar-inner {
    padding: 0 16px;
    gap: 8px;
  }

  .menu-toggle {
    display: inline-grid;
  }

  .nav {
    position: absolute;
    top: var(--header-h);
    left: 0;
    right: 0;
    align-self: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    margin: 0;
    padding: 8px 12px 12px;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow);
    display: none;
  }

  .nav.open {
    display: flex;
    animation: drop-in var(--motion-normal) var(--ease-smooth) both;
  }

  .nav.open a {
    animation: rise-in var(--motion-normal) var(--ease-smooth) both;
    animation-delay: calc(var(--i, 0) * 22ms);
  }

  .nav-heading {
    display: block;
    padding: 6px 12px 4px;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-3);
  }

  .nav-iz {
    display: none;
  }

  .nav a[aria-current="page"] {
    background: var(--brand-soft);
    box-shadow: inset 3px 0 0 var(--brand);
  }

  .cmdk-trigger {
    width: auto;
    flex: 1 1 auto;
    max-width: 22rem;
  }
}

/* Dosya sayfası tek sütun: liste ↔ ayrıntı arasında geçilir (← Dosyalar). */
@media (max-width: 900px) {
  .cases-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .cases-side {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .cases-layout.showing-detail .cases-side,
  .cases-layout:not(.showing-detail) .cases-main {
    display: none;
  }

  .case-back {
    display: inline-flex;
  }
}

@media (max-width: 760px) {
  body {
    font-size: 15px;
  }

  .cmdk-trigger {
    display: none;
  }

  .cmdk-trigger-mobile {
    display: grid;
  }

  /* Palet mobilde TAM EKRAN; `100dvh` klavye açılınca daralır → liste görünür kalır. */
  .cmdk {
    padding: 0;
    align-items: stretch;
  }

  .cmdk-panel {
    max-width: none;
    max-height: none;
    height: 100dvh;
    border: 0;
    border-radius: 0;
    padding-top: env(safe-area-inset-top);
  }

  .cmdk-input {
    font-size: 16px; /* iOS 16px altında odakta sayfayı kendiliğinden yakınlaştırır */
  }

  .cmdk-cancel {
    display: inline-flex;
  }

  .cmdk-foot .cmdk-keys {
    display: none;
  }

  /* Diyalog mobilde alttan açılan sayfa (başparmak erişimi). */
  .dialog {
    width: 100vw;
    max-width: 100vw;
    max-height: 92dvh;
    margin: auto 0 0;
    border-radius: 16px 16px 0 0;
    border-bottom: 0;
    padding-bottom: env(safe-area-inset-bottom);
    animation-name: sayfa-yukari;
  }

  .dialog.closing {
    animation-name: sayfa-asagi;
  }

  .case-chip {
    max-width: 40px;
    padding: 0;
    justify-content: center;
  }

  .case-chip-text,
  .case-chip-x {
    display: none;
  }

  .case-chip-link {
    width: 38px;
    height: 34px;
    justify-content: center;
  }

  /* Şeritte yalnız simge + sayı. */
  .agenda-chip {
    height: 34px;
    min-width: 40px;
    padding: 0 9px;
    gap: 4px;
    justify-content: center;
  }

  .agenda-chip-text {
    display: none;
  }

  .page {
    padding: 16px 16px 48px;
  }

  .page-head h1 {
    font-size: 21px;
  }

  .search-input {
    font-size: 16px;
  }

  .filters-toggle {
    display: inline-flex;
  }

  .filters-body {
    display: none;
  }

  .filters.open .filters-body {
    display: grid;
  }

  .filter-grid,
  .form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .draft-sidebar {
    grid-template-columns: minmax(0, 1fr);
  }

  .draft-toolbar .spacer {
    display: none;
  }

  .stat-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
  }

  .stat-value {
    font-size: 1.3rem;
  }

  .bar-row {
    grid-template-columns: minmax(70px, 110px) minmax(0, 1fr) 52px;
  }

  .drawer {
    width: 100vw;
  }

  .drawer-head,
  .drawer-body,
  .drawer-actions {
    padding-left: 16px;
    padding-right: 16px;
  }

  .paper {
    padding: 22px 18px;
    min-height: auto;
  }

  .paper-editor {
    min-height: 60vh;
    font-size: 11.5pt;
  }

  .toasts {
    left: 16px;
    right: 16px;
    width: auto;
  }
}

@media (max-width: 420px) {
  .stat-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .result-cite {
    font-size: 0.94rem;
  }
}

/* Dokunmatik ekranda tüm hedefler en az 44px (WCAG 2.5.5). */
@media (pointer: coarse) {
  .btn-sm,
  .chip,
  .segmented button {
    min-height: 44px;
  }
}

/* Azaltılmış hareket: kill-switch EN SONDA durmalı. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ==========================================================================
   Site: oturum (giriş, davet, iki aşamalı doğrulama), kullanıcı menüsü, ayarlar, yönetim.
   Yalnız mevcut jetonlar. Oturumsuzken üst şeritte yalnız marka ve tema düğmesi kalır.
   ========================================================================== */
body[data-auth="out"] #main-nav,
body[data-auth="out"] .cmdk-trigger,
body[data-auth="out"] .cmdk-trigger-mobile,
body[data-auth="out"] #agenda-chip,
body[data-auth="out"] #case-chip,
body[data-auth="out"] #health-dot,
body[data-auth="out"] .menu-toggle,
body[data-auth="out"] #help-btn,
body[data-auth="out"] #user-menu {
  display: none !important;
}

#app .skeleton-line.w-40 { width: 40%; }
#app .skeleton-line.w-90 { width: 90%; }
#app .skeleton-line.w-75 { width: 75%; }

.auth-wrap {
  display: grid;
  justify-items: center;
  padding: clamp(16px, 6vh, 64px) 0 32px;
}
.auth-card {
  width: min(460px, 100%);
  padding: 28px;
}
.card .auth-wrap { padding: 12px 0 0; justify-items: stretch; }
.card .auth-card { width: 100%; padding: 0; border: 0; box-shadow: none; background: none; }
.card .auth-card .auth-brand { display: none; } /* ayarlar kartının içindeki kurulum adımında marka tekrarlanmaz */
.auth-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.auth-title {
  font-size: 22px;
  margin: 18px 0 4px;
}
.auth-sub {
  color: var(--text-3);
  font-size: 14px;
  margin: 0 0 18px;
}
.auth-form {
  display: grid;
  gap: 14px;
}
.auth-row { margin: 12px 0; }
.auth-steps {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 12px;
  font-size: 14px;
  color: var(--text-2);
}
.otp-input {
  font-family: var(--font-mono);
  font-size: 22px;
  letter-spacing: 0.4em;
  text-align: center;
}
.qr-box {
  width: fit-content;
  margin: 10px auto 8px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}
.qr-box svg {
  display: block;
  width: 196px;
  height: 196px;
}
.secret-key {
  font-family: var(--font-mono);
  letter-spacing: 0.06em;
  word-break: break-all;
}
.recovery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 15px;
}
.recovery-grid span {
  padding: 8px 10px;
  text-align: center;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
}
.kvkk-box {
  max-height: 200px;
  overflow: auto;
  padding: 10px 14px;
  font-size: 13px;
  color: var(--text-2);
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.kvkk-box p { margin: 6px 0; }

.user-menu { position: relative; }
.user-btn {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--brand-soft);
  color: var(--brand);
  font: inherit;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  transition: border-color var(--motion-fast) var(--ease-smooth);
}
.user-btn:hover { border-color: var(--border-strong); }
.user-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.user-pop {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 70;
  min-width: 230px;
  padding: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}
.user-pop[hidden] { display: none; }
.user-pop .who {
  padding: 8px 10px 10px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--border);
}
.user-pop a,
.user-pop button {
  display: block;
  width: 100%;
  padding: 9px 10px;
  border: 0;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.user-pop a:hover,
.user-pop button:hover {
  background: var(--surface-2);
  outline: none;
}

.user-pop a:focus-visible,
.user-pop button:focus-visible {
  background: var(--surface-2);
  outline: 2px solid var(--focus);
  outline-offset: -2px;
}

.strong { font-weight: 600; }
.row-tight { gap: 6px; flex-wrap: wrap; }
.row-muted td { opacity: 0.6; }
.select-sm { padding-top: 4px; padding-bottom: 4px; min-height: 32px; min-width: 118px; font-size: 13px; }
.kv-list {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 18px;
  margin: 0;
  font-size: 14px;
}
.kv-list dt { color: var(--text-3); }
.kv-list dd { margin: 0; }
.settings-page,
.admin-page { gap: 16px; }
.settings-inline { align-items: flex-end; gap: 12px; }
.usage-meter {
  height: 8px;
  margin: 6px 0;
  overflow: hidden;
  border-radius: 999px;
  background: var(--surface-3);
}
.usage-meter > span {
  display: block;
  height: 100%;
  background: var(--brand);
  transition: width var(--motion-normal) var(--ease-smooth);
}
.usage-meter.warn > span { background: var(--warn); }
.usage-meter.danger > span { background: var(--danger); }
.usage-cell { min-width: 150px; }
.invite-result {
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}
.invite-link {
  font-family: var(--font-mono);
  font-size: 13px;
  word-break: break-all;
}

@media (max-width: 640px) {
  .auth-card { padding: 20px; }
  .recovery-grid { grid-template-columns: 1fr 1fr; font-size: 14px; }
  .kv-list { grid-template-columns: 1fr; gap: 2px; }
  .kv-list dd { margin-bottom: 8px; }
}

/* Evrak sekmesi (components/evrak.js) */

.evrak {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.evrak-pane {
  display: grid;
  gap: 12px;
  min-width: 0;
}

/* Yükleme alanı: sürükle-bırak bölgesi; erişilebilir asıl öğe "Dosya seç" düğmesi. */
.evrak-drop {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 16px;
  padding: 14px 16px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius);
  background: var(--surface-2);
  transition:
    border-color var(--motion-fast) var(--ease-smooth),
    background-color var(--motion-fast) var(--ease-smooth);
}

.evrak-drop.is-over {
  border-color: var(--brand);
  background: var(--brand-soft);
}

.evrak-drop-text {
  flex: 1 1 260px;
  min-width: 0;
}

.evrak-drop-title {
  margin: 0 0 2px;
  font-weight: 600;
  color: var(--text);
}

.evrak-drop-drag {
  font-weight: 400;
  color: var(--text-3);
}

.evrak-drop-hint {
  margin: 0;
  font-size: 13px;
  color: var(--text-3);
  overflow-wrap: anywhere;
}

/* Yükleme ilerlemesi: parti başına satırlar; parti bitince kalkar (özet bildirimde). */
.evrak-up {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.evrak-up:empty {
  display: none;
}

.evrak-up-batch {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.evrak-up-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
  min-width: 0;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  font-size: 13px;
  color: var(--text-2);
}

.evrak-up-name {
  flex: 1 1 180px;
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text);
}

.evrak-up-status {
  flex: 0 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
  text-align: right;
}

.evrak-up-row[data-tone="ok"] .evrak-up-status { color: var(--ok); }
.evrak-up-row[data-tone="warn"] .evrak-up-status { color: var(--warn); }
.evrak-up-row[data-tone="err"] .evrak-up-status { color: var(--danger); }

.evrak-ocr {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.evrak-ocr:empty,
.evrak-list-note:empty {
  display: none;
}

.evrak-filter {
  min-width: 0;
}

/* Liste */

.evrak-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.evrak-item {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}

.evrak-item-top,
.evrak-page-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}

.evrak-item-title {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.evrak-meta {
  margin: 0;
  font-size: 13px;
  color: var(--text-3);
  overflow-wrap: anywhere;
}

.evrak-note {
  margin: 0;
  font-size: 13px;
  color: var(--text-2);
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.evrak-item-actions,
.evrak-detail-actions,
.evrak-page-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.evrak-item-actions {
  padding-top: 4px;
}

.evrak-item-actions .btn-danger {
  margin-left: auto;
}

/* Durum çipi: renk ve metin birlikte (yalnız renge dayanmaz). */
.evrak-status {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.6;
  padding: 1px 9px 0;
  border-radius: 999px;
  white-space: nowrap;
  background: var(--surface-3);
  color: var(--text-2);
}

.evrak-status.s-isleniyor { background: var(--brand-soft); color: var(--brand); }
.evrak-status.s-hazir { background: var(--ok-soft); color: var(--ok); }
.evrak-status.s-kismi { background: var(--warn-soft); color: var(--warn); }
.evrak-status.s-okunamadi,
.evrak-status.s-hata { background: var(--danger-soft); color: var(--danger); }

/* Ayrıntı */

.evrak-back {
  justify-self: start;
}

.evrak-detail-head {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.evrak-detail-title {
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.evrak-pages {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.evrak-page {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}

/* Okunamayan sayfa: sol kenarda uyarı çizgisi ve metinde "Okunamadı" (renk tek başına değil). */
.evrak-page.is-unreadable {
  border-left: 4px solid var(--warn);
}

.evrak-page-no {
  font-size: 14px;
  font-weight: 700;
}

.evrak-unread {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--warn);
}

/* Sayfa metni: beyaz boşluk korunur, uzun satır taşmaz. */
.evrak-page-text {
  min-width: 0;
  max-width: 72ch;
  font-family: var(--font-doc);
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--text);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.evrak-page-text.is-empty {
  color: var(--text-3);
  font-style: italic;
}

.evrak-page-editor {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.evrak-page-edit {
  min-height: 120px;
  font-family: var(--font-doc);
  font-size: 14.5px;
  line-height: 1.6;
}

/* Düzeltme geçmişi */

.evrak-hist {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 10px 0 0;
  list-style: none;
  border-top: 1px dashed var(--border);
  font-size: 13px;
}

.evrak-hist li {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.evrak-hist-at {
  font-size: 12px;
  color: var(--text-3);
  font-variant-numeric: tabular-nums;
}

.evrak-hist-line {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  margin: 0;
  color: var(--text-2);
}

.evrak-hist-label {
  font-weight: 600;
  color: var(--text-3);
}

.evrak-hist-text {
  min-width: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* Dar ekran (telefon): sürükle-bırak metni gizlenir; düğme ve listeler sığar. */
@media (max-width: 760px) {
  .evrak-drop {
    padding: 12px;
  }

  .evrak-drop-drag {
    display: none;
  }

  .evrak-item,
  .evrak-page {
    padding: 12px;
  }

  .evrak-up-status {
    flex-basis: 100%;
    text-align: left;
  }

  .evrak-page-edit {
    min-height: 160px;
  }
}

/* Takvim olayına kayıtlı süre hesabı (cases.js calcView) */
.ev-calc {
  margin-top: 6px;
  font-size: 13px;
  color: var(--text-2);
}

.ev-calc > summary {
  min-height: 32px;
  cursor: pointer;
  font-weight: 600;
}

.ev-calc-meta {
  font-weight: 400;
  color: var(--text-3);
}

.ev-calc .notice {
  margin: 6px 0;
}

.ev-calc .calc-steps {
  margin: 6px 0 0;
}

.ev-calc-warn {
  margin: 6px 0 0;
  padding-left: 18px;
  color: var(--warn);
}

/* ---------- Kaynak envanteri (Kaynaklar sayfası, data.js) ---------- */
.inventory-lead {
  margin: 0 0 12px;
}

.inventory-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

.inventory-body > * {
  min-width: 0;
}

.inventory .table td {
  overflow-wrap: anywhere;
}

.inventory-name {
  font-weight: 600;
  color: var(--text);
  overflow-wrap: anywhere;
}

.inventory-sub {
  margin: 0 0 8px;
}

.inventory-more {
  margin-top: 6px;
}

.inventory-more > summary {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  font-size: 13px;
  font-weight: 600;
  color: var(--brand);
  cursor: pointer;
  list-style: none;
}

.inventory-more > summary::-webkit-details-marker {
  display: none;
}

.inventory-more > summary:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

.inventory-more > p {
  margin: 6px 0 0;
  overflow-wrap: anywhere;
}

.inventory-verify {
  color: var(--text-2);
}

.inventory .inventory-faded {
  background: var(--surface-2);
  color: var(--text-3);
}

.inventory-notes {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
}

@media (max-width: 760px) {
  .inventory .table th,
  .inventory .table td {
    padding: 8px 10px;
  }
}

/* ---------- Kaynak sağlık raporu (Kaynaklar sayfası, data.js; hanlaw/sourcehealth.py) ---------- */
.tag.tag-danger {
  background: var(--danger-soft);
  color: var(--danger);
  border-color: transparent;
}

.health-card {
  margin-top: 18px;
}

.health-lead {
  margin: 0 0 6px;
}

.health-body {
  display: grid;
  gap: 6px;
  margin-top: 10px;
  min-width: 0;
}

.health-total {
  gap: 8px;
  margin-bottom: 4px;
}

.health-court {
  min-width: 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.health-court-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  min-height: 40px;
  padding: 6px 12px;
}

/* Açılır satırda ok işareti; düz satırda aynı genişlikte boşluk (adlar hizalı kalsın). */
.health-court-row::before {
  content: '';
  flex: none;
  width: 10px;
  color: var(--text-3);
  transition: transform 0.15s;
}

details > .health-court-row {
  cursor: pointer;
  list-style: none;
}

details > .health-court-row::-webkit-details-marker {
  display: none;
}

details > .health-court-row::before {
  content: '▸';
}

details[open] > .health-court-row::before {
  transform: rotate(90deg);
}

details > .health-court-row:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
  border-radius: var(--radius);
}

.health-court-name {
  font-weight: 600;
  color: var(--text);
}

.health-counts {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-left: auto;
}

.health-checks {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 0 12px 12px 34px;
  list-style: none;
  border-top: 1px solid var(--border);
}

.health-checks > li {
  min-width: 0;
  padding-top: 10px;
}

.health-check-head {
  gap: 8px;
}

.health-checks p {
  margin: 4px 0 0;
}

.health-examples {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  margin-top: 6px;
  overflow-wrap: anywhere;
}

.health-examples .linkish {
  text-align: left;
}

@media (max-width: 760px) {
  .health-checks {
    padding-left: 12px;
  }
}

/* ---------- Atıf denetimi (components/citecheck.js) ---------- */
.cite-check {
  margin-top: 16px;
  padding: 14px;
  min-width: 0;
  overflow-wrap: anywhere;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.cite-check[hidden],
.cite-check [hidden] {
  display: none;
}

.cite-check-head {
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 6px;
}

.cite-check-title {
  margin: 0;
}

.cite-check > .hint {
  margin: 0 0 12px;
}

.cite-check-stale {
  margin-bottom: 12px;
}

.cite-check.is-stale .cite-check-body {
  opacity: 0.55;
}

.cite-check-summary {
  margin: 0 0 12px;
  font-weight: 600;
  color: var(--text-2);
}

.cite-check-list,
.cite-check-quotes,
.cite-check-notes {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.cite-check-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.cite-check-cite,
.cite-check-msg {
  margin: 0;
}

.cite-check-msg {
  color: var(--text-2);
}

.cite-check-quotes {
  margin-top: 4px;
}

.cite-check-quote {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 2px 0 2px 12px;
  border-left: 3px solid var(--border);
}

.cite-check-quote-text {
  margin: 0;
  font-style: italic;
  color: var(--text-2);
}

.cite-check-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.cite-check .tag {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.cite-check .cite-check-warn {
  background: var(--warn-soft);
  color: var(--warn);
  border-color: color-mix(in srgb, var(--warn) 30%, transparent);
}

.cite-check .cite-check-danger {
  background: var(--danger-soft);
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 30%, transparent);
}

.cite-check-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.cite-check-passage summary {
  cursor: pointer;
  color: var(--brand);
}

.cite-check-passage-text {
  margin: 8px 0 0;
  padding: 10px 12px;
  background: var(--surface-2);
  border-radius: var(--radius-sm);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.cite-check-scope {
  margin: 14px 0 0;
  color: var(--text-2);
}

.cite-check-notes {
  margin-top: 8px;
  color: var(--text-3);
}

@media (max-width: 640px) {
  .cite-check .btn,
  .cite-check-trigger {
    min-height: 44px;
  }
}

/* Tebligat paneli */

/* Takvim sekmesinin üstündeki tek satırlık not. */
.tb-agenda-note {
  margin: 0 0 10px;
}

/* Tebligattan süre paneli: kutu ve düğmeler süre hesaplayıcının (.calc, .calc-*) sınıflarını kullanır. */
.tb-label {
  margin: 0;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-3);
}

.tb-line {
  margin: 0;
  font-size: 14px;
  color: var(--text-2);
}

.tb-line strong {
  color: var(--text);
  font-weight: 600;
}

.tb-snip {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-3);
  overflow-wrap: anywhere;
}

.tb-note {
  margin: 0;
  font-size: 13px;
  color: var(--text-3);
}

/* Öneri hazır ve takvime eklenmiş süre: ok tonu. */
.tb-ok {
  background: var(--ok-soft);
  border-color: color-mix(in srgb, var(--ok) 40%, transparent);
  color: var(--text);
}

.tb-saved {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
}

.tb-saved .btn {
  margin-left: auto;
}

.tb-dates {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tb-date {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
}

.tb-date-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
}

.tb-role {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-3);
}

.tb-page {
  font-size: 13px;
  color: var(--brand);
}

.tb-use {
  margin-left: auto;
}

@media (max-width: 760px) {
  .tb-accept {
    width: 100%;
  }
}

/* Evrak resmen gönderildi (UYAP) işareti: ok tonu. */
.ev-filed.on,
.ev-filed.on:hover:not(:disabled) {
  background: var(--ok-soft);
  border-color: color-mix(in srgb, var(--ok) 45%, transparent);
  color: var(--ok);
}

/* Olay kartının işlem düğmeleri dar ekranda alt satıra geçer; taşma olmaz. */
.event-card .ev-actions {
  flex-wrap: wrap;
}

/* ---------- Dilekçe son kontrolü (components/draftcheck.js) ---------- */
.draft-check {
  margin-top: 16px;
  padding: 14px;
  min-width: 0;
  overflow-wrap: anywhere;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.draft-check[hidden],
.draft-check [hidden] {
  display: none;
}

.draft-check-head {
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 6px;
}

.draft-check-title {
  margin: 0;
}

.draft-check > .hint {
  margin: 0 0 12px;
}

.draft-check-stale {
  margin-bottom: 12px;
}

.draft-check.is-stale .draft-check-body {
  opacity: 0.55;
}

.draft-check-summary {
  margin: 0 0 4px;
  font-weight: 600;
  color: var(--text-2);
}

.draft-check-group {
  margin-top: 14px;
}

.draft-check-group-title {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-2);
}

.draft-check-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.draft-check-item {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.draft-check-item-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  min-width: 0;
}

.draft-check-msg {
  margin: 0;
}

.draft-check-where {
  font-size: 12px;
  color: var(--text-3);
}

.draft-check .tag {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.draft-check .draft-check-warn {
  background: var(--warn-soft);
  color: var(--warn);
  border-color: color-mix(in srgb, var(--warn) 30%, transparent);
}

.draft-check .draft-check-danger {
  background: var(--danger-soft);
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 30%, transparent);
}

.draft-check-note {
  margin: 14px 0 0;
  color: var(--text-3);
}

@media (max-width: 640px) {
  .draft-check .btn,
  .draft-check-trigger,
  .draft-memory {
    min-height: 44px;
  }
}

/* ---------- İş akışı (components/workflow.js) ---------- */
.wf { display: grid; gap: 14px; min-width: 0; }
.wf-kinds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 12px 0; }
.wf-kind { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; padding: 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); cursor: pointer; }
.wf-kind:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.wf-kind:focus-within { outline: 2px solid var(--brand); outline-offset: 2px; }
.wf-kind input { margin-top: 3px; accent-color: var(--brand); }
.wf-kind-body { display: grid; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
.wf-kind-body .hint { margin: 0; }
.wf-actions { justify-content: flex-end; }
.wf-questions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.wf-summary { margin: 4px 0 0; font-size: 13px; font-weight: 600; color: var(--text-2); }
.wf-group { display: grid; gap: 10px; }
.wf-group-title { margin: 6px 0 0; padding-bottom: 6px; border-bottom: 1px solid var(--border); font-size: 14px; color: var(--text-2); }
.wf-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.wf-item { display: grid; gap: 8px; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
.wf-item.is-done { background: var(--surface-2); }
.wf-item.is-done .wf-text { color: var(--text-3); text-decoration: line-through; }
.wf-item-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.wf-text { margin: 0; line-height: 1.5; overflow-wrap: anywhere; }
.wf-ref { font-size: 12px; color: var(--text-3); overflow-wrap: anywhere; }
.wf-elle { font-size: 12px; font-style: italic; color: var(--text-3); }
.wf-chip { display: inline-flex; align-items: center; padding: 2px 9px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-2); color: var(--text-2); font-size: 12px; font-weight: 600; }
.wf-st-gerekli { background: var(--brand-soft); border-color: transparent; color: var(--brand); }
.wf-st-uygulanmaz { color: var(--text-3); }
.wf-st-bilgi_eksik { background: var(--warn-soft); border-color: transparent; color: var(--warn); }
.wf-st-degerlendirme { background: var(--warn-soft); border-color: var(--warn); color: var(--warn); }
.wf-item-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.wf-field { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-2); }
.wf-note summary { display: flex; align-items: center; min-height: 44px; font-size: 13px; color: var(--text-2); cursor: pointer; }
.wf-note-in { width: 100%; margin-top: 4px; }
.wf-foot { display: flex; justify-content: flex-end; }

/* ---------- Duruşma hazırlığı (components/hearing.js) ---------- */
.hearing { display: grid; gap: 16px; min-width: 0; color: var(--text); }
.hearing-title { margin: 0; font-size: 20px; }
.hearing-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.hearing-toolbar .hint { margin: 0; }
.hearing-sec { display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.hearing-h { margin: 0; font-size: 14px; font-weight: 700; }
.hearing-empty { margin: 0; font-size: 13px; color: var(--text-3); }
.hearing-meta dd { margin: 0; white-space: pre-line; overflow-wrap: anywhere; }
.hearing-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hearing-item { display: grid; gap: 4px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
.hearing-item-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.hearing-item-title { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.hearing-meta-line { margin: 0; font-size: 13px; color: var(--text-2); overflow-wrap: anywhere; }
.hearing-flag { padding: 2px 8px; border-radius: 999px; background: var(--warn-soft); color: var(--warn); font-size: 12px; font-weight: 600; }
.hearing-note { margin: 0; font-size: 12px; color: var(--text-3); }

@media (max-width: 640px) {
  .wf-kinds, .wf-questions { grid-template-columns: 1fr; }
  .wf-actions .btn, .wf-foot .btn, .hearing-toolbar .btn { min-height: 44px; width: 100%; }
  .wf-status { min-height: 44px; }
  .wf-item-ctl .check { min-height: 44px; }
  .wf-field { display: flex; flex-direction: column; align-items: stretch; width: 100%; }
}

/* Duruşma hazırlığı yazdırılırken yalnız diyalog basılır */
@media print {
  @page { margin: 16mm; }
  body > *:not(dialog) { display: none !important; }
  dialog.dialog { position: static !important; inset: auto !important; width: auto !important; max-width: none !important; max-height: none !important; overflow: visible !important; margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; }
  .dialog-head, .dialog-foot, .hearing-noprint { display: none !important; }
  .hearing-sec, .hearing-item, .wf-item { break-inside: avoid; }
}

/* ---------- Delil tablosu (components/facts.js) ---------- */
.facts { display: grid; gap: 12px; }
.facts .facts-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.facts .facts-intro { margin: 0; flex: 1 1 260px; color: var(--text-3); }
.facts .facts-body { min-width: 0; }
.facts .facts-text { margin: 4px 0 0; font-size: 0.88rem; line-height: 1.45; overflow-wrap: anywhere; }
.facts .facts-date { margin: 4px 0 0; }
.facts .facts-kind { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; background: var(--surface-2); color: var(--text-2); }
.facts .facts-kind-iddia { background: var(--warn-soft); color: var(--warn); }
.facts .facts-kind-olay { background: var(--ok-soft); color: var(--ok); }
.facts .facts-status { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 0.78rem; font-weight: 600; background: var(--surface-2); color: var(--text-2); }
.facts .facts-st-destekleniyor { background: var(--ok-soft); color: var(--ok); }
.facts .facts-st-celiskili,
.facts .facts-st-eksik { background: var(--warn-soft); color: var(--warn); }
.facts .facts-st-curutuldu { background: var(--danger-soft); color: var(--danger); }
.facts .facts-refs { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.facts .facts-ref { display: flex; align-items: flex-start; gap: 4px; }
.facts .facts-ref-open { flex: 1; min-width: 0; display: grid; gap: 2px; padding: 4px 8px; text-align: left; font: inherit; font-size: 0.84rem; color: var(--brand); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); cursor: pointer; }
.facts .facts-ref-title { font-weight: 600; overflow-wrap: anywhere; }
.facts .facts-ref-page { color: var(--text-3); font-size: 0.8rem; }
.facts .facts-ref-passage { color: var(--text-2); font-size: 0.8rem; overflow-wrap: anywhere; }
.facts .facts-ref-gone { padding: 4px 8px; font-size: 0.84rem; font-style: italic; color: var(--text-3); }
.facts .facts-ref-x { flex: none; min-width: 28px; min-height: 28px; font: inherit; font-size: 1.1rem; line-height: 1; color: var(--text-3); background: transparent; border: 0; border-radius: var(--radius-sm); cursor: pointer; }
.facts .facts-ref-x:hover { color: var(--danger); background: var(--danger-soft); }
.facts .facts-table td.facts-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.facts .facts-suggest { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); padding: 0 14px; }
.facts .facts-suggest > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; font-weight: 650; color: var(--text); }
.facts .facts-sug-body { display: grid; gap: 10px; padding: 0 0 14px; }
.facts .facts-sug-note,
.facts .facts-sug-meta { margin: 0; }
.facts .facts-sug-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.facts .facts-sug { display: grid; gap: 6px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); }
.facts .facts-sug .btn { justify-self: start; }
@media (max-width: 640px) {
  .facts .facts-wrap { border: 0; background: transparent; overflow: visible; }
  .facts .facts-table thead { display: none; }
  .facts .facts-table,
  .facts .facts-table tbody,
  .facts .facts-table tr,
  .facts .facts-table td { display: block; width: 100%; }
  .facts .facts-table tbody tr { margin-bottom: 10px; padding: 12px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
  .facts .facts-table td { padding: 6px 0; border: 0; }
  .facts .facts-table td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 2px; font-size: 0.72rem; font-weight: 650; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-3); }
  .facts .facts-table td.facts-actions { flex-direction: row; flex-wrap: wrap; gap: 8px; padding-top: 10px; border-top: 1px solid var(--border); }
  .facts .btn,
  .facts .facts-ref-open,
  .facts .facts-ref-x,
  .facts .facts-suggest > summary { min-height: 44px; }
  .facts .facts-ref-x { min-width: 44px; }
}

/* ---------- Sürümler diyaloğu (pages/cases.js) ---------- */
.versions .versions-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.versions .version { display: grid; gap: 6px; padding: 10px 12px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.versions .version-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 10px; }
.versions .version-at { font-weight: 650; font-size: 0.9rem; color: var(--text); }
.versions .version-title { margin: 0; font-size: 0.88rem; color: var(--text-2); }
.versions .version-snippet,
.versions .version-full { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 0.86rem; color: var(--text-2); }
.versions .version-more > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--brand); font-size: 0.88rem; }
.versions .version > .btn { justify-self: start; }
@media (max-width: 640px) {
  .versions .btn { min-height: 44px; }
}

/* Dava dosyası sekmeleri: dokuz sekme — adlar kırılmaz, sığmazsa çubuk yatay kayar */
.case-tabs {
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: thin;
}

.case-tabs > * {
  white-space: nowrap;
  flex: none;
}

/* ---------- Arama süzgeçleri: Olmalı / Olmamalı / Yer, başlık modu (filters.js, search.js) ---------- */
/* Üstteki .filter-grid ile aynı sütunlar (4 → 1024 px'te 2 → 760 px'te 1): kenarlar alt alta denk gelir, Yer
   Daire'nin altındadır; Olmalı iki sütun. Alanlar satır yüksekliğine uzar ve açıklama boşluğu doldurur: açıklaması
   kısa olanın kutusu yukarıda kalmaz (1.11.2026: Yer, iki satırlık açıklamalı komşularından 22 px yukarıdaydı). */
.filt-text {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}

.filt-text > .field:first-child {
  grid-column: span 2;
}

.filt-text > .field > .hint:first-of-type {
  flex-grow: 1;
}

/* Boş uyarı satırı (en çok etiket uyarısı) kutunun altına aralık eklemesin. */
.filt-text > .field > .hint:empty {
  display: none;
}

@media (max-width: 1024px) {
  .filt-text {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .filt-text {
    grid-template-columns: minmax(0, 1fr);
  }

  .filt-text > .field:first-child {
    grid-column: auto;
  }
}

.filt-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.filt-tags[hidden] {
  display: none;
}

.filt-tag {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 36px;
  padding-left: 12px;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: var(--surface-3);
  color: var(--text-2);
  font-size: 13px;
  font-weight: 500;
}

.filt-tag-text {
  min-width: 0;
  overflow-wrap: anywhere;
}

.filt-tag-x {
  flex: none;
  display: inline-grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  margin: -4px 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--text-3);
  font: inherit;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.filt-tag-x:hover {
  background: var(--surface-2);
  color: var(--text);
}

.filt-modes {
  flex-wrap: wrap;
  max-width: 100%;
}

@media (max-width: 640px) {
  .filt-modes {
    border-radius: var(--radius);
  }

  .filt-modes button {
    min-height: 44px;
  }
}

/* ---- Okuyucu araçları (reader-tools.js): çoklu vurgu, kalıcı işaretler, atıf biçimleri ---- */
.rt-c-sari { --rt: var(--hl-bg); }
.rt-c-yesil { --rt: var(--ok); }
.rt-c-mavi { --rt: var(--c-MEVZUAT); }
.rt-c-pembe { --rt: var(--c-KYB); }
.rt-c-turuncu { --rt: var(--accent); }

.rt-top { display: grid; gap: 10px; margin: 0 0 16px; }
.rt-top [hidden] { display: none !important; }
.rt-form { display: flex; gap: 8px; }
.rt-form .input { flex: 1 1 auto; min-width: 0; }
.rt-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.rt-tag {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 2px 2px 2px 10px; border-radius: 999px; font-size: 0.84rem; color: var(--text);
  background: color-mix(in srgb, var(--rt) 38%, transparent);
  box-shadow: inset 0 0 0 1px var(--rt);
}
.rt-tag-x {
  appearance: none; border: 0; background: transparent; color: var(--text-2);
  min-width: 24px; min-height: 24px; padding: 0; border-radius: 999px;
  font: inherit; font-size: 1.05rem; line-height: 1; cursor: pointer;
}
.rt-tag-x:hover { background: color-mix(in srgb, var(--text) 12%, transparent); }
.rt-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rt-count { min-width: 8ch; text-align: center; font-size: 0.86rem; color: var(--text-2); font-variant-numeric: tabular-nums; }
.rt-list { border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); padding: 0 12px; }
.rt-list > summary { cursor: pointer; padding: 10px 0; font-size: 0.9rem; font-weight: 600; color: var(--text-2); }
.rt-list-body { padding: 0 0 12px; }
.rt-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.rt-item {
  display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 8px 10px; text-align: left;
  font: inherit; color: var(--text); background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius-sm); cursor: pointer;
}
.rt-item:hover { border-color: var(--border-strong); }
.rt-item--static { cursor: default; }
.rt-item--static:hover { border-color: var(--border); }
.rt-item-body { display: grid; gap: 2px; min-width: 0; flex: 1 1 auto; }
.rt-item-quote { font-size: 0.9rem; overflow-wrap: anywhere; }
.rt-item-note { font-size: 0.82rem; color: var(--text-3); overflow-wrap: anywhere; }
.rt-dot { flex: none; width: 12px; height: 12px; margin-top: 5px; border-radius: 50%; background: var(--rt); }
.rt-lost-title { margin: 12px 0 4px; font-size: 0.86rem; color: var(--text-2); }

.rt-mark { background: color-mix(in srgb, var(--rt) 38%, transparent); color: inherit; border-radius: 3px; }
.rt-hl {
  background: color-mix(in srgb, var(--rt) 55%, transparent);
  box-shadow: inset 0 -2px 0 var(--rt);
  color: inherit; border-radius: 2px; cursor: pointer;
}
.rt-mark.rt-cur, .rt-hl.rt-cur { outline: 2px solid var(--focus); outline-offset: 1px; }

.rt-bar {
  position: sticky; bottom: 8px; z-index: 2; min-width: 0;
  display: grid; gap: 8px; margin: 18px 0 0; padding: 10px 12px;
  background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
}
.rt-bar[hidden] { display: none; }
.rt-bar-msg { margin: 0; font-size: 0.88rem; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rt-sw-row, .rt-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rt-sw {
  width: 28px; height: 28px; padding: 0; border-radius: 50%; cursor: pointer;
  background: var(--rt); border: 2px solid var(--surface); box-shadow: 0 0 0 1px var(--border-strong);
}
.rt-sw[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--text); }
.rt-sw:disabled { opacity: 0.4; cursor: default; }
.rt-close { margin-left: auto; }

.rt-cite { display: grid; gap: 12px; }
.rt-cite-row { display: grid; gap: 6px; padding: 12px 14px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.rt-cite-label { margin: 0; font-size: 0.8rem; font-weight: 650; color: var(--text-3); }
.rt-cite-text { margin: 0; font-size: 0.95rem; color: var(--text); overflow-wrap: anywhere; }
.rt-cite-acts { display: flex; flex-wrap: wrap; gap: 6px; }
.rt-quote { margin: 0 0 12px; padding: 8px 12px; border-left: 3px solid var(--border-strong); color: var(--text-2); font-size: 0.92rem; overflow-wrap: anywhere; }

@media (max-width: 760px) {
  .rt-form .btn, .rt-form .input, .rt-nav .btn, .rt-acts .btn, .rt-cite-acts .btn,
  .rt-list > summary, .rt-item, .rt-tag-x, .rt-bar .rt-close { min-height: 44px; }
  .rt-tag-x, .rt-bar .rt-close { min-width: 44px; }
  .rt-sw { width: 44px; height: 44px; }
  .rt-bar-msg { white-space: normal; }
}

/* ---------- Takvim sayfası (#/takvim) ---------- */
.cal-card { display: grid; gap: 14px; }
.cal-bar,
.cal-filters,
.cal-ics,
.cal-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
  min-width: 0;
}
.cal-bar { justify-content: space-between; }
.cal-title { margin: 0 0 0 6px; font-size: 18px; font-weight: 700; color: var(--text); }
.cal-step { width: 44px; padding: 0; }
.cal-views button,
.cal-kinds button { white-space: nowrap; }
.cal-check { white-space: nowrap; }
.cal-search { flex: 1 1 200px; max-width: 320px; }
.cal-time { flex: none; font-weight: 700; font-variant-numeric: tabular-nums; }
.cal-skeleton { display: grid; gap: 10px; padding: 8px 0; }
.cal-empty {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px dashed var(--border-strong);
  border-radius: 12px;
  background: var(--surface-2);
  color: var(--text-3);
  font-size: 14px;
  text-align: center;
}

/* Ay ızgarası */
.cal-month {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--border);
}
.cal-dow {
  padding: 6px 0;
  background: var(--surface-2);
  color: var(--text-3);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  text-transform: uppercase;
}
.cal-cell {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  min-height: 96px;
  padding: 4px;
  background: var(--surface);
}
.cal-cell.out { background: var(--surface-2); }
.cal-cell.out > .cal-daynum { opacity: 0.5; }
.cal-daynum {
  align-self: flex-start;
  min-width: 24px;
  padding: 1px 6px;
  border-radius: 999px;
  color: var(--text-2);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: center;
}
.cal-cell.bugun > .cal-daynum { background: var(--brand); color: var(--on-brand); }
.cal-chip {
  appearance: none;
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  min-height: 22px;
  padding: 1px 6px;
  border: 0;
  border-radius: 6px;
  background: var(--brand-soft);
  color: var(--text-2);
  font: inherit;
  font-size: 11.5px;
  text-align: left;
  cursor: pointer;
}
.cal-chip:hover { box-shadow: inset 0 0 0 1px var(--border-strong); }
.cal-chip > svg { width: 12px; height: 12px; flex: none; }
.cal-chip-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-chip.s-gecikti { background: var(--danger-soft); color: var(--danger); }
.cal-chip.s-bugun { background: var(--brand); color: var(--on-brand); }
.cal-chip.s-yakin { background: var(--warn-soft); color: var(--warn); }
.cal-chip.s-tamam { background: var(--surface-3); color: var(--text-3); opacity: 0.7; }
.cal-chip.s-tamam .cal-chip-text { text-decoration: line-through; }
.cal-more {
  appearance: none;
  align-self: flex-start;
  padding: 2px 6px;
  border: 0;
  background: none;
  color: var(--brand);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.cal-more:hover { text-decoration: underline; }

/* Hafta */
.cal-week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}
.cal-wday {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
  min-height: 160px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-2);
}
.cal-wday.bugun { border-color: var(--brand); background: var(--brand-soft); }
.cal-wday-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 2px;
  color: var(--text-3);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.cal-wday-head time { color: var(--text); font-size: 16px; letter-spacing: 0; }
.cal-wday-none { margin: 0; color: var(--text-3); font-size: 12px; }
.cal-ev {
  appearance: none;
  display: grid;
  gap: 3px;
  width: 100%;
  min-width: 0;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-left: 4px solid var(--brand);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.cal-ev.s-gecikti { border-left-color: var(--danger); }
.cal-ev.s-yakin { border-left-color: var(--warn); }
.cal-ev.s-tamam { border-left-color: var(--border-strong); background: var(--surface-2); color: var(--text-3); }
.cal-ev-top { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 12px; }
.cal-ev-top > svg { width: 14px; height: 14px; flex: none; }
.cal-ev-title { font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
.cal-ev-case { overflow: hidden; color: var(--text-3); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }

/* Liste */
.cal-list { display: grid; gap: 18px; }
.cal-group { display: grid; gap: 8px; }
.cal-day-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
  color: var(--text-2);
  font-size: 13px;
  font-weight: 700;
}
.cal-item {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-left: 4px solid var(--brand);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.cal-item.s-gecikti { border-left-color: var(--danger); }
.cal-item.s-yakin { border-left-color: var(--warn); }
.cal-item.s-tamam { border-left-color: var(--border-strong); background: var(--surface-2); box-shadow: none; }
.cal-item-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.cal-kind {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-3);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.cal-kind > svg { width: 14px; height: 14px; }
.cal-item-title {
  appearance: none;
  justify-self: start;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: var(--text);
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.cal-item-title:hover { color: var(--brand); text-decoration: underline; }
.cal-item.s-tamam .cal-item-title { color: var(--text-3); text-decoration: line-through; }
.cal-item-when,
.cal-item-case { color: var(--text-2); font-size: 13.5px; overflow-wrap: anywhere; }
.cal-item-where { color: var(--text-3); font-size: 13px; overflow-wrap: anywhere; }
.cal-case-link { color: var(--brand); font-weight: 600; }
.cal-case-link:hover { text-decoration: underline; }
.cal-flags { display: flex; flex-wrap: wrap; gap: 6px; }
.cal-pre { white-space: pre-line; }

/* Ayrıntı penceresi */
.cal-dlg-body { padding: 16px 20px 0; }
.cal-foot { flex-wrap: wrap; align-items: center; padding: 16px 20px 20px; }
.cal-done { gap: 6px; }
.cal-done[aria-pressed="true"],
.cal-done[aria-pressed="true"]:hover:not(:disabled) {
  background: var(--ok);
  border-color: var(--ok);
  color: var(--surface);
}

/* Dar ekran (≤640px): ay ızgarası yerine liste; hafta alt alta; dokunma hedefleri 44px */
@media (max-width: 640px) {
  .cal-card { padding: 16px; }
  .cal-title { margin-left: 0; font-size: 16px; }
  .cal-nav { justify-content: space-between; }
  .cal-views,
  .cal-kinds { display: flex; width: 100%; }
  .cal-views button,
  .cal-kinds button { flex: 1 1 auto; min-height: 44px; padding: 0 10px; }
  .cal-search { flex-basis: 100%; max-width: none; }
  .cal-ics .btn { width: 100%; }
  .cal-week { grid-template-columns: minmax(0, 1fr); }
  .cal-wday { min-height: 0; }
  .cal-ev { min-height: 44px; }
  .cal-item-title { display: flex; align-items: center; min-height: 44px; }
}

/* ---- Dava dosyası: Kararlar sekmesinde dosyaya bağlı işaretler (case-highlights.js) ---- */
.case-hl {
  display: grid; gap: 12px; margin: 0 0 16px; padding: 14px 16px;
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius);
}
.case-hl[hidden] { display: none; }
.case-hl-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.case-hl-head h3 { margin: 0; font-size: 0.95rem; font-weight: 650; color: var(--text); }
.case-hl-group { display: grid; gap: 6px; min-width: 0; }
.case-hl-doc {
  appearance: none; justify-self: start; max-width: 100%; margin: 0; padding: 0; border: 0; background: none;
  font: inherit; font-size: 0.88rem; font-weight: 650; color: var(--brand); text-align: left; overflow-wrap: anywhere;
}
button.case-hl-doc { cursor: pointer; }
button.case-hl-doc:hover { text-decoration: underline; }
.case-hl-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.case-hl-item {
  display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px; min-width: 0;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm);
}
.case-hl-body { display: grid; gap: 2px; min-width: 0; }
.case-hl-quote { font-size: 0.9rem; color: var(--text); overflow-wrap: anywhere; }
.case-hl-note { font-size: 0.82rem; color: var(--text-3); overflow-wrap: anywhere; }
@media (max-width: 760px) {
  button.case-hl-doc { min-height: 44px; }
}

/* ---------- Şablonlar (#/sablonlar) ---------- */
.tpl-card { display: grid; gap: 16px; }

.tpl-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.tpl-search { flex: 1 1 260px; min-width: 0; }
.tpl-filters .select { flex: 0 1 190px; width: auto; min-width: 150px; }
.tpl-seg { flex: none; }
.tpl-mine { min-height: 36px; }

.tpl-list { display: grid; gap: 12px; min-width: 0; }
.tpl-items { display: grid; gap: 12px; }
.tpl-skeleton { display: grid; gap: 8px; }
.tpl-item { display: grid; gap: 10px; min-width: 0; padding: 14px 16px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); }
.tpl-item-top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 14px; }
.tpl-title-h { flex: 1 1 220px; min-width: 0; margin: 0; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.tpl-title { appearance: none; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--text); text-align: left; cursor: pointer; }
.tpl-title:hover { color: var(--brand); text-decoration: underline; }
.tpl-title:focus-visible, .tpl-use-link:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 4px; }
.tpl-item-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.tpl-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.tpl-status { display: inline-flex; align-items: center; padding: 1px 9px 0; border: 1px solid transparent; border-radius: 999px; font-size: 12px; font-weight: 600; line-height: 1.6; white-space: nowrap; }
.tpl-st-ok { background: var(--ok-soft); color: var(--ok); }
.tpl-st-neutral { background: var(--surface-3); color: var(--text-2); border-color: var(--border); }
.tpl-st-warn { background: var(--warn-soft); color: var(--warn); }
.tpl-line { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--text-3); }
.tpl-basis { font-size: 13px; color: var(--text-3); overflow-wrap: anywhere; }
.tpl-excerpt { margin: 0; font-size: 14px; color: var(--text-2); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.tpl-empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 14px; padding: 18px; border: 1px dashed var(--border-strong); border-radius: var(--radius); font-size: 14px; color: var(--text-3); }

/* Pencereler */
.tpl-dialog { width: min(640px, calc(100vw - 32px)); }
.dialog:has(.tpl-editor-top) { width: min(720px, calc(100vw - 32px)); }
.tpl-detail, .tpl-use { display: grid; gap: 16px; padding: 4px 20px 0; }
.tpl-use { gap: 14px; }
.tpl-section { display: grid; gap: 8px; min-width: 0; }
.tpl-h3 { margin: 0; font-size: 14px; font-weight: 600; color: var(--text-2); }
.tpl-body { margin: 0; max-height: 320px; overflow: auto; padding: 12px 14px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--text); font: inherit; font-size: 14px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.tpl-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.tpl-chips-label { font-size: 13px; color: var(--text-3); }
.tpl-chip { display: inline-flex; align-items: center; padding: 2px 9px 0; border: 1px solid color-mix(in srgb, var(--brand) 30%, transparent); border-radius: 999px; background: var(--brand-soft); color: var(--brand); font-size: 13px; font-weight: 600; line-height: 1.6; white-space: nowrap; }
.tpl-details > summary { padding: 4px 0; font-size: 14px; font-weight: 600; color: var(--text-2); cursor: pointer; }
.tpl-versions { display: grid; gap: 10px; margin: 8px 0 0; padding: 0; list-style: none; }
.tpl-ver { display: grid; gap: 8px; min-width: 0; padding-top: 10px; border-top: 1px solid var(--border); }
.tpl-ver-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.tpl-ver-meta { min-width: 0; font-size: 13px; color: var(--text-3); overflow-wrap: anywhere; }
.tpl-uses { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.tpl-use-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; font-size: 14px; }
.tpl-use-link { font-weight: 600; color: var(--brand); overflow-wrap: anywhere; }
.tpl-foot { flex-wrap: wrap; align-items: center; padding: 16px 20px 20px; }
.tpl-missing { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.tpl-missing:empty { display: none; }
.tpl-preview-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.tpl-editor-top { display: grid; gap: 10px; }
.tpl-audit { display: grid; gap: 8px; font-size: 14px; }

@media (max-width: 640px) {
  .tpl-missing { grid-template-columns: minmax(0, 1fr); }
  .tpl-item-top { flex-direction: column; }
  .tpl-title-h { flex: none; } /* sütun düzeninde 220px'lik esas yükseklik olurdu */
}
@media (max-width: 760px) {
  .tpl-search { flex-basis: 100%; }
  .tpl-filters .select { flex: 1 1 calc(50% - 5px); min-width: 0; min-height: 44px; }
  .tpl-seg { width: 100%; }
  .tpl-seg button { flex: 1 1 0; min-width: 0; min-height: 44px; padding: 0 6px; font-size: 13px; line-height: 1.2; }
  .tpl-mine { min-height: 44px; }
  .tpl-title, .tpl-use-link { display: inline-flex; align-items: center; min-height: 44px; }
  .tpl-details > summary { padding: 12px 0; }
  .tpl-item-acts .btn, .tpl-foot .btn, .tpl-preview-head .btn, .tpl-ver-head .btn, .tpl-use-row .btn, .tpl-empty .btn { min-height: 44px; }
  .tpl-foot .btn { flex: 1 1 auto; }
}

/* ---------- Faiz hesabı (calc.js) ---------- */
.calc-form { display: grid; gap: 18px; min-width: 0; }
.calc-controls { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; }
.calc-scenarios { display: grid; gap: 16px; min-width: 0; }
.calc-pair { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); align-items: start; min-width: 0; }
@media (min-width: 1100px) {
  .calc-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.calc-card, .calc-sum, .calc-result-card { display: grid; gap: 14px; min-width: 0; align-content: start; }
.calc-h2 { margin: 0; font-size: 1.15rem; }
.calc-h3 { margin: 0 0 4px; font-size: 1rem; }
.calc-section { display: grid; gap: 8px; min-width: 0; }
.calc-fields { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
.calc-fields .field { min-width: 0; }
.calc-wide { grid-column: 1 / -1; }
@media (min-width: 600px) {
  .calc-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.calc-group { display: grid; gap: 8px; min-width: 0; padding-top: 14px; border-top: 1px solid var(--border); }
.calc-rows { display: grid; gap: 10px; min-width: 0; }
.calc-row { display: grid; gap: 8px; align-items: center; min-width: 0; }
.calc-row-rate { grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr) minmax(0, 2fr) auto; }
.calc-row-pay { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
.calc-row-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr) minmax(0, 2fr) auto; gap: 8px; color: var(--text-3); font-size: 0.8rem; }
.calc-row .input, .calc-row .select { width: 100%; min-width: 0; }
.calc-table-wrap { overflow-x: auto; max-width: 100%; border: 1px solid var(--border); border-radius: var(--radius-sm); -webkit-overflow-scrolling: touch; }
.calc-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 0.9rem; }
.calc-table th, .calc-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.calc-table th { background: var(--surface-2); color: var(--text-2); font-weight: 600; white-space: nowrap; }
.calc-table tbody tr:last-child td { border-bottom: 0; }
.calc-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.calc-nowrap { white-space: nowrap; }
.calc-stats { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) {
  .calc-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.calc-stats-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.calc-stat { display: grid; gap: 4px; min-width: 0; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); }
.calc-stat.is-total { background: var(--brand-soft); border-color: var(--brand); }
.calc-stat-label { color: var(--text-2); font-size: 0.85rem; }
.calc-stat-value { font-size: 1.1rem; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.calc-result { display: grid; gap: 16px; min-width: 0; scroll-margin-top: 84px; }
.calc-assumptions, .calc-faiz-diff { margin: 0; padding-left: 1.25em; display: grid; gap: 6px; color: var(--text-2); font-size: 0.9rem; overflow-wrap: anywhere; }
.calc-diff-label { font-weight: 600; color: var(--text); }
.calc-buttons, .calc-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.calc-details { min-width: 0; }
.calc-details summary { cursor: pointer; padding: 6px 0; font-weight: 600; }
.calc-row-head-pay { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
@media (max-width: 760px) {
  .calc-row-head:not(.calc-row-head-pay) { display: none; }
  .calc-row-rate { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px; }
  .calc-row-rate .calc-in-src { grid-column: 1 / -1; order: 2; }
  .calc-row-rate .calc-del { order: 1; }
  .calc-row-pay { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px; }
  .calc-form .input, .calc-form .select, .calc-form .btn, .calc-form .check { min-height: 44px; }
  .calc-form .icon-btn { min-width: 44px; min-height: 44px; }
  .calc-details summary { padding: 12px 0; }
}

/* ---------- Hesaplar sekmeleri ve vekâlet ücreti (calc.js, fee.js) ---------- */
.calc-tabs { margin-bottom: 18px; max-width: 100%; }
.calc-panel { display: grid; gap: 16px; min-width: 0; }
.calc-panel.kirbac > * { animation: kirbac-sag var(--motion-slow) var(--ease-smooth) both; }
.calc-panel.kirbac.geri > * { animation-name: kirbac-sol; }
.calc-intro { margin: 0; }
.fee-tariff-note { margin: -4px 0 0; }
.fee-tariff-note:empty { display: none; }
.fee-stats-1 { grid-template-columns: minmax(0, 1fr); max-width: 420px; }
.fee-party { padding-top: 14px; border-top: 1px solid var(--border); }
.fee-steps { list-style: none; counter-reset: adim; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 0.92rem; }
.fee-steps li { counter-increment: adim; display: grid; grid-template-columns: 1.6em minmax(0, 1fr) auto; gap: 2px 12px; align-items: baseline; }
.fee-steps li::before { content: counter(adim) "."; color: var(--text-3); }
.fee-step-text { min-width: 0; color: var(--text-2); overflow-wrap: anywhere; }
.fee-step-amount { font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 760px) {
  .calc-tabs button { min-height: 44px; }
}
@media (max-width: 520px) {
  .fee-result .calc-stats-2 { grid-template-columns: minmax(0, 1fr); }
  .fee-steps li { grid-template-columns: 1.6em minmax(0, 1fr); }
  .fee-step-amount { grid-column: 2; }
}

/* ---------- Çıkar çatışması uyarısı (casekit.js, dosya penceresi) ---------- */
.conflict-box[hidden] { display: none; }
.conflict-notice { display: grid; gap: 6px; }
.conflict-list { margin: 0; padding-left: 1.2em; display: grid; gap: 4px; overflow-wrap: anywhere; }
.conflict-list .tag { margin-left: 6px; }

/* ---------- Antet ve yazdırma (components/letterhead.js) ---------- */
.lh-block {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  padding: 14px;
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.lh-block > div { min-width: 0; }
.lh-center { text-align: center; }
.lh-left { text-align: left; }
.lh-right { text-align: right; }
.lh-office { font-weight: 700; }

@media (max-width: 760px) {
  .lh-toggle, .lh-print, .lh-align button { min-height: 44px; }
}

/* Yazdırma: yalnız antet ve metin (ya da rapor) basılır; kurallar html.printing-sheet sınıfına bağlı (duruşma
   hazırlığı penceresinin yazdırma kuralıyla çakışmaz). Adlandırılmış sayfa: 25 mm kenar yalnız bu çıktıya uygulanır. */
.print-sheet { display: none; page: sheet; }
@page sheet { size: A4; margin: 25mm; }
@media print {
  html.printing-sheet body > *:not(.print-sheet) { display: none !important; }
  html.printing-sheet .print-sheet { display: block !important; color: #000; background: #fff; font-family: 'Times New Roman', Times, serif; font-size: 12pt; line-height: 1.5; }
  html.printing-sheet .print-sheet .lh-block { border: 0; border-radius: 0; background: none; padding: 0 0 6mm; margin: 0 0 8mm; border-bottom: 0.5pt solid #000; font-size: 10pt; line-height: 1.3; color: #000; }
  html.printing-sheet .print-text { white-space: pre-wrap; text-align: justify; }
  html.printing-sheet .print-sheet .report-body { font-family: inherit; font-size: inherit; line-height: inherit; color: #000; }
  html.printing-sheet .print-sheet .report-body h1,
  html.printing-sheet .print-sheet .report-body h2,
  html.printing-sheet .print-sheet .report-body h3,
  html.printing-sheet .print-sheet .report-body h4 { font-family: inherit; font-size: 12pt; color: #000; }
  html.printing-sheet .print-sheet .report-body th,
  html.printing-sheet .print-sheet .report-body td { border: 0.5pt solid #000; }
}
.lh-preview-title { margin-top: 18px; }

/* ---------- Çalışmalarım (#/calismalar) ve taslak kenar çubuğu başlığı ---------- */
.works-card { display: grid; gap: 14px; }
.works-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.works-search { flex: 1 1 260px; min-width: 0; max-width: 420px; }
.works-list, .works-skeleton { display: grid; gap: 10px; }
.works-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.works-item { display: grid; gap: 10px; min-width: 0; padding: 14px 16px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); }
.works-item-top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 14px; }
.works-title-h { flex: 1 1 220px; min-width: 0; margin: 0; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.works-title { appearance: none; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--text); text-align: left; cursor: pointer; }
.works-title:hover { color: var(--brand); text-decoration: underline; }
.works-title:focus-visible, .works-more:focus-visible, .works-line a:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 4px; }
.works-line { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--text-3); }
.works-line a { color: var(--brand); }
.works-excerpt { margin: 0; font-size: 14px; color: var(--text-2); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.works-acts, .works-ver-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.works-empty { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 18px 4px; color: var(--text-3); }
.works-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; margin-bottom: 12px; }
.works-head .card-title { margin: 0; }
.works-more { font-size: 13px; font-weight: 600; color: var(--brand); text-decoration: none; }
.works-more:hover { text-decoration: underline; }
.works-detail { display: grid; gap: 12px; min-width: 0; }
.works-ver-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.works-ver { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; min-width: 0; padding: 10px 12px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.works-ver-info { display: grid; gap: 2px; min-width: 0; }
.works-ver-when { font-size: 14px; font-weight: 600; }
.works-pre { margin: 0; max-height: 45vh; overflow: auto; padding: 12px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--text); font: inherit; font-size: 14px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }

@media (max-width: 760px) {
  .works-search { flex-basis: 100%; max-width: none; }
  .works-seg { width: 100%; }
  .works-seg button { flex: 1 1 0; min-width: 0; min-height: 44px; padding: 0 6px; font-size: 13px; line-height: 1.2; }
  .works-title { display: inline-flex; align-items: center; min-height: 44px; }
  .works-acts .btn, .works-empty .btn, .works-ver-acts .btn { min-height: 44px; }
  .works-more { display: inline-flex; align-items: center; min-height: 44px; }
  .works-ver-acts { width: 100%; }
  .works-ver-acts .btn { flex: 1 1 0; }
  .draft-list .btn { min-height: 44px; }
}
@media (max-width: 640px) {
  .works-item-top { flex-direction: column; }
  .works-title-h { flex: none; } /* sütun düzeninde 220px'lik esas yükseklik olurdu */
}

/* ---------- Rapora devam sorusu (research.js) ---------- */
.fu-card { display: grid; gap: 12px; }
.fu-card[hidden] { display: none; }
.fu-intro { margin: 0; }
.fu-thread { display: grid; gap: 12px; min-width: 0; }
.fu-thread:empty { display: none; }
.fu-turn { display: grid; gap: 8px; min-width: 0; padding: 12px 14px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.fu-q { color: var(--text); overflow-wrap: anywhere; }
.fu-a { min-width: 0; overflow-wrap: anywhere; }
.fu-actions { align-items: center; }
@media (max-width: 760px) {
  .fu-actions .btn { min-height: 44px; }
}
/* Devam yanıtı: rapor gövdesinin okuma sütunu (ortalanmış dar genişlik, büyük yazı) kartın içinde gerekmez. */
.fu-a .report-body { max-width: none; margin: 0; font-size: 0.95rem; }
.fu-a .report-body > :last-child { margin-bottom: 0; }

/* ---------- İçtihat karşılaştırma (research.js) ---------- */
.source-row { display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
.source-row .source-item { flex: 1 1 auto; min-width: 0; }
.cmp-pick { flex: none; width: 18px; height: 18px; margin: 9px 0 0; accent-color: var(--brand); cursor: pointer; }
.cmp-bar { display: grid; gap: 6px; margin-top: 12px; }
.cmp-bar .btn { justify-self: start; }
.cmp-dialog { width: min(1100px, calc(100vw - 32px)); max-width: none; }
.cmp-body { display: grid; gap: 12px; padding: 4px 20px 0; min-width: 0; }
.cmp-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); -webkit-overflow-scrolling: touch; }
.cmp-table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 0.88rem; }
.cmp-table th, .cmp-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.cmp-table th { background: var(--surface-2); color: var(--text-2); font-weight: 600; white-space: nowrap; }
.cmp-table tbody tr:last-child td { border-bottom: 0; }
.cmp-table td:first-child { width: 22%; }
.cmp-doc { margin-bottom: 4px; }
.cmp-summary .report-body { max-width: none; margin: 0; font-size: 0.95rem; }
@media (max-width: 760px) {
  .cmp-pick { width: 24px; height: 24px; margin-top: 10px; }
  .cmp-bar .btn { min-height: 44px; }
}
.cmp-dialog .dialog-foot { flex-wrap: wrap; align-items: center; padding: 16px 20px 20px; }

/* ---------- Sözleşme incelemesi (pages/contract.js) ---------- */
.ctr-open-link { margin-top: 10px; }
.ctr-form { display: flex; flex-direction: column; gap: 14px; }
.ctr-case-note { margin: 0; padding: 8px 12px; font-size: 13px; color: var(--text-2); background: var(--brand-soft); border: 1px solid var(--border); border-radius: var(--radius-sm); overflow-wrap: anywhere; }
.ctr-field-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ctr-field-head label { margin-right: auto; font-size: 13px; font-weight: 500; color: var(--text-2); }
.ctr-count-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; }
.ctr-count.is-full { color: var(--danger); font-weight: 600; }
.ctr-actions-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.ctr-result, .ctr-result-body { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ctr-result-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 16px; }
.ctr-result-head .card-title { margin-bottom: 4px; }
.ctr-meta { margin: 0; }
.ctr-tools { display: flex; flex-wrap: wrap; gap: 8px; }
.ctr-h { margin: 8px 0 0; font-size: 1.05rem; color: var(--text); }
.ctr-empty { margin: 0; color: var(--text-3); }
.ctr-sub { margin: 4px 0 0; font-size: 13px; color: var(--text-3); }
.ctr-risk { display: flex; flex-wrap: wrap; gap: 8px; }
.ctr-badge { display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; border: 1px solid transparent; border-radius: 999px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ctr-risk-yuksek { background: var(--danger-soft); color: var(--danger); border-color: color-mix(in srgb, var(--danger) 35%, transparent); }
.ctr-risk-orta { background: var(--warn-soft); color: var(--warn); border-color: color-mix(in srgb, var(--warn) 35%, transparent); }
.ctr-risk-dusuk { background: var(--surface-3); color: var(--text-2); border-color: var(--border); }
.ctr-summary { color: var(--text); }
.ctr-summary .report-body { max-width: none; margin: 0; font-size: 15px; line-height: 1.65; }
.ctr-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.ctr-table-wrap:focus-visible, .ctr-text:focus-visible, .ctr-details > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.ctr-table { width: 100%; min-width: 980px; border-collapse: collapse; font-size: 13.5px; color: var(--text); }
.ctr-table-sm { min-width: 680px; }
.ctr-table th, .ctr-table td { padding: 9px 10px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
.ctr-table thead th { background: var(--surface-2); color: var(--text-2); font-weight: 600; white-space: nowrap; }
.ctr-table tbody tr:last-child td { border-bottom: 0; }
.ctr-copy { margin-top: 6px; }
.ctr-decision { min-width: 150px; font-size: 13.5px; }
.ctr-quote { appearance: none; margin: 0; padding: 0; border: 0; background: none; font: inherit; font-size: inherit; font-style: italic; color: var(--brand); text-align: left; text-decoration: underline dotted; text-underline-offset: 3px; cursor: pointer; overflow-wrap: anywhere; }
.ctr-quote:hover { text-decoration-style: solid; }
.ctr-quote:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 3px; }
.ctr-quote-plain { display: block; margin: 4px 0; font-style: italic; color: var(--text-2); }
.ctr-list { display: grid; gap: 12px; margin: 0; padding-left: 20px; color: var(--text); }
.ctr-list p { margin: 4px 0 0; font-size: 14px; color: var(--text-2); }
.ctr-details { padding: 10px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.ctr-details > summary { min-height: 36px; padding: 8px 0; cursor: pointer; font-weight: 600; color: var(--text-2); }
.ctr-details[open] > summary { margin-bottom: 10px; }
.ctr-details > .notice { margin-bottom: 10px; }
.ctr-text { margin: 0; max-height: 60vh; overflow: auto; padding: 14px 16px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); font-family: inherit; font-size: 14px; line-height: 1.6; color: var(--text); white-space: pre-wrap; overflow-wrap: anywhere; }
.ctr-hit { padding: 0 2px; border-radius: 3px; background: color-mix(in srgb, var(--warn) 28%, transparent); color: inherit; }
@media (max-width: 760px) {
  .ctr-open-link, .ctr-copy, .ctr-details > summary, .ctr-tools .btn, .ctr-actions-row .btn, .ctr-field-head .btn { min-height: 44px; }
  .ctr-quote { display: inline-flex; align-items: center; min-height: 44px; }
  .ctr-decision { width: 100%; min-width: 0; }
  .ctr-result-head { flex-direction: column; }
  .ctr-tools .btn { flex: 1 1 auto; }
}

/* ---------- Yazım tercihleri (settings.js) ---------- */
.pref-add { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.pref-add .input { flex: 1 1 260px; min-width: 0; }
.pref-add .select { flex: 0 1 180px; width: auto; }
.pref-list { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.pref-item { display: grid; grid-template-columns: minmax(0, 1fr) 170px auto auto; gap: 8px; align-items: center; }
.pref-item.off .input { color: var(--text-3); text-decoration: line-through; }
.pref-active { white-space: nowrap; }
@media (max-width: 760px) {
  .pref-item { grid-template-columns: minmax(0, 1fr) auto; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
  .pref-item .input { grid-column: 1 / -1; }
  .pref-add .btn, .pref-item .btn, .pref-item .select, .pref-add .select, .pref-active { min-height: 44px; }
}

/* ---------- Sohbetle düzenleme (components/revise.js) ---------- */
/* Yeri: sağ sütunun başı (.draft-sidebar yapışır ve kayar). Kayan sütun büyük gölgeyi keserdi: normal gölge. */
.rv-card { display: grid; gap: 10px; }
.rv-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rv-head .card-title { margin: 0; }
.rv-body { display: grid; gap: 10px; min-width: 0; }
.rv-intro { margin: 0; }
.rv-log { display: grid; gap: 12px; max-height: min(34vh, 380px); overflow-y: auto; padding: 4px 2px; overscroll-behavior: contain; }
.rv-turn { display: grid; gap: 6px; }
.rv-msg { display: grid; gap: 6px; padding: 8px 12px; border-radius: var(--radius-sm); min-width: 0; max-width: 92%; }
.rv-msg-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.rv-user { justify-self: end; background: var(--brand-soft); border: 1px solid var(--border); }
.rv-bot { justify-self: start; background: var(--surface-2); border: 1px solid var(--border); }
.rv-msg .notice { margin: 0; }
.rv-turn-actions { align-items: center; gap: 8px; flex-wrap: wrap; }
.rv-current { font-size: 0.8rem; color: var(--text-3); }
.rv-event { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; font-size: 0.82rem; color: var(--text-3); }
.rv-quick { display: flex; flex-wrap: wrap; gap: 6px; }
.rv-target, .rv-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rv-target-text { font-style: italic; overflow-wrap: anywhere; }
.rv-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px 2px 10px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-2); font-size: 0.82rem; }
.rv-chip-x { border: 0; background: transparent; cursor: pointer; padding: 0 6px; font-size: 1rem; line-height: 1; color: var(--text-2); }
.rv-pick { display: grid; gap: 6px; max-height: 220px; overflow-y: auto; padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
.rv-pick-item { align-items: baseline; gap: 8px; }
.rv-pick p { margin: 0; }
.rv-input { min-height: 56px; }
.rv-actions { align-items: center; gap: 8px; }
.paper-busy .paper { opacity: 0.75; }
.rv-diff-wrap { display: grid; gap: 6px; min-width: 0; }
.rv-diff { max-height: 50vh; overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); font-size: 0.88rem; line-height: 1.5; }
.rv-line { padding: 1px 10px 1px 22px; position: relative; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text-2); }
.rv-add { background: var(--ok-soft); color: var(--text); }
.rv-add::before { content: "+"; position: absolute; left: 8px; color: var(--ok); font-weight: 700; }
.rv-del { background: var(--danger-soft); color: var(--text-2); text-decoration: line-through; }
.rv-del::before { content: "−"; position: absolute; left: 8px; color: var(--danger); font-weight: 700; }
.rv-mod { color: var(--text); }
.rv-mod::before { content: "~"; position: absolute; left: 8px; color: var(--text-3); font-weight: 700; }
.rv-w-add { background: var(--ok-soft); text-decoration: none; border-radius: 2px; box-shadow: inset 0 -1px 0 var(--ok); }
.rv-w-del { background: var(--danger-soft); color: var(--text-2); border-radius: 2px; }
.rv-skip { padding: 2px 10px; color: var(--text-3); font-size: 0.8rem; font-style: italic; background: var(--surface-2); }
.rv-text { margin: 0; max-height: 50vh; overflow: auto; padding: 10px 12px; white-space: pre-wrap; overflow-wrap: anywhere; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.rv-msg .rv-diff { max-height: none; } /* sohbet alanı zaten kayar: iç içe kaydırma olmasın */
@media (max-width: 1024px) {
  .rv-msg { max-width: 100%; }
}
@media (max-width: 760px) {
  .rv-quick .btn, .rv-actions .btn, .rv-turn-actions .btn, .rv-head .btn { min-height: 44px; }
}

/* ---- Dilekçe analizi (#/analiz) ---- */
.an-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }
.an-layout > * { min-width: 0; }
.an-form { display: flex; flex-direction: column; gap: 14px; }
.an-case-note { margin: 0; padding: 8px 12px; font-size: 13px; color: var(--text-2); background: var(--brand-soft); border-radius: var(--radius-sm); overflow-wrap: anywhere; }
.an-case-note[hidden] { display: none; }
.an-persp { margin: 0; padding: 0; border: 0; min-width: 0; }
.an-legend { padding: 0; margin: 0 0 6px; font-size: 13px; font-weight: 500; color: var(--text-2); }
.an-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.an-choice { display: flex; align-items: flex-start; gap: 10px; min-width: 0; padding: 12px 14px; background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius); cursor: pointer; transition: border-color var(--motion-normal), background var(--motion-normal); }
.an-choice:hover { border-color: var(--brand); }
.an-choice.is-on { border-color: var(--brand); background: var(--brand-soft); box-shadow: inset 0 0 0 1px var(--brand); }
.an-choice:focus-within { outline: 2px solid var(--brand); outline-offset: 2px; }
.an-choice input { flex: none; width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--brand); }
.an-choice-text { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.an-choice-text strong { font-weight: 600; color: var(--text); }
.an-field-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.an-field-head label { margin-right: auto; font-size: 13px; font-weight: 500; color: var(--text-2); }
.an-count-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; }
.an-count.is-full { color: var(--danger); font-weight: 600; }
.an-memory { display: flex; align-items: center; gap: 8px; margin: 0; }
.an-memory[hidden] { display: none; }
.an-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.an-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 10px; }
.an-head .card-title { margin: 0; }
.an-meta { margin: 0 0 10px; }
.an-warns { display: grid; gap: 8px; }
.an-warns:not(:empty) { margin-bottom: 12px; }
.an-report-hint { margin: 10px 0 0; }
.an-report-hint[hidden] { display: none; }
.an-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; }
.an-tools .check { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.page-head a.ctr-open-link + a.ctr-open-link { margin-left: 8px; }
@media (max-width: 1024px) { .an-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .an-choices { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  .an-choice, .an-memory, .an-tools .btn, .an-tools .check, .an-actions .btn, .an-field-head .btn, .source-item { min-height: 44px; }
}

/* ---------- İş akışı kural paketi onayı (workflow.js) ---------- */
.wf-approval { justify-self: start; font-size: 12px; font-weight: 600; color: var(--warn); }
.wf-approval.ok { color: var(--ok); }
.wf-approval-note { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.wf-approval-note > span { flex: 1 1 260px; min-width: 0; }
.wf-review { display: grid; gap: 10px; max-height: 50vh; overflow: auto; padding-right: 4px; }
.wf-review-list { margin: 0; padding-left: 1.4em; display: grid; gap: 8px; }
.wf-review-list li { display: grid; gap: 2px; overflow-wrap: anywhere; }
.wf-review-group { font-size: 12px; font-weight: 600; color: var(--text-3); text-transform: uppercase; letter-spacing: 0.04em; }
@media (max-width: 760px) {
  .wf-approval-note .btn { min-height: 44px; }
}

/* ---------- Kanun maddesi değişiklik geçmişi (ui.js lawHistoryPanel) ---------- */
.law-hist { margin: 12px 0; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.law-hist > summary { cursor: pointer; padding: 10px 14px; font-weight: 600; color: var(--brand); min-height: 44px; display: flex; align-items: center; }
.law-hist[open] > summary { border-bottom: 1px solid var(--border); }
.law-hist-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 14px 0; }
.law-hist-controls label { font-size: 13px; font-weight: 600; color: var(--text-2); }
.law-hist-controls .input { width: auto; min-width: 0; max-width: 100%; }
.law-hist-controls .hint { flex-basis: 100%; margin: 0; }
.law-hist-body { display: grid; gap: 10px; padding: 10px 14px 14px; min-width: 0; }
.law-hist-warns { margin: 0; padding-left: 1.8em; display: grid; gap: 6px; }
.law-hist-warns li { overflow-wrap: anywhere; }
.law-hist-events { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.law-ev { padding: 8px 0 8px 12px; border-left: 3px solid var(--border-strong); display: grid; gap: 4px; min-width: 0; }
.law-ev + .law-ev { border-top: 1px dashed var(--border); }
.law-ev.lh-st-after { border-left-color: var(--warn); }
.law-ev.lh-st-pending { border-left-color: var(--danger); }
.law-ev.lh-st-before { border-left-color: var(--ok); }
.law-ev-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 13px; }
.law-ev-date { font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums; }
.law-ev-kind { color: var(--text-2); }
.law-ev-act { color: var(--brand); font-weight: 500; }
.law-ev-scope { color: var(--text-3); }
.law-ev-status.lh-st-after { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.law-ev-status.lh-st-pending { background: var(--danger-soft); color: var(--danger); border-color: transparent; }
.law-ev-status.lh-st-before { background: var(--ok-soft); color: var(--ok); border-color: transparent; }
.law-ev-ibare { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.law-ev-ibare del { color: var(--danger); text-decoration-thickness: 1px; }
.law-ev-ibare ins { color: var(--ok); text-decoration: none; background: var(--ok-soft); }
.law-ev-note { margin: 0; overflow-wrap: anywhere; }
.law-hist-versions, .law-hist-source { margin: 0; }
.law-hist-oldtext, .law-hist-notes { font-size: 13px; }
.law-hist-oldtext > summary, .law-hist-notes > summary { cursor: pointer; color: var(--brand); font-weight: 500; min-height: 32px; display: flex; align-items: center; }
.law-hist-oldtext p { margin: 6px 0; }
.law-hist-notes ul { margin: 6px 0 0; padding-left: 1.4em; display: grid; gap: 4px; }
.research-event .input { max-width: 220px; }
.src-ver { display: block; font-size: 12px; color: var(--text-3); font-weight: 400; }
.laws-hint { margin: 14px 0 6px; }
.laws-info { margin: 6px 0 0; }
.laws-info:empty { display: none; }
@media (max-width: 760px) {
  .law-hist-controls .input, .law-hist-controls .btn { min-height: 44px; }
}

/* ---------- Mevzuat etkisi (F11: components/law-impact.js, pages/lawimpact.js) ---------- */
.linkish { padding: 0; border: 0; background: none; color: var(--brand); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.linkish:hover { color: var(--text); }
.linkish:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 2px; }
.law-impact-note { display: grid; gap: 6px; margin-bottom: 12px; overflow-wrap: anywhere; }
.law-impact-note[hidden] { display: none; }
.law-impact-note > a { font-weight: 600; color: var(--brand); justify-self: start; }
.law-impact-head { font-weight: 600; }
.law-impact-list { margin: 0; padding-left: 1.4em; display: grid; gap: 4px; font-size: 13px; }
.cases-main > .law-impact-note { margin: 0 0 12px; }
.case-item-impact { background: var(--warn-soft); color: var(--warn); border-color: color-mix(in srgb, var(--warn) 30%, transparent); text-decoration: none; }
.case-item-impact:hover { border-color: var(--warn); }
.user-btn { position: relative; }
.user-btn-dot { position: absolute; top: -1px; right: -1px; width: 10px; height: 10px; border-radius: 999px; background: var(--warn); border: 2px solid var(--surface); }
.user-btn-dot[hidden] { display: none; }
.user-pop a .user-pop-count { margin-left: 8px; --badge-color: var(--warn); vertical-align: 1px; }
.user-pop-count[hidden] { display: none; }

.li-card { display: grid; gap: 14px; }
.li-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.li-summary { margin: 0; font-weight: 600; color: var(--text-2); }
.li-filter, .li-missing, .li-how { margin: 0; }
.li-empty { padding: 18px; text-align: center; color: var(--text-2); background: var(--surface-2); border: 1px dashed var(--border); border-radius: var(--radius); }
.li-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.li-item { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); min-width: 0; }
.li-item-top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; }
.li-title { margin: 0; font-size: 16px; min-width: 0; overflow-wrap: anywhere; }
.li-title a { color: var(--text); text-decoration: none; }
.li-title a:hover { color: var(--brand); text-decoration: underline; }
.li-line { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--text-3); }
.li-line a { color: var(--brand); }
.li-arts { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.li-art { display: grid; gap: 6px; padding: 10px 12px; border-left: 3px solid var(--warn); background: var(--surface-2); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; min-width: 0; }
.li-art.acked { border-left-color: var(--ok); opacity: 0.8; }
.li-art-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.li-art-head .hint { margin: 0; }
.li-events { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: 13px; }
.li-events li { overflow-wrap: anywhere; }
.li-ev-date { font-weight: 600; font-variant-numeric: tabular-nums; }
.li-ev-act { color: var(--brand); }
.li-ev-st { margin-left: 6px; }
.li-st-yururlukte { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.li-st-gelecek { background: var(--danger-soft); color: var(--danger); border-color: transparent; }
.li-st-belirsiz { background: var(--surface-3); color: var(--text-2); }
.li-ev-ibare { display: block; margin-top: 2px; }
.li-ev-ibare del { color: var(--danger); text-decoration-thickness: 1px; }
.li-ev-ibare ins { color: var(--ok); text-decoration: none; background: var(--ok-soft); }
.li-acts { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 760px) {
  .li-item { padding: 12px; }
  .li-acts .btn { min-height: 44px; }
}
.li-art.dismissed { border-left-color: var(--border-strong); }
.li-ev-note { display: block; margin-top: 2px; color: var(--text-3); font-size: 12px; white-space: pre-line; }
.li-src { margin: 0; font-size: 12px; }
.li-vdiff { margin-top: 4px; }
.li-vdiff > summary { cursor: pointer; color: var(--brand); font-weight: 500; min-height: 32px; display: flex; align-items: center; }
.li-diff { max-height: 40vh; margin-top: 4px; }
.li-coverage { display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.li-coverage[hidden] { display: none; }
.li-cov-h { margin: 0; font-size: 15px; }
.li-coverage .notice { margin: 0; }
.li-cov-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: 13px; }
.li-cov-list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; overflow-wrap: anywhere; }
.li-cov-list .hint { margin: 0; }
.li-cov-meta { color: var(--text-3); font-variant-numeric: tabular-nums; }
/* Resmî Gazete (hanlaw/gazette.py): mevzuat etkisinde yeni yayın, Kaynaklar'da okuma kartı */
.li-st-yayin { background: var(--brand-soft, var(--surface-3)); color: var(--brand); border-color: transparent; }
.li-ev-rgsrc { display: block; margin-top: 2px; font-size: 12px; }
.li-ev-rgsrc a { color: var(--brand); }
.rg-row { align-items: center; gap: 8px; }
.rg-days { width: 84px; }
.rg-info { margin: 6px 0 0; }
.rg-list { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 4px; font-size: 13px; }
.rg-list li { overflow-wrap: anywhere; }
.rg-list a { color: var(--brand); }
.rg-date { margin-right: 6px; font-variant-numeric: tabular-nums; color: var(--text-3); }

/* ---------- İçtihat takibi (F11: pages/caselawwatch.js, components/caselaw-watch.js) ---------- */
.cw-head-btn { margin-left: auto; }
.cw-form { display: grid; gap: 14px; margin-bottom: 16px; }
.cw-form h2 { margin: 0; font-size: 17px; }
.cw-form .segmented { justify-self: start; }
.cw-form .notice, .cw-form .hint { margin: 0; }
.cw-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px 16px; }
.cw-form-grid[hidden] { display: none; }
.cw-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.cw-new { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.cw-item.paused { opacity: 0.75; }
.cw-recs { display: grid; gap: 4px; font-size: 13px; min-width: 0; }
.cw-recs .hint { margin: 0; }
.cw-recs ul { margin: 0; padding-left: 1.4em; display: grid; gap: 2px; overflow-wrap: anywhere; }
.cw-recs a { color: var(--brand); }
.cw-cov, .cw-none, .cw-paused { margin: 0; }
.cw-hits { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cw-hit { border-left-color: var(--brand); }
.cw-hit.acked { border-left-color: var(--ok); }
.cw-hit.dismissed { border-left-color: var(--border-strong); }
.cw-passage { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--text-2); overflow-wrap: anywhere; }
.cw-sug { display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.cw-sug[hidden] { display: none; }
.cw-sug .hint { margin: 0; }
.cw-sug-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; }
.cw-sug-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.cw-note > a { font-weight: 600; color: var(--brand); }
.results-watch { margin-left: auto; }
.cw-head-acts { display: flex; flex-wrap: wrap; gap: 8px; }
/* Müvekkil bülteni (pages/bulletin.js, hanlaw/bulletin.py) */
.bt-card { display: grid; gap: 16px; }
.bt-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px 16px; }
.bt-groups { display: grid; gap: 14px; }
.bt-group { margin: 0; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius); min-width: 0; }
.bt-group legend { padding: 0 6px; font-weight: 600; }
.bt-group-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; margin-bottom: 8px; }
.bt-group-head .hint { margin: 0; }
.bt-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.bt-item { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--surface-2); cursor: pointer; }
.bt-item input { margin-top: 3px; flex: none; }
.bt-item-body { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; font-size: 13.5px; }
.bt-item-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: var(--text-3); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.bt-item-sum { color: var(--text-2); }
.bt-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px 16px; }
.bt-count { color: var(--text-2); font-weight: 600; }
.bt-how { margin: 0; }
/* Sözleşme portföyü (pages/portfolio.js, hanlaw/portfolio.py) */
.pf-item.open { border-color: var(--brand); }
.pf-flag-danger { background: var(--danger-soft); color: var(--danger); border-color: transparent; }
.pf-flag-warn { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.pf-detail { display: grid; gap: 12px; margin-bottom: 16px; scroll-margin-top: 80px; }
.pf-d-title { margin: 0; font-size: 18px; overflow-wrap: anywhere; }
.pf-period { margin: 0; color: var(--text-2); }
.pf-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 10px 14px; }
.pf-form .pf-wide { grid-column: 1 / -1; }
.pf-text > summary { cursor: pointer; color: var(--brand); font-weight: 500; min-height: 32px; display: flex; align-items: center; }
.pf-text .hint { margin: 4px 0; }
.pf-obl { display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.pf-obl-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pf-obl-item { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; padding: 10px 12px; border-left: 3px solid var(--border-strong); background: var(--surface-2); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.pf-obl-item.pf-st-gecikti { border-left-color: var(--danger); }
.pf-obl-item.pf-st-yakin { border-left-color: var(--warn); }
.pf-obl-item.pf-st-tamam { border-left-color: var(--ok); opacity: 0.75; }
.pf-obl-main { display: grid; gap: 2px; min-width: min(100%, 260px); flex: 1; overflow-wrap: anywhere; font-size: 13.5px; }
.pf-obl-main .hint { margin: 0; }
.pf-quote > summary { cursor: pointer; color: var(--brand); font-size: 12.5px; }
.pf-quote p { margin: 4px 0 0; font-size: 13px; color: var(--text-2); }
.pf-obl-side { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pf-obl-side .input, .pf-obl-side .select { width: auto; min-height: 36px; padding: 4px 8px; font-size: 13px; }
.pf-left { font-size: 12.5px; font-variant-numeric: tabular-nums; color: var(--text-3); }
.pf-left-gecikti { color: var(--danger); font-weight: 600; }
.pf-left-yakin { color: var(--warn); font-weight: 600; }
.pf-obl-add { display: grid; grid-template-columns: 2fr 1fr auto auto auto; gap: 6px; align-items: center; }
@media (max-width: 760px) {
  .pf-obl-add { grid-template-columns: 1fr 1fr; }
  .pf-obl-add .input:first-of-type { grid-column: 1 / -1; }
}
.tag.tag-warn { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
/* Atıf ağı (hanlaw/citations.py): okuyucuda "Bu kararı anan kararlar", takip sayfasında dayanılan kararlar */
.cite-head { margin-top: 22px; }
.cite-sum { margin: 0 0 8px; }
.cite-row { flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.cite-passage { margin: 6px 0 0; font-size: 13px; line-height: 1.5; color: var(--text-2); overflow-wrap: anywhere; }
.cw-cite-head { display: grid; gap: 4px; }
.cw-cite-head .hint { margin: 0; }

/* ---------- Örnekle dene (components/example.js) ve Araçlar (#/araclar, pages/tools.js) ---------- */
.example-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-width: 0; }
.example-head .hint { margin: 0; max-width: 36ch; }
.example-note { display: grid; gap: 4px; border-left: 3px solid var(--brand); overflow-wrap: anywhere; }
.example-note[hidden] { display: none; }
.example-note strong { color: var(--text); font-weight: 600; }
.example-note-list { margin: 0; padding-left: 18px; display: grid; gap: 2px; font-size: 13.5px; }
.draft-main > .example-note { margin-bottom: 12px; }
.tools-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.tools-card { display: flex; flex-direction: column; gap: 10px; }
.tools-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; }
.tools-card-head .tag { white-space: normal; }
.tools-card-title { margin: 0; font-size: 17px; font-weight: 600; color: var(--text); }
.tools-card-text { margin: 0; font-size: 14px; line-height: 1.55; color: var(--text-2); }
.tools-card-sample { margin: 0; font-size: 13px; line-height: 1.5; color: var(--text-3); }
.tools-card-label { font-weight: 600; color: var(--text-2); }
.tools-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 4px; }
.tools-records-hint { margin: 0 0 10px; }
.tools-records { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 8px; }
.tools-record-link { display: grid; gap: 2px; height: 100%; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--text-2); font-size: 13.5px; text-decoration: none; overflow-wrap: anywhere; transition: border-color var(--motion-normal), background var(--motion-normal); }
.tools-record-link strong { color: var(--text); font-weight: 600; }
.tools-record-link:hover { border-color: var(--brand); background: var(--brand-soft); }
.tools-record-link:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
@media (max-width: 760px) {
  .example-btn, .tools-card-actions .btn { min-height: 44px; }
  .tools-card-actions .btn { flex: 1 1 auto; }
}

/* ---------- Açıklama balonu (components/tip.js) ---------- */
/* Tek balon; Popover API ile üst katmanda (diyaloğun da üstünde). z-index yalnız Popover desteklemeyen tarayıcı için:
   bildirimlerin (100) üstünde. Ters renk: koyu temada açık balon. */
.tip {
  position: fixed;
  inset: auto;
  margin: 0;
  z-index: 110;
  max-width: min(320px, calc(100vw - 16px));
  padding: 7px 10px;
  border: 0;
  border-radius: var(--radius-sm);
  background: var(--text);
  color: var(--bg);
  box-shadow: var(--shadow-lg);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  white-space: pre-line;
  overflow-wrap: anywhere;
  text-align: left;
  pointer-events: none;
  animation: tip-in var(--motion-fast) var(--ease-smooth) both;
}
.tip[hidden] { display: none; }
.tip-head { display: block; font-weight: 600; }
.tip[data-side="below"] { animation-name: tip-in-below; }
@keyframes tip-in { from { opacity: 0; transform: translateY(3px); } }
@keyframes tip-in-below { from { opacity: 0; transform: translateY(-3px); } }
/* ⓘ düğmesi: metnin yanında küçük; dokunmatikte 44 px dokunma alanı. */
.tip-i {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 18px;
  height: 18px;
  margin: 0 2px;
  padding: 0;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  background: var(--surface);
  color: var(--text-2);
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  vertical-align: middle;
  cursor: help;
  transition: border-color var(--motion-fast) var(--ease-smooth), color var(--motion-fast) var(--ease-smooth);
}
.tip-i:hover,
.tip-i[aria-expanded="true"] { border-color: var(--brand); color: var(--brand); }
.tip-i:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.status-dot[data-tip-toggle] { cursor: pointer; }
.status-dot:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
@media (pointer: coarse) {
  .tip-i::after { content: ""; position: absolute; inset: -13px; }
  [data-tip] { -webkit-touch-callout: none; }
}

/* ---------- Kullanım kılavuzu (pages/help.js) ---------- */
/* Sayfa başlığındaki "Bu sayfa nasıl kullanılır?" bağlantısı (app.js route ekler). */
.page-head .page-help {
  display: inline-block;
  margin-top: 6px;
  font-size: 13px;
  color: var(--brand);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.help-btn[aria-current="page"] { color: var(--brand); background: var(--brand-soft); }
/* Telefonda şerit dolu (gündem + aktif dosya çipiyle 375 px'e sığmaz): kılavuz sayfa başlığındaki bağlantıdan ve
   hesap menüsünden açılır. */
@media (max-width: 480px) {
  .help-btn { display: none; }
}
.help-filter { width: min(320px, 100%); }
.help-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
.help-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.help-toc {
  position: sticky;
  top: 84px;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
  font-size: 14px;
}
.help-toc ul { list-style: none; margin: 0 0 12px; padding: 0; }
.help-toc-group {
  margin: 4px 0 4px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-3);
}
.help-toc-link {
  display: block;
  width: 100%;
  padding: 6px 8px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-2);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.help-toc-link:hover { background: var(--surface-3); color: var(--text); }
.help-toc-link:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.help-section { scroll-margin-top: 84px; }
.help-h2 { margin: 0 0 8px; font-size: 20px; scroll-margin-top: 84px; }
.help-h2:focus { outline: none; }
.help-h3 { margin: 16px 0 6px; font-size: 15px; font-weight: 600; color: var(--text); }
.help-what { margin: 0; color: var(--text-2); max-width: 75ch; }
.help-list { margin: 0; padding-left: 20px; max-width: 75ch; }
.help-list li { margin: 4px 0; line-height: 1.5; }
.help-defs { display: grid; grid-template-columns: minmax(140px, 220px) minmax(0, 1fr); gap: 8px 16px; margin: 0; }
.help-defs dt { font-weight: 600; color: var(--text); }
.help-defs dd { margin: 0; color: var(--text-2); line-height: 1.5; }
.help-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; margin-bottom: 8px; }
.help-go { margin: 14px 0 0; font-size: 14px; }
.help-go a { color: var(--brand); }
@media (max-width: 900px) {
  .help-layout { grid-template-columns: minmax(0, 1fr); }
  .help-toc { position: static; max-height: none; }
  .help-toc ul { display: flex; flex-wrap: wrap; gap: 4px; }
  .help-toc-link { width: auto; border: 1px solid var(--border); }
}
@media (max-width: 600px) {
  .help-defs { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .help-defs dd { margin-bottom: 8px; }
  .help-cols { grid-template-columns: minmax(0, 1fr); }
}