/*
 * atoms.css — атомы кита «Инссмарт · b2c». Каркас — MUI: блок = компонент MUI, модификаторы = его
 * пропсы (variant / color / size). Значения — только переменные tokens.css (имена MUI CSS-переменных).
 * Состояния — настоящими псевдоклассами и зеркальными классами витрины:
 * .is-hover = :hover, .is-focus = :focus-visible, .is-active = :active, [disabled] = отключено.
 * Таблица «класс → компонент MUI + пропсы» — foundations/mui-map.md.
 */

*, *::before, *::after { box-sizing: border-box; }

/* ═══ Typography (variant) ═══ */
.typo-h1 { font: var(--mui-font-h1); letter-spacing: var(--kit-ls-h1); margin: 0; }
.typo-h2 { font: var(--mui-font-h2); letter-spacing: var(--kit-ls-h2); margin: 0; }
.typo-h3 { font: var(--mui-font-h3); letter-spacing: var(--kit-ls-h3); margin: 0; }
.typo-h4 { font: var(--mui-font-h4); letter-spacing: var(--kit-ls-h4); margin: 0; }
.typo-h5 { font: var(--mui-font-h5); margin: 0; }
.typo-h6 { font: var(--mui-font-h6); margin: 0; }
.typo-subtitle1 { font: var(--mui-font-subtitle1); margin: 0; }
.typo-subtitle2 { font: var(--mui-font-subtitle2); margin: 0; }
.typo-body1 { font: var(--mui-font-body1); margin: 0; }
.typo-body2 { font: var(--mui-font-body2); margin: 0; }
.typo-caption { font: var(--mui-font-caption); margin: 0; }
.typo-overline { font: var(--mui-font-overline); letter-spacing: var(--kit-ls-overline); text-transform: uppercase; margin: 0; }
.typo-button { font: var(--mui-font-button); margin: 0; }
.typo--secondary { color: var(--mui-palette-text-secondary); }
.typo--disabled { color: var(--mui-palette-text-disabled); }
.typo--on-dark { color: var(--mui-palette-common-white); }
.typo--on-dark-secondary { color: var(--mui-palette-common-onDarkSecondary); }
.typo--secondary-main { color: var(--mui-palette-secondary-main); }
.typo--secondary-dark { color: var(--mui-palette-secondary-dark); }
.typo--info-dark { color: var(--mui-palette-info-dark); }
.typo--success { color: var(--mui-palette-success-main); }

/* ═══ Icon (SvgIcon, fontSize = свои ступени) ═══ */
.icon { width: var(--kit-icon-md); height: var(--kit-icon-md); flex: none; display: inline-block; vertical-align: middle;
  background-color: currentColor; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
.icon--sm { width: var(--kit-icon-sm); height: var(--kit-icon-sm); }
.icon--lg { width: var(--kit-icon-lg); height: var(--kit-icon-lg); }
.i-pack-briefcase-business { --i: url(assets/icons/pack-briefcase-business.svg); }
.i-pack-building-complex { --i: url(assets/icons/pack-building-complex.svg); }
.i-pack-car { --i: url(assets/icons/pack-car.svg); }
.i-pack-check { --i: url(assets/icons/pack-check.svg); }
.i-pack-file-text { --i: url(assets/icons/pack-file-text.svg); }
.i-pack-heart { --i: url(assets/icons/pack-heart.svg); }
.i-pack-settings-2 { --i: url(assets/icons/pack-settings-2.svg); }
.i-pack-shield-check { --i: url(assets/icons/pack-shield-check.svg); }
.i-pack-sparkle { --i: url(assets/icons/pack-sparkle.svg); }
.i-pack-star { --i: url(assets/icons/pack-star.svg); }
.i-pack-user-group { --i: url(assets/icons/pack-user-group.svg); }
.i-pack-wallet { --i: url(assets/icons/pack-wallet.svg); }
.i-car { --i: url(assets/icons/car.svg); } .i-rouble-return { --i: url(assets/icons/rouble-return.svg); }
.i-heart { --i: url(assets/icons/heart.svg); } .i-heart-pulse { --i: url(assets/icons/heart-pulse.svg); }
.i-wallet { --i: url(assets/icons/wallet.svg); } .i-search { --i: url(assets/icons/search.svg); }
.i-sparkle { --i: url(assets/icons/sparkle.svg); } .i-check { --i: url(assets/icons/check.svg); }
.i-sliders { --i: url(assets/icons/sliders.svg); } .i-file-text { --i: url(assets/icons/file-text.svg); }
.i-file-percent { --i: url(assets/icons/file-percent.svg); } .i-home { --i: url(assets/icons/home.svg); }
.i-briefcase { --i: url(assets/icons/briefcase.svg); } .i-grid { --i: url(assets/icons/grid.svg); }
.i-star { --i: url(assets/icons/star.svg); } .i-shield-star { --i: url(assets/icons/shield-star.svg); }
.i-shield-check { --i: url(assets/icons/shield-check.svg); } .i-users { --i: url(assets/icons/users.svg); }
.i-arrow-right { --i: url(assets/icons/arrow-right.svg); } .i-chevron-right { --i: url(assets/icons/chevron-right.svg); }
.i-chevron-down { --i: url(assets/icons/chevron-down.svg); } .i-caret-down { --i: url(assets/icons/caret-down.svg); }
.i-plus { --i: url(assets/icons/plus.svg); } .i-minus { --i: url(assets/icons/minus.svg); } .i-menu { --i: url(assets/icons/menu.svg); }
.i-bolt { --i: url(assets/icons/bolt.svg); } .i-close { --i: url(assets/icons/close.svg); }
.i-info { --i: url(assets/icons/info.svg); } .i-alert { --i: url(assets/icons/alert.svg); }
.i-check-circle { --i: url(assets/icons/check-circle.svg); } .i-badge-check { --i: url(assets/icons/badge-check.svg); }
.i-globe { --i: url(assets/icons/globe.svg); } .i-baby { --i: url(assets/icons/baby.svg); }
.i-plane { --i: url(assets/icons/plane.svg); } .i-bell { --i: url(assets/icons/bell.svg); }
.i-headset { --i: url(assets/icons/headset.svg); } .i-phone { --i: url(assets/icons/phone.svg); }
.i-smartphone { --i: url(assets/icons/smartphone.svg); }
/* Вариант Accordion с SVG из Lucide вместо нарисованных линий. */
.accordion__sign--lucide { --_icon: url(assets/icons/plus.svg); background: currentColor; mask: var(--_icon) center / contain no-repeat; }
.accordion__head[aria-expanded="true"] .accordion__sign--lucide { --_icon: url(assets/icons/minus.svg); }
.accordion__sign--lucide::before, .accordion__sign--lucide::after { display: none; }

/* ═══ Button: variant contained (по умолчанию) / outlined / text; color primary / secondary / info / success / white; size small / medium / large ═══ */
.button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--kit-sp-2);
  height: var(--kit-size-medium); padding: 0 var(--kit-sp-5); border: var(--kit-bw-strong) solid transparent; border-radius: var(--mui-shape-borderRadius);
  background: var(--mui-palette-primary-main); color: var(--mui-palette-primary-contrastText); font: var(--mui-font-button); text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background-color var(--kit-duration-shortest) var(--kit-easing-easeInOut), box-shadow var(--kit-duration-shortest), transform var(--kit-duration-shortest); }
