
/* --- Preloader (wait for window.load) --- */
html:not(.is-ready) .slides { visibility: hidden; }
.preloader{ position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
  background:#fff; font:500 14px/1.4 system-ui; letter-spacing:.03em; z-index:9999; }
html.is-ready .preloader{ display:none; }

/* ==========================
   ОСНОВА
   ========================== */
body {
    margin: 0;
    overflow: hidden;
    min-height: 100vh;
    min-height: 100svh;
    min-height: 100dvh;
}

/* базовые переменные для десктопа */
:root{
    --vh: 1vh;

    /* для правых слайдов (4,6,8,10,12,14,16,18) на десктопе */
    --slide-right-x: 65vw;

    /* сдвиг картинки на 18 (десктоп) */
    --s18-shift-x: 0vw;

    /* лампа/хелп на десктопе (значения из styles2.css) */
    --idea-size: 4vw;
    --idea-lift: -3vh;
    --help-width: 10vw;
    --help-up: 8vh;
    --help-right: -2vw;

    /* на сколько вправо двигаем input у “сложных” правых */
    --input-right-shift: 1.4vw;

    /* ===== СЛАЙД 3 — РУЧКИ ДЛЯ INPUT (ДЕСКТОП) ===== */
    --s3-input-wrapper-w: 20.833vw; /* ширина фоновой рамки под инпут */
    --s3-input-field-h: 5.185vh;     /* высота самого <input> */
}

/* ==========================
   СЛАЙДЫ
   ========================== */

.slide {
    height: calc(var(--vh) * 100);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 2vh;
    padding-top: 8vh;
}
.slide:first-child{ display:flex; }
.slide:target{ display:flex; }

.slides.js-slides .slide{ display:none; }
.slides.js-slides .slide.is-active{ display:flex; }

.slides:has(.slide:target) .slide:first-child { display: none; }
.slides:has(.slide:target) .slide:target      { display: flex; }

/* ==========================
   БАЗОВЫЕ ЭЛЕМЕНТЫ (ДЕСКТОП — размеры из styles2.css)
   ========================== */

.quest { width: 26.042vw; }

.start {
    width: 15.625vw;
    margin-top: 7vh;
    cursor: pointer;
    display: block;
}

/* кнопка “далее” — фикс. ширина под десктоп */
.dalee{
    width: 9.812vw;
    display:block;
    cursor:pointer;
    margin:0 auto;
}

/* контейнер под “далее” — размеры из styles2.css */
.mimimishki{
    background: url("img/mimimishki.png") no-repeat center / contain;
    width: 15.021vw;
    height: 22.222vh;
    display:flex;
    align-items:center;
    justify-content:center;
}
.mimimishki a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
}

/* ==========================
   ЗАГОЛОВКИ (десктоп — из styles2.css)
   ========================== */

.rules1{ margin-top: -9vh;  width: 15.417vw; }
.rules2{ margin-top:-1vh;  width: 16.021vw; }
.dresskod{ margin-top: 2vh; width: 15.625vw; }
.today{    margin-top:-3vh; width: 20.833vw; }

/* ==========================
   ИНПУТ-ОБОЛОЧКА (десктоп — из styles2.css)
   ========================== */

.input-wrapper{
    background: url("img/input.png") no-repeat center / contain;
    margin-top: -4vh;
    width: 20.833vw;
    height: 36.111vh;
    display:flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    padding: 0 1.25vw;
}

/* ===== СЛАЙД 3 — РУЧКИ ДЛЯ INPUT (ДЕСКТОП) ===== */
#slide3 .input-wrapper { width: var(--s3-input-wrapper-w); }
#slide3 .input-code    { height: var(--s3-input-field-h); }

/* ==========================
   ФОНЫ
   ========================== */

#slide1  { background-image: url("img/bg1.png"); }
#slide2  { background-image: url("img/bg2.png"); }
#slide2 .rules3 { display: none !important; }
#slide3  { background-image: url("img/bg3.png"); }

