/* Bible search: quiet glass surfaces and clearly grouped controls. */
@media (max-width: 820px) {
    #mobileReaderPanel,
    #mobileNumberPicker {
        --panel-ink: #f1f5fc;
        --panel-muted: #a9b5c7;
        --panel-line: rgba(210, 227, 255, 0.13);
        --panel-fill: linear-gradient(145deg, rgba(31, 41, 57, 0.94), rgba(12, 17, 27, 0.94));
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        color: var(--panel-ink);
    }

    #mobileReaderPanel {
        left: 12px;
        right: 12px;
        bottom: calc(var(--bible-keyboard-offset, 0px) + max(12px, env(safe-area-inset-bottom, 0px)));
        width: auto;
        max-width: 460px;
        max-height: none;
        margin: 0 auto;
    }

    #mobileReaderPanel .mobile-reader-panel-shell,
    #mobileNumberPicker .mobile-number-picker-sheet {
        box-sizing: border-box;
        background: var(--panel-fill);
        border: 1px solid var(--panel-line);
        border-radius: 28px;
        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(231, 242, 255, 0.09);
        -webkit-backdrop-filter: blur(24px) saturate(1.15);
        backdrop-filter: blur(24px) saturate(1.15);
        padding: 22px;
        overflow: auto;
        overscroll-behavior: contain;
        max-height: calc(var(--bible-visible-height, 100dvh) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 28px);
        will-change: auto;
        animation: bible-panel-enter 260ms cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    #mobileReaderPanel .mobile-reader-panel-shell::before,
    #mobileNumberPicker .mobile-number-picker-sheet::before {
        display: none;
    }

    #mobileReaderPanel .mobile-reader-panel-header {
        align-items: flex-start;
        gap: 12px;
        margin: 0 0 20px;
        padding: 0;
    }

    #mobileReaderPanel .mobile-panel-kicker {
        color: #92c7f4;
        font-size: 10px;
        font-weight: 650;
        letter-spacing: 0.16em;
        margin-bottom: 7px;
    }

    #mobileReaderPanel .mobile-reader-panel-header strong {
        font-size: 22px;
        line-height: 1.15;
        font-weight: 650;
        letter-spacing: -0.035em;
        color: var(--panel-ink);
    }

    #mobileReaderPanel .mobile-panel-description {
        margin: 8px 0 0;
        font-size: 13px;
        line-height: 1.5;
        color: var(--panel-muted);
    }

    #mobileReaderPanel .mobile-panel-close,
    #mobileNumberPicker .mobile-number-picker-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        padding: 0;
        border: 1px solid var(--panel-line);
        border-radius: 50%;
        color: #cad7e7;
        background: rgba(233, 241, 255, 0.05);
        cursor: pointer;
    }

    #mobileReaderPanel .mobile-panel-close svg {
        width: 18px;
        height: 18px;
    }

    #mobileReaderPanel .reader-controls {
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        padding: 0;
        transform: none;
        will-change: auto;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    #mobileReaderPanel .search-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 48px;
        align-items: center;
        gap: 8px;
    }

    #mobileReaderPanel #searchInput {
        grid-area: 1 / 1;
        width: 100%;
        min-width: 0;
        height: 52px;
        min-height: 52px;
        padding: 0 44px 0 14px;
        border: 1px solid var(--panel-line);
        border-radius: 15px;
        background: rgba(0, 0, 0, 0.20);
        color: var(--panel-ink);
        font: 400 16px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        box-shadow: none;
    }

    #mobileReaderPanel #searchInput::placeholder { color: #8f9db0; }
    #mobileReaderPanel #searchInput::-webkit-search-cancel-button { -webkit-appearance: none; }

    #mobileReaderPanel #clearSearchButton {
        grid-area: 1 / 1;
        justify-self: end;
        z-index: 1;
        width: 44px;
        height: 48px;
        min-height: 44px;
        background: transparent;
        color: #9baabd;
        border: 0;
        border-radius: 12px;
        box-shadow: none;
    }

    #mobileReaderPanel #clearSearchButton svg { width: 16px; height: 16px; }

    #mobileReaderPanel #searchButton {
        grid-area: 1 / 2;
        width: 48px;
        height: 52px;
        min-height: 52px;
        border: 1px solid rgba(202, 230, 255, 0.25);
        border-radius: 15px;
        background: #aed7fa;
        color: #15283e;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24);
    }

    #mobileReaderPanel #searchButton svg { width: 21px; height: 21px; }

    #mobileReaderPanel .mobile-reference-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px 12px;
        border-top: 1px solid var(--panel-line);
        margin-top: 20px;
        padding-top: 18px;
    }

    #mobileReaderPanel #versionAField,
    #mobileReaderPanel #bookField { grid-column: 1 / -1; }
    #mobileReaderPanel #chapterField { grid-column: 1; }
    #mobileReaderPanel #verseField { grid-column: 2; }

    #mobileReaderPanel .setting-field { gap: 7px; min-width: 0; }

    #mobileReaderPanel .setting-field label {
        color: var(--panel-muted);
        padding: 0 2px;
        font-size: 12px;
        font-weight: 500;
        line-height: 1.3;
        letter-spacing: 0;
        text-transform: none;
    }

    #mobileReaderPanel .mobile-number-trigger {
        box-sizing: border-box;
        position: relative;
        width: 100%;
        min-height: 50px;
        height: auto;
        padding: 13px 40px 13px 14px;
        border: 1px solid var(--panel-line);
        border-radius: 15px;
        background: rgba(214, 230, 253, 0.055);
        color: #e9f0fa;
        font: 500 15px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        white-space: normal;
        overflow-wrap: anywhere;
        text-overflow: clip;
        box-shadow: none;
        transition: background 160ms ease, border-color 160ms ease;
    }

    #mobileReaderPanel .mobile-number-trigger::after {
        content: "";
        position: absolute;
        right: 17px;
        top: calc(50% - 5px);
        width: 7px;
        height: 7px;
        border-right: 1.5px solid #93a7bf;
        border-bottom: 1.5px solid #93a7bf;
        transform: rotate(45deg);
        pointer-events: none;
    }

    #mobileReaderPanel :is(#chapterGridTrigger, #verseGridTrigger) {
        font-size: 18px;
        font-variant-numeric: tabular-nums;
    }

    #mobileReaderPanel button:active,
    #mobileNumberPicker .mobile-number-option:active { filter: brightness(1.14); }

    #mobileReaderPanel :is(button, input):focus-visible,
    #mobileNumberPicker button:focus-visible {
        outline: 2px solid #aad8ff;
        outline-offset: 2px;
    }

    #mobileNumberPicker {
        bottom: var(--bible-keyboard-offset, 0px);
        padding: 14px 12px max(12px, env(safe-area-inset-bottom, 0px));
    }

    #mobileNumberPicker .mobile-number-picker-backdrop {
        background: rgba(0, 0, 0, 0.35);
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
    }

    #mobileNumberPicker .mobile-number-picker-sheet {
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 460px;
        max-height: min(650px, calc(var(--bible-visible-height, 100dvh) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 28px));
        overflow: hidden;
    }

    #mobileNumberPicker .mobile-number-picker-header {
        flex-shrink: 0;
        gap: 12px;
        margin-bottom: 18px;
        padding: 0;
    }

    #mobileNumberPicker .mobile-number-picker-header strong {
        font-size: 22px;
        font-weight: 650;
        letter-spacing: -0.025em;
    }

    #mobileNumberPicker .mobile-number-grid {
        grid-template-columns: repeat(auto-fit, minmax(44px, 1fr));
        gap: 8px;
        min-height: 0;
        max-height: none;
        padding: 3px;
        scrollbar-width: thin;
        scrollbar-color: #526277 transparent;
    }

    #mobileNumberPicker .mobile-number-option {
        border-radius: 13px;
        min-height: 44px;
        font-size: 16px;
        font-weight: 500;
        background: rgba(214, 230, 253, 0.055);
        border-color: var(--panel-line);
        color: var(--panel-ink);
        box-shadow: none;
    }

    #mobileNumberPicker[data-picker-type="book"] .mobile-number-grid,
    #mobileNumberPicker[data-picker-type="version"] .mobile-number-grid { grid-template-columns: 1fr; }

    #mobileNumberPicker[data-picker-type="book"] .mobile-number-option,
    #mobileNumberPicker[data-picker-type="version"] .mobile-number-option {
        aspect-ratio: auto;
        min-height: 50px;
        padding: 13px 14px;
        gap: 12px;
        font-size: 15px;
        line-height: 1.45;
        white-space: normal;
        text-align: left;
        justify-content: flex-start;
    }

    #mobileNumberPicker .mobile-version-option-name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
    #mobileNumberPicker .mobile-version-option-score { font-size: 11px; font-weight: 600; }

    #mobileNumberPicker .mobile-number-option.is-selected {
        background: rgba(138, 199, 250, 0.19);
        border-color: rgba(156, 211, 255, 0.55);
        color: #d5edff;
        box-shadow: inset 3px 0 0 #aad8ff;
    }

    #mobileNumberPicker .mobile-number-option.is-selected .mobile-version-option-score {
        background: rgba(155, 210, 255, 0.14);
        border-color: rgba(156, 211, 255, 0.30);
        color: #d5edff;
    }

    #mobileNumberPicker .mobile-version-rating-note {
        flex-shrink: 0;
        margin: 0 0 14px;
        font-size: 12px;
        line-height: 1.5;
        color: var(--panel-muted);
    }

    @keyframes bible-panel-enter {
        from { opacity: 0; transform: translateY(16px) scale(0.98); }
        to { opacity: 1; transform: translateY(0) scale(1); }
    }
}

