/* A fixed outer document prevents iOS rubber-band/page scrolling. */
html,body{position:fixed;inset:0;width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}
body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
:root{--breethr-surface:var(--breethr-launch-surface,#FFFFFF)}
:root:has(#app button[aria-label="Dark mode"][aria-checked="true"]),
:root:has(#app iframe[src*="theme=dark"]){--breethr-surface:#0D0D0D}
:root:has(#onboarding[data-theme="dark"]){--breethr-surface:#0D0D0E}
:root:has(#onboarding[data-theme="light"]){--breethr-surface:#FFFFFF}
#breethr-browser-edge{display:none}
@media(max-width:600px),(display-mode:standalone){
  #breethr-browser-edge{display:block;position:fixed;top:0;left:0;width:100%;height:max(8px,env(safe-area-inset-top,0px));background:var(--breethr-surface);pointer-events:none;z-index:1100}
}
/* Login owns the screen until authentication finishes; do not expose its underlay. */
:root:has(#onboarding) #stage{visibility:hidden}
#stage{position:fixed;inset:auto;left:var(--viewport-left,0px);top:var(--viewport-top,0px);width:var(--viewport-width,100%);height:100%;height:var(--viewport-height,100dvh);box-sizing:border-box;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);overflow:hidden}
html[data-breethr-embedded] #stage{padding:0}
#app{flex:none;min-width:0;min-height:0;max-width:100%;max-height:100%}
#app>div>nav{flex-shrink:0}
/* Keep navigation at the same physical size regardless of the dashboard's scale. */
#app>div>nav{box-sizing:border-box;height:calc(64px / var(--s,1));min-height:calc(64px / var(--s,1));padding:calc(8px / var(--s,1))!important;flex:none;align-items:stretch}
#app>div>nav>button,#app>div>nav>a{box-sizing:border-box;min-height:0!important;padding:0!important;gap:calc(4px / var(--s,1))!important;font-size:calc(14px / var(--s,1))!important;line-height:calc(17px / var(--s,1))!important}
#app>div>nav>button>svg,#app>div>nav>a>svg{width:calc(26px / var(--s,1));height:calc(26px / var(--s,1));flex:none}
/* Login is not transformed: 16px inputs also avoid Safari's automatic focus zoom. */
#onboarding .ob-field input{font-size:16px}
#onboarding{container-type:size}
@container (max-height:620px){
  #onboarding .ob-auth .ob-auth-wave-wrap{flex:0 1 70px;margin-top:0}
  #onboarding .ob-auth .ob-auth-pill{min-height:0;height:auto;max-height:100%;padding:22px}
  #onboarding .ob-auth .ob-auth-pill-wrap{flex:1;min-height:0}
  #onboarding .ob-auth .ob-auth-title{margin-bottom:18px;font-size:28px}
}
@container (max-height:480px){
  #onboarding .ob-auth .ob-auth-wave-wrap{display:block;flex:0 1 40px;margin:0 -18px 8px}
  #onboarding .ob-auth .ob-top{display:none}
  #onboarding .ob-auth .ob-auth-pill{padding:16px 22px;border-radius:24px}
  #onboarding .ob-auth .ob-auth-title{margin:0 0 12px;font-size:24px}
  #onboarding .ob-auth .ob-fields{gap:12px}
  #onboarding .ob-auth .ob-auth-submit{margin-top:14px}
}
/* Long account forms retain their own scroll area when the keyboard is open. */
#onboarding .ob-auth #ob-auth-form{min-height:0;overflow-y:auto;overscroll-behavior:contain}
body #cloud-modal{inset:auto;left:var(--viewport-left,0px);top:var(--viewport-top,0px);width:var(--viewport-width,100%);height:var(--viewport-height,100dvh);padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
body #cloud-modal section{max-height:100%;overscroll-behavior:contain}
@media(max-width:600px){html,body,#stage{background:var(--breethr-surface)}}
/* Authentication uses one plain surface, with no decorative frame or animated aura. */
#onboarding .ob-shell.ob-auth{background:var(--ob-bg);animation:none}
#onboarding .ob-auth .ob-auth-glow{display:none}
#onboarding .ob-auth .ob-auth-pill{width:min(100%,320px);height:auto;max-height:100%;min-height:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
#onboarding .ob-auth .ob-auth-title{text-align:left;font-size:clamp(26px,4cqh,32px);line-height:1.1;margin:0 0 24px;letter-spacing:-.03em}
#onboarding .ob-auth #ob-auth-form{display:flex;flex-direction:column;gap:18px}
#onboarding .ob-auth .ob-fields{gap:16px}
#onboarding .ob-auth .ob-field{gap:8px}
#onboarding .ob-auth .ob-field input{height:48px;flex:none;background:var(--ob-bg);font-size:16px}
#onboarding .ob-auth .ob-auth-submit{margin:0;min-height:48px;flex:none}
#onboarding .ob-auth .ob-error:empty{display:none}
