/* ПРЕМИУМ-КАНОН НИИ «BLACK LABEL» · токены · редакция 5 от 06.11.2026 · собрала Гамма * ред. 5 (06.11.2026, окончательный выбор по слову владельца «окончательно выбрать стиль, шрифты и установить каноны»): * тёмная «обсидиан» #191816 — синтез BETTA-A (хэндофф 06d) на светлоте Claude, приглушённый поднят до 7,2:1; * гарнитуры — «Пара 2» владельца: Source Serif 4 · Fira Sans · JetBrains Mono, без механической вытяжки (К16). * ред. 4 (05.11.2026, Black Label): одна тёмная тема «лак» на все проекты вместо «дерева» юрблока и «ночи» SUTRA * (К11–К13), небо #08060A — только под картиной неба; одна тройка гарнитур (К14); шкала кегля и медленное * движение (К15). ред. 3 (05.11): размытие стекла 12 px (К10). ред. 2 (22.10): статусы светлой (К9). ред. 1 (18.09). * * Слово владельца 05.11.2026: «планировался Bloomberg для астрологии с вау! графикой — нужно разработать * полноценный Black Label канон премиум графики — со своими шрифтами, фичами и фишками… шрифты, тёмная и * светлая темы, а также svg вау! будут едины для всех проектов». Прежде 18.09: «премиум-канон (светлый и * тёмный), чтобы подвести НИИ к единому стандарту и ничего не конфликтовало». * * ТЁМНАЯ ТЕМА ред. 4 подобрана замером, а не на глаз: лестница слоёв и пороги текста — по кадру тёмной темы * приложения Claude (земля #181818, текст 15,4:1, вторичный 8,1:1, приглушённый 6,7:1, слои 1,07/1,14/1,35), * тёплый оттенок и материалы — наши. Таблица сравнения — PREMIUM-CANON.md §«Почему ночь поднята». * * ЧТО БРЕНД МЕНЯТЬ МОЖЕТ (голос): --accent-action · --accent-hot · радиус 0–4 px. ВСЁ ОСТАЛЬНОЕ — общее: * темы, гарнитуры, шкалы, движение, роли акцентов, стекло, SVG. Правила словами — PREMIUM-CANON.md рядом. * Проверка файла: py -3 agents/gamma/tools/canon-matrix.py --check-canon */ /* ── 1. ФУНДАМЕНТ: от темы не зависит ─────────────────────────────────────────────────────── */ :root { --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px; --space-16: 64px; --space-24: 96px; --radius-card: 4px; /* потолок; бренд может меньше (Каутилья 0), больше — нет: 12–14 px отменены 21.08 */ --radius-inner: 2px; --radius-chip: 2px; --radius-pill: 999px; /* Движение. Отклик — 120/220 мс одной кривой. Картина (ред. 4, К15): вход 1200 мс, грахи по одной с шагом 80 мс, своя кривая выхода; фон-ход (тикер неба) — 60 с на круг. prefers-reduced-motion: сразу финал. */ --ease-inout: cubic-bezier(.4, 0, .2, 1); --ease-picture: cubic-bezier(.22, 1, .36, 1); --duration-fast: 120ms; --duration-mid: 220ms; --duration-slow: 600ms; --duration-picture: 1200ms; --stagger-picture: 80ms; --duration-ambient: 60s; /* Гарнитуры (ред. 5, К14): «Пара 2» владельца, одна тройка на все проекты. Титул и долгое чтение — Source Serif 4 (оптический кегль opsz 8–60, капители, IAST; заголовки 500/600, текст 400 от 18 px), текст и интерфейс — Fira Sans (400/500/600; плотные панели — Fira Sans Condensed), числа — JetBrains Mono (400/500). Кириллица полная, OFL 1.1, контуры исходные — без механической вытяжки. Свой хостинг: 02_12_PREMIUM_CANON/fonts или next/font, не CDN. */ --font-display: 'Source Serif 4', Georgia, serif; --font-body: 'Fira Sans', 'Segoe UI', system-ui, sans-serif; --font-body-condensed: 'Fira Sans Condensed', 'Fira Sans', system-ui, sans-serif; /* только плотные панели стола */ --font-mono: 'JetBrains Mono', Consolas, monospace; /* Шкала кегля (ред. 4, К15): база 16, шаг 1,25, привязка к сетке 4 px; крупные — clamp от 375 до 1440. */ --fs-caption: 12px; --fs-small: 14px; --fs-body: 16px; --fs-lead: 20px; --fs-read: 18px; /* антиква в долгом чтении: высота строчных 0,475×18 ≈ Fira 0,527×16 */ --fs-h4: 24px; --fs-h3: 32px; --fs-h2: 40px; --fs-h1: clamp(36px, 2.2vw + 28px, 48px); --fs-display: clamp(44px, 3.5vw + 30px, 64px); --fs-hero: clamp(52px, 5vw + 32px, 80px); --fs-data-hero: clamp(32px, 2vw + 24px, 40px); /* главное число панели, моно */ --lh-tight: 1.1; --lh-snug: 1.25; --lh-body: 1.6; --lh-dense: 1.45; --track-caps: .14em; /* капитель-метка: моно, прописные, 11–12 px */ --track-display: -.01em; /* титул от 40 px */ /* Небо (ред. 4, К11): прежняя ночь SUTRA. Только под картиной неба (колесо, звёзды, «Небо сейчас»), в обеих темах — тёмный остров; под чтением не лежит. Граница неба и страницы — латунный горизонт. */ --surface-sky: #08060A; } /* ── 2. СВЕТЛАЯ ТЕМА «ЛИСТ» (без изменений с ред. 2) ───────────────────────────────────────── Атрибут темы один на весь НИИ: data-theme="light|dark" на . Имена almanac/astra — принятые синонимы (SUTRA, FISHCHUK.PRO), новых не заводить. Без атрибута решает система посетителя. */ :root, [data-theme="light"], [data-theme="almanac"] { color-scheme: light; --surface-page: #EFE9DC; /* глубина: страница темнее карточки темнее фокального слоя — в обеих темах */ --surface-card: #FAF6EE; --surface-focal: #FDFBF6; --text-ink: #241F17; /* заголовки, цифры */ --text-body: #473F31; --text-muted: #6B5F4D; --text-soft: #8A7C68; /* только крупный кегль */ --accent-struct: #B08D4F; /* ЛАТУНЬ = структура: линии, глифы, рамки. Не фон, не мелкий текст */ --accent-struct-text: #7A5E32; /* латунь, когда ею всё-таки пишут */ --accent-emphasis: #B08D4F; /* парадная латунь: герой, покупка; текст на ней — только тёмный */ --text-on-struct: #241F17; --accent-action: #2F6356; /* ПАТИНА = действие: единственный насыщенный цвет экрана. ГОЛОС БРЕНДА */ --accent-action-text: #2C5A4E; --text-on-action: #FDFBF6; --accent-hot: #9B2D1F; /* сургуч: печать, срок, отказ. ГОЛОС БРЕНДА; у кого нет — не использовать */ --text-on-hot: #FDF6E3; --status-good: #37704F; /* ред. 2 (22.10): #3E7D5C давал 4,04:1 на странице — статусом набирают данные (К9) */ --status-warn: #7E5F22; /* ред. 2 (22.10): #B8862F давал 2,68:1 на странице, ниже порога знака (К9) */ --status-bad: #A6402E; --hairline: rgba(176, 141, 79, .26); --hairline-2: rgba(176, 141, 79, .14); --shadow-card: 0 1px 2px rgba(60, 48, 28, .04), 0 6px 20px rgba(60, 48, 28, .07), inset 0 0 0 1px var(--hairline-2); --shadow-card-hover: 0 2px 4px rgba(60, 48, 28, .06), 0 14px 34px rgba(60, 48, 28, .11), inset 0 0 0 1px var(--hairline); --shadow-focal: 0 2px 6px rgba(60, 48, 28, .05), 0 18px 46px rgba(60, 48, 28, .10), inset 0 0 0 1px rgba(176, 141, 79, .18); /* Стекло и свечение в светлой теме не применяются: стекло поверх бумаги спорит с метафорой. */ --glass-bg: transparent; --glass-blur: 0px; --glass-border: transparent; --glow-soft: none; --glow-card: none; --glow-strong: none; } /* ── 3. ТЁМНАЯ ТЕМА «ОБСИДИАН» (ред. 5) ─────────────────────────────────────────────────────────── Тёплый сланец на светлоте Claude (L 20,9 = #191919 у Claude): чёрная точка поднята, белая опущена — против ореола у тонких штрихов. Синтез BETTA-A (хэндофф 06d), приглушённый поднят с #A8A093 (6,9:1) до #ACA497 (7,2:1). */ [data-theme="dark"], [data-theme="astra"] { color-scheme: dark; --surface-page: #191816; /* обсидиан, OKLCH L 20,9 — как у Claude; прежняя ночь #08060A — L 12,8 */ --surface-card: #211F1C; /* 1,08 к странице */ --surface-focal: #2E2B27; /* 1,26 к странице */ --text-ink: #ECEAE4; /* 14,8:1 на странице (Claude 15,0–15,4; Antigravity #FFFFFF — 20,1:1, ореол) */ --text-body: #D5CFC3; /* 11,4 · 10,6 · 9,1 на странице · карточке · фокусе */ --text-muted: #ACA497; /* 7,2 · 6,7 · 5,7. Прежний #968065 на фокусе — 4,32:1, ниже порога (К12) */ --text-soft: #8C857A; /* 4,9 · 4,5 · 3,9 — только крупный кегль, подсказки полей, неактивное */ --accent-struct: #C19A6B; /* латунь: 6,9 на странице · 6,3 на карточке */ --accent-struct-text: #C19A6B; --accent-emphasis: #C19A6B; --text-on-struct: #191816; --accent-action: #8FC4B0; /* мята: 9,0 на странице */ --accent-action-text: #8FC4B0; --text-on-action: #191816; --accent-hot: #9B2D1F; /* сургуч — только заливкой со светлым текстом */ --text-on-hot: #FDF6E3; --status-good: #5A9E6A; --status-warn: #D4A830; --status-bad: #C97070; --hairline: rgba(193, 154, 107, .26); --hairline-2: rgba(193, 154, 107, .14); --shadow-card: 0 4px 20px rgba(0, 0, 0, .45), inset 0 0 0 1px var(--hairline-2); --shadow-card-hover: 0 0 15px rgba(193, 154, 107, .15), inset 0 0 0 1px var(--hairline); --shadow-focal: 0 0 0 1px rgba(193, 154, 107, .12), 0 6px 28px rgba(0, 0, 0, .50); /* Три правила стекла: только над содержательным фоном (небо, картина) · не более одного слоя в поле зрения · текст на стекле — только --text-ink. Размытие 12 px — ред. 3 (К10). */ --glass-bg: rgba(33, 31, 28, .62); --glass-blur: 12px; --glass-border: rgba(193, 154, 107, .18); --glow-soft: 0 0 5px rgba(193, 154, 107, .20); --glow-card: 0 0 15px rgba(193, 154, 107, .15); --glow-strong: 0 0 25px rgba(193, 154, 107, .50); } /* Первый визит без выбора: тема = система посетителя (слово владельца 18.09.2026). */ @media (prefers-color-scheme: dark) { :root:not([data-theme]) { color-scheme: dark; --surface-page: #191816; --surface-card: #211F1C; --surface-focal: #2E2B27; --text-ink: #ECEAE4; --text-body: #D5CFC3; --text-muted: #ACA497; --text-soft: #8C857A; --accent-struct: #C19A6B; --accent-struct-text: #C19A6B; --accent-emphasis: #C19A6B; --text-on-struct: #191816; --accent-action: #8FC4B0; --accent-action-text: #8FC4B0; --text-on-action: #191816; --accent-hot: #9B2D1F; --text-on-hot: #FDF6E3; --status-good: #5A9E6A; --status-warn: #D4A830; --status-bad: #C97070; --hairline: rgba(193, 154, 107, .26); --hairline-2: rgba(193, 154, 107, .14); --shadow-card: 0 4px 20px rgba(0, 0, 0, .45), inset 0 0 0 1px var(--hairline-2); --shadow-card-hover: 0 0 15px rgba(193, 154, 107, .15), inset 0 0 0 1px var(--hairline); --shadow-focal: 0 0 0 1px rgba(193, 154, 107, .12), 0 6px 28px rgba(0, 0, 0, .50); --glass-bg: rgba(33, 31, 28, .62); --glass-blur: 12px; --glass-border: rgba(193, 154, 107, .18); --glow-soft: 0 0 5px rgba(193, 154, 107, .20); --glow-card: 0 0 15px rgba(193, 154, 107, .15); --glow-strong: 0 0 25px rgba(193, 154, 107, .50); } } /* ── 4. СЛОЙ СООТВЕТСТВИЯ: прежние короткие имена юрблока ──────────────────────────────────── Сайты не переписываются: старое имя читает значение контракта. Новый код пишется только именами контракта. Имени --accent в каноне НЕТ: у трёх брендов оно значит три разные вещи (латунь у ИСС и Каутильи, мята у sudfact) — при переносе каждый случай разводится на action, struct или emphasis. */ :root { --bg: var(--surface-page); --surface: var(--surface-card); --surface-2: var(--surface-focal); --text: var(--text-ink); --muted: var(--text-muted); --border: var(--hairline); --brass: var(--accent-struct); --mint: var(--accent-action); }