/* Çarşı Hanı arayüzü — Ionic (ios görünümü) üzerine sade, oyunsu tema. Renk dili: Lacivert & Altın (lacivert başlık ve marka yüzeyleri, altın vurgu ve para).
   Düz yüzeyler, tek vurgu rengi (amber), tek hafif gölge; gradyan ve kabartma yok. Renkli karolar oyun hissini taşır.
   Hareket: yalnızca transform/opacity (üretim halkası hariç); UI geçişleri ≤150 ms ease-out, hareket azaltmada kapalı. */

@font-face{font-family:"Fredoka";font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/fredoka-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fredoka";font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/fredoka-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- jetonlar ---------- */
:root{
  --ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1);
  --bg:#eef0f5;--card:#fff;--card2:#f4f6fa;--ink:#141b33;--mut:#596178;--line:#dde1ea;
  --acc:#e9b33e;--acc-ink:#141b33;--acc-t:#8a5f00;--acc-bg:#fbf1d8;
  --altin:#f2b632;--altin-t:#8a5f00;--altin-bg:#fbf1d8; /* para jetonu */
  --lacivert:#1d2a52;--lacivert2:#141d3d; /* başlık şeridi ve marka yüzeyleri */
  --ok:#147a44;--golge-yuksek:0 8px 28px rgba(0,0,0,.22);--okbg:#e2f4e9;--warn:#a5520a;--warnbg:#fdefd9;--bad:#c9372a;
  --golge:0 1px 2px rgba(20,27,51,.06),0 8px 20px -10px rgba(20,27,51,.22);
  --r:20px;--yazi:"Fredoka",ui-rounded,"SF Pro Rounded",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --sayi:ui-rounded,"SF Pro Rounded",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  /* karo renkleri: [zemin, simge] */
  --t1:#fbeccb;--t1i:#8a5f00;--t2:#dde4f7;--t2i:#22397a;--t3:#d5efec;--t3i:#0b6f73;--t4:#f8dcdc;--t4i:#a3283a;--t5:#e8def5;--t5i:#5b3a99;--t6:#e2ead5;--t6i:#4f6a24;
  /* Ionic */
  --ion-font-family:var(--yazi);--ion-background-color:var(--bg);--ion-text-color:var(--ink);
  --ion-color-primary:#e9b33e;--ion-color-primary-rgb:233,179,62;--ion-color-primary-contrast:#141b33;--ion-color-primary-contrast-rgb:20,27,51;--ion-color-primary-shade:#cd9e37;--ion-color-primary-tint:#ebbb51;
  --ion-toolbar-background:var(--bg);--ion-tab-bar-background:var(--card);--ion-card-background:var(--card);--ion-item-background:var(--card);
  --ion-border-color:var(--line);--ion-tab-bar-border-color:var(--line);--ion-toolbar-border-color:transparent;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#0b0f1e;--card:#131a30;--card2:#1a2340;--ink:#eef0f7;--mut:#a2aac2;--line:#262f50;
  --acc:#f2c25b;--acc-t:#f6d07f;--acc-bg:#382c10;
  --altin:#f2c25b;--altin-t:#f6d07f;--altin-bg:#382c10;
  --lacivert:#162043;--lacivert2:#0d1430;
  --ok:#5bd08e;--tamam-yazi:#06210f;--golge-yuksek:0 8px 28px rgba(0,0,0,.55);--okbg:#163326;--warn:#f0a35e;--warnbg:#3a2a14;--bad:#f2867f;
  --golge:0 1px 2px rgba(0,0,0,.45),0 8px 20px -10px rgba(0,0,0,.65);
  --t1:#382c10;--t1i:#f6d07f;--t2:#1a2a55;--t2i:#a3b9ff;--t3:#0f3436;--t3i:#7fe6e1;--t4:#3f1820;--t4i:#ff95a4;--t5:#2a2140;--t5i:#c9afff;--t6:#26301a;--t6i:#bcd68a;
  --ion-color-primary:#f2c25b;--ion-color-primary-rgb:242,194,91;--ion-color-primary-shade:#d5ab50;--ion-color-primary-tint:#f3c86b;
  --ion-color-step-50:#131a30;--ion-color-step-100:#1a2340;--ion-color-step-150:#262f50;
}}
:root[data-theme=dark]{
  --bg:#0b0f1e;--card:#131a30;--card2:#1a2340;--ink:#eef0f7;--mut:#a2aac2;--line:#262f50;
  --acc:#f2c25b;--acc-t:#f6d07f;--acc-bg:#382c10;
  --altin:#f2c25b;--altin-t:#f6d07f;--altin-bg:#382c10;
  --lacivert:#162043;--lacivert2:#0d1430;
  --ok:#5bd08e;--tamam-yazi:#06210f;--golge-yuksek:0 8px 28px rgba(0,0,0,.55);--okbg:#163326;--warn:#f0a35e;--warnbg:#3a2a14;--bad:#f2867f;
  --golge:0 1px 2px rgba(0,0,0,.45),0 8px 20px -10px rgba(0,0,0,.65);
  --t1:#382c10;--t1i:#f6d07f;--t2:#1a2a55;--t2i:#a3b9ff;--t3:#0f3436;--t3i:#7fe6e1;--t4:#3f1820;--t4i:#ff95a4;--t5:#2a2140;--t5i:#c9afff;--t6:#26301a;--t6i:#bcd68a;
  --ion-color-primary:#f2c25b;--ion-color-primary-rgb:242,194,91;--ion-color-primary-shade:#d5ab50;--ion-color-primary-tint:#f3c86b;
  --ion-color-step-50:#131a30;--ion-color-step-100:#1a2340;--ion-color-step-150:#262f50;
}

/* ---------- temel ---------- */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{color-scheme:light dark}:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--ink);font:1rem/1.45 var(--yazi);letter-spacing:.005em} /* rem: Ayarlar'daki yazı boyutu her yere ulaşır */
h1,h2,h3{line-height:1.2;text-wrap:balance;letter-spacing:.01em}
h1{font-size:1.6rem;margin:0;font-weight:700}
h2{font-size:1.05rem;margin:22px 0 10px;font-weight:700}
p,.hint{text-wrap:pretty} /* .mut hariç: Tezgâh'ta onlarca kısa satır, "pretty" düzen maliyeti */
.mut{color:var(--mut);font-size:.875rem}
b,.para,.sayi,.pz-fiyat,.pz-adet,.kv,.akis,.tahta,.kod-kutu{font-variant-numeric:tabular-nums}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
ion-button.ion-focused,ion-tab-button:focus-visible,ion-segment-button.ion-focused{outline:3px solid var(--acc);outline-offset:2px;border-radius:14px} /* Ionic klavye odağı */
::selection{background:color-mix(in srgb,var(--acc) 35%,transparent)}
main#sayfa{display:block;padding:12px 16px calc(24px + env(safe-area-inset-bottom));max-width:680px;margin:0 auto}
.yukleniyor{text-align:center;margin-top:40vh}
.row{display:flex;justify-content:space-between;gap:10px;align-items:center}
.two{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:center}
.kotu{color:var(--bad)}

/* ---------- formlar (yerel giriş alanları: değerleri koddan doğrudan okunur) ---------- */
input,select{font:inherit;min-height:46px;border-radius:14px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);padding:0 12px;width:100%;caret-color:var(--acc)}
input:focus,select:focus{border-color:var(--acc);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 28%,transparent)}
input[type=search]{-webkit-appearance:none;appearance:none}
input[type=checkbox]{width:20px;min-height:0;height:20px;accent-color:var(--acc)}
.etiketli{display:grid;gap:6px}.etiketli span{font-weight:600;font-size:.875rem}
.card .etiketli+.etiketli{margin-top:10px}.card .etiketli~ion-button{margin-top:14px}.card>b+.etiketli{margin-top:8px}
.hata{margin:0;min-height:1.2em;color:var(--bad);font-size:.875rem;font-weight:600}

/* ---------- düğmeler (ion-button) ---------- */
ion-button{--border-radius:14px;--box-shadow:none;--background:var(--acc);--background-activated:var(--acc);--background-hover:var(--acc);--color:var(--acc-ink);
  --padding-start:18px;--padding-end:18px;min-height:46px;height:auto;margin:0;font-weight:700;font-size:1rem;letter-spacing:.01em;text-transform:none;transition:transform 120ms var(--ease-out)}
