/* === Takvim panelleri (Hero sol/sağ) === */
.hero{ position: relative; overflow: hidden; }
/* panelleri üste al: typebar/başlıkla çakışmasın */
.hero-panels{
  position:absolute;
  left: 24px; right: 24px;
  top: 16px; bottom: auto;
  height: 150px;
  display:flex; align-items:flex-start; justify-content:space-between;
  gap: 18px;
  pointer-events:none;
}
.hero-panel{
  width: min(520px, 32vw);
  height: 150px;
  padding: 14px 14px 12px;
  border-radius: 18px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
  pointer-events:auto;
  overflow:hidden;
}
.hero-panel-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom: 10px; }
.hero-panel-head .ttl{ font-weight:800; letter-spacing:.2px; }

/* poster gibi kartlar */
.hero-panel-body{ display:flex; gap:12px; overflow:auto; padding-bottom: 2px; }
    html.cal-open, body.cal-open{overflow:hidden;}
.hero-panel-body::-webkit-scrollbar{ height: 8px; }
.hero-panel-body::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.12); border-radius: 999px; }

.tk-card{
  flex: 0 0 120px;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.06);
  text-decoration:none;
  color: inherit;
  align-items:flex-start;
}
.tk-card:hover{ background: rgba(255,255,255,.09); }
.tk-poster{
  width: 100%;
  height: 128px;
  border-radius: 12px;
  overflow:hidden;
  background: rgba(255,255,255,.08);
}
.tk-poster img{ width:100%; height:100%; object-fit:cover; display:block; }
.tk-meta{ min-width:0; width:100%; }
.tk-name{
  font-weight:800;
  font-size: 13px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.tk-sub{
  margin-top:4px;
  font-size:12px;
  opacity:.75;
  line-height:1.2;
  max-height: 28px;
  overflow:hidden;
}

/* küçük ekranlarda kapat */
@media (max-width: 1100px){ .hero-panels{ display:none; } }
.hero .container{ padding-top: 90px; }

:root{
      --bg:#050505; --text:#fff; --muted:#94a3b8;
      --b1:#6366f1; --b2:#ec4899; --b3:#8b5cf6;
      --glass:rgba(255,255,255,.03); --line:rgba(255,255,255,.08);
      --blur:18px;
      --r-card:16px;
      --shadow-sm:0 6px 16px rgba(0,0,0,.25);
      --shadow-lg:0 24px 40px -16px rgba(0,0,0,.55), 0 0 20px rgba(99,102,241,.20);
    }
    [data-theme="light"]{
      --bg:#f8fafc; --text:#0f172a; --muted:#64748b;
      --glass:rgba(255,255,255,.72); --line:rgba(0,0,0,.06);
      --shadow-lg:0 20px 42px -14px rgba(0,0,0,.12);
    }
    *{box-sizing:border-box}
    html,body{height:100%;margin:0}
    body{
      font-family:'Outfit',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
      background:var(--bg); color:var(--text);
      overflow-x:hidden;
    }
    body::before{
      content:""; position:fixed; inset:-20%;
      background:
        radial-gradient(circle at 20% 30%, rgba(99,102,241,.18), transparent 42%),
        radial-gradient(circle at 80% 10%, rgba(236,72,153,.14), transparent 42%),
        radial-gradient(circle at 50% 80%, rgba(139,92,246,.16), transparent 42%);
      filter: blur(60px);
      z-index:-1;
      animation: aurora 15s ease infinite alternate;
    }
    @keyframes aurora{0%{transform:scale(1)}100%{transform:scale(1.1) rotate(2deg)}}
    a{color:inherit;text-decoration:none}
    .container{width:min(1200px,94vw);margin:0 auto}
    @media(max-width:900px){.container{width:min(1200px,92vw)}}

body::after {
      content: "";
      position: fixed;
      inset: 0;
      z-index: -2; /* En arkada dursun */
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      opacity: 0; /* Başlangıçta görünmez */
      transition: opacity 0.6s ease, background-image 0.6s ease;
      pointer-events: none;
      /* JS'den gelecek değişkeni kullanır: */
      background-image: var(--chan-bg, none); 
    }
    body[data-channel="1"]::after {
      opacity: 0.25; /* Resmin okunabilir saydamlığı */
    }

    .topbar{position:relative;z-index:9990;margin-top:18px}
    .topbar__wrap{display:flex;align-items:center;gap:14px}
    .brand{display:flex;align-items:center;justify-content:center;user-select:none;flex:0 0 auto}
    .brand img{height:78px;width:auto;display:block;filter: drop-shadow(0 14px 24px rgba(0,0,0,.45))}
    .topbar__pill{
      flex:1;min-width:0;
      background:var(--glass);
      border:1px solid var(--line);
      border-radius:999px;
      backdrop-filter: blur(var(--blur));
      -webkit-backdrop-filter: blur(var(--blur));
      padding:10px 12px;
      display:flex;align-items:center;gap:14px;
      box-shadow:var(--shadow-sm);
    }
    .search{flex:1;min-width:180px}
    .search input{
      width:100%;
      background:rgba(128,128,128,.08);
      border:1px solid transparent;
      padding:12px 18px;
      border-radius:999px;
      color:var(--text);
      font-family:inherit;
      font-size:14px;
      transition:.18s;
      outline:none;
    }
    .search input:focus{
      background:var(--bg);
      border-color:var(--b1);
      box-shadow:0 0 0 4px rgba(99,102,241,.15);
    }
    .actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}
    .btn{
      padding:10px 14px;
      border-radius:999px;
      border:1px solid var(--line);
      cursor:pointer;
      font-family:inherit;
      font-weight:900;
      font-size:13px;
      display:inline-flex;align-items:center;gap:8px;
      user-select:none;
      transition:.18s;
      background:rgba(128,128,128,.08);
      color:var(--text);
      white-space:nowrap;
    }
    .btn:hover{background:rgba(128,128,128,.12)}
    .btn--primary{background:var(--text);color:var(--bg);border-color:transparent}
    .btn--primary:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(255,255,255,.15)}
    .hide-sm{display:inline}
    @media(max-width:980px){
      .topbar__wrap{flex-wrap:wrap}
      .topbar__pill{width:100%;border-radius:16px}
      .brand{width:100%; justify-content:flex-start; padding-left:6px}
      .brand img{height:64px}
    }
    @media(max-width:900px){
      .hide-sm{display:none}
      .brand img{height:58px}
    }

    .hero{padding:56px 0 18px;text-align:center}
    .hero h1{
      margin:0 0 12px;
      font-size:clamp(30px,5vw,54px);
      line-height:1.05;
      letter-spacing:-1.6px;
      background:linear-gradient(135deg,var(--text) 35%, var(--muted));
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }
    .hero p{margin:0 auto 18px;max-width:680px;color:var(--muted);font-size:17px}
    .seg-wrap{
      display:inline-flex;
      background:rgba(128,128,128,.08);
      border:1px solid var(--line);
      border-radius:999px;
      padding:6px;
      gap:6px;
    }
    .hero-actions{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px}
    .btn--surprise{
      background: linear-gradient(135deg, rgba(99,102,241,.22), rgba(236,72,153,.18));
      border-color: rgba(255,255,255,.14);
    }
    .btn--surprise:hover{transform: translateY(-2px);box-shadow: var(--shadow-lg)}
    .btn--surprise.is-buzz{animation: buzz .22s ease-in-out 0s 2}
    @keyframes buzz{0%{transform:translateX(0)}25%{transform:translateX(-3px)}50%{transform:translateX(3px)}75%{transform:translateX(-2px)}100%{transform:translateX(0)}}
    .seg-btn{
      background:transparent;border:0;
      padding:10px 20px;border-radius:999px;
      font-family:inherit;font-weight:900;
      color:var(--muted);
      cursor:pointer;
      transition:.18s;
    }
    .seg-btn.is-active{
      background:var(--bg);
      color:var(--text);
      box-shadow:0 6px 14px rgba(0,0,0,.20);
    }
    [data-theme="dark"] .seg-btn.is-active{background:#1f1f1f}
    @media(max-width:900px){ .hero{padding:40px 0 10px} .hero p{font-size:15px} .seg-btn{padding:10px 14px} }

    /* Typebar: 5 ana sekme + açılır 3 seçenek */
    .seg-wrap.typebar{flex-direction:column;align-items:stretch;border-radius:22px;padding:6px}
    .typebar-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
    .seg-btn.seg-more{padding:10px 14px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}
    .typebar-more{display:flex;gap:6px;flex-wrap:wrap;padding-top:8px;margin-top:6px;border-top:1px solid var(--line)}
    .typebar-more[hidden]{display:none !important;}

    .section{padding:10px 0 0}
    .section__head{
      display:flex;justify-content:space-between;align-items:flex-end;
      margin:18px 0 12px;padding-bottom:12px;border-bottom:1px solid var(--line);
      gap:12px;flex-wrap:wrap;
    }
    .section__head h2{margin:0;font-size:20px;letter-spacing:-.6px}

    .controls{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;align-items:center}

.pager-bottom{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  margin:14px 0 4px;
}

    .chip{
      display:inline-flex;align-items:center;gap:8px;
      padding:8px 12px;border-radius:999px;border:1px solid var(--line);
      background:rgba(128,128,128,.08);color:var(--muted);font-size:13px;user-select:none;
    }
    .chip b{color:var(--text)}
    .dd{position:relative;display:inline-flex}
    .dd-btn{
      padding:8px 12px;border-radius:999px;border:1px solid var(--line);
      background:rgba(128,128,128,.08);color:var(--text);
      font-family:inherit;font-weight:900;font-size:13px;
      cursor:pointer;display:inline-flex;align-items:center;gap:10px;
    }
    .dd-btn i{opacity:.85}
    .dd-menu{
      position:absolute;right:0;top:calc(100% + 8px);min-width:250px;
      background:rgba(12,12,12,.92);border:1px solid rgba(255,255,255,.12);
      border-radius:16px;padding:8px;box-shadow: 0 28px 50px rgba(0,0,0,.55);
      backdrop-filter: blur(12px);-webkit-backdrop-filter: blur(12px);
      display:none;z-index:200;
      max-height: 62vh;
      overflow:auto;
    }
    [data-theme="light"] .dd-menu{background:rgba(255,255,255,.92);border-color: rgba(0,0,0,.10)}
    .dd.is-open .dd-menu{display:block; animation: pop .14s ease both}
    @keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
    .dd-item{
      width:100%;border:0;background:transparent;color:var(--text);
      font-family:inherit;font-weight:900;font-size:13px;
      padding:10px 12px;border-radius:12px;cursor:pointer;
      display:flex;align-items:center;justify-content:space-between;gap:10px;
    }
    .dd-item:hover{background:rgba(128,128,128,.12)}
    .dd-item .muted{color:var(--muted);font-weight:900;font-size:12px}
    .dd-item.is-active{background:rgba(99,102,241,.18); border:1px solid rgba(99,102,241,.25)}
    .dd-sep{height:1px;background:var(--line);margin:6px 6px}

    .dd-left{display:flex;align-items:center;gap:10px;min-width:0}
    .dd-ic{
      width:26px;height:26px;flex:0 0 26px;
      object-fit:contain;border-radius:9px;
      background:rgba(128,128,128,.12);
      border:1px solid rgba(255,255,255,.10);
    }
    [data-theme="light"] .dd-ic{border-color:rgba(0,0,0,.10)}
    .dd-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .dd-check{opacity:.75}
    .dd-item.is-active .dd-check{opacity:1}

    .dd-search{
      position: sticky;
      top: 0;
      z-index: 3;
      padding: 8px;
      margin: -8px -8px 8px;
      background: inherit;
      backdrop-filter: inherit;
      -webkit-backdrop-filter: inherit;
      border-bottom: 1px solid var(--line);
    }
    .dd-searchbox{
      display:flex;align-items:center;gap:10px;
      padding:10px 12px;border-radius:14px;
      border:1px solid var(--line);
      background:rgba(128,128,128,.08);
    }
    .dd-searchbox i{opacity:.8}
    .dd-searchbox input{
      width:220px;max-width:42vw;
      border:0;outline:none;background:transparent;color:var(--text);
      font-family:inherit;font-weight:900;font-size:13px;
    }
    .dd-searchbox input::placeholder{color:var(--muted);font-weight:800}
    .dd-searchclear{
      border:0;background:rgba(128,128,128,.10);color:var(--text);
      width:34px;height:34px;border-radius:12px;cursor:pointer;
      display:inline-flex;align-items:center;justify-content:center;
    }
    .dd-searchclear:hover{background:rgba(128,128,128,.16)}

    .grid{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:20px}
    @media(max-width:900px){ .grid{grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px} }

    .item{
      position:relative;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.03);border:1px solid var(--line);
      aspect-ratio:2/3;transform: translateZ(0);
      transition: transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s, border-color .35s, opacity .18s;
    }
    .item:hover{transform: translateY(-6px) scale(1.02);box-shadow: var(--shadow-lg);border-color: rgba(99,102,241,.35);z-index:5}
    .poster{position:absolute; inset:0; background:#000}
    .poster.no-img::before{
      content:""; position:absolute; inset:0;
      background:
        radial-gradient(circle at 20% 30%, rgba(99,102,241,.35), transparent 45%),
        radial-gradient(circle at 80% 10%, rgba(236,72,153,.30), transparent 45%),
        radial-gradient(circle at 50% 85%, rgba(139,92,246,.28), transparent 45%),
        #0b0b0b;
    }
    .poster-img{width:100%;height:100%;object-fit:cover;transform:scale(1.01);transition: transform .55s ease, filter .55s ease, opacity .55s ease;display:block}
    .bottom{
      position:absolute; left:0; right:0; bottom:0;
      padding:14px 12px 14px;z-index:12;
      background: linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,.05) 70%, rgba(0,0,0,0));
    }
    .title{
      margin:0;text-align:center;font-weight:900;font-size:15px;color:#fff;
      text-shadow: 0 2px 10px rgba(0,0,0,.85);
      display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
    }
    @media(max-width:900px){.title{font-size:13px}.bottom{padding:12px 10px 12px}}
    .badge{position:absolute;top:14px;z-index:30;pointer-events:auto;filter: drop-shadow(0 12px 20px rgba(0,0,0,.50))}
    .badge.left{left:14px}.badge.right{right:14px}
    .badge.mid{left:50%;transform:translateX(-50%);top:14px}
    .badge.mid .badge-txt{display:inline-block;padding:8px 12px;border-radius:999px;background:rgba(0,0,0,.55);backdrop-filter: blur(10px);border:1px solid rgba(255,255,255,.14);color:#fff;font-weight:800;font-size:12px;letter-spacing:.2px}
    .badge img{width:54px;height:54px;object-fit:contain;display:block;transform: scale(1) rotate(0deg);transition: transform .50s cubic-bezier(.34,1.56,.64,1), filter .35s ease}
    .badge.left:hover img{transform: scale(1.18) rotate(8deg)}
    .badge.right:hover img{transform: scale(1.18) rotate(-8deg)}
    @media(max-width:900px){
      .badge{top:10px}.badge.left{left:10px}.badge.right{right:10px}.badge img{width:46px;height:46px}
    }
    .hover-logo{
      position:absolute; inset:0;display:flex;align-items:center;justify-content:center;z-index:22;pointer-events:auto;
      opacity:0;transform: scale(.55) rotate(-35deg);transition: opacity .22s ease, transform .50s cubic-bezier(.34,1.56,.64,1);padding:12px;
    }
    .hover-logo img{width:85%;max-height:58%;object-fit:contain;filter: drop-shadow(0 18px 30px rgba(0,0,0,.78))}
    .item:hover .poster-img{transform:scale(1.10);filter: saturate(1.05) contrast(1.05);opacity:.62}
    .item:hover .hover-logo{opacity:1;transform: scale(1.02) rotate(2deg)}

    .ep-chip{position:absolute;left:12px;right:12px;bottom:12px;z-index:25;display:flex;justify-content:center;pointer-events:auto}
    .ep-chip span{
      display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
      background:rgba(0,0,0,.60);border:1px solid rgba(255,255,255,.14);color:#fff;font-weight:900;font-size:12px;
    }
    .ep-style-nick{background:#ff7f00 !important;border:none !important;border-radius: 60% 40% 70% 30% / 40% 70% 30% 60% !important;color:#fff !important;padding:10px 18px !important}
    .ep-style-cn{background:#000 !important;border:2px solid #fff !important;border-radius:4px !important;color:#fff !important;padding:8px 14px !important}

    .swap{transition: opacity .16s ease, transform .16s ease}
    .swap.is-out{opacity:0;transform: translateY(6px)}
    #newWrap.swap.is-out{opacity:0;transform: translateY(10px) scale(.985);filter: blur(1.5px)}
    #newGrid.is-in .item{animation: newIn .28s cubic-bezier(.2,.9,.2,1) both}
    @keyframes newIn{from{opacity:0; transform: translateY(10px) scale(.98)}to{opacity:1; transform:none}}

    .subtabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
    .subtabs button{
      border:1px solid var(--line);background:rgba(128,128,128,.08);color:var(--text);
      font-family:inherit;font-weight:900;font-size:13px;padding:8px 14px;border-radius:999px;cursor:pointer;transition:.18s;
    }
    .subtabs button:hover{background:rgba(128,128,128,.12)}
    .subtabs button.is-active{background:var(--text);color:var(--bg);border-color:transparent}
    .subtabs .toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:auto;padding:8px 12px}
    .subtabs .toggle .tlabel{font-weight:900;font-size:13px;color:var(--text);line-height:1}
    .subtabs .toggle i{transition: transform .18s ease}
    .subtabs .toggle.is-collapsed i{transform: rotate(180deg)}
    @media(max-width:900px){.subtabs .toggle{width:42px; padding:8px 0; gap:0}.subtabs .toggle .tlabel{display:none}}
    #newWrap{overflow:hidden;max-height:2200px;transition: max-height .35s ease, opacity .22s ease, transform .22s ease;opacity:1;transform: translateY(0)}
    #newWrap.is-collapsed{max-height:0;opacity:0;transform: translateY(-8px);pointer-events:auto}
    .mini-pager{display:flex;gap:10px;align-items:center;justify-content:center;padding:12px 0 6px}
    .mini-pager .mp-btn{
      width:44px;height:44px;border:1px solid var(--line);background:rgba(128,128,128,.08);color:var(--text);
      padding:0;border-radius:999px;font-family:inherit;font-weight:900;cursor:pointer;transition:.18s;
      display:inline-flex;align-items:center;justify-content:center;
    }
    .mini-pager .mp-btn:disabled{opacity:.45;cursor:not-allowed}
    .mini-pager .mp-info{color:var(--muted);font-weight:900;font-size:13px;border:1px solid var(--line);background:rgba(128,128,128,.06);padding:8px 12px;border-radius:999px}
    .new-shell{position:relative}
    .new-arrow{
      position:absolute;top:50%;transform: translateY(-50%);
      width:46px;height:46px;border-radius:999px;border:1px solid var(--line);
      background:rgba(12,12,12,.55);color:var(--text);
      display:inline-flex;align-items:center;justify-content:center;cursor:pointer;z-index:40;
      box-shadow: 0 18px 32px rgba(0,0,0,.45);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);
      transition: opacity .16s ease, transform .16s ease, background .16s ease;opacity:0;pointer-events:auto;
    }
    .new-arrow.left{left:-12px}.new-arrow.right{right:-12px}
    .new-shell:hover .new-arrow{opacity:1; pointer-events:auto}
    .new-arrow:hover{background:rgba(12,12,12,.70);transform: translateY(-50%) scale(1.06)}
    .new-arrow:disabled{opacity:.25}
    @media(max-width:900px){.new-arrow{opacity:1}.new-arrow.left{left:-8px}.new-arrow.right{right:-8px}}

    .social{margin:26px 0 20px;display:flex;justify-content:center}
    .social__inner{
      display:flex;gap:10px;flex-wrap:wrap;justify-content:center;align-items:center;
      background:var(--glass);border:1px solid var(--line);border-radius:999px;padding:10px 12px;
      backdrop-filter: blur(var(--blur));-webkit-backdrop-filter: blur(var(--blur));box-shadow:var(--shadow-sm);
    }
    .social a{
      display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;border:1px solid transparent;
      background:rgba(128,128,128,.06);transition:.18s;font-weight:900;color:var(--text);
    }
    .social a:hover{background:rgba(128,128,128,.12); border-color: var(--line)}
    .social i{font-size:16px}
    .footer-note{text-align:center;color:var(--muted);font-size:13px;padding:10px 0 30px}

    #newGrid .badge{display:none !important}
    #newsView{position:fixed;inset:0;z-index:9999;background:#000;opacity:0;pointer-events:none;transition: opacity .22s ease}
    #newsView.is-on{opacity:1;pointer-events:auto}
    #newsFrame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}

    /* TAKVİM MODAL */
    #calView{position:fixed;inset:0;z-index:9998;background:rgba(0,0,0,.86);opacity:0;pointer-events:none;transition:opacity .18s ease}
    #calView.is-on{opacity:1;pointer-events:auto}
    #calCard{
      position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
      width:min(900px,92vw);max-height:82vh;overflow:auto;
      background:rgba(12,12,12,.92);border:1px solid rgba(255,255,255,.14);
      border-radius:18px;box-shadow:0 40px 70px rgba(0,0,0,.65);
      backdrop-filter: blur(14px);-webkit-backdrop-filter: blur(14px);
      padding:16px;
    }
    [data-theme="light"] #calCard{background:rgba(255,255,255,.95);border-color:rgba(0,0,0,.10)}
    .calTop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
    .calTop h3{margin:0;font-size:18px;letter-spacing:-.5px}
    .calClose{width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:rgba(128,128,128,.10);color:var(--text);cursor:pointer}
    .calClose:hover{background:rgba(128,128,128,.16)}
    .calHint{color:var(--muted);font-weight:800;font-size:13px;margin:0 0 12px}
    .calList{display:flex;flex-direction:column;gap:10px}
    .calRow{
      border:1px solid var(--line);background:rgba(128,128,128,.06);
      border-radius:16px;padding:12px;
      display:flex;flex-direction:column;gap:6px;
    }
    .calRow .dt{font-weight:900}
    .calRow .meta{color:var(--muted);font-weight:800;font-size:13px}
  
