/* =====================================================================
   Yuva Arıyorum Yönetim Paneli — CodeStup panel tasarımı
   Koyu lacivert kenar menü + sakin çalışma alanı; sitenin lacivert/turuncu kimliği vurgu olarak.
   Açık/koyu tema: <html data-theme="light|dark"> (cms.js, tercih localStorage'da).
   ===================================================================== */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/plus-jakarta-sans-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root,
:root[data-theme=light] {
  color-scheme: light;
  --f: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: ui-monospace, "SFMono-Regular", Menlo, monospace;

  --bg: #f3f5f9;
  --surface: #ffffff;
  --surface-2: #f7f8fb;
  --ink: #000000;
  --ink-2: #0e1220;
  --muted: #3d4354;
  --line: #e1e5ed;
  --line-strong: #cbd2df;
  --hover: rgba(27, 47, 107, .05);
  --shadow: 0 1px 2px rgba(17, 31, 74, .05), 0 8px 24px -12px rgba(17, 31, 74, .12);
  --shadow-lg: 0 24px 64px -16px rgba(17, 31, 74, .32);

  --brand: #1b2f6b;
  --brand-rgb: 27, 47, 107;
  --brand-ink: #111f4a;
  --brand-soft: #e5ebf8;
  --accent: #ee5a36;
  --accent-btn: #cf4420;
  --accent-btn-hover: #b8391a;
  --link: #1b2f6b;
  /* Logo: lacivert zemin, turuncu çatı */
  --gradient: linear-gradient(135deg, #1b2f6b 0%, #2a4db0 100%);
  --ribbon: linear-gradient(180deg, #ee5a36 0%, #cf4420 30%, #2a4db0 70%, #1b2f6b 100%);

  --good: #0f7f6f;
  --bad: #c62f33;
  --ok-soft: #dbf1ec;
  --err-soft: #fbe4e4;
  --warn-soft: #fcefd6;
  --warn-line: #f1d49a;
  --danger-ink: #9b1c20;
  --danger-line: #f0b8b8;

  /* Grafik renkleri (zemin #fff) — dataviz doğrulayıcısından geçti: CVD ΔE ≥ 9.6, kontrast ≥ 3:1 */
  --series-1: #2a4db0;
  --series-2: #e0582f;
  --series-3: #0f8a78;
  --series-4: #8a5cc2;

  --r: 14px;
  --r-sm: 10px;
  --side: 264px;
  --side-collapsed: 76px;
  --top: 64px;
}

:root[data-theme=dark] {
  color-scheme: dark;
  --bg: #0c101b;
  --surface: #161b29;
  --surface-2: #1b2132;
  --ink: #f4f6fb;
  --ink-2: #d9dde8;
  --muted: #a3aabb;
  --line: #262d40;
  --line-strong: #353e56;
  --hover: rgba(255, 255, 255, .045);
  --shadow: 0 1px 2px rgba(0, 0, 0, .35);
  --shadow-lg: 0 24px 64px -16px rgba(0, 0, 0, .7);

  --brand: #8ea6f5;
  --brand-rgb: 142, 166, 245;
  --brand-ink: #b9c8fa;
  --brand-soft: #1f2a4a;
  --link: #b9c8fa;
  --gradient: linear-gradient(135deg, #2a4db0 0%, #3d63d6 100%);

  --good: #3fc9a8;
  --bad: #f07b7e;
  --ok-soft: #12352f;
  --err-soft: #3a1a1d;
  --warn-soft: #3a2d12;
  --warn-line: #5c4718;
  --danger-ink: #f5a3a5;
  --danger-line: #5c2a2d;

  /* Grafik renkleri (zemin #161b29) */
  --series-1: #5b7fe0;
  --series-2: #dc5f33;
  --series-3: #1aa38e;
  --series-4: #a07ce0;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-padding-top: calc(var(--top) + 16px); }
img { max-width: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink-2); font-family: var(--f); font-size: 14.5px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
a { color: var(--link); text-underline-offset: 3px; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4 { margin: 0; color: var(--ink); letter-spacing: -.02em; line-height: 1.15; }
p { margin: 0; }
b, strong { color: var(--ink); }
::selection { background: rgba(var(--brand-rgb), .22); }
:focus-visible { outline: 2.5px solid var(--brand); outline-offset: 2px; border-radius: 6px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.num { font-variant-numeric: tabular-nums; }

/* Tabler ikonları (icons.css maske olarak verir) */
.ti { display: inline-block; flex-shrink: 0; width: 1.15em; height: 1.15em; vertical-align: -.2em; }

.cs-skip { position: absolute; left: -999px; top: 8px; z-index: 2000; background: var(--ink); color: var(--surface); padding: .5rem .85rem; border-radius: 8px; }
.cs-skip:focus { left: 8px; }

/* ---------------------------------------------------------------------
   Kabuk
   --------------------------------------------------------------------- */
.cs-main-wrap { margin-left: var(--side); min-height: 100vh; display: flex; flex-direction: column; transition: margin-left .22s ease; }
.cs-main { flex: 1; width: 100%; max-width: 1480px; margin: 0 auto; padding: 28px 32px 40px; outline: none; }

/* Kenar menü: her iki temada koyu lacivert */
.cs-sidebar {
  --sb-text: #b4bdd6;
  --sb-strong: #ffffff;
  --sb-line: rgba(255, 255, 255, .08);
  --sb-hover: rgba(255, 255, 255, .06);
  position: fixed; inset: 0 auto 0 0; z-index: 1040;
  width: var(--side);
  display: flex; flex-direction: column;
  background: linear-gradient(180deg, #14244f 0%, #0b1533 100%);
  color: var(--sb-text);
  border-right: 1px solid var(--sb-line);
  transition: width .22s ease, transform .25s ease;
}
.cs-sidebar::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--ribbon); opacity: .9; }
.cs-brand { display: flex; align-items: center; justify-content: space-between; height: var(--top); padding: 0 14px 0 20px; border-bottom: 1px solid var(--sb-line); flex-shrink: 0; }
.cs-brand-link { display: flex; align-items: center; gap: 12px; color: var(--sb-strong); min-width: 0; text-decoration: none; }
.cs-brand-link svg { flex-shrink: 0; --brand: #1b2f6b; border-radius: 10px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12); }
.cs-brand-text { display: flex; flex-direction: column; line-height: 1.15; white-space: nowrap; }
.cs-brand-text strong { font-size: 1.05rem; font-weight: 800; letter-spacing: -.03em; color: var(--sb-strong); }
.cs-brand-text small { font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--sb-text); }

.cs-nav { flex: 1; overflow-y: auto; padding: 10px 12px 16px; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .14) transparent; }
.cs-nav-group + .cs-nav-group { margin-top: 12px; }
.cs-nav-label { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8590b0; padding: 10px 12px 6px; white-space: nowrap; }
.cs-nav ul { list-style: none; margin: 0; padding: 0; }
.cs-nav-link {
  position: relative; display: flex; align-items: center; gap: 12px;
  padding: 8px 12px; margin: 1px 0; border-radius: 9px;
  color: var(--sb-text); font-size: .9rem; font-weight: 600; white-space: nowrap; text-decoration: none;
  transition: background .15s ease, color .15s ease;
}
.cs-nav-link .ti { font-size: 1.12rem; opacity: .85; }
.cs-nav-link:hover { background: var(--sb-hover); color: var(--sb-strong); }
.cs-nav-link.active { background: rgba(255, 255, 255, .1); color: var(--sb-strong); }
.cs-nav-link.active .ti { opacity: 1; color: #ff9b7d; }
.cs-nav-link.active::before { content: ""; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--accent); }
.cs-nav-text { overflow: hidden; text-overflow: ellipsis; }
.cs-nav-count { margin-left: auto; min-width: 22px; height: 20px; padding: 0 7px; border-radius: 99px; background: var(--accent-btn); color: #fff; font-size: .72rem; font-weight: 800; display: inline-grid; place-items: center; font-variant-numeric: tabular-nums; }
.cs-nav-trail { margin-left: auto; font-size: .9rem !important; }
.cs-sidebar-foot { padding: 12px; border-top: 1px solid var(--sb-line); }
.cs-icon-btn.cs-sidebar-close { display: none; color: var(--sb-text); }
.cs-icon-btn.cs-sidebar-close:hover { background: var(--sb-hover); color: var(--sb-strong); }

@media (min-width: 1200px) {
  .cs-collapsed .cs-sidebar { width: var(--side-collapsed); }
  .cs-collapsed .cs-main-wrap { margin-left: var(--side-collapsed); }
  .cs-collapsed .cs-brand { padding: 0; justify-content: center; }
  .cs-collapsed .cs-brand-text, .cs-collapsed .cs-nav-text, .cs-collapsed .cs-nav-trail { display: none; }
  .cs-collapsed .cs-nav-count { position: absolute; top: 2px; right: 6px; min-width: 18px; height: 16px; padding: 0 4px; font-size: .62rem; }
  .cs-collapsed .cs-nav-label { font-size: 0; padding: 6px 0; margin: 0 14px; border-top: 1px solid var(--sb-line); }
  .cs-collapsed .cs-nav-group:first-child .cs-nav-label { border-top: 0; }
  .cs-collapsed .cs-nav-link { justify-content: center; padding: 10px 0; }
  .cs-collapsed .cs-nav-link .ti { font-size: 1.3rem; }
}

/* Üst bar */
.cs-topbar {
  position: sticky; top: 0; z-index: 1030;
  height: var(--top); display: flex; align-items: center; gap: 10px; padding: 0 24px;
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid var(--line);
}
.cs-icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 10px; border: 0; background: transparent; color: var(--ink-2); cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.cs-icon-btn:hover { background: var(--hover); color: var(--ink); }
.cs-icon-btn .ti { font-size: 1.25rem; }
.cs-sidebar-open { display: none; }
.cs-crumbs { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: .92rem; }
.cs-crumbs .ti { font-size: .9rem; color: var(--muted); }
.cs-crumb-group { color: var(--muted); white-space: nowrap; font-weight: 600; }
.cs-crumb-page { color: var(--ink); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.cs-search-trigger {
  display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 8px 0 12px; min-width: 220px;
  border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--muted); font-size: .88rem; cursor: pointer;
  transition: border-color .15s ease;
}
.cs-search-trigger:hover { border-color: var(--line-strong); }
.cs-search-trigger span { flex: 1; text-align: left; }
kbd { font-family: var(--mono); font-size: .7rem; padding: 2px 6px; border-radius: 6px; background: var(--surface-2); color: var(--muted); border: 1px solid var(--line); }
:root[data-theme=light] .cs-when-dark, :root[data-theme=dark] .cs-when-light { display: none; }

/* Kullanıcı menüsü (details/summary; JS gerekmez) */
.cs-user-menu { position: relative; }
.cs-user { display: flex; align-items: center; gap: 10px; height: 42px; padding: 0 8px 0 4px; border-radius: 12px; color: var(--ink); cursor: pointer; list-style: none; }
.cs-user::-webkit-details-marker { display: none; }
.cs-user:hover { background: var(--hover); }
.cs-user .ti { font-size: .95rem; color: var(--muted); }
.cs-avatar { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-size: .78rem; font-weight: 800; letter-spacing: .02em; color: #fff; background: linear-gradient(135deg, #1b2f6b, #2a4db0 55%, #ee5a36); }
.cs-user-name { font-size: .88rem; font-weight: 650; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-dropdown { position: absolute; right: 0; top: calc(100% + 6px); min-width: 240px; padding: 6px; border-radius: 12px; border: 1px solid var(--line); box-shadow: var(--shadow-lg); background: var(--surface); z-index: 1050; animation: cs-pop .14s ease; }
.cs-dropdown-head { display: flex; flex-direction: column; padding: 8px 10px 10px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.cs-dropdown-head small { color: var(--muted); overflow-wrap: anywhere; }
.cs-dropdown a, .cs-dropdown button { display: flex; width: 100%; align-items: center; gap: 10px; border: 0; background: none; border-radius: 8px; padding: 8px 10px; font-size: .9rem; font-weight: 600; color: var(--ink-2); text-decoration: none; cursor: pointer; text-align: left; }
.cs-dropdown a:hover, .cs-dropdown button:hover { background: var(--hover); color: var(--ink); }
.cs-dropdown form { margin: 0; }
.cs-dropdown .is-danger { color: var(--bad); }

.cs-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding: 18px 32px 24px; font-size: .82rem; color: var(--muted); max-width: 1480px; width: 100%; margin: 0 auto; }
.cs-footer-links { display: flex; gap: 16px; }
.cs-footer a { color: var(--muted); }
.cs-footer a:hover { color: var(--ink); }
.cs-scrim { display: none; }

@media (max-width: 1199.98px) {
  .cs-main-wrap { margin-left: 0; }
  .cs-sidebar { transform: translateX(-100%); }
  .cs-sidebar-open .cs-sidebar { transform: none; box-shadow: var(--shadow-lg); }
  .cs-sidebar-open .cs-scrim { display: block; position: fixed; inset: 0; z-index: 1035; background: rgba(8, 12, 24, .5); }
  .cs-icon-btn.cs-sidebar-close, .cs-sidebar-open { display: inline-flex; }
  .cs-sidebar-toggle { display: none; }
}
@media (max-width: 767.98px) {
  .cs-main { padding: 20px 16px 32px; }
  .cs-topbar { padding: 0 12px; }
  .cs-search-trigger { min-width: 0; width: 38px; padding: 0; justify-content: center; }
  .cs-search-trigger span, .cs-search-trigger kbd, .cs-user-name, .cs-crumb-group, .cs-crumbs .ti { display: none; }
  .cs-footer { padding: 16px; }
}

/* Hızlı geçiş (Ctrl/⌘+K) */
.cs-palette { position: fixed; inset: 0; z-index: 2000; background: rgba(8, 12, 24, .55); display: flex; justify-content: center; align-items: flex-start; padding: 12vh 16px 16px; }
.cs-palette-box { width: 100%; max-width: 560px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-lg); overflow: hidden; animation: cs-pop .16s ease; }
@keyframes cs-pop { from { opacity: 0; transform: translateY(-6px) scale(.985); } to { opacity: 1; transform: none; } }
.cs-palette-search { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.cs-palette-search .ti { font-size: 1.2rem; color: var(--muted); }
.cs-palette-search input { flex: 1; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 1rem; }
.cs-palette-list { list-style: none; margin: 0; padding: 6px; max-height: 52vh; overflow-y: auto; }
.cs-palette-list a { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 9px; color: var(--ink-2); text-decoration: none; font-weight: 600; }
.cs-palette-list a .ti { font-size: 1.1rem; color: var(--muted); }
.cs-palette-list a small { margin-left: auto; color: var(--muted); font-size: .78rem; font-weight: 500; }
.cs-palette-list a.active, .cs-palette-list a:hover { background: rgba(var(--brand-rgb), .1); color: var(--ink); }
.cs-palette-list a.active .ti { color: var(--brand); }
.cs-palette-empty { padding: 28px; text-align: center; color: var(--muted); }

/* ---------------------------------------------------------------------
   Sayfa başlığı
   --------------------------------------------------------------------- */
.ph { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; margin-bottom: 22px; }
.ph h1 { font-size: clamp(1.5rem, 2.4vw, 1.9rem); font-weight: 800; letter-spacing: -.03em; margin: 0 0 4px; }
.ph p { color: var(--muted); max-width: 720px; font-size: .94rem; }
.ph > div:last-child:not(:first-child) { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cs-eyebrow { display: inline-flex; align-items: center; gap: 7px; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--brand); margin-bottom: 6px; }
.crumb { font-size: .84rem; font-weight: 700; margin-bottom: 8px; display: inline-flex; gap: 6px; align-items: center; }
.crumb a { color: var(--muted); text-decoration: none; }
.crumb a:hover { color: var(--ink); text-decoration: underline; }

/* Dönem seçici */
.cs-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 11px; background: var(--surface); border: 1px solid var(--line); }
.cs-seg a { padding: 6px 12px; border-radius: 8px; font-size: .84rem; font-weight: 650; color: var(--muted); white-space: nowrap; text-decoration: none; }
.cs-seg a:hover { color: var(--ink); background: var(--hover); }
.cs-seg a.active { background: var(--ink); color: var(--surface); }

/* ---------------------------------------------------------------------
   Bileşenler
   --------------------------------------------------------------------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 0; border-radius: 10px; padding: 9px 14px; font-weight: 700; cursor: pointer; white-space: nowrap; text-decoration: none; font-size: .9rem; line-height: 1.2; transition: transform .15s, box-shadow .15s, filter .15s, background .15s; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn .ti { font-size: 1.05rem; }
.btn-brand { background: var(--gradient); color: #fff; box-shadow: 0 10px 22px -12px rgba(27, 47, 107, .75); }
.btn-brand:hover:not(:disabled) { filter: brightness(1.12); transform: translateY(-1px); }
.btn-accent { background: var(--accent-btn); color: #fff; box-shadow: 0 10px 22px -12px rgba(207, 68, 32, .8); }
.btn-accent:hover { background: var(--accent-btn-hover); transform: translateY(-1px); }
.btn-line { background: var(--surface); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-strong); }
.btn-line:hover { background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--ink); }
.btn-danger { background: var(--surface); color: var(--danger-ink); box-shadow: inset 0 0 0 1px var(--danger-line); }
.btn-danger:hover { box-shadow: inset 0 0 0 1px var(--danger-ink); }
.btn-sm { padding: 6px 10px; font-size: .82rem; border-radius: 8px; }

.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 20px; box-shadow: var(--shadow); }
.panel h2 { font-size: 1rem; font-weight: 750; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.alert { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; font-weight: 600; margin-bottom: 16px; color: var(--ink); border: 1px solid transparent; }
.alert-ok { background: var(--ok-soft); border-color: color-mix(in srgb, var(--good) 25%, transparent); }
.alert-err { background: var(--err-soft); border-color: color-mix(in srgb, var(--bad) 25%, transparent); }
.alert-warn { background: var(--warn-soft); border-color: var(--warn-line); }
.alert .ti { font-size: 1.25rem; margin-top: 1px; }

.inp { width: 100%; border: 1px solid var(--line-strong); border-radius: 10px; padding: 9px 12px; background: var(--surface); color: var(--ink); transition: border-color .15s, box-shadow .15s; }
.inp:focus { border-color: var(--brand); outline: none; box-shadow: 0 0 0 3px rgba(var(--brand-rgb), .16); }
textarea.inp { resize: vertical; min-height: 84px; }
select.inp { cursor: pointer; }
label.fl { display: block; font-weight: 700; font-size: .86rem; margin-bottom: 6px; color: var(--ink); }
.field { margin-bottom: 14px; }
.ferr { display: block; color: var(--danger-ink); font-weight: 700; font-size: .82rem; margin-top: 4px; }
.status { display: inline-flex; align-items: center; font-size: .7rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; padding: 3px 8px; border-radius: 6px; background: var(--surface-2); color: var(--ink); border: 1px solid var(--line); white-space: nowrap; }
.status.s0 { background: var(--warn-soft); border-color: var(--warn-line); }
.status.s1 { background: var(--ok-soft); border-color: transparent; }
.status.s2, .status.feat { background: var(--brand-soft); border-color: transparent; }
.status.s4, .status.warn { background: var(--err-soft); border-color: transparent; }
.muted { font-size: .84rem; color: var(--muted); }
.lead { color: var(--muted); }
.empty { padding: 40px 20px; text-align: center; font-weight: 600; }
.empty b { display: block; font-size: 1.05rem; margin-bottom: 4px; }
.stack { display: grid; gap: 16px; }
.stack > *, .det > *, .dash > * { min-width: 0; }
code { font-family: var(--mono); font-size: .85em; background: var(--surface-2); border: 1px solid var(--line); padding: 1px 5px; border-radius: 5px; }
textarea.code { font-family: var(--mono); font-size: .84rem; line-height: 1.55; tab-size: 2; }
.nowrap { white-space: nowrap; }

/* Sekmeler ve araç çubuğu */
.tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 14px; scrollbar-width: thin; }
.tabs a { flex: none; display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px; border-radius: 99px; background: var(--surface); border: 1px solid var(--line); font-weight: 700; font-size: .86rem; text-decoration: none; color: var(--ink-2); }
.tabs a:hover { border-color: var(--line-strong); color: var(--ink); }
.tabs a[aria-current="page"] { background: var(--ink); border-color: var(--ink); color: var(--surface); }
.tabs .n { background: var(--surface-2); border-radius: 99px; padding: 0 7px; font-size: .74rem; min-width: 20px; text-align: center; font-variant-numeric: tabular-nums; }
.tabs a[aria-current="page"] .n { background: rgba(255, 255, 255, .2); }
:root[data-theme=dark] .tabs a[aria-current="page"] .n { background: rgba(0, 0, 0, .15); }
.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; padding: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); }
.toolbar form { margin: 0; }
.toolbar form.search { display: flex; gap: 6px; flex: 1 1 320px; max-width: 520px; }

/* Tablolar: yatay çizgiler */
.tbl-wrap { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow-x: auto; box-shadow: var(--shadow); }
.panel .tbl-wrap { box-shadow: none; }
table.tbl { width: 100%; border-collapse: collapse; font-size: .88rem; }
.tbl th { text-align: left; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; font-weight: 750; color: var(--muted); background: var(--surface-2); padding: 10px 14px; white-space: nowrap; border-bottom: 1px solid var(--line); }
.tbl th.r, .tbl td.r { text-align: right; }
.tbl td { padding: 11px 14px; border-top: 1px solid var(--line); vertical-align: middle; }
.tbl thead + tbody tr:first-child td { border-top: 0; }
.tbl tbody tr { transition: background .12s ease; }
.tbl tbody tr:hover td { background: var(--hover); }
.tbl .thumb { width: 56px; height: 42px; border-radius: 8px; object-fit: cover; display: block; background: var(--surface-2); }
.tbl .t a { font-weight: 750; text-decoration: none; color: var(--ink); }
.tbl .t a:hover { text-decoration: underline; }
.tbl .flags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.tbl input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--brand); }
.tbl.defs .inp { padding: 6px 8px; min-width: 90px; }
.tbl.defs td { padding: 6px 8px; }
.pager { display: flex; gap: 6px; justify-content: center; margin-top: 16px; flex-wrap: wrap; }
.pager a, .pager span { min-width: 36px; height: 36px; padding: 0 10px; border-radius: 9px; display: inline-grid; place-items: center; background: var(--surface); border: 1px solid var(--line); font-weight: 700; text-decoration: none; color: var(--ink-2); }
.pager a:hover { border-color: var(--line-strong); }
.pager span.on { background: var(--ink); color: var(--surface); border-color: var(--ink); }

/* Ayrıntı sayfaları */
.det { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1000px) { .det { grid-template-columns: minmax(0, 1fr); } }
.photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.photos a { display: block; aspect-ratio: 4/3; border-radius: 10px; overflow: hidden; background: var(--surface-2); }
.photos img { width: 100%; height: 100%; object-fit: cover; }
.desc { white-space: pre-wrap; font-size: .94rem; }
dl.kv { display: grid; grid-template-columns: auto 1fr; gap: 7px 16px; margin: 0; font-size: .88rem; }
dl.kv dt { font-weight: 750; color: var(--ink); }
dl.kv dd { margin: 0; overflow-wrap: anywhere; }
.acts { display: grid; gap: 10px; }
.acts form { margin: 0; }
.chk { display: flex; gap: 8px; align-items: center; font-weight: 700; font-size: .88rem; cursor: pointer; color: var(--ink); }
.chk input { width: 18px; height: 18px; accent-color: var(--brand); }
.flagrow { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid var(--line); }
.flagrow:first-of-type { border-top: 0; }
.flagrow div { display: grid; font-size: .86rem; }
.flagrow form { margin: 0; }
.reports { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent), var(--shadow); }
.report { padding: 10px 0; border-top: 1px solid var(--line); display: grid; gap: 5px; }
.report-h { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.report p { white-space: pre-wrap; }
.conv summary { cursor: pointer; font-weight: 700; font-size: .86rem; color: var(--ink); }
.msg { margin-top: 6px; padding: 7px 10px; background: var(--surface-2); border-radius: 9px; font-size: .88rem; white-space: pre-wrap; }
.msg.own { background: var(--surface); border: 1px solid var(--line); }
.msg small { display: block; font-weight: 700; font-size: .74rem; }
.toplist { list-style: none; margin: 0; padding: 0; display: grid; }
.toplist li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid var(--line); font-size: .88rem; }
.toplist li:first-child { border-top: 0; }
.toplist li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.toplist li b { font-variant-numeric: tabular-nums; }

