/* ============================================================
   Officer Citation Wizard (desk/field) multi-step page.
   Structure in @layer layout, paint in @layer design. Content-named
   classes only — no legacy/appearance names, no hardcoded color.
   Reuses .app-screen and .btn/.btn--primary/.btn--outline from elements.css.

   DESK/field page: officers create a referral under the default light
   .app-screen palette. This stylesheet only references --t-* semantic
   tokens, which app/theme.css rebinds per theme, so the wizard reskins
   without any role-specific color rules here. The success / invite-handoff
   markup carries the .app-screen officer-citation root so the same --t-*
   tokens resolve. See docs/FRONTEND-ARCHITECTURE.md.
   ============================================================ */

@layer layout {
  /* The wizard column: progress strip above the active step region. */
  .officer-citation { gap: var(--mea-space-5); }

  /* Progress: a full-width track with a fill, then a step counter. */
  .citation-progress { display: grid; gap: var(--mea-space-2); }
  .citation-progress__track { block-size: var(--mea-space-2); inline-size: 100%;
                              border-radius: var(--mea-radius-pill); overflow: hidden; }
  .citation-progress__fill { block-size: 100%; inline-size: 0;
                             border-radius: var(--mea-radius-pill);
                             transition: inline-size var(--mea-dur-normal); }
  .citation-progress__label { margin: 0; }

  /* Active step shell: back/cancel control, then the step's content. */
  .citation-step-region { display: grid; min-inline-size: 0; }
  .citation-step { display: grid; gap: var(--mea-space-4); align-content: start;
                   min-inline-size: 0; }
  .citation-step__back { justify-self: start; display: inline-flex; align-items: center;
                         gap: var(--mea-space-2); min-height: var(--t-target-min, 44px);
                         padding: var(--mea-space-2) var(--mea-space-3);
                         border: 0; background: transparent; cursor: pointer; }
  .citation-step__title, .citation-step__subtitle, .citation-question { margin: 0; }
  .citation-step__advance { justify-self: stretch; }
  .citation-step__actions { display: flex; flex-wrap: wrap; gap: var(--mea-space-3); }
  .citation-step__actions .btn { flex: 1; }
  .citation-step__actions--stacked { flex-direction: column; }
  .citation-step__link { background: transparent; }

  /* Generic field: label stacked over its control. */
  .citation-field { display: grid; gap: var(--mea-space-2); min-inline-size: 0; }
  .citation-field__label { margin: 0; }
  .citation-field__input { inline-size: 100%; min-height: var(--t-target-min, 44px);
                           padding: var(--mea-space-3); border-radius: var(--mea-radius-md);
                           font: inherit; }
  .citation-field__textarea { inline-size: 100%; padding: var(--mea-space-3);
                              border-radius: var(--mea-radius-md); font: inherit; resize: vertical; }

  /* Review-gated voice and vision helpers reuse the wizard's field/button language. */
  .citation-ai-tool { display: grid; gap: var(--mea-space-3); padding: var(--mea-space-4);
                      border-radius: var(--mea-radius-lg); }
  .citation-ai-tool__header, .citation-ai-tool__review { display: grid; gap: var(--mea-space-2); }
  .citation-ai-tool__title, .citation-ai-tool__hint, .citation-ai-tool__status { margin: 0; }
  .citation-ai-tool__actions { display: flex; flex-wrap: wrap; gap: var(--mea-space-3); }
  .citation-ai-tool__actions .btn { flex: 1 1 12rem; }
  .citation-ai-tool__review .btn { justify-self: start; }

  /* Offense step: search → optional selection note → chip grid. */
  .offense-selected, .offense-hint { margin: 0; }
  .offense-grid { display: flex; flex-wrap: wrap; gap: var(--mea-space-2); min-inline-size: 0; }
  .offense-chip { display: inline-flex; align-items: center; min-height: var(--t-target-min, 44px);
                  padding: var(--mea-space-2) var(--mea-space-4); border: 0;
                  border-radius: var(--mea-radius-pill); cursor: pointer; text-align: start; }

  /* Location step: a coordinate map placeholder above the address field. */
  .citation-map { display: grid; place-items: center; gap: var(--mea-space-2); margin: 0;
                  min-block-size: 8rem; padding: var(--mea-space-5);
                  border-radius: var(--mea-radius-lg); }
  .citation-map__pin { font-size: var(--mea-text-2xl); line-height: 1; }
  .citation-map__coords { margin: 0; text-align: center; word-break: break-word; }

  /* Evidence step: a known/unknown summary, then a grid of items + add tile. */
  .evidence-summary { display: flex; flex-wrap: wrap; gap: var(--mea-space-4);
                      margin: 0; padding: var(--mea-space-3) var(--mea-space-4);
                      border-radius: var(--mea-radius-md); }
  .evidence-summary__stat { display: inline-flex; align-items: baseline; gap: var(--mea-space-2); }
  .evidence-summary__label, .evidence-summary__value { margin: 0; }
  .evidence-grid { display: grid; grid-template-columns: 1fr; gap: var(--mea-space-3);
                   margin: 0; padding: 0; list-style: none; }
  .evidence-item { display: grid; grid-template-columns: auto 1fr auto; align-items: center;
                   gap: var(--mea-space-2) var(--mea-space-3); padding: var(--mea-space-4);
                   border-radius: var(--mea-radius-lg); }
  .evidence-item__label { grid-column: 1; font-weight: var(--mea-w-bold); }
  .evidence-item__file { grid-column: 2 / -1; min-inline-size: 0; word-break: break-word; }
  .evidence-item__value-label { grid-column: 1 / -1; margin: 0; }
  .evidence-item__value { grid-column: 1 / 3; }
  .evidence-item__confirm { grid-column: 3; }
  .evidence-item__status { grid-column: 1 / 3; }
  .evidence-item__ai { grid-column: 1 / -1; display: grid; gap: var(--mea-space-2);
                       padding-block-start: var(--mea-space-2); }
  .evidence-item__ai-review { display: grid; gap: var(--mea-space-2); }
  .evidence-item__ai-status { margin: 0; }
  .evidence-item__apply-estimate { justify-self: start; }
  .evidence-item__remove { grid-column: 3; grid-row: 1; justify-self: end; align-self: start;
                           inline-size: 1.75rem; block-size: 1.75rem; padding: 0; border: 0;
                           background: transparent; cursor: pointer; border-radius: var(--mea-radius-md); }
  .evidence-add { margin: 0; }
  .evidence-add__control { display: grid; place-items: center; gap: var(--mea-space-2);
                           min-block-size: 6rem; padding: var(--mea-space-5); cursor: pointer;
                           border-radius: var(--mea-radius-lg); }
  .evidence-add__icon { font-size: var(--mea-text-2xl); line-height: 1; }
  .evidence-warning { margin: 0; padding: var(--mea-space-3); border-radius: var(--mea-radius-md); }

  @container (min-width: 30rem) {
    .evidence-grid { grid-template-columns: repeat(2, 1fr); }
  }

  /* Scan-ID step: a card-art illustration above the action stack. */
  .citation-id-illustration { display: grid; place-items: center; margin: 0;
                              min-block-size: 7rem; border-radius: var(--mea-radius-lg); }
  .citation-id-illustration__icon { font-size: var(--mea-text-3xl); line-height: 1; }

  /* Citizen step: a responsive two-column field grid. */
  .citation-form-grid { display: grid; grid-template-columns: 1fr; gap: var(--mea-space-4);
                        min-inline-size: 0; }
  .citation-field--full { grid-column: 1 / -1; }
  @container (min-width: 32rem) {
    .citation-form-grid { grid-template-columns: repeat(2, 1fr); }
  }

  /* Screening questions: two large yes/no choices. */
  .citation-yn { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--mea-space-3); }
  .citation-yn__choice { min-height: 4rem; padding: var(--mea-space-4); border: 0;
                         border-radius: var(--mea-radius-lg); cursor: pointer; }

  /* Review step: grouped definition lists of the entered data. */
  .citation-review { display: grid; gap: var(--mea-space-4); border-radius: var(--mea-radius-xl);
                     overflow: hidden; }
  .citation-review__section { display: grid; gap: var(--mea-space-3); padding: var(--mea-space-5); }
  .citation-review__heading { margin: 0; }
  .citation-review__list { display: grid; gap: var(--mea-space-2); margin: 0; }
  .citation-review__row { display: grid; grid-template-columns: minmax(8rem, auto) 1fr;
                          gap: var(--mea-space-3); align-items: baseline; }
  .citation-review__label, .citation-review__value { margin: 0; min-inline-size: 0; word-break: break-word; }

  /* Success screen + participant invite handoff. */
  .citation-success { display: grid; gap: var(--mea-space-4); justify-items: center;
                      text-align: center; padding: var(--mea-space-6) var(--mea-space-4); }
  .citation-success__icon { display: inline-flex; align-items: center; justify-content: center;
                            inline-size: 3.5rem; block-size: 3.5rem; margin: 0;
                            border-radius: var(--mea-radius-circle); }
  .citation-success__title, .citation-success__sub { margin: 0; }

  .citation-eligibility { display: grid; gap: var(--mea-space-1); justify-items: center;
                          inline-size: 100%; padding: var(--mea-space-4);
                          border-radius: var(--mea-radius-lg); }
  .citation-eligibility__label, .citation-eligibility__outcome { margin: 0; }

  .invite-handoff { display: grid; gap: var(--mea-space-3); inline-size: 100%;
                    padding: var(--mea-space-5); border-radius: var(--mea-radius-xl); }
  .invite-handoff__body { display: grid; gap: var(--mea-space-3); justify-items: center; }
  .invite-handoff__qr { display: grid; place-items: center; margin: 0;
                        inline-size: 10rem; block-size: 10rem; padding: var(--mea-space-2);
                        border-radius: var(--mea-radius-md); }
  .invite-qr-svg { inline-size: 100%; block-size: 100%; }
  .invite-handoff__details { display: grid; gap: var(--mea-space-1); justify-items: center; margin: 0; }
  .invite-handoff__label, .invite-handoff__code, .invite-handoff__error { margin: 0; }
  .invite-handoff__code { word-break: break-all; }
  .invite-handoff__link { text-decoration: none; }

  /* Report launch card on the success screen. */
  .citation-report-launch { display: grid; gap: var(--mea-space-2); inline-size: 100%;
                            padding: var(--mea-space-5); border-radius: var(--mea-radius-xl);
                            text-align: start; }
  .citation-report-launch__title, .citation-report-launch__hint { margin: 0; }
  .citation-report-launch .btn { justify-self: start; }

  /* Report review panel: stacked editable fields, then a checklist + actions. */
  .citation-report { display: grid; gap: var(--mea-space-4); align-content: start;
                     min-inline-size: 0; text-align: start; }
  .citation-report__header { display: grid; gap: var(--mea-space-2); }
  .citation-report__title, .citation-report__subtitle, .citation-report__hint,
  .citation-report__error, .citation-report__empty { margin: 0; }
  .citation-report__fieldset { display: grid; gap: var(--mea-space-2); margin: 0;
                               padding: var(--mea-space-4); border-radius: var(--mea-radius-lg);
                               min-inline-size: 0; }
  .citation-report__legend, .citation-report__group-title { margin: 0;
                               padding-inline: var(--mea-space-1); }
  .citation-report__timeline, .citation-report__notes, .citation-report__evidence,
  .citation-report__checklist { display: grid; gap: var(--mea-space-2); margin: 0;
                                padding: 0; list-style: none; }
  .citation-report__timeline-item { display: grid; min-inline-size: 0; }
  .citation-report__arrest { display: inline-flex; align-items: center; gap: var(--mea-space-2);
                             min-height: var(--t-target-min, 44px); cursor: pointer; }
  .citation-report__group { display: grid; gap: var(--mea-space-2); padding: var(--mea-space-4);
                            border-radius: var(--mea-radius-lg); min-inline-size: 0; }
  .citation-report__note { display: grid; grid-template-columns: 1fr auto; gap: var(--mea-space-3);
                           align-items: center; }
  .citation-report__note-text { min-inline-size: 0; word-break: break-word; }
  .citation-report__evidence-item { word-break: break-word; }
  .citation-report__check { display: grid; grid-template-columns: auto 1fr; gap: var(--mea-space-2);
                            align-items: baseline; }
  .citation-report__check-icon { font-weight: var(--mea-w-bold); }

  /* Read-only finalized report view. */
  .citation-report-view { display: grid; gap: var(--mea-space-4); align-content: start;
                          min-inline-size: 0; text-align: start; }
  .citation-report-view__header { display: grid; gap: var(--mea-space-2); }
  .citation-report-view__badge, .citation-report-view__title,
  .citation-report-view__group-title, .citation-report-view__narrative { margin: 0; }
  .citation-report-view__badge { justify-self: start; padding: var(--mea-space-1) var(--mea-space-3);
                                 border-radius: var(--mea-radius-pill); }
  .citation-report-view__list { display: grid; gap: var(--mea-space-2); margin: 0; }
  .citation-report-view__row { display: grid; grid-template-columns: minmax(8rem, auto) 1fr;
                               gap: var(--mea-space-3); align-items: baseline; }
  .citation-report-view__label, .citation-report-view__value { margin: 0; min-inline-size: 0;
                               word-break: break-word; }
  .citation-report-view__group { display: grid; gap: var(--mea-space-2); }
  .citation-report-view__timeline { display: grid; gap: var(--mea-space-1); margin: 0;
                                    padding-inline-start: var(--mea-space-5); }
  .citation-report-view__narrative { white-space: pre-wrap; word-break: break-word; }
}

