
.pksz-page{max-width:1240px;margin:0 auto;padding:16px 16px 40px}
.pksz-crumb{font-size:13px;color:var(--pk-color-text-muted,#767676);margin:0 0 12px}
.pksz-crumb a{color:inherit;text-decoration:none}
.pksz-crumb a:hover{text-decoration:underline}
/* GOAL_RENDER95 Ш6 п.1: сетка карточки товара — вьюер 1.1fr | панель цены ≤480px (не 1fr/1fr,
 * как в rm6 — правая колонка на 1440 была слишком широкой и пустовала ниже цены). */
.pksz-top{display:grid;grid-template-columns:1.1fr minmax(0,480px);gap:24px;padding-bottom:24px;border-bottom:1px solid var(--pk-color-border,#e3e3e3);align-items:start}
/* ревью 22.10 (размер, п.4): под блоком цены пустовало ~500px до низа левой колонки — sticky
 * (не relative+top, не ломает поток страницы), правая колонка остаётся видна при скролле чертежа. */
.pksz-top-aside{position:sticky;top:16px}
@media (max-width:1023px){.pksz-top-aside{position:static}}
/* Ш10 (оценка s9 §5 п.1): .pksz-top{align-items:start} (выше) не растягивал правую колонку под
 * высоту левой (фото+ползунки) — карточка цены заканчивалась на ~130px выше низа левой колонки,
 * под ней было видно пустой фон страницы. align-self:stretch растягивает САМ грид-item на всю
 * высоту строки (0 новых фактов, просто фон карточки идёт до конца), flex-колонка внутри —
 * чтобы .pksz-price-box (а не пустой div-обёртка) реально дотянулся до этой высоты. */
@media (min-width:1024px){
  .pksz-top-aside{align-self:stretch;display:flex;flex-direction:column}
  .pksz-top-aside .pksz-price-box{flex:1 1 auto;display:flex;flex-direction:column}
}
/* УИ-аудит В4 находка 1: grid-колонки по умолчанию min-width:auto — растут под max-content
 * вложенного 3D-канваса (design/motion.js), раздвигая страницу до ~25 млн px высоты. */
.pksz-top > div{min-width:0}
.pksz-top img,.pksz-top svg,.pksz-top canvas,.pksz-top .pk-3d-stage{max-width:100%}
@media (max-width:1023px){.pksz-top{grid-template-columns:1fr}}
/* S6C п.5: .pksz-top теперь из 3 прямых детей (media/aside-цена/specs-характеристики), а не 2.
 * На ≥1024 — area-раскладка (фото+H1 слева сверху, характеристики на всю ширину снизу, цена справа
 * на высоту ПЕРВОЙ строки — см. S9 ниже). На <1024 grid-template-columns:1fr (правило выше) —
 * элементы просто идут друг за другом в порядке разметки: media -> aside(цена) -> specs, т.е. цена
 * сразу под фото, до «Характеристик» (ТЗ п.5), без order и без JS. */
@media (min-width:1024px){
  /* S9 (приёмка оценщика, «Размер», п.1): «price» раньше занимал обе строки («media price»/
   * «specs price») — после переезда ползунков в .pksz-top-media (левая колонка стала заметно
   * выше) правая карточка цены повисала с ~550px пустоты под собой до низа второй строки. Теперь
   * «price» — только первая строка (высота = высоте левой колонки с фото+ползунками), а
   * «Характеристики» — отдельная строка на всю ширину под обеими колонками, без пустой клетки
   * рядом с ней (там и так нечего показывать — «Соседние размеры» уже переехали в aside, Ш6 п.1). */
  .pksz-top{grid-template-areas:"media price" "specs specs"}
  .pksz-top-media{grid-area:media}
  .pksz-top-aside{grid-area:price}
  .pksz-top-specs{grid-area:specs}
}
/* S6C п.2: чип «Группа I» над H1 — информация та же есть в блоке «Группа» справа (.pksz-aside-specs),
 * убираем визуально (без выдумки нового текста, разметка остаётся — просто не показываем). */
.pksz-chip{display:none}
/* УИ-аудит В4, повторный заход: H1 ("Поковка X Ø999 мм") не переносился на 375px — наследовал
 * тему-шный размер шрифта без overflow-wrap, вылезал за край экрана. */
.pksz-top h1{font-size:clamp(22px,6vw,32px);line-height:1.2;overflow-wrap:anywhere;word-break:break-word;margin:0 0 12px;
  /* Раунд 3 (20.10.2026, оркестратор): CLS 0,14 на странице размера — `font-display:swap` у
     Manrope (next.css, сетевой, не трогаем §3) всегда красит H1 фолбэком первым, своп случается
     ИЛИ не случается в зависимости от сетевого таймингa (3 прошлые попытки с preload так и не
     дали 0 детерминированно — см. комментарий у wp_head выше). Вместо гонки со шрифтом резервируем
     высоту под 2 строки заранее (реальный line-height здесь 1,08 — next.css тоже побеждает по
     специфичности, живой замер getComputedStyle: fontSize 28px/lineHeight 30,24px) — переносится
     верстка 1 или 2 строки, высота блока не меняется НИКОГДА, свопайся шрифт когда угодно. */
  min-height: calc(2 * 1.08em);
}
/* r9 22.10: H1 снова 56px в 3 строки (сетевое h1 перебивает .pksz-top h1) — двойной класс сильнее */
/* S6C п.1: кегль уменьшен (было clamp(26,2vw,32)) — на рендере H1 в одну строку на ≥1024; ГОСТ/
 * группа вынесены в .pksz-h1-sub (см. ниже), сама строка H1 теперь короче и помещается чаще. */
.pksz-page .pksz-top h1{font-size:clamp(22px,1.6vw,28px);line-height:1.2;text-wrap:balance;letter-spacing:-.01em}
/* Ш10 (оценка s9 §5 п.4): на 1440 clamp даёт 1,6vw≈23px — мельче цены рядом (30px) и мельче
 * рендера (32px). Поднимаем только ≥1024 (мобильный минимум 22px из правила выше не трогаем,
 * em-резерв высоты у .pksz-top h1 — другое правило — пересчитывается от итогового font-size сам). */
@media (min-width:1024px){.pksz-page .pksz-top h1{font-size:clamp(26px,2.2vw,32px)}}
.pksz-h1-sub{display:block;font-size:14px;font-weight:400;line-height:1.3;letter-spacing:0;color:var(--pk-color-text-muted,#767676);margin-top:4px}
/* GOAL_RENDER95 Ш6 п.2: вьюер как в карточке — тёмный графит, 3:2 (как карточка, фото без обрезки). */
.pksz-visual{aspect-ratio:3/2;min-height:360px;background:#0E1114;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pksz-visual img{max-width:100%;max-height:100%;object-fit:contain}
.pksz-visual img[fetchpriority]{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover} /* фото 3:2 — во весь кадр, как в карточке */
.pksz-page .pk-forge-result strong{font-size:20px;white-space:nowrap;letter-spacing:-.01em}
.pksz-page .pk-forge-block{grid-template-columns:minmax(0,1fr)}.pksz-page .pk-forge-sliders,.pksz-page .pk-forge-field{min-width:0}
/* shortcut: чертёж рисуется pksz_fallback_svg() с тёмно-серыми линиями (#5a5a5a) под светлый
 * фон; вместо перекраски функции (она используется и как светлый фоллбэк внутри тела карточки
 * — не трогаем) просто инвертируем на тёмном вьюере. Апгрейд — отдельная светлая палитра линий
 * параметром pksz_fallback_svg(), если тёмный вариант понадобится где-то ещё. */
.pksz-visual svg,.pksz-visual .pk-draw-wrap{filter:invert(1) brightness(1.8)}
/* ревью 22.10 (размер, п.1): .pksz-visual{display:flex} выше — правило автора — перебивало
 * UA-дефолт [hidden]{display:none} (одинаковая специфичность класс vs атрибут, но автор всегда
 * выигрывает у UA-стиля): оба таба («Чертёж»/«3D») были видны стопкой одновременно несмотря на
 * JS-переключение hidden. Комбинированный селектор класс+атрибут специфичнее plain-класса — рубит
 * скрытую вкладку гарантированно. */
.pksz-visual[hidden]{display:none}
/* S6C п.3: .pksz-viewer — обёртка вкладок+кадра (см. PHP), position:relative только под то, чтобы
 * позиционировать вкладки НАД кадром (bottom-left), как на рендере r9 — скрытые панели [hidden] не
 * занимают места, высота .pksz-viewer = высоте видимой .pksz-visual. */
.pksz-viewer{position:relative}
/* Этап 5: вкладки «Чертёж | 3D» — простые кнопки-переключатели, стиль близок к .pksz-chip. */
.pksz-vtabs{display:flex;gap:6px;margin-bottom:10px}
.pksz-vtab{height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--pk-color-border,#e3e3e3);background:transparent;color:inherit;font-size:13px;cursor:pointer}
.pksz-vtab[aria-selected="true"]{background:var(--pk-color-brand,#B5790F);border-color:var(--pk-color-brand,#B5790F);color:var(--pk-color-text-on-brand,#fff)}
.pksz-vtab:focus-visible{outline:2px solid var(--pk-color-brand,#B5790F);outline-offset:2px}
/* S6C п.3: внутри кадра вьюера — тёмные полупрозрачные пилюли снизу слева, не над фото. */
.pksz-viewer .pksz-vtabs{position:absolute;left:12px;bottom:12px;margin-bottom:0;z-index:2}
.pksz-viewer .pksz-vtab{background:rgba(14,17,20,.55);border-color:rgba(255,255,255,.3);color:#fff;backdrop-filter:blur(2px)}
.pksz-viewer .pksz-vtab[aria-selected="true"]{background:var(--pk-color-brand,#B5790F);border-color:var(--pk-color-brand,#B5790F);color:var(--pk-color-text-on-brand,#fff)}
#pksz-forge-stage{width:100%;height:100%}
/* УИ-аудит В4, повторный заход: .pksz-enh-vis (чертёж Ш3 pk-draw.js + 3D-канвас design/motion.js)
 * внутри складывались друг под другом БЕЗ учёта aspect-ratio родителя — реальная высота контента
 * (SVG ~230px + подписи + отдельный 3D-stage со своим aspect-ratio 4/3) намного превышала
 * фикс. высоту .pksz-visual, overflow:hidden просто обрезал низ картинкой-кашей (серый клин —
 * видимый обрезанный кусок 3D-канваса). На мобиле убираем жёсткий aspect-ratio у самого чертежа
 * (пусть SVG сам определяет высоту по своим пропорциям, с потолком) и прячем 3D-канвас — его
 * и так показывает карточка семейства/отдельный интерактив, тут достаточно чертежа с размерами. */
@media (max-width:767px){
  .pksz-visual{aspect-ratio:auto;height:auto;min-height:0;max-height:260px;padding:8px}
  .pksz-enh-vis,.pksz-fallback-vis{height:auto;max-height:260px}
  .pksz-enh-vis svg,.pksz-fallback-vis svg,.pksz-enh-vis .pk-draw-wrap{width:100%;height:auto;max-height:260px}
}
@media (max-width:599px){
  .pksz-enh-vis .pk-3d-stage{display:none}
}
/* УИ-аудит В4, повторный заход: серый клин оказался НЕ только обрезкой контейнера (выше) —
 * на 1440 (контейнер .pksz-visual там ничем не ограничен, overflow ни при чём) та же заготовка
 * (data-shape=bar, прямоугольный профиль rectPts()) всё равно рисует пустой клин вместо бруска:
 * проверено через canvas.getImageData — закрашено ~12% пикселей. design/motion.js, shape=circle
 * (главная, hero) рисует корректно — профиль там из circlePts(), не rectPts(). Разбирать математику
 * проекции rectPts-профиля в 644-строчном ручном 3D-движке — отдельная задача не по аудиту вёрстки;
 * здесь прячем только сломанные прямоугольные профили на любой ширине, 2D-чертёж с размерами
 * выше уже даёт те же данные. circle/ring/sleeve (circlePts) не трогаем — там рендер исправен. */
.pksz-enh-vis .pk-3d-stage[data-shape="bar"],
.pksz-enh-vis .pk-3d-stage[data-shape="square"],
.pksz-enh-vis .pk-3d-stage[data-shape="strip"]{display:none}
.pksz-price-box{background:var(--pk-color-bg-muted,#f4f4f4);border-radius:12px;padding:20px}
.pksz-price-big{font-size:28px;font-weight:700}
.pksz-price-big small{font-size:14px;font-weight:400;color:var(--pk-color-text-muted,#767676)}
.pksz-price-sub{font-size:13px;color:var(--pk-color-text-muted,#767676);margin:8px 0 16px}
/* ревью 22.10 (размер, раунд 3, п.5): мини-характеристики в самой карточке цены — колонка не
 * пустует даже когда «Характеристики» (большая таблица) далеко внизу под чертежом/3D. */
.pksz-aside-specs{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin:14px 0;padding:14px 0;border-top:1px solid var(--pk-color-border,#e3e3e3);border-bottom:1px solid var(--pk-color-border,#e3e3e3)}
.pksz-aside-specs dt{font-size:12px;color:var(--pk-color-text-muted,#767676);margin:0}
.pksz-aside-specs dd{font-size:14px;font-weight:600;margin:2px 0 0}
.pksz-cta{display:flex;gap:10px;flex-wrap:wrap}
/* Этап 5 (AUDIT_2026-10-22.md §1/§2.5): жёлтая кнопка была вне палитры — здесь --pk-color-brand
   не резолвился (фоллбэк #f5a623 — яркий жёлтый, не ember), фикс — явный ember-фоллбэк. Та же
   пара переменных, что .pk-btn-primary в design/pk-header.css (сайтовый бренд-токен). */
.pksz-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:999px;font-weight:600;border:none;cursor:pointer;background:var(--pk-color-brand,#B5790F);color:var(--pk-color-text-on-brand,#fff);text-decoration:none}
/* Ш10 §5 п.3: иконка в заливной кнопке — белая (currentColor), во вторичной (.secondary) — акцентом (та же схема, что .pk-btn на карточке). */
.pksz-btn .pk-icon{flex:none;color:currentColor}
.pksz-btn:hover,.pksz-btn:focus-visible{background:var(--pk-color-brand-hover,#C98A1C)}
.pksz-btn:focus-visible{outline:2px solid var(--pk-color-brand,#B5790F);outline-offset:2px}
.pksz-btn.secondary{background:transparent;border:1px solid var(--pk-color-border,#ccc);color:inherit}
.pksz-btn.secondary:hover,.pksz-btn.secondary:focus-visible{background:var(--pk-color-bg-badge,#f4f4f4);outline:2px solid var(--pk-color-brand,#B5790F);outline-offset:2px}
.pksz-order-note{font-size:12px;color:var(--pk-color-text-muted,#767676);margin-top:8px}
/* Ш10 (оценка s9 §5 п.2): таблица «Характеристики» (5 строк) растягивалась на всю ширину
 * страницы (~1900px) — правая половина пустая. max-width вместо переноса в 2 колонки (проще,
 * без ломки .pksz-table, которую переиспользуют и другие секции ниже). */
@media (min-width:1024px){.pksz-top-specs table.pksz-table{max-width:720px}}
/* Ш11 РАЗМЕР п.2 (render95 s10 §5 п.2): справа от таблицы (max-width 720) было пусто — вторая
 * .pksz-section (справочник ГОСТ 8479-70 по группе, $gostRefHtml в PHP) встаёт рядом 2 колонками,
 * той же карточной стилистикой, что .pksz-ref-grid ниже. Если $gost нет (блока два не печатаются),
 * .pksz-top-specs просто остаётся с одним ребёнком — без побочных эффектов. */
@media (min-width:1024px){
  .pksz-top-specs{display:grid;grid-template-columns:720px 1fr;gap:16px 24px;align-items:start}
  .pksz-top-specs .pksz-section:not(:first-child){padding:20px;margin:0;border:1px solid var(--pk-color-border,#e3e3e3);border-radius:12px}
  .pksz-top-specs .pksz-section:not(:first-child) h2{font-size:18px}
}
/* GOAL_RENDER95 Ш6 п.5: отступы секций 32px (было 24), H2 22px/800 как в карточке. */
.pksz-section{padding:32px 0;border-bottom:1px solid var(--pk-color-border,#e3e3e3)}
.pksz-section h2{font-size:22px;font-weight:800;letter-spacing:-.01em;margin:0 0 14px}
table.pksz-table{width:100%;border-collapse:collapse;font-size:14px}
table.pksz-table th,table.pksz-table td{text-align:left;padding:8px 12px}
table.pksz-table thead th{color:var(--pk-color-text-muted,#767676);font-weight:600;border-bottom:1px solid var(--pk-color-border,#e3e3e3)}
table.pksz-table tbody tr{border-bottom:1px solid var(--pk-color-border,#e3e3e3)}
/* В9-ревью п.5: только таблица размеров (не характеристики/марки — те остаются как были) — числа
   вправо, разряды не скачут при сравнении строк. */
.pksz-sizetable table.pksz-table th:not(:first-child),.pksz-sizetable table.pksz-table td:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}
/* GOAL_RENDER95 Ш6 п.1: «Соседние размеры» — чипы (а не карточки .pksz-neighbor), активный —
 * янтарная обводка, как .size-chip на рендере. Текущий размер — не ссылка, остальные — ссылки. */
.pksz-size-chips{display:flex;flex-wrap:wrap;gap:8px}
.pksz-size-chip{display:inline-flex;align-items:center;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--pk-color-border,#e3e3e3);background:var(--pk-color-bg,#fff);color:inherit;font-size:13px;text-decoration:none;white-space:nowrap}
a.pksz-size-chip:hover,a.pksz-size-chip:focus-visible{border-color:var(--pk-color-brand,#B5790F);color:var(--pk-color-brand,#B5790F)}
.pksz-size-chip.active{border-color:var(--pk-color-brand,#B5790F);border-width:2px;font-weight:700;color:var(--pk-color-brand,#B5790F);cursor:default}
.pksz-near-title{font-weight:600;font-size:13px;margin:14px 0 8px;color:inherit}
/* Ш11 РАЗМЕР п.1 (render95 s10 §5 п.1): .pksz-top-aside .pksz-price-box уже flex-column
 * (строка 475, только ≥1024, где aside реально stretch-ится по высоте фото) — группа «Соседние
 * размеры/паспорт/заметка» прижимается к низу карточки цены margin-top:auto, пустота под
 * «Мин. заказ» (до ~170px на длинных фото) переезжает выше этой группы, а не висит в конце.
 * На <1024 .pksz-price-box не flex — margin-top:auto там равен обычному 0, без побочных эффектов. */
.pksz-aside-bottom{margin-top:auto}
/* FAQ — аккордеон как в карточке: плюс/минус справа от вопроса, без сторонних иконок. */
.pksz-faq details{border-bottom:1px solid var(--pk-color-border,#e3e3e3);padding:10px 0}
.pksz-faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.pksz-faq summary::-webkit-details-marker{display:none}
.pksz-faq summary::after{content:"+";font-weight:400;font-size:20px;color:var(--pk-color-text-muted,#767676);flex:none}
.pksz-faq details[open] summary::after{content:"\2212"}
.pksz-sizetable{max-height:480px;overflow:auto}
.pksz-sizetable a{color:inherit;text-decoration:none;display:block;padding:6px 0}
.pksz-sizetable tr:hover{background:var(--pk-color-bg-muted,#f4f4f4)}
.pksz-fallback-vis{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.pksz-fallback-vis svg{width:100%;height:100%;max-width:100%;max-height:100%}
.pksz-enh-vis{width:100%;height:100%}
.pksz-enh-vis canvas,.pksz-enh-vis svg{width:100%;height:100%}
.pksz-links-note a,.pksz-back-link a{color:var(--pk-color-accent-text,#8a5a00);text-decoration:underline}
.pksz-links-note a:hover,.pksz-back-link a:hover{color:var(--pk-color-accent,#b5790f)}
.pksz-passport{margin-top:10px}
.pksz-passport a{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--pk-color-accent-text,#8a5a00);text-decoration:none;border:1px solid var(--pk-color-border-strong,#8a969c);border-radius:999px;padding:8px 16px}
/* ревью 22.10 (размер, п.4): под главной кнопкой «Паспорт серии» второй визуальной кнопкой спорил
 * за внимание с «Запросить КП» — теперь обычная текстовая ссылка (та же пара классов, но без
 * пилюли/рамки), только в блоке цены (.pksz-top-aside), не трогает ссылку в др. местах темы. */
.pksz-top-aside .pksz-passport-link a{border:none;padding:0;border-radius:0;display:inline;text-decoration:underline}
.pksz-passport a:hover{color:var(--pk-white,#fff);background:var(--pk-color-accent,#b5790f);border-color:var(--pk-color-accent,#b5790f)}
/* RM Э8 (GOAL_RENDER_MATCH 4.5): блок цены как buy-box карточки товара r9 — белая карточка, цена 800,
 * главная кнопка 52px во всю ширину, радиус 8 (как .single_add_to_cart_button в tpl-product.css). */
.pksz-price-box{background:#fff;border:1px solid #E3E6E9;box-shadow:0 1px 2px rgba(14,17,20,.04);padding:24px}
/* GOAL_RENDER95 Ш6 п.3: главная цена — за штуку, 30px/800, letter-spacing -0.02em; копейки мельче
 * и приглушены (без округления итоговой суммы — §1 правил, pksz_rub() не меняется). Было
 * clamp(28,2.6vw,40)/700 — фиксируем 30px/800 как в карточке. */
.pksz-price-big{font-size:30px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pksz-price-big .kop{font-size:.6em;color:var(--pk-color-text-muted,#767676);font-weight:400;letter-spacing:0}
.pksz-cta .pksz-btn:not(.secondary){flex:1 1 100%;height:52px;border-radius:8px;font-size:16px;font-weight:700}
.pksz-aside-specs dd{font-variant-numeric:tabular-nums}
/* S6B п.1: количество +/- и «В корзину» — только когда есть реальная вариация WC (см. $hasVariation
 * в PHP); форма — полноценный flex-item на свою строку, рядом qty-степпер + кнопка. */
/* r9 (product_1440.png): qty — своя строка компактной ширины, кнопка «В корзину» — во всю ширину
 * строкой ниже, тем же размером, что «Запросить КП» (колонка, не рядом друг с другом). */
.pksz-cta .pksz-addcart{display:flex;flex-direction:column;align-items:flex-start;gap:10px;flex:1 1 100%}
.pksz-cta .pksz-addcart .pksz-btn{height:52px;border-radius:8px;font-size:16px;font-weight:700;align-self:stretch}
.pksz-qty{display:inline-flex;align-items:center;height:46px;border:1px solid var(--pk-color-border,#ccc);border-radius:8px;flex:none}
.pksz-qty-btn{width:36px;height:100%;border:none;background:transparent;color:inherit;font-size:18px;line-height:1;cursor:pointer}
.pksz-qty-btn:hover,.pksz-qty-btn:focus-visible{background:var(--pk-color-bg-badge,#f4f4f4)}
.pksz-qty-input{width:40px;height:100%;border:none;border-left:1px solid var(--pk-color-border,#ccc);border-right:1px solid var(--pk-color-border,#ccc);text-align:center;font-size:15px;font-weight:600;-moz-appearance:textfield;background:transparent;color:inherit}
.pksz-qty-input::-webkit-outer-spin-button,.pksz-qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
@media (max-width:479px){.pksz-cta .pksz-addcart .pksz-qty{align-self:stretch;justify-content:center}}
.pksz-page .pksz-qty .pksz-qty-input{width:48px !important;min-width:0;flex:none;padding:0}@media (min-width:480px){.pksz-cta .pksz-addcart .pksz-qty{align-self:flex-start}}.pksz-page .pk-size-picker-head{padding-left:0;padding-right:0}
/* Ш9: кнопки формы покупки — 52 px во всю ширину и вне .pksz-cta; «В корзину» вторичная с рамкой акцентом */
.pksz-page .pksz-addcart .pksz-btn{height:52px;min-height:52px;align-self:stretch;border-radius:8px;font-size:16px;font-weight:700}
.pksz-page .pksz-addcart .pksz-btn.secondary{border:1.5px solid var(--pk-color-accent,#96630C);color:var(--pk-color-accent,#96630C);background:#fff}
/* S9 (было S6B п.2): «Подберите размер» переехал под фото в левую колонку (.pksz-top-picker,
 * см. PHP) — тот же компонент (design/tpl-product.* темы, не трогаем), здесь только
 * скоп-переопределение отступов под новое место. */
.pksz-top-picker .pk-size-picker-head{margin:16px 0 8px !important}
.pksz-top-picker .pk-forge-sliders{gap:8px !important}
.pksz-top-picker .pk-forge-field{margin:0 !important}
.pksz-top-picker .pk-forge-result{margin-top:8px !important;padding-top:8px !important;gap:8px !important}
/* S6B п.3: справочные секции (ГОСТ/Марка/Припуск) — карточки 2×N на ≥1024, а не лента H2 24/700.
 * .pksz-page .pksz-section h2 — специфичнее сетевого h2, иначе каскад next.css побеждает (как у
 * .pksz-top h1 выше) и реальный размер на живом оказывается крупнее заданных здесь 22px. */
.pksz-page .pksz-section h2{font-size:22px;font-weight:800;letter-spacing:-.01em;margin:0 0 14px}
.pksz-ref-grid .pksz-section{padding:20px}
.pksz-ref-grid .pksz-section h2{font-size:18px;margin-bottom:10px}
@media (min-width:1024px){
  .pksz-ref-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;align-items:start}
  .pksz-ref-grid .pksz-section{margin:0;border:1px solid var(--pk-color-border,#e3e3e3);border-radius:12px}
}
/* S6C п.4: три справочные карточки (Группа/Марка/Припуск) в ряд на ≥1200 — как на рендере r9
 * (на ≥1024,<1200 остаются 2 колонки выше, места на 3 узких карточки мало). */
@media (min-width:1200px){
  .pksz-ref-grid{grid-template-columns:repeat(3,1fr)}
}
/* S9 (было GOAL_RENDER95 Ш6 п.4): «Подберите размер» — тот же компонент, что карточка
 * (design/tpl-product.css/.js), переиспользован без изменений файлов темы; сцену здесь
 * скрываем (карточка уже показывает 3D во вкладке вьюера выше — см. .pksz-top-picker
 * .pk-forge-wrap ниже), числа/ползунки продолжают работать от того же JS. Заголовок — 16px/700
 * с иконкой, как на карточке (.pk-size-picker-label, приёмка п.3). */
.pksz-top-picker .pk-size-picker-head{margin:16px 0 8px}
/* Ш10 CLS: на ≤599 заголовок в 2 строки дорастает 50 → 62 px после шрифта (CLS 0,083) — резерв высоты. */
@media (max-width:599px){.pksz-top-picker .pk-size-picker-head{min-height:62px}}
html:not(.pksz-picker-ready) .pksz-top-picker{visibility:hidden;animation:pksz-picker-show 0s 1.2s forwards}
@keyframes pksz-picker-show{to{visibility:visible}}
.pksz-top-picker .pk-size-picker-label{display:flex;align-items:center;gap:6px;font-size:16px;font-weight:700;color:inherit}
.pksz-top-picker .pk-size-picker-label .pk-icon{color:var(--pk-color-brand,#B5790F)}
.pksz-top-picker .pk-forge-block{grid-template-columns:1fr !important}
/* shortcut: initSizeSliders() (tpl-product.js) требует #pk-forge-stage в DOM, иначе выходит
 * сразу и ползунки/пересчёт цены не работают вовсе (строгая проверка в начале функции) — элемент
 * оставлен, просто скрыт, чтобы не дублировать уже показанную выше 3D-вкладку вьюера. Модуль
 * pk-forge.js (three.js) при этом всё равно подгружается один раз в фоне — минус оптимизация
 * (на карточке товара она оправдана, там это и есть единственная 3D-сцена). Апгрейд — отдельный
 * облегчённый вход в initSizeSliders() без монтирования сцены, если лишняя загрузка станет
 * заметна в метриках (сейчас — не критично, модуль маленький и лениво импортируется). */
.pksz-top-picker .pk-forge-block>.pk-forge-wrap{display:none}
