/* Shared homepage category navigation; the presentation below remains mobile-only. */
body.main_page .blog__categoryPills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 20px 0 24px;
    padding: 0 4px;
}
body.main_page .blog__categoryPills a.category_pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    max-width: 100%;
    min-height: 46px;
    margin: 0;
    padding: 11px 16px !important;
    border: 1px solid #b96c89 !important;
    border-radius: 14px !important;
    background: #fff3f7 !important;
    color: #78143d !important;
    box-shadow: 0 2px 5px rgb(104 9 49 / 6%) !important;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 1.45;
    white-space: normal;
    text-align: center;
    text-decoration: none;
    transition: background-color 180ms ease, color 180ms ease;
}
body.main_page .blog__categoryPills a.category_pill:active {
    background: #881944 !important;
    color: #fff !important;
}
body.main_page .blog__categoryPills a.category_pill:focus-visible {
    outline: 2px solid #881944;
    outline-offset: 3px;
}
@media (hover: hover) {
    body.main_page .blog__categoryPills a.category_pill:hover {
        background: #881944 !important;
        border-color: #881944 !important;
        color: #fff !important;
    }
}
@media (prefers-reduced-motion: reduce) {
    body.main_page .blog__categoryPills a.category_pill { transition: none; }
}
@media (max-width: 600px) {
    body {
        --mobile-ink: #721337;
        --mobile-border: #ead4dc;
        --mobile-paper: #fffdfb;
    }
    body .wmw-mobile-hello {
        display: grid;
        grid-template-columns: 96px minmax(0, 1fr);
        gap: 16px;
        align-items: center;
        width: 100%;
        margin-bottom: 18px;
        padding: 18px;
        background: var(--mobile-paper);
        border: 1px solid var(--mobile-border);
        border-radius: 20px;
        box-sizing: border-box;
    }
    body .wmw-mobile-hello .mainHero__portrait {
        display: block;
        width: 96px;
        margin: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
        background: transparent;
    }
    body .wmw-mobile-hello .mainHero__portrait img {
        width: 96px;
        height: 112px;
        object-fit: cover;
        border-radius: 15px;
    }
    body .wmw-mobile-hello figcaption { display: none; }
    body .wmw-mobile-hello > div { text-align: left !important; margin: 0 !important; line-height: 1.5; }
    body .wmw-mobile-hello strong { font-size: 17px !important; line-height: 1.4; }
    body .wmw-mobile-hello span { display: block; margin-top: 8px; font-size: 13px; }
    body.main_page .girl__mainPage { display: block; width: calc(100% - 28px); margin-inline: auto; }
    body.main_page .textCont-firstPage { width: 100%; margin: 0; }
    body.main_page .comment_bubble { border-radius: 20px; padding: 20px !important; }
    body .main-hello-formatted { font-size: 16px !important; line-height: 1.65 !important; }
    body .main-hello-formatted > .heroModes { margin: 18px 0 0; }
    body .heroModes .button, body .mainHero__telegram { min-height: 50px; height: auto; line-height: 1.4; padding: 12px; }
    body .mainHero__telegram { width: 100%; box-sizing: border-box; font-size: 14px; }
    body .heroModes__tabs [role=tab] { min-height: 46px; font-size: 16px; }
    body .main-hello-subtext { font-size: 12px; line-height: 1.5; }
    body.main_page #pages > .section + .section { margin-top: 40px; }
    body.main_page .main_page__footer { margin-top: 28px; }
    body.main_page .section2 { width: calc(100% - 28px); padding: 12px 0; }
    body .whatDo__listBody > div { padding: 12px; gap: 12px; line-height: 1.5; }
    body .whatDo__header h4 { font-size: 24px; line-height: 1.25; text-align: left; }
    body .how_it_works__text { font-size: 16px; line-height: 1.65; }
    body .how_it_works__steps-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    body .how_it_works__step { padding: 18px; border-radius: 18px; min-height: 0; }
    body .how_it_works__step-note { margin: 12px 0; font-size: 14px; }
    body .how_it_works__step-action .button { min-height: 48px; height: auto; white-space: normal; line-height: 1.4; }
    body .wmw-mobile-disclosure { margin: 12px 0; overflow: hidden; border-bottom: 1px solid var(--mobile-border); }
    body .wmw-mobile-disclosure > summary {
        position: relative;
        display: block;
        list-style: none;
        cursor: pointer;
        min-height: 48px;
        padding: 12px 30px 12px 0;
        box-sizing: border-box;
        color: var(--mobile-ink);
        font-size: 15px;
        font-weight: 600;
        line-height: 1.5;
        text-align: left;
    }
    body .wmw-mobile-disclosure > summary::-webkit-details-marker { display: none; }
    body .wmw-mobile-disclosure > summary::after {
        content: '';
        position: absolute;
        right: 6px;
        top: 20px;
        width: 7px;
        height: 7px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg);
        transition: transform 300ms ease;
    }
    body .wmw-mobile-disclosure > summary[aria-expanded=true]::after { transform: rotate(225deg); }
    body .wmw-mobile-disclosure > summary > p { margin: 0; font-size: inherit; }
    body .wmw-mobile-disclosure__body { padding: 0 0 14px; font-size: 15px; line-height: 1.65; }
    body .wmw-mobile-disclosure__body blockquote { text-align: left !important; }
    body .wmw-mobile-disclosure > summary:focus-visible { outline: 2px solid #881944; outline-offset: -2px; border-radius: 6px; }
    body .wendyBanner { display: grid; grid-template-columns: 80px minmax(0,1fr); gap: 16px; padding: 18px; border-radius: 20px; }
    body .wendyBanner__qr img { width: 80px; height: 96px; object-fit: cover; border-radius: 14px; }
    body .wendyBanner__description { font-size: 14px; line-height: 1.5; }
    body .wendyBanner__action { grid-column: 1 / -1; }
    body .wendyBanner__action .button { width: 100%; min-height: 48px; height: auto; white-space: normal; }
    body .blog__categoryPills { display: flex; flex-wrap: wrap; gap: 8px; }
    body .blog__categoryPills .category_pill { white-space: normal; line-height: 1.4; min-height: 44px; }
    body .blog__articleQrCard-qrLink, body .blog__articleQrCard-hint, body .mwm__sidebarQr { display: none; }
    body .mwm__sidebarAvatar { display: block; }
    body .mwm__sidebarAvatar img { max-width: 96px; border-radius: 16px; }
    body .aboutHero { display: grid; grid-template-columns: 88px minmax(0,1fr); gap: 16px; padding: 18px; border-radius: 20px; align-items: start; }
    body .aboutHero__portrait { margin: 0; width: 88px; }
    body .aboutHero__portrait img { width: 88px; height: 104px; object-fit: cover; border-radius: 14px; }
    body .aboutHero__content h1 { font-size: 23px; line-height: 1.3; margin: 0 0 10px; }
    body .aboutHero__content .about__intro { font-size: 14px; line-height: 1.6; margin: 0; }
    body.aboutWMW [hidden] { display: none !important; }
    body .wmw-mobile-game-hello { display: grid; grid-template-columns: 100px minmax(0,1fr); gap: 16px; align-items: center; padding: 18px; border: 1px solid var(--mobile-border); border-radius: 20px; background: var(--mobile-paper); }
    body .wmw-mobile-game-hello > .mini_roulette_wheel { grid-column: 1; grid-row: 1; width: 100px; height: 100px; margin: 0; }
    body .wmw-mobile-game-hello > div { grid-column: 2; grid-row: 1; min-width: 0; }
    body .wmw-mobile-game-hello .about__greeting { margin-top: 0; line-height: 1.4; }
    body .wmw-mobile-game-hello .about__intro { font-size: 14px; line-height: 1.5; }
    body .search_promo_cont .textBlock { display: flex; flex-direction: column; gap: 20px; }
    body .search_promo_cont .search_promo__text { order: 0; width: 100%; padding: 0; }
    body .search_promo_cont .logoAside { order: 1; position: static; width: 100%; }
    body .search_promo_cont .side_roulette_preview { margin: 0; }
    body .search_promo_cont .about__action-block .button { width: 100%; min-height: 48px; height: auto; white-space: normal; }
    body .tallAbout { border: 1px solid var(--mobile-border); border-radius: 20px; background: var(--mobile-paper); padding: 18px; box-sizing: border-box; }
    body .tallAbout .search__mainHeader { font-size: 25px; line-height: 1.3; }
    body .tallAbout .question__header { font-size: 17px; line-height: 1.4; margin-top: 20px; }
    body .tallAbout .question__variables { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; margin: 10px 0 20px; }
    body .tallAbout .question__variables > p { flex: 1 1 120px; margin: 0; min-width: 0; }
    body .tallAbout .question__variables label { display: block; height: 100%; }
    body .tallAbout .question__variables label > span {
        display: flex;
        align-items: center;
        box-sizing: border-box;
        height: 100%;
        min-height: 52px;
        padding: 12px 12px 12px 36px;
        border: 1px solid var(--mobile-border);
        border-radius: 12px;
        background: white;
        color: #502333;
        font-size: 16px;
        line-height: 1.4;
        transition: background-color 180ms ease, border-color 180ms ease;
    }
    body .tallAbout input[type=radio]:checked + span { background: #f9edf1; border-color: #881944; font-weight: 600; }
    body .tallAbout input[type=radio]:focus-visible + span { outline: 2px solid #881944; outline-offset: 2px; }
    body :is(.tallAbout, .cabinetCont, .login, .registration) input:not([type=radio]):not([type=checkbox]):not([type=hidden]):not([type=submit]),
    body :is(.tallAbout, .cabinetCont, .login, .registration) textarea,
    body :is(.tallAbout, .cabinetCont, .login, .registration) select {
        font-size: 16px;
        min-height: 50px;
        box-sizing: border-box;
        width: 100%;
        border: 1px solid var(--mobile-border);
        border-radius: 12px;
        padding: 10px 14px;
        background: white;
        color: #502333;
    }
    body .tallAbout .button, body .cabinetCont .button { min-height: 48px; height: auto; white-space: normal; line-height: 1.4; }
    body .wmw-mobile-progress-label { display: block; margin-bottom: 10px; font-size: 13px; color: var(--mobile-ink); }
    body .wmw-mobile-progress { display: block; appearance: none; width: 100%; height: 6px; margin-bottom: 24px; border: 0; border-radius: 8px; overflow: hidden; background: #efE4e8; accent-color: #881944; }
    body .wmw-mobile-progress::-webkit-progress-bar { background: #efe4e8; }
    body .wmw-mobile-progress::-webkit-progress-value { background: #881944; border-radius: 8px; transition: width 300ms ease; }
    body .wmw-mobile-progress::-moz-progress-bar { background: #881944; }
    body .step__header { scroll-margin-top: 90px; }
    body .emailSubscription { max-width: calc(100% - 28px); border-radius: 20px; }
    body .emailSubscription input[type=email] { font-size: 16px; }
    body .siteFooter { padding-bottom: 18px; }
}
@media (max-width: 600px) {
    /* search-layout.css is loaded in the body and has legacy !important rules. */
    body.search .search_promo_cont .page2__content .textBlock {
        display: block !important;
        width: calc(100% - 24px) !important;
        margin: 0 auto !important;
    }
    body.search .search_promo_cont aside.logoAside { display: none !important; }
    body.search .search_promo_cont .search_promo__text {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    body.search .wmw-mobile-game-hello .mini_roulette_wheel {
        width: 100px !important;
        height: 100px !important;
        margin: 0 !important;
    }
    body.search .wmw-mobile-game-hello .mini_roulette_center {
        width: 24px !important;
        height: 24px !important;
    }
    body:is(.login, .register, .registration, .login_forgot) .login__fields {
        box-sizing: border-box;
        width: 100%;
        max-width: 440px;
        padding: 20px;
        margin-inline: auto;
        border: 1px solid var(--mobile-border);
        border-radius: 20px;
        background: var(--mobile-paper);
    }
    body:is(.login, .register, .registration, .login_forgot) .input-field {
        margin: 0 0 20px;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    body:is(.login, .register, .registration, .login_forgot) .input-field > label {
        order: -1;
        position: static;
        transform: none !important;
        color: #633345;
        font-size: 14px;
        line-height: 1.4;
    }
    body:is(.login, .register, .registration, .login_forgot) .input-field > input {
        width: 100%;
        box-sizing: border-box;
        height: 52px;
        min-height: 52px;
        padding: 12px 14px;
        margin: 0;
        border: 1px solid var(--mobile-border);
        border-radius: 12px;
        background: #fff;
        font-size: 16px;
        color: #502333;
    }
    body:is(.login, .register, .registration, .login_forgot) .login__fields .button {
        min-height: 50px;
        height: auto;
        white-space: normal;
        line-height: 1.4;
    }
    body:is(.login, .register, .registration, .login_forgot) .input-field > input:focus {
        border-color: #881944;
        box-shadow: 0 0 0 2px rgb(136 25 68 / 12%);
    }
}
@media (max-width: 360px) {
    body .wmw-mobile-hello { grid-template-columns: 76px minmax(0,1fr); padding: 14px; gap: 12px; }
    body .wmw-mobile-hello .mainHero__portrait, body .wmw-mobile-hello .mainHero__portrait img { width: 76px; }
    body .wmw-mobile-hello .mainHero__portrait img { height: 96px; }
    body .wmw-mobile-game-hello { grid-template-columns: minmax(0,1fr); }
    body .wmw-mobile-game-hello > .mini_roulette_wheel { justify-self: center; }
    body .wmw-mobile-game-hello > div { grid-column: 1; grid-row: 2; }
}
@media (max-width: 600px) and (prefers-reduced-motion: reduce) {
    body .wmw-mobile-disclosure > summary::after,
    body .wmw-mobile-progress::-webkit-progress-value { transition: none; }
}

/* Mobile geometry lives in the same layer as legacy important action rules. */
@layer actions {
    @media (max-width: 600px) {
        body { --wmw-radius-action: 8px; }
        body.mwm .mwm_page,
        body.aboutWMW main > .page,
        body:is(.login, .register, .registration, .login_forgot) .overflow__loginRegister {
            padding-left: 0 !important;
            padding-right: 0 !important;
        }
        body.search .search_promo_cont > .page2__content {
            box-sizing: border-box !important;
            width: 100% !important;
            max-width: 100% !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }
        body.main_page .page > .page__content,
        body.aboutWMW .page > .page__content,
        body.mwm .mwm__layout,
        body.blog .blog__mainContainer,
        body.search .search_promo_cont .page2__content .textBlock,
        body:is(.login, .register, .registration, .login_forgot) .loginCont {
            box-sizing: border-box !important;
            width: calc(100% - 32px) !important;
            max-width: none !important;
            margin-left: auto !important;
            margin-right: auto !important;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }
        body.main_page :is(.girl__mainPage, .section2, .blog__inner, .main_page__footer),
        body.aboutWMW .page__content > .page2__content,
        body.mwm :is(.mwm__mainContent, .mwm__text, .mwm__actions),
        body:is(.login, .register, .registration, .login_forgot) :is(.loginCont > div, .login__overflow) {
            box-sizing: border-box !important;
            width: 100% !important;
            max-width: 100% !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }
        body.main_page .main_page__footer { overflow-wrap: break-word; }
        body.main_page .slick_main_cont { padding-left: 0 !important; padding-right: 0 !important; }
        body.main_page .slick_main_cont .slick-slide { padding-left: 0 !important; padding-right: 0 !important; }
        body.main_page .slick_main_cont .slick-prev { left: 4px !important; z-index: 2; }
        body.main_page .slick_main_cont .slick-next { right: 4px !important; z-index: 2; }
        body :is(.emailSubscription, .wendyBanner, .aboutHero) {
            box-sizing: border-box !important;
            width: 100% !important;
            max-width: 100% !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
        }
        body .wendyBanner > * { min-width: 0; overflow-wrap: break-word; }
        body :is(.blog__loadMoreWrap, .loadMore, .wendyBanner__action) { width: 100% !important; box-sizing: border-box; }
        body :is(.button, .contact_btn, .blog__articleNav-btn, .modal__wantSubscribe):not(.btn-floating),
        body .login__fields .btn {
            box-sizing: border-box !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            width: 100% !important;
            max-width: 100% !important;
            min-width: 0 !important;
            min-height: 48px !important;
            height: auto !important;
            border-radius: 8px !important;
            white-space: normal !important;
            line-height: 1.4 !important;
            text-align: center !important;
            padding: 12px 16px !important;
        }
        body:is(.main_page, .blog) .blog__categoryPills {
            display: flex !important;
            flex-direction: column !important;
            gap: 10px !important;
            width: 100% !important;
            max-width: 100% !important;
            padding: 0 !important;
            box-sizing: border-box !important;
        }
        body:is(.main_page, .blog) .blog__categoryPills a.category_pill {
            box-sizing: border-box !important;
            width: 100% !important;
            min-height: 48px !important;
            margin: 0 !important;
            padding: 12px 16px !important;
            justify-content: center !important;
            border: 1px solid #b96c89 !important;
            border-radius: 8px !important;
            background: #fff3f7 !important;
            color: #78143d !important;
            font-weight: 600 !important;
            text-align: center !important;
            white-space: normal !important;
            line-height: 1.45 !important;
            box-shadow: none !important;
        }
        body:is(.main_page, .blog) .blog__categoryPills a.category_pill:is(.is-active, :active) {
            background: #881944 !important;
            border-color: #881944 !important;
            color: #fff !important;
        }
        body.aboutWMW .aboutHero__content,
        body.aboutWMW .aboutHero__content :is(h1, h2, p) { text-align: left !important; }
        body .wmw-mobile-heart {
            display: inline-block;
            width: 1em;
            height: 1em;
            vertical-align: -0.12em;
            color: #881944;
        }
        body .blog__countStatus {
            position: absolute !important;
            width: 1px !important;
            height: 1px !important;
            padding: 0 !important;
            margin: -1px !important;
            overflow: hidden !important;
            clip-path: inset(50%) !important;
            white-space: nowrap !important;
        }
    }
}