@media (max-width: 360px) {
    #mobileReaderPanel .mobile-reader-panel-shell,
    #mobileNumberPicker .mobile-number-picker-sheet { padding: 17px; }
    #mobileReaderPanel .mobile-reader-panel-header strong { font-size: 20px; }
}

@media (min-width: 821px) {
    .bible-ambient-page .reader-top .reader-controls {
        --search-line: rgba(210, 227, 255, 0.13);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        background: linear-gradient(145deg, rgba(29, 39, 55, 0.84), rgba(12, 17, 27, 0.84));
        border: 1px solid var(--search-line);
        border-radius: 20px;
        box-shadow: 0 12px 36px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(231, 242, 255, 0.08);
        -webkit-backdrop-filter: blur(18px) saturate(1.1);
        backdrop-filter: blur(18px) saturate(1.1);
        padding: 9px;
        column-gap: 12px;
    }

    .bible-ambient-page .reader-top .search-row {
        grid-template-columns: minmax(0, 1fr) 34px 64px;
        gap: 6px;
    }

    .bible-ambient-page .reader-top .mobile-reference-row {
        gap: 6px;
        margin-top: 6px;
    }

    .bible-ambient-page .reader-top :is(.scripture-input, .scripture-select, .reader-button, .plain-button) {
        box-sizing: border-box;
        min-width: 0;
        min-height: 36px;
        height: 36px;
        border: 1px solid var(--search-line);
        border-radius: 11px;
        color: #e9f0fa;
        font: 400 clamp(13px, 0.86vw, 14px)/1.35 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        box-shadow: none;
        transition: border-color 150ms ease, background-color 150ms ease;
    }

    .bible-ambient-page .reader-top .scripture-input {
        background: rgba(0, 0, 0, 0.22);
        padding: 8px 12px;
    }

    .bible-ambient-page .reader-top .scripture-input::placeholder { color: #9aa9bc; }
    .bible-ambient-page .reader-top .scripture-input::-webkit-search-cancel-button { -webkit-appearance: none; }

    .bible-ambient-page .reader-top .scripture-select {
        background:
            linear-gradient(45deg, transparent 50%, #92a5bc 50%) calc(100% - 15px) 52% / 4px 4px no-repeat,
            linear-gradient(135deg, #92a5bc 50%, transparent 50%) calc(100% - 11px) 52% / 4px 4px no-repeat,
            rgba(214, 230, 253, 0.05);
        padding: 7px 29px 7px 11px;
        cursor: pointer;
        text-overflow: ellipsis;
        font-variant-numeric: tabular-nums;
    }

    .bible-ambient-page .reader-top #clearSearchButton {
        padding: 0;
        background: rgba(214, 230, 253, 0.04);
        color: #aabbd0;
    }

    .bible-ambient-page .reader-top #clearSearchButton svg { width: 15px; height: 15px; }

    .bible-ambient-page .reader-top #searchButton {
        padding: 0 10px;
        background: #aed7fa;
        border-color: rgba(202, 230, 255, 0.25);
        color: #15283e;
        font-size: 13px;
        font-weight: 600;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
    }

    .bible-ambient-page .reader-top #searchButton:hover { background: #c3e4ff; }
    .bible-ambient-page .reader-top #clearSearchButton:hover { background: rgba(214, 230, 253, 0.10); }

    .bible-ambient-page .reader-top .settings-panel {
        background: rgba(17, 24, 36, 0.94);
        border-color: var(--search-line);
        border-radius: 15px;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
        padding: 10px;
    }

    .bible-ambient-page .reader-top :is(.setting-field label, .toggle-row span) {
        font-size: 11px;
        font-weight: 500;
        line-height: 1.3;
        letter-spacing: 0;
        text-transform: none;
        color: #a9b5c7;
    }

    .bible-ambient-page .reader-top .toggle-control {
        box-sizing: border-box;
        width: 34px;
        height: 20px;
        padding: 3px;
        background: rgba(210, 227, 255, 0.17);
        box-shadow: inset 0 0 0 1px rgba(210, 227, 255, 0.08);
    }

    .bible-ambient-page .reader-top .toggle-control::before { width: 14px; height: 14px; }
    .bible-ambient-page .reader-top .toggle-control.is-on { background: #91c7f2; }
    .bible-ambient-page .reader-top .toggle-control.is-on::before { transform: translateX(14px); }

    .bible-ambient-page .reader-top :is(button, input, select):focus-visible {
        outline: 2px solid #aad8ff;
        outline-offset: 2px;
        border-color: rgba(170, 216, 255, 0.55);
    }
}

@media (min-width: 960px) {
    .bible-ambient-page .reader-top .settings-panel {
        align-self: stretch;
        background: transparent;
        border: 0;
        border-left: 1px solid rgba(210, 227, 255, 0.10);
        border-radius: 0;
        box-shadow: none;
        padding: 0 0 0 12px;
        row-gap: 6px;
    }
}

@media (min-width: 821px) and (max-width: 959px) {
    .bible-ambient-page .reader-top .mobile-reference-row {
        grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) 36px;
    }

    .bible-ambient-page .reader-top #settingsToggle {
        width: 36px;
        padding: 0;
    }
}

