/* Generated tokens: edit design/tokens.json then run scripts/build-tokens.py. */
:root {
  --color-paper: #F5F5F0;
  --color-surface: #FFFFFF;
  --color-ink: #20251F;
  --color-muted: #5B6257;
  --color-line: #D1D6CC;
  --color-accent: #D1EF75;
  --color-scenario: #DFD8F0;
  --color-scenario-ink: #342B43;
  --color-error: #A42D31;
  --color-error-soft: #FBECEE;
  --color-success: #27613D;
  --color-success-soft: #E8F3E9;
  --color-focus: #5A408A;
  --color-dark-line: #4D5548;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --radius-control: 8px;
  --radius-panel: 16px;
  --radius-screen: 12px;
  --radius-pill: 999px;
  --layout-max: 1440px;
  --layout-gutter: 40px;
  --layout-gutter_mobile: 20px;
  --layout-header: 88px;
  --layout-header_mobile: 72px;
  --layout-breakpoint_tablet: 1080px;
  --layout-breakpoint_mobile: 760px;
  --layout-breakpoint_small: 480px;
  --layout-read_measure: 66ch;
  --size-control: 52px;
  --size-touch: 44px;
  --size-icon: 20px;
  --size-stroke: 1.6px;
  --size-focus: 3px;
  --size-focus_offset: 4px;
  --size-field_min: 56px;
  --size-textarea_min: 144px;
  --size-menu_width: 640px;
  --size-showcase_height: 400px;
  --size-showcase_mobile: 380px;
  --size-thumb_ratio: 16 / 10;
  --size-panel_padding: 32px;
  --size-panel_padding_mobile: 20px;
  --size-shadow: 0 18px 48px rgba(32,37,31,.12);
  --size-scene_padding: 40px;
  --size-scene_border: 8px;
  --size-screen_web_width: 54%;
  --size-screen_bot_width: 29%;
  --size-screen_app_width: 27%;
  --size-screen_web_left: 4%;
  --size-screen_bot_left: 49%;
  --size-screen_app_left: 72%;
  --size-screen_web_top: 36px;
  --size-screen_bot_top: 68px;
  --size-screen_app_top: 104px;
  --size-screen_inner_gap: 12px;
  --size-scene_mobile_padding: 16px;
  --size-scene_mobile_height: 440px;
  --size-preview_type: 14px;
  --size-preview_title: 22px;
  --size-preview_control: 44px;
  --size-preview_grid_min: 80px;
  --size-preview_tile_height: 84px;
  --size-step_icon: 56px;
  --size-lightbox_width: 1080px;
  --size-admin_sidebar: 220px;
  --size-catalog_columns_desktop: 3;
  --size-catalog_columns_mobile: 2;
  --size-preview_mobile_columns: 1.2fr .8fr;
  --size-mini_mobile_columns: 1;
  --size-mini_detail_field: 80px;
  --size-brand_art_height: 430px;
  --size-brand_art_mobile_height: 280px;
  --size-brand_art_max_width: 520px;
  --size-process_art_height: 360px;
  --motion-fast: 160ms;
  --motion-normal: 240ms;
  --motion-scene: 440ms;
  --motion-ease: cubic-bezier(.16,1,.3,1);
  --motion-assembly: 800ms;
  --font-display: "Unbounded", sans-serif;
  --font-body: "Golos Text", sans-serif;
  --text-display: clamp(40px, calc(40px + (88 - 40) * ((100vw - 390px) / 1050)), 88px);
  --text-page-title: clamp(34px, calc(34px + (64 - 34) * ((100vw - 390px) / 1050)), 64px);
  --text-section-title: clamp(28px, calc(28px + (44 - 28) * ((100vw - 390px) / 1050)), 44px);
  --text-card-title: clamp(23px, calc(23px + (28 - 23) * ((100vw - 390px) / 1050)), 28px);
  --text-lead: clamp(19px, calc(19px + (23 - 19) * ((100vw - 390px) / 1050)), 23px);
  --text-body: clamp(17px, calc(17px + (18 - 17) * ((100vw - 390px) / 1050)), 18px);
  --text-nav: clamp(16px, calc(18px + (16 - 18) * ((100vw - 390px) / 1050)), 18px);
  --text-label: clamp(16px, calc(16px + (16 - 16) * ((100vw - 390px) / 1050)), 16px);
  --text-helper: clamp(16px, calc(16px + (16 - 16) * ((100vw - 390px) / 1050)), 16px);
  --text-caption: clamp(14px, calc(14px + (14 - 14) * ((100vw - 390px) / 1050)), 14px);
  --text-button: clamp(16px, calc(16px + (16 - 16) * ((100vw - 390px) / 1050)), 16px);
  --text-wordmark: clamp(23px, calc(23px + (27 - 23) * ((100vw - 390px) / 1050)), 27px);
  --text-table: clamp(16px, calc(16px + (16 - 16) * ((100vw - 390px) / 1050)), 16px);
  --text-article: clamp(18px, calc(18px + (20 - 18) * ((100vw - 390px) / 1050)), 20px);
  --text-preview: clamp(14px, calc(14px + (14 - 14) * ((100vw - 390px) / 1050)), 14px);
  --text-preview-title: clamp(22px, calc(22px + (22 - 22) * ((100vw - 390px) / 1050)), 22px);
}
.type-display { font-family: var(--font-display); font-size: var(--text-display); font-weight: 500; line-height: 1.12; letter-spacing: -0.035em; }
.type-page-title { font-family: var(--font-display); font-size: var(--text-page-title); font-weight: 500; line-height: 1.16; letter-spacing: -0.03em; }
.type-section-title { font-family: var(--font-display); font-size: var(--text-section-title); font-weight: 500; line-height: 1.2; letter-spacing: -0.03em; }
.type-card-title { font-family: var(--font-body); font-size: var(--text-card-title); font-weight: 500; line-height: 1.2; letter-spacing: -0.02em; }
.type-lead { font-family: var(--font-body); font-size: var(--text-lead); font-weight: 400; line-height: 1.45; letter-spacing: -0.015em; }
.type-body { font-family: var(--font-body); font-size: var(--text-body); font-weight: 400; line-height: 1.6; letter-spacing: 0; }
.type-nav { font-family: var(--font-body); font-size: var(--text-nav); font-weight: 500; line-height: 1.4; letter-spacing: 0; }
.type-label { font-family: var(--font-body); font-size: var(--text-label); font-weight: 500; line-height: 1.45; letter-spacing: 0; }
.type-helper { font-family: var(--font-body); font-size: var(--text-helper); font-weight: 400; line-height: 1.5; letter-spacing: 0; }
.type-caption { font-family: var(--font-body); font-size: var(--text-caption); font-weight: 400; line-height: 1.5; letter-spacing: 0; }
.type-button { font-family: var(--font-body); font-size: var(--text-button); font-weight: 500; line-height: 1.4; letter-spacing: 0; }
.type-wordmark { font-family: var(--font-display); font-size: var(--text-wordmark); font-weight: 600; line-height: 1; letter-spacing: -0.04em; }
.type-table { font-family: var(--font-body); font-size: var(--text-table); font-weight: 400; line-height: 1.5; letter-spacing: 0; }
.type-article { font-family: var(--font-body); font-size: var(--text-article); font-weight: 400; line-height: 1.7; letter-spacing: 0; }
.type-preview { font-family: var(--font-body); font-size: var(--text-preview); font-weight: 400; line-height: 1.5; letter-spacing: 0; }
.type-preview-title { font-family: var(--font-body); font-size: var(--text-preview-title); font-weight: 500; line-height: 1.2; letter-spacing: 0; }
