styles.css

.mdbase-type-picker-suggestion {
  display: grid;
  gap: 0.1rem;
}

.mdbase-type-picker-name {
  font-weight: 600;
}

.mdbase-type-picker-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  color: var(--text-muted);
  font-size: 0.78rem;
}

.mdbase-type-picker-path {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-type-picker-count {
  flex: 0 0 auto;
}

.mdbase-type-picker-match {
  color: var(--text-faint);
  font-size: 0.75rem;
  font-family: var(--font-monospace);
}

/* v0.3 workspace */

.mdbase-status-bar {
  cursor: pointer;
}

.mdbase-status-bar:focus-visible {
  outline: 2px solid var(--interactive-accent);
  outline-offset: 2px;
}

.mdbase-status-bar[data-state="synced"] { color: var(--text-success); }
.mdbase-status-bar[data-state="syncing"] { color: var(--interactive-accent); }
.mdbase-status-bar[data-state="waiting"] { color: var(--text-muted); }
.mdbase-status-bar[data-state="attention"],
.mdbase-status-bar[data-state="paused"] { color: var(--text-warning); }
.mdbase-status-bar[data-state="offline"] { color: var(--text-error); }

.mdbase-workspace {
  container-name: mdbase-workspace;
  container-type: inline-size;
  padding: 0;
  overflow: hidden;
  background: var(--background-primary);
}

.mdbase-shell {
  display: flex;
  min-height: 0;
  height: 100%;
  flex-direction: column;
  color: var(--text-normal);
}

.mdbase-topbar {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 16px;
  border-bottom: 1px solid var(--background-modifier-border);
  background: var(--background-primary);
}

.mdbase-identity,
.mdbase-editor-title-line,
.mdbase-section-header,
.mdbase-document-header,
.mdbase-editor-header,
.mdbase-pane-header,
.mdbase-actions,
.mdbase-editor-actions {
  display: flex;
  align-items: center;
}

.mdbase-identity {
  gap: 8px;
  font-weight: var(--font-semibold);
}

.mdbase-mark {
  display: inline-flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  color: var(--text-normal);
}

.mdbase-mark svg {
  width: 20px;
  height: 20px;
}

.mdbase-icon-accent {
  fill: var(--interactive-accent, currentColor);
}

.mdbase-nav {
  display: flex;
  align-self: stretch;
  gap: 4px;
}

.mdbase-nav-button {
  display: flex;
  min-width: 68px;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  align-self: center;
  gap: 6px;
  border: 0;
  border-radius: var(--button-radius);
  background: transparent;
  box-shadow: none;
  color: var(--text-muted);
}

.mdbase-nav-button:hover,
.mdbase-nav-button.is-active {
  background: var(--background-modifier-hover);
  color: var(--text-normal);
}

.mdbase-nav-button.is-active {
  font-weight: var(--font-semibold);
}

.mdbase-count {
  min-width: 18px;
  padding: 1px 5px;
  border-radius: 9px;
  background: var(--background-modifier-border);
  font-size: var(--font-ui-smaller);
  line-height: 16px;
}

.mdbase-workspace-content {
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.mdbase-inline-message,
.mdbase-inline-error,
.mdbase-readonly-note {
  padding: 9px 16px;
  border-bottom: 1px solid var(--background-modifier-border);
  background: var(--background-secondary);
  color: var(--text-muted);
  font-size: var(--font-ui-small);
}

.mdbase-inline-error {
  border: 1px solid var(--background-modifier-error);
  color: var(--text-error);
}

.mdbase-empty-state {
  max-width: 600px;
  margin: 0 auto;
  padding: 64px 24px;
  text-align: center;
}

.mdbase-empty-state h2 {
  margin: 0 0 8px;
}

.mdbase-empty-state p {
  margin: 0 auto 24px;
  color: var(--text-muted);
}

.mdbase-empty-state .mdbase-actions {
  justify-content: center;
}

.mdbase-legacy-banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px 24px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--background-modifier-border);
  background: var(--background-secondary);
}

.mdbase-legacy-banner p {
  margin: 3px 0 0;
  color: var(--text-muted);
}

.mdbase-migration-review {
  padding: 18px;
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-types-layout {
  display: grid;
  min-height: 540px;
  height: 100%;
  grid-template-columns: minmax(220px, 280px) minmax(440px, 1fr);
}

.mdbase-type-list-pane,
.mdbase-type-editor-pane {
  min-width: 0;
  min-height: 0;
}

.mdbase-type-list-pane {
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--background-modifier-border);
  background: var(--background-secondary);
}

.mdbase-pane-header {
  min-height: 52px;
  justify-content: space-between;
  padding: 0 12px 0 16px;
}

.mdbase-pane-header h2,
.mdbase-editor-header h2,
.mdbase-document-header h2 {
  margin: 0;
  font-size: var(--font-ui-medium);
}

.mdbase-pane-header button,
.mdbase-mobile-back,
.mdbase-editor-actions button {
  min-width: 34px;
  min-height: 34px;
}

.mdbase-type-search {
  width: auto;
  margin: 0 12px 10px;
}

