:root { --sky:#d4eef0; --ink:#284453; --green:#42b294; --green-d:#217f74; --grey:#b5cdd0; }
#s-home { padding-top:max(24px,5vh); padding-bottom:max(20px,4vh); }
.hero-heading { text-align:center; }
.world-tag { display:inline-block; padding:5px 16px; background:#fff4d9; color:#466c74; border-radius:24px; font-size:14px; margin-bottom:12px; box-shadow:0 3px 0 #c8ded9; }
#s-home .title { color:#fffaf0; font-size:clamp(52px,10vw,104px); line-height:1.15; text-shadow:0 5px 0 #315b70; padding:0 48px; }
.world-name { color:#315b70; font-size:clamp(24px,5vw,38px); margin:6px 0 0; font-weight:800; }
#s-home .howto { font-size:16px; max-width:340px; padding:8px 18px; background:#fffaf0; box-shadow:0 4px 0 #b7d6d3; }
#s-home .big-btn { background:#ed826d; box-shadow:0 8px 0 #b85d55; font-size:27px; padding:15px 25px; }
#s-home .home-actions { gap:14px; }
.home-actions .soft { background:#fff8e9; color:#315b70; box-shadow:0 5px 0 #bacdcc; }
.hj-card { background:#fff9ed; box-shadow:0 5px 0 #abc8c6; border:2px solid #fff; }
.hj-stars { background:#fff9ed; box-shadow:0 3px 0 #afc7c6; }
.pad .arrow { background:#fff9ed; color:#315b70; border:3px solid white; box-shadow:0 6px 0 #87a8aa; }
.pad .jump { background:#ed826d; box-shadow:0 8px 0 #b65b51; border:4px solid #ffc4a3; }
.pad .jump.on { box-shadow:0 3px 0 #b65b51; }
.hero-pick span { background:#fff9ed; color:#315b70; }
.hero-pick.on span { background:#ffdb85; }
#s-hero .subtitle { color:#315b70; text-shadow:0 2px 0 #fff9ed; }
.screen.solid:not(#s-hero) { background:#d4eef0; }
.screen.solid:not(#s-hero) .sticky-head { background:#d4eef0; }
#s-mode .mode-card { border:3px solid #fff9ed; }
@media (max-height:520px) {
 #s-home { padding-top:12px; padding-bottom:16px; align-items:flex-start; padding-left:6vw; padding-right:6vw; }
 .hero-heading { align-self:flex-end; width:48%; }
 .world-tag { font-size:12px;margin-bottom:5px;padding:2px 12px; }
 #s-home .title { font-size:46px;padding:0; }
 .world-name { font-size:23px;margin:0; }
 #s-home .howto { align-self:flex-end;width:45%;font-size:13px;margin-top:4px; }
 #s-home .home-actions { align-self:flex-end;width:45%;gap:10px; }
 #s-home .big-btn { font-size:21px;padding:8px 22px; }
 #s-home .home-deco { min-height:2px; }
 #s-home .pill { padding:6px 18px; }
}
@media(prefers-reduced-motion:reduce) { .hj-hand { animation:none; } }