* {
    box-sizing: border-box;
}


html {
    margin: 0;
    padding: 0;
}


body {
    margin: 0;
    padding: 0;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif;

    background: #f7f5f2;
    color: #2f2f2f;
}


button,
input,
textarea,
select {
    font: inherit;
}


button {
    cursor: pointer;
}


.app {
    width: 100%;
    max-width: 720px;
    min-height: 100vh;

    margin: 0 auto;

    background: #f7f5f2;

    padding-bottom: 92px;
}


/* -------------------------------------------------- */
/* ЭКРАНЫ */
/* -------------------------------------------------- */

.screen {
    display: none;

    width: 100%;
    min-height: calc(100vh - 92px);

    padding: 20px 16px 32px;
}


.screen.active-screen {
    display: block;
}


/* -------------------------------------------------- */
/* ОБЩИЕ ЭЛЕМЕНТЫ */
/* -------------------------------------------------- */

.page-heading {
    margin-bottom: 20px;
}


.page-heading h2 {
    margin: 0 0 8px;

    font-size: 26px;
    line-height: 1.2;

    color: #292929;
}


.page-heading p {
    margin: 0;

    font-size: 15px;
    line-height: 1.5;

    color: #6d6d6d;
}


.page-content {
    width: 100%;
}


.loading {
    padding: 24px 16px;

    text-align: center;

    color: #777;

    font-size: 15px;
    line-height: 1.5;
}


.error-message {
    padding: 16px;

    border-radius: 16px;

    background: #fff0f0;

    color: #9b3838;

    font-size: 14px;
    line-height: 1.5;
}


.empty-message {
    padding: 24px 16px;

    border-radius: 18px;

    background: #ffffff;

    text-align: center;

    color: #777;

    font-size: 15px;
    line-height: 1.5;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.04);
}


.back-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 40px;

    margin: 0 0 18px;
    padding: 8px 12px;

    border: 0;
    border-radius: 12px;

    background: #ebe6df;

    color: #4e4e4e;

    font-size: 14px;
    font-weight: 600;
}


.back-button:active {
    transform: scale(0.98);
}


/* -------------------------------------------------- */
/* ГЛАВНАЯ */
/* -------------------------------------------------- */

#homeScreen {
    padding-top: 0;
}


.hero {
    padding:
        30px
        20px
        28px;

    margin:
        0
        -16px
        20px;

    background:
        linear-gradient(
            145deg,
            #fff1dc,
            #f7e7df
        );

    border-radius:
        0
        0
        28px
        28px;
}


.hero-badge {
    display: inline-flex;

    margin-bottom: 14px;
    padding: 7px 11px;

    border-radius: 999px;

    background:
        rgba(255, 255, 255, 0.72);

    color: #74594c;

    font-size: 13px;
    font-weight: 700;
}


.hero h1 {
    max-width: 500px;

    margin: 0 0 12px;

    font-size: 32px;
    line-height: 1.08;

    color: #3a302b;
}


.hero p {
    max-width: 520px;

    margin: 0;

    color: #6e5f57;

    font-size: 16px;
    line-height: 1.5;
}


.main-content {
    width: 100%;
}


/* -------------------------------------------------- */
/* ТЕКУЩАЯ НЕДЕЛЯ */
/* -------------------------------------------------- */

.current-card {
    padding: 20px;

    border-radius: 22px;

    background: #ffffff;

    box-shadow:
        0 6px 22px
        rgba(0, 0, 0, 0.055);
}


.current-card-label {
    margin-bottom: 7px;

    color: #8c7569;

    font-size: 13px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.04em;
}


.current-card h2 {
    margin: 0 0 8px;

    font-size: 23px;
    line-height: 1.25;

    color: #34302e;
}


.current-card p {
    margin: 0;

    color: #68615e;

    font-size: 15px;
    line-height: 1.5;
}


/* -------------------------------------------------- */
/* МЕНЮ НА ГЛАВНОЙ */
/* -------------------------------------------------- */

.menu-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 12px;

    margin-top: 16px;
}


.menu-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    min-height: 148px;

    padding: 17px;

    border: 0;
    border-radius: 20px;

    background: #ffffff;

    text-align: left;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.045);
}


.menu-card:active {
    transform: scale(0.985);
}


.menu-icon {
    display: block;

    margin-bottom: 13px;

    font-size: 27px;
}


.menu-title {
    display: block;

    margin-bottom: 7px;

    color: #333;

    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
}


.menu-description {
    display: block;

    color: #777;

    font-size: 13px;
    line-height: 1.4;
}


.urgent-card {
    background: #fff6f4;
}


.premium-menu-card {
    background:
        linear-gradient(
            145deg,
            #fff8e9,
            #f8efe6
        );
}


/* -------------------------------------------------- */
/* ОБЩИЕ КАРТОЧКИ */
/* -------------------------------------------------- */

.info-card {
    margin-top: 12px;
    padding: 18px;

    border-radius: 18px;

    background: #ffffff;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.04);
}


.info-card h3 {
    margin: 0 0 9px;

    color: #373330;

    font-size: 17px;
    line-height: 1.3;
}


.info-card p {
    margin: 0;

    color: #666;

    font-size: 14px;
    line-height: 1.55;
}


.info-card ul,
.info-card ol {
    margin:
        10px
        0
        0;

    padding-left: 21px;

    color: #5e5e5e;

    font-size: 14px;
    line-height: 1.55;
}


.info-card li + li {
    margin-top: 6px;
}


/* -------------------------------------------------- */
/* БАЗА ЗНАНИЙ */
/* -------------------------------------------------- */

.library-search {
    margin-bottom: 18px;
}


.search-input-row {
    display: flex;
    gap: 8px;
}


.search-input {
    flex: 1;

    min-width: 0;
    min-height: 46px;

    padding: 11px 13px;

    border:
        1px solid
        #ddd6cf;

    border-radius: 14px;

    outline: none;

    background: #ffffff;

    color: #333;

    font-size: 14px;
}


.search-input:focus {
    border-color: #b99c8b;

    box-shadow:
        0 0 0 3px
        rgba(185, 156, 139, 0.12);
}


.search-button {
    min-height: 46px;

    padding: 10px 15px;

    border: 0;
    border-radius: 14px;

    background: #8c6e5f;

    color: #ffffff;

    font-size: 14px;
    font-weight: 700;
}


.clear-search-button {
    display: none;

    margin-top: 8px;
    padding: 7px 4px;

    border: 0;

    background: transparent;

    color: #8a756a;

    font-size: 13px;
}


.search-results {
    margin-bottom: 14px;
}


.library-list {
    display: flex;
    flex-direction: column;

    gap: 10px;
}


