/* KLIPNORA — "Gece mavisi + turuncu" teması (sinyal.tinpul.com tarzı): derin lacivert, ince ızgara ve parıltı, cam kartlar, hap düğmeler.
   style.css'ten SONRA yüklenir; yalnız değişkenleri ve bileşen görünümünü ezer. Açık/koyu geçişi ve erişilebilirlik (odak halkası, azaltılmış hareket) korunur. */
:root:not([data-theme]),[data-theme=dark]{
  color-scheme:dark;
  --bg:#070b14;--bg-2:#0a1020;--surface:#0e1628;--surface-2:#131d34;--surface-3:#1b2744;--field:#0a1222;
  --ink:#e8edf7;--ink-2:#c5cee0;--muted:#8d9bb5;--faint:#62708c;
  --line:rgba(120,150,215,.14);--line-2:rgba(140,170,235,.26);
  --glow-1:rgba(255,138,61,.13);--glow-2:rgba(59,110,255,.12);
  --accent:#ff8a3d;--accent-2:#ff5a36;--accent-ink:#1d0c02;--accent-soft:rgba(255,138,61,.13);--accent-line:rgba(255,138,61,.42);
  --focus:rgba(255,160,90,.6);--cyan:#35d4e8;--glass:rgba(12,20,38,.66);
  --shadow:0 1px 0 rgba(255,255,255,.045) inset,0 12px 32px -14px rgba(0,0,0,.7);
}
[data-theme=light]{
  --bg:#f3f5fb;--bg-2:#eaeef7;--surface:#ffffff;--surface-2:#f1f4fb;--surface-3:#e5eaf5;--field:#ffffff;--glass:rgba(255,255,255,.82);--cyan:#0a8ea0;
  --line:rgba(30,50,100,.11);--line-2:rgba(30,50,100,.2);
  --glow-1:rgba(255,138,61,.16);--glow-2:rgba(59,110,255,.10);
}
body{background:radial-gradient(1100px 560px at 50% -8%,var(--glow-2),transparent 62%),radial-gradient(800px 420px at 90% 8%,var(--glow-1),transparent 65%),var(--bg);background-attachment:fixed}
/* ince ızgara */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(120,160,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(120,160,255,.055) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(900px 520px at 50% 0,#000,transparent 78%);mask-image:radial-gradient(900px 520px at 50% 0,#000,transparent 78%)}
[data-theme=light] body::before{opacity:.5;background-image:linear-gradient(rgba(40,70,140,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(40,70,140,.06) 1px,transparent 1px)}
.shell{background:transparent}.sidebar{background:linear-gradient(180deg,rgba(10,16,32,.92),rgba(7,11,20,.96));backdrop-filter:blur(12px)}
[data-theme=light] .sidebar{background:rgba(255,255,255,.88)}
.topbar{background:rgba(7,11,20,.72);border-bottom:1px solid var(--line);box-shadow:0 10px 28px rgba(0,0,0,.22)}
[data-theme=light] .topbar{background:rgba(255,255,255,.8);box-shadow:none}

/* cam kartlar */
.card,.tile,.setting,.feat,.step,.plan,details,.card.flat{background:var(--glass);border:1px solid var(--line);border-radius:16px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow)}
.card.flat{background:color-mix(in srgb,var(--surface-2) 70%,transparent);box-shadow:none}
.card{position:relative}
.card::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;opacity:.55;background:linear-gradient(var(--accent),var(--accent)) top left/14px 2px,linear-gradient(var(--accent),var(--accent)) top left/2px 14px,linear-gradient(var(--accent),var(--accent)) bottom right/14px 2px,linear-gradient(var(--accent),var(--accent)) bottom right/2px 14px;background-repeat:no-repeat}
.card.flat::after,.card .card::after{display:none}
.tile:hover,.feat:hover{border-color:var(--accent-line);transform:translateY(-2px)}.tile,.feat{transition:border-color .2s,transform .2s}
.tile .num{font-variant-numeric:tabular-nums}

/* hap düğmeler */
.btn{border-radius:999px;background:rgba(19,29,52,.7);border-color:var(--line-2)}
[data-theme=light] .btn{background:#fff}
.btn.sm{border-radius:999px}.btn.lg{border-radius:999px;min-height:50px}.btn.icon{border-radius:50%}
.btn.primary{background:linear-gradient(180deg,#ffa05a,var(--accent-2));color:#fff;border:1px solid rgba(255,200,160,.45);text-shadow:0 1px 0 rgba(120,30,0,.35);box-shadow:0 10px 26px -8px rgba(255,110,50,.65),0 1px 0 rgba(255,255,255,.25) inset}
.btn.primary:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 14px 32px -8px rgba(255,110,50,.8),0 1px 0 rgba(255,255,255,.3) inset}
.btn.ghost{background:transparent;border-color:transparent}
.badge{border-radius:999px}
input,select,textarea{background:var(--field);border-radius:12px}

/* sayfa başlığı şeridi */
.page-head{background:var(--glass);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:14px;padding:14px 18px;margin-bottom:var(--space-5);backdrop-filter:blur(10px)}
.page-head h1{margin:0}

/* kayan şerit */
.tick{overflow:hidden;border-bottom:1px solid var(--line);background:rgba(6,10,18,.78)}
[data-theme=light] .tick{background:rgba(255,255,255,.8)}
.tick-in{display:flex;gap:44px;width:max-content;padding:9px 0;animation:tk 46s linear infinite;font-size:.8rem;font-weight:600;color:var(--muted);white-space:nowrap}
.tick-in span b{color:var(--accent);margin-right:6px;letter-spacing:.04em}.tick:hover .tick-in{animation-play-state:paused}
@keyframes tk{to{transform:translateX(-50%)}}
.ann{background:linear-gradient(90deg,#0a1426,#10192e 50%,#0a1426);border-bottom:1px solid var(--line);text-align:center;padding:7px 12px;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#ffd2b0}
.ann span{text-shadow:0 0 12px rgba(255,138,61,.5)}.ann a{color:#fff;border-bottom:1px dashed rgba(255,210,176,.5)}
[data-theme=light] .ann{background:#fff4ea;color:#9a4a10}
.app-tick{margin:0 calc(var(--space-6)*-1) var(--space-5);border-top:1px solid var(--line)}

/* herkese açık gezinme + hero */
.pub-nav{background:rgba(9,14,26,.82);backdrop-filter:blur(12px);box-shadow:0 10px 28px rgba(0,0,0,.28)}
[data-theme=light] .pub-nav{background:rgba(255,255,255,.86);box-shadow:none}
.brand img{border-radius:9px;box-shadow:0 0 0 1px var(--line-2),0 0 18px var(--accent-soft)}
.hero{position:relative}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(120,160,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(120,160,255,.06) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(640px 340px at 35% 25%,#000,transparent 75%);mask-image:radial-gradient(640px 340px at 35% 25%,#000,transparent 75%)}
.hero>*{position:relative}
.hero h1{font-weight:800;letter-spacing:-.035em}
.grad{background:linear-gradient(90deg,#ffb066,#ff5a36 60%,#ff7ab0);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .eyebrow,.eyebrow-s{border:1px solid var(--accent-line);background:var(--accent-soft);color:#ffd9bd;border-radius:999px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;font-size:.72rem}
[data-theme=light] .hero .eyebrow{color:#a04a0c}
.live-card{background:var(--glass);border:1px solid var(--line-2);border-radius:20px;padding:22px;box-shadow:var(--shadow),0 30px 70px -30px rgba(255,110,50,.4);backdrop-filter:blur(12px)}
.live-card h3{margin:0 0 4px}.flow{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.flow .st{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02)}
.flow .st .n{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--accent);font-weight:800;font-size:.8rem}
.flow .st b{display:block;font-size:.9rem}.flow .st span.d{color:var(--muted);font-size:.78rem}
.flow .st.on{border-color:var(--accent-line);box-shadow:0 0 24px -10px var(--accent)}
.stats-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;max-width:1160px;margin:0 auto 8px;padding:0 var(--space-5)}
.stats-strip .tile .num{background:linear-gradient(90deg,#ffb066,#ff5a36);-webkit-background-clip:text;background-clip:text;color:transparent}

/* abonelik kartı: büyük "X gün kaldı", geri sayım kutuları, VIP AKTİF */
.subcard{position:relative;overflow:hidden;border-radius:20px;padding:22px;border:1px solid var(--accent-line);background:linear-gradient(160deg,rgba(255,138,61,.12),rgba(14,22,40,.75) 55%);box-shadow:var(--shadow),0 24px 60px -30px rgba(255,110,50,.55)}
[data-theme=light] .subcard{background:linear-gradient(160deg,#fff1e4,#fff 60%)}
.subcard .top-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.vip{display:inline-flex;align-items:center;gap:7px;padding:5px 13px;border-radius:999px;font-weight:800;font-size:.72rem;letter-spacing:.14em;color:#1d0c02;background:linear-gradient(90deg,#ffd27a,#ff9a45);box-shadow:0 0 22px -4px rgba(255,170,70,.8)}
.vip.off{background:var(--surface-3);color:var(--muted);box-shadow:none}
.vip::before{content:"";width:7px;height:7px;border-radius:50%;background:#1d0c02;opacity:.7}
.days-left{font:800 clamp(2.4rem,7vw,3.6rem)/1 var(--font-display);letter-spacing:-.04em;margin:14px 0 4px}.days-left small{font-size:.38em;font-weight:700;color:var(--muted);letter-spacing:0;margin-left:8px}
.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}
.countdown div{text-align:center;padding:12px 4px;border:1px solid var(--line-2);border-radius:14px;background:rgba(6,10,18,.55)}
[data-theme=light] .countdown div{background:#fff}
.countdown b{display:block;font:800 1.7rem/1.1 var(--font-display);font-variant-numeric:tabular-nums;color:var(--accent)}.countdown span{font-size:.64rem;letter-spacing:.16em;color:var(--muted);font-weight:700}
.quota-bars{display:grid;gap:10px;margin-top:10px}.qbar{display:grid;gap:5px}.qbar .lab{display:flex;justify-content:space-between;font-size:.78rem;color:var(--ink-2)}
.qbar .track{height:7px;border-radius:99px;background:var(--surface-3);overflow:hidden}.qbar .fill{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--accent-2));box-shadow:0 0 12px var(--accent)}

/* Telegram kartı */
.tgcard{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:18px;border-radius:18px;border:1px solid var(--line-2);background:linear-gradient(160deg,rgba(34,158,217,.13),rgba(14,22,40,.7) 60%)}
[data-theme=light] .tgcard{background:linear-gradient(160deg,#e6f5fd,#fff 60%)}
.tgcard .tg-ico{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#229ed9;color:#fff;box-shadow:0 0 24px -6px #229ed9}
.tgcard .meta{flex:1;min-width:150px}.tgcard .meta b{display:block}.tgcard .meta span{color:var(--muted);font-size:.84rem}
.pill-ok{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;font-size:.7rem;font-weight:800;letter-spacing:.12em;color:#0a2a1b;background:linear-gradient(90deg,#5eeaa8,#2fc77f);box-shadow:0 0 18px -4px rgba(60,220,140,.7)}
.pill-off{display:inline-flex;padding:4px 11px;border-radius:999px;font-size:.7rem;font-weight:800;letter-spacing:.12em;color:var(--muted);background:var(--surface-3)}
.prefs{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;margin-top:12px}
.pref{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02);font-size:.88rem}
.switch{position:relative;width:42px;height:24px;flex:none;border-radius:99px;border:1px solid var(--line-2);background:var(--surface-3);cursor:pointer;padding:0;transition:background .15s}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s}
.switch[aria-checked=true]{background:linear-gradient(90deg,var(--accent),var(--accent-2));border-color:transparent}.switch[aria-checked=true]::after{transform:translateX(18px)}

/* zaman çizelgesi (kullanıcı + yönetici) */
.tl-head{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.seg{display:inline-flex;border:1px solid var(--line-2);border-radius:999px;padding:3px;background:var(--glass)}.seg button{border:0;background:transparent;color:var(--ink-2);padding:6px 16px;border-radius:999px;font:600 .82rem var(--font);cursor:pointer}.seg button[aria-pressed=true]{background:linear-gradient(180deg,#ffa05a,var(--accent-2));color:#fff}
.tl{position:relative;display:flex;flex-direction:column;gap:0;margin:8px 0 0;padding-left:18px;border-left:2px solid var(--line-2)}
.tl .ev{position:relative;display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;padding:10px 12px;margin:0 0 8px 8px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02)}
.tl .ev::before{content:"";position:absolute;left:-28px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--surface-3);border:2px solid var(--line-2)}
.tl .ev.generate::before{background:var(--cyan)}.tl .ev.main::before{background:var(--accent);box-shadow:0 0 12px var(--accent)}.tl .ev.short::before{background:#ff7ab0}
.tl .ev.past{opacity:.55}.tl .ev.now{border-color:var(--accent-line);box-shadow:0 0 22px -10px var(--accent)}
.tl .tm{font:700 .95rem var(--mono);color:var(--ink)}.tl .ev b{display:block;font-size:.88rem}.tl .ev small{color:var(--muted)}
.tl .ev .bar{height:5px;border-radius:99px;background:var(--surface-3);margin-top:5px;overflow:hidden}.tl .ev .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--accent))}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.76rem;color:var(--muted)}.legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
.gauge{display:flex;flex-direction:column;gap:4px;min-width:130px}.gauge .track{height:8px;border-radius:99px;background:var(--surface-3);overflow:hidden}.gauge .track i{display:block;height:100%;background:linear-gradient(90deg,var(--ok),var(--warn))}
.lane{display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:10px;align-items:start;padding:10px 0;border-bottom:1px solid var(--line)}.lane:last-child{border:0}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{display:inline-flex;gap:6px;align-items:center;padding:3px 10px;border-radius:999px;border:1px solid var(--line-2);font-size:.74rem;background:rgba(255,255,255,.02)}
.chip.generate{border-color:rgba(53,212,232,.5)}.chip.main{border-color:var(--accent-line);color:#ffd9bd}.chip.short{border-color:rgba(255,122,176,.5)}
[data-theme=light] .chip.main{color:#9a4a10}

/* mobil alt gezinme: Panel, Canlı, Şarkılar, Plan, Menü */
.bnav{display:none}
@media (max-width:900px){
  .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;z-index:120;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));padding:6px;border-radius:22px;border:1px solid var(--line-2);background:rgba(9,14,26,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 18px 40px -10px rgba(0,0,0,.7)}
  [data-theme=light] .bnav{background:rgba(255,255,255,.92)}
  .bnav a,.bnav button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px;border:0;background:transparent;color:var(--muted);font:600 .64rem var(--font);border-radius:16px;text-decoration:none;cursor:pointer;min-height:48px}
  .bnav a[aria-current=page]{color:#fff;background:linear-gradient(180deg,rgba(255,138,61,.28),rgba(255,90,54,.12));box-shadow:0 0 18px -6px var(--accent)}
  [data-theme=light] .bnav a[aria-current=page]{color:#b24a07}
  .bnav a[aria-current=page] .ico{color:var(--accent)}
  .content{padding-bottom:110px!important}.app-tick{margin:0 calc(var(--space-4)*-1) var(--space-4)}
  .tl .ev{grid-template-columns:54px 1fr}.tl .ev .st-b{grid-column:2}
  .lane{grid-template-columns:1fr}
  .stats-strip{padding:0 var(--space-4)}
}
@media (prefers-reduced-motion:reduce){.tick-in{animation:none}.tile:hover,.feat:hover,.btn.primary:hover{transform:none}}
@media (forced-colors:active){.btn.primary,.vip,.pill-ok{border:1px solid ButtonText}}
.tl{list-style:none}
.tl-head{margin-bottom:var(--space-4);justify-content:space-between}

@media (max-width:560px){.grid-sm{grid-template-columns:repeat(2,minmax(0,1fr))}.tile{padding:var(--space-3) var(--space-4)}.countdown b{font-size:1.45rem}}