.value-tier-switcher {
  width: 118px;
  margin: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  position: relative;
  gap: 0;
  padding: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.68);
  border: 1px solid rgba(56, 47, 40, 0.1);
  box-shadow: inset 0 1px 2px rgba(50, 39, 28, 0.05), 0 10px 22px rgba(50, 39, 28, 0.06);
  overflow: hidden;
}

.value-tier-switcher::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 3px;
  top: 3px;
  bottom: 3px;
  width: calc(50% - 3px);
  border-radius: 999px;
  background: #c96a3d;
  box-shadow: 0 8px 18px rgba(201, 106, 61, 0.2);
  transform: translateX(0);
  transition: transform 220ms ease;
}

.value-tier-switcher:has([data-value-tier="pro"].active)::before {
  transform: translateX(100%);
}

.value-tier-switcher .tab-button {
  position: relative;
  z-index: 1;
  min-height: 28px;
  padding: 5px 8px;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(31, 28, 24, 0.72);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
}

.value-tier-switcher .tab-button.active {
  color: #fff7e8 !important;
}

.value-pro-layout.hidden,
#valueBasicModeSwitcher.hidden {
  display: none !important;
}

#aiValueFileInput {
  display: none;
}

.value-pro-layout .mobile-workspace-toolbar {
  display: none;
}

.workspace-heading-actions {
  display: grid;
  gap: 8px;
  justify-items: end;
  align-content: start;
}

.workspace-tier-switcher {
  flex: 0 0 auto;
}

.workspace-heading-actions .hint,
.value-pro-meta .hint {
  text-align: right;
}

.value-pro-workspace-card .panel-heading {
  align-items: flex-start;
}

.value-pro-meta {
  display: grid;
  gap: 10px;
  justify-items: end;
}

.value-pro-toolbar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0 12px;
}

.value-pro-upload-button.is-upload-complete,
.value-pro-analyze-button.is-cue,
.value-pro-result-link.is-result-cue {
  position: relative;
  overflow: hidden;
}

.value-pro-upload-button.is-upload-complete {
  animation: valueButtonPop 520ms ease-out both;
}

.value-pro-analyze-button.is-cue:not([disabled]),
.value-pro-result-link.is-result-cue {
  animation: valueAnalyzePulse 760ms ease-in-out both;
}

.value-pro-upload-button.is-upload-complete::after,
.value-pro-analyze-button.is-cue::after,
.value-pro-result-link.is-result-cue::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 0%, rgba(255, 248, 232, 0.44) 48%, transparent 100%);
  transform: translateX(-120%);
}

.value-pro-upload-button.is-upload-complete::after {
  animation: valueButtonSweep 720ms ease-out both;
}

.value-pro-analyze-button.is-cue::after,
.value-pro-result-link.is-result-cue::after {
  animation: valueButtonSweep 760ms ease-out both;
}

.value-pro-result-link.is-result-ready {
  background: linear-gradient(135deg, #d6783f, #bf5f31) !important;
  border-color: rgba(201, 106, 61, 0.72) !important;
  color: #fff7e8 !important;
  box-shadow: 0 12px 24px rgba(201, 106, 61, 0.24), inset 0 1px 0 rgba(255, 244, 223, 0.24) !important;
}

.value-pro-stage {
  min-height: clamp(380px, 50vw, 640px);
  overflow: hidden;
}

.value-pro-surface {
  position: relative;
  width: 100%;
  min-height: clamp(380px, 50vw, 640px);
  display: grid;
  place-items: center;
  background:
    linear-gradient(rgba(31, 28, 24, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31, 28, 24, 0.045) 1px, transparent 1px),
    #1f1c18;
  background-size: 34px 34px;
}

.value-pro-surface.is-running::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0, rgba(255, 245, 224, 0.16) 50%, transparent 100%),
    radial-gradient(circle at 50% 50%, rgba(201, 106, 61, 0.16), transparent 42%);
  animation: valueAiSweep 1.2s ease-in-out infinite alternate;
  mix-blend-mode: screen;
}

