*,*::before,*::after{box-sizing:border-box}
html,body,#root{width:100%;max-width:100%;min-width:0;min-height:100%;margin:0;overflow-x:hidden;box-sizing:border-box}
#root{box-sizing:border-box}
#root>div{width:100%;max-width:100%;min-width:0}
html[data-theme="dark"] #root{filter:invert(.91) hue-rotate(180deg)}
html[data-theme="dark"] #root img,html[data-theme="dark"] #root iframe{filter:invert(1) hue-rotate(180deg)}
/* React Native Web may render Image as a wrapper rather than a plain img.
   Apply the image counter-filter to the branded element itself, and avoid a
   second counter-filter on a nested implementation img. */
html[data-theme="dark"] #root [data-testid="hopari-header-logo"],html[data-theme="dark"] #root [data-testid="hopari-auth-logo"]{filter:invert(1) hue-rotate(180deg)!important}
html[data-theme="dark"] #root [data-testid="hopari-header-logo"] img,html[data-theme="dark"] #root [data-testid="hopari-auth-logo"] img{filter:none!important}
html[data-theme="dark"]{color-scheme:dark}
#root>div:first-child{padding-top:calc(env(safe-area-inset-top,0px) + 14px);padding-bottom:0;background:#F6F5EF}
html,body,#root{touch-action:pan-y}
input,textarea,select{-webkit-text-size-adjust:100%}
iframe{display:block;max-width:100%;box-sizing:border-box}

#root>*{max-width:100vw}
/* Keep the app in the device viewport; only the content column scrolls. */
html,body,#root{height:100%;min-height:0;overflow:hidden}
#root{height:100vh;height:100dvh;max-height:100dvh}
#root>div{height:100%;max-height:100%;overflow:hidden}

/* In iOS Home Screen mode SafeAreaView otherwise reserves the bottom inset
   outside the navigation bar, leaving an unused white strip below it. */
html[data-bf-standalone="true"] #root>div:first-child{padding-bottom:0!important}