.button:hover, .button.is-hover { background: var(--mui-palette-primary-dark); }
.button--secondary { background: var(--mui-palette-secondary-main); color: var(--mui-palette-secondary-contrastText); }
.button--secondary:hover, .button--secondary.is-hover { background: var(--mui-palette-secondary-dark); }
.button--info { background: var(--mui-palette-info-main); color: var(--mui-palette-info-contrastText); }
.button--info:hover, .button--info.is-hover { background: var(--mui-palette-info-dark); }
.button--success { background: var(--mui-palette-success-main); color: var(--mui-palette-success-contrastText); }
.button--success:hover, .button--success.is-hover { background: var(--mui-palette-success-dark); }
.button--white { background: var(--mui-palette-white-main); color: var(--mui-palette-white-contrastText); }
.button--white:hover, .button--white.is-hover { background: var(--mui-palette-white-dark); }
.button:focus-visible, .button.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.button:active, .button.is-active { transform: scale(var(--kit-press-scale)); }
/* outlined: текст — оттенок цвета (ink), рамка — main, наведение — lighter */
.button--outlined { background: transparent; color: var(--mui-palette-primary-main); border-color: var(--mui-palette-primary-main); }
.button--outlined:hover, .button--outlined.is-hover { background: var(--mui-palette-primary-lighter); }
.button--outlined.button--secondary { color: var(--mui-palette-secondary-dark); border-color: var(--mui-palette-secondary-main); }
.button--outlined.button--secondary:hover, .button--outlined.button--secondary.is-hover { background: var(--mui-palette-secondary-lighter); }
.button--outlined.button--info { color: var(--mui-palette-info-dark); border-color: var(--mui-palette-info-main); }
.button--outlined.button--info:hover, .button--outlined.button--info.is-hover { background: var(--mui-palette-info-lighter); }
.button--outlined.button--success { color: var(--mui-palette-success-main); border-color: var(--mui-palette-success-main); }
.button--outlined.button--success:hover, .button--outlined.button--success.is-hover { background: var(--mui-palette-success-lighter); }
.button--outlined.button--white { color: var(--mui-palette-white-main); border-color: var(--mui-palette-white-main); }
.button--outlined.button--white:hover, .button--outlined.button--white.is-hover { background: var(--mui-palette-common-onDarkDivider); }
/* text: текст — ink, наведение — action.hover */
.button--text { background: transparent; color: var(--mui-palette-primary-main); padding: 0 var(--kit-sp-3); }
.button--text:hover, .button--text.is-hover { background: var(--mui-palette-action-hover); }
.button--text.button--secondary { color: var(--mui-palette-secondary-dark); }
.button--text.button--info { color: var(--mui-palette-info-dark); }
.button--text.button--success { color: var(--mui-palette-success-main); }
.button--text.button--white { color: var(--mui-palette-white-main); }
.button:disabled, .button:disabled:hover, .button[aria-disabled="true"] { background: var(--mui-palette-action-disabledBackground); color: var(--mui-palette-action-disabled); border-color: transparent; cursor: not-allowed; transform: none; }
.button--text:disabled, .button--text:disabled:hover { background: transparent; }
.button .icon { width: var(--kit-icon-sm); height: var(--kit-icon-sm); transition: transform var(--kit-duration-shorter) var(--kit-easing-easeInOut); }
.button:hover .button__end-icon, .button.is-hover .button__end-icon { transform: translateX(var(--kit-shift-hover)); }
.button--small { height: var(--kit-size-small); padding: 0 var(--kit-sp-4); font-size: var(--kit-fs-dense); border-radius: var(--mui-shape-radiusSm); }
.button--large { height: var(--kit-size-large); padding: 0 var(--kit-sp-6); }
.button--full-width { display: flex; width: 100%; }
/* загрузка: текст прозрачный, спиннер цвета текста варианта */
.button[aria-busy="true"], .button.button[aria-busy="true"] { color: transparent; pointer-events: none; }
.button[aria-busy="true"]::after { content: ""; position: absolute; inset: 0; margin: auto; width: var(--kit-size-check); height: var(--kit-size-check); border-radius: var(--mui-shape-radiusPill);
  border: var(--kit-bw-2) solid var(--mui-palette-primary-contrastText); border-right-color: transparent; animation: kit-spin var(--kit-duration-spin) linear infinite; }
.button--secondary[aria-busy="true"]::after { border-color: var(--mui-palette-secondary-contrastText); border-right-color: transparent; }
.button--info[aria-busy="true"]::after { border-color: var(--mui-palette-info-contrastText); border-right-color: transparent; }
.button--success[aria-busy="true"]::after { border-color: var(--mui-palette-success-contrastText); border-right-color: transparent; }
.button--white[aria-busy="true"]::after { border-color: var(--mui-palette-white-contrastText); border-right-color: transparent; }
.button--outlined[aria-busy="true"]::after, .button--text[aria-busy="true"]::after { border-color: var(--mui-palette-primary-main); border-right-color: transparent; }
.button--outlined.button--secondary[aria-busy="true"]::after, .button--text.button--secondary[aria-busy="true"]::after { border-color: var(--mui-palette-secondary-dark); border-right-color: transparent; }
.button--outlined.button--info[aria-busy="true"]::after, .button--text.button--info[aria-busy="true"]::after { border-color: var(--mui-palette-info-dark); border-right-color: transparent; }
.button--outlined.button--success[aria-busy="true"]::after, .button--text.button--success[aria-busy="true"]::after { border-color: var(--mui-palette-success-main); border-right-color: transparent; }
.button--outlined.button--white[aria-busy="true"]::after, .button--text.button--white[aria-busy="true"]::after { border-color: var(--mui-palette-white-main); border-right-color: transparent; }
@keyframes kit-spin { to { transform: rotate(360deg); } }

/* ═══ IconButton: standard (по умолчанию) / contained / soft — свои variants в theme; shape circular / rounded; size small / medium ═══ */
.icon-button { display: inline-grid; place-items: center; width: var(--kit-size-medium); height: var(--kit-size-medium); padding: 0; border: 0; border-radius: var(--mui-shape-radiusPill);
  background: transparent; color: var(--mui-palette-text-primary); cursor: pointer;
  transition: background-color var(--kit-duration-shortest), filter var(--kit-duration-shortest), box-shadow var(--kit-duration-shortest), transform var(--kit-duration-shortest); }
