/* ==========================================================================
   KODVERSE — oyunlaştırılmış evren kimliği + tema katmanı (store.css'ten SONRA)
   Menekşe-siyah zemin · magenta aksiyon · amber vurgu/değer · mint "stokta" sinyali.
   Klişe yasak: neon glow yok, cam efekti yok, gradyan metin yok. Exo 2 / Jakarta.
   ========================================================================== */
:root{
    /* --- açık-tema tint token'larını yüzeyle karıştır (dark düzeltme) --- */
    --mercan-sis: color-mix(in srgb, var(--mercan) 18%, var(--yuzey));
    --indigo-sis: color-mix(in srgb, var(--indigo) 22%, var(--yuzey));
    --safran-sis: color-mix(in srgb, var(--vurgu, var(--mercan)) 16%, var(--yuzey));
    --nx-kobalt-sis: color-mix(in srgb, var(--mercan) 16%, var(--yuzey));
    --nx-ink-sis: color-mix(in srgb, #14101f 55%, var(--bg));
    --gece-sis: color-mix(in srgb, #14101f 60%, var(--bg));

    /* --- KODVERSE kimlik jetonları (menekşe-siyah, warm gaming) --- */
    --obsidyen: #0d0a17;
    --panel: #14101f;            /* koyu bantlar (eski --gece) */
    --yuzey-2: #1a1226;          /* yükseltilmiş yüzey */
    --yuzey-3: #241a33;
    --iris: var(--indigo);       /* #ff2d7e magenta — aksiyon */
    --iris-2: color-mix(in srgb, var(--indigo) 70%, #ffffff);
    --altin: var(--mercan);      /* #ffb020 amber — vurgu/değer */
    --mint: var(--basari);       /* #2fd98a stokta/anında */
    --gece: #14101f;

    /* --- dark, glow'suz gölge sistemi --- */
    --golge: 0 1px 2px rgba(0,0,0,.45);
    --golge-orta: 0 8px 24px rgba(0,0,0,.5);
    --golge-yuksek: 0 22px 56px rgba(0,0,0,.6);
    --golge-kart: 0 1px 0 rgba(255,255,255,.03) inset, 0 14px 34px rgba(0,0,0,.5);
    --hat-parlak: 1px solid color-mix(in srgb, #ffffff 8%, transparent);
}

/* ---- taban zemin dokusu: ince ızgara + köşe ışıması (statik, glow değil) ---- */
body{
    background:
        radial-gradient(1100px 620px at 82% -8%, color-mix(in srgb,var(--iris) 12%, transparent), transparent 60%),
        radial-gradient(900px 520px at -6% 4%, color-mix(in srgb,var(--altin) 7%, transparent), transparent 55%),
        var(--obsidyen);
    background-attachment: fixed;
}

/* ---- seçim + kaydırma çubuğu ---- */
::selection{ background:color-mix(in srgb,var(--iris) 45%, transparent); color:#fff; }
*{ scrollbar-width:thin; scrollbar-color:var(--yuzey-3) transparent; }
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-thumb{ background:var(--yuzey-3); border-radius:20px; border:2px solid var(--obsidyen); }
*::-webkit-scrollbar-track{ background:transparent; }

/* ---- eyebrow: altın mono, ince kural çizgisi ---- */
.eyebrow{ color:var(--altin); letter-spacing:.16em; }

/* ---- kartlar / yüzeyler ---- */
.kart,.panel,.kutu,.urun-kart,.blok,.bilgi-kart,.oz-kart{
    background:var(--yuzey); border-color:var(--cizgi);
}
.urun-kart{ box-shadow:none; transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.urun-kart:hover{ border-color:color-mix(in srgb,var(--iris) 55%, var(--cizgi)); box-shadow:var(--golge-orta); transform:translateY(-3px); }

/* görsel kutuları: dark, açık kart yerine */
.urun-gorsel,.nx-spot-gorsel,.kv-magaza-logo,.kv-satici-logo{
    background:var(--yuzey-2) !important; color:var(--ink);
}
.urun-gorsel{ border-bottom:1px solid var(--cizgi) !important; }

/* ---- form kontrolleri: dark ---- */
input,select,textarea,
.arama-form,.kv-hero-arama,.pdp-abone-siklik select,.ab-siklik select,.nx-slot-alan select,.nx-slot-alan input{
    background:var(--yuzey-2) !important; color:var(--ink) !important;
    border-color:var(--cizgi) !important;
}
input::placeholder,textarea::placeholder{ color:color-mix(in srgb,var(--gri) 85%, transparent); }
.arama-form:focus-within{ background:var(--yuzey-2) !important; border-color:var(--iris) !important;
    box-shadow:0 0 0 4px color-mix(in srgb,var(--iris) 22%, transparent) !important; }
select option{ background:var(--panel); color:var(--ink); }

/* ---- butonlar ---- */
.buton-birincil{ background:var(--iris); color:#fff; border-color:transparent; font-weight:700; }
.buton-birincil:hover{ background:var(--iris-2); color:#12121a; }
.buton-vurgu{ background:var(--altin); color:#12121a; border-color:transparent; font-weight:700; }
.buton-vurgu:hover{ background:color-mix(in srgb,var(--altin) 88%, #fff); }
.buton-hayalet,.buton-cizgi,.buton-ikincil{
    background:transparent; color:var(--ink); border:1px solid var(--cizgi);
}
.buton-hayalet:hover,.buton-cizgi:hover,.buton-ikincil:hover{ border-color:var(--iris); color:#fff; background:color-mix(in srgb,var(--iris) 14%, transparent); }

/* ---- rozetler ---- */
.rozet-mercan,.rozet-indigo{ color:#12121a; }
.rozet-mercan{ background:var(--altin); }
.rozet-stok,.rozet-aninda{ background:color-mix(in srgb,var(--mint) 18%, var(--yuzey)); color:var(--mint); border:1px solid color-mix(in srgb,var(--mint) 40%, transparent); }

/* ---- header / footer / açılır menü ---- */
.site-header,.ust-bar,.header,header.site,.mega-nav,.acilir,.dropdown,.mega,.sepet-onizleme{
    background:color-mix(in srgb,var(--panel) 92%, transparent);
    border-color:var(--cizgi); color:var(--ink);
    backdrop-filter:saturate(1.1) blur(8px);
}
.site-footer,footer.site,.footer{ background:var(--panel); border-top:1px solid var(--cizgi); color:var(--gri); }
.site-footer a{ color:var(--gri); }
.site-footer a:hover{ color:var(--altin); }

/* ---- duyuru şeridi ---- */
.duyuru-serit{ background:linear-gradient(90deg,var(--iris),color-mix(in srgb,var(--iris) 55%, var(--panel))); }

/* ---- beyaz-kart artıkları (store.css hardcode) düzelt ---- */
.favori-mini,.nx-cip,.nx-firsat-liste .urun-kart,.nx-kopilot{ background:var(--yuzey-2) !important; color:var(--ink); }
.nx-cip{ border-color:var(--cizgi); }
.nx-kopilot{ border-color:var(--cizgi) !important; box-shadow:var(--golge-orta) !important; }
.cerez-switch span::before{ background:#fff; }
.ab-rozet.ab-iptal{ background:var(--yuzey-3); color:var(--gri); }
.kv-satici-cta .buton{ background:var(--altin); color:#12121a; border-color:transparent; }
.kv-satici-logo{ border:2px solid var(--cizgi) !important; }

/* ---- koyu bantlar: obsidyen panel + ince üst çizgi ---- */
.slayt-icerik,.bant-koyu,.nx-koyu,.kv-satici{ color:#fff; }
.bant-koyu,.nx-koyu{ background:var(--panel); border:1px solid var(--cizgi); }

/* ---- linkler / vurgu metni ---- */
a:hover{ color:var(--altin); }
.fiyat,.tutar,.para{ color:var(--ink); }
.eski-fiyat{ color:var(--gri); }
.indirim,.iskonto{ color:var(--mint); }

/* ---- ayraç çizgileri ---- */
hr,.ayrac{ border-color:var(--cizgi); background:var(--cizgi); }

/* ---- flash mesajları dark ---- */
.flash-basari{ background:color-mix(in srgb,var(--basari) 16%, var(--yuzey)) !important; border-color:color-mix(in srgb,var(--basari) 45%, transparent) !important; color:var(--mint) !important; }
.flash-hata,.flash-uyari{ background:color-mix(in srgb,var(--uyari) 15%, var(--yuzey)) !important; border-color:color-mix(in srgb,var(--uyari) 45%, transparent) !important; color:color-mix(in srgb,var(--uyari) 70%, #fff) !important; }
.flash-bilgi{ background:var(--indigo-sis) !important; border-color:color-mix(in srgb,var(--iris) 40%, transparent) !important; color:var(--iris-2) !important; }

/* ==========================================================================
   KODVERSE — ANASAYFA epin bölümleri (.ok-*)
   ========================================================================== */

/* hero: nx-hero'nun dark-on-dark başlığını düzelt + eyebrow altın */
.nx-hero{ background:transparent !important; color:var(--ink) !important; padding:clamp(28px,5vw,60px) 0 clamp(24px,4vw,44px); }
.nx-hero-eyebrow{ color:var(--altin) !important; font-family:var(--font-display); letter-spacing:.18em; text-transform:uppercase; font-size:.72rem; font-weight:600; display:inline-flex; align-items:center; gap:10px; }
.nx-hero-eyebrow::before{ content:''; width:26px; height:1px; background:var(--altin); display:inline-block; }
.ok-hero-baslik{ color:var(--ink) !important; font-size:clamp(2rem,4.6vw,3.4rem); line-height:1.08; letter-spacing:-.02em; margin:14px 0 12px; }
.nx-hero-alt{ color:var(--gri) !important; font-size:1.02rem; max-width:36em; }

.ok-hero-cta{ display:flex; gap:12px; flex-wrap:wrap; margin:22px 0 6px; }
.buton-buyuk{ padding:0 22px; height:52px; font-size:.98rem; }

.ok-guven-serit{ display:flex; gap:20px; flex-wrap:wrap; margin:14px 0 4px; }
.ok-guven-serit span{ display:inline-flex; align-items:center; gap:7px; font-size:.84rem; color:var(--gri); font-family:var(--font-display); font-weight:500; }
.ok-guven-serit span svg{ color:var(--mint); }

.nx-cipler{ margin-top:18px; }
.nx-hero-ist{ margin-top:24px; gap:28px; }
.nx-hero-ist b{ color:var(--altin) !important; }
.nx-hero-ist span{ color:var(--gri) !important; }

/* hero sağ: kasa vitrini kartı */
.ok-vitrin{ display:block; background:linear-gradient(180deg,var(--yuzey-2),var(--yuzey)); border:1px solid var(--cizgi); border-radius:calc(var(--r-kart) + 4px); padding:20px; box-shadow:var(--golge-yuksek); position:relative; overflow:hidden; }
.ok-vitrin::before{ content:''; position:absolute; inset:0 0 auto 0; height:3px; background:linear-gradient(90deg,var(--iris),var(--altin)); }
.ok-vitrin .nx-spot-bar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.nx-canli{ display:inline-flex; align-items:center; gap:6px; color:var(--mint); font-family:var(--font-display); font-weight:600; font-size:.74rem; letter-spacing:.05em; text-transform:uppercase; }
.ok-vitrin-stok{ display:inline-flex; align-items:center; gap:6px; font-size:.74rem; color:var(--gri); background:color-mix(in srgb,var(--mint) 12%, transparent); padding:4px 10px; border-radius:999px; border:1px solid color-mix(in srgb,var(--mint) 26%, transparent); }
.ok-vitrin-marka{ font-family:var(--font-display); font-weight:600; color:var(--altin); font-size:.8rem; letter-spacing:.04em; text-transform:uppercase; }
.ok-vitrin-ad{ color:var(--ink) !important; font-size:1.5rem; margin:4px 0 12px; line-height:1.15; }
.ok-vitrin-teslim{ display:flex; align-items:center; gap:8px; font-size:.84rem; color:var(--gri); background:var(--panel); border:1px solid var(--cizgi); border-radius:10px; padding:10px 12px; margin-bottom:16px; }
.ok-vitrin-teslim svg{ color:var(--iris-2); flex:none; }
.ok-vitrin .nx-spot-alt{ display:flex; justify-content:space-between; align-items:flex-end; }
.ok-vitrin .nx-spot-fiyat b{ font-size:1.7rem; color:var(--ink); font-family:var(--font-display); }
.ok-vitrin .nx-spot-fiyat s{ color:var(--gri); font-size:.9rem; margin-right:6px; }
.nx-spot-dus{ display:inline-flex; align-items:center; gap:5px; color:#12121a; background:var(--altin); font-weight:700; font-size:.76rem; padding:4px 9px; border-radius:8px; }
.ok-vitrin-btn{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:16px; height:48px; background:var(--iris); color:#fff; border-radius:var(--buton-radius); font-family:var(--font-display); font-weight:600; transition:background .18s ease; }
.ok-vitrin:hover .ok-vitrin-btn{ background:var(--iris-2); }

/* oyun/platform ızgarası */
.ok-oyun-izgara{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
.ok-oyun-kart{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; padding:18px 16px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); transition:border-color .18s ease, transform .18s ease, background .18s ease; }
.ok-oyun-kart:hover{ border-color:color-mix(in srgb,var(--iris) 55%,var(--cizgi)); transform:translateY(-3px); background:var(--yuzey-2); }
.ok-oyun-ikon{ width:44px; height:44px; display:grid; place-items:center; border-radius:12px; background:color-mix(in srgb,var(--iris) 16%, var(--yuzey-2)); color:var(--iris-2); border:1px solid color-mix(in srgb,var(--iris) 30%, transparent); }
.ok-oyun-kart:hover .ok-oyun-ikon{ background:var(--iris); color:#fff; }
.ok-oyun-ad{ font-family:var(--font-display); font-weight:600; color:var(--ink); font-size:.98rem; }
.ok-oyun-meta{ font-size:.78rem; color:var(--gri); }

/* nasıl çalışır bandı */
.ok-nasil-bant{ background:var(--panel); border-top:1px solid var(--cizgi); border-bottom:1px solid var(--cizgi); padding:clamp(36px,5vw,64px) 0; margin:clamp(28px,4vw,52px) 0; }
.ok-nasil{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.ok-nasil-adim{ position:relative; padding:24px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); }
.ok-nasil-no{ position:absolute; top:18px; right:20px; font-family:var(--font-display); font-weight:700; font-size:2.6rem; color:color-mix(in srgb,var(--iris) 22%, transparent); line-height:1; }
.ok-nasil-ikon{ width:48px; height:48px; display:grid; place-items:center; border-radius:12px; background:color-mix(in srgb,var(--altin) 16%, var(--yuzey-2)); color:var(--altin); border:1px solid color-mix(in srgb,var(--altin) 30%, transparent); margin-bottom:16px; }
.ok-nasil-adim b{ display:block; font-family:var(--font-display); font-size:1.14rem; color:var(--ink); margin-bottom:6px; }
.ok-nasil-adim p{ color:var(--gri); font-size:.92rem; margin:0; }

/* cüzdan bandı */
.ok-cuzdan{ display:flex; align-items:center; gap:24px; padding:clamp(24px,3vw,36px); border-radius:calc(var(--r-kart) + 6px); background:linear-gradient(120deg,color-mix(in srgb,var(--iris) 24%, var(--panel)),var(--panel) 62%); border:1px solid color-mix(in srgb,var(--iris) 32%, var(--cizgi)); position:relative; overflow:hidden; }
.ok-cuzdan::after{ content:''; position:absolute; right:-40px; top:-40px; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--altin) 18%,transparent),transparent 70%); }
.ok-cuzdan-ikon{ width:66px; height:66px; flex:none; display:grid; place-items:center; border-radius:16px; background:var(--altin); color:#12121a; }
.ok-cuzdan-metin{ flex:1; }
.ok-cuzdan-metin h2{ color:#fff; margin:4px 0 8px; }
.ok-cuzdan-metin p{ color:color-mix(in srgb,#fff 80%, var(--iris)); margin:0; max-width:56ch; }
.ok-cuzdan-metin .eyebrow{ color:var(--altin) !important; }
.ok-cuzdan .buton{ flex:none; position:relative; z-index:2; }

/* bayi bandı */
.ok-bayi{ display:flex; align-items:center; gap:28px; padding:clamp(24px,3vw,40px); border-radius:calc(var(--r-kart) + 6px); background:var(--yuzey); border:1px solid var(--cizgi); }
.ok-bayi-metin{ flex:1; }
.ok-bayi-metin h2{ color:var(--ink); margin:4px 0 8px; }
.ok-bayi-metin p{ color:var(--gri); margin:0 0 14px; max-width:60ch; }
.ok-bayi-ozellik{ display:flex; gap:16px; flex-wrap:wrap; }
.ok-bayi-ozellik span{ display:inline-flex; align-items:center; gap:7px; font-size:.84rem; color:var(--ink); font-family:var(--font-display); font-weight:500; }
.ok-bayi-ozellik svg{ color:var(--iris-2); }
.ok-bayi .buton{ flex:none; }

/* orta banner dark */
.ok-orta-banner{ display:block; background:var(--panel) !important; border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:clamp(28px,4vw,48px); }
.ok-orta-banner h2{ color:#fff; }
.ok-orta-banner p{ color:var(--gri); }

/* responsive */
@media (max-width:1080px){ .ok-oyun-izgara{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:860px){
    .ok-nasil{ grid-template-columns:1fr; }
    .ok-cuzdan,.ok-bayi{ flex-direction:column; align-items:flex-start; }
    .ok-oyun-izgara{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:560px){ .ok-oyun-izgara{ grid-template-columns:repeat(2,1fr); } .ok-hero-cta .buton{ flex:1; } }

/* ---- ürün kartı: kapak sanatı olmayan epin ürünleri için CSS kapak ---- */
.ok-kapak{ position:relative; width:100%; aspect-ratio:1/1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:16px; overflow:hidden; background:
    radial-gradient(120% 90% at 80% 12%, color-mix(in srgb, var(--kapak-renk) 42%, transparent), transparent 60%),
    linear-gradient(160deg, color-mix(in srgb, var(--kapak-renk) 20%, #14101f), #0d0a17 72%); }
.ok-kapak::before{ content:''; position:absolute; inset:0; background-image:
    repeating-linear-gradient(45deg, color-mix(in srgb,var(--kapak-renk) 8%, transparent) 0 2px, transparent 2px 12px); opacity:.5; }
.ok-kapak-marka{ position:relative; font-family:var(--font-display); font-weight:600; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:color-mix(in srgb, var(--kapak-renk) 70%, #fff); margin-bottom:6px; }
.ok-kapak-kupur{ position:relative; font-family:var(--font-display); font-weight:700; font-size:clamp(1.1rem,3vw,1.5rem); line-height:1.1; color:#fff; letter-spacing:-.01em; }
.ok-kapak-ikon{ position:absolute; right:12px; bottom:12px; width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:color-mix(in srgb, var(--kapak-renk) 26%, transparent); color:color-mix(in srgb,var(--kapak-renk) 80%, #fff); border:1px solid color-mix(in srgb,var(--kapak-renk) 40%, transparent); }
.kapak-a{ --kapak-renk:#16e0d4; }
.kapak-b{ --kapak-renk:#c7f24a; }
.kapak-c{ --kapak-renk:#3ee08f; }
.kapak-d{ --kapak-renk:#22c3e0; }
.kapak-e{ --kapak-renk:#8be04a; }
.kapak-f{ --kapak-renk:#f0b83c; }

/* ---- ürün sayfası (pdp) epin dokunuşları ---- */
.pdp-galeri-tek{ grid-template-columns:1fr !important; }
.ok-kapak-buyuk{ width:100%; height:100%; aspect-ratio:auto; border-radius:0; }
.ok-kapak-buyuk .ok-kapak-kupur{ font-size:clamp(1.6rem,4vw,2.6rem); }
.ok-kapak-buyuk .ok-kapak-marka{ font-size:.86rem; }
.ok-kapak-buyuk .ok-kapak-ikon{ width:46px; height:46px; right:16px; bottom:16px; }
.pdp-ana-gorsel{ background:var(--yuzey-2); border:1px solid var(--cizgi); border-radius:var(--r-kart); overflow:hidden; }
.pdp-kucukler .kucuk-resim{ background:var(--yuzey-2) !important; border-color:var(--cizgi) !important; }

.pdp-canli-serit{ display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 14px; }
.pdp-sinyal{ display:inline-flex; align-items:center; gap:6px; font-size:.8rem; color:var(--gri); background:var(--yuzey-2); border:1px solid var(--cizgi); border-radius:999px; padding:6px 12px; }
.pdp-sinyal b{ color:var(--ink); }
.pdp-sinyal.canli::before{ content:''; width:7px; height:7px; border-radius:50%; background:var(--mint); box-shadow:0 0 0 0 color-mix(in srgb,var(--mint) 60%,transparent); }
.pdp-sinyal.canli b{ color:var(--mint); }
.pdp-sinyal.acil{ color:var(--altin); border-color:color-mix(in srgb,var(--altin) 34%,transparent); background:color-mix(in srgb,var(--altin) 12%,var(--yuzey-2)); }
.pdp-sinyal.acil b,.pdp-sinyal.acil svg{ color:var(--altin); }
.pdp-sinyal svg{ color:var(--mint); }

.pdp-guvence{ list-style:none; padding:0; margin:16px 0 0; display:grid; gap:10px; }
.pdp-guvence li{ display:flex; align-items:flex-start; gap:10px; font-size:.88rem; color:var(--gri); }
.pdp-guvence li b{ color:var(--ink); }
.pdp-guvence svg{ color:var(--iris-2); flex:none; margin-top:1px; }

.pdp-abone{ background:var(--yuzey-2); border:1px solid color-mix(in srgb,var(--altin) 26%,var(--cizgi)); border-radius:var(--r-kart); padding:16px; margin-top:14px; }
.pdp-abone-etiket{ color:var(--altin); font-weight:600; }
.pdp-abone-fiyat{ color:var(--ink); font-weight:700; }
.pdp-abone-aciklama{ color:var(--gri); font-size:.86rem; }

/* ---- teslim edilen kodlar (siparis-tamam / siparislerim) ---- */
.ok-kodlar{ text-align:left; margin:22px 0; padding:20px; background:var(--yuzey-2); border:1px solid color-mix(in srgb,var(--mint) 26%,var(--cizgi)); border-radius:var(--r-kart); }
.ok-kodlar-bas{ display:flex; align-items:center; gap:9px; font-family:var(--font-display); font-weight:600; color:var(--mint); margin-bottom:14px; }
.ok-kod-satir{ padding:12px 0; border-bottom:1px solid var(--cizgi); }
.ok-kod-satir:last-of-type{ border-bottom:none; }
.ok-kod-ust{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; gap:12px; }
.ok-kod-urun{ font-weight:600; color:var(--ink); font-size:.94rem; }
.ok-kod-skt{ font-size:.76rem; color:var(--gri); }
.ok-kod-kutu{ display:flex; gap:10px; align-items:stretch; }
.ok-kod-deger{ flex:1; display:flex; align-items:center; font-family:'Rajdhani',ui-monospace,monospace; font-size:1.05rem; letter-spacing:.06em; color:#fff; background:var(--panel); border:1px dashed color-mix(in srgb,var(--mint) 40%,var(--cizgi)); border-radius:10px; padding:12px 16px; word-break:break-all; user-select:all; }
.ok-kod-kopya{ flex:none; white-space:nowrap; }
.ok-kod-not{ display:flex; align-items:center; gap:8px; margin:14px 0 0; font-size:.8rem; color:var(--gri); }
.ok-kod-not svg{ color:var(--altin); flex:none; }

/* ---- bakiye yükleme (top-up) ---- */
.ok-bakiye-yukle-btn{ margin-top:14px; }
.ok-yukle-ust{ display:flex; align-items:center; gap:24px; flex-wrap:wrap; padding:22px; background:var(--yuzey-2); border:1px solid var(--cizgi); border-radius:var(--r-kart); margin-bottom:20px; }
.ok-yukle-bakiye{ display:block; font-family:var(--font-display); font-size:1.9rem; color:var(--altin); font-weight:700; }
.ok-yukle-ust p{ flex:1; min-width:240px; color:var(--gri); margin:0; font-size:.92rem; }
.ok-yukle-form{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:22px; }
.ok-yukle-paketler{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:10px 0 22px; }
.ok-yukle-paket{ cursor:pointer; }
.ok-yukle-paket input{ position:absolute; opacity:0; pointer-events:none; }
.ok-yukle-paket-ic{ display:flex; flex-direction:column; gap:3px; padding:16px; border:1.5px solid var(--cizgi); border-radius:var(--r-kart); background:var(--yuzey-2); transition:border-color .16s ease, background .16s ease; text-align:center; }
.ok-yukle-paket-ic b{ font-family:var(--font-display); font-size:1.25rem; color:var(--ink); }
.ok-yukle-paket-ic em{ font-style:normal; font-size:.8rem; color:var(--mint); font-weight:600; }
.ok-yukle-paket-ic em.ok-yukle-nobonus{ color:var(--gri); font-weight:400; }
.ok-yukle-paket-ic small{ color:var(--gri); font-size:.76rem; }
.ok-yukle-paket input:checked + .ok-yukle-paket-ic{ border-color:var(--altin); background:color-mix(in srgb,var(--altin) 12%, var(--yuzey-2)); }
.ok-yukle-paket input:focus-visible + .ok-yukle-paket-ic{ outline:2px solid var(--iris); outline-offset:2px; }
.ok-yukle-ozel{ display:block; margin-bottom:18px; }
.ok-yukle-ozel input{ width:100%; margin-top:6px; }
.ok-yukle-alt{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:16px; border-top:1px solid var(--cizgi); }
.ok-yukle-toplam span{ display:block; font-size:.8rem; color:var(--gri); }
.ok-yukle-toplam b{ font-family:var(--font-display); font-size:1.5rem; color:var(--mint); }
.ok-yukle-not{ display:flex; align-items:center; gap:8px; margin:16px 0 0; font-size:.8rem; color:var(--gri); }
.ok-yukle-not svg{ color:var(--iris-2); }
@media (max-width:560px){ .ok-yukle-paketler{ grid-template-columns:repeat(2,1fr); } }

/* ---- bayi paneli ---- */
.ok-bayi-durum{ text-align:center; padding:48px 24px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); max-width:640px; margin:20px auto; }
.ok-bayi-durum-ikon{ display:inline-grid; place-items:center; width:70px; height:70px; border-radius:18px; background:color-mix(in srgb,var(--iris) 16%,var(--yuzey-2)); color:var(--iris-2); margin-bottom:16px; }
.ok-bayi-durum h2{ color:var(--ink); margin-bottom:8px; }
.ok-bayi-durum p{ color:var(--gri); max-width:46ch; margin:0 auto 20px; }
.ok-bayi-kartlar{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:20px; }
.ok-bayi-kart{ padding:18px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); display:flex; flex-direction:column; gap:2px; }
.ok-bayi-kart span{ font-size:.82rem; color:var(--gri); }
.ok-bayi-kart b{ font-family:var(--font-display); font-size:1.5rem; color:var(--altin); }
.ok-bayi-kart small{ font-size:.76rem; color:var(--gri); }
.ok-bayi-kart a{ font-size:.82rem; color:var(--iris-2); margin-top:2px; }
.ok-bayi-anahtar-kart,.ok-bayi-dok,.ok-bayi-siparisler{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:var(--r-kart); padding:22px; margin-bottom:20px; }
.ok-bayi-bas{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.ok-bayi-bas h3{ display:flex; align-items:center; gap:8px; color:var(--ink); }
.ok-api-alan{ display:block; margin-bottom:16px; font-size:.86rem; color:var(--gri); }
.ok-api-kutu{ display:flex; gap:10px; align-items:center; margin-top:6px; }
.ok-api-kutu code{ flex:1; font-family:ui-monospace,monospace; background:var(--panel); border:1px solid var(--cizgi); border-radius:9px; padding:11px 14px; color:#fff; word-break:break-all; user-select:all; font-size:.9rem; }
.ok-api-gizli code{ color:var(--gri); letter-spacing:2px; }
.ok-api-uyari{ display:block; color:var(--altin); margin-top:6px; font-size:.78rem; }
.ok-bayi-dok h3,.ok-bayi-siparisler h3{ color:var(--ink); margin-bottom:10px; }
.ok-bayi-dok h4{ color:var(--ink); margin:18px 0 8px; }
.ok-bayi-dok p{ color:var(--gri); font-size:.9rem; }
.ok-bayi-dok code{ background:var(--panel); border:1px solid var(--cizgi); border-radius:6px; padding:2px 7px; font-family:ui-monospace,monospace; color:var(--iris-2); font-size:.86rem; }
.ok-dok-tablo{ overflow-x:auto; margin:12px 0; }
.ok-dok-tablo code{ white-space:nowrap; }
.ok-kod-ornek{ background:var(--panel); border:1px solid var(--cizgi); border-radius:10px; padding:16px; overflow-x:auto; }
.ok-kod-ornek code{ background:none; border:none; padding:0; color:#cdd6e6; font-size:.84rem; line-height:1.6; white-space:pre; display:block; }
@media (max-width:720px){ .ok-bayi-kartlar{ grid-template-columns:1fr; } }

/* ---- mobil taşma düzeltmeleri (grid blowout önleme) ---- */
html,body{ overflow-x:clip; max-width:100%; }
.nx-hero-ic > *,.ok-nasil > *,.ok-oyun-izgara > *,.ok-bayi-kartlar > *,.nx-neden > *,.ok-yukle-paketler > *{ min-width:0; }
.nx-hero h1,.ok-hero-baslik,.ok-vitrin-ad,.nx-hero-alt{ overflow-wrap:anywhere; }
.ok-vitrin,.ok-cuzdan,.ok-bayi{ max-width:100%; }
.ok-kod-deger,.ok-api-kutu code{ overflow-wrap:anywhere; }
@media (max-width:620px){
    .ok-hero-cta .buton{ flex:1 1 auto; justify-content:center; }
    .ok-guven-serit{ gap:12px; }
    .nx-hero-ist{ gap:18px; }
}

/* ---- checkout dijital teslimat bloğu ---- */
.ok-dijital-teslim{ display:flex; gap:14px; align-items:flex-start; padding:16px; background:color-mix(in srgb,var(--mint) 10%,var(--yuzey-2)); border:1px solid color-mix(in srgb,var(--mint) 30%,var(--cizgi)); border-radius:var(--r-kart); margin-bottom:12px; }
.ok-dijital-ikon{ flex:none; width:44px; height:44px; display:grid; place-items:center; border-radius:12px; background:color-mix(in srgb,var(--mint) 20%,transparent); color:var(--mint); }
.ok-dijital-teslim b{ color:var(--ink); display:block; margin-bottom:2px; }
.ok-dijital-teslim p{ color:var(--gri); font-size:.88rem; margin:0; }

/* ==========================================================================
   KODVERSE anasayfa mimarisi (.v-*) — komut-arama hero + canlı akis + liderlik
   ========================================================================== */
.v-nokta{ width:8px; height:8px; border-radius:50%; background:var(--mint); display:inline-block; box-shadow:0 0 0 0 color-mix(in srgb,var(--mint) 70%,transparent); animation:v-pulse 1.8s infinite; }
@keyframes v-pulse{ 0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--mint) 55%,transparent)} 70%{box-shadow:0 0 0 7px transparent} 100%{box-shadow:0 0 0 0 transparent} }

/* ---- HERO ---- */
.v-hero{ position:relative; padding:54px 0 30px; overflow:hidden; }
.v-hero::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, color-mix(in srgb,var(--iris) 6%, transparent), transparent 40%); pointer-events:none; }
.v-hero-ic{ position:relative; display:grid; grid-template-columns:1.35fr .95fr; gap:44px; align-items:center; }
.v-hero-rozet{ display:inline-flex; align-items:center; gap:9px; font-family:var(--font-display); font-weight:600; font-size:.82rem; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); background:color-mix(in srgb,var(--mint) 12%, var(--yuzey)); border:1px solid color-mix(in srgb,var(--mint) 30%, var(--cizgi)); padding:7px 14px; border-radius:999px; }
.v-hero-baslik{ font-family:var(--font-display); font-weight:700; font-size:clamp(2.7rem,6vw,4.6rem); line-height:.98; letter-spacing:-.02em; margin:20px 0 0; text-transform:uppercase; }
.v-hero-alt{ color:var(--gri); font-size:1.06rem; max-width:34em; margin:16px 0 22px; }
.v-hero-alt b{ color:var(--ink); font-weight:600; }
.v-komut{ display:flex; align-items:center; gap:8px; background:var(--yuzey); border:1.5px solid var(--cizgi); border-radius:14px; padding:8px 8px 8px 16px; box-shadow:var(--golge-orta); transition:border-color .18s ease; }
.v-komut:focus-within{ border-color:var(--iris); }
.v-komut-ikon{ color:var(--gri); display:flex; flex:none; }
.v-komut input{ flex:1; border:none; background:none; color:var(--ink); font-size:1.04rem; padding:10px 4px; outline:none; }
.v-komut input::placeholder{ color:var(--gri); }
.v-komut-btn{ flex:none; display:inline-flex; align-items:center; gap:6px; border:none; background:var(--iris); color:#04201d; font-family:var(--font-display); font-weight:700; font-size:1rem; letter-spacing:.02em; padding:12px 22px; border-radius:10px; transition:filter .18s ease; }
.v-komut-btn:hover{ filter:brightness(1.08); }
.v-hero-cip{ display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 20px; }
.v-hero-cip a{ font-family:var(--font-display); font-weight:600; font-size:.86rem; color:var(--gri); background:var(--yuzey); border:1px solid var(--cizgi); padding:6px 13px; border-radius:999px; transition:color .18s,border-color .18s; }
.v-hero-cip a:hover{ color:var(--iris); border-color:color-mix(in srgb,var(--iris) 50%,var(--cizgi)); }
.v-hero-guven{ display:flex; flex-wrap:wrap; gap:18px; color:var(--gri); font-size:.9rem; }
.v-hero-guven span{ display:inline-flex; align-items:center; gap:7px; }
.v-hero-guven svg{ color:var(--mint); }

/* canli akis paneli */
.v-akis{ background:var(--panel); border:1px solid var(--cizgi); border-radius:18px; padding:18px; box-shadow:var(--golge-kart); }
.v-akis-bas{ display:flex; align-items:center; justify-content:space-between; padding-bottom:14px; border-bottom:1px solid var(--cizgi); margin-bottom:8px; }
.v-akis-canli{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-display); font-weight:700; font-size:.78rem; letter-spacing:.1em; color:var(--mint); }
.v-akis-say{ font-family:var(--font-display); font-weight:600; font-size:.78rem; color:var(--gri); }
.v-akis-liste{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.v-akis-liste li{ display:flex; align-items:center; gap:11px; padding:11px 4px; border-bottom:1px dashed color-mix(in srgb,var(--cizgi) 70%,transparent); animation:v-akis-in .5s ease both; }
.v-akis-liste li:last-child{ border-bottom:none; }
.v-akis-liste li:nth-child(1){animation-delay:.02s} .v-akis-liste li:nth-child(2){animation-delay:.09s} .v-akis-liste li:nth-child(3){animation-delay:.16s} .v-akis-liste li:nth-child(4){animation-delay:.23s} .v-akis-liste li:nth-child(5){animation-delay:.30s} .v-akis-liste li:nth-child(6){animation-delay:.37s}
@keyframes v-akis-in{ from{opacity:0; transform:translateX(-8px)} to{opacity:1; transform:none} }
.v-akis-ok{ flex:none; width:26px; height:26px; border-radius:8px; display:grid; place-items:center; background:color-mix(in srgb,var(--iris) 14%,var(--yuzey)); color:var(--iris); }
.v-akis-metin{ flex:1; font-size:.86rem; color:var(--gri); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.v-akis-metin b{ color:var(--ink); font-weight:600; }
.v-akis-zaman{ flex:none; font-size:.72rem; color:var(--gri); font-family:var(--font-display); }
.v-akis-alt{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:14px; padding-top:14px; border-top:1px solid var(--cizgi); text-align:center; }
.v-akis-alt b{ display:block; font-family:var(--font-display); font-weight:700; font-size:1.3rem; color:var(--altin); }
.v-akis-alt span{ font-size:.72rem; color:var(--gri); }

/* ---- oyun / platform rail ---- */
.v-oyun-rail{ display:flex; gap:12px; overflow-x:auto; padding:4px 2px 12px; scroll-snap-type:x mandatory; }
.v-oyun-kart{ scroll-snap-align:start; flex:0 0 auto; width:158px; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:14px; padding:16px; display:flex; flex-direction:column; gap:4px; transition:border-color .18s,transform .18s; }
.v-oyun-kart:hover{ border-color:color-mix(in srgb,var(--iris) 55%,var(--cizgi)); transform:translateY(-3px); }
.v-oyun-ikon{ width:44px; height:44px; border-radius:11px; display:grid; place-items:center; background:color-mix(in srgb,var(--iris) 13%,var(--yuzey)); color:var(--iris); margin-bottom:8px; }
.v-oyun-ad{ font-family:var(--font-display); font-weight:600; font-size:1rem; color:var(--ink); }
.v-oyun-meta{ font-size:.8rem; color:var(--altin); font-family:var(--font-display); font-weight:600; }

/* ---- liderlik tablosu ---- */
.v-lider-grid{ display:grid; grid-template-columns:.85fr 1.6fr; gap:34px; align-items:start; }
.v-lider-yan h2{ font-size:clamp(1.8rem,3.4vw,2.6rem); text-transform:uppercase; letter-spacing:-.02em; margin:.3em 0 .4em; }
.v-lider-yan p{ color:var(--gri); margin-bottom:18px; }
.v-lider-liste{ list-style:none; margin:0; padding:0; background:var(--panel); border:1px solid var(--cizgi); border-radius:16px; overflow:hidden; }
.v-lider-satir a{ display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:16px; padding:15px 18px; border-bottom:1px solid var(--cizgi); transition:background .16s; }
.v-lider-satir:last-child a{ border-bottom:none; }
.v-lider-satir a:hover{ background:color-mix(in srgb,var(--iris) 7%,transparent); }
.v-lider-no{ font-family:var(--font-display); font-weight:700; font-size:1.4rem; color:var(--gri); min-width:34px; }
.v-lider-satir:nth-child(1) .v-lider-no{ color:var(--altin); }
.v-lider-satir:nth-child(2) .v-lider-no,.v-lider-satir:nth-child(3) .v-lider-no{ color:var(--iris); }
.v-lider-orta{ min-width:0; }
.v-lider-orta b{ display:block; font-family:var(--font-display); font-weight:600; font-size:1.02rem; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.v-lider-orta small{ color:var(--gri); font-size:.78rem; }
.v-lider-fiyat{ font-family:var(--font-display); font-weight:700; font-size:1.08rem; color:var(--ink); }
.v-lider-trend{ font-family:var(--font-display); font-weight:700; font-size:.82rem; color:var(--mint); min-width:44px; text-align:right; }
.v-lider-trend.dus{ color:var(--altin); }

/* ---- nasil calisir: yatay zaman cizgisi ---- */
.v-nasil-bant{ background:var(--panel); border-top:1px solid var(--cizgi); border-bottom:1px solid var(--cizgi); margin:12px 0; }
.v-nasil{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:30px; padding:38px 0; }
.v-nasil-cizgi{ position:absolute; top:56px; left:12%; right:12%; height:2px; background:repeating-linear-gradient(90deg,var(--cizgi) 0 10px,transparent 10px 18px); }
.v-nasil-adim{ position:relative; text-align:center; }
.v-nasil-no{ width:40px; height:40px; border-radius:50%; display:grid; place-items:center; margin:0 auto 14px; font-family:var(--font-display); font-weight:700; font-size:1.1rem; color:#04201d; background:var(--iris); position:relative; z-index:1; }
.v-nasil-adim b{ font-family:var(--font-display); font-weight:600; font-size:1.15rem; display:block; margin-bottom:6px; }
.v-nasil-adim p{ color:var(--gri); font-size:.92rem; max-width:26em; margin:0 auto; }

/* ---- flash ---- */
.v-flash{ display:grid; grid-template-columns:1.5fr 1fr; gap:0; background:var(--panel); border:1px solid var(--cizgi); border-radius:20px; overflow:hidden; }
.v-flash-sol{ padding:30px 32px; position:relative; background:radial-gradient(600px 300px at 100% 0%, color-mix(in srgb,var(--altin) 10%,transparent), transparent 60%); }
.v-flash-bas{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.v-flash-etiket{ display:inline-flex; align-items:center; gap:7px; font-family:var(--font-display); font-weight:700; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--altin); }
.v-flash-marka{ font-family:var(--font-display); font-weight:600; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gri); }
.v-flash-ad{ font-family:var(--font-display); font-weight:700; font-size:clamp(1.6rem,3vw,2.4rem); text-transform:uppercase; letter-spacing:-.01em; margin:4px 0 16px; }
.v-flash-fiyat{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:22px; }
.v-flash-fiyat s{ color:var(--gri); font-size:1.1rem; }
.v-flash-fiyat b{ font-family:var(--font-display); font-weight:700; font-size:2.4rem; color:var(--altin); letter-spacing:-.01em; }
.v-flash-dus{ font-family:var(--font-display); font-weight:700; font-size:.82rem; color:#04201d; background:var(--altin); padding:4px 10px; border-radius:7px; }
.v-flash-cta{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.v-flash-not{ display:inline-flex; align-items:center; gap:7px; color:var(--gri); font-size:.84rem; }
.v-flash-not svg{ color:var(--mint); }
.v-flash-sag{ border-left:1px solid var(--cizgi); display:flex; flex-direction:column; }
.v-flash-mini{ flex:1; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 22px; border-bottom:1px solid var(--cizgi); transition:background .16s; }
.v-flash-mini:last-child{ border-bottom:none; }
.v-flash-mini:hover{ background:color-mix(in srgb,var(--iris) 7%,transparent); }
.v-flash-mini-ad{ font-size:.88rem; color:var(--gri); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.v-flash-mini-fiyat{ font-family:var(--font-display); font-weight:700; color:var(--ink); flex:none; }
.v-flash-gs .nx-gs-kutu{ background:var(--yuzey); border:1px solid var(--cizgi); color:var(--ink); }

/* ---- ikili kart: cuzdan + sadakat ---- */
.v-ikili{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.v-ikili-kart{ position:relative; padding:26px 28px; border-radius:18px; border:1px solid var(--cizgi); background:var(--panel); overflow:hidden; transition:border-color .18s,transform .18s; }
.v-ikili-kart:hover{ transform:translateY(-3px); }
.v-cuzdan-kart{ background:radial-gradient(500px 280px at 100% 0%, color-mix(in srgb,var(--iris) 12%,transparent), transparent 60%), var(--panel); }
.v-cuzdan-kart:hover{ border-color:color-mix(in srgb,var(--iris) 50%,var(--cizgi)); }
.v-sadakat-kart{ background:radial-gradient(500px 280px at 100% 0%, color-mix(in srgb,var(--altin) 12%,transparent), transparent 60%), var(--panel); }
.v-sadakat-kart:hover{ border-color:color-mix(in srgb,var(--altin) 50%,var(--cizgi)); }
.v-ikili-ikon{ width:52px; height:52px; border-radius:13px; display:grid; place-items:center; background:var(--yuzey); border:1px solid var(--cizgi); margin-bottom:14px; }
.v-cuzdan-kart .v-ikili-ikon{ color:var(--iris); }
.v-sadakat-kart .v-ikili-ikon{ color:var(--altin); }
.v-ikili-kart h3{ font-family:var(--font-display); font-weight:600; font-size:1.35rem; margin:4px 0 8px; }
.v-ikili-kart p{ color:var(--gri); font-size:.94rem; margin-bottom:16px; }
.v-ikili-kart p b{ color:var(--ink); }
.v-ikili-git{ display:inline-flex; align-items:center; gap:7px; font-family:var(--font-display); font-weight:600; font-size:.92rem; color:var(--ink); }
.v-cuzdan-kart .v-ikili-git{ color:var(--iris); }
.v-sadakat-kart .v-ikili-git{ color:var(--altin); }

/* ---- bayi API terminali ---- */
.v-api-bant{ background:var(--panel); border-top:1px solid var(--cizgi); border-bottom:1px solid var(--cizgi); margin:14px 0; }
.v-api{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; padding:48px 0; }
.v-api-sol h2{ font-size:clamp(1.7rem,3.2vw,2.5rem); text-transform:uppercase; letter-spacing:-.02em; margin:.3em 0 .4em; }
.v-api-sol p{ color:var(--gri); margin-bottom:18px; max-width:34em; }
.v-api-ozellik{ display:flex; flex-wrap:wrap; gap:10px 18px; margin-bottom:24px; }
.v-api-ozellik span{ display:inline-flex; align-items:center; gap:8px; font-size:.9rem; color:var(--gri); }
.v-api-ozellik svg{ color:var(--iris); }
.v-api-term{ background:var(--obsidyen); border:1px solid var(--cizgi); border-radius:14px; overflow:hidden; box-shadow:var(--golge-kart); }
.v-term-bar{ display:flex; align-items:center; gap:7px; padding:11px 14px; border-bottom:1px solid var(--cizgi); background:color-mix(in srgb,#fff 3%,var(--obsidyen)); }
.v-term-bar i{ width:11px; height:11px; border-radius:50%; background:var(--yuzey-3); }
.v-term-bar i:first-child{ background:color-mix(in srgb,var(--uyari,#ff4d6d) 80%,#000); }
.v-term-bar span{ margin-left:8px; font-family:var(--font-display); font-size:.78rem; color:var(--gri); letter-spacing:.04em; }
.v-term-kod{ margin:0; padding:20px 22px; font-family:'Rajdhani',ui-monospace,Menlo,monospace; font-size:.92rem; line-height:1.75; color:color-mix(in srgb,var(--ink) 85%,transparent); overflow-x:auto; letter-spacing:.02em; }
.v-term-kod .c-y{ color:var(--altin); font-weight:700; }
.v-term-kod .c-g{ color:var(--iris); }
.v-term-kod .c-m{ color:color-mix(in srgb,var(--iris) 55%,var(--gri)); }
.v-term-kod .c-c{ color:var(--mint); font-weight:700; }

/* ---- neden izgara ---- */
.v-neden{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.v-neden-oge{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:14px; padding:22px; transition:border-color .18s; }
.v-neden-oge:hover{ border-color:color-mix(in srgb,var(--iris) 40%,var(--cizgi)); }
.v-neden-ikon{ width:44px; height:44px; border-radius:11px; display:grid; place-items:center; background:color-mix(in srgb,var(--iris) 12%,var(--yuzey)); color:var(--iris); margin-bottom:14px; }
.v-neden-oge b{ font-family:var(--font-display); font-weight:600; font-size:1.08rem; display:block; margin-bottom:6px; }
.v-neden-oge p{ color:var(--gri); font-size:.9rem; margin:0; }

/* ---- yorum izgara ---- */
.v-yorum-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.v-yorum-kart{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:14px; padding:22px; }
.v-yorum-kart .yorum-yildizlar{ color:var(--altin); font-size:.95rem; margin-bottom:10px; }
.v-yorum-kart blockquote{ margin:0 0 14px; font-size:.98rem; line-height:1.6; color:var(--ink); }
.v-yorum-kart cite{ font-style:normal; font-size:.84rem; color:var(--gri); }
.v-yorum-kart cite b{ color:var(--ink); font-weight:600; }

/* ==================== responsive ==================== */
@media (max-width:1024px){
    .v-hero-ic{ grid-template-columns:1fr; gap:30px; }
    .v-lider-grid{ grid-template-columns:1fr; gap:22px; }
    .v-api{ grid-template-columns:1fr; gap:28px; padding:36px 0; }
    .v-flash{ grid-template-columns:1fr; }
    .v-flash-sag{ border-left:none; border-top:1px solid var(--cizgi); flex-direction:row; flex-wrap:wrap; }
    .v-flash-mini{ flex:1 1 45%; }
    .v-neden,.v-yorum-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
    .v-hero{ padding:34px 0 20px; }
    .v-hero-baslik{ font-size:clamp(2.4rem,11vw,3.2rem); }
    .v-komut{ flex-wrap:wrap; padding:10px; }
    .v-komut input{ flex:1 1 100%; order:1; }
    .v-komut-ikon{ display:none; }
    .v-komut-btn{ flex:1 1 100%; order:2; justify-content:center; }
    .v-nasil{ grid-template-columns:1fr; gap:22px; }
    .v-nasil-cizgi{ display:none; }
    .v-neden,.v-yorum-grid,.v-ikili{ grid-template-columns:1fr; }
    .v-lider-satir a{ grid-template-columns:auto 1fr auto; gap:10px; }
    .v-lider-trend{ display:none; }
}

/* ---- güvenlik / TOTP sayfası ---- */
.v-guv-bas{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:18px; }
.v-guv-durum{ flex:none; font-family:var(--font-display); font-weight:700; font-size:.82rem; padding:6px 13px; border-radius:999px; }
.v-guv-durum.acik{ color:var(--mint); background:color-mix(in srgb,var(--mint) 14%,var(--yuzey)); border:1px solid color-mix(in srgb,var(--mint) 40%,transparent); }
.v-guv-durum.kapali{ color:var(--gri); background:var(--yuzey-2); border:1px solid var(--cizgi); }
.v-guv-form{ margin-top:8px; }
.v-guv-satir{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.v-guv-satir input{ flex:1; min-width:180px; padding:12px 14px; border-radius:10px; }
.v-totp-adim{ margin:0 0 16px; padding-left:20px; color:var(--gri); line-height:1.7; }
.v-totp-adim b{ color:var(--ink); }
.v-totp-kutu{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; background:var(--yuzey-2); border:1px dashed color-mix(in srgb,var(--iris) 40%,var(--cizgi)); border-radius:12px; padding:14px 16px; margin-bottom:10px; }
.v-totp-etiket{ font-family:var(--font-display); font-weight:600; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gri); }
.v-totp-secret{ flex:1; font-family:'Rajdhani',ui-monospace,monospace; font-size:1.2rem; font-weight:700; letter-spacing:.14em; color:var(--iris); word-break:break-all; }
.v-totp-uri{ font-size:.78rem; word-break:break-all; }
.v-totp-uri code{ color:var(--gri); }
.v-totp-kodgiris{ font-family:'Rajdhani',monospace; text-align:center; letter-spacing:.4em; font-size:1.3rem; font-weight:700; max-width:200px; }
.v-guv-ipucu{ color:var(--gri); line-height:1.8; margin:0; padding-left:20px; }
.v-guv-ipucu a{ color:var(--iris); }

/* ---- PDP stok bildirimi (tükendi → haber ver) ---- */
.v-stokbil{ margin-top:14px; padding:16px; border:1px solid var(--cizgi); border-radius:12px; background:var(--yuzey-2); }
.v-stokbil b{ display:block; margin-bottom:4px; }
.v-stokbil p{ color:var(--gri); font-size:.88rem; margin:0 0 12px; }
.v-stokbil-form{ display:flex; gap:8px; flex-wrap:wrap; }
.v-stokbil-form input{ flex:1; min-width:180px; padding:11px 13px; border-radius:10px; }

/* ==========================================================================
   KODVERSE — OYUNLAŞTIRMA (Oyun Merkezi · çark · sezon · başarım · hediye)
   ========================================================================== */
.kv-arena{ padding-bottom:40px; }
.kv-arena-bas{ display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin:6px 0 18px; flex-wrap:wrap; }
.kv-arena-bas .sayfa-baslik{ margin:4px 0 6px; }

.kv-seviye-kart{
    display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:center;
    background:
        radial-gradient(600px 200px at 8% -30%, color-mix(in srgb,var(--sv-renk) 16%, transparent), transparent 70%),
        var(--yuzey-2);
    border:1px solid var(--cizgi); border-radius:var(--radius); padding:22px 24px; margin-bottom:20px;
}
.kv-sv-sol{ display:flex; align-items:center; gap:18px; }
.kv-sv-rozet{ width:70px; height:70px; border-radius:16px; display:flex; align-items:center; justify-content:center; border:1.5px solid; flex-shrink:0; }
.kv-sv-etiket{ font-family:var(--font-display); font-size:.68rem; letter-spacing:.18em; color:var(--gri); display:block; }
.kv-sv-ad{ font-family:var(--font-display); font-size:1.7rem; font-weight:800; line-height:1.05; display:block; }
.kv-sv-perk{ display:inline-block; margin-top:6px; font-size:.78rem; color:var(--mint); background:color-mix(in srgb,var(--mint) 14%, var(--yuzey)); padding:3px 10px; border-radius:999px; border:1px solid color-mix(in srgb,var(--mint) 35%, transparent); }
.kv-xp-ust{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:8px; }
.kv-xp-ust b{ font-family:var(--font-display); font-size:1.25rem; }
.kv-xp-ust small{ color:var(--gri); }
.kv-xpbar{ height:14px; border-radius:999px; background:var(--yuzey-3); overflow:hidden; border:1px solid var(--cizgi); }
.kv-xpbar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--iris),var(--altin)); transition:width .8s cubic-bezier(.2,.8,.2,1); }
.kv-sv-mini{ display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; }
.kv-sv-mini span{ display:inline-flex; align-items:center; gap:6px; font-size:.82rem; color:var(--gri); }
.kv-sv-mini svg{ color:var(--altin); }

.kv-arena-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.kart-blok{ background:var(--yuzey-2); border:1px solid var(--cizgi); border-radius:var(--radius); padding:20px 22px; }
.kart-blok h3{ display:flex; align-items:center; gap:9px; margin:0 0 4px; }
.kart-blok h3 svg{ color:var(--altin); }

.kv-cark-blok{ display:flex; flex-direction:column; align-items:center; text-align:center; }
.kv-cark-blok h3,.kv-cark-blok .alt{ align-self:flex-start; }
.kv-cark-sahne{ position:relative; width:280px; height:280px; margin:14px auto 6px; max-width:78vw; }
.kv-cark-disk{ position:absolute; inset:0; border-radius:50%; border:6px solid var(--yuzey-3); box-shadow:0 0 0 3px var(--panel), var(--golge-yuksek); }
.kv-cark-yazi{ position:absolute; inset:0; display:flex; justify-content:center; transform-origin:50% 50%; padding-top:14px; }
.kv-cark-yazi b{ display:inline-block; font-family:var(--font-display); font-size:.7rem; font-weight:700; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.55); transform-origin:center; white-space:nowrap; }
.kv-cark-gobek{ position:absolute; top:50%; left:50%; width:56px; height:56px; margin:-28px 0 0 -28px; border-radius:50%; background:var(--panel); border:2px solid var(--altin); color:var(--altin); display:flex; align-items:center; justify-content:center; z-index:3; }
.kv-cark-ibre{ position:absolute; top:-10px; left:50%; transform:translateX(-50%); width:0; height:0; border-left:13px solid transparent; border-right:13px solid transparent; border-top:22px solid var(--altin); z-index:4; filter:drop-shadow(0 2px 2px rgba(0,0,0,.5)); }
.kv-cark-btn{ margin-top:14px; min-width:200px; }
.kv-cark-sonuc{ margin-top:12px; font-weight:600; font-family:var(--font-display); }
.kv-cark-sonuc.basari{ color:var(--mint); }
.kv-cark-sonuc.hata{ color:color-mix(in srgb,var(--uyari) 75%, #fff); }

.kv-sezon-yol{ display:flex; gap:12px; overflow-x:auto; padding:12px 2px 6px; scroll-snap-type:x proximity; }
.kv-durak{ flex:0 0 150px; scroll-snap-align:start; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:12px; padding:14px 12px; display:flex; flex-direction:column; gap:5px; position:relative; }
.kv-durak.kilitli{ opacity:.55; }
.kv-durak.acik{ border-color:color-mix(in srgb,var(--altin) 45%, var(--cizgi)); }
.kv-durak.alindi{ border-color:color-mix(in srgb,var(--mint) 45%, var(--cizgi)); }
.kv-durak-ikon{ width:40px; height:40px; border-radius:10px; background:color-mix(in srgb,var(--altin) 16%, var(--yuzey-2)); color:var(--altin); display:flex; align-items:center; justify-content:center; }
.kv-durak b{ font-size:.9rem; font-family:var(--font-display); }
.kv-durak small{ color:var(--gri); font-size:.74rem; line-height:1.3; }
.kv-durak-esik{ font-size:.72rem; color:var(--altin); font-weight:700; font-family:var(--font-display); }
.kv-durak-rozet{ font-size:.75rem; color:var(--mint); font-weight:700; }
.kv-durak-kilit{ font-size:.72rem; color:var(--gri); display:inline-flex; align-items:center; gap:4px; }
.kv-durak-btn{ padding:6px 10px; font-size:.78rem; margin-top:2px; }

.kv-rozet-sayac{ margin-left:auto; font-size:.78rem; color:var(--altin); font-family:var(--font-display); background:color-mix(in srgb,var(--altin) 12%, var(--yuzey)); padding:2px 10px; border-radius:999px; }
.kv-basarim-izgara{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; margin-top:14px; }
.kv-basarim{ display:flex; gap:12px; align-items:flex-start; background:var(--yuzey); border:1px solid var(--cizgi); border-radius:12px; padding:13px 14px; position:relative; opacity:.7; }
.kv-basarim.acik{ opacity:1; border-color:color-mix(in srgb,var(--altin) 40%, var(--cizgi)); }
.kv-basarim-ikon{ width:44px; height:44px; flex-shrink:0; border-radius:11px; background:var(--yuzey-3); color:var(--gri); display:flex; align-items:center; justify-content:center; }
.kv-basarim.acik .kv-basarim-ikon{ background:color-mix(in srgb,var(--altin) 18%, var(--yuzey-2)); color:var(--altin); }
.kv-basarim-govde{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.kv-basarim-govde b{ font-size:.9rem; }
.kv-basarim-govde small{ color:var(--gri); font-size:.76rem; line-height:1.3; }
.kv-basarim-bar{ height:6px; border-radius:999px; background:var(--yuzey-3); overflow:hidden; margin-top:3px; }
.kv-basarim-bar i{ display:block; height:100%; background:var(--iris); border-radius:999px; }
.kv-basarim-ilerleme{ font-size:.7rem; color:var(--gri); }
.kv-basarim-odul{ font-size:.72rem; color:var(--mint); font-weight:700; font-family:var(--font-display); }
.kv-basarim-tik{ position:absolute; top:10px; right:12px; color:var(--mint); font-weight:800; }

.kv-hediye-sayfa{ display:flex; justify-content:center; padding:40px 16px 60px; }
.kv-hediye-kart{ max-width:520px; width:100%; text-align:center; background:var(--yuzey-2); border:1px solid var(--cizgi); border-radius:var(--radius); padding:36px 30px; }
.kv-hediye-ikon{ width:84px; height:84px; margin:0 auto 14px; border-radius:20px; background:color-mix(in srgb,var(--iris) 16%, var(--yuzey-3)); color:var(--iris); display:flex; align-items:center; justify-content:center; }
.kv-hediye-kart h1{ font-size:1.5rem; margin:6px 0 10px; }
.kv-hediye-mesaj{ border-left:3px solid var(--altin); padding:8px 14px; margin:12px 0; color:var(--ink); background:var(--yuzey); border-radius:0 8px 8px 0; text-align:left; }
.kv-hediye-kod{ display:flex; gap:10px; align-items:center; justify-content:center; margin:16px 0; flex-wrap:wrap; }
.kv-hediye-kod code{ font-family:'Consolas',ui-monospace,monospace; font-size:1.15rem; letter-spacing:.06em; background:var(--panel); border:1px dashed var(--altin); color:var(--altin); padding:12px 18px; border-radius:10px; }
.kv-hediye-not{ font-size:.8rem; margin:8px 0 18px; }

/* --- gift/alarm mini-formlar (siparislerim + urun) --- */
.kv-hediye-form,.kv-alarm-form{ display:flex; gap:8px; flex-wrap:wrap; align-items:flex-end; margin-top:10px; }
.kv-hediye-form input,.kv-alarm-form input{ flex:1 1 160px; }
.kv-alarm-kutu{ background:var(--yuzey-2); border:1px solid var(--cizgi); border-radius:12px; padding:14px 16px; margin-top:14px; }
.kv-alarm-kutu h4{ display:flex; align-items:center; gap:7px; margin:0 0 6px; font-size:.95rem; }
.kv-alarm-kutu h4 svg{ color:var(--altin); }

@media (max-width:820px){
    .kv-arena-grid{ grid-template-columns:1fr; }
    .kv-seviye-kart{ grid-template-columns:1fr; gap:16px; }
}

/* --- anasayfa oyunlaştırma showcase --- */
.kv-showcase{ display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:center;
    background:
        radial-gradient(700px 260px at 88% 120%, color-mix(in srgb,var(--iris) 14%, transparent), transparent 65%),
        radial-gradient(500px 200px at 4% -20%, color-mix(in srgb,var(--altin) 9%, transparent), transparent 60%),
        var(--yuzey-2);
    border:1px solid var(--cizgi); border-radius:calc(var(--radius) + 4px); padding:32px 34px; }
.kv-showcase-baslik{ font-size:clamp(1.5rem,3vw,2.1rem); margin:6px 0 10px; }
.kv-showcase-alt{ color:var(--gri); max-width:52ch; margin-bottom:16px; line-height:1.55; }
.kv-showcase-seviye{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.kv-sv-chip{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-display); font-size:.76rem; font-weight:600;
    padding:5px 11px; border-radius:999px; color:var(--c); border:1px solid color-mix(in srgb,var(--c) 40%, var(--cizgi));
    background:color-mix(in srgb,var(--c) 12%, var(--yuzey)); }
.kv-showcase-sag{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.kv-showcase-oge{ background:var(--yuzey); border:1px solid var(--cizgi); border-radius:14px; padding:16px 15px; display:flex; flex-direction:column; gap:4px; }
.kv-showcase-ikon{ width:42px; height:42px; border-radius:11px; background:color-mix(in srgb,var(--iris) 14%, var(--yuzey-2)); color:var(--iris); display:flex; align-items:center; justify-content:center; margin-bottom:4px; }
.kv-showcase-oge b{ font-family:var(--font-display); font-size:.95rem; }
.kv-showcase-oge small{ color:var(--gri); font-size:.78rem; line-height:1.35; }
.kv-nav-oyun{ color:var(--altin) !important; }
@media (max-width:860px){
    .kv-showcase{ grid-template-columns:1fr; padding:24px 20px; }
}
@media (max-width:480px){
    .kv-showcase-sag{ grid-template-columns:1fr; }
}