#slide4,
#slide6,
#slide8,
#slide10,
#slide12,
#slide14,
#slide16,
#slide18 {
    background-image: url("img/chan.png");
}

#slide5  { background-image: url("img/bg5.png"); }
#slide7  { background-image: url("img/bg7.png"); }
#slide9  { background-image: url("img/bg9.png"); }
#slide11 { background-image: url("img/bg11.png"); }
#slide13 { background-image: url("img/bg13.png"); }
#slide15 { background-image: url("img/bg15.png"); }
#slide17 { background-image: url("img/bg17.png"); }
#slide19 { background-image: url("img/bg19.png"); }

/* =========================================================
   ПРАВЫЕ СЛАЙДЫ (4,6,8,10,12,14,16,18) — ДЕСКТОП
   ========================================================= */

#slide4,
#slide6,
#slide8,
#slide10,
#slide12,
#slide14,
#slide16,
#slide18 {
    align-items: flex-start;
}

/* ---- 4 ---- */
#slide4 .dance {
    width: 30vw;
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide4 .mimimishki {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide4 .input-group {
    margin-left: calc(var(--slide-right-x) + var(--input-right-shift));
    transform: translateX(-50%);
    width: 28vw;
    margin-top: 2.5vh;
}

/* ---- 6 ---- */
#slide6 .num {
    width: 48vw;
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide6 .mimimishki {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide6 .input-group {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
    width: 28vw;
    margin-top: 2.5vh;
}

/* ---- 8 ---- */
#slide8 .dights {
    width: 30vw;
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide8 .mimimishki {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide8 .input-group {
    margin-left: calc(var(--slide-right-x) + var(--input-right-shift));
    transform: translateX(-50%);
    width: 28vw;
    margin-top: 2.5vh;
}

/* ---- 10 ---- (особый) */
#slide10 .morze {
    margin-top: -2vh;
    width: 54vw;
    margin-left: calc(var(--slide-right-x) + 8vw);
    transform: translateX(-50%);
}
#slide10 .mimimishki {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide10 .input-group {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
    width: 28vw;
    margin-top: -30vh;
}

/* ---- 12 ---- */
#slide12 .dr {
    width: 30vw;
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide12 .mimimishki {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide12 .input-group {
    margin-left: calc(var(--slide-right-x) + var(--input-right-shift));
    transform: translateX(-50%);
    width: 28vw;
    margin-top: 2.5vh;
}

/* ---- 14 ---- */
#slide14 .museum {
    width: 30vw;
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide14 .mimimishki {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide14 .input-group {
    margin-left: calc(var(--slide-right-x) + var(--input-right-shift));
    transform: translateX(-50%);
    width: 28vw;
    margin-top: 2.5vh;
}

/* ---- 16 ---- */
#slide16 .snow {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
    width: 38vw;
    margin-top: 2.5vh;
}
#slide16 .mimimishki {
    margin-left: var(--slide-right-x);
    transform: translateX(-50%);
}
#slide16 .input-group {
    margin-left: calc(var(--slide-right-x) + var(--input-right-shift));
    transform: translateX(-50%);
    width: 28vw;
    margin-top: 2.5vh;
}

/* ---- 18 ---- */
#slide18 .domoy {
    margin-top: -15vh;
    width: 35vw;
    margin-left: calc(var(--slide-right-x) + var(--s18-shift-x));
    transform: translateX(-50%);
}
#slide18 .mimimishki {
    margin-left: var(--slide-right-x);
    margin-top: -1vh;
    transform: translateX(-50%);
}
/* инпут на 18 НА ВСЕХ — прячем */
#slide18 .input-group { display: none !important; }

/* ==========================
   INPUT + IDEA + HELP (ДЕСКТОП)
   ========================== */

.input-group {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 1vw;
}

.input-code{
    flex:1 1 auto;
    height: 5.185vh;
    font-size: clamp(1.042vw, 2.2vw, 1.562vw);
    border:none;
    outline:none;
    background:transparent;
    text-align:center;
}

