/* Shared green identity, explicit validation status without color-only signals. */
.validator-page .doc-tabs { margin-bottom: 0; }
.validator-page .doc-tab { flex: 1; }
.doc-hint { font-size: 14px; color: var(--up-muted); line-height: 1.5; }
.validator-page .doc-input { font-variant-numeric: tabular-nums; }
.validator-page .doc-input.invalid { border-color: var(--up-error); }
.doc-result-wrap { min-width: 0; }
.validator-page .result-card { min-height: 180px; }
.validator-page .result-card.invalid { background: var(--up-error-surface); color: var(--up-error); border: 1px solid #ebc1bb; }
.validator-page .result-card.invalid :focus-visible { outline-color: var(--up-error) !important; }
.result-status { font-size: 28px; line-height: 1.2; font-weight: 750; margin-bottom: 12px; }
.result-formatted { font-size: 24px; font-weight: 600; font-variant-numeric: tabular-nums; margin-bottom: 16px; }
.result-icon { margin-bottom: 12px; }
.result-waiting { font-size: 18px; line-height: 1.5; }
.result-waiting-icon { display: none; }
.result-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.result-actions .up-button { flex: 1; font-size: 14px; padding-inline: 12px; }
.generator-section { margin-top: 24px; border-top: 1px solid var(--up-border); padding-top: 16px; }
.doc-generator-heading { display: flex; gap: 16px; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.doc-generator-heading h2 { font-size: 16px; }
.generator-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.generated-item { display: flex; gap: 8px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--up-border); min-width: 0; padding-block: 4px; }
.generated-value { font-size: 14px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.copy-item-btn { min-width: 48px; }
@media (max-width: 767px) {
  .result-status { font-size: 26px; }
  .result-formatted { font-size: 21px; }
  .generator-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .result-actions { flex-direction: column; }
}