/* Buttons: base component, variants and interaction states. */
.button {
  display: inline-flex; min-width: 139px; min-height: 48px; align-items: center; justify-content: center;
  gap: 8px; padding: 12px 24px; border: 1px solid transparent; border-radius: var(--radius-control);
  font: 400 16px/1 var(--font-medium); text-decoration: none; transition: color var(--duration-fast), background var(--duration-fast), border-color var(--duration-fast);
}
.button--primary { color: var(--color-white); background: var(--color-blue-500); }
.button--primary:hover, .button--primary:focus-visible, .button--primary:active, .button--primary.is-hover, .button--primary.is-focus, .button--primary.is-active { color: var(--color-white); }
.button--primary:hover, .button--primary.is-hover { background: var(--color-blue-700); }
.button--secondary { color: var(--color-blue-500); border-color: var(--color-blue-500); background: #fff; }
.button--secondary:hover, .button--secondary.is-hover { color: #fff; background: var(--color-blue-700); border-color: var(--color-blue-700); }
.button--secondary:hover svg path, .button--secondary.is-hover svg path{ fill: white;}
.button--support { color: var(--color-error); border-color: #f00; background: #fff; }
.meeting-view__actions.meeting-view__admin-only .button{min-height: 56px;}
.button--support:hover, .button--support.is-hover { color: #fff; background: var(--color-error-hover); border-color: var(--color-error-hover); }
.button:focus-visible, .button.is-focus { border: 3px solid var(--color-focus); outline-offset: 0; outline: transparent; }
.button--support:focus-visible, .button--support.is-focus { outline-color: var(--color-error-focus); }
.button:active, .button.is-active { transform: translateY(1px); filter: brightness(.9); }
.button:disabled, .button.is-disabled { color: #fff; background: var(--color-gray-400); border-color: var(--color-gray-400); }
.button:disabled svg path, .button.is-disabled svg path{ fill: white; }
.button--small { /*min-width: 230px; */min-height: 42px; font-size: 13px; line-height: 1.4; }
.button--small .button__icon { width: 20px; height: 20px; flex-basis: 20px; }
.button--primary svg{width: 24px;height: 24px;flex: 0 0 24px;}
/* Work-group card: content, icons and interaction states. */
.card { min-width: 0; }
.card--group { display: flex; width: min(100%, 437px); min-height: 148px; justify-content: space-between; padding: 16px; border: 0; border-radius: 4px; color: var(--card-text-color, var(--color-blue-700)); background: var(--color-blue-200); text-align: left; transition: background var(--duration-fast), color var(--duration-fast); }
.card__content { display: flex; min-width: 0; flex-direction: column; justify-content: space-between; font-family: var(--font-medium);height: 100%; }
.card__title { font-size: 22px; line-height: 1; }
.card__description { font-size: 16px; line-height: 1.3; }
.card__media { width: 88px; height: 88px; flex: 0 0 88px; overflow: hidden;position: relative; }
.card__icon { width: 88px;height: 88px;object-fit: contain;max-width: 100%;position: absolute;top: 0;right: 0;transition: opacity var(--duration-fast); }
.card--compact .card__media { width: 72px; height: 72px; flex: 0 0 72px; }
.card--compact .card__icon { width: 72px; height: 72px; }
.card--group.card--cyan { background: var(--color-cyan-card); }
.card--group.card--violet { background: var(--color-violet-card); --card-text-color: var(--color-black);}
.card--group.card--green { background: var(--color-green-card); }
.card--group:hover, .card--group.is-hover { color: var(--color-white); background: var(--color-blue-500); }
.card__icon--hover{
    opacity: 0;
}
.card--group:active .card__icon:not(.card__icon--hover), .card--group.active .card__icon:not(.card__icon--hover),.card--group:hover .card__icon:not(.card__icon--hover), .card--group.is-hover .card__icon:not(.card__icon--hover){
    opacity: 0;
}
.card--group:hover .card__icon--hover, .card--group.is-hover .card__icon--hover, .card--group:active .card__icon--hover, .card--group.card--active .card__icon--hover{
    opacity: 1;
}
.card--group:active, .card--group.card--active { color: var(--color-white); background: var(--color-blue-700); }
.card--group:focus-visible, .card--group.is-focus { outline: 3px solid #86b1ff; outline-offset: 0; }
.card--group:disabled, .card--group.is-disabled { color: var(--color-gray-400); background: var(--color-gray-200); }

/* Show-more action: shared sizing and hidden state. */
.show-more { width: 100%;margin-top: var(--space-4);}
.show-more[hidden] { display: none; }

/* Home page: system notice banner. */
.notice { padding: 48px var(--space-6) 0; }
.notice__inner { position: relative; isolation: isolate; min-height: 165px; padding: var(--space-7); overflow: hidden; color: var(--color-white); background: var(--color-blue-700); }
.notice__inner::before { position: absolute; z-index: -1; inset: 0; background: url("/local/templates/main/images/notice-bg.png") center bottom / cover no-repeat; content: ""; mix-blend-mode: soft-light; opacity: .6; }
.notice__title { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-5); font: 400 22px/1 var(--font-medium); }
.notice__title img { width: 32px; height: 32px; }
.notice p { font-size: 18px; line-height: 1.6; }
/* Home page: dashboard content and section headings. */
.home-page__content { display: grid; gap: var(--space-6); padding: 48px var(--space-6); }
.dashboard-section { padding: var(--space-7); background: var(--color-white); }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-7); }
.section-heading h2, .table-section h3, .activity-feed__heading h2 { color: var(--color-blue-700); }
.section-heading__link { font-size: 18px; text-decoration: none; }
.dashboard-section .section-heading__link { transform: translateY(-9px); }
.section-heading__mobile-label { display: none; }
/* Home page: work-group grid and group selector. */
.groups-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-2); margin-bottom: var(--space-7); }
.groups-grid .card--group { width: 100%; }
.card--group.card--active { color: var(--color-white); background: var(--color-blue-700); }
.groups-grid .card--group[aria-selected="true"] { color: var(--color-white); background: var(--color-blue-700); }
.groups-grid .card__description { max-width: 250px; }
.card-select__label, .card-select__trigger { display: none; }
/* Home page: meetings table. */
.table-section { display: grid; gap: var(--space-7); }
.data-table, .data-table__header, .data-table__row { display: grid; min-width: 0; }
.data-table__cell { min-width: 0; }
.data-table__row--meetings { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(180px, 1fr) minmax(360px, 2fr) 140px; align-items: center; gap: var(--space-8); min-height: 75px; border-bottom: 1px solid rgb(0 0 0 / 5%); color: var(--color-black); font-size: 18px; line-height: 1.6; text-decoration: none; }
.data-table__row--meetings > :first-child { color: var(--color-blue-500); }
.data-table__row--header { min-height: 56px; border: 0; font-size: 16px; }
.data-table__row--header > :first-child { color: var(--color-black); }
.data-table__cell--date, .data-table__cell--purpose{
    color: var(--color-black);
}
.data-table--meetings .status { min-width: 140px; padding: var(--space-2) var(--space-4); font: 400 16px/1.6 var(--font-regular); }
.meeting-view__title .status{font: 400 16px/1.6 var(--font-regular);min-width: 140px;min-height: 42px;}
.table-section > .show-more { display: none; }
/* Home page: activity journal. */
.activity-feed__heading { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-7); }
.activity-feed__badge { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; color: var(--color-white); background: var(--color-error); font: 400 18px/0.7 var(--font-medium); }
.activity-feed__item { display: grid; grid-template-columns: 260px 1fr; gap: var(--space-7); padding: var(--space-4) 0; border-bottom: 1px solid rgb(0 0 0 / 10%); font-size: 18px; line-height: 1.6; }
.activity-feed__item a { text-decoration: none; }
.activity-feed__details { display: none; }
.show-more--activity { display: none; }
.card-select__scroll { display: contents; }

/* Home page: two-column group grid on medium desktop. */
@media (max-width: 1500px) {
  .groups-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Home page: tablet and mobile card layout. */
@media (max-width: 1100px) {
  .content-section--mobile-protocol { display: grid; }
    .site-page { background: var(--color-white); }
  .notice { padding: 0; }
  .notice__inner { min-height: 141px; padding: var(--space-6) 20px; }
  .notice__title { margin-bottom: var(--space-4); font-size: 18px; line-height: 1.4; }
  .notice__title img { width: 24px; height: 24px; }
  .notice p { font-size: 13px; line-height: 1.4; }
  .home-page__content { gap: 2px; padding: 0; }
  .dashboard-section { padding: var(--space-7) var(--space-4);border-top: 2px solid var(--color-blue-050); }
  .section-heading { margin-bottom: var(--space-7); }
  .section-heading h2, .activity-feed__heading h2 { font-size: 24px; line-height: 1.2; }
  .section-heading__link { font-size: 15px; line-height: 1.4; }
  .section-heading__desktop-label { display: none; }
  .section-heading__mobile-label { display: inline; }
  .card-select { position: relative; display: grid; gap: var(--space-2); margin-bottom: var(--space-5); }
  .card-select__label { display: block; color: var(--color-gray-700); font-size: 13px; line-height: 1.4; }
  .card-select__trigger { position: relative; display: flex; width: 100%; min-height: 86px; align-items: center; padding: var(--space-4) 44px var(--space-4) 20px; border: 0; border-radius: var(--radius-panel); color: var(--color-blue-700); background: var(--color-blue-card); text-align: left; }
  .card-select__value { display: grid; gap: var(--space-2); min-width: 0; font-size: 15px; line-height: 1.4; }
  .card-select__value strong { font: 400 18px/1.4 var(--font-medium); }
  .card-select__trigger img { position: absolute; top: 40px; right: 20px; width: 10px; height: 10px; pointer-events: none; transition: transform var(--duration-normal); transform: rotate(180deg); }
  .card-select__trigger[aria-expanded="true"] img { transform: rotate(0); }
  .card-select__trigger:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 0; }
  .groups-grid.card-select__options { position: absolute; z-index: 2; top: calc(100% + var(--space-2)); right: 0; left: 0; display: none; grid-template-columns: minmax(0, 1fr); margin: 0; padding: var(--space-2) 10px var(--space-2) var(--space-2); overflow: hidden; border: 1px solid var(--color-border-soft); border-radius: var(--radius-panel); background: var(--color-white); box-shadow: var(--shadow-dropdown); }
  .groups-grid.card-select__options.is-open { display: grid; }
  .card-select__scroll { display: grid; max-height: 344px; grid-template-columns: minmax(0, 1fr); gap: var(--space-1); padding-right: 10px; overflow-y: auto; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin; }
  .card-select__scroll::-webkit-scrollbar { width: var(--space-1); }
  .card-select__scroll::-webkit-scrollbar-track { background: var(--color-scrollbar-track); }
  .card-select__scroll::-webkit-scrollbar-thumb { border-radius: var(--radius-select); background: var(--color-blue-500); }
  .card-select__options .card--group { min-height: initial; padding: var(--space-2); border-radius: var(--radius-control); color: var(--color-blue-700); background: transparent; }
  .card-select__options .card--group:hover,
  .card-select__options .card--group:focus-visible { color: var(--color-white); background: var(--color-blue-500); }
  .card-select__options .card--group:hover .card__description,
  .card-select__options .card--group:focus-visible .card__description, .card-select__options .card--group[aria-selected="true"] .card__description{ color: var(--color-white); }
  .card-select__options .card--group[aria-selected="true"] { color: var(--color-white); background: var(--color-blue-700); }
  .card-select__options .card__content { gap: var(--space-1); }
  .card-select__options .card__title { font: 400 15px/1.4 var(--font-medium); }
  .card-select__options .card__title::before { content: "Рабочая группа "; }
  .card-select__options .card__description { color: var(--color-gray-700); font-size: 13px; line-height: 1.4; }
  .card-select__options .card__media { display: none; }
  .table-section { gap: var(--space-2); }
  .table-section > h3 { display: none; }
  .data-table--meetings { gap: var(--space-2); }
  .data-table__row--header { display: none; }
  .data-table__row--meetings[data-more-item] { display: none; }
  .data-table__row--meetings[data-more-item].is-visible { display: grid; }
  .data-table__row--meetings { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name status" "date date" "purpose purpose"; gap: 14px var(--space-4); min-height: 0; padding: 17px 20px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-panel); background: var(--color-white); box-shadow: var(--shadow-card); font-size: 15px; line-height: 1.4; }
  .data-table__row--meetings > .data-table__cell--name { grid-area: name; align-self: center; font: 400 18px/1.4 var(--font-medium); }
  .data-table__cell--date { grid-area: date; }
  .data-table__cell--purpose { grid-area: purpose; }
  .data-table__cell--status { grid-area: status; }
  .data-table__cell--date, .data-table__cell--purpose { display: grid; gap: var(--space-1); }
  .data-table__cell--date::before, .data-table__cell--purpose::before { color: var(--color-gray-700); content: attr(data-label); font-size: 13px; line-height: 1.4; }
  .data-table--meetings .status { min-width: 0;font-size: 13px;line-height: 140%; }
  .table-section > .show-more { display: flex; }
  .table-section > .show-more[hidden] { display: none; }
  .activity-feed__heading { margin-bottom: var(--space-7); }
  .activity-feed__badge { width: 24px; height: 24px; font-size: 13px; }
  .activity-feed { display: grid; gap: var(--space-2); }
  .activity-feed__item { display: grid; grid-template-columns: 1fr; gap: 14px; padding: 20px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-panel); box-shadow: var(--shadow-card); font-size: 15px; line-height: 1.4; }
  .activity-feed__item time { color: var(--color-gray-700); font-size: 13px; }
  .activity-feed__details { display: inline; font-size: 13px;font-family: var(--font-medium); }
  .activity-feed__item--extra { display: none; }
  .activity-feed__item--extra.is-visible { display: grid; }
  .show-more--activity { display: flex; margin-top: var(--space-5); }
    .activity-feed__item p>a {
        color: #111111;
    }
    .dashboard-section .section-heading__link {
        transform: none;
    }
    .work-groups-page .close-button{
        top: 18px;
        right: 12px;
    }
    .meeting-view__title .status{
        min-width: 76px;
        min-height: 30px;
        font: 400 13px / 1.4 var(--font-regular);
    }
}

