.cf-server-announcement { position: fixed; z-index: 2147483000; top: max(8px, env(safe-area-inset-top)); left: 50%; width: min(660px, calc(100vw - 24px)); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 11px 12px; transform: translateX(-50%); border: 1px solid rgba(255, 223, 129, .85); border-radius: 14px; color: #fff3bf; background: linear-gradient(135deg, rgba(43, 27, 15, .97), rgba(76, 46, 18, .97)); box-shadow: 0 10px 32px rgba(0, 0, 0, .35); font-family: Inter, system-ui, sans-serif; }
.cf-server-announcement[hidden] { display: none; }
.cf-server-announcement-icon { font-size: 22px; }
.cf-server-announcement-copy { min-width: 0; display: grid; gap: 2px; }
.cf-server-announcement-copy strong { color: #ffd979; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.cf-server-announcement-copy span { overflow-wrap: anywhere; color: #fff7dd; font-size: 13px; line-height: 1.35; }
.cf-server-announcement-close { width: 30px; height: 30px; padding: 0; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; color: #fff; background: rgba(255,255,255,.08); font-size: 20px; cursor: pointer; }
.cf-maintenance { position: fixed; z-index: 2147483646; inset: 0; display: grid; place-items: center; padding: max(22px, env(safe-area-inset-top)) 18px max(22px, env(safe-area-inset-bottom)); background: radial-gradient(circle at 50% 20%, rgba(77, 107, 61, .82), rgba(12, 20, 15, .98) 67%); font-family: Inter, system-ui, sans-serif; }
.cf-maintenance[hidden] { display: none; }
.cf-maintenance-card { width: min(520px, 100%); padding: 30px 24px; border: 2px solid #d4a844; border-radius: 24px; color: #fff8df; background: linear-gradient(155deg, rgba(47, 57, 38, .98), rgba(24, 29, 23, .99)); box-shadow: 0 24px 70px rgba(0,0,0,.55), inset 0 0 0 3px rgba(255,255,255,.04); text-align: center; }
.cf-maintenance-emblem { width: 72px; height: 72px; display: grid; place-items: center; margin: 0 auto 14px; border: 2px solid #e9c665; border-radius: 50%; background: rgba(217, 168, 63, .13); font-size: 37px; }
.cf-maintenance-card h1 { margin: 0 0 12px; color: #ffdb79; font-size: clamp(25px, 7vw, 38px); }
.cf-maintenance-card p { margin: 0 auto; max-width: 430px; color: #f7efd8; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.cf-maintenance-card small { display: block; margin-top: 18px; color: #bfc9b7; }
.cf-maintenance-card button { min-height: 42px; margin-top: 18px; padding: 0 19px; border: 1px solid #e7c76e; border-radius: 12px; color: #372613; background: linear-gradient(#ffe69d, #dbae50); font: inherit; font-weight: 900; cursor: pointer; }
@media (max-width: 480px) {
  .cf-server-announcement { top: max(5px, env(safe-area-inset-top)); width: calc(100vw - 12px); padding: 9px; border-radius: 11px; }
  .cf-server-announcement-copy span { font-size: 12px; }
  .cf-maintenance-card { padding: 25px 18px; border-radius: 20px; }
}