/* =========================================================
   Ekonomi taslağı: ekonomi.css
   Tribün portalının iskeleti (telefon önce, 375 px), Ekonomi'nin altın vurgusu.
   Ana ekran tek ekrana sığar (JS sığmayan haber ve takvim satırlarını gizler);
   alt sayfalar tam ekran açılır ve kendi içinde kayar.
   ========================================================= */

/* ---- 1. Renk ve yazı tokenları ----
   Tema: <html data-tema="gece|gunduz"> (kullanıcının seçimi, localStorage 'yazsammi.tema') varsa o geçerli;
   yoksa işletim sisteminin teması. Açık seçim medya sorgusunu ezer. --sema: TradingView iframe şeması. */
:root {
  --bg: #0E0B16;
  --kart: #171221;
  --yuzey: #1E1829;
  --cizgi: #272036;
  --cizgi2: #362D48;
  --kenar: rgba(255, 255, 255, 0.06);
  --geri-kenar: rgba(255, 255, 255, 0.08);
  --isik: rgba(245, 184, 61, 0.14);
  --zemin: linear-gradient(180deg, #0E0B16 0%, #15111F 100%);
  --yazi: #F4F2F8;
  --orta: #CFC9DC;
  --soluk: #958DA8;
  --vurgu: #F5B83D;
  --vurgu-yazi: #120E06;
  --yesil: #3DDC97;
  --kirmizi: #FF5A4F;
  --mavi: #7CB8FF;
  --turuncu: #FF9F43;
  --mor: #B48CFF;
  --pembe: #F472B6;
  --bas: "Barlow Condensed", "Barlow Yedek", system-ui, sans-serif;
  --govde: "Bricolage Grotesque", "Bricolage Yedek", system-ui, sans-serif;
  --sema: dark;
  color-scheme: dark;
}
@media (prefers-color-scheme: light) {
  :root:not([data-tema="gece"]) {
    --bg: #F4F5F7; --kart: #FFFFFF; --yuzey: #F6F7F9; --cizgi: #E3E7ED; --cizgi2: #D5DCE5;
    --kenar: rgba(15, 23, 42, 0.07); --geri-kenar: rgba(0, 0, 0, 0.08); --isik: rgba(183, 121, 31, 0.10);
    --zemin: linear-gradient(180deg, #F8F6F1 0%, #EEF1F6 100%);
    --yazi: #111827; --orta: #374151; --soluk: #5F6B7A;
    --vurgu: #B7791F; --vurgu-yazi: #1B1305;
    --yesil: #15803D; --kirmizi: #DC2626; --mavi: #2563EB; --turuncu: #C2410C; --mor: #7C3AED; --pembe: #DB2777;
    --sema: light;
    color-scheme: light;
  }
}
:root[data-tema="gunduz"] {
  --bg: #F4F5F7; --kart: #FFFFFF; --yuzey: #F6F7F9; --cizgi: #E3E7ED; --cizgi2: #D5DCE5;
  --kenar: rgba(15, 23, 42, 0.07); --geri-kenar: rgba(0, 0, 0, 0.08); --isik: rgba(183, 121, 31, 0.10);
  --zemin: linear-gradient(180deg, #F8F6F1 0%, #EEF1F6 100%);
  --yazi: #111827; --orta: #374151; --soluk: #5F6B7A;
  --vurgu: #B7791F; --vurgu-yazi: #1B1305;
  --yesil: #15803D; --kirmizi: #DC2626; --mavi: #2563EB; --turuncu: #C2410C; --mor: #7C3AED; --pembe: #DB2777;
  --sema: light;
  color-scheme: light;
}
:root[data-tema="gece"] {
  --bg: #0E0B16; --kart: #171221; --yuzey: #1E1829; --cizgi: #272036; --cizgi2: #362D48;
  --kenar: rgba(255, 255, 255, 0.06); --geri-kenar: rgba(255, 255, 255, 0.08); --isik: rgba(245, 184, 61, 0.14);
  --zemin: linear-gradient(180deg, #0E0B16 0%, #15111F 100%);
  --yazi: #F4F2F8; --orta: #CFC9DC; --soluk: #958DA8;
  --vurgu: #F5B83D; --vurgu-yazi: #120E06;
  --yesil: #3DDC97; --kirmizi: #FF5A4F; --mavi: #7CB8FF; --turuncu: #FF9F43; --mor: #B48CFF; --pembe: #F472B6;
  --sema: dark;
  color-scheme: dark;
}

/* ---- 2. Temel ---- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-height: 100%; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background-color: var(--bg);
  background-image: var(--zemin);
  background-repeat: no-repeat;       /* degrade sayfanın tamamına bir kez yayılır (ekran boyunda tekrar etmez) */
  background-size: 100% 100%;
  min-height: 100vh;
  color: var(--yazi);
  font: 400 15px/1.4 var(--govde);
  overflow-x: hidden;
}
/* Üst kenarda hafif altın ışıma (dokunmayı engellemez) */
body::before {
  content: ""; position: fixed; left: 0; right: 0; top: 0; height: 320px; z-index: -1;
  background: radial-gradient(70% 100% at 50% 0%, var(--isik), transparent 72%);
  pointer-events: none;
}
body.kilit { overflow: hidden; }
h1, h2, h3 { margin: 0; }
p { margin: 6px 0; }
a { color: var(--vurgu); }
button { font: inherit; color: inherit; }
.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
.skip {
  position: absolute; left: 16px; top: -60px; z-index: 100;
  background: var(--vurgu); color: var(--vurgu-yazi); padding: 10px 14px; border-radius: 8px;
}
.skip:focus { top: 8px; }
:focus-visible { outline: 2px solid var(--vurgu); outline-offset: 2px; }
.muted { color: var(--soluk); }
.kucuk { font-size: 12px; }
.not { font-size: 12.5px; color: var(--soluk); margin: 10px 0; }
.up { color: var(--yesil); font-weight: 700; }
.down { color: var(--kirmizi); font-weight: 700; }
.notr { color: var(--soluk); }
.uyari { color: var(--kirmizi); font-size: 14px; }
.kaynak { font-size: 12.5px; color: var(--soluk); margin: 6px 0; }
.rozet {
  display: inline-block; font-size: 10.5px; line-height: 16px; padding: 0 6px; margin-left: 4px;
  border: 1px solid var(--cizgi2); border-radius: 999px; color: var(--soluk); white-space: nowrap;
}
.uyari-taslak { color: var(--soluk); border-left: 3px solid var(--vurgu); padding-left: 10px; }
.hap {
  display: inline-block; padding: 2px 8px; border-radius: 999px;
  font: 700 12px var(--govde); white-space: nowrap;
}
.hap.up { background: color-mix(in srgb, var(--yesil) 16%, transparent); color: var(--yesil); }
.hap.down { background: color-mix(in srgb, var(--kirmizi) 16%, transparent); color: var(--kirmizi); }
.hap.notr { color: var(--soluk); background: none; }
/* Sayılar: hizalı rakamlar */
.s-fi, .s-deg, .nz-fiyat, .hap, .dg, .sa, .k-say, .fiyat-buyuk, .metrik .deger, .tbl td, .pf b, .bil-sem { font-variant-numeric: tabular-nums; }
/* Simgeler: sprite (index.html) içinden, tek renk */
.ic {
  width: 18px; height: 18px; flex: 0 0 auto; display: block;
  fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round;
}
.glif { font-family: var(--bas); font-weight: 800; line-height: 1; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* ---- 3. Ana ekran: başlık, şerit, manşet, nabız, bloklar, kısayollar (tek ekran) ---- */
#icerik { max-width: 720px; margin: 0 auto; min-height: 100%; }
.ana {
  display: flex; flex-direction: column;
  min-height: 100vh; min-height: 100dvh;
  padding-bottom: 6px;
}
.ust { display: grid; gap: 8px; padding: 8px 14px 6px; }
.ust-satir { display: flex; align-items: center; gap: 10px; min-width: 0; }
.logo {
  font-family: var(--bas); font-weight: 800; font-size: 24px; line-height: 30px;
  letter-spacing: 0.4px; white-space: nowrap; color: var(--yazi);
}
/* Canlı göstergesi (başlığın altında, tek satır): yanıp sönen yeşil nokta; piyasa kapalıysa gri ve açılış saati */
.canli {
  justify-self: start; display: inline-flex; align-items: center; gap: 7px; min-height: 26px; max-width: 100%;
  padding: 0 10px; border-radius: 999px;
  background: color-mix(in srgb, var(--yesil) 13%, transparent); color: var(--yesil);
  font: 700 12px var(--govde); letter-spacing: 0.2px;
}
#canli-yazi { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canli-nokta {
  width: 7px; height: 7px; border-radius: 50%; background: currentColor;
  animation: canli-nabiz 1.6s ease-out infinite;
}
.canli.kapali { background: var(--yuzey); color: var(--soluk); }
.canli.kapali .canli-nokta { animation: none; opacity: 0.6; }
@keyframes canli-nabiz {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 65%, transparent); }
  70%, 100% { box-shadow: 0 0 0 7px transparent; }
}
.anahtar-kap {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 3px;
  background: var(--kart); border: 1px solid var(--cizgi2); border-radius: 14px;
  box-shadow: inset 0 1px 0 var(--kenar);
}
.anahtar-dugme {
  min-height: 44px; padding: 0 8px; border: 0; border-radius: 11px; background: transparent;
  color: var(--orta); font: 700 14px var(--govde); white-space: nowrap; cursor: pointer;
}
.anahtar-dugme[aria-pressed="true"] {
  background: linear-gradient(180deg, #FFCB5C 0%, var(--vurgu) 100%); color: var(--vurgu-yazi);
  box-shadow: 0 6px 16px -8px var(--vurgu);
}
.ust-araclar { display: flex; gap: 8px; margin-left: auto; flex: 0 0 auto; }
.ara-dugme {
  flex: 0 0 44px; width: 44px; height: 44px;
  display: grid; place-items: center; border-radius: 12px;
  border: 1px solid var(--cizgi2); background: var(--kart); color: var(--yazi); cursor: pointer;
  box-shadow: inset 0 1px 0 var(--kenar);
}
.ara-dugme[aria-expanded="true"] { border-color: var(--vurgu); color: var(--vurgu); }
.ara-kutu { padding: 0 14px 8px; }
.ara-kutu input {
  width: 100%; height: 44px; padding: 0 14px; border-radius: 12px;
  border: 1px solid var(--cizgi2); background: var(--kart); color: var(--yazi);
  font: 500 16px var(--govde);
}
.ara-sonuc { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ara-sonuc button, .ara-sonuc .kucuk {
  min-height: 44px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--cizgi2);
  background: var(--kart); font: 600 13px var(--govde); color: var(--yazi); cursor: pointer;
  display: inline-flex; align-items: center;
}

/* Kayan şerit: borsa bandı gibi sürekli akar; iki kopya yan yana, kesintisiz döngü */
.serit-kap {
  position: relative; overflow: hidden; --sure: 60s; height: 46px;   /* 06.11 CLS: şerit JS ile dolmadan yer ayrılır */
  border-block: 1px solid var(--cizgi);
  background: color-mix(in srgb, var(--kart) 72%, transparent);
}
.serit-kap::before, .serit-kap::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 22px; z-index: 2; pointer-events: none;
}
.serit-kap::before { left: 0; background: linear-gradient(90deg, var(--bg), transparent); }
.serit-kap::after { right: 0; background: linear-gradient(270deg, var(--bg), transparent); }
.serit { display: flex; width: max-content; animation: serit-kay var(--sure) linear infinite; }
.serit-kap.bos .serit { animation: none; }
.serit-grup { display: flex; flex: 0 0 auto; }
.serit-kap:hover .serit, .serit-kap:focus-within .serit, .serit-kap.duraklat .serit { animation-play-state: paused; }
@keyframes serit-kay { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }
.s-oge {
  flex: 0 0 auto; display: flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 4px 16px 4px 12px; border: 0; border-left: 1px solid var(--cizgi2);
  background: transparent; color: var(--yazi); text-align: left; cursor: pointer;
}
.s-oge:focus-visible { outline-offset: -3px; }
.s-ik { width: 18px; height: 18px; flex: 0 0 18px; display: grid; place-items: center; color: var(--renk, var(--vurgu)); }
.s-ik img, .coin-ik { width: 18px; height: 18px; border-radius: 50%; display: block; }
.s-ik .harf { width: 18px; height: 18px; font-size: 10px; }
.doviz-r {
  width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid currentColor;
  display: grid; place-items: center; font: 800 11px/1 var(--govde); color: var(--renk, var(--vurgu));
}
.s-tx { display: grid; gap: 1px; min-width: 0; }
.s-ad {
  display: flex; align-items: center; gap: 4px;
  font: 600 11px/13px var(--govde); color: var(--soluk); white-space: nowrap;
}
.s-sat { display: flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.s-fi { font: 800 15px/17px var(--bas); letter-spacing: 0.2px; }
.s-deg { font: 700 11.5px var(--govde); }
.s-deg.up { color: var(--yesil); }
.s-deg.down { color: var(--kirmizi); }
.s-deg.notr { color: var(--soluk); }
.nokta-kapali { width: 5px; height: 5px; border-radius: 50%; background: var(--soluk); display: inline-block; flex: 0 0 5px; }
.s-oge.yan-yesil { animation: yan-yesil 0.9s ease-out; }
.s-oge.yan-kirmizi { animation: yan-kirmizi 0.9s ease-out; }
@keyframes yan-yesil { from { background: color-mix(in srgb, var(--yesil) 26%, transparent); } to { background: transparent; } }
@keyframes yan-kirmizi { from { background: color-mix(in srgb, var(--kirmizi) 26%, transparent); } to { background: transparent; } }

/* Manşet: kaydırmalı kartlar, nokta göstergesi */
.manset-kaydir {
  display: flex; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
  margin-top: 8px;
}
.manset-kaydir::-webkit-scrollbar { display: none; }
.manset-slayt { flex: 0 0 100%; scroll-snap-align: start; padding: 0 14px; box-sizing: border-box; }
.manset-kaydir > .yukleme, .manset-kaydir > .veri-yok {
  flex: 0 0 calc(100% - 28px); height: 128px; margin: 0 14px;
  border: 1px solid var(--kenar); border-radius: 18px; background: var(--kart);
  display: flex; flex-direction: column; justify-content: center; padding: 12px;
}
.manset-kart {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between; gap: 6px;
  height: 128px; padding: 12px 14px; border-radius: 18px; border: 1px solid var(--kenar);
  background: linear-gradient(160deg, color-mix(in srgb, var(--renk, var(--vurgu)) 28%, var(--kart)) 0%, var(--kart) 75%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 14px 26px -20px rgba(0, 0, 0, 0.7);
  color: var(--yazi); text-decoration: none;
}
.manset-kart.gorsel { color: #FFFFFF; }
.mk-gorsel { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.manset-kart.gorsel::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(8, 6, 14, 0.12) 0%, rgba(8, 6, 14, 0.55) 45%, rgba(8, 6, 14, 0.92) 100%);
}
.manset-kart.gorsel .mk-simge { display: none; }
.mk-simge { position: absolute; right: 8px; top: 10px; width: 92px; height: 92px; color: var(--renk, var(--vurgu)); opacity: 0.22; z-index: -1; }
.mk-simge.glif { font-size: 92px; line-height: 92px; text-align: center; right: 14px; }
.etiket-hap {
  align-self: flex-start; font: 800 10px var(--govde); letter-spacing: 0.6px; text-transform: uppercase;
  color: #120E06; background: var(--renk, var(--vurgu)); padding: 3px 8px; border-radius: 7px;
}
.mb-baslik {
  font-family: var(--bas); font-weight: 800; font-size: 21px; line-height: 23px; color: inherit;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mb-baslik.uzun { font-size: 17px; line-height: 20px; -webkit-line-clamp: 3; }
.mb-kaynak {
  display: flex; align-items: center; gap: 6px; min-width: 0;
  font: 600 12px var(--govde); color: var(--orta); white-space: nowrap;
}
.manset-kart.gorsel .mb-kaynak { color: rgba(255, 255, 255, 0.86); }
.mb-kaynak > span { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.fav { width: 14px; height: 14px; border-radius: 3px; flex: 0 0 14px; display: inline-block; }
.noktalar { display: flex; justify-content: center; align-items: center; height: 36px; }
.nokta {
  position: relative; width: 44px; height: 44px; margin: -4px 0; padding: 0; border: 0; background: none; cursor: pointer;
  display: grid; place-items: center;
}
.nokta::before {
  content: ""; width: 7px; height: 7px; border-radius: 4px; background: var(--cizgi2);
  transition: width 0.2s;
}
.nokta[aria-current="true"]::before { width: 18px; background: var(--vurgu); }

/* Manşet sağ-sol tuşu: yalnız fareli geniş ekranda (telefonda parmakla kaydırılır) */
.manset-sar { position: relative; min-height: 128px; }
.manset-ok { display: none; }
@media (hover: hover) and (pointer: fine) and (min-width: 640px) {
  .manset-ok:not([hidden]) {
    display: grid; place-items: center; position: absolute; top: calc(50% + 4px); transform: translateY(-50%); z-index: 2;
    width: 40px; height: 40px; padding: 0; border-radius: 50%; cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.18); background: rgba(8, 6, 14, 0.62); color: #FFFFFF;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    opacity: 0.82; transition: opacity 0.15s, background 0.15s;
  }
  .manset-ok.sol { left: 10px; }
  .manset-ok.sag { right: 10px; }
  .manset-sar:hover .manset-ok, .manset-ok:focus-visible { opacity: 1; }
  .manset-ok:hover { background: rgba(8, 6, 14, 0.85); }
  .manset-ok svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
  #s-genel .manset-kart { padding-left: 62px; padding-right: 62px; }
}

/* Geniş ekranda manşet basık şerit değil: haber fotoğrafı (16:9) kırpılmadan büyük görünür */
@media (min-width: 640px) {
  #s-genel .manset-kart { height: auto; aspect-ratio: 16 / 7; padding-top: 16px; padding-bottom: 16px; }
  #s-genel .manset-kart .mk-gorsel { object-position: 50% 30%; }
  #s-genel .mb-baslik { font-size: 26px; line-height: 30px; }
  #s-genel .mb-baslik.uzun { font-size: 21px; line-height: 25px; }
  #s-genel .mb-kaynak { font-size: 13px; }
}

/* Piyasa nabzı: yatay kaydırmalı üç kart, her birinde küçük çizgi grafik */
.nabiz-blok { padding: 8px 0 0; }
.nabiz {
  display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x proximity;
  scrollbar-width: none; overscroll-behavior-x: contain; padding: 0 14px;
}
.nabiz::-webkit-scrollbar { display: none; }
.nz {
  flex: 1 0 calc((100% - 16px) / 3); /* telefonda üç kart yan yana sığar */ min-width: 0; scroll-snap-align: start;
  display: grid; gap: 4px; align-content: start; padding: 8px 10px 6px; min-height: 84px;
  border-radius: 14px; border: 1px solid var(--kenar); background: var(--yuzey);
  box-shadow: inset 0 1px 0 var(--kenar), 0 10px 22px -20px rgba(0, 0, 0, 0.8);
  color: var(--yazi); text-align: left; cursor: pointer;
}
.nz.iskelet { cursor: default; }
.nz.iskelet .skel { display: block; height: 12px; margin: 6px 0; }
.nz-ust { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-width: 0; }
.nz-ad {
  font: 700 11px/16px var(--govde); color: var(--soluk); text-transform: uppercase; letter-spacing: 0.1px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
.nz .hap { font-size: 11px; padding: 1px 6px; }
.nz-fiyat {
  font: 800 19px/22px var(--bas); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.nz-spark { width: 100%; height: 22px; display: block; color: var(--yesil); }
.nz-spark.down { color: var(--kirmizi); }
.nz-spark .cizgi { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }

/* Ana ekran blokları */
.blok { padding: 6px 14px 0; }
.blok-ust { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 36px; }
.blok-ust h2 {
  font-family: var(--bas); font-weight: 800; font-size: 17px; letter-spacing: 0.5px;
  text-transform: uppercase;
}
.blok-ust a {
  min-height: 44px; display: inline-flex; align-items: center; margin-right: -6px; padding: 0 6px;
  font: 600 13px var(--govde); color: var(--vurgu); text-decoration: none; white-space: nowrap;
}
.satir-a {
  position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 8px;
  min-height: 40px; padding: 2px 0; border-top: 1px solid var(--cizgi);
  color: inherit; text-decoration: none;
}
/* Görsel satır 40 px; dokunma alanı görünmez uzantıyla 44 px'e yakın */
.satir-a::before { content: ""; position: absolute; left: 0; right: 0; top: -2px; bottom: -2px; }
.satir-a .sa { font-family: var(--bas); font-weight: 800; font-size: 15px; color: var(--vurgu); }
.satir-a .ad {
  font-size: 13.5px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.satir-a .sag { font-size: 11.5px; color: var(--soluk); white-space: nowrap; }
.satir-a .hap-k {
  font: 700 10px var(--govde); color: var(--soluk); border: 1px solid var(--cizgi2);
  border-radius: 999px; padding: 1px 6px; white-space: nowrap; max-width: 92px;
  overflow: hidden; text-overflow: ellipsis;
}
.kisayollar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 10px 14px 0; }
/* Kısayol kutusu: koyu yüzey, ince amber kenar, basınca hafif küçülme */
.kisayol {
  position: relative; display: flex; align-items: center; gap: 6px; min-height: 52px; padding: 6px 8px;
  border-radius: 14px; border: 1px solid transparent; min-width: 0;
  background:
    linear-gradient(var(--kart), var(--kart)) padding-box,
    linear-gradient(150deg, color-mix(in srgb, var(--vurgu) 75%, transparent) 0%, transparent 65%) border-box;
  box-shadow: inset 0 1px 0 var(--kenar), 0 10px 22px -18px rgba(0, 0, 0, 0.85);
  color: var(--yazi); text-decoration: none; transition: transform 0.12s ease;
}
.kisayol:active { transform: scale(0.97); }
.k-ik {
  width: 26px; height: 26px; flex: 0 0 26px; display: grid; place-items: center; border-radius: 9px;
  background: color-mix(in srgb, var(--renk, var(--vurgu)) 16%, transparent); color: var(--renk, var(--vurgu));
}
.k-ik .ic { width: 16px; height: 16px; }
.k-ik .glif { font-size: 17px; }
.k-ad {
  font: 700 12.5px/1.1 var(--govde); min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.k-say {
  position: absolute; top: -6px; right: -4px; min-width: 22px; height: 20px; padding: 0 6px;
  display: grid; place-items: center; border-radius: 999px;
  background: var(--renk, var(--vurgu)); color: #120E06; font: 800 11px/1 var(--bas);
  box-shadow: 0 0 0 2px var(--bg);
}
.yasal-satir { margin: auto 14px 0; padding-top: 6px; font-size: 11px; color: var(--soluk); text-align: center; }

/* Bayrak görseli (flagcdn) ve favicon */
.bayrak {
  width: 18px; height: 13px; flex: 0 0 18px; border-radius: 2px; object-fit: cover;
  box-shadow: 0 0 0 1px var(--kenar); vertical-align: middle; display: inline-block;
}
.chip .bayrak { margin-right: 4px; }

/* Yükleme ve veri yok durumları */
.yukleme { display: grid; gap: 6px; padding: 12px 0; min-width: 0; }
.skel {
  height: 14px; border-radius: 6px; margin: 8px 0; width: 100%;
  background: linear-gradient(90deg, var(--cizgi) 25%, var(--cizgi2) 50%, var(--cizgi) 75%);
  background-size: 200% 100%; animation: kay 1.3s linear infinite;
}
@keyframes kay { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.veri-yok, .bos-satir { font-size: 14px; color: var(--soluk); padding: 12px 0; }
.veri-yok .link { min-height: 44px; }
.bos-satir { padding: 14px 0; }

/* ---- 4. Alt sayfalar (tam ekran) ---- */
.sayfa, .ekran {
  position: fixed; inset: 0; z-index: 50;
  background-color: var(--bg); background-image: var(--zemin);
  overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
}
.ekran { z-index: 60; }
.sayfa-ic, .ekran-ic { max-width: 720px; margin: 0 auto; padding: 0 14px 40px; }
/* Başlık çubuğu yarı saydam ve bulanık: içerik altından görünür */
.sayfa-ust {
  position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 10px;
  min-height: 56px; margin: 0 -14px; padding: 6px 14px;
  background: color-mix(in srgb, var(--bg) 80%, transparent);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid var(--cizgi);
}
.sayfa-ust h2, .ekran-baslik {
  font-family: var(--bas); font-weight: 800; font-size: 24px; line-height: 28px; letter-spacing: 0.2px; margin: 0;
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sayfa-not { margin-left: auto; font-size: 11.5px; color: var(--soluk); text-align: right; white-space: nowrap; }
/* Ortak geri düğmesi (Ekonomi alt sayfaları ve ana ekran): yalnız ok, 40 px kutu, dokunma alanı 44 px */
.geri, .geri-site {
  position: relative; flex: 0 0 40px; width: 40px; height: 40px; padding: 0; margin: 0;
  display: inline-grid; place-items: center; border-radius: 12px; border: 1px solid var(--geri-kenar);
  background: var(--kart); color: var(--yazi); text-decoration: none; cursor: pointer; transition: transform .12s ease;
}
.geri::after, .geri-site::after { content: ""; position: absolute; inset: -2px; }
.geri svg, .geri-site svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.geri:active, .geri-site:active { transform: scale(.96); }
.bolum {
  font-family: var(--bas); font-weight: 800; font-size: 17px; letter-spacing: 0.5px;
  text-transform: uppercase; margin: 18px 0 6px;
}
.kart {
  background: var(--kart); border: 1px solid var(--kenar); border-radius: 16px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 12px 26px -22px rgba(0, 0, 0, 0.8);
  padding: 14px; min-width: 0; margin-top: 12px;
}
.kart-ust { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.kart-ust h3 { font-family: var(--bas); font-weight: 800; font-size: 17px; }
.tv { width: 100%; min-width: 0; }
.tv .attr { margin: 4px 0 0; font-size: 11px; color: var(--soluk); opacity: 0.8; }
.tablo-kap { padding: 0; overflow: hidden; }
.tv-kap { margin-top: 10px; }
#genel-ic { min-height: 900px; }   /* 06.11 CLS: veri gelmeden altındaki grafik bloğu ve not görünür alana yukarı çıkmaz */
.genel-grafik-kart { padding: 8px; overflow: hidden; }   /* 06.11: Genel sayfası canlı grafik */
#genel-grafik .filtre-satir { margin-bottom: 8px; }
.yedek { margin-top: 18px; }
.dosya { width: 100%; min-height: 44px; color: var(--yazi); font: 500 14px var(--govde); }
.tk-form { display: grid; gap: 12px; }
.dlg-baslik { font-size: 16px; }
.arac { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.arac input[type="search"] { flex: 1 1 200px; }
.arac .secici { width: auto; flex: 0 0 auto; }
.arac-satir { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.anahtar {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px;
  font-size: 14px; color: var(--soluk); cursor: pointer;
}
.anahtar input { width: 20px; height: 20px; min-height: 0; margin: 0; padding: 0; }
.segment { display: flex; gap: 8px; flex-wrap: wrap; }
.btn-satir { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; margin-top: 4px; }
.btn-satir.sola { justify-content: flex-start; }
.alan-satir { display: grid; gap: 12px; grid-template-columns: 1fr; margin: 6px 0; }
@media (min-width: 560px) { .alan-satir { grid-template-columns: 1fr 1fr; } }
.field { display: grid; gap: 6px; min-width: 0; }
.field label { font-size: 13px; color: var(--soluk); font-weight: 600; }
input, select {
  min-height: 44px; width: 100%; padding: 0 12px; border-radius: 12px;
  border: 1px solid var(--cizgi2); background: var(--bg); color: var(--yazi);
  font: 500 16px var(--govde);
}
input[type="search"] { -webkit-appearance: none; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; }
.chips .chip { min-height: 44px; }

/* Düğme, çip, bağlantı */
.btn {
  min-height: 44px; padding: 0 16px; border-radius: 12px;
  border: 1px solid var(--cizgi2); background: var(--kart); color: var(--yazi);
  font: 700 14px var(--govde); cursor: pointer; text-decoration: none;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  box-shadow: inset 0 1px 0 var(--kenar);
}
.btn.ana { background: linear-gradient(180deg, #FFCB5C 0%, var(--vurgu) 100%); border-color: transparent; color: var(--vurgu-yazi); }
.btn:hover { filter: brightness(1.06); }
.link {
  background: none; border: 0; color: var(--vurgu); font: 700 14px var(--govde);
  min-height: 44px; padding: 0 6px; cursor: pointer;
}
.link-satir {
  background: none; border: 0; padding: 0; color: var(--yazi); font: 700 15px var(--govde);
  text-align: left; cursor: pointer; min-height: 44px;
}
.chip {
  min-height: 44px; padding: 0 13px; border-radius: 999px;
  border: 1px solid var(--cizgi2); background: var(--kart); color: var(--orta);
  font: 600 13.5px var(--govde); cursor: pointer; white-space: nowrap;
  display: inline-flex; align-items: center;
}
.chip[aria-pressed="true"] { background: var(--vurgu); border-color: transparent; color: var(--vurgu-yazi); }
.filtre-satir { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px 0; }
.filtre-satir::-webkit-scrollbar { display: none; }
.filtre-satir .chip { flex: 0 0 auto; }
.gun-sekme { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.gun-sekme.iki { grid-template-columns: 1fr 1fr; margin: 10px 0 0; }
.gun-sekme button {
  min-height: 44px; border-radius: 12px; border: 1px solid var(--cizgi2); background: var(--kart);
  color: var(--orta); font: 700 13.5px var(--govde); cursor: pointer;
}
.gun-sekme button[aria-pressed="true"] { background: var(--vurgu); border-color: transparent; color: var(--vurgu-yazi); }
.yildiz-cip { font-family: var(--bas); font-weight: 800; font-size: 16px; letter-spacing: 1px; }

/* Dialog, bildirim */
dialog {
  width: min(520px, calc(100% - 32px)); max-height: calc(100% - 32px);
  border: 1px solid var(--kenar); border-radius: 16px;
  background: var(--kart); color: var(--yazi); padding: 18px; overflow: auto;
}
dialog::backdrop { background: rgba(0, 0, 0, 0.6); }
dialog form { display: grid; gap: 12px; }
.fiyat-buyuk { font-family: var(--bas); font-weight: 800; font-size: 28px; margin: 0; }
.fiyat-buyuk small { font: 700 14px var(--govde); margin-left: 6px; }
.btn-satir .btn { flex: 0 0 auto; }
.toast {
  position: fixed; left: 16px; right: 16px; bottom: 16px; max-width: 520px; margin: 0 auto;
  background: var(--yazi); color: var(--bg); padding: 12px 16px; border-radius: 12px;
  font-weight: 600; transform: translateY(160%); transition: transform 0.25s; z-index: 80;
}
.toast.acik { transform: none; }
@media (prefers-reduced-motion: reduce) {
  .skel, .canli-nokta, .serit, .s-oge.yan-yesil, .s-oge.yan-kirmizi { animation: none; }
  .serit-kap { overflow-x: auto; scrollbar-width: none; }
  .serit-kap::-webkit-scrollbar { display: none; }
  .toast { transition: none; }
  .kisayol { transition: none; }
}

/* ---- 5. Piyasalar ---- */
.grup-baslik {
  margin: 16px 0 2px; font: 700 11px var(--govde); letter-spacing: 0.7px;
  text-transform: uppercase; color: var(--soluk);
}
.piy-satir {
  display: grid; grid-template-columns: minmax(0, 1fr) 60px auto; gap: 10px; align-items: center;
  width: 100%; min-height: 52px; padding: 6px 0; border: 0; border-bottom: 1px solid var(--cizgi);
  background: none; text-align: left; cursor: pointer; color: var(--yazi);
}
.piy-satir .pa { min-width: 0; }
.piy-satir .pa b {
  display: block; font-size: 14px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.piy-satir .pa small { font-size: 11px; color: var(--soluk); }
.piy-satir .pf { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; white-space: nowrap; }
.piy-satir .pf b { font-family: var(--bas); font-weight: 800; font-size: 16px; }
.cizgi-svg { width: 60px; height: 24px; display: block; }
.cizgi { fill: none; stroke-width: 1.6; }
.cizgi.up { stroke: var(--yesil); }
.cizgi.down { stroke: var(--kirmizi); }
.buyuk-cizgi svg { width: 100%; height: 150px; display: block; }
.buyuk-cizgi svg .cizgi { stroke-width: 2.2; }

/* ---- 6. Takvim ---- */
.takvim-ust {
  position: sticky; top: 57px; z-index: 4;
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  padding: 0 0 6px; border-bottom: 1px solid var(--cizgi);
}
.takvim-baslik, .takvim-satir {
  display: grid; grid-template-columns: 44px minmax(0, 1fr) 46px 46px 46px; gap: 6px; align-items: center;
}
.takvim-baslik { padding-top: 6px; font-size: 10.5px; color: var(--soluk); font-weight: 600; }
.takvim-baslik span:nth-child(n + 3) { text-align: right; }
.gun-baslik { margin: 14px 0 0; font: 700 13px var(--govde); color: var(--orta); }
/* Önem çubuğu: sol kenarda 3 px renkli şerit (★★★ kırmızı-turuncu, ★★ amber, ★ gri) */
.takvim-satir {
  position: relative; padding: 8px 0 8px 12px; border-bottom: 1px solid var(--cizgi);
}
.takvim-satir::before {
  content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 3px;
  background: var(--cizgi2);
}
.takvim-satir.onem-3::before { background: linear-gradient(180deg, #FF5A4F 0%, #FF9F43 100%); }
.takvim-satir.onem-2::before { background: var(--vurgu); }
.takvim-satir.gecmis { opacity: 0.42; }
.takvim-satir .sa { font-family: var(--bas); font-weight: 800; font-size: 16px; color: var(--vurgu); }
.olay-meta {
  display: flex; gap: 6px; align-items: center; font-size: 11.5px; color: var(--soluk);
  white-space: nowrap; overflow: hidden; min-width: 0;
}
.olay-meta > span:first-child { display: inline-flex; align-items: center; gap: 5px; min-width: 0; overflow: hidden; }
.olay-ad { font-size: 13.5px; line-height: 1.3; font-weight: 600; overflow-wrap: anywhere; }
.yildiz { color: var(--vurgu); letter-spacing: 1px; font-size: 10.5px; white-space: nowrap; }
.yildiz .bos { color: var(--cizgi2); }
.dg {
  font-size: 12.5px; text-align: right; white-space: nowrap; color: var(--yazi);
}
.dg.onceki { color: var(--soluk); }
.dg.iyi { color: var(--yesil); font-weight: 700; }
.dg.kotu { color: var(--kirmizi); font-weight: 700; }
.simdi {
  display: flex; align-items: center; gap: 8px; margin: 6px 0;
  font: 700 11px var(--govde); color: var(--kirmizi);
}
.simdi::before, .simdi::after { content: ""; flex: 1; height: 1px; background: var(--kirmizi); }

/* ---- 7. Bilanço ---- */
.yasal-kart p { margin: 4px 0; font-size: 14px; }
.yasal-kart .kucuk { margin-top: 8px; }
.bil-gun { margin: 14px 0 0; font: 700 13px var(--govde); color: var(--orta); }
.bil-satir {
  display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: 8px; align-items: center;
  min-height: 56px; padding: 6px 0; border-bottom: 1px solid var(--cizgi);
}
.bil-sem { font-family: var(--bas); font-weight: 800; font-size: 17px; color: var(--vurgu); }
.bil-ad { min-width: 0; }
.bil-ad b { display: block; font-size: 14px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bil-ad small { font-size: 12px; color: var(--soluk); }
.bil-satir .sag { font-size: 12px; color: var(--soluk); white-space: nowrap; }
.kap-baglanti {
  min-height: 44px; display: inline-flex; align-items: center; padding: 0 4px;
  font: 700 13px var(--govde); color: var(--vurgu); text-decoration: none;
}

/* ---- 8. Haberler ---- */
.haber-kart {
  display: grid; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--cizgi);
  color: inherit; text-decoration: none;
}
.hk-ust { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 12px; color: var(--soluk); }
.hk-ust .sa { font-family: var(--bas); font-weight: 800; font-size: 15px; color: var(--vurgu); }
.hk-kay { display: inline-flex; align-items: center; gap: 5px; }
.hk-ust .hap { font-size: 10.5px; color: var(--orta); background: none; border: 1px solid var(--cizgi2); }
.hk-baslik { font-size: 15px; font-weight: 700; line-height: 1.3; }
.hk-ozet {
  font-size: 13px; color: var(--orta); display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.hk-metin { display: grid; gap: 4px; min-width: 0; }
/* 06.11: listede sağda küçük haber görseli (görseli olmayan kart eskisi gibi tek sütun) */
.haber-kart.gorselli { grid-template-columns: minmax(0, 1fr) 92px; column-gap: 12px; align-items: start; }
.hk-gorsel {
  width: 92px; height: 69px; object-fit: cover; border-radius: 12px; border: 1px solid var(--cizgi);
  background: var(--kart); margin-top: 2px;
}
.hk-ust .hap.dil { color: var(--vurgu); border-color: var(--vurgu); }

/* Haber ayrıntısı (site içinde): görsel, etiket, başlık, kaynak, özet, benzer haberler, en altta kaynağın tamamı */
.hab-icerik { padding-top: 8px; }
.hab-icerik .etiket-hap { display: inline-block; margin-bottom: 10px; }
.hab-gorsel {
  display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; margin: 0 0 12px;
  border-radius: 16px; border: 1px solid var(--kenar); background: var(--kart);
}
.hab-baslik {
  font-family: var(--bas); font-weight: 800; font-size: 27px; line-height: 1.1; margin: 0 0 10px;
  overflow-wrap: anywhere;
}
.hab-kaynak {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 14px;
  font: 600 13px var(--govde); color: var(--orta);
}
.hab-ozet { margin: 0; font-size: 16px; line-height: 1.55; }
.hab-benzer { padding: 4px 14px; }
.hab-benzer .satir-a:first-child { border-top: 0; }
.hab-tamam { width: 100%; margin-top: 18px; white-space: normal; text-align: center; }

/* ---- 9. Tablo (kripto, portföy, takip) ---- */
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th, .tbl td {
  padding: 10px 12px; border-bottom: 1px solid var(--cizgi);
  text-align: right; vertical-align: middle;
}
.tbl th { font-size: 12px; color: var(--soluk); font-weight: 600; }
.tbl th:first-child, .tbl td:first-child { text-align: left; }
.tbl td.bos { text-align: center; color: var(--soluk); padding: 20px; }
.tbl td.islemler { white-space: nowrap; }
.coin {
  display: flex; align-items: center; gap: 10px; background: none; border: 0;
  color: var(--yazi); cursor: pointer; padding: 0; min-height: 44px; font: inherit; text-align: left;
}
.coin img { border-radius: 50%; flex: 0 0 24px; }
.coin span { display: grid; }
.coin b { font-weight: 700; }
.coin small { color: var(--soluk); }
.harf {
  display: inline-grid; place-items: center; width: 24px; height: 24px; flex: 0 0 24px;
  border-radius: 50%; background: var(--cizgi2); font-size: 12px; font-weight: 700;
}
.grafik svg { width: 96px; height: 28px; vertical-align: middle; }
.cizgi-svg.kr { width: 96px; height: 28px; }

/* Kripto listesi: borsa tarzı tek satır (telefon), geniş ekranda tablo */
.hap-m { display: none; }
.kr-satir { cursor: pointer; }
.kr-satir:hover { background: rgba(127, 127, 127, 0.07); }
.kr-tablo td.coin-h .coin { min-height: 44px; }
@media (max-width: 639px) {
  .kr-tablo thead { display: none; }
  .kr-tablo tbody { display: block; }
  .kr-tablo tr.kr-satir {
    display: grid; grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center; column-gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--cizgi);
  }
  /* .tbl mobil kuralı (aşağıda, daha geç) td'leri flex yapıyordu: burada tr.kr-satir > td ile daha güçlü seçici */
  .kr-tablo tr.kr-satir > td { display: block; width: auto; border: 0; padding: 0; min-width: 0; text-align: left; }
  .kr-tablo tr.kr-satir > td::before { content: none; }
  .kr-tablo tr.kr-satir > td.sira { grid-column: 1; font-size: 13px; color: var(--soluk); text-align: center; }
  .kr-tablo tr.kr-satir > td.coin-h { grid-column: 2; min-width: 0; }
  .kr-tablo td.coin-h .coin { min-width: 0; }
  .kr-tablo td.coin-h .coin > span { min-width: 0; }
  .kr-tablo td.coin-h .coin b, .kr-tablo td.coin-h .coin small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .kr-tablo tr.kr-satir > td.fiyat { grid-column: 3; display: grid; justify-items: end; gap: 3px; text-align: right; white-space: nowrap; }
  .kr-tablo td.fiyat > span:first-child { font-weight: 700; }
  .kr-tablo tr.kr-satir > td.d24, .kr-tablo tr.kr-satir > td.d7, .kr-tablo tr.kr-satir > td.mcap, .kr-tablo tr.kr-satir > td.grafik { display: none; }
  .kr-tablo .hap-m { display: inline-block; }
}
@media (min-width: 640px) {
  .kr-tablo thead { display: table-header-group; }
  .kr-tablo tbody { display: table-row-group; }
  /* Masaüstü: başlık ve coin hücresi sola; fiyat, değişim ve piyasa değeri tek satır (₺ ve ▲/▼ alta düşmez) */
  .kr-tablo th.coin-h, .kr-tablo td.coin-h { text-align: left; }
  .kr-tablo td.fiyat, .kr-tablo td.d24, .kr-tablo td.d7, .kr-tablo td.mcap, .kr-tablo th { white-space: nowrap; }
}

/* Portföy */
.metrikler { display: grid; gap: 10px; grid-template-columns: 1fr; margin-bottom: 8px; }
@media (min-width: 560px) { .metrikler { grid-template-columns: repeat(3, 1fr); } }
.metrik { background: var(--bg); border-radius: 12px; padding: 12px; min-width: 0; border: 1px solid var(--kenar); }
.metrik .etiket { display: block; font-size: 12.5px; color: var(--soluk); }
.metrik .deger { display: block; font-family: var(--bas); font-size: 19px; font-weight: 800; margin-top: 4px; overflow-wrap: anywhere; }
.metrik small { font-family: var(--govde); font-size: 13px; }
.iki { display: grid; gap: 12px; grid-template-columns: 1fr; margin-top: 4px; }
@media (min-width: 1024px) { .iki { grid-template-columns: 1fr 1fr; } }
.halka-satir { display: grid; gap: 12px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 560px) { .halka-satir { grid-template-columns: 200px 1fr; } }
.halka { width: 100%; max-width: 200px; height: auto; }
.halka-yazi { font: 800 14px var(--bas); fill: var(--yazi); }
.lejant { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lejant li { display: grid; grid-template-columns: 12px 1fr auto; gap: 8px; align-items: center; font-size: 14px; }
.renk { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.takip-satir { padding: 12px 0; border-bottom: 1px solid var(--cizgi); display: grid; gap: 8px; }
.takip-satir:last-child { border-bottom: 0; }
.takip-ust { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.takip-ust .link-satir { flex: 1 1 150px; }
.takip-fiyat { font-weight: 700; }
.alarm { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 14px; color: var(--soluk); }
.alarm-form { display: grid; gap: 8px; grid-template-columns: 1fr; }
@media (min-width: 560px) { .alarm-form { grid-template-columns: 1fr 1fr auto; align-items: end; } }
@media (max-width: 639px) {
  .tbl thead { display: none; }
  .tbl, .tbl tbody, .tbl tr, .tbl td { display: block; width: 100%; }
  .tbl tr { padding: 10px 12px; border-bottom: 1px solid var(--cizgi); }
  .tbl tr:last-child { border-bottom: 0; }
  .tbl td {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    border: 0; padding: 3px 0; text-align: right; min-height: 0;
  }
  .tbl td::before { content: attr(data-label); color: var(--soluk); font-size: 12.5px; text-align: left; flex: 0 0 auto; }
  .tbl td[data-label="Varlık"]::before, .tbl td.islemler::before { display: none; }
  .tbl td.islemler { justify-content: flex-start; }
  .tbl td.bos { display: block; }
  .tbl td.bos::before { display: none; }
  .tbl td:first-child { text-align: right; }
}

/* TradingView çerçeveleri: sayfa koyu şemadayken çerçeve beyaz zemin boyamasın (şema eşleşmezse tarayıcı opak zemin çizer) */
.tradingview-widget-container iframe { color-scheme: var(--sema); background: transparent; }

/* Piyasa nabzı: üç kart yan yana sığınca ad ile yüzde hapı aynı satıra sığmıyor → ad üstte, hap altında */
.nz .nz-ust { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }

/* Canlı içinde gömülü (?gomulu=1): siteye dön oku gizli, sayfa iframe genişliğinde yayılır (alt sayfaların geri düğmeleri kalır) */
html[data-gomulu="1"] .geri-site { display: none; }
html[data-gomulu="1"] #icerik, html[data-gomulu="1"] .sayfa-ic, html[data-gomulu="1"] .ekran-ic { max-width: none; }

/* Siteye dönüş oku (ana sayfa): görünüm .geri ile aynı (bkz. "Ortak geri düğmesi") */

/* =====================================================================
   TASLAK 28.10 — Türkiye · Dünya · Kripto bölümleri, Tribün'deki gibi üst sekmeler
   Eski alttaki Piyasalar · Takvim · Bilanço · Kripto · Portföy · Takip menüsü kalktı; sekmeler yukarıda.
   ===================================================================== */
/* Üst başlık: telefonda iki satır (geri · EKONOMİ · ara / bölüm seçici), geniş ekranda tek satır */
.kabuk .ust { padding: 8px 14px 6px; }
.kabuk .ust-satir { flex-wrap: wrap; row-gap: 8px; }
.kabuk .logo { order: 1; }
.kabuk .geri-site { order: 0; }
.kabuk .ust-araclar { order: 2; margin-left: auto; align-items: center; }
.kabuk .ust-araclar .canli { display: none; }
.kabuk .anahtar-kap { order: 3; flex: 1 0 100%; border-radius: 12px; padding: 3px; gap: 3px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.kabuk .anahtar-kap::-webkit-scrollbar { display: none; }
.kabuk .anahtar-dugme { flex: 1 0 88px; padding-inline: 8px; }
.kabuk .anahtar-dugme { min-height: 40px; border-radius: 9px; font: 700 13.5px var(--govde); }
.kabuk .anahtar-dugme[aria-pressed="true"] { background: var(--vurgu); box-shadow: none; }
@media (min-width: 640px) {
  .kabuk .ust-araclar .canli { display: inline-flex; }
  .kabuk .anahtar-kap { order: 1; flex: 0 0 320px; margin-left: 6px; }
  .kabuk .ust-araclar { order: 2; }
}

/* Sekmeler: Tribün'deki gibi altı çizgili; yapışkan, yatay kayabilir */
.sekmeler {
  min-height: 47px;   /* 06.11 CLS: sekmeler JS ile dolmadan yer ayrılır */
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 30;
  display: flex; overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y;
  padding: 0 4px; border-bottom: 1px solid var(--cizgi);
  background: color-mix(in srgb, var(--bg) 90%, transparent);
  -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%);
}
.sekmeler::-webkit-scrollbar { display: none; }
.sekme {
  flex: 1 0 auto; min-height: 46px; padding: 0 6px; border: 0; border-bottom: 3px solid transparent;
  background: none; color: var(--soluk); font: 600 13px var(--govde); white-space: nowrap; cursor: pointer;
}
.sekme[aria-selected="true"] { color: var(--yazi); font-weight: 800; border-bottom-color: var(--vurgu); }
@media (min-width: 640px) { .sekme { font-size: 14.5px; padding: 0 14px; } }

/* Sayfalar artık tam ekran değil: kabuğun altında akar, sayfa kayar */
.sayfa, .ekran.sayfa { position: static; inset: auto; z-index: auto; overflow: visible; background: none; }
.sayfa-ic { padding: 4px 14px calc(104px + env(safe-area-inset-bottom, 0px)); }  /* 28.10 (iPhone): liste sonu alt çubuğun/ev çizgisinin arkasında kalmasın */
.sayfa-ust { display: none; }
/* 04.11 (E-01): sembol ayrıntısı hâlâ tam ekran katman; yukarıdaki kural onun başlığını ve Kapat düğmesini de gizliyordu
   (yükseklik 0) → telefonda katmandan çıkılamıyor, altındaki Türkiye/Kripto düğmelerine basılamıyordu. Bu başlık hep görünür. */
#sem-eylem .takip-durum { align-self: center; font: 700 14px var(--govde); color: var(--yesil); }
#sem-eylem .takip-durum[hidden] { display: none; }
#sembol-ekrani .sayfa-ust { display: flex; top: 0; padding-top: calc(6px + env(safe-area-inset-top, 0px)); }
#s-haber .sayfa-ust {
  display: flex; position: sticky; top: calc(47px + env(safe-area-inset-top, 0px)); z-index: 5;
}
.takvim-ust { top: calc(47px + env(safe-area-inset-top, 0px)); }
.sayfa .blok { padding: 6px 0 0; }
#s-genel .manset-slayt { padding: 0; }
.durum-satir { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 0 2px; }
.durum-satir .canli { margin: 0; }

/* Genel sayfası blokları */
.izgara { display: grid; gap: 8px; }
.izgara.iki { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.izgara.uc { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.izgara.endeks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 600px) { .izgara.endeks { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 350px) { .izgara.uc { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.izgara .nz { flex: none; }
.nz-alt { font: 500 10.5px/14px var(--govde); color: var(--soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mini {
  display: grid; gap: 4px; align-content: start; justify-items: start; min-width: 0; min-height: 76px; padding: 8px 10px;
  border-radius: 14px; border: 1px solid var(--kenar); background: var(--yuzey); color: var(--yazi); text-align: left; cursor: pointer;
  box-shadow: inset 0 1px 0 var(--kenar);
}
.mini-ad {
  display: flex; align-items: center; gap: 5px; max-width: 100%;
  font: 700 11px/16px var(--govde); color: var(--soluk); text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mini-ad img { width: 16px; height: 16px; border-radius: 50%; flex: 0 0 16px; }
.mini b { max-width: 100%; font: 800 16px/20px var(--bas); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.mini .hap { font-size: 11px; padding: 1px 6px; }
.kart.hareket { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 10px 12px 6px; margin-top: 0; }
.hr-baslik { margin: 0 0 2px; font: 700 12px var(--govde); letter-spacing: 0.3px; }
.hr-baslik.up { color: var(--yesil); }
.hr-baslik.down { color: var(--kirmizi); }
.hr-kol { min-width: 0; }
.hr-satir {
  display: flex; align-items: center; gap: 6px; width: 100%; min-height: 46px; padding: 4px 0;
  border: 0; border-top: 1px solid var(--cizgi); background: none; color: var(--yazi); text-align: left; cursor: pointer;
}
.hr-ad { flex: 1 1 auto; min-width: 0; }
.hr-ad b { display: block; font: 700 13.5px/1.2 var(--govde); }
.hr-ad small { display: block; font-size: 11px; color: var(--soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hr-fi { display: none; font: 800 16px var(--bas); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hr-satir .hap { flex: 0 0 auto; }
.hr-satir.tam { min-height: 52px; border-top: 0; border-bottom: 1px solid var(--cizgi); gap: 10px; }
.hr-satir.tam .hr-fi { display: block; }
.satir-a.s60 { grid-template-columns: 62px minmax(0, 1fr) auto; }
.satir-a.s60 .sa { font-size: 14px; }
.sayfa .yasal-satir { margin: 18px 0 0; }

/* Geniş ekran (bilgisayarda uygulama içinde): Genel blokları iki sütun */
@media (min-width: 900px) {
  #genel-ic { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; align-items: start; }
  #genel-ic > .blok:first-child, #genel-ic > .not { grid-column: 1 / -1; }
  .sayfa-ic { padding-top: 10px; }
}
.toast:not(.acik) { visibility: hidden; opacity: 0; }


/* =====================================================================
   DÜZELTMELER 03.11 (denetim): yatay genişlik, çizgi grafik, süzgeçler, portföy, dokunma alanları
   ===================================================================== */

/* 10. Telefonda üst başlık ekranın büyük kısmını yiyordu: fiyat şeridi yalnız Genel sayfasında görünür (html[data-sayfa], ekonomi.js yonlendir).
   Şerit yerinde kalır (görünmez, 0 yükseklik): genişliği ölçülüp kayma süresi doğru hesaplanır. */
@media (max-width: 639px) {
  html[data-sayfa]:not([data-sayfa="genel"]) .serit-kap { max-height: 0; border-block-width: 0; visibility: hidden; }
}

/* 15. "Borsa kapalı" rozeti iki kez görünüyordu: ≥640 px'te üst başlıktaki var, Genel sayfasındaki satır yalnız "Güncel" saatini taşır */
@media (min-width: 640px) {
  .durum-satir .canli { display: none; }
  .durum-satir { justify-content: flex-end; }
}

/* 11. Takvim süzgeçleri: ülke düğmeleri ve yıldız hapları aynı satırda; yıldızlar tek sıra, küçük */
.filtre-kap { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.filtre-kap #tk-ulke-satir { flex: 1 1 auto; min-width: 0; }
.filtre-kap .yildiz-grup { flex: 0 0 auto; overflow: visible; gap: 5px; padding-left: 8px; border-left: 1px solid var(--cizgi2); }
.yildiz-cip { position: relative; min-height: 32px; min-width: 44px; justify-content: center; padding: 0 9px; font-size: 13px; letter-spacing: 0.5px; }
.yildiz-cip::after { content: ""; position: absolute; inset: -6px -1px; }   /* görünen hap 32 px, dokunma alanı 44 px */

/* 16. Küçük bağlantılar: görünür boyut aynı, dokunma alanı en az 44 px yükseklik */
.karar .kucuk a, .yasal-kart .kucuk a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
.kap-baglanti { min-width: 44px; justify-content: center; }

/* 14. Portföy: boşken tek kart; dosya seçici site stilinde düğme */
.ilk-varlik { text-align: center; padding: 22px 16px; }
.ilk-varlik h3 { font-family: var(--bas); font-weight: 800; font-size: 22px; }
.ilk-varlik p { max-width: 38ch; margin: 8px auto 14px; }
.dosya-dugme { position: relative; cursor: pointer; }
.dosya-dugme:focus-within { outline: 2px solid var(--vurgu); outline-offset: 2px; }

/* 2. Hisse / endeks çizgi grafiği (BIST'te TradingView yok): dönem düğmeleri, fiyat ve zaman ekseni, son fiyat, dokununca değer */
.gecmis { padding: 12px 12px 8px; }
.gecmis .gun-sekme { margin-top: 0; }
.gecmis-ozet { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-height: 28px; margin: 10px 2px 4px; font: 600 13px var(--govde); color: var(--orta); }
.gecmis-ozet b { font: 800 17px var(--bas); color: var(--yazi); font-variant-numeric: tabular-nums; }
.gecmis-govde { min-width: 0; }
.gecmis-svg { display: block; width: 100%; height: auto; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.gecmis-svg.up { color: var(--yesil); }
.gecmis-svg.down { color: var(--kirmizi); }
.gecmis-svg text { font: 600 10.5px var(--govde); fill: var(--soluk); font-variant-numeric: tabular-nums; }
.gecmis-svg .izgara { stroke: var(--cizgi); stroke-width: 1; }
.gecmis-svg .onceki { stroke: var(--soluk); stroke-width: 1; stroke-dasharray: 4 4; opacity: 0.8; }
.gecmis-svg .yol { fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.gecmis-svg .son-cizgi { stroke: currentColor; stroke-width: 1; stroke-dasharray: 2 3; opacity: 0.55; }
.gecmis-svg .son-etiket rect { fill: currentColor; }
.gecmis-svg .son-etiket text { fill: #FFFFFF; font-weight: 800; }
.gecmis-svg .imlec { display: none; }
.gecmis-svg .imlec.acik { display: inline; }
.gecmis-svg .imlec line { stroke: var(--soluk); stroke-width: 1; }
.gecmis-svg .imlec circle { fill: currentColor; stroke: var(--kart); stroke-width: 2; }
/* 06.11: mum grafiği, tür düğmesi, 6 dönem */
.gecmis-sekme { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; }
.gecmis-sekme button { font-size: 12.5px; padding: 0 2px; }
.gecmis-tur { display: flex; gap: 6px; margin: 10px 0 0; }
.gecmis-tur .chip { min-height: 36px; padding: 0 14px; font-size: 13px; }
.gecmis-svg .mum.up { color: var(--yesil); }
.gecmis-svg .mum.down { color: var(--kirmizi); }
.gecmis-svg .mum line { stroke: currentColor; stroke-width: 1.2; }
.gecmis-svg .mum rect { fill: currentColor; stroke: none; }
.gecmis-svg .mum rect.hacim { opacity: 0.28; }
.mum-ohlc { font-size: 12px; font-variant-numeric: tabular-nums; }
.gecmis-not { margin: 4px 2px 0; }

/* 9. Masaüstü (≥ 1100 px): içerik 720 px şerit yerine en çok 1080 px; Genel'de manşet ile piyasa yan yana, haber listesi iki sütun.
   Manşet görseli (kaynaktan 640 px) büyütülüp bulanmaz: manşet sütunu en çok 640 px. */
@media (min-width: 640px) {
  #s-genel section[aria-label="Manşet"] { width: 100%; max-width: 640px; margin-inline: auto; }
}
@media (min-width: 1100px) {
  #icerik, .sayfa-ic, .ekran-ic { max-width: 1080px; }
  #s-genel .sayfa-ic { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; align-items: start; }
  #s-genel .sayfa-ic > #genel-yasal-ust, #s-genel .sayfa-ic > .yasal-satir, #s-genel .sayfa-ic > #genel-grafik, #genel-ic > .not { grid-column: 1 / -1; }
  #s-genel section[aria-label="Manşet"] { margin-inline: 0; }
  #genel-ic { display: contents; }
  #genel-ic > .blok:first-child { grid-column: auto; }
  #genel-ic > .blok:first-child .izgara.iki { grid-template-columns: 1fr; }   /* manşetin yanında iki endeks kartı alt alta */
  #hb-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; align-items: start; }
  #hb-liste > :not(.haber-kart) { grid-column: 1 / -1; }
}
/* Canlı içinde gömülü (?gomulu=1): eskiden sınırsızdı; aynı en çok 1080 px */
html[data-gomulu="1"] #icerik, html[data-gomulu="1"] .sayfa-ic, html[data-gomulu="1"] .ekran-ic { max-width: 1080px; }

/* 06.11 (hız / LCP): Genel sayfasında ilk bloktan sonrakiler ekran dışındayken yerleşim ve boyama atlanır (yavaş telefonda ilk çizim hızlanır) */
#genel-ic > .blok:not(:first-child), #genel-grafik { content-visibility: auto; contain-intrinsic-size: auto 340px; }

/* 1.7.3 (Onur 11.11): uygulamada alt çubuk (Astroloji'deki gibi sayfanın kendi alt menüsü); üstteki sekme satırı gizli */
html.uyg-alt .sekmeler { display: none; }
.alt-cubuk { position: fixed; left: 10px; right: 10px; bottom: calc(env(safe-area-inset-bottom, 0px) + 10px); z-index: 60; display: flex; align-items: center; justify-content: space-around; height: 66px; padding: 0 4px; border-radius: 33px; border: 1px solid var(--cizgi2); background: color-mix(in srgb, var(--kart) 94%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 -10px 30px rgba(0, 0, 0, .35); }
.alt-oge { flex: 1; height: 54px; margin: 0 2px; border: 0; border-radius: 27px; background: none; color: var(--soluk); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font: 600 11.5px var(--govde); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.alt-oge svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.alt-oge[aria-selected="true"] { color: var(--vurgu); background: color-mix(in srgb, var(--vurgu) 14%, transparent); font-weight: 800; }
.piyasa-cip { display: flex; gap: 8px; padding: 6px 0 10px; }
.cip { flex: 0 0 auto; min-height: 34px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--cizgi2); background: var(--kart); color: var(--soluk); font: 600 13px var(--govde); cursor: pointer; }
.cip[aria-selected="true"] { color: var(--vurgu-yazi, #1B1305); background: var(--vurgu); border-color: var(--vurgu); font-weight: 800; }