:root {
  --frame-max: 1440px;
  --page-max: 1280px;
  --page-gutter: 24px;
  --workspace-sidebar: 252px;

  --background-surface: #ffffff;
  --background-subtle: #f4f6f9;
  --background-page: #fafbfc;
  --background-staff-nav: #0b2c52;
  --nav-staff-active: #0d3b70;
  --text-primary: #0b1b31;
  --text-secondary: #607089;
  --text-muted: #aab6c5;
  --text-inverse: #ffffff;
  --border-default: #e7ecf2;
  --border-strong: #d8e0e9;
  --action-primary: #0b63ce;
  --action-primary-hover: #0f4e96;
  --action-primary-pressed: #0d3b70;
  --action-focus: #1677e8;
  --action-danger: #c73a3a;
  --action-danger-hover: #ad2f2f;
  --action-danger-pressed: #8e2525;
  --action-link: #0b63ce;
  --accent-teal: #207a73;
  --status-success-bg: #eaf7ef;
  --status-success-text: #166534;
  --status-warning-bg: #fff7e6;
  --status-warning-text: #854d0e;
  --status-error-bg: #fff0f0;
  --status-error-text: #c73a3a;
  --status-info-bg: #eaf3ff;
  --status-info-text: #0b63ce;
  --status-internal-bg: #f3eeff;
  --status-internal-text: #6e56cf;

  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;
  --radius-small: 8px;
  --radius-medium: 12px;
  --radius-large: 16px;
  --radius-pill: 999px;
  --shadow-card: 0 4px 16px rgba(10, 26, 51, 0.08);
  --shadow-floating: 0 12px 32px rgba(10, 26, 51, 0.12);

  /* Compatibility aliases for existing page components. */
  --ink: var(--text-primary);
  --muted: var(--text-secondary);
  --line: var(--border-default);
  --blue: var(--action-primary);
  --blue-dark: var(--action-primary-pressed);
  --blue-soft: var(--status-info-bg);
  --green: var(--accent-teal);
  --surface: var(--background-surface);
  --shadow: var(--shadow-floating);
}

/* Public desktop screens from Figma section 03. */
.layout-public .public-header__desktop,
.layout-public .public-main,
.public-footer {
  width: min(1280px, calc(100vw - 48px));
}

.layout-public .public-header__desktop {
  min-height: 146px;
}

.layout-public .public-header__topbar {
  height: 82px;
  padding-left: 0;
}

.layout-public .public-menu {
  height: 64px;
}

.layout-public .brand {
  width: 320px;
}

.layout-public .brand__logo {
  width: 266px;
  height: 60px;
}

.layout-public .public-header__utility,
.layout-public .public-menu {
  font-size: 15px;
}

.layout-public .public-header__cta {
  min-width: 160px;
  min-height: 48px;
}

.layout-public .accessibility-button {
  width: auto;
  flex-basis: auto;
  padding: 0;
  border: 0;
  white-space: nowrap;
}

.public-menu__search {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.public-menu__search img {
  width: 18px;
  height: 18px;
}

.public-home {
  display: grid;
  gap: 32px;
}

.public-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 500px;
  margin-top: 20px;
  overflow: hidden;
  border: 1px solid #dbe5f2;
  border-radius: 20px;
  background: #f6f9fd;
  box-shadow: 0 12px 30px rgba(13, 26, 46, 0.08);
}

.public-hero__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 48px 32px 32px 44px;
}

.public-hero .eyebrow {
  margin: 0 0 18px;
  font-size: 13px;
  line-height: 18px;
}

.public-hero h1 {
  max-width: 590px;
  margin-bottom: 18px;
  font-size: 48px;
  line-height: 56px;
}

.public-hero__lead {
  max-width: 550px;
  margin: 0 0 18px;
  font-size: 18px;
  line-height: 28px;
}

.public-hero .action-row {
  gap: 12px;
}

.public-hero .primary-btn {
  min-width: 220px;
  min-height: 48px;
}

.public-hero .secondary-btn {
  min-width: 150px;
  min-height: 48px;
}

.public-arrow-link {
  margin-top: auto;
  color: var(--action-link);
  font-size: 14px;
  font-weight: 600;
}

.public-hero__image {
  width: 100%;
  height: 500px;
  object-fit: cover;
}

.public-hero__media {
  display: block;
  height: 500px;
}

.official-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  min-height: 140px;
  padding: 22px 24px;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: var(--background-surface);
  box-shadow: 0 6px 18px rgba(13, 26, 46, 0.04);
}

.official-strip h2 {
  margin: 0 0 7px;
  font-size: 20px;
  line-height: 26px;
}

.official-strip__facts {
  display: flex;
  gap: 48px;
  margin: 0;
}

.official-strip__facts div {
  display: grid;
  gap: 3px;
}

.official-strip dt {
  color: var(--text-secondary);
  font-size: 12px;
}

.official-strip dd {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}

.public-home .public-section {
  margin: 0;
  padding: 34px 0;
}

.public-home .section-title {
  margin-bottom: 18px;
}

.public-home .section-title h2,
.public-page-head h1 {
  font-size: 30px;
  line-height: 36px;
}

.public-home .section-title p {
  margin: 4px 0 0;
  font-size: 14px;
}

.direction-card {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 96px;
  padding: 14px;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--background-surface);
  font-size: 14px;
  line-height: 19px;
}

.direction-card:hover,
.resource-card:hover,
.public-content-card:hover {
  border-color: var(--action-primary);
}

.direction-card__icon {
  display: grid;
  flex: 0 0 72px;
  place-items: center;
  width: 72px;
  height: 72px;
}

.direction-card__icon img {
  width: 72px;
  height: 72px;
}

.public-section--directions > .public-arrow-link {
  display: inline-block;
  margin-top: 14px;
}

.qualification-card.qualification-card--public {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 18px;
  border-radius: 16px;
}

.qualification-card--public h3 {
  min-height: 48px;
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 24px;
}

.qualification-card--public > p {
  margin: 0;
  font-size: 13px;
  line-height: 18px;
}

.qualification-card--public dl {
  margin: 12px 0;
  font-size: 13px;
}

.qualification-card__requirements {
  margin: 0 0 12px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.qualification-card__requirements > span:first-child {
  display: block;
  margin-bottom: 2px;
  color: var(--text-primary);
  font-weight: 700;
}

.qualification-card__requirement-item + .qualification-card__requirement-item::before {
  content: " · ";
}

.qualification-card__special-conditions {
  margin: 0 0 12px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.qualification-card__special-conditions > span:first-child {
  color: var(--text-primary);
  font-weight: 700;
}

.qualification-card__footer {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-top: 0;
  color: var(--text-secondary);
  font-size: 13px;
}

.qualification-card__footer strong {
  display: block;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 24px;
}

.qualification-card__next-exam {
  display: grid;
  justify-items: end;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 16px;
  text-align: right;
}

.qualification-card__next-exam time {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 700;
}

.public-home .process-band {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.public-home .process-band h2 {
  margin: 0 0 18px;
  font-size: 30px;
  line-height: 36px;
}

.public-home .process-line {
  display: grid;
  grid-template-columns: max-content minmax(32px, 1fr) max-content minmax(32px, 1fr) max-content minmax(32px, 1fr) max-content minmax(32px, 1fr) max-content minmax(32px, 1fr) max-content;
  align-items: center;
  width: 100%;
  margin: 0;
  gap: 0;
}

.public-home .process-line__step {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
  font-size: 12px;
  line-height: 18px;
}

.public-home .process-line__icon {
  display: grid;
  flex: 0 0 48px;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--blue-soft);
}

.public-home .process-line__icon img {
  width: 27px;
  height: 27px;
}

.public-home .process-line__label {
  display: block;
  width: 118px;
  height: auto;
  min-width: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text-primary);
  font-weight: 800;
  text-align: left;
}

.public-home .process-line__label--profile {
  width: 164px;
  white-space: nowrap;
}

.public-home .process-line__label--select {
  width: 104px;
}

.public-home .process-line__label--register {
  width: 128px;
}

.public-home .process-line__label--apply {
  width: 108px;
}

.public-home .process-line__label--exam {
  width: 140px;
}

.public-home .process-line__label--result {
  width: 108px;
}

.public-home .process-line__connector {
  position: relative;
  display: block;
  z-index: 1;
  width: auto;
  height: 0;
  min-width: 32px;
  margin: 0;
  border-radius: 0;
  background: transparent;
  border-top: 2px dotted #9cc3ee;
}

.public-home .process-line__connector::after {
  position: absolute;
  top: -5px;
  right: 0;
  width: 7px;
  height: 7px;
  border-top: 2px solid #6ea9e8;
  border-right: 2px solid #6ea9e8;
  content: "";
  transform: rotate(45deg);
}

.exam-grid,
.resource-grid,
.news-preview-grid,
.public-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.exam-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 220px;
  padding: 18px;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: var(--background-surface);
}

.exam-card__head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.exam-card__head time {
  display: flex;
  flex: 0 0 54px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 66px;
  border-radius: 12px;
  background: var(--status-info-bg);
  text-transform: uppercase;
}

.exam-card__head time strong {
  color: var(--action-primary);
  font-size: 24px;
}

.exam-card__head time span {
  color: var(--text-secondary);
  font-size: 10px;
}

.exam-card h3 {
  margin: 0;
  font-size: 14px;
  line-height: 20px;
}

.exam-card p {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 18px;
}

.exam-card__availability {
  color: var(--status-success-text) !important;
  font-weight: 600;
}

.exam-card .secondary-btn {
  margin-top: auto;
}

.employers-banner {
  display: grid;
  grid-template-columns: 760px 1fr;
  min-height: 280px;
  overflow: hidden;
  border-radius: 18px;
  background: var(--background-staff-nav);
}

.employers-banner > div {
  padding: 34px;
}

.employers-banner h2,
.employers-banner p {
  max-width: 650px;
  color: var(--text-inverse);
}

.employers-banner h2 {
  margin: 0 0 12px;
  font-size: 28px;
  line-height: 36px;
}

.employers-banner img {
  width: 100%;
  height: 280px;
  object-fit: cover;
}

.employers-banner > picture {
  display: block;
  height: 280px;
}

.resource-card,
.public-content-card,
.news-preview,
.quick-link-grid a,
.official-panel,
.public-callout {
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--background-surface);
}

.resource-card,
.public-content-card {
  min-height: 160px;
  padding: 20px;
}

.resource-card h3,
.public-content-card h2 {
  margin: 0 0 8px;
  color: var(--action-link);
  font-size: 19px;
  line-height: 24px;
}

.resource-card p,
.public-content-card p {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 21px;
}

.resource-card strong {
  color: var(--action-link);
  font-size: 13px;
}

.news-preview-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.news-preview {
  min-height: 140px;
  padding: 18px;
  border: 0;
  background: var(--background-subtle);
}

.news-preview time,
.news-article > time {
  color: var(--text-secondary);
  font-size: 12px;
}

.news-preview h3 {
  margin: 6px 0;
  font-size: 18px;
  line-height: 23px;
}

.news-preview p {
  margin: 0;
  font-size: 14px;
  line-height: 21px;
}

.public-footer {
  display: grid;
  grid-template-columns: minmax(230px, 0.65fr) minmax(0, 2fr);
  align-items: center;
  gap: 28px;
  min-height: 0;
  margin: 0 auto;
  padding: 10px 24px;
  border-top: 1px solid var(--border-default);
  background: var(--background-subtle);
}

.public-footer__content {
  display: grid;
  gap: 8px;
}

.public-footer__identity {
  display: flex;
  align-items: center;
  gap: 10px;
}

.public-footer__logo {
  display: block;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  object-fit: contain;
}

