/* =====================================================================
   WODVA TASARIM SİSTEMİ
   Açık tema varsayılan, koyu tema prefers-color-scheme ile. Ayrıntı: docs/tasarim.md
   Kural: kart yerine ince çizgi ve boşluk; tek vurgu rengi (--accent); marka renkleri
   yalnız küçük kimlik işareti (.pf-mark) olarak. Emoji yok.

   KABUK
     .app > .sidebar + .main-col(.topbar + main.content)
     .sidebar: .sb-brand .sb-new(Yeni gönderi) .sb-nav a[aria-current=page] .sb-foot
     .topbar: .nav-toggle(label, telefon) .switcher(details>summary+.switcher-menu) .topbar-user
     Sayfa başlığı: .page-head > (h1.page-title + .page-sub) + .page-actions
     Bölüm: .section > .section-head(h2 + .section-actions)
     Mobilde menü, #navtoggle onay kutusuyla (JS'siz) çekmece olur.

   DÜĞMELER   .btn  + .btn-primary | .btn-secondary(varsayılan) | .btn-ghost | .btn-danger
              boyut: .btn-sm .btn-lg ; .btn-icon ; metin bağlantısı: .link (.link-danger .link-muted)
   FORM       .field (etiket + giriş) .field-row(yan yana) .field-inline(satır içi form) .hint
              input/select/textarea doğrudan biçimlenir. .input-group (ön/son ek), .addr
              Onay/seçim çipi: <label class="chip"><input type="checkbox"><span>Ad</span></label>
              .chip-group ; platform çipi için içine .pf-mark koy. Tek seçim = <select>.
   TABLO      .table-wrap > table.table ; td.num sağa ; .t-actions ; .table-compact ; satır tıklama yok
   SEKME      .tabs > a.tab[aria-current=page]   ve   .seg > a|button[aria-pressed=true|aria-current]
   ROZET      .badge + .badge-ok|warn|err|info|mute ; gönderi durumu: .badge-draft .badge-scheduled
              .badge-published .badge-failed ; .st.ok|wa|no|er (bootstrap status_html bunu üretir)
   BOŞ DURUM  .empty-state > h3 + p + .btn ; satır içi: .muted
   BİLDİRİM   .flash(.ok|.err) sayfa içi ; #toast.toast kısa onay (app.js toast())
   PLATFORM   .pf-mark.pf-yt|pf-ig|pf-tt|pf-fb|pf-x (YT/IG/TT/FB/X harfli küçük kare)
              .pf = işaret + ad ; .pf-dot yalnız renkli nokta
   ADIMLAR    .stepper > .step(.is-done|.is-current) > .step-num + .step-label
   SİHİRBAZ   .wizard > .wizard-main + .wizard-side(önizleme) ; .wizard-step ; .wizard-foot (yapışkan)
              .picker (hesap seçici) > .picker-group > .picker-title + .chip-group ; .char-count(.is-over)
              .dropzone ; .preview
   MEDYA      .media-toolbar ; .media-grid > .media-tile(.is-selected) > .media-thumb + .media-kind
              + .media-check + .media-meta ; .media-order (seçim sırası)
   TAKVİM     .cal-bar (başlık+gezinme+.seg) ; ay: .cal-month > .cal-dow*7 + .cal-day(.is-today|.is-out)
              > .cal-date + .cal-event(.is-scheduled|.is-published|.is-draft|.is-failed) + .cal-more
              hafta: .cal-week > .cal-week-head + .cal-week-body > .cal-times + .cal-col*7 > .cal-week-event
              liste: .cal-list > .cal-list-day > .cal-list-date + .cal-list-item
   İSTATİSTİK .stats(şerit) > .stat > .stat-label + .stat-value + .stat-delta(.up|.down) + .stat-sub
              Platform kırılımı: .breakdown > .bar-row(style="--c:var(--pf-yt)") > .pf + .bar>.bar-fill + .bar-val
   MAİL       .codes > .code-card ; .mail(.has-open) > .mail-boxes + .mail-list + .mail-read
   LİSTE DÜZ. .list-block > .list-block-head(h3 + .btn) + table.rows-edit (satırda input) ; açılır ayrıntı: details.more
   KİMLİK     .avatar.t0-t3 ; .mono (kullanıcı adı, kod, adres)
   ===================================================================== */

