/* Odadan Sepete birleşik tasarım (14 Ekim seçimleri). Taban: /yeni/stil.css + atölye (atolye.css) + v2 sıvı metal (tema-sivi.css).
   Burada: tezgâhtan gelen ekranlar (kapı, bekleme, karar, kalan açılar, ada, kartela), koyu sahnelerin sıvı metal kartları,
   yeni fiş (tepeden dökülür, ürünler fotoğraftan iner, yırtılır). Kural: sarı, altın, pirinç yok. */

/* ---------- Ortak ---------- */
.ortali{text-align:center}
.alt-yazi{color:var(--ink-2);font-size:.875rem;line-height:1.5}
.bag{display:inline;padding:0;border:0;background:none;color:var(--ink);font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;cursor:pointer}
.maliyet{display:none;font-weight:600;opacity:.75}
body.maliyet-goster .maliyet{display:inline}
.cam-kart{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-fx);backdrop-filter:var(--glass-fx);box-shadow:var(--slab-in),var(--lift);border-radius:26px}
.kirpim{background-repeat:no-repeat;background-color:#d9dce1}
.kumlama{font-size:1.875rem;font-weight:800;letter-spacing:-.025em;line-height:1.1;text-align:center;color:rgba(21,23,27,.2);text-shadow:0 1px 0 rgba(255,255,255,.9),0 -1px 1px rgba(30,36,48,.25)}
@keyframes ic-in{from{opacity:0}to{opacity:1}}
@keyframes levha-yuk{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
.modul-yok{position:absolute;inset:0;display:grid;place-content:center;gap:.25rem;text-align:center;color:var(--ink-2);background:var(--v2-zemin)}
.modul-yok b{font-size:1.125rem;color:var(--ink)}

/* Köşe parantez: eşyayı fotoğrafta gösterir (sedef beyazı, sarı değil) */
.parantez{position:absolute;pointer-events:none;z-index:3}
.parantez i{position:absolute;width:16px;height:16px;border:2px solid #f7f8fa;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6));opacity:0;transition:transform .42s var(--ease),opacity .3s}
.parantez i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0;border-top-left-radius:4px;transform:translate(-8px,-8px)}
.parantez i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0;border-top-right-radius:4px;transform:translate(8px,-8px)}
.parantez i:nth-child(3){right:0;bottom:0;border-left:0;border-top:0;border-bottom-right-radius:4px;transform:translate(8px,8px)}
.parantez i:nth-child(4){left:0;bottom:0;border-right:0;border-top:0;border-bottom-left-radius:4px;transform:translate(-8px,8px)}
.parantez.acik i{opacity:1;transform:none}
.parantez span{position:absolute;left:0;top:-30px;padding:4px 9px;border-radius:999px;background:rgba(12,13,15,.72);color:#f6f7f9;font-size:.75rem;font-weight:700;white-space:nowrap;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.parantez.kalir i{border-color:rgba(255,255,255,.7)}
.parantez.ic span{top:10px;left:10px}
.parantez.kalir span{background:rgba(12,13,15,.6);color:#dfe2e7}
.parantez.yeni span{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}

/* ---------- Koyu sahneler (kapı, bekleme): gece camı, kenarında soluk krom ve sedef izi ---------- */
html[data-tema="sivi"] .ekran.koyu{
  color-scheme:dark;color:var(--ink);
  --ink:#f5f6f8;--ink-2:#d7dae0;--ink-3:#adb1b9;
  --glass-a:rgba(44,47,54,.8);--glass-b:rgba(20,22,27,.88);--glass-fx:blur(20px) saturate(1.5);
  --rim-1:rgba(255,255,255,.7);--rim-2:rgba(200,206,216,.2);--rim-0:rgba(151,203,232,.06);--rim-3:rgba(226,220,247,.42);
  --glow:rgba(255,255,255,.12);--edge:rgba(0,0,0,.5);--streak:rgba(255,255,255,.07);--streak-2:rgba(255,255,255,.04);--hot-on:rgba(255,255,255,.09);
  --lift:0 1px 1px rgba(0,0,0,.35),0 22px 44px -16px rgba(0,0,0,.75);
  --line:rgba(255,255,255,.13);--line-2:rgba(255,255,255,.26);--hover:rgba(255,255,255,.08);--sel:rgba(255,255,255,.15);
  --inner:rgba(255,255,255,.06);--inner-sh:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 1px rgba(255,255,255,.07),0 1px 2px rgba(0,0,0,.3);
  --cap:rgba(6,7,9,.6);--cap-solid:#16181c;--cap-ink:#f6f7f9;--cap-ink-2:#c6cad1;--cap-line:rgba(255,255,255,.13);--cap-hover:rgba(255,255,255,.08);
  --cap-sh:inset 0 1px 2px rgba(0,0,0,.65),inset 0 -1px 0 rgba(255,255,255,.07),0 1px 0 rgba(255,255,255,.09);
  --primary:#f4f5f7;--primary-ink:#15171b;--primary-hover:#fff;--focus:#f5f6f8;
  --lite-a:rgba(42,44,50,.97);--lite-b:rgba(24,26,30,.97);
  /* bileşik belirteçler gövdede bir kez çözülür; koyu sahnede yeniden kurulmalı */
  --glass-bg:linear-gradient(180deg,var(--glass-a),var(--glass-b));
  --lite-bg:linear-gradient(180deg,var(--lite-a),var(--lite-b));
  --slab-in:inset 0 1.5px 0 var(--rim-1),inset 0 0 0 1px var(--rim-0),inset 0 -1px 0 var(--edge),inset 0 18px 28px -20px var(--glow),inset 0 -14px 24px -22px var(--edge)}
html[data-tema="sivi"] .ekran.koyu .seg{--focus:#fff}

/* ---------- 1. Giriş kapısı ---------- */
#e-kapi{background:#0b0c0e}
/* Açılış Evim'e gidecekse (baş betiği, os.iceride) kapı JS ekran seçene kadar hiç görünmez */
html[data-acilis="ev"] body:not([data-ekran]) #e-kapi{visibility:hidden}
.kapi-tuval{position:absolute;inset:0;width:100%;height:100%;display:block}
/* Zemin: kapalı videonun ilk karesi; video ilk karesini oynatınca üstünde aynı kareyle belirir (çizim ya da siyah ara yok) */
.kapi-video{position:absolute;inset:0;overflow:hidden;transform-origin:var(--giris-x,60%) var(--giris-y,46%);will-change:transform;
  background:#0b0c0e url(/birlesik/video/kapi-kapali-ilk.jpg) 50% 50%/cover no-repeat}
.kapi-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s ease;
  filter:brightness(calc(1 + var(--hane,0) * .14)) contrast(1.02)}
.kapi-video video.gorunur{opacity:1}
/* Giriş ışığı: kapı aralığından taşan hale, sonra sıcak beyaz (sarı değil) */
.kapi-isik{position:absolute;inset:0;z-index:5;pointer-events:none;overflow:hidden}
.kapi-isik .hale{position:absolute;inset:0;opacity:0;mix-blend-mode:screen;transform-origin:var(--giris-x,83%) var(--giris-y,30%);
  background:radial-gradient(ellipse 34% 26% at var(--giris-x,83%) var(--giris-y,30%),#fff 0%,rgba(255,252,246,.92) 28%,rgba(255,248,238,.38) 62%,rgba(255,248,238,0) 100%)}
.kapi-isik .beyaz{position:absolute;inset:0;opacity:0;background:#fffcf7}
/* Kapı tam beyaza yanınca ekran değişir; bu perde (cihazın üstünde, aynı beyaz) sıradaki ekranı beyazdan açar */
.kapi-beyaz-perde{position:absolute;inset:0;z-index:85;pointer-events:none;background:#fffcf7}
.videolu .kapi-ic{animation-duration:.9s}
.kapi-video::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(6,7,9,.5),rgba(6,7,9,0) 18%,rgba(6,7,9,0) 52%,rgba(6,7,9,.55) 80%,rgba(6,7,9,.82))}
.kapi-ust{position:absolute;z-index:3;top:calc(14px + env(safe-area-inset-top));left:14px;display:flex;align-items:center;gap:.625rem;padding:.3125rem .9375rem .3125rem .3125rem;border-radius:999px;
  color:#f6f7f9;background:rgba(14,15,18,.5);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 .5px rgba(255,255,255,.12);pointer-events:none}
.kapi-ust .logo-disk{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;color:#15171b;background:radial-gradient(circle at 40% 28%,#fff 0 18%,#e7eaee 55%,#9aa1ab 100%);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 1px rgba(59,64,72,.35)}
.kapi-ust .logo-disk svg.i{width:15px;height:15px}
.kapi-marka{display:grid;line-height:1.15}
.kapi-marka b{font-size:.875rem;font-weight:800;letter-spacing:-.01em}
.kapi-marka span{font-size:.6875rem;color:#c6cad1}
.kapi-levha{position:absolute;z-index:4;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));padding:22px 18px 18px;border-radius:30px;transition:transform .55s var(--ease),opacity .4s}
.kapi-levha .adim{display:grid;gap:12px}
.kapi-levha h1{font-size:1.625rem;font-weight:800;letter-spacing:-.025em;line-height:1.1}
.kapi-levha .kucuk{font-size:.8125rem;color:var(--ink-3)}
.kapi-levha.cik{transform:translateY(calc(100% + 24px));opacity:0;pointer-events:none}
#e-kapi .tel-alan{display:flex;align-items:center;gap:10px;height:3.25rem;padding:0 16px;border-radius:16px;background:var(--cap);box-shadow:var(--cap-sh);color:var(--cap-ink);cursor:text}
#e-kapi .tel-alan .ulke{font-weight:700;color:var(--cap-ink-2);padding-right:10px;border-right:1px solid var(--cap-line)}
#e-kapi .tel-alan input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--cap-ink);font-size:1.0625rem;font-weight:600;letter-spacing:.02em;outline:0;font-variant-numeric:tabular-nums}
#e-kapi .tel-alan input::placeholder{color:rgba(246,247,249,.4)}
#e-kapi .tel-alan:focus-within{box-shadow:var(--cap-sh),0 0 0 2px rgba(255,255,255,.75)}
.kod-alan{position:relative}
.kod-kutular{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.kod-kutular span{display:grid;place-items:center;height:3.5rem;border-radius:14px;background:var(--cap);box-shadow:var(--cap-sh);color:var(--cap-ink);font-size:1.5rem;font-weight:800;font-variant-numeric:tabular-nums;transition:box-shadow .15s,transform .2s var(--ease)}
.kod-kutular span.dolu{animation:hane-in .22s var(--ease)}
.kod-kutular span.imlec{box-shadow:var(--cap-sh),0 0 0 1.5px transparent;background:linear-gradient(var(--cap-solid),var(--cap-solid)) padding-box,linear-gradient(170deg,#fff,#9aa1ab 45%,#b4a9e6 70%,#eef0f3) border-box;border:1.5px solid transparent}
.kod-kutular span.imlec::after{content:"";width:2px;height:1.4rem;border-radius:1px;background:#eef0f3;animation:imlec 1s steps(1) infinite}
.kod-kutular.yanlis span{box-shadow:var(--cap-sh),0 0 0 1.5px rgba(255,255,255,.35)}
.kod-girdi{position:absolute;inset:0;width:100%;height:100%;opacity:0;font-size:16px;color:transparent;caret-color:transparent;border:0;background:transparent;letter-spacing:2.6em}
@keyframes hane-in{from{transform:translateY(4px) scale(.94)}to{transform:none}}
@keyframes imlec{50%{opacity:0}}
.kapi-ic{position:absolute;inset:0;z-index:6;animation:ic-in .5s ease both}
.kapi-ic-gorsel{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kapi-ic::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.35));pointer-events:none}
.kapi-ic-levha{position:absolute;z-index:2;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));display:grid;gap:8px;padding:20px 18px 16px;border-radius:30px;animation:levha-yuk .6s .25s var(--ease) both}
.kapi-ic-levha h1{font-size:1.5rem;font-weight:800;letter-spacing:-.025em;line-height:1.12}
.ic-dugmeler{display:flex;gap:8px;margin-top:6px}
.ic-dugmeler>*{height:2.875rem;flex:1}
.ic-dugmeler .altin{flex:1.2}
@media (prefers-reduced-motion:reduce){
  .kapi-levha,.kapi-ic,.kapi-ic-levha{transition:none!important;animation:none!important}
  .kod-kutular span.imlec::after{animation:none}
  .kapi-video video{transition:none}
}

/* ---------- 4. Bekleme ---------- */
#e-bekleme{background:#0b0c0e}
.b-sahne{position:absolute;inset:0;overflow:hidden}
.b-ic{position:absolute;inset:0;transform-origin:0 0;transition:transform .8s var(--ease)}
.b-sahne canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.b-sahne::after{content:"";position:absolute;inset:0 0 auto 0;height:110px;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,0));pointer-events:none}
.b-katman{position:absolute;inset:0;z-index:2;pointer-events:none}
.b-levha{position:absolute;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));display:grid;gap:12px;padding:16px 16px 14px;border-radius:28px}
/* Başlık kapsülü (ref: glowing blue orb nav kapsülü): oyuk gece camı; plazma küre sol başta, kapsülle aynı yükseklikte.
   Tuval kapsülün tamamı: küre, halesi ve kapsül kenarına sızan ışık aynı shader'da (opal.js). Yazı küre ışığının üstünde, tam beyaz. */
.b-bas{position:relative;display:flex;align-items:center;min-height:72px;padding:8px 18px 8px 82px;border-radius:999px;isolation:isolate;
  background:radial-gradient(90px 110% at 36px 50%,rgba(150,190,230,.10),transparent 70%),linear-gradient(180deg,#07080b,#0c0d11);
  box-shadow:inset 0 2px 5px rgba(0,0,0,.85),inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -1px 0 rgba(255,255,255,.07),0 1px 0 rgba(255,255,255,.08)}
.b-opal{position:absolute;inset:0;width:100%;height:100%;display:block;border-radius:inherit;z-index:0;pointer-events:none}
.b-durum{position:relative;z-index:1;min-width:0;flex:1}
.b-durum h1{font-size:1.25rem;font-weight:800;letter-spacing:-.02em;line-height:1.15;color:#f7f8fa;text-shadow:0 1px 2px rgba(0,0,0,.55);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b-durum .kucuk{font-size:.8125rem;color:#c3c7ce}
/* Aşama kapsülü: atölyenin koyu kapsülü, içinde sedef hap aşamadan aşamaya kayar */
.b-adimlar{position:relative}
.b-adimlar .adim-hap{position:absolute;left:0;top:3px;bottom:3px;width:0;border-radius:999px;pointer-events:none;z-index:0;
  border:1px solid transparent;background:linear-gradient(180deg,#fff,#e8ebef) padding-box,linear-gradient(180deg,#fff 0%,#cdd2d9 55%,#8e95a0 100%) border-box;
  box-shadow:0 1px 2px rgba(0,0,0,.35),0 6px 14px -6px rgba(0,0,0,.6);transition:transform .6s var(--ease),width .6s var(--ease)}
html[data-tema="sivi"] .b-adimlar button,html[data-tema="sivi"] .b-adimlar button.simdi{position:relative;z-index:1;height:2.125rem;font-size:.8125rem;background:transparent!important;box-shadow:none!important;border-color:transparent!important;transition:color .3s}
.b-adimlar button{color:var(--cap-ink-2);cursor:default}
.b-adimlar button.bitti{color:var(--cap-ink)}
.b-adimlar button.bitti::before{content:"";width:5px;height:5px;margin-right:2px;border-radius:50%;background:currentColor;opacity:.7}
html[data-tema="sivi"] .b-adimlar button.simdi{color:#15171b}
.b-adimlar.bitti-hepsi .adim-hap{opacity:.0}
.b-secki{display:grid;gap:10px;animation:levha-yuk .4s var(--ease) both}
.b-toplam{display:flex;justify-content:space-between;align-items:end;gap:10px;padding-top:10px;border-top:1px solid var(--line)}
.b-toplam>div{display:grid}
.b-toplam>div b{font-size:.875rem}
.b-toplam .kucuk{font-size:.8125rem;color:var(--ink-3)}
.b-toplam>b{font-size:1.5rem;font-weight:800;letter-spacing:-.02em}
.b-deste{position:relative;height:164px;cursor:pointer;touch-action:pan-y}
.b-kart{position:absolute;inset:0;display:grid;grid-template-columns:104px 1fr;align-items:stretch;gap:12px;padding:10px;border-radius:20px;overflow:hidden;
  background:linear-gradient(180deg,#f8f9fa,#eceef1);color:#141518;box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 10px 24px -12px rgba(0,0,0,.7);
  transform:translateY(calc(var(--d) * -8px)) rotate(calc(var(--d) * -1.6deg)) scale(calc(1 - var(--d) * .04));transform-origin:50% 100%;
  transition:transform .35s var(--ease),opacity .25s}
.b-kart:nth-child(3){transform:translateY(-14px) rotate(2deg) scale(.92)}
.b-kart.arka>*{opacity:0}
.b-kart::after{content:"";position:absolute;inset:-30% -18% -30% 62%;background:radial-gradient(closest-side,var(--r1),transparent),radial-gradient(closest-side at 50% 85%,var(--r2),transparent);filter:blur(18px);opacity:.42;pointer-events:none}
/* 14 Ekim notun: kart sağdan ya da soldan kayarak gelir */
.b-kart.gel-sag{animation:gel-sag .6s var(--ease) both}
.b-kart.gel-sol{animation:gel-sol .6s var(--ease) both}
@keyframes gel-sag{from{transform:translateX(118%) rotate(9deg);opacity:0}60%{opacity:1}}
@keyframes gel-sol{from{transform:translateX(-118%) rotate(-9deg);opacity:0}60%{opacity:1}}
.b-kart.git-sol{transform:translateX(-112%) rotate(-6deg)!important;opacity:0}
.b-kart.git-sag{transform:translateX(112%) rotate(6deg)!important;opacity:0}
.b-kart-gorsel{position:relative;align-self:center;aspect-ratio:1;border-radius:14px;background:#fff;overflow:hidden}
.b-kart-gorsel img{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain}
.b-kart-yazi{position:relative;z-index:1;display:grid;align-content:center;gap:2px;min-width:0}
.b-fiyat{font-size:1.5rem;font-weight:800;letter-spacing:-.03em;line-height:1}
.b-kim{font-size:.8125rem;color:#3a3d42;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.b-kim b{color:#141518}
.b-kart q{font-size:.75rem;line-height:1.35;color:#565a61;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.b-deste-alt{display:flex;justify-content:space-between;padding:0 4px}
.b-deste-alt .kucuk{font-size:.75rem;color:var(--ink-3)}
.b-hazir{display:flex;gap:8px}
.b-hazir>*{height:2.875rem}
.b-hazir .altin{flex:1}
.b-levha.kucuk-levha .b-deste,.b-levha.kucuk-levha .b-deste-alt{display:none}
.b-levha.kucuk-levha .b-toplam{cursor:pointer;padding:10px 12px;margin:0 -4px;border:0;border-radius:14px;background:var(--inner);box-shadow:var(--inner-sh)}
.b-levha.kucuk-levha .b-toplam>b{font-size:1.125rem}
.b-levha.kucuk-levha .b-toplam>b::after{content:" ›";color:var(--ink-3);font-weight:600}
@media (prefers-reduced-motion:reduce){.b-kart,.b-secki,.b-adimlar .adim-hap{transition:none;animation:none!important}}

/* ---------- 5. Karar kartı (açık ton) ---------- */
#e-karar{background:var(--v2-zemin)}
.k-sahne{position:absolute;inset:0 0 auto 0;height:56%;display:grid;grid-template-columns:repeat(var(--bol,1),1fr);gap:3px;transition:opacity .3s}
.k-sahne::after{content:"";position:absolute;inset:auto 0 0 0;height:40%;background:linear-gradient(180deg,rgba(236,238,242,0),#eceef2);pointer-events:none}
.k-kare{position:relative;overflow:hidden;animation:ic-in .35s ease both}
.k-kare img{position:absolute;left:0;top:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .9s var(--ease)}
.k-kare .parantez{transition:none}
.k-yer{position:absolute;left:10px;top:calc(14px + env(safe-area-inset-top));padding:4px 9px;border-radius:999px;background:rgba(12,13,15,.62);color:#f2f3f5;font-size:.6875rem;font-weight:700;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:4}
.k-alt{position:absolute;left:0;right:0;bottom:0;padding:0 12px calc(14px + env(safe-area-inset-bottom));display:grid;gap:10px}
.k-ust{display:flex;justify-content:space-between;align-items:baseline;padding:0 8px;font-size:.8125rem;color:var(--ink-3)}
.k-ust .kucuk:first-child{font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.k-deste{position:relative;height:392px}
.k-kart{position:absolute;inset:0;display:grid;grid-template-rows:auto 1fr auto auto;gap:12px;padding:18px 16px 14px;
  background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-fx);backdrop-filter:var(--glass-fx);box-shadow:var(--slab-in),var(--lift);border-radius:26px;
  transform:translateY(calc(var(--d,0) * -13px)) scale(calc(1 - var(--d,0) * .05));opacity:calc(1 - var(--d,0) * .28);
  transition:transform .38s var(--ease),opacity .38s;touch-action:pan-y;user-select:none}
.k-kart.surukle{transition:none}
.k-kart>*{transition:opacity .3s .1s}
.k-kart.arka>*{opacity:0;transition:none}
.k-kart.arka{-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(180deg,rgba(250,250,252,.96),rgba(226,229,234,.96))}
.k-kart.gelis{animation:kart-netles .45s var(--ease) both}
.k-kart.cik-sag{transform:translate(118%,-5%) rotate(9deg)!important;opacity:0}
.k-kart.cik-sol{transform:translate(-118%,-5%) rotate(-9deg)!important;opacity:0}
@keyframes kart-netles{from{opacity:.35;filter:blur(6px);transform:translateY(10px) scale(.97)}to{opacity:1;filter:none;transform:none}}
.k-kart-ust h2{font-size:1.25rem;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.k-kart-ust p{margin-top:2px;color:var(--ink-2);font-size:.9375rem}
.k-gorsel{display:grid;grid-template-columns:1fr 20px 1fr;align-items:center;gap:8px;min-height:0}
.k-senin,.k-oneri{position:relative;aspect-ratio:1;border-radius:16px;min-height:0}
.k-senin .kirpim{position:absolute;inset:0;border-radius:16px;box-shadow:0 0 0 1px var(--line)}
.k-senin.yigin .kirpim:nth-child(1){inset:0 14% 14% 0}
.k-senin.yigin .kirpim:nth-child(2){inset:14% 0 0 14%;box-shadow:0 0 0 2px #f4f5f7,0 8px 18px -6px rgba(30,36,48,.45)}
.k-senin>span,.k-oneri>span{position:absolute;left:8px;bottom:8px;padding:3px 8px;border-radius:999px;background:rgba(12,13,15,.66);color:#f2f3f5;font-size:.6875rem;font-weight:700;z-index:2}
.k-oneri{overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--line)}
.k-oneri img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.35);mix-blend-mode:multiply}
.k-ok{color:var(--ink-3);width:18px;height:18px}
.k-urun{display:grid;gap:2px;font-size:.8125rem;color:var(--ink-2)}
.k-urun>b{font-size:.9375rem;color:var(--ink);font-weight:700}
.k-urun .mono{color:var(--ink);font-weight:800}
.k-neden{color:var(--ink-3)}
.k-dugmeler{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.k-dugmeler .tb{height:2.875rem;font-size:.9375rem;font-weight:700;white-space:normal;line-height:1.15;color:var(--ink)}
.k-bitti{display:grid;gap:12px;padding:22px 16px 16px;border-radius:26px;background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-fx);backdrop-filter:var(--glass-fx);box-shadow:var(--slab-in),var(--lift);animation:levha-yuk .45s var(--ease) both}
.k-bitti .kucuk{font-size:.8125rem;color:var(--ink-3)}
.k-ozet{display:grid;gap:6px}
.k-cip{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:10px;padding:6px 10px 6px 6px;border:0;border-radius:14px;background:var(--inner);box-shadow:var(--inner-sh);color:var(--ink);text-align:left}
.k-cip .kirpim{width:40px;height:40px;border-radius:10px}
.k-cip b{display:block;font-size:.875rem}
.k-cip em{font-style:normal;font-size:.75rem;color:var(--ink-3)}
.k-cip-degis{font-size:.75rem;font-weight:700;color:var(--ink-2);padding:4px 9px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-2)}
/* 14 Ekim notun: kararı göndermek ücretli, açıkça yazar */
.k-ucret{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:10px 12px;border-radius:14px;background:rgba(30,38,52,.06);box-shadow:inset 0 0 0 1px var(--line);font-size:.8125rem;line-height:1.45;color:var(--ink-2)}
.k-ucret b{color:var(--ink)}
.k-ucret-rozet{padding:2px 9px;border-radius:999px;background:#1b1e24;color:#f7f8fa;font-size:.6875rem;font-weight:800;letter-spacing:.01em;margin-top:1px}
#k-ciz{height:3.125rem}
@media (prefers-reduced-motion:reduce){.k-kart,.parantez i{transition:none}.k-kart.gelis,.k-bitti,.k-kare{animation:none}}

/* ---------- Uygulama içi ada ---------- */
.ada{position:absolute;z-index:70;top:calc(11px + env(safe-area-inset-top));left:50%;width:124px;height:36px;margin-left:-62px;border-radius:20px;background:#000;color:#f2f3f5;overflow:hidden;
  display:flex;align-items:center;gap:12px;padding:0 14px;opacity:0;pointer-events:none;cursor:pointer;
  transition:width .45s var(--ease),height .45s var(--ease),margin-left .45s var(--ease),border-radius .45s var(--ease),opacity .2s}
.ada[data-hal=kompakt]{width:214px;margin-left:-107px;opacity:1;pointer-events:auto}
.ada[data-hal=genis]{width:366px;max-width:calc(100% - 16px);height:98px;margin-left:min(-183px,calc(-50% + 8px));border-radius:34px;opacity:1;pointer-events:auto;padding:0 18px 0 14px}
.ada-tuval{display:none;width:132px;height:72px;flex:none}
.ada[data-hal=genis] .ada-tuval{display:block}
.ada-yazi{flex:1;display:flex;align-items:center;justify-content:space-between;min-width:0;font-size:.8125rem;font-weight:700}
.ada[data-hal=genis] .ada-yazi{display:grid;justify-content:start;gap:2px;align-content:center}
.ada[data-hal=genis] .ada-yazi b{font-size:.9375rem;font-weight:800;letter-spacing:-.01em}
.ada[data-hal=genis] .ada-yazi span{font-size:.75rem;font-weight:600;color:#aab0b9}
.ada-ledler{display:flex;gap:5px}
.ada-ledler i{width:6px;height:6px;border-radius:50%;background:#55565a;animation:led 2.4s ease-in-out infinite}
.ada-ledler i:nth-child(2){animation-delay:.8s}.ada-ledler i:nth-child(3){animation-delay:1.6s}
.ada-ledler i.yandi{background:#f4f6fa;box-shadow:0 0 6px rgba(205,229,242,.9),0 0 2px rgba(226,220,247,.9);animation:none}
.ada-sayi{color:#e9ecf2}
@keyframes led{0%,100%{background:#4a4b4f}40%{background:#9b9ca0}}

/* ---------- 7. Kalan açılar (açık ton, sıvı metal düğme) ---------- */
#e-arka{background:var(--v2-zemin)}
.a-zemin{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:filter .4s,transform .4s}
#e-arka.sepette .a-zemin{filter:blur(18px) brightness(1.1) saturate(.8);transform:scale(1.08)}
.a-ust{position:absolute;top:calc(58px + env(safe-area-inset-top));left:0;right:0;display:flex;justify-content:center;z-index:3}
.a-ust .seg{background:rgba(238,240,244,.8);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 .5px rgba(30,36,48,.16),0 14px 30px -12px rgba(30,36,48,.45)}
.a-onay{position:absolute;top:calc(110px + env(safe-area-inset-top));left:14px;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(12,13,15,.62);color:#f2f3f5;font-size:.75rem;font-weight:700;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.a-levha{position:absolute;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));display:grid;gap:12px;padding:16px}
.a-levha h2{font-size:1.125rem;font-weight:800;letter-spacing:-.015em}
.a-levha .kucuk{font-size:.8125rem;color:var(--ink-3)}
.a-seritler{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.a-serit{position:relative;margin:0;aspect-ratio:3/4;border-radius:12px;overflow:hidden;background:#d9dce1;box-shadow:0 0 0 1px var(--line)}
.a-serit img{width:100%;height:100%;object-fit:cover;transition:filter .5s}
.a-serit.bos img,.a-serit.suruyor img{filter:grayscale(.85) brightness(.7)}
.a-serit figcaption{position:absolute;left:6px;right:6px;bottom:6px;font-size:.6875rem;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.7)}
.a-rozet{position:absolute;left:5px;top:5px;padding:2px 6px;border-radius:999px;background:rgba(12,13,15,.7);color:#dfe2e7;font-size:.625rem;font-weight:700}
.a-serit.hazir .a-rozet,.a-serit.onayli .a-rozet{color:#15171b;background:linear-gradient(180deg,#fff,#e6e9ee);box-shadow:0 0 0 .5px rgba(30,36,48,.3)}
.a-serit.hazir{animation:serit-hazir .6s var(--ease)}
@keyframes serit-hazir{40%{transform:scale(1.05)}}
.a-dugme{position:relative;gap:10px}
.a-opal{width:26px;height:26px;display:none;position:relative;z-index:2}
.a-dugme.calisiyor .a-opal{display:block}
#a-etiket{position:relative;z-index:2}
/* çalışırken sıvı metal canlı kalır: halka ve sedef akış döner, düğme soluklaşmaz */
html[data-tema="sivi"] .a-dugme.calisiyor:disabled{opacity:1;filter:none;cursor:default}
html[data-tema="sivi"] .a-dugme.calisiyor:disabled .sivi-halka{opacity:1}
html[data-tema="sivi"] .a-dugme.calisiyor.sivi::before{animation:v2-akis 3.4s ease-in-out infinite alternate}
html[data-tema="sivi"] .a-dugme.calisiyor .sivi-halka{animation:tur 3.2s linear infinite}
.a-sepet{position:absolute;left:12px;right:12px;top:calc(116px + env(safe-area-inset-top));display:grid;gap:10px;padding:18px 16px;animation:levha-yuk .35s var(--ease) both}
.a-sepet .kucuk{font-size:.8125rem;color:var(--ink-3)}
.a-sepet-bas{display:flex;justify-content:space-between;align-items:baseline}
.a-sepet-bas h2{font-size:1.375rem;font-weight:800;letter-spacing:-.02em}
.a-sepet-bas b{font-size:1.125rem}
.a-sepet ul{list-style:none;margin:0;padding:0;display:grid}
.a-sepet li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 2px;border-bottom:1px solid var(--line);font-size:.875rem}
.a-sepet li span:first-child{display:grid}
.a-sepet li em{font-style:normal;font-size:.75rem;color:var(--ink-3)}
.a-sepet li.yeni{animation:satir-in .5s var(--ease) both;box-shadow:inset 3px 0 0 #3b4048;padding-left:10px}
@keyframes satir-in{from{opacity:0;transform:translateY(-22px)}}
@media (prefers-reduced-motion:reduce){.ada-ledler i{animation:none}.ada{transition:none}}

/* ---------- Yüzeyler: buzlu kartela (atölyenin Yüzeyler yuvasında alt levha) ---------- */
.yuzey-levha{gap:.75rem}
.kt-bas{display:grid;gap:1px}
.kt-bas .kucuk{font-size:.8125rem;color:var(--ink-3)}
.kt-izgara-kap{position:relative;padding:8px;border-radius:18px;background:rgba(30,38,52,.05);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;touch-action:none;cursor:crosshair}
.kt-leke{position:absolute;left:0;top:0;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;background:radial-gradient(closest-side,var(--c,#b4bac3),transparent);filter:blur(22px);opacity:0;pointer-events:none;transition:transform .18s ease-out,background .25s,opacity .2s}
.kt-izgara-kap.basili .kt-leke,.kt-izgara-kap.gez .kt-leke{opacity:.85}
.kt-izgara{position:relative;display:grid;grid-template-columns:8px repeat(6,1fr);gap:6px;align-items:center;max-width:320px;margin:0 auto}
.kt-palet{width:8px;height:100%;min-height:36px;border-radius:4px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(30,36,48,.18)}
.kt-karo{--yakin:0;position:relative;aspect-ratio:1;border:0;padding:0;border-radius:11px;background:var(--c);cursor:pointer;
  transform:scale(calc(1 + var(--yakin) * .1));transition:transform .18s ease-out;box-shadow:0 1px 2px rgba(30,36,48,.3),inset 0 0 0 .5px rgba(30,36,48,.12)}
.kt-karo::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,255,255,.55),rgba(232,234,238,.48) 45%,rgba(206,210,216,.55));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 0 0 1px rgba(255,255,255,.25);opacity:0;transition:opacity .18s}
.kt-izgara-kap.basili .kt-karo::after,.kt-izgara-kap.gez .kt-karo::after{opacity:calc(.9 - var(--yakin) * .9)}
.kt-izgara-kap:not(.basili):not(.gez) .kt-karo{transform:none}
.kt-karo.oneri::before{content:"";position:absolute;right:4px;top:4px;width:6px;height:6px;border-radius:50%;background:#15171b;box-shadow:0 0 0 1.5px rgba(255,255,255,.8);z-index:1}
.kt-buyutec{position:absolute;left:0;top:0;z-index:5;width:56px;height:56px;margin:-28px 0 0 -28px;display:none;pointer-events:none}
.kt-izgara-kap.basili.dokunma .kt-buyutec{display:block}
.kt-buyutec i{display:block;width:56px;height:56px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px #fff,0 8px 20px rgba(30,36,48,.45)}
.kt-buyutec span{position:absolute;left:50%;top:-24px;transform:translateX(-50%);padding:2px 8px;border-radius:999px;background:rgba(12,13,15,.85);color:#f2f3f5;font-size:.6875rem;font-weight:700;white-space:nowrap}
.kt-karo.secili{box-shadow:0 0 0 2px #fff,0 0 0 4px #15171b}
.kt-karo:focus-visible{outline:2px solid #15171b;outline-offset:2px}
.kt-bilgi{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;min-height:40px}
.kt-bilgi i{width:34px;height:34px;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(30,36,48,.2)}
.kt-bilgi b{display:block;font-size:.9375rem}
.kt-bilgi em{font-style:normal;font-size:.75rem;color:var(--ink-3)}
.yuzey-levha .yan-yana{display:grid;grid-template-columns:1fr 1.4fr;gap:.5rem}
.yuzey-levha .yan-yana .tb{height:2.75rem}
@media (prefers-reduced-motion:reduce){.kt-karo,.kt-karo::after,.kt-leke{transition:none}}

/* ---------- Fiş (14 Ekim notun): fotoğraf görünürken yazıcı tepeden döker, ürünler satırlara iner ---------- */
#e-sonuc .s-levha,#e-sonuc .binici,#e-sonuc .surum-cip{transition:opacity .25s}
#e-sonuc.fis-acik .s-levha,#e-sonuc.fis-acik .binici,#e-sonuc.fis-acik .surum-cip,#e-sonuc.fis-acik .eski-uyari{opacity:0;pointer-events:none}
html[data-tema="sivi"] .birlesik .fis-kat{background:none}
.fis-perde{position:absolute;inset:0;z-index:0;pointer-events:none}
.fis-perde::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(236,238,242,.86),rgba(236,238,242,.35) 16%,rgba(236,238,242,0) 30%,rgba(236,238,242,0) 74%,rgba(236,238,242,.6))}
.fis-perde::after{content:"";position:absolute;inset:0;opacity:0;transition:opacity .55s ease;
  background:radial-gradient(100% 55% at 50% 0%,rgba(246,247,249,.94),rgba(222,225,230,.92) 74%);-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2)}
.fis-kat.perde .fis-perde::after{opacity:1}
.fis-kat>.fis-ust,.fis-kat>.fis-kuyu{position:relative;z-index:2}
.fis-kat>.yazici{animation:yazici-in .38s var(--ease-d) both}
@keyframes yazici-in{from{transform:translateY(-70px);opacity:0}}
.fis-kat:not(.perde) .fis-eylem{opacity:0;transform:translateY(16px);pointer-events:none}
.fis-eylem{transition:opacity .35s,transform .35s var(--ease)}
/* fiş: inişte adım adım; çekerken parmağı izler ve eğilir */
.fis{transform:translate(var(--kay,0px),var(--cik,0px)) rotate(var(--egim,0deg));transform-origin:50% 0;-webkit-user-select:none;user-select:none}
/* yırtılma, koçan ve kenarlar fis-yirtik.css'te (eski tekrar eden tırtık maskesi kalktı) */
.yazici{overflow:visible}
.fis-kocan{display:none}
/* gerilme: çekerken yazıcının ağzında beyaz bir gerilme çizgisi belirir */
.fis-kat.cekiliyor .yazici i{box-shadow:inset 0 1.5px 2px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.9),0 3px 10px rgba(205,229,242,.9)}
.cekme-ipucu{z-index:7}
/* satırın küçük resmi: önce boş yuva (taralı), ürün inince dolar */
html[data-tema="sivi"] .fis .satir{grid-template-columns:30px 1fr auto;gap:0 .625rem;align-items:start}
.fis .satir .ek{grid-column:2/-1}
.fis .f-res{grid-row:span 2;width:30px;height:30px;margin-top:2px;border-radius:6px;background:repeating-linear-gradient(45deg,rgba(31,29,26,.1) 0 2px,transparent 2px 5px);box-shadow:inset 0 0 0 1px rgba(31,29,26,.22);background-repeat:no-repeat}
.fis .satir.indi .f-res{box-shadow:0 0 0 1px rgba(31,29,26,.16),0 2px 4px -1px rgba(31,29,26,.25);animation:res-in .3s var(--yay) both}
.fis .f-res.urun-foto{background-color:#fff}
@keyframes res-in{from{transform:scale(1.35)}}
.fis-ucan{position:absolute;z-index:8;left:0;top:0;pointer-events:none;background-repeat:no-repeat;border-radius:12px;will-change:transform;box-shadow:0 0 0 2px rgba(255,255,255,.95),0 16px 30px -10px rgba(30,36,48,.5)}
.fis-ucan.urun-foto{background-color:#fff}
@media (prefers-reduced-motion:reduce){.fis-perde::after,.fis-eylem{transition:none}.fis-kat>.yazici,.fis .satir.indi .f-res{animation:none}}

/* Telefonda tam ekran, masaüstünde cihaz çerçevesi: atolye.css'te. Ekranlar düğmesi koyu sahnede koyu cam */
@media (max-width:759px){
  .cihaz:has(#e-kapi:not([hidden]),#e-bekleme:not([hidden])) .ekranlar-d{background:rgba(12,13,16,.55);color:#e9eaec;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
}