/* One illustrated scene: the portal and the stela share the same masonry. */
body[data-view="account"]{--stela-width:min(100vw,max(1100px,calc(100svh * 1505 / 1045)));--su:calc(var(--stela-width) / 1505);background:#08121f;font-family:'Times New Roman',serif}
body[data-view="account"] .temple-layout{display:block;width:var(--stela-width);min-height:calc(1045 * var(--su));margin:0 auto;padding:0;background:url('assets/account-stela-v1/desktop.webp') center top/100% auto no-repeat}
body[data-view="account"] .temple-illustration{display:none}
body[data-view="account"] .temple-content{width:calc(650 * var(--su));margin-left:calc(810 * var(--su));padding:calc(174 * var(--su)) 0 0;background:none}
body[data-view="account"] .temple-header{inset:0 auto auto 50%;transform:translateX(-50%);width:var(--stela-width);height:calc(96 * var(--su));padding:calc(12 * var(--su)) calc(23 * var(--su)) 0 calc(16 * var(--su));grid-template-columns:1fr calc(240 * var(--su)) 1fr;gap:0;background:none}
body[data-view="account"] .temple-back{width:calc(158 * var(--su));margin:0}
body[data-view="account"] .temple-logo{width:calc(240 * var(--su));margin-top:calc(-12 * var(--su))}
body[data-view="account"] .temple-tools{gap:calc(8 * var(--su))!important;align-self:start}
body[data-view="account"] .temple-tools button{width:calc(70 * var(--su));height:calc(70 * var(--su))}
body[data-view="account"] #login{position:relative;height:calc(871 * var(--su))}
body[data-view="account"] #login>h1{position:absolute;top:0;width:100%;margin:0;font:700 calc(54 * var(--su))/1.1 'Times New Roman',serif;letter-spacing:0}
body[data-view="account"] #login>.intro{position:absolute;top:calc(68 * var(--su));width:100%;font-size:calc(25 * var(--su));line-height:1.12}
body[data-view="account"] .account-benefits{position:absolute;top:calc(151 * var(--su));left:calc(32 * var(--su));right:calc(32 * var(--su));margin:0;gap:calc(20 * var(--su));font-size:calc(23 * var(--su));line-height:1}
body[data-view="account"] .account-benefits .source-art{width:calc(var(--w) * var(--su));height:auto}
body[data-view="account"] .account-benefits li{gap:calc(6 * var(--su))}
body[data-view="account"] .login-cta{position:absolute;top:calc(316 * var(--su));width:100%}
.mobile-login-label{display:none}
body[data-view="account"] .signup{position:absolute;top:calc(456 * var(--su));width:100%;margin:0;font-size:calc(22 * var(--su))}
body[data-view="account"] .ornament{position:absolute;top:calc(510 * var(--su));left:50%;transform:translateX(-50%);width:calc(193 * var(--su));margin:0}
body[data-view="account"] .free-note{position:absolute;top:calc(536 * var(--su));width:100%;font-size:calc(20 * var(--su))!important;gap:calc(16 * var(--su))}
body[data-view="account"] .free-note .source-art{width:calc(47 * var(--su))}
body[data-view="account"] .pantheon-promo{position:absolute;top:calc(618 * var(--su));width:100%;margin:0}
body[data-view="account"] #notice{position:fixed;z-index:10;bottom:18px;left:50%;transform:translateX(-50%);width:min(90vw,650px);margin:0;box-shadow:0 6px 30px #0008}
@media(max-width:1000px){
 /* Nine-slice artwork keeps Zig and the stairs proportional; only blank stone grows. */
 body[data-view="account"]{--stela-width:min(100vw,640px);--mu:calc(var(--stela-width) / 1024)}
 body[data-view="account"] .temple-layout{min-height:100svh;background:none;border:solid transparent;border-width:calc(640 * var(--mu)) calc(140 * var(--mu)) calc(156 * var(--mu));border-image-source:url('assets/account-stela-v1/mobile.webp');border-image-slice:640 140 156 fill;border-image-repeat:stretch}
 body[data-view="account"] .temple-content{width:100%;margin:0;padding:20px 6px 24px;background:none}
 body[data-view="account"] #login{position:static;height:auto}
 body[data-view="account"] #login>h1,body[data-view="account"] #login>.intro,body[data-view="account"] .account-benefits,body[data-view="account"] .login-cta,body[data-view="account"] .signup,body[data-view="account"] .ornament,body[data-view="account"] .free-note,body[data-view="account"] .pantheon-promo{position:relative;inset:auto;transform:none;width:100%}
 body[data-view="account"] #login>h1{font-size:clamp(30px,5vw,42px);margin:0 0 12px}
 body[data-view="account"] #login>.intro{font-size:19px;line-height:1.25}
 body[data-view="account"] .account-benefits{font-size:16px;gap:8px;margin:24px 0}
 body[data-view="account"] .account-benefits li{gap:6px}
 body[data-view="account"] .account-benefits .source-art{width:calc(var(--w) * .67px)}
 body[data-view="account"] .login-cta>.source-art{display:none}
 body[data-view="account"] .mobile-login-label{display:flex;align-items:center;justify-content:center;min-height:80px;padding:12px 18px;color:#101923;background:url('assets/lobby-v2/button-primary.webp') center/100% 100% no-repeat;font-size:clamp(18px,3vw,24px);font-weight:700;text-transform:uppercase;line-height:1.1}
 body[data-view="account"] .login-cta{text-decoration:none}
 body[data-view="account"] .signup{font-size:16px;line-height:1.5;margin:18px 0}
 body[data-view="account"] .ornament{width:70%;margin:20px auto}
 body[data-view="account"] .free-note{font-size:15px!important;gap:8px}
 body[data-view="account"] .free-note .source-art{width:32px}
 body[data-view="account"] .pantheon-promo{margin-top:24px}
 body[data-view="account"] .promo-mobile{grid-template-columns:55px 1fr;padding:14px 0;gap:10px;background:none;border:0}
 body[data-view="account"] .promo-mobile .source-art{width:55px}
 body[data-view="account"] .promo-mobile strong{font-size:18px;margin-bottom:10px;text-wrap:balance}
 body[data-view="account"] .promo-action{font-size:16px}
 body[data-view="account"] .temple-header{height:76px;padding:8px;grid-template-columns:1fr 130px 1fr;background:none}
 body[data-view="account"] .temple-back{width:96px;margin-top:6px;min-height:44px;background:url('assets/lobby-v2/button-secondary.webp') center/100% 100% no-repeat;text-decoration:none;color:var(--cream)}
 body[data-view="account"] .temple-back>.source-art{display:none}
 body[data-view="account"] .profile-back-label{display:flex;align-items:center;justify-content:center;gap:5px;height:44px;font-size:15px}
 body[data-view="account"] .profile-back-label img{width:16px;height:20px;object-fit:contain}
 body[data-view="account"] .temple-logo{width:130px;margin-top:-8px}
 body[data-view="account"] .temple-tools{gap:2px!important}
 body[data-view="account"] .temple-tools button{width:44px;height:44px}
}
@media(max-width:360px){
 body[data-view="account"] .temple-header{grid-template-columns:1fr 105px 1fr}
 body[data-view="account"] .temple-logo{width:105px}
 body[data-view="account"] .temple-back{width:85px}
 body[data-view="account"] .temple-content{padding-inline:3px}
 body[data-view="account"] .account-benefits{font-size:15px;gap:3px}
}
@media(prefers-reduced-motion:reduce){body[data-view="account"] .login-cta:hover,body[data-view="account"] .pantheon-promo:hover{transform:none}}
body[data-view="account"].reduce-motion .login-cta:hover,body[data-view="account"].reduce-motion .pantheon-promo:hover{transform:none}
