/* PREDICTOR welcome guide popup v1.3.4
   Fully namespaced. No fixed image heights, no object-fit:cover, no mobile carousel. */

body.predictor-guide-popup-open{overflow:hidden!important}

.predictor-guide-popup[hidden],
.predictor-guide-popup__zoom[hidden]{display:none!important}

.predictor-guide-popup,
.predictor-guide-popup *{box-sizing:border-box}

.predictor-guide-popup{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px;
  background:rgba(0,0,0,.88);
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

.predictor-guide-popup__dialog{
  position:relative;
  width:min(1040px,calc(100vw - 24px));
  max-width:1040px;
  max-height:calc(100vh - 24px);
  max-height:calc(100dvh - 24px);
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:26px;
  border:1px solid rgba(232,196,109,.42);
  border-radius:28px;
  color:#fffaf0;
  background:radial-gradient(circle at 50% -8%,rgba(222,177,73,.14),transparent 32%),linear-gradient(155deg,#171108 0%,#090806 58%,#030303 100%);
  box-shadow:0 32px 110px rgba(0,0,0,.82),inset 0 1px 0 rgba(255,255,255,.05);
  scrollbar-color:#a57c32 #0c0a07;
  scrollbar-width:thin;
}

.predictor-guide-popup__dialog:focus{outline:none}

.predictor-guide-popup__close{
  position:absolute;
  top:14px;
  right:14px;
  z-index:4;
  width:44px;
  height:44px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,229,157,.34);
  border-radius:14px;
  color:#ffe9aa;
  background:#0b0906;
  font:700 28px/1 Arial,sans-serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.predictor-guide-popup__close:hover,
.predictor-guide-popup__close:focus-visible{background:#181209;border-color:rgba(255,229,157,.72);outline:none}

.predictor-guide-popup__kicker{
  margin:0 58px 7px 0;
  color:#ddb75d;
  font-size:12px;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.12em;
}

.predictor-guide-popup__title{
  margin:0 58px 0 0;
  color:#fff0bb;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(31px,4.2vw,47px);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.025em;
}

.predictor-guide-popup__subtitle{
  max-width:760px;
  margin:12px 0 0;
  color:#fff9ed;
  font-size:16px;
  font-weight:700;
  line-height:1.65;
}

.predictor-guide-popup__languages{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:17px;
}
.predictor-guide-popup__language-label{
  margin-right:4px;
  color:#e3bd62;
  font-size:11px;
  font-weight:900;
  letter-spacing:.11em;
}
.predictor-guide-popup__language{
  min-width:68px;
  min-height:42px;
  padding:0 16px;
  border:1px solid rgba(255,229,157,.22);
  border-radius:12px;
  color:#fff8ea;
  background:#0b0907;
  font:900 13px/1 Arial,sans-serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.predictor-guide-popup__language[aria-pressed="true"]{
  color:#171005;
  background:linear-gradient(145deg,#fff0b4,#d8a941);
  border-color:#ffe8a6;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 8px 20px rgba(0,0,0,.28);
}
.predictor-guide-popup__language:focus-visible{outline:2px solid rgba(255,229,157,.45);outline-offset:2px}

/* Images stay together above all explanatory text. */
.predictor-guide-popup__images{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  align-items:start;
  margin-top:22px;
}

.predictor-guide-popup__image-card{
  position:relative;
  min-width:0;
  margin:0;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,220,137,.22);
  border-radius:17px;
  background:#050403;
  box-shadow:0 12px 32px rgba(0,0,0,.38);
}

.predictor-guide-popup__image-button{
  display:block;
  width:100%;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  cursor:zoom-in;
  -webkit-tap-highlight-color:transparent;
}

/* Critical fix: preserve each screenshot's native ratio on every viewport. */
html body .predictor-guide-popup__image-card img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  transform:none!important;
}

.predictor-guide-popup__image-step{
  position:absolute;
  left:9px;
  top:9px;
  z-index:2;
  min-width:34px;
  height:34px;
  padding:0 10px;
  display:grid;
  place-items:center;
  border-radius:999px;
  color:#171005;
  background:linear-gradient(145deg,#fff3bd,#d6a33d);
  border:1px solid rgba(255,248,218,.82);
  box-shadow:0 7px 18px rgba(0,0,0,.38);
  font-size:15px;
  font-weight:900;
}

.predictor-guide-popup__zoom-hint{
  position:absolute;
  right:8px;
  bottom:8px;
  z-index:2;
  padding:6px 9px;
  border-radius:999px;
  color:#171005;
  background:#f1d783;
  border:1px solid rgba(255,248,218,.8);
  box-shadow:0 5px 15px rgba(0,0,0,.35);
  font-size:9px;
  font-weight:900;
  line-height:1;
  letter-spacing:.02em;
  pointer-events:none;
}

/* Text is a separate section below all screenshots. */
.predictor-guide-popup__text-section{
  margin-top:18px;
  padding:16px;
  border:1px solid rgba(255,220,137,.18);
  border-radius:19px;
  background:rgba(0,0,0,.30);
}
.predictor-guide-popup__steps{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px;
}
.predictor-guide-popup__step{
  min-width:0;
  padding:17px;
  border:1px solid rgba(255,220,137,.12);
  border-radius:15px;
  background:rgba(0,0,0,.40);
}
.predictor-guide-popup__step-head{
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:9px;
}
.predictor-guide-popup__step-number{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#171005;
  background:linear-gradient(145deg,#fff0b7,#d3a23f);
  font-size:15px;
  font-weight:900;
}
.predictor-guide-popup__step h3{
  margin:0;
  color:#fff0bd;
  font-size:21px;
  font-weight:900;
  line-height:1.35;
}
.predictor-guide-popup__step p{
  margin:0;
  color:#fffaf1;
  font-size:16px;
  font-weight:700;
  line-height:1.72;
}
.predictor-guide-popup__step strong{color:#ffe19a;font-weight:900}
.predictor-guide-popup__tip{
  margin-top:11px;
  padding:12px 13px;
  border:1px solid rgba(82,204,255,.34);
  border-radius:13px;
  color:#edfaff;
  background:rgba(20,137,206,.12);
  font-size:14px;
  font-weight:800;
  line-height:1.62;
}
.predictor-guide-popup__note{
  margin:16px 0 0;
  padding:14px 16px;
  border:1px solid rgba(255,220,137,.14);
  border-radius:14px;
  color:#fff8ed;
  background:rgba(0,0,0,.36);
  font-size:14px;
  font-weight:700;
  line-height:1.65;
  text-align:center;
}
.predictor-guide-popup__done{
  width:100%;
  min-height:56px;
  margin-top:16px;
  padding:10px 18px;
  border:1px solid rgba(255,248,218,.84);
  border-radius:15px;
  color:#171005;
  background:linear-gradient(135deg,#fff1ba 0%,#daa944 55%,#b9802b 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62),0 11px 26px rgba(0,0,0,.34);
  font:900 14px/1.25 Arial,sans-serif;
  letter-spacing:.035em;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.predictor-guide-popup__done:hover,
.predictor-guide-popup__done:focus-visible{filter:brightness(1.05);outline:2px solid rgba(255,229,157,.32);outline-offset:2px}

.predictor-guide-popup__zoom{
  position:fixed;
  inset:0;
  z-index:2147483646;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  background:rgba(0,0,0,.96);
}
.predictor-guide-popup__zoom-inner{
  position:relative;
  width:min(900px,100%);
  max-height:94vh;
  max-height:94dvh;
  display:flex;
  align-items:center;
  justify-content:center;
}
html body .predictor-guide-popup__zoom-image{
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  height:auto!important;
  max-height:88vh!important;
  max-height:88dvh!important;
  object-fit:contain!important;
  margin:0!important;
  border:1px solid rgba(255,229,157,.35)!important;
  border-radius:14px!important;
  box-shadow:0 24px 80px rgba(0,0,0,.74)!important;
}
.predictor-guide-popup__zoom-close{
  position:absolute;
  top:-8px;
  right:-4px;
  z-index:2;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,229,157,.52);
  border-radius:50%;
  color:#fff0bd;
  background:#11100d;
  font:700 27px/1 Arial,sans-serif;
  cursor:pointer;
}

@media (max-width:760px){
  .predictor-guide-popup{padding:6px;align-items:center}
  .predictor-guide-popup__dialog{
    width:calc(100vw - 12px);
    max-width:none;
    max-height:calc(100vh - 12px);
    max-height:calc(100dvh - 12px);
    padding:19px 14px 16px;
    border-radius:21px;
  }
  .predictor-guide-popup__close{top:9px;right:9px;width:38px;height:38px;border-radius:12px;font-size:23px}
  .predictor-guide-popup__kicker{margin-right:44px;font-size:9px;letter-spacing:.08em}
  .predictor-guide-popup__title{margin-right:44px;font-size:28px;line-height:1.12}
  .predictor-guide-popup__subtitle{font-size:15px;line-height:1.6}
  .predictor-guide-popup__languages{gap:6px;margin-top:14px}
  .predictor-guide-popup__language-label{width:100%;font-size:9px}
  .predictor-guide-popup__language{flex:1 1 0;min-width:0;min-height:42px;padding:0 9px;font-size:12px}

  /* No swipe/slider on mobile: every image remains visible above the text. */
  .predictor-guide-popup__images{
    grid-template-columns:1fr;
    gap:10px;
    margin-top:16px;
    overflow:visible;
    scroll-snap-type:none;
  }
  .predictor-guide-popup__image-card{width:100%;border-radius:14px}
  .predictor-guide-popup__image-step{left:7px;top:7px;min-width:31px;height:31px;padding:0 8px;font-size:14px}
  .predictor-guide-popup__zoom-hint{right:6px;bottom:6px;padding:5px 7px;font-size:8px}

  .predictor-guide-popup__text-section{margin-top:14px;padding:10px;border-radius:16px}
  .predictor-guide-popup__steps{grid-template-columns:1fr;gap:10px}
  .predictor-guide-popup__step{padding:14px;border-radius:13px}
  .predictor-guide-popup__step-head{gap:9px;margin-bottom:8px}
  .predictor-guide-popup__step-number{width:31px;height:31px;flex-basis:31px;font-size:14px}
  .predictor-guide-popup__step h3{font-size:20px;line-height:1.4}
  .predictor-guide-popup__step p{font-size:16px;line-height:1.75}
  .predictor-guide-popup__tip{font-size:14px;line-height:1.68}
  .predictor-guide-popup__note{font-size:14px;line-height:1.65}
  .predictor-guide-popup__done{min-height:54px;font-size:13px}
}

@media (min-width:761px) and (max-width:1100px){
  .predictor-guide-popup__dialog{width:min(920px,calc(100vw - 24px));padding:23px}
  .predictor-guide-popup__images{gap:12px}
  .predictor-guide-popup__step h3{font-size:19px}
  .predictor-guide-popup__step p{font-size:15px}
}

@media (prefers-reduced-motion:reduce){
  .predictor-guide-popup *,
  .predictor-guide-popup__zoom *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}