.value-pro-surface::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(90deg, rgba(201, 106, 61, 0) 0%, rgba(201, 106, 61, 0.26) 48%, rgba(201, 106, 61, 0) 100%),
    repeating-linear-gradient(90deg, rgba(255, 246, 224, 0.16) 0 1px, transparent 1px 42px);
  mix-blend-mode: screen;
}

.value-pro-surface.stage-upload .value-pro-image {
  filter: grayscale(1) contrast(1.03) brightness(1.04);
}

.value-pro-surface.stage-grid::before,
.value-pro-surface.stage-values::before,
.value-pro-surface.stage-structure::before {
  opacity: 0.8;
  animation: valueScanSweep 850ms ease-in-out both;
}

.value-pro-surface.stage-values .value-pro-image {
  filter: grayscale(1) contrast(1.18) brightness(1.02);
}

.value-pro-surface.stage-structure .value-pro-image {
  filter: grayscale(1) contrast(1.28) brightness(1.04);
}

.value-pro-surface.stage-final .value-pro-image {
  filter: grayscale(1) contrast(1.05);
  transition: filter 420ms ease;
}

.value-pro-image {
  display: block;
  max-width: 100%;
  max-height: min(70vh, 680px);
  object-fit: contain;
  filter: grayscale(1);
}

.value-pro-empty {
  position: absolute;
  inset: 0;
}

.value-pro-readout {
  display: grid;
  gap: 14px;
}

.value-pro-status {
  display: grid;
  gap: 10px;
  padding: 18px;
  border-radius: 18px;
  border: 1px solid rgba(122, 74, 38, 0.16);
  background: rgba(255, 255, 255, 0.64);
}

.value-pro-status-line {
  margin: 0;
  color: rgba(64, 48, 36, 0.82);
  font-weight: 800;
}

.value-pro-status-detail {
  margin: 0;
  color: rgba(74, 62, 52, 0.78);
  line-height: 1.55;
}

.value-pro-results {
  display: grid;
  gap: 12px;
}

.value-pro-results.hidden {
  display: none !important;
}

.value-pro-results.is-visible .value-pro-result-block {
  opacity: 1;
  transform: translateY(0);
}

.value-pro-lock {
  display: grid;
  gap: 10px;
  padding: 18px;
  border-radius: 18px;
  border: 1px solid rgba(201, 106, 61, 0.2);
  background: linear-gradient(135deg, rgba(201, 106, 61, 0.12), rgba(255, 255, 255, 0.72));
}

.value-pro-lock.hidden {
  display: none !important;
}

.value-pro-lock h3 {
  margin: 0;
  color: #1f1c18;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.2rem;
  letter-spacing: 0;
}

.value-pro-lock p {
  margin: 0;
  color: rgba(64, 48, 36, 0.84);
  line-height: 1.55;
}

.value-pro-lock .button {
  width: 100%;
}

.value-pro-lock-note {
  font-size: 0.88rem;
}

.value-pro-result-block {
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(122, 74, 38, 0.12);
  background: rgba(255, 255, 255, 0.72);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 420ms ease, transform 420ms ease;
}

.value-pro-result-block:nth-child(2) { transition-delay: 80ms; }
.value-pro-result-block:nth-child(3) { transition-delay: 160ms; }
.value-pro-result-block:nth-child(4) { transition-delay: 240ms; }
.value-pro-result-block:nth-child(5) { transition-delay: 320ms; }
.value-pro-result-block:nth-child(6) { transition-delay: 400ms; }
.value-pro-result-block:nth-child(7) { transition-delay: 480ms; }

.value-pro-result-block h3 {
  margin: 0 0 8px;
  color: #1f1c18;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.1rem;
  letter-spacing: 0;
}

.value-pro-result-block p,
.value-pro-result-block li {
  color: rgba(64, 48, 36, 0.84);
  line-height: 1.55;
}

.value-pro-result-block ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.value-pro-scale-card {
  display: grid;
  gap: 12px;
}

