/* ====================================================================
   mm2.money — satis ekrani
   --------------------------------------------------------------------
   TASARIM BIZIM: inci beyazi + buz mavisi zemin, camdan yuzen menu,
   cizili arka plan, NOTR kart (secilince ICE BASILMIS), beyaz hap sayac
   kartin ICINDE sag ustte, Robux sag altta, Pop tik sesi.

   mm2.cash'ten alinan YALNIZCA DUZEN MANTIGI:
     hesap cipleri + My/All sekmesi
     tur sayaclari (All / Guns / Knives)
     Filters dugmesi + siralama acilir menusu
     yogun izgara ve ilk hucrede tarama kutusu
     sagda sabit yukseklikte sepet + kendi kaydirma cubugu
   Renk/kart/menu ONUN DEGIL, bizim.
   ==================================================================== */

/* YAZI TIPI: InterVariable (rsms/inter 4.x, SIL OFL — assets/fonts/InterVariable-OFL.txt).
   StarPETS ile ayni yuz. Yedek yuz Arial; olculeri InterVariable'a ayarli, yuklenirken ziplama olmaz. */
@font-face { font-family:"InterVariable"; src:url("/assets/fonts/InterVariable.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:optional; }   /* 2026-10-15: swap ilk acilista yazilari sonradan kalinlastirip basligi buyutuyordu; optional = kayma yok (font onbellekte hep kullanilir) */
@font-face { font-family:"InterVariable Fallback"; src:local("Arial"), local("ArialMT");
  font-weight:100 550; size-adjust:105.2%; ascent-override:92.09%; descent-override:22.93%; line-gap-override:0%; }
@font-face { font-family:"InterVariable Fallback"; src:local("Arial Bold"), local("Arial-BoldMT");
  font-weight:551 900; size-adjust:101%; ascent-override:95.92%; descent-override:23.88%; line-gap-override:0%; }

:root {
  --zemin:#EEF3FB;
  --inci:#FFFFFF;
  --buz:#E7EFFB;
  --buz-2:#DCE8F8;
  --cam:rgba(255,255,255,.72);
  --cizgi:rgba(15,42,86,.10);
  --cizgi-2:rgba(15,42,86,.17);

  --ink:#0F2A56; --ink-2:#5A7196; --ink-3:#8EA2C0;

  --mavi:#2563EB; --mavi-koyu:#1D4ED8; --mavi-sis:rgba(37,99,235,.10); --mavi-ln:rgba(37,99,235,.38);

  --godly:#B45309; --ancient:#6D28D9; --chroma:#0E7490;
  --vintage:#1D4ED8; --legendary:#C2410C; --unique:#BE185D; --common:#64748B;

  --golge:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06);
  --gecis:190ms cubic-bezier(.4,0,.2,1);

  /* Tek olcu birimi: sayfa bosluğu + panel ic boslugu + 1px cerceve.
     Menunun yan ic boslugu da bu -> baslik ile envanter AYNI eksende. */
  --sayfa:16px;      /* sayfanin yan boslugu (baslik sarmali da ayni) */
  --panel-ic:16px;   /* panel ic boslugu; baslik da bunu kullanir */
  --en:1760px;       /* hem baslik hem govde icin tek max-width */
  --yazi:"InterVariable","InterVariable Fallback",Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

* { box-sizing:border-box; }
/* Activity/Help uzun, satis ekrani degil; cubuk gelip gidince viewport
   genisligi oynuyor ve baslik buyuyup kuculuyordu. Yer hep ayrilsin. */
html { scrollbar-gutter:stable; }
html { max-width:100%; overflow-x:hidden; }
/* body'de overflow-x:hidden VARDI: body'yi de kaydirma kabi yapiyor ve
   Activity/Help'te body kendi dikey cubugunu cikariyordu -> serit 15px
   daraliyordu (olculdu: body clientWidth 1470 vs 1485). Yalniz html
   kaydirma kabi olsun. */
body { max-width:100%; }
body { margin:0; background:var(--zemin); color:var(--ink);
  font:400 14px/1.5 var(--yazi); letter-spacing:-.006em;
  font-optical-sizing:auto; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  font-variant-numeric:tabular-nums; text-rendering:optimizeLegibility; }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input { font:inherit; }
.para { font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; } }

/* ===================================================== sayfa gecisi */
/* ---- sayfa gecisi --------------------------------------------------- */
@view-transition { navigation: auto; }

@keyframes sayfaGir { from { opacity:0; transform:translateY(10px); } }
@keyframes sayfaCik { to { opacity:0; transform:translateY(-8px); } }

::view-transition-old(root) { animation:sayfaCik 180ms cubic-bezier(.4,0,1,1) both; }
::view-transition-new(root) { animation:sayfaGir 260ms cubic-bezier(0,0,.2,1) both; }

/* View Transitions desteklenmeyen tarayicide de bos durmasin */
.sayfa { animation:sayfaGir 300ms cubic-bezier(0,0,.2,1) both; }
body.cikis .sayfa { animation:sayfaCik 150ms cubic-bezier(.4,0,1,1) both; }

/* Baslik gecis boyunca SABIT kalsin: sayfalar arasinda kaymaz. */
.menu-sar { view-transition-name:ust-serit; }
.fon { view-transition-name:zemin; }

@media (prefers-reduced-motion:reduce) {
  ::view-transition-old(root), ::view-transition-new(root), .sayfa { animation:none !important; }
}

/* ======================================================== arka plan */
.fon { position:fixed; inset:0; z-index:-1; pointer-events:none; overflow:hidden; }
.fon svg { position:absolute; inset:0; width:100%; height:100%; }
.fon::after { content:""; position:absolute; inset:0;
  background:radial-gradient(1200px 640px at 50% 30%, rgba(255,255,255,.6), transparent 70%); }

/* ============================================================== menu */
/* Baslik sarmali GOVDE ile ayni kutu: ayni max-width, ayni yan bosluk.
   Boylece seridin kenarlari sol panel ve sepetin kenarlariyla cakisir. */
.menu-sar { position:sticky; top:0; z-index:60; max-width:var(--en); margin:0 auto;
  padding:12px var(--sayfa) 0; }
.menu {
  height:52px; max-width:none; padding:0 var(--panel-ic);
  display:flex; align-items:center; gap:14px;
  background:var(--cam);
  -webkit-backdrop-filter:blur(16px) saturate(170%); backdrop-filter:blur(16px) saturate(170%);
  border:1px solid var(--kd-kenar, rgba(255,255,255,.75));
  box-shadow:0 1px 2px rgba(15,42,86,.04), 0 10px 30px rgba(15,42,86,.09);
  border-radius:99px;
}
.marka { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:800; letter-spacing:-.035em; }
.marka svg { width:19px; height:19px; }
.marka span { color:var(--mavi); }
.menu nav { display:flex; gap:2px; margin:0 auto; }
.menu nav button { display:inline-flex; align-items:center; gap:7px; height:36px; padding:0 14px;
  border-radius:99px; font-size:14.5px; font-weight:600; color:var(--ink-2);
  transition:background var(--gecis), color var(--gecis); }
.menu nav button:hover { background:rgba(var(--kd-cam, 255,255,255), .7); color:var(--ink); }
.menu nav button.acik { background:var(--mavi-sis); color:var(--mavi-koyu); }
.menu nav button svg { width:15px; height:15px; }
.bakiye { display:flex; align-items:center; gap:7px; height:36px; padding:0 12px; border-radius:99px;
  background:rgba(var(--kd-cam, 255,255,255), .66); border:1px solid var(--cizgi); font-size:13.5px; font-weight:700; }
.bakiye small { color:var(--ink-3); font-weight:600; font-size:11.5px; }
.profil { display:flex; align-items:center; gap:7px; height:36px; padding:0 11px 0 4px; border-radius:99px;
  background:rgba(var(--kd-cam, 255,255,255), .66); border:1px solid var(--cizgi); font-size:13.5px; font-weight:600;
  transition:border-color var(--gecis); }
.profil:hover { border-color:var(--cizgi-2); }
.profil img { width:28px; height:28px; border-radius:50%; background:var(--buz); }
.profil i { width:7px; height:7px; border-radius:50%; background:#16A34A; box-shadow:0 0 0 3px rgba(22,163,74,.18); }

/* ============================================================= govde */
.govde { max-width:var(--en); margin:0 auto; padding:var(--sayfa); }
.calisma { display:grid; grid-template-columns:minmax(0,1fr) 352px; gap:16px; align-items:start;
  height:calc(100vh - 92px); }

.yuzey {
  background:var(--cam);
  -webkit-backdrop-filter:blur(14px) saturate(160%); backdrop-filter:blur(14px) saturate(160%);
  border:1px solid var(--kd-kenar, rgba(255,255,255,.72)); border-radius:20px; box-shadow:var(--golge);
}
.sol-kol { display:flex; flex-direction:column; min-width:0; min-height:0;
  padding:var(--panel-ic) var(--panel-ic) 10px; height:100%; }

/* ========================================================= hesaplar */
/* ---------------------------------------------------- hesap cipleri
   Kartlarla AYNI dil: cerceve yok, secili olan ICE BASILMIS, tiklayinca
   ayni basma animasyonu ve ayni Pop sesi.
   HIZA: cipler ~40px, "+" dugmesi 32px idi — ayni satirda iki ayri
   yukseklik ve iki ayri kose yaricapi vardi. Hepsi 44px / 13px. */
.hesaplar { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:11px; }
.hesap { display:flex; align-items:center; gap:10px; height:44px; padding:0 14px 0 7px;
  background:var(--inci); border:0; border-radius:13px; cursor:pointer; user-select:none;
  box-shadow:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06);
  transition:box-shadow var(--gecis), transform var(--gecis), background var(--gecis); }
.hesap:hover { box-shadow:0 2px 6px rgba(15,42,86,.07), 0 8px 20px rgba(15,42,86,.1); }
.hesap.on { background:var(--kd-basik, #FAFBFC); transform:translateY(1px);
  box-shadow:inset 0 2px 8px rgba(15,42,86,.14), inset 0 0 0 1px rgba(15,42,86,.09); }
.hesap.bas, .hesap-ek.bas { animation:kartBas .22s cubic-bezier(.3,1.1,.4,1); }
/* BASILI TUTARKEN ice basilmis — secili kartin golgesiyle birebir ayni.
   Birakinca .bas animasyonu devrali, gecis kesintisiz. */
.hesap:active, .hesap-ek:active { background:var(--kd-basik, #FAFBFC); transform:translateY(1px);
  box-shadow:inset 0 2px 8px rgba(15,42,86,.14), inset 0 0 0 1px rgba(15,42,86,.09);
  transition:none; }
.hesap img { width:30px; height:30px; border-radius:9px; background:var(--buz);
  object-fit:cover; flex:0 0 auto; }
.hesap span { display:flex; flex-direction:column; justify-content:center; min-width:0; }
.hesap b { display:block; font-size:12.5px; font-weight:700; line-height:1.2; letter-spacing:-.01em; }
.hesap small { display:block; font-size:11px; color:var(--ink-3); font-weight:500; line-height:1.3; }
.hesap-ek { width:44px; height:44px; border-radius:13px; background:var(--inci); border:0;
  display:grid; place-items:center; color:var(--ink-3); cursor:pointer;
  box-shadow:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06);
  transition:box-shadow var(--gecis), color var(--gecis), transform var(--gecis); }
.hesap-ek:hover { color:var(--mavi-koyu);
  box-shadow:0 2px 6px rgba(15,42,86,.07), 0 8px 20px rgba(15,42,86,.1); }
.hesap-ek svg { width:17px; height:17px; }
.hesaplar .bosluk { flex:1; }

/* =========================================================== araclar */
.arac { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:11px; }

.seg { display:inline-flex; gap:2px; padding:3px; border-radius:10px; background:var(--buz); }
.seg button { display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 12px; border-radius:7px;
  font-size:12.5px; font-weight:600; color:var(--ink-2); white-space:nowrap;
  transition:background var(--gecis), color var(--gecis); }
.seg button:hover { color:var(--ink); }
.seg button.on { background:var(--inci); color:var(--mavi-koyu); box-shadow:0 1px 3px rgba(15,42,86,.12); }
.seg button em { font-style:normal; font-size:11px; font-weight:700; color:var(--ink-3); }
.seg button.on em { color:var(--mavi); }

.ara { position:relative; flex:1 1 240px; min-width:170px; }
.ara svg { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:15px; height:15px; color:var(--ink-3); }
.ara input { width:100%; height:36px; padding:0 12px 0 34px; border-radius:10px;
  background:var(--inci); border:1px solid var(--cizgi); color:var(--ink); font-size:13.5px; }
.ara input::placeholder { color:var(--ink-3); }
/* Tiklayinca golge/hale CIKMIYOR -- kullanici istegi. */
.ara input:focus { outline:none; border-color:var(--cizgi-2); box-shadow:none; }

.dugme { display:inline-flex; align-items:center; gap:8px; height:36px; padding:0 12px; border-radius:10px;
  background:var(--inci); border:1px solid var(--cizgi); font-size:12.5px; font-weight:700; color:var(--ink-2);
  white-space:nowrap; transition:border-color var(--gecis), color var(--gecis); }
.dugme:hover { border-color:var(--cizgi-2); color:var(--ink); }
.dugme svg { width:15px; height:15px; }
.dugme .ok { width:13px; height:13px; transition:transform var(--gecis); }
.sira.acik .dugme .ok { transform:rotate(180deg); }

.sira { position:relative; }
.menu-ac { position:absolute; right:0; top:calc(100% + 6px); z-index:40; min-width:210px; padding:5px;
  background:var(--kd-yuzey, #fff); border-radius:13px; box-shadow:0 10px 32px rgba(15,42,86,.2), 0 0 0 1px var(--cizgi); display:none; }
.sira.acik .menu-ac { display:block; animation:menuGel .15s ease both; }
@keyframes menuGel { from { opacity:0; transform:translateY(-5px); } }
.menu-ac button { display:flex; align-items:center; gap:9px; width:100%; height:35px; padding:0 11px;
  border-radius:9px; font-size:13px; font-weight:600; color:var(--ink-2); text-align:left; }
.menu-ac button:hover { background:var(--buz); color:var(--ink); }
/* Secili siralama TURUNCUYDU (#F59E0B) — paletin disindaydi, kullanici
   sordu. Sayfanin mavisine cekildi. */
.menu-ac button.on { background:var(--mavi-sis); color:var(--mavi-koyu); font-weight:700; }
.menu-ac button.on .nk { background:var(--mavi); }
.menu-ac .nk { width:7px; height:7px; border-radius:50%; background:currentColor; opacity:0; flex:0 0 auto; }
.menu-ac button.on .nk { opacity:1; }
.menu-ac svg { width:15px; height:15px; flex:0 0 auto; }

.filtre-gizli { display:none; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:11px;
  padding:11px 13px; background:var(--buz); border-radius:12px; }
.filtre-gizli.acik { display:flex; animation:menuGel .17s ease both; }
.filtre-gizli > span { font-size:12px; font-weight:700; color:var(--ink-2); }
.aralik { display:inline-flex; align-items:center; gap:6px; }
.aralik input { width:84px; height:32px; border-radius:9px; background:var(--inci); border:1px solid var(--cizgi);
  padding:0 9px; font-size:12.5px; outline:none; text-align:center; font-variant-numeric:tabular-nums; }
.aralik input:focus { border-color:var(--cizgi-2); }
.aralik span { color:var(--ink-3); font-size:12px; }
.adetf { display:inline-flex; align-items:center; gap:3px; background:var(--inci); border:1px solid var(--cizgi);
  border-radius:9px; padding:3px; }
.adetf button { width:25px; height:26px; border-radius:7px; font-weight:800; color:var(--ink-2); }
.adetf button:hover { background:var(--buz); color:var(--ink); }
.adetf b { min-width:46px; text-align:center; font-size:12px; font-weight:700; }
.temizle { height:32px; padding:0 12px; border-radius:9px; background:var(--inci); border:1px solid var(--cizgi);
  font-size:12.5px; font-weight:700; color:var(--ink-2); }
.temizle:hover { border-color:var(--cizgi-2); color:var(--ink); }
.sonuc { margin-left:auto; font-size:12px; color:var(--ink-3); font-weight:600; }

/* Quick select — sadece Everything ve Clear */
/* ------------------------------------------------- nadirlik suzgeci */
.nadirf { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.nadirf button { display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 10px;
  border-radius:8px; background:var(--inci); border:1px solid var(--cizgi);
  font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  color:var(--n,var(--common)); transition:background var(--gecis), border-color var(--gecis), color var(--gecis); }
.nadirf button::before { content:""; width:7px; height:7px; border-radius:2px;
  background:var(--n,var(--common)); flex:0 0 auto; }
.nadirf button:hover { border-color:var(--n,var(--cizgi-2)); }
.nadirf button.on { background:color-mix(in srgb, var(--n) 12%, var(--kd-yuzey, #fff));
  border-color:color-mix(in srgb, var(--n) 45%, var(--kd-kenar, #fff)); }
.nadirf button em { font-style:normal; font-size:10.5px; font-weight:700; color:var(--ink-3);
  letter-spacing:0; }
.nadirf button.on em { color:var(--n); }

.hizli { display:flex; align-items:center; gap:8px; margin-bottom:11px; font-size:12.5px; color:var(--ink-2); }
.hizli > span { font-weight:700; }
.hizli button { height:29px; padding:0 13px; border-radius:99px; background:var(--inci); border:1px solid var(--cizgi);
  font-size:12.5px; font-weight:700; color:var(--ink-2); transition:all var(--gecis); }
.hizli button:hover { border-color:var(--mavi-ln); color:var(--mavi-koyu); background:var(--mavi-sis); }

/* ============================================================ izgara */
/* padding sol 2px kart golgesi kirpilmasin diye; negatif kenarla geri alinip
   kartlarin sol kenari arama kutusuyla ayni eksene getiriliyor. */
.izgara-sar { flex:1; min-height:0; overflow-y:auto; margin:0 -2px; padding:2px 10px 10px 2px;
    }
.izgara-sar::-webkit-scrollbar { width:9px; }
.izgara-sar::-webkit-scrollbar-track { background:transparent; }
.izgara-sar::-webkit-scrollbar-thumb { background:var(--cizgi-2); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
.izgara-sar::-webkit-scrollbar-thumb:hover { background:var(--ink-3); background-clip:content-box; }

.izgara { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:11px; }
@media (max-width:1560px){ .izgara{grid-template-columns:repeat(6,minmax(0,1fr));} }
@media (max-width:1320px){ .izgara{grid-template-columns:repeat(5,minmax(0,1fr));} }
@media (max-width:1080px){ .izgara{grid-template-columns:repeat(4,minmax(0,1fr));} }
@media (max-width:760px){ .izgara{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:520px){ .izgara{grid-template-columns:repeat(2,minmax(0,1fr));} }

/* tarama kutusu: izgaranin ilk hucresi */
.tara-kutu { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px;
  min-height:198px; background:var(--buz); border:1px dashed var(--cizgi-2); border-radius:14px; color:var(--ink-2);
  transition:background var(--gecis), color var(--gecis), border-color var(--gecis); }
.tara-kutu:hover { background:var(--buz-2); color:var(--ink); border-color:var(--mavi-ln); }
.tara-kutu .ikon { width:38px; height:38px; border-radius:11px; background:var(--mavi); color:#fff; display:grid; place-items:center; }
.tara-kutu .ikon svg { width:19px; height:19px; }
.tara-kutu b { font-size:12.5px; font-weight:700; }
.tara-kutu.donuyor .ikon svg { animation:don .9s linear infinite; }
@keyframes don { to { transform:rotate(360deg); } }

/* -------------------------------------------------------------- KART
   SENIN ONAYLADIGIN KART: notr, secilince ICE BASILMIS, renk yok.
   Hap sayac kartin ICINDE sag ustte; Robux sag altta. */
.kart { position:relative; background:var(--inci); border:0; border-radius:14px; padding:11px 11px 10px;
  cursor:pointer; user-select:none; min-height:198px; display:flex; flex-direction:column;
  box-shadow:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06);
  transition:box-shadow var(--gecis), transform var(--gecis), background var(--gecis); }
.kart:hover { box-shadow:0 2px 6px rgba(15,42,86,.07), 0 8px 20px rgba(15,42,86,.1); }
.kart.secili { background:var(--kd-basik, #FAFBFC); transform:translateY(1px);
  box-shadow:inset 0 2px 8px rgba(15,42,86,.14), inset 0 0 0 1px rgba(15,42,86,.09); }
.kart.bas { animation:kartBas .22s cubic-bezier(.3,1.1,.4,1); }
@keyframes kartBas { 0% { transform:translateY(4px) scale(.978); } 100% { transform:translateY(1px) scale(1); } }

.kart .nadir { display:block; font-size:9.5px; font-weight:800; letter-spacing:.09em; text-transform:uppercase;
  color:var(--nadir,var(--common)); }
.kart .sahip { position:absolute; top:11px; right:12px; font-size:10px; font-weight:700; color:var(--ink-3);
  transition:opacity var(--gecis); }
.kart.secili .sahip { opacity:0; }
.kart figure { position:relative; flex:1; margin:5px 0 7px; display:grid; place-items:center; min-height:0; }
.kart figure img { max-width:82%; max-height:108px; object-fit:contain; }
.kart figure::before { content:""; position:absolute; inset:5% 11%; border-radius:50%;
  filter:blur(19px); opacity:.18; background:var(--nadir,var(--common)); }
.kart .alt { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; }
.kart .sol { min-width:0; }
.kart .ad { display:block; font-size:12.5px; font-weight:600; letter-spacing:-.015em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kart .fiyat { display:block; font-size:17px; font-weight:800; letter-spacing:-.025em; }
.kart .rbx { font-size:11px; font-weight:600; color:var(--ink-3); white-space:nowrap; padding-bottom:2px; }

/* hap sayac — kartin ICINDE, sag ustte */
.kart .hap { position:absolute; right:9px; top:9px; z-index:5; display:none; align-items:center; gap:2px;
  background:var(--kd-yuzey, #fff); border-radius:99px; padding:3px 4px;
  box-shadow:0 2px 5px rgba(15,42,86,.1), 0 7px 18px rgba(15,42,86,.15); }
.kart.secili .hap { display:inline-flex; }
/* Animasyon SINIFLA tetikleniyor: dogrudan .hap uzerinde dursa her
   yeniden cizimde butun secili kartlarda bastan oynardi. */
.kart .hap.gir { animation:hapGel .24s cubic-bezier(.25,1.3,.4,1) both; }
@keyframes hapGel { from { opacity:0; transform:translateY(-6px) scale(.86); } }
.kart .hap button { width:21px; height:21px; border-radius:50%; display:grid; place-items:center;
  color:var(--ink-2); font-weight:800; line-height:1; font-size:13px;
  transition:background var(--gecis), color var(--gecis); }
.kart .hap button:hover:not(:disabled){ background:var(--buz); color:var(--ink); }
.kart .hap button:disabled { opacity:.28; cursor:default; }
.kart .hap button.cop { color:var(--ink-3); }
.kart .hap button.cop svg { width:12px; height:12px; }
.kart .hap button.cop:hover { background:var(--kd-kirmizi, #FEE2E2); color:#DC2626; }
.kart .hap b { min-width:17px; text-align:center; font-size:12px; font-weight:700; }

.bos { grid-column:1/-1; padding:46px 20px; text-align:center; color:var(--ink-3); font-size:13.5px; }

/* ============================================================= sepet */
.sepet { display:flex; flex-direction:column; min-height:0; height:100%; overflow:hidden; padding:0; }
.sepet-ust { display:flex; align-items:center; gap:9px;
  padding:15px var(--panel-ic) 12px; border-bottom:1px solid var(--cizgi); }
.sepet-ust b { flex:1; font-size:14.5px; font-weight:800; letter-spacing:-.02em; }
.sepet-ust .sil-hepsi { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--ink-3); }
.sepet-ust .sil-hepsi:hover { color:#DC2626; }
.sepet-ust .sil-hepsi svg { width:14px; height:14px; }

.sepet-liste { flex:1; min-height:0; overflow-y:auto; padding:4px var(--panel-ic);
    }
.sepet-liste::-webkit-scrollbar { width:8px; }
.sepet-liste::-webkit-scrollbar-track { background:transparent; }
.sepet-liste::-webkit-scrollbar-thumb { background:var(--cizgi-2); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
.sepet-liste::-webkit-scrollbar-thumb:hover { background:var(--ink-3); background-clip:content-box; }

.psat { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--cizgi); }
.psat:last-child { border-bottom:0; }
.psat .kk { width:38px; height:38px; border-radius:10px; background:var(--buz); display:grid; place-items:center; flex:0 0 auto; }
.psat .kk img { max-width:76%; max-height:76%; object-fit:contain; }
.psat .ortasi { flex:1; min-width:0; }
.psat .ortasi b { display:block; font-size:12.5px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.psat .ortasi small { font-size:11px; color:var(--ink-3); }
.psat .ptt { font-size:13px; font-weight:800; letter-spacing:-.02em; }
.psat .px { color:var(--ink-3); padding:4px; border-radius:7px; line-height:0; }
.psat .px:hover { color:#DC2626; background:var(--kd-kirmizi, #FEE2E2); }
.pyok { padding:40px 10px; text-align:center; color:var(--ink-3); font-size:12.5px; }

.sepet-alt { padding:12px var(--panel-ic) 15px; border-top:1px solid var(--cizgi); }
.sepet-sat { display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:var(--ink-2);
  padding-bottom:10px; border-bottom:1px solid var(--cizgi); margin-bottom:11px; }
.sepet-sat b { color:var(--ink); font-weight:700; }
.alirsin { font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); }
.sepet-tut { display:flex; align-items:baseline; gap:8px; }
.sepet-tut b { font-size:30px; font-weight:800; letter-spacing:-.03em; line-height:1.03; }
.sepet-tut span { font-size:12px; font-weight:700; color:var(--ink-3); }
.sepet-rbx { font-size:11.5px; color:var(--ink-3); margin:2px 0 12px; }

.sat-btn { width:100%; height:42px; border-radius:11px; background:var(--mavi); color:#fff;
  font-size:14px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  box-shadow:0 2px 10px rgba(37,99,235,.3); transition:background var(--gecis); }
.sat-btn:hover:not(:disabled){ background:var(--mavi-koyu); }
.sat-btn:disabled { background:var(--buz-2); color:var(--ink-3); box-shadow:none; cursor:default; }
.sat-btn svg { width:15px; height:15px; }
.sepet .guven { margin-top:9px; text-align:center; font-size:11px; color:var(--ink-3); }
.sepet .guven b { color:var(--ink-2); }

/* ------------------------------------------------ hesap ekle penceresi */
.hsp-dlg { width:min(420px,calc(100vw - 32px)); padding:0; border:0; border-radius:20px;
  background:rgba(var(--kd-cam, 255,255,255), .96);
  -webkit-backdrop-filter:blur(18px) saturate(170%); backdrop-filter:blur(18px) saturate(170%);
  box-shadow:0 24px 70px rgba(15,42,86,.28), 0 0 0 1px var(--kd-halka, rgba(255,255,255,.8));
  color:var(--ink); overflow:visible; }
.hsp-dlg::backdrop { background:rgba(15,42,86,.3);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.hsp-dlg[open] { animation:hspGel .26s cubic-bezier(.25,1.2,.4,1) both; }
.hsp-dlg[open]::backdrop { animation:hspFon .26s ease both; }
@keyframes hspGel { from { opacity:0; transform:translateY(10px) scale(.95); } }
@keyframes hspFon { from { opacity:0; } }

.hsp-ic { padding:22px; }
.hsp-bas { display:flex; align-items:flex-start; gap:12px; margin-bottom:16px; }
.hsp-sim { width:40px; height:40px; border-radius:13px; background:var(--mavi-sis); color:var(--mavi-koyu);
  display:grid; place-items:center; flex:0 0 auto; }
.hsp-sim svg { width:19px; height:19px; }
.hsp-bas h3 { margin:0 0 3px; font-size:17px; font-weight:800; letter-spacing:-.035em; }
.hsp-bas p { margin:0; font-size:12.5px; color:var(--ink-2); line-height:1.5; }
.hsp-kapat { margin-left:auto; width:30px; height:30px; border-radius:9px; color:var(--ink-3);
  display:grid; place-items:center; flex:0 0 auto; }
.hsp-kapat:hover { background:var(--buz); color:var(--ink); }
.hsp-kapat svg { width:15px; height:15px; }

.hsp-alan { margin-bottom:14px; }
.hsp-alan label { display:block; margin-bottom:6px; font-size:11px; font-weight:800;
  letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); }
.hsp-alan input { width:100%; height:44px; padding:0 14px; border-radius:13px;
  background:var(--inci); border:1px solid var(--cizgi); font-size:14.5px; color:var(--ink); }
.hsp-alan input:focus { outline:none; border-color:var(--mavi-ln); }
.hsp-alan input::placeholder { color:var(--ink-3); }
.hsp-not { display:flex; gap:9px; padding:11px 13px; border-radius:13px; background:var(--buz);
  font-size:12px; color:var(--ink-2); line-height:1.5; margin-bottom:16px; }
.hsp-not svg { width:15px; height:15px; color:var(--mavi); flex:0 0 auto; margin-top:1px; }
.hsp-dugmeler { display:flex; gap:9px; }
.hsp-dugmeler button { height:44px; border-radius:13px; font-size:14px; font-weight:700; }
.hsp-vazgec { flex:0 0 auto; padding:0 18px; background:var(--inci); border:1px solid var(--cizgi);
  color:var(--ink-2); }
.hsp-vazgec:hover { border-color:var(--cizgi-2); color:var(--ink); }
.hsp-ekle { flex:1; background:var(--mavi); color:#fff; box-shadow:0 2px 10px rgba(37,99,235,.3);
  display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.hsp-ekle:hover { background:var(--mavi-koyu); }
.hsp-ekle:active { transform:translateY(1px); }
.hsp-ekle svg { width:15px; height:15px; }

/* ========================================================= cekmeceler */
.perde { position:fixed; inset:0; z-index:80; background:rgba(15,42,86,.26);
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
  opacity:0; pointer-events:none; transition:opacity var(--gecis); }
.perde.acik { opacity:1; pointer-events:auto; }
.cekmece { position:fixed; top:0; right:0; bottom:0; z-index:90; width:min(400px,92vw);
  background:rgba(var(--kd-cam, 255,255,255), .93);
  -webkit-backdrop-filter:blur(18px) saturate(170%); backdrop-filter:blur(18px) saturate(170%);
  border-left:1px solid var(--kd-kenar, rgba(255,255,255,.8)); box-shadow:-18px 0 50px rgba(15,42,86,.16);
  transform:translateX(100%); transition:transform 260ms cubic-bezier(.4,0,.2,1);
  padding:18px; overflow:auto; }
.cekmece.acik { transform:none; }
.cekmece-ust { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.cekmece-ust h2 { margin:0; font-size:18px; font-weight:800; letter-spacing:-.03em; }
.cekmece-ust button { color:var(--ink-3); line-height:0; padding:5px; border-radius:8px; }
.cekmece-ust button:hover { background:var(--buz); color:var(--ink); }
.olay { display:flex; gap:10px; padding:11px 0; border-bottom:1px solid var(--cizgi); }
.olay:last-child { border-bottom:0; }
.olay .nokta { width:8px; height:8px; border-radius:50%; margin-top:6px; flex:0 0 auto; background:var(--mavi); }
.olay .nokta.bitti { background:#16A34A; }
.olay .nokta.bekler { background:var(--ink-3); }
.olay b { display:block; font-size:13.5px; font-weight:600; }
.olay small { color:var(--ink-2); font-size:12px; }
.olay .tut { margin-left:auto; font-size:13px; font-weight:700; white-space:nowrap; }
.sss { padding:11px 0; border-bottom:1px solid var(--cizgi); }
.sss:last-child { border-bottom:0; }
.sss b { display:block; font-size:13.5px; font-weight:600; margin-bottom:3px; }
.sss p { margin:0; color:var(--ink-2); font-size:12.5px; }

/* ============================================================== mobil */
@media (max-width:980px) {
  .calisma { grid-template-columns:minmax(0,1fr); height:auto; }
  .izgara-sar { overflow:visible; }
  .sepet { position:fixed; left:0; right:0; bottom:0; top:auto; z-index:60; height:auto; max-height:54vh;
    border-radius:18px 18px 0 0; box-shadow:0 -10px 34px rgba(15,42,86,.16); }
  .sepet-liste { max-height:22vh; }
  body { padding-bottom:300px; }
  .menu nav button span { display:none; }
  .menu nav button { padding:0 11px; }
  .bakiye small { display:none; }
}
@media (max-width:560px) {
  :root { --sayfa:12px; --panel-ic:13px; }   /* baslik ve panel birlikte kuculur */
  .profil b { display:none; }
}

/* ============================================ KOPYALAMA KORUMASI (2026-10-12)
   Yazi secilmez, gorsel suruklenmez, telefonda uzun basinca "resmi kaydet"
   balonu cikmaz. Giris kutulari ve hesap dogrulama metni HARIC. */
body { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
input, textarea, [contenteditable="true"], .aa2-code-val, .aa2-codepart {
  -webkit-user-select:text; user-select:text; -webkit-touch-callout:default; }
img, svg, figure { -webkit-user-drag:none; user-drag:none; }
.kart img { pointer-events:none; }
/* basili tutup secerken: imlec ve dokunma vurgusu */
.kart { -webkit-tap-highlight-color:transparent; }
html.boyuyor, html.boyuyor * { cursor:pointer !important; }

/* ============================================ TELEFON UST MENU (2026-10-12)
   390px'te icerik 412px'ti, sigacak alan 340px: sayfa 438px'e genisliyor,
   sepet ve baslik sagdan kesiliyordu; T63'te sekmeler de bos gorunuyordu.
   Telefonda sekmeler ikinci satira iner, yazilariyla. */
@media (max-width:560px) {
  /* menu.css'te "body.t23-govde .menu { height:56px }" var: daha guclu secici sart */
  html body .menu-sar .menu { height:auto; min-height:52px; flex-wrap:wrap; row-gap:0; column-gap:10px;
    padding:6px var(--panel-ic) 4px; }
  .menu .marka { order:1; height:40px; }
  .menu .sag-grup { order:2; margin-left:auto; }
  .menu nav { order:3; flex:1 0 100%; justify-content:center; gap:2px; margin:2px 0 0; padding-top:3px;
    border-top:1px solid var(--cizgi); }
  .menu nav button span { display:inline; }
  .menu nav button { height:34px; padding:0 13px; font-size:13.5px; }
}

/* COK ESYADA AKICILIK (2026-10-12): ekran disindaki kartlar cizilmez, yer tutucu boyu = kart boyu */
.izgara .kart { content-visibility:auto; contain-intrinsic-size:auto 198px; }

/* ================================================ TEK YAZI TIPI (2026-10-12)
   Her yerde InterVariable: baslik (bakiye eskiden ui-monospace), hesap baglama
   penceresi (mm2.cash'ten gelen Rubik / Space Grotesk / JetBrains Mono), dugme
   ve girdi varsayilanlari. Ikon fontlari (Font Awesome: class'inda "fa-") HARIC.
   --yazi degiskeni uzerinden: menu.js ?f= / ?yazi=eski secenekleri calismaya devam eder. */
body *:not([class*="fa-"]):not(.fa) { font-family:var(--yazi) !important; }
button, input, select, textarea { font:inherit; }
/* rakamlar alt alta hizali dursun */
.bakiye span, .para, .fiyat, .rbx, .sepet-tut b, .sepet-sat b, .psk-fy b, .ozet b, .sh-sayi b, .sh-deger b, .aa2-code-val { font-variant-numeric:tabular-nums; }
/* bakiye eskiden es aralikli yaziydi: yeni yuzde ayni agirlik, hafif sik */
body.ust-63 .bakiye span { font-weight:800; letter-spacing:-.02em; }

/* BOYUT ZIPLAMASI (2026-10-12): az esyada izgaranin kaydirma cubugu kayboluyor, alan 10px genisleyip
   kartlar ve Scan kutusu buyuyordu (olculdu 150.3 -> 152px). Cubugun yeri HER ZAMAN ayrilir. */
.izgara-sar, .sepet-liste { scrollbar-gutter:stable; }
/* sepet kartlari ORTALI: sagdaki ic bosluk, kaydirma cubugunun gercek genisligi kadar az (--cubuk: app.js olcer) */
.sepet-liste { padding-right:max(0px, calc(var(--panel-ic) - var(--cubuk, 0px))); }
/* ZOOM YOK (2026-10-13): cift dokunma yakinlastirmasin; iOS 16px altindaki girdiye odaklaninca yakinlastiriyor */
html { touch-action:manipulation; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
@media (max-width:980px) { input, textarea, select { font-size:16px !important; } }

/* ====================================================================
   OZEL SCROLLBAR (2026-10-13): ince, oksuz, sade; tum sitede.
   Kayan alanlar scrollbar-gutter:stable + ters bosluk ile hizayi bozmaz (sayfa.css / cekim.css).
   ==================================================================== */
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(15,42,86,.2); border-radius:10px; border:3px solid transparent; background-clip:content-box; min-height:40px; }
::-webkit-scrollbar-button { display:none; width:0; height:0; }
@supports not selector(::-webkit-scrollbar) { * { scrollbar-width:thin; scrollbar-color:rgba(15,42,86,.25) transparent; } }

/* ====================================================================
   KAYAN SEKME GOSTERGESI (2026-10-13, assets/js/seg-iz.js): baslik gibi tum sekme gruplarinda
   ==================================================================== */
.seg-izli { position:relative; isolation:isolate; }
.seg-izli > .seg-iz { position:absolute; left:0; top:0; z-index:0; pointer-events:none; border-radius:8px; background:var(--inci);
  box-shadow:0 1px 3px rgba(15,42,86,.12); will-change:transform;
  transition:transform .36s cubic-bezier(.32,.72,0,1), width .36s cubic-bezier(.32,.72,0,1), height .36s cubic-bezier(.32,.72,0,1), opacity .2s ease; }
.seg-izli.seg > .seg-iz { border-radius:7px; }
.seg-izli > :not(.seg-iz) { position:relative; z-index:1; }
.seg-izli > .on, .seg-izli > .acik, .seg-izli > [aria-selected="true"] { background:transparent !important; box-shadow:none !important; }
.seg-izli > button { transition:color .25s ease; }
@media (prefers-reduced-motion: reduce) { .seg-izli > .seg-iz { transition:none; } }
/* GOVDE BOSLUGU (2026-10-13, olculdu: cashout telefonda 300px bos kaydirma): sepet yoksa alt bosluk yok */
@media (max-width:980px) { body:not(:has(.sepet)) { padding-bottom:calc(16px + env(safe-area-inset-bottom)) !important; } }

/* koyu tema: assets/css/koyu.css (her sayfada en son) */
/* ARKA ON-YUKLEME (2026-10-13): head data-ap koyar -> eski dalgalar bir an bile gorunmez; yeni katman yumusak gelir */
html[data-ap] .fon svg { opacity:0; }
html[data-ap="8"] .fon svg { opacity:1; }
.ap-kat { animation:apGel .7s ease both; }
@keyframes apGel { from { opacity:0; } }

/* NADIRLIK PARILTISI ARKADA (2026-10-14): ::before konumlu oldugu icin konumsuz <img>in USTUNE ciziliyordu
   ("on planda gibi"). Figure kendi katmanini acar, parilti onun en altina iner. Koyu modda kisik ve daha yumusak. */
.kart figure { isolation:isolate; }
.kart figure::before { z-index:-1; }
html[data-tema="koyu"] .kart figure::before { opacity:.09; filter:blur(26px); inset:14% 20%; }

/* All items: salt fiyat karti (2026-10-14) — secilmez, basinca cokmez */
.kart.salt { cursor:default; }
.kart.salt:active { transform:none; box-shadow:none; }

/* YUKLEME ISKELETI v2 (2026-10-14, lab-animasyon #10 · assets/app.js): .kart ile ayni kutu (boy, kose, golge, ic bosluk),
   gorsel alani bos. Cubuklarin arka plani sabit (fixed) -> parilti butun izgarada TEK dalga halinde akar. */
.izgara .iskelet { position:relative; display:flex; flex-direction:column; min-height:200px; padding:11px 11px 10px; border-radius:14px; background:var(--inci);
  box-shadow:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06); }
html[data-tema="koyu"] .izgara .iskelet { box-shadow:none; }
.izgara .iskelet i { display:block; border-radius:5px; --t:var(--buz); --p:color-mix(in srgb, var(--buz) 45%, #fff);
  background:linear-gradient(100deg, var(--t) 0%, var(--t) 40%, var(--p) 50%, var(--t) 60%, var(--t) 100%) 0 0 / 200vw 100% fixed;
  animation:iskDalga 1.5s linear infinite; }
html[data-tema="koyu"] .izgara .iskelet i { --t:var(--k-kabarik, #1E1E1E); --p:color-mix(in srgb, var(--k-kabarik, #1E1E1E) 70%, #fff); }
@keyframes iskDalga { from { background-position:100vw 0; } to { background-position:-100vw 0; } }
.izgara .iskelet i.n { width:38%; height:8px; margin-top:2px; }
.izgara .iskelet .bos { flex:1; }
.izgara .iskelet i.a { width:64%; height:10px; margin-bottom:7px; }
.izgara .iskelet i.f { width:40%; height:14px; border-radius:6px; margin-bottom:2px; }
@keyframes iskGel { from { opacity:0; transform:translateY(6px); } }   /* blur yok: 27 kartta blur animasyonu kareyi ~110 ms yapiyordu (2026-10-14, olculdu) */
@keyframes iskImg { from { opacity:0; transform:scale(.8) translateY(6px); } }
.izgara .isk-gel { animation:iskGel .34s cubic-bezier(.2,.8,.2,1) both; animation-delay:calc(var(--i, 0) * 28ms); }
.izgara .kart.isk-gel figure img { animation:iskImg .46s cubic-bezier(.3,1.3,.5,1) both; animation-delay:calc(60ms + var(--i, 0) * 28ms); }
@media (prefers-reduced-motion: reduce) { .izgara .iskelet i, .izgara .isk-gel, .izgara .isk-gel figure img { animation:none; } }

/* ====================================================================
   GUNUN ESYASI + NOT BUYING (2026-10-14, assets/app.js; admin paneli > Storefront / Prices)
   Kart: lab-gunun-esyasi'ndaki donen yesil cerceve + yesil fiyat + yuzde + sayac. Pencere: mor spot isigi (v16).
   ==================================================================== */
@property --gn-aci { syntax:"<angle>"; inherits:false; initial-value:0deg; }
.kart.gunun { border:2px solid transparent; padding:9px 9px 8px;
  background:linear-gradient(var(--inci),var(--inci)) padding-box,
    conic-gradient(from var(--gn-aci), #10B981, #34D399 18%, rgba(52,211,153,.12) 40%, rgba(52,211,153,.12) 60%, #34D399 82%, #10B981) border-box;
  box-shadow:0 8px 22px -10px rgba(16,185,129,.55); animation:gnDon 3.2s linear infinite; }
@keyframes gnDon { to { --gn-aci:360deg; } }
.kart.gunun.secili { background:linear-gradient(var(--kd-basik,#FAFBFC),var(--kd-basik,#FAFBFC)) padding-box,
    conic-gradient(from var(--gn-aci), #10B981, #34D399 18%, rgba(52,211,153,.12) 40%, rgba(52,211,153,.12) 60%, #34D399 82%, #10B981) border-box; }
.kart.gunun figure::before { background:#10B981; opacity:.22; }
.kart .gn-k-yuzde { position:absolute; top:8px; right:8px; z-index:2; display:inline-flex; align-items:center; gap:3px; padding:3px 7px; border-radius:6px;
  background:#10B981; color:#fff; font-size:10.5px; font-weight:800; box-shadow:0 4px 10px -3px rgba(16,185,129,.7); }
.kart .gn-k-yuzde svg { width:11px; height:11px; }
.kart.gunun .sahip { display:none; }
.kart.gunun.secili .gn-k-yuzde { display:none; }
.kart.gunun .fiyat { color:#059669; } html[data-tema="koyu"] .kart.gunun .fiyat { color:#34D399; }
.kart .gn-k-eski { display:inline-block; margin-left:5px; font-size:11px; font-weight:700; color:var(--ink-3); text-decoration:line-through; vertical-align:2px; }
.kart .gn-k-sayac { display:flex; align-items:center; gap:4px; margin-top:6px; padding:4px 7px; border-radius:7px; background:rgba(5,150,105,.11); color:#059669;
  font-size:10.5px; font-weight:800; font-variant-numeric:tabular-nums; }
html[data-tema="koyu"] .kart .gn-k-sayac { background:rgba(52,211,153,.12); color:#34D399; }
.kart .gn-k-sayac svg { width:12px; height:12px; flex:none; } .kart .gn-k-sayac span { margin-left:auto; opacity:.75; font-weight:700; }
@keyframes gnKartGel { 0% { transform:scale(1); } 35% { transform:scale(1.06); box-shadow:0 0 0 8px rgba(16,185,129,.25); } 100% { transform:scale(1); } }
.kart.gunun.gel { animation:gnKartGel .7s cubic-bezier(.3,1.3,.5,1), gnDon 3.2s linear infinite; }
/* Not buying: soluk, secilmez */
.kart.kapali { cursor:default; }
.kart.kapali figure img, .kart.kapali .alt { opacity:.45; filter:grayscale(.6); }
.kart.kapali:hover { box-shadow:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06); }
.kart .kapali-et { position:absolute; top:42%; left:50%; z-index:3; transform:translate(-50%,-50%); padding:5px 10px; border-radius:7px; white-space:nowrap;
  font-size:11px; font-weight:800; letter-spacing:.02em; color:var(--ink); background:var(--kd-yuzey, #fff); box-shadow:0 6px 16px -6px rgba(15,42,86,.35), inset 0 0 0 1px var(--cizgi); }
html[data-tema="koyu"] .kart .kapali-et { background:#1A1A1A; box-shadow:0 6px 16px -6px rgba(0,0,0,.7), inset 0 0 0 1px #2A2A2A; }

/* gunluk pencere */
html.gn-kilit, html.gn-kilit body { overflow:hidden; }
.gn-perde { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:16px; background:transparent; transition:background .26s ease; }
.gn-perde.acik { background:radial-gradient(60% 50% at 50% 45%, rgba(109,40,217,.35), rgba(5,8,20,.86) 70%); }
.gn-pen { position:relative; width:min(410px,100%); max-height:calc(100dvh - 32px); overflow:hidden auto; padding:22px; border-radius:22px; text-align:center; color:#F3F0FF;
  background:linear-gradient(180deg,#1B1036,#0E0A1F); box-shadow:0 30px 80px -10px rgba(109,40,217,.55), 0 0 0 1px rgba(169,154,245,.25); opacity:0; }
@keyframes gnGir { 0% { opacity:0; transform:scale(.4) rotate(-8deg); } 60% { opacity:1; transform:scale(1.05) rotate(1deg); } 100% { opacity:1; transform:none; } }
@keyframes gnCik { from { opacity:1; } to { opacity:0; transform:scale(.6); filter:brightness(2); } }
.gn-perde.acik .gn-pen { animation:gnGir .72s cubic-bezier(.2,.9,.3,1.1) both; }
.gn-perde.kapaniyor .gn-pen { animation:gnCik .26s ease-in both; }
.gn-x { position:absolute; top:14px; right:14px; z-index:3; width:32px; height:32px; display:grid; place-items:center; border:0; border-radius:10px; background:none; color:#B7AEDB; cursor:pointer; }
.gn-x:active { background:rgba(255,255,255,.08); } .gn-x svg { width:16px; height:16px; }
.gn-sahne { position:relative; height:200px; display:grid; place-items:center; margin:-22px -22px 10px; }
.gn-isin { position:absolute; width:440px; height:440px; left:50%; top:50%; margin:-220px 0 0 -220px;
  background:repeating-conic-gradient(from 0deg, rgba(169,154,245,.22) 0 8deg, transparent 8deg 24deg); -webkit-mask:radial-gradient(circle, #000 15%, transparent 62%); mask:radial-gradient(circle, #000 15%, transparent 62%);
  animation:gnIsin 18s linear infinite; }
@keyframes gnIsin { to { transform:rotate(360deg); } }
.gn-sahne img { position:relative; width:150px; height:150px; object-fit:contain; filter:drop-shadow(0 0 22px rgba(169,154,245,.75)); }
@keyframes gnEsya { 0% { opacity:0; transform:scale(.2) rotate(-200deg); } 70% { opacity:1; transform:scale(1.15) rotate(8deg); } 100% { transform:none; } }
@keyframes gnNefes { 0%,100% { filter:drop-shadow(0 0 16px rgba(169,154,245,.6)); } 50% { filter:drop-shadow(0 0 34px rgba(169,154,245,1)); } }
.gn-perde.acik .gn-sahne img { animation:gnEsya .9s .2s cubic-bezier(.2,.9,.3,1.1) both, gnNefes 2.4s 1.1s ease-in-out infinite; }
.gn-yildiz { position:absolute; width:6px; height:6px; border-radius:2px; background:#fff; box-shadow:0 0 10px 2px #C4B5FD; opacity:0; }
@keyframes gnYildiz { 0%,100% { opacity:0; transform:scale(.3); } 50% { opacity:1; transform:scale(1); } }
.gn-perde.acik .gn-yildiz { animation:gnYildiz 1.8s ease-in-out infinite; }
@keyframes gnIcerik { from { opacity:0; transform:translateY(10px); } }
.gn-perde.acik .gn-pen [style*="--k"] { animation:gnIcerik .42s cubic-bezier(.2,.8,.2,1) both; animation-delay:calc(120ms + var(--k,0) * 55ms); }
.gn-ust { display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
.gn-rozet { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:7px; font-size:11px; font-weight:800; letter-spacing:.07em;
  background:linear-gradient(90deg,#F59E0B,#F97316); color:#1A0E00; box-shadow:0 6px 16px -6px rgba(249,115,22,.8); }
.gn-rozet svg { width:13px; height:13px; }
.gn-sayac { display:inline-flex; align-items:center; gap:5px; padding:4px 10px 4px 8px; border-radius:7px; background:rgba(255,255,255,.08); color:#E9E4FF; font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; }
.gn-sayac svg { width:13px; height:13px; color:#C4B5FD; }
.gn-nadir { display:block; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#C4B5FD; }
.gn-pen h2 { margin:2px 0 6px; font-size:26px; line-height:1.2; letter-spacing:-.03em; }
.gn-fiyat { display:flex; align-items:center; justify-content:center; gap:12px; margin:6px 0 4px; }
.gn-eski { position:relative; color:#8E86B5; font-size:18px; font-weight:700; }
.gn-eski::after { content:""; position:absolute; left:-3px; right:-3px; top:52%; height:2px; border-radius:2px; background:#F87171; transform-origin:0 50%; transform:scaleX(0) rotate(-8deg); }
@keyframes gnCiz { to { transform:scaleX(1) rotate(-8deg); } }
.gn-perde.acik .gn-eski::after { animation:gnCiz .32s .9s cubic-bezier(.6,0,.3,1) forwards; }
.gn-ok { width:18px; height:18px; color:#8E86B5; }
.gn-yeni { display:inline-block; font-size:34px; font-weight:800; letter-spacing:-.045em; color:#34D399; text-shadow:0 0 24px rgba(52,211,153,.45); }
@keyframes gnYeni { 0% { opacity:0; transform:scale(.6) translateY(8px); } 70% { opacity:1; transform:scale(1.12); } 100% { transform:none; } }
.gn-perde.acik .gn-yeni { animation:gnYeni .52s 1.05s cubic-bezier(.3,1.4,.5,1) both; }
.gn-yuzde { display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:7px; background:rgba(52,211,153,.14); color:#6EE7B7; font-size:12px; font-weight:800; }
.gn-yuzde svg { width:13px; height:13px; }
.gn-dugmeler { display:flex; gap:10px; margin-top:18px; } .gn-dugmeler > * { flex:1; }
.gn-btn { height:46px; display:flex; align-items:center; justify-content:center; gap:8px; padding:0 16px; border:0; border-radius:13px; font:inherit; font-weight:750; color:#fff; cursor:pointer;
  background:linear-gradient(180deg,#8B5CF6,#6D28D9); box-shadow:0 10px 24px -8px rgba(139,92,246,.8); }
.gn-btn:active { transform:scale(.97); }
.gn-btn.ikinci { background:rgba(255,255,255,.08); color:#F3F0FF; box-shadow:none; }
.gn-btn.yesil { background:linear-gradient(180deg,#10B981,#059669); box-shadow:0 10px 24px -8px rgba(16,185,129,.8); }
.gn-not { margin:10px 0 0; color:#8E86B5; font-size:12px; }
@media (prefers-reduced-motion: reduce) { .kart.gunun, .kart.gunun.gel, .gn-isin, .gn-perde * { animation:none !important; } .gn-pen { opacity:1; } }