.input-code.error { animation: shake 0.2s ease-in-out 0s 2; }

/* лампа */
.input-group .idea {
    flex: 0 0 auto;
    width: var(--idea-size);
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    transform: translateY(var(--idea-lift));
}
.input-group .idea img { width: 80%; display: block; }

/* help — вправо и вверх от лампы */
.input-group img[class^="help"],
.input-group img[class*=" help"] {
    flex: 0 0 auto;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    width: var(--help-width);
    margin-left: var(--help-right);
    margin-top: calc(-1 * var(--help-up));
    transition: opacity 0.15s ease-out;
}
.input-group.show-help img[class^="help"],
.input-group.show-help img[class*=" help"] {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

/* =========================================================
   СЕРДЕЧНЫЕ СЛАЙДЫ (5,7,9,11,13,15,17) — ДЕСКТОП
   ========================================================= */
#slide5,
#slide7,
#slide9,
#slide11,
#slide13,
#slide15,
#slide17 { align-items: center; gap: 0; }

/* 5 */
#slide5 .bilyard{ margin-top:-17vh; width: 18.75vw;}
#slide5 .love1{ width: 34vw; margin-top:-12vh;}
#slide5 .mimimishki{ margin-top:-2vh; }

/* 15 */
#slide15 .kino{ margin-top:-10vh; width: 22.75vw;}
#slide15 .love6 { width: 30.875vw; margin-top: -18vh; }
#slide15 .mimimishki { margin-top: -18vh; }

/* остальные сердечные */
#slide7 .park,
#slide9 .coffee,
#slide11 .kort,
#slide13 .blue,
#slide17 .bereza{ margin-top:-10vh; width: 18.75vw;}

#slide7 .love2,
#slide9 .love3,
#slide11 .love4,
#slide13 .love5,
#slide17 .love6{ width: 30vw; margin-top:-23vh;}

#slide7 .mimimishki,
#slide9 .mimimishki,
#slide11 .mimimishki,
#slide13 .mimimishki,
#slide17 .mimimishki{ margin-top:-19vh;}

/* ==========================
   ПРОЧИЕ
   ========================== */

.bilyard { width: 15.625vw; }
.park    { width: 15.625vw; }
.coffee  { width: 15.625vw; }
.kort    { width: 15.625vw; }
.blue    { width: 15.625vw; }
.kino    { width: 20.833vw; }
.bereza  { width: 15.625vw; }

.end { width: 31.25vw; }

/* ==========================
   АНИМАЦИЯ ОШИБКИ
   ========================== */

@keyframes shake {
    0% { transform: translateX(0); }
    25% { transform: translateX(-0.156vw); }
    50% { transform: translateX(0.156vw); }
    75% { transform: translateX(-0.104vw); }
    100% { transform: translateX(0); }
}

/* =========================================================
   МОБИЛЬНАЯ ВЕРСИЯ — РУЧКИ
   ========================================================= */
@media (max-width: 768px) {

    :root {
        /* ---------- 1 СЛАЙД ---------- */
        --m-s1-top: 6vh;
        --m-s1-gap: 3vh;
        --m-s1-quest-w: 78vw;
        --m-s1-start-w: 56vw;

        /* ---------- 2 СЛАЙД ---------- */
        --m-s2-top: 9vh;
        --m-s2-gap: 2vh;
        --m-s2-rules1-w: 50vw;
        --m-s2-rules2-w: 40vw;
        --m-s2-mimimi-w: 66vw; /* ↓ размер mimimishki на 2 */
        --m-s2-mimimi-h: 24vh;
        --m-s2-dalee-w: 60%;
        --m-s2-mimimi-gap: 5vh;

        /* ---------- 3 СЛАЙД ---------- */
        --m-s3-top: -5vh;
        --m-s3-gap: -2vh;
        --m-s3-h1-w: 82vw;
        --m-s3-h2-w: 60vw;
        --m-s3-mimimi-w: 66vw;  /* ручки для 3 */
        --m-s3-mimimi-h: 24vh;
        --m-s3-dalee-w: 60%;

        /* ===== СЛАЙД 3 — РУЧКИ ДЛЯ INPUT (МОБИЛЬНЫЕ) ===== */
        --m-s3-input-wrapper-w: 70vw;
        --m-s3-input-field-w: 60vw;
        --m-s3-input-field-h: 6.5vh;

        /* ---------- ПРАВЫЕ: 4,6,8,10,12,14,16 ---------- */
        --m-r-top: 4.5vh;
        --m-r-gap: 2vh;
        --m-r-shift-x: 40vw;
        --m-r-img-w: 45vw;
        --m-r-input-w: 50vw;
        --m-r-input-wrapper-w: 40vw;
        --m-r-input-field-w: 70vw;
        --m-r-input-field-h: 6.5vh;
        --m-r-input-up: 5vh;
        --m-r-help-up: 7vh;
        --m-r-help-left: 0vw;

        /* отдельные ручки для 10 */
        --m-r10-img-w: 70vw;
        --m-r10-shift-x: 40vh;
        --m-r10-input-up: 5vh;

        /* отдельные ручки для 16 */
        --m-r16-img-w: 60vw;
        --m-r16-shift-x: 50vw;

        /* лампа/help для правых */
        --m-r-idea-size: 8vw;
        --m-r-idea-up: 0vh;
        --m-r-idea-left: -3vw;
        --m-r-help-w: 16vw;

        /* ---------- ОБЩИЕ РАЗМЕРЫ MIMIMISHKI (МОБИЛЬНЫЕ) ---------- */
        --m-mimimi-w: 200vw;   /* дефолтная ширина для всех слайдов */
        --m-mimimi-h: 60vh;   /* дефолтная высота (ВАЖНО для реального увеличения) */

        /* ---------- 5 СЛАЙД ---------- */
        --m-s5-top: -5vh;
        --m-s5-head-w: 50vw;
        --m-s5-love-w: 68vw;
        --m-s5-dalee-w: 40vw;
        --m-s5-head-gap: 0vh;
        --m-s5-love-gap: 2vh;
        --m-s5-dalee-gap: 2vh;
        --m-s5-mimimi-w: 66vw;
        --m-s5-mimimi-h: 24vh;

        /* ---------- 7,9,11,13,15,17 ---------- */
        --m-heart-top: 1vh;
        --m-heart-head-w: 50vw;
        --m-heart-love-w: 78vw;
        --m-heart-dalee-w: 44vw;
        --m-heart-head-gap: 0vh;
        --m-heart-love-gap: -15vh;
        --m-heart-dalee-gap: -10vh;

        --m-s7-mimimi-w: 66vw;  --m-s7-mimimi-h: 24vh;
        --m-s9-mimimi-w: 66vw;  --m-s9-mimimi-h: 24vh;
        --m-s11-mimimi-w: 66vw; --m-s11-mimimi-h: 24vh;
        --m-s13-mimimi-w: 66vw; --m-s13-mimimi-h: 24vh;
        --m-s15-mimimi-w: 66vw; --m-s15-mimimi-h: 24vh;
        --m-s17-mimimi-w: 66vw; --m-s17-mimimi-h: 24vh;

        /* ---------- 17 (ОТДЕЛЬНО!) ---------- */
        --m-s17-top: 1vh;
        --m-s17-head-w: 50vw;
        --m-s17-love-w: 78vw;
        --m-s17-dalee-w: 58vw;
        --m-s17-head-gap: 0vh;
        --m-s17-love-gap: -15vh;
        --m-s17-dalee-gap: -10vh;

        /* ---------- 18 (отдельно!) ---------- */
        --m-s18-top: 8vh;
        --m-s18-img-w: 60vw;
        --m-s18-mimimi-w: 50vw;
        --m-s18-mimimi-h: 22vh;
        --m-s18-dalee-w: 60%;
        --m-s18-shift-x: 45vw;             /* картинка "домой" */
        --m-s18-mimimi-shift-x: 30vw;       /* СДВИГ mimimishki по X (— влево, + вправо) */

        /* ---------- 19 ---------- */
        --m-s19-top: 6vh;
        --m-s19-img-w: 72vw;
    }

    body { overflow-y: auto; }

    .slide {
        height: 100dvh;
        align-items: center;
        justify-content: flex-start;
        padding-top: 6vh;
        background-size: cover;
        background-position: center top;
    }

    /* мобильные фоны */
    #slide4,
    #slide6,
    #slide8,
    #slide10,
    #slide12,
    #slide14,
    #slide16,
    #slide18 { background-image: url("img/chan1.png"); }
    #slide19 { background-image: url("img/bg19m.png"); }

    /* ===== БАЗОВО: размеры mimimishki на мобилке ===== */
    .mimimishki {
        width: var(--m-mimimi-w);
        height: var(--m-mimimi-h);
    }

    /* ========== 1 ========== */
    #slide1 { padding-top: var(--m-s1-top); gap: var(--m-s1-gap); }
    #slide1 .quest { width: var(--m-s1-quest-w); }
    #slide1 .start { width: var(--m-s1-start-w); margin-top: 0; }

    /* ========== 2 ========== */
    #slide2 { padding-top: var(--m-s2-top); gap: var(--m-s2-gap); }
    #slide2 .rules1 { width: var(--m-s2-rules1-w); }
    #slide2 .rules2 { width: var(--m-s2-rules2-w); }
    #slide2 .mimimishki {
        width:  var(--m-s2-mimimi-w, var(--m-mimimi-w));
        height: var(--m-s2-mimimi-h, var(--m-mimimi-h));
        margin-top: var(--m-s2-mimimi-gap);
    }
    #slide2 .mimimishki .dalee { width: var(--m-s2-dalee-w); }

    /* ========== 3 ========== */
    #slide3 { padding-top: var(--m-s3-top); gap: var(--m-s3-gap); }
    #slide3 .dresskod { width: var(--m-s3-h1-w); }
    #slide3 .today    { width: var(--m-s3-h2-w); }

    /* СЛАЙД 3 — ручки для mimimishki и кнопки */
    #slide3 .mimimishki {
        width:  var(--m-s3-mimimi-w, var(--m-mimimi-w));
        height: var(--m-s3-mimimi-h, var(--m-mimimi-h));
    }
    #slide3 .mimimishki .dalee { width: var(--m-s3-dalee-w); }

    /* СЛАЙД 3 — ручки для input */
    #slide3 .input-wrapper { width: var(--m-s3-input-wrapper-w); }
    #slide3 .input-code {
        width: var(--m-s3-input-field-w);
        height: var(--m-s3-input-field-h);
        font-size: clamp(14px, 4vw, 20px);
    }

    /* ========== ПРАВЫЕ 4,6,8,10,12,14,16 ========== */
    #slide4,
    #slide6,
    #slide8,
    #slide10,
    #slide12,
    #slide14,
    #slide16 {
        align-items: center;
        padding-top: var(--m-r-top);
        gap: var(--m-r-gap);
    }

    /* общий случай (кроме 10 и 16) */
    #slide4  > img:first-of-type,
    #slide6  > img:first-of-type,
    #slide8  > img:first-of-type,
    #slide12 > img:first-of-type,
    #slide14 > img:first-of-type {
        width: var(--m-r-img-w);
        margin-left: calc(50% + var(--m-r-shift-x));
        transform: translateX(-50%);
    }

    /* 10 — СВОИ ручки (ширина + сдвиг) */
    #slide10 > img:first-of-type {
        width: var(--m-r10-img-w);
        margin-left: calc(50% + var(--m-r10-shift-x));
        transform: translateX(-50%);
    }


    /* 16 — СВОИ ручки */
    #slide16 > img:first-of-type {
        width: var(--m-r16-img-w);
        margin-left: calc(50% + var(--m-r16-shift-x));
        transform: translateX(-50%);
    }

    /* инпут-блок — общий (4,6,8,10,12,14,16) */
    #slide4  .input-group,
    #slide6  .input-group,
    #slide8  .input-group,
    #slide10 .input-group,
    #slide12 .input-group,
    #slide14 .input-group,
    #slide16 .input-group {
        width: max(
                var(--m-r-input-w),
                calc(var(--m-r-input-wrapper-w) + var(--m-r-idea-size) + var(--m-r-help-w) / 2)
        );
        margin-left: calc(50% + var(--m-r-shift-x));
        transform: translateX(-50%);
        margin-top: calc(1.5vh + var(--m-r-input-up));
        justify-content: center;
        gap: 3vw;
    }
    #slide10 .input-group { margin-top: calc(1.5vh + var(--m-r10-input-up)); }

    /* фоновая рамка под инпут */
    #slide4  .input-wrapper,
    #slide6  .input-wrapper,
    #slide8  .input-wrapper,
    #slide10 .input-wrapper,
    #slide12 .input-wrapper,
    #slide14 .input-wrapper,
    #slide16 .input-wrapper { width: var(--m-r-input-wrapper-w); }

    /* сам <input> */
    #slide4  .input-code,
    #slide6  .input-code,
    #slide8  .input-code,
    #slide10 .input-code,
    #slide12 .input-code,
    #slide14 .input-code,
    #slide16 .input-code {
        width: var(--m-r-input-field-w);
        height: var(--m-r-input-field-h);
        font-size: clamp(14px, 4vw, 20px);
    }

    /* ЛАМПА/HELP */
    #slide4  .input-group .idea,
    #slide6  .input-group .idea,
    #slide8  .input-group .idea,
    #slide10 .input-group .idea,
    #slide12 .input-group .idea,
    #slide14 .input-group .idea,
    #slide16 .input-group .idea {
        width: var(--m-r-idea-size);
        margin-top: var(--m-r-idea-up);
        margin-left: var(--m-r-idea-left);
    }
    #slide10 .input-group {
        margin-top: -15vh;
    }
    #slide4  .input-group .idea img,
    #slide6  .input-group .idea img,
    #slide8  .input-group .idea img,
    #slide10 .input-group .idea img,
    #slide12 .input-group .idea img,
    #slide14 .input-group .idea img,
    #slide16 .input-group .idea img { width: 100%; }

    #slide4  .input-group img[class^="help"],
    #slide6  .input-group img[class^="help"],
    #slide8  .input-group img[class^="help"],
    #slide10 .input-group img[class^="help"],
    #slide12 .input-group img[class^="help"],
    #slide14 .input-group img[class^="help"],
    #slide16 .input-group img[class^="help"] {
        width: var(--m-r-help-w);
        margin-top: calc(-1 * var(--m-r-help-up) + var(--m-r-idea-up));
        margin-left: calc(var(--m-r-help-left) + var(--m-r-idea-left));
    }

    /* ========== 5 ========== */
    #slide5 { padding-top: var(--m-s5-top); gap: 0; }
    #slide5 .bilyard { width: var(--m-s5-head-w); margin-top: var(--m-s5-head-gap); }
    #slide5 .love1   { width: var(--m-s5-love-w); margin-top: var(--m-s5-love-gap); }
    #slide5 .mimimishki {
        width:  var(--m-s5-mimimi-w, var(--m-mimimi-w));
        height: var(--m-s5-mimimi-h, var(--m-mimimi-h));
        margin-top: var(--m-s5-dalee-gap);
    }
    #slide5 .mimimishki .dalee { width: var(--m-s5-dalee-w); }

    /* ========== 7,9,11,13,15,17 ========== */
    #slide7,
    #slide9,
    #slide11,
    #slide13,
    #slide15,
    #slide17 { padding-top: var(--m-heart-top); }

    #slide7 .park,  #slide9 .coffee, #slide11 .kort,
    #slide13 .blue, #slide15 .kino,   #slide17 .bereza {
        width: var(--m-heart-head-w);
        margin-top: var(--m-heart-head-gap);
    }

    #slide7 .love2,  #slide9 .love3,  #slide11 .love4,
    #slide13 .love5, #slide15 .love6, #slide17 .love6 {
        width: var(--m-heart-love-w);
        margin-top: var(--m-heart-love-gap);
    }

    #slide7 .mimimishki,
    #slide9 .mimimishki,
    #slide11 .mimimishki,
    #slide13 .mimimishki,
    #slide15 .mimimishki,
    #slide17 .mimimishki {
        margin-top: var(--m-heart-dalee-gap);
        /* индивидуальные размеры с фолбэком на общие */
        width:  var(--m-s7-mimimi-w,  var(--m-mimimi-w));
        height: var(--m-s7-mimimi-h,  var(--m-mimimi-h));
    }
    /* Чтобы каждая могла иметь свой набор, переопределяем по слайдам */
    #slide9  .mimimishki { width: var(--m-s9-mimimi-w,  var(--m-mimimi-w));  height: var(--m-s9-mimimi-h,  var(--m-mimimi-h)); }
    #slide11 .mimimishki { width: var(--m-s11-mimimi-w, var(--m-mimimi-w));  height: var(--m-s11-mimimi-h, var(--m-mimimi-h)); }
    #slide13 .mimimishki { width: var(--m-s13-mimimi-w, var(--m-mimimi-w));  height: var(--m-s13-mimimi-h, var(--m-mimimi-h)); }
    #slide15 .mimimishki { width: var(--m-s15-mimimi-w, var(--m-mimimi-w));  height: var(--m-s15-mimimi-h, var(--m-mimimi-h)); }
    #slide17 .mimimishki { width: var(--m-s17-mimimi-w, var(--m-mimimi-w));  height: var(--m-s17-mimimi-h, var(--m-mimimi-h)); }

    #slide7  .mimimishki .dalee,
    #slide9  .mimimishki .dalee,
    #slide11 .mimimishki .dalee,
    #slide13 .mimimishki .dalee,
    #slide15 .mimimishki .dalee,
    #slide17 .mimimishki .dalee { width: var(--m-heart-dalee-w); }

    /* ========== 17 (отдельно поверх общих) ========== */
    #slide17 { padding-top: var(--m-s17-top); }
    #slide17 .bereza { width: var(--m-s17-head-w); margin-top: var(--m-s17-head-gap); }
    #slide17 .love6  { width: var(--m-s17-love-w); margin-top: var(--m-s17-love-gap); }
    #slide17 .mimimishki { margin-top: var(--m-s17-dalee-gap); }
    #slide17 .mimimishki .dalee { width: var(--m-s17-dalee-w); }

    /* ========== 18 (без инпута!) ========== */
    #slide18 {
        align-items: center;
        padding-top: var(--m-s18-top);
        gap: 2vh;
    }
    #slide18 .domoy {
        width: var(--m-s18-img-w);
        margin-left: calc(50% + var(--m-s18-shift-x));
        margin-top: 1vh;
        transform: translateX(-50%);
    }
    #slide18 .mimimishki {
        width:  var(--m-s18-mimimi-w, var(--m-mimimi-w));
        height: var(--m-s18-mimimi-h, var(--m-mimimi-h));
        margin-top: 0;
        margin-left: calc(50% + var(--m-s18-mimimi-shift-x)); /* ручка сдвига */
        transform: translateX(-50%);
    }
    #slide18 .mimimishki .dalee { width: var(--m-s18-dalee-w); }
    #slide18 .input-group { display: none !important; }

    /* ========== 19 ========== */
    #slide19 { padding-top: var(--m-s19-top); }
    #slide19 .end { width: var(--m-s19-img-w); }
    #slide6 .input-code{ font-size: clamp(12px,3.4vw,18px) !important; }
    #slide16 .input-code{ font-size: clamp(12px,3.4vw,18px) !important; }
}


/* iOS: предотвращаем авто-зум инпутов (минимальный размер шрифта 16px) */
@media (max-width: 768px) {
    .input-code {
        font-size: 16px !important;
    }
}