@media (min-width: 821px) and (pointer: coarse) {
    .bible-ambient-page .reader-top :is(.scripture-input, .scripture-select, .reader-button, .plain-button) {
        min-height: 44px;
        height: 44px;
        font-size: 16px;
    }

    .bible-ambient-page .reader-top .search-row {
        grid-template-columns: minmax(0, 1fr) 44px 74px;
    }
}

@media (min-width: 821px) and (max-width: 959px) and (pointer: coarse) {
    .bible-ambient-page .reader-top .mobile-reference-row {
        grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) 44px;
    }

    .bible-ambient-page .reader-top #settingsToggle { width: 44px; }
}

@media (prefers-reduced-motion: reduce) {
    #mobileReaderPanel .mobile-reader-panel-shell,
    #mobileNumberPicker .mobile-number-picker-sheet { animation: none; }
}

/* ===== Rediseño 2026-09: resultados, ejemplos y barra flotante ===== */
.bible-ambient-page {
    --glass-fill: linear-gradient(150deg, rgba(34, 46, 66, 0.62), rgba(10, 14, 23, 0.72));
    --glass-line: rgba(210, 227, 255, 0.14);
    --glass-ink: #eef3fb;
    --glass-muted: #9eacc0;
    --glass-accent: #aed7fa;
}