.public-footer__identity p {
  max-width: 200px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.public-footer__navigation {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  row-gap: 4px;
}

.public-footer__navigation a {
  color: var(--text-secondary);
  line-height: 18px;
  white-space: nowrap;
}

.public-footer__navigation a + a::before,
.public-footer__details > * + *::before {
  display: inline-block;
  height: 14px;
  margin: 0 10px;
  border-left: 1px solid var(--border-default);
  content: "";
  vertical-align: -2px;
}

.public-footer__navigation a:hover {
  color: var(--action-link);
}

.public-footer p,
.public-footer a,
.public-footer .link-button {
  font-size: 12px;
}

.public-footer__details {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 16px;
}

.public-footer .link-button {
  padding: 0;
  color: var(--action-link);
  text-align: left;
}

.public-page-head,
.page-head {
  margin: 0;
  padding: 40px 0 20px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.public-page-head .breadcrumb,
.breadcrumb {
  margin: 0 0 20px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 15px;
}

.public-page-head h1 {
  margin-bottom: 12px;
}

.public-page-head > p:last-child {
  max-width: 920px;
  margin: 0;
  font-size: 16px;
  line-height: 24px;
}

.legal-document {
  max-width: 920px;
  margin: 0 0 56px;
}

.legal-document__header {
  padding: 40px 0 24px;
  border-bottom: 1px solid var(--border-default);
}

.legal-document__header .breadcrumb {
  margin-bottom: 20px;
}

.legal-document__header h1 {
  margin: 0 0 12px;
}

.legal-document__meta {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 21px;
}

.legal-document__content {
  display: grid;
  gap: 28px;
  padding-top: 32px;
}

.legal-document__content section {
  display: grid;
  gap: 12px;
}

.legal-document__content h2,
.legal-document__content h3,
.legal-document__content p,
.legal-document__content ul {
  margin: 0;
}

.legal-document__content h2 {
  font-size: 22px;
  line-height: 30px;
}

.legal-document__content h3 {
  font-size: 16px;
  line-height: 24px;
}

.legal-document__content p,
.legal-document__content li {
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 24px;
}

.legal-document__content ul {
  display: grid;
  gap: 8px;
  padding-left: 22px;
}

.public-list-section,
.public-card-grid,
.quick-link-grid,
.official-panel,
.public-callout,
.public-catalog-grid,
.news-article {
  margin: 20px 0 48px;
}

.public-card-grid--four,
.quick-link-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.public-card-grid--directions .public-content-card {
  min-height: 316px;
}

.public-callout,
.official-panel {
  padding: 26px;
}

.public-callout h2,
.official-panel h2 {
  margin: 0 0 10px;
  font-size: 22px;
  line-height: 28px;
}

.quick-link-grid a {
  min-height: 80px;
  padding: 20px;
  color: var(--action-link);
  font-size: 13px;
  font-weight: 600;
}

.official-panel dl {
  display: grid;
  gap: 10px;
  margin: 18px 0 0;
}

.official-panel dl div {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.official-panel dt {
  color: var(--text-secondary);
}

.official-panel dd {
  margin: 0;
  font-weight: 600;
}

.catalog-filters {
  display: grid;
  grid-template-columns: 380px repeat(2, 230px) auto;
  gap: 14px;
  align-items: end;
  margin: 20px 0 24px;
}

.catalog-filters label {
  display: grid;
  gap: 7px;
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 600;
}

.catalog-filters input,
.catalog-filters select {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  background: var(--background-surface);
}

.catalog-summary {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border-default);
  color: var(--text-secondary);
  font-size: 12px;
}

.public-catalog-grid {
  margin-top: 24px;
}

.news-article {
  max-width: 900px;
}

.news-article h1 {
  margin: 20px 0;
  font-size: 42px;
  line-height: 50px;
}

.news-article__lead {
  font-size: 20px;
  line-height: 28px;
}

.news-article__body p {
  font-size: 16px;
  line-height: 26px;
}

@media (max-width: 1100px) {
  .layout-public .public-header__desktop {
    display: none;
  }

  .layout-public .public-header__mobile {
    display: flex;
  }

  .public-hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
  }

  .public-hero h1 {
    font-size: 38px;
    line-height: 46px;
  }

  .direction-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .employers-banner {
    grid-template-columns: 1.2fr 0.8fr;
  }

  .catalog-filters {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 700px) {
  .layout-public .public-main,
  .public-footer {
    width: min(100% - 32px, 1280px);
  }

  .public-home {
    gap: 16px;
  }

  .public-hero {
    display: flex;
    min-height: 0;
    flex-direction: column;
    margin-top: 16px;
    border-radius: 16px;
  }

  .public-hero__content {
    padding: 28px 20px;
  }

  .public-hero h1 {
    font-size: 32px;
    line-height: 38px;
  }

  .public-hero__lead {
    font-size: 16px;
    line-height: 24px;
  }

  .public-hero__image {
    height: 260px;
  }

  .public-hero .action-row,
  .official-strip,
  .official-strip__facts,
  .public-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .public-hero .primary-btn,
  .public-hero .secondary-btn {
    width: 100%;
  }

  .public-arrow-link {
    margin-top: 22px;
  }

  .official-strip__facts {
    display: grid;
    gap: 12px;
  }

  .direction-grid,
  .qualification-grid,
  .exam-grid,
  .resource-grid,
  .news-preview-grid,
  .public-card-grid,
  .public-card-grid--four,
  .quick-link-grid,
  .catalog-filters {
    grid-template-columns: 1fr;
  }

  .public-home .process-line {
    grid-template-columns: 1fr;
  }

  .public-home .process-line__connector {
    display: none;
  }

  .employers-banner {
    grid-template-columns: 1fr;
  }

  .employers-banner > div {
    padding: 24px 20px;
  }

  .employers-banner img {
    height: 220px;
  }

  .public-page-head h1,
  .news-article h1 {
    font-size: 30px;
    line-height: 36px;
  }

  .official-panel dl div {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--background-subtle);
  color: var(--text-primary);
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
a,
input,
select,
textarea,
summary {
  outline-offset: 3px;
}

:focus-visible {
  outline: 3px solid var(--action-focus);
  outline-offset: 3px;
}

.skip-link {
  position: absolute;
  left: -999px;
  top: 8px;
  z-index: 10;
  padding: 8px 12px;
  background: var(--blue);
  color: #fff;
}

.skip-link:focus {
  left: 8px;
}

.action-row {
  display: flex;
  align-items: center;
  gap: 20px;
}

.primary-btn,
.secondary-btn,
.tertiary-btn,
.danger-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: var(--radius-medium);
  padding: 0 var(--space-20);
  border: 1px solid transparent;
  font-weight: 600;
}

.primary-btn {
  background: var(--action-primary);
  color: var(--text-inverse);
}

.primary-btn:hover {
  background: var(--action-primary-hover);
}

.primary-btn:active {
  background: var(--action-primary-pressed);
}

.secondary-btn {
  border-color: var(--border-strong);
  background: var(--background-surface);
  color: var(--action-link);
}

.secondary-btn:hover,
.secondary-btn:active,
.tertiary-btn:hover,
.tertiary-btn:active {
  background: var(--status-info-bg);
}

.tertiary-btn {
  background: var(--background-surface);
  color: var(--action-link);
}

.danger-btn {
  background: var(--action-danger);
  color: var(--text-inverse);
}

.danger-btn:hover {
  background: var(--action-danger-hover);
}

.danger-btn:active {
  background: var(--action-danger-pressed);
}

.primary-btn:disabled,
.secondary-btn:disabled,
.tertiary-btn:disabled,
.danger-btn:disabled,
[aria-disabled="true"].primary-btn,
[aria-disabled="true"].secondary-btn,
[aria-disabled="true"].tertiary-btn,
[aria-disabled="true"].danger-btn {
  border-color: var(--border-default);
  background: var(--background-subtle);
  color: var(--text-muted);
  cursor: not-allowed;
}

.primary-btn[aria-busy="true"],
.secondary-btn[aria-busy="true"],
.tertiary-btn[aria-busy="true"],
.danger-btn[aria-busy="true"] {
  cursor: progress;
  opacity: 0.78;
}

.status-badge,
.status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 8px 12px;
  border-radius: var(--radius-pill);
  background: var(--background-subtle);
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  white-space: nowrap;
}

.status-badge--info {
  background: var(--status-info-bg);
  color: var(--status-info-text);
}

.status-badge--success {
  background: var(--status-success-bg);
  color: var(--status-success-text);
}

.status-badge--warning {
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}

.status-badge--error {
  background: var(--status-error-bg);
  color: var(--status-error-text);
}

.status-badge--internal {
  background: var(--status-internal-bg);
  color: var(--status-internal-text);
}

.ui-alert {
  display: flex;
  gap: var(--space-20);
  align-items: center;
  width: 100%;
  min-height: 120px;
  padding: var(--space-20) var(--space-24);
  border: 1px solid var(--status-warning-text);
  border-radius: var(--radius-large);
  background: var(--status-warning-bg);
}

.ui-alert--info {
  border-color: var(--status-info-text);
  background: var(--status-info-bg);
}

.ui-alert--error {
  border-color: var(--status-error-text);
  background: var(--status-error-bg);
}

.ui-alert--internal {
  border-color: var(--status-internal-text);
  background: var(--status-internal-bg);
}

.ui-alert__icon {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.ui-alert__content {
  flex: 1 1 auto;
  min-width: 0;
}

.ui-alert__title {
  display: block;
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
}

.ui-alert__body {
  margin: 4px 0 0;
  font-size: 14px;
  line-height: 20px;
}

.ui-alert__action {
  flex: 0 0 auto;
}

.application-progress {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  min-height: 82px;
  margin: 16px 0;
  padding: 0;
  list-style: none;
}

.application-progress::before {
  position: absolute;
  top: 18px;
  right: 8.5%;
  left: 8.5%;
  height: 2px;
  background: var(--border-strong);
  content: "";
}

.application-progress__step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  min-width: 0;
  color: var(--text-secondary);
  text-align: center;
}

.application-progress__dot {
  width: 36px;
  height: 36px;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: var(--background-surface);
}

.application-progress__step.is-completed .application-progress__dot {
  border-color: var(--status-success-text);
  background: var(--status-success-text);
}

.application-progress__step.is-active {
  color: var(--text-primary);
}

.application-progress__step.is-active .application-progress__dot {
  border-color: var(--action-primary);
  background: var(--action-primary);
}

.application-progress__label {
  max-width: 104px;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
}

.form-field {
  display: grid;
  gap: 6px;
}

.form-field label,
.form-checkbox label {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 500;
}

.form-control {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  background: var(--background-surface);
  color: var(--text-primary);
  font-size: 14px;
}

textarea.form-control {
  min-height: 96px;
  resize: vertical;
}

.form-control::placeholder {
  color: var(--text-muted);
}

.form-control:focus {
  border: 2px solid var(--action-focus);
  outline: 0;
}

.form-control:disabled,
.form-control[readonly] {
  background: var(--background-subtle);
  color: var(--text-muted);
}

.form-field.has-error .form-control {
  border: 2px solid var(--status-error-text);
}

.form-field__help,
.form-field__errors p {
  margin: 0;
  font-size: 11px;
  line-height: 16px;
}

.form-field__errors p {
  color: var(--status-error-text);
}

.form-checkbox {
  display: flex;
  gap: 10px;
  align-items: center;
}

.form-checkbox__input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--action-primary);
}

.form-panel,
.dashboard-actions {
  display: grid;
  gap: var(--space-16);
}

.dashboard-actions .section-title {
  margin-bottom: 0;
}

.ui-card,
.document-item {
  border: 1px solid var(--border-default);
  border-radius: var(--radius-medium);
  background: var(--background-surface);
}

.document-item {
  padding: var(--space-16);
}

.layout-public {
  background: var(--background-surface);
}

.public-header {
  position: relative;
  z-index: 20;
  background: var(--background-surface);
}

.public-header__desktop,
.public-main {
  width: min(var(--page-max), calc(100vw - 48px));
  margin: 0 auto;
}

.public-header__desktop {
  min-height: 112px;
}