/* SSS */
.faq-cat { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; align-items: center; }
.faq-cat-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; flex: 1 1 340px; }
.faq-cat-form .inp { flex: 1 1 220px; max-width: 420px; font-weight: 700; }
.faq-acts { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.faq-acts form { margin: 0; }
.tbl .faq-acts { flex-wrap: nowrap; justify-content: flex-end; }

/* ---------------------------------------------------------------------
   Analitik (Genel Bakış, Ziyaretçi Analitiği)
   --------------------------------------------------------------------- */
.cs-section-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 28px 0 12px; }
.cs-section-title h2 { font-size: 1.05rem; font-weight: 800; display: flex; align-items: center; gap: 8px; }
.cs-section-title a { font-size: .86rem; font-weight: 700; }
.cs-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.cs-kpi { position: relative; display: block; padding: 16px 18px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); min-width: 0; text-decoration: none; color: inherit; transition: border-color .15s, transform .15s; }
a.cs-kpi:hover { border-color: var(--line-strong); transform: translateY(-1px); }
.cs-kpi.hot { border-color: var(--warn-line); background: linear-gradient(180deg, var(--warn-soft), var(--surface) 75%); }
.cs-kpi-label { display: flex; align-items: center; gap: 8px; font-size: .82rem; font-weight: 700; color: var(--muted); }
.cs-kpi-label .ti { font-size: 1.05rem; }
.cs-kpi-value { font-size: 1.9rem; font-weight: 800; letter-spacing: -.035em; color: var(--ink); line-height: 1.1; margin-top: 8px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-kpi-value small { font-size: .9rem; font-weight: 600; color: var(--muted); letter-spacing: 0; }
.cs-kpi-foot { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: .8rem; color: var(--muted); flex-wrap: wrap; }
.cs-delta { display: inline-flex; align-items: center; gap: 2px; padding: 1px 7px; border-radius: 99px; font-size: .76rem; font-weight: 750; font-variant-numeric: tabular-nums; }
.cs-delta.up { color: var(--good); background: color-mix(in srgb, var(--good) 13%, transparent); }
.cs-delta.down { color: var(--bad); background: color-mix(in srgb, var(--bad) 13%, transparent); }
.cs-delta.flat { color: var(--muted); background: var(--surface-2); }
.cs-chip { display: inline-flex; align-items: center; gap: 4px; font-size: .78rem; font-weight: 600; padding: 3px 9px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--line); color: var(--ink-2); white-space: nowrap; }
.cs-swatch { display: inline-block; width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }
.cs-path { font-family: var(--mono); font-size: .82rem; color: var(--ink); }

