/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-ooecpo9dxc],
.components-reconnect-repeated-attempt-visible[b-ooecpo9dxc],
.components-reconnect-failed-visible[b-ooecpo9dxc],
.components-pause-visible[b-ooecpo9dxc],
.components-resume-failed-visible[b-ooecpo9dxc],
.components-rejoining-animation[b-ooecpo9dxc] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-retrying[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-failed[b-ooecpo9dxc],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-ooecpo9dxc] {
    display: block;
}


#components-reconnect-modal[b-ooecpo9dxc] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-ooecpo9dxc 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-ooecpo9dxc 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-ooecpo9dxc 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-ooecpo9dxc]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-ooecpo9dxc 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-ooecpo9dxc {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-ooecpo9dxc {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-ooecpo9dxc {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-ooecpo9dxc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-ooecpo9dxc] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-ooecpo9dxc] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-ooecpo9dxc] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-ooecpo9dxc] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-ooecpo9dxc] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-ooecpo9dxc] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-ooecpo9dxc 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-ooecpo9dxc] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-ooecpo9dxc {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Donate.razor.rz.scp.css */
.lg-donate-hero[b-zkbqla3u54] { padding: 52px 0 40px; }
.lg-donate-hero .lg-hero__inner[b-zkbqla3u54] { max-width: 720px; }

.lg-donate[b-zkbqla3u54] { padding: 36px 24px 8px; }
.lg-donate__grid[b-zkbqla3u54] { display: grid; grid-template-columns: 420px minmax(0,1fr); gap: 40px; align-items: start; }

/* Donation card */
.lg-donate__card[b-zkbqla3u54] { padding: 28px; }
.lg-freq[b-zkbqla3u54] { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: var(--lg-surface-2);
    border-radius: 999px; padding: 5px; margin-bottom: 22px; }
.lg-freq__btn[b-zkbqla3u54] { border: none; background: transparent; padding: .7em 1em; border-radius: 999px;
    font: 600 .95rem var(--lg-sans); color: var(--lg-ink-soft); cursor: pointer; }
.lg-freq__btn.is-active[b-zkbqla3u54] { background: var(--lg-paper); color: var(--lg-navy); box-shadow: var(--lg-shadow); }

.lg-amounts[b-zkbqla3u54] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 18px; }
.lg-amount[b-zkbqla3u54] { border: 1.5px solid var(--lg-line); background: var(--lg-paper); border-radius: var(--lg-radius-s);
    padding: 1em 0; font: 700 1.15rem var(--lg-serif); color: var(--lg-navy); cursor: pointer; transition: border-color .12s, background .12s; }
.lg-amount:hover[b-zkbqla3u54] { border-color: var(--lg-navy-300); }
.lg-amount.is-active[b-zkbqla3u54] { border-color: var(--lg-teal); background: var(--lg-teal-100); color: var(--lg-teal-600); }
.lg-amount--custom[b-zkbqla3u54] { font-size: .95rem; font-family: var(--lg-sans); font-weight: 600; }

.lg-custom[b-zkbqla3u54] { display: flex; align-items: center; gap: 6px; border: 1.5px solid var(--lg-teal);
    border-radius: var(--lg-radius-s); padding: .4em .8em; margin-bottom: 18px; }
.lg-custom__sign[b-zkbqla3u54] { font: 700 1.2rem var(--lg-serif); color: var(--lg-navy); }
.lg-custom__input[b-zkbqla3u54] { border: none; outline: none; font: 700 1.2rem var(--lg-serif); color: var(--lg-navy); width: 100%; background: transparent; }

.lg-donate__go[b-zkbqla3u54] { width: 100%; justify-content: center; }

.lg-donate__providers[b-zkbqla3u54] { margin-top: 22px; text-align: center; }
.lg-donate__or[b-zkbqla3u54] { display: block; color: var(--lg-ink-faint); font-size: .82rem; margin-bottom: 12px; position: relative; }
.lg-provider-row[b-zkbqla3u54] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.lg-provider[b-zkbqla3u54] { border: 1px solid var(--lg-line); border-radius: var(--lg-radius-s); padding: .7em .4em;
    font-size: .85rem; font-weight: 600; color: var(--lg-navy); background: var(--lg-paper); text-align: center; }
.lg-provider:hover[b-zkbqla3u54] { border-color: var(--lg-navy-300); text-decoration: none; background: var(--lg-surface); }

.lg-donate__thanks[b-zkbqla3u54] { margin: 16px 0 0; padding: 12px 14px; background: var(--lg-teal-100); color: var(--lg-teal-600);
    border-radius: var(--lg-radius-s); font-weight: 600; text-align: center; }
.lg-donate__secure[b-zkbqla3u54] { margin: 18px 0 0; text-align: center; color: var(--lg-ink-faint); font-size: .8rem; }

/* Impact column */
.lg-donate__impact h2[b-zkbqla3u54] { margin-bottom: 18px; }
.lg-impact-list[b-zkbqla3u54] { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 16px; }
.lg-impact-list li[b-zkbqla3u54] { display: flex; gap: 16px; align-items: baseline; }
.lg-impact__amt[b-zkbqla3u54] { flex: 0 0 56px; font: 700 1.25rem var(--lg-serif); color: var(--lg-crimson); }
.lg-impact-list li span:last-child[b-zkbqla3u54] { color: var(--lg-ink-soft); }
.lg-donate__note[b-zkbqla3u54] { background: var(--lg-paper); border: 1px solid var(--lg-line); border-left: 4px solid var(--lg-teal);
    border-radius: var(--lg-radius-s); padding: 18px 20px; color: var(--lg-ink-soft); font-size: .95rem; }

