[hidden] {
  display: none !important;
}

:root {
  --df-navy: #0b1f3a;
  --df-blue: #1a4b7c;
  --df-cyan: #0e7490;
  --df-indigo: #3f3d8f;
  --df-bg: #f6f7f9;
  --df-surface: #fff;
  --df-surface-2: #f1f3f6;
  --df-surface-3: #e7eaef;
  --df-overlay: #fff;
  --df-text: #16202b;
  --df-text-muted: #55616f;
  --df-text-subtle: #606a78;
  --df-text-inverse: #fff;
  --df-border: #dde2e9;
  --df-border-strong: #c3cbd6;
  --df-accent: var(--df-blue);
  --df-accent-hover: #15406a;
  --df-accent-active: #102f4f;
  --df-accent-fg: #fff;
  --df-accent-soft: #ebf0f6;
  --df-accent-text: #164672;
  --df-success: #0f7b3e;
  --df-success-soft: #f0f7f3;
  --df-success-line: #bfe0cd;
  --df-warning: #a15c00;
  --df-warning-soft: #fdf5e8;
  --df-warning-line: #ecd6ab;
  --df-danger: #b3261e;
  --df-danger-soft: #fbeae9;
  --df-danger-line: #efc4c1;
  --df-info: #1a4b7c;
  --df-info-soft: #ebf0f6;
  --df-info-line: #c4d3e3;
  --df-neutral: #616a74;
  --df-neutral-soft: #f1f3f6;
  --df-neutral-line: #d8dde4;
  --df-accent-line: #c4d3e3;
  --df-ring: #1a4b7c;
  --df-ring-offset: var(--df-surface);
  --df-space-0: 0;
  --df-space-1: .25rem;
  --df-space-2: .5rem;
  --df-space-3: .75rem;
  --df-space-4: 1rem;
  --df-space-5: 1.5rem;
  --df-space-6: 2rem;
  --df-space-7: 3rem;
  --df-space-8: 4rem;
  --df-radius-sm: .125rem;
  --df-radius: .25rem;
  --df-radius-lg: .5rem;
  --df-radius-pill: 999px;
  --df-font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial,
    "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --df-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
    monospace;
  --df-text-2xs: .6875rem;
  --df-text-xs: .75rem;
  --df-text-sm: .8125rem;
  --df-text-base: .875rem;
  --df-text-md: .9375rem;
  --df-text-lg: 1.0625rem;
  --df-text-xl: 1.25rem;
  --df-text-2xl: 1.5rem;
  --df-leading-tight: 1.25;
  --df-leading: 1.5;
  --df-weight-normal: 400;
  --df-weight-medium: 500;
  --df-weight-semibold: 600;
  --df-shadow-menu: 0 6px 16px -4px rgba(16, 32, 48, .18), 0 2px 4px -2px rgba(16, 32, 48, .12);
  --df-shadow-dialog: 0 24px 48px -12px rgba(16, 32, 48, .28);
  --df-duration: .12s;
  --df-ease: cubic-bezier(.2, 0, .2, 1);
  --df-z-sticky: 10;
  --df-z-sidebar: 20;
  --df-z-dropdown: 40;
  --df-z-dialog: 60;
  --df-z-toast: 80;
  --df-sidebar-width: 15rem;
  --df-topbar-height: 3rem;
  --df-content-max: 90rem;
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  :root {
    --lightningcss-light: ;
    --lightningcss-dark: initial;
  }

  :root:not([data-theme="light"]) {
    --df-bg: #0e1116;
    --df-surface: #151a21;
    --df-surface-2: #1b222b;
    --df-surface-3: #222b36;
    --df-overlay: #1b222b;
    --df-text: #e6eaf0;
    --df-text-muted: #a3adba;
    --df-text-subtle: #89929e;
    --df-text-inverse: #0e1116;
    --df-border: #262e39;
    --df-border-strong: #3a4552;
    --df-accent: #7fb2e5;
    --df-accent-hover: #9cc5ef;
    --df-accent-active: #b6d5f4;
    --df-accent-fg: #0b1620;
    --df-accent-soft: #17293a;
    --df-accent-text: #a8cbee;
    --df-accent-line: #2c4763;
    --df-success: #5cc98e;
    --df-success-soft: #10231a;
    --df-success-line: #224b37;
    --df-warning: #e0a34a;
    --df-warning-soft: #241c0e;
    --df-warning-line: #4c3a1c;
    --df-danger: #f1867e;
    --df-danger-soft: #251314;
    --df-danger-line: #512a29;
    --df-info: #8fbce8;
    --df-info-soft: #16232f;
    --df-info-line: #2b4257;
    --df-neutral: #9aa4b1;
    --df-neutral-soft: #1b222b;
    --df-neutral-line: #2f3944;
    --df-ring: #7fb2e5;
    --df-ring-offset: var(--df-surface);
    --df-shadow-menu: 0 6px 16px -4px rgba(0, 0, 0, .55), 0 2px 4px -2px rgba(0, 0, 0, .45);
    --df-shadow-dialog: 0 24px 48px -12px rgba(0, 0, 0, .65);
  }
}

:root[data-theme="dark"] {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
}

:root[data-theme="light"] {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --df-bg: #0e1116;
  --df-surface: #151a21;
  --df-surface-2: #1b222b;
  --df-surface-3: #222b36;
  --df-overlay: #1b222b;
  --df-text: #e6eaf0;
  --df-text-muted: #a3adba;
  --df-text-subtle: #89929e;
  --df-text-inverse: #0e1116;
  --df-border: #262e39;
  --df-border-strong: #3a4552;
  --df-accent: #7fb2e5;
  --df-accent-hover: #9cc5ef;
  --df-accent-active: #b6d5f4;
  --df-accent-fg: #0b1620;
  --df-accent-soft: #17293a;
  --df-accent-text: #a8cbee;
  --df-accent-line: #2c4763;
  --df-success: #5cc98e;
  --df-success-soft: #10231a;
  --df-success-line: #224b37;
  --df-warning: #e0a34a;
  --df-warning-soft: #241c0e;
  --df-warning-line: #4c3a1c;
  --df-danger: #f1867e;
  --df-danger-soft: #251314;
  --df-danger-line: #512a29;
  --df-info: #8fbce8;
  --df-info-soft: #16232f;
  --df-info-line: #2b4257;
  --df-neutral: #9aa4b1;
  --df-neutral-soft: #1b222b;
  --df-neutral-line: #2f3944;
  --df-ring: #7fb2e5;
  --df-ring-offset: var(--df-surface);
  --df-shadow-menu: 0 6px 16px -4px rgba(0, 0, 0, .55), 0 2px 4px -2px rgba(0, 0, 0, .45);
  --df-shadow-dialog: 0 24px 48px -12px rgba(0, 0, 0, .65);
}

*, :before, :after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  background: var(--df-bg);
  color: var(--df-text);
  font-family: var(--df-font);
  font-size: var(--df-text-base);
  line-height: var(--df-leading);
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0;
}

h1, h2, h3, h4 {
  font-weight: var(--df-weight-semibold);
  line-height: var(--df-leading-tight);
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

img, svg, video, canvas {
  max-width: 100%;
  display: block;
}

a {
  color: var(--df-accent-text);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

button, input, select, textarea {
  font: inherit;
  color: inherit;
}

table, .df-tabular, [data-tabular] {
  font-variant-numeric: tabular-nums;
}

input[type="number"] {
  font-variant-numeric: tabular-nums;
}

:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: 2px;
  border-radius: var(--df-radius-sm);
}

@media (prefers-reduced-motion: reduce) {
  *, :before, :after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

.df-sr-only {
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.df-skip-link {
  top: var(--df-space-2);
  left: var(--df-space-2);
  z-index: 100;
  padding: var(--df-space-2) var(--df-space-4);
  background: var(--df-surface);
  border: 1px solid var(--df-border-strong);
  border-radius: var(--df-radius);
  transition: transform var(--df-duration) var(--df-ease);
  position: absolute;
  transform: translateY(-200%);
}

.df-skip-link:focus-visible {
  transform: translateY(0);
}

.df-stack {
  gap: var(--df-space-5);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.df-stack--tight {
  gap: var(--df-space-3);
}

.df-stack--loose {
  gap: var(--df-space-6);
}

.df-row {
  align-items: center;
  gap: var(--df-space-3);
  min-width: 0;
  display: flex;
}

.df-cluster {
  align-items: center;
  gap: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-spacer {
  flex: auto;
}

.df-grid {
  gap: var(--df-space-4);
  grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
  display: grid;
}

.df-grid--2 {
  grid-template-columns: repeat(auto-fit, minmax(min(22rem, 100%), 1fr));
}

.df-grid--4 {
  grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr));
}

.df-split {
  gap: var(--df-space-4);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  display: grid;
}

@media (width <= 1023px) {
  .df-split {
    grid-template-columns: minmax(0, 1fr);
  }
}

.df-truncate {
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
}

.df-muted {
  color: var(--df-text-muted);
}

.df-subtle {
  color: var(--df-text-subtle);
}

.df-small {
  font-size: var(--df-text-xs);
}

.df-strong {
  font-weight: var(--df-weight-semibold);
}

.df-mono {
  font-family: var(--df-font-mono);
  font-size: .95em;
}

.df-numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.df-icon {
  vertical-align: -.125em;
  flex: none;
  display: inline-block;
}

.df-btn {
  justify-content: center;
  align-items: center;
  gap: var(--df-space-2);
  border-radius: var(--df-radius);
  font-weight: var(--df-weight-medium);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--df-duration) var(--df-ease),
    border-color var(--df-duration) var(--df-ease),
    color var(--df-duration) var(--df-ease);
  border: 1px solid rgba(0, 0, 0, 0);
  padding: .4375rem .875rem;
  line-height: 1;
  text-decoration: none;
  display: inline-flex;
}

.df-btn:hover {
  text-decoration: none;
}

.df-btn:disabled, .df-btn[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .55;
}

.df-btn--sm {
  min-height: 1.75rem;
  font-size: var(--df-text-xs);
  padding: .3125rem .625rem;
}

.df-btn--md {
  min-height: 2rem;
  font-size: var(--df-text-base);
  padding: .4375rem .875rem;
}

.df-btn--lg {
  min-height: 2.375rem;
  font-size: var(--df-text-md);
  padding: .625rem 1.25rem;
}

.df-btn--block {
  width: 100%;
}

.df-btn--primary {
  background: var(--df-accent);
  border-color: var(--df-accent);
  color: var(--df-accent-fg);
}

.df-btn--primary:hover:not(:disabled) {
  background: var(--df-accent-hover);
  border-color: var(--df-accent-hover);
}

.df-btn--primary:active:not(:disabled) {
  background: var(--df-accent-active);
}

.df-btn--secondary {
  background: var(--df-surface);
  border-color: var(--df-border-strong);
  color: var(--df-text);
}

.df-btn--secondary:hover:not(:disabled) {
  background: var(--df-surface-2);
  border-color: var(--df-text-subtle);
}

.df-btn--ghost {
  color: var(--df-text-muted);
  background: none;
}

.df-btn--ghost:hover:not(:disabled) {
  background: var(--df-surface-2);
  color: var(--df-text);
}

.df-btn--danger {
  background: var(--df-surface);
  border-color: var(--df-danger-line);
  color: var(--df-danger);
}

.df-btn--danger:hover:not(:disabled) {
  background: var(--df-danger-soft);
  border-color: var(--df-danger);
}

.df-btn--link {
  color: var(--df-accent-text);
  padding-left: var(--df-space-1);
  padding-right: var(--df-space-1);
  background: none;
}

.df-btn--link:hover:not(:disabled) {
  text-decoration: underline;
}

.df-btn.is-busy {
  cursor: progress;
}

.df-field {
  gap: var(--df-space-1);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.df-field__label {
  font-size: var(--df-text-xs);
  font-weight: var(--df-weight-medium);
  color: var(--df-text-muted);
  text-transform: uppercase;
  letter-spacing: .03em;
}

.df-field__required {
  color: var(--df-danger);
  margin-left: .125rem;
}

.df-field__hint {
  font-size: var(--df-text-xs);
  color: var(--df-text-subtle);
}

.df-field__error {
  align-items: center;
  gap: var(--df-space-1);
  font-size: var(--df-text-xs);
  color: var(--df-danger);
  display: flex;
}

.df-field__hint[hidden], .df-field__error[hidden] {
  display: none;
}

.df-input, .df-select, .df-textarea {
  background: var(--df-surface);
  width: 100%;
  color: var(--df-text);
  border: 1px solid var(--df-border-strong);
  border-radius: var(--df-radius);
  font-size: var(--df-text-base);
  transition: border-color var(--df-duration) var(--df-ease);
  padding: .4375rem .625rem;
}

.df-input::placeholder {
  color: var(--df-text-subtle);
}

.df-textarea::placeholder {
  color: var(--df-text-subtle);
}

.df-input:hover:not(:disabled), .df-select:hover:not(:disabled), .df-textarea:hover:not(:disabled) {
  border-color: var(--df-text-subtle);
}

.df-input:disabled, .df-select:disabled, .df-textarea:disabled {
  background: var(--df-surface-2);
  color: var(--df-text-subtle);
  cursor: not-allowed;
}

.df-input[readonly] {
  background: var(--df-surface-2);
}

.df-input[aria-invalid="true"], .df-select[aria-invalid="true"], .df-textarea[aria-invalid="true"] {
  border-color: var(--df-danger);
}

.df-input--numeric {
  font-variant-numeric: tabular-nums;
}

.df-textarea {
  resize: vertical;
  min-height: 4.5rem;
  line-height: var(--df-leading);
}

.df-select-wrap {
  min-width: 0;
  display: block;
  position: relative;
}

.df-select {
  appearance: none;
  cursor: pointer;
  padding-right: 2rem;
}

.df-select-wrap__chevron {
  pointer-events: none;
  color: var(--df-text-subtle);
  position: absolute;
  top: 50%;
  right: .625rem;
  transform: translateY(-50%);
}

.df-check, .df-toggle {
  align-items: center;
  gap: var(--df-space-2);
  cursor: pointer;
  min-width: 0;
  display: inline-flex;
}

.df-check__box {
  width: 1rem;
  height: 1rem;
  accent-color: var(--df-accent);
  cursor: pointer;
  flex: none;
}

.df-check__label {
  font-size: var(--df-text-base);
  min-width: 0;
}

.df-check:has(.df-check__box:disabled) {
  cursor: not-allowed;
  color: var(--df-text-subtle);
}

.df-toggle__input {
  opacity: 0;
  width: 1px;
  height: 1px;
  position: absolute;
}

.df-toggle__track {
  border-radius: var(--df-radius-pill);
  background: var(--df-border-strong);
  width: 2rem;
  height: 1.125rem;
  transition: background-color var(--df-duration) var(--df-ease);
  flex: none;
  position: relative;
}

.df-toggle__thumb {
  background: var(--df-surface);
  width: .875rem;
  height: .875rem;
  transition: transform var(--df-duration) var(--df-ease);
  border-radius: 50%;
  position: absolute;
  top: 2px;
  left: 2px;
}

.df-toggle__input:checked + .df-toggle__track {
  background: var(--df-accent);
}

.df-toggle__input:checked + .df-toggle__track .df-toggle__thumb {
  transform: translateX(.875rem);
}

.df-toggle__input:focus-visible + .df-toggle__track {
  outline: 2px solid var(--df-ring);
  outline-offset: 2px;
}

.df-badge {
  border-radius: var(--df-radius);
  font-weight: var(--df-weight-medium);
  white-space: nowrap;
  border: 1px solid;
  align-items: center;
  gap: .25rem;
  padding: .125rem .4375rem;
  line-height: 1.4;
  display: inline-flex;
}

.df-badge--sm {
  font-size: var(--df-text-2xs);
  padding: .0625rem .375rem;
}

.df-badge--md {
  font-size: var(--df-text-xs);
}

.df-badge--lg {
  font-size: var(--df-text-sm);
  padding: .25rem .5rem;
}

.df-badge--tabular .df-badge__text {
  font-variant-numeric: tabular-nums;
}

.df-badge--neutral {
  color: var(--df-neutral);
  background: var(--df-neutral-soft);
  border-color: var(--df-neutral-line);
}

.df-badge--success {
  color: var(--df-success);
  background: var(--df-success-soft);
  border-color: var(--df-success-line);
}

.df-badge--warning {
  color: var(--df-warning);
  background: var(--df-warning-soft);
  border-color: var(--df-warning-line);
}

.df-badge--danger {
  color: var(--df-danger);
  background: var(--df-danger-soft);
  border-color: var(--df-danger-line);
}

.df-badge--info {
  color: var(--df-info);
  background: var(--df-info-soft);
  border-color: var(--df-info-line);
}

.df-badge--accent {
  color: var(--df-accent-text);
  background: var(--df-accent-soft);
  border-color: var(--df-accent-line);
}

.df-card {
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  min-width: 0;
}

.df-card--joined {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.df-card__header {
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--df-space-4);
  padding: var(--df-space-3) var(--df-space-4);
  border-bottom: 1px solid var(--df-border);
  display: flex;
}

.df-card__heading {
  min-width: 0;
}

.df-card__title {
  font-size: var(--df-text-md);
  font-weight: var(--df-weight-semibold);
}

.df-card__description {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  overflow-wrap: anywhere;
  margin-top: .125rem;
}

.df-card__actions {
  align-items: center;
  gap: var(--df-space-2);
  flex: none;
  display: flex;
}

.df-card__body {
  padding: var(--df-space-4);
  min-width: 0;
}

.df-card__body--flush {
  padding: 0;
}

.df-page-header {
  gap: var(--df-space-2);
  flex-direction: column;
  display: flex;
}

.df-page-header__row {
  justify-content: space-between;
  align-items: flex-end;
  gap: var(--df-space-4);
  flex-wrap: wrap;
  display: flex;
}

.df-page-header__heading {
  min-width: 0;
}

.df-page-header__title {
  font-size: var(--df-text-xl);
  font-weight: var(--df-weight-semibold);
  letter-spacing: -.01em;
}

.df-page-header__subtitle {
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
  margin-top: .125rem;
}

.df-page-header__actions {
  align-items: center;
  gap: var(--df-space-2);
  display: flex;
}

.df-page-header__actions > .df-badge, .df-page-header__actions > span > .df-badge {
  min-height: 2rem;
  font-size: var(--df-text-xs);
  padding-left: .75rem;
  padding-right: .75rem;
}

.df-separator {
  background: var(--df-border);
  height: 1px;
}

.df-table-scroll {
  overscroll-behavior-x: contain;
  width: 100%;
  overflow-x: auto;
}

.df-table-scroll--fits {
  overflow: visible;
}

.df-table {
  border-collapse: collapse;
  width: 100%;
  font-size: var(--df-text-sm);
}

.df-table__head {
  background: var(--df-surface-2);
}

.df-table__th {
  padding: var(--df-space-2) var(--df-space-3);
  text-align: left;
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--df-text-muted);
  white-space: nowrap;
  border-bottom: 1px solid var(--df-border);
}

.df-table__td {
  padding: var(--df-space-2) var(--df-space-3);
  border-bottom: 1px solid var(--df-border);
  vertical-align: middle;
}

.df-table__cell--numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.df-table__row:hover .df-table__td {
  background: var(--df-surface-2);
}

.df-table__row.is-selected .df-table__td {
  background: var(--df-accent-soft);
}

.df-table__row.is-clickable {
  cursor: pointer;
}

.df-table__row.is-clickable .df-table__td {
  cursor: auto;
}

.df-table__row.is-clickable a, .df-table__row.is-clickable button, .df-table__row.is-clickable label {
  cursor: pointer;
}

.df-table__body .df-table__row:last-child .df-table__td {
  border-bottom: 0;
}

.df-table--dense .df-table__th, .df-table--dense .df-table__td {
  padding: .1875rem var(--df-space-2);
  font-size: var(--df-text-xs);
}

.df-sort {
  align-items: center;
  gap: var(--df-space-1);
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  display: inline-flex;
}

.df-sort:hover {
  color: var(--df-text);
}

.df-sort:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: 2px;
  border-radius: var(--df-radius-sm);
}

.df-sort__icon {
  opacity: .3;
  transition: opacity var(--df-duration) var(--df-ease);
  flex: none;
}

.df-sort:hover .df-sort__icon {
  opacity: .6;
}

.df-sort:focus-visible .df-sort__icon {
  opacity: .6;
}

.df-sort.is-on {
  color: var(--df-text);
}

.df-sort.is-on .df-sort__icon {
  opacity: 1;
}

.df-table__cell--numeric .df-sort {
  flex-direction: row-reverse;
}

.df-table--sticky .df-table__head .df-table__th {
  top: var(--df-topbar-height);
  z-index: var(--df-z-sticky);
  position: sticky;
}

.df-pagination {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-4);
  padding: var(--df-space-3) var(--df-space-4);
  border-top: 1px solid var(--df-border);
  flex-wrap: wrap;
  display: flex;
}

