/*
 * Bookyhe — affinamento grafico (ottobre 2026)
 *
 * Questo file viene caricato DOPO style.css e ne rifinisce l'aspetto: stessa identità
 * (verde petrolio, carta calda, titoli con le grazie) ma superfici piene, bordi sottili,
 * pulsanti e campi uniformi, intestazioni compatte.
 *
 * Come vince sulle regole precedenti: ogni selettore parte da `html:not(#_)`, che vale
 * come un id e quindi supera qualsiasi regola a classi di style.css. !important compare solo
 * nei pochi punti in cui style.css lo usa a sua volta (scheda al passaggio del mouse, avvisi).
 * Le regole valgono per le pagine dell'app (classe app-ui-2026 su <html>) e per libreria
 * condivisa, pagine legali e AppManager (classe bk-refined): entrambe le classi sono messe da
 * elements/elements.php. La modalità Show resta esclusa e conserva il suo aspetto scuro.
 * La sezione 3 contiene tutto lo stile della barra di navigazione (script/menu.php), che in
 * style.css non esiste: questo file è quindi necessario, non un'aggiunta facoltativa.
 */

/* ------------------------------------------------------------------ */
/* 1. Valori di base                                                   */
/* ------------------------------------------------------------------ */

html:not(#_) {
    --bk-bg: #f6f3ec;
    --bk-surface: #ffffff;
    --bk-surface-2: #faf8f3;
    --bk-surface-3: #f2eee5;
    --bk-line: #e7e1d5;
    --bk-line-strong: #d8d1c2;
    --bk-ink: #14292d;
    --bk-ink-2: #4b6062;
    --bk-ink-3: #7d8c8b;
    --bk-brand: #14605a;
    --bk-brand-strong: #0e4944;
    --bk-brand-tint: #e3f0ed;
    --bk-deep: #0b3a40;
    --bk-deep-2: #105250;
    --bk-accent: #c56f2c;
    --bk-accent-tint: #fbeede;
    --bk-amber: #8a5a10;
    --bk-amber-tint: #fbf1dc;
    --bk-amber-line: #ecd9ae;
    --bk-danger: #ad3f35;
    --bk-danger-tint: #fbeae7;
    --bk-danger-line: #f0cbc5;
    --bk-success: #2b7556;
    --bk-success-tint: #e5f3ec;
    --bk-radius-lg: 20px;
    --bk-radius-md: 14px;
    --bk-radius-sm: 10px;
    --bk-shadow-1: 0 1px 2px rgba(20, 41, 45, 0.05);
    --bk-shadow-2: 0 10px 28px rgba(20, 41, 45, 0.09);
    --bk-shadow-3: 0 20px 50px rgba(20, 41, 45, 0.16);
    --bk-font: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --bk-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --bk-ring: 0 0 0 3px rgba(20, 96, 90, 0.2);
}

