/* K STELLA WAY RC118 — first-screen lock + unified blue intro typography + no text ghosting */

/* First guide image/typography remain visually identical to RC117. Only the handoff timing
   between its two copy blocks is tightened so the old line never lingers under the new line. */
#introFlowApp .sw-impact-phase{transition:opacity .18s ease,transform .18s ease!important}
#introFlowApp .sw-impact.phase-two-on .phase-one{opacity:0!important;transform:translateY(-8px)!important;transition-delay:0s!important}
#introFlowApp .sw-impact.phase-two-on .phase-two{opacity:1!important;transform:none!important;transition-delay:.21s!important}

/* After the locked first guide, gently lift the black/purple weight into the same deep-blue world. */
#introFlowApp.story-world-blue .sw-video{
  filter:brightness(1.075) contrast(.975) saturate(1.04) hue-rotate(-7deg)!important;
  transition:filter .55s ease,transform .8s ease,opacity .2s ease!important;
}
#introFlowApp.story-world-blue .sw-stage::after{
  content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(17,64,132,.11),rgba(6,38,88,.07) 52%,rgba(8,43,96,.10));
  mix-blend-mode:screen;
}
#introFlowApp .sw-vignette{z-index:3}

/* One cinematic caption layer replaces the plain white burned-in-caption impression.
   The veil stays in place while copy changes, so there is never a visible ghost of two lines. */
#introCinematicCaption{
  position:absolute;z-index:18;left:50%;top:58%;transform:translate(-50%,-50%);
  width:min(88vw,440px);min-height:150px;display:flex;align-items:center;justify-content:center;
  pointer-events:none;opacity:0;visibility:hidden;transition:opacity .16s ease,visibility .16s ease;
}
#introCinematicCaption.is-visible{opacity:1;visibility:visible}
#introCinematicCaption::before{
  content:'';position:absolute;z-index:-1;left:-8%;right:-8%;top:-30%;bottom:-30%;
  background:radial-gradient(ellipse at center,rgba(2,14,39,.88) 0%,rgba(3,20,51,.70) 38%,rgba(4,24,58,.44) 58%,rgba(4,24,58,0) 79%);
  -webkit-backdrop-filter:blur(7px) brightness(.78) saturate(.92);
  backdrop-filter:blur(7px) brightness(.78) saturate(.92);
}
#introCinematicCaption .sw-cinematic-copy{
  width:100%;text-align:center;opacity:1;transform:translateY(0);
  transition:opacity .15s ease,transform .15s ease;
  text-shadow:0 3px 5px rgba(0,0,0,.82),0 0 22px rgba(49,105,190,.22);
}
#introCinematicCaption.is-copy-out .sw-cinematic-copy{opacity:0;transform:translateY(5px)}
#introCinematicCaption strong,#introCinematicCaption span{display:block;margin-inline:auto;max-width:96%}
#introCinematicCaption strong{
  font-family:"Nanum Myeongjo","Noto Serif KR",Georgia,serif;
  font-size:clamp(29px,7.7vw,45px);font-weight:800;line-height:1.18;letter-spacing:-.045em;
  background:linear-gradient(102deg,#eaf4ff 0%,#bcd7ff 31%,#f3d88b 70%,#fff1bd 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:.42px rgba(8,28,59,.72);
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.72));
}
#introCinematicCaption span{
  margin-top:9px;font-family:"Nanum Myeongjo","Noto Serif KR",Georgia,serif;
  font-size:clamp(19px,4.9vw,28px);font-weight:650;line-height:1.42;letter-spacing:-.028em;
  color:#f6f9ff;text-shadow:0 2px 4px rgba(0,0,0,.9),0 0 14px rgba(112,168,235,.18);
}
#introCinematicCaption.accent-gold strong{
  background:linear-gradient(102deg,#fff4c8 0%,#f1ca68 42%,#eaf4ff 78%,#bfdcff 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
#introCinematicCaption.accent-blue strong{
  background:linear-gradient(102deg,#eaf5ff 0%,#9fc8ff 46%,#d8eaff 67%,#f2d88b 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* The MASTER_24 baked quote is softened/reframed rather than allowed to sit as a second ghost caption. */
#introCinematicQuote{
  position:absolute;z-index:17;left:50%;bottom:max(16vh,calc(env(safe-area-inset-bottom) + 132px));
  transform:translateX(-50%);width:min(78vw,390px);padding:10px 14px;border:1px solid rgba(224,190,108,.38);
  border-radius:12px;background:rgba(3,17,43,.72);color:#eaf2ff;text-align:center;
  font-family:"Nanum Myeongjo","Noto Serif KR",Georgia,serif;font-size:clamp(12px,3.2vw,16px);line-height:1.5;
  -webkit-backdrop-filter:blur(10px) brightness(.72);backdrop-filter:blur(10px) brightness(.72);
  box-shadow:0 10px 30px rgba(0,0,0,.24);pointer-events:none;opacity:0;visibility:hidden;transition:opacity .15s ease;
}
#introCinematicQuote.is-visible{opacity:1;visibility:visible}
#introCinematicQuote b{color:#f1d98f;font-weight:700}

@media(max-width:420px){
  #introCinematicCaption{top:58.5%;width:90vw;min-height:142px}
  #introCinematicCaption::before{left:-5%;right:-5%;top:-27%;bottom:-27%}
  #introCinematicCaption strong{font-size:clamp(28px,7.6vw,39px)}
  #introCinematicCaption span{font-size:clamp(18px,4.8vw,24px)}
  #introCinematicQuote{bottom:max(15vh,calc(env(safe-area-inset-bottom) + 124px));width:80vw}
}
@media(prefers-reduced-motion:reduce){
  #introCinematicCaption,#introCinematicCaption .sw-cinematic-copy,#introCinematicQuote{transition:none!important}
}