/* Дизайн молодых - прототип платформы (П7б).
   Часть 1: токены дизайн-системы заказчика v1.0 (tokens.css, без изменений).
   Часть 2: общая обвязка экранов прототипа.
   Самодостаточно: шрифт Manrope и все картинки лежат рядом в assets/,
   картинки вырезаны из бордов дизайн-системы заказчика (assets/previews). */

@font-face {
  font-family: "Manrope";
  src: url("../fonts/Manrope.ttf") format("truetype-variations");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

/* ===== Часть 1. Токены заказчика ===== */
:root {
  --dm-black: #0B0B0D;
  --dm-white: #FFFFFF;
  --dm-graphite: #1A1B1F;
  --dm-light-gray: #F2F3F6;
  --dm-line: #E6E8EF;
  --dm-surface: #FFFFFF;
  --dm-surface-soft: #FAFAFC;

  --dm-magenta: #FF2CE6;
  --dm-cyan: #00E5FF;
  --dm-violet: #6C2CFF;
  --dm-iridescent: #F6F0FF;

  --dm-success: #22C55E;
  --dm-warning: #F59E0B;
  --dm-info: #3B82F6;
  --dm-danger: #EF4444;

  --dm-ai: var(--dm-violet);
  --dm-human: var(--dm-black);

  --dm-font-ui: Manrope, Arial, sans-serif;

  --dm-radius-sm: 8px;
  --dm-radius-md: 12px;
  --dm-radius-lg: 16px;
  --dm-radius-xl: 24px;
  --dm-radius-xxl: 32px;
  --dm-radius-pill: 999px;

  --dm-shadow-card: 0 8px 28px rgba(11, 11, 13, 0.06);
  --dm-shadow-focus: 0 0 0 4px rgba(108, 44, 255, 0.18);

  --dm-gradient-primary: linear-gradient(100deg, #FF2CE6 0%, #6C2CFF 52%, #00E5FF 100%);
  --dm-gradient-soft: radial-gradient(circle at 10% 10%, rgba(255,44,230,.18), transparent 32%), radial-gradient(circle at 90% 20%, rgba(0,229,255,.16), transparent 35%), #FFFFFF;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--dm-font-ui);
  background: var(--dm-surface-soft);
  color: var(--dm-black);
}

.dm-container { max-width: 1280px; margin: 0 auto; padding: 24px; }
.dm-grid-12 { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }

.dm-display { font-size: 72px; line-height: 80px; font-weight: 800; letter-spacing: -0.02em; }
.dm-page-title { font-size: 40px; line-height: 48px; font-weight: 800; letter-spacing: -0.01em; }
.dm-section-title { font-size: 24px; line-height: 32px; font-weight: 700; }
.dm-body { font-size: 16px; line-height: 24px; }
.dm-caption { font-size: 12px; line-height: 16px; color: #667085; }

.dm-card {
  background: var(--dm-surface);
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-lg);
  box-shadow: var(--dm-shadow-card);
}

.dm-button-primary {
  appearance: none;
  border: 0;
  border-radius: var(--dm-radius-md);
  background: var(--dm-gradient-primary);
  color: white;
  font: 700 14px/16px var(--dm-font-ui);
  min-height: 48px;
  padding: 0 22px;
  cursor: pointer;
}

.dm-button-secondary {
  appearance: none;
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-md);
  background: white;
  color: var(--dm-black);
  font: 700 14px/16px var(--dm-font-ui);
  min-height: 48px;
  padding: 0 22px;
  cursor: pointer;
}

.dm-input {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-md);
  background: white;
  padding: 0 16px;
  font: 400 16px/24px var(--dm-font-ui);
}
.dm-input:focus { outline: none; box-shadow: var(--dm-shadow-focus); border-color: var(--dm-violet); }

.dm-badge-ai, .dm-badge-human {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  padding: 6px 10px;
  border-radius: var(--dm-radius-pill);
  font: 700 12px/16px var(--dm-font-ui);
}
.dm-badge-ai { color: var(--dm-violet); background: rgba(108, 44, 255, 0.08); }
.dm-badge-human { color: var(--dm-black); background: rgba(11, 11, 13, 0.06); }

