.flm{position:relative;width:100%;aspect-ratio:1681/489;isolation:isolate;user-select:none;-webkit-user-select:none}
.flm *{box-sizing:border-box}
.flm img{position:absolute!important;display:block;max-width:none!important;height:auto!important;margin:0!important;padding:0!important;border:0!important;box-shadow:none!important;pointer-events:none;opacity:0}
.flm-cv{position:absolute;left:-4%;top:-14%;width:108%;height:128%;pointer-events:none;z-index:3}
.flm-glow{position:absolute;left:14.986%;top:56.000%;width:58%;aspect-ratio:1;transform:translate(-50%,-50%) scale(.2);border-radius:50%;opacity:0;z-index:0;pointer-events:none;
  background:radial-gradient(circle,rgba(200,230,255,.85) 0,rgba(120,190,255,.45) 18%,rgba(255,160,60,.22) 36%,rgba(60,120,255,0) 62%);mix-blend-mode:screen}
.flm-rays{position:absolute;left:14.986%;top:56.000%;width:62%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;opacity:0;z-index:0;pointer-events:none;
  background:repeating-conic-gradient(from 0deg,rgba(255,255,255,0) 0deg 7deg,rgba(170,215,255,.55) 9deg,rgba(255,255,255,0) 11deg 22deg);
  -webkit-mask:radial-gradient(circle,#000 0,#000 18%,transparent 66%);mask:radial-gradient(circle,#000 0,#000 18%,transparent 66%);mix-blend-mode:screen}
.flm-core{position:absolute;left:14.986%;top:56.000%;width:3.2%;aspect-ratio:1;transform:translate(-50%,-50%) scale(0);border-radius:50%;z-index:4;pointer-events:none;
  background:radial-gradient(circle,#fff 0,#fff 30%,rgba(160,215,255,.8) 55%,rgba(160,215,255,0) 72%);box-shadow:0 0 30px 12px rgba(150,205,255,.7)}
.flm-beam{position:absolute;left:0;top:50%;width:16%;height:95%;transform:translate(-50%,-50%);opacity:0;z-index:3;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,255,255,.75),rgba(170,215,255,.35) 45%,rgba(255,190,110,.12) 70%,rgba(255,255,255,0));mix-blend-mode:screen}
.flm .flm-wing{z-index:1;transform-origin:47.00% 56.00%}
.flm .flm-ch{z-index:2}
.flm-shine{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;
  -webkit-mask:url(https://onseha.co.kr/wp-content/onseha-blocks/forlong/full.webp?v=20261105) center/100% 100% no-repeat;mask:url(https://onseha.co.kr/wp-content/onseha-blocks/forlong/full.webp?v=20261105) center/100% 100% no-repeat;
  background:linear-gradient(105deg,transparent 0 38%,rgba(255,255,255,0) 42%,rgba(255,255,255,.85) 50%,rgba(255,255,255,0) 58%,transparent 62% 100%) no-repeat;background-size:260% 100%;background-position:120% 0;mix-blend-mode:screen;filter:opacity(.55)}
.flm.play .flm-core{animation:flmCore 1.5s cubic-bezier(.3,0,.2,1) both}
.flm.play .flm-glow{animation:flmGlow 2.4s .15s cubic-bezier(.2,.7,.2,1) both,flmBreath 4s 2.6s ease-in-out infinite}
.flm.play .flm-rays{animation:flmRays 2.2s .35s cubic-bezier(.2,.6,.3,1) both}
.flm.play .flm-wing{animation:flmWing 1.35s .3s cubic-bezier(.2,.9,.25,1.08) both}
.flm.play .flm-beam{animation:flmBeam 1.75s 1.85s cubic-bezier(.45,.05,.4,1) both}
.flm.play .flm-ch{animation:flmCh 1s calc(2s + var(--i) * .2s) cubic-bezier(.2,.8,.25,1) both}
.flm.play .flm-shine{animation:flmShine 1.3s 4.3s ease-in-out both}
.flm.done .flm-wing,.flm.done .flm-ch{opacity:1}
@keyframes flmCore{0%{transform:translate(-50%,-50%) scale(0);opacity:0}18%{transform:translate(-50%,-50%) scale(1);opacity:1}45%{transform:translate(-50%,-50%) scale(2.4);opacity:1}100%{transform:translate(-50%,-50%) scale(5);opacity:0}}
@keyframes flmGlow{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.25)}100%{opacity:.28;transform:translate(-50%,-50%) scale(1)}}
@keyframes flmBreath{0%,100%{opacity:.28;transform:translate(-50%,-50%) scale(1)}50%{opacity:.45;transform:translate(-50%,-50%) scale(1.06)}}
@keyframes flmRays{0%{opacity:0;transform:translate(-50%,-50%) rotate(-30deg) scale(.5)}35%{opacity:.9}100%{opacity:0;transform:translate(-50%,-50%) rotate(40deg) scale(1.35)}}
@keyframes flmWing{0%{opacity:0;transform:rotate(-38deg) scale(.55);filter:brightness(3.2) saturate(.2) blur(10px)}45%{opacity:1;filter:brightness(1.9) saturate(.8) blur(2px)}100%{opacity:1;transform:none;filter:none}}
@keyframes flmBeam{0%{opacity:0;left:30%}12%{opacity:1}85%{opacity:.9}100%{opacity:0;left:102%}}
@keyframes flmCh{0%{opacity:0;transform:translateX(-14%) scale(1.18);filter:brightness(4) saturate(0) blur(9px)}40%{opacity:1;filter:brightness(2.2) saturate(.5) blur(2px)}100%{opacity:1;transform:none;filter:none}}
@keyframes flmShine{0%{opacity:1;background-position:120% 0}100%{opacity:1;background-position:-20% 0}}
/* 밝은 배경(헤더)에서는 빛살·광택을 은은하게 */
.flm.light .flm-rays{mix-blend-mode:normal;filter:opacity(.35)}
.flm.light .flm-core{box-shadow:0 0 18px 6px rgba(120,185,255,.55)}
@media(prefers-reduced-motion:reduce){.flm *{animation:none!important}.flm .flm-wing,.flm .flm-ch{opacity:1}.flm-cv,.flm-beam,.flm-rays,.flm-core{display:none}}