.icon-button:hover, .icon-button.is-hover { background: var(--mui-palette-action-hover); }
.icon-button:focus-visible, .icon-button.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.icon-button:active, .icon-button.is-active { transform: scale(var(--kit-press-scale-s)); }
.icon-button:disabled { color: var(--mui-palette-action-disabled); cursor: not-allowed; }
/* contained: подложка — main цвета, иконка — contrastText; наведение — темнее фильтром */
.icon-button--contained, .icon-button--contained:hover, .icon-button--contained.is-hover { background: var(--mui-palette-primary-main); color: var(--mui-palette-primary-contrastText); }
.icon-button--contained.icon-button--success, .icon-button--contained.icon-button--success:hover, .icon-button--contained.icon-button--success.is-hover { background: var(--mui-palette-success-main); color: var(--mui-palette-success-contrastText); }
.icon-button--contained.icon-button--secondary, .icon-button--contained.icon-button--secondary:hover, .icon-button--contained.icon-button--secondary.is-hover { background: var(--mui-palette-secondary-main); color: var(--mui-palette-secondary-contrastText); }
.icon-button--contained.icon-button--neutral, .icon-button--contained.icon-button--neutral:hover, .icon-button--contained.icon-button--neutral.is-hover { background: var(--mui-palette-neutral-main); color: var(--mui-palette-neutral-contrastText); }
.icon-button--contained:hover, .icon-button--contained.is-hover { filter: brightness(0.92); box-shadow: var(--mui-shadows-1); }
.icon-button--contained:disabled, .icon-button--contained:disabled:hover { background: var(--mui-palette-action-disabledBackground); color: var(--mui-palette-action-disabled); filter: none; box-shadow: none; }
.icon-button--neutral:disabled, .icon-button--neutral:disabled:hover { background: transparent; color: var(--mui-palette-common-onDarkSecondary); box-shadow: inset 0 0 0 var(--kit-bw) var(--mui-palette-common-onDarkDivider); }
.icon-button--soft { background: var(--mui-palette-grey-100); }
.icon-button--soft:hover, .icon-button--soft.is-hover { background: var(--mui-palette-divider); }
.icon-button--soft:disabled { background: var(--mui-palette-grey-50); }
.icon-button--rounded { border-radius: var(--mui-shape-borderRadius); }
.icon-button--small { width: var(--kit-box-xs); height: var(--kit-box-xs); }
.icon-button--small .icon { width: var(--kit-icon-xs); height: var(--kit-icon-xs); }

/* ═══ Link: color primary (по умолчанию) / info / secondary / inherit; underline hover (по умолчанию) / always / none ═══ */
.link { color: var(--mui-palette-text-primary); font: var(--mui-font-subtitle2); font-size: var(--kit-fs-dense); text-decoration: none;
  display: inline-flex; align-items: center; gap: var(--kit-sp-1); border-radius: var(--mui-shape-radiusXs); transition: color var(--kit-duration-shortest); }
.link:hover, .link.is-hover { text-decoration: underline; text-underline-offset: var(--kit-shift-hover); }
.link:focus-visible, .link.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.link:active, .link.is-active { opacity: 0.7; }
.link[aria-disabled="true"] { color: var(--mui-palette-text-disabled); pointer-events: none; }
.link .icon { width: var(--kit-icon-xs); height: var(--kit-icon-xs); transition: transform var(--kit-duration-shorter) var(--kit-easing-easeInOut); }
.link:hover .icon, .link.is-hover .icon { transform: translateX(var(--kit-shift-hover)); }
.link--info { color: var(--mui-palette-info-main); }
.link--secondary { color: var(--mui-palette-secondary-main); }
.link--inherit { color: inherit; }
.link--nav { font: var(--mui-font-body1); font-weight: var(--kit-fw-medium); font-size: var(--kit-fs-control); }
.link--nav .icon { width: var(--kit-icon-sm); height: var(--kit-icon-sm); margin-left: calc(-1 * var(--kit-sp-1)); }
.link--nav:hover .icon, .link--nav.is-hover .icon { transform: none; }
.link--nav:hover, .link--nav.is-hover { text-decoration: none; color: var(--mui-palette-text-secondary); }
.link--list { font: var(--mui-font-body2); font-size: var(--kit-fs-list); }
.link--list::before { content: "›"; color: var(--mui-palette-text-disabled); margin-right: var(--kit-sp-1); }
.link--body { font: var(--mui-font-body2); }
.link--footer { font: var(--mui-font-body2); font-size: var(--kit-fs-list); color: var(--mui-palette-common-white); }
.link--footer.link--muted { color: var(--mui-palette-common-onDarkSecondary); }
.link--underline-always { display: inline; font: inherit; color: var(--mui-palette-info-main); text-decoration: underline; text-underline-offset: var(--kit-bw-2); }
.link--underline-always:visited, .link--underline-always.is-visited { color: var(--mui-palette-info-dark); }

/* ═══ TextField: variant outlined (по умолчанию) / filled / standard; size small / medium ═══ */
.form-control { display: grid; gap: var(--kit-sp-1); min-width: 0; font: var(--mui-font-body1); }
.form-control__label { font: var(--mui-font-subtitle2); font-size: var(--kit-fs-dense); color: var(--mui-palette-text-primary); }
.form-control__hint { font: var(--mui-font-caption); color: var(--mui-palette-text-secondary); }
.form-control__error { display: none; align-items: center; gap: var(--kit-sp-1); font: var(--mui-font-caption); color: var(--mui-palette-error-main); }
.form-control__error .icon { width: var(--kit-icon-xs); height: var(--kit-icon-xs); }
.input { display: flex; align-items: center; gap: var(--kit-sp-2); min-height: var(--kit-size-medium); padding: 0 var(--kit-sp-4);
  background: var(--mui-palette-background-paper); border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-borderRadius);
  color: var(--mui-palette-text-primary); transition: border-color var(--kit-duration-shortest), box-shadow var(--kit-duration-shortest), background-color var(--kit-duration-shortest); }
.input > .icon { color: var(--mui-palette-text-disabled); }
.input__control { flex: 1; min-width: 0; height: calc(var(--kit-size-medium) - 2 * var(--kit-bw)); border: 0; padding: 0; background: transparent; color: var(--mui-palette-text-primary);
  font: var(--mui-font-body1); font-size: var(--kit-fs-control); outline: none; }
.input__control::placeholder { color: var(--mui-palette-text-disabled); }
.input__adornment { font: var(--mui-font-caption); color: var(--mui-palette-text-disabled); white-space: nowrap; }
.input:hover, .input.is-hover { border-color: var(--mui-palette-text-disabled); }
.input:focus-within, .input.is-focus { border-color: var(--mui-palette-primary-main); box-shadow: var(--kit-focus-ring); }
.form-control.is-error .input, .input:has(.input__control[aria-invalid="true"]) { border-color: var(--mui-palette-error-main); }
.form-control.is-error .form-control__error, .form-control:has(.input__control[aria-invalid="true"]) .form-control__error { display: flex; }
.input:has(.input__control:read-only:not(:disabled)) { background: var(--mui-palette-grey-50); border-style: dashed; }
.input:has(.input__control:disabled) { background: var(--mui-palette-action-disabledBackground); border-color: var(--mui-palette-action-disabledBackground); color: var(--mui-palette-text-disabled); cursor: not-allowed; }
.input--small { min-height: var(--kit-size-small); }
.input--small .input__control { height: calc(var(--kit-size-small) - 2 * var(--kit-bw)); }
/* filled / standard — достроено по MUI */
.input--filled { background: var(--mui-palette-grey-100); border-color: transparent; border-bottom-color: var(--mui-palette-text-disabled); border-radius: var(--mui-shape-borderRadius) var(--mui-shape-borderRadius) 0 0; }
.input--filled:hover, .input--filled.is-hover { background: var(--mui-palette-divider); border-color: transparent; border-bottom-color: var(--mui-palette-text-primary); }
.input--filled:focus-within, .input--filled.is-focus { box-shadow: inset 0 calc(-1 * var(--kit-bw-2)) 0 var(--mui-palette-primary-main); border-color: transparent; }
.input--standard { background: transparent; border-color: transparent; border-bottom-color: var(--mui-palette-text-disabled); border-radius: 0; padding: 0; }
.input--standard:hover, .input--standard.is-hover { border-color: transparent; border-bottom-color: var(--mui-palette-text-primary); }
.input--standard:focus-within, .input--standard.is-focus { box-shadow: inset 0 calc(-1 * var(--kit-bw-2)) 0 var(--mui-palette-primary-main); border-color: transparent; }
.input--amount .input__control { font-weight: var(--kit-fw-semibold); font-variant-numeric: tabular-nums; }
/* с кнопкой внутри (endAdornment): кнопка отстоит от рамки одинаково со всех сторон */
.input--with-action { min-height: 0; padding: var(--kit-inset-action) var(--kit-inset-action) var(--kit-inset-action) var(--kit-sp-5); border-radius: var(--mui-shape-radiusField); }
.input--hero { border: var(--kit-bw-strong) solid var(--mui-palette-primary-main); box-shadow: var(--mui-shadows-4); padding: var(--kit-inset-hero) var(--kit-inset-hero) var(--kit-inset-hero) var(--kit-sp-5); }
.input--hero .input__control { font: var(--mui-font-body1); }
.input--on-dark { border-color: transparent; }
@media (max-width: 599.98px) {
  .input--stack, .input--hero.input--stack { flex-direction: column; align-items: stretch; gap: var(--kit-sp-2); padding: var(--kit-inset-hero); }
  .input--stack .input__control { padding: 0 var(--kit-sp-1); }
  .input--stack .button { width: 100%; }
}

