/* =========================================================
   GHOST MARGINS NAV SHELL + DISCOVERY POLISH — 2026-09-27
   Desktop: quiet left library rail.
   Mobile: compact header + YouTube-style slide-out drawer.
   ========================================================= */

:root {
    --gm-rail-width: 260px;
    --gm-desktop-header-height: 142px;
    --gm-desktop-logo-width: 230px;
    --gm-mobile-header-height: 68px;
}

/* ---------- Desktop rail ---------- */
@media (min-width: 901px) {
    body {
        padding-left: var(--gm-rail-width) !important;
    }

    body > header,
    body.home-page > header {
        position: fixed !important;
        inset: 0 auto auto 0 !important;
        z-index: 910 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: var(--gm-rail-width) !important;
        height: var(--gm-desktop-header-height) !important;
        padding: 18px 20px !important;
        box-sizing: border-box !important;
        border: 0 !important;
        border-right: 1px solid var(--gm-border, #665548) !important;
        background: var(--gm-header, #121114) !important;
        color: var(--gm-header-text, #f2eee8) !important;
    }

    body.home-page > header {
        background: var(--home-header, var(--gm-header, #121114)) !important;
        color: var(--home-header-text, var(--gm-header-text, #f2eee8)) !important;
    }

    body > header > .site-logo,
    body.home-page > header > .site-logo {
        display: flex !important;
        width: 100% !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    body > header > .site-logo img,
    body.home-page > header > .site-logo img {
        width: min(var(--gm-desktop-logo-width), 100%) !important;
        max-width: var(--gm-desktop-logo-width) !important;
        height: auto !important;
        margin: 0 auto !important;
    }

    .gm-menu-toggle { display: none !important; }

    .gm-site-drawer {
        position: fixed;
        inset: var(--gm-desktop-header-height) auto 0 0;
        z-index: 905;
        display: flex;
        flex-direction: column;
        width: var(--gm-rail-width);
        padding: 14px 16px 18px;
        box-sizing: border-box;
        overflow-y: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
        background: var(--gm-header, #121114);
        color: var(--gm-header-text, #f2eee8);
        border-right: 1px solid var(--gm-border, #665548);
        font-family: var(--font-ui);
    }

    body.home-page .gm-site-drawer {
        background: var(--home-header, var(--gm-header, #121114));
        color: var(--home-header-text, var(--gm-header-text, #f2eee8));
    }

    .gm-site-drawer::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    .gm-drawer-head { display: none; }
    .gm-drawer-overlay { display: none !important; }
}

/* ---------- Shared drawer contents ---------- */
.gm-site-drawer nav {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 3px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.gm-site-drawer nav > a,
.gm-site-drawer nav > a:visited {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 43px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    box-sizing: border-box !important;
    border-radius: 8px !important;
    color: inherit !important;
    background: transparent !important;
    font: 650 0.97rem/1.2 var(--font-ui) !important;
    text-decoration: none !important;
    opacity: 0.9 !important;
}

.gm-site-drawer nav > a:hover,
.gm-site-drawer nav > a:focus-visible,
.gm-site-drawer nav > a.gm-nav-current {
    color: inherit !important;
    background: color-mix(in srgb, currentColor 10%, transparent) !important;
    text-decoration: none !important;
    opacity: 1 !important;
}

.gm-site-drawer nav > a.gm-nav-current {
    box-shadow: inset 3px 0 0 var(--gm-accent, #c99b61);
}

.gm-site-drawer .gm-header-account {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    width: 100% !important;
    margin: auto 0 0 !important;
    padding: 18px 4px 0 !important;
    box-sizing: border-box !important;
    border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent) !important;
    color: inherit !important;
    font-family: var(--font-ui) !important;
}

.gm-site-drawer .gm-header-account #user-greeting {
    width: 100% !important;
    margin: 0 0 4px !important;
    color: inherit !important;
    font: 600 0.9rem/1.3 var(--font-ui) !important;
    opacity: 0.72 !important;
}

.gm-site-drawer .gm-header-account #user-greeting:empty { display: none !important; }
.gm-site-drawer #account-nav-link[style*="display: none"],
.gm-site-drawer #admin-link[style*="display: none"] { display: none !important; }

.gm-site-drawer .gm-header-account a:not([style*="display: none"]),
.gm-site-drawer .gm-header-account button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    width: auto !important;
    margin: 0 !important;
    padding: 7px 11px !important;
    box-sizing: border-box !important;
    border: 1px solid color-mix(in srgb, currentColor 25%, transparent) !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: inherit !important;
    font: 650 0.87rem/1 var(--font-ui) !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.gm-site-drawer .gm-header-account a:hover,
.gm-site-drawer .gm-header-account button:hover,
.gm-site-drawer .gm-header-account a:focus-visible,
.gm-site-drawer .gm-header-account button:focus-visible {
    background: color-mix(in srgb, currentColor 9%, transparent) !important;
}

/* ---------- Mobile top bar + off-canvas drawer ---------- */
@media (max-width: 900px) {
    body {
        padding-left: 0 !important;
        overflow-x: hidden;
    }

    body > header,
    body.home-page > header {
        position: sticky !important;
        top: 0 !important;
        z-index: 930 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        height: var(--gm-mobile-header-height) !important;
        min-height: var(--gm-mobile-header-height) !important;
        padding: 8px 12px 8px 16px !important;
        box-sizing: border-box !important;
        gap: 10px !important;
        border: 0 !important;
        border-bottom: 1px solid var(--gm-border, #665548) !important;
        background: var(--gm-header, #121114) !important;
        color: var(--gm-header-text, #f2eee8) !important;
        text-align: left !important;
    }

    body.home-page > header {
        background: var(--home-header, var(--gm-header, #121114)) !important;
        color: var(--home-header-text, var(--gm-header-text, #f2eee8)) !important;
    }

    body > header > .site-logo,
    body.home-page > header > .site-logo {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    body > header > .site-logo img,
    body.home-page > header > .site-logo img {
        width: min(184px, 58vw) !important;
        max-width: 184px !important;
        height: auto !important;
        margin: 0 !important;
    }

    .gm-menu-toggle {
        order: -1 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 52px !important;
        width: 52px !important;
        height: 52px !important;
        margin: 0 !important;
        padding: 3px !important;
        border: 0 !important;
        border-radius: 12px !important;
        background: transparent !important;
        color: inherit !important;
        box-shadow: none !important;
        cursor: pointer !important;
    }

    .gm-menu-toggle:hover,
    .gm-menu-toggle:focus-visible {
        background: color-mix(in srgb, currentColor 9%, transparent) !important;
        outline: none;
    }

    .gm-menu-bars {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 6px;
        width: 30px;
        height: 30px;
    }
    .gm-menu-bars > span {
        display: block;
        width: 100%;
        height: 3px;
        border-radius: 999px;
        background: currentColor;
    }

    .gm-drawer-overlay {
        position: fixed;
        inset: 0;
        z-index: 970;
        background: rgba(0, 0, 0, 0.56);
        opacity: 0;
        transition: opacity 180ms ease;
    }

    .gm-drawer-overlay[hidden] { display: none !important; }

    .gm-site-drawer {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 980;
        display: flex;
        flex-direction: column;
        width: min(84vw, 330px);
        padding: 14px 14px 18px;
        box-sizing: border-box;
        overflow-y: auto;
        transform: translateX(-102%);
        transition: transform 210ms ease;
        background: var(--gm-header, #121114);
        color: var(--gm-header-text, #f2eee8);
        border-right: 1px solid var(--gm-border, #665548);
        box-shadow: 14px 0 34px rgba(0,0,0,.26);
        font-family: var(--font-ui);
    }

    body.home-page .gm-site-drawer {
        background: var(--home-header, var(--gm-header, #121114));
        color: var(--home-header-text, var(--gm-header-text, #f2eee8));
    }

    body.gm-drawer-open { overflow: hidden !important; }
    body.gm-drawer-open .gm-site-drawer { transform: translateX(0); }
    body.gm-drawer-open .gm-drawer-overlay { opacity: 1; }

    .gm-drawer-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 46px;
        margin-bottom: 10px;
        padding: 0 2px 10px 10px;
        border-bottom: 1px solid color-mix(in srgb, currentColor 16%, transparent);
        font: 700 1rem/1 var(--font-ui);
        letter-spacing: .01em;
    }

    .gm-drawer-close {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        margin: 0 !important;
        padding: 0 0 4px !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: transparent !important;
        color: inherit !important;
        font: 300 2rem/1 var(--font-ui) !important;
        box-shadow: none !important;
    }

    .gm-drawer-close:hover,
    .gm-drawer-close:focus-visible {
        background: color-mix(in srgb, currentColor 9%, transparent) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gm-site-drawer,
    .gm-drawer-overlay { transition: none !important; }
}

/* ---------- Homepage: bring stories above the fold ---------- */
body.home-page .home-recent-section {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto 38px;
    padding: 0 !important;
}

body.home-page .home-recent-section .section-heading-row,
.browse-recent-section .section-heading-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

body.home-page .home-recent-section .section-heading-row h2,
.browse-recent-section .section-heading-row h2 {
    margin: 0 !important;
}

body.home-page .home-recent-section .section-heading-link,
.browse-recent-section .section-heading-link {
    flex: 0 0 auto;
    font-size: .9rem;
    text-align: right;
}

body.home-page #recently-updated-list {
    display: flex !important;
    gap: 16px !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 2px;
    padding: 2px 2px 12px !important;
    scrollbar-width: thin;
}

body.home-page #recently-updated-list .recent-work-card {
    flex: 0 0 min(360px, 78vw) !important;
    width: min(360px, 78vw) !important;
    scroll-snap-align: start;
}

body.home-page #recently-updated-list .work-summary {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

body.home-page #recently-updated-list .tags .tag-pill:nth-child(n+4) {
    display: none !important;
}

/* Notes stay useful, but stop occupying half the homepage. */
body.home-page .library-notes-section {
    width: min(980px, calc(100% - 36px));
    margin: 34px auto 0 !important;
    padding: 0 !important;
}

body.home-page .library-notes-section > h2 {
    font-size: clamp(1.5rem, 3vw, 2rem) !important;
}

body.home-page .library-note {
    margin-top: 12px !important;
    padding: 16px 18px !important;
    box-shadow: none !important;
}

body.home-page:not(.show-all-library-notes) #library-notes-list .library-note:nth-of-type(n+2) {
    display: none !important;
}

body.home-page:not(.show-all-library-notes) #library-notes-list .library-note:first-of-type p:last-of-type {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.library-notes-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin-top: 10px;
    padding: 7px 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font: 650 .9rem/1.2 var(--font-ui) !important;
    text-decoration: underline;
    text-underline-offset: 4px;
    box-shadow: none !important;
}

/* ---------- Browse: shelves should swipe like shelves ---------- */
@media (max-width: 900px) {
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list {
        display: flex !important;
        grid-template-columns: none !important;
        gap: 14px !important;
        overflow-x: auto !important;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: 0;
        padding: 2px 0 12px !important;
        scrollbar-width: thin;
    }

    body:not(.show-all-recent) .browse-recent-section #recently-updated-list .recent-work-card,
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list .recent-work-card:nth-of-type(n+4) {
        display: flex !important;
        flex: 0 0 min(82vw, 340px) !important;
        width: min(82vw, 340px) !important;
        scroll-snap-align: start;
    }

    body.show-all-recent .browse-recent-section #recently-updated-list {
        display: grid !important;
        grid-template-columns: 1fr !important;
        overflow: visible !important;
    }

    /* Mobile hero becomes a banner rather than a whole landing page. */
    body.home-page > main {
        margin-top: 0 !important;
    }

    body.home-page .home-hero,
    body.home-page.skin-after-hours .home-hero,
    body.home-page.dark-mode.skin-after-hours .home-hero {
        min-height: 280px !important;
        margin-top: 0 !important;
        margin-bottom: 26px !important;
        padding: 24px 18px 28px !important;
        box-sizing: border-box !important;
    }

    body.home-page .home-hero h2,
    body.home-page.skin-after-hours .home-hero h2,
    body.home-page.dark-mode.skin-after-hours .home-hero h2 {
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        font-size: clamp(2rem, 9vw, 2.55rem) !important;
        line-height: 1 !important;
    }

    body.home-page .home-hero-kicker {
        margin-bottom: 8px !important;
        font-size: .78rem !important;
    }

    body.home-page .home-search-form {
        margin-bottom: 0 !important;
    }

    body.home-page .home-recent-section {
        width: calc(100% - 28px);
        margin-bottom: 30px;
    }

    body.home-page .home-recent-section .section-heading-row,
    .browse-recent-section .section-heading-row {
        align-items: center;
        gap: 10px;
    }

    body.home-page .home-recent-section .section-heading-row h2,
    .browse-recent-section .section-heading-row h2 {
        font-size: clamp(1.55rem, 7vw, 2rem) !important;
    }

    body.home-page .home-recent-section .section-heading-link,
    .browse-recent-section .section-heading-link {
        max-width: 9.5rem;
        font-size: .82rem;
        line-height: 1.25;
    }

    body.home-page #recently-updated-list .recent-work-card {
        flex-basis: min(82vw, 340px) !important;
        width: min(82vw, 340px) !important;
        padding: 17px !important;
    }

    body.home-page .library-notes-section {
        width: calc(100% - 28px);
        margin-top: 28px !important;
    }

    body.home-page .library-note {
        padding: 14px 15px !important;
        line-height: 1.5 !important;
    }

    body.home-page .library-note small {
        margin-top: 10px !important;
        padding-top: 8px !important;
    }
}


/* =========================================================
   SHELL PASS 3 — icon navigation + quiet theme control
   ========================================================= */

/* Small, theme-aware archival marks in the rail/drawer. */
.gm-site-drawer nav > a[data-gm-nav-icon]::before {
    content: "";
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    margin-right: 10px;
    background: currentColor;
    opacity: .62;
    -webkit-mask: var(--gm-nav-icon) center / contain no-repeat;
    mask: var(--gm-nav-icon) center / contain no-repeat;
}

.gm-site-drawer nav > a[data-gm-nav-icon="home"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11.2 12 4l8 7.2'/%3E%3Cpath d='M6.5 10.2V20h11V10.2M9.5 20v-6h5v6'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="browse"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16M4 12h16M4 19h16'/%3E%3Cpath d='M6 5v5M9 5v5M13 5v5M17 5v5M7 12v5M11 12v5M15 12v5M18 12v5'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="search"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='5.5'/%3E%3Cpath d='M14.5 14.5 20 20'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="library"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5.5h13v4H4zM7 10h13v4H7zM3 14.5h14v4H3z'/%3E%3Cpath d='M6 5.5v4M16 10v4M6 14.5v4'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="writing"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19l3.5-.7L19 7.8 16.2 5 5.7 15.5 5 19z'/%3E%3Cpath d='m14.8 6.4 2.8 2.8M5.7 15.5l2.8 2.8M4 20h9'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="profile"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.2'/%3E%3Cpath d='M5.5 20c.7-4 3-6 6.5-6s5.8 2 6.5 6'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="request"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h14v16H5z'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="settings"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M4 7h5M13 7h7M4 17h9M17 17h3'/%3E%3Ccircle cx='11' cy='7' r='2'/%3E%3Ccircle cx='15' cy='17' r='2'/%3E%3C/g%3E%3C/svg%3E"); }
.gm-site-drawer nav > a[data-gm-nav-icon="faq"] { --gm-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 5.5c2.7-.8 5-.4 7.5 1.2v12c-2.5-1.6-4.8-2-7.5-1.2zM19.5 5.5c-2.7-.8-5-.4-7.5 1.2v12c2.5-1.6 4.8-2 7.5-1.2z'/%3E%3C/g%3E%3C/svg%3E"); }

/* The light/dark switch is intentionally icon-only. No emoji, no label box. */
body > header #theme-toggle,
body.home-page > header #theme-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: inherit !important;
    font-size: 0 !important;
    line-height: 0 !important;
    box-shadow: none !important;
    opacity: .68 !important;
    cursor: pointer !important;
}

body > header #theme-toggle::before,
body.home-page > header #theme-toggle::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M20.5 15.4A8.6 8.6 0 0 1 8.6 3.5a8.5 8.5 0 1 0 11.9 11.9z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M20.5 15.4A8.6 8.6 0 0 1 8.6 3.5a8.5 8.5 0 1 0 11.9 11.9z'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.dark-mode > header #theme-toggle::before,
body.dark-mode.home-page > header #theme-toggle::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='3.5'/%3E%3Cpath d='M12 2v2M12 20v2M4.93 4.93l1.42 1.42M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.42-1.42M17.66 6.34l1.41-1.41'/%3E%3C/g%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='3.5'/%3E%3Cpath d='M12 2v2M12 20v2M4.93 4.93l1.42 1.42M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.42-1.42M17.66 6.34l1.41-1.41'/%3E%3C/g%3E%3C/svg%3E");
}

body > header #theme-toggle:hover,
body > header #theme-toggle:focus-visible {
    opacity: 1 !important;
    background: color-mix(in srgb, currentColor 8%, transparent) !important;
    outline: none !important;
}

@media (min-width: 901px) {
    body > header #theme-toggle,
    body.home-page > header #theme-toggle {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
        z-index: 2 !important;
    }
}

@media (max-width: 900px) {
    body > header #theme-toggle,
    body.home-page > header #theme-toggle {
        flex: 0 0 34px !important;
        margin-left: auto !important;
    }

    /* Keep the close control in the same corner as the menu button. */
    .gm-drawer-head {
        justify-content: flex-start !important;
        min-height: 54px !important;
        margin: -6px 0 8px !important;
        padding: 0 0 8px 2px !important;
    }

    .gm-drawer-close {
        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;
        margin: 0 !important;
        padding: 0 0 4px !important;
        border-radius: 12px !important;
        font-size: 2rem !important;
    }
}

/* =========================================================
   SHELF CARD FIT REPAIR — 2026-09-27
   Show one complete mobile card plus a deliberate peek of the next.
   ========================================================= */
@media (max-width: 900px) {
    body.home-page #recently-updated-list,
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 2px 0 12px !important;
        scroll-padding-inline: 0 !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none;
    }

    body.home-page #recently-updated-list::-webkit-scrollbar,
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list::-webkit-scrollbar {
        display: none;
    }

    body.home-page #recently-updated-list .recent-work-card,
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list .recent-work-card,
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list .recent-work-card:nth-of-type(n+4) {
        box-sizing: border-box !important;
        flex: 0 0 calc(100% - 42px) !important;
        width: calc(100% - 42px) !important;
        min-width: 0 !important;
        max-width: none !important;
        scroll-snap-align: start !important;
        scroll-snap-stop: normal;
    }

    body.home-page #recently-updated-list .recent-work-card > *,
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list .recent-work-card > * {
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body.home-page #recently-updated-list .recent-work-card :is(h3, p, a, span, strong),
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list .recent-work-card :is(h3, p, a, span, strong) {
        overflow-wrap: anywhere;
    }

    body.home-page #recently-updated-list .work-summary,
    body:not(.show-all-recent) .browse-recent-section #recently-updated-list .work-summary {
        -webkit-line-clamp: 3 !important;
    }

    body.show-all-recent .browse-recent-section #recently-updated-list {
        padding-right: 0 !important;
        scrollbar-width: auto !important;
    }

    body.show-all-recent .browse-recent-section #recently-updated-list .recent-work-card {
        width: 100% !important;
        max-width: 100% !important;
    }
}


/* ---------- v19: lock one desktop brand/header size everywhere ---------- */
@media (min-width: 901px) {
    body > header,
    body.home-page > header {
        width: var(--gm-rail-width) !important;
        height: var(--gm-desktop-header-height) !important;
        min-height: var(--gm-desktop-header-height) !important;
        max-height: var(--gm-desktop-header-height) !important;
    }
    body > header > .site-logo,
    body.home-page > header > .site-logo {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    body > header > .site-logo img,
    body.home-page > header > .site-logo img {
        width: var(--gm-desktop-logo-width) !important;
        min-width: var(--gm-desktop-logo-width) !important;
        max-width: var(--gm-desktop-logo-width) !important;
    }
    .gm-site-drawer {
        inset: var(--gm-desktop-header-height) auto 0 0 !important;
        width: var(--gm-rail-width) !important;
    }
}


/* ---------- v20: lock the desktop logo to the same coordinates on every page ----------
   A few older page headers still contain an empty <p>.  It used to participate
   in the flex layout and nudge/shrink the brand between pages. */
@media (min-width: 901px) {
    body > header > p:empty,
    body.home-page > header > p:empty {
        display: none !important;
    }

    body > header > .site-logo,
    body.home-page > header > .site-logo {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: min(var(--gm-desktop-logo-width), calc(100% - 28px)) !important;
        min-width: 0 !important;
        max-width: calc(100% - 28px) !important;
        margin: 0 !important;
    }

    body > header > .site-logo img,
    body.home-page > header > .site-logo img {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
    }
}

/* =========================================================
   HOMEPAGE HERO TRIM — 2026-09-27
   Keep the atmospheric room, but let the books reach the fold.
   Loaded last so this intentionally overrides older hero sizing.
   ========================================================= */
@media (min-width: 901px) {
    body.home-page .home-hero,
    body.home-page.skin-after-hours .home-hero,
    body.home-page.dark-mode.skin-after-hours .home-hero,
    body.home-page:not(.skin-after-hours) .home-hero {
        min-height: 315px !important;
        padding: 36px 28px 40px !important;
        margin-bottom: 34px !important;
        position: relative;
    }

    body.home-page .home-hero h2 {
        font-size: clamp(2.6rem, 4.6vw, 3.65rem) !important;
    }

    body.home-page .home-hero h2::after {
        margin-top: 14px !important;
        margin-bottom: 16px !important;
    }

    body.home-page .home-search-form {
        width: min(92%, 920px) !important;
        transform: translateY(16px);
    }
}

@media (max-width: 900px) {
    body.home-page .home-hero,
    body.home-page.skin-after-hours .home-hero,
    body.home-page.dark-mode.skin-after-hours .home-hero,
    body.home-page:not(.skin-after-hours) .home-hero {
        min-height: 230px !important;
        padding: 20px 14px 22px !important;
        margin-bottom: 42px !important;
        position: relative;
        align-items: center !important;
    }

    body.home-page .home-hero-inner {
        max-width: 100% !important;
    }

    body.home-page .home-hero-kicker {
        margin-bottom: 6px !important;
        font-size: .68rem !important;
        letter-spacing: .16em !important;
    }

    body.home-page .home-hero h2,
    body.home-page.skin-after-hours .home-hero h2,
    body.home-page.dark-mode.skin-after-hours .home-hero h2,
    body.home-page:not(.skin-after-hours) .home-hero h2 {
        max-width: none !important;
        font-size: clamp(1.9rem, 9.2vw, 2.35rem) !important;
        line-height: .98 !important;
    }

    body.home-page .home-hero h2::after {
        width: min(150px, 44vw) !important;
        margin: 10px auto 12px !important;
    }

    body.home-page .home-search-form,
    body.home-page.skin-after-hours .home-search-form,
    body.home-page.dark-mode.skin-after-hours .home-search-form {
        grid-template-columns: minmax(0, 1fr) 82px !important;
        width: min(100%, 430px) !important;
        max-width: 430px !important;
        gap: 6px !important;
        margin: 0 auto !important;
        padding: 4px !important;
        border: 1px solid color-mix(in srgb, var(--home-accent) 72%, var(--home-border)) !important;
        border-radius: 9px !important;
        background: color-mix(in srgb, var(--home-search-bg) 96%, transparent) !important;
        box-shadow: 0 10px 24px rgba(0,0,0,.18) !important;
        overflow: hidden !important;
        transform: translateY(26px);
    }

    body.home-page .home-search-form input,
    body.home-page .home-search-form button {
        min-height: 42px !important;
        width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        border-radius: 6px !important;
    }

    body.home-page .home-search-form input {
        min-width: 0 !important;
        padding: 10px 12px !important;
        font-size: .94rem !important;
        border: 0 !important;
    }

    body.home-page .home-search-form button {
        min-width: 0 !important;
        padding: 9px 8px !important;
        font-size: .88rem !important;
    }

    body.home-page .home-recent-section {
        margin-top: 0 !important;
    }
}

@media (max-width: 390px) {
    body.home-page .home-hero,
    body.home-page.skin-after-hours .home-hero,
    body.home-page.dark-mode.skin-after-hours .home-hero,
    body.home-page:not(.skin-after-hours) .home-hero {
        min-height: 215px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    body.home-page .home-search-form,
    body.home-page.skin-after-hours .home-search-form,
    body.home-page.dark-mode.skin-after-hours .home-search-form {
        grid-template-columns: minmax(0, 1fr) 74px !important;
    }

    body.home-page .home-search-form button {
        font-size: .82rem !important;
    }
}

/* =========================================================
   HOMEPAGE BOOK-SHELF DISCOVERY — 2026-09-27
   Compact jackets, arrow controls, hover/tap detail preview.
   ========================================================= */
body.home-page .gm-shelf-heading-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

body.home-page .gm-shelf-nav {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

body.home-page .gm-shelf-arrow {
    width: 34px;
    height: 34px;
    padding: 0 !important;
    display: inline-grid;
    place-items: center;
    border-radius: 999px !important;
    border: 1px solid var(--gm-card-border, var(--gm-border, #8e8175)) !important;
    background: color-mix(in srgb, var(--gm-card, #f4eee5) 92%, transparent) !important;
    color: var(--gm-card-text, #2b2926) !important;
    box-shadow: 0 5px 16px rgba(0, 0, 0, .08) !important;
    cursor: pointer;
}

body.home-page .gm-shelf-arrow svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.home-page .gm-shelf-arrow:hover,
body.home-page .gm-shelf-arrow:focus-visible {
    transform: translateY(-1px);
    background: var(--gm-card, #f4eee5) !important;
}

body.home-page .gm-shelf-arrow:disabled {
    opacity: .3;
    cursor: default;
    transform: none;
}

body.home-page #recently-updated-list.gm-book-shelf {
    display: flex !important;
    align-items: flex-start;
    gap: 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 4px;
    padding: 8px 4px 14px !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none;
}

body.home-page #recently-updated-list.gm-book-shelf::-webkit-scrollbar {
    display: none;
}

body.home-page .gm-book-tile {
    flex: 0 0 176px;
    width: 176px;
    min-width: 0;
    scroll-snap-align: start;
    position: relative;
}

body.home-page .gm-book-cover-trigger {
    appearance: none;
    text-decoration: none;
    width: 100%;
    aspect-ratio: 2 / 3;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 24px 18px 22px 24px !important;
    border: 0 !important;
    border-radius: 5px 10px 10px 5px !important;
    box-shadow:
        0 9px 18px rgba(0, 0, 0, .16),
        inset 0 0 0 1px rgba(255, 255, 255, .12) !important;
    color: #f6ecdc !important;
    text-align: center;
    cursor: pointer;
    transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
}

body.home-page .gm-book-cover-trigger::before,
body.home-page .gm-book-cover-trigger::after {
    content: "";
    position: absolute;
    pointer-events: none;
    z-index: -1;
}

body.home-page .gm-book-cover-trigger::before {
    inset: 12px 12px 12px 18px;
    border: 1px solid currentColor;
    opacity: .34;
    border-radius: 1px 6px 6px 1px;
}

body.home-page .gm-book-cover-trigger::after {
    width: 72px;
    height: 1px;
    left: 50%;
    top: 29%;
    transform: translateX(-50%);
    background: currentColor;
    opacity: .35;
    box-shadow: 0 82px 0 currentColor;
}

body.home-page .gm-book-cover-trigger:hover,
body.home-page .gm-book-cover-trigger:focus-visible {
    transform: translateY(-4px);
    filter: brightness(1.04);
    box-shadow:
        0 16px 26px rgba(0, 0, 0, .22),
        inset 0 0 0 1px rgba(255, 255, 255, .16) !important;
}

body.home-page .gm-book-spine {
    position: absolute;
    inset: 0 auto 0 0;
    width: 10px;
    background: rgba(0, 0, 0, .16);
    box-shadow: inset -1px 0 rgba(255, 255, 255, .12);
}

body.home-page .gm-book-jacket-kicker {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-width: 100%;
    font: 700 .63rem/1.25 var(--font-ui);
    letter-spacing: .1em;
    text-transform: uppercase;
    opacity: .8;
}

body.home-page .gm-book-jacket-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    max-width: 100%;
    font-family: var(--font-reading);
    font-size: 1.18rem;
    line-height: 1.05;
    font-weight: 700;
    text-wrap: balance;
}

body.home-page .gm-book-jacket-rule {
    width: 42px;
    height: 1px;
    background: currentColor;
    opacity: .6;
}

body.home-page .gm-book-jacket-author {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-width: 100%;
    font: 600 .7rem/1.2 var(--font-ui);
    letter-spacing: .03em;
    opacity: .9;
}

/* A small built-in jacket library for works without uploaded art. */
body.home-page .gm-jacket-1 .gm-book-cover-trigger {
    background: linear-gradient(145deg, #34232a 0%, #4a2f39 62%, #25191f 100%) !important;
    color: #f0dfc7 !important;
}

body.home-page .gm-jacket-2 .gm-book-cover-trigger {
    background: linear-gradient(145deg, #5f4a35 0%, #81684a 54%, #463524 100%) !important;
    color: #fff0d2 !important;
}

body.home-page .gm-jacket-3 .gm-book-cover-trigger {
    background: linear-gradient(145deg, #273741 0%, #3f5560 58%, #1d292f 100%) !important;
    color: #e8edf0 !important;
}

body.home-page .gm-jacket-4 .gm-book-cover-trigger {
    background: linear-gradient(145deg, #354131 0%, #53624b 58%, #273026 100%) !important;
    color: #ece8d5 !important;
}

body.home-page .gm-jacket-5 .gm-book-cover-trigger {
    background: linear-gradient(145deg, #4a374e 0%, #67506d 58%, #332638 100%) !important;
    color: #f0e4ed !important;
}

body.home-page .gm-jacket-6 .gm-book-cover-trigger {
    background: linear-gradient(145deg, #693a2d 0%, #8a5140 58%, #492820 100%) !important;
    color: #f7e3cf !important;
}

body.home-page .gm-book-tile-title,
body.home-page .gm-book-tile-author {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
}

body.home-page .gm-book-tile-title {
    margin-top: 9px;
    color: var(--gm-card-text, #2b2926) !important;
    font-weight: 700;
    font-size: .95rem;
}

body.home-page .gm-book-tile-author {
    margin-top: 2px;
    color: color-mix(in srgb, var(--gm-card-text, #2b2926) 70%, transparent) !important;
    font-size: .78rem;
}

body.home-page .gm-book-tile-title:hover,
body.home-page .gm-book-tile-author:hover {
    text-decoration: underline;
}

/* Shared floating detail card. It lives outside the scrolling shelf so it cannot be clipped. */
.gm-shelf-preview {
    position: fixed;
    z-index: 5000;
    width: min(360px, calc(100vw - 24px));
    max-height: min(520px, calc(100vh - 24px));
    overflow: auto;
    padding: 18px;
    border: 1px solid var(--gm-card-border, var(--gm-border, #8e8175));
    border-radius: 15px;
    background: var(--gm-card, var(--gm-card-bg, #f5efe5));
    color: var(--gm-card-text, #2b2926);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
    transform-origin: center;
    animation: gmShelfPreviewIn 145ms ease-out;
}

.gm-shelf-preview[hidden] {
    display: none !important;
}

@keyframes gmShelfPreviewIn {
    from { opacity: 0; transform: scale(.96) translateY(4px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.gm-shelf-preview-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--gm-card-text, #2b2926) 8%, transparent) !important;
    color: inherit !important;
    font: 400 1.35rem/1 var(--font-ui);
    box-shadow: none !important;
}

.gm-shelf-preview-topline {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding-right: 34px;
}

.gm-shelf-preview-topline span,
.gm-shelf-preview-tag {
    border: 1px solid var(--gm-card-border, var(--gm-border, #8e8175));
    border-radius: 999px;
    padding: 4px 8px;
    color: inherit !important;
    background: color-mix(in srgb, var(--gm-card, #f5efe5) 84%, var(--gm-accent, #8b6a4d) 16%);
    font: 600 .72rem/1.1 var(--font-ui);
    text-decoration: none;
}

.gm-shelf-preview h3 {
    margin: 14px 34px 7px 0 !important;
    font-size: 1.35rem !important;
    line-height: 1.15;
}

.gm-shelf-preview h3 a {
    color: inherit !important;
    text-decoration: none;
}

.gm-shelf-preview-author {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: inherit !important;
    text-decoration: none;
    font-size: .86rem;
}

.gm-shelf-preview-author img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--gm-card-border, var(--gm-border, #8e8175));
}

.gm-shelf-preview-summary {
    margin: 13px 0 10px !important;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    line-height: 1.45;
    font-size: .9rem;
}

.gm-shelf-preview-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 10px 0;
}

.gm-shelf-preview-stats {
    margin: 10px 0 14px !important;
    opacity: .72;
    font-size: .78rem;
}

.gm-shelf-preview-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.gm-shelf-read-now,
.gm-shelf-read-later {
    min-height: 42px;
    display: grid;
    place-items: center;
    padding: 9px 12px !important;
    border-radius: 9px !important;
    font-weight: 700;
    text-decoration: none !important;
}

.gm-shelf-read-now {
    border: 1px solid var(--gm-button, #5a4635) !important;
    background: var(--gm-button, #5a4635) !important;
    color: var(--gm-header-text, #fff) !important;
}

.gm-shelf-read-later {
    border: 1px solid var(--gm-card-border, var(--gm-border, #8e8175)) !important;
    background: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
}

.gm-shelf-read-later.is-saved {
    background: color-mix(in srgb, var(--gm-accent, #8b6a4d) 18%, transparent) !important;
}

@media (max-width: 760px) {
    body.home-page .gm-shelf-nav {
        display: none;
    }

    body.home-page #recently-updated-list.gm-book-shelf {
        gap: 12px !important;
        margin-inline: -2px;
        padding: 6px 2px 12px !important;
        scroll-snap-type: x mandatory;
    }

    body.home-page .gm-book-tile {
        flex-basis: 132px;
        width: 132px;
    }

    body.home-page .gm-book-cover-trigger {
        padding: 19px 13px 17px 19px !important;
        border-radius: 4px 8px 8px 4px !important;
    }

    body.home-page .gm-book-jacket-kicker {
        font-size: .54rem;
    }

    body.home-page .gm-book-jacket-title {
        font-size: .94rem;
    }

    body.home-page .gm-book-jacket-author {
        font-size: .61rem;
    }

    body.home-page .gm-book-tile-title {
        margin-top: 7px;
        font-size: .84rem;
    }

    body.home-page .gm-book-tile-author {
        font-size: .72rem;
    }

    .gm-shelf-preview {
        left: 12px !important;
        right: 12px !important;
        bottom: 12px !important;
        top: auto !important;
        width: auto;
        max-height: min(70vh, 560px);
        border-radius: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.home-page .gm-book-cover-trigger,
    .gm-shelf-preview {
        transition: none !important;
        animation: none !important;
    }
}

/* =========================================================
   HOME SHELF PREVIEW V2
   A deliberate hover, a larger pulled-book preview, and
   actions near the top. Covers always link to the work.
   ========================================================= */
.gm-shelf-preview {
    width: min(410px, calc(100vw - 24px));
    padding: 0 18px 18px;
    overflow-x: hidden;
}

.gm-shelf-preview-art {
    margin: 0 -18px 14px;
    min-height: 118px;
    display: grid;
    place-items: center;
    padding: 12px 44px;
    border-radius: 14px 14px 0 0;
    overflow: hidden;
    position: relative;
}

.gm-shelf-preview-art::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(255,255,255,.04), rgba(0,0,0,.18));
    pointer-events: none;
}

.gm-shelf-preview-art-inner {
    position: relative;
    z-index: 1;
    width: min(220px, 100%);
    min-height: 82px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    border: 1px solid currentColor;
    outline: 1px solid color-mix(in srgb, currentColor 42%, transparent);
    outline-offset: -8px;
    text-align: center;
}

.gm-shelf-preview-art.gm-jacket-1 { background: linear-gradient(145deg, #34232a 0%, #4a2f39 62%, #25191f 100%); color: #f0dfc7; }
.gm-shelf-preview-art.gm-jacket-2 { background: linear-gradient(145deg, #5f4a35 0%, #81684a 54%, #463524 100%); color: #fff0d2; }
.gm-shelf-preview-art.gm-jacket-3 { background: linear-gradient(145deg, #273741 0%, #3f5560 58%, #1d292f 100%); color: #e8edf0; }
.gm-shelf-preview-art.gm-jacket-4 { background: linear-gradient(145deg, #354131 0%, #53624b 58%, #273026 100%); color: #ece8d5; }
.gm-shelf-preview-art.gm-jacket-5 { background: linear-gradient(145deg, #4a374e 0%, #67506d 58%, #332638 100%); color: #f0e4ed; }
.gm-shelf-preview-art.gm-jacket-6 { background: linear-gradient(145deg, #693a2d 0%, #8a5140 58%, #492820 100%); color: #f7e3cf; }

.gm-shelf-preview-art .gm-book-jacket-kicker,
.gm-shelf-preview-art .gm-book-jacket-author {
    color: inherit !important;
}

.gm-shelf-preview-art .gm-book-jacket-title {
    color: inherit !important;
    font-size: 1.3rem;
    line-height: 1.05;
}

.gm-shelf-preview-actions-top {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr);
    margin: 2px 0 15px;
}

.gm-shelf-preview-actions-top .gm-shelf-read-now,
.gm-shelf-preview-actions-top .gm-shelf-read-later {
    min-height: 44px;
}

.gm-shelf-preview-actions-top .gm-shelf-read-now {
    width: 100%;
    cursor: pointer;
    font: inherit;
}

.gm-shelf-preview .gm-shelf-preview-topline {
    margin-top: 4px;
}

.gm-setting-toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    cursor: pointer;
}

.gm-setting-toggle-row > span {
    display: grid;
    gap: 5px;
}

.gm-setting-toggle-row small {
    opacity: .72;
    line-height: 1.4;
}

.gm-setting-toggle-row input[type="checkbox"] {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    accent-color: var(--gm-accent, #8b6a4d);
}

@media (max-width: 760px) {
    .gm-shelf-preview {
        padding: 0 16px 16px;
    }

    .gm-shelf-preview-art {
        margin-inline: -16px;
        min-height: 104px;
        padding: 10px 36px;
    }

    .gm-shelf-preview-art-inner {
        min-height: 74px;
    }

    .gm-shelf-preview-actions-top {
        grid-template-columns: 1fr 1fr;
    }
}


/* =========================================================
   HOME SHELF PREVIEW V3
   Compact inspection card: banner-sized art, no inner scroll,
   popularity at a glance, and a three-line summary.
   ========================================================= */
.gm-shelf-preview {
    width: min(380px, calc(100vw - 24px));
    max-height: none;
    overflow: visible;
    padding: 0;
}

.gm-shelf-preview-art {
    margin: 0;
    min-height: 88px;
    padding: 14px 48px 13px 18px;
    place-items: end start;
    border-radius: 14px 14px 0 0;
}

.gm-shelf-preview-art::after {
    background: linear-gradient(to bottom, rgba(0,0,0,.02), rgba(0,0,0,.38));
}

.gm-shelf-preview-art-inner {
    width: 100%;
    min-height: 0;
    display: block;
    padding: 0;
    border: 0;
    outline: 0;
    text-align: left;
}

.gm-shelf-preview-art .gm-book-jacket-kicker {
    display: block;
    margin-bottom: 4px;
    font-size: .65rem;
    opacity: .82;
}

.gm-shelf-preview-art .gm-book-jacket-title {
    display: block;
    max-width: 100%;
    font-size: 1.16rem;
    line-height: 1.08;
}

.gm-shelf-preview-art .gm-book-jacket-title a {
    color: inherit !important;
    text-decoration: none;
}

.gm-shelf-preview-body {
    padding: 12px 15px 14px;
}

.gm-shelf-preview-author {
    margin-bottom: 10px;
}

.gm-shelf-preview-actions-top {
    margin: 0 0 10px;
    gap: 7px;
}

.gm-shelf-preview-actions-top .gm-shelf-read-now,
.gm-shelf-preview-actions-top .gm-shelf-read-later {
    min-height: 38px;
    padding: 7px 10px !important;
    font-size: .84rem;
}

.gm-shelf-preview .gm-shelf-preview-topline {
    margin: 0 0 8px;
    padding-right: 0;
    gap: 5px;
}

.gm-shelf-preview-topline span,
.gm-shelf-preview-tag {
    padding: 3px 7px;
    font-size: .67rem;
}

.gm-shelf-preview-summary {
    margin: 8px 0 !important;
    -webkit-line-clamp: 3;
    line-height: 1.38;
    font-size: .84rem;
}

.gm-shelf-preview-tags {
    gap: 5px;
    margin: 7px 0;
}

.gm-shelf-preview-popularity {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px;
    margin: 9px 0 2px !important;
    font-size: .78rem;
    line-height: 1.3;
}

.gm-shelf-preview-popularity strong {
    font-weight: 750;
}

.gm-shelf-preview-stats {
    margin: 3px 0 0 !important;
    font-size: .72rem;
}

.gm-shelf-preview-close {
    top: 8px;
    right: 8px;
    background: rgba(20, 18, 16, .35) !important;
    color: #fff !important;
    backdrop-filter: blur(4px);
}

@media (max-width: 760px) {
    .gm-shelf-preview {
        left: 10px !important;
        right: 10px !important;
        bottom: 10px !important;
        width: auto;
        max-height: none;
        overflow: visible;
        border-radius: 15px;
    }

    .gm-shelf-preview-art {
        min-height: 76px;
        padding: 12px 44px 11px 14px;
    }

    .gm-shelf-preview-art .gm-book-jacket-title {
        font-size: 1.04rem;
    }

    .gm-shelf-preview-body {
        padding: 10px 13px 12px;
    }

    .gm-shelf-preview-author img {
        width: 24px;
        height: 24px;
    }

    .gm-shelf-preview-actions-top {
        grid-template-columns: 1fr 1fr;
    }

    .gm-shelf-preview-summary {
        -webkit-line-clamp: 2;
    }
}


/* =========================================================
   HOME SHELF PREVIEW V4
   True banner header + tighter vertical footprint.
   ========================================================= */
.gm-shelf-preview-art {
    min-height: 58px;
    margin-bottom: 8px;
    padding: 8px 42px 8px 14px;
    place-items: center start;
}

.gm-shelf-preview-art-inner {
    min-height: 0;
}

.gm-shelf-preview-art .gm-book-jacket-kicker {
    margin-bottom: 2px;
    font-size: .58rem;
}

.gm-shelf-preview-art .gm-book-jacket-title {
    font-size: 1.02rem;
    line-height: 1.04;
}

.gm-shelf-preview-body {
    padding-top: 9px;
}

@media (max-width: 760px) {
    .gm-shelf-preview-art {
        min-height: 52px;
        padding: 7px 38px 7px 12px;
    }

    .gm-shelf-preview-art .gm-book-jacket-title {
        font-size: .96rem;
    }
}


/* HOME SHELF PREVIEW V5: calmer hover + anchored-on-scroll behavior */
.gm-shelf-preview-summary-row {
    position: relative;
    margin: 8px 0;
}

.gm-shelf-preview-summary-row .gm-shelf-preview-summary {
    margin: 0 !important;
    padding-right: 0;
}

.gm-shelf-preview-more {
    display: inline-block;
    margin-top: 3px;
    font-size: .72rem;
    font-weight: 700;
    color: inherit !important;
    opacity: .78;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.gm-shelf-preview-more:hover,
.gm-shelf-preview-more:focus-visible {
    opacity: 1;
}


/* HOME SHELF PREVIEW V6: no drifting animation. The preview appears in place. */
.gm-shelf-preview {
    animation: none !important;
}


/* HOME SHELF PREVIEW V7: anchor desktop preview to the document, not viewport. */
@media (min-width: 761px) and (hover: hover) and (pointer: fine) {
    .gm-shelf-preview.is-desktop-preview {
        position: absolute !important;
    }
}

/* =========================================================
   WORK JACKETS
   Custom author art + Ghost Margins genre-jacket fallbacks.
   ========================================================= */
.gm-primary-genre-field {
    margin-top: 16px;
    max-width: 360px;
}

.gm-primary-genre-field small,
.gm-jacket-editor .field-note {
    display: block;
    margin-top: 6px;
    opacity: .75;
    line-height: 1.45;
}

.gm-jacket-editor {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 190px);
    gap: 24px;
    align-items: start;
    margin: 20px 0;
    padding: 20px;
    border: 1px solid var(--gm-card-border, var(--gm-border, #8e8175));
    border-radius: 12px;
    background: color-mix(in srgb, var(--gm-card, var(--gm-card-bg, #f5efe5)) 86%, transparent);
}

.gm-jacket-editor h4 {
    margin: 4px 0 8px;
}

.gm-jacket-mode-options {
    display: grid;
    gap: 8px;
    margin-top: 16px;
}

.gm-jacket-mode-options label {
    display: flex;
    align-items: center;
    gap: 9px;
    width: fit-content;
    cursor: pointer;
}

.gm-jacket-upload-panel {
    margin-top: 14px;
}

.gm-jacket-upload-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 8px 14px;
    border: 1px solid var(--gm-card-border, var(--gm-border, #8e8175));
    border-radius: 9px;
    background: var(--gm-card, var(--gm-card-bg, #f5efe5));
    color: var(--gm-card-text, var(--text, #2b2926));
    font-weight: 700;
    cursor: pointer;
}

.gm-jacket-file-status {
    display: block;
    margin-top: 8px;
    font-size: .82rem;
    opacity: .75;
    overflow-wrap: anywhere;
}

.gm-jacket-preview-wrap {
    display: grid;
    place-items: start center;
}

.gm-jacket-preview,
.gm-work-jacket-media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 2 / 3;
    border-radius: 5px 10px 10px 5px;
    background: #34291f;
    color: #f6ead5;
    box-shadow: 0 12px 28px rgba(0,0,0,.2);
}

.gm-jacket-preview {
    width: min(180px, 100%);
    border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
}

.gm-jacket-preview-image,
.gm-work-jacket-media > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gm-jacket-preview::after,
.gm-work-jacket-media:not(.is-custom)::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,.06) 25%, rgba(0,0,0,.58) 78%, rgba(0,0,0,.72));
    pointer-events: none;
}

.gm-jacket-preview-copy,
.gm-work-jacket-copy {
    position: absolute;
    z-index: 2;
    inset: auto 12px 18px;
    text-align: center;
    text-shadow: 0 2px 8px rgba(0,0,0,.72);
}

.gm-jacket-preview-copy span,
.gm-work-jacket-copy span {
    display: block;
    margin-bottom: 6px;
    font: 700 .61rem/1.2 var(--font-ui);
    letter-spacing: .12em;
    text-transform: uppercase;
}

.gm-jacket-preview-copy strong,
.gm-work-jacket-copy strong {
    display: block;
    font-family: var(--font-reading);
    font-size: 1rem;
    line-height: 1.08;
}

.gm-work-jacket-copy small {
    display: block;
    margin-top: 8px;
    font: 600 .64rem/1.2 var(--font-ui);
    opacity: .9;
}

.gm-jacket-preview.is-custom .gm-jacket-preview-copy {
    display: none;
}

.gm-jacket-preview.is-none {
    background:
        repeating-linear-gradient(135deg, transparent 0 16px, rgba(255,255,255,.04) 16px 17px),
        color-mix(in srgb, var(--gm-card, #4d4034) 88%, #000);
    box-shadow: none;
}

.gm-jacket-preview.is-none::after,
.gm-jacket-preview.is-none .gm-jacket-preview-copy {
    display: none;
}

/* Homepage shelf: jacket art takes over the old plain text cover when available. */
body.home-page .gm-book-cover-trigger.has-jacket {
    padding: 0 !important;
    background: #241c18 !important;
}

body.home-page .gm-book-cover-trigger.has-jacket::before,
body.home-page .gm-book-cover-trigger.has-jacket::after {
    display: none;
}

body.home-page .gm-book-cover-trigger.has-jacket .gm-book-spine {
    z-index: 4;
}

body.home-page .gm-book-cover-trigger.has-jacket .gm-work-jacket-media {
    width: 100%;
    height: 100%;
    border-radius: inherit;
    box-shadow: none;
}

body.home-page .gm-book-cover-trigger.has-jacket .gm-work-jacket-copy {
    inset: auto 14px 20px 20px;
}

body.home-page .gm-book-cover-trigger.has-jacket .gm-work-jacket-copy strong {
    font-size: 1rem;
}

/* Hover/tap detail banner uses the same jacket art, cropped wide. */
.gm-shelf-preview-art-image {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 36%;
    filter: brightness(.82);
}

.gm-shelf-preview-art.has-jacket-art::after {
    z-index: 1;
    background: linear-gradient(to right, rgba(18,12,10,.52), rgba(18,12,10,.10) 65%, rgba(18,12,10,.12)),
        linear-gradient(to top, rgba(18,12,10,.28), transparent 60%);
}

.gm-shelf-preview-art.has-jacket-art .gm-shelf-preview-art-inner {
    z-index: 2;
    color: #fff5e7;
    text-shadow: 0 2px 7px rgba(0,0,0,.85);
}

/* Published work: a real book jacket without swallowing the whole header. */
.published-work-jacket:not([hidden]) {
    float: left;
    width: clamp(118px, 15vw, 168px);
    margin: 0 22px 14px 0;
}

.published-work-jacket .gm-work-jacket-media {
    width: 100%;
}

.published-intro-card::after {
    content: "";
    display: block;
    clear: both;
}

/* Writing Desk: small visual cue, not another giant card. */
.dashboard-work-row > .gm-work-jacket-media {
    flex: 0 0 66px;
    width: 66px;
    align-self: flex-start;
    box-shadow: 0 6px 14px rgba(0,0,0,.14);
}

.dashboard-work-row > .gm-work-jacket-media .gm-work-jacket-copy {
    inset: auto 6px 8px;
}

.dashboard-work-row > .gm-work-jacket-media .gm-work-jacket-copy span,
.dashboard-work-row > .gm-work-jacket-media .gm-work-jacket-copy small {
    display: none;
}

.dashboard-work-row > .gm-work-jacket-media .gm-work-jacket-copy strong {
    font-size: .54rem;
    line-height: 1.05;
}

@media (max-width: 760px) {
    .gm-jacket-editor {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .gm-jacket-preview-wrap {
        place-items: start;
    }

    .gm-jacket-preview {
        width: 132px;
    }

    .published-work-jacket:not([hidden]) {
        float: none;
        width: 128px;
        margin: 0 auto 16px;
    }

    .dashboard-work-row > .gm-work-jacket-media {
        flex-basis: 52px;
        width: 52px;
    }
}

/* =========================================================
   JACKET + DARK ACADEMIA POLISH — 2026-09-28
   Keep the new shelf art clean inside Dark Academia and make
   the peeking ghost readable when the site is in dark mode.
   ========================================================= */

/* Dark Academia was inheriting an older work-card surface around the new
   jacket tiles. The jacket is the card now, so keep its surrounding tile quiet. */
body.home-page.skin-dark-academia #recently-updated-list > .gm-book-tile,
body.home-page.skin-dark-academia .gm-book-shelf > .gm-book-tile {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

body.home-page.skin-dark-academia:not(.dark-mode) .gm-book-tile-title {
    color: #352920 !important;
}

body.home-page.skin-dark-academia:not(.dark-mode) .gm-book-tile-author {
    color: #6f5a48 !important;
}

body.home-page.skin-dark-academia.dark-mode .gm-book-tile-title {
    color: #f0e7d8 !important;
}

body.home-page.skin-dark-academia.dark-mode .gm-book-tile-author {
    color: #c8baa6 !important;
}

/* =========================================================
   MOBILE CHAPTER TOOLBAR PARITY — 2026-09-28
   Keep every writing control visible on phones instead of
   clipping the second half of the toolbar off-screen.
   ========================================================= */
@media (max-width: 700px) {
    #edit-chapter-form .chapter-writing-section .form-field,
    #new-chapter-form .chapter-writing-section .form-field {
        min-width: 0 !important;
        overflow: visible !important;
    }

    #edit-chapter-form .chapter-toolbar,
    #new-chapter-form .chapter-toolbar {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        gap: 7px !important;
        margin: 8px 0 10px !important;
        padding: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    /* Row 1: B / I / U / Font */
    #edit-chapter-form .chapter-toolbar > button[data-format],
    #new-chapter-form .chapter-toolbar > button[data-format] {
        grid-column: span 1;
        width: 100% !important;
        min-width: 0 !important;
        height: 46px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    #edit-chapter-form .chapter-toolbar #chapter-font,
    #new-chapter-form .chapter-toolbar #chapter-font {
        grid-column: span 3;
        width: 100% !important;
        min-width: 0 !important;
        height: 46px !important;
        margin: 0 !important;
    }

    /* Row 2: Size / Align */
    #edit-chapter-form .chapter-toolbar #chapter-size,
    #edit-chapter-form .chapter-toolbar #chapter-align,
    #new-chapter-form .chapter-toolbar #chapter-size,
    #new-chapter-form .chapter-toolbar #chapter-align {
        grid-column: span 3;
        width: 100% !important;
        min-width: 0 !important;
        height: 46px !important;
        margin: 0 !important;
    }

    /* Row 3: story-format helpers */
    #edit-chapter-form .chapter-toolbar .scene-break-button,
    #edit-chapter-form .chapter-toolbar .text-conversation-button,
    #new-chapter-form .chapter-toolbar .scene-break-button,
    #new-chapter-form .chapter-toolbar .text-conversation-button {
        grid-column: span 3;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 8px 10px !important;
        white-space: normal !important;
        line-height: 1.15 !important;
    }

    /* Row 4: Writer Tools gets a full-width, easy-to-hit button. */
    #edit-chapter-form .chapter-toolbar .writer-tools-toggle,
    #new-chapter-form .chapter-toolbar .writer-tools-toggle {
        grid-column: 1 / -1;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;
        margin: 0 !important;
        padding: 8px 12px !important;
        justify-content: center !important;
    }
}

/* =========================================================
   MOBILE CHAPTER TOOLBAR COMPACT PASS — 2026-09-28
   Same tool parity, less vertical bulk on phones.
   ========================================================= */
@media (max-width: 700px) {
    #edit-chapter-form .chapter-toolbar,
    #new-chapter-form .chapter-toolbar {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 5px !important;
        margin: 6px 0 8px !important;
    }

    /* Row 1: B / I / U / Font */
    #edit-chapter-form .chapter-toolbar > button[data-format],
    #new-chapter-form .chapter-toolbar > button[data-format] {
        grid-column: span 1 !important;
        height: 40px !important;
        min-height: 40px !important;
        font-size: .95rem !important;
    }

    #edit-chapter-form .chapter-toolbar #chapter-font,
    #new-chapter-form .chapter-toolbar #chapter-font {
        grid-column: span 3 !important;
        height: 40px !important;
        min-height: 40px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    /* Row 2: Size / Align / Writer Tools */
    #edit-chapter-form .chapter-toolbar #chapter-size,
    #edit-chapter-form .chapter-toolbar #chapter-align,
    #new-chapter-form .chapter-toolbar #chapter-size,
    #new-chapter-form .chapter-toolbar #chapter-align,
    #edit-chapter-form .chapter-toolbar .writer-tools-toggle,
    #new-chapter-form .chapter-toolbar .writer-tools-toggle {
        grid-column: span 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 40px !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 8px !important;
        font-size: .9rem !important;
        line-height: 1 !important;
        justify-content: center !important;
    }

    /* Row 3: the two larger insertion helpers. */
    #edit-chapter-form .chapter-toolbar .scene-break-button,
    #edit-chapter-form .chapter-toolbar .text-conversation-button,
    #new-chapter-form .chapter-toolbar .scene-break-button,
    #new-chapter-form .chapter-toolbar .text-conversation-button {
        grid-column: span 3 !important;
        min-height: 40px !important;
        height: 40px !important;
        padding: 0 8px !important;
        font-size: .88rem !important;
        white-space: nowrap !important;
        line-height: 1 !important;
    }
}

/* =========================================================
   MOBILE CHAPTER TOOLBAR — SINGLE SCROLLING RAIL — 2026-09-28
   Keep the editor open and airy on phones. The toolbar stays
   one line and scrolls horizontally instead of stacking.
   ========================================================= */
@media (max-width: 700px) {
    #edit-chapter-form .chapter-writing-section .form-field,
    #new-chapter-form .chapter-writing-section .form-field {
        min-width: 0 !important;
        overflow: visible !important;
    }

    #edit-chapter-form .chapter-toolbar,
    #new-chapter-form .chapter-toolbar {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: center !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 6px 0 8px !important;
        padding: 0 18px 2px 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        scroll-behavior: smooth;
        box-sizing: border-box !important;
    }

    #edit-chapter-form .chapter-toolbar::-webkit-scrollbar,
    #new-chapter-form .chapter-toolbar::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    /* Every control becomes a compact rail item. */
    #edit-chapter-form .chapter-toolbar > *,
    #new-chapter-form .chapter-toolbar > * {
        flex: 0 0 auto !important;
        grid-column: auto !important;
        width: auto !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        white-space: nowrap !important;
    }

    #edit-chapter-form .chapter-toolbar > button[data-format],
    #new-chapter-form .chapter-toolbar > button[data-format],
    #edit-chapter-form .chapter-toolbar .gm-history-button,
    #new-chapter-form .chapter-toolbar .gm-history-button {
        width: 42px !important;
        min-width: 42px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 1rem !important;
    }

    #edit-chapter-form .chapter-toolbar .gm-history-button svg,
    #new-chapter-form .chapter-toolbar .gm-history-button svg {
        width: 19px;
        height: 19px;
        display: block;
        pointer-events: none;
    }

    #edit-chapter-form .chapter-toolbar #chapter-font,
    #new-chapter-form .chapter-toolbar #chapter-font {
        width: 118px !important;
        min-width: 118px !important;
        padding-inline: 12px 30px !important;
    }

    #edit-chapter-form .chapter-toolbar #chapter-size,
    #new-chapter-form .chapter-toolbar #chapter-size {
        width: 104px !important;
        min-width: 104px !important;
        padding-inline: 12px 30px !important;
    }

    #edit-chapter-form .chapter-toolbar #chapter-align,
    #new-chapter-form .chapter-toolbar #chapter-align {
        width: 112px !important;
        min-width: 112px !important;
        padding-inline: 12px 30px !important;
    }

    #edit-chapter-form .chapter-toolbar .scene-break-button,
    #new-chapter-form .chapter-toolbar .scene-break-button {
        width: auto !important;
        min-width: 104px !important;
        padding: 0 12px !important;
        font-size: .86rem !important;
        line-height: 1 !important;
    }

    #edit-chapter-form .chapter-toolbar .text-conversation-button,
    #new-chapter-form .chapter-toolbar .text-conversation-button {
        width: auto !important;
        min-width: 126px !important;
        padding: 0 12px !important;
        font-size: .86rem !important;
        line-height: 1 !important;
    }

    #edit-chapter-form .chapter-toolbar .writer-tools-toggle,
    #new-chapter-form .chapter-toolbar .writer-tools-toggle {
        width: auto !important;
        min-width: 78px !important;
        padding: 0 12px !important;
        font-size: .88rem !important;
        line-height: 1 !important;
        justify-content: center !important;
    }
}


/* Plain close control for the mobile navigation drawer. */
@media (max-width: 900px) {
    .gm-drawer-close {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;
        padding: 3px !important;
        border: 0 !important;
        border-radius: 12px !important;
        background: transparent !important;
        color: inherit !important;
        box-shadow: none !important;
        cursor: pointer !important;
    }

    .gm-drawer-close:hover,
    .gm-drawer-close:focus-visible {
        background: color-mix(in srgb, currentColor 9%, transparent) !important;
        outline: none !important;
    }

}

/* FINAL THEME POLISH — 2026-09-28
   Keep visited links in the site's palette and simplify the mobile masthead. */
body:not([class*="skin-"]):not(.dark-mode) { --gm-link-color: #765634; }
body.dark-mode:not([class*="skin-"]) { --gm-link-color: #d4b27c; }
body.skin-after-hours {}
body.skin-burnish:not(.dark-mode) { --gm-link-color: #795126; }
body.skin-burnish.dark-mode { --gm-link-color: #e1b87c; }
body:is(.skin-stormglass, .skin-blue):not(.dark-mode) { --gm-link-color: #365b6d; }
body:is(.skin-stormglass, .skin-blue).dark-mode { --gm-link-color: #bad5e0; }
body:is(.skin-fernwood, .skin-matcha):not(.dark-mode) { --gm-link-color: #46583e; }
body:is(.skin-fernwood, .skin-matcha).dark-mode { --gm-link-color: #c4d5b5; }
body:is(.skin-night-bloom, .skin-plum, .skin-cotton-candy):not(.dark-mode) { --gm-link-color: #7a4055; }
body:is(.skin-night-bloom, .skin-plum, .skin-cotton-candy).dark-mode { --gm-link-color: #e9bfd1; }
body.skin-dark-academia { --gm-link-color: #755a2d; }

body main a.section-heading-link,
body main a.section-heading-link:visited,
body main a:not([class]):not([role="button"]):link,
body main a:not([class]):not([role="button"]):visited {
    color: var(--gm-link-color, var(--gm-accent, #765634)) !important;
    -webkit-text-fill-color: var(--gm-link-color, var(--gm-accent, #765634)) !important;
}
body main a.section-heading-link:hover,
body main a.section-heading-link:focus-visible,
body main a:not([class]):not([role="button"]):hover,
body main a:not([class]):not([role="button"]):focus-visible {
    color: var(--gm-link-color, var(--gm-accent, #765634)) !important;
    -webkit-text-fill-color: var(--gm-link-color, var(--gm-accent, #765634)) !important;
    text-decoration-thickness: 2px;
}

@media (max-width: 900px) {
    html body .gm-menu-toggle,
    html body .gm-drawer-close {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    html body .gm-drawer-close { padding: 0 !important; }
    html body .gm-menu-toggle:hover,
    html body .gm-menu-toggle:focus-visible,
    html body .gm-drawer-close:hover,
    html body .gm-drawer-close:focus-visible {
        background: transparent !important;
        box-shadow: none !important;
    }
    .gm-menu-toggle:focus-visible,
    .gm-drawer-close:focus-visible {
        outline: 2px solid currentColor !important;
        outline-offset: 2px !important;
    }
    .gm-drawer-close > span {
        display: block;
        font: 300 2rem/1 var(--font-ui);
    }
}

/* Keep the reading actions distinct when Continue Reading appears. */
.published-reading-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
}
.published-reading-actions > .start-reading-button { margin: 0 !important; }

/* Burnish's dark reader should stay in its warm palette instead of inheriting
   the default blue-gray reader card. */
body.skin-burnish.dark-mode {
    --chapter-reader-bg: #2b211c;
    --chapter-reader-text: #f1e5d6;
    --chapter-reader-border: #765b47;
}

/* Use a simple, high-contrast control for paragraph margin comments. */
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-comment-marker {
    width: 26px !important;
    height: 26px !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #a17a54 !important;
    border-radius: 50% !important;
    background: #684b32 !important;
    color: #f7e8d4 !important;
    opacity: 1 !important;
}
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-comment-marker::before,
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-comment-marker::after {
    content: none !important;
    display: none !important;
}
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-marker-label {
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    color: #fff3e1 !important;
    font-size: 15px !important;
    line-height: 1 !important;
}
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-comment-marker:not(.is-empty) .gm-margin-marker-label {
    font-size: 11px !important;
}
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-comment-marker:hover,
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-comment-marker:focus-visible {
    background: #806044 !important;
    border-color: #d5a465 !important;
}
body.skin-burnish.dark-mode #published-chapter-text .gm-margin-comment-marker:focus-visible {
    outline: 2px solid #f1e5d6 !important;
    outline-offset: 2px !important;
}

/* Long names, work titles, and large counts should wrap inside their cells. */
.author-library-card-public .author-stat,
.author-library-card-public .author-work-ledger > div,
.author-library-card-public .author-works-ledger-header span {
    min-width: 0;
    box-sizing: border-box;
    overflow-wrap: anywhere;
}
.author-library-card-public .author-stat strong,
.author-library-card-public .author-stat span,
.author-library-card-public .author-card-identity h2,
.author-library-card-public .author-work-title a,
.author-library-card-public .author-bio,
.author-library-card-public .author-genre-tag {
    overflow-wrap: anywhere;
}

/* The art is the tile in both profile pickers. A small check marks selected
   choices; an outline appears only while navigating with a keyboard. */
#edit-profile-form .avatar-choice,
#edit-profile-form .stamp-option {
    position: relative;
}
body #edit-profile-form .avatar-choice span,
body #edit-profile-form .stamp-option {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
body #edit-profile-form .avatar-choice input:checked + span,
body #edit-profile-form .stamp-option input:checked + img {
    outline: none !important;
    box-shadow: none !important;
}
body #edit-profile-form .stamp-option input {
    display: block;
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
body #edit-profile-form .stamp-option img {
    opacity: 0.88;
}
body #edit-profile-form .stamp-option input:checked + img {
    opacity: 1;
    transform: none;
}
#edit-profile-form .avatar-choice:has(input:checked)::after,
#edit-profile-form .stamp-option:has(input:checked)::after {
    content: "✓";
    position: absolute;
    right: 1px;
    bottom: 1px;
    display: grid;
    place-items: center;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: var(--gm-accent, #bb9560);
    color: #201b19;
    font: 700 15px/1 var(--font-ui);
    pointer-events: none;
}
#edit-profile-form .avatar-choice:has(input:focus-visible),
#edit-profile-form .stamp-option:has(input:focus-visible) {
    outline: 2px solid var(--gm-accent, #bb9560);
    outline-offset: 2px;
    border-radius: 4px;
}
#edit-profile-form .stamp-picker-detail {
    width: min(100%, 350px);
    min-height: 3.6em;
    box-sizing: border-box;
    margin: 0.6rem auto 0;
    padding: 0.7rem 0 0;
    border-top: 1px solid var(--gm-border, #8b7660);
    overflow-wrap: anywhere;
    line-height: 1.35;
}
#edit-profile-form .stamp-picker-detail strong,
#edit-profile-form .stamp-picker-detail span {
    display: block;
}
#edit-profile-form .stamp-picker-detail span {
    margin-top: 0.15rem;
    opacity: 0.8;
    font-size: 0.9rem;
}

/* Hide unearned awards even before the picker script has loaded. */
#edit-profile-form .stamp-option.locked-stamp[hidden] {
    display: none !important;
}

/* A visible cue for the mobile editor's horizontally scrolling controls. */
.gm-toolbar-more-row { display: none; }
@media (max-width: 700px) {
    .gm-toolbar-more-row:not([hidden]) {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 6px 12px;
        margin: -2px 0 10px;
        font: 0.85rem/1.3 var(--font-ui);
        opacity: 0.9;
    }
    .gm-toolbar-more-row .gm-toolbar-more-button {
        width: auto !important;
        min-height: 34px;
        margin: 0 !important;
        padding: 4px 2px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: inherit !important;
        font: 700 0.9rem/1.2 var(--font-ui);
        text-decoration: underline;
        text-underline-offset: 3px;
        cursor: pointer;
    }
    .gm-toolbar-more-row .gm-toolbar-more-button:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 2px;
    }
}

/* Chapter subscriptions and the on-site updates shelf. */
#subscribe-work-button[hidden] { display: none !important; }
.gm-subscribe-message:empty { display: none; }
.gm-subscribe-message {
    margin: 8px 0 0;
    font: 0.84rem/1.35 var(--font-ui);
    color: inherit;
}
.dashboard-updates .gm-chapter-update {
    padding: 12px 16px;
    margin-bottom: 10px;
    border-left: 3px solid transparent;
}
.dashboard-updates .gm-chapter-update.is-unread {
    border-left-color: currentColor;
}
.dashboard-updates .gm-chapter-update .library-panel-note {
    margin-top: 4px;
}
.dashboard-updates h3 { margin: 22px 0 10px; }
.dashboard-updates .gm-subscribed-work {
    display: block;
    width: fit-content;
    max-width: 100%;
    padding: 5px 0;
}
#library-unread-updates {
    font-weight: 700;
}
#library-unread-updates[hidden] { display: none !important; }
.gm-site-drawer .gm-nav-update-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.3em;
    height: 1.3em;
    margin-left: 7px;
    padding: 0 3px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font: 700 0.72rem/1 var(--font-ui);
}


/* ==========================================================
   TYPOGRAPHY SYSTEM + PUBLISHED WORK ACTIONS — 2026-09-29
   Fraunces = display, Source Serif 4 = reading, Inter = UI.
   ========================================================== */

body {
    font-family: var(--font-reading) !important;
}

body :is(h1, h2, h3, .work-title, .published-work-title, .author-name,
    .section-title, .request-desk-title, .profile-display-name) {
    font-family: var(--font-display) !important;
    font-optical-sizing: auto;
    letter-spacing: -0.012em;
}

body :is(button, input, select, textarea, .button-link, a[role="button"],
    nav, summary, .metadata, .stats, .tabs, .tag-link, .work-tag-link,
    .published-secondary-meta, .published-stats, .published-social-actions,
    .gm-site-drawer, .gm-header-account) {
    font-family: var(--font-ui) !important;
}

body :is(.chapter-content, #published-chapter-text, .work-summary,
    .published-summary, .author-bio, .author-note) {
    font-family: var(--font-reading) !important;
}

/* Modern reading CTAs: one strong action, one quiet fallback. */
.published-reading-actions {
    gap: 8px !important;
    margin: 16px 0 12px !important;
}
.published-reading-actions > .start-reading-button {
    min-height: 46px !important;
    padding: 11px 18px !important;
    border-radius: 11px !important;
    font-family: var(--font-ui) !important;
    font-size: 0.96rem !important;
    font-weight: 650 !important;
    letter-spacing: -0.005em;
    box-shadow: none !important;
    transition: transform 140ms ease, box-shadow 140ms ease, background-color 140ms ease, border-color 140ms ease;
}
.published-reading-actions > .start-reading-button:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.10) !important;
}
.published-reading-actions > .start-reading-button:active:not(:disabled) {
    transform: translateY(0);
    box-shadow: none !important;
}

/* If there is saved progress, Continue becomes primary and Start becomes secondary. */
.published-reading-actions:has(#continue-reading-button:not([hidden])) #continue-reading-button {
    background: var(--ui-primary) !important;
    border-color: var(--ui-primary) !important;
    color: var(--ui-on-primary) !important;
}
.published-reading-actions:has(#continue-reading-button:not([hidden])) #start-reading-button {
    background: var(--ui-soft) !important;
    border-color: var(--ui-border) !important;
    color: var(--ui-ink) !important;
    font-weight: 600 !important;
}

/* Compact pill actions instead of a row of little 1990s form boxes. */
.published-social-card {
    padding: 13px !important;
}
.published-social-actions {
    align-items: center !important;
    gap: 8px !important;
}
.published-social-actions button {
    --gm-action-icon: none;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    min-height: 38px !important;
    min-width: 0 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 8px 13px !important;
    border: 1px solid var(--ui-border) !important;
    border-radius: 999px !important;
    background: var(--ui-soft) !important;
    color: var(--ui-ink) !important;
    font-family: var(--font-ui) !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    letter-spacing: -0.005em;
    box-shadow: none !important;
    transition: transform 130ms ease, background-color 130ms ease, border-color 130ms ease, box-shadow 130ms ease;
}
.published-social-actions button::before {
    content: "";
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    background: currentColor;
    -webkit-mask: var(--gm-action-icon) center / contain no-repeat;
    mask: var(--gm-action-icon) center / contain no-repeat;
}
#like-work-button { --gm-action-icon: url("icons/heart.svg"); }
#bookmark-work-button { --gm-action-icon: url("icons/bookmark.svg"); }
#read-later-button { --gm-action-icon: url("icons/book-open.svg"); }
#subscribe-work-button { --gm-action-icon: url("icons/bell.svg"); }
#report-work-button { --gm-action-icon: url("icons/flag.svg"); }

.published-social-actions button:hover:not(:disabled) {
    transform: translateY(-1px);
    border-color: var(--ui-primary) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08) !important;
}
.published-social-actions button:active:not(:disabled) {
    transform: translateY(0);
    box-shadow: none !important;
}
.published-social-actions button[aria-pressed="true"] {
    border-color: var(--ui-primary) !important;
    background: var(--ui-primary) !important;
    color: var(--ui-on-primary) !important;
}
.published-social-actions #report-work-button {
    margin-left: auto !important;
    border-color: color-mix(in srgb, var(--ui-danger) 55%, transparent) !important;
    background: transparent !important;
    color: var(--ui-danger) !important;
    font-weight: 550 !important;
}
.published-social-actions #report-work-button:hover {
    border-color: var(--ui-danger) !important;
    background: color-mix(in srgb, var(--ui-danger) 8%, transparent) !important;
}

@media (max-width: 600px) {
    .published-social-actions {
        display: flex !important;
        flex-wrap: wrap !important;
    }
    .published-social-actions button {
        flex: 1 1 auto !important;
    }
    .published-social-actions #report-work-button {
        margin-left: 0 !important;
        flex: 0 1 auto !important;
    }
}

/* Published-work action icons: embed masks directly so they cannot leave
   an empty icon slot if a separate SVG asset fails to resolve. */
#like-work-button {
    --gm-action-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.6l-1-1a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21l7.8-7.6 1-1a5.5 5.5 0 0 0 0-7.8Z'/%3E%3C/svg%3E");
}
#bookmark-work-button {
    --gm-action-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 3h12a1 1 0 0 1 1 1v17l-7-4-7 4V4a1 1 0 0 1 1-1Z'/%3E%3C/svg%3E");
}
#read-later-button {
    --gm-action-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 5.5A3.5 3.5 0 0 1 6.5 2H11v17H6.5A3.5 3.5 0 0 0 3 22V5.5ZM21 5.5A3.5 3.5 0 0 0 17.5 2H13v17h4.5A3.5 3.5 0 0 1 21 22V5.5Z'/%3E%3C/svg%3E");
}
#subscribe-work-button {
    --gm-action-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9ZM10 21h4'/%3E%3C/svg%3E");
}
#report-work-button {
    --gm-action-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5 21V4m0 0h11l-1.5 3L16 10H5'/%3E%3C/svg%3E");
}

/* ==========================================================
   AFTER HOURS — CHIAROSCURO FINAL — 2026-09-29
   Art direction: cool blue shadows, warm lamplight, restrained color across the full site.
   Mostly ink/charcoal; blue lives in the shadows; amber only catches edges.
   ========================================================== */
body.skin-after-hours:not(.dark-mode) {


}

body.skin-after-hours:not(.dark-mode) > header,
body.skin-after-hours:not(.dark-mode) .gm-site-drawer,
body.home-page.skin-after-hours:not(.dark-mode) > header,
body.home-page.skin-after-hours:not(.dark-mode) .gm-site-drawer {
}

body.skin-after-hours:not(.dark-mode) #theme-toggle {
}

body.skin-after-hours:not(.dark-mode) main,
body.skin-after-hours:not(.dark-mode) .reader-controls {
}

/* Structural surfaces stay nearly black. Blue appears mostly in edges/shadows. */
body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    article:not(.author-library-card), .story-header,
    .form-section, .settings-box, .filters, .published-intro-card,
    .published-details-card, .published-social-card, .published-collapsible,
    .chapter-editor-card, .text-conversation-builder, .library-note,
    .browse-work, .search-work, .dashboard-work, .dashboard-work-card,
    .account-box, .my-library-panel, .browse-shelf-card,
    .request-form-card, .request-browser
) {
}

body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    .chapter-text, #published-chapter-text, #published-notes, .preview-notes
) {
}

/* The profile stays a library file, but as a dark dossier instead of a giant cream slab. */
body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public {
}
body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public :is(
    h1, h2, h3, p, span, strong, label
) {
}
body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public a,
body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public a:visited {
}
body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public :is(
    .author-stat, .author-work-ledger > div, .author-works-ledger-header span,
    .author-member-info, .author-genre-tag
) {
}

body.skin-after-hours:not(.dark-mode) :is(input, select, textarea, [contenteditable="true"]) {
}
body.skin-after-hours:not(.dark-mode) :is(input, textarea)::placeholder {
    opacity: 1 !important;
}

body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    .tag-pill, .tag, .tags a, .relationship-badge
) {
}
body.skin-after-hours:not(.dark-mode):not(.home-page) .rating-badge {
}

body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    .field-note, .filter-note, .dashboard-work-meta, .library-panel-note,
    .story-info, .story-stats, .published-secondary-meta, small
) {
    opacity: 1 !important;
}

body.skin-after-hours:not(.dark-mode) main :is(h1, h2, h3, legend, strong) {
}
body.skin-after-hours:not(.dark-mode) main a,
body.skin-after-hours:not(.dark-mode) main a:visited {
}
body.skin-after-hours:not(.dark-mode) main a:hover {
}

body.skin-after-hours:not(.dark-mode):not(.home-page) :is(button:not(#theme-toggle), .button-link) {
}
body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    .primary-button, .start-reading-button, .publish-work-button,
    #browse-quick-search-form button, #fandom-search-button
) {
}
body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    .primary-button, .start-reading-button, .publish-work-button,
    #browse-quick-search-form button, #fandom-search-button
):hover {
}

body.skin-after-hours:not(.dark-mode) .site-footer {
}
body.skin-after-hours:not(.dark-mode) .site-footer a,
body.skin-after-hours:not(.dark-mode) .site-footer a:visited {
}

/* Homepage: almost-black room, blue living in the shadows, lamp warmth only at focal points. */
body.home-page.skin-after-hours:not(.dark-mode) {
}

body.home-page.skin-after-hours:not(.dark-mode) main {
}

body.home-page.skin-after-hours:not(.dark-mode) .home-hero {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-hero-kicker {
}

body.home-page.skin-after-hours:not(.dark-mode) .home-search-form {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-search-form input {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-search-form input::placeholder {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-search-form button {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-search-form button:hover {
}

/* Shelf items: covers provide the color. The site recedes instead of boxing them in. */
body.home-page.skin-after-hours:not(.dark-mode) .recent-work-card {
}
body.home-page.skin-after-hours:not(.dark-mode) .recent-work-card:hover {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-doorway-card {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-doorway-card:hover {
}
body.home-page.skin-after-hours:not(.dark-mode) :is(
    .recent-work-card .work-author, .recent-work-card .work-summary,
    .recent-work-card .work-fandom, .recent-work-card .story-info,
    .recent-work-card .story-stats, .recent-work-card .work-stats,
    .home-doorway-card p
) {
    opacity: 1 !important;
}
body.home-page.skin-after-hours:not(.dark-mode) :is(
    .recent-work-card .work-author a, .recent-work-card .work-fandom a,
    .recent-work-card .summary-more
) {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-doorway-card h3 {
}

/* Real uploaded jackets float on the shelf. No second rectangle around the book. */
body.home-page.skin-after-hours:not(.dark-mode) .gm-book-cover-trigger.has-jacket {
    border: 0 !important;
    overflow: visible !important;
}
body.home-page.skin-after-hours:not(.dark-mode) .gm-book-cover-trigger.has-jacket .gm-work-jacket-media {
    border: 0 !important;
}
body.home-page.skin-after-hours:not(.dark-mode) .gm-book-cover-trigger.has-jacket:hover .gm-work-jacket-media,
body.home-page.skin-after-hours:not(.dark-mode) .gm-book-cover-trigger.has-jacket:focus-visible .gm-work-jacket-media {
    transform: translateY(-2px);
}

/* Warmth is a glint, not a flood. */
body.home-page.skin-after-hours:not(.dark-mode) :is(.section-link, .shelf-see-all, .home-section-link),
body.home-page.skin-after-hours:not(.dark-mode) :is(.section-link, .shelf-see-all, .home-section-link):visited {
}

.theme-options button[data-skin="after-hours"]::before {
    background: linear-gradient(
        135deg,
        #0f1216 0 34%,
        #1b222b 34% 62%,
        #34495d 62% 84%,
        #c18a57 84% 100%
    ) !important;
}

@media (max-width: 760px) {
    body.home-page.skin-after-hours:not(.dark-mode) .home-hero {
    }
}


/* ==========================================================
   AFTER HOURS — ALL-PAGE FINISHING PASS — 2026-09-29
   Extends the chosen chiaroscuro palette to utility pages, editor panels,
   dialogs, comments, profile tabs, and other secondary surfaces.
   ========================================================== */
body.skin-after-hours:not(.dark-mode) main :is(
    fieldset,
    details,
    .gm-crosspost-shell,
    .gm-crosspost-dialog,
    .gm-ao3-link-card,
    .profile-picker-panel,
    .author-content-panel,
    .chapter-notes-panel,
    .chapter-schedule-panel,
    .text-conversation-preview,
    .gm-jacket-editor,
    .gm-jacket-preview-wrap,
    .comment-form,
    .comments-list,
    .dmca-confirmation,
    .settings-status-message,
    .gm-reading-progress-card
) {
}

body.skin-after-hours:not(.dark-mode) main :is(
    .chapter-header,
    .dashboard-header,
    .author-page-heading,
    .chapter-editor-heading,
    .section-heading-row,
    .library-panel-heading
) {
}

body.skin-after-hours:not(.dark-mode) main :is(
    .author-content-tab,
    .my-library-tab,
    .request-view-tab,
    .button-secondary,
    .gm-toolbar-more-button,
    .summary-toggle
) {
}

body.skin-after-hours:not(.dark-mode) main :is(
    .author-content-tab.is-active,
    .my-library-tab.is-active,
    .request-view-tab.is-active
) {
}

body.skin-after-hours:not(.dark-mode) main :is(
    hr,
    .section-heading-row,
    .published-priority-row,
    .chapter-navigation,
    .form-actions
) {
}

body.skin-after-hours:not(.dark-mode) main :is(
    table,
    th,
    td
) {
}

/* ==========================================================
   FERNWOOD — DARK MODE — 2026-09-29
   The preserved green direction: deep moss/forest shadows, parchment text,
   and small brass highlights. Light-mode Fernwood remains unchanged.
   ========================================================== */
body:is(.skin-fernwood, .skin-matcha).dark-mode {
    --gm-header: #101610;
    --gm-page: #182019;
    --gm-hero: #141c15;
    --gm-card: #222c23;
    --gm-card-bg: #222c23;
    --gm-card-text: #edf0e8;
    --gm-card-border: #435548;
    --gm-accent: #a98958;
    --gm-header-text: #f2efe6;
    --gm-hero-text: #f4f1e8;
    --gm-section-text: #edf0e8;
    --gm-border: #405144;
    --gm-button: #4e6751;
    --gm-secondary-button: #2f3e31;
    --gm-link-color: #c6b17e;
    --chapter-reader-bg: #151c16;
    --chapter-reader-text: #edf0e8;
    --chapter-reader-border: #405144;
    --gm-interior-muted: #aeb8aa;

    --ui-field: #151c16;
    --ui-ink: #edf0e8;
    --ui-border: #536758;
    --ui-soft: #29352b;
    --ui-primary: #506a54;
    --ui-on-primary: #f4f1e8;
    --ui-focus: #b59663;
    --ui-danger: #b66b63;

    --library-hero-wash: linear-gradient(
        90deg,
        rgba(6, 11, 7, .58) 0%,
        rgba(13, 24, 15, .30) 34%,
        rgba(13, 24, 15, .34) 67%,
        rgba(6, 11, 7, .62) 100%
    );
    --library-hero-ink: #f4f1e8;
    --library-hero-kicker: #c8b884;
    --library-search-paper: #e8ebdf;

    background:
        radial-gradient(circle at 78% 5%, rgba(169, 137, 88, .05), transparent 25rem),
        radial-gradient(circle at 15% 13%, rgba(72, 103, 75, .12), transparent 34rem),
        linear-gradient(180deg, #1a231b 0%, #151c16 100%) !important;
    color: #edf0e8 !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode > header,
body:is(.skin-fernwood, .skin-matcha).dark-mode .gm-site-drawer,
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode > header,
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .gm-site-drawer {
    background: linear-gradient(180deg, #0d120e 0%, #111812 100%) !important;
    color: #f2efe6 !important;
    border-color: #2a382d !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode #theme-toggle {
    background: #18221a !important;
    color: #f2efe6 !important;
    border-color: #394a3c !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode main,
body:is(.skin-fernwood, .skin-matcha).dark-mode .reader-controls {
    color: #edf0e8 !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode:not(.home-page) :is(
    article:not(.author-library-card), .story-header,
    .form-section, .settings-box, .filters, .published-intro-card,
    .published-details-card, .published-social-card, .published-collapsible,
    .chapter-editor-card, .text-conversation-builder, .library-note,
    .browse-work, .search-work, .dashboard-work, .dashboard-work-card,
    .account-box, .my-library-panel, .browse-shelf-card,
    .request-form-card, .request-browser,
    fieldset, details, .gm-crosspost-shell, .gm-crosspost-dialog,
    .gm-ao3-link-card, .profile-picker-panel, .author-content-panel,
    .chapter-notes-panel, .chapter-schedule-panel, .text-conversation-preview,
    .gm-jacket-editor, .gm-jacket-preview-wrap, .comment-form,
    .comments-list, .dmca-confirmation, .gm-reading-progress-card
) {
    background:
        linear-gradient(145deg, rgba(72, 102, 75, .14), transparent 60%),
        #202922 !important;
    color: #edf0e8 !important;
    border-color: #405144 !important;
    box-shadow: 0 12px 30px rgba(2, 7, 3, .20) !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode:not(.home-page) :is(
    .chapter-text, #published-chapter-text, #published-notes, .preview-notes
) {
    background:
        linear-gradient(180deg, rgba(70, 102, 73, .08), transparent 10rem),
        #151c16 !important;
    color: #edf0e8 !important;
    border-color: #405144 !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode .author-library-card.author-library-card-public {
    background:
        radial-gradient(circle at 80% 4%, rgba(169, 137, 88, .07), transparent 19rem),
        linear-gradient(145deg, rgba(71, 99, 74, .14), transparent 43%),
        #202922 !important;
    color: #edf0e8 !important;
    border-color: #435548 !important;
    box-shadow: 0 16px 38px rgba(2, 7, 3, .27) !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode .author-library-card.author-library-card-public :is(
    h1, h2, h3, p, span, strong, label
) {
    color: #edf0e8 !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode .author-library-card.author-library-card-public a,
body:is(.skin-fernwood, .skin-matcha).dark-mode .author-library-card.author-library-card-public a:visited {
    color: #c6b17e !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode .author-library-card.author-library-card-public :is(
    .author-stat, .author-work-ledger > div, .author-works-ledger-header span,
    .author-member-info, .author-genre-tag
) {
    border-color: #435548 !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode :is(input, select, textarea, [contenteditable="true"]) {
    background: #151c16 !important;
    color: #edf0e8 !important;
    -webkit-text-fill-color: #edf0e8 !important;
    border-color: #536758 !important;
    caret-color: #edf0e8 !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode :is(input, textarea)::placeholder {
    color: #929e91 !important;
    -webkit-text-fill-color: #929e91 !important;
    opacity: 1 !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode:not(.home-page) :is(
    .tag-pill, .tag, .tags a, .relationship-badge
) {
    background: #29362c !important;
    color: #e0e7dc !important;
    border-color: #526858 !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode:not(.home-page) .rating-badge {
    background: #503735 !important;
    color: #f0dfd7 !important;
    border-color: #73514d !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode:not(.home-page) :is(
    .field-note, .filter-note, .dashboard-work-meta, .library-panel-note,
    .story-info, .story-stats, .published-secondary-meta, small
) {
    color: #aeb8aa !important;
    opacity: 1 !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode main :is(h1, h2, h3, legend, strong) {
    color: #edf0e8 !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode main a,
body:is(.skin-fernwood, .skin-matcha).dark-mode main a:visited {
    color: #c6b17e !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode main a:hover {
    color: #d9c895 !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode main :is(
    button:not(#theme-toggle), .button-link, .button-secondary,
    .gm-toolbar-more-button, .summary-toggle
) {
    background: #29352b !important;
    color: #edf0e8 !important;
    border-color: #536758 !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode main :is(
    .primary-button, .start-reading-button, .publish-work-button,
    #browse-quick-search-form button, #fandom-search-button,
    .author-content-tab.is-active, .my-library-tab.is-active,
    .request-view-tab.is-active
) {
    background: #506a54 !important;
    color: #f4f1e8 !important;
    border-color: #6d846f !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode main :is(
    .primary-button, .start-reading-button, .publish-work-button,
    #browse-quick-search-form button, #fandom-search-button
):hover {
    background: #5d795f !important;
    border-color: #7d927e !important;
}

body:is(.skin-fernwood, .skin-matcha).dark-mode .site-footer {
    background: #0f1510 !important;
    color: #cbd1c8 !important;
    border-top-color: #2a382d !important;
}
body:is(.skin-fernwood, .skin-matcha).dark-mode .site-footer a,
body:is(.skin-fernwood, .skin-matcha).dark-mode .site-footer a:visited {
    color: #c6b17e !important;
}

body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode {
    --home-header: #101610;
    --home-page: #182019;
    --home-card: #222c23;
    --home-accent: #a98958;
    --home-header-text: #f2efe6;
    --home-section-text: #edf0e8;
    --home-card-text: #edf0e8;
    --home-border: #405144;
    --home-button: #506a54;
    background: #182019 !important;
}

body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode main {
    background:
        radial-gradient(circle at 78% 7%, rgba(169, 137, 88, .04), transparent 26rem),
        radial-gradient(circle at 13% 17%, rgba(72, 103, 75, .10), transparent 34rem),
        linear-gradient(180deg, #1a231b 0%, #151c16 100%) !important;
}

body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-hero {
    border-color: #405144 !important;
    box-shadow:
        inset 0 16px 64px rgba(2, 7, 3, .32),
        inset 0 -28px 72px rgba(2, 7, 3, .46) !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-hero-kicker {
    color: #c8b884 !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-search-form {
    background: rgba(11, 16, 12, .82) !important;
    border-color: rgba(169, 137, 88, .43) !important;
    box-shadow: 0 12px 30px rgba(2, 7, 3, .30) !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-search-form input {
    background: #e8ebdf !important;
    color: #252b25 !important;
    -webkit-text-fill-color: #252b25 !important;
    border-color: #9aa38e !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-search-form input::placeholder {
    color: #666d63 !important;
    -webkit-text-fill-color: #666d63 !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-search-form button {
    background: #506a54 !important;
    color: #f4f1e8 !important;
    border-color: #6d846f !important;
}

body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .recent-work-card {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .recent-work-card:hover {
    background: rgba(57, 76, 60, .18) !important;
    border-color: rgba(78, 99, 81, .32) !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-doorway-card {
    background:
        linear-gradient(145deg, rgba(71, 99, 74, .15), transparent 60%),
        #202922 !important;
    color: #edf0e8 !important;
    border-color: #405144 !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-doorway-card:hover {
    background:
        linear-gradient(145deg, rgba(80, 112, 84, .18), transparent 62%),
        #263128 !important;
    border-color: #536758 !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode :is(
    .recent-work-card .work-author, .recent-work-card .work-summary,
    .recent-work-card .work-fandom, .recent-work-card .story-info,
    .recent-work-card .story-stats, .recent-work-card .work-stats,
    .home-doorway-card p
) {
    color: #aeb8aa !important;
    opacity: 1 !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode :is(
    .recent-work-card .work-author a, .recent-work-card .work-fandom a,
    .recent-work-card .summary-more, .section-link, .shelf-see-all,
    .home-section-link
) {
    color: #c6b17e !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .home-doorway-card h3 {
    color: #edf0e8 !important;
}

/* Keep actual uploaded jackets floating here too; the art supplies the color. */
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .gm-book-cover-trigger.has-jacket {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .gm-book-cover-trigger.has-jacket .gm-work-jacket-media {
    border: 0 !important;
    box-shadow:
        0 13px 25px rgba(0, 5, 1, .34),
        0 0 0 1px rgba(199, 181, 132, .05) !important;
}
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .gm-book-cover-trigger.has-jacket:hover .gm-work-jacket-media,
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode .gm-book-cover-trigger.has-jacket:focus-visible .gm-work-jacket-media {
    transform: translateY(-2px);
    box-shadow:
        0 18px 32px rgba(0, 5, 1, .43),
        0 0 0 1px rgba(198, 177, 126, .11) !important;
}

/* ==========================================================
   DE-BOXING PASS — 2026-09-29
   Keep meaningful surfaces, remove the extra rectangles around
   shelf jackets and nested search-filter groups.
   ========================================================== */

/* The jacket is the object. All homepage skins use the same open shelf. */
html body.home-page #recently-updated-list > .gm-book-tile,
html body.home-page .gm-book-shelf > .gm-book-tile {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Uploaded art should float on the shelf, with depth coming from the book itself. */
html body.home-page .gm-book-tile:has(.gm-book-cover-trigger.has-jacket) {
    background: transparent !important;
}

html body.home-page .gm-book-tile:hover,
html body.home-page .gm-book-tile:focus-within {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Keep title/author directly under the jacket instead of inside a faux card. */
html body.home-page .gm-book-tile-title,
html body.home-page .gm-book-tile-author {
    padding-inline: 0 !important;
}

/* Search gets one real container. The groups inside are sections, not cards. */
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .catalogue-filters {
}

body.skin-after-hours:not(.dark-mode) .catalogue-search-page :is(
    .browse-filter-core fieldset,
    .favorite-tags-browse,
    .browse-tag-controls,
    .saved-exclusions,
    .advanced-filter-content,
    .advanced-filter-content .browse-quick-filter,
    .browse-warning-filter,
    .browse-filter-actions
) {
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    border-radius: 0 !important;
}

body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-filter-core fieldset,
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .favorite-tags-browse,
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-tag-controls,
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .saved-exclusions,
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-warning-filter {
}

body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-filter-core {
    gap: 18px 28px !important;
}

body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-filter-core fieldset {
    padding: 0 0 15px !important;
}

/* Filter choices stay as small controls, but lose the big gray slabs behind them. */
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-filter-core fieldset > label,
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .advanced-filter-content .quick-filter-options > label {
}

body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-filter-core fieldset > label:hover,
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .advanced-filter-content .quick-filter-options > label:hover {
}

body.skin-after-hours:not(.dark-mode) .catalogue-search-page .browse-filter-core fieldset > label:has(input:checked),
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .advanced-filter-content .quick-filter-options > label:has(input:checked) {
}

/* Details should open into the page, not reveal another card inside the card. */
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .advanced-filters {
    border: 0 !important;
    border-radius: 0 !important;
}
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .advanced-filters > summary {
    border: 0 !important;
}
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .advanced-filter-content {
    padding-inline: 0 !important;
}

/* The main input is allowed to be a surface; it is an actual interactive field. */
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .catalogue-main-search {
    border: 0 !important;
}

/* Fernwood dark gets the same shelf cleanup without changing its forest palette. */
body.home-page:is(.skin-fernwood, .skin-matcha).dark-mode #recently-updated-list.gm-book-shelf {
    background: transparent !important;
}

/* ==========================================================
   AFTER HOURS — SURFACE HARMONIZATION — 2026-09-29
   Keep the cool blue in the shadows, but stop large UI surfaces
   from reading as flat gray. Warm dark wood/paper tones carry cards;
   slate-blue is reserved for depth, focus, and primary actions.
   ========================================================== */
body.skin-after-hours:not(.dark-mode) {
}

/* Interior pages should sit in the same blue-black room as the homepage. */
body.skin-after-hours:not(.dark-mode):not(.home-page) main {
}

/* Meaningful cards read as warm objects sitting inside cool shadow. */
body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    article:not(.author-library-card), .story-header,
    .form-section, .settings-box, .filters, .published-intro-card,
    .published-details-card, .published-social-card, .published-collapsible,
    .chapter-editor-card, .text-conversation-builder, .library-note,
    .browse-work, .search-work, .dashboard-work, .dashboard-work-card,
    .account-box, .my-library-panel, .browse-shelf-card,
    .request-form-card, .request-browser,
    .gm-crosspost-shell, .gm-crosspost-dialog, .gm-ao3-link-card,
    .profile-picker-panel, .author-content-panel,
    .chapter-notes-panel, .chapter-schedule-panel,
    .text-conversation-preview, .gm-jacket-editor,
    .gm-jacket-preview-wrap, .comment-form, .comments-list,
    .dmca-confirmation, .settings-status-message, .gm-reading-progress-card
) {
}

/* Profile dossier follows the same warm-card rule. */
body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public {
}
body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public :is(
    .author-stat, .author-work-ledger > div, .author-works-ledger-header span,
    .author-member-info, .author-genre-tag
) {
}

/* Secondary controls should be dark wood/ink, not medium gray slabs. */
body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    button:not(#theme-toggle), .button-link,
    .author-content-tab, .my-library-tab, .request-view-tab,
    .button-secondary, .gm-toolbar-more-button, .summary-toggle
) {
}

/* Primary actions keep the twilight-blue note. */
body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    .primary-button, .start-reading-button, .publish-work-button,
    #browse-quick-search-form button, #fandom-search-button,
    .author-content-tab.is-active, .my-library-tab.is-active,
    .request-view-tab.is-active
) {
}

/* Search: one warm desk surface, cool-black fields, no gray nesting. */
body.skin-after-hours:not(.dark-mode) .catalogue-search-page .catalogue-filters {
}
body.skin-after-hours:not(.dark-mode) .catalogue-search-page :is(
    .browse-filter-core fieldset,
    .favorite-tags-browse,
    .browse-tag-controls,
    .saved-exclusions,
    .browse-warning-filter,
    .advanced-filters
) {
}
body.skin-after-hours:not(.dark-mode) .catalogue-search-page :is(
    .browse-filter-core fieldset > label,
    .advanced-filter-content .quick-filter-options > label
) {
}
body.skin-after-hours:not(.dark-mode) .catalogue-search-page :is(
    .browse-filter-core fieldset > label,
    .advanced-filter-content .quick-filter-options > label
):hover {
}

/* Homepage utility cards become dark wood in blue shadow instead of gray panels. */
body.home-page.skin-after-hours:not(.dark-mode) .home-doorway-card {
}
body.home-page.skin-after-hours:not(.dark-mode) .home-doorway-card:hover {
}

/* The floating book preview is another warm object, not a gray tooltip. */
body.skin-after-hours:not(.dark-mode) .gm-shelf-preview {
}
body.skin-after-hours:not(.dark-mode) .gm-shelf-preview :is(
    .gm-shelf-preview-close, .gm-shelf-preview-action
) {
}

/* Keep the actual writing/reading fields cool and dark for contrast. */
body.skin-after-hours:not(.dark-mode) :is(input, select, textarea, [contenteditable="true"], .chapter-text, #published-chapter-text) {
}

/* ==========================================================
   AFTER HOURS — RESTRAINT PASS — 2026-09-29
   Keep the room cool and dark. Warmth is lamplight, not wall paint.
   Also lock the desktop/mobile rail to one color on every page.
   ========================================================== */

/* One rail, one color, everywhere. Do not let page-specific header styles tint it. */
html body.skin-after-hours:not(.dark-mode) > header,
html body.skin-after-hours:not(.dark-mode).home-page > header,
html body.skin-after-hours:not(.dark-mode) .gm-site-drawer,
html body.skin-after-hours:not(.dark-mode).home-page .gm-site-drawer {
}

html body.skin-after-hours:not(.dark-mode) .gm-site-drawer nav > a,
html body.skin-after-hours:not(.dark-mode) .gm-site-drawer nav > a:visited {
}

html body.skin-after-hours:not(.dark-mode) .gm-site-drawer nav > a:hover,
html body.skin-after-hours:not(.dark-mode) .gm-site-drawer nav > a:focus-visible {
}

html body.skin-after-hours:not(.dark-mode) .gm-site-drawer nav > a.gm-nav-current {
}

html body.skin-after-hours:not(.dark-mode) #theme-toggle {
}

/* Large surfaces stay cool. Warmth belongs to accents and a few deliberate paper objects. */
html body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    article:not(.author-library-card), .story-header,
    .form-section, .settings-box, .filters, .published-intro-card,
    .published-details-card, .published-social-card, .published-collapsible,
    .chapter-editor-card, .text-conversation-builder,
    .browse-work, .search-work, .dashboard-work, .dashboard-work-card,
    .account-box, .my-library-panel, .browse-shelf-card,
    .request-form-card, .request-browser,
    .gm-crosspost-shell, .gm-crosspost-dialog, .gm-ao3-link-card,
    .profile-picker-panel, .author-content-panel,
    .chapter-notes-panel, .chapter-schedule-panel,
    .text-conversation-preview, .gm-jacket-editor,
    .gm-jacket-preview-wrap, .comment-form, .comments-list,
    .dmca-confirmation, .settings-status-message, .gm-reading-progress-card
) {
}

/* Public profile dossier should feel like part of the night room, not a brown card pasted over it. */
html body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public {
}

html body.skin-after-hours:not(.dark-mode) .author-library-card.author-library-card-public :is(
    .author-stat, .author-work-ledger > div, .author-works-ledger-header span,
    .author-member-info, .author-genre-tag
) {
}

/* Request/Search panels were carrying too much brown. Return them to cool shadow. */
html body.skin-after-hours:not(.dark-mode) .catalogue-search-page .catalogue-filters,
html body.skin-after-hours:not(.dark-mode) :is(.request-form-card, .request-browser) {
}

/* Controls remain distinct without turning into medium-gray slabs. */
html body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    button:not(#theme-toggle), .button-link,
    .author-content-tab, .my-library-tab, .request-view-tab,
    .button-secondary, .gm-toolbar-more-button, .summary-toggle
) {
}

html body.skin-after-hours:not(.dark-mode):not(.home-page) :is(
    .primary-button, .start-reading-button, .publish-work-button,
    #browse-quick-search-form button, #fandom-search-button,
    .author-content-tab.is-active, .my-library-tab.is-active,
    .request-view-tab.is-active
) {
}

/* Keep the librarian note as one intentional pool of warm lamplight. */
html body.home-page.skin-after-hours:not(.dark-mode) .library-note,
html body.skin-after-hours:not(.dark-mode) .library-note {
}

/* ==========================================================
   AFTER HOURS — RAIL SPECIFICITY FIX — 2026-09-29
   The original interior After Hours rule has higher specificity than the
   shared shell rule, so the logo/header block kept the old brown while the
   drawer used the new blue-black. Match that specificity here so the rail is
   genuinely one continuous color.
   ========================================================== */
html body.skin-after-hours:not(.dark-mode):not(.home-page) > header,
html body.skin-after-hours:not(.dark-mode):not(.home-page) .gm-site-drawer,
html body.home-page.skin-after-hours:not(.dark-mode) > header,
html body.home-page.skin-after-hours:not(.dark-mode) .gm-site-drawer {
}

html body.skin-after-hours:not(.dark-mode):not(.home-page) > header > .site-logo,
html body.home-page.skin-after-hours:not(.dark-mode) > header > .site-logo {
}

html body.skin-after-hours:not(.dark-mode):not(.home-page) > header #theme-toggle,
html body.home-page.skin-after-hours:not(.dark-mode) > header #theme-toggle {
}

/* ==========================================================
   AFTER HOURS — CANVAS + PROFILE FIX — 2026-09-29
   The page canvas itself owns the cool night gradient. Interior <main>
   elements stay transparent so their max-width margins do not reveal the
   old brown theme underneath. The public profile keeps its library-file
   structure, but uses the same night palette in After Hours.
   ========================================================== */

/* Paint the entire interior canvas, including the gutters around narrow mains. */
html body.skin-after-hours:not(.dark-mode):not(.home-page) {
}

/* Do not let a centered/max-width main become a differently coloured slab. */
html body.skin-after-hours:not(.dark-mode):not(.home-page) > main,
html body.skin-after-hours:not(.dark-mode):not(.home-page) main.request-desk,
html body.skin-after-hours:not(.dark-mode):not(.home-page) main.author-page,
html body.skin-after-hours:not(.dark-mode):not(.home-page) main.writing-desk,
html body.skin-after-hours:not(.dark-mode):not(.home-page) main.catalogue-search-page,
html body.skin-after-hours:not(.dark-mode):not(.home-page) main.browse-discovery-page,
html body.skin-after-hours:not(.dark-mode):not(.home-page) main.settings-page {
}

/* After Hours public profiles are a dark library file, not a light-theme card. */
html body.skin-after-hours:not(.dark-mode) main.author-page .author-library-card.author-library-card-public {

}

html body.skin-after-hours:not(.dark-mode) main.author-page .author-library-card.author-library-card-public :is(
    h1, h2, h3, p, span, strong, label
) {
}

html body.skin-after-hours:not(.dark-mode) main.author-page
    .author-library-card.author-library-card-public #author-display-name {
}

html body.skin-after-hours:not(.dark-mode) main.author-page .author-library-card.author-library-card-public :is(
    .author-avatar, .author-card-profile .author-avatar
) {
}

html body.skin-after-hours:not(.dark-mode) main.author-page .author-library-card.author-library-card-public :is(
    .author-card-profile, .author-card-identity h2, .author-member-info,
    .author-stat, .author-work-ledger > div, .author-works-ledger-header span,
    .author-genre-tag
) {
}

html body.skin-after-hours:not(.dark-mode) main.author-page .author-library-card.author-library-card-public a,
html body.skin-after-hours:not(.dark-mode) main.author-page .author-library-card.author-library-card-public a:visited {
}

html body.skin-after-hours:not(.dark-mode):not(.home-page) .request-desk-rules {
}

/* The mobile preview stays fixed while horizontal swipes browse summaries.
   Vertical page scrolling dismisses it. */
.gm-shelf-preview-mobile-title,
.gm-shelf-preview-mobile-nav { display: none; }
@media (max-width: 760px), (hover: none), (pointer: coarse) {
    html body.home-page .gm-shelf-preview {
        display: block;
        position: fixed !important;
        top: auto !important;
        right: auto !important;
        bottom: calc(10px + env(safe-area-inset-bottom)) !important;
        left: max(10px, calc((100vw - 410px) / 2)) !important;
        width: min(410px, calc(100vw - 20px)) !important;
        max-width: none !important;
        max-height: calc(100dvh - 20px - env(safe-area-inset-bottom)) !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-radius: 14px !important;
        transform: none !important;
        touch-action: pan-y;
        overscroll-behavior: contain;
        box-shadow: 0 18px 45px rgb(0 0 0 / 32%) !important;
    }
    html body.home-page .gm-shelf-preview[hidden] {
        display: none !important;
    }
    html body.home-page .gm-shelf-preview.is-dismissing {
        opacity: 0;
        transform: translateY(calc(100% + 20px)) !important;
        transition: transform 180ms ease-in, opacity 180ms ease-in;
        pointer-events: none;
    }
    html body.home-page .gm-shelf-preview-tags,
    html body.home-page .gm-shelf-preview-popularity,
    html body.home-page .gm-shelf-preview-stats {
        display: none !important;
    }
    html body.home-page .gm-shelf-preview-art {
        display: grid !important;
        position: relative;
        box-sizing: border-box;
        min-height: 108px;
        padding: 16px 50px 14px 15px;
        overflow: hidden;
        border-radius: 14px 14px 0 0;
    }
    html body.home-page .gm-shelf-preview-art .gm-book-jacket-title {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        font-size: 1.08rem;
        line-height: 1.2;
    }
    html body.home-page .gm-shelf-preview-art :is(.gm-book-jacket-title, .gm-book-jacket-kicker) {
        color: #fff8ed !important;
        -webkit-text-fill-color: #fff8ed !important;
        text-shadow: 0 2px 7px rgb(0 0 0 / 85%);
    }
    html body.home-page .gm-shelf-preview-body {
        display: flex !important;
        flex-direction: column;
        gap: 7px;
        padding: 14px 15px 9px !important;
    }
    html body.home-page .gm-shelf-preview-mobile-title { display: none !important; }
    html body.home-page .gm-shelf-preview-author {
        order: 1;
        margin: 0 !important;
    }
    html body.home-page .gm-shelf-preview .gm-shelf-preview-topline {
        order: 2;
        margin: 0 !important;
    }
    html body.home-page .gm-shelf-preview-summary-row {
        order: 3;
        margin: 0 !important;
    }
    html body.home-page .gm-shelf-preview-summary {
        -webkit-line-clamp: 2;
        font-size: .84rem;
    }
    html body.home-page .gm-shelf-preview-actions-top {
        order: 4;
        margin: 0 !important;
    }
    html body.home-page .gm-shelf-preview-mobile-nav {
        display: flex !important;
        order: 5;
        justify-content: space-between;
        align-items: center;
        gap: 8px;
        min-height: 28px;
        margin-top: 1px;
        color: inherit;
        font: 600 .72rem/1.2 var(--font-ui);
        opacity: .85;
    }
    html body.home-page .gm-shelf-preview-mobile-nav button {
        width: 30px;
        height: 28px;
        min-height: 0;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: inherit !important;
        box-shadow: none !important;
        font: 700 1.35rem/1 var(--font-ui);
    }
    html body.home-page .gm-shelf-preview-mobile-nav button:disabled { opacity: .25; }
    html body.home-page #gm-shelf-preview button#gm-shelf-preview-close {
        z-index: 4;
        top: 9px !important;
        right: 12px !important;
        width: 32px;
        height: 32px;
        min-height: 32px;
        padding: 0 !important;
        border: 0 !important;
        background: rgb(15 20 23 / 70%) !important;
        color: #fff8ed !important;
        -webkit-text-fill-color: #fff8ed !important;
        box-shadow: none !important;
        backdrop-filter: none;
        font-size: 1.15rem;
    }
    body.home-page .gm-book-cover-trigger:hover,
    body.home-page .gm-book-cover-trigger:focus-visible,
    body.home-page .gm-book-cover-trigger.has-jacket:hover .gm-work-jacket-media,
    body.home-page .gm-book-cover-trigger.has-jacket:focus-visible .gm-work-jacket-media {
        transform: none !important;
        filter: none !important;
    }
}

/* Keep navigation controls as plain glyphs across every theme. */
@media (max-width: 900px) {
    html body > header button.gm-menu-toggle:not(#theme-toggle),
    html body > header button.gm-menu-toggle:not(#theme-toggle):hover,
    html body #gm-site-drawer button.gm-drawer-close:not(#theme-toggle),
    html body #gm-site-drawer button.gm-drawer-close:not(#theme-toggle):hover {
        background: transparent !important;
        background-image: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        color: inherit !important;
    }
}
html body #gm-site-drawer nav > a.gm-nav-current,
html body #gm-site-drawer nav > a.gm-nav-current:hover,
html body #gm-site-drawer nav > a.gm-nav-current:focus-visible {
    background: transparent !important;
    background-image: none !important;
    border-radius: 0 !important;
    box-shadow: inset 3px 0 0 var(--gm-accent, currentColor) !important;
}
html body #gm-site-drawer nav > a:not(.gm-nav-current):hover {
    background: transparent !important;
    text-decoration: underline !important;
}

/* The desktop hover card can overlap its jacket; its artwork opens the work. */
html body.home-page main a.gm-shelf-preview-art {
    color: #f6ecdc !important;
    -webkit-text-fill-color: #f6ecdc !important;
    text-decoration: none !important;
}

/* Dark Academia's light-mode discovery cards have dark backgrounds. */
html body.skin-dark-academia:not(.dark-mode) main.browse-discovery-page
    .browse-shelf-grid .browse-shelf-card h3 {
    color: #e3c68d !important;
    -webkit-text-fill-color: #e3c68d !important;
}
html body.skin-dark-academia:not(.dark-mode) main.browse-discovery-page
    .browse-shelf-grid .browse-shelf-card a,
html body.skin-dark-academia:not(.dark-mode) main.browse-discovery-page
    .browse-shelf-grid .browse-shelf-card a:visited {
    color: #edcf98 !important;
    -webkit-text-fill-color: #edcf98 !important;
}

/* Mobile shelf preview is attached to body, clear of main's clipping layers. */
#gm-mobile-shelf-preview[hidden] { display: none !important; }
@media (max-width: 760px), (hover: none), (pointer: coarse) {
    #gm-mobile-shelf-preview {
        position: fixed !important;
        z-index: 10000 !important;
        left: 50% !important;
        right: auto !important;
        top: calc(66px + env(safe-area-inset-top)) !important;
        bottom: auto !important;
        transform: translateX(-50%) !important;
        display: flex;
        flex-direction: column;
        gap: 8px;
        box-sizing: border-box;
        width: min(410px, calc(100vw - 20px));
        max-height: calc(100dvh - 76px - env(safe-area-inset-top));
        overflow: hidden;
        padding: 16px;
        border: 1px solid var(--gm-card-border, var(--gm-border, #777));
        border-radius: 14px;
        background: var(--gm-card, var(--gm-card-bg, #f5efe5));
        color: var(--gm-card-text, #2b2926);
        box-shadow: 0 18px 45px rgb(0 0 0 / 35%);
        touch-action: pan-y;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-close {
        position: absolute;
        top: 7px;
        right: 9px;
        display: grid;
        place-items: center;
        width: 34px;
        height: 34px;
        min-height: 34px;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: inherit !important;
        box-shadow: none !important;
        font: 500 1.25rem/1 sans-serif;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-title {
        display: block;
        max-width: calc(100% - 36px);
        color: inherit !important;
        font: 700 1.05rem/1.2 var(--font-display, Georgia, serif);
        text-decoration: none;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-author {
        margin: 0;
        font-size: .78rem;
        opacity: .78;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-summary {
        display: -webkit-box;
        margin: 0;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        font-size: .85rem;
        line-height: 1.4;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-actions { display: flex; }
    #gm-mobile-shelf-preview .gm-mobile-preview-read {
        display: grid;
        place-items: center;
        min-height: 40px;
        flex: 1;
        border-radius: 7px;
        background: var(--gm-accent, #66513b);
        color: #fff !important;
        font-weight: 700;
        text-decoration: none;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-navigation {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        font: 600 .72rem/1.25 var(--font-ui, sans-serif);
        text-align: center;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-step {
        width: 30px;
        height: 30px;
        min-height: 30px;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: inherit !important;
        box-shadow: none !important;
        font-size: 1.4rem;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-step:disabled { opacity: .25; }
    body.skin-after-hours #gm-mobile-shelf-preview {
        border-color: var(--ah-line) !important;
        background: var(--ah-panel) !important;
        color: var(--ah-ink) !important;
    }
    body.skin-after-hours #gm-mobile-shelf-preview .gm-mobile-preview-read {
        background: var(--ah-action) !important;
    }

    /* Match the richer desktop jacket preview while keeping the sheet compact. */
    #gm-mobile-shelf-preview {
        gap: 0;
        padding: 0;
        background: var(--gm-card, var(--gm-card-bg, #292b29));
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-banner {
        position: relative;
        display: flex;
        align-items: flex-end;
        min-height: 72px;
        padding: 10px 45px 10px 16px;
        overflow: hidden;
        background: linear-gradient(135deg, #394334, #1c2528);
        color: #f7efe3 !important;
        text-decoration: none;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-banner-image {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 35%;
        opacity: 1;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-banner::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, rgb(14 18 19 / 52%), rgb(14 18 19 / 10%)),
            linear-gradient(0deg, rgb(14 18 19 / 46%), transparent 65%);
        pointer-events: none;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-banner-copy {
        position: relative;
        z-index: 1;
        display: grid;
        gap: 4px;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-fandom {
        font: 700 .58rem/1.2 var(--font-ui, sans-serif);
        letter-spacing: .09em;
        text-transform: uppercase;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-title {
        max-width: none;
        color: #fff8ed !important;
        -webkit-text-fill-color: #fff8ed !important;
        font-size: 1.02rem;
        line-height: 1.13;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-close {
        z-index: 3;
        top: 7px;
        right: 9px;
        color: #fff8ed !important;
        text-shadow: 0 1px 5px rgb(0 0 0 / 70%);
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-author {
        display: flex;
        align-items: center;
        gap: 9px;
        margin: 0;
        padding: 11px 16px 7px;
        opacity: 1;
        font-size: .82rem;
        font-weight: 600;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-avatar {
        width: 28px;
        height: 28px;
        border-radius: 50%;
        object-fit: cover;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-actions {
        display: grid;
        grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr);
        gap: 7px;
        padding: 4px 16px 9px;
    }
    #gm-mobile-shelf-preview :is(.gm-mobile-preview-read, .gm-mobile-preview-save) {
        display: grid;
        place-items: center;
        min-height: 39px;
        padding: 5px 7px;
        border: 1px solid var(--gm-card-border, var(--gm-border, #777));
        border-radius: 7px;
        box-shadow: none;
        font: 700 .78rem/1.15 var(--font-ui, sans-serif);
        text-align: center;
        text-decoration: none;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-save {
        background: transparent;
        color: inherit;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-save:disabled { opacity: .65; }
    #gm-mobile-shelf-preview :is(.gm-mobile-preview-metadata, .gm-mobile-preview-tags) {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        padding: 0 16px 8px;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-pill {
        padding: 3px 8px;
        border: 1px solid var(--gm-card-border, var(--gm-border, #777));
        border-radius: 999px;
        font: 600 .67rem/1.2 var(--font-ui, sans-serif);
        white-space: nowrap;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-summary {
        padding: 1px 16px 0;
        font: .86rem/1.4 var(--font-display, Georgia, serif);
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-more {
        align-self: flex-start;
        padding: 1px 16px 8px;
        color: var(--gm-accent, currentColor) !important;
        font: 700 .72rem/1.2 var(--font-ui, sans-serif);
        text-underline-offset: 3px;
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-tags:empty { display: none; }
    #gm-mobile-shelf-preview :is(.gm-mobile-preview-stats, .gm-mobile-preview-details) {
        margin: 0;
        padding: 0 16px 5px;
        font: 600 .71rem/1.3 var(--font-ui, sans-serif);
    }
    #gm-mobile-shelf-preview .gm-mobile-preview-details { opacity: .7; }
    #gm-mobile-shelf-preview .gm-mobile-preview-navigation {
        justify-content: center;
        min-height: 30px;
        padding: 3px 16px 9px;
        font-size: .68rem;
        opacity: .75;
    }
    body.skin-after-hours #gm-mobile-shelf-preview .gm-mobile-preview-save {
        border-color: var(--ah-line) !important;
        color: var(--ah-ink) !important;
    }
}

@media (max-width: 760px) {
    html body.home-page .home-recent-section .section-heading-row h2,
    html body.home-page .home-doorways-section > h2,
    html body.home-page .library-notes-section > h2 {
        font-size: 1.5rem !important;
        line-height: 1.15 !important;
    }
}