/* DreamStory night theme */

/* DreamStory luminous glass night mode */
:root.dark {
    --primary: oklch(0.72 0.18 292);
    --primary-soft: oklch(0.31 0.09 292);
    --night-cyan: oklch(0.78 0.12 220);
    --page-bg: #0d1022;
    --card-bg: rgba(45, 39, 86, 0.58);
    --card-solid: #211d42;
    --text: rgba(250, 248, 255, 0.94);
    --text-soft: rgba(232, 229, 249, 0.7);
    --line: rgba(218, 207, 255, 0.2);
    --shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 18px 48px rgba(4, 6, 22, 0.34),
        0 0 24px rgba(133, 105, 255, 0.08);
}

:root.dark body {
    background:
        linear-gradient(145deg, rgba(13, 16, 38, 0.96), rgba(20, 18, 52, 0.9) 52%, rgba(10, 21, 46, 0.96)),
        var(--page-bg);
}

:root.dark body::before {
    opacity: 0.72;
    background:
        linear-gradient(115deg, rgba(143, 100, 255, 0.1), transparent 36%, rgba(83, 200, 255, 0.07) 72%, transparent);
}

:root.dark .hero-dim {
    background:
        linear-gradient(to bottom, rgba(14, 10, 39, 0.36), rgba(16, 12, 48, 0.66)),
        linear-gradient(105deg, rgba(93, 58, 160, 0.18), transparent 58%);
}

:root.dark .hero-copy h1 {
    color: #fff;
    text-shadow:
        0 2px 0 rgba(255, 255, 255, 0.12),
        0 0 22px rgba(188, 157, 255, 0.34),
        0 12px 40px rgba(3, 4, 20, 0.68);
}

:root.dark .hero-typing {
    color: rgba(245, 241, 255, 0.88);
    text-shadow: 0 0 16px rgba(167, 139, 250, 0.28);
}

:root.dark .waves use {
    fill: #11142a;
}

:root.dark .navbar-inner {
    border-color: rgba(221, 210, 255, 0.24);
    background:
        linear-gradient(110deg, rgba(83, 70, 137, 0.48), rgba(34, 35, 73, 0.5) 60%, rgba(35, 64, 91, 0.42));
    backdrop-filter: blur(24px) saturate(1.24);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        inset 0 -1px 0 rgba(122, 91, 226, 0.16),
        0 14px 42px rgba(5, 7, 25, 0.38),
        0 0 24px rgba(145, 110, 255, 0.1);
}

:root.dark .brand {
    color: #fff;
    text-shadow: 0 0 14px rgba(182, 151, 255, 0.28);
}

:root.dark .nav-links a.current,
:root.dark .nav-dropdown-trigger.current,
:root.dark .nav-dropdown:hover .nav-dropdown-trigger {
    color: #fff;
    background: rgba(154, 119, 255, 0.18);
    box-shadow:
        inset 0 -2px 0 rgba(205, 182, 255, 0.92),
        0 8px 24px rgba(126, 84, 255, 0.18);
}

:root.dark .nav-search,
:root.dark .search-panel,
:root.dark .display-settings-panel,
:root.dark .nav-music-panel,
:root.dark .mobile-menu {
    border-color: rgba(216, 203, 255, 0.2);
    background: rgba(35, 31, 72, 0.78);
    backdrop-filter: blur(24px) saturate(1.2);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.13),
        0 18px 48px rgba(4, 6, 24, 0.42),
        0 0 22px rgba(135, 98, 255, 0.08);
}

:root.dark .nav-search input,
:root.dark .search-panel input,
:root.dark .display-settings-panel input {
    color: var(--text);
}

