/* — Connectivity bar — */
.gm-conn-bar {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 2147483640;
	height: 0;
	overflow: hidden;
	background: #d93025;
	color: #fff;
	transition: height 750ms cubic-bezier(.16, 1, .3, 1), background-color 200ms ease-out;
	will-change: height;
}
.gm-conn-bar--online { background: #1e8e3e; }

.gm-conn-bar__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 24px;
	padding: 0 32px;
	padding-top: env(safe-area-inset-top, 0px);
	box-sizing: content-box;
	font: 500 13px/1 Roboto, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.gm-conn-bar [class*="bb-icon-"] { font-size: 14px; line-height: 1; flex: none; }

.gm-conn-bar__refresh {
	cursor: pointer;
	color: #fff;
	text-decoration: underline;
	font-weight: 600;
	background: transparent;
	border: 0;
	font: inherit;
	padding: 0;
}

.gm-conn-bar__close {
	position: absolute;
	right: 0; top: 0;
	width: 32px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 0;
	cursor: pointer;
	color: #fff;
	opacity: .85;
	margin-top: env(safe-area-inset-top, 0px);
}
.gm-conn-bar__close [class*="bb-icon-"] { font-size: 18px; }
.gm-conn-bar__close:hover { opacity: 1; }

body { transition: padding-top 750ms cubic-bezier(.16, 1, .3, 1); }

body.gm-is-offline .gm-conn-bar,
body.gm-conn-bar-show .gm-conn-bar {
	height: 24px;
	height: calc(24px + env(safe-area-inset-top, 0px));
}

body.gm-is-offline,
body.gm-conn-bar-show {
	padding-top: 24px;
	padding-top: calc(24px + env(safe-area-inset-top, 0px));
}

/* — TWA / PWA mode-specific overrides — */
.twa #page .twa-link {
	border-radius: 100px;
	background-color: #e2e7ed;
	text-align: center;
	padding: 5px 12px;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	color: #728188;
}
.bb-dark-theme.twa #page .twa-link {
	background-color: #52576d;
	color: #a2b1b8;
}
.twa .twa-buy,
.twa .install-pwa,
.pwa .install-pwa { display: none; }
.twa-show { display: none; }
.twa .twa-show { display: initial; }
.twa .twa-text {
	display: block;
	margin: 0 auto;
	text-align: center;
}