/* web-ui.3. Load after page styles: public reading roles, independent of layout. */
html[lang] body { font-family: var(--sx-font-family); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign { font-size: var(--sx-font-body); }
html[lang] body :is(bdi, .sx-identifier) { unicode-bidi: isolate; }
html[lang] body .sx-identifier { direction: ltr; font-family: var(--sx-font-en); overflow-wrap: anywhere; }
html[lang] body [dir="ltr"]:not(html) { unicode-bidi: isolate; }
html[lang="fa"] body.public-redesign :is(h1, h2, h3, p, blockquote, label, [data-i18n], [data-copy]) { letter-spacing: normal; }

/* English figures have their own language and direction; captions remain bilingual. */
html[lang] body.public-redesign [lang="en"] { font-family: var(--sx-font-en); line-height: 1.6; }
html[lang] body.public-redesign :is(.public-footer-copy strong, .brand > span > strong, .status-brand-copy strong) { font-family: var(--sx-font-en); direction: ltr; unicode-bidi: isolate; }

html[lang] body.public-redesign :is(.hero-copy > p, .help-hero-copy > p, .about-hero-copy > p, .packages-hero-copy > p, .login-panel > p, .chapter-copy > p:not(.chapter-note), .chapter-body p, .story-intro > p, .founder-copy > p, .about-cta p, .no-copyright-points p, .master-quality-points p, .status-copy > p) {
  font-size: var(--sx-font-body);
  line-height: var(--sx-leading-body);
}
html[lang] body.public-redesign :is(.story-chapter h2, .founder-copy h2, .about-cta h2, .help-hero h1, .about-hero h1, .packages-hero h1, .login-panel h1, .account-section h2) { line-height: var(--sx-leading-heading); }
html[lang] body.public-redesign :is(.brand small, .status-brand-copy small, .compatibility-list, .hero-trial-offer, .feature-number, .help-kicker, .about-kicker, .packages-kicker, .account-kicker, .chapter-number, .chapter-kicker, .chapter-index small, .public-section-heading > span, .section-heading > span, .help-hero-meta small, .story-start, .founder-signature span, .founder-stat span, .discipline-reel small, .friction-strip b, .no-copyright-kicker, .master-quality-kicker, .library-counts-heading > span, .platform-stats-heading > span) { font-size: var(--sx-font-support); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign :is(.skip-link, .header-download, .header-help, .header-account, .language-switch button, .text-action, .public-inline-link, .story-start, .guide-index a, .public-account-nav a) { font-size: var(--sx-font-label); line-height: 1.6; }
html[lang] body.public-redesign :is(.preview-caption, .hero-copy .eyebrow, .no-copyright-license, .master-quality-license, .honest-note, .founder-copy blockquote, .chapter-copy blockquote, .public-footer-copyright, .status-note, .status-footer, .release-note, .release-notes-link, .release-card dt, .release-card-head > div > span, .release-status, .public-edition-card dt, .public-edition-note, .public-discount-copy p, .public-discount-copy a, .public-discount-kicker, .public-discount-code > span, .public-discount-code button, .public-discount-timer > span, .public-discount-countdown small) { font-size: var(--sx-font-support); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign :is(.release-card dd, .public-edition-card dd, .status-chip) { font-size: var(--sx-font-label); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign :is([data-i18n$="Kicker"], [data-i18n="eyebrow"], .founder-stat small, .friction-list b, .setup-links a, .topic-strip b, .topic-strip small, .trouble-grid a, .public-guide-summary code, .install-steps small, .library-count-card p, .platform-stat-card p, .chapter-note p, .faq-list p, .faq-list summary, .guide-index > span, .micro-steps strong, .micro-steps small, .help-faq-heading p, .help-cta p, .packages-hero-points span, .package-limits-title, .package-limit > small) { font-size: var(--sx-font-support); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign :is(.install-steps li > span, .micro-steps > div > b, .friction-list li > span, .chapter-index > span) { font-size: var(--sx-font-label); }
html[lang] body.public-redesign .public-guide-summary code { unicode-bidi: isolate; }
html[lang] body.public-redesign :is(.master-quality-benefits p, .setup-flow p, .quick-grid p, .trouble-grid p) { font-size: var(--sx-font-body); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign .discipline-reel strong { font-size: var(--sx-font-body); }
html[lang] body.public-redesign .topic-strip small { white-space: normal; overflow: visible; }
html[lang] body.public-redesign .public-discount-countdown small { overflow-wrap: anywhere; }
html[lang] body.public-redesign .release-card dd { overflow-wrap: anywhere; }
html[lang] body.public-redesign :is(.guide-demo-content small, .guide-demo-item small, .guide-demo-clock, .guide-demo-actions, .guide-demo-actions span, .playlist-illustration small, .project-import-example > p) { font-size: var(--sx-font-support); line-height: 1.6; }
html[lang] body.public-redesign .guide-demo-actions { flex-wrap: wrap; }

/* Account values, errors and real controls never inherit miniature figure text. */
html[lang] body.public-redesign :is(.login-error, .dashboard-message, .section-status, .login-footnote, .login-channel-status, .account-note, .subscription-label, .subscription-status, .subscription-card > p, .subscription-dates small, .subscription-progress span, .subscription-progress strong, .subscription-side > span, .subscription-side > small, .subscription-side > a, .quota-row-head, .quota-row-head strong, .quota-row small, .payment-row small, .payment-status, .session-row small, .session-row button, .account-playlist-row small) { font-size: var(--sx-font-support); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign :is(.login-panel label, .login-panel button, .account-secondary, .account-text-button, .account-playlist-form button, .account-playlist-controls button) { font-size: var(--sx-font-label); line-height: 1.6; }
html[lang] body.public-redesign :is(.login-panel input, .account-playlist-form input) { font-size: var(--sx-font-body); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign :is(.payment-row strong, .session-row strong, .account-playlist-row strong, .subscription-dates strong) { font-size: var(--sx-font-body); line-height: var(--sx-leading-body); }
html[lang] body.public-redesign .payment-row .reference-value { direction: inherit; }
html[lang] body.public-redesign :is(.payment-row strong, .payment-row small, .session-row small) { white-space: normal; overflow-wrap: anywhere; }
html[lang] body.public-redesign :is(.subscription-side > strong, .library-count-value, .platform-stat-value, .quota-row strong, .payment-row strong, .public-discount-countdown strong, .guide-demo-clock, .release-card dd) { font-variant-numeric: tabular-nums; }
html[lang] body.public-redesign .quota-row-head { flex-wrap: wrap; }
html[lang] body.public-redesign .chapter-index small { writing-mode: horizontal-tb; overflow-wrap: anywhere; }

/* Checkout remains Persian; this layer only changes reading roles. */
html[lang] body:has(.pay-shell) { font-size: var(--sx-font-body); }
html[lang] body .pay-shell :is(.pay-card > p, .plans-intro, .pay-result > p:not(.pay-eyebrow):not(.pay-security), .plugin-purchase-note span) { font-size: var(--sx-font-body); line-height: var(--sx-leading-body); }
html[lang] body .pay-shell .pay-card h1 { font-size: var(--sx-font-page); line-height: var(--sx-leading-heading); }
html[lang] body .pay-shell :is(.public-plan p, .public-plan-title > span, .plugin-purchase-note strong) { font-size: var(--sx-font-support); line-height: var(--sx-leading-body); }
html[lang] body .pay-shell :is(.pay-brand small, .pay-eyebrow, .pay-mobile, .pay-plan small, .pay-plan > span, .pay-summary span, .pay-summary b, .pay-summary small, .pay-security, .pay-result dt, .pay-result dd, .pay-discount > label, .pay-discount small, .public-plan-card small, .public-plan-card p) { font-size: var(--sx-font-support); line-height: var(--sx-leading-body); }
html[lang] body .pay-shell :is(.pay-mobile bdi, .pay-plan strong, .pay-primary, .pay-discount input, .pay-discount button) { font-size: var(--sx-font-body); line-height: 1.6; }
html[lang] body .pay-shell .pay-summary strong { font-size: 1.25rem; font-variant-numeric: tabular-nums; }
html[lang] body .pay-shell .pay-discount input { font-family: var(--sx-font-fa); }
html[lang] body .pay-shell :is(.pay-result dd, .pay-mobile bdi, .pay-plan > span) { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
html[lang] body .pay-shell .pay-result dl { text-align: start; }
html[lang] body .pay-shell .pay-result dl div { flex-wrap: wrap; }
html[lang] body .pay-shell .pay-result dd { min-width: 0; max-width: 100%; }
html[lang] body .pay-shell :is(input:not([type="radio"]):not([type="checkbox"]), button) { min-height: var(--sx-control-md); }

html.page-preparing body:has(.status-page) { visibility: hidden; }
html[lang] body.public-redesign .status-copy h1 { font-size: clamp(2rem, 4vw, 3.25rem); line-height: var(--sx-leading-heading); }
@media (max-width: 680px) {
  html[lang] body.public-redesign :is(.help-hero h1, .about-hero h1, .packages-hero h1, .login-panel h1) { font-size: 2rem; }
}