/* Resultados de búsqueda como tarjetas de vidrio */
.bible-ambient-page .search-results {
    box-sizing: border-box;
    display: block;
    padding: 0 10px 12px;
    background: var(--glass-fill);
    border: 1px solid var(--glass-line);
    border-radius: 22px;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.40), inset 0 1px 0 rgba(231, 242, 255, 0.08);
    -webkit-backdrop-filter: blur(26px) saturate(1.3);
    backdrop-filter: blur(26px) saturate(1.3);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    scrollbar-width: thin;
    scrollbar-color: rgba(174, 215, 250, 0.25) transparent;
}

.bible-ambient-page .results-bar {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 -10px 8px;
    padding: 12px 10px 10px 16px;
    background: linear-gradient(rgba(22, 30, 44, 0.96), rgba(22, 30, 44, 0.82));
    border-bottom: 1px solid var(--glass-line);
    border-radius: 22px 22px 0 0;
}

.bible-ambient-page .results-bar .results-heading {
    margin: 0;
    color: var(--glass-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: none;
    line-height: 1.35;
}

.bible-ambient-page .results-close {
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid var(--glass-line);
    border-radius: 50%;
    background: rgba(233, 241, 255, 0.06);
    color: #cad7e7;
    cursor: pointer;
}

.bible-ambient-page .results-close svg { width: 15px; height: 15px; }
.bible-ambient-page .results-close:hover { background: rgba(233, 241, 255, 0.12); }

.bible-ambient-page .result-list {
    display: grid;
    gap: 6px;
}

.bible-ambient-page .result-button {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    background: rgba(214, 230, 253, 0.045);
    border: 1px solid rgba(210, 227, 255, 0.09);
    border-radius: 14px;
    text-align: left;
    transition: background 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.bible-ambient-page .result-button:hover,
.bible-ambient-page .result-button:focus-visible {
    background: rgba(174, 215, 250, 0.10);
    border-color: rgba(174, 215, 250, 0.38);
    transform: none;
}

.bible-ambient-page .result-button:active { transform: scale(0.99); }

.bible-ambient-page .result-button .result-ref {
    margin-bottom: 4px;
    color: #9fd0ff;
    font-size: 12.5px;
    font-weight: 650;
    letter-spacing: 0.01em;
}

.bible-ambient-page .result-button .result-text {
    color: #dfe6f1;
    font-size: 14px;
    line-height: 1.5;
}

.bible-ambient-page .result-button.words-of-jesus-result .result-ref,
.bible-ambient-page .result-button.words-of-jesus-result .result-text { color: var(--reader-jesus, #f4c26b); }

.bible-ambient-page .result-text mark {
    background: rgba(174, 215, 250, 0.20);
    box-shadow: inset 0 -1.5px 0 rgba(174, 215, 250, 0.75);
    border-radius: 4px;
    color: #fff;
    padding: 0 2px;
}

.bible-ambient-page .results-more {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    width: 100%;
    margin-top: 10px;
    padding: 12px;
    border: 1px solid rgba(174, 215, 250, 0.30);
    border-radius: 14px;
    background: rgba(174, 215, 250, 0.10);
    color: #d5edff;
    font: 600 14px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    cursor: pointer;
}

.bible-ambient-page .results-more span {
    color: var(--glass-muted);
    font-size: 12px;
    font-weight: 500;
}

.bible-ambient-page .results-more:hover { background: rgba(174, 215, 250, 0.16); }

/* Mensaje cuando no hay resultados */
.bible-ambient-page .search-results.search-results--empty { padding-bottom: 6px; }

.bible-ambient-page .search-empty { padding: 8px 8px 12px; }

.bible-ambient-page .search-empty-title {
    color: var(--glass-ink);
    font-size: 17px;
    font-weight: 650;
    letter-spacing: -0.01em;
}

.bible-ambient-page .search-empty-detail { color: var(--glass-muted); font-size: 14px; }

.bible-ambient-page .search-empty-tips {
    border-top-color: var(--glass-line);
    color: #b9c5d6;
    font-size: 13.5px;
}

.bible-ambient-page .search-empty-tips li::marker { color: var(--glass-accent); }

@media (max-width: 820px) {
    #mobileReaderPanel .mobile-reader-panel-shell {
        background: var(--glass-fill);
        border-color: var(--glass-line);
        border-radius: 26px;
        padding: 18px;
        -webkit-backdrop-filter: blur(30px) saturate(1.4);
        backdrop-filter: blur(30px) saturate(1.4);
        box-shadow: 0 26px 70px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(231, 242, 255, 0.12);
    }

    #mobileReaderPanel .mobile-reader-panel-header {
        align-items: center;
        margin-bottom: 14px;
    }

    #mobileReaderPanel .mobile-reader-panel-header strong { font-size: 20px; }
    #mobileReaderPanel .mobile-panel-description { margin-top: 4px; }

    #mobileReaderPanel .mobile-panel-close {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
    }

    #mobileReaderPanel #searchInput,
    #mobileReaderPanel #searchButton { height: 50px; min-height: 50px; }

    #mobileReaderPanel #searchInput:focus {
        border-color: rgba(174, 215, 250, 0.55);
        box-shadow: 0 0 0 3px rgba(174, 215, 250, 0.14);
        outline: none;
    }

    #mobileReaderPanel .mobile-reference-row {
        margin-top: 16px;
        padding-top: 14px;
        gap: 10px;
    }

    #mobileReaderPanel .mobile-reference-row::before {
        content: "Ir a un pasaje";
        grid-column: 1 / -1;
        color: var(--glass-accent);
        font-size: 11px;
        font-weight: 650;
        letter-spacing: 0.12em;
        text-transform: uppercase;
    }

    #mobileReaderPanel .mobile-number-trigger { min-height: 46px; padding-top: 11px; padding-bottom: 11px; }

    /* Barra flotante: vidrio más limpio y se esconde al bajar */
    .bible-ambient-page .reader-toolbar-controls,
    .bible-ambient-page .reader-context-capsule {
        background: rgba(14, 20, 32, 0.42);
        border: 1px solid rgba(210, 227, 255, 0.16);
        box-shadow: 0 14px 36px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(231, 242, 255, 0.12);
        -webkit-backdrop-filter: blur(20px) saturate(1.5);
        backdrop-filter: blur(20px) saturate(1.5);
    }

    .bible-ambient-page .reader-context-capsule {
        min-height: 52px;
        border-radius: 999px;
        color: #dce9f8;
        font-weight: 600;
    }

    .bible-ambient-page .mobile-reader-float #readerFloatButton {
        background: rgba(174, 215, 250, 0.16);
        color: #d5edff;
    }

    .bible-ambient-page .mobile-reader-float {
        bottom: max(12px, env(safe-area-inset-bottom, 0px));
    }

    /* Resultados: hoja fija entre el menú y la barra flotante */
    .bible-ambient-page .search-results {
        position: fixed;
        top: calc(env(safe-area-inset-top, 0px) + 66px);
        left: 10px;
        right: 10px;
        bottom: calc(max(12px, env(safe-area-inset-bottom, 0px)) + 66px);
        z-index: 240;
        width: auto;
        height: auto;
        max-height: none;
        margin: 0 auto;
        max-width: 560px;
        animation: bible-panel-enter 240ms cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .bible-ambient-page .search-results.search-results--empty { bottom: auto; }

    /* La animación de entrada deja un transform que rompería el position: fixed. */
    .bible-ambient-page .reader-grid.fade-in-up { animation: none; opacity: 1; transform: none; }

    .bible-ambient-page .result-button .result-text { font-size: 14px; }

    /* Espacio para que la barra no tape el último versículo */
    .bible-ambient-page .passage-reader {
        padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px));
    }
}

