/* Пятая пара, выбор владельца 07.09: IBM Plex Serif — заголовки, IBM Plex Sans — текст. Файлы свои, лежат рядом. Собрано departments/06-lendingi/work/zavesti_shrifty.py. */ @font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fuentes/IBMPlexSans-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116} @font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fuentes/IBMPlexSans-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/fuentes/IBMPlexSans-400-latin.woff2) format('woff2');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:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/fuentes/IBMPlexSans-600-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116} @font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/fuentes/IBMPlexSans-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/fuentes/IBMPlexSans-600-latin.woff2) format('woff2');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:'IBM Plex Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/fuentes/IBMPlexSerif-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116} @font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/fuentes/IBMPlexSerif-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/fuentes/IBMPlexSerif-400-latin.woff2) format('woff2');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:'IBM Plex Serif';font-style:normal;font-weight:600;font-display:swap;src:url(/fuentes/IBMPlexSerif-600-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116} @font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:600;font-display:swap;src:url(/fuentes/IBMPlexSerif-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF} @font-face{font-family:'IBM Plex Serif';font-style:normal;font-weight:600;font-display:swap;src:url(/fuentes/IBMPlexSerif-600-latin.woff2) format('woff2');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} :root{ --color-bg:#ffffff; --color-fg:#02090d; --color-muted:#6b7075; --color-accent:#02090d; --color-accent-fg:#ffffff; --color-surface:#f6f6f4; --color-line:#e1e1e1; --font-heading:'IBM Plex Serif',Georgia,serif; --font-body:'IBM Plex Sans',system-ui,sans-serif; --size-h1:2.5rem; --size-h2:1.75rem; --size-body:1.0625rem; --radius:10px; --space:1.25rem; --maxw:1200px; } /* ТОКЕНЫ · дизайн-система 03 · один источник правды. Hex живёт только здесь. Имена совпадают с переменными документа Pencil. Числа записаны парой tel/desk и переключаются одним медиазапросом. */ :root { /* цвет — 16 значений, из них 10 посчитаны по 42 кадрам чайного дома */ --cacao: #240D05; --corteza: #5B220B; --granate: #520A0E; --terra: #912D12; --canela: #9F5622; --cobre: #BE6B37; --arena: #DD9B62; --ambar: #DB9C3E; --arcilla: #A78673; --tabaco: #6B4C30; --crema: #DFC5AC; --papel: #FFF0D6; --blanco: #FFFFFF; --verde: #33351D; --verde-claro: #C3CA7A; --whatsapp:#25D366; /* роли — тон дня */ --fon: var(--papel); --pov: var(--crema); --tekst-cvet: var(--cacao); --zag-cvet: var(--granate); --tusk: var(--tabaco); --akcent: var(--terra); --na-akcente: var(--papel); --granica-cvet: var(--tabaco); /* гарнитуры: латиница из брендбука, кириллица — замена с проверенной cmap */ --shrift-zag: "Darker Grotesque", "Alumni Sans", "Trebuchet MS", sans-serif; --shrift-tekst: "Alumni Sans", "Trebuchet MS", system-ui, sans-serif; --shrift-mono: "PT Mono", ui-monospace, "SFMono-Regular", monospace; /* размеры — пара телефон / десктоп */ --tel-h1: 34px; --desk-h1: 56px; --tel-h2: 24px; --desk-h2: 34px; --tel-h3: 18px; --desk-h3: 21px; --tel-tekst: 16px; --desk-tekst: 17px; --tel-pod: 15px; --desk-pod: 20px; /* лид первого экрана: рядом с h1 56 px. На телефоне 15, а не 16: просили поднять лид на 1440, а каждый лишний пиксель на 375 уходит из запаса до сгиба. */ --tel-melkoe: 13px; --desk-melkoe: 14px; --tel-mono: 12px; --desk-mono: 13px; --tel-shag: 12px; --desk-shag: 16px; --tel-vozduh: 32px; --desk-vozduh: 56px; --tel-pole: 16px; --desk-pole: 24px; --tel-pole-k: 12px; --desk-pole-k: 16px; --tel-kolonok: 2; --desk-kolonok: 4; --h1: var(--tel-h1); --h2: var(--tel-h2); --h3: var(--tel-h3); --tekst: var(--tel-tekst); --melkoe: var(--tel-melkoe); --mono: var(--tel-mono); --pod: var(--tel-pod); --shag: var(--tel-shag); --vozduh: var(--tel-vozduh); --pole: var(--tel-pole); --pole-k: var(--tel-pole-k); --kolonok: var(--tel-kolonok); --granica: 1px; --radius: 2px; } /* Стенд ставит телефон рядом с десктопом. Десктопные значения попадают на body от широкого контейнера страницы и наследуются вниз — поэтому узкая колонка обязана вернуть себе телефонные, иначе на «телефоне» окажется сетка десктопа. */ .tema { --h1: var(--tel-h1); --h2: var(--tel-h2); --h3: var(--tel-h3); --tekst: var(--tel-tekst); --melkoe: var(--tel-melkoe); --mono: var(--tel-mono); --pod: var(--tel-pod); --shag: var(--tel-shag); --vozduh: var(--tel-vozduh); --pole: var(--tel-pole); --pole-k: var(--tel-pole-k); --kolonok: var(--tel-kolonok); --okno-pole: var(--tel-okno-pole); --polosa: var(--tel-polosa); --shapka: var(--tel-shapka); } /* Переключатель один на всё: ширина КОНТЕЙНЕРА, не окна. Порог 900, а не 1000: колонка десктопа на стенде выходит ровно около 1000 и на пороге 1000 срывалась обратно в телефонную сетку. 900 разводит 401 и ~1000 без спора. Контейнер объявлен на html, поэтому правило действует и на боевой странице, и в стенде, где телефон и десктоп стоят рядом в одном окне и медиазапрос врал бы. */ html { container-type: inline-size; container-name: stend; } @container stend (min-width: 900px) { body, .tema { --h1: var(--desk-h1); --h2: var(--desk-h2); --h3: var(--desk-h3); --tekst: var(--desk-tekst); --melkoe: var(--desk-melkoe); --mono: var(--desk-mono); --pod: var(--desk-pod); --shag: var(--desk-shag); --vozduh: var(--desk-vozduh); --pole: var(--desk-pole); --pole-k: var(--desk-pole-k); --kolonok: var(--desk-kolonok); } } /* тон вечера — переключается на блоке, не на странице */ .vecher { --fon: var(--cacao); --pov: var(--corteza); --tekst-cvet: var(--crema); --zag-cvet: var(--papel); --tusk: var(--arena); --akcent: var(--ambar); --na-akcente: var(--cacao); --granica-cvet: var(--arcilla); } /* --- дополнено на шаге 3: то, чего первому экрану не требовалось --- */ :root { /* тон трав и матчи — включается блоком, с тёплым не смешивается */ --verde-fon: var(--verde); --verde-tekst: var(--verde-claro); /* состояния */ /* силуэт чайного листа для молчащей заглушки D-07. Держим в токенах, потому что это часть фирменного языка, а не правило одной детали. */ --list-mask: url('data:image/svg+xml;utf8,'); /* Знак TEJA VUH для заглушки «фото нет». Решение владельца 07.09: «Заглушку ставим на номер 4» — знак на 34 % клетки, непрозрачность 22 %, подложка тонирована видом товара на 8 %. Вектор взят из библиотеки как есть (`firmenny-stil/logo/svg/znak-stopka.svg`), не перерисован; это тот же знак, что стоит в шапке сайта. Живёт в токенах, а не в правиле детали: часть фирменного языка. Голый знак без подписи здесь законен — README логотипа разрешает его там, где подпись физически не помещается, а клетка кадра на телефоне 110–180 px. Читается маской, поэтому цвет внутри не важен. */ --znak-teja: url("data:image/svg+xml;utf8,%3Csvg fill='black' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 272.95 190.01'%3E %3Cpath fill-rule='evenodd' d='M95.68 125.83C90.95 141.53 85.76 169.93 75.62 169.93C69.2 169.93 62.62 144.33 58.42 130.99C57.44 128.2 56.37 127.01 55.12 124.37C54.04 122.1 43.37 122.74 41.33 123.84C42.14 134.04 44 140.27 47.15 149.81C48.2 152.98 49.39 156.11 50.7 159.16C56.19 170.94 68.04 189.23 73 189.23L77.97 187.82C91.78 175.81 103.98 160.98 109.13 127.71C109.5 125.35 97.58 119.52 95.68 125.83ZM175.05 122.29C167.4 120.03 168.11 136.72 159.72 147.04C158.14 149.72 156.44 152.36 154.59 154.94C150.91 160.08 141.76 167.83 136.86 172.35C127.97 158.49 128.24 146.1 131.09 124.27C131.33 122.39 119.26 120.75 117.67 123.01C106.52 147.9 125.83 188.37 132.61 188.87C132.61 188.87 135.17 189.04 136.67 188.44C138.17 187.85 156.15 174.83 161.61 168.5C163.43 166.39 165.17 164.23 166.81 162.02C174.58 151.83 184 134.15 183.74 125.05C183.67 122.66 176.98 122.86 175.05 122.29ZM268.49 98.85C225.83 96.6 183.61 126.35 176.47 171.98C175.77 174.73 175.19 177.5 174.74 180.31C174.28 183.12 173.95 185.95 173.74 188.81C173.74 188.81 185.64 190.01 187.71 188.31C190.22 186.25 190.29 182.37 190.92 179.11C193.06 163.24 194.84 152.98 205.81 138.99C213.09 144.97 225.94 168.16 227.98 188.38C228.97 189.5 238.01 189.5 239.28 188.38C241.59 167.97 235.24 155.33 224.82 138.06C221.79 133.04 215.82 127.97 215.82 127.97C216.87 125.99 226.59 119.68 230.02 118.28C241.24 113.66 249.65 114.08 260.27 112.39C263.91 111.81 265.46 111.72 268.23 110.04C270.09 108.61 270.76 98.85 268.49 98.85ZM152.88 123.58C149.14 119.67 141.56 121.75 140.22 128.94C139.46 134.58 139.44 144.29 140.67 147C141.48 148.78 149.78 148.19 150.67 147.1C151.55 146.01 152.46 140.96 152.39 134.72C152.81 130.14 154.12 126.3 152.88 123.58ZM218.12 83.98C224.96 52 235.18 41.17 242.93 32.81C250 38.51 254.98 56.32 259.81 83.98C259.81 83.98 263.32 83.98 265.5 84.26L272.95 84.26C272.95 80.99 272.79 77.74 272.48 74.54C272.12 70.61 271.5 66.39 270.64 62.09C266.36 40.6 256.09 17.15 243.39 19.12C222.28 21.48 205.86 55.69 204.69 83.98C209.38 83.98 216.95 85.16 218.12 83.98ZM199.32 14.81C203.59 14.45 206.84 13.12 207.12 6.85C207.32 2.28 204.6 0 199 0C193.23 0 192.98 3.33 193.07 8C193.17 12.66 195.04 15.16 199.32 14.81ZM141.14 60.47C142.26 61.67 147.92 60.47 152.15 59.96C158.01 59.95 167.28 59.85 167.28 59.85C169.2 57.06 170.79 48.74 168.33 48.5C159.06 49.32 135.48 43.71 141.14 60.47ZM244.41 83.54C244.41 83.54 244.72 76.82 244.92 70.06C245.62 65.18 247.11 58.69 245.85 57.35C227.85 50.28 233.22 75.25 232.14 83.44C232.42 84.78 239.89 83.32 244.41 83.54ZM82.5 58.67C81.11 61.26 77.15 68.3 75.47 70.75C73.78 73.21 69.9 77.58 67.92 79.86C65.95 77.58 61.89 72.75 60.21 70.29C58.52 67.84 56.98 65.3 55.6 62.71C49.38 53.68 43.92 39.12 50.48 33.9C53.15 31.32 56.99 30.37 61.39 30.22C61.76 43.24 57.26 60.99 74.23 54.9C75.53 53.6 74.23 47.06 73.67 42.17C73.67 37.88 73.63 33.62 73.59 31.06C78.57 31.68 83.64 32.4 88.23 32.4C87.13 43.9 87.74 48.59 82.5 58.67ZM123.96 99.38C123.96 99.38 119.33 100 118.37 101.36C117.42 102.71 118.15 109.86 119.19 111.83C120.23 113.79 121.27 113.89 121.64 113.87C151.39 112.02 175.94 101.35 191.81 78.53C194.11 75.23 196.19 71.78 198.06 68.2C205.7 54.15 209.1 37.96 209.22 21.28C209.22 20.99 209.06 20.28 208.06 20.47C206.11 21.04 204.7 21.11 201.91 21.37C199.28 21.73 198.73 21.89 197.69 21.99C194.86 22.26 195.23 26.44 195.23 26.44C195.73 44.43 192.27 64.07 176.45 70.86C160.63 77.64 139.4 65.9 124.71 54.6C140.2 42.81 159.64 39.76 179.84 35.62C181.08 35.33 180.31 21.75 173.94 23.54C159.54 26.8 154.23 30.65 144.99 30.18C135.45 29.71 129.18 29.03 123.47 27.58C117.8 26.25 113.46 25.36 108.21 24C103.45 22.93 99.23 21.75 95.47 20.96C69.17 15.5 37.37 19.34 16.53 30.2C13.43 32.06 10.4 34.11 7.48 36.34C4.56 38.56 0 41.91 1.14 43.83C2.28 45.76 5.26 49.74 7.1 50.51C8.95 51.28 12.96 48.65 14.95 47.07C16.93 45.49 18.98 44.01 21.09 42.62C25.28 40.39 28.58 36.89 34.04 35.84C34.62 42.63 36.07 46.3 37.25 52.06C37.96 54.75 38.81 56.27 39.77 58.88C44.61 71.94 52.45 83.92 62.99 94.01C62.99 94.01 65.86 97.42 68.33 97.42C70.75 97.42 73.64 94.01 73.64 94.01C82.06 85.94 88.77 76.66 93.59 66.58C94.79 64.06 95.88 61.49 96.85 58.88C97.9 55.11 98.5 52.57 99.58 48.75C100.66 44.93 101.68 39.35 101.68 35.16C106.37 36.09 111.56 37.34 117.05 38.08L125.89 38.85C118.78 42.41 114.72 44.46 110.57 48.5C110.57 48.5 106.89 53.05 106.86 55.22C106.83 57.23 111.27 60.18 111.27 60.18C125.92 74.83 144.55 84.03 164.72 86.81C152.05 97.11 141.48 98.49 123.96 99.38Z'/%3E %3C/svg%3E"); /* Слои страницы. Держим числа в одном месте: до 06.09 они жили порознь у детали полосы (30) и у слоя Лендингов, и окно сорта открывалось ПОД шапкой сайта — покупатель видел заголовок страницы поверх карточки. */ --sloy-shapka: 20; /* липкая шапка сайта */ --sloy-polosa: 30; /* липкая полоса заказа */ --sloy-shtora: 40; /* затемнение под окном */ --sloy-okno: 41; /* окно сорта и окно корзины */ /* Флаг Перу — не фирменный цвет, а факт о стране, поэтому живёт рядом с остальными hex, но отдельной парой: его нельзя менять вместе с гаммой. */ --flag-pe: #D91023; --flag-pe-belyy: #FFFFFF; --vykl: .45; /* выключенный элемент */ --kolco: 2px; /* толщина кольца фокуса */ --ten: 0 2px 0 0 var(--granica-cvet); /* размеры, которые появились вместе с окнами и полосами */ --tel-okno-pole: 16px; --desk-okno-pole: 24px; --tel-polosa: 64px; --desk-polosa: 72px; /* липкая полоса заказа */ /* сколько занято ПОД липкой полосой (языки, панель браузера в приложении). Ставится на `body` слоем страницы; полоса и круглая кнопка WhatsApp считают от неё обе, поэтому не могут наехать друг на друга. */ --polosa-niz: 0px; --tel-shapka: 48px; --desk-shapka: 48px; /* потолок владельца — 48, подняли по его слову 05.09 */ /* D-24 · монетки переключателя тем: чем тема ВЫГЛЯДИТ. Три пары стоят рядом на любой теме, поэтому берутся из цветов бренда напрямую, а не из ролей текущей темы — роли переставляются, а монетка Fiesta обязана оставаться янтарной и на светлой странице, и на тёмной. Контраст точки к своему фону: 14,91 · 6,27 · 7,79 — все выше 3. */ --tema-a-fon: var(--blanco); --tema-a-tochka: var(--granate); --tema-b-fon: var(--ambar); --tema-b-tochka: var(--granate); --tema-c-fon: var(--cacao); --tema-c-tochka: var(--ambar); /* Обводка монетки — своя у каждой, а не `--granica-cvet` темы: в теме Fiesta шапка сама янтарная, и янтарная монетка на ней пропадала — видно было только точку (снимок `shots/D-24-tema-b.jpg` до правки). Контраст обводки к своему фону: 7,77 · 7,79 · 7,88. */ --tema-a-obvod: var(--tabaco); --tema-b-obvod: var(--cacao); --tema-c-obvod: var(--arena); --okno-pole: var(--tel-okno-pole); --polosa: var(--tel-polosa); --shapka: var(--tel-shapka); } @container stend (min-width: 900px) { body, .tema { --okno-pole: var(--desk-okno-pole); --polosa: var(--desk-polosa); --shapka: var(--desk-shapka); } } /* стенд ставит телефон и десктоп рядом в одном окне — медиазапрос там врёт. Те же пары переключаются по ширине контейнера. */ @container stend (min-width: 900px) { .tema { --h1: var(--desk-h1); --h2: var(--desk-h2); --h3: var(--desk-h3); --tekst: var(--desk-tekst); --melkoe: var(--desk-melkoe); --mono: var(--desk-mono); --pod: var(--desk-pod); --shag: var(--desk-shag); --vozduh: var(--desk-vozduh); --pole: var(--desk-pole); --pole-k: var(--desk-pole-k); --kolonok: var(--desk-kolonok); --okno-pole: var(--desk-okno-pole); --polosa: var(--desk-polosa); --shapka: var(--desk-shapka); } } /* ============ ЦВЕТ ПО ТИПУ ЧАЯ · шаг 3а ============ Восемь типов китайской классификации плюс два японских порошковых. Базовый цвет подобран числом: контраст к фону тона ≥ 3, текст на плашке ≥ 4,5. Остальные три роли считаются ОТ БАЗОВОГО через color-mix, руками не подбираются. Цвет типа — метка, а не тема: он живёт на плашке, линии и подложке. */ :root { --tipo-blanco: #8C8578; --tipo-blanco-texto: var(--cacao); --tipo-verde: #5C7638; --tipo-verde-texto: var(--papel); --tipo-amarillo: #B4830B; --tipo-amarillo-texto: var(--cacao); --tipo-azul: #1F6E8C; --tipo-azul-texto: var(--papel); --tipo-rojo: #B33A24; --tipo-rojo-texto: var(--papel); --tipo-oscuro: #4A2C17; --tipo-oscuro-texto: var(--papel); --tipo-matcha: #6B983C; --tipo-matcha-texto: var(--cacao); --tipo-hojicha: #A9713E; --tipo-hojicha-texto: var(--cacao); /* доля подложки и линии — одна на все типы, поэтому «синий» и «красный» на полке весят одинаково */ /* Семь семейств глазури — цвета посчитаны ИЗ ФОТОГРАФИЙ 148 чашек, а не выбраны: `heavy/foto/2026-09-10/seriya-2/cveta-chashek.json` хранит тон, светлоту и насыщенность каждой чашки, здесь — среднее по семейству. Поэтому кружок в ряду фильтра показывает настоящий цвет полки, а не наше представление о нём. Число чашек: белые 10 · бирюзовые 32 · синие 22 · красные 3 · охра 23 · коричневые 33 · тёмные 25. */ --glaz-belye: #B7B1A0; --glaz-biryuzovye: #577E5A; --glaz-sinie: #3E4668; --glaz-krasnye: #644540; --glaz-ohra: #998462; --glaz-korichnevye:#68624B; --glaz-temnye: #4C443A; --tipo-linia-dolya: 40%; --tipo-fon-dolya: 12%; } /* Тон вечера: три типа не проходят контраст к тёмному фону в дневном значении. Меняются только они — остальные пять одни и те же в обоих тонах. */ .vecher { --tipo-amarillo: #B8860B; --tipo-oscuro: #745D4C; --tipo-matcha: #6F9E3F; } /* ============ ТРИ ДУХА · шаг 3а-3 ============ Владелец 05.09.2026: «Да, три духа на весь сайт». Гамма — это не доза краски на карточке, а перестановка цветов бренда по ролям на всей странице. Роли (--fon, --pov, --akcent…) переставляются в `parts.css`, здесь лежит только то, чего в шестнадцати цветах не было: три палитры типов чая и седьмая ступень шкалы, которой системе не хватало (протокол 06, 2-б, №6). Каждый дух красит типы своим приёмом, поэтому и палитры разные: A метит линией — берёт базовую; B заливает поверхность — берёт плотную; C светит на тёмном — берёт светлую. Все числа посчитаны, а не подобраны: линия к фону ≥ 3, текст на заливке ≥ 4,5, в обоих тонах. */ :root { /* седьмая ступень шкалы: хэйча. Была дырой — точка красилась ничем */ --tipo-heicha: #3E2A20; --tipo-heicha-texto: var(--papel); /* B «Fiesta» · тип красит поверхность целиком, поэтому цвет плотный */ --fiesta-blanco: #9A7C45; --fiesta-verde: #4F7A2A; --fiesta-amarillo: #B07800; --fiesta-azul: #17607F; --fiesta-rojo: #B8341A; --fiesta-oscuro: #6B3A16; --fiesta-matcha: #5E9B2E; --fiesta-hojicha: #9E5A18; --fiesta-heicha: #3A2A22; /* C «Casa» · тип светит на тёмном, поэтому цвет светлый и тёплый. Тот же набор служит духу B в тоне вечера — на какао он читается. */ --casa-blanco: #C9B183; --casa-verde: #7FA347; --casa-amarillo: #D9A62E; --casa-azul: #4E93AE; --casa-rojo: #D96A4A; --casa-oscuro: #A98467; --casa-matcha: #9CC45E; --casa-hojicha: #C89A63; --casa-heicha: #9C8672; } /* хэйча в тоне вечера — тёмно-коричневый на какао не виден, светлеет */ .vecher { --tipo-heicha: #9C8672; --tipo-heicha-texto: var(--cacao); } :root{ --color-bg:var(--fon); --color-fg:var(--tekst-cvet); --color-muted:var(--tusk); --color-accent:var(--akcent); --color-accent-fg:var(--na-akcente); --color-surface:var(--pov); --color-line:var(--granica-cvet); } *{box-sizing:border-box} body{margin:0;background:var(--color-bg);color:var(--color-fg);font:1.0625rem/1.6 var(--font-body);padding-bottom:3rem} a{color:inherit} .obolochka{max-width:46rem;margin:0 auto;padding:0 1rem} header.shapka{border-bottom:1px solid var(--color-line);padding:.9rem 0;margin-bottom:1.5rem} header.shapka .obolochka{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap} .logo{font-family:var(--font-heading);font-size:1.25rem;text-decoration:none;letter-spacing:.02em} .shapka nav{display:flex;gap:1rem;font-size:.95rem;flex-wrap:wrap} .shapka nav a{text-decoration:none;color:var(--color-muted)} .shapka nav a:hover{color:var(--color-fg)} .yazyki{display:flex;gap:.5rem;font-size:.85rem} .yazyki a[aria-current]{color:var(--color-fg)} .kroshki{font-size:.85rem;color:var(--color-muted);margin:0 0 1rem} h1{font-family:var(--font-heading);font-weight:500;font-size:2rem;line-height:1.15;margin:0 0 .4rem;text-wrap:balance} h2{font-family:var(--font-heading);font-weight:500;font-size:1.25rem;margin:2rem 0 .5rem} .data{color:var(--color-muted);font-size:.85rem;margin:0 0 1.5rem} mark.mesto{background:#fff3bf;color:#7a5b00;padding:.1rem .45rem;border-radius:.3rem; border:1px dashed #d8b400;font-size:.95em;white-space:normal} footer.podval{border-top:1px solid var(--color-line);margin-top:3rem;padding-top:1.2rem; font-size:.9rem;color:var(--color-muted)} footer.podval a{color:inherit} footer.podval .ryad{display:flex;gap:.9rem;flex-wrap:wrap;margin-bottom:.6rem}