/* Final public stability authority: top Dynamic Island notice and fail-open Checker. */

/* Checker navigation stays above its boot canvas, but entrance motion is owned
   by the same shared navigation lifecycle used by Hub, Status and VIP. */
html[data-kb-boot-page="checker"][data-kb-boot="pending"] body > .kb-liquid-nav {
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 2147483001 !important;
}

/* The Checker wordmark is one optical unit. Scale it rather than splitting it. */
body.kb-surface-checker main h1 {
    display: block !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    font-size: clamp(1.45rem, 7vw, 3rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -.05em !important;
}

/* An explicit AdSense filled state always wins over a stale support fallback.
   This also covers late fills after the canonical no-fill grace period. */
body :is(.kb-ad-shell,.kb156-ad-shell)[data-kb-ad-state="filled"] + .kb-support-card[data-kb-support-fallback] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Protection feedback must always arrive at the top, independent of the older
   mobile bottom-sheet placement. The capsule expands just enough for two lines. */
#kb-protection-notice {
    top: max(12px, calc(env(safe-area-inset-top, 0px) + 8px)) !important;
    bottom: auto !important;
    width: min(430px, calc(100vw - 24px)) !important;
    min-height: 64px !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 11px !important;
    padding: 10px 16px 10px 11px !important;
    border-radius: 999px !important;
    -webkit-clip-path: inset(0 round 999px) !important;
    clip-path: inset(0 round 999px) !important;
    transform: translate3d(-50%, -12px, 0) scale(.965) !important;
}
#kb-protection-notice.is-visible {
    transform: translate3d(-50%, 0, 0) scale(1) !important;
}
#kb-protection-notice .kb-protection-icon {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
}
#kb-protection-notice .kb-protection-icon svg {
    width: 20px !important;
    height: 20px !important;
}
#kb-protection-notice strong {
    margin-bottom: 2px !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
}
#kb-protection-notice .kb-protection-message {
    font-size: 11px !important;
    line-height: 1.34 !important;
}

/* Checker has its own state machine. The legacy full-page loading boolean is
   never allowed to become a later-time visibility owner again. */
body.kb-surface-checker > [x-show="isPageLoading"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
body.kb-surface-checker main[x-show="!isPageLoading"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: calc(100svh - 112px) !important;
}

/* The direct Checker no longer loads the watchdog that used to stamp
   .kb-checker-content-ready. Absence of that retired marker must never hide a
   live AdSense slot. Keep the loading shell measurable so responsive ads can
   calculate their width; suppression is now explicit and temporary only. */
body.kb-surface-checker:not(.kb-checker-resume-repairing):not(.kb-checker-ad-suppressed)
    :is(.kb-ad-shell,.kb156-ad-shell,.kb157-ad-shell):is(
        [data-kb-ad-state="loading"],
        [data-kb-ad-state="filled"]
    ):not([data-kb-checker-suppressed="true"]) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    min-height: 90px !important;
    height: auto !important;
    overflow: visible !important;
}
body.kb-surface-checker.kb-checker-resume-repairing :is(
    .kb-ad-shell,
    .kb156-ad-shell,
    .kb157-ad-shell,
    [data-kb-ad-state],
    .kb-ad-empty
),
body.kb-surface-checker.kb-checker-ad-suppressed :is(
    .kb-ad-shell,
    .kb156-ad-shell,
    .kb157-ad-shell,
    [data-kb-ad-state],
    .kb-ad-empty
),
body.kb-surface-checker [data-kb-checker-suppressed="true"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

@media (max-width: 760px) {
    #kb-protection-notice {
        top: max(10px, calc(env(safe-area-inset-top, 0px) + 7px)) !important;
        bottom: auto !important;
        width: min(370px, calc(100vw - 20px)) !important;
        min-height: 60px !important;
        grid-template-columns: 36px minmax(0, 1fr) !important;
        gap: 10px !important;
        padding: 9px 14px 9px 10px !important;
    }
    #kb-protection-notice .kb-protection-icon {
        width: 36px !important;
        height: 36px !important;
    }
    body.kb-surface-checker main[x-show="!isPageLoading"] {
        min-height: calc(100svh - 98px) !important;
    }
    body.kb-surface-checker main h1 {
        font-size: clamp(1.35rem, 6.6vw, 2.15rem) !important;
    }
}

@media (max-width: 360px) {
    #kb-protection-notice {
        width: calc(100vw - 16px) !important;
        grid-template-columns: 34px minmax(0, 1fr) !important;
        gap: 9px !important;
        padding-inline: 9px 12px !important;
    }
    #kb-protection-notice .kb-protection-icon {
        width: 34px !important;
        height: 34px !important;
    }
    #kb-protection-notice .kb-protection-message {
        font-size: 10.5px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #kb-protection-notice {
        transform: translate3d(-50%, 0, 0) !important;
    }
}


