:root {
    --bg-pink: #fff7fc;
    --bg-cream: #fffaf4;
    --bg-lilac: #fff2fa;
    --surface: rgba(255, 255, 255, 0.74);
    --surface-strong: rgba(255, 255, 255, 0.9);
    --surface-soft: rgba(255, 244, 249, 0.76);
    --surface-deep: rgba(255, 234, 244, 0.82);
    --text: #70405c;
    --text-strong: #451f35;
    --text-soft: #94627d;
    --pink: #f8b9d4;
    --pink-strong: #ff63a9;
    --pink-deep: #ea3d8f;
    --gold: #d6ac67;
    --gold-soft: #f7e3b7;
    --border: rgba(234, 61, 143, 0.14);
    --shadow: 0 24px 60px rgba(216, 138, 178, 0.18);
    --shadow-strong: 0 28px 80px rgba(233, 91, 163, 0.22);
    --radius-xl: 34px;
    --radius-lg: 26px;
    --radius-md: 20px;
    --radius-sm: 14px;
    --max-width: 1180px;
    --transition: 0.32s ease;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scrollbar-gutter: stable both-edges;
    overflow-x: clip;
}

body {
    margin: 0;
    font-family: 'Manrope', sans-serif;
    line-height: 1.55;
    color: var(--text);
    background:
        radial-gradient(circle at 12% 8%, rgba(255, 207, 227, 0.9), transparent 24%),
        radial-gradient(circle at 88% 0%, rgba(255, 245, 252, 0.95), transparent 24%),
        radial-gradient(circle at 76% 72%, rgba(255, 228, 241, 0.84), transparent 22%),
        linear-gradient(180deg, #fff9fd 0%, #fffdf9 50%, #fff6fb 100%);
    min-height: 100vh;
    max-width: 100%;
    overflow-x: clip;
}

body::before,
body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -2;
}

body::before {
    background-image:
        radial-gradient(circle at 22% 25%, rgba(255, 255, 255, 0.86) 0, rgba(255, 255, 255, 0) 18%),
        radial-gradient(circle at 80% 18%, rgba(255, 222, 236, 0.65) 0, rgba(255, 222, 236, 0) 16%),
        radial-gradient(circle at 70% 78%, rgba(255, 241, 247, 0.9) 0, rgba(255, 241, 247, 0) 18%);
}

body::after {
    background-image:
        linear-gradient(120deg, rgba(255, 255, 255, 0.12) 20%, rgba(255, 255, 255, 0.02) 40%, rgba(255, 255, 255, 0.12) 60%);
    mix-blend-mode: screen;
    opacity: 0.3;
}

::selection {
    background: rgba(255, 99, 169, 0.24);
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

button,
input {
    font: inherit;
}

button {
    border: 0;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

.container {
    width: min(calc(100% - 1.4rem), var(--max-width));
    margin: 0 auto;
}

.site-shell {
    position: relative;
    padding-bottom: 5.6rem;
    overflow-x: clip;
}

.site-progress {
    position: fixed;
    inset: 0 0 auto;
    z-index: 36;
    height: 4px;
    pointer-events: none;
    background: rgba(255, 255, 255, 0.26);
}

.site-progress-bar {
    display: block;
    width: 100%;
    height: 100%;
    transform-origin: left center;
    transform: scaleX(0);
    background: linear-gradient(90deg, rgba(255, 140, 193, 0.92), rgba(255, 209, 126, 0.98), rgba(234, 61, 143, 0.92));
    box-shadow: 0 6px 18px rgba(234, 61, 143, 0.22);
}

.site-utility-dock {
    position: fixed;
    right: 0.9rem;
    bottom: 6.2rem;
    z-index: 20;
    display: grid;
    gap: 0.7rem;
}

.site-utility-button {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 3rem;
    padding: 0.8rem 0.95rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(239, 63, 146, 0.12);
    box-shadow: 0 14px 30px rgba(221, 133, 178, 0.18);
    color: var(--text-strong);
    font-weight: 800;
    cursor: pointer;
    backdrop-filter: blur(18px);
    transition: transform 220ms ease, box-shadow 220ms ease, opacity 220ms ease;
}

.site-utility-button:hover,
.site-utility-button:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(221, 133, 178, 0.24);
}

.site-utility-button.is-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
}

.site-utility-icon {
    display: inline-grid;
    place-items: center;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 50%;
    background: rgba(255, 240, 247, 0.94);
    color: var(--pink-deep);
    font-size: 0.95rem;
}

.site-utility-label {
    white-space: nowrap;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.site-assistant-nudge {
    justify-self: end;
    max-width: 15.5rem;
    padding: 0.8rem 0.95rem;
    border-radius: 1.15rem;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(239, 63, 146, 0.14);
    box-shadow: 0 18px 40px rgba(221, 133, 178, 0.2);
    color: var(--text-strong);
    font-size: 0.86rem;
    line-height: 1.45;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 220ms ease, transform 220ms ease;
    backdrop-filter: blur(18px);
}

.site-assistant-nudge.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.site-assistant-shell {
    position: fixed;
    inset: 0;
    z-index: 38;
}

.site-assistant-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(41, 17, 31, 0.3);
    backdrop-filter: blur(10px);
}

.site-assistant-panel {
    position: absolute;
    right: 1rem;
    bottom: 6.2rem;
    width: min(25rem, calc(100vw - 1.6rem));
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border-radius: 1.55rem;
    background:
        radial-gradient(circle at top right, rgba(255,255,255,0.8), transparent 30%),
        linear-gradient(180deg, rgba(255, 248, 251, 0.98), rgba(255, 236, 244, 0.96));
    border: 1px solid rgba(239, 63, 146, 0.12);
    box-shadow: 0 32px 90px rgba(85, 26, 52, 0.24);
}

.site-assistant-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.site-assistant-header-copy {
    display: grid;
    gap: 0.35rem;
}

.site-assistant-header-copy p,
.site-assistant-header-copy strong {
    margin: 0;
}

.site-assistant-close {
    width: 2.4rem;
    height: 2.4rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.84);
    border: 1px solid rgba(239, 63, 146, 0.1);
    color: var(--text-strong);
    font-size: 1.3rem;
    cursor: pointer;
}

.site-assistant-messages {
    max-height: min(52vh, 24rem);
    overflow: auto;
    display: grid;
    gap: 0.7rem;
    padding-right: 0.15rem;
}

.site-assistant-message {
    max-width: 92%;
    padding: 0.85rem 0.95rem;
    border-radius: 1rem;
    font-size: 0.95rem;
    line-height: 1.6;
}

.site-assistant-message p {
    margin: 0;
}

.site-assistant-message.is-assistant {
    justify-self: start;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(239, 63, 146, 0.08);
    color: var(--text-strong);
}

.site-assistant-message.is-user {
    justify-self: end;
    background: linear-gradient(135deg, rgba(255, 116, 180, 0.94), rgba(235, 64, 144, 0.96));
    color: white;
}

.site-assistant-message a {
    text-decoration: underline;
    text-underline-offset: 0.12em;
}

.site-assistant-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.site-assistant-chip {
    padding: 0.62rem 0.9rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(239, 63, 146, 0.12);
    color: var(--text-strong);
    font-weight: 700;
    cursor: pointer;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.site-assistant-chip:hover,
.site-assistant-chip:focus-visible,
.site-assistant-close:hover,
.site-assistant-close:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(221, 133, 178, 0.18);
}

.site-assistant-form {
    display: grid;
    gap: 0.75rem;
}

.site-assistant-field input {
    width: 100%;
    min-height: 3.25rem;
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    border: 1px solid rgba(239, 63, 146, 0.14);
    background: rgba(255, 255, 255, 0.92);
    color: var(--text-strong);
}

.site-assistant-field input::placeholder {
    color: rgba(112, 64, 92, 0.64);
}

.site-assistant-field input:focus {
    outline: 2px solid rgba(234, 61, 143, 0.24);
    border-color: rgba(234, 61, 143, 0.22);
}

@media (max-width: 719px) {
    .site-assistant-panel {
        left: 0.8rem;
        right: 0.8rem;
        width: auto;
        bottom: 5.5rem;
    }

    .site-assistant-form .btn {
        width: 100%;
    }
}

#contact,
#privacy,
#contact-legal,
#terms-top {
    scroll-margin-top: 7rem;
}

.announcement-bar {
    position: sticky;
    top: 0;
    z-index: 14;
    background: linear-gradient(90deg, rgba(255, 103, 172, 0.94), rgba(234, 61, 143, 0.94), rgba(255, 149, 190, 0.94));
    color: white;
    padding: 0.8rem 0;
    box-shadow: 0 10px 24px rgba(234, 61, 143, 0.18);
}

.announcement-inner {
    display: flex;
    justify-content: space-between;
    gap: 0.9rem;
    align-items: center;
    flex-wrap: wrap;
    font-size: 0.88rem;
    font-weight: 700;
}

.announcement-inner span {
    letter-spacing: 0.02em;
    min-width: 0;
}

.announcement-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.4rem;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    white-space: nowrap;
    border-bottom: 1px solid rgba(255, 255, 255, 0.68);
    max-width: 100%;
    text-align: center;
}

.loading-screen,
.age-gate-modal,
.vip-modal {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1.2rem;
    z-index: 40;
}

.loading-screen {
    background: linear-gradient(180deg, rgba(255, 246, 251, 0.98), rgba(255, 250, 243, 0.99));
    transition: opacity 0.45s ease, visibility 0.45s ease;
}

.loading-screen.fade-out {
    opacity: 0;
    visibility: hidden;
}

.loader-card,
.age-gate-content,
.vip-modal-card {
    width: min(100%, 520px);
    text-align: center;
}

.loader-card {
    padding: 2rem;
}

.loader-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.4rem;
    height: 5.4rem;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--pink-strong), #ffcce2 70%);
    color: white;
    font-weight: 800;
    letter-spacing: 0.08em;
    box-shadow: 0 18px 44px rgba(239, 63, 146, 0.28);
    margin-bottom: 1rem;
    animation: floaty 2.4s ease-in-out infinite;
}

.loader-card p {
    margin: 0;
    color: var(--text-strong);
    font-weight: 700;
}

.age-gate-modal,
.vip-modal {
    background: rgba(255, 245, 250, 0.66);
    backdrop-filter: blur(22px);
}

.soft-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(255, 247, 251, 0.88));
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    backdrop-filter: blur(18px);
}

.age-gate-content,
.vip-modal-card {
    padding: 2rem;
}

.vip-modal {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.28s ease, visibility 0.28s ease;
}

.vip-modal.is-open {
    opacity: 1;
    visibility: visible;
}

.vip-modal-card {
    position: relative;
    overflow: hidden;
}

.vip-modal-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.86);
    color: var(--text-strong);
    cursor: pointer;
}

.vip-modal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
    gap: 0.9rem;
    margin: 1.35rem 0;
    text-align: left;
}

.vip-modal-item {
    padding: 0.95rem 1rem;
    border-radius: 1.1rem;
    background: rgba(255, 244, 249, 0.7);
    border: 1px solid rgba(234, 61, 143, 0.1);
}

.floating-orbs {
    position: fixed;
    inset: 0;
    pointer-events: none;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    overflow: clip;
    contain: paint;
    z-index: -1;
}

.floating-orbs span {
    position: absolute;
    border-radius: 50%;
    filter: blur(3px);
    opacity: 0.55;
    animation: orbFloat 18s linear infinite;
}

.floating-orbs span:nth-child(1) {
    width: 12rem;
    height: 12rem;
    left: -2rem;
    top: 14rem;
    background: radial-gradient(circle, rgba(255, 183, 214, 0.7), rgba(255, 183, 214, 0));
}

.floating-orbs span:nth-child(2) {
    width: 10rem;
    height: 10rem;
    right: -1rem;
    top: 32rem;
    background: radial-gradient(circle, rgba(255, 237, 196, 0.7), rgba(255, 237, 196, 0));
    animation-duration: 22s;
}

.floating-orbs span:nth-child(3) {
    width: 8rem;
    height: 8rem;
    left: 68%;
    top: 8rem;
    background: radial-gradient(circle, rgba(255, 209, 230, 0.68), rgba(255, 209, 230, 0));
    animation-duration: 20s;
}

.site-header {
    position: sticky;
    top: 3rem;
    z-index: 12;
    padding: 0.9rem 0;
    backdrop-filter: blur(12px);
    background: rgba(255, 248, 252, 0.68);
    border-bottom: 1px solid rgba(239, 63, 146, 0.08);
    transition: background 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.site-header.scrolled {
    background: rgba(255, 251, 253, 0.93);
    box-shadow: 0 14px 38px rgba(226, 164, 191, 0.14);
}

.nav-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.brand {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.brand-mark,
.hero-copy h1,
.page-hero h1,
.section-heading h2,
.copy-card h2,
.auth-sidecard h2,
.hero-card h2,
.feed-card h3,
.preview-overlay h3,
.bio-story-copy h2,
.age-gate-content h1,
.vip-modal-card h2 {
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
}

.brand-mark {
    font-size: 2rem;
    font-weight: 700;
}

.brand-sub,
.eyebrow,
.card-kicker,
.tier-label,
.section-tag,
.status-pill span,
.announcement-pill,
.preview-lock {
    color: var(--pink-deep);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.nav-toggle {
    border: 1px solid rgba(239, 63, 146, 0.16);
    background: rgba(255, 255, 255, 0.74);
    color: var(--text-strong);
    padding: 0.8rem 1rem;
    border-radius: 999px;
    font-weight: 700;
    cursor: pointer;
}

.site-nav {
    position: absolute;
    top: calc(100% + 0.8rem);
    right: 0.8rem;
    left: 0.8rem;
    display: flex;
    flex-direction: column;
    padding: 1rem;
    gap: 0.55rem;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(239, 63, 146, 0.13);
    border-radius: 1.45rem;
    box-shadow: var(--shadow);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-10px) scale(0.985);
    transform-origin: top right;
    transition: opacity 200ms ease, transform 200ms ease, visibility 200ms ease;
    max-width: 100%;
}

.site-nav.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.site-nav a {
    padding: 0.9rem 1rem;
    border-radius: 999px;
    font-weight: 700;
    transition: background 200ms ease, color 200ms ease, transform 200ms ease;
    max-width: 100%;
    min-width: 0;
    text-align: center;
}

.site-nav a[aria-current="page"],
.site-nav a:hover,
.site-nav a:focus-visible,
.mobile-bottom-nav a.active {
    background: rgba(255, 93, 162, 0.1);
    color: var(--pink-deep);
}

.site-nav a:hover,
.site-nav a:focus-visible {
    transform: translateY(-1px);
}

.hero-section,
.page-hero {
    position: relative;
    padding: 4.2rem 0 1.8rem;
    overflow-x: clip;
}

.hero-grid,
.page-hero-inner,
.auth-layout,
.split-panel,
.memoir-grid,
.bio-layout,
.bio-story-grid,
.status-section,
.feed-grid,
.preview-grid,
.testimonial-grid,
.footer-top,
.rewards-visual-grid,
.tier-grid,
.product-grid,
.feature-grid {
    display: grid;
    gap: 1.1rem;
}

.hero-grid > *,
.page-hero-inner > *,
.auth-layout > *,
.split-panel > *,
.memoir-grid > *,
.bio-layout > *,
.bio-story-grid > *,
.status-section > *,
.feed-grid > *,
.preview-grid > *,
.testimonial-grid > *,
.footer-top > *,
.rewards-visual-grid > *,
.tier-grid > *,
.product-grid > *,
.feature-grid > *,
.book-library-hero-grid > *,
.books-library-grid > * {
    min-width: 0;
}

.hero-copy,
.page-hero-inner > div:first-child {
    padding-top: 0.5rem;
}

.hero-copy h1,
.page-hero h1,
.age-gate-content h1,
.vip-modal-card h2 {
    margin: 0 0 0.75rem;
    line-height: 0.94;
    font-size: clamp(3rem, 8vw, 5.8rem);
}

.hero-copy h1,
.page-hero h1,
.section-heading h2,
.copy-card h2,
.auth-sidecard h2,
.hero-card h2,
.feed-card h3,
.preview-overlay h3,
.bio-story-copy h2,
.age-gate-content h1,
.vip-modal-card h2,
.contact-email-card h3,
.library-checkout-notice h2,
.library-locked-card h3,
.book-card h3 {
    overflow-wrap: anywhere;
    text-wrap: balance;
}

.hero-copy h1 {
    margin-bottom: 0.9rem;
}

.hero-text,
.section-heading p,
.hero-card p,
.copy-card p,
.auth-sidecard p,
.feature-card p,
.bio-copy p,
.product-card p,
.tier-card p,
.site-footer p,
.form-note,
.page-hero-card p,
.feed-card p,
.preview-overlay p,
.comment-card p,
.bio-story-copy p,
.vip-modal-card p,
.announcement-banner p,
.story-card p {
    line-height: 1.72;
}

.hero-text {
    font-size: 1.03rem;
    color: var(--text-soft);
}

.button-row,
.hero-badges,
.age-gate-buttons,
.vip-modal-actions,
.cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3.35rem;
    max-width: 100%;
    padding: 0.95rem 1.45rem;
    border-radius: 999px;
    border: 1px solid transparent;
    font-weight: 800;
    transition: transform var(--transition), box-shadow var(--transition), background var(--transition), border-color var(--transition);
    cursor: pointer;
    overflow: hidden;
    text-align: center;
}

.btn::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, rgba(255,255,255,0) 20%, rgba(255,255,255,0.34) 48%, rgba(255,255,255,0) 72%);
    transform: translateX(-120%);
    transition: transform 0.7s ease;
}

.btn:hover::after,
.btn:focus-visible::after {
    transform: translateX(120%);
}

.btn:hover,
.btn:focus-visible {
    transform: translateY(-2px) scale(1.01);
}

.btn-primary {
    background: linear-gradient(135deg, var(--pink-deep), var(--pink-strong));
    color: white;
    box-shadow: 0 16px 30px rgba(239, 63, 146, 0.26);
}

.btn-secondary {
    background: rgba(255, 255, 255, 0.78);
    border-color: rgba(239, 63, 146, 0.18);
    color: var(--text-strong);
}

