/* ── Error summary ──────────────────────────────────────── */
    .form-errors {
      margin: 10px 14px 0;
      background: var(--error-bg);
      border: 1px solid var(--error-bd);
      border-radius: var(--radius);
      padding: 8px 11px;
      display: none; /* shown via JS / Flask when errors exist */
    }
    .form-errors.visible { display: block; }
    .form-errors-title {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--error-tx);
      margin-bottom: 4px;
    }
    .form-errors ul {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
    .form-errors li {
      font-size: 11px;
      font-family: var(--mono);
      color: var(--error-tx);
    }
    .form-errors li::before {
      content: '· ';
    }
 
    /* ── Form body ──────────────────────────────────────────── */
    .form-body {
      padding: 12px 14px;
      display: flex;
      flex-direction: column;
      gap: 0;
    }
 
    /* ── Each group ─────────────────────────────────────────── */
    .form-group {
      padding: 11px 0;
      border-bottom: 1px solid var(--border-lt);
    }
    .form-group:last-of-type { border-bottom: none; }
 
    .form-group-label {
      font-family: var(--mono);
      font-size: 10px;
      font-weight: 500;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--text-3);
      margin-bottom: 8px;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    /* small asterisk for required groups */
    .form-group-label .req {
      color: var(--error-tx);
      font-size: 12px;
      line-height: 1;
    }
    /* invalid state — label turns red */
    .form-group.invalid .form-group-label { color: var(--error-tx); }