.toast{
  position:fixed; top:18px; left:50%;
  transform:translateX(-50%) translateY(-8px);
  background:rgba(15,15,18,.92);
  color:#fff;
  padding:10px 14px;
  border-radius:14px;
  font-size:14px;
  line-height:1.2;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
  z-index:9999;
  box-shadow:0 12px 40px rgba(0,0,0,.35);
  max-width:min(92vw, 520px);
  text-align:center;
}
.toast.is-on{ opacity:1; transform:translateX(-50%) translateY(0); }


    /* ========================= anasayfa2 TAKVİM CSS ========================= */
    .cal-dd{position:relative; display:inline-flex}

    .cal-menu{
      position:absolute;
      right:0;
      top:calc(100% + 10px);
      width:min(760px, 94vw);
      max-height:78vh;
      overflow:auto;
      background:rgba(12,12,12,.97);
      border:1px solid rgba(255,255,255,.12);
      border-radius:18px;
      padding:12px;
      box-shadow: 0 28px 60px rgba(0,0,0,.60);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      display:none;
      z-index:9991;
      transform-origin: 85% 0%;
    }
    [data-theme="light"] .cal-menu{
      background:rgba(255,255,255,.97);
      border-color: rgba(0,0,0,.10);
    }

    /* OPEN ANİMASYON (güçlü) */
    .cal-dd.is-open .cal-menu{display:block; animation: calOpen .22s cubic-bezier(.16,1,.3,1) both;}
    @keyframes calOpen{
      from{opacity:0; transform:translateY(-10px) scale(.985); filter: blur(6px);}
      to{opacity:1; transform:none; filter: blur(0);}
    }

    .cal-head{
      display:flex; align-items:center; gap:8px;
      padding:2px 2px 10px;
      border-bottom:1px solid var(--line);
      margin-bottom:12px;
      position:sticky; top:0;
      background:inherit;
      backdrop-filter: inherit;
      -webkit-backdrop-filter: inherit;
      z-index:2;
    }
    .cal-nav,.cal-close{
      width:40px; height:40px;
      border-radius:12px;
      border:1px solid var(--line);
      background:rgba(128,128,128,.08);
      color:var(--text);
      cursor:pointer;
      display:inline-flex; align-items:center; justify-content:center;
      transition:.18s;
      flex:0 0 auto;
    }
    .cal-nav:hover,.cal-close:hover{background:rgba(128,128,128,.12)}
    .cal-year{flex:1; text-align:center; user-select:none}

    /* AY/YIL yazısı anim */
    .cal-year__num{font-weight:900; letter-spacing:-.6px; font-size:18px}
    #calYearText.is-flip{animation: titleFlip .22s cubic-bezier(.2,.9,.2,1) both;}
    @keyframes titleFlip{
      from{opacity:0; transform: translateY(-6px) scale(.985);}
      to{opacity:1; transform:none;}
    }

    .cal-year__hint{color:var(--muted); font-weight:800; font-size:12px; margin-top:2px}

    .cal-body{
      display:grid;
      grid-template-columns: 360px minmax(0,1fr);
      gap:12px;
      padding:12px 0 0;
      align-items:start;
    }
    .cal-monthwrap{min-width:0; position:relative;}
    @media(max-width:900px){
      .cal-body{grid-template-columns:1fr;}
      .cal-menu{width:min(760px, 92vw)}
    }

    .cal-month{
      border:1px solid var(--line);
      background:rgba(128,128,128,.06);
      border-radius:16px;
      padding:10px 10px 12px;
    }

    /* AY DEĞİŞTİRME SLIDE ANİMASYONU */
    #calMonthWrap.cal-out-left .cal-month{animation: calOutLeft .18s ease both;}
    #calMonthWrap.cal-in-right .cal-month{animation: calInRight .22s cubic-bezier(.16,1,.3,1) both;}
    #calMonthWrap.cal-out-right .cal-month{animation: calOutRight .18s ease both;}
    #calMonthWrap.cal-in-left .cal-month{animation: calInLeft .22s cubic-bezier(.16,1,.3,1) both;}
    @keyframes calOutLeft{from{opacity:1;transform:none}to{opacity:0;transform:translateX(-18px)}}
    @keyframes calInRight{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
    @keyframes calOutRight{from{opacity:1;transform:none}to{opacity:0;transform:translateX(18px)}}
    @keyframes calInLeft{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}

    .cal-dow{
      display:grid;
      grid-template-columns:repeat(7, 1fr);
      gap:6px;
      margin-bottom:6px;
      color:var(--muted);
      font-weight:900;
      font-size:10px;
      text-align:center;
      user-select:none;
    }
    .cal-days{display:grid;grid-template-columns:repeat(7, 1fr);gap:6px}

    .cal-day{
      position:relative;
      width:100%;
      aspect-ratio: 1 / 1;
      border-radius:12px;
      border:1px solid rgba(255,255,255,.08);
      background:rgba(0,0,0,.18);
      color:var(--text);
      font-family:inherit;
      font-weight:900;
      font-size:11px;
      cursor:pointer;
      transition:.14s;
      display:flex; align-items:center; justify-content:center;
      will-change: transform;
    }
    [data-theme="light"] .cal-day{background:rgba(255,255,255,.55); border-color:rgba(0,0,0,.08); color:#0f172a}
    .cal-day:hover{transform: translateY(-1px); background:rgba(128,128,128,.12)}
    .cal-day.is-empty{pointer-events:auto;opacity:.0;border-color:transparent;background:transparent}

    .cal-day.has-event{
      border-color: rgba(99,102,241,.35);
      box-shadow: 0 10px 18px rgba(99,102,241,.10);
    }
    .cal-day.has-event::after{
      content:"";
      position:absolute;
      width:7px; height:7px;
      border-radius:999px;
      right:8px; top:8px;
      background:rgba(236,72,153,.95);
      box-shadow:0 0 0 4px rgba(236,72,153,.14);
    }
    .cal-day.is-today{
      border-color: rgba(236,72,153,.35);
      box-shadow: 0 10px 18px rgba(236,72,153,.10);
    }
    .cal-day.is-selected{
      outline: 3px solid rgba(99,102,241,.35);
      outline-offset: 1px;
    }

    /* GÜN SEÇME POP ANİMASYONU */
    .cal-day.is-pop{animation: dayPop .18s cubic-bezier(.2,.9,.2,1) both;}
    @keyframes dayPop{
      from{transform:scale(.92)}
      60%{transform:scale(1.06)}
      to{transform:scale(1)}
    }

    .cal-detail{
      border:1px solid var(--line);
      border-radius:16px;
      background:rgba(128,128,128,.06);
      padding:12px;
      will-change: transform, opacity, filter;
    }
    @media(max-width:900px){ .cal-detail{margin-top:12px} }
    .cal-detail__title{font-weight:900;letter-spacing:-.5px;margin-bottom:6px;font-size:14px}
    .cal-detail__body{color:var(--muted); font-weight:800; font-size:13px}
    .cal-detail.is-closed{display:none}

    /* DETAY PANEL FADE/SLIDE */
    .cal-detail.is-anim{animation: detailIn .18s ease both;}
    @keyframes detailIn{
      from{opacity:0; transform: translateY(10px); filter: blur(4px);}
      to{opacity:1; transform:none; filter: blur(0);}
    }

    .cal-jump{margin-top:10px;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
    .cal-jump input{
      background:rgba(128,128,128,.10);
      border:1px solid var(--line);
      color:var(--text);
      border-radius:999px;
      padding:8px 12px;
      font-family:inherit;
      font-weight:900;
      font-size:12px;
      outline:none;
    }
    .cal-jump input:focus{border-color:rgba(99,102,241,.55); box-shadow:0 0 0 4px rgba(99,102,241,.12);}
    .cal-jumpbtn{
      padding:8px 12px;
      border-radius:999px;
      border:1px solid var(--line);
      background:rgba(128,128,128,.08);
      color:var(--text);
      font-family:inherit;
      font-weight:900;
      font-size:12px;
      cursor:pointer;
      transition:.18s;
    }
    .cal-jumpbtn:hover{background:rgba(128,128,128,.12)}

    .cal-badges{display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 10px}
    .cal-badge{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:7px 10px;
      border-radius:999px;
      border:1px solid rgba(99,102,241,.22);
      background:rgba(99,102,241,.14);
      color:var(--text);
      font-weight:900;
      font-size:12px;
    }
    .cal-chips{display:flex; flex-wrap:wrap; gap:8px}
    .cal-chip{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:7px 10px;
      border-radius:999px;
      border:1px solid var(--line);
      background:rgba(128,128,128,.08);
      color:var(--text);
      font-weight:900;
      font-size:12px;
      transition:.14s;
    }
    .cal-chip:hover{background:rgba(128,128,128,.12)}
    .cal-chip small{opacity:.75; font-weight:900}

    /* GRID */
    .grid{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:20px}
    @media(max-width:900px){ .grid{grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px;} }

    .item{
      position:relative;
      border-radius:var(--r-card);
      overflow:hidden;
      background:var(--glass);
      border:1px solid var(--line);
      aspect-ratio:2/3;
      transform: translateZ(0);
      transition: transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s, border-color .35s, opacity .18s;
    }
    .item:hover{
      transform: translateY(-6px) scale(1.02);
      box-shadow: var(--shadow-lg);
      border-color: rgba(99,102,241,.35);
      z-index:5;
    }

    .poster{position:absolute; inset:0; background:#000;}
    .poster.no-img::before{
      content:""; position:absolute; inset:0;
      background:
        radial-gradient(circle at 20% 30%, rgba(99,102,241,.35), transparent 45%),
        radial-gradient(circle at 80% 10%, rgba(236,72,153,.30), transparent 45%),
        radial-gradient(circle at 50% 85%, rgba(139,92,246,.28), transparent 45%),
        #0b0b0b;
      filter:saturate(1.1);
    }
    .poster-img{
      width:100%; height:100%;
      object-fit:cover;
      transform:scale(1.01);
      transition: transform .55s ease, filter .55s ease, opacity .55s ease;
      display:block;
    }

    .bottom{
      position:absolute; left:0; right:0; bottom:0;
      padding:14px 12px 14px;
      z-index:12;
      background: linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,.05) 70%, rgba(0,0,0,0));
    }
    .title{
      margin:0;
      text-align:center;
      font-weight:900;
      font-size:15px;
      color:#fff;
      text-shadow: 0 2px 10px rgba(0,0,0,.85);
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
      overflow:hidden;
    }
    @media(max-width:900px){
      .title{font-size:13px}
      .bottom{padding:12px 10px 12px}
    }

    .badge{
      position:absolute;
      top:14px;
      z-index:30;
      pointer-events:auto;
      filter: drop-shadow(0 12px 20px rgba(0,0,0,.50));
    }
    .badge.left{left:14px}
    .badge.right{right:14px}
    .badge img{
      width:54px;height:54px;object-fit:contain;display:block;
      transform: scale(1) rotate(0deg);
      transition: transform .50s cubic-bezier(.34,1.56,.64,1), filter .35s ease;
    }
    .badge.left:hover img{
      transform: scale(1.18) rotate(8deg);
      filter: drop-shadow(0 16px 26px rgba(0,0,0,.65)) drop-shadow(0 0 16px rgba(99,102,241,.28));
    }
    .badge.right:hover img{
      transform: scale(1.18) rotate(-8deg);
      filter: drop-shadow(0 16px 26px rgba(0,0,0,.65)) drop-shadow(0 0 16px rgba(236,72,153,.22));
    }
    @media(max-width:900px){
      .badge{top:10px}
      .badge.left{left:10px}
      .badge.right{right:10px}
      .badge img{width:46px;height:46px}
    }

    .hover-logo{
      position:absolute; inset:0;
      display:flex; align-items:center; justify-content:center;
      z-index:22;
      pointer-events:auto;
      opacity:0;
      transform: scale(.55) rotate(-35deg);
      transition: opacity .22s ease, transform .50s cubic-bezier(.34,1.56,.64,1);
      padding:12px;
    }
    .hover-logo img{
      width:85%;
      max-height:58%;
      object-fit:contain;
      filter: drop-shadow(0 18px 30px rgba(0,0,0,.78));
    }
    .item:hover .poster-img{
      transform:scale(1.10);
      filter: saturate(1.05) contrast(1.05);
      opacity:.62;
    }
    .item:hover .hover-logo{
      opacity:1;
      transform: scale(1.02) rotate(2deg);
    }

    .badge:hover img,
    .item:hover .badge img{
      transform: scale(1.16) rotate(10deg);
      filter: drop-shadow(0 18px 30px rgba(0,0,0,.78));
    }

    .ep-chip{
      position:absolute;
      left:12px; right:12px;
      bottom:12px;
      z-index:25;
      display:flex;
      justify-content:center;
      pointer-events:auto;
    }
    .ep-chip span{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 12px;
      border-radius:999px;
      background:rgba(0,0,0,.60);
      border:1px solid rgba(255,255,255,.14);
      color:#fff;
      font-weight:900;
      font-size:12px;
      box-shadow: 0 10px 18px rgba(0,0,0,.35);
    }
    .ep-style-nick {
      background: #ff7f00 !important;
      border: none !important;
      border-radius: 60% 40% 70% 30% / 40% 70% 30% 60% !important;
      color: #fff !important;
      padding: 10px 18px !important;
      text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    }
    .ep-style-cn {
      background: #000 !important;
      border: 2px solid #fff !important;
      border-radius: 4px !important;
      color: #fff !important;
      padding: 8px 14px !important;
      text-shadow: none !important;
    }

    .swap{transition: opacity .16s ease, transform .16s ease;}
    .swap.is-out{opacity:0;transform: translateY(6px);}
    #newWrap.swap.is-out{opacity:0;transform: translateY(10px) scale(.985);filter: blur(1.5px);}

    #newGrid.is-in .item{animation: newIn .28s cubic-bezier(.2,.9,.2,1) both;}
    @keyframes newIn{from{opacity:0; transform: translateY(10px) scale(.98);}to{opacity:1; transform:none;}}

    .subtabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
    .subtabs button{
      border:1px solid var(--line);
      background:rgba(128,128,128,.08);
      color:var(--text);
      font-family:inherit;
      font-weight:900;
      font-size:13px;
      padding:8px 14px;
      border-radius:999px;
      cursor:pointer;
      transition:.18s;
    }
    .subtabs button:hover{background:rgba(128,128,128,.12)}
    .subtabs button.is-active{
      background:var(--text);
      color:var(--bg);
      border-color:transparent;
    }

    .subtabs .toggle{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      width:auto;
      padding:8px 12px;
    }
    .subtabs .toggle .tlabel{font-weight:900;font-size:13px;color:var(--text);line-height:1;}
    .subtabs .toggle i{transition: transform .18s ease}
    .subtabs .toggle.is-collapsed i{transform: rotate(180deg)}
    @media(max-width:900px){
      .subtabs .toggle{width:42px; padding:8px 0; gap:0}
      .subtabs .toggle .tlabel{display:none}
    }

    #newWrap{
      overflow:hidden;
      max-height: 2200px;
      transition: max-height .35s ease, opacity .22s ease, transform .22s ease;
      opacity:1;
      transform: translateY(0);
    }
    #newWrap.is-collapsed{
      max-height: 0;
      opacity:0;
      transform: translateY(-8px);
      pointer-events:auto;
    }

    .mini-pager{
      display:flex;gap:10px;align-items:center;justify-content:center;
      padding:12px 0 6px;
    }
    .mini-pager .mp-btn{
      width:44px;height:44px;
      border:1px solid var(--line);
      background:rgba(128,128,128,.08);
      color:var(--text);
      padding:0;
      border-radius:999px;
      font-family:inherit;
      font-weight:900;
      cursor:pointer;
      transition:.18s;
      display:inline-flex;
      align-items:center;
      justify-content:center;
    }
    .mini-pager .mp-btn:disabled{opacity:.45;cursor:not-allowed}
    .mini-pager .mp-info{
      color:var(--muted);
      font-weight:900;
      font-size:13px;
      border:1px solid var(--line);
      background:rgba(128,128,128,.06);
      padding:8px 12px;
      border-radius:999px;
    }

    .new-shell{position:relative}
    .new-arrow{
      position:absolute;
      top:50%;
      transform: translateY(-50%);
      width:46px;height:46px;
      border-radius:999px;
      border:1px solid var(--line);
      background:rgba(12,12,12,.55);
      color:var(--text);
      display:inline-flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      z-index:40;
      box-shadow: 0 18px 32px rgba(0,0,0,.45);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      transition: opacity .16s ease, transform .16s ease, background .16s ease;
      opacity:0;
      pointer-events:auto;
    }
    .new-arrow.left{left:-12px}
    .new-arrow.right{right:-12px}
    .new-shell:hover .new-arrow{opacity:1; pointer-events:auto}
    .new-arrow:hover{
      background:rgba(12,12,12,.70);
      transform: translateY(-50%) scale(1.06);
    }
    .new-arrow:disabled{opacity:.25}
    @media(max-width:900px){
      .new-arrow{opacity:1; pointer-events:auto}
      .new-arrow.left{left:-8px}
      .new-arrow.right{right:-8px}
    }

    .social{margin:26px 0 20px;display:flex;justify-content:center;}
    .social__inner{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      justify-content:center;
      align-items:center;
      background:var(--glass);
      border:1px solid var(--line);
      border-radius:999px;
      padding:10px 12px;
      backdrop-filter: blur(var(--blur));
      -webkit-backdrop-filter: blur(var(--blur));
      box-shadow:var(--shadow-sm);
    }
    .social a{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:10px 14px;
      border-radius:999px;
      border:1px solid transparent;
      background:rgba(128,128,128,.06);
      transition:.18s;
      font-weight:900;
      color:var(--text);
    }
    .social a:hover{background:rgba(128,128,128,.12); border-color: var(--line)}
    .social i{font-size:16px}

    .footer-note{text-align:center;color:var(--muted);font-size:13px;padding:10px 0 30px}

    #newGrid .badge{display:none !important;}

    #newsView{
      position:fixed;
      inset:0;
      z-index:9999;
      background:#000;
      opacity:0;
      pointer-events:none;
      transition: opacity .22s ease;
    }
    #newsView.is-on{opacity:1;pointer-events:auto}
    #newsFrame{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}

    #topbar, #homeView{
      will-change: transform, opacity, filter;
      transform-origin: 50% 0%;
      transition:
        transform .55s cubic-bezier(.16,1,.3,1),
        opacity .35s ease,
        filter .35s ease;
    }
    body.is-news-opening #topbar,
    body.is-news-opening #homeView{
      opacity:0;
      transform: translateY(10px) scale(.88) rotate(-4deg);
      filter: blur(10px);
      pointer-events:auto;
    }

    @media (prefers-reduced-motion: reduce){
      body::before{animation:none !important}
      #topbar,#homeView,#newsView,.item,.poster-img,.hover-logo,.badge img,.swap{transition:none !important}
      .cal-dd.is-open .cal-menu{animation:none !important}
      #calMonthWrap.cal-out-left .cal-month,
      #calMonthWrap.cal-in-right .cal-month,
      #calMonthWrap.cal-out-right .cal-month,
      #calMonthWrap.cal-in-left .cal-month{animation:none !important}
      .cal-detail.is-anim,.cal-day.is-pop,#calYearText.is-flip{animation:none !important}
   }

 /* ========================= /anasayfa2 TAKVİM CSS ========================= */