.btn-ghost {
    background: rgba(255, 255, 255, 0.45);
    border-color: rgba(216, 174, 95, 0.35);
    color: var(--text-strong);
}

.btn-gold {
    background: linear-gradient(135deg, #ffe5a7, #e4bb72);
    color: #6b4713;
    box-shadow: 0 16px 34px rgba(214, 172, 103, 0.24);
}

.sparkle-layer,
.soft-sparkles {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.sparkle-layer span,
.soft-sparkles span {
    position: absolute;
    color: rgba(255, 93, 162, 0.34);
    font-size: clamp(1rem, 2vw, 1.7rem);
    animation: drift 10s ease-in-out infinite;
}

.sparkle-layer span:nth-child(1) { top: 9%; left: 12%; }
.sparkle-layer span:nth-child(2) { top: 23%; right: 18%; animation-delay: 1.4s; }
.sparkle-layer span:nth-child(3) { bottom: 25%; left: 22%; animation-delay: 2.6s; }
.sparkle-layer span:nth-child(4) { bottom: 14%; right: 28%; animation-delay: 3.5s; }
.sparkle-layer span:nth-child(5) { top: 40%; right: 8%; animation-delay: 4.1s; }

.soft-sparkles span:nth-child(1) { top: 12%; right: 10%; }
.soft-sparkles span:nth-child(2) { bottom: 8%; left: 12%; animation-delay: 1.6s; }
.soft-sparkles span:nth-child(3) { top: 50%; left: 50%; animation-delay: 3.1s; }

.hero-card,
.page-hero-card,
.promo-panel,
.rewards-preview,
.memoir-copy-card,
.memoir-cover-card,
.memoir-journal-card,
.copy-card,
.portrait-card,
.bio-copy,
.auth-card,
.auth-sidecard,
.announcement-banner,
.status-card,
.feed-card,
.preview-card,
.comment-card,
.story-card,
.rewards-visual-card {
    padding: 1.5rem;
}

.hero-card,
.page-hero-card,
.promo-panel,
.announcement-banner {
    position: relative;
    overflow: hidden;
    overflow-x: clip;
}

.hero-badges span,
.product-tag,
.feed-meta,
.status-pill,
.preview-chip,
.comment-handle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.48rem 0.78rem;
    border-radius: 999px;
    background: rgba(255, 93, 162, 0.11);
    color: var(--pink-deep);
    font-size: 0.82rem;
    font-weight: 700;
}

.status-pill {
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(239, 63, 146, 0.1);
}

.status-dot {
    width: 0.72rem;
    height: 0.72rem;
    border-radius: 50%;
    background: #59d48c;
    box-shadow: 0 0 0 0 rgba(89, 212, 140, 0.48);
    animation: pulseDot 1.8s infinite;
}

.section {
    padding: 1.4rem 0 4rem;
    position: relative;
}

.section-cream {
    background: linear-gradient(180deg, rgba(255, 250, 243, 0.76), rgba(255, 247, 251, 0.7));
}

.section-heading {
    max-width: 44rem;
    margin-bottom: 1.55rem;
}

.section-heading h2 {
    margin: 0.1rem 0 0.7rem;
    font-size: clamp(2.5rem, 6vw, 4.2rem);
    line-height: 0.95;
}

.section-tag {
    display: inline-block;
    margin-bottom: 0.65rem;
}

.quote {
    color: var(--text-strong);
    font-size: 1.12rem;
    font-weight: 800;
}

.rewards-preview {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.3rem;
}

.tier-card,
.product-card,
.feature-card,
.comment-card,
.story-card,
.rewards-visual-card {
    padding: 1.4rem;
}

.tier-card h3,
.tier-card h2,
.product-card h3,
.feature-card h3,
.bio-copy h2,
.auth-sidecard h2,
.feed-card h3,
.preview-overlay h3,
.story-card h3,
.rewards-visual-card h3,
.comment-card h3 {
    margin: 0.35rem 0 0.7rem;
    color: var(--text-strong);
}

.tier-accent {
    background: linear-gradient(180deg, rgba(255, 249, 239, 0.96), rgba(255, 245, 250, 0.98));
    border-color: rgba(216, 174, 95, 0.3);
}

.announcement-banner {
    background:
        linear-gradient(135deg, rgba(255,255,255,0.82), rgba(255,246,251,0.86)),
        radial-gradient(circle at top right, rgba(255, 220, 237, 0.85), transparent 38%);
}

.announcement-pill {
    display: inline-block;
    margin-bottom: 0.7rem;
}

.announcement-banner h2 {
    margin: 0 0 0.6rem;
    font-size: clamp(2.15rem, 6vw, 3.2rem);
    line-height: 0.96;
}

.status-card {
    display: grid;
    gap: 1rem;
}

.status-details {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.feed-card {
    display: grid;
    gap: 1rem;
}

.feed-card-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.feed-visual {
    min-height: 15rem;
    border-radius: 1.35rem;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.9), rgba(255, 203, 227, 0.62)),
        linear-gradient(180deg, rgba(247, 184, 208, 0.24), rgba(255, 250, 243, 0.92));
    border: 1px solid rgba(239, 63, 146, 0.08);
    position: relative;
    overflow: hidden;
}

.feed-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.12) 100%);
}

.feed-caption {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    color: var(--text-soft);
    font-size: 0.94rem;
}

.preview-card {
    position: relative;
    overflow: hidden;
    min-height: 17rem;
}

.preview-visual {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(160deg, rgba(255, 225, 238, 0.82), rgba(255,255,255,0.3)),
        radial-gradient(circle at top right, rgba(255,255,255,0.86), transparent 28%),
        linear-gradient(180deg, rgba(255, 182, 213, 0.34), rgba(255, 245, 250, 0.8));
    filter: blur(18px) saturate(1.2);
    transform: scale(1.15);
}

.preview-overlay {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.85rem;
    min-height: 100%;
    align-content: end;
}

.preview-lock {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.product-visual,
.portrait-placeholder,
.bio-story-visual,
.rewards-visual-shape {
    display: grid;
    place-items: center;
    min-height: 12rem;
    border-radius: 1.3rem;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 201, 225, 0.55)),
        linear-gradient(180deg, rgba(247, 184, 208, 0.3), rgba(255, 250, 243, 0.92));
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    padding: 1rem;
}

.bio-story-grid {
    align-items: stretch;
}

.bio-story-visual {
    min-height: 20rem;
    position: relative;
    overflow: hidden;
}

.bio-story-visual::after {
    content: "♡ soft muse archive ♡";
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    right: 1rem;
    padding: 0.85rem 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    font-family: 'Manrope', sans-serif;
    font-size: 0.82rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.bio-story-copy {
    display: grid;
    gap: 1rem;
}

.story-card {
    background: linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,242,248,0.86));
}

.comment-card {
    display: grid;
    gap: 0.85rem;
}

.comment-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
}

.comment-name {
    color: var(--text-strong);
    font-weight: 800;
}

.comment-handle {
    width: fit-content;
}

.comment-stars {
    color: var(--gold);
    letter-spacing: 0.15em;
}

.rewards-visual-card {
    text-align: center;
}

.rewards-tier-badge {
    display: inline-grid;
    place-items: center;
    width: 4.6rem;
    height: 4.6rem;
    border-radius: 50%;
    margin: 0 auto 1rem;
    background: linear-gradient(135deg, rgba(255, 106, 170, 0.95), rgba(255, 211, 229, 0.95));
    color: white;
    box-shadow: 0 16px 32px rgba(239, 63, 146, 0.2);
    font-weight: 800;
}

.rewards-tier-badge.gold {
    background: linear-gradient(135deg, #e1bb71, #ffe6af);
    color: #6c4a11;
}

.product-meta,
.tier-list {
    display: grid;
    gap: 0.55rem;
}

.product-meta {
    margin-bottom: 0.4rem;
}

.product-price {
    margin: 0;
    color: var(--pink-deep);
    font-weight: 800;
    font-size: 1.15rem;
}

.centered-action {
    margin-top: 1.5rem;
}

.mini-links {
    display: grid;
    gap: 0.8rem;
    padding: 1.4rem;
}

.mini-links a {
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.66);
    border: 1px solid rgba(239, 63, 146, 0.11);
    font-weight: 700;
    overflow-wrap: anywhere;
}

.mini-links a:hover,
.mini-links a:focus-visible,
.footer-links a:hover,
.footer-links a:focus-visible,
.inline-link:hover,
.inline-link:focus-visible {
    color: var(--pink-deep);
}

.section,
.site-footer {
    content-visibility: auto;
    contain-intrinsic-size: 1px 760px;
}

.page-hero.compact-hero {
    padding-bottom: 0.25rem;
}

.links-hero-card {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.links-hero-lockup {
    display: grid;
    justify-items: start;
    gap: 0.9rem;
}

.links-grid {
    display: grid;
    gap: 1.1rem;
}

.links-bubble-card {
    display: grid;
    gap: 1.1rem;
}

.links-card-topline {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.links-card-topline h2 {
    margin: 0.15rem 0 0;
    color: var(--text-strong);
    font-size: clamp(2rem, 4vw, 2.9rem);
    line-height: 0.96;
}

.links-card-topline p,
.links-bubble-card p,
.links-next-copy p {
    margin: 0;
}

.links-platform-badge {
    display: inline-grid;
    place-items: center;
    width: 3.35rem;
    height: 3.35rem;
    border-radius: 1.1rem;
    font-size: 0.96rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.links-platform-mark {
    width: 1.7rem;
    height: 1.7rem;
    object-fit: contain;
    display: block;
    opacity: 0.8;
    filter: drop-shadow(0 6px 12px rgba(17, 10, 8, 0.12));
}

.links-platform-mark[src$="pornhub.svg"] {
    width: 2.2rem;
}

.onlyfans-badge {
    background: linear-gradient(135deg, rgba(63, 178, 255, 0.2), rgba(212, 243, 255, 0.88));
    border: 1px solid rgba(63, 178, 255, 0.24);
    color: #0d77b7;
}

.pornhub-badge {
    background: linear-gradient(135deg, rgba(255, 164, 61, 0.2), rgba(255, 235, 205, 0.88));
    border: 1px solid rgba(255, 164, 61, 0.24);
    color: #b96b00;
}

.x-badge {
    background: linear-gradient(135deg, rgba(48, 48, 58, 0.18), rgba(244, 241, 238, 0.9));
    border: 1px solid rgba(70, 70, 82, 0.18);
    color: #2c2c34;
}

.reddit-badge {
    background: linear-gradient(135deg, rgba(255, 113, 47, 0.2), rgba(255, 236, 226, 0.9));
    border: 1px solid rgba(255, 113, 47, 0.22);
    color: #c84f10;
}

.creator-badge {
    background: linear-gradient(135deg, rgba(233, 133, 184, 0.18), rgba(255, 244, 248, 0.92));
    border: 1px solid rgba(226, 121, 170, 0.2);
    color: #b13f77;
}

.cashapp-badge {
    background: linear-gradient(135deg, rgba(57, 206, 115, 0.18), rgba(236, 255, 244, 0.92));
    border: 1px solid rgba(57, 206, 115, 0.22);
    color: #158443;
}

.links-card-bubble {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-radius: 1.35rem;
    background:
        radial-gradient(circle at top left, rgba(255, 225, 238, 0.62), transparent 34%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(255, 243, 248, 0.92));
    border: 1px solid rgba(239, 63, 146, 0.12);
}

.links-card-logo {
    width: 4.15rem;
    height: auto;
    display: block;
    opacity: 0.52;
    filter: drop-shadow(0 0 16px rgba(255, 196, 112, 0.18));
}

.links-card-logo[src$="pornhub.svg"] {
    width: 5rem;
}

.links-next-grid {
    align-items: stretch;
}

.links-referral-head {
    display: grid;
    gap: 1rem;
    align-items: stretch;
}

.links-referral-brand {
    display: grid;
    align-content: start;
    justify-items: start;
    gap: 0.85rem;
    padding: 1.25rem;
    background:
        radial-gradient(circle at top left, rgba(255, 224, 188, 0.5), transparent 38%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 243, 248, 0.94));
}

.links-referral-brand-sun {
    width: 4.5rem;
    height: auto;
    display: block;
    filter: drop-shadow(0 0 18px rgba(255, 196, 112, 0.22));
}

.links-referral-brand-script {
    width: min(15rem, 100%);
    height: auto;
    display: block;
}

.links-referral-brand p {
    margin: 0;
    color: var(--pink-deep);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.links-section-heading {
    display: grid;
    gap: 0.7rem;
    margin-bottom: 1.25rem;
}

.links-section-heading h2,
.links-referral-card h2 {
    margin: 0.15rem 0 0;
    color: var(--text-strong);
}

.links-section-heading h2 {
    font-size: clamp(2.1rem, 5vw, 3.2rem);
    line-height: 0.96;
}

.links-referral-grid {
    margin-bottom: 1.35rem;
}

.links-referral-card {
    align-content: start;
}

.links-referral-note {
    display: grid;
    gap: 0.35rem;
    padding: 1rem 1.05rem;
    border-radius: 1.15rem;
    background: rgba(255, 255, 255, 0.68);
    border: 1px solid rgba(239, 63, 146, 0.08);
}

.links-referral-note strong,
.links-referral-note span {
    margin: 0;
}

.links-next-copy {
    display: grid;
    gap: 1rem;
}

.links-legal-note,
.legal-meta-note {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.92rem;
    line-height: 1.6;
}

.links-legal-note {
    max-width: 42rem;
}

.links-next-copy h2,
.links-next-grid .mini-links h3 {
    margin: 0.15rem 0 0;
    color: var(--text-strong);
}

.links-next-copy h2 {
    font-size: clamp(2.15rem, 5vw, 3.3rem);
    line-height: 0.96;
}

.links-next-grid .mini-links h3 {
    font-size: clamp(1.45rem, 3vw, 1.95rem);
    line-height: 1.02;
}

.catalog-hero-card {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.catalog-hero-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.catalog-hero-chip,
.catalog-count-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.7rem 0.95rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(239, 63, 146, 0.11);
    color: var(--text-soft);
    font-size: 0.83rem;
    font-weight: 700;
}

.catalog-hero-chip strong,
.catalog-count-pill strong {
    color: var(--pink-deep);
}

.catalog-spotlight {
    display: grid;
    gap: 0.95rem;
}

.catalog-spotlight-teaser {
    display: grid;
    gap: 0.7rem;
    padding: 1.25rem;
    background:
        radial-gradient(circle at top right, rgba(255, 234, 191, 0.38), transparent 30%),
        linear-gradient(145deg, rgba(255, 251, 246, 0.96), rgba(255, 240, 245, 0.92));
}

.catalog-spotlight-teaser h3,
.catalog-spotlight-teaser p {
    margin: 0;
}

.catalog-spotlight-card {
    position: relative;
    min-height: 18rem;
    overflow: hidden;
    border-radius: 1.45rem;
    border: 1px solid rgba(239, 63, 146, 0.12);
    box-shadow: 0 18px 40px rgba(44, 14, 28, 0.14);
}

.catalog-spotlight-card img,
.catalog-card img,
.catalog-modal-visual img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.catalog-spotlight-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(27, 10, 18, 0.04), rgba(27, 10, 18, 0.68));
}

.catalog-spotlight-copy {
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 1;
    display: grid;
    gap: 0.28rem;
}

.catalog-spotlight-copy h3 {
    margin: 0;
    color: #fffaf7;
    font-size: clamp(1.45rem, 3vw, 2.15rem);
    line-height: 0.96;
}

.catalog-value-grid {
    display: grid;
    gap: 1.1rem;
}

.catalog-value-card {
    display: grid;
    gap: 0.7rem;
}

.catalog-value-card h2 {
    margin: 0;
    color: var(--text-strong);
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    line-height: 0.95;
}

.catalog-value-card p {
    margin: 0;
}

.catalog-section-heading {
    display: grid;
    gap: 1rem;
    align-items: end;
}

.catalog-section-heading p {
    margin: 0;
}

.catalog-toolbar {
    display: grid;
    gap: 0.9rem;
    margin: 1.35rem 0 1.15rem;
}

.catalog-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.catalog-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.8rem 1rem;
    border: 1px solid rgba(239, 63, 146, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
    color: var(--text-strong);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(221, 133, 178, 0.1);
}

.catalog-filter-chip strong {
    display: inline-grid;
    place-items: center;
    min-width: 1.9rem;
    min-height: 1.9rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: rgba(255, 230, 241, 0.95);
    color: var(--pink-deep);
    font-size: 0.82rem;
}

.catalog-filter-chip.is-active,
.catalog-filter-chip:hover,
.catalog-filter-chip:focus-visible {
    border-color: rgba(239, 63, 146, 0.22);
    background: linear-gradient(135deg, rgba(255, 236, 245, 0.96), rgba(255, 255, 255, 0.98));
    box-shadow: 0 16px 32px rgba(221, 133, 178, 0.16);
}

.catalog-results-note {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.94rem;
}

.catalog-gallery {
    column-count: 1;
    column-gap: 1rem;
}

.catalog-card {
    width: 100%;
    padding: 0;
    margin: 0 0 1rem;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    break-inside: avoid;
}

.catalog-card-frame {
    display: block;
    padding: 0.55rem;
    overflow: hidden;
    border-radius: 1.7rem;
}

.catalog-card-media {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 1.3rem;
    aspect-ratio: 4 / 5.1;
    background: linear-gradient(145deg, rgba(18, 12, 12, 0.96), rgba(42, 27, 21, 0.92));
}

.catalog-card--lead .catalog-card-media {
    aspect-ratio: 4 / 5.7;
}

.catalog-card--tall .catalog-card-media {
    aspect-ratio: 4 / 5.9;
}

.catalog-card--soft .catalog-card-media {
    aspect-ratio: 4 / 4.85;
}

.catalog-card img {
    transition: transform 0.45s ease;
}

.catalog-card:hover img,
.catalog-card:focus-visible img {
    transform: scale(1.03);
}

.catalog-card:focus-visible {
    outline: none;
}

.catalog-card:focus-visible .catalog-card-frame {
    box-shadow: 0 0 0 3px rgba(255, 204, 221, 0.92), 0 18px 44px rgba(221, 133, 178, 0.3);
}

.catalog-card-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(26, 11, 18, 0.04) 18%, rgba(26, 11, 18, 0.62) 82%),
        radial-gradient(circle at top right, rgba(255, 223, 170, 0.18), transparent 32%);
}