@media (max-width: 900px) {
    .lg-donate__grid[b-zkbqla3u54] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Compact hero ──────────────────────────────────────── */
.lg-hero[b-agd52q7uxb] {
    background:
        radial-gradient(900px 380px at 80% -20%, rgba(13,148,136,.10), transparent 60%),
        linear-gradient(180deg, var(--lg-paper) 0%, var(--lg-surface) 100%);
    border-bottom: 1px solid var(--lg-line);
    padding: 52px 0 40px;
}
.lg-hero__inner[b-agd52q7uxb] { max-width: 720px; }
.lg-hero h1[b-agd52q7uxb] { margin-bottom: .2em; }
.lg-hero__lead[b-agd52q7uxb] { font-size: 1.15rem; color: var(--lg-ink-soft); max-width: 34em; margin-bottom: 20px; }
.lg-hero__trust[b-agd52q7uxb] { display: flex; gap: 22px; flex-wrap: wrap; color: var(--lg-ink-soft); font-size: .92rem; font-weight: 500; }

/* ── Tool ──────────────────────────────────────────────── */
.lg-tool[b-agd52q7uxb] { padding: 36px 24px 8px; }
.lg-tool__grid[b-agd52q7uxb] { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 32px; align-items: start; }

.lg-tool__panel[b-agd52q7uxb] { padding: 18px; }
.lg-tool__input[b-agd52q7uxb] {
    width: 100%; border: 1px solid var(--lg-line); border-radius: var(--lg-radius-s);
    padding: 16px; font-family: var(--lg-serif); font-size: 1.12rem; line-height: 1.5;
    color: var(--lg-ink); resize: vertical; background: var(--lg-paper);
}
.lg-tool__input:focus[b-agd52q7uxb] { outline: none; border-color: var(--lg-teal); box-shadow: 0 0 0 3px rgba(13,148,136,.15); }
.lg-tool__actions[b-agd52q7uxb] { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 14px; flex-wrap: wrap; }
.lg-tool__count[b-agd52q7uxb] { color: var(--lg-ink-faint); font-size: .82rem; font-variant-numeric: tabular-nums; }
.lg-tool__count.is-max[b-agd52q7uxb] { color: var(--lg-crimson); font-weight: 600; }
.lg-tool__buttons[b-agd52q7uxb] { display: flex; align-items: center; gap: 12px; }
.lg-tool__hint[b-agd52q7uxb] { color: var(--lg-ink-faint); font-size: .75rem; border: 1px solid var(--lg-line);
    border-radius: 6px; padding: 2px 7px; }
@media (max-width: 720px) { .lg-tool__hint[b-agd52q7uxb] { display: none; } }

.lg-tool__result[b-agd52q7uxb] { margin-top: 22px; overflow: hidden; }
.lg-tool__result-bar[b-agd52q7uxb] { padding: 9px 12px 9px 18px; background: var(--lg-surface-2); border-bottom: 1px solid var(--lg-line);
    font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--lg-ink-soft); font-weight: 600;
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
/* The rendered sheet is designed on white paper — keep it white in both themes. */
.lg-tool__result-body[b-agd52q7uxb] { padding: 20px; overflow: auto; background: #fff; }
/* Blazor scoped-CSS uses ::deep (not Vue's :deep()) — the old selector was
   dropped by browsers, so the result SVG never scaled down and clipped.
   Width is the fitted pane width times the zoom level (--result-zoom), so
   100% fits, zooming in overflows into pan, zooming out shrinks. */
.lg-result-zoom[b-agd52q7uxb]  svg { width: calc(var(--result-zoom, 1) * 100%); height: auto; display: block; }

/* A stale sheet (textarea edited since Generate) dims until regenerated. */
.lg-result-zoom[b-agd52q7uxb] { transition: opacity .15s ease; }
.lg-result-zoom.is-stale[b-agd52q7uxb] { opacity: .45; }

/* Drag-to-pan when the sheet overflows (zoomed in) */
.lg-tool__result-body[b-agd52q7uxb] { cursor: default; touch-action: pan-x pan-y; }
.lg-tool__result-body:focus-visible[b-agd52q7uxb] { outline: 2px solid var(--lg-teal); outline-offset: -2px; }
.lg-tool__result-body.is-pannable[b-agd52q7uxb] { cursor: grab; }
.lg-tool__result-body.is-panning[b-agd52q7uxb] { cursor: grabbing; user-select: none; }
.lg-result-pan-hint[b-agd52q7uxb] { font-size: .72rem; color: var(--lg-ink-soft); letter-spacing: 0; text-transform: none; font-weight: 500; }

/* Result toolbar */
.lg-result-tools[b-agd52q7uxb] { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.lg-result-tools__sep[b-agd52q7uxb] { width: 1px; height: 20px; background: var(--lg-line); margin: 0 4px; }
/* A button: clicking the percentage resets zoom to 100%. Ink-soft (not faint)
   so the smallest text on the page still clears AA on the bar's surface. */
.lg-result-zoomlabel[b-agd52q7uxb] { font-size: .72rem; color: var(--lg-ink-soft); min-width: 34px; text-align: center;
    font-variant-numeric: tabular-nums; letter-spacing: 0; text-transform: none;
    background: none; border: none; padding: 0; cursor: pointer; font-weight: 600; }
.lg-result-zoomlabel:hover[b-agd52q7uxb] { color: var(--lg-teal-600); }
.lg-icon-btn[b-agd52q7uxb] { display: inline-flex; align-items: center; justify-content: center; gap: 4px;
    min-width: 32px; height: 32px; padding: 0 5px;
    border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--lg-ink-soft); cursor: pointer;
    transition: background .12s, color .12s, border-color .12s; }
.lg-icon-btn:hover:not(:disabled)[b-agd52q7uxb] { background: var(--lg-paper); color: var(--lg-teal-600); border-color: var(--lg-line); }
.lg-icon-btn:disabled[b-agd52q7uxb] { opacity: .35; cursor: not-allowed; }
.lg-icon-btn.is-active[b-agd52q7uxb] { color: var(--lg-crimson); }
.lg-icon-btn__tag[b-agd52q7uxb] { font-size: .62rem; font-weight: 700; letter-spacing: .04em; }

/* Natural-voice consent strip + status line (flush inside the result card) */
.lg-voice-note[b-agd52q7uxb] { padding: 14px 18px; border-bottom: 1px solid var(--lg-line); background: var(--lg-surface);
    font-size: .92rem; color: var(--lg-ink-soft); }
.lg-voice-note p[b-agd52q7uxb] { margin: 0 0 10px; max-width: 62ch; }
.lg-voice-note__actions[b-agd52q7uxb] { display: flex; gap: 8px; flex-wrap: wrap; }
.lg-voice-note__btn[b-agd52q7uxb] { font-size: .85rem; padding: .55em 1.1em; }
.lg-voice-status[b-agd52q7uxb] { margin: 0; padding: 8px 18px; border-bottom: 1px solid var(--lg-line);
    background: var(--lg-surface); font-size: .82rem; color: var(--lg-ink-soft);
    font-variant-numeric: tabular-nums; }

/* Empty state — shows a small pre-rendered sample */
.lg-tool__empty[b-agd52q7uxb] { margin-top: 22px; border: 2px dashed var(--lg-line); border-radius: var(--lg-radius);
    padding: 28px 24px; text-align: center; color: var(--lg-ink-faint); }
.lg-tool__empty-icon[b-agd52q7uxb] { font-size: 2rem; color: var(--lg-teal); opacity: .6; margin-bottom: 8px; }
.lg-tool__empty-label[b-agd52q7uxb] { margin-bottom: 14px; font-size: .92rem; }
.lg-tool__empty-sample[b-agd52q7uxb] { display: flex; justify-content: center; opacity: .85;
    background: #fff; border-radius: var(--lg-radius-s); padding: 4px; overflow: hidden; }
.lg-tool__empty-sample[b-agd52q7uxb]  svg { max-width: 100%; height: auto; display: block; }

.lg-tool__notice[b-agd52q7uxb] { margin-top: 22px; padding: 16px 18px; border-radius: var(--lg-radius-s); }
/* Inside the result card, the notice sits flush between bar and sheet. */
.lg-tool__notice--inresult[b-agd52q7uxb] { margin: 0; border-radius: 0; border-left: none; border-right: none; font-size: .92rem; }
.lg-tool__notice--err[b-agd52q7uxb] { background: #fdeef0; border: 1px solid #f4c9cf; color: #8a1b2c; }
/* Dark theme (html.dark — set by the theme toggle / pre-paint script) */
:root.dark .lg-tool__notice--err[b-agd52q7uxb] { background: #3a1620; border-color: #63263a; color: #f3aebd; }

.lg-tool__rail[b-agd52q7uxb] { display: grid; gap: 20px; position: sticky; top: 88px; }

.lg-guides[b-agd52q7uxb] { display: grid; gap: 24px; }

/* ── Examples ──────────────────────────────────────────── */
.lg-examples[b-agd52q7uxb] { padding-top: 40px; padding-bottom: 40px; }
.lg-examples__sub[b-agd52q7uxb] { margin-top: -.3em; margin-bottom: 26px; }
.lg-examples__grid[b-agd52q7uxb] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.lg-example[b-agd52q7uxb] {
    text-align: left; cursor: pointer; background: var(--lg-paper);
    border: 1px solid var(--lg-line); border-radius: var(--lg-radius); padding: 20px 22px;
    box-shadow: var(--lg-shadow); transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
    display: flex; flex-direction: column; gap: 10px;
}
.lg-example:hover[b-agd52q7uxb] { transform: translateY(-2px); border-color: var(--lg-teal); box-shadow: var(--lg-shadow-lg); }
.lg-example__tag[b-agd52q7uxb] { font: 700 .72rem/1 var(--lg-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--lg-teal-600); }
.lg-example__text[b-agd52q7uxb] { font-family: var(--lg-serif); font-size: 1.05rem; color: var(--lg-navy); }

@media (max-width: 980px) {
    .lg-tool__grid[b-agd52q7uxb] { grid-template-columns: minmax(0,1fr); }
    .lg-tool__rail[b-agd52q7uxb] { position: static; }
    .lg-examples__grid[b-agd52q7uxb] { grid-template-columns: minmax(0,1fr); }
}
/* /Components/Pages/Learn.razor.rz.scp.css */
.ln-main[b-iqbgb1nt32] { max-width: 760px; }
.ln-lead[b-iqbgb1nt32] { font-size: 1.15rem; color: var(--lg-ink-soft); max-width: 38em; margin-bottom: 44px; }

.ln-unit[b-iqbgb1nt32] { margin-bottom: 40px; }
.ln-unit__head h2[b-iqbgb1nt32] { display: flex; align-items: baseline; gap: 12px; margin-bottom: .2em; }
/* Unit numbers are a real curriculum sequence, not decorative scaffolding. */
.ln-unit__num[b-iqbgb1nt32] { font: 700 .95rem/1.9 var(--lg-sans); color: var(--lg-teal-600);
    background: var(--lg-teal-100); border-radius: 8px; min-width: 1.9em; text-align: center;
    flex: 0 0 auto; align-self: center; }
.ln-unit__desc[b-iqbgb1nt32] { color: var(--lg-ink-soft); margin-bottom: 14px; max-width: 44em; }

.ln-lessons[b-iqbgb1nt32] { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ln-lesson[b-iqbgb1nt32] { display: flex; align-items: center; gap: 12px;
    background: var(--lg-paper); border: 1px solid var(--lg-line); border-radius: var(--lg-radius-s);
    padding: 13px 16px; color: var(--lg-ink); text-decoration: none;
    transition: border-color .12s ease, box-shadow .12s ease; }
.ln-lesson:hover[b-iqbgb1nt32] { text-decoration: none; border-color: var(--lg-teal); box-shadow: var(--lg-shadow); }
.ln-lesson__title[b-iqbgb1nt32] { font-weight: 600; color: var(--lg-navy); }
.ln-lesson__sounds[b-iqbgb1nt32] { margin-left: auto; color: var(--lg-crimson);
    font-family: 'Charis SIL','Doulos SIL','Gentium','Arial Unicode MS','Segoe UI','Noto Sans',sans-serif;
    font-size: .95rem; white-space: nowrap; }
.ln-lesson__go[b-iqbgb1nt32] { color: var(--lg-ink-faint); flex: 0 0 auto; }
.ln-lesson:hover .ln-lesson__go[b-iqbgb1nt32] { color: var(--lg-teal-600); }

.ln-unit--coming .ln-unit__head h2[b-iqbgb1nt32] { color: var(--lg-ink-soft); }
.ln-unit--coming .ln-unit__num[b-iqbgb1nt32] { color: var(--lg-ink-faint); background: var(--lg-surface-2); }
.ln-unit__soon[b-iqbgb1nt32] { color: var(--lg-ink-faint); font-size: .9rem; margin: 0; }

.ln-foot[b-iqbgb1nt32] { margin-top: 48px; font-size: .95rem; max-width: 44em; }

/* Dark theme (html.dark — set by the theme toggle / pre-paint script) */
:root.dark .ln-lesson__sounds[b-iqbgb1nt32] { color: #ef799b; }

@media (max-width: 480px) {
    .ln-lesson__sounds[b-iqbgb1nt32] { display: none; }
}
/* /Components/Pages/LessonView.razor.rz.scp.css */
.ln-main[b-o4qq4nxjaj] { max-width: 760px; }
.ln-crumb[b-o4qq4nxjaj] { font-size: .88rem; color: var(--lg-ink-soft); display: flex; gap: 8px; margin-bottom: 18px; }
.ln-lead[b-o4qq4nxjaj] { font-size: 1.12rem; color: var(--lg-ink-soft); max-width: 42em; margin-bottom: 36px; }

/* ── One taught sound ─────────────────────────────────── */
.ln-target[b-o4qq4nxjaj] { background: var(--lg-paper); border: 1px solid var(--lg-line);
    border-radius: var(--lg-radius); box-shadow: var(--lg-shadow);
    padding: 24px 26px; margin-bottom: 22px; }
.ln-target__head[b-o4qq4nxjaj] { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.ln-target__head h2[b-o4qq4nxjaj] { display: flex; align-items: baseline; gap: 12px; margin: 0; font-size: 1.35rem; }
.ln-target__label[b-o4qq4nxjaj] { font-family: var(--lg-sans); font-weight: 500; font-size: 1rem; color: var(--lg-ink-soft); }

.ln-ipa[b-o4qq4nxjaj] { font-family: 'Charis SIL','Doulos SIL','Gentium','Arial Unicode MS','Segoe UI','Noto Sans',sans-serif;
    font-size: 1.6rem; line-height: 1; }
/* Tier colours mirror the sound guide and the rendered notation. */
.ln-ipa--long[b-o4qq4nxjaj]  { color: #9f1239; font-weight: 700; }
.ln-ipa--short[b-o4qq4nxjaj] { color: #d8452f; font-weight: 600; }
.ln-ipa--schwa[b-o4qq4nxjaj] { color: #b06b78; font-weight: 600; }
.ln-ipa--cons[b-o4qq4nxjaj]  { color: #9f1239; font-weight: 600; }

.ln-feel[b-o4qq4nxjaj] { color: var(--lg-ink); max-width: 46em; margin-bottom: 18px; }

/* ── Play buttons (SayNative.playAudio toggles .is-playing) ── */
.ln-play[b-o4qq4nxjaj] { display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; flex: 0 0 auto;
    border: 1px solid var(--lg-line); border-radius: 999px;
    background: var(--lg-surface); color: var(--lg-teal); cursor: pointer;
    transition: border-color .12s ease, background .12s ease; }
.ln-play:hover[b-o4qq4nxjaj] { border-color: var(--lg-teal); background: var(--lg-teal-100); }
.ln-play--sm[b-o4qq4nxjaj] { width: 28px; height: 28px; }
.ln-ico-stop[b-o4qq4nxjaj] { display: none; }
.ln-play.is-playing[b-o4qq4nxjaj] { background: var(--lg-teal-100); border-color: var(--lg-teal); }
.ln-play.is-playing .ln-ico-play[b-o4qq4nxjaj] { display: none; }
.ln-play.is-playing .ln-ico-stop[b-o4qq4nxjaj] { display: block; }

/* ── Word sheets (rendered notation) ──────────────────── */
.ln-words[b-o4qq4nxjaj] { display: flex; flex-wrap: wrap; gap: 14px; }
.ln-word[b-o4qq4nxjaj] { margin: 0; }
/* The sheet stays white in both themes — it's the printed-paper metaphor. */
.ln-word__sheet[b-o4qq4nxjaj] { background: #fff; border: 1px solid var(--lg-line);
    border-radius: var(--lg-radius-s); overflow: hidden; }
.ln-word__sheet[b-o4qq4nxjaj]  svg { max-width: 100%; height: auto; display: block; }
.ln-word__cap[b-o4qq4nxjaj] { display: flex; align-items: center; gap: 8px; margin-top: 7px;
    font-size: .92rem; color: var(--lg-ink-soft); }
.ln-word__cap i[b-o4qq4nxjaj] { color: var(--lg-navy); font-size: 1.02rem; }
.ln-word--sample[b-o4qq4nxjaj] { margin-bottom: 28px; }
.ln-word--sample .ln-word__sheet[b-o4qq4nxjaj] { padding: 6px; }

/* ── Say-it practice ──────────────────────────────────── */
.ln-say[b-o4qq4nxjaj] { background: var(--lg-paper); border: 1px solid var(--lg-line);
    border-radius: var(--lg-radius); box-shadow: var(--lg-shadow);
    padding: 24px 26px; margin-bottom: 22px; }
.ln-say h2[b-o4qq4nxjaj] { font-size: 1.35rem; margin-bottom: .3em; }
.ln-say__how[b-o4qq4nxjaj] { color: var(--lg-ink-soft); max-width: 46em; margin-bottom: 18px; }

/* ── Vowel + ending combo tables ──────────────────────── */
.ln-combos[b-o4qq4nxjaj] { background: var(--lg-paper); border: 1px solid var(--lg-line);
    border-radius: var(--lg-radius); box-shadow: var(--lg-shadow);
    padding: 24px 26px; margin-bottom: 22px; }
.ln-combos h2[b-o4qq4nxjaj] { font-size: 1.35rem; margin-bottom: .3em; }
.ln-combos__scroll[b-o4qq4nxjaj] { overflow-x: auto; }
.ln-combos__table[b-o4qq4nxjaj] { width: 100%; border-collapse: collapse; }
.ln-combos__table tr[b-o4qq4nxjaj] { border-top: 1px solid var(--lg-line); }
.ln-combos__table tr:first-child[b-o4qq4nxjaj] { border-top: 0; }
.ln-combos__table th[b-o4qq4nxjaj] { text-align: left; white-space: nowrap; padding: 9px 18px 9px 2px;
    font-family: var(--lg-sans); font-weight: 600; color: var(--lg-navy); width: 1%; }
.ln-combos__v[b-o4qq4nxjaj] { font-size: 1.15rem; }
.ln-combos__plus[b-o4qq4nxjaj] { color: var(--lg-ink-faint); margin: 0 5px; }
.ln-combos__end[b-o4qq4nxjaj] { font-weight: 600; font-size: 1.05rem; line-height: 1; color: var(--lg-navy);
    font-family: 'Charis SIL','Doulos SIL','Gentium','Arial Unicode MS','Segoe UI','Noto Sans',sans-serif; }
.ln-combos__table td[b-o4qq4nxjaj] { padding: 8px 10px 8px 0; vertical-align: top; }
.ln-word--combo[b-o4qq4nxjaj] { margin: 0; }
.ln-word--combo .ln-word__cap[b-o4qq4nxjaj] { margin-top: 5px; font-size: .88rem; }

@media (max-width: 480px) {
    .ln-combos[b-o4qq4nxjaj] { padding: 18px 14px; }
    .ln-combos__table th[b-o4qq4nxjaj] { padding-right: 10px; }
}

/* ── Connected-speech phrases ─────────────────────────── */
.ln-phrases[b-o4qq4nxjaj] { background: var(--lg-paper); border: 1px solid var(--lg-line);
    border-radius: var(--lg-radius); box-shadow: var(--lg-shadow);
    padding: 24px 26px; margin-bottom: 22px; }
.ln-phrases h2[b-o4qq4nxjaj] { font-size: 1.35rem; margin-bottom: .3em; }
.ln-phrase-list[b-o4qq4nxjaj] { display: grid; gap: 16px; }
.ln-phrase .ln-word__sheet[b-o4qq4nxjaj] { max-width: 100%; overflow-x: auto; }

.ln-cta[b-o4qq4nxjaj] { margin: 4px 0 26px; }

/* ── Alphabet lesson: the A–Z grid ────────────────────── */
.ln-abc[b-o4qq4nxjaj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 12px; }
.ln-abc__card[b-o4qq4nxjaj] { display: flex; align-items: flex-start; gap: 13px;
    background: var(--lg-paper); border: 1px solid var(--lg-line);
    border-radius: var(--lg-radius-s); padding: 13px 15px; }
.ln-abc__letter[b-o4qq4nxjaj] { font-family: var(--lg-serif); font-weight: 700; font-size: 1.5rem;
    line-height: 1.2; color: var(--lg-navy); flex: 0 0 auto; min-width: 2em; }
.ln-abc__body[b-o4qq4nxjaj] { min-width: 0; }
.ln-abc__row[b-o4qq4nxjaj] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ln-abc__ipa[b-o4qq4nxjaj] { font-size: 1.15rem; }
.ln-abc__word[b-o4qq4nxjaj] { font-size: .9rem; color: var(--lg-ink-soft); }
.ln-abc__word i[b-o4qq4nxjaj] { color: var(--lg-navy); font-size: 1rem; }
.ln-abc__note[b-o4qq4nxjaj] { margin: 6px 0 0; font-size: .82rem; color: var(--lg-ink-faint);
    font-family: var(--lg-sans); line-height: 1.4; }

.ln-guide[b-o4qq4nxjaj] { margin-top: 8px; }
.ln-outro[b-o4qq4nxjaj] { color: var(--lg-ink-soft); max-width: 46em; margin: 26px 0 0; }

.ln-pager[b-o4qq4nxjaj] { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 36px; }

/* Dark theme (html.dark — set by the theme toggle / pre-paint script) */
:root.dark .ln-ipa--long[b-o4qq4nxjaj]  { color: #ef799b; }
:root.dark .ln-ipa--short[b-o4qq4nxjaj] { color: #f18a6e; }
:root.dark .ln-ipa--schwa[b-o4qq4nxjaj] { color: #d59aa6; }
:root.dark .ln-ipa--cons[b-o4qq4nxjaj]  { color: #ef799b; }

@media (max-width: 480px) {
    .ln-target[b-o4qq4nxjaj], .ln-say[b-o4qq4nxjaj] { padding: 18px 16px; }
    .ln-pager .lg-btn[b-o4qq4nxjaj] { flex: 1 1 100%; justify-content: center; }
}
/* /Components/Pages/Sounds.razor.rz.scp.css */
.snd-hero[b-lwszuz67xh] { padding: 52px 0 40px; }
.snd-hero .lg-hero__inner[b-lwszuz67xh] { max-width: 720px; }

.snd-guides[b-lwszuz67xh] { display: grid; gap: 24px; padding-top: 36px; padding-bottom: 8px; }
.snd-credit[b-lwszuz67xh] { color: var(--lg-ink-faint); font-size: .82rem; margin: 4px 0 0; text-align: center; }
/* /Components/Shared/HowToRead.razor.rz.scp.css */
.ht[b-yf6pkssqyb] { background: var(--lg-paper); border: 1px solid var(--lg-line); border-radius: var(--lg-radius);
    box-shadow: var(--lg-shadow); padding: 28px 30px; }
.ht__head[b-yf6pkssqyb] { margin-bottom: 20px; }
.ht__head h2[b-yf6pkssqyb] { margin-bottom: .15em; }
.ht__head p[b-yf6pkssqyb] { margin: 0; }

.ht__grid[b-yf6pkssqyb] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 36px; }
.ht__item[b-yf6pkssqyb] { display: flex; align-items: center; gap: 16px; padding: 6px 0;
    border-bottom: 1px solid var(--lg-surface-2); }
.ht__item:last-child[b-yf6pkssqyb], .ht__item:nth-last-child(2)[b-yf6pkssqyb] { border-bottom: none; }

/* Play button — small round demo trigger; invisible spacer keeps rows aligned */
.ht__play[b-yf6pkssqyb] { flex: 0 0 28px; width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--lg-line); border-radius: 50%; background: var(--lg-surface); color: var(--lg-teal);
    cursor: pointer; transition: background .12s ease, border-color .12s ease; }
.ht__play:hover[b-yf6pkssqyb] { background: var(--lg-teal-100); border-color: var(--lg-teal); }
.ht__play--none[b-yf6pkssqyb] { visibility: hidden; cursor: default; }
.ht__ico-stop[b-yf6pkssqyb] { display: none; }
.ht__play.is-playing[b-yf6pkssqyb] { background: var(--lg-teal-100); border-color: var(--lg-teal); }
.ht__play.is-playing .ht__ico-play[b-yf6pkssqyb] { display: none; }
.ht__play.is-playing .ht__ico-stop[b-yf6pkssqyb] { display: block; }

/* Example cell — fixed width so all labels line up */
.ht__eg[b-yf6pkssqyb] { flex: 0 0 88px; display: flex; align-items: center; justify-content: center; min-height: 40px; }
.ht__label[b-yf6pkssqyb] { color: var(--lg-ink-soft); font-size: .95rem; }
.ht__label b[b-yf6pkssqyb] { color: var(--lg-navy); font-weight: 600; }

/* Tokens: IPA stacked above the letters, like the result */
.ht__tok[b-yf6pkssqyb] { display: inline-flex; flex-direction: column; align-items: center; line-height: 1.05; }
.ht__ipa[b-yf6pkssqyb] { font-family: 'Charis SIL','Doulos SIL','Gentium','Arial Unicode MS','Segoe UI','Noto Sans',sans-serif;
    font-size: .72rem; color: var(--lg-crimson); font-weight: 600; }
.ht__ipa--weak[b-yf6pkssqyb] { color: #cc9999; }
.ht__ipa--silent[b-yf6pkssqyb] { color: #b0b6be; }
.ht__letters[b-yf6pkssqyb] { font-family: var(--lg-serif); font-size: 1.25rem; color: var(--lg-ink); }

.ht__stress[b-yf6pkssqyb] { background: #cfe0f7; color: var(--lg-navy); font-weight: 700;
    border-radius: 5px; padding: 0 5px; }
.ht__weak[b-yf6pkssqyb] { color: var(--lg-ink-soft); font-size: 1.05rem; }
.ht__silent[b-yf6pkssqyb] { color: var(--lg-ink-faint); opacity: .5; }
.ht__underline[b-yf6pkssqyb] { border-bottom: 2px solid var(--lg-ink-soft); padding-bottom: 1px; }
.ht__dot[b-yf6pkssqyb] { color: var(--lg-ink-faint); margin: 0 1px; }
.ht__link[b-yf6pkssqyb] { color: var(--lg-teal); font-weight: 700; }
.ht__arrow[b-yf6pkssqyb] { color: var(--lg-teal); font-weight: 700; font-size: 1.1rem; margin-left: 4px; }
.ht__sup[b-yf6pkssqyb] { font-size: .7rem; font-weight: 700; vertical-align: super; margin-left: 1px; }
.ht__sup--het[b-yf6pkssqyb] { color: #b45309; }
.ht__sup--unc[b-yf6pkssqyb] { color: #7c3aed; }

/* Dark theme (html.dark — set by the theme toggle / pre-paint script) */
:root.dark .ht__stress[b-yf6pkssqyb] { background: #2a415f; }
:root.dark .ht__ipa--weak[b-yf6pkssqyb] { color: #b98a8a; }
:root.dark .ht__ipa--silent[b-yf6pkssqyb] { color: #6d7683; }
:root.dark .ht__sup--het[b-yf6pkssqyb] { color: #e0a04a; }
:root.dark .ht__sup--unc[b-yf6pkssqyb] { color: #b696f5; }

@media (max-width: 760px) {
    .ht__grid[b-yf6pkssqyb] { grid-template-columns: 1fr; }
    .ht__item:nth-last-child(2)[b-yf6pkssqyb] { border-bottom: 1px solid var(--lg-surface-2); }
}
/* /Components/Shared/LessonNav.razor.rz.scp.css */
.lnav-box[b-p5qnr7643h] { font-family: var(--lg-sans); }

/* ── Mobile toggle (hidden on desktop) ─────────────────── */
.lnav-toggle[b-p5qnr7643h] { display: none; width: 100%; align-items: center; justify-content: space-between;
    gap: 10px; padding: 12px 16px; border: 1px solid var(--lg-line); border-radius: var(--lg-radius-s);
    background: var(--lg-paper); color: var(--lg-navy); font: 600 .95rem/1 var(--lg-sans);
    cursor: pointer; }
.lnav-toggle svg[b-p5qnr7643h] { transition: transform .15s ease; color: var(--lg-ink-faint); }
.lnav-toggle[aria-expanded="true"] svg[b-p5qnr7643h] { transform: rotate(180deg); }

/* ── Units: native disclosure groups ───────────────────── */
.lnav[b-p5qnr7643h] { interpolate-size: allow-keywords; }
.lnav__unit[b-p5qnr7643h] { margin-bottom: 2px; }
.lnav__head[b-p5qnr7643h] { display: flex; align-items: center; gap: 9px; padding: 7px 8px;
    border-radius: 8px; list-style: none; }
summary.lnav__head[b-p5qnr7643h] { cursor: pointer; user-select: none; -webkit-user-select: none;
    transition: background .15s ease; }
summary.lnav__head[b-p5qnr7643h]::-webkit-details-marker { display: none; }
summary.lnav__head:hover[b-p5qnr7643h] { background: var(--lg-surface-2); }
.lnav__num[b-p5qnr7643h] { font: 700 .78rem/1.7 var(--lg-sans); color: var(--lg-teal-600);
    background: var(--lg-teal-100); border-radius: 6px; min-width: 1.7em; text-align: center;
    flex: 0 0 auto; }
.lnav__unit-title[b-p5qnr7643h] { flex: 1; font-weight: 700; font-size: .92rem; line-height: 1.3;
    color: var(--lg-navy); }
.lnav__count[b-p5qnr7643h] { flex: 0 0 auto; font-size: .72rem; font-weight: 600;
    font-variant-numeric: tabular-nums; color: var(--lg-ink-faint); }
.lnav__chev[b-p5qnr7643h] { flex: 0 0 auto; color: var(--lg-ink-faint); transition: transform .18s ease; }
details[open] > .lnav__head .lnav__chev[b-p5qnr7643h] { transform: rotate(180deg); }

/* Smooth expand where ::details-content is supported; instant elsewhere. */
details.lnav__unit[b-p5qnr7643h]::details-content { block-size: 0; overflow-y: clip;
    transition: content-visibility .2s allow-discrete, block-size .2s cubic-bezier(.22, 1, .36, 1); }
details.lnav__unit[open][b-p5qnr7643h]::details-content { block-size: auto; }

.lnav__soon[b-p5qnr7643h] { font-size: .68rem; font-weight: 600; letter-spacing: .05em;
    text-transform: uppercase; color: var(--lg-ink-faint);
    border: 1px solid var(--lg-line); border-radius: 999px; padding: 2px 8px; }
.lnav__unit--coming .lnav__unit-title[b-p5qnr7643h] { color: var(--lg-ink-soft); font-weight: 600; }
.lnav__unit--coming .lnav__num[b-p5qnr7643h] { color: var(--lg-ink-faint); background: var(--lg-surface-2); }

/* ── Sections & lessons (indented under the unit) ──────── */
.lnav__body[b-p5qnr7643h] { padding: 2px 0 8px; }
.lnav__group[b-p5qnr7643h] { margin-left: 15px; padding-left: 13px; border-left: 1px solid var(--lg-line); }
.lnav__section[b-p5qnr7643h] { margin: 10px 0 3px; font: 700 .7rem/1.4 var(--lg-sans);
    letter-spacing: .08em; text-transform: uppercase; color: var(--lg-ink-faint); }
.lnav__list[b-p5qnr7643h] { list-style: none; margin: 0 0 4px; padding: 0; }
.lnav__lesson[b-p5qnr7643h] { display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
    padding: 5px 8px; margin: 1px 0; border-radius: 7px;
    color: var(--lg-ink-soft); text-decoration: none; font-size: .9rem; line-height: 1.35;
    transition: background .15s ease, color .15s ease; }
.lnav__lesson:hover[b-p5qnr7643h] { background: var(--lg-surface-2); color: var(--lg-navy); text-decoration: none; }
.lnav__lesson.is-active[b-p5qnr7643h] { background: var(--lg-teal-100); color: var(--lg-teal-600); font-weight: 600; }
.lnav__ipa[b-p5qnr7643h] { flex: 0 0 auto; color: var(--lg-crimson); font-size: .8rem; white-space: nowrap;
    font-family: 'Charis SIL','Doulos SIL','Gentium','Arial Unicode MS','Segoe UI','Noto Sans',sans-serif; }
.lnav__lesson.is-active .lnav__ipa[b-p5qnr7643h] { color: inherit; }

/* Dark theme (html.dark — set by the theme toggle / pre-paint script) */
:root.dark .lnav__ipa[b-p5qnr7643h] { color: #ef799b; }
:root.dark .lnav__lesson.is-active .lnav__ipa[b-p5qnr7643h] { color: inherit; }

@media (prefers-reduced-motion: reduce) {
    .lnav-toggle svg[b-p5qnr7643h], .lnav__chev[b-p5qnr7643h], .lnav__lesson[b-p5qnr7643h], summary.lnav__head[b-p5qnr7643h] { transition: none; }
    details.lnav__unit[b-p5qnr7643h]::details-content { transition: none; }
}

/* ── Mobile: collapse behind the toggle ────────────────── */
@media (max-width: 940px) {
    .lnav-toggle[b-p5qnr7643h] { display: flex; }
    .lnav[b-p5qnr7643h] { display: none; padding: 12px 10px 6px; margin-top: 8px;
        border: 1px solid var(--lg-line); border-radius: var(--lg-radius-s);
        background: var(--lg-paper); }
    .lnav.is-open[b-p5qnr7643h] { display: block; }
}
/* /Components/Shared/SoundGuide.razor.rz.scp.css */
.sg[b-denlklj0gb] { background: var(--lg-paper); border: 1px solid var(--lg-line); border-radius: var(--lg-radius);
    box-shadow: var(--lg-shadow); padding: 28px 30px; }
.sg__head[b-denlklj0gb] { margin-bottom: 22px; }
.sg__head h2[b-denlklj0gb] { margin-bottom: .15em; }
.sg__head p[b-denlklj0gb] { margin: 0; }
.sg__head b[b-denlklj0gb] { color: var(--lg-navy); }

.sg__grid[b-denlklj0gb] { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 36px; }
/* Consonants block holds the most items — let it span both columns. */
.sg__group:last-child[b-denlklj0gb] { grid-column: 1 / -1; }

.sg__group-head[b-denlklj0gb] { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px;
    padding-bottom: 8px; border-bottom: 1px solid var(--lg-surface-2); flex-wrap: wrap; }
.sg__group-head h3[b-denlklj0gb] { margin: 0; font-size: 1.05rem; }
.sg__note[b-denlklj0gb] { font-size: .82rem; color: var(--lg-ink-faint); }

.sg__chips[b-denlklj0gb] { display: flex; flex-wrap: wrap; gap: 10px; }

/* A chip is two joined buttons: [▶ symbol | as in word] */
.sg__chip[b-denlklj0gb] { display: inline-flex; align-items: stretch;
    background: var(--lg-surface); border: 1px solid var(--lg-line); border-radius: 999px;
    overflow: hidden; transition: border-color .12s ease, box-shadow .12s ease; }
.sg__chip:hover[b-denlklj0gb] { border-color: var(--lg-teal); box-shadow: var(--lg-shadow); }

.sg__play[b-denlklj0gb], .sg__word[b-denlklj0gb] { border: none; background: transparent; cursor: pointer;
    display: inline-flex; align-items: center; font-family: var(--lg-sans); }
.sg__play[b-denlklj0gb] { gap: 7px; padding: 6px 8px 6px 12px; }
.sg__word[b-denlklj0gb] { padding: 6px 13px 6px 8px; font-size: .82rem; color: var(--lg-ink-soft);
    border-left: 1px solid var(--lg-line); gap: 4px; }
.sg__word i[b-denlklj0gb] { color: var(--lg-navy); font-style: italic; font-size: .95rem; }
.sg__play:hover[b-denlklj0gb], .sg__word:hover[b-denlklj0gb] { background: var(--lg-teal-100); }

.sg__play-ico[b-denlklj0gb] { color: var(--lg-teal); flex: 0 0 auto; }
.sg__ico-stop[b-denlklj0gb] { display: none; }
.sg__play.is-playing .sg__ico-play[b-denlklj0gb] { display: none; }
.sg__play.is-playing .sg__ico-stop[b-denlklj0gb] { display: block; }
.sg__play.is-playing[b-denlklj0gb] { background: var(--lg-teal-100); }
.sg__word.is-playing[b-denlklj0gb] { background: var(--lg-teal-100); }

.sg__ipa[b-denlklj0gb] { font-family: 'Charis SIL','Doulos SIL','Gentium','Arial Unicode MS','Segoe UI','Noto Sans',sans-serif;
    font-size: 1.18rem; line-height: 1; }

/* Tier colours — mirror the result: long/diphthong dark, short medium, schwa light */
.sg__ipa--long[b-denlklj0gb]  { color: #9f1239; font-weight: 700; }
.sg__ipa--short[b-denlklj0gb] { color: #d8452f; font-weight: 600; }
.sg__ipa--schwa[b-denlklj0gb] { color: #b06b78; font-weight: 600; }
.sg__ipa--cons[b-denlklj0gb]  { color: #9f1239; font-weight: 600; }

/* Dark theme (html.dark — set by the theme toggle / pre-paint script) */
:root.dark .sg__ipa--long[b-denlklj0gb]  { color: #ef799b; }
:root.dark .sg__ipa--short[b-denlklj0gb] { color: #f18a6e; }
:root.dark .sg__ipa--schwa[b-denlklj0gb] { color: #d59aa6; }
:root.dark .sg__ipa--cons[b-denlklj0gb]  { color: #ef799b; }

@media (max-width: 760px) {
    .sg__grid[b-denlklj0gb] { grid-template-columns: 1fr; gap: 22px; }
}