.library-category,
.library-article,
.favorite-card {
    width: 100%;

    padding: 16px;

    border: 0;
    border-radius: 18px;

    background: #ffffff;

    text-align: left;

    box-shadow:
        0 4px 16px
        rgba(0, 0, 0, 0.04);
}


.library-category:active,
.library-article:active,
.favorite-card:active {
    transform: scale(0.99);
}


.library-category-title,
.library-article-title {
    display: block;

    margin-bottom: 5px;

    color: #373330;

    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
}


.library-category-description,
.library-article-description {
    display: block;

    color: #777;

    font-size: 13px;
    line-height: 1.45;
}


/* -------------------------------------------------- */
/* СТАТЬИ */
/* -------------------------------------------------- */

.article-title {
    margin: 0 0 15px;

    color: #302e2d;

    font-size: 26px;
    line-height: 1.2;
}


.article-intro {
    margin-bottom: 16px;

    color: #68615e;

    font-size: 15px;
    line-height: 1.6;
}


.article-section {
    margin-top: 14px;
    padding: 18px;

    border-radius: 18px;

    background: #ffffff;
}


.article-section h3 {
    margin: 0 0 10px;

    color: #373330;

    font-size: 17px;
    line-height: 1.35;
}


.article-section p {
    margin: 0;

    color: #606060;

    font-size: 14px;
    line-height: 1.6;
}


.article-section ul,
.article-section ol {
    margin: 0;
    padding-left: 21px;

    color: #606060;

    font-size: 14px;
    line-height: 1.6;
}


.article-section li + li {
    margin-top: 7px;
}


.favorite-button {
    width: 100%;

    margin-top: 16px;
    padding: 13px 16px;

    border:
        1px solid
        #dfd5cd;

    border-radius: 15px;

    background: #ffffff;

    color: #66554d;

    font-size: 14px;
    font-weight: 700;
}


.favorite-button.is-favorite {
    background: #fff3d7;
    border-color: #ead49e;
}/* -------------------------------------------------- */
/* МНЕ НУЖНО СЕЙЧАС */
/* -------------------------------------------------- */

.help-list {
    display: flex;
    flex-direction: column;

    gap: 10px;
}


.help-item {
    width: 100%;

    padding: 16px;

    border: 0;
    border-radius: 18px;

    background: #ffffff;

    text-align: left;

    box-shadow:
        0 4px 16px
        rgba(0, 0, 0, 0.04);
}


.help-item:active {
    transform: scale(0.99);
}


.help-item-title {
    display: block;

    margin-bottom: 5px;

    color: #373330;

    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
}


.help-item-description {
    display: block;

    color: #777;

    font-size: 13px;
    line-height: 1.45;
}


.help-section {
    margin-top: 14px;
    padding: 18px;

    border-radius: 18px;

    background: #ffffff;
}


.help-section h3 {
    margin: 0 0 10px;

    color: #373330;

    font-size: 17px;
    line-height: 1.35;
}


.help-section p {
    margin: 0;

    color: #606060;

    font-size: 14px;
    line-height: 1.6;
}


.help-section ul,
.help-section ol {
    margin: 0;
    padding-left: 21px;

    color: #606060;

    font-size: 14px;
    line-height: 1.6;
}


.help-section li + li {
    margin-top: 7px;
}


.help-section.warning {
    background: #fff6f1;

    border:
        1px solid
        #f1d7c9;
}


.red-flags {
    color: #70483b;
}


.urgent-box {
    margin-top: 14px;
    padding: 16px;

    border-radius: 16px;

    background: #fde8e8;

    color: #8b3434;

    font-size: 14px;
    font-weight: 600;
    line-height: 1.55;
}


.medical-note {
    margin-top: 16px;
    padding: 14px;

    border-radius: 14px;

    background: #efede9;

    color: #77716d;

    font-size: 12px;
    line-height: 1.5;
}


/* -------------------------------------------------- */
/* ПРОГРАММЫ */
/* -------------------------------------------------- */

.programs-content {
    display: flex;
    flex-direction: column;

    gap: 14px;
}


.programs-section-title {
    margin-top: 10px;
}


.programs-section-title h3 {
    margin: 0 0 5px;

    color: #373330;

    font-size: 20px;
    line-height: 1.3;
}


.programs-section-title p {
    margin: 0;

    color: #777;

    font-size: 14px;
    line-height: 1.45;
}


.premium-card {
    padding: 20px;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #fff4d9,
            #f7e7dc
        );

    box-shadow:
        0 6px 22px
        rgba(0, 0, 0, 0.05);
}


.premium-badge {
    display: inline-flex;

    margin-bottom: 12px;
    padding: 6px 10px;

    border-radius: 999px;

    background:
        rgba(255, 255, 255, 0.72);

    color: #795d4e;

    font-size: 12px;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: 0.03em;
}


.premium-card h3 {
    margin: 0 0 9px;

    color: #3a302b;

    font-size: 21px;
    line-height: 1.3;
}


.premium-card > p {
    margin: 0;

    color: #6e5f57;

    font-size: 14px;
    line-height: 1.55;
}


.premium-features {
    margin:
        15px
        0
        0;

    padding-left: 21px;

    color: #655a54;

    font-size: 14px;
    line-height: 1.5;
}


.premium-features li + li {
    margin-top: 7px;
}


.premium-price-row {
    margin-top: 18px;
}


.program-card {
    padding: 18px;

    border-radius: 20px;

    background: #ffffff;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.045);
}


.program-card-header {
    display: flex;
    align-items: flex-start;

    gap: 12px;
}


.program-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 46px;
    height: 46px;

    border-radius: 14px;

    background: #f6f0eb;

    font-size: 24px;
}


.program-card-title {
    flex: 1;
}


.program-card-title h3 {
    margin: 0 0 5px;

    color: #35312f;

    font-size: 17px;
    line-height: 1.35;
}


.program-card-title p {
    margin: 0;

    color: #777;

    font-size: 13px;
    line-height: 1.45;
}


.program-meta {
    display: flex;
    flex-wrap: wrap;

    gap: 7px;

    margin-top: 14px;
}


.program-meta-item {
    padding: 6px 9px;

    border-radius: 999px;

    background: #f5f2ef;

    color: #706964;

    font-size: 12px;
    line-height: 1.2;
}


.program-price {
    margin-top: 15px;

    color: #4e433e;

    font-size: 15px;
    font-weight: 700;
}


.program-price-note {
    display: block;

    margin-top: 3px;

    color: #8a837f;

    font-size: 11px;
    font-weight: 400;
}


.program-button {
    width: 100%;

    margin-top: 14px;
    padding: 13px 15px;

    border: 0;
    border-radius: 14px;

    background: #8c6e5f;

    color: #ffffff;

    font-size: 14px;
    font-weight: 700;
}