.df-pagination__summary {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  font-variant-numeric: tabular-nums;
}

.df-pagination__pages {
  align-items: center;
  gap: var(--df-space-1);
  display: flex;
}

.df-pagination__link {
  border-radius: var(--df-radius);
  min-width: 1.75rem;
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  font-variant-numeric: tabular-nums;
  border: 1px solid rgba(0, 0, 0, 0);
  justify-content: center;
  align-items: center;
  gap: .25rem;
  padding: .25rem .5rem;
  display: inline-flex;
}

.df-pagination__link:hover {
  background: var(--df-surface-2);
  color: var(--df-text);
  text-decoration: none;
}

.df-pagination__link.is-current {
  background: var(--df-accent-soft);
  border-color: var(--df-accent-line);
  color: var(--df-accent-text);
  font-weight: var(--df-weight-semibold);
}

.df-pagination__link.is-disabled {
  opacity: .45;
  pointer-events: none;
}

.df-pagination__gap {
  color: var(--df-text-subtle);
  padding: 0 .25rem;
}

body.df-scroll-locked {
  overflow: hidden;
}

.df-modal-layer {
  z-index: var(--df-z-dialog);
  padding: var(--df-space-4);
  place-items: center;
  display: grid;
  position: fixed;
  inset: 0;
}

.df-modal__backdrop {
  background: rgba(9, 16, 24, .55);
  position: absolute;
  inset: 0;
}

.df-modal {
  width: 100%;
  max-height: calc(100vh - 2 * var(--df-space-6));
  background: var(--df-overlay);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-lg);
  box-shadow: var(--df-shadow-dialog);
  flex-direction: column;
  display: flex;
  position: relative;
}

.df-modal--sm {
  max-width: 24rem;
}

.df-modal--md {
  max-width: 34rem;
}

.df-modal--lg {
  max-width: 52rem;
}

.df-modal__header {
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--df-space-4);
  padding: var(--df-space-4);
  border-bottom: 1px solid var(--df-border);
  display: flex;
}

.df-modal__title {
  font-size: var(--df-text-lg);
}

.df-modal__description {
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
  margin-top: .125rem;
}

.df-modal__close {
  padding: var(--df-space-1);
  border-radius: var(--df-radius);
  color: var(--df-text-muted);
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  display: inline-flex;
}

.df-modal__close:hover {
  background: var(--df-surface-2);
  color: var(--df-text);
}

.df-modal__body {
  padding: var(--df-space-4);
  min-height: 0;
  overflow-y: auto;
}

.df-modal__footer {
  justify-content: flex-end;
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-3) var(--df-space-4);
  border-top: 1px solid var(--df-border);
  background: var(--df-surface-2);
  border-radius: 0 0 var(--df-radius-lg) var(--df-radius-lg);
  display: flex;
}

.df-dropdown {
  display: inline-block;
  position: relative;
}

.df-dropdown__scrim {
  z-index: calc(var(--df-z-dropdown) - 1);
  position: fixed;
  inset: 0;
}

.df-dropdown__menu {
  z-index: var(--df-z-dropdown);
  min-width: 12rem;
  padding: var(--df-space-1);
  background: var(--df-overlay);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  box-shadow: var(--df-shadow-menu);
  overscroll-behavior: contain;
  max-height: min(28rem, 70vh);
  position: absolute;
  top: calc(100% + 4px);
  overflow: hidden auto;
}

.df-dropdown__menu:has(.df-notif__list) {
  max-height: none;
  overflow: visible;
}

.df-dropdown__menu:has(.df-lgrid__columns) {
  max-height: none;
  overflow: visible;
}

.df-dropdown__menu[hidden] {
  display: none;
}

.df-dropdown__menu--start {
  left: 0;
}

.df-dropdown__menu--end {
  right: 0;
}

.df-dropdown__item {
  align-items: center;
  gap: var(--df-space-2);
  width: 100%;
  padding: .375rem var(--df-space-2);
  border-radius: var(--df-radius-sm);
  font-size: var(--df-text-sm);
  color: var(--df-text);
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  display: flex;
}

.df-dropdown__item:hover {
  background: var(--df-surface-2);
  text-decoration: none;
}

.df-dropdown__item:disabled {
  color: var(--df-text-subtle);
  cursor: not-allowed;
}

.df-dropdown__item--danger {
  color: var(--df-danger);
}

.df-dropdown__item--danger:hover {
  background: var(--df-danger-soft);
}

.df-info-hint {
  color: var(--df-text-subtle);
  margin-left: .25rem;
}

.df-tabs {
  align-items: stretch;
  gap: var(--df-space-1);
  border-bottom: 1px solid var(--df-border);
  scroll-behavior: smooth;
  display: flex;
  overflow-x: auto;
}

.df-tabs--inset {
  padding: 0 var(--df-space-5);
}

.df-tabs__tab {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-2) var(--df-space-3);
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-medium);
  color: var(--df-text-muted);
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: 0;
  border-bottom: 2px solid rgba(0, 0, 0, 0);
  margin-bottom: -1px;
  display: inline-flex;
}

.df-tabs__tab:hover {
  color: var(--df-text);
  text-decoration: none;
}

.df-tabs__tab.is-active {
  color: var(--df-accent-text);
  border-bottom-color: var(--df-accent);
}

.df-tabs__count {
  border-radius: var(--df-radius-pill);
  background: var(--df-surface-3);
  font-size: var(--df-text-2xs);
  font-variant-numeric: tabular-nums;
  padding: 0 .3125rem;
}

.df-tabs__panel {
  padding-top: var(--df-space-4);
}

.df-tabs__panel[hidden] {
  display: none;
}

.df-empty {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-7) var(--df-space-4);
  text-align: center;
  flex-direction: column;
  display: flex;
}

.df-empty__icon {
  color: var(--df-text-subtle);
}

.df-empty__title {
  font-weight: var(--df-weight-semibold);
}

.df-empty__description {
  max-width: 28rem;
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
}

.df-empty__action {
  margin-top: var(--df-space-2);
}

.df-spinner {
  opacity: .7;
  border: 2px solid;
  border-right-color: rgba(0, 0, 0, 0);
  border-radius: 50%;
  animation: .64s linear infinite df-spin;
  display: inline-block;
}

.df-spinner--sm {
  width: .875rem;
  height: .875rem;
}

.df-spinner--md {
  width: 1.25rem;
  height: 1.25rem;
}

.df-spinner--lg {
  border-width: 3px;
  width: 2rem;
  height: 2rem;
}

@keyframes df-spin {
  to {
    transform: rotate(360deg);
  }
}

.df-skeleton {
  border-radius: var(--df-radius-sm);
  background: linear-gradient(90deg,
    var(--df-surface-2) 25%,
    var(--df-surface-3) 37%,
    var(--df-surface-2) 63%);
  background-size: 400% 100%;
  animation: 1.4s ease-in-out infinite df-shimmer;
  display: block;
}

@keyframes df-shimmer {
  0% {
    background-position: 100%;
  }

  100% {
    background-position: 0;
  }
}

.df-progress {
  border-radius: var(--df-radius-pill);
  background: var(--df-surface-3);
  width: 100%;
  height: .375rem;
  position: relative;
  overflow: hidden;
}

.df-progress__fill {
  border-radius: inherit;
  background: var(--df-neutral);
  height: 100%;
  transition: width var(--df-duration) var(--df-ease);
  display: block;
}

.df-progress--success .df-progress__fill {
  background: var(--df-success);
}

.df-progress--warning .df-progress__fill {
  background: var(--df-warning);
}

.df-progress--danger .df-progress__fill {
  background: var(--df-danger);
}

.df-progress--info .df-progress__fill, .df-progress--accent .df-progress__fill {
  background: var(--df-accent);
}

.df-breadcrumb__list {
  align-items: center;
  gap: var(--df-space-1);
  font-size: var(--df-text-xs);
  flex-wrap: wrap;
  display: flex;
}

.df-breadcrumb__item {
  align-items: center;
  gap: var(--df-space-1);
  display: inline-flex;
}

.df-breadcrumb__link {
  color: var(--df-text-muted);
}

.df-breadcrumb__link:hover {
  color: var(--df-text);
}

.df-breadcrumb__current {
  color: var(--df-text);
  font-weight: var(--df-weight-medium);
}

.df-breadcrumb__sep {
  color: var(--df-text-subtle);
}

.df-avatar {
  background: var(--df-accent-soft);
  color: var(--df-accent-text);
  font-weight: var(--df-weight-semibold);
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.df-avatar--sm {
  width: 1.5rem;
  height: 1.5rem;
  font-size: var(--df-text-2xs);
}

.df-avatar--md {
  width: 2rem;
  height: 2rem;
  font-size: var(--df-text-xs);
}

.df-avatar--lg {
  width: 2.75rem;
  height: 2.75rem;
  font-size: var(--df-text-base);
}

.df-avatar__image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.df-toasts {
  right: var(--df-space-4);
  bottom: var(--df-space-4);
  z-index: var(--df-z-toast);
  gap: var(--df-space-2);
  width: min(24rem, calc(100vw - 2 * var(--df-space-4)));
  pointer-events: none;
  flex-direction: column;
  display: flex;
  position: fixed;
}

.df-toast {
  align-items: flex-start;
  gap: var(--df-space-2);
  padding: var(--df-space-3);
  background: var(--df-overlay);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  box-shadow: var(--df-shadow-menu);
  pointer-events: auto;
  border-left-width: 3px;
  display: flex;
}

.df-toast__body {
  flex: auto;
  min-width: 0;
}

.df-toast__title {
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-medium);
}

.df-toast__detail {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  margin-top: .125rem;
}

.df-toast__close {
  border-radius: var(--df-radius-sm);
  color: var(--df-text-subtle);
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  padding: .125rem;
}

.df-toast__close:hover {
  color: var(--df-text);
}

.df-toast--success {
  border-left-color: var(--df-success);
  color: var(--df-text);
}

.df-toast--success > .df-icon {
  color: var(--df-success);
}

.df-toast--warning {
  border-left-color: var(--df-warning);
}

.df-toast--warning > .df-icon {
  color: var(--df-warning);
}

.df-toast--danger {
  border-left-color: var(--df-danger);
}

.df-toast--danger > .df-icon {
  color: var(--df-danger);
}

.df-toast--info, .df-toast--accent {
  border-left-color: var(--df-accent);
}

.df-toast--info > .df-icon, .df-toast--accent > .df-icon {
  color: var(--df-accent);
}

.df-toast--neutral {
  border-left-color: var(--df-neutral);
}

.df-toast--neutral > .df-icon {
  color: var(--df-neutral);
}

.df-error-panel {
  padding: var(--df-space-4);
  background: var(--df-danger-soft);
  border: 1px solid var(--df-danger-line);
  border-radius: var(--df-radius);
}

.df-error-panel__item + .df-error-panel__item {
  margin-top: var(--df-space-3);
  padding-top: var(--df-space-3);
  border-top: 1px solid var(--df-danger-line);
}

.df-error-panel__title {
  font-weight: var(--df-weight-semibold);
  color: var(--df-danger);
}

.df-error-panel__detail {
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
  margin-top: .125rem;
}

.df-error-page {
  justify-content: center;
  align-items: center;
  gap: var(--df-space-2);
  min-height: 60vh;
  padding: var(--df-space-6);
  text-align: center;
  flex-direction: column;
  display: flex;
}

.df-error-page__code {
  font-size: var(--df-text-2xl);
  font-weight: var(--df-weight-semibold);
  color: var(--df-text-subtle);
  font-variant-numeric: tabular-nums;
}

.df-error-page__title {
  font-size: var(--df-text-xl);
}

.df-error-page__detail {
  max-width: 32rem;
  color: var(--df-text-muted);
}

.df-error-page__actions {
  justify-content: center;
  gap: var(--df-space-2);
  margin-top: var(--df-space-3);
  flex-wrap: wrap;
  display: flex;
}

.df-error-page__foot {
  margin-top: var(--df-space-5);
}

.df-shell {
  grid-template-columns: var(--df-sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
  display: grid;
}

.df-shell__sidebar {
  z-index: var(--df-z-sidebar);
  gap: var(--df-space-4);
  height: 100vh;
  padding: var(--df-space-3);
  background: var(--df-surface);
  border-right: 1px solid var(--df-border);
  flex-direction: column;
  display: flex;
  position: sticky;
  top: 0;
  overflow-y: auto;
}

.df-shell__brand {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-2);
  font-weight: var(--df-weight-semibold);
  color: var(--df-text);
  display: flex;
}

.df-shell__topbar {
  z-index: var(--df-z-sticky);
  align-items: center;
  gap: var(--df-space-3);
  height: var(--df-topbar-height);
  padding: 0 var(--df-space-5);
  background: var(--df-surface);
  border-bottom: 1px solid var(--df-border);
  display: flex;
  position: sticky;
  top: 0;
}

.df-shell__main {
  min-width: 0;
  display: block;
}

.df-shell__content {
  --df-content-gutter: var(--df-space-5);
  width: 100%;
  max-width: var(--df-content-max);
  padding: var(--df-content-gutter);
  min-width: 0;
  margin: 0 auto;
}

.df-shell__content.is-wide {
  max-width: none;
}

.df-nav {
  gap: var(--df-space-4);
  flex-direction: column;
  display: flex;
}

.df-nav__group {
  flex-direction: column;
  gap: .125rem;
  display: flex;
}

.df-nav__heading {
  padding: 0 var(--df-space-2) var(--df-space-1);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--df-text-subtle);
}

.df-nav__link {
  align-items: center;
  gap: var(--df-space-2);
  padding: .375rem var(--df-space-2);
  border-radius: var(--df-radius);
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
  display: flex;
}

.df-nav__link:hover {
  background: var(--df-surface-2);
  color: var(--df-text);
  text-decoration: none;
}

.df-nav__link.is-active {
  background: var(--df-accent-soft);
  color: var(--df-accent-text);
  font-weight: var(--df-weight-medium);
}

.df-nav__badge {
  border-radius: var(--df-radius-pill);
  background: var(--df-surface-3);
  font-size: var(--df-text-2xs);
  font-variant-numeric: tabular-nums;
  margin-left: auto;
  padding: 0 .3125rem;
}

@media (width <= 1023px) {
  .df-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .df-shell__sidebar {
    width: var(--df-sidebar-width);
    transition: transform var(--df-duration) var(--df-ease),
      visibility 0s linear var(--df-duration);
    position: fixed;
    inset: 0 auto 0 0;
    transform: translateX(-100%);
  }

  .df-shell__sidebar.is-live:not(.is-open) {
    visibility: hidden;
  }

  .df-shell__sidebar.is-open {
    visibility: visible;
    box-shadow: var(--df-shadow-dialog);
    transition: transform var(--df-duration) var(--df-ease),
      visibility 0s linear 0s;
    transform: translateX(0);
  }

  .df-shell__content {
    --df-content-gutter: var(--df-space-4);
  }
}

.df-public {
  justify-content: center;
  align-items: center;
  gap: var(--df-space-4);
  min-height: 100vh;
  padding: var(--df-space-6);
  text-align: center;
  flex-direction: column;
  display: flex;
}

.df-public__panel {
  width: 100%;
  max-width: 22rem;
  padding: var(--df-space-5);
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-lg);
  text-align: left;
}

