/* Phone layout for the installable portal. Keep the existing BECCA sky and branding. */
html{-webkit-text-size-adjust:100%}
button,input,select{font-size:16px}
@media(max-width:760px){
  .access-page header{padding:calc(12px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));gap:10px;flex-wrap:wrap}
  .access-page header .software-logo{width:144px}
  .access-page header b{font-size:13px}
  .access-page header nav{margin-left:auto}
  .access-page main{padding:10px max(16px,env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
  .access-page h1{font-size:clamp(28px,8vw,36px);line-height:1.18}
  .access-page .grid{gap:0}
  .access-page section,.access-page details{margin:12px 0;padding:18px;border-radius:15px;background:#fffffff2}
  .access-page button,.access-page summary{min-height:44px}
  .access-page input{min-height:46px}
  .access-page #message{margin-top:16px}
  .portal-page .rail{padding:calc(12px + env(safe-area-inset-top)) 16px 10px;background:#fffffff2}
  .portal-page .rail nav{margin-top:8px;gap:5px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .portal-page .rail nav::-webkit-scrollbar{display:none}
  .portal-page .rail nav a{min-height:44px;align-items:center}
  .portal-page .workspace header{padding:10px 16px;min-height:55px}
  .portal-page .header-actions{width:100%;justify-content:flex-end;gap:8px}
  .portal-page .header-actions strong{max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .portal-page .header-actions .avatar{width:30px;height:30px;flex:none}
  .portal-page main{padding:18px 16px 28px}
  .portal-page .page-heading{align-items:stretch;flex-direction:column;gap:12px}
  .portal-page .page-heading button{align-self:flex-start;min-height:44px}
  .portal-page .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .portal-page .metric-value{font-size:23px;overflow-wrap:anywhere}
  .portal-page .card{padding:16px}
  .portal-page .sequence{flex-wrap:wrap}
  .portal-page .sequence span{flex:1 1 42%;text-align:center}
  .portal-page footer{padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
  .portal-cloud-layer{animation:none;will-change:auto}
  .portal-cloud-layer.back,.portal-cloud-layer.front{display:none}
  .portal-cloud-layer.mid{top:62%;width:100%;opacity:.6}
  .portal-cloud-layer.mid .portal-cloud-group{width:100%}
  .portal-cloud-layer.mid .portal-cloud-group:nth-child(2){display:none}
}
@media(max-width:380px){.portal-page .metrics{grid-template-columns:1fr}.portal-page .steps{grid-template-columns:1fr}}