.program-button:active {
    transform: scale(0.99);
}


.program-button.owned {
    background: #e8f2e8;

    color: #47704d;

    border:
        1px solid
        #cfe2d1;
}


.program-access-note {
    margin-top: 12px;
    padding: 13px;

    border-radius: 14px;

    background: #f4f1ee;

    color: #756e69;

    font-size: 12px;
    line-height: 1.5;
}


/* -------------------------------------------------- */
/* ПРОФИЛЬ */
/* -------------------------------------------------- */

.profile-form {
    margin-top: 14px;
}


.profile-field {
    margin-bottom: 14px;
}


.profile-field label {
    display: block;

    margin-bottom: 7px;

    color: #4d4845;

    font-size: 13px;
    font-weight: 700;
}


.profile-field input,
.profile-field select {
    width: 100%;
    min-height: 48px;

    padding: 11px 13px;

    border:
        1px solid
        #ddd6cf;

    border-radius: 14px;

    outline: none;

    background: #ffffff;

    color: #333;
}


.profile-field input:focus,
.profile-field select:focus {
    border-color: #b99c8b;

    box-shadow:
        0 0 0 3px
        rgba(185, 156, 139, 0.12);
}


.small-menu-button {
    border:
        1px solid
        #ded7d1;

    border-radius: 14px;

    background: #ffffff;

    color: #514a46;

    font-weight: 700;
}


.small-menu-button:active {
    transform: scale(0.99);
}


/* -------------------------------------------------- */
/* ОБРАТНАЯ СВЯЗЬ */
/* -------------------------------------------------- */

.feedback-content {
    width: 100%;
}


.feedback-card {
    padding: 18px;

    border-radius: 20px;

    background: #ffffff;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.045);
}


.feedback-question {
    margin: 0 0 14px;

    color: #373330;

    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
}


.feedback-types {
    display: flex;
    flex-direction: column;

    gap: 9px;
}


.feedback-type-button {
    display: flex;
    align-items: center;

    width: 100%;
    min-height: 50px;

    padding: 12px 14px;

    border:
        1px solid
        #e2ddd8;

    border-radius: 15px;

    background: #faf9f7;

    color: #4b4744;

    text-align: left;

    font-size: 14px;
    font-weight: 600;

    transition:
        border-color 0.15s ease,
        background 0.15s ease,
        transform 0.1s ease;
}


.feedback-type-button:active {
    transform: scale(0.99);
}


.feedback-type-button.selected {
    border-color: #b89a89;

    background: #f8eee8;

    color: #654f43;
}


.feedback-form-section {
    margin-top: 20px;
}


.feedback-label {
    display: block;

    margin-bottom: 8px;

    color: #4d4845;

    font-size: 14px;
    font-weight: 700;
}


.feedback-textarea {
    display: block;

    width: 100%;
    min-height: 150px;

    padding: 13px 14px;

    resize: vertical;

    border:
        1px solid
        #ddd6cf;

    border-radius: 15px;

    outline: none;

    background: #ffffff;

    color: #333;

    font-size: 15px;
    line-height: 1.5;
}


.feedback-textarea::placeholder {
    color: #aaa29d;
}


.feedback-textarea:focus {
    border-color: #b99c8b;

    box-shadow:
        0 0 0 3px
        rgba(185, 156, 139, 0.12);
}


.feedback-textarea-row {
    display: flex;
    justify-content: flex-end;

    margin-top: 6px;
}


.feedback-counter {
    color: #96908c;

    font-size: 11px;
}


.feedback-privacy-note {
    margin-top: 15px;
    padding: 13px;

    border-radius: 14px;

    background: #f4f1ee;

    color: #716b67;

    font-size: 12px;
    line-height: 1.5;
}


.feedback-privacy-note strong {
    color: #554f4b;
}


.feedback-submit-button {
    width: 100%;

    margin-top: 16px;
    padding: 14px 16px;

    border: 0;
    border-radius: 15px;

    background: #8c6e5f;

    color: #ffffff;

    font-size: 15px;
    font-weight: 700;
}


.feedback-submit-button:active {
    transform: scale(0.99);
}


.feedback-submit-button:disabled {
    cursor: default;

    opacity: 0.55;

    transform: none;
}


.feedback-form-error {
    display: none;

    margin-top: 12px;
    padding: 12px 13px;

    border-radius: 13px;

    background: #fff0f0;

    color: #963e3e;

    font-size: 13px;
    line-height: 1.45;
}


.feedback-form-error.visible {
    display: block;
}


/* -------------------------------------------------- */
/* УСПЕШНАЯ ОТПРАВКА ОБРАТНОЙ СВЯЗИ */
/* -------------------------------------------------- */

.feedback-success {
    padding: 28px 20px;

    border-radius: 22px;

    background: #ffffff;

    text-align: center;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.045);
}


.feedback-success-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 62px;
    height: 62px;

    margin:
        0
        auto
        16px;

    border-radius: 50%;

    background: #e8f2e8;

    color: #4e7853;

    font-size: 30px;
    font-weight: 800;
}


.feedback-success h3 {
    margin: 0 0 9px;

    color: #373330;

    font-size: 22px;
    line-height: 1.3;
}


.feedback-success p {
    max-width: 420px;

    margin:
        0
        auto;

    color: #777;

    font-size: 14px;
    line-height: 1.55;
}


.feedback-success-button {
    width: 100%;

    margin-top: 20px;
    padding: 14px 16px;

    border: 0;
    border-radius: 15px;

    background: #8c6e5f;

    color: #ffffff;

    font-size: 15px;
    font-weight: 700;
}


.feedback-success-button:active {
    transform: scale(0.99);
}/* -------------------------------------------------- */
/* ИЗБРАННОЕ */
/* -------------------------------------------------- */

.favorite-card {
    position: relative;
}


.favorite-card-meta {
    display: block;

    margin-top: 7px;

    color: #9a928d;

    font-size: 11px;
    line-height: 1.4;
}


/* -------------------------------------------------- */
/* НИЖНЯЯ НАВИГАЦИЯ */
/* -------------------------------------------------- */

.bottom-nav {
    position: fixed;

    left: 50%;
    bottom: 0;

    z-index: 100;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    width: 100%;
    max-width: 720px;

    min-height: 72px;

    transform: translateX(-50%);

    padding:
        8px
        8px
        calc(8px + env(safe-area-inset-bottom));

    border-top:
        1px solid
        #e8e3df;

    background:
        rgba(255, 255, 255, 0.96);

    box-shadow:
        0 -5px 20px
        rgba(0, 0, 0, 0.035);

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}


.nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 3px;

    min-width: 0;

    padding: 5px 2px;

    border: 0;
    border-radius: 13px;

    background: transparent;

    color: #98918c;
}


.nav-item span {
    font-size: 20px;
    line-height: 1;
}


.nav-item small {
    font-size: 10px;
    line-height: 1.2;

    white-space: nowrap;
}


.nav-item.active-nav {
    background: #f5eee9;

    color: #745b4e;
}


/* -------------------------------------------------- */
/* ДОПОЛНИТЕЛЬНЫЕ СОСТОЯНИЯ КНОПОК */
/* -------------------------------------------------- */

.search-button:disabled,
.program-button:disabled,
.small-menu-button:disabled,
.favorite-button:disabled {
    cursor: default;

    opacity: 0.55;
}


.search-button:active,
.small-menu-button:active,
.favorite-button:active {
    transform: scale(0.99);
}


/* -------------------------------------------------- */
/* СКРОЛЛ */
/* -------------------------------------------------- */

body {
    overflow-x: hidden;
}


.screen {
    overflow-x: hidden;
}


/* -------------------------------------------------- */
/* ДОСТУПНОСТЬ */
/* -------------------------------------------------- */

button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline:
        3px solid
        rgba(140, 110, 95, 0.22);

    outline-offset: 2px;
}


/* -------------------------------------------------- */
/* АДАПТАЦИЯ */
/* -------------------------------------------------- */

@media (max-width: 520px) {

    .screen {
        padding:
            18px
            14px
            28px;
    }


    #homeScreen {
        padding-top: 0;
    }


    .hero {
        margin:
            0
            -14px
            18px;

        padding:
            27px
            18px
            25px;

        border-radius:
            0
            0
            25px
            25px;
    }


    .hero h1 {
        font-size: 29px;
    }


    .hero p {
        font-size: 15px;
    }


    .menu-grid {
        gap: 10px;
    }


    .menu-card {
        min-height: 142px;

        padding: 15px;

        border-radius: 18px;
    }


    .menu-icon {
        margin-bottom: 11px;

        font-size: 25px;
    }


    .menu-title {
        font-size: 15px;
    }


    .menu-description {
        font-size: 12px;
    }


    .page-heading h2 {
        font-size: 24px;
    }


    .current-card {
        padding: 18px;

        border-radius: 20px;
    }


    .current-card h2 {
        font-size: 21px;
    }


    .search-input-row {
        align-items: stretch;
    }


    .search-button {
        padding:
            10px
            13px;
    }


    .premium-card {
        padding: 18px;

        border-radius: 20px;
    }


    .program-card {
        padding: 16px;

        border-radius: 18px;
    }


    .feedback-card {
        padding: 16px;

        border-radius: 18px;
    }


    .feedback-textarea {
        min-height: 140px;
    }


    .feedback-success {
        padding:
            25px
            17px;

        border-radius: 20px;
    }


    .bottom-nav {
        min-height: 70px;

        padding:
            7px
            6px
            calc(
                7px +
                env(safe-area-inset-bottom)
            );
    }


    .nav-item {
        padding:
            5px
            1px;
    }


    .nav-item span {
        font-size: 19px;
    }


    .nav-item small {
        font-size: 9px;
    }

}


/* -------------------------------------------------- */
/* ОЧЕНЬ УЗКИЕ ЭКРАНЫ */
/* -------------------------------------------------- */

@media (max-width: 360px) {

    .menu-grid {
        grid-template-columns: 1fr;
    }


    .menu-card {
        min-height: auto;
    }


    .hero h1 {
        font-size: 27px;
    }


    .search-input-row {
        flex-direction: column;
    }


    .search-button {
        width: 100%;
    }


    .program-card-header {
        gap: 10px;
    }


    .program-icon {
        width: 42px;
        height: 42px;

        font-size: 22px;
    }


    .feedback-type-button {
        min-height: 48px;

        padding:
            11px
            12px;
    }

}


/* -------------------------------------------------- */
/* SAFE AREA ДЛЯ TELEGRAM / IPHONE */
/* -------------------------------------------------- */

@supports (
    padding-bottom:
        env(safe-area-inset-bottom)
) {

    .app {
        padding-bottom:
            calc(
                92px +
                env(safe-area-inset-bottom)
            );
    }

}


/* -------------------------------------------------- */
/* УМЕНЬШЕНИЕ АНИМАЦИЙ */
/* -------------------------------------------------- */

@media (
    prefers-reduced-motion: reduce
) {

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;

        transition-duration:
            0.01ms !important;

        animation-duration:
            0.01ms !important;

        animation-iteration-count:
            1 !important;
    }

}/* -------------------------------------------------- */
/* СОДЕРЖИМОЕ ПЛАТНОЙ ПРОГРАММЫ */
/* -------------------------------------------------- */

.program-detail-content {
    width: 100%;
}


.program-detail-hero {
    position: relative;

    overflow: hidden;

    padding: 24px;

    border-radius: 24px;

    background:
        linear-gradient(
            145deg,
            #f4eadf,
            #fff8ed
        );

    box-shadow:
        0 6px 22px
        rgba(0, 0, 0, 0.05);
}


.program-detail-badge {
    display: inline-flex;
    align-items: center;

    margin-bottom: 13px;
    padding: 7px 11px;

    border-radius: 999px;

    background:
        rgba(255, 255, 255, 0.72);

    color: #6f584c;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 0.02em;
}


.program-detail-hero h1 {
    max-width: 520px;

    margin: 0 0 10px;

    color: #352e2a;

    font-size: 27px;
    line-height: 1.18;
}


.program-detail-hero p {
    max-width: 540px;

    margin: 0;

    color: #6c6059;

    font-size: 14px;
    line-height: 1.6;
}


.program-detail-access {
    display: inline-flex;
    align-items: center;

    gap: 6px;

    margin-top: 16px;
    padding: 8px 11px;

    border-radius: 12px;

    background: #e8f2e8;

    color: #47704d;

    font-size: 12px;
    font-weight: 700;
}


/* -------------------------------------------------- */
/* ВВЕДЕНИЕ В ПРОГРАММУ */
/* -------------------------------------------------- */

.program-intro-card {
    margin-top: 14px;
    padding: 18px;

    border-radius: 20px;

    background: #ffffff;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.04);
}


.program-intro-card h3 {
    margin: 0 0 9px;

    color: #373330;

    font-size: 18px;
    line-height: 1.35;
}


.program-intro-card p {
    margin: 0;

    color: #68615e;

    font-size: 14px;
    line-height: 1.6;
}


/* -------------------------------------------------- */
/* ВОЗРАСТНЫЕ ЭТАПЫ */
/* -------------------------------------------------- */