/* ═══ TextField multiline ═══ */
.textarea { width: 100%; min-height: var(--kit-h-textarea-min); max-height: var(--kit-h-textarea-max); resize: none; padding: var(--kit-sp-3) var(--kit-sp-4);
  border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-borderRadius); background: var(--mui-palette-background-paper); color: var(--mui-palette-text-primary);
  font: var(--mui-font-body1); font-size: var(--kit-fs-control); outline: none; transition: border-color var(--kit-duration-shortest), box-shadow var(--kit-duration-shortest); }
.textarea::placeholder { color: var(--mui-palette-text-disabled); }
.textarea:hover, .textarea.is-hover { border-color: var(--mui-palette-text-disabled); }
.textarea:focus-visible, .textarea:focus, .textarea.is-focus { border-color: var(--mui-palette-primary-main); box-shadow: var(--kit-focus-ring); }
.textarea:disabled { background: var(--mui-palette-action-disabledBackground); border-color: var(--mui-palette-action-disabledBackground); color: var(--mui-palette-text-disabled); }
.textarea[aria-invalid="true"] { border-color: var(--mui-palette-error-main); }
.form-control__counter { justify-self: end; font: var(--mui-font-caption); color: var(--mui-palette-text-disabled); font-variant-numeric: tabular-nums; }
.form-control__counter.is-over { color: var(--mui-palette-error-main); }

/* ═══ Select (+ Menu / MenuItem) ═══ */
.select { position: relative; display: inline-block; min-width: var(--kit-w-select); }
.select__trigger { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: var(--kit-sp-2); height: var(--kit-size-medium);
  padding: 0 var(--kit-sp-3) 0 var(--kit-sp-4); border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-borderRadius); background: var(--mui-palette-background-paper);
  color: var(--mui-palette-text-primary); font: var(--mui-font-body1); font-size: var(--kit-fs-control); cursor: pointer; transition: border-color var(--kit-duration-shortest), box-shadow var(--kit-duration-shortest); }
.select__trigger [data-placeholder] { color: var(--mui-palette-text-disabled); }
.select__trigger .icon { width: var(--kit-icon-sm); height: var(--kit-icon-sm); color: var(--mui-palette-text-secondary); transition: transform var(--kit-duration-shorter) var(--kit-easing-easeInOut); }
.select__trigger[aria-expanded="true"] .icon { transform: rotate(180deg); }
.select__trigger:hover, .select__trigger.is-hover { border-color: var(--mui-palette-text-disabled); }
.select__trigger:focus-visible, .select__trigger.is-focus, .select__trigger[aria-expanded="true"] { outline: none; border-color: var(--mui-palette-primary-main); box-shadow: var(--kit-focus-ring); }
.select__trigger[aria-invalid="true"] { border-color: var(--mui-palette-error-main); }
.select__trigger:disabled { background: var(--mui-palette-action-disabledBackground); color: var(--mui-palette-text-disabled); border-color: var(--mui-palette-action-disabledBackground); cursor: not-allowed; }
.select__panel { position: absolute; z-index: var(--mui-zIndex-modal); left: 0; right: 0; top: calc(100% + var(--kit-sp-1)); margin: 0; padding: var(--kit-sp-1);
  list-style: none; background: var(--mui-palette-background-paper); border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-borderRadius); box-shadow: var(--mui-shadows-24); }
.select__panel[hidden] { display: none; }
.select__option { display: flex; align-items: center; justify-content: space-between; padding: var(--kit-sp-2) var(--kit-sp-3); border-radius: var(--mui-shape-radiusXs);
  font: var(--mui-font-body2); color: var(--mui-palette-text-primary); cursor: pointer; outline: none; }
.select__option:hover, .select__option:focus, .select__option.is-hover { background: var(--mui-palette-action-hover); }
.select__option[aria-selected="true"] { font-weight: var(--kit-fw-semibold); background: var(--mui-palette-action-selected); }
.select__option[aria-selected="true"]::after { content: ""; width: var(--kit-icon-sm); height: var(--kit-icon-sm); background: var(--mui-palette-text-primary);
  -webkit-mask: url(assets/icons/check.svg) center / contain no-repeat; mask: url(assets/icons/check.svg) center / contain no-repeat; }
.select--static .select__panel { position: static; margin-top: var(--kit-sp-1); }

/* ═══ Checkbox / Radio / Switch + FormControlLabel ═══ */
.form-control-label { display: inline-flex; align-items: center; gap: var(--kit-sp-2); font: var(--mui-font-body1); font-size: var(--kit-fs-control); color: var(--mui-palette-text-primary); cursor: pointer; }
.form-control-label:has(input:disabled) { color: var(--mui-palette-text-disabled); cursor: not-allowed; }
.checkbox, .radio { appearance: none; -webkit-appearance: none; margin: 0; flex: none; width: var(--kit-size-check); height: var(--kit-size-check); display: inline-grid; place-items: center;
  border: var(--kit-bw-strong) solid var(--mui-palette-text-disabled); background: var(--mui-palette-background-paper); cursor: pointer;
  transition: background-color var(--kit-duration-shortest), border-color var(--kit-duration-shortest), box-shadow var(--kit-duration-shortest); }
.checkbox { border-radius: var(--mui-shape-radiusCheckbox); }
.radio { border-radius: var(--mui-shape-radiusPill); }
.checkbox--small, .radio--small { width: var(--kit-icon-sm); height: var(--kit-icon-sm); }
.checkbox::before { content: ""; width: var(--kit-icon-2xs); height: var(--kit-icon-2xs); background: var(--mui-palette-primary-contrastText); transform: scale(0); transition: transform var(--kit-duration-shortest) var(--kit-easing-easeOut);
  -webkit-mask: url(assets/icons/check.svg) center / contain no-repeat; mask: url(assets/icons/check.svg) center / contain no-repeat; }
