@import url("https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&display=swap");
.announcement-banner { width: 100%; max-height: 120px; overflow: hidden; transition: max-height 0.3s ease, opacity 0.3s ease; }

.announcement-banner.announcement-banner-hiding { max-height: 0; opacity: 0; }

.announcement-banner-inner { display: flex; align-items: center; gap: 10px; max-width: 1200px; margin: 0 auto; padding: 10px 24px; }

.announcement-banner-icon { display: flex; align-items: center; }

.announcement-banner-icon svg { flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; width: 18px; height: 18px; }

.announcement-banner-message { flex: 1; line-height: 1.5; font-size: 0.9rem; }

a.announcement-banner-message { color: inherit; text-decoration: underline; }

a.announcement-banner-message:hover { opacity: 0.8; }

.announcement-banner-close { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; color: inherit; background: none; opacity: 0.6; border: none; border-radius: 6px; cursor: pointer; transition: opacity 0.15s ease, background 0.15s ease; }

.announcement-banner-close svg { flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; width: 14px; height: 14px; }

.announcement-banner-close:hover { background: rgba(0, 0, 0, 0.08); opacity: 1; }

.announcement-banner-info { color: #0366d9; background: rgba(45, 141, 252, 0.08); border-bottom: 1px solid rgba(45, 141, 252, 0.25); }

.announcement-banner-warning { color: #333; background: rgba(240, 165, 0, 0.12); border-bottom: 1px solid rgba(240, 165, 0, 0.4); }

.announcement-banner-warning .announcement-banner-icon { color: #c78900; }

.announcement-banner-emergency { color: #d62c1a; background: rgba(231, 76, 60, 0.08); border-bottom: 1px solid rgba(231, 76, 60, 0.25); }

@media (max-width: 576px) { .announcement-banner-inner { gap: 8px; padding: 8px 16px; } .announcement-banner-message { font-size: 0.8rem; } }