/* Accessibility guardrails for dark workspace modules. */
.sk-offline-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #f7fbff !important;
  background: radial-gradient(circle at 88% 20%, rgba(30, 194, 226, .32), transparent 28rem), linear-gradient(128deg, #071b38 0%, #0b3e69 54%, #075e8e 100%) !important;
  border: 1px solid rgba(123, 218, 255, .30);
  box-shadow: 0 26px 64px rgba(5, 21, 45, .22);
}
.sk-offline-hero::before { content: ""; position: absolute; inset: auto -8rem -13rem auto; width: 32rem; height: 32rem; z-index: -1; border: 1px solid rgba(201, 244, 255, .26); border-radius: 50%; box-shadow: 0 0 0 3.3rem rgba(201, 244, 255, .04), 0 0 0 6.6rem rgba(201, 244, 255, .03); }
.sk-offline-hero h1, .sk-offline-hero h2, .sk-offline-hero h3, .sk-offline-hero strong, .sk-offline-hero b { color: #ffffff !important; text-shadow: 0 2px 18px rgba(0, 16, 40, .18); }
.sk-offline-hero p, .sk-offline-hero small, .sk-offline-hero .muted { color: #dceefe !important; }
.sk-offline-hero .sk-eyebrow { color: #8cecff !important; font-weight: 800; letter-spacing: .13em; }
.sk-offline-hero .sk-eyebrow::before { background: #4de3ff !important; }
.sk-offline-hero .btn, .sk-offline-hero button { min-height: 3.25rem; font-weight: 800; }
.sk-offline-hero .btn:not(.secondary), .sk-offline-hero button:not(.secondary) { color: #ffffff !important; background: #3169ce !important; border-color: #4d87ed !important; box-shadow: 0 12px 28px rgba(3, 23, 73, .28); }
.sk-offline-hero .btn.secondary, .sk-offline-hero button.secondary { color: #ffffff !important; background: rgba(255, 255, 255, .12) !important; border: 1px solid rgba(231, 248, 255, .38) !important; box-shadow: none !important; }
.sk-offline-hero .btn:hover, .sk-offline-hero button:hover { color: #ffffff !important; transform: translateY(-1px); filter: brightness(1.08); }
.sk-offline-hero .btn:focus-visible, .sk-offline-hero button:focus-visible { outline: 3px solid #7cecff; outline-offset: 3px; }
@media (max-width: 760px) { .sk-offline-hero { padding: 2rem 1.35rem !important; } .sk-offline-hero::before { width: 19rem; height: 19rem; right: -7rem; bottom: -9rem; } }