@media (min-width: 821px) {
    /* Barra de búsqueda de escritorio con el mismo vidrio que el celular */
    .bible-ambient-page .reader-top .reader-controls {
        background: var(--glass-fill);
        border-color: var(--glass-line);
        border-radius: 22px;
        padding: 10px;
        box-shadow: 0 22px 60px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(231, 242, 255, 0.10);
        -webkit-backdrop-filter: blur(26px) saturate(1.3);
        backdrop-filter: blur(26px) saturate(1.3);
    }

    .bible-ambient-page .reader-top .scripture-input:focus {
        border-color: rgba(174, 215, 250, 0.55);
        box-shadow: 0 0 0 3px rgba(174, 215, 250, 0.14);
        outline: none;
    }

    .bible-ambient-page .reader-top .scripture-select:hover,
    .bible-ambient-page .reader-top .scripture-input:hover { border-color: rgba(210, 227, 255, 0.26); }

    .bible-ambient-page .result-button .result-text {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
        font-size: 14.5px;
    }

    .bible-ambient-page .search-results.search-results--empty { align-self: start; }
}

/* Escritorio: el texto y los resultados comparten el mismo alto, y el
   desvanecido es corto para que el versículo no se pierda antes de tiempo. */
@media (min-width: 960px) {
    .bible-ambient-page .passage-reader {
        height: var(--reader-fit-height, min(50rem, calc(100vh - 12.2rem)));
    }
}