.checkbox:checked, .checkbox:indeterminate { background: var(--mui-palette-primary-main); border-color: var(--mui-palette-primary-main); }
.checkbox:checked::before { transform: scale(1); }
.checkbox:indeterminate::before { transform: scale(1); -webkit-mask-image: url(assets/icons/minus.svg); mask-image: url(assets/icons/minus.svg); }
.radio::before { content: ""; width: var(--kit-size-dot); height: var(--kit-size-dot); border-radius: var(--mui-shape-radiusPill); background: var(--mui-palette-primary-contrastText); transform: scale(0); transition: transform var(--kit-duration-shortest) var(--kit-easing-easeOut); }
.radio:checked { background: var(--mui-palette-primary-main); border-color: var(--mui-palette-primary-main); }
.radio:checked::before { transform: scale(1); }
.checkbox:hover, .radio:hover, .checkbox.is-hover, .radio.is-hover { border-color: var(--mui-palette-primary-main); box-shadow: 0 0 0 var(--kit-halo-hover) var(--mui-palette-action-hover); }
.checkbox:focus-visible, .radio:focus-visible, .checkbox.is-focus, .radio.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.checkbox:active, .radio:active, .checkbox.is-active, .radio.is-active { box-shadow: 0 0 0 var(--kit-halo-press) var(--mui-palette-action-selected); }
.checkbox:disabled, .radio:disabled { border-color: var(--mui-palette-divider); background: var(--mui-palette-action-disabledBackground); cursor: not-allowed; box-shadow: none; }
.checkbox:disabled:checked, .radio:disabled:checked { background: var(--mui-palette-divider); }
.form-control-label--row { display: flex; width: 100%; min-height: var(--kit-size-medium); padding: 0 var(--kit-sp-4); background: var(--mui-palette-grey-50);
  border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-radiusSm); transition: border-color var(--kit-duration-shortest); }
.form-control-label--row:has(input:checked) { border-color: var(--mui-palette-primary-main); }
.form-control-label--row:hover, .form-control-label--row.is-hover { border-color: var(--mui-palette-text-disabled); }
.form-control-label__end { margin-left: auto; font: var(--mui-font-caption); color: var(--mui-palette-text-secondary); }

.switch { appearance: none; -webkit-appearance: none; margin: 0; flex: none; position: relative; width: var(--kit-switch-w); height: var(--kit-switch-h); border-radius: var(--mui-shape-radiusPill);
  background: var(--mui-palette-divider); cursor: pointer; transition: background-color var(--kit-duration-shorter) var(--kit-easing-easeInOut), box-shadow var(--kit-duration-shortest); }
.switch::before { content: ""; position: absolute; top: var(--kit-switch-pad); left: var(--kit-switch-pad); width: var(--kit-switch-knob); height: var(--kit-switch-knob); border-radius: var(--mui-shape-radiusPill);
  background: var(--mui-palette-background-paper); box-shadow: var(--mui-shadows-1); transition: transform var(--kit-duration-shorter) var(--kit-easing-easeInOut), width var(--kit-duration-shorter); }
.switch:checked { background: var(--mui-palette-success-main); }
.switch:checked::before { transform: translateX(calc(var(--kit-switch-w) - var(--kit-switch-knob) - 2 * var(--kit-switch-pad))); }
.switch:hover, .switch.is-hover { filter: brightness(0.95); }
.switch:focus-visible, .switch.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.switch:active::before, .switch.is-active::before { width: calc(var(--kit-switch-knob) + var(--kit-halo-hover)); }
.switch:disabled { opacity: 0.45; cursor: not-allowed; }

/* ═══ Chip: variant filled (по умолчанию) / outlined / soft (свой); color default / primary / info / secondary / success / warning / error / white / neutral; size small / medium ═══ */
/* интерактивный чип — button или a (:not(span)); span.chip — метка без действия (Chip без onClick) */
.chip { display: inline-flex; align-items: center; gap: calc(var(--kit-sp-1) + var(--kit-bw-2)); height: var(--kit-size-small); padding: 0 var(--kit-sp-3); border: var(--kit-bw) solid transparent; border-radius: var(--mui-shape-radiusPill);
  background: var(--mui-palette-grey-100); color: var(--mui-palette-text-primary); font: var(--kit-font-chip); white-space: nowrap; cursor: pointer;
  transition: background-color var(--kit-duration-shortest), border-color var(--kit-duration-shortest), box-shadow var(--kit-duration-shortest), color var(--kit-duration-shortest); }
.chip .icon { width: var(--kit-icon-xs); height: var(--kit-icon-xs); }
.chip:not(span):hover, .chip:not(span).is-hover { background: var(--mui-palette-divider); }
.chip:focus-visible, .chip.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.chip:not(span):active, .chip:not(span).is-active { transform: scale(var(--kit-press-scale)); }
.chip:disabled { background: var(--mui-palette-grey-50); color: var(--mui-palette-text-disabled); cursor: not-allowed; transform: none; }
span.chip { cursor: default; }
.chip--white { background: var(--mui-palette-white-main); }
.chip--white:not(span):hover, .chip--white:not(span).is-hover { background: var(--mui-palette-grey-100); }
.chip--neutral { background: var(--mui-palette-neutral-main); color: var(--mui-palette-neutral-contrastText); }
.chip--neutral:not(span):hover, .chip--neutral:not(span).is-hover { background: var(--mui-palette-neutral-dark); }
.chip--outlined { background: var(--mui-palette-background-paper); border-color: var(--mui-palette-divider); }
.chip--outlined:not(span):hover, .chip--outlined:not(span).is-hover { background: var(--mui-palette-background-paper); border-color: var(--mui-palette-text-disabled); }
.chip--outlined.chip--white { background: transparent; color: var(--mui-palette-common-white); border-color: var(--mui-palette-common-onDarkDivider); }
.chip--outlined.chip--white:not(span):hover, .chip--outlined.chip--white:not(span).is-hover { background: var(--mui-palette-common-onDarkDivider); }
.chip--outlined.chip--warning { color: var(--mui-palette-text-secondary); }
.chip--outlined.chip--warning .icon { color: var(--mui-palette-warning-main); }
.chip--soft.chip--info { background: var(--mui-palette-info-lighter); color: var(--mui-palette-info-dark); }
.chip--soft.chip--info.chip--strong { color: var(--mui-palette-info-main); }
.chip--soft.chip--success { background: var(--mui-palette-success-lighter); color: var(--mui-palette-success-main); }
.chip--soft.chip--secondary { background: var(--mui-palette-section-pink); color: var(--mui-palette-secondary-dark); }
.chip--soft.chip--warning { background: var(--mui-palette-warning-lighter); color: var(--mui-palette-text-primary); }
.chip--soft.chip--error { background: var(--mui-palette-error-lighter); color: var(--mui-palette-error-main); }
.chip--primary, .chip[aria-pressed="true"], .chip.is-selected { background: var(--mui-palette-primary-main); color: var(--mui-palette-primary-contrastText); border-color: var(--mui-palette-primary-main); }
.chip--primary:not(span):hover, .chip--primary:not(span).is-hover, .chip[aria-pressed="true"]:not(span):hover, .chip[aria-pressed="true"]:not(span).is-hover { background: var(--mui-palette-primary-dark); }
.chip--neutral[aria-pressed="true"], .chip--outlined.chip--white[aria-pressed="true"] { background: var(--mui-palette-white-main); color: var(--mui-palette-white-contrastText); border-color: var(--mui-palette-white-main); }
.chip[aria-pressed="true"]:disabled { background: var(--mui-palette-divider); color: var(--mui-palette-text-disabled); border-color: var(--mui-palette-divider); }
.chip--neutral:disabled, .chip--outlined.chip--white:disabled { background: transparent; color: var(--mui-palette-common-onDarkSecondary); border-color: var(--mui-palette-common-onDarkDivider); }
.chip--neutral[aria-pressed="true"]:disabled, .chip--outlined.chip--white[aria-pressed="true"]:disabled { background: var(--mui-palette-common-onDarkDivider); color: var(--mui-palette-common-onDarkSecondary); border-color: transparent; }
.chip__check { display: none; }
.chip[aria-pressed="true"] .chip__check, .chip.is-selected .chip__check { display: inline-block; }
.chip--small { height: var(--kit-size-label); }
.chip--dense { height: var(--kit-size-label-small); padding: 0 var(--kit-sp-2); font: var(--kit-font-chip-small); font-weight: var(--kit-fw-regular); }
.chip--square { border-radius: var(--mui-shape-radiusXs); font: var(--kit-font-chip-small); }
.chip--strong { font-weight: var(--kit-fw-semibold); }
.chip--large-text { height: var(--kit-size-small); padding: 0 var(--kit-sp-4); font: var(--mui-font-subtitle2); font-size: var(--kit-fs-dense); }