.public-header__topbar {
  display: flex;
  align-items: center;
  gap: var(--space-20);
  height: 64px;
  padding: 0 var(--space-24);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: var(--space-12);
  flex: 0 0 auto;
}

.brand__logo,
.brand__mobile-logo img {
  display: block;
  object-fit: contain;
  object-position: left center;
}

.brand__mark,
.workspace-brand {
  color: var(--action-primary);
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
}

.brand__description {
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 500;
  line-height: 14px;
}

.public-header__spacer {
  flex: 1 1 auto;
}

.public-header__utility {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 500;
}

.public-header__utility-icon {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  background-color: currentColor;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.public-header__utility-icon--calendar {
  -webkit-mask-image: url("../img/tabler-calendar.svg");
  mask-image: url("../img/tabler-calendar.svg");
}

.public-header__utility-icon--user {
  -webkit-mask-image: url("../img/tabler-user-circle.svg");
  mask-image: url("../img/tabler-user-circle.svg");
}

.public-header__utility-icon--eye {
  -webkit-mask-image: url("../img/tabler-eye-search.svg");
  mask-image: url("../img/tabler-eye-search.svg");
}

.public-header__cta {
  flex: 0 0 auto;
  font-size: 14px;
}

.accessibility-button,
.menu-button {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--border-default);
  border-radius: 10px;
  background: var(--background-surface);
  color: var(--action-link);
  cursor: pointer;
}

.accessibility-button {
  flex: 0 0 44px;
  font-size: 13px;
  font-weight: 600;
}

.public-header__accessibility {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  justify-content: flex-start;
}

.public-menu {
  display: flex;
  align-items: center;
  gap: var(--space-32);
  height: 48px;
  padding: 0 var(--space-24);
  overflow: hidden;
  border-bottom: 1px solid #dbe5f2;
  box-shadow: 0 8px 10px -10px rgba(9, 23, 41, 0.24);
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

.public-menu a:hover,
.public-header__utility:hover {
  color: var(--action-link);
}

.public-header__mobile,
.workspace-mobile-header,
.applicant-bottom-nav {
  display: none;
}

.brand__mobile-logo {
  display: none;
}

.workspace-shell {
  display: grid;
  grid-template-columns: var(--workspace-sidebar) minmax(0, 1fr);
  width: min(var(--frame-max), 100%);
  min-height: 100vh;
  margin: 0 auto;
  background: var(--background-subtle);
}

.workspace-area {
  min-width: 0;
}

.workspace-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  min-height: 100vh;
  padding: 28px 16px 24px;
  border-right: 1px solid var(--border-default);
  background: var(--background-surface);
}

.workspace-sidebar .workspace-brand {
  margin: 0 14px 18px;
}

.workspace-brand__caption {
  margin: -10px 14px 14px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 500;
}

.workspace-nav {
  display: grid;
  gap: var(--space-8);
}

.workspace-nav__link {
  display: flex;
  align-items: center;
  gap: var(--space-12);
  width: 100%;
  min-height: 44px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}

.workspace-nav__link:hover,
.workspace-nav__link.is-active {
  background: var(--status-info-bg);
  color: var(--action-link);
}

.workspace-nav__icon {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  border: 2px solid currentColor;
  border-radius: 6px;
}

.workspace-logout {
  margin: 0;
}

.staff-sidebar {
  border-right: 0;
  background: var(--background-staff-nav);
}

.staff-sidebar .workspace-brand,
.staff-sidebar .workspace-nav__link {
  color: var(--text-inverse);
}

.staff-sidebar .workspace-nav__link:hover,
.staff-sidebar .workspace-nav__link.is-active {
  background: var(--nav-staff-active);
  color: var(--text-inverse);
}

.workspace-main {
  width: 100%;
  max-width: 1188px;
  min-height: 100vh;
  padding: 30px 34px 48px;
}

.workspace-main > .page-head:first-of-type,
.workspace-main > .auth-panel:first-of-type {
  margin-top: 0;
}

.workspace-form-panel {
  max-width: 720px;
  margin-right: auto;
  margin-left: 0;
}

.mobile-drawer {
  position: relative;
}

.mobile-drawer summary {
  list-style: none;
}

.mobile-drawer summary::-webkit-details-marker {
  display: none;
}

.menu-button {
  align-content: center;
  gap: 5px;
  padding: 10px;
}

.menu-button span {
  display: block;
  width: 20px;
  height: 2px;
  border-radius: 1px;
  background: var(--action-primary);
}

.mobile-drawer__panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  display: grid;
  gap: 4px;
  width: min(320px, calc(100vw - 32px));
  padding: var(--space-12);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-medium);
  background: var(--background-surface);
  box-shadow: var(--shadow-floating);
}

.mobile-drawer__panel a,
.mobile-drawer__panel .link-button {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 12px;
  border-radius: var(--radius-small);
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 500;
}

.mobile-drawer__panel a:hover,
.mobile-drawer__panel .link-button:hover,
.mobile-drawer__panel a.is-active {
  background: var(--status-info-bg);
  color: var(--action-link);
}

.mobile-drawer__panel .primary-btn {
  justify-content: center;
  color: var(--text-inverse);
}

.hero {
  min-height: 360px;
  margin-top: 24px;
  padding: 56px var(--page-gutter);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-large);
  background: var(--surface);
}

.hero-image {
  position: relative;
  min-height: 430px;
  background:
    linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.92) 42%, rgba(255, 255, 255, 0.08) 72%),
    url("../img/hero-public.png") right center / auto 100% no-repeat,
    #fff;
  box-shadow: var(--shadow);
}

.hero-copy {
  position: relative;
  z-index: 1;
  max-width: 680px;
}

.eyebrow {
  color: var(--blue);
  font-weight: 800;
  text-transform: uppercase;
}

h1 {
  margin: 0 0 18px;
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
}

p {
  color: var(--muted);
  font-size: 16px;
  line-height: 24px;
}

.hero h1 {
  font-size: 52px;
  line-height: 60px;
}

h2 {
  font-size: 32px;
  line-height: 40px;
}

h3 {
  font-size: 24px;
  line-height: 32px;
}

.public-section,
.public-bottom,
.page-panel {
  margin-top: 22px;
}

.public-section {
  padding: 0;
}

.section-title {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin-bottom: 14px;
}

.section-title h2 {
  margin: 0;
  font-size: 24px;
  line-height: 32px;
}

.section-title a {
  color: var(--blue);
  font-weight: 800;
}

.direction-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.compact-card {
  display: flex;
  min-height: 76px;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-medium);
  background: var(--surface);
}

.soft-icon {
  display: inline-grid;
  flex: 0 0 38px;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: var(--radius-small);
  background: var(--blue-soft);
  color: var(--blue);
  font-weight: 900;
}

.page-head {
  margin-top: 24px;
  padding: 40px var(--page-gutter);
  border: 1px solid var(--line);
  border-radius: var(--radius-large);
  background: var(--surface);
}

.catalog-layout,
.detail-grid {
  display: grid;
  gap: 18px;
  margin: 18px 0 48px;
}

.catalog-layout {
  grid-template-columns: 280px minmax(0, 1fr);
}

.filter-panel,
.qualification-card,
.empty-state,
.info-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius-large);
  background: var(--surface);
}

.filter-panel,
.qualification-card,
.empty-state,
.info-panel {
  padding: 22px;
}

.filter-panel ul,
.info-panel ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 18px;
}

.qualification-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.qualification-card h2,
.empty-state h2,
.info-panel h2 {
  margin: 0 0 12px;
  font-size: 22px;
}

.qualification-card dl,
.info-panel dl {
  display: grid;
  gap: 8px;
  margin: 16px 0;
}

.qualification-card dl div,
.info-panel dl div {
  display: flex;
  justify-content: space-between;
  gap: 18px;
}

.qualification-card dt,
.info-panel dt {
  color: var(--muted);
}

.qualification-card dd,
.info-panel dd {
  margin: 0;
  font-weight: 800;
}

.detail-grid {
  grid-template-columns: 1fr 1fr;
}

.process-band {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-large);
  background: var(--surface);
}

.process-line {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 16px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.process-line li {
  display: grid;
  gap: 8px;
  justify-items: center;
  color: #1d3151;
  font-weight: 800;
  text-align: center;
}

.process-line span {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--blue-soft);
  color: var(--blue);
}

.public-bottom {
  display: grid;
  grid-template-columns: 1fr 0.72fr;
  gap: 18px;
  margin-bottom: 52px;
}

.employer-card {
  min-height: 250px;
  padding: 30px;
  border-radius: var(--radius-large);
  background:
    linear-gradient(90deg, rgba(4, 43, 97, 0.98), rgba(4, 77, 157, 0.9) 58%, rgba(7, 88, 176, 0.72)),
    url("../img/hero-assessment.png") center / cover;
  color: #fff;
}

.employer-card p,
.employer-card h2 {
  max-width: 560px;
  color: #fff;
}

.employer-card .light {
  color: var(--blue);
}

.list-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 22px 0 52px;
}

.step-list {
  display: grid;
  gap: 18px;
  margin: 0;
  padding-left: 22px;
}

.step-list li {
  padding-left: 6px;
}

.step-list span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.search-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  max-width: 720px;
}

.search-form label {
  grid-column: 1 / -1;
  font-weight: 800;
}

.search-form input {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: var(--radius-medium);
  padding: 0 14px;
}

.employer-hero {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.78) 45%, rgba(255, 255, 255, 0.1) 78%),
    url("../img/hero-assessment.png") right center / auto 100% no-repeat,
    #fff;
}

.auth-panel {
  max-width: 620px;
  margin: 42px auto;
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: var(--radius-large);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.stack-form {
  display: grid;
  gap: 16px;
}

.stack-form p {
  display: grid;
  gap: 7px;
  margin: 0;
}

.stack-form label {
  color: var(--ink);
  font-weight: 800;
}

.stack-form input,
.stack-form textarea,
.stack-form select {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: var(--radius-medium);
  padding: 0 12px;
}

.stack-form textarea {
  min-height: 110px;
  padding-top: 10px;
}

.stack-form .helptext,
.stack-form ul {
  color: var(--muted);
  font-size: 14px;
}

.form-links {
  display: flex;
  gap: 16px;
  margin-top: 18px;
  color: var(--blue);
  font-weight: 800;
}

.link-button {
  border: 0;
  background: transparent;
  color: var(--blue);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  padding: 0;
}

.logout-form {
  margin: 22px 0 52px;
}

.documents-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.documents-grid h3 {
  margin-top: 22px;
}

.messages {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.message {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-medium);
  background: var(--surface);
}

.message.success {
  border-color: #b9e6c9;
  background: #ecf9f1;
  color: var(--green);
}

.table-list {
  display: grid;
  gap: 12px;
}

.table-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(140px, auto) minmax(180px, auto);
  gap: 16px;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid var(--line);
}

.muted {
  display: inline-block;
  margin-left: 8px;
  color: var(--muted);
  font-size: 0.86rem;
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 22px 0;
}

.stat-card {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-large);
  background: var(--surface);
}

.stat-card span {
  display: block;
  color: var(--muted);
  font-size: 0.92rem;
}

.stat-card strong {
  display: block;
  margin-top: 10px;
  font-size: 2.2rem;
  line-height: 1;
}

.filter-panel {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(160px, auto)) auto;
  gap: 12px;
  align-items: end;
  margin: 0 0 22px;
}

.filter-panel input,
.filter-panel select,
.review-form input {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: var(--radius-medium);
  padding: 9px 12px;
  font: inherit;
}

.staff-table-row {
  grid-template-columns: minmax(160px, 0.8fr) minmax(180px, 1fr) minmax(220px, 1.3fr) minmax(130px, auto) minmax(
      160px,
      auto
    );
}

.staff-document-row {
  grid-template-columns: minmax(180px, 1fr) minmax(200px, 1fr) minmax(130px, auto) minmax(180px, auto);
}

.compact-filter {
  grid-template-columns: minmax(180px, 320px) auto;
}