.df-viewer {
  background: var(--df-surface-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  position: relative;
  overflow: auto;
}

.df-viewer__page {
  margin: 0 auto;
  line-height: 0;
  position: relative;
}

.df-viewer__image {
  width: 100%;
  height: auto;
}

.df-viewer__overlay {
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.df-viewer__box {
  border: 1.5px solid var(--df-accent);
  pointer-events: auto;
  cursor: pointer;
  background: rgba(26, 75, 124, .12);
  border-radius: 1px;
  position: absolute;
}

.df-viewer__box.is-active {
  border-color: var(--df-warning);
  background: rgba(161, 92, 0, .18);
}

.df-viewer__box--read {
  border-color: var(--df-success);
  background: rgba(15, 123, 62, .1);
}

.df-viewer__box--missed {
  border-color: var(--df-danger);
  background: rgba(179, 38, 30, .1);
}

.df-grid-cell {
  padding: 0;
}

.df-grid-cell__input {
  width: 100%;
  padding: .1875rem var(--df-space-2);
  font-size: var(--df-text-xs);
  background: none;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 0;
}

.df-grid-cell__input:focus {
  background: var(--df-surface);
  border-color: var(--df-accent);
  box-shadow: inset 0 0 0 1px var(--df-accent);
  outline: none;
}

.df-grid-cell--numeric .df-grid-cell__input {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.df-grid-cell.is-changed .df-grid-cell__input {
  background: var(--df-warning-soft);
}

.df-grid-cell.is-invalid .df-grid-cell__input {
  background: var(--df-danger-soft);
  border-color: var(--df-danger-line);
}

.df-canvas {
  background: var(--df-surface-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  cursor: crosshair;
  touch-action: none;
  position: relative;
  overflow: hidden;
}

.df-canvas__zone {
  border: 2px solid var(--df-indigo);
  background: rgba(63, 61, 143, .12);
  position: absolute;
}

.df-canvas__zone.is-selected {
  border-color: var(--df-warning);
  background: rgba(161, 92, 0, .16);
}

.df-canvas__table {
  border: 2px dashed var(--df-cyan);
  background: rgba(14, 116, 144, .08);
  position: absolute;
}

.df-dropzone {
  justify-content: center;
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-7);
  border: 2px dashed var(--df-border-strong);
  border-radius: var(--df-radius-lg);
  background: var(--df-surface);
  text-align: center;
  transition: border-color var(--df-duration) var(--df-ease),
    background-color var(--df-duration) var(--df-ease);
  flex-direction: column;
  display: flex;
}

.df-dropzone.is-over {
  border-color: var(--df-accent);
  background: var(--df-accent-soft);
}

.df-dropzone.is-rejecting {
  border-color: var(--df-danger);
  background: var(--df-danger-soft);
}

.df-kpi-grid {
  gap: var(--df-space-3);
  grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
  display: grid;
}

.df-kpi {
  gap: var(--df-space-1);
  padding: var(--df-space-4);
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-left: 3px solid var(--df-border-strong);
  border-radius: var(--df-radius);
  color: inherit;
  transition: border-color var(--df-duration) var(--df-ease),
    background-color var(--df-duration) var(--df-ease);
  flex-direction: column;
  text-decoration: none;
  display: flex;
}

.df-kpi:hover {
  background: var(--df-surface-2);
}

.df-kpi:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: 2px;
}

.df-kpi--accent {
  border-left-color: var(--df-accent);
}

.df-kpi--success {
  border-left-color: var(--df-success);
}

.df-kpi--warning {
  border-left-color: var(--df-warning);
}

.df-kpi--danger {
  border-left-color: var(--df-danger);
}

.df-kpi--info {
  border-left-color: var(--df-info);
}

.df-kpi--neutral {
  border-left-color: var(--df-neutral);
}

.df-kpi__label {
  font-size: var(--df-text-xs);
  font-weight: var(--df-weight-medium);
  color: var(--df-text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.df-kpi__value {
  font-size: var(--df-text-2xl);
  font-weight: var(--df-weight-semibold);
  line-height: var(--df-leading-tight);
  font-variant-numeric: tabular-nums;
}

.df-kpi__foot {
  align-items: center;
  gap: var(--df-space-2);
  min-height: 1.25rem;
  display: flex;
}

.df-kpi__trend {
  align-items: center;
  display: inline-flex;
}

.df-kpi__note {
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
  display: block;
}

.df-dash {
  gap: var(--df-space-4);
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  align-items: start;
  display: grid;
}

@media (width <= 1099px) {
  .df-dash {
    grid-template-columns: minmax(0, 1fr);
  }
}

.df-chart {
  width: 100%;
}

.df-chart__svg {
  width: 100%;
  height: auto;
  display: block;
  overflow: visible;
}

.df-chart__bar {
  fill: var(--df-accent);
  opacity: .55;
}

.df-chart__bar--peak {
  opacity: 1;
}

.df-chart__axis {
  stroke: var(--df-border-strong);
  stroke-width: 1px;
}

.df-chart__grid {
  stroke: var(--df-border);
  stroke-width: 1px;
  stroke-dasharray: 3 3;
}

.df-chart__tick, .df-chart__peak {
  fill: var(--df-text-subtle);
  font-family: var(--df-font);
  font-variant-numeric: tabular-nums;
  font-size: 11px;
}

.df-chart__tick {
  text-anchor: middle;
}

.df-chart__peak {
  text-anchor: start;
}

.df-metrics {
  gap: var(--df-space-1) var(--df-space-3);
  grid-template-columns: repeat(auto-fit, minmax(min(7rem, 100%), 1fr));
  margin: 0;
  display: grid;
}

.df-metric {
  padding: var(--df-space-2) 0;
  border-bottom: 1px solid var(--df-border);
  flex-direction: column;
  gap: 0;
  min-width: 0;
  display: flex;
}

.df-metric__label {
  font-size: var(--df-text-2xs);
  color: var(--df-text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.df-metric__value {
  font-size: var(--df-text-lg);
  font-weight: var(--df-weight-semibold);
  font-variant-numeric: tabular-nums;
  margin: 0;
}

.df-metric.is-alert .df-metric__value {
  color: var(--df-danger);
}

.df-dash-queues {
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.df-dash-queue {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-3);
  padding: var(--df-space-2) 0;
  border-bottom: 1px solid var(--df-border);
  display: flex;
}

.df-dash-queue:last-child {
  border-bottom: 0;
}

.df-dash-queue__link {
  color: var(--df-accent-text);
  font-weight: var(--df-weight-medium);
  text-decoration: none;
}

.df-dash-queue__link:hover {
  text-decoration: underline;
}

.df-dash-queue__link:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: 2px;
  border-radius: var(--df-radius-sm);
}

.df-btn--stacked {
  text-align: left;
  padding-block: var(--df-space-3);
  justify-content: flex-start;
}

.df-btn--stacked .df-btn__label {
  flex-direction: column;
  align-items: flex-start;
  gap: .125rem;
  line-height: 1.3;
  display: flex;
}

.df-btn__note {
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-normal);
  opacity: .8;
}

.df-quota {
  align-items: baseline;
  gap: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-quota__figure {
  font-size: var(--df-text-2xl);
  font-weight: var(--df-weight-semibold);
  font-variant-numeric: tabular-nums;
}

.df-quota__unit {
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
}

.df-approvals {
  gap: var(--df-space-4);
  grid-template-columns: minmax(0, 1fr) 17rem;
  align-items: start;
  display: grid;
}

.df-approvals__side {
  top: var(--df-space-4);
  gap: var(--df-space-3);
  flex-direction: column;
  min-width: 0;
  display: flex;
  position: sticky;
}

@media (width <= 1023px) {
  .df-approvals {
    grid-template-columns: minmax(0, 1fr);
  }

  .df-approvals__side {
    position: static;
  }
}

.df-approvals-filters {
  align-items: flex-end;
  gap: var(--df-space-3);
  flex-wrap: wrap;
  display: flex;
}

.df-approvals-filters__field {
  flex: 11rem;
  min-width: 9rem;
  max-width: 18rem;
}

.df-approvals-filters__actions {
  align-items: center;
  gap: var(--df-space-2);
  display: flex;
}

.df-approvals-stats {
  gap: var(--df-space-3);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  display: grid;
}

.df-approvals-stat {
  gap: var(--df-space-1);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.df-approvals-stat__label {
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-medium);
  color: var(--df-text-subtle);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.df-approvals-stat__value {
  align-items: baseline;
  gap: var(--df-space-2);
  font-size: var(--df-text-lg);
  font-weight: var(--df-weight-semibold);
  font-variant-numeric: tabular-nums;
  color: var(--df-text);
  margin: 0;
  display: flex;
}

.df-approvals-stat__note {
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-normal);
  color: var(--df-text-subtle);
}

.df-approvals-age {
  font-variant-numeric: tabular-nums;
}

.df-approvals-age.is-breached {
  font-weight: var(--df-weight-semibold);
  color: var(--df-danger);
}

.df-approvals-file {
  align-items: center;
  gap: var(--df-space-2);
  min-width: 0;
  max-width: 100%;
  color: var(--df-text);
  text-decoration: none;
  display: inline-flex;
}

.df-approvals-file:hover {
  color: var(--df-accent-text);
  text-decoration: underline;
}

.df-approvals-file__note {
  margin-left: var(--df-space-2);
  display: inline-flex;
}

.df-approvals-row-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
}

.df-approvals-bulkbar {
  left: 50%;
  bottom: var(--df-space-4);
  z-index: var(--df-z-sticky);
  justify-content: safe flex-end;
  align-items: center;
  gap: var(--df-space-3);
  width: min(42rem, calc(100vw - var(--df-space-6)));
  padding: var(--df-space-3) var(--df-space-4);
  background: var(--df-overlay);
  border: 1px solid var(--df-border-strong);
  border-radius: var(--df-radius-lg);
  box-shadow: var(--df-shadow-dialog);
  flex-wrap: wrap;
  display: flex;
  position: fixed;
  transform: translateX(-50%);
}

.df-approvals-bulkbar__count {
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-medium);
  font-variant-numeric: tabular-nums;
  margin: 0 auto 0 0;
}

.df-decision-bar {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-2) var(--df-space-3);
  background: var(--df-surface-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  flex-wrap: wrap;
  display: flex;
}

.df-decision-bar p {
  margin: 0;
}

.df-doc__head {
  top: var(--df-topbar-height);
  z-index: var(--df-z-sticky);
  gap: var(--df-space-2);
  margin: calc(var(--df-content-gutter) * -1) calc(var(--df-content-gutter) * -1) 0;
  padding: var(--df-content-gutter) var(--df-content-gutter) var(--df-space-2);
  background: var(--df-bg);
  border-bottom: 1px solid var(--df-border);
  flex-direction: column;
  display: flex;
  position: sticky;
}

.df-doc__identity {
  gap: var(--df-space-1);
  flex-direction: column;
  display: flex;
}

.df-doc__identity-crumbs {
  font-size: var(--df-text-2xs);
}

.df-doc__identity-row {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-4);
  flex-wrap: wrap;
  display: flex;
}

.df-doc__identity-name {
  align-items: center;
  gap: var(--df-space-3);
  flex: auto;
  min-width: 0;
  display: flex;
}

.df-doc__identity-title {
  font-size: var(--df-text-md);
  font-weight: var(--df-weight-semibold);
  letter-spacing: -.01em;
  min-width: 0;
}

.df-doc__identity-sub {
  font-size: var(--df-text-2xs);
  color: var(--df-text-muted);
}

.df-doc__pills {
  margin-top: 0;
}

.df-doc__toolbar {
  justify-content: flex-end;
}

.df-doc__toolbar-note {
  gap: var(--df-space-2);
  text-align: left;
  font-size: var(--df-text-sm);
  color: var(--df-warning);
  flex: 1 0 100%;
  align-items: flex-start;
  margin: 0;
  display: flex;
}

.df-doc__toolbar-note > svg {
  flex: none;
  margin-top: .15em;
}

.df-doc {
  max-width: 110rem;
  margin: 0 auto;
}

.df-doc__split {
  grid-template-columns: minmax(0, var(--df-doc-split, 70%))
    auto
    minmax(17.5rem, 1fr);
  align-items: start;
  gap: 0;
}

.df-doc__split.is-maximised {
  grid-template-columns: minmax(0, 1fr) auto;
}

.df-doc__split.is-ocr {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
}

.df-doc__split.is-expanded {
  grid-template-columns: minmax(0, 1fr) 3rem;
}

.df-doc__gutter {
  top: calc(var(--df-topbar-height) + var(--df-space-4));
  align-items: center;
  gap: var(--df-space-2);
  padding: 0 var(--df-space-2);
  flex-direction: column;
  align-self: stretch;
  display: flex;
  position: sticky;
}

.df-doc__maximise {
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-sm);
  background: var(--df-surface);
  width: 1.5rem;
  height: 1.5rem;
  color: var(--df-text-muted);
  cursor: pointer;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.df-doc__maximise:hover {
  color: var(--df-text);
  border-color: var(--df-border-strong);
}

.df-doc__maximise:focus-visible {
  color: var(--df-text);
  border-color: var(--df-border-strong);
}

.df-doc__grip {
  cursor: col-resize;
  touch-action: none;
  background: none;
  border: 0;
  flex: auto;
  justify-content: center;
  align-items: stretch;
  width: .75rem;
  min-height: 3rem;
  display: flex;
}

.df-doc__grip-bar {
  background: var(--df-border);
  border-radius: 1px;
  width: 1px;
}

.df-doc__grip:hover .df-doc__grip-bar {
  background: var(--df-accent);
  width: 3px;
}

.df-doc__grip:focus-visible .df-doc__grip-bar {
  background: var(--df-accent);
  width: 3px;
}

.df-doc__grip:focus-visible {
  outline: 2px solid var(--df-accent);
  outline-offset: 2px;
}

@media (width <= 1023px) {
  .df-doc__split, .df-doc__split.is-maximised, .df-doc__split.is-ocr, .df-doc__split.is-expanded {
    gap: var(--df-space-5);
    grid-template-columns: minmax(0, 1fr);
  }

  .df-doc__gutter {
    flex-direction: row;
    order: -1;
    justify-content: flex-end;
    padding: 0;
  }

  .df-doc__grip {
    display: none;
  }

  .df-doc__split.is-maximised .df-doc__pane--document {
    max-height: none;
  }
}

.df-doc__split:has(.df-doc__grip:active) {
  -webkit-user-select: none;
  user-select: none;
}

.df-doc__split:has(.df-doc__band-grip:active) {
  -webkit-user-select: none;
  user-select: none;
}

.df-doc__pane {
  min-width: 0;
}

.df-doc__stage {
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.df-doc__pane--document {
  max-height: 45vh;
  overflow: auto;
}

.df-doc__pane--document.is-strip {
  max-height: 6rem;
}

.df-doc__pane--document.is-strip .df-viewer__toolbar, .df-doc__pane--document.is-strip .df-viewer__status {
  display: none;
}

.df-doc__band-grip {
  cursor: row-resize;
  touch-action: none;
  flex: none;
  justify-content: center;
  align-items: center;
  height: .5rem;
  display: none;
}

.df-doc__band-grip-bar {
  background: var(--df-border);
  border-radius: 1px;
  width: 3rem;
  height: 1px;
}

.df-doc__band-grip:hover .df-doc__band-grip-bar {
  background: var(--df-accent);
  height: 3px;
}

.df-doc__band-grip:focus-visible .df-doc__band-grip-bar {
  background: var(--df-accent);
  height: 3px;
}

.df-doc__band-grip:focus-visible {
  outline: 2px solid var(--df-accent);
  outline-offset: -2px;
}

.df-doc__band {
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.df-doc__band .df-lgrid__scroll {
  max-height: 50vh;
}

.df-doc__split.is-expanded .df-doc__band .df-lgrid__scroll {
  max-height: 75vh;
}

.df-doc__pane--fields {
  flex-direction: column;
  min-height: 0;
  display: flex;
}

.df-doc__fields-scroll {
  flex: auto;
  min-height: 0;
}

.df-doc__foot-slot:not([hidden]) {
  display: contents;
}

.df-doc__foot {
  z-index: var(--df-z-sticky);
  border-top: 1px solid var(--df-border);
  background: var(--df-bg);
  flex-direction: column;
  flex: none;
  display: flex;
  position: sticky;
  bottom: 0;
}

.df-doc__checkline {
  align-items: center;
  gap: var(--df-space-2);
  min-height: 1.5rem;
  padding: 0 var(--df-space-1);
  font-size: var(--df-text-2xs);
  color: var(--df-text-muted);
  white-space: nowrap;
  display: flex;
  overflow: hidden;
}

.df-doc__checkline__text {
  text-overflow: ellipsis;
  overflow: hidden;
}

.df-doc__checkline .is-stale, .df-doc__checkline__stale {
  color: var(--df-warning);
}

.df-doc__actionbar {
  align-items: center;
  gap: var(--df-space-2);
  min-height: 2.75rem;
  padding: var(--df-space-1);
  display: flex;
  position: relative;
}

.df-doc__actionbar .df-spacer {
  flex: auto;
}

.df-doc__actionbar .df-doc__actionbar__unsaved {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 0 auto;
  min-width: 0;
  display: block;
  overflow: hidden;
}

.df-doc__actionbar .df-shortcut, .df-doc__actionbar .df-decide, .df-doc__actionbar .df-doc__actionbar__approve {
  flex: none;
}

.df-doc__pane--fields:not(.is-rail) .df-doc__foot {
  container-type: inline-size;
}

@container (width <= 30rem) {
  .df-doc__actionbar {
    flex-wrap: wrap;
    place-content: center flex-end;
    row-gap: 0;
  }

  .df-doc__actionbar .df-spacer {
    flex-basis: 100%;
  }

  .df-doc__actionbar .df-doc__actionbar__unsaved {
    margin-bottom: var(--df-space-1);
  }
}

.df-doc__actionbar .df-decide[open] > .df-decide__panel {
  margin: 0 0 var(--df-space-2);
  height: auto;
  max-height: calc(100vh - 8rem);
  width: min(26rem, calc(100vw - 2 * var(--df-space-4)));
  box-shadow: var(--df-shadow-menu);
  position: absolute;
  inset: auto 0 100% auto;
  overflow-y: auto;
}

.df-doc__form-submitters {
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.df-doc__pane--fields.is-rail {
  padding: var(--df-space-2) 0;
  align-items: center;
}

.df-doc__pane--fields.is-rail .df-doc__foot {
  background: none;
  border-top: 0;
  flex-direction: column;
  align-items: center;
  margin-top: auto;
}

.df-doc__pane--fields.is-rail .df-doc__checkline, .df-doc__pane--fields.is-rail .df-doc__actionbar {
  flex-direction: column;
  align-items: center;
  min-height: 0;
  padding: 0;
}

.df-doc__pane--fields.is-rail .df-doc__actionbar .df-btn__label, .df-doc__pane--fields.is-rail .df-doc__checkline__text, .df-doc__pane--fields.is-rail .df-doc__checkline .df-btn__label, .df-doc__pane--fields.is-rail .df-doc__actionbar .df-spacer, .df-doc__pane--fields.is-rail .df-doc__actionbar__unsaved {
  display: none;
}

.df-doc__pane--fields.is-rail .df-doc__actionbar .df-btn {
  justify-content: center;
  width: 2rem;
  min-width: 2rem;
  padding-inline: 0;
}

.df-doc__rail-show {
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-sm);
  background: var(--df-surface);
  width: 1.5rem;
  height: 1.5rem;
  color: var(--df-text-muted);
  cursor: pointer;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.df-doc__rail-show:hover {
  color: var(--df-text);
  border-color: var(--df-border-strong);
}

.df-doc__rail-show:focus-visible {
  color: var(--df-text);
  border-color: var(--df-border-strong);
}

@media (width <= 1023px) {
  .df-doc {
    padding-bottom: 5rem;
  }

  .df-doc__pane--fields {
    order: -2;
  }

  .df-doc__pane--document {
    max-height: 40vh;
  }

  .df-doc__band .df-lgrid__scroll {
    max-height: 60vh;
  }

  .df-doc__foot {
    z-index: var(--df-z-sticky);
    padding-inline: var(--df-space-4);
    box-shadow: var(--df-shadow-menu);
    position: fixed;
    inset: auto 0 0;
  }

  .df-doc__split.is-expanded .df-doc__pane--document {
    display: none;
  }

  .df-doc__split.is-expanded .df-doc__band .df-lgrid__scroll {
    max-height: 80vh;
  }

  .df-doc__pane--fields.is-rail {
    padding: 0;
  }

  .df-doc__pane--fields.is-rail .df-doc__foot {
    background: var(--df-bg);
    border-top: 1px solid var(--df-border);
    flex-direction: column;
    margin-top: 0;
  }

  .df-doc__pane--fields.is-rail .df-doc__checkline, .df-doc__pane--fields.is-rail .df-doc__actionbar {
    flex-direction: row;
  }
}

@media (width >= 1024px) and (height >= 760px) {
  .df-shell__main.is-fixed {
    grid-template-rows: auto minmax(0, 1fr);
    height: 100dvh;
    display: grid;
    overflow: hidden;
  }

  .df-shell__content.is-fixed {
    min-height: 0;
    padding-bottom: 0;
    display: flex;
    overflow: hidden;
  }

  .df-shell__content.is-fixed > .df-doc {
    gap: var(--df-space-3);
    flex: auto;
    min-height: 0;
  }

  .df-shell__content.is-fixed .df-doc__head {
    min-height: 0;
    padding-top: var(--df-space-3);
    overscroll-behavior: contain;
    flex: none;
    max-height: 33vh;
    position: static;
    overflow-y: auto;
  }

  .df-shell__content.is-fixed .df-doc__work {
    flex: auto;
    min-height: 0;
    overflow-y: auto;
  }

  .df-shell__content.is-fixed .df-doc__slot:not([hidden]) {
    flex-direction: column;
    height: 100%;
    min-height: 0;
    display: flex;
  }

  .df-shell__content.is-fixed .df-doc__split {
    flex: auto;
    align-items: stretch;
    min-height: 0;
  }

  .df-shell__content.is-fixed .df-doc__stage {
    grid-template-rows: minmax(0, 1fr) auto minmax(0, var(--df-doc-band, 50%));
    height: 100%;
    min-height: 0;
    display: grid;
  }

  .df-shell__content.is-fixed .df-doc__band-grip:not([hidden]) {
    display: flex;
  }

  .df-shell__content.is-fixed .df-doc__split.is-expanded .df-doc__stage {
    grid-template-rows: 6rem auto minmax(0, 1fr);
  }

  .df-shell__content.is-fixed .df-doc__split.is-ocr .df-doc__stage {
    grid-template-rows: minmax(0, 1fr);
  }

  .df-shell__content.is-fixed .df-doc__pane--document {
    flex-direction: column;
    height: auto;
    min-height: 0;
    max-height: none;
    display: flex;
    position: static;
    overflow: hidden;
  }

  .df-shell__content.is-fixed .df-doc__pane--document > .df-viewer-pane {
    flex: auto;
    min-height: 0;
  }

  .df-shell__content.is-fixed .df-doc__gutter {
    min-height: 0;
    position: static;
  }

  .df-shell__content.is-fixed .df-doc__pane--fields {
    flex-direction: column;
    height: 100%;
    min-height: 0;
    display: flex;
    overflow: visible;
  }

  .df-shell__content.is-fixed .df-doc__split.is-ocr .df-doc__pane--fields {
    overflow-y: auto;
  }

  .df-shell__content.is-fixed .df-doc__fields-scroll:not([hidden]) {
    flex: auto;
    min-height: 0;
    display: block;
    overflow-y: auto;
  }

  .df-shell__content.is-fixed .df-doc__foot {
    position: static;
  }

  .df-shell__content.is-fixed .df-doc__band:not([hidden]), .df-shell__content.is-fixed .df-doc__lines {
    flex-direction: column;
    flex: auto;
    min-height: 0;
    display: flex;
  }

  .df-shell__content.is-fixed .df-doc__lines > .df-lgrid {
    flex: auto;
    min-height: 0;
  }

  .df-shell__content.is-fixed .df-lgrid__scroll:not([hidden]), .df-shell__content.is-fixed .df-doc__split.is-expanded .df-lgrid__scroll:not([hidden]) {
    flex: auto;
    min-height: 0;
    max-height: none;
  }
}

.df-doc__notices:not(:empty) {
  align-items: flex-start;
  gap: var(--df-space-2);
  flex-flow: wrap;
}

.df-doc__notices > * {
  margin: 0;
}

.df-doc__notices > :not(details), .df-doc__notices > details[open] {
  flex: 100%;
}

.df-doc__notices > details:not([open]) {
  max-width: 100%;
  padding: .25rem var(--df-space-3);
  flex: 0 auto;
}

.df-fieldset {
  margin: 0 0 var(--df-space-5);
  border: 0;
  min-width: 0;
  padding: 0;
}

.df-fieldset__title {
  align-items: center;
  gap: var(--df-space-2);
  margin: 0 0 var(--df-space-3);
  font-size: var(--df-text-xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--df-text-muted);
  cursor: default;
  display: flex;
}

.df-fieldset--collapsed > .df-fieldset__title {
  cursor: pointer;
}

.df-fieldset__count {
  padding: 0 var(--df-space-2);
  font-size: var(--df-text-2xs);
  color: var(--df-accent-text);
  background: var(--df-accent-soft);
  border-radius: var(--df-radius-pill);
}

.df-fieldset--attention .df-fieldset__title {
  color: var(--df-warning);
}

.df-fields {
  gap: var(--df-space-4);
  flex-direction: column;
  display: flex;
}

.df-field-row {
  gap: var(--df-space-1);
  padding-left: var(--df-space-3);
  border-left: 2px solid rgba(0, 0, 0, 0);
  grid-template-columns: minmax(0, 1fr);
  display: grid;
  position: relative;
}

.df-field-row.is-attention {
  border-left-color: var(--df-warning-line);
}

.df-field-row.is-failing {
  border-left-color: var(--df-danger);
}

.df-field-row.is-low {
  border-left-color: var(--df-warning-line);
}

.df-field-row.is-confirmed {
  border-left-color: var(--df-success);
}

.df-field-row.is-failing:before, .df-field-row.is-low:before, .df-field-row.is-confirmed:before {
  width: var(--df-space-3);
  text-align: center;
  line-height: 1rem;
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
}

.df-field-row.is-failing:before {
  content: "!";
  color: var(--df-danger);
}

.df-field-row.is-low:before {
  content: "•";
  color: var(--df-warning);
}

.df-field-row.is-confirmed:before {
  content: "✓";
  color: var(--df-success);
}

.df-field-row__control {
  align-items: start;
  gap: var(--df-space-2);
  min-width: 0;
  display: flex;
}

.df-field-row__control > :first-child {
  flex: auto;
  min-width: 0;
}

.df-field-row__meta {
  gap: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-field-row__meta:empty {
  display: none;
}

.df-field-row__issue {
  height: 1.25rem;
  padding: 0 var(--df-space-2);
  border-radius: var(--df-radius-pill);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
  cursor: pointer;
  border: 1px solid;
  align-items: center;
  margin-left: auto;
  font-family: inherit;
  line-height: 1;
  display: inline-flex;
}

.df-field-row__issue:focus-visible {
  outline: 2px solid var(--df-accent);
  outline-offset: 1px;
}

.df-field-row__issue.is-danger {
  color: var(--df-danger);
  background: var(--df-danger-soft);
  border-color: var(--df-danger-line);
}

.df-field-row__issue.is-warning {
  color: var(--df-warning);
  background: var(--df-warning-soft);
  border-color: var(--df-warning-line);
}

.df-field-row__issue:hover {
  filter: brightness(.96);
}

.df-issue-dialog__list {
  gap: var(--df-space-3);
  padding-left: 0;
  list-style: none;
}

.df-issue-dialog__list > li {
  gap: var(--df-space-1);
  flex-direction: column;
  display: flex;
}

.df-issue-dialog__list p {
  margin: 0;
}

.df-fieldset__info {
  border-radius: var(--df-radius-pill);
  width: 1.25rem;
  height: 1.25rem;
  color: var(--df-text-muted);
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.df-fieldset__info:hover {
  color: var(--df-accent);
  background: var(--df-accent-soft);
  outline: none;
}

.df-fieldset__info:focus-visible {
  color: var(--df-accent);
  background: var(--df-accent-soft);
  outline: none;
}

.df-field-row__messages {
  padding-left: var(--df-space-4);
  font-size: var(--df-text-xs);
  color: var(--df-warning);
  margin: 0;
}

.df-pageread {
  gap: var(--df-space-2);
  flex-direction: column;
  display: flex;
}

.df-pageread .df-dropdown__menu {
  min-width: 22rem;
}

.df-pageread__item {
  text-align: left;
  flex-direction: column;
  gap: .125rem;
  display: flex;
}

.df-pageread__label {
  align-items: center;
  gap: var(--df-space-2);
  display: flex;
}

.df-pageread__decide {
  align-items: center;
  gap: var(--df-space-2);
  margin-top: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-dropdown__note {
  padding: var(--df-space-2) var(--df-space-3);
  border-top: 1px solid var(--df-border);
  white-space: normal;
  max-width: 22rem;
  margin: 0;
}

.df-field-row__learned {
  margin: var(--df-space-1) 0 0;
  align-items: baseline;
  gap: var(--df-space-2);
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  flex-wrap: wrap;
  display: flex;
}

.df-field-row__learned .df-icon {
  flex: none;
  align-self: center;
}

.df-field-row__learned.is-warning {
  color: var(--df-text);
}

.df-field-row__learned.is-warning .df-icon {
  color: var(--df-warning);
}

.df-link-button {
  font: inherit;
  color: var(--df-accent);
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  text-decoration: underline;
}

.df-link-button:hover {
  color: var(--df-accent-hover);
}

.df-link-button:focus-visible {
  color: var(--df-accent-hover);
}

.df-split__plan {
  gap: var(--df-space-2);
  padding: var(--df-space-3);
  background: var(--df-surface-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  flex-direction: column;
  display: flex;
}

.df-split__ranges {
  gap: var(--df-space-1);
  flex-direction: column;
  display: flex;
}

.df-split__range {
  align-items: baseline;
  gap: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-split__range-label {
  font-variant-numeric: tabular-nums;
  font-weight: var(--df-weight-medium);
}

.df-split__consequences {
  gap: var(--df-space-2);
  flex-direction: column;
  display: flex;
}

.df-callout {
  padding: var(--df-space-3) var(--df-space-4);
  font-size: var(--df-text-sm);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  background: var(--df-surface);
  border-left-width: 3px;
  margin: 0;
}

.df-callout--info, .df-callout--accent {
  color: var(--df-info);
  background: var(--df-info-soft);
  border-color: var(--df-info-line);
}

.df-callout--success {
  color: var(--df-success);
  background: var(--df-success-soft);
  border-color: var(--df-success-line);
}

.df-callout--warning {
  color: var(--df-warning);
  background: var(--df-warning-soft);
  border-color: var(--df-warning-line);
}

.df-callout--danger {
  color: var(--df-danger);
  background: var(--df-danger-soft);
  border-color: var(--df-danger-line);
}

.df-callout--neutral {
  color: var(--df-text-muted);
  background: var(--df-neutral-soft);
  border-color: var(--df-neutral-line);
}

.df-findings > summary {
  cursor: pointer;
  font-weight: var(--df-weight-medium);
}

.df-list {
  margin: var(--df-space-2) 0 0;
  padding-left: var(--df-space-4);
  gap: var(--df-space-1);
  flex-direction: column;
  display: flex;
}

.df-list > li {
  color: inherit;
}

.df-findings__list {
  margin: var(--df-space-3) 0 0;
  gap: var(--df-space-2);
  flex-direction: column;
  padding: 0;
  list-style: none;
  display: flex;
}

.df-findings__item {
  align-items: baseline;
  gap: var(--df-space-2);
  color: var(--df-text);
  flex-wrap: wrap;
  display: flex;
}

.df-kv {
  gap: var(--df-space-2);
  margin: 0;
  display: grid;
  container-type: inline-size;
}

.df-kv__row {
  gap: var(--df-space-3);
  grid-template-columns: minmax(8rem, 14rem) minmax(min-content, 1fr);
  align-items: baseline;
  display: grid;
}

.df-kv__key {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
}

.df-kv__value {
  overflow-wrap: anywhere;
  min-width: 0;
  margin: 0;
}

@container (width <= 26rem) {
  .df-kv__row {
    gap: var(--df-space-1);
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
}

.df-stage-strip {
  gap: var(--df-space-4);
  margin: var(--df-space-4) 0 0;
  counter-reset: df-stage;
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
  display: flex;
}

.df-stage {
  padding-left: var(--df-space-4);
  font-size: var(--df-text-xs);
  flex-direction: column;
  gap: 2px;
  display: flex;
  position: relative;
}

.df-stage__dot {
  border-radius: var(--df-radius-pill);
  background: var(--df-border-strong);
  width: 8px;
  height: 8px;
  position: absolute;
  top: .35em;
  left: 0;
}

.df-stage.is-done .df-stage__dot {
  background: var(--df-success);
}

.df-stage.is-current .df-stage__dot {
  background: var(--df-accent);
  box-shadow: 0 0 0 3px var(--df-accent-soft);
}

.df-stage.is-blocked .df-stage__dot {
  background: var(--df-danger);
}

.df-stage__label {
  font-weight: var(--df-weight-medium);
}

.df-stage.is-pending .df-stage__label {
  color: var(--df-text-subtle);
}

.df-stage__detail {
  color: var(--df-text-muted);
}

.df-overview__next {
  font-size: var(--df-text-md);
  margin: 0;
}

.df-timeline {
  padding: 0 0 0 var(--df-space-4);
  border-left: 1px solid var(--df-border);
  margin: 0;
  list-style: none;
}

.df-timeline__item {
  padding: 0 0 var(--df-space-4) var(--df-space-4);
  position: relative;
}

.df-timeline__item:before {
  content: "";
  left: calc(var(--df-space-4) * -1 - 4px);
  border-radius: var(--df-radius-pill);
  background: var(--df-border-strong);
  width: 7px;
  height: 7px;
  position: absolute;
  top: .45em;
}

.df-timeline__item.is-current:before {
  background: var(--df-accent);
}

.df-timeline__head {
  align-items: center;
  gap: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-timeline__arrow {
  color: var(--df-text-subtle);
}

.df-timeline__meta {
  margin: var(--df-space-1) 0 0;
}

.df-timeline__reason {
  margin: var(--df-space-1) 0 0;
  font-size: var(--df-text-sm);
}

.df-thread, .df-attempts, .df-revisions, .df-diffs, .df-mapping-list, .df-row-changes {
  margin: 0;
  padding: 0;
  list-style: none;
}

.df-thread__item, .df-attempts__item {
  padding: var(--df-space-3) var(--df-space-4);
  border-bottom: 1px solid var(--df-border);
}

.df-thread__item:last-child, .df-attempts__item:last-child {
  border-bottom: 0;
}

.df-thread__meta {
  margin: 0 0 var(--df-space-1);
}

.df-attempts__error {
  margin: var(--df-space-1) 0 0;
  font-size: var(--df-text-xs);
  color: var(--df-danger);
  overflow-wrap: anywhere;
}

.df-event__action {
  font-weight: var(--df-weight-medium);
}

.df-event__reason {
  display: block;
}

.df-event__mappings > summary {
  cursor: pointer;
  color: var(--df-accent-text);
}

.df-mapping {
  align-items: baseline;
  gap: var(--df-space-2);
  padding: var(--df-space-1) 0;
  font-size: var(--df-text-xs);
  flex-wrap: wrap;
  display: flex;
}

.df-mapping__value {
  font-variant-numeric: tabular-nums;
}

.df-mapping__replaced {
  color: var(--df-text-subtle);
}

.df-split--history {
  grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
}

@media (width <= 1023px) {
  .df-split--history {
    grid-template-columns: minmax(0, 1fr);
  }
}

.df-revision__link {
  gap: var(--df-space-1);
  padding: var(--df-space-3) var(--df-space-4);
  border-bottom: 1px solid var(--df-border);
  color: inherit;
  text-decoration: none;
  display: grid;
}

.df-revision__link:hover {
  background: var(--df-surface-2);
}

.df-revision.is-open .df-revision__link {
  background: var(--df-accent-soft);
  box-shadow: inset 3px 0 0 var(--df-accent);
}

.df-revision__summary {
  font-size: var(--df-text-sm);
}

.df-diff {
  gap: var(--df-space-3);
  padding: var(--df-space-3) 0;
  border-bottom: 1px solid var(--df-border);
  grid-template-columns: auto minmax(0, 1fr);
  display: grid;
}

.df-diff:last-child {
  border-bottom: 0;
}

.df-diff__pick {
  padding-top: .15em;
}

.df-diff__label {
  align-items: center;
  gap: var(--df-space-2);
  margin: 0 0 var(--df-space-1);
  font-weight: var(--df-weight-medium);
  flex-wrap: wrap;
  display: flex;
}

.df-diff__values {
  align-items: baseline;
  gap: var(--df-space-2);
  font-size: var(--df-text-sm);
  flex-wrap: wrap;
  margin: 0;
  display: flex;
}

.df-diff__after {
  color: var(--df-text-subtle);
}

.df-diff__before {
  color: var(--df-text);
  font-weight: var(--df-weight-medium);
}

.df-diff__rows > summary {
  cursor: pointer;
  color: var(--df-accent-text);
}

.df-row-change {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-1) 0;
  font-size: var(--df-text-xs);
  display: flex;
}

.df-decide, .df-force {
  position: relative;
}

.df-decide > summary {
  cursor: pointer;
  list-style: none;
}

.df-decide > summary::-webkit-details-marker {
  display: none;
}

.df-decide__panel {
  z-index: var(--df-z-dropdown);
  width: min(26rem, 90vw);
  margin-top: var(--df-space-2);
  padding: var(--df-space-4);
  background: var(--df-overlay);
  border: 1px solid var(--df-border-strong);
  border-radius: var(--df-radius-lg);
  box-shadow: var(--df-shadow-menu);
  position: absolute;
  right: 0;
}

.df-decide[open] > .df-decide__panel {
  z-index: var(--df-z-dialog);
  width: min(26rem, calc(100vw - 2 * var(--df-space-4)));
  height: max-content;
  max-height: calc(100vh - 2 * var(--df-space-6));
  overscroll-behavior: contain;
  box-shadow: var(--df-shadow-dialog);
  margin: auto;
  position: fixed;
  inset: 0;
  overflow-y: auto;
}

.df-force > summary {
  cursor: pointer;
  color: var(--df-accent-text);
  font-size: var(--df-text-xs);
}

.df-code {
  padding: var(--df-space-3);
  font-family: var(--df-font-mono);
  font-size: var(--df-text-xs);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: var(--df-surface-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  margin: 0;
  line-height: 1.6;
  overflow: auto;
}

.df-code--tall {
  max-height: 28rem;
}

.df-tab-loading {
  padding: var(--df-space-6);
  justify-content: center;
  display: flex;
}

.df-viewer--placeholder, .df-grid-placeholder {
  gap: var(--df-space-2);
  padding: var(--df-space-6) var(--df-space-4);
  place-items: center;
  min-height: 16rem;
  display: grid;
}

.df-viewer__placeholder-id {
  font-family: var(--df-font-mono);
  margin: 0;
}

.df-brand-mark {
  width: 1.75rem;
  height: 1.75rem;
  color: var(--df-accent-fg);
  background: var(--df-accent);
  border-radius: var(--df-radius);
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.df-public__brand {
  align-items: center;
  gap: var(--df-space-2);
  color: var(--df-text);
  font-weight: var(--df-weight-semibold);
  font-size: var(--df-text-md);
  text-decoration: none;
  display: inline-flex;
}

.df-public__brand:hover {
  color: var(--df-accent-text);
}

.df-public__wordmark {
  letter-spacing: -.01em;
}

.df-public__panel {
  max-width: 24rem;
}

.df-public__heading {
  font-size: var(--df-text-xl);
  font-weight: var(--df-weight-semibold);
  letter-spacing: -.01em;
  margin: 0;
}

.df-public__sub {
  margin: var(--df-space-1) 0 var(--df-space-4);
  color: var(--df-text-muted);
  line-height: var(--df-leading);
}

.df-public__panel .df-notice {
  margin-bottom: var(--df-space-4);
}

.df-public__aside {
  margin: var(--df-space-4) 0 0;
  font-size: var(--df-text-sm);
}

.df-public__note {
  margin: var(--df-space-3) 0 0;
  padding-top: var(--df-space-3);
  border-top: 1px solid var(--df-border);
  color: var(--df-text-subtle);
  font-size: var(--df-text-xs);
  line-height: var(--df-leading);
}

.df-public__foot {
  color: var(--df-text-subtle);
  font-size: var(--df-text-xs);
  margin: 0;
}

.df-public__foot-sep {
  margin: 0 var(--df-space-2);
}

.df-notice {
  gap: var(--df-space-2);
  padding: var(--df-space-3);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  background: var(--df-surface-2);
  color: var(--df-text);
  text-align: left;
  align-items: flex-start;
  display: flex;
}

.df-notice__icon {
  flex: none;
  margin-top: .1rem;
}

.df-notice__body {
  min-width: 0;
}

.df-notice__title {
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-semibold);
  line-height: var(--df-leading-tight);
  margin: 0;
}

.df-notice__detail {
  margin: var(--df-space-1) 0 0;
  color: var(--df-text-muted);
  font-size: var(--df-text-xs);
  line-height: var(--df-leading);
}

.df-notice--success {
  background: var(--df-success-soft);
  border-color: var(--df-success-line);
}

.df-notice--success .df-notice__icon {
  color: var(--df-success);
}

.df-notice--warning {
  background: var(--df-warning-soft);
  border-color: var(--df-warning-line);
}

.df-notice--warning .df-notice__icon {
  color: var(--df-warning);
}

.df-notice--danger {
  background: var(--df-danger-soft);
  border-color: var(--df-danger-line);
}

.df-notice--danger .df-notice__icon {
  color: var(--df-danger);
}

.df-notice--info, .df-notice--accent {
  background: var(--df-info-soft);
  border-color: var(--df-info-line);
}

.df-notice--info .df-notice__icon, .df-notice--accent .df-notice__icon {
  color: var(--df-info);
}

.df-notice--neutral .df-notice__icon {
  color: var(--df-neutral);
}

.df-signout form {
  display: contents;
}

.df-landing {
  background: var(--df-bg);
  min-height: 100vh;
}

.df-landing__bar {
  z-index: var(--df-z-sticky);
  border-bottom: 1px solid var(--df-border);
  background: var(--df-surface);
  position: sticky;
  top: 0;
}

.df-landing__bar-inner {
  align-items: center;
  gap: var(--df-space-5);
  max-width: 68rem;
  padding: var(--df-space-3) var(--df-space-5);
  margin: 0 auto;
  display: flex;
}

.df-landing__brand {
  align-items: center;
  gap: var(--df-space-2);
  color: var(--df-text);
  font-weight: var(--df-weight-semibold);
  text-decoration: none;
  display: inline-flex;
}

.df-landing__wordmark {
  letter-spacing: -.01em;
}

.df-landing__nav {
  gap: var(--df-space-4);
  font-size: var(--df-text-sm);
  margin-right: auto;
  display: flex;
}

.df-landing__nav a {
  color: var(--df-text-muted);
  text-decoration: none;
}

.df-landing__nav a:hover {
  color: var(--df-text);
}

@media (width <= 599px) {
  .df-landing__nav {
    display: none;
  }

  .df-landing__brand {
    margin-right: auto;
  }
}

.df-landing__main {
  display: block;
}

.df-landing__section {
  max-width: 68rem;
  padding: var(--df-space-7) var(--df-space-5);
  margin: 0 auto;
}

.df-landing__section--hero {
  text-align: center;
  padding-top: var(--df-space-8);
}

.df-landing__eyebrow {
  align-items: center;
  gap: var(--df-space-2);
  margin: 0 0 var(--df-space-4);
  padding: var(--df-space-1) var(--df-space-3);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-pill);
  background: var(--df-surface);
  color: var(--df-text-muted);
  font-size: var(--df-text-xs);
  font-weight: var(--df-weight-medium);
  display: inline-flex;
}

.df-landing__eyebrow .df-icon {
  color: var(--df-accent);
}

.df-landing__headline {
  max-width: 34ch;
  font-size: clamp(1.75rem, 1.1rem + 2.6vw, 2.75rem);
  font-weight: var(--df-weight-semibold);
  line-height: var(--df-leading-tight);
  letter-spacing: -.02em;
  margin: 0 auto;
}

.df-landing__lede {
  max-width: 62ch;
  margin: var(--df-space-4) auto 0;
  color: var(--df-text-muted);
  font-size: var(--df-text-md);
  line-height: var(--df-leading);
}

.df-landing__actions {
  gap: var(--df-space-3);
  margin-top: var(--df-space-5);
  flex-wrap: wrap;
  justify-content: center;
  display: flex;
}

.df-landing__heading {
  font-size: var(--df-text-2xl);
  font-weight: var(--df-weight-semibold);
  letter-spacing: -.01em;
  margin: 0;
}

.df-landing__blurb {
  max-width: 62ch;
  margin: var(--df-space-2) 0 0;
  color: var(--df-text-muted);
  line-height: var(--df-leading);
}

.df-landing__preview {
  max-width: 44rem;
  margin: var(--df-space-7) auto 0;
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-lg);
  background: var(--df-surface);
  text-align: left;
  overflow: hidden;
}

.df-landing__preview-bar {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-3);
  padding: var(--df-space-2) var(--df-space-3);
  border-bottom: 1px solid var(--df-border);
  background: var(--df-surface-2);
  display: flex;
}

.df-landing__preview-name {
  align-items: center;
  gap: var(--df-space-2);
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-medium);
  display: inline-flex;
}

.df-landing__preview-name .df-icon {
  color: var(--df-text-muted);
}

.df-landing__preview-body {
  gap: var(--df-space-5);
  padding: var(--df-space-4);
  grid-template-columns: 1fr;
  display: grid;
}

@media (width >= 640px) {
  .df-landing__preview-body {
    grid-template-columns: 1fr 1fr;
  }
}

.df-landing__fields {
  gap: var(--df-space-3);
  margin: 0;
  display: grid;
}

.df-landing__field-label {
  color: var(--df-text-subtle);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-medium);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.df-landing__field-value {
  margin: var(--df-space-1) 0 0;
  font-size: var(--df-text-base);
  font-weight: var(--df-weight-medium);
}

.df-landing__checks {
  gap: var(--df-space-2);
  align-content: start;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.df-landing__check {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-3);
  display: flex;
}

.df-landing__check-label {
  color: var(--df-text-muted);
  font-size: var(--df-text-sm);
}

.df-landing__features {
  gap: var(--df-space-3);
  margin: var(--df-space-5) 0 0;
  grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
  padding: 0;
  list-style: none;
  display: grid;
}

.df-landing__feature {
  padding: var(--df-space-4);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-lg);
  background: var(--df-surface);
}

.df-landing__feature-icon {
  width: 2.25rem;
  height: 2.25rem;
  color: var(--df-accent-text);
  background: var(--df-accent-soft);
  border-radius: var(--df-radius);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.df-landing__feature-title {
  margin: var(--df-space-3) 0 0;
  font-size: var(--df-text-base);
  font-weight: var(--df-weight-semibold);
}

.df-landing__feature-body {
  margin: var(--df-space-2) 0 0;
  color: var(--df-text-muted);
  line-height: var(--df-leading);
}

.df-landing__steps {
  gap: var(--df-space-3);
  margin: var(--df-space-5) 0 0;
  counter-reset: none;
  grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
  padding: 0;
  list-style: none;
  display: grid;
}

.df-landing__step {
  padding: var(--df-space-4);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-lg);
  background: var(--df-surface);
}

.df-landing__step-num {
  color: var(--df-text-subtle);
  font-size: var(--df-text-xs);
}

.df-landing__step-title {
  margin: var(--df-space-2) 0 0;
  font-size: var(--df-text-base);
  font-weight: var(--df-weight-semibold);
}

.df-landing__step-body {
  margin: var(--df-space-1) 0 0;
  color: var(--df-text-muted);
  line-height: var(--df-leading);
}

.df-landing__cta {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-4);
  padding: var(--df-space-6);
  border: 1px solid var(--df-accent-line);
  border-radius: var(--df-radius-lg);
  background: var(--df-accent-soft);
  flex-wrap: wrap;
  display: flex;
}

.df-landing__cta-copy {
  max-width: 46ch;
}

.df-landing__cta-title {
  font-size: var(--df-text-xl);
  font-weight: var(--df-weight-semibold);
  margin: 0;
}

.df-landing__cta-body {
  margin: var(--df-space-2) 0 0;
  color: var(--df-text-muted);
  line-height: var(--df-leading);
}

.df-landing__foot {
  border-top: 1px solid var(--df-border);
  background: var(--df-surface);
}

.df-landing__foot-inner {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-3);
  max-width: 68rem;
  padding: var(--df-space-5);
  color: var(--df-text-subtle);
  font-size: var(--df-text-xs);
  flex-wrap: wrap;
  margin: 0 auto;
  display: flex;
}

.df-landing__foot-inner a {
  color: var(--df-text-muted);
}

.df-prose {
  max-width: 44rem;
  padding: var(--df-space-6) var(--df-space-5) var(--df-space-8);
  line-height: var(--df-leading);
  margin: 0 auto;
}

.df-prose__title {
  margin: var(--df-space-4) 0 0;
  font-size: var(--df-text-2xl);
  font-weight: var(--df-weight-semibold);
  letter-spacing: -.01em;
}

.df-prose__meta {
  margin: var(--df-space-2) 0 0;
  color: var(--df-text-subtle);
  font-size: var(--df-text-xs);
}

.df-prose__section {
  margin-top: var(--df-space-6);
}

.df-prose__section h2 {
  margin: 0 0 var(--df-space-2);
  font-size: var(--df-text-lg);
  font-weight: var(--df-weight-semibold);
}

.df-prose__section p {
  margin: 0 0 var(--df-space-3);
  color: var(--df-text-muted);
}

.df-prose__section ul {
  padding-left: var(--df-space-5);
  color: var(--df-text-muted);
  margin: 0;
}

.df-prose__section li + li {
  margin-top: var(--df-space-2);
}

.df-prose__section p a, .df-prose__section li a {
  text-underline-offset: .15em;
  text-decoration: underline;
}

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

.df-shell.is-branded {
  --df-accent: var(--df-brand-light);
  --df-accent-fg: var(--df-brand-fg-light);
  --df-accent-hover: color-mix(in srgb, var(--df-accent) 86%, var(--df-text));
  --df-accent-active: color-mix(in srgb, var(--df-accent) 72%, var(--df-text));
  --df-accent-soft: color-mix(in srgb, var(--df-accent) 12%, var(--df-surface));
  --df-accent-line: color-mix(in srgb, var(--df-accent) 34%, var(--df-surface));
  --df-accent-text: var(--df-accent);
  --df-ring: var(--df-accent);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .df-shell.is-branded {
    --df-accent: var(--df-brand-dark);
    --df-accent-fg: var(--df-brand-fg-dark);
  }
}

:root[data-theme="dark"] .df-shell.is-branded {
  --df-accent: var(--df-brand-dark);
  --df-accent-fg: var(--df-brand-fg-dark);
}

.df-shell.is-sidebar-branded .df-shell__sidebar {
  background: var(--df-sidebar-bg);
  color: var(--df-sidebar-fg);
  border-right-color: color-mix(in srgb, var(--df-sidebar-fg) 16%, var(--df-sidebar-bg));
  --df-text: var(--df-sidebar-fg);
  --df-text-muted: color-mix(in srgb, var(--df-sidebar-fg) 76%, var(--df-sidebar-bg));
  --df-text-subtle: color-mix(in srgb, var(--df-sidebar-fg) 56%, var(--df-sidebar-bg));
  --df-surface-2: color-mix(in srgb, var(--df-sidebar-fg) 10%, var(--df-sidebar-bg));
  --df-surface-3: color-mix(in srgb, var(--df-sidebar-fg) 16%, var(--df-sidebar-bg));
  --df-border: color-mix(in srgb, var(--df-sidebar-fg) 18%, var(--df-sidebar-bg));
  --df-accent-soft: color-mix(in srgb, var(--df-accent) 26%, var(--df-sidebar-bg));
  --df-accent-text: var(--df-sidebar-fg);
}

.df-shell__brand {
  min-width: 0;
  color: var(--df-text);
  text-decoration: none;
}

.df-shell__brand:hover {
  text-decoration: none;
}

.df-shell__brand-mark {
  border-radius: var(--df-radius);
  background: var(--df-accent);
  width: 1.5rem;
  height: 1.5rem;
  color: var(--df-accent-fg);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  letter-spacing: .02em;
  flex: none;
  place-items: center;
  display: grid;
}

.df-shell__brand-logo {
  object-fit: contain;
  flex: none;
  width: auto;
  max-width: 9rem;
  height: 1.5rem;
}

.df-shell__brand-text {
  min-width: 0;
  font-size: var(--df-text-md);
}

.df-nav__icon {
  color: var(--df-text-subtle);
  flex: none;
}

.df-nav__link.is-active .df-nav__icon {
  color: currentColor;
}

.df-nav__label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.df-shell__sidebar-foot {
  border-top: 1px solid var(--df-border);
  padding-top: var(--df-space-2);
  margin-top: var(--df-space-2);
  border-radius: 0;
}

.df-shell.is-rail {
  --df-sidebar-width: 3.25rem;
}

.df-shell__sidebar {
  overflow-x: hidden;
}

.df-shell.is-rail .df-nav__label, .df-shell.is-rail .df-nav__heading, .df-shell.is-rail .df-shell__brand-text {
  display: none;
}

.df-shell.is-rail .df-nav__link, .df-shell.is-rail .df-shell__brand {
  justify-content: center;
  padding-inline: 0;
}

.df-shell.is-rail .df-nav__group {
  padding-top: var(--df-space-2);
  gap: .125rem;
}

.df-shell.is-rail .df-nav__group + .df-nav__group {
  border-top: 1px solid var(--df-border);
}

.df-shell__scrim {
  display: none;
}

@media (width <= 1023px) {
  .df-shell__scrim {
    z-index: calc(var(--df-z-sidebar) - 1);
    background: rgba(9, 16, 24, .45);
    display: block;
    position: fixed;
    inset: 0;
  }
}

.df-shell__icon-btn {
  border-radius: var(--df-radius);
  width: 1.875rem;
  height: 1.875rem;
  color: var(--df-text-muted);
  cursor: pointer;
  background: none;
  border: 1px solid rgba(0, 0, 0, 0);
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
  position: relative;
}

.df-shell__icon-btn:hover {
  background: var(--df-surface-2);
  color: var(--df-text);
}

.df-shell__account {
  width: auto;
  height: auto;
  padding: .125rem;
}

.df-shell__rail-btn {
  display: none;
}

@media (width >= 1024px) {
  .df-shell__drawer-btn {
    display: none;
  }

  .df-shell__rail-btn {
    display: inline-flex;
  }
}

.df-shell__tenant {
  align-items: center;
  gap: var(--df-space-2);
  min-width: 0;
  display: flex;
}

.df-shell__tenant-name {
  max-width: 18rem;
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-medium);
  color: var(--df-text);
}

.df-shell__search {
  align-items: center;
  gap: var(--df-space-2);
  height: 1.875rem;
  padding: 0 var(--df-space-2);
  background: var(--df-surface-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  color: var(--df-text-subtle);
  font-size: var(--df-text-sm);
  cursor: pointer;
  display: inline-flex;
}

.df-shell__search:hover {
  border-color: var(--df-border-strong);
  color: var(--df-text-muted);
}

.df-shell__search-label {
  text-align: left;
  min-width: 5rem;
}

@media (width <= 767px) {
  .df-shell__search-label, .df-shell__search .df-kbd {
    display: none;
  }

  .df-shell__search {
    justify-content: center;
    width: 1.875rem;
    padding: 0;
  }
}

.df-kbd {
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-sm);
  font-family: var(--df-font);
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
  padding: .0625rem .3125rem;
  line-height: 1.4;
  display: inline-block;
}

.df-bell__count {
  border-radius: var(--df-radius-pill);
  background: var(--df-danger);
  min-width: 1rem;
  color: var(--df-text-inverse);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  font-variant-numeric: tabular-nums;
  text-align: center;
  padding: 0 .1875rem;
  line-height: 1rem;
  position: absolute;
  top: -.125rem;
  right: -.125rem;
}

.df-notif {
  width: 22rem;
  max-width: calc(100vw - 2 * var(--df-space-4));
  padding: 0;
}

.df-notif__head {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-2) var(--df-space-3);
  border-bottom: 1px solid var(--df-border);
  display: flex;
}

.df-notif__heading {
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-semibold);
}

.df-notif__list {
  max-height: min(24rem, 50vh);
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
}

.df-notif__bucket {
  z-index: 1;
  padding: var(--df-space-1) var(--df-space-3);
  background: var(--df-surface-2);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--df-text-subtle);
  position: sticky;
  top: 0;
}

.df-notif__item {
  border-bottom: 1px solid var(--df-border);
  align-items: flex-start;
  display: flex;
}

.df-notif__item:last-child {
  border-bottom: 0;
}

.df-notif__item:hover {
  background: var(--df-surface-2);
}

.df-notif__item.is-unread {
  box-shadow: inset 2px 0 0 0 var(--df-accent);
}

.df-notif__item.is-unread .df-notif__title {
  font-weight: var(--df-weight-semibold);
}

.df-notif__link {
  align-items: flex-start;
  gap: var(--df-space-2);
  min-width: 0;
  padding: var(--df-space-2) var(--df-space-3);
  color: var(--df-text);
  flex: 1;
  text-decoration: none;
  display: flex;
}

.df-notif__link:hover {
  text-decoration: none;
}

.df-notif__icon {
  flex: none;
  margin-top: .125rem;
}

.df-notif__body {
  flex-direction: column;
  gap: .0625rem;
  min-width: 0;
  display: flex;
}

.df-notif__title {
  font-size: var(--df-text-sm);
  line-height: var(--df-leading-tight);
}

.df-notif__message {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
}

.df-notif__meta {
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
}

.df-notif__dismiss {
  padding: var(--df-space-2);
  color: var(--df-text-subtle);
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
}

.df-notif__dismiss:hover {
  color: var(--df-text);
}

.df-notif__empty {
  padding: var(--df-space-5) var(--df-space-3);
  font-size: var(--df-text-sm);
  color: var(--df-text-subtle);
  text-align: center;
}

.df-notif__foot {
  padding: var(--df-space-2);
  border-top: 1px solid var(--df-border);
}

.df-menu-user {
  padding: var(--df-space-2);
  margin-bottom: var(--df-space-1);
  border-bottom: 1px solid var(--df-border);
}

.df-menu-user__name {
  font-size: var(--df-text-sm);
  font-weight: var(--df-weight-semibold);
}

.df-menu-user__email {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
}

.df-menu-user__role {
  font-size: var(--df-text-2xs);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--df-text-subtle);
  margin-top: .125rem;
}