.program-stage-list {
    display: flex;
    flex-direction: column;

    gap: 12px;

    margin-top: 18px;
}


.program-stage-card {
    overflow: hidden;

    border-radius: 20px;

    background: #ffffff;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.045);
}


.program-stage-button {
    display: flex;
    align-items: center;

    width: 100%;

    gap: 13px;

    padding: 17px;

    border: 0;

    background: #ffffff;

    text-align: left;
}


.program-stage-button:active {
    background: #faf8f6;
}


.program-stage-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 46px;
    height: 46px;

    border-radius: 14px;

    background: #f5eee8;

    font-size: 23px;
}


.program-stage-title {
    flex: 1;
    min-width: 0;
}


.program-stage-title strong {
    display: block;

    margin-bottom: 3px;

    color: #373330;

    font-size: 16px;
    line-height: 1.3;
}


.program-stage-title span {
    display: block;

    color: #817a75;

    font-size: 12px;
    line-height: 1.4;
}


.program-stage-arrow {
    flex: 0 0 auto;

    color: #a69c96;

    font-size: 20px;

    transition:
        transform 0.2s ease;
}


.program-stage-card.open
.program-stage-arrow {
    transform: rotate(90deg);
}


/* -------------------------------------------------- */
/* СОДЕРЖИМОЕ ВОЗРАСТНОГО ЭТАПА */
/* -------------------------------------------------- */

.program-stage-content {
    display: none;

    padding:
        0
        17px
        18px;
}


.program-stage-card.open
.program-stage-content {
    display: block;
}


.program-stage-divider {
    height: 1px;

    margin-bottom: 16px;

    background: #eee8e3;
}


.program-content-section + 
.program-content-section {
    margin-top: 17px;
}


.program-content-section h4 {
    margin: 0 0 8px;

    color: #4a403b;

    font-size: 15px;
    line-height: 1.4;
}


.program-content-section p {
    margin: 0;

    color: #66605c;

    font-size: 14px;
    line-height: 1.6;
}


.program-content-section ul,
.program-content-section ol {
    margin:
        8px
        0
        0;

    padding-left: 21px;

    color: #625c58;

    font-size: 14px;
    line-height: 1.6;
}


.program-content-section li + li {
    margin-top: 7px;
}


/* -------------------------------------------------- */
/* КАРТОЧКА ЗАНЯТИЯ */
/* -------------------------------------------------- */

.program-activity {
    margin-top: 10px;
    padding: 14px;

    border-radius: 15px;

    background: #f8f5f2;
}


.program-activity:first-child {
    margin-top: 0;
}


.program-activity h5 {
    margin: 0 0 7px;

    color: #453d39;

    font-size: 14px;
    line-height: 1.4;
}


.program-activity p {
    margin: 0;

    color: #6e6763;

    font-size: 13px;
    line-height: 1.55;
}


.program-activity-meta {
    display: flex;
    flex-wrap: wrap;

    gap: 6px;

    margin-top: 9px;
}


.program-activity-tag {
    padding: 5px 8px;

    border-radius: 999px;

    background: #ffffff;

    color: #827872;

    font-size: 11px;
}


/* -------------------------------------------------- */
/* ПОДСКАЗКА В ПРОГРАММЕ */
/* -------------------------------------------------- */

.program-tip {
    margin-top: 16px;
    padding: 14px;

    border-radius: 15px;

    background: #fff6e7;

    color: #725e4e;

    font-size: 13px;
    line-height: 1.55;
}


/* -------------------------------------------------- */
/* СОСТОЯНИЕ ОШИБКИ ДОСТУПА */
/* -------------------------------------------------- */

.program-access-error {
    padding: 22px 18px;

    border-radius: 20px;

    background: #ffffff;

    text-align: center;

    box-shadow:
        0 5px 18px
        rgba(0, 0, 0, 0.04);
}


.program-access-error-icon {
    margin-bottom: 10px;

    font-size: 34px;
}


.program-access-error h3 {
    margin: 0 0 8px;

    color: #373330;

    font-size: 19px;
}


.program-access-error p {
    margin: 0;

    color: #777;

    font-size: 14px;
    line-height: 1.55;
}


/* -------------------------------------------------- */
/* АДАПТАЦИЯ ПРОГРАММЫ ПОД ТЕЛЕФОН */
/* -------------------------------------------------- */

@media (max-width: 520px) {

    .program-detail-hero {
        padding: 20px;

        border-radius: 21px;
    }


    .program-detail-hero h1 {
        font-size: 24px;
    }


    .program-intro-card {
        padding: 16px;

        border-radius: 18px;
    }


    .program-stage-card {
        border-radius: 18px;
    }


    .program-stage-button {
        padding: 15px;
    }


    .program-stage-content {
        padding:
            0
            15px
            16px;
    }


    .program-stage-icon {
        width: 43px;
        height: 43px;

        font-size: 21px;
    }

}


@media (max-width: 360px) {

    .program-detail-hero {
        padding: 18px;
    }


    .program-detail-hero h1 {
        font-size: 22px;
    }


    .program-stage-button {
        gap: 10px;

        padding: 14px;
    }


    .program-stage-icon {
        width: 40px;
        height: 40px;

        font-size: 20px;
    }

}

/* ==================================================
   ONBOARDING
   ================================================== */

#onboardingScreen {
    min-height: 100vh;
    padding: 0;
    background:
        linear-gradient(
            180deg,
            #fffaf6 0%,
            #f8f6f3 100%
        );
}

.onboarding-content {
    width: 100%;
    max-width: 520px;
    min-height: 100vh;
    margin: 0 auto;
    padding:
        48px
        24px
        40px;
    box-sizing: border-box;
}

.onboarding-step {
    width: 100%;
}

.onboarding-step[hidden] {
    display: none !important;
}


/* --------------------------------------------------
   ПЕРВЫЙ ЭКРАН
   -------------------------------------------------- */

.onboarding-logo {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 72px;
    height: 72px;

    margin:
        30px
        auto
        18px;

    border-radius: 24px;

    background:
        linear-gradient(
            145deg,
            #fff1dc,
            #ffe2c2
        );

    font-size: 34px;

    box-shadow:
        0 12px 30px
        rgba(111, 76, 55, 0.08);
}


.onboarding-badge {
    display: table;

    margin:
        0
        auto
        20px;

    padding:
        8px
        14px;

    border-radius: 999px;

    background: #fff0df;

    color: #8b5e3c;

    font-size: 13px;
    font-weight: 700;
}


.onboarding-step h1 {
    margin:
        0
        auto
        16px;

    max-width: 430px;

    color: #2c2521;

    font-size: 34px;
    line-height: 1.12;
    font-weight: 800;

    text-align: center;
}