/* === Takvim kartları (çakışma önleyici) === */
.hero-panels .tkev-card{
  flex: 0 0 150px;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.06);
  text-decoration:none;
  color: inherit;
  align-items:flex-start;
}
.hero-panels .tkev-card:hover{ background: rgba(255,255,255,.09); }
.hero-panels .tkev-poster{
  width: 100%;
  height: 190px;
  border-radius: 12px;
  overflow:hidden;
  background: rgba(255,255,255,.08);
}
.hero-panels .tkev-poster img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
.hero-panels .tkev-meta{ width:100%; min-width:0; }
.hero-panels .tkev-name{
  font-weight:800;
  font-size: 13px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.hero-panels .tkev-sub{
  margin-top:4px;
  font-size:12px;
  opacity:.75;
  line-height:1.2;
  max-height: 28px;
  overflow:hidden;
}


/* === Takvim panelleri kesin ölçü (global css çakışmalarına karşı) === */
/* Kutucuk genişliğini ve yüksekliğini artırıyoruz */
.hero-panels .hero-panel-body > a {
  flex: 0 0 140px !important;
  width: 140px !important;
  max-width: 140px !important;
  max-height: 170px !important;
}
.hero-panels .tkev-card { flex: 0 0 140px !important; width: 140px !important; max-width: 140px !important; }

/* Resim yüksekliğini artırıyoruz */
.hero-panels .tkev-poster { height: 112px !important; }

.hero-panels .tkev-poster img{ max-width:100% !important; }


/* === Takvim panelleri: poster + yazı görünsün, panel içerik kadar daralsın === */
.hero-panels .hero-panel{ width: fit-content !important; max-width: 520px !important; min-width: 260px !important; height: 190px !important; }
.hero-panels .hero-panel-body{ max-height: none !important; align-items:flex-start !important; }
.hero-panels .tkev-poster{ height: 96px !important; }


.hero-panels .tkev-poster{display:flex !important;align-items:center !important;justify-content:center !important;background:rgba(255,255,255,.06) !important;}
.hero-panels .tkev-poster img{object-fit:contain !important;}

.goto{
  width: 88px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: var(--text);
  outline: none;
}

/* === BAKANLIK PANELİ (DASHBOARD) EKLENTİSİ === */
.dash-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: -100px;
  margin-bottom: 36px;
  text-align: left;
}
@media(max-width: 980px) {
  .dash-grid { grid-template-columns: 1fr; gap: 14px; }
}
.dash-panel {
  background: var(--glass);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
}
.dash-head {
  font-weight: 900;
  font-size: 15px;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 8px;
}
.dash-head i { color: var(--b1); }
.dash-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  max-height: 250px; /* Kaydırma için sınır koyduk */
  overflow-y: auto;  /* Taşanlar için scroll çıkar */
  padding-right: 5px; /* Kaydırma çubuğuna nefes payı */
}

