/* Sevkora API dokümantasyon portalı — GELİŞTİRİCİ BELGE YÜZEYİ (TASK-028;
 * kabuk ve okuma deneyimi TASK-269).
 *
 * KAYNAK: apps/web/src/styles/tokens.css (kök DESIGN.md front-matter'ının
 * CSS karşılığı). Aşağıdaki token bloğu o dosyayla BİREBİR aynıdır: portal
 * ve SPA aynı tasarım sözleşmesinin iki render'ıdır. Sürükleme
 * PortalTokenParityTest ile kırmızıya döner — değer elle değiştirilmez,
 * kaynak dosyayla birlikte taşınır.
 *
 * DESIGN.md yasakları (portal apps/web dışında olduğundan design check
 * taraması buraya uzanmaz; disiplin PortalTokenParityTest ile zorlanır):
 * gradyan yok, hap köşe yok, öncelik kaçışı yok. Derinlik 1px çizgiye EK
 * olarak ölçülü gölge taşır (DEC-142): gölge yalnız var(--shadow-*) token'ı
 * üzerinden yazılır, elle değer yasaktır. Köşe en fazla {rounded.lg}.
 * Harici font/CDN yoktur: aileler sistem yedeklerine düşer.
 *
 * İLKEL SET TÜKETİLİR, LEHÇE YAZILMAZ (TASK-269; DEC-217). Button.css ve
 * PageHeader.css TASK-273 ile `/ilkeller.css` içine girdi. Portalın kendi
 * düğme lehçesi bu görevle EMEKLİ oldu: kopyalama denetimi ve iki çekmece
 * düğmesi artık `.btn` ilkelini giyer ve burada YALNIZ yerleşime ait olan
 * şey kalır (görünürlük eşiği, durum rengi). Ölçülmüş bedeli vardı:
 * kopyalama düğmesi 19px çiziliyordu, yani WCAG 2.5.8'in 24px tabanının
 * ALTINDA; ilkel onu masaüstünde 24px, dokunmatik yerleşimde 44px yapar.
 *
 * PageHeader ilkeli (`.sayfa-basligi`) BİLEREK TÜKETİLMEDİ ve gerekçesi
 * ölçüldü: DEC-210 o kabuğu {breakpoints.lg} üstünde `position: sticky;
 * top: 0; z-index: 10; background: {colors.paper}` yapar. SPA'da bu doğrudur
 * çünkü SPA'nın yapışkan bir üst bandı YOKTUR (kaynakta tek `position:
 * sticky` bildirimi PageHeader'ınkidir). Portalın bandı yapışkandır; ilkeli
 * olduğu gibi tüketmek belge başlığını bandın ÜSTÜNE bindirirdi, bandı
 * yükseltmek ise başlığı bandın ALTINA gömerdi. İkisi de ilkelin sahip
 * olduğu dört özelliği yeniden bildirmeyi gerektirir — yani ayrışmanın ta
 * kendisini. Doğru onarım ilkelin bandı öğrenmesidir ve o SPA'yı da
 * değiştirir: bu görevin kapsamı değil, raporlanan bir bulgudur.
 */

