/* Typography for the studio and the admin panel.
   Latin: Plus Jakarta Sans (interface) + Sora (headings). Persian: Vazirmatn (interface) + Estedad (headings).
   Each stack lists the Latin face first; it has no Persian letters, so Persian falls through to the
   Persian face glyph by glyph and mixed text ("Seedance 2.5 · تصویر به ویدیو") uses the right font for each
   script. All fonts are self-hosted (SIL Open Font License, see /static/fonts). */
@font-face{font-family:'Plus Jakarta Sans';src:url('/static/fonts/PlusJakartaSans-latin-wght.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Sora;src:url('/static/fonts/Sora-latin-wght.woff2') format('woff2');font-weight:100 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Estedad;src:url('/static/fonts/Estedad-wght.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200F,U+FB50-FDFF,U+FE70-FEFF}

body.studio,body.admin,html[lang] body.studio,html[lang] body.admin{
 --ui:'Plus Jakarta Sans',Vazirmatn,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Tahoma,sans-serif;
 --display:Sora,Estedad,'Plus Jakarta Sans',Vazirmatn,ui-sans-serif,system-ui,sans-serif;
 font-family:var(--ui);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html[lang] body.studio,html[lang] body.admin,html[lang] body.studio :is(button,input,select,textarea,option),html[lang] body.admin :is(button,input,select,textarea,option){font-family:var(--ui)}

/* Headings and display text */
body.studio :is(h1,h2,h3,.nm-display,.nm-model-title,.stat .value,.brand-name),body.admin :is(h1,h2,h3,.stat .value,.brand-name){font-family:var(--display)}
html:not([lang=fa]) body.studio :is(h1,h2,.nm-display),html:not([lang=fa]) body.admin :is(h1,h2){letter-spacing:-.025em}
html:not([lang=fa]) body.studio :is(.nm-kicker,.eyebrow),html:not([lang=fa]) body.admin :is(.eyebrow,.nav-caption){letter-spacing:.08em}
body.studio .nm-display{font-weight:700}
body.studio :is(.stat .value,.nm-balance,.count-badge),body.admin :is(.stat .value,.table td){font-variant-numeric:tabular-nums}

/* Persian: no letter-spacing (it breaks joined letters), roomier lines, slightly heavier headings */
html[lang=fa] body.studio,html[lang=fa] body.admin{line-height:1.85}
html[lang=fa] body.studio *,html[lang=fa] body.admin *{letter-spacing:0!important}
html[lang=fa] body.studio :is(h1,h2,h3,.nm-display),html[lang=fa] body.admin :is(h1,h2,h3){font-weight:800;line-height:1.45}
html[lang=fa] body.studio .nm-display{line-height:1.35}
html[lang=fa] body.studio :is(p,.job-prompt,.nm-adv-help,.notice),html[lang=fa] body.admin :is(p,.muted){line-height:1.9}

/* Brand: the «نما» wordmark next to the pixel logo */
.brand-name{display:inline-flex;align-items:center;gap:8px}
.brand .nm-wm,.brand-name .nm-wm{font-size:27px;line-height:0}
.brand-en{font-family:var(--display);font-weight:700;letter-spacing:.14em}
html[lang=fa] .brand-fa{display:inline-flex;align-items:center}
.brand-foot{display:inline-flex;align-items:center;gap:8px}
.brand-foot .nm-wm{font-size:18px;line-height:0}
body.studio .nm-hero-wm{display:block;font-size:76px;line-height:0;margin:0 0 18px}
@media (max-width:760px){
 body.studio .nm-top .brand-name{display:inline-flex!important}
 body.studio .nm-top .brand-name .brand-en{display:none}
 body.studio .nm-hero-wm{font-size:56px}
}

/* Persian numbers: digits and separators from the Persian face (no wide Latin comma). */
html[lang=fa] body.studio :is(.stat .value,.nm-balance,.count-badge),html[lang=fa] body.admin .stat .value{font-family:Estedad,Vazirmatn,sans-serif}

/* Admin sidebar: too narrow for the logo and name on one line — stack the Latin name under the wordmark. */
body.admin .sidebar .brand{gap:10px;white-space:normal}
body.admin .sidebar .brand-name{flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
body.admin .sidebar .brand-name .nm-wm{font-size:24px}
body.admin .sidebar .brand-en{font-size:10px;font-weight:700;letter-spacing:.22em;line-height:1.2;white-space:nowrap}
body.admin .sidebar .brand-en .brand-light{font-size:inherit;letter-spacing:inherit;color:var(--muted)}
html[dir=rtl] body.admin .sidebar .brand-name{align-items:flex-end}
