/* All product typography is derived here; spacing remains independent. */
:root {
  --text-scale: 1;
  --text-xs: calc(0.875rem * var(--text-scale));
  --text-sm: calc(0.9375rem * var(--text-scale));
  --text-base: calc(1rem * var(--text-scale));
  --text-lg: calc(1.125rem * var(--text-scale));
  --text-xl: calc(1.25rem * var(--text-scale));
  --text-title: calc(1.5rem * var(--text-scale));
  --text-heading: calc(1.75rem * var(--text-scale));
  --text-metric: calc(2.25rem * var(--text-scale));
  --text-display: calc(3rem * var(--text-scale));
  --text-hero: calc(clamp(2.5rem, 4.2vw, 4rem) * var(--text-scale));
}
:root[data-text-size="large"] {
  --text-scale: 1.125;
}
:root[data-text-size="larger"] {
  --text-scale: 1.25;
}
body.gallery {
  font-size: var(--text-base);
}
body.gallery :is(.workspace-link, .q-nav > a, .q-drop > button, .q-nav > [data-action]) {
  font-size: var(--text-base) !important;
}
body.gallery .workspace-active :is(button, input, select, textarea),
body.gallery .detail-form :is(input, select, textarea) {
  line-height: 1.5;
}
body.gallery
  :is(
    .workspace-nav-label,
    .workspace-sidebar-footer small,
    .console-breadcrumb,
    .management-breadcrumb
  ) {
  font-size: var(--text-xs);
}
body.gallery
  :is(.workspace-header-actions, .workspace-header-actions > a, .workspace-profile-name) {
  font-size: var(--text-base);
}
body.gallery :is(.console-page-heading, .management-heading) {
  flex-wrap: wrap;
  gap: 1rem;
}
body.gallery :is(.q-pill, .btn, .console-data-table td, .management-table td, .portal-table td) {
  line-height: 1.5;
}
body.gallery
  :is(
    .console-metric-grid,
    .console-surface,
    .management-surface,
    .management-field,
    .management-setting-copy,
    .workspace-main
  ) {
  min-inline-size: 0;
}
body.gallery :is(.console-surface h2, .management-surface h2) {
  overflow-wrap: anywhere;
}
.display-settings {
  margin-block-start: 1rem;
}
.display-settings .surface-heading {
  margin-block-end: 1rem;
}
.display-settings form {
  display: grid;
  gap: 1rem;
}
.display-size-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}
.display-size-row label {
  font-size: var(--text-base);
  font-weight: 500;
}
.display-size-row select {
  max-inline-size: 100%;
  min-inline-size: 35%;
  padding: 0.6rem 0.9rem;
  border: 0.0625rem solid #858d9c;
  border-radius: 0.7rem;
  font: inherit;
  color: var(--ui-text);
  background: #fff;
}
.display-preview {
  padding: 1rem;
  border-radius: 0.85rem;
  background: #f7f8fc;
  border: 0.0625rem solid #e3e6ee;
}
.display-preview strong {
  display: block;
  font-size: var(--text-title);
  line-height: 1.4;
  margin-block-end: 0.5rem;
}
.display-preview p {
  margin: 0;
  font-size: var(--text-base);
  color: var(--ui-secondary);
}
.display-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.7rem;
}
.display-actions [role="status"] {
  flex-basis: 100%;
  margin: 0;
  font-size: var(--text-sm);
  color: var(--ui-secondary);
}
.display-actions [data-error="true"] {
  color: var(--ui-danger);
}
@media (max-width: 50rem) {
  body.gallery .workspace-brand {
    font-size: var(--text-lg);
    white-space: normal;
    line-height: 1.25;
  }
  body.gallery :is(.workspace-header, .q-header) {
    gap: 0.65rem;
  }
  body.gallery .q-brand {
    min-inline-size: 0;
    font-size: var(--text-lg);
  }
  body.gallery :is(.q-brand span, .workspace-brand span) {
    overflow-wrap: anywhere;
  }
  body.gallery .workspace-sidebar-footer strong {
    overflow-wrap: anywhere;
  }
  .display-size-row select {
    inline-size: 100%;
  }
}

body.gallery .management-heading-actions { flex-wrap: wrap; max-inline-size: 100%; min-inline-size: 0; }
body.gallery .management-heading-actions .q-pill { max-inline-size: 100%; white-space: normal; text-align: center; }
@media(max-width:50rem) {
  body.gallery .management-version { display: none; }
  body.gallery .management-breadcrumb { flex-wrap: wrap; gap: .5rem; }
  body.gallery .management-breadcrumb strong { white-space: nowrap; }
}
