.msp-screen{display:none;position:fixed;inset:0;z-index:2147483000;place-items:center;overflow:hidden;background:var(--msp-bg,#f7f8fa);color:var(--msp-fg,#123047);font-family:"Noto Sans JP","Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;isolation:isolate;transition:opacity .34s ease,visibility .34s ease}
html.msp-js .msp-screen{display:grid}
.msp-screen.msp-exit{opacity:0;visibility:hidden}
.msp-grid{position:absolute;inset:0;z-index:-1;opacity:.5;background-image:linear-gradient(color-mix(in srgb,var(--msp-fg,#123047) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--msp-fg,#123047) 7%,transparent) 1px,transparent 1px);background-size:58px 58px;mask-image:radial-gradient(circle at center,#000,transparent 72%)}
.msp-stage{position:absolute;top:calc(50% - 112px);width:180px;height:152px;opacity:0;animation:msp-stage 1.48s cubic-bezier(.2,.75,.2,1) forwards}
.msp-line{position:absolute;left:50%;top:50%;width:70px;height:1px;background:color-mix(in srgb,var(--msp-fg,#123047) 22%,transparent);transform-origin:left center}
.msp-line:nth-child(1){transform:rotate(-90deg)}.msp-line:nth-child(2){transform:rotate(30deg)}.msp-line:nth-child(3){transform:rotate(150deg)}
.msp-dot{position:absolute;width:21px;height:21px;border-radius:50%;box-shadow:0 8px 24px color-mix(in srgb,var(--msp-fg,#123047) 16%,transparent)}
.msp-dot-a{left:calc(50% - 10px);top:0;background:var(--msp-accent,#159ada);animation:msp-a 1.02s .12s cubic-bezier(.62,.05,.21,.98) forwards}
.msp-dot-b{right:0;bottom:14px;background:color-mix(in srgb,var(--msp-accent,#159ada) 72%,var(--msp-fg,#123047));animation:msp-b 1.02s .12s cubic-bezier(.62,.05,.21,.98) forwards}
.msp-dot-c{left:0;bottom:14px;background:var(--msp-fg,#123047);animation:msp-c 1.02s .12s cubic-bezier(.62,.05,.21,.98) forwards}
.msp-core{position:absolute;left:50%;top:50%;width:48px;height:48px;display:grid;place-items:center;transform:translate(-50%,-50%) scale(.7);color:var(--msp-bg,#fff);background:var(--msp-fg,#123047);font-size:15px;font-weight:900;letter-spacing:.05em;opacity:0;animation:msp-core .42s .88s ease forwards}
.msp-principles{position:absolute;top:calc(50% - 5px);width:min(560px,90vw);display:flex;justify-content:space-between;color:color-mix(in srgb,var(--msp-fg,#123047) 82%,#fff);font-size:clamp(15px,2.4vw,18px);font-weight:800;letter-spacing:.05em;opacity:0;animation:msp-in .48s .28s ease forwards,msp-out .3s 1.16s ease forwards}
.msp-brand{position:absolute;top:50%;width:min(860px,90vw);margin:0;text-align:center;color:var(--msp-fg,#123047);font-size:clamp(30px,5vw,56px);font-weight:900;line-height:1.35;letter-spacing:.045em;transform:translateY(-48%) scale(.96);opacity:0;animation:msp-brand .5s 1.22s cubic-bezier(.2,.8,.2,1) forwards}
.msp-tagline{position:absolute;top:calc(50% + 86px);width:min(760px,88vw);margin:0;text-align:center;color:color-mix(in srgb,var(--msp-fg,#123047) 82%,#fff);font-size:clamp(16px,2.5vw,21px);font-weight:700;line-height:1.7;letter-spacing:.06em;opacity:0;animation:msp-copy .38s 1.48s ease forwards}
.msp-skip{position:absolute;right:26px;bottom:24px;padding:8px 10px;border:0;background:transparent;color:color-mix(in srgb,var(--msp-fg,#123047) 76%,#fff);font:700 14px/1.4 inherit;cursor:pointer}
.msp-skip span{margin-left:7px;padding:4px 7px;border:1px solid color-mix(in srgb,var(--msp-fg,#123047) 30%,transparent);border-radius:3px;font-size:12px}
.msp-typewriter{position:relative;width:min(1040px,92vw);display:grid;justify-items:center;gap:18px;text-align:center}
.msp-type-brand{margin:0;color:var(--msp-accent,#c9816b);font-size:clamp(16px,2vw,22px);font-weight:900;letter-spacing:.16em;text-transform:uppercase;opacity:0;animation:msp-in .28s .08s ease forwards}
.msp-type-row{width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}
.msp-type-line{max-width:100%;margin:0;overflow:hidden;white-space:nowrap;color:var(--msp-fg,#2b1817);font-size:clamp(16px,5vw,70px);font-weight:900;line-height:1.35;letter-spacing:.03em;clip-path:inset(0 100% 0 0);animation:msp-type 1.2s .28s steps(15,end) forwards}
.msp-type-caret{width:3px;height:clamp(44px,6vw,74px);margin-left:8px;background:var(--msp-accent,#c9816b);animation:msp-caret .48s step-end infinite}
.msp-type-label{margin:0;color:color-mix(in srgb,var(--msp-fg,#2b1817) 58%,#fff);font-size:12px;font-weight:800;letter-spacing:.22em;opacity:0;animation:msp-in .28s 1.5s ease forwards}
@keyframes msp-type{to{clip-path:inset(0 0 0 0)}}
@keyframes msp-caret{50%{opacity:0}}
@keyframes msp-stage{0%{opacity:0;transform:scale(1.25) rotate(-12deg)}20%,72%{opacity:1}100%{opacity:0;transform:scale(.72)}}
@keyframes msp-a{65%,100%{left:calc(50% - 10px);top:calc(50% - 36px)}}
@keyframes msp-b{65%,100%{right:calc(50% - 38px);bottom:calc(50% - 31px)}}
@keyframes msp-c{65%,100%{left:calc(50% - 38px);bottom:calc(50% - 31px)}}
@keyframes msp-core{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes msp-in{to{opacity:1}}@keyframes msp-out{to{opacity:0;transform:translateY(6px)}}
@keyframes msp-brand{to{opacity:1;transform:translateY(-50%) scale(1)}}
@keyframes msp-copy{to{opacity:1;transform:translateY(-4px)}}
@media(max-width:620px){.msp-stage{top:calc(50% - 104px);width:160px;height:138px}.msp-principles{width:92vw;font-size:14px}.msp-brand{font-size:clamp(28px,9vw,40px);letter-spacing:.02em}.msp-tagline{top:calc(50% + 72px);font-size:16px;letter-spacing:.02em}.msp-typewriter{gap:14px}.msp-type-brand{font-size:14px;letter-spacing:.11em}.msp-type-line{letter-spacing:0}.msp-type-caret{height:42px;margin-left:4px}.msp-skip{right:14px;bottom:14px}}
@media(prefers-reduced-motion:reduce){html.msp-js:not(.msp-preview) .msp-screen{display:none!important}}