.catalog-card-copy {
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 1;
    display: grid;
    gap: 0.35rem;
    color: #fff9f6;
}

.catalog-card-copy--teaser {
    top: 1rem;
    bottom: 1rem;
    justify-content: end;
}

.catalog-card-chip {
    display: inline-flex;
    width: fit-content;
    padding: 0.42rem 0.72rem;
    border-radius: 999px;
    background: rgba(255, 250, 247, 0.18);
    border: 1px solid rgba(255, 250, 247, 0.22);
    backdrop-filter: blur(10px);
    color: #fff7f1;
    font-size: 0.71rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.catalog-card-copy strong {
    font-size: clamp(1.35rem, 2.8vw, 2.15rem);
    line-height: 0.95;
}

.catalog-card-copy span:last-child {
    font-size: 0.9rem;
    line-height: 1.45;
    color: rgba(255, 244, 238, 0.9);
}

.catalog-card-meta {
    font-style: normal;
    color: rgba(255, 244, 238, 0.78);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.catalog-card--teaser {
    cursor: default;
}

.catalog-card-media--teaser {
    background:
        radial-gradient(circle at top left, rgba(255, 236, 191, 0.34), transparent 28%),
        radial-gradient(circle at 80% 20%, rgba(255, 207, 228, 0.26), transparent 30%),
        linear-gradient(145deg, rgba(35, 24, 22, 0.98), rgba(78, 50, 44, 0.94));
}

.catalog-card-placeholder-mark {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 1;
    display: inline-grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: rgba(255, 250, 247, 0.14);
    border: 1px solid rgba(255, 250, 247, 0.18);
    color: rgba(255, 247, 241, 0.92);
    font-size: 1.6rem;
    font-weight: 600;
    backdrop-filter: blur(12px);
}

.catalog-modal {
    position: fixed;
    inset: 0;
    z-index: 40;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(18, 10, 10, 0.84);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.24s ease;
}

.catalog-modal.is-open {
    opacity: 1;
    pointer-events: auto;
}

.catalog-modal-shell {
    width: min(1100px, 100%);
    display: grid;
    gap: 1rem;
    padding: 0.9rem;
    border-radius: 1.8rem;
    background:
        radial-gradient(circle at top right, rgba(255, 246, 214, 0.24), transparent 28%),
        linear-gradient(145deg, rgba(30, 17, 16, 0.98), rgba(13, 8, 8, 0.96));
    border: 1px solid rgba(215, 172, 105, 0.16);
    box-shadow: 0 30px 72px rgba(17, 9, 8, 0.4);
}

.catalog-modal-visual {
    position: relative;
    overflow: hidden;
    border-radius: 1.4rem;
    background: linear-gradient(145deg, rgba(20, 12, 11, 1), rgba(35, 21, 20, 0.98));
}

.catalog-modal-visual img {
    height: min(76vh, 58rem);
    object-fit: contain;
}

.catalog-modal-close,
.catalog-modal-nav {
    position: absolute;
    z-index: 1;
    display: inline-grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 252, 250, 0.16);
    color: #fff7f4;
    font-size: 1.5rem;
    backdrop-filter: blur(12px);
    cursor: pointer;
}

.catalog-modal-close:hover,
.catalog-modal-close:focus-visible,
.catalog-modal-nav:hover,
.catalog-modal-nav:focus-visible {
    background: rgba(255, 252, 250, 0.26);
}

.catalog-modal-close {
    top: 1rem;
    right: 1rem;
}

.catalog-modal-prev,
.catalog-modal-next {
    top: 50%;
    transform: translateY(-50%);
}

.catalog-modal-prev {
    left: 1rem;
}

.catalog-modal-next {
    right: 1rem;
}

.catalog-modal-copy {
    display: grid;
    gap: 0.85rem;
    align-content: start;
    padding: 1.3rem 1.25rem;
    background: linear-gradient(145deg, rgba(255, 248, 245, 0.96), rgba(255, 237, 243, 0.92));
}

.catalog-modal-copy h2,
.catalog-modal-copy p {
    margin: 0;
}

.catalog-modal-copy h2 {
    color: var(--text-strong);
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 0.95;
}

.catalog-modal-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-top: 0.35rem;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-soft);
}

.catalog-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
    padding-top: 0.4rem;
}

body.catalog-modal-open {
    overflow: hidden;
}

.single-column {
    max-width: 42rem;
}

.bio-copy,
.auth-card {
    display: grid;
    gap: 0.4rem;
}

.tier-list {
    margin: 0;
    padding-left: 1.1rem;
}

.auth-card {
    gap: 1rem;
}

.auth-captcha-block {
    display: grid;
    gap: 0.45rem;
}

.auth-captcha-slot {
    min-height: 4.25rem;
}

.auth-captcha-slot iframe {
    max-width: 100%;
}

.auth-captcha-note {
    color: var(--pink-deep);
}

.auth-card label {
    display: grid;
    gap: 0.45rem;
    font-weight: 700;
    color: var(--text-strong);
}

.auth-card input[type="text"],
.auth-card input[type="email"],
.auth-card input[type="password"] {
    width: 100%;
    min-height: 3.3rem;
    border: 1px solid rgba(239, 63, 146, 0.16);
    border-radius: 1rem;
    padding: 0.95rem 1rem;
    background: rgba(255, 255, 255, 0.9);
    color: var(--text-strong);
}

.checkbox-row {
    display: flex !important;
    align-items: center;
    gap: 0.75rem;
}

.checkbox-row input {
    width: 1rem;
    height: 1rem;
}

.inline-link {
    color: var(--pink-deep);
    font-weight: 700;
}

.form-note {
    margin: 0;
    font-size: 0.92rem;
}

.site-footer {
    padding: 1rem 0 1rem;
}

.footer-shell {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.footer-shell::before {
    content: "";
    position: absolute;
    inset: auto 0 0 auto;
    width: clamp(15rem, 31vw, 24rem);
    height: clamp(10rem, 22vw, 16rem);
    background: radial-gradient(circle at center, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.06) 42%, transparent 76%);
    pointer-events: none;
    z-index: 0;
}

.footer-shell::after {
    content: "";
    position: absolute;
    right: clamp(0.2rem, 1vw, 0.9rem);
    bottom: 0;
    width: clamp(16rem, 28vw, 22rem);
    height: clamp(9rem, 16vw, 12rem);
    background:
        linear-gradient(90deg, rgba(8, 6, 6, 0) 0%, rgba(8, 6, 6, 0.14) 14%, rgba(8, 6, 6, 0) 100%),
        url("assets/brand/footer-lead-dev-tonkah.png") 52% 50% / 170% auto no-repeat;
    opacity: 0.94;
    filter: saturate(0.92) brightness(1.18) contrast(1.16);
    pointer-events: none;
    z-index: 0;
}

.footer-shell > * {
    position: relative;
    z-index: 1;
}

.footer-top {
    padding: 1.5rem;
    margin-bottom: 0.9rem;
}

.footer-brand h3 {
    margin: 0 0 0.45rem;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
}

.footer-brand p {
    margin: 0;
}

.footer-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    align-content: start;
}

.footer-links a {
    min-height: 2.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0.7rem 0.85rem;
    border-radius: 0.95rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(215, 172, 105, 0.08);
    transition: color 200ms ease, border-color 200ms ease, background 200ms ease;
}

.footer-bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    padding: 0.8rem 0 0.3rem;
    color: var(--text-soft);
    font-size: 0.9rem;
}

.footer-bottom,
.footer-note,
.footer-closing {
    max-width: min(100%, 42rem);
}

.mobile-bottom-nav {
    position: fixed;
    left: 0.7rem;
    right: 0.7rem;
    bottom: 0.75rem;
    z-index: 18;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.45rem;
    padding: 0.55rem;
    border-radius: 1.55rem;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(18px);
    box-shadow: 0 22px 44px rgba(209, 123, 168, 0.22);
    border: 1px solid rgba(239, 63, 146, 0.12);
}

.mobile-bottom-nav a {
    display: grid;
    place-items: center;
    gap: 0.18rem;
    min-height: 3.35rem;
    padding: 0.5rem 0.25rem;
    border-radius: 1.1rem;
    font-size: 0.57rem;
    font-weight: 800;
    color: var(--text-soft);
    transition: background 200ms ease, color 200ms ease, transform 200ms ease;
}

.mobile-bottom-nav a:hover,
.mobile-bottom-nav a:focus-visible {
    transform: translateY(-1px);
}

.mobile-bottom-nav span {
    font-size: 1rem;
}

.merch-hero-card,
.merch-summary-card,
.merch-catalog-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 245, 249, 0.92));
}

.merch-hero-stat-list {
    display: grid;
    gap: 0.55rem;
    margin-bottom: 1rem;
}

.merch-hero-stat-list p,
.merch-live-note {
    margin: 0;
}

.merch-live-note {
    color: var(--text-soft);
    font-size: 0.94rem;
}

.merch-summary-card {
    gap: 0.5rem;
}

.merch-summary-count {
    margin: 0;
    color: var(--pink-deep);
    font-size: 1.15rem;
    font-weight: 800;
}

.merch-checkout-section {
    padding-top: 0;
}

.merch-checkout-grid {
    display: grid;
    gap: 1rem;
    align-items: start;
}

.merch-checkout-shell {
    display: grid;
    gap: 1.15rem;
}

.merch-checkout-heading {
    max-width: 48rem;
}

.merch-checkout-intro,
.merch-cart-panel {
    background:
        radial-gradient(circle at top right, rgba(255, 228, 239, 0.62), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 244, 249, 0.94));
}

.merch-checkout-intro {
    display: grid;
    gap: 1rem;
}

.merch-checkout-points {
    display: grid;
    gap: 0.9rem;
}

.merch-checkout-points div {
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(239, 63, 146, 0.08);
}

.merch-checkout-points strong,
.merch-checkout-points p {
    display: block;
    margin: 0;
}

.merch-checkout-points strong {
    margin-bottom: 0.3rem;
    color: var(--text-strong);
}

.merch-cart-panel {
    display: grid;
    gap: 1rem;
}

.merch-cart-header {
    display: flex;
    justify-content: space-between;
    gap: 0.9rem;
    align-items: start;
}

.merch-cart-header h2,
.merch-cart-copy,
.merch-cart-empty p {
    margin: 0;
}

.merch-cart-count {
    display: inline-grid;
    place-items: center;
    min-width: 2.5rem;
    min-height: 2.5rem;
    padding: 0 0.6rem;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(255, 231, 242, 0.96), rgba(255, 247, 251, 1));
    color: var(--pink-deep);
    font-size: 1rem;
    font-weight: 800;
    box-shadow: 0 16px 32px rgba(221, 133, 178, 0.18);
}

body.has-merch-cart-drawer-open {
    overflow: hidden;
}

.merch-bag-button {
    position: fixed;
    top: 6.6rem;
    right: max(0.9rem, calc((100vw - var(--max-width)) / 2 + 0.9rem));
    z-index: 32;
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    min-width: 13.5rem;
    padding: 0.9rem 1rem;
    border-radius: 1.25rem;
    border: 1px solid rgba(239, 63, 146, 0.14);
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.98), rgba(255, 244, 249, 0.96));
    color: var(--text-strong);
    box-shadow: 0 20px 40px rgba(214, 121, 165, 0.2);
    cursor: pointer;
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
    max-width: calc(100vw - 1.8rem);
}

.merch-bag-button:hover,
.merch-bag-button:focus-visible,
.merch-bag-button.is-open {
    transform: translateY(-2px);
    box-shadow: 0 24px 44px rgba(214, 121, 165, 0.28);
    border-color: rgba(239, 63, 146, 0.22);
}

.merch-bag-button.has-items {
    background: linear-gradient(145deg, rgba(255, 245, 250, 0.98), rgba(255, 236, 245, 0.98));
}

.merch-bag-button.just-added {
    animation: merchBagPulse 0.72s ease;
}

.merch-bag-button-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(239, 63, 146, 0.14), rgba(255, 233, 242, 0.96));
    color: var(--pink-deep);
    font-size: 0.86rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.merch-bag-button-copy {
    display: grid;
    gap: 0.1rem;
    text-align: left;
    flex: 1 1 auto;
    min-width: 0;
}

.merch-bag-button-copy strong,
.merch-bag-button-copy span {
    display: block;
    margin: 0;
}

.merch-bag-button-copy strong {
    color: var(--text-strong);
    font-size: 0.96rem;
    overflow-wrap: anywhere;
}

.merch-bag-button-copy span {
    color: var(--text-soft);
    font-size: 0.8rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.merch-bag-button-count {
    display: inline-grid;
    place-items: center;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--pink-deep), #ff8fbe);
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(239, 63, 146, 0.24);
}

.merch-bag-button-count[hidden] {
    display: none;
}

.merch-cart-drawer-shell {
    position: fixed;
    inset: 0;
    z-index: 38;
}

@keyframes merchBagPulse {
    0% {
        transform: translateY(0) scale(1);
        box-shadow: 0 20px 40px rgba(214, 121, 165, 0.2);
    }
    38% {
        transform: translateY(-4px) scale(1.03);
        box-shadow: 0 28px 52px rgba(239, 63, 146, 0.32);
    }
    100% {
        transform: translateY(0) scale(1);
        box-shadow: 0 20px 40px rgba(214, 121, 165, 0.2);
    }
}

.merch-cart-drawer-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background: rgba(69, 31, 53, 0.34);
    backdrop-filter: blur(10px);
    cursor: pointer;
}

.merch-cart-drawer {
    position: absolute;
    top: 0;
    right: 0;
    width: min(100%, 33rem);
    height: 100%;
    padding: 0.85rem;
    transform: translateX(100%);
    transition: transform 0.34s ease;
}

.merch-cart-drawer-shell.is-open .merch-cart-drawer {
    transform: translateX(0);
}

.merch-cart-drawer-body {
    height: 100%;
    overflow-y: auto;
    display: grid;
    gap: 1rem;
    padding: 1.15rem;
    border-radius: 1.5rem;
    background:
        radial-gradient(circle at top right, rgba(255, 228, 239, 0.72), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 244, 249, 0.96));
    border: 1px solid rgba(239, 63, 146, 0.14);
    box-shadow: 0 28px 68px rgba(141, 70, 105, 0.26);
}

.merch-cart-drawer-header {
    display: flex;
    justify-content: space-between;
    gap: 0.9rem;
    align-items: start;
}

.merch-cart-drawer-header h2,
.merch-cart-drawer-copy,
.merch-tax-note {
    margin: 0;
}

.merch-cart-drawer-copy {
    color: var(--text-soft);
    font-size: 0.92rem;
}

.merch-cart-drawer-close {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.96);
    color: var(--text-strong);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 14px 26px rgba(214, 121, 165, 0.18);
}

.merch-tax-note {
    color: var(--text-soft);
    font-size: 0.85rem;
    font-weight: 700;
}

.merch-clear-cart-link {
    justify-self: start;
}

.merch-status-banner {
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    font-size: 0.94rem;
    font-weight: 700;
    line-height: 1.55;
}

.merch-status-banner.is-success {
    background: rgba(231, 255, 243, 0.92);
    color: #216547;
    border: 1px solid rgba(33, 101, 71, 0.12);
}

.merch-status-banner.is-error {
    background: rgba(255, 236, 241, 0.94);
    color: #9b305a;
    border: 1px solid rgba(155, 48, 90, 0.12);
}

.merch-status-banner.is-info {
    background: rgba(255, 247, 250, 0.94);
    color: #8f5c72;
    border: 1px solid rgba(175, 129, 151, 0.12);
}

.merch-cart-empty {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.68);
    border: 1px dashed rgba(239, 63, 146, 0.18);
}

.merch-cart-items {
    display: grid;
    gap: 0.9rem;
}

.merch-checkout-form {
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(239, 63, 146, 0.08);
}

.merch-checkout-form-topline {
    display: flex;
    justify-content: space-between;
    gap: 0.8rem;
    align-items: start;
}

.merch-checkout-form-topline h3,
.merch-checkout-form-copy {
    margin: 0;
}

.merch-country-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 243, 248, 0.96);
    color: var(--pink-deep);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.merch-checkout-form-copy {
    color: var(--text-soft);
    font-size: 0.92rem;
}

.merch-checkout-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.merch-checkout-field {
    display: grid;
    gap: 0.42rem;
    font-weight: 700;
    color: var(--text-strong);
}

.merch-checkout-field span {
    font-size: 0.82rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.merch-checkout-field input {
    width: 100%;
    min-height: 3.1rem;
    border: 1px solid rgba(239, 63, 146, 0.14);
    border-radius: 1rem;
    padding: 0.85rem 1rem;
    background: rgba(255, 255, 255, 0.96);
    color: var(--text-strong);
}

.merch-checkout-field input::placeholder {
    color: rgba(82, 69, 74, 0.48);
}

.merch-checkout-field-span {
    grid-column: 1 / -1;
}

.merch-cart-item {
    display: grid;
    grid-template-columns: 4.7rem minmax(0, 1fr);
    gap: 0.8rem;
    align-items: start;
    padding: 0.75rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(239, 63, 146, 0.08);
}

.merch-cart-item img {
    width: 100%;
    aspect-ratio: 1 / 1;
    display: block;
    object-fit: cover;
    border-radius: 0.9rem;
}

.merch-cart-item-copy {
    display: grid;
    gap: 0.45rem;
}

.merch-cart-item-copy p,
.merch-cart-item-copy strong,
.merch-cart-item-topline {
    margin: 0;
}

.merch-cart-item-topline,
.merch-cart-item-bottom,
.merch-cart-summary {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: center;
}

.merch-cart-item-bottom {
    flex-wrap: wrap;
}

.merch-inline-button {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--pink-deep);
    font: inherit;
    font-size: 0.86rem;
    font-weight: 700;
    cursor: pointer;
}