.onboarding-step h2 {
    margin:
        18px
        0
        12px;

    color: #2c2521;

    font-size: 28px;
    line-height: 1.2;
    font-weight: 800;
}


.onboarding-lead {
    max-width: 430px;

    margin:
        0
        auto
        12px;

    color: #4c433e;

    font-size: 17px;
    line-height: 1.55;

    text-align: center;
}


.onboarding-description {
    max-width: 430px;

    margin:
        0
        auto
        30px;

    color: #81756e;

    font-size: 14px;
    line-height: 1.55;

    text-align: center;
}


/* --------------------------------------------------
   ОСНОВНАЯ КНОПКА
   -------------------------------------------------- */

.onboarding-primary-button {
    display: block;

    width: 100%;
    max-width: 430px;

    min-height: 54px;

    margin:
        28px
        auto
        0;

    padding:
        14px
        22px;

    border: 0;
    border-radius: 17px;

    background:
        linear-gradient(
            135deg,
            #f6b86f,
            #efa463
        );

    color: #39281e;

    font: inherit;
    font-size: 16px;
    font-weight: 800;

    cursor: pointer;

    box-shadow:
        0 10px 24px
        rgba(215, 145, 85, 0.22);

    transition:
        transform 0.15s ease,
        box-shadow 0.15s ease;
}


.onboarding-primary-button:active {
    transform: scale(0.985);

    box-shadow:
        0 6px 16px
        rgba(215, 145, 85, 0.18);
}


/* --------------------------------------------------
   НАЗАД + ПРОГРЕСС
   -------------------------------------------------- */

.onboarding-back-button {
    margin:
        0
        0
        22px;

    padding:
        8px
        0;

    border: 0;
    background: transparent;

    color: #776a63;

    font: inherit;
    font-size: 14px;
    font-weight: 600;

    cursor: pointer;
}


.onboarding-progress {
    display: inline-block;

    padding:
        7px
        11px;

    border-radius: 999px;

    background: #fff0df;

    color: #9a6745;

    font-size: 12px;
    font-weight: 700;
}


/* --------------------------------------------------
   ВЫБОР ЭТАПА
   -------------------------------------------------- */

.onboarding-step-description {
    margin:
        0
        0
        24px;

    color: #756a64;

    font-size: 15px;
    line-height: 1.55;
}


.onboarding-stage-list {
    display: flex;
    flex-direction: column;

    gap: 14px;

    margin-top: 26px;
}


.onboarding-stage-card {
    display: grid;

    grid-template-columns:
        54px
        1fr
        22px;

    align-items: center;

    width: 100%;

    padding: 18px;

    border:
        1px solid
        #eee5df;

    border-radius: 20px;

    background: #ffffff;

    color: #2c2521;

    text-align: left;

    font: inherit;

    cursor: pointer;

    box-shadow:
        0 8px 24px
        rgba(60, 45, 35, 0.055);

    transition:
        transform 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease;
}


.onboarding-stage-card:active {
    transform: scale(0.985);
}


.onboarding-stage-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    border-radius: 15px;

    background: #fff4e8;

    font-size: 24px;
}


.onboarding-stage-text {
    display: flex;
    flex-direction: column;

    gap: 5px;
}


.onboarding-stage-text strong {
    color: #2f2925;

    font-size: 16px;
    line-height: 1.3;
}


.onboarding-stage-text small {
    color: #81766f;

    font-size: 13px;
    line-height: 1.4;
}


.onboarding-stage-arrow {
    color: #b4a59c;

    font-size: 28px;
    line-height: 1;
}


/* --------------------------------------------------
   ДАТА
   -------------------------------------------------- */

.onboarding-date-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 64px;
    height: 64px;

    margin-top: 24px;

    border-radius: 20px;

    background: #fff0df;

    font-size: 30px;
}


.onboarding-date-field {
    margin-top: 28px;
}


.onboarding-date-field label {
    display: block;

    margin-bottom: 9px;

    color: #554b45;

    font-size: 13px;
    font-weight: 700;
}


.onboarding-date-field input {
    width: 100%;
    min-height: 54px;

    box-sizing: border-box;

    padding:
        12px
        15px;

    border:
        1px solid
        #ded5cf;

    border-radius: 16px;

    background: #ffffff;

    color: #332c28;

    font: inherit;
    font-size: 16px;

    outline: none;
}


.onboarding-date-field input:focus {
    border-color: #efa463;

    box-shadow:
        0 0 0 3px
        rgba(239, 164, 99, 0.12);
}


.onboarding-error {
    min-height: 20px;

    margin-top: 10px;

    color: #b94d4d;

    font-size: 13px;
    line-height: 1.4;
}


.onboarding-privacy-note {
    max-width: 400px;

    margin:
        16px
        auto
        0;

    color: #958982;

    font-size: 12px;
    line-height: 1.5;

    text-align: center;
}


/* --------------------------------------------------
   УСПЕШНОЕ ЗАВЕРШЕНИЕ
   -------------------------------------------------- */

.onboarding-success-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 72px;
    height: 72px;

    margin:
        48px
        auto
        18px;

    border-radius: 50%;

    background: #e9f5e8;

    color: #4f8a52;

    font-size: 32px;
    font-weight: 800;
}


#onboardingSuccessStep h2 {
    max-width: 430px;

    margin:
        0
        auto
        14px;

    text-align: center;
}


.onboarding-result {
    max-width: 430px;

    margin:
        26px
        auto
        0;

    padding: 18px;

    box-sizing: border-box;

    border:
        1px solid
        #eee3dc;

    border-radius: 18px;

    background: #ffffff;

    color: #403731;

    font-size: 14px;
    line-height: 1.55;

    text-align: center;

    box-shadow:
        0 8px 24px
        rgba(60, 45, 35, 0.05);
}


/* --------------------------------------------------
   СКРЫВАЕМ НИЖНЕЕ МЕНЮ В ONBOARDING
   -------------------------------------------------- */

.bottom-nav.onboarding-hidden {
    display: none !important;
}


/* --------------------------------------------------
   МОБИЛЬНЫЕ ЭКРАНЫ
   -------------------------------------------------- */

@media (max-width: 600px) {

    .onboarding-content {
        padding:
            30px
            20px
            32px;
    }


    .onboarding-logo {
        margin-top: 18px;
    }


    .onboarding-step h1 {
        font-size: 30px;
    }


    .onboarding-step h2 {
        font-size: 25px;
    }


    .onboarding-stage-card {
        padding: 16px;
    }

}


/* --------------------------------------------------
   SAFE AREA TELEGRAM / IPHONE
   -------------------------------------------------- */