@media (min-width: 821px) {
    .bible-ambient-page :is(.focus-stack, .comparison-stack) {
        -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%);
        mask-image: linear-gradient(to bottom, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%);
    }

    .bible-ambient-page :is(.focus-stack, .comparison-stack).at-top {
        -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 calc(100% - 44px), transparent 100%);
        mask-image: linear-gradient(to bottom, #000 0, #000 calc(100% - 44px), transparent 100%);
    }

    .bible-ambient-page :is(.focus-stack, .comparison-stack).at-bottom {
        -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 44px, #000 100%);
        mask-image: linear-gradient(to bottom, transparent 0, #000 44px, #000 100%);
    }

    .bible-ambient-page :is(.focus-stack, .comparison-stack).at-top.at-bottom {
        -webkit-mask-image: none;
        mask-image: none;
    }
}

/* El panel de búsqueda va arriba, no pegado al borde de abajo, para que quede
   cerca del pulgar sin tapar el versículo que se está leyendo. */
@media (max-width: 820px) {
    /* Centrado entre el título y la barra de abajo. */
    #mobileReaderPanel {
        top: calc(env(safe-area-inset-top, 0px) + 58px);
        bottom: calc(var(--bible-keyboard-offset, 0px) + max(12px, env(safe-area-inset-bottom, 0px)) + 66px);
        display: grid;
        align-content: center;
    }

    /* Con display en la regla de arriba (más peso que .mobile-reader-panel[hidden])
       hay que repetir aquí que cerrado no se ve. */
    #mobileReaderPanel[hidden] { display: none; }

    #mobileReaderPanel .mobile-reader-panel-shell {
        max-height: 100%;
    }
}