:root{
  color-scheme:light dark;
  --bg:#f5f5f2; --surface:#ffffff; --surface-2:#efefeb; --surface-3:#e6e6e1;
  --line:#e2e2dd; --line-strong:#c9c9c2;
  --text:#1b1c1e; --text-2:#585b63; --text-3:#80848d;
  --accent:#0b6b5c; --accent-hover:#085748; --accent-soft:#dff0ec; --accent-fg:#ffffff;
  --ok:#17803d; --ok-soft:#e1f3e7; --warn:#9a5b00; --warn-soft:#fbefd5;
  --err:#c0352b; --err-soft:#fbe5e2; --info:#1d62a8; --info-soft:#e0ecf8;
  --pf-yt:#e5242b; --pf-ig:#d62f7a; --pf-tt:#111111; --pf-fb:#1877f2; --pf-x:#111111;
  --pf-tt-fg:#ffffff; --pf-x-fg:#ffffff;
  --shadow:0 8px 24px rgba(20,20,20,.12),0 1px 3px rgba(20,20,20,.10);
  --sans:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --r:8px; --r-sm:6px;
  --sidebar-w:232px; --topbar-h:52px;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#141516; --surface:#1c1d1f; --surface-2:#242527; --surface-3:#2d2e31;
    --line:#2f3033; --line-strong:#47484c;
    --text:#ececea; --text-2:#a7a9af; --text-3:#7d8087;
    --accent:#3fb59f; --accent-hover:#5cc8b3; --accent-soft:#17332e; --accent-fg:#0d1a17;
    --ok:#4cc27a; --ok-soft:#173223; --warn:#e0a03a; --warn-soft:#38290e;
    --err:#ef6b60; --err-soft:#3a1d1a; --info:#6aa8e8; --info-soft:#14283d;
    --pf-tt:#f2f2f2; --pf-x:#f2f2f2; --pf-tt-fg:#111111; --pf-x-fg:#111111;
    --shadow:0 8px 24px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.4);
  }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;line-height:1.5;font-weight:400}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
h1,h2,h3,p{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mono{font-family:var(--mono);font-size:12.5px;letter-spacing:-.01em}
.muted{color:var(--text-3);font-size:13px}
.num{font-variant-numeric:tabular-nums}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}

