/* ==========================================================================
   CATFATHER — Design System
   Koyu mürekkep + eskitilmiş altın · editoryal serif başlık + mono sayılar
   Tek dosya. Mobil öncelikli, tüm cihazlarda uyumlu.
   --------------------------------------------------------------------------
   İçindekiler
   01 Tokens          07 Etiket / chip       13 Ödeme ekranı
   02 Reset & base    08 Flash & toast       14 Hesap & listeler
   03 Zemin dokusu    09 Header & menü       15 Sipariş / teslimat
   04 Yerleşim        10 Hero                16 Giriş / kayıt
   05 Buton           11 Mağaza & kartlar    17 Tablolar
   06 Form            12 Ürün detay          18 Footer
                                             19 Admin
                                             20 Kurulum & motion
   ========================================================================== */

/* ===== 01 · TOKENS ======================================================= */
:root{
  /* Mürekkep — hafif menekşe alt tonlu koyular (altını öne çıkarır) */
  --ink-1000:#07070b;
  --ink-950:#0a0a10;
  --ink-900:#0e0e15;
  --ink-850:#13131b;
  --ink-800:#181821;
  --ink-750:#1f1f29;
  --ink-700:#272732;

  /* Çizgiler */
  --line:rgba(255,255,255,.07);
  --line-2:rgba(255,255,255,.12);
  --line-3:rgba(255,255,255,.2);
  --line-gold:rgba(228,185,95,.3);

  /* Metin — sıcak kırık beyaz, soğuk griler */
  --text:#f3f1ec;
  --text-2:#b6b4c1;
  --text-3:#8a8896;
  --text-4:#5d5b68;

  /* Marka altını */
  --gold:#e4b95f;
  --gold-hi:#f6d693;
  --gold-dp:#a9822b;
  --gold-soft:rgba(228,185,95,.12);

  /* Durum renkleri */
  --mint:#3fcf8e;
  --mint-soft:rgba(63,207,142,.12);
  --rose:#f2607a;
  --rose-soft:rgba(242,96,122,.12);
  --amber:#ee9b3a;
  --amber-soft:rgba(238,155,58,.13);
  --azure:#6fa8ff;
  --azure-soft:rgba(111,168,255,.12);

  /* Tipografi */
  --f-display:'Instrument Serif',ui-serif,Georgia,'Times New Roman',serif;
  --f-sans:'Inter Tight',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* Ölçek */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px;
  --sp-14:56px;--sp-18:72px;

  --r-xs:6px; --r-sm:9px; --r:12px; --r-lg:16px; --r-xl:22px; --r-pill:999px;

  --shadow-1:0 1px 2px rgba(0,0,0,.4);
  --shadow-2:0 2px 4px rgba(0,0,0,.3),0 12px 28px -18px rgba(0,0,0,.9);
  --shadow-3:0 24px 60px -24px rgba(0,0,0,.95);
  --shadow-gold:0 10px 30px -14px rgba(228,185,95,.45);

  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --t-fast:.14s;
  --t:.22s;

  --hdr:64px;
  --wrap:1200px;
}

/* ===== 02 · RESET & BASE ================================================= */
*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--hdr) + 16px);
}
body{
  margin:0;
  min-height:100vh;
  background:var(--ink-1000);
  color:var(--text);
  font:400 .95rem/1.6 var(--f-sans);
  letter-spacing:-.005em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5{margin:0;font-weight:600;line-height:1.2;letter-spacing:-.02em}
p{margin:0}
ul,ol{margin:0;padding:0}
img,svg,video{max-width:100%;display:block}
a{color:var(--gold);text-decoration:none;transition:color var(--t-fast) var(--ease)}
a:hover{color:var(--gold-hi)}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
code,pre,.mono{font-family:var(--f-mono);font-variant-ligatures:none}
pre{margin:0}
table{border-collapse:collapse}
hr{border:0;border-top:1px solid var(--line);margin:var(--sp-6) 0}
::selection{background:rgba(228,185,95,.28);color:#fff}
:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px var(--ink-1000),0 0 0 4px rgba(228,185,95,.6);
  border-radius:var(--r-xs);
}
/* İnce scrollbar */
*{scrollbar-width:thin;scrollbar-color:var(--ink-700) transparent}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--ink-700);border-radius:9px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:var(--ink-750);background-clip:content-box}

/* Tipografi yardımcıları */
.display{font-family:var(--f-display);font-weight:400;letter-spacing:-.015em;line-height:1.04}
.display em,.display i{font-style:italic;color:var(--gold)}
.muted{color:var(--text-3)}
.small{font-size:.83rem}
.tnum{font-variant-numeric:tabular-nums}
.grad{color:var(--gold)}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font:500 .68rem/1 var(--f-mono);
  text-transform:uppercase;letter-spacing:.14em;color:var(--text-3);
}
.eyebrow::before{
  content:"";width:18px;height:1px;background:linear-gradient(90deg,transparent,var(--gold));flex:none;
}
.eyebrow--dot::before{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px var(--gold-soft)}
.label-mono{font:500 .68rem/1 var(--f-mono);text-transform:uppercase;letter-spacing:.12em;color:var(--text-3)}

/* ===== 03 · ZEMİN DOKUSU ================================================= */
.bg-anim{
  position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(900px 480px at 50% -220px,rgba(228,185,95,.09),transparent 70%),
    radial-gradient(700px 500px at 100% 0,rgba(111,168,255,.045),transparent 65%),
    var(--ink-1000);
}
.bg-anim::after{
  content:"";position:absolute;inset:0;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}
/* Eski markup uyumu */
.blob,.grid-overlay{display:none}

/* Sayfanın en üstündeki altın saç teli */
body::before{
  content:"";position:fixed;top:0;left:0;right:0;height:1px;z-index:200;
  background:linear-gradient(90deg,transparent,var(--gold-dp) 18%,var(--gold-hi) 50%,var(--gold-dp) 82%,transparent);
  opacity:.55;
}

/* ===== 04 · YERLEŞİM ==================================================== */
.container{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(16px,4vw,28px)}
.page{padding:clamp(24px,4vw,44px) clamp(16px,4vw,28px) clamp(56px,8vw,96px);min-height:62vh}
.skip-link{
  position:fixed;top:8px;left:50%;transform:translate(-50%,-160%);z-index:300;
  background:var(--gold);color:#17130a;font-weight:600;padding:10px 18px;border-radius:var(--r-sm);
  transition:transform var(--t) var(--ease-out);
}
.skip-link:focus{transform:translate(-50%,0);color:#17130a}

.section-head{margin-bottom:clamp(20px,3vw,28px);max-width:62ch}
.section-head h1{font-family:var(--f-display);font-weight:400;font-size:clamp(1.9rem,4.4vw,2.7rem);line-height:1.08;margin-bottom:6px}
.section-head h2{font-size:clamp(1.25rem,2.6vw,1.6rem)}
.section-head p{color:var(--text-3);font-size:.95rem}
.section-head .eyebrow{margin-bottom:14px}

/* Yüzey / panel (eski .glass adı korunur) */
.glass,.surface{
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 120px),
    var(--ink-900);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-2);
}
.panel{padding:clamp(18px,2.4vw,26px)}
.panel>h3,.panel-head h3{font-size:1rem;letter-spacing:-.01em}
.panel>h3{margin-bottom:var(--sp-4)}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.panel-head h3{margin:0}

.crumbs{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font:500 .74rem/1 var(--f-mono);text-transform:uppercase;letter-spacing:.1em;
  color:var(--text-4);margin-bottom:var(--sp-5);
}
.crumbs a{color:var(--text-3)}
.crumbs a:hover{color:var(--gold)}
.crumbs span{color:var(--text-2);text-transform:none;letter-spacing:0;font-family:var(--f-sans);font-size:.82rem}

.empty{
  padding:clamp(36px,7vw,64px) var(--sp-6);text-align:center;color:var(--text-3);
  display:grid;gap:var(--sp-4);place-items:center;
}
.empty h1{font-family:var(--f-display);font-weight:400;font-size:1.7rem;color:var(--text)}
.empty svg{color:var(--text-4)}
.maintenance{max-width:520px;margin:clamp(40px,10vw,90px) auto;padding:clamp(28px,5vw,48px);text-align:center}
.maintenance h1{font-family:var(--f-display);font-weight:400;font-size:clamp(1.8rem,5vw,2.4rem);margin-bottom:10px}

/* ===== 05 · BUTON ======================================================= */
.btn{
  --btn-h:46px;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:var(--btn-h);padding:0 20px;
  border:1px solid transparent;border-radius:var(--r-sm);
  font-family:var(--f-sans);font-weight:600;font-size:.92rem;letter-spacing:-.01em;
  white-space:nowrap;cursor:pointer;position:relative;
  transition:transform var(--t-fast) var(--ease),background var(--t-fast) var(--ease),
             border-color var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease),color var(--t-fast) var(--ease);
}
.btn svg{flex:none;width:17px;height:17px}
.btn-sm{--btn-h:38px;padding:0 14px;font-size:.84rem;border-radius:var(--r-xs)}
.btn-lg{--btn-h:54px;padding:0 28px;font-size:1rem}
.btn-block{display:flex;width:100%}
.btn:active{transform:translateY(0) scale(.99)}