.merch-qty-stepper {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.28rem;
    border-radius: 999px;
    background: rgba(255, 245, 249, 0.96);
    border: 1px solid rgba(239, 63, 146, 0.08);
}

.merch-qty-stepper button {
    width: 1.95rem;
    height: 1.95rem;
    border: 0;
    border-radius: 999px;
    background: #ffffff;
    color: var(--text-strong);
    font-size: 1rem;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(221, 133, 178, 0.1);
}

.merch-cart-line-price {
    color: var(--pink-deep);
    font-weight: 800;
}

.merch-cart-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(239, 63, 146, 0.08);
}

.merch-cart-summary span,
.merch-cart-summary strong,
.merch-cart-note {
    margin: 0;
}

.merch-cart-summary > div {
    display: grid;
    gap: 0.2rem;
}

.merch-cart-summary span {
    display: block;
    color: var(--text-soft);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.merch-cart-summary strong {
    display: block;
    color: var(--text-strong);
    font-size: 1.1rem;
}

.merch-cart-note {
    color: var(--text-soft);
    font-size: 0.9rem;
}

.merch-checkout-actions {
    align-items: stretch;
}

.merch-checkout-actions.is-drawer {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.merch-checkout-actions.is-drawer .btn {
    width: 100%;
}

.merch-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.merch-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.8rem 1rem;
    border: 1px solid rgba(239, 63, 146, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
    color: var(--text-strong);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(221, 133, 178, 0.1);
}

.merch-filter-chip strong {
    display: inline-grid;
    place-items: center;
    min-width: 1.9rem;
    min-height: 1.9rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: rgba(255, 230, 241, 0.95);
    color: var(--pink-deep);
    font-size: 0.82rem;
}

.merch-filter-chip.is-active,
.merch-filter-chip:hover,
.merch-filter-chip:focus-visible {
    border-color: rgba(239, 63, 146, 0.22);
    background: linear-gradient(135deg, rgba(255, 236, 245, 0.96), rgba(255, 255, 255, 0.98));
    box-shadow: 0 16px 32px rgba(221, 133, 178, 0.16);
}

.merch-catalog-grid {
    align-items: stretch;
    grid-template-columns: minmax(0, 1fr);
}

.merch-catalog-card {
    overflow: hidden;
    padding: 0;
    min-width: 0;
}

.merch-card-media-stack {
    display: grid;
    gap: 0.75rem;
    padding: 0.85rem 0.85rem 0;
}

.merch-card-media {
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 1.4rem;
    background: linear-gradient(180deg, rgba(255, 248, 252, 0.96), rgba(255, 236, 244, 0.92));
}

.merch-card-media img {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0.4rem;
    object-fit: contain;
    transition: transform 240ms ease;
}

.merch-catalog-card:hover .merch-card-media img,
.merch-catalog-card:focus-within .merch-card-media img {
    transform: scale(1.03);
}

.merch-media-thumb-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(3.45rem, 1fr));
    gap: 0.55rem;
}

.merch-media-thumb {
    padding: 0;
    border: 1px solid rgba(239, 63, 146, 0.12);
    border-radius: 1rem;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.84);
    min-height: 3.7rem;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.merch-media-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.merch-media-thumb.is-active,
.merch-media-thumb:hover,
.merch-media-thumb:focus-visible {
    border-color: rgba(239, 63, 146, 0.34);
    box-shadow: 0 12px 24px rgba(239, 63, 146, 0.12);
    transform: translateY(-1px);
}

.merch-media-meta {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: center;
    color: var(--text-soft);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.merch-media-meta strong {
    color: var(--pink-deep);
    font-size: 0.74rem;
}

.merch-card-copy {
    display: grid;
    gap: 0.9rem;
    padding: 1.35rem;
    min-width: 0;
}

.merch-card-copy h3 {
    margin: 0;
}

.merch-card-copy p {
    margin: 0;
}

.merch-card-topline,
.merch-card-price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.merch-card-category {
    color: var(--text-soft);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.merch-card-status {
    color: var(--pink-deep);
    font-size: 0.84rem;
    font-weight: 700;
}

.merch-card-price-note,
.merch-card-option-note {
    color: var(--text-soft);
    font-size: 0.9rem;
}

.merch-card-variants {
    display: grid;
    gap: 0.9rem;
}

.merch-option-group {
    display: grid;
    gap: 0.45rem;
}

.merch-option-label {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.merch-swatch-list,
.merch-option-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.merch-swatch-item,
.merch-option-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2rem;
    padding: 0.45rem 0.72rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(239, 63, 146, 0.08);
    color: var(--text-strong);
    font-size: 0.86rem;
    font-weight: 600;
}

.merch-option-chip {
    padding-inline: 0.8rem;
}

.merch-swatch-item {
    padding: 0;
    background: transparent;
    border: 0;
}

.merch-swatch-button {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2rem;
    padding: 0.45rem 0.72rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(239, 63, 146, 0.08);
    color: var(--text-strong);
    font-size: 0.86rem;
    font-weight: 600;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.merch-swatch-button.is-selected,
.merch-swatch-button:hover,
.merch-swatch-button:focus-visible {
    background: rgba(255, 247, 251, 0.98);
    border-color: rgba(239, 63, 146, 0.28);
    box-shadow: 0 12px 24px rgba(239, 63, 146, 0.1);
    transform: translateY(-1px);
}

.merch-card-selection-grid {
    display: grid;
    gap: 0.75rem;
}

.merch-picker-field {
    display: grid;
    gap: 0.4rem;
}

.merch-picker-field span {
    color: var(--text-soft);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.merch-picker-field select {
    width: 100%;
    padding: 0.85rem 1rem;
    border-radius: 1rem;
    border: 1px solid rgba(239, 63, 146, 0.14);
    background: rgba(255, 255, 255, 0.92);
    color: var(--text-strong);
    font: inherit;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.merch-swatch {
    width: 0.95rem;
    height: 0.95rem;
    border-radius: 999px;
    background: var(--swatch);
    box-shadow: inset 0 0 0 1px rgba(17, 10, 8, 0.08);
}

.merch-swatch.needs-border {
    border: 1px solid rgba(17, 10, 8, 0.12);
}

.merch-card-actions {
    margin-top: 0.15rem;
}

.merch-flow-grid {
    align-items: stretch;
}

.merch-drop-grid {
    align-items: stretch;
    grid-template-columns: minmax(0, 1fr);
}

.merch-drop-card {
    display: grid;
    gap: 1rem;
    min-width: 0;
    padding: 1.5rem;
    background:
        radial-gradient(circle at top right, rgba(255, 230, 239, 0.55), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 243, 248, 0.92));
}

.merch-drop-topline {
    display: flex;
    justify-content: space-between;
    gap: 0.8rem;
    align-items: center;
    flex-wrap: wrap;
}

.merch-drop-status {
    color: var(--pink-deep);
    font-size: 0.84rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.merch-drop-date {
    margin: 0;
    color: var(--text-strong);
    font-weight: 800;
}

.merch-drop-teasers {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: minmax(0, 1fr);
}

.merch-drop-teaser-coming-soon {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
}

.merch-drop-teaser {
    display: grid;
    grid-template-columns: 4.6rem minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
    min-width: 0;
    padding: 0.7rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(239, 63, 146, 0.08);
}

.merch-drop-teaser > div {
    min-width: 0;
}

.merch-drop-teaser img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 0.9rem;
    display: block;
}

.merch-drop-teaser strong,
.merch-drop-teaser span {
    display: block;
}

.merch-drop-teaser strong {
    color: var(--text-strong);
    margin-bottom: 0.2rem;
    overflow-wrap: anywhere;
}

.merch-drop-teaser span {
    color: var(--pink-deep);
    font-weight: 700;
}

.coming-soon-illustration {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    min-width: 0;
    min-height: 9.75rem;
    padding: 1.45rem 1.25rem 1.15rem;
    overflow: hidden;
    overflow: clip;
    contain: paint;
    border-radius: 1.2rem;
    background:
        radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.95), transparent 32%),
        linear-gradient(160deg, rgba(255, 249, 252, 0.96), rgba(255, 236, 244, 0.9));
    border: 1px solid rgba(239, 63, 146, 0.1);
}

.coming-soon-illustration::after {
    content: "";
    position: absolute;
    inset: auto -10% -18% auto;
    width: 58%;
    height: 58%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 190, 214, 0.34), transparent 68%);
}

.coming-soon-silhouette {
    position: relative;
    z-index: 1;
    width: min(8.25rem, 70%);
    height: auto;
}

.coming-soon-silhouette path,
.coming-soon-silhouette rect {
    fill: none;
    stroke: rgba(118, 74, 96, 0.7);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.coming-soon-teaser-label {
    margin-top: 0.18rem;
    font-size: 0.8rem;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.coming-soon-teaser-note {
    margin: 0.38rem 0 0;
    color: var(--text-soft);
    font-size: 0.93rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.brand-updates-card {
    align-content: start;
}

.brand-updates-rotator {
    position: relative;
    min-height: 8.8rem;
}

.brand-update {
    position: absolute;
    inset: 0;
    display: grid;
    align-content: start;
    gap: 0.7rem;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 260ms ease, transform 260ms ease;
    pointer-events: none;
}

.brand-update.is-active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.brand-update-label {
    margin: 0;
    color: var(--pink-deep);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.brand-update p:last-child {
    margin: 0;
}

@media (min-width: 760px) {
    .merch-drop-teasers {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    }
}

[data-reveal] {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.75s ease, transform 0.75s ease;
    transition-delay: var(--reveal-delay, 0ms);
    will-change: opacity, transform;
}

[data-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

@keyframes floaty {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

@keyframes drift {
    0%, 100% { transform: translateY(0) scale(1); opacity: 0.45; }
    50% { transform: translateY(-14px) scale(1.08); opacity: 0.95; }
}

@keyframes orbFloat {
    0% { transform: translateY(0) translateX(0); }
    50% { transform: translateY(-20px) translateX(12px); }
    100% { transform: translateY(0) translateX(0); }
}

@keyframes pulseDot {
    0% { box-shadow: 0 0 0 0 rgba(89, 212, 140, 0.48); }
    70% { box-shadow: 0 0 0 12px rgba(89, 212, 140, 0); }
    100% { box-shadow: 0 0 0 0 rgba(89, 212, 140, 0); }
}

@media (min-width: 720px) {
    .site-utility-dock {
        right: 1.1rem;
        bottom: 1.1rem;
    }

    .site-utility-button {
        min-height: 3.2rem;
        padding-inline: 1rem;
    }

    .container {
        width: min(calc(100% - 2rem), var(--max-width));
    }

    .site-shell {
        padding-bottom: 0;
    }

    .site-nav {
        position: static;
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 0;
        gap: 0.3rem;
        background: transparent;
        border: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
    }

    .nav-toggle,
    .mobile-bottom-nav {
        display: none;
    }

    .announcement-inner {
        font-size: 0.94rem;
        flex-wrap: nowrap;
    }

    .footer-links {
        display: flex;
        flex-wrap: wrap;
        gap: 0.8rem 1rem;
    }

    .footer-links a {
        min-height: auto;
        display: inline-flex;
        justify-content: flex-start;
        padding: 0;
        border: 0;
        background: transparent;
    }

    .hero-grid,
    .page-hero-inner,
    .split-panel,
    .auth-layout,
    .bio-layout,
    .bio-story-grid,
    .status-section,
    .footer-top {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    .rewards-preview {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .catalog-spotlight {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .catalog-value-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .catalog-gallery {
        column-count: 2;
    }

    .tier-grid,
    .product-grid,
    .feature-grid,
    .feed-grid,
    .preview-grid,
    .testimonial-grid,
    .rewards-visual-grid,
    .merch-checkout-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .merch-cart-panel {
        position: sticky;
        top: 6.3rem;
    }

    .feature-grid.merch-drop-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .product-grid.merch-catalog-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (min-width: 720px) and (max-width: 860px) {
    .hero-grid,
    .page-hero-inner,
    .split-panel,
    .auth-layout,
    .bio-layout,
    .bio-story-grid,
    .status-section,
    .footer-top,
    .catalog-spotlight,
    .tier-grid,
    .product-grid,
    .feature-grid,
    .feed-grid,
    .preview-grid,
    .testimonial-grid,
    .rewards-visual-grid,
    .merch-checkout-grid,
    .merch-checkout-shell,
    .book-library-hero-grid {
        grid-template-columns: 1fr;
    }

    .catalog-value-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .catalog-gallery {
        column-count: 1;
    }

    .rewards-preview,
    .library-account-panel {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (min-width: 720px) and (max-width: 1120px) {
    .nav-wrap {
        align-items: flex-start;
    }

    .site-nav {
        flex: 1 1 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .site-nav a,
    .announcement-link {
        white-space: normal;
    }

    .announcement-inner {
        flex-wrap: wrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    [data-reveal],
    [data-reveal].is-visible {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .site-progress,
    .site-utility-dock {
        display: none;
    }
}

@media (min-width: 980px) {
    .hero-grid {
        grid-template-columns: 1.05fr 0.95fr;
        align-items: center;
    }

    .feed-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .preview-grid,
    .testimonial-grid,
    .rewards-visual-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .tier-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .product-grid.merch-grid-full {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .feature-grid.merch-drop-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-section-heading {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .catalog-gallery {
        column-count: 3;
        column-gap: 1.15rem;
    }

    .catalog-modal-shell {
        grid-template-columns: minmax(0, 1fr) minmax(18rem, 20rem);
        align-items: start;
    }

    .merch-checkout-grid {
        grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.95fr);
    }

    .product-grid.merch-catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1480px) {
    .product-grid.merch-catalog-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 720px) and (max-width: 1280px) {
    .merch-bag-button {
        top: auto;
        right: 1rem;
        bottom: 1rem;
        min-width: min(13.5rem, calc(100vw - 2rem));
    }
}

@media (max-width: 719px) {
    .site-utility-dock {
        right: 0.72rem;
        bottom: 6rem;
    }

    .site-utility-button {
        width: 3rem;
        min-width: 3rem;
        min-height: 3rem;
        justify-content: center;
        padding: 0;
    }

    .site-utility-label {
        display: none;
    }

    .catalog-modal-shell {
        padding: 0.75rem;
    }

    .catalog-modal-visual img {
        height: min(62vh, 32rem);
    }

    .merch-bag-button {
        top: 6rem;
        right: 0.75rem;
        left: auto;
        min-width: min(15rem, calc(100vw - 1.5rem));
        padding: 0.8rem 0.9rem;
    }

    .merch-bag-button-icon {
        width: 2.7rem;
        height: 2.7rem;
        border-radius: 0.9rem;
    }

    .merch-cart-drawer {
        width: 100%;
        padding: 0.6rem;
    }

    .merch-cart-drawer-body {
        padding: 1rem;
        border-radius: 1.25rem;
    }

    .merch-checkout-intro,
    .merch-cart-panel {
        padding: 1.2rem;
    }

    .merch-filter-row {
        gap: 0.6rem;
    }

    .merch-filter-chip {
        width: 100%;
        justify-content: space-between;
    }

    .merch-card-copy {
        padding: 1.1rem;
    }

    .merch-card-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .merch-card-actions .btn {
        width: 100%;
    }

    .merch-cart-item {
        grid-template-columns: 4rem minmax(0, 1fr);
    }

    .merch-cart-item-topline,
    .merch-cart-item-bottom,
    .merch-cart-summary {
        align-items: start;
    }

    .merch-checkout-form-topline,
    .merch-cart-summary {
        grid-template-columns: 1fr;
    }

    .merch-checkout-form-topline {
        display: grid;
    }

    .merch-checkout-form-grid {
        grid-template-columns: 1fr;
    }

    .merch-checkout-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .merch-checkout-actions .btn {
        width: 100%;
    }

    .merch-checkout-actions.is-drawer {
        grid-template-columns: 1fr;
    }

    .merch-drop-teaser {
        grid-template-columns: 4rem minmax(0, 1fr);
    }
}

@media (min-width: 1360px) {
    .feature-grid.merch-drop-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


.cinematic-hero {
    padding-top: 5.2rem;
    overflow: clip;
}

.cinematic-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 25%, rgba(255, 214, 233, 0.82), transparent 22%),
        radial-gradient(circle at 80% 18%, rgba(255, 255, 255, 0.82), transparent 18%),
        linear-gradient(180deg, rgba(255, 244, 249, 0.34), rgba(255, 247, 251, 0));
    pointer-events: none;
}

.hero-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(24px);
    pointer-events: none;
    opacity: 0.65;
}

.hero-glow-one {
    width: 14rem;
    height: 14rem;
    top: 2rem;
    left: 0;
    transform: translateX(-28%);
    background: radial-gradient(circle, rgba(255, 184, 216, 0.85), rgba(255, 184, 216, 0));
}

.hero-glow-two {
    width: 12rem;
    height: 12rem;
    right: 0;
    bottom: 1rem;
    transform: translateX(22%);
    background: radial-gradient(circle, rgba(255, 232, 194, 0.82), rgba(255, 232, 194, 0));
}

.hero-stack {
    display: grid;
    gap: 0.9rem;
    align-content: start;
}

.hero-card-main {
    position: relative;
}

.hero-mantra {
    margin: 0;
    color: var(--text-strong);
}

.hero-mantra {
    margin-top: 1rem;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-style: italic;
}

.quote-card-row {
    display: grid;
    gap: 0.9rem;
}

.creator-quote-card {
    padding: 1.25rem 1rem;
    text-align: center;
    background: linear-gradient(180deg, rgba(255,255,255,0.88), rgba(255,244,249,0.92));
}

.creator-quote-card p {
    margin: 0;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.55rem;
    line-height: 1.05;
}

.about-sunshinexo-section .bio-story-visual {
    min-height: 28rem;
}

.journal-stack {
    gap: 1.2rem;
}

.story-card-intro {
    background: linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,242,248,0.92));
}

.story-separator {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(234, 61, 143, 0.28), transparent);
}

.about-quote-callout {
    padding: 1.4rem;
    text-align: center;
    background: linear-gradient(180deg, rgba(255,247,251,0.94), rgba(255,239,246,0.92));
}

.about-quote-callout p {
    margin: 0;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    line-height: 1.06;
}

.highlight-line {
    margin-top: 1rem;
    padding-left: 1rem;
    border-left: 2px solid rgba(234, 61, 143, 0.35);
    color: var(--text-strong);
    font-weight: 700;
}

.story-card h3,
.story-card p,
.story-card li {
    max-width: 34rem;
}

.story-card .highlight-line {
    max-width: 30rem;
}

.about-story-grid {
    gap: 1.4rem;
}

.about-signature-points,
.about-focus-list {
    display: grid;
    gap: 0.85rem;
}

.about-signature-points {
    margin-top: 1.1rem;
}

.about-signature-points span {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    width: fit-content;
    max-width: 100%;
    padding: 0.75rem 1rem;
    border-radius: 999px;
    background: rgba(255, 249, 252, 0.92);
    border: 1px solid rgba(239, 63, 146, 0.12);
    color: var(--text-strong);
    font-size: 0.9rem;
    font-weight: 700;
}

.about-signature-points span::before {
    content: "✦";
    color: var(--pink-deep);
    font-size: 0.78rem;
}

.about-focus-grid {
    display: grid;
    gap: 1.2rem;
}

.about-focus-card,
.about-memoir-card,
.about-next-step-copy,
.contact-email-card,
.legal-card,
.legal-hero-card {
    display: grid;
    gap: 1rem;
}

.about-focus-card h2,
.about-memoir-card h2,
.about-next-step-copy h2,
.legal-card h2,
.legal-hero-card h2,
.contact-email-card h3 {
    margin: 0.15rem 0 0;
    color: var(--text-strong);
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    line-height: 0.96;
}

.about-focus-list > div {
    padding: 1rem 1.05rem;
    border-radius: 1.2rem;
    background: rgba(255, 252, 250, 0.9);
    border: 1px solid rgba(198, 152, 90, 0.12);
}

.about-focus-list strong {
    display: block;
    margin: 0 0 0.35rem;
    color: var(--text-strong);
    font-size: 1rem;
}

.about-focus-list p,
.about-memoir-card p,
.about-next-step-copy p,
.contact-email-card p,
.legal-card p {
    margin: 0;
}

.about-memoir-card {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,240,247,0.94)),
        radial-gradient(circle at top right, rgba(255, 226, 238, 0.72), transparent 34%);
}

.about-next-step-grid {
    align-items: stretch;
}

.contact-email-card {
    justify-items: start;
    align-content: start;
    text-align: left;
    background:
        radial-gradient(circle at top right, rgba(255, 230, 184, 0.28), transparent 34%),
        linear-gradient(145deg, rgba(255, 250, 247, 0.97), rgba(255, 236, 244, 0.93));
}

.contact-direct-link {
    display: inline-flex;
    width: fit-content;
    justify-self: start;
    align-items: center;
    gap: 0.5rem;
    padding: 0.85rem 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(239, 63, 146, 0.14);
    color: var(--pink-deep);
    font-weight: 800;
    letter-spacing: 0.01em;
    box-shadow: 0 14px 28px rgba(221, 133, 178, 0.14);
    overflow-wrap: anywhere;
}

.contact-direct-link:hover,
.contact-direct-link:focus-visible {
    color: var(--pink-deep);
    border-color: rgba(239, 63, 146, 0.24);
    box-shadow: 0 18px 34px rgba(221, 133, 178, 0.2);
}

.contact-link-grid {
    display: grid;
    gap: 0.7rem;
    width: 100%;
}

.contact-link-grid a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3rem;
    padding: 0.85rem 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(239, 63, 146, 0.12);
    color: var(--text-strong);
    font-weight: 700;
    text-align: center;
    overflow-wrap: anywhere;
}

.contact-link-grid a:hover,
.contact-link-grid a:focus-visible {
    color: var(--pink-deep);
    border-color: rgba(239, 63, 146, 0.22);
}

.legal-stack {
    display: grid;
    gap: 1.1rem;
}

.legal-card {
    align-content: start;
}

.legal-card h2,
.legal-hero-card h2,
.contact-email-card h3 {
    font-size: clamp(1.85rem, 4vw, 3rem);
}

.contact-email-card h3 {
    line-height: 1.04;
    overflow-wrap: anywhere;
    text-wrap: balance;
}

.legal-list {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 0.55rem;
    color: var(--text);
}

.legal-list li {
    line-height: 1.6;
}

.legal-meta-note {
    font-weight: 700;
    letter-spacing: 0.01em;
}

.legal-jump-links {
    padding: 0;
}

.legal-jump-links a {
    text-align: center;
}

.home-focus-grid {
    align-items: stretch;
}

.home-focus-copy,
.home-focus-card {
    display: grid;
    gap: 1rem;
}

.home-focus-copy h2 {
    margin: 0.15rem 0 0;
    color: var(--text-strong);
    font-size: clamp(2.2rem, 5vw, 3.4rem);
    line-height: 0.96;
}

.home-focus-card h3 {
    margin: 0.05rem 0 0;
    color: var(--text-strong);
    font-size: clamp(1.5rem, 3vw, 2rem);
    line-height: 1.02;
}

.home-focus-copy p,
.home-focus-card p {
    margin: 0;
}

.home-focus-card {
    align-content: start;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,240,247,0.94)),
        radial-gradient(circle at top right, rgba(255, 228, 239, 0.72), transparent 34%);
}

.home-signature-points {
    margin-top: 0.2rem;
}

.memoir-grid {
    align-items: stretch;
}

.memoir-copy-card,
.memoir-cover-card,
.memoir-journal-card {
    position: relative;
    overflow: hidden;
}

.memoir-copy-card {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.88), rgba(255,242,248,0.92)),
        radial-gradient(circle at top right, rgba(255, 223, 237, 0.58), transparent 34%);
}

.memoir-copy-card h2 {
    margin: 0.15rem 0 0.7rem;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.3rem, 5vw, 3.8rem);
    line-height: 0.95;
}

.memoir-subtitle,
.memoir-cover-kicker {
    margin: 0 0 0.9rem;
    color: var(--pink-deep);
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.memoir-cover-card {
    display: grid;
    gap: 1rem;
    align-content: start;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,240,247,0.96)),
        radial-gradient(circle at top left, rgba(255, 229, 241, 0.72), transparent 34%);
}

.memoir-cover-visual {
    min-height: 26rem;
    display: grid;
    align-content: end;
    gap: 0.85rem;
    padding: 1.6rem;
    border-radius: 1.6rem;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0.1)),
        radial-gradient(circle at top center, rgba(255,255,255,0.8), transparent 28%),
        linear-gradient(160deg, rgba(255, 205, 227, 0.78), rgba(255, 247, 251, 0.96) 56%, rgba(255, 237, 196, 0.52));
    border: 1px solid rgba(239, 63, 146, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.memoir-cover-visual h2 {
    margin: 0;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.6rem, 6vw, 4.8rem);
    line-height: 0.92;
    max-width: 12rem;
}

.memoir-cover-visual p:last-child {
    margin: 0;
    max-width: 18rem;
    color: var(--text-soft);
}

.memoir-inline-quote {
    margin: 0;
    padding: 1rem 0 0 1rem;
    border-left: 2px solid rgba(234, 61, 143, 0.28);
}

.memoir-inline-quote p {
    margin: 0;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.5rem, 3vw, 2.1rem);
    line-height: 1.02;
}

