@import url('/css/fortune-font.css');
/* Intro only: existing white question sheet and its controller remain unchanged. */
body[data-love-saju-sheet]{background:#edf0f3}
.ls-video-intro{container-type:inline-size;min-height:100svh;background:#fff}
.ls-video-intro .ls-backdrop{position:absolute;inset:0 0 auto;aspect-ratio:9/16;z-index:-2;background:#c7bcae}
.ls-video-intro .ls-backdrop:after{display:none}
.ls-video-intro .ls-backdrop>img,.ls-video-intro .ls-backdrop>video{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 20%}
.ls-video-intro .ls-backdrop>video{opacity:0;transition:opacity .25s ease}
.ls-video-intro .ls-backdrop>video.is-playing{opacity:1}
.ls-video-intro .ls-scene-header{background:linear-gradient(#fff7,transparent);padding:calc(12px + env(safe-area-inset-top)) 19px 8px;z-index:4}
.ls-video-intro .ls-scene-header .fortune-box-brand img{width:clamp(131px,33cqw,157px);height:auto;filter:none}
.ls-video-intro .ls-scene-header .fortune-box-icon{width:44px;height:44px;border:1px solid #ffffff45;background:#15223540;color:#fff;backdrop-filter:blur(2px)}
.ls-video-toggle{position:absolute;z-index:4;top:calc(76px + env(safe-area-inset-top));right:20px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #ffffffb3;border-radius:50%;background:#17283c33;color:#fff;backdrop-filter:blur(2px);box-shadow:0 1px 8px #17283c0a;font-size:20px!important;line-height:1}
.ls-video-toggle:focus-visible{outline:3px solid #1d3855;outline-offset:4px}
.ls-video-intro .ls-intro{position:relative;isolation:isolate;min-height:100svh;min-height:100dvh;height:100dvh;padding:0;display:flex;justify-content:flex-end;flex-direction:column;color:#15243c}
.ls-intro-copy{position:relative;z-index:1;width:100%;padding:24px 6.4% calc(18px + env(safe-area-inset-bottom));text-align:center;background:linear-gradient(180deg,#ffffff00 0,#ffffffdf 8%,#fffffff7 20%,#fff 40%);color:#15243c}
.ls-intro-copy:before{content:'';position:absolute;z-index:-1;inset:-50px 0 0;background:linear-gradient(transparent,#ffffffb3 13%,#fffffff5 25%,#fff 43%);pointer-events:none}
.ls-intro-copy .ls-intro-bloom{position:absolute;z-index:-1;width:130px;height:110px;background:url('/images/fortune/v3/blossom-decoration.svg') center/contain no-repeat;opacity:.38;filter:saturate(.35);pointer-events:none}
.ls-intro-copy .ls-intro-bloom--left{top:35px;left:-63px;transform:rotate(17deg)}
.ls-intro-copy .ls-intro-bloom--right{top:116px;right:-66px;transform:scaleX(-1) rotate(-14deg)}
.ls-video-intro .ls-intro-copy .ls-eyebrow{position:relative;display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 8px;white-space:nowrap;color:#8c784b;font:700 clamp(12px,3.45cqw,15px)/1.6 'Noto Serif KR','Batang',serif;letter-spacing:.025em}
.ls-intro-copy .ls-eyebrow:before,.ls-intro-copy .ls-eyebrow:after{content:'';flex:1;min-width:8px;height:1px;background:#a58d5d}
.ls-intro-copy .ls-eyebrow b{font-size:12px;font-weight:400}
.ls-video-intro .ls-intro-copy h1{margin:0;color:#15243c;font:700 clamp(31px,10cqw,45px)/1.22 'Noto Serif KR','Batang',serif;letter-spacing:-1.4px;text-shadow:none}
.ls-intro-copy h1>span{display:block;white-space:nowrap}
.ls-video-intro .ls-intro-copy>p{margin:10px 0 14px;color:#273951;font:700 clamp(13px,3.85cqw,17px)/1.5 'Noto Serif KR','Batang',serif;letter-spacing:.01em;word-break:keep-all}
.ls-video-intro .ls-intro-actions{margin:0;display:grid;gap:6px}
.ls-video-intro .ls-free-tag{font-size:9px;line-height:1.55;color:#85919e;letter-spacing:.2px}
.ls-video-intro .ls-start{width:100%;display:flex;align-items:center;justify-content:center;gap:16px;min-height:54px;padding:10px 15px;border:1px solid #fff9e7;border-radius:999px;outline:1px solid #b49050;outline-offset:3px;box-shadow:inset 0 0 0 1px #b4905040,0 0 0 2px #fff;background:linear-gradient(110deg,#203049,#17243d);color:#fff;font:700 clamp(18px,5.3cqw,24px)/1.5 'Noto Serif KR','Batang',serif!important;letter-spacing:-.3px}
.ls-video-intro .ls-start>span{font:400 27px/1 sans-serif}
.ls-video-intro .ls-start:hover{background:linear-gradient(110deg,#2b3c59,#1e2e49)}
.ls-video-intro .ls-start:focus-visible{outline:3px solid #5b799c;outline-offset:6px}
.ls-intro-links{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:5px;flex-wrap:wrap}
.ls-video-intro .ls-intro-links .ls-intro-records,.ls-video-intro .ls-intro-links .ls-catalog{font-size:10px!important;line-height:1.5;min-height:28px;color:#748397;padding:4px 0}
.ls-video-intro .ls-intro-links .ls-intro-records{border:0;background:transparent;text-decoration:underline;text-underline-offset:3px}
@media(max-height:620px){
 .ls-video-intro .ls-backdrop{inset:0;aspect-ratio:auto}
 .ls-intro-copy{padding-top:18px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
 .ls-video-intro .ls-intro-copy .ls-eyebrow{font-size:11px;margin-bottom:6px}
 .ls-video-intro .ls-intro-copy h1{font-size:clamp(27px,8.6cqw,37px);line-height:1.18}
 .ls-video-intro .ls-intro-copy>p{font-size:13px;margin:6px 0 10px}
 .ls-video-intro .ls-start{min-height:46px;font-size:18px!important;padding-block:8px}
 .ls-video-intro .ls-free-tag{font-size:8px}
 .ls-intro-links{margin-top:2px;gap:15px}
 .ls-video-intro .ls-intro-links .ls-intro-records,.ls-video-intro .ls-intro-links .ls-catalog{min-height:25px;font-size:9px!important}
 .ls-intro-copy:before{inset:-25px 0 0}
}
@media(prefers-reduced-motion:reduce){.ls-video-intro .ls-backdrop>video{transition:none}}
