/* * WorkSight AI — Typography (Text Style) tokens * Зеркалит Figma Text Styles (см. artifacts/ds-mirror.json → textStyles) для * узла "Dashboard / Overview" (3732:2107). Каждый стиль раскладывается на 5 * отдельных custom properties (font-family/size/weight/line-height/letter- * spacing), т.к. CSS не позволяет собрать шорткат `font` с letter-spacing. * * Шрифт "Inter Tight" — основной шрифт ДС (см. ds-mirror.json → textStyles.note: * не установлен локально в Figma desktop у ds-agent, но это ограничение * авторской среды Figma, не браузера). Для веб-прототипа подключён через * Google Fonts в screens/*.html; здесь — только имена токенов со стандартным * fallback-стеком. */ :root { --font-family-inter-tight: 'Inter Tight', 'Inter', system-ui, sans-serif; --font-family-inter: 'Inter', system-ui, sans-serif; /* Universal/Label/L2-regular — 18/24, Regular, ls 0.18px */ --universal-label-l2-regular-font-family: var(--font-family-inter-tight); --universal-label-l2-regular-font-size: 18px; --universal-label-l2-regular-font-weight: 400; --universal-label-l2-regular-line-height: 24px; --universal-label-l2-regular-letter-spacing: 0.18px; /* Universal/Label/L2-semi — 18/24, SemiBold, ls 0.18px */ --universal-label-l2-semi-font-family: var(--font-family-inter-tight); --universal-label-l2-semi-font-size: 18px; --universal-label-l2-semi-font-weight: 600; --universal-label-l2-semi-line-height: 24px; --universal-label-l2-semi-letter-spacing: 0.18px; /* Universal/Label/L2-medium — 18/24, Medium, ls 0.18px (заголовок "AI Advisor" * в шапке панели AI Advisor, узел 3732:4699/3732:4439/3732:4955, fileKey * MUpa2QJPKkvZcMcm3qwuUI) — та же геометрия, что у L2-regular/L2-semi, вес Medium. * В Figma сам текстовый узел рендерится с raw text-black, а не с bound * variable — расхождение зафиксировано, здесь всё равно привязано к * Universal/Text/Primary (var ниже), а не хардкожен #000, по общему правилу * "никакого хардкода" (см. отчёт dev-agent). */ --universal-label-l2-medium-font-family: var(--font-family-inter-tight); --universal-label-l2-medium-font-size: 18px; --universal-label-l2-medium-font-weight: 500; --universal-label-l2-medium-line-height: 24px; --universal-label-l2-medium-letter-spacing: 0.18px; /* Universal/Label/L3-regular — 16/24, Regular, ls 0.16px */ --universal-label-l3-regular-font-family: var(--font-family-inter-tight); --universal-label-l3-regular-font-size: 16px; --universal-label-l3-regular-font-weight: 400; --universal-label-l3-regular-line-height: 24px; --universal-label-l3-regular-letter-spacing: 0.16px; /* Universal/Label/L3-medium — 16/24, Medium, ls 0.16px */ --universal-label-l3-medium-font-family: var(--font-family-inter-tight); --universal-label-l3-medium-font-size: 16px; --universal-label-l3-medium-font-weight: 500; --universal-label-l3-medium-line-height: 24px; --universal-label-l3-medium-letter-spacing: 0.16px; /* Universal/Label/L4-regular — 14/20, Regular, ls 0.28px */ --universal-label-l4-regular-font-family: var(--font-family-inter-tight); --universal-label-l4-regular-font-size: 14px; --universal-label-l4-regular-font-weight: 400; --universal-label-l4-regular-line-height: 20px; --universal-label-l4-regular-letter-spacing: 0.28px; /* Universal/Label/L4-medium — 14/20, Medium, ls 0.28px */ --universal-label-l4-medium-font-family: var(--font-family-inter-tight); --universal-label-l4-medium-font-size: 14px; --universal-label-l4-medium-font-weight: 500; --universal-label-l4-medium-line-height: 20px; --universal-label-l4-medium-letter-spacing: 0.28px; /* Universal/Label/L5-regular — 12/16, Regular, ls 0.24px */ --universal-label-l5-regular-font-family: var(--font-family-inter-tight); --universal-label-l5-regular-font-size: 12px; --universal-label-l5-regular-font-weight: 400; --universal-label-l5-regular-line-height: 16px; --universal-label-l5-regular-letter-spacing: 0.24px; /* Universal/Label/L5-medium — 12/16, Medium, ls 0.24px */ --universal-label-l5-medium-font-family: var(--font-family-inter-tight); --universal-label-l5-medium-font-size: 12px; --universal-label-l5-medium-font-weight: 500; --universal-label-l5-medium-line-height: 16px; --universal-label-l5-medium-letter-spacing: 0.24px; /* Universal/Label/L1-semi — 20/24, SemiBold, ls 0.2px (значение "0.32M QAR/year" * на карточках issue-row, экран "Dashboard / Leakage analysis" 3732:2517) */ --universal-label-l1-semi-font-family: var(--font-family-inter-tight); --universal-label-l1-semi-font-size: 20px; --universal-label-l1-semi-font-weight: 600; --universal-label-l1-semi-line-height: 24px; --universal-label-l1-semi-letter-spacing: 0.2px; /* Universal/Label/L5-semi — 12/16, SemiBold, ls 0.24px (лейблы "CRITICAL" / * "HIGH" / "MEDIUM" / "LOW" в Summary strip, тот же экран) */ --universal-label-l5-semi-font-family: var(--font-family-inter-tight); --universal-label-l5-semi-font-size: 12px; --universal-label-l5-semi-font-weight: 600; --universal-label-l5-semi-line-height: 16px; --universal-label-l5-semi-letter-spacing: 0.24px; /* Universal/Body/B2-regular — 16/22, Regular, ls 0.16px (лейблы полей в * раскрытом блоке карточки issue-row, узел 3732:2610) */ --universal-body-b2-regular-font-family: var(--font-family-inter-tight); --universal-body-b2-regular-font-size: 16px; --universal-body-b2-regular-font-weight: 400; --universal-body-b2-regular-line-height: 22px; --universal-body-b2-regular-letter-spacing: 0.16px; /* Universal/Body/B2-medium — та же геометрия, что и B2-regular, но Medium * (значения полей в раскрытом блоке карточки issue-row, узел 3732:2610) */ --universal-body-b2-medium-font-family: var(--font-family-inter-tight); --universal-body-b2-medium-font-size: 16px; --universal-body-b2-medium-font-weight: 500; --universal-body-b2-medium-line-height: 22px; --universal-body-b2-medium-letter-spacing: 0.16px; /* Universal/Body/B1-regular — 18/24, Regular, ls 0.18px (текст Executive Summary) */ --universal-body-b1-regular-font-family: var(--font-family-inter-tight); --universal-body-b1-regular-font-size: 18px; --universal-body-b1-regular-font-weight: 400; --universal-body-b1-regular-line-height: 24px; --universal-body-b1-regular-letter-spacing: 0.18px; /* Universal/Body/B1-medium — та же геометрия, что и B1-regular, но Medium. * Не отдельный именованный Text Style в Figma-файле — используется как * inline-переопределение веса на выделенных span'ах внутри параграфа * Executive Summary (числа/суммы), сама геометрия (family/size/line-height/ * letter-spacing) идентична B1-regular по данным get_design_context. */ --universal-body-b1-medium-font-family: var(--font-family-inter-tight); --universal-body-b1-medium-font-size: 18px; --universal-body-b1-medium-font-weight: 500; --universal-body-b1-medium-line-height: 24px; --universal-body-b1-medium-letter-spacing: 0.18px; /* Desktop/Desktop heading/dH2-semi — 36/42, SemiBold, ls 0.36px ("52nd") */ --desktop-heading-dh2-semi-font-family: var(--font-family-inter-tight); --desktop-heading-dh2-semi-font-size: 36px; --desktop-heading-dh2-semi-font-weight: 600; --desktop-heading-dh2-semi-line-height: 42px; --desktop-heading-dh2-semi-letter-spacing: 0.36px; /* Desktop/Desktop heading/dH3-semi — 32/38, SemiBold, ls 0.32px (числа KPI) */ --desktop-heading-dh3-semi-font-family: var(--font-family-inter-tight); --desktop-heading-dh3-semi-font-size: 32px; --desktop-heading-dh3-semi-font-weight: 600; --desktop-heading-dh3-semi-line-height: 38px; --desktop-heading-dh3-semi-letter-spacing: 0.32px; /* Desktop/Desktop heading/dH4-semi — 24/28, SemiBold, ls 0.24px — добавлено * при сборке "Dashboard / Action Simulator — Simulator Summary (modal)" * (nodeId 3743:8282/3743:8285, fileKey MUpa2QJPKkvZcMcm3qwuUI): заголовок * модалки "Simulation Summary" + числа в её метрик-плитках (Regional * Index/Cost per Student/...). */ --desktop-heading-dh4-semi-font-family: var(--font-family-inter-tight); --desktop-heading-dh4-semi-font-size: 24px; --desktop-heading-dh4-semi-font-weight: 600; --desktop-heading-dh4-semi-line-height: 28px; --desktop-heading-dh4-semi-letter-spacing: 0.24px; /* Desktop/Desktop subtitle/dS3-regular — 24/28, Regular, ls 0.24px — добавлено * при сборке заглушки "coming soon" (узел 3757:3016 "Supernova dev", вложен в * 3757:3012 → 3732:2107, fileKey MUpa2QJPKkvZcMcm3qwuUI): подпись "Supernova * dev" под заголовком "We're working on it!" на разделах без макета. */ --desktop-subtitle-ds3-regular-font-family: var(--font-family-inter-tight); --desktop-subtitle-ds3-regular-font-size: 24px; --desktop-subtitle-ds3-regular-font-weight: 400; --desktop-subtitle-ds3-regular-line-height: 28px; --desktop-subtitle-ds3-regular-letter-spacing: 0.24px; /* Desktop/Desktop display/dD3-semi — 48/54, SemiBold, ls 0.48px (заголовок "Overview") */ --desktop-display-dd3-semi-font-family: var(--font-family-inter-tight); --desktop-display-dd3-semi-font-size: 48px; --desktop-display-dd3-semi-font-weight: 600; --desktop-display-dd3-semi-line-height: 54px; --desktop-display-dd3-semi-letter-spacing: 0.48px; /* * "Text sm/Medium" — 14/20, Medium, ls 0px, шрифт "Inter" (НЕ "Inter Tight"). * Внешний/remote Text Style (тот же паттерн, что задокументирован для * страницы "Sidebar" в ds-mirror.json openIssues) — использован на бейдже * процента изменения ("20%"/"+13%"/...) внутри KPI-карточек. Перенесён как * есть, шрифтовое отличие от Inter Tight не унифицировано — см. открытые * вопросы в отчёте dev-agent. */ --text-sm-medium-font-family: var(--font-family-inter); --text-sm-medium-font-size: 14px; --text-sm-medium-font-weight: 500; --text-sm-medium-line-height: 20px; --text-sm-medium-letter-spacing: 0px; /* * Текст на кнопках (инстансы компонента "Button": Ask Advisor / Add to * Queue / Act now) в get_design_context идёт с font-family "Inter" * (НЕ "Inter Tight"), хотя геометрически (16/24, Medium, ls 0.16px) * совпадает с Universal/Label/L3-medium. Так во всех 3 инстансах на этом * экране одинаково — перенесено как есть, не унифицировано с Inter Tight. * См. открытые вопросы в отчёте dev-agent. */ --button-label-font-family: var(--font-family-inter); --button-label-font-size: 16px; --button-label-font-weight: 500; --button-label-line-height: 24px; --button-label-letter-spacing: 0.16px; }