@supports (
    padding-bottom:
        env(safe-area-inset-bottom)
) {

    .onboarding-content {
        padding-bottom:
            calc(
                32px +
                env(safe-area-inset-bottom)
            );
    }

}/* ==================================================
   МАМА РЯДОМ
   VISUAL PLAYER
   ================================================== */


.visual-player {
    width: 100%;
    margin: 18px 0;
    overflow: hidden;

    background: #ffffff;

    border: 1px solid
        rgba(70, 54, 63, 0.08);

    border-radius: 22px;

    box-shadow:
        0 8px 28px
        rgba(70, 54, 63, 0.07);
}


/* --------------------------------------------------
   ОБЛАСТЬ ИЗОБРАЖЕНИЯ
   -------------------------------------------------- */

.visual-player-image-wrapper {
    position: relative;

    width: 100%;
    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: #f8f3ef;
}


.visual-player-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    user-select: none;

    -webkit-user-drag: none;

    transition:
        opacity 180ms ease;
}


/* --------------------------------------------------
   НИЖНЯЯ ПАНЕЛЬ
   -------------------------------------------------- */

.visual-player-footer {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 12px;

    min-height: 58px;

    padding: 10px 12px 10px 16px;
}


.visual-player-title {
    flex: 1;

    font-size: 14px;
    line-height: 1.35;

    font-weight: 600;

    color: #2f2930;
}


/* --------------------------------------------------
   PLAY / PAUSE
   -------------------------------------------------- */

.visual-player-play-button {
    display: flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 38px;
    height: 38px;

    padding: 0;

    border: none;
    border-radius: 50%;

    background: #f6e8e5;

    color: #5d4b50;

    font-family: inherit;
    font-size: 15px;
    font-weight: 700;

    cursor: pointer;

    -webkit-tap-highlight-color:
        transparent;

    transition:
        transform 120ms ease,
        background-color 120ms ease;
}


.visual-player-play-button:hover {
    background: #f1deda;
}


.visual-player-play-button:active {
    transform: scale(0.94);
}


.visual-player-play-button:focus-visible {
    outline: 3px solid
        rgba(182, 125, 129, 0.28);

    outline-offset: 2px;
}


/* --------------------------------------------------
   МОБИЛЬНЫЙ ЭКРАН
   -------------------------------------------------- */

@media (max-width: 480px) {

    .visual-player {
        margin: 14px 0;

        border-radius: 18px;
    }


    .visual-player-footer {
        min-height: 54px;

        padding:
            8px
            10px
            8px
            14px;
    }


    .visual-player-title {
        font-size: 13px;
    }


    .visual-player-play-button {
        width: 36px;
        height: 36px;
    }

}


/* --------------------------------------------------
   REDUCE MOTION

   Если пользователь отключил анимацию
   в настройках устройства, не добавляем
   лишние визуальные переходы.
   -------------------------------------------------- */