:root.dark .icon-btn,
:root.dark .toolbar-btn,
:root.dark .floating-btn {
    border: 1px solid rgba(217, 205, 255, 0.14);
    background: rgba(136, 111, 216, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

:root.dark .brand:hover,
:root.dark .icon-btn:hover,
:root.dark .toolbar-btn:hover,
:root.dark .nav-links a:hover {
    color: #fff;
    border-color: rgba(210, 190, 255, 0.4);
    background: rgba(151, 113, 255, 0.2);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 0 18px rgba(150, 108, 255, 0.24);
}

:root.dark .card-base,
:root.dark .sidebar-glass-card {
    border-color: rgba(219, 207, 255, 0.24);
    background:
        linear-gradient(145deg, rgba(82, 67, 137, 0.46), rgba(31, 31, 69, 0.58) 58%, rgba(27, 47, 76, 0.46));
    backdrop-filter: blur(24px) saturate(1.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        inset 0 0 0 1px rgba(138, 107, 226, 0.06),
        0 20px 48px rgba(4, 6, 24, 0.34),
        0 0 26px rgba(143, 105, 255, 0.08);
}

:root.dark .post-card {
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

:root.dark .post-card:hover {
    transform: translateY(-3px);
    border-color: rgba(210, 190, 255, 0.42);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        0 22px 54px rgba(3, 5, 21, 0.42),
        0 0 30px rgba(145, 99, 255, 0.16);
}

:root.dark .post-card-cover {
    border: 1px solid rgba(224, 214, 255, 0.18);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        0 12px 28px rgba(3, 5, 22, 0.3);
}

:root.dark .post-card-body::before,
:root.dark .widget h3::before,
:root.dark .profile-mark {
    background: linear-gradient(180deg, #d2bdff, #8b67f6 62%, #55c7ef);
    box-shadow: 0 0 14px rgba(167, 125, 255, 0.5);
}

:root.dark .post-meta-item,
:root.dark .post-tags a,
:root.dark .profile-links a,
:root.dark .small-pill,
:root.dark .tag-cloud a,
:root.dark .layout-switcher {
    border: 1px solid rgba(206, 191, 255, 0.12);
    background: rgba(143, 111, 226, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

:root.dark .toolbar-btn.active,
:root.dark .page-navigator .current,
:root.dark .page-navigator li.current a,
:root.dark .page-navigator .current a {
    color: #fff;
    border-color: rgba(225, 211, 255, 0.54);
    background: linear-gradient(135deg, #8e68f7, #7455dd);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.26),
        0 0 20px rgba(139, 94, 255, 0.4);
}

:root.dark .enter-link,
:root.dark .music-play,
:root.dark .primary-link,
:root.dark .submit {
    border: 1px solid rgba(226, 214, 255, 0.42);
    background: linear-gradient(135deg, #9b76ff, #7255d8) !important;
    color: #fff !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        0 0 20px rgba(137, 94, 255, 0.32);
}

:root.dark .profile-avatar {
    border: 2px solid rgba(222, 207, 255, 0.54);
    background: rgba(67, 53, 112, 0.5);
    box-shadow:
        inset 0 0 0 4px rgba(255, 255, 255, 0.06),
        0 0 28px rgba(155, 112, 255, 0.22);
}

:root.dark .article-content blockquote {
    border-color: rgba(178, 144, 255, 0.68);
    background: rgba(136, 102, 219, 0.12);
}

:root.dark .article-content :not(pre) > code {
    border: 1px solid rgba(204, 185, 255, 0.16);
    background: rgba(145, 107, 230, 0.14);
}

:root.dark .article-content input,
:root.dark .article-content textarea,
:root.dark .comment-form input,
:root.dark .comment-form textarea {
    border-color: rgba(214, 200, 255, 0.2);
    background: rgba(19, 18, 46, 0.46);
}

:root.dark .article-content input:focus,
:root.dark .article-content textarea:focus,
:root.dark .comment-form input:focus,
:root.dark .comment-form textarea:focus {
    border-color: rgba(190, 159, 255, 0.7);
    box-shadow: 0 0 0 3px rgba(143, 97, 255, 0.16), 0 0 20px rgba(123, 88, 230, 0.12);
}

:root.dark .site-footer {
    color: rgba(226, 222, 246, 0.64);
    border-top-color: rgba(208, 194, 255, 0.12);
}

@media (max-width: 780px) {
    :root.dark .navbar-inner {
        background: rgba(35, 31, 72, 0.76);
    }

    :root.dark .card-base,
    :root.dark .sidebar-glass-card {
        backdrop-filter: blur(18px) saturate(1.12);
    }
}


/* Keep the night palette authoritative over legacy dark overrides above. */
:root.dark {
    --primary: oklch(0.72 0.18 292);
    --primary-soft: oklch(0.31 0.09 292);
    --night-cyan: oklch(0.78 0.12 220);
    --page-bg: #0d1022;
    --card-bg: rgba(45, 39, 86, 0.58);
    --card-solid: #211d42;
    --text: rgba(250, 248, 255, 0.94);
    --text-soft: rgba(232, 229, 249, 0.7);
    --line: rgba(218, 207, 255, 0.2);
    --shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.16),
        0 18px 48px rgba(4, 6, 22, 0.34),
        0 0 24px rgba(133, 105, 255, 0.08);
}

:root.dark .navbar-inner {
    border-color: rgba(221, 210, 255, 0.24);
    background: linear-gradient(110deg, rgba(83, 70, 137, 0.48), rgba(34, 35, 73, 0.5) 60%, rgba(35, 64, 91, 0.42));
}

:root.dark .sidebar-glass-card {
    border-color: rgba(219, 207, 255, 0.24);
    background: linear-gradient(145deg, rgba(82, 67, 137, 0.46), rgba(31, 31, 69, 0.58) 58%, rgba(27, 47, 76, 0.46));
}

:root.dark .couple-stats-widget {
    border-color: rgba(219, 207, 255, 0.24);
    background: linear-gradient(145deg, rgba(82, 67, 137, 0.46), rgba(31, 31, 69, 0.58) 58%, rgba(27, 47, 76, 0.46));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 20px 48px rgba(4, 6, 24, 0.34),
        0 0 26px rgba(143, 105, 255, 0.08);
}

:root.dark .sidebar-glass-card::before {
    display: none;
}

:root.dark .nav-solid .navbar-inner,
:root.dark .nav-clear .navbar-inner {
    border-color: rgba(221, 210, 255, 0.24);
    background: linear-gradient(110deg, rgba(83, 70, 137, 0.48), rgba(34, 35, 73, 0.5) 60%, rgba(35, 64, 91, 0.42));
}