html[data-modern-ui="ready"] .section {
  overflow: clip;
  border: 1px solid var(--mui-color-border-subtle);
  border-radius: var(--mui-radius-card);
  background: var(--mui-color-surface);
  box-shadow: var(--mui-shadow-sm);
}

html[data-modern-ui="ready"] .section__header {
  padding: var(--mui-space-5) var(--mui-space-6) var(--mui-space-2);
}

html[data-modern-ui="ready"] .section__body {
  padding: var(--mui-space-4) var(--mui-space-6);
}

html[data-modern-ui="ready"] .section__footer {
  border-color: var(--mui-color-divider);
  padding: var(--mui-space-4) var(--mui-space-6);
}

html[data-modern-ui="ready"] .section__title {
  color: var(--mui-color-text);
  font-weight: var(--mui-weight-semibold);
}

html[data-modern-ui="ready"] .button:not(.codicon) {
  min-height: var(--mui-control-md);
  height: var(--mui-control-md);
  margin-bottom: var(--mui-space-4);
  padding: 0 var(--mui-space-5);
  border: 1px solid var(--mui-color-border);
  border-radius: var(--mui-radius-button);
  color: var(--mui-color-text);
  background: var(--mui-color-surface-raised);
  box-shadow: var(--mui-shadow-xs);
  font-size: var(--mui-font-size-md);
  font-weight: var(--mui-weight-medium);
  line-height: calc(var(--mui-control-md) - 2px);
  transition:
    background-color var(--mui-duration-fast) var(--mui-ease-standard),
    border-color var(--mui-duration-fast) var(--mui-ease-standard),
    box-shadow var(--mui-duration-fast) var(--mui-ease-standard),
    transform var(--mui-duration-fast) var(--mui-ease-standard);
}

html[data-modern-ui="ready"] .button:not(.codicon):not(:disabled):not(.disabled):hover {
  border-color: var(--mui-color-border-strong);
  color: var(--mui-color-text);
  background: var(--mui-color-surface-muted);
  box-shadow: var(--mui-shadow-sm);
  transform: translateY(-1px);
}

html[data-modern-ui="ready"] .button:not(.codicon):active {
  transform: translateY(0);
}

html[data-modern-ui="ready"] .button.primary,
html[data-modern-ui="ready"] button[data-default-submit],
html[data-modern-ui="ready"] input[type="submit"].button {
  border-color: transparent;
  color: var(--mui-color-on-primary);
  background: var(--mui-color-primary);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--mui-color-primary) 24%, transparent);
}

html[data-modern-ui="ready"] .button.primary:hover,
html[data-modern-ui="ready"] button[data-default-submit]:hover,
html[data-modern-ui="ready"] input[type="submit"].button:hover {
  color: var(--mui-color-on-primary);
  background: var(--mui-color-primary-hover);
}

html[data-modern-ui="ready"] .button.danger,
html[data-modern-ui="ready"] .button.alert {
  border-color: color-mix(in srgb, var(--mui-color-danger) 30%, transparent);
  color: var(--mui-color-danger);
  background: var(--mui-color-danger-subtle);
}

html[data-modern-ui="ready"] :where(input.textbox, textarea.textbox, span.textbox, .select) {
  min-height: var(--mui-control-md);
  border: 1px solid var(--mui-color-border);
  border-radius: var(--mui-radius-input);
  color: var(--mui-color-text);
  background-color: var(--mui-color-surface);
  box-shadow: inset 0 1px 1px rgba(15, 23, 42, 0.025);
  font-size: var(--mui-font-size-md);
  line-height: var(--mui-line-normal);
  transition:
    border-color var(--mui-duration-fast) var(--mui-ease-standard),
    box-shadow var(--mui-duration-fast) var(--mui-ease-standard),
    background-color var(--mui-duration-fast) var(--mui-ease-standard);
}

html[data-modern-ui="ready"] :where(input.textbox, textarea.textbox, .select):hover:not(:disabled) {
  border-color: var(--mui-color-border-strong);
}

html[data-modern-ui="ready"] :where(input.textbox, textarea.textbox, .select):focus {
  border-color: var(--mui-color-primary);
  box-shadow: var(--mui-shadow-focus);
}

html[data-modern-ui="ready"] :where(input.textbox, textarea.textbox, .select):disabled {
  color: var(--mui-color-text-disabled);
  background: var(--mui-color-surface-muted);
  opacity: 0.76;
}

html[data-modern-ui="ready"] label {
  color: var(--mui-color-text-secondary);
  font-weight: var(--mui-weight-medium);
}

html[data-modern-ui="ready"] .help-text {
  color: var(--mui-color-text-tertiary);
  font-size: var(--mui-font-size-sm);
}

html[data-modern-ui="ready"] .data-table {
  color: var(--mui-color-text);
  font-size: var(--mui-font-size-sm);
  font-variant-numeric: tabular-nums;
}

html[data-modern-ui="ready"] .data-table tr {
  border-color: var(--mui-color-divider);
  transition: background-color var(--mui-duration-fast) var(--mui-ease-standard);
}

html[data-modern-ui="ready"] .data-table tr:nth-child(even) {
  background: color-mix(in srgb, var(--mui-color-surface-muted) 54%, transparent);
}