.value-pro-scale-head,
.value-pro-scale-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.value-pro-scale-head span {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(201, 106, 61, 0.12);
  color: #9f4d27;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.value-pro-scale {
  position: relative;
  min-height: 54px;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid rgba(122, 74, 38, 0.16);
  background: linear-gradient(90deg, #fff 0%, #e9e5dc 20%, #bbb4a8 42%, #756f68 66%, #1c1a18 100%);
  overflow: hidden;
}

.value-pro-scale::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, rgba(31, 28, 24, 0.18) 0 1px, transparent 1px 5%);
  pointer-events: none;
}

.value-pro-scale-range {
  position: absolute;
  top: 7px;
  bottom: 7px;
  left: var(--range-left);
  width: var(--range-width);
  min-width: 18px;
  border-radius: 10px;
  border: 2px solid #d6783f;
  background: rgba(214, 120, 63, 0.18);
  box-shadow: 0 0 0 1px rgba(255, 248, 232, 0.5), 0 8px 20px rgba(201, 106, 61, 0.22);
  pointer-events: none;
}

.value-pro-scale-ticks {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(20, minmax(0, 1fr));
  gap: 1px;
  height: 34px;
}

.value-pro-scale-tick {
  display: grid;
  place-items: end center;
  color: rgba(31, 28, 24, 0.5);
  font-size: 0.56rem;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.28);
}

.value-pro-scale-tick.active {
  color: #fff7e8;
  text-shadow: 0 1px 2px rgba(31, 28, 24, 0.58);
}

.value-pro-scale-foot {
  color: rgba(64, 48, 36, 0.72);
  font-size: 0.78rem;
  font-weight: 800;
}

.value-pro-scale-foot strong {
  color: #9f4d27;
  font-size: 0.96rem;
}

html:not(.mobile-light-mode) .value-tier-switcher {
  background: rgba(21, 18, 14, 0.9);
  border-color: rgba(200, 148, 74, 0.24);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.04), 0 10px 22px rgba(0, 0, 0, 0.28);
}

html:not(.mobile-light-mode) .value-tier-switcher .tab-button {
  color: rgba(242, 231, 207, 0.72);
}

html:not(.mobile-light-mode) .value-pro-surface {
  background:
    linear-gradient(rgba(242, 231, 207, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 231, 207, 0.045) 1px, transparent 1px),
    #15120e;
}

html:not(.mobile-light-mode) .value-pro-status,
html:not(.mobile-light-mode) .value-pro-lock {
  border-color: rgba(200, 148, 74, 0.2);
  background: rgba(28, 22, 16, 0.72);
}

html:not(.mobile-light-mode) .value-pro-status-line,
html:not(.mobile-light-mode) .value-pro-lock h3 {
  color: #f2e7cf;
}

html:not(.mobile-light-mode) .value-pro-status-detail,
html:not(.mobile-light-mode) .value-pro-lock p {
  color: rgba(242, 231, 207, 0.78);
}

html:not(.mobile-light-mode) .value-pro-result-block {
  border-color: rgba(122, 74, 38, 0.13);
  background:
    repeating-linear-gradient(105deg, rgba(80, 61, 40, 0.016) 0 1px, transparent 1px 10px),
    linear-gradient(180deg, rgba(255, 253, 248, 0.92), rgba(246, 240, 231, 0.9));
  box-shadow: 0 14px 28px rgba(50, 39, 28, 0.08);
}

html:not(.mobile-light-mode) .value-pro-result-block h3 {
  color: #8c3f22;
}

html:not(.mobile-light-mode) .value-pro-result-block p,
html:not(.mobile-light-mode) .value-pro-result-block li {
  color: rgba(64, 48, 36, 0.84);
}

html:not(.mobile-light-mode) .value-pro-result-block:has(ol) {
  border-color: rgba(200, 148, 74, 0.26);
  background:
    repeating-linear-gradient(105deg, rgba(242, 231, 207, 0.025) 0 1px, transparent 1px 10px),
    linear-gradient(135deg, rgba(62, 47, 34, 0.96), rgba(31, 24, 18, 0.96));
  box-shadow: 0 18px 34px rgba(50, 39, 28, 0.16);
}

