/* 全屏星空画布 */
#sky-canvas {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
    pointer-events: none;
    display: block;
}

/* 内容区轻微遮罩，保证可读性 */
body.sky-enabled {
    background-color: transparent !important;
    background-image: none !important;
}

body.sky-enabled::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(2, 6, 23, 0.18) 0%,
        rgba(2, 6, 23, 0.28) 45%,
        rgba(2, 6, 23, 0.42) 100%
    );
    opacity: 1;
    animation: none;
}

/* 白天时遮罩更淡，避免把蓝天压太暗 */
html[data-sky-phase="day"] body.sky-enabled::before {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.08) 0%,
        rgba(241, 245, 249, 0.35) 55%,
        rgba(241, 245, 249, 0.55) 100%
    );
}

html[data-sky-phase="dawn"] body.sky-enabled::before,
html[data-sky-phase="dusk"] body.sky-enabled::before {
    background: linear-gradient(
        180deg,
        rgba(2, 6, 23, 0.12) 0%,
        rgba(2, 6, 23, 0.28) 50%,
        rgba(2, 6, 23, 0.45) 100%
    );
}

/* 半透明表面，让星空透出来一点 */
body.sky-enabled .nav-shell {
    background: color-mix(in srgb, var(--nav-surface) 78%, transparent) !important;
}

body.sky-enabled .sidebar {
    background: color-mix(in srgb, var(--nav-surface) 82%, transparent) !important;
}

body.sky-enabled .hero-atmosphere::after {
    opacity: 0.15;
}

body.sky-enabled .site-card.card,
body.sky-enabled #content-area .card {
    background: color-mix(in srgb, var(--nav-surface) 92%, transparent) !important;
}