/* Full-viewport world; desktop home gets a landscape composition. */
html,body{margin:0;width:100%;min-height:100%;background:#c8ecfb}
body{padding:0;display:block}
.shell{width:100%;max-width:none;min-height:100svh;min-height:100dvh;height:auto;margin:0;border:0;border-radius:0;box-shadow:none;overflow:clip;background-attachment:fixed}
.menu{min-height:100svh;min-height:100dvh;position:relative}
.reference-screen{min-height:100svh;min-height:100dvh;justify-content:center}
.reference-stage{container-type:inline-size}
.desktop-home-scene{display:none}
.menu:not(.reference-screen)>.nav{position:sticky;bottom:0;left:auto;transform:none;width:100%;flex-shrink:0}
.menu:not(.reference-screen)>.page{padding-bottom:36px;width:100%;max-width:1100px;margin-inline:auto}
.shell:has(.play:not([hidden])){width:100%;min-height:100svh;min-height:100dvh;height:auto;display:grid;place-items:center;overflow:clip}
.play{width:min(100%,62.5svh);width:min(100%,62.5dvh);height:auto;aspect-ratio:5/8;max-height:none;margin:0 auto;container-type:inline-size}
.play canvas{width:100%;height:auto;aspect-ratio:5/8}
.overlay{overflow:auto}
@media(min-width:768px){
 .reference-screen{justify-content:flex-start}
 .reference-screen>.page{width:100%;flex:1;display:grid;place-items:center;padding:0 0 100px}
 .reference-stage:not(.ref-home){width:min(100%,calc((100dvh - 100px)*2/3));min-width:360px}
 .reference-screen>.nav,.menu:not(.reference-screen)>.nav{position:fixed;left:0;bottom:0;transform:none;width:100%;height:94px;min-height:94px;margin:0;padding:12px max(24px,calc((100vw - 1050px)/2));border-radius:26px 26px 0 0;gap:20px}
 .reference-screen .nav button{font-size:17px;min-height:60px;gap:7px}
 .reference-screen .nav button span{height:29px}
 .reference-screen .nav button svg{width:28px;height:28px}
 .reference-screen .nav button[data-page="home"]{transform:translateY(-14px);margin-bottom:-14px}
 .reference-screen .nav button[data-page="home"] span{width:62px;height:62px;min-width:0;min-height:0}
 .reference-screen .nav button[data-page="home"] svg{width:32px;height:32px}
 .ref-home{width:100%;height:calc(100dvh - 100px);min-height:510px;aspect-ratio:auto;container-type:normal}
 .ref-home>.reference-art{display:none}
 .desktop-home-scene{display:block;position:absolute;left:7%;top:7%;width:43%;height:86%;object-fit:contain;filter:drop-shadow(0 18px 30px #16578022);pointer-events:none}
 .ref-home .ref-round{width:56px;height:56px;min-width:56px;aspect-ratio:1;top:24px;font-size:30px}
 .ref-home .ref-round svg{width:28px;height:28px}
 .ref-home .ref-account{left:28px;right:auto}
 .ref-home .ref-settings{right:28px;left:auto}
 .ref-home .ref-progress{left:104px;top:30px;width:230px;height:46px;font-size:17px;gap:12px;padding:8px 14px}
 .ref-home .ref-progress svg{width:30px;height:30px}
 .ref-home .ref-progress b{font-size:17px}
 .ref-home .ref-stage-label{left:auto;right:9%;top:27%;width:34%;height:auto;min-height:100px;padding:16px 24px;background:linear-gradient(#fff,#e8f6ff);border:2px solid #8db7d0;border-radius:30px;box-shadow:0 5px 0 #6f96b13d}
 .ref-home .ref-stage-label h1{font-size:clamp(28px,3vw,46px);margin:0 0 8px}
 .ref-home .ref-stage-label p{font-size:23px;margin:0}
 .ref-home .ref-play{left:auto;right:9%;top:53%;width:34%;height:76px;min-height:64px;font-size:clamp(24px,2.5vw,36px);padding:12px 24px;gap:22px}
 .ref-home .ref-play span{width:48px;height:48px;font-size:34px}
 .ref-home .ref-choose{left:auto;right:12%;top:calc(53% + 96px);width:28%;height:52px;font-size:21px;padding:9px 20px}
 .ref-home .ref-classic{left:auto;right:12%;top:calc(53% + 162px);width:28%;font-size:16px;padding:8px}
 .menu:not(.reference-screen){padding-bottom:100px}
 .shop-products{grid-template-columns:repeat(3,minmax(0,1fr))}
 .cosmetic-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:767px){
 .shell{padding-top:env(safe-area-inset-top)}
 .reference-screen .nav{padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .ref-round{aspect-ratio:1;height:auto!important}
}

.ref-home .store-link{border:1px solid #91b8ce;background:#f6fcfff2;border-radius:16px;text-decoration:none;font-weight:700;min-height:40px;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 3px 10px #123c5b18}
.ref-home .store-link:hover{background:#dff5ff;border-color:#168fbd}