/* MatchApp premium anchored walkthrough v6 */
.matchapp-tour-spotlight{
  position:fixed;z-index:10010;pointer-events:none;box-sizing:border-box;
  border:2px solid rgba(255,229,128,.98);
  background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.008));
  outline:1px solid rgba(255,255,255,.14);
  outline-offset:3px;
  box-shadow:
    0 0 0 9999px rgba(4,3,12,.48),
    0 0 0 7px rgba(229,193,88,.10),
    0 0 34px rgba(255,218,92,.64),
    inset 0 0 24px rgba(255,232,142,.06);
  transition:left .22s ease,top .22s ease,width .22s ease,height .22s ease,border-radius .22s ease;
  animation:matchappTourSpotV6 2s ease-in-out infinite;
}
.matchapp-tour-spotlight::after{
  content:"";
  position:absolute;right:-5px;top:-5px;width:10px;height:10px;border-radius:50%;
  background:#ffe47f;
  box-shadow:0 0 0 4px rgba(255,228,127,.13),0 0 18px rgba(255,228,127,.9);
}

.matchapp-tour-card{
  --tour-arrow-x:50%;
  --tour-arrow-y:50%;
  position:fixed;z-index:10020;
  width:min(342px,calc(100vw - 28px));
  max-height:min(430px,calc(100vh - 28px));
  overflow:auto;
  box-sizing:border-box;
  padding:14px 15px 14px;
  border:1px solid rgba(255,232,159,.72);
  border-radius:22px;
  background:
    radial-gradient(circle at 10% 0%,rgba(151,83,255,.24),transparent 38%),
    radial-gradient(circle at 100% 100%,rgba(229,193,88,.11),transparent 38%),
    linear-gradient(148deg,rgba(35,14,61,.985),rgba(18,8,33,.99) 56%,rgba(8,7,17,.995));
  color:#fff;
  -webkit-backdrop-filter:blur(30px) saturate(145%);
  backdrop-filter:blur(30px) saturate(145%);
  box-shadow:
    0 26px 72px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,255,255,.065) inset,
    0 0 0 4px rgba(229,193,88,.035),
    0 12px 42px rgba(117,72,220,.20);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  transform:translateZ(0);
  scrollbar-width:none;
}
.matchapp-tour-card::-webkit-scrollbar{display:none}
.matchapp-tour-card[hidden],.matchapp-tour-spotlight[hidden]{display:none!important}
.matchapp-tour-card>*:not(.matchapp-tour-pointer){position:relative;z-index:2}

.matchapp-tour-pointer{
  position:absolute;z-index:1;width:30px;height:22px;
  background:linear-gradient(145deg,#4a1d6d,#201037 72%);
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.34)) drop-shadow(0 0 7px rgba(255,224,118,.34));
}
.matchapp-tour-pointer::after{
  content:"";position:absolute;inset:4px;
  background:linear-gradient(145deg,rgba(255,236,161,.34),rgba(229,193,88,.06));
  clip-path:inherit;
}
.matchapp-tour-card[data-side="below"] .matchapp-tour-pointer{
  top:-18px;left:var(--tour-arrow-x);transform:translateX(-50%);
  clip-path:polygon(50% 0,100% 100%,0 100%);
}
.matchapp-tour-card[data-side="above"] .matchapp-tour-pointer{
  bottom:-18px;left:var(--tour-arrow-x);transform:translateX(-50%);
  clip-path:polygon(0 0,100% 0,50% 100%);
}
.matchapp-tour-card[data-side="right"] .matchapp-tour-pointer{
  left:-18px;top:var(--tour-arrow-y);transform:translateY(-50%);
  width:20px;height:28px;clip-path:polygon(0 50%,100% 0,100% 100%);
}
.matchapp-tour-card[data-side="left"] .matchapp-tour-pointer{
  right:-18px;top:var(--tour-arrow-y);transform:translateY(-50%);
  width:20px;height:28px;clip-path:polygon(0 0,100% 50%,0 100%);
}

