/* НОЯ «На одном языке»: палитра и стили игры. Подключается после css/game-editorial.css.
   Файл правит только исполнитель задачи 2. */
html[data-editorial="noya"]{
  --pg-bg:#FFF3E3;--pg-paper:#FFFBF5;--pg-ink:#512D2B;--pg-muted:#745450;--pg-accent:#963C56;--pg-deep:#6C3448;
  --pg-button:#EDB15F;--pg-button-plate:#7B344D;--pg-glow:#E4A481;--pg-blush:#F8DCCC;--pg-bright:#EDB15F;--pg-honey:#EDB15F;
  --pg-hero:linear-gradient(126deg,#FFF7EA 0%,#FBE9DA 53%,#F3CFB6 100%);
  --pg-shadow-ink:#6C3448;
  --pg-ribbon-bg:#6C3448;
  --pg-final-from:#963C56;--pg-final-to:#6C3448;--pg-final-glow:rgba(237,177,95,.30);
  --pg-aud-icon-bg:#F8DCCC;
  --pg-quote-from:#FEEDE5;--pg-quote-to:#F8DCCC;
  --pg-fan-to:#FEEDE5;
}
html[data-editorial="noya"] .pg-aud-icon{color:var(--pg-ink)}
html[data-editorial="noya"]{--noya-leaves:url('../../assets/games/noya/decor/leaves-top.webp');--noya-stage-gap:22px}

/* ── Листва с упаковки: кромка hero (растёт снизу вверх) ── */
html[data-editorial="noya"] .pg-hero::after{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;height:clamp(96px,11vw,150px);background:var(--noya-leaves) repeat-x center top/auto 100%;transform:scaleY(-1);opacity:.92;pointer-events:none}
html[data-editorial="noya"] .pg-hero{padding-bottom:clamp(120px,13vw,170px)}

/* ── About: облако слов за цитатой ── */
html[data-editorial="noya"] .pg-promise{overflow-x:clip}
html[data-editorial="noya"] .pg-about-aside{isolation:isolate}
.noya-cloud{position:absolute;z-index:-1;left:-2%;right:-6%;top:-24%;height:150%;opacity:.55;pointer-events:none;user-select:none}
.noya-cloud span{position:absolute;font-family:StampatelloFaceto,Inter,sans-serif;line-height:1;text-transform:uppercase;white-space:nowrap}

/* ── Пять этапов: язык настоящих карт (цветная рамка, пузырьки, номер в кружке) ── */
.pg-stages{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--noya-stage-gap);margin:0;padding:0;list-style:none}
.pg-stages:focus-visible{outline-offset:6px}
.pg-phase{position:relative;display:flex;flex-direction:column;gap:16px;min-width:0}
.pg-phase::before{content:"";position:absolute;top:18px;left:46px;right:calc(8px - var(--noya-stage-gap));border-top:2px dashed color-mix(in srgb,var(--pg-ink) 28%,transparent)}
.pg-phase:last-child::before{display:none}
.pg-phase-num{position:relative;z-index:1;display:grid;width:36px;height:36px;place-items:center;border:1.5px solid var(--pg-ink);border-radius:50%;background:var(--stage);color:var(--pg-ink);font-size:14px;font-weight:600;line-height:1}
.pg-phase-card{position:relative;display:flex;flex:1;flex-direction:column;overflow:hidden;padding:20px 16px 16px;border-radius:var(--pg-radius-card);background:radial-gradient(circle at 14% 22%,rgba(255,255,255,.34) 0 8px,transparent 9px),radial-gradient(circle at 88% 12%,rgba(255,255,255,.34) 0 13px,transparent 14px),radial-gradient(circle at 70% 58%,rgba(255,255,255,.26) 0 6px,transparent 7px),radial-gradient(circle at 6% 76%,rgba(255,255,255,.3) 0 11px,transparent 12px),radial-gradient(circle at 94% 88%,rgba(255,255,255,.26) 0 7px,transparent 8px),var(--stage);color:var(--pg-ink);box-shadow:var(--pg-shadow-md);transition:transform .3s var(--pg-ease)}
.pg-phase:nth-child(even) .pg-phase-card{background-position:30px 14px,-18px 40px,10px -8px,22px 0,-14px 20px,0 0}
.pg-phase-card h3{margin:0 0 14px;color:var(--pg-ink);font-size:12px;font-weight:600;letter-spacing:.12em;line-height:1.35;text-transform:uppercase;text-align:center}
.pg-phase-card p{flex:1;margin:0 0 16px;padding:15px 14px;border-radius:14px;background:#FFF6F1;color:var(--pg-ink);font-size:14px;line-height:1.5}
.pg-phase-card:hover{transform:translateY(-4px)}
/* Кадр верхней части настоящей карты: цветная рамка, номер и название этапа, начало вопроса; снизу плавно уходит в фон карточки */
.pg-phase-peek{position:relative;flex:none;overflow:hidden;aspect-ratio:683/450;border:1.5px solid color-mix(in srgb,var(--pg-ink) 34%,transparent);border-bottom:0;border-radius:12px 12px 0 0}
.pg-phase-peek img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 0;-webkit-mask-image:linear-gradient(180deg,#000 76%,transparent 100%);mask-image:linear-gradient(180deg,#000 76%,transparent 100%)}

/* ── Буклет: две стороны внахлёст, без обрезки ── */
html[data-editorial="noya"] .pg-detail-section{position:relative;overflow-x:clip;padding-top:clamp(110px,12vw,160px);background:linear-gradient(180deg,#FEEDE5 0%,#FFF3E3 100%)}
html[data-editorial="noya"] .pg-detail-section::before{content:"";position:absolute;z-index:0;top:0;left:0;right:0;height:clamp(84px,9vw,124px);background:var(--noya-leaves) repeat-x center top/auto 100%;opacity:.92;pointer-events:none}
html[data-editorial="noya"] .pg-detail-section .pg-wrap{position:relative;z-index:1}
.pg-booklet{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,7vw,100px);align-items:center}
.pg-booklet-pair{display:flex;justify-content:center;align-items:flex-start;padding:14px 0 30px}
.pg-booklet-pair img{width:46%;height:auto;border-radius:8px;box-shadow:var(--pg-shadow-md),0 2px 6px color-mix(in srgb,var(--pg-ink) 14%,transparent)}
.pg-booklet-cover{position:relative;z-index:2;transform:rotate(-4deg)}
.pg-booklet-back{margin:44px 0 0 -7%;transform:rotate(5deg)}
.pg-booklet-copy .pg-section-head{margin-bottom:26px}
.pg-booklet-copy .pg-section-head h2{margin-bottom:14px}
.pg-booklet-copy h3{margin:0 0 8px;font-size:21px}
.pg-booklet-copy>p{max-width:46ch;margin:0 0 18px;color:var(--pg-ink-soft);font-size:16px;line-height:1.6}
.pg-booklet-list{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.pg-booklet-list li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:center;font-size:15px;font-weight:500}
.pg-booklet-tick{display:grid;width:30px;height:30px;place-items:center;border-radius:50%;background:var(--pg-aud-icon-bg);color:var(--pg-accent)}
.pg-booklet-tick .pg-dood{width:16px;height:16px}

/* контраст: подпись отзыва и лид финала ≥4.5:1 */
html[data-editorial="noya"] .pg-quote cite{color:color-mix(in srgb,var(--pg-ink) 86%,transparent)}
html[data-editorial="noya"] .pg-finale-copy>p:not(.pg-script){color:rgba(255,246,232,.94)}

/* ── Финал: листва по верхнему краю карточки ── */
html[data-editorial="noya"] .pg-finale-card{padding-top:clamp(92px,9vw,120px)}
.noya-final-leaves{position:absolute;z-index:1;top:0;left:0;right:0;height:clamp(70px,8vw,112px);background:var(--noya-leaves) repeat-x center top/auto 100%;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent);opacity:.9;pointer-events:none}

/* ── Адаптив ── */
@media(max-width:1180px) and (min-width:901px){.pg-phase-card h3{font-size:11px;letter-spacing:.06em}}
@media(max-width:1050px){html[data-editorial="noya"]{--noya-stage-gap:14px}.pg-phase-card{padding:18px 12px 14px}.pg-phase-card p{padding:12px;font-size:13px}}
@media(max-width:900px){
.pg-stages{display:flex;gap:var(--noya-stage-gap);overflow-x:auto;margin-inline:-22px;padding:0 22px 22px;scroll-snap-type:x mandatory;scroll-padding-inline:22px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pg-stages::-webkit-scrollbar{display:none}
.pg-phase{flex:0 0 min(72vw,270px);scroll-snap-align:start}
.pg-phase-card{padding:20px 16px 16px}.pg-phase-card p{padding:15px 14px;font-size:14px}
.pg-booklet{grid-template-columns:1fr;gap:20px}
.noya-cloud{display:none}
.pg-booklet-pair{order:-1}
.pg-booklet-pair img{width:min(46%,240px)}
}
@media(max-width:620px){
html[data-editorial="noya"]{--noya-stage-gap:22px}
.pg-stages{display:grid;grid-template-columns:1fr;overflow:visible;margin-inline:0;padding:0;scroll-snap-type:none}
.pg-phase{flex:none;display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:14px;align-items:start}
.pg-phase::before{top:44px;left:17px;right:auto;bottom:calc(8px - var(--noya-stage-gap));border-top:0;border-left:2px dashed color-mix(in srgb,var(--pg-ink) 28%,transparent)}
.pg-phase-num{margin-top:14px}
.pg-phase-card{padding:20px 16px 16px}
html[data-editorial="noya"] .pg-detail-section{padding-top:104px}
.pg-booklet-pair img{width:44%}
.pg-booklet-pair{padding-bottom:12px}
html[data-editorial="noya"] .pg-finale-card{padding-top:84px}
}
/* «Время открыть коробку»: коробка крупнее (камера вписывает её по высоте сцены) и цветное свечение за ней шире */
@media(max-width:620px){
.pg-final-stage{height:340px}
.pg-final-glow{width:150%}
}
@media(prefers-reduced-motion:reduce){.pg-phase-card{transition:none}.pg-phase-card:hover{transform:none}}

/* ═══ 22.10 · Семь вариантов «Пять шагов навстречу» (выбор одного) ═══
   У каждого этапа — цвет рамки его карт (--stage), описание и первый вопрос с настоящей карты. Картинок карт нет. */
.noya-variant{border-top:1px dashed color-mix(in srgb,var(--pg-ink) 22%,transparent)}
.noya-variant--paper{background:var(--pg-paper)}
.noya-variant-tag{width:fit-content;margin:0 auto 18px;padding:6px 14px;border-radius:999px;background:var(--pg-ink);color:var(--pg-paper);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
/* «Пять шагов» на странице — вариант 15 на фоне страницы, как в архиве вариантов, где его выбрали */
.pg-experience.noya-steps{background:var(--pg-bg)}
:where(.noya-variant,.noya-steps) ol{margin:0;padding:0;list-style:none} /* сброс без веса — поля лент (3, 5, 13, 15, 17) задают их собственные классы */
.noya-variant h3,.noya-steps h3{margin:0;color:var(--pg-ink);font-size:18px;font-weight:600;line-height:1.25}
.noya-variant p,.noya-steps p{margin:0}
.noya-q{color:var(--pg-ink);font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:15px;line-height:1.45}
/* 19 · Список без карточек, как «Классика» на ВСД (.pg-flow-list из game-editorial.css).
   Номер — в цвет рамки карт этапа, притемнённый к тексту: чистая пастель этапов на светлом фоне читается плохо */
.noya-flow{max-width:640px;margin:0 auto}
.noya-flow li{--pg-accent:color-mix(in srgb,var(--stage) 62%,var(--pg-ink))}
.noya-flow .noya-q{margin-top:10px;color:var(--pg-ink)}

/* 1 · Тропа: пунктирная дорожка, цветные вехи-номера */
.noya-v1-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px}
.noya-v1-list li{position:relative;display:flex;flex-direction:column;gap:10px}
.noya-v1-list li::before{content:"";position:absolute;top:26px;left:60px;right:-22px;border-top:2px dashed color-mix(in srgb,var(--pg-ink) 30%,transparent)}
.noya-v1-list li:last-child::before{display:none}
.noya-v1-dot{position:relative;display:grid;width:52px;height:52px;place-items:center;margin-bottom:6px;border-radius:50%;background:var(--stage);box-shadow:0 0 0 6px color-mix(in srgb,var(--stage) 28%,transparent);color:var(--pg-ink);font-family:StampatelloFaceto,Inter,sans-serif;font-size:26px}
.noya-v1-list li>p:not(.noya-q){color:var(--pg-muted);font-size:14px;line-height:1.55}
.noya-v1-list .noya-q{padding-left:12px;border-left:3px solid var(--stage)}

/* 2 · Цветные закладки: этапы — плотные цветные полосы, большой номер */
.noya-v2-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;align-items:end}
.noya-v2-list li{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:330px;overflow:hidden;padding:22px 18px;border-radius:22px 22px 10px 10px;background:linear-gradient(180deg,color-mix(in srgb,var(--stage) 55%,#fff) 0%,var(--stage) 100%);color:var(--pg-ink)}
.noya-v2-list li:nth-child(2){min-height:350px}.noya-v2-list li:nth-child(3){min-height:370px}.noya-v2-list li:nth-child(4){min-height:390px}.noya-v2-list li:nth-child(5){min-height:410px}
.noya-v2-num{position:absolute;top:10px;left:16px;color:color-mix(in srgb,var(--pg-ink) 22%,transparent);font-family:StampatelloFaceto,Inter,sans-serif;font-size:96px;line-height:1}
.noya-v2-list h3{margin-bottom:8px;font-size:19px}
.noya-v2-list li p{font-size:14px;line-height:1.5}

/* 3 · Вопрос этапа: белая карточка с цветной кромкой и вопросом в «облачке» */
.noya-v3-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.noya-v3-list li{display:flex;flex-direction:column;gap:8px;padding:20px 18px 18px;border-top:8px solid var(--stage);border-radius:18px;background:var(--pg-paper);box-shadow:0 22px 40px -28px color-mix(in srgb,var(--pg-ink) 45%,transparent)}
.noya-v3-step{color:var(--pg-muted);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.noya-v3-text{flex:1;color:var(--pg-muted);font-size:14px;line-height:1.5}
.noya-v3-bubble{position:relative;margin:10px 0 0;padding:14px 14px 16px;border-radius:14px 14px 14px 4px;background:color-mix(in srgb,var(--stage) 32%,#fff)}
.noya-v3-bubble p{color:var(--pg-ink);font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:14.5px;line-height:1.45}

/* 4 · Лестница: ступени растут от разминки к рефлексии */
.noya-v4-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:end}
.noya-v4-list li{display:flex;flex-direction:column;gap:16px}
.noya-v4-copy{display:flex;flex-direction:column;gap:6px}
.noya-v4-copy p{color:var(--pg-muted);font-size:14px;line-height:1.5}
.noya-v4-step{display:grid;place-items:center;height:calc(70px + var(--i,0) * 46px);border-radius:14px 14px 4px 4px;background:var(--stage);color:color-mix(in srgb,var(--pg-ink) 55%,transparent);font-family:StampatelloFaceto,Inter,sans-serif;font-size:44px}
.noya-v4-list li:nth-child(2){--i:1}.noya-v4-list li:nth-child(3){--i:2}.noya-v4-list li:nth-child(4){--i:3}.noya-v4-list li:nth-child(5){--i:4}

/* 5 · Карты без картинок: карта нарисована CSS в цветах этапа (рамка, светлое поле, вопрос), описание — под картой, на фоне страницы */
.noya-v5-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px}
.noya-v5-list li{display:flex;flex-direction:column;gap:14px}
.noya-v5-card{position:relative;display:flex;flex-direction:column;aspect-ratio:78/118;padding:16px 14px 30px;border:10px solid var(--stage);border-radius:16px;background:#FFF9F3;box-shadow:0 0 0 1.5px color-mix(in srgb,var(--pg-ink) 40%,transparent),0 26px 40px -24px color-mix(in srgb,var(--pg-ink) 55%,transparent);transform:rotate(var(--r,0deg));transition:transform .3s var(--pg-ease)}
.noya-v5-list li:nth-child(1){--r:-2.5deg}.noya-v5-list li:nth-child(2){--r:1.5deg}.noya-v5-list li:nth-child(3){--r:-1deg}.noya-v5-list li:nth-child(4){--r:2deg}.noya-v5-list li:nth-child(5){--r:-1.5deg}
.noya-v5-card:hover{transform:rotate(0deg) translateY(-6px)}
.noya-v5-title{padding-bottom:10px;border-bottom:1.5px dashed color-mix(in srgb,var(--stage) 80%,var(--pg-ink));color:var(--pg-ink);font-size:11px;font-weight:700;letter-spacing:.12em;text-align:center;text-transform:uppercase}
.noya-v5-q{display:flex;flex:1;align-items:center;justify-content:center;padding-top:10px;color:var(--pg-ink);font-size:14px;font-weight:500;line-height:1.4;text-align:center}
.noya-v5-n{position:absolute;right:12px;bottom:8px;color:var(--pg-muted);font-size:11px;font-weight:600}
.noya-v5-text{color:var(--pg-muted);font-size:14px;line-height:1.5}

/* 6 · Переключатель: пять цветных кнопок этапов и одна панель с описанием и вопросом */
.noya-v6{max-width:900px;margin:0 auto}
.noya-v6-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:14px}
.noya-v6-tab{display:flex;min-height:56px;align-items:center;gap:10px;padding:8px 12px;border:1.5px solid color-mix(in srgb,var(--pg-ink) 18%,transparent);border-radius:14px;background:var(--pg-paper);color:var(--pg-ink);font:inherit;text-align:left;cursor:pointer;transition:background .25s,border-color .25s}
.noya-v6-tab span{display:grid;flex:none;width:30px;height:30px;place-items:center;border-radius:50%;background:var(--stage);font-weight:700;font-size:14px}
.noya-v6-tab b{font-size:13px;font-weight:600;line-height:1.25}
.noya-v6-tab[aria-selected="true"]{border-color:var(--stage);background:color-mix(in srgb,var(--stage) 38%,#fff)}
.noya-v6-tab:focus-visible{outline:2px solid var(--pg-accent);outline-offset:2px}
.noya-v6-panel{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:center;min-height:220px;padding:32px 36px;border-radius:24px;background:linear-gradient(140deg,color-mix(in srgb,var(--stage) 30%,#fff),color-mix(in srgb,var(--stage) 65%,#fff))}
.noya-v6-panel[hidden]{display:none}
.noya-v6-panel:not([hidden]){animation:noya-v6-in .35s var(--pg-ease)}
@keyframes noya-v6-in{from{opacity:0;transform:translateY(8px)}}
.noya-v6-big{color:color-mix(in srgb,var(--pg-ink) 30%,transparent);font-family:StampatelloFaceto,Inter,sans-serif;font-size:120px;line-height:.8}
.noya-v6-panel h3{margin-bottom:8px;font-size:24px}
.noya-v6-panel div>p:not(.noya-q){margin-bottom:14px;color:var(--pg-ink);font-size:16px;line-height:1.55}

/* 7 · Шкала разговора: у каждой карточки — полоса из пяти делений, закрашенных до текущего этапа */
.noya-v7-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.noya-v7-list li{display:flex;flex-direction:column;gap:8px;padding:18px 16px 20px;border:1.5px solid color-mix(in srgb,var(--pg-ink) 14%,transparent);border-radius:18px;background:var(--pg-paper)}
.noya-v7-bar{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-bottom:8px}
.noya-v7-bar i{height:8px;border-radius:4px;background:color-mix(in srgb,var(--pg-ink) 10%,transparent)}
.noya-v7-step{color:var(--pg-muted);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.noya-v7-list li>p:not(.noya-v7-step):not(.noya-q){flex:1;color:var(--pg-muted);font-size:14px;line-height:1.5}

/* узкий десктоп и планшет: пять колонок не помещаются — по 3 (и 2) в ряд */
@media(max-width:1050px){
.noya-v1-list,.noya-v3-list,.noya-v5-list,.noya-v7-list{grid-template-columns:repeat(3,minmax(0,1fr))}
.noya-v1-list li::before{display:none}
.noya-v6-tab b{font-size:12px}
}

/* телефон */
@media(max-width:620px){
.noya-variant-tag{font-size:11px}
/* 1 — вертикальная дорожка */
.noya-v1-list{grid-template-columns:1fr;gap:0}
.noya-v1-list li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px;row-gap:8px;padding-bottom:28px}
.noya-v1-list li::before{display:block;top:52px;bottom:4px;left:21px;right:auto;border-top:0;border-left:2px dashed color-mix(in srgb,var(--pg-ink) 30%,transparent)}
.noya-v1-dot{grid-row:1/4;width:44px;height:44px;margin:0;font-size:22px}
.noya-v1-list li>*:not(.noya-v1-dot){grid-column:2}
.noya-v1-list h3{padding-top:10px}
/* 2 — закладки лежат стопкой */
.noya-v2-list{grid-template-columns:1fr;gap:0}
.noya-v2-list li,.noya-v2-list li:nth-child(n){min-height:0;flex-direction:row;align-items:center;gap:14px;margin-top:-14px;padding:22px 18px 30px;border-radius:20px 20px 0 0;box-shadow:0 -8px 20px -14px color-mix(in srgb,var(--pg-ink) 50%,transparent)}
.noya-v2-list li:first-child{margin-top:0}
.noya-v2-list li:last-child{padding-bottom:22px;border-radius:20px}
.noya-v2-num{position:static;flex:none;width:44px;font-size:56px;text-align:center}
/* 3 и 5 — лента с прокруткой: первая карточка на отступе страницы, тень не обрезается (правило лент из UI Library) */
.noya-v3-list,.noya-v5-list{display:flex;gap:14px;margin:0 -18px -30px;padding:6px 18px 40px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:18px;overscroll-behavior-x:contain;scrollbar-width:none}
.noya-v3-list::-webkit-scrollbar,.noya-v5-list::-webkit-scrollbar{display:none}
.noya-v3-list li{flex:0 0 min(78vw,285px);scroll-snap-align:start}
.noya-v5-list li{flex:0 0 min(62vw,230px);scroll-snap-align:start}
.noya-v5-list{padding-top:14px}
/* 4 — ступени уходят вправо */
.noya-v4-list{grid-template-columns:1fr;gap:10px}
.noya-v4-list li{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;margin-left:calc(var(--i,0) * 10px)}
.noya-v4-step{order:-1;width:56px;height:56px;border-radius:14px;font-size:30px}
/* 6 — кнопки этапов кружками в ряд, название — в панели */
.noya-v6-tabs{gap:6px}
.noya-v6-tab{min-height:52px;justify-content:center;padding:6px}
.noya-v6-tab b{display:none}
.noya-v6-tab span{width:34px;height:34px;font-size:15px}
.noya-v6-panel{grid-template-columns:1fr;gap:6px;min-height:0;padding:22px 20px 24px;border-radius:20px}
.noya-v6-big{font-size:56px;line-height:1}
.noya-v6-panel h3{font-size:21px}
.noya-v6-panel div>p:not(.noya-q){font-size:15px}
/* 7 — карточки одна под другой */
.noya-v7-list{grid-template-columns:1fr;gap:12px}
}
@media(prefers-reduced-motion:reduce){.noya-v5-card{transition:none}.noya-v5-card:hover{transform:rotate(var(--r,0deg))}.noya-v6-panel:not([hidden]){animation:none}}

/* ═══ 22.10 · вторая волна «Пять шагов»: 8–12 без картинок, 13–17 с картами (карта на контрастной подложке) ═══ */

/* 8 · Круг разговора: у каждого этапа — «пирог» с долей пройденного пути, в центре круга — подпись; на десктопе этапы по кругу */
.noya-v8{position:relative;width:min(100%,760px);aspect-ratio:1;margin:0 auto}
.noya-v8::before{content:"";position:absolute;inset:14%;border:2px dashed color-mix(in srgb,var(--pg-ink) 22%,transparent);border-radius:50%}
.noya-v8-core{position:absolute;left:50%;top:50%;margin:0;transform:translate(-50%,-50%);color:var(--pg-accent);font-family:StampatelloFaceto,Inter,sans-serif;font-size:34px;line-height:1;text-align:center}
.noya-v8-list li{position:absolute;display:flex;width:210px;flex-direction:column;align-items:center;gap:8px;text-align:center;transform:translate(-50%,-50%)}
.noya-v8-list li:nth-child(1){left:50%;top:14%}.noya-v8-list li:nth-child(2){left:86%;top:40%}.noya-v8-list li:nth-child(3){left:72%;top:84%}.noya-v8-list li:nth-child(4){left:28%;top:84%}.noya-v8-list li:nth-child(5){left:14%;top:40%}
.noya-v8-pie{display:grid;flex:none;width:58px;height:58px;place-items:center;border-radius:50%;background:radial-gradient(closest-side,var(--pg-paper) 64%,transparent 66%),conic-gradient(var(--stage) var(--part),color-mix(in srgb,var(--pg-ink) 10%,transparent) 0);color:var(--pg-ink);font-weight:700;font-size:18px}
.noya-v8-list li p{color:var(--pg-muted);font-size:13.5px;line-height:1.45}

/* 9 · Переписка: этапы — сообщения двух собеседников, вопрос с карты — текст сообщения */
.noya-v9-chat{display:flex;max-width:680px;flex-direction:column;gap:18px;margin:0 auto}
.noya-v9-msg{display:flex;max-width:82%;flex-direction:column;gap:6px}
.noya-v9-msg--teen{align-self:flex-end;align-items:flex-end;text-align:right}
.noya-v9-meta{color:var(--pg-muted);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.noya-v9-bubble{padding:14px 18px;border-radius:20px 20px 20px 6px;background:color-mix(in srgb,var(--stage) 45%,#fff);color:var(--pg-ink);font-size:17px;font-weight:500;line-height:1.4}
.noya-v9-msg--teen .noya-v9-bubble{border-radius:20px 20px 6px 20px;background:var(--pg-ink);color:var(--pg-paper)}
.noya-v9-note{max-width:420px;color:var(--pg-muted);font-size:13.5px;line-height:1.45}

/* 10 · Глубина: этапы — слои, от светлого «у поверхности» к насыщенному «на глубине» и обратно к рефлексии */
.noya-v10-list{display:grid;gap:0;overflow:hidden;border-radius:24px}
.noya-v10-list li{display:grid;grid-template-columns:150px minmax(0,220px) minmax(0,1fr);gap:24px;align-items:center;padding:22px 30px;background:color-mix(in srgb,var(--stage) var(--mix,30%),#fff)}
.noya-v10-list li:nth-child(2){--mix:48%}.noya-v10-list li:nth-child(3){--mix:66%}.noya-v10-list li:nth-child(4){--mix:84%}.noya-v10-list li:nth-child(5){--mix:42%}
.noya-v10-depth{color:color-mix(in srgb,var(--pg-ink) 70%,transparent);font-family:StampatelloFaceto,Inter,sans-serif;font-size:22px;line-height:1}
.noya-v10-list h3{display:flex;align-items:baseline;gap:10px}
.noya-v10-list h3 span{color:color-mix(in srgb,var(--pg-ink) 45%,transparent);font-size:14px;font-weight:700}
.noya-v10-list p{color:var(--pg-ink);font-size:14.5px;line-height:1.5}

/* 11 · Плакатные цифры: огромные цифры-контуры в цвет этапа, строки зигзагом. Высоту строки задаёт только карточка текста:
   цифра вынесена из потока — сбоку от своей карточки (заходит на её край на 20px) и приподнята над её верхом, поэтому
   между этапами ровно 32px (UI Library: --space-7, «большой gap между блоками секции») */
.noya-v11-list{display:grid;gap:var(--space-7,32px)}
.noya-v11-list li{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.noya-v11-num{position:absolute;z-index:0;top:-48px;right:calc(50% - 20px);color:transparent;font-family:StampatelloFaceto,Inter,sans-serif;font-size:220px;line-height:.8;-webkit-text-stroke:3px var(--stage);pointer-events:none}
.noya-v11-copy{position:relative;z-index:1;grid-column:2;display:flex;max-width:420px;flex-direction:column;gap:8px;padding:22px 24px;border-radius:18px;background:color-mix(in srgb,var(--pg-paper) 88%,transparent);box-shadow:0 18px 36px -26px color-mix(in srgb,var(--pg-ink) 50%,transparent)}
.noya-v11-list li:nth-child(even) .noya-v11-num{right:auto;left:calc(50% - 20px)}
.noya-v11-list li:nth-child(even) .noya-v11-copy{grid-column:1;grid-row:1;justify-self:end}
.noya-v11-copy>p:not(.noya-q){color:var(--pg-muted);font-size:14.5px;line-height:1.5}

/* 12 · Раскрывающиеся этапы: строка — номер и название, по нажатию — описание и вопрос (без «плюса» из base.css) */
.noya-v12{max-width:760px;margin:0 auto}
.noya-v12-item{margin-bottom:10px;overflow:hidden;border-radius:18px;background:var(--pg-paper);box-shadow:inset 6px 0 0 var(--stage),0 10px 24px -20px color-mix(in srgb,var(--pg-ink) 50%,transparent)}
.noya-v12-item summary{gap:14px;padding:16px 20px 16px 24px;font-family:Inter,sans-serif;font-size:18px}
.noya-v12-item summary::after{content:none;display:none}
.noya-v12-num{display:grid;flex:none;width:34px;height:34px;place-items:center;border-radius:50%;background:var(--stage);color:var(--pg-ink);font-size:15px;font-weight:700}
.noya-v12-title{flex:1;color:var(--pg-ink);font-weight:600}
.noya-v12-chev{flex:none;width:10px;height:10px;border-right:2px solid var(--pg-ink);border-bottom:2px solid var(--pg-ink);transform:rotate(45deg) translate(-2px,-2px);transition:transform .3s var(--pg-ease)}
.noya-v12-item[open] .noya-v12-chev{transform:rotate(-135deg)}
.noya-v12-body{display:flex;flex-direction:column;gap:10px;padding:0 24px 20px 72px}
.noya-v12-body>p:not(.noya-q){color:var(--pg-muted);font-size:15px;line-height:1.55}
.noya-v12-body p{max-width:none;padding:0} /* base.css даёт абзацам в <details> поля под свой «плюс» — здесь они не нужны */

/* 13 · Карты на тёмной плашке: светлая карта на сливовом фоне — контраст, текст под плашкой на светлом */
.noya-v13-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.noya-v13-list li{display:flex;flex-direction:column;overflow:hidden;border-radius:20px;background:var(--pg-paper);box-shadow:0 22px 40px -28px color-mix(in srgb,var(--pg-ink) 50%,transparent)}
.noya-v13-stage{display:grid;place-items:center;padding:22px 20px 18px;background:radial-gradient(80% 70% at 50% 30%,color-mix(in srgb,var(--stage) 55%,var(--pg-deep)) 0%,var(--pg-deep) 75%)}
.noya-v13-stage img{width:78%;height:auto;border-radius:8px;box-shadow:0 18px 30px -14px rgba(0,0,0,.6);transform:rotate(-3deg)}
.noya-v13-list li:nth-child(even) .noya-v13-stage img{transform:rotate(3deg)}
.noya-v13-copy{display:flex;flex-direction:column;gap:6px;padding:16px 16px 18px;border-top:5px solid var(--stage)}
.noya-v13-step{color:var(--pg-muted);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.noya-v13-copy>p:last-child{color:var(--pg-muted);font-size:13.5px;line-height:1.5}

/* 14 · Стопка карт: настоящие карты лежат стопкой, выбранный этап поднимает свою карту наверх */
.noya-v14{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,5vw,64px);align-items:center}
.noya-v14-stack{position:relative;width:min(100%,320px);aspect-ratio:683/1024;margin:0 auto}
.noya-v14-card{position:absolute;inset:0;width:100%;height:100%;border-radius:12px;box-shadow:0 2px 0 1px color-mix(in srgb,var(--pg-ink) 15%,transparent),0 24px 40px -22px color-mix(in srgb,var(--pg-ink) 60%,transparent);transform:translate(var(--sx,0),var(--sy,0)) rotate(var(--sr,0deg));transition:transform .45s var(--pg-ease),opacity .3s}
.noya-v14-card:nth-child(1){--sr:-6deg;--sx:-14px}.noya-v14-card:nth-child(2){--sr:4deg;--sx:12px;--sy:6px}.noya-v14-card:nth-child(3){--sr:-2deg;--sy:10px}.noya-v14-card:nth-child(4){--sr:7deg;--sx:18px}.noya-v14-card:nth-child(5){--sr:-4deg;--sx:-8px;--sy:14px}
.noya-v14-card.is-top{z-index:6;--sr:0deg;--sx:0px;--sy:-10px}
.noya-v14-list{display:grid;gap:8px}
.noya-v14-pick{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:14px;width:100%;padding:14px 16px;border:1.5px solid transparent;border-radius:16px;background:none;color:var(--pg-ink);font:inherit;text-align:left;cursor:pointer;transition:background .25s,border-color .25s}
.noya-v14-pick span{grid-row:1/3;display:grid;width:36px;height:36px;place-items:center;border-radius:50%;background:var(--stage);font-weight:700}
.noya-v14-pick b{font-size:17px;font-weight:600}
.noya-v14-pick small{color:var(--pg-muted);font-size:13.5px;line-height:1.45}
.noya-v14-pick[aria-pressed="true"]{border-color:var(--stage);background:color-mix(in srgb,var(--stage) 22%,#fff)}
.noya-v14-pick:focus-visible{outline:2px solid var(--pg-accent);outline-offset:2px}

/* 15 · Карта на цветном круге: круг цвета этапа отделяет карту от фона, этапы соединены линией под кругами */
.noya-v15-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.noya-v15-list li{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.noya-v15-disc{display:grid;width:100%;max-width:190px;aspect-ratio:1;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--stage) 55%,#fff),var(--stage))}
.noya-v15-disc img{width:52%;height:auto;border-radius:6px;box-shadow:0 14px 22px -10px rgba(60,30,30,.55);transform:rotate(-6deg)}
.noya-v15-list li:nth-child(even) .noya-v15-disc img{transform:rotate(5deg)}
.noya-v15-dot{position:relative;z-index:1;display:grid;width:30px;height:30px;margin-top:4px;place-items:center;border:2px solid var(--pg-paper);border-radius:50%;background:var(--pg-ink);color:var(--pg-paper);font-size:13px;font-weight:700}
.noya-v15-list li::after{content:"";position:absolute;top:calc(min(100%,190px) + 18px);left:50%;width:calc(100% + 18px);border-top:2px dashed color-mix(in srgb,var(--pg-ink) 26%,transparent)}
.noya-v15-list li:last-child::after{display:none}
.noya-v15-list li p{color:var(--pg-muted);font-size:13.5px;line-height:1.45}

/* 16 · Большая карта и миниатюры: одна карта крупно на фоне цвета этапа, ниже — пять миниатюр-переключателей */
.noya-v16{max-width:940px;margin:0 auto}
.noya-v16-view{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(22px,5vw,56px);align-items:center;padding:clamp(20px,4vw,40px);border-radius:28px;background:linear-gradient(140deg,color-mix(in srgb,var(--stage) 28%,#fff),color-mix(in srgb,var(--stage) 70%,#fff))}
.noya-v16-view[hidden]{display:none}
.noya-v16-view:not([hidden]){animation:noya-v6-in .35s var(--pg-ease)}
.noya-v16-big img{display:block;width:100%;height:auto;border-radius:12px;box-shadow:0 26px 44px -22px rgba(60,30,30,.6)}
.noya-v16-copy{display:flex;flex-direction:column;gap:10px}
.noya-v16-step{color:color-mix(in srgb,var(--pg-ink) 65%,transparent);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.noya-v16-copy h3{font-size:26px}
.noya-v16-copy>p:not(.noya-q):not(.noya-v16-step){color:var(--pg-ink);font-size:16px;line-height:1.55}
.noya-v16-thumbs{display:flex;justify-content:center;gap:12px;margin-top:18px}
.noya-v16-thumb{width:64px;padding:0;border:3px solid transparent;border-radius:10px;background:none;opacity:.55;cursor:pointer;transition:opacity .25s,transform .25s,border-color .25s}
.noya-v16-thumb img{display:block;width:100%;height:auto;border-radius:7px}
.noya-v16-thumb[aria-pressed="true"]{border-color:var(--stage);opacity:1;transform:translateY(-4px)}
.noya-v16-thumb:focus-visible{outline:2px solid var(--pg-accent);outline-offset:2px}

/* 17 · Доска с полароидами: карты-фотографии на крафтовой доске, подпись этапа рукописным шрифтом */
.noya-v17-board{padding:clamp(22px,4vw,44px);border-radius:28px;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.08) 0 2px,transparent 3px) 0 0/22px 22px,linear-gradient(160deg,#8A5A3C,#6E4430)}
.noya-v17-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.noya-v17-list li{display:flex;flex-direction:column;gap:12px}
.noya-v17-photo{position:relative;margin:0;padding:10px 10px 12px;background:#FFFBF5;box-shadow:0 16px 26px -14px rgba(0,0,0,.6);transform:rotate(var(--r,-2deg))}
.noya-v17-list li:nth-child(2){--r:2.5deg}.noya-v17-list li:nth-child(3){--r:-1deg}.noya-v17-list li:nth-child(4){--r:3deg}.noya-v17-list li:nth-child(5){--r:-3deg}
.noya-v17-photo::before{content:"";position:absolute;top:-10px;left:50%;width:56px;height:20px;background:color-mix(in srgb,var(--stage) 75%,#fff);opacity:.9;transform:translateX(-50%) rotate(-3deg)}
.noya-v17-photo img{display:block;width:100%;height:auto}
.noya-v17-photo figcaption{margin-top:8px;color:var(--pg-ink);font-family:StampatelloFaceto,Inter,sans-serif;font-size:19px;line-height:1.1;text-align:center}
.noya-v17-list li>p{color:#F7E7D6;font-size:13.5px;line-height:1.45}

@media(max-width:1050px){
.noya-v8{aspect-ratio:auto}.noya-v8::before,.noya-v8-core{display:none}
.noya-v8-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.noya-v8-list li{position:static;width:auto;transform:none}
.noya-v13-list,.noya-v15-list,.noya-v17-list{grid-template-columns:repeat(3,minmax(0,1fr))}
.noya-v15-list li::after{display:none}
.noya-v10-list li{grid-template-columns:120px minmax(0,1fr);row-gap:6px}.noya-v10-list li p{grid-column:2}
}
@media(max-width:620px){
/* 8 — список: «пирог» слева */
.noya-v8-list{grid-template-columns:1fr;gap:16px}
.noya-v8-list li{flex-direction:row;align-items:flex-start;gap:14px;text-align:left}
.noya-v8-pie{width:48px;height:48px;font-size:16px}
/* 9 — сообщения шире */
.noya-v9-msg{max-width:92%}
.noya-v9-bubble{font-size:15.5px}
/* 10 — слои в одну колонку */
.noya-v10-list{border-radius:20px}
.noya-v10-list li{grid-template-columns:1fr;gap:4px;padding:18px 20px}.noya-v10-list li p{grid-column:auto}
.noya-v10-depth{font-size:18px}
/* 11 — цифра над карточкой текста */
/* Вариант 11 на телефоне: цифра справа и в три слоя — над подложкой карточки, но под её текстом.
   Подложка (.noya-v11-copy) своего слоя не создаёт (без z-index), поэтому цифра (z-index 1) ложится на её фон,
   а текст (z-index 2) — поверх цифры; слои не выходят за пределы этапа (isolation). Между этапами 32px
   (UI Library: --space-7, «большой gap между блоками секции»); от подводки до первого этапа — 28px заголовка + 32px */
.noya-v11-list{gap:0}
.noya-v11-list li,.noya-v11-list li:nth-child(even){display:block;min-height:0;padding-top:var(--space-7,32px);isolation:isolate}
.noya-v11-num,.noya-v11-list li:nth-child(even) .noya-v11-num{position:absolute;z-index:1;top:-14px;left:auto;right:14px;margin:0;font-size:110px;line-height:.8;-webkit-text-stroke-width:2.5px}
.noya-v11-copy,.noya-v11-list li:nth-child(even) .noya-v11-copy{position:static;justify-self:stretch;max-width:none;padding:18px} /* justify-self: десктопный end у чётных Chrome применяет и к блоку — короткая карточка ужималась вправо */
.noya-v11-copy>*{position:relative;z-index:2}
/* 12 */
.noya-v12-item summary{font-size:16px;padding:14px 16px 14px 20px}
.noya-v12-body{padding:0 18px 18px 20px}
/* 13, 15, 17 — лента с прокруткой: первая карточка на отступе страницы (правило лент UI Library) */
.noya-v13-list,.noya-v15-list,.noya-v17-list{display:flex;gap:14px;margin:0 -18px -30px;padding:6px 18px 40px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:18px;overscroll-behavior-x:contain;scrollbar-width:none}
.noya-v13-list::-webkit-scrollbar,.noya-v15-list::-webkit-scrollbar,.noya-v17-list::-webkit-scrollbar{display:none}
.noya-v13-list li{flex:0 0 min(64vw,240px);scroll-snap-align:start}
.noya-v15-list li{flex:0 0 min(56vw,210px);scroll-snap-align:start}
.noya-v17-board{margin-inline:-18px;padding:24px 0 8px;border-radius:0}
.noya-v17-list{margin:0;padding:10px 18px 30px}
.noya-v17-list li{flex:0 0 min(52vw,200px);scroll-snap-align:start}
/* 14 — стопка сверху, этапы под ней */
.noya-v14{grid-template-columns:1fr;gap:26px}
.noya-v14-stack{width:min(62vw,230px)}
/* 16 — карта над текстом */
.noya-v16-view{grid-template-columns:1fr;justify-items:center;padding:22px 20px 24px;border-radius:22px}
.noya-v16-big{width:min(58vw,220px)}
.noya-v16-copy h3{font-size:22px}
.noya-v16-copy>p:not(.noya-q):not(.noya-v16-step){font-size:15px}
.noya-v16-thumbs{gap:8px}
.noya-v16-thumb{width:54px}
}
@media(prefers-reduced-motion:reduce){.noya-v12-chev,.noya-v14-card,.noya-v16-thumb{transition:none}.noya-v16-view:not([hidden]){animation:none}}

/* 18 · Как «Классика» на ВСД: тёмная секция цвета игры, слева карта первого этапа, справа список (.pg-flow / .pg-flow-list
   из game-editorial.css). Номера — чистым цветом рамки карт этапа: на тёмном фоне пастель читается */
.noya-v18{--pg-dark-bg:var(--pg-deep)}
.noya-v18 .pg-flow-list h3{margin:0 0 7px;color:inherit;font-size:23px}
.noya-v18 .pg-flow-list li>span{color:var(--stage)}
.noya-v18 .noya-q{margin-top:10px;color:var(--pg-on-dark-ink)}
/* карта не висит посередине высокого списка из пяти этапов: прижата к верху и едет при прокрутке; наклон и тень — как на ВСД */
@media(min-width:901px){.noya-v18 .pg-flow{align-items:start}.noya-v18 .pg-flow-card{position:sticky;top:140px}}
.noya-v18 .pg-flow-card{transform:rotate(-4deg);filter:drop-shadow(0 26px 34px rgba(0,0,0,.35))}