/* Final mobile polish: compact empty states and stable cards. */

/* Never retain a measured card-list height after filtering to zero results. */
body.kb-surface-hub #keybox-list .kb-hub-list-viewport,
body.kb-surface-hub #keybox-list [class~="min-h-[300px]"] {
    height: auto !important;
    min-height: 0 !important;
}
body.kb-surface-hub #keybox-list [x-show="!isLoading && items.length === 0"] {
    min-height: 0 !important;
    padding-block: clamp(42px, 9vw, 64px) !important;
}

/* Scale the one Checker wordmark instead of wrapping it on narrow phones. */
@media (max-width: 560px) {
    body.kb-surface-checker h1 {
        max-width: 100% !important;
        font-size: clamp(1.45rem, 7vw, 1.875rem) !important;
        line-height: 1.15 !important;
        letter-spacing: -.04em !important;
        white-space: nowrap !important;
    }
}

/* Touch browsers can retain :hover after an answer tap. Selection is conveyed
   by the border and background; no outer shadow leaks onto quiz cards. */
html[data-kb-boot-page="quiz"] :is(.hint, .option-body) {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07) !important;
}
html[data-kb-boot-page="quiz"] .option input:checked + .option-body {
    box-shadow:
        inset 0 0 0 1px rgba(68, 171, 255, .55),
        inset 0 1px 0 rgba(255, 255, 255, .15) !important;
}
html[data-kb-theme="light"][data-kb-boot-page="quiz"] .option input:checked + .option-body {
    box-shadow:
        inset 0 0 0 1px rgba(0, 122, 255, .36),
        inset 0 1px 0 #fff !important;
}
html[data-kb-boot-page="quiz"] .option input:checked + .option-body .radio {
    box-shadow: none !important;
}

/* The shared liquid lens needs a positioned control, but mobile already uses
   fixed positioning. Keep the original top-right layout instead of turning the
   control into a full-width flex row. */
.kb-theme-switch-desktop {
    position: relative !important;
}
@media (max-width: 760px) {
    body > .kb-theme-switch-mobile {
        position: fixed !important;
        top: calc(12px + env(safe-area-inset-top, 0px)) !important;
        right: 12px !important;
        left: auto !important;
        bottom: auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        transform: none !important;
    }
}

/* A real element owns the selected material once Foundation hydrates. The
   original pseudo remains the first-frame fallback and disappears atomically. */
.kb-theme-switch.kb-theme-lens-ready::before {
    content: none !important;
    display: none !important;
    animation: none !important;
}
.kb-theme-lens {
    position: absolute !important;
    z-index: 0 !important;
    top: 3px !important;
    left: 3px !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px;
    background: var(--kb-solid) !important;
    box-shadow: 0 4px 14px var(--kb-glow), inset 0 1px 0 rgba(255,255,255,.08) !important;
    pointer-events: none !important;
    transform-origin: center !important;
    will-change: transform, scale, border-radius !important;
}
.kb-theme-switch button {
    position: relative !important;
    z-index: 1 !important;
}
@keyframes kbThemeRealDarkFlow {
    0%,100% { scale: 1 1; border-radius: 10px; }
    38% { scale: 1.14 .90; border-radius: 12px 8px 12px 8px; }
    70% { scale: .97 1.06; border-radius: 9px 11px 9px 11px; }
}
@keyframes kbThemeRealLightFlow {
    0%,100% { scale: 1 1; border-radius: 10px; }
    38% { scale: 1.14 .90; border-radius: 12px 8px 12px 8px; }
    70% { scale: .97 1.06; border-radius: 9px 11px 9px 11px; }
}
@keyframes kbThemeRealSystemFlow {
    0%,100% { scale: 1 1; border-radius: 10px; }
    38% { scale: 1.14 .90; border-radius: 12px 8px 12px 8px; }
    70% { scale: .97 1.06; border-radius: 9px 11px 9px 11px; }
}
@media (prefers-reduced-motion: no-preference) {
    html[data-kb-theme-preference="dark"] .kb-theme-lens {
        animation: kbThemeRealDarkFlow 460ms cubic-bezier(.22,1,.36,1) both !important;
    }
    html[data-kb-theme-preference="light"] .kb-theme-lens {
        animation: kbThemeRealLightFlow 460ms cubic-bezier(.22,1,.36,1) both !important;
    }
    html[data-kb-theme-preference="system"] .kb-theme-lens {
        animation: kbThemeRealSystemFlow 460ms cubic-bezier(.22,1,.36,1) both !important;
    }
}
@media (prefers-reduced-motion: reduce) {
    .kb-theme-lens {
        scale: 1 1 !important;
        will-change: auto !important;
    }
}