/* иконка ИИ из дизайн-системы (assets/icons/ai_spark.svg) */
.dm-spark {
  width: 16px; height: 16px;
  background: url("../icons/ai_spark.svg") center / contain no-repeat;
  display: inline-block;
  flex: none;
}

.dm-stage-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  align-items: start;
}
.dm-stage {
  position: relative;
  display: grid;
  gap: 6px;
  font: 700 12px/16px var(--dm-font-ui);
  color: #667085;
}
.dm-stage::before {
  content: "";
  width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--dm-line);
  background: white;
}
.dm-stage.is-active { color: var(--dm-violet); }
.dm-stage.is-active::before { border-color: var(--dm-violet); background: rgba(108,44,255,.12); }

.dm-stat {
  padding: 18px;
  border-radius: var(--dm-radius-lg);
  border: 1px solid var(--dm-line);
  background: white;
}
.dm-stat strong { display: block; font-size: 32px; line-height: 36px; letter-spacing: -0.02em; }

@media (max-width: 900px) {
  .dm-grid-12 { grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .dm-container { padding: 16px; }
  .dm-display { font-size: 44px; line-height: 48px; }
  .dm-page-title { font-size: 32px; line-height: 38px; }
}

/* ===== Часть 2. Обвязка прототипа ===== */

/* пройденный этап на полосе */
.dm-stage.is-done { color: var(--dm-black); }
.dm-stage.is-done::before {
  border-color: var(--dm-success);
  background: rgba(34,197,94,.14);
  content: "";
}

/* маркер человека - иконка из дизайн-системы (assets/icons/human_decision.svg) */
.dm-dot {
  width: 15px; height: 15px;
  background: url("../icons/human_decision.svg") center / contain no-repeat;
  display: inline-block;
  flex: none;
}

/* служебная полоса прототипа сверху */
.dm-proto-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  background: var(--dm-graphite);
  color: #C9CCD6;
  font: 700 12px/16px var(--dm-font-ui);
  padding: 10px 24px;
}
.dm-proto-bar a { color: #C9CCD6; text-decoration: none; white-space: nowrap; }
.dm-proto-bar a:hover { color: var(--dm-white); }
.dm-proto-bar__index { flex: 1; text-align: center; overflow: hidden; text-overflow: ellipsis; }

/* сквозной подвал принципа */
.dm-principle-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px 14px;
  border-top: 1px solid var(--dm-line);
  background: var(--dm-surface);
  padding: 16px 24px;
  margin-top: 32px;
  font: 400 13px/18px var(--dm-font-ui);
  color: #667085;
}

/* каркас кабинета: сайдбар + контент */
.dm-app-shell {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 24px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 24px;
  align-items: start;
}
.dm-sidebar {
  background: var(--dm-black);
  border: 1px solid var(--dm-black);
  border-radius: var(--dm-radius-lg);
  padding: 16px 10px;
  display: grid;
  gap: 2px;
  position: sticky;
  top: 16px;
}
.dm-sidebar .dm-logo { padding: 6px 12px 14px; }
.dm-sidebar .dm-logo img { width: 130px; display: block; }
.dm-sidebar a {
  display: block;
  padding: 10px 12px;
  border-radius: var(--dm-radius-sm);
  color: #C9CCD6;
  font: 700 14px/20px var(--dm-font-ui);
  text-decoration: none;
}
.dm-sidebar a:hover { background: rgba(255,255,255,.08); color: var(--dm-white); }
.dm-sidebar a.is-active { background: var(--dm-iridescent); color: var(--dm-violet); }

