/* Community Watch 2.0.4 — first-paint integrity and brand-mark refinement. */

html[data-cw-boot="pending"] .cw-boot-screen {
    display: grid !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

html[data-cw-boot="pending"] body > :not(.cw-boot-screen):not(script):not(style):not(noscript) {
    visibility: hidden !important;
}

.cw-boot-screen {
    isolation: isolate;
    overflow: hidden;
    color: var(--cw-text, #f7f7f9);
}

.cw-boot-screen::before {
    content: "";
    position: absolute;
    inset: -18%;
    z-index: -1;
    background:
        radial-gradient(circle at 24% 18%, rgba(10, 132, 255, 0.16), transparent 34%),
        radial-gradient(circle at 78% 82%, rgba(94, 92, 230, 0.1), transparent 38%);
    filter: blur(18px);
    pointer-events: none;
}

html[data-kb-theme="light"] .cw-boot-screen::before {
    background:
        radial-gradient(circle at 24% 18%, rgba(10, 132, 255, 0.1), transparent 34%),
        radial-gradient(circle at 78% 82%, rgba(94, 92, 230, 0.065), transparent 38%);
}

.cw-boot-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    transform: translateZ(0);
}

.cw-boot-card::before {
    content: "";
    position: absolute;
    top: 1px;
    right: 14%;
    left: 14%;
    height: 1px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.44), transparent);
    opacity: 0.52;
    pointer-events: none;
}

.brand-mark {
    isolation: isolate !important;
    border: 0 !important;
    outline: 0 !important;
    background:
        radial-gradient(circle at 30% 0%, rgba(255, 255, 255, 0.38), transparent 43%),
        linear-gradient(145deg, #3aa8ff, #0878e8 56%, #0353b8) !important;
    background-clip: padding-box !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.19),
        inset 0 1px 0 rgba(255, 255, 255, 0.32),
        0 9px 20px rgba(0, 102, 214, 0.22) !important;
    clip-path: inset(0 round 13px);
    filter: saturate(0.96);
}

.brand-mark::before,
.brand-mark::after {
    content: none !important;
    display: none !important;
}

.brand-mark i {
    color: #fff !important;
    filter: none !important;
    text-shadow: none !important;
    transform: translateZ(0);
}

.brand:focus-visible .brand-mark {
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.36),
        0 0 0 3px rgba(10, 132, 255, 0.18),
        0 9px 20px rgba(0, 102, 214, 0.22) !important;
}

@media (max-width: 720px) {
    .brand-mark {
        clip-path: inset(0 round 12px);
        box-shadow:
            inset 0 0 0 1px rgba(255, 255, 255, 0.18),
            inset 0 1px 0 rgba(255, 255, 255, 0.3),
            0 7px 16px rgba(0, 102, 214, 0.19) !important;
    }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .cw-boot-card {
        background: #202025 !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    html[data-kb-theme="light"] .cw-boot-card {
        background: #f7f7fa !important;
    }
}

@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
    .cw-boot-card {
        background: #202025 !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    html[data-kb-theme="light"] .cw-boot-card {
        background: #f7f7fa !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cw-boot-screen,
    .cw-boot-card,
    .brand-mark {
        animation: none !important;
        transition: none !important;
    }
}