/* Responsive preview only. The original index.html retains its desktop layout. */
html { background:#0e182d; }
body { min-width:280px; overflow-x:clip; }
.handmade-pixel-art main { overflow-x:clip; }
.introduction { max-width:calc(100vw - 40px); }
.signup { max-width:calc(100vw - 40px); }
.world-heading { width:min(100%,1100px); margin-inline:auto; }
.world-heading > p { line-height:1.4; }
.handmade-pixel-art .planet { width:calc(277px * var(--planet-scale)); height:calc(278px * var(--planet-scale)); }
.planet-glow { width:100%; height:100%; }
.world-chapter #pixel-art-lighter { height:auto; min-height:var(--tool-banner-height); padding:28px max(28px,calc((100vw - 1400px)/2)); gap:28px; }
.tool-details { min-width:0; }
.tool-screenshot { flex-shrink:0; }
.tool-heading h2 { flex-wrap:wrap; row-gap:8px; }
.tool-actions { flex-wrap:wrap; }
#notice,.creators-dialog { max-height:calc(100dvh - 40px); overflow:auto; overscroll-behavior:contain; }
#notice { max-width:calc(100vw - 32px); }
.creator-sprite-stage img { width:calc(var(--native-sprite-width) * var(--sprite-scale)); height:calc(var(--native-sprite-height) * var(--sprite-scale)); }
.creator-sprite-stage { height:calc(53px * var(--sprite-scale) + 12px); }
@media (min-width:1001px) and (max-width:1300px) {
 .world-chapter #pixel-art-lighter { gap:22px; padding-inline:28px; }
 .tool-screenshot { width:220px; }
 .tool-heading h2 { font-size:32px; }
 .tool-heading p { font-size:20px; }
 .footer-follow { width:295px; padding-left:22px; }
 .tool-actions a { padding:12px 18px; }
 .tool-bookmark { min-width:180px; max-width:210px; }
}
@media (max-width:1000px) {
 :root { --tool-banner-height:360px; --world-overlap:110px; }
 .handmade-pixel-art .hero-stage { position:relative; top:auto; mask-image:linear-gradient(#000 calc(100% - 140px),transparent); -webkit-mask-image:linear-gradient(#000 calc(100% - 140px),transparent); }
 .handmade-pixel-art .hero-stage::after { mask-image:linear-gradient(90deg,#000 var(--scene-left),transparent calc(var(--scene-left) + 70px),transparent calc(var(--scene-left) + var(--scene-width) - 70px),#000 calc(var(--scene-left) + var(--scene-width))); -webkit-mask-image:linear-gradient(90deg,#000 var(--scene-left),transparent calc(var(--scene-left) + 70px),transparent calc(var(--scene-left) + var(--scene-width) - 70px),#000 calc(var(--scene-left) + var(--scene-width))); }
 .handmade-pixel-art .hero-dissolve { background:linear-gradient(to bottom,#0e182d00 30%,#0e182d18 48%,#0e182d70 67%,#0e182dcb 83%,#0e182d 96%); }
 .hero-copy .introduction { width:min(760px,calc(100vw - 48px)); }
 .hero-copy .introduction h2 { font-size:clamp(30px,4.5vw,42px); line-height:1.15; }
 html[lang=ja] .hero-copy .introduction h2 { font-size:clamp(26px,3.8vw,34px); line-height:1.4; }
 .hero-copy .introduction p { font-size:22px; line-height:1.35; }
 html[lang=ja] .hero-copy .introduction p { font-size:20px; line-height:1.6; }
 .hero-copy .signup { width:min(650px,calc(100vw - 48px)); }
 .hero-copy .signup > p { font-size:20px; line-height:1.35; }
 .hero-copy .signup .fine { font-size:16px; line-height:1.3; }
 .hero-copy #steam { width:min(360px,calc(100vw - 48px)); min-height:86px; height:auto; }
 .tool-bookmark,.scroll-cue { display:none; }
 .language-switch { top:max(16px,env(safe-area-inset-top)); right:max(18px,env(safe-area-inset-right)); }
 .handmade-pixel-art .world-chapter { margin-top:-110px; }
 .handmade-pixel-art .world-section { min-height:0; padding:24px 24px 70px; }
 .world-heading h2 { font-size:clamp(32px,4.5vw,46px); }
 html[lang=ja] .world-heading h2 { font-size:clamp(26px,3.8vw,34px); line-height:1.4; }
 .world-heading > p { font-size:22px; }
 html[lang=ja] .world-heading > p { font-size:20px; line-height:1.6; }
 .handmade-pixel-art .planet-stage { height:calc(278px * var(--planet-scale) + 120px); min-height:0; max-height:none; margin-top:36px; }
 .world-chapter #pixel-art-lighter { display:grid; grid-template-columns:200px minmax(0,1fr); gap:26px; padding:32px; }
 .tool-screenshot { width:200px; }
 .footer-follow { grid-column:1 / -1; width:100%; border-left:0; border-top:1px solid #82754888; padding:24px 0 0; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:18px; }
 .footer-identity { grid-column:1; }
 .footer-steam { grid-column:2; grid-row:1 / span 2; width:100%; }
 .footer-social-row { grid-column:1; }
 .world-chapter footer > .tool-screenshot,.world-chapter footer > .tool-details,.world-chapter footer > .footer-follow { opacity:1; transform:none; will-change:auto; }
 .creators-dialog { width:calc(100vw - 40px); }
 .creators-dialog .creators-intro { font-size:20px; }
 .creator-card strong { font-size:25px; }
 .creator-role { font-size:19px; }
 .creator-quote,.creator-card[data-creator=red-hat-sprite] .creator-quote { max-width:230px; font-size:20px; }
}
@media (max-width:700px) {
 :root { --sprite-scale:2; }
 .hero-stage header a,.hero-stage header .creators-trigger { display:none; }
 .hero-stage header { pointer-events:none; }
 .hero-stage header .language-switch { pointer-events:auto; }
 .hero-copy .introduction { width:calc(100vw - 32px); }
 .hero-copy .introduction .eyebrow { font-size:8px; letter-spacing:.7px; }
 html[lang=ja] .hero-copy .introduction .eyebrow { font-size:13px; letter-spacing:.5px; }
 .hero-copy .introduction h2 { font-size:clamp(27px,7vw,36px); margin:14px 0 14px; }
 html[lang=ja] .hero-copy .introduction h2 { font-size:clamp(24px,6vw,30px); }
 .hero-copy .introduction p { font-size:20px; line-height:1.35; text-wrap:pretty; }
 html[lang=ja] .hero-copy .introduction p { font-size:17px; line-height:1.7; }
 .hero-copy .signup { width:calc(100vw - 36px); }
 .hero-copy .signup > p { font-size:19px; }
 html[lang=ja] .hero-copy .signup > p { font-size:16px; line-height:1.6; }
 #signup-form { flex-wrap:wrap; padding:6px; gap:6px; }
 #signup-form input { width:100%; flex-basis:100%; min-height:48px; padding:10px 12px; }
 #signup-form .highlight { width:100%; min-height:48px; font-size:22px; padding:12px; }
 html[lang=ja] #signup-form .highlight { font-size:19px; }
 .hero-copy .signup .fine { font-size:15px; padding-inline:4px; }
 .hero-copy #steam { width:min(340px,calc(100vw - 48px)); min-height:86px; gap:14px; padding:16px; }
 .hero-copy #steam > span,html[lang=ja] .hero-copy #steam > span { font-size:24px; white-space:nowrap; }
 .hero-copy #steam small { font-size:12px; }
 .follow { width:290px; max-width:calc(100vw - 40px); }
 .follow-links > span,html[lang=ja] .follow-links > span { font-size:18px; }
 .follow nav { gap:12px; height:44px; }
 .follow a { width:44px; height:44px; }
 .follow svg { width:24px; height:24px; }
 .handmade-pixel-art .world-section { padding:20px 18px 64px; }
 .world-heading h2 { font-size:clamp(29px,7.4vw,38px); line-height:1.2; margin:12px 0 18px; }
 html[lang=ja] .world-heading h2 { font-size:clamp(25px,6.3vw,32px); }
 .world-heading > p { font-size:20px; line-height:1.4; text-wrap:pretty; }
 html[lang=ja] .world-heading > p { font-size:17px; line-height:1.7; }
 .handmade-pixel-art .planet-stage { margin-top:36px; height:calc(278px * var(--planet-scale) + 110px); }
 .world-chapter #pixel-art-lighter { grid-template-columns:minmax(0,1fr); padding:32px 24px max(32px,env(safe-area-inset-bottom)); gap:24px; }
 .tool-screenshot { width:min(100%,300px); justify-self:center; }
 .tool-details { text-align:center; }
 .tool-heading h2 { justify-content:center; font-size:32px; gap:10px; }
 .tool-badges { justify-content:center; }
 .tool-heading p,html[lang=ja] .tool-heading p { font-size:20px; line-height:1.4; }
 .tool-meta { display:block; font-size:15px; line-height:1.4; margin-top:10px; }
 .tool-actions { justify-content:center; gap:10px; }
 .tool-actions a { min-height:48px; padding:12px 18px; font-size:22px; }
 .tool-actions .support-link { padding:0; width:44px; height:44px; min-height:44px; }
 .footer-follow { display:flex; flex-direction:column; gap:20px; padding-top:28px; }
 .footer-steam { width:min(100%,340px); min-height:76px; }
 .footer-steam > span,html[lang=ja] .footer-steam > span { font-size:23px; }
 .footer-social-row { justify-content:center; flex-wrap:wrap; gap:20px; }
 .footer-socials { gap:12px; }
 .footer-socials a { width:44px; height:44px; }
 .footer-socials svg { width:24px; height:24px; }
 .footer-mailing,html[lang=ja] .footer-mailing { font-size:17px; min-height:44px; }
 #notice { width:calc(100vw - 28px); padding:40px 20px 26px; }
 #notice .notice-heading { flex-direction:column; gap:18px; }
 #notice h2,html[lang=ja] #notice h2 { font-size:30px; }
 #notice p,html[lang=ja] #notice p { font-size:19px; line-height:1.5; overflow-wrap:anywhere; }
 #notice .highlight { white-space:normal; min-height:48px; max-width:100%; }
 #notice .signup { width:100%; max-width:100%; }
 #notice .steam-mascot { max-width:130px; height:auto; }
 /* The same live creator content becomes a page section after the globe. */
 .creators-dialog.inline-creators { position:relative; inset:auto; display:block; width:100%; max-width:none; max-height:none; margin:0; padding:36px 20px 64px; border:0; border-radius:0; box-shadow:none; background:linear-gradient(#0e182d,#10313c); overflow:visible; text-align:center; z-index:2; }
 .inline-creators .creators-close { display:none; }
 .creators-dialog.inline-creators h2,html[lang=ja] .creators-dialog.inline-creators h2 { font-size:32px; line-height:1.3; }
 .creators-dialog.inline-creators .creators-intro { font-size:20px; line-height:1.4; }
 html[lang=ja] .creators-dialog.inline-creators .creators-intro { font-size:17px; line-height:1.7; }
 .inline-creators .creator-party { grid-template-columns:1fr; gap:20px; width:100%; margin:20px auto 0; }
 .inline-creators .creator-card:nth-child(n) { grid-column:auto; grid-row:auto; max-width:360px; width:100%; padding:92px 8px 8px; margin:0; }
 .inline-creators .creator-sprite-stage { height:118px; }
 .inline-creators .creator-sprite-stage img { width:calc(var(--native-sprite-width) * 2); height:calc(var(--native-sprite-height) * 2); }
 .inline-creators .creator-card strong { font-size:28px; }
 .inline-creators .creator-country { font-size:17px; }
 .inline-creators .creator-role { font-size:21px; min-height:0; }
 html[lang=ja] .inline-creators .creator-role { font-size:18px; }
 .inline-creators .creator-quote { max-width:min(280px,calc(100vw - 56px)); font-size:20px; }
 html[lang=ja] .inline-creators .creator-quote { font-size:16px; }
 .creators-dialog.inline-creators .creator-hint { font-size:16px; margin-top:28px; }
 .inline-creators .creator-card { animation:none !important; }
}
@media (max-width:360px) {
 .hero-copy #steam > span,html[lang=ja] .hero-copy #steam > span { font-size:21px; }
 .steam .steam-pixel-icon { width:46px; height:46px; }
 .tool-heading h2 { font-size:29px; }
 .tool-actions a { padding-inline:14px; }
 .footer-steam { padding-inline:10px; gap:10px; }
 .footer-steam > span,html[lang=ja] .footer-steam > span { font-size:21px; }
}
@media (max-height:500px) and (min-width:701px) {
 #notice,.creators-dialog { max-height:calc(100dvh - 20px); }
}
/* Keep footer columns within the available width, including long translated labels. */
.world-chapter #pixel-art-lighter .tool-details { width:100%; max-width:100%; }
@media(max-width:1000px) {
 .handmade-pixel-art .hero-dissolve { background:linear-gradient(to bottom,#0e182d00 calc(var(--scene-height) * .34),#0e182d18 calc(var(--scene-height) * .52),#0e182d70 calc(var(--scene-height) * .7),#0e182dcb calc(var(--scene-height) * .86),#0e182d calc(var(--scene-height) - 24px)); }
 .handmade-pixel-art .world-space-layer { mask-image:linear-gradient(transparent,#000 320px,#000 calc(100% - 160px),transparent); -webkit-mask-image:linear-gradient(transparent,#000 320px,#000 calc(100% - 160px),transparent); }
}
@media(max-width:700px) {
 .tool-heading h2 { flex-wrap:wrap; white-space:normal; }
 .tool-heading h2 .tool-badges { flex-basis:100%; }
 .tool-heading p { max-width:100%; }
 .inline-creators .creator-party { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; align-items:start; margin-top:16px; }
 .inline-creators .creator-card:nth-child(n) { grid-row:1; max-width:none; padding:108px 0 0; }
 .inline-creators .creator-sprite-stage { height:110px; }
 .inline-creators .creator-card strong { font-size:22px; line-height:1.15; min-height:50px; margin-top:10px; display:flex; align-items:center; justify-content:center; }
 .inline-creators .creator-country,html[lang=ja] .inline-creators .creator-country { font-size:15px; margin:5px 0 9px; }
 .inline-creators .creator-role,html[lang=ja] .inline-creators .creator-role { font-size:16px; line-height:1.4; white-space:normal; }
 .inline-creators .creator-quote,.inline-creators .creator-card[data-creator=red-hat-sprite] .creator-quote { width:240px; max-width:calc(100vw - 48px); font-size:18px; padding:10px 12px; z-index:3; }
 html[lang=ja] .inline-creators .creator-quote,html[lang=ja] .inline-creators .creator-card[data-creator=red-hat-sprite] .creator-quote { font-size:16px; }
 .inline-creators .creator-card:first-child .creator-quote { left:-12px; transform:translateY(6px); }
 .inline-creators .creator-card:first-child[aria-expanded=true] .creator-quote { transform:none; }
 .inline-creators .creator-card:first-child .creator-quote::after { left:24px; }
 .inline-creators .creator-card:last-child .creator-quote { left:auto; right:-12px; transform:translateY(6px); }
 .inline-creators .creator-card:last-child[aria-expanded=true] .creator-quote { transform:none; }
 .inline-creators .creator-card:last-child .creator-quote::after { left:auto; right:24px; }
 .inline-creators .creator-card { min-height:44px; }
 .follow nav a,.footer-socials a { width:44px; height:44px; min-width:44px; flex-basis:44px; }
}
/* Only compact layouts raise the logo above the cropped foreground artwork.
   Desktop retains the authored title stack beneath main-front-right.png. */
@media(max-width:1000px) {
 .handmade-pixel-art #game-title,
 .handmade-pixel-art[lang=ja] #game-title { z-index:11; }
}
/* Reserve the same text slots in EN/JP so the calls to action stay aligned. */
@media(max-width:1000px) {
 .hero-copy .introduction .eyebrow { min-height:24px; display:block; }
 .hero-copy .introduction h2,
 html[lang=ja] .hero-copy .introduction h2 { min-height:56px; margin:14px 0; display:flex; align-items:center; justify-content:center; }
 .hero-copy .introduction p { min-height:68px; }
 .hero-copy .signup > p:first-child { min-height:54px; display:flex; align-items:center; justify-content:center; margin-bottom:12px; }
 .hero-copy .signup .fine { min-height:40px; margin-top:11px; }
}
@media(max-width:700px) {
 #notice[data-kind=steam] .steam-mascot { width:104px; height:100px; max-width:none; image-rendering:pixelated; }
 #notice[data-kind=support] .steam-mascot { width:78px; height:56px; max-width:none; image-rendering:pixelated; }
 .hero-copy .introduction h2,
 html[lang=ja] .hero-copy .introduction h2 { min-height:88px; margin:14px 0; line-height:1.3; }
 .hero-copy .introduction p,
 html[lang=ja] .hero-copy .introduction p { min-height:122px; }
 .world-heading h2,
 html[lang=ja] .world-heading h2 { min-height:88px; display:flex; align-items:center; justify-content:center; margin:12px 0 18px; }
 .world-heading > p,
 html[lang=ja] .world-heading > p { min-height:136px; }
}
@media(max-width:360px) {
 .hero-copy .introduction p,
 html[lang=ja] .hero-copy .introduction p { min-height:146px; }
 .world-heading > p,
 html[lang=ja] .world-heading > p { min-height:160px; }
}
/* Equal mobile text/control slots prevent EN/JP wrapping from shifting the next block. */
@media(max-width:700px) {
 .hero-copy .introduction h2,
 html[lang=ja] .hero-copy .introduction h2,
 .world-heading h2,
 html[lang=ja] .world-heading h2 { min-height:106px; }
 #signup-form input { height:50px; min-height:50px; }
 #signup-form .highlight,html[lang=ja] #signup-form .highlight { height:52px; min-height:52px; padding-block:10px; }
 .hero-copy #steam { height:90px; min-height:90px; }
}
/* Desktop footer: keep the description column compact instead of filling spare width. */
@media(min-width:1001px) {
 .world-chapter #pixel-art-lighter .tool-details { width:420px; max-width:420px; flex:0 1 420px; }
 .tool-bookmark,html[lang=ja] .tool-bookmark {
  width:260px; min-width:260px; max-width:260px; height:112px;
  display:flex; flex-direction:column; justify-content:center; gap:6px;
  padding:12px 20px 12px 25px;
 }
 .tool-bookmark > span,html[lang=ja] .tool-bookmark > span { align-self:auto; white-space:nowrap; transform:none; }
 .tool-bookmark strong,html[lang=ja] .tool-bookmark strong { font-size:26px; line-height:28px; transform:none; }
 .tool-bookmark small,html[lang=ja] .tool-bookmark small { font-size:16px; line-height:24px; }
}

/* The complete opening composition fits a portrait phone viewport. */
@media(max-width:700px) {
 .hero-copy .introduction .eyebrow { min-height:20px; font-size:8px; letter-spacing:.4px; }
 html[lang=ja] .hero-copy .introduction .eyebrow { font-size:12px; line-height:20px; }
 .hero-copy .introduction h2,html[lang=ja] .hero-copy .introduction h2 {
  font-size:28px; line-height:1.18; min-height:68px; margin:8px 0;
 }
 html[lang=ja] .hero-copy .introduction h2 { font-size:24px; }
 .hero-copy .introduction p,html[lang=ja] .hero-copy .introduction p { font-size:18px; line-height:1.25; min-height:90px; }
 html[lang=ja] .hero-copy .introduction p { font-size:16px; line-height:1.4; }
 .hero-copy .signup > p:first-child { min-height:38px; font-size:17px; margin-bottom:8px; }
 html[lang=ja] .hero-copy .signup > p:first-child { font-size:15px; line-height:1.4; }
 .hero-copy .signup .fine:empty { display:none; }
 #signup-form { padding:5px; gap:5px; }
 #signup-form input { height:44px; min-height:44px; padding:8px 10px; }
 #signup-form .highlight,html[lang=ja] #signup-form .highlight { height:46px; min-height:46px; padding:8px 10px; }
 .hero-copy #steam { height:72px; min-height:72px; padding:10px 16px; }
 .hero-copy #steam > span,html[lang=ja] .hero-copy #steam > span { font-size:23px; line-height:1.1; }
 .hero-copy #steam small,html[lang=ja] .hero-copy #steam small { font-size:11px; line-height:14px; margin-top:5px; }
 .hero-copy .follow .moonfell-profile { width:56px; height:56px; }
 .hero-copy .follow { gap:12px; }
 .hero-copy .follow-links > span,html[lang=ja] .hero-copy .follow-links > span { font-size:17px; line-height:20px; }
 .hero-copy .follow nav { margin-top:5px; }
}
@media(max-width:360px) {
 .hero-copy .introduction h2 { font-size:25px; }
 html[lang=ja] .hero-copy .introduction h2 { font-size:22px; }
 .hero-copy .introduction p,html[lang=ja] .hero-copy .introduction p { min-height:100px; }
 .hero-copy #steam > span,html[lang=ja] .hero-copy #steam > span { font-size:21px; }
}
/* Explicit language selectors override the desktop typography editor settings. */
@media(max-width:700px) {
 html[lang=en] .hero-copy .introduction h2 { font-size:28px; line-height:1.18; }
 html[lang=en] .hero-copy .introduction p { font-size:18px; line-height:1.25; }
}
@media(max-width:360px) {
 html[lang=en] .hero-copy .introduction h2 { font-size:25px; }
}

@media(max-width:700px) {
 .hero-copy .signup > p:first-child,html[lang=ja] .hero-copy .signup > p:first-child { min-height:46px; }
}

/* Give the mobile artwork its earlier title placement; combine secondary actions. */
@media(max-width:700px) {
 .hero-copy .signup > p:first-child,
 html[lang=ja] .hero-copy .signup > p:first-child { display:none; }
 .hero-copy #steam {
  left:18px; transform:none; width:calc(100% - 192px); max-width:none;
  height:84px; min-height:84px; padding:8px; gap:8px;
  display:grid; grid-template-columns:46px minmax(0,1fr); align-items:center;
 }
 .hero-copy #steam > span,html[lang=ja] .hero-copy #steam > span {
  font-size:20px; line-height:1.05; white-space:normal; overflow-wrap:normal;
 }
 .hero-copy #steam small,html[lang=ja] .hero-copy #steam small {
  font-size:10px; line-height:12px; letter-spacing:.2px; margin-top:5px;
 }
 .hero-copy .follow {
  left:auto; right:18px; transform:none; width:144px; max-width:144px;
 }
 .hero-copy .follow > .moonfell-profile { display:none; }
 .hero-copy .follow-links { gap:6px; width:100%; }
 .hero-copy .follow-links > span,html[lang=ja] .hero-copy .follow-links > span {
  font-size:16px; line-height:20px; white-space:nowrap;
 }
 .hero-copy .follow nav { gap:6px; margin:0; width:144px; height:44px; }
}
@media(max-width:360px) {
 .hero-copy #steam { grid-template-columns:23px minmax(0,1fr); gap:7px; }
 .hero-copy #steam .steam-pixel-icon { width:23px; height:23px; }
 .hero-copy #steam > span,html[lang=ja] .hero-copy #steam > span { font-size:18px; }
 .hero-copy #steam small,html[lang=ja] .hero-copy #steam small { font-size:9px; line-height:11px; }
}

/* Mobile foreground framing: move each plant and its eyes together. */
@media(max-width:700px) {
 .handmade-pixel-art .native-slice.left-rocks,
 .handmade-pixel-art .native-slice.eye-1,
 .handmade-pixel-art .native-slice.eye-2 { left:calc(var(--scene-left) + min(18px,4vw)); }
 .handmade-pixel-art .native-slice.hero-platform,
 .handmade-pixel-art .native-slice.eye-3,
 .handmade-pixel-art .native-slice.eye-4,
 .handmade-pixel-art .native-slice.eye-5 { left:calc(var(--scene-left) - 5px); }
 .handmade-pixel-art .native-slice.right-rocks { left:calc(var(--scene-left) - min(14px,3vw)); }
 .creators-dialog.inline-creators h2 { white-space:pre-line; }
 .inline-creators .creator-role,
 html[lang=ja] .inline-creators .creator-role { line-height:1.5; }
}

/* Avoid rebuilding the entire masked hero surface as mobile browser bars move. */
@media(max-width:700px) {
 .handmade-pixel-art .hero-stage { mask-image:none; -webkit-mask-image:none; }
 .handmade-pixel-art .hero-copy { will-change:auto; }
 .handmade-pixel-art #game-title { will-change:auto; }
 .handmade-pixel-art .godrays { animation:none; opacity:.35; }
 .language-switch { position:absolute; }
 html[lang=en] .world-heading > p,
 html[lang=en] .creators-dialog.inline-creators .creators-intro { font-size:18px; line-height:1.25; }
 html[lang=ja] .world-heading > p,
 html[lang=ja] .creators-dialog.inline-creators .creators-intro { font-size:16px; line-height:1.4; }
 .world-heading > p,html[lang=ja] .world-heading > p { min-height:100px; }
}
/* Mobile footer controls and translated tool typography. */
@media(max-width:700px) {
 .footer-follow .footer-steam { display:none; }
 .tool-actions { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) 44px; gap:8px; align-items:center; }
 .tool-actions a { min-width:0; padding:10px 8px; white-space:nowrap; }
 .tool-actions .support-link { width:44px; height:44px; }
 html[lang=ja] .tool-heading p { font-size:clamp(13px,4.1vw,16px); line-height:1.4; white-space:nowrap; }
 html[lang=ja] .tool-meta { font-size:clamp(10px,3.2vw,13px); line-height:1.4; white-space:nowrap; }
 html[lang=ja] .tool-actions a { font-size:clamp(13px,4.1vw,16px); padding-inline:6px; gap:6px; }
 html[lang=ja] .tool-actions .support-link { padding:0; }
}
/* The button boxes already match; give X a slight optical logo-size correction. */
.follow nav a[href*='x.com'] svg,
.footer-socials a[href*='x.com'] svg { width:22px; height:22px; }

/* Keep the artwork's blend/compositor surface independent of title animations. */
@media(max-width:700px) {
 .handmade-pixel-art .parallax-art {
  display:block; isolation:isolate; transform:translateZ(0); backface-visibility:hidden;
 }
}

/* Mobile sparkle ring follows the globe instead of the cropped star-map edges. */
@media(max-width:700px) {
 .handmade-pixel-art .star-node-field {
  left:0; top:var(--mobile-spark-top); width:100%; height:var(--mobile-spark-height);
  transform:translate3d(0,var(--planet-shift,0px),0);
 }
 .star-node-field .star-node:nth-child(1) { left:10%; top:14%; --spark-duration:8s; --spark-delay:-2s; }
 .star-node-field .star-node:nth-child(2) { left:86%; top:17%; --spark-duration:10s; --spark-delay:-6s; }
 .star-node-field .star-node:nth-child(3) { left:3%; top:54%; --spark-duration:11s; --spark-delay:-9s; }
 .star-node-field .star-node:nth-child(4) { left:94%; top:64%; --spark-duration:9s; --spark-delay:-4s; }
 .star-node-field .star-node:nth-child(5) { left:52%; top:96%; --spark-duration:12s; --spark-delay:-7s; }
}

/* The mobile title sits between the stable scene and the front-right silhouette. */
@media(max-width:700px) {
 .handmade-pixel-art #game-title,
 .handmade-pixel-art[lang=ja] #game-title { z-index:5; }
}
@media(min-width:701px) and (prefers-reduced-motion:no-preference) {
 .handmade-pixel-art .godrays { animation-name:godrays-dapple; animation-duration:6.4s; }
}
@keyframes godrays-dapple {
 0%,100% { opacity:.3; }
 12% { opacity:.46; }
 18% { opacity:.7; }
 23% { opacity:.5; }
 29% { opacity:.78; }
 36% { opacity:.58; }
 44% { opacity:.72; }
 52% { opacity:.4; }
 59% { opacity:.64; }
 65% { opacity:.8; }
 69% { opacity:.56; }
 78% { opacity:.7; }
 88% { opacity:.43; }
}

/* Desktop sprite twinkles use a tighter globe-relative ring and livelier cadence. */
@media(min-width:701px) {
 .handmade-pixel-art .star-node-field {
  left:calc(50% - var(--desktop-spark-width) / 2); top:var(--mobile-spark-top);
  width:var(--desktop-spark-width); height:var(--desktop-spark-height);
  transform:translate3d(0,var(--planet-shift,0px),0);
 }
 .star-node-field .star-node:nth-child(1) { left:12%; top:12%; --spark-duration:9s; --spark-delay:-2s; }
 .star-node-field .star-node:nth-child(2) { left:84%; top:16%; --spark-duration:11s; --spark-delay:-6s; }
 .star-node-field .star-node:nth-child(3) { left:0%; top:56%; --spark-duration:12s; --spark-delay:-9s; }
 .star-node-field .star-node:nth-child(4) { left:97%; top:62%; --spark-duration:10s; --spark-delay:-4s; }
 .star-node-field .star-node:nth-child(5) { left:48%; top:94%; --spark-duration:13s; --spark-delay:-7s; }
}

/* Restore the compact desktop Steam notice and its authored two-line message. */
@media(min-width:701px) {
 #notice[data-kind=steam] { width:620px; max-width:calc(100vw - 40px); }
 #notice[data-kind=steam] #notice-body { white-space:pre-line; }
}

/* Hero-only mobile zoom-out; space art retains its previous native scale. */
@media(max-width:700px) {
 .handmade-pixel-art .planet-bg-art,
 .handmade-pixel-art .planet-stars-art {
  left:var(--space-scene-left); width:var(--space-scene-width);
  height:calc(500px * var(--space-pixel-scale));
 }
 .star-node-field { --pixel-scale:var(--space-pixel-scale); }
}