:root{
  --bg:#F6F5F2; --surface:#FFFFFF; --surface-2:#EFEDE8; --line:#E2DFD8; --text:#1C1D1B; --muted:#6F716C;
  --accent:#1F4D3F; --accent-ink:#FFFFFF; --warn:#B4541A; --bad:#B3261E; --good:#2E7D4F; --info:#2F5E8C;
  --chip-taslak:#E9E7E1; --chip-musteride:#FBEBD0; --chip-degisiklik:#F8DAD3; --chip-onayli:#DCEFE2;
  --chip-paylasildi:#DDE7F3; --chip-hata:#F6D3D0; --shadow:0 1px 2px rgba(20,20,15,.06),0 8px 24px rgba(20,20,15,.06);
  --r:14px; --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#121412; --surface:#1A1D1B; --surface-2:#232724; --line:#2E332F; --text:#ECEEEB; --muted:#9BA19B;
    --accent:#7FC4A6; --accent-ink:#0E1A15; --warn:#E39A5F; --bad:#F08A80; --good:#7FCB98; --info:#8DB6E0;
    --chip-taslak:#2A2E2B; --chip-musteride:#3D321C; --chip-degisiklik:#40261F; --chip-onayli:#1F3528;
    --chip-paylasildi:#1F2C3B; --chip-hata:#43221F; --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25);
    color-scheme:dark;
  }
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--text);font:14px/1.45 var(--font);-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}
a{color:inherit}
svg.i{width:18px;height:18px;flex:none}
.gizli{display:none!important}

/* üst bar */
.ust{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.ust-ic{max-width:1280px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:14px}
.logo{font-weight:700;letter-spacing:-.02em;font-size:17px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.logo b{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--accent);color:var(--accent-ink);font-size:14px}
.sekmeler{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1}
.sekmeler::-webkit-scrollbar{display:none}
.sekme{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 12px;white-space:nowrap;cursor:pointer;display:flex;align-items:center;gap:7px}
.sekme[aria-pressed="true"]{background:var(--text);color:var(--bg);border-color:var(--text)}
.nokta{width:8px;height:8px;border-radius:50%;flex:none}
.rozet{min-width:18px;height:18px;border-radius:9px;padding:0 5px;font-size:11px;font-weight:600;display:inline-grid;place-items:center;background:var(--warn);color:#fff}
.kim{color:var(--muted);white-space:nowrap}

/* araç çubuğu */
.ana{max-width:1280px;margin:0 auto;padding:16px 16px 80px}
.arac{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}
.arac h1{font-size:20px;letter-spacing:-.02em;margin:0 8px 0 0}
.arac .alt{color:var(--muted)}
.bosluk{flex:1}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface)}
.seg button{border:0;background:none;padding:7px 12px;cursor:pointer;display:flex;gap:6px;align-items:center}
.seg button[aria-pressed="true"]{background:var(--surface-2);font-weight:600}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:7px 12px;cursor:pointer;display:inline-flex;gap:7px;align-items:center;white-space:nowrap}
.btn:hover{border-color:var(--muted)}
.btn.birincil{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.tehlike{color:var(--bad)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.kucuk{padding:4px 9px;font-size:13px;border-radius:8px}

/* gün listesi */
.gun{display:grid;grid-template-columns:76px 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.gun.bugun .gt b{color:var(--accent)}
.gt{line-height:1.15}
.gt b{display:block;font-size:26px;letter-spacing:-.03em}
.gt span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.gun-kartlar{display:flex;flex-wrap:wrap;gap:10px;min-height:40px;align-items:flex-start}
.bos-gun{color:var(--muted);font-size:13px;padding-top:6px}
.kart{width:168px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;cursor:pointer;text-align:left;padding:0;box-shadow:var(--shadow);transition:transform .12s}
.kart:hover{transform:translateY(-2px)}
.kart .resim{position:relative;aspect-ratio:3/4;background:var(--surface-2)}
.kart.story .resim{aspect-ratio:9/16}
.kart img{width:100%;height:100%;object-fit:cover;display:block}
.kart .ust-isaret{position:absolute;top:7px;right:7px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6));display:flex;gap:4px}
.kart .govde{padding:8px 10px 10px;display:flex;flex-direction:column;gap:6px}
.kart .satir{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.kart .metin{color:var(--muted);font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:32px}
.cip{font-size:11.5px;font-weight:600;padding:2px 7px;border-radius:6px;background:var(--surface-2);white-space:nowrap}
.cip.taslak{background:var(--chip-taslak)} .cip.musteride{background:var(--chip-musteride)}
.cip.degisiklik{background:var(--chip-degisiklik)} .cip.onayli{background:var(--chip-onayli)}
.cip.paylasildi,.cip.paylasiliyor,.cip.planlandi{background:var(--chip-paylasildi)} .cip.hata{background:var(--chip-hata);color:var(--bad)}
.cip.elle{background:transparent;border:1px solid var(--warn);color:var(--warn)}
.cip.meta{background:transparent;border:1px solid var(--info);color:var(--info)}
.cip.oto{background:transparent;border:1px solid var(--line);color:var(--muted)}
.saat{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px}

/* ızgara */
.izgara{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;max-width:620px}
.izgara.story{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));max-width:none;gap:8px}
.kare{position:relative;aspect-ratio:3/4;background:var(--surface-2);border:0;padding:0;cursor:pointer;overflow:hidden}
.izgara.story .kare{aspect-ratio:9/16;border-radius:10px}
.kare img{width:100%;height:100%;object-fit:cover;display:block}
.kare .tarih{position:absolute;left:0;top:0;background:rgba(12,14,13,.72);color:#EEF1EF;font-size:11px;font-weight:600;padding:3px 7px 4px;border-bottom-right-radius:8px}
.kare .isaret{position:absolute;right:6px;top:6px;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.65))}
.kare .durum-serit{position:absolute;left:0;right:0;bottom:0;height:4px}
.ipucu{color:var(--muted);font-size:13px;margin:0 0 10px}

