/* Shared app chrome: bottom tab bar used on every page of the OBS Android app. */
body{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))!important;-webkit-tap-highlight-color:transparent}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:repeat(5,1fr);
  background:#07153d;border-top:1px solid rgba(141,182,255,.22);
  padding:6px max(8px,env(safe-area-inset-left,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-right,0px))}
.tabbar a{display:grid;justify-items:center;gap:2px;min-height:56px;align-content:center;color:#a9b9de;text-decoration:none;
  font:600 13px "Barlow",system-ui,sans-serif;border-radius:10px}
.tabbar a svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tabbar a[aria-current="page"]{color:#f6c23e}
@media(max-width:350px){.tabbar a{font-size:12px}.tabbar{padding-left:max(4px,env(safe-area-inset-left,0px));padding-right:max(4px,env(safe-area-inset-right,0px))}}
.tabbar a:focus-visible{outline:3px solid #ffdf7a;outline-offset:-3px}
/* Netlify's free-plan "Powered by Netlify" badge is fixed at bottom:0; lift it above the tab bar so it never covers a tab. */
#nl-badge-frame{bottom:calc(72px + env(safe-area-inset-bottom,0px))!important}