@layer design {
  /* Progress track + fill. */
  .citation-progress__track { background: var(--t-bg-recessed); }
  .citation-progress__fill { background: var(--t-accent); }
  .citation-progress__label { font-size: var(--mea-text-sm); color: var(--t-text-muted); }

  /* Step shell. */
  .citation-step__back { color: var(--t-text-secondary); font-size: var(--mea-text-md);
                         font-weight: var(--mea-w-semibold);
                         transition: color var(--mea-dur-fast); }
  .citation-step__back:hover { color: var(--t-text); }
  .citation-step__title { font-family: var(--mea-font-citizen); font-size: var(--mea-text-2xl);
                          font-weight: var(--mea-w-bold); color: var(--t-text); }
  .citation-step__subtitle { font-size: var(--mea-text-md); color: var(--t-text-secondary); }
  .citation-step__link { color: var(--t-link); font-weight: var(--mea-w-semibold); }
  .citation-step__link:hover { color: var(--t-link-hover); }

  /* Generic field controls. */
  .citation-field__label { font-size: var(--mea-text-sm); font-weight: var(--mea-w-semibold);
                           color: var(--t-text); }
  .citation-field__input, .citation-field__textarea { background: var(--t-bg-elevated);
                          color: var(--t-text); border: 1px solid var(--t-border);
                          font-size: var(--mea-text-md); }
  .citation-field__input:focus, .citation-field__textarea:focus { outline: none;
                          border-color: var(--t-border-focus); }
  .citation-field__input::placeholder, .citation-field__textarea::placeholder { color: var(--t-text-muted); }

  /* AI helpers never look authoritative: proposed content stays in a bordered review area. */
  .citation-ai-tool { background: var(--t-bg-recessed); border: 1px solid var(--t-border); }
  .citation-ai-tool__title { font-family: var(--mea-font-citizen); font-size: var(--mea-text-md);
                             font-weight: var(--mea-w-bold); color: var(--t-text); }
  .citation-ai-tool__hint, .citation-ai-tool__status { font-size: var(--mea-text-sm);
                                                       color: var(--t-text-secondary); }
  .citation-ai-tool__status--error { color: var(--t-error-text); font-weight: var(--mea-w-semibold); }
  .citation-ai-tool__status--success, .citation-ai-tool__status--applied {
    color: var(--t-success-text); font-weight: var(--mea-w-semibold);
  }
  .citation-ai-tool__review { padding-block-start: var(--mea-space-3);
                              border-block-start: 1px solid var(--t-border); }

  /* Offense selection + chips. .is-active is toggled by the controller. */
  .offense-selected { font-size: var(--mea-text-md); color: var(--t-text-secondary); }
  .offense-selected__label { color: var(--t-text-muted); }
  .offense-hint { font-size: var(--mea-text-md); color: var(--t-text-muted); }
  .offense-chip { background: var(--t-bg-recessed); color: var(--t-text);
                  font-size: var(--mea-text-md); font-weight: var(--mea-w-semibold);
                  transition: background var(--mea-dur-fast), color var(--mea-dur-fast); }
  .offense-chip:hover { background: var(--t-bg-active); }
  .offense-chip.is-active { background: var(--t-accent); color: var(--t-accent-text); }

  /* Location map placeholder. */
  .citation-map { background: var(--t-bg-recessed); border: 1px solid var(--t-border); }
  .citation-map__pin { color: var(--t-accent); }
  .citation-map__coords { font-size: var(--mea-text-sm); color: var(--t-text-secondary); }

  /* Evidence summary + items. */
  .evidence-summary { background: var(--t-bg-recessed); }
  .evidence-summary__label { font-size: var(--mea-text-sm); color: var(--t-text-muted); }
  .evidence-summary__value { font-size: var(--mea-text-md); font-weight: var(--mea-w-bold);
                             color: var(--t-text); }
  .evidence-item { background: var(--t-bg-recessed); border: 1px solid var(--t-border); }
  .evidence-item__label { font-size: var(--mea-text-sm); color: var(--t-text-muted); }
  .evidence-item__file { font-size: var(--mea-text-md); color: var(--t-text); }
  .evidence-item__value-label { font-size: var(--mea-text-sm); color: var(--t-text-muted); }
  .evidence-item__status { font-size: var(--mea-text-sm); color: var(--t-text-muted); }
  .evidence-item__status--confirmed { color: var(--t-success-text); font-weight: var(--mea-w-semibold); }
  .evidence-item__ai { border-block-start: 1px solid var(--t-border); }
  .evidence-item__ai-status { font-size: var(--mea-text-sm); color: var(--t-text-secondary); }
  .evidence-item__ai-status--error { color: var(--t-error-text); font-weight: var(--mea-w-semibold); }
  .evidence-item__remove { color: var(--t-text-muted); font-size: var(--mea-text-lg);
                           transition: background var(--mea-dur-fast), color var(--mea-dur-fast); }
  .evidence-item__remove:hover { background: var(--t-error); color: var(--t-accent-text); }
  .evidence-add__control { background: var(--t-bg-recessed); color: var(--t-text-secondary);
                           border: 1px dashed var(--t-border); font-weight: var(--mea-w-semibold); }
  .evidence-add__control:hover { border-color: var(--t-border-focus); color: var(--t-text); }
  .evidence-add__icon { color: var(--t-text-muted); }
  .evidence-warning { background: var(--t-warning-bg); color: var(--t-warning-text);
                      font-size: var(--mea-text-sm); font-weight: var(--mea-w-semibold); }

  /* Scan-ID illustration. */
  .citation-id-illustration { background: var(--t-bg-recessed); }
  .citation-id-illustration__icon { color: var(--t-accent); }

  /* Screening questions. */
  .citation-question { font-family: var(--mea-font-citizen); font-size: var(--mea-text-xl);
                       font-weight: var(--mea-w-bold); color: var(--t-text); text-align: center; }
  .citation-yn__choice { background: var(--t-bg-recessed); color: var(--t-text);
                         font-family: var(--mea-font-citizen); font-size: var(--mea-text-lg);
                         font-weight: var(--mea-w-bold);
                         transition: background var(--mea-dur-fast), color var(--mea-dur-fast); }
  .citation-yn__choice:hover { background: var(--t-bg-active); }
  .citation-yn__choice.is-active { background: var(--t-accent); color: var(--t-accent-text); }

  /* Review summary. */
  .citation-review { background: var(--t-card-bg); border: 1px solid var(--t-card-border);
                     box-shadow: var(--mea-shadow-sm); }
  .citation-review__section + .citation-review__section { border-block-start: 1px solid var(--t-border); }
  .citation-review__heading { font-family: var(--mea-font-citizen); font-size: var(--mea-text-md);
                              font-weight: var(--mea-w-bold); color: var(--t-text-muted);
                              text-transform: uppercase; letter-spacing: var(--mea-ls-wide); }
  .citation-review__label { font-size: var(--mea-text-sm); color: var(--t-text-muted); }
  .citation-review__value { font-size: var(--mea-text-sm); color: var(--t-text);
                            font-weight: var(--mea-w-semibold); }

  /* Success + invite handoff. */
  .citation-success__icon { background: var(--t-success); color: var(--t-accent-text);
                            font-size: var(--mea-text-2xl); font-weight: var(--mea-w-bold); }
  .citation-success__title { font-family: var(--mea-font-citizen); font-size: var(--mea-text-2xl);
                             font-weight: var(--mea-w-bold); color: var(--t-text); }
  .citation-success__sub { font-size: var(--mea-text-md); color: var(--t-text-secondary); }

  .citation-eligibility { background: var(--t-bg-recessed); border: 1px solid var(--t-border); }
  .citation-eligibility__label { font-size: var(--mea-text-xs); font-weight: var(--mea-w-semibold);
                                 color: var(--t-text-muted); text-transform: uppercase;
                                 letter-spacing: var(--mea-ls-wide); }
  .citation-eligibility__outcome { font-size: var(--mea-text-lg); font-weight: var(--mea-w-bold);
                                   color: var(--t-text); }
  .citation-eligibility--eligible { background: var(--t-success); border-color: var(--t-success); }
  .citation-eligibility--eligible .citation-eligibility__label,
  .citation-eligibility--eligible .citation-eligibility__outcome { color: var(--t-accent-text); }
  .citation-eligibility--ineligible, .citation-eligibility--error { background: var(--t-error);
                                   border-color: var(--t-error); }
  .citation-eligibility--ineligible .citation-eligibility__label,
  .citation-eligibility--ineligible .citation-eligibility__outcome,
  .citation-eligibility--error .citation-eligibility__label,
  .citation-eligibility--error .citation-eligibility__outcome { color: var(--t-accent-text); }

  .invite-handoff { background: var(--t-card-bg); border: 1px solid var(--t-card-border);
                    box-shadow: var(--mea-shadow-sm); }
  .invite-handoff--error { background: var(--t-error); border-color: var(--t-error); }
  .invite-handoff__qr { background: var(--mea-white); }
  .invite-handoff__label { font-size: var(--mea-text-sm); font-weight: var(--mea-w-semibold);
                           color: var(--t-text-secondary); }
  .invite-handoff__code { font-family: var(--mea-font-mono); font-size: var(--mea-text-xl);
                          font-weight: var(--mea-w-bold); color: var(--t-text);
                          letter-spacing: var(--mea-ls-wide); }
  .invite-handoff__link { color: var(--t-link); font-weight: var(--mea-w-semibold); }
  .invite-handoff__link:hover { color: var(--t-link-hover); }
  .invite-handoff--error .invite-handoff__label,
  .invite-handoff__error { color: var(--t-accent-text); font-size: var(--mea-text-sm); }

  /* Report launch card. */
  .citation-report-launch { background: var(--t-bg-recessed); border: 1px solid var(--t-border); }
  .citation-report-launch__title { font-family: var(--mea-font-citizen); font-size: var(--mea-text-md);
                                   font-weight: var(--mea-w-bold); color: var(--t-text); }
  .citation-report-launch__hint { font-size: var(--mea-text-sm); color: var(--t-text-secondary); }

  /* Report review panel. */
  .citation-report__title { font-family: var(--mea-font-citizen); font-size: var(--mea-text-2xl);
                            font-weight: var(--mea-w-bold); color: var(--t-text); }
  .citation-report__subtitle { font-size: var(--mea-text-md); color: var(--t-text-secondary); }
  .citation-report__hint { font-size: var(--mea-text-sm); color: var(--t-text-muted); }
  .citation-report__fieldset, .citation-report__group { background: var(--t-bg-recessed);
                            border: 1px solid var(--t-border); }
  .citation-report__legend, .citation-report__group-title { font-size: var(--mea-text-sm);
                            font-weight: var(--mea-w-semibold); color: var(--t-text-muted);
                            text-transform: uppercase; letter-spacing: var(--mea-ls-wide); }
  .citation-report__empty, .citation-report__evidence-item { font-size: var(--mea-text-sm);
                            color: var(--t-text-secondary); }
  .citation-report__empty--ok { color: var(--t-success-text); font-weight: var(--mea-w-semibold); }
  .citation-report__note-text { font-size: var(--mea-text-sm); color: var(--t-text); }
  .citation-report__arrest { font-size: var(--mea-text-md); color: var(--t-text); }
  .citation-report__check { font-size: var(--mea-text-sm); color: var(--t-text-secondary); }
  .citation-report__check--ok { color: var(--t-success-text); }
  .citation-report__check--ok .citation-report__check-icon { color: var(--t-success-text); }
  .citation-report__check--todo .citation-report__check-icon { color: var(--t-text-muted); }
  .citation-report__error { color: var(--t-error-text); font-size: var(--mea-text-sm);
                            font-weight: var(--mea-w-semibold); }

  /* Finalized report view. */
  .citation-report-view__badge { background: var(--t-success); color: var(--t-accent-text);
                                 font-size: var(--mea-text-xs); font-weight: var(--mea-w-bold);
                                 text-transform: uppercase; letter-spacing: var(--mea-ls-wide); }
  .citation-report-view__title { font-family: var(--mea-font-citizen); font-size: var(--mea-text-2xl);
                                 font-weight: var(--mea-w-bold); color: var(--t-text); }
  .citation-report-view__group-title { font-size: var(--mea-text-sm); font-weight: var(--mea-w-semibold);
                                 color: var(--t-text-muted); text-transform: uppercase;
                                 letter-spacing: var(--mea-ls-wide); }
  .citation-report-view__label { font-size: var(--mea-text-sm); color: var(--t-text-muted); }
  .citation-report-view__value { font-size: var(--mea-text-sm); color: var(--t-text);
                                 font-weight: var(--mea-w-semibold); }
  .citation-report-view__narrative { font-size: var(--mea-text-md); color: var(--t-text); }
}