/* ═══ Badge (dot / count) ═══ */
.badge__anchor { position: relative; display: inline-flex; }
.badge { position: absolute; top: 0; right: 0; transform: translate(35%, -35%); min-width: var(--kit-sp-5); height: var(--kit-sp-5); padding: 0 var(--kit-sp-1);
  display: inline-grid; place-items: center; border-radius: var(--mui-shape-radiusPill); background: var(--mui-palette-secondary-main); color: var(--mui-palette-secondary-contrastText);
  font: var(--mui-font-caption); font-weight: var(--kit-fw-semibold); box-shadow: 0 0 0 var(--kit-bw-2) var(--mui-palette-background-paper); }
.badge--dot { min-width: 0; width: var(--kit-size-dot); height: var(--kit-size-dot); padding: 0; }
.badge--overlap-circular { top: auto; bottom: 0; transform: translate(10%, 10%); width: 28%; height: 28%; min-width: var(--kit-size-dot); min-height: var(--kit-size-dot); }
.badge--success { background: var(--mui-palette-success-main); }
.badge--error { background: var(--mui-palette-error-main); }
.badge--muted { background: var(--mui-palette-text-disabled); }

/* ═══ Avatar: variant circular (по умолчанию) / rounded; цвет по палитре; размеры — свои ступени ═══ */
.avatar { position: relative; display: inline-grid; place-items: center; width: var(--kit-box-m); height: var(--kit-box-m); border-radius: var(--mui-shape-radiusPill); flex: none;
  background: var(--mui-palette-secondary-light); color: var(--mui-palette-secondary-main); font: var(--mui-font-subtitle2); }
.avatar img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; display: block; }
.avatar--xs { width: var(--kit-box-xs); height: var(--kit-box-xs); font: var(--mui-font-overline); }
.avatar--s { width: var(--kit-box-s); height: var(--kit-box-s); font-size: var(--kit-fs-list); }
.avatar--l { width: var(--kit-box-l); height: var(--kit-box-l); font: var(--mui-font-h6); }
.avatar--info { background: var(--mui-palette-info-lighter); color: var(--mui-palette-info-dark); }
/* rounded — иконка на подложке (Д 990, Д 1456): цвет подложки — lighter, иконка — text.primary */
.avatar--rounded { border-radius: var(--mui-shape-radiusSm); width: var(--kit-size-medium); height: var(--kit-size-medium); color: var(--mui-palette-text-primary); background: var(--mui-palette-info-lighter); }
.avatar--rounded.avatar--secondary { background: var(--mui-palette-secondary-lighter); }
.avatar--rounded.avatar--success { background: var(--mui-palette-success-lighter); }
.avatar--rounded .icon { width: var(--kit-icon-lg); height: var(--kit-icon-lg); }
.avatar--rounded.avatar--s { width: var(--kit-box-s); height: var(--kit-box-s); border-radius: var(--mui-shape-radiusXs); }
.avatar--rounded.avatar--s .icon { width: var(--kit-icon-md); height: var(--kit-icon-md); }

/* ═══ Rating (readOnly) ═══ */
.rating { display: inline-flex; align-items: center; gap: var(--kit-sp-2); font: var(--mui-font-body2); color: var(--mui-palette-text-secondary); }
.rating__stars { display: inline-flex; gap: var(--kit-bw); color: var(--mui-palette-warning-main); }
.rating__star { width: var(--kit-icon-xs); height: var(--kit-icon-xs); background: currentColor;
  clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.rating__star--off { color: var(--mui-palette-divider); }
.rating__value { color: var(--mui-palette-text-primary); font-weight: var(--kit-fw-semibold); }

/* ═══ Число-показатель (Typography h4 / h2 / h1 + caption; своего компонента в MUI нет) ═══ */
.stat { display: grid; gap: var(--kit-sp-2); }
.stat__value { font: var(--mui-font-h4); letter-spacing: var(--kit-ls-h4); color: var(--mui-palette-text-primary); font-variant-numeric: tabular-nums; }
.stat__label { font: var(--mui-font-caption); color: var(--mui-palette-text-secondary); max-width: var(--kit-w-stat-label); }
.stat--dark { text-align: center; }
.stat--dark .stat__value { font: var(--mui-font-h2); letter-spacing: var(--kit-ls-h2); color: var(--mui-palette-common-white); }
.stat--dark .stat__label { color: var(--mui-palette-secondary-main); font: var(--mui-font-body2); font-size: var(--kit-fs-list); max-width: none; }
.stat--sum .stat__label { order: -1; color: var(--mui-palette-section-navyText); font: var(--mui-font-overline); letter-spacing: var(--kit-ls-overline); text-transform: uppercase; max-width: none; }
.stat--sum .stat__value { font: var(--mui-font-h1); letter-spacing: var(--kit-ls-h1); color: var(--mui-palette-common-white); }

/* ═══ Accordion ═══ */
.accordion { border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-borderRadius); background: var(--mui-palette-background-paper); transition: border-color var(--kit-duration-shortest); }
.accordion:has(.accordion__head:hover), .accordion:has(.accordion__head.is-hover) { border-color: var(--mui-palette-text-disabled); }
.accordion__head { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: var(--kit-sp-4); padding: var(--kit-sp-5);
  border: 0; background: none; text-align: left; color: var(--mui-palette-text-primary); font: var(--mui-font-subtitle2); cursor: pointer; border-radius: inherit; }
.accordion__head:focus-visible, .accordion__head.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.accordion__head:active, .accordion__head.is-active { background: var(--mui-palette-grey-50); }
.accordion__head:disabled { color: var(--mui-palette-text-disabled); cursor: not-allowed; }
.accordion__sign { position: relative; width: var(--kit-icon-2xs); height: var(--kit-icon-2xs); flex: none; color: var(--mui-palette-text-secondary); }
.accordion__sign::before, .accordion__sign::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: var(--kit-bw-strong); margin-top: calc(var(--kit-bw-strong) / -2); background: currentColor;
  transition: transform var(--kit-duration-shorter) var(--kit-easing-easeInOut); }
.accordion__sign::after { transform: rotate(90deg); }
.accordion__head[aria-expanded="true"] .accordion__sign::after { transform: rotate(0); }
.accordion__body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--kit-duration-shorter) var(--kit-easing-easeInOut); }
.accordion__body[data-open="true"] { grid-template-rows: 1fr; }
.accordion__inner { overflow: hidden; }
.accordion__inner > p { margin: 0; padding: 0 var(--kit-sp-5) var(--kit-sp-5); color: var(--mui-palette-text-secondary); font: var(--mui-font-body2); }

