:root{--ray:hsl(var(--art-hue-live,232) 90% 76%)}
html[data-midiary-theme=light]{--ray:hsl(var(--art-hue-live,232) 70% 38%)}
html[data-art-tone=mono]{--ray:#fff}
html[data-midiary-theme=light][data-art-tone=mono]{--ray:#111}
.splash-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:58;color:var(--ray);background:var(--fd-bg,#09090b);transition:opacity .45s ease}
.splash-layer:not(.is-ending){pointer-events:auto}
.splash-layer.is-ending{opacity:0}
#fgu-diary-design .splash-rays{position:absolute;width:1040px;height:1040px;max-width:none;transform:translate(-50%,-50%);overflow:visible}
#fgu-diary-design .splash-rays .beam{fill:none;stroke:currentColor;stroke-linecap:round;stroke-dasharray:16 200;stroke-dashoffset:16;opacity:0;animation:beam-fly .7s linear both;animation-delay:calc(var(--i) * .16s)}
#fgu-diary-design .splash-rays .beam.core{stroke-width:1.8}
#fgu-diary-design .splash-rays .beam.glow{stroke-width:8;stroke-opacity:.3}
#fgu-diary-design .splash-rays .mark-back{fill:#09090b;animation:mark-back .35s ease-out both}
#fgu-diary-design .splash-rays .mark-line{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;opacity:0;animation:mark-draw .7s linear both;animation-delay:calc(var(--i) * .16s)}
#fgu-diary-design .splash-rays .mark-line.m{stroke:#f4f4f5;stroke-width:25}
#fgu-diary-design .splash-rays .mark-line.m-glow{stroke:currentColor;stroke-width:52;animation-name:mark-draw-soft}
#fgu-diary-design .splash-rays .mark-line.book{stroke:#b9b9c1;stroke-width:12;fill:#242428;fill-opacity:0;animation-name:book-draw}
.intro-assemble .fd-splash .fd-crest{opacity:0}
.fd-splash .fd-crest{transition:opacity .35s ease}
@keyframes beam-fly{0%{stroke-dashoffset:16;opacity:0}5%{opacity:1}50%{stroke-dashoffset:-100;opacity:1}51%,100%{stroke-dashoffset:-100;opacity:0}}
@keyframes mark-back{from{opacity:0}to{opacity:1}}
@keyframes mark-draw{0%{stroke-dashoffset:100;opacity:0}50%{stroke-dashoffset:100;opacity:1}100%{stroke-dashoffset:0;opacity:1}}
@keyframes mark-draw-soft{0%{stroke-dashoffset:100;opacity:0}50%{stroke-dashoffset:100;opacity:.3}100%{stroke-dashoffset:0;opacity:.3}}
@keyframes book-draw{0%{stroke-dashoffset:100;opacity:0;fill-opacity:0}35%{stroke-dashoffset:100;opacity:1;fill-opacity:0}75%{stroke-dashoffset:0;opacity:1;fill-opacity:0}100%{stroke-dashoffset:0;opacity:1;fill-opacity:1}}
.fd-splash .fd-crest-wrap{position:relative;z-index:3;animation:crest-pulse 1.7s ease-out infinite}
@keyframes crest-pulse{0%,55%{box-shadow:0 0 0 0 transparent}70%{box-shadow:0 0 34px 6px color-mix(in srgb,var(--ray) 55%,transparent)}100%{box-shadow:0 0 0 22px transparent}}
.intro-burst{position:fixed;width:144px;height:144px;margin:-72px 0 0 -72px;border-radius:50%;border:2px solid var(--ray);pointer-events:none;z-index:60;animation:intro-burst .95s cubic-bezier(.1,.7,.2,1) forwards}
.intro-burst.second{border-width:1px;animation-delay:.14s;opacity:0}
@keyframes intro-burst{from{transform:scale(.6);opacity:.95}to{transform:scale(14);opacity:0}}
.intro-flash{position:fixed;inset:0;z-index:59;pointer-events:none;background:radial-gradient(circle at var(--cx,50%) var(--cy,50%),color-mix(in srgb,var(--ray) 38%,transparent),transparent 52%);animation:intro-flash .9s ease-out forwards}
@keyframes intro-flash{from{opacity:1}to{opacity:0}}
#screen.is-entering .fd-detail-page>*{animation:intro-rise .75s cubic-bezier(.2,.8,.2,1) both}
#screen.is-entering .fd-detail-page>:nth-child(2){animation-delay:.06s}#screen.is-entering .fd-detail-page>:nth-child(3){animation-delay:.12s}#screen.is-entering .fd-detail-page>:nth-child(4){animation-delay:.18s}
#screen.is-entering .fd-detail-page>:nth-child(5){animation-delay:.24s}#screen.is-entering .fd-detail-page>:nth-child(6){animation-delay:.3s}#screen.is-entering .fd-detail-page>:nth-child(n+7){animation-delay:.36s}
@keyframes intro-rise{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:none}}
#fgu-diary-design .fd-splash .fd-crest-wrap{width:176px;height:176px}
.fd-splash h1{animation:splash-title 1.2s cubic-bezier(.2,.8,.2,1) both}
@keyframes splash-title{from{opacity:0;letter-spacing:.38em;filter:blur(7px)}to{opacity:1;letter-spacing:normal;filter:blur(0)}}
#fgu-diary-design .splash-rays .mote{opacity:0;animation:mote 1.05s cubic-bezier(.3,.1,.5,1) both;animation-delay:var(--d)}
@keyframes mote{0%{transform:translate(var(--sx),var(--sy)) scale(.5);opacity:0}18%{opacity:1}85%{opacity:.9}100%{transform:translate(var(--tx),var(--ty)) scale(1.1);opacity:0}}
#fgu-diary-design .splash-rays .orbit{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;opacity:0;transition:transform .45s ease-in,opacity .45s;animation:orbit-in .7s ease-out .55s both,orbit-spin 9s linear .55s infinite}
#fgu-diary-design .splash-rays .orbit.one{stroke-dasharray:2 11}
#fgu-diary-design .splash-rays .orbit.two{stroke-dasharray:46 20 6 20;animation-duration:.7s,14s;animation-direction:normal,reverse;stroke-opacity:.7}
@keyframes orbit-in{from{opacity:0;stroke-width:6}to{opacity:.85;stroke-width:1.3}}
@keyframes orbit-spin{to{transform:rotate(360deg)}}
.splash-layer.is-ending .orbit{animation:none;transform:scale(2.4);opacity:0}
#fgu-diary-design .splash-rays .mark-line.comet{stroke:#fff;fill:none;stroke-width:5;stroke-dasharray:7 93;stroke-dashoffset:100;opacity:0;animation:comet 1.5s ease-in-out 1.15s infinite;filter:drop-shadow(0 0 4px currentColor)}
#fgu-diary-design .splash-rays .mark-line.comet.book{stroke-width:4;animation-delay:1.3s}
@keyframes comet{0%{stroke-dashoffset:100;opacity:0}12%{opacity:1}88%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.intro-spark{position:fixed;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;border-radius:50%;background:var(--ray);box-shadow:0 0 10px 2px var(--ray);pointer-events:none;z-index:61;animation:intro-spark .9s cubic-bezier(.1,.7,.3,1) both}
@keyframes intro-spark{from{transform:translate(0,0) scale(1.3);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.1);opacity:0}}
@media (prefers-reduced-motion:reduce){.splash-layer,.intro-burst,.intro-flash,.intro-spark{display:none}.fd-splash h1{animation:none}.fd-splash .fd-crest-wrap{animation:none}#screen.is-entering .fd-detail-page>*{animation:none}}

.splash-word{position:absolute;left:0;right:0;text-align:center;font-size:34px;font-weight:800;color:var(--fd-text,#fff);animation:splash-title 1.2s cubic-bezier(.2,.8,.2,1) both}
.splash-bar{position:absolute;left:50%;bottom:15%;width:180px;height:4px;margin-left:-90px;border-radius:4px;background:color-mix(in srgb,var(--fd-text,#fff) 14%,transparent);overflow:hidden}
.splash-bar span{display:block;width:40%;height:100%;border-radius:4px;background:var(--ray);animation:splash-bar 1.3s ease-in-out infinite}
@keyframes splash-bar{from{transform:translateX(-110%)}to{transform:translateX(260%)}}
@media (prefers-reduced-motion:reduce){.splash-word,.splash-bar{display:none}}