.memoir-journal-card {
    display: grid;
    gap: 1rem;
    background: linear-gradient(180deg, rgba(255,247,251,0.94), rgba(255,239,246,0.92));
}

.footer-closing {
    margin: 1rem 0 0;
    text-align: center;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
}

.mobile-vip-float {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 6.25rem;
    display: inline-flex;
    justify-content: center;
    max-width: calc(100vw - 2rem);
    z-index: 19;
    box-shadow: var(--shadow-strong);
}

@media (min-width: 720px) {
    .links-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .links-referral-head {
        grid-template-columns: 0.46fr 1fr;
    }

    .quote-card-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .about-focus-grid {
        grid-template-columns: 1.1fr 0.9fr;
    }

    .home-focus-grid {
        grid-template-columns: 1.08fr 0.92fr;
    }

    .links-next-grid {
        grid-template-columns: 1.05fr 0.95fr;
    }

    .memoir-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mobile-vip-float {
        display: none;
    }
}

@media (min-width: 980px) {
    .quote-card-row {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .hero-grid {
        grid-template-columns: 1fr 0.95fr;
    }

    .about-sunshinexo-section .bio-story-grid {
        align-items: stretch;
    }
}

.rewards-system-grid,
.category-grid {
    display: grid;
    gap: 1.1rem;
}

.progress-card,
.unlock-card,
.shop-category-card {
    padding: 1.5rem;
    position: relative;
    overflow: hidden;
}

.progress-card,
.unlock-card {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,241,248,0.94)),
        radial-gradient(circle at top right, rgba(255, 223, 237, 0.6), transparent 32%);
}

.progress-card h2,
.unlock-card h2,
.shop-category-card h2,
.shop-category-card h3 {
    margin: 0.2rem 0 0.75rem;
    color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
}

.progress-meta-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.65rem 1rem;
    margin-bottom: 0.8rem;
    color: var(--text-soft);
    font-size: 0.95rem;
}

.progress-goal-row {
    margin-bottom: 0.65rem;
}

.progress-shell {
    width: 100%;
    height: 0.95rem;
    border-radius: 999px;
    background: rgba(255, 210, 229, 0.55);
    border: 1px solid rgba(234, 61, 143, 0.12);
    overflow: hidden;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.6);
}

.progress-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--pink-deep), var(--pink-strong), #ffc8e0);
    box-shadow: 0 8px 18px rgba(239, 63, 146, 0.22);
}

.progress-fill-zero {
    width: 8%;
    opacity: 0.34;
}

.preview-note,
.preview-disclaimer {
    margin: 0.95rem 0 0;
    color: var(--text-soft);
    font-size: 0.92rem;
    line-height: 1.65;
}

.unlock-steps {
    margin: 0;
    padding-left: 1.2rem;
    display: grid;
    gap: 0.6rem;
    color: var(--text-strong);
}

.product-meta-stacked {
    align-content: start;
}

.unlock-badge {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 0.4rem;
    padding: 0.48rem 0.78rem;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(255, 237, 245, 0.96), rgba(255, 248, 226, 0.96));
    border: 1px solid rgba(216, 172, 103, 0.26);
    color: var(--text-strong);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.shop-category-card {
    background:
        linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,244,249,0.94)),
        radial-gradient(circle at top left, rgba(255, 225, 238, 0.65), transparent 34%);
}

.shop-category-card p:last-child {
    margin-bottom: 0;
}

@media (min-width: 720px) {
    .rewards-system-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 980px) {
    .category-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Coming Soon Cards & Drop Section */
.coming-soon-grid {
    display: grid;
    gap: 1.1rem;
}

@media (min-width: 768px) {
    .coming-soon-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .coming-soon-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.coming-soon-card {
    position: relative;
    overflow: clip;
    transition: all var(--transition);
}

.coming-soon-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 28px 80px rgba(233, 91, 163, 0.22);
}

.coming-soon-ribbon {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0.9rem;
    right: 0.75rem;
    left: 0.75rem;
    background: linear-gradient(135deg, var(--pink-strong), var(--pink-deep));
    color: white;
    padding: 0.4rem 1rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 999px;
    box-shadow: 0 8px 16px rgba(255, 99, 169, 0.3);
    z-index: 2;
    transform: none;
    line-height: 1.2;
    text-align: center;
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 479px) {
    .coming-soon-ribbon {
        top: 0.75rem;
        right: 0.75rem;
        left: 0.75rem;
        padding: 0.33rem 0.82rem;
        font-size: 0.68rem;
        letter-spacing: 0.08em;
        transform: none;
    }
}

/* Selectable Book Cards for Golden XO */
.book-selector-grid {
    display: grid;
    gap: 1.1rem;
}

@media (min-width: 768px) {
    .book-selector-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.selectable-book-card {
    position: relative;
    cursor: pointer;
    transition: all var(--transition);
    border: 2px solid transparent;
}

.selectable-book-card:hover {
    border-color: var(--pink);
    box-shadow: 0 24px 60px rgba(216, 138, 178, 0.22);
    transform: translateY(-4px);
}

.selectable-book-card.selected {
    background: linear-gradient(135deg, rgba(255, 185, 212, 0.15), rgba(255, 245, 252, 0.4));
    border-color: var(--pink-strong);
    box-shadow: 0 28px 80px rgba(233, 91, 163, 0.28);
}

.selectable-book-card .btn-selectable {
    position: relative;
}

.selectable-book-card.selected .btn-selectable {
    background: var(--pink-strong);
    color: white;
}

.book-visual {
    min-height: 12rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(255, 185, 212, 0.2), rgba(255, 245, 252, 0.3));
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-soft);
    border-radius: var(--radius-md);
    margin-bottom: 1rem;
}

/* Rewards Benefits Grid (for signup page) */
.rewards-benefits {
    display: grid;
    gap: 1rem;
    margin-top: 1.2rem;
}

.benefit-item {
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
}

.benefit-icon {
    flex-shrink: 0;
    font-size: 1.2rem;
    color: var(--pink-strong);
    margin-top: 0.2rem;
}

.benefit-item strong {
    color: var(--text-strong);
}

.benefit-item p {
    margin: 0.3rem 0 0;
    font-size: 0.9rem;
    color: var(--text-soft);
}

/* Form improvements for signup */
.form-section-divider {
    height: 1px;
    background: var(--border);
    margin: 1.2rem 0;
}

.form-section-label {
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text-soft);
    margin: 0 0 0.8rem;
    display: block;
}

/* Footer note for preview disclaimer */
.footer-note {
    font-size: 0.85rem;
    color: var(--text-soft);
    padding: 0.8rem 0;
    border-top: 1px solid var(--border);
    margin: 0.8rem 0 0;
    line-height: 1.5;
}

/* Polished UI Enhancements for Rebrand */

/* Glossy Card Styling */
.soft-card {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.85), rgba(255, 245, 249, 0.82));
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 99, 169, 0.16);
    box-shadow: 0 8px 32px rgba(234, 61, 143, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.8);
    transition: all 0.32s ease;
}

.soft-card:hover {
    box-shadow: 0 12px 40px rgba(234, 61, 143, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(255, 250, 252, 0.88));
    transform: translateY(-2px);
}

/* Pill Badges */
.product-tag {
    display: inline-block;
    padding: 0.35rem 0.72rem;
    background: rgba(255, 99, 169, 0.12);
    color: var(--pink-deep);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    border-radius: 24px;
    border: 1px solid rgba(255, 99, 169, 0.24);
    text-transform: uppercase;
    transition: all 0.24s ease;
}

.product-tag:hover {
    background: rgba(255, 99, 169, 0.18);
    border-color: rgba(255, 99, 169, 0.36);
}

/* Unlock Badges */
.unlock-badge {
    display: inline-block;
    padding: 0.4rem 0.68rem;
    background: linear-gradient(135deg, rgba(214, 172, 103, 0.14), rgba(247, 227, 183, 0.12));
    color: var(--gold);
    font-size: 0.73rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-radius: 6px;
    border: 1px solid rgba(214, 172, 103, 0.22);
    text-transform: uppercase;
}

.product-meta-stacked {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin: 0.8rem 0;
}

/* Reward Tier Cards with Enhanced Styling */
.rewards-tier-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin: 0 0 0.8rem;
    background: linear-gradient(135deg, rgba(255, 99, 169, 0.2), rgba(234, 61, 143, 0.16));
    color: var(--pink-deep);
    font-weight: 700;
    font-size: 0.9rem;
    border-radius: 12px;
    border: 2px solid rgba(255, 99, 169, 0.24);
    letter-spacing: 0.05em;
}

.rewards-tier-badge.gold {
    background: linear-gradient(135deg, rgba(214, 172, 103, 0.2), rgba(247, 227, 183, 0.16));
    color: var(--gold);
    border-color: rgba(214, 172, 103, 0.32);
}

/* Tier Cards */
.tier-card {
    transition: all 0.32s ease;
}

.tier-card.tier-accent {
    background: linear-gradient(135deg, rgba(214, 172, 103, 0.08), rgba(247, 227, 183, 0.06));
    border: 2px solid rgba(214, 172, 103, 0.22);
}

.tier-card.tier-accent:hover {
    box-shadow: 0 12px 40px rgba(214, 172, 103, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    background: linear-gradient(135deg, rgba(214, 172, 103, 0.12), rgba(247, 227, 183, 0.1));
}

.tier-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text-soft);
    margin: 0 0 0.5rem;
}

.tier-list {
    list-style: none;
    margin: 0.8rem 0 0;
    padding: 0;
    gap: 0.6rem;
    display: flex;
    flex-direction: column;
}

.tier-list li {
    font-size: 0.9rem;
    color: var(--text);
    padding: 0 0 0 1.4rem;
    position: relative;
}

.tier-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: var(--pink-strong);
    font-weight: 700;
}

.rewards-next-grid {
    align-items: stretch;
}

.rewards-next-copy,
.rewards-next-grid .mini-links {
    display: grid;
    gap: 1rem;
}

.rewards-next-copy h2,
.rewards-next-grid .mini-links h3 {
    margin: 0.15rem 0 0;
    color: var(--text-strong);
}

.rewards-next-copy h2 {
    font-size: clamp(2.2rem, 5vw, 3.4rem);
    line-height: 0.96;
}

.rewards-next-grid .mini-links h3 {
    font-size: clamp(1.45rem, 3vw, 1.95rem);
    line-height: 1.02;
}

.rewards-next-copy p,
.rewards-next-grid .mini-links p {
    margin: 0;
}

/* Button Hover Glow Effects */
.btn {
    transition: all 0.28s ease;
    position: relative;
    overflow: hidden;
}

.btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.3), transparent 60%);
    opacity: 0;
    transition: opacity 0.28s ease;
}

.btn:hover::before {
    opacity: 1;
}

.btn-primary {
    background: linear-gradient(135deg, rgba(255, 99, 169, 0.9), rgba(234, 61, 143, 0.9));
    box-shadow: 0 8px 24px rgba(234, 61, 143, 0.24);
}