/* Şık bir kaydırma çubuğu tasarımı */
.dash-body::-webkit-scrollbar { width: 6px; }
.dash-body::-webkit-scrollbar-track { background: transparent; }
.dash-body::-webkit-scrollbar-thumb { 
  background: rgba(255,255,255,.15); 
  border-radius: 10px; 
}
.dash-body::-webkit-scrollbar-thumb:hover { 
  background: rgba(99,102,241,.5); 
}

.dash-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  border-radius: 12px;
  background: rgba(128,128,128,.04);
  border: 1px solid transparent;
  transition: .2s;
  text-decoration: none;
  color: inherit;
}
.dash-row:hover {
  background: rgba(128,128,128,.08);
  border-color: var(--line);
  transform: translateY(-2px);
}
.dash-row img {
  width: 50px;
  height: 50px;
  border-radius: 10px;
  object-fit: cover;
  background: rgba(0,0,0,.2);
}
.dash-info { min-width: 0; flex: 1; }
.dash-title {
  font-weight: 900;
  font-size: 14px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.dash-sub {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  margin-top: 2px;
}
.dash-guest {
  text-align: center;
  padding: 10px;
  color: var(--muted);
  font-size: 13px;
  margin: auto 0;
}
.dash-guest i {
  font-size: 24px;
  margin-bottom: 10px;
  opacity: .5;
}
.dash-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(236,72,153,.15);
  color: #ec4899;
  font-size: 10px;
  font-weight: 900;
  margin-left: auto;
}