ion-button::part(native){min-height:46px}
ion-button:active:not([disabled]){transform:scale(.97)}
ion-button.ghost{--background:transparent;--background-activated:var(--card2);--background-hover:var(--card2);--color:var(--ink);--border-width:1.5px;--border-style:solid;--border-color:var(--line)}
ion-button.buyuk{display:block;width:100%;min-height:52px;font-size:1.05rem;--border-radius:16px}
ion-button.buyuk::part(native){min-height:52px}
ion-button.kucuk{min-height:34px;font-size:.8rem;--padding-start:10px;--padding-end:10px;--border-radius:10px;position:relative}
ion-button.kucuk::part(native){min-height:34px}
ion-button.kucuk::after{content:"";position:absolute;inset:-5px -3px}
ion-button[disabled]{opacity:.45}
.two ion-button,.pz-cipler ion-button{display:block;width:100%}
/* rehberdeki ana düğme hafifçe "nefes alır": dikkat çeker ama sarsmaz */
.nabiz{animation:nabiz 2.4s var(--ease-in-out) infinite}
@keyframes nabiz{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
.baglanti{background:none;border:0;color:var(--mut);text-decoration:underline;text-underline-offset:3px;min-height:44px;font:600 .9rem var(--yazi);cursor:pointer}

/* ---------- kartlar ve küçük parçalar ---------- */
ion-card.card{display:block;margin:0 0 12px;padding:14px;border-radius:var(--r);border:1px solid var(--line);box-shadow:var(--golge);color:var(--ink);font-size:1rem;overflow:visible}
ion-card.card.row{display:flex}
ion-card.vitrin{border-color:var(--acc);box-shadow:0 0 0 1.5px var(--acc) inset,var(--golge)}
ion-card.kilitli{opacity:.6}
.tag{display:inline-block;font-size:.75rem;font-weight:600;padding:3px 9px;border-radius:99px;background:var(--card2);border:1px solid var(--line);white-space:nowrap;vertical-align:middle}
.tag.ok{background:var(--okbg);color:var(--ok);border-color:transparent}
.tag.warn{background:var(--warnbg);color:var(--warn);border-color:transparent}
.hint{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 14px;margin-bottom:8px;font-size:.9rem}
.duyuru{display:flex;gap:10px;align-items:baseline;background:var(--acc-bg);border-color:transparent}
.baslik{display:flex;align-items:center;gap:10px;margin:20px 0 10px;font-weight:700;font-size:1rem}
.baslik::after{content:"";flex:1;height:1px;background:var(--line)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;align-items:baseline;margin:6px 0}.kv b{text-align:right}
details{border-top:1px solid var(--line);margin-top:12px}
summary{cursor:pointer;list-style:none;padding:12px 0 2px;font-weight:600;font-size:.9rem;color:var(--mut);display:flex;justify-content:space-between;align-items:center;min-height:44px}
summary::-webkit-details-marker{display:none}
summary::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform 150ms var(--ease-out);margin-right:4px}
details[open] summary::after{transform:rotate(-135deg)}
details>.ic{padding:6px 0 2px;animation:ac 150ms var(--ease-out)}
@keyframes ac{from{opacity:0;transform:translateY(-4px)}}
i.yuk,i.dus,.yukk,.duss{font-style:normal;font-weight:700}
.yuk,.yukk{color:var(--ok)}.dus,.duss{color:var(--bad)}
.olaylar{background:var(--acc-bg);border-color:transparent}
.olaylar .row{padding:6px 0;align-items:flex-start}.olaylar .row+.row{border-top:1px solid var(--line)}
.uyari{color:var(--warn);font-size:.8125rem;font-weight:600}.uyari:empty{display:none}

/* ilerleme çubuğu */
ion-progress-bar.bar{height:8px;border-radius:99px;margin:10px 0 4px;--background:var(--card2);--progress-background:var(--acc)}
ion-progress-bar.bar.ince{height:6px}
ion-progress-bar.uretim{margin:-4px 0 6px;--progress-background:var(--ok)}
.yem{display:flex;align-items:center;gap:8px;margin:8px 0}.yem ion-progress-bar{flex:1;margin:0}

/* ---------- üst çubuk (HUD) ---------- */
ion-header{box-shadow:none}
ion-header::after{display:none}
ion-toolbar.hud{--background:var(--bg);--padding-start:12px;--padding-end:12px;--padding-top:6px;--padding-bottom:6px;--min-height:58px}
.top{display:flex;align-items:center;gap:8px}
.avatar-halka{position:relative;flex:none;width:44px;height:44px;border-radius:50%;padding:3px;display:grid;place-items:center;
  background:conic-gradient(var(--acc) calc(var(--xp) * 1%),var(--line) 0)}
.avatar{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;background:var(--card);color:var(--acc-t);font-weight:700;font-size:1.05rem}
.seviye-rozet{position:absolute;right:-4px;bottom:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:var(--ink);color:var(--bg);
  font:700 .72rem/20px var(--sayi);font-style:normal;text-align:center}
.para{flex:1;min-width:0;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 14px 0 6px;border-radius:14px;background:var(--card);border:1px solid var(--line);
  font:700 1.05rem var(--sayi);white-space:nowrap;overflow:hidden}
.para .coin{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--altin);color:#1b1403;flex:none}
.para .coin .simge{width:20px;height:20px;stroke-width:2.2}
@media (max-width:359px){.para .coin{display:none}.para{padding-left:12px;font-size:min(1.05rem,17px)}} /* çok dar ekranda para metnine yer aç */
.sag{display:flex;gap:6px;align-items:center}
.zil{position:relative;width:44px;height:44px;padding:0;display:grid;place-items:center;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;transition:transform 120ms var(--ease-out)}
.zil:active{transform:scale(.94)}
.zil .simge{width:22px;height:22px}
.zil.depo{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px}
.zil.depo .simge{width:17px;height:17px}.zil.depo small{font:700 .7rem/1 var(--sayi)}
.zil em,.kare em{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--bad);color:#fff;font:700 .7rem/18px var(--sayi);font-style:normal;text-align:center}
ion-toolbar.baslik-bar{--background:var(--bg);--min-height:48px;--padding-start:8px}
ion-toolbar.baslik-bar.gizli{display:none}
ion-toolbar.baslik-bar ion-title{font-size:1.15rem;font-weight:700;text-align:left;padding-inline:8px}
ion-toolbar.baslik-bar ion-title.title-default{position:static;padding-inline:8px}
.geri-dugme{--background:var(--card);--color:var(--ink);--border-radius:99px;--padding-start:12px;--padding-end:14px;font-size:.95rem;border:1px solid var(--line);border-radius:99px;min-height:44px}
.geri-dugme::part(native){min-height:44px;border-radius:99px}

/* ---------- sekme çubuğu ---------- */
ion-tab-bar{--background:var(--card);--border:1px solid var(--line);--color:var(--mut);--color-selected:var(--acc-t);height:62px;padding-bottom:env(safe-area-inset-bottom)}
ion-tab-button{--color:var(--mut);--color-selected:var(--acc-t);font-weight:600}
ion-tab-button ion-label{font-size:.75rem;margin-top:3px}
ion-tab-button .simge{width:24px;height:24px}
ion-tab-button.tab-selected .simge{stroke-width:2.2}

/* ---------- ana ekran ---------- */
.karsilama{padding:6px 2px 12px}.karsilama h1{overflow-wrap:anywhere}
.rehber{background:var(--acc-bg);border-radius:var(--r);padding:16px;margin-bottom:14px}
.rehber .adim{font-size:.75rem;font-weight:700;letter-spacing:.08em;color:var(--acc-t)}
.rehber p{margin:4px 0 12px;font-size:1.05rem;font-weight:600}
.rehber .alt{font-weight:400;font-size:.9rem;color:var(--mut)}
.rehber .atla{margin-top:6px;display:flex;justify-content:center}
.izgara{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 6px;margin-top:6px}
.izgara.az{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ikon{min-width:0;display:flex;flex-direction:column;align-items:center;gap:7px;background:none;border:0;color:var(--ink);padding:0;font:600 .8rem var(--yazi);text-align:center;cursor:pointer}
.kare{position:relative;width:60px;height:60px;border-radius:20px;display:grid;place-items:center;background:var(--t1);color:var(--t1i);transition:transform 120ms var(--ease-out)}
.ikon:active .kare{transform:scale(.93)}
.ikon:nth-child(6n+2) .kare{background:var(--t2);color:var(--t2i)}.ikon:nth-child(6n+3) .kare{background:var(--t3);color:var(--t3i)}
.ikon:nth-child(6n+4) .kare{background:var(--t4);color:var(--t4i)}.ikon:nth-child(6n+5) .kare{background:var(--t5);color:var(--t5i)}.ikon:nth-child(6n) .kare{background:var(--t6);color:var(--t6i)}
.kare .simge{display:block}
.izgara.az .ikon{flex-direction:row;gap:12px;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--golge);justify-content:flex-start;font-size:1rem;text-align:left}
.izgara.az .kare{width:52px;height:52px;border-radius:16px}
.ikon.sonraki{opacity:.5}.ikon.sonraki .kare{background:var(--card2);color:var(--mut)}
.olay{display:grid;gap:2px;width:100%;text-align:left;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:12px 14px;margin-bottom:8px;font:inherit;cursor:pointer}

/* ürün simgesi, tarif şeridi, depo şeridi */
.urun-ikon{flex:none;display:inline-grid;place-items:center;border-radius:28%;background:linear-gradient(150deg,var(--a),var(--b))}
.urun-ikon svg{display:block}
.tarif{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0 8px}
.tarif .mal{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border-radius:99px;background:var(--card2);border:1px solid var(--line)}
.tarif .mal b{font-size:.8rem}
.tarif .mal.eksik{border-color:var(--bad)}.tarif .mal.eksik b{color:var(--bad)}
.tarif .mal.cikti{background:var(--acc-bg);border-color:transparent}
.tarif .ok{color:var(--mut);font-weight:700}
.depo-serit{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 10px;scroll-snap-type:x proximity;scrollbar-width:none}
.depo-oge{position:relative;flex:none;padding:0;background:none;border:0;scroll-snap-align:start;cursor:pointer}
.depo-oge em{position:absolute;right:-6px;bottom:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:var(--ink);color:var(--bg);font:700 .75rem/22px var(--sayi);font-style:normal;text-align:center;border:2px solid var(--bg)}

/* ---------- segment (Tezgâh, pazar kipi, giriş türü) ---------- */
ion-segment.seg{margin-bottom:12px;--background:var(--card2);border:1px solid var(--line)}
ion-segment-button{--indicator-color:var(--acc);--color:var(--ink);--color-checked:var(--acc-ink);font-weight:600;min-height:44px;text-transform:none;letter-spacing:0}
ion-segment-button{--padding-start:4px;--padding-end:4px}
ion-segment-button ion-label{font-size:.82rem;overflow:visible}