/* çekmece / pencere */
.perde{position:fixed;inset:0;background:rgba(10,12,11,.45);z-index:40;display:flex;justify-content:flex-end}
.cekmece{width:min(980px,100%);height:100%;background:var(--bg);overflow:auto;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);box-shadow:var(--shadow)}
.cekmece .gosterim{background:#0E100F;display:flex;flex-direction:column;align-items:center;justify-content:center;position:sticky;top:0;height:100vh;min-height:0}
.gosterim .sahne{flex:1;display:flex;align-items:center;justify-content:center;width:100%;min-height:0;padding:16px}
.gosterim img,.gosterim video{max-width:100%;max-height:100%;border-radius:8px;display:block}
.gosterim .alt-serit{display:flex;gap:6px;padding:10px;overflow-x:auto;width:100%;justify-content:center}
.gosterim .alt-serit button{width:46px;height:58px;border-radius:6px;overflow:hidden;border:2px solid transparent;padding:0;background:#222;cursor:pointer;flex:none}
.gosterim .alt-serit button[aria-current="true"]{border-color:#fff}
.gosterim .alt-serit img{width:100%;height:100%;object-fit:cover}
.panel{padding:18px 20px 40px;display:flex;flex-direction:column;gap:16px}
.panel-bas{display:flex;align-items:center;gap:8px}
.panel-bas h2{margin:0;font-size:18px;letter-spacing:-.01em;flex:1}
.kapat{border:0;background:var(--surface-2);border-radius:10px;width:34px;height:34px;display:grid;place-items:center;cursor:pointer}
.alan{display:flex;flex-direction:column;gap:5px}
.alan>span{font-size:12px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.alan input,.alan textarea,.alan select{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:8px 10px;width:100%}
.alan textarea{min-height:170px;resize:vertical;line-height:1.5}
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sayac{font-size:12px;color:var(--muted);text-align:right}
.sayac.asti{color:var(--bad)}
.kutu{border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:12px 14px}
.kutu h3{margin:0 0 8px;font-size:13px}
.yol{display:flex;gap:10px;align-items:flex-start}
.yol p{margin:2px 0 0;color:var(--muted);font-size:13px}
.eylemler{display:flex;flex-wrap:wrap;gap:8px}
.yorum{padding:8px 0;border-top:1px solid var(--line)}
.yorum:first-child{border-top:0}
.yorum b{font-size:12.5px}
.yorum time{color:var(--muted);font-size:11.5px;margin-left:6px}
.yorum p{margin:3px 0 0;white-space:pre-wrap}
.yorum.musteri b{color:var(--warn)}
.yorum.cozuldu p{color:var(--muted);text-decoration:line-through}
.medya-liste{display:flex;flex-direction:column;gap:6px}
.medya-satir{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:5px 8px;background:var(--surface)}
.medya-satir img{width:44px;height:56px;object-fit:cover;border-radius:6px}
.medya-satir .ad{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.medya-satir .bilgi{font-size:11.5px;color:var(--muted)}
.mini{border:0;background:none;padding:4px;cursor:pointer;color:var(--muted);border-radius:6px}
.mini:hover{background:var(--surface-2);color:var(--text)}
.yukleme-alani{border:1.5px dashed var(--line);border-radius:12px;padding:14px;text-align:center;color:var(--muted);cursor:pointer}
.yukleme-alani.uzerinde{border-color:var(--accent);color:var(--accent)}
.ilerleme{height:4px;background:var(--surface-2);border-radius:2px;overflow:hidden;margin-top:6px}
.ilerleme i{display:block;height:100%;background:var(--accent);width:0}
.olaylar{font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:3px}

.pencere{position:fixed;inset:0;z-index:50;background:rgba(10,12,11,.45);display:grid;place-items:center;padding:16px}
.pencere>div{background:var(--bg);border-radius:18px;width:min(520px,100%);max-height:90vh;overflow:auto;padding:20px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
.pencere h2{margin:0;font-size:18px}

.bildirim{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--text);color:var(--bg);padding:10px 16px;border-radius:12px;z-index:60;box-shadow:var(--shadow);max-width:calc(100% - 32px)}
.bugun-grup{margin-bottom:26px}
.bugun-grup h2{font-size:15px;margin:0 0 10px;display:flex;gap:8px;align-items:center}
.bos{color:var(--muted);padding:30px 0;text-align:center}
.uyari{border:1px solid var(--warn);color:var(--warn);background:color-mix(in srgb,var(--warn) 8%,transparent);border-radius:12px;padding:10px 12px;font-size:13px}

/* müşteri */
.banner{display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin-bottom:16px;box-shadow:var(--shadow)}
.banner p{margin:0;flex:1;min-width:200px}

@media (max-width:820px){
  .cekmece{grid-template-columns:1fr}
  .cekmece .gosterim{position:relative;height:auto;max-height:62vh}
  .gosterim .sahne{max-height:52vh}
  .gun{grid-template-columns:52px 1fr;gap:10px}
  .gt b{font-size:21px}
  .kart{width:calc(50% - 5px)}
  .kim{display:none}
  .ikili{grid-template-columns:1fr}
}