:root{
  --bg:#0b0e1a; --bg2:#121830; --card:#161d38; --line:#28325c;
  --text:#eef1fa; --muted:#93a0c2; --accent:#6d5cff; --accent2:#4f8cff;
  --green:#2de08e; --red:#ff5d6c; --amber:#ffb648;
  --mor:#a855f7; --pembe:#ff5c8a; --cam:#22d3ee; --turuncu:#fb923c;
  --grad:linear-gradient(135deg,#6d5cff,#4f8cff);
}
*{box-sizing:border-box}
/* yatay taşmayı kes (mobilde sağda boşluk kalmasın) — clip, sticky'yi bozmaz */
html{overflow-x:clip}
body{
  margin:0; background:var(--bg); color:var(--text);
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  min-height:100vh; display:flex; flex-direction:column;
  overflow-x:clip; max-width:100%;
}
/* tüm sayfalarda sabit uzay/şehir-ışıkları arka planı */
body::before{
  content:""; position:fixed; inset:0; z-index:-2;
  background:#05070f url("bg.svg") center center / cover no-repeat;
}
body::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(ellipse at 50% 0%, rgba(109,92,255,.10), transparent 55%);
}
/* içerik arka planları hafif saydam olsun ki arka plan hissedilsin */
.nav{backdrop-filter:blur(6px)}
.card, .stat{background:rgba(22,29,56,.82); backdrop-filter:blur(4px)}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px}
.small{font-size:12.5px}
.muted{color:var(--muted)}
.center{text-align:center}
.right{text-align:right}

/* nav */
.nav{background:var(--bg2); border-bottom:1px solid var(--line)}
.nav-inner{max-width:1100px; margin:0 auto; padding:12px 20px; display:flex; align-items:center; justify-content:space-between}
.brand{font-size:25px; font-weight:800; color:var(--text); display:inline-flex; letter-spacing:.01em}
.brand:hover{text-decoration:none}
.brand .bh{
  display:inline-block; font-style:normal;
  animation:marka-dalga 2.8s ease-in-out infinite;
  animation-delay:calc(var(--i) * .09s);
}
.brand .bh.renk{
  background:linear-gradient(120deg, var(--accent), var(--cam));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
/* "By Ayaz" imzası — "Bot" gibi mavi (renk sınıfı), AYNI boyut; dalga buradan başlar */
.brand .by-ayaz{display:inline-flex; align-items:center; margin-right:8px}
.brand .by-ara{width:7px; display:inline-block}
@keyframes marka-dalga{
  0%, 52%, 100%{transform:translateY(0) scale(1)}
  60%{transform:translateY(-6px) scale(1.28)}
  68%{transform:translateY(0) scale(1)}
}
.nav-links{display:flex; align-items:center; gap:16px}
.nav-links a{color:var(--text)}
.nav-user{color:var(--muted)}
/* mobil: nav linkleri taşmasın, alt satıra sarsın ve ortalansın */
@media(max-width:760px){
  .nav-inner{flex-wrap:wrap; justify-content:center; gap:6px 14px; padding:10px 14px}
  .nav-links{flex-wrap:wrap; justify-content:center; gap:6px 14px; width:100%}
  .brand{font-size:22px}
}

/* layout */
.container{max-width:1100px; margin:0 auto; padding:24px 20px; width:100%; flex:1}
@media(max-width:600px){.container{padding:18px 14px}}
.page-head{margin-bottom:18px}
.page-head h1{margin:0 0 2px; font-size:24px}
.page-head p{margin:0}
.grid{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:18px}
@media(max-width:800px){.grid{grid-template-columns:1fr}}

/* cards */
.card{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px; margin-bottom:18px}
.card h2{margin:0 0 12px; font-size:17px}
.auth-card{max-width:440px; margin:40px auto}
.auth-card h1{margin:0 0 4px; font-size:22px}

/* forms */
label{display:block; margin:12px 0 0; font-size:13.5px; color:var(--muted)}
input,select{
  width:100%; margin-top:5px; padding:10px 12px; border-radius:9px;
  border:1px solid var(--line); background:var(--bg2); color:var(--text); font-size:14.5px;
}
input:focus,select:focus{outline:none; border-color:var(--accent)}
input[readonly]{color:var(--muted)}
/* tarayıcı otomatik doldurunca kutu beyazlaşmasın, koyu tema korunsun */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--text);
  -webkit-box-shadow:0 0 0 1000px var(--bg2) inset;
  box-shadow:0 0 0 1000px var(--bg2) inset;
  caret-color:var(--text);
  transition:background-color 9999s ease-in-out 0s;
}
/* SMS doğrulama kodu kutusu */
.otp-kutu{
  font-size:30px !important; letter-spacing:.42em; text-align:center;
  padding:14px 10px !important; font-weight:800;
}
/* ülke kodu + telefon satırı */
.tel-satir{display:flex; gap:8px; margin-top:5px; align-items:stretch}
.tel-satir .ulke-sec{width:auto; min-width:112px; flex-shrink:0; margin-top:0}
.tel-satir > input[name="telefon"]{margin-top:0; flex:1; min-width:0}

