.welcome-layer{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:clamp(16px,4vw,48px);background:#fafaf7;opacity:0;transition:opacity .18s ease;color:#22362c;isolation:isolate;overflow:auto}
.welcome-visible{opacity:1}
.welcome-panel{display:grid;grid-template-areas:'brand' 'faces' 'copy' 'credit';align-items:center;gap:14px;width:min(100%,1080px);text-align:center}
.welcome-brand{grid-area:brand;font:650 clamp(12px,1.2vw,16px)/1.5 system-ui,sans-serif;letter-spacing:.18em;margin:0;color:#4d6653}
.welcome-faces{grid-area:faces;display:flex;align-items:center;justify-content:center;gap:18px;min-width:0}
.welcome-copy{grid-area:copy;font-size:clamp(34px,5.2vw,72px);font-weight:600;line-height:1.12;letter-spacing:-.055em;white-space:pre-line;word-break:keep-all;margin:0}
.welcome-credit{grid-area:credit;font:450 12px/1.55 system-ui,sans-serif;color:#506052;margin:0}
.welcome-actor{position:relative;flex:none;border-radius:50%;overflow:hidden;background:#f0e7d5;box-shadow:0 20px 45px #253b3122;animation:welcome-nod .95s ease-out both}
.welcome-haon{width:250px;height:300px;border-radius:28px;background:#17222b}
.welcome-portrait{position:absolute;left:0;top:-3%;width:100%;aspect-ratio:900/1002;transform:scale(1.3);transform-origin:50% 30%;filter:brightness(1.08)}
.welcome-portrait img{display:block;width:100%;height:100%}
.welcome-portrait video{position:absolute;left:27.5556%;top:18.7625%;width:38.2222%;height:38.3234%;object-fit:fill;opacity:0;mask-image:radial-gradient(ellipse,#000 63%,transparent 76%)}
.welcome-portrait video.ready{opacity:1}
.welcome-lumi,.welcome-toto,.welcome-roro{background-image:url('./lumi-character-skin.webp');background-size:1416.9492% 811.2069%;background-position-y:7.6364%;background-repeat:no-repeat}
.welcome-lumi{width:215px;height:215px;background-position-x:13.3848%;z-index:1}
.welcome-toto{width:160px;height:160px;background-position-x:28.8288%;animation-delay:.1s}
.welcome-roro{width:160px;height:160px;background-position-x:51.9949%;animation-delay:.16s}
.welcome-company .welcome-panel,.welcome-starlit .welcome-panel{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);grid-template-rows:auto auto auto;grid-template-areas:'brand faces' 'copy faces' 'credit faces';column-gap:clamp(28px,4vw,64px);row-gap:16px;text-align:left}
.welcome-company .welcome-brand,.welcome-starlit .welcome-brand{align-self:end}
.welcome-company .welcome-credit,.welcome-starlit .welcome-credit{align-self:start}
.welcome-company .welcome-faces{padding:24px 14px;background:radial-gradient(ellipse at center,#e0e7d6,#f0f2e9 75%);border:1px solid #e1e8db;border-radius:30px}
.welcome-company .welcome-haon{width:clamp(170px,20vw,250px);height:clamp(205px,24vw,300px)}
.welcome-company .welcome-lumi{width:clamp(130px,16vw,215px);height:clamp(130px,16vw,215px)}
.welcome-games{background:radial-gradient(ellipse at 50% 43%,#fff2c8 0,#f0f3df 55%,#faf8ef 100%)}
.welcome-games .welcome-faces{align-items:end;padding-block:8px 16px}
.welcome-games .welcome-lumi{width:270px;height:270px}
.welcome-starlit{z-index:35;background:radial-gradient(ellipse at 31% 43%,#233542,#080e1a 72%);color:#f4ead6}
.welcome-starlit .welcome-panel{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:'faces brand' 'faces copy' 'faces credit'}
.welcome-starlit .welcome-brand{color:#e7c785}.welcome-starlit .welcome-copy{font-family:var(--serif,Georgia,serif);font-weight:500}.welcome-starlit .welcome-credit{color:#c9bfae}
.welcome-starlit .welcome-haon{width:min(100%,420px);height:min(54svh,455px);border:1px solid #d7b97580;box-shadow:0 0 90px #bb95584d;border-radius:32px}
.welcome-starlit::before,.welcome-starlit::after{content:'✦';position:absolute;left:10%;top:31%;color:#cfb780;font-size:21px;animation:welcome-glow 2.4s ease both}
.welcome-starlit::after{left:86%;top:62%;font-size:12px;animation-delay:.2s}
@keyframes welcome-nod{0%{transform:translateY(13px) rotate(-3deg);opacity:.26}45%{transform:translateY(-4px) rotate(1.5deg);opacity:1}100%{transform:none;opacity:1}}
@keyframes welcome-glow{0%,100%{opacity:.36}40%{opacity:1}}
@media(max-width:760px){.welcome-panel,.welcome-company .welcome-panel,.welcome-starlit .welcome-panel{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:'brand' 'faces' 'copy' 'credit';gap:16px;text-align:center}.welcome-copy{font-size:clamp(32px,9vw,50px)}.welcome-company .welcome-faces{padding:12px 8px;gap:10px}.welcome-company .welcome-haon{width:min(43vw,220px);height:min(51vw,260px);border-radius:18px}.welcome-company .welcome-lumi{width:min(35vw,180px);height:min(35vw,180px)}.welcome-games .welcome-faces{gap:9px}.welcome-games .welcome-lumi{width:min(50vw,240px);height:min(50vw,240px)}.welcome-toto,.welcome-roro{width:min(19vw,104px);height:min(19vw,104px);margin-inline:-6px}.welcome-starlit .welcome-haon{width:min(78vw,360px);height:min(46svh,390px);border-radius:23px}}
@media(max-height:520px){.welcome-layer{padding:12px}.welcome-panel,.welcome-company .welcome-panel,.welcome-starlit .welcome-panel{gap:9px}.welcome-copy{font-size:clamp(25px,6vh,40px)}.welcome-brand{font-size:11px}.welcome-credit{font-size:10px}.welcome-company .welcome-haon{width:32vh;height:38vh}.welcome-company .welcome-lumi,.welcome-games .welcome-lumi{width:32vh;height:32vh}.welcome-toto,.welcome-roro{width:21vh;height:21vh}.welcome-starlit .welcome-haon{width:min(43vh,76vw);height:48vh}.welcome-company .welcome-faces{padding:8px}}
@media(prefers-reduced-motion:reduce){.welcome-layer{display:none}.welcome-actor{animation:none}}
html.welcome-pending body>:not(.welcome-layer){visibility:hidden}
html.welcome-pending body>.welcome-layer,html.welcome-pending body>.bar-top{visibility:visible}
html.welcome-pending,html.welcome-pending body{background:#fafaf7}
html[data-welcome-kind="starlit"].welcome-pending,html[data-welcome-kind="starlit"].welcome-pending body{background:#080e1a}