/* ------------------------------------------------------------------ */
/* 2. Fondo e larghezze                                                */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) {
    color: var(--bk-ink);
    background: var(--bk-bg);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page)::before,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .ambient-background {
    display: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .container.app-shell {
    width: min(1200px, calc(100vw - 2rem));
    max-width: none;
    padding: 1.5rem 0 2.5rem;
}

/* ------------------------------------------------------------------ */
/* 3. Barra di navigazione                                             */
/* ------------------------------------------------------------------ */

.app-topbar {
    position: sticky;
    top: 0;
    z-index: 2600;
    border-bottom: 1px solid var(--bk-line);
    background: rgba(255, 255, 255, 0.94);
    -webkit-backdrop-filter: saturate(1.4) blur(14px);
    backdrop-filter: saturate(1.4) blur(14px);
}

.app-topbar-inner {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: min(1200px, calc(100vw - 2rem));
    min-height: 64px;
    margin: 0 auto;
}

.app-topbar-brand {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
}

.app-topbar-brand img {
    display: block;
    width: auto;
    height: 30px;
}

.app-topbar-context {
    display: inline-flex;
    flex: 0 1 auto;
    align-items: center;
    gap: 0.4rem;
    max-width: 170px;
    min-width: 0;
    height: 32px;
    padding: 0 0.7rem;
    border: 1px solid #c4ddd7;
    border-radius: 999px;
    color: var(--bk-brand-strong);
    font: 600 0.78rem/1 var(--bk-font);
    text-decoration: none;
    white-space: nowrap;
    background: var(--bk-brand-tint);
}

.app-topbar-context:hover {
    border-color: #a9cdc5;
    color: var(--bk-brand-strong);
    text-decoration: none;
}

.app-topbar-context > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Con lo spazio famiglia in vista resta solo l'iniziale dell'utente: le voci del menu devono starci tutte. */
.app-topbar-context ~ .app-topbar-nav .app-user-name {
    display: none;
}

.app-topbar-nav {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.app-nav-main {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 0.125rem;
    min-width: 0;
}

.app-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    height: 38px;
    padding: 0 0.7rem;
    border: 0;
    border-radius: 10px;
    color: var(--bk-ink-2);
    font: 600 0.875rem/1 var(--bk-font);
    white-space: nowrap;
    text-decoration: none;
    background: transparent;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.app-nav-link > .bi:first-child {
    display: none;
}

.app-nav-link:hover,
.app-nav-link:focus-visible,
.menu-dropdown-group.is-open > .app-nav-link {
    color: var(--bk-ink);
    text-decoration: none;
    background: var(--bk-surface-3);
}

.app-nav-link.is-current {
    color: var(--bk-brand-strong);
    background: var(--bk-brand-tint);
}

.app-nav-link:focus-visible,
.app-nav-cta:focus-visible,
.app-user-trigger:focus-visible,
.app-lang-option:focus-visible,
.app-nav-menu-item:focus-visible,
.app-topbar-toggle:focus-visible {
    outline: 0;
    box-shadow: var(--bk-ring);
}

.app-nav-caret {
    font-size: 0.68rem;
    opacity: 0.7;
    transition: transform 0.15s ease;
}

.menu-dropdown-group.is-open .app-nav-caret {
    transform: rotate(180deg);
}

.app-nav-group {
    position: relative;
}

.app-nav-menu {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    z-index: 30;
    display: none;
    min-width: 236px;
    padding: 0.4rem;
    border: 1px solid var(--bk-line);
    border-radius: var(--bk-radius-md);
    background: var(--bk-surface);
    box-shadow: var(--bk-shadow-3);
}

.app-nav-menu.show {
    display: block;
}

.app-nav-menu-end {
    right: 0;
    left: auto;
}

.app-nav-menu-title {
    display: none;
    margin: 0;
    padding: 0.4rem 0.65rem 0.3rem;
    color: var(--bk-ink-3);
    font: 700 0.68rem/1.2 var(--bk-font);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.app-user-group .app-nav-menu-title {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-nav-menu-item[hidden] {
    display: none;
}

.app-nav-menu-item {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    min-height: 40px;
    padding: 0.45rem 0.65rem;
    border: 0;
    border-radius: 9px;
    color: var(--bk-ink);
    font: 500 0.9rem/1.2 var(--bk-font);
    text-align: left;
    text-decoration: none;
    background: transparent;
    cursor: pointer;
}

.app-nav-menu-item > .bi {
    flex: 0 0 1.15rem;
    color: var(--bk-ink-3);
    font-size: 1rem;
    text-align: center;
}

.app-nav-menu-item > span:not(.app-nav-count) {
    flex: 1 1 auto;
    min-width: 0;
}

.app-nav-menu-item:hover,
.app-nav-menu-item:focus-visible {
    color: var(--bk-ink);
    text-decoration: none;
    background: var(--bk-surface-3);
}

.app-nav-menu-item.is-current {
    color: var(--bk-brand-strong);
    background: var(--bk-brand-tint);
}

.app-nav-menu-item.is-current > .bi {
    color: var(--bk-brand);
}

.app-nav-menu-item-exit {
    margin-top: 0.3rem;
    border-top: 1px solid var(--bk-line);
    border-radius: 0 0 9px 9px;
    padding-top: 0.65rem;
}

.app-nav-count {
    flex: 0 0 auto;
    min-width: 1.7rem;
    padding: 0.18rem 0.45rem;
    border-radius: 999px;
    color: var(--bk-ink-2);
    font: 700 0.72rem/1.1 var(--bk-font);
    text-align: center;
    background: var(--bk-surface-3);
}

.app-nav-side {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.6rem;
    margin-left: auto;
}

.app-nav-cta {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    height: 38px;
    padding: 0 0.95rem;
    border-radius: 10px;
    color: #fff;
    font: 700 0.875rem/1 var(--bk-font);
    text-decoration: none;
    background: var(--bk-brand);
    transition: background-color 0.15s ease;
}

.app-nav-cta:hover,
.app-nav-cta.is-current {
    color: #fff;
    text-decoration: none;
    background: var(--bk-brand-strong);
}

.app-lang-switch {
    display: inline-flex;
    padding: 3px;
    border: 1px solid var(--bk-line);
    border-radius: 10px;
    background: var(--bk-surface-3);
}

.app-lang-switch.is-busy {
    opacity: 0.55;
    pointer-events: none;
}

.app-lang-option {
    min-width: 34px;
    height: 28px;
    padding: 0 0.5rem;
    border: 0;
    border-radius: 7px;
    color: var(--bk-ink-3);
    font: 700 0.72rem/1 var(--bk-font);
    letter-spacing: 0.04em;
    background: transparent;
    cursor: pointer;
}

.app-lang-option.is-active {
    color: var(--bk-ink);
    background: var(--bk-surface);
    box-shadow: 0 1px 2px rgba(20, 41, 45, 0.14);
    cursor: default;
}

.app-user-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    height: 40px;
    padding: 0 0.6rem 0 0.25rem;
    border: 1px solid var(--bk-line);
    border-radius: 999px;
    color: var(--bk-ink);
    font: 600 0.85rem/1 var(--bk-font);
    background: var(--bk-surface);
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.app-user-trigger:hover,
.menu-dropdown-group.is-open > .app-user-trigger,
.app-user-trigger.is-current {
    border-color: var(--bk-line-strong);
    background: var(--bk-surface-2);
}

.app-user-avatar {
    display: grid;
    flex: 0 0 30px;
    place-items: center;
    width: 30px;
    height: 30px;
    overflow: hidden;
    border-radius: 50%;
    color: #fff;
    font: 700 0.85rem/1 var(--bk-font);
    background: var(--bk-brand);
}

.app-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.app-user-name {
    max-width: 8.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-topbar-toggle {
    display: none;
}

@media (max-width: 1399px) {
    .app-user-name {
        display: none;
    }

    .app-topbar-context {
        max-width: 150px;
    }

    .app-user-trigger {
        padding-right: 0.5rem;
    }
}

@media (max-width: 1279px) {
    .app-topbar-inner {
        min-height: 60px;
    }

    .app-topbar-context {
        flex: 0 1 auto;
        max-width: none;
        margin-left: auto;
    }

    .app-topbar-context + .app-topbar-toggle {
        margin-left: 0;
    }

    .app-topbar-toggle {
        display: inline-grid;
        flex: 0 0 44px;
        place-items: center;
        width: 44px;
        height: 44px;
        margin-left: auto;
        border: 1px solid var(--bk-line);
        border-radius: 12px;
        color: var(--bk-ink);
        font-size: 1.4rem;
        background: var(--bk-surface);
        cursor: pointer;
    }

    .app-topbar-nav {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0.9rem;
        height: calc(100vh - 60px);
        height: calc(100dvh - 60px);
        padding: 1rem 1rem 5rem;
        overflow-y: auto;
        border-top: 1px solid var(--bk-line);
        background: var(--bk-bg);
    }

    .app-topbar.is-open .app-topbar-nav {
        display: flex;
    }

    .app-nav-main,
    .app-nav-side {
        display: contents;
    }

    /* Il pannello scorre: le voci tengono la loro altezza invece di schiacciarsi. */
    .app-topbar-nav > *,
    .app-nav-main > *,
    .app-nav-side > * {
        flex: 0 0 auto;
    }

    .app-nav-cta {
        order: -1;
        justify-content: center;
        height: 48px;
        border-radius: 12px;
        font-size: 1rem;
    }

    .app-nav-link {
        justify-content: flex-start;
        height: 50px;
        padding: 0 0.9rem;
        border: 1px solid var(--bk-line);
        border-radius: 12px;
        color: var(--bk-ink);
        font-size: 1rem;
        background: var(--bk-surface);
    }

    .app-nav-link > .bi:first-child {
        display: inline-block;
        flex: 0 0 1.4rem;
        color: var(--bk-brand);
        font-size: 1.1rem;
        text-align: center;
    }

    .app-nav-link.is-current {
        border-color: #c4ddd7;
    }

    .app-nav-trigger {
        display: none;
    }

    .app-nav-group {
        position: static;
    }

    .app-nav-menu,
    .app-nav-menu-end {
        position: static;
        display: block;
        min-width: 0;
        padding: 0.5rem;
        border-radius: 12px;
        box-shadow: none;
    }

    .app-nav-menu-title {
        display: block;
    }

    .app-nav-menu-item {
        min-height: 46px;
        font-size: 0.98rem;
    }

    .app-lang-switch {
        order: 5;
        align-self: flex-start;
    }

    .app-lang-option {
        min-width: 52px;
        height: 36px;
        font-size: 0.8rem;
    }

    .app-user-group {
        order: 6;
    }

    .app-user-trigger {
        display: none;
    }
}

/* ------------------------------------------------------------------ */
/* 4. Titoli e testi                                                   */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) .hero-eyebrow {
    margin-bottom: 0.45rem;
    color: var(--bk-accent);
    font: 700 0.68rem/1.4 var(--bk-font);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-title {
    margin: 0;
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: clamp(1.55rem, 2.1vw, 1.95rem);
    font-weight: 600;
    line-height: 1.12;
    letter-spacing: -0.01em;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-shell .page-title {
    margin: 0;
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: clamp(1.9rem, 3vw, 2.5rem);
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -0.015em;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-shell .page-summary {
    max-width: 70ch;
    margin: 0;
    color: var(--bk-ink-2);
    font-size: 0.97rem;
    line-height: 1.6;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-description {
    margin: 0;
    color: var(--bk-ink-2);
    font-size: 0.9rem;
    line-height: 1.6;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .field-note {
    color: var(--bk-ink-3);
    font-size: 0.8rem;
    line-height: 1.5;
}

/* ------------------------------------------------------------------ */
/* 5. Intestazione di pagina                                           */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero {
    margin-top: 0;
    border: 0;
    border-radius: var(--bk-radius-lg);
    color: #eef7f4;
    background: linear-gradient(120deg, var(--bk-deep) 0%, var(--bk-deep-2) 100%);
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero::before,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero::after {
    display: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.library-page):not(.show-page) .app-page-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.25rem 2rem;
    min-height: 0;
    padding: 2rem 2.25rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.library-page):not(.show-page) .app-page-hero > *:first-child {
    flex: 1 1 26rem;
    min-width: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero .hero-eyebrow {
    color: #eeb07c;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero .page-title {
    max-width: 22ch;
    margin: 0 0 0.6rem;
    color: #fff;
    font-family: var(--bk-serif);
    font-size: clamp(2rem, 3.2vw, 2.7rem);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.015em;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero .page-summary {
    max-width: 64ch;
    margin: 0;
    color: rgba(238, 247, 244, 0.8);
    font-size: 0.97rem;
    line-height: 1.6;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.library-page):not(.show-page) .app-page-actions {
    display: flex;
    flex: 0 0 auto;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.6rem;
    width: auto;
}

/* Pulsanti sopra il fondo scuro dell'intestazione. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero .btn {
    width: auto;
    min-width: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.book-hero, .sticky-summary, .pricing-card-current) .btn-primary {
    border-color: #f5eee2;
    color: var(--bk-deep);
    background: #f5eee2;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.book-hero, .sticky-summary, .pricing-card-current) .btn-primary:hover {
    border-color: #fff;
    color: var(--bk-deep);
    background: #fff;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.book-hero, .sticky-summary, .pricing-card-current) :is(.btn-light, .btn-secondary, .btn-warning, .btn-success) {
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.book-hero, .sticky-summary, .pricing-card-current) :is(.btn-light, .btn-secondary, .btn-warning, .btn-success):hover {
    border-color: rgba(255, 255, 255, 0.55);
    color: #fff;
    background: rgba(255, 255, 255, 0.16);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-hero .tag-chip {
    border-color: rgba(255, 255, 255, 0.22);
    color: rgba(238, 247, 244, 0.92);
    background: rgba(255, 255, 255, 0.1);
}

/* Home della libreria: stessa intestazione, con numeri e copertine. */
html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-dashboard-hero {
    grid-template-columns: minmax(0, 1fr) minmax(260px, 330px);
    align-items: center;
    gap: 2rem;
    min-height: 0;
    padding: 2.5rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-dashboard-hero .page-title {
    display: block;
    max-width: 14ch;
    font-size: clamp(2.3rem, 4vw, 3.3rem);
    line-height: 1;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .hero-library-stats {
    gap: 0.6rem;
    margin-top: 1.5rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .hero-library-stats > span {
    min-height: 64px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--bk-radius-md);
    background: rgba(255, 255, 255, 0.07);
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-cover-card {
    border-width: 3px;
    border-radius: 8px 12px 12px 8px;
    box-shadow: -8px 16px 30px rgba(1, 18, 27, 0.4);
}

/* ------------------------------------------------------------------ */
/* 6. Sezioni e pannelli                                               */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-shell {
    margin-top: 1rem;
    padding: 1.75rem;
    border: 1px solid var(--bk-line);
    border-radius: var(--bk-radius-lg);
    background: var(--bk-surface);
    box-shadow: var(--bk-shadow-1);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-shell::before,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-shell::after {
    display: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.5rem 2rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1.1rem;
    border-bottom: 1px solid var(--bk-line);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-heading > *:first-child {
    flex: 1 1 15rem;
    min-width: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-heading > .section-description {
    flex: 0 1 26rem;
    min-width: min(100%, 14rem);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .soft-panel:not(.sticky-summary):not(.pricing-card-current) {
    border: 1px solid var(--bk-line);
    border-radius: var(--bk-radius-md);
    background: var(--bk-surface-2);
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .soft-panel::before,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .soft-panel::after {
    display: none;
}

/* Pannelli scuri rimasti (riepilogo del Trasloco, piano attivo nello Shop). */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) {
    border: 0;
    border-radius: var(--bk-radius-md);
    background: linear-gradient(140deg, var(--bk-deep) 0%, var(--bk-deep-2) 100%);
    box-shadow: none;
}

/* ------------------------------------------------------------------ */
/* 7. Pulsanti                                                         */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 42px;
    padding: 0.5rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--bk-radius-sm);
    font: 600 0.875rem/1.2 var(--bk-font);
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
    background-image: none;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn:hover,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn:active {
    transform: none;
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn:focus,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn:focus-visible {
    outline: 0;
    box-shadow: var(--bk-ring);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-sm {
    min-height: 34px;
    padding: 0.3rem 0.75rem;
    border-radius: 8px;
    font-size: 0.8125rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-primary {
    border-color: var(--bk-brand);
    color: #fff;
    background-color: var(--bk-brand);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-primary:hover,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-primary:active {
    border-color: var(--bk-brand-strong);
    color: #fff;
    background-color: var(--bk-brand-strong);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.btn-light, .btn-secondary, .btn-warning, .btn-success, .btn-info, .btn-outline-primary, .btn-outline-secondary) {
    border-color: var(--bk-line-strong);
    color: var(--bk-ink);
    background-color: var(--bk-surface);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.btn-light, .btn-secondary, .btn-warning, .btn-success, .btn-info, .btn-outline-primary, .btn-outline-secondary):hover {
    border-color: #c6bead;
    color: var(--bk-ink);
    background-color: var(--bk-surface-2);
}

/* Il pulsante che invia un modulo resta quello principale, anche se nel codice ha un'altra variante. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) button[type="submit"]:is(.btn-warning, .btn-success, .btn-info) {
    border-color: var(--bk-brand);
    color: #fff;
    background-color: var(--bk-brand);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) button[type="submit"]:is(.btn-warning, .btn-success, .btn-info):hover {
    border-color: var(--bk-brand-strong);
    color: #fff;
    background-color: var(--bk-brand-strong);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-danger {
    border-color: var(--bk-danger-line);
    color: var(--bk-danger);
    background-color: var(--bk-danger-tint);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-danger:hover {
    border-color: var(--bk-danger);
    color: #fff;
    background-color: var(--bk-danger);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .form-actions button[type="submit"].btn-danger:not(.btn-sm) {
    border-color: var(--bk-danger);
    color: #fff;
    background-color: var(--bk-danger);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .form-actions button[type="submit"].btn-danger:not(.btn-sm):hover {
    border-color: #8f332a;
    background-color: #8f332a;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn.disabled,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn:disabled {
    opacity: 0.5;
    pointer-events: none;
}

/* ------------------------------------------------------------------ */
/* 8. Campi dei moduli                                                 */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .form-control {
    min-height: 44px;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--bk-line-strong);
    border-radius: var(--bk-radius-sm);
    color: var(--bk-ink);
    font: 500 0.94rem/1.4 var(--bk-font);
    background-color: var(--bk-surface);
    box-shadow: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .form-control::placeholder {
    color: #a2adab;
    font-weight: 400;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .form-control:focus {
    border-color: var(--bk-brand);
    box-shadow: var(--bk-ring);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) textarea.form-control {
    min-height: 112px;
    line-height: 1.55;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) select.form-control {
    padding-right: 2.2rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.4 1.2 6 5.8l4.6-4.6' fill='none' stroke='%234b6062' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.85rem center;
    background-size: 12px 8px;
    -webkit-appearance: none;
    appearance: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.form-group, .field-stack, .form-grid, .form-shell) label:not(.checkbox-pill):not(.switch-control):not(.sr-only) {
    display: block;
    margin-bottom: 0.4rem;
    color: var(--bk-ink-2);
    font: 600 0.8125rem/1.35 var(--bk-font);
    letter-spacing: 0;
    text-transform: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .search-input-wrap .form-control {
    padding-left: 2.6rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .form-actions {
    gap: 0.6rem;
}

/* ------------------------------------------------------------------ */
/* 9. Schede dei libri                                                 */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry {
    border: 1px solid var(--bk-line);
    border-radius: 16px;
    background: var(--bk-surface);
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry:hover {
    border-color: var(--bk-line-strong);
    background: var(--bk-surface) !important;
    box-shadow: var(--bk-shadow-2) !important;
    transform: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry > .card-body {
    grid-template-columns: 96px minmax(0, 1fr);
    align-items: start;
    gap: 1.1rem;
    padding: 1.1rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry .cover-image {
    width: 96px;
    height: 142px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(20, 41, 45, 0.12), 0 8px 18px rgba(20, 41, 45, 0.14);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-title {
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.12;
    letter-spacing: -0.005em;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-author {
    margin-top: 0.2rem;
    color: var(--bk-ink-2);
    font-size: 0.85rem;
    font-weight: 500;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-details {
    min-height: 32px;
    padding: 0.25rem 0.65rem;
    border-color: var(--bk-line-strong);
    border-radius: 8px;
    color: var(--bk-ink-2);
    font-size: 0.78rem;
    background-color: var(--bk-surface);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .btn-details:hover {
    border-color: #c6bead;
    color: var(--bk-ink);
    background-color: var(--bk-surface-2);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.book-meta-grid, .book-detail-grid) {
    gap: 0.7rem 1rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry .book-meta-grid {
    margin-top: 0.8rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--bk-line);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .meta-pill {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .meta-label {
    margin-bottom: 0.1rem;
    color: var(--bk-ink-3);
    font: 600 0.68rem/1.4 var(--bk-font);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .meta-value {
    color: var(--bk-ink);
    font: 500 0.875rem/1.4 var(--bk-font);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry-actions {
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-top: 0.9rem;
}

/* Schede delle notizie: titolo leggibile, non gigante. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .news-card {
    border: 1px solid var(--bk-line);
    border-radius: 16px;
    background: var(--bk-surface);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .news-card :is(h2, h3, h4, h5, .card-title) {
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1.18;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

/* Riquadro dei dettagli: i dati su più colonne, le icone sotto. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-collapse > .card {
    display: block;
    padding: 0.95rem 1rem;
    border: 1px solid var(--bk-line);
    border-radius: 12px;
    background: var(--bk-surface-2);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-collapse .book-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 0.7rem 1rem;
    margin: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-collapse .icon-strip {
    display: flex;
    gap: 0.6rem;
    margin-top: 0.8rem;
    padding-top: 0.7rem;
    border-top: 1px solid var(--bk-line);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-collapse .meta-value {
    overflow-wrap: anywhere;
}

/* ------------------------------------------------------------------ */
/* 10. Etichette, numeri, elenchi, avvisi                              */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .tag-chip {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    justify-self: start;
    padding: 0.28rem 0.65rem;
    border: 1px solid var(--bk-line);
    border-radius: 999px;
    color: var(--bk-ink-2);
    font: 600 0.74rem/1.3 var(--bk-font);
    letter-spacing: 0.01em;
    text-transform: none;
    background: var(--bk-surface-3);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .tag-chip-strong {
    border-color: #c4ddd7;
    color: var(--bk-brand-strong);
    background: var(--bk-brand-tint);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .badge {
    padding: 0.25em 0.6em;
    border-radius: 999px;
    font-weight: 700;
    letter-spacing: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .badge-primary {
    color: var(--bk-brand-strong);
    background: var(--bk-brand-tint);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .kpi-card {
    padding: 0.95rem 1rem;
    border: 1px solid var(--bk-line);
    border-radius: var(--bk-radius-md);
    background: var(--bk-surface);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .kpi-card::before,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .kpi-card::after {
    display: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .kpi-label {
    color: var(--bk-ink-3);
    font: 600 0.68rem/1.4 var(--bk-font);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .kpi-value {
    font-family: var(--bk-serif);
    font-weight: 600;
    letter-spacing: -0.01em;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :not(.sticky-summary) > .detail-list > .detail-item {
    padding: 0.7rem 0;
    border: 0;
    border-bottom: 1px solid var(--bk-line);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :not(.sticky-summary) > .detail-list > .detail-item:last-child {
    border-bottom: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .settings-row {
    padding: 1rem 0;
    border: 0;
    border-bottom: 1px solid var(--bk-line);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .settings-row:last-child {
    border-bottom: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .settings-title {
    color: var(--bk-ink);
    font: 700 0.95rem/1.3 var(--bk-font);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .settings-text {
    color: var(--bk-ink-2);
    font-size: 0.85rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .empty-state {
    padding: 2rem 1.5rem;
    border: 1px dashed var(--bk-line-strong);
    border-radius: var(--bk-radius-md);
    color: var(--bk-ink-2);
    background: var(--bk-surface-2);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .empty-state :is(h2, h3) {
    margin-bottom: 0.4rem;
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: 1.45rem;
    font-weight: 600;
    background: none;
    -webkit-text-fill-color: currentColor;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .alert {
    padding: 0.85rem 1rem;
    border: 1px solid var(--bk-line);
    border-radius: 12px;
    color: var(--bk-ink);
    font-size: 0.92rem;
    line-height: 1.5;
    background: var(--bk-surface-2);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .alert-success {
    border-color: #c4e1d2;
    color: #1d5a40;
    background: var(--bk-success-tint);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .alert-warning {
    border-color: var(--bk-amber-line);
    color: #6f4709;
    background: var(--bk-amber-tint);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .alert-danger {
    border-color: var(--bk-danger-line);
    color: #8a3027;
    background: var(--bk-danger-tint);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .alert-info {
    border-color: #c4ddd7;
    color: var(--bk-brand-strong);
    background: var(--bk-brand-tint);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .checkbox-pill {
    border: 1px solid var(--bk-line-strong);
    border-radius: 999px;
    background: var(--bk-surface);
    box-shadow: none;
}

/* Dentro i pannelli scuri testi, numeri ed etichette restano chiari. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) {
    color: #eef7f4;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) :is(h2, h3, h4, strong, .section-title, .kpi-value, .meta-value) {
    color: #fff;
    -webkit-text-fill-color: currentColor;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) :is(p, small, .section-description, .field-note, .kpi-label, .meta-label, .detail-item span) {
    color: rgba(238, 247, 244, 0.78);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) .hero-eyebrow {
    color: #eeb07c;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) .kpi-card {
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.07);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) .detail-item {
    padding: 0.7rem 0;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0;
    background: transparent;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) .detail-item:last-child {
    border-bottom: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.sticky-summary, .pricing-card-current) .tag-chip {
    border-color: rgba(255, 255, 255, 0.22);
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

/* ------------------------------------------------------------------ */
/* 11. Home della libreria: ricerca, letture, catalogo                 */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .reading-resume-card {
    border: 1px solid var(--bk-line);
    border-radius: 16px;
    background: var(--bk-surface);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-catalog-count {
    border: 1px solid var(--bk-line);
    border-radius: 12px;
    background: var(--bk-surface-2);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-tools-disclosure {
    border: 1px solid var(--bk-line);
    border-radius: var(--bk-radius-md);
    background: var(--bk-surface-2);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-pagination {
    border: 0;
    border-top: 1px solid var(--bk-line);
    border-radius: 0;
    padding: 1.25rem 0 0;
    background: transparent;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-search-form {
    gap: 0.6rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-search-form .form-control {
    min-height: 48px;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-search-form .btn {
    min-height: 48px;
    padding-right: 1.25rem;
    padding-left: 1.25rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .reading-resume-footer a {
    color: var(--bk-brand);
    font-weight: 700;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-pagination-pages a {
    border: 1px solid var(--bk-line-strong);
    border-radius: 9px;
    color: var(--bk-ink);
    font-weight: 600;
    background: var(--bk-surface);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-pagination-pages a:is(.is-active, .active, [aria-current="page"]) {
    border-color: var(--bk-brand);
    color: #fff;
    background: var(--bk-brand);
}

/* Moduli: le due colonne partono dall'alto, senza stirare gli spazi. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .field-stack {
    align-content: start;
    gap: 1rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.scanner-disclosure, .library-tools-disclosure, details.soft-panel) {
    border: 1px solid var(--bk-line);
    border-radius: var(--bk-radius-md);
    background: var(--bk-surface-2);
    box-shadow: none;
}

/* Scorciatoie di pagina: elenco discreto a lato, solo quando c'è spazio. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .page-shortcuts {
    display: none;
}

@media (min-width: 1600px) {
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .page-shortcuts {
        top: 7.5rem;
        left: max(1rem, calc((100vw - 1200px) / 2 - 186px));
        display: grid;
        gap: 0.1rem;
        width: 160px;
        padding: 0 0 0 0.75rem;
        border-left: 1px solid var(--bk-line-strong);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .page-shortcuts-title {
        margin-bottom: 0.35rem;
        color: var(--bk-ink-3);
        font: 700 0.66rem/1.4 var(--bk-font);
        letter-spacing: 0.12em;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .page-shortcuts-link {
        padding: 0.3rem 0;
        border: 0;
        border-radius: 0;
        color: var(--bk-ink-2);
        font: 500 0.8rem/1.35 var(--bk-font);
        text-align: left;
        background: transparent;
        box-shadow: none;
        transform: none;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .page-shortcuts-link:hover {
        color: var(--bk-ink);
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .page-shortcuts-link.is-active {
        color: var(--bk-brand);
        font-weight: 700;
    }
}

/* Pulsanti flottanti: stesso aspetto discreto per novità, Soul e vista pulita. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-action, .clean-view-toggle, .soul-orb-launcher, .speed-launcher) {
    width: 46px;
    height: 46px;
    border: 1px solid var(--bk-line-strong);
    border-radius: 50%;
    color: var(--bk-brand);
    font-size: 1.05rem;
    background: var(--bk-surface);
    box-shadow: var(--bk-shadow-2);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-action, .clean-view-toggle, .soul-orb-launcher, .speed-launcher):hover {
    border-color: var(--bk-brand);
    color: var(--bk-brand-strong);
    background: var(--bk-surface);
    transform: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-action, .clean-view-toggle, .soul-orb-launcher, .speed-launcher)::before,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-action, .clean-view-toggle, .soul-orb-launcher, .speed-launcher)::after {
    display: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .soul-orb-launcher {
    border-color: var(--bk-brand);
    color: #fff;
    background: var(--bk-brand);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .soul-orb-launcher:hover {
    color: #fff;
    background: var(--bk-brand-strong);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .floating-stack {
    bottom: 1.25rem;
    left: 1.25rem;
    width: auto;
    height: auto;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .soul-orb-launcher {
    top: auto;
    right: 1.25rem;
    bottom: 1.25rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .clean-view-toggle {
    top: auto;
    right: 1.25rem;
    bottom: 4.9rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .speed-launcher {
    top: auto;
    right: 1.25rem;
    bottom: 8.55rem;
    left: auto;
}

/* "Torna in cima": stesso aspetto degli altri pulsanti tondi, a sinistra sopra a quello delle novità. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .back-to-top {
    right: auto;
    bottom: 4.9rem;
    left: 1.25rem;
    z-index: 1600;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 1px solid var(--bk-line-strong);
    border-radius: 50%;
    color: var(--bk-ink-2);
    font-size: 1.05rem;
    line-height: 44px;
    text-align: center;
    background: var(--bk-surface);
    box-shadow: var(--bk-shadow-2);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .back-to-top:hover {
    border-color: var(--bk-brand);
    color: var(--bk-brand);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .back-to-top:focus-visible {
    outline: 0;
    box-shadow: var(--bk-ring);
}

/* Schede dei pannelli (AppManager) e filtri a etichetta: stessa forma dei pulsanti secondari. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.appmanager-tab-chip, .social-filter-chip) {
    min-height: 38px;
    padding: 0.4rem 0.9rem;
    border: 1px solid var(--bk-line-strong);
    border-radius: var(--bk-radius-sm);
    color: var(--bk-ink-2);
    font: 600 0.875rem/1.2 var(--bk-font);
    text-decoration: none;
    background: var(--bk-surface);
    box-shadow: none;
    transform: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.appmanager-tab-chip, .social-filter-chip):hover {
    border-color: #c6bead;
    color: var(--bk-ink);
    background: var(--bk-surface-2);
    box-shadow: none;
    transform: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.appmanager-tab-chip, .social-filter-chip).is-active {
    border-color: var(--bk-brand);
    color: #fff;
    background: var(--bk-brand);
}

/* Pannelli a comparsa (novità, velocità di lettura): superficie chiara uguale in tutte le pagine. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-panel, .speed-widget) {
    border: 1px solid var(--bk-line);
    border-radius: 18px;
    color: var(--bk-ink);
    background: var(--bk-surface);
    box-shadow: var(--bk-shadow-3);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-panel, .speed-widget)::before,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-panel, .speed-widget)::after {
    display: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .floating-panel {
    bottom: 5rem;
    left: 1.25rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-panel-title, .speed-widget h3, .speed-widget h4) {
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: 1.45rem;
    font-weight: 600;
    line-height: 1.15;
    background: none;
    -webkit-text-fill-color: currentColor;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-panel-text, .speed-widget p) {
    color: var(--bk-ink-2);
    font-size: 0.88rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.floating-panel-close, .speed-widget-close, .share-sheet-close) {
    border: 1px solid var(--bk-line-strong);
    color: var(--bk-ink-2);
    background: var(--bk-surface);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .changelog-card {
    padding: 0.9rem 1rem;
    border: 1px solid var(--bk-line);
    border-radius: 12px;
    background: var(--bk-surface-2);
    box-shadow: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .changelog-card h5 {
    margin-bottom: 0.15rem;
    color: var(--bk-ink);
    font: 700 0.95rem/1.3 var(--bk-font);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .changelog-date {
    color: var(--bk-ink-3);
    font: 600 0.68rem/1.4 var(--bk-font);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .changelog-card :is(p, li) {
    color: var(--bk-ink-2);
    font-size: 0.86rem;
    line-height: 1.5;
}

/* Pannello Condividi (fondo scuro): titolo e testi restano chiari. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .share-sheet-copy > :is(.section-title, h2) {
    color: #fff;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .share-sheet-copy > :is(.section-description, .field-note, .copy-feedback) {
    color: rgba(238, 247, 244, 0.82);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .share-sheet-copy > .hero-eyebrow {
    color: #eeb07c;
}

/* ------------------------------------------------------------------ */
/* 12. Avvisi a comparsa (SweetAlert)                                  */
/* ------------------------------------------------------------------ */

html:not(#_) .swal2-container {
    z-index: 10300;
}

html:not(#_) .swal2-popup {
    padding: 1.75rem 1.5rem 1.5rem;
    border-radius: 18px;
    font-family: var(--bk-font);
}

html:not(#_) .swal2-title {
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.15;
}

html:not(#_) .swal2-html-container,
html:not(#_) .swal2-content {
    color: var(--bk-ink-2);
    font-size: 0.98rem;
    line-height: 1.55;
}

html:not(#_) .swal2-actions .swal2-styled {
    min-height: 42px;
    margin: 0.3rem;
    padding: 0.5rem 1.2rem;
    border-radius: var(--bk-radius-sm) !important;
    font: 600 0.9rem/1.2 var(--bk-font) !important;
    box-shadow: none;
}

html:not(#_) .swal2-actions .swal2-styled.swal2-confirm {
    border: 1px solid var(--bk-brand);
    color: #fff;
    background: var(--bk-brand);
}

html:not(#_) .swal2-actions .swal2-styled.swal2-confirm:hover {
    background: var(--bk-brand-strong);
}

html:not(#_) .swal2-actions .swal2-styled.swal2-cancel,
html:not(#_) .swal2-actions .swal2-styled.swal2-deny {
    border: 1px solid var(--bk-line-strong);
    color: var(--bk-ink);
    background: var(--bk-surface);
}

html:not(#_) .swal2-actions .swal2-styled:focus {
    box-shadow: var(--bk-ring);
}

/* Numeri del riquadro iniziale: le caselle si dispongono da sole e il valore resta su una riga. */
html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .hero-library-stats {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .hero-library-stats strong {
    white-space: nowrap;
}

/* Tablet e finestre strette: riquadro iniziale su una colonna, senza le copertine decorative,
   così i due pulsanti restano sempre dentro al riquadro. */
@media (max-width: 1099px) {
    html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-dashboard-hero {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.25rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-hero-aside {
        display: block;
        min-width: 0;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-cover-stage {
        display: none;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .book-hero-actions {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 0.6rem;
        width: auto;
        min-width: 0;
        margin: 0;
    }
}

/* Annunci dei piani che li prevedono: finestra a tempo e fascia a piè di pagina. */
html:not(#_) .timed-ad-modal {
    z-index: 3000;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .timed-ad-card {
    width: min(100%, 480px);
    padding: 1.75rem;
    border: 1px solid var(--bk-line);
    border-radius: 18px;
    background: var(--bk-surface);
    box-shadow: var(--bk-shadow-3);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .timed-ad-title {
    padding-right: 2.5rem;
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.15;
    background: none;
    -webkit-text-fill-color: currentColor;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .timed-ad-text {
    color: var(--bk-ink-2);
    font-size: 0.98rem;
    line-height: 1.55;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .timed-ad-close {
    width: 38px;
    height: 38px;
    border: 1px solid var(--bk-line-strong);
    color: var(--bk-ink-2);
    background: var(--bk-surface);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-inner {
    gap: 0.9rem 1.1rem;
    padding: 0.8rem 1rem;
    border: 0;
    border-radius: 14px;
    color: #eef7f4;
    background: var(--bk-deep);
    box-shadow: var(--bk-shadow-3);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-eyebrow {
    color: #eeb07c;
    font: 700 0.66rem/1.4 var(--bk-font);
    letter-spacing: 0.12em;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-title {
    color: #fff;
    font: 700 0.95rem/1.3 var(--bk-font);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-text {
    color: rgba(238, 247, 244, 0.8);
    font-size: 0.86rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-inner .btn {
    border-color: #f5eee2;
    color: var(--bk-deep);
    white-space: nowrap;
    background-color: #f5eee2;
}

/* Mentre la fascia è visibile i pulsanti tondi salgono, così non ne coprono il testo né il pulsante. */
@media (max-width: 1319px) {
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page):has(#footerAdSlot.is-visible) :is(.soul-orb-launcher, .back-to-top) {
        bottom: 7.2rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page):has(#footerAdSlot.is-visible) .clean-view-toggle {
        bottom: 10.85rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page):has(#footerAdSlot.is-visible) .speed-launcher {
        bottom: 14.5rem;
    }
}

/* Senza margine libero ai lati (sotto i 1320 px) il pulsante tondo delle novità coprirebbe il contenuto:
   lì le novità si aprono dal menu dell'utente e "torna in cima" scende nell'angolo. */
@media (max-width: 1319px) {
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .floating-stack {
        display: none;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .back-to-top {
        bottom: 1.25rem;
    }
}

/* ------------------------------------------------------------------ */
/* 13. Telefono                                                        */
/* ------------------------------------------------------------------ */

@media (max-width: 767px) {
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .container.app-shell {
        width: calc(100vw - 1.5rem);
        padding-top: 0.9rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.library-page):not(.show-page) .app-page-hero {
        padding: 1.5rem 1.25rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .library-dashboard-hero {
        grid-template-columns: minmax(0, 1fr);
        padding: 1.5rem 1.25rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .section-shell {
        padding: 1.25rem 1rem;
        border-radius: 16px;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.library-page):not(.show-page) .app-page-actions {
        width: 100%;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.library-page):not(.show-page) .app-page-actions .btn {
        flex: 1 1 auto;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .book-hero-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 0.6rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body.library-page .book-hero-actions .btn {
        width: 100%;
    }

    /* Schede libro: copertina piccola e pulsante dei dettagli ridotto alla sola freccia. */
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry > .card-body {
        grid-template-columns: 64px minmax(0, 1fr);
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry .cover-image {
        width: 64px;
        height: 94px;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry .book-header-row {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.5rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry .book-header-row > div {
        flex: 1 1 auto;
        min-width: 0;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry .btn-details {
        flex: 0 0 34px;
        width: 34px;
        min-width: 34px;
        padding: 0;
        font-size: 0;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry .btn-details .bi {
        font-size: 0.95rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .book-title {
        font-size: 1.25rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-collapse .book-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Azioni della scheda: ogni pulsante tiene il testo su una riga e, se non ci sta, va a capo intero. */
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry-actions > :is(.btn, form) {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry-actions .btn {
        white-space: nowrap;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .library-entry-actions form .btn {
        width: 100%;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) :is(.soul-orb-launcher, .floating-stack) {
        bottom: 0.9rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .soul-orb-launcher {
        right: 0.9rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .floating-stack {
        left: 0.9rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .back-to-top {
        bottom: 0.9rem;
        left: 0.9rem;
    }

    /* Fascia degli annunci compatta: testo a sinistra, pulsante a destra. */
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-inner {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.7rem;
        padding: 0.75rem 0.85rem;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-eyebrow {
        display: none;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-text {
        display: -webkit-box;
        overflow: hidden;
        font-size: 0.8rem;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .footer-ad-cta {
        width: auto;
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page):has(#footerAdSlot.is-visible) :is(.soul-orb-launcher, .back-to-top) {
        bottom: 8.2rem;
    }
}

/* ------------------------------------------------------------------ */
/* 14. Pagine di accesso (login, registrazione, recupero, non trovata) */
/* ------------------------------------------------------------------ */

html:not(#_) body.auth-page {
    color: var(--bk-ink);
    background: var(--bk-bg);
}

html:not(#_) body.auth-page::before {
    display: none;
}

html:not(#_) body.auth-page .auth-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 0;
}

html:not(#_) body.auth-page .auth-media {
    display: none;
}

html:not(#_) body.auth-page .auth-media::before,
html:not(#_) body.auth-page .auth-media::after,
html:not(#_) body.auth-page .auth-media video {
    display: none;
}

html:not(#_) body.auth-page .auth-card {
    align-self: center;
    justify-self: center;
    width: min(460px, calc(100vw - 1.5rem));
    max-width: none;
    margin: 1.5rem auto;
    padding: 2rem;
    border: 1px solid var(--bk-line);
    border-radius: var(--bk-radius-lg);
    color: var(--bk-ink);
    background: var(--bk-surface);
    box-shadow: var(--bk-shadow-2);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    opacity: 1;
    transform: none;
}

html:not(#_) body.auth-page .auth-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.6rem;
}

html:not(#_) body.auth-page .auth-brand img {
    width: auto;
    max-width: 170px;
    height: 34px;
    object-fit: contain;
    filter: none;
    opacity: 1;
}

html:not(#_) body.auth-page .auth-card .hero-eyebrow {
    margin-bottom: 0.45rem;
    color: var(--bk-accent);
    font: 700 0.68rem/1.4 var(--bk-font);
    letter-spacing: 0.14em;
}

html:not(#_) body.auth-page .auth-card h1 {
    display: block;
    margin: 0 0 0.55rem;
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: clamp(1.75rem, 3vw, 2.1rem);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -0.01em;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:not(#_) body.auth-page .auth-card p {
    color: var(--bk-ink-2);
    font-size: 0.94rem;
    line-height: 1.55;
}

html:not(#_) body.auth-page .auth-benefit-list {
    display: grid;
    gap: 0.35rem;
    margin: 0.9rem 0 1.4rem;
}

html:not(#_) body.auth-page .auth-benefit-pill {
    display: flex;
    align-items: baseline;
    gap: 0.55rem;
    width: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: var(--bk-ink-2);
    font-size: 0.88rem;
    line-height: 1.45;
    background: transparent;
}

html:not(#_) body.auth-page .auth-benefit-pill::before {
    content: "";
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--bk-brand);
    transform: translateY(-2px);
}

html:not(#_) body.auth-page .auth-card label {
    display: block;
    margin-bottom: 0.4rem;
    color: var(--bk-ink-2);
    font: 600 0.8125rem/1.35 var(--bk-font);
}

html:not(#_) body.auth-page .auth-card .form-control {
    min-height: 46px;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--bk-line-strong);
    border-radius: var(--bk-radius-sm);
    color: var(--bk-ink);
    font: 500 0.95rem/1.4 var(--bk-font);
    background: var(--bk-surface);
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:not(#_) body.auth-page .auth-card .form-control:focus {
    border-color: var(--bk-brand);
    box-shadow: var(--bk-ring);
}

html:not(#_) body.auth-page .auth-card :is(.small, small) {
    color: var(--bk-ink-3);
    font-size: 0.8rem;
}

html:not(#_) body.auth-page .auth-actions {
    display: grid;
    gap: 0.6rem;
    margin-top: 1.3rem;
}

html:not(#_) body.auth-page .auth-card .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 46px;
    padding: 0.5rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--bk-radius-sm);
    font: 600 0.95rem/1.2 var(--bk-font);
    letter-spacing: 0;
    background-image: none;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: none;
}

html:not(#_) body.auth-page .auth-card .btn-primary {
    border-color: var(--bk-brand);
    color: #fff;
    background-color: var(--bk-brand);
}

html:not(#_) body.auth-page .auth-card .btn-primary:hover {
    border-color: var(--bk-brand-strong);
    background-color: var(--bk-brand-strong);
}

html:not(#_) body.auth-page .auth-card :is(.btn-light, .btn-secondary, .auth-social-button) {
    border-color: var(--bk-line-strong);
    color: var(--bk-ink);
    background-color: var(--bk-surface);
}

html:not(#_) body.auth-page .auth-card :is(.btn-light, .btn-secondary, .auth-social-button):hover {
    border-color: #c6bead;
    color: var(--bk-ink);
    background-color: var(--bk-surface-2);
}

html:not(#_) body.auth-page .auth-card .btn:focus-visible {
    outline: 0;
    box-shadow: var(--bk-ring);
}

html:not(#_) body.auth-page .auth-support {
    margin-top: 1.3rem;
    color: var(--bk-ink-3);
    font-size: 0.9rem;
    text-align: center;
}

html:not(#_) body.auth-page .auth-support a {
    color: var(--bk-brand);
    font-weight: 600;
}

html:not(#_) body.auth-page .auth-alert {
    margin-bottom: 1rem;
    padding: 0.8rem 0.95rem;
    border: 1px solid var(--bk-danger-line);
    border-radius: 12px;
    color: #8a3027;
    font-size: 0.9rem;
    background: var(--bk-danger-tint);
}

html:not(#_) body.auth-page .auth-alert.auth-success {
    border-color: #c4e1d2;
    color: #1d5a40;
    background: var(--bk-success-tint);
}

html:not(#_) body.auth-page .auth-social-stack {
    margin-top: 1.3rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--bk-line);
}

html:not(#_) body.auth-page .auth-social-note {
    color: var(--bk-ink-3);
}

/* Selettore della lingua nelle pagine pubbliche su fondo chiaro. */
html:not(#_) body:is(.auth-page, .marketing-page) .public-language-toggle {
    gap: 0;
    padding: 3px;
    border: 1px solid var(--bk-line);
    border-radius: 10px;
    background: var(--bk-surface-3);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:not(#_) body:is(.auth-page, .marketing-page) .public-language-link {
    min-width: 36px;
    padding: 0.3rem 0.55rem;
    border-radius: 7px;
    color: var(--bk-ink-3);
    font: 700 0.72rem/1.3 var(--bk-font);
    letter-spacing: 0.04em;
    text-align: center;
    text-decoration: none;
    background: transparent;
}

html:not(#_) body:is(.auth-page, .marketing-page) .public-language-link.is-active {
    color: var(--bk-ink);
    background: var(--bk-surface);
    box-shadow: 0 1px 2px rgba(20, 41, 45, 0.14);
}

@media (min-width: 992px) {
    html:not(#_) body.auth-page .auth-shell {
        grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    }

    /* A sinistra l'immagine della libreria velata di verde petrolio, a destra il modulo. */
    html:not(#_) body.auth-page .auth-media {
        position: relative;
        inset: auto;
        display: block;
        min-height: 100vh;
        background:
            linear-gradient(165deg, rgba(8, 43, 48, 0.9) 0%, rgba(14, 82, 80, 0.72) 100%),
            url("../img/bookhye-wallpaper.jpg") center / cover no-repeat;
    }
}

@media (max-width: 575px) {
    html:not(#_) body.auth-page .auth-card {
        padding: 1.5rem 1.25rem;
    }
}

/* ------------------------------------------------------------------ */
/* 15. Pagine pubbliche di presentazione                               */
/* ------------------------------------------------------------------ */

html:not(#_) body.marketing-page {
    color: var(--bk-ink);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body.marketing-page:not(.show-page):not(.show-filter-page) .page-shortcuts {
    display: none;
}

html:not(#_) body.marketing-page .marketing-nav {
    border-bottom: 1px solid var(--bk-line);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: none;
    -webkit-backdrop-filter: saturate(1.4) blur(14px);
    backdrop-filter: saturate(1.4) blur(14px);
}

html:not(#_) body.marketing-page .marketing-nav-inner {
    min-height: 68px;
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}

html:not(#_) body.marketing-page .marketing-brand img {
    width: auto;
    max-width: 190px;
    height: 36px;
    object-fit: contain;
}

html:not(#_) body.marketing-page .marketing-nav-links a:not(.btn) {
    padding: 0.45rem 0.7rem;
    border-radius: 10px;
    color: var(--bk-ink-2);
    font: 600 0.9rem/1.2 var(--bk-font);
    text-decoration: none;
}

html:not(#_) body.marketing-page .marketing-nav-links a:not(.btn):hover {
    color: var(--bk-ink);
    background: var(--bk-surface-3);
}

html:not(#_) body.marketing-page .shared-public-nav-copy p {
    color: var(--bk-ink-2);
    font-size: 0.88rem;
}

/* Pulsanti: gli stessi dell'app. */
html:not(#_) body.marketing-page .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 42px;
    padding: 0.5rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--bk-radius-sm);
    font: 600 0.9rem/1.2 var(--bk-font);
    letter-spacing: 0;
    text-decoration: none;
    background-image: none;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

html:not(#_) body.marketing-page .btn-lg {
    min-height: 50px;
    padding: 0.65rem 1.4rem;
    font-size: 1rem;
}

html:not(#_) body.marketing-page .btn-primary {
    border-color: var(--bk-brand);
    color: #fff;
    background-color: var(--bk-brand);
}

html:not(#_) body.marketing-page .btn-primary:hover {
    border-color: var(--bk-brand-strong);
    color: #fff;
    background-color: var(--bk-brand-strong);
}

html:not(#_) body.marketing-page :is(.btn-light, .btn-secondary) {
    border-color: var(--bk-line-strong);
    color: var(--bk-ink);
    background-color: var(--bk-surface);
}

html:not(#_) body.marketing-page :is(.btn-light, .btn-secondary):hover {
    border-color: #c6bead;
    color: var(--bk-ink);
    background-color: var(--bk-surface-2);
}

html:not(#_) body.marketing-page .btn:focus-visible {
    outline: 0;
    box-shadow: var(--bk-ring);
}

/* Pulsanti sopra la fotografia e sulle fasce scure. */
html:not(#_) body.marketing-page :is(.showcase-hero, .showcase-cta-band) .btn-primary {
    border-color: #f5eee2;
    color: var(--bk-deep);
    background-color: #f5eee2;
}

html:not(#_) body.marketing-page :is(.showcase-hero, .showcase-cta-band) .btn-primary:hover {
    border-color: #fff;
    color: var(--bk-deep);
    background-color: #fff;
}

html:not(#_) body.marketing-page :is(.showcase-hero, .showcase-cta-band, .showcase-section-dark) .btn-light {
    border-color: rgba(255, 255, 255, 0.4);
    color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
}

html:not(#_) body.marketing-page :is(.showcase-hero, .showcase-cta-band, .showcase-section-dark) .btn-light:hover {
    border-color: rgba(255, 255, 255, 0.65);
    color: #fff;
    background-color: rgba(255, 255, 255, 0.18);
}

/* Titoli: un solo colore e dimensioni misurate. */
html:not(#_) body.marketing-page .showcase-title {
    max-width: 15ch;
    color: #fff;
    font-family: var(--bk-serif);
    font-size: clamp(2.6rem, 5.4vw, 4.4rem);
    font-weight: 600;
    line-height: 1.02;
    letter-spacing: -0.02em;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:not(#_) body.marketing-page .showcase-lead {
    max-width: 56ch;
    font-size: 1.1rem;
    line-height: 1.6;
}

html:not(#_) body.marketing-page .showcase-section-title {
    max-width: 24ch;
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-size: clamp(1.9rem, 3.4vw, 2.9rem);
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -0.015em;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:not(#_) body.marketing-page h3.showcase-section-title {
    font-size: clamp(1.5rem, 2.4vw, 2rem);
}

html:not(#_) body.marketing-page .showcase-section-text {
    max-width: 68ch;
    color: var(--bk-ink-2);
    font-size: 1.02rem;
    line-height: 1.65;
}

html:not(#_) body.marketing-page :is(.showcase-section-dark, .showcase-cta-band, .showcase-section-head-light) .showcase-section-title {
    color: #fff;
}

html:not(#_) body.marketing-page :is(.showcase-section-dark, .showcase-cta-band, .showcase-section-head-light) .showcase-section-text {
    color: rgba(238, 247, 244, 0.8);
}

html:not(#_) body.marketing-page .showcase-section .hero-eyebrow {
    color: var(--bk-accent);
    font: 700 0.7rem/1.4 var(--bk-font);
    letter-spacing: 0.14em;
}

html:not(#_) body.marketing-page :is(.showcase-image-panel-copy, .showcase-rail-card, .faq-card, .pricing-card-top) h3 {
    color: var(--bk-ink);
    font-family: var(--bk-serif);
    font-weight: 600;
    letter-spacing: -0.005em;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:not(#_) body.marketing-page .showcase-feature-copy h3 {
    color: #fff;
    font-family: var(--bk-serif);
    font-weight: 600;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
}

html:not(#_) body.marketing-page .showcase-glass-card h2 {
    font-family: var(--bk-serif);
    font-size: clamp(1.5rem, 2.2vw, 1.9rem);
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: -0.01em;
}

html:not(#_) body.marketing-page .showcase-metric-card strong {
    font: 700 1.2rem/1.2 var(--bk-font);
    letter-spacing: -0.01em;
}

/* Schede: angoli e ombre uniformi. */
html:not(#_) body.marketing-page :is(.showcase-metric-card, .showcase-glass-card, .showcase-mini-tile, .showcase-image-panel, .showcase-feature-card, .showcase-rail-card, .faq-card, .pricing-card, .soul-chat-panel, .showcase-cta-band, .pricing-comparison-block) {
    border-radius: 18px;
    box-shadow: none;
}

html:not(#_) body.marketing-page :is(.showcase-image-panel, .showcase-rail-card, .faq-card, .pricing-card) {
    border: 1px solid var(--bk-line);
    background: var(--bk-surface);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

html:not(#_) body.marketing-page .pricing-card.pricing-card-current {
    border-color: var(--bk-brand);
    box-shadow: 0 0 0 1px var(--bk-brand);
}

html:not(#_) body.marketing-page .pricing-card .hero-eyebrow {
    color: var(--bk-accent);
}

html:not(#_) body.marketing-page .tag-chip {
    padding: 0.28rem 0.65rem;
    border: 1px solid var(--bk-line);
    border-radius: 999px;
    color: var(--bk-ink-2);
    font: 600 0.72rem/1.3 var(--bk-font);
    letter-spacing: 0.02em;
    text-transform: none;
    background: var(--bk-surface-3);
    box-shadow: none;
}

html:not(#_) body.marketing-page .soul-chat-panel .tag-chip {
    border-color: rgba(255, 255, 255, 0.22);
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

@media (max-width: 767px) {
    html:not(#_) body.marketing-page .marketing-brand img {
        height: 32px;
    }
}


/* ------------------------------------------------------------------ */
/* 16. Shop: acquisto dei piani                                        */
/* ------------------------------------------------------------------ */

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-plan-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    gap: 1rem;
    align-items: stretch;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-plan-card {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    min-width: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-plan-card .pricing-form {
    margin-top: auto;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-buy-form {
    display: grid;
    gap: 0.75rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-options {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-options legend {
    float: none;
    width: auto;
    margin: 0 0 0.35rem;
    padding: 0;
    color: var(--bk-ink-3);
    font: 700 0.72rem/1.3 var(--bk-font);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    column-gap: 0.6rem;
    row-gap: 0.1rem;
    align-items: center;
    margin: 0;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--bk-line-strong);
    border-radius: var(--bk-radius-sm);
    background: var(--bk-surface);
    cursor: pointer;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-option input {
    width: 1.05rem;
    height: 1.05rem;
    margin: 0;
    accent-color: var(--bk-brand);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-name {
    color: var(--bk-ink);
    font: 700 0.92rem/1.3 var(--bk-font);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-price {
    color: var(--bk-ink);
    font: 600 0.9rem/1.3 var(--bk-font);
    text-align: right;
    white-space: nowrap;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-note {
    grid-column: 2 / -1;
    color: var(--bk-ink-3);
    font: 500 0.78rem/1.35 var(--bk-font);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-option:has(input:checked) {
    border-color: var(--bk-brand);
    background: var(--bk-brand-tint);
    box-shadow: inset 0 0 0 1px var(--bk-brand);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-option:focus-within {
    box-shadow: var(--bk-ring);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-pay-actions {
    display: grid;
    gap: 0.5rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-pay-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-pay-note {
    font-size: 0.78rem;
    line-height: 1.45;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-replace-check .form-check-label {
    font-size: 0.84rem;
    line-height: 1.4;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-cancel {
    padding-top: 0.85rem;
    border-top: 1px solid var(--bk-line);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-cancel summary {
    width: fit-content;
    color: var(--bk-danger);
    font: 600 0.9rem/1.4 var(--bk-font);
    cursor: pointer;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-cancel[open] summary {
    margin-bottom: 0.75rem;
}

/* Scheda del piano attivo: fondo scuro, opzioni leggibili in chiaro. */
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .pricing-card-current .shop-period-options legend,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .pricing-card-current .shop-period-note,
html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .pricing-card-current .shop-pay-note {
    color: rgba(255, 255, 255, 0.74);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .pricing-card-current .shop-period-option {
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.08);
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .pricing-card-current :is(.shop-period-name, .shop-period-price, .form-check-label) {
    color: #fff;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .pricing-card-current .shop-period-option:has(input:checked) {
    border-color: #fff;
    background: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 0 0 1px #fff;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .pricing-card-current .shop-period-option input {
    accent-color: #fff;
}

@media (max-width: 575px) {
    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-plan-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-option {
        grid-template-columns: auto minmax(0, 1fr);
    }

    html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .shop-period-price {
        grid-column: 2;
        text-align: left;
        white-space: normal;
    }
}

/* ------------------------------------------------------------------ */
/* 17. Assistenza                                                      */
/* ------------------------------------------------------------------ */

/* Campo che le persone non vedono: se arriva compilato l'invio è automatico. */
html:not(#_) .support-extra-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

html:not(#_) body.auth-page .auth-card textarea.form-control {
    min-height: 7.5rem;
    resize: vertical;
}

html:not(#_) body.auth-page .auth-card .field-note {
    display: block;
    margin-top: 0.35rem;
    color: var(--bk-ink-3);
    font-size: 0.8rem;
}

html:is(.app-ui-2026, .bk-refined):not(#_) body:not(.show-page):not(.show-filter-page) .support-ticket-row .catalog-entry-main {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem 1rem;
    align-items: center;
    justify-content: space-between;
}