/* Time-based dynamic scene background — rendered by public/js/time-scene-canvas.js */
.time-scene-canvas {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    width: 100dvw;
    height: 100dvh;
    display: block;
    pointer-events: none;
    z-index: 0;
}

body.site-time-scene,
body.maintenance-page.time-scene-maintenance {
    min-height: 100vh;
    color-scheme: dark;
    background: #06101d !important;
}

body.site-time-scene .time-scene-canvas,
body.maintenance-page.time-scene-maintenance .time-scene-canvas {
    z-index: 0;
    opacity: 1;
}

/* Portal layers above canvas */
body.site-time-scene .header,
body.site-time-scene .container,
body.site-time-scene .mobile-banner,
body.site-time-scene .site-footer,
body.site-time-scene .login-modal {
    position: relative;
    z-index: 2;
}

body.site-time-scene .header {
    z-index: 1000;
    background: rgba(4, 10, 22, 0.68);
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
    box-shadow: 0 16px 42px rgba(2, 8, 23, 0.34);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

body.site-time-scene .header .container,
body.site-time-scene .header-inner,
body.site-time-scene .header-right,
body.site-time-scene .nav-account-menu {
    position: relative;
    z-index: 1001;
}

body.site-time-scene .nav-account-dropdown {
    z-index: 1200;
}

body.site-time-scene .layout {
    position: relative;
    z-index: 2;
}

body.site-time-scene .hero-slider,
body.site-time-scene .sidebar-card,
body.site-time-scene .info-card,
body.site-time-scene .sidebar-popular-card,
body.site-time-scene .card,
body.site-time-scene .search-results-banner,
body.site-time-scene .empty,
body.site-time-scene .site-footer-shell,
body.site-time-scene .login-modal-dialog {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.72), rgba(8, 14, 28, 0.84));
    border: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 24px 70px rgba(2, 8, 23, 0.42), 0 0 70px rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    color: #f1f5f9;
}

body.site-time-scene .hero-slider,
body.site-time-scene .sidebar-card,
body.site-time-scene .info-card,
body.site-time-scene .sidebar-popular-card,
body.site-time-scene .card,
body.site-time-scene .search-results-banner,
body.site-time-scene .empty {
    border-radius: 22px;
    overflow: hidden;
}

body.site-time-scene .hero-copy h2,
body.site-time-scene .section-title,
body.site-time-scene .card h3,
body.site-time-scene .sidebar-card h3,
body.site-time-scene .info-card h3,
body.site-time-scene .sidebar-popular-card h3,
body.site-time-scene .brand-copy h1 {
    color: #f8fbff;
}

body.site-time-scene .card p,
body.site-time-scene .card .meta,
body.site-time-scene .hero-copy p,
body.site-time-scene .hero-meta,
body.site-time-scene .info-body,
body.site-time-scene .sidebar-popular-meta,
body.site-time-scene .brand-tagline {
    color: #b7c7dc;
}

body.site-time-scene .cat,
body.site-time-scene .hero-badge {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.22), rgba(249, 115, 22, 0.16));
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #e0f2fe;
}

body.site-time-scene .nav a,
body.site-time-scene .nav-button,
body.site-time-scene .nav-account-trigger,
body.site-time-scene .header-action-button,
body.site-time-scene .random-link,
body.site-time-scene .dark-mode-toggle,
body.site-time-scene .search-form {
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.05);
    color: #e6f2ff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

body.site-time-scene .nav a:hover,
body.site-time-scene .nav a.active,
body.site-time-scene .header-action-button:hover,
body.site-time-scene .dark-mode-toggle:hover,
body.site-time-scene .search-form:focus-within,
body.site-time-scene .search-form.is-open {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.24), rgba(249, 115, 22, 0.18));
    border-color: rgba(255, 255, 255, 0.34);
    color: #fff;
}

body.site-time-scene .sidebar-card h3,
body.site-time-scene .sidebar-popular-card h3,
body.site-time-scene .info-card h3 {
    background: rgba(3, 11, 22, 0.62);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

body.site-time-scene .site-footer {
    background: transparent;
}

body.site-time-scene .site-footer-shell {
    border-radius: 24px 24px 0 0;
}

body.site-time-scene .mobile-banner {
    background: rgba(15, 23, 42, 0.84);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: #e2e8f0;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

/* Maintenance layers above canvas */
body.maintenance-page.time-scene-maintenance {
    background: transparent !important;
}

body.maintenance-page.time-scene-maintenance .time-scene-canvas {
    z-index: 1;
}

body.maintenance-page.time-scene-maintenance .card {
    z-index: 2;
}

body.maintenance-page.time-scene-maintenance .login-shell {
    z-index: 300;
}

@media (prefers-reduced-motion: reduce) {
    .time-scene-canvas {
        opacity: 0.9;
    }
}

@media (max-width: 768px) {
    body.site-time-scene .hero-slider,
    body.site-time-scene .sidebar-card,
    body.site-time-scene .info-card,
    body.site-time-scene .sidebar-popular-card,
    body.site-time-scene .card {
        border-radius: 18px;
    }
}

/* Keep floating back-to-top button pinned above the scene canvas. */
body.site-time-scene .back-to-top {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1200;
}

@media (max-width: 640px) {
    body.site-time-scene .back-to-top {
        right: 14px;
        bottom: 14px;
    }
}

/* Fix: header sticky must stay above canvas */
body.site-time-scene {
}
/* Fix header sticky - force above canvas */
body.site-time-scene .header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
}

/* Push content below header */
body.site-time-scene .layout {
    margin-top: 80px !important;
}

@media (max-width: 768px) {
    body.site-time-scene .layout {
        margin-top: 120px !important;
    }
}