/* Home page: compact mobile section spacing. */
@media (max-width: 767px) {
  .meeting-view__title .status { order: -1; }
  .meeting-view > .back-link > span:last-child { font-size: 0; }
  .meeting-view > .back-link > span:last-child::after { content: "Назад"; font-size: 13px; }
  .dashboard-section--groups { padding-bottom: var(--space-7); }
}

/* Home page: narrow mobile gutters. */
@media (max-width: 389px) {
  .dashboard-section { padding-inline: var(--space-4); }
}


/* Authentication page: login and password recovery. */
/* Authentication page: page background and viewport layout. */
.auth-page {
  min-width: 320px;
  background: var(--color-blue-700) url("/local/templates/main/images/auth-bg.jpg") center / cover no-repeat;
}

.auth {
  display: grid;
  min-height: 100vh;
  min-height: 100svh;
  place-items: center;
  padding: var(--space-8) var(--space-4);
}

/* Authentication page: form card and brand logo. */
.auth__card {
  display: flex;
  width: min(648px, 100%);
  height: 740px;
  flex-direction: column;
  padding: var(--space-8);
  overflow: hidden;
  background: var(--color-white);
}

.auth__logo {
  display: block;
  width: 210px;
  height: 38px;
  flex: 0 0 auto;
}

/* Authentication page: content and form views. */
.auth__content {
  margin-top: var(--space-8);
}

.auth__form {
  display: flex;
  flex-direction: column;
}

.auth__form[hidden] {
  display: none;
}

.table-section[hidden] {
  display: none;
}

.auth__title {
  margin: 0;
}

/* Authentication page: server-side error message. */
.auth__server-error {
  margin-top: var(--space-4);
  color: var(--color-error);
  font-size: var(--font-caption);
  line-height: var(--line-body);
}

/* Authentication page: input fields. */
.auth__fields {
  display: grid;
  gap: var(--space-6);
  margin-top: var(--space-8);
}

.auth .field {
  width: 100%;
  padding: 0;
}

/* Authentication page: action links and focus states. */
.auth__link:focus-visible,
.auth__support a:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: var(--space-1);
}

.auth__link {
  width: fit-content;
  padding: 0;
  border: 0;
  color: var(--color-blue-500);
  background: transparent;
  font: 400 var(--font-small)/var(--line-body) var(--font-medium);
}

.auth__link:hover,
.auth__support a:hover {
  color: var(--color-blue-700);
}

/* Authentication page: primary submit action. */
.auth__submit {
  margin-top: var(--space-8);
  align-self: flex-start;
}

/* Authentication page: support contact. */
.auth__support {
  margin-top: auto;
  font-size: var(--font-small);
  line-height: var(--line-body);
}

.auth__support a {
  color: var(--color-blue-500);
  font-family: var(--font-medium);
  text-decoration: none;
}

.auth__support-break {
  display: none;
}

/* Authentication page: recovery and success headings. */
.auth__heading {
  display: grid;
  gap: var(--space-4);
}

.auth__heading p {
  font-size: var(--font-small);
  line-height: var(--line-body);
}

/* Authentication page: recovery form actions. */
.auth__form--recovery .field {
  margin-top: var(--space-8);
}

.auth__actions {
  display: flex;
  align-items: center;
  gap: var(--space-7);
  margin-top: var(--space-8);
}

.auth__form--success .auth__link {
  margin-top: var(--space-8);
}

/* Authentication page: mobile layout. */
@media (max-width: 767px) {
  .auth-page {
    background: var(--color-blue-700) url("/local/templates/main/images/auth-bg-390.jpg") top right / cover no-repeat;
  }

  .auth-page::before {
    position: fixed;
    inset: 0;
    content: "";
    pointer-events: none;
    background: linear-gradient(180deg, transparent 35%, var(--color-blue-700) 60%);
  }

  .auth {
    position: relative;
    place-items: start center;
    padding: 131px var(--space-4) 130px;
  }

  .auth__card {
    width: min(358px, 100%);
    height: 583px;
    padding: var(--space-5);
  }

  .auth__logo {
    width: 149px;
    height: 26px;
  }

  .auth__content {
    margin-top: var(--space-7);
  }

  .auth__title {
    line-height: var(--line-mobile);
  }

  .auth__fields {
    gap: var(--space-5);
    margin-top: var(--space-7);
  }

  .auth__link {
    font-size: var(--font-body);
    line-height: var(--line-mobile);
  }

  .auth__submit {
    width: 100%;
    margin-top: var(--space-7);
  }

  .auth__support {
    line-height: var(--line-mobile);
  }

  .auth__support-break {
    display: block;
  }

  .auth__heading p {
    font-size: var(--font-small);
    line-height: var(--line-mobile);
  }

  .auth__form--recovery .field {
    margin-top: var(--space-7);
  }

  .auth__actions {
    display: grid;
    gap: var(--space-5);
    margin-top: var(--space-7);
  }

  .auth__recovery-submit {
    width: 100%;
  }

  .auth__form--success .auth__link {
    margin-top: var(--space-4);
  }
}

/* Authentication page: narrow mobile gutters. */
@media (max-width: 389px) {
  .auth {
    padding-inline: var(--space-4);
  }
}

/* Close button: shared cross control. */
.close-button { display: inline-flex; width: var(--space-5); height: var(--space-5); flex: 0 0 var(--space-5); align-items: center; justify-content: center; padding: 0; border: 0; color: var(--color-blue-700); background: transparent; cursor: pointer; }
.close-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.close-button:focus-visible { outline: 2px solid var(--color-focus); outline-offset: var(--space-1); }

/* Modal: overlay, dialog, content and open state. */
.modal { position: fixed; z-index: 1000; inset: 0; display: grid; align-items: center; justify-items: center; padding: var(--space-6); visibility: hidden; }
.modal[hidden] { display: none; }
.modal__overlay { position: absolute; z-index: 0; inset: 0; background: var(--color-blue-700); opacity: 0; transition: opacity var(--duration-normal) var(--ease-standard); }
.modal__dialog { position: relative; z-index: 1; width: min(100%, 755px); max-height: calc(100dvh - (var(--space-6) * 2)); padding: 56px 48px; overflow-y: auto; background: var(--color-white); opacity: 0; outline: 0; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin; transform: translateY(var(--space-3)) scale(.98); transition: opacity var(--duration-normal) var(--ease-standard), transform var(--duration-normal) var(--ease-standard); }
.modal__dialog::-webkit-scrollbar { width: var(--space-1); }
.modal__dialog::-webkit-scrollbar-track { background: var(--color-scrollbar-track); }
.modal__dialog::-webkit-scrollbar-thumb { border-radius: var(--radius-select); background: var(--color-blue-500); }
.modal__close { position: absolute; top: var(--space-5); right: var(--space-5); width: var(--space-6); height: var(--space-6); }
.modal__title { max-width: calc(100% - var(--space-7)); margin: 0; color: var(--color-black); font: 400 var(--font-h3)/var(--line-heading) var(--font-medium); }
.modal__content { margin-top: var(--space-7); }
.modal__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-7); }
.modal.is-open { visibility: visible; }
.modal.is-open .modal__overlay { opacity: .2; }
.modal.is-open .modal__dialog { opacity: 1; transform: none; }
.modal__dialog .button{
    min-width: initial;
}

/* Modal: mobile layout. */
@media (max-width: 767px) {
  .modal { padding: var(--space-4); }
  .modal__dialog { max-height: calc(100dvh - (var(--space-4) * 2)); padding: var(--space-7) var(--space-5) var(--space-5); }
  .modal__close { top: var(--space-4); right: var(--space-4); width: var(--space-7); height: var(--space-7); }
  .modal__title { font-size: 20px; }
  .modal__content { margin-top: var(--space-6);font-size: 15px; }
  .modal__actions { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); margin-top: var(--space-6); }
  .modal__actions .button { width: 100%; }

}

/* Modal: reduced-motion accessibility. */
@media (prefers-reduced-motion: reduce) {
  .modal__overlay,
  .modal__dialog { transition: none; }
}

/* Action links: text/icon actions and interaction states. */
.action-link { display: inline-flex; align-items: center; gap: 12px; border: 0; padding: 0; color: var(--color-blue-500); background: transparent; font-size: 18px; line-height: 1; text-decoration: none; }
.action-link img { width: 24px; height: 24px; }
.action-link:hover, .action-link.is-hover { color: var(--color-blue-700); }
.action-link:focus-visible, .action-link.is-focus { outline: 2px solid var(--color-focus); outline-offset: 4px; background: var(--color-blue-100); }
.action-link.is-disabled, .action-link:disabled { color: var(--color-gray-400); pointer-events: none; }
.action-link--small { font-size: 13px; line-height: 1.4; }
.action-link--small img { width: 20px; height: 20px; }

