.sat-ui-scale-control {
  display: inline-grid;
  grid-template-columns: auto 34px 58px 34px;
  align-items: center;
  gap: 4px;
  min-height: 34px;
  padding: 3px 5px 3px 9px;
  border: 1px solid var(--border, #d8dee8);
  border-radius: 9px;
  background: var(--card, #fff);
  color: var(--text, #1f2937);
  font-family: var(--font-ui, var(--font, system-ui, sans-serif));
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

.sat-ui-scale-label {
  color: var(--text-secondary, var(--text2, #64748b));
  font-weight: 700;
}

.sat-ui-scale-btn,
.sat-ui-scale-value {
  min-height: 28px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.sat-ui-scale-btn:hover,
.sat-ui-scale-value:hover {
  background: var(--primary-light, rgba(47, 95, 208, 0.1));
  color: var(--primary, var(--accent, #2f5fd0));
}

.sat-ui-scale-btn:disabled {
  cursor: not-allowed;
  opacity: 0.35;
}

.sat-ui-scale-btn:focus-visible,
.sat-ui-scale-value:focus-visible {
  outline: 2px solid var(--primary, var(--accent, #2f5fd0));
  outline-offset: 1px;
}

.exam-font-ctrl.sat-ui-scale-control {
  display: inline-grid;
  grid-template-columns: 30px 52px 30px;
  padding-left: 4px;
}

.exam-font-ctrl .sat-ui-scale-label {
  display: none;
}

/* Fixed theme utilities should stay reachable without covering enlarged study
   content. Main content still follows the selected page scale. */
.theme-wp-container,
.theme-toggle {
  left: calc(16px * var(--sat-fixed-utility-scale, 1));
  bottom: calc(16px * var(--sat-fixed-utility-scale, 1));
  transform: scale(var(--sat-fixed-utility-scale, 1));
  transform-origin: left bottom;
}

@media (max-width: 720px) {
  .top-bar > .sat-ui-scale-control {
    order: 5;
  }
}