.df-dropdown__menu form {
  display: contents;
}

.df-palette-layer {
  place-items: start center;
  padding-top: 12vh;
}

.df-palette {
  max-width: 34rem;
  max-height: min(28rem, 70vh);
  overflow: hidden;
}

.df-palette__search {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-3);
  border-bottom: 1px solid var(--df-border);
  color: var(--df-text-subtle);
  display: flex;
}

.df-palette__input {
  min-width: 0;
  color: var(--df-text);
  font-family: inherit;
  font-size: var(--df-text-md);
  background: none;
  border: 0;
  flex: 1;
  padding: 0;
}

.df-palette__input:focus {
  outline: none;
}

.df-palette__list {
  padding: var(--df-space-1);
  flex: 1;
  margin: 0;
  list-style: none;
  overflow-y: auto;
}

.df-palette__group {
  padding: var(--df-space-2) var(--df-space-2) var(--df-space-1);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--df-text-subtle);
}

.df-palette__item {
  align-items: center;
  gap: var(--df-space-2);
  padding: .375rem var(--df-space-2);
  border-radius: var(--df-radius);
  font-size: var(--df-text-sm);
  color: var(--df-text);
  cursor: pointer;
  display: flex;
}

.df-palette__item.is-active {
  background: var(--df-accent-soft);
  color: var(--df-accent-text);
}

