.header-tools{display:flex;align-items:center;gap:14px}.language{border:1px solid var(--line);border-radius:6px;background:#0b1119;color:var(--ink);padding:10px;font:inherit;font-size:12px;max-width:100px}
header nav{gap:22px}header .brand{font-size:20px}
#space{mask-image:none;border-radius:20px;overflow:hidden;background:#060b11;isolation:isolate}
.scene-caption{pointer-events:none;bottom:70px;right:calc(var(--page-edge) + 64px)}
.scene-caption button{pointer-events:auto}.scene-caption p{max-width:310px}
.hero-foot span:nth-child(2){font-size:10px}
.creation,.features{align-items:stretch}.creation article,.features article{height:100%}
.entry-universe{position:fixed;inset:0;z-index:200;overflow:hidden;background:radial-gradient(ellipse,#252039,#060b11 65%);display:grid;place-items:center;animation:entry-away 1s 4s forwards}
.entry-galaxy{width:min(75vw,600px);aspect-ratio:1;position:relative;animation:entry-approach 5s cubic-bezier(.2,.6,.3,1) forwards;display:grid;place-items:center}
.entry-core{width:55px;height:55px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff8dc,#d8b96d 40%,#594120 85%);box-shadow:0 0 65px #d8b96d88}
.entry-orbit{position:absolute;inset:12%;border:1px solid #d8b96daa;box-shadow:0 0 18px #d8b96d22,inset 0 0 18px #d8b96d22;border-radius:50%;transform:rotateX(65deg) rotate(-25deg);animation:orbit-arrive 4.5s ease-in-out both}
.entry-orbit:nth-child(2){inset:0;transform:rotateX(65deg) rotate(40deg);animation-delay:.12s}.entry-orbit:nth-child(3){inset:24%;transform:rotateY(60deg) rotate(30deg);animation-delay:.2s}
.entry-orbit:after{content:'';position:absolute;width:12px;height:12px;border-radius:50%;background:#f3d98d;top:20%;left:7%;box-shadow:0 0 18px #e8c775}
.entry-name{position:absolute;bottom:15%;font:20px Georgia,serif;letter-spacing:2px;color:#e7d4a5}
@keyframes orbit-arrive{from{opacity:0;scale:.3;rotate:-60deg}to{opacity:1;scale:1;rotate:30deg}}
@keyframes entry-approach{0%{transform:scale(.15);filter:blur(12px);opacity:0}25%{opacity:1;filter:blur(0)}75%{transform:scale(1.15);filter:blur(0)}100%{transform:scale(1.65);filter:blur(0)}}
.entry-stars{position:absolute;inset:-50%;background-image:radial-gradient(1px 1px at 15% 25%,#fff,transparent),radial-gradient(2px 2px at 70% 40%,#d8b96d,transparent),radial-gradient(1px 1px at 40% 80%,#b9b5ff,transparent);background-size:107px 131px,211px 193px,173px 157px;animation:star-flight 5s ease-in forwards}
.entry-core{animation:core-reveal 5s ease-out both}
.entry-skip{position:absolute;right:28px;bottom:28px;border:1px solid #8e784c;background:#080b10b0;color:#e7d4a5;border-radius:24px;padding:10px 22px;cursor:pointer}
@keyframes star-flight{from{transform:scale(.4) rotate(-8deg);opacity:0}30%{opacity:.65}to{transform:scale(1.5) rotate(8deg);opacity:1}}
@keyframes core-reveal{0%,12%{transform:scale(.1);opacity:0}45%{transform:scale(1);opacity:1;box-shadow:0 0 100px 30px #d8b96d66}80%,100%{transform:scale(1.2);opacity:1;box-shadow:0 0 85px 15px #d8b96d66}}
@keyframes entry-away{to{opacity:0;visibility:hidden}}
@media(min-width:801px){html[lang=en] .hero-copy h1{font-size:clamp(32px,3.1vw,49px);line-height:1.25}html[lang=en] .hero-copy{width:calc((100% - 2 * var(--page-edge)) * .47)}}
@media(max-width:1150px){header nav{display:none}.header-tools{margin-left:auto}}
@media(max-width:700px){header .brand{font-size:16px}.header-tools{display:contents}header .language{grid-row:1;grid-column:2}header .header-tools>.button{display:none}header nav{display:flex}.scene-caption{right:24px;bottom:55px;max-width:72%}.scene-caption p{font-size:10px}.entry-name{font-size:14px}.hero{min-height:1110px}#space{top:520px;bottom:100px}html[lang=en] .hero-copy h1{font-size:34px}.hero-copy .intro{font-size:13px}}
@media(prefers-reduced-motion:reduce){.entry-universe{display:none}.entry-galaxy,.entry-orbit{animation:none}}
html[lang=ja] .hero-copy h1{font-size:clamp(30px,2.6vw,42px);line-height:1.5}
.scene-modes{position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:5px;padding:5px;border:1px solid #69562d;border-radius:28px;background:#080b10e8;pointer-events:auto}
.scene-modes button{border:0;border-radius:22px;background:transparent;color:#c0b9a8;padding:10px 22px;cursor:pointer;font:600 15px system-ui}
.scene-modes button[aria-pressed=true]{background:#d9ae56;color:#181309}
.scene-modes button:focus-visible{outline:2px solid white;outline-offset:2px}