/* ═══ Tabs: standard (линия) / pills (свой variant) ═══ */
.tabs { min-width: 0; }
.tabs__list { display: flex; gap: var(--kit-sp-6); border-bottom: var(--kit-bw) solid var(--mui-palette-divider); overflow-x: auto; scrollbar-width: none; }
.tabs__tab { position: relative; padding: var(--kit-sp-3) var(--kit-sp-1); border: 0; background: none; color: var(--mui-palette-text-secondary); font: var(--mui-font-subtitle2);
  cursor: pointer; white-space: nowrap; border-radius: var(--mui-shape-radiusXs) var(--mui-shape-radiusXs) 0 0; transition: color var(--kit-duration-shortest); }
.tabs__tab::after { content: ""; position: absolute; left: 0; right: 0; bottom: calc(-1 * var(--kit-bw)); height: var(--kit-bw-2); background: var(--mui-palette-primary-main); transform: scaleX(0); transition: transform var(--kit-duration-shorter) var(--kit-easing-easeInOut); }
.tabs__tab:hover, .tabs__tab.is-hover { color: var(--mui-palette-text-primary); }
.tabs__tab:focus-visible, .tabs__tab.is-focus { outline: none; box-shadow: var(--kit-focus-ring-inset); }
.tabs__tab[aria-selected="true"] { color: var(--mui-palette-text-primary); }
.tabs__tab[aria-selected="true"]::after { transform: scaleX(1); }
.tabs__tab:disabled { color: var(--mui-palette-text-disabled); cursor: not-allowed; }
.tabs--pills > .tabs__list { gap: var(--kit-sp-1); padding: var(--kit-sp-1); border: 0; background: var(--mui-palette-grey-100); border-radius: var(--mui-shape-radiusPill); display: inline-flex; max-width: 100%; }
.tabs--pills > .tabs__list > .tabs__tab { padding: var(--kit-sp-2) var(--kit-sp-4); border-radius: var(--mui-shape-radiusPill); font-size: var(--kit-fs-dense); }
.tabs--pills > .tabs__list > .tabs__tab::after { display: none; }
.tabs--pills > .tabs__list > .tabs__tab[aria-selected="true"] { background: var(--mui-palette-background-paper); box-shadow: var(--mui-shadows-1); }
.tabs__panel { padding: var(--kit-sp-4) 0; color: var(--mui-palette-text-secondary); font: var(--mui-font-body2); }

/* ═══ Tooltip (arrow) ═══ */
.tooltip__anchor { position: relative; display: inline-flex; }
.tooltip { position: absolute; z-index: var(--mui-zIndex-tooltip); bottom: calc(100% + var(--kit-sp-2)); left: 50%; transform: translateX(-50%); width: max-content; max-width: var(--kit-w-tooltip);
  padding: var(--kit-sp-2) var(--kit-sp-3); border-radius: var(--mui-shape-radiusSm); background: var(--mui-palette-grey-900); color: var(--mui-palette-common-white); font: var(--mui-font-caption);
  box-shadow: var(--mui-shadows-8); animation: kit-fade var(--kit-duration-shorter) var(--kit-easing-easeOut); }
.tooltip[hidden] { display: none; }
.tooltip::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: calc(-1 * var(--kit-tip-arrow)); border: var(--kit-tip-arrow) solid transparent; border-top-color: var(--mui-palette-grey-900); }
.tooltip--static { position: static; transform: none; display: inline-block; animation: none; }
@keyframes kit-fade { from { opacity: 0; } to { opacity: 1; } }

/* ═══ Snackbar (SnackbarContent: тёмная плашка) ═══ */
.snackbar__region { position: fixed; z-index: var(--mui-zIndex-snackbar); right: var(--kit-sp-6); bottom: var(--kit-sp-6); display: grid; gap: var(--kit-sp-2); width: min(var(--kit-w-snackbar), calc(100vw - 2 * var(--kit-sp-5))); }
.snackbar { display: flex; align-items: flex-start; gap: var(--kit-sp-3); padding: var(--kit-sp-4); border-radius: var(--mui-shape-borderRadius); background: var(--mui-palette-grey-900); color: var(--mui-palette-common-white);
  box-shadow: var(--mui-shadows-24); font: var(--mui-font-body2); animation: kit-snack-in var(--kit-duration-standard) var(--kit-easing-easeOut); }
.snackbar.is-leaving { animation: kit-snack-out var(--kit-duration-shorter) var(--kit-easing-easeInOut) forwards; }
.snackbar > .icon { color: var(--mui-palette-success-main); margin-top: var(--kit-bw); }
.snackbar--error > .icon { color: var(--mui-palette-error-main); }
.snackbar__text { flex: 1; }
.snackbar__text b { display: block; font-weight: var(--kit-fw-semibold); margin-bottom: var(--kit-bw-2); }
.snackbar .icon-button { width: var(--kit-box-xs); height: var(--kit-box-xs); color: var(--mui-palette-common-onDarkSecondary); }
.snackbar--static { animation: none; max-width: var(--kit-w-snackbar); }
@keyframes kit-snack-in { from { opacity: 0; transform: translateY(var(--kit-sp-3)) scale(var(--kit-press-scale)); } to { opacity: 1; transform: none; } }
@keyframes kit-snack-out { to { opacity: 0; transform: translateY(var(--kit-sp-2)); } }

/* ═══ Alert: variant standard; severity success / info / warning / error — достроено по MUI ═══ */
.alert { display: flex; align-items: flex-start; gap: var(--kit-sp-3); padding: var(--kit-sp-3) var(--kit-sp-4); border-radius: var(--mui-shape-borderRadius); background: var(--mui-palette-info-lighter); color: var(--mui-palette-text-primary); font: var(--mui-font-body2); }
.alert > .icon { color: var(--mui-palette-info-main); margin-top: var(--kit-bw); }
.alert__title { display: block; font: var(--mui-font-subtitle2); font-size: var(--kit-fs-dense); margin-bottom: var(--kit-bw-2); }
.alert--info { background: var(--mui-palette-info-lighter); }
.alert--info > .icon { color: var(--mui-palette-info-main); }
.alert--success { background: var(--mui-palette-success-lighter); }
.alert--success > .icon { color: var(--mui-palette-success-main); }
.alert--warning { background: var(--mui-palette-warning-lighter); }
.alert--warning > .icon { color: var(--mui-palette-warning-main); }
.alert--error { background: var(--mui-palette-error-lighter); }
.alert--error > .icon { color: var(--mui-palette-error-main); }

/* ═══ Dialog ═══ */
.dialog { width: min(var(--kit-w-dialog), calc(100vw - 2 * var(--kit-sp-5))); padding: 0; border: 0; border-radius: var(--mui-shape-radiusCardLg); background: var(--mui-palette-background-paper); color: var(--mui-palette-text-primary); box-shadow: var(--mui-shadows-24); }
.dialog::backdrop { background: var(--mui-palette-common-backdrop); }
.dialog[open] { animation: kit-snack-in var(--kit-duration-standard) var(--kit-easing-easeOut); }
.dialog__title { display: flex; align-items: center; justify-content: space-between; gap: var(--kit-sp-4); padding: var(--kit-sp-6) var(--kit-sp-6) 0; }
.dialog__title h3 { margin: 0; font: var(--mui-font-h3); letter-spacing: var(--kit-ls-h3); }
.dialog__content { padding: var(--kit-sp-3) var(--kit-sp-6) var(--kit-sp-6); color: var(--mui-palette-text-secondary); font: var(--mui-font-body2); }
.dialog__actions { display: flex; gap: var(--kit-sp-2); justify-content: flex-end; padding: 0 var(--kit-sp-6) var(--kit-sp-6); }
.dialog--static { position: static; display: block; box-shadow: var(--mui-shadows-8); border: var(--kit-bw) solid var(--mui-palette-divider); }

