/* Оболочка страницы: контейнеры, появление содержимого, шапки разделов.
   Часть v3/core.css; порядок частей важен — см. static/README.md. */
/* V3 core layer: shared live primitives only. */

/* ── Motion: shared appear animation ─────────────────────────────────────── */

@keyframes async-section-appear {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}

/* Applied to any element that just replaced a skeleton or was inserted async. */
[data-word-async-entering] {
    animation: async-section-appear var(--motion-dur-base) var(--motion-ease, cubic-bezier(0.22, 1, 0.36, 1)) both;
}

/* Applied to newly load-more items; stagger controlled via --load-more-stagger. */
.is-newly-loaded {
    animation: async-section-appear var(--motion-dur-sm) var(--motion-ease, cubic-bezier(0.22, 1, 0.36, 1)) both;
    animation-delay: calc(var(--load-more-stagger, 0) * 45ms);
}

/* Applied to extra items just before list collapses back to initial state. */
.is-collapsing {
    animation: async-section-appear var(--motion-dur-sm) var(--motion-ease, cubic-bezier(0.22, 1, 0.36, 1)) both reverse;
    pointer-events: none;
}

[hidden],
.hidden {
    display: none !important;
}

.content-container {
    padding: clamp(12px, 1.6vw, 18px);
    border-radius: var(--radius-none);
    background: transparent;
    border: 0;
    box-shadow: none;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    overflow: visible;
    gap: var(--body-gap);
}

.surface--quiet {
    border: 0;
    box-shadow: none;
    background: var(--container-surface-section, var(--theme-surface-subtle));
}

.content-container.surface--quiet {
    border-radius: var(--surface-quiet-radius, var(--surface-radius));
    border: var(--surface-quiet-border, var(--container-border-section, 1px solid var(--theme-border-normal)));
    background: var(--surface-quiet-bg, var(--container-surface-section, var(--theme-surface-subtle)));
    -webkit-backdrop-filter: var(--surface-quiet-backdrop, none);
    backdrop-filter: var(--surface-quiet-backdrop, none);
}

.content-container.surface--plain {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.content-container.surface--glass {
    background: var(--theme-surface-subsection);
    border-color: var(--theme-border-normal);
    -webkit-backdrop-filter: saturate(145%) blur(14px);
    backdrop-filter: saturate(145%) blur(14px);
}

.content-container > .content-body {
    gap: var(--inner-gap);
}

.content-body--inset {
    padding: var(--content-body-inset-y, clamp(14px, 1.4vw, 18px))
             var(--content-body-inset-x, clamp(16px, 1.6vw, 20px));
    box-sizing: border-box;
}

.content-body > * {
    min-width: 0;
}

.surface-shell {
    display: flex;
    flex-direction: column;
    gap: var(--body-gap);
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: var(--section-padding);
    border-radius: var(--surface-radius);
    border: var(--container-border-shell, 1px solid var(--theme-border-normal));
    background: var(--container-surface-shell, var(--theme-surface-shell));
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-sizing: border-box;
}

.content-container {
    width: 100%;
    max-width: 100%;
    margin: 0;
}

.content-container--panel-shell {
    --content-panel-shell-padding-x: clamp(12px, 1.3vw, 18px);
    --content-panel-shell-padding-y: clamp(10px, 1.1vw, 16px);
    --content-panel-shell-body-padding-top: var(--inner-gap);
    --content-panel-shell-head-top-offset: clamp(2px, 0.4vw, 6px);
    padding: 0;
    gap: 0;
}

.content-container--panel-shell > .section-head {
    margin: 0;
    padding: calc(var(--content-panel-shell-padding-y) + var(--content-panel-shell-head-top-offset))
             var(--content-panel-shell-padding-x) 0;
    --section-head-padding-x: 0;
    --section-head-padding-y: 0;
    --section-head-text-padding-y: 0;
}

.content-container--panel-shell > .content-panel--controls {
    margin: 0;
    padding-inline: var(--content-panel-shell-padding-x);
}

.content-container--panel-shell > .section-head + .content-panel--controls {
    margin-top: var(--space-3);
}

.content-container--panel-shell > .content-body {
    padding: var(--content-panel-shell-padding-y) var(--content-panel-shell-padding-x) var(--content-panel-shell-padding-y);
}

.content-container--panel-shell > .section-head + .content-body,
.content-container--panel-shell > .section-head + .content-panel--controls + .content-body {
    padding-top: var(--content-panel-shell-body-padding-top);
}

.section-head {
    --section-head-title-size: var(--section-head-title-size-level-2, clamp(19px, 1.6vw, 23px));
    --section-head-title-line-height: 1.24;
    --section-head-title-weight: var(--hierarchy-title-weight);
    --section-head-title-letter-spacing: var(--hierarchy-heading-track);
    --section-head-summary-size: var(--section-head-summary-size-level-2, var(--type-body-size));
    --section-head-summary-line-height: var(--type-body-sm-line);
    background: transparent;
    border: 0;
    border-radius: var(--surface-radius);
    width: 100%;
    max-width: 100%;
    margin: 0 0 var(--section-head-margin-bottom, 0);
    position: relative;
    overflow: visible;
    box-sizing: border-box;
}

.section-head__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: var(--section-head-gap);
    padding: var(--section-head-padding-y) var(--section-head-padding-x);
    min-width: 0;
    min-height: 42px;
    box-sizing: border-box;
    position: relative;
}