html:not(.mobile-light-mode) .value-pro-result-block:has(ol) h3 {
  color: #f0ba7a;
}

html:not(.mobile-light-mode) .value-pro-result-block:has(ol) li {
  color: rgba(255, 247, 232, 0.84);
}

html:not(.mobile-light-mode) .value-pro-verdict {
  border-color: rgba(201, 106, 61, 0.22);
  background: linear-gradient(135deg, rgba(248, 229, 205, 0.78), rgba(255, 253, 248, 0.9));
}

html:not(.mobile-light-mode) .value-pro-scale-head span {
  background: rgba(201, 106, 61, 0.18);
  color: #f0ba7a;
}

html:not(.mobile-light-mode) .value-pro-scale-foot {
  color: rgba(242, 231, 207, 0.66);
}

html:not(.mobile-light-mode) .value-pro-scale-foot strong {
  color: #f0ba7a;
}

html.mobile-light-mode .value-pro-workspace-card,
html.mobile-light-mode #aiValueResultPanel,
html.mobile-light-mode .value-pro-layout .card {
  border-color: rgba(61, 51, 40, 0.12) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(246, 240, 231, 0.92)),
    #fffaf4 !important;
  color: #1f1c18 !important;
  box-shadow: 0 18px 34px rgba(50, 39, 28, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

html.mobile-light-mode .value-tier-switcher,
html.mobile-light-mode .value-pro-layout .mobile-workspace-toolbar,
html.mobile-light-mode .value-pro-toolbar {
  border-color: rgba(61, 51, 40, 0.12) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(246, 240, 231, 0.92)),
    #fffaf4 !important;
  color: #1f1c18 !important;
  box-shadow: 0 10px 18px rgba(50, 39, 28, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
}

html.mobile-light-mode .value-tier-switcher .tab-button:not(.active),
html.mobile-light-mode .value-pro-layout .mobile-workspace-toolbar .button-secondary,
html.mobile-light-mode .value-pro-toolbar .button-secondary {
  border-color: rgba(61, 51, 40, 0.12) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(246, 240, 231, 0.92)),
    #fffaf4 !important;
  color: #1f1c18 !important;
  box-shadow: 0 10px 18px rgba(50, 39, 28, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
}

html.mobile-light-mode .value-pro-layout .mobile-workspace-toolbar .button,
html.mobile-light-mode .value-pro-toolbar .button,
html.mobile-light-mode .value-pro-analyze-button.is-cue:not([disabled]),
html.mobile-light-mode .value-pro-result-link.is-result-ready,
html.mobile-light-mode .value-pro-result-link.is-result-cue {
  border-color: rgba(201, 106, 61, 0.36) !important;
  background:
    linear-gradient(135deg, rgba(224, 137, 82, 0.96), rgba(185, 82, 43, 0.98)),
    #c96a3d !important;
  color: #fffaf4 !important;
  box-shadow: 0 14px 24px rgba(201, 106, 61, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

html.mobile-light-mode .value-pro-layout .mobile-workspace-toolbar .button:disabled,
html.mobile-light-mode .value-pro-layout .mobile-workspace-toolbar .button-secondary:disabled,
html.mobile-light-mode .value-pro-toolbar .button:disabled,
html.mobile-light-mode .value-pro-toolbar .button-secondary:disabled {
  border-color: rgba(50, 44, 38, 0.1) !important;
  background: #f0ebe2 !important;
  color: rgba(105, 99, 93, 0.68) !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html.mobile-light-mode .value-pro-stage,
html.mobile-light-mode .value-pro-surface,
html.mobile-light-mode #aiValueUploadZone {
  border-color: rgba(61, 51, 40, 0.14) !important;
  background:
    linear-gradient(rgba(61, 51, 40, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(61, 51, 40, 0.05) 1px, transparent 1px),
    linear-gradient(145deg, rgba(250, 246, 238, 0.96), rgba(236, 229, 217, 0.92)) !important;
  background-size: 34px 34px, 34px 34px, auto !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74), 0 18px 36px rgba(50, 39, 28, 0.14) !important;
}

html.mobile-light-mode .value-pro-status,
html.mobile-light-mode .value-pro-lock,
html.mobile-light-mode .value-pro-result-block,
html.mobile-light-mode .value-pro-scale-card,
html.mobile-light-mode .value-pro-readout .placeholder-panel,
html.mobile-light-mode .value-pro-readout .placeholder-card {
  border-color: rgba(61, 51, 40, 0.12) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(246, 240, 231, 0.92)),
    #fffaf4 !important;
  color: #1f1c18 !important;
  box-shadow: 0 16px 32px rgba(50, 39, 28, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

html.mobile-light-mode .value-pro-status-line,
html.mobile-light-mode .value-pro-lock h3,
html.mobile-light-mode .value-pro-result-block h3,
html.mobile-light-mode .value-pro-workspace-card h2,
html.mobile-light-mode #aiValueResultPanel h2 {
  color: #1f1c18 !important;
  text-shadow: none !important;
}

html.mobile-light-mode .value-pro-status-detail,
html.mobile-light-mode .value-pro-lock p,
html.mobile-light-mode .value-pro-result-block p,
html.mobile-light-mode .value-pro-result-block li,
html.mobile-light-mode .value-pro-meta,
html.mobile-light-mode .value-pro-lock-note,
html.mobile-light-mode .value-pro-scale-foot,
html.mobile-light-mode .value-pro-readout .placeholder-card {
  color: #69635d !important;
}

html.mobile-light-mode .value-pro-workspace-card .section-label,
html.mobile-light-mode #aiValueResultPanel .section-label,
html.mobile-light-mode .value-pro-scale-head span,
html.mobile-light-mode .value-pro-scale-foot strong {
  color: #8c3f22 !important;
}

@keyframes valueAiSweep {
  from {
    opacity: 0.28;
    transform: translateX(-3%);
  }
  to {
    opacity: 0.78;
    transform: translateX(3%);
  }
}

@keyframes valueScanSweep {
  from {
    opacity: 0;
    transform: translateX(-70%);
  }
  35% {
    opacity: 0.9;
  }
  to {
    opacity: 0;
    transform: translateX(70%);
  }
}

@keyframes valueButtonPop {
  0% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.035);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes valueButtonSweep {
  from {
    transform: translateX(-120%);
  }
  to {
    transform: translateX(120%);
  }
}

@keyframes valueAnalyzePulse {
  0%, 100% {
    box-shadow: 0 12px 24px rgba(201, 106, 61, 0.18), inset 0 1px 0 rgba(255, 244, 223, 0.16);
  }
  50% {
    box-shadow: 0 18px 34px rgba(201, 106, 61, 0.32), 0 0 0 1px rgba(201, 106, 61, 0.26), inset 0 1px 0 rgba(255, 244, 223, 0.2);
  }
}

@media (min-width: 1061px) {
  .value-pro-layout {
    grid-template-columns: minmax(640px, 1.18fr) minmax(340px, 0.62fr);
    grid-auto-rows: auto;
    align-items: start;
    gap: 24px;
  }

  .value-pro-workspace-card {
    grid-column: 1;
    grid-row: 1 / span 4;
  }

  .value-pro-stage,
  .value-pro-surface {
    min-height: clamp(420px, 35vw, 580px);
  }

  .value-pro-image {
    max-height: min(62vh, 620px);
  }

  #aiValueResultPanel {
    display: contents;
  }

  #aiValueResultPanel > .panel-heading,
  .value-pro-readout > .placeholder-panel,
  .value-pro-readout > .value-pro-status,
  .value-pro-readout > .value-pro-lock {
    grid-column: 2;
  }

  #aiValueResultPanel > .panel-heading {
    grid-row: 1;
    margin: 0;
    padding: 18px;
    border-radius: 22px;
    border: 1px solid rgba(61, 51, 40, 0.1);
    background:
      repeating-linear-gradient(105deg, rgba(80, 61, 40, 0.018) 0 1px, transparent 1px 10px),
      linear-gradient(180deg, rgba(255, 253, 248, 0.94), rgba(248, 244, 237, 0.91));
    box-shadow: 0 16px 34px rgba(50, 39, 28, 0.08);
  }

  .value-pro-readout {
    display: contents;
  }

  .value-pro-readout > .placeholder-panel {
    grid-row: 2;
  }

  .value-pro-readout > .value-pro-status {
    grid-row: 3;
  }

  .value-pro-readout > .value-pro-lock {
    grid-row: 4;
  }

  .value-pro-readout > #aiValueResults {
    grid-column: 1 / -1;
    grid-row: 5;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
  }

  .value-pro-result-block {
    min-height: 168px;
    padding: 18px;
  }

  .value-pro-scale-card,
  .value-pro-verdict {
    grid-column: span 2;
    min-height: 0;
  }

  .value-pro-result-block:has(ol) {
    grid-column: span 2;
  }
}

