@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400..800&display=swap');
/* Main headings use the chosen brand face. Working UI, numbers and logos keep their own type. */
:root{--tp-font-heading:'Bricolage Grotesque','Plus Jakarta Sans',system-ui,sans-serif}
html:root body :is(#root,#app,.app,.hp,.tp-pe2026) :is(h1,h2,h3,[role="heading"],.page-title,.tp-heading-title,.tpd-page-title,.modal-title,.tp-modal-title,.tp-dialog-title,.tp-publish-title,.tp-insp-title),
html:root body :is(#root,#app,.app,.hp,.tp-pe2026) :is(h1,h2,h3,[role="heading"],.page-title,.tp-heading-title,.tpd-page-title,.modal-title,.tp-modal-title,.tp-dialog-title,.tp-publish-title,.tp-insp-title) :not(svg):not(path):not(code):not(kbd):not(pre){font-family:var(--tp-font-heading)!important}
/* Studio chrome has deliberately stronger route-scoped styles. */
html:root body #root #tp-studio :is(.tp-st-crumb>strong,.tp-insp-title){font-family:var(--tp-font-heading)!important}

html:root body :is(h1,h2,h3,[role="heading"],.page-title,.modal-title,.tp-modal-title,.tp-dialog-title),html:root body :is(h1,h2,h3,[role="heading"],.page-title,.modal-title,.tp-modal-title,.tp-dialog-title) :not(svg):not(path):not(code):not(kbd):not(pre){font-family:var(--tp-font-heading)!important}