/* шапка внутри кабинета */
.dm-app-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.dm-app-header .dm-avatar {
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--dm-iridescent);
  color: var(--dm-violet);
  display: inline-flex; align-items: center; justify-content: center;
  font: 800 16px/1 var(--dm-font-ui);
  flex: none;
}
.dm-app-header .dm-who strong { display: block; font-size: 18px; line-height: 24px; }
.dm-app-header .dm-who span { font-size: 13px; color: #667085; }

/* счетчик дедлайна */
.dm-deadline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-pill);
  background: var(--dm-surface);
  font: 700 13px/18px var(--dm-font-ui);
}
.dm-deadline strong { color: var(--dm-violet); }

/* статусы */
.dm-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--dm-radius-pill);
  font: 700 11px/16px var(--dm-font-ui);
  letter-spacing: .04em;
  text-transform: uppercase;
}
.dm-status.is-ok { color: #15803D; background: rgba(34,197,94,.12); }
.dm-status.is-warn { color: #B45309; background: rgba(245,158,11,.14); }
.dm-status.is-info { color: #1D4ED8; background: rgba(59,130,246,.12); }
.dm-status.is-danger { color: #B91C1C; background: rgba(239,68,68,.12); }

/* карточка стенда полигона / проверки */
.dm-check-card { padding: 18px; display: grid; gap: 10px; }
.dm-check-card summary {
  cursor: pointer;
  font: 700 15px/20px var(--dm-font-ui);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  list-style: none;
}
.dm-check-card summary::-webkit-details-marker { display: none; }
.dm-check-card summary::after { content: "+"; color: #667085; font-weight: 400; }
.dm-check-card details[open] summary::after { content: "-"; }

/* флаг / предохранитель */
.dm-flag {
  border-left: 4px solid var(--dm-warning);
  background: rgba(245,158,11,.07);
  border-radius: 0 var(--dm-radius-md) var(--dm-radius-md) 0;
  padding: 12px 16px;
  font: 400 14px/21px var(--dm-font-ui);
}
.dm-flag.is-info { border-left-color: var(--dm-info); background: rgba(59,130,246,.07); }
.dm-flag.is-ok { border-left-color: var(--dm-success); background: rgba(34,197,94,.07); }
.dm-flag.is-danger { border-left-color: var(--dm-danger); background: rgba(239,68,68,.07); }

/* ряд кнопок */
.dm-btn-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* чип (партнер, фильтр, тег) */
.dm-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-pill);
  background: var(--dm-surface);
  font: 700 13px/18px var(--dm-font-ui);
  color: var(--dm-graphite);
  text-decoration: none;
}
.dm-chip.is-active { border-color: var(--dm-violet); color: var(--dm-violet); background: var(--dm-iridescent); }

/* плитка агента-помощника */
.dm-agent-tile { padding: 16px; display: grid; gap: 8px; }
.dm-agent-tile .dm-agent-name { font: 700 15px/20px var(--dm-font-ui); }
.dm-agent-tile .dm-agent-event { font: 400 13px/19px var(--dm-font-ui); color: #667085; }

/* таблица */
.dm-table { width: 100%; border-collapse: collapse; font: 400 14px/20px var(--dm-font-ui); }
.dm-table th, .dm-table td {
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid var(--dm-line);
  vertical-align: top;
}
.dm-table th { font: 700 12px/16px var(--dm-font-ui); color: #667085; text-transform: uppercase; letter-spacing: .04em; }
.dm-table tr:last-child td { border-bottom: 0; }

/* герой-блок */
.dm-hero {
  padding: 48px;
  background: var(--dm-gradient-soft);
  border-radius: var(--dm-radius-xxl);
  border: 1px solid var(--dm-line);
  overflow: hidden;
}

/* телефон и чат мессенджера */
.dm-phone {
  width: 340px;
  max-width: 100%;
  border: 1px solid var(--dm-line);
  border-radius: 28px;
  background: var(--dm-surface);
  box-shadow: var(--dm-shadow-card);
  overflow: hidden;
}
.dm-phone .dm-phone-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--dm-line);
  font: 700 14px/20px var(--dm-font-ui);
}
.dm-phone .dm-phone-head .dm-caption { display: block; font-weight: 400; }
.dm-chat { padding: 14px; display: grid; gap: 10px; background: var(--dm-surface-soft); }
.dm-msg {
  max-width: 86%;
  padding: 10px 12px;
  border-radius: var(--dm-radius-md);
  font: 400 13px/19px var(--dm-font-ui);
}
.dm-msg.is-user {
  justify-self: end;
  background: var(--dm-iridescent);
  border: 1px solid rgba(108,44,255,.25);
  border-bottom-right-radius: 4px;
}
.dm-msg.is-bot {
  justify-self: start;
  background: var(--dm-white);
  border: 1px solid var(--dm-line);
  border-bottom-left-radius: 4px;
}
.dm-msg .dm-msg-meta {
  display: block;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed var(--dm-line);
  font-size: 11px;
  line-height: 15px;
  color: #667085;
}

/* картинки из бордов дизайн-системы */
.dm-photo {
  display: block;
  width: 100%;
  border-radius: var(--dm-radius-md);
  border: 1px solid var(--dm-line);
  object-fit: cover;
}
.dm-avatar-img {
  width: 48px; height: 48px;
  border-radius: 50%;
  object-fit: cover;
  flex: none;
}
.dm-thumb {
  width: 100%;
  aspect-ratio: 1.1;
  object-fit: cover;
  border-radius: var(--dm-radius-sm);
  border: 1px solid var(--dm-line);
  display: block;
}

/* вспомогательное */
.dm-card-pad { padding: 24px; }
.dm-muted { color: #667085; }
.dm-row { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.dm-space { height: 16px; }

@media (max-width: 900px) {
  .dm-app-shell { grid-template-columns: 1fr; padding: 16px; }
  .dm-sidebar { position: static; display: flex; flex-wrap: wrap; }
  .dm-sidebar .dm-logo { width: 100%; }
  .dm-hero { padding: 28px; }
  .dm-proto-bar { padding: 10px 16px; }
}

/* оболочка первых страниц приложения */
.dm-site-header {
  background: var(--dm-black);
  border-bottom: 1px solid var(--dm-graphite);
}
.dm-site-header__inner {
  max-width: 1280px;
  min-height: 88px;
  margin: 0 auto;
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.dm-site-logo { display: inline-flex; flex: none; }
.dm-site-logo img { width: 150px; height: auto; display: block; }
.dm-site-nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.dm-site-nav a {
  padding: 10px 12px;
  border-radius: var(--dm-radius-sm);
  color: #C9CCD6;
  font: 700 14px/20px var(--dm-font-ui);
  text-decoration: none;
}
.dm-site-nav a:hover { background: rgba(255,255,255,.08); color: var(--dm-white); }
.dm-page-grid { min-height: calc(100vh - 194px); display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: start; }
.dm-placeholder { grid-column: 1 / -1; margin-top: 24px; }
.dm-placeholder .dm-page-title { margin: 0 0 8px; }
.dm-placeholder .dm-body { margin: 0; }

@media (max-width: 700px) {
  .dm-site-header__inner { align-items: flex-start; padding: 16px; }
  .dm-site-nav { display: grid; justify-items: end; }
  .dm-page-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; }
}

/* регистрация и согласия */
.dm-button-link {
  display: inline-flex;
  min-height: 48px;
  padding: 0 22px;
  align-items: center;
  border-radius: var(--dm-radius-md);
  background: var(--dm-gradient-primary);
  color: var(--dm-white);
  font: 700 14px/16px var(--dm-font-ui);
  text-decoration: none;
}

.dm-space-top { margin-top: 20px; }
.dm-row-between { justify-content: space-between; }
.dm-catalog-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin-top: 24px; }
.dm-catalog-card { padding: 18px; display: grid; gap: 8px; color: var(--dm-black); text-decoration: none; }
.dm-catalog-card:hover { border-color: var(--dm-violet); }
.dm-catalog-card span, .dm-catalog-card small { color: #667085; }
.dm-catalog-form { display: grid; gap: 14px; max-width: 720px; margin-top: 16px; }
.dm-catalog-form label { display: grid; gap: 6px; font: 700 13px/19px var(--dm-font-ui); }
.dm-catalog-form textarea { resize: vertical; }
.dm-table-wrap { overflow-x: auto; }
.dm-registration-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}
.dm-registration-steps li {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #667085;
  font: 700 13px/18px var(--dm-font-ui);
}
.dm-registration-steps li span {
  width: 30px;
  height: 30px;
  border: 1px solid var(--dm-line);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.dm-registration-steps li.is-active { color: var(--dm-violet); }
.dm-registration-steps li.is-active span { border-color: var(--dm-violet); background: var(--dm-iridescent); }
.dm-registration-steps li.is-done { color: var(--dm-black); }
.dm-registration-steps li.is-done span { border-color: var(--dm-success); background: rgba(34,197,94,.14); }
.dm-registration-heading { margin-bottom: 24px; }
.dm-registration-heading .dm-caption { margin: 0 0 6px; text-transform: uppercase; letter-spacing: .05em; }
.dm-registration-heading .dm-page-title { margin: 0 0 8px; }
.dm-registration-heading .dm-body { margin: 0; }
.dm-registration-form, .dm-consent-form { display: grid; gap: 20px; }
.dm-question-group, .dm-consent-options {
  margin: 0;
  padding: 18px;
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-md);
}
.dm-question-group legend, .dm-consent-options legend {
  padding: 0 6px;
  font: 700 15px/20px var(--dm-font-ui);
}
.dm-question-group label, .dm-consent-options label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 12px;
  font: 400 14px/21px var(--dm-font-ui);
}
.dm-question-group input, .dm-consent-options input, .dm-consent-check input {
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  accent-color: var(--dm-violet);
  flex: none;
}
.dm-legal-warning, .dm-form-error {
  margin-bottom: 20px;
  padding: 14px 16px;
  border-radius: var(--dm-radius-md);
  font: 700 14px/21px var(--dm-font-ui);
}
.dm-legal-warning { border: 1px solid var(--dm-warning); background: rgba(245,158,11,.08); }
.dm-form-error { border: 1px solid var(--dm-danger); background: rgba(239,68,68,.07); color: #991B1B; }
.dm-consent-card {
  padding: 20px;
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-lg);
  background: var(--dm-surface);
  display: grid;
  gap: 14px;
}
.dm-consent-card__heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}
.dm-consent-purpose { margin: 0 0 5px; font: 700 17px/23px var(--dm-font-ui); }
.dm-consent-meta { margin: 0; color: #667085; font: 400 12px/17px var(--dm-font-ui); }
.dm-draft-badge {
  display: inline-flex;
  padding: 6px 10px;
  border-radius: var(--dm-radius-pill);
  background: rgba(245,158,11,.14);
  color: #92400E;
  font: 700 11px/16px var(--dm-font-ui);
}
.dm-consent-check { display: grid; grid-template-columns: 22px 1fr; gap: 12px; font: 400 14px/22px var(--dm-font-ui); }
.dm-consent-note, .dm-voluntary-note { margin: 0; font: 700 13px/19px var(--dm-font-ui); }
.dm-voluntary-note { color: #15803D; }
.dm-legal-gap { margin: 0; padding: 10px 12px; border-radius: var(--dm-radius-sm); background: rgba(239,68,68,.07); color: #991B1B; font: 700 12px/18px var(--dm-font-ui); }
.dm-equal-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 240px)); gap: 12px; }
.dm-equal-actions .dm-button-secondary { width: 100%; }
.dm-consent-ledger { display: grid; gap: 14px; }
.dm-consent-ledger__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px;
  border: 1px solid var(--dm-line);
  border-radius: var(--dm-radius-md);
}
.dm-consent-state { margin: 8px 0; color: #667085; font: 700 13px/19px var(--dm-font-ui); }
.dm-consent-state.is-granted { color: #15803D; }
.dm-application-list { display: grid; gap: 18px; margin: 18px 0 32px; }
.dm-application-list h3, .dm-application-list h4 { margin: 0 0 10px; }
.dm-application-checklist { display: grid; gap: 8px; padding-left: 22px; }
.dm-application-checklist li { font: 400 14px/21px var(--dm-font-ui); }
.dm-application-checklist li.is-done { color: #15803D; }
.dm-application-checklist li.is-missing { color: #991B1B; }
.dm-application-checklist span { display: block; color: #667085; }
.dm-appeal-list { display: grid; gap: 18px; margin: 18px 0 32px; }
.dm-appeal-list h2 { margin: 0 0 10px; }
.dm-appeal-list .is-crisis { border-color: var(--dm-danger); }
.dm-overdue-row { background: rgba(239,68,68,.10); color: #991B1B; }
.dm-crisis-message { padding: 20px; border: 2px solid var(--dm-danger); border-radius: var(--dm-radius-md); background: rgba(239,68,68,.07); }
.dm-crisis-message p { white-space: pre-wrap; }

@media (max-width: 700px) {
  .dm-registration-steps { grid-template-columns: 1fr; }
  .dm-equal-actions { grid-template-columns: 1fr 1fr; }
  .dm-consent-ledger__item { align-items: flex-start; flex-direction: column; }
}

/* Кабинет участника: живые данные в оболочке прототипа */
.dm-app-content { min-width: 0; }
.dm-sidebar__logout { margin-top: 12px; padding: 10px 12px 0; border-top: 1px solid rgba(255,255,255,.14); }
.dm-sidebar__logout button {
  appearance: none;
  border: 0;
  padding: 0;
  background: transparent;
  color: #C9CCD6;
  font: 700 14px/20px var(--dm-font-ui);
  cursor: pointer;
}
.dm-sidebar__logout button:hover { color: var(--dm-white); }
.dm-page-heading, .dm-section-heading, .dm-application-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.dm-page-heading { margin: 0 0 24px; }
.dm-page-heading .dm-caption, .dm-section-heading .dm-caption { margin: 0 0 5px; }
.dm-page-heading .dm-page-title, .dm-section-heading .dm-section-title { margin: 0 0 7px; }
.dm-page-heading .dm-body { margin: 0; }
.dm-section-heading { align-items: center; margin-bottom: 18px; }
.dm-section-heading > a { color: var(--dm-violet); font-weight: 700; }
.dm-back-link { display: inline-flex; margin: 0 0 18px; color: var(--dm-violet); font-weight: 700; text-decoration: none; }
.dm-back-link::before { content: "←"; margin-right: 7px; }
.dm-button-as-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }

.dm-application-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-bottom: 24px;
}
.dm-application-card { padding: 22px; display: grid; gap: 14px; min-width: 0; }
.dm-application-card h2, .dm-appeal-preview h2 { margin: 0; font: 800 21px/28px var(--dm-font-ui); overflow-wrap: anywhere; }
.dm-application-card p, .dm-appeal-preview p { margin: 0; }
.dm-application-deadline {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border-radius: var(--dm-radius-md);
  background: var(--dm-iridescent);
  font: 400 13px/19px var(--dm-font-ui);
}
.dm-application-deadline strong { color: var(--dm-violet); font-size: 15px; overflow-wrap: anywhere; }
.dm-cabinet-messages { margin-top: 24px; }
.dm-message-preview { padding: 16px 0; border-top: 1px solid var(--dm-line); }
.dm-message-preview h3, .dm-message-preview p, .dm-empty-state h2 { margin: 0; }
.dm-message-preview p { margin-top: 6px; }

.dm-application-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 20px; }
.dm-application-summary p { margin: 0; }
.dm-deadline-value { margin-top: 7px !important; font: 800 18px/25px var(--dm-font-ui); overflow-wrap: anywhere; }
.dm-checklist-panel { margin-top: 20px; }
.dm-checklist-panel .dm-application-checklist { list-style: none; padding: 0; margin: 0; }
.dm-checklist-panel .dm-application-checklist li { display: grid; grid-template-columns: 28px 1fr; gap: 12px; align-items: start; }
.dm-check-marker {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--dm-light-gray);
  font-weight: 800;
}
.dm-application-checklist .is-done .dm-check-marker { background: rgba(34,197,94,.14); color: #15803D; }
.dm-application-checklist .is-missing .dm-check-marker { background: rgba(245,158,11,.14); color: #B45309; }
.dm-application-checklist small { display: block; margin-top: 3px; color: #667085; font: 400 13px/19px var(--dm-font-ui); }

.dm-questionnaire-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.dm-questionnaire-form label { display: grid; gap: 7px; font: 700 13px/19px var(--dm-font-ui); min-width: 0; }
.dm-questionnaire-form .dm-form-wide { grid-column: 1 / -1; }
.dm-questionnaire-form textarea, .dm-new-appeal textarea { min-height: 150px; padding-top: 12px; resize: vertical; }

.dm-appeals-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: 24px; align-items: start; }
.dm-appeal-list { margin: 0; }
.dm-appeal-preview { padding: 22px; display: grid; gap: 14px; }
.dm-meta-list { margin: 0; display: grid; gap: 8px; }
.dm-meta-list div { display: grid; grid-template-columns: minmax(90px, .35fr) 1fr; gap: 12px; }
.dm-meta-list dt { color: #667085; }
.dm-meta-list dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.dm-new-appeal { position: sticky; top: 16px; }
.dm-new-appeal > .dm-caption, .dm-new-appeal > .dm-section-title { margin: 0 0 7px; }
.dm-conversation { display: grid; gap: 16px; }
.dm-conversation__message { max-width: 760px; padding: 16px; border-radius: var(--dm-radius-md); }
.dm-conversation__message p:last-child { margin-bottom: 0; white-space: pre-wrap; }
.dm-conversation__message.is-participant { margin-left: auto; background: var(--dm-iridescent); border: 1px solid rgba(108,44,255,.25); }
.dm-conversation__message.is-human { background: var(--dm-surface-soft); border: 1px solid var(--dm-line); }

.dm-stage-panel .dm-section-title { margin-top: 0; }
.dm-human-note { display: flex; align-items: center; gap: 12px; margin-top: 22px; color: #667085; font: 400 13px/19px var(--dm-font-ui); }
.dm-status-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 20px; }
.dm-status-facts > div { min-width: 0; }
.dm-status-facts p { margin: 0 0 5px; overflow-wrap: anywhere; }

.dm-auth-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 460px); gap: 40px; align-items: center; }
.dm-auth-intro { padding: 28px; }
.dm-auth-intro .dm-page-title { margin: 18px 0 10px; }
.dm-auth-card .dm-section-title { margin-top: 0; }

@media (max-width: 900px) {
  .dm-application-grid, .dm-appeals-layout, .dm-auth-layout { grid-template-columns: 1fr; }
  .dm-new-appeal { position: static; }
  .dm-sidebar__logout { margin: 0 0 0 auto; padding: 10px 12px; border: 0; }
}

@media (max-width: 620px) {
  .dm-app-shell { padding: 12px; }
  .dm-sidebar { padding: 12px 8px; }
  .dm-sidebar a { padding: 9px 10px; }
  .dm-sidebar .dm-logo { width: 100%; }
  .dm-sidebar__logout { margin-left: 0; }
  .dm-page-heading, .dm-section-heading { align-items: flex-start; flex-direction: column; }
  .dm-page-heading .dm-page-title { font-size: 30px; line-height: 36px; overflow-wrap: anywhere; }
  .dm-application-summary, .dm-questionnaire-form, .dm-status-facts { grid-template-columns: 1fr; }
  .dm-questionnaire-form .dm-form-wide { grid-column: auto; }
  .dm-card-pad, .dm-application-card, .dm-appeal-preview { padding: 18px; }
  .dm-stage-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .dm-human-note { align-items: flex-start; flex-direction: column; }
  .dm-meta-list div { grid-template-columns: 1fr; gap: 2px; }
  .dm-btn-row > *, .dm-btn-row form, .dm-btn-row button { width: 100%; }
  .dm-principle-bar { justify-content: flex-start; }
}