/* Form fields: inputs, floating labels and validation states. */
.field { position: relative; display: grid; gap: 4px; width: min(100%, 357px); padding: 2px 0; }
.field__label { min-height: 19px; color: var(--color-gray-400); font-size: 12px; line-height: 1.6; }
.field__label--hidden { opacity: 0; }
.required { color: var(--color-blue-700); }
.field__control { width: 100%; min-height: 35px; padding: 0 0 8px; border: 0; border-bottom: 1px solid var(--color-gray-400); border-radius: 0; color: var(--color-black); background: transparent; font-size: 18px; line-height: 1.2; outline: 0; }
.field__control::placeholder { color: var(--color-black); opacity: 1; }
.field--floating { position: relative; gap: var(--space-1); padding: 0; }
.field--floating .field__control { min-height: 49px; padding: 20px 0 var(--space-2); }
.field--floating .field__control::placeholder { color: transparent; }
.field--floating .field__label { position: absolute; z-index: 1; top: 29px; left: 0; min-height: 0; color: var(--color-gray-700); font-size: 18px; line-height: 1.2; pointer-events: none; transform: translateY(-50%); transform-origin: left top; transition: top var(--duration-normal) var(--ease-standard), color var(--duration-normal) var(--ease-standard), font-size var(--duration-normal) var(--ease-standard), transform var(--duration-normal) var(--ease-standard); }
.field--floating .field__control:focus + .field__label,
.field--floating .field__control:not(:placeholder-shown) + .field__label,
.field--floating .field__control:-webkit-autofill + .field__label,
.field--floating.is-active .field__label,
.field--floating.is-focus .field__label { top: 2px; color: var(--color-gray-400); font-size: var(--font-caption); transform: none; }
.field--floating textarea.field__control { min-height: 96px; padding-top: 26px; }
.field--floating textarea.field__control + .field__label { top: 20px; }
.field--floating textarea.field__control:focus + .field__label,
.field--floating textarea.field__control:not(:placeholder-shown) + .field__label,
.field--floating.is-active textarea.field__control + .field__label,
.field--floating.is-focus textarea.field__control + .field__label { top: var(--space-1); }
.field__control:hover, .field.is-hover .field__control { border-bottom-color: var(--color-blue-500); }
.field__control:focus, .field.is-active .field__control { border-bottom-color: var(--color-blue-500); }
.field:focus-within, .field.is-focus { outline: 2px solid #aac9ff; outline-offset: 4px; }
.field.is-error .field__control { color: var(--color-error); border-bottom-color: var(--color-error); }
.field__message { color: var(--color-error); font-size: 12px; line-height: 1.6; }
.field__control:disabled { color: var(--color-gray-400); border-bottom-color: var(--color-gray-200); }
textarea.field__control { min-height: 96px; padding: 8px 0; resize: vertical; }

/* Password field: input with a shared show/hide control. */
.password-control { position: relative; display: flex; }
.password-control .field__label { left: 0; }
.password-control__input { padding-right: var(--space-6); }
.password-control__toggle { position: absolute; right: 0; bottom: var(--space-2); display: grid; width: 24px; height: 24px; padding: 0; border: 0; place-items: center; background: transparent; }
.password-control__toggle img { width: 20px; height: 20px; }
.password-control__toggle[aria-label="Скрыть пароль"] img { opacity: .55; }
.password-control__toggle:focus-visible { outline: 2px solid var(--color-focus); outline-offset: var(--space-1); }

/* Profile forms: reusable content layout inside the universal modal. */
.profile-modal { max-height: calc(100vh - (var(--space-6) * 2)); max-height: calc(100dvh - (var(--space-6) * 2)); overflow-y: auto; }
.profile-form__fields { display: grid; gap: var(--space-7); }
.profile-form__name { color: var(--color-blue-700); }
.profile-form .field { width: 100%; max-width: none; }
.profile-form__password-link { margin-top: var(--space-7); }
.profile-form__actions { margin-top: var(--space-7); }

/* Choice controls: checkbox and radio. */
.choice { position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 32px; color: var(--color-black); font-size: 18px; }
.choice input { position: absolute; opacity: 0; }
.choice__mark { display: grid; width: 18px; height: 18px; flex: 0 0 18px; place-items: center; border: 1px solid var(--color-blue-500); background: #fff; }
.choice--radio .choice__mark { border-radius: 50%; }
.choice input:checked + .choice__mark { background: var(--color-blue-500); }
.choice input:checked + .choice__mark::after { content: url("data:image/svg+xml,%3Csvg width='12' height='11' viewBox='0 0 12 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.332031 5.78716L4.2606 9.3089L11.332 0.308899' stroke='white'/%3E%3C/svg%3E"); width: 12px; height: 11px;display: flex;align-items: center;justify-content: center;}
.choice--radio input:checked + .choice__mark::after { width: 8px; height: 8px; margin: 0; border: 0; border-radius: 50%; background: #fff; transform: none; }
.choice input:focus-visible + .choice__mark, .choice.is-focus .choice__mark { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.choice input:disabled + .choice__mark, .choice.is-disabled .choice__mark { border-color: var(--color-gray-400); background: var(--color-gray-200); }
.choice.is-error .choice__mark { border-color: var(--color-error); }

/* Select controls: native select and custom dropdown. */
.native-select { appearance: none; padding-right: 28px; background-image: linear-gradient(45deg, transparent 50%, var(--color-blue-700) 50%), linear-gradient(135deg, var(--color-blue-700) 50%, transparent 50%); background-position: calc(100% - 9px) 13px, calc(100% - 4px) 13px; background-size: 5px 5px; background-repeat: no-repeat; }
.select-demo { position: relative; width: min(100%, 420px); }
.meeting-form .select-demo{display: grid;width: 100%;}
.select-menu { display: grid; max-width: 100%; max-height: 190px; top:100%; padding: var(--space-2) 20px var(--space-2) var(--space-4); overflow: hidden; border: 1px solid var(--color-gray-100); border-radius: var(--radius-select); background: var(--color-white); box-shadow: var(--shadow-dropdown);position: absolute;z-index: 10;width: 100%; }
.select-menu__scroll { padding-right: 15px;display: grid; max-height: 174px; gap: var(--space-1); overflow-y: auto; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin; }
.select-menu__scroll::-webkit-scrollbar { width: var(--space-1); }
.select-menu__scroll::-webkit-scrollbar-track { background: var(--color-scrollbar-track); }
.select-menu__scroll::-webkit-scrollbar-thumb { border-radius: var(--radius-select); background: var(--color-blue-500); }
.select-menu[hidden] { display: none; }
.select-option { display: flex; align-items: center; gap: 8px; padding: 8px 0; color: var(--color-black); font-size: 15px; background: none; border: none;line-height: 140%; }
.select-option:hover, .select-option.is-hover, .select-option.is-selected { color: var(--color-blue-500); }
.select-option__checkbox { display: grid; width: 18px; height: 18px; flex: 0 0 18px; place-items: center; border: 1px solid var(--color-blue-500); background: #fff; }
.select-option.is-selected .select-option__checkbox { background: var(--color-blue-500); }
.select-option.is-selected .select-option__checkbox::after { content: url("data:image/svg+xml,%3Csvg width='12' height='11' viewBox='0 0 12 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.332031 5.78716L4.2606 9.3089L11.332 0.308899' stroke='white'/%3E%3C/svg%3E"); width: 12px; height: 11px;display: flex;align-items: center;justify-content: center;}
.select-option:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }

/* Reusable filter search with a floating label. */
.filter-search { display: flex; min-width: 0; align-items: center; gap: var(--space-2); color: var(--color-blue-500); }
.filter-search__submit { display: grid; width: 24px; height: 24px; flex: 0 0 24px; padding: 0; border: 0; place-items: center; color: inherit; background: transparent; cursor: pointer; }
.filter-search__submit svg { width: 24px; height: 24px; }
.filter-search__submit:focus-visible { outline: 2px solid var(--color-focus); outline-offset: var(--space-1); }
.filter-search__field { position: relative; display: block; width: 100%; min-width: 0; }
.filter-search input { width: 100%; min-width: 0; padding: var(--space-4) 0 0; border: 0; outline: 0; color: var(--color-black); background: transparent; font: 400 var(--font-body)/1.4 var(--font-regular); }
.filter-search input::-webkit-search-cancel-button { display: none; }
.filter-search input::placeholder { color: transparent; }
.filter-search__field label { position: absolute; top: 50%; left: 0; color: var(--color-gray-700); font-size: var(--font-body); line-height: 1.2; pointer-events: none; transform: translateY(-50%); transition: top var(--duration-normal) var(--ease-standard), color var(--duration-normal) var(--ease-standard), font-size var(--duration-normal) var(--ease-standard), transform var(--duration-normal) var(--ease-standard); }
.filter-search__field input:focus + label, .filter-search__field input:not(:placeholder-shown) + label { top: 0; color: var(--color-gray-400); font-size: var(--font-caption); transform: none; }
.filter-search__clear { position: absolute; top: 50%; right: 0; display: none; transform: translateY(-50%); }
.filter-search__clear[hidden] { display: none; }
.filter-search--large-label .filter-search__field label { font-size: 22px; }
@media (max-width: 1100px) {
  .filter-search__field { order: 1; }
  .filter-search input { font-size: 15px; }
  .filter-search__field label { font-size: 15px; }
  .filter-search__field input:focus + label, .filter-search__field input:not(:placeholder-shown) + label { font-size: var(--font-caption); }
  .filter-search__submit { order: 2; }
  .filter-search--large-label .filter-search__field label {
    font-size: 15px;
  }
}

/* Reusable standalone document link. */
.document-link { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--color-blue-500); text-decoration: none; }
.document-link svg { width: 20px; height: 24px; flex: 0 0 20px; }
.document-link:hover { color: var(--color-blue-700); }

/* Reusable email action link. */
.mail-link.button { width: 40px; min-width: 40px; min-height: 40px; padding: 0; color: var(--color-white); }
.mail-link.button:hover, .mail-link.button:active, .mail-link.button.is-hover, .mail-link.button.is-focus, .mail-link.button.is-active { color: var(--color-white); }
.mail-link.button svg { width: 18px; height: 18px; color: inherit; }
.mail-link.button svg path { stroke: currentColor; }

@media (max-width: 1100px) {
  .document-link { width: 100%; min-height: 82px; justify-content: space-between; padding: var(--space-4) 20px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-panel); }
  .document-link svg { margin-left: var(--space-4); order: 2; }
  .document-link span { min-width: 0; order: 1; font-size: 15px; }
  .mail-link.button { width: 24px; min-width: 24px; min-height: 24px; }
  .mail-link.button svg { width: 14px; height: 14px;flex: 0 0 14px; }
}

/* Tabs and style-guide icon tiles. */
.tabs { display: flex; flex-wrap: wrap; gap: 24px; }
[data-tab-panel][hidden] { display: none; }
.tab { padding: 0 0 6px; border: 0; border-bottom: 2px solid transparent; color: var(--color-blue-700); background: transparent; font: 400 18px/1.6 var(--font-medium); }
.tab:hover, .tab.is-hover { color: var(--color-blue-500); }
.tab.is-active, .tab[aria-selected="true"] { color: var(--color-blue-500); border-bottom-color: var(--color-blue-500); }
.tab:focus-visible, .tab.is-focus { outline: 2px solid var(--color-focus); outline-offset: 6px; }
@media (max-width: 1100px) {
  .tabs { max-width: 100%; flex-wrap: nowrap; padding-bottom: var(--space-3); overflow-x: auto; overflow-y: hidden; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin; }
  .tabs .tab { flex: 0 0 auto;font-size: 15px; }
  .tabs::-webkit-scrollbar { height: var(--space-1); }
  .tabs::-webkit-scrollbar-track { background: var(--color-scrollbar-track); }
  .tabs::-webkit-scrollbar-thumb { border-radius: var(--radius-select); background: var(--color-blue-500); }
}
.icon-tile { display: grid; min-height: 120px; place-items: center; padding: 16px; border: 1px solid var(--color-gray-100); }
.icon-tile img { width: 48px; height: 48px; }

/* Status badge. */
.status { display: inline-flex; min-width: 76px; width: fit-content; align-items: center; justify-content: center; justify-self: end; padding: 6px var(--space-3); border-radius: 24px; color: var(--color-status-text); background: var(--color-status-bg); font: 400 13px/1.4 var(--font-regular); }
.status--complete { color: var(--color-black); background: #0000001a; }

/* Breadcrumbs: shared hierarchy navigation and its mobile back action. */
.breadcrumbs { display: flex; align-items: center; gap: var(--space-2); padding: 48px var(--space-6); color: var(--color-gray-400); font-size: 14px; line-height: 1; }
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs_separator{width: 3px;height: 3px;flex-shrink: 0;background: #87C8DC;border-radius: 50%;}
/* Search results: page panel, query control and result tabs. */
.search-results { margin: 0 var(--space-6) var(--space-7); padding: var(--space-7); background: var(--color-white); }
.back-link { display: none; align-items: center; gap: var(--space-2); text-decoration: none; }
.back-link > span:first-child { display: grid; width: 20px; height: 20px; flex: 0 0 20px; place-items: center; border-radius: 50%; color: var(--color-blue-500); }
.search-results__form { position: relative; display: flex; width: min(100%, 1338px); margin-top: 40px; background: var(--color-blue-050); }
.search-results__field { position: relative; display: flex; width: 100%; min-width: 0; align-items: center; padding: var(--space-4) 0 var(--space-4) var(--space-6); }
.search-results__field input { width: 100%; min-width: 0; padding: var(--space-4) 0 0; border: 0; outline: 0; color: var(--color-black); background: transparent; font: 400 var(--font-h4)/1.4 var(--font-regular); }
.search-results__field input::-webkit-search-cancel-button { display: none; }
.search-results__field label { position: absolute; top: 50%; left: var(--space-6); color: var(--color-black); font-size: var(--font-h4); line-height: 1.2; pointer-events: none; transform: translateY(-50%); transition: top var(--duration-normal) var(--ease-standard), color var(--duration-normal) var(--ease-standard), font-size var(--duration-normal) var(--ease-standard), transform var(--duration-normal) var(--ease-standard); }
.search-results__field input:focus + label, .search-results__field input:not(:placeholder-shown) + label { top: var(--space-4); color: var(--color-gray-400); font-size: var(--font-caption); transform: none; }
.search-results__clear { width: var(--space-6); height: var(--space-6); flex: 0 0 var(--space-6); }
.search-results__clear[hidden] { display: none; }
.search-results__submit { display: grid; width: 84px; flex: 0 0 84px; padding: 0; border: 0; place-items: center; background: transparent; }
.search-results__submit img { width: 32px; height: 32px; }
.search-results__tabs { margin-top: var(--space-7); }
.search-results__tabs .tab { display: inline-flex; align-items: center; gap: var(--space-2); }
.search-results__tabs .tab span { color: var(--color-gray-400); font-family: var(--font-medium); }
.search-results__panel { width: min(100%, 1338px); margin-top: var(--space-7); }
.search-results__panel[hidden] { display: none; }
.search-results__field .close-button.search-results__clear{display: none!important;}
@media (min-width: 1100px) {
    .back-link {gap: var(--space-4);}
    .back-link > span:first-child{width: 26px;height: 26px;flex: 0 0 26px;}
    .back-link > span:first-child svg{width: 26px;height: 26px;}
}
/* Search meetings: desktop rows adapt to cards on mobile. */
.data-table--linked { display: grid; }
.data-table__row--linked, a.data-table__row--linked { display: grid; min-height: 74px; grid-template-columns: minmax(180px, .85fr) minmax(210px, .90fr) minmax(420px, 2fr) 140px; align-items: center; gap: var(--space-7); border-bottom: 1px solid rgb(0 0 0 / 7%); color: var(--color-black); text-decoration: none; }
.data-table__row--linked strong { color: var(--color-blue-500); font-family: var(--font-regular); font-weight: 400; }
.data-table__row--linked .status { min-width: 140px; }

/* Document results: shared desktop rows and mobile cards. */
.data-table--documents { display: grid; }
.data-table__header--documents, .data-table__row--documents { display: grid; grid-template-columns: minmax(520px, 2fr) minmax(180px, .55fr) minmax(260px, .85fr); align-items: center; gap: var(--space-7); }
.data-table__header--documents { min-height: 58px; color: var(--color-gray-700); font-size: var(--font-small); }
.data-table__row--documents { position: relative; min-height: 45px; border-bottom: 1px solid rgb(0 0 0 / 7%); color: var(--color-black); text-decoration: none; }
.document-item, .data-table__row--documents > a:nth-child(3) { color: var(--color-blue-500); text-decoration: none;}
.document-item { display: inline-flex; align-items: center; gap: 14px; overflow-wrap: anywhere; }
span.document-item{color: #111111;}
span.document-item span:has(svg){color: var(--color-blue-700);}
.document-item svg { width: 24px; height: 24px; flex: 0 0 24px; color: currentColor; }
.data-table__row--documents a{text-decoration: none;color: var(--color-blue-500)}
.data-table__row--documents a:hover{color: var(--color-blue-700)}

/* Pagination: shared circular navigation shown in search results. */
.pagination { display: flex; align-items: center; gap: var(--space-2); margin-top: var(--space-7); }
.pagination a, .pagination span { display: flex; width: 40px; height: 40px; place-items: center; border-radius: 50%; color: var(--color-black); background: var(--color-blue-050); text-decoration: none;align-items: center;justify-content: center; }
.pagination span { background: transparent; }
.pagination a.is-active { color: var(--color-white); background: var(--color-blue-500); }
.pagination .pagination__arrow { color: var(--color-blue-500); font-size: 28px; font-family: Arial, sans-serif; }

/* Search results: tablet and mobile layout from the 390px reference. */
@media (max-width: 1440px) {
    .data-table__row--documents, .data-table__row--linked {font-size: 16px;}
    .data-table__header--documents, .data-table__row--documents {
        grid-template-columns: minmax(520px, 2fr) minmax(160px, .55fr) minmax(235px, .85fr);
    }
    .data-table__row--linked, a.data-table__row--linked{
        grid-template-columns: 0.90fr .85fr 2fr 140px;
    }
}
@media (max-width: 1100px) {
  .breadcrumbs { display: none; }
  .search-results { margin: 0; padding: var(--space-7) var(--space-4) 72px; }
  .back-link, a.back-link { display: inline-flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-6); color: var(--color-blue-500); font: 400 13px/1.4 var(--font-medium); text-decoration: none; }
  .search-results__title { font-size: 28px; line-height: 1.2; }
  .search-results__form { width: 100%; margin-top: var(--space-5); }
  .search-results__field { padding: var(--space-3) 0 var(--space-3) var(--space-4); }
  .search-results__field input { font-size: 15px; }
  .search-results__field label { left: var(--space-4); font-size: 15px; }
  .search-results__field input:focus + label, .search-results__field input:not(:placeholder-shown) + label { top: var(--space-3); }
  .search-results__submit { width: 52px; flex-basis: 52px; }
  .search-results__submit img { width: 24px; height: 24px; }
  .search-results__tabs { gap: var(--space-5); margin-top: var(--space-5); }
  .search-results__tabs .tab { font-size: 15px; }
  .search-results__panel { width: 100%; margin-top: var(--space-5); }
  .data-table--linked, .data-table--documents { gap: var(--space-2); }
    .data-table__row--linked, a.data-table__row--linked { min-height: 0; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name status" "date date" "purpose purpose"; gap: 14px var(--space-4); padding: 20px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-panel); box-shadow: var(--shadow-card); font-size: 15px; line-height: 1.4; }
  .data-table__row--linked strong { grid-area: name; font-size: 18px; }
  .data-table__row--linked > span:nth-child(2) { grid-area: date; }
  .data-table__row--linked > span:nth-child(3) { grid-area: purpose; }
  .data-table__row--linked > span:nth-child(2), .data-table__row--linked > span:nth-child(3) { display: grid; gap: var(--space-1); }
  .data-table__row--linked > span:nth-child(2)::before, .data-table__row--linked > span:nth-child(3)::before, .data-table__row--documents > span:nth-child(2)::before, .data-table__row--documents > a:nth-child(3)::before { color: var(--color-gray-700); content: attr(data-label); font-size: 13px; }
  .data-table__row--linked .status { min-width: 0; grid-area: status; }
  .data-table__row--linked:nth-child(n + 9), .data-table__row--documents:nth-child(n + 10) { display: none; }
  .data-table__header--documents { display: none; }
  .data-table__row--documents { min-height: 0; grid-template-columns: minmax(0, 1fr); grid-template-areas: "name" "date" "source"; gap: 14px; padding: 20px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-panel); box-shadow: var(--shadow-card); font-size: 15px; line-height: 1.4; }
  .data-table__row--documents .document-item { grid-area: name; align-items: flex-start; padding: 0; font-family: var(--font-regular); }
  .data-table__row--documents .document-item span { min-width: 0; order: 1; }
  .data-table__row--documents .document-item svg { margin-left: auto; order: 2; }
  .data-table__row--documents > span:nth-child(2) { display: grid; grid-area: date; gap: var(--space-1); color: var(--color-black); }
  .data-table__row--documents > a:nth-child(3) { display: grid; grid-area: source; gap: var(--space-1); }
  .search-results .pagination { display: none; }
    .select-demo,.field {
        width: 100%;
    }
    .field__control, .field--floating .field__label, .choice, .select-option { font-size: 15px; line-height: 1.4; }
    .action-link {font-size: 13px;line-height: 1.4;}
    .data-table__row--linked strong,.data-table__row--linked > span:nth-child(2), .data-table__row--linked > span:nth-child(3) { font-size: 15px; }
}

/* Search results: narrow mobile sizing. */
@media (max-width: 389px) {
  .search-results { padding-inline: var(--space-4); }
  .search-results__tabs { gap: var(--space-4); }
}

/* Shared components: mobile sizes and layout. */
@media (max-width: 767px) {
  .button { min-width: 0; min-height: 42px; padding-inline: 12px; font-size: 13px; line-height: 1.4; }
  .action-link { font-size: 13px; line-height: 1.4; }
  .action-link img { width: 20px; height: 20px; }
  .field__control, .field--floating .field__label, .choice, .select-option { font-size: 15px; line-height: 1.4; }
  .select-demo, .field { width: 100%; }
  .card--group { width: 100%; }

  /* Profile forms: compact layout for modal content. */
  .profile-modal { max-height: calc(100vh - (var(--space-4) * 2)); max-height: calc(100dvh - (var(--space-4) * 2)); }
  .profile-form__fields { gap: var(--space-5); }
  .profile-form__password-link { margin-top: var(--space-5); }
    .select-option{
        padding: 5px 0;
    }
}

/* Work groups page: desktop content/sidebar layout. */
.back-link--page { margin: 0 var(--space-4) var(--space-5); }
.work-groups-page__layout { display: grid; grid-template-columns: minmax(0, 1fr) 435px; align-items: start; gap: var(--space-7); padding: 0 var(--space-6) var(--space-7); }
.detail-panel { min-width: 0; padding: var(--space-7); background: var(--color-white); }
.detail-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-7); }
.table-section--spaced > h2 { color: var(--color-blue-700); }
.detail-heading__action { min-height: 58px; flex: 0 0 auto; padding: 0 29px; }
.detail-heading__action .button__icon { color: currentColor; }
.work-groups-page__select { margin-bottom: var(--space-6); }
.work-groups-page__select .groups-grid { gap: var(--space-2); margin-bottom: 0; }
.work-groups-page__select .card--group { min-height: 150px; }
.responsibility-trigger { display: none; }
.table-section--spaced { gap: var(--space-7); }
.table-section--spaced .data-table__row--meetings { grid-template-columns: minmax(160px, .8fr) minmax(190px, .95fr) minmax(380px, 2fr) 170px; gap: var(--space-6); }
.table-section--spaced .status--complete { color: var(--color-black); background: var(--color-gray-200); }
@media (max-width: 1100px) {
    .work-groups-page__select .card--group{
        min-height: initial;
    }
}
/* Work group responsibility: desktop sidebar and mobile bottom panel. */
.responsibility-panel { min-width: 0;position:sticky;top:100px;right:0; }
.responsibility-panel__overlay, .responsibility__close { display: none; }
.responsibility { padding: var(--space-7); background: var(--color-white); }
.responsibility__title { font: 400 var(--font-body)/1.4 var(--font-medium); }
.responsibility__list { margin: var(--space-7) 0 0; }
.responsibility__list div { display: grid; min-height: 56px; grid-template-columns: 32px minmax(0, 1fr); align-items: center; gap: var(--space-4); border-bottom: 1px solid rgb(0 0 0 / 10%); }
.responsibility__list div:last-child { border-bottom: 0; }
.responsibility__list dt { color: var(--color-blue-700); font-family: var(--font-medium); }
.responsibility__list dd { margin: 0; }

/* Work groups page: medium desktop cards. */
@media (max-width: 1625px) and (min-width: 1101px) {
  .work-groups-page__layout { grid-template-columns: minmax(0, 1fr) 330px; gap: var(--space-5); }
  .detail-panel { padding: var(--space-6); }
  .work-groups-page__select .groups-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-section--spaced .data-table__row--meetings { grid-template-columns: minmax(130px, .8fr) minmax(155px, .85fr) minmax(200px, 1.7fr) 110px; gap: var(--space-4); font-size: var(--font-small); }
  .table-section--spaced .data-table--meetings .status { min-width: 110px;font-size: 14px; }
  .table-section--spaced .data-table__row--meetings{font-size: var(--font-small-medium);}
  .responsibility__list{ font-size: var(--font-small);}
    .responsibility {
        padding: var(--space-6);
    }
}

/* Work groups page: mobile content, cards and responsibility panel. */
@media (max-width: 1100px) {
  .back-link--page { margin-top: var(--space-7); }
  .work-groups-page__layout { display: block; padding: 0; }
  .detail-panel { padding: 0 var(--space-4) 72px; }
  .detail-heading { display: grid; grid-template-columns: minmax(0, 1fr); justify-content: stretch; gap: var(--space-5); margin-bottom: var(--space-7); }
  .detail-heading__action { width: 100%; min-height: 42px; padding: 0 24px; }
  .work-groups-page__select { margin-bottom: var(--space-5); }
  .responsibility-trigger { display: inline-flex; width: 100%; margin-bottom: var(--space-5); }
  .table-section--spaced > h2 { display: none; }
  .table-section--spaced .data-table__row--meetings { grid-template-columns: minmax(0, 1fr) auto; gap: 14px var(--space-4); }
  .table-section--spaced .data-table__row--meetings:nth-child(n + 10) { display: none; }
  .pagination { display: flex; justify-content: space-between; max-width: 375px; margin-inline: auto; }
  .pagination a, .pagination span { width: 34px; height: 34px;font-size: 15px; }
  .responsibility-panel { position: fixed; z-index: 900; inset: 0; display: flex; visibility: hidden; align-items: flex-end; opacity: 0; pointer-events: none; transition: opacity var(--duration-normal) var(--ease-standard), visibility var(--duration-normal) var(--ease-standard); }
  .responsibility-panel.is-open { visibility: visible; opacity: 1; pointer-events: auto; }
  .responsibility-panel__overlay { position: absolute; display: block; inset: 0; padding: 0; border: 0; background: rgb(0 38 100 / 20%); }
  .responsibility { position: relative; width: 100%; max-height: calc(100dvh - 110px); padding: var(--space-5) 20px var(--space-7); overflow-y: auto; border-radius: var(--radius-panel) var(--radius-panel) 0 0; transform: translateY(20px); transition: transform var(--duration-normal) var(--ease-standard); }
  .responsibility-panel.is-open .responsibility { transform: none; }
  .responsibility__close { position: absolute; top: var(--space-5); right: 20px; display: inline-flex; width: var(--space-6); height: var(--space-6); }
  .responsibility__title { padding-right: var(--space-7); font-size: 18px; }
  .responsibility__list { margin-top: var(--space-5); }
  .responsibility__list div { min-height: 54px; }
}

/* Work groups page: narrow mobile gutters and pagination. */
@media (max-width: 389px) {
  .back-link--page { margin-inline: var(--space-3); }
  .detail-panel { padding-inline: var(--space-4); }
  .table-section--spaced .pagination a, .table-section--spaced .pagination span { width: 30px; height: 30px; font-size: 15px; }
}

/* Industry coordination committee: meetings and responsibility layout. */
.committee-page__layout { display: grid; grid-template-columns: minmax(0, 1fr) 440px; align-items: start; gap: var(--space-6); padding: 0 var(--space-6) var(--space-7); }
.table-section--compact { gap: 0; }
.table-section--compact .data-table__row--meetings { grid-template-columns: minmax(170px, .85fr) minmax(190px, .9fr) minmax(360px, 2fr) 140px; gap: var(--space-6); }
.table-section--compact .pagination { margin-top: var(--space-6); }
.responsibility-panel--compact .responsibility__list div { grid-template-columns: 24px minmax(0, 1fr); }
.responsibility-panel--compact .responsibility__title { line-height: 1.6; }

@media (max-width: 1575px) and (min-width: 1101px) {
  .committee-page__layout { grid-template-columns: minmax(0, 1fr) 330px; }
  .table-section--compact .data-table__row--meetings { grid-template-columns: minmax(130px, .8fr) minmax(155px, .85fr) minmax(165px, 1.7fr) 110px; gap: var(--space-4); font-size: var(--font-small); }
  .table-section--compact .status { min-width: 110px; }
}

@media (max-width: 1100px) {
  .committee-page__layout { display: block; padding: 0; }
  .committee-page .detail-heading h1 { max-width: 500px; }
  .table-section--compact .data-table--meetings { gap: var(--space-2); }
  .table-section--compact .data-table__row--meetings { grid-template-columns: minmax(0, 1fr) auto; gap: 14px var(--space-4); }
  .table-section--compact .data-table__row--meetings:nth-child(n + 10) { display: none; }
  .table-section--compact .pagination { justify-content: space-between; max-width: 375px; margin: var(--space-7) auto 0; }
  .responsibility-panel--compact .responsibility__title { line-height: 1.4; }
  .committee-page .back-to-top { display: none; }
  .button--primary svg{width: 20px;height: 20px;flex: 0 0 20px;}
}

@media (max-width: 389px) {
  .table-section--compact .pagination a, .table-section--compact .pagination span { width: 30px; height: 30px; font-size: 15px; }
}

/* Participants page: directory, filters and responsive participant rows. */
.participants-page__content { margin: 0 var(--space-6) var(--space-7); padding: var(--space-7); background: var(--color-white); }
.page-title { color: var(--color-blue-700); }
.participants-page__content > .document-link { margin-top: var(--space-8); }
.filter-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-7); margin-top: 50px; padding-bottom: var(--space-4); border-bottom: 1px solid var(--color-gray-400); }
.filter-select { position: relative; display: inline-flex; width: auto; align-items: center; gap: var(--space-2); color: var(--color-gray-700); white-space: nowrap; }
.select-trigger { display: inline-flex; align-items: center; justify-content: space-between; gap: var(--space-2); background-image: none; }
.select-trigger__arrow { width: 7px; height: 5px; flex: 0 0 7px; transition: transform var(--duration-normal) var(--ease-standard); }
.select-trigger[aria-expanded="true"] .select-trigger__arrow { transform: rotate(180deg); }
.filter-select .filter-select__trigger { width: auto; min-height: 0; justify-content: flex-start; padding: 0; border: 0; color: var(--color-blue-500); background: none; font: inherit; }
.filter-select__menu { position: absolute; z-index: 3; top: 100%; right: 0; width: max-content; min-width: 180px; max-width: min(420px, calc(100vw - (var(--space-4) * 2))); }
.filter-select__menu .select-option { text-align: left; white-space: normal; }
.data-table--directory { display: grid; margin-top: 50px; }
.data-table__header--directory { display: grid; min-height: 74px; grid-template-columns: 40px minmax(230px, 1fr) 180px minmax(240px, 1fr) minmax(250px, 1fr) minmax(220px, 1fr); align-items: center; gap: var(--space-4); color: var(--color-gray-700); font-size: var(--font-small); }
.data-table__header--directory > :first-child { grid-column: 1 / 3; }
.data-table__row--directory { display: grid; min-height: 104px; grid-template-columns: 40px minmax(230px, 1fr) 180px minmax(240px, 1fr) minmax(250px, 1fr) minmax(220px, 1fr); align-items: center; gap: var(--space-4); border-bottom: 1px solid rgb(0 0 0 / 7%); font-size: var(--font-small); line-height: 1.4; }
.data-table__cell--logo { display: flex; min-width: 0; min-height: 73px; align-items: center; justify-content: flex-end; }
.data-table__cell--logo img { width: 200px; height: 73px; object-fit: contain; object-position: right center; }
.pagination--responsive { margin-top: var(--space-7); }
@media (min-width: 1100px) {
    .filter-select .filter-select__trigger {max-width: 15vw;}
    .filter-select__trigger [data-select-value] {display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
}
@media (max-width: 1500px) and (min-width: 1101px) {
  .data-table__header--directory { grid-template-columns: 40px minmax(0, 1.2fr) 110px minmax(0, 1fr) minmax(0, 1fr) 220px; font-size: var(--font-small-medium); }
  .data-table__row--directory { grid-template-columns: 40px minmax(0, 1.2fr) 110px minmax(0, 1fr) minmax(0, 1fr) 220px; font-size: var(--font-small-medium); }
  .data-table__cell--logo img { width: 120px; }
}

@media (max-width: 1100px) {
  .notice--flush-mobile { padding: 0; }
  .participants-page__content { margin: 0; padding: 0 var(--space-4) 72px; }
  .page-title { font-size: 28px; line-height: 1.2; }
  .participants-page__content > .document-link { margin-top: var(--space-5); }
  .filter-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-4); margin-top: var(--space-5); padding: 0; border: 0; }
  .filter-toolbar > .filter-search { min-height: 68px; grid-column: 1 / -1; justify-content: space-between; padding: var(--space-3) 20px; background: var(--color-blue-050); }
  .filter-select { min-width: 0; font-size: 15px;gap: var(--space-2); }
  .filter-select .filter-select__trigger { min-width: 0; max-width: 100%; }
  .filter-select__trigger [data-select-value] { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .data-table--directory { margin-top: var(--space-7); }
  .data-table__header--directory { display: none; }
  .data-table__row--directory { min-height: 74px; grid-template-columns: minmax(0, 1fr) 24px; grid-template-rows: auto auto auto; gap: var(--space-1) var(--space-4); padding: var(--space-3) 0; font-size: 15px; }
  .data-table__row--directory:nth-child(n + 14) { display: none; }
  .data-table__row--directory > .mail-link { grid-column: 2; grid-row: 1 / 4; align-self: start; }
  .data-table__row--directory > .data-table__cell--name { grid-column: 1; grid-row: 2; }
  .data-table__row--directory > .data-table__cell--status { grid-column: 1; grid-row: 1; color: var(--color-gray-700); font-size: 13px; }
  .data-table__row--directory > .is-member { display: none; }
  .data-table__row--directory > .is-member + .data-table__cell--organization { grid-row: 2; }
  .data-table__row--directory:has(.is-member) .data-table__cell--name { grid-row: 1; }
  .data-table__row--directory > .data-table__cell--organization { grid-column: 1; grid-row: 3; color: var(--color-gray-700); font-size: 13px; }
  .data-table__row--directory > .data-table__cell--position { display: none; grid-column: 1; grid-row: 3; color: var(--color-gray-700); font-size: 13px; }
  .data-table__row--directory > .data-table__cell--status:not(.is-member) ~ .data-table__cell--position { display: block; }
  .data-table__row--directory > .data-table__cell--status:not(.is-member) ~ .data-table__cell--organization { display: none; }
  .data-table__row--directory > .data-table__cell--logo { display: none; }
  .pagination--responsive { justify-content: space-between; max-width: 375px; margin: var(--space-7) auto 0; }
}