.btn-primary:hover {
    box-shadow: 0 12px 36px rgba(234, 61, 143, 0.32);
    transform: translateY(-2px);
}

.btn-gold {
    background: linear-gradient(135deg, rgba(214, 172, 103, 0.9), rgba(247, 227, 183, 0.85));
    color: var(--text-strong);
    box-shadow: 0 8px 24px rgba(214, 172, 103, 0.2);
}

.btn-gold:hover {
    box-shadow: 0 12px 36px rgba(214, 172, 103, 0.28);
    transform: translateY(-2px);
}

/* Waitlist CTA Blocks */
.waitlist-banner {
    background: linear-gradient(135deg, rgba(255, 99, 169, 0.1), rgba(234, 61, 143, 0.08));
    border: 2px solid rgba(255, 99, 169, 0.2);
    border-radius: 20px;
    padding: 1.6rem 1.4rem;
    text-align: center;
    margin: 1.6rem 0;
}

.waitlist-banner h3 {
    color: var(--text-strong);
    font-size: 1.1rem;
    margin: 0 0 0.6rem;
}

.waitlist-banner p {
    color: var(--text-soft);
    font-size: 0.95rem;
    margin: 0 0 1rem;
}

/* Mobile Spacing Improvements */
@media (max-width: 768px) {
    .soft-card {
        padding: 1.4rem 1.2rem;
    }

    .product-grid {
        gap: 1.2rem;
    }

    .button-row {
        gap: 0.8rem;
        flex-direction: column;
    }

    .btn {
        padding: 0.9rem 1.4rem;
        font-size: 0.95rem;
    }

    .rewards-visual-grid {
        gap: 1.2rem;
    }

    .tier-grid {
        gap: 1.2rem;
    }
}

/* Feature Cards Enhancement */
.feature-card {
    border: 1px solid rgba(255, 99, 169, 0.12);
    transition: all 0.32s ease;
}

.feature-card:hover {
    border-color: rgba(255, 99, 169, 0.24);
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(234, 61, 143, 0.16);
}

.feature-card h3 {
    color: var(--text-strong);
    font-size: 1.05rem;
    margin: 0 0 0.6rem;
}

.feature-card p {
    color: var(--text-soft);
    font-size: 0.95rem;
    margin: 0;
    line-height: 1.5;
}

/* Preview Disclaimer */
.preview-disclaimer {
    font-size: 0.82rem;
    color: var(--text-soft);
    font-style: italic;
    margin-top: 1.2rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--border);
}

/* Smooth transitions for all interactive elements */
.announcement-link {
    transition: background 0.24s ease, border-color 0.24s ease, color 0.24s ease, box-shadow 0.24s ease;
}

.announcement-link:hover {
    background: rgba(255, 255, 255, 0.18);
    border-bottom-color: rgba(255, 255, 255, 1);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
}

/* Books Library */
.book-library-hero {
    overflow: hidden;
}

.book-library-hero-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.95fr;
    gap: 1.5rem;
    align-items: stretch;
}

.library-account-panel {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    min-height: 100%;
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.55), transparent 42%),
        linear-gradient(145deg, rgba(255, 244, 248, 0.96), rgba(255, 231, 239, 0.9));
    border: 1px solid rgba(216, 124, 164, 0.18);
}

.library-account-copy strong {
    display: block;
    margin-bottom: 0.45rem;
    font-size: 1.2rem;
    color: var(--ink, #1d1d21);
}

.library-account-copy p {
    margin: 0;
}

.library-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
    margin-bottom: 0.8rem;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #9b4f72;
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(214, 125, 163, 0.16);
}

.library-checkout-notice-shell {
    padding-top: 0;
}

.library-checkout-notice {
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.62), transparent 42%),
        linear-gradient(145deg, rgba(255, 252, 244, 0.97), rgba(255, 240, 246, 0.95));
    border: 1px solid rgba(216, 124, 164, 0.16);
}

.library-checkout-notice.is-success {
    box-shadow: 0 24px 54px -34px rgba(214, 172, 103, 0.42);
}

.library-checkout-notice.is-info {
    box-shadow: 0 24px 54px -34px rgba(234, 61, 143, 0.22);
}

.library-checkout-notice h2 {
    margin: 0 0 0.45rem;
    color: var(--ink, #1d1d21);
}

.library-checkout-notice p:last-child {
    margin-bottom: 0;
}

.books-library-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
    gap: 1.4rem;
}

.library-locked-card {
    grid-column: 1 / -1;
    padding: 1.3rem;
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.64), transparent 42%),
        linear-gradient(145deg, rgba(255, 248, 251, 0.98), rgba(255, 238, 244, 0.94));
    border: 1px solid rgba(223, 141, 175, 0.18);
}

.library-locked-card h3 {
    margin: 0 0 0.5rem;
    color: var(--ink, #1d1d21);
}

.library-locked-card p:last-of-type {
    margin-bottom: 1rem;
}

.book-card {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 1.05rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 240, 246, 0.92));
    border: 1px solid rgba(223, 141, 175, 0.16);
    box-shadow: 0 24px 60px -32px var(--book-glow, rgba(235, 152, 186, 0.32));
}

.book-cover-art {
    position: relative;
    min-height: 21rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 1.4rem 1.25rem;
    border-radius: 1.55rem;
    overflow: hidden;
    overflow: clip;
    background: var(--book-gradient);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.4),
        inset -16px 0 22px rgba(255, 255, 255, 0.18),
        0 22px 44px -24px var(--book-glow, rgba(235, 152, 186, 0.38));
}

.book-cover-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.book-cover-art::before {
    content: '';
    position: absolute;
    inset: 0.65rem;
    border-radius: 1.2rem;
    border: 1px solid rgba(255, 255, 255, 0.32);
    pointer-events: none;
}

.book-cover-art::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(20, 8, 13, 0.02), rgba(20, 8, 13, 0.22) 72%, rgba(20, 8, 13, 0.62)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.54), rgba(255,255,255,0.06) 2.2rem, transparent 3.2rem);
    box-shadow: 8px 0 16px rgba(82, 19, 45, 0.08);
}

.book-cover-sheen {
    position: absolute;
    inset: auto 4% 46% auto;
    width: 34%;
    height: 44%;
    background: linear-gradient(135deg, rgba(255,255,255,0.72), rgba(255,255,255,0.08));
    filter: blur(2px);
    transform: rotate(-8deg);
}

.book-cover-kicker {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-self: flex-start;
    margin-bottom: auto;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    color: rgba(88, 27, 55, 0.82);
    background: rgba(255, 255, 255, 0.58);
    font-size: 0.78rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.book-cover-copy {
    position: relative;
    z-index: 1;
    align-self: flex-start;
    display: grid;
    gap: 0.4rem;
    max-width: min(100%, 16rem);
    padding: 0.82rem 0.92rem;
    border-radius: 1rem;
    color: #fff7fb;
    background: rgba(25, 10, 18, 0.38);
    backdrop-filter: blur(12px);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
}

.book-cover-copy p {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.13em;
    font-size: 0.73rem;
    opacity: 0.92;
}

.book-cover-copy span {
    display: block;
    max-width: 100%;
    font-size: 0.86rem;
    line-height: 1.42;
    color: rgba(255, 250, 253, 0.9);
    overflow-wrap: anywhere;
}

.book-card-body {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.book-card-meta,
.book-action-grid {
    display: grid;
    gap: 0.75rem;
}

.book-card-meta {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
}

.book-price-tag,
.book-state-tag {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 2.55rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.book-price-tag {
    color: #8d345f;
    background: rgba(255, 233, 242, 0.9);
}

.book-state-tag {
    color: #6e5770;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(221, 166, 188, 0.25);
}

.book-card-description,
.book-progress-note {
    margin: 0;
}

.book-progress-note {
    color: #8e6b7c;
    font-size: 0.95rem;
}

.book-action-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
}

.book-action-grid .btn {
    min-height: 3rem;
    padding-inline: 0.95rem;
}

.library-rules-card {
    gap: 0.9rem;
    padding: 1.5rem;
}

.library-rules-card span {
    display: block;
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: rgba(255, 243, 248, 0.72);
    border: 1px solid rgba(222, 162, 186, 0.18);
    color: #834f69;
    font-weight: 600;
}

.library-contact-card {
    padding: 1.5rem;
}

.library-contact-card .button-row {
    width: 100%;
}

.flipbook-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: rgba(29, 12, 24, 0.74);
    backdrop-filter: blur(18px);
    z-index: 80;
}

.flipbook-modal.is-open {
    display: flex;
}

.flipbook-shell {
    width: min(1080px, 100%);
    max-height: calc(100vh - 3rem);
    overflow: auto;
    padding: 1.35rem;
    border-radius: 1.8rem;
    background:
        radial-gradient(circle at top right, rgba(255,255,255,0.72), transparent 28%),
        linear-gradient(145deg, rgba(255, 244, 248, 0.98), rgba(251, 229, 238, 0.95));
    border: 1px solid rgba(224, 152, 181, 0.16);
    box-shadow: 0 40px 120px -48px rgba(54, 15, 34, 0.55);
}

.flipbook-topbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.flipbook-topbar h2 {
    margin: 0.1rem 0 0.35rem;
}

.flipbook-subtitle {
    margin: 0;
    color: #85596e;
}

.flipbook-close {
    width: 2.8rem;
    height: 2.8rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.8);
    color: #904668;
    font-size: 1.75rem;
    cursor: pointer;
}

.flipbook-progress-track {
    position: relative;
    height: 0.7rem;
    margin: 1rem 0 1.3rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    overflow: hidden;
}

.flipbook-progress-fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    border-radius: 999px;
    background: var(--book-gradient, linear-gradient(90deg, #f8bfd5, #cf6e96));
    transition: width 240ms ease;
}

.flipbook-stage {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.flipbook-arrow {
    width: 3rem;
    height: 3rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,0.85);
    color: #96486c;
    font-size: 2rem;
    cursor: pointer;
    box-shadow: 0 10px 24px -20px rgba(70, 24, 44, 0.5);
}

.flipbook-arrow:disabled {
    opacity: 0.45;
    cursor: default;
}

.flipbook-page {
    position: relative;
    min-height: 32rem;
    padding: 2.2rem 2.1rem;
    border-radius: 1.6rem;
    background: var(--book-page-gradient, linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,243,247,0.95)));
    color: #46323c;
    border: 12px solid var(--book-edge, #fff1f6);
    box-shadow:
        inset 18px 0 28px rgba(182, 121, 146, 0.06),
        0 20px 50px -34px rgba(64, 20, 39, 0.42);
    transform-origin: left center;
    animation: flipbookFadeIn 280ms ease;
}

.flipbook-page::before {
    content: attr(data-page);
    position: absolute;
    top: 1.15rem;
    right: 1.2rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9c6980;
    background: rgba(255,255,255,0.82);
}

.flipbook-page p {
    margin: 0;
    font-size: 1.02rem;
    line-height: 1.8;
}

.flipbook-footer {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-top: 1.2rem;
}

.flipbook-page-meta {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
    color: #83576b;
}

.flipbook-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    align-items: center;
    row-gap: 0.8rem;
    min-width: 0;
}

.flipbook-controls .btn {
    min-height: 2.85rem;
}

.flipbook-speed-control {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.7rem 0.9rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.84);
    color: #84586c;
    font-size: 0.95rem;
}

.flipbook-speed-control select {
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
}

.real-auth-card .auth-status-line {
    min-height: 1.6rem;
    color: #8f5973;
}

@keyframes flipbookFadeIn {
    from {
        opacity: 0;
        transform: rotateY(-7deg) scale(0.985);
    }
    to {
        opacity: 1;
        transform: rotateY(0deg) scale(1);
    }
}

@media (max-width: 1080px) {
    .books-library-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .book-action-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .book-library-hero-grid,
    .flipbook-stage {
        grid-template-columns: 1fr;
    }

    .library-account-panel,
    .flipbook-page-meta {
        flex-direction: column;
        align-items: flex-start;
    }

    .flipbook-arrow {
        width: 100%;
        height: 3.25rem;
    }
}

@media (max-width: 720px) {
    .books-library-grid,
    .book-card-meta {
        grid-template-columns: 1fr;
    }

    .flipbook-shell {
        padding: 1rem;
    }

    .flipbook-page {
        min-height: 24rem;
        padding: 1.5rem 1.15rem;
    }

    .flipbook-controls {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .flipbook-speed-control {
        grid-column: 1 / -1;
        justify-content: space-between;
    }
}


.flipbook-shell {
    width: min(1180px, 100%);
    overscroll-behavior: contain;
}

.flipbook-topbar {
    align-items: center;
}

.flipbook-stage {
    gap: 1.15rem;
}

.flipbook-book {
    display: grid;
    grid-template-columns: minmax(240px, 0.42fr) minmax(0, 1fr);
    min-height: 38rem;
    border-radius: 1.9rem;
    perspective: 2200px;
    overflow: hidden;
    box-shadow: 0 36px 80px -44px rgba(64, 20, 39, 0.45);
    outline: none;
}

.flipbook-book:focus-visible {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.92), 0 0 0 6px var(--book-accent, #f5a5c7);
}

.flipbook-hardcover {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.2rem;
    padding: 1.4rem 1.3rem 1.3rem;
    background: var(--book-gradient, linear-gradient(155deg, #fde6ef 0%, #f6bfd0 40%, #dea1b7 100%));
    color: #fff7fb;
    box-shadow: inset -18px 0 28px rgba(255, 255, 255, 0.14);
}

.flipbook-hardcover::before {
    content: '';
    position: absolute;
    inset: 0.65rem;
    border-radius: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.28);
    pointer-events: none;
}

.flipbook-hardcover::after {
    content: '';
    position: absolute;
    top: 0;
    right: -1px;
    width: 18px;
    height: 100%;
    background: linear-gradient(180deg, rgba(255,255,255,0.68), rgba(255,255,255,0.14));
    box-shadow: 8px 0 20px rgba(70, 23, 45, 0.18);
}

.flipbook-cover-kicker {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-self: flex-start;
    padding: 0.42rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.6);
    color: rgba(98, 27, 57, 0.88);
    font-size: 0.76rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.flipbook-cover-sheen {
    position: absolute;
    top: 11%;
    right: -14%;
    width: 76%;
    height: 38%;
    background: linear-gradient(135deg, rgba(255,255,255,0.8), rgba(255,255,255,0.08));
    transform: rotate(-14deg);
    filter: blur(4px);
}

.flipbook-hardcover-copy {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    margin-top: auto;
}

.flipbook-hardcover-copy p {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 0.76rem;
    opacity: 0.86;
}

.flipbook-hardcover-copy h3 {
    margin: 0;
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.3rem, 4vw, 3.5rem);
    line-height: 0.92;
    color: #fffafd;
}

.flipbook-hardcover-copy span {
    color: rgba(255, 247, 251, 0.92);
    font-size: 0.98rem;
    line-height: 1.6;
}

.flipbook-hardcover-footer {
    position: relative;
    z-index: 1;
    margin-top: auto;
}

.flipbook-hardcover-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.65rem 0.88rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.16);
    color: #fff7fb;
    font-size: 0.86rem;
    line-height: 1.45;
}

.flipbook-sheet {
    position: relative;
    display: flex;
    padding: 1rem;
    background: linear-gradient(180deg, rgba(255, 248, 251, 0.96), rgba(247, 226, 235, 0.96));
    box-shadow: inset 20px 0 30px rgba(186, 130, 154, 0.12);
    transform-origin: left center;
    transform-style: preserve-3d;
}

.flipbook-sheet::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 24px;
    height: 100%;
    background: linear-gradient(90deg, rgba(180, 128, 151, 0.2), rgba(255,255,255,0));
    pointer-events: none;
}

.flipbook-sheet.is-turning-next {
    animation: flipbookSheetNext 420ms cubic-bezier(0.21, 0.88, 0.33, 1);
}

.flipbook-sheet.is-turning-prev {
    animation: flipbookSheetPrev 420ms cubic-bezier(0.21, 0.88, 0.33, 1);
}

.flipbook-page {
    min-height: 100%;
    flex: 1;
    border-radius: 1.45rem;
    border-width: 10px;
    padding: 2.35rem 2.15rem;
    box-shadow: inset 20px 0 32px rgba(182, 121, 146, 0.08), 0 22px 58px -38px rgba(64, 20, 39, 0.48);
}

.flipbook-page::before {
    top: 1rem;
    right: 1rem;
}

.flipbook-page::after {
    content: '';
    position: absolute;
    bottom: 1.1rem;
    left: 50%;
    transform: translateX(-50%);
    width: 34%;
    height: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(255,255,255,0), rgba(214, 168, 187, 0.68), rgba(255,255,255,0));
}

.flipbook-page p {
    font-size: 1.05rem;
}

.flipbook-page-meta {
    flex-wrap: wrap;
}

.flipbook-controls {
    row-gap: 0.8rem;
}

.flipbook-select-control {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
    min-width: 0;
    max-width: 100%;
    padding: 0.7rem 0.95rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.84);
    color: #84586c;
    font-size: 0.95rem;
}

.flipbook-select-control select {
    flex: 1 1 8.5rem;
    min-width: 0;
    max-width: 100%;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
}

#flipbookChapter {
    min-width: min(12rem, 100%);
}

@keyframes flipbookSheetNext {
    0% {
        transform: rotateY(0deg) scale(1);
    }
    46% {
        transform: rotateY(-12deg) scale(0.992);
    }
    100% {
        transform: rotateY(0deg) scale(1);
    }
}

@keyframes flipbookSheetPrev {
    0% {
        transform: rotateY(0deg) scale(1);
    }
    46% {
        transform: rotateY(12deg) scale(0.992);
    }
    100% {
        transform: rotateY(0deg) scale(1);
    }
}