.df-palette__label {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.df-palette__where {
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
  flex: none;
}

.df-palette__go {
  opacity: 0;
  flex: none;
}

.df-palette__item.is-active .df-palette__go {
  opacity: 1;
}

.df-palette__empty {
  padding: var(--df-space-5) var(--df-space-2);
  font-size: var(--df-text-sm);
  color: var(--df-text-subtle);
  text-align: center;
}

.df-palette__hint {
  align-items: center;
  gap: var(--df-space-1);
  padding: var(--df-space-2) var(--df-space-3);
  border-top: 1px solid var(--df-border);
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
  display: flex;
}

.df-dropzone__icon {
  color: var(--df-text-subtle);
}

.df-dropzone.is-over .df-dropzone__icon {
  color: var(--df-accent);
}

.df-dropzone__title {
  font-size: var(--df-text-md);
  font-weight: var(--df-weight-semibold);
  color: var(--df-text);
  margin: 0;
}

.df-dropzone__hint {
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
  margin: 0;
}

.df-queue {
  margin: 0;
  padding: 0;
  list-style: none;
}

.df-queue__row {
  align-items: flex-start;
  gap: var(--df-space-3);
  padding: var(--df-space-3) var(--df-space-4);
  border-top: 1px solid var(--df-border);
  display: flex;
}

.df-queue__row:first-child {
  border-top: 0;
}

.df-queue__row.is-uploading {
  background: var(--df-accent-soft);
}

.df-queue__icon {
  color: var(--df-text-subtle);
  flex: none;
  margin-top: .125rem;
}

.df-queue__main {
  gap: var(--df-space-1);
  flex-direction: column;
  flex: auto;
  min-width: 0;
  display: flex;
}

.df-queue__name {
  font-weight: var(--df-weight-medium);
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  overflow: hidden;
}

.df-queue__meta {
  font-size: var(--df-text-xs);
  color: var(--df-text-subtle);
  font-variant-numeric: tabular-nums;
  margin: 0;
}

.df-queue__detail {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  margin: 0;
}

.df-queue__bar {
  margin-top: var(--df-space-1);
}

.df-queue__state {
  flex: none;
  margin-top: .125rem;
}

.df-queue__actions {
  align-items: center;
  gap: var(--df-space-1);
  flex: none;
  display: flex;
}

.df-import-note {
  align-items: flex-start;
  gap: var(--df-space-2);
  margin: var(--df-space-3) 0 0;
  padding: var(--df-space-2) var(--df-space-3);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  background: var(--df-surface-2);
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
  display: flex;
}

.df-import-note .df-icon {
  color: var(--df-text-subtle);
  flex: none;
  margin-top: .125rem;
}

.df-import-summary {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-3) var(--df-space-4);
  border: 1px solid var(--df-success-line);
  border-radius: var(--df-radius);
  background: var(--df-success-soft);
  font-size: var(--df-text-sm);
  color: var(--df-text);
  display: flex;
}

