/* Shared Kanit scale; loaded after page styles, with 16px inputs on mobile. */
:root{font-size:16px}
:is(.front-body,.admin-body) :is(button,input,select,textarea){font-family:inherit}
:is(.front-body,.admin-body) :is(.btn,button){font-weight:500}
:is(.front-body,.admin-body) :is(strong,b){font-weight:700}
.front-body.home-page .reference-hero h1{font-weight:700;white-space:normal;overflow-wrap:break-word}
:is(.front-body,.admin-body){font-family:var(--khelang-font-ui);font-size:1rem;line-height:1.7;text-rendering:optimizeLegibility}
:is(.front-body,.admin-body) :is(p,li,dd,td,th,.form-text){line-height:1.75}
:is(.front-body,.admin-body) :is(h1,h2,h3,h4,h5,h6){font-family:inherit;color:inherit;font-weight:600;line-height:1.45;letter-spacing:0}
:is(.front-body,.admin-body) h1{font-size:clamp(1.75rem,1.45rem + 1.35vw,2.5rem)}
:is(.front-body,.admin-body) h2{font-size:clamp(1.35rem,1.18rem + .65vw,1.75rem)}
:is(.front-body,.admin-body) h3{font-size:clamp(1.1rem,1.02rem + .32vw,1.3rem)}
:is(.front-body,.admin-body) h4{font-size:1.1rem}
:is(.front-body,.admin-body) h5{font-size:1rem}
:is(.front-body,.admin-body) h6{font-size:.9375rem}
:is(.front-body,.admin-body) :is(.front-page-heading h1,.admin-page-heading h1,.content-story-header h1,.calculator-heading h1,.toy-studio-heading h1,.product-detail-title){font-size:clamp(1.875rem,1.55rem + 1.45vw,2.5rem);line-height:1.45}
.front-body.home-page .reference-hero h1{font-size:clamp(2.55rem,2rem + 2.65vw,4.25rem);line-height:1.3;letter-spacing:0}
:is(.front-body,.admin-body) :is(.front-page-heading p,.admin-page-heading p,.content-story-body,.studio-intro){font-size:1rem;line-height:1.85}
:is(.front-body,.admin-body) :is(.btn,button,.form-control,.form-select,.form-label,legend){font-size:.9375rem;line-height:1.6}
:is(.front-body,.admin-body) :is(small,.small,.form-text,.eyebrow,.home-eyebrow,.account-card-kicker){font-size:.8125rem;line-height:1.65}
:is(.front-body,.admin-body) :is(.front-nav a:not(.btn),.audit-nav>a,.audit-menu-group>summary){font-size:.875rem;line-height:1.5}
:is(.front-body,.admin-body) :is(.front-job-meta,.front-summary-note,.product-stock,.story-type,.portfolio-project-category){font-size:.8125rem;line-height:1.65}
:is(.front-body,.admin-body) :is(.table,.table :is(th,td)){font-size:.9375rem;line-height:1.7}
@media(max-width:575px){:is(.front-body,.admin-body){line-height:1.65}:is(.front-body,.admin-body) :is(.btn,button,.form-control,.form-select,.form-label,legend){font-size:1rem}:is(.front-body,.admin-body) :is(small,.small,.form-text,.eyebrow,.home-eyebrow,.account-card-kicker){font-size:.8125rem}.front-body.home-page .reference-hero h1{font-size:clamp(2.35rem,9vw,3.05rem);line-height:1.35}}

/* Final shared typography layer. Keep product artwork and editor font previews independent. */
:root {
  --text-caption: .8125rem;
  --text-small: .875rem;
  --text-control: .9375rem;
  --text-body: 1rem;
  --text-title: clamp(1.875rem, 1.55rem + 1.45vw, 2.5rem);
}
body:is(.front-body,.admin-body) {
  font-family: var(--khelang-font-ui);
  font-size: var(--text-body);
  line-height: 1.75;
}
body:is(.front-body,.admin-body) :is(.btn,.form-control,.form-select,.form-label) {
  font-family: inherit;
  font-size: var(--text-control);
  line-height: 1.6;
}
body:is(.front-body,.admin-body) :is(.front-page-heading,.admin-page-heading) h1,
.front-body .editorial-header h1,
.front-body #keychain .kc-heading h1 {
  font-size: var(--text-title);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0;
}
.front-body.home-page .home-redesign .home-intro h1 {
  font-size: clamp(2rem, 1.5rem + 2.5vw, 3.5rem);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
  overflow-wrap: break-word;
}
.front-body .home-redesign :is(.home-label,small),
.front-body .studio-footer-v2 :is(.footer-v2-eyebrow,.footer-v2-signature,.footer-v2-reply,.footer-v2-bottom p,.footer-v2-bottom a,.footer-v2-logo small,.footer-v2-line small),
.front-body .editorial-detail :is(.editorial-breadcrumb,.editorial-kicker,.editorial-meta,.editorial-eyebrow,figcaption,.editorial-end,.editorial-section-label>span,.editorial-related-card>div>span:first-child) {
  font-size: var(--text-caption);
  line-height: 1.75;
  letter-spacing: 0;
}
.front-body .studio-footer-v2 :is(.footer-v2-description,.footer-v2-intro,.footer-v2-column nav a,.footer-v2-details li,.footer-v2-contact-link),
.front-body .editorial-detail :is(.editorial-sidebar nav a,.editorial-sidebar-note p,.editorial-sidebar-note>a,.editorial-related-card p,.editorial-cta p,.editorial-contact) {
  font-size: var(--text-small);
  line-height: 1.8;
}
.front-body .studio-footer-v2 .footer-v2-grid h2 {
  font-size: var(--text-body);
  font-weight: 600;
  line-height: 1.6;
}
.front-body .studio-header :is(.header-account>a,.header-account-menu>summary,.audit-estimate,.front-menu-button:not([hidden])) {
  font-size: var(--text-small);
  line-height: 1.6;
}
.front-body .studio-header .front-brand small {
  font-size: .75rem;
  line-height: 1.6;
}
@media(max-width:767px) {
  body:is(.front-body,.admin-body) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea,.form-control,.form-select) {
    font-size: 1rem;
  }
}