/* Light and dark mode button and automatic theme, shared by every website. See bb-theme.js. */
.bb-theme{all:initial;position:fixed;left:max(12px,env(safe-area-inset-left,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:2147482999;box-sizing:border-box;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(17,20,24,.86);border:1px solid rgba(255,255,255,.28);color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.28);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .15s,background .2s;-webkit-tap-highlight-color:transparent}
.bb-theme:hover{background:rgba(32,37,44,.94)}
.bb-theme:active{transform:scale(.94)}
.bb-theme:focus-visible{outline:3px solid #ffd54a;outline-offset:3px}
.bb-theme svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Sites that had their own theme switch: the shared button replaces it */
html[data-bb-native] #themeBtn:not(.bb-theme),html[data-bb-native] button#theme.theme{display:none!important}
/* Automatic theme for sites without their own colours for both modes: invert the page, then turn pictures,
   video, maps, embeds and the shared Branding Badge pieces back so they look as designed. */
html[data-bb-flip]{filter:invert(1) hue-rotate(180deg)}
html[data-bb-flip] :is(img,video,iframe,canvas,embed,object,[data-bb-keep],.bb-powered,.bb-demo,.bb-demo-toast,.bb-theme):not(:is([data-bb-keep],.bb-powered,.bb-demo,.bb-demo-toast,.bb-theme) *){filter:invert(1) hue-rotate(180deg)!important}
@media (prefers-reduced-motion:reduce){.bb-theme{transition:none}}
@media print{.bb-theme{display:none!important}html[data-bb-flip]{filter:none}}