.df-import-summary .df-icon {
  color: var(--df-success);
  flex: none;
}

@media (width <= 599px) {
  .df-queue__row {
    flex-wrap: wrap;
  }

  .df-queue__main {
    flex-basis: 100%;
  }

  .df-queue__actions {
    margin-left: auto;
  }
}

.df-lgrid {
  --df-lgrid-rule: color-mix(in srgb, var(--df-border) 60%, var(--df-surface));
  gap: var(--df-space-2);
  flex-direction: column;
  display: flex;
}

.df-lgrid__loading {
  padding: var(--df-space-6);
  justify-content: center;
  display: flex;
}

.df-lgrid__locked {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-2) var(--df-space-3);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  background: var(--df-surface-2);
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  margin: 0;
  display: flex;
}

.df-doc__lines {
  min-width: 0;
  padding: var(--df-space-2) var(--df-space-3);
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
}

.df-lgrid__toolbar {
  --df-lgrid-control: 1.75rem;
  align-items: center;
  gap: var(--df-space-1);
  flex-wrap: nowrap;
  min-width: 0;
  min-height: 2rem;
  display: flex;
  overflow: clip visible;
}

.df-lgrid__toolbar > * {
  flex: none;
}

.df-lgrid__toolbar .df-btn, .df-lgrid__toolbar .df-input {
  height: var(--df-lgrid-control);
  align-self: center;
}

.df-lgrid__toolbar .df-spacer {
  flex: 1 1 0;
  min-width: 0;
}

.df-lgrid__count {
  white-space: nowrap;
  font-size: var(--df-text-2xs);
  color: var(--df-text-muted);
  font-variant-numeric: tabular-nums;
  flex: none;
}

.df-lgrid__count-unsaved {
  color: var(--df-warning);
  font-weight: var(--df-weight-medium);
}

.df-lgrid__problems {
  align-items: center;
  gap: var(--df-space-1);
  height: var(--df-lgrid-control);
  padding: 0 var(--df-space-2);
  border: 1px solid var(--df-danger-line);
  border-radius: var(--df-radius-pill);
  background: var(--df-danger-soft);
  color: var(--df-danger);
  font: inherit;
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-medium);
  white-space: nowrap;
  cursor: pointer;
  flex: none;
  display: inline-flex;
  overflow: hidden;
}

.df-lgrid__problems:hover {
  border-color: var(--df-danger);
}

.df-lgrid__problems.is-active {
  background: var(--df-danger);
  border-color: var(--df-danger);
  color: var(--df-text-inverse);
}

.df-lgrid__problems--none {
  color: var(--df-text-subtle);
  font-weight: var(--df-weight-normal);
  cursor: default;
  background: none;
  border-color: rgba(0, 0, 0, 0);
}

.df-lgrid__nav {
  align-items: center;
  gap: 0;
  display: inline-flex;
}

.df-lgrid__nav-btn {
  width: var(--df-lgrid-control);
  min-width: var(--df-lgrid-control);
  justify-content: center;
  padding: 0;
}

.df-lgrid__nav-btn .df-btn__label:empty {
  display: none;
}

.df-lgrid__filter {
  width: 11rem;
  min-width: 4rem;
  font-size: var(--df-text-xs);
  flex: 0 11rem;
  padding-block: 0;
}

.df-lgrid__columns {
  gap: var(--df-space-1);
  max-height: 20rem;
  padding: var(--df-space-1);
  flex-direction: column;
  display: flex;
  overflow-y: auto;
}

.df-lgrid__columns-title {
  margin: 0 0 var(--df-space-1);
  padding: 0 var(--df-space-2);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--df-text-subtle);
}

.df-lgrid__column {
  padding: var(--df-space-1) var(--df-space-2);
  border-radius: var(--df-radius-sm);
  white-space: nowrap;
}

.df-lgrid__column:hover {
  background: var(--df-surface-2);
}

.df-lgrid__undeclared {
  margin-left: var(--df-space-2);
  font-size: var(--df-text-2xs);
  color: var(--df-warning);
}

.df-lgrid__clear {
  font-size: var(--df-text-2xs);
  color: var(--df-success);
}

.df-lgrid__expand {
  width: var(--df-lgrid-control);
  min-width: var(--df-lgrid-control);
  justify-content: center;
  padding: 0;
}

.df-lgrid__expand .df-btn__label:empty {
  display: none;
}

.df-lgrid__expand[aria-pressed="true"] {
  background: var(--df-accent-soft);
  color: var(--df-accent-text);
}

.df-lgrid__recon, .df-lgrid__gap {
  align-items: center;
  gap: var(--df-space-1);
  min-width: 2rem;
  height: var(--df-lgrid-control);
  padding: 0 var(--df-space-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-pill);
  background: var(--df-surface-2);
  font-size: var(--df-text-2xs);
  white-space: nowrap;
  flex: 0 999 auto;
  display: inline-flex;
  overflow: hidden;
}

.df-lgrid__recon > span, .df-lgrid__gap > span {
  text-overflow: ellipsis;
  overflow: hidden;
}

.df-lgrid__recon--success {
  border-color: var(--df-success-line);
  background: var(--df-success-soft);
  color: var(--df-success);
}

.df-lgrid__recon--warning, .df-lgrid__gap {
  border-color: var(--df-warning-line);
  background: var(--df-warning-soft);
  color: var(--df-warning);
}

.df-lgrid__recon--quiet {
  color: var(--df-text-muted);
}

.df-lgrid__note {
  align-items: center;
  gap: var(--df-space-2);
  margin: 0;
  display: flex;
}

.df-lgrid__scroll {
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  background: var(--df-surface);
  overscroll-behavior: contain;
  max-height: 65vh;
  overflow: auto;
}

.df-lgrid__table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  font-size: var(--df-text-xs);
}

.df-lgrid__table [hidden] {
  display: none !important;
}

.df-lgrid__spacer {
  background: none;
  border: 0;
  padding: 0;
}

.df-lgrid__head th {
  z-index: var(--df-z-sticky);
  background: var(--df-surface-2);
  border-bottom: 1px solid var(--df-border-strong);
  position: sticky;
  top: 0;
}

.df-lgrid__row td, .df-lgrid__head th, .df-lgrid__foot td {
  border-right: 1px solid var(--df-lgrid-rule);
}

.df-lgrid__row td:last-child, .df-lgrid__head th:last-child, .df-lgrid__foot td:last-child {
  border-right: 0;
}

.df-lgrid__row td.is-group-end, .df-lgrid__head th.is-group-end, .df-lgrid__foot td.is-group-end {
  border-right-color: var(--df-border-strong);
}

.df-lgrid__head th.df-lgrid__gutter, .df-lgrid__foot td.df-lgrid__gutter {
  z-index: calc(var(--df-z-sticky) + 1);
  left: 0;
}

.df-lgrid__row .df-lgrid__gutter {
  z-index: 1;
  position: sticky;
  left: 0;
}

.df-grid-cell--pin {
  z-index: 1;
  background: var(--df-surface);
  width: 4rem;
  min-width: 4rem;
  max-width: 4rem;
  position: sticky;
  left: 3rem;
}

.df-lgrid__head th.df-grid-cell--pin, .df-lgrid__foot td.df-grid-cell--pin {
  z-index: calc(var(--df-z-sticky) + 1);
  background: var(--df-surface-2);
}

.df-lgrid__th {
  padding: var(--df-space-1) var(--df-space-2);
  text-align: left;
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--df-text-muted);
  white-space: nowrap;
  position: relative;
}

.df-lgrid__th--numeric {
  text-align: right;
}

.df-lgrid__th-label {
  align-items: center;
  gap: var(--df-space-1);
  text-overflow: ellipsis;
  display: inline-flex;
  overflow: hidden;
}

.df-lgrid__th-mark {
  color: var(--df-info);
}

.df-lgrid__resizer {
  cursor: col-resize;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none;
  width: 5px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -2px;
}

.df-lgrid__resizer:after {
  content: "";
  background: var(--df-border-strong);
  opacity: 0;
  width: 1px;
  transition: opacity var(--df-duration) var(--df-ease);
  position: absolute;
  top: 15%;
  bottom: 15%;
  left: 2px;
}

.df-lgrid__th:hover .df-lgrid__resizer:after, .df-lgrid__resizer:hover:after {
  opacity: 1;
}

.df-lgrid__gutter {
  width: 3rem;
  padding: var(--df-space-1) var(--df-space-2);
  text-align: right;
  font-size: var(--df-text-2xs);
  font-variant-numeric: tabular-nums;
  color: var(--df-text-subtle);
  background: var(--df-surface-2);
  border-right: 1px solid var(--df-border);
  -webkit-user-select: none;
  user-select: none;
  white-space: nowrap;
}

.df-lgrid__row .df-lgrid__gutter {
  background: var(--df-surface);
}

.df-lgrid__row td {
  border-bottom: 1px solid var(--df-border);
}

.df-lgrid__row:hover .df-lgrid__gutter {
  background: var(--df-surface-2);
}

.df-lgrid__row.is-selected .df-lgrid__gutter {
  background: var(--df-accent-soft);
  color: var(--df-accent-text);
  font-weight: var(--df-weight-semibold);
}

.df-lgrid__row.is-selected td:first-child {
  box-shadow: inset 3px 0 0 var(--df-accent);
}

.df-lgrid__row.is-invalid .df-grid-cell__input {
  background: var(--df-danger-soft);
}

.df-lgrid__row[data-mark] .df-lgrid__gutter {
  font-weight: var(--df-weight-semibold);
}

.df-lgrid__row[data-mark]:not([data-mark="new"]) .df-lgrid__gutter:after {
  content: "!";
  margin-left: .125rem;
}

.df-lgrid__row[data-mark="invalid"] .df-lgrid__gutter, .df-lgrid__row[data-mark="error"] .df-lgrid__gutter {
  color: var(--df-danger);
}

.df-lgrid__row[data-mark="rule"] .df-lgrid__gutter, .df-lgrid__row[data-mark="warning"] .df-lgrid__gutter {
  color: var(--df-warning);
}