.matchapp-tour-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.matchapp-tour-badge{
  display:inline-flex;align-items:center;gap:5px;min-width:0;
  color:#ffe995;font-size:9.5px;font-weight:950;letter-spacing:.13em;text-transform:uppercase;
  white-space:nowrap
}
.matchapp-tour-badge b{font-size:11px;color:#fff3b2;text-shadow:0 0 14px rgba(255,222,95,.55)}
.matchapp-tour-skip{
  flex:0 0 auto;min-height:30px;padding:5px 9px!important;
  border:1px solid rgba(255,255,255,.10)!important;border-radius:999px!important;
  background:rgba(255,255,255,.045)!important;color:#d9d0e4!important;
  font:800 10.5px/1 Inter,system-ui,sans-serif!important;
  cursor:pointer;box-shadow:none!important;animation:none!important
}
.matchapp-tour-skip:hover{background:rgba(255,255,255,.09)!important;color:#fff!important}

.matchapp-tour-meta{display:flex;align-items:center;gap:8px;margin:11px 0 4px}
.matchapp-tour-icon{
  display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;
  border-radius:9px;border:1px solid rgba(229,193,88,.40);
  background:linear-gradient(145deg,rgba(229,193,88,.17),rgba(127,76,190,.20));
  color:#ffe782;font-size:12px;font-weight:950;letter-spacing:-.02em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 16px rgba(229,193,88,.08)
}
.matchapp-tour-count{
  color:#a99cb9;font-size:9.5px;font-weight:900;letter-spacing:.11em;text-transform:uppercase
}
.matchapp-tour-tap{
  margin-left:auto;display:inline-flex;align-items:center;gap:4px;
  padding:4px 7px;border-radius:999px;border:1px solid rgba(255,226,118,.18);
  background:rgba(229,193,88,.07);color:#ffe898;
  font-size:9.5px;font-weight:900;letter-spacing:.04em;text-transform:uppercase
}
.matchapp-tour-tap i{font-style:normal;font-size:11px}

.matchapp-tour-card h2{
  margin:3px 0 6px;color:#fff;
  font-size:clamp(18px,2.5vw,23px);line-height:1.13;letter-spacing:-.022em
}
.matchapp-tour-copy{
  margin:0;color:#ded5e8;font-size:12.75px;line-height:1.47;overflow-wrap:anywhere
}
.matchapp-tour-progress{
  height:3px;margin:12px 0 0;border-radius:99px;background:rgba(255,255,255,.075);overflow:hidden
}
.matchapp-tour-progress span{
  display:block;height:100%;border-radius:inherit;
  background:linear-gradient(90deg,#fff09a 0%,#e5c158 46%,#d98bff 100%);
  box-shadow:0 0 12px rgba(229,193,88,.32);
  transition:width .22s ease
}
.matchapp-tour-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:11px}
.matchapp-tour-actions button{
  min-height:38px;padding:8px 14px;border-radius:11px;
  font:850 11.5px/1 Inter,system-ui,sans-serif;cursor:pointer
}
.matchapp-tour-back{
  border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);color:#e9e3f0
}
.matchapp-tour-next{
  min-width:92px;border:1px solid rgba(255,235,151,.72);
  background:linear-gradient(100deg,#7c3aed 0%,#6366f1 100%);
  color:#fff;box-shadow:0 8px 20px rgba(99,102,241,.28)
}
.matchapp-tour-next:hover{filter:brightness(1.10)}
.matchapp-tour-actions button:focus-visible,.matchapp-tour-skip:focus-visible{
  outline:2px solid #ffe681!important;outline-offset:3px!important
}
html.matchapp-tour-active .app-release-notice{display:none!important}
html.matchapp-tour-active{scroll-behavior:auto}

@keyframes matchappTourSpotV6{
  0%,100%{
    box-shadow:0 0 0 9999px rgba(4,3,12,.48),0 0 0 7px rgba(229,193,88,.10),0 0 30px rgba(255,218,92,.52),inset 0 0 22px rgba(255,230,139,.05)
  }
  50%{
    box-shadow:0 0 0 9999px rgba(4,3,12,.48),0 0 0 9px rgba(229,193,88,.13),0 0 40px rgba(255,218,92,.72),inset 0 0 28px rgba(255,230,139,.08)
  }
}

@media(max-width:700px){
  .matchapp-tour-spotlight{outline-offset:2px}
  .matchapp-tour-card{
    width:min(310px,calc(100vw - 28px));
    padding:13px 13px 12px;border-radius:18px;
    box-shadow:0 18px 50px rgba(0,0,0,.60),0 0 0 1px rgba(255,255,255,.045) inset,0 8px 30px rgba(117,72,220,.17)
  }
  .matchapp-tour-badge{font-size:9px;letter-spacing:.11em}
  .matchapp-tour-card h2{font-size:19px}
  .matchapp-tour-copy{font-size:12.25px;line-height:1.44}
  .matchapp-tour-meta{margin-top:10px}
  .matchapp-tour-actions{margin-top:10px}
  .matchapp-tour-actions button{min-height:38px;padding:8px 12px}
  .matchapp-tour-next{min-width:86px}
  .matchapp-tour-tap{font-size:9px}
}
@media(max-width:360px){
  .matchapp-tour-card{width:calc(100vw - 22px);padding:12px}
  .matchapp-tour-badge{font-size:8.5px}
  .matchapp-tour-copy{font-size:12px}
  .matchapp-tour-tap{display:none}
}
@media(min-width:701px) and (max-width:1100px){
  .matchapp-tour-card{width:min(330px,calc(100vw - 32px))}
}
@media(prefers-reduced-motion:reduce){
  .matchapp-tour-spotlight,.matchapp-tour-progress span{transition:none!important;animation:none!important}
}

/* 2026-10-10 precise premium spotlight: no decorative canvas or inert hit zones. */
.matchapp-tour-spotlight::before{
 content:"";position:absolute;inset:-5px;border:1px solid rgba(255,236,164,.60);
 border-radius:inherit;pointer-events:none;
 animation:matchappTourOrbit 2.1s ease-in-out infinite;
}
.matchapp-tour-card.is-entering > :not(.matchapp-tour-pointer){
 animation:matchappTourContentEnter .3s cubic-bezier(.19,1,.22,1) both;
}
.matchapp-tour-card::before{
 content:"";position:absolute!important;z-index:0!important;inset:0;
 background:linear-gradient(110deg,transparent 22%,rgba(255,234,160,.07) 43%,transparent 64%);
 background-size:230% 100%;border-radius:inherit;pointer-events:none;
 animation:matchappTourSheen 6s ease-in-out infinite;
}
.matchapp-tour-card[dir="rtl"]{text-align:right}
.matchapp-tour-card[dir="rtl"] .matchapp-tour-actions{flex-direction:row-reverse}
.matchapp-tour-card[dir="rtl"] .matchapp-tour-meta{direction:rtl}
@keyframes matchappTourOrbit{
 0%,100%{opacity:.4;transform:scale(1)}
 50%{opacity:.85;transform:scale(1.025)}
}
@keyframes matchappTourContentEnter{
 from{opacity:.05;transform:translateY(7px);filter:blur(2px)}
 to{opacity:1;transform:translateY(0);filter:blur(0)}
}
@keyframes matchappTourSheen{
 0%,38%{background-position:155% 0}
 68%,100%{background-position:-90% 0}
}
@media(prefers-reduced-motion:reduce){
 .matchapp-tour-spotlight::before,.matchapp-tour-card.is-entering > :not(.matchapp-tour-pointer),
 .matchapp-tour-card::before{animation:none!important;transition:none!important}
}