@media (max-width: 767px) {
  .filter-toolbar { position: relative; }
  .filter-select {  width: 100%; }
  .filter-select__menu { right: auto; left: 0; width: calc(100vw - (var(--space-4) * 2)); min-width: 0; max-width: calc(100vw - (var(--space-4) * 2)); }
}

@media (max-width: 389px) {
  .participants-page__content { padding-inline: var(--space-4); }
  .pagination--responsive a, .pagination--responsive span { width: 30px; height: 30px; font-size: 15px; }
  .filter-toolbar{grid-template-columns: repeat(1, minmax(0, 1fr));}
  .filter-toolbar .filter-select{width: 100%;justify-content: space-between;}
}

/* Archive: reusable folder directory and document view. */
.archive-panel { margin: 0 var(--space-6) var(--space-7); padding: var(--space-7); background: var(--color-white); }
.archive-panel__back { display: none; }
.archive-panel__heading { display: flex; align-items: center; gap: var(--space-8); }
.archive-panel__heading .folder-create{min-height: 58px;}
.folder-create { min-width: 228px; }
.archive-tabs { margin-top: 64px; }
.folder-list { display: grid; max-width: 1335px; margin-top: 70px; }
.folder-list[hidden], .archive-folder[hidden], .archive-panel__heading[hidden], .archive-tabs[hidden], .archive-panel__back[hidden] { display: none; }
.folder-list__header, .folder-row { display: grid; grid-template-columns: 140px minmax(320px, 1fr) 170px 260px; align-items: center; gap: var(--space-5); }
.folder-list__header { min-height: 45px; color: var(--color-gray-700); font-size: 14px; }
.folder-row { min-height: 58px; border-bottom: 1px solid rgb(0 0 0 / 7%); color: var(--color-black); font-size: 16px; text-decoration: none; cursor: pointer; }
.folder-row:hover { color: var(--color-black); }
.folder-row:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 0; }
.folder-row__code, .folder-row__title, .folder-row__actions, .folder-row__actions .action-link { display: flex; align-items: center; }
.folder-row__code, .folder-row--compact .folder-row__title { gap: var(--space-4); color: var(--color-blue-500); }
a.folder-row.folder-row--compact:hover .folder-row__title {color: var(--color-blue-700);}
.folder-row__code, .folder-row__title { text-decoration: none; }
.folder-row:not(.folder-row--compact) .folder-row__title { color: var(--color-black); }
.folder-row__code svg, .folder-row--compact .folder-row__title svg { width: 24px; height: 24px; flex: 0 0 24px; }
.folder-row__count small { display: none; }
.folder-row__actions { justify-content: flex-end; gap: var(--space-6); }
.folder-row__actions .action-link { gap: var(--space-2); padding: 0; }
.folder-row__actions svg { width: 24px; height: 24px;flex-shrink: 0; }
.folder-list__header--compact, .folder-row--compact { grid-template-columns: minmax(320px, 1fr) 170px; }
.archive-pagination { margin-top: var(--space-7); }
.archive-folder h1 { margin: var(--space-8) 0 var(--space-8); }
.archive-documents { width: 100%; max-width: 1341px; }
.archive-folder__back { display: inline-flex; }
.archive-folder__back-mobile { display: none; }
.folder-dialog { width: min(100%, 910px); }
.folder-form { display: grid; gap: var(--space-5); }
.folder-form .field.field--floating { width: 100%; }