@media (min-width: 1061px) and (max-width: 1180px) {
  .value-pro-layout {
    grid-template-columns: minmax(580px, 1fr) minmax(320px, 0.68fr);
  }

  .value-pro-readout > #aiValueResults {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .value-pro-scale-card,
  .value-pro-verdict,
  .value-pro-result-block:has(ol) {
    grid-column: 1 / -1;
  }
}

@media (min-width: 901px) and (max-width: 1060px) {
  .value-pro-layout {
    grid-template-columns: 1fr;
  }

  .value-pro-workspace-card {
    grid-column: auto;
    grid-row: auto;
  }

  #aiValueResultPanel {
    display: block;
  }

  .value-pro-readout {
    display: grid;
    gap: 14px;
  }

  .value-pro-readout > #aiValueResults {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .value-pro-scale-card,
  .value-pro-verdict,
  .value-pro-result-block:has(ol) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  #valueBasicLayout > .card:first-child > .panel-heading,
  .value-pro-workspace-card > .panel-heading {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
  }

  #valueBasicLayout > .card:first-child > .panel-heading > :first-child,
  .value-pro-workspace-card > .panel-heading > :first-child {
    flex: 1 1 auto;
    min-width: 0;
  }

  .value-tier-switcher {
    width: 118px;
    margin: 0;
  }

  .workspace-heading-actions,
  .value-pro-meta {
    flex: 0 0 auto;
    width: auto;
    max-width: 128px;
    justify-items: end;
    margin-left: auto;
  }

  .workspace-heading-actions .hint,
  .value-pro-meta .hint {
    text-align: right;
    max-width: 128px;
    font-size: 0.78rem;
    line-height: 1.3;
  }

  .value-pro-toolbar {
    display: none;
  }

  .value-pro-layout .mobile-workspace-toolbar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 14px 0 12px;
  }

  .value-pro-layout .mobile-workspace-toolbar .button,
  .value-pro-layout .mobile-workspace-toolbar .button-secondary {
    min-height: 48px;
    padding: 9px 8px;
    font-size: 0.78rem;
  }

  .value-pro-stage,
  .value-pro-surface {
    min-height: min(70vh, 520px);
  }

  .value-pro-layout .card {
    margin-bottom: 14px;
  }

  .value-pro-scale-head,
  .value-pro-scale-foot {
    align-items: flex-start;
  }

  .value-pro-scale-head {
    flex-direction: column;
  }

  .value-pro-scale {
    padding: 8px;
  }

  .value-pro-scale-tick {
    font-size: 0;
  }

  .value-pro-scale-tick:nth-child(1),
  .value-pro-scale-tick:nth-child(5),
  .value-pro-scale-tick:nth-child(10),
  .value-pro-scale-tick:nth-child(15),
  .value-pro-scale-tick:nth-child(20) {
    font-size: 0.58rem;
  }
}