.section-head__inner > * {
    min-width: 0;
}

.section-head__right {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-end;
    gap: var(--section-head-actions-gap);
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
}

.section-head__text {
    min-width: 0;
    padding: var(--section-head-text-padding-y) 0;
    width: 100%;
    font-size: var(--section-head-title-size);
    line-height: var(--section-head-title-line-height);
    font-weight: var(--section-head-title-weight);
    letter-spacing: var(--section-head-title-letter-spacing);
    color: var(--section-head-title-color, var(--hierarchy-title-color));
    white-space: normal;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: var(--section-head-text-gap-row);
    text-align: left;
}

.section-head__heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--section-head-title-row-gap);
    min-width: 0;
}

.section-head__heading--with-icon {
    align-items: center;
}

.section-head__text :is(h1, h2, h3, h4, h5, h6) {
    margin: 0;
    display: inline-block;
    font-size: 1em;
    line-height: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    min-width: 0;
    white-space: normal;
    overflow-wrap: break-word;
}

.section-head--level-1 {
    --section-head-title-size: var(--section-head-title-size-level-1, clamp(24px, 2vw, 31px));
    --section-head-summary-size: var(--section-head-summary-size-level-1, var(--type-body-sm-size));
}

.section-head--level-2 {
    --section-head-title-size: var(--section-head-title-size-level-2, clamp(19px, 1.6vw, 23px));
    --section-head-summary-size: var(--section-head-summary-size-level-2, var(--type-body-size));
}

.section-head--level-3 {
    --section-head-title-size: var(--section-head-title-size-level-3, clamp(16px, 1.3vw, 20px));
    --section-head-summary-size: var(--section-head-summary-size-level-3, var(--type-caption-size));
}

.section-head__summary {
    width: 100%;
    margin: 0;
    font-size: var(--section-head-summary-size, var(--type-caption-size));
    line-height: var(--section-head-summary-line-height, 1.32);
    color: var(--section-head-summary-color, var(--hierarchy-summary-color));
}

.section-head__heading + .section-head__summary {
    margin-top: 0;
}

.section-head__summary :is(p, ul, ol) {
    margin: 0;
    padding: 0;
}

.section-head__summary > :not(:first-child) {
    margin-top: var(--section-head-summary-block-gap, 2px);
}

.section-head__summary .highlight,
.section-head__summary strong {
    color: var(--section-head-summary-strong-color, var(--hierarchy-emphasis-color));
}

.section-head__state-trigger {
    color: inherit;
}

.section-head__state-trigger .action-icon {
    color: currentColor;
    opacity: 1;
}

.section-head__state-trigger .action-icon__img {
    -webkit-filter: var(--icon-filter);
    filter: var(--icon-filter);
}

.section-head--page {
    margin-bottom: 0;
    --section-head-title-size-level-1: clamp(27px, 2.2vw, 34px);
    --section-head-title-size-level-2: clamp(20px, 1.7vw, 24px);
    --section-head-title-size-level-3: clamp(18px, 1.4vw, 21px);
    --section-head-summary-size-level-1: var(--type-body-sm-size);
    --section-head-summary-size-level-2: var(--type-body-sm-size);
    --section-head-summary-size-level-3: var(--type-caption-size);
    --section-head-text-gap-row: var(--space-1);
    --section-head-margin-bottom: var(--space-4);
}