@media (max-width: 1100px) {
  .archive-panel { margin: 0; padding: var(--space-7) var(--space-4) 72px; }
  .archive-panel__back { display: inline-flex; margin-bottom: var(--space-5); }
  .archive-panel__heading { display: grid; gap: var(--space-5); }
  .folder-create { width: 100%; min-width: 0; }
  .archive-tabs { gap: var(--space-5); margin-top: var(--space-5); }
  .archive-tabs .tab { font-size: 15px; }
  .folder-list { gap: 0; margin-top: var(--space-5); }
  .folder-list__header { display: none; }
  .folder-row, .folder-row--compact { display: grid; min-height: 0; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "code code" "title title" "count count" "actions actions"; gap: var(--space-2) var(--space-4); padding: var(--space-4) 0; font-size: 15px; }
  .folder-row__code { grid-area: code; }
  .folder-row__title { grid-area: title; }
  .folder-row__count { display: flex; grid-area: count; gap: var(--space-1); color: var(--color-gray-400); font-size: 13px; }
  .folder-row__count small { display: inline; font-size: inherit; }
  .folder-row__actions { grid-area: actions; justify-content: space-between; margin-top: var(--space-2); }
  .folder-row--compact .folder-row__title { grid-area: code; }
  .folder-row--compact .folder-row__count { grid-area: count; }
  .archive-pagination { justify-content: space-between; margin-top: var(--space-7); }
  .archive-folder h1 { margin: 0 0 var(--space-7); }
  .archive-folder__back { margin-bottom: var(--space-5); }
  .archive-folder__back-desktop { display: none; }
  .archive-folder__back-mobile { display: inline; }
  .archive-documents { gap: var(--space-2); }
  .archive-documents .data-table__row--documents { display: grid; }
  .folder-dialog { width: min(100%, 910px); padding: var(--space-5) 20px; }
  .folder-dialog .modal__actions { display: grid; grid-template-columns: 1fr; }
  .folder-dialog .button { width: 100%; }
  .archive-panel__heading .folder-create{min-height: 42px;}
  .folder-row__actions svg {width: 20px;height: 20px;}
  .folder-row__code svg, .folder-row--compact .folder-row__title svg {width: 20px;height: 20px;flex: 0 0 20px;}
}