@media (
    prefers-reduced-motion: reduce
) {

    .visual-player-image,
    .visual-player-play-button {
        transition: none;
    }

}
/* Ladunya weekly content */
.ladunya-week-header {
    padding: 24px 20px;
    margin-bottom: 20px;
    border-radius: 24px;
    background: linear-gradient(135deg, #fff4dc, #fce9e5);
}

.ladunya-week-label {
    font-size: 13px;
    font-weight: 700;
    color: #8a6754;
    margin-bottom: 12px;
}

.ladunya-week-header h2 {
    font-size: 29px;
    line-height: 1.2;
    margin: 0 0 12px;
    color: #3d3532;
}

.ladunya-week-header p {
    font-size: 14px;
    color: #766b66;
    margin: 0;
}

.ladunya-week-body {
    padding: 0 4px 30px;
}

.ladunya-week-block {
    margin: 24px 0 18px;
    padding: 20px;
    background: #fff7ed;
    border-radius: 20px;
    border-left: 4px solid #e9c88e;
}

.ladunya-week-block h3 {
    margin: 0 0 8px;
    font-size: 20px;
    color: #594638;
}

.ladunya-week-subtitle {
    margin: 0;
    font-size: 13px;
    color: #8b786b;
}

.ladunya-week-heading {
    margin: 26px 0 12px;
    font-size: 19px;
    line-height: 1.4;
    color: #51443e;
}

.ladunya-week-paragraph {
    margin: 0 0 16px;
    font-size: 16px;
    line-height: 1.7;
    color: #3d3936;
}

.ladunya-week-premium {
    margin-top: 28px;
    padding: 20px;
    border-radius: 20px;
    background: #f8f0ff;
}



/* LADUNYA — PAID PROGRAM LESSON CARDS */

.program-lesson-card {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-width: 0;
    padding: 16px;
    margin: 0 0 10px;
    border: 1px solid #eee4e5;
    border-radius: 18px;
    background: #fffdfc;
    color: #453d42;
    text-align: left;
    font: inherit;
    cursor: pointer;
    box-sizing: border-box;
    box-shadow: 0 3px 12px rgba(91, 62, 76, 0.035);
    transition: background 0.2s, transform 0.2s;
}

.program-lesson-card:active {
    background: #fbf3f5;
    transform: scale(0.99);
}

.program-lesson-number {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: #f8edf1;
    color: #a36d83;
    font-size: 13px;
    font-weight: 700;
}

.program-lesson-info {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    gap: 4px;
}

.program-lesson-info strong {
    display: block;
    font-size: 14px;
    line-height: 1.45;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.program-lesson-info span {
    font-size: 12px;
    line-height: 1.4;
    color: #8e8188;
}

.program-lesson-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 20px;
    font-size: 25px;
    font-weight: 300;
    color: #b78b9d;
}

/* Sleep programme interactive tools */
.sleep-local-notice{background:#fff5f7;border:1px solid #f5dce3;border-radius:16px;padding:15px 17px;margin:18px 0;color:#604854;line-height:1.55}
.sleep-local-notice p{margin:7px 0 0;font-size:14px}
.sleep-tool{margin:18px 0;padding:18px;background:#fff;border:1px solid #f1e5e8;border-radius:18px}
.sleep-tool h3{margin:5px 0 14px}
.sleep-check-row{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid #f3ecef;line-height:1.45;cursor:pointer}
.sleep-check-row input{width:21px;height:21px;flex-shrink:0;accent-color:#d97f9e}
.sleep-tool-count{font-weight:600;color:#ae5778}
.sleep-tool-button{background:#d7799b;color:#fff;border:0;border-radius:12px;padding:12px 16px;font:inherit;cursor:pointer;margin-top:12px}
.sleep-tool-button.secondary{background:#f8e8ee;color:#81445b}
.sleep-tool-footnote,.sleep-tool-message{font-size:13px;line-height:1.5;color:#765b65}
.sleep-tool form label{display:block;font-size:14px;margin:12px 0;color:#5a4650}
.sleep-tool form input,.sleep-tool form textarea{display:block;width:100%;box-sizing:border-box;padding:11px;margin-top:5px;border:1px solid #e8d8de;border-radius:10px;font:inherit;background:#fff;color:#332b2f}
.sleep-diary-entry{padding:14px 0;border-top:1px solid #eee2e7;overflow-wrap:anywhere}
.sleep-diary-entry p{margin:7px 0}


/* LADUNYA_PROGRAM_VISUAL_FIX_20261029 */

/* Иллюстрации Монтессори: изображение полностью видно */
.program-adapter-image-wrap {
    width: 100%;
    max-width: 100%;
    overflow: visible;
    box-sizing: border-box;
}

.program-adapter-image {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
    object-position: center;
}

/* Таблицы восстановления: горизонтальная прокрутка */
.program-adapter-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.program-adapter-table {
    width: 100%;
    border-collapse: collapse;
}

.program-adapter-table th,
.program-adapter-table td {
    padding: 10px;
    vertical-align: top;
    overflow-wrap: anywhere;
}

@media (max-width: 600px) {
    .program-adapter-table {
        min-width: 440px;
    }
}


/* LADUNYA_BIRTH_CARDS_V1 */

.birth-cards {
    width: 100%;
    min-width: 0;
}

.birth-cards [hidden] {
    display: none !important;
}

.birth-cards-toolbar {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}

.birth-cards-progress {
    flex: 1;
    height: 7px;
    border-radius: 20px;
    overflow: hidden;
    background: #f0e7e3;
}

.birth-cards-progress span {
    display: block;
    height: 100%;
    background: #ca918d;
    border-radius: inherit;
    transition: width .2s ease;
}

.birth-cards-mode {
    border: 0;
    background: transparent;
    color: #8f625f;
    font: inherit;
    font-size: 13px;
    text-decoration: underline;
    cursor: pointer;
}

.birth-card {
    box-sizing: border-box;
    width: 100%;
    padding: 22px 18px;
    border: 1px solid #f0e4df;
    border-radius: 22px;
    background: #fffaf7;
    box-shadow: 0 5px 18px rgba(70, 40, 30, .05);
}

.birth-card-counter {
    color: #9b7771;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 18px;
}

.birth-card-content {
    line-height: 1.65;
    overflow-wrap: anywhere;
}

.birth-card-content h2,
.birth-card-content h3,
.birth-card-content h4 {
    line-height: 1.35;
    margin-top: 18px;
    margin-bottom: 12px;
}

.birth-card-content > :first-child {
    margin-top: 0;
}

.birth-card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid #eee2dd;
}

.birth-card-button {
    min-height: 44px;
    padding: 11px 16px;
    border: 0;
    border-radius: 12px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.birth-card-back {
    background: #f1e9e5;
    color: #654c48;
}

.birth-card-next {
    background: #bb817c;
    color: #fff;
}

.birth-card-next:disabled {
    opacity: .7;
    cursor: default;
}

.birth-cards-finished {
    padding: 14px;
    border-radius: 12px;
    background: #eaf5ec;
    color: #356c43;
}

.birth-cards[data-birth-mode="all"] .birth-card {
    margin-bottom: 14px;
}

.birth-cards[data-birth-mode="all"] .birth-card-actions {
    display: none;
}

@media (max-width: 480px) {
    .birth-card {
        padding: 19px 15px;
        border-radius: 18px;
    }

    .birth-card-button {
        padding: 10px 13px;
        font-size: 14px;
    }
}


/* LADUNYA_BIRTH_CARD_TYPOGRAPHY_V1 */

/* Основной текст */
.birth-card-content {
    font-size: 15px;
    line-height: 1.75;
    color: #403b39;
}

/* Разделение абзацев */
.birth-card-content p {
    margin: 0 0 16px;
    line-height: 1.75;
}

.birth-card-content p:last-child {
    margin-bottom: 0;
}

/* Заголовки */
.birth-card-content h2 {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 20px;
    color: #453432;
}

.birth-card-content h3 {
    font-size: 18px;
    font-weight: 650;
    line-height: 1.4;
    margin: 26px 0 14px;
    color: #604643;
}

.birth-card-content h4 {
    font-size: 16px;
    font-weight: 650;
    line-height: 1.45;
    margin: 22px 0 12px;
    color: #76514d;
}

/* Отступы между разделами */
.birth-card-content h2 + p,
.birth-card-content h3 + p,
.birth-card-content h4 + p {
    margin-top: 12px;
}

/* Списки */
.birth-card-content .program-adapter-list {
    margin: 0 0 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #f9f2ef;
    line-height: 1.6;
}

/* Подзаголовки */
.birth-card-content .program-adapter-subtitle {
    font-size: 16px;
    font-weight: 600;
    margin: 18px 0 12px;
    color: #76514d;
}

/* Удобство чтения на телефоне */
@media (max-width: 480px) {
    .birth-card-content {
        font-size: 15px;
        line-height: 1.7;
    }

    .birth-card-content h2 {
        font-size: 20px;
    }

    .birth-card-content h3 {
        font-size: 17px;
    }
}


/* LADUNYA_BIRTH_INTERACTIVE_V3 */

.birth-card-title {
    margin: 0 0 22px !important;
    font-size: 22px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    color: #493634 !important;
}

.birth-interactive {
    margin: 22px 0;
    padding: 16px;
    border: 1px solid #eadbd6;
    border-radius: 16px;
    background: #fff5f1;
}

.birth-choice {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 11px 0;
    cursor: pointer;
    line-height: 1.5;
}

.birth-choice + .birth-choice {
    border-top: 1px solid #eee1db;
}

.birth-choice input {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-top: 2px;
    accent-color: #bb817c;
}

.birth-choice-hint {
    font-size: 13px;
    color: #806763;
    margin: 12px 0 0;
}

.birth-answer-label {
    display: block;
    margin-top: 18px;
    font-weight: 600;
}

.birth-answer-label textarea {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-top: 10px;
    padding: 12px;
    border: 1px solid #dbc9c3;
    border-radius: 12px;
    background: #fff;
    font: inherit;
    font-weight: 400;
    resize: vertical;
}

.birth-rating-row {
    margin: 18px 0;
    padding-top: 12px;
    border-top: 1px solid #eadbd6;
}

.birth-rating-row > label {
    font-weight: 700;
}

@media (max-width: 480px) {
    .birth-card-title {
        font-size: 20px !important;
    }
}