@media (max-width: 1080px) {
    .flipbook-book {
        grid-template-columns: minmax(210px, 0.38fr) minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    .flipbook-book {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .flipbook-hardcover {
        min-height: 18rem;
    }

    .flipbook-sheet {
        min-height: 24rem;
    }
}

@media (max-width: 720px) {
    .flipbook-controls {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .flipbook-select-control {
        grid-column: 1 / -1;
        justify-content: space-between;
    }

    .flipbook-select-control select {
        min-width: 7rem;
    }

    .flipbook-hardcover {
        padding: 1.2rem 1rem 1rem;
    }

    .flipbook-page {
        padding: 1.55rem 1.15rem;
    }
}


/* literal-open-book */
.flipbook-keyline {
    margin: 0.45rem 0 0;
    color: #a36b84;
    font-size: 0.92rem;
}

.flipbook-stage {
    align-items: stretch;
}

.flipbook-book {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 40rem;
    padding: 1.35rem 1.5rem;
    border-radius: 2rem;
    background:
        radial-gradient(circle at center, rgba(255,255,255,0.45), transparent 36%),
        linear-gradient(180deg, rgba(255, 244, 248, 0.98), rgba(247, 224, 234, 0.96));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.75), 0 34px 80px -46px rgba(64, 20, 39, 0.5);
    outline: none;
}

.flipbook-book:focus-visible {
    box-shadow: 0 0 0 3px rgba(255,255,255,0.92), 0 0 0 6px var(--book-accent, #f4a8cb), 0 34px 80px -46px rgba(64, 20, 39, 0.5);
}

.flipbook-book-glow {
    position: absolute;
    inset: 8% 7%;
    border-radius: 1.8rem;
    background: radial-gradient(circle at center, rgba(255,255,255,0.35), transparent 68%);
    filter: blur(18px);
    opacity: 0.8;
    pointer-events: none;
}

.flipbook-page-stack {
    position: absolute;
    top: 10%;
    bottom: 10%;
    width: 18px;
    border-radius: 0.9rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.92), rgba(239, 220, 229, 0.96));
    box-shadow: inset 0 0 0 1px rgba(192, 136, 162, 0.15);
}

.flipbook-page-stack-left {
    left: 2.2rem;
}

.flipbook-page-stack-right {
    right: 2.2rem;
}

.flipbook-spread {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2rem minmax(0, 1fr);
    gap: 0;
    width: 100%;
    min-height: 35rem;
    align-items: stretch;
}

.flipbook-spine {
    position: relative;
    background:
        linear-gradient(180deg, rgba(146, 86, 113, 0.82), rgba(88, 48, 67, 0.88)),
        linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0));
    box-shadow:
        inset 1px 0 0 rgba(255,255,255,0.3),
        inset -1px 0 0 rgba(34, 12, 22, 0.24),
        0 0 24px rgba(72, 26, 45, 0.16);
}

.flipbook-spine::before {
    content: '';
    position: absolute;
    inset: 0.4rem 0.45rem;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0.04));
}

.flipbook-book .flipbook-page {
    position: relative;
    min-height: 35rem;
    padding: 1.6rem 1.45rem;
    border: 10px solid var(--book-edge, #fff2f7);
    background: var(--book-page-gradient, linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,243,247,0.95)));
    color: #45313a;
    box-shadow: 0 24px 62px -44px rgba(66, 25, 42, 0.48);
    overflow: hidden;
}

.flipbook-book .flipbook-page::before {
    content: attr(data-page);
    position: absolute;
    top: 0.95rem;
    right: 1rem;
    padding: 0.3rem 0.72rem;
    border-radius: 999px;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9e6981;
    background: rgba(255,255,255,0.82);
}

.flipbook-page-left {
    border-right-width: 5px;
    border-radius: 1.7rem 0.5rem 0.5rem 1.7rem;
    box-shadow: inset -18px 0 28px rgba(191, 143, 166, 0.1), 0 24px 62px -44px rgba(66, 25, 42, 0.48);
}

.flipbook-page-right {
    border-left-width: 5px;
    border-radius: 0.5rem 1.7rem 1.7rem 0.5rem;
    box-shadow: inset 18px 0 28px rgba(191, 143, 166, 0.1), 0 24px 62px -44px rgba(66, 25, 42, 0.48);
}

.flipbook-page.is-active {
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.8), 0 0 0 3px rgba(255,255,255,0.82), 0 24px 62px -44px rgba(66, 25, 42, 0.48);
}

.flipbook-page.is-blank {
    background: linear-gradient(180deg, rgba(255,252,253,0.96), rgba(245, 232, 238, 0.96));
}

.flipbook-page-inner {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.flipbook-page-blank {
    align-items: center;
    justify-content: center;
    color: #b18499;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.6rem;
    letter-spacing: 0.03em;
}

.flipbook-page-header {
    display: flex;
    justify-content: space-between;
    gap: 0.85rem;
    align-items: center;
    margin-bottom: 1rem;
}

.flipbook-page-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.38rem 0.7rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.86);
    color: #9a6380;
    font-size: 0.76rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.flipbook-page-chip-number {
    margin-left: auto;
}

.flipbook-title-seal {
    margin: 0 0 1rem;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    color: var(--book-accent-strong, #c0537f);
}

.flipbook-page-body {
    flex: 1;
}

.flipbook-page-body p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.85;
}

.flipbook-page-footer {
    margin-top: 1rem;
    color: #a06b82;
    font-size: 0.86rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.flipbook-book.is-turning-next .flipbook-page-right {
    animation: literalPageTurnNext 440ms cubic-bezier(0.23, 0.88, 0.29, 1);
}

.flipbook-book.is-turning-prev .flipbook-page-left {
    animation: literalPageTurnPrev 440ms cubic-bezier(0.23, 0.88, 0.29, 1);
}

@keyframes literalPageTurnNext {
    0% { transform: perspective(1600px) rotateY(0deg) scale(1); }
    45% { transform: perspective(1600px) rotateY(-14deg) scale(0.992); }
    100% { transform: perspective(1600px) rotateY(0deg) scale(1); }
}

@keyframes literalPageTurnPrev {
    0% { transform: perspective(1600px) rotateY(0deg) scale(1); }
    45% { transform: perspective(1600px) rotateY(14deg) scale(0.992); }
    100% { transform: perspective(1600px) rotateY(0deg) scale(1); }
}

@media (max-width: 1080px) {
    .flipbook-book {
        min-height: 37rem;
        padding: 1.15rem;
    }

    .flipbook-page-stack-left { left: 1.4rem; }
    .flipbook-page-stack-right { right: 1.4rem; }
}

@media (max-width: 900px) {
    .flipbook-spread {
        grid-template-columns: 1fr;
        gap: 0.9rem;
    }

    .flipbook-spine,
    .flipbook-page-stack {
        display: none;
    }

    .flipbook-book .flipbook-page {
        min-height: 17rem;
        border-width: 8px;
        border-radius: 1.35rem;
    }
}


.flipbook-page.is-title-page::before {
    top: 1.05rem;
    left: 1rem;
    right: auto;
    color: rgba(118, 68, 91, 0.92);
    background: rgba(255,255,255,0.72);
}

.flipbook-title-page-inner {
    justify-content: space-between;
    gap: 1.4rem;
    text-align: center;
}

.flipbook-title-page-top,
.flipbook-title-page-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    color: #9f6c82;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.flipbook-title-page-kicker,
.flipbook-title-page-brand {
    padding: 0.38rem 0.8rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.84);
}

.flipbook-title-page-center {
    display: grid;
    gap: 0.9rem;
    align-content: center;
    flex: 1;
}