/* ---------- Kabuk ---------- */
.app{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);min-height:100vh}
.navtoggle{position:absolute;opacity:0;pointer-events:none}
.sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:14px;padding:14px 10px;background:var(--surface);border-right:1px solid var(--line);overflow-y:auto;z-index:40}
.sb-brand{display:flex;align-items:center;gap:8px;padding:2px 8px;font-weight:600;font-size:17px;letter-spacing:-.01em;text-decoration:none}
.sb-brand::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--accent)}
.sb-new{display:flex;align-items:center;justify-content:center;gap:8px;min-height:38px;border-radius:var(--r);background:var(--accent);color:var(--accent-fg);text-decoration:none;font-weight:550}
.sb-new:hover{background:var(--accent-hover)}
.sb-nav{display:flex;flex-direction:column;gap:1px}
.sb-nav a{display:flex;align-items:center;gap:10px;min-height:34px;padding:0 10px;border-radius:var(--r-sm);color:var(--text-2);text-decoration:none;font-weight:480}
.sb-nav a:hover{background:var(--surface-2);color:var(--text)}
.sb-nav a[aria-current="page"]{background:var(--accent-soft);color:var(--accent);font-weight:600}
.sb-nav .cnt{margin-left:auto;font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
.sb-nav .sep{height:1px;background:var(--line);margin:6px 8px}
.ico{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.sb-foot{margin-top:auto;display:flex;align-items:center;gap:8px;padding:10px 8px 0;border-top:1px solid var(--line);font-size:13px;color:var(--text-2)}
.sb-foot .who{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sb-foot form{margin:0 0 0 auto}

.main-col{min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:30;height:var(--topbar-h);display:flex;align-items:center;gap:10px;padding:0 20px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.topbar .grow{flex:1}
.nav-toggle{display:none;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--line-strong);border-radius:var(--r-sm);cursor:pointer;background:var(--surface)}
.content{width:100%;max-width:1240px;margin:0 auto;padding:22px 20px 72px}
.scrim{display:none}
.topbar .topbar-new{display:none}

.switcher{position:relative}
.switcher summary{list-style:none;display:flex;align-items:center;gap:8px;min-height:34px;padding:0 10px;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface);cursor:pointer;font-weight:500;max-width:260px}
.switcher summary::-webkit-details-marker{display:none}
.switcher summary::after{content:"";width:6px;height:6px;border-right:1.5px solid var(--text-3);border-bottom:1.5px solid var(--text-3);transform:rotate(45deg) translateY(-2px);margin-left:2px}
.switcher summary .lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.switcher-menu{position:absolute;left:0;top:calc(100% + 6px);min-width:240px;max-height:70vh;overflow-y:auto;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r);box-shadow:var(--shadow);padding:4px;z-index:60}
.switcher-menu a{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:var(--r-sm);text-decoration:none}
.switcher-menu a:hover{background:var(--surface-2)}
.switcher-menu a[aria-current="true"]{background:var(--accent-soft);color:var(--accent);font-weight:550}
.switcher-menu .menu-sep{height:1px;background:var(--line);margin:4px 2px}
.switcher-menu .muted{padding:6px 10px}

.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;margin-bottom:18px}
.page-title{font-size:22px;line-height:1.25;font-weight:620;letter-spacing:-.015em}
.page-sub{color:var(--text-2);margin-top:2px}
.page-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.page-actions form{margin:0}
.back{display:inline-block;margin-bottom:10px;color:var(--text-2);text-decoration:none;font-size:13px}
.back:hover{color:var(--text)}
.section{margin-top:28px}
.section:first-child{margin-top:0}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;min-height:30px}
.section-head h2{font-size:13px;font-weight:600;color:var(--text-2);text-transform:uppercase;letter-spacing:.05em}
.section-actions{display:flex;gap:8px;align-items:center}
.hint{font-size:12.5px;color:var(--text-3);margin-top:8px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.panel>h2{font-size:15px;font-weight:600;margin-bottom:12px}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.toolbar .grow{flex:1}

/* ---------- Düğmeler ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:0 14px;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--text);font-weight:520;line-height:1.2;white-space:nowrap;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--surface-2)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn-ghost{background:transparent;border-color:transparent;color:var(--text-2)}
.btn-ghost:hover{background:var(--surface-2);color:var(--text)}
.btn-danger{color:var(--err);border-color:color-mix(in srgb,var(--err) 40%,var(--line))}
.btn-danger:hover{background:var(--err-soft)}
.btn-sm{min-height:28px;padding:0 10px;font-size:13px}
.btn-lg{min-height:42px;padding:0 20px;font-size:15px}
.btn-icon{width:34px;padding:0}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;pointer-events:none}
.link{all:unset;cursor:pointer;color:var(--accent);font-size:13.5px;font-weight:500}
.link:hover{text-decoration:underline}
.link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.link-danger{color:var(--err)}
.link-muted{color:var(--text-2)}

/* ---------- Form ---------- */
.field{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--text-2);font-weight:500;min-width:0}
.field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.field-inline{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.field-inline .field{flex:1 1 190px;max-width:300px}
.field+.field,.field-row+.field,.field+.field-row{margin-top:14px}
.field-row>.field,.field-inline>.field,.stack>.field{margin-top:0}
input[type=text],input[type=password],input[type=search],input[type=email],input[type=number],input[type=date],input[type=time],input[type=datetime-local],select,textarea{width:100%;min-height:36px;padding:7px 10px;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--text);font-size:14px;font-weight:400}
input::placeholder,textarea::placeholder{color:var(--text-3)}
input:focus,select:focus,textarea:focus{outline:2px solid color-mix(in srgb,var(--accent) 40%,transparent);outline-offset:0;border-color:var(--accent)}
textarea{min-height:120px;resize:vertical;line-height:1.5}
select{appearance:none;padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,var(--text-3) 50%),linear-gradient(135deg,var(--text-3) 50%,transparent 50%);background-position:calc(100% - 16px) 55%,calc(100% - 11px) 55%;background-size:5px 5px;background-repeat:no-repeat}
.addr{display:flex;align-items:center;gap:8px}
.addr .mono{color:var(--text-2);font-size:13.5px;white-space:nowrap}
.input-group{display:flex}
.input-group>*:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}
.input-group>*:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.keyin{width:200px;min-height:28px;padding:3px 9px;font-size:13px}
.chip-group{display:flex;flex-wrap:wrap;gap:6px}
.chip{position:relative;display:inline-flex}
.chip input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.chip>span{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:0 11px;border:1px solid var(--line-strong);border-radius:9999px;background:var(--surface);color:var(--text-2);font-size:13px;font-weight:500}
.chip:hover>span{border-color:var(--text-3)}
.chip input:checked+span{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.chip input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.chip input:disabled+span{opacity:.45}
input[type=checkbox],input[type=radio]{accent-color:var(--accent)}

/* ---------- Tablo ---------- */
.table-wrap{overflow-x:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface)}
.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th{text-align:left;font-weight:550;font-size:12px;color:var(--text-3);padding:8px 12px;border-bottom:1px solid var(--line-strong);white-space:nowrap;background:var(--surface)}
.table td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
.table tr:last-child td{border-bottom:0}
.table tbody tr:hover td{background:color-mix(in srgb,var(--surface-2) 55%,transparent)}
.table td.wrap{white-space:normal}
.table th.num,.table td.num{text-align:right}
.table-compact td{padding:6px 12px}
.t-actions{text-align:right;display:flex;gap:10px;justify-content:flex-end;align-items:center}
td.t-actions-cell{text-align:right}
.dc{display:inline-flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0;font-size:13px;color:var(--text-2)}