/* ═══ Divider ═══ */
.divider { height: 0; margin: 0; border: 0; border-top: var(--kit-bw) solid var(--mui-palette-divider); }
.divider--on-dark { border-top-color: var(--mui-palette-common-onDarkDivider); }
.divider--vertical { height: auto; align-self: stretch; border-top: 0; border-left: var(--kit-bw) solid var(--mui-palette-divider); }

/* ═══ Значок магазина (Button contained с двумя строками — свой вариант) ═══ */
.store-badge { display: inline-grid; align-content: center; gap: var(--kit-bw-2); height: var(--kit-size-store); padding: 0 var(--kit-sp-4); border-radius: var(--mui-shape-borderRadius); background: var(--mui-palette-primary-main); color: var(--mui-palette-primary-contrastText);
  border: var(--kit-bw) solid var(--mui-palette-primary-main); text-decoration: none; transition: background-color var(--kit-duration-shortest), box-shadow var(--kit-duration-shortest), transform var(--kit-duration-shortest); }
.store-badge__small { font: var(--kit-font-chip-small); font-weight: var(--kit-fw-regular); opacity: 0.8; }
.store-badge__name { font: var(--mui-font-h6); font-size: var(--kit-fs-store); font-weight: var(--kit-fw-bold); line-height: 1.1; }
.store-badge--outlined { background: var(--mui-palette-background-paper); color: var(--mui-palette-text-primary); border-color: var(--mui-palette-divider); }
.store-badge:hover, .store-badge.is-hover { background: var(--mui-palette-primary-dark); }
.store-badge--outlined:hover, .store-badge--outlined.is-hover { background: var(--mui-palette-grey-100); }
.store-badge:focus-visible, .store-badge.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.store-badge:active, .store-badge.is-active { transform: scale(var(--kit-press-scale)); }
.store-badge--full-width { width: 100%; justify-items: center; }

/* ═══ Логотип ═══ */
.logo { display: inline-flex; border-radius: var(--mui-shape-radiusXs); line-height: 0; }
.logo img { height: var(--kit-box-s); width: auto; }
.logo--surface { background: var(--mui-palette-background-paper); padding: var(--kit-sp-2); align-self: flex-start; justify-self: start; }
.logo:hover, .logo.is-hover { opacity: 0.85; }
.logo:focus-visible, .logo.is-focus { outline: none; box-shadow: var(--kit-focus-ring); }
.logo--small img { height: var(--kit-box-xs); }

/* ═══ StepIcon (Stepper) ═══ */
.step-icon { display: inline-grid; place-items: center; width: var(--kit-box-m); height: var(--kit-box-m); border-radius: var(--mui-shape-radiusPill); background: var(--mui-palette-primary-main);
  color: var(--mui-palette-common-white); font: var(--mui-font-subtitle2); font-size: var(--kit-fs-dense); flex: none; }
.step-icon--info { background: var(--mui-palette-info-main); }
.step-icon--secondary { background: var(--mui-palette-secondary-main); }
.step-icon--completed { background: var(--mui-palette-success-main); }
.step-icon--completed .icon { width: var(--kit-size-check); height: var(--kit-size-check); }
.step-icon--small { width: var(--kit-box-s); height: var(--kit-box-s); font-size: var(--kit-fs-list); }

/* ═══ LinearProgress: determinate / indeterminate (достроено) ═══ */
/* determinate — <progress value max>: значение атрибутом, полоса — псевдоэлементы; indeterminate — div с __bar */
.linear-progress { -webkit-appearance: none; appearance: none; display: block; position: relative; width: 100%; height: var(--kit-sp-1); margin: 0; padding: 0; border: 0;
  border-radius: var(--mui-shape-radiusPill); background: var(--mui-palette-grey-100); color: var(--mui-palette-grey-100); overflow: hidden; }
.linear-progress::-webkit-progress-bar { background: var(--mui-palette-grey-100); border-radius: var(--mui-shape-radiusPill); }
.linear-progress::-webkit-progress-value { background: var(--kit-gradient-progress); border-radius: var(--mui-shape-radiusPill); transition: width var(--kit-duration-standard) var(--kit-easing-easeInOut); }
.linear-progress::-moz-progress-bar { background: var(--kit-gradient-progress); border-radius: var(--mui-shape-radiusPill); }
.linear-progress__bar { position: absolute; inset: 0 auto 0 0; width: 40%; border-radius: inherit; background: var(--kit-gradient-progress); }
.linear-progress--indeterminate .linear-progress__bar { animation: kit-indet var(--kit-duration-indeterminate) var(--kit-easing-easeInOut) infinite; }
@keyframes kit-indet { from { left: -40%; } to { left: 100%; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0ms !important; animation-duration: 0ms !important; }
}

/* ═══ Chip --text: метка текстом без подложки (Typography caption + иконка; Д 7868 «✓ Проверенный агент») — вариант чипа ═══ */
.chip--text { height: auto; padding: 0; border: 0; border-radius: 0; background: none; color: inherit; gap: var(--kit-sp-1); white-space: normal; font: var(--mui-font-caption); font-weight: var(--kit-fw-semibold); }
.chip--text .icon { width: var(--kit-icon-2xs); height: var(--kit-icon-2xs); }
.chip--text.chip--success { color: var(--mui-palette-success-main); }
/* Component inspector — атом-инструмент кита, создаётся единым behaviors.js. */
.component-inspector { position: fixed; right: var(--kit-sp-4); bottom: var(--kit-sp-16); z-index: var(--mui-zIndex-tooltip); display: grid; gap: var(--kit-sp-1); max-width: var(--kit-width-inspector); padding: var(--kit-sp-3) var(--kit-sp-4); border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-radiusSm); background: var(--mui-palette-background-paper); color: var(--mui-palette-text-primary); box-shadow: var(--mui-shadows-8); font: var(--mui-font-caption); }
.component-inspector[hidden] { display: none; }
.component-inspector code { color: var(--mui-palette-text-secondary); font: inherit; }
.component-inspector a { color: var(--mui-palette-info-main); font: var(--mui-font-button); }
.component-inspector__toggle { position: fixed; right: var(--kit-sp-4); bottom: var(--kit-sp-4); z-index: var(--mui-zIndex-tooltip); min-height: var(--kit-size-control-s); padding: 0 var(--kit-sp-3); border: var(--kit-bw) solid var(--mui-palette-divider); border-radius: var(--mui-shape-radiusPill); background: var(--mui-palette-background-paper); color: var(--mui-palette-text-primary); box-shadow: var(--mui-shadows-4); font: var(--mui-font-button); cursor: pointer; }
.component-inspector__toggle:focus-visible { outline: none; box-shadow: var(--kit-ring-outer), var(--mui-shadows-4); }
.component-inspector--sample, .component-inspector__toggle--sample { position: static; }
.is-kit-inspected { outline: var(--kit-bw-strong) solid var(--mui-palette-info-main); outline-offset: var(--kit-sp-1); }