/* Meeting content: shared view, editable form sections and responsive data lists. */
.content-panel { margin: 0 var(--space-6) 48px; padding: var(--space-7); background: var(--color-white); }
.meeting-view { display: grid; max-width: none; gap: 48px; }
.meeting-view > .back-link { display: inline-flex; width: fit-content; }
.meeting-view__header { display: grid; gap: var(--space-6); }
.meeting-view__title, .meeting-view__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-7); }
.meeting-view__title .status { justify-self: auto; }
.meeting-page[data-meeting-role="participant"] .meeting-view__admin-only { display: none; }
.status-message { display: flex; max-width: var(--container-content); gap: var(--space-4); }
.status-message--error { color: var(--color-error); font-family: var(--font-medium);}
.status-message strong { font-family: var(--font-medium); }
.content-section__action { width: fit-content; justify-self: start; }
.content-section--mobile-protocol { display: none; }
.content-section { display: grid; width: min(100%, var(--container-content)); gap: var(--space-5); }
.section-title { display: flex; align-items: center; gap: var(--space-3); color: var(--color-blue-700); font: 400 22px/1.2 var(--font-medium); }
.section-title > span { display: inline-grid; place-items: center; }
.section-title > span svg {width: 32px;height: 32px;flex: 0 0 32px;}
.content-section__hint { margin-top: var(--space-3); color: var(--color-gray-400); font-size: 13px; }
[data-scroll-hint][hidden] { display: none; }
.details-list { display: grid; max-width: var(--container-content); }
.details-list > div { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: var(--space-5); padding: var(--space-3) 0; border-bottom: 1px solid var(--color-border-soft); }
.details-list dt, .details-list dd { min-width: 0; }
.data-table--people { max-width: var(--container-content); max-height: 330px; padding-right: 20px; overflow-y: auto; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin; }
.data-table--people::-webkit-scrollbar { width: var(--space-1); }
.data-table--people::-webkit-scrollbar-track { background: var(--color-scrollbar-track); }
.data-table--people::-webkit-scrollbar-thumb { border-radius: var(--radius-select); background: var(--color-blue-500); }
.data-table__header--people, .data-table__row--people { display: grid; grid-template-columns: minmax(210px, 1.5fr) minmax(160px, 1fr) minmax(180px, 1fr) minmax(130px, .8fr) 48px; align-items: center; gap: var(--space-5); }
.data-table__header--people { min-height: 44px; color: var(--color-gray-700); font-size: 14px; }
.data-table__row--people { min-height: 56px; border-bottom: 1px solid var(--color-border-soft); }
.data-table__row--people .mail-link { justify-self: end; }
.data-table--files { --file-table-columns: minmax(360px, 1fr) minmax(140px, auto); max-width: var(--container-content); }
.data-table--files:has(.data-table__row--files > .action-link) { --file-table-columns: minmax(360px, 1fr) minmax(180px, 220px) minmax(110px, auto); }
.data-table__header--files, .data-table__row--files { display: grid; grid-template-columns: var(--file-table-columns); align-items: center; gap: var(--space-5); }
.data-table__header--files { min-height: 44px; color: var(--color-gray-700); font-size: 14px; }
.data-table__row--files { padding: var(--space-4) 0; border-bottom: 1px solid var(--color-border-soft); }
.file-drop { display: grid; min-height: 88px; place-items: center; align-content: center; gap: var(--space-1); border: 1px dashed var(--color-gray-400); color: var(--color-blue-700); text-align: center; cursor: pointer; }
.file-drop[hidden] { display: none; }
.file-drop input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.file-drop span.file-upload_wrap, .file-drop .file-upload_wrap { color: var(--color-blue-700);font-size: var(--font-body); }
.file-drop span.file-upload_wrap strong, .file-drop .file-upload_wrap strong{ color: var(--color-black); }
.file-drop span { color: var(--color-gray-400); font-size: 12px; }
.file-upload_wrap {display: flex;align-items: center;gap: var(--space-2);}
.file-upload { position: relative; }
.file-upload:focus-within { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.file-upload__list { display: grid; max-width: var(--container-content); }
.file-upload__file { display: grid; min-height: 52px; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-4); border-bottom: 1px solid var(--color-border-soft); }
.file-upload__name { overflow: hidden; color: var(--color-blue-500); text-overflow: ellipsis; white-space: nowrap; }
.file-upload__meta { color: var(--color-gray-700); font-size: 13px; white-space: nowrap; }
.file-upload__remove { gap: var(--space-2); }
.date-picker, .time-picker { position: relative; }
.date-picker .field__control { padding-right: 40px; }
.date-picker__toggle, .time-picker__toggle { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; color: var(--color-blue-700); cursor: pointer; }
.date-picker__toggle svg { position: absolute; right: 0; bottom: 12px; width: 24px; height: 24px; }
.date-picker__popup, .time-picker__menu { position: absolute; z-index: 20; top: calc(100% + var(--space-2)); right: 0; width: 320px; padding: var(--space-4); border: 1px solid var(--color-gray-200); background: var(--color-white);box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.14);border-radius: 4px; }
.date-picker__header { display: grid; grid-template-columns: 32px 1fr 32px; align-items: center; text-align: center; text-transform: capitalize;justify-content: space-between; width: 100%; }
.date-picker__header button, .date-picker__day, .time-picker__option { border: 0; background: transparent; cursor: pointer; }
.date-picker__header strong{font-weight: 400;font-size: 16px;line-height: 160%;color: #000000;}
.date-picker__weekdays, .date-picker__days { display: grid; grid-template-columns: repeat(7, 1fr); gap: var(--space-1); text-align: center; }
.date-picker__days{margin-top: var(--space-2);}
.date-picker__weekdays { margin-top: var(--space-5); color: var(--color-gray-400); font-size: 14px;font-family: 'Stem-Medium'; }
.date-picker__day { aspect-ratio: 1; border-radius: 50%; font-weight: 400; font-size: 16px; line-height: 160%;}
.date-picker__day:hover, .time-picker__option:hover { background: var(--color-blue-100); }
.date-picker__day.is-selected { background: var(--color-blue-500); color: var(--color-white); }
.time-picker__option.is-selected { background: var(--color-blue-500); color: var(--color-white); }
.date-picker__day.is-today:not(.is-selected) { border-bottom: 2px solid var(--color-blue-500); border-radius: 0; }
.date-picker__day.is-adjacent { color: var(--color-gray-400);font-weight: 400;font-size: 16px;line-height: 160%; }
.time-picker__menu{width: auto;overflow-x: hidden}
.time-picker__menu { display: grid; max-height: 240px; grid-template-columns: repeat(2, 1fr); gap: var(--space-1); overflow-y: auto; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin; }
.time-picker__menu::-webkit-scrollbar { width: var(--space-1); }
.time-picker__menu::-webkit-scrollbar-track { background: var(--color-scrollbar-track); }
.time-picker__menu::-webkit-scrollbar-thumb { border-radius: var(--radius-select); background: var(--color-blue-500); }
.date-picker__popup[hidden], .time-picker__menu[hidden] { display: none; }
.time-picker__option { padding: var(--space-2); color: var(--color-blue-700); }
.meeting-form { display: grid; gap: 48px; }
.meeting-form > .back-link { display: inline-flex; width: fit-content; margin-bottom: -24px; }
.meeting-form__grid { display: grid; max-width: var(--container-content); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.meeting-form__wide { grid-column: 1 / -1;width: 100%; }
.meeting-form .field { display: grid; min-width: 0; align-content: start; gap: var(--space-1);width:100%; }
.meeting-form .field__label { color: var(--color-gray-700); font-size: 13px; line-height: calc(var(--space-4) + var(--space-1)); }
.meeting-form .field__control { width: 100%; min-width: 0; min-height: 48px; padding: var(--space-3) 0; border: 0; border-bottom: 1px solid var(--color-gray-400); border-radius: 0; background-color: transparent;width: 100%; }
.meeting-form .field:not(.field--floating) .field__control { min-height: 35px; padding: 0 0 var(--space-2); }
.meeting-form .field--floating .field__control { min-height: 54px; padding: 24px 0 var(--space-2); }
.meeting-form .field--floating .field__control:focus + .field__label,
.meeting-form .field--floating .field__control:not(:placeholder-shown) + .field__label,
.meeting-form .field--floating .field__control:-webkit-autofill + .field__label { top: 0; }
.meeting-form__select { max-width: 500px; }
.meeting-form .content-section > .button { width: fit-content; }
.meeting-form__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.file-row{padding: var(--space-1) 0;}
.file-row, .selected-people > div { display: grid; max-width: var(--container-content); grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-4); border-bottom: 1px solid var(--color-border-soft);padding: var(--space-4) 0; }
.file-row .document-item { grid-area: auto; }
.document-name { display: inline-flex; min-width: 0; align-items: flex-start; gap: var(--space-2); }
.document-name svg { width: 24px; height: 24px; flex: 0 0 24px; color: var(--color-blue-700); }
.document-name > span { min-width: 0; overflow-wrap: anywhere; }
.document-name > span:has(svg){flex-shrink: 0}
.selected-people { display: grid; max-width: var(--container-content); max-height: 300px; padding-right: 20px; overflow-y: auto; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin;overflow-x: hidden; }

.selected-people__header { display: grid; max-width: var(--container-content); grid-template-columns: minmax(220px, 1fr) minmax(180px, 1fr) minmax(130px, auto); gap: var(--space-4); padding-right: 20px; color: var(--color-gray-700); font-size: 14px; }
.selected-people__header:not(:has(+ .selected-people > [data-participant-id])) { display: none; }
.selected-people > div { grid-template-columns: minmax(220px, 1fr) minmax(180px, 1fr) minmax(130px, auto);padding: var(--space-4) 0; }
.participant-picker { width: min(100%, 910px); }
.participant-picker__header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, .7fr); gap: var(--space-4); margin-top: var(--space-7); padding-right: var(--space-5); color: var(--color-gray-700); font-size: 14px; }
.participant-picker__list { display: grid; max-height: 40vh; overflow-y: auto; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: thin; margin-top: var(--space-3); }
.participant-picker__list .choice { display: grid; min-height: 61px; grid-template-columns: minmax(0, 1fr) minmax(150px, .7fr); align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--color-border-soft); }
.participant-picker__list .choice > .choice__mark { position: absolute; left: 0; }
.participant-picker__list .choice > span:nth-of-type(2) { padding-left: 32px; }
.participant-picker__list .choice[hidden] { display: none; }
.participant-picker__list small { color: var(--color-gray-700); }
.participant-picker__search { display: flex; min-height: 56px; align-items: center; padding: 0 var(--space-4); background: var(--color-canvas);margin-bottom: var(--space-6);width: 100%; }
.participant-picker__search.field--floating .field__label { left: var(--space-4); }
.participant-picker__search input { width: 100%; border: 0; outline: 0; background: transparent; font: inherit; }
.participant-picker__search img { width: 24px; height: 24px; }
.participant-picker__search input::-webkit-search-cancel-button,
.archive-folder-picker__search input::-webkit-search-cancel-button { display: none; appearance: none; }
.component-search__clear { display: none; width: 24px; height: 24px; flex: 0 0 24px; color: var(--color-blue-700); }
.component-search__clear[hidden] { display: none; }
.component-search__clear svg { width: 20px; height: 20px; }
.archive-folder-dialog { width: min(100%, 910px); padding: 50px 48px 60px; }
.archive-folder-dialog .modal__content { margin-top: 52px; }
.archive-folder-picker__search { display: flex; min-height: 65px; align-items: center; justify-content: space-between; padding: 0 var(--space-6); background: var(--color-canvas); gap: var(--space-3) }
.archive-folder-picker__search input { width: 100%; border: 0; outline: 0; background: transparent; font: inherit; }
.archive-folder-picker__search img { width: 28px; height: 28px; }
.archive-folder-picker__hint { display: none; }
.archive-folder-picker__table { margin-top: 50px; padding-right: 58px; overflow-y: auto; scrollbar-color: var(--color-blue-500) var(--color-scrollbar-track); scrollbar-width: 4px;max-height: 40vh; }
.archive-folder-picker__row { position: relative; display: grid; min-height: 61px; grid-template-columns: 28px 134px minmax(300px, 1fr) 148px; align-items: center; gap: var(--space-2); border-bottom: 1px solid var(--color-border-soft); cursor: pointer; }
.archive-folder-picker__row:hover{ background: #F2F4F7;}
.archive-folder-picker__row input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.archive-folder-picker__row svg { width: 24px; height: 24px; color: var(--color-blue-500); }
.archive-folder-picker__table > .data-table__header { grid-template-columns: 162px minmax(300px, 1fr) 148px; padding-left: var(--space-4); color: var(--color-gray-700); cursor: default; }
.archive-folder-picker__row:has(input:checked) { border-color: var(--color-blue-500); background: var(--color-blue-500); color: var(--color-white); }
.archive-folder-picker__row:has(input:checked) svg { color: var(--color-white); }
.archive-folder-picker__row.is-disabled { color: var(--color-gray-400); cursor: default; }
.archive-folder-picker__row.is-disabled svg { color: var(--color-gray-400); }
.archive-folder-picker__row[hidden] { display: none; }
.archive-folder-dialog .modal__actions { margin-top: 56px; }
.archive-message-dialog { width: min(100%, 910px); padding: 52px 48px 56px; }
.archive-message-dialog .modal__title { font-size: 32px; line-height: 1; }
.archive-message-dialog__content { margin-top: var(--space-7); }
.archive-message-dialog__code { margin-right: var(--space-2); color: var(--color-blue-500); }
.archive-message-dialog .modal__actions { margin-top: var(--space-7); }
.status-modal { display: block; }
.status-modal__heading { display: flex; align-items: center;  gap: var(--space-7); }
.status-modal__icon { width: 56px; height: 56px; flex: 0 0 56px; color: var(--color-success); }
.status-modal__folder { margin-top: 46px; }
.button__icon { width: 24px; height: 24px; flex: 0 0 24px; }
@media (max-width: 1100px) {
  .content-panel { margin: 0; padding: var(--space-7) var(--space-4) 72px; }
  .meeting-view { gap: var(--space-7); }
  .meeting-view > .back-link { margin-bottom: 0; }
  .meeting-view__title { align-items: flex-start; }
  .meeting-view__title, .meeting-view__actions {gap: var(--space-4);}
  .meeting-view__title .page-title { width: 100%; }
  .meeting-view__actions { display: grid; }
  .meeting-view__actions .button { width: 100%; }
  .content-section__action { width: 100%; justify-self: stretch; }
  .content-section { width: 100%; gap: var(--space-4); }
  .details-list > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
  .details-list dt { color: var(--color-gray-700); font-size: 13px; }
  .data-table__header--people, .data-table__header--files { display: none; }
  .data-table--people { max-height: 450px; padding-right: 20px; }
  .data-table__row--people { min-height: initial; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "role mail" "name mail" "position mail" "company mail"; align-items: start; gap: var(--space-1) var(--space-4); padding: var(--space-4) 0; line-height: 1.4; }
  .data-table__row--people > span:nth-child(1) { grid-area: name; font-family: var(--font-regular);font-size: 15px; }
  .data-table__row--people > span:nth-child(2) { grid-area: position; }
  .data-table__row--people > span:nth-child(3) { grid-area: company; }
  .data-table__row--people > span:nth-child(4) { grid-area: role; color: var(--color-gray-700); }
  .data-table__row--people > span[data-label="Роль"],.data-table__row--people > span[data-label="Должность"],.data-table__row--people > span[data-label="Организация"]{color: var(--color-gray-700); font-size: 13px;}
  .data-table__row--people .mail-link { grid-area: mail; align-self: start; }
  .data-table__row--files { grid-template-columns: minmax(0, 1fr); grid-template-areas: "document" "date"; gap: var(--space-2); padding: var(--space-4) 0; }
  .data-table__row--files:has(> .action-link) { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "document document" "date action"; }
  .data-table__row--files > span:not(.document-item)::before { display: block; color: var(--color-gray-700); content: attr(data-label); font-size: 13px; }
  .file-drop { padding: var(--space-4); }
  .date-picker__popup, .time-picker__menu { width: min(320px, calc(100vw - (var(--space-4) * 2))); }
  .file-upload__file { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name remove" "meta remove"; gap: var(--space-1) var(--space-3); padding: var(--space-3) 0; }
  .file-upload__name { grid-area: name; }
  .file-upload__meta { grid-area: meta; }
  .file-upload__remove { width: 24px; min-width: 24px; min-height: 24px; grid-area: remove; align-self: center; gap: 0; padding: 0; font-size: 0; }
  .file-upload__remove .button__icon { width: 24px; height: 24px; flex-basis: 24px; }
  .meeting-form { gap: var(--space-7); }
  .meeting-form > .back-link { margin-bottom: 0; }
  .meeting-form__grid { grid-template-columns: minmax(0, 1fr); }
  .meeting-form__wide { grid-column: auto; }
  .meeting-form .content-section > .button, .meeting-form__actions .button { width: 100%; }
  .meeting-form__actions { display: grid; }
  .selected-people > div{grid-template-columns: minmax(220px, 1fr) auto;}
  .selected-people > div > span:nth-child(3) { grid-column: 1; color: var(--color-gray-700); font-size: 13px; }
  .selected-people > div > .action-link { width: 24px; min-width: 24px; min-height: 24px; grid-column: 2; grid-row: 1 / 3; justify-content: center; gap: 0; padding: 0; font-size: 0; }
  .selected-people > div > .action-link .button__icon { width: 24px; height: 24px; flex-basis: 24px; }
  .meeting-form .file-row .action-link{ width: 24px; min-width: 24px; min-height: 24px; padding: 0; justify-content: center; font-size: 0;gap: 0; }
  .meeting-form .file-row .action-link .button__icon,
  .meeting-form .data-table--files .action-link .button__icon { width: 24px; height: 24px; flex-basis: 24px; }
  .participant-picker { width: calc(100% - (var(--space-4) * 2)); }
  .archive-folder-picker__table { display: grid; min-width: 0; }
  .archive-folder-dialog, .archive-message-dialog, .status-modal { padding: var(--space-7) var(--space-5) var(--space-5); }
  .archive-folder-dialog .modal__content { margin-top: var(--space-6); }
  .archive-folder-picker__search { min-height: 52px; padding-inline: var(--space-4); }
  .archive-folder-dialog .modal__actions, .archive-message-dialog .modal__actions { margin-top: var(--space-6); }
  .status-modal__heading { gap: var(--space-4);flex-wrap: wrap;}
  .status-modal__icon { width: 40px; height: 40px; flex-basis: 40px; }
  .status-modal__folder { margin-top: var(--space-6); }
  .meeting-view .data-table--files:not([hidden]),
  .meeting-form .content-section > .data-table--files { display: grid; gap: var(--space-2); }
  .meeting-view .data-table__row--files,
  .meeting-form .content-section > .data-table--files .data-table__row--files { min-height: 0; gap: var(--space-2) var(--space-3); padding: var(--space-4); border: 1px solid var(--color-gray-200); border-radius: var(--radius-control); box-shadow: var(--shadow-card);font-size: 15px; }
  .meeting-view .data-table__row--files .document-item,
  .meeting-form .content-section > .data-table--files .data-table__row--files .document-item { grid-area: document; }
  .meeting-view .data-table__row--files .document-item span,
  .meeting-form .content-section > .data-table--files .data-table__row--files .document-item span { min-width: 0; order: 1; }
  .meeting-view .data-table__row--files .document-item svg,
  .content-section > .data-table--files .data-table__row--files .document-item svg, .content-section > .data-table--files .data-table__row--files .document-item>span:has(svg) { margin-left: auto; order: 2;flex-shrink: 0; }
  .meeting-view .data-table__row--files > span,
  .meeting-form .content-section > .data-table--files .data-table__row--files > span { grid-area: date; }
  .meeting-view .data-table__row--files > .action-link,
  .meeting-form .content-section > .data-table--files .data-table__row--files > .action-link { grid-area: action; justify-self: end;margin-top: auto; }
  .meeting-view .data-table__row--files > span::before,
  .meeting-form .content-section > .data-table--files .data-table__row--files > span::before { margin-bottom: var(--space-1); }
  .details-list dt, .details-list dd{margin: 0;}
  .work-groups-page__select .card--group{
    min-height: initial;
  }
  .button__icon, .section-title > span svg { width: 24px; height: 24px; flex: 0 0 24px; }
  .button__icon, .section-title > span svg { width: 20px; height: 20px; flex: 0 0 20px; }
  .meeting-form__select, .select-menu { max-width: 100%; }
  .status-message {font-size: 13px;}
  .section-title{font-size: 18px;}
  .details-list dd {font-size: 15px;}
  .meeting-view__actions.meeting-view__admin-only .button {min-height: 42px;}
  .archive-folder-picker__row > span:nth-of-type(1), .archive-folder-picker__row > span:nth-of-type(2){font-size: 15px;}
  .document-item {font-size: 15px;align-items: start;}
}

@media (max-width: 767px) {
  .meeting-form > .page-title { max-width: 280px; font-size: 28px; }
  .meeting-form, .meeting-view { gap: var(--space-7); }
  .meeting-form__grid { gap: var(--space-5); }
  .meeting-form__grid .meeting-form__wide { margin-top: var(--space-3); }
  .meeting-form .content-section { gap: var(--space-4); }
  .meeting-form .section-title, .meeting-view .section-title { font-size: 18px; }
  .meeting-form .field__control { min-height: 44px; }
  .date-picker__toggle { width: 100%; height: 100%; }
  .date-picker__toggle svg { width: 24px; height: 24px; }
  .date-picker__popup { padding: var(--space-4); }
  .date-picker__day { min-height: 36px; }
  .file-drop { min-height: 112px; }
  .selected-people { max-height: 510px; padding-right: var(--space-4); }
  .selected-people > div { min-height: initial; }
  .participant-picker { max-height: calc(100dvh - (var(--space-4) * 2)); padding: var(--space-7) 20px var(--space-7);width: 100%; }
  .participant-picker .modal__content { margin-top: var(--space-5); }
  .participant-picker__list { max-height: 40vh; }
  .participant-picker__list .choice { min-height: 74px; align-content: center; }
  .participant-picker .modal__actions { gap: var(--space-2); }
  .archive-folder-dialog { width: 100%; padding: 24px 20px; }
  .archive-folder-dialog .modal__title { max-width: 65vw; font-size: 20px; line-height: 1.05; }
  .archive-folder-dialog .modal__content { margin-top: 26px; }
  .archive-folder-picker__search { min-height: 68px; padding-inline: 20px; }
  .archive-folder-picker__hint { display: block; margin-top: var(--space-5); color: var(--color-gray-700); font-size: 13px; }
  .archive-folder-picker__table { margin-top: var(--space-5); padding-right: 20px; }
  .archive-folder-picker__table > .data-table__header { display: none; }
  .archive-folder-picker__row { min-height: 112px; grid-template-columns: 28px minmax(0, 1fr); grid-template-areas: "icon code" "title title" "count count"; align-content: center; gap: var(--space-2); padding: var(--space-4); }
  .archive-folder-picker__row svg { grid-area: icon; width: 20px; height: 20px; }
  .archive-folder-picker__row > span:nth-of-type(1) { grid-area: code; }
  .archive-folder-picker__row > span:nth-of-type(2) { grid-area: title; }
  .archive-folder-picker__row > span:nth-of-type(3) { grid-area: count; color: var(--color-gray-400); font-size: 13px; }
  .archive-folder-picker__row > span:nth-of-type(3)::after { content: " документов"; }
  .archive-folder-picker__row:has(input:checked) > span:nth-of-type(3) { color: var(--color-blue-200); }
  .archive-folder-dialog .modal__actions { position: sticky; bottom: 0; margin-top: var(--space-5); padding-top: 0; background: var(--color-white); }
  .archive-message-dialog { width: 100%; padding: 24px 20px; }
  .archive-message-dialog .modal__title { max-width: 290px; font-size: 20px; line-height: 1.05; }
  .archive-message-dialog__content { margin-top: var(--space-5);font-size: 15px; }
  .archive-message-dialog .modal__actions { gap: var(--space-2); margin-top: var(--space-5); }
  .date-picker__header strong,.date-picker__day.is-adjacent, .date-picker__day{font-size: 15px;}
  .date-picker__weekdays{font-size: 13px;justify-content: space-between;width: 100%;}
  .date-picker__weekdays {margin-top: var(--space-3);}
  .status-modal__folder, .document-name, .selected-people{font-size: 15px;}
}
@media (max-width: 480px) {
    .date-picker__popup, .time-picker__menu {
        width: 100%;
    }
    .date-picker__day {
        min-height: initial;
    }
    .date-picker__popup {
        padding: var(--space-3) var(--space-2);
    }
}
@media (max-width: 389px) {
  .archive-panel { padding-inline: var(--space-3); }
  .archive-pagination a, .archive-pagination span { width: 30px; height: 30px; font-size: 15px; }
}

@media (max-width: 1099px) {
  .selected-people__header,
  .participant-picker__header { display: none; }
  .participant-picker__list .choice { grid-template-columns: 18px minmax(0, 1fr); gap: var(--space-1) 14px; }
  .participant-picker__list .choice > .choice__mark { position: static; grid-column: 1; align-self: start; }
  .participant-picker__list .choice > span:nth-of-type(2) { grid-column: 2; padding-left: 0; }
  .participant-picker__list .choice > small { grid-column: 2; padding-left: 0; }
}