/* ---------- Sekme, parçalı kontrol ---------- */
.tabs{display:flex;gap:2px;box-shadow:inset 0 -1px 0 var(--line);overflow-x:auto;overflow-y:hidden;margin-bottom:16px}
.tab{padding:9px 12px;border-bottom:2px solid transparent;color:var(--text-2);text-decoration:none;font-weight:520;white-space:nowrap;background:none;border-top:0;border-left:0;border-right:0;cursor:pointer}
.tab:hover{color:var(--text)}
.tab[aria-current="page"],.tab.is-active{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface);overflow:hidden}
.seg>*{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border:0;border-left:1px solid var(--line);background:transparent;color:var(--text-2);font-size:13px;font-weight:520;text-decoration:none;cursor:pointer}
.seg>*:first-child{border-left:0}
.seg>*:hover{background:var(--surface-2)}
.seg>[aria-pressed="true"],.seg>[aria-current="true"],.seg>[aria-current="page"],.seg>.is-active{background:var(--accent-soft);color:var(--accent);font-weight:600}

/* ---------- Rozet, durum ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:9999px;font-size:12px;font-weight:560;background:var(--surface-2);color:var(--text-2);white-space:nowrap}
.badge-ok,.badge-published{background:var(--ok-soft);color:var(--ok)}
.badge-warn{background:var(--warn-soft);color:var(--warn)}
.badge-err,.badge-failed{background:var(--err-soft);color:var(--err)}
.badge-info,.badge-scheduled{background:var(--info-soft);color:var(--info)}
.badge-mute,.badge-draft{background:var(--surface-2);color:var(--text-2)}
.st{display:inline-flex;align-items:center;gap:6px;font-size:13px;white-space:nowrap}
.st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.st.ok{color:var(--ok)}.st.wa{color:var(--warn)}.st.no{color:var(--text-3)}.st.er{color:var(--err)}

/* ---------- Boş durum, bildirim ---------- */
.empty-state{border:1px dashed var(--line-strong);border-radius:var(--r);padding:28px 20px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;background:transparent}
.empty-state h3{font-size:15px;font-weight:600}
.empty-state p{color:var(--text-2);max-width:60ch}
.empty-state .btn{margin-top:6px}
.empty-state.center{align-items:center;text-align:center}
.empty-state .ico-lg{width:28px;height:28px;stroke:var(--text-3);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:2px}
.flash{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-radius:var(--r);padding:10px 14px;margin-bottom:16px;font-size:13.5px;background:var(--ok-soft);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 25%,transparent)}
.flash.err{background:var(--err-soft);color:var(--err);border-color:color-mix(in srgb,var(--err) 30%,transparent)}
.flash .secret{display:inline-flex;align-items:center;gap:10px}
.flash code{background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:3px 9px;font-size:14px;user-select:all}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--text);color:var(--bg);padding:8px 16px;border-radius:var(--r-sm);font-size:13.5px;font-weight:500;display:none;z-index:90;box-shadow:var(--shadow)}

