.academy-pwa-banner {
	position: fixed;
	left: 12px;
	right: 12px;
	bottom: calc(12px + env(safe-area-inset-bottom));
	z-index: 9990;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 10px 10px 12px;
	background: #0E1B33;
	color: #FFFFFF;
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(14, 27, 51, 0.28);
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
	animation: academy-pwa-in 220ms ease-out;
}

 
@media (max-width: 820px) {
	.academy-pwa-banner.in-panel { bottom: calc(80px + env(safe-area-inset-bottom)); }
}

.academy-pwa-banner img { width: 40px; height: 40px; border-radius: 8px; flex-shrink: 0; }
.academy-pwa-banner .apb-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.academy-pwa-banner .apb-text strong { font-size: 13.5px; line-height: 1.3; }
.academy-pwa-banner .apb-text span { font-size: 12px; line-height: 1.35; color: #C9D1E4; }
.academy-pwa-banner .apb-install {
	flex-shrink: 0;
	border: 0;
	border-radius: 4px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 700;
	color: #FFFFFF;
	background: linear-gradient(135deg, #2F5FE0, #8B2FD9);
	cursor: pointer;
}
.academy-pwa-banner .apb-close {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #C9D1E4;
	cursor: pointer;
}
.academy-pwa-banner .apb-icon, .academy-pwa-guide .apb-icon { display: inline-flex; }

.academy-pwa-guide {
	position: fixed;
	inset: 0;
	z-index: 9995;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding: 16px;
	background: rgba(14, 27, 51, 0.55);
}
.academy-pwa-guide .apg-box {
	width: 100%;
	max-width: 420px;
	margin-bottom: env(safe-area-inset-bottom);
	padding: 20px;
	background: #FFFFFF;
	color: #0E1B33;
	border-radius: 8px;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}
.academy-pwa-guide h3 { margin: 0 0 14px; font-size: 16px; }
.academy-pwa-guide ol { list-style: none; margin: 0 0 18px; padding: 0; }
.academy-pwa-guide li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; font-size: 14px; border-top: 1px solid #E5E7EF; }
.academy-pwa-guide li .apb-icon { color: #2F5FE0; flex-shrink: 0; }
.academy-pwa-guide .apg-ok {
	width: 100%;
	border: 0;
	border-radius: 4px;
	padding: 12px;
	font-size: 14px;
	font-weight: 700;
	color: #FFFFFF;
	background: linear-gradient(135deg, #2F5FE0, #8B2FD9);
	cursor: pointer;
}

@keyframes academy-pwa-in {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.academy-pwa-banner { animation: none; }
}
