/* Shared guidance typography for public pages and Merchant Studio.
   Grey stays readable on the existing light surfaces; alerts retain status colors. */
:root { --helper-text-color: #6f747c; --helper-text-font: inherit; }
:is(.helper-text, .hint, .privacy, .gallery-hint, .conversion-note,
 .field-format-help, .profile-save-note, .merchant-page-description,
 .stat-note, .login-legal, .landing-legal, .mock-note,
 #photo-empty p, .phone-handoff p, .phone-handoff small,
 #result-empty p, #waiting-message, .result-footer,
 .product-commerce small, .wig-details-body small,
 .merchant-app .form-grid small, .merchant-app .image-placeholder small,
 .merchant-app .image-editor > p,
 .merchant-app .merchant-card > p:not([role]):not(.share-url):not(.contact-save-status):not(.delivery-setup-note),
 .merchant-app .empty-state p, .merchant-app #publish-success > p:not(.share-url),
 .merchant-app #circle-image-picker > p, .demo-copy,
 .merchant-app #publish-summary > p:not(.share-url)) {
 color: var(--helper-text-color) !important;
 font-family: var(--helper-text-font) !important;
 font-weight: 400 !important;
 font-style: normal !important;
 line-height: 1.55;
}
:is(.helper-text, .hint, .privacy, .gallery-hint, .conversion-note,
 .field-format-help, .profile-save-note, .merchant-page-description,
 .stat-note, .login-legal, .landing-legal,
 .merchant-app .form-grid small,
 .merchant-app .merchant-card > p:not([role]):not(.share-url):not(.contact-save-status):not(.delivery-setup-note)) :is(strong,b,em,a,span) {
 font-family: inherit !important;
 font-weight: 400 !important;
 font-style: normal !important;
}
input::placeholder, textarea::placeholder {
 color: var(--helper-text-color) !important;
 font-family: inherit !important;
 font-weight: 400 !important;
 font-style: normal !important;
 opacity: 1;
}
/* Instructions on dark surfaces require a lighter grey for readable contrast. */
.site-footer .helper-text { color: #c4c9d1 !important; }