/* /app/ route: the app itself fills the viewport (design v28). On wide screens it stays a phone-width column. */
body[data-page=app]{background:#050304;overflow:hidden;transition:background-color .4s ease}
body[data-page=app]:has(.ma-app[data-theme=light]){background:#e6dcd3}
body[data-page=app] main{padding:0!important;height:100dvh;min-height:0}
body[data-page=app] .app-demo-section{padding:0;width:100%;max-width:none;height:100%;margin:0}
body[data-page=app] .app-demo-section>.section-heading,body[data-page=app] .demo-explainer,body[data-page=app] .demo-stage-halo,body[data-page=app] .demo-statusbar,body[data-page=app] .demo-home-bar,body[data-page=app] .demo-expand,body[data-page=app] .demo-wide-link{display:none}
body[data-page=app] .app-demo-layout{display:block;height:100%}
body[data-page=app] .demo-stage{display:flex;justify-content:center;align-items:stretch;height:100%;min-height:0;padding:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden}
body[data-page=app] .demo-phone-slot{display:flex;justify-content:center;width:100%;height:100%;min-height:0}
body[data-page=app] .demo-phone.ma-app{width:min(440px,100%);height:100%;border:0;border-radius:0;box-shadow:none;contain:layout style}
body[data-page=app] .demo-phone.ma-app .demo-toolbar{height:48px;min-height:48px;padding-inline:18px;padding-top:env(safe-area-inset-top)}
body[data-page=app] .demo-phone.ma-app .demo-screen{padding:6px 22px 32px}
body[data-page=app] .demo-phone.ma-app .demo-dock{padding-bottom:max(8px,env(safe-area-inset-bottom));min-height:70px}
body[data-page=app] .ma-app h3.ma-title:not(.ma-title--sm):not(.ma-title--md):not(.ma-muted){font-size:28px}body[data-page=app] .ma-app .ma-score-n{font-size:106px}body[data-page=app] .ma-app .ma-insight{font-size:21px}
.app-sr-title{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.demo-exit{display:none}
body[data-page=app] .demo-exit{display:grid;place-items:center;width:44px;height:44px;margin-left:-10px;color:var(--ma-acc);border-radius:12px;-webkit-tap-highlight-color:transparent}
body[data-page=app] .demo-exit svg{width:22px;height:22px}
body[data-page=app] [data-demo-back]:not([hidden])+.demo-exit{display:none}
@media(min-width:761px){body[data-page=app] .demo-phone.ma-app{box-shadow:-1px 0 0 #2a2023,1px 0 0 #2a2023,0 0 80px #5a111926}body[data-page=app]:has(.ma-app[data-theme=light]) .demo-phone.ma-app{box-shadow:-1px 0 0 #dccfc5,1px 0 0 #dccfc5,0 0 80px #5a111914}}
@media(max-width:360px){body[data-page=app] .demo-phone.ma-app .demo-screen{padding-inline:15px}body[data-page=app] .ma-app .ma-score-n{font-size:84px}}
@media(prefers-reduced-motion:reduce){body[data-page=app] *{scroll-behavior:auto!important}body[data-page=app] .demo-exit:active{transform:none}}
@media(scripting:none){body[data-page=app] .demo-dock{display:none}}