.cs-grid { display: grid; gap: 16px; grid-template-columns: repeat(12, minmax(0, 1fr)); margin-top: 16px; }
.cs-grid > * { min-width: 0; }
.c-4 { grid-column: span 4; } .c-5 { grid-column: span 5; } .c-6 { grid-column: span 6; } .c-7 { grid-column: span 7; } .c-8 { grid-column: span 8; } .c-12 { grid-column: span 12; }
@media (max-width: 1199.98px) { .c-4, .c-5, .c-6, .c-7, .c-8 { grid-column: span 12; } .cs-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) and (max-width: 1199.98px) { .c-4 { grid-column: span 6; } }
@media (max-width: 575.98px) { .cs-kpis { gap: 10px; } .cs-kpi { padding: 14px; } .cs-kpi-value { font-size: 1.45rem; } }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; }
.cs-card-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 20px 6px; }
.cs-card-head h2 { margin: 0; font-size: 1rem; font-weight: 750; }
.cs-card-head small { display: block; color: var(--muted); font-size: .8rem; margin-top: 2px; }
.cs-card-body { padding: 12px 20px 20px; }
.card > .tbl-wrap { border: 0; border-top: 1px solid var(--line); border-radius: 0; box-shadow: none; margin-top: 10px; }

/* Sıralama listesi */
.rank-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 13px; }
.rank-item { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr) auto; align-items: center; column-gap: .75rem; row-gap: .35rem; }
.rank-no { grid-row: span 2; width: 1.75rem; height: 1.75rem; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 750; background: var(--surface-2); border: 1px solid var(--line); color: var(--ink); }
.rank-no .ti { font-size: 1rem; }
.rank-label { font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank-label a { color: inherit; text-decoration: none; }
.rank-label a:hover { text-decoration: underline; }
.rank-value { font-weight: 750; color: var(--ink); font-variant-numeric: tabular-nums; }
.rank-value small { font-weight: 500; color: var(--muted); margin-left: 4px; }
.rank-track { grid-column: 2 / 4; height: 6px; border-radius: 4px; background: var(--surface-2); overflow: hidden; }
.rank-track > span { display: block; height: 100%; border-radius: 4px; background: var(--rank-color, var(--series-1)); transform-origin: left; animation: rank-grow .7s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes rank-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.cs-divider { border: 0; border-top: 1px solid var(--line); margin: 18px 0; }

.cs-empty { padding: 26px 12px; text-align: center; color: var(--muted); font-size: .9rem; }
.cs-empty .ti { display: block; font-size: 1.8rem; margin: 0 auto 8px; opacity: .6; }

/* Grafikler: SVG çizgi + HTML eksenler; ipucu cms.js'de */
.chart { position: relative; }
.chart-plot { position: relative; height: 240px; margin-left: 40px; }
.chart-plot svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.chart-grid line { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.chart-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.chart-area { opacity: .1; }
.chart-y { position: absolute; left: -40px; top: 0; bottom: 0; width: 34px; }
.chart-y span { position: absolute; right: 0; transform: translateY(-50%); font-size: .72rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.chart-x { display: flex; justify-content: space-between; margin: 8px 0 0 40px; font-size: .72rem; color: var(--muted); }
.chart-cross { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--line-strong); pointer-events: none; }
.chart-dot { position: absolute; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; border: 2px solid var(--surface); pointer-events: none; }
.chart-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: .82rem; color: var(--muted); }
.chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.chart-legend b { font-variant-numeric: tabular-nums; }
.chart-table { display: none; max-height: 320px; overflow: auto; }
.show-table .chart-table { display: block; }
.show-table .chart { display: none; }
.bars { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 3px; align-items: end; height: 170px; margin-left: 40px; position: relative; }
.bars > div { position: relative; height: 100%; display: flex; align-items: flex-end; }
.bars > div > i { display: block; width: 100%; min-height: 2px; background: var(--bar, var(--series-1)); border-radius: 4px 4px 0 0; transition: filter .12s; }
.bars > div:hover > i, .bars > div:focus-visible > i { filter: brightness(1.2); }
.bars-x { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 3px; margin: 6px 0 0 40px; font-size: .7rem; color: var(--muted); text-align: center; }
.heat { display: grid; grid-template-columns: 44px repeat(6, minmax(0, 1fr)); gap: 4px; align-items: center; }
.heat-h, .heat-d { font-size: .72rem; color: var(--muted); text-align: center; }
.heat-d { text-align: left; }
.heat b { display: flex; align-items: center; justify-content: center; height: 34px; border-radius: 7px; font-size: .78rem; font-weight: 600; font-variant-numeric: tabular-nums;
  background: color-mix(in srgb, var(--series-1) var(--heat), var(--line)); color: var(--ink); }
.cs-tip { position: fixed; z-index: 2100; pointer-events: none; background: var(--ink); color: var(--surface); padding: 7px 10px; border-radius: 9px; font-size: .8rem; line-height: 1.45; box-shadow: var(--shadow-lg); white-space: nowrap; transform: translate(-50%, calc(-100% - 10px)); }
.cs-tip b { color: inherit; }
.cs-tip i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 6px; }

.cs-rise { animation: cs-rise .4s ease both; }
@keyframes cs-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* ---------------------------------------------------------------------
   Giriş ve hata sayfaları — ortalanmış tek kart
   --------------------------------------------------------------------- */
.cs-auth { position: relative; isolation: isolate; overflow: hidden; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; padding: 20px clamp(16px, 4vw, 32px); background: var(--bg); }
.cs-auth-backdrop { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.cs-auth-glow { position: absolute; border-radius: 50%; filter: blur(90px); opacity: .4; animation: cs-drift 24s ease-in-out infinite alternate; }
.cs-auth-glow-1 { width: 520px; height: 520px; left: 50%; top: -260px; margin-left: -260px; background: #2a4db0; }
.cs-auth-glow-2 { width: 380px; height: 380px; right: -120px; bottom: -120px; background: #ee5a36; opacity: .22; animation-delay: -8s; }
.cs-auth-glow-3 { width: 340px; height: 340px; left: -120px; bottom: 10%; background: #1b2f6b; opacity: .25; animation-delay: -14s; }
:root[data-theme=dark] .cs-auth-glow { opacity: .3; }
:root[data-theme=dark] .cs-auth-glow-2, :root[data-theme=dark] .cs-auth-glow-3 { opacity: .16; }
@keyframes cs-drift { to { transform: translate(40px, 30px) scale(1.1); } }
.cs-auth-dots { position: absolute; inset: 0; background-image: radial-gradient(rgba(17, 31, 74, .14) 1px, transparent 1px); background-size: 22px 22px; -webkit-mask-image: radial-gradient(ellipse 60% 55% at 50% 40%, #000 30%, transparent 100%); mask-image: radial-gradient(ellipse 60% 55% at 50% 40%, #000 30%, transparent 100%); }
:root[data-theme=dark] .cs-auth-dots { background-image: radial-gradient(rgba(255, 255, 255, .09) 1px, transparent 1px); }
.cs-auth-top { width: 100%; max-width: 1200px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cs-auth-site-link { display: inline-flex; align-items: center; gap: 6px; font-size: .85rem; font-weight: 600; color: var(--muted); padding: 7px 12px 7px 10px; border-radius: 999px; text-decoration: none; }
.cs-auth-site-link:hover { color: var(--ink); background: var(--hover); }
.cs-auth-main { flex: 1; width: 100%; max-width: 432px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px 0; }
.cs-auth-logo { position: relative; z-index: 1; width: 76px; height: 76px; margin-bottom: -38px; display: grid; place-items: center; border-radius: 22px; background: var(--surface); box-shadow: 0 0 0 1px var(--line), 0 14px 34px -12px rgba(27, 47, 107, .55); animation: cs-rise .5s cubic-bezier(.2, .8, .2, 1) both; }
.cs-auth-logo::before { content: ""; position: absolute; inset: -6px; z-index: -1; border-radius: 27px; background: conic-gradient(from 200deg, #ee5a36, #2a4db0, #1b2f6b, #cf4420, #ee5a36); opacity: .35; filter: blur(10px); }
.cs-auth-logo::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: var(--surface); }
.cs-auth-logo svg { --brand: #1b2f6b; }
.cs-auth-card { position: relative; width: 100%; padding: 60px 36px 32px; background: color-mix(in srgb, var(--surface) 90%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border: 1px solid var(--line); border-radius: 24px; box-shadow: 0 1px 2px rgba(17, 31, 74, .04), 0 30px 70px -30px rgba(17, 31, 74, .3); animation: cs-rise .55s .05s cubic-bezier(.2, .8, .2, 1) both; }
:root[data-theme=dark] .cs-auth-card { box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .8); }
.cs-auth-head { text-align: center; margin-bottom: 26px; }
.cs-auth-head h1 { font-size: 1.55rem; font-weight: 800; letter-spacing: -.035em; margin-bottom: 6px; }
.cs-auth-head p { color: var(--muted); font-size: .92rem; }
.cs-field { position: relative; }
.cs-field-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 1.15rem; pointer-events: none; transition: color .15s; }
.cs-field .inp { height: 48px; padding-left: 42px; border-radius: 12px; background: var(--surface-2); }
.cs-field .inp:focus { background: var(--surface); box-shadow: 0 0 0 4px rgba(var(--brand-rgb), .14); }
.cs-field:focus-within .cs-field-icon { color: var(--brand); }
.cs-field .inp:has(~ .cs-field-action) { padding-right: 46px; }
.cs-field-action { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 9px; background: transparent; color: var(--muted); cursor: pointer; }
.cs-field-action:hover { background: var(--hover); color: var(--ink); }
.cs-caps { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: .8rem; font-weight: 600; color: #8a5300; }
:root[data-theme=dark] .cs-caps { color: #f5b70a; }
.cs-auth-submit { width: 100%; height: 48px; margin-top: 8px; border-radius: 12px; font-size: .95rem; }
.cs-auth-submit-wait, .cs-auth-submit.is-loading .cs-auth-submit-text { display: none; }
.cs-auth-submit.is-loading .cs-auth-submit-wait { display: inline-flex; align-items: center; gap: 8px; }
.cs-spin { animation: cs-spin .8s linear infinite; }
@keyframes cs-spin { to { transform: rotate(360deg); } }
.cs-auth-note { text-align: center; margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: .84rem; color: var(--muted); }
.cs-auth-foot { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; font-size: .78rem; color: var(--muted); }
.cs-auth-foot span { display: inline-flex; align-items: center; gap: 5px; }
.cs-auth-foot .dot { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .6; }
@media (max-width: 575.98px) {
  .cs-auth { padding: 12px 14px; }
  .cs-auth-card { padding: 54px 22px 26px; border-radius: 20px; }
  .cs-auth-logo { width: 68px; height: 68px; margin-bottom: -34px; border-radius: 20px; }
}

/* Rehber planı önizlemesi (Markdown'dan üretilen HTML) */
.prose-preview { line-height: 1.7; font-size: .95rem; }
.prose-preview h2 { font-size: 1.2rem; margin: 26px 0 8px; }
.prose-preview h3 { font-size: 1.02rem; margin: 18px 0 4px; }
.prose-preview p, .prose-preview ul, .prose-preview ol, .prose-preview table { margin: 0 0 12px; }
.prose-preview ul, .prose-preview ol { padding-left: 22px; }
.prose-preview table { border-collapse: collapse; width: 100%; }
.prose-preview th, .prose-preview td { border: 1px solid var(--line, #e1e5ed); padding: 6px 10px; text-align: left; }