@media (max-width: 820px) {
    /* La zona vacía del panel cierra al tocarla. */
    #mobileReaderPanel { cursor: pointer; }
    #mobileReaderPanel .mobile-reader-panel-shell { cursor: auto; }
}

/* ===== Un versículo en todas las versiones ===== */
.all-versions-dialog {
    box-sizing: border-box;
    width: min(620px, calc(100vw - 24px));
    max-height: min(82vh, var(--bible-visible-height, 100dvh));
    margin: auto;
    padding: 0;
    border: 1px solid var(--glass-line, rgba(210, 227, 255, 0.14));
    border-radius: 24px;
    background: var(--glass-fill, linear-gradient(150deg, rgba(32, 43, 62, 0.94), rgba(10, 14, 23, 0.96)));
    color: #eef3fb;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.50);
    -webkit-backdrop-filter: blur(28px) saturate(1.35);
    backdrop-filter: blur(28px) saturate(1.35);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    overflow: hidden;
}

.all-versions-dialog::backdrop {
    background: rgba(0, 0, 0, 0.55);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}

.all-versions-dialog:not([open]) { display: none; }

.all-versions-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 18px 14px;
    border-bottom: 1px solid var(--glass-line, rgba(210, 227, 255, 0.14));
}

.all-versions-kicker {
    margin: 0 0 4px;
    color: #92c7f4;
    font-size: 10.5px;
    font-weight: 650;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.all-versions-head strong {
    font-size: 19px;
    font-weight: 650;
    letter-spacing: -0.02em;
}

.all-versions-close {
    flex: 0 0 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--glass-line, rgba(210, 227, 255, 0.14));
    border-radius: 50%;
    background: rgba(233, 241, 255, 0.06);
    color: #cad7e7;
    cursor: pointer;
}

.all-versions-close svg { width: 16px; height: 16px; }

.all-versions-list {
    display: grid;
    gap: 6px;
    max-height: min(68vh, calc(var(--bible-visible-height, 100dvh) - 140px));
    padding: 12px;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(174, 215, 250, 0.25) transparent;
}

.all-versions-item {
    padding: 11px 13px;
    border: 1px solid rgba(210, 227, 255, 0.09);
    border-radius: 14px;
    background: rgba(214, 230, 253, 0.045);
}

.all-versions-name {
    margin: 0 0 4px;
    color: #9fd0ff;
    font-size: 12px;
    font-weight: 650;
}

.all-versions-text {
    margin: 0;
    color: #dfe6f1;
    font-size: 14.5px;
    line-height: 1.55;
}