.btn-primary{
  background:linear-gradient(180deg,var(--gold-hi),var(--gold) 55%,#d5a94c);
  color:#1a1509;
  box-shadow:var(--shadow-1),var(--shadow-gold),inset 0 1px 0 rgba(255,255,255,.4);
}
.btn-primary:hover{
  background:linear-gradient(180deg,#fbe0a6,var(--gold-hi) 55%,var(--gold));
  color:#1a1509;transform:translateY(-1px);
  box-shadow:var(--shadow-1),0 14px 34px -14px rgba(228,185,95,.6),inset 0 1px 0 rgba(255,255,255,.5);
}
.btn-ghost{background:rgba(255,255,255,.035);border-color:var(--line-2);color:var(--text)}
.btn-ghost:hover{background:rgba(255,255,255,.07);border-color:var(--line-3);color:var(--text)}
.btn-quiet{background:transparent;color:var(--text-2);border-color:transparent}
.btn-quiet:hover{background:rgba(255,255,255,.05);color:var(--text)}
.btn-success{background:linear-gradient(180deg,#5ee0a5,var(--mint) 60%,#2fb87a)!important;color:#03231a!important;box-shadow:var(--shadow-1),0 10px 28px -14px rgba(63,207,142,.5)!important}
.btn-warn{background:linear-gradient(180deg,#f6b45f,var(--amber) 60%,#d2822a)!important;color:#241304!important;box-shadow:var(--shadow-1),0 10px 28px -14px rgba(238,155,58,.5)!important}
.btn-danger{background:linear-gradient(180deg,#f7808f,var(--rose) 60%,#d8465f)!important;color:#2a060e!important}
.btn.danger{color:var(--rose)}
.btn-ghost.danger{border-color:rgba(242,96,122,.3);color:var(--rose)}
.btn-ghost.danger:hover{background:var(--rose-soft);border-color:rgba(242,96,122,.5);color:#ff8ea1}
.btn:disabled,.btn[disabled]{opacity:.42;cursor:not-allowed;transform:none!important;box-shadow:none!important}

/* ikon buton */
.btn-icon{--btn-h:40px;width:40px;padding:0;border-radius:var(--r-sm);background:rgba(255,255,255,.04);border-color:var(--line)}
.btn-icon:hover{background:rgba(255,255,255,.08)}

/* ===== 06 · FORM ======================================================== */
.form{display:flex;flex-direction:column;gap:var(--sp-4)}
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.field>span{font:500 .78rem/1.3 var(--f-sans);color:var(--text-2);letter-spacing:0}
.field>span small{color:var(--text-4);font-weight:400}
.field input,.field select,.field textarea,
.inline-search input,.form-inline input{
  width:100%;min-height:46px;padding:11px 14px;
  background:var(--ink-850);border:1px solid var(--line-2);border-radius:var(--r-sm);
  color:var(--text);font-size:.95rem;font-family:var(--f-sans);
  transition:border-color var(--t-fast) var(--ease),background var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease);
}
.field textarea{min-height:110px;padding:13px 14px;resize:vertical;line-height:1.6}
.field textarea.mono,textarea.mono{font-family:var(--f-mono);font-size:.86rem;letter-spacing:-.01em}
.field input::placeholder,.field textarea::placeholder{color:var(--text-4)}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--line-3)}
.field input:focus,.field select:focus,.field textarea:focus,
.inline-search input:focus,.form-inline input:focus{
  outline:none;background:var(--ink-800);
  border-color:var(--gold-dp);
  box-shadow:0 0 0 3px rgba(228,185,95,.14);
}
.field.has-toggle{position:relative}
.field.has-toggle input{padding-right:46px}
.pw-toggle{
  position:absolute;right:5px;bottom:5px;width:36px;height:36px;
  display:grid;place-items:center;border-radius:var(--r-xs);color:var(--text-4);
  transition:color var(--t-fast) var(--ease),background var(--t-fast) var(--ease);
}
.pw-toggle:hover{color:var(--text-2);background:rgba(255,255,255,.05)}
.field input[type=file]{padding:9px 12px;color:var(--text-3);cursor:pointer}
.field input[type=file]::file-selector-button{
  margin-right:12px;padding:7px 13px;border:1px solid var(--line-2);border-radius:var(--r-xs);
  background:var(--ink-750);color:var(--text);font-size:.82rem;font-weight:600;cursor:pointer;
}
.field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-3)}
select{
  appearance:none;cursor:pointer;padding-right:38px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%238a8896' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
}
select option{background:var(--ink-850);color:var(--text)}
.check{display:flex;align-items:flex-start;gap:11px;color:var(--text-2);font-size:.9rem;cursor:pointer;line-height:1.45;padding:2px 0}
.check input{
  width:19px;height:19px;flex:none;margin:1px 0 0;accent-color:var(--gold);cursor:pointer;
}
.inline-search{display:flex;gap:8px;flex-wrap:wrap}
.inline-search input{min-width:180px;flex:1}
.form-inline{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:var(--sp-3)}
.form-inline input{min-height:38px;padding:7px 11px;font-size:.86rem;width:auto;min-width:92px;flex:1}

/* ===== 07 · ETİKET / CHIP =============================================== */
.tag{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 9px;border-radius:var(--r-xs);
  font:500 .7rem/1.35 var(--f-mono);letter-spacing:.03em;
  border:1px solid transparent;white-space:nowrap;
}
.tag-ok{background:var(--mint-soft);border-color:rgba(63,207,142,.26);color:#7fe4b6}
.tag-wait{background:var(--amber-soft);border-color:rgba(238,155,58,.28);color:#f5bd7c}
.tag-off{background:rgba(255,255,255,.05);border-color:var(--line-2);color:var(--text-3)}
.tag-admin{background:var(--gold-soft);border-color:var(--line-gold);color:var(--gold-hi)}
.tag-err{background:var(--rose-soft);border-color:rgba(242,96,122,.28);color:#ff93a6}

.chip{
  display:inline-flex;align-items:center;min-height:36px;padding:0 15px;
  border-radius:var(--r-pill);border:1px solid var(--line-2);
  background:rgba(255,255,255,.03);color:var(--text-2);
  font-size:.84rem;font-weight:500;white-space:nowrap;
  transition:all var(--t-fast) var(--ease);
}
.chip:hover{color:var(--text);border-color:var(--line-3);background:rgba(255,255,255,.06)}
.chip.active{background:var(--gold);border-color:var(--gold);color:#1a1509;font-weight:600}
.chip.active:hover{background:var(--gold-hi);color:#1a1509}

/* ===== 08 · FLASH & TOAST =============================================== */
.flash-wrap{display:grid;gap:10px;margin-bottom:var(--sp-5)}
.flash{
  display:flex;align-items:flex-start;gap:11px;
  padding:13px 16px;border-radius:var(--r-sm);
  border:1px solid var(--line-2);border-left-width:3px;
  background:var(--ink-850);color:var(--text-2);
  font-size:.9rem;line-height:1.5;
  animation:flashIn .4s var(--ease-out) both;
}
.flash::before{
  content:"";width:17px;height:17px;flex:none;margin-top:1px;
  background:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;
}
.flash b{color:var(--text)}
.flash a{text-decoration:underline;text-underline-offset:2px}
.flash-success{border-left-color:var(--mint);color:#8fe8c1;background:linear-gradient(90deg,var(--mint-soft),transparent 60%),var(--ink-850);
  --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.flash-error{border-left-color:var(--rose);color:#ffa0b0;background:linear-gradient(90deg,var(--rose-soft),transparent 60%),var(--ink-850);
  --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 8v5M12 16.5v.01'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E")}
.flash-info{border-left-color:var(--azure);color:#a8caff;background:linear-gradient(90deg,var(--azure-soft),transparent 60%),var(--ink-850);
  --ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 11v5M12 7.5v.01'/%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E")}
@keyframes flashIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}

#toast{
  position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));
  transform:translate(-50%,140%);z-index:250;
  display:flex;align-items:center;gap:9px;
  padding:11px 18px;border-radius:var(--r-pill);
  background:var(--ink-750);border:1px solid var(--line-2);
  box-shadow:var(--shadow-3);
  font:500 .84rem/1 var(--f-sans);color:var(--text);
  opacity:0;transition:transform .32s var(--ease-out),opacity .32s var(--ease-out);
  pointer-events:none;max-width:calc(100vw - 32px);
}
#toast.show{transform:translate(-50%,0);opacity:1}
#toast svg{color:var(--mint);width:16px;height:16px;flex:none}

/* ===== 09 · HEADER & MENÜ =============================================== */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(10,10,16,.82);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;gap:var(--sp-4);min-height:var(--hdr)}

.brand{display:flex;align-items:center;gap:10px;flex:none;color:var(--text)}
.brand:hover{color:var(--text)}
.brand-mark{
  width:34px;height:34px;flex:none;display:grid;place-items:center;
  border-radius:10px;
  background:linear-gradient(160deg,#2a2213,#15141c 70%);
  border:1px solid var(--line-gold);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 6px 16px -8px rgba(0,0,0,.9);
  transition:transform var(--t) var(--ease-out),box-shadow var(--t) var(--ease);
}
.brand-mark svg{width:20px;height:20px;color:var(--gold)}
.brand:hover .brand-mark{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 20px -8px rgba(228,185,95,.5)}
.brand-text{
  font-family:var(--f-sans);font-weight:700;font-size:1.02rem;
  text-transform:uppercase;letter-spacing:.09em;color:var(--text);line-height:1;
}
.brand-text b{color:var(--gold);font-weight:700}
.brand-sub{display:block;font:500 .56rem/1 var(--f-mono);letter-spacing:.26em;color:var(--text-4);margin-top:4px;text-transform:uppercase}

.header-collapse{display:flex;flex:1;align-items:center;gap:var(--sp-4);min-width:0}
.main-nav{display:flex;align-items:center;gap:2px}
.main-nav a{
  position:relative;display:flex;align-items:center;gap:7px;
  padding:9px 12px;border-radius:var(--r-xs);
  color:var(--text-3);font-size:.89rem;font-weight:500;white-space:nowrap;
  transition:color var(--t-fast) var(--ease);
}
.main-nav a svg{width:16px;height:16px;opacity:.6;transition:opacity var(--t-fast) var(--ease)}
.main-nav a::after{
  content:"";position:absolute;left:12px;right:12px;bottom:3px;height:1.5px;border-radius:2px;
  background:var(--gold);transform:scaleX(0);transform-origin:left;
  transition:transform var(--t) var(--ease-out);
}
.main-nav a:hover{color:var(--text)}
.main-nav a:hover svg{opacity:1}
.main-nav a:hover::after,.main-nav a[aria-current=page]::after{transform:scaleX(1)}
.main-nav a[aria-current=page]{color:var(--text)}
.main-nav .nav-admin{color:var(--gold)}
.main-nav .nav-admin::after{background:var(--gold)}
.main-nav .nav-tg:hover{color:var(--azure)}
.main-nav .nav-tg::after{background:var(--azure)}

.header-actions{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
.balance-pill{
  display:flex;align-items:center;gap:10px;
  padding:7px 13px;border-radius:var(--r-sm);
  background:linear-gradient(180deg,rgba(228,185,95,.1),rgba(228,185,95,.03));
  border:1px solid var(--line-gold);color:var(--text);
  transition:all var(--t-fast) var(--ease);
}
.balance-pill:hover{border-color:rgba(228,185,95,.5);background:linear-gradient(180deg,rgba(228,185,95,.16),rgba(228,185,95,.05));color:var(--text)}
.bp-meta{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.bp-label{font:500 .56rem/1 var(--f-mono);text-transform:uppercase;letter-spacing:.16em;color:var(--text-3)}
.bp-amount{font:500 .86rem/1.25 var(--f-mono);color:var(--gold-hi);font-variant-numeric:tabular-nums;white-space:nowrap}
.balance-pill svg{width:15px;height:15px;color:var(--gold);flex:none}
.balance-pill-mobile{display:none}
.user-chip{
  display:flex;align-items:center;gap:8px;padding:6px 6px 6px 10px;border-radius:var(--r-sm);
  color:var(--text-2);font-size:.86rem;font-weight:500;
}
.user-chip .avatar{
  width:27px;height:27px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(150deg,var(--gold-dp),#3a2e14);color:#1a1509;
  font:600 .74rem/1 var(--f-sans);text-transform:uppercase;border:1px solid var(--line-gold);
}
.user-name{font-weight:500;color:var(--text-2);font-size:.86rem;white-space:nowrap}

/* hamburger */
.nav-toggle{
  display:none;width:42px;height:42px;flex:none;
  align-items:center;justify-content:center;
  border-radius:var(--r-sm);border:1px solid var(--line-2);background:rgba(255,255,255,.03);
  transition:background var(--t-fast) var(--ease);
}
.nav-toggle:hover{background:rgba(255,255,255,.07)}
.nav-toggle i{position:relative;width:17px;height:11px;display:block}
.nav-toggle i::before,.nav-toggle i::after,.nav-toggle i span{
  content:"";position:absolute;left:0;width:100%;height:1.6px;border-radius:2px;background:var(--text);
  transition:transform var(--t) var(--ease-out),opacity var(--t-fast) var(--ease);
}
.nav-toggle i::before{top:0}
.nav-toggle i span{top:50%;margin-top:-.8px}
.nav-toggle i::after{bottom:0}
.nav-toggle.active i::before{transform:translateY(4.7px) rotate(45deg)}
.nav-toggle.active i span{opacity:0}
.nav-toggle.active i::after{transform:translateY(-4.7px) rotate(-45deg)}
.nav-scrim{
  position:fixed;inset:var(--hdr) 0 0;z-index:90;
  background:rgba(4,4,8,.66);backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:opacity var(--t) var(--ease);
}
.nav-scrim.show{opacity:1;visibility:visible}
body.nav-open{overflow:hidden}

/* ===== 10 · HERO ======================================================== */
.hero{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(24px,4vw,56px);align-items:center;
  padding:clamp(4px,3vw,44px) 0 clamp(30px,5vw,54px);
}
.hero-inner{max-width:38rem}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  padding:6px 13px 6px 11px;border-radius:var(--r-pill);
  border:1px solid var(--line-gold);background:var(--gold-soft);
  font:500 .68rem/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-hi);
  margin-bottom:var(--sp-5);
}
.hero-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--mint);flex:none;box-shadow:0 0 0 0 rgba(63,207,142,.6);animation:pulse 2.4s infinite}
.hero-title{
  font-family:var(--f-display);font-weight:400;
  font-size:clamp(2.2rem,7.2vw,4.5rem);line-height:1;letter-spacing:-.025em;
  margin:0;color:var(--text);
}
.hero-title em{font-style:italic;color:var(--gold)}
.hero-title .line{display:block}
.hero-sub{
  margin:var(--sp-5) 0 var(--sp-6);max-width:34rem;
  font-size:clamp(.98rem,1.5vw,1.08rem);line-height:1.6;color:var(--text-3);
}
.hero-sub b{color:var(--text-2);font-weight:600}
.hero-cta{display:flex;gap:11px;flex-wrap:wrap}
.hero-trust{
  display:flex;gap:clamp(14px,2.4vw,26px);flex-wrap:wrap;align-items:center;
  margin-top:clamp(26px,4vw,38px);padding-top:clamp(20px,3vw,26px);
  border-top:1px solid var(--line);
}
.hero-trust>span,.trust-item{
  display:flex;align-items:center;gap:9px;
  font-size:.84rem;font-weight:500;color:var(--text-3);
}
.trust-item svg{width:16px;height:16px;color:var(--gold);flex:none}
.trust-item b{display:block;color:var(--text);font-size:.86rem;font-weight:600;line-height:1.3}
.trust-item small{display:block;color:var(--text-4);font-size:.74rem}

/* Hero yanındaki "akış" kartı */
.flow-card{padding:clamp(18px,2.4vw,24px);display:grid;gap:14px;position:relative;overflow:hidden}
.flow-card::before{
  content:"";position:absolute;inset:0 0 auto;height:1px;
  background:linear-gradient(90deg,transparent,var(--line-gold) 30%,var(--gold) 50%,var(--line-gold) 70%,transparent);
}
.flow-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.flow-head .label-mono{letter-spacing:.14em}
.flow-live{display:inline-flex;align-items:center;gap:7px;font:500 .68rem/1 var(--f-mono);color:var(--mint);letter-spacing:.1em;text-transform:uppercase}
.flow-live .dot{width:6px;height:6px;border-radius:50%;background:var(--mint);animation:pulse 2.4s infinite}
.flow-step{
  display:grid;grid-template-columns:28px minmax(0,1fr);gap:13px;align-items:start;
  position:relative;padding-bottom:16px;
}
.flow-step:last-of-type{padding-bottom:0}
.flow-step::before{
  content:"";position:absolute;left:13.5px;top:30px;bottom:2px;width:1px;
  background:linear-gradient(180deg,var(--line-2),transparent);
}
.flow-step:last-of-type::before{display:none}
.flow-n{
  width:28px;height:28px;display:grid;place-items:center;border-radius:50%;
  background:var(--ink-800);border:1px solid var(--line-2);
  font:500 .72rem/1 var(--f-mono);color:var(--text-3);
}
.flow-step.done .flow-n{background:var(--mint-soft);border-color:rgba(63,207,142,.35);color:var(--mint)}
.flow-step.done .flow-n svg{width:14px;height:14px}
.flow-step strong{display:block;font-size:.9rem;font-weight:600;color:var(--text);margin-bottom:2px}
.flow-step span{display:block;font-size:.8rem;color:var(--text-4);line-height:1.5}
.flow-amount{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:13px 15px;border-radius:var(--r-sm);
  background:var(--ink-850);border:1px dashed var(--line-2);
}
.flow-amount code{font:500 1.15rem/1 var(--f-mono);color:var(--gold-hi);font-variant-numeric:tabular-nums}
.flow-amount .label-mono{font-size:.62rem}

/* Giriş yapmış kullanıcı için cüzdan kartı */
.wallet-hero{
  display:grid;gap:9px;padding:18px;border-radius:var(--r);
  background:radial-gradient(120% 140% at 0 0,rgba(228,185,95,.12),transparent 66%),var(--ink-850);
  border:1px solid var(--line-gold);
}
.wallet-amt{
  font:500 clamp(1.6rem,4.6vw,2.15rem)/1 var(--f-mono);color:var(--gold-hi);
  font-variant-numeric:tabular-nums;letter-spacing:-.03em;overflow-wrap:anywhere;
}
.wallet-actions{display:flex;gap:8px;flex-wrap:wrap}
.wallet-actions .btn{flex:1;min-width:132px}
.flow-card .row-item{border-top:1px solid var(--line);padding-top:13px;margin-top:2px}

/* ===== 11 · MAĞAZA & KARTLAR ============================================ */
.store{padding-top:clamp(8px,2vw,20px);scroll-margin-top:calc(var(--hdr) + 20px)}
.store-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:var(--sp-4);
  flex-wrap:wrap;margin-bottom:var(--sp-6);
  padding-bottom:var(--sp-4);border-bottom:1px solid var(--line);
}
.store-head h2{font-family:var(--f-display);font-weight:400;font-size:clamp(1.5rem,3.4vw,2.1rem);line-height:1.1}
.store-head .label-mono{margin-bottom:8px;display:block}
.cat-filter{display:flex;gap:8px;flex-wrap:wrap}

.product-grid{
  display:grid;gap:clamp(12px,1.6vw,18px);
  grid-template-columns:repeat(auto-fill,minmax(min(258px,100%),1fr));
}
.product-card{
  position:relative;display:flex;flex-direction:column;overflow:hidden;
  color:var(--text);border-radius:var(--r-lg);
  transition:transform var(--t) var(--ease-out),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);
}
.product-card:hover{
  transform:translateY(-3px);border-color:var(--line-gold);color:var(--text);
  box-shadow:0 2px 4px rgba(0,0,0,.3),0 22px 44px -22px rgba(0,0,0,1),0 0 0 1px rgba(228,185,95,.08);
}
.pc-media{
  position:relative;aspect-ratio:4/3;overflow:hidden;
  background:
    radial-gradient(120% 100% at 50% 0,rgba(228,185,95,.1),transparent 62%),
    linear-gradient(170deg,var(--ink-800),var(--ink-950));
  background-size:cover;background-position:center;
  border-bottom:1px solid var(--line);
  display:grid;place-items:center;
}
.pc-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(7,7,11,.35) 0,transparent 42%,rgba(7,7,11,.5) 100%);
}
.pc-watermark{width:33%;max-width:74px;color:rgba(228,185,95,.13);transition:transform .5s var(--ease-out),color var(--t) var(--ease)}
.product-card:hover .pc-watermark{transform:scale(1.07) rotate(-2deg);color:rgba(228,185,95,.22)}
.pc-emoji{font-size:2.6rem}
.pc-cat,.pc-stock{position:absolute;z-index:2;font:500 .66rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase}
.pc-cat{
  top:11px;left:11px;padding:5px 9px;border-radius:var(--r-xs);
  background:rgba(7,7,11,.72);backdrop-filter:blur(6px);border:1px solid var(--line-2);color:var(--text-2);
}
.pc-stock{
  top:11px;right:11px;display:inline-flex;align-items:center;gap:5px;
  padding:5px 9px;border-radius:var(--r-xs);backdrop-filter:blur(6px);
}
.pc-stock::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}
.pc-stock.in{background:rgba(9,32,24,.8);border:1px solid rgba(63,207,142,.4);color:#7fe4b6}
.pc-stock.out{background:rgba(38,10,16,.8);border:1px solid rgba(242,96,122,.4);color:#ff93a6}
.product-card.is-out .pc-media{filter:grayscale(.75) brightness(.72)}
.pc-body{display:flex;flex-direction:column;gap:7px;flex:1;padding:15px 16px 16px}
.pc-title{
  font-size:1rem;font-weight:600;line-height:1.35;color:var(--text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.pc-desc{
  font-size:.83rem;line-height:1.5;color:var(--text-4);margin:0;flex:1;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.pc-foot{
  display:flex;justify-content:space-between;align-items:flex-end;gap:10px;
  margin-top:9px;padding-top:12px;border-top:1px solid var(--line);
}
.pc-price{
  display:flex;align-items:baseline;gap:4px;
  font:500 1.16rem/1 var(--f-mono);color:var(--gold-hi);font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.pc-price small{font:400 .66rem/1 var(--f-mono);color:var(--text-4);letter-spacing:.04em}
.pc-buy{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.82rem;font-weight:600;color:var(--text-3);
  transition:color var(--t-fast) var(--ease),gap var(--t-fast) var(--ease);
}
.pc-buy svg{width:14px;height:14px;transition:transform var(--t) var(--ease-out)}
.product-card:hover .pc-buy{color:var(--gold)}
.product-card:hover .pc-buy svg{transform:translateX(3px)}
/* stok göstergesi */
.pc-meter{height:2px;border-radius:2px;background:rgba(255,255,255,.07);overflow:hidden;margin-top:2px}
.pc-meter i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,var(--gold-dp),var(--gold))}
.pc-meter.low i{background:linear-gradient(90deg,#b5502f,var(--rose))}

/* ===== 12 · ÜRÜN DETAY ================================================== */
.product-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:clamp(18px,3vw,32px);align-items:start}
.pd-left{display:grid;gap:clamp(12px,1.6vw,16px);position:sticky;top:calc(var(--hdr) + 20px)}
.pd-media{
  position:relative;aspect-ratio:4/3;min-height:240px;overflow:hidden;
  background:
    radial-gradient(120% 100% at 50% 0,rgba(228,185,95,.12),transparent 60%),
    linear-gradient(170deg,var(--ink-800),var(--ink-950));
  background-size:cover;background-position:center;
  display:grid;place-items:center;
}
.pd-watermark{width:30%;max-width:110px;color:rgba(228,185,95,.16)}
.pd-specs{padding:6px 18px;margin:0}
.pd-specs>div{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:11px 0;border-top:1px solid var(--line);
}
.pd-specs>div:first-child{border-top:0}
.pd-specs dt{display:flex;align-items:center;gap:9px;color:var(--text-3);font-size:.84rem;margin:0}
.pd-specs dt svg{color:var(--text-4);flex:none}
.pd-specs dd{margin:0;font:500 .82rem/1.3 var(--f-mono);color:var(--text-2);text-align:right;overflow-wrap:anywhere}
.pd-emoji{font-size:4rem}
.pd-badge{
  position:absolute;top:14px;right:14px;display:inline-flex;align-items:center;gap:6px;
  padding:6px 11px;border-radius:var(--r-xs);backdrop-filter:blur(8px);
  font:500 .72rem/1 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;
}
.pd-badge::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.pd-badge.in{background:rgba(9,32,24,.82);border:1px solid rgba(63,207,142,.42);color:#7fe4b6}
.pd-badge.out{background:rgba(38,10,16,.82);border:1px solid rgba(242,96,122,.42);color:#ff93a6}

.pd-info{padding:clamp(20px,3vw,32px)}
.pd-cat{display:inline-block;margin-bottom:10px;font:500 .68rem/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.pd-info h1{
  font-family:var(--f-display);font-weight:400;
  font-size:clamp(1.7rem,4vw,2.4rem);line-height:1.08;margin-bottom:var(--sp-4);
}
.pd-price{
  display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;
  padding-bottom:var(--sp-4);margin-bottom:var(--sp-4);border-bottom:1px solid var(--line);
}
.pd-price .amt{font:500 clamp(1.7rem,3.6vw,2.2rem)/1 var(--f-mono);color:var(--gold-hi);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.pd-price small{font:400 .8rem/1 var(--f-mono);color:var(--text-4)}
.pd-desc{color:var(--text-2);font-size:.93rem;line-height:1.68;margin-bottom:var(--sp-5);white-space:pre-line}
.pd-perks{display:grid;gap:10px;margin-bottom:var(--sp-5);list-style:none}
.pd-perks li{display:flex;align-items:flex-start;gap:10px;font-size:.86rem;line-height:1.5;color:var(--text-3)}
.pd-perks svg{width:15px;height:15px;color:var(--mint);flex:none;margin-top:3px}
.pd-perks b{color:var(--text-2);font-weight:600}
.pd-guest,.pd-out{
  padding:var(--sp-5);border-radius:var(--r);text-align:center;
  background:var(--ink-850);border:1px solid var(--line-2);
}
.pd-guest p,.pd-out p{color:var(--text-2);font-size:.91rem}
.pd-guest-btns{display:flex;gap:10px;justify-content:center;margin-top:var(--sp-4);flex-wrap:wrap}
.pd-guest-btns .btn{flex:1;min-width:130px}

.buy-form{display:flex;flex-direction:column;gap:var(--sp-4)}
.qty-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap}
.qty-row label{font-size:.82rem;font-weight:600;color:var(--text-2)}
.qty-control{
  display:flex;align-items:center;overflow:hidden;
  border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--ink-850);
}
.qty-btn{
  width:46px;height:46px;flex:none;display:grid;place-items:center;
  color:var(--text-2);font-size:1.2rem;line-height:1;
  transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease);
}
.qty-btn:hover{background:rgba(255,255,255,.07);color:var(--text)}
.qty-btn:active{background:var(--gold-soft);color:var(--gold)}
.qty-control input{
  width:64px;height:46px;min-height:0;padding:0;text-align:center;
  border:0;border-inline:1px solid var(--line);border-radius:0;background:transparent;
  font:500 1.02rem/1 var(--f-mono);color:var(--text);font-variant-numeric:tabular-nums;
  -moz-appearance:textfield;appearance:textfield;
}
.qty-control input::-webkit-outer-spin-button,.qty-control input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qty-control input:focus{box-shadow:none;background:var(--ink-800)}
.qty-max{font:500 .74rem/1 var(--f-mono);color:var(--text-4);letter-spacing:.04em}

.buy-summary{
  display:grid;gap:11px;padding:16px 18px;border-radius:var(--r);
  background:var(--ink-850);border:1px solid var(--line);
}
.bs-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:.88rem;color:var(--text-3)}
.bs-row b{font:500 .95rem/1.2 var(--f-mono);color:var(--text);font-variant-numeric:tabular-nums}
.bs-row.total{padding-top:11px;border-top:1px dashed var(--line-2);color:var(--text-2)}
.bs-row.total b,#total{font-size:1.24rem!important;color:var(--gold-hi)!important}
.buy-note{text-align:center;color:var(--text-4);font-size:.82rem}
.buy-note a{text-decoration:underline;text-underline-offset:2px}

/* Mobil sabit satın alma çubuğu */
.sticky-buy{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:95;
  align-items:center;gap:12px;
  padding:11px clamp(14px,4vw,18px) calc(11px + env(safe-area-inset-bottom));
  background:rgba(10,10,16,.94);backdrop-filter:blur(18px);
  border-top:1px solid var(--line-2);box-shadow:0 -12px 34px -18px rgba(0,0,0,1);
}
.sticky-buy .sb-info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.sticky-buy .sb-k{font:500 .6rem/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-4)}
.sticky-buy .sb-v{font:500 1.06rem/1.15 var(--f-mono);color:var(--gold-hi);font-variant-numeric:tabular-nums}
.sticky-buy .btn{flex:0 0 auto}

/* ===== 13 · ÖDEME EKRANI ================================================ */
.pay-screen{max-width:940px;margin-inline:auto}
.pay-head{text-align:center;margin-bottom:clamp(22px,3.4vw,32px)}
.pay-badge{
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 15px;border-radius:var(--r-pill);
  background:var(--amber-soft);border:1px solid rgba(238,155,58,.3);
  font:500 .72rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#f7c58a;
}
.pay-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--amber);flex:none}
.pay-badge.ok{background:var(--mint-soft);border-color:rgba(63,207,142,.35);color:#8fe8c1}
.pay-badge.ok .dot{background:var(--mint)}
.pulse .dot{animation:pulse 1.9s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(238,155,58,.55)}70%{box-shadow:0 0 0 9px rgba(238,155,58,0)}100%{box-shadow:0 0 0 0 rgba(238,155,58,0)}}
.pay-head h1{
  font-family:var(--f-display);font-weight:400;
  font-size:clamp(1.6rem,4.2vw,2.4rem);line-height:1.1;margin:var(--sp-4) 0 8px;
}
.pay-head h1 b{color:var(--gold);font-weight:400;font-style:italic}
.pay-head>p{max-width:46rem;margin-inline:auto;color:var(--text-3);font-size:.92rem}

/* ödeme adımları */
.pay-steps{display:flex;list-style:none;margin:0 0 clamp(18px,2.6vw,24px);padding:0;counter-reset:s}
.pay-steps li{
  position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;
  text-align:center;font:500 .68rem/1.35 var(--f-mono);letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-4);padding:0 4px;
}
.pay-steps li::before{
  content:"";position:absolute;top:13px;left:calc(-50% + 16px);right:calc(50% + 16px);height:1px;
  background:var(--line-2);
}
.pay-steps li:first-child::before{display:none}
.pay-steps li.done::before{background:rgba(63,207,142,.45)}
.ps-n{
  width:27px;height:27px;display:grid;place-items:center;border-radius:50%;
  background:var(--ink-850);border:1px solid var(--line-2);
  font:500 .72rem/1 var(--f-mono);color:var(--text-4);
}
.pay-steps li.done{color:var(--text-3)}
.pay-steps li.done .ps-n{background:var(--mint-soft);border-color:rgba(63,207,142,.4);color:var(--mint)}
.pay-steps li.current{color:var(--gold-hi)}
.pay-steps li.current .ps-n{
  background:var(--gold-soft);border-color:var(--gold);color:var(--gold-hi);
  box-shadow:0 0 0 0 rgba(228,185,95,.5);animation:pulseGold 2s infinite;
}
@keyframes pulseGold{0%{box-shadow:0 0 0 0 rgba(228,185,95,.5)}70%{box-shadow:0 0 0 8px rgba(228,185,95,0)}100%{box-shadow:0 0 0 0 rgba(228,185,95,0)}}

.pay-grid{display:grid;grid-template-columns:270px minmax(0,1fr);gap:clamp(14px,2vw,20px);align-items:start}
.pay-qr{padding:20px;display:flex;flex-direction:column;align-items:center;gap:14px}
.qr-frame{
  padding:12px;border-radius:var(--r);background:#fff;
  box-shadow:0 0 0 1px var(--line-gold),0 14px 34px -18px rgba(0,0,0,1);
  line-height:0;
}
.qr-frame>svg{display:block;width:206px;height:206px;border-radius:4px}
.qr-fallback{display:none}
.qr-frame.qr-fail{
  background:var(--ink-850);box-shadow:none;border:1px dashed var(--line-2);
  width:230px;height:230px;
}
.qr-frame.qr-fail>svg{display:none}
.qr-frame.qr-fail .qr-fallback{
  display:grid;place-items:center;gap:8px;height:100%;padding:18px;text-align:center;line-height:1.45;
}
.qr-fallback svg{color:var(--text-4)}
.qr-fallback span{font:500 .8rem/1 var(--f-sans);color:var(--text-2)}
.qr-fallback small{font-size:.74rem;color:var(--text-4)}
.net-chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:var(--r-pill);
  background:var(--ink-850);border:1px solid var(--line-2);
  font:500 .7rem/1 var(--f-mono);letter-spacing:.06em;color:var(--text-3);
}
.net-chip b{color:var(--mint);font-weight:500}
.net-chip svg{width:13px;height:13px;color:var(--mint)}

.pay-info{padding:clamp(18px,2.4vw,24px);display:flex;flex-direction:column;gap:var(--sp-5)}
.pay-row{min-width:0}
.pay-row>label{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:9px;
  font:500 .68rem/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);
}
.pay-row .tip{color:var(--gold);letter-spacing:.06em}
.copy-box{
  display:flex;align-items:center;gap:10px;min-width:0;
  padding:12px 12px 12px 15px;border-radius:var(--r);
  background:var(--ink-850);border:1px solid var(--line-2);
  transition:border-color var(--t-fast) var(--ease);
}
.copy-box:hover{border-color:var(--line-3)}
.copy-box code{
  flex:1;min-width:0;font:400 .88rem/1.5 var(--f-mono);color:var(--text);
  overflow-wrap:anywhere;word-break:break-word;
}
.copy-box.big{
  padding:16px;background:
    radial-gradient(100% 140% at 0 0,rgba(228,185,95,.09),transparent 70%),var(--ink-850);
  border-color:var(--line-gold);
}
.copy-box.big code{
  font:500 clamp(1.4rem,4.4vw,1.9rem)/1.1 var(--f-mono);color:var(--gold-hi);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.copy-box .unit{font:500 .78rem/1 var(--f-mono);color:var(--text-3);letter-spacing:.06em;flex:none}
.copy-btn{
  display:inline-flex;align-items:center;gap:6px;flex:none;
  min-height:34px;padding:0 11px;border-radius:var(--r-xs);
  background:rgba(255,255,255,.05);border:1px solid var(--line-2);
  font:500 .76rem/1 var(--f-sans);color:var(--text-2);
  transition:all var(--t-fast) var(--ease);
}
.copy-btn svg{width:14px;height:14px}
.copy-btn:hover{background:rgba(255,255,255,.1);border-color:var(--line-3);color:var(--text)}
.copy-btn.sm{min-height:28px;padding:0 8px;font-size:.7rem}
.copy-btn.copied{background:var(--mint-soft)!important;border-color:rgba(63,207,142,.4)!important;color:#8fe8c1!important}

.pay-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.meta-item{
  padding:12px;border-radius:var(--r);text-align:center;
  background:var(--ink-850);border:1px solid var(--line);
}
.meta-k{display:block;font:500 .6rem/1 var(--f-mono);letter-spacing:.11em;text-transform:uppercase;color:var(--text-4);margin-bottom:7px}
.meta-v{font:500 .94rem/1.2 var(--f-mono);color:var(--text);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
#countdown.danger{color:var(--rose)}
#statusText{font-size:.8rem}
.pay-actions{display:grid;gap:9px}
.pay-warn{
  margin-top:var(--sp-5);padding:17px 19px;border-radius:var(--r);
  display:grid;grid-template-columns:20px minmax(0,1fr);gap:13px;
  font-size:.86rem;line-height:1.65;color:var(--text-3);
  background:linear-gradient(90deg,var(--amber-soft),transparent 70%),var(--ink-900);
  border:1px solid var(--line);border-left:3px solid var(--amber);
}
.pay-warn svg{width:20px;height:20px;color:var(--amber);margin-top:1px}
.pay-warn b{color:var(--text)}
.pay-screen.confirmed .pay-badge{background:var(--mint-soft);border-color:rgba(63,207,142,.4);color:#8fe8c1}
.pay-screen.confirmed .pay-badge .dot{background:var(--mint)}
.spinner{
  width:15px;height:15px;flex:none;border-radius:50%;display:inline-block;
  border:1.8px solid rgba(0,0,0,.25);border-top-color:rgba(0,0,0,.75);
  animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ===== bakiye yükleme formu ===== */
.deposit-cols{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(14px,2vw,20px);align-items:start}
.deposit-card,.recent-card{padding:clamp(18px,2.6vw,26px)}
.amount-input{
  display:flex;align-items:center;overflow:hidden;
  border:1px solid var(--line-2);border-radius:var(--r);background:var(--ink-850);
  transition:border-color var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease);
}
.amount-input:focus-within{border-color:var(--gold-dp);box-shadow:0 0 0 3px rgba(228,185,95,.14)}
.amount-input input{
  flex:1;min-width:0;height:58px;min-height:0;padding:0 16px;border:0;border-radius:0;background:transparent;
  font:500 1.45rem/1 var(--f-mono);color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.amount-input input:focus{box-shadow:none;background:transparent}
.amount-suffix{
  flex:none;padding:0 16px;align-self:stretch;display:grid;place-items:center;
  border-left:1px solid var(--line);
  font:500 .78rem/1 var(--f-mono);letter-spacing:.08em;color:var(--text-3);
}
.quick-amounts{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 2px}
.chip-amt{
  min-height:38px;padding:0 15px;border-radius:var(--r-xs);
  background:rgba(255,255,255,.035);border:1px solid var(--line-2);
  font:500 .86rem/1 var(--f-mono);color:var(--text-2);font-variant-numeric:tabular-nums;
  transition:all var(--t-fast) var(--ease);
}
.chip-amt:hover{background:var(--gold-soft);border-color:var(--line-gold);color:var(--gold-hi)}
.chip-amt.active{background:var(--gold);border-color:var(--gold);color:#1a1509}
.deposit-steps{display:grid;gap:12px;margin:var(--sp-6) 0 0;padding-top:var(--sp-5);border-top:1px solid var(--line);list-style:none}
.deposit-steps li{display:flex;align-items:flex-start;gap:12px;font-size:.87rem;color:var(--text-3);line-height:1.5}
.deposit-steps li>span{
  width:24px;height:24px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:var(--gold-soft);border:1px solid var(--line-gold);
  font:500 .7rem/1 var(--f-mono);color:var(--gold);
}

/* ===== 14 · HESAP & LİSTELER ============================================ */
.stat-cards{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:clamp(12px,1.6vw,16px);margin-bottom:clamp(18px,2.6vw,24px)}
.stat-card{padding:clamp(18px,2.4vw,24px);display:flex;flex-direction:column;gap:9px;position:relative;overflow:hidden}
.stat-card.hl{background:
    radial-gradient(120% 130% at 0 0,rgba(228,185,95,.11),transparent 62%),
    var(--ink-900);
  border-color:var(--line-gold)}
.stat-k{font:500 .64rem/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-4)}
.stat-v{
  font:500 clamp(1.5rem,3.4vw,1.95rem)/1.05 var(--f-mono);color:var(--text);
  font-variant-numeric:tabular-nums;letter-spacing:-.03em;overflow-wrap:anywhere;
}
.stat-card.hl .stat-v{color:var(--gold-hi)}
.stat-card .btn{margin-top:auto;align-self:flex-start}
.stat-card .stat-note{font-size:.79rem;color:var(--text-4)}

.account-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(430px,100%),1fr));gap:clamp(14px,2vw,20px);align-items:start}

/* liste satırı (sipariş / işlem / yükleme) */
.rows{display:flex;flex-direction:column}
.row-item{
  display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:13px;align-items:center;
  padding:13px 2px;border-top:1px solid var(--line);color:var(--text);
  transition:background var(--t-fast) var(--ease);
}
.rows .row-item:first-child{border-top:0}
a.row-item:hover{background:rgba(255,255,255,.025);color:var(--text)}
.ri-ico{
  width:34px;height:34px;display:grid;place-items:center;border-radius:var(--r-xs);
  background:var(--ink-800);border:1px solid var(--line);color:var(--text-3);
}
.ri-ico svg{width:16px;height:16px}
.ri-ico.pos{background:var(--mint-soft);border-color:rgba(63,207,142,.25);color:var(--mint)}
.ri-ico.neg{background:var(--rose-soft);border-color:rgba(242,96,122,.22);color:var(--rose)}
.ri-ico.gold{background:var(--gold-soft);border-color:var(--line-gold);color:var(--gold)}
.ri-main{min-width:0}
.ri-t{font-size:.9rem;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ri-s{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font:400 .74rem/1.4 var(--f-mono);color:var(--text-4);letter-spacing:.02em;margin-top:3px}
.ri-s .sep{opacity:.5}
.ri-end{display:flex;align-items:center;gap:11px;justify-self:end;text-align:right}
.ri-amt{font:500 .92rem/1.2 var(--f-mono);color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.ri-amt.pos{color:var(--mint)}
.ri-amt.neg{color:var(--text-2)}
.ri-chev{width:16px;height:16px;color:var(--text-4);flex:none;transition:transform var(--t) var(--ease-out)}
a.row-item:hover .ri-chev{transform:translateX(3px);color:var(--gold)}
.amt-pos{color:var(--mint);font-weight:500}
.amt-neg{color:var(--text-2);font-weight:500}

/* ===== 15 · SİPARİŞ / TESLİMAT ========================================== */
.order-detail{display:grid;gap:clamp(14px,2vw,18px);max-width:860px}
.order-head{padding:clamp(20px,2.8vw,28px);display:flex;justify-content:space-between;gap:var(--sp-5);flex-wrap:wrap;align-items:flex-start}
.ok-badge{
  display:inline-flex;align-items:center;gap:7px;margin-bottom:11px;
  padding:5px 11px;border-radius:var(--r-pill);
  background:var(--mint-soft);border:1px solid rgba(63,207,142,.3);
  font:500 .69rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:#8fe8c1;
}
.ok-badge svg{width:13px;height:13px}
.order-head h1{font-family:var(--f-display);font-weight:400;font-size:clamp(1.5rem,3.4vw,2rem);line-height:1.1;margin-bottom:8px}
.order-head .ri-s{font-size:.78rem}
.delivery{padding:clamp(18px,2.6vw,26px)}
.delivery-head{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.delivery-head h3{display:flex;align-items:center;gap:9px;font-size:1rem}
.delivery-head h3 svg{width:17px;height:17px;color:var(--gold)}
.delivery-box{display:grid;gap:8px;max-height:min(440px,58vh);overflow:auto;padding-right:2px}
.delivery-line{
  display:flex;align-items:center;gap:11px;min-width:0;
  padding:10px 11px;border-radius:var(--r-sm);
  background:var(--ink-850);border:1px solid var(--line);
  transition:border-color var(--t-fast) var(--ease);
}
.delivery-line:hover{border-color:var(--line-2)}
.dl-idx{
  width:24px;height:24px;flex:none;display:grid;place-items:center;border-radius:var(--r-xs);
  background:var(--ink-750);font:500 .7rem/1 var(--f-mono);color:var(--text-3);
}
.delivery-line code{flex:1;min-width:0;font:400 .86rem/1.5 var(--f-mono);color:var(--text);overflow-wrap:anywhere}

/* ===== 16 · GİRİŞ / KAYIT =============================================== */
.auth-wrap{display:grid;place-items:center;min-height:min(72vh,640px);padding:clamp(14px,4vw,40px) 0}
.auth-col{display:grid;gap:var(--sp-5);width:100%;max-width:436px}
.auth-card{width:100%;padding:clamp(24px,4vw,36px);position:relative;overflow:hidden}
.auth-card::before{
  content:"";position:absolute;inset:0 0 auto;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);opacity:.7;
}
.auth-mark{
  width:44px;height:44px;display:grid;place-items:center;border-radius:12px;margin-bottom:var(--sp-5);
  background:linear-gradient(160deg,#2a2213,#15141c 70%);border:1px solid var(--line-gold);
}
.auth-mark svg{width:25px;height:25px;color:var(--gold)}
.auth-title{font-family:var(--f-display);font-weight:400;font-size:clamp(1.7rem,4vw,2.1rem);line-height:1.1;margin-bottom:7px}
.auth-sub{color:var(--text-3);font-size:.9rem;margin-bottom:var(--sp-6)}
.auth-alt{text-align:center;margin-top:var(--sp-5);padding-top:var(--sp-5);border-top:1px solid var(--line);color:var(--text-3);font-size:.88rem}
.auth-alt a{font-weight:600}
.auth-trust{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:var(--sp-5)}
.auth-trust span{display:flex;align-items:center;gap:7px;font:500 .74rem/1 var(--f-mono);letter-spacing:.06em;color:var(--text-4);text-transform:uppercase}
.auth-trust svg{width:14px;height:14px;color:var(--text-3)}

/* ===== 17 · TABLOLAR ==================================================== */
.table-scroll{overflow:auto;-webkit-overflow-scrolling:touch;margin-inline:-2px;padding-inline:2px}
.mini-table{width:100%;font-size:.88rem}
.mini-table th{
  text-align:left;padding:0 12px 10px;white-space:nowrap;
  font:500 .64rem/1 var(--f-mono);letter-spacing:.11em;text-transform:uppercase;color:var(--text-4);
  border-bottom:1px solid var(--line-2);
}
.mini-table td{padding:11px 12px;border-bottom:1px solid var(--line);color:var(--text-2);vertical-align:middle;overflow-wrap:anywhere}
.mini-table tbody tr:last-child td{border-bottom:0}
.mini-table tbody tr{transition:background var(--t-fast) var(--ease)}
.mini-table tbody tr:hover td{background:rgba(255,255,255,.022)}
.mini-table td:first-child,.mini-table th:first-child{padding-left:2px}
.mini-table td:last-child,.mini-table th:last-child{padding-right:2px}
.mini-table .ellip{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Para ve tarih hücreleri satır ortasından bölünmesin ($2.5 / 0 gibi) */
.mini-table td.num,.mini-table th.num{white-space:nowrap;overflow-wrap:normal;font-variant-numeric:tabular-nums}

.mini-table .mono,.mini-table code{font-size:.82rem;color:var(--text)}
.mini-table small.muted{font-size:.75rem}
.link-sm{
  display:inline-flex;align-items:center;min-height:28px;padding:0 2px;
  font-size:.82rem;font-weight:500;color:var(--gold);background:none;border:0;cursor:pointer;
}
.link-sm:hover{color:var(--gold-hi);text-decoration:underline;text-underline-offset:2px}
.link-sm.danger{color:var(--rose)}
.link-sm.danger:hover{color:#ff93a6}
.row-actions{display:flex;gap:11px;align-items:center;flex-wrap:wrap}
/* td üzerinde flex, tablo hücre hizasını bozar → satır içi akış kullan */
.mini-table td.row-actions{display:table-cell;white-space:nowrap}
.mini-table td.row-actions>*{display:inline-flex;vertical-align:middle;margin-right:10px}
.mini-table td.row-actions>*:last-child{margin-right:0}
.pager{display:flex;gap:6px;margin-top:var(--sp-5);flex-wrap:wrap}
.pager a{
  min-width:38px;min-height:38px;display:inline-flex;align-items:center;justify-content:center;
  padding:0 11px;border-radius:var(--r-xs);
  background:rgba(255,255,255,.035);border:1px solid var(--line-2);
  font:500 .84rem/1 var(--f-mono);color:var(--text-2);
}
.pager a:hover{background:rgba(255,255,255,.08);color:var(--text)}
.pager a.active{background:var(--gold);border-color:var(--gold);color:#1a1509}

/* ===== 18 · FOOTER ====================================================== */
.site-footer{margin-top:clamp(48px,8vw,90px);border-top:1px solid var(--line);background:var(--ink-950)}
.footer-inner{
  display:grid;grid-template-columns:minmax(0,1.4fr) repeat(auto-fit,minmax(150px,1fr));
  gap:clamp(24px,4vw,48px);padding:clamp(32px,5vw,52px) clamp(16px,4vw,28px);
}
.footer-brand{max-width:30rem}
.footer-brand .brand{margin-bottom:var(--sp-4)}
.footer-brand p{color:var(--text-4);font-size:.86rem;line-height:1.6;max-width:30ch}
.footer-col{display:flex;flex-direction:column;gap:11px}
.footer-col .label-mono{margin-bottom:3px}
.footer-links{display:flex;flex-direction:column;gap:11px}
.footer-links a,.footer-col a{color:var(--text-3);font-size:.87rem;width:fit-content}
.footer-links a:hover,.footer-col a:hover{color:var(--gold)}
.footer-pay{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start}
.pay-chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 11px;border-radius:var(--r-xs);
  background:rgba(255,255,255,.03);border:1px solid var(--line-2);
  font:500 .7rem/1 var(--f-mono);letter-spacing:.05em;color:var(--text-3);
}
.pay-chip svg{width:13px;height:13px;color:var(--text-3)}
.footer-bottom{
  border-top:1px solid var(--line);padding:18px 0;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center;
  font:400 .78rem/1.5 var(--f-mono);color:var(--text-4);letter-spacing:.02em;
}
.footer-bottom .container{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center;width:100%}

/* ===== 19 · ADMIN ======================================================= */
.admin-body{background:var(--ink-1000)}
.admin-shell{display:grid;grid-template-columns:254px minmax(0,1fr);min-height:100vh}
.admin-side{
  position:sticky;top:0;height:100vh;z-index:70;
  display:flex;flex-direction:column;gap:var(--sp-5);
  padding:20px 14px;
  background:var(--ink-950);border-right:1px solid var(--line);
}
.admin-brand{display:flex;align-items:center;gap:10px;padding:4px 8px 0;color:var(--text)}
.admin-brand:hover{color:var(--text)}
.admin-brand .brand-text{font-size:.95rem}
.admin-brand small{
  display:block;font:500 .56rem/1 var(--f-mono);letter-spacing:.24em;color:var(--gold);margin-top:5px;
}
.admin-nav{display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto;margin-inline:-4px;padding-inline:4px}
.admin-nav .nav-group{
  font:500 .6rem/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--text-4);
  padding:16px 12px 8px;
}
.admin-nav a{
  position:relative;display:flex;align-items:center;gap:11px;
  padding:10px 12px;border-radius:var(--r-sm);
  color:var(--text-3);font-size:.89rem;font-weight:500;
  transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease);
}
.admin-nav a svg{width:17px;height:17px;flex:none;opacity:.72}
.admin-nav a i{font-style:normal;font-size:1rem;line-height:1}
.admin-nav a:hover{background:rgba(255,255,255,.045);color:var(--text)}
.admin-nav a.active{background:var(--gold-soft);color:var(--gold-hi)}
.admin-nav a.active svg{opacity:1;color:var(--gold)}
.admin-nav a{padding-left:14px}
.admin-nav a.active::before{
  content:"";position:absolute;left:0;top:8px;bottom:8px;width:2px;border-radius:2px;background:var(--gold);
}
.admin-nav a .badge{
  margin-left:auto;padding:2px 7px;border-radius:var(--r-pill);
  background:var(--rose);color:#2a060e;font:500 .66rem/1.5 var(--f-mono);
}
.admin-side-foot{display:grid;gap:8px;padding-top:var(--sp-4);border-top:1px solid var(--line)}
.admin-main{display:flex;flex-direction:column;min-width:0}
.admin-top{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;gap:var(--sp-4);
  padding:14px clamp(16px,2.6vw,26px);min-height:62px;
  background:rgba(10,10,16,.86);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.admin-page-title{font-size:1.06rem;font-weight:600;letter-spacing:-.015em}
.admin-user{margin-left:auto;display:flex;align-items:center;gap:9px;font-size:.84rem;color:var(--text-3);white-space:nowrap}
.admin-user .avatar{
  width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(150deg,var(--gold-dp),#3a2e14);border:1px solid var(--line-gold);
  color:#1a1509;font:600 .76rem/1 var(--f-sans);text-transform:uppercase;
}
.admin-role{color:var(--gold);font-weight:600}
.admin-content{padding:clamp(16px,2.6vw,26px);max-width:1280px;width:100%}
.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(168px,100%),1fr));gap:clamp(10px,1.4vw,14px);margin-bottom:clamp(16px,2.4vw,22px)}
.astat{padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.astat-k{font:500 .62rem/1.3 var(--f-mono);letter-spacing:.11em;text-transform:uppercase;color:var(--text-4)}
.astat-v{
  font:500 1.42rem/1.05 var(--f-mono);color:var(--text);
  font-variant-numeric:tabular-nums;letter-spacing:-.03em;overflow-wrap:anywhere;
}
.astat-sub{font-size:.76rem;color:var(--text-4);margin-top:-2px}
.astat.accent{
  background:radial-gradient(120% 130% at 0 0,rgba(228,185,95,.13),transparent 62%),var(--ink-900);
  border-color:var(--line-gold);
}
.astat.accent .astat-v{color:var(--gold-hi)}
.admin-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(440px,100%),1fr));gap:clamp(14px,2vw,20px);margin-bottom:clamp(14px,2vw,20px);align-items:start}
.admin-grid-form{display:grid;grid-template-columns:minmax(300px,398px) minmax(0,1fr);gap:clamp(14px,2vw,20px);align-items:start}
.codebox{
  padding:13px 15px;border-radius:var(--r-sm);overflow:auto;
  background:var(--ink-1000);border:1px solid var(--line-2);
  font:400 .8rem/1.6 var(--f-mono);color:var(--mint);
}
.stock-counts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:var(--sp-3)}
.uedit{position:relative}
.uedit summary{list-style:none;cursor:pointer}
.uedit summary::-webkit-details-marker{display:none}
.uedit-box{
  position:absolute;right:0;top:28px;z-index:40;width:294px;padding:15px;
  border-radius:var(--r);box-shadow:var(--shadow-3);
}
.uedit-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}
.settings-form{gap:var(--sp-5)}
.settings-form .btn-lg{align-self:flex-start}
.counter{font-variant-numeric:tabular-nums}

/* ===== 20 · KURULUM & MOTION ============================================ */
.card{padding:clamp(20px,3vw,30px)}
.msg{
  display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;
  padding:13px 16px;border-radius:var(--r-sm);font-size:.9rem;
  background:var(--ink-850);border:1px solid var(--line-2);border-left-width:3px;
}
.msg.ok{border-left-color:var(--mint);color:#8fe8c1}
.msg.err{border-left-color:var(--rose);color:#ffa0b0}
.msg.info{border-left-color:var(--azure);color:#a8caff}
.msg.warn{border-left-color:var(--amber);color:#f5bd7c}
.sub{color:var(--text-3);font-size:.9rem}
.db-status{display:inline-flex;align-items:center;gap:7px;font:500 .78rem/1 var(--f-mono)}
.db-on{color:var(--mint)}
.db-off{color:var(--rose)}

.reveal{opacity:0;transform:translateY(16px)}
.reveal.in{opacity:1;transform:none;transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}

/* ===== RESPONSIVE ======================================================= */
@media(max-width:1100px){
  .hero{grid-template-columns:minmax(0,1fr);gap:clamp(24px,4vw,36px)}
  .hero-inner{max-width:100%}
  .flow-card{max-width:520px}
  .stat-cards{grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr))}
  .admin-shell{grid-template-columns:222px minmax(0,1fr)}
}

@media(max-width:940px){
  .pay-grid{grid-template-columns:minmax(0,1fr)}
  .pay-qr{padding:22px}
  .deposit-cols{grid-template-columns:minmax(0,1fr)}
  /* Mobilde sıra: görsel → bilgi/satın alma → teknik özellikler */
  .product-detail{grid-template-columns:minmax(0,1fr)}
  .pd-left{display:contents}
  .pd-media{order:1;aspect-ratio:16/9;min-height:0;max-height:min(42vh,330px)}
  .pd-info{order:2}
  .pd-specs{order:3}
  .admin-grid-form{grid-template-columns:minmax(0,1fr)}
}

/* Mobil menü + admin drawer */
@media(max-width:900px){
  :root{--hdr:58px}
  .nav-toggle{display:inline-flex}
  .site-header .nav-toggle{margin-left:auto}
  .balance-pill-desktop,.user-chip .user-name{display:none}
  .balance-pill-mobile{display:flex;margin-left:auto}
  .site-header .balance-pill-mobile+.nav-toggle{margin-left:0}
  .balance-pill-mobile .bp-label{display:none}
  .header-inner{gap:10px}
  .header-collapse{
    position:fixed;top:var(--hdr);left:0;right:0;z-index:95;
    flex-direction:column;align-items:stretch;gap:var(--sp-4);
    max-height:calc(100dvh - var(--hdr));overflow-y:auto;
    padding:var(--sp-5) clamp(16px,4vw,22px) calc(var(--sp-6) + env(safe-area-inset-bottom));
    background:var(--ink-950);border-bottom:1px solid var(--line-2);
    box-shadow:var(--shadow-3);
    transform:translateY(-14px);opacity:0;visibility:hidden;
    transition:transform var(--t) var(--ease-out),opacity var(--t) var(--ease),visibility var(--t);
  }
  .header-collapse.open{transform:none;opacity:1;visibility:visible}
  .main-nav{flex-direction:column;gap:2px;align-items:stretch}
  .main-nav a{padding:13px 12px;font-size:.98rem;border-radius:var(--r-sm);gap:11px}
  .main-nav a svg{width:18px;height:18px;opacity:.75}
  .main-nav a::after{display:none}
  .main-nav a:hover,.main-nav a[aria-current=page]{background:rgba(255,255,255,.045)}
  .main-nav a[aria-current=page]{color:var(--gold)}
  .header-actions{
    margin-left:0;flex-direction:column;align-items:stretch;gap:10px;
    padding-top:var(--sp-4);border-top:1px solid var(--line);
  }
  .header-actions .btn{width:100%}
  .header-actions .user-chip{padding:4px 2px}
  .header-actions .user-chip .user-name{display:block}
}

@media(max-width:900px){
  .admin-shell{grid-template-columns:minmax(0,1fr)}
  .admin-side{
    position:fixed;left:0;top:0;width:min(280px,84vw);
    transform:translateX(-102%);transition:transform var(--t) var(--ease-out);
    box-shadow:var(--shadow-3);
  }
  .admin-side.open{transform:none}
  .admin-top .nav-toggle{display:inline-flex}
  .admin-scrim{
    position:fixed;inset:0;z-index:65;background:rgba(4,4,8,.66);
    opacity:0;visibility:hidden;transition:opacity var(--t) var(--ease);
  }
  .admin-scrim.show{opacity:1;visibility:visible}
}

/* Tablet ve altı */
@media(max-width:760px){
  .account-grid{grid-template-columns:minmax(0,1fr)}
  .footer-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .footer-brand{grid-column:1/-1}
  .order-head{flex-direction:column;gap:var(--sp-4)}

  /* Tabloları karta çevir */
  .mini-table.stack{display:block}
  .mini-table.stack thead{display:none}
  .mini-table.stack tbody,.mini-table.stack tr{display:block}
  .mini-table.stack tr{
    padding:13px 15px;margin-bottom:9px;border-radius:var(--r);
    background:var(--ink-850);border:1px solid var(--line);
  }
  .mini-table.stack tr:last-child{margin-bottom:0}
  .mini-table.stack tbody tr:hover td{background:none}
  .mini-table.stack td{
    display:flex;align-items:baseline;justify-content:space-between;gap:16px;
    padding:5px 0;border:0;text-align:right;
  }
  .mini-table.stack td::before{
    content:attr(data-label);flex:none;text-align:left;
    font:500 .66rem/1.5 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--text-4);
  }
  .mini-table.stack td:empty{display:none}
  .mini-table.stack td:first-child,.mini-table.stack td:last-child{padding-inline:0}
  .mini-table.stack .ellip{max-width:none;white-space:normal;overflow-wrap:anywhere}
  .mini-table.stack td.num{white-space:normal}
  .mini-table.stack .row-actions{justify-content:flex-end}
  .mini-table.stack td[data-label=""]::before,
  .mini-table.stack td:not([data-label])::before{display:none}
}

/* Telefon */
@media(max-width:560px){
  .page{padding-bottom:clamp(40px,10vw,64px)}
  .section-head h1{font-size:clamp(1.6rem,7vw,1.95rem)}
  .hero{padding-top:8px;gap:22px}
  .hero-eyebrow{margin-bottom:var(--sp-4);font-size:.62rem;padding:5px 11px}
  .hero-sub{margin:var(--sp-4) 0 var(--sp-5);font-size:.94rem}
  .hero-cta{gap:8px}
  .hero-cta .btn{flex:1 1 calc(50% - 4px);--btn-h:50px;padding:0 14px;font-size:.92rem}
  .hero-trust{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;
    margin-top:var(--sp-5);padding-top:var(--sp-4);
  }
  .hero-trust .trust-item{flex-direction:column;align-items:flex-start;gap:6px}
  .trust-item b{font-size:.8rem}
  .trust-item small{font-size:.68rem;line-height:1.3}
  /* akış kartını kompaktla */
  .flow-card{gap:11px;padding:16px}
  .flow-step{padding-bottom:11px;grid-template-columns:24px minmax(0,1fr);gap:11px}
  .flow-step::before{left:11.5px;top:26px}
  .flow-n{width:24px;height:24px;font-size:.68rem}
  .flow-step span span{display:none}
  .flow-step strong{margin-bottom:0;font-size:.86rem}
  .flow-amount{padding:11px 13px}
  .flow-amount code{font-size:1rem}
  .store-head{align-items:flex-start;gap:var(--sp-3)}
  .cat-filter{margin-inline:calc(-1 * clamp(16px,4vw,28px));padding-inline:clamp(16px,4vw,28px);
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
  .cat-filter::-webkit-scrollbar{display:none}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(min(148px,100%),1fr));gap:10px}
  .pc-body{padding:12px 13px 13px;gap:5px}
  .pc-title{font-size:.9rem}
  .pc-desc{display:none}
  .pc-foot{margin-top:4px;padding-top:9px}
  .pc-price{font-size:1rem}
  .pc-buy span{display:none}
  .pc-cat{display:none}
  .pay-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pay-meta .meta-item:last-child{grid-column:1/-1}
  .stat-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat-cards .stat-card.hl{grid-column:1/-1}
  .stat-card{padding:15px;gap:7px}
  .stat-card.hl .stat-v{font-size:1.65rem}
  .stat-v{font-size:1.3rem}
  .footer-inner{grid-template-columns:minmax(0,1fr)}
  .footer-bottom .container{justify-content:center;text-align:center}
  /* iOS zoom engeli */
  .field input,.field select,.field textarea,.inline-search input,.form-inline input{font-size:16px}
  .amount-input input{font-size:1.25rem}
  .delivery-line{flex-wrap:wrap}
  .delivery-line code{flex:1 1 100%;order:3}
  /* uzun adres / komut satırları alt alta */
  .copy-box{flex-wrap:wrap}
  .copy-box code{flex:1 1 100%}
  .copy-box.big code{flex:1 1 auto}
  .copy-btn{flex:0 0 auto;margin-left:auto}
  .admin-page-title{font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .admin-user span:not(.avatar){display:none}
  .admin-top{gap:11px;min-height:56px;padding:10px 14px}
  .uedit-box{position:fixed;left:14px;right:14px;top:auto;width:auto}
  /* Liste satırı: dar ekranda tutar alt satıra iner */
  .row-item{
    position:relative;grid-template-columns:30px minmax(0,1fr);
    gap:4px 11px;align-items:center;padding:12px 2px;
  }
  .ri-ico{width:30px;height:30px;grid-row:1/3;align-self:center}
  .ri-main{grid-column:2;grid-row:1}
  .ri-end{grid-column:2;grid-row:2;justify-self:start;justify-content:flex-start;gap:8px}
  a.row-item{padding-right:22px}
  a.row-item .ri-chev{position:absolute;right:0;top:50%;transform:translateY(-50%)}
  a.row-item:hover .ri-chev{transform:translateY(-50%) translateX(3px)}
  .ri-s{font-size:.72rem}
  body.has-sticky-buy .page{padding-bottom:104px}
  .sticky-buy{display:flex}
  .qty-row{justify-content:space-between}
  .admin-content{padding:14px}
  .astat{padding:14px 15px}
  .astat-v{font-size:1.25rem}
  .site-footer{margin-top:clamp(32px,7vw,48px)}
  .page{min-height:0}
}

@media(max-width:400px){
  .brand-text{font-size:.9rem;letter-spacing:.06em}
  .brand-mark{width:31px;height:31px}
  .brand-sub{display:none}
  .balance-pill{padding:6px 10px;gap:7px}
  .bp-amount{font-size:.78rem}
  .product-grid{gap:8px}
  .pc-media{aspect-ratio:1}
  .pc-title{font-size:.86rem}
  .copy-box.big code{font-size:1.32rem}
  .qr-frame>svg{width:min(190px,64vw);height:auto;aspect-ratio:1}
  .hero-trust{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .trust-item b{font-size:.74rem}
  .trust-item small{font-size:.63rem}
}

/* Çok dar telefonlar */
@media(max-width:340px){
  .product-grid{grid-template-columns:minmax(0,1fr)}
  .pc-media{aspect-ratio:16/9}
  .hero-cta .btn{flex:1 1 100%}
  .hero-trust{grid-template-columns:minmax(0,1fr);gap:8px}
  .hero-trust .trust-item{flex-direction:row;align-items:center}
}

/* Geniş ekran */
@media(min-width:1440px){
  :root{--wrap:1280px}
}

/* Hareketi azalt */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}

/* Yazdırma */
@media print{
  .site-header,.site-footer,.sticky-buy,.bg-anim,.nav-scrim,#toast{display:none!important}
  body{background:#fff;color:#111}
  .glass,.surface{border-color:#ddd;box-shadow:none;background:#fff}
  .delivery-line code,.copy-box code{color:#111}
}