/* === Serene chrome — the snow dawn ============================== */
/* Loaded only on theme-aware pages when the visitor chose "serene".
   Overrides the global cosmos chrome (background, nav, footer) with
   a snow-paper light treatment. Page content styles live in
   serene-home.css / novel.css. */

body.theme-serene {
    --sn-paper: #f7f8fa;
    --sn-card: #ffffff;
    --sn-ink: #232a35;
    --sn-body: #454f5e;
    --sn-faint: #6d7889;
    --sn-mist: #9aa5b4;
    --sn-line: #e2e7ee;
    --sn-line-strong: #cbd4df;
    --sn-blue: #7fa8c9;
    --sn-blue-deep: #4a6f8f;
    --sn-violet: #9a8fc0;

    background: #f7f8fa;
    color: var(--sn-ink);
    font-family: "Noto Sans KR", Inter, ui-sans-serif, system-ui, sans-serif;
}

body.theme-serene .vanta-bg {
    background:
        linear-gradient(180deg, #f7f8fa 0%, #f4f6f9 58%, #eef2f7 100%);
}

body.theme-serene .site-atmosphere {
    background:
        radial-gradient(1100px 480px at 50% -12%, rgba(127, 168, 201, .10), transparent 66%),
        radial-gradient(860px 420px at 88% 108%, rgba(154, 143, 192, .08), transparent 62%);
}

body.theme-serene .site-atmosphere::before,
body.theme-serene .site-atmosphere::after { content: none; }

body.theme-serene ::selection {
    background: rgba(127, 168, 201, .26);
    color: var(--sn-ink);
}

body.theme-serene a { color: var(--sn-blue-deep); }
body.theme-serene a:hover,
body.theme-serene a:focus-visible { color: var(--sn-ink); }

body.theme-serene a:focus-visible,
body.theme-serene button:focus-visible,
body.theme-serene input:focus-visible,
body.theme-serene summary:focus-visible,
body.theme-serene [tabindex]:focus-visible {
    outline: 2px solid rgba(74, 111, 143, .55);
}

/* ── Nav ────────────────────────────────────────────────── */
body.theme-serene .site-nav-bar {
    border-color: var(--sn-line);
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 14px 44px rgba(35, 42, 53, .08);
}

body.theme-serene .site-brand-icon {
    color: var(--sn-blue-deep);
    filter: none;
}

body.theme-serene .site-brand-name { color: var(--sn-ink); }
body.theme-serene .site-nav-divider { background: var(--sn-line-strong); }
body.theme-serene .site-nav-section { color: var(--sn-faint); }

body.theme-serene .onlybun-nav-link { color: var(--sn-faint); }

body.theme-serene .onlybun-nav-link:hover,
body.theme-serene .onlybun-nav-link:focus-visible {
    color: var(--sn-ink);
    border-color: var(--sn-line-strong);
    background: rgba(35, 42, 53, .04);
}

body.theme-serene .onlybun-nav-link.active {
    color: var(--sn-ink);
    border-color: rgba(74, 111, 143, .35);
    background: rgba(127, 168, 201, .12);
    box-shadow: none;
}

body.theme-serene .site-menu-button,
body.theme-serene .style-switch {
    border-color: var(--sn-line-strong);
    background: rgba(255, 255, 255, .7);
    color: var(--sn-faint);
}

body.theme-serene .style-switch:hover,
body.theme-serene .style-switch:focus-visible { color: var(--sn-ink); }

body.theme-serene .site-mobile-menu {
    border-color: var(--sn-line);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 18px 50px rgba(35, 42, 53, .12);
}

/* ── Footer ─────────────────────────────────────────────── */
body.theme-serene .site-footer { color: var(--sn-faint); }

body.theme-serene .footer-base {
    border-top-color: var(--sn-line);
    color: var(--sn-mist);
}

body.theme-serene .footer-base a { color: var(--sn-faint); }
body.theme-serene .footer-base a:hover { color: var(--sn-ink); }