.fz-sb-wrapper {
    max-width: 980px;
    margin: 0 auto;
}
.fz-sb-story-card {
    transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;
    border-radius: 1rem;
    overflow: hidden;
}
.fz-sb-story-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12) !important;
}
.fz-sb-story-icon {
    font-size: 2.4rem;
    line-height: 1;
}
.fz-sb-pill-btn {
    border-radius: 2rem;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.3rem 0.85rem;
    border: 1px solid var(--bs-border-color, #dee2e6);
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
    transition: all 0.15s;
    cursor: pointer;
}
.fz-sb-pill-btn:hover {
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-color: var(--bs-primary, #0d6efd);
    color: var(--bs-primary, #0d6efd);
}
.fz-sb-pill-btn.active {
    background: var(--bs-primary, #0d6efd);
    border-color: var(--bs-primary, #0d6efd);
    color: #fff;
    box-shadow: 0 2px 6px rgba(13, 110, 253, 0.3);
}

.fz-sb-reader-wrapper {
    max-width: 800px;
    margin: 0 auto;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    transition: background-color 0.25s, color 0.25s;
}
.fz-sb-reader-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    background: var(--bs-tertiary-bg, #f8f9fa);
}
.fz-sb-narration-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.6rem 1.25rem;
    background: rgba(13, 110, 253, 0.06);
    border-bottom: 1px solid rgba(13, 110, 253, 0.15);
}
.fz-sb-speed-btn {
    border: 1px solid var(--bs-border-color, #dee2e6);
    background: transparent;
    padding: 0.1rem 0.4rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: bold;
    cursor: pointer;
    margin-left: 2px;
}
.fz-sb-speed-btn.active {
    background: var(--bs-primary, #0d6efd);
    color: #fff;
    border-color: var(--bs-primary, #0d6efd);
}

.fz-sb-page-card {
    padding: 2.5rem 2rem;
    min-height: 380px;
}
.fz-sb-page-inner {
    max-width: 660px;
    margin: 0 auto;
}
.fz-sb-paragraph {
    line-height: 1.85;
    margin-bottom: 1.25rem;
    text-align: justify;
}
.fz-sb-first-para::first-letter {
    float: left;
    font-size: 3.2rem;
    line-height: 0.85;
    font-weight: bold;
    margin-right: 0.6rem;
    margin-top: 0.15rem;
    color: var(--bs-primary, #0d6efd);
    font-family: Georgia, 'Times New Roman', serif;
}

.theme-parchment {
    background-color: #fbf7ee !important;
    color: #2b2520 !important;
}
.theme-parchment .fz-sb-page-card {
    background: #fbf7ee;
}
.theme-sepia {
    background-color: #f4ebd7 !important;
    color: #3b2c1a !important;
}
.theme-sepia .fz-sb-page-card {
    background: #f4ebd7;
}
.theme-light {
    background-color: #ffffff !important;
    color: #1e293b !important;
}
.theme-light .fz-sb-page-card {
    background: #ffffff;
}
.theme-dark {
    background-color: #0f172a !important;
    color: #f1f5f9 !important;
}
.theme-dark .fz-sb-page-card {
    background: #0f172a;
}
.theme-dark .fz-sb-reader-header,
.theme-dark .fz-sb-narration-bar {
    background: #1e293b;
    border-color: #334155;
}
.theme-dark .fz-sb-page-nav {
    background: #1e293b;
    border-top: 1px solid #334155;
}

.font-small .fz-sb-paragraph { font-size: 0.98rem; }
.font-medium .fz-sb-paragraph { font-size: 1.14rem; }
.font-large .fz-sb-paragraph { font-size: 1.34rem; }

.fz-sb-page-nav {
    padding: 0.75rem 1.25rem;
    background: var(--bs-tertiary-bg, #f8f9fa);
    border-top: 1px solid var(--bs-border-color, #dee2e6);
}

.fz-sb-moral-quote-box {
    background: rgba(245, 158, 11, 0.1);
    border-left: 4px solid #f59e0b;
    padding: 1.25rem 1.5rem;
    border-radius: 0.5rem;
    margin: 1.5rem 0;
}