.review-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto auto;
  gap: 10px;
  grid-column: 1 / -1;
}

@media (max-width: 1279px) {
  .public-header__desktop,
  .workspace-sidebar {
    display: none;
  }

  .public-header__mobile,
  .workspace-mobile-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 72px;
    padding: 0 24px;
    border-bottom: 1px solid var(--border-default);
    background: var(--background-surface);
  }

  .public-header__mobile {
    width: min(var(--page-max), 100%);
    margin: 0 auto;
  }

  .layout-public .public-header__mobile .brand__mobile-logo {
    display: block;
    width: 116px;
    height: 52px;
  }

  .layout-public .public-header__mobile .brand__mobile-logo img {
    width: 100%;
    height: 100%;
  }

  .workspace-shell {
    display: block;
    width: 100%;
  }

  .workspace-main {
    max-width: 100%;
    min-height: calc(100vh - 72px);
    padding: 24px;
  }

  .staff-mobile-header {
    background: var(--background-staff-nav);
  }

  .staff-mobile-header .brand__mark {
    color: var(--text-inverse);
  }

  .staff-mobile-header .menu-button {
    border-color: rgba(255, 255, 255, 0.28);
    background: var(--background-staff-nav);
  }

  .staff-mobile-header .menu-button span {
    background: var(--text-inverse);
  }
}

@media (max-width: 767px) {
  :root {
    --page-gutter: 16px;
  }

  .public-header__mobile,
  .workspace-mobile-header {
    padding: 0 16px;
  }

  .public-main {
    width: 100%;
    padding: 0 16px;
  }

  .workspace-main {
    padding: 16px 16px 100px;
  }

  .applicant-bottom-nav {
    position: fixed;
    z-index: 30;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 76px;
    padding: 8px;
    border-top: 1px solid var(--border-default);
    background: var(--background-surface);
  }

  .applicant-bottom-nav__item {
    display: flex;
    flex: 0 1 68px;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    height: 58px;
    color: var(--text-secondary);
    font-size: 10px;
    font-weight: 500;
    text-align: center;
  }

  .applicant-bottom-nav__item .workspace-nav__icon {
    width: 22px;
    height: 22px;
    border-radius: 7px;
  }

  .applicant-bottom-nav__item.is-active {
    color: var(--action-primary);
  }

  h1 {
    font-size: 30px;
    line-height: 38px;
  }

  h2 {
    font-size: 24px;
    line-height: 32px;
  }

  .hero h1 {
    font-size: 36px;
    line-height: 44px;
  }

  .hero,
  .page-head {
    padding: 32px 20px;
  }

  .auth-panel {
    margin: 24px 0;
    padding: 24px;
  }

  .ui-alert {
    flex-wrap: wrap;
    gap: 12px;
    min-height: 0;
    padding: 16px;
  }

  .ui-alert__action {
    width: 100%;
  }

  .application-progress {
    gap: 4px;
    min-height: 64px;
  }

  .application-progress::before {
    top: 13px;
    right: 8%;
    left: 8%;
  }

  .application-progress__step {
    gap: 5px;
  }

  .application-progress__dot {
    width: 26px;
    height: 26px;
  }

  .application-progress__label {
    max-width: 52px;
    font-size: 9px;
    line-height: 12px;
  }

  .hero-image {
    min-height: 520px;
    background:
      linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0.88) 40%, rgba(255, 255, 255, 0.12) 78%),
      linear-gradient(180deg, rgba(255, 255, 255, 0) 56%, #fff 88%),
      url("../img/hero-public.png") 58% bottom / auto 58% no-repeat,
      #fff;
  }

  .action-row,
  .public-bottom,
  .search-form {
    display: grid;
    grid-template-columns: 1fr;
  }

  .direction-grid,
  .process-line,
  .list-grid {
    display: flex;
    overflow-x: auto;
    padding-bottom: 8px;
  }

  .compact-card,
  .process-line li,
  .list-grid > article {
    min-width: 250px;
  }

  .catalog-layout,
  .detail-grid,
  .qualification-grid {
    grid-template-columns: 1fr;
  }

  .table-row {
    grid-template-columns: 1fr;
  }

  .stat-grid,
  .filter-panel,
  .review-form {
    grid-template-columns: 1fr;
  }
}

.process-page-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 20px 0 36px;
  padding: 0;
  list-style: none;
}

.process-page-list li {
  display: flex;
  gap: 16px;
  min-height: 120px;
  padding: 20px;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--background-surface);
}

.process-page-list > li > span {
  display: grid;
  flex: 0 0 40px;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--status-info-bg);
  color: var(--action-primary);
  font-weight: 600;
}

.process-page-list h2,
.document-public-list h2,
.news-list-card h2 {
  margin: 0 0 6px;
  font-size: 18px;
  line-height: 24px;
}

.process-page-list p {
  margin: 0;
  font-size: 14px;
  line-height: 21px;
}

.document-public-list,
.faq-list,
.news-list-grid {
  display: grid;
  gap: 12px;
}

.document-public-list > article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 90px;
  padding: 18px 20px;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--background-surface);
}

.document-public-list p {
  margin: 0;
  font-size: 14px;
}

.news-list-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.news-list-card {
  min-height: 220px;
  padding: 20px;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--background-surface);
}

.news-list-card time {
  color: var(--text-secondary);
  font-size: 12px;
}

.news-list-card h2 {
  margin-top: 10px;
}

.news-list-card p {
  font-size: 14px;
  line-height: 21px;
}

.news-list-card strong {
  color: var(--action-link);
  font-size: 13px;
}

.faq-list details {
  border: 1px solid var(--border-default);
  border-radius: 12px;
  background: var(--background-surface);
}

.faq-list summary {
  padding: 18px 20px;
  color: var(--text-primary);
  font-weight: 600;
  cursor: pointer;
}

.faq-list details p {
  margin: 0;
  padding: 0 20px 20px;
  font-size: 14px;
  line-height: 22px;
}

.contacts-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.contacts-layout .official-panel {
  margin: 0;
}

.contact-map {
  position: relative;
  min-height: 360px;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  overflow: hidden;
  background: var(--background-subtle);
}

.contact-map__canvas,
.contact-map__fallback {
  width: 100%;
  height: 100%;
  min-height: 360px;
}

.contact-map__fallback {
  display: grid;
  place-content: center;
  gap: 6px;
  color: var(--text-secondary);
  text-align: center;
}

.contact-map__fallback strong {
  color: var(--text-primary);
  font-size: 20px;
}

.contact-map__route {
  position: absolute;
  right: 16px;
  bottom: 16px;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--background-surface);
  box-shadow: var(--shadow-card);
  font-size: 14px;
  font-weight: 700;
}

.contact-map__marker {
  position: absolute;
  width: 28px;
  height: 28px;
  border: 3px solid #fff;
  border-radius: 50% 50% 50% 0;
  background: var(--action-primary);
  box-shadow: 0 2px 8px rgba(15, 31, 51, 0.35);
  transform: translate(-50%, -100%) rotate(-45deg);
}

.content-note {
  margin: 20px 0 0;
  font-size: 12px;
}

.public-card-grid--five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.qualification-detail-head {
  padding: 36px 0 18px;
}

.qualification-detail-head h1 {
  max-width: 850px;
  margin: 10px 0;
  font-size: 38px;
  line-height: 44px;
}

.qualification-detail-head dl {
  display: flex;
  gap: 28px;
  margin: 0;
}

.qualification-detail-head dl div {
  display: grid;
}

.qualification-detail-head dt {
  color: var(--text-secondary);
  font-size: 11px;
}

.qualification-detail-head dd {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
}

.qualification-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 908px) 344px;
  gap: 28px;
  margin-bottom: 48px;
}

.qualification-detail-content {
  display: grid;
  gap: 16px;
}

.qualification-detail-content .public-content-card {
  min-height: 0;
}

.qualification-detail-content h3 {
  margin: 18px 0 4px;
  font-size: 15px;
  line-height: 20px;
}

.qualification-cta {
  align-self: start;
  display: grid;
  gap: 12px;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: var(--background-surface);
  box-shadow: var(--shadow-card);
}

.qualification-cta h2,
.qualification-cta p {
  margin: 0;
}

.qualification-cta__price {
  color: var(--text-primary);
  font-size: 28px;
  font-weight: 700;
}

@media (max-width: 1100px) {
  .public-card-grid--five {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .qualification-detail-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }
}