/* SVG bayraklı ülke seçici (native select resim gösteremiyor) */
.bayrak-img{width:22px; height:15px; object-fit:cover; border-radius:2px;
  box-shadow:0 0 0 1px rgba(255,255,255,.10); display:inline-block; vertical-align:middle; flex-shrink:0}
.bayrak-mini{width:17px; height:12px; margin-right:3px; position:relative; top:-1px}
.ulke-dd{position:relative; flex-shrink:0}
.ulke-dd-btn{display:flex; align-items:center; gap:7px; height:100%; min-height:42px;
  padding:0 11px; border:1px solid var(--line); background:var(--bg2); color:var(--text);
  border-radius:10px; cursor:pointer; font-size:14.5px; white-space:nowrap}
.ulke-dd-btn:hover{border-color:var(--accent)}
.ulke-dd-btn .ulke-dd-kod{font-weight:600}
.ulke-dd-ok{color:var(--muted); font-size:11px; margin-left:1px}
.ulke-dd-panel{position:absolute; top:calc(100% + 6px); left:0; z-index:40;
  width:300px; max-width:78vw; background:var(--card); border:1px solid var(--line);
  border-radius:12px; box-shadow:0 18px 40px rgba(0,0,0,.45); padding:8px; overflow:hidden}
.ulke-dd-ara{width:100%; margin:0 0 6px; padding:9px 11px; font-size:14px}
.ulke-dd-liste, .ulke-dd-liste li{list-style:none !important; margin:0; padding:0}
.ulke-dd-liste{max-height:280px; overflow-y:auto}
.ulke-dd-opt{display:flex; align-items:center; gap:10px; padding:8px 9px; border-radius:8px;
  cursor:pointer; font-size:14px}
.ulke-dd-opt:hover{background:var(--bg2)}
.ulke-dd-opt .ulke-dd-ad{flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ulke-dd-opt .ulke-dd-kod{font-size:13px}

.row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media(max-width:520px){.row2{grid-template-columns:1fr}}

/* Manuel İşlem Merkezi */
.islem-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start}
@media(max-width:820px){.islem-grid{grid-template-columns:1fr}}
.secim-grup{display:flex; gap:8px; margin-top:5px; flex-wrap:wrap}
.secim-grup input{position:absolute; opacity:0; width:0; height:0}
.secim{flex:1; min-width:140px; text-align:center; padding:11px 12px; border:1px solid var(--line);
  border-radius:10px; background:var(--bg2); color:var(--text); cursor:pointer; font-size:14px; margin:0}