html[data-modern-ui="ready"] .data-table tbody tr:hover {
  background: var(--mui-color-primary-subtle);
}

html[data-modern-ui="ready"] .data-table thead > tr,
html[data-modern-ui="ready"] .data-table th {
  color: var(--mui-color-text-secondary);
  background: var(--mui-color-surface);
  font-weight: var(--mui-weight-semibold);
  letter-spacing: 0.01em;
}

html[data-modern-ui="ready"] .section__table-header {
  z-index: var(--mui-z-sticky);
  background: var(--mui-color-surface-glass);
  box-shadow: 0 1px 0 var(--mui-color-divider);
}

@supports (backdrop-filter: blur(1px)) {
  html[data-modern-ui="ready"] .section__table-header {
    backdrop-filter: blur(12px) saturate(120%);
  }
}

html[data-modern-ui="ready"] .dialog {
  z-index: var(--mui-z-modal);
  background: var(--mui-color-overlay);
}

html[data-modern-ui="ready"] .dialog.withBg .dialog__content {
  overflow: auto;
  max-width: min(900px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  border: 1px solid var(--mui-glass-border);
  border-radius: var(--mui-radius-dialog);
  color: var(--mui-color-text);
  background: var(--mui-glass-bg-strong);
  box-shadow: var(--mui-shadow-lg);
}

@supports (backdrop-filter: blur(1px)) {
  html[data-modern-ui="ready"] .dialog.withBg .dialog__content,
  html[data-modern-ui="ready"] .dropdown .menu {
    backdrop-filter: blur(var(--mui-glass-blur)) saturate(var(--mui-glass-saturate));
  }
}

html[data-modern-ui="ready"] .dropdown .menu,
html[data-modern-ui="ready"] .menu {
  overflow: hidden;
  border: 1px solid var(--mui-glass-border);
  border-radius: var(--mui-radius-md);
  color: var(--mui-color-text);
  background: var(--mui-glass-bg-strong);
  box-shadow: var(--mui-shadow-md);
}

html[data-modern-ui="ready"] .menu__link {
  min-height: 38px;
  color: var(--mui-color-text-secondary);
  transition:
    color var(--mui-duration-fast) var(--mui-ease-standard),
    background-color var(--mui-duration-fast) var(--mui-ease-standard);
}

html[data-modern-ui="ready"] .menu__link:not(.disabled):hover {
  color: var(--mui-color-text);
  background: var(--mui-color-primary-subtle);
}

html[data-modern-ui="ready"] .menu__link.active {
  color: var(--mui-color-primary);
  background: var(--mui-color-primary-subtle);
}

html[data-modern-ui="ready"] .menu__seperator {
  border-color: var(--mui-color-divider);
}

html[data-modern-ui="ready"] blockquote {
  border-left: 3px solid var(--mui-color-info);
  border-radius: 0 var(--mui-radius-sm) var(--mui-radius-sm) 0;
  color: var(--mui-color-text-secondary);
  background: var(--mui-color-info-subtle);
}

html[data-modern-ui="ready"] blockquote.note,
html[data-modern-ui="ready"] blockquote.blue {
  border-color: var(--mui-color-info);
  color: var(--mui-color-text);
  background: var(--mui-color-info-subtle);
}

html[data-modern-ui="ready"] blockquote.warn,
html[data-modern-ui="ready"] blockquote.yellow {
  border-color: var(--mui-color-warning);
  color: var(--mui-color-text);
  background: var(--mui-color-warning-subtle);
}

html[data-modern-ui="ready"] blockquote.red {
  border-color: var(--mui-color-danger);
  color: var(--mui-color-text);
  background: var(--mui-color-danger-subtle);
}

html[data-modern-ui="ready"] .notification,
html[data-modern-ui="ready"] .toast,
html[data-modern-ui="ready"] body > .marker {
  border: 1px solid var(--mui-glass-border);
  border-radius: var(--mui-radius-lg);
  color: var(--mui-color-text);
  background: var(--mui-glass-bg-strong);
  box-shadow: var(--mui-shadow-md);
}

html[data-modern-ui="ready"] .pager__item,
html[data-modern-ui="ready"] .section__tab-header-item {
  border-radius: var(--mui-radius-sm);
  color: var(--mui-color-text-secondary);
  transition:
    color var(--mui-duration-fast) var(--mui-ease-standard),
    background-color var(--mui-duration-fast) var(--mui-ease-standard);
}

html[data-modern-ui="ready"] .pager__item:hover,
html[data-modern-ui="ready"] .section__tab-header-item:hover {
  color: var(--mui-color-text);
  background: var(--mui-color-surface-muted);
}

html[data-modern-ui="ready"] .pager__item.current,
html[data-modern-ui="ready"] .section__tab-header-item.selected {
  color: var(--mui-color-primary);
  background: var(--mui-color-primary-subtle);
}

html[data-modern-ui="ready"] .tag,
html[data-modern-ui="ready"] .badge,
html[data-modern-ui="ready"] .chip,
html[data-modern-ui="ready"] .problem__tag {
  border: 1px solid var(--mui-color-border-subtle);
  border-radius: var(--mui-radius-chip);
  color: var(--mui-color-text-secondary);
  background: var(--mui-color-surface-muted);
  font-size: var(--mui-font-size-xs);
  font-weight: var(--mui-weight-medium);
}