:root {
  /* SEVKORA-TOKEN-BLOK BASLANGIC — uretilmis (token-css.mjs); elle duzenlenmez */
  /* Tema: TEK bildirim, iki deger (DEC-147). color-scheme sistem
     varsayilanini kurar; :root[data-theme=light|dark] acik tercihi
     uygular (DEC-146). */
  color-scheme: light dark;

  /* colors — acik / koyu ("gece kagidi", notr-gri SaaS koyusu DEGIL) */
  --color-canvas: light-dark(#DEDEE5, #08080C);
  --color-canvas-deep: light-dark(#D2D0DF, #0E0D16);
  --color-paper: light-dark(#FBFBFD, #111117);
  --color-paper-deep: light-dark(#F3F3F7, #0C0C12);
  --color-surface: light-dark(#FFFFFF, #1A1A23);
  --color-surface-overlay: light-dark(#FFFFFF, #23232E);
  --color-scrim: light-dark(rgb(16 18 43 / 40%), rgb(0 0 0 / 60%));
  --color-ink: light-dark(#16182B, #ECECF2);
  --color-ink-soft: light-dark(#61667D, #9EA0B2);
  --color-line: light-dark(#E9E9F0, #2A2A36);
  --color-line-strong: light-dark(#73738A, #767694);
  --color-fill-soft: light-dark(#F1F1F6, #22222D);
  --color-primary: light-dark(#4C1D95, #C9B8FC);
  --color-primary-deep: light-dark(#3B1578, #DED2FE);
  --color-on-fill: light-dark(#FFFFFF, #16182B);
  --color-on-photo: light-dark(#FFFFFF, #FFFFFF);
  --color-photo-scrim: light-dark(rgb(0 0 0 / 60%), rgb(0 0 0 / 60%));
  --color-photo-scrim-soft: light-dark(rgb(0 0 0 / 30%), rgb(0 0 0 / 30%));
  --color-photo-floor: light-dark(#717171, #717171);
  --color-data: light-dark(#155E75, #67E8F9);
  --color-accent: light-dark(#5B21B6, #C4B5FD);
  --color-success: light-dark(#065F46, #6EE7B7);
  --color-warning: light-dark(#92400E, #FCD34D);
  --color-danger: light-dark(#991B1B, #FCA5A5);
  --color-rail: light-dark(#F9F7FC, #15151D);
  --color-rail-deep: light-dark(#EBE3F5, #221A33);
  --color-rail-ink: light-dark(#16182B, #ECECF2);
  --color-rail-ink-soft: light-dark(#61667D, #9EA0B2);
  --color-rail-line: light-dark(#73738A, #767694);
  --color-rail-fill: light-dark(#FFFFFF, #262633);
  --color-rail-accent: light-dark(#5B21B6, #C4B5FD);
  --color-sky-surface: light-dark(#DBEAFE, #16233F);
  --color-sky-chip: light-dark(#BFDBFE, #1E3A5F);
  --color-sky-ink: light-dark(#1E40AF, #93C5FD);
  --color-violet-surface: light-dark(#EDE9FE, #241C46);
  --color-violet-chip: light-dark(#DDD6FE, #332764);
  --color-violet-ink: light-dark(#5B21B6, #C4B5FD);
  --color-rose-surface: light-dark(#FCE7F3, #3B1229);
  --color-rose-chip: light-dark(#FBCFE8, #551A3B);
  --color-rose-ink: light-dark(#9D174D, #F9A8D4);
  --color-amber-surface: light-dark(#FEF3C7, #372408);
  --color-amber-chip: light-dark(#FDE68A, #52360C);
  --color-amber-ink: light-dark(#92400E, #FCD34D);
  --color-mint-surface: light-dark(#D1FAE5, #0C2E20);
  --color-mint-chip: light-dark(#A7F3D0, #12452F);
  --color-mint-ink: light-dark(#065F46, #6EE7B7);
  --color-coral-surface: light-dark(#FEE2E2, #3A1517);
  --color-coral-chip: light-dark(#FECACA, #55201F);
  --color-coral-ink: light-dark(#991B1B, #FCA5A5);
  --color-teal-surface: light-dark(#CFFAFE, #0C2F36);
  --color-teal-chip: light-dark(#A5F3FC, #114650);
  --color-teal-ink: light-dark(#155E75, #67E8F9);
  --color-band-deep: light-dark(#3B1578, #1B1436);
  --color-band: light-dark(#4C1D95, #2C2154);
  --color-band-lift: light-dark(#5B21B6, #3B1578);
  --color-band-ink: light-dark(#FFFFFF, #FFFFFF);
  --color-band-ink-soft: light-dark(#DDD6FE, #C4B5FD);
  --color-karton: light-dark(#FDE68A, #FDE68A);
  --color-karton-acik: light-dark(#FEF3C7, #FEF3C7);
  --color-karton-koyu: light-dark(#92400E, #92400E);
  --color-etiket-kagit: light-dark(#FFFFFF, #FFFFFF);
  --color-etiket-cizgi: light-dark(#E9E9F0, #E9E9F0);
  --color-etiket-murekkep: light-dark(#16182B, #16182B);
  --color-etiket-murekkep-soluk: light-dark(#61667D, #61667D);
  --color-etiket-mor: light-dark(#4C1D95, #4C1D95);

  /* tint — durum renginin dusuk alfali yuzey tonlamasi (DEC-149) */
  --tint-surface: 12%;
  --tint-grup-cip: 50%;
  --color-tint-neutral: color-mix(in srgb, var(--color-ink-soft) var(--tint-surface), transparent);
  --color-tint-accent: color-mix(in srgb, var(--color-accent) var(--tint-surface), transparent);
  --color-tint-success: color-mix(in srgb, var(--color-success) var(--tint-surface), transparent);
  --color-tint-warning: color-mix(in srgb, var(--color-warning) var(--tint-surface), transparent);
  --color-tint-danger: color-mix(in srgb, var(--color-danger) var(--tint-surface), transparent);

  /* tint — kendi kagidina binmis (opak) ton; tek tuketici secili durum cipi (DEC-232) */
  --color-tint-on-surface-neutral: color-mix(in srgb, var(--color-ink-soft) var(--tint-surface), var(--color-surface));
  --color-tint-on-surface-accent: color-mix(in srgb, var(--color-accent) var(--tint-surface), var(--color-surface));
  --color-tint-on-surface-success: color-mix(in srgb, var(--color-success) var(--tint-surface), var(--color-surface));
  --color-tint-on-surface-warning: color-mix(in srgb, var(--color-warning) var(--tint-surface), var(--color-surface));
  --color-tint-on-surface-danger: color-mix(in srgb, var(--color-danger) var(--tint-surface), var(--color-surface));

  /* typography — aileler */
  --font-display: Archivo, system-ui, sans-serif;
  --font-body: Inter, system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* typography — display-3xl */
  --type-display-3xl-family: var(--font-display);
  --type-display-3xl-size: clamp(2.5rem, 5.4vw, 4.75rem);
  --type-display-3xl-weight: 700;
  --type-display-3xl-line-height: 1.02;
  --type-display-3xl-letter-spacing: -0.032em;

  /* typography — display-2xl */
  --type-display-2xl-family: var(--font-display);
  --type-display-2xl-size: 3.25rem;
  --type-display-2xl-weight: 700;
  --type-display-2xl-line-height: 1.04;
  --type-display-2xl-letter-spacing: -0.022em;

  /* typography — display-xl */
  --type-display-xl-family: var(--font-display);
  --type-display-xl-size: 2.5rem;
  --type-display-xl-weight: 700;
  --type-display-xl-line-height: 1.12;
  --type-display-xl-letter-spacing: -0.016em;

  /* typography — display-lg */
  --type-display-lg-family: var(--font-display);
  --type-display-lg-size: 1.875rem;
  --type-display-lg-weight: 600;
  --type-display-lg-line-height: 1.18;
  --type-display-lg-letter-spacing: -0.01em;

  /* typography — heading-md */
  --type-heading-md-family: var(--font-display);
  --type-heading-md-size: 1.3125rem;
  --type-heading-md-weight: 600;
  --type-heading-md-line-height: 1.3;

  /* typography — heading-sm */
  --type-heading-sm-family: var(--font-display);
  --type-heading-sm-size: 1.0625rem;
  --type-heading-sm-weight: 600;
  --type-heading-sm-line-height: 1.35;

  /* typography — body-md */
  --type-body-md-family: var(--font-body);
  --type-body-md-size: 0.9375rem;
  --type-body-md-line-height: 1.55;

  /* typography — body-sm */
  --type-body-sm-family: var(--font-body);
  --type-body-sm-size: 0.8125rem;
  --type-body-sm-line-height: 1.5;

  /* typography — label-xs */
  --type-label-xs-family: var(--font-body);
  --type-label-xs-size: 0.6875rem;
  --type-label-xs-weight: 600;
  --type-label-xs-letter-spacing: 0.08em;
  --type-label-xs-transform: uppercase;

  /* typography — mono-lg */
  --type-mono-lg-family: var(--font-mono);
  --type-mono-lg-size: 1.375rem;
  --type-mono-lg-letter-spacing: 0.012em;

  /* typography — mono-md */
  --type-mono-md-family: var(--font-mono);
  --type-mono-md-size: 0.875rem;

  /* typography — mono-xs */
  --type-mono-xs-family: var(--font-mono);
  --type-mono-xs-size: 0.625rem;

  /* spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-sm-md: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-lg-xl: 32px;
  --space-xl: 40px;
  --space-2xl: 64px;
  --space-3xl: 96px;

  /* rounded */
  --rounded-none: 0px;
  --rounded-sm: 6px;
  --rounded-md: 10px;
  --rounded-lg: 14px;
  --rounded-xl: 18px;
  --rounded-2xl: 24px;
  --rounded-full: 999px;

  /* shadow */
  --shadow-raised: 0 1px 2px light-dark(rgb(16 18 43 / 4%), rgb(0 0 0 / 28%)), 0 4px 12px light-dark(rgb(16 18 43 / 6%), rgb(0 0 0 / 22%));
  --shadow-lifted: 0 1px 2px light-dark(rgb(16 18 43 / 5%), rgb(0 0 0 / 30%)), 0 8px 20px light-dark(rgb(16 18 43 / 8%), rgb(0 0 0 / 30%));
  --shadow-overlay: 0 12px 32px light-dark(rgb(16 18 43 / 14%), rgb(0 0 0 / 50%));
  --shadow-shell: 0 24px 64px light-dark(rgb(16 18 43 / 10%), rgb(0 0 0 / 55%));
  --shadow-deep: 0 2px 4px light-dark(rgb(16 18 43 / 5%), rgb(0 0 0 / 40%)), 0 20px 48px light-dark(rgb(16 18 43 / 12%), rgb(0 0 0 / 50%)), 0 56px 96px light-dark(rgb(16 18 43 / 10%), rgb(0 0 0 / 40%));

  /* motion */
  --motion-instant: 90ms;
  --motion-fast: 160ms;
  --motion-base: 260ms;
  --motion-slow: 460ms;
  --motion-stagger: 45ms;
  --motion-ease: cubic-bezier(0.2,0.8,0.2,1);
  --motion-ease-in: cubic-bezier(0.55,0,1,0.45);
  --motion-ease-line: cubic-bezier(0.65,0,0.35,1);

  /* breakpoints */
  --bp-sm: 480px;
  --bp-md: 768px;
  --bp-lg: 1024px;

  /* layout */
  --layout-content-max: 1200px;
  --layout-tap-target: 44px;
  --layout-rail-width: 272px;
  --layout-rail-collapsed: 76px;
  --layout-shell-inset: 16px;
  /* SEVKORA-TOKEN-BLOK SON */

  /* portal yerleşim ölçüleri */
  --portal-band-height: 48px;
  /* 232 -> 244 (TASK-401): sekme seridi iki esit yarima bolunur ve sag yarim
     `/api/partner/v1` mono yolunu TASIMALI. Olculdu: yol 99px, eski yarimin ic
     genisligi 88px'ti ve yol kutusunu 11px asiyordu.

     244'TE KALIR (TASK-402; DEC-357). Yol artik `--type-mono-xs-size` ile
     dizilir (90px) ve olcum daraltmanin bedelini soyluyor: kutunun tasmamasi
     icin menu en az 236px olmali, yani 244'ten kirpilan her piksel yeni
     kazanilan payi geri alir. TASK-401'de odenen 12px GERI ALINMAZ, PAYA
     donusur. */
  --portal-nav-width: 244px;
  --portal-toc-width: 208px;
  /* İÇERİK TAVANI TOKEN'DAN OKUNUR, İKİNCİ KEZ YAZILMAZ (TASK-269).
     Önceki hâli `1200px` literaliydi ve {layout.content-max} ile AYNI değeri
     ikinci kez bildiriyordu; sözleşme tavanı değiştiğinde portal sessizce
     eski değerde kalırdı. Değişkenin kendisi kalır (yerleşim ölçüleri tek
     yerden okunsun diye), okuduğu şey artık token'dır. */
  --portal-content-max: var(--layout-content-max);
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }


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

/* SEVKORA-PORTAL-LISTE-IMI-BLOK BASLANGIC — uretilmis (token-css.mjs); elle duzenlenmez; kaynak DESIGN.md portal-liste-imi-taban + portal-liste-imi-istisna */
/* Portal ve hukuki belge liste kabi tarayicinin varsayilan imini cizmez
   (DESIGN.md "Liste imi — portal ve hukuki belge kapsamı"; TASK-582,
   DEC-592). Liste anlamsal kalir, ogeleri bosluk ayirir. Imin TEK
   tasiyicisi bu bloktur; elle yazilan bir im bildirimini
   PortalListeImiDenetimiTest adiyla kirmizi sayar. */
ul,
ol,
menu {
  list-style: none;
}

/* ISTISNA (DEC-592): .portal-doc__govde numarasini ve imini korur; im tarayici
   varsayilaniyla degil tasarim tokenlariyla cizilir (DESIGN.md
   portal-liste-imi-istisna bildirimi). */
.portal-doc__govde ul {
  list-style-type: disc;
}

.portal-doc__govde ol {
  list-style-type: decimal;
}

.portal-doc__govde li::marker {
  color: var(--color-ink-soft);
  font-family: var(--type-mono-md-family);
  font-size: var(--type-mono-md-size);
}
/* SEVKORA-PORTAL-LISTE-IMI-BLOK SON */

body.portal {
  margin: 0;
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--type-body-md-family);
  font-size: var(--type-body-md-size);
  line-height: var(--type-body-md-line-height);
}

a {
  color: var(--color-primary);
}

a:hover {
  color: var(--color-primary-deep);
}

:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

.portal-skip {
  position: absolute;
  left: -9999px;
}

.portal-skip:focus {
  left: var(--space-md);
  top: var(--space-sm);
  z-index: 3;
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  padding: var(--space-xs) var(--space-sm);
}

/* ÜST BANT — YAPIŞKAN BAĞLAM (TASK-269).
   Bant eskiden sayfa BAŞLIĞINI tekrarlıyordu ve o başlık zaten iki santim
   aşağıda h1 olarak duruyordu; yani yapışkan alanın taşıdığı tek bilgi
   ekranda ikinci kez yazılmıştı. Uç sayfalarında bant artık sayfanın MAKİNE
   KİMLİĞİNİ taşır: metod damgası + mono yol. Uzun bir referans sayfasında
   aşağı inen okuyucu "hangi uçtayım" sorusunu kaydırmadan yanıtlar.

   z-index 2'dir ve bu sayı bilinçlidir: belge sayfasındaki hiçbir yapışkan
   öğe bandın üstüne çıkmamalıdır, çekmece (50) ve perde ise çıkmalıdır. */
.portal-band {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: var(--space-md);
  height: var(--portal-band-height);
  padding: 0 var(--space-lg);
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-line);
}

.portal-band__mark {
  flex: none;
  font-family: var(--type-label-xs-family);
  font-size: var(--type-label-xs-size);
  font-weight: var(--type-label-xs-weight);
  letter-spacing: var(--type-label-xs-letter-spacing);
  text-transform: var(--type-label-xs-transform);
  text-decoration: none;
  color: var(--color-ink);
}

/* Bağlam kabı: içinde YA sayfa başlığı YA uç kimliği durur, ikisi birden
   değil. İkisini birden basmak 48px'lik bandı kalabalıklaştırırdı ve
   başlığı h1 zaten söylüyor. */
.portal-band__baglam {
  display: flex;
  align-items: center;
  gap: var(--space-sm-md);
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.portal-band__title {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: var(--type-body-sm-family);
  font-size: var(--type-body-sm-size);
  color: var(--color-ink-soft);
}

/* Yol daralınca KIRPILIR, sarmaz: 48px'lik bant sabit yüksekliktedir ve
   sarma onu iki satıra çıkarırdı. Baştaki kısım korunur, kuyruk kırpılır. */
.portal-band__yol {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: var(--type-mono-md-family);
  font-size: var(--type-mono-md-size);
  color: var(--color-ink);
}

.portal-band__meta {
  flex: none;
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: var(--type-body-sm-size);
}

.portal-band__link {
  font-family: var(--type-body-sm-family);
  font-size: var(--type-body-sm-size);
}

/* Damga rozeti: dolgusuz, 1px renkli kenar + renkli metin */
.portal-stamp {
  display: inline-block;
  padding: 2px var(--space-sm);
  border: 1px solid var(--color-primary);
  border-radius: var(--rounded-sm);
  color: var(--color-primary);
  font-family: var(--type-label-xs-family);
  font-size: var(--type-label-xs-size);
  font-weight: var(--type-label-xs-weight);
  letter-spacing: var(--type-label-xs-letter-spacing);
  text-transform: var(--type-label-xs-transform);
}

.portal-stamp--id {
  font-family: var(--type-mono-md-family);
  text-transform: none;
  letter-spacing: 0;
}

.portal-stamp--danger {
  border-color: var(--color-danger);
  color: var(--color-danger);
}

/* METOD DAMGASI (TASK-269) — ve rengi SÜS DEĞİL, mevcut mürekkep
   sözleşmesinin uygulamasıdır (DESIGN.md Overview: iki mürekkep, iki ayrı iş).

   Ölçülen kusur şuydu: dizinde GET, POST, PATCH ve DELETE aynı sönük gri
   {typography.label-xs} etiketle çiziliyordu, üstelik MONO DEĞİLDİ. Yani bir
   API referansının en çok taranan sütunu hiçbir ayrım taşımıyordu ve
   tanımlayıcı dizilim kuralı tam da tanımlayıcının kendisinde tutulmuyordu.

   Eşleme sözleşmeden okunur, uydurulmaz:
     GET     -> {colors.data}    canlı ÖLÇÜM ve sinyal mürekkebi; okuma isteği
                                 veriyi getirir, durumu değiştirmez.
     yazan   -> {colors.primary} HAREKET ve aksiyon mürekkebi (damganın
                                 varsayılanı; POST, PATCH, PUT ayrı kural
                                 istemez).
     DELETE  -> {colors.danger}  yıkıcı işlem, arayüzün geri kalanıyla aynı dil.
   Beş renkli bir metod paleti moda bir seçim olurdu ve bu dünyanın iki
   mürekkep kuralını delerdi; üç sınıf, kuralın KENDİSİNDEN türer.

   Sabit genişlik cetvelin işidir: damgalar aynı genişlikte olduğu için
   yollar dizinde tek bir dikey çizgide başlar ve göz sütunu tarayabilir. */
.portal-metod {
  flex: none;
  min-width: 4.5rem;
  text-align: center;
  font-family: var(--type-mono-md-family);
  text-transform: none;
  letter-spacing: 0;
}

.portal-metod[data-metod="GET"] {
  border-color: var(--color-data);
  color: var(--color-data);
}

.portal-metod[data-metod="DELETE"] {
  border-color: var(--color-danger);
  color: var(--color-danger);
}

/* Bant içindeki damga bandın yüksekliğini BÜYÜTMEZ: 48px sabittir. */
.portal-band__metod {
  padding-block: 0;
}

/* İskelet: sol nav, içerik, yapışkan içindekiler */
.portal-shell {
  display: grid;
  grid-template-columns: var(--portal-nav-width) minmax(0, 1fr) var(--portal-toc-width);
  gap: var(--space-lg);
  max-width: var(--portal-content-max);
  margin: 0 auto;
  padding: var(--space-lg);
  align-items: start;
}

.portal-nav,
.portal-toc {
  position: sticky;
  top: calc(var(--portal-band-height) + var(--space-lg));
  max-height: calc(100vh - var(--portal-band-height) - var(--space-xl));
  overflow-y: auto;
}

.portal-nav {
  border-right: 1px solid var(--color-line);
  padding-right: var(--space-md);
}

/* YÜZEY SEKMESİ (TASK-401; DEC-355).

   DEC-352'nin yüzey BANDI kalktı, yerine SEKME geldi. Bant sınırı görünür
   kılıyordu ama menü iki yüzeyi birden çizmeye devam ediyordu; okuyucu 69
   satırın 30'unu (ya da 22'sini) hep taşıyordu. Menü artık yalnız aktif
   yüzeyi çizer ve şerit diğerine geçirir.

   BANT KALDIRILDI, KORUNMADI: menü tek yüzey çizdiği için bant ile aktif
   sekme AYNI ŞEYİ söylerdi. Taban yolu sekmeye TAŞINDI — iki yüzeyin
   ayrıldığı yer tam olarak orasıdır ve mono dizilir.

   İKİ SEKME DE BAĞLANTIDIR (JS yok, CSP'ye dokunulmaz). Aktif olan da
   bağlantı kalır: bağlantısız bırakılsaydı o yüzeyin giriş sayfasına dönmenin
   tek yolu kapanırdı.

   IZGARA `1fr 1fr`DİR, `auto`DEĞİL: iki sekme EŞİT genişlik alır, yoksa uzun
   adlı yüzey diğerini ezer ve şerit bir "anahtar" gibi değil bir liste gibi
   okunur. */
.portal-nav__sekmeler {
  /* SERIT MENUNUN ICINDE YAPISKANDIR (TASK-402; DEC-356 eki).
     DEC-352 onegi tam da bu sebeple korumustu: "kaydirilan menude bolum bandi
     ekrandan cikar; orada ciplak bir `Webhooks` etiketi hangi yuzeyde
     oldugunu SOYLEMEZ." Onek kalkinca o gerekce yeniden sorulmali oldu ve
     OLCUM onu DOGRULADI: is ortagi menusu 1506px icerigi 812px'lik kaba
     sigmiyor ve dibe inildiginde serit gorunmuyordu (olculdu, 1280x900).
     Yapiskanlik cevabi ONEKTEN IYIDIR: yuzeyi dokuz grup adinda dokuz kez
     tekrarlamak yerine, seritte BIR kez ve HER ZAMAN soyler.
     `top: 0` KABIN kendi tepesidir: kaydirma sayfanin degil menunun icindedir
     (`.portal-nav` `overflow-y: auto` tasir). Zemin OPAK olmali, yoksa altta
     kayan grup adlari seridin icinden gorunur. */
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--color-canvas);
  padding-bottom: var(--space-xs);
  display: grid;
  /* `minmax(0, 1fr)`, `1fr` DEGIL: `1fr`in ortulu `min-width: auto`si uzun
     adli sekmeyi genisletir ve serit esit iki yarim olmaktan cikar (olculdu:
     98px + 117px). Sifir taban, iki yarimi GERCEKTEN esit yapar. */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-xs);
  margin-bottom: var(--space-lg);
}

.portal-nav__sekme {
  display: flex;
  flex-direction: column;
  gap: 2px;
  /* {spacing.xs} -> {spacing.sm} (TASK-402; DEC-357). Kullanicinin "dar"
     dedigi sey buydu: metin kenara yapisik duruyordu. Inset 4px'ten 8px'e
     cikinca kenardan metne mesafe 6.5px'ten 11.5px'e cikar ve IKI sekmede de
     AYNI olur. Bu, taban yolu kucultulmeden YAPILAMAZDI: 11px'lik yolla ayni
     ic bosluk -5.5px pay verir, yani yol kutuyu TASAR (olculdu). */
  padding: var(--space-sm);
  border: 1px solid var(--color-line);
  border-radius: var(--rounded-md);
  /* ZEMIN {colors.paper}, {colors.canvas} DEGIL: sekme sayfanin ZEMINI degil,
     onun uzerinde duran bir YUZEYDIR. Ilk yazimda canvas secilmisti ve kontrast
     kapisi bunu yakaladi: ink-soft/canvas acik temada 4.23 verir, esik 4.5.
     paper ile 5.48 (acik) ve 7.28 (koyu) olur; ikisi de gecer. */
  background: var(--color-paper);
  color: var(--color-ink-soft);
  font-family: var(--type-label-xs-family);
  font-size: var(--type-label-xs-size);
  font-weight: var(--type-label-xs-weight);
  letter-spacing: var(--type-label-xs-letter-spacing);
  text-transform: var(--type-label-xs-transform);
  text-decoration: none;
}

.portal-nav__sekme:hover {
  border-color: var(--color-line-strong);
  color: var(--color-ink);
}

/* AKTİF SEKME RENKLE DEĞİL, RENK + KENARLA ayrılır: rengi tek başına taşımak
   renk körü okuyucu için ayrımı yok ederdi (aktif olan ayrıca `aria-current`
   taşır, yani ayrım ekran okuyucuda da vardır). */
.portal-nav__sekme.is-active {
  border-color: var(--color-primary);
  background: var(--color-fill-soft);
  color: var(--color-primary-deep);
}

.portal-nav__sekme-ad {
  min-width: 0;
}

/* YOL SARMAZ: `/api/partner/v1` satir sonunda `/api/partner/` + `v1` diye
   bolunuyordu (olculdu) ve bolunmus bir yol, YANLIS bir yol gibi okunur.

   BOYUT {typography.mono-xs} (TASK-402; DEC-357). Olcege eklenen bu kademe,
   sekmenin ic boslugunun buyuyebilmesi icin gerekliydi — elle yazilmis bir
   `font-size` ayni pikseli verirdi ama PortalTokenParityTest'in kapisinin
   DISINDA kalirdi. Ad satiri {typography.label-xs}'te KALIR: o metin (71.7px)
   93.5px'lik ic genislige zaten rahat sığar.

   `letter-spacing: normal` DURUYOR: harf araligi kalitsaldir ve kutunun
   {typography.label-xs} izini (0.08em) tasir; mono bir yolda o aralik yolu
   gerer. */
.portal-nav__sekme-taban {
  white-space: nowrap;
  font-family: var(--type-mono-xs-family);
  font-size: var(--type-mono-xs-size);
  letter-spacing: normal;
  text-transform: none;
  color: var(--color-ink-soft);
}

/* Im TABANDAN gelir (SEVKORA-PORTAL-LISTE-IMI-BLOK; TASK-582) ve burada
   ikinci kez yazilmaz: iki bildirim, hangisinin tasidigini olculemez kilar. */
.portal-nav__list {
  margin: 0;
  padding: 0;
}

.portal-nav__item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: var(--space-xs);
  align-items: baseline;
  align-content: center;
  padding: var(--space-xs) var(--space-sm);
  border-left: 2px solid transparent;
  color: var(--color-ink);
  font-size: var(--type-body-sm-size);
  text-decoration: none;
}

.portal-nav__item:hover {
  background: var(--color-fill-soft);
}

.portal-nav__item.is-active {
  border-left-color: var(--color-primary);
  color: var(--color-primary-deep);
  background: var(--color-fill-soft);
}

.portal-nav__method {
  font-family: var(--type-mono-md-family);
  font-size: var(--type-label-xs-size);
  color: var(--color-ink-soft);
}

.portal-nav__label {
  min-width: 0;
}

/* İçerik kolonu */
.portal-main {
  min-width: 0;
  max-width: var(--portal-content-max);
}

/* BELGE KÂĞIDI. Dolgu bir DEĞİŞKENDEN okunur (Panel ilkelinin `--panel-dolgu`
   kalıbı): masthead ve gelecekteki kenardan kenara bloklar kartın kendi
   dolgusunu bilmek zorunda kalmasın, ONU İZLESİN. */
.portal-doc {
  --portal-doc-dolgu: var(--space-lg);

  background: var(--color-surface);
  border: 1px solid var(--color-line);
  /* Kose merdiveni (DEC-243): belge kabi bir PANELdir -> {rounded.xl}.
     SPA'nin `.panel` ilkeliyle AYNI basamak. */
  border-radius: var(--rounded-xl);
  box-shadow: var(--shadow-raised);
  padding: var(--portal-doc-dolgu);
}

/* BELGE BAŞLIĞI — ve altındaki kural 2px {colors.line-strong}'dur (DEC-197).
   Matbaa ayrımı sözleşmede yazılıdır: ince kural VERİYİ böler, kalın kural
   BELGEYİ tanımlar. Bir uç sayfası tek bir belgedir ve bu bant onun
   mastheadidir; bölüm başlıkları (h2) 1px ile ayrılır, yani iki hiyerarşi
   seviyesi ekranda AYNI işareti çizmez (DEC-211'in Toolbar'da yaptığı
   ayrımın portal karşılığı). */
.portal-doc__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-sm);
  padding-bottom: var(--space-md);
  border-bottom: 2px solid var(--color-line-strong);
  margin-bottom: var(--space-lg);
}

/* BAĞLAM SATIRI — bulunulan yer. Uç sayfası artık hangi grupta olduğunu
   SÖYLER; eskiden bu bilgi yalnız sol menüdeki seçili satırdan okunabiliyordu
   ve dar ekranda menü çekmeceye indiği için HİÇ okunamıyordu. Başlıktan
   sönüktür: sayfanın adı birincil, yeri ikincildir. */
.portal-baglam {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm-md);
  margin: 0;
  font-family: var(--type-label-xs-family);
  font-size: var(--type-label-xs-size);
  font-weight: var(--type-label-xs-weight);
  letter-spacing: var(--type-label-xs-letter-spacing);
  text-transform: var(--type-label-xs-transform);
  color: var(--color-ink-soft);
}

.portal-h1 {
  margin: 0;
  font-family: var(--type-display-lg-family);
  font-size: var(--type-display-lg-size);
  font-weight: var(--type-display-lg-weight);
  line-height: var(--type-display-lg-line-height);
  letter-spacing: var(--type-display-lg-letter-spacing);
}

/* BÖLÜM BAŞLIĞI KENDİ CETVELİNİ TAŞIR (TASK-269).
   Ölçülen kusur: uzun bir referans sayfasında h2 ile gövde metni arasındaki
   tek fark punto idi; sayfa aşağı indikçe bölümlerin nerede başladığı
   kayboluyordu. 1px {colors.line} kural, Toolbar ilkelinin bölüm başlığında
   kullandığı mekanizmanın ta kendisidir — portal aynı dili konuşur. */
.portal-h2 {
  display: flex;
  align-items: baseline;
  gap: var(--space-sm);
  margin: var(--space-lg-xl) 0 var(--space-sm-md);
  padding-bottom: var(--space-sm);
  border-bottom: 1px solid var(--color-line);
  font-family: var(--type-heading-md-family);
  font-size: var(--type-heading-md-size);
  font-weight: var(--type-heading-md-weight);
  line-height: var(--type-heading-md-line-height);
  scroll-margin-top: calc(var(--portal-band-height) + var(--space-md));
}

/* Masthead'in hemen ardından gelen ilk bölüm başlığı ikinci bir üst boşluk
   almaz: kalın kural zaten ayrımı yapmıştır. */
.portal-doc__head + .portal-h2,
.portal-doc__head + .portal-bolum .portal-h2 {
  margin-top: 0;
}

/* GRUP BAŞLIĞI — BÖLÜMÜN BİR KADEME ALTI (TASK-393; DEC-352).

   Dizin sayfası BÖLÜM > GRUP hiyerarşisi kazandı: yüzey `h2`, grup `h3`. Ayrım
   PUNTO ile değil AĞIRLIK ve CETVEL ile yapılır — grup kendi kuralını taşımaz,
   çünkü iki kademeli kural bir dizin sayfasını cetvel duvarına çevirirdi. */
.portal-h3 {
  display: flex;
  align-items: baseline;
  gap: var(--space-sm);
  margin: var(--space-lg) 0 var(--space-xs);
  font-family: var(--type-heading-sm-family);
  font-size: var(--type-heading-sm-size);
  font-weight: var(--type-heading-sm-weight);
  line-height: var(--type-heading-sm-line-height);
  scroll-margin-top: calc(var(--portal-band-height) + var(--space-md));
}

/* YÜZEY BLOĞU: bir bölüm kendi tabanını başlığının hemen altında taşır ve
   bloklar arasındaki boşluk, grup boşluğundan BÜYÜKTÜR — sınır göze
   hiyerarşiyi tek bakışta anlatan şeydir. */
.portal-bolum + .portal-bolum {
  margin-top: var(--space-xl);
}

.portal-bolum .portal-endpoint {
  margin-top: calc(-1 * var(--space-xs));
}

/* KALICI BAĞLANTI ÇENGELİ — geliştirici belgesinin sessiz sözleşmesi: her
   bölüm kendi adresine sahiptir ve o adres KOPYALANABİLİR olmalıdır.
   Sürekli görünmez, çünkü yirmi bölümlük bir sayfada yirmi ikon gövdeyi
   gürültüye boğardı; imleçle ve KLAVYEYLE ortaya çıkar (`:focus-visible`
   olmadan çengel klavye kullanıcısı için erişilemez bir bağlantı olurdu). */
.portal-cengel {
  display: inline-flex;
  align-items: center;
  flex: none;
  opacity: 0;
  color: var(--color-ink-soft);
  transition: opacity var(--motion-fast) var(--motion-ease);
}

.portal-h2:hover .portal-cengel,
.portal-h3:hover .portal-cengel,
.portal-cengel:focus-visible {
  opacity: 1;
}

.portal-cengel:hover {
  color: var(--color-primary);
}

.portal-lead {
  margin: 0;
  color: var(--color-ink-soft);
}

.portal-p {
  margin: 0 0 var(--space-md);
}

/* MADDE LISTESI IMSIZDIR, OGELERI BOSLUK AYIRIR (TASK-582; DEC-592).
   Im tabandan kalkar (SEVKORA-PORTAL-LISTE-IMI-BLOK); im bir ayiriciydi ve
   yerine bir sey koymamak cok satirli maddeleri birbirine yapistirirdi.
   Aralik yigin ilkelinin sik kademesidir (`layout-stack layout-stack-sik`,
   {spacing.sm-md}; blocks.blade.php); imin payi olan girinti de kalkar,
   madde paragrafla ayni hizadan baslar. */
.portal-list {
  margin: 0 0 var(--space-md);
  padding: 0;
}

/* HUKUKİ BELGE GÖVDESİ — SINIFSIZ ÖĞELERE AYNI DİL (TASK-306; DEC-256).

   Portalın geri kalanında her öğe kendi sınıfını taşır (`.portal-p`,
   `.portal-list`), çünkü gövde YAPISAL veriden Blade ile basılır ve sınıfı
   oraya yazabiliriz. Hukuki metin öyle değil: DEC-256 gereği kaynak markdown
   `Str::markdown` ile derlenip HAM ECHO ile basılır, dolayısıyla çıktı
   `h2/p/ul/li/table/strong/code` gibi SINIFSIZ öğelerden oluşur. Bir sınıf
   enjekte etmek, derleyici çıktısını sonradan işlemek (ikinci bir ayrıştırma
   noktası) demek olurdu ve DEC-256'nın kaçındığı şey tam olarak buydu.

   Bu yüzden dil öğe adına bağlanır. Değerler UYDURULMAZ: her biri yukarıdaki
   sınıflı kuralın aynısıdır, böylece iki yol aynı ekranı üretir ve zamanla
   ayrışmaz. Kapsam `.portal-doc__govde` ile SINIRLIDIR — portalın referans
   sayfaları bu kuralı görmez. */
.portal-doc__govde h2 {
  margin: var(--space-lg-xl) 0 var(--space-sm-md);
  padding-bottom: var(--space-sm);
  border-bottom: 1px solid var(--color-line);
  font-family: var(--type-heading-md-family);
  font-size: var(--type-heading-md-size);
  font-weight: var(--type-heading-md-weight);
  line-height: var(--type-heading-md-line-height);
}

.portal-doc__govde h3 {
  margin: var(--space-lg) 0 var(--space-sm);
  font-family: var(--type-heading-sm-family);
  font-size: var(--type-heading-sm-size);
  font-weight: var(--type-heading-sm-weight);
  line-height: var(--type-heading-sm-line-height);
}

.portal-doc__govde p {
  margin: 0 0 var(--space-md);
}

.portal-doc__govde ul,
.portal-doc__govde ol {
  margin: 0 0 var(--space-md);
  padding-left: var(--space-lg);
}

.portal-doc__govde li {
  margin-bottom: var(--space-xs);
}

.portal-doc__govde a {
  text-decoration: none;
  border-bottom: 1px solid var(--color-line);
}

.portal-doc__govde strong {
  font-weight: 600;
}

/* Satır içi kod: sınıflı kuralın (`.portal-p code.portal-mono`) birebir
   karşılığı — {colors.fill-soft} zemin + dar dolgu, kenar ve gölge YOK. */
.portal-doc__govde code {
  padding: 1px 3px;
  border-radius: var(--rounded-sm);
  background: var(--color-fill-soft);
  color: var(--color-ink);
  font-family: var(--type-mono-md-family);
  font-size: var(--type-mono-md-size);
  overflow-wrap: anywhere;
}

/* TABLO KENDİ KUTUSUNDA KAYAR. Hukuki metinlerde tanım ve saklama süresi
   çizelgeleri var; dar ekranda sayfa GÖVDESİ yatay kaymamalı, tablo kendi
   içinde kaymalıdır (`.layout-scroll-x` ile aynı hüküm, burada tek öğe
   üzerinde). */
.portal-doc__govde table {
  display: block;
  overflow-x: auto;
  width: 100%;
  margin: 0 0 var(--space-md);
  border-collapse: collapse;
  font-size: var(--type-body-sm-size);
}

.portal-doc__govde th,
.portal-doc__govde td {
  padding: var(--space-sm) var(--space-sm-md);
  border-bottom: 1px solid var(--color-line);
  text-align: left;
  vertical-align: top;
}

.portal-doc__govde thead th {
  border-bottom: 1px solid var(--color-line-strong);
  color: var(--color-ink-soft);
  font-weight: 600;
}

.portal-link {
  text-decoration: none;
  border-bottom: 1px solid var(--color-line);
}

/* Tanımlayıcılar daima mono */
.portal-mono,
code.portal-mono {
  font-family: var(--type-mono-md-family);
  font-size: var(--type-mono-md-size);
}

/* SATIR İÇİ KOD ARTIK GÖRÜNÜR (TASK-269).
   Ölçüldü: gövde düzyazısındaki `code` yalnız aileyi değiştiriyordu (zemin
   `rgba(0,0,0,0)`, kenar 0px). Sonuç, alan adlarının ve hata anahtarlarının
   cümlenin içinde KAYBOLMASIydı — bir API referansında en çok aranan şeyler
   tam olarak onlar. Onarım sözleşmenin üçüncü basamağını kullanır
   (DESIGN.md §Elevation & Depth: önce boşluk, sonra çizgi, sonra fill-soft,
   en son gölge): {colors.fill-soft} zemin + 1px cetvel, gölge YOK.

   KENAR BİLEREK YOK ve dolgu BİLEREK dar. parts.blade.php'nin kendi notu
   şunu söylüyor: parçalar arasına boşluk konmaz, çünkü boşluklar sözleşme
   metnindedir ve kod parçasından sonra gelen noktalama KAYMAMALIDIR. Kutulu
   bir satır içi kod o kaymayı görsel olarak yeniden üretir; yoğun bir
   paragrafta sekiz çerçeve ayrıca "çıkartma tabakası" etkisi yapar. Zemin
   tek başına ayırmaya yeter ve merdivenin üçüncü basamağında kalır.

   Kod BLOĞUNUN içindeki `code` bu kuralın dışındadır: orada zaten bir kutu
   vardır ve ikinci bir kutu çizmek aynı sınırı iki kez çizerdi. */
.portal-p code.portal-mono,
.portal-list code.portal-mono,
.portal-void code.portal-mono,
.data-table code.portal-mono {
  padding: 1px 3px;
  border-radius: var(--rounded-sm);
  background: var(--color-fill-soft);
  color: var(--color-ink);
  /* Uzun bir alan yolu satırı taşırmaz: kutu değil METİN kırılır. */
  overflow-wrap: anywhere;
}

/* Uç kimliği: metod damgası + mono yol. */
.portal-endpoint {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm-md);
  margin: 0;
}

.portal-endpoint__path {
  min-width: 0;
  font-family: var(--type-mono-md-family);
  font-size: var(--type-mono-md-size);
  color: var(--color-ink);
  overflow-wrap: anywhere;
}

/* UÇ DİZİNİ ARTIK BİR TABLO DEĞİL, TARANABİLİR BİR LİSTEDİR (TASK-269).

   Ölçülen kusur üç katmanlıydı: (1) satırın kendisi bağlantı DEĞİLDİ —
   tıklanabilir olan tek şey dördüncü hücredeki sayfa adıydı; (2) metod
   {typography.label-xs} ile ve MONO OLMADAN diziliyordu, yani en çok taranan
   sütun hiçbir ayrım taşımıyordu; (3) kimlik/metod/yol/sayfa dört ayrı hücreye
   bölündüğü için göz bir uçun kimliğini dört durakta topluyordu.

   Liste satırı tek bir bağlantıdır ve okunuşu bir API referansının kendi
   cümlesidir: METOD, yol, ad, kimlik. Sarma dar ekranda İÇKİNDİR (flex-wrap),
   yani kırılma noktası gerekmez ve gövde yatay kaymaz. */
/* Im tabandan gelir (SEVKORA-PORTAL-LISTE-IMI-BLOK; TASK-582). */
.portal-uc-listesi {
  margin: 0 0 var(--space-lg);
  padding: 0;
}

.portal-uc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm-md);
  padding: var(--space-sm-md) var(--space-sm);
  border-bottom: 1px solid var(--color-line);
  color: var(--color-ink);
  text-decoration: none;
}

.portal-uc-listesi li:last-child .portal-uc {
  border-bottom: 0;
}

.portal-uc:hover {
  background: var(--color-fill-soft);
  color: var(--color-ink);
}

/* Yol satırın omurgasıdır: mono, tam mürekkep, ve daralınca metin kırılır
   (kutu değil) — bu yüzden uzun bir uç yolu gövdeyi kaydıramaz. */
.portal-uc__yol {
  /* Taban genişlik SARMA KARARINI verir ve ÖLÇÜLDÜ: 17rem'lik taban 360px'te
     damgayı kendi satırına itiyordu, yani üç satırlık bir dizin satırı
     doğuyordu. 12rem, en uzun uç yolunun yanına damgayı da sığdırır
     (72px damga + 12px aralık + 192px taban = 276px < 328px iç genişlik). */
  flex: 1 1 12rem;
  min-width: 0;
  font-family: var(--type-mono-md-family);
  font-size: var(--type-mono-md-size);
  overflow-wrap: anywhere;
}

.portal-uc__ad {
  flex: 1 1 10rem;
  min-width: 0;
  font-size: var(--type-body-sm-size);
  color: var(--color-ink-soft);
}

.portal-uc:hover .portal-uc__ad {
  color: var(--color-primary-deep);
}

.portal-uc__kimlik {
  flex: none;
  /* Kimlik satırın SON durağıdır: geniş ekranda sağ uca yaslanır, sarma
     olduğunda adın yanında kalır ve kendi satırına inmez. */
  margin-inline-start: auto;
  font-family: var(--type-mono-md-family);
  font-size: var(--type-label-xs-size);
  color: var(--color-ink-soft);
}

/* TABLO ILKELDEN GELIR (TASK-195; DESIGN "Tablo"): cetvel satirlar, label-xs
   thead ve KENDI kutusunda yatay kayma artik `/ilkeller.css` icindeki
   `.data-table` + `.layout-scroll-x` kurallaridir — admin ve SPA ile AYNI
   kaynaktan. Burada yalniz portala ozgu dikey ritim kalir. */
.layout-scroll-x {
  margin-bottom: var(--space-md);
}

/* KOD BLOĞU — belgenin en çok kopyalanan parçası.
   Kutu kendi içinde kayar ve GÖVDE KAYMAZ; kaydırma kutusu klavyeyle de
   ulaşılabilir olmalıdır, bu yüzden `pre` odaklanabilir işaretlenir
   (`.layout-scroll-x` ilkelinin kendi kuralıyla aynı gerekçe). */
.portal-code {
  margin: 0 0 var(--space-md);
  border: 1px solid var(--color-line);
  border-radius: var(--rounded-md);
  background: var(--color-fill-soft);
}

.portal-code__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  padding: var(--space-xs) var(--space-sm) var(--space-xs) var(--space-md);
  border-bottom: 1px solid var(--color-line);
}

.portal-code__lang {
  font-family: var(--type-label-xs-family);
  font-size: var(--type-label-xs-size);
  font-weight: var(--type-label-xs-weight);
  letter-spacing: var(--type-label-xs-letter-spacing);
  text-transform: var(--type-label-xs-transform);
  color: var(--color-ink-soft);
}

/* KOPYALAMA DENETİMİ `.btn` İLKELİNİ GİYER (DEC-217); burada YALNIZ onay
   durumu kalır. Kendi lehçesi emekli oldu: kutu 19px çiziliyordu ve WCAG
   2.5.8'in 24px tabanını tutmuyordu — ilkel tabanı kendisi taşır. */
.portal-code__copy.is-copied {
  border-color: var(--color-success);
  color: var(--color-success);
}

.portal-code__body {
  margin: 0;
  padding: var(--space-md);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  background: var(--color-surface);
  border-bottom-left-radius: var(--rounded-md);
  border-bottom-right-radius: var(--rounded-md);
  font-family: var(--type-mono-md-family);
  font-size: var(--type-mono-md-size);
  line-height: 1.55;
}

.portal-code__body:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: -2px;
}

/* "Boş/kayıp evrak" bloğu (404).
   Dikey ritim ızgaradan gelir, çünkü başlık ve damga artık kendi marjlarını
   taşımıyor (masthead ile aynı hüküm): aralığı KAP verir, çocuklar değil. */
.portal-void {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-sm-md);
  padding: var(--space-lg) 0;
  text-align: left;
}

.portal-void .portal-baglam,
.portal-void .portal-p {
  margin: 0;
}

/* YAPIŞKAN İÇİNDEKİLER — VE MÜREKKEP DİSİPLİNİ (TASK-269).
   Ölçülen kusur: içindekiler listesinin HER satırı {colors.primary} ile
   çiziliyordu (ölçüm: üç satır da rgb(194,65,12)). Turuncu bu dünyada
   "hareket ve aksiyon" mürekkebidir; sekiz bağlantıyı birden onunla yazmak,
   hepsini vurgulayıp hiçbirini vurgulamamaktır. Liste artık mürekkep
   tonundadır ve turuncu YALNIZ imlecin/odağın işaret ettiği satıra iner. */
.portal-toc__title {
  margin: 0 0 var(--space-sm);
  font-family: var(--type-label-xs-family);
  font-size: var(--type-label-xs-size);
  font-weight: var(--type-label-xs-weight);
  letter-spacing: var(--type-label-xs-letter-spacing);
  text-transform: var(--type-label-xs-transform);
  color: var(--color-ink-soft);
}

/* Im tabandan gelir (SEVKORA-PORTAL-LISTE-IMI-BLOK; TASK-582). */
.portal-toc__list {
  margin: 0;
  padding: 0;
  border-left: 1px solid var(--color-line);
}

.portal-toc__list li {
  margin-bottom: var(--space-xs);
}

.portal-toc__list a {
  display: block;
  /* Cetvelin üstüne oturan 2px'lik işaret: kolonun kendi çizgisi ile aynı
     yerde durur, bu yüzden negatif kenar payı ile hizalanır. */
  margin-left: -1px;
  border-left: 2px solid transparent;
  padding: 2px var(--space-sm);
  font-size: var(--type-body-sm-size);
  color: var(--color-ink-soft);
  text-decoration: none;
}

.portal-toc__list a:hover,
.portal-toc__list a:focus-visible {
  border-left-color: var(--color-primary);
  color: var(--color-primary-deep);
}

.portal-foot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  max-width: var(--portal-content-max);
  margin: 0 auto;
  padding: var(--space-md) var(--space-lg) var(--space-xl);
  border-top: 1px solid var(--color-line);
  font-size: var(--type-body-sm-size);
  color: var(--color-ink-soft);
}

.portal-foot__note {
  margin-left: auto;
}

/* CEKMECE DUGMELERI — her biri YALNIZ kendi yerlesiminde gorunur. Gorunurluk
   ayni zamanda /kabuk.js'in okudugu ESIKTIR: dugme gizlendiginde acik cekmece
   kapanir, boylece kirilma noktasi JS tarafinda ikinci kez yazilmaz.

   Düğmenin DERİSİ artık `.btn` ilkelindendir (DEC-217); burada kalan tek şey
   görünürlük eşiğidir, yani gerçekten yerleşime ait olan kısım. */
.portal-menu-dugmesi,
.portal-toc-dugmesi {
  display: none;
}

/* UCLU IZGARA UC ADIMDA COKER (TASK-195; DEC-146).
   {breakpoints.lg} altinda ICINDEKILER cekmeceye doner — gizlenmez: dalga
   2'ye kadar `display: none` ile yok ediliyordu ve dar ekrandaki okuyucu
   uzun bir referans sayfasinda basliklara ULASAMIYORDU. */
@media (width < 1024px) {
  .portal-shell {
    grid-template-columns: var(--portal-nav-width) minmax(0, 1fr);
  }

  .portal-toc {
    display: none;
  }

  .portal-toc-dugmesi {
    display: inline-flex;
  }
}

/* {breakpoints.md} altinda MENU de cekmeceye doner ve bant SARAR. */
@media (width < 768px) {
  .portal-band {
    height: auto;
    min-height: var(--portal-band-height);
    flex-wrap: wrap;
    padding-block: var(--space-sm);
    padding-inline: var(--space-md);
  }

  .portal-menu-dugmesi {
    display: inline-flex;
  }

  .portal-shell {
    grid-template-columns: minmax(0, 1fr);
    padding-inline: var(--space-md);
  }

  /* Kalici menu GIZLENIR (admin kabuguyla ayni gerekce): gizlenmis ama DOM'da
     duran bir menu Tab sirasinda gorunmez baglantilar barindirirdi. */
  .portal-nav {
    display: none;
  }

  /* BANT BAĞLAMI DAR EKRANDA SUSAR ve bu ölçülmüş bir bütçe kararıdır.
     Bant burada zaten SARIYOR: marka bir satır, denetimler bir satır. Bağlamı
     da göstermek üçüncü bir satır açar ve 360x740'lık bir ekranda yapışkan
     bandın kalıcı payı %18'e çıkar. Kaybedilen bilgi ise kaybolmuyor: uç
     kimliği hemen altındaki masthead'de metod damgası ve mono yolla,
     BÜYÜTÜLMÜŞ olarak duruyor ve dar ekranda ona ulaşmak bir ekran kaydırma
     bile sürmüyor. Yapışkanlığın kazancı uzun sayfada okuyucunun nerede
     olduğunu bilmesidir; dar ekranda o kazanç, aldığı yerden küçüktür. */
  .portal-band__baglam {
    display: none;
  }

  .portal-doc {
    --portal-doc-dolgu: var(--space-md);
  }

  .portal-foot {
    padding-inline: var(--space-md);
  }
}

/* DOKUNMA HEDEFİ TABANI — koşul GENİŞLİK **veya** İŞARETÇİ TÜRÜDÜR ve bu
   ayrım layout.css ilkelinin kendi ayrımıdır (WCAG 2.5.5 bir GİRDİ kuralıdır,
   genişlik kuralı değil). Portalın kendi gezinme öğeleri ilkelin tanıdığı
   sınıflardan değildir, bu yüzden tabanı ADIYLA alırlar.

   Ölçüldü (TASK-269 öncesi): çekmecedeki menü satırı 360px'te 28,1px
   çiziliyordu — dar ekranın BİRİNCİL gezinme yüzeyi tabanı tutmuyordu. */
@media (width < 1024px), (pointer: coarse) {
  .portal-nav__item,
  .portal-toc__list a,
  .portal-uc {
    min-height: var(--layout-tap-target);
  }
}

/* Amaçlı geçişler (DEC-142) — yalnız durum değişiminin OKUNABİLİRLİĞİ için;
   amaçsız animasyon yasağı sürer. Hareket azaltma tercihi hepsini kapatır. */
.portal-nav__item,
.portal-uc,
.portal-toc__list a {
  transition: background-color 120ms ease, color 120ms ease, border-left-color 120ms ease;
}

@media (prefers-reduced-motion: reduce) {
  .portal-nav__item,
  .portal-uc,
  .portal-toc__list a,
  .portal-cengel {
    transition: none;
  }
}

/* ÖRNEK (UAT) MANİFEST BANDI (TASK-337; DEC-270).
   Bu bant bir SÜS DEĞİL, bir KAPI KOMŞUSUDUR: örnek manifest hukuken
   GEÇERSİZ metin taşır ve okuyanın bunu KAÇIRMAMASI gerekir. Renk elle
   yazılmaz, uyarı mürekkebi token'ından okunur ve DESIGN.md'nin yasakladığı
   görsel kalıpların (gradyan, elle gölge değeri, öncelik kaçışı) hiçbiri
   kullanılmaz — kalıpların ADLARI da burada yazılmaz, çünkü portal CSS
   parite kapısı dosyayı DÜZ LİTERAL tarar ve yorumu koddan ayıramaz. */
.legal-ornek-bant {
  border: 1px solid var(--color-warning);
  border-radius: var(--rounded-md);
  color: var(--color-warning);
  padding: var(--space-md) var(--space-lg);
  margin: var(--space-lg) auto 0;
  max-width: var(--portal-content-max);
  text-align: center;
}

.legal-ornek-bant__baslik {
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}