.secim-grup input:checked + .secim{border-color:var(--accent); background:rgba(109,92,255,.16); font-weight:700}
.secim-grup input#yon-long:checked + .secim.long{border-color:#22c55e; background:rgba(34,197,94,.16); color:#7ef0a8}
.secim-grup input#yon-short:checked + .secim.short{border-color:#ef4444; background:rgba(239,68,68,.16); color:#ffb0b0}
.secim-grup input:focus-visible + .secim{outline:2px solid var(--accent); outline-offset:1px}
.rozet-grup{display:flex; flex-wrap:wrap; gap:6px; margin-top:6px}
.mini-rozet{font-size:12px; padding:3px 8px; border-radius:99px; background:var(--bg2);
  border:1px solid var(--line); color:var(--muted)}
.tablo-sar{overflow-x:auto}
.badge.manuel{background:#241a33; color:#c3a6ff}
.badge.bekle{background:#2a2110; color:#eebf72}
.bekleyen-kutu{border:1px solid #4a3a16; background:rgba(238,191,114,.07); border-radius:10px;
  padding:12px 14px; margin-top:12px}
.bekleyen-satir{display:flex; align-items:center; justify-content:space-between; gap:10px;
  flex-wrap:wrap; padding:7px 0; border-bottom:1px solid var(--line)}
.bekleyen-satir:last-child{border-bottom:0}
.guvenlik-uyari{border:1px solid #7a3b3b; background:rgba(239,68,68,.10); border-radius:12px;
  padding:14px 16px; margin-bottom:18px}
.guvenlik-uyari .gu-baslik{font-weight:700; color:#ffb0b0; margin-bottom:6px}
.guvenlik-uyari ul{margin:6px 0 8px; padding-left:20px}
.guvenlik-uyari li{padding:3px 0; font-size:14px}
.guvenlik-ok{border:1px solid #2a5c3f; background:rgba(45,224,142,.08); border-radius:12px;
  padding:12px 16px; color:#7ef0a8; font-weight:600}
/* Bilgi kutusu — saldırı değil, yapılandırma notu (kırmızı değil, sakin mavi) */
.guvenlik-bilgi{border:1px solid var(--line); background:rgba(109,92,255,.08); border-radius:12px;
  padding:12px 16px; margin-top:10px; font-size:13.5px; color:var(--muted); line-height:1.5}
.guvenlik-bilgi b{color:var(--text)}
.guvenlik-bilgi code{background:var(--bg2); border:1px solid var(--line); border-radius:6px;
  padding:1px 6px; font-size:12.5px}

/* Güvenlik önerileri — küçük, kapalı başlar, tıklayınca açılır (ayarı bozmaz) */
.guvenlik-mini{margin-bottom:14px}
.guvenlik-mini>summary{list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:8px;
  font-size:13px; color:var(--muted); background:var(--bg2); border:1px solid var(--line);
  border-radius:999px; padding:5px 12px; width:fit-content; user-select:none}
.guvenlik-mini>summary::-webkit-details-marker{display:none}
.guvenlik-mini>summary:hover{color:var(--text)}
.guvenlik-mini .gm-nokta{width:8px; height:8px; border-radius:50%; background:#e5a54b;
  box-shadow:0 0 0 3px rgba(229,165,75,.18); flex:0 0 auto}
.guvenlik-mini .gm-ac{color:var(--accent); font-weight:600}
.guvenlik-mini[open] .gm-ac{opacity:.6}
.guvenlik-mini ul{margin:10px 0 8px; padding-left:20px}
.guvenlik-mini li{padding:3px 0; font-size:13.5px; color:var(--muted)}
.guvenlik-mini li b{color:var(--text)}
.guvenlik-mini code{background:var(--bg2); border:1px solid var(--line); border-radius:6px;
  padding:1px 6px; font-size:12.5px}

/* sayfa numaraları (1 2 3 ...) */
.sayfa-no-satir{display:flex; gap:6px; justify-content:center; margin-top:14px; flex-wrap:wrap}
.sayfa-no{min-width:34px; text-align:center; padding:6px 10px; border-radius:8px;
  border:1px solid var(--line); background:var(--bg2); color:var(--text); font-size:13.5px}
.sayfa-no:hover{border-color:var(--accent); text-decoration:none}
.sayfa-no.aktif{background:var(--accent); border-color:var(--accent); color:#fff; font-weight:700}

/* yönetim sekmeleri */
.sekme-bar{display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap}
.sekme{padding:9px 16px; border-radius:10px; border:1px solid var(--line);
  background:var(--bg2); color:var(--muted); cursor:pointer; font-size:14px; font-weight:600}
.sekme:hover{border-color:var(--accent); color:var(--text)}
.sekme.aktif{background:rgba(109,92,255,.16); border-color:var(--accent); color:var(--text)}
.sekme-bar.kucuk .sekme{padding:6px 12px; font-size:13px}

/* buttons */
.btn{
  display:inline-block; margin-top:14px; padding:10px 18px; border-radius:9px; border:0;
  background:var(--grad); color:#fff; font-size:14.5px; font-weight:600; cursor:pointer;
  transition:transform .15s, box-shadow .15s;
}
.btn:hover{transform:translateY(-1px); box-shadow:0 6px 18px rgba(109,92,255,.35); text-decoration:none}
.btn-block{width:100%}
.btn-danger{background:#a83a38}
.btn-danger:hover{background:#8f2f2d}
.btn-ghost{background:transparent; border:1px solid var(--line); color:var(--text)}
.btn-ghost:hover{background:var(--bg2)}
.btn-sm{padding:6px 11px; font-size:13px; margin-top:0}

/* alerts & badges */
.alert{padding:11px 14px; border-radius:10px; margin-bottom:14px; font-size:14px; border:1px solid}
.alert.ok{background:#10241c; border-color:#1d5c41; color:#7fe0b2}
.alert.err{background:#2a1414; border-color:#6e2b2a; color:#ffb0ae}
.alert.test{background:#2a2110; border-color:#6e5321; color:#f0c988}
.badge{display:inline-block; padding:2px 9px; border-radius:99px; font-size:12px; font-weight:600}
.badge.ok{background:#10241c; color:#4ade9a}
.badge.err{background:#2a1414; color:#ff8a87}
.badge.skip{background:#1c2233; color:#9aa6c0}
.badge.test{background:#2a2110; color:#eebf72}
.badge.long{background:#10241c; color:#4ade9a}
.badge.short{background:#2a1414; color:#ff8a87}

/* tables */
.table-wrap{overflow-x:auto}
/* admin üye tablosu: satır altında açılan işlem menüsü */
.islem-detay > td{background:rgba(18,24,48,.55); border-left:3px solid var(--accent)}
.islem-kutu{display:flex; gap:10px; flex-wrap:wrap; align-items:center; padding:4px 2px}
.islem-kutu form{display:inline-flex; gap:6px; align-items:center; margin:0}
.islem-kutu input[name="tutar"]{width:100px; margin:0}
.islem-kutu .btn{margin-top:0}
table{width:100%; border-collapse:collapse; font-size:14px}
th{color:var(--muted); font-size:12.5px; text-transform:uppercase; letter-spacing:.04em}
th,td{padding:9px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle}
tr:last-child td{border-bottom:0}
td.right,th.right{text-align:right}
.actions{white-space:nowrap}
.actions form{display:inline-block; margin-left:6px}

/* canlı akış kilit kartı */
.kilit-kart{padding:34px 20px}
.kilit-ikon{font-size:44px; margin-bottom:6px}
.kilit-btnler{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:16px}

/* bakiye tazeleme satırı */
.bakiye-satir{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:8px}

/* yönetilen toplam fon kartı */
.fon-karti{background:linear-gradient(135deg, rgba(45,224,142,.14), rgba(79,140,255,.10)); border-color:var(--green)}
.fon-ic{display:flex; align-items:center; justify-content:space-between; gap:12px}
.fon-etiket{font-size:14px; color:var(--muted); font-weight:600}
.fon-tutar{font-size:38px; font-weight:800; letter-spacing:-.02em; color:var(--green); font-variant-numeric:tabular-nums; margin:2px 0}
.fon-rozet{font-size:12px; color:var(--muted); white-space:nowrap}
@media(max-width:600px){.fon-tutar{font-size:28px}}

/* stats */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px}
@media(max-width:800px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px; text-align:center; border-top:3px solid var(--accent)}
.stat:nth-child(2){border-top-color:var(--cam)}
.stat:nth-child(3){border-top-color:var(--green)}
.stat:nth-child(4){border-top-color:var(--pembe)}
.stat-n{font-size:26px; font-weight:700}
.stat-l{color:var(--muted); font-size:13px; margin-top:2px}

/* kâr/zarar kutuları (borsa verisine göre) */
.stats-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:800px){.stats-3{grid-template-columns:repeat(3,1fr); gap:8px}}
.stat.kz{border-top-color:var(--amber)}
.stat.kz .stat-n{font-variant-numeric:tabular-nums}
@media(max-width:600px){.stat.kz{padding:12px 6px}.stat.kz .stat-n{font-size:19px}.stat.kz .stat-l{font-size:11px}}
.kz-poz{color:var(--green)}
.kz-neg{color:var(--red)}

/* ödeme para birimi formu */
.odeme-form{display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-top:6px}
.odeme-form label{margin:0; flex:1; min-width:180px}
.odeme-form .btn{margin-top:0; white-space:nowrap}

/* örnek API izin listesi */
.izin-liste{list-style:none; padding:0; margin:8px 0}
.izin-liste li{display:flex; align-items:center; gap:10px; padding:6px 0; font-size:14px; border-bottom:1px solid var(--line)}
.izin-liste li:last-child{border-bottom:0}
.izin-liste .kutu{width:20px; height:20px; border-radius:5px; display:inline-flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; flex-shrink:0}
.izin-liste .kutu.on{background:var(--green); color:#04150d}
.izin-liste .kutu.off{background:transparent; border:2px solid var(--line)}
.izin-liste li.kapa{color:var(--muted)}
.izin-liste li.tehlike{color:var(--red)}

/* ödeme durum rozeti */
.odeme-durum{display:inline-block; padding:8px 16px; border-radius:99px; background:var(--bg2); border:1px solid var(--line); font-size:14px; font-weight:600}

/* duyuru banner (yönetici → tüm üyeler) */
.duyuru{
  display:flex; align-items:flex-start; gap:12px;
  padding:13px 15px; margin-bottom:14px; border-radius:12px;
  background:linear-gradient(135deg, rgba(109,92,255,.18), rgba(79,140,255,.10));
  border:1px solid var(--accent);
}
.duyuru-ikon{font-size:20px; line-height:1.35; flex-shrink:0}
.duyuru-govde{flex:1; min-width:0}
.duyuru-baslik{font-weight:800; margin-bottom:2px}
.duyuru-mesaj{white-space:pre-wrap; word-break:break-word}
.duyuru-zaman{font-size:11.5px; color:var(--muted); margin-top:5px}
.duyuru-kapat{margin:0; flex-shrink:0}
.duyuru-kapat button{
  background:transparent; border:0; color:var(--muted); cursor:pointer;
  font-size:22px; line-height:1; padding:0 2px; margin:0;
}
.duyuru-kapat button:hover{color:var(--text)}

/* bildirim rozeti (nav destek sayısı) */
.rozet{
  display:inline-block; min-width:18px; height:18px; padding:0 5px; border-radius:99px;
  background:var(--red); color:#fff; font-size:11px; font-weight:800; line-height:18px; text-align:center;
}

/* destek sohbeti */
.sohbet{display:flex; flex-direction:column; gap:10px; max-height:460px; overflow-y:auto; padding:4px}
.balon{max-width:78%; padding:9px 13px; border-radius:14px; font-size:14px}
.balon-kim{font-size:11px; font-weight:700; opacity:.75; margin-bottom:3px}
.balon-mesaj{white-space:pre-wrap; word-break:break-word}
.balon-zaman{font-size:10.5px; color:var(--muted); margin-top:4px; text-align:right}
.balon.ben{align-self:flex-end; background:linear-gradient(135deg,var(--accent),#2e5fc0); color:#fff; border-bottom-right-radius:4px}
.balon.ben .balon-zaman{color:rgba(255,255,255,.7)}
.balon.admin{align-self:flex-start; background:var(--bg2); border:1px solid var(--line); border-bottom-left-radius:4px}
textarea{width:100%; margin-top:5px; padding:10px 12px; border-radius:9px; border:1px solid var(--line); background:var(--bg2); color:var(--text); font:inherit; resize:vertical}
textarea:focus{outline:none; border-color:var(--accent)}

/* ödeme QR kutusu */
.qr-kutu{text-align:center; margin:14px 0}
.qr-kutu #qr{display:inline-block; padding:10px; background:#fff; border-radius:12px; line-height:0}
.qr-kutu #qr img, .qr-kutu #qr canvas{display:block}
.qr-not{margin-top:6px}

/* kopyalanabilir satır (input + kopyala butonu yan yana) */
.kopyala-satir{display:flex; gap:8px; align-items:stretch; margin:6px 0}
.kopyala-satir input{margin-top:0}
.kopyala-satir .btn{margin-top:0; white-space:nowrap; flex-shrink:0}

/* canlı nokta + animasyonlar */
.canli-nokta{
  display:inline-block; width:10px; height:10px; border-radius:50%;
  background:var(--green); margin-right:4px; vertical-align:middle;
  animation:nabiz 1.6s ease-out infinite;
}
.canli-nokta.kucuk{width:7px; height:7px}
@keyframes nabiz{
  0%{box-shadow:0 0 0 0 rgba(34,192,122,.55)}
  70%{box-shadow:0 0 0 9px rgba(34,192,122,0)}
  100%{box-shadow:0 0 0 0 rgba(34,192,122,0)}
}
@keyframes satir-parla{
  0%{background:rgba(79,140,255,.28)}
  100%{background:transparent}
}
.yeni-satir td{animation:satir-parla 2.5s ease-out}
.small-n{font-size:15px !important; line-height:26px}

/* vitrin (landing) */
.hero{text-align:center; padding:52px 10px 40px}
.hero-canli{
  display:inline-block; padding:6px 14px; border-radius:99px; font-size:13px;
  background:var(--bg2); border:1px solid var(--line); color:var(--muted); margin-bottom:22px;
}
.hero h1{font-size:44px; line-height:1.12; margin:0 0 18px}
@media(max-width:600px){.hero h1{font-size:32px}}
.grad{
  background:linear-gradient(90deg,#4f8cff,#22c07a,#4f8cff);
  background-size:200% auto; -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:grad-kay 5s linear infinite;
}
@keyframes grad-kay{to{background-position:200% center}}
.hero-alt{max-width:640px; margin:0 auto 26px; color:var(--muted); font-size:16.5px}
.hero-btnler{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
.btn-buyuk{padding:14px 26px; font-size:16px}
.hero-borsalar{margin-top:22px; font-size:13.5px}

.adimlar{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:26px 0}
@media(max-width:800px){.adimlar{grid-template-columns:1fr}}
.adim{text-align:center; transition:transform .2s}
.adim:hover{transform:translateY(-4px)}
.adim-no{
  width:40px; height:40px; border-radius:50%; margin:0 auto 10px;
  background:linear-gradient(135deg,var(--accent),#2e5fc0); color:#fff;
  font-weight:700; font-size:18px; display:flex; align-items:center; justify-content:center;
}

.paketler{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; margin:20px 0 30px}
.paket{text-align:center; position:relative; transition:transform .2s, border-color .2s}
.paket:hover{transform:translateY(-5px); border-color:var(--accent)}
.paket.populer{border-color:var(--accent); box-shadow:0 0 22px rgba(79,140,255,.18); padding-top:30px}
.paket-etiket{
  position:absolute; top:-11px; left:50%; transform:translateX(-50%);
  background:var(--accent); color:#fff; font-size:11px; font-weight:700;
  padding:3px 11px; border-radius:99px; letter-spacing:.05em;
}
.paket-ad{font-size:15px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.paket-fiyat{font-size:34px; font-weight:800; margin:8px 0 2px}
.paket-fiyat .paket-donem{font-size:14px; font-weight:500; color:var(--muted)}
.paket-limit{font-size:13px; margin-bottom:12px}
.paket-liste{list-style:none; padding:0; margin:0 0 6px; text-align:left; font-size:13.5px}
.paket-liste li{padding:5px 0 5px 22px; position:relative; color:var(--muted)}
.paket-liste li::before{content:"✓"; position:absolute; left:2px; color:var(--green); font-weight:700}
.sss p{margin:14px 0}

/* network ağacı (org-chart) */
.agac{overflow-x:auto; padding:12px 4px 4px}
.agac ul{display:flex; justify-content:center; list-style:none; margin:0; padding:22px 0 0; position:relative}
.agac ul.agac-kok{padding-top:0}
.agac li{position:relative; padding:22px 10px 0; text-align:center}
.agac ul.agac-kok > li{padding-top:0}
/* bağlantı çizgileri */
.agac li::before, .agac li::after{
  content:""; position:absolute; top:0; width:50%; height:22px;
  border-top:2px solid var(--line);
}
.agac li::before{left:-1px; border-right:2px solid var(--line)}
.agac li::after{right:-1px}
.agac li:only-child::before{border-right:2px solid var(--line); border-top:0; left:50%; width:0}
.agac li:only-child::after{display:none}
.agac li:first-child::before{border-top:0}
.agac li:last-child::after{border-top:0}
.agac ul.agac-kok > li::before, .agac ul.agac-kok > li::after{display:none}
.agac ul::before{
  content:""; position:absolute; top:0; left:50%; width:0; height:22px;
  border-left:2px solid var(--line);
}
.agac ul.agac-kok::before{display:none}
/* düğümler */
.dugum{
  display:inline-block; position:relative; padding:7px 16px 7px 12px; border-radius:99px;
  font-size:13.5px; font-weight:600; color:#fff; white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.35);
}
.dugum.kok{background:var(--grad); font-size:14.5px; padding:9px 20px}
.dugum.sv1{background:linear-gradient(135deg,#4f8cff,#22d3ee)}
.dugum.sv2{background:linear-gradient(135deg,#a855f7,#6d5cff)}
.dugum.sv3{background:linear-gradient(135deg,#ff5c8a,#a855f7)}
.dugum.sv4{background:linear-gradient(135deg,#fb923c,#ff5c8a)}
.dugum-nokta{
  position:absolute; top:-3px; right:-3px; width:11px; height:11px;
  border-radius:50%; border:2px solid var(--bg);
}
.dugum-nokta.aktif{background:var(--green)}
.dugum-nokta.pasif{background:#6b7280}

/* misc */
.hint{margin-top:14px; padding:11px 13px; border-radius:10px; background:var(--bg2); border:1px solid var(--line); color:var(--muted); font-size:13px}
pre{background:var(--bg2); border:1px solid var(--line); border-radius:10px; padding:12px; overflow-x:auto}
details summary{cursor:pointer; color:var(--accent); margin-top:10px}
code{background:var(--bg2); padding:2px 6px; border-radius:6px; font-size:13px}
.footer{text-align:center; color:var(--muted); font-size:12.5px; padding:18px; border-top:1px solid var(--line); margin-top:24px}