/* === ANA SAYFA MOBİL HEADER (TOPBAR PILL) TAŞMA ÇÖZÜMÜ === */
@media (max-width: 650px) {
    /* Ana kapsayıcı kenar boşluklarını daralt */
    .topbar__wrap { 
        padding: 0 5px !important; 
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* İçinde butonların olduğu siyah hap şeklindeki kutu */
    .topbar__pill {
        width: 100% !important;
        max-width: 100vw !important;
        box-sizing: border-box !important;
        padding: 6px 8px !important;
        gap: 6px !important;
    }
    
    /* Arama kutusuna "ne kadar yer kaldıysa sadece onu kullan, taşma" diyoruz */
    .topbar__pill .search {
        flex: 1 1 auto !important; 
        min-width: 0 !important; 
    }
    .topbar__pill .search input {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        padding: 8px 12px !important; 
        font-size: 13px !important;
    }
    
    /* Butonları mobilde sıkıştırıyoruz ki ekrana sığsınlar */
    .topbar__pill .actions {
        flex: 0 0 auto !important; 
        gap: 4px !important; 
    }
    
    /* Yuvarlak butonların iç boşlukları */
    .topbar__pill .actions .btn {
        padding: 6px 8px !important; 
    }
    
    /* Profil butonunun içindeki gereksiz boşlukları alıyoruz */
    .topbar__pill .actions a[href="/profil"] {
        padding: 4px !important;
    }
    .topbar__pill .actions .hide-sm {
        display: none !important;
    }
}

/* --- MOBİL TAKVİM SCROLL VE EKRANA SIĞMAMA KESİN ÇÖZÜMÜ --- */
@media (max-width: 768px) {
    .cal-dd .cal-menu {
        position: fixed !important;
        top: 75px !important;
        left: 0 !important;
        right: 0 !important;
        margin: 0 auto !important;
        width: 96vw !important;
        max-width: 420px !important;
        transform-origin: 50% 0% !important;
        z-index: 9999 !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
        max-height: calc(100vh - 90px) !important; 
        overflow-y: auto !important; 
        
        /* İŞTE ÇÖZÜM 1: Üst boşluğu sıfırladık ki günler yukarı sızmasın */
        padding: 0 12px 20px 12px !important; 
    }
    
    /* İŞTE ÇÖZÜM 2: Başlığı (Header) en üste çivile ve arkasına beton dök */
    .cal-head { 
        position: sticky !important;
        top: 0 !important;
        padding-top: 12px !important; /* Menüden kestiğimiz boşluğu başlığa verdik */
        background: #0c0c0c !important; /* Karanlık mod için katı arka plan */
        z-index: 999 !important; /* Kesinlikle günlerin üstünde kalsın */
        gap: 4px !important; 
    }
    /* Aydınlık Mod için katı beyaz arka plan */
    body.light-mode .cal-head, [data-theme="light"] .cal-head {
        background: #ffffff !important;
    }

    /* Üst Menüdeki Tuşların Daraltılması */
    .cal-nav, .cal-close { width: 32px !important; height: 32px !important; flex: 0 0 32px !important; }
    .cal-year__num { font-size: 15px !important; }
    .cal-year__hint { font-size: 10px !important; white-space: normal !important; }
    .cal-jump { margin-top: 6px !important; }
    .cal-jump input { width: 110px !important; padding: 4px 8px !important; font-size: 11px !important; }
    .cal-jumpbtn { padding: 4px 10px !important; font-size: 11px !important; }

    /* Takvim içindeki günleri daraltıyoruz */
    .cal-dow, .cal-days { gap: 4px !important; }
    .cal-day { border-radius: 8px !important; font-size: 11px !important; }

    /* En Alttaki Özel Takvim (Detay) Kutusunun Taşmasını Engelleyen Kodlar */
    .cal-detail {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        padding: 10px !important;
    }
    .cal-detail * { white-space: normal !important; word-wrap: break-word !important; }
    .cal-detail a, .cal-detail .calRow, .cal-detail .dash-row { 
        max-width: 100% !important; box-sizing: border-box !important; overflow: hidden !important; align-items: center !important; 
    }
    .cal-detail img { max-width: 60px !important; height: auto !important; flex-shrink: 0 !important; }
    .cal-detail div { min-width: 0 !important; }
}
/* === ALT TÜR MENÜSÜ "YAZI KAYBOLMA VE YIRTILMA" KESİN ÇÖZÜMÜ === */
@media (max-width: 850px) {
    .dd-menu {
        /* Menüyü dümdüz, beton gibi ekrana sabitle (Hata payı 0) */
        position: absolute !important;
        top: calc(100% + 5px) !important;
        right: 0 !important;
        left: auto !important;
        
        /* İŞTE ÇÖZÜM: Kutunun genişliğini çivi gibi sabitliyoruz ki içine çökmesin! */
        width: 250px !important; 
        max-width: 85vw !important; 
        
        /* Şeffaflık bug'ını yok et, beton dök */
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: #141416 !important; 
        z-index: 9999 !important;
    }
    
    /* Aydınlık mod için bembeyaz arka plan */
    body.light-mode .dd-menu, [data-theme="light"] .dd-menu {
        background: #ffffff !important;
        border: 1px solid #ccc !important;
    }

    /* İçeriklerin birbirine girmesini engelle */
    .dd-item {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        padding: 10px 12px !important;
        box-sizing: border-box !important;
    }

    /* Yazıların bulunduğu sol kısım */
    .dd-left {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        flex: 1 !important; /* "Kalan tüm boşluğu sen al" diyoruz */
        min-width: 0 !important; 
    }

    /* Yazılar çökmesin, uzunsa nokta nokta (...) olsun */
    .dd-name {
        display: block !important;
        white-space: nowrap !important; 
        overflow: hidden !important;
        text-overflow: ellipsis !important; 
        text-align: left !important;
        font-size: 14px !important;
    }
}
.poster-ribbon {
  position: absolute;
  top: 10px;
  left: -6px;
  /* Dışarıdan renk gelirse onu kullan, gelmezse varsayılan kırmızı yap */
  background: var(--ribbon-bg, linear-gradient(135deg, #ff4757, #ff6b81));
  color: #fff;
  padding: 4px 10px;
  font-weight: 900;
  font-size: 11px;
  letter-spacing: 0.5px;
  border-radius: 0 6px 6px 0;
  box-shadow: 0 4px 10px rgba(0,0,0, 0.4);
  z-index: 10;
  pointer-events: none;
  transition: background 0.4s ease; /* Renk değişirken yumuşak geçiş */
}
.poster-ribbon::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  /* Katlanma gölgesi için dışarıdan koyu renk bekle */
  border-top: 6px solid var(--ribbon-fold, #c0392b);
  border-left: 6px solid transparent;
  transition: border-top-color 0.4s ease;
}

/* === DURUM KURDELESİ (RENKLİ & HAREKETLİ) === */
.status-ribbon {
  position: absolute;
  right: -6px;
  color: #fff;
  padding: 5px 12px;
  font-weight: 900;
  font-size: 11px;
  letter-spacing: 0.5px;
  border-radius: 6px 0 0 6px;
  z-index: 10;
  pointer-events: none;
  overflow: hidden;
  animation: floatingStatus 3s ease-in-out infinite;
  will-change: transform;
}

/* 1. YENİ BÖLÜM (YEŞİL) */
.status-ribbon.yeni-bolum {
  background: linear-gradient(135deg, #10b981, #059669);
  box-shadow: 0 4px 10px rgba(0,0,0, 0.5), 0 0 14px rgba(16, 185, 129, 0.4);
}
.status-ribbon.yeni-bolum::after { border-top: 6px solid #047857; border-right: 6px solid transparent; }

/* 2. YENİ DİZİ (PEMBE) */
.status-ribbon.yeni-dizi {
  background: linear-gradient(135deg, #ff4757, #ff6b81);
  box-shadow: 0 4px 10px rgba(0,0,0, 0.5), 0 0 14px rgba(255, 71, 87, 0.5);
}
.status-ribbon.yeni-dizi::after { border-top: 6px solid #be123c; border-right: 6px solid transparent; }

/* 3. YENİ FİLM (TURUNCU/AMBER) */
.status-ribbon.yeni-film {
  background: linear-gradient(135deg, #f39c12, #e67e22);
  box-shadow: 0 4px 10px rgba(0,0,0, 0.5), 0 0 14px rgba(243, 156, 18, 0.5);
}
.status-ribbon.yeni-film::after { border-top: 6px solid #a35d14; border-right: 6px solid transparent; }

/* ORTAK ANİMASYONLAR */
@keyframes floatingStatus {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

.status-ribbon::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
  transform: skewX(-25deg);
  animation: shineStatus 4s infinite;
}

@keyframes shineStatus {
  0% { left: -100%; }
  15% { left: 200%; }
  100% { left: 200%; }
}

/* Katlanma gölgesinin ortak yerleşimi */
.status-ribbon::after {
  content: '';
  position: absolute;
  bottom: -6px;
  right: 0;
}

/* === SABİTLENMİŞ (PINNED) LOGOSU === */
.pin-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 46px;
  height: 46px;
  background: rgba(0, 0, 0, 0.65); /* Hafif karartılmış arka plan */
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  z-index: 20;
  pointer-events: none;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 8px 16px rgba(0,0,0,0.6);
}

                     
 /* ÇOKLU KANAL SLAYT ANİMASYONLARI */
@keyframes slaytFade_2 { 0%, 40% { opacity: 1; z-index: 2; } 50%, 100% { opacity: 0; z-index: 1; } }
@keyframes slaytFade_3 { 0%, 26.66% { opacity: 1; z-index: 2; } 33.33%, 100% { opacity: 0; z-index: 1; } }
@keyframes slaytFade_4 { 0%, 20% { opacity: 1; z-index: 2; } 25%, 100% { opacity: 0; z-index: 1; } }
@keyframes slaytFade_5 { 0%, 16% { opacity: 1; z-index: 2; } 20%, 100% { opacity: 0; z-index: 1; } }