@media (max-width: 700px) {
  .public-home {
    width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  .public-home > * {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .direction-grid {
    display: grid;
    grid-template-columns: 1fr;
    overflow: visible;
  }

  .public-home .process-line {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    overflow: visible;
  }

  .public-home .process-line__step {
    min-width: 0;
  }

  .process-page-list,
  .news-list-grid,
  .contacts-layout,
  .public-card-grid--five,
  .qualification-detail-layout {
    grid-template-columns: 1fr;
  }

  .document-public-list > article {
    align-items: stretch;
    flex-direction: column;
  }

  .qualification-detail-head h1 {
    font-size: 30px;
    line-height: 36px;
  }

  .qualification-detail-head dl {
    flex-wrap: wrap;
  }
}

@media (max-width: 700px) {
  .layout-public .public-main {
    width: 100%;
    margin: 0;
    padding: 0 16px;
  }

  .layout-public .public-footer {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  .layout-public .public-header__mobile {
    width: 100%;
    height: 84px;
    padding: 0 16px;
    border-bottom: 1px solid #dbe5f2;
    box-shadow: 0 6px 10px rgba(15, 31, 51, 0.1);
  }

  .layout-public .public-header__mobile .brand__mark {
    font-size: 34px;
  }

  .layout-public .public-header__mobile .menu-button,
  .accessibility-button--mobile {
    width: 48px;
    height: 48px;
  }

  .layout-public .public-header__mobile .mobile-drawer {
    margin-left: auto;
  }

  .accessibility-button--mobile {
    display: inline-grid;
    flex: 0 0 48px;
    margin-left: 10px;
    padding: 0;
    border: 1px solid var(--border-default);
    font-size: 15px;
  }

  .public-home {
    gap: 22px;
    padding-top: 18px;
  }

  .public-hero {
    display: flex;
    gap: 14px;
    align-items: stretch;
    flex-direction: column;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: var(--background-surface);
    box-shadow: none;
  }

  .public-hero__content {
    display: contents;
  }

  .public-hero .eyebrow {
    order: 0;
    margin: 0;
    font-size: 11px;
    line-height: 15px;
  }

  .public-hero h1 {
    order: 1;
    margin: 0;
    font-size: 34px;
    line-height: 40px;
  }

  .public-hero__lead {
    order: 2;
    margin: 0;
    font-size: 16px;
    line-height: 24px;
  }

  .public-hero__media {
    order: 3;
    width: 100%;
    height: 230px;
  }

  .public-hero__image {
    width: 100%;
    height: 230px;
    border-radius: 16px;
  }

  .public-hero .action-row {
    display: flex;
    order: 4;
    gap: 8px;
    flex-direction: column;
  }

  .public-hero .public-arrow-link {
    order: 5;
    margin: 0;
  }

  .official-strip {
    min-height: 190px;
    gap: 12px;
    padding: 18px 16px;
  }

  .official-strip h2 {
    font-size: 20px;
    line-height: 26px;
  }

  .official-strip__facts {
    grid-template-columns: auto 1fr;
    gap: 28px;
  }

  .official-strip__facts div:nth-child(2) {
    display: none;
  }

  .official-strip .primary-btn {
    width: 100%;
  }

  .public-home .public-section {
    padding: 0;
  }

  .public-home .section-title {
    margin-bottom: 14px;
  }

  .public-home .section-title h2 {
    font-size: 24px;
    line-height: 30px;
  }

  .public-home .section-title > a {
    display: none;
  }

  .direction-grid {
    display: grid;
    gap: 10px;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }

  .direction-card {
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    min-height: 110px;
    padding: 12px;
    border-radius: 12px;
  }

  .direction-card__icon {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
  }

  .direction-card__icon img {
    width: 22px;
    height: 22px;
  }

  .direction-card strong {
    font-size: 13px;
    line-height: 17px;
  }

  .qualification-card--public {
    min-height: 260px;
  }

  .public-section--qualifications .qualification-card:nth-child(n + 3),
  .public-section--exams .exam-card:nth-child(n + 3),
  .public-section--news .news-preview:nth-child(n + 2) {
    display: none;
  }

  .public-home .process-band {
    padding: 0;
    background: transparent;
  }

  .public-home .process-band h2 {
    margin: 0 0 14px;
    font-size: 24px;
    line-height: 30px;
  }

  .public-home .process-line {
    display: flex;
    align-items: stretch;
    gap: 12px;
    flex-direction: column;
    padding: 0;
    overflow: visible;
    border-radius: 0;
    background: transparent;
  }

  .public-home .process-line__step {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    width: 100%;
    min-width: 0;
    color: var(--text-primary);
    font-size: 14px;
    line-height: 20px;
    text-align: left;
  }

  .public-home .process-line > .process-line__step > .process-line__icon {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
  }

  .public-home .process-line__icon img {
    width: 20px;
    height: 20px;
  }

  .public-home .process-line__label {
    max-width: none;
    text-align: left;
  }

  .public-home .process-line__connector {
    display: none;
  }

  .exam-card {
    width: 100%;
  }

  .employers-banner {
    display: flex;
    min-height: 380px;
    gap: 12px;
    flex-direction: column;
    padding: 20px 18px 0;
    border-radius: 16px;
  }

  .employers-banner > div {
    display: contents;
    padding: 0;
  }

  .employers-banner h2 {
    margin: 0;
    font-size: 24px;
    line-height: 32px;
  }

  .employers-banner p {
    margin: 0;
    font-size: 14px;
    line-height: 22px;
  }

  .employers-banner .secondary-btn {
    align-self: flex-start;
  }

  .employers-banner > picture {
    width: calc(100% + 36px);
    height: 136px;
    margin-left: -18px;
  }

  .employers-banner img {
    width: 100%;
    height: 136px;
    border-radius: 0 0 12px 12px;
  }

  .resource-card {
    min-height: 110px;
    padding: 16px;
    border-radius: 12px;
  }

  .resource-card h3 {
    font-size: 18px;
    line-height: 23px;
  }

  .resource-card p {
    font-size: 13px;
    line-height: 19px;
  }

  .resource-card strong {
    display: none;
  }

  .news-preview {
    min-height: 104px;
    padding: 16px;
    border-radius: 12px;
  }

  .public-footer {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 22px;
    padding: 14px 16px 12px;
  }

  .public-footer__identity {
    justify-content: center;
  }

  .public-footer__navigation {
    justify-content: center;
  }

  .public-footer__navigation a + a::before,
  .public-footer__details > * + *::before {
    margin: 0 7px;
  }

  .public-footer__details {
    flex-wrap: wrap;
  }
}

.layout-applicant .workspace-main {
  max-width: 1188px;
  padding: 36px 40px 48px;
}

.applicant-dashboard {
  display: grid;
  gap: 20px;
}

.workspace-page-title {
  display: flex;
  align-items: center;
  min-height: 36px;
}

.workspace-page-title h1 {
  margin: 0;
  font-size: 32px;
  line-height: 36px;
}

.applicant-dashboard .ui-alert {
  width: 100%;
  min-height: 120px;
  margin: 0;
}

.applicant-active-application {
  display: block;
  padding: 22px;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: var(--background-surface);
}

.applicant-active-application__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.applicant-kicker,
.applicant-application-number {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  text-transform: uppercase;
}

.applicant-application-number {
  margin-top: 6px;
  color: var(--text-primary);
  font-size: 15px;
  font-weight: 500;
  text-transform: none;
}

.applicant-active-application h2 {
  margin: 6px 0 14px;
  font-size: 18px;
  line-height: 24px;
}

.applicant-active-application .application-progress {
  width: 100%;
  margin-top: 6px;
}

.applicant-active-application--empty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.applicant-active-application--empty h2 {
  margin-bottom: 6px;
}

.applicant-active-application--empty p:last-child {
  margin: 0;
}

.applicant-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.applicant-summary-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 190px;
  padding: 22px;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: var(--background-surface);
}

.applicant-summary-card h2 {
  margin: 0 0 14px;
  font-size: 20px;
  line-height: 26px;
}

.applicant-summary-card p {
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 20px;
}

.applicant-summary-card__main {
  color: var(--text-primary) !important;
  font-size: 15px !important;
  font-weight: 500;
}

.applicant-summary-card > a,
.applicant-summary-card .action-row {
  margin-top: auto;
}

.applicant-summary-card > a {
  color: var(--action-link);
  font-size: 13px;
  font-weight: 600;
}

.applicant-documents-summary dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

.applicant-documents-summary dl div {
  display: flex;
  gap: 10px;
  align-items: center;
}

.applicant-documents-summary dl div::before {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  content: "";
}

.applicant-documents-summary dt,
.applicant-documents-summary dd {
  margin: 0;
  color: var(--text-primary);
  font-size: 14px;
}

.applicant-documents-summary dd {
  font-weight: 600;
}

.applicant-documents-summary__accepted::before { background: var(--status-success-text); }
.applicant-documents-summary__pending::before { background: var(--status-warning-text); }
.applicant-documents-summary__replacement::before { background: var(--status-error-text); }
.applicant-documents-summary__accepted dd { color: var(--status-success-text); }
.applicant-documents-summary__pending dd { color: var(--status-warning-text); }
.applicant-documents-summary__replacement dd { color: var(--status-error-text); }

.applicant-notification-list {
  display: grid;
  gap: 10px;
}

.applicant-notification-list div {
  display: grid;
  gap: 2px;
}

.applicant-notification-list strong {
  font-size: 13px;
  font-weight: 500;
}

.applicant-notification-list time {
  color: var(--text-secondary);
  font-size: 11px;
}

.applicant-help-banner {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  min-height: 120px;
  overflow: hidden;
  border: 1px solid #d9e7f7;
  border-radius: 16px;
  background: #eef5ff;
}

.applicant-help-banner > div {
  padding: 18px 22px;
}

.applicant-help-banner h2 {
  margin: 0 0 4px;
  font-size: 20px;
  line-height: 26px;
}

.applicant-help-banner p {
  margin: 0 0 10px;
  font-size: 14px;
}

.applicant-help-banner img {
  width: 210px;
  height: 120px;
  object-fit: cover;
}

.layout-applicant .page-head {
  margin: 0 0 20px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.layout-applicant .page-head .eyebrow {
  display: none;
}

.layout-applicant .page-head h1 {
  margin-bottom: 8px;
  font-size: 32px;
  line-height: 38px;
}

.layout-applicant .page-head > p {
  max-width: 760px;
  margin: 0;
  font-size: 15px;
  line-height: 22px;
}

.layout-applicant .page-head .action-row {
  margin-top: 18px;
}

.layout-applicant .detail-grid {
  gap: 18px;
  margin: 0 0 18px;
}

.layout-applicant .info-panel,
.layout-applicant .filter-panel,
.layout-applicant .empty-state {
  padding: 22px;
  border-radius: 16px;
}

.layout-applicant .list-grid {
  gap: 18px;
  margin: 0 0 28px;
}

.layout-applicant .page-panel {
  margin-top: 0;
  margin-bottom: 18px;
}

@media (max-width: 900px) {
  .layout-applicant .workspace-main {
    padding: 24px 24px 110px;
  }

  .applicant-dashboard-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .layout-applicant .workspace-main {
    padding: 18px 16px 100px;
  }

  .layout-applicant .page-head h1 {
    font-size: 28px;
    line-height: 34px;
  }

  .applicant-dashboard {
    gap: 16px;
  }

  .workspace-page-title h1 {
    font-size: 28px;
    line-height: 34px;
  }

  .applicant-dashboard .ui-alert {
    min-height: 0;
  }

  .applicant-active-application__head,
  .applicant-active-application--empty {
    align-items: stretch;
    flex-direction: column;
  }

  .applicant-active-application .application-progress {
    overflow-x: auto;
  }

  .applicant-summary-card {
    min-height: 0;
  }

  .applicant-help-banner img {
    display: none;
  }
}

.applicant-list-page {
  display: grid;
  gap: 18px;
}

.applicant-list-page__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}

.applicant-list-page__head h1 {
  margin: 0 0 8px;
  font-size: 32px;
  line-height: 38px;
}

.applicant-list-page__head p {
  max-width: 760px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 22px;
}

.applicant-list-tabs {
  display: flex;
  gap: 4px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-default);
}

.applicant-list-tabs__item {
  padding: 9px 14px;
  border-radius: 10px;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
}

.applicant-list-tabs__item:hover { color: var(--action-link); }
.applicant-list-tabs__item.is-active { background: var(--status-info-bg); color: var(--action-link); }
.applicant-list-tabs__item.is-disabled { cursor: not-allowed; opacity: .48; }

.applicant-application-list {
  display: grid;
  gap: 12px;
}

.applicant-application-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 270px;
  gap: 24px;
  align-items: center;
  padding: 20px;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--background-surface);
}

.applicant-application-row__number {
  margin: 0 0 5px;
  color: var(--action-link);
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
}

.applicant-application-row h2 {
  margin: 0 0 8px;
  font-size: 17px;
  line-height: 23px;
}

.applicant-application-row__meta,
.applicant-application-row__side p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.applicant-application-row__side {
  display: grid;
  justify-items: start;
  gap: 8px;
}

.applicant-application-row__side .secondary-btn {
  min-height: 36px;
  padding: 8px 14px;
  font-size: 12px;
}

.applicant-documents-table {
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--background-surface);
}

.applicant-documents-table__head,
.applicant-documents-table__row {
  display: grid;
  grid-template-columns: minmax(160px, 1.15fr) minmax(180px, 1.2fr) minmax(150px, .9fr) 110px 190px;
  gap: 12px;
  align-items: center;
}

.applicant-documents-table__head {
  padding: 12px 14px;
  background: var(--background-subtle);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
}

