/* Ana sayfa Şans Çarkı popup'ı (B.2) — prototip kırmızı-beyaz çark paleti.
   Panel yüzeyi açık/koyu temaya uyar; çark diski marka-sabit kırmızıdır. */
.az-wheelpop{
  position:fixed;inset:0;z-index:2147483000; /* alt bar / yapışkan CTA popup'ın üstünde KALMAZ */
  display:grid;place-items:center;
  padding:20px 20px calc(20px + env(safe-area-inset-bottom));
}
.az-wheelpop[hidden]{display:none}
/* Düzeltme Talimatı A (4.205.0): panel İÇİNDEKİ [hidden] öğeler de kesin gizlenir.
   .az-wheelpop__btn'nin display:inline-flex kuralı tarayıcının varsayılan
   [hidden]{display:none} kuralını eziyordu → "Üye Ol" butonu Chrome'da baştan
   görünüyor, çevirince "Çarkı Çevir" kaybolmuyordu. */
.az-wheelpop [hidden]{display:none!important}
.az-wheelpop__backdrop{
  position:absolute;inset:0;border:0;cursor:pointer;
  background:rgba(12,10,10,.58);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.az-wheelpop__panel{
  position:relative;width:min(420px,94vw);max-height:min(92vh,92dvh);overflow-y:auto;
  padding:28px 26px 24px;text-align:center;
  border:1px solid #ECECEC;border-radius:26px;
  background:#fff;color:#2a1f1f;
  box-shadow:0 18px 50px rgba(30,10,10,.28);
  transform:translateY(14px) scale(.97);opacity:0;
  transition:transform .3s cubic-bezier(.2,.9,.3,1.2),opacity .3s ease;
}
.az-wheelpop.is-open .az-wheelpop__panel{transform:none;opacity:1}
html[data-theme=dark] .az-wheelpop__panel,
html.az-dark .az-wheelpop__panel{
  border-color:rgba(255,255,255,.12);
  background:#1c1414;color:#f5ecec;
  box-shadow:0 18px 50px rgba(0,0,0,.5);
}
.az-wheelpop__close{
  position:absolute;top:12px;right:12px;width:36px;height:36px;
  border:1px solid #ECECEC;border-radius:50%;
  background:transparent;color:inherit;font-size:17px;line-height:1;cursor:pointer;
}
html[data-theme=dark] .az-wheelpop__close,html.az-dark .az-wheelpop__close{border-color:rgba(255,255,255,.18)}
.az-wheelpop__kicker{
  display:inline-block;margin-bottom:10px;padding:5px 13px;border-radius:99px;
  background:#FDF5F4;color:#B71C1C;
  font-size:11px;font-weight:800;letter-spacing:.14em;
}
html[data-theme=dark] .az-wheelpop__kicker,html.az-dark .az-wheelpop__kicker{background:rgba(229,57,53,.16);color:#ff8a80}
.az-wheelpop__panel h2{margin:0 0 4px;font-size:23px;font-weight:800;letter-spacing:-.02em}
.az-wheelpop__panel>section>p,.az-wheelpop__panel p{margin:0 0 16px;font-size:13.5px;line-height:1.5;opacity:.82}

/* Çark sahnesi */
.az-wheelpop__stage{position:relative;width:230px;height:230px;margin:0 auto 18px;transition:height .45s ease,opacity .3s ease,margin .45s ease}
/* Düzeltme Talimatı A: kazanınca çark küçülür/kalkar → panel kısalır, sonuç + CTA
   kaydırmadan görünür (aşağı taşma yok). */
.az-wheelpop__panel.is-won .az-wheelpop__stage{height:0;margin:0;opacity:0;overflow:hidden;pointer-events:none}
@media (prefers-reduced-motion:reduce){.az-wheelpop__stage{transition:none}}
.az-wheelpop__pin{
  position:absolute;top:-6px;left:50%;transform:translateX(-50%);z-index:3;
  width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;
  border-top:18px solid #b71c1c;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25));
}
.az-wheelpop__disc{
  position:relative;width:100%;height:100%;border-radius:50%;
  border:7px solid #fff;
  box-shadow:0 0 0 2px #ECECEC,0 12px 30px rgba(60,15,15,.24);
  transition:transform 4.4s cubic-bezier(.12,.6,.04,1);
}
html[data-theme=dark] .az-wheelpop__disc,html.az-dark .az-wheelpop__disc{border-color:#2a1c1c}
.az-wheelpop__disc span{
  position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%) rotate(var(--a)) translateY(-78px);
  color:#fff;font-size:15px;font-weight:800;text-shadow:0 1px 3px rgba(0,0,0,.3);
}
.az-wheelpop__disc span.is-dark{color:#b71c1c;text-shadow:none}
.az-wheelpop__hub{
  position:absolute;inset:0;margin:auto;z-index:2;width:56px;height:56px;
  display:grid;place-items:center;border-radius:50%;
  border:2px solid #ECECEC;background:#fff;color:#B71C1C;
  font-size:10px;font-weight:800;letter-spacing:.04em;
}
html[data-theme=dark] .az-wheelpop__hub,html.az-dark .az-wheelpop__hub{background:#241818;border-color:rgba(255,255,255,.16);color:#ff8a80}

/* Sonuç + durum + bakiye */
.az-wheelpop__result{
  margin:0 0 16px;padding:14px;border-radius:16px;
  border:1px solid rgba(183,28,28,.3);background:#FDF5F4;
}
.az-wheelpop__result b{display:block;font-size:26px;font-weight:800;color:#c62828}
html[data-theme=dark] .az-wheelpop__result b,html.az-dark .az-wheelpop__result b{color:#ff8a80}
.az-wheelpop__result span{display:block;margin-top:2px;font-size:12.5px;font-weight:600;opacity:.82}
@keyframes azWheelpopPop{0%{transform:scale(1)}40%{transform:scale(1.12)}100%{transform:scale(1)}}
.az-wheelpop__result.is-pop{animation:azWheelpopPop .4s ease}
.az-wheelpop__status{font-size:12.5px;font-weight:700;color:#b4423a}
.az-wheelpop__balance{
  margin:0 0 16px;padding:14px;border-radius:16px;
  border:1px solid rgba(183,28,28,.3);background:#FDF5F4;
}
.az-wheelpop__balance b{display:block;font-size:26px;font-weight:800;color:#c62828}
html[data-theme=dark] .az-wheelpop__balance b,html.az-dark .az-wheelpop__balance b{color:#ff8a80}
.az-wheelpop__balance span{display:block;margin-top:2px;font-size:12.5px;font-weight:600;opacity:.82}

/* Butonlar */
.az-wheelpop__btn{
  display:inline-flex;align-items:center;justify-content:center;width:100%;
  min-height:48px;padding:12px 22px;margin-top:10px;
  border:1.5px solid rgba(198,40,40,.55);border-radius:14px;
  background:transparent;color:#c62828;
  font-size:15px;font-weight:800;font-family:inherit;text-decoration:none;cursor:pointer;
  transition:transform .12s ease,filter .12s ease;
}
.az-wheelpop__btn:active{transform:scale(.97)}
.az-wheelpop__btn--primary{border-color:transparent;background:#c62828;color:#fff;box-shadow:0 6px 18px rgba(198,40,40,.28)}
.az-wheelpop__btn--gold{border-color:transparent;background:linear-gradient(135deg,#e53935,#b71c1c);color:#fff;box-shadow:0 6px 18px rgba(183,28,28,.3)}
.az-wheelpop__btn--gold:hover{filter:brightness(1.06)}
.az-wheelpop__btn[disabled]{opacity:.7;cursor:default}
html[data-theme=dark] .az-wheelpop__btn,html.az-dark .az-wheelpop__btn{border-color:rgba(255,138,128,.5);color:#ff8a80}
html[data-theme=dark] .az-wheelpop__btn--primary,html.az-dark .az-wheelpop__btn--primary,
html[data-theme=dark] .az-wheelpop__btn--gold,html.az-dark .az-wheelpop__btn--gold{border-color:transparent;color:#fff}
.az-wheelpop__note{margin:12px 0 0!important;font-size:11.5px;opacity:.6}

/* Küçük ekran: disk ölçülenir (talimat B.2 mobil maddesi). */
@media (max-width:380px){
  .az-wheelpop__panel{padding:24px 18px 20px}
  .az-wheelpop__stage{width:190px;height:190px}
  .az-wheelpop__disc span{transform:translate(-50%,-50%) rotate(var(--a)) translateY(-64px);font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  .az-wheelpop__panel{transition:none}
  .az-wheelpop__disc{transition:none}
  .az-wheelpop__result.is-pop{animation:none}
}

/* ---------------------------------------------------------------------------
   MOBİL KOMPAKT (≤767px) — kullanıcı talimatı 2026-07-26: çark mobilde de çıkar
   ama "düzenli ve kompakt" olsun. Panel, çark ve boşluklar küçültülür; küçük
   telefonlarda kaydırmasız, derli toplu görünür. Oturum başına 1 kez açılır
   (wheel-popup.js), böylece uygulama ekranını sürekli kaplamaz.
   --------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .az-wheelpop { padding: 14px 14px calc(14px + env(safe-area-inset-bottom)); }
  .az-wheelpop__panel { width: min(360px, 92vw); padding: 20px 18px 18px; border-radius: 22px; }
  .az-wheelpop__close { top: 10px; right: 10px; width: 34px; height: 34px; }
  .az-wheelpop__kicker { margin-bottom: 8px; padding: 4px 11px; font-size: 10.5px; }
  .az-wheelpop__panel h2 { font-size: 20px; }
  .az-wheelpop__panel > section > p, .az-wheelpop__panel p { margin-bottom: 12px; font-size: 12.5px; }
  .az-wheelpop__stage { width: 188px; height: 188px; margin-bottom: 14px; }
  .az-wheelpop__disc { border-width: 6px; }
  .az-wheelpop__disc span { transform: translate(-50%, -50%) rotate(var(--a)) translateY(-63px); font-size: 13px; }
  .az-wheelpop__hub { width: 48px; height: 48px; font-size: 9px; }
  .az-wheelpop__result, .az-wheelpop__balance { margin-bottom: 12px; padding: 11px; }
  .az-wheelpop__result b, .az-wheelpop__balance b { font-size: 22px; }
  .az-wheelpop__btn { min-height: 46px; padding: 11px 18px; font-size: 14px; }
}
