/* M367_TOKEN_SOURCE_CONTRACT_V1 START Owner: m367_tokens.css Purpose: explicit own source for shared design tokens. Note: tokens are not inherited from homepage; homepage consumes this layer. M367_TOKEN_SOURCE_CONTRACT_V1 END */ /* * M367 TOKENS v0.1.1 * Base token layer. No page-family selectors. */ :root { --m367-accent-muted-hover: #e86624; --m367-accent-muted-rgb: 216, 90, 27; --m367-accent-muted: #d85a1b; --m367-on-accent: #ffffff; --m367-accent-rgb: var(--m367-accent-muted-rgb); --m367-accent: var(--m367-accent-muted); --m367-breadcrumb-border: var(--m367-foundation-border-soft, rgba(255,255,255,.14)); --m367-breadcrumb-separator: var(--m367-text-tertiary); --m367-breadcrumb-current: var(--m367-text-secondary); --m367-breadcrumb-link: var(--m367-text-strong); /* RESERVED: задел под волну контентных страниц / каталога (2026-07-07) */ --m367-breadcrumb-bg: var(--m367-foundation-bg); /* M367_TOKENS_CLEANUP_V0_2_20260706 START Канон: единый тёмный дизайн на токенах (решение Максима 2026-07-06). - Ширина shell удалена: единственный владелец — mitino367_shell_geometry_v1.css (1200px). - Мёртвая строка --m367-foundation-accent удалена (перебивалась foundation, не работала никогда). - Оранжевый сведён к паре brand (#ff5a00, foundation) / muted-action (#d85a1b, здесь). - Инпуты переведены на тёмные foundation-поверхности (фикс белое-на-белом в форме заявки). - Блок LIGHT-LEGACY ниже: потребителей в home/tasks нет; НЕ удалён до grep по всему public_html (могут читать CSS страниц вне бандла: guarantee, delivery, news и др.). M367_TOKENS_CLEANUP_V0_2_20260706 END */ /* DEPRECATED LIGHT-LEGACY (кандидаты на удаление после серверного grep) */ --m367-color-paper: #fff8f1; --m367-color-surface: #ffffff; --m367-color-graphite-950: #151515; --m367-color-graphite-700: #4a4a4a; --m367-color-muted-500: #777777; /* /DEPRECATED LIGHT-LEGACY */ --m367-border-soft: 1px solid var(--m367-foundation-border-soft, rgba(255, 255, 255, .14)); --m367-border-strong: 1px solid rgba(var(--m367-accent-muted-rgb), 0.42); --m367-action-tonal-bg: rgba(var(--m367-accent-muted-rgb), 0.10); --m367-action-tonal-text: var(--m367-foundation-text, rgba(255, 255, 255, .94)); --m367-focus-ring: 0 0 0 3px rgba(var(--m367-accent-muted-rgb), 0.28); /* M367_SITE_COLOR_SEMANTIC_TOKENS_V0_1_20260730 START Site-wide color roles. Page families consume these roles and must not redeclare their numeric color channels, alpha values or elevations. */ --m367-neutral-white-rgb: 255, 255, 255; --m367-neutral-black-rgb: 0, 0, 0; --m367-surface-rgb: 16, 17, 19; --m367-text-strong: rgba(var(--m367-neutral-white-rgb), .92); --m367-text-secondary: rgba(var(--m367-neutral-white-rgb), .86); --m367-text-tertiary: rgba(var(--m367-neutral-white-rgb), .74); --m367-surface-overlay-subtle: rgba(var(--m367-neutral-white-rgb), .03); --m367-surface-overlay-soft: rgba(var(--m367-neutral-white-rgb), .08); --m367-action-bg-faint: rgba(var(--m367-accent-muted-rgb), .055); --m367-action-bg-hover: rgba(var(--m367-accent-muted-rgb), .07); --m367-action-bg-tonal: rgba(var(--m367-accent-muted-rgb), .12); --m367-action-bg-selected: rgba(var(--m367-accent-muted-rgb), .13); --m367-action-border-divider: rgba(var(--m367-accent-muted-rgb), .14); --m367-action-border-soft: rgba(var(--m367-accent-muted-rgb), .16); --m367-action-border-subtle: rgba(var(--m367-accent-muted-rgb), .18); --m367-action-border-base: rgba(var(--m367-accent-muted-rgb), .28); --m367-action-border-contact: rgba(var(--m367-accent-muted-rgb), .32); --m367-action-border-control: rgba(var(--m367-accent-muted-rgb), .38); --m367-action-border-hover: rgba(var(--m367-accent-muted-rgb), .48); --m367-action-border-strong: rgba(var(--m367-accent-muted-rgb), .55); --m367-action-border-focus: rgba(var(--m367-accent-muted-rgb), .72); --m367-action-outline-strong: 2px solid rgba(var(--m367-accent-muted-rgb), .68); --m367-action-ring-soft: 0 0 0 4px rgba(var(--m367-accent-muted-rgb), .16); --m367-action-glow-soft: 0 0 36px rgba(var(--m367-accent-muted-rgb), .08); --m367-brand-bg-soft: rgba(var(--m367-brand-orange-rgb), .08); --m367-brand-bg-quiet: rgba(var(--m367-brand-orange-rgb), .09); --m367-brand-border-strong: rgba(var(--m367-brand-orange-rgb), .38); --m367-shadow-card-hover: 0 18px 48px rgba(var(--m367-neutral-black-rgb), .30); --m367-shadow-card-soft: 0 14px 32px rgba(var(--m367-neutral-black-rgb), .18); --m367-shadow-floating-up: 0 -14px 34px rgba(var(--m367-neutral-black-rgb), .24); --m367-shadow-floating-menu: 0 18px 52px rgba(var(--m367-neutral-black-rgb), .36); /* M367_SITE_COLOR_SEMANTIC_TOKENS_V0_1_20260730 END */ /* RESERVED: задел под волну контентных страниц / каталога (2026-07-07) */ --m367-shell-pad-x: clamp(16px, 3vw, 28px); --m367-section-gap-y: 56px; --m367-section-head-gap: 22px; --m367-grid-gap: 20px; --m367-card-pad: 24px; --m367-card-radius: 18px; --m367-control-height: 46px; --m367-control-pad-x: 20px; --m367-input-height: 46px; --m367-font-size-body: 16px; --m367-font-size-small: 14px; /* Site-level control geometry. Modules may alias these values, never redefine them numerically. */ --m367-button-radius: 8px; --m367-button-min-h: 46px; --m367-button-pad-x: 20px; --m367-button-font-size: 14px; --m367-button-weight: 850; --m367-button-gap: 8px; --m367-button-focus-ring: 3px solid rgba(255, 90, 0, .72); --m367-button-focus-offset: 2px; /* M367_SHARED_SEMANTIC_TOKENS_V0_2_20260714 START Existing sticky-breadcrumb fallback promoted without changing its value. */ --m367-z-sticky-breadcrumbs: 950; /* M367_SHARED_SEMANTIC_TOKENS_V0_2_20260714 END */ /* T-5: ранние дубли --m367-card-bg/--m367-card-border удалены; владельцы — блок OVERLAP_BUTTONS ниже. */ --m367-card-shadow: 0 18px 50px rgba(0, 0, 0, 0.08); /* T-2: инпуты на тёмных foundation-поверхностях (было: белый --m367-bg-surface → белое-на-белом в .m367-task-request) */ --m367-input-bg: var(--m367-foundation-surface-raised, #151619); --m367-input-border: 1px solid var(--m367-foundation-border-soft, rgba(255, 90, 0, .18)); --m367-input-focus-ring: var(--m367-focus-ring); } [data-m367-density="compact"] { /* shell-width удалена: владелец — shell_geometry (T-1) */ --m367-shell-pad-x: clamp(12px, 2vw, 20px); --m367-section-gap-y: 40px; --m367-section-head-gap: 16px; --m367-grid-gap: 16px; --m367-card-pad: 18px; --m367-card-radius: 14px; --m367-control-height: 40px; --m367-control-pad-x: 16px; --m367-input-height: 40px; --m367-font-size-body: 15px; --m367-font-size-small: 13px; } [data-m367-density="spacious"] { /* shell-width удалена: владелец — shell_geometry (T-1) */ --m367-shell-pad-x: clamp(20px, 4vw, 36px); --m367-section-gap-y: 72px; --m367-section-head-gap: 30px; --m367-grid-gap: 28px; --m367-card-pad: 32px; --m367-card-radius: 24px; --m367-control-height: 52px; --m367-control-pad-x: 24px; --m367-input-height: 52px; --m367-font-size-body: 17px; --m367-font-size-small: 15px; } /* M367_TASKS_OVERLAP_BUTTONS_TOKEN_V0_2_20260701_TOKENS_START */ /* Paired tokens: every action/surface token has an on-* partner. No hardcoded component colors here. */ :root { --m367-surface-card: var(--m367-foundation-surface-raised); --m367-on-surface-card: var(--m367-foundation-text); --m367-card-bg: var(--m367-surface-card); --m367-card-border: var(--m367-foundation-border-soft); } /* M367_TASKS_OVERLAP_BUTTONS_TOKEN_V0_2_20260701_TOKENS_END */ /* M367_TASKS_STICKY_STACK_BREADCRUMB_TOKENS_V0_1_20260701_TOKENS_START */ /* Breadcrumb colors are token-only and inherit from m367 foundation tokens. */ /* M367_TASKS_STICKY_STACK_BREADCRUMB_TOKENS_V0_1_20260701_TOKENS_END */ /* M367_TASKS_BUTTON_MUTED_HOME_TOKENS_V0_2_20260702_TOKENS_START */ /* Tasks buttons use muted homepage action orange; roles stay separated: cta, search button, active category. */ /* M367_TASKS_BUTTON_MUTED_HOME_TOKENS_V0_2_20260702_TOKENS_END */ /* M367_TASKS_BUTTONS_HERO_CHIPS_FROM_SCRATCH_V3_20260705_TOKENS_START */ :root { --m367-brand-title-name: var(--m367-foundation-text); --m367-brand-title-code: var(--m367-button-action-orange); --m367-button-action-orange: var(--m367-accent-muted); --m367-button-action-orange-hover: var(--m367-accent-muted-hover, #e86624); --m367-button-action-orange-rgb: var(--m367-accent-muted-rgb); --m367-button-active-1-bg: #c05018; --m367-button-active-1-bg-hover: #a84615; --m367-button-active-1-border: rgba(var(--m367-button-action-orange-rgb), .72); --m367-button-active-1-border-hover: rgba(var(--m367-button-action-orange-rgb), .86); --m367-button-active-1-text: #fff8f1; --m367-button-active-1-text-hover: #fff; --m367-button-active-1-shadow: none; --m367-button-active-2-bg: linear-gradient(180deg, rgba(var(--m367-button-action-orange-rgb), .26), rgba(var(--m367-button-action-orange-rgb), .17)); --m367-button-active-2-bg-hover: linear-gradient(180deg, rgba(var(--m367-button-action-orange-rgb), .36), rgba(var(--m367-button-action-orange-rgb), .23)); --m367-button-active-2-border: rgba(var(--m367-button-action-orange-rgb), .66); --m367-button-active-2-border-hover: rgba(var(--m367-button-action-orange-rgb), .82); --m367-button-active-2-text: #fff8f1; --m367-button-active-2-text-hover: #fff; --m367-button-active-2-shadow: 0 12px 26px rgba(var(--m367-button-action-orange-rgb), .11); --m367-button-active-2-shadow-hover: 0 14px 30px rgba(var(--m367-button-action-orange-rgb), .17); --m367-button-passive-bg: rgba(var(--m367-button-action-orange-rgb), .045); --m367-button-passive-bg-hover: rgba(var(--m367-button-action-orange-rgb), .10); --m367-button-passive-border: rgba(var(--m367-button-action-orange-rgb), .48); --m367-button-passive-border-hover: rgba(var(--m367-button-action-orange-rgb), .74); --m367-button-passive-text: #fff8f1; --m367-button-passive-text-hover: #fff; --m367-button-passive-shadow: none; } /* M367_TASKS_BUTTONS_HERO_CHIPS_FROM_SCRATCH_V3_20260705_TOKENS_END */ /* M367_SHARED_PAGE_FORM_TOKEN_CONTRACT_V1_20260903 START Owner: shared design-token source. Consumers must not redeclare numeric visual values, colors, typography, borders, radii, shadows, motion or account content measures locally. */ :root { /* Typography */ --m367-font-family-base: var(--ui-font-family-primary, "Open Sans", Arial, sans-serif); --m367-font-size-caption: 12px; --m367-font-size-page-title: clamp(32px, 3vw, 40px); --m367-font-size-component-title: clamp(20px, 1.8vw, 24px); --m367-font-weight-regular: 400; --m367-font-weight-medium: 600; --m367-font-weight-strong: 700; --m367-font-weight-breadcrumb-current: 750; --m367-font-weight-breadcrumb-link: 800; --m367-font-weight-display: 900; --m367-line-height-icon: 1; --m367-line-height-page-title: 1.1; --m367-line-height-heading: 1.2; --m367-line-height-label: 1.35; --m367-line-height-meta: 1.45; --m367-line-height-copy: 1.55; --m367-letter-spacing-page-title: -.02em; --m367-letter-spacing-eyebrow: .08em; /* Page intro and content measures */ --m367-content-form-max-inline: 1006px; --m367-content-copy-max-inline: 72ch; --m367-content-field-min-inline: 260px; --m367-account-form-column-inline: 680px; --m367-account-aside-column-inline: 250px; --m367-account-layout-gap: 76px; --m367-account-flow-top-gap: 46px; --m367-account-mobile-gap: 32px; --m367-account-aside-pad-inline: 22px; --m367-account-aside-border: 2px solid var(--m367-foundation-accent); --m367-page-intro-crumb-title-gap: var(--m367-button-gap); --m367-page-intro-content-gap: var(--m367-section-head-gap); --m367-page-title-color: var(--m367-text-strong); /* Breadcrumb renderer */ --m367-breadcrumb-font-family: var(--m367-font-family-base); --m367-breadcrumb-font-size: var(--m367-font-size-small); --m367-breadcrumb-line-height: var(--m367-line-height-label); --m367-breadcrumb-gap: var(--m367-button-gap); --m367-breadcrumb-link-weight: var(--m367-font-weight-breadcrumb-link); --m367-breadcrumb-current-weight: var(--m367-font-weight-breadcrumb-current); --m367-breadcrumb-link-hover: var(--m367-foundation-accent); /* Form surface and controls */ --m367-color-transparent: transparent; --m367-page-color-scheme: dark; --m367-form-surface-bg: var(--m367-foundation-surface); --m367-form-surface-text: var(--m367-foundation-text); --m367-form-surface-border: var(--m367-border-soft); --m367-form-surface-radius: var(--m367-foundation-radius); --m367-form-surface-shadow: none; --m367-form-section-border: 1px solid var(--m367-action-border-divider); --m367-form-field-gap: 22px; --m367-form-notice-pad-block: 14px; --m367-form-notice-pad-inline: 16px; --m367-form-notice-accent-border: 2px solid var(--m367-foundation-accent); --m367-form-notice-bg: var(--m367-surface-overlay-subtle); --m367-form-notice-border: 1px solid var(--m367-action-border-soft); --m367-form-label-color: var(--m367-text-secondary); --m367-form-label-size: var(--m367-font-size-small); --m367-form-label-weight: var(--m367-font-weight-strong); --m367-form-help-color: var(--m367-foundation-muted); --m367-form-help-size: var(--m367-font-size-caption); --m367-form-link-color: var(--m367-button-action-orange); --m367-form-link-hover: var(--m367-button-action-orange-hover); --m367-input-text: var(--m367-foundation-text); --m367-input-placeholder: var(--m367-text-tertiary); --m367-input-caret: var(--m367-foundation-accent); --m367-input-radius: var(--m367-button-radius); --m367-input-font-weight: var(--m367-font-weight-medium); --m367-input-height: 50px; --m367-input-border-hover: var(--m367-action-border-hover); --m367-input-border-focus: var(--m367-action-border-focus); --m367-textarea-min-block: 92px; --m367-checkbox-size: 16px; --m367-link-underline-offset: 3px; /* Component geometry */ --m367-profile-status-min-inline: 240px; --m367-profile-status-max-inline: 340px; --m367-captcha-column-inline: 184px; --m367-submit-min-inline: 220px; --m367-password-toggle-inline: 100px; --m367-status-icon-size: 54px; --m367-tile-min-block: 184px; --m367-tile-icon-size: 48px; --m367-autofill-cover: 1000px; --m367-visually-hidden-size: 1px; --m367-border-width-hairline: 1px; --m367-border-width-status: 4px; --m367-radius-round: 50%; /* Interaction and states */ --m367-motion-control: 180ms ease; --m367-motion-reduced: .01ms; --m367-motion-iteration-once: 1; --m367-state-error-border: rgba(190, 40, 40, .55); --m367-state-success-border: rgba(39, 132, 82, .55); --m367-button-border: 1px solid var(--m367-color-transparent); --m367-button-line-height: var(--m367-line-height-heading); --m367-button-motion: var(--m367-motion-control); } /* M367_SHARED_PAGE_FORM_TOKEN_CONTRACT_V1_20260903 END */