.flipbook-title-page-shelf {
    margin: 0;
    color: #a26c83;
    font-size: 0.86rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.flipbook-title-page-heading {
    margin: 0;
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.4rem, 4vw, 3.7rem);
    line-height: 0.96;
    color: var(--book-accent-strong, #c0537f);
}

.flipbook-title-page-subtitle {
    margin: 0 auto;
    max-width: 22rem;
    color: #745363;
    font-size: 1rem;
    line-height: 1.6;
}

.flipbook-title-page-note {
    margin: 0.15rem auto 0;
    max-width: 24rem;
    padding: 1rem 1.1rem;
    border-radius: 1.15rem;
    background: rgba(255,255,255,0.68);
    box-shadow: inset 0 0 0 1px rgba(205, 163, 184, 0.22);
}

.flipbook-title-page-note p {
    margin: 0;
    font-size: 0.98rem;
    line-height: 1.78;
}

@media (max-width: 900px) {
    .flipbook-title-page-top,
    .flipbook-title-page-bottom {
        flex-direction: column;
    }

    .flipbook-title-page-heading {
        font-size: 2.35rem;
    }
}


/* sunshine-xo-final-brand-pass */
:root {
    --bg-pink: #fff9f3;
    --bg-cream: #fff8ef;
    --bg-lilac: #fff4f6;
    --surface: rgba(255, 255, 251, 0.8);
    --surface-strong: rgba(255, 252, 247, 0.92);
    --surface-soft: rgba(255, 249, 243, 0.82);
    --surface-deep: rgba(255, 244, 236, 0.88);
    --text: #715141;
    --text-strong: #2e1b12;
    --text-soft: #977866;
    --pink: #f2c6d5;
    --pink-strong: #f4d08d;
    --pink-deep: #bb8750;
    --gold: #d7ac69;
    --gold-soft: #f5e1b6;
    --border: rgba(190, 145, 79, 0.18);
    --shadow: 0 24px 58px rgba(117, 84, 54, 0.14);
    --shadow-strong: 0 30px 80px rgba(92, 56, 27, 0.18);
}

body {
    color: var(--text);
    background:
        radial-gradient(circle at 12% 10%, rgba(255, 228, 178, 0.42), transparent 26%),
        radial-gradient(circle at 86% 4%, rgba(255, 215, 231, 0.48), transparent 22%),
        radial-gradient(circle at 72% 78%, rgba(255, 234, 199, 0.28), transparent 18%),
        linear-gradient(180deg, #fffbf6 0%, #fff8f1 42%, #fff6f8 100%);
}

body::before {
    background-image:
        radial-gradient(circle at 22% 25%, rgba(255, 255, 255, 0.72) 0, rgba(255, 255, 255, 0) 18%),
        radial-gradient(circle at 80% 18%, rgba(255, 226, 193, 0.38) 0, rgba(255, 226, 193, 0) 16%),
        radial-gradient(circle at 70% 78%, rgba(255, 241, 247, 0.74) 0, rgba(255, 241, 247, 0) 18%);
}

body::after {
    background-image:
        linear-gradient(120deg, rgba(255, 255, 255, 0.06) 20%, rgba(255, 255, 255, 0.01) 40%, rgba(255, 255, 255, 0.07) 60%);
    opacity: 0.24;
}

.loading-screen {
    background: linear-gradient(180deg, #060403 0%, #18100d 60%, #28170f 100%);
}

.loader-card {
    padding: 2.35rem 1.8rem;
    border-radius: 1.9rem;
    background: linear-gradient(180deg, rgba(10, 7, 6, 0.9), rgba(31, 20, 15, 0.92));
    border: 1px solid rgba(215, 172, 105, 0.18);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.3);
}

.loader-brand-lockup {
    display: grid;
    gap: 0.9rem;
    justify-items: center;
    margin-bottom: 1rem;
    isolation: isolate;
}

.loader-brand-sun {
    width: 5.75rem;
    height: auto;
    filter: drop-shadow(0 0 20px rgba(255, 201, 110, 0.28));
    animation: floaty 2.8s ease-in-out infinite;
    mix-blend-mode: screen;
}

.loader-brand-script {
    width: min(19rem, 78vw);
    height: auto;
    display: block;
    mix-blend-mode: screen;
}

.loader-card p {
    color: #f5dfb4;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.age-gate-modal,
.vip-modal {
    background: rgba(14, 10, 9, 0.68);
}

.soft-card {
    background: linear-gradient(180deg, rgba(255, 255, 252, 0.88), rgba(255, 247, 241, 0.92));
    border: 1px solid rgba(198, 152, 90, 0.16);
    box-shadow: 0 24px 56px rgba(128, 94, 63, 0.14);
}

.announcement-bar {
    background: linear-gradient(90deg, #0a0807 0%, #302117 24%, #b98845 54%, #3a2618 78%, #0e0908 100%);
    color: #fff0d2;
    box-shadow: 0 12px 30px rgba(62, 39, 21, 0.24);
}

.announcement-link {
    color: #fff1ca;
    border-bottom-color: rgba(255, 241, 202, 0.64);
}

.site-header {
    background: linear-gradient(180deg, rgba(10, 8, 8, 0.82), rgba(22, 16, 14, 0.72));
    border-bottom: 1px solid rgba(215, 172, 105, 0.18);
    box-shadow: 0 16px 36px rgba(20, 10, 7, 0.12);
}

.site-header.scrolled {
    background: linear-gradient(180deg, rgba(8, 6, 6, 0.94), rgba(28, 18, 15, 0.92));
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.18);
}

.brand {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.95rem;
    padding: 0.55rem 0.95rem 0.55rem 0.6rem;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(6, 4, 4, 0.96), rgba(23, 16, 13, 0.94) 78%, rgba(45, 29, 19, 0.94));
    border: 1px solid rgba(215, 172, 105, 0.18);
    box-shadow: 0 18px 48px rgba(28, 15, 10, 0.24);
    isolation: isolate;
}

.brand:hover,
.brand:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 20px 54px rgba(28, 15, 10, 0.28);
}

.brand-icon {
    width: 3.2rem;
    height: auto;
    display: block;
    filter: drop-shadow(0 0 14px rgba(255, 202, 112, 0.2));
    mix-blend-mode: screen;
}

.brand-copy {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
}

.brand-script {
    width: min(12.9rem, 42vw);
    max-width: 100%;
    height: auto;
    display: block;
    mix-blend-mode: screen;
}

.brand-sub,
.eyebrow,
.card-kicker,
.tier-label,
.section-tag,
.status-pill span,
.announcement-pill,
.preview-lock {
    color: #c58e54;
}

.brand-sub {
    display: block;
    max-width: 14rem;
    line-height: 1.28;
    font-size: 0.64rem;
    letter-spacing: 0.15em;
    color: rgba(247, 226, 189, 0.78);
}

.nav-toggle {
    background: rgba(255, 250, 242, 0.92);
    border-color: rgba(198, 152, 90, 0.28);
    color: #311d12;
    box-shadow: 0 12px 30px rgba(112, 77, 45, 0.12);
}

.site-nav {
    background: linear-gradient(180deg, rgba(13, 9, 8, 0.98), rgba(31, 22, 18, 0.96));
    border-color: rgba(215, 172, 105, 0.16);
    box-shadow: 0 24px 52px rgba(0, 0, 0, 0.24);
}

.site-nav a {
    color: #f8e8cb;
}

.site-nav a[aria-current="page"],
.site-nav a:hover,
.site-nav a:focus-visible,
.mobile-bottom-nav a.active {
    background: rgba(215, 172, 105, 0.12);
    color: #fffaf0;
}

.hero-copy h1,
.page-hero h1,
.section-heading h2,
.copy-card h2,
.auth-sidecard h2,
.hero-card h2,
.feed-card h3,
.preview-overlay h3,
.bio-story-copy h2,
.age-gate-content h1,
.vip-modal-card h2,
.footer-brand p,
.footer-links a,
.footer-note,
.footer-closing {
    color: inherit;
}

.hero-mantra {
    color: #7c5d43;
}

.sparkle-layer span,
.soft-sparkles span {
    color: rgba(197, 142, 84, 0.34);
}

.cinematic-hero::before {
    background:
        radial-gradient(circle at 20% 25%, rgba(255, 217, 158, 0.42), transparent 22%),
        radial-gradient(circle at 80% 18%, rgba(255, 234, 206, 0.62), transparent 18%),
        linear-gradient(180deg, rgba(255, 248, 236, 0.54), rgba(255, 247, 251, 0));
}

.hero-glow-one {
    background: radial-gradient(circle, rgba(255, 204, 136, 0.52), rgba(255, 204, 136, 0));
}

.hero-glow-two {
    background: radial-gradient(circle, rgba(255, 220, 197, 0.62), rgba(255, 220, 197, 0));
}

.btn-primary {
    background: linear-gradient(135deg, #fae1aa, #d6a85c 58%, #f6d18b);
    color: #2d1a11;
    box-shadow: 0 16px 32px rgba(164, 112, 42, 0.24);
}

.btn-secondary {
    background: rgba(19, 14, 12, 0.84);
    border-color: rgba(215, 172, 105, 0.22);
    color: #f8ebd3;
}

.btn-ghost {
    background: rgba(255, 255, 255, 0.74);
    border-color: rgba(198, 152, 90, 0.24);
    color: #452e21;
}

.hero-badges span,
.product-tag,
.feed-meta,
.status-pill,
.preview-chip,
.comment-handle,
.unlock-badge {
    background: rgba(215, 172, 105, 0.1);
    color: #ab7441;
    border-color: rgba(198, 152, 90, 0.2);
}

.hero-card-main,
.page-hero-card,
.auth-sidecard,
.story-card,
.product-card,
.coming-soon-card,
.tier-card,
.feature-card,
.comment-card,
.copy-card,
.rewards-visual-card,
.shop-category-card,
.unlock-card,
.progress-card,
.auth-card,
.bio-copy,
.promo-panel,
.memoir-copy-card,
.memoir-cover-card,
.memoir-journal-card,
.announcement-banner,
.status-card,
.feed-card,
.preview-card,
.creator-quote-card,
.library-account-panel {
    position: relative;
    overflow: hidden;
}

.hero-card-main::before,
.page-hero-card::before,
.auth-sidecard::before,
.story-card::before,
.product-card::before,
.coming-soon-card::before,
.tier-card::before,
.feature-card::before,
.comment-card::before,
.copy-card::before,
.rewards-visual-card::before,
.shop-category-card::before,
.unlock-card::before,
.progress-card::before,
.creator-quote-card::before,
.library-account-panel::before {
    content: "";
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 3rem;
    height: 3rem;
    border-radius: 1rem;
    background:
        linear-gradient(135deg, rgba(6, 4, 4, 0.96), rgba(31, 20, 15, 0.96)),
        url('assets/brand/sunshine-sun.png') center/2rem no-repeat;
    background-blend-mode: screen;
    border: 1px solid rgba(215, 172, 105, 0.16);
    box-shadow: 0 14px 28px rgba(34, 18, 11, 0.18);
}

.brand-showcase-card {
    padding: 1rem;
    background:
        radial-gradient(circle at top left, rgba(255, 230, 175, 0.28), transparent 28%),
        radial-gradient(circle at bottom right, rgba(255, 196, 220, 0.24), transparent 34%),
        linear-gradient(145deg, rgba(255, 252, 248, 0.96), rgba(255, 239, 228, 0.92));
    border: 1px solid rgba(215, 172, 105, 0.18);
    box-shadow: 0 26px 64px rgba(24, 13, 9, 0.26);
    isolation: isolate;
}

.brand-showcase-lockup {
    display: grid;
    justify-items: center;
    gap: 1.2rem;
    min-height: 100%;
    padding: 1.4rem 1rem;
    border-radius: 1.4rem;
    background:
        linear-gradient(180deg, rgba(255, 250, 243, 0.92), rgba(255, 239, 234, 0.88)),
        linear-gradient(145deg, rgba(255, 215, 150, 0.18), rgba(255, 198, 214, 0.16));
    border: 1px solid rgba(215, 172, 105, 0.14);
}

.brand-showcase-sun,
.brand-showcase-script,
.bio-visual-sun,
.bio-visual-script,
.footer-logo-icon,
.footer-logo-script {
    mix-blend-mode: screen;
}

.brand-showcase-sun {
    width: min(11rem, 42vw);
    height: auto;
    display: block;
    filter: drop-shadow(0 0 24px rgba(255, 196, 112, 0.28));
}

.brand-showcase-copy {
    display: grid;
    justify-items: center;
    gap: 0.75rem;
    text-align: center;
}

.brand-showcase-script {
    width: min(18rem, 70vw);
    height: auto;
    display: block;
}

.brand-showcase-copy p {
    margin: 0;
    color: #9c6f3f;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.product-visual,
.portrait-placeholder,
.rewards-visual-shape,
.bio-story-visual {
    border: 1px solid rgba(198, 152, 90, 0.18);
    box-shadow: 0 24px 52px rgba(33, 19, 13, 0.14);
}

.product-visual,
.portrait-placeholder,
.rewards-visual-shape {
    background: linear-gradient(145deg, rgba(14, 10, 9, 0.98), rgba(44, 28, 21, 0.92));
    color: #f0d6aa;
    text-shadow: 0 6px 20px rgba(0, 0, 0, 0.22);
}

.bio-story-visual {
    isolation: isolate;
    background:
        radial-gradient(circle at top left, rgba(255, 230, 171, 0.28), transparent 28%),
        radial-gradient(circle at 82% 20%, rgba(255, 198, 214, 0.22), transparent 28%),
        linear-gradient(145deg, rgba(255, 252, 248, 0.96), rgba(255, 239, 233, 0.92));
}

.bio-visual-lockup {
    display: grid;
    justify-items: center;
    gap: 1rem;
    width: min(100%, 22rem);
    padding: 1.8rem 1.4rem 3.8rem;
}

.bio-visual-sun {
    width: min(10rem, 38vw);
    height: auto;
    display: block;
    filter: drop-shadow(0 0 24px rgba(255, 198, 115, 0.26));
}

.bio-visual-script {
    width: min(16rem, 60vw);
    height: auto;
    display: block;
}

.bio-story-visual::after {
    background: rgba(255, 250, 244, 0.92);
    color: #9f7342;
    border: 1px solid rgba(215, 172, 105, 0.16);
}

.section-cream {
    background: linear-gradient(180deg, rgba(255, 250, 241, 0.82), rgba(255, 247, 251, 0.72));
}

.footer-shell {
    background: linear-gradient(180deg, rgba(8, 6, 6, 0.98), rgba(25, 17, 15, 0.98));
    border: 1px solid rgba(215, 172, 105, 0.18);
    box-shadow: 0 30px 72px rgba(18, 10, 7, 0.22);
}

.footer-top {
    border-bottom: 1px solid rgba(215, 172, 105, 0.12);
}

.footer-brand p,
.footer-links a,
.footer-bottom,
.footer-note,
.footer-closing {
    color: #dcc5ac;
}

.footer-links a:hover,
.footer-links a:focus-visible,
.inline-link,
.inline-link:hover,
.inline-link:focus-visible {
    color: #f5d697;
}

.footer-logo-lockup {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 0 0 0.75rem;
    isolation: isolate;
}

.footer-logo-icon {
    width: 4.2rem;
    height: auto;
    display: block;
}

.footer-logo-copy {
    display: grid;
    gap: 0.45rem;
}

.footer-logo-script {
    width: min(18rem, 58vw);
    height: auto;
    display: block;
}

.footer-brand-tagline {
    color: rgba(247, 226, 189, 0.78);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.mobile-bottom-nav {
    background: linear-gradient(180deg, rgba(11, 8, 8, 0.94), rgba(28, 19, 16, 0.95));
    border: 1px solid rgba(215, 172, 105, 0.16);
    box-shadow: 0 24px 50px rgba(19, 11, 8, 0.24);
}

.mobile-bottom-nav a {
    color: #d6b79b;
}

.auth-card input[type="text"],
.auth-card input[type="email"],
.auth-card input[type="password"] {
    border-color: rgba(198, 152, 90, 0.18);
    background: rgba(255, 251, 247, 0.92);
}

.auth-card input[type="text"]:focus,
.auth-card input[type="email"]:focus,
.auth-card input[type="password"]:focus {
    outline: 2px solid rgba(215, 172, 105, 0.26);
    outline-offset: 1px;
}

.flipbook-modal {
    background: rgba(17, 10, 8, 0.82);
}

.flipbook-shell {
    background:
        radial-gradient(circle at top right, rgba(255, 245, 214, 0.42), transparent 24%),
        linear-gradient(145deg, rgba(255, 245, 249, 0.98), rgba(250, 232, 239, 0.96));
    border-color: rgba(215, 172, 105, 0.16);
}

.flipbook-topbar {
    position: relative;
    padding-right: 14rem;
}

.flipbook-topbar::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 13rem;
    height: 4rem;
    border-radius: 1rem;
    background:
        linear-gradient(135deg, rgba(8, 6, 6, 0.98), rgba(26, 17, 14, 0.98)),
        url('assets/brand/sunshine-xo-script.png') center/52% auto no-repeat;
    background-blend-mode: screen;
    border: 1px solid rgba(215, 172, 105, 0.16);
    box-shadow: 0 18px 34px rgba(20, 12, 8, 0.2);
    transform: none;
}

.flipbook-title-page-inner::before {
    content: "";
    justify-self: center;
    width: 4.75rem;
    height: 4.75rem;
    border-radius: 1.4rem;
    background:
        linear-gradient(135deg, rgba(8, 6, 6, 0.98), rgba(26, 17, 14, 0.98)),
        url('assets/brand/sunshine-sun.png') center/3.2rem no-repeat;
    background-blend-mode: screen;
    border: 1px solid rgba(215, 172, 105, 0.16);
    box-shadow: 0 16px 30px rgba(24, 13, 9, 0.16);
}

.flipbook-title-page-center {
    align-content: start;
}

@media (max-width: 900px) {
    .brand {
        gap: 0.7rem;
        padding-right: 0.7rem;
    }

    .brand-icon {
        width: 2.7rem;
    }

    .brand-script {
        width: min(10.6rem, 44vw);
    }

    .footer-logo-lockup {
        align-items: flex-start;
    }

    .flipbook-topbar {
        padding-top: 4.7rem;
        padding-right: 0;
    }

    .flipbook-topbar::after {
        left: 50%;
        right: auto;
        width: 11rem;
        height: 3.7rem;
        background-size: auto, 56% auto;
        transform: translateX(-50%);
    }
}

@media (max-width: 720px) {
    .brand {
        padding: 0.45rem 0.65rem 0.45rem 0.45rem;
    }

    .brand-sub {
        max-width: 11rem;
        letter-spacing: 0.12em;
        font-size: 0.56rem;
    }

    .brand-updates-rotator {
        min-height: 10.5rem;
    }

    .brand-showcase-card {
        padding: 0.45rem;
    }

    .footer-logo-lockup {
        flex-direction: column;
    }

    .footer-logo-script {
        width: min(14rem, 72vw);
    }

    .hero-card-main::before,
    .page-hero-card::before,
    .auth-sidecard::before,
    .story-card::before,
    .product-card::before,
    .coming-soon-card::before,
    .tier-card::before,
    .feature-card::before,
    .comment-card::before,
    .copy-card::before,
    .rewards-visual-card::before,
    .shop-category-card::before,
    .unlock-card::before,
    .progress-card::before,
    .creator-quote-card::before,
    .library-account-panel::before {
        width: 2.5rem;
        height: 2.5rem;
        border-radius: 0.9rem;
        background-size: 1.6rem;
    }
}

/* typed-reader refresh */
.flipbook-book {
    overflow: hidden;
    --reader-scale: 1;
    --reader-paper-start: rgba(255, 252, 252, 0.99);
    --reader-paper-end: rgba(250, 238, 243, 0.98);
}

.flipbook-book .flipbook-page {
    padding: 1.8rem 1.65rem 1.35rem;
    background:
        linear-gradient(180deg, var(--reader-paper-start), var(--reader-paper-end));
    transition: background 220ms ease, box-shadow 220ms ease;
}

.flipbook-page-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 0.95rem;
}

.flipbook-running-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid rgba(188, 141, 161, 0.22);
    color: #9e7184;
    font-family: 'Manrope', sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.flipbook-block-heading,
.flipbook-block-paragraph,
.flipbook-block-list {
    margin: 0;
}

.flipbook-block-heading {
    font-family: 'Cormorant Garamond', serif;
    line-height: 1.02;
    color: #6a4353;
}

.flipbook-block-heading.is-level-1 {
    font-size: clamp(2.1rem, 3vw, 3rem);
    color: var(--book-accent-strong, #bc5f86);
    letter-spacing: 0.01em;
}

.flipbook-block-heading.is-level-2 {
    font-size: 1.45rem;
    color: #7a5666;
}

.flipbook-block-heading.is-level-3 {
    font-family: 'Manrope', sans-serif;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #a6768b;
}

.flipbook-block-paragraph,
.flipbook-block-list {
    color: #42323a;
    font-family: 'Iowan Old Style', 'Palatino Linotype', 'Book Antiqua', Georgia, serif;
    font-size: calc(1.02rem * var(--reader-scale, 1));
    line-height: 1.82;
}

.flipbook-block-list {
    display: grid;
    gap: 0.55rem;
    padding-left: 1.3rem;
}

.flipbook-block-list.is-ordered {
    padding-left: 1.45rem;
}

.flipbook-block-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    margin: 0.2rem 0 0.15rem;
    color: #ab7a90;
    font-family: 'Manrope', sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.flipbook-block-divider::before,
.flipbook-block-divider::after {
    content: '♡';
    font-size: 0.82rem;
}

.flipbook-page-footer-line {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.1rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(188, 141, 161, 0.18);
    color: #9e7184;
    font-family: 'Manrope', sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.page-layout-cover .flipbook-page-content,
.page-layout-chapter .flipbook-page-content,
.page-layout-section .flipbook-page-content,
.flipbook-page-layout-cover .flipbook-page-content,
.flipbook-page-layout-chapter .flipbook-page-content,
.flipbook-page-layout-section .flipbook-page-content {
    justify-content: center;
}

.page-layout-cover .flipbook-page-content,
.flipbook-page-layout-cover .flipbook-page-content {
    text-align: center;
    gap: 1.15rem;
}

.flipbook-page-layout-cover-art .flipbook-page-content {
    align-items: center;
    justify-content: center;
    gap: 0.95rem;
}

.flipbook-cover-portrait {
    width: min(100%, 19rem);
    margin: 0;
    border-radius: 1.2rem;
    overflow: hidden;
    box-shadow:
        0 24px 48px -28px rgba(63, 25, 40, 0.4),
        0 0 0 1px rgba(255, 255, 255, 0.72),
        0 0 0 0.6rem rgba(255, 255, 255, 0.38);
}

.flipbook-cover-portrait img {
    display: block;
    width: 100%;
    height: auto;
}

.flipbook-cover-caption {
    margin: 0;
    color: #8f6778;
    font-family: 'Manrope', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.page-layout-cover .flipbook-block-heading.is-level-1,
.flipbook-page-layout-cover .flipbook-block-heading.is-level-1 {
    font-size: clamp(3rem, 4.1vw, 4.5rem);
}

.page-layout-cover .flipbook-block-heading.is-level-2,
.flipbook-page-layout-cover .flipbook-block-heading.is-level-2 {
    max-width: 24rem;
    margin: 0 auto;
    font-size: 1.3rem;
    line-height: 1.22;
}

.page-layout-cover .flipbook-block-heading.is-level-3,
.flipbook-page-layout-cover .flipbook-block-heading.is-level-3 {
    display: inline-flex;
    align-self: center;
    padding: 0.45rem 0.95rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: inset 0 0 0 1px rgba(193, 152, 172, 0.2);
}

.page-layout-cover .flipbook-block-paragraph,
.flipbook-page-layout-cover .flipbook-block-paragraph {
    max-width: 24rem;
    margin: 0 auto;
    text-align: center;
}

.page-layout-cover .flipbook-page-footer-line,
.page-layout-chapter .flipbook-page-footer-line,
.flipbook-page-layout-cover .flipbook-page-footer-line,
.flipbook-page-layout-chapter .flipbook-page-footer-line {
    justify-content: center;
}

.page-layout-chapter .flipbook-page-content,
.flipbook-page-layout-chapter .flipbook-page-content {
    text-align: center;
    gap: 1rem;
}

.page-layout-chapter .flipbook-block-heading.is-level-1,
.flipbook-page-layout-chapter .flipbook-block-heading.is-level-1 {
    font-size: clamp(2.5rem, 3.4vw, 3.8rem);
}

.page-layout-chapter .flipbook-block-paragraph,
.flipbook-page-layout-chapter .flipbook-block-paragraph,
.page-layout-section .flipbook-block-paragraph,
.flipbook-page-layout-section .flipbook-block-paragraph {
    max-width: 24rem;
    margin: 0 auto;
    text-align: center;
}

.flipbook-page.is-active {
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.85),
        0 0 0 3px rgba(255, 255, 255, 0.85),
        0 24px 62px -44px rgba(66, 25, 42, 0.48);
}

.flipbook-turn-sheet {
    position: absolute;
    top: 1.35rem;
    bottom: 1.35rem;
    z-index: 3;
    width: calc(50% - 1rem);
    opacity: 0;
    pointer-events: none;
}

.flipbook-turn-sheet[data-side="left"] {
    left: 1.5rem;
}

.flipbook-turn-sheet[data-side="right"] {
    right: 1.5rem;
}

.flipbook-turn-sheet.is-visible {
    opacity: 1;
}

.flipbook-turn-sheet .flipbook-page {
    min-height: 100%;
    height: 100%;
    box-shadow: 0 26px 54px rgba(61, 21, 38, 0.2);
    backface-visibility: hidden;
    transform-style: preserve-3d;
}

.flipbook-turn-sheet.is-turning-next .flipbook-page {
    transform-origin: left center;
}

.flipbook-turn-sheet.is-turning-prev .flipbook-page {
    transform-origin: right center;
}

.flipbook-turn-sheet.is-turning-next.is-animating .flipbook-page {
    animation: flipbookTypedTurnNext 720ms cubic-bezier(0.22, 0.9, 0.22, 1) forwards;
}

.flipbook-turn-sheet.is-turning-prev.is-animating .flipbook-page {
    animation: flipbookTypedTurnPrev 720ms cubic-bezier(0.22, 0.9, 0.22, 1) forwards;
}

@keyframes flipbookTypedTurnNext {
    0% {
        opacity: 1;
        transform: perspective(2400px) rotateY(0deg) translateX(0);
        filter: brightness(1);
    }
    48% {
        opacity: 1;
        transform: perspective(2400px) rotateY(-92deg) translateX(-8%);
        filter: brightness(0.96);
    }
    100% {
        opacity: 0;
        transform: perspective(2400px) rotateY(-178deg) translateX(-14%);
        filter: brightness(0.92);
    }
}

@keyframes flipbookTypedTurnPrev {
    0% {
        opacity: 1;
        transform: perspective(2400px) rotateY(0deg) translateX(0);
        filter: brightness(1);
    }
    48% {
        opacity: 1;
        transform: perspective(2400px) rotateY(92deg) translateX(8%);
        filter: brightness(0.96);
    }
    100% {
        opacity: 0;
        transform: perspective(2400px) rotateY(178deg) translateX(14%);
        filter: brightness(0.92);
    }
}

@media (max-width: 900px) {
    .flipbook-book .flipbook-page {
        min-height: 19rem;
        padding: 1.35rem 1.15rem 1.1rem;
    }

    .flipbook-running-head {
        font-size: 0.64rem;
        letter-spacing: 0.13em;
    }

    .flipbook-block-paragraph,
    .flipbook-block-list {
        font-size: calc(0.97rem * var(--reader-scale, 1));
        line-height: 1.72;
    }

    .flipbook-cover-portrait {
        width: min(100%, 13rem);
    }

    .flipbook-block-heading.is-level-1 {
        font-size: 2.15rem;
    }

    .flipbook-block-heading.is-level-2 {
        font-size: 1.28rem;
    }

    .flipbook-page-footer-line {
        font-size: 0.62rem;
    }

    .flipbook-turn-sheet {
        display: none;
    }
}

@media (max-width: 860px) {
    .footer-shell::before {
        width: clamp(10rem, 42vw, 15rem);
        height: clamp(7rem, 28vw, 11rem);
    }

    .footer-shell::after {
        width: clamp(10.5rem, 39vw, 14rem);
        height: clamp(6rem, 22vw, 8rem);
        right: 0.25rem;
        opacity: 0.84;
    }

    .footer-bottom,
    .footer-note,
    .footer-closing {
        max-width: 100%;
    }
}

@media (max-width: 560px) {
    .footer-shell::before {
        width: 9.5rem;
        height: 6.6rem;
    }

    .footer-shell::after {
        width: 8.4rem;
        height: 5rem;
        right: 0.15rem;
        opacity: 0.8;
    }
}