.section-head--search {
    --section-head-title-size-level-1: clamp(25px, 2.05vw, 31px);
    --section-head-title-size-level-2: clamp(19px, 1.6vw, 22px);
    --section-head-title-size-level-3: clamp(17px, 1.3vw, 20px);
    --section-head-margin-bottom: var(--space-3);
}

.section-head--catalog-section {
    --section-head-title-size-level-1: clamp(23px, 1.85vw, 28px);
    --section-head-title-size-level-2: clamp(18px, 1.45vw, 21px);
    --section-head-title-size-level-3: clamp(16px, 1.2vw, 19px);
    --section-head-summary-size-level-2: var(--type-caption-size);
    --section-head-text-gap-row: var(--space-1);
    --section-head-margin-bottom: var(--space-3);
}

.section-head--page .section-head__inner {
    padding: 0;
    gap: var(--control-gap-wide);
    min-height: auto;
}

.content-container--panel-shell > .section-head {
    --section-head-margin-bottom: 0;
}

.section-head--page .section-head__text {
    padding: 0;
}

.section-head--page .section-head__icon {
    color: var(--theme-text-muted);
}

.section-head--page .section-head__right {
    align-self: flex-start;
}

.section-head--page .section-head__text :is(h1, h2, h3, h4, h5, h6) {
    min-height: auto;
    padding: 0;
}

.section-head--page.section-head--no-summary {
    --section-head-margin-bottom: var(--space-5);
}

.section-head--page.section-head--has-right.section-head--no-summary {
    --section-head-margin-bottom: var(--space-6);
}

[data-section-head-context].badge {
    flex: 0 0 auto;
    margin: 0;
}

.section-head__icon {
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    margin-top: 0;
    --icon-filter: none;
    color: var(--txt-color);
    opacity: 0.92;
}

.section-head__controls {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--section-head-actions-gap);
    min-width: 0;
    max-width: 100%;
}

:is(.section-head__controls [data-section-head-action-rail], [data-word-action-strip][data-section-head-action-rail]) {
    --button-panel-bg: var(--theme-surface-base);
    --button-panel-border: var(--theme-border-subtle);
    --button-panel-shadow: none;
    --button-panel-backdrop: none;
    --button-panel-padding: 4px;
    --button-panel-gap: var(--control-gap-tight);
}

:is(.section-head__controls [data-section-head-action-rail], [data-word-action-strip][data-section-head-action-rail]) :is(.icon-button, .info-trigger):not(.menu-button) {
    --button-chrome-bg: transparent;
    --button-chrome-border: transparent;
    --button-chrome-color: var(--theme-text-muted);
    --button-chrome-bg-hover: var(--theme-action-secondary-bg-hover);
    --button-chrome-border-hover: transparent;
    --button-chrome-color-hover: var(--theme-text-strong);
    --button-chrome-bg-active: var(--theme-action-secondary-bg-active);
}

.section-head__status {
    display: inline-flex;
    align-items: center;
    gap: var(--control-gap-2xs);
    min-width: 0;
    max-width: 100%;
}

.info-trigger:not(.menu-button) {
    --button-icon-box-size: 28px;
    --button-icon-size: 12px;
    --action-icon-size: 12px;
    --button-chrome-border: transparent;
    --button-chrome-border-hover: transparent;
    --button-chrome-bg: transparent;
    --button-chrome-bg-hover: var(--theme-action-secondary-bg-hover);
    --button-chrome-bg-active: var(--theme-action-secondary-bg-active);
    --button-chrome-color: var(--theme-text-muted);
    --button-chrome-color-hover: var(--theme-text-strong);
}

.section-head--compact-rail .section-head__inner {
    align-items: center;
}

.section-head--compact-rail .section-head__action-rail .icon-button:not(.menu-button) {
    --button-icon-box-size: 24px;
    --button-icon-size: 14px;
    --action-icon-size: 14px;
}

.info-anchor-block {
    position: relative;
}

.info-anchor-block .info-trigger {
    position: absolute;
    top: 18px;
    right: 18px;
    margin-inline-start: 0;
    z-index: 1;
}

.content-body {
    width: 100%;
}

.content-body > p,
.content-body > .table-intro {
    max-inline-size: var(--content-readable-max-width);
}

.content-body > .article,
.content-body > .information-container {
    max-width: min(920px, 100%);
}

:where(.content-body, .item-card, .list-shell) img:not(.action-icon__img) {
    display: block;
    max-width: 100%;
    height: auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    min-width: 0;
    color: var(--hierarchy-title-color);
    overflow-wrap: anywhere;
    word-break: break-word;
}