/* ==========================================================================
   EFES AKTUEL - MOBIL UYGULAMA ARAYUZU
   Yalnizca <=767px'te devreye girer. Masaustu duzeni (Sabah yerlesimi)
   hic etkilenmez. Uygulama hissi: app bar + alt tab bar + story manseti.
   ========================================================================== */

@media (max-width: 767px) {

  :root{
    --app-bar:      56px;
    --tab-bar:      62px;
    --alt-guvenli:  env(safe-area-inset-bottom, 0px);
    --ust-guvenli:  env(safe-area-inset-top, 0px);
    --yumusak:      cubic-bezier(.22,.61,.36,1);
  }

  html{ scroll-behavior:smooth }
  body{
    background:#eef1f5;
    padding-bottom:calc(var(--tab-bar) + var(--alt-guvenli) + 8px);
    overscroll-behavior-y:contain;
    -webkit-tap-highlight-color:transparent;
  }

  /* Masaustu baslik parcalarini gizle - yerine app bar gelecek */
  .topnav, .brandbar, .citystrip, .tickerbar, .sticky-spacer{ display:none !important }

  /* ==================================================== APP BAR (ust) === */
  .m-appbar{
    position:fixed; top:0; left:0; right:0; z-index:120;
    height:calc(var(--app-bar) + var(--ust-guvenli));
    padding-top:var(--ust-guvenli);
    background:rgba(1,18,42,.94);
    -webkit-backdrop-filter:saturate(180%) blur(14px);
    backdrop-filter:saturate(180%) blur(14px);
    display:flex; align-items:center; gap:10px; padding-inline:14px;
    transition:box-shadow .25s;   /* SABIT: kaydirmada gizlenmez */
  }
  .m-appbar.golgeli{ box-shadow:0 4px 18px rgba(0,0,0,.28) }

  .m-logo{ display:flex; align-items:baseline; gap:3px; font-family:var(--font-head); flex:1; min-width:0 }
  .m-logo b{ font-size:21px; font-weight:800; color:#ff4747; letter-spacing:-.6px; line-height:1 }
  .m-logo span{ font-size:21px; font-weight:300; color:#fff; letter-spacing:-.6px; line-height:1 }

  .m-abtn{
    width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
    color:#fff; background:rgba(255,255,255,.10); flex:none; position:relative;
    transition:transform .16s var(--yumusak), background .16s;
  }
  .m-abtn:active{ transform:scale(.88); background:rgba(255,255,255,.2) }
  .m-abtn .nokta{
    position:absolute; top:8px; right:9px; width:7px; height:7px; border-radius:50%;
    background:var(--red); box-shadow:0 0 0 2px rgba(1,18,42,.95);
    animation:blink 1.6s infinite;
  }

  /* Sayfa govdesi app bar altindan baslasin */
  main, #ea-home, #ea-cat, #ea-etkinlik, #ea-article, #ea-kunye{
    padding-top:0;
  }
  body{ padding-top:calc(var(--app-bar) + var(--ust-guvenli)) }

  /* ============================================ KATEGORI CIPLERI (story) = */
  .m-chips{
    position:sticky; top:calc(var(--app-bar) + var(--ust-guvenli)); z-index:100;
    background:#fff; border-bottom:1px solid var(--gray-line);
    display:flex; gap:8px; overflow-x:auto; padding:10px 14px;
    scrollbar-width:none; -ms-overflow-style:none;
    scroll-snap-type:x proximity;
    /* .container icinde dogsa bile kenardan kenara yayilsin */
    margin-left:-14px; margin-right:-14px; width:calc(100% + 28px);
  }
  .m-chips::-webkit-scrollbar{ display:none }
  .m-chip{
    flex:none; scroll-snap-align:start;
    padding:7px 14px; border-radius:100px; font-family:var(--font-head);
    font-weight:700; font-size:12.5px; letter-spacing:.3px;
    background:var(--gray-bg); color:var(--navy); white-space:nowrap;
    border:1px solid transparent; transition:transform .16s var(--yumusak);
  }
  .m-chip:active{ transform:scale(.93) }
  .m-chip.canli{
    background:var(--red); color:#fff;
    display:inline-flex; align-items:center; gap:6px;
  }
  .m-chip.canli i{
    width:6px; height:6px; border-radius:50%; background:#fff;
    animation:blink 1.2s infinite; font-style:normal;
  }
  .m-chip.aktif{ background:var(--navy); color:#fff }

  /* ==================================== MANSET: story tarzi tam ekran kart */
  .mansetSlider{
    background:transparent; box-shadow:none;
    /* tam ekran genislik (container dolgusunu asar) */
    margin:0 -14px 14px; width:calc(100% + 28px);
  }
  .ms-track{ min-height:0; position:relative }

  .ms-track .ms-slide.active{
    display:block; position:relative; height:84vw; max-height:440px; min-height:310px;
    overflow:hidden; border-radius:0;
  }
  .ms-slide .g-img{
    position:absolute; inset:0; flex:none; aspect-ratio:auto; width:100%; height:100%;
  }
  .ms-slide .g-img::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg,
      rgba(1,18,42,.55) 0%, rgba(1,18,42,0) 34%,
      rgba(1,18,42,.72) 72%, rgba(1,18,42,.94) 100%);
  }
  .ms-slide .g-img img{ width:100%; height:100%; object-fit:cover }
  .ms-slide .g-txt{
    position:absolute; left:0; right:0; bottom:0; z-index:2;
    padding:0 18px 22px; justify-content:flex-end;
    /* masaustundeki %56'lik sol panel mobilde tam genislige donsun */
    width:100%; min-height:0; display:flex;
  }
  .ms-slide .flag{
    background:var(--red); font-size:10.5px; padding:4px 9px; margin-bottom:9px;
    border-radius:3px; box-shadow:0 2px 10px rgba(225,40,40,.45);
  }
  .ms-slide h2{
    color:#fff; font-size:22px; line-height:1.24;
    text-shadow:0 2px 14px rgba(0,0,0,.5);
  }
  .ms-slide .spot{ display:none }
  .ms-slide .meta{ color:rgba(255,255,255,.82); margin-top:9px }
  .ms-slide .meta .cat{ color:#ff8080 }

  /* Story ilerleme cubuklari (ustte) */
  .ms-nav{
    position:absolute; top:10px; left:0; right:0; z-index:5;
    background:transparent; height:auto; padding:0 14px; gap:4px;
  }
  .ms-arrow{ display:none }
  .ms-bar{ display:none }
  .ms-nums{ gap:4px; height:auto; overflow:visible }
  .ms-num{
    flex:1; min-width:0; height:3px; padding:0; border-radius:3px;
    background:rgba(255,255,255,.32); color:transparent; font-size:0;
    line-height:0; position:relative; overflow:hidden;
  }
  .ms-num.active{ background:rgba(255,255,255,.32) }
  .ms-num.active::after{
    content:""; position:absolute; inset:0; background:#fff; border-radius:3px;
    transform-origin:left; animation:msDolu 6s linear forwards;
  }
  .ms-num.gecti{ background:#fff }
  @keyframes msDolu{ from{transform:scaleX(0)} to{transform:scaleX(1)} }

  /* ================================================== BOLUM BASLIKLARI == */
  .sechead{
    background:transparent; box-shadow:none; height:auto; padding:18px 14px 10px;
    margin:0; gap:10px;
  }
  .sechead::before{ display:none }
  .sechead h2{
    font-size:17px; color:var(--navy); position:relative; padding-left:12px;
  }
  .sechead h2::before{
    content:""; position:absolute; left:0; top:3px; bottom:3px; width:4px;
    background:var(--red); border-radius:3px;
  }
  .sechead.blue h2::before{ background:var(--blue) }
  .sechead.orange h2::before{ background:var(--orange) }
  .sechead.green h2::before{ background:var(--green) }
  .sechead .more{ font-size:12px; color:var(--red) }
  .sechead .tabs{ display:none }

  /* ==================================================== KART TASARIMI === */
  .card, .listbox, .writers, .ek-home, .official, .newsletter, .livebox{
    border-radius:14px; box-shadow:0 2px 14px rgba(16,32,56,.07);
  }
  .card{ transition:transform .18s var(--yumusak) }
  .card:active{ transform:scale(.975) }
  .card h3{ font-size:15px; line-height:1.3 }
  .card .body{ padding:12px 14px 15px }

  .container{ padding:0 14px }
  .row{ margin:0 }
  .col{ padding:0 }

  /* Yatay kaydirilan seritler (uygulama hissi) */
  .quad, .fiveflex{
    display:flex; gap:12px; overflow-x:auto; padding:2px 14px 14px;
    margin:0 -14px; scroll-snap-type:x mandatory; scrollbar-width:none;
  }
  .quad::-webkit-scrollbar, .fiveflex::-webkit-scrollbar{ display:none }
  .quad > .card{ flex:0 0 74%; scroll-snap-align:center }
  .fiveflex > .card{ flex:0 0 44%; scroll-snap-align:center }
  .quad .card .thumb{ aspect-ratio:16/10 }
  .fiveflex .card .thumb{ aspect-ratio:1/1 }
  .fiveflex .card h3{ font-size:13px }

  .subboard{ flex-direction:column; gap:10px; margin-bottom:14px }
  .sb-item{ border-radius:12px; box-shadow:0 2px 12px rgba(16,32,56,.07); padding:10px }
  .sb-item img{ width:88px; height:66px; border-radius:8px }
  .sb-item:active{ transform:scale(.98) }

  .mainlead{ border-radius:14px; box-shadow:0 2px 14px rgba(16,32,56,.07); overflow:hidden }
  .mainlead h2{ font-size:19px }
  .leadgrid{ grid-template-columns:1fr; gap:12px }

  /* ============================================ SON DAKIKA: yatay serit == */
  .livebox{
    height:auto !important; max-height:none !important; margin-bottom:14px;
    overflow:hidden;
  }
  .lb-head{ border-radius:14px 14px 0 0; padding:12px 14px }
  .lb-list{
    display:flex; overflow-x:auto; gap:0; scroll-snap-type:x mandatory;
    scrollbar-width:none; max-height:none;
  }
  .lb-list::-webkit-scrollbar{ display:none }
  .lb-item{
    flex:0 0 78%; scroll-snap-align:start; flex-direction:column; gap:6px;
    border-bottom:0; border-right:1px solid var(--gray-line); padding:14px;
  }
  .lb-item time{ width:auto; font-size:13px }
  .lb-item span{ font-size:13.5px; line-height:1.4 }
  .lb-foot{ border-radius:0 0 14px 14px }

  /* ================================================ ETKINLIK BOLUMU ===== */
  .ek-home{ padding:14px; margin:0 0 14px }
  .ek-mini-cats{ margin:0 -14px 14px; padding:0 14px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none }
  .ek-mini-cats::-webkit-scrollbar{ display:none }
  .ek-mini-cat{ flex:none; border-radius:100px }
  .ek-home-grid{ grid-template-columns:1fr; gap:10px }
  .ek-home-card{ border-radius:12px; transition:transform .16s var(--yumusak) }
  .ek-home-card:active{ transform:scale(.98) }

  .ek-hero{ padding:22px 0 20px }
  .ek-hero h1{ font-size:23px }
  .ek-cats{ margin:0 -14px; padding:14px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none }
  .ek-cats::-webkit-scrollbar{ display:none }
  .ek-cat{ flex:none; border-radius:100px; border-left-width:5px }
  .ek-card{ border-radius:14px }
  .ek-filters{ border-radius:14px }

  /* ===================================================== YAZARLAR ======= */
  .writers{ padding:14px; margin-bottom:14px }
  .writers-grid{
    display:flex; gap:16px; overflow-x:auto; margin:0 -14px; padding:0 14px;
    scrollbar-width:none;
  }
  .writers-grid::-webkit-scrollbar{ display:none }
  .writer{ flex:0 0 84px }
  .writer img{ width:64px; height:64px; border:2px solid var(--red); padding:2px }
  .writer b{ font-size:11.5px }
  .writer span{ font-size:11px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }

  /* ======================================================== VIDEO ======= */
  .videosec{ border-radius:0; margin-bottom:14px; padding:6px 0 18px }
  .vgrid{
    display:flex; gap:12px; overflow-x:auto; padding:0 14px;
    scroll-snap-type:x mandatory; scrollbar-width:none;
  }
  .vgrid::-webkit-scrollbar{ display:none }
  .vcard{ flex:0 0 76%; scroll-snap-align:center; border-radius:12px; overflow:hidden }

  /* ======================================================= HABER ======== */
  .article{ border-radius:14px; padding:18px 16px 24px }
  .article h1{ font-size:23px }
  .article .lede{ font-size:15px }
  .article-body{ font-size:16px; line-height:1.8 }
  .breadcrumb{ padding:12px 0 8px; font-size:11.5px }
  .share{ margin-left:0; width:100%; margin-top:8px }
  .share a{ flex:1; height:36px; border-radius:8px }


  /* ------------------------------------------- 2'li kategori izgarasi */
  .katgrid{
    display:flex; gap:12px; overflow-x:auto; padding:2px 14px 14px;
    margin:0 -14px; scroll-snap-type:x mandatory; scrollbar-width:none;
  }
  .katgrid::-webkit-scrollbar{ display:none }
  .katgrid > .card{ flex:0 0 74%; scroll-snap-align:center }

  /* ------------------------------------------------------- REKLAM ---- */
  /* Mobilde reklam UZAMAZ: 600px'lik kreatif gizlenir, yerine tek satirlik
     sade serit gelir. Uygulama hissini bozan uzun blok istemiyoruz. */
  .reklam{ border-radius:14px; margin-bottom:14px; padding:8px }
  .rk-etiket{ margin-bottom:6px; font-size:9px }
  .nm-gorsel{ display:none }
  .nm-mini{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    background:linear-gradient(115deg,#0a0a0a 0%,#14300d 55%,#2f6d0a 100%);
    border-radius:10px; padding:13px 14px; line-height:1.25;
    transition:transform .16s var(--yumusak);
  }
  .nm-banner:active .nm-mini{ transform:scale(.98) }
  .nm-mini-sol{
    display:flex; flex-direction:column; gap:3px; min-width:0;
  }
  .nm-mini-sol b{
    font-family:var(--font-head); font-size:19px; font-weight:800; color:#fff;
    letter-spacing:.5px; line-height:1;
  }
  .nm-mini-sol i{
    font-style:normal; font-size:9.5px; font-weight:700; letter-spacing:1.4px;
    color:rgba(255,255,255,.55); font-family:var(--font-head);
  }
  .nm-mini-cta{
    flex:none; background:#8ee06a; color:#0a1a05; border-radius:7px;
    font-family:var(--font-head); font-weight:800; font-size:11px;
    letter-spacing:.4px; padding:8px 12px; white-space:nowrap;
  }

  /* ------------------------------------- haber ana gorseli mobilde */
  .article figure img{ aspect-ratio:16/10 }

  /* ================================================== ALT TAB BAR ======= */
  .m-tabbar{
    position:fixed; left:0; right:0; bottom:0; z-index:130;
    height:calc(var(--tab-bar) + var(--alt-guvenli));
    padding-bottom:var(--alt-guvenli);
    background:rgba(255,255,255,.93);
    -webkit-backdrop-filter:saturate(180%) blur(18px);
    backdrop-filter:saturate(180%) blur(18px);
    border-top:1px solid rgba(0,0,0,.07);
    display:flex; align-items:stretch;
    box-shadow:0 -2px 18px rgba(16,32,56,.08);
  }
  .m-tab{
    flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:3px; color:#8a95a3; position:relative;
    transition:color .2s, transform .16s var(--yumusak);
  }
  .m-tab:active{ transform:scale(.9) }
  .m-tab svg{ width:22px; height:22px; transition:transform .22s var(--yumusak) }
  .m-tab span{
    font-family:var(--font-head); font-weight:700; font-size:10px; letter-spacing:.2px;
  }
  .m-tab.aktif{ color:var(--red) }
  .m-tab.aktif svg{ transform:translateY(-1px) scale(1.08) }
  .m-tab.aktif::before{
    content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
    width:26px; height:3px; background:var(--red); border-radius:0 0 3px 3px;
  }
  .m-tab .rozet{
    position:absolute; top:7px; left:calc(50% + 6px);
    min-width:16px; height:16px; padding:0 4px; border-radius:9px;
    background:var(--red); color:#fff; font-size:9.5px; font-weight:700;
    display:grid; place-items:center; box-shadow:0 0 0 2px #fff;
  }

  /* ============================================== TAM EKRAN MENU ======== */
  .m-menu{
    position:fixed; inset:0; z-index:220; background:var(--navy);
    display:flex; flex-direction:column;
    transform:translateX(100%); transition:transform .32s var(--yumusak);
    padding-top:var(--ust-guvenli);
  }
  .m-menu.acik{ transform:none }
  body.m-kilit{ overflow:hidden }

  .mm-ust{
    flex:none; height:var(--app-bar); display:flex; align-items:center;
    justify-content:space-between; padding:0 16px;
    border-bottom:1px solid rgba(255,255,255,.10);
  }
  .mm-ust .m-logo{ flex:none }
  .mm-kapat{
    width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
    color:#fff; background:rgba(255,255,255,.10);
    transition:transform .16s var(--yumusak);
  }
  .mm-kapat:active{ transform:scale(.88) }

  .mm-govde{
    flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch;
    padding:18px 16px calc(28px + var(--alt-guvenli));
  }

  .mm-ara{
    width:100%; display:flex; align-items:center; gap:10px;
    background:rgba(255,255,255,.09); border-radius:12px; padding:13px 15px;
    color:rgba(255,255,255,.55); font-size:13.5px; text-align:left;
    transition:background .16s;
  }
  .mm-ara:active{ background:rgba(255,255,255,.16) }

  .mm-baslik{
    font-family:var(--font-head); font-size:12px; font-weight:700; letter-spacing:2px;
    color:rgba(255,255,255,.42); text-transform:uppercase;
    margin:26px 0 12px; display:flex; align-items:baseline; gap:8px;
  }
  .mm-baslik small{ font-size:11px; letter-spacing:.4px; opacity:.7; font-weight:400 }

  /* Kategoriler: ikonlu kutu grid */
  .mm-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px }
  .mm-kutu{
    background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.07);
    border-radius:14px; padding:16px 8px; text-align:center; color:#fff;
    display:flex; flex-direction:column; align-items:center; gap:7px;
    transition:transform .16s var(--yumusak), background .16s;
  }
  .mm-kutu:active{ transform:scale(.94); background:rgba(255,255,255,.15) }
  .mm-kutu i{ font-style:normal; font-size:21px; line-height:1 }
  .mm-kutu span{
    font-family:var(--font-head); font-weight:700; font-size:11px; letter-spacing:.3px;
  }

  /* Bolge: kompakt etiket grid - tum ilceler */
  .mm-iller{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px }
  .mm-il{
    background:rgba(255,255,255,.06); border-radius:10px; padding:11px 6px;
    text-align:center; color:rgba(255,255,255,.86); font-size:12.5px;
    font-family:var(--font-head); font-weight:700;
    transition:transform .16s var(--yumusak), background .16s, color .16s;
  }
  .mm-il:active{ transform:scale(.93); background:var(--red); color:#fff }

  .mm-liste{
    background:rgba(255,255,255,.05); border-radius:14px; overflow:hidden;
  }
  .mm-liste a{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 16px; color:rgba(255,255,255,.88); font-size:13.5px;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .mm-liste a:last-child{ border-bottom:0 }
  .mm-liste a::after{ content:"›"; color:rgba(255,255,255,.35); font-size:19px }
  .mm-liste a:active{ background:rgba(255,255,255,.10) }

  .mm-sosyal{ display:flex; gap:10px; justify-content:center; margin:26px 0 14px }
  .mm-sosyal a{
    width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.09);
    color:rgba(255,255,255,.75); display:grid; place-items:center;
    font-family:var(--font-head); font-weight:700; font-size:13px;
  }
  .mm-sosyal a:active{ background:var(--red); color:#fff }

  .mm-alt{
    text-align:center; font-size:11.5px; color:rgba(255,255,255,.38);
    line-height:1.7; margin:0;
  }

  /* Hamburger dugmesi (uc cizgi -> X) */
  .m-hamburger{ flex-direction:column; gap:4px; display:flex !important;
    align-items:center; justify-content:center }
  .m-hamburger span{
    display:block; width:17px; height:2px; background:#fff; border-radius:2px;
    transition:transform .28s var(--yumusak), opacity .2s;
  }
  .m-hamburger.acik span:nth-child(1){ transform:translateY(6px) rotate(45deg) }
  .m-hamburger.acik span:nth-child(2){ opacity:0 }
  .m-hamburger.acik span:nth-child(3){ transform:translateY(-6px) rotate(-45deg) }

  /* Eski masaustu cekmecesi mobilde kullanilmiyor */
  .drawer{ display:none }

  /* ==================================================== ARAMA EKRANI ==== */
  .searchpanel{
    padding-top:calc(16px + var(--ust-guvenli));
    border-radius:0 0 18px 18px; padding-bottom:16px;
  }
  .searchpanel input{ font-size:17px; border-bottom-width:2px }

  /* ================================================ KURULUM BANDI ======= */
  .m-kur{
    position:fixed; left:12px; right:12px;
    bottom:calc(var(--tab-bar) + var(--alt-guvenli) + 12px); z-index:125;
    background:var(--navy); color:#fff; border-radius:14px; padding:12px 14px;
    display:flex; align-items:center; gap:12px;
    box-shadow:0 8px 30px rgba(1,18,42,.4);
    transform:translateY(160%); transition:transform .4s var(--yumusak);
  }
  .m-kur.acik{ transform:none }
  .m-kur img{ width:38px; height:38px; border-radius:9px; flex:none }
  .m-kur div{ flex:1; min-width:0 }
  .m-kur b{ display:block; font-family:var(--font-head); font-size:13.5px }
  .m-kur small{ font-size:11px; opacity:.7 }
  .m-kur button{
    background:var(--red); color:#fff; font-family:var(--font-head); font-weight:700;
    font-size:12px; padding:8px 14px; border-radius:8px; flex:none;
  }
  .m-kur .kapat{ background:transparent; opacity:.55; padding:8px 4px; font-size:17px }


  /* ============================================ ACILIS / YUKLEME PERDESI == */
  .m-perde{
    position:fixed; inset:0; z-index:300;
    /* Logonun koyu kirmizisi - yerel uygulama acilisi hissi */
    background:#8B0000;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:0; opacity:0; visibility:hidden; transition:opacity .3s var(--yumusak), visibility .3s;
    padding:32px; text-align:center;
  }
  .m-perde.acik{ opacity:1; visibility:visible }
  .m-perde img{
    width:118px; height:118px; border-radius:27px; margin-bottom:22px;
    box-shadow:0 14px 40px rgba(0,0,0,.35);
    animation:perdeNefes 2.4s ease-in-out infinite;
  }
  @keyframes perdeNefes{
    0%,100%{ transform:scale(1) }
    50%{ transform:scale(1.045) }
  }
  .m-perde-ad{
    font-family:var(--font-head); font-weight:800; font-size:24px;
    color:#fff; letter-spacing:2px;
  }
  .m-perde-alt{
    font-size:12.5px; color:rgba(255,255,255,.6); margin-top:4px; letter-spacing:.8px;
  }
  .m-spinner{
    width:26px; height:26px; margin:26px 0 14px; border-radius:50%;
    border:3px solid rgba(255,255,255,.22); border-top-color:#fff;
    animation:perdeDon .8s linear infinite;
  }
  @keyframes perdeDon{ to{ transform:rotate(360deg) } }
  .m-perde-not{
    font-size:13px; color:rgba(255,255,255,.72); max-width:290px; line-height:1.6;
  }
  /* Elle ekleme anlatimi: spinner gereksiz, metin one cikar */
  .m-perde.elle .m-spinner{ display:none }
  .m-perde.elle .m-perde-not{
    font-size:15px; color:#fff; font-weight:500; margin-top:26px;
  }
  @media (prefers-reduced-motion:reduce){
    .m-perde img{ animation:none }
    .m-spinner{ animation-duration:2s }
  }

  /* Kurulum bandi biraz daha belirgin */
  .m-kur img{ border-radius:11px }

  /* ================================================= YUKARI CIK ======== */
  .scrolltop{
    bottom:calc(var(--tab-bar) + var(--alt-guvenli) + 14px); right:14px;
    width:40px; height:40px; border-radius:50%;
    box-shadow:0 6px 20px rgba(225,40,40,.4);
  }

  /* ======================================================= FOOTER ======= */
  /* Mobilde uygulama hissi icin footer'in link bloklari gizlenir; yalnizca
     tek satirlik kucuk telif satiri kalir. Gezinme zaten alt tab bar'da. */
  .footer{ margin-top:14px; background:transparent }
  .f-top{ display:none }
  .f-bottom{
    padding:14px 0 6px; border-top:1px solid var(--gray-line);
    font-size:10.5px; color:var(--gray-text); text-align:center;
  }
  .f-bottom .container{
    display:block; text-align:center; line-height:1.7;
  }
  .f-bottom span{ display:inline }
  .f-bottom span + span::before{ content:" · "; opacity:.5 }
  .f-bottom a{ color:var(--gray-text); text-decoration:underline }

  /* ====================================== YUKLENIYOR (iskelet) ========= */
  .m-iskelet{
    background:linear-gradient(100deg,#e6eaef 30%,#f2f5f8 50%,#e6eaef 70%);
    background-size:220% 100%; animation:iskelet 1.3s infinite linear;
    border-radius:14px;
  }
  @keyframes iskelet{ from{background-position:180% 0} to{background-position:-40% 0} }

  /* Cevrimdisi seridi kaldirildi - bkz. mobile.js aciklamasi */
}

/* Masaustunde mobil bilesenleri hic gorunmesin */
@media (min-width: 768px) {
  /* .m-perde (acilis ekrani) BU LISTEDE OLMALI: yoksa masaustunde
     sayfanin dibinde "Uygulama hazirlaniyor..." olarak gorunuyor. */
  .m-appbar, .m-tabbar, .m-menu, .m-chips, .m-kur, .m-perde{ display:none !important }
}

/* Hareket azaltma tercihi */
@media (prefers-reduced-motion: reduce) {
  .ms-num.active::after{ animation:none; transform:scaleX(1) }
  .m-iskelet{ animation:none }
  *{ scroll-behavior:auto !important }
}

/* PWA olarak acildiginda (tarayici cubugu yok) biraz daha nefes payi */
@media (display-mode: standalone) and (max-width: 767px) {
  .m-appbar{ padding-top:max(var(--ust-guvenli), 8px) }
}