.all-versions-text.is-loading { color: #8b9aad; font-style: italic; }
.all-versions-text.words-of-jesus { color: var(--reader-jesus, #f4c26b); }

.all-versions-more {
    width: 100%;
    margin-top: 4px;
    padding: 12px;
    border: 1px solid rgba(174, 215, 250, 0.30);
    border-radius: 14px;
    background: rgba(174, 215, 250, 0.10);
    color: #d5edff;
    font: 600 14px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    cursor: pointer;
}

.all-versions-more:hover { background: rgba(174, 215, 250, 0.16); }

/* ===== Escuchar el capítulo ===== */
.reader-listen .listen-stop { display: none; }
.reader-listen.is-playing .listen-wave { display: none; }
.reader-listen.is-playing .listen-stop { display: block; }

.focus-verse.is-speaking .verse-copy {
    background: linear-gradient(115deg, rgba(174, 215, 250, 0.22), rgba(174, 215, 250, 0.14));
    border-radius: 0.22em;
    box-shadow: -0.1em 0 0 rgba(174, 215, 250, 0.85);
}

.reader-listen-desktop {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--glass-line, rgba(210, 227, 255, 0.14));
    border-radius: 50%;
    background: rgba(214, 230, 253, 0.06);
    color: #d5edff;
    cursor: pointer;
    transition: background 150ms ease;
}

.reader-listen-desktop svg { width: 20px; height: 20px; }
.reader-listen-desktop:hover { background: rgba(174, 215, 250, 0.16); }
.reader-listen-desktop.is-playing { background: rgba(174, 215, 250, 0.22); }

@media (max-width: 820px) {
    /* En el celular el botón vive en la barra flotante. */
    .reader-listen-desktop { display: none; }

    .bible-ambient-page .mobile-reader-float { width: 192px; }
    .bible-ambient-page .mobile-reader-float.has-reading-context { width: calc(192px + 8px + var(--reader-context-width)); }
    .bible-ambient-page .reader-toolbar-controls { flex: 0 0 192px; }
    .bible-ambient-page .reader-context-capsule { max-width: min(220px, calc(100vw - 232px)); }
}

/* ===== Alcance de la búsqueda: toda la Biblia, Antiguo o Nuevo ===== */
.search-scope { display: none; }

.bible-ambient-page .search-scope {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.bible-ambient-page .search-scope-label {
    flex: 0 0 auto;
    margin-right: 2px;
    color: var(--glass-muted, #9eacc0);
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.bible-ambient-page .search-scope button {
    /* Sin esto el texto se parte en varias líneas y la pastilla queda redonda. */
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 6px 11px;
    border: 1px solid var(--glass-line, rgba(210, 227, 255, 0.14));
    border-radius: 999px;
    background: rgba(214, 230, 253, 0.05);
    color: #b9c7d8;
    font: 500 12.5px/1.2 inherit;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.bible-ambient-page .search-scope button[aria-pressed="true"] {
    background: rgba(174, 215, 250, 0.18);
    border-color: rgba(174, 215, 250, 0.45);
    color: #e3f1ff;
}

@media (min-width: 821px) and (max-width: 959px) {
    .bible-ambient-page .reader-top .search-scope { display: none; }
}

/* ===== Reproductor de la lectura en voz alta ===== */
.voz-player {
    /* Sin transform: la animación de entrada vive en la cápsula de dentro, para
       que no pise el centrado. */
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: calc(max(12px, env(safe-area-inset-bottom, 0px)) + 66px);
    z-index: 270;
    width: auto;
    max-width: 440px;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.voz-player-cara {
    animation: bible-panel-enter 220ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.voz-player[hidden] { display: none; }

.voz-player-cara {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px;
    border: 1px solid var(--glass-line, rgba(210, 227, 255, 0.16));
    border-radius: 999px;
    background: linear-gradient(150deg, rgba(34, 46, 66, 0.82), rgba(10, 14, 23, 0.88));
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(231, 242, 255, 0.10);
    -webkit-backdrop-filter: blur(24px) saturate(1.4);
    backdrop-filter: blur(24px) saturate(1.4);
}

.voz-player .voz-boton {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    color: #e3f1ff;
    cursor: pointer;
    transition: background 150ms ease, transform 150ms ease;
}

.voz-player .voz-boton:hover { background: rgba(174, 215, 250, 0.20); }
.voz-player .voz-boton:active { transform: scale(0.94); }
.voz-player .voz-boton svg { width: 17px; height: 17px; }

.voz-player .voz-boton-grande {
    width: 44px;
    height: 44px;
    background: rgba(174, 215, 250, 0.20);
}

.voz-player .voz-boton-grande svg { width: 19px; height: 19px; }
.voz-player .voz-icono-seguir { display: none; }
.voz-player.esta-en-pausa .voz-icono-pausa { display: none; }
.voz-player.esta-en-pausa .voz-icono-seguir { display: block; }

.voz-info {
    display: grid;
    flex: 1 1 auto;
    min-width: 0;
    padding: 0 6px;
}

.voz-referencia {
    color: #eef3fb;
    font-size: 13.5px;
    font-weight: 650;
    letter-spacing: -0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.voz-ayuda {
    color: var(--glass-muted, #9eacc0);
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.voz-player .voz-velocidad {
    width: auto;
    min-width: 42px;
    padding: 0 10px;
    border-radius: 999px;
    font: 600 12.5px/1 inherit;
    font-variant-numeric: tabular-nums;
}

/* Mientras lee, los versículos invitan a tocarse para saltar ahí. */
#passageBody.esta-leyendo .focus-verse.chapter-verse { cursor: pointer; }

@media (max-width: 420px) {
    .voz-ayuda { display: none; }
}

@media (max-width: 420px) {
    .voz-player { left: 8px; right: 8px; }
    .voz-player-cara { gap: 2px; padding: 5px; }
    .voz-player .voz-boton { width: 34px; height: 34px; }
    .voz-player .voz-boton-grande { width: 40px; height: 40px; }
    .voz-player .voz-velocidad { min-width: 38px; padding: 0 7px; font-size: 12px; }
    .voz-info { padding: 0 4px; }
    .voz-referencia { font-size: 12.5px; }
}

@media (min-width: 821px) {
    /* El alcance ocupa todo el ancho de la barra, no la columna angosta del
       buscador, para que las tres pastillas quepan en una línea. */
    .bible-ambient-page .reader-top .search-scope {
        grid-column: 1 / -1;
    }

    .bible-ambient-page .reader-top .search-scope { margin-top: 6px; }
}