.mdbase-type-list {
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.mdbase-type-row {
  display: flex;
  width: 100%;
  min-height: 54px;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 3px;
  padding: 7px 16px;
  border: 0;
  border-top: 1px solid var(--background-modifier-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

.mdbase-type-row:hover {
  background: var(--background-modifier-hover);
}

.mdbase-type-row.is-active {
  background: var(--background-modifier-active-hover);
}

.mdbase-type-name {
  overflow: hidden;
  color: var(--text-normal);
  font-weight: var(--font-medium);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-type-meta,
.mdbase-editor-path,
.mdbase-form-description,
.mdbase-progress-label {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-empty-list {
  padding: 20px 16px;
  color: var(--text-muted);
  text-align: center;
}

.mdbase-type-editor-pane {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--background-primary);
}

.mdbase-editor-header {
  position: relative;
  z-index: 2;
  top: 0;
  min-height: 64px;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 20px;
  border-bottom: 1px solid var(--background-modifier-border);
  background: var(--background-primary);
}

.mdbase-editor-title-line {
  min-width: 0;
  gap: 8px;
}

.mdbase-editor-title-line h2 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-editor-actions,
.mdbase-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.mdbase-spec-badge,
.mdbase-dirty {
  flex: 0 0 auto;
  padding: 2px 6px;
  border: 1px solid var(--background-modifier-border);
  border-radius: 10px;
  color: var(--text-muted);
  font-family: var(--font-monospace);
  font-size: 10px;
  font-weight: var(--font-normal);
}

.mdbase-dirty {
  border-color: var(--text-accent);
  color: var(--text-accent);
  font-family: var(--font-interface);
}

.mdbase-mobile-back {
  display: none;
  flex: 0 0 auto;
}

.mdbase-mode-switch {
  display: flex;
  width: fit-content;
  gap: 2px;
  margin: 14px 20px 0;
  padding: 2px;
  border: 1px solid var(--background-modifier-border);
  border-radius: var(--button-radius);
}

.mdbase-mode-switch button {
  min-height: 30px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.mdbase-mode-switch button.is-active {
  background: var(--background-modifier-hover);
  color: var(--text-normal);
}

.mdbase-section-nav {
  position: sticky;
  z-index: 1;
  top: -8px;
  display: flex;
  gap: 2px;
  overflow-x: auto;
  margin: -8px -20px 4px;
  padding: 8px 20px;
  border-bottom: 1px solid var(--background-modifier-border);
  background: color-mix(in srgb, var(--background-primary) 94%, transparent);
  scrollbar-width: none;
}

.mdbase-section-nav::-webkit-scrollbar {
  display: none;
}

.mdbase-section-nav button {
  flex: 0 0 auto;
  min-height: 30px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--text-muted);
}

.mdbase-section-nav button:hover,
.mdbase-section-nav button:focus-visible {
  background: var(--background-modifier-hover);
  color: var(--text-normal);
}

.mdbase-editor-document,
.mdbase-sync-document,
.mdbase-issues-document {
  max-width: 880px;
  margin: 0 auto;
  padding: 8px 20px 48px;
}

.mdbase-editor-document {
  width: 100%;
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.mdbase-draft-bar {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 20px;
  border-top: 1px solid var(--background-modifier-border);
  background: var(--background-primary-alt);
  box-shadow: 0 -8px 22px rgb(0 0 0 / 8%);
}

.mdbase-draft-summary {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.mdbase-draft-summary span {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-editor-section {
  padding: 20px 0;
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-editor-section:last-child {
  border-bottom: 0;
}

.mdbase-editor-section h3 {
  margin: 0 0 14px;
  font-size: var(--font-ui-medium);
}

.mdbase-section-header,
.mdbase-document-header {
  justify-content: space-between;
  gap: 16px;
}

.mdbase-section-header h3 {
  margin: 0;
}

.mdbase-document-header {
  padding: 20px 0;
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-document-header p {
  margin: 4px 0 0;
  color: var(--text-muted);
}

.mdbase-form-row {
  display: grid;
  grid-template-columns: minmax(130px, 180px) minmax(220px, 1fr);
  align-items: start;
  gap: 5px 16px;
  padding: 8px 0;
}

.mdbase-form-row > label {
  padding-top: 6px;
  font-weight: var(--font-medium);
}

.mdbase-form-row > .mdbase-form-description {
  grid-column: 1;
}

.mdbase-form-row > input,
.mdbase-form-row > textarea,
.mdbase-form-row > select {
  grid-column: 2;
  grid-row: 1 / span 2;
  width: 100%;
}

.mdbase-form-row > textarea {
  min-height: 74px;
  resize: vertical;
}

.mdbase-checkbox-row,
.mdbase-consent {
  display: flex;
  min-height: 36px;
  align-items: center;
  gap: 9px;
  padding: 8px 0;
}

.mdbase-fields {
  margin-top: 12px;
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-fields > .mdbase-field-node {
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-field-toolbar,
.mdbase-field-toolbar-actions {
  display: flex;
  align-items: center;
}

.mdbase-field-toolbar {
  min-height: 44px;
  justify-content: space-between;
  gap: 12px;
  margin-top: 8px;
}

.mdbase-field-toolbar-actions {
  justify-content: flex-end;
  gap: 8px;
}

.mdbase-field-toolbar-actions input {
  width: min(240px, 34vw);
}

.mdbase-field-count {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

details.mdbase-field-node {
  margin: 0;
  padding: 0;
}

.mdbase-field-summary {
  display: grid;
  min-height: 46px;
  grid-template-columns: minmax(150px, 1fr) minmax(90px, 120px) minmax(88px, auto);
  align-items: center;
  gap: 12px;
  padding: 7px 8px 7px 4px;
  cursor: pointer;
  list-style-position: outside;
}

.mdbase-field-summary:hover,
.mdbase-field-summary:focus-visible {
  background: var(--background-modifier-hover);
}

.mdbase-field-summary-name {
  overflow: hidden;
  font-weight: var(--font-medium);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-field-summary-type {
  color: var(--text-muted);
  font-family: var(--font-monospace);
  font-size: var(--font-ui-smaller);
  text-transform: lowercase;
}

.mdbase-field-summary-rule {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
  text-align: right;
}

.mdbase-field-node[open] > .mdbase-field-summary {
  background: var(--background-secondary-alt);
}

.mdbase-field-node[open] > .mdbase-field-row {
  padding: 12px 8px;
  border-top: 1px solid var(--background-modifier-border-hover);
}

.mdbase-field-row {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) 120px minmax(140px, 1.4fr) auto 34px;
  align-items: center;
  gap: 8px;
  padding: 10px 0;
}

.mdbase-field-row input[type="text"],
.mdbase-field-row select {
  width: 100%;
}

.mdbase-field-name-control,
.mdbase-field-role {
  grid-column: 1;
}

.mdbase-field-type-control {
  grid-column: 2;
}

.mdbase-field-description-control {
  grid-column: 3;
}

.mdbase-field-required {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--font-ui-small);
  white-space: nowrap;
}

.mdbase-field-required input[type="checkbox"] {
  width: var(--checkbox-size);
  flex: 0 0 auto;
}

.mdbase-field-row > .mdbase-field-required {
  grid-column: 4;
}

.mdbase-field-remove {
  grid-column: 5;
  min-width: 34px;
  min-height: 34px;
}

.mdbase-field-role {
  padding-left: 2px;
  color: var(--text-muted);
  font-size: var(--font-ui-small);
  font-weight: var(--font-medium);
}

.mdbase-field-details {
  display: grid;
  grid-template-columns: minmax(110px, 120px) minmax(180px, 1fr) auto;
  align-items: center;
  gap: 8px 12px;
  padding: 0 42px 10px 0;
}

.mdbase-field-details > label:not(.mdbase-field-required) {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-field-details > input[type="text"] {
  width: 100%;
}

.mdbase-field-children {
  margin: 2px 0 10px 7px;
  padding: 5px 0 2px 10px;
  border-left: 1px solid var(--background-modifier-border);
}

.mdbase-field-children-header {
  display: flex;
  min-height: 36px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.mdbase-field-children-header button {
  min-height: 32px;
}

.mdbase-field-children-label {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
  font-weight: var(--font-semibold);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.mdbase-field-children > .mdbase-field-node,
.mdbase-nested-fields > .mdbase-field-node {
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-nested-fields > .mdbase-empty-list {
  padding: 10px 0;
  text-align: left;
}

.mdbase-contracts-section > .mdbase-section-header {
  align-items: start;
}

.mdbase-contract-empty,
.mdbase-contract-unavailable {
  margin-top: 12px;
  padding: 12px 14px;
  color: var(--text-muted);
  background: var(--background-secondary);
  border: 1px solid var(--background-modifier-border);
  line-height: 1.45;
}

.mdbase-contract-implementation {
  margin-top: 14px;
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-contract-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
}

.mdbase-contract-header > div {
  display: flex;
  align-items: baseline;
  gap: 9px;
  min-width: 0;
}

.mdbase-contract-version,
.mdbase-contract-summary {
  color: var(--text-muted);
  font-size: var(--font-ui-small);
}

.mdbase-contract-header button {
  min-height: 32px;
}

.mdbase-contract-implementation details {
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-contract-implementation summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  cursor: pointer;
  color: var(--text-normal);
}

.mdbase-contract-mapping-list {
  padding: 4px 0 14px;
}

.mdbase-contract-mapping-row {
  display: grid;
  grid-template-columns: minmax(150px, .9fr) minmax(180px, 1fr) minmax(150px, .8fr);
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-top: 1px solid var(--background-modifier-border-hover);
}

.mdbase-contract-mapping-row select {
  width: 100%;
}

.mdbase-contract-field-definition,
.mdbase-contract-mapping-status {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.mdbase-contract-field-definition code {
  overflow-wrap: anywhere;
}

.mdbase-contract-field-definition small,
.mdbase-contract-mapping-status small,
.mdbase-contract-schema-field small {
  color: var(--text-muted);
  line-height: 1.35;
}

.mdbase-contract-required,
.mdbase-contract-optional {
  width: fit-content;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-contract-required {
  color: var(--text-error);
}

.mdbase-contract-mapping-row.valid .mdbase-contract-mapping-status strong {
  color: var(--text-success);
}

.mdbase-contract-mapping-row.warning .mdbase-contract-mapping-status strong {
  color: var(--text-warning);
}

.mdbase-contract-mapping-row.error .mdbase-contract-mapping-status strong {
  color: var(--text-error);
}

.mdbase-contract-settings-body {
  padding: 3px 0 14px;
}

.mdbase-contract-settings-body > p {
  margin: 4px 0 12px;
}

.mdbase-contract-schema-object {
  margin: 8px 0 0;
  padding: 0;
  border: 0;
}

.mdbase-contract-schema-object > legend {
  padding: 0;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
  font-weight: var(--font-semibold);
  text-transform: uppercase;
}

.mdbase-contract-schema-field {
  display: grid;
  grid-template-columns: minmax(140px, .6fr) minmax(180px, 1fr);
  gap: 5px 14px;
  align-items: center;
  padding: 8px 0;
  border-top: 1px solid var(--background-modifier-border-hover);
}

.mdbase-contract-schema-field small {
  grid-column: 1;
  grid-row: 2;
}

.mdbase-contract-schema-field > input,
.mdbase-contract-schema-field > select,
.mdbase-contract-schema-field > .mdbase-contract-schema-array {
  grid-column: 2;
  grid-row: 1 / span 2;
  width: 100%;
}

.mdbase-contract-schema-array {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mdbase-contract-schema-array-item {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
}

.mdbase-contract-schema-array-item > span {
  color: var(--text-muted);
  font-size: var(--font-ui-small);
  text-align: right;
}

.mdbase-contract-schema-add {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-top: 10px;
}

.mdbase-contract-schema-add select {
  max-width: 220px;
}

.mdbase-contract-add {
  display: grid;
  grid-template-columns: minmax(140px, 180px) minmax(180px, 1fr) auto;
  gap: 8px 12px;
  align-items: center;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-contract-add select {
  width: 100%;
}

.mdbase-change-review ul,
.mdbase-review-list {
  margin-bottom: 0;
}

.mdbase-change-review li[data-risk="high"]::marker,
.mdbase-diagnostic-item[data-severity="error"] code {
  color: var(--text-error);
}

.mdbase-change-review li[data-risk="review"]::marker,
.mdbase-diagnostic-item[data-severity="warning"] code {
  color: var(--text-warning);
}

.mdbase-diagnostic-summary {
  margin-bottom: 16px;
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-diagnostic-summary > strong {
  display: block;
  padding: 10px 0;
}

.mdbase-diagnostic-item {
  display: grid;
  grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid var(--background-modifier-border-hover);
}

.mdbase-diagnostic-item code {
  overflow-wrap: anywhere;
  font-size: var(--font-ui-smaller);
}

.mdbase-yaml-editor {
  width: 100%;
  min-height: 55vh;
  resize: vertical;
  font-family: var(--font-monospace);
  font-size: var(--font-ui-small);
  line-height: 1.55;
  tab-size: 2;
}

.mdbase-status-list {
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-status-row {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
  gap: 16px;
  padding: 9px 0;
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-status-label {
  color: var(--text-muted);
}

.mdbase-status-value {
  overflow-wrap: anywhere;
}

.mdbase-review-item,
.mdbase-conflict-row {
  padding: 10px 0;
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-review-item[data-severity="lossy"] .mdbase-review-code {
  color: var(--text-error);
}

.mdbase-review-code,
.mdbase-review-ok {
  margin-bottom: 3px;
  color: var(--text-muted);
  font-family: var(--font-monospace);
  font-size: var(--font-ui-smaller);
}

.mdbase-enrollment > button {
  margin-top: 12px;
}

.mdbase-approval-link {
  padding: 10px 0;
  color: var(--text-muted);
}

.mdbase-sync-document progress {
  width: 100%;
  height: 8px;
  margin-top: 18px;
}

.mdbase-progress-label {
  margin-top: 5px;
}

/* Sync is a route, not a settings dashboard. The visual spine makes direction,
   authority, and the exact transfer plan legible at a glance. */
.mdbase-sync-hero {
  margin: 18px 0 28px;
  padding: 22px 0 18px;
  border-top: 1px solid var(--background-modifier-border);
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-sync-route {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto) minmax(0, 1fr);
  align-items: center;
  gap: 18px;
}

.mdbase-sync-endpoint {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 11px;
}

.mdbase-sync-endpoint:last-child {
  justify-content: flex-end;
  text-align: right;
}

.mdbase-sync-endpoint-icon {
  display: inline-flex;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--background-modifier-border);
  border-radius: 50%;
  background: var(--background-secondary);
  color: var(--interactive-accent);
}

.mdbase-sync-endpoint-icon svg {
  width: 18px;
  height: 18px;
}

.mdbase-sync-endpoint > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.mdbase-sync-endpoint strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-sync-endpoint span:not(.mdbase-sync-endpoint-icon),
.mdbase-sync-connection span,
.mdbase-sync-meta {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-sync-connection {
  position: relative;
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  text-align: center;
}

.mdbase-sync-connection::before,
.mdbase-sync-connection::after {
  position: absolute;
  top: 17px;
  width: calc(50% - 17px);
  height: 1px;
  background: var(--background-modifier-border);
  content: "";
}

.mdbase-sync-connection::before { left: 0; }
.mdbase-sync-connection::after { right: 0; }

.mdbase-sync-connection > svg,
.mdbase-sync-connection > span:first-child {
  z-index: 1;
  padding: 5px;
  border-radius: 50%;
  background: var(--background-primary);
  color: var(--interactive-accent);
}

.mdbase-sync-hero[data-state="attention"] .mdbase-sync-connection > span:first-child {
  color: var(--text-warning);
}

.mdbase-sync-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid var(--background-modifier-border-hover);
}

.mdbase-sync-meta code {
  max-width: 44%;
  overflow: hidden;
  color: var(--text-faint);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-sync-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}

.mdbase-file-policy > p {
  max-width: 68ch;
  margin: -6px 0 14px;
  color: var(--text-muted);
}

.mdbase-file-class-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(116px, 1fr));
  gap: 8px;
  margin: 0 0 10px;
}

.mdbase-file-class-grid label {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border: 1px solid var(--background-modifier-border);
  border-radius: var(--radius-s);
  background: var(--background-secondary);
  cursor: pointer;
  font-size: var(--font-ui-small);
}

.mdbase-file-class-grid label:hover {
  border-color: var(--background-modifier-border-hover);
  background: var(--background-modifier-hover);
}

.mdbase-file-class-grid input {
  margin: 0;
}

.mdbase-sync-progress {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 12px;
  align-items: center;
  margin-top: 18px;
  padding: 12px 14px;
  background: var(--background-secondary);
}

.mdbase-sync-progress progress {
  grid-column: 1 / -1;
  margin: 0;
}

.mdbase-sync-progress .mdbase-progress-label {
  margin: 0;
  color: var(--text-muted);
}

.mdbase-sync-progress button {
  min-height: 30px;
}

.mdbase-recovery-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 12px 14px;
  border-left: 3px solid var(--text-warning);
  background: var(--background-secondary);
}

.mdbase-recovery-card strong,
.mdbase-recovery-card div div {
  display: block;
}

.mdbase-recovery-card div div {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: var(--font-ui-small);
}

.mdbase-transfer-review {
  margin: 0 0 28px;
  border-top: 2px solid var(--text-normal);
  border-bottom: 1px solid var(--background-modifier-border);
}

.mdbase-transfer-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
}

.mdbase-transfer-heading h3,
.mdbase-transfer-heading p,
.mdbase-transfer-group-heading h4 {
  margin: 0;
}

.mdbase-transfer-heading p {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: var(--font-ui-small);
}

.mdbase-transfer-total,
.mdbase-transfer-count {
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
  font-variant-numeric: tabular-nums;
}

.mdbase-transfer-total {
  padding: 3px 8px;
  border: 1px solid var(--background-modifier-border);
  border-radius: 999px;
}

.mdbase-transfer-group {
  border-top: 1px solid var(--background-modifier-border);
}

.mdbase-transfer-group-heading {
  display: grid;
  min-height: 46px;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
}

.mdbase-transfer-group-icon {
  display: inline-flex;
  color: var(--interactive-accent);
}

.mdbase-transfer-group[data-direction="attention"] .mdbase-transfer-group-icon {
  color: var(--text-warning);
}

.mdbase-transfer-group-icon svg {
  width: 16px;
  height: 16px;
}

.mdbase-transfer-ledger {
  border-top: 1px solid var(--background-modifier-border-hover);
}

.mdbase-transfer-row {
  display: grid;
  min-height: 52px;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--background-modifier-border-hover);
}

.mdbase-transfer-action {
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
  font-weight: var(--font-semibold);
  letter-spacing: .035em;
  text-transform: uppercase;
}

.mdbase-transfer-action[data-action="delete"],
.mdbase-transfer-action[data-action="replace"],
.mdbase-transfer-action[data-action="fix"] {
  color: var(--text-warning);
}

.mdbase-transfer-body {
  min-width: 0;
}

.mdbase-transfer-body code {
  display: block;
  overflow: hidden;
  color: var(--text-normal);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-transfer-path {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
}

.mdbase-transfer-path code {
  min-width: 0;
}

.mdbase-transfer-kind {
  flex: 0 0 auto;
  padding: 1px 5px;
  border: 1px solid var(--background-modifier-border);
  border-radius: 999px;
  color: var(--text-faint);
  font-size: 10px;
  font-weight: var(--font-semibold);
  letter-spacing: .025em;
  line-height: 1.35;
  text-transform: uppercase;
}

.mdbase-transfer-size {
  flex: 0 0 auto;
  color: var(--text-faint);
  font-size: var(--font-ui-smaller);
  font-variant-numeric: tabular-nums;
}

.mdbase-activity .mdbase-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.mdbase-activity-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: start;
  gap: 9px;
  padding: 10px 0;
  border-top: 1px solid var(--background-modifier-border-hover);
}

.mdbase-activity-row > span:first-child { color: var(--text-muted); }
.mdbase-activity-row[data-tone="success"] > span:first-child { color: var(--text-success); }
.mdbase-activity-row[data-tone="attention"] > span:first-child { color: var(--text-warning); }
.mdbase-activity-row[data-tone="error"] > span:first-child { color: var(--text-error); }
.mdbase-activity-row svg { width: 16px; height: 16px; }
.mdbase-activity-row strong { display: block; }
.mdbase-activity-row > div > div { margin: 2px 0; color: var(--text-muted); }

.mdbase-conflict-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 16px;
}

.mdbase-conflict-summary { min-width: 0; }
.mdbase-conflict-comparison { grid-column: 1 / -1; margin-top: 12px; }

.mdbase-conflict-legend {
  display: flex;
  gap: 16px;
  margin-bottom: 6px;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-conflict-legend .is-local { color: var(--text-error); }
.mdbase-conflict-legend .is-remote { color: var(--text-success); }

.mdbase-conflict-diff {
  max-height: 360px;
  margin: 0;
  padding: 8px 0;
  overflow: auto;
  background: var(--code-background);
  font-size: var(--font-ui-smaller);
}

.mdbase-conflict-diff > div { display: grid; grid-template-columns: 24px minmax(max-content, 1fr); padding: 0 10px; }
.mdbase-conflict-diff > .is-local { background: rgba(var(--color-red-rgb), .12); }
.mdbase-conflict-diff > .is-remote { background: rgba(var(--color-green-rgb), .12); }

.mdbase-conflict-sides {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.mdbase-conflict-side {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--background-modifier-border);
  background: var(--background-secondary);
}

.mdbase-conflict-side h4 { margin: 0 0 8px; }
.mdbase-conflict-side code,
.mdbase-conflict-digest { overflow-wrap: anywhere; }
.mdbase-conflict-side > div { margin-top: 5px; color: var(--text-muted); font-size: var(--font-ui-smaller); }
.mdbase-conflict-image-preview { display: block; max-width: 100%; max-height: 240px; margin-top: 10px; object-fit: contain; }

.mdbase-transfer-body div,
.mdbase-transfer-empty,
.mdbase-transfer-more {
  margin-top: 2px;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-transfer-empty,
.mdbase-transfer-more {
  margin: 0;
  padding: 10px 0 14px 33px;
}

.mdbase-transfer-review > .mdbase-inline-error,
.mdbase-transfer-review > .mdbase-inline-message {
  margin: 14px 0;
}

.mdbase-enrollment-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0;
  margin: 20px 0 18px;
  padding: 0;
  list-style: none;
  counter-reset: none;
}

.mdbase-enrollment-steps li {
  position: relative;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--text-faint);
  font-size: var(--font-ui-smaller);
}

.mdbase-enrollment-steps li:not(:last-child)::after {
  height: 1px;
  min-width: 10px;
  flex: 1;
  margin: 0 8px;
  background: var(--background-modifier-border);
  content: "";
}

.mdbase-enrollment-step-number {
  display: inline-flex;
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--background-modifier-border);
  border-radius: 50%;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.mdbase-enrollment-steps li.is-active {
  color: var(--text-normal);
  font-weight: var(--font-semibold);
}

.mdbase-enrollment-steps li.is-active .mdbase-enrollment-step-number,
.mdbase-enrollment-steps li.is-complete .mdbase-enrollment-step-number {
  border-color: var(--interactive-accent);
  background: var(--interactive-accent);
  color: var(--text-on-accent);
}

.mdbase-enrollment-steps li.is-complete {
  color: var(--text-muted);
}

.mdbase-issue-group {
  padding: 0 0 22px;
}

.mdbase-issue-group + .mdbase-issue-group {
  padding-top: 2px;
}

.mdbase-issue-group-header {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--background-modifier-border);
}

button.mdbase-issue-file-button {
  display: flex;
  min-width: 0;
  min-height: 36px;
  flex: 1;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--text-normal);
  text-align: left;
}

button.mdbase-issue-file-button:hover {
  background: transparent;
  color: var(--text-accent);
}

.mdbase-issue-file-icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  color: var(--text-muted);
}

.mdbase-issue-file-icon svg {
  width: 16px;
  height: 16px;
}

.mdbase-issue-file-path {
  overflow: hidden;
  font-size: var(--font-ui-small);
  font-weight: var(--font-semibold);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-issue-file-count {
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-issue-row {
  display: grid;
  width: 100%;
  min-height: 50px;
  grid-template-columns: 8px minmax(130px, 190px) minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
  padding: 9px 8px;
  border: 0;
  border-bottom: 1px solid var(--background-modifier-border);
  border-radius: 0;
  background: transparent;
  color: var(--text-normal);
  text-align: left;
}

.mdbase-issue-row:hover,
.mdbase-issue-row:focus-within {
  background: var(--background-modifier-hover);
}

.mdbase-issue-indicator {
  width: 7px;
  height: 7px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--text-muted);
}

.mdbase-issue-row[data-severity="error"] .mdbase-issue-indicator {
  background: var(--text-error);
}

.mdbase-issue-row[data-severity="warn"] .mdbase-issue-indicator {
  background: var(--text-warning);
}

.mdbase-issue-metadata {
  min-width: 0;
}

.mdbase-issue-metadata code {
  display: block;
  overflow: hidden;
  color: var(--text-normal);
  font-size: var(--font-ui-smaller);
  font-weight: var(--font-semibold);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-issue-context {
  overflow: hidden;
  margin-top: 3px;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mdbase-issue-row[data-severity="error"] .mdbase-issue-context {
  color: var(--text-error);
}

.mdbase-issue-row[data-severity="warn"] .mdbase-issue-context {
  color: var(--text-warning);
}

.mdbase-issue-row-message {
  min-width: 0;
  padding-top: 1px;
  color: var(--text-normal);
  font-size: var(--font-ui-small);
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.mdbase-issue-row-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.mdbase-issue-row-actions button {
  min-height: 30px;
  white-space: nowrap;
}

.mdbase-issue-controls {
  display: grid;
  grid-template-columns: 150px minmax(240px, 1fr);
  gap: 8px;
  padding: 16px 0 7px;
}

.mdbase-issue-controls input,
.mdbase-issue-controls select {
  width: 100%;
}

.mdbase-issues-summary {
  padding: 0 0 18px;
  color: var(--text-muted);
  font-size: var(--font-ui-smaller);
}

.mdbase-load-more {
  display: block;
  min-height: 40px;
  margin: 18px auto;
}

@container mdbase-workspace (max-width: 760px) {
  .mdbase-topbar {
    min-height: 52px;
    padding: 0 8px 0 12px;
  }

  .mdbase-title {
    display: none;
  }

  .mdbase-nav {
    flex: 1;
    justify-content: flex-end;
  }

  .mdbase-nav-button {
    min-width: 62px;
    min-height: 44px;
  }

  .mdbase-legacy-banner {
    grid-template-columns: 1fr;
  }

  .mdbase-legacy-banner button {
    min-height: 44px;
  }

  .mdbase-types-layout {
    display: block;
    min-height: 0;
  }

  .mdbase-type-list-pane {
    min-height: calc(100vh - 110px);
    border-right: 0;
  }

  .mdbase-types-layout.has-selection .mdbase-type-list-pane {
    display: none;
  }

  .mdbase-types-layout:not(.has-selection) .mdbase-type-editor-pane {
    display: none;
  }

  .mdbase-type-row {
    min-height: 58px;
  }

  .mdbase-mobile-back {
    display: inline-flex;
  }

  .mdbase-editor-header {
    position: static;
    min-height: 58px;
    gap: 8px;
    padding: 7px 10px;
  }

  .mdbase-draft-bar {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
    padding: 10px 14px;
  }

  .mdbase-draft-bar .mdbase-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mdbase-editor-header > div:nth-of-type(1) {
    min-width: 0;
    flex: 1;
  }

  .mdbase-editor-actions button {
    min-height: 44px;
  }

  .mdbase-editor-actions button:first-child {
    display: none;
  }

  .mdbase-mode-switch {
    width: calc(100% - 24px);
    margin: 12px;
  }

  .mdbase-mode-switch button {
    min-height: 40px;
    flex: 1;
  }

  .mdbase-section-nav {
    position: static;
    margin: -4px -14px 4px;
    padding: 8px 14px;
  }

  .mdbase-editor-document,
  .mdbase-sync-document,
  .mdbase-issues-document {
    padding: 4px 14px 48px;
  }

  .mdbase-form-row {
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 10px 0;
  }

  .mdbase-form-row > label,
  .mdbase-form-row > .mdbase-form-description,
  .mdbase-form-row > input,
  .mdbase-form-row > textarea,
  .mdbase-form-row > select {
    grid-column: 1;
    grid-row: auto;
  }

  .mdbase-form-row > input,
  .mdbase-form-row > select,
  .mdbase-actions button,
  .mdbase-section-header button {
    min-height: 44px;
  }

  .mdbase-field-row {
    grid-template-columns: minmax(0, 1fr) 110px 44px;
    gap: 8px;
    padding: 12px 0;
  }

  .mdbase-field-toolbar {
    align-items: stretch;
    flex-direction: column;
    padding: 8px 0;
  }

  .mdbase-field-toolbar-actions,
  .mdbase-field-toolbar-actions input {
    width: 100%;
  }

  .mdbase-field-summary {
    min-height: 54px;
    grid-template-columns: minmax(0, 1fr) 88px;
  }

  .mdbase-field-summary-rule {
    grid-column: 1 / -1;
    padding-left: 0;
    text-align: left;
  }

  .mdbase-diagnostic-item {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .mdbase-field-description-control,
  .mdbase-field-row > .mdbase-field-required {
    grid-column: 1 / -1;
  }

  .mdbase-field-description-control {
    grid-row: 2;
  }

  .mdbase-field-row > .mdbase-field-required {
    grid-row: 3;
  }

  .mdbase-field-remove {
    grid-column: 3;
    grid-row: 1;
    min-height: 44px;
  }

  .mdbase-field-details {
    grid-template-columns: 1fr;
    padding-right: 0;
  }

  .mdbase-field-details > * {
    grid-column: 1;
  }

  .mdbase-field-children {
    margin-left: 6px;
    padding-left: 10px;
  }

  .mdbase-field-children-header button {
    min-height: 44px;
  }

  .mdbase-contract-mapping-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .mdbase-contract-add {
    grid-template-columns: 1fr;
  }

  .mdbase-contract-add button,
  .mdbase-contract-add select,
  .mdbase-contract-schema-add button,
  .mdbase-contract-schema-add select,
  .mdbase-contract-schema-field > input,
  .mdbase-contract-schema-field > select,
  .mdbase-contract-schema-array button {
    min-height: 44px;
  }

  .mdbase-contract-schema-field {
    grid-template-columns: 1fr;
  }

  .mdbase-contract-schema-field small,
  .mdbase-contract-schema-field > input,
  .mdbase-contract-schema-field > select,
  .mdbase-contract-schema-field > .mdbase-contract-schema-array {
    grid-column: 1;
    grid-row: auto;
  }

  .mdbase-contract-header button {
    min-height: 44px;
  }

  .mdbase-conflict-row,
  .mdbase-document-header {
    align-items: stretch;
    flex-direction: column;
  }

  .mdbase-conflict-sides { grid-template-columns: 1fr; }
  .mdbase-recovery-card { grid-template-columns: 1fr; }

  .mdbase-status-row {
    grid-template-columns: 110px minmax(0, 1fr);
  }

  .mdbase-sync-route {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .mdbase-sync-endpoint:last-child {
    justify-content: flex-start;
    text-align: left;
  }

  .mdbase-sync-connection {
    min-height: 42px;
    align-items: flex-start;
    padding-left: 12px;
  }

  .mdbase-sync-connection::before,
  .mdbase-sync-connection::after {
    display: none;
  }

  .mdbase-sync-connection > span:first-child {
    transform: rotate(90deg);
  }

  .mdbase-sync-meta,
  .mdbase-transfer-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .mdbase-sync-meta code {
    max-width: 100%;
  }

  .mdbase-sync-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .mdbase-sync-actions button,
  .mdbase-sync-progress button,
  .mdbase-transfer-row button {
    min-height: 44px;
  }

  .mdbase-file-class-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mdbase-file-class-grid label {
    min-height: 44px;
  }

  .mdbase-transfer-row {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 8px;
  }

  .mdbase-transfer-row > button {
    grid-column: 2;
    width: fit-content;
  }

  .mdbase-enrollment-steps {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .mdbase-enrollment-steps li:not(:last-child)::after {
    display: none;
  }

  .mdbase-issue-controls {
    grid-template-columns: 1fr;
  }

  .mdbase-issue-controls input,
  .mdbase-issue-controls select,
  .mdbase-load-more {
    min-height: 44px;
  }

  .mdbase-issue-row {
    min-height: 60px;
    grid-template-columns: 8px minmax(0, 1fr);
  }

  .mdbase-issue-metadata {
    grid-column: 2;
  }

  .mdbase-issue-row-message {
    grid-column: 2;
  }

  .mdbase-issue-row-actions {
    grid-column: 2;
    flex-wrap: wrap;
  }

  .mdbase-issue-row-actions button {
    min-height: 44px;
  }

  .mdbase-issue-file-count {
    display: none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .mdbase-nav-button,
  .mdbase-type-row,
  .mdbase-mode-switch button {
    transition: background-color 160ms ease, color 160ms ease;
  }
}

/* Obsidian's developer mobile emulation keeps a desktop-width viewport. */
.is-mobile .mdbase-title {
  display: none;
}

.is-mobile .mdbase-nav-button,
.is-mobile .mdbase-editor-actions button,
.is-mobile .mdbase-form-row > input,
.is-mobile .mdbase-form-row > select,
.is-mobile .mdbase-actions button,
.is-mobile .mdbase-section-header button,
.is-mobile .mdbase-issue-controls input,
.is-mobile .mdbase-issue-controls select,
.is-mobile .mdbase-load-more {
  min-height: 44px;
}

.is-mobile .mdbase-file-class-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.is-mobile .mdbase-file-class-grid label {
  min-height: 44px;
}

.is-mobile .mdbase-types-layout {
  display: block;
  min-height: 0;
}

.is-mobile .mdbase-type-list-pane {
  min-height: calc(100vh - 110px);
  border-right: 0;
}

.is-mobile .mdbase-types-layout.has-selection .mdbase-type-list-pane {
  display: none;
}

.is-mobile .mdbase-types-layout:not(.has-selection) .mdbase-type-editor-pane {
  display: none;
}

.is-mobile .mdbase-mobile-back {
  display: inline-flex;
}

.is-mobile .mdbase-editor-header {
  position: static;
}

.is-mobile .mdbase-editor-actions button:first-child {
  display: none;
}

.is-mobile .mdbase-form-row,
.is-mobile .mdbase-issue-controls {
  grid-template-columns: 1fr;
}

.is-mobile .mdbase-form-row > label,
.is-mobile .mdbase-form-row > .mdbase-form-description,
.is-mobile .mdbase-form-row > input,
.is-mobile .mdbase-form-row > textarea,
.is-mobile .mdbase-form-row > select {
  grid-column: 1;
  grid-row: auto;
}

.is-mobile .mdbase-field-row {
  grid-template-columns: minmax(0, 1fr) 110px 44px;
  gap: 8px;
  padding: 12px 0;
}

.is-mobile .mdbase-field-description-control,
.is-mobile .mdbase-field-row > .mdbase-field-required {
  grid-column: 1 / -1;
}

.is-mobile .mdbase-field-description-control {
  grid-row: 2;
}

.is-mobile .mdbase-field-row > .mdbase-field-required {
  grid-row: 3;
}

.is-mobile .mdbase-field-remove {
  grid-column: 3;
  grid-row: 1;
  min-height: 44px;
}

.is-mobile .mdbase-field-details {
  grid-template-columns: 1fr;
  padding-right: 0;
}

.is-mobile .mdbase-field-details > * {
  grid-column: 1;
}

.is-mobile .mdbase-field-children {
  margin-left: 6px;
  padding-left: 10px;
}

.is-mobile .mdbase-field-children-header button {
  min-height: 44px;
}

.is-mobile button.mdbase-issue-row {
  min-height: 60px;
  grid-template-columns: 8px minmax(0, 1fr);
}

.is-mobile .mdbase-issue-metadata,
.is-mobile .mdbase-issue-row-message {
  grid-column: 2;
}

.is-mobile .mdbase-issue-file-count {
  display: none;
}