.df-lgrid__row[data-mark="low"] .df-lgrid__gutter {
  color: var(--df-text-muted);
  font-weight: var(--df-weight-normal);
}

.df-lgrid__row[data-mark="low"] .df-lgrid__gutter:after {
  content: "•";
}

.df-lgrid__row.is-new .df-lgrid__gutter:before {
  content: "+";
  color: var(--df-accent);
  font-weight: var(--df-weight-semibold);
  margin-right: .125rem;
}

.df-lgrid__row.is-gap-before td {
  background-image: repeating-linear-gradient(to right,
    var(--df-warning) 0 4px,
    transparent 4px 8px);
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100% 1px;
}

.df-lgrid__cell {
  vertical-align: middle;
  padding: 0;
  position: relative;
}

.df-grid-cell__pick {
  z-index: 1;
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-sm);
  background: var(--df-surface);
  width: 20px;
  height: 20px;
  color: var(--df-text-muted);
  cursor: pointer;
  justify-content: center;
  align-items: center;
  margin-top: -10px;
  padding: 0;
  display: inline-flex;
  position: absolute;
  top: 50%;
  right: 2px;
}

.df-grid-cell__pick:hover {
  color: var(--df-text);
  border-color: var(--df-border-strong);
}

.df-grid-cell__pick:focus-visible {
  color: var(--df-text);
  border-color: var(--df-border-strong);
}

.df-grid-cell__pick.is-armed {
  background: var(--df-accent);
  border-color: var(--df-accent);
  color: var(--df-accent-fg);
}

.df-grid-cell__pick:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.df-grid-cell--flag-low .df-grid-cell__input {
  box-shadow: inset 0 -2px 0 var(--df-warning-line);
}

.df-grid-cell--flag-warning .df-grid-cell__input {
  box-shadow: inset 0 -2px 0 var(--df-warning);
}

.df-grid-cell--flag-error .df-grid-cell__input {
  box-shadow: inset 0 -2px 0 var(--df-danger);
}

.df-lgrid__actions-head {
  width: 3.5rem;
}

.df-lgrid__actions {
  width: 3.5rem;
  padding: 0 var(--df-space-1);
  white-space: nowrap;
}

.df-lgrid__action {
  border-radius: var(--df-radius-sm);
  width: 1.375rem;
  height: 1.375rem;
  color: var(--df-text-subtle);
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.df-lgrid__action:hover {
  background: var(--df-surface-3);
  color: var(--df-text);
}

.df-lgrid__action--danger:hover {
  background: var(--df-danger-soft);
  color: var(--df-danger);
}

.df-lgrid__foot td {
  z-index: var(--df-z-sticky);
  padding: var(--df-space-1) var(--df-space-2);
  background: var(--df-surface-2);
  border-top: 1px solid var(--df-border-strong);
  font-weight: var(--df-weight-semibold);
  color: var(--df-text);
  white-space: nowrap;
  position: sticky;
  bottom: 0;
  overflow: hidden;
}

.df-lgrid__foot-cell--numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.df-lgrid__foot-label {
  max-width: calc(100% - 5rem);
  margin-right: var(--df-space-1);
  text-overflow: ellipsis;
  vertical-align: bottom;
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-normal);
  color: var(--df-text-muted);
  display: inline-block;
  overflow: hidden;
}

.df-lgrid__foot-value {
  vertical-align: bottom;
  font-variant-numeric: tabular-nums;
  display: inline-block;
}

.df-lgrid__empty {
  padding: var(--df-space-5) 0;
}

.df-lgrid__keys {
  position: relative;
}

.df-lgrid__keys > summary {
  cursor: pointer;
  list-style: none;
}

.df-lgrid__keys > summary::-webkit-details-marker {
  display: none;
}

.df-lgrid__keys-panel {
  z-index: var(--df-z-dropdown);
  width: min(38rem, calc(100vw - 2 * var(--df-space-4)));
  overscroll-behavior: contain;
  max-height: min(32rem, 70vh);
  padding: var(--df-space-3);
  background: var(--df-overlay);
  border: 1px solid var(--df-border-strong);
  border-radius: var(--df-radius-lg);
  box-shadow: var(--df-shadow-menu);
  font-size: var(--df-text-xs);
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  overflow-y: auto;
}

.df-lgrid__keys-list {
  gap: var(--df-space-1) var(--df-space-4);
  grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
  margin: 0;
  display: grid;
}

.df-lgrid__keys-list > div {
  gap: var(--df-space-2);
  display: flex;
}

.df-lgrid__keys-list dt {
  min-width: 9rem;
  font-family: var(--df-font-mono);
  color: var(--df-text);
  flex: none;
}

.df-lgrid__keys-list dd {
  color: var(--df-text-muted);
  margin: 0;
}

.df-lgrid__keys-title {
  margin: var(--df-space-3) 0 var(--df-space-1);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--df-text-subtle);
}

.df-lgrid__marks dt {
  min-width: 2rem;
}

.df-lgrid__mark {
  text-align: center;
  min-width: 1rem;
  font-family: var(--df-font);
  font-weight: var(--df-weight-semibold);
  display: inline-block;
}

.df-lgrid__mark--invalid, .df-lgrid__mark--flagged {
  color: var(--df-danger);
}

.df-lgrid__mark--rule {
  color: var(--df-warning);
}

.df-lgrid__mark--low {
  color: var(--df-text-muted);
  font-weight: var(--df-weight-normal);
}

.df-lgrid__mark--new {
  color: var(--df-accent);
}

.df-lgrid__mark--gap {
  color: var(--df-warning);
}

@media (width <= 767px) {
  .df-lgrid__toolbar {
    flex-wrap: wrap;
    overflow: visible;
  }

  .df-lgrid__filter {
    flex-basis: 100%;
    width: 100%;
  }

  .df-lgrid__scroll {
    max-height: 60vh;
  }
}

.df-viewer-pane {
  gap: var(--df-space-2);
  flex-direction: column;
  min-height: 0;
  display: flex;
}

.df-viewer__toolbar {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-1) var(--df-space-2);
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  flex-wrap: wrap;
  display: flex;
}

.df-viewer__toolbar-group {
  align-items: center;
  gap: var(--df-space-1);
  display: flex;
}

.df-viewer__toolbar .df-btn__label:empty {
  display: none;
}

.df-viewer__page-input {
  text-align: center;
  width: 3.5rem;
  padding-block: .125rem;
}

.df-viewer__zoom {
  font-variant-numeric: tabular-nums;
  min-width: 3.75rem;
}

.df-viewer {
  min-height: 0;
  padding: var(--df-space-3);
  cursor: default;
  overscroll-behavior: contain;
  touch-action: pan-x pan-y;
  flex: 1;
}

.df-viewer:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: -2px;
}

.df-viewer.is-panning {
  cursor: grabbing;
  -webkit-user-select: none;
  user-select: none;
}

.df-viewer.is-picking {
  cursor: crosshair;
}

.df-viewer__page {
  background: var(--df-surface);
  box-shadow: var(--df-shadow-menu);
  max-width: none;
}

.df-viewer__rotor {
  transform-origin: center;
  line-height: 0;
  position: absolute;
  top: 50%;
  left: 50%;
}

.df-viewer__rotor > .df-viewer__image {
  object-fit: fill;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  width: 100%;
  height: 100%;
  display: block;
}

.df-viewer__unrendered {
  justify-content: center;
  align-items: center;
  gap: var(--df-space-2);
  width: 100%;
  height: 100%;
  color: var(--df-text-subtle);
  font-size: var(--df-text-sm);
  flex-direction: column;
  line-height: 1.4;
  display: flex;
}

.df-viewer__box {
  font: inherit;
  color: inherit;
  appearance: none;
  box-sizing: border-box;
  padding: 0;
}

.df-viewer__box:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: 1px;
  z-index: 2;
}

.df-viewer__box--field {
  border-color: var(--df-accent);
  background: color-mix(in srgb, var(--df-accent) 12%, transparent);
}

.df-viewer__box--item {
  border-color: var(--df-cyan);
  background: color-mix(in srgb, var(--df-cyan) 12%, transparent);
}

.df-viewer__box--word {
  border: 1px solid color-mix(in srgb, var(--df-info) 45%, transparent);
  pointer-events: none;
  background: none;
  border-radius: 0;
}

.df-viewer__box--table {
  border-color: var(--df-indigo);
  background: color-mix(in srgb, var(--df-indigo) 10%, transparent);
}

.df-viewer__box--text {
  border-color: var(--df-blue);
  background: color-mix(in srgb, var(--df-blue) 8%, transparent);
}

.df-viewer__box--title {
  border-color: var(--df-success);
  background: color-mix(in srgb, var(--df-success) 10%, transparent);
}

.df-viewer__box--header {
  border-color: var(--df-warning);
  background: color-mix(in srgb, var(--df-warning) 10%, transparent);
}

.df-viewer__box--footer {
  border-color: var(--df-danger);
  background: color-mix(in srgb, var(--df-danger) 10%, transparent);
}

.df-viewer__box--list {
  border-color: var(--df-info);
  background: color-mix(in srgb, var(--df-info) 10%, transparent);
}

.df-viewer__box--image {
  border-color: var(--df-neutral);
  background: color-mix(in srgb, var(--df-neutral) 10%, transparent);
}

.df-viewer__box--equation {
  border-color: var(--df-cyan);
  background: color-mix(in srgb, var(--df-cyan) 10%, transparent);
}

.df-viewer__box.is-active {
  z-index: 3;
  border-width: 2px;
}

.df-viewer__box-label {
  max-width: 16rem;
  padding: 0 var(--df-space-1);
  background: var(--df-overlay);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-sm);
  color: var(--df-text-muted);
  font-size: var(--df-text-2xs);
  white-space: nowrap;
  text-overflow: ellipsis;
  pointer-events: none;
  margin-bottom: 2px;
  line-height: 1.5;
  position: absolute;
  bottom: 100%;
  left: 0;
  overflow: hidden;
}

.df-viewer__band {
  pointer-events: none;
  border-radius: 1px;
  position: absolute;
}

.df-viewer__band--read {
  border: 1px solid color-mix(in srgb, var(--df-success) 55%, transparent);
  background: color-mix(in srgb, var(--df-success) 12%, transparent);
}

.df-viewer__rownum {
  z-index: 3;
  min-width: 1.25rem;
  padding: 0 var(--df-space-1);
  background: var(--df-overlay);
  border: 1px solid var(--df-cyan);
  border-radius: var(--df-radius-sm);
  color: var(--df-text);
  font-size: var(--df-text-2xs);
  font-variant-numeric: tabular-nums;
  text-align: center;
  white-space: nowrap;
  pointer-events: auto;
  line-height: 1.4;
  position: absolute;
  transform: translateY(-50%);
}

.df-viewer__rownum.is-inside {
  pointer-events: none;
}

.df-viewer__rownum.is-shared {
  background: var(--df-warning-soft);
  border-color: var(--df-warning);
  color: var(--df-warning);
  transform: translateY(calc(.55rem - 50%));
}

.df-viewer__picklayer {
  z-index: 4;
  cursor: crosshair;
  touch-action: none;
  position: absolute;
  inset: 0;
}

.df-viewer__marquee {
  border: 1px dashed var(--df-accent);
  background: color-mix(in srgb, var(--df-accent) 14%, transparent);
  pointer-events: none;
  position: absolute;
}

.df-viewer__picked {
  border: 2px solid var(--df-success);
  background: color-mix(in srgb, var(--df-success) 20%, transparent);
  pointer-events: none;
  border-radius: 2px;
  position: absolute;
}

.df-pick {
  border-color: var(--df-border);
  flex: none;
  width: 2rem;
  min-width: 2rem;
  padding: 0;
}

.df-field-row__control .df-pick {
  align-self: start;
}

.df-pick:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.df-pick.is-armed {
  background: var(--df-accent);
  border-color: var(--df-accent);
  color: var(--df-accent-fg);
}

.df-viewer__status {
  align-items: center;
  gap: var(--df-space-2);
  flex-wrap: wrap;
  min-height: 1.5rem;
  display: flex;
}

.df-viewer__hint {
  align-items: center;
  gap: var(--df-space-1);
  padding: 0 var(--df-space-2);
  background: var(--df-accent-soft);
  border: 1px solid var(--df-accent-line);
  border-radius: var(--df-radius-pill);
  color: var(--df-accent-text);
  font-size: var(--df-text-xs);
  display: inline-flex;
}

.df-viewer__hint--missed {
  background: var(--df-warning-soft);
  border-color: var(--df-warning-line);
  color: var(--df-warning);
}

.df-viewer__hint--rows {
  background: var(--df-neutral-soft);
  border-color: var(--df-neutral-line);
  color: var(--df-text-muted);
}

.df-viewer__warning {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-2) var(--df-space-3);
  background: var(--df-warning-soft);
  border: 1px solid var(--df-warning-line);
  border-radius: var(--df-radius);
  color: var(--df-text);
  font-size: var(--df-text-sm);
  flex-wrap: wrap;
  margin: 0;
  display: flex;
}

.df-viewer__empty {
  padding: var(--df-space-7) var(--df-space-4);
  color: var(--df-text-subtle);
  font-size: var(--df-text-sm);
  text-align: center;
  margin: 0;
}

@media (prefers-reduced-motion: reduce) {
  .df-viewer__rotor {
    transition: none;
  }
}

.df-banner {
  align-items: flex-start;
  gap: var(--df-space-2);
  padding: var(--df-space-3) var(--df-space-4);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  background: var(--df-surface);
  font-size: var(--df-text-sm);
  color: var(--df-text);
  display: flex;
}

.df-banner--success {
  background: var(--df-success-soft);
  border-color: var(--df-success-line);
}

.df-banner--warning {
  background: var(--df-warning-soft);
  border-color: var(--df-warning-line);
}

.df-banner--danger {
  background: var(--df-danger-soft);
  border-color: var(--df-danger-line);
}

.df-banner--info {
  background: var(--df-info-soft);
  border-color: var(--df-info-line);
}

.df-banner--accent {
  background: var(--df-accent-soft);
  border-color: var(--df-accent-line);
}

.df-banner--neutral {
  background: var(--df-neutral-soft);
  border-color: var(--df-neutral-line);
}

.df-chips {
  gap: var(--df-space-1);
  flex-wrap: wrap;
  display: flex;
}

.df-chip {
  align-items: center;
  gap: var(--df-space-1);
  min-height: 1.5rem;
  padding: .1875rem var(--df-space-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius-pill);
  background: var(--df-surface);
  color: var(--df-text-muted);
  font-size: var(--df-text-xs);
  line-height: var(--df-leading-tight);
  white-space: nowrap;
  transition: background-color var(--df-duration) var(--df-ease),
    border-color var(--df-duration) var(--df-ease),
    color var(--df-duration) var(--df-ease);
  display: inline-flex;
}

.df-chip:hover {
  background: var(--df-surface-2);
  color: var(--df-text);
  text-decoration: none;
}

.df-chip.is-on {
  background: var(--df-accent-soft);
  border-color: var(--df-accent-line);
  color: var(--df-accent-text);
  font-weight: var(--df-weight-medium);
}

.df-chip__count {
  font-variant-numeric: tabular-nums;
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
}

.df-chip.is-on .df-chip__count {
  color: var(--df-accent-text);
}

.df-filters__grid {
  gap: var(--df-space-2) var(--df-space-3);
  grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr));
  align-items: start;
  display: grid;
}

.df-filters .df-field__label {
  font-size: var(--df-text-2xs);
  margin-bottom: .125rem;
}

@media (width >= 60rem) {
  .df-filters__grid > .df-field:first-child {
    grid-column: span 2;
  }
}

.df-filters__actions {
  align-items: center;
  gap: var(--df-space-2);
  margin-top: var(--df-space-3);
  flex-wrap: wrap;
  display: flex;
}

.df-bulkbar {
  justify-content: safe flex-end;
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-2) var(--df-space-3);
  background: var(--df-surface-2);
  border-bottom: 1px solid var(--df-border);
  flex-wrap: wrap;
  display: flex;
  position: relative;
}

.df-bulkbar__count {
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  margin-inline-end: auto;
}

.df-bulkbar__reason {
  width: min(11rem, 30vw);
}

.df-bulkbar__group {
  align-items: center;
  gap: var(--df-space-1);
  display: flex;
}

.df-bulkbar__group .df-select-wrap {
  max-width: 10rem;
}

.df-delete__summary {
  align-items: center;
  gap: var(--df-space-2);
  border: 1px solid var(--df-danger-line);
  border-radius: var(--df-radius);
  background: var(--df-surface);
  color: var(--df-danger);
  font-size: var(--df-text-xs);
  font-weight: var(--df-weight-medium);
  white-space: nowrap;
  cursor: pointer;
  padding: .3125rem .625rem;
  line-height: 1;
  list-style: none;
  display: inline-flex;
}

.df-delete__summary::-webkit-details-marker {
  display: none;
}

.df-delete__summary:hover, .df-delete[open] > .df-delete__summary {
  background: var(--df-danger-soft);
  border-color: var(--df-danger);
}

.df-delete__summary:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: 2px;
}

.df-delete__panel {
  z-index: 20;
  top: calc(100% - var(--df-space-1));
  right: var(--df-space-3);
  gap: var(--df-space-2);
  width: min(24rem, 100vw - 2rem);
  padding: var(--df-space-2) var(--df-space-3);
  border: 1px solid var(--df-danger-line);
  border-radius: var(--df-radius);
  background: var(--df-surface);
  box-shadow: var(--df-shadow-dialog);
  font-size: var(--df-text-xs);
  color: var(--df-text);
  white-space: normal;
  text-align: left;
  flex-direction: column;
  line-height: 1.5;
  display: flex;
  position: absolute;
}

.df-delete__lead {
  font-weight: var(--df-weight-medium);
  margin: 0;
}

.df-delete__list {
  padding-left: var(--df-space-4);
  gap: var(--df-space-1);
  color: var(--df-text-muted);
  flex-direction: column;
  margin: 0;
  display: flex;
}

.df-banner__links {
  gap: var(--df-space-2);
  font-family: var(--df-font-mono);
  flex-wrap: wrap;
  display: inline-flex;
}

.df-doc-cell {
  max-width: 24rem;
}

.df-doclist .df-doc-cell {
  max-width: 18rem;
}