.applicant-documents-table__row {
  min-height: 72px;
  padding: 12px 14px;
  border-top: 1px solid var(--border-default);
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.applicant-documents-table__row strong { color: var(--text-primary); font-size: 13px; }
.applicant-documents-table__version { color: var(--action-link); font-weight: 500; }
.applicant-documents-table__actions { display: flex; align-items: center; gap: 6px; }
.applicant-documents-table__actions > a:not(.secondary-btn) { padding: 8px; color: var(--action-link); font-size: 12px; font-weight: 600; }
.applicant-documents-table__actions .secondary-btn { min-height: 36px; padding: 8px 12px; font-size: 12px; }

.applicant-version-note {
  display: grid;
  gap: 4px;
  padding: 14px;
  border-radius: 12px;
  background: var(--status-info-bg);
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.applicant-version-note strong { color: var(--status-info-text); font-size: 13px; }
.applicant-list-empty { margin: 0; }
.applicant-list-empty .primary-btn { width: fit-content; margin-top: 8px; }

@media (max-width: 700px) {
  .applicant-list-page { gap: 16px; }
  .applicant-list-page__head { gap: 16px; flex-direction: column; }
  .applicant-list-page__head h1 { font-size: 28px; line-height: 34px; }
  .applicant-list-page__head .primary-btn { width: 100%; }
  .applicant-list-tabs { overflow-x: auto; padding-bottom: 10px; }
  .applicant-list-tabs__item { white-space: nowrap; }
  .applicant-application-row { grid-template-columns: 1fr; gap: 14px; padding: 16px; }
  .applicant-documents-table { overflow: visible; border: 0; background: transparent; }
  .applicant-documents-table__head { display: none; }
  .applicant-documents-table__row { display: grid; gap: 10px; min-height: 0; margin-bottom: 10px; padding: 16px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--background-surface); }
  .applicant-documents-table__row > div { display: grid; gap: 2px; }
  .applicant-documents-table__row > div::before { content: attr(data-label); color: var(--text-secondary); font-size: 11px; }
  .applicant-documents-table__actions { display: flex !important; grid-template-columns: none !important; margin-top: 4px; }
  .applicant-documents-table__actions::before { display: none; }
  .applicant-documents-table__actions .secondary-btn { flex: 1; justify-content: center; }
}

.application-detail-page { display: grid; gap: 16px; }
.application-breadcrumbs { display: flex; flex-wrap: wrap; gap: 7px; color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.application-breadcrumbs a { color: var(--text-secondary); }
.application-breadcrumbs a:hover { color: var(--action-link); }

.application-detail-page__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.application-detail-page__head h1 { margin: 0 0 8px; font-size: 30px; line-height: 36px; }
.application-detail-page__head h2 { margin: 0; font-size: 17px; line-height: 24px; }

.application-detail-meta { display: flex; flex-wrap: wrap; gap: 28px; margin: 0; }
.application-detail-meta div { display: grid; gap: 2px; }
.application-detail-meta dt { color: var(--text-secondary); font-size: 10px; line-height: 15px; }
.application-detail-meta dd { margin: 0; color: var(--text-primary); font-size: 12px; font-weight: 500; line-height: 18px; }

.application-detail-page .application-progress { width: 100%; margin: 4px 0; }

.application-detail-tabs { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 5px; border-bottom: 1px solid var(--border-default); }
.application-detail-tabs a { flex: 0 0 auto; padding: 10px 12px 8px; border-bottom: 2px solid transparent; color: var(--text-secondary); font-size: 13px; font-weight: 500; line-height: 18px; }
.application-detail-tabs a:hover, .application-detail-tabs a.is-active { border-color: var(--action-link); color: var(--action-link); }

.application-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 350px; gap: 18px; align-items: start; }
.application-detail-layout__main { display: grid; gap: 14px; }
.application-detail-layout__main .ui-alert { margin: 0; }

.application-documents-panel { display: grid; gap: 10px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.application-documents-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.application-documents-panel__head h2 { margin: 0; font-size: 20px; line-height: 26px; }
.application-documents-panel__head a { color: var(--action-link); font-size: 12px; font-weight: 600; }
.application-document-items { display: grid; gap: 8px; }
.application-document-item { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto auto; gap: 14px; align-items: center; min-height: 76px; padding: 14px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--background-surface); }
.application-document-item.is-replacement-required { border-color: var(--status-error-text); }
.application-document-item__icon { width: 40px; height: 40px; border-radius: 10px; background: var(--status-info-bg); }
.application-document-item__content h3 { margin: 0 0 3px; font-size: 14px; line-height: 20px; }
.application-document-item__content p { margin: 0; color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.application-document-item .primary-btn { min-height: 36px; padding: 8px 13px; font-size: 12px; }
.application-document-item__download { padding: 8px; color: var(--action-link); font-size: 12px; font-weight: 600; }
.application-document-comment { display: grid; gap: 4px; padding: 14px; border-radius: 12px; background: var(--status-info-bg); }
.application-document-comment strong { color: var(--status-info-text); font-size: 13px; }
.application-document-comment p, .application-empty-copy { margin: 0; color: var(--text-primary); font-size: 12px; line-height: 18px; }

.application-detail-layout__side { display: grid; gap: 10px; }
.application-side-card { display: grid; gap: 9px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.application-side-card h2 { margin: 0; color: var(--action-link); font-size: 17px; line-height: 23px; }
.application-side-card p { margin: 0; color: var(--text-secondary); font-size: 11px; line-height: 18px; }
.application-side-card__meta { font-size: 10px !important; }
.application-side-card__state { color: var(--text-primary) !important; font-size: 12px !important; font-weight: 500; }
.application-side-card a { color: var(--action-link); font-size: 11px; font-weight: 600; }
.application-history-card > div { display: grid; gap: 1px; }
.application-history-card time { color: var(--text-secondary); font-size: 10px; }
.application-history-card strong { color: var(--text-primary); font-size: 11px; line-height: 16px; }

@media (max-width: 900px) {
  .application-detail-layout { grid-template-columns: 1fr; }
  .application-detail-layout__side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .application-history-card { grid-column: span 2; }
}

@media (max-width: 700px) {
  .application-detail-page { gap: 14px; }
  .application-detail-page__head { align-items: stretch; flex-direction: column; }
  .application-detail-page__head h1 { font-size: 26px; line-height: 32px; }
  .application-detail-meta { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .application-detail-page .application-progress { overflow-x: auto; }
  .application-detail-tabs { margin: 0 -16px; padding-right: 16px; padding-left: 16px; }
  .application-documents-panel { padding: 16px; }
  .application-documents-panel__head { align-items: flex-start; flex-direction: column; }
  .application-document-item { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; }
  .application-document-item > .status-badge, .application-document-item > .primary-btn, .application-document-item__download { grid-column: 2; justify-self: start; }
  .application-document-item > .primary-btn { width: 100%; justify-content: center; }
  .application-detail-layout__side { grid-template-columns: 1fr; }
  .application-history-card { grid-column: auto; }
}

.applicant-profile-page { display: grid; gap: 12px; }
.applicant-profile-page__head, .applicant-profile-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.applicant-profile-page__head h1 { margin: 0; font-size: 30px; line-height: 36px; }
.applicant-profile-panel { display: grid; gap: 12px; padding: 20px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.applicant-profile-panel h2 { margin: 0; font-size: 19px; line-height: 25px; }
.applicant-profile-panel__head > a:not(.secondary-btn) { color: var(--action-link); font-size: 12px; font-weight: 600; }
.applicant-profile-panel__head .secondary-btn { min-height: 36px; padding: 8px 14px; font-size: 12px; }
.applicant-profile-data { display: flex; flex-wrap: wrap; gap: 22px 50px; margin: 0; }
.applicant-profile-data div { display: grid; gap: 3px; min-width: 150px; }
.applicant-profile-data dt { color: var(--text-secondary); font-size: 10px; line-height: 14px; }
.applicant-profile-data dd { margin: 0; color: var(--text-primary); font-size: 13px; font-weight: 500; line-height: 19px; }
.applicant-profile-records { display: grid; gap: 10px; }
.applicant-profile-record { display: grid; gap: 4px; padding: 14px; border-radius: 12px; background: var(--background-subtle); }
.applicant-profile-record h3, .applicant-profile-record p { margin: 0; }
.applicant-profile-record h3 { font-size: 14px; line-height: 20px; }
.applicant-profile-record strong { font-size: 12px; line-height: 18px; }
.applicant-profile-record p, .applicant-profile-record small, .applicant-profile-empty { color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.applicant-profile-empty { margin: 0; }

@media (max-width: 700px) {
  .applicant-profile-page { gap: 10px; }
  .applicant-profile-page__head { align-items: stretch; flex-direction: column; }
  .applicant-profile-page__head h1 { font-size: 28px; line-height: 34px; }
  .applicant-profile-page__head .primary-btn { width: 100%; }
  .applicant-profile-panel { padding: 16px; }
  .applicant-profile-panel__head { align-items: flex-start; flex-direction: column; }
  .applicant-profile-panel__head .secondary-btn { width: 100%; justify-content: center; }
  .applicant-profile-data { display: grid; grid-template-columns: 1fr; gap: 12px; }
}

.applicant-form-page { display: grid; gap: 18px; max-width: 820px; }
.applicant-form-page > h1 { margin: 0; font-size: 30px; line-height: 36px; }
.applicant-form-page__lead { margin: -8px 0 0; color: var(--text-secondary); font-size: 14px; line-height: 21px; }
.applicant-form-card { display: grid; gap: 16px; padding: 24px; border: 1px solid var(--border-default); border-radius: 16px; background: var(--background-surface); }
.applicant-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.applicant-form-grid .form-field__errors, .applicant-form-grid .form-field__help { grid-column: 1 / -1; }
.applicant-form-grid .form-checkbox { grid-column: 1 / -1; }
.applicant-contact-form__email { grid-column: 1 / -1; }
.applicant-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 4px; }
.applicant-form-actions > a { padding: 10px 12px; color: var(--action-link); font-size: 13px; font-weight: 600; }

@media (max-width: 700px) {
  .applicant-form-page { gap: 14px; }
  .applicant-form-page > h1 { font-size: 28px; line-height: 34px; }
  .applicant-form-card { padding: 16px; }
  .applicant-form-grid { grid-template-columns: 1fr; gap: 14px; }
  .applicant-form-actions { justify-content: stretch; }
  .applicant-form-actions > a, .applicant-form-actions .primary-btn { flex: 1; justify-content: center; }
}

.applicant-status-page { display: grid; gap: 18px; }
.applicant-status-page__head { display: grid; gap: 8px; }
.applicant-status-page__head h1 { margin: 0; font-size: 30px; line-height: 36px; }
.applicant-status-page__head p { margin: 0; color: var(--text-secondary); font-size: 13px; line-height: 20px; }
.applicant-status-list { display: grid; gap: 12px; }
.applicant-status-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 20px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.applicant-status-row__number { margin: 0 0 4px; color: var(--text-secondary); font-size: 11px; line-height: 16px; }
.applicant-status-row h2 { margin: 0 0 6px; font-size: 16px; line-height: 24px; }
.applicant-status-row__main { margin: 0 0 4px !important; color: var(--text-primary) !important; font-size: 13px !important; font-weight: 500; }
.applicant-status-row > div:first-child > p:last-child { margin: 0; color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.applicant-status-row__actions { display: grid; justify-items: end; gap: 8px; }
.applicant-status-row__actions .secondary-btn { min-height: 36px; padding: 8px 14px; font-size: 12px; }

@media (max-width: 700px) {
  .applicant-status-page { gap: 14px; }
  .applicant-status-page__head h1 { font-size: 28px; line-height: 34px; }
  .applicant-status-row { grid-template-columns: 1fr; padding: 16px; }
  .applicant-status-row__actions { justify-items: start; }
}

.applicant-results-list { display: grid; gap: 12px; }
.applicant-result-card { display: grid; gap: 14px; padding: 22px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.applicant-result-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.applicant-result-card h2 { margin: 0 0 5px; font-size: 17px; line-height: 24px; }
.applicant-result-card header p:last-child { margin: 0; color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.applicant-result-card__data { display: flex; flex-wrap: wrap; gap: 20px 48px; margin: 0; }
.applicant-result-card__data div { display: grid; gap: 2px; }
.applicant-result-card__data dt { color: var(--text-secondary); font-size: 10px; line-height: 15px; }
.applicant-result-card__data dd { margin: 0; color: var(--text-primary); font-size: 13px; font-weight: 500; line-height: 19px; }
.applicant-result-card .secondary-btn { width: fit-content; min-height: 36px; padding: 8px 14px; font-size: 12px; }

.applicant-notifications-page { display: grid; gap: 18px; }
.applicant-notifications-page__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.applicant-notifications-page__head h1 { margin: 0; font-size: 30px; line-height: 36px; }
.applicant-notifications-page__head p { margin: 6px 0 0; color: var(--text-secondary); font-size: 12px; }
.applicant-notifications-page__head .link-button { padding: 10px 12px; color: var(--action-link); font-size: 12px; font-weight: 600; }
.applicant-notifications-list { display: grid; gap: 12px; }
.applicant-notification { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 16px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--background-surface); }
.applicant-notification.is-unread { background: var(--status-info-bg); }
.applicant-notification__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--status-success-text); }
.applicant-notification.is-unread .applicant-notification__dot { background: var(--status-warning-text); }
.applicant-notification__content { display: grid; gap: 3px; }
.applicant-notification__content h2, .applicant-notification__content p { margin: 0; }
.applicant-notification__content h2 { font-size: 14px; line-height: 20px; }
.applicant-notification__content p { color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.applicant-notification__content time { color: var(--text-secondary); font-size: 10px; line-height: 15px; }
.applicant-notification__actions { display: flex; align-items: center; gap: 8px; }
.applicant-notification__actions .secondary-btn { min-height: 36px; padding: 8px 12px; font-size: 12px; }
.applicant-notification__actions > a { padding: 8px; color: var(--action-link); font-size: 12px; font-weight: 600; }

@media (max-width: 700px) {
  .applicant-result-card { padding: 16px; }
  .applicant-result-card header { display: grid; }
  .applicant-result-card__data { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .applicant-result-card .secondary-btn { width: 100%; justify-content: center; }
  .applicant-notifications-page { gap: 14px; }
  .applicant-notifications-page__head { align-items: stretch; flex-direction: column; }
  .applicant-notifications-page__head h1 { font-size: 28px; line-height: 34px; }
  .applicant-notification { grid-template-columns: 8px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .applicant-notification__actions { grid-column: 2; }
}

.staff-dashboard-page, .staff-registry-page { display: grid; gap: 16px; }
.staff-page-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.staff-page-head h1 { margin: 0; font-size: 30px; line-height: 36px; }
.staff-page-head .secondary-btn { min-height: 36px; padding: 8px 14px; font-size: 12px; }
.staff-dashboard-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.staff-dashboard-stat { display: grid; gap: 6px; min-height: 92px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.staff-dashboard-stat span { color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.staff-dashboard-stat strong { color: var(--text-primary); font-size: 28px; line-height: 30px; }
.staff-dashboard-stat em { width: fit-content; font-style: normal; }
.staff-dashboard-feed { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.staff-dashboard-applications, .staff-dashboard-events { display: grid; gap: 10px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.staff-dashboard-applications header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.staff-dashboard-applications h2, .staff-dashboard-events h2 { margin: 0; font-size: 18px; line-height: 24px; }
.staff-dashboard-applications header a { color: var(--action-link); font-size: 11px; font-weight: 600; }
.staff-dashboard-applications__list { display: grid; }
.staff-dashboard-applications__list > a { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 10px 0; border-top: 1px solid var(--border-default); }
.staff-dashboard-applications__list > a span { color: var(--action-link); font-size: 11px; font-weight: 500; }
.staff-dashboard-applications__list > a strong { color: var(--text-primary); font-size: 12px; font-weight: 500; }
.staff-dashboard-events > div { display: grid; gap: 2px; }
.staff-dashboard-events time { color: var(--text-secondary); font-size: 10px; }
.staff-dashboard-events strong { color: var(--text-primary); font-size: 11px; line-height: 18px; }
.staff-dashboard-events p, .staff-dashboard-applications__list > p { margin: 0; color: var(--text-secondary); font-size: 12px; }

.staff-registry-filters { display: grid; grid-template-columns: minmax(190px, 1.25fr) repeat(3, minmax(150px, 1fr)) auto; gap: 8px; align-items: end; }
.staff-registry-filters label { display: grid; gap: 5px; color: var(--text-primary); font-size: 11px; font-weight: 500; }
.staff-registry-filters input, .staff-registry-filters select { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--background-surface); color: var(--text-primary); font: inherit; font-size: 12px; }
.staff-registry-filters .primary-btn { min-height: 38px; padding: 8px 14px; font-size: 12px; }
.staff-applications-table { overflow: hidden; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.staff-applications-table__head, .staff-applications-table__row { display: grid; grid-template-columns: 1.1fr .55fr 1.2fr 1.55fr 1.25fr 1fr .55fr .65fr; gap: 6px; align-items: center; }
.staff-applications-table__head { padding: 10px 12px; background: var(--background-subtle); color: var(--text-secondary); font-size: 10px; font-weight: 500; line-height: 15px; }
.staff-applications-table__row { min-height: 56px; padding: 10px 12px; border-top: 1px solid var(--border-default); color: var(--text-primary); font-size: 11px; line-height: 18px; }
.staff-applications-table__row > a:first-child, .staff-applications-table__open { color: var(--action-link); font-weight: 500; }
.staff-applications-table__row .status-badge { justify-self: start; font-size: 10px; }
.staff-applications-table__open { padding: 7px 0; font-size: 11px; font-weight: 600; }
.staff-applications-table__empty { margin: 0; padding: 22px; color: var(--text-secondary); font-size: 13px; }

@media (max-width: 1023px) {
  .staff-dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .staff-dashboard-feed { grid-template-columns: 1fr; }
  .staff-registry-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .staff-page-head { align-items: stretch; flex-direction: column; }
  .staff-page-head h1 { font-size: 28px; line-height: 34px; }
  .staff-page-head .secondary-btn { width: 100%; justify-content: center; }
  .staff-dashboard-stats, .staff-registry-filters { grid-template-columns: 1fr; }
  .staff-dashboard-applications__list > a { grid-template-columns: 1fr; gap: 4px; }
  .staff-applications-table { overflow: visible; border: 0; background: transparent; }
  .staff-applications-table__head { display: none; }
  .staff-applications-table__body { display: grid; gap: 10px; }
  .staff-applications-table__row { display: grid; gap: 8px; min-height: 0; padding: 16px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--background-surface); }
  .staff-applications-table__row > span, .staff-applications-table__row > a { display: grid; gap: 2px; }
  .staff-applications-table__row > span::before, .staff-applications-table__row > a:first-child::before { content: attr(data-label); color: var(--text-secondary); font-size: 10px; font-weight: 400; }
  .staff-applications-table__open { display: block !important; padding: 8px 0 !important; }
}

.staff-application-page { display: grid; gap: 14px; }
.staff-application-page__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.staff-application-page__head h1 { margin: 0; font-size: 28px; line-height: 34px; }
.staff-application-summary { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr); gap: 26px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.staff-application-summary__applicant { display: flex; align-items: center; gap: 14px; }
.staff-application-summary__applicant > div { width: 54px; height: 54px; border-radius: 50%; background: var(--status-info-bg); }
.staff-application-summary__applicant p, .staff-application-summary__applicant p > * { display: block; margin: 0; }
.staff-application-summary__applicant strong { font-size: 16px; line-height: 22px; }.staff-application-summary__applicant span, .staff-application-summary__applicant small { color: var(--text-secondary); font-size: 11px; line-height: 17px; }.staff-application-summary__applicant a { color: var(--action-link); font-size: 12px; }
.staff-application-summary dl { display: grid; gap: 5px; margin: 0; }.staff-application-summary dl div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 10px; }.staff-application-summary dt { color: var(--text-secondary); font-size: 11px; }.staff-application-summary dd { margin: 0; font-size: 12px; font-weight: 500; line-height: 18px; }
.staff-application-page .application-progress { width: 100%; margin: 0; }
.staff-application-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 16px; align-items: start; }
.staff-document-review, .staff-application-side > section { display: grid; gap: 10px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }.staff-document-review h2, .staff-application-side h2 { margin: 0; font-size: 18px; line-height: 24px; }
.staff-document-review__head, .staff-document-review__row { display: grid; grid-template-columns: 1.2fr .7fr .75fr 2fr; gap: 8px; align-items: center; }.staff-document-review__head { padding: 8px 10px; background: var(--background-subtle); color: var(--text-secondary); font-size: 10px; }.staff-document-review__row { padding: 10px; border-top: 1px solid var(--border-default); font-size: 11px; line-height: 18px; }.staff-document-review__row > span { color: var(--text-secondary); }.staff-document-review__row > div { display: grid; gap: 7px; }.staff-document-review__row > div > a { color: var(--action-link); font-weight: 600; }.staff-document-review__row form { display: flex; flex-wrap: wrap; gap: 6px; }.staff-document-review__row input, .staff-application-side input, .staff-application-side select { min-height: 34px; padding: 7px 9px; border: 1px solid var(--border-strong); border-radius: 8px; font: inherit; font-size: 11px; }.staff-document-review__row input { min-width: 150px; flex: 1; }.staff-document-review__row .primary-btn, .staff-document-review__row .danger-btn, .staff-application-side .primary-btn, .staff-application-side .secondary-btn { min-height: 34px; padding: 7px 10px; font-size: 11px; }.staff-document-review__row p { margin: 0; color: var(--status-error-text); font-size: 10px; }.staff-document-review__empty { margin: 0; color: var(--text-secondary); font-size: 12px; }
.staff-application-side { display: grid; gap: 12px; }.staff-application-side dl { display: grid; gap: 7px; margin: 0; }.staff-application-side dl div { display: grid; gap: 2px; }.staff-application-side dt { color: var(--text-secondary); font-size: 10px; }.staff-application-side dd, .staff-application-side p { margin: 0; font-size: 12px; line-height: 18px; }.staff-application-side form { display: grid; gap: 8px; }.staff-application-history { display: grid; gap: 1px; }.staff-application-history time { color: var(--text-secondary); font-size: 10px; }.staff-application-history strong { font-size: 11px; line-height: 17px; }
@media (max-width: 1023px) { .staff-application-summary, .staff-application-layout { grid-template-columns: 1fr; } .staff-application-side { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .staff-application-page__head { align-items: stretch; flex-direction: column; }.staff-application-summary { padding: 16px; gap: 18px; }.staff-application-summary dl div { grid-template-columns: 1fr; gap: 2px; }.staff-application-page .application-progress { overflow-x: auto; }.staff-application-side { grid-template-columns: 1fr; }.staff-document-review { padding: 14px; overflow: visible; }.staff-document-review__head { display: none; }.staff-document-review__row { grid-template-columns: 1fr; padding: 12px 0; }.staff-document-review__row > strong::before, .staff-document-review__row > span::before { display: block; margin-bottom: 2px; color: var(--text-secondary); font-size: 10px; font-weight: 400; }.staff-document-review__row > strong::before { content: "Документ"; }.staff-document-review__row > span:nth-child(2)::before { content: "Версия / дата"; }.staff-document-review__row > span:nth-child(3)::before { content: "Статус"; } }

.staff-simple-registry .staff-page-head > span { color: var(--text-secondary); font-size: 12px; }
.staff-registry-filters--single { grid-template-columns: minmax(260px, 520px) auto; justify-content: start; }
.staff-registry-filters--document { grid-template-columns: 240px minmax(260px, 1fr) auto; }
.staff-registry-filters--audit { grid-template-columns: minmax(280px, 500px) minmax(240px, 280px) auto; justify-content: start; }
.staff-registry-filters--document p { margin: 0; align-self: center; color: var(--text-secondary); font-size: 11px; line-height: 17px; }
.staff-simple-table { overflow: hidden; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.staff-simple-table__head, .staff-simple-table__row { display: grid; gap: 6px; align-items: center; }
.staff-simple-table__head { padding: 10px 12px; background: var(--background-subtle); color: var(--text-secondary); font-size: 10px; font-weight: 500; line-height: 14px; }
.staff-simple-table__row { min-height: 62px; padding: 10px 12px; border-top: 1px solid var(--border-default); color: var(--text-primary); font-size: 11px; line-height: 18px; }
.staff-simple-table__row > a:first-child, .staff-simple-table__open { color: var(--action-link); font-weight: 500; }
.staff-simple-table__row .status-badge { justify-self: start; font-size: 10px; }
.staff-simple-table__row time { color: var(--text-primary); }
.staff-simple-table__open { min-height: 34px; padding: 7px 10px; font-size: 11px; }
.staff-simple-table__empty { margin: 0; padding: 22px; color: var(--text-secondary); font-size: 13px; }
.staff-users-table .staff-simple-table__head, .staff-users-table .staff-simple-table__row { grid-template-columns: 1.35fr 1.6fr 1.05fr .75fr .85fr .72fr; }
.staff-documents-table .staff-simple-table__head, .staff-documents-table .staff-simple-table__row { grid-template-columns: 1.1fr 1.5fr 1.85fr 1.35fr 1.05fr .62fr .8fr; }
.staff-exams-table .staff-simple-table__head, .staff-exams-table .staff-simple-table__row { grid-template-columns: 2.05fr 1.65fr 1.05fr 1.05fr .95fr .75fr .8fr; }
.staff-audit-table .staff-simple-table__head, .staff-audit-table .staff-simple-table__row { grid-template-columns: 1.4fr .9fr 1fr 1.1fr 2.1fr; }

@media (max-width: 1023px) {
  .staff-registry-filters--document { grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr) auto; }
  .staff-registry-filters--audit { grid-template-columns: minmax(0, 1fr) minmax(220px, .8fr) auto; }
}

@media (max-width: 700px) {
  .staff-registry-filters--single, .staff-registry-filters--document, .staff-registry-filters--audit { grid-template-columns: 1fr; }
  .staff-registry-filters--document p { align-self: auto; }
  .staff-simple-table { overflow: visible; border: 0; background: transparent; }
  .staff-simple-table__head { display: none; }
  .staff-simple-table__body { display: grid; gap: 10px; }
  .staff-simple-table__row, .staff-users-table .staff-simple-table__row, .staff-documents-table .staff-simple-table__row, .staff-exams-table .staff-simple-table__row, .staff-audit-table .staff-simple-table__row { grid-template-columns: 1fr; gap: 8px; min-height: 0; padding: 16px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--background-surface); }
  .staff-simple-table__row > span, .staff-simple-table__row > time, .staff-simple-table__row > a { display: grid; gap: 2px; }
  .staff-simple-table__row > span::before, .staff-simple-table__row > time::before, .staff-simple-table__row > a:first-child::before { content: attr(data-label); color: var(--text-secondary); font-size: 10px; font-weight: 400; }
  .staff-simple-table__row > span .status-badge::before { display: none; }
  .staff-simple-table__open { display: block !important; width: fit-content; padding: 8px 12px; }
}

.staff-entity-page { display: grid; gap: 14px; }
.staff-breadcrumbs { display: flex; flex-wrap: wrap; gap: 6px; color: var(--text-secondary); font-size: 12px; line-height: 16px; }
.staff-breadcrumbs a { color: var(--text-secondary); }
.staff-breadcrumbs a:hover { color: var(--action-link); }
.staff-entity-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 44px; }
.staff-entity-head h1 { margin: 0; font-size: 28px; line-height: 36px; overflow-wrap: anywhere; }
.staff-entity-head__identity { display: flex; flex: 1 1 auto; align-items: center; gap: 14px; min-width: 0; }
.staff-entity-head__identity > div:last-child { min-width: 0; }
.staff-entity-head__identity p { margin: 3px 0 0; color: var(--text-secondary); font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
.staff-entity-head__actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.staff-entity-head__actions .secondary-btn { min-height: 36px; padding: 8px 14px; font-size: 12px; }
.staff-user-avatar { display: grid; flex: 0 0 60px; width: 60px; height: 60px; place-items: center; border-radius: 50%; background: var(--status-info-bg); color: var(--status-info-text); font-size: 18px; font-weight: 700; line-height: 1; }
.staff-entity-tabs { display: flex; gap: 3px; overflow-x: auto; border-bottom: 1px solid var(--border-default); scrollbar-width: thin; }
.staff-entity-tabs a { flex: 0 0 auto; padding: 10px 12px; border-bottom: 2px solid transparent; color: var(--text-secondary); font-size: 12px; font-weight: 500; line-height: 16px; }
.staff-entity-tabs a:hover { color: var(--action-link); }
.staff-entity-tabs a.is-active { border-bottom-color: var(--action-primary); color: var(--action-link); }
.staff-user-overview, .staff-user-collections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.staff-entity-card { display: grid; gap: 10px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.staff-entity-card h2 { margin: 0; color: var(--text-primary); font-size: 18px; line-height: 24px; }
.staff-entity-card > p, .staff-compact-list > p, .staff-document-collection > p, .staff-application-collection > p { margin: 0; color: var(--text-secondary); font-size: 12px; line-height: 18px; }
.staff-field-list { display: grid; gap: 9px; margin: 0; }
.staff-field-list div { display: grid; grid-template-columns: minmax(110px, .7fr) minmax(0, 1.3fr); gap: 12px; }
.staff-field-list dt { color: var(--text-secondary); font-size: 11px; line-height: 17px; }
.staff-field-list dd { margin: 0; color: var(--text-primary); font-size: 12px; font-weight: 500; line-height: 18px; overflow-wrap: anywhere; text-align: right; }
.staff-compact-list { display: grid; gap: 0; }
.staff-compact-list--employment { margin-top: 2px; }
.staff-compact-row { display: grid; gap: 3px; padding: 9px 0; border-bottom: 1px solid var(--border-default); }
.staff-compact-row:first-child { padding-top: 0; }
.staff-compact-row:last-child { padding-bottom: 0; border-bottom: 0; }
.staff-compact-row strong { color: var(--text-primary); font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
.staff-compact-row span { color: var(--text-secondary); font-size: 11px; line-height: 17px; overflow-wrap: anywhere; }
.staff-document-collection, .staff-application-collection { display: grid; }
.staff-document-collection article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--border-default); }
.staff-document-collection article:last-child { border-bottom: 0; }
.staff-document-collection strong { color: var(--text-primary); font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
.staff-document-collection a { flex: 0 0 auto; color: var(--action-link); font-size: 11px; font-weight: 600; }
.staff-document-collection span { color: var(--text-secondary); font-size: 11px; }
.staff-application-collection article { display: grid; gap: 5px; padding: 9px 0; border-bottom: 1px solid var(--border-default); }
.staff-application-collection article:first-child { padding-top: 0; }
.staff-application-collection article:last-child { padding-bottom: 0; border-bottom: 0; }
.staff-application-collection a { color: var(--action-link); font-size: 11px; font-weight: 600; }
.staff-application-collection strong { color: var(--text-primary); font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
.staff-application-collection .status-badge { justify-self: start; font-size: 10px; }
.staff-session-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.staff-session-stat { display: grid; align-content: start; gap: 8px; min-height: 94px; padding: 18px; border: 1px solid var(--border-default); border-radius: 14px; background: var(--background-surface); }
.staff-session-stat span { color: var(--text-secondary); font-size: 10px; line-height: 14px; }
.staff-session-stat strong { color: var(--text-primary); font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
.staff-session-qualifications > div { display: grid; }
.staff-session-qualifications article { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--border-default); }
.staff-session-qualifications article:first-child { padding-top: 0; }
.staff-session-qualifications article:last-child { padding-bottom: 0; border-bottom: 0; }
.staff-session-qualifications strong { color: var(--text-primary); font-size: 12px; font-weight: 500; line-height: 18px; overflow-wrap: anywhere; }
.staff-session-qualifications span { flex: 0 0 auto; color: var(--text-secondary); font-size: 11px; line-height: 17px; white-space: nowrap; }
.staff-session-participants { gap: 12px; }
.staff-session-participants > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.staff-session-participants > header span { color: var(--text-secondary); font-size: 11px; }
.staff-session-participants__table { overflow: hidden; border: 1px solid var(--border-default); border-radius: 10px; }
.staff-session-participants__head, .staff-session-participants__row { display: grid; grid-template-columns: .95fr 1.45fr 2fr 1fr 1fr; gap: 6px; align-items: center; }
.staff-session-participants__head { padding: 10px 12px; background: var(--background-subtle); color: var(--text-secondary); font-size: 10px; font-weight: 500; line-height: 14px; }
.staff-session-participants__row { min-height: 48px; padding: 9px 12px; border-top: 1px solid var(--border-default); color: var(--text-primary); font-size: 11px; line-height: 18px; }
.staff-session-participants__row a { color: var(--action-link); font-weight: 500; }
.staff-session-participants__row > span { overflow-wrap: anywhere; }
.staff-session-participants__row .status-badge { justify-self: start; font-size: 10px; }
.staff-session-participants__empty { margin: 0; padding: 20px; color: var(--text-secondary); font-size: 12px; }

@media (max-width: 1023px) {
  .staff-session-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .staff-session-stat { min-height: 82px; }
}

@media (max-width: 700px) {
  .staff-breadcrumbs { display: none; }
  .staff-entity-page { gap: 14px; }
  .staff-entity-head, .staff-entity-head__identity { align-items: flex-start; }
  .staff-entity-head { flex-direction: column; }
  .staff-entity-head h1 { font-size: 27px; line-height: 34px; }
  .staff-entity-head__actions { justify-content: flex-start; }
  .staff-user-avatar { display: none; }
  .staff-entity-tabs { width: 100%; padding-bottom: 1px; border-bottom: 0; }
  .staff-entity-tabs a { padding: 7px 10px; border: 1px solid var(--border-strong); border-radius: 8px; color: var(--text-primary); }
  .staff-entity-tabs a.is-active { border-color: var(--border-strong); background: var(--status-info-bg); color: var(--action-link); }
  .staff-user-overview, .staff-user-collections { grid-template-columns: 1fr; }
  .staff-entity-card { padding: 14px; border-radius: 12px; }
  .staff-entity-card h2 { font-size: 17px; line-height: 23px; }
  .staff-field-list div { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 8px; }
  .staff-session-stats { gap: 0; overflow: hidden; border: 1px solid var(--border-default); border-radius: 12px; background: var(--background-surface); }
  .staff-session-stat { display: flex; align-items: flex-start; justify-content: space-between; min-height: 0; padding: 10px 14px; border: 0; border-bottom: 1px solid var(--border-default); border-radius: 0; }
  .staff-session-stat:last-child { border-bottom: 0; }
  .staff-session-stat strong { max-width: 62%; text-align: right; }
  .staff-session-qualifications article { gap: 8px; flex-direction: column; }
  .staff-session-participants { padding: 0; border: 0; background: transparent; }
  .staff-session-participants > header { padding: 0 2px; }
  .staff-session-participants__table { overflow: visible; border: 0; border-radius: 0; }
  .staff-session-participants__head { display: none; }
  .staff-session-participants__body { display: grid; gap: 10px; }
  .staff-session-participants__row { grid-template-columns: 1fr; gap: 7px; min-height: 0; padding: 14px; border: 1px solid var(--border-default); border-radius: 12px; background: var(--background-surface); }
  .staff-session-participants__row > span, .staff-session-participants__row > a { display: grid; gap: 2px; }
  .staff-session-participants__row > span::before, .staff-session-participants__row > a::before { content: attr(data-label); color: var(--text-secondary); font-size: 10px; font-weight: 400; }
  .staff-session-participants__row > span .status-badge::before { display: none; }
}

.layout-error {
  min-height: 100vh;
  background: var(--background-page);
}

.error-page {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 24px;
}

.error-page__content {
  display: grid;
  width: min(560px, 100%);
  gap: 14px;
  padding: 32px;
  border: 1px solid var(--border-default);
  border-radius: 14px;
  background: var(--surface);
}

.error-page__content h1,
.error-page__content p {
  margin: 0;
}

.error-page__code {
  color: var(--accent);
  font-size: 18px;
  font-weight: 800;
}

.error-page__content .primary-btn {
  justify-self: start;
  margin-top: 6px;
}

@media (min-width: 701px) {
  .layout-public--home .public-hero {
    display: block;
    position: relative;
    isolation: isolate;
  }

  .layout-public--home .public-hero::before {
    position: absolute;
    z-index: 1;
    inset: 0;
    content: "";
    background: linear-gradient(
      90deg,
      #f6f9fd 0%,
      rgba(246, 249, 253, 0.98) 33%,
      rgba(246, 249, 253, 0.72) 50%,
      rgba(246, 249, 253, 0.2) 67%,
      rgba(246, 249, 253, 0) 84%
    );
  }

  .layout-public--home .public-hero__media {
    position: absolute;
    z-index: 0;
    inset: 0;
    height: auto;
  }

  .layout-public--home .public-hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .layout-public--home .public-hero__content {
    position: relative;
    z-index: 2;
    box-sizing: border-box;
    width: min(56%, 680px);
    min-height: 500px;
  }
}