/* ---------- Tezgâh / pazar ---------- */
.tahta{display:flex;gap:22px;overflow-x:auto;white-space:nowrap;margin:0 -16px 12px;padding:8px 16px;background:var(--card);border-block:1px solid var(--line);font-size:.85rem;scrollbar-width:none}
.akis{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:6px 14px;font-size:.85rem}
.akis div{padding:5px 0;border-bottom:1px dashed var(--line)}.akis div:last-child{border:0}
.pz-izgara{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pz-kucuk{grid-template-columns:repeat(4,1fr)}
.pz-karo{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 6px 10px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:18px;font:600 1rem var(--yazi);text-align:center;cursor:pointer;transition:transform 120ms var(--ease-out)}
.pz-karo:active{transform:scale(.96)}
.pz-kucuk .pz-karo{padding:10px 4px 8px}
.pz-karo.var{border-color:color-mix(in srgb,var(--acc) 55%,var(--line))}
.pz-karo b{font-size:.84rem;line-height:1.2}
.pz-fiyat{font-size:.8rem;color:var(--mut)}
.pz-adet{position:absolute;top:6px;right:6px;min-width:22px;height:22px;padding:0 6px;border-radius:99px;background:var(--acc);color:var(--acc-ink);font:700 .75rem/22px var(--sayi);font-style:normal;text-align:center}
.cizgi{flex:none;margin:0 10px}.cizgi.yuk{color:var(--ok)}.cizgi.dus{color:var(--bad)}
.pz-karo .cizgi{margin:0;width:44px;height:14px}
ion-modal.pz-modal{--height:auto;--max-height:92vh;--border-radius:24px 24px 0 0;--background:var(--card)}
.pz-sheet{display:grid;gap:12px;padding:20px 16px calc(16px + env(safe-area-inset-bottom));max-height:88vh;overflow:auto}
.pz-sheet ion-segment.seg{margin:0}
.pz-baslik{display:flex;align-items:center;gap:12px}.pz-baslik>div{flex:1;min-width:0}
.pz-baslik .kapat{min-width:44px;min-height:44px}.pz-baslik .kapat::part(native){min-height:44px}
.pz-satir{display:grid;gap:6px}.pz-satir label{font-weight:600;font-size:.875rem}
.pz-adetler{display:grid;grid-template-columns:52px 1fr 52px;gap:8px}.pz-adetler input{text-align:center;font:700 1.2rem var(--sayi)}
.pz-adetler ion-button{--padding-start:0;--padding-end:0;font-size:1.3rem}
.pz-cipler{display:flex;gap:8px}.pz-cipler ion-button{flex:1}

/* ---------- sahiden.com (araç + emlak): benzersiz varlık kartı, sıralama çipleri, onay özeti. Tasarım: design/ux/arac-emlak-pazari.md ---------- */
.vl-liste{display:grid;gap:10px;margin-top:6px}
.vl-kart{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:12px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:18px;
  font:inherit;text-align:left;cursor:pointer;transition:transform 120ms var(--ease-out)}
.vl-kart:active{transform:scale(.98)}
.vl-metin{display:grid;gap:2px;min-width:0}.vl-metin b{overflow-wrap:anywhere;font-size:1rem}.vl-metin .mut{font-size:.8125rem}
.vl-fiyat{display:grid;gap:2px;justify-items:end;text-align:right}.vl-fiyat b{font-size:1.05rem;white-space:nowrap}.vl-fiyat i{font-size:.75rem}
.vl-simge{display:grid;place-items:center;width:52px;height:52px;flex:none;color:var(--acc-t)}
.vl-cipler{display:flex;gap:8px;overflow-x:auto;margin:2px 0 4px;padding-bottom:2px}
.vl-cipler ion-button{flex:none;white-space:nowrap}
.vl-cipler ion-button.on{--background:var(--acc);--color:var(--acc-ink);--border-color:var(--acc)}
.vl-bos{display:grid;gap:8px;text-align:center;justify-items:center}
.vl-not{margin-top:12px}
.vl-onay{display:grid;gap:4px;padding:12px;border-radius:14px;background:var(--card2);border:1px solid var(--line)}
@media (min-width:900px){.vl-liste{grid-template-columns:repeat(2,1fr)}}
@media (hover:hover) and (pointer:fine){.vl-kart:hover{border-color:var(--acc)}}

/* ---------- liderlik ---------- */
.kursu-satir{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:8px;align-items:end;margin:12px 0}
.kursu{display:grid;justify-items:center;gap:2px;text-align:center;padding:10px 6px;border-radius:16px;background:var(--card);border:1px solid var(--line);min-width:0}
.kursu b{overflow-wrap:anywhere;font-size:.875rem}.kursu .skor{color:var(--acc-t)}
.kursu .madalya{font-size:1.6rem}
.kursu.k1{padding-block:18px;background:var(--acc-bg);border-color:transparent}
.kursu.k2{padding-block:14px}.kursu.ben{outline:2px solid var(--acc)}
.kursu.bos{visibility:hidden}

/* ---------- sohbet ---------- */
.sohbet{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:8px 14px;max-height:58vh;overflow:auto}
.sohbet div{padding:7px 0;border-bottom:1px dashed var(--line);word-break:break-word}.sohbet div:last-child{border:0}

/* ---------- depo kavanozu ---------- */
.kavanoz{position:relative;width:84px;height:104px;border-radius:14px 14px 22px 22px;border:3px solid var(--line);overflow:hidden;background:var(--card2);flex:none}
.kavanoz .su{position:absolute;inset:0;background:var(--acc);transform:scaleY(var(--p,0));transform-origin:bottom;transition:transform 300ms var(--ease-out)}
.kavanoz b{position:absolute;inset:0;display:grid;place-items:center;font-size:1.15rem;color:var(--ink)}

/* ---------- ayarlar ---------- */
.ay-not{margin:6px 0 10px;font-size:.8125rem}
.ayirac{border:0;border-top:1px solid var(--line);margin:12px 0}
ion-toggle.anahtar-satir{width:100%;min-height:48px;--track-background-checked:var(--acc);font-size:1rem}
ion-toggle.anahtar-satir::part(label){white-space:normal;margin-inline-end:12px}
ion-segment.yazi-sec{margin:10px 0 0}
.kaydirici{display:grid;gap:0;margin-top:6px}.kaydirici span{display:flex;justify-content:space-between;font-size:.875rem;font-weight:600}
.kaydirici ion-range{--bar-background-active:var(--acc);--knob-size:24px;padding:0}

/* ---------- giriş ---------- */
ion-content.giris-zemin{--background:var(--bg)}
#login{display:grid;gap:12px;align-content:start;padding:48px 20px calc(24px + env(safe-area-inset-bottom));max-width:400px;margin:0 auto}
#login h1{text-align:center;font-size:2rem}
.giris-hero{display:flex;justify-content:center;gap:10px;margin:4px 0 6px}
.giris-hero span{display:inline-block;transform:translateY(calc(var(--i) * 3px - 6px)) rotate(calc((var(--i) - 2) * 5deg));animation:giris-gel 420ms var(--ease-out) both;animation-delay:calc(var(--i) * 50ms)}
@keyframes giris-gel{from{opacity:0;transform:translateY(14px) scale(.9)}}
.giris-slogan{text-align:center;margin:0 0 8px}.giris-baslik{margin:4px 0 0;font-size:1.15rem}
#g-form{display:grid;gap:12px;margin-top:4px}
.goster{display:flex;align-items:center;gap:8px;font-size:.875rem;min-height:40px}
.giris-not{margin:0;font-size:.8125rem}
.kod-kutu{font:700 1.5rem/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.08em;text-align:center;padding:18px 10px;border-radius:16px;background:var(--acc-bg);border:1px dashed var(--acc);user-select:all}

/* ---------- bildirim, efektler, katmanlar ---------- */
ion-toast.bildirim{--background:var(--ink);--color:var(--bg);--border-radius:16px;--button-color:var(--acc);font-weight:600}
#efekt{position:fixed;inset:0;pointer-events:none;z-index:50;overflow:hidden}
.ucan{position:absolute;font:700 1.1rem var(--sayi);text-shadow:0 1px 0 #fff,0 0 6px rgba(255,255,255,.8);color:var(--acc-t);white-space:nowrap;transform:translate(-50%,-50%);animation:ucus 1000ms var(--ease-out) forwards}
.ucan.kotu2{color:var(--bad)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ucan{color:#ffd27a;text-shadow:0 2px 6px rgba(0,0,0,.35)}:root:not([data-theme=light]) .ucan.kotu2{color:#ffb4a8}}
:root[data-theme=dark] .ucan{color:#ffd27a;text-shadow:0 2px 6px rgba(0,0,0,.35)}:root[data-theme=dark] .ucan.kotu2{color:#ffb4a8}
.uretimde .ucan{color:#ffd27a;text-shadow:0 2px 6px rgba(0,0,0,.35)}.uretimde .ucan.kotu2{color:#ffb4a8} /* üretim kaplaması hep koyu */
@keyframes ucus{0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}15%{opacity:1}100%{opacity:0;transform:translate(-50%,-190%) scale(1.05)}}
.parca{position:absolute;font-size:1.3rem;will-change:transform,opacity}
#reklam,#seviye,#yonetim-mesaj{position:fixed;inset:0;background:rgba(8,12,24,.6);display:grid;place-items:center;z-index:60;animation:sol 160ms var(--ease-out)}
@keyframes sol{from{opacity:0}}
.rk,.sv{background:var(--card);color:var(--ink);padding:22px;border-radius:24px;width:min(90vw,340px);text-align:center;box-shadow:var(--golge);animation:pop 220ms var(--ease-out)}
@keyframes pop{from{opacity:0;transform:scale(.94) translateY(8px)}}
.sv .buyuk-sayi{font:700 3.4rem/1 var(--sayi);color:var(--acc-t)}
.sv ul{list-style:none;margin:10px 0 14px;padding:0;text-align:left}.sv li{padding:6px 0;border-bottom:1px dashed var(--line)}

/* ---------- üretim sahneleri (izometrik 3B dioramalar) ----------
   Gökyüzü + bulut + kuş katmanı, gölgeli zemin levhası, işletmeye özgü hareketli parçalar.
   Hareket yalnızca .calisiyor iken (hazır durumunda parıltı); ekran dışındayken .gorunmez ile durur. Filtre yok: gölge ve ışık SVG'de çizili. */
.sahne{position:relative;height:178px;border-radius:16px;overflow:hidden;margin:10px 0 12px;isolation:isolate;contain:paint;
  background:linear-gradient(180deg,var(--gok1) 0%,var(--gok2) 72%,var(--gok3) 100%)}
.sahne{--gok1:#bfe0ff;--gok2:#e8f4ff;--gok3:#f3f0e2}
/* Gökyüzü yerel saate göre (efekt.js gunDilimi → html[data-gun]); açık temada sabah/akşam/gece, koyu temada akşam ışığı ayrıca */
:root[data-gun=sabah] .sahne{--gok1:#ffd7b5;--gok2:#fdeedc;--gok3:#f5efde}
:root[data-gun=aksam] .sahne{--gok1:#f0a574;--gok2:#f7d3a6;--gok3:#f3e2c2}
:root[data-gun=gece] .sahne{--gok1:#1a2748;--gok2:#2e4170;--gok3:#3b4a6e}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .sahne{--gok1:#1a2748;--gok2:#2e4170;--gok3:#3b4a6e}:root:not([data-theme=light])[data-gun=aksam] .sahne{--gok1:#3a2f5a;--gok2:#7a4f62;--gok3:#a0605a}}
:root[data-theme=dark] .sahne{--gok1:#1a2748;--gok2:#2e4170;--gok3:#3b4a6e}
:root[data-theme=dark][data-gun=aksam] .sahne{--gok1:#3a2f5a;--gok2:#7a4f62;--gok3:#a0605a}
.sahne.izo-sahne{content-visibility:auto;contain-intrinsic-size:auto 178px}
/* Tezgâh Çarşı ilanları: 390x844'te ilk 3 kart görünür; 6. karttan sonrası ekran dışında, çizimi ertelenir (kart ≈156 px). */
#ilanListe>ion-card:nth-of-type(n+6){content-visibility:auto;contain-intrinsic-size:auto 156px}
.sahne.gorunmez *{animation-play-state:paused!important}
.izo{position:absolute;inset:8px 0 0;width:100%;height:calc(100% - 8px);z-index:1;overflow:visible}
.sahne.bos .izo{opacity:.82}
.sahne.calisiyor .diorama,.sahne.hazir .diorama{animation:yuz 6s var(--ease-in-out) infinite}
@keyframes yuz{50%{transform:translateY(-2px)}}

/* gökyüzü */
.gok{position:absolute;inset:0;z-index:0;pointer-events:none}
.bulut{position:absolute;display:block;width:64px;height:18px;border-radius:99px;background:#fff;opacity:.85;
  animation:bulut 38s linear infinite}
.bulut::before,.bulut::after{content:"";position:absolute;border-radius:50%;background:inherit}
.bulut::before{width:28px;height:28px;left:10px;top:-13px}.bulut::after{width:22px;height:22px;left:32px;top:-9px}
.bulut.b1{top:26px;left:0}.bulut.b2{top:56px;left:0;transform:scale(.7);opacity:.6;animation-duration:52s;animation-delay:-30s}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .bulut{background:#8fa3cc;opacity:.35}:root:not([data-theme=light]) .bulut.b2{opacity:.25}}
:root[data-theme=dark] .bulut{background:#8fa3cc;opacity:.35}:root[data-theme=dark] .bulut.b2{opacity:.25}
@keyframes bulut{from{transform:translateX(-90px)}to{transform:translateX(min(720px,110vw))}}
.kuslar{position:absolute;top:18px;left:0;width:34px;height:12px;color:#3a4458;opacity:0;animation:kus 24s linear infinite;animation-delay:-6s}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .kuslar{color:#c6d2ee}}
:root[data-theme=dark] .kuslar{color:#c6d2ee}
@keyframes kus{0%{opacity:0;transform:translate(-40px,20px)}6%{opacity:.7}40%{opacity:.7;transform:translate(min(520px,100vw),-6px)}41%,100%{opacity:0;transform:translate(min(520px,100vw),-6px)}}

/* durum rozeti ve halka */
.durum-rozet{position:absolute;left:10px;top:10px;z-index:3}
.halka-kutu{position:absolute;right:10px;top:10px;z-index:3;width:56px;height:56px;display:grid;place-items:center}
.halka{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.halka .iz{fill:color-mix(in srgb,var(--card) 88%,transparent);stroke:color-mix(in srgb,var(--ink) 12%,transparent);stroke-width:6}
.halka .ilr{fill:none;stroke:var(--ok);stroke-width:6;stroke-linecap:round;stroke-dasharray:163.4;stroke-dashoffset:calc(163.4 * (1 - var(--p,0)));transition:stroke-dashoffset 1s linear}
.sahne.hazir .halka .ilr{stroke:var(--acc);stroke-dashoffset:0}
.hk-yazi{position:relative;font:700 .66rem/1.1 var(--sayi);color:var(--ink);text-align:center;max-width:46px}
.sahne.hazir .hk-yazi{font-size:1.1rem;color:var(--acc-t)}
.fazla{position:absolute;left:12px;bottom:8px;z-index:3;background:color-mix(in srgb,var(--card) 85%,transparent);padding:1px 8px;border-radius:99px;font-weight:700}

/* hazır / stoklu: yığının üstünde parıltı */
.parilti{position:absolute;inset:0;z-index:2;pointer-events:none}
.parilti i{position:absolute;font-style:normal;color:#ffc94a;font-size:14px;opacity:0;animation:parilti 2.2s ease-in-out infinite}
.parilti i:nth-child(1){left:72%;top:46%}.parilti i:nth-child(2){left:80%;top:34%;animation-delay:.7s;font-size:10px}.parilti i:nth-child(3){left:66%;top:30%;animation-delay:1.4s;font-size:12px}
@keyframes parilti{0%,100%{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:1;transform:scale(1.1) rotate(45deg)}}

/* zemin, pencere ışığı */
.izo .pnc{fill:#a8cdee}
.sahne.calisiyor .pnc.isikli{fill:#ffd36b;animation:pencere 3.4s ease-in-out infinite alternate}
@keyframes pencere{from{opacity:.75}to{opacity:1}}

/* hareketli parçalar */
.izo .aspa,.izo .disli,.izo .kol,.izo .agac,.izo .alev,.izo .duman-izo circle{transform-box:fill-box;transform-origin:center}
.sahne.calisiyor .aspa{animation:doner 4.5s linear infinite}
.sahne.calisiyor .disli{animation:doner 5s linear infinite}
@keyframes doner{to{transform:rotate(360deg)}}
.duman-izo circle{fill:#fff;opacity:0}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .duman-izo circle{fill:#c9d3e6}}
:root[data-theme=dark] .duman-izo circle{fill:#c9d3e6}
.sahne.calisiyor .duman-izo circle{animation:dumanI 3s var(--ease-out) infinite}
.duman-izo circle:nth-child(2){animation-delay:1s}.duman-izo circle:nth-child(3){animation-delay:2s}
@keyframes dumanI{0%{opacity:.95;transform:translate(0,0) scale(.45)}60%{opacity:.55}100%{opacity:0;transform:translate(10px,-38px) scale(1.9)}}
.sahne.calisiyor .alev{animation:alevI .4s ease-in-out infinite alternate;transform-origin:50% 100%}
@keyframes alevI{from{transform:scale(.85,.78);opacity:.85}to{transform:scale(1.1,1.22);opacity:1}}
.sahne.calisiyor .kol{animation:kolI 2s var(--ease-in-out) infinite alternate}
@keyframes kolI{from{transform:rotate(-12deg)}to{transform:rotate(12deg)}}
.sahne.calisiyor .vagon{animation:vagonI 4.5s var(--ease-in-out) infinite alternate}
@keyframes vagonI{from{transform:translate(-40px,-23px)}to{transform:translate(26px,15px)}}
.sahne.calisiyor .arac{animation:aracI 5s linear infinite}
@keyframes aracI{0%{opacity:0;transform:translate(0,0)}12%{opacity:1}88%{opacity:1}100%{opacity:0;transform:translate(70px,40px)}}
.sahne.calisiyor .agac{animation:agacI 3.2s var(--ease-in-out) infinite alternate;transform-origin:50% 100%}
@keyframes agacI{from{transform:rotate(-1.8deg)}to{transform:rotate(1.8deg)}}
.sahne.calisiyor .kanca{animation:kancaI 2.6s var(--ease-in-out) infinite alternate}
@keyframes kancaI{to{transform:translateY(12px)}}
.sahne.calisiyor .bant>g{animation:bantI 3.6s linear infinite;animation-delay:calc(var(--i) * -1.2s)}
@keyframes bantI{0%{opacity:0;transform:translate(0,0)}10%,90%{opacity:1}100%{opacity:0;transform:translate(52px,30px)}}

/* işçiler: adım atarken iner-kalkar, yol boyunca gidip gelir */
.sahne.calisiyor .isci{animation:isciI .5s ease-in-out infinite alternate}
@keyframes isciI{from{transform:translateY(0)}to{transform:translateY(-2.5px)}}
.sahne.calisiyor .yol-x{animation:yolX 7s var(--ease-in-out) infinite alternate}
@keyframes yolX{to{transform:translate(46px,27px)}}
.sahne.calisiyor .yol-y{animation:yolY 6s var(--ease-in-out) infinite alternate}
@keyframes yolY{to{transform:translate(-36px,21px)}}

/* hayvanlar: otlar (öne-arkaya kısa yürüyüş, durup eğilme), arada sevinçle zıplar; aç kalınca titrer ve solar */
.sahne.calisiyor .hayvan{animation:otla 5.2s var(--ease-in-out) infinite;animation-delay:calc(var(--i) * -0.83s)}
@keyframes otla{0%,100%{transform:translate(0,0)}18%{transform:translate(7px,4px)}24%{transform:translate(7px,1px)}30%,52%{transform:translate(7px,4px)}
  70%{transform:translate(-3px,-1.7px)}76%{transform:translate(-3px,-5px)}82%{transform:translate(-3px,-1.7px)}}
.arilar circle{fill:#2b2118}
.sahne.calisiyor .arilar{animation:arilar 1.2s ease-in-out infinite alternate;animation-delay:calc(var(--i) * 120ms)}
@keyframes arilar{from{transform:translate(-3px,1px)}to{transform:translate(3px,-4px)}}
.sahne.ac .hayvan{animation:titreI .45s linear infinite;opacity:.7}
@keyframes titreI{0%,100%{transform:translateX(-1px)}50%{transform:translateX(1px)}}

/* ---------- geniş ekran ---------- */
@media (min-width:900px){
  main#sayfa{max-width:1000px;display:grid;grid-template-columns:repeat(auto-fill,minmax(440px,1fr));gap:0 16px;align-content:start}
  main#sayfa>*{grid-column:1/-1}main#sayfa>[data-kart]{grid-column:auto}
  .pz-izgara{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.pz-kucuk{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
  ion-modal.pz-modal{--width:440px;--border-radius:24px}
}

/* ---------- hareket azaltma ---------- */
@media (prefers-reduced-motion:reduce){
  .nabiz,.giris-hero span,details>.ic,.izo,.izo *,.gok *,.parilti i,#reklam,#seviye,#yonetim-mesaj,.rk,.sv{animation:none!important}
  .parilti i{opacity:1}
  .ucan{animation:ucus-az 1200ms linear forwards}
  @keyframes ucus-az{0%,80%{opacity:1}100%{opacity:0}}
  *{transition-duration:.01ms!important}
  .kavanoz .su,.halka .ilr{transition-duration:.3s!important}
}

/* Öğretici koçu: alt menünün üstünde sabit adım kutusu ve hedef halkası (ogretici.js) */
.koc{position:fixed;left:0;right:0;bottom:calc(62px + env(safe-area-inset-bottom) + 8px);z-index:40;display:flex;justify-content:center;padding:0 12px;pointer-events:none}
.koc:empty{display:none}
.koc-kart{pointer-events:auto;width:100%;max-width:520px;background:var(--card);border:1.5px solid var(--acc);border-radius:var(--r);padding:12px 14px;box-shadow:var(--golge-yuksek);animation:koc-gir 220ms var(--ease-out)}
.koc-kart b{font-size:1.02rem}
.koc-kart p{margin:2px 0 6px;font-size:.95rem}
.koc-kart details{margin:0 0 6px}
.koc-kart summary{cursor:pointer;color:var(--acc-t);font-size:.85rem;font-weight:600;width:max-content}
.koc-kart details p{margin:4px 0 0;font-size:.85rem}
.koc-ust{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.koc-nokta{display:flex;gap:5px}
.koc-nokta i{width:18px;height:6px;border-radius:3px;background:color-mix(in srgb,var(--ink) 20%,transparent)}
.koc-nokta i.tam{background:var(--acc)}
.koc-nokta i.su{background:var(--acc-t);width:28px} /* şu anki adım yalnız renkle değil, boyla da ayrılır */
.koc-bekle{background:var(--acc-bg);border-radius:10px;padding:6px 10px;font-size:.9rem;margin-bottom:6px}
.koc-btn{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.koc-ipucu{font-size:.85rem;color:var(--acc-t);font-weight:600}
.rehber-hedef{border-radius:12px;position:relative;z-index:1;box-shadow:0 0 0 2px var(--acc-t)}
.rehber-hedef::after{content:"";position:absolute;inset:-2px;border-radius:14px;border:2px solid var(--acc);pointer-events:none;animation:koc-nabiz 1.4s ease-out infinite} /* nabız: yalnız transform ve opacity (box-shadow her karede boyatıyordu) */
@keyframes koc-nabiz{from{transform:scale(1);opacity:.85}to{transform:scale(1.12);opacity:0}}
@keyframes koc-gir{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes koc-halka{0%,100%{box-shadow:0 0 0 2px var(--acc-t),0 0 0 2px color-mix(in srgb,var(--acc) 75%,transparent)}50%{box-shadow:0 0 0 2px var(--acc-t),0 0 0 10px color-mix(in srgb,var(--acc) 0%,transparent)}}
@media (prefers-reduced-motion:reduce){.koc-kart{animation:none}.rehber-hedef{box-shadow:0 0 0 2px var(--acc-t),0 0 0 5px var(--acc)}.rehber-hedef::after{animation:none;opacity:0}}

/* Üretim bakımı çipleri (bakim.js) */
.bakim-serit{margin:10px 0 8px}
.bakim-satir{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:6px}
.bakim{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:12px;border:2px solid var(--line);background:var(--card2);color:var(--ink);font:inherit;min-height:64px}
.bakim .bk-ikon{font-size:1.3rem}
.bakim small{font-size:.74rem;color:var(--mut)}
.bakim.acik{border-color:var(--acc);background:var(--acc-bg);animation:koc-halka 1.4s ease-in-out infinite;cursor:pointer}
.bakim.acik small{color:var(--acc-t);font-weight:700}
.bakim.yapildi{border-color:#3fa66a;opacity:.85}
.bakim.kacirdi{opacity:.5;text-decoration:line-through}
@media (prefers-reduced-motion:reduce){.bakim.acik{animation:none;box-shadow:0 0 0 3px var(--acc)}}

/* Sanayi sekme rozeti */
.rozet-k{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:var(--acc);color:var(--acc-ink);font-size:.72rem;font-weight:700;text-align:center}

/* Ana ekran: kart karolar, parlak emoji simgeler, sıralama düğmesi, sohbet şeridi (referans: ikon kafesi) */
.izgara{gap:10px 8px}
.izgara:not(.az) .ikon{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:10px 2px 8px;box-shadow:var(--golge);gap:4px;font-size:.74rem;line-height:1.15}
.izgara:not(.az) .kare{width:52px;height:46px;border-radius:14px;background:transparent!important}
.kare .emo{font-size:2rem;line-height:1;filter:drop-shadow(0 2px 2px rgba(0,0,0,.22))}
.ikon.sonraki .emo{filter:grayscale(1) opacity(.6)}
.ikon-diz-satir{display:flex;justify-content:flex-end;margin-top:4px}
.ikon-diz{background:var(--card);border:1px solid var(--line);border-radius:99px;color:var(--ink);font:600 .8rem var(--yazi);padding:6px 12px;cursor:pointer;box-shadow:var(--golge)}
.sohbet-serit{position:sticky;bottom:8px;display:flex;align-items:center;gap:12px;width:100%;margin-top:14px;padding:10px 12px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--golge);color:var(--ink);font:inherit;text-align:left;cursor:pointer;z-index:2}
.sohbet-serit .avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--acc-bg);font-size:1.3rem;flex:none}
.sohbet-serit .metin{display:flex;flex-direction:column;min-width:0;flex:1}
.sohbet-serit .metin .mut{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.85rem}
.sohbet-serit .ok-yuk{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--acc);display:grid;place-items:center;color:var(--acc-t);font-weight:700;flex:none}

/* Mevsim kartı (ana ekran) ve mevsim renkleri: html[data-mevsim] */
.mevsim-kart{--mv:var(--acc-bg);margin:10px 0 4px;padding:12px 14px;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(135deg,var(--mv),var(--card) 70%);box-shadow:var(--golge)}
html[data-mevsim=ilkbahar]{--mv:#e7f6dc}html[data-mevsim=yaz]{--mv:#fff1c4}html[data-mevsim=sonbahar]{--mv:#fde0c4}html[data-mevsim=kis]{--mv:#dbe9fb}
:root[data-theme=dark][data-mevsim=ilkbahar],:root[data-theme=dark][data-mevsim=yaz],:root[data-theme=dark][data-mevsim=sonbahar],:root[data-theme=dark][data-mevsim=kis]{--mv:#25304a}
@media (prefers-color-scheme:dark){:root:not([data-theme=light])[data-mevsim]{--mv:#25304a}}
.mevsim-kart{background:linear-gradient(135deg,var(--mv),var(--card) 70%)}
.mevsim-seri{height:46px;margin:-12px -14px 8px;border-radius:var(--r) var(--r) 0 0;overflow:hidden;opacity:.95}.mevsim-seri svg{display:block}
@media (prefers-reduced-motion:no-preference){.mevsim-seri .mv-parca{animation:mv-dus 5s var(--ease-in-out) infinite alternate}}
@keyframes mv-dus{0%{transform:translateY(-6px)}100%{transform:translateY(6px)}}
.mevsim-baslik{display:flex;align-items:center;gap:8px;font-size:1.05rem}
.mevsim-ikon{font-size:1.5rem;display:inline-block;filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}
@media (prefers-reduced-motion:no-preference){html[data-mevsim=kis] .mevsim-ikon{animation:mv-don 3s ease-in-out infinite}html[data-mevsim=sonbahar] .mevsim-ikon{animation:mv-yaprak 3.4s ease-in-out infinite}html[data-mevsim=yaz] .mevsim-ikon{animation:mv-don 5s linear infinite}}
@keyframes mv-don{0%,100%{transform:rotate(-6deg) scale(1)}50%{transform:rotate(8deg) scale(1.08)}}
@keyframes mv-yaprak{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(3px) rotate(10deg)}}

/* Türkiye haritası ve şehir kapısı (harita.js) */
:root{--r0:#f4b9a4;--r1:#f0d27a;--r2:#8fd3a8;--r3:#c9b4e8;--r4:#7fc2de;--r5:#e8a8c6;--r6:#b8c88a;--il-cizgi:#fff}
:root[data-theme=dark]{--r0:#8c4a38;--r1:#8a742b;--r2:#2f7a4f;--r3:#6a4f93;--r4:#2f6f8a;--r5:#8a3f62;--r6:#68783a;--il-cizgi:#1b1f29}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--r0:#8c4a38;--r1:#8a742b;--r2:#2f7a4f;--r3:#6a4f93;--r4:#2f6f8a;--r5:#8a3f62;--r6:#68783a;--il-cizgi:#1b1f29}}
.sehir-ic{padding:max(16px,env(safe-area-inset-top)) 16px 24px;max-width:560px;margin:0 auto}
.sehir-ic h1{font-size:1.5rem;margin:8px 0}
.harita-kutu{position:relative;margin:10px 0 6px;border-radius:var(--r);background:var(--card2);border:1px solid var(--line);overflow:hidden;touch-action:pan-y}
.harita-svg{display:block;width:100%;height:auto;aspect-ratio:990/423;cursor:grab}
.il{stroke:var(--il-cizgi);stroke-width:.7;cursor:pointer;transition:fill 120ms}
.il.r0{fill:var(--r0)}.il.r1{fill:var(--r1)}.il.r2{fill:var(--r2)}.il.r3{fill:var(--r3)}.il.r4{fill:var(--r4)}.il.r5{fill:var(--r5)}.il.r6{fill:var(--r6)}
.il:focus-visible{filter:brightness(1.15) saturate(1.2);outline:none}
@media (hover:hover) and (pointer:fine){.il:hover{filter:brightness(1.15) saturate(1.2)}} /* dokunmatikte dokunuş sahte hover açmasın */
.il.sec{stroke:var(--acc);stroke-width:2.2;filter:brightness(1.12)}
.il.benim{stroke:var(--ink);stroke-width:2.2}
.il-nokta{fill:var(--acc);stroke:#fff;stroke-width:1.5;pointer-events:none}
@media (prefers-reduced-motion:no-preference){.il{animation:il-gir 280ms var(--ease-out) both;animation-delay:calc(var(--i)*3ms)}.il-nokta{animation:koc-halka 1.4s ease-in-out infinite}}
@keyframes il-gir{from{opacity:0;transform:translateY(3px)}to{opacity:1}}
.harita-dugme{position:absolute;right:8px;bottom:8px;display:flex;flex-direction:column;gap:6px}
.harita-dugme button{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:700 1.2rem var(--yazi);cursor:pointer;box-shadow:var(--golge)}
.harita-bolgeler{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:.78rem;color:var(--mut);margin:4px 2px 10px}
.harita-bolgeler i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:5px;vertical-align:-1px}
.harita-bolgeler i.r0{background:var(--r0)}.harita-bolgeler i.r1{background:var(--r1)}.harita-bolgeler i.r2{background:var(--r2)}.harita-bolgeler i.r3{background:var(--r3)}.harita-bolgeler i.r4{background:var(--r4)}.harita-bolgeler i.r5{background:var(--r5)}.harita-bolgeler i.r6{background:var(--r6)}
.il-kart{padding:12px 14px;border-radius:var(--r);background:var(--card);border:1px solid var(--line);box-shadow:var(--golge);margin-bottom:10px}
.il-kart.bos{text-align:center}
#hr-liste{width:100%;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit}

/* sahiden.com: ilan satırı (foto + bilgi + fiyat), filtre paneli, detay fotoğrafı */
.vl-satir{grid-template-columns:104px 1fr auto;padding:8px 12px 8px 8px}
.vl-foto{position:relative;display:grid;place-items:center;width:104px;height:78px;border-radius:12px;background:var(--card2);overflow:hidden;flex:none;color:var(--acc-t)}
.vl-foto.buyuk{width:100%;height:auto;aspect-ratio:16/10;border-radius:14px;margin-bottom:10px}
.vl-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vl-foto-yedek{display:grid;place-items:center}
.vl-tarih{font-size:.75rem}
.vl-tablo{display:grid;gap:4px;margin-bottom:10px;padding:10px 12px;border-radius:14px;background:var(--card2);border:1px solid var(--line)}
.vl-fgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.vl-f{display:grid;gap:2px;font-size:.78rem;color:var(--mut)}
.vl-f select,.vl-f input{width:100%;padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-size:.9rem}
.vl-ust-satir{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:8px 0 4px;font-size:.9rem}
.vl-sirala{min-width:150px}
.gizli{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.vl-tablo .row{padding:1px 0}

/* Modül ekran kabuğu (modul.js): ahşap başlık çubuğu, sahne şeridi, net kazanç kartı */
ion-toolbar.baslik-bar.ahsap{--background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 2px,transparent 2px 9px),linear-gradient(180deg,var(--lacivert),var(--lacivert2));--color:#f6ecd4;--border-width:0}
ion-toolbar.baslik-bar.ahsap ion-title,ion-toolbar.baslik-bar.ahsap .geri-dugme{color:#fff4e0}
:root[data-theme=dark] ion-toolbar.baslik-bar.ahsap{--background:repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 2px,transparent 2px 9px),linear-gradient(180deg,var(--lacivert),var(--lacivert2))}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) ion-toolbar.baslik-bar.ahsap{--background:repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 2px,transparent 2px 9px),linear-gradient(180deg,var(--lacivert),var(--lacivert2))}}
.modul-hero{--mh1:#cfe8c6;--mh2:#9fcf9a;position:relative;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center;margin:0 0 12px;padding:16px;border-radius:var(--r);background:linear-gradient(135deg,var(--mh1),var(--mh2));color:#1e2a1c;overflow:hidden;box-shadow:var(--golge)}
.mh-sanayi{--mh1:#d9e4f2;--mh2:#a9bfd9}.mh-isletmeler{--mh1:#f6dfc2;--mh2:#e4b987}.mh-meslekler{--mh1:#e6dcf4;--mh2:#c3adE3}.mh-varlik{--mh1:#d6e6ef;--mh2:#9fc3d6}.mh-harita{--mh1:#d9ecd2;--mh2:#9ccc93}.mh-ciftlik{--mh1:#d4e8c4;--mh2:#9bc47e}
:root[data-theme=dark] .modul-hero{--mh1:#2a3550;--mh2:#1e2740;color:#f1eee6}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .modul-hero{--mh1:#2a3550;--mh2:#1e2740;color:#f1eee6}}
.mh-emo{grid-row:span 2;font-size:3rem;line-height:1;filter:drop-shadow(0 4px 4px rgba(0,0,0,.25))}
.mh-yazi{display:grid;gap:1px}.mh-yazi b{font-size:1.2rem}.mh-yazi span{font-size:.85rem;opacity:.8}
.mh-kartlar{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:8px}
.mh-kart{display:grid;gap:1px;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.55);color:#2a2217;backdrop-filter:blur(2px)}
:root[data-theme=dark] .mh-kart{background:rgba(0,0,0,.35);color:#f1eee6}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .mh-kart{background:rgba(0,0,0,.35);color:#f1eee6}}
.mh-kart small{font-size:.72rem;font-weight:600;opacity:.75}.mh-kart b{font-size:1.15rem}.mh-kart span{font-size:.75rem;opacity:.75}
.net-kart{margin:0 0 12px;padding:14px;border-radius:var(--r);background:var(--card);border:1.5px solid #d9c8a4;box-shadow:var(--golge)}
:root[data-theme=dark] .net-kart{border-color:#5a4a33}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .net-kart{border-color:#5a4a33}}
.net-ust{display:flex;align-items:center;gap:12px}.net-simge{font-size:2rem;filter:drop-shadow(0 2px 2px rgba(0,0,0,.2))}
.net-ust small,.net-omur small{font-size:.75rem;font-weight:600;color:var(--mut)}
.net-buyuk{font-size:1.7rem;font-weight:800;color:var(--ok);line-height:1.1}.net-buyuk.eksi{color:var(--bad)}.net-buyuk span{font-size:.9rem;font-weight:600;color:var(--mut)}
.net-omur{display:inline-grid;gap:1px;margin-top:10px;padding:8px 12px;border-radius:12px;background:var(--okbg)}.net-omur b{color:var(--ok);font-size:1.15rem}
.net-satir{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;padding-top:8px;border-top:1px dashed var(--line);font-size:.85rem;color:var(--mut)}.net-satir b{color:var(--ink)}
.net-ipucu{margin-top:8px;font-size:.78rem}

/* Aylık liderlik: puan dökümü */
.puan-satir{margin-top:10px}.puan-satir ion-progress-bar{margin:4px 0}

/* VIP Salonu: personel rozeti */
.vip-rozet{margin:6px 0;padding:6px 10px;border-radius:10px;background:var(--acc-bg);color:var(--acc-t);font-size:.82rem;font-weight:600}
.mh-vip{--mh1:#fbe9b8;--mh2:#e8c35a}

/* İşletme logosu, kompakt tesis satırı, arama ve çipler */
.logo{--lc:#4a78c4;--lb:40px;display:inline-grid;place-items:center;width:var(--lb);height:var(--lb);flex:none;border-radius:calc(var(--lb)*.3);background:linear-gradient(160deg,color-mix(in srgb,var(--lc) 35%,#fff),color-mix(in srgb,var(--lc) 70%,#000 0%));border:2px solid var(--lc);box-shadow:0 2px 4px rgba(0,0,0,.18);vertical-align:middle}
.logo-emo{font-size:calc(var(--lb)*.56);line-height:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}
.kart-baslik{display:inline-flex;align-items:center;gap:8px}
.tesis-s{display:flex;align-items:stretch;gap:6px;margin:8px 0 0}.tesis-s .tesis-satir{flex:1;min-width:0}.ts-hiz{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:48px;border:1px solid var(--acc);border-radius:16px;background:var(--card);color:var(--ink);font:inherit;font-size:1.1rem;cursor:pointer;box-shadow:var(--golge);transition:transform 160ms var(--ease-out)}.ts-hiz small{font-size:.7rem;color:var(--mut)}.ts-hiz:active{transform:scale(.95)}.ts-hiz.al{border-color:var(--line)}.ts-hiz:disabled{opacity:.5;cursor:default}
.tesis-satir{display:flex;align-items:center;gap:12px;width:100%;margin:0;padding:8px 10px;background:var(--card);border:1px solid var(--line);border-radius:16px;color:var(--ink);font:inherit;text-align:left;cursor:pointer;box-shadow:var(--golge)}
.tesis-satir.acik{border-color:var(--acc);border-bottom-left-radius:6px;border-bottom-right-radius:6px}
.tesis-satir .ts-ad{display:flex;flex-direction:column;min-width:0;flex:1}.tesis-satir .ts-ad b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tesis-satir .ts-ad .mut{font-size:.76rem}
.ts-ok{color:var(--mut);font-size:1.1rem}
.chip{display:inline-block;padding:3px 10px;border-radius:99px;font-size:.78rem;font-weight:700;white-space:nowrap;background:var(--card2);color:var(--mut)}
.chip.hazir{background:var(--okbg);color:var(--ok)}.chip.uretimde{background:var(--acc-bg);color:var(--acc-t)}.chip.eksik,.chip.dolu{background:var(--warnbg);color:var(--warn)}
.tesis-arac{margin-top:8px}
.tesis-arac input[type=search]{width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;margin-bottom:8px}
.cipler{display:flex;gap:6px;overflow-x:auto;margin:0 0 8px;padding-bottom:2px}
.cip{flex:none;padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:600 .8rem var(--yazi);cursor:pointer;white-space:nowrap}
.cip.on{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.tesis-liste ion-card{margin-top:0;border-top-left-radius:6px;border-top-right-radius:6px}

/* Seviye Yolu */
.sy-grup { border: 1px solid var(--ion-border-color, rgba(128,128,128,.3)); border-radius: 12px; padding: 10px 12px; margin: 8px 0; }
.sy-grup.acik { opacity: .85; }
.sy-grup.siradaki { border-color: var(--ion-color-primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ion-color-primary) 25%, transparent); }
.sy-grup.kilitli .sy-oge { filter: grayscale(.6); }
.sy-sv { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.sy-ogeler { display: flex; flex-wrap: wrap; gap: 8px; }
.sy-oge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 10px; background: var(--ion-color-step-50, rgba(128,128,128,.12)); min-width: 0; }
.sy-ikon { font-size: 22px; line-height: 1; }
.sy-ad { display: flex; flex-direction: column; min-width: 0; }
.sy-ad small { font-size: 11px; }

/* sahiden.com: pazarın kendi marka başlığı. Lacivert yüzey, ".com" altın vurguda. */
:root .modul-hero.mh-varlik{--mh1:#24356a;--mh2:#141d3d;color:#f6ecd4} /* :root ile koyu mod kuralını geçer */
.mh-varlik .mh-yazi b{font-size:1.45rem;letter-spacing:-.01em}
.mh-varlik .mh-yazi b i{font-style:normal;color:#f2c25b}
:root .mh-varlik .mh-kart{background:rgba(255,255,255,.1);color:#f6ecd4}

/* Basma geri bildirimi (Emil Kowalski, design engineering): basılabilen her öğe 160 ms ease-out ile hafifçe küçülür; arayüz dokunuşu duyduğunu gösterir.
   Yalnız transform; hareket azaltmada genel kural süreyi sıfırlar. Kendi :active kuralı olanlar (ion-button, .zil, .ikon, .pz-karo, .vl-kart) dokunulmaz. */
.olay,.depo-oge,.tesis-satir,.cip,.ikon-diz,.sohbet-serit,.baglanti,.harita-dugme button,ion-segment-button,ion-tab-button{transition:transform 160ms var(--ease-out)}
.olay:active,.tesis-satir:active,.sohbet-serit:active,.cip:active,.ikon-diz:active,.baglanti:active,.harita-dugme button:active,ion-segment-button:active,ion-tab-button:active{transform:scale(.97)}
.depo-oge:active{transform:scale(.94)} /* küçük kare: aynı his için biraz daha */

/* ---------- Kutlama ve açılış hareketleri (efekt.js kutlama/basari, acilis.js ilk-acilis) ---------- */
/* Rozet: altın madalyon, lacivert halka. Giriş scale(.9)'dan (sıfırdan değil); yüz 3B eğilir, bir kez ışık süpürür. */
.rozet{width:132px;height:132px;margin:14px auto 12px;perspective:600px;animation:rozet-gir 300ms var(--ease-out) both}
.rozet-yuz{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:50%;overflow:hidden;
  background:radial-gradient(circle at 35% 30%,#fff1b8,#f2c25b 45%,#c88a17 100%);box-shadow:0 0 0 6px var(--lacivert),0 12px 28px -8px rgba(20,27,51,.55),inset 0 -6px 12px rgba(120,70,0,.35);will-change:transform}
.rozet-yuz span{font:700 3.2rem/1 var(--sayi);color:#141b33;text-shadow:0 1px 0 rgba(255,255,255,.5)}
.kapaniyor{opacity:0;transition:opacity 140ms ease-out;pointer-events:none}
.rozet-yuz.prestij-yuz{background:none;box-shadow:0 12px 28px -8px rgba(20,27,51,.55)}.rozet-yuz.prestij-yuz span{display:grid;place-items:center;text-shadow:none}.prestij-rozet{display:inline-block;vertical-align:middle;flex:none}
.rozet-yuz::after{content:"";position:absolute;inset:-20%;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.65) 50%,transparent 60%);transform:translateX(-120%);animation:rozet-isik 700ms var(--ease-in-out) 280ms both}
@keyframes rozet-gir{from{opacity:0;transform:scale(.9) translateY(6px)}}
@keyframes rozet-isik{to{transform:translateX(120%)}}
/* Başarı yıldızları: 90 ms kademe, 240 ms ease-out; boş yıldız soluk kalır. */
.basari{display:flex;justify-content:center;gap:10px;margin:2px 0 4px}
.yildiz{font-size:2.1rem;line-height:1;color:rgba(255,255,255,.2);opacity:0;transform:scale(.6);animation:yildiz-gir 240ms var(--ease-out) forwards;animation-delay:calc(var(--i) * 90ms)}
.yildiz.dolu{color:#f2c25b;text-shadow:0 2px 12px rgba(242,194,91,.55)}
@keyframes yildiz-gir{to{opacity:1;transform:none}}
/* Uygulama açılışı (sayfa yüklemesi başına bir kez): üst çubuk ve alt menü yerine oturur, içerik kartları 40 ms kademeyle gelir. */
@media (prefers-reduced-motion:no-preference){
  .ilk-acilis #ust{animation:ust-gir 240ms var(--ease-out) both}
  .ilk-acilis ion-footer{animation:alt-gir 240ms var(--ease-out) both}
  .ilk-acilis #sayfa>*{animation:icerik-gir 280ms var(--ease-out) both}
  .ilk-acilis #sayfa>:nth-child(2){animation-delay:40ms}.ilk-acilis #sayfa>:nth-child(3){animation-delay:80ms}
  .ilk-acilis #sayfa>:nth-child(4){animation-delay:120ms}.ilk-acilis #sayfa>:nth-child(5){animation-delay:160ms}.ilk-acilis #sayfa>:nth-child(n+6){animation-delay:200ms}
}
@keyframes ust-gir{from{opacity:0;transform:translateY(-8px)}}
@keyframes alt-gir{from{opacity:0;transform:translateY(8px)}}
@keyframes icerik-gir{from{opacity:0;transform:translateY(10px)}}
/* Hareket azaltma: rozet ve yıldızlar hemen görünür, ışık süpürmesi yok. */
@media (prefers-reduced-motion:reduce){.rozet,.yildiz{animation:none;opacity:1;transform:none}.rozet-yuz::after{display:none}}
.tamam:disabled,.tamam[disabled]{opacity:1!important;background:var(--ok)!important;color:var(--tamam-yazi,#fff)!important;transition:background-color 160ms ease}

/* Günlük giriş serisi şeridi: 7 gün; alınan günler altın, bugün halkalı. */
.giris-seri{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:10px 0}
.giris-gun{display:grid;place-items:center;gap:2px;padding:6px 0;border-radius:12px;background:var(--card2);border:1px solid var(--line);font-size:.75rem;color:var(--mut)}
.giris-gun b{font-size:1.1rem;line-height:1}
.giris-gun.alindi{background:var(--altin-bg);border-color:var(--altin);color:var(--altin-t)}
.giris-gun.bugun{box-shadow:0 0 0 2px var(--acc)}
.basarim.kazanildi{border-color:var(--altin)}

/* oyuncu adı düğmesi (profil açar), sen yokken ve çark kartları */
.ad-btn{all:unset;cursor:pointer;font-weight:700;border-bottom:1px dotted var(--mut)}.ad-btn:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.yokken{border-color:var(--acc)}
/* hazine sandığı açılışı (efekt.js sandikAcilisi, 3B: u3b-sandik.js); 3B yoksa CSS yedeği */
.sandik-3b{width:100%;min-height:200px;display:grid;place-items:center;margin:0 0 6px}
.sandik-3b canvas{box-shadow:none;cursor:default;border-radius:12px}
.sandik-odul{font:700 1.5rem/1.2 var(--sayi);color:var(--acc-t);margin:4px 0 14px;transition:opacity 220ms,transform 220ms}
.sandik-odul.gizli-odul{opacity:0;transform:translateY(8px)}
.sandik-yedek{position:relative;width:132px;height:110px}
.sandik-govde{position:absolute;left:0;right:0;bottom:0;height:62px;border-radius:10px;background:linear-gradient(#b97a38,#8a5320);box-shadow:inset 0 -6px 0 rgba(0,0,0,.18),inset 0 0 0 3px #c9a24b}
.sandik-kapak{position:absolute;left:-2px;right:-2px;bottom:56px;height:38px;border-radius:16px 16px 4px 4px;background:linear-gradient(#cf9246,#a8672a);box-shadow:inset 0 0 0 3px #c9a24b;transform-origin:0 100%;transition:transform 320ms cubic-bezier(.34,1.56,.64,1)}
.sandik-3b.acildi .sandik-kapak{transform:rotate(-32deg) translateY(-4px)}
.sandik-3b.acildi .sandik-yedek::before{content:"";position:absolute;left:12px;right:12px;bottom:50px;height:26px;border-radius:50%;background:#ffd36b;box-shadow:0 0 22px 8px rgba(255,211,107,.7)}
@media (prefers-reduced-motion:reduce){.sandik-kapak,.sandik-odul{transition:none}}
/* usta defteri: ana ekran kartı (seri, sandık ilerlemesi, işletme kademeleri) */
.usta-sandik{display:flex;align-items:center;gap:10px;margin:8px 0 4px}
.usta-bar{flex:1;height:8px;border-radius:99px;background:var(--line);overflow:hidden}
.usta-bar i{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(var(--p,0));background:var(--acc);transition:transform 200ms var(--ease-out)}
.usta-satir{display:flex;justify-content:space-between;gap:8px;padding:5px 0;font-size:.92rem;border-top:1px dashed var(--line)}
.kad{font-weight:600}.kad.k1{color:#7d8696}.kad.k2{color:#b98512}
.cark{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.cark svg{flex:none;overflow:visible}
.cark-d{transform-box:fill-box;transform-origin:center}
.card .satir{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 0}
.sv .satir{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dashed var(--line)}.sv .satir:last-child{border:0}

/* renk körlüğü paleti (Okabe-Ito'dan): iyi = mavi, kötü = turuncu; yeşil/kırmızı ayrımına bağlı kalınmaz */
html[data-renk="kor"]{--ok:#0b5cad;--okbg:#e1eefb;--bad:#b84c00}
@media (prefers-color-scheme:dark){html:not([data-theme=light])[data-renk="kor"]{--ok:#6db3ff;--okbg:#14263d;--bad:#ffa066}}
html[data-theme=dark][data-renk="kor"]{--ok:#6db3ff;--okbg:#14263d;--bad:#ffa066}
.festival{border-color:var(--acc);background:linear-gradient(135deg,var(--acc-bg),var(--card) 70%)}

.suslar{display:flex;gap:8px;font-size:1.3rem;margin-top:4px}.sehir-olay-benim{border-color:var(--acc)}

/* kazanılan renk paletleri (Ayarlar > Görünüm): vurgu ve başlık şeridi değişir; durum renkleri ve zemin aynı kalır */
:root[data-palet="zumrut"][data-palet]{--ion-color-primary:#2fb67c;--ion-color-primary-rgb:47,182,124;--ion-color-primary-contrast:#06281c;--ion-color-primary-contrast-rgb:6,40,28;--ion-color-primary-shade:#29a06d;--ion-color-primary-tint:#44bd89;--acc:#2fb67c;--acc-ink:#06281c;--acc-t:#0c6a47;--acc-bg:#dcf4e8;--altin:#46c690;--lacivert:#0f3d2e;--lacivert2:#0a2a20}
:root[data-palet="okyanus"][data-palet]{--ion-color-primary:#3aa0e8;--ion-color-primary-rgb:58,160,232;--ion-color-primary-contrast:#06223a;--ion-color-primary-contrast-rgb:6,34,58;--ion-color-primary-shade:#3389cc;--ion-color-primary-tint:#4ea6ea;--acc:#3aa0e8;--acc-ink:#06223a;--acc-t:#0b5d99;--acc-bg:#dcecfa;--altin:#5bb4f0;--lacivert:#12365c;--lacivert2:#0b2540}
:root[data-palet="bordo"][data-palet]{--ion-color-primary:#d9576b;--ion-color-primary-rgb:217,87,107;--ion-color-primary-contrast:#2a0710;--ion-color-primary-contrast-rgb:42,7,16;--ion-color-primary-shade:#bf4d5e;--ion-color-primary-tint:#dd687a;--acc:#d9576b;--acc-ink:#2a0710;--acc-t:#9c2336;--acc-bg:#fbe1e5;--altin:#e57a8b;--lacivert:#5a1a2b;--lacivert2:#3d111d}
@media (prefers-color-scheme:dark){html:not([data-theme=light])[data-palet="zumrut"]{--acc-t:#7fe0b6;--acc-bg:#12372a}html:not([data-theme=light])[data-palet="okyanus"]{--acc-t:#8cc9f5;--acc-bg:#122f48}html:not([data-theme=light])[data-palet="bordo"]{--acc-t:#f0a3af;--acc-bg:#3f1620}}
html[data-theme=dark][data-palet="zumrut"]{--acc-t:#7fe0b6;--acc-bg:#12372a}html[data-theme=dark][data-palet="okyanus"]{--acc-t:#8cc9f5;--acc-bg:#122f48}html[data-theme=dark][data-palet="bordo"]{--acc-t:#f0a3af;--acc-bg:#3f1620}
.palet-sec{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.palet{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:99px;border:1px solid var(--line);background:var(--card2);color:var(--ink);font:inherit;min-height:44px}
.palet[aria-pressed=true]{border-color:var(--acc);box-shadow:0 0 0 2px var(--acc)}.palet:disabled{opacity:.55}.palet i{width:16px;height:16px;border-radius:50%;display:inline-block}

.profil-avatar{width:84px;height:84px;margin:0 auto;border-radius:50%;display:grid;place-items:center;font-size:2.2rem;font-weight:700;color:var(--ink);background:var(--card);border:3px solid var(--altin)}
button.avatar-halka{border:0;background:conic-gradient(var(--acc) calc(var(--xp)*1%),var(--line) 0);color:inherit;font:inherit;cursor:pointer;transition:transform 160ms var(--ease-out)}button.avatar-halka:active{transform:scale(.95)}

/* Öğretici anlatıcısı (public/ogretici.js ANLATICI): yalnızca transform ile oynar; adım kutusu yeniden çizilince el sallayıp konuşur. */
.koc-govde{display:flex;gap:10px;align-items:flex-start}.koc-metin{min-width:0;flex:1}
.koc-anlatici{flex:none;width:60px;height:60px;margin-top:2px}.koc-anlatici svg{display:block;overflow:visible}
.koc-anlatici g,.koc-anlatici ellipse{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:no-preference){
  .koc-anlatici svg{animation:an-gir 420ms var(--ease-out) both}
  .an-govde{animation:an-nefes 3.2s ease-in-out infinite}
  .an-goz{animation:an-goz 4.6s ease-in-out infinite}
  .an-agiz{animation:an-konus .24s ease-in-out 12}
  .an-kol{transform-origin:12% 90%;animation:an-sallan .6s ease-in-out 3}
  .an-bas{animation:an-bas 2.8s ease-in-out infinite}
}
@keyframes an-gir{from{opacity:0;transform:translateY(10px) scale(.8)}to{opacity:1;transform:none}}
@keyframes an-nefes{0%,100%{transform:translateY(0)}50%{transform:translateY(1.6px)}}
@keyframes an-goz{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes an-konus{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(2.4)}}
@keyframes an-sallan{0%,100%{transform:rotate(0)}30%{transform:rotate(-24deg)}70%{transform:rotate(14deg)}}
@keyframes an-bas{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(1.5deg)}}

/* Kısa ekranda öğretici kartı içeriği örtmesin: anlatıcı gizlenir, kart kaydırılabilir. */
@media (max-height:700px){.koc-anlatici{display:none}.koc-kart{max-height:38vh;overflow:auto}}

/* Arama çubuğu (acilis.js araCubugu): yazıya uymayan öğeler gizlenir. */
.ara-gizli{display:none!important}
.ara-kutu{width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;margin:4px 0 8px}