/* /Components/AdminAddToCollection.razor.rz.scp.css */
/* Admin "add to collection" control. Page-specific layout only — primitives
   (.card, .btn-accent, .mn-meta-badge) come from global CSS. */
.admin-add-collection__row[b-ddcrv7ecdx] {
    display: flex;
    gap: var(--mn-space-2);
    align-items: stretch;
}

.admin-add-collection__row .form-select[b-ddcrv7ecdx] {
    flex: 1 1 auto;
    min-width: 0;
}

.admin-add-collection__btn[b-ddcrv7ecdx] {
    flex: 0 0 auto;
    white-space: nowrap;
}
/* /Components/AudioPlayer.razor.rz.scp.css */
/* ============================================================
   AudioPlayer — "Backroom" re-theme (Direction A)
   Re-styles waveform / transport / speed / transcript onto the
   ember-on-ink palette. No @code or JS logic change.
   (Waveform <rect> fill is set in audio-player.js — JS-created
   nodes don't carry the scoped-CSS attribute.)
   ============================================================ */

.audio-player-container[b-g503exyy1m] {
    color: var(--mn-text-primary);
}

/* --- Waveform --- */
.audio-player-waveform[b-g503exyy1m] {
    width: 100%;
    min-height: 64px;
    margin-bottom: 0.5rem;
    cursor: pointer;
    touch-action: none;
}

/* --- Scrubber --- */
.ap-scrub[b-g503exyy1m] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 3px;
    background: var(--mn-border-strong);
    border-radius: 2px;
    cursor: pointer;
    margin: 0.15rem 0 0.4rem;
}

.ap-scrub[b-g503exyy1m]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--mn-gold-light);
    box-shadow: 0 0 8px rgba(224, 200, 140, 0.7);
    cursor: pointer;
    border: none;
}

.ap-scrub[b-g503exyy1m]::-moz-range-thumb {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--mn-gold-light);
    border: none;
    box-shadow: 0 0 8px rgba(224, 200, 140, 0.7);
    cursor: pointer;
}

/* --- Time row --- */
.ap-times[b-g503exyy1m] {
    display: flex;
    justify-content: space-between;
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    margin-bottom: 0.9rem;
}

.ap-times__elapsed[b-g503exyy1m] {
    color: var(--mn-gold-light);
}

.ap-times__remaining[b-g503exyy1m] {
    color: var(--mn-text-secondary);
}

/* --- Transport --- */
.ap-transport[b-g503exyy1m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    margin-bottom: 1rem;
}

.ap-nav[b-g503exyy1m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    border: none;
    background: transparent;
    color: var(--mn-text-primary);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.ap-nav:hover:not(:disabled)[b-g503exyy1m] {
    color: var(--mn-gold);
}

.ap-nav:disabled[b-g503exyy1m] {
    opacity: 0.3;
    cursor: default;
}

.ap-skip[b-g503exyy1m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1px solid var(--mn-border-strong);
    background: transparent;
    color: var(--mn-text-primary);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.ap-skip:hover[b-g503exyy1m] {
    border-color: var(--mn-gold);
    color: var(--mn-gold);
}

.ap-play[b-g503exyy1m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    border: none;
    background: radial-gradient(circle at 38% 32%, var(--mn-gold-light), var(--mn-gold) 62%, var(--mn-gold-dark));
    color: var(--mn-bg-body);
    font-size: 1.7rem;
    cursor: pointer;
    box-shadow: 0 6px 22px rgba(var(--mn-gold-rgb), 0.42);
    transition: transform 0.12s ease;
}

.ap-play:active[b-g503exyy1m] {
    transform: scale(0.96);
}

/* --- Speed + secondary pills --- */
.ap-speed[b-g503exyy1m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.ap-speed__label[b-g503exyy1m] {
    font-family: var(--mn-font-mono);
    font-size: 0.5625rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
    margin-right: 0.15rem;
}

.ap-pill[b-g503exyy1m] {
    min-height: 38px;
    padding: 0.4rem 0.7rem;
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.03em;
    background: transparent;
    color: var(--mn-text-primary);
    border: 1px solid var(--mn-border-strong);
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.ap-pill:hover[b-g503exyy1m] {
    border-color: var(--mn-gold);
}

.ap-pill.is-active[b-g503exyy1m] {
    background: var(--mn-gold);
    color: var(--mn-bg-body);
    border-color: var(--mn-gold);
}

.ap-pill--wide[b-g503exyy1m] {
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 0.625rem;
}

.ap-pill--wide.is-active[b-g503exyy1m] {
    background: rgba(var(--mn-gold-rgb), 0.12);
    color: var(--mn-gold);
}

/* --- Transcript --- */
.ap-transcript[b-g503exyy1m] {
    margin-top: 0.9rem;
    max-height: 230px;
    overflow-y: auto;
    border: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface-alt);
    padding: 0.4rem 0.3rem;
}

.ap-cue[b-g503exyy1m] {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 0.7rem;
    align-items: baseline;
    padding: 0.45rem 0.7rem;
    border-left: 2px solid transparent;
    cursor: pointer;
}

.ap-cue:hover[b-g503exyy1m] {
    background: rgba(var(--mn-gold-rgb), 0.06);
}

.ap-cue__time[b-g503exyy1m] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    color: var(--mn-text-secondary);
}

.ap-cue__text[b-g503exyy1m] {
    font-family: var(--mn-font-body);
    font-size: 0.9375rem;
    line-height: 1.45;
    color: var(--mn-text-secondary);
}

/* Past cues recede; active cue lights ember */
.ap-cue.is-past .ap-cue__text[b-g503exyy1m] {
    color: var(--mn-text-tertiary);
}

.ap-cue.is-active[b-g503exyy1m] {
    border-left-color: var(--mn-gold);
    background: rgba(var(--mn-gold-rgb), 0.10);
}

.ap-cue.is-active .ap-cue__time[b-g503exyy1m] {
    color: var(--mn-gold);
}

.ap-cue.is-active .ap-cue__text[b-g503exyy1m] {
    color: var(--mn-text-primary);
    font-style: italic;
}

/* --- Transcript messages (loading / empty / live caption) --- */
.ap-transcript-msg[b-g503exyy1m] {
    margin-top: 0.9rem;
    padding: 0.75rem;
    border: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface-alt);
    font-size: 0.875rem;
    color: var(--mn-text-secondary);
    text-align: center;
}

.ap-transcript-msg--caption[b-g503exyy1m] {
    text-align: left;
    max-height: 120px;
    overflow-y: auto;
    color: var(--mn-text-primary);
}

/* Desktop: speed row left-aligned, transcript pill pushed to the right edge */
@media (min-width: 768px) {
    .ap-speed[b-g503exyy1m] {
        justify-content: flex-start;
    }

    .ap-pill--wide[b-g503exyy1m] {
        margin-left: auto;
    }
}
/* /Components/Author/BookEditPublishHeader.razor.rz.scp.css */
/* =============================================
   BookEditPublishHeader — chrome shared by every Edit Book tab
   (Chapters / Pricing / Details / Discovery / Advanced).

   Moved out of Pages/Author/BookEdit.razor.css because the chrome
   is no longer page-scoped — it lives on five sibling routes.
   Selectors stay specific (composite, not primitive) so scoped
   CSS is the right home, not global app.css.
   ============================================= */

/* --- Sticky Header --- */
.book-edit-sticky-header[b-7isfaspg3n] {
    position: sticky;
    top: var(--mn-header-height-compact, 56px);
    z-index: var(--mn-z-sticky, 1020);
    background: var(--mn-bg-surface, #ffffff);
    border-bottom: 1px solid var(--mn-border-default, #e8e4dd);
    box-shadow: var(--mn-shadow-sm);
    padding: var(--mn-space-3, 0.75rem) 0;
    margin: 0 calc(-1 * var(--mn-space-4, 1rem));
    padding-left: var(--mn-space-4, 1rem);
    padding-right: var(--mn-space-4, 1rem);
    margin-bottom: var(--mn-space-4, 1rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mn-space-3, 0.75rem);
    flex-wrap: wrap;
}

.book-edit-sticky-cover[b-7isfaspg3n] {
    width: 40px;
    height: 60px;
    object-fit: cover;
    border-radius: var(--mn-radius-sm, 0.25rem);
    box-shadow: var(--mn-shadow-xs);
    flex-shrink: 0;
}

.book-edit-sticky-title[b-7isfaspg3n] {
    font-family: var(--mn-font-system, system-ui, sans-serif);
    font-size: var(--mn-text-lg, 1.125rem);
    font-weight: var(--mn-font-semibold, 600);
    color: var(--mn-text-primary, #1f1b16);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 400px;
}

/* Mobile: compress sticky header */
@media (max-width: 575.98px) {
    .book-edit-sticky-title[b-7isfaspg3n] {
        font-size: var(--mn-text-base, 1rem);
        max-width: 200px;
    }
}

/* =============================================
   Wizard Progress Bar
   ============================================= */
.publish-wizard[b-7isfaspg3n] {
    background: var(--mn-bg-surface, #ffffff);
    border: 1px solid var(--mn-border-default, #e8e4dd);
    border-radius: var(--mn-radius-md, 0.5rem);
    padding: var(--mn-space-3, 0.75rem) var(--mn-space-4, 1rem);
}

.wizard-missing-hint[b-7isfaspg3n] {
    color: var(--mn-text-muted, #6c757d);
    border-top: 1px dashed var(--mn-border-default, #e8e4dd);
    padding-top: var(--mn-space-2, 0.5rem);
}

.wizard-missing-hint strong[b-7isfaspg3n] {
    color: var(--mn-text-primary, inherit);
}

.wizard-step[b-7isfaspg3n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    flex-shrink: 0;
}

.wizard-step-circle[b-7isfaspg3n] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 600;
    transition: all 0.2s ease;
    border: 2px solid var(--mn-border-default, #e8e4dd);
    background: var(--mn-bg-surface, #ffffff);
    color: var(--mn-text-muted, #999);
}

.wizard-step.complete .wizard-step-circle[b-7isfaspg3n] {
    background: var(--mn-success, #2d7a4f);
    border-color: var(--mn-success, #2d7a4f);
    color: var(--mn-white, #fff);
}

.wizard-step.current .wizard-step-circle[b-7isfaspg3n] {
    /* --mn-navy is invisible on the dark page surface (#15121f) — see the
       warning in design-tokens.css. Use --mn-info-dark, the light-blue
       token meant for foreground use on dark backgrounds. */
    background: var(--mn-info-dark, #8bcde0);
    border-color: var(--mn-info-dark, #8bcde0);
    color: var(--mn-bg-surface, #15121f);
    box-shadow: 0 0 0 3px rgba(139, 205, 224, 0.20);
}

.wizard-step-label[b-7isfaspg3n] {
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--mn-text-muted, #999);
    text-align: center;
    max-width: 80px;
    line-height: 1.2;
}

.wizard-step.complete .wizard-step-label[b-7isfaspg3n] {
    color: var(--mn-success, #2d7a4f);
}

.wizard-step.current .wizard-step-label[b-7isfaspg3n] {
    color: var(--mn-info-dark, #8bcde0);
    font-weight: 600;
}

.wizard-step.waiting .wizard-step-circle[b-7isfaspg3n] {
    background: var(--mn-gold, #b5984a);
    border-color: var(--mn-gold, #b5984a);
    color: var(--mn-white, #fff);
}

.wizard-step.waiting .wizard-step-label[b-7isfaspg3n] {
    color: var(--mn-gold, #b5984a);
}

.wizard-step.locked[b-7isfaspg3n] {
    cursor: not-allowed;
}

.wizard-step.locked .wizard-step-circle[b-7isfaspg3n] {
    background: var(--mn-gold, #b5984a);
    border-color: var(--mn-gold, #b5984a);
    color: var(--mn-white, #fff);
    opacity: 0.6;
}

.wizard-step.locked .wizard-step-label[b-7isfaspg3n] {
    color: var(--mn-gold, #b5984a);
    opacity: 0.6;
}

.wizard-connector[b-7isfaspg3n] {
    flex: 1;
    height: 2px;
    background: var(--mn-border-default, #e8e4dd);
    margin: 0 0.25rem;
    margin-bottom: 1.1rem; /* align with circles, not labels */
    transition: background 0.2s ease;
}

.wizard-connector.complete[b-7isfaspg3n] {
    background: var(--mn-success, #2d7a4f);
}

@media (max-width: 575.98px) {
    .wizard-step-circle[b-7isfaspg3n] {
        width: 28px;
        height: 28px;
        font-size: 0.7rem;
    }
    .wizard-step-label[b-7isfaspg3n] {
        font-size: 0.6rem;
        max-width: 50px;
    }
    .wizard-connector[b-7isfaspg3n] {
        margin-bottom: 0.9rem;
    }
}

/* --- Pre-publish royalty + compliance agreement (first publish only) --- */
.pph-agreement[b-7isfaspg3n] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--mn-border-default);
}

.pph-agreement__royalty[b-7isfaspg3n] {
    background: var(--mn-bg-inset);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: 0.75rem 1rem;
}

.pph-agreement__label[b-7isfaspg3n] {
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-xs);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
}

.pph-agreement__splits[b-7isfaspg3n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    margin: 0.5rem 0;
    color: var(--mn-text-secondary);
    font-size: var(--mn-text-sm);
}

.pph-agreement__splits strong[b-7isfaspg3n] {
    color: var(--mn-gold);
    font-size: var(--mn-text-lg);
}

.pph-agreement__note[b-7isfaspg3n] {
    font-size: var(--mn-text-sm);
    color: var(--mn-text-secondary);
}

.pph-agreement__certs[b-7isfaspg3n] {
    margin-top: 1rem;
}

.pph-agreement__certs-title[b-7isfaspg3n] {
    font-weight: var(--mn-font-semibold);
    margin-bottom: 0.5rem;
}

.pph-agreement__certs-list[b-7isfaspg3n] {
    margin: 0;
    padding-left: 1.25rem;
    color: var(--mn-text-secondary);
    font-size: var(--mn-text-sm);
}

.pph-agreement__certs-list li[b-7isfaspg3n] {
    margin-bottom: 0.25rem;
}

.pph-agreement .form-check[b-7isfaspg3n] {
    margin-top: 1rem;
}
/* /Components/AuthorCard.razor.rz.scp.css */
.author-card[b-qpov4iedmn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mn-space-2);
    text-decoration: none;
    color: var(--mn-text-primary);
    padding: var(--mn-space-4);
    border-radius: var(--mn-radius-lg);
    transition: transform var(--mn-transition-fast), box-shadow var(--mn-transition-fast);
    width: 140px;
    text-align: center;
}

.author-card:hover[b-qpov4iedmn] {
    transform: translateY(-2px);
    box-shadow: var(--mn-shadow-gold);
    color: var(--mn-text-primary);
    text-decoration: none;
}

.author-card-avatar[b-qpov4iedmn] {
    width: 72px;
    height: 72px;
    border-radius: var(--mn-radius-full);
    overflow: hidden;
    background: var(--mn-bg-surface-alt);
    border: 2px solid var(--mn-border-default);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color var(--mn-transition-fast);
}

.author-card:hover .author-card-avatar[b-qpov4iedmn] {
    border-color: var(--mn-gold);
}

.author-card-avatar img[b-qpov4iedmn] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.author-card-initial[b-qpov4iedmn] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-xl);
    font-weight: var(--mn-font-bold);
    color: var(--mn-gold);
    text-transform: uppercase;
}

.author-card-name[b-qpov4iedmn] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.author-card-stats[b-qpov4iedmn] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-xs);
    color: var(--mn-text-tertiary);
    margin: 0;
}
/* /Components/AuthPageShell.razor.rz.scp.css */
.auth-page[b-u1r59d5erp] {
    display: flex;
    justify-content: center;
    padding: var(--mn-space-8) var(--mn-space-4);
    min-height: 60vh;
    align-items: flex-start;
}

.auth-card[b-u1r59d5erp] {
    max-width: 440px;
    width: 100%;
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-xl);
    box-shadow: var(--mn-shadow-lg);
    overflow: hidden;
}

.auth-card-header[b-u1r59d5erp] {
    text-align: center;
    padding: var(--mn-space-6) var(--mn-space-6) var(--mn-space-4);
}

.auth-title[b-u1r59d5erp] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-3xl);
    font-weight: var(--mn-font-bold);
    color: var(--mn-text-primary);
    margin: 0;
    line-height: var(--mn-leading-tight);
    letter-spacing: -0.01em;
}

.auth-title em[b-u1r59d5erp],
.auth-title.heading-brand[b-u1r59d5erp] {
    font-family: var(--mn-font-accent);
    font-weight: 400;
    color: var(--mn-gold);
    letter-spacing: 0.02em;
}

.auth-subtitle[b-u1r59d5erp] {
    margin: var(--mn-space-2) 0 0;
    font-size: var(--mn-text-sm);
    color: var(--mn-text-secondary);
}

.auth-tabs[b-u1r59d5erp] {
    display: flex;
    border-bottom: 1px solid var(--mn-border-default);
    margin: 0 var(--mn-space-6);
}

.auth-tab[b-u1r59d5erp] {
    flex: 1;
    text-align: center;
    padding: var(--mn-space-3) var(--mn-space-4);
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-tertiary);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color var(--mn-transition-fast), border-color var(--mn-transition-fast);
}

.auth-tab:hover[b-u1r59d5erp] {
    color: var(--mn-text-primary);
    text-decoration: none;
}

.auth-tab.active[b-u1r59d5erp] {
    color: var(--mn-gold);
    border-bottom-color: var(--mn-gold);
}

.auth-card-body[b-u1r59d5erp] {
    padding: var(--mn-space-6);
}

.auth-trust-signals[b-u1r59d5erp] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: var(--mn-space-2);
    padding: var(--mn-space-4) var(--mn-space-6);
    border-top: 1px solid var(--mn-border-light);
    font-size: var(--mn-text-xs);
    color: var(--mn-text-tertiary);
    text-align: center;
}

.auth-trust-link[b-u1r59d5erp] {
    color: var(--mn-text-tertiary);
    text-decoration: none;
}

.auth-trust-link:hover[b-u1r59d5erp] {
    color: var(--mn-text-secondary);
    text-decoration: underline;
}

.auth-trust-dot[b-u1r59d5erp] {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--mn-text-tertiary);
    flex-shrink: 0;
}

/* Mobile: full-width card, reduced padding */
@media (max-width: 576px) {
    .auth-page[b-u1r59d5erp] {
        padding: var(--mn-space-4) var(--mn-space-2);
    }

    .auth-card[b-u1r59d5erp] {
        border-radius: var(--mn-radius-lg);
    }

    .auth-card-header[b-u1r59d5erp] {
        padding: var(--mn-space-4) var(--mn-space-4) var(--mn-space-3);
    }

    .auth-title[b-u1r59d5erp] {
        font-size: var(--mn-text-2xl);
    }

    .auth-tabs[b-u1r59d5erp] {
        margin: 0 var(--mn-space-4);
    }

    .auth-card-body[b-u1r59d5erp] {
        padding: var(--mn-space-4);
    }

    .auth-trust-signals[b-u1r59d5erp] {
        padding: var(--mn-space-3) var(--mn-space-4);
    }
}
/* /Components/BookCard.razor.rz.scp.css */
/* ===== BookCard — Scoped Styles ===== */

/* Info container */
.book-card-info[b-2xdgiofugr] {
    padding: var(--mn-space-1) 0;
    min-height: 0;
    min-width: 0;
}

/* Title */
.book-card-title[b-2xdgiofugr] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
    line-height: var(--mn-leading-snug);
    color: var(--mn-text-primary);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0;
}

/* Author */
.book-card-author[b-2xdgiofugr] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-xs);
    color: var(--mn-text-secondary);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== Completion Status Badge ===== */
.book-card-status[b-2xdgiofugr] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-family: var(--mn-font-system);
    font-size: 0.65rem;
    font-weight: 600;
    line-height: 1;
    padding: 0.2em 0.5em;
    border-radius: var(--mn-radius-full);
    white-space: nowrap;
    margin-bottom: var(--mn-space-1);
}

.book-card-status i[b-2xdgiofugr] {
    font-size: 0.6rem;
}

.book-card-status--complete[b-2xdgiofugr] {
    background: rgba(45, 122, 79, 0.12);
    color: var(--mn-success);
}

/* bootstrap-eradication: REVIEW — #2563eb is off-palette blue; --mn-info is teal (#3a7b9a). Needs design token decision. */
.book-card-status--ongoing[b-2xdgiofugr] {
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
}

.book-card-status--hiatus[b-2xdgiofugr] {
    background: rgba(145, 138, 126, 0.15);
    color: var(--mn-text-tertiary);
}

/* ===== Social Proof Row ===== */
.book-card-social[b-2xdgiofugr] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: var(--mn-space-1);
}

.book-card-social-count[b-2xdgiofugr] {
    font-family: var(--mn-font-system);
    font-size: 0.65rem;
    color: var(--mn-text-tertiary);
    font-weight: 500;
}

.book-card-social--views[b-2xdgiofugr] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-xs);
    color: var(--mn-text-tertiary);
    gap: 0.3rem;
}

.book-card-social--views i[b-2xdgiofugr] {
    font-size: 0.7rem;
}

/* ===== Bottom Row (Price · Heat · Length) ===== */
.book-card-bottom[b-2xdgiofugr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.2rem;
    margin-top: var(--mn-space-1);
    font-family: var(--mn-font-system);
    font-size: 0.7rem;
    line-height: 1.2;
}

.book-card-price[b-2xdgiofugr] {
    font-weight: 700;
    color: var(--mn-text-primary);
}

.book-card-price--free[b-2xdgiofugr] {
    font-weight: 700;
    color: var(--mn-success);
}

.book-card-sep[b-2xdgiofugr] {
    color: var(--mn-text-tertiary);
    font-weight: 400;
    user-select: none;
}

.book-card-sample[b-2xdgiofugr] {
    color: var(--mn-success);
    font-weight: 600;
}

.book-card-sample i[b-2xdgiofugr] {
    font-size: 0.6rem;
}

.book-card-length[b-2xdgiofugr] {
    color: var(--mn-text-secondary);
    font-weight: 500;
}

/* ===== Optional Badges Row ===== */
.book-card-badges[b-2xdgiofugr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
    margin-top: var(--mn-space-1);
    font-size: 0.65em;
}

.book-card-musings[b-2xdgiofugr] {
    font-size: var(--mn-text-xs);
    color: var(--mn-text-tertiary);
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}
/* /Components/BookContextBanner.razor.rz.scp.css */
.book-context-banner[b-4ocfjjzhdc] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-4);
    padding: var(--mn-space-4) var(--mn-space-6);
    background: var(--mn-bg-inset);
    border-bottom: 1px solid var(--mn-border-light);
}

.book-context-cover[b-4ocfjjzhdc] {
    flex-shrink: 0;
    width: 48px;
}

.book-context-cover[b-4ocfjjzhdc]  .book-cover {
    width: 48px !important;
    height: auto;
    aspect-ratio: 2 / 3;
    border-radius: var(--mn-radius-sm);
}

.book-context-text[b-4ocfjjzhdc] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-1);
    min-width: 0;
}

.book-context-label[b-4ocfjjzhdc] {
    font-size: var(--mn-text-xs);
    color: var(--mn-text-secondary);
}

.book-context-title[b-4ocfjjzhdc] {
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
    color: var(--mn-navy);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.book-context-author[b-4ocfjjzhdc] {
    font-size: var(--mn-text-xs);
    color: var(--mn-text-tertiary);
}

@media (max-width: 576px) {
    .book-context-banner[b-4ocfjjzhdc] {
        padding: var(--mn-space-3) var(--mn-space-4);
    }
}
/* /Components/BookCover.razor.rz.scp.css */
/* Wrapper for positioning badges */
.book-cover-wrapper[b-0gstfennsc] {
    position: relative;
    display: inline-block;
    width: 100%;
}

/* Audio format badge */
.book-cover-audio-badge[b-0gstfennsc] {
    position: absolute;
    top: 6px;
    left: 6px;
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1.4;
    backdrop-filter: blur(4px);
    pointer-events: none;
    z-index: 1;
}

.book-cover-audio-badge i[b-0gstfennsc] {
    font-size: 0.6rem;
}

/* Base for all covers — real image or generated */
.book-cover[b-0gstfennsc] {
    aspect-ratio: 2 / 3;
    object-fit: cover;
    width: 100%;
    display: block;
}

/* Generated cover container */
.book-cover-generated[b-0gstfennsc] {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Dot pattern needs background-size */
.book-cover-generated[b-0gstfennsc] {
    background-size: auto, auto;
}

/* --- Size variants --- */

.book-cover-small[b-0gstfennsc] {
    width: 40px;
    font-size: 0.7rem;
    border-radius: 3px;
}

.book-cover-medium[b-0gstfennsc] {
    font-size: 0.85rem;
    border-radius: 0.375rem;
}

.book-cover-large[b-0gstfennsc] {
    font-size: 1rem;
    border-radius: 0.375rem;
}

/* --- Overlay and content --- */

.book-cover-overlay[b-0gstfennsc] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12% 10%;
    box-shadow: inset 0 0 40px rgba(0, 0, 0, 0.35);
}

.book-cover-content[b-0gstfennsc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
    gap: 0.4em;
    max-height: 100%;
    overflow: hidden;
}

/* --- Layout variants --- */

.book-cover-layout-0[b-0gstfennsc] {
    justify-content: center;
}

.book-cover-layout-1[b-0gstfennsc] {
    justify-content: flex-start;
    padding-top: 8%;
}

.book-cover-layout-2[b-0gstfennsc] {
    justify-content: flex-end;
    padding-bottom: 5%;
}

.book-cover-layout-3[b-0gstfennsc] {
    justify-content: flex-end;
    padding-bottom: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.45) 0%, transparent 100%);
    margin: 0;
    padding: 15% 10% 10%;
    inset: auto 0 0 0;
    position: absolute;
    width: 100%;
    box-sizing: border-box;
}

/* --- Text elements --- */

.book-cover-title[b-0gstfennsc] {
    font-weight: 700;
    font-size: 1.15em;
    line-height: 1.25;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

.book-cover-author[b-0gstfennsc] {
    font-size: 0.72em;
    opacity: 0.8;
    font-style: italic;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.book-cover-divider[b-0gstfennsc] {
    width: 30px;
    height: 1px;
    background: currentColor;
    opacity: 0.35;
    flex-shrink: 0;
}

.book-cover-initial[b-0gstfennsc] {
    font-size: 3.5em;
    font-weight: 200;
    opacity: 0.2;
    line-height: 1;
    letter-spacing: -0.02em;
}

/* Small-size single letter */
.book-cover-letter[b-0gstfennsc] {
    font-weight: 700;
    font-size: 1.1em;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

/* --- Medium size adjustments --- */

.book-cover-medium .book-cover-title[b-0gstfennsc] {
    -webkit-line-clamp: 2;
    font-size: 1em;
}

.book-cover-medium .book-cover-overlay[b-0gstfennsc] {
    padding: 10% 8%;
}

.book-cover-medium .book-cover-initial[b-0gstfennsc] {
    font-size: 2.5em;
}

/* --- Large size adjustments --- */

.book-cover-large .book-cover-title[b-0gstfennsc] {
    font-size: 1.3em;
}

.book-cover-large .book-cover-overlay[b-0gstfennsc] {
    padding: 14% 12%;
}
/* /Components/ChapterListItem.razor.rz.scp.css */
/* ChapterListItem — mobile-first scoped styles
   3-zone editorial TOC: numeral · body · aside */

/* ── Row grid (mobile: 2-zone; sm+: 3-zone) ── */

.chapter-row[b-79h9rx6opj] {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "body aside";
    gap: var(--mn-space-2) var(--mn-space-3);
    align-items: start;
    border-radius: var(--mn-radius-sm);
    transition: background-color var(--mn-transition-fast), box-shadow var(--mn-transition-fast);
}

.chapter-row-expandable[b-79h9rx6opj] {
    cursor: pointer;
    user-select: none;
}

@media (hover: hover) {
    .chapter-row-expandable:hover[b-79h9rx6opj] {
        background-color: var(--mn-bg-surface-alt);
        box-shadow: inset 3px 0 0 var(--mn-gold);
    }
}

.chapter-row__body[b-79h9rx6opj] {
    grid-area: body;
    min-width: 0;
}

.chapter-row__aside[b-79h9rx6opj] {
    grid-area: aside;
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-1);
    align-items: center;
    justify-content: flex-end;
}

/* ── Title ── */

.chapter-row__title[b-79h9rx6opj] {
    margin: 0 0 var(--mn-space-1) 0;
    font-family: var(--mn-font-body);
    font-size: 1.0625rem;
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
    line-height: 1.3;
}

.chapter-row__inline-numeral[b-79h9rx6opj] {
    color: var(--mn-text-tertiary);
    margin-right: 0.35rem;
    font-weight: 400;
}

.chapter-expand-icon[b-79h9rx6opj] {
    font-size: 0.7em;
    color: var(--mn-text-tertiary);
    margin-left: 0.5rem;
    vertical-align: middle;
    transition: transform var(--mn-transition-fast);
}

/* ── Metadata line ── */

.chapter-row__meta[b-79h9rx6opj] {
    margin: 0;
    font-family: var(--mn-font-mono);
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    color: var(--mn-text-tertiary);
    line-height: 1.5;
}

.chapter-row__meta .meta-sep[b-79h9rx6opj] {
    margin: 0 0.45em;
    color: var(--mn-text-tertiary);
    opacity: 0.55;
}

/* ── Synopsis tease (md+) ── */

.chapter-row__tease[b-79h9rx6opj] {
    margin: var(--mn-space-2) 0 0 0;
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.9375rem;
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    max-width: 60ch;
    white-space: pre-wrap;
}

/* ── Read CTA ── */

.chapter-row__cta[b-79h9rx6opj] {
    white-space: nowrap;
}

/* ── sm+ : reveal display numeral, switch to 3-zone grid ── */

@media (min-width: 576px) {
    .chapter-row[b-79h9rx6opj] {
        grid-template-columns: auto 1fr auto;
        grid-template-areas: "numeral body aside";
        gap: var(--mn-space-3) var(--mn-space-4);
        align-items: center;
    }

    .chapter-row__numeral[b-79h9rx6opj] {
        grid-area: numeral;
        font-family: var(--mn-font-body);
        font-style: italic;
        font-weight: 400;
        font-size: 2.25rem;
        line-height: 1;
        color: var(--mn-gold);
        opacity: 0.85;
        letter-spacing: -0.02em;
        min-width: 2.2ch;
        justify-content: center;
        align-items: center;
        user-select: none;
    }
}

/* ── md+ : roomier numeral ── */

@media (min-width: 768px) {
    .chapter-row[b-79h9rx6opj] {
        gap: var(--mn-space-4) var(--mn-space-5);
    }

    .chapter-row__numeral[b-79h9rx6opj] {
        font-size: 2.5rem;
    }
}

/* ── Expanded detail panel (unchanged below) ── */

.chapter-expanded-detail[b-79h9rx6opj] {
    margin-top: var(--mn-space-2);
    padding: var(--mn-space-2) var(--mn-space-3);
    background: var(--mn-bg-surface-alt);
    border-radius: var(--mn-radius-md);
    border-left: 3px solid var(--mn-gold);
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-2);
    animation: chapterExpand-b-79h9rx6opj 200ms ease-out;
}

@keyframes chapterExpand-b-79h9rx6opj {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.chapter-expanded-synopsis p[b-79h9rx6opj] {
    color: var(--mn-text-secondary);
    font-family: var(--mn-font-body);
    line-height: var(--mn-leading-relaxed);
    white-space: pre-wrap;
}

.chapter-expanded-warnings[b-79h9rx6opj] {
    padding-top: var(--mn-space-1);
}

.chapter-expanded-musings .btn-outline-secondary[b-79h9rx6opj] {
    font-size: 0.8rem;
}

@media (min-width: 768px) {
    .chapter-expanded-detail[b-79h9rx6opj] {
        margin-top: var(--mn-space-3);
        padding: var(--mn-space-3) var(--mn-space-4);
        gap: var(--mn-space-3);
    }
}
/* /Components/ChapterTagSuggestions.razor.rz.scp.css */
/* AI suggestion tags use .mn-tag + .mn-tag--suggested (global, app.css).
   The inner confidence badge is a Bootstrap status badge — intentionally
   a separate primitive per the style guide's badges & heat rules. */
/* /Components/Chat/AskMidnetteBubble.razor.rz.scp.css */
.chat-bubble-btn[b-dkef1373jz] {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1050;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: none;
    background-color: var(--mn-gold);
    color: var(--mn-navy);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--mn-shadow-lg);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.chat-bubble-btn:hover[b-dkef1373jz] {
    transform: scale(1.08);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.chat-bubble-btn:active[b-dkef1373jz] {
    transform: scale(0.96);
}

.chat-bubble-letter[b-dkef1373jz] {
    font-size: 1.6rem;
    line-height: 1;
    user-select: none;
}

.chat-bubble-pulse[b-dkef1373jz] {
    animation: bubble-pulse-b-dkef1373jz 2s ease-in-out 0.5s 2;
}

@keyframes bubble-pulse-b-dkef1373jz {
    0%, 100% {
        transform: scale(1);
        box-shadow: var(--mn-shadow-lg);
    }
    50% {
        transform: scale(1.12);
        box-shadow: 0 0 0 8px rgba(212, 175, 55, 0.2), var(--mn-shadow-lg);
    }
}
/* /Components/Chat/AskMidnetteChat.razor.rz.scp.css */
.chat-header[b-fopm82kkx0] {
    background-color: var(--mn-navy);
}

.chat-header-title[b-fopm82kkx0] {
    color: var(--mn-gold);
    font-size: 1.25rem;
    margin: 0;
}

.chat-header-title:hover[b-fopm82kkx0] {
    color: var(--mn-gold);
    opacity: 0.85;
}

.chat-header-close[b-fopm82kkx0] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.1rem;
    padding: var(--mn-spacing-xs);
    line-height: 1;
}

.chat-header-close:hover[b-fopm82kkx0] {
    color: #fff;
}

.chat-welcome[b-fopm82kkx0] {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
}

.chat-welcome-title[b-fopm82kkx0] {
    font-size: 1.75rem;
    color: var(--mn-gold);
}

.chat-welcome-subtitle[b-fopm82kkx0] {
    color: var(--mn-text-body);
    opacity: 0.75;
    font-size: 0.9rem;
    max-width: 280px;
}

.chat-input-bar[b-fopm82kkx0] {
    background-color: var(--mn-bg-surface);
    border-top: 1px solid var(--mn-border-color);
    padding: var(--mn-spacing-sm);
}

.chat-input[b-fopm82kkx0] {
    border-radius: 1.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    border: 1px solid var(--mn-border-color);
    background-color: var(--mn-bg-body);
    color: var(--mn-text-body);
}

.chat-input:focus[b-fopm82kkx0] {
    border-color: var(--mn-gold);
    box-shadow: 0 0 0 0.15rem rgba(var(--mn-gold-rgb, 212, 175, 55), 0.25);
}

.chat-send-btn[b-fopm82kkx0] {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0;
}

.chat-book-results[b-fopm82kkx0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: 85%;
}
/* /Components/Chat/AskMidnetteDrawer.razor.rz.scp.css */
.chat-drawer-backdrop[b-e7esa1f9gz] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1049;
}

.chat-drawer[b-e7esa1f9gz] {
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 1051;
    width: 400px;
    height: 600px;
    max-height: calc(100vh - 80px);
    background-color: var(--mn-bg-body);
    border-radius: 12px 12px 0 0;
    box-shadow: var(--mn-shadow-lg);
    overflow: hidden;
    animation: drawer-slide-up-b-e7esa1f9gz 0.3s ease-out;
}

.chat-drawer-header[b-e7esa1f9gz] {
    border-bottom: 1px solid var(--mn-border-color);
}

.chat-drawer-messages[b-e7esa1f9gz] {
    background-color: var(--mn-bg-body);
}

.chat-drawer-input[b-e7esa1f9gz] {
    border-top: none;
}

@keyframes drawer-slide-up-b-e7esa1f9gz {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Mobile: full screen overlay */
@media (max-width: 576px) {
    .chat-drawer[b-e7esa1f9gz] {
        width: 100%;
        height: 100%;
        max-height: 100vh;
        border-radius: 0;
        bottom: 0;
        right: 0;
    }
}
/* /Components/Chat/ChatBookCard.razor.rz.scp.css */
.chat-book-card[b-wmx7xidqj2] {
    background-color: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-color);
    border-radius: 0.5rem;
    transition: box-shadow 0.2s ease, transform 0.15s ease;
    color: var(--mn-text-body);
}

.chat-book-card:hover[b-wmx7xidqj2] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    transform: translateY(-1px);
    color: var(--mn-text-body);
}

.chat-book-cover[b-wmx7xidqj2] {
    width: 48px;
    height: 72px;
    object-fit: cover;
    border-radius: 0.25rem;
    flex-shrink: 0;
}

.chat-book-cover-placeholder[b-wmx7xidqj2] {
    width: 48px;
    height: 72px;
    background-color: var(--mn-border-color);
    border-radius: 0.25rem;
    flex-shrink: 0;
    color: var(--mn-text-body);
    opacity: 0.5;
    font-size: 1.2rem;
}

.chat-book-title[b-wmx7xidqj2] {
    font-size: 0.85rem;
    color: var(--mn-text-body);
}

.chat-book-author[b-wmx7xidqj2] {
    font-size: 0.75rem;
    color: var(--mn-text-body);
    opacity: 0.7;
}

.chat-book-rating[b-wmx7xidqj2] {
    font-size: 0.75rem;
    color: var(--mn-gold);
}

/* Heat uses <HeatLevelBadge>; price uses <PriceDisplay> — both global primitives. */
/* /Components/Chat/ChatMessageBubble.razor.rz.scp.css */
.chat-msg[b-iiy27xep2j] {
    max-width: 85%;
    padding: 0.5rem 0.875rem;
    border-radius: 1rem;
    font-size: 0.9rem;
    line-height: 1.5;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.chat-msg-user[b-iiy27xep2j] {
    background-color: var(--mn-navy);
    color: #fff;
    border-bottom-right-radius: 0.25rem;
}

.chat-msg-assistant[b-iiy27xep2j] {
    background-color: var(--mn-bg-surface);
    color: var(--mn-text-body);
    border-bottom-left-radius: 0.25rem;
}

.chat-msg-content[b-iiy27xep2j]  p {
    margin-bottom: 0.6em;
}

.chat-msg-content[b-iiy27xep2j]  p:last-child {
    margin-bottom: 0;
}

.chat-msg-content[b-iiy27xep2j]  a {
    color: var(--mn-gold);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.chat-msg-content[b-iiy27xep2j]  a:hover {
    opacity: 0.85;
}

.chat-msg-content[b-iiy27xep2j]  strong {
    font-weight: 600;
}

.chat-cursor[b-iiy27xep2j] {
    display: inline-block;
    width: 2px;
    height: 1em;
    background-color: currentColor;
    margin-left: 2px;
    vertical-align: text-bottom;
    animation: cursor-blink-b-iiy27xep2j 0.8s step-end infinite;
}

@keyframes cursor-blink-b-iiy27xep2j {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}
/* /Components/Chat/ChatSeriesCard.razor.rz.scp.css */
/* Phase B-7 — chat series card. Mirrors ChatBookCard.razor.css with an added
   accent bar that adopts --mn-series-accent (falls back to gold). */

.chat-series-card[b-juj7xfbb9r] {
    position: relative;
    background-color: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-color);
    border-radius: 0.5rem;
    transition: box-shadow 0.2s ease, transform 0.15s ease;
    color: var(--mn-text-body);
    padding-left: 0.75rem; /* clear the 4px accent bar */
}

.chat-series-card:hover[b-juj7xfbb9r] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    transform: translateY(-1px);
    color: var(--mn-text-body);
}

.chat-series-accent-bar[b-juj7xfbb9r] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--mn-series-accent, var(--mn-gold));
    border-radius: 0.5rem 0 0 0.5rem;
}

.chat-series-cover[b-juj7xfbb9r] {
    width: 48px;
    height: 72px;
    object-fit: cover;
    border-radius: 0.25rem;
    flex-shrink: 0;
}

.chat-series-cover-placeholder[b-juj7xfbb9r] {
    width: 48px;
    height: 72px;
    background-color: var(--mn-border-color);
    border-radius: 0.25rem;
    flex-shrink: 0;
    color: var(--mn-text-body);
    opacity: 0.5;
    font-size: 1.2rem;
}

.chat-series-title[b-juj7xfbb9r] {
    font-size: 0.85rem;
    color: var(--mn-text-body);
}

.chat-series-author[b-juj7xfbb9r] {
    font-size: 0.75rem;
    color: var(--mn-text-body);
    opacity: 0.7;
}

.chat-series-meta[b-juj7xfbb9r] {
    font-size: 0.75rem;
    color: var(--mn-text-body);
    opacity: 0.7;
}
/* /Components/Chat/ChatSuggestedPrompts.razor.rz.scp.css */
.chat-prompt-pill[b-pm2nc95wo2] {
    font-size: 0.8rem;
    padding: 0.35em 0.85em;
    border-radius: 2rem;
    border: 1px solid var(--mn-border-color);
    background-color: transparent;
    color: var(--mn-text-body);
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
    white-space: nowrap;
}

.chat-prompt-pill:hover[b-pm2nc95wo2] {
    border-color: var(--mn-gold);
    color: var(--mn-gold);
    background-color: rgba(212, 175, 55, 0.06);
}

.chat-prompt-pill:active[b-pm2nc95wo2] {
    background-color: rgba(212, 175, 55, 0.12);
}
/* /Components/Chat/ChatTypingIndicator.razor.rz.scp.css */
.chat-typing[b-liuosotoby] {
    background-color: var(--mn-bg-surface);
    color: var(--mn-text-body);
    padding: var(--mn-spacing-xs) var(--mn-spacing-sm);
    border-radius: 1rem;
    border-bottom-left-radius: 0.25rem;
    font-size: 0.8rem;
    opacity: 0.85;
}

.chat-typing-text[b-liuosotoby] {
    font-style: italic;
}

.chat-dot[b-liuosotoby] {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--mn-gold);
    animation: typing-bounce-b-liuosotoby 1.2s ease-in-out infinite;
}

.chat-dot:nth-child(2)[b-liuosotoby] {
    animation-delay: 0.15s;
}

.chat-dot:nth-child(3)[b-liuosotoby] {
    animation-delay: 0.3s;
}

@keyframes typing-bounce-b-liuosotoby {
    0%, 60%, 100% {
        transform: translateY(0);
        opacity: 0.4;
    }
    30% {
        transform: translateY(-4px);
        opacity: 1;
    }
}
/* /Components/Chat/MidnetteAskButton.razor.rz.scp.css */
/* Shared base */
.midnette-ask[b-kdauho8g2b] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    border: none;
    background: none;
    transition: all 0.2s ease;
}

.midnette-ask__mark[b-kdauho8g2b] {
    line-height: 1;
}

/* ===== Inline variant — pill button within content flow ===== */
.midnette-ask--inline[b-kdauho8g2b] {
    border: 1.5px solid var(--mn-gold);
    border-radius: 2rem;
    padding: 0.35rem 0.85rem;
    background: transparent;
}

.midnette-ask--inline .midnette-ask__mark[b-kdauho8g2b] {
    color: var(--mn-gold);
    font-size: 1.1em;
}

.midnette-ask--inline .midnette-ask__text[b-kdauho8g2b] {
    color: var(--mn-gold);
    font-size: 0.85rem;
    font-weight: 500;
}

.midnette-ask--inline:hover[b-kdauho8g2b] {
    background: var(--mn-gold);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.15);
}

.midnette-ask--inline:hover .midnette-ask__mark[b-kdauho8g2b],
.midnette-ask--inline:hover .midnette-ask__text[b-kdauho8g2b] {
    color: var(--mn-navy);
}

.midnette-ask--inline:active[b-kdauho8g2b] {
    transform: scale(0.97);
}

/* ===== Banner variant — prominent callout card ===== */
.midnette-ask--banner[b-kdauho8g2b] {
    background: var(--mn-navy);
    border-radius: 0.75rem;
    padding: 0.75rem 1.25rem;
    box-shadow: var(--mn-shadow-sm);
}

.midnette-ask--banner .midnette-ask__mark[b-kdauho8g2b] {
    color: var(--mn-gold);
    font-size: 1.3rem;
}

.midnette-ask--banner .midnette-ask__text[b-kdauho8g2b] {
    color: #fff;
    font-size: 0.9rem;
    font-weight: 500;
}

.midnette-ask--banner:hover[b-kdauho8g2b] {
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.25), var(--mn-shadow-md);
    filter: brightness(1.1);
}

.midnette-ask--banner:active[b-kdauho8g2b] {
    transform: scale(0.98);
}
/* /Components/Commerce/LibrarySeriesGroup.razor.rz.scp.css */
/* Phase B-4 — LibrarySeriesGroup.
   AI-INSTRUCTION: Component-internal layout only. Composes the global primitives
   .mn-series-card, .mn-series-accent-bar, .mn-series-card__progress(__fill),
   .mn-series-accent-cta, .mn-section-headline, .mn-section-eyebrow from app.css.
   Do not redefine those here. All colours via --mn-* tokens (no raw hex). */

.library-series-group[b-lwgky22wa3] {
    position: relative;
    padding: 0;
    overflow: hidden;
    height: 100%; /* match siblings in a Bootstrap row */
}

.library-series-group__banner[b-lwgky22wa3] {
    width: 100%;
    height: 110px;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid var(--mn-border-default, rgba(240, 232, 216, 0.10));
}

@media (min-width: 992px) {
    .library-series-group__banner[b-lwgky22wa3] { height: 130px; }
}

.library-series-group__body[b-lwgky22wa3] {
    padding: 0.875rem 0.875rem 0.875rem 1.125rem; /* extra-left clears the 4px accent bar */
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.library-series-group__header[b-lwgky22wa3] {
    display: flex;
    flex-direction: row;
    gap: 0.875rem;
    align-items: flex-start;
}

.library-series-group__cover[b-lwgky22wa3] {
    flex: 0 0 auto;
    width: 56px;
    height: 80px;
    border-radius: 4px;
    overflow: hidden;
    background: var(--mn-bg-surface-alt, rgba(240, 232, 216, 0.06));
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}

.library-series-group__cover img[b-lwgky22wa3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.library-series-group__cover-placeholder[b-lwgky22wa3] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    font-size: 1.5rem;
}

.library-series-group__heading[b-lwgky22wa3] {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.library-series-group__title[b-lwgky22wa3] {
    display: inline-block;
    text-decoration: none;
    line-height: 1.2;
}

.library-series-group__title:hover[b-lwgky22wa3],
.library-series-group__title:focus[b-lwgky22wa3] {
    text-decoration: underline;
    text-decoration-color: var(--mn-gold);
}

.library-series-group__byline[b-lwgky22wa3] {
    color: var(--mn-text-secondary, rgba(240, 232, 216, 0.70));
    font-size: 0.875rem;
}

.library-series-group__byline a[b-lwgky22wa3] {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px dotted currentColor;
}

.library-series-group__byline a:hover[b-lwgky22wa3] {
    color: var(--mn-gold);
    border-bottom-color: var(--mn-gold);
}

.library-series-group__badge-row[b-lwgky22wa3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-top: 0.25rem;
}

.library-series-group__progress[b-lwgky22wa3] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.library-series-group__progress-caption[b-lwgky22wa3] {
    font-family: var(--mn-font-mono, "SFMono-Regular", Menlo, monospace);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mn-text-secondary, rgba(240, 232, 216, 0.70));
}

.library-series-group__cta[b-lwgky22wa3] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.library-series-group__cta-link[b-lwgky22wa3] {
    width: 100%;
    justify-content: space-between;
    min-height: 44px;
}

.library-series-group__cta-label[b-lwgky22wa3] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    flex: 1 1 auto;
    line-height: 1.25;
}

.library-series-group__cta-meta[b-lwgky22wa3] {
    font-family: var(--mn-font-mono, "SFMono-Regular", Menlo, monospace);
    font-size: 0.6875rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    opacity: 0.85;
}

.library-series-group__cta-title[b-lwgky22wa3] {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.library-series-group__complete[b-lwgky22wa3] {
    padding: 0.5rem 0;
}

.library-series-group__books[b-lwgky22wa3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.4rem;
}

@media (min-width: 576px) and (max-width: 991.98px) {
    .library-series-group__books[b-lwgky22wa3] {
        grid-template-columns: repeat(6, 1fr);
    }
}

.library-series-group__tile[b-lwgky22wa3] {
    position: relative;
    display: block;
    aspect-ratio: 2 / 3;
    border-radius: 4px;
    overflow: hidden;
    background: var(--mn-bg-surface-alt, rgba(240, 232, 216, 0.06));
    text-decoration: none;
    transition: transform 120ms ease, box-shadow 120ms ease;
}

.library-series-group__tile:hover[b-lwgky22wa3],
.library-series-group__tile:focus[b-lwgky22wa3] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.40);
}

.library-series-group__tile img[b-lwgky22wa3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.library-series-group__tile-placeholder[b-lwgky22wa3] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    font-size: 1.25rem;
}

.library-series-group__tile-overlay[b-lwgky22wa3] {
    position: absolute;
    bottom: 4px;
    right: 4px;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--mn-gold);
    background: rgba(11, 10, 20, 0.78);
    border-radius: 50%;
    font-size: 1rem;
    line-height: 1;
}

.library-series-group__tile-number[b-lwgky22wa3] {
    position: absolute;
    top: 4px;
    left: 4px;
    min-width: 18px;
    padding: 1px 4px;
    background: rgba(11, 10, 20, 0.72);
    color: var(--mn-text-primary, #f0e8d8);
    font-family: var(--mn-font-mono, "SFMono-Regular", Menlo, monospace);
    font-size: 0.625rem;
    letter-spacing: 0.04em;
    border-radius: 3px;
    text-align: center;
}

.library-series-group__tile--unowned[b-lwgky22wa3] {
    opacity: 0.55;
}

.library-series-group__tile--reading[b-lwgky22wa3] {
    box-shadow: inset 0 0 0 2px var(--mn-gold);
}

.library-series-group__tile--read[b-lwgky22wa3] {
    /* Overlay handles the affordance; keep the tile itself at full opacity. */
}

.library-series-group__expand[b-lwgky22wa3] {
    margin-top: 0.25rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    background: transparent;
    color: var(--mn-text-secondary, rgba(240, 232, 216, 0.70));
    border: 1px dashed var(--mn-border-default, rgba(240, 232, 216, 0.18));
    border-radius: 4px;
    font-family: var(--mn-font-mono, "SFMono-Regular", Menlo, monospace);
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    min-height: 44px;
    transition: color 120ms ease, border-color 120ms ease;
}

.library-series-group__expand:hover[b-lwgky22wa3],
.library-series-group__expand:focus[b-lwgky22wa3] {
    color: var(--mn-gold);
    border-color: var(--mn-gold);
}
/* /Components/Commerce/RefundRequestModal.razor.rz.scp.css */
.refund-preview-block[b-psdxz0mhxl] {
    background: var(--mn-bg-surface-alt, #f5f2ed);
    border-left: 3px solid var(--mn-accent, #b5984a);
    padding: var(--mn-space-3, 0.75rem);
    margin-bottom: var(--mn-space-4, 1rem);
    border-radius: 0.25rem;
}

.refund-preview-block > div + div[b-psdxz0mhxl] {
    margin-top: var(--mn-space-2, 0.5rem);
}
/* /Components/CookieConsent.razor.rz.scp.css */
.cookie-consent-banner[b-9wbazpdif3] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9998;
    background: var(--mn-primary, #02184b);
    color: #fff;
    padding: 1rem;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.3);
}

.cookie-consent-inner[b-9wbazpdif3] {
    max-width: 960px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.cookie-consent-text[b-9wbazpdif3] {
    flex: 1;
    font-size: 0.875rem;
    line-height: 1.5;
    min-width: 200px;
}

.cookie-consent-link[b-9wbazpdif3] {
    color: var(--mn-accent, #b5984a);
    text-decoration: underline;
    margin-left: 0.25rem;
}

.cookie-consent-link:hover[b-9wbazpdif3] {
    color: #d4b76a;
}

.cookie-consent-actions[b-9wbazpdif3] {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}
/* /Components/CoverPanel.razor.rz.scp.css */
/* CoverPanel — editorial "one object, two groups of verbs" layout */

.cover-panel[b-3ctlkryrer] {
    border: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface);
}

.cover-panel-grid[b-3ctlkryrer] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}

/* Object (cover) on the left */
.cover-panel-object[b-3ctlkryrer] {
    padding: 28px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    background: var(--mn-bg-surface-alt);
    border-bottom: 1px solid var(--mn-border-default);
}

.cover-panel-frame[b-3ctlkryrer] {
    width: 100%;
    max-width: 240px;
    aspect-ratio: 2 / 3;
    box-shadow:
        0 2px 5px rgba(0,0,0,0.55),
        0 10px 28px rgba(0,0,0,0.4),
        inset -2px 0 4px rgba(0,0,0,0.35),
        inset 2px 0 0 rgba(255,255,255,0.05);
    border-radius: 1px 2px 2px 1px;
    overflow: hidden;
    background: var(--mn-bg-body);
}

.cover-panel-frame[b-3ctlkryrer]  .book-cover,
.cover-panel-frame[b-3ctlkryrer]  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cover-panel-caption[b-3ctlkryrer] {
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
}

.cover-panel-caption-sub[b-3ctlkryrer] {
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 9px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
    margin-top: -4px;
    text-align: center;
    max-width: 240px;
}

/* Verbs on the right */
.cover-panel-verbs[b-3ctlkryrer] {
    padding: 4px 24px 16px;
}

.verb-group[b-3ctlkryrer] {
    padding-top: 14px;
}

.verb-group + .verb-group[b-3ctlkryrer] {
    border-top: 1px solid var(--mn-border-default);
    margin-top: 8px;
    padding-top: 18px;
}

.verb-group-head[b-3ctlkryrer] {
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin-bottom: 4px;
    padding-bottom: 2px;
}

.verb-group-head-sub[b-3ctlkryrer] {
    color: var(--mn-text-tertiary);
    letter-spacing: 1.5px;
    font-weight: 400;
}

.verb-row[b-3ctlkryrer] {
    padding: 14px 0;
}

.verb-head[b-3ctlkryrer] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) minmax(0, 240px);
    align-items: start;
    column-gap: 14px;
    row-gap: 2px;
}

.verb-icon[b-3ctlkryrer] {
    color: var(--mn-gold);
    font-size: 20px;
    line-height: 1;
    padding-top: 2px;
    grid-column: 1;
    grid-row: 1 / span 2;
}

.verb-text[b-3ctlkryrer] {
    grid-column: 2;
    grid-row: 1 / span 2;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.verb-title[b-3ctlkryrer] {
    font-family: var(--mn-font-body, Merriweather, Georgia, serif);
    font-size: 15px;
    font-weight: 600;
    color: var(--mn-text-primary);
    line-height: 1.3;
}

.verb-sub[b-3ctlkryrer] {
    font-size: 12.5px;
    color: var(--mn-text-secondary);
    line-height: 1.45;
}

.verb-cta[b-3ctlkryrer] {
    grid-column: 3;
    grid-row: 1 / span 2;
    align-self: center;
    justify-self: end;
    min-width: 0;
    max-width: 100%;
}

.verb-cta[b-3ctlkryrer]  .alert {
    max-width: 100%;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.verb-body[b-3ctlkryrer] {
    margin-top: 10px;
    margin-left: 42px;
}

.verb-divider[b-3ctlkryrer] {
    margin: 0;
    border: 0;
    border-top: 1px solid var(--mn-border-light);
    opacity: 1;
}

.verb-note[b-3ctlkryrer] {
    margin-top: 6px;
    margin-left: 42px;
    font-size: 12px;
    color: var(--mn-text-tertiary);
    font-style: italic;
}

/* Desktop layout: two columns */
@media (min-width: 768px) {
    .cover-panel-grid[b-3ctlkryrer] {
        grid-template-columns: 280px 1fr;
    }

    .cover-panel-object[b-3ctlkryrer] {
        border-bottom: 0;
        border-right: 1px solid var(--mn-border-default);
        padding: 32px 24px;
    }

    .cover-panel-frame[b-3ctlkryrer] {
        max-width: 220px;
    }
}

/* Small screens */
@media (max-width: 480px) {
    .cover-panel-object[b-3ctlkryrer] {
        padding: 20px 16px;
    }

    .cover-panel-verbs[b-3ctlkryrer] {
        padding: 4px 16px 12px;
    }

    .verb-row[b-3ctlkryrer] {
        padding: 12px 0;
    }

    .verb-head[b-3ctlkryrer] {
        grid-template-columns: 28px minmax(0, 1fr) minmax(0, 180px);
    }

    .verb-body[b-3ctlkryrer],
    .verb-note[b-3ctlkryrer] {
        margin-left: 0;
    }
}
/* /Components/FollowButton.razor.rz.scp.css */
.follow-btn[b-z2w3zynj6j] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-family: var(--mn-font-body);
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: var(--mn-radius-md);
    padding: 0.375rem 0.75rem;
    transition: background-color var(--mn-transition-fast), color var(--mn-transition-fast), border-color var(--mn-transition-fast);
    white-space: nowrap;
    line-height: 1.4;
}

/* Not following — readable outline on dark bg (was navy-on-navy, invisible) */
.follow-btn-default[b-z2w3zynj6j] {
    color: var(--mn-text-primary);
    background-color: transparent;
    border: 1.5px solid var(--mn-border-strong);
}

.follow-btn-default:hover:not(:disabled)[b-z2w3zynj6j] {
    background-color: var(--mn-bg-surface-alt);
    border-color: var(--mn-gold);
    color: var(--mn-gold);
}

.follow-btn-default:hover:not(:disabled) .follow-btn-count[b-z2w3zynj6j] {
    background-color: rgba(217, 137, 71, 0.15) !important;
    color: var(--mn-gold) !important;
}

/* Following — gold accent outline signals active state without screaming */
.follow-btn-following[b-z2w3zynj6j] {
    color: var(--mn-gold);
    background-color: rgba(217, 137, 71, 0.08);
    border: 1.5px solid var(--mn-gold);
}

/* Following + hovering — unfollow danger style */
.follow-btn-unfollow[b-z2w3zynj6j] {
    color: #ffffff;
    background-color: var(--mn-danger, #a83a4a);
    border: 1.5px solid var(--mn-danger, #a83a4a);
}

.follow-btn:disabled[b-z2w3zynj6j] {
    opacity: 0.6;
    cursor: not-allowed;
}

.follow-btn-label[b-z2w3zynj6j] {
    font-size: 0.875rem;
}

.follow-btn-count[b-z2w3zynj6j] {
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    transition: background-color var(--mn-transition-fast), color var(--mn-transition-fast);
}

.follow-btn-count--default[b-z2w3zynj6j] {
    background-color: var(--mn-bg-surface-alt);
    color: var(--mn-text-secondary);
}

.follow-btn-count--following[b-z2w3zynj6j] {
    background-color: rgba(217, 137, 71, 0.18);
    color: var(--mn-gold);
}

.follow-btn-count--unfollow[b-z2w3zynj6j] {
    background-color: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

.follow-btn .spinner-border[b-z2w3zynj6j] {
    width: 1rem;
    height: 1rem;
}
/* /Components/GoogleSignInButton.razor.rz.scp.css */
.google-signin-divider[b-0rd4fxazdr] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    margin: var(--mn-space-4) 0;
    color: var(--mn-text-tertiary);
    font-size: var(--mn-text-sm);
}

.google-signin-divider[b-0rd4fxazdr]::before,
.google-signin-divider[b-0rd4fxazdr]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--mn-border-default);
}

.google-signin-container[b-0rd4fxazdr] {
    display: flex;
    justify-content: center;
}
/* /Components/HomeSectionHeader.razor.rz.scp.css */
.home-section-header[b-biaxijah2l] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--mn-space-4);
    margin-bottom: var(--mn-space-6);
    flex-wrap: wrap;
}

.home-section-heading-block[b-biaxijah2l] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-2);
    min-width: 0;
    flex: 1;
}

/* .home-section-kicker → .mn-section-eyebrow + .mn-section-eyebrow--retail
   .home-section-title  → .mn-section-headline + .mn-section-headline--retail
   Both live in app.css as global primitives; this file is reserved for
   the genuinely page-scoped layout below. */

.home-section-viewall[b-biaxijah2l] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-base);
    color: var(--mn-text-secondary);
    text-decoration: none;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: var(--mn-space-1);
    transition: color var(--mn-transition-fast);
}

.home-section-viewall:hover[b-biaxijah2l] {
    color: var(--mn-gold);
}

.home-section-viewall-arrow[b-biaxijah2l] {
    color: var(--mn-gold);
    font-family: var(--mn-font-body);
    font-style: normal;
}
/* /Components/MusingCard.razor.rz.scp.css */
    /* === Card Container === */
    .musing-card[b-kdgn496v81] {
        background: var(--mn-bg-surface);
        border-radius: var(--mn-radius-md);
        box-shadow: var(--mn-shadow-sm);
        padding: var(--mn-space-4);
        display: flex;
        flex-direction: column;
        gap: var(--mn-space-3);
        transition: box-shadow var(--mn-transition-fast);
    }

    .musing-card:hover[b-kdgn496v81] {
        box-shadow: var(--mn-shadow-md);
    }

    /* Platform post: navy left border */
    .musing-card--platform[b-kdgn496v81] {
        border-left: 3px solid var(--mn-navy);
    }

    /* Review: gold top accent */
    .musing-card--review .musing-card__review-accent[b-kdgn496v81] {
        height: 3px;
        background: var(--mn-gold);
        border-radius: var(--mn-radius-md) var(--mn-radius-md) 0 0;
        margin: calc(-1 * var(--mn-space-4));
        margin-bottom: 0;
    }

    /* === Header === */
    .musing-card__header[b-kdgn496v81] {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }

    .musing-card__header-left[b-kdgn496v81] {
        display: flex;
        align-items: flex-start;
        gap: var(--mn-space-3);
        min-width: 0;
    }

    /* Avatar */
    .musing-card__avatar[b-kdgn496v81] {
        width: 40px;
        height: 40px;
        border-radius: var(--mn-radius-full);
        background: var(--mn-gray-200);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        overflow: hidden;
    }

    .musing-card__avatar-img[b-kdgn496v81] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .musing-card__avatar-initials[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-sm);
        font-weight: var(--mn-font-semibold);
        color: var(--mn-text-secondary);
        line-height: 1;
        user-select: none;
    }

    /* Identity */
    .musing-card__identity[b-kdgn496v81] {
        display: flex;
        flex-direction: column;
        gap: var(--mn-space-1);
        min-width: 0;
    }

    .musing-card__name-row[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-2);
        flex-wrap: wrap;
    }

    .musing-card__display-name[b-kdgn496v81] {
        font-family: var(--mn-font-body);
        font-size: var(--mn-text-sm);
        font-weight: var(--mn-font-bold);
        color: var(--mn-text-primary);
        line-height: var(--mn-leading-tight);
    }

    .musing-card__display-name--author[b-kdgn496v81] {
        color: var(--mn-gold-dark);
        text-decoration: none;
    }

    .musing-card__display-name--author:hover[b-kdgn496v81] {
        color: var(--mn-gold-darkest);
        text-decoration: underline;
    }

    .musing-card__display-name--platform[b-kdgn496v81] {
        color: var(--mn-navy);
    }

    .musing-card__author-icon[b-kdgn496v81] {
        color: var(--mn-gold);
        font-size: var(--mn-text-sm);
    }

    .musing-card__platform-icon[b-kdgn496v81] {
        color: var(--mn-navy);
        font-size: var(--mn-text-sm);
    }

    .musing-card__pinned-icon[b-kdgn496v81] {
        color: var(--mn-gold);
        font-size: var(--mn-text-xs);
    }

    /* Badges */
    .musing-card__badge[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: 0.6875rem;
        font-weight: var(--mn-font-semibold);
        padding: 0.1em 0.5em;
        border-radius: var(--mn-radius-full);
        line-height: 1.4;
        white-space: nowrap;
    }

    .musing-card__badge--author[b-kdgn496v81] {
        background: rgba(181, 152, 74, 0.15);
        color: var(--mn-gold-dark);
    }

    /* Meta row */
    .musing-card__meta-row[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-1);
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        color: var(--mn-text-tertiary);
        line-height: var(--mn-leading-tight);
    }

    /* === Context Banner (book/author strip) === */
    .musing-card__scope-trigger[b-kdgn496v81] {
        position: relative;
    }

    .musing-card__context-banner[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-3);
        padding: var(--mn-space-2) var(--mn-space-3);
        background: var(--mn-bg-surface-alt);
        border: 1px solid var(--mn-border-light);
        border-radius: var(--mn-radius-sm);
        text-decoration: none;
        transition: background var(--mn-transition-fast), border-color var(--mn-transition-fast);
    }

    .musing-card__context-banner:hover[b-kdgn496v81] {
        background: var(--mn-gray-100);
        border-color: var(--mn-border-default);
    }

    .musing-card__context-cover[b-kdgn496v81] {
        width: 36px;
        height: 52px;
        object-fit: cover;
        border-radius: 3px;
        flex-shrink: 0;
        background: var(--mn-gray-200);
        box-shadow: 0 1px 2px rgba(0,0,0,0.08);
    }

    .musing-card__context-avatar[b-kdgn496v81] {
        width: 40px;
        height: 40px;
        border-radius: var(--mn-radius-full);
        object-fit: cover;
        flex-shrink: 0;
        background: var(--mn-gray-200);
    }

    .musing-card__context-details[b-kdgn496v81] {
        display: flex;
        flex-direction: column;
        gap: 1px;
        min-width: 0;
        flex: 1;
    }

    .musing-card__context-title[b-kdgn496v81] {
        font-family: var(--mn-font-body);
        font-size: var(--mn-text-sm);
        font-weight: var(--mn-font-bold);
        color: var(--mn-text-primary);
        line-height: var(--mn-leading-tight);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .musing-card__context-author[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        color: var(--mn-text-secondary);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .musing-card__context-meta[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: 0.65rem;
        color: var(--mn-text-tertiary);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .musing-card__context-rating[b-kdgn496v81] {
        margin-left: 0.25em;
    }

    .musing-card__context-rating i[b-kdgn496v81] {
        color: var(--mn-gold);
        font-size: 0.55rem;
    }

    /* Simple pill fallback when no enrichment */
    .musing-card__scope-pill-simple[b-kdgn496v81] {
        display: inline-flex;
        align-items: center;
        padding: 0.15em 0.55em;
        background: var(--mn-bg-surface-alt);
        border: 1px solid var(--mn-border-default);
        border-radius: var(--mn-radius-full);
        color: var(--mn-text-secondary);
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        text-decoration: none;
        white-space: nowrap;
        transition: background var(--mn-transition-fast);
    }

    .musing-card__scope-pill-simple:hover[b-kdgn496v81] {
        background: var(--mn-gray-200);
        color: var(--mn-text-primary);
    }

    /* === Hover Popover === */
    .musing-card__scope-popover[b-kdgn496v81] {
        position: absolute;
        top: calc(100% + 6px);
        left: 0;
        z-index: var(--mn-z-popover);
        width: 320px;
        max-width: 90vw;
        background: var(--mn-bg-surface);
        border: 1px solid var(--mn-border-default);
        border-radius: var(--mn-radius-md);
        box-shadow: var(--mn-shadow-lg);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-4px);
        transition: opacity 150ms ease, visibility 150ms ease, transform 150ms ease;
        transition-delay: 0ms;
    }

    .musing-card__scope-trigger:hover .musing-card__scope-popover[b-kdgn496v81] {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
        transition-delay: 200ms;
    }

    .musing-card__scope-trigger:not(:hover) .musing-card__scope-popover[b-kdgn496v81] {
        transition-delay: 100ms;
    }

    @@media (hover: none) {
        .musing-card__scope-popover[b-kdgn496v81] {
            display: none;
        }
    }

    .musing-card__popover-inner[b-kdgn496v81] {
        display: flex;
        gap: var(--mn-space-3);
        padding: var(--mn-space-3);
    }

    .musing-card__popover-inner--author[b-kdgn496v81] {
        align-items: flex-start;
    }

    .musing-card__popover-cover[b-kdgn496v81] {
        width: 56px;
        height: 84px;
        object-fit: cover;
        border-radius: var(--mn-radius-sm);
        flex-shrink: 0;
        background: var(--mn-gray-200);
    }

    .musing-card__popover-avatar[b-kdgn496v81] {
        width: 48px;
        height: 48px;
        border-radius: var(--mn-radius-full);
        object-fit: cover;
        flex-shrink: 0;
        background: var(--mn-gray-200);
    }

    .musing-card__popover-info[b-kdgn496v81] {
        display: flex;
        flex-direction: column;
        gap: var(--mn-space-1);
        min-width: 0;
        flex: 1;
    }

    .musing-card__popover-title[b-kdgn496v81] {
        font-family: var(--mn-font-body);
        font-size: var(--mn-text-sm);
        font-weight: var(--mn-font-bold);
        color: var(--mn-text-primary);
        text-decoration: none;
        line-height: var(--mn-leading-tight);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .musing-card__popover-title:hover[b-kdgn496v81] {
        color: var(--mn-navy);
        text-decoration: underline;
    }

    .musing-card__popover-author[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        color: var(--mn-text-secondary);
        text-decoration: none;
    }

    .musing-card__popover-author:hover[b-kdgn496v81] {
        color: var(--mn-gold-dark);
        text-decoration: underline;
    }

    .musing-card__popover-tagline[b-kdgn496v81] {
        font-family: var(--mn-font-body);
        font-size: var(--mn-text-xs);
        color: var(--mn-text-secondary);
        font-style: italic;
        margin: 0;
        line-height: var(--mn-leading-tight);
    }

    .musing-card__popover-genres[b-kdgn496v81] {
        display: flex;
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .musing-card__popover-genre[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: 0.625rem;
        padding: 0.05em 0.4em;
        background: var(--mn-bg-surface-alt);
        border: 1px solid var(--mn-border-light);
        border-radius: var(--mn-radius-full);
        color: var(--mn-text-tertiary);
        white-space: nowrap;
    }

    .musing-card__popover-stats[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-2);
        font-family: var(--mn-font-system);
        font-size: 0.65rem;
        color: var(--mn-text-tertiary);
    }

    .musing-card__popover-stats i[b-kdgn496v81] {
        color: var(--mn-gold);
        font-size: 0.6rem;
    }

    .musing-card__popover-synopsis[b-kdgn496v81] {
        font-family: var(--mn-font-body);
        font-size: var(--mn-text-xs);
        color: var(--mn-text-secondary);
        line-height: var(--mn-leading-relaxed);
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .musing-card__meta-sep[b-kdgn496v81] {
        color: var(--mn-gray-400);
    }

    .musing-card__timestamp[b-kdgn496v81] {
        white-space: nowrap;
    }

    .musing-card__edited-label[b-kdgn496v81] {
        font-style: italic;
    }

    /* === Review Info === */
    .musing-card__review-info[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-3);
        flex-wrap: wrap;
    }

    .musing-card__stars[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: 0.125rem;
    }

    .musing-card__star[b-kdgn496v81] {
        color: var(--mn-gold);
        font-size: var(--mn-text-sm);
    }

    .musing-card__book-link[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        color: var(--mn-text-link);
        text-decoration: none;
    }

    .musing-card__book-link:hover[b-kdgn496v81] {
        color: var(--mn-text-link-hover);
        text-decoration: underline;
    }

    /* === Content === */
    .musing-card__content-wrap[b-kdgn496v81] {
        position: relative;
    }

    /* Inline edit form */
    .musing-card__edit-form[b-kdgn496v81] {
        display: flex;
        flex-direction: column;
        gap: var(--mn-space-2);
    }

    .musing-card__edit-textarea[b-kdgn496v81] {
        width: 100%;
        min-height: calc(3 * 1.5em + 1rem);
        max-height: calc(10 * 1.5em + 1rem);
        padding: var(--mn-space-2) var(--mn-space-3);
        font-family: var(--mn-font-body);
        font-size: var(--mn-text-sm);
        line-height: var(--mn-leading-relaxed);
        color: var(--mn-text-primary);
        background-color: var(--mn-bg-surface);
        border: 1px solid var(--mn-gold);
        border-radius: var(--mn-radius-sm);
        resize: vertical;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    }

    .musing-card__edit-textarea:focus[b-kdgn496v81] {
        outline: none;
        border-color: var(--mn-gold);
        box-shadow: 0 0 0 0.2rem rgba(181, 152, 74, 0.2);
    }

    .musing-card__edit-textarea.is-invalid[b-kdgn496v81] {
        border-color: var(--mn-danger);
    }

    .musing-card__edit-textarea:disabled[b-kdgn496v81] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .musing-card__edit-footer[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-2);
        flex-wrap: wrap;
    }

    .musing-card__edit-charcount[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: 0.75rem;
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
    }

    .musing-card__edit-error[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        color: var(--mn-danger);
    }

    .musing-card__edit-actions[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-2);
        margin-left: auto;
    }

    /* Delete confirmation inline */
    .musing-card__confirm-text[b-kdgn496v81] {
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        font-weight: var(--mn-font-semibold);
        color: var(--mn-danger);
        white-space: nowrap;
    }

    .musing-card__content[b-kdgn496v81] {
        font-family: var(--mn-font-body);
        font-size: var(--mn-text-sm);
        color: var(--mn-text-primary);
        line-height: var(--mn-leading-relaxed);
        white-space: pre-wrap;
        word-break: break-word;
        margin: 0;
    }

    /* @@mention styling */
    .musing-mention[b-kdgn496v81] {
        font-weight: var(--mn-font-semibold);
    }

    .musing-mention--author[b-kdgn496v81] {
        color: var(--mn-gold-dark);
        text-decoration: none;
        cursor: pointer;
    }

    .musing-mention--author:hover[b-kdgn496v81] {
        color: var(--mn-gold-darkest);
        text-decoration: underline;
    }

    .musing-mention--user[b-kdgn496v81] {
        color: var(--mn-navy);
    }

    /* Spoiler overlay */
    .musing-card__spoiler-overlay[b-kdgn496v81] {
        position: relative;
        cursor: pointer;
        border-radius: var(--mn-radius-sm);
        overflow: hidden;
        min-height: 60px;
    }

    .musing-card__spoiler-blur[b-kdgn496v81] {
        filter: blur(6px);
        user-select: none;
        pointer-events: none;
        opacity: 0.5;
    }

    .musing-card__spoiler-prompt[b-kdgn496v81] {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: var(--mn-space-1);
        background: rgba(250, 248, 245, 0.7);
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-sm);
        font-weight: var(--mn-font-semibold);
        color: var(--mn-text-secondary);
        transition: background var(--mn-transition-fast);
    }

    .musing-card__spoiler-overlay:hover .musing-card__spoiler-prompt[b-kdgn496v81] {
        background: rgba(250, 248, 245, 0.5);
    }

    .musing-card__spoiler-context[b-kdgn496v81] {
        font-size: var(--mn-text-xs);
        font-weight: var(--mn-font-regular);
        color: var(--mn-text-tertiary);
    }

    /* === Footer === */
    .musing-card__footer[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: var(--mn-space-2);
        padding-top: var(--mn-space-2);
        border-top: 1px solid var(--mn-border-light);
    }

    .musing-card__footer-spacer[b-kdgn496v81] {
        flex: 1;
    }

    .musing-card__action[b-kdgn496v81] {
        display: inline-flex;
        align-items: center;
        gap: var(--mn-space-1);
        padding: var(--mn-space-1) var(--mn-space-2);
        border: none;
        background: none;
        border-radius: var(--mn-radius-sm);
        font-family: var(--mn-font-system);
        font-size: var(--mn-text-xs);
        color: var(--mn-text-tertiary);
        cursor: pointer;
        transition: background var(--mn-transition-fast), color var(--mn-transition-fast);
        line-height: 1;
    }

    .musing-card__action:hover[b-kdgn496v81] {
        background: var(--mn-bg-surface-alt);
        color: var(--mn-text-secondary);
    }

    .musing-card__action i[b-kdgn496v81] {
        font-size: var(--mn-text-sm);
    }

    /* Upvoted state */
    .musing-card__action--upvoted[b-kdgn496v81] {
        color: var(--mn-gold);
        font-weight: var(--mn-font-semibold);
    }

    .musing-card__action--upvoted:hover[b-kdgn496v81] {
        color: var(--mn-gold-dark);
        background: rgba(181, 152, 74, 0.08);
    }

    /* Danger (delete) */
    .musing-card__action--danger:hover[b-kdgn496v81] {
        color: var(--mn-danger);
        background: var(--mn-danger-light);
    }

    /* Subtle (report) */
    .musing-card__action--subtle[b-kdgn496v81] {
        opacity: 0.5;
    }

    .musing-card__action--subtle:hover[b-kdgn496v81] {
        opacity: 1;
    }

    /* === Responsive === */
    @@media (max-width: 576px) {
        .musing-card[b-kdgn496v81] {
            padding: var(--mn-space-3);
        }

        .musing-card__avatar[b-kdgn496v81] {
            width: 34px;
            height: 34px;
        }

        .musing-card__avatar-initials[b-kdgn496v81] {
            font-size: var(--mn-text-xs);
        }
    }

    /* === Author Flag Button === */
    .musing-card__action--author-flag[b-kdgn496v81] {
        color: var(--mn-gold, #b5984a) !important;
    }

    .musing-card__action--author-flag:hover:not(:disabled)[b-kdgn496v81] {
        color: var(--mn-navy, #02184b) !important;
        background-color: rgba(181, 152, 74, 0.1);
    }

    .musing-card__action--author-flag:disabled[b-kdgn496v81] {
        opacity: 0.5;
    }

    /* === Spoiler Toggle Active === */
    .musing-card__action--spoiler-on[b-kdgn496v81] {
        color: var(--mn-gold, #b5984a) !important;
    }

    .musing-card__action--spoiler-on:hover:not(:disabled)[b-kdgn496v81] {
        background-color: rgba(181, 152, 74, 0.1);
    }

    /* === Pin Button Active === */
    .musing-card__action--pinned[b-kdgn496v81] {
        color: var(--mn-gold, #b5984a) !important;
    }

    .musing-card__action--pinned:hover:not(:disabled)[b-kdgn496v81] {
        background-color: rgba(181, 152, 74, 0.1);
    }

    /* === Heat Level === */
    /* bootstrap-eradication: REVIEW — #e74c3c is brighter than --mn-danger (#a83a4a); no exact token match. */
    .musing-card__context-heat[b-kdgn496v81] {
        color: #e74c3c;
        font-size: var(--mn-text-xs);
        margin-left: 0.25rem;
    }

    .musing-card__context-heat i[b-kdgn496v81] {
        margin-right: 1px;
    }

    /* Tombstone for soft-deleted musings */
    .musing-card--deleted[b-kdgn496v81] {
        opacity: 0.6;
        border-left-color: var(--mn-border-light) !important;
    }

    .musing-card__tombstone[b-kdgn496v81] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.75rem 0;
        color: var(--mn-text-muted);
        font-size: var(--mn-text-sm);
        font-style: italic;
    }

    .musing-card__tombstone-icon[b-kdgn496v81] {
        font-size: 1rem;
        opacity: 0.5;
    }

    .musing-card__tombstone-text[b-kdgn496v81] {
        flex: 1;
    }

    .musing-card__tombstone-replies[b-kdgn496v81] {
        font-size: var(--mn-text-xs);
        color: var(--mn-text-muted);
        font-style: normal;
    }
/* /Components/MusingsFeed.razor.rz.scp.css */
.musings-feed[b-b18xlwxt5a] {
    font-family: var(--mn-font-body);
}

.musings-feed-empty[b-b18xlwxt5a] {
    background: var(--mn-bg-surface);
    border-radius: var(--mn-radius-md);
    border: 1px dashed var(--mn-text-tertiary);
    padding: var(--mn-space-8) var(--mn-space-4);
}

.musings-feed-loading[b-b18xlwxt5a] {
    color: var(--mn-text-secondary);
}

.musings-feed-loading[b-b18xlwxt5a]  .spinner-border {
    width: 2rem;
    height: 2rem;
    color: var(--mn-navy) !important;
}

/* .btn-outline-secondary maps to neutral gray via design-tokens.css — no override needed */
/* /Components/NotificationBell.razor.rz.scp.css */
.notification-bell-wrapper[b-eyno7yza3h] {
    position: relative;
}

.notification-bell[b-eyno7yza3h] {
    background: none;
    border: none;
    color: var(--mn-header-text);
    font-size: 1.2rem;
    padding: var(--mn-space-2);
    cursor: pointer;
    position: relative;
    transition: color var(--mn-transition-fast);
}

.notification-bell:hover[b-eyno7yza3h] {
    color: var(--mn-gold);
}

/* bootstrap-eradication (Rule D review): the `-badge` suffix triggers the rubric
   but .notification-badge is a bell-anchored count indicator (absolute-positioned
   on top of the bell icon, navy border to overlay on the header bg). Tightly
   coupled to .notification-bell — keep page-scoped. */
.notification-badge[b-eyno7yza3h] {
    position: absolute;
    top: 2px;
    right: 0;
    background: var(--mn-gold);
    color: var(--mn-text-inverse);
    font-size: 0.65rem;
    font-weight: 700;
    font-family: var(--mn-font-system);
    min-width: 18px;
    height: 18px;
    border-radius: var(--mn-radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
    border: 2px solid var(--mn-navy);
}

.notification-dot[b-eyno7yza3h] {
    position: absolute;
    top: 2px;
    right: 0;
    width: 10px;
    height: 10px;
    background: var(--mn-danger, #a93226);
    border: 2px solid var(--mn-navy);
    border-radius: var(--mn-radius-full);
    box-shadow: 0 0 0 1px rgba(169, 50, 38, 0.4);
}

.notification-dropdown[b-eyno7yza3h] {
    position: absolute;
    top: calc(100% + var(--mn-space-2));
    right: 0;
    width: 380px;
    max-height: 480px;
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-xl);
    z-index: var(--mn-z-dropdown);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: dropdownFadeIn-b-eyno7yza3h 150ms ease;
}

@keyframes dropdownFadeIn-b-eyno7yza3h {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.notification-dropdown-header[b-eyno7yza3h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--mn-space-3) var(--mn-space-4);
    border-bottom: 1px solid var(--mn-border-default);
}

.notification-dropdown-title[b-eyno7yza3h] {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--mn-text-primary);
}

.notification-mark-all[b-eyno7yza3h] {
    background: none;
    border: none;
    color: var(--mn-gold);
    font-size: 0.8rem;
    cursor: pointer;
    padding: 0;
    font-family: var(--mn-font-body);
}

.notification-mark-all:hover[b-eyno7yza3h] {
    text-decoration: underline;
}

.notification-dropdown-list[b-eyno7yza3h] {
    overflow-y: auto;
    flex: 1;
    max-height: 360px;
}

.notification-empty[b-eyno7yza3h] {
    padding: var(--mn-space-8) var(--mn-space-4);
    text-align: center;
    color: var(--mn-text-secondary);
    font-size: 0.9rem;
}

.notification-item[b-eyno7yza3h] {
    display: flex;
    gap: var(--mn-space-3);
    padding: var(--mn-space-3) var(--mn-space-4);
    border: none;
    background: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    transition: background var(--mn-transition-fast);
    border-bottom: 1px solid var(--mn-border-light, rgba(0,0,0,0.05));
    font-family: var(--mn-font-body);
}

.notification-item:hover[b-eyno7yza3h] {
    background: var(--mn-hover-bg, rgba(0,0,0,0.03));
}

.notification-item.unread[b-eyno7yza3h] {
    border-left: 3px solid var(--mn-accent);
    background: var(--mn-highlight-bg, rgba(181, 152, 74, 0.05));
}

.notification-item-icon[b-eyno7yza3h] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--mn-radius-full);
    background: var(--mn-bg-subtle, rgba(0,0,0,0.05));
    color: var(--mn-text-secondary);
    font-size: 0.9rem;
}

.notification-item.unread .notification-item-icon[b-eyno7yza3h] {
    background: rgba(181, 152, 74, 0.12);
    color: var(--mn-gold);
}

.notification-item-content[b-eyno7yza3h] {
    flex: 1;
    min-width: 0;
}

.notification-item-title[b-eyno7yza3h] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--mn-text-primary);
    margin-bottom: 2px;
}

.notification-item-message[b-eyno7yza3h] {
    font-size: 0.8rem;
    color: var(--mn-text-secondary);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.notification-item-time[b-eyno7yza3h] {
    font-size: 0.72rem;
    color: var(--mn-text-secondary);
    margin-top: 4px;
    font-family: var(--mn-font-system);
}

.notification-dropdown-footer[b-eyno7yza3h] {
    padding: var(--mn-space-2) var(--mn-space-4);
    border-top: 1px solid var(--mn-border-default);
    text-align: center;
}

.notification-view-all[b-eyno7yza3h] {
    color: var(--mn-gold);
    font-size: 0.85rem;
    text-decoration: none;
    font-weight: 500;
}

.notification-view-all:hover[b-eyno7yza3h] {
    text-decoration: underline;
}

/* Mobile: full-width dropdown */
@media (max-width: 480px) {
    .notification-dropdown[b-eyno7yza3h] {
        position: fixed;
        top: var(--mn-header-height);
        left: 0;
        right: 0;
        width: 100%;
        max-height: calc(100vh - var(--mn-header-height));
        border-radius: 0;
    }
}
/* /Components/NotificationToast.razor.rz.scp.css */
.toast-container[b-rlajmtkm5m] {
    position: fixed;
    bottom: var(--mn-space-6);
    right: var(--mn-space-6);
    z-index: var(--mn-z-toast);
    display: flex;
    flex-direction: column-reverse;
    gap: var(--mn-space-2);
    max-width: 380px;
}

.toast-item[b-rlajmtkm5m] {
    display: flex;
    gap: var(--mn-space-3);
    padding: var(--mn-space-3) var(--mn-space-4);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-left: 3px solid var(--mn-gold);
    border-radius: var(--mn-radius-md);
    box-shadow: var(--mn-shadow-lg);
    cursor: pointer;
    animation: toastSlideIn-b-rlajmtkm5m 300ms ease;
    transition: opacity 300ms ease, transform 300ms ease;
}

.toast-item.removing[b-rlajmtkm5m] {
    opacity: 0;
    transform: translateX(100%);
}

@keyframes toastSlideIn-b-rlajmtkm5m {
    from {
        opacity: 0;
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.toast-icon[b-rlajmtkm5m] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--mn-radius-full);
    background: rgba(181, 152, 74, 0.12);
    color: var(--mn-gold);
    font-size: 0.85rem;
}

.toast-content[b-rlajmtkm5m] {
    flex: 1;
    min-width: 0;
}

.toast-title[b-rlajmtkm5m] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--mn-text-primary);
    margin-bottom: 2px;
}

.toast-message[b-rlajmtkm5m] {
    font-size: 0.78rem;
    color: var(--mn-text-secondary);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.toast-close[b-rlajmtkm5m] {
    flex-shrink: 0;
    background: none;
    border: none;
    color: var(--mn-text-secondary);
    font-size: 1rem;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    align-self: flex-start;
}

.toast-close:hover[b-rlajmtkm5m] {
    color: var(--mn-text-primary);
}

@media (max-width: 480px) {
    .toast-container[b-rlajmtkm5m] {
        left: var(--mn-space-3);
        right: var(--mn-space-3);
        bottom: var(--mn-space-3);
        max-width: none;
    }
}
/* /Components/PayoutSetupStatusBanner.razor.rz.scp.css */
.alert-payout-gold[b-17mf6nx0f8] {
    background-color: color-mix(in srgb, var(--mn-gold) 15%, var(--mn-bg-surface));
    border-color: var(--mn-gold);
    color: var(--mn-text);
}
/* /Components/PwaInstallPrompt.razor.rz.scp.css */
.pwa-install-banner[b-82s7x2ysny] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: var(--mn-z-toast);
    padding: var(--mn-space-3) var(--mn-space-4);
    padding-bottom: calc(var(--mn-space-3) + env(safe-area-inset-bottom, 0px));
    background-color: var(--mn-navy);
    box-shadow: 0 -2px 12px rgba(2, 24, 75, 0.3);
    animation: slideUp-b-82s7x2ysny 300ms ease;
}

.pwa-install-content[b-82s7x2ysny] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    max-width: 600px;
    margin: 0 auto;
}

.pwa-install-text[b-82s7x2ysny] {
    flex: 1;
    color: var(--mn-bg-warm);
    font-size: var(--mn-text-sm);
    line-height: 1.4;
}

.pwa-install-text strong[b-82s7x2ysny] {
    display: block;
    font-size: var(--mn-text-base);
    color: #fff;
    margin-bottom: 2px;
}

.pwa-install-text span[b-82s7x2ysny] {
    opacity: 0.85;
}

.share-icon[b-82s7x2ysny] {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    margin: 0 2px;
}

.btn-install[b-82s7x2ysny] {
    flex-shrink: 0;
    padding: var(--mn-space-2) var(--mn-space-5);
    background-color: var(--mn-gold);
    color: var(--mn-navy);
    font-weight: var(--mn-font-semibold);
    font-size: var(--mn-text-sm);
    border: none;
    border-radius: var(--mn-radius-sm);
    cursor: pointer;
    transition: background-color var(--mn-transition-fast);
    white-space: nowrap;
}

.btn-install:hover[b-82s7x2ysny] {
    background-color: var(--mn-gold-light);
}

.btn-dismiss[b-82s7x2ysny] {
    flex-shrink: 0;
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.5);
    font-size: 1rem;
    cursor: pointer;
    padding: var(--mn-space-1);
    line-height: 1;
    transition: color var(--mn-transition-fast);
}

.btn-dismiss:hover[b-82s7x2ysny] {
    color: #fff;
}

@keyframes slideUp-b-82s7x2ysny {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}
/* /Components/Reader/BookmarksPanel.razor.rz.scp.css */
.bookmarks-overlay[b-xqdcet4izw] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 200;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}

.bookmarks-overlay.visible[b-xqdcet4izw] {
    opacity: 1;
    visibility: visible;
}

.bookmarks-panel[b-xqdcet4izw] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 320px;
    max-width: 90vw;
    background: var(--reader-bg, #ffffff);
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s ease;
}

.bookmarks-overlay.visible .bookmarks-panel[b-xqdcet4izw] {
    transform: translateX(0);
}

.bookmarks-header[b-xqdcet4izw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--reader-border, #e0e0e0);
}

.bookmarks-header h3[b-xqdcet4izw] {
    margin: 0;
    font-size: 1.1rem;
    color: var(--reader-text, #1a1a1a);
}

.close-btn[b-xqdcet4izw] {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    color: var(--reader-text-muted, #666);
    border-radius: 4px;
}

.close-btn:hover[b-xqdcet4izw] {
    background: var(--reader-hover, rgba(0, 0, 0, 0.05));
}

.bookmarks-content[b-xqdcet4izw] {
    flex: 1;
    overflow-y: auto;
}

.empty-bookmarks[b-xqdcet4izw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 40px 20px;
    text-align: center;
    color: var(--reader-text-muted, #666);
}

.empty-bookmarks i[b-xqdcet4izw] {
    font-size: 3rem;
    margin-bottom: 16px;
    opacity: 0.5;
}

.empty-bookmarks p[b-xqdcet4izw] {
    margin: 0 0 8px;
    font-size: 1rem;
}

.empty-bookmarks small[b-xqdcet4izw] {
    opacity: 0.7;
}

.bookmarks-list[b-xqdcet4izw] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.bookmark-item[b-xqdcet4izw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    border-bottom: 1px solid var(--reader-border, #e0e0e0);
    cursor: pointer;
    transition: background 0.15s;
}

.bookmark-item:hover[b-xqdcet4izw] {
    background: var(--reader-hover, rgba(0, 0, 0, 0.03));
}

.bookmark-info[b-xqdcet4izw] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.bookmark-chapter[b-xqdcet4izw] {
    font-weight: 500;
    color: var(--reader-text, #1a1a1a);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bookmark-page[b-xqdcet4izw] {
    font-size: 0.85rem;
    color: var(--reader-text-muted, #666);
}

.bookmark-note[b-xqdcet4izw] {
    font-size: 0.85rem;
    color: var(--reader-text-muted, #888);
    font-style: italic;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.delete-btn[b-xqdcet4izw] {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    color: var(--reader-text-muted, #999);
    border-radius: 4px;
    opacity: 0;
    transition: opacity 0.15s, color 0.15s;
}

.bookmark-item:hover .delete-btn[b-xqdcet4izw] {
    opacity: 1;
}

.delete-btn:hover[b-xqdcet4izw] {
    color: #dc3545;
    background: rgba(220, 53, 69, 0.1);
}
/* /Components/Reader/ParagraphReactions.razor.rz.scp.css */
.paragraph-reactions[b-tiuis5q11y] {
    display: flex;
    gap: 4px;
    padding: 4px 8px;
    background: var(--reader-bg, #fff);
    border: 1px solid var(--reader-border, #e0e0e0);
    border-radius: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.15s ease, transform 0.15s ease;
    pointer-events: none;
}

.paragraph-reactions.visible[b-tiuis5q11y] {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.reaction-btn[b-tiuis5q11y] {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 4px 6px;
    border: none;
    background: transparent;
    border-radius: 16px;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.1s ease;
    font-size: 1rem;
}

.reaction-btn:hover[b-tiuis5q11y] {
    background: rgba(0,0,0,0.06);
    transform: scale(1.15);
}

.reaction-btn.active[b-tiuis5q11y] {
    background: rgba(181, 152, 74, 0.15);
}

.reaction-count[b-tiuis5q11y] {
    font-size: 0.7rem;
    color: var(--reader-text-muted, #888);
    font-family: system-ui, sans-serif;
}
/* /Components/Reader/ReaderContent.razor.rz.scp.css */
.reader-viewport[b-mrnvckt9h1] {
    position: fixed;
    top: 12px;
    bottom: 12px;
    left: var(--reader-margin, 40px);
    right: var(--reader-margin, 40px);
    overflow: hidden;
    --reader-column-gap: 40px;
}

.reader-columns[b-mrnvckt9h1] {
    height: 100%;
    column-fill: auto;
    overflow: visible;
    transition: transform 0.3s ease;
}

/* Typography for paginated content */
.reader-columns[b-mrnvckt9h1]  p {
    margin: 0 0 1em 0;
    orphans: 2;
    widows: 2;
}

.reader-columns[b-mrnvckt9h1]  img {
    max-width: 100%;
    max-height: calc(100vh - var(--header-height, 50px) - var(--footer-height, 40px));
    width: auto;
    height: auto;
    object-fit: contain;
    break-inside: avoid;
    display: block;
    margin: 0 auto;
}

.reader-columns[b-mrnvckt9h1]  h1,
.reader-columns[b-mrnvckt9h1]  h2,
.reader-columns[b-mrnvckt9h1]  h3 {
    break-after: avoid;
}

.reader-columns[b-mrnvckt9h1]  blockquote {
    break-inside: avoid;
}

.reader-columns[b-mrnvckt9h1]  pre {
    break-inside: avoid;
    overflow-x: auto;
    max-width: 100%;
}

/* Honeypot trap elements — must not be visible or interactive */
.reader-columns[b-mrnvckt9h1]  .hp-aux {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    pointer-events: none !important;
}
/* /Components/Reader/ReaderFooter.razor.rz.scp.css */
.reader-footer[b-cs2dy12o5d] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: calc(var(--footer-height, 40px) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: var(--reader-header-bg, rgba(255, 255, 255, 0.98));
    border-top: 1px solid var(--reader-border, #e0e0e0);
    z-index: 100;
    transition: transform 0.3s ease, opacity 0.3s ease;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.reader-footer.hidden[b-cs2dy12o5d] {
    transform: translateY(100%);
    opacity: 0;
    pointer-events: none;
}

.reader-footer.visible[b-cs2dy12o5d] {
    transform: translateY(0);
    opacity: 1;
}

.footer-content[b-cs2dy12o5d] {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    gap: 16px;
}

.page-info[b-cs2dy12o5d],
.chapter-info[b-cs2dy12o5d] {
    flex-shrink: 0;
    min-width: 60px;
}

.page-numbers[b-cs2dy12o5d] {
    font-size: 0.8rem;
    color: var(--reader-text-muted, #666);
    font-variant-numeric: tabular-nums;
}

.chapter-indicator[b-cs2dy12o5d] {
    font-size: 0.75rem;
    color: var(--reader-text-muted, #666);
    text-align: right;
    display: block;
}

.progress-bar-container[b-cs2dy12o5d] {
    flex: 1;
    height: 4px;
    background: var(--reader-border, #e0e0e0);
    border-radius: 2px;
    overflow: hidden;
    max-width: 400px;
}

.progress-bar[b-cs2dy12o5d] {
    height: 100%;
    background: var(--reader-link, #0066cc);
    border-radius: 2px;
    transition: width 0.3s ease;
    min-width: 4px;
}

@media (max-width: 480px) {
    .footer-content[b-cs2dy12o5d] {
        padding: 0 12px;
        gap: 8px;
    }

    .page-info[b-cs2dy12o5d],
    .chapter-info[b-cs2dy12o5d] {
        min-width: 50px;
    }

    .page-numbers[b-cs2dy12o5d] {
        font-size: 0.75rem;
    }

    .chapter-indicator[b-cs2dy12o5d] {
        font-size: 0.7rem;
    }

    .progress-bar-container[b-cs2dy12o5d] {
        max-width: 200px;
    }
}
/* /Components/Reader/ReaderGate.razor.rz.scp.css */
/* ReaderGate — fits within a single viewport (reader uses page-turn nav) */

.reader-gate[b-1gcl5t6y0l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    padding: 0 1.5rem 0.75rem;
    max-width: 65ch;
    margin: 0 auto;
    color: var(--reader-text, #1a1a1a);
    overflow: hidden;
}

/* ── Preview zone — fills remaining space, shrinks as needed ── */

.gate-preview-zone[b-1gcl5t6y0l] {
    width: 100%;
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
}

.gate-preview-fade[b-1gcl5t6y0l] {
    height: 100%;
    overflow: hidden;
    mask-image: linear-gradient(to bottom, black 20%, transparent 95%);
    -webkit-mask-image: linear-gradient(to bottom, black 20%, transparent 95%);
}

.gate-real-preview[b-1gcl5t6y0l] {
    font-family: var(--reader-font-family, Georgia, serif);
    font-size: var(--reader-font-size, 18px);
    line-height: var(--reader-line-height, 1.8);
    color: var(--reader-text);
}

.gate-real-preview[b-1gcl5t6y0l]  p {
    margin-bottom: 1em;
    text-indent: 1.5em;
}

.gate-faux-text[b-1gcl5t6y0l] {
    display: flex;
    flex-direction: column;
    gap: 0.9em;
    padding: 0 0.5rem;
}

.gate-faux-line[b-1gcl5t6y0l] {
    height: 1em;
    background: var(--reader-text, #1a1a1a);
    opacity: 0.07;
    border-radius: 4px;
}

/* ── Chapter teaser — the real sales hook, never truncated ── */

.gate-teaser[b-1gcl5t6y0l] {
    font-style: italic;
    text-align: center;
    max-width: 50ch;
    margin: 0.5rem auto 0.6rem;
    color: var(--reader-text-muted, #6c757d);
    line-height: 1.55;
    font-size: 0.92em;
    flex-shrink: 0;
}

/* ── Gate card — tight ── */

.gate-card[b-1gcl5t6y0l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 100%;
    max-width: 440px;
    padding: 0.6rem 1rem 0.5rem;
    background: var(--reader-card-bg, var(--reader-bg, #fff));
    border: 1px solid var(--reader-border, #e0e0e0);
    border-radius: 0.6rem;
    flex-shrink: 0;
}

/* ── Book stripe: cover + title/author + inline stats ── */

.gate-book-stripe[b-1gcl5t6y0l] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.3rem;
    width: 100%;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--reader-border, #e0e0e0);
}

.gate-book-stripe img[b-1gcl5t6y0l] {
    height: 36px;
    width: auto;
    border-radius: 3px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
    flex-shrink: 0;
}

.gate-book-info[b-1gcl5t6y0l] {
    display: flex;
    flex-direction: column;
    text-align: left;
    min-width: 0;
}

.gate-book-title[b-1gcl5t6y0l] {
    font-weight: 700;
    font-size: 0.82em;
    color: var(--reader-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gate-book-meta[b-1gcl5t6y0l] {
    font-size: 0.72em;
    color: var(--reader-text-muted, #6c757d);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gate-stat[b-1gcl5t6y0l] {
    margin-left: 0.5rem;
}

[b-1gcl5t6y0l] .gate-star {
    color: var(--mn-gold, #b5984a);
}

/* ── Headline ── */

.gate-headline[b-1gcl5t6y0l] {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0.35rem 0 0.25rem;
    color: var(--reader-text);
}

/* ── CTA ── */

.gate-cta-primary[b-1gcl5t6y0l] {
    display: block;
    width: 100%;
    max-width: 260px;
    font-size: 0.92rem;
    padding: 0.45rem 1rem;
    margin-bottom: 0.35rem;
    text-align: center;
}

.gate-cta-row[b-1gcl5t6y0l] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 0.35rem;
}

/* ── Secondary links (login + back, inline) ── */

.gate-secondary-links[b-1gcl5t6y0l] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    flex-wrap: wrap;
    justify-content: center;
}

.gate-login-link[b-1gcl5t6y0l] {
    color: var(--reader-text-muted, #6c757d) !important;
    text-decoration: none !important;
}

.gate-login-link strong[b-1gcl5t6y0l] {
    color: var(--mn-gold, #b5984a);
    text-decoration: underline;
}

.gate-login-link:hover strong[b-1gcl5t6y0l] {
    color: var(--mn-gold-light, #d4b86a);
}

.gate-link-sep[b-1gcl5t6y0l] {
    color: var(--reader-text-muted, #6c757d);
    opacity: 0.5;
}

/* ── Chapter meta (logged-in) ── */

.gate-chapter-meta[b-1gcl5t6y0l] {
    font-size: 0.82rem;
    color: var(--reader-text-muted, #6c757d);
    margin: 0 0 0.35rem;
}

.gate-wordcount[b-1gcl5t6y0l] {
    opacity: 0.7;
}

/* ── Back link ── */

.gate-back-link[b-1gcl5t6y0l] {
    font-size: 0.75rem;
    color: var(--reader-text-muted, #6c757d) !important;
    text-decoration: none !important;
    opacity: 0.7;
}

.gate-back-link:hover[b-1gcl5t6y0l] {
    opacity: 1;
    text-decoration: underline !important;
}

/* ── Mobile ── */

@media (max-width: 576px) {
    .reader-gate[b-1gcl5t6y0l] {
        padding: 0 1rem 0.5rem;
    }

    .gate-card[b-1gcl5t6y0l] {
        padding: 0.5rem 0.75rem 0.4rem;
    }

    .gate-book-stripe img[b-1gcl5t6y0l] {
        height: 30px;
    }

    .gate-headline[b-1gcl5t6y0l] {
        font-size: 0.95rem;
    }

    .gate-cta-primary[b-1gcl5t6y0l] {
        max-width: 100%;
    }
}
/* /Components/Reader/ReaderHeader.razor.rz.scp.css */
.reader-header[b-etcy0us3bk] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: calc(var(--header-height, 50px) + env(safe-area-inset-top, 0px));
    padding-top: env(safe-area-inset-top, 0px);
    background: var(--reader-header-bg, rgba(255, 255, 255, 0.98));
    border-bottom: 1px solid var(--reader-border, #e0e0e0);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 8px;
    padding-right: 8px;
    z-index: 100;
    transition: transform 0.3s ease, opacity 0.3s ease;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.reader-header.hidden[b-etcy0us3bk] {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.reader-header.visible[b-etcy0us3bk] {
    transform: translateY(0);
    opacity: 1;
}

.header-left[b-etcy0us3bk],
.header-right[b-etcy0us3bk] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.header-center[b-etcy0us3bk] {
    flex: 1;
    min-width: 0;
    text-align: center;
    padding: 0 8px;
}

.header-btn[b-etcy0us3bk] {
    width: 40px;
    height: 40px;
    border: none;
    background: transparent;
    color: var(--reader-text, #1a1a1a);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.2s ease;
    font-size: 1.2rem;
}

.header-btn:hover[b-etcy0us3bk] {
    background: var(--reader-active-bg, rgba(0, 0, 0, 0.05));
}

.header-btn:active[b-etcy0us3bk] {
    background: var(--reader-active-bg, rgba(0, 0, 0, 0.1));
}

.book-info[b-etcy0us3bk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
}

.book-title[b-etcy0us3bk] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--reader-text, #1a1a1a);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.chapter-title[b-etcy0us3bk] {
    font-size: 0.75rem;
    color: var(--reader-text-muted, #666);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

@media (max-width: 480px) {
    .reader-header[b-etcy0us3bk] {
        padding-left: 4px;
        padding-right: 4px;
    }

    .header-btn[b-etcy0us3bk] {
        width: 36px;
        height: 36px;
        font-size: 1.1rem;
    }

    .book-title[b-etcy0us3bk] {
        font-size: 0.85rem;
    }

    .chapter-title[b-etcy0us3bk] {
        font-size: 0.7rem;
    }
}
/* /Components/Reader/ReaderNavigation.razor.rz.scp.css */
.reader-navigation[b-i1li04elc4] {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    z-index: 50;
    pointer-events: none;
    outline: none;
}

.nav-zone[b-i1li04elc4] {
    pointer-events: auto;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
}

.nav-prev[b-i1li04elc4] {
    width: 20%;
    justify-content: flex-start;
    padding-left: 8px;
}

.nav-center[b-i1li04elc4] {
    flex: 1;
}

.nav-next[b-i1li04elc4] {
    width: 20%;
    justify-content: flex-end;
    padding-right: 8px;
}

.nav-hint[b-i1li04elc4] {
    opacity: 0;
    transition: opacity 0.2s ease;
    background: var(--reader-overlay-bg, rgba(0, 0, 0, 0.3));
    color: white;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.nav-zone:hover .nav-hint[b-i1li04elc4] {
    opacity: 1;
}

.nav-zone:active .nav-hint[b-i1li04elc4] {
    opacity: 0.8;
    transform: scale(0.95);
}

/* Touch devices - don't show hint on hover */
@media (hover: none) {
    .nav-zone:hover .nav-hint[b-i1li04elc4] {
        opacity: 0;
    }

    .nav-zone:active .nav-hint[b-i1li04elc4] {
        opacity: 1;
    }
}

/* Wider tap zones on mobile */
@media (max-width: 768px) {
    .nav-prev[b-i1li04elc4] {
        width: 25%;
    }

    .nav-next[b-i1li04elc4] {
        width: 25%;
    }
}
/* /Components/Reader/ReaderSettingsPanel.razor.rz.scp.css */
.settings-overlay[b-utatlxdl0v] {
    position: fixed;
    inset: 0;
    background: var(--reader-overlay-bg, rgba(0, 0, 0, 0.5));
    z-index: 200;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.settings-overlay.visible[b-utatlxdl0v] {
    opacity: 1;
    visibility: visible;
}

.settings-panel[b-utatlxdl0v] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 340px;
    max-width: 90vw;
    background: var(--reader-card-bg, #ffffff);
    z-index: 201;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
}

.settings-panel.open[b-utatlxdl0v] {
    transform: translateX(0);
}

.settings-header[b-utatlxdl0v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--reader-border, #e0e0e0);
    flex-shrink: 0;
}

.settings-title[b-utatlxdl0v] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--reader-text, #1a1a1a);
}

.settings-close-btn[b-utatlxdl0v] {
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--reader-text, #1a1a1a);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.2s ease;
    font-size: 1.1rem;
}

.settings-close-btn:hover[b-utatlxdl0v] {
    background: var(--reader-active-bg, rgba(0, 0, 0, 0.05));
}

.settings-content[b-utatlxdl0v] {
    flex: 1;
    overflow-y: auto;
    padding: 16px 20px;
}

.setting-group[b-utatlxdl0v] {
    margin-bottom: 24px;
}

.setting-label[b-utatlxdl0v] {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--reader-text-muted, #666);
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Theme buttons */
.theme-buttons[b-utatlxdl0v] {
    display: flex;
    gap: 8px;
}

.theme-btn[b-utatlxdl0v] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 12px 8px;
    border: 2px solid var(--reader-border, #e0e0e0);
    border-radius: 8px;
    background: #ffffff;
    color: #1a1a1a;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.8rem;
}

.theme-btn.theme-sepia[b-utatlxdl0v] {
    background: #f4ecd8;
    color: #5b4636;
}

.theme-btn.theme-dark[b-utatlxdl0v] {
    background: #1a1a1a;
    color: #e0e0e0;
}

.theme-btn:hover[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
}

.theme-btn.active[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
    box-shadow: 0 0 0 2px rgba(0, 102, 204, 0.2);
}

.theme-btn i[b-utatlxdl0v] {
    font-size: 1.2rem;
}

/* Size buttons */
.size-buttons[b-utatlxdl0v] {
    display: flex;
    gap: 4px;
}

.size-btn[b-utatlxdl0v] {
    flex: 1;
    padding: 8px;
    border: 2px solid var(--reader-border, #e0e0e0);
    border-radius: 8px;
    background: var(--reader-bg, #ffffff);
    color: var(--reader-text, #1a1a1a);
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
}

.size-btn:hover[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
}

.size-btn.active[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
    background: var(--reader-active-bg, #e3f2fd);
}

/* Font buttons */
.font-buttons[b-utatlxdl0v] {
    display: flex;
    gap: 8px;
}

.font-btn[b-utatlxdl0v] {
    flex: 1;
    padding: 10px 8px;
    border: 2px solid var(--reader-border, #e0e0e0);
    border-radius: 8px;
    background: var(--reader-bg, #ffffff);
    color: var(--reader-text, #1a1a1a);
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.9rem;
}

.font-btn.font-serif[b-utatlxdl0v] {
    font-family: Georgia, 'Times New Roman', serif;
}

.font-btn.font-sans[b-utatlxdl0v] {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.font-btn.font-dyslexic[b-utatlxdl0v] {
    font-family: 'Comic Sans MS', sans-serif;
}

.font-btn:hover[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
}

.font-btn.active[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
    background: var(--reader-active-bg, #e3f2fd);
}

/* Spacing buttons */
.spacing-buttons[b-utatlxdl0v],
.margin-buttons[b-utatlxdl0v] {
    display: flex;
    gap: 8px;
}

.spacing-btn[b-utatlxdl0v],
.margin-btn[b-utatlxdl0v] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 10px 8px;
    border: 2px solid var(--reader-border, #e0e0e0);
    border-radius: 8px;
    background: var(--reader-bg, #ffffff);
    color: var(--reader-text, #1a1a1a);
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.8rem;
}

.spacing-btn i[b-utatlxdl0v] {
    font-size: 1rem;
}

.spacing-btn:hover[b-utatlxdl0v],
.margin-btn:hover[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
}

.spacing-btn.active[b-utatlxdl0v],
.margin-btn.active[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
    background: var(--reader-active-bg, #e3f2fd);
}

/* Toggle row (used for preference switches like "Show chapter transitions") */
.toggle-row[b-utatlxdl0v] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--reader-border, #e0e0e0);
    border-radius: 10px;
    background: var(--reader-bg, #ffffff);
    color: var(--reader-text, #1a1a1a);
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
    min-height: 56px;
}

.toggle-row:hover[b-utatlxdl0v] {
    border-color: var(--reader-link, #0066cc);
}

.toggle-row-text[b-utatlxdl0v] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.toggle-row-title[b-utatlxdl0v] {
    font-size: 0.95rem;
    line-height: 1.25;
    color: var(--reader-text, #1a1a1a);
}

.toggle-row-sub[b-utatlxdl0v] {
    font-size: 0.8rem;
    line-height: 1.3;
    color: var(--reader-text-muted, #666);
}

.toggle-switch[b-utatlxdl0v] {
    flex-shrink: 0;
    position: relative;
    width: 42px;
    height: 24px;
    border-radius: 999px;
    background: var(--reader-border, #d0d0d0);
    transition: background-color 0.2s ease;
}

.toggle-switch.on[b-utatlxdl0v] {
    background: var(--reader-link, #0066cc);
}

.toggle-switch-knob[b-utatlxdl0v] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s ease;
}

.toggle-switch.on .toggle-switch-knob[b-utatlxdl0v] {
    transform: translateX(18px);
}

@media (max-width: 480px) {
    .settings-panel[b-utatlxdl0v] {
        width: 100%;
        max-width: 100%;
    }

    .settings-header[b-utatlxdl0v] {
        padding: 12px 16px;
    }

    .settings-content[b-utatlxdl0v] {
        padding: 16px;
    }
}
/* /Components/Reader/SharePassage.razor.rz.scp.css */
.share-passage-popup[b-3v3twk5qt4] {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--reader-bg, #fff);
    border: 1px solid var(--reader-border, #e0e0e0);
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    padding: 12px 16px;
    max-width: 400px;
    width: 90%;
    z-index: 1000;
}

.share-passage-text[b-3v3twk5qt4] {
    font-style: italic;
    font-size: 0.85rem;
    color: var(--reader-text, #333);
    margin-bottom: 8px;
    line-height: 1.5;
    border-left: 3px solid #b5984a;
    padding-left: 8px;
}

.share-passage-actions[b-3v3twk5qt4] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}
/* /Components/Reader/TableOfContents.razor.rz.scp.css */
.toc-overlay[b-18v5yaqk96] {
    position: fixed;
    inset: 0;
    background: var(--reader-overlay-bg, rgba(0, 0, 0, 0.5));
    z-index: 200;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.toc-overlay.visible[b-18v5yaqk96] {
    opacity: 1;
    visibility: visible;
}

.toc-drawer[b-18v5yaqk96] {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 320px;
    max-width: 85vw;
    background: var(--reader-card-bg, #ffffff);
    z-index: 201;
    display: flex;
    flex-direction: column;
    transform: translateX(-100%);
    transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    box-shadow: 4px 0 20px rgba(0, 0, 0, 0.15);
}

.toc-drawer.open[b-18v5yaqk96] {
    transform: translateX(0);
}

.toc-header[b-18v5yaqk96] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--reader-border, #e0e0e0);
    flex-shrink: 0;
}

.toc-title[b-18v5yaqk96] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--reader-text, #1a1a1a);
}

.toc-close-btn[b-18v5yaqk96] {
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--reader-text, #1a1a1a);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.2s ease;
    font-size: 1.1rem;
}

.toc-close-btn:hover[b-18v5yaqk96] {
    background: var(--reader-active-bg, rgba(0, 0, 0, 0.05));
}

.toc-content[b-18v5yaqk96] {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
}

.toc-list[b-18v5yaqk96] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.toc-item[b-18v5yaqk96] {
    margin: 0;
}

.toc-link[b-18v5yaqk96] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    padding: 12px 20px;
    border: none;
    background: transparent;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.2s ease;
    color: var(--reader-text, #1a1a1a);
    font-size: 0.95rem;
}

.toc-link:hover:not(:disabled)[b-18v5yaqk96] {
    background: var(--reader-active-bg, rgba(0, 0, 0, 0.05));
}

.toc-item.active .toc-link[b-18v5yaqk96] {
    background: var(--reader-active-bg, #e3f2fd);
    font-weight: 500;
}

.toc-item.disabled .toc-link[b-18v5yaqk96] {
    color: var(--reader-text-muted, #999);
    cursor: not-allowed;
}

.chapter-number[b-18v5yaqk96] {
    flex-shrink: 0;
    width: 24px;
    color: var(--reader-text-muted, #666);
    font-size: 0.85rem;
}

.chapter-title-text[b-18v5yaqk96] {
    flex: 1;
    line-height: 1.4;
}

.chapter-badge[b-18v5yaqk96] {
    flex-shrink: 0;
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 500;
    text-transform: uppercase;
}

.chapter-badge.draft[b-18v5yaqk96] {
    background: var(--reader-border, #e0e0e0);
    color: var(--reader-text-muted, #666);
}

.chapter-badge.free[b-18v5yaqk96] {
    background: #d4edda;
    color: #155724;
}

.chapter-badge.warning[b-18v5yaqk96] {
    background: #fff3cd;
    color: #856404;
    padding: 2px 4px;
}

.chapter-badge.warning i[b-18v5yaqk96] {
    font-size: 0.75rem;
}

.chapter-badges[b-18v5yaqk96] {
    display: flex;
    gap: 4px;
    align-items: center;
    flex-shrink: 0;
}

.toc-empty[b-18v5yaqk96] {
    padding: 20px;
    text-align: center;
    color: var(--reader-text-muted, #666);
}

.toc-footer[b-18v5yaqk96] {
    padding: 16px 20px;
    border-top: 1px solid var(--reader-border, #e0e0e0);
    flex-shrink: 0;
}

.toc-book-link[b-18v5yaqk96] {
    display: flex;
    align-items: center;
    color: var(--reader-link, #0066cc);
    text-decoration: none;
    font-size: 0.9rem;
}

.toc-book-link:hover[b-18v5yaqk96] {
    text-decoration: underline;
}

/* Dark theme adjustments */
[data-theme="dark"] .chapter-badge.free[b-18v5yaqk96] {
    background: #1e4620;
    color: #a3d9a5;
}

[data-theme="dark"] .chapter-badge.warning[b-18v5yaqk96] {
    background: #4a3c00;
    color: #ffc107;
}

@media (max-width: 480px) {
    .toc-drawer[b-18v5yaqk96] {
        width: 100%;
        max-width: 100%;
    }

    .toc-header[b-18v5yaqk96] {
        padding: 12px 16px;
    }

    .toc-link[b-18v5yaqk96] {
        padding: 12px 16px;
    }

    .toc-footer[b-18v5yaqk96] {
        padding: 12px 16px;
    }
}
/* /Components/ScrollCarousel.razor.rz.scp.css */
.scroll-carousel-wrap[b-7srlabql6a] {
    position: relative;
}

.scroll-carousel[b-7srlabql6a] {
    display: flex;
    gap: var(--mn-space-4);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: var(--mn-space-2) 0;
}

.scroll-carousel[b-7srlabql6a]::-webkit-scrollbar {
    display: none;
}

.scroll-carousel[b-7srlabql6a] >  * {
    scroll-snap-align: start;
    flex-shrink: 0;
}

.scroll-carousel-arrow[b-7srlabql6a] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 40px;
    height: 40px;
    border-radius: var(--mn-radius-full);
    border: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface);
    color: var(--mn-text-primary);
    box-shadow: var(--mn-shadow-md);
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    transition: background var(--mn-transition-fast), box-shadow var(--mn-transition-fast);
}

.scroll-carousel-arrow:hover[b-7srlabql6a] {
    background: var(--mn-bg-surface-alt);
    box-shadow: var(--mn-shadow-lg);
}

.scroll-carousel-prev[b-7srlabql6a] {
    left: -16px;
}

.scroll-carousel-next[b-7srlabql6a] {
    right: -16px;
}

/* Only show arrows on devices with hover (desktop) */
@media (hover: hover) and (min-width: 768px) {
    .scroll-carousel-arrow[b-7srlabql6a] {
        display: flex;
    }
}
/* /Components/Search/SearchBar.razor.rz.scp.css */
/* === Search Bar Container === */
.search-bar-container[b-vvl90k9tk4] {
    position: relative;
    margin-bottom: var(--mn-space-3);
}

/* === Input Wrapper === */
.search-bar-input-wrap[b-vvl90k9tk4] {
    position: relative;
    display: flex;
    align-items: center;
}

.search-bar-icon[b-vvl90k9tk4] {
    position: absolute;
    left: var(--mn-space-3);
    color: var(--mn-text-tertiary);
    font-size: var(--mn-text-lg);
    pointer-events: none;
}

.search-bar-input[b-vvl90k9tk4] {
    width: 100%;
    padding: var(--mn-space-3) var(--mn-space-10) var(--mn-space-3) var(--mn-space-10);
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-base);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-full);
    background: var(--mn-bg-surface);
    color: var(--mn-text-primary);
    transition: border-color var(--mn-transition-fast),
                box-shadow var(--mn-transition-fast);
    min-height: 48px;
}

.search-bar-input:focus[b-vvl90k9tk4] {
    outline: none;
    border-color: var(--mn-gold);
    box-shadow: 0 0 0 0.2rem rgba(217, 137, 71, 0.25);
}

.search-bar-input[b-vvl90k9tk4]::placeholder {
    font-style: italic;
}

.search-bar-input[b-vvl90k9tk4]::placeholder {
    color: var(--mn-text-tertiary);
}

.search-bar-clear[b-vvl90k9tk4] {
    position: absolute;
    right: var(--mn-space-3);
    background: none;
    border: none;
    color: var(--mn-text-tertiary);
    cursor: pointer;
    padding: var(--mn-space-1);
    line-height: 1;
    border-radius: var(--mn-radius-full);
    transition: color var(--mn-transition-fast);
}

.search-bar-clear:hover[b-vvl90k9tk4] {
    color: var(--mn-text-primary);
}

/* === Autocomplete Dropdown === */
.search-autocomplete[b-vvl90k9tk4] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: var(--mn-space-1);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-md);
    z-index: var(--mn-z-dropdown);
    max-height: 400px;
    overflow-y: auto;
}

.search-ac-group[b-vvl90k9tk4] {
    padding: var(--mn-space-1) 0;
}

.search-ac-group + .search-ac-group[b-vvl90k9tk4] {
    border-top: 1px solid var(--mn-border-light);
}

.search-ac-group-label[b-vvl90k9tk4] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-xs);
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: var(--mn-space-1) var(--mn-space-3);
}

.search-ac-item[b-vvl90k9tk4] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
    width: 100%;
    padding: var(--mn-space-2) var(--mn-space-3);
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-sm);
    color: var(--mn-text-primary);
    transition: background-color var(--mn-transition-fast);
}

.search-ac-item:hover[b-vvl90k9tk4],
.search-ac-item--active[b-vvl90k9tk4] {
    background: var(--mn-bg-surface-alt);
}

/* Autocomplete subtitle badge uses .mn-meta-badge--ember--sm--pill global */

.search-ac-text[b-vvl90k9tk4] {
    font-weight: var(--mn-font-medium);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-ac-subtitle[b-vvl90k9tk4] {
    font-size: var(--mn-text-xs);
    color: var(--mn-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-ac-item-info[b-vvl90k9tk4] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.search-ac-thumb[b-vvl90k9tk4] {
    width: 32px;
    height: 44px;
    object-fit: cover;
    border-radius: var(--mn-radius-sm);
    flex-shrink: 0;
}

.search-ac-avatar[b-vvl90k9tk4] {
    width: 32px;
    height: 32px;
    object-fit: cover;
    border-radius: var(--mn-radius-full);
    flex-shrink: 0;
}
/* /Components/Series/NextInSeriesCta.razor.rz.scp.css */
/* Component-internal layout for the "Next in series" CTA stack. Composes the
   global .mn-section-eyebrow and .mn-series-accent-cta primitives — no
   typography defined here. */

.next-in-series[b-k9kkscacfl] {
    margin: var(--mn-space-4) 0 var(--mn-space-3);
}

.next-in-series__cta[b-k9kkscacfl] {
    padding: var(--mn-space-3) var(--mn-space-5);
    gap: var(--mn-space-2);
    font-size: 1rem;
    font-weight: var(--mn-font-semibold);
}

.next-in-series__label[b-k9kkscacfl] {
    font-style: italic;
    max-width: 32ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.next-in-series__meta[b-k9kkscacfl] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mn-text-primary);
    opacity: 0.72;
    border-left: 1px solid var(--mn-border-strong);
    padding-left: var(--mn-space-3);
    margin-left: var(--mn-space-2);
}

@media (max-width: 575.98px) {
    .next-in-series__cta[b-k9kkscacfl] {
        width: 100%;
        flex-wrap: wrap;
    }
    .next-in-series__label[b-k9kkscacfl] {
        max-width: 100%;
        white-space: normal;
    }
}
/* /Components/Series/SeriesBrowseCard.razor.rz.scp.css */
/* Series browse card — component-internal layout only. Composes the global
   .mn-series-card, .mn-series-accent-bar, .mn-meta-badge, .mn-tag primitives
   from app.css. Do not redefine those here. */

.series-browse-card[b-v7hglnyy4s] {
    padding-left: var(--mn-space-3);
}

.series-browse-card__banner[b-v7hglnyy4s] {
    width: 100%;
    aspect-ratio: 3 / 1;
    background-size: cover;
    background-position: center;
    background-color: var(--mn-bg-surface-alt);
}

.series-browse-card__body[b-v7hglnyy4s] {
    display: grid;
    grid-template-columns: 88px 1fr;
    gap: var(--mn-space-4);
    padding: var(--mn-space-4);
}

.series-browse-card__cover[b-v7hglnyy4s] {
    width: 88px;
    aspect-ratio: 2 / 3;
    border-radius: var(--mn-radius-sm);
    overflow: hidden;
    background: var(--mn-bg-surface-alt);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.series-browse-card__cover img[b-v7hglnyy4s] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.series-browse-card__cover-placeholder[b-v7hglnyy4s] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--mn-text-tertiary);
    font-size: 2rem;
}

.series-browse-card__details[b-v7hglnyy4s] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-2);
    min-width: 0;
}

.series-browse-card__title[b-v7hglnyy4s] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1.375rem;
    line-height: 1.15;
    color: var(--mn-text-primary);
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.series-browse-card__author[b-v7hglnyy4s] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.875rem;
    color: var(--mn-text-secondary);
}
.series-browse-card__author span[b-v7hglnyy4s] {
    color: var(--mn-gold-light);
}

.series-browse-card__badges[b-v7hglnyy4s] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-1);
    margin-top: var(--mn-space-1);
}

.series-browse-card__meta[b-v7hglnyy4s] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-3);
    font-size: 0.8125rem;
    color: var(--mn-text-tertiary);
}

.series-browse-card__heat[b-v7hglnyy4s] {
    color: var(--mn-rouge, var(--mn-danger));
    letter-spacing: 0.04em;
}

.series-browse-card__tags[b-v7hglnyy4s] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-1);
    margin-top: var(--mn-space-1);
}

@media (max-width: 575.98px) {
    .series-browse-card__body[b-v7hglnyy4s] {
        grid-template-columns: 64px 1fr;
        gap: var(--mn-space-3);
        padding: var(--mn-space-3);
    }
    .series-browse-card__cover[b-v7hglnyy4s] {
        width: 64px;
    }
    .series-browse-card__title[b-v7hglnyy4s] {
        font-size: 1.125rem;
    }
}
/* /Components/Shared/BottomSheet.razor.rz.scp.css */
/* === Backdrop === */
.bottom-sheet-backdrop[b-icgmsdii5p] {
    position: fixed;
    inset: 0;
    background: var(--mn-bg-overlay);
    z-index: var(--mn-z-drawer, 1035);
    animation: fadeIn-b-icgmsdii5p var(--mn-transition-fast) ease forwards;
}

/* === Sheet Panel === */
.bottom-sheet[b-icgmsdii5p] {
    position: fixed;
    z-index: calc(var(--mn-z-drawer, 1035) + 1);
    background: var(--mn-bg-surface);
    display: flex;
    flex-direction: column;
    max-height: 85vh;
    overflow: hidden;
    animation: slideUp-b-icgmsdii5p var(--mn-transition-base) ease forwards;

    /* Mobile: bottom sheet */
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: var(--mn-radius-2xl) var(--mn-radius-2xl) 0 0;
    box-shadow: var(--mn-shadow-xl);
}

/* Desktop: side panel */
@media (min-width: 768px) {
    .bottom-sheet[b-icgmsdii5p] {
        top: 0;
        bottom: 0;
        right: 0;
        left: auto;
        width: 400px;
        max-height: 100vh;
        border-radius: var(--mn-radius-2xl) 0 0 var(--mn-radius-2xl);
        animation: slideInRight-b-icgmsdii5p var(--mn-transition-base) ease forwards;
    }
}

/* === Handle (mobile only) === */
.bottom-sheet-handle[b-icgmsdii5p] {
    display: flex;
    justify-content: center;
    padding: var(--mn-space-2) 0;
    flex-shrink: 0;
}

.bottom-sheet-handle-bar[b-icgmsdii5p] {
    width: 36px;
    height: 4px;
    background: var(--mn-gray-300);
    border-radius: var(--mn-radius-full);
}

@media (min-width: 768px) {
    .bottom-sheet-handle[b-icgmsdii5p] {
        display: none;
    }
}

/* === Header === */
.bottom-sheet-header[b-icgmsdii5p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--mn-space-2) var(--mn-space-4) var(--mn-space-3);
    border-bottom: 1px solid var(--mn-border-light);
    flex-shrink: 0;
}

.bottom-sheet-title[b-icgmsdii5p] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-xl);
    font-weight: var(--mn-font-regular);
    color: var(--mn-text-primary);
    margin: 0;
    letter-spacing: -0.01em;
}

.bottom-sheet-close[b-icgmsdii5p] {
    background: none;
    border: none;
    color: var(--mn-text-tertiary);
    font-size: var(--mn-text-xl);
    cursor: pointer;
    padding: var(--mn-space-1);
    border-radius: var(--mn-radius-sm);
    line-height: 1;
    transition: color var(--mn-transition-fast);
}

.bottom-sheet-close:hover[b-icgmsdii5p] {
    color: var(--mn-text-primary);
}

/* === Body (scrollable) === */
.bottom-sheet-body[b-icgmsdii5p] {
    flex: 1;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    padding: var(--mn-space-3) var(--mn-space-4);
}

/* === Footer === */
.bottom-sheet-footer[b-icgmsdii5p] {
    padding: var(--mn-space-3) var(--mn-space-4);
    border-top: 1px solid var(--mn-border-light);
    flex-shrink: 0;
}

/* === Animations === */
@keyframes fadeIn-b-icgmsdii5p {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp-b-icgmsdii5p {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

@keyframes slideInRight-b-icgmsdii5p {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

/* === Inline mode (used as a persistent sidebar, no overlay) === */
.bottom-sheet--inline[b-icgmsdii5p] {
    position: static;
    width: 100%;
    max-height: none;
    height: auto;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    animation: none;
    overflow: visible;
}

.bottom-sheet--inline .bottom-sheet-header[b-icgmsdii5p] {
    padding: var(--mn-space-3) 0 var(--mn-space-2);
    border-bottom: 1px solid var(--mn-border-default);
}

.bottom-sheet--inline .bottom-sheet-title[b-icgmsdii5p] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--mn-gold);
    font-style: normal;
    font-weight: var(--mn-font-semibold);
}

.bottom-sheet--inline .bottom-sheet-body[b-icgmsdii5p] {
    padding: 0;
    overflow: visible;
    max-height: none;
}
/* /Components/Shared/PublishReadinessIndicator.razor.rz.scp.css */
/* =============================================
   PublishReadinessIndicator
   ============================================= */

.readiness-indicator[b-rum5yvpkvz] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* --- Badge with ring ---
   bootstrap-eradication (Rule D review): the `-badge` suffix triggers the rubric
   but .readiness-badge is a composite (pill + SVG progress ring + count text +
   completion-state machine). Not a reusable label primitive — keep page-scoped. */
.readiness-badge[b-rum5yvpkvz] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-1, 0.25rem);
    padding: 4px 10px 4px 4px;
    border-radius: var(--mn-radius-full, 9999px);
    background: var(--mn-bg-surface-alt, #f5f2ed);
    border: 1px solid var(--mn-border-default, #e8e4dd);
    cursor: pointer;
    transition: border-color var(--mn-transition-fast, 150ms ease),
                box-shadow var(--mn-transition-fast, 150ms ease);
    user-select: none;
}

.readiness-badge:hover[b-rum5yvpkvz] {
    border-color: var(--mn-gold, #b5984a);
    box-shadow: var(--mn-shadow-gold);
}

.readiness-badge.readiness-complete[b-rum5yvpkvz] {
    background: var(--mn-success-light, #d4edda);
    border-color: var(--mn-success, #2d7a4f);
}

.readiness-ring[b-rum5yvpkvz] {
    width: 28px;
    height: 28px;
    transform: rotate(-90deg);
    flex-shrink: 0;
}

.readiness-ring-bg[b-rum5yvpkvz] {
    fill: none;
    stroke: var(--mn-gray-200, #e8e4dd);
    stroke-width: 3;
}

.readiness-ring-fill[b-rum5yvpkvz] {
    fill: none;
    stroke: var(--mn-gold, #b5984a);
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray var(--mn-transition-base, 250ms ease);
}

.readiness-complete .readiness-ring-fill[b-rum5yvpkvz] {
    stroke: var(--mn-success, #2d7a4f);
}

.readiness-count[b-rum5yvpkvz] {
    font-family: var(--mn-font-system, system-ui, sans-serif);
    font-size: var(--mn-text-sm, 0.875rem);
    font-weight: var(--mn-font-semibold, 600);
    color: var(--mn-text-primary, #1f1b16);
    line-height: 1;
}

/* --- Backdrop (click-away) --- */
.readiness-backdrop[b-rum5yvpkvz] {
    position: fixed;
    inset: 0;
    z-index: var(--mn-z-dropdown, 1000);
}

/* --- Checklist popover --- */
.readiness-checklist[b-rum5yvpkvz] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: calc(var(--mn-z-dropdown, 1000) + 1);
    width: 300px;
    background: var(--mn-bg-surface, #ffffff);
    border: 1px solid var(--mn-border-default, #e8e4dd);
    border-radius: var(--mn-radius-lg, 0.5rem);
    box-shadow: var(--mn-shadow-lg);
    overflow: hidden;
    animation: readinessSlideIn-b-rum5yvpkvz var(--mn-transition-fast, 150ms ease) forwards;
}

.readiness-checklist-header[b-rum5yvpkvz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--mn-space-3, 0.75rem) var(--mn-space-4, 1rem);
    border-bottom: 1px solid var(--mn-border-light, #f0ece5);
    font-family: var(--mn-font-system, system-ui, sans-serif);
    font-size: var(--mn-text-sm, 0.875rem);
}

.readiness-checklist-body[b-rum5yvpkvz] {
    padding: var(--mn-space-2, 0.5rem) 0;
    max-height: 320px;
    overflow-y: auto;
}

.readiness-item[b-rum5yvpkvz] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: var(--mn-space-2, 0.5rem) var(--mn-space-4, 1rem);
    border: none;
    background: none;
    font-family: var(--mn-font-system, system-ui, sans-serif);
    font-size: var(--mn-text-sm, 0.875rem);
    color: var(--mn-text-primary, #1f1b16);
    text-align: left;
    cursor: pointer;
    transition: background var(--mn-transition-fast, 150ms ease);
}

.readiness-item:hover[b-rum5yvpkvz] {
    background: var(--mn-bg-surface-alt, #f5f2ed);
}

.readiness-item.complete[b-rum5yvpkvz] {
    color: var(--mn-text-tertiary, #918a7e);
    cursor: default;
}

.readiness-item.complete:hover[b-rum5yvpkvz] {
    background: none;
}

.readiness-item.complete i.bi-check-circle-fill[b-rum5yvpkvz] {
    color: var(--mn-success, #2d7a4f);
}

.readiness-item.incomplete i.bi-circle[b-rum5yvpkvz] {
    color: var(--mn-gray-400, #b8b2a6);
}

.readiness-item.incomplete i.bi-chevron-right[b-rum5yvpkvz] {
    color: var(--mn-text-tertiary, #918a7e);
    font-size: 0.75rem;
}

@keyframes readinessSlideIn-b-rum5yvpkvz {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- Mobile: full-width bottom-aligned popover --- */
@media (max-width: 575.98px) {
    .readiness-checklist[b-rum5yvpkvz] {
        position: fixed;
        top: auto;
        bottom: 72px; /* Above mobile tab bar */
        left: var(--mn-space-3, 0.75rem);
        right: var(--mn-space-3, 0.75rem);
        width: auto;
    }
}

.btn-close-sm[b-rum5yvpkvz] {
    width: 0.75rem;
    height: 0.75rem;
    padding: 0.25rem;
}
/* /Components/Shared/ResponsiveTabs.razor.rz.scp.css */
/* =============================================
   ResponsiveTabs
   Desktop: standard Bootstrap nav-tabs (top)
   Mobile:  fixed bottom tab bar
   ============================================= */

/* --- Desktop tabs: hide on mobile --- */
.responsive-tabs-desktop[b-y3vzvl7x1o] {
    display: flex;
}

/* --- Mobile bottom bar: hide on desktop --- */
.responsive-tabs-mobile[b-y3vzvl7x1o] {
    display: none;
}

.responsive-tabs-mobile-spacer[b-y3vzvl7x1o] {
    display: none;
}

/* --- Mobile breakpoint (<768px) --- */
@media (max-width: 767.98px) {
    .responsive-tabs-desktop[b-y3vzvl7x1o] {
        display: none !important;
    }

    .responsive-tabs-mobile[b-y3vzvl7x1o] {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: var(--mn-z-fixed, 1030);
        background: var(--mn-bg-surface, #ffffff);
        border-top: 1px solid var(--mn-border-default, #e8e4dd);
        box-shadow: 0 -4px 12px rgba(31, 27, 22, 0.08);
        padding: var(--mn-space-1, 0.25rem) 0;
        padding-bottom: calc(var(--mn-space-1, 0.25rem) + env(safe-area-inset-bottom, 0px));
        justify-content: space-around;
        align-items: center;
        gap: 0;
    }

    .responsive-tabs-mobile-spacer[b-y3vzvl7x1o] {
        display: block;
        height: calc(64px + env(safe-area-inset-bottom, 0px));
        flex-shrink: 0;
    }

    .responsive-tabs-mobile-item[b-y3vzvl7x1o] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        flex: 1;
        padding: var(--mn-space-1, 0.25rem) var(--mn-space-1, 0.25rem);
        border: none;
        background: none;
        color: var(--mn-text-tertiary, #918a7e);
        cursor: pointer;
        transition: color var(--mn-transition-fast, 150ms ease);
        -webkit-tap-highlight-color: transparent;
        min-width: 0;
    }

    .responsive-tabs-mobile-item:hover[b-y3vzvl7x1o] {
        color: var(--mn-text-secondary, #6d665c);
    }

    .responsive-tabs-mobile-item.active[b-y3vzvl7x1o] {
        color: var(--mn-gold, #b5984a);
    }

    .responsive-tabs-mobile-icon-wrap[b-y3vzvl7x1o] {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.25rem;
        line-height: 1;
    }

    .responsive-tabs-mobile-badge[b-y3vzvl7x1o] {
        position: absolute;
        top: -6px;
        right: -10px;
        font-size: 0.625rem;
        font-family: var(--mn-font-system, system-ui, sans-serif);
        font-weight: var(--mn-font-bold, 700);
        background: var(--mn-gold, #b5984a);
        color: white;
        border-radius: var(--mn-radius-full, 9999px);
        min-width: 16px;
        height: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 4px;
        line-height: 1;
    }

    .responsive-tabs-mobile-label[b-y3vzvl7x1o] {
        font-family: var(--mn-font-system, system-ui, sans-serif);
        font-size: var(--mn-text-xs, 0.75rem);
        font-weight: var(--mn-font-medium, 500);
        line-height: 1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }
}
/* /Components/TopicBookRail.razor.rz.scp.css */
/* Aisle-page book-rail cards. Mirrors home-carousel-card sizing so the rails
   on /aisle/{slug} match the home aesthetic. Scoped here (not in AisleLanding.razor.css)
   because the BookCard render lives two component boundaries away from the page
   — a single ::deep from this file is enough; two hops from the page CSS isn't. */

[b-hf7u1h0g1b] .topic-rail-card {
    width: 150px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (min-width: 576px) {
    [b-hf7u1h0g1b] .topic-rail-card {
        width: 170px;
    }
}

[b-hf7u1h0g1b] .topic-rail-card .book-card-cover {
    border-radius: var(--mn-radius-md);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.30);
    transition: transform var(--mn-transition-fast), box-shadow var(--mn-transition-fast);
}

[b-hf7u1h0g1b] .topic-rail-card:hover .book-card-cover {
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* =============================================
   MainLayout — Top-nav layout (no sidebar)
   ============================================= */

.main-content[b-nk1l1dbai0] {
    padding-top: var(--mn-header-height);
    min-height: 100vh;
}

.content[b-nk1l1dbai0] {
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
    padding: var(--mn-space-6) var(--mn-space-4);
}

@media (min-width: 768px) {
    .content[b-nk1l1dbai0] {
        padding: var(--mn-space-8) var(--mn-space-6);
    }
}

/* Site Footer — explicit light text on navy bg (stays constant across theme flips) */
.site-footer[b-nk1l1dbai0] {
    background-color: var(--mn-header-bg);
    color: #ffffff;
    margin-top: var(--mn-space-8);
    border-top: 2px solid var(--mn-gold);
}

.footer-main[b-nk1l1dbai0] {
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-8);
    padding: var(--mn-space-10) var(--mn-space-4) var(--mn-space-8);
}

@media (min-width: 768px) {
    .footer-main[b-nk1l1dbai0] {
        grid-template-columns: 2fr 1fr 1fr 1fr;
        padding: var(--mn-space-12) var(--mn-space-6) var(--mn-space-8);
    }
}

.footer-brand-name[b-nk1l1dbai0] {
    display: block;
    font-family: var(--mn-font-accent);
    font-size: var(--mn-text-3xl);
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-2);
}

.footer-tagline[b-nk1l1dbai0] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-sm);
    color: rgba(255, 255, 255, 0.75);
    line-height: var(--mn-leading-relaxed);
    margin: 0 0 var(--mn-space-4);
}

.footer-social[b-nk1l1dbai0] {
    display: flex;
    gap: var(--mn-space-3);
    align-items: center;
}

.footer-social a[b-nk1l1dbai0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--mn-radius-full);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: #ffffff;
    font-size: var(--mn-text-lg);
    text-decoration: none;
    transition: color var(--mn-transition-fast),
                background-color var(--mn-transition-fast),
                border-color var(--mn-transition-fast);
}

.footer-social a:hover[b-nk1l1dbai0] {
    color: var(--mn-gold-light);
    border-color: var(--mn-gold);
    background-color: rgba(181, 152, 74, 0.12);
}

.footer-heading[b-nk1l1dbai0] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-xs);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin: 0 0 var(--mn-space-4);
}

.footer-links-col nav[b-nk1l1dbai0] {
    display: flex;
    flex-direction: column;
}

.footer-links-col nav a[b-nk1l1dbai0] {
    display: block;
    color: rgba(255, 255, 255, 0.75);
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-system);
    text-decoration: none;
    padding: var(--mn-space-1) 0;
    transition: color var(--mn-transition-fast);
}

.footer-links-col nav a:hover[b-nk1l1dbai0] {
    color: var(--mn-gold-light);
}

/* Tail "View all →" link below a footer column's enumerated links —
   reads as a CTA, not just another column entry. Used for /aisles. */
.footer-links-col nav a.footer-link-view-all[b-nk1l1dbai0] {
    color: var(--mn-gold);
    font-style: italic;
    margin-top: var(--mn-space-2);
}

.footer-links-col nav a.footer-link-view-all:hover[b-nk1l1dbai0] {
    color: var(--mn-gold-light);
    text-decoration: underline;
}

.footer-bottom[b-nk1l1dbai0] {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
    padding: var(--mn-space-4);
    padding-bottom: max(var(--mn-space-4), env(safe-area-inset-bottom, 0px));
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--mn-space-3);
}

@media (max-width: 767.98px) {
    .footer-bottom[b-nk1l1dbai0] {
        flex-direction: column;
        text-align: center;
    }
}

.footer-copyright[b-nk1l1dbai0] {
    font-size: var(--mn-text-xs);
    color: rgba(255, 255, 255, 0.55);
    font-family: var(--mn-font-system);
}

/* bootstrap-eradication (Rule D review): the `-badge` suffix triggers the rubric
   but .rta-badge is a one-off footer link wrapper for the RTA seal image — not a
   chrome primitive that wants reuse. Keep page-scoped. */
.rta-badge[b-nk1l1dbai0] {
    display: inline-flex;
    align-items: center;
}

.rta-badge img[b-nk1l1dbai0] {
    height: 24px;
    width: auto;
    opacity: 0.7;
    transition: opacity var(--mn-transition-fast);
}

.rta-badge:hover img[b-nk1l1dbai0] {
    opacity: 1;
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* =============================================
   NavMenu — Sticky Top Navigation
   Uses Midnette design tokens (--mn-*)
   ============================================= */

/* --- Header Shell — Backroom (ink bg, ember hairline, no navy rectangle) --- */
.site-header[b-eoxz9scgyd] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--mn-header-height);
    background-color: var(--mn-bg-body);
    border-bottom: 1px solid var(--mn-border-default);
    z-index: var(--mn-z-fixed);
    transition: height var(--mn-transition-base),
                background-color var(--mn-transition-base),
                border-color var(--mn-transition-base);
}

.site-header.scrolled[b-eoxz9scgyd] {
    height: var(--mn-header-height-compact);
    background-color: rgba(11, 10, 20, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom-color: rgba(217, 137, 71, 0.25);
}

.header-inner[b-eoxz9scgyd] {
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--mn-space-6);
    gap: var(--mn-space-4);
}

/* --- Brand (Logo + Text) --- */
.site-brand[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    text-decoration: none;
    flex-shrink: 0;
}

.brand-logo[b-eoxz9scgyd] {
    height: 36px;
    width: auto;
    transition: height var(--mn-transition-base);
}

.scrolled .brand-logo[b-eoxz9scgyd] {
    height: 28px;
}

/* --- Desktop Nav Links --- */
.nav-links[b-eoxz9scgyd] {
    display: none;
    align-items: center;
    gap: var(--mn-space-1);
    margin-left: var(--mn-space-8);
    flex: 1;
}

[b-eoxz9scgyd] .nav-link-item {
    color: var(--mn-text-primary);
    text-decoration: none;
    padding: var(--mn-space-2) var(--mn-space-3);
    border-radius: var(--mn-radius-md);
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-medium);
    letter-spacing: 0.01em;
    opacity: 0.85;
    transition: color var(--mn-transition-fast),
                background-color var(--mn-transition-fast),
                opacity var(--mn-transition-fast);
    white-space: nowrap;
}

[b-eoxz9scgyd] .nav-link-item:hover {
    color: var(--mn-gold);
    opacity: 1;
    background-color: rgba(217, 137, 71, 0.06);
}

[b-eoxz9scgyd] .nav-link-item.active {
    color: var(--mn-gold);
    opacity: 1;
    background-color: rgba(217, 137, 71, 0.10);
}

/* --- Nav Search (desktop inline) --- */
.nav-search[b-eoxz9scgyd] {
    display: none;
    align-items: center;
    position: relative;
    flex: 0 1 280px;
    min-width: 0;
}

.nav-search-icon[b-eoxz9scgyd] {
    position: absolute;
    left: var(--mn-space-3);
    color: var(--mn-gold);
    font-size: var(--mn-text-sm);
    pointer-events: none;
}

.nav-search-input[b-eoxz9scgyd] {
    width: 100%;
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-full);
    padding: var(--mn-space-2) var(--mn-space-3) var(--mn-space-2) var(--mn-space-8);
    color: var(--mn-text-primary);
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-body);
    transition: background-color var(--mn-transition-fast),
                border-color var(--mn-transition-fast),
                box-shadow var(--mn-transition-fast);
}

.nav-search-input[b-eoxz9scgyd]::placeholder {
    color: var(--mn-text-tertiary);
    font-style: italic;
}

.nav-search-input:focus[b-eoxz9scgyd] {
    outline: none;
    background: var(--mn-bg-surface-alt);
    border-color: var(--mn-gold);
    box-shadow: 0 0 0 2px rgba(217, 137, 71, 0.25);
}

/* --- Mobile Search Toggle --- */
.mobile-search-toggle[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    color: var(--mn-text-primary);
    font-size: 1.1rem;
    cursor: pointer;
    border-radius: var(--mn-radius-md);
    transition: background-color var(--mn-transition-fast),
                color var(--mn-transition-fast);
}

.mobile-search-toggle:hover[b-eoxz9scgyd] {
    background-color: rgba(217, 137, 71, 0.08);
    color: var(--mn-gold);
}

/* --- Mobile Search Bar (dropdown below header) --- */
.mobile-search-bar[b-eoxz9scgyd] {
    position: fixed;
    top: var(--mn-header-height);
    left: 0;
    right: 0;
    z-index: calc(var(--mn-z-fixed) - 1);
    background: var(--mn-bg-surface);
    border-bottom: 1px solid var(--mn-border-default);
    padding: var(--mn-space-3) var(--mn-space-4);
    box-shadow: var(--mn-shadow-md);
    animation: searchSlideDown-b-eoxz9scgyd 150ms ease;
}

.scrolled ~ .mobile-search-bar[b-eoxz9scgyd] {
    top: var(--mn-header-height-compact);
}

@keyframes searchSlideDown-b-eoxz9scgyd {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.mobile-search-form[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    position: relative;
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
}

.mobile-search-form-icon[b-eoxz9scgyd] {
    position: absolute;
    left: var(--mn-space-3);
    color: var(--mn-gold);
    pointer-events: none;
}

.mobile-search-input[b-eoxz9scgyd] {
    flex: 1;
    background: var(--mn-bg-surface-alt);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-full);
    padding: var(--mn-space-3) var(--mn-space-10) var(--mn-space-3) var(--mn-space-8);
    color: var(--mn-text-primary);
    font-size: var(--mn-text-base);
    font-family: var(--mn-font-body);
}

.mobile-search-input[b-eoxz9scgyd]::placeholder {
    color: var(--mn-text-tertiary);
    font-style: italic;
}

.mobile-search-input:focus[b-eoxz9scgyd] {
    outline: none;
    border-color: var(--mn-gold);
    background: var(--mn-bg-surface);
}

.mobile-search-close[b-eoxz9scgyd] {
    position: absolute;
    right: var(--mn-space-2);
    background: none;
    border: none;
    color: var(--mn-text-tertiary);
    padding: var(--mn-space-2);
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    border-radius: var(--mn-radius-full);
    transition: color var(--mn-transition-fast);
}

.mobile-search-close:hover[b-eoxz9scgyd] {
    color: var(--mn-gold);
}

/* --- Right-Side Actions --- */
.nav-actions[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
    flex-shrink: 0;
}

/* Auth links (Login / Register) for unauthenticated */
[b-eoxz9scgyd] .nav-auth-link {
    color: var(--mn-text-primary);
    text-decoration: none;
    padding: var(--mn-space-2) var(--mn-space-3);
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-medium);
    opacity: 0.85;
    transition: color var(--mn-transition-fast),
                opacity var(--mn-transition-fast);
    display: none;
}

[b-eoxz9scgyd] .nav-auth-link:hover {
    color: var(--mn-gold);
    opacity: 1;
}

[b-eoxz9scgyd] .nav-register-btn {
    display: none;
    font-family: var(--mn-font-system);
}

/* --- Dropdown Component --- */
.nav-dropdown[b-eoxz9scgyd] {
    position: relative;
    display: none;
}

.nav-dropdown-trigger[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
    background: none;
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
    padding: var(--mn-space-1) var(--mn-space-3);
    color: var(--mn-text-primary);
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-body);
    cursor: pointer;
    transition: border-color var(--mn-transition-fast),
                background-color var(--mn-transition-fast),
                color var(--mn-transition-fast);
    white-space: nowrap;
}

.nav-dropdown-trigger:hover[b-eoxz9scgyd] {
    border-color: var(--mn-border-strong);
    background-color: rgba(217, 137, 71, 0.06);
    color: var(--mn-gold);
}

.dropdown-label[b-eoxz9scgyd] {
    font-weight: var(--mn-font-medium);
}

.dropdown-caret[b-eoxz9scgyd] {
    font-size: 0.65rem;
    opacity: 0.7;
    transition: transform var(--mn-transition-fast);
}

/* --- Dropdown Menu --- */
.nav-dropdown-menu[b-eoxz9scgyd] {
    position: absolute;
    top: calc(100% + var(--mn-space-2));
    right: 0;
    min-width: 200px;
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-lg);
    padding: var(--mn-space-2) 0;
    z-index: var(--mn-z-dropdown);
    animation: dropdownFadeIn-b-eoxz9scgyd 150ms ease;
}

@keyframes dropdownFadeIn-b-eoxz9scgyd {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.nav-dropdown-menu[b-eoxz9scgyd]  .dropdown-item {
    display: flex;
    align-items: center;
    padding: var(--mn-space-2) var(--mn-space-4);
    color: var(--mn-text-primary);
    text-decoration: none;
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-system);
    transition: background-color var(--mn-transition-fast),
                color var(--mn-transition-fast);
    border: none;
    background: none;
    width: 100%;
    cursor: pointer;
    text-align: left;
}

.nav-dropdown-menu[b-eoxz9scgyd]  .dropdown-item:hover {
    background-color: rgba(217, 137, 71, 0.08);
    color: var(--mn-gold);
}

.nav-dropdown-menu[b-eoxz9scgyd]  .dropdown-divider {
    margin: var(--mn-space-2) 0;
    border-top: 1px solid var(--mn-border-light);
}

/* --- Mobile Hamburger (pure CSS, no font dependency) --- */
.mobile-toggle[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    cursor: pointer;
    border-radius: var(--mn-radius-md);
    transition: background-color var(--mn-transition-fast);
}

.mobile-toggle:hover[b-eoxz9scgyd] {
    background-color: rgba(217, 137, 71, 0.08);
}

.hamburger-icon[b-eoxz9scgyd] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 22px;
    height: 22px;
}

.hamburger-icon > span[b-eoxz9scgyd] {
    display: block;
    height: 2px;
    width: 100%;
    background-color: var(--mn-header-accent);
    border-radius: 1px;
    transition: transform 250ms ease, opacity 250ms ease;
    transform-origin: center;
}

/* X transform when menu is open */
.hamburger-icon.is-open > span:nth-child(1)[b-eoxz9scgyd] {
    transform: translateY(7px) rotate(45deg);
}

.hamburger-icon.is-open > span:nth-child(2)[b-eoxz9scgyd] {
    opacity: 0;
}

.hamburger-icon.is-open > span:nth-child(3)[b-eoxz9scgyd] {
    transform: translateY(-7px) rotate(-45deg);
}

/* --- Mobile Full-Screen Overlay — Backroom ink with ember vignette --- */
.mobile-overlay[b-eoxz9scgyd] {
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at 0% 0%, rgba(217, 137, 71, 0.05) 0%, transparent 40%),
        linear-gradient(180deg, var(--mn-bg-body) 0%, var(--mn-bg-surface) 100%);
    z-index: calc(var(--mn-z-fixed) + 10);
    display: flex;
    align-items: stretch;
    animation: overlaySlideIn-b-eoxz9scgyd 280ms cubic-bezier(0.22, 0.61, 0.36, 1);
}

@keyframes overlaySlideIn-b-eoxz9scgyd {
    from { opacity: 0; transform: translateX(40px); }
    to   { opacity: 1; transform: translateX(0); }
}

.mobile-nav[b-eoxz9scgyd] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    padding: 0 var(--mn-space-6) var(--mn-space-4);
    overflow-y: auto;
    max-height: 100vh;
    max-height: 100dvh;
}

/* Header: brand + close */
.mobile-nav-header[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--mn-space-4) 0;
    margin-bottom: var(--mn-space-2);
    border-bottom: 1px solid var(--mn-border-default);
    flex-shrink: 0;
}

.mobile-nav-logo[b-eoxz9scgyd] {
    height: 28px;
    width: auto;
    opacity: 0.95;
}

.mobile-nav-close[b-eoxz9scgyd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-full);
    color: var(--mn-text-secondary);
    font-size: 0.9rem;
    cursor: pointer;
    transition: background-color var(--mn-transition-fast),
                border-color var(--mn-transition-fast),
                color var(--mn-transition-fast);
}

.mobile-nav-close:hover[b-eoxz9scgyd] {
    background: var(--mn-bg-surface-alt);
    border-color: var(--mn-gold);
    color: var(--mn-gold);
}

/* Section labels */
.mobile-section-label[b-eoxz9scgyd] {
    font-size: 0.625rem;
    font-family: var(--mn-font-mono);
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--mn-gold);
    padding: var(--mn-space-3) var(--mn-space-3) var(--mn-space-1);
    flex-shrink: 0;
}

/* Nav links */
[b-eoxz9scgyd] .mobile-nav-link {
    color: var(--mn-text-primary);
    text-decoration: none;
    font-size: var(--mn-text-base);
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-medium);
    padding: 0.5rem var(--mn-space-3);
    border-radius: var(--mn-radius-md);
    opacity: 0.85;
    transition: color var(--mn-transition-fast),
                background-color var(--mn-transition-fast),
                opacity var(--mn-transition-fast),
                transform var(--mn-transition-fast);
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    flex-shrink: 0;
    animation: linkStagger-b-eoxz9scgyd 350ms cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

[b-eoxz9scgyd] .mobile-nav-link i {
    width: 1.25em;
    text-align: center;
    font-size: 1.05em;
    color: var(--mn-gold);
    opacity: 0.7;
    flex-shrink: 0;
}

[b-eoxz9scgyd] .mobile-nav-link:hover {
    color: var(--mn-gold);
    opacity: 1;
    background-color: rgba(217, 137, 71, 0.08);
    transform: translateX(4px);
}

[b-eoxz9scgyd] .mobile-nav-link:active {
    background-color: rgba(217, 137, 71, 0.15);
}

/* CTA links (Login/Register) */
[b-eoxz9scgyd] .mobile-nav-cta {
    color: var(--mn-gold-light);
    opacity: 1;
}

/* Accent variant — used for "All aisles →" so the see-all row reads as a
   CTA distinct from the individual aisle links above it. */
[b-eoxz9scgyd] .mobile-nav-link--accent {
    color: var(--mn-gold);
    opacity: 1;
    font-style: italic;
    border-left: 2px solid var(--mn-gold);
    margin-left: var(--mn-space-1);
    padding-left: calc(var(--mn-space-3) - 2px);
}

[b-eoxz9scgyd] .mobile-nav-link--accent i {
    opacity: 1;
}

@keyframes linkStagger-b-eoxz9scgyd {
    from { opacity: 0; transform: translateX(16px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Stagger delays for each link — applies to direct children */
.mobile-nav > :nth-child(2)[b-eoxz9scgyd]  { animation-delay: 30ms; }
.mobile-nav > :nth-child(3)[b-eoxz9scgyd]  { animation-delay: 55ms; }
.mobile-nav > :nth-child(4)[b-eoxz9scgyd]  { animation-delay: 80ms; }
.mobile-nav > :nth-child(5)[b-eoxz9scgyd]  { animation-delay: 105ms; }
.mobile-nav > :nth-child(6)[b-eoxz9scgyd]  { animation-delay: 125ms; }
.mobile-nav > :nth-child(7)[b-eoxz9scgyd]  { animation-delay: 145ms; }
.mobile-nav > :nth-child(8)[b-eoxz9scgyd]  { animation-delay: 165ms; }
.mobile-nav > :nth-child(9)[b-eoxz9scgyd]  { animation-delay: 185ms; }
.mobile-nav > :nth-child(10)[b-eoxz9scgyd] { animation-delay: 200ms; }
.mobile-nav > :nth-child(11)[b-eoxz9scgyd] { animation-delay: 215ms; }
.mobile-nav > :nth-child(12)[b-eoxz9scgyd] { animation-delay: 230ms; }
.mobile-nav > :nth-child(13)[b-eoxz9scgyd] { animation-delay: 245ms; }
.mobile-nav > :nth-child(14)[b-eoxz9scgyd] { animation-delay: 255ms; }
.mobile-nav > :nth-child(15)[b-eoxz9scgyd] { animation-delay: 265ms; }
.mobile-nav > :nth-child(16)[b-eoxz9scgyd] { animation-delay: 275ms; }
.mobile-nav > :nth-child(17)[b-eoxz9scgyd] { animation-delay: 285ms; }
.mobile-nav > :nth-child(18)[b-eoxz9scgyd] { animation-delay: 295ms; }
.mobile-nav > :nth-child(19)[b-eoxz9scgyd] { animation-delay: 305ms; }
.mobile-nav > :nth-child(20)[b-eoxz9scgyd] { animation-delay: 315ms; }
.mobile-nav > :nth-child(n+21)[b-eoxz9scgyd] { animation-delay: 320ms; }

/* Spacer pushes footer items down */
.mobile-nav-spacer[b-eoxz9scgyd] {
    flex: 1;
    min-height: var(--mn-space-2);
}

.mobile-logout[b-eoxz9scgyd] {
    background: none;
    border: none;
    cursor: pointer;
    font: inherit;
    opacity: 0.7;
}

.mobile-logout:hover[b-eoxz9scgyd] {
    opacity: 1;
}

.mobile-version[b-eoxz9scgyd] {
    margin-top: var(--mn-space-2);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    font-size: var(--mn-text-xs, 0.75rem);
    font-family: var(--mn-font-mono);
    color: var(--mn-text-tertiary);
    letter-spacing: 0.1em;
    flex-shrink: 0;
    text-align: center;
}

/* Extra-compact on short screens (iPhone SE, etc.) */
@media (max-height: 700px) {
    .mobile-nav-header[b-eoxz9scgyd] {
        padding: var(--mn-space-2) 0;
        margin-bottom: var(--mn-space-1);
    }

    .mobile-section-label[b-eoxz9scgyd] {
        padding: var(--mn-space-2) var(--mn-space-3) 0;
        font-size: 0.6rem;
    }

    [b-eoxz9scgyd] .mobile-nav-link {
        font-size: var(--mn-text-sm);
        padding: 0.3rem var(--mn-space-3);
        gap: var(--mn-space-2);
    }

    .mobile-nav-spacer[b-eoxz9scgyd] {
        min-height: var(--mn-space-1);
    }
}

/* =============================================
   RESPONSIVE BREAKPOINTS
   ============================================= */

/* Desktop and up: show desktop nav (992px = Bootstrap lg) */
@media (min-width: 992px) {
    .nav-links[b-eoxz9scgyd] {
        display: flex;
    }

    .nav-search[b-eoxz9scgyd] {
        display: flex;
    }

    .mobile-search-toggle[b-eoxz9scgyd] {
        display: none;
    }

    .nav-dropdown[b-eoxz9scgyd] {
        display: block;
    }

    [b-eoxz9scgyd] .nav-auth-link {
        display: block;
    }

    [b-eoxz9scgyd] .nav-register-btn {
        display: inline-block;
    }

    .mobile-toggle[b-eoxz9scgyd] {
        display: none;
    }
}
/* /Layout/ReaderLayout.razor.rz.scp.css */
.reader-layout[b-ol9ch1794o] {
    position: fixed;
    inset: 0;
    overflow: hidden;
    background: var(--reader-bg);
    color: var(--reader-text);
    font-family: var(--reader-font-family);
    font-size: var(--reader-font-size);
    line-height: var(--reader-line-height);
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Theme Variables */
.reader-layout[data-theme="light"][b-ol9ch1794o] {
    --reader-bg: #ffffff;
    --reader-text: #1a1a1a;
    --reader-text-muted: #6c757d;
    --reader-link: #0066cc;
    --reader-header-bg: rgba(255, 255, 255, 0.98);
    --reader-border: #e0e0e0;
    --reader-overlay-bg: rgba(0, 0, 0, 0.5);
    --reader-card-bg: #ffffff;
    --reader-active-bg: #e3f2fd;
}

.reader-layout[data-theme="sepia"][b-ol9ch1794o] {
    --reader-bg: #f4ecd8;
    --reader-text: #5b4636;
    --reader-text-muted: #8b7355;
    --reader-link: #8b4513;
    --reader-header-bg: rgba(244, 236, 216, 0.98);
    --reader-border: #d4c4a8;
    --reader-overlay-bg: rgba(0, 0, 0, 0.5);
    --reader-card-bg: #f4ecd8;
    --reader-active-bg: #e8dcc4;
}

.reader-layout[data-theme="dark"][b-ol9ch1794o] {
    --reader-bg: #1a1a1a;
    --reader-text: #e0e0e0;
    --reader-text-muted: #b8b8b8;
    --reader-link: #6699ff;
    --reader-header-bg: rgba(26, 26, 26, 0.98);
    --reader-border: #333333;
    --reader-overlay-bg: rgba(0, 0, 0, 0.7);
    --reader-card-bg: #2a2a2a;
    --reader-active-bg: #333333;
}

/* Font Size Variables */
.reader-layout[data-font-size="xs"][b-ol9ch1794o] { --reader-font-size: 14px; }
.reader-layout[data-font-size="s"][b-ol9ch1794o]  { --reader-font-size: 16px; }
.reader-layout[data-font-size="m"][b-ol9ch1794o]  { --reader-font-size: 18px; }
.reader-layout[data-font-size="l"][b-ol9ch1794o]  { --reader-font-size: 22px; }
.reader-layout[data-font-size="xl"][b-ol9ch1794o] { --reader-font-size: 26px; }

/* Font Family Variables */
.reader-layout[data-font-family="serif"][b-ol9ch1794o] {
    --reader-font-family: Georgia, 'Times New Roman', serif;
}
.reader-layout[data-font-family="sans"][b-ol9ch1794o] {
    --reader-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.reader-layout[data-font-family="dyslexic"][b-ol9ch1794o] {
    --reader-font-family: 'OpenDyslexic', 'Comic Sans MS', sans-serif;
}

/* Line Height Variables */
.reader-layout[data-line-height="compact"][b-ol9ch1794o] { --reader-line-height: 1.4; }
.reader-layout[data-line-height="normal"][b-ol9ch1794o]  { --reader-line-height: 1.7; }
.reader-layout[data-line-height="relaxed"][b-ol9ch1794o] { --reader-line-height: 2.0; }

/* Margin Variables */
.reader-layout[data-margins="narrow"][b-ol9ch1794o] { --reader-margin: 20px; }
.reader-layout[data-margins="normal"][b-ol9ch1794o] { --reader-margin: 40px; }
.reader-layout[data-margins="wide"][b-ol9ch1794o]   { --reader-margin: 80px; }

/* Mobile adjustments */
@media (max-width: 768px) {
    .reader-layout[data-margins="narrow"][b-ol9ch1794o] { --reader-margin: 12px; }
    .reader-layout[data-margins="normal"][b-ol9ch1794o] { --reader-margin: 20px; }
    .reader-layout[data-margins="wide"][b-ol9ch1794o]   { --reader-margin: 32px; }
}
/* /Pages/About.razor.rz.scp.css */
/* ══════════════════════════════════════
   About / Mission Page
   ══════════════════════════════════════ */

/* ── Hero ── */
.about-hero[b-lfprpi8gvf] {
    text-align: center;
    padding: var(--mn-space-16) var(--mn-space-4) var(--mn-space-12);
    max-width: 720px;
    margin: 0 auto;
}

.about-hero-title[b-lfprpi8gvf] {
    font-size: clamp(1.8rem, 5vw, 2.8rem);
    line-height: 1.2;
    margin-bottom: var(--mn-space-4);
}

.about-hero-sub[b-lfprpi8gvf] {
    font-size: var(--mn-text-lg);
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

/* ── Sections ── */
.about-section[b-lfprpi8gvf] {
    padding: var(--mn-space-12) var(--mn-space-4);
    max-width: 1000px;
    margin: 0 auto;
}

.about-section-alt[b-lfprpi8gvf] {
    background: var(--mn-bg-surface-alt);
    border-radius: var(--mn-radius-xl);
    max-width: 100%;
    padding-left: var(--mn-space-6);
    padding-right: var(--mn-space-6);
    margin-bottom: var(--mn-space-8);
}

.about-section-title[b-lfprpi8gvf] {
    text-align: center;
    font-size: clamp(1.4rem, 3.5vw, 2rem);
    margin-bottom: var(--mn-space-8);
}

/* ── Problem Text ── */
.about-problem-text[b-lfprpi8gvf] {
    max-width: var(--mn-max-width-prose);
    margin: 0 auto;
    font-size: var(--mn-text-base);
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
}

.about-problem-text p:last-child[b-lfprpi8gvf] {
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
}

/* ── Value Cards ── */
.about-value-grid[b-lfprpi8gvf] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    max-width: 960px;
    margin: 0 auto;
}

.about-value-card[b-lfprpi8gvf] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-6);
    transition: box-shadow var(--mn-transition-base), border-color var(--mn-transition-base);
}

.about-value-card:hover[b-lfprpi8gvf] {
    box-shadow: var(--mn-shadow-md);
    border-color: var(--mn-border-strong);
}

.about-value-icon[b-lfprpi8gvf] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-navy);
    color: var(--mn-gold);
    border-radius: var(--mn-radius-md);
    font-size: 1.25rem;
    margin-bottom: var(--mn-space-4);
}

.about-value-card h3[b-lfprpi8gvf] {
    font-size: var(--mn-text-lg);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-2);
}

.about-value-card p[b-lfprpi8gvf] {
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    margin: 0;
    font-size: var(--mn-text-sm);
}

/* ── Content Types Grid ── */
.about-content-grid[b-lfprpi8gvf] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-4);
    max-width: 700px;
    margin: 0 auto;
}

.about-content-item[b-lfprpi8gvf] {
    display: flex;
    align-items: flex-start;
    gap: var(--mn-space-4);
    padding: var(--mn-space-4);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
}

.about-content-item i[b-lfprpi8gvf] {
    font-size: 1.5rem;
    color: var(--mn-gold);
    flex-shrink: 0;
    margin-top: 2px;
}

.about-content-item strong[b-lfprpi8gvf] {
    display: block;
    font-size: var(--mn-text-base);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-1);
}

.about-content-item span[b-lfprpi8gvf] {
    font-size: var(--mn-text-sm);
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
}

/* ── Principles ── */
.about-principles[b-lfprpi8gvf] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    max-width: 700px;
    margin: 0 auto;
}

.about-principle[b-lfprpi8gvf] {
    text-align: center;
}

.about-principle h3[b-lfprpi8gvf] {
    font-size: var(--mn-text-lg);
    margin-bottom: var(--mn-space-1);
}

.about-principle p[b-lfprpi8gvf] {
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    margin: 0;
    font-size: var(--mn-text-sm);
}

/* ── Three Paths CTA ── */
.about-paths[b-lfprpi8gvf] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    max-width: 960px;
    margin: 0 auto;
}

.about-path-card[b-lfprpi8gvf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none;
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-8) var(--mn-space-6);
    transition: box-shadow var(--mn-transition-base), border-color var(--mn-transition-base);
}

.about-path-card:hover[b-lfprpi8gvf] {
    box-shadow: var(--mn-shadow-md);
    border-color: var(--mn-gold);
    text-decoration: none;
}

.about-path-icon[b-lfprpi8gvf] {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-navy);
    color: var(--mn-gold);
    border-radius: 50%;
    font-size: 1.5rem;
    margin-bottom: var(--mn-space-4);
}

.about-path-card h3[b-lfprpi8gvf] {
    font-size: var(--mn-text-lg);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-2);
}

.about-path-card p[b-lfprpi8gvf] {
    color: var(--mn-text-secondary);
    font-size: var(--mn-text-sm);
    line-height: var(--mn-leading-relaxed);
    margin-bottom: var(--mn-space-4);
}

/* ── Responsive ── */
@media (min-width: 576px) {
    .about-content-grid[b-lfprpi8gvf] {
        grid-template-columns: 1fr 1fr;
    }

    .about-principles[b-lfprpi8gvf] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 768px) {
    .about-value-grid[b-lfprpi8gvf] {
        grid-template-columns: 1fr 1fr;
    }

    .about-paths[b-lfprpi8gvf] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 992px) {
    .about-section-alt[b-lfprpi8gvf] {
        padding-left: var(--mn-space-12);
        padding-right: var(--mn-space-12);
    }
}
/* /Pages/Account/AccountSecurity.razor.rz.scp.css */
/*
  AI-INSTRUCTION: AccountSecurity is layout-only here. Buttons reuse global
  mn-security-btn-* primitives below since they only live on this page so far —
  if a second consumer shows up, promote to app.css. All colors come from
  --mn-* tokens (verified against design-tokens.css).
*/

.mn-security-wrap[b-rbklyvbjvl] {
    max-width: 720px;
    margin: 0 auto;
    padding: 24px 16px 64px;
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
}

.mn-security-header[b-rbklyvbjvl] {
    margin-bottom: 32px;
}

.mn-security-eyebrow[b-rbklyvbjvl] {
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
    letter-spacing: 2px;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    margin-bottom: 12px;
}

.mn-security-heading[b-rbklyvbjvl] {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-weight: 600;
    font-size: 36px;
    line-height: 1.1;
    color: var(--mn-text-primary, #f0e8d8);
    margin: 0 0 8px;
}

.mn-security-lede[b-rbklyvbjvl] {
    color: var(--mn-text-secondary, rgba(240, 232, 216, 0.70));
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
}

.mn-security-loading[b-rbklyvbjvl] {
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    text-align: center;
    padding: 48px 0;
}

.mn-security-card[b-rbklyvbjvl] {
    background: var(--mn-navy, #02184b);
    border: 1px solid var(--mn-navy-lighter, #163d8a);
    border-radius: 6px;
    padding: 20px;
    margin-bottom: 16px;
}

.mn-security-card-header[b-rbklyvbjvl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.mn-security-card-title[b-rbklyvbjvl] {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-weight: 600;
    font-size: 22px;
    line-height: 1.2;
    color: var(--mn-text-primary, #f0e8d8);
    margin: 0;
}

.mn-security-status[b-rbklyvbjvl] {
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 3px;
    border: 1px solid;
}

.mn-security-status-on[b-rbklyvbjvl] {
    color: var(--mn-success, #4a8f5e);
    border-color: var(--mn-success, #4a8f5e);
    background: var(--mn-success-light, #173625);
}

.mn-security-status-off[b-rbklyvbjvl] {
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    border-color: var(--mn-navy-lighter, #163d8a);
}

.mn-security-status-meta[b-rbklyvbjvl] {
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
}

.mn-security-card-body[b-rbklyvbjvl] {
    color: var(--mn-text-secondary, rgba(240, 232, 216, 0.70));
    font-size: 14px;
    line-height: 1.55;
    margin: 4px 0 16px;
}

.mn-security-empty[b-rbklyvbjvl] {
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    font-style: italic;
}

.mn-security-card-actions[b-rbklyvbjvl] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.mn-security-btn[b-rbklyvbjvl] {
    padding: 10px 16px;
    border-radius: 4px;
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    cursor: pointer;
    border: 1px solid;
    transition: background-color 120ms ease, color 120ms ease;
}

.mn-security-btn:disabled[b-rbklyvbjvl] {
    opacity: 0.45;
    cursor: not-allowed;
}

.mn-security-btn-primary[b-rbklyvbjvl] {
    background: var(--mn-gold, #d98947);
    color: var(--mn-navy-dark, #010f30);
    border-color: var(--mn-gold, #d98947);
}

.mn-security-btn-primary:hover:not(:disabled)[b-rbklyvbjvl] {
    background: var(--mn-gold-light, #e0c88c);
    border-color: var(--mn-gold-light, #e0c88c);
}

.mn-security-btn-secondary[b-rbklyvbjvl] {
    background: transparent;
    color: var(--mn-text-primary, #f0e8d8);
    border-color: var(--mn-navy-lighter, #163d8a);
}

.mn-security-btn-secondary:hover:not(:disabled)[b-rbklyvbjvl] {
    background: var(--mn-navy-light, #0a2d6e);
    border-color: var(--mn-gold, #d98947);
}

.mn-security-device-list[b-rbklyvbjvl],
.mn-security-audit-list[b-rbklyvbjvl] {
    list-style: none;
    padding: 0;
    margin: 12px 0 16px;
    border-top: 1px solid var(--mn-navy-lighter, #163d8a);
}

.mn-security-device[b-rbklyvbjvl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--mn-navy-lighter, #163d8a);
}

.mn-security-device-main[b-rbklyvbjvl] {
    min-width: 0;
    flex: 1;
}

.mn-security-device-label[b-rbklyvbjvl] {
    color: var(--mn-text-primary, #f0e8d8);
    font-size: 14px;
    margin-bottom: 2px;
}

.mn-security-device-meta[b-rbklyvbjvl] {
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    font-size: 12px;
}

.mn-security-link-danger[b-rbklyvbjvl] {
    background: none;
    border: 0;
    color: var(--mn-danger, #a83a4a);
    text-decoration: underline;
    text-underline-offset: 3px;
    font-size: 13px;
    padding: 6px 4px;
    cursor: pointer;
}

.mn-security-link-danger:hover:not(:disabled)[b-rbklyvbjvl] {
    color: var(--mn-danger-dark, #e8a0a8);
}

.mn-security-link-danger:disabled[b-rbklyvbjvl] {
    opacity: 0.5;
    cursor: not-allowed;
}

.mn-security-audit[b-rbklyvbjvl] {
    display: grid;
    grid-template-columns: 140px 1fr auto;
    gap: 8px 16px;
    padding: 8px 0;
    border-bottom: 1px solid var(--mn-navy-lighter, #163d8a);
    font-size: 13px;
}

.mn-security-audit-when[b-rbklyvbjvl] {
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
}

.mn-security-audit-event[b-rbklyvbjvl] {
    color: var(--mn-text-primary, #f0e8d8);
}

.mn-security-audit-meta[b-rbklyvbjvl] {
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
    text-align: right;
}

.mn-security-toast[b-rbklyvbjvl] {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 16px;
    border-radius: 4px;
    font-size: 13px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    z-index: 1040;
}

.mn-security-toast-ok[b-rbklyvbjvl] {
    background: var(--mn-success-light, #173625);
    color: var(--mn-success-dark, #7fb993);
    border: 1px solid var(--mn-success, #4a8f5e);
}

.mn-security-toast-error[b-rbklyvbjvl] {
    background: var(--mn-danger-light, #3a1820);
    color: var(--mn-danger-dark, #e8a0a8);
    border: 1px solid var(--mn-danger, #a83a4a);
}

/* Mobile: stack device row vertically, audit grid collapses to vertical-meta */
@media (max-width: 480px) {
    .mn-security-device[b-rbklyvbjvl] {
        flex-direction: column;
        align-items: flex-start;
    }

    .mn-security-link-danger[b-rbklyvbjvl] {
        margin-top: 4px;
    }

    .mn-security-audit[b-rbklyvbjvl] {
        grid-template-columns: 1fr;
        gap: 2px;
        padding: 10px 0;
    }

    .mn-security-audit-meta[b-rbklyvbjvl] {
        text-align: left;
    }
}
/* /Pages/Account/VerifyAge.razor.rz.scp.css */
/*
  AI-INSTRUCTION: VerifyAge is a transient verification surface, sibling to VerifyTwoFactor.
  Layout-only rules live here; the alert primitive (.mn-alert) is GLOBAL (app.css) — do not
  redefine it. Everything below is page-specific layout + form ergonomics using --mn-* tokens
  only. Mobile-first: built for 375px first (full-width inputs, >=44px tap targets), scales up.
*/

.mn-verify-wrap[b-tb7vwdutbx] {
    min-height: calc(100dvh - 64px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 32px 16px 64px;
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
}

.mn-verify-card[b-tb7vwdutbx] {
    width: 100%;
    max-width: 480px;
}

.mn-verify-eyebrow[b-tb7vwdutbx] {
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
    letter-spacing: 2px;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    margin-bottom: 16px;
}

.mn-verify-heading[b-tb7vwdutbx] {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-weight: 600;
    font-size: 36px;
    line-height: 1.1;
    color: var(--mn-text-primary, #f0e8d8);
    margin: 0 0 16px;
}

.mn-verify-lede[b-tb7vwdutbx] {
    color: var(--mn-text-secondary, rgba(240, 232, 216, 0.70));
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 28px;
}

/* ── Verify-your-details form ─────────────────────────────────────────── */

.mn-av-form[b-tb7vwdutbx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 4px;
}

.mn-av-row[b-tb7vwdutbx] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.mn-av-label[b-tb7vwdutbx] {
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
}

.mn-av-optional[b-tb7vwdutbx] {
    text-transform: none;
    letter-spacing: 0;
    opacity: 0.8;
}

.mn-av-input[b-tb7vwdutbx] {
    /* Full-width by default (mobile-first); 56px tall comfortably exceeds the 44px tap target. */
    width: 100%;
    min-height: 52px;
    padding: 12px 14px;
    font-size: 16px; /* 16px keeps iOS from zooming the field on focus */
    color: var(--mn-text-primary, #f0e8d8);
    background: var(--mn-navy-dark, #010f30);
    border: 1px solid var(--mn-navy-lighter, #163d8a);
    border-radius: 4px;
    caret-color: var(--mn-gold, #d98947);
    transition: border-color 120ms ease, background-color 120ms ease;
}

.mn-av-input:focus[b-tb7vwdutbx] {
    outline: none;
    border-color: var(--mn-gold, #d98947);
    background: var(--mn-navy, #02184b);
}

/* InputSelect renders a native <select>; match the text inputs. */
select.mn-av-input[b-tb7vwdutbx] {
    appearance: none;
    -webkit-appearance: none;
}

/* ── Post-redirect spinner ────────────────────────────────────────────── */

.mn-av-spinner[b-tb7vwdutbx] {
    display: flex;
    justify-content: center;
    margin: 8px 0 24px;
}

.mn-av-spinner .spinner-border[b-tb7vwdutbx] {
    width: 2rem;
    height: 2rem;
    color: var(--mn-gold, #d98947);
}

/* ── Submit + secondary action ────────────────────────────────────────── */

.mn-verify-submit[b-tb7vwdutbx] {
    display: block;
    width: 100%;
    min-height: 52px;
    padding: 14px 24px;
    background: var(--mn-gold, #d98947);
    color: var(--mn-navy-dark, #010f30);
    border: 1px solid var(--mn-gold, #d98947);
    border-radius: 4px;
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 120ms ease, transform 60ms ease;
    margin: 12px 0 24px;
}

.mn-verify-submit:hover:not(:disabled)[b-tb7vwdutbx] {
    background: var(--mn-gold-light, #e0c88c);
    border-color: var(--mn-gold-light, #e0c88c);
}

.mn-verify-submit:active:not(:disabled)[b-tb7vwdutbx] {
    transform: scale(0.99);
}

.mn-verify-submit:disabled[b-tb7vwdutbx] {
    opacity: 0.45;
    cursor: not-allowed;
}

.mn-verify-actions[b-tb7vwdutbx] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
}

.mn-verify-link[b-tb7vwdutbx] {
    background: none;
    border: 0;
    padding: 10px 8px; /* >=44px tap target with the line-height */
    color: var(--mn-gold, #d98947);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
    font-size: 14px;
}

.mn-verify-link:hover[b-tb7vwdutbx] {
    color: var(--mn-gold-light, #e0c88c);
}

/* The global .mn-alert sits between form fields here; give it breathing room. */
.mn-alert[b-tb7vwdutbx] {
    margin-top: 4px;
}

/* Scale up on tablet+ */
@media (min-width: 640px) {
    .mn-verify-heading[b-tb7vwdutbx] {
        font-size: 44px;
    }
}
/* /Pages/Account/VerifyTwoFactor.razor.rz.scp.css */
/*
  AI-INSTRUCTION: VerifyTwoFactor is a transient verification surface. Layout-only
  rules live here; primitives (button, link, error text, eyebrow) reuse global
  patterns and --mn-* tokens. Mobile-first — verified at 375px, scales up.
*/

.mn-verify-wrap[b-6aegbt3nk0] {
    min-height: calc(100dvh - 64px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 32px 16px 64px;
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
}

.mn-verify-card[b-6aegbt3nk0] {
    width: 100%;
    max-width: 480px;
}

.mn-verify-eyebrow[b-6aegbt3nk0] {
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 11px;
    letter-spacing: 2px;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    margin-bottom: 16px;
}

.mn-verify-heading[b-6aegbt3nk0] {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-weight: 600;
    font-size: 36px;
    line-height: 1.1;
    color: var(--mn-text-primary, #f0e8d8);
    margin: 0 0 16px;
}

.mn-verify-lede[b-6aegbt3nk0] {
    color: var(--mn-text-secondary, rgba(240, 232, 216, 0.70));
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 28px;
}

.mn-verify-lede strong[b-6aegbt3nk0] {
    color: var(--mn-text-primary, #f0e8d8);
    font-weight: 600;
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 13px;
}

.mn-verify-inputs[b-6aegbt3nk0] {
    display: flex;
    gap: 6px;
    justify-content: center;
    margin-bottom: 20px;
}

.mn-verify-digit[b-6aegbt3nk0] {
    width: 48px;
    height: 56px;
    text-align: center;
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 24px;
    font-weight: 600;
    color: var(--mn-text-primary, #f0e8d8);
    background: var(--mn-navy-dark, #010f30);
    border: 1px solid var(--mn-navy-lighter, #163d8a);
    border-radius: 4px;
    caret-color: var(--mn-gold, #d98947);
    transition: border-color 120ms ease, background-color 120ms ease;
}

.mn-verify-digit:focus[b-6aegbt3nk0] {
    outline: none;
    border-color: var(--mn-gold, #d98947);
    background: var(--mn-navy, #02184b);
}

.mn-verify-message[b-6aegbt3nk0] {
    font-size: 14px;
    margin: 0 0 20px;
    min-height: 20px;
}

.mn-verify-message-ok[b-6aegbt3nk0] {
    color: var(--mn-success, #4a8f5e);
}

.mn-verify-message-error[b-6aegbt3nk0] {
    color: var(--mn-danger, #a83a4a);
}

.mn-verify-trust[b-6aegbt3nk0] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 4px 0 20px;
    cursor: pointer;
    color: var(--mn-text-primary, #f0e8d8);
    font-size: 14px;
    line-height: 1.4;
}

.mn-verify-trust input[type="checkbox"][b-6aegbt3nk0] {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--mn-gold, #d98947);
    flex-shrink: 0;
}

.mn-verify-trust span strong[b-6aegbt3nk0] {
    display: block;
    font-weight: 500;
}

.mn-verify-trust-note[b-6aegbt3nk0] {
    display: block;
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
    font-size: 12px;
    margin-top: 2px;
}

.mn-verify-submit[b-6aegbt3nk0] {
    display: block;
    width: 100%;
    padding: 14px 24px;
    background: var(--mn-gold, #d98947);
    color: var(--mn-navy-dark, #010f30);
    border: 1px solid var(--mn-gold, #d98947);
    border-radius: 4px;
    font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 120ms ease, transform 60ms ease;
    margin-bottom: 24px;
}

.mn-verify-submit:hover:not(:disabled)[b-6aegbt3nk0] {
    background: var(--mn-gold-light, #e0c88c);
    border-color: var(--mn-gold-light, #e0c88c);
}

.mn-verify-submit:active:not(:disabled)[b-6aegbt3nk0] {
    transform: scale(0.99);
}

.mn-verify-submit:disabled[b-6aegbt3nk0] {
    opacity: 0.45;
    cursor: not-allowed;
}

.mn-verify-actions[b-6aegbt3nk0] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
}

.mn-verify-actions-sep[b-6aegbt3nk0] {
    color: var(--mn-text-tertiary, rgba(240, 232, 216, 0.45));
}

.mn-verify-link[b-6aegbt3nk0] {
    background: none;
    border: 0;
    padding: 6px 4px;
    color: var(--mn-gold, #d98947);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
    font-size: 14px;
}

.mn-verify-link:hover:not(:disabled)[b-6aegbt3nk0] {
    color: var(--mn-gold-light, #e0c88c);
}

.mn-verify-link:disabled[b-6aegbt3nk0] {
    opacity: 0.5;
    cursor: not-allowed;
    text-decoration: none;
}

/* Scale up on tablet+ */
@media (min-width: 640px) {
    .mn-verify-heading[b-6aegbt3nk0] {
        font-size: 44px;
    }

    .mn-verify-inputs[b-6aegbt3nk0] {
        gap: 10px;
    }

    .mn-verify-digit[b-6aegbt3nk0] {
        width: 56px;
        height: 64px;
        font-size: 28px;
    }
}
/* /Pages/Admin/AutoSuspendDetail.razor.rz.scp.css */
/* ================================================================
   AutoSuspendDetail.razor scoped styles
   PAGE-SPECIFIC LAYOUT ONLY for the auto-suspend detail sheet.
   Badges, cards, buttons, and alerts use global app.css classes.
   ================================================================ */

/* ── Auto-Suspend Detail Sheet Layout ─────────────────────────── */

/* Full-screen overlay behind the detail sheet.
   Sits above the moderation table content but the admin nav and
   the tab strip remain in the DOM so mobile keeps its bottom nav. */
.auto-suspend-overlay[b-d0kjcgjlhx] {
    position: fixed;
    inset: 0;
    z-index: 1040;
    background: var(--mn-bg-overlay, rgba(0,0,0,0.70));
    display: flex;
    align-items: flex-end; /* sheet slides up from bottom on mobile */
    justify-content: center;
}

/* The sheet itself — full-height panel on mobile, centred dialog on desktop */
.auto-suspend-sheet[b-d0kjcgjlhx] {
    background: var(--mn-bg-surface);
    border-top: 1px solid var(--mn-border-strong);
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 92dvh; /* leave room for OS chrome on mobile */
    border-radius: var(--mn-radius-lg, 12px) var(--mn-radius-lg, 12px) 0 0;
}

@media (min-width: 768px) {
    .auto-suspend-overlay[b-d0kjcgjlhx] {
        align-items: center;
    }

    .auto-suspend-sheet[b-d0kjcgjlhx] {
        width: 680px;
        max-height: 88vh;
        border-radius: var(--mn-radius-lg, 12px);
        border: 1px solid var(--mn-border-strong);
    }
}

/* Fixed header — back button + title */
.auto-suspend-sheet-header[b-d0kjcgjlhx] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--mn-border-default);
}

/* Scrollable body */
.auto-suspend-sheet-body[b-d0kjcgjlhx] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 1.25rem;
    -webkit-overflow-scrolling: touch;
}

/* Sticky action bar — always visible at bottom of sheet.
   padding-bottom uses safe-area-inset so it clears the iOS home
   indicator and the ResponsiveTabs bar (z 1030, height ~56px).
   We add an extra 8px above the inset for breathing room. */
.auto-suspend-sheet-actions[b-d0kjcgjlhx] {
    flex-shrink: 0;
    display: flex;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
    padding-bottom: max(0.875rem, env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface);
}

/* Each action button fills half the bar — minimum 44px height for tap targets */
.auto-suspend-sheet-actions .btn[b-d0kjcgjlhx] {
    min-height: 44px;
}
/* /Pages/Admin/BookDetail.razor.rz.scp.css */
/* Tag category filter strip — hide scrollbar for cleaner horizontal scroll */
.tag-filter-strip[b-1t0sflu64o] {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

.tag-filter-strip[b-1t0sflu64o]::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}
/* /Pages/Admin/Books.razor.rz.scp.css */
/* Admin Books page — now uses shared BookHoverCard component.
   Scoped styles kept minimal — shared hover card CSS lives in app.css. */
/* /Pages/Admin/CollectionAdmin.razor.rz.scp.css */
/* CollectionAdmin.razor — page-scoped LAYOUT only.
   Shared primitives (tags, badges, cards, buttons, save bar) live in app.css.
   This file holds the admin list/editor layout grids and member-row arrangement only. */

/* ---- List view ---- */
.collection-admin-list__header[b-eqhhy8w385] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mn-space-4);
    flex-wrap: wrap;
}

.collection-admin-list__table-wrap[b-eqhhy8w385] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.collection-admin-list__empty[b-eqhhy8w385] {
    max-width: 480px;
    margin: 0 auto;
}

/* ---- Editor view ---- */
/* The mono UTC helper line beneath each schedule picker. */
.collection-editor .coll-utc-label[b-eqhhy8w385] {
    display: block;
    margin-top: var(--mn-space-1);
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-xs);
    color: var(--mn-gold);
    letter-spacing: 0.08em;
}

/* ---- Members section ---- */
.collection-members__add[b-eqhhy8w385] {
    max-width: 520px;
}

/* Type-to-search picker */
.collection-members__search[b-eqhhy8w385] {
    position: relative;
}

.collection-members__search-icon[b-eqhhy8w385] {
    position: absolute;
    left: var(--mn-space-3);
    top: 50%;
    transform: translateY(-50%);
    color: var(--mn-text-secondary);
    pointer-events: none;
}

.collection-members__search-input[b-eqhhy8w385] {
    padding-left: calc(var(--mn-space-3) + 1.25rem);
}

.collection-members__search-spin[b-eqhhy8w385] {
    position: absolute;
    right: var(--mn-space-3);
    top: 50%;
    transform: translateY(-50%);
    color: var(--mn-text-secondary);
}

.collection-members__results[b-eqhhy8w385] {
    position: absolute;
    z-index: 20;
    top: calc(100% + var(--mn-space-1));
    left: 0;
    right: 0;
    max-height: 320px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: var(--mn-bg-elevated);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
    box-shadow: var(--mn-shadow-lg);
    padding: var(--mn-space-1);
}

.collection-members__result[b-eqhhy8w385] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    width: 100%;
    min-height: 56px;
    padding: var(--mn-space-2);
    border: none;
    border-radius: var(--mn-radius-md);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.collection-members__result:hover:not(:disabled)[b-eqhhy8w385],
.collection-members__result:focus-visible[b-eqhhy8w385] {
    background: var(--mn-bg-surface-alt);
}

.collection-members__result:disabled[b-eqhhy8w385] {
    cursor: default;
    opacity: 0.55;
}

.collection-members__result--empty[b-eqhhy8w385] {
    color: var(--mn-text-secondary);
    cursor: default;
    min-height: 0;
    padding: var(--mn-space-3);
}

.collection-members__result-cover[b-eqhhy8w385] {
    width: 32px;
    height: 48px;
    object-fit: cover;
    border-radius: var(--mn-radius-sm);
    flex: 0 0 auto;
}

.collection-members__result-body[b-eqhhy8w385] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 auto;
}

.collection-members__result-title[b-eqhhy8w385] {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.collection-members__result-author[b-eqhhy8w385] {
    color: var(--mn-text-secondary);
    font-size: 0.85em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.collection-members__result-meta[b-eqhhy8w385] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
    flex: 0 0 auto;
}

.collection-members__result-added[b-eqhhy8w385] {
    color: var(--mn-text-secondary);
    font-size: 0.8em;
}

.collection-members__table-wrap[b-eqhhy8w385] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.collection-members__cover[b-eqhhy8w385] {
    width: 40px;
    height: 60px;
    object-fit: cover;
    border-radius: var(--mn-radius-sm);
}

.collection-members__sort-input[b-eqhhy8w385] {
    width: 84px;
}

.collection-recent__joined[b-eqhhy8w385] {
    white-space: nowrap;
}
/* /Pages/Admin/Moderation.razor.rz.scp.css */
/* ================================================================
   Moderation.razor scoped styles
   PAGE-SPECIFIC LAYOUT ONLY.
   Badges, cards, buttons, and alerts use global app.css classes.
   The auto-suspend detail sheet overlay layout lives in
   AutoSuspendDetail.razor.css (scoped to that component).
   ================================================================ */

/* ── Mobile card list ──────────────────────────────────────────── */

/* The full-row tap target on each auto-suspended card on mobile.
   button semantics but looks like a card. */
.auto-suspend-card .card[b-pjb4mrmt6j] {
    cursor: pointer;
    transition: border-color 0.15s ease;
    min-height: 44px;
}

.auto-suspend-card:hover .card[b-pjb4mrmt6j],
.auto-suspend-card:focus .card[b-pjb4mrmt6j] {
    border-color: var(--mn-border-strong);
}
/* /Pages/Admin/StyleGuide.razor.rz.scp.css */
/* =============================================
   Style Guide - Scoped Presentation Styles
   Backroom voice: ink body, ember accent, paper text,
   roman-numeral sections, pull-quotes, do/don't panels.
   These styles ONLY affect the /admin/style-guide page.
   ============================================= */

.style-guide[b-wbblyvets5] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2.5rem 1.25rem;
    color: var(--mn-text-primary);
}

.sg-header[b-wbblyvets5] {
    padding: 2rem 0 3rem;
    border-bottom: 1px solid var(--mn-border-default);
    margin-bottom: 2.5rem;
}

.sg-section[b-wbblyvets5] {
    padding: 3rem 0;
    border-top: 1px solid var(--mn-border-default);
}

.sg-section:last-child[b-wbblyvets5] {
    border-bottom: none;
}

/* --- Backroom primitives ---------------------------------------- */

.sg-meta[b-wbblyvets5] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--mn-border-default);
    margin-bottom: 3rem;
}

.sg-kicker[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
}

.sg-kicker.sg-kicker-ember[b-wbblyvets5] {
    color: var(--mn-gold);
}

.sg-roman[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    color: var(--mn-gold);
    font-weight: 400;
    line-height: 1;
}

.sg-hero-title[b-wbblyvets5] {
    font-family: var(--mn-font-accent);
    font-weight: 400;
    font-size: clamp(4rem, 12vw, 8rem);
    line-height: 0.92;
    color: var(--mn-text-primary);
    letter-spacing: -0.02em;
    margin: 0.5rem 0 0;
}

.sg-hero-title em[b-wbblyvets5] {
    color: var(--mn-gold);
    font-style: normal;
}

.sg-hero-lede[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1.375rem;
    color: var(--mn-gold);
    margin: 0 0 0.5rem;
    letter-spacing: -0.01em;
}

.sg-pull[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: 1.25rem;
    font-style: italic;
    line-height: 1.4;
    color: var(--mn-gold-light);
    border-left: 2px solid var(--mn-gold);
    padding-left: 1.25rem;
}

.sg-pull-cite[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
    margin-top: 1.25rem;
    padding-left: 1.25rem;
}

.sg-toc[b-wbblyvets5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem 2rem;
    margin-top: 1rem;
}

@media (min-width: 768px) {
    .sg-toc[b-wbblyvets5] { grid-template-columns: repeat(4, 1fr); }
}

.sg-toc-item[b-wbblyvets5] {
    display: flex;
    gap: 0.75rem;
    align-items: baseline;
    border-top: 1px solid var(--mn-border-default);
    padding-top: 0.625rem;
    color: var(--mn-text-primary);
    text-decoration: none;
}

.sg-toc-item:hover[b-wbblyvets5] { color: var(--mn-gold); }

.sg-toc-item .sg-roman[b-wbblyvets5] {
    min-width: 1.75rem;
    font-size: 1.125rem;
}

.sg-toc-item .sg-toc-label[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: 1rem;
}

/* Section head: roman column + title column */
.sg-head[b-wbblyvets5] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    margin-bottom: 2.5rem;
}

@media (min-width: 768px) {
    .sg-head[b-wbblyvets5] { grid-template-columns: 240px 1fr; gap: 3rem; }
}

.sg-head .sg-roman-big[b-wbblyvets5] {
    font-size: 2.25rem;
    font-family: var(--mn-font-body);
    font-style: italic;
    color: var(--mn-gold);
    line-height: 1;
}

.sg-head .sg-head-bar[b-wbblyvets5] {
    width: 40px;
    height: 1px;
    background: var(--mn-gold);
    opacity: 0.6;
    margin-top: 0.75rem;
}

.sg-head-title[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-weight: 700;
    font-size: clamp(1.75rem, 4vw, 2.75rem);
    line-height: 1.05;
    color: var(--mn-text-primary);
    margin: 0;
    letter-spacing: -0.02em;
}

.sg-head-sub[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1.125rem;
    line-height: 1.55;
    color: var(--mn-text-secondary);
    margin: 1rem 0 0;
    max-width: 65ch;
}

/* Token chip — inline code-ish tag */
.sg-tok[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.75rem;
    color: var(--mn-gold);
    background: rgba(217, 137, 71, 0.08);
    padding: 0.125rem 0.4rem;
    border: 1px solid rgba(217, 137, 71, 0.3);
    border-radius: 2px;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

/* Do / Don't panels */
.sg-rules[b-wbblyvets5] {
    border: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface);
    padding: 1.25rem 1.5rem;
    border-radius: 2px;
}

.sg-rules-title[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin-bottom: 0.875rem;
}

.sg-rule-row[b-wbblyvets5] {
    display: grid;
    grid-template-columns: 1.25rem 1fr;
    gap: 0.875rem;
    align-items: baseline;
    margin-bottom: 0.625rem;
}

.sg-rule-row:last-child[b-wbblyvets5] { margin-bottom: 0; }

.sg-rule-mark[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1rem;
    line-height: 1;
}

.sg-rule-mark.sg-do[b-wbblyvets5]  { color: var(--mn-gold); }
.sg-rule-mark.sg-dont[b-wbblyvets5] { color: var(--mn-danger-dark); }

.sg-rule-text[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: 1rem;
    line-height: 1.5;
    color: var(--mn-text-primary);
    font-weight: 400;
}

/* Backroom swatch — full card */
.sg-swatch-br[b-wbblyvets5] {
    padding: 1.25rem 1.125rem 1.125rem;
    border-radius: 2px;
    min-height: 130px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid rgba(240, 232, 216, 0.12);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    position: relative;
    overflow: hidden;
}

.sg-swatch-br-role[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.5625rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    opacity: 0.8;
}

.sg-swatch-br-name[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: 1.5rem;
    font-style: italic;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 0.375rem;
}

.sg-swatch-br-hex[b-wbblyvets5],
.sg-swatch-br-token[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.03em;
    opacity: 0.8;
}

.sg-swatch-br-token[b-wbblyvets5] { opacity: 0.6; margin-top: 0.125rem; }

/* Neutral scale row — 10 stops */
.sg-scale-strip[b-wbblyvets5] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    border: 1px solid var(--mn-border-default);
    border-radius: 2px;
    overflow: hidden;
    margin-top: 0.875rem;
}

@media (min-width: 768px) {
    .sg-scale-strip[b-wbblyvets5] { grid-template-columns: repeat(10, 1fr); }
}

.sg-scale-cell[b-wbblyvets5] {
    padding: 1.25rem 0.625rem 0.875rem;
    min-height: 88px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.sg-scale-cell-step[b-wbblyvets5],
.sg-scale-cell-hex[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.5625rem;
    letter-spacing: 0.08em;
}

/* Type demo cards */
.sg-type-card[b-wbblyvets5] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: 2px;
    padding: 2.25rem 2.5rem;
}

.sg-type-card-pirata[b-wbblyvets5] {
    background: linear-gradient(135deg, var(--mn-bg-surface) 0%, var(--mn-bg-surface-alt) 100%);
}

.sg-type-card-head[b-wbblyvets5] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.sg-merri-hero[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: clamp(2rem, 5vw, 2.75rem);
    line-height: 1.1;
    font-weight: 700;
    color: var(--mn-text-primary);
    margin-bottom: 1rem;
}

.sg-merri-body[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--mn-text-secondary);
}

.sg-pirata-hero[b-wbblyvets5] {
    font-family: var(--mn-font-accent);
    font-size: clamp(3rem, 8vw, 4.25rem);
    color: var(--mn-gold);
    line-height: 1;
    letter-spacing: 0.03em;
    margin-bottom: 0.75rem;
}

/* Type scale table */
.sg-scale-table[b-wbblyvets5] {
    border: 1px solid var(--mn-border-default);
    border-radius: 2px;
    overflow: hidden;
}

.sg-scale-table-row[b-wbblyvets5] {
    display: grid;
    grid-template-columns: 60px 1fr;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    align-items: baseline;
    border-top: 1px solid var(--mn-border-default);
}

.sg-scale-table-row:first-child[b-wbblyvets5] { border-top: none; }
.sg-scale-table-row:nth-child(even)[b-wbblyvets5] { background: var(--mn-bg-surface); }

@media (min-width: 768px) {
    .sg-scale-table-row[b-wbblyvets5] {
        grid-template-columns: 60px 1fr 120px 160px;
        gap: 1.5rem;
    }
}

.sg-scale-tag[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-gold);
    letter-spacing: 0.05em;
}

.sg-scale-label[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-weight: 700;
    color: var(--mn-text-primary);
    line-height: 1.1;
}

.sg-scale-rem[b-wbblyvets5],
.sg-scale-tok[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-text-secondary);
    display: none;
}

@media (min-width: 768px) { .sg-scale-rem[b-wbblyvets5], .sg-scale-tok[b-wbblyvets5] { display: block; } }
.sg-scale-tok[b-wbblyvets5] { color: var(--mn-text-tertiary); font-size: 0.625rem; }

/* Spacing rows */
.sg-space-table[b-wbblyvets5] {
    border: 1px solid var(--mn-border-default);
    border-radius: 2px;
    overflow: hidden;
}

.sg-space-row[b-wbblyvets5] {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 0.875rem;
    padding: 0.875rem 1.25rem;
    align-items: center;
    border-top: 1px solid var(--mn-border-default);
}

.sg-space-row:first-child[b-wbblyvets5] { border-top: none; }
.sg-space-row:nth-child(even)[b-wbblyvets5] { background: var(--mn-bg-surface); }

@media (min-width: 768px) {
    .sg-space-row[b-wbblyvets5] {
        grid-template-columns: 110px 1fr 130px 1fr;
        gap: 1.125rem;
    }
}

.sg-space-tag[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-gold);
}

.sg-space-bar-br[b-wbblyvets5] {
    height: 10px;
    background: var(--mn-gold);
    opacity: 0.75;
    border-radius: 1px;
}

.sg-space-meta[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    color: var(--mn-text-secondary);
    display: none;
}

.sg-space-use[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.875rem;
    color: var(--mn-text-primary);
    display: none;
}

@media (min-width: 768px) { .sg-space-meta[b-wbblyvets5], .sg-space-use[b-wbblyvets5] { display: block; } }

.sg-space-use .sg-space-use-tail[b-wbblyvets5] { color: var(--mn-text-secondary); }

/* Radius tiles */
.sg-radius-tile[b-wbblyvets5] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    padding: 1.5rem 1.25rem 1.125rem;
    border-radius: 2px;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.sg-radius-swatch[b-wbblyvets5] {
    height: 54px;
    background: linear-gradient(135deg, var(--mn-gold) 0%, var(--mn-gold-dark) 100%);
    opacity: 0.85;
}

.sg-radius-name[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-gold);
}

.sg-radius-use[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.8125rem;
    color: var(--mn-text-secondary);
    margin-top: 0.125rem;
}

/* Shadow tiles */
.sg-shadow-tile-br[b-wbblyvets5] {
    background: var(--mn-gray-900);
    color: var(--mn-text-inverse);
    height: 72px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
}

/* Button demo column */
.sg-btn-demo[b-wbblyvets5] {
    background: var(--mn-bg-surface);
    padding: 2rem 2.25rem;
    border: 1px solid var(--mn-border-default);
    border-radius: 2px;
}

.sg-btn-row[b-wbblyvets5] {
    display: flex;
    align-items: center;
    gap: 1.125rem;
    flex-wrap: wrap;
    margin-bottom: 1.125rem;
}

.sg-btn-rank[b-wbblyvets5] {
    width: 1.5rem;
    font-family: var(--mn-font-body);
    font-style: italic;
    color: var(--mn-gold);
    font-size: 1.125rem;
}

.sg-btn-caption[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.9375rem;
    color: var(--mn-text-secondary);
}

.sg-btn-wrong[b-wbblyvets5] {
    background: var(--mn-bg-body);
    border: 1px dashed var(--mn-danger);
    padding: 0.875rem 1.125rem;
    margin-top: 0.375rem;
    border-radius: 2px;
}

/* Heat tier rows (§VII) */
.sg-heat-card[b-wbblyvets5] {
    background: linear-gradient(180deg, var(--mn-bg-surface) 0%, var(--mn-bg-surface-alt) 100%);
    padding: 1.625rem 1.75rem;
    border: 1px solid var(--mn-border-default);
    border-radius: 2px;
}

.sg-heat-row[b-wbblyvets5] {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 1rem;
    align-items: center;
    margin-bottom: 0.875rem;
}

@media (min-width: 576px) {
    .sg-heat-row[b-wbblyvets5] { grid-template-columns: 110px 140px 1fr; }
}

.sg-heat-row:last-child[b-wbblyvets5] { margin-bottom: 0; }

.sg-heat-glyph[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 1.125rem;
    letter-spacing: 0.12em;
}

.sg-heat-name[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1.375rem;
    font-weight: 500;
    color: var(--mn-text-primary);
    line-height: 1;
}

.sg-heat-line[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.9375rem;
    color: var(--mn-text-secondary);
    line-height: 1.3;
    grid-column: 1 / -1;
}

@media (min-width: 576px) {
    .sg-heat-line[b-wbblyvets5] { grid-column: auto; }
}

.sg-heat-foot[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    color: var(--mn-text-tertiary);
    margin-top: 1.25rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Dispatch (alert) rows — consume Bootstrap --bs-alert-* tokens set by .alert-{kind} classes */
.sg-dispatch-row[b-wbblyvets5] {
    padding: 0.875rem 1.25rem;
    border-radius: 6px;
    background-color: var(--bs-alert-bg, var(--mn-bg-surface));
    border: 1px solid var(--bs-alert-border-color, var(--mn-border-default));
    color: var(--bs-alert-color, var(--mn-text-primary));
    display: grid;
    grid-template-columns: 1.5rem 1fr;
    gap: 1rem;
    align-items: center;
    font-family: var(--mn-font-body);
    font-size: 0.875rem;
}

@media (min-width: 768px) {
    .sg-dispatch-row[b-wbblyvets5] {
        grid-template-columns: 1.5rem 140px 1fr 80px;
        gap: 1.125rem;
    }
}

.sg-dispatch-icon[b-wbblyvets5] { font-size: 1.125rem; text-align: center; }
.sg-dispatch-label[b-wbblyvets5] { font-weight: 700; }
.sg-dispatch-msg[b-wbblyvets5] { line-height: 1.5; }
.sg-dispatch-tok[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    opacity: 0.6;
    text-align: right;
    display: none;
}

@media (min-width: 768px) { .sg-dispatch-tok[b-wbblyvets5] { display: block; } }

/* Reader theme tile (§XII) */
.sg-reader-tile[b-wbblyvets5] {
    padding: 1.75rem 1.625rem;
    border-radius: 6px;
    border: 1px solid var(--mn-border-default);
    min-height: 240px;
    display: flex;
    flex-direction: column;
}

.sg-reader-label[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 1.125rem;
}

.sg-reader-name[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 0.625rem;
}

.sg-reader-sample[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-size: 0.875rem;
    font-style: italic;
    line-height: 1.7;
    opacity: 0.82;
}

.sg-reader-bar[b-wbblyvets5] {
    height: 3px;
    opacity: 0.7;
    margin-top: 1rem;
    width: 40px;
    align-self: flex-start;
}

/* Section: admin-only extensions divider */
.sg-admin-break[b-wbblyvets5] {
    margin-top: 4rem;
    padding-top: 2.5rem;
    border-top: 2px solid var(--mn-border-strong);
}

.sg-admin-break-kicker[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin-bottom: 0.75rem;
}

.sg-admin-break-title[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-weight: 700;
    font-size: 1.75rem;
    color: var(--mn-text-primary);
    margin: 0 0 0.75rem;
}

.sg-admin-break-sub[b-wbblyvets5] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1.0625rem;
    line-height: 1.55;
    color: var(--mn-text-secondary);
    max-width: 65ch;
}

/* --- Color Swatches --- */
.sg-swatch[b-wbblyvets5] {
    aspect-ratio: 3 / 2;
    border-radius: var(--mn-radius-lg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 0.85rem;
    padding: 0.5rem;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

.sg-swatch-label[b-wbblyvets5] {
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.sg-swatch code[b-wbblyvets5] {
    color: inherit;
    font-size: 0.75rem;
    background: rgba(0, 0, 0, 0.2);
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
}

/* Neutral scale row */
.sg-neutral-row[b-wbblyvets5] {
    display: flex;
    gap: 0;
    border-radius: var(--mn-radius-lg);
    overflow: hidden;
}

.sg-swatch-sm[b-wbblyvets5] {
    flex: 1;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
}

/* Surface boxes */
.sg-surface-box[b-wbblyvets5] {
    padding: 1.5rem;
    border-radius: var(--mn-radius-lg);
    text-align: center;
    font-size: 0.9rem;
    min-height: 80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.sg-surface-box code[b-wbblyvets5] {
    font-size: 0.8rem;
    color: var(--mn-text-secondary);
}

/* --- Spacing Bars --- */
.sg-space-bar[b-wbblyvets5] {
    height: 12px;
    background: var(--mn-navy);
    border-radius: 2px;
    opacity: 0.6;
    min-width: 4px;
}

.sg-code[b-wbblyvets5] {
    font-family: var(--mn-font-mono);
    font-size: 0.8rem;
    min-width: 140px;
    color: var(--mn-navy);
}

/* --- Shadow Boxes --- */
.sg-shadow-box[b-wbblyvets5] {
    background: var(--mn-bg-surface);
    border-radius: var(--mn-radius-lg);
    padding: 1.5rem;
    text-align: center;
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sg-shadow-box code[b-wbblyvets5] {
    color: var(--mn-text-secondary);
    font-size: 0.85rem;
}

/* --- Radius Boxes --- */
.sg-radius-box[b-wbblyvets5] {
    width: 80px;
    height: 80px;
    background: var(--mn-navy);
    color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
}

.sg-radius-box code[b-wbblyvets5] {
    color: inherit;
}

.sg-radius-box small[b-wbblyvets5] {
    opacity: 0.7;
}

/* --- Responsive Adjustments --- */
@media (max-width: 576px) {
    .style-guide[b-wbblyvets5] {
        padding: 1rem 0.75rem;
    }

    .sg-header[b-wbblyvets5] {
        padding: 2rem 0 1.5rem;
    }

    .sg-neutral-row[b-wbblyvets5] {
        flex-wrap: wrap;
    }

    .sg-swatch-sm[b-wbblyvets5] {
        flex: 0 0 20%;
        height: 48px;
    }

    .sg-code[b-wbblyvets5] {
        min-width: 110px;
        font-size: 0.7rem;
    }

    .sg-radius-box[b-wbblyvets5] {
        width: 64px;
        height: 64px;
        font-size: 0.7rem;
    }
}
/* /Pages/Admin/UserActivity.razor.rz.scp.css */
.user-activity[b-22xit4ajo4] {
    padding-bottom: 2rem;
}

.user-avatar[b-22xit4ajo4],
.user-avatar-placeholder[b-22xit4ajo4] {
    width: 64px;
    height: 64px;
    font-size: 1.75rem;
    flex-shrink: 0;
}

.user-avatar-placeholder[b-22xit4ajo4] {
    background: var(--mn-bg-surface-alt, #1f1a2e);
    color: var(--mn-text-primary, #f0e8d8);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    border: 1px solid var(--mn-border-default, rgba(240,232,216,0.10));
}

.user-activity-tabs[b-22xit4ajo4] {
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    border-bottom: 1px solid var(--mn-border-default, rgba(240,232,216,0.10));
}

.user-activity-tabs .nav-link[b-22xit4ajo4] {
    white-space: nowrap;
    border: 0;
    color: var(--mn-text-secondary, rgba(240,232,216,0.70));
    background: transparent;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 0.5rem 0.9rem;
}

.user-activity-tabs .nav-link:hover[b-22xit4ajo4] {
    color: var(--mn-text-primary, #f0e8d8);
}

.user-activity-tabs .nav-link.active[b-22xit4ajo4] {
    color: var(--mn-gold, #d98947);
    border-bottom-color: var(--mn-gold, #d98947);
    background: transparent;
}

.order-expanded > td[b-22xit4ajo4] {
    background: var(--mn-bg-surface-alt, #1f1a2e);
}

.order-expanded table[b-22xit4ajo4] {
    background: transparent;
}
/* /Pages/AisleLanding.razor.rz.scp.css */
/* AisleLanding — page-scoped layout only.
   All UI primitives (book-grid, BookCard, .mn-breadcrumb, .btn-*) come from
   global app.css / design-tokens.css. This file is for layout that's truly
   unique to /aisle/{slug}: hero positioning, intro typography rhythm, chip
   strip, FAQ accordion. Mobile-first @ 375px.
   Class names retain the .topic-* prefix — internal-only, renaming would be
   churn without user value. */

.topic-landing[b-clg4e79wla] {
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
    padding: var(--mn-space-4);
    color: var(--mn-text-primary);
}

@media (min-width: 768px) {
    .topic-landing[b-clg4e79wla] {
        padding: var(--mn-space-6) var(--mn-space-8);
    }
}

/* ── 404 state ─────────────────────────────────────────── */
.topic-not-found[b-clg4e79wla] {
    max-width: var(--mn-max-width-content);
    margin: var(--mn-space-12) auto;
    padding: var(--mn-space-8);
    text-align: center;
}

.topic-not-found h1[b-clg4e79wla] {
    margin-bottom: var(--mn-space-3);
}

/* ── Grace banner (admin-only) ────────────────────────── */
.topic-grace-banner[b-clg4e79wla] {
    background-color: var(--mn-warning-light);
    border: 1px solid var(--mn-border-default);
    border-left: 3px solid var(--mn-warning);
    color: var(--mn-text-primary);
    padding: var(--mn-space-3) var(--mn-space-4);
    border-radius: var(--mn-radius-md);
    margin-bottom: var(--mn-space-4);
    font-size: var(--mn-text-sm);
}

.topic-grace-banner i[b-clg4e79wla] {
    color: var(--mn-warning);
    margin-right: var(--mn-space-2);
}

.topic-grace-banner a[b-clg4e79wla] {
    color: var(--mn-text-link);
}

/* ── Breadcrumb ───────────────────────────────────────── */
.topic-breadcrumb[b-clg4e79wla] {
    margin-bottom: var(--mn-space-4);
    font-size: var(--mn-text-sm);
}

.topic-breadcrumb__category[b-clg4e79wla] {
    color: var(--mn-text-secondary);
}

/* ── Hero — Backroom title strip ─────────────────────
   Mirrors the .books-title-strip pattern in global app.css: mono kicker bar,
   bold serif H1 with italic-gold em accent, italic byline. Reused here rather
   than duplicated as a separate page-scoped surface so /books, /series, and
   /aisle/{slug} all rhyme typographically. */
.topic-hero[b-clg4e79wla] {
    margin: 0 calc(var(--mn-space-4) * -1) var(--mn-space-8);
    padding: var(--mn-space-8) var(--mn-space-6) var(--mn-space-6);
    border-bottom: 1px solid var(--mn-border-default);
}

/* When an image is set, the hero gets a full-bleed background with darkening
   gradient + extra vertical breathing room so the title floats over it. */
.topic-hero--imaged[b-clg4e79wla] {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: var(--mn-space-12);
    padding-bottom: var(--mn-space-10);
    border-bottom: none;
}

@media (min-width: 768px) {
    .topic-hero[b-clg4e79wla] {
        padding: var(--mn-space-10) var(--mn-space-8) var(--mn-space-6);
    }
    .topic-hero--imaged[b-clg4e79wla] {
        padding-top: var(--mn-space-16);
        padding-bottom: var(--mn-space-12);
    }
}

.topic-hero__meta[b-clg4e79wla] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-3);
}

.topic-hero__row[b-clg4e79wla] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
    align-items: flex-start;
    justify-content: space-between;
}

@media (min-width: 992px) {
    .topic-hero__row[b-clg4e79wla] {
        flex-direction: row;
        align-items: flex-end;
        gap: var(--mn-space-10);
    }
}

.topic-hero__title[b-clg4e79wla] {
    font-family: var(--mn-font-body);
    font-size: clamp(1.875rem, 5vw, 3.5rem);
    font-weight: var(--mn-font-bold);
    line-height: 0.98;
    letter-spacing: -0.025em;
    color: var(--mn-text-primary);
    margin: 0;
    flex: 1;
}

.topic-hero__title em[b-clg4e79wla] {
    font-style: italic;
    font-weight: var(--mn-font-regular);
    color: var(--mn-gold);
}

.topic-hero__aside[b-clg4e79wla] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-base);
    line-height: 1.5;
    color: #e8c8a8;
    margin: 0;
    max-width: 360px;
    padding-bottom: var(--mn-space-2);
    font-weight: var(--mn-font-light);
}

.topic-hero__aside a[b-clg4e79wla] {
    color: inherit;
    text-decoration: underline;
    text-decoration-color: var(--mn-border-default);
    text-underline-offset: 0.2em;
}

.topic-hero__aside a:hover[b-clg4e79wla] {
    text-decoration-color: var(--mn-gold);
}

/* ── Editorial intro ─────────────────────────────────── */
.topic-intro[b-clg4e79wla] {
    max-width: var(--mn-max-width-prose);
    margin: 0 auto var(--mn-space-12) auto;
}

.topic-intro__body[b-clg4e79wla] {
    font-size: var(--mn-text-base);
    line-height: var(--mn-leading-relaxed);
    color: var(--mn-text-primary);
}

@media (min-width: 768px) {
    .topic-intro__body[b-clg4e79wla] {
        font-size: var(--mn-text-lg);
    }
}

.topic-intro__body :first-child[b-clg4e79wla] {
    margin-top: 0;
}

.topic-intro__body p[b-clg4e79wla] {
    margin-bottom: var(--mn-space-4);
}

.topic-intro__body :last-child[b-clg4e79wla] {
    margin-bottom: 0;
}

.topic-intro__body a[b-clg4e79wla] {
    color: var(--mn-text-link);
    text-decoration: underline;
    text-decoration-color: var(--mn-border-default);
    text-underline-offset: 0.15em;
}

.topic-intro__body a:hover[b-clg4e79wla] {
    text-decoration-color: var(--mn-gold);
}

.topic-intro__body h2[b-clg4e79wla],
.topic-intro__body h3[b-clg4e79wla] {
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-bold);
    margin-top: var(--mn-space-6);
    margin-bottom: var(--mn-space-3);
}

.topic-intro__body h2[b-clg4e79wla] { font-size: var(--mn-text-2xl); }
.topic-intro__body h3[b-clg4e79wla] { font-size: var(--mn-text-xl); }

/* Section headings come from the global .mn-section-eyebrow + .mn-section-headline
   primitives in app.css. No page-scoped override needed — the whole point of
   adopting those is that /aisle/{slug} now rhymes with /books, /home, and the
   BookDetail page. */

/* ── Chip strips (children, related) ─────────────────── */
/* .topic-chips and .topic-chip primitives live in global app.css —
   used here AND on the /aisles hub. Do not redefine. */
.topic-children[b-clg4e79wla],
.topic-related[b-clg4e79wla] {
    margin-bottom: var(--mn-space-12);
}

/* ── Book grid section ───────────────────────────────── */
.topic-books[b-clg4e79wla] {
    margin-bottom: var(--mn-space-12);
}

.topic-see-all[b-clg4e79wla] {
    text-align: center;
    margin-top: var(--mn-space-6);
    margin-bottom: 0;
}

/* ── Hero cover collage backdrop (when no admin hero image set) ───────────── */
/* Three overlapping covers behind the typographic strip; reads as texture,
   not as primary content. Hidden on the smallest screens to keep the hero
   compact and avoid layout shift. */
.topic-hero-collage[b-clg4e79wla] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    opacity: 0.22;
    filter: blur(2px);
    z-index: 0;
    display: none;
}

.topic-hero-collage__cover[b-clg4e79wla] {
    position: absolute;
    width: 28%;
    max-width: 200px;
    aspect-ratio: 2 / 3;
}

.topic-hero-collage__cover:nth-child(1)[b-clg4e79wla] {
    top: -10%;
    right: 6%;
    transform: rotate(-6deg);
}

.topic-hero-collage__cover:nth-child(2)[b-clg4e79wla] {
    top: 20%;
    right: 32%;
    transform: rotate(4deg);
    opacity: 0.85;
}

.topic-hero-collage__cover:nth-child(3)[b-clg4e79wla] {
    top: -4%;
    right: 58%;
    transform: rotate(-2deg);
    opacity: 0.7;
}

@media (min-width: 480px) {
    .topic-hero-collage[b-clg4e79wla] {
        display: block;
    }
}

/* Ensure hero foreground sits above the collage. */
.topic-hero[b-clg4e79wla] {
    position: relative;
}

.topic-hero__meta[b-clg4e79wla],
.topic-hero__row[b-clg4e79wla] {
    position: relative;
    z-index: 1;
}

/* ── Stats strip ─────────────────────────────────────────── */
.topic-stats[b-clg4e79wla] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-2);
    margin-bottom: var(--mn-space-8);
}

/* ── Editorial intro clamp toggle (mobile only) ─────────── */
.topic-intro--clampable[b-clg4e79wla] {
    display: -webkit-box;
    -webkit-line-clamp: 10;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
}

.topic-intro--clampable.topic-intro--expanded[b-clg4e79wla] {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
}

.topic-intro__toggle[b-clg4e79wla] {
    display: inline-block;
    margin-top: var(--mn-space-3);
    padding: 0;
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-sm);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mn-gold);
    text-decoration: none;
}

.topic-intro__toggle:hover[b-clg4e79wla],
.topic-intro__toggle:focus-visible[b-clg4e79wla] {
    color: var(--mn-text-primary);
    text-decoration: underline;
}

/* Disable the clamp + hide the toggle above mobile breakpoint. */
@media (min-width: 768px) {
    .topic-intro--clampable[b-clg4e79wla] {
        display: block;
        -webkit-line-clamp: unset;
        overflow: visible;
    }
    .topic-intro__toggle[b-clg4e79wla] {
        display: none;
    }
}

/* ── Spotlight section ───────────────────────────────────── */
.topic-spotlight[b-clg4e79wla] {
    margin-bottom: var(--mn-space-12);
}

.topic-spotlight__card[b-clg4e79wla] {
    /* Use the global .mn-spotlight-card primitive for tone + radius + border;
       these page-scoped rules supply only the topic-specific two-column layout. */
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    align-items: start;
}

.topic-spotlight__media[b-clg4e79wla] {
    width: 100%;
    max-width: 260px;
    margin: 0 auto;
}

.topic-spotlight__cover-link[b-clg4e79wla] {
    display: block;
    aspect-ratio: 2 / 3;
}

.topic-spotlight__body[b-clg4e79wla] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
}

.topic-spotlight__copy[b-clg4e79wla] {
    font-size: var(--mn-text-base);
    line-height: 1.7;
    margin: 0;
    max-width: var(--mn-max-width-prose);
}

.topic-spotlight__byline[b-clg4e79wla] {
    margin: 0;
    font-family: var(--mn-font-body);
    color: var(--mn-text-primary);
}

.topic-spotlight__byline a[b-clg4e79wla] {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid rgba(217, 137, 71, 0.4);
    transition: border-color 0.15s ease;
}

.topic-spotlight__byline a:hover[b-clg4e79wla],
.topic-spotlight__byline a:focus-visible[b-clg4e79wla] {
    border-bottom-color: var(--mn-gold);
}

.topic-spotlight__meta[b-clg4e79wla] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-2);
    align-items: center;
}

.topic-spotlight__actions[b-clg4e79wla] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-3);
    margin-top: var(--mn-space-2);
}

@media (min-width: 768px) {
    .topic-spotlight__card[b-clg4e79wla] {
        grid-template-columns: 260px 1fr;
        gap: var(--mn-space-8);
    }
    .topic-spotlight__media[b-clg4e79wla] {
        margin: 0;
    }
}

/* ── Rail sections (book rails + author rail + series rail) ──── */
.topic-rail[b-clg4e79wla] {
    margin-bottom: var(--mn-space-12);
}

/* ── Author rail layout ──────────────────────────────────── */
.topic-authors-grid[b-clg4e79wla] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--mn-space-4);
}

/* ── Series rail — sizes SeriesBrowseCard inside ScrollCarousel. Mirrors the
       Home page's home-series-card width so the rail feels native. Page-scoped
       ::deep crosses one boundary (page → SeriesBrowseCard). ────────────────── */
[b-clg4e79wla] .topic-series-rail-card {
    width: 320px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (min-width: 576px) {
    [b-clg4e79wla] .topic-series-rail-card {
        width: 380px;
    }
}

/* ── Adjacent aisles prose paragraph ─────────────────────── */
.topic-related-prose[b-clg4e79wla] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-base);
    line-height: 1.7;
    color: var(--mn-text-primary);
    max-width: var(--mn-max-width-prose);
    margin: 0 0 var(--mn-space-4) 0;
}

.topic-related-prose a[b-clg4e79wla] {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid rgba(217, 137, 71, 0.4);
    transition: border-color 0.15s ease;
}

.topic-related-prose a:hover[b-clg4e79wla],
.topic-related-prose a:focus-visible[b-clg4e79wla] {
    border-bottom-color: var(--mn-gold);
}

/* ── Voice-driven empty state ───────────────────────────── */
.topic-empty-state[b-clg4e79wla] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-xl);
    padding: var(--mn-space-8) var(--mn-space-6);
    text-align: center;
    margin-bottom: var(--mn-space-12);
}

.topic-empty-state__body[b-clg4e79wla] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-base);
    line-height: 1.7;
    color: var(--mn-text-primary);
    max-width: 50ch;
    margin: var(--mn-space-4) auto 0 auto;
}

.topic-empty-state__body a[b-clg4e79wla] {
    color: var(--mn-gold);
    text-decoration: none;
}

.topic-empty-state__body a:hover[b-clg4e79wla],
.topic-empty-state__body a:focus-visible[b-clg4e79wla] {
    text-decoration: underline;
}
/* /Pages/Aisles.razor.rz.scp.css */
/* Aisles — /aisles hub page. Page-scoped layout only.
   All UI primitives (.mn-page-strip, .mn-kpi-card, .mn-section-eyebrow,
   .mn-section-headline, .topic-chips, .topic-chip, .btn-*) come from
   global app.css / design-tokens.css. This file is for layout that's truly
   unique to /aisles: featured rich-card grid+carousel, sticky filter,
   sticky alphabet-jump strip, per-category gloss, voice CTA, state cards.
   Mobile-first @ 375px. */

.aisles-page[b-teo67502q3] {
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
    padding: var(--mn-space-4);
    color: var(--mn-text-primary);
}

@media (min-width: 768px) {
    .aisles-page[b-teo67502q3] {
        padding: var(--mn-space-6) var(--mn-space-8);
    }
}

/* === Hero — composes with global .mn-page-strip; only minor overrides. === */
.aisles-hero[b-teo67502q3] {
    margin-bottom: var(--mn-space-8);
}

.aisles-hero__title[b-teo67502q3] {
    /* Tighter wrap at 375px so the italic em lands on the second line. */
    max-width: 16ch;
}

@media (min-width: 768px) {
    .aisles-hero__title[b-teo67502q3] {
        max-width: none;
    }
}

/* === Hero shortcuts — 4 routes into filtered /books surfaces. ===
   Sales lever: gives the lost reader an immediate-action chip. Mobile is
   2x2 grid for thumb-reachability; desktop is 4-up row. */
.aisles-shortcuts[b-teo67502q3] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--mn-space-2);
    margin-top: var(--mn-space-5);
}

@media (min-width: 576px) {
    .aisles-shortcuts[b-teo67502q3] {
        grid-template-columns: repeat(4, 1fr);
        gap: var(--mn-space-3);
    }
}

.aisles-shortcut[b-teo67502q3] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    padding: var(--mn-space-3) var(--mn-space-4);
    background: linear-gradient(135deg, rgba(217, 137, 71, 0.08), rgba(217, 137, 71, 0.02));
    border: 1px solid rgba(217, 137, 71, 0.25);
    border-radius: var(--mn-radius-md);
    color: var(--mn-text-primary);
    text-decoration: none;
    transition: background-color var(--mn-transition-fast),
                border-color var(--mn-transition-fast),
                transform var(--mn-transition-fast);
    min-height: 56px;
}

.aisles-shortcut:hover[b-teo67502q3],
.aisles-shortcut:focus-visible[b-teo67502q3] {
    background: linear-gradient(135deg, rgba(217, 137, 71, 0.18), rgba(217, 137, 71, 0.06));
    border-color: var(--mn-gold);
    color: var(--mn-text-primary);
    text-decoration: none;
    transform: translateY(-1px);
}

.aisles-shortcut__icon[b-teo67502q3] {
    color: var(--mn-gold);
    font-size: var(--mn-text-xl);
    flex-shrink: 0;
}

.aisles-shortcut__body[b-teo67502q3] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.aisles-shortcut__label[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-semibold);
    font-size: var(--mn-text-sm);
    color: var(--mn-text-primary);
    line-height: 1.2;
}

.aisles-shortcut__hint[b-teo67502q3] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
    margin-top: 2px;
}

/* === Spotlight — top-1 aisle hero card. The page's conversion anchor. ===
   Mobile: media stacked above body. Desktop: side-by-side asymmetric.
   Composes with global .mn-spotlight-card pattern visually but uses its
   own surface/border styling for a stronger merchandising treatment. */
.aisles-spotlight[b-teo67502q3] {
    position: relative;
    margin-bottom: var(--mn-space-12);
    border-radius: var(--mn-radius-xl);
    overflow: hidden;
    background:
        radial-gradient(ellipse at top right, rgba(217, 137, 71, 0.12), transparent 60%),
        var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    box-shadow: var(--mn-shadow-md);
}

.aisles-spotlight__inner[b-teo67502q3] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-5);
    padding: var(--mn-space-6);
    align-items: center;
}

@media (min-width: 768px) {
    .aisles-spotlight__inner[b-teo67502q3] {
        grid-template-columns: minmax(280px, 1fr) 1.2fr;
        gap: var(--mn-space-8);
        padding: var(--mn-space-8) var(--mn-space-10);
    }
}

.aisles-spotlight__media[b-teo67502q3] {
    position: relative;
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.aisles-spotlight__hero-image[b-teo67502q3] {
    width: 100%;
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center;
    border-radius: var(--mn-radius-lg);
}

.aisles-spotlight__placeholder[b-teo67502q3] {
    width: 100%;
    aspect-ratio: 4 / 3;
    background:
        radial-gradient(ellipse at center, rgba(217, 137, 71, 0.18), transparent 70%),
        var(--mn-bg-surface-alt);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
}

.aisles-spotlight__placeholder-letter[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: clamp(4rem, 12vw, 7rem);
    color: var(--mn-gold);
    opacity: 0.7;
}

.aisles-spotlight__body[b-teo67502q3] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
}

.aisles-spotlight__name[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-regular);
    font-size: clamp(2rem, 5vw, 3.25rem);
    line-height: 1.05;
    color: var(--mn-text-primary);
    margin: 0;
}

.aisles-spotlight__name em[b-teo67502q3] {
    color: var(--mn-gold);
    font-style: italic;
}

.aisles-spotlight__tagline[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-lg);
    line-height: 1.45;
    color: var(--mn-text-secondary);
    margin: 0;
    max-width: 50ch;
}

.aisles-spotlight__meta[b-teo67502q3] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-2);
    margin-top: var(--mn-space-1);
}

.aisles-spotlight__cta[b-teo67502q3] {
    align-self: flex-start;
    margin-top: var(--mn-space-3);
}

/* === Cover collage primitive (used by Spotlight + Featured cards). ===
   Three overlapping cover thumbnails reading as a single composition.
   First cover sits flat; second + third tilt outward to give a "fan of
   books on a shelf" feel — bookshop-coded, not blog-coded. */
.aisles-cover-collage[b-teo67502q3] {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    min-height: 140px;
}

.aisles-cover-collage__cover[b-teo67502q3] {
    position: relative;
    aspect-ratio: 2 / 3;
    width: 80px;
    overflow: hidden;
    border-radius: var(--mn-radius-sm);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
    background-color: var(--mn-bg-surface-alt);
    transition: transform var(--mn-transition-fast);
    flex-shrink: 0;
}

.aisles-cover-collage__cover img[b-teo67502q3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Three-cover overlap arrangement — center cover prominent, sides peek out. */
.aisles-cover-collage__cover:nth-child(1)[b-teo67502q3] {
    z-index: 2;
    transform: translateX(0) rotate(0deg);
    margin: 0 -8px;
}

.aisles-cover-collage__cover:nth-child(2)[b-teo67502q3] {
    z-index: 1;
    transform: translateX(0) rotate(-5deg) translateY(6px);
    margin-left: -16px;
}

.aisles-cover-collage__cover:nth-child(3)[b-teo67502q3] {
    z-index: 1;
    transform: translateX(0) rotate(5deg) translateY(6px);
    margin-right: -16px;
    order: 3;
}

/* Reorder so center (1st) sits between (2) and (3) on render — visually a fan. */
.aisles-cover-collage__cover:nth-child(2)[b-teo67502q3] { order: 1; }
.aisles-cover-collage__cover:nth-child(1)[b-teo67502q3] { order: 2; }
.aisles-cover-collage__cover:nth-child(3)[b-teo67502q3] { order: 3; }

/* Large variant for Spotlight section. */
.aisles-cover-collage--large[b-teo67502q3] {
    min-height: 200px;
}

.aisles-cover-collage--large .aisles-cover-collage__cover[b-teo67502q3] {
    width: 120px;
}

@media (min-width: 768px) {
    .aisles-cover-collage--large .aisles-cover-collage__cover[b-teo67502q3] {
        width: 140px;
    }
}

/* === Featured rail. ===
   Single DOM region — each card rendered once. Mobile: horizontal scroll
   with snap-x. Desktop: 4-up CSS grid (no scroll, no snap). Cards stay
   the same .aisles-featured-card primitive at every viewport. */
.aisles-featured[b-teo67502q3] {
    margin-bottom: var(--mn-space-12);
}

.aisles-featured-rail[b-teo67502q3] {
    display: flex;
    gap: var(--mn-space-4);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: var(--mn-space-2);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.aisles-featured-rail[b-teo67502q3]::-webkit-scrollbar {
    display: none;
}

/* Mobile cards: fixed width so snap-x has a target; 260px shows ~1.2 cards
   at 375px viewport, signalling there's more to the right. */
.aisles-featured-rail > .aisles-featured-card[b-teo67502q3] {
    width: 260px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (min-width: 768px) {
    .aisles-featured-rail[b-teo67502q3] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        overflow-x: visible;
        scroll-snap-type: none;
        padding-bottom: 0;
    }
    .aisles-featured-rail > .aisles-featured-card[b-teo67502q3] {
        width: auto;
        scroll-snap-align: unset;
    }
}

@media (min-width: 992px) {
    .aisles-featured-rail[b-teo67502q3] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1280px) {
    .aisles-featured-rail[b-teo67502q3] {
        grid-template-columns: repeat(4, 1fr);
    }
}

.aisles-featured-card[b-teo67502q3] {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    color: var(--mn-text-primary);
    text-decoration: none;
    overflow: hidden;
    transition: background-color var(--mn-transition-fast),
                border-color var(--mn-transition-fast),
                transform var(--mn-transition-fast),
                box-shadow var(--mn-transition-fast);
    box-shadow: var(--mn-shadow-sm);
}

.aisles-featured-card:hover[b-teo67502q3],
.aisles-featured-card:focus-visible[b-teo67502q3] {
    background-color: var(--mn-bg-surface-alt);
    border-color: var(--mn-gold);
    color: var(--mn-text-primary);
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: var(--mn-shadow-md);
}

.aisles-featured-card__covers[b-teo67502q3] {
    /* Cover collage sits at the top of each card — books on the shelf,
       not blog-tile-coded. Subtle dark gradient at the bottom blends into
       the card body so the typography reads cleanly below. */
    position: relative;
    height: 160px;
    background:
        linear-gradient(180deg, transparent 60%, rgba(11, 10, 20, 0.6)),
        radial-gradient(ellipse at center, rgba(217, 137, 71, 0.05), transparent 70%);
    padding: var(--mn-space-4) var(--mn-space-3) 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.aisles-featured-card__covers .aisles-featured-card__cover[b-teo67502q3] {
    position: relative;
    aspect-ratio: 2 / 3;
    width: 70px;
    overflow: hidden;
    border-radius: var(--mn-radius-sm);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    background-color: var(--mn-bg-surface-alt);
}

.aisles-featured-card__covers .aisles-featured-card__cover img[b-teo67502q3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Same fan-of-books arrangement as the Spotlight collage, scaled down. */
.aisles-featured-card__covers .aisles-featured-card__cover:nth-child(1)[b-teo67502q3] {
    z-index: 2;
    order: 2;
    margin: 0 -6px;
}
.aisles-featured-card__covers .aisles-featured-card__cover:nth-child(2)[b-teo67502q3] {
    z-index: 1;
    order: 1;
    transform: rotate(-5deg) translateY(5px);
    margin-left: -12px;
}
.aisles-featured-card__covers .aisles-featured-card__cover:nth-child(3)[b-teo67502q3] {
    z-index: 1;
    order: 3;
    transform: rotate(5deg) translateY(5px);
    margin-right: -12px;
}

.aisles-featured-card__body[b-teo67502q3] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-2);
    padding: var(--mn-space-4) var(--mn-space-5) var(--mn-space-3);
    flex: 1;
}

.aisles-featured-card__eyebrow[b-teo67502q3] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.22em;
    color: var(--mn-gold);
    font-weight: var(--mn-font-semibold);
}

.aisles-featured-card__name[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-xl);
    line-height: 1.15;
    color: var(--mn-text-primary);
    /* Long names truncate on the second line rather than blowing card height. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.aisles-featured-card__tagline[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-sm);
    line-height: 1.4;
    color: var(--mn-text-secondary);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.aisles-featured-card__meta[b-teo67502q3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--mn-space-3);
    margin-top: auto;
    padding-top: var(--mn-space-1);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
}

.aisles-featured-card__count[b-teo67502q3] {
    color: var(--mn-text-secondary);
}

.aisles-featured-card__heat[b-teo67502q3] {
    color: var(--mn-gold);
    font-weight: var(--mn-font-semibold);
}

.aisles-featured-card__cta[b-teo67502q3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--mn-space-3) var(--mn-space-5);
    border-top: 1px solid var(--mn-border-default);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mn-gold);
    transition: background-color var(--mn-transition-fast);
}

.aisles-featured-card__cta i[b-teo67502q3] {
    transition: transform var(--mn-transition-fast);
}

.aisles-featured-card:hover .aisles-featured-card__cta[b-teo67502q3],
.aisles-featured-card:focus-visible .aisles-featured-card__cta[b-teo67502q3] {
    background-color: rgba(217, 137, 71, 0.08);
}

.aisles-featured-card:hover .aisles-featured-card__cta i[b-teo67502q3],
.aisles-featured-card:focus-visible .aisles-featured-card__cta i[b-teo67502q3] {
    transform: translateX(4px);
}

/* === Sticky filter input ===
   z-index sits comfortably below ResponsiveTabs (1030) and
   AskMidnetteBubble (1050) — never competes with fixed mobile chrome. */
.aisles-filter[b-teo67502q3] {
    position: sticky;
    top: var(--mn-space-3);
    z-index: 5;
    margin-bottom: var(--mn-space-8);
    /* Backdrop fade so chips scrolling beneath aren't unreadable. */
    background: linear-gradient(to bottom, var(--mn-bg-body) 80%, rgba(11, 10, 20, 0));
    padding-bottom: var(--mn-space-2);
}

.aisles-filter__inner[b-teo67502q3] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
    padding: var(--mn-space-2) var(--mn-space-3);
    background-color: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
    transition: border-color var(--mn-transition-fast);
}

.aisles-filter__inner:focus-within[b-teo67502q3] {
    border-color: var(--mn-gold);
}

.aisles-filter__icon[b-teo67502q3] {
    color: var(--mn-text-tertiary);
    font-size: var(--mn-text-base);
    flex-shrink: 0;
}

.aisles-filter__input[b-teo67502q3] {
    flex: 1;
    background: transparent;
    border: 0;
    outline: 0;
    color: var(--mn-text-primary);
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-base);
    min-width: 0;
    /* Mobile a11y — meet the 44px tap-target rule */
    min-height: 36px;
}

.aisles-filter__input[b-teo67502q3]::placeholder {
    color: var(--mn-text-tertiary);
    font-style: italic;
}

.aisles-filter__clear[b-teo67502q3] {
    background: transparent;
    border: 0;
    color: var(--mn-text-tertiary);
    cursor: pointer;
    padding: var(--mn-space-1) var(--mn-space-2);
    border-radius: var(--mn-radius-sm);
    transition: color var(--mn-transition-fast), background-color var(--mn-transition-fast);
    /* Tap target */
    min-width: 32px;
    min-height: 32px;
}

.aisles-filter__clear:hover[b-teo67502q3],
.aisles-filter__clear:focus-visible[b-teo67502q3] {
    color: var(--mn-text-primary);
    background-color: var(--mn-bg-surface-alt);
}

/* === By-category sections — chip grids with editorial gloss. === */
.aisles-by-category[b-teo67502q3] {
    margin-bottom: var(--mn-space-10);
}

.aisles-category[b-teo67502q3] {
    margin-bottom: var(--mn-space-10);
}

.aisles-category__gloss[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-base);
    line-height: 1.5;
    color: var(--mn-text-secondary);
    max-width: 60ch;
    margin: calc(var(--mn-space-2) * -1) 0 var(--mn-space-4) 0;
}

/* === No-match state for filter === */
.aisles-no-match[b-teo67502q3] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-6);
    text-align: center;
    margin-bottom: var(--mn-space-8);
}

.aisles-no-match__body[b-teo67502q3] {
    font-family: var(--mn-font-body);
    color: var(--mn-text-secondary);
    margin: var(--mn-space-3) 0 0 0;
}

.aisles-no-match__body a[b-teo67502q3] {
    color: var(--mn-gold);
}

/* === A-Z section + sticky letter-jump strip. === */
.aisles-az[b-teo67502q3] {
    margin-bottom: var(--mn-space-10);
}

.aisles-letter-strip[b-teo67502q3] {
    position: sticky;
    /* Sits below the filter input (which is sticky at top: --mn-space-3).
       Combined the two are ~96-110px of sticky chrome — acceptable. */
    top: calc(var(--mn-space-3) + 56px);
    z-index: 4;
    display: flex;
    gap: var(--mn-space-1);
    padding: var(--mn-space-2) 0;
    margin-bottom: var(--mn-space-4);
    background: linear-gradient(to bottom, var(--mn-bg-body) 80%, rgba(11, 10, 20, 0));
    /* Mobile: horizontal scroll with snap so all letters fit even at 375px */
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.aisles-letter-strip[b-teo67502q3]::-webkit-scrollbar {
    display: none;
}

.aisles-letter-strip__btn[b-teo67502q3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* ≥44px tap target rule on mobile */
    min-width: 48px;
    min-height: 44px;
    padding: 0 var(--mn-space-2);
    background-color: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
    color: var(--mn-text-primary);
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
    text-decoration: none;
    flex-shrink: 0;
    scroll-snap-align: start;
    transition: background-color var(--mn-transition-fast),
                border-color var(--mn-transition-fast),
                color var(--mn-transition-fast);
}

.aisles-letter-strip__btn:hover[b-teo67502q3],
.aisles-letter-strip__btn:focus-visible[b-teo67502q3] {
    background-color: var(--mn-bg-surface-alt);
    border-color: var(--mn-gold);
    color: var(--mn-gold);
}

@media (min-width: 768px) {
    .aisles-letter-strip[b-teo67502q3] {
        overflow-x: visible;
        flex-wrap: wrap;
    }
}

.aisles-letter-section[b-teo67502q3] {
    margin-bottom: var(--mn-space-6);
    /* Offset for the sticky strip on jump-scroll so the heading isn't hidden. */
    scroll-margin-top: calc(var(--mn-space-3) + 56px + 56px);
}

.aisles-letter-section__heading[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-2xl);
    color: var(--mn-gold);
    margin: 0 0 var(--mn-space-3) 0;
}

/* === Closing CTA — multi-path exits. Three quick-action cards stacked on
   mobile, 3-up grid on desktop. Each card phrases an outcome, not a verb. */
.aisles-cta[b-teo67502q3] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-xl);
    padding: var(--mn-space-8) var(--mn-space-6);
    margin-bottom: var(--mn-space-8);
    text-align: center;
}

.aisles-cta__grid[b-teo67502q3] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-3);
    margin: var(--mn-space-5) auto 0;
    max-width: 720px;
}

@media (min-width: 576px) {
    .aisles-cta__grid[b-teo67502q3] {
        grid-template-columns: repeat(3, 1fr);
    }
}

.aisles-cta__card[b-teo67502q3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mn-space-1);
    padding: var(--mn-space-4) var(--mn-space-4);
    background-color: var(--mn-bg-surface-alt);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
    color: var(--mn-text-primary);
    text-decoration: none;
    transition: background-color var(--mn-transition-fast),
                border-color var(--mn-transition-fast),
                transform var(--mn-transition-fast);
    min-height: 88px;
}

.aisles-cta__card:hover[b-teo67502q3],
.aisles-cta__card:focus-visible[b-teo67502q3] {
    background-color: rgba(217, 137, 71, 0.08);
    border-color: var(--mn-gold);
    color: var(--mn-text-primary);
    text-decoration: none;
    transform: translateY(-2px);
}

.aisles-cta__icon[b-teo67502q3] {
    color: var(--mn-gold);
    font-size: var(--mn-text-xl);
}

.aisles-cta__label[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-semibold);
    font-size: var(--mn-text-base);
}

.aisles-cta__hint[b-teo67502q3] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
}

.aisles-cta__footer[b-teo67502q3] {
    margin: var(--mn-space-5) 0 0;
    font-family: var(--mn-font-body);
    font-style: italic;
    color: var(--mn-text-secondary);
}

.aisles-cta__footer a[b-teo67502q3] {
    color: var(--mn-gold);
    text-decoration: none;
}

.aisles-cta__footer a:hover[b-teo67502q3],
.aisles-cta__footer a:focus-visible[b-teo67502q3] {
    text-decoration: underline;
}

/* === State cards (empty / error). === */
.aisles-empty[b-teo67502q3],
.aisles-error[b-teo67502q3] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-xl);
    padding: var(--mn-space-8) var(--mn-space-6);
    text-align: center;
    margin: var(--mn-space-8) auto;
    max-width: 50ch;
}

.aisles-empty__body[b-teo67502q3],
.aisles-error__body[b-teo67502q3] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-base);
    line-height: 1.7;
    color: var(--mn-text-primary);
    margin: var(--mn-space-3) 0 var(--mn-space-4) 0;
}

.aisles-empty__body a[b-teo67502q3] {
    color: var(--mn-gold);
}
/* /Pages/AskMidnette.razor.rz.scp.css */
.ask-midnette-page[b-6fn1xp7t18] {
    height: calc(100vh - 60px);
    display: flex;
    flex-direction: column;
}

.ask-midnette-page > .d-flex[b-6fn1xp7t18] {
    flex: 1;
    min-height: 0;
}

/* Sidebar */
.conversation-sidebar[b-6fn1xp7t18] {
    width: 260px;
    flex-shrink: 0;
    border-right: 1px solid var(--mn-border-color);
    background: var(--mn-bg-surface);
}

.sidebar-header[b-6fn1xp7t18] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--mn-border-color);
}

.sidebar-title[b-6fn1xp7t18] {
    font-size: 1rem;
    margin: 0;
    color: var(--mn-gold);
}

.conversation-list[b-6fn1xp7t18] {
    padding: 0.5rem;
}

.conversation-item[b-6fn1xp7t18] {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    cursor: pointer;
    margin-bottom: 2px;
    color: var(--mn-text-body);
    transition: background-color 0.15s;
}

.conversation-item:hover[b-6fn1xp7t18] {
    background: var(--mn-bg-body);
}

.conversation-item.active[b-6fn1xp7t18] {
    background: var(--mn-navy);
    color: white;
}

.conv-title[b-6fn1xp7t18] {
    display: block;
    font-size: 0.85rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.conv-meta[b-6fn1xp7t18] {
    display: block;
    font-size: 0.72rem;
    opacity: 0.6;
}

/* Main chat area */
.chat-main[b-6fn1xp7t18] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.chat-page-header[b-6fn1xp7t18] {
    background: var(--mn-navy);
    padding: 0.6rem 1.5rem;
    flex-shrink: 0;
}

.chat-page-title[b-6fn1xp7t18] {
    color: var(--mn-gold);
    font-size: 1.2rem;
    margin: 0;
}

.chat-header-btn[b-6fn1xp7t18] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.1rem;
}

.chat-header-btn:hover[b-6fn1xp7t18] {
    color: #fff;
}

/* Messages area — fills remaining space, scrolls */
.chat-messages[b-6fn1xp7t18] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1.5rem;
    background-color: var(--mn-bg-body);
}

.welcome-section[b-6fn1xp7t18] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100%;
    text-align: center;
    padding: 2rem 1rem;
}

.welcome-title[b-6fn1xp7t18] {
    font-size: 2rem;
    color: var(--mn-gold);
    margin-bottom: 0.5rem;
}

.welcome-text[b-6fn1xp7t18] {
    font-size: 0.95rem;
    color: var(--mn-text-body);
    opacity: 0.7;
    max-width: 400px;
    margin-bottom: 1.5rem;
}

[b-6fn1xp7t18] .chat-book-results {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: 85%;
}

/* Input area — pinned to bottom */
.chat-input-area[b-6fn1xp7t18] {
    padding: 0.75rem 1.5rem;
    border-top: 1px solid var(--mn-border-color);
    background: var(--mn-bg-surface);
    flex-shrink: 0;
}

.chat-input[b-6fn1xp7t18] {
    border-radius: 1.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    border: 1px solid var(--mn-border-color);
    background-color: var(--mn-bg-body);
    color: var(--mn-text-body);
}

.chat-input:focus[b-6fn1xp7t18] {
    border-color: var(--mn-gold);
    box-shadow: 0 0 0 0.15rem rgba(var(--mn-gold-rgb, 212, 175, 55), 0.25);
}

.chat-send-btn[b-6fn1xp7t18] {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0;
}

/* Mobile sidebar overlay */
.mobile-sidebar-backdrop[b-6fn1xp7t18] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 100;
}

.mobile-sidebar[b-6fn1xp7t18] {
    position: fixed;
    top: 60px;
    left: 0;
    bottom: 0;
    width: 280px;
    background: var(--mn-bg-surface);
    z-index: 101;
    box-shadow: var(--mn-shadow-lg);
    overflow-y: auto;
    animation: slide-in-b-6fn1xp7t18 0.2s ease-out;
}

@keyframes slide-in-b-6fn1xp7t18 {
    from { transform: translateX(-100%); }
    to { transform: translateX(0); }
}

/* Mobile */
@media (max-width: 767px) {
    .chat-messages[b-6fn1xp7t18] {
        padding: 1rem;
    }

    .chat-input-area[b-6fn1xp7t18] {
        padding: 0.5rem 1rem;
    }

    .chat-page-header[b-6fn1xp7t18] {
        padding: 0.5rem 1rem;
    }
}
/* /Pages/AudiobookListen.razor.rz.scp.css */
/* ============================================================
   Listen / Audiobook page — "Backroom" Immersive (Direction B)
   Hero + stacked sections. Mobile-first: centered single column;
   two-column hero at >=1080px.
   Tokens: ember = --mn-gold, playhead = --mn-gold-light,
   ink/ink-2/ink-3 = --mn-bg-body/-surface/-surface-alt,
   rouge = --mn-danger, paper = --mn-text-primary,
   mute/mute-2 = --mn-text-secondary/-tertiary,
   line/line-2 = --mn-border-default/-strong.
   Display = Merriweather italic (--mn-font-body); labels = --mn-font-mono.
   ============================================================ */

.listen-room[b-jqlzlf0nap] {
    padding-bottom: 5rem;
}

/* --- Chrome header (static — scrolls away; the global nav is the fixed top chrome) --- */
.listen-chrome[b-jqlzlf0nap] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--mn-border-default);
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.listen-chrome__back[b-jqlzlf0nap],
.listen-chrome__lib[b-jqlzlf0nap] {
    color: var(--mn-text-secondary);
    text-decoration: none;
    white-space: nowrap;
}

.listen-chrome__back:hover[b-jqlzlf0nap],
.listen-chrome__lib:hover[b-jqlzlf0nap] {
    color: var(--mn-gold);
}

.listen-chrome__lib[b-jqlzlf0nap] {
    justify-self: end;
}

.listen-chrome__brand[b-jqlzlf0nap] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1rem;
    letter-spacing: 0;
    text-transform: none;
    color: var(--mn-text-primary);
    text-align: center;
    white-space: nowrap;
}

.listen-chrome__dot[b-jqlzlf0nap] {
    color: var(--mn-gold);
}

.listen-chrome__sub[b-jqlzlf0nap] {
    color: var(--mn-text-secondary);
    display: none;
}

/* --- Hero --- */
.listen-hero[b-jqlzlf0nap] {
    position: relative;
    overflow: hidden;
    padding: 2.5rem 1rem 2rem;
}

.listen-hero__glow[b-jqlzlf0nap] {
    position: absolute;
    top: -120px;
    left: 50%;
    transform: translateX(-50%);
    width: 720px;
    max-width: 130%;
    height: 460px;
    background: radial-gradient(ellipse, rgba(var(--mn-gold-rgb), 0.16), transparent 68%);
    filter: blur(20px);
    z-index: 0;
    pointer-events: none;
}

.listen-hero__inner[b-jqlzlf0nap] {
    position: relative;
    z-index: 1;
    max-width: 1180px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1.75rem;
}

.listen-hero__cover-col[b-jqlzlf0nap] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.listen-hero__details[b-jqlzlf0nap] {
    min-width: 0;
    width: 100%;
}

/* --- Cover --- */
.listen-cover[b-jqlzlf0nap] {
    position: relative;
    flex-shrink: 0;
    display: block;
    border-radius: 2px 4px 4px 2px;
    overflow: hidden;
    box-shadow:
        0 2px 5px rgba(0, 0, 0, 0.55),
        0 26px 70px rgba(0, 0, 0, 0.6),
        inset -3px 0 6px rgba(0, 0, 0, 0.4),
        inset 3px 0 0 rgba(255, 255, 255, 0.06);
}

.listen-cover--hero[b-jqlzlf0nap] {
    width: 190px;
    aspect-ratio: 2 / 3;
}

.listen-cover img[b-jqlzlf0nap] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.listen-cover__frame[b-jqlzlf0nap] {
    position: absolute;
    inset: 7% 8%;
    border: 1px solid var(--mn-gold);
    opacity: 0.4;
    pointer-events: none;
}

.listen-cover__heat[b-jqlzlf0nap] {
    position: absolute;
    top: 6%;
    right: 7%;
    font-size: 0.7rem;
    letter-spacing: 1px;
    color: var(--mn-danger);
    pointer-events: none;
}

/* --- Rating --- */
.listen-rating[b-jqlzlf0nap] {
    display: flex;
    gap: 0.7rem;
    align-items: center;
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.06em;
    color: var(--mn-text-secondary);
}

.listen-rating__stars[b-jqlzlf0nap] {
    color: var(--mn-gold-light);
}

/* --- Chips --- */
.listen-chips[b-jqlzlf0nap] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.listen-chip[b-jqlzlf0nap] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.listen-chip--accent[b-jqlzlf0nap] {
    color: var(--mn-gold);
}

.listen-chip__div[b-jqlzlf0nap] {
    width: 1px;
    height: 12px;
    background: var(--mn-border-strong);
}

.listen-heat[b-jqlzlf0nap] {
    color: var(--mn-danger);
    letter-spacing: 1px;
}

/* --- Title --- */
.listen-title[b-jqlzlf0nap] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-weight: 500;
    letter-spacing: -0.02em;
    margin: 0 0 0.75rem;
}

.listen-title--hero[b-jqlzlf0nap] {
    font-size: clamp(2.6rem, 9vw, 5rem);
    line-height: 0.94;
}

.listen-title a[b-jqlzlf0nap] {
    color: var(--mn-text-primary);
    text-decoration: none;
}

.listen-title a:hover[b-jqlzlf0nap] {
    color: var(--mn-gold);
}

/* --- Byline --- */
.listen-byline[b-jqlzlf0nap] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    gap: 0.4rem 1.1rem;
    font-family: var(--mn-font-body);
    font-size: 1.05rem;
    color: var(--mn-text-secondary);
    margin: 0 0 1rem;
}

.listen-byline a[b-jqlzlf0nap] {
    color: var(--mn-text-primary);
    text-decoration: none;
    border-bottom: 1px solid var(--mn-border-strong);
}

.listen-byline a:hover[b-jqlzlf0nap] {
    border-bottom-color: var(--mn-gold);
}

.listen-byline__narrator[b-jqlzlf0nap] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mn-gold);
}

/* --- Facts row --- */
.listen-facts[b-jqlzlf0nap] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.75rem 1.3rem;
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--mn-border-default);
}

.listen-facts__free[b-jqlzlf0nap] {
    color: var(--mn-gold);
}

.listen-facts__read[b-jqlzlf0nap] {
    color: var(--mn-text-primary);
    text-decoration: none;
    border: 1px solid var(--mn-border-strong);
    padding: 0.35rem 0.7rem;
}

.listen-facts__read:hover[b-jqlzlf0nap] {
    border-color: var(--mn-gold);
    color: var(--mn-gold);
}

/* --- Register-to-listen gate --- */
.listen-gate[b-jqlzlf0nap] {
    border: 1px solid var(--mn-gold);
    background: var(--mn-bg-surface);
    text-align: center;
    padding: 2.5rem 1.25rem;
    margin-top: 1.75rem;
}

.listen-gate__icon[b-jqlzlf0nap] {
    font-size: 2.25rem;
    color: var(--mn-gold);
}

.listen-gate__title[b-jqlzlf0nap] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-weight: 500;
    font-size: 1.5rem;
    margin: 1rem 0 0.5rem;
}

.listen-gate__copy[b-jqlzlf0nap] {
    color: var(--mn-text-secondary);
    margin-bottom: 1.5rem;
}

.listen-gate__actions[b-jqlzlf0nap] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    justify-content: center;
}

/* --- Now Playing block --- */
.listen-np[b-jqlzlf0nap] {
    margin-top: 1.75rem;
}

.listen-np__label[b-jqlzlf0nap] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    margin-bottom: 0.6rem;
}

.listen-np__title[b-jqlzlf0nap] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-weight: 500;
    font-size: clamp(1.5rem, 5vw, 2.1rem);
    line-height: 1.05;
    margin: 0 0 0.6rem;
}

.listen-np__syn[b-jqlzlf0nap] {
    font-family: var(--mn-font-body);
    font-size: 0.975rem;
    line-height: 1.5;
    color: var(--mn-text-secondary);
    margin: 0 auto 1.25rem;
    max-width: 40rem;
}

.listen-np__read[b-jqlzlf0nap] {
    display: inline-block;
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--mn-gold);
    text-decoration: none;
    margin-bottom: 1.25rem;
}

.listen-np__read:hover[b-jqlzlf0nap] {
    color: var(--mn-gold-light);
}

.listen-np__upnext[b-jqlzlf0nap] {
    margin-top: 1.5rem;
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
}

.listen-np__upnext-title[b-jqlzlf0nap] {
    color: var(--mn-text-primary);
}

/* --- Resumed notice (silent auto-resume + "Start over" escape hatch) --- */
.listen-resumed[b-jqlzlf0nap] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5rem 0.9rem;
    margin-bottom: 0.9rem;
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.listen-resumed__txt[b-jqlzlf0nap] {
    color: var(--mn-gold);
}

.listen-resumed__btn[b-jqlzlf0nap] {
    border: 1px solid var(--mn-border-strong);
    background: transparent;
    color: var(--mn-text-secondary);
    font-family: inherit;
    font-size: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    padding: 0.3rem 0.6rem;
    min-height: 32px;
    cursor: pointer;
}

.listen-resumed__btn:hover[b-jqlzlf0nap] {
    border-color: var(--mn-gold);
    color: var(--mn-gold);
}

@media (min-width: 1080px) {
    .listen-resumed[b-jqlzlf0nap] {
        justify-content: flex-start;
    }
}

/* --- EQ bars --- */
.listen-eq[b-jqlzlf0nap] {
    display: inline-flex;
    align-items: flex-end;
    gap: 1.5px;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.listen-eq i[b-jqlzlf0nap] {
    flex: 1;
    background: var(--mn-gold);
    border-radius: 1px;
}

.listen-eq i:nth-child(1)[b-jqlzlf0nap] { height: 45%; }
.listen-eq i:nth-child(2)[b-jqlzlf0nap] { height: 75%; }
.listen-eq i:nth-child(3)[b-jqlzlf0nap] { height: 55%; }

@media (prefers-reduced-motion: no-preference) {
    .listen-eq.is-playing i[b-jqlzlf0nap] {
        animation: listenEq-b-jqlzlf0nap 0.9s ease-in-out infinite;
    }

    .listen-eq.is-playing i:nth-child(2)[b-jqlzlf0nap] { animation-delay: 0.18s; }
    .listen-eq.is-playing i:nth-child(3)[b-jqlzlf0nap] { animation-delay: 0.36s; }
}

@keyframes listenEq-b-jqlzlf0nap {
    0%, 100% { height: 35%; }
    50% { height: 100%; }
}

/* --- Sections (transcript / tracklist) --- */
.listen-section[b-jqlzlf0nap] {
    max-width: 1180px;
    margin: 0 auto;
    padding: 1.5rem 1rem 0;
}

.listen-section__head[b-jqlzlf0nap] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--mn-border-strong);
}

.listen-section__title[b-jqlzlf0nap] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-weight: 500;
    font-size: clamp(1.4rem, 4.5vw, 1.85rem);
    line-height: 1.1;
    margin: 0.4rem 0 0;
}

.listen-section__meta[b-jqlzlf0nap] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
    text-align: right;
    white-space: nowrap;
}

/* --- Tracklist --- */
.listen-tracklist[b-jqlzlf0nap] {
    border: 1px solid var(--mn-border-strong);
}

.listen-track[b-jqlzlf0nap] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    text-align: left;
    padding: 0.85rem 1.1rem;
    min-height: 56px;
    border: none;
    border-bottom: 1px solid var(--mn-border-default);
    border-left: 2px solid transparent;
    background: transparent;
    color: var(--mn-text-primary);
    cursor: pointer;
    transition: background 0.15s ease;
}

.listen-track:last-child[b-jqlzlf0nap] {
    border-bottom: none;
}

.listen-track:hover[b-jqlzlf0nap] {
    background: rgba(var(--mn-gold-rgb), 0.06);
}

.listen-track.is-active[b-jqlzlf0nap] {
    border-left-color: var(--mn-gold);
    background: rgba(var(--mn-gold-rgb), 0.10);
}

.listen-track__lead[b-jqlzlf0nap] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
    flex-wrap: wrap;
}

.listen-track__idx[b-jqlzlf0nap] {
    font-family: var(--mn-font-mono);
    font-size: 0.75rem;
    color: var(--mn-text-secondary);
    width: 18px;
    flex-shrink: 0;
}

.listen-track__title[b-jqlzlf0nap] {
    font-family: var(--mn-font-body);
    font-size: 1.0625rem;
}

.listen-track.is-active .listen-track__title[b-jqlzlf0nap] {
    font-style: italic;
    color: var(--mn-gold);
}

.listen-track__vtt[b-jqlzlf0nap],
.listen-track__linked[b-jqlzlf0nap] {
    font-family: var(--mn-font-mono);
    font-size: 0.5625rem;
    letter-spacing: 0.06em;
    color: var(--mn-text-tertiary);
    white-space: nowrap;
}

.listen-track__vtt[b-jqlzlf0nap] {
    color: var(--mn-text-secondary);
}

.listen-track__dur[b-jqlzlf0nap] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-text-secondary);
    flex-shrink: 0;
}

.listen-track.is-active .listen-track__dur[b-jqlzlf0nap] {
    color: var(--mn-gold);
}

/* --- Tablet polish --- */
@media (min-width: 768px) {
    .listen-chrome[b-jqlzlf0nap] {
        padding: 0.9rem 2rem;
    }

    .listen-chrome__sub[b-jqlzlf0nap] {
        display: inline;
    }

    .listen-hero[b-jqlzlf0nap] {
        padding: 3.5rem 2rem 2.5rem;
    }

    .listen-section[b-jqlzlf0nap] {
        padding: 2rem 2rem 0;
    }
}

/* --- Desktop: two-column hero, left-aligned details --- */
@media (min-width: 1080px) {
    .listen-hero[b-jqlzlf0nap] {
        padding: 3.75rem 3rem 3.25rem;
    }

    .listen-hero__inner[b-jqlzlf0nap] {
        display: grid;
        grid-template-columns: 340px 1fr;
        gap: 3.75rem;
        align-items: center;
        text-align: left;
    }

    .listen-cover--hero[b-jqlzlf0nap] {
        width: 340px;
    }

    .listen-hero__details[b-jqlzlf0nap] {
        text-align: left;
    }

    .listen-chips[b-jqlzlf0nap],
    .listen-byline[b-jqlzlf0nap],
    .listen-facts[b-jqlzlf0nap],
    .listen-np__label[b-jqlzlf0nap] {
        justify-content: flex-start;
    }

    .listen-np__syn[b-jqlzlf0nap] {
        margin-left: 0;
        margin-right: 0;
    }

    .listen-section[b-jqlzlf0nap] {
        padding: 2.5rem 3rem 0;
    }
}
/* /Pages/Author/AuthorPublic.razor.rz.scp.css */
/* ================================================================
   AuthorPublic — page-specific layout only.

   Backroom typographic primitives (.mn-breadcrumb, .mn-hero-title,
   .mn-hero-byline, .mn-section-eyebrow, .mn-section-headline,
   .mn-section-header-row, .mn-tag, .mn-meta-badge) live in app.css
   and are used directly in the markup. Do NOT redefine them here.

   This file is reserved for compositions that are genuinely
   AuthorPublic-only: the avatar/banner overlap geometry, the mono
   stat-row composition, the social-link rows, and the bio prose
   container. None of these are reusable enough to deserve global
   classes — if they ever are, promote them to app.css.
   ================================================================ */

/* ===== Avatar column — overlaps the banner.
   Mobile (centered, -60px overlap) → ≥sm (left-aligned, -75px overlap). */
.mn-author-avatar-col[b-k98yg4ive0] {
    margin-top: -60px;
    z-index: 10;
}
@media (min-width: 576px) {
    .mn-author-avatar-col[b-k98yg4ive0] {
        margin-top: -75px;
    }
}

/* ===== Identity actions (Follow + collab badge). On mobile they stack
   under the name; on ≥md they sit right-aligned beside it via flex. */
.mn-author-actions[b-k98yg4ive0] {
    flex-shrink: 0;
}

/* ===== Stat row — mono uppercase value + label pairs separated by dots.
   Composition mirrors the PDP author-panel "9 books · 28.4k followers"
   pattern (backroom-pdp.jsx:607–609) but split into value/label spans so
   the value can adopt the paper colour and the label can stay tertiary. */
.mn-author-stats[b-k98yg4ive0] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.85rem;
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
}

.mn-author-stat[b-k98yg4ive0] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4em;
    position: relative;
}

/* Bullet separator between stats — drawn between (not after) so the final
   stat doesn't dangle a dot at the end of the row. */
.mn-author-stat + .mn-author-stat[b-k98yg4ive0]::before {
    content: "·";
    margin-right: 0.85rem;
    color: var(--mn-text-tertiary);
    opacity: 0.55;
}

.mn-author-stat__val[b-k98yg4ive0] {
    color: var(--mn-text-secondary);
    font-weight: 500;
}

.mn-author-stat__label[b-k98yg4ive0] {
    color: var(--mn-text-tertiary);
}

/* ===== Social-link rows — platform label (mono, left) + handle (serif,
   middle) + arrow (right). Stacks vertically; one row per platform. */
.mn-author-links[b-k98yg4ive0] {
    gap: 0;
    border-top: 1px solid var(--mn-border-default);
}

.mn-author-link[b-k98yg4ive0] {
    display: grid;
    grid-template-columns: minmax(7rem, 9rem) 1fr auto;
    align-items: baseline;
    gap: 1rem;
    padding: 0.875rem 0;
    border-bottom: 1px solid var(--mn-border-default);
    text-decoration: none;
    color: var(--mn-text-primary);
    transition: color var(--mn-transition-fast), padding-left var(--mn-transition-fast);
}

.mn-author-link:hover[b-k98yg4ive0] {
    color: var(--mn-gold-light);
    padding-left: 0.25rem;
}

.mn-author-link__platform[b-k98yg4ive0] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
}

.mn-author-link:hover .mn-author-link__platform[b-k98yg4ive0] {
    color: var(--mn-gold);
}

.mn-author-link__handle[b-k98yg4ive0] {
    font-family: var(--mn-font-body);
    font-size: 0.9375rem;
    font-weight: 400;
    color: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mn-author-link__arrow[b-k98yg4ive0] {
    font-family: var(--mn-font-mono);
    font-size: 0.875rem;
    color: var(--mn-text-tertiary);
    opacity: 0.6;
    transition: transform var(--mn-transition-fast), opacity var(--mn-transition-fast);
}

.mn-author-link:hover .mn-author-link__arrow[b-k98yg4ive0] {
    color: var(--mn-gold);
    opacity: 1;
    transform: translateX(3px);
}

/* On <576px, collapse the platform column under the handle for breathing room. */
@media (max-width: 575.98px) {
    .mn-author-link[b-k98yg4ive0] {
        grid-template-columns: 1fr auto;
        gap: 0.25rem 1rem;
    }
    .mn-author-link__platform[b-k98yg4ive0] {
        grid-column: 1 / -1;
        order: -1;
    }
}

/* ===== Bio prose — Merriweather body, constrained to readable measure. */
.mn-author-bio[b-k98yg4ive0] {
    font-family: var(--mn-font-body);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--mn-text-primary);
    max-width: var(--mn-max-width-prose);
}

/* ===== "Browse all →" inline link on the Shelf section header.
   Uses paper-tinted text with ember on hover — quieter than a btn-outline
   button which would compete with the section headline italics. */
.mn-author-browse-all[b-k98yg4ive0] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
    text-decoration: none;
    transition: color var(--mn-transition-fast);
    white-space: nowrap;
    align-self: end;
    padding-bottom: 0.4rem;
}

.mn-author-browse-all:hover[b-k98yg4ive0] {
    color: var(--mn-gold);
}

.mn-author-browse-all span[b-k98yg4ive0] {
    margin-left: 0.35rem;
    transition: transform var(--mn-transition-fast);
    display: inline-block;
}

.mn-author-browse-all:hover span[b-k98yg4ive0] {
    transform: translateX(3px);
}

/* ===== Safe-area clearance for the responsive-tabs bottom bar (z 1030).
   Page has no fixed bottom chrome of its own — Musings ends the scroll. */
.mn-author-public[b-k98yg4ive0] {
    padding-bottom: calc(var(--mn-space-16) + env(safe-area-inset-bottom, 0px));
}
/* /Pages/Author/BookAnalytics.razor.rz.scp.css */
/* BookAnalytics — page-specific layout only.
   Shared primitives (cards, badges, kpi, tags) come from global app.css. */

@keyframes pulse-b-f7eihkeaxm {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* --- Header row: stacks at <576px, side-by-side from sm up --- */
.analytics-header[b-f7eihkeaxm] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
}

.analytics-header__title[b-f7eihkeaxm] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--mn-space-3);
}

.analytics-header__title h1[b-f7eihkeaxm] {
    font-size: clamp(1.4rem, 5vw, 2rem);
}

.analytics-header__controls[b-f7eihkeaxm] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
    flex-wrap: wrap;
}

.analytics-header__controls .btn-group[b-f7eihkeaxm] {
    /* date-range buttons get equal share on mobile */
    width: auto;
}

@media (min-width: 576px) {
    .analytics-header[b-f7eihkeaxm] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
    }
}

/* live-reader pulsing dot — gold on the green success badge so it shows */
.live-pulse-dot[b-f7eihkeaxm] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--mn-gold);
    animation: pulse-b-f7eihkeaxm 2s infinite;
    display: inline-block;
}

/* --- Tab strip: horizontal scroll instead of wrapping at narrow widths --- */
.analytics-tabs-scroll[b-f7eihkeaxm] {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.analytics-tabs-scroll[b-f7eihkeaxm]::-webkit-scrollbar {
    display: none;
}

.analytics-tabs-scroll .nav-tabs[b-f7eihkeaxm] {
    flex-wrap: nowrap;
    width: max-content;
    min-width: 100%;
    border-bottom: 1px solid var(--mn-border-default);
}

.analytics-tabs-scroll .nav-link[b-f7eihkeaxm] {
    white-space: nowrap;
}

/* --- Chart container heights: shorter on mobile so charts breathe --- */
.analytics-chart-body[b-f7eihkeaxm] {
    position: relative;
    height: 260px;
}

.analytics-chart-body--md[b-f7eihkeaxm] {
    height: 240px;
}

.analytics-chart-body--lg[b-f7eihkeaxm] {
    height: 280px;
}

@media (min-width: 768px) {
    .analytics-chart-body[b-f7eihkeaxm] {
        height: 300px;
    }

    .analytics-chart-body--md[b-f7eihkeaxm] {
        min-height: 300px;
        height: 300px;
    }

    .analytics-chart-body--lg[b-f7eihkeaxm] {
        height: 350px;
    }
}

/* --- Session heatmap canvas: scroll horizontally on narrow widths --- */
.session-heatmap-wrap[b-f7eihkeaxm] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.session-heatmap-wrap canvas[b-f7eihkeaxm] {
    min-width: 480px;
    max-width: 100%;
}

/* --- Day-of-week mini bar chart --- */
.dow-bars[b-f7eihkeaxm] {
    display: flex;
    gap: var(--mn-space-2);
    align-items: flex-end;
    height: 80px;
}

.dow-bar[b-f7eihkeaxm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1 1 0;
    min-width: 0;
}

.dow-bar__count[b-f7eihkeaxm] {
    font-size: 0.7rem;
    color: var(--mn-text-secondary);
    margin-bottom: 0.25rem;
}

.dow-bar__fill[b-f7eihkeaxm] {
    width: 100%;
    min-height: 2px;
    background: linear-gradient(180deg, var(--mn-gold) 0%, var(--mn-gold-dark) 100%);
    border-radius: 2px 2px 0 0;
}

.dow-bar__label[b-f7eihkeaxm] {
    font-size: 0.65rem;
    color: var(--mn-text-tertiary);
    margin-top: 0.25rem;
}

/* --- Chapter performance cards (mobile-only) --- */
.chapter-card-stack[b-f7eihkeaxm] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
    padding: var(--mn-space-3);
}

.chapter-card[b-f7eihkeaxm] {
    background: var(--mn-bg-surface-alt);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-3);
}

.chapter-card__head[b-f7eihkeaxm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--mn-space-2);
    margin-bottom: var(--mn-space-3);
}

.chapter-card__title[b-f7eihkeaxm] {
    display: flex;
    align-items: baseline;
    gap: var(--mn-space-2);
    min-width: 0;
}

.chapter-card__num[b-f7eihkeaxm] {
    color: var(--mn-text-tertiary);
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-sm);
    flex-shrink: 0;
}

.chapter-card__name[b-f7eihkeaxm] {
    color: var(--mn-text-primary);
    font-weight: var(--mn-font-semibold);
    overflow-wrap: anywhere;
    line-height: var(--mn-leading-snug);
}

.chapter-card__heatmap[b-f7eihkeaxm] {
    flex-shrink: 0;
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.chapter-card__stats[b-f7eihkeaxm] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--mn-space-2) var(--mn-space-3);
    margin: 0;
}

.chapter-card__stats > div[b-f7eihkeaxm] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.chapter-card__stats dt[b-f7eihkeaxm] {
    font-size: var(--mn-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--mn-text-tertiary);
    font-weight: var(--mn-font-semibold);
    margin: 0;
}

.chapter-card__stats dd[b-f7eihkeaxm] {
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-sm);
    color: var(--mn-text-primary);
    margin: 0;
}

/* --- Cohort cards (mobile-only) --- */
.cohort-card-stack[b-f7eihkeaxm] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
    padding: var(--mn-space-3);
}

.cohort-card[b-f7eihkeaxm] {
    background: var(--mn-bg-surface-alt);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-3);
}

.cohort-card__head[b-f7eihkeaxm] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: var(--mn-space-3);
    gap: var(--mn-space-2);
}

.cohort-card__week[b-f7eihkeaxm] {
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
}

.cohort-card__readers[b-f7eihkeaxm] {
    color: var(--mn-text-secondary);
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-mono);
}

.cohort-card__grid[b-f7eihkeaxm] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--mn-space-2);
}

.cohort-card__grid > div[b-f7eihkeaxm] {
    text-align: center;
}

/* --- Re-read chapters: single responsive flex list, no table needed --- */
.reread-list[b-f7eihkeaxm] {
    display: flex;
    flex-direction: column;
}

.reread-list__row[b-f7eihkeaxm] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    padding: var(--mn-space-3);
    border-bottom: 1px solid var(--mn-border-light);
}

.reread-list__row:last-child[b-f7eihkeaxm] {
    border-bottom: 0;
}

.reread-list__num[b-f7eihkeaxm] {
    color: var(--mn-text-tertiary);
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-sm);
    flex-shrink: 0;
    min-width: 1.5rem;
}

.reread-list__title[b-f7eihkeaxm] {
    color: var(--mn-text-primary);
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
}

.reread-list__count[b-f7eihkeaxm] {
    color: var(--mn-gold);
    font-weight: var(--mn-font-bold);
    font-family: var(--mn-font-mono);
    flex-shrink: 0;
}

.reread-list__count small[b-f7eihkeaxm] {
    color: var(--mn-text-secondary);
    font-weight: var(--mn-font-regular);
    font-family: var(--mn-font-body);
}

@media (max-width: 575.98px) {
    .reread-list__count small[b-f7eihkeaxm] {
        display: none;
    }

    .reread-list__row[b-f7eihkeaxm] {
        gap: var(--mn-space-2);
    }
}
/* /Pages/Author/BookEdit.razor.rz.scp.css */
/* =============================================
   BookEdit — Chapters/Content tab body styles.

   Sticky header + publish wizard styles moved into
   Components/Author/BookEditPublishHeader.razor.css because the chrome
   now lives on five sibling routes, not just /edit.

   (.book-edit-save-bar styles live in global app.css because Blazor CSS isolation
    on a position:fixed viewport element was failing to surface across hot-reload
    boundaries.)
   ============================================= */

/* Utility for overflow control — kept here because the content tab's chapter
   list rows use it for ellipsis-safe layout. */
.min-width-0[b-642mtrwxj6] {
    min-width: 0;
}
/* /Pages/Author/ChapterHeatmap.razor.rz.scp.css */
.heatmap-paragraph[b-pzfxfh1p07] {
    display: flex;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.25rem;
    border-radius: 0 4px 4px 0;
    transition: background-color 0.15s ease;
}

.heatmap-paragraph:hover[b-pzfxfh1p07] {
    background-color: var(--mn-bg-surface-alt, #f5f3f0);
}

.heatmap-paragraph.selected[b-pzfxfh1p07] {
    background-color: var(--mn-bg-inset, #ede9e3);
}

.heatmap-index[b-pzfxfh1p07] {
    flex-shrink: 0;
    width: 2rem;
    text-align: right;
    font-size: 0.75rem;
    padding-top: 0.2rem;
}

.heatmap-text[b-pzfxfh1p07] {
    flex: 1;
    font-size: 0.9rem;
    line-height: 1.6;
}
/* /Pages/Author/ChapterManage.razor.rz.scp.css */
/* =============================================
   ChapterManage — Sticky Header + Layout
   ============================================= */

/* --- Sticky Header --- */
.chapter-manage-sticky-header[b-b525la94m3] {
    position: sticky;
    top: var(--mn-header-height-compact, 56px);
    z-index: var(--mn-z-sticky, 1020);
    background: var(--mn-bg-surface, #ffffff);
    border-bottom: 1px solid var(--mn-border-default, #e8e4dd);
    box-shadow: var(--mn-shadow-sm);
    padding: var(--mn-space-3, 0.75rem) 0;
    margin: 0 calc(-1 * var(--mn-space-4, 1rem));
    padding-left: var(--mn-space-4, 1rem);
    padding-right: var(--mn-space-4, 1rem);
    margin-bottom: var(--mn-space-4, 1rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mn-space-3, 0.75rem);
    flex-wrap: wrap;
}

.chapter-manage-sticky-title[b-b525la94m3] {
    font-family: var(--mn-font-system, system-ui, sans-serif);
    font-size: var(--mn-text-lg, 1.125rem);
    font-weight: var(--mn-font-semibold, 600);
    color: var(--mn-text-primary, #1f1b16);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 400px;
}

/* Chapter info bar */
.chapter-info-bar[b-b525la94m3] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-4, 1rem);
    color: var(--mn-text-tertiary, #918a7e);
    font-size: var(--mn-text-sm, 0.875rem);
    margin-bottom: var(--mn-space-3, 0.75rem);
}

/* Utility for overflow control */
.min-width-0[b-b525la94m3] {
    min-width: 0;
}

/* Mobile: compress sticky header */
@media (max-width: 575.98px) {
    .chapter-manage-sticky-title[b-b525la94m3] {
        font-size: var(--mn-text-base, 1rem);
        max-width: 180px;
    }
}
/* /Pages/Author/Dashboard.razor.rz.scp.css */
/* Let BookHoverCard pop out of table-responsive on desktop.
   Hover cards are already hidden on touch/mobile via @media (hover: none)
   in app.css, so this only affects desktop where overflow is needed. */
@media (hover: hover) and (min-width: 768px) {
    .table-responsive[b-5fcl55rzl1] {
        overflow: visible;
    }
}

/* ── Dashboard header ───────────────────────────────── */
.dash-header[b-5fcl55rzl1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dash-header__actions[b-5fcl55rzl1] {
    display: flex;
    gap: 0.5rem;
}

@media (max-width: 575.98px) {
    .dash-header[b-5fcl55rzl1] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .dash-header h1[b-5fcl55rzl1] {
        font-size: 1.5rem;
        margin-bottom: 0;
    }

    .dash-header__actions[b-5fcl55rzl1] {
        width: 100%;
    }

    .dash-header__actions .btn[b-5fcl55rzl1] {
        flex: 1;
    }
}

/* ── Section headers (Pen Names, Books, etc.) ───────── */
.dash-section-header[b-5fcl55rzl1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

@media (max-width: 575.98px) {
    .dash-section-header h2[b-5fcl55rzl1] {
        font-size: 1.35rem;
    }
}

/* ── Mobile pen-name rows ───────────────────────────── */
.pen-name-row[b-5fcl55rzl1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    text-decoration: none;
    color: inherit;
}

.pen-name-row:last-child[b-5fcl55rzl1] {
    border-bottom: none;
}

.pen-name-row:hover[b-5fcl55rzl1],
.pen-name-row:active[b-5fcl55rzl1] {
    color: inherit;
    text-decoration: none;
}

.pen-name-row__avatar[b-5fcl55rzl1] {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    object-fit: cover;
}

/* bootstrap-eradication: REVIEW var(--bs-secondary) — should migrate to --mn-* token */
.pen-name-row__avatar--placeholder[b-5fcl55rzl1] {
    background-color: var(--bs-secondary, #6c757d);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--mn-white, #fff);
    font-weight: 600;
    font-size: 0.85rem;
}

.pen-name-row__body[b-5fcl55rzl1] {
    flex: 1;
    min-width: 0;
}

.pen-name-row__name[b-5fcl55rzl1] {
    font-weight: 600;
    font-size: 0.9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pen-name-row__name .badge[b-5fcl55rzl1] {
    font-size: 0.65rem;
    vertical-align: middle;
    margin-left: 0.25rem;
}

/* ── Paginator ──────────────────────────────────────── */
.dash-paginator[b-5fcl55rzl1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media (max-width: 575.98px) {
    .dash-paginator[b-5fcl55rzl1] {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
    }
}

/* ── Mobile book card list ──────────────────────────── */
.book-card-mobile[b-5fcl55rzl1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    text-decoration: none;
    color: inherit;
    transition: background-color 0.15s;
}

.book-card-mobile:last-child[b-5fcl55rzl1] {
    border-bottom: none;
}

.book-card-mobile:hover[b-5fcl55rzl1],
.book-card-mobile:active[b-5fcl55rzl1] {
    background-color: var(--bs-tertiary-bg, #f8f9fa);
    color: inherit;
    text-decoration: none;
}

.book-card-mobile__cover[b-5fcl55rzl1] {
    flex-shrink: 0;
    width: 48px;
}

.book-card-mobile__body[b-5fcl55rzl1] {
    flex: 1;
    min-width: 0;
}

.book-card-mobile__title[b-5fcl55rzl1] {
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.book-card-mobile__author[b-5fcl55rzl1] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.book-card-mobile__badges[b-5fcl55rzl1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.book-card-mobile__badges .badge[b-5fcl55rzl1] {
    font-size: 0.7rem;
}

.book-card-mobile__chevron[b-5fcl55rzl1] {
    flex-shrink: 0;
    font-size: 1rem;
}
/* /Pages/Book/BookDetail.razor.rz.scp.css */
/* ================================================================
   Book Detail Page — Backroom Scoped Styles
   Uses --mn-* tokens exclusively. Linear layout, no tabs.
   ================================================================ */

.book-detail-page[b-x2gbet1622] {
    background: var(--mn-bg-body);
    color: var(--mn-text-primary);
    font-family: var(--mn-font-body);
    /* Pull out of the default page container so sections can be full-bleed */
    margin: calc(var(--mn-space-4) * -1) calc(var(--mn-space-3) * -1) 0;
}

/* ===== BREADCRUMB ===== */
/* Typography + colours come from the global .mn-breadcrumb primitive (app.css).
   This block ONLY layers full-bleed page treatment on top: hero padding and
   the dividing border under the strip. Do NOT re-add typography here. */
.book-breadcrumb[b-x2gbet1622] {
    padding: var(--mn-space-4) var(--mn-space-6);
    border-bottom: 1px solid var(--mn-border-default);
    margin-bottom: 0;
}

/* ===== HERO ===== */
.book-hero[b-x2gbet1622] {
    padding: var(--mn-space-7) var(--mn-space-6) var(--mn-space-6);
}

.book-hero-grid[b-x2gbet1622] {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: var(--mn-space-8);
    align-items: flex-start;
    max-width: 1240px;
    margin: 0 auto;
}

@media (max-width: 991.98px) {
    .book-hero-grid[b-x2gbet1622] {
        grid-template-columns: 260px 1fr;
        gap: var(--mn-space-6);
    }
}

@media (max-width: 767.98px) {
    .book-hero[b-x2gbet1622] { padding: var(--mn-space-5) var(--mn-space-4) var(--mn-space-5); }
    .book-hero-grid[b-x2gbet1622] {
        grid-template-columns: 1fr;
        gap: var(--mn-space-5);
    }
}

.book-hero-cover[b-x2gbet1622] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-4);
}

@media (max-width: 767.98px) {
    .book-hero-cover[b-x2gbet1622] { align-items: center; }
    .book-hero-cover > :first-child[b-x2gbet1622] { max-width: 240px; }
}

/* ── Format list under cover ── */
.book-format-list[b-x2gbet1622] {
    width: 100%;
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mn-text-secondary);
}

.book-format-list__heading[b-x2gbet1622] {
    color: var(--mn-gold);
    letter-spacing: 0.18em;
    margin-bottom: var(--mn-space-2);
    font-weight: var(--mn-font-semibold);
}

.book-format-list__row[b-x2gbet1622] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.6rem 0;
    border-top: 1px solid var(--mn-border-default);
    gap: 0.75rem;
}

.book-format-list__label[b-x2gbet1622] {
    white-space: nowrap;
}

.book-format-list__price[b-x2gbet1622] {
    color: var(--mn-text-primary);
    letter-spacing: 0.06em;
    text-transform: none;
    white-space: nowrap;
}

.book-format-list__price em[b-x2gbet1622] {
    color: var(--mn-gold);
    font-style: italic;
}

.book-format-list__sep[b-x2gbet1622] {
    margin: 0 0.25rem;
    color: var(--mn-text-tertiary);
    opacity: 0.5;
}

.book-format-list__tokens[b-x2gbet1622] {
    color: var(--mn-gold);
}

.cover-actions[b-x2gbet1622] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-2);
}

/* Quiet "Report content" affordance — text-link styling, full-width ≥44px tap target on mobile. */
.report-content-link[b-x2gbet1622] {
    background: none;
    border: none;
    color: var(--mn-text-tertiary);
    font-size: var(--mn-text-sm);
    padding: 0.625rem 0.5rem;
    margin-top: var(--mn-space-2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    cursor: pointer;
    border-radius: var(--mn-radius-sm);
    min-height: 44px;
    transition: color 120ms ease, background-color 120ms ease;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(240, 232, 216, 0.12);
}

.report-content-link:hover[b-x2gbet1622],
.report-content-link:focus-visible[b-x2gbet1622] {
    color: var(--mn-text-secondary);
    text-decoration-color: var(--mn-text-secondary);
}

.report-content-link i[b-x2gbet1622] {
    font-size: 0.95rem;
    opacity: 0.7;
}

/* ── Hero details ── */
.book-hero-details[b-x2gbet1622] {
    min-width: 0;
}

.book-series-eyebrow[b-x2gbet1622] {
    font-family: var(--mn-font-mono);
    font-size: 0.75rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-3);
}

.book-series-eyebrow a[b-x2gbet1622] {
    color: inherit;
    text-decoration: none;
}

.book-series-eyebrow a:hover[b-x2gbet1622] {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.book-hero-title-row[b-x2gbet1622] {
    display: flex;
    align-items: flex-start;
    gap: var(--mn-space-2);
}

/* Typography comes from .mn-hero-title + .mn-hero-title--display (app.css).
   The page only needs to strip the global bottom margin so the title sits flush
   against the byline beneath. */
.book-hero-title[b-x2gbet1622] {
    margin: 0;
}

.book-admin-link[b-x2gbet1622] {
    flex-shrink: 0;
    margin-top: 0.5rem;
}

.book-hero-subtitle[b-x2gbet1622] {
    font-family: var(--mn-font-body);
    font-size: 1.15rem;
    color: var(--mn-text-secondary);
    font-style: italic;
    margin: var(--mn-space-2) 0 0 0;
}

/* Typography + link styling come from .mn-hero-byline (app.css). The page only
   needs to flip the margin from bottom (global) to top — the byline sits below
   the title in this layout. */
.book-hero-author[b-x2gbet1622] {
    margin: var(--mn-space-3) 0 0 0;
}

.author-avatar-inline[b-x2gbet1622] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    vertical-align: middle;
}

/* ── Badge row ── */
.book-hero-badges[b-x2gbet1622] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-2);
    align-items: center;
    margin-top: var(--mn-space-4);
}

/* Hero metadata badges (Type / Format / Rating / Complete) use the global
   .mn-meta-badge primitive — see app.css § Tag primitives. */

/* ── Social proof ── */
.book-social-proof[b-x2gbet1622] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-5);
    align-items: center;
    margin-top: var(--mn-space-4);
    padding: var(--mn-space-3) 0;
    border-top: 1px solid var(--mn-border-strong);
    border-bottom: 1px solid var(--mn-border-strong);
    font-family: var(--mn-font-body);
}

.sp-rating[b-x2gbet1622] {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.sp-rating__num[b-x2gbet1622] {
    font-family: var(--mn-font-body);
    font-size: 1.05rem;
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
}

.sp-rating__count[b-x2gbet1622] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-text-tertiary);
    letter-spacing: 0.06em;
}

.sp-item[b-x2gbet1622] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-text-secondary);
    letter-spacing: 0.06em;
    text-decoration: none;
    text-transform: none;
}

/* Only anchors get the hover affordance — bare spans stay as stats. */
a.sp-item:hover[b-x2gbet1622] {
    color: var(--mn-gold-light);
}

.sp-glyph[b-x2gbet1622] {
    color: var(--mn-gold);
    font-size: 0.85em;
}

/* ── Urgency signals ── */
.urgency-signals[b-x2gbet1622] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-2);
    margin-top: var(--mn-space-3);
}

/* Urgency signals use .mn-meta-badge--success / --ember globals + .mn-pulse-dot */

/* ── Synopsis ── */
.synopsis-text[b-x2gbet1622] {
    font-family: var(--mn-font-body);
    font-size: 1.3125rem;
    line-height: 1.6;
    color: var(--mn-text-primary);
    font-weight: var(--mn-font-light);
    max-width: 65ch;
    margin: var(--mn-space-5) 0 0;
}

/* ── Featured review snippet ── */
.featured-review-snippet[b-x2gbet1622] {
    display: block;
    border-left: 3px solid var(--mn-gold);
    padding: var(--mn-space-3) var(--mn-space-4);
    background: var(--mn-bg-surface);
    margin-top: var(--mn-space-4);
    text-decoration: none;
    transition: background var(--mn-transition-fast);
}

.featured-review-snippet:hover[b-x2gbet1622] {
    background: var(--mn-bg-surface-alt);
}

.featured-review-snippet .review-author[b-x2gbet1622] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-gold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.featured-review-snippet .review-quote[b-x2gbet1622] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--mn-text-primary);
    margin: 0;
}

/* ===== PURCHASE CTA CARD ===== */
.purchase-cta-card[b-x2gbet1622] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-gold);
    padding: var(--mn-space-5);
    margin-top: var(--mn-space-5);
    border-radius: var(--mn-radius-sm, 2px);
}

.cta-read-free-header[b-x2gbet1622] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--mn-space-3);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-3);
}

.cta-read-free-hint[b-x2gbet1622] {
    color: var(--mn-text-tertiary);
    letter-spacing: 0.1em;
}

.cta-read-free-btn[b-x2gbet1622] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--mn-space-3);
    width: 100%;
    padding: 1.4rem 1.4rem;
    background: var(--mn-gold);
    color: var(--mn-bg-body);
    border: none;
    font-family: var(--mn-font-body);
    font-size: 0.9rem;
    font-weight: var(--mn-font-semibold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none;
    transition: background var(--mn-transition-fast), transform var(--mn-transition-fast);
}

.cta-read-free-btn:hover[b-x2gbet1622] {
    background: var(--mn-gold-light);
    color: var(--mn-bg-body);
    transform: translateY(-1px);
}

.cta-read-free-meta[b-x2gbet1622] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    opacity: 0.85;
    text-transform: none;
}

.cta-divider[b-x2gbet1622] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    margin: var(--mn-space-4) 0 var(--mn-space-3);
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.12em;
    color: var(--mn-text-tertiary);
    text-transform: uppercase;
}

.cta-divider[b-x2gbet1622]::before,
.cta-divider[b-x2gbet1622]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--mn-border-default);
}

.cta-price-row[b-x2gbet1622] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--mn-space-3);
    margin-bottom: var(--mn-space-4);
}

.cta-price-group[b-x2gbet1622] {
    display: flex;
    align-items: baseline;
    gap: var(--mn-space-2);
}

.cta-price-meta[b-x2gbet1622] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    color: var(--mn-text-tertiary);
    letter-spacing: 0.08em;
}

.cta-buy-grid[b-x2gbet1622] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--mn-space-2);
}

@media (max-width: 575.98px) {
    .cta-buy-grid[b-x2gbet1622] { grid-template-columns: 1fr; }
}

.cta-bundle-strip[b-x2gbet1622] {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--mn-space-3);
    margin-top: var(--mn-space-3);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    color: var(--mn-text-tertiary);
}

.cta-bundle-strip em[b-x2gbet1622] {
    color: var(--mn-gold);
    font-style: italic;
}

.cta-bundle-strip .token-glyph[b-x2gbet1622] {
    color: var(--mn-gold);
}

.cta-credit-note[b-x2gbet1622] {
    margin-top: var(--mn-space-3);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    color: var(--mn-gold);
}

.cta-free-headline[b-x2gbet1622] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--mn-space-3);
    margin-bottom: var(--mn-space-3);
}

.cta-free-price[b-x2gbet1622] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 2.75rem;
    color: var(--mn-gold);
    line-height: 1;
}

.cta-free-hint[b-x2gbet1622] {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
}

/* ===== REASSURANCE STRIP ===== */
.book-reassurance-strip[b-x2gbet1622] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--mn-space-2);
    margin-top: var(--mn-space-2);
    padding: 0.8rem 1rem;
    border: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface);
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.1em;
    color: var(--mn-text-tertiary);
    text-transform: uppercase;
}

.book-reassurance-strip__link[b-x2gbet1622] {
    color: var(--mn-gold);
    text-decoration: none;
    letter-spacing: 0.14em;
}

.book-reassurance-strip__link:hover[b-x2gbet1622] {
    color: var(--mn-gold-light);
}

/* ===== UTILITY ROW ===== */
.book-utility-row[b-x2gbet1622] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-4);
    align-items: center;
    margin-top: var(--mn-space-3);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.12em;
    color: var(--mn-text-tertiary);
    text-transform: uppercase;
}

.util-link[b-x2gbet1622] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: none;
    border: none;
    padding: 0;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-transform: uppercase;
    letter-spacing: inherit;
    transition: color var(--mn-transition-fast);
}

.util-link:hover[b-x2gbet1622] {
    color: var(--mn-text-primary);
}

.util-glyph[b-x2gbet1622] {
    color: var(--mn-gold);
    font-size: 0.9em;
}

.util-link--ember[b-x2gbet1622] {
    color: var(--mn-gold);
}

.util-link--ember:hover[b-x2gbet1622] {
    color: var(--mn-gold-light);
}

.util-spacer[b-x2gbet1622] {
    flex: 1;
    min-width: 20px;
}

.util-already-own[b-x2gbet1622] {
    color: var(--mn-text-primary);
    text-decoration: none;
    padding-bottom: 2px;
    border-bottom: 1px solid var(--mn-gold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.util-already-own:hover[b-x2gbet1622] {
    color: var(--mn-gold);
}

/* ===== QUICKMETA ===== */
.book-quickmeta[b-x2gbet1622] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-top: var(--mn-space-3);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    color: var(--mn-text-tertiary);
    text-transform: none;
}

.book-quickmeta i[b-x2gbet1622] {
    color: var(--mn-gold);
    margin-right: 0.3rem;
    opacity: 0.85;
}

.book-quickmeta .qm-sep[b-x2gbet1622] {
    opacity: 0.5;
}

/* ===== GENRE ROW ===== */
.book-genre-row[b-x2gbet1622] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: var(--mn-space-3);
}

/* Genre chips use the global .mn-tag primitive (anchor variant gives hover
   lift + ember outline automatically). See app.css § Tag primitives. */

/* ================================================================
   SECTION HEADING PATTERN
   Shared across Tags, Warnings, Chapters, Reviews, Musings, About
   ================================================================ */

[b-x2gbet1622] .book-detail-section {
    max-width: 1240px;
    margin: var(--mn-space-9) auto;
    padding: 0 var(--mn-space-6);
    border-top: 1px solid var(--mn-border-default);
    padding-top: var(--mn-space-8);
}

[b-x2gbet1622] .book-detail-section:first-of-type {
    border-top: none;
    padding-top: 0;
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .book-detail-section {
        margin: var(--mn-space-7) auto;
        padding: var(--mn-space-6) var(--mn-space-4) 0;
    }
}

/* Section eyebrow / headline / header-row now use the global .mn-section-*
   primitives (app.css). Markup composes them directly; no page-scoped copies. */

/* ================================================================
   TAGS & TROPES SECTION
   ================================================================ */

[b-x2gbet1622] .tags-section {
    background: var(--mn-bg-surface);
    max-width: none;
    margin-left: calc(var(--mn-space-3) * -1);
    margin-right: calc(var(--mn-space-3) * -1);
    padding-left: var(--mn-space-6);
    padding-right: var(--mn-space-6);
    padding-bottom: var(--mn-space-8);
    border-top: 1px solid var(--mn-border-default);
}

[b-x2gbet1622] .tags-section__header {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: var(--mn-space-6);
    align-items: flex-end;
    max-width: 1240px;
    margin: 0 auto var(--mn-space-5);
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .tags-section__header { grid-template-columns: 1fr; }
}

[b-x2gbet1622] .tags-section__note {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    color: var(--mn-text-tertiary);
    line-height: 1.55;
    max-width: 400px;
    text-align: right;
    margin: 0;
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .tags-section__note { text-align: left; }
}

[b-x2gbet1622] .tags-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--mn-space-4) var(--mn-space-7);
    max-width: 1240px;
    margin: 0 auto;
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .tags-grid { grid-template-columns: 1fr; }
}

[b-x2gbet1622] .tag-group {
    padding-top: var(--mn-space-3);
    border-top: 1px solid var(--mn-border-strong);
}

[b-x2gbet1622] .tag-group__label {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mn-gold);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-2);
}

[b-x2gbet1622] .tag-group__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

/* Tag chips render as <a class="mn-tag"> via ContentTagBadge Href= — global a.mn-tag handles hover. */

/* ================================================================
   CONTENT WARNINGS SECTION
   ================================================================ */

[b-x2gbet1622] .warnings-section__grid {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: var(--mn-space-7);
    align-items: flex-start;
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .warnings-section__grid { grid-template-columns: 1fr; gap: var(--mn-space-4); }
}

[b-x2gbet1622] .warnings-section__note {
    font-family: var(--mn-font-body);
    font-size: 0.85rem;
    color: var(--mn-text-tertiary);
    line-height: 1.6;
    margin: var(--mn-space-3) 0 0;
}

[b-x2gbet1622] .warnings-flame-hint {
    color: var(--mn-danger);
    font-family: var(--mn-font-mono);
    letter-spacing: 0.05em;
}

[b-x2gbet1622] .warnings-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

[b-x2gbet1622] .warnings-taboo {
    margin-top: var(--mn-space-3);
    padding-top: var(--mn-space-3);
    border-top: 1px solid var(--mn-border-default);
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

[b-x2gbet1622] .warnings-taboo__label {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mn-danger);
    margin-right: 0.5rem;
}

/* Taboo theme chips use .mn-tag.mn-tag--rouge (global, see app.css). */

/* ================================================================
   CHAPTERS SECTION
   ================================================================ */

[b-x2gbet1622] .chapters-list {
    border: 1px solid var(--mn-border-default);
    background: var(--mn-bg-surface);
    border-radius: var(--mn-radius-lg);
    overflow: hidden;
}

[b-x2gbet1622] .chapters-list__row {
    padding: var(--mn-space-3) var(--mn-space-4);
    border-top: 1px solid var(--mn-border-default);
}

[b-x2gbet1622] .chapters-list__row:first-child { border-top: none; }

/* ChapterListItem scoped polish */
[b-x2gbet1622] .list-group {
    background: var(--mn-bg-surface);
    border-color: var(--mn-border-default);
}

[b-x2gbet1622] .list-group-item.chapter-list-item {
    background-color: transparent;
    border: none;
    border-top: 1px solid var(--mn-border-default);
    border-radius: 0;
    color: var(--mn-text-primary);
    padding: var(--mn-space-4);
}

[b-x2gbet1622] .list-group-item.chapter-list-item:first-child {
    border-top: none;
}

@media (min-width: 768px) {
    [b-x2gbet1622] .list-group-item.chapter-list-item {
        padding: var(--mn-space-5) var(--mn-space-6);
    }
}

/* ================================================================
   EPISODES SECTION
   Layout-only: borrows global .chapters-list / global .mn-meta-badge.
   ================================================================ */

[b-x2gbet1622] .episode-row {
    display: flex;
    align-items: center;
    gap: var(--mn-space-3);
    padding: var(--mn-space-4);
    border-top: 1px solid var(--mn-border-default);
    color: var(--mn-text-primary);
    text-decoration: none;
    transition: background var(--mn-transition-fast);
}

[b-x2gbet1622] .episode-row:first-child {
    border-top: none;
}

[b-x2gbet1622] .episode-row:hover {
    background: var(--mn-bg-surface-alt);
    color: var(--mn-gold-light);
}

[b-x2gbet1622] .episode-row__num {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    color: var(--mn-text-tertiary);
    flex-shrink: 0;
    min-width: 2.25rem;
}

[b-x2gbet1622] .episode-row__title {
    flex: 1;
    font-family: var(--mn-font-body);
    font-size: 0.95rem;
    color: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-x2gbet1622] .episode-row__lock {
    color: var(--mn-text-tertiary);
    margin-left: 0.4rem;
    font-size: 0.75em;
    opacity: 0.7;
}

[b-x2gbet1622] .episode-row__duration {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    color: var(--mn-text-tertiary);
    flex-shrink: 0;
}

@media (min-width: 768px) {
    [b-x2gbet1622] .episode-row {
        padding: var(--mn-space-5) var(--mn-space-6);
    }
}

/* Mobile sticky bar: when read + listen are both available on a free book,
   render as side-by-side compact buttons rather than one wide one. */
.pdp-sticky-btn-primary--split[b-x2gbet1622] {
    font-size: 0.7rem;
    padding: 0.85rem 0.4rem;
    letter-spacing: 0.1em;
}

/* ================================================================
   REVIEWS SECTION
   ================================================================ */

[b-x2gbet1622] .reviews-summary-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--mn-space-5);
    align-items: center;
    padding: var(--mn-space-5);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    margin-bottom: var(--mn-space-4);
}

@media (max-width: 575.98px) {
    [b-x2gbet1622] .reviews-summary-card { grid-template-columns: 1fr; text-align: center; }
}

[b-x2gbet1622] .reviews-summary-card__score { text-align: center; }

[b-x2gbet1622] .reviews-summary-card__avg {
    font-family: var(--mn-font-body);
    font-size: 3rem;
    font-weight: var(--mn-font-semibold);
    color: var(--mn-gold);
    line-height: 1;
}

[b-x2gbet1622] .reviews-summary-card__count {
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    color: var(--mn-text-tertiary);
    margin-top: var(--mn-space-1);
}

[b-x2gbet1622] .reviews-summary-card__dist {
    font-family: var(--mn-font-mono);
}

[b-x2gbet1622] .dist-label {
    font-size: 0.7rem;
    color: var(--mn-text-secondary);
    width: 2.25rem;
}

[b-x2gbet1622] .dist-bar {
    flex-grow: 1;
    height: 6px;
    background: var(--mn-border-default);
}

[b-x2gbet1622] .dist-bar__fill {
    height: 100%;
    background: var(--mn-gold);
}

[b-x2gbet1622] .dist-count {
    width: 2.25rem;
    text-align: right;
    font-size: 0.7rem;
    color: var(--mn-text-tertiary);
}

[b-x2gbet1622] .reviews-empty {
    padding: var(--mn-space-5);
    text-align: center;
    font-family: var(--mn-font-body);
    font-style: italic;
    color: var(--mn-text-tertiary);
}

[b-x2gbet1622] .my-review-card {
    border: 1px solid var(--mn-gold);
    background: var(--mn-bg-surface);
    margin-bottom: var(--mn-space-4);
}

[b-x2gbet1622] .my-review-card__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--mn-space-3) var(--mn-space-4);
    background: rgba(217, 137, 71, 0.08);
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
}

[b-x2gbet1622] .my-review-card__body { padding: var(--mn-space-4); }

[b-x2gbet1622] .reviews-list {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
    margin-top: var(--mn-space-4);
}

[b-x2gbet1622] .review-card {
    padding: var(--mn-space-4);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
}

[b-x2gbet1622] .review-card__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--mn-space-2);
    margin-bottom: var(--mn-space-2);
}

[b-x2gbet1622] .review-card__who {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-x2gbet1622] .review-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

[b-x2gbet1622] .review-avatar--placeholder {
    background: var(--mn-bg-surface-alt);
    color: var(--mn-text-tertiary);
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-x2gbet1622] .review-name {
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
    font-size: 0.85rem;
}

[b-x2gbet1622] .review-edited {
    font-family: var(--mn-font-mono);
    font-size: 0.65rem;
    color: var(--mn-text-tertiary);
}

[b-x2gbet1622] .review-date {
    font-family: var(--mn-font-mono);
    font-size: 0.65rem;
    color: var(--mn-text-tertiary);
    letter-spacing: 0.06em;
}

[b-x2gbet1622] .review-card__body {
    margin: var(--mn-space-2) 0;
    font-family: var(--mn-font-body);
    line-height: 1.55;
    color: var(--mn-text-primary);
}

[b-x2gbet1622] .review-card__actions {
    display: flex;
    justify-content: flex-end;
}

[b-x2gbet1622] .review-upvote {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: none;
    border: 1px solid var(--mn-border-strong);
    padding: 0.25rem 0.6rem;
    font-family: var(--mn-font-mono);
    font-size: 0.7rem;
    color: var(--mn-text-secondary);
    cursor: pointer;
    transition: all var(--mn-transition-fast);
}

[b-x2gbet1622] .review-upvote:hover {
    color: var(--mn-gold);
    border-color: var(--mn-gold);
}

/* ================================================================
   ABOUT THIS BOOK
   ================================================================ */

[b-x2gbet1622] .about-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: var(--mn-space-7);
    align-items: flex-start;
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .about-grid { grid-template-columns: 1fr; gap: var(--mn-space-5); }
}

[b-x2gbet1622] .about-description {
    font-family: var(--mn-font-body);
    font-size: 1.05rem;
    line-height: 1.75;
    color: var(--mn-text-primary);
    font-weight: var(--mn-font-light);
    margin-bottom: var(--mn-space-5);
}

[b-x2gbet1622] .book-author-note {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-left: 3px solid var(--mn-gold);
    padding: var(--mn-space-4) var(--mn-space-5);
    margin-top: var(--mn-space-4);
}

[b-x2gbet1622] .book-author-note__label {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-2);
    font-weight: var(--mn-font-semibold);
}

[b-x2gbet1622] .book-author-note__body {
    font-family: var(--mn-font-body);
    font-size: 0.95rem;
    font-style: italic;
    line-height: 1.65;
    color: var(--mn-text-primary);
}

[b-x2gbet1622] .book-dedication {
    margin-top: var(--mn-space-4);
    text-align: center;
    font-family: var(--mn-font-body);
    font-style: italic;
    color: var(--mn-text-tertiary);
    font-size: 0.95rem;
}

[b-x2gbet1622] .book-metadata-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: var(--mn-space-4);
    font-family: var(--mn-font-body);
    font-size: 0.85rem;
}

[b-x2gbet1622] .book-metadata-table th {
    padding: 0.6rem 0;
    width: 130px;
    vertical-align: top;
    font-family: var(--mn-font-mono);
    font-size: 0.65rem;
    font-weight: var(--mn-font-semibold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
    text-align: left;
    border: none;
}

[b-x2gbet1622] .book-metadata-table td {
    padding: 0.6rem 0;
    color: var(--mn-text-primary);
    border-bottom: 1px solid var(--mn-border-default);
}

/* ================================================================
   AUTHOR SECTION
   ================================================================ */

[b-x2gbet1622] .author-section {
    background: var(--mn-bg-surface);
    max-width: none;
    margin-left: calc(var(--mn-space-3) * -1);
    margin-right: calc(var(--mn-space-3) * -1);
    padding-left: var(--mn-space-6);
    padding-right: var(--mn-space-6);
    padding-bottom: var(--mn-space-8);
}

[b-x2gbet1622] .author-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: var(--mn-space-7);
    align-items: flex-start;
    max-width: 1240px;
    margin: 0 auto;
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .author-grid { grid-template-columns: 1fr; gap: var(--mn-space-5); }
}

/* .mn-author-avatar + .mn-author-avatar--gradient promoted to app.css —
   shared with AuthorPublic's hero. Do not redefine here. */

[b-x2gbet1622] .author-meta { min-width: 0; }

[b-x2gbet1622] .author-name {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 1.75rem;
    line-height: 1;
    color: var(--mn-text-primary);
}

[b-x2gbet1622] .author-name a {
    color: inherit;
    text-decoration: none;
}

[b-x2gbet1622] .author-name a:hover { color: var(--mn-gold); }

[b-x2gbet1622] .author-tagline {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.9rem;
    color: var(--mn-gold-light);
    margin-top: 0.5rem;
}

[b-x2gbet1622] .author-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: var(--mn-space-2);
    font-family: var(--mn-font-mono);
    font-size: 0.65rem;
    letter-spacing: 0.08em;
    color: var(--mn-text-tertiary);
    text-transform: uppercase;
}

[b-x2gbet1622] .author-stats__sep {
    opacity: 0.45;
}

[b-x2gbet1622] .author-bio {
    font-family: var(--mn-font-body);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--mn-text-primary);
    font-weight: var(--mn-font-light);
    margin-top: var(--mn-space-4);
}

[b-x2gbet1622] .author-genres {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: var(--mn-space-3);
}

[b-x2gbet1622] .author-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: var(--mn-space-3);
}

[b-x2gbet1622] .author-cta-row {
    display: flex;
    gap: 0.5rem;
    margin-top: var(--mn-space-3);
    flex-wrap: wrap;
    align-items: center;
}

[b-x2gbet1622] .author-more-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--mn-space-3);
    margin-top: var(--mn-space-3);
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .author-more-grid { grid-template-columns: repeat(2, 1fr); }
}

[b-x2gbet1622] .author-more-tile {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-2);
    text-decoration: none;
    color: inherit;
}

[b-x2gbet1622] .author-more-tile__cover {
    border-radius: var(--mn-radius-sm, 2px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
    transition: transform var(--mn-transition-fast), box-shadow var(--mn-transition-fast);
}

[b-x2gbet1622] .author-more-tile:hover .author-more-tile__cover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
}

[b-x2gbet1622] .author-more-tile__title {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: 0.9rem;
    line-height: 1.15;
    color: var(--mn-text-primary);
}

[b-x2gbet1622] .author-more-tile__meta {
    font-family: var(--mn-font-mono);
    font-size: 0.6rem;
    letter-spacing: 0.08em;
    color: var(--mn-text-tertiary);
    text-transform: uppercase;
}

/* Phase B-3 — wrapper for SeriesEndingBadge chips beneath the meta line. */
[b-x2gbet1622] .author-more-tile__badges {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-1);
    margin-top: var(--mn-space-1);
}

/* Phase B-3 — visual ping on the tile representing the book the reader is on. */
[b-x2gbet1622] .author-more-tile--current .author-more-tile__cover {
    outline: 2px solid var(--mn-gold);
    outline-offset: 2px;
    border-radius: var(--mn-radius-sm, 2px);
}

[b-x2gbet1622] .author-more-link {
    display: inline-block;
    margin-top: var(--mn-space-3);
    font-family: var(--mn-font-mono);
    font-size: 0.7rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mn-gold);
    text-decoration: none;
}

[b-x2gbet1622] .author-more-link:hover {
    color: var(--mn-gold-light);
}

/* ================================================================
   CONTRIBUTORS
   ================================================================ */

[b-x2gbet1622] .contributors-list {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-4);
}

[b-x2gbet1622] .contributor-row {
    display: flex;
    gap: var(--mn-space-3);
    align-items: flex-start;
}

[b-x2gbet1622] .contributor-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

[b-x2gbet1622] .contributor-avatar--placeholder {
    background: var(--mn-bg-surface-alt);
    color: var(--mn-text-tertiary);
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-x2gbet1622] .contributor-head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

[b-x2gbet1622] .contributor-name {
    font-family: var(--mn-font-body);
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
    text-decoration: none;
}

[b-x2gbet1622] .contributor-name:hover {
    color: var(--mn-gold);
}

/* Contributor role chips use .mn-meta-badge / .mn-meta-badge--ember globals */

[b-x2gbet1622] .contributor-bio {
    font-family: var(--mn-font-body);
    font-size: 0.85rem;
    color: var(--mn-text-secondary);
    margin: 0.4rem 0 0 0;
}

/* ================================================================
   SERIES
   ================================================================ */

[b-x2gbet1622] .series-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--mn-space-3);
}

@media (max-width: 767.98px) {
    [b-x2gbet1622] .series-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ================================================================
   SIMILAR BOOKS CAROUSEL
   ================================================================ */

[b-x2gbet1622] .similar-carousel-card {
    width: 150px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (min-width: 576px) {
    [b-x2gbet1622] .similar-carousel-card { width: 170px; }
}

[b-x2gbet1622] .similar-carousel-card .book-card-cover {
    border-radius: var(--mn-radius-sm, 2px);
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
    transition: transform var(--mn-transition-fast), box-shadow var(--mn-transition-fast);
}

[b-x2gbet1622] .similar-carousel-card:hover .book-card-cover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
}

/* ================================================================
   MOBILE STICKY CTA BAR
   ================================================================ */

.pdp-sticky-inner[b-x2gbet1622] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
}

.pdp-sticky-price[b-x2gbet1622] {
    flex: none;
    min-width: 56px;
}

.pdp-sticky-price__usd[b-x2gbet1622] {
    font-family: var(--mn-font-body);
    font-size: 1.1rem;
    color: var(--mn-text-primary);
    font-weight: var(--mn-font-semibold);
    line-height: 1;
}

.pdp-sticky-price__usd em[b-x2gbet1622] {
    color: var(--mn-gold);
    font-style: italic;
}

.pdp-sticky-price__token[b-x2gbet1622] {
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    color: var(--mn-gold);
    letter-spacing: 0.08em;
    margin-top: 2px;
}

.pdp-sticky-btn-primary[b-x2gbet1622] {
    flex: 1;
    padding: 0.85rem 1rem;
    background: var(--mn-gold);
    color: var(--mn-bg-body);
    border: none;
    font-family: var(--mn-font-body);
    font-size: 0.8rem;
    font-weight: var(--mn-font-semibold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    line-height: 1.2;
    transition: background var(--mn-transition-fast);
}

.pdp-sticky-btn-primary:hover[b-x2gbet1622] {
    background: var(--mn-gold-light);
    color: var(--mn-bg-body);
}

/* FollowButton compact icon variant override inside sticky bar */
[b-x2gbet1622] .cart-mobile-bar .btn {
    flex-shrink: 0;
}

/* ================================================================
   CTA BUY GRID — let AddToCart + Purchase buttons stretch
   ================================================================ */

[b-x2gbet1622] .cta-buy-grid .btn {
    width: 100%;
}
/* /Pages/CollectionLanding.razor.rz.scp.css */
/* CollectionLanding — page-scoped layout ONLY.
   Shared primitives (.mn-tag, .mn-meta-badge, .mn-section-eyebrow, .btn, .pagination, etc.)
   live in global app.css per CLAUDE.md #1. This file holds the page's hero, collage,
   intro-clamp, member-grid, and graceful-state LAYOUT. Tokens are --mn-* only — no raw hex. */

.coll-landing[b-v2yolbjfax] {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 var(--mn-space-4) var(--mn-space-16);
}

/* — Breadcrumb spacing (the mobile escape path back to /collections) — */
.coll-breadcrumb[b-v2yolbjfax] {
    margin: var(--mn-space-4) 0 var(--mn-space-5);
}

/* — Hero — */
.coll-hero[b-v2yolbjfax] {
    padding: var(--mn-space-8) var(--mn-space-4);
    min-height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    border-radius: var(--mn-radius-lg);
    background: linear-gradient(135deg, var(--mn-bg-surface-alt), var(--mn-bg-inset));
    overflow: hidden;
}

.coll-hero--imaged[b-v2yolbjfax] {
    background-size: cover;
    background-position: center;
    min-height: 340px;
    padding: var(--mn-space-16) var(--mn-space-6) var(--mn-space-8);
}

.coll-hero--ended[b-v2yolbjfax] {
    opacity: 0.75;
}

/* coll-hero-collage: page-scoped landing-hero collage.
   DISTINCT from the global index-card collage (app.css, Plan 01) — do NOT merge. */
.coll-hero-collage[b-v2yolbjfax] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    opacity: 0.22;
    filter: blur(2px);
    z-index: 0;
    display: none;
}

.coll-hero-collage__cover[b-v2yolbjfax] {
    position: absolute;
    width: 28%;
    max-width: 200px;
    aspect-ratio: 2 / 3;
    overflow: hidden;
    border-radius: var(--mn-radius-sm);
}

.coll-hero-collage__cover img[b-v2yolbjfax] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.coll-hero-collage__cover:nth-child(1)[b-v2yolbjfax] { top: -10%; right: 6%;  transform: rotate(-6deg); }
.coll-hero-collage__cover:nth-child(2)[b-v2yolbjfax] { top: 20%;  right: 32%; transform: rotate(4deg);  opacity: 0.85; }
.coll-hero-collage__cover:nth-child(3)[b-v2yolbjfax] { top: -4%;  right: 58%; transform: rotate(-2deg); opacity: 0.7; }

@media (min-width: 480px) {
    .coll-hero-collage[b-v2yolbjfax] { display: block; }
}

/* Keep the type strip above the collage backdrop. */
.coll-hero__meta[b-v2yolbjfax],
.coll-hero__row[b-v2yolbjfax] {
    position: relative;
    z-index: 1;
}

.coll-hero__meta[b-v2yolbjfax] {
    font-family: var(--mn-font-mono);
    font-size: var(--mn-text-xs);
    letter-spacing: 0.08em;
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-2);
}

.coll-hero__title[b-v2yolbjfax] {
    font-size: clamp(1.875rem, 5vw, 3.5rem);
    font-weight: var(--mn-font-bold);
    line-height: 0.98;
    letter-spacing: -0.025em;
    margin: 0;
}

.coll-hero__kicker[b-v2yolbjfax] {
    font-style: italic;
    font-size: var(--mn-text-base);
    color: var(--mn-text-secondary);
    margin: var(--mn-space-2) 0 0;
}

.coll-hero__ended-badge[b-v2yolbjfax] {
    position: absolute;
    bottom: var(--mn-space-3);
    right: var(--mn-space-3);
    z-index: 2;
}

/* — Ending-soon banner — */
.coll-ending-soon[b-v2yolbjfax] {
    margin-top: var(--mn-space-4);
    background: var(--mn-warning-light);
    border: none;
    border-left: 3px solid var(--mn-gold);
    color: var(--mn-text-secondary);
}

.coll-ending-soon .bi[b-v2yolbjfax] {
    color: var(--mn-gold);
}

/* — Editorial intro — */
.coll-intro[b-v2yolbjfax] {
    margin-top: var(--mn-space-8);
}

.coll-intro__body[b-v2yolbjfax] {
    color: var(--mn-text-secondary);
    line-height: 1.7;
}

.coll-intro--clampable[b-v2yolbjfax] {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.coll-intro--expanded[b-v2yolbjfax] {
    display: block;
    -webkit-line-clamp: unset;
}

@media (min-width: 768px) {
    /* No clamp on desktop — the toggle is a mobile affordance only. */
    .coll-intro--clampable[b-v2yolbjfax] {
        display: block;
        -webkit-line-clamp: unset;
    }

    .coll-intro__toggle[b-v2yolbjfax] {
        display: none;
    }
}

/* — Member grid — */
.coll-members[b-v2yolbjfax] {
    margin-top: var(--mn-space-8);
}

.coll-member-grid[b-v2yolbjfax] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: var(--mn-space-4);
    margin-top: var(--mn-space-5);
}

@media (min-width: 768px) {
    .coll-member-grid[b-v2yolbjfax] {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    }
}

/* Member cell — relative so the BookHoverCard popover anchors to it. */
.coll-member[b-v2yolbjfax] {
    position: relative;
}

/* — See-all (defer to filtered browse) — */
.coll-seeall[b-v2yolbjfax] {
    margin-top: var(--mn-space-6);
    text-align: center;
}

.coll-seeall__more[b-v2yolbjfax] {
    color: var(--mn-text-secondary);
    font-size: 0.9rem;
    margin-bottom: var(--mn-space-3);
}

/* — Graceful states — */
.coll-empty[b-v2yolbjfax] {
    text-align: center;
    padding: var(--mn-space-12) var(--mn-space-4);
}

.coll-empty__icon[b-v2yolbjfax] {
    font-size: 2.5rem;
    color: var(--mn-text-tertiary);
    display: block;
    margin-bottom: var(--mn-space-3);
}

.coll-empty__title[b-v2yolbjfax] {
    margin: 0 0 var(--mn-space-2);
}

.coll-not-found[b-v2yolbjfax] {
    text-align: center;
    padding: var(--mn-space-16) var(--mn-space-4);
}

.coll-not-found h1[b-v2yolbjfax] {
    margin-bottom: var(--mn-space-3);
}
/* /Pages/Collections.razor.rz.scp.css */
/* Collections — /collections public index. Page-scoped LAYOUT only.
   The collection card primitive (the global mn collection-card family and its
   hero/collage/body/eyebrow/title/kicker/meta sub-elements) lives in app.css
   (Plan 10-01) — never redefined here (CLAUDE.md #1). This file holds only
   the index grid + empty-state layout that is unique to this page.
   Mobile-first @ 375px: cards stack single-column. */

.collections-page[b-3lw4w8pzxb] {
    max-width: var(--mn-max-width-wide);
    margin: 0 auto;
    padding: var(--mn-space-4);
    color: var(--mn-text-primary);
}

@media (min-width: 768px) {
    .collections-page[b-3lw4w8pzxb] {
        padding: var(--mn-space-6) var(--mn-space-8);
    }
}

/* Index grid — 1 col mobile / 2 col @576px / 3 col @992px. */
.collections-index[b-3lw4w8pzxb] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    margin-top: var(--mn-space-6);
}

@media (min-width: 576px) {
    .collections-index[b-3lw4w8pzxb] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .collections-index[b-3lw4w8pzxb] {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Description teaser used as the kicker line clamps to a single line on the index. */
.collections-index .mn-collection-card__kicker[b-3lw4w8pzxb] {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Empty state — centered, narrow column. */
.collections-empty-state[b-3lw4w8pzxb] {
    max-width: 480px;
    margin: 0 auto;
}
/* /Pages/Commerce/Library.razor.rz.scp.css */
/* Library card hover polish */
.library-card[b-e16d4heqlr] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    overflow: hidden;
}

.library-card:hover[b-e16d4heqlr] {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

/* Cover image zoom on hover */
.library-cover-wrap[b-e16d4heqlr] {
    overflow: hidden;
}

.library-cover-img[b-e16d4heqlr] {
    height: 200px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.library-card:hover .library-cover-img[b-e16d4heqlr] {
    transform: scale(1.05);
}

/* Hero card subtle hover */
.library-hero-card[b-e16d4heqlr] {
    transition: box-shadow 0.2s ease;
    border-left: 4px solid var(--mn-gold) !important;
}

.library-hero-card:hover[b-e16d4heqlr] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* Ensure min-width works for text truncation in flex */
[b-e16d4heqlr] .min-width-0 {
    min-width: 0;
}
/* /Pages/Creators.razor.rz.scp.css */
/* ══════════════════════════════════════
   Creators Landing Page
   ══════════════════════════════════════ */

/* ── Hero ── */
.creators-hero[b-szo7rkn7vq] {
    text-align: center;
    padding: var(--mn-space-16) var(--mn-space-4) var(--mn-space-12);
    max-width: 720px;
    margin: 0 auto;
}

.creators-hero-title[b-szo7rkn7vq] {
    font-size: clamp(1.8rem, 5vw, 2.8rem);
    line-height: 1.2;
    margin-bottom: var(--mn-space-4);
}

.creators-hero-sub[b-szo7rkn7vq] {
    font-size: var(--mn-text-lg);
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    margin-bottom: var(--mn-space-8);
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

.creators-hero-cta[b-szo7rkn7vq] {
    margin-top: var(--mn-space-6);
}

/* ── Sections ── */
.creators-section[b-szo7rkn7vq] {
    padding: var(--mn-space-12) var(--mn-space-4);
    max-width: 1000px;
    margin: 0 auto;
}

.creators-section-alt[b-szo7rkn7vq] {
    background: var(--mn-bg-surface-alt);
    border-radius: var(--mn-radius-xl);
    max-width: 100%;
    padding-left: var(--mn-space-6);
    padding-right: var(--mn-space-6);
    margin-bottom: var(--mn-space-8);
}

.creators-section-title[b-szo7rkn7vq] {
    text-align: center;
    font-size: clamp(1.4rem, 3.5vw, 2rem);
    margin-bottom: var(--mn-space-8);
}

/* ── Complaints Grid (the "sound familiar" cards) ── */
.creators-complaints[b-szo7rkn7vq] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-4);
    margin-bottom: var(--mn-space-6);
}

.complaint-card[b-szo7rkn7vq] {
    display: flex;
    align-items: flex-start;
    gap: var(--mn-space-3);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-left: 4px solid var(--mn-danger);
    border-radius: 0 var(--mn-radius-md) var(--mn-radius-md) 0;
    padding: var(--mn-space-4);
}

.complaint-card i[b-szo7rkn7vq] {
    font-size: 1.25rem;
    color: var(--mn-danger);
    flex-shrink: 0;
    margin-top: 2px;
}

.complaint-card p[b-szo7rkn7vq] {
    margin: 0;
    font-style: italic;
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
}

.creators-punchline[b-szo7rkn7vq] {
    text-align: center;
    font-size: var(--mn-text-lg);
    margin-top: var(--mn-space-6);
}

/* ── Value Proposition Grid ── */
.value-grid[b-szo7rkn7vq] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    max-width: 960px;
    margin: 0 auto;
}

.value-card[b-szo7rkn7vq] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-6);
    transition: box-shadow var(--mn-transition-base), border-color var(--mn-transition-base);
}

.value-card:hover[b-szo7rkn7vq] {
    box-shadow: var(--mn-shadow-md);
    border-color: var(--mn-border-strong);
}

.value-icon[b-szo7rkn7vq] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-navy);
    color: var(--mn-gold);
    border-radius: var(--mn-radius-md);
    font-size: 1.25rem;
    margin-bottom: var(--mn-space-4);
}

.value-card h3[b-szo7rkn7vq] {
    font-size: var(--mn-text-lg);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-2);
}

.value-card p[b-szo7rkn7vq] {
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    margin: 0;
    font-size: var(--mn-text-sm);
}

/* ── Steps Grid ── */
.steps-grid[b-szo7rkn7vq] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    max-width: 800px;
    margin: 0 auto;
}

.step-card[b-szo7rkn7vq] {
    text-align: center;
    padding: var(--mn-space-6) var(--mn-space-4);
}

.step-number[b-szo7rkn7vq] {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-gold);
    color: white;
    font-weight: var(--mn-font-bold);
    font-size: var(--mn-text-xl);
    border-radius: 50%;
    margin-bottom: var(--mn-space-3);
    box-shadow: var(--mn-shadow-gold);
}

.step-card h3[b-szo7rkn7vq] {
    font-size: var(--mn-text-base);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-1);
}

.step-card p[b-szo7rkn7vq] {
    color: var(--mn-text-secondary);
    font-size: var(--mn-text-sm);
    margin: 0;
}

/* ── Final CTA ── */
.creators-final-cta[b-szo7rkn7vq] {
    text-align: center;
    padding: var(--mn-space-16) var(--mn-space-4);
    background: var(--mn-navy);
    border-radius: var(--mn-radius-xl);
    margin: var(--mn-space-8) 0;
}

.creators-final-title[b-szo7rkn7vq] {
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-3);
}

.creators-final-sub[b-szo7rkn7vq] {
    color: var(--mn-text-inverse);
    font-size: var(--mn-text-lg);
    margin-bottom: var(--mn-space-8);
    opacity: 0.85;
}

/* ── Responsive: Tablet+ ── */
@media (min-width: 576px) {
    .creators-complaints[b-szo7rkn7vq] {
        grid-template-columns: 1fr 1fr;
    }

    .steps-grid[b-szo7rkn7vq] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 768px) {
    .value-grid[b-szo7rkn7vq] {
        grid-template-columns: 1fr 1fr;
    }

    .steps-grid[b-szo7rkn7vq] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 992px) {
    .value-grid[b-szo7rkn7vq] {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .creators-section-alt[b-szo7rkn7vq] {
        padding-left: var(--mn-space-12);
        padding-right: var(--mn-space-12);
    }
}
/* /Pages/Home.razor.rz.scp.css */
/* ===== Home Page — Scoped Styles ===== */

/* Section spacing */
.home-section[b-lifvw2k6qm] {
    margin-bottom: var(--mn-space-16);
}

/* ===== Section Subtitle ===== */
.home-section-subtitle[b-lifvw2k6qm] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-sm);
    color: var(--mn-text-tertiary);
    margin-top: calc(-1 * var(--mn-space-2));
    margin-bottom: var(--mn-space-3);
}

/* ===== Taboo Toggle Strip — Backroom ===== */
.home-taboo-strip[b-lifvw2k6qm] {
    margin: var(--mn-space-8) 0 var(--mn-space-10);
    padding: var(--mn-space-3) var(--mn-space-5);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-strong);
    border-radius: var(--mn-radius-lg);
}

.home-taboo-strip-inner[b-lifvw2k6qm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mn-space-4);
}

.home-taboo-strip-copy[b-lifvw2k6qm] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-2);
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-sm);
    color: var(--mn-text-secondary);
    min-width: 0;
}

.home-taboo-strip-copy > i[b-lifvw2k6qm] {
    color: var(--mn-gold);
    flex-shrink: 0;
}

.home-taboo-strip-copy em[b-lifvw2k6qm] {
    font-style: italic;
    color: var(--mn-gold-light);
}

.home-taboo-strip .form-check-label[b-lifvw2k6qm] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-medium);
    color: var(--mn-text-primary);
    white-space: nowrap;
}

/* Ember switch when on */
.home-taboo-strip .form-check-input:checked[b-lifvw2k6qm] {
    background-color: var(--mn-gold);
    border-color: var(--mn-gold);
}

.home-taboo-strip .form-check-input:focus[b-lifvw2k6qm] {
    border-color: var(--mn-gold);
    box-shadow: 0 0 0 0.2rem rgba(217, 137, 71, 0.30);
}

.home-taboo-strip a[b-lifvw2k6qm] {
    color: var(--mn-text-tertiary);
    transition: color var(--mn-transition-fast);
}

.home-taboo-strip a:hover[b-lifvw2k6qm] {
    color: var(--mn-gold);
}

@media (max-width: 576px) {
    .home-taboo-strip-inner[b-lifvw2k6qm] {
        flex-direction: column;
        gap: var(--mn-space-2);
        text-align: center;
    }
}

/* ===== Book of the Day — Backroom Editorial Hero ===== */
.home-botd[b-lifvw2k6qm] {
    margin: 0 0 var(--mn-space-12);
    padding: var(--mn-space-10) var(--mn-space-6) var(--mn-space-12);
    background: linear-gradient(180deg, var(--mn-bg-body) 0%, var(--mn-bg-surface) 100%);
    border-top: 1px solid var(--mn-border-default);
    border-bottom: 1px solid var(--mn-border-default);
    position: relative;
    overflow: hidden;
}

/* Top meta bar — mono kickers, "Open 24 hours" voice */
.home-botd-meta[b-lifvw2k6qm] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--mn-space-4);
    flex-wrap: wrap;
    font-family: var(--mn-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--mn-text-tertiary);
    padding-bottom: var(--mn-space-4);
    border-bottom: 1px solid var(--mn-border-default);
    margin-bottom: var(--mn-space-10);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.home-botd-meta-accent[b-lifvw2k6qm] {
    color: var(--mn-gold);
}

.home-botd-inner[b-lifvw2k6qm] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-8);
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}

@media (min-width: 768px) {
    .home-botd-inner[b-lifvw2k6qm] {
        flex-direction: row;
        align-items: flex-start;
        gap: var(--mn-space-12);
    }
}

.home-botd-cover[b-lifvw2k6qm] {
    width: 240px;
    flex-shrink: 0;
}

@media (min-width: 768px) {
    .home-botd-cover[b-lifvw2k6qm] {
        width: 320px;
    }
}

.home-botd-cover a[b-lifvw2k6qm] {
    display: block;
    border-radius: 2px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55), 0 6px 18px rgba(0, 0, 0, 0.35);
    transition: transform var(--mn-transition-base), box-shadow var(--mn-transition-base);
    border: 1px solid rgba(217, 137, 71, 0.25);
}

.home-botd-cover a:hover[b-lifvw2k6qm] {
    transform: translateY(-6px);
    box-shadow: 0 28px 60px rgba(0, 0, 0, 0.65), 0 10px 24px rgba(0, 0, 0, 0.45);
}

.home-botd-info[b-lifvw2k6qm] {
    flex: 1;
    min-width: 0;
    text-align: center;
    padding-top: var(--mn-space-2);
}

@media (min-width: 768px) {
    .home-botd-info[b-lifvw2k6qm] {
        text-align: left;
    }
}

/* "Book of the Day" announcement uses .mn-meta-badge--solid--pill global */

/* .home-botd-title typography → .mn-hero-title + .mn-hero-title--retail (app.css).
   .home-botd-author typography → .mn-hero-byline + .mn-hero-byline--retail (app.css).
   Only the page-specific pieces remain below: bottom margin on the title,
   bottom margin on the by-line, and the link-inside-title hover behaviour
   (semantic-specific to the BotD pattern, not part of the retail register). */

.home-botd-title[b-lifvw2k6qm] {
    margin: 0 0 var(--mn-space-2);
}

.home-botd-title a[b-lifvw2k6qm] {
    color: var(--mn-text-primary);
    text-decoration: none;
    transition: color var(--mn-transition-fast);
}

.home-botd-title a:hover[b-lifvw2k6qm] {
    color: var(--mn-gold);
}

.home-botd-author[b-lifvw2k6qm] {
    margin: 0 0 var(--mn-space-5);
}

.home-botd-synopsis[b-lifvw2k6qm] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-base);
    color: var(--mn-text-secondary);
    line-height: 1.7;
    font-weight: var(--mn-font-light);
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 62ch;
    margin: 0 0 var(--mn-space-5);
}

@media (min-width: 768px) {
    .home-botd-synopsis[b-lifvw2k6qm] {
        margin-left: 0;
        margin-right: 0;
    }
}

.home-botd-stats[b-lifvw2k6qm] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-5);
    font-family: var(--mn-font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.1em;
    color: var(--mn-text-tertiary);
    justify-content: center;
    margin: 0 0 var(--mn-space-5);
}

@media (min-width: 768px) {
    .home-botd-stats[b-lifvw2k6qm] {
        justify-content: flex-start;
    }
}

.home-botd-stat[b-lifvw2k6qm] {
    display: inline-flex;
    align-items: center;
    gap: var(--mn-space-1);
}

.home-botd-stat-accent[b-lifvw2k6qm] {
    color: var(--mn-gold);
}

.home-botd-price[b-lifvw2k6qm] {
    display: flex;
    align-items: baseline;
    gap: var(--mn-space-2);
    margin-bottom: var(--mn-space-5);
    justify-content: center;
    font-family: var(--mn-font-body);
}

@media (min-width: 768px) {
    .home-botd-price[b-lifvw2k6qm] { justify-content: flex-start; }
}

.home-botd-cta[b-lifvw2k6qm] {
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 0.75rem 1.5rem;
}

/* ===== Explore Category Cards ===== */
.home-category-grid[b-lifvw2k6qm] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--mn-space-3);
}

@media (min-width: 576px) {
    .home-category-grid[b-lifvw2k6qm] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 768px) {
    .home-category-grid[b-lifvw2k6qm] {
        grid-template-columns: repeat(6, 1fr);
    }
}

.home-category-card[b-lifvw2k6qm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mn-space-2);
    padding: var(--mn-space-5) var(--mn-space-3);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    text-decoration: none;
    color: var(--mn-text-primary);
    transition: border-color var(--mn-transition-fast),
                box-shadow var(--mn-transition-fast),
                transform var(--mn-transition-fast);
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
}

.home-category-card:hover[b-lifvw2k6qm] {
    border-color: var(--mn-gold);
    box-shadow: var(--mn-shadow-gold);
    transform: translateY(-2px);
    color: var(--mn-gold-light);
    text-decoration: none;
}

.home-category-card i[b-lifvw2k6qm] {
    font-size: 1.5rem;
    color: var(--mn-gold);
}

/* ===== Trending Layout ===== */
.home-trending-layout[b-lifvw2k6qm] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-6);
}

@media (min-width: 768px) {
    .home-trending-layout[b-lifvw2k6qm] {
        flex-direction: row;
        gap: var(--mn-space-8);
    }
}

.home-trending-featured[b-lifvw2k6qm] {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
}

.home-trending-featured:hover[b-lifvw2k6qm] {
    color: inherit;
    text-decoration: none;
}

@media (min-width: 768px) {
    .home-trending-featured[b-lifvw2k6qm] {
        width: 300px;
        flex-shrink: 0;
    }
}

.home-trending-featured-cover[b-lifvw2k6qm] {
    border-radius: var(--mn-radius-lg);
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(2, 24, 75, 0.12);
    transition: transform var(--mn-transition-base), box-shadow var(--mn-transition-base);
}

.home-trending-featured:hover .home-trending-featured-cover[b-lifvw2k6qm] {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(2, 24, 75, 0.18);
}

.home-trending-featured-info h3[b-lifvw2k6qm] {
    font-size: var(--mn-text-xl);
    margin-bottom: var(--mn-space-1);
    color: var(--mn-text-primary);
    font-weight: var(--mn-font-bold);
}

.home-trending-featured-synopsis[b-lifvw2k6qm] {
    font-size: var(--mn-text-sm);
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: var(--mn-space-2);
    margin-bottom: 0;
}

.home-trending-carousel[b-lifvw2k6qm] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

/* ===== Carousel Book Cards ===== */
[b-lifvw2k6qm] .home-carousel-card {
    width: 150px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (min-width: 576px) {
    [b-lifvw2k6qm] .home-carousel-card {
        width: 170px;
    }
}

[b-lifvw2k6qm] .home-carousel-card .book-card-cover {
    border-radius: var(--mn-radius-md);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    transition: transform var(--mn-transition-fast), box-shadow var(--mn-transition-fast);
}

[b-lifvw2k6qm] .home-carousel-card:hover .book-card-cover {
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(2, 24, 75, 0.15);
}

/* ===== Carousel Series Cards =====
   The series card is wide-format (cover thumb + horizontal body) — book-card width
   collapses the layout. Size it for legibility at carousel scale. */
[b-lifvw2k6qm] .home-series-card {
    width: 320px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (min-width: 576px) {
    [b-lifvw2k6qm] .home-series-card {
        width: 380px;
    }
}

/* ===== Carousel Collection Cards =====
   Sizing ONLY — the collection card primitive (the global mn collection-card
   family) lives in app.css and is not redefined here (CLAUDE.md #1). This fixes
   a carousel-track width so scroll-snap has a target, matching the series rail. */
[b-lifvw2k6qm] .home-collection-card {
    width: 280px;
    flex-shrink: 0;
    scroll-snap-align: start;
}

@media (min-width: 576px) {
    [b-lifvw2k6qm] .home-collection-card {
        width: 320px;
    }
}

/* ===== Home Card — Completion Status Badge ===== */
.home-card-status[b-lifvw2k6qm] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-family: var(--mn-font-system);
    font-size: 0.65rem;
    font-weight: 600;
    line-height: 1;
    padding: 0.2em 0.5em;
    border-radius: var(--mn-radius-full);
    white-space: nowrap;
    margin-bottom: var(--mn-space-1);
}

.home-card-status i[b-lifvw2k6qm] {
    font-size: 0.6rem;
}

.home-card-status--complete[b-lifvw2k6qm] {
    background: rgba(45, 122, 79, 0.12);
    color: var(--mn-success);
}

/* bootstrap-eradication: REVIEW raw hex (#2563eb) — no exact token match for this blue; needs design decision before mapping to --mn-info or new token */
.home-card-status--ongoing[b-lifvw2k6qm] {
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
}

.home-card-status--hiatus[b-lifvw2k6qm] {
    background: rgba(145, 138, 126, 0.15);
    color: var(--mn-text-tertiary);
}

.home-card-status-detail[b-lifvw2k6qm] {
    opacity: 0.75;
}

/* ===== Home Card — Social Proof Row ===== */
.home-card-social[b-lifvw2k6qm] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: var(--mn-space-1);
}

.home-card-social-count[b-lifvw2k6qm] {
    font-family: var(--mn-font-system);
    font-size: 0.65rem;
    color: var(--mn-text-tertiary);
    font-weight: 500;
}

.home-card-social--views[b-lifvw2k6qm] {
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-xs);
    color: var(--mn-text-tertiary);
    gap: 0.3rem;
}

.home-card-social--views i[b-lifvw2k6qm] {
    font-size: 0.7rem;
}

/* ===== Home Card — Bottom Row (Price · Heat · Length) ===== */
.home-card-bottom[b-lifvw2k6qm] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.2rem;
    margin-top: var(--mn-space-1);
    font-family: var(--mn-font-system);
    font-size: 0.7rem;
    line-height: 1.2;
}

.home-card-price[b-lifvw2k6qm] {
    font-weight: 700;
    color: var(--mn-text-primary);
}

.home-card-price--free[b-lifvw2k6qm] {
    font-weight: 700;
    color: var(--mn-success);
}

.home-card-sep[b-lifvw2k6qm] {
    color: var(--mn-text-tertiary);
    font-weight: 400;
    user-select: none;
}

.home-card-sample[b-lifvw2k6qm] {
    color: var(--mn-success);
    font-weight: 600;
}

.home-card-sample i[b-lifvw2k6qm] {
    font-size: 0.6rem;
}

.home-card-length[b-lifvw2k6qm] {
    color: var(--mn-text-secondary);
    font-weight: 500;
}

/* ===== Compact Resume Section ===== */
.home-resume-section[b-lifvw2k6qm] {
    margin-bottom: var(--mn-space-8);
}

/* ===== Resume Reading ===== */
.home-resume-card[b-lifvw2k6qm] {
    position: relative;
    width: 110px;
}

@media (min-width: 576px) {
    .home-resume-card[b-lifvw2k6qm] {
        width: 110px;
    }
}

.home-resume-progress[b-lifvw2k6qm] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 0 0 var(--mn-radius-md) var(--mn-radius-md);
    overflow: hidden;
}

.home-resume-progress-bar[b-lifvw2k6qm] {
    height: 100%;
    background: var(--mn-gold);
    transition: width var(--mn-transition-base);
}

.home-resume-badge[b-lifvw2k6qm] {
    position: absolute;
    top: 6px;
    right: 6px;
    background: var(--mn-primary);
    color: var(--mn-gold);
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
}

/* ===== Audio Highlight — Backroom inverse hero (deeper than body) ===== */
/* bootstrap-eradication: REVIEW raw hex (#050410, #0a0716) — gradient endpoints intentionally darker than --mn-bg-body for inverse hero; needs token strategy before mapping */
.home-audio-highlight[b-lifvw2k6qm] {
    margin-bottom: var(--mn-space-16);
    padding: var(--mn-space-10) var(--mn-space-6);
    background:
        radial-gradient(circle at 15% 20%, rgba(217, 137, 71, 0.08) 0%, transparent 45%),
        radial-gradient(circle at 85% 80%, rgba(2, 24, 75, 0.5) 0%, transparent 50%),
        linear-gradient(180deg, #050410 0%, #0a0716 100%);
    border-radius: var(--mn-radius-xl);
    border: 1px solid rgba(217, 137, 71, 0.18);
    box-shadow: inset 0 1px 0 rgba(240, 232, 216, 0.04);
}

.home-audio-highlight-inner[b-lifvw2k6qm] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-6);
    align-items: center;
    max-width: 1000px;
    margin: 0 auto;
}

@media (min-width: 768px) {
    .home-audio-highlight-inner[b-lifvw2k6qm] {
        flex-direction: row;
        align-items: flex-start;
        gap: var(--mn-space-10);
    }
}

.home-audio-highlight-cover[b-lifvw2k6qm] {
    width: 220px;
    flex-shrink: 0;
}

@media (min-width: 768px) {
    .home-audio-highlight-cover[b-lifvw2k6qm] {
        width: 280px;
    }
}

.home-audio-highlight-cover a[b-lifvw2k6qm] {
    display: block;
    border-radius: var(--mn-radius-lg);
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4), 0 0 20px rgba(191, 155, 48, 0.15);
    transition: transform var(--mn-transition-base), box-shadow var(--mn-transition-base);
}

.home-audio-highlight-cover a:hover[b-lifvw2k6qm] {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5), 0 0 30px rgba(191, 155, 48, 0.25);
}

.home-audio-highlight-info[b-lifvw2k6qm] {
    flex: 1;
    min-width: 0;
    text-align: center;
    padding-top: var(--mn-space-2);
}

@media (min-width: 768px) {
    .home-audio-highlight-info[b-lifvw2k6qm] {
        text-align: left;
    }
}

/* "Audio Pick of the Day" announcement uses .mn-meta-badge--solid--pill global */

.home-audio-highlight-title[b-lifvw2k6qm] {
    font-family: var(--mn-font-body);
    font-size: clamp(1.75rem, 4.5vw, 2.75rem);
    line-height: 1.05;
    margin: 0 0 var(--mn-space-2);
    font-weight: var(--mn-font-bold);
    letter-spacing: -0.02em;
}

.home-audio-highlight-title a[b-lifvw2k6qm] {
    color: var(--mn-text-primary);
    text-decoration: none;
    transition: color var(--mn-transition-fast);
}

.home-audio-highlight-title a:hover[b-lifvw2k6qm] {
    color: var(--mn-gold);
}

.home-audio-highlight-author[b-lifvw2k6qm] {
    font-family: var(--mn-font-body);
    font-style: italic;
    font-size: var(--mn-text-lg);
    color: rgba(240, 232, 216, 0.65);
    margin: 0 0 var(--mn-space-4);
}

.home-audio-highlight-author a[b-lifvw2k6qm] {
    color: var(--mn-gold-light);
    text-decoration: none;
    font-style: italic;
    transition: color var(--mn-transition-fast);
}

.home-audio-highlight-author a:hover[b-lifvw2k6qm] {
    text-decoration: underline;
}

.home-audio-highlight-synopsis[b-lifvw2k6qm] {
    font-size: var(--mn-text-base);
    color: rgba(250, 248, 245, 0.7);
    line-height: var(--mn-leading-relaxed);
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: var(--mn-space-4);
}

.home-audio-highlight-stats[b-lifvw2k6qm] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-5);
    font-family: var(--mn-font-system);
    font-size: var(--mn-text-sm);
    color: rgba(250, 248, 245, 0.6);
    justify-content: center;
    margin-bottom: var(--mn-space-2);
}

@media (min-width: 768px) {
    .home-audio-highlight-stats[b-lifvw2k6qm] {
        justify-content: flex-start;
    }
}

.home-audio-highlight-stat[b-lifvw2k6qm] {
    display: inline-flex;
    align-items: center;
    gap: var(--mn-space-1);
}

/* ===== About Section ===== */
/* ===== About — Backroom (ink2 panel, big italic serif, blush accent) ===== */
.home-about[b-lifvw2k6qm] {
    background: var(--mn-bg-surface);
    border-radius: var(--mn-radius-xl);
    padding: var(--mn-space-12) var(--mn-space-6);
    text-align: center;
    margin-bottom: var(--mn-space-12);
    border: 1px solid var(--mn-border-default);
}

.home-about-inner[b-lifvw2k6qm] {
    max-width: 640px;
    margin: 0 auto;
}

.home-about-title[b-lifvw2k6qm] {
    color: var(--mn-text-primary);
    font-family: var(--mn-font-body);
    font-style: italic;
    font-weight: var(--mn-font-regular);
    font-size: clamp(1.75rem, 4vw, 2.625rem);
    margin-bottom: var(--mn-space-5);
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.home-about-title em[b-lifvw2k6qm],
.home-about-title .home-about-title-accent[b-lifvw2k6qm] {
    font-style: italic;
    color: var(--mn-gold);
}

.home-about-text[b-lifvw2k6qm] {
    margin: 0 auto var(--mn-space-7);
    color: var(--mn-text-secondary);
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-base);
    line-height: 1.8;
    font-weight: var(--mn-font-light);
}

.home-about-text em[b-lifvw2k6qm] {
    font-style: italic;
    color: var(--mn-gold-light);
}

/* ===== Publish CTA — Backroom (ink bg, top/bottom ember hairlines, italic ember title) ===== */
.home-cta[b-lifvw2k6qm] {
    background: var(--mn-bg-body);
    border-top: 1px solid var(--mn-gold);
    border-bottom: 1px solid var(--mn-gold);
    border-radius: 0;
    padding: var(--mn-space-16) var(--mn-space-6);
    text-align: center;
    margin: 0 calc(var(--mn-space-4) * -1) var(--mn-space-8);
}

.home-cta-title[b-lifvw2k6qm] {
    color: var(--mn-gold);
    font-family: var(--mn-font-body);
    font-style: italic;
    font-weight: var(--mn-font-regular);
    font-size: clamp(2rem, 5vw, 3rem);
    margin: 0 0 var(--mn-space-3);
    letter-spacing: -0.02em;
    line-height: 1.05;
}

.home-cta-sub[b-lifvw2k6qm] {
    color: var(--mn-text-secondary);
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-lg);
    font-weight: var(--mn-font-light);
    margin: 0 auto var(--mn-space-8);
    max-width: 56ch;
}

.home-cta-sub em[b-lifvw2k6qm] {
    font-style: italic;
    color: var(--mn-gold-light);
}

.home-cta .btn[b-lifvw2k6qm] {
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 1rem 2rem;
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
}

/* ===== Shimmer animation ===== */
.shimmer[b-lifvw2k6qm] {
    background: linear-gradient(
        90deg,
        var(--mn-bg-surface-alt) 25%,
        rgba(255, 255, 255, 0.5) 50%,
        var(--mn-bg-surface-alt) 75%
    );
    background-size: 200% 100%;
    animation: shimmer-b-lifvw2k6qm 1.5s ease-in-out infinite;
}

@keyframes shimmer-b-lifvw2k6qm {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* === Midnette CTA Banner — Backroom (ink2 card with ember hairline) === */
.midnette-cta-banner[b-lifvw2k6qm] {
    background: var(--mn-bg-surface);
    border-radius: 14px;
    padding: var(--mn-space-5) var(--mn-space-7);
    border: 1px solid rgba(217, 137, 71, 0.25);
}

.midnette-cta-inner[b-lifvw2k6qm] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-5);
}

.midnette-cta-mark[b-lifvw2k6qm] {
    font-family: var(--mn-font-body);
    font-style: italic;
    color: var(--mn-gold);
    font-size: 3.5rem;
    line-height: 1;
    flex-shrink: 0;
}

.midnette-cta-copy[b-lifvw2k6qm] {
    flex: 1;
    color: var(--mn-text-secondary);
    font-family: var(--mn-font-body);
    font-size: 0.9rem;
    line-height: 1.55;
}

.midnette-cta-copy strong[b-lifvw2k6qm] {
    display: block;
    color: var(--mn-text-primary);
    font-family: var(--mn-font-body);
    font-style: italic;
    font-weight: var(--mn-font-regular);
    font-size: 1.375rem;
    margin-bottom: 0.25rem;
    letter-spacing: -0.01em;
}

.midnette-cta-copy em[b-lifvw2k6qm] {
    font-style: italic;
    color: var(--mn-gold-light);
}

.midnette-cta-btn[b-lifvw2k6qm] {
    background: var(--mn-gold);
    color: var(--mn-navy);
    font-weight: 600;
    border: none;
    border-radius: 2rem;
    padding: 0.5rem 1.5rem;
    white-space: nowrap;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.midnette-cta-btn:hover[b-lifvw2k6qm] {
    transform: scale(1.04);
    box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.25);
    color: var(--mn-navy);
}

@media (max-width: 576px) {
    .midnette-cta-inner[b-lifvw2k6qm] {
        flex-direction: column;
        text-align: center;
    }

    .midnette-cta-banner[b-lifvw2k6qm] {
        padding: 1.25rem;
    }
}

/* ===== Anonymous Registration CTA — Backroom ===== */
.home-anon-cta[b-lifvw2k6qm] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-5);
    padding: var(--mn-space-6) var(--mn-space-7);
    background: var(--mn-bg-surface);
    border-radius: var(--mn-radius-lg);
    border: 1px solid var(--mn-border-strong);
    border-left: 3px solid var(--mn-gold);
}

.home-anon-cta > i[b-lifvw2k6qm] {
    font-size: 1.75rem;
    color: var(--mn-gold);
    flex-shrink: 0;
}

.home-anon-cta-copy[b-lifvw2k6qm] {
    flex: 1;
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-sm);
    color: var(--mn-text-secondary);
    line-height: 1.55;
    font-weight: var(--mn-font-light);
}

.home-anon-cta-copy strong[b-lifvw2k6qm] {
    display: block;
    color: var(--mn-text-primary);
    font-family: var(--mn-font-body);
    font-size: var(--mn-text-lg);
    font-weight: var(--mn-font-bold);
    margin-bottom: var(--mn-space-1);
    letter-spacing: -0.01em;
}

.home-anon-cta-copy strong em[b-lifvw2k6qm] {
    font-style: italic;
    font-weight: var(--mn-font-regular);
    color: var(--mn-gold);
}

.home-anon-cta-actions[b-lifvw2k6qm] {
    flex-shrink: 0;
}

@media (max-width: 576px) {
    .home-anon-cta[b-lifvw2k6qm] {
        flex-direction: column;
        text-align: center;
    }
}

/* ===== Genre Pills ===== */

.home-genre-pills[b-lifvw2k6qm] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-2);
}

/* Genre pills use the global .topic-chip primitive (name + divided count,
   dark-correct hover). Only the flex-wrap row layout is page-specific. */
/* /Pages/Notifications.razor.rz.scp.css */
.notifications-page[b-bu6nzhcbyt] {
    max-width: 700px;
    margin: calc(var(--mn-header-height) + var(--mn-space-8)) auto var(--mn-space-12);
    padding: 0 var(--mn-space-4);
}

.notifications-header[b-bu6nzhcbyt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--mn-space-6);
    flex-wrap: wrap;
    gap: var(--mn-space-3);
}

.notifications-header h1[b-bu6nzhcbyt] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--mn-text);
    margin: 0;
}

.notifications-actions[b-bu6nzhcbyt] {
    display: flex;
    align-items: center;
    gap: var(--mn-space-4);
}

.notifications-filter[b-bu6nzhcbyt] {
    display: flex;
    border: 1px solid var(--mn-border);
    border-radius: var(--mn-radius-md);
    overflow: hidden;
}

.filter-btn[b-bu6nzhcbyt] {
    background: var(--mn-surface);
    border: none;
    padding: var(--mn-space-1) var(--mn-space-4);
    font-size: 0.85rem;
    cursor: pointer;
    color: var(--mn-text-muted);
    transition: all var(--mn-transition-fast);
    font-family: var(--mn-font-body);
}

.filter-btn.active[b-bu6nzhcbyt] {
    background: var(--mn-navy);
    color: white;
}

.mark-all-btn[b-bu6nzhcbyt] {
    background: none;
    border: none;
    color: var(--mn-accent);
    font-size: 0.85rem;
    cursor: pointer;
    padding: 0;
    font-family: var(--mn-font-body);
}

.mark-all-btn:hover[b-bu6nzhcbyt] {
    text-decoration: underline;
}

.notifications-loading[b-bu6nzhcbyt],
.notifications-empty[b-bu6nzhcbyt] {
    text-align: center;
    padding: var(--mn-space-12) 0;
    color: var(--mn-text-muted);
}

.notifications-empty i[b-bu6nzhcbyt] {
    font-size: 2.5rem;
    display: block;
    margin-bottom: var(--mn-space-3);
    opacity: 0.4;
}

.notifications-list[b-bu6nzhcbyt] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--mn-border);
    border-radius: var(--mn-radius-lg);
    overflow: hidden;
}

.notification-row[b-bu6nzhcbyt] {
    display: flex;
    gap: var(--mn-space-3);
    padding: var(--mn-space-4);
    border: none;
    background: var(--mn-surface);
    width: 100%;
    text-align: left;
    cursor: pointer;
    transition: background var(--mn-transition-fast);
    font-family: var(--mn-font-body);
    border-bottom: 1px solid var(--mn-border-light, rgba(0,0,0,0.05));
    align-items: flex-start;
}

.notification-row:last-child[b-bu6nzhcbyt] {
    border-bottom: none;
}

.notification-row:hover[b-bu6nzhcbyt] {
    background: var(--mn-hover-bg, rgba(0,0,0,0.02));
}

.notification-row.unread[b-bu6nzhcbyt] {
    background: var(--mn-highlight-bg, rgba(181, 152, 74, 0.04));
    border-left: 3px solid var(--mn-accent);
}

.notification-row-icon[b-bu6nzhcbyt] {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--mn-radius-full);
    background: var(--mn-bg-subtle, rgba(0,0,0,0.05));
    color: var(--mn-text-muted);
    font-size: 1rem;
}

.notification-row.unread .notification-row-icon[b-bu6nzhcbyt] {
    background: rgba(181, 152, 74, 0.12);
    color: var(--mn-accent);
}

.notification-row-content[b-bu6nzhcbyt] {
    flex: 1;
    min-width: 0;
}

.notification-row-title[b-bu6nzhcbyt] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--mn-text);
    margin-bottom: 2px;
}

.notification-row-message[b-bu6nzhcbyt] {
    font-size: 0.85rem;
    color: var(--mn-text-muted);
    line-height: 1.5;
}

.notification-row-time[b-bu6nzhcbyt] {
    font-size: 0.75rem;
    color: var(--mn-text-muted);
    margin-top: var(--mn-space-1);
    font-family: var(--mn-font-system);
}

.notification-unread-dot[b-bu6nzhcbyt] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    border-radius: var(--mn-radius-full);
    background: var(--mn-accent);
    margin-top: var(--mn-space-2);
}

.notifications-load-more[b-bu6nzhcbyt] {
    text-align: center;
    padding: var(--mn-space-4);
}

.load-more-btn[b-bu6nzhcbyt] {
    background: none;
    border: 1px solid var(--mn-border);
    border-radius: var(--mn-radius-md);
    padding: var(--mn-space-2) var(--mn-space-6);
    color: var(--mn-text);
    cursor: pointer;
    font-family: var(--mn-font-body);
    font-size: 0.85rem;
    transition: all var(--mn-transition-fast);
}

.load-more-btn:hover:not(:disabled)[b-bu6nzhcbyt] {
    border-color: var(--mn-accent);
    color: var(--mn-accent);
}

.load-more-btn:disabled[b-bu6nzhcbyt] {
    opacity: 0.6;
    cursor: not-allowed;
}
/* /Pages/Publishers.razor.rz.scp.css */
/* ══════════════════════════════════════
   Publishers Landing Page
   ══════════════════════════════════════ */

/* ── Hero ── */
.publishers-hero[b-pisa19hs1e] {
    text-align: center;
    padding: var(--mn-space-16) var(--mn-space-4) var(--mn-space-12);
    max-width: 720px;
    margin: 0 auto;
}

.publishers-hero-title[b-pisa19hs1e] {
    font-size: clamp(1.8rem, 5vw, 2.8rem);
    line-height: 1.2;
    margin-bottom: var(--mn-space-4);
}

.publishers-hero-sub[b-pisa19hs1e] {
    font-size: var(--mn-text-lg);
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    margin-bottom: var(--mn-space-8);
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

.publishers-hero-cta[b-pisa19hs1e] {
    margin-top: var(--mn-space-6);
}

/* ── Sections ── */
.publishers-section[b-pisa19hs1e] {
    padding: var(--mn-space-12) var(--mn-space-4);
    max-width: 1000px;
    margin: 0 auto;
}

.publishers-section-alt[b-pisa19hs1e] {
    background: var(--mn-bg-surface-alt);
    border-radius: var(--mn-radius-xl);
    max-width: 100%;
    padding-left: var(--mn-space-6);
    padding-right: var(--mn-space-6);
    margin-bottom: var(--mn-space-8);
}

.publishers-section-title[b-pisa19hs1e] {
    text-align: center;
    font-size: clamp(1.4rem, 3.5vw, 2rem);
    margin-bottom: var(--mn-space-8);
}

/* ── Complaints Grid ── */
.publishers-complaints[b-pisa19hs1e] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-4);
    margin-bottom: var(--mn-space-6);
}

.complaint-card[b-pisa19hs1e] {
    display: flex;
    align-items: flex-start;
    gap: var(--mn-space-3);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-left: 4px solid var(--mn-danger);
    border-radius: 0 var(--mn-radius-md) var(--mn-radius-md) 0;
    padding: var(--mn-space-4);
}

.complaint-card i[b-pisa19hs1e] {
    font-size: 1.25rem;
    color: var(--mn-danger);
    flex-shrink: 0;
    margin-top: 2px;
}

.complaint-card p[b-pisa19hs1e] {
    margin: 0;
    font-style: italic;
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
}

.publishers-punchline[b-pisa19hs1e] {
    text-align: center;
    font-size: var(--mn-text-lg);
    margin-top: var(--mn-space-6);
}

/* ── Value Proposition Grid (Why Midnette) ── */
.value-grid[b-pisa19hs1e] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    max-width: 960px;
    margin: 0 auto;
}

.value-card[b-pisa19hs1e] {
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-6);
    transition: box-shadow var(--mn-transition-base), border-color var(--mn-transition-base);
}

.value-card:hover[b-pisa19hs1e] {
    box-shadow: var(--mn-shadow-md);
    border-color: var(--mn-border-strong);
}

.value-icon[b-pisa19hs1e] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-navy);
    color: var(--mn-gold);
    border-radius: var(--mn-radius-md);
    font-size: 1.25rem;
    margin-bottom: var(--mn-space-4);
}

.value-card h3[b-pisa19hs1e] {
    font-size: var(--mn-text-lg);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-2);
}

.value-card p[b-pisa19hs1e] {
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    margin: 0;
    font-size: var(--mn-text-sm);
}

/* ── Terms Grid (The Deal) ── */
.terms-grid[b-pisa19hs1e] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-5);
    max-width: 960px;
    margin: 0 auto;
}

.term-card[b-pisa19hs1e] {
    display: flex;
    align-items: flex-start;
    gap: var(--mn-space-4);
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-5);
    transition: box-shadow var(--mn-transition-base), border-color var(--mn-transition-base);
}

.term-card:hover[b-pisa19hs1e] {
    box-shadow: var(--mn-shadow-md);
    border-color: var(--mn-border-strong);
}

.term-icon[b-pisa19hs1e] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-navy);
    color: var(--mn-gold);
    border-radius: var(--mn-radius-md);
    font-size: 1.15rem;
    flex-shrink: 0;
}

.term-content[b-pisa19hs1e] {
    flex: 1;
    min-width: 0;
}

.term-card h3[b-pisa19hs1e] {
    font-size: var(--mn-text-base);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-1);
}

.term-card p[b-pisa19hs1e] {
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    margin: 0;
    font-size: var(--mn-text-sm);
}

/* ── Steps Grid ── */
.steps-grid[b-pisa19hs1e] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-6);
    max-width: 800px;
    margin: 0 auto;
}

.step-card[b-pisa19hs1e] {
    text-align: center;
    padding: var(--mn-space-6) var(--mn-space-4);
}

.step-number[b-pisa19hs1e] {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-gold);
    color: white;
    font-weight: var(--mn-font-bold);
    font-size: var(--mn-text-xl);
    border-radius: 50%;
    margin-bottom: var(--mn-space-3);
    box-shadow: var(--mn-shadow-gold);
}

.step-card h3[b-pisa19hs1e] {
    font-size: var(--mn-text-base);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-1);
}

.step-card p[b-pisa19hs1e] {
    color: var(--mn-text-secondary);
    font-size: var(--mn-text-sm);
    margin: 0;
}

/* ── FAQ Accordion ── */
.publishers-faq[b-pisa19hs1e] {
    max-width: 760px;
    margin: 0 auto;
}

.faq-item[b-pisa19hs1e] {
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
    margin-bottom: var(--mn-space-3);
    background: var(--mn-bg-surface);
    overflow: hidden;
}

.faq-item summary[b-pisa19hs1e] {
    padding: var(--mn-space-4) var(--mn-space-5);
    font-weight: var(--mn-font-semibold);
    font-size: var(--mn-text-base);
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mn-space-3);
    transition: background var(--mn-transition-base);
}

.faq-item summary:hover[b-pisa19hs1e] {
    background: var(--mn-bg-surface-alt);
}

/* Hide native marker */
.faq-item summary[b-pisa19hs1e]::-webkit-details-marker {
    display: none;
}

.faq-item summary[b-pisa19hs1e]::marker {
    display: none;
    content: "";
}

/* Chevron styles are in app.css (Blazor scoped CSS can't target ::after) */

.faq-item[open] summary[b-pisa19hs1e] {
    border-bottom: 1px solid var(--mn-border-default);
}

.faq-answer[b-pisa19hs1e] {
    padding: var(--mn-space-4) var(--mn-space-5);
}

.faq-answer p[b-pisa19hs1e] {
    margin: 0;
    color: var(--mn-text-secondary);
    line-height: var(--mn-leading-relaxed);
    font-size: var(--mn-text-sm);
}

/* ── Inquiry Form ── */
.publishers-form-intro[b-pisa19hs1e] {
    text-align: center;
    color: var(--mn-text-secondary);
    font-size: var(--mn-text-base);
    margin-bottom: var(--mn-space-8);
    margin-top: calc(-1 * var(--mn-space-4));
}

.inquiry-form-wrapper[b-pisa19hs1e] {
    max-width: 640px;
    margin: 0 auto;
    background: var(--mn-bg-surface);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-8) var(--mn-space-6);
}

.form-row[b-pisa19hs1e] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-4);
    margin-bottom: var(--mn-space-4);
}

.form-group[b-pisa19hs1e] {
    display: flex;
    flex-direction: column;
}

.form-group label[b-pisa19hs1e] {
    font-size: var(--mn-text-sm);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-1);
}

.form-optional[b-pisa19hs1e] {
    font-weight: normal;
    color: var(--mn-text-secondary);
}

.form-group-full[b-pisa19hs1e] {
    margin-bottom: var(--mn-space-6);
}

.form-group .form-control[b-pisa19hs1e] {
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-md);
    padding: var(--mn-space-2) var(--mn-space-3);
    font-size: var(--mn-text-sm);
    font-family: var(--mn-font-body);
    color: var(--mn-text-primary);
    background: var(--mn-bg-surface);
    transition: border-color var(--mn-transition-base);
}

/* Focus ring inherits the global gold ring from app.css. */

.form-group textarea.form-control[b-pisa19hs1e] {
    resize: vertical;
    min-height: 100px;
}

.form-actions[b-pisa19hs1e] {
    text-align: center;
}

.form-fallback[b-pisa19hs1e] {
    text-align: center;
    font-size: var(--mn-text-sm);
    color: var(--mn-text-secondary);
    margin-top: var(--mn-space-4);
    margin-bottom: 0;
}

/* .form-fallback a inherits link color from the global a, .btn-link rule in app.css. */

/* ── Inquiry Success / Error ── */
.inquiry-success[b-pisa19hs1e] {
    text-align: center;
    padding: var(--mn-space-8) var(--mn-space-4);
}

.inquiry-success i[b-pisa19hs1e] {
    font-size: 3rem;
    color: var(--mn-success);
    display: block;
    margin-bottom: var(--mn-space-4);
}

.inquiry-success h3[b-pisa19hs1e] {
    font-size: var(--mn-text-lg);
    font-weight: var(--mn-font-semibold);
    margin-bottom: var(--mn-space-2);
}

.inquiry-success p[b-pisa19hs1e] {
    color: var(--mn-text-secondary);
    margin: 0;
}

.inquiry-error[b-pisa19hs1e] {
    background: rgba(169, 50, 38, 0.08);
    border: 1px solid var(--mn-danger);
    border-radius: var(--mn-radius-md);
    padding: var(--mn-space-3) var(--mn-space-4);
    color: var(--mn-danger);
    font-size: var(--mn-text-sm);
    margin-bottom: var(--mn-space-4);
}

.inquiry-error i[b-pisa19hs1e] {
    margin-right: var(--mn-space-2);
}

/* ── Final CTA ── */
.publishers-final-cta[b-pisa19hs1e] {
    text-align: center;
    padding: var(--mn-space-16) var(--mn-space-4);
    background: var(--mn-navy);
    border-radius: var(--mn-radius-xl);
    margin: var(--mn-space-8) 0;
}

.publishers-final-title[b-pisa19hs1e] {
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    color: var(--mn-gold);
    margin-bottom: var(--mn-space-3);
}

.publishers-final-sub[b-pisa19hs1e] {
    color: var(--mn-text-inverse);
    font-size: var(--mn-text-lg);
    margin-bottom: var(--mn-space-8);
    opacity: 0.85;
}

.publishers-final-email[b-pisa19hs1e] {
    margin-top: var(--mn-space-4);
    margin-bottom: 0;
}

.publishers-final-email a[b-pisa19hs1e] {
    color: var(--mn-gold-light);
    font-size: var(--mn-text-sm);
    opacity: 0.8;
}

.publishers-final-email a:hover[b-pisa19hs1e] {
    opacity: 1;
}

/* ── Responsive ── */
@media (min-width: 576px) {
    .publishers-complaints[b-pisa19hs1e] {
        grid-template-columns: 1fr 1fr;
    }

    .steps-grid[b-pisa19hs1e] {
        grid-template-columns: 1fr 1fr;
    }

    .form-row[b-pisa19hs1e] {
        grid-template-columns: 1fr 1fr;
    }

    .terms-grid[b-pisa19hs1e] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 768px) {
    .value-grid[b-pisa19hs1e] {
        grid-template-columns: 1fr 1fr;
    }

    .steps-grid[b-pisa19hs1e] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 992px) {
    .value-grid[b-pisa19hs1e] {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .publishers-section-alt[b-pisa19hs1e] {
        padding-left: var(--mn-space-12);
        padding-right: var(--mn-space-12);
    }

    .terms-grid[b-pisa19hs1e] {
        grid-template-columns: 1fr 1fr 1fr;
    }
}
/* /Pages/Register.razor.rz.scp.css */
.age-verify-well[b-h9luq9v5aw] {
    background: var(--mn-bg-inset);
    border: 1px solid var(--mn-border-strong);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-4);
}
/* /Pages/Resources/CreatorResources.razor.rz.scp.css */
/* ── Table of Contents ── */
.resource-toc[b-bd3wig68iz] {
    background: var(--mn-bg-surface-alt);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-lg);
    padding: var(--mn-space-4) var(--mn-space-6);
}

.toc-heading[b-bd3wig68iz] {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: var(--mn-text-xs);
    color: var(--mn-text-secondary);
    margin-bottom: var(--mn-space-2);
}

.resource-toc ol[b-bd3wig68iz] {
    margin-bottom: 0;
    padding-left: var(--mn-space-6);
}

.resource-toc li[b-bd3wig68iz] {
    margin-bottom: var(--mn-space-1);
}

.resource-toc a[b-bd3wig68iz] {
    color: var(--mn-text-link);
    text-decoration: none;
    font-size: var(--mn-text-sm);
}

.resource-toc a:hover[b-bd3wig68iz] {
    color: var(--mn-text-link-hover);
    text-decoration: underline;
}

/* ── Article Body Typography ── */
.resource-article h3[b-bd3wig68iz] {
    font-size: var(--mn-text-xl);
    font-weight: var(--mn-font-semibold);
    margin-top: var(--mn-space-8);
    margin-bottom: var(--mn-space-3);
    padding-bottom: var(--mn-space-2);
    border-bottom: 1px solid var(--mn-border-light);
    color: var(--mn-text-primary);
}

.resource-article h3:first-child[b-bd3wig68iz] {
    margin-top: 0;
}

.resource-article p[b-bd3wig68iz] {
    line-height: var(--mn-leading-relaxed);
    margin-bottom: var(--mn-space-3);
}

.resource-article ul[b-bd3wig68iz],
.resource-article ol[b-bd3wig68iz] {
    margin-bottom: var(--mn-space-4);
    padding-left: var(--mn-space-6);
}

.resource-article li[b-bd3wig68iz] {
    margin-bottom: var(--mn-space-2);
    line-height: var(--mn-leading-relaxed);
}

/* ── Callout Boxes ── */
.resource-callout[b-bd3wig68iz] {
    background: var(--mn-bg-surface-alt);
    border-left: 4px solid var(--mn-gold);
    border-radius: 0 var(--mn-radius-md) var(--mn-radius-md) 0;
    padding: var(--mn-space-3) var(--mn-space-4);
    margin: var(--mn-space-4) 0;
    font-size: var(--mn-text-sm);
    line-height: var(--mn-leading-relaxed);
}

.resource-callout-tip[b-bd3wig68iz] {
    border-left-color: var(--mn-navy-lighter);
    background: rgba(2, 24, 75, 0.04);
}

.resource-callout ul[b-bd3wig68iz] {
    padding-left: var(--mn-space-5);
}

/* ── Status List (badge + description pairs) ── */
.status-list[b-bd3wig68iz] {
    display: flex;
    flex-direction: column;
    gap: var(--mn-space-3);
    margin: var(--mn-space-4) 0;
}

.status-item[b-bd3wig68iz] {
    display: flex;
    gap: var(--mn-space-3);
    align-items: flex-start;
}

.status-item .badge[b-bd3wig68iz] {
    flex-shrink: 0;
    margin-top: 2px;
    font-size: var(--mn-text-xs);
    min-width: 5rem;
    text-align: center;
}

.status-item div[b-bd3wig68iz] {
    line-height: var(--mn-leading-relaxed);
    font-size: var(--mn-text-sm);
}

/* ── Accordion Brand Overrides ── */
[b-bd3wig68iz] .accordion-item {
    border-color: var(--mn-border-default);
}

[b-bd3wig68iz] .accordion-button {
    font-weight: var(--mn-font-semibold);
    color: var(--mn-text-primary);
}

[b-bd3wig68iz] .accordion-button:not(.collapsed) {
    background-color: var(--mn-bg-surface-alt);
    color: var(--mn-navy);
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--mn-border-default);
}

[b-bd3wig68iz] .accordion-button:focus {
    box-shadow: 0 0 0 0.2rem rgba(181, 152, 74, 0.25);
    border-color: var(--mn-gold);
}

[b-bd3wig68iz] .accordion-button::after {
    filter: none;
}

/* ── Responsive ── */
@media (max-width: 576px) {
    .status-item[b-bd3wig68iz] {
        flex-direction: column;
        gap: var(--mn-space-1);
    }

    .status-item .badge[b-bd3wig68iz] {
        align-self: flex-start;
    }

    .resource-toc[b-bd3wig68iz] {
        padding: var(--mn-space-3) var(--mn-space-4);
    }
}
/* /Pages/Series/SeriesBrowse.razor.rz.scp.css */
/* Series browse — page-scoped layout only. Filter chrome (sidebar, drawer
   overlay, header, scrollable body, footer, close, backdrop, animations) is
   owned by the shared BottomSheet primitive via <FilterDrawer>. Browse-page
   primitives (.mn-page-strip, .mn-page-layout, .mn-page-sidebar,
   .mn-page-results, .mn-results-*, .mn-page-empty) plus filter primitives
   (.sort-pill-bar, .active-filter-bar, .filter-pill, .filter-section,
   .filter-radio-btn, .filter-heat-btn, .filter-tag-btn, .filter-range) plus
   typography (.mn-hero-title--retail) all live in app.css. */

/* In-sidebar Title-contains search input. Used inside SeriesFilterPanel's
   Search FilterSection — small enough to keep page-scoped since it doesn't
   match any existing global pattern. */
.series-filter-search[b-ezpzcfz5o3] {
    width: 100%;
    background: var(--mn-bg-surface-alt);
    border: 1px solid var(--mn-border-default);
    border-radius: var(--mn-radius-sm);
    color: var(--mn-text-primary);
    padding: var(--mn-space-2) var(--mn-space-3);
    font-family: var(--mn-font-body);
    font-size: 0.875rem;
}
.series-filter-search:focus[b-ezpzcfz5o3] {
    outline: none;
    border-color: var(--mn-border-focus);
}

/* Mobile-only "Filters" button — opens the overlay <FilterDrawer>.
   Mirrors /books's .books-filters-btn-mobile. */
.series-filters-btn-mobile[b-ezpzcfz5o3] {
    display: inline-flex;
}
@media (min-width: 992px) {
    .series-filters-btn-mobile[b-ezpzcfz5o3] {
        display: none;
    }
}

/* Result grid — 1 column mobile, 2 columns ≥768. Genuinely page-specific. */
.series-grid[b-ezpzcfz5o3] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--mn-space-3);
}

@media (min-width: 768px) {
    .series-grid[b-ezpzcfz5o3] {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* /Pages/Series/SeriesDetail.razor.rz.scp.css */
/* ================================================================
   Series Detail — page-specific layout only.
   Backroom typographic primitives (.mn-breadcrumb / .mn-hero-title /
   .mn-hero-byline / .mn-section-eyebrow / .mn-section-headline) live
   in app.css and are used directly in the markup. Do NOT redefine
   them here. This file is reserved for genuinely page-scoped layout.
   ================================================================ */

.book-row[b-716r7pwyib] {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.book-row:hover[b-716r7pwyib] {
    transform: translateY(-2px);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .1) !important;
}

.series-card[b-716r7pwyib] {
    transition: transform 0.15s ease;
}

.series-card:hover[b-716r7pwyib] {
    transform: translateY(-3px);
}
/* /Pages/Settings/NotificationPreferences.razor.rz.scp.css */
.pref-row[b-ukv1qwngst] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--mn-space-3) 0;
    border-bottom: 1px solid var(--mn-border-light, rgba(0,0,0,0.06));
    gap: var(--mn-space-4);
}

.pref-row:last-child[b-ukv1qwngst] {
    border-bottom: none;
    padding-bottom: 0;
}

.pref-row:first-of-type[b-ukv1qwngst] {
    padding-top: 0;
}

.pref-info[b-ukv1qwngst] {
    flex: 1;
    min-width: 0;
}

.pref-name[b-ukv1qwngst] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--mn-text);
}

.pref-desc[b-ukv1qwngst] {
    font-size: 0.8rem;
    color: var(--mn-text-muted);
    margin-top: 2px;
}

.pref-toggles[b-ukv1qwngst] {
    display: flex;
    gap: var(--mn-space-5);
    flex-shrink: 0;
}

.pref-toggle[b-ukv1qwngst] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.toggle-label[b-ukv1qwngst] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--mn-text-muted);
}

[b-ukv1qwngst] .form-check-input:checked {
    background-color: var(--mn-accent);
    border-color: var(--mn-accent);
}

[b-ukv1qwngst] .form-check-input:disabled {
    opacity: 0.5;
}

@media (max-width: 576px) {
    .pref-row[b-ukv1qwngst] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--mn-space-2);
    }

    .pref-toggles[b-ukv1qwngst] {
        align-self: flex-end;
    }
}