.df-doclist .df-table__td.df-truncate {
  max-width: 11rem;
}

.df-doc-cell__name {
  align-items: center;
  gap: var(--df-space-2);
  min-width: 0;
  font-weight: var(--df-weight-medium);
  color: var(--df-text);
  display: flex;
}

.df-doc-cell__meta {
  padding-left: calc(14px + var(--df-space-2));
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
  display: block;
}

.df-doclist {
  table-layout: fixed;
}

.df-doclist .df-table__td, .df-doclist .df-table__th {
  overflow: hidden;
}

.df-doclist .df-table__th {
  white-space: normal;
}

@media (width <= 1023px) {
  .df-table-scroll--fits {
    overflow-x: auto;
  }

  .df-doclist {
    min-width: 64rem;
  }

  .df-table--sticky .df-table__head .df-table__th {
    position: static;
  }
}

.df-doclist .df-doc-cell, .df-doclist .df-table__td.df-truncate {
  max-width: none;
}

.df-create-tenant__summary, .df-engine__summary {
  justify-content: space-between;
  align-items: center;
  gap: var(--df-space-3);
  padding: var(--df-space-3) var(--df-space-4);
  cursor: pointer;
  font-weight: var(--df-weight-medium);
  list-style: none;
  display: flex;
}

.df-create-tenant__summary::-webkit-details-marker {
  display: none;
}

.df-engine__summary::-webkit-details-marker {
  display: none;
}

.df-create-tenant__summary:hover, .df-engine__summary:hover {
  background: var(--df-surface-2);
}

.df-create-tenant__summary:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: -2px;
}

.df-engine__summary:focus-visible {
  outline: 2px solid var(--df-ring);
  outline-offset: -2px;
}

.df-create-tenant[open] > .df-create-tenant__summary, .df-engine[open] > .df-engine__summary {
  border-bottom: 1px solid var(--df-border);
}

.df-engine__name {
  align-items: center;
  gap: var(--df-space-2);
  min-width: 0;
  display: flex;
}

.df-tenant-swatch {
  border-radius: var(--df-radius-sm);
  width: 1.5rem;
  height: 1.5rem;
  color: var(--df-accent-fg);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  letter-spacing: .02em;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.df-colour-swatch {
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  cursor: pointer;
  flex: none;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
}

.df-teach__split {
  align-items: start;
  gap: var(--df-space-5);
  grid-template-columns: minmax(0, 1.6fr) minmax(20rem, 1fr);
  display: grid;
}

@media (width <= 1199px) {
  .df-teach__split {
    grid-template-columns: minmax(0, 1fr);
  }
}

.df-teach__pane {
  min-width: 0;
}

.df-teach__pane--panel {
  gap: var(--df-space-4);
  flex-direction: column;
  display: flex;
}

.df-teach__pane--canvas {
  top: calc(var(--df-topbar-height) + var(--df-space-3));
  gap: var(--df-space-2);
  flex-direction: column;
  display: flex;
  position: sticky;
}

@media (width <= 1199px) {
  .df-teach__pane--canvas {
    position: static;
  }
}

.df-teach__bar {
  align-items: flex-end;
  gap: var(--df-space-3);
  padding: var(--df-space-2);
  background: var(--df-surface);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  flex-wrap: wrap;
  display: flex;
}

.df-teach__modes {
  gap: var(--df-space-1);
  flex-wrap: wrap;
  display: flex;
}

.df-teach__mode.is-active {
  background: var(--df-accent-soft);
  color: var(--df-accent-text);
  box-shadow: inset 0 0 0 1px var(--df-accent-line);
}

.df-teach__switch {
  gap: var(--df-space-1);
  flex-direction: column;
  min-width: 11rem;
  display: flex;
}

.df-teach__canvas {
  gap: var(--df-space-2);
  flex-direction: column;
  min-height: 24rem;
  display: flex;
}

.df-teach__hint {
  align-items: center;
  gap: var(--df-space-2);
  min-height: 1.5rem;
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
  display: flex;
}

.df-teach__hint-text {
  align-items: center;
  gap: var(--df-space-1);
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 0;
  max-width: 60%;
  color: var(--df-text);
  display: inline-flex;
  overflow: hidden;
}

.df-teach__dirty {
  align-items: center;
  gap: var(--df-space-1);
  padding: 0 var(--df-space-2);
  font-size: var(--df-text-xs);
  color: var(--df-warning);
  display: inline-flex;
}

.df-teach__list {
  gap: var(--df-space-1);
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.df-teach__item {
  align-items: center;
  gap: var(--df-space-2);
  padding: var(--df-space-1) var(--df-space-2);
  background: var(--df-surface-2);
  border-radius: var(--df-radius);
  display: flex;
}

.df-teach__item-main {
  min-width: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  flex-direction: column;
  flex: auto;
  gap: 2px;
  padding: 0;
  display: flex;
}

.df-teach__item-name {
  font-weight: var(--df-weight-medium);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.df-teach__item-meta {
  font-size: var(--df-text-2xs);
  color: var(--df-text-subtle);
}

.df-teach__readout {
  color: var(--df-text-muted);
  margin: 0;
}

.df-teach__subhead {
  align-items: center;
  gap: var(--df-space-2);
  padding-top: var(--df-space-2);
  border-top: 1px solid var(--df-border);
  flex-wrap: wrap;
  display: flex;
}

.df-teach__subtitle {
  font-size: var(--df-text-md);
  font-weight: var(--df-weight-semibold);
  margin: 0;
}

.df-teach__column {
  gap: var(--df-space-2);
  padding: var(--df-space-3);
  background: var(--df-surface-2);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  flex-direction: column;
  margin: 0;
  display: flex;
}

.df-teach__column-head {
  align-items: center;
  gap: var(--df-space-1);
  display: flex;
}

.df-teach__summary {
  padding-top: var(--df-space-3);
  border-top: 1px solid var(--df-border);
}

.df-teach__warnings {
  gap: var(--df-space-1);
  padding-left: var(--df-space-4);
  color: var(--df-text-muted);
  flex-direction: column;
  margin: 0;
  display: flex;
}

.df-primer {
  padding: var(--df-space-3) var(--df-space-4);
  border: 1px solid var(--df-neutral-line);
  border-radius: var(--df-radius);
  background: var(--df-neutral-soft);
}

.df-primer > summary {
  color: var(--df-text);
}

.df-primer > summary:hover {
  color: var(--df-accent);
}

.df-primer[open] {
  padding-bottom: var(--df-space-4);
}

.df-shortcut {
  display: inline-flex;
}

.df-fieldset--section > .df-fieldset__title {
  cursor: pointer;
}

.df-split.df-import__split {
  grid-template-columns: minmax(0, 2fr) minmax(22rem, 1fr);
}

@media (width <= 1279px) {
  .df-split.df-import__split {
    grid-template-columns: minmax(0, 1fr);
  }
}

.df-import__side {
  top: calc(var(--df-topbar-height) + var(--df-space-5));
  min-width: 0;
  position: sticky;
}

@media (width <= 1279px) {
  .df-import__side {
    position: static;
  }
}

.df-import__side .df-card__header {
  flex-wrap: wrap;
}

.df-card__body.df-import__tally {
  padding-top: var(--df-space-2);
  padding-bottom: var(--df-space-2);
  border-bottom: 1px solid var(--df-border);
}

.df-queue.df-import__rows {
  overscroll-behavior: contain;
  max-height: min(32rem, 60vh);
  overflow: hidden auto;
}

@media (width <= 1279px) {
  .df-queue.df-import__rows {
    max-height: none;
    overflow: visible;
  }
}

.df-tabs__tab.is-error, .df-tabs__tab.is-error:hover, .df-tabs__tab.is-active.is-error {
  color: var(--df-danger);
}

.df-tabs__tab.is-error .df-tabs__count {
  background: var(--df-danger-soft);
  color: var(--df-danger);
  box-shadow: inset 0 0 0 1px var(--df-danger-line);
}

.df-tabs__tab.is-done, .df-tabs__tab.is-done:hover, .df-tabs__tab.is-active.is-done {
  color: var(--df-success);
}

.df-tabs__tab.is-done .df-tabs__count {
  background: var(--df-success-soft);
  color: var(--df-success);
  box-shadow: inset 0 0 0 1px var(--df-success-line);
}

.df-chart__band:hover {
  fill: color-mix(in oklab, var(--df-text) 8%, transparent);
}

.df-chart__peak {
  paint-order: stroke fill;
  stroke: var(--df-surface);
  stroke-width: 3px;
  stroke-linejoin: round;
}

.df-editor-body {
  gap: var(--df-space-5);
  grid-template-columns: minmax(0, 1fr) 17rem;
  align-items: start;
  display: grid;
}

.df-editor-body__main {
  min-width: 0;
}

.df-editor-body--single {
  grid-template-columns: minmax(0, 1fr);
}

.df-editor-body__side {
  top: calc(var(--df-topbar-height) + var(--df-space-3));
  min-width: 0;
  position: sticky;
}

@media (width <= 1023px) {
  .df-editor-body {
    grid-template-columns: minmax(0, 1fr);
  }

  .df-editor-body__side {
    position: static;
  }
}

.df-editor-body__checklist {
  max-height: calc(100vh - var(--df-topbar-height) - var(--df-space-6));
  overflow-y: auto;
}

.df-fieldset__title.df-field-summary {
  flex-wrap: wrap;
}

.df-map__note {
  margin: 0 0 var(--df-space-3);
  font-size: var(--df-text-xs);
  color: var(--df-text-muted);
}

.df-map__group {
  margin: var(--df-space-3) 0 var(--df-space-1);
  font-size: var(--df-text-2xs);
  font-weight: var(--df-weight-semibold);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--df-text-muted);
}

.df-map__note + .df-map__group {
  margin-top: 0;
}

.df-map__source, .df-map__dest {
  align-items: center;
  gap: var(--df-space-2);
  width: 100%;
  padding: var(--df-space-2);
  margin-bottom: var(--df-space-1);
  font: inherit;
  font-size: var(--df-text-sm);
  text-align: left;
  color: inherit;
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  cursor: pointer;
  background: none;
  display: flex;
}

.df-map__source:hover:enabled, .df-map__dest:hover:enabled {
  background: var(--df-surface-2);
}

.df-map__source:disabled, .df-map__dest:disabled {
  cursor: default;
  opacity: .55;
}

.df-map__source.is-armed {
  background: var(--df-accent-soft);
  border-color: var(--df-accent);
}

.df-map__source > .df-truncate, .df-map__dest > .df-truncate {
  min-width: 0;
}

.df-map__to {
  color: var(--df-text-subtle);
}

.df-map__dest.is-target {
  border-style: dashed;
  border-color: var(--df-accent);
}

.df-teach__item .df-btn__label:empty {
  display: none;
}

.df-teach__item.is-elsewhere {
  opacity: .6;
}

.df-teach__item.is-elsewhere:hover {
  opacity: 1;
}

.df-teach__item.is-elsewhere:focus-within {
  opacity: 1;
}

.df-viewer__highlight {
  border: 2px solid var(--df-accent);
  background: color-mix(in srgb, var(--df-accent) 12%, transparent);
  pointer-events: none;
  border-radius: 2px;
  position: absolute;
}

.df-viewer__loading {
  z-index: 5;
  background: var(--df-surface);
  animation: .12s linear .12s both df-viewer-wait;
}

@keyframes df-viewer-wait {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.df-tip {
  align-items: center;
  display: inline-flex;
  position: relative;
}

.df-tip--nav {
  display: block;
}

.df-tip--nav > .df-nav__link {
  width: 100%;
}

.df-shell:not(.is-rail) .df-tip--nav .df-tip__bubble {
  display: none;
}

.df-tip__bubble {
  z-index: calc(var(--df-z-toast) - 1);
  background: var(--df-navy);
  width: max-content;
  max-width: 16.25rem;
  color: var(--df-text-inverse);
  border-radius: var(--df-radius);
  box-shadow: var(--df-shadow-menu);
  font-size: var(--df-text-xs);
  font-weight: var(--df-weight-normal);
  text-align: left;
  pointer-events: none;
  padding: .25rem .5rem;
  line-height: 1.35;
  position: fixed;
  top: -9999px;
  left: 0;
}

.df-tip__bubble[hidden] {
  display: none;
}

.df-tip__bubble:after {
  content: "";
  border: 4px solid rgba(0, 0, 0, 0);
  position: absolute;
  left: calc(50% - 4px);
}

.df-tip__bubble[data-side="top"]:after {
  border-top-color: var(--df-navy);
  top: 100%;
}

.df-tip__bubble[data-side="bottom"]:after {
  border-bottom-color: var(--df-navy);
  bottom: 100%;
}

.df-table__td.df-diff__cell.is-changed {
  background: var(--df-warning-soft);
}

.df-tplpage .df-breadcrumb__item:first-child .df-breadcrumb__link:before {
  content: "←";
  content: "←" / "";
  margin-right: var(--df-space-1);
}

.df-tplhead__grid {
  gap: var(--df-space-5);
  grid-template-columns: minmax(0, 1fr) fit-content(27rem);
  align-items: start;
  display: grid;
}

.df-tplhead__identity {
  align-items: flex-start;
  gap: var(--df-space-4);
  min-width: 0;
  display: flex;
}

.df-tplhead__icon {
  border-radius: var(--df-radius-lg);
  background: var(--df-accent-soft);
  width: 3rem;
  height: 3rem;
  color: var(--df-accent-text);
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.df-tplhead__text {
  min-width: 0;
}

.df-tplhead__title-row {
  align-items: center;
  gap: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-tplhead__title {
  font-size: var(--df-text-2xl);
  font-weight: var(--df-weight-semibold);
  line-height: var(--df-leading-tight);
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
  margin: 0;
}

.df-tplhead__description {
  margin: var(--df-space-1) 0 0;
  color: var(--df-text-muted);
  font-size: var(--df-text-base);
}

.df-tplhead__version, .df-tplhead__rollback {
  flex: none;
}

.df-tplhead__rollback .df-select {
  width: 11rem;
}

.df-tplhead__actions {
  align-items: center;
  gap: var(--df-space-2);
  flex-wrap: wrap;
  display: flex;
}

.df-tplhead__recommend form {
  align-items: center;
  gap: var(--df-space-2);
  padding: .3125rem var(--df-space-3);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  color: var(--df-text-muted);
  font-size: var(--df-text-sm);
  display: inline-flex;
}

.df-tplhead__recommend .df-toggle {
  flex-direction: row-reverse;
}

.df-tplhead__recommend.is-on .df-icon {
  color: var(--df-warning);
  fill: currentColor;
}

@media (width <= 1023px) {
  .df-tplhead__grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.df-tabs.df-tabs--pills {
  justify-content: center;
  gap: var(--df-space-1);
  padding: var(--df-space-1);
  border-radius: var(--df-radius-lg);
  background: var(--df-surface-2);
  border-bottom: 0;
  flex-wrap: wrap;
  overflow-x: visible;
}

.df-tabs--pills .df-tabs__tab {
  padding: .375rem var(--df-space-3);
  border-radius: var(--df-radius);
  border-bottom: 0;
  margin-bottom: 0;
}

.df-tabs--pills .df-tabs__tab.is-active {
  background: var(--df-surface);
  color: var(--df-text);
  outline: 1px solid var(--df-border);
  outline-offset: -1px;
}

.df-checks .df-card__header {
  flex-wrap: wrap;
}

.df-checks__list {
  gap: var(--df-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.df-checks__item {
  align-items: flex-start;
  gap: var(--df-space-2);
  font-size: var(--df-text-sm);
  display: flex;
}

.df-checks__mark {
  background: var(--df-success-soft);
  width: 1.125rem;
  height: 1.125rem;
  color: var(--df-success);
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  margin-top: .0625rem;
  display: inline-flex;
}

.df-checks__item.is-failed .df-checks__mark {
  background: var(--df-danger-soft);
  color: var(--df-danger);
}

.df-checks__text {
  min-width: 0;
}

.df-checks__label {
  color: var(--df-text);
}

.df-checks__reason {
  color: var(--df-text-subtle);
  font-size: var(--df-text-xs);
  overflow-wrap: anywhere;
  margin: .125rem 0 0;
}

.df-checks__foot {
  gap: var(--df-space-2);
  margin-top: var(--df-space-3);
  padding-top: var(--df-space-3);
  border-top: 1px solid var(--df-border);
  display: grid;
}

.df-tplform > .df-card__body, .df-tplform form {
  gap: var(--df-space-4);
  display: grid;
}

.df-tplform__pair {
  gap: var(--df-space-4);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  display: grid;
}

.df-tplform__locale .df-select-wrap {
  max-width: 20rem;
}

@media (width <= 639px) {
  .df-tplform__pair {
    grid-template-columns: minmax(0, 1fr);
  }
}

.df-tpltags {
  gap: var(--df-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.df-tpltags__item {
  align-items: baseline;
  gap: var(--df-space-3);
  padding: var(--df-space-2) var(--df-space-3);
  border: 1px solid var(--df-border);
  border-radius: var(--df-radius);
  font-size: var(--df-text-sm);
  display: flex;
}

@media (width >= 1024px) {
  .df-tplhead__grid {
    justify-content: space-between;
    align-items: flex-start;
    display: flex;
  }

  .df-tplhead__identity {
    flex: 0 auto;
  }

  .df-tplhead__actions {
    flex: 1 0 12rem;
    max-width: 27rem;
  }

  .df-tplhead__description {
    width: 0;
    min-width: 100%;
  }
}

.df-tplhead__version .df-select {
  width: 13.25rem;
}

.df-shell__topbar.is-working {
  background: var(--df-warning-soft);
  border-bottom-color: var(--df-warning-line);
}

.df-shell__working {
  flex: 0 auto;
}

.df-shell__working-icon {
  color: var(--df-warning);
  flex: none;
}

.df-shell__working-label {
  font-size: var(--df-text-sm);
  color: var(--df-text-muted);
  white-space: nowrap;
  flex: none;
}

.df-shell__working .df-shell__tenant-name {
  min-width: 0;
}

.df-shell__leave {
  flex: none;
  margin: 0;
  display: flex;
}

@media (width <= 1023px) {
  .df-shell__working-label, .df-shell__working-icon {
    display: none;
  }

  .df-shell__working .df-shell__tenant-name {
    max-width: 7rem;
  }
}