/* Keep the offer, scene and both actions on the same centred rails. */
body[data-screen="home"] .scene-column{width:min(640px,100%,calc(100svh - 222px))}
body[data-screen] .header-inner{width:min(640px,100%,calc(100svh - 222px));container-type:inline-size}
body[data-screen] .site-header{padding-inline:16px}
.service-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%}
.service-actions .massage-start{display:grid;grid-template-columns:20px minmax(0,1fr) 20px;align-items:center;width:100%;max-width:none;margin:0;min-height:60px;padding:12px 18px;gap:8px;font-size:19px}
.service-actions .gentle-start{background:#cce5db;box-shadow:0 6px 0 #30334f;color:#17314f}
.service-actions .start-arrow{width:16px;height:16px;margin:0;justify-self:end}.service-actions svg{width:19px;height:19px}.service-actions .muscle-icon{width:23px;height:23px;justify-self:start}
.massage-scene[data-service="gentle"] .idle-sheet{animation-duration:2.3s}
.massage-scene[data-service="gentle"] .therapist-dialogue{font-size:14px;left:auto;right:4%;width:46%;max-width:52%;white-space:normal;padding:8px 11px;line-height:1.5;animation:none}
body[data-screen="game"] .game-screen{width:min(640px,calc(100% - 32px));margin:16px auto 0}
body[data-screen="game"] .header-inner{width:min(640px,100%)}
body[data-screen="game"]:has(#sales-page:not([hidden])) .header-inner{width:min(1100px,100%)}
@media(max-width:700px){
 body[data-screen="home"] .scene-column,body[data-screen="home"] .header-inner{width:min(480px,100%,calc(100svh - 216px))}
 .service-actions{gap:10px}.service-actions .massage-start{min-height:54px;padding:10px 12px;font-size:17px}
 .service-actions .start-arrow{display:block;visibility:hidden}.service-actions .massage-start{justify-content:center}
 body[data-screen="game"] .game-screen{width:calc(100% - 24px);margin-top:10px}
 body[data-screen="game"] .site-header{padding-inline:12px}
 .massage-scene[data-service="gentle"] .therapist-dialogue{font-size:11px;max-width:49%;padding:6px 8px}
}
@container(max-width:580px){
 .header-offer{display:block}.header-offer-copy strong{font-size:16px}.header-offer{gap:8px}
 .header-offer-copy>small{font-size:9px;margin:3px 0 0}.header-offer-price{padding-left:30px;margin-top:4px}
 .header-offer-price>strong{font-size:30px}.header-offer-price>span{font-size:10px}
}