/* ---------- Platform, kimlik ---------- */
.pf-mark{display:inline-grid;place-items:center;min-width:22px;height:18px;padding:0 4px;border-radius:4px;font-size:10px;font-weight:700;letter-spacing:.02em;color:#fff;background:var(--text-3);flex:none;line-height:1}
.pf-yt{background:var(--pf-yt)}.pf-ig{background:var(--pf-ig)}.pf-fb{background:var(--pf-fb)}
.pf-tt{background:var(--pf-tt);color:var(--pf-tt-fg)}.pf-x{background:var(--pf-x);color:var(--pf-x-fg)}
.pf{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.pf-dot{width:8px;height:8px;border-radius:50%;background:var(--c,var(--text-3));flex:none;display:inline-block}
.avatar{width:30px;height:30px;border-radius:50%;display:inline-grid;place-items:center;font-size:11.5px;font-weight:600;flex:none;background:var(--surface-3);color:var(--text)}
.avatar.lg{width:52px;height:52px;font-size:16px}
.avatar.md{width:36px;height:36px;font-size:12.5px}
.avatar.t0{background:#d6ece0;color:#1a4d33}.avatar.t1{background:#d8e6f5;color:#1d4570}.avatar.t2{background:#efe4cd;color:#614513}.avatar.t3{background:#f2dae1;color:#6e2740}
@media (prefers-color-scheme: dark){
  .avatar.t0{background:#1d3a2b;color:#a9dcc0}.avatar.t1{background:#1c3047;color:#a8c9ec}.avatar.t2{background:#3d3218;color:#e2c98e}.avatar.t3{background:#42232f;color:#eab1c4}
}
.pchips{display:flex;flex-wrap:wrap;gap:6px}
.pchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:var(--r-sm);padding:2px 8px 2px 4px;font-size:12.5px;color:var(--text-2);background:var(--surface)}

/* ---------- İstatistik ---------- */
.stats{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.stat{flex:1 1 150px;background:var(--surface);padding:12px 14px;min-width:0}
.stat-label{display:block;font-size:12.5px;color:var(--text-2)}
.stat-value{display:block;font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.2;margin-top:2px;font-variant-numeric:tabular-nums}
.stat-delta{font-size:12px;font-weight:560;color:var(--text-3)}
.stat-delta.up{color:var(--ok)}.stat-delta.down{color:var(--err)}
.stat-sub{display:block;font-size:12px;color:var(--text-3)}
.breakdown{display:flex;flex-direction:column;gap:8px}
.bar-row{display:grid;grid-template-columns:130px minmax(0,1fr) 64px;align-items:center;gap:10px;font-size:13px}
.bar{height:8px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.bar-fill{display:block;height:100%;background:var(--c,var(--accent));border-radius:4px}
.bar-val{text-align:right;font-variant-numeric:tabular-nums;font-weight:550}

/* ---------- Adımlar ve sihirbaz ---------- */
.stepper{display:flex;align-items:center;gap:0;list-style:none;margin:0 0 18px;padding:0;counter-reset:s}
.step{display:flex;align-items:center;gap:8px;flex:1;color:var(--text-3);font-size:13px;font-weight:520;min-width:0}
.step:last-child{flex:none}
.step::after{content:"";flex:1;height:1px;background:var(--line-strong);margin:0 10px;min-width:12px}
.step:last-child::after{display:none}
.step-num{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:650;border:1px solid var(--line-strong);background:var(--surface);flex:none}
.step-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.step.is-current{color:var(--text)}
.step.is-current .step-num{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.step.is-done{color:var(--text-2)}
.step.is-done .step-num{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.wizard{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
.wizard-main{min-width:0}
.wizard-side{position:sticky;top:calc(var(--topbar-h) + 16px)}
.wizard-step{margin-bottom:22px}
.wizard-step>h2{font-size:15px;font-weight:600;margin-bottom:10px}
.wizard-foot{position:sticky;bottom:0;display:flex;gap:8px;justify-content:space-between;align-items:center;padding:12px 0;margin-top:16px;background:linear-gradient(to top,var(--bg) 70%,transparent);border-top:1px solid var(--line)}
.picker{display:flex;flex-direction:column;gap:12px}
.picker-group{display:flex;flex-direction:column;gap:6px}
.picker-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
.char-count{font-size:12px;color:var(--text-3);text-align:right;font-variant-numeric:tabular-nums}
.char-count.is-over{color:var(--err);font-weight:600}
.dropzone{border:1.5px dashed var(--line-strong);border-radius:var(--r);padding:26px 16px;text-align:center;color:var(--text-2);background:var(--surface)}
.dropzone.is-over{border-color:var(--accent);background:var(--accent-soft)}
.preview{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:12px;font-size:13px}

/* ---------- Medya ---------- */
.media-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.media-tile{position:relative;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface);cursor:pointer}
.media-tile:hover{border-color:var(--line-strong)}
.media-tile.is-selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.media-thumb{aspect-ratio:1/1;background:var(--surface-3);display:grid;place-items:center;color:var(--text-3)}
.media-thumb img,.media-thumb video{width:100%;height:100%;object-fit:cover;display:block}
.media-kind{position:absolute;left:6px;top:6px;padding:1px 6px;border-radius:4px;background:rgba(0,0,0,.65);color:#fff;font-size:11px;font-weight:600}
.media-check{position:absolute;right:6px;top:6px;width:20px;height:20px;border-radius:5px;border:1.5px solid #fff;background:rgba(0,0,0,.35);display:grid;place-items:center;opacity:0;color:#fff;font-size:12px}
.media-tile:hover .media-check,.media-tile.is-selected .media-check,.media-check:focus-within{opacity:1}
.media-tile.is-selected .media-check{background:var(--accent);border-color:var(--accent)}
.media-order{position:absolute;right:6px;bottom:44px;min-width:20px;height:20px;border-radius:10px;padding:0 5px;background:var(--accent);color:var(--accent-fg);font-size:11px;font-weight:700;display:grid;place-items:center}
.media-meta{padding:6px 8px;font-size:12px;color:var(--text-2);display:flex;justify-content:space-between;gap:6px}
.media-meta b{font-weight:520;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- Takvim ---------- */
.cal-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.cal-bar h2{font-size:17px;font-weight:600;margin-right:6px}
.cal-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line);background:var(--surface)}
.cal-dow{padding:6px 8px;font-size:12px;font-weight:600;color:var(--text-3);border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface-2)}
.cal-day{min-height:112px;padding:4px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px;min-width:0}
.cal-day.is-out{background:var(--bg);color:var(--text-3)}
.cal-date{font-size:12px;font-weight:560;padding:1px 4px;align-self:flex-start;border-radius:9px}
.cal-day.is-today .cal-date{background:var(--accent);color:var(--accent-fg)}
.cal-event{--st:var(--line-strong);display:flex;align-items:center;gap:5px;padding:2px 5px;border-radius:4px;border-left:3px solid var(--st);background:var(--surface-2);font-size:12px;line-height:1.35;overflow:hidden;text-decoration:none;min-width:0}
.cal-event:hover{background:var(--surface-3)}
.cal-event .cal-event-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-event.is-scheduled{--st:var(--info)}.cal-event.is-published{--st:var(--ok)}.cal-event.is-draft{--st:var(--text-3)}.cal-event.is-failed{--st:var(--err)}
.cal-more{font-size:12px;color:var(--text-2);padding:0 5px}
.cal-week{border:1px solid var(--line);background:var(--surface);overflow-x:auto}
.cal-week-head,.cal-week-body{display:grid;grid-template-columns:52px repeat(7,minmax(96px,1fr))}
.cal-week-head>div{padding:6px 8px;font-size:12px;font-weight:600;color:var(--text-3);border-bottom:1px solid var(--line-strong);border-left:1px solid var(--line)}
.cal-week-head>div:first-child{border-left:0}
.cal-week-head .is-today{color:var(--accent)}
.cal-times{display:grid;grid-auto-rows:48px;font-size:11px;color:var(--text-3);text-align:right}
.cal-times>div{padding:0 6px;border-bottom:1px solid var(--line)}
.cal-col{position:relative;border-left:1px solid var(--line);background-image:linear-gradient(to bottom,transparent 47px,var(--line) 47px);background-size:100% 48px}
.cal-week-event{position:absolute;left:2px;right:2px;overflow:hidden}
.cal-list{border-top:1px solid var(--line)}
.cal-list-day{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.cal-list-date{font-weight:600;font-size:13px}
.cal-list-date small{display:block;color:var(--text-3);font-weight:400}
.cal-list-item{display:flex;align-items:center;gap:10px;padding:5px 0;min-width:0}
.cal-list-item .time{width:44px;color:var(--text-2);font-variant-numeric:tabular-nums;flex:none}

/* ---------- Mail ---------- */
.codes{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.codes>.muted{grid-column:1/-1;padding:6px 0}
.code-card{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--r);background:var(--surface);padding:10px 12px;display:flex;flex-direction:column;gap:6px;min-width:0}
.code-card .m{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--text-2);min-width:0}
.code-card .m span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:550;color:var(--text)}
.code-card .m span:last-child{flex:none}
.code-card .row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.code-card .c{all:unset;cursor:pointer;font-family:var(--mono);font-size:28px;font-weight:500;letter-spacing:.09em;line-height:1.1}
.code-card .c:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.code-card .box{font-size:12px;color:var(--text-3);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.code-card a.box:hover{color:var(--text);text-decoration:underline}
.mail{display:grid;grid-template-columns:190px 330px minmax(0,1fr);border:1px solid var(--line);border-radius:var(--r);background:var(--surface);min-height:480px;overflow:hidden}
.mail>*{min-width:0}
.mail-boxes{padding:8px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:1px;overflow-y:auto;background:var(--surface)}
.mail-boxes a{display:flex;justify-content:space-between;gap:8px;padding:6px 10px;min-height:32px;align-items:center;border-radius:var(--r-sm);font-size:13px;color:var(--text-2);text-decoration:none}
.mail-boxes a:hover{background:var(--surface-2)}
.mail-boxes a span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-boxes a span:last-child{font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
.mail-boxes a[aria-current="true"]{background:var(--accent-soft);color:var(--accent);font-weight:600}
.mail-list{border-right:1px solid var(--line);max-height:76vh;overflow-y:auto;display:flex;flex-direction:column}
.mail-filter{position:sticky;top:0;padding:8px;background:var(--surface);border-bottom:1px solid var(--line);z-index:1}
.mail-filter input{min-height:32px}
.mail-item{display:block;padding:9px 12px;border-bottom:1px solid var(--line);text-decoration:none;min-width:0}
.mail-item:hover{background:var(--surface-2)}
.mail-item[aria-current="true"]{background:var(--accent-soft)}
.mail-item b{display:flex;align-items:center;gap:7px;font-weight:520;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-item.unseen b{font-weight:650}
.mail-item.unseen b::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none}
.mail-item span{display:block;color:var(--text-2);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-item .mono{color:var(--text-3);font-size:11.5px}
.mail-read{padding:16px 20px;overflow-y:auto;max-height:76vh}
.mail-read h3{font-size:17px;font-weight:600;overflow-wrap:anywhere;margin-bottom:4px}
.mail-read .from{color:var(--text-2);font-size:12.5px;margin-bottom:12px;overflow-wrap:anywhere}
.mail-read .bar-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.mail-read .big-code{display:flex;align-items:center;gap:12px;padding:10px 12px;margin-bottom:14px;border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--r);background:var(--accent-soft)}
.mail-read .big-code .c{font-family:var(--mono);font-size:24px;letter-spacing:.09em}
.mail-read .body{font-size:14px;overflow-wrap:anywhere;max-width:78ch}
.mail-back{display:none}
.htmlview{margin-top:16px}
.htmlview summary{cursor:pointer;color:var(--text-2);font-size:13px}
.htmlview iframe{width:100%;height:560px;border:1px solid var(--line);border-radius:var(--r-sm);margin-top:10px;background:#fff}

/* ---------- Yayıncı listesi ve profil ---------- */
.pub-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pub-head h1,.pub-head h3{font-size:20px;font-weight:620}
.pub-name{display:flex;align-items:center;gap:10px;min-width:0}
.pub-name a{font-weight:560;text-decoration:none}
.pub-name a:hover{text-decoration:underline}
.pub-name small{display:block;color:var(--text-3);font-size:12px}

/* ---------- Satır düzenleyici, açılır ayrıntı ---------- */
.list-block{margin-top:18px}
.list-block-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.list-block-head h3{font-size:14px;font-weight:600}
.rows-edit td{padding:5px 8px}
.rows-edit input{min-width:170px;min-height:32px;padding:5px 9px}
.rows-edit .t-actions{gap:2px}
.rows-edit td:last-child,.rows-edit th:last-child{width:1%}
.more summary{cursor:pointer;color:var(--text-2);font-size:13px}
.more ul{margin:6px 0 0;padding-left:18px;font-size:12.5px;display:flex;flex-direction:column;gap:2px}

/* ---------- Giriş ---------- */
body.login{display:grid;place-items:center;min-height:100vh;padding:16px}
.loginbox{width:min(360px,100%);background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:28px 24px;box-shadow:var(--shadow)}
.loginbox .sb-brand{padding:0;font-size:22px;margin-bottom:4px}
.loginbox .lead{color:var(--text-2);margin-bottom:18px}
.stack{display:flex;flex-direction:column;gap:14px}
.stack .btn{margin-top:4px;min-height:40px}

/* ---------- Duyarlı ---------- */
@media (max-width:1100px){
  .wizard{grid-template-columns:1fr}
  .wizard-side{position:static}
  .mail{grid-template-columns:170px 290px minmax(0,1fr)}
}
@media (max-width:900px){
  .app{grid-template-columns:minmax(0,1fr)}
  .sidebar{position:fixed;left:0;top:0;bottom:0;width:min(280px,86vw);transform:translateX(-102%);transition:transform .18s ease;box-shadow:var(--shadow)}
  .navtoggle:checked~.sidebar{transform:none}
  .navtoggle:checked~.scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:35}
  .navtoggle:focus-visible~.main-col .nav-toggle{outline:2px solid var(--accent);outline-offset:2px}
  .nav-toggle{display:inline-flex}
  .topbar .topbar-new{display:inline-flex}
  .topbar{padding:0 12px}
  .topbar-user{display:none}
  .content{padding:16px 16px 72px}
  .mail{grid-template-columns:1fr;min-height:0}
  .mail-boxes{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:6px}
  .mail-boxes a{flex:none;gap:6px}
  .mail-list{border-right:0;max-height:none}
  .mail-read{max-height:none;padding:14px}
  .mail.has-open .mail-boxes,.mail.has-open .mail-list{display:none}
  .mail:not(.has-open) .mail-read{display:none}
  .mail-back{display:inline-flex}
}
@media (max-width:700px){
  .page-title{font-size:20px}
  .cal-day{min-height:64px;padding:2px}
  .cal-event .cal-event-text{display:none}
  .cal-event{padding:2px;border-left-width:2px}
  .cal-list-day{grid-template-columns:1fr;gap:4px}
  .step-label{display:none}
  .step.is-current .step-label{display:inline}
  .bar-row{grid-template-columns:90px minmax(0,1fr) 52px}
  .stat-value{font-size:22px}
  .field-inline .field{max-width:none}
  .table-stack thead{display:none}
  .table-stack tr{display:block;padding:10px 12px;border-bottom:1px solid var(--line)}
  .table-stack td{display:block;border:0;padding:3px 0;white-space:normal}
  .table-stack td.t-actions-cell{text-align:left}
  .table-stack .t-actions{justify-content:flex-start;flex-wrap:wrap}
  .table-stack tbody tr:hover td{background:none}
}
@media (pointer:coarse){
  .btn{min-height:40px}.btn-sm{min-height:34px}
  .sb-nav a{min-height:42px}
  input[type=text],input[type=password],input[type=search],select{min-height:42px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}