/* Local composition study: retain the existing card size rules and optical layers. */
body.single-home{
 --mascot-width:clamp(88px,min(max(min(34vw,145px),calc(12vw + 36px)),calc(225px * var(--mascot-scale))),214px);
 --mascot-height:calc(var(--mascot-width) * 1.02222222);
 --deck-height:calc(var(--cover-width)/1.5 + var(--caption-height) + var(--caption-gap) + 36px);
}
/* Size the SVG's layout box directly, so width changes also resize the illustration. */
html body.single-home #home .identity .robot-companion .artwork{
 width:100%!important;min-width:0!important;height:100%!important;
 transform:none!important;
}
html body.single-home #home .identity .robot-companion .art-surface{
 width:100%!important;height:100%!important;
}
html body.single-home #home .identity .robot-companion .logo-stage{
 width:80%!important;max-width:none!important;
}
html body.single-home #home.hero{
 gap:clamp(18px,calc(14px * var(--home-unit) + 12px),40px);
}
body.single-home .bloom-stage{
 gap:clamp(18px,calc(18px * var(--home-unit) + 12px),40px);
}
body.single-home .film-viewport{
 min-height:calc(var(--cover-width)/1.5 + var(--caption-height) + var(--caption-gap));
}
body.single-home .card-carousel-controls{
 height:28px;min-height:28px;margin-top:8px;gap:18px;
}
body.single-home .service-rail{width:min(310px,50vw)}
body.single-home .deck-help{
 position:static;transform:none;top:auto;left:auto;margin:0;
 flex:none;line-height:18px;white-space:nowrap;
}
@media(max-width:850px){
 html body.single-home #home.hero{gap:clamp(22px,calc(14px * var(--home-unit) + 24px),48px)}
 body.single-home .bloom-stage{gap:clamp(20px,calc(18px * var(--home-unit) + 18px),48px)}
 body.single-home .card-carousel-controls{gap:12px}
 body.single-home .service-rail{width:min(310px,calc(100% - 108px))}
 body.single-home .deck-help{flex:0 0 96px;white-space:normal;text-wrap:balance}
}
@media(max-width:480px){
 body.single-home{--deck-height:calc(var(--cover-width)/1.5 + var(--caption-height) + var(--caption-gap) + 62px)}
 body.single-home .card-carousel-controls{height:62px;min-height:62px;margin-top:0;flex-direction:column;gap:0}
 body.single-home .service-rail{width:min(300px,100%);grid-template-columns:minmax(0,1fr);gap:0}
 body.single-home .deck-count{display:none}
 body.single-home .deck-help{flex:none;width:auto;white-space:nowrap}
}
@media(max-height:650px){
 html body.single-home #home.hero{padding:4px 0;gap:clamp(4px,calc(14px * var(--home-unit)),12px)}
 body.single-home .bloom-stage{gap:clamp(4px,calc(18px * var(--home-unit)),14px)}
}

/* In short landscape viewports, use the available width instead of pushing the deck below the fold. */
@media(min-width:600px) and (max-height:560px){
 body.single-home{--deck-height:calc(var(--cover-width)/1.5 + var(--caption-height) + var(--caption-gap) + 44px)}
 html body.single-home #home.hero{flex-direction:row;align-items:center;gap:clamp(16px,3vw,32px);padding:2px 0}
 body.single-home .scene-copy{width:40%;max-width:500px;min-width:0;flex:none}
 body.single-home .portfolio-stage{width:auto;min-width:0;flex:1}
 body.single-home .bloom-title .intro-name{font-size:clamp(18px,2.55vw,26px);gap:6px}
 body.single-home .bloom-title .name-words{white-space:normal;text-wrap:balance}
 body.single-home .bloom-title .intro-slogan{font-size:clamp(24px,3.5vw,38px);white-space:normal;text-wrap:balance}
 body.single-home .card-carousel-controls{height:44px;min-height:44px;margin-top:0;gap:12px}
 body.single-home .service-rail{width:calc(100% - 152px);grid-template-columns:minmax(0,1fr);gap:0}
 body.single-home .deck-count{display:none}
 body.single-home .deck-help{flex:0 0 140px;white-space:normal;text-wrap:balance}
}
/* Small portrait screens keep the full deck and navigation within the viewport. */
@media(max-width:480px) and (max-height:620px){
 html body.single-home #home.hero{padding:2px 0;gap:4px}
 body.single-home .bloom-stage{gap:4px}
 body.single-home #replay-intro{width:28px;min-height:28px;padding:2px;font-size:16px}
 body.single-home #replay-intro span{display:none}
}