/* Start:/local/templates/.default/fonts/fonts-site.css?179256294318511*/
/* Шрифты сайта mingpan.ru — сборка python design/fonts/rebuild.py --site.
Пути относительно этого файла. font-display: swap.
Одно подмножество на насыщенность (латиница, кириллица, типографика, ₽, №, пиньинь);
unicode-range каждого файла — его фактический cmap.
Noto Serif SC 400/700 — текст набора скилла (страница разбора); сайт набирает знаки только 900:
noto-serif-sc-900 — знаки макетов и главной, noto-serif-sc-900-text — словарь, характеры, проба, бесплатный разбор.
Ниже — запасные семейства с local() и поправками метрик: пока woff2 не пришёл,
системный шрифт занимает столько же места, сколько займёт веб-шрифт.
Печать 命盘 (seal-minpan.svg) вставляется в разметку инлайном или как
, не через ![]()
:
цвет плашки — currentColor, в ![]()
она будет чёрной. Наклон −2° — в CSS.
Стеки для tokens.css:
--f-text: "Golos Text", "Golos Fallback Arial", "Golos Fallback Roboto", Arial, sans-serif;
--f-display: "Old Standard TT", "Old Standard Fallback Times", "Old Standard Fallback Noto", "Times New Roman", serif;
--f-han: "Noto Serif SC", "Songti SC", "SimSun", serif;
Порядок: Arial (Windows, macOS, iOS; на Linux — метрически равные Liberation Sans/Arimo),
затем Roboto (Android, ChromeOS); у заголовков — Times New Roman (Liberation Serif/Tinos),
затем Noto Serif (Android 7+). Где local() не нашёлся, семейство пропускается. */
@font-face {
font-family: "Golos Text";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("/local/templates/.default/fonts/golos-text-400.woff2") format("woff2");
unicode-range: U+0020-007E, U+00A0, U+00A7, U+00A9, U+00AB, U+00AD, U+00B0-00B1, U+00B7, U+00BB, U+00C0-00C1, U+00C8-00C9, U+00CC-00CD, U+00D2-00D3, U+00D7, U+00D9-00DA, U+00DC, U+00E0-00E1, U+00E8-00E9, U+00EC-00ED, U+00F2-00F3, U+00F9-00FA, U+00FC, U+0100-0101, U+0112-0113, U+011A-011B, U+012A-012B, U+014C-014D, U+016A-016B, U+0300-0301, U+0304, U+0308, U+030C, U+0401-040C, U+040E-044F, U+0451-045C, U+045E-045F, U+0490-0491, U+04B0-04B1, U+2009, U+2010-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+202F, U+2039-203A, U+20BD, U+2116, U+2190-2193, U+2212, U+2248, U+2264-2265;
}
@font-face {
font-family: "Golos Text";
font-style: normal;
font-weight: 500;
font-display: swap;
src: url("/local/templates/.default/fonts/golos-text-500.woff2") format("woff2");
unicode-range: U+0020-007E, U+00A0, U+00A7, U+00A9, U+00AB, U+00AD, U+00B0-00B1, U+00B7, U+00BB, U+00C0-00C1, U+00C8-00C9, U+00CC-00CD, U+00D2-00D3, U+00D7, U+00D9-00DA, U+00DC, U+00E0-00E1, U+00E8-00E9, U+00EC-00ED, U+00F2-00F3, U+00F9-00FA, U+00FC, U+0100-0101, U+0112-0113, U+011A-011B, U+012A-012B, U+014C-014D, U+016A-016B, U+0300-0301, U+0304, U+0308, U+030C, U+0401-040C, U+040E-044F, U+0451-045C, U+045E-045F, U+0490-0491, U+04B0-04B1, U+2009, U+2010-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+202F, U+2039-203A, U+20BD, U+2116, U+2190-2193, U+2212, U+2248, U+2264-2265;
}
@font-face {
font-family: "Golos Text";
font-style: normal;
font-weight: 600;
font-display: swap;
src: url("/local/templates/.default/fonts/golos-text-600.woff2") format("woff2");
unicode-range: U+0020-007E, U+00A0, U+00A7, U+00A9, U+00AB, U+00AD, U+00B0-00B1, U+00B7, U+00BB, U+00C0-00C1, U+00C8-00C9, U+00CC-00CD, U+00D2-00D3, U+00D7, U+00D9-00DA, U+00DC, U+00E0-00E1, U+00E8-00E9, U+00EC-00ED, U+00F2-00F3, U+00F9-00FA, U+00FC, U+0100-0101, U+0112-0113, U+011A-011B, U+012A-012B, U+014C-014D, U+016A-016B, U+0300-0301, U+0304, U+0308, U+030C, U+0401-040C, U+040E-044F, U+0451-045C, U+045E-045F, U+0490-0491, U+04B0-04B1, U+2009, U+2010-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+202F, U+2039-203A, U+20BD, U+2116, U+2190-2193, U+2212, U+2248, U+2264-2265;
}
@font-face {
font-family: "Golos Text";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url("/local/templates/.default/fonts/golos-text-700.woff2") format("woff2");
unicode-range: U+0020-007E, U+00A0, U+00A7, U+00A9, U+00AB, U+00AD, U+00B0-00B1, U+00B7, U+00BB, U+00C0-00C1, U+00C8-00C9, U+00CC-00CD, U+00D2-00D3, U+00D7, U+00D9-00DA, U+00DC, U+00E0-00E1, U+00E8-00E9, U+00EC-00ED, U+00F2-00F3, U+00F9-00FA, U+00FC, U+0100-0101, U+0112-0113, U+011A-011B, U+012A-012B, U+014C-014D, U+016A-016B, U+0300-0301, U+0304, U+0308, U+030C, U+0401-040C, U+040E-044F, U+0451-045C, U+045E-045F, U+0490-0491, U+04B0-04B1, U+2009, U+2010-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+202F, U+2039-203A, U+20BD, U+2116, U+2190-2193, U+2212, U+2248, U+2264-2265;
}
@font-face {
font-family: "Old Standard TT";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("/local/templates/.default/fonts/old-standard-tt-400.woff2") format("woff2");
unicode-range: U+0020-007E, U+00A0, U+00A7, U+00A9, U+00AB, U+00AD, U+00B0-00B1, U+00B7, U+00BB, U+00C0-00C1, U+00C8-00C9, U+00CC-00CD, U+00D2-00D3, U+00D7, U+00D9-00DA, U+00DC, U+00E0-00E1, U+00E8-00E9, U+00EC-00ED, U+00F2-00F3, U+00F9-00FA, U+00FC, U+0100-0101, U+0112-0113, U+011A-011B, U+012A-012B, U+014C-014D, U+016A-016B, U+0300-0301, U+0304, U+0308, U+030C, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2009-200A, U+2010, U+2012-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+2032-2033, U+2039-203A, U+20BD, U+2116, U+2190-2193, U+2212, U+2248, U+2264-2265;
}
@font-face {
font-family: "Old Standard TT";
font-style: italic;
font-weight: 400;
font-display: swap;
src: url("/local/templates/.default/fonts/old-standard-tt-400italic.woff2") format("woff2");
unicode-range: U+0020-007E, U+00A0, U+00A7, U+00A9, U+00AB, U+00AD, U+00B0-00B1, U+00B7, U+00BB, U+00C0-00C1, U+00C8-00C9, U+00CC-00CD, U+00D2-00D3, U+00D7, U+00D9-00DA, U+00DC, U+00E0-00E1, U+00E8-00E9, U+00EC-00ED, U+00F2-00F3, U+00F9-00FA, U+00FC, U+0100-0101, U+0112-0113, U+011A-011B, U+012A-012B, U+014C-014D, U+016A-016B, U+0300-0301, U+0304, U+0308, U+030C, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2009-200A, U+2010, U+2012-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+2032-2033, U+2039-203A, U+20BD, U+2116, U+2190-2193, U+2212, U+2248, U+2264-2265;
}
@font-face {
font-family: "Old Standard TT";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url("/local/templates/.default/fonts/old-standard-tt-700.woff2") format("woff2");
unicode-range: U+0020-007E, U+00A0, U+00A7, U+00A9, U+00AB, U+00AD, U+00B0-00B1, U+00B7, U+00BB, U+00C0-00C1, U+00C8-00C9, U+00CC-00CD, U+00D2-00D3, U+00D7, U+00D9-00DA, U+00DC, U+00E0-00E1, U+00E8-00E9, U+00EC-00ED, U+00F2-00F3, U+00F9-00FA, U+00FC, U+0100-0101, U+0112-0113, U+011A-011B, U+012A-012B, U+014C-014D, U+016A-016B, U+0300-0301, U+0304, U+0308, U+030C, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2009-200A, U+2010, U+2012-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+2032-2033, U+2039-203A, U+20BD, U+2116, U+2190-2193, U+2212, U+2248, U+2264-2265;
}
@font-face {
font-family: "Noto Serif SC";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("/local/templates/.default/fonts/noto-serif-sc-400.woff2") format("woff2");
unicode-range: U+0020, U+00A0, U+4E01, U+4E03, U+4E09-4E0B, U+4E11, U+4E13, U+4E19, U+4E2D, U+4E34, U+4E3B, U+4E59, U+4E7E, U+4E8C, U+4E94, U+4EA1, U+4EA5, U+4EBA, U+4EC6, U+4ECE, U+4EE4, U+4F0F, U+4F11, U+4F1A, U+4F24, U+4F4D, U+5019, U+504F, U+5143-5144, U+5151, U+516B, U+516D, U+517B, U+51A0, U+51B2, U+5203, U+5211, U+5236, U+5251, U+52A9, U+52AB, U+533B, U+5341, U+5348, U+534A, U+534E, U+536F-5370, U+5384, U+53CD, U+5408, U+541F, U+547D, U+559C, U+56DA-56DB, U+571F, U+5730, U+574E, U+5764, U+57CE, U+5893, U+58C1, U+58EC, U+591A, U+5927, U+5929-592B, U+5934, U+5973-5974, U+59BB, U+5A5A, U+5B50, U+5B57, U+5B64, U+5B85, U+5B98, U+5B9C, U+5BAB, U+5BB3, U+5BBF, U+5BC5, U+5BD2, U+5BE1, U+5C06, U+5C0F, U+5C40, U+5C4B, U+5C71, U+5DF1, U+5DF3, U+5DFD, U+5E1B, U+5E1D, U+5E26, U+5E72-5E74, U+5E93, U+5E9A, U+5EF6, U+5F1F, U+5F31, U+5F3A, U+5F97, U+5FAE, U+5FB7, U+5FCC, U+620A, U+620C, U+652F, U+6570, U+6587, U+6597, U+65C1, U+65E5, U+65E9, U+65F6, U+65FA, U+660C, U+661F, U+6625, U+665A, U+6708, U+6728, U+672A, U+6740, U+6768, U+677E, U+6797, U+67CF, U+67D8, U+67F1, U+67F3, U+6839, U+683C, U+6843, U+6851, U+69B4, U+6B63, U+6B7B, U+6BCD, U+6BD4, U+6C14, U+6C23, U+6C34, U+6C90, U+6C99, U+6CB3, U+6CC9, U+6D41, U+6D74, U+6D77, U+6DA7, U+6EAA, U+706B, U+706F, U+7089, U+715E, U+7236, U+751F, U+7528, U+7530, U+7532-7533, U+75BE, U+75C5, U+7678, U+767D, U+76D6, U+76D8, U+76F8, U+771F, U+77F3, U+795E, U+7978, U+7984, U+798D, U+798F, U+79BB, U+79FB, U+7A7A, U+7ACB, U+7B94, U+7D0D, U+7D2B, U+7D55, U+7EA2, U+7EB3, U+7EDD, U+7F8A, U+80A9, U+80CE, U+81EA, U+8206, U+826E, U+8273, U+8282, U+82B1, U+85CF, U+8721, U+884C, U+8870, U+8986, U+8C03, U+8D22, U+8D35, U+8DEF, U+8EAB, U+8F9B, U+8FB0, U+8FC1, U+8FD0, U+900F, U+901A, U+9149, U+91AB, U+91D1, U+948F, U+9497, U+950B, U+957F, U+9633-9634, U+9694, U+96F3, U+9707, U+9739, U+97F3, U+98DF, U+9A6C, U+9A7F, U+9B3C, U+9E3E;
}
@font-face {
font-family: "Noto Serif SC";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url("/local/templates/.default/fonts/noto-serif-sc-700.woff2") format("woff2");
unicode-range: U+0020, U+00A0, U+4E01, U+4E03, U+4E09-4E0B, U+4E11, U+4E13, U+4E19, U+4E2D, U+4E34, U+4E3B, U+4E59, U+4E7E, U+4E8C, U+4E94, U+4EA1, U+4EA5, U+4EBA, U+4EC6, U+4ECE, U+4EE4, U+4F0F, U+4F11, U+4F1A, U+4F24, U+4F4D, U+5019, U+504F, U+5143-5144, U+5151, U+516B, U+516D, U+517B, U+51A0, U+51B2, U+5203, U+5211, U+5236, U+5251, U+52A9, U+52AB, U+533B, U+5341, U+5348, U+534A, U+534E, U+536F-5370, U+5384, U+53CD, U+5408, U+541F, U+547D, U+559C, U+56DA-56DB, U+571F, U+5730, U+574E, U+5764, U+57CE, U+5893, U+58C1, U+58EC, U+591A, U+5927, U+5929-592B, U+5934, U+5973-5974, U+59BB, U+5A5A, U+5B50, U+5B57, U+5B64, U+5B85, U+5B98, U+5B9C, U+5BAB, U+5BB3, U+5BBF, U+5BC5, U+5BD2, U+5BE1, U+5C06, U+5C0F, U+5C40, U+5C4B, U+5C71, U+5DF1, U+5DF3, U+5DFD, U+5E1B, U+5E1D, U+5E26, U+5E72-5E74, U+5E93, U+5E9A, U+5EF6, U+5F1F, U+5F31, U+5F3A, U+5F97, U+5FAE, U+5FB7, U+5FCC, U+620A, U+620C, U+652F, U+6570, U+6587, U+6597, U+65C1, U+65E5, U+65E9, U+65F6, U+65FA, U+660C, U+661F, U+6625, U+665A, U+6708, U+6728, U+672A, U+6740, U+6768, U+677E, U+6797, U+67CF, U+67D8, U+67F1, U+67F3, U+6839, U+683C, U+6843, U+6851, U+69B4, U+6B63, U+6B7B, U+6BCD, U+6BD4, U+6C14, U+6C23, U+6C34, U+6C90, U+6C99, U+6CB3, U+6CC9, U+6D41, U+6D74, U+6D77, U+6DA7, U+6EAA, U+706B, U+706F, U+7089, U+715E, U+7236, U+751F, U+7528, U+7530, U+7532-7533, U+75BE, U+75C5, U+7678, U+767D, U+76D6, U+76D8, U+76F8, U+771F, U+77F3, U+795E, U+7978, U+7984, U+798D, U+798F, U+79BB, U+79FB, U+7A7A, U+7ACB, U+7B94, U+7D0D, U+7D2B, U+7D55, U+7EA2, U+7EB3, U+7EDD, U+7F8A, U+80A9, U+80CE, U+81EA, U+8206, U+826E, U+8273, U+8282, U+82B1, U+85CF, U+8721, U+884C, U+8870, U+8986, U+8C03, U+8D22, U+8D35, U+8DEF, U+8EAB, U+8F9B, U+8FB0, U+8FC1, U+8FD0, U+900F, U+901A, U+9149, U+91AB, U+91D1, U+948F, U+9497, U+950B, U+957F, U+9633-9634, U+9694, U+96F3, U+9707, U+9739, U+97F3, U+98DF, U+9A6C, U+9A7F, U+9B3C, U+9E3E;
}
@font-face {
font-family: "Noto Serif SC";
font-style: normal;
font-weight: 900;
font-display: swap;
src: url("/local/templates/.default/fonts/noto-serif-sc-900.woff2") format("woff2");
unicode-range: U+0020, U+00A0, U+4E01, U+4E11, U+4E19, U+4E59, U+4EA5, U+5348, U+535C, U+536F-5370, U+5408, U+547D, U+56DB, U+571F, U+58EC, U+5B50, U+5BC5, U+5DF1, U+5DF3, U+5E74, U+5E9A, U+620A, U+620C, U+6587, U+65E5, U+65F6, U+6708, U+6728, U+672A, U+6731, U+67F1, U+6C34, U+706B, U+7532-7533, U+7678, U+767D, U+76D8, U+7B97, U+89E3, U+8F9B, U+8FB0, U+9149, U+91D1, U+9AA8;
}
@font-face {
font-family: "Noto Serif SC";
font-style: normal;
font-weight: 900;
font-display: swap;
src: url("/local/templates/.default/fonts/noto-serif-sc-900-text.woff2") format("woff2");
unicode-range: U+4E03, U+4E09-4E0B, U+4E13, U+4E2D, U+4E34, U+4E3B, U+4E7E, U+4E8C, U+4E94, U+4EA1, U+4EBA, U+4EC6, U+4ECE, U+4EE4, U+4F0F, U+4F11, U+4F1A, U+4F24, U+4F4D, U+5019, U+504F, U+5143-5144, U+5151, U+516B, U+516D, U+517B, U+51A0, U+51B2, U+5203, U+5211, U+5236, U+5251, U+52A9, U+52AB, U+533B, U+5341, U+534A, U+534E, U+5384, U+53CD, U+541F, U+559C, U+56DA, U+5730, U+574E, U+5764, U+57CE, U+5893, U+58C1, U+591A, U+5927, U+5929-592B, U+5934, U+5973-5974, U+59BB, U+5A5A, U+5B57, U+5B64, U+5B85, U+5B98, U+5B9C, U+5BAB, U+5BB3, U+5BBF, U+5BD2, U+5BE1, U+5C06, U+5C0F, U+5C40, U+5C4B, U+5C71, U+5DFD, U+5E1B, U+5E1D, U+5E26, U+5E72-5E73, U+5E93, U+5EF6, U+5F1F, U+5F31, U+5F3A, U+5F97, U+5FAE, U+5FB7, U+5FCC, U+652F, U+6570, U+6597, U+65C1, U+65E9, U+65FA, U+660C, U+661F, U+6625, U+665A, U+6740, U+6768, U+677E, U+6797, U+67CF, U+67D8, U+67F3, U+6839, U+683C, U+6843, U+6851, U+69B4, U+6B63, U+6B7B, U+6BCD, U+6BD4, U+6C14, U+6C23, U+6C90, U+6C99, U+6CB3, U+6CC9, U+6D41, U+6D74, U+6D77, U+6DA7, U+6EAA, U+706F, U+7089, U+715E, U+7236, U+751F, U+7528, U+7530, U+75BE, U+75C5, U+76D6, U+76F8, U+771F, U+77F3, U+795E, U+7978, U+7984, U+798D, U+798F, U+79BB, U+79FB, U+7A7A, U+7ACB, U+7B94, U+7D0D, U+7D2B, U+7D55, U+7EA2, U+7EB3, U+7EDD, U+7F8A, U+80A9, U+80CE, U+81EA, U+8206, U+826E, U+8273, U+8282, U+82B1, U+85CF, U+8721, U+884C, U+8870, U+8986, U+8C03, U+8D22, U+8D35, U+8DEF, U+8EAB, U+8FC1, U+8FD0, U+900F, U+901A, U+91AB, U+948F, U+9497, U+950B, U+957F, U+9633-9634, U+9694, U+96F3, U+9707, U+9739, U+97F3, U+98DF, U+9A6C, U+9A7F, U+9B3C, U+9E3E;
}
/* ---- запасные семейства ---- */
/* GolosText-Regular против arial-400: средняя ширина 0.50118 / 0.47849 em; измерено по arial.ttf */
@font-face {
font-family: "Golos Fallback Arial";
font-style: normal;
font-weight: 400;
src: local("Arial"), local("ArialMT"), local("Liberation Sans"), local("LiberationSans"), local("LiberationSans-Regular"), local("Arimo"), local("Arimo-Regular");
size-adjust: 104.74%;
ascent-override: 93.56%;
descent-override: 21.00%;
line-gap-override: 0.00%;
}
/* GolosText-Bold против arial-700: средняя ширина 0.51125 / 0.51109 em; измерено по arialbd.ttf */
@font-face {
font-family: "Golos Fallback Arial";
font-style: normal;
font-weight: 700;
src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"), local("LiberationSans-Bold"), local("Arimo Bold"), local("Arimo-Bold");
size-adjust: 100.03%;
ascent-override: 97.97%;
descent-override: 21.99%;
line-gap-override: 0.00%;
}
/* GolosText-Regular против roboto-400: средняя ширина 0.50118 / 0.48008 em; снимок: Roboto 2.137 (системный шрифт Android 7–11) */
@font-face {
font-family: "Golos Fallback Roboto";
font-style: normal;
font-weight: 400;
src: local("Roboto"), local("Roboto Regular"), local("Roboto-Regular");
size-adjust: 104.39%;
ascent-override: 93.87%;
descent-override: 21.07%;
line-gap-override: 0.00%;
}
/* GolosText-Bold против roboto-700: средняя ширина 0.51125 / 0.48710 em; снимок: Roboto Bold 2.137 */
@font-face {
font-family: "Golos Fallback Roboto";
font-style: normal;
font-weight: 700;
src: local("Roboto Bold"), local("Roboto-Bold");
size-adjust: 104.96%;
ascent-override: 93.37%;
descent-override: 20.96%;
line-gap-override: 0.00%;
}
/* OldStandard-Regular против times-400: средняя ширина 0.45310 / 0.43491 em; измерено по times.ttf */
@font-face {
font-family: "Old Standard Fallback Times";
font-style: normal;
font-weight: 400;
src: local("Times New Roman"), local("TimesNewRomanPSMT"), local("Liberation Serif"), local("LiberationSerif"), local("LiberationSerif-Regular"), local("Tinos"), local("Tinos-Regular");
size-adjust: 104.18%;
ascent-override: 73.14%;
descent-override: 22.84%;
line-gap-override: 22.65%;
}
/* OldStandard-Italic против times-400italic: средняя ширина 0.47467 / 0.44586 em; измерено по timesi.ttf */
@font-face {
font-family: "Old Standard Fallback Times";
font-style: italic;
font-weight: 400;
src: local("Times New Roman Italic"), local("TimesNewRomanPS-ItalicMT"), local("Liberation Serif Italic"), local("LiberationSerif-Italic"), local("Tinos Italic"), local("Tinos-Italic");
size-adjust: 106.46%;
ascent-override: 71.57%;
descent-override: 22.36%;
line-gap-override: 22.17%;
}
/* OldStandard-Bold против times-700: средняя ширина 0.46661 / 0.46167 em; измерено по timesbd.ttf */
@font-face {
font-family: "Old Standard Fallback Times";
font-style: normal;
font-weight: 700;
src: local("Times New Roman Bold"), local("TimesNewRomanPS-BoldMT"), local("Liberation Serif Bold"), local("LiberationSerif-Bold"), local("Tinos Bold"), local("Tinos-Bold");
size-adjust: 101.07%;
ascent-override: 75.39%;
descent-override: 23.55%;
line-gap-override: 23.35%;
}
/* OldStandard-Regular против noto-serif-400: средняя ширина 0.45310 / 0.51478 em; снимок: Noto Serif 1.06 (upm 2048 — как в AOSP) */
@font-face {
font-family: "Old Standard Fallback Noto";
font-style: normal;
font-weight: 400;
src: local("Noto Serif"), local("NotoSerif"), local("Noto Serif Regular"), local("NotoSerif-Regular"), local("Droid Serif"), local("DroidSerif");
size-adjust: 88.02%;
ascent-override: 86.57%;
descent-override: 27.04%;
line-gap-override: 26.81%;
}
/* OldStandard-Italic против noto-serif-400italic: средняя ширина 0.47467 / 0.52020 em; снимок: Noto Serif Italic 1.07 */
@font-face {
font-family: "Old Standard Fallback Noto";
font-style: italic;
font-weight: 400;
src: local("Noto Serif Italic"), local("NotoSerif-Italic"), local("Droid Serif Italic"), local("DroidSerif-Italic");
size-adjust: 91.25%;
ascent-override: 83.51%;
descent-override: 26.08%;
line-gap-override: 25.86%;
}
/* OldStandard-Bold против noto-serif-700: средняя ширина 0.46661 / 0.53829 em; снимок: Noto Serif Bold 1.06 */
@font-face {
font-family: "Old Standard Fallback Noto";
font-style: normal;
font-weight: 700;
src: local("Noto Serif Bold"), local("NotoSerif-Bold"), local("Droid Serif Bold"), local("DroidSerif-Bold");
size-adjust: 86.68%;
ascent-override: 87.91%;
descent-override: 27.46%;
line-gap-override: 27.23%;
}
/* End */
/* Start:/local/templates/.default/css/tokens.css?17920592395725*/
/* Токены: HO 1.1–1.7, сведение 1.8 */
:root {
--paper: #F2EADB;
--paper-deep: #E8DCC6;
--sheet: #FBF7EE;
--ink: #1C1A17;
--ink-2: #4A443B;
--ink-3: #6B6357;
--ink-off: #8C8478;
--rule: var(--ink);
--hair: rgba(28, 26, 23, .28);
--plate: #E0574A;
--cinnabar: #A3321F;
--black: #11141A;
--on-black: #F1E8D6;
--on-black-2: #C9BEA9;
--on-black-link: #F2A196;
--on-black-han: #F06B5C;
--on-black-rule: #3A3F4B;
--on-black-frame: #4A4F5C;
--plate-night: #BC4A41;
--type-hi: #FFFDF8;
--type-lo: #F4EEE2;
--focus: #245BA6;
--focus-on-black: #8DB4F0;
--err: #8E2414;
--err-bg: #FBE9E4;
--st-sleep: #1D4A87;
--st-ask: #9E2A22;
--wood: #2C7A47;
--wood-text: #256A3D;
--fire: #C0352B;
--fire-text: #A32A20;
--earth: #94642A;
--earth-text: #86591F;
--metal: #6B7380;
--metal-text: #5F6672;
--water: #245BA6;
--water-text: #245BA6;
--el: var(--ink);
--el-text: var(--ink);
--hatch-s: 7.5px;
--hatch-p: 15px;
--ink-a1: rgba(28, 26, 23, .06);
--ink-a2: rgba(28, 26, 23, .14);
--ink-a3: rgba(28, 26, 23, .32);
--ink-a4: rgba(28, 26, 23, .55);
--plate-a1: rgba(224, 87, 74, .08);
--plate-a2: rgba(224, 87, 74, .16);
--plate-a3: rgba(224, 87, 74, .42);
--err-tint: var(--plate-a1);
--btn-bg: var(--ink);
--btn-fg: var(--sheet);
--btn-shadow: var(--ink);
--radius: 0px;
--kid-plate: #B26657;
--kid-shadow: #E3D3CB;
/* Шрифты (решение заказчика 12.10.2026: один шрифт на весь сайт, как на главной 10-final):
текст — Golos Text только 400 и 600, без курсива; знаки — Noto Serif SC только 900 (подмножества сайта).
--f-display оставлен именем-синонимом текста: прежние заголовки Old Standard набираются Golos. */
--f-text: "Golos Text", "Golos Fallback Arial", "Golos Fallback Roboto", "Segoe UI", Arial, sans-serif;
--f-display: var(--f-text);
--f-han: "Noto Serif SC", "Songti SC", "SimSun", serif;
--w-reg: 400;
--w-semi: 600;
--w-han: 900;
/* Шкала кеглей (как на главной): других размеров текста нет, кроме знаков-графики.
Десктоп 56/36/22/17/14/12, планшет 44/30/20/17/14/12, телефон 34/26/19/16/14/12. */
--fs-56: 56px;
--fs-36: 36px;
--fs-22: 22px;
--fs-17: 17px;
--fs-14: 14px;
--fs-12: 12px;
--placeholder: #6E665A;
--s-1: 4px;
--s-2: 8px;
--s-3: 12px;
--s-4: 16px;
--s-5: 20px;
--s-6: 24px;
--s-7: 28px;
--s-8: 32px;
--s-10: 40px;
--s-12: 48px;
--s-14: 56px;
--s-16: 64px;
--s-18: 72px;
--s-22: 88px;
--s-28: 112px;
--sh-btn: 4px 4px 0 var(--btn-shadow);
--sh-card: 6px 6px 0 var(--paper-deep);
--sh-card-lg: 8px 8px 0 var(--paper-deep);
--sh-accent: 8px 8px 0 var(--plate);
--sh-ink: 10px 10px 0 var(--ink);
/* Карточка — одна тень тушью на всём сайте (_dev/DESIGN.md, «Правило одной глубины»); --sh-ink — только герой. */
--sh-card-ink: 6px 6px 0 var(--ink);
--sh-sheet: 0 1px 0 rgba(28, 26, 23, .1), 10px 14px 0 rgba(28, 26, 23, .08);
--sh-pop: 8px 10px 0 rgba(28, 26, 23, .12);
/* Сетка сайта — одна на все страницы, как на главной 10-final (решение заказчика 12.10.2026):
колонка 1248 px, боковое поле --side = max(--gutter, поле закреплённого Цзя), симметрично.
.wrap: max-width calc(--wrap + 2 × --side), поля --side. --margin и --maxw — синонимы для старых правил. */
--wrap: 1248px;
--gutter: 96px;
--sec-y: 120px;
--jia-img: 92px;
--jia-right: 8px;
--jia-bottom: 16px;
--jia-field: calc(var(--jia-right) + var(--jia-img) + 16px);
--jia-say: 240px;
--jia-say-wide: 360px;
--side: max(var(--gutter), var(--jia-field));
--maxw: calc(var(--wrap) + 2 * var(--side));
--margin: var(--side);
--gap: 24px;
--t-press: 140ms;
--t-shift: 200ms;
}
@media (min-width: 1880px) { :root { --jia-right: 32px; } }
@media (max-width: 1279px) { :root { --gutter: 64px; --sec-y: 104px; --jia-img: 88px; --jia-right: 6px; --jia-say: 230px; } }
@media (max-width: 1100px) { :root { --gutter: 48px; --jia-img: 84px; --jia-right: 4px; --jia-say: 220px; --jia-say-wide: 300px; } }
@media (max-width: 1023px) {
:root {
--fs-56: 44px; --fs-36: 30px; --fs-22: 20px;
--gutter: 32px; --sec-y: 80px;
--jia-img: 64px; --jia-right: 4px; --jia-bottom: 12px;
--jia-field: calc(var(--jia-right) + var(--jia-img) + 8px);
}
}
@media (max-width: 767px) {
:root {
--fs-56: 34px; --fs-36: 26px; --fs-22: 19px; --fs-17: 16px;
--gutter: max(16px, env(safe-area-inset-left), env(safe-area-inset-right));
--sec-y: 56px; --jia-field: 0px;
--gap: var(--s-4);
--sh-card: 4px 4px 0 var(--paper-deep);
--sh-ink: 6px 6px 0 var(--ink);
--sh-card-ink: 4px 4px 0 var(--ink);
}
}
@media (max-width: 374px) { :root { --fs-56: 32px; } }
html.kid,
.kid-card {
--paper: #F3F1EC;
--paper-deep: #EAE4DA;
--sheet: #FBF9F5;
--ink: #2B2522;
--ink-2: #5E534C;
--rule: var(--ink);
--hair: rgba(43, 37, 34, .25);
--plate: var(--kid-plate);
--cinnabar: #8E4A3D;
--radius: 12px;
--btn-bg: #9A5446;
--btn-fg: #FFFFFF;
--btn-shadow: var(--kid-shadow);
--sh-btn: 4px 4px 0 var(--btn-shadow);
--sh-card: 6px 6px 0 var(--paper-deep);
--sh-card-lg: 8px 8px 0 var(--paper-deep);
--sh-accent: 8px 8px 0 var(--plate);
--sh-ink: 10px 10px 0 var(--ink);
}
/* End */
/* Start:/local/templates/.default/css/base.css?17924711934837*/
/* База: сброс, бумага, типографика, сетка, фокус */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
margin: 0;
background-color: var(--paper);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .11 0 0 0 0 .1 0 0 0 0 .09 0 0 0 .045 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
color: var(--ink);
font: 400 var(--fs-17)/1.55 var(--f-text);
overflow-x: hidden;
}
html.kid body { background-image: none; }
[hidden] { display: none !important; }
img { max-width: 100%; display: block; }
a { color: var(--cinnabar); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { text-decoration-thickness: 2px; }
p { margin: 0 0 1em; }
h1, h2, h3, h4 { margin: 0; font-weight: var(--w-semi); }
/* Один шрифт на весь сайт (решение заказчика 12.10.2026): Golos 400/600 без курсива и синтеза, знаки — Noto 900. */
html { font-synthesis: none; }
b, strong, th, dt { font-weight: var(--w-semi); }
em, i, cite, dfn, var, address { font-style: normal; }
em { font-weight: var(--w-semi); }
button, input, select, textarea { font: inherit; color: inherit; }
input, select, textarea { font-size: max(16px, 1em); }
input[type="date"], input[type="time"] { min-height: 52px; }
::selection { background: var(--plate); color: var(--ink); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.on-plate :focus-visible, .plate :focus-visible { outline-color: var(--ink); }
.on-black :focus-visible { outline-color: var(--focus-on-black); }
.visually-hidden {
position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip {
position: absolute; left: var(--s-3); top: -60px; z-index: 100;
background: var(--ink); color: var(--sheet); padding: var(--s-3) 18px; text-decoration: none;
}
.skip:focus { top: var(--s-3); }
.wrap { width: 100%; max-width: calc(var(--wrap) + 2 * var(--side)); margin: 0 auto; padding-inline: var(--side); }
.grid12 { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); }
@media (max-width: 767px) { .grid12 > * { grid-column: 1 / -1 !important; } }
.num { font-family: var(--f-text); font-feature-settings: "tnum"; letter-spacing: 0; }
.han { font-family: var(--f-han); font-weight: var(--w-han); line-height: 1; }
[lang="zh"] { font-family: var(--f-han); font-weight: var(--w-han); }
.muted { color: var(--ink-2); }
.lead { font: 400 var(--fs-22)/1.3 var(--f-text); max-width: 30ch; }
.kicker {
font: 600 var(--fs-14)/1.3 var(--f-text); text-transform: uppercase; letter-spacing: .12em; color: var(--ink-2);
margin: 0 0 22px; display: flex; gap: var(--s-3); align-items: center;
}
.kicker::before { content: ""; width: 36px; border-top: 2px solid var(--plate); }
.runhead {
display: flex; justify-content: space-between; gap: var(--s-4); align-items: baseline;
font: 400 var(--fs-12)/1.3 var(--f-text); font-feature-settings: "tnum"; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-2);
padding-bottom: 10px;
}
@media (max-width: 767px) { .runhead { font-size: var(--fs-12); letter-spacing: .03em; } .kicker { font-size: var(--fs-17); } }
.rule4 { height: 0; border: 0; border-top: 4px solid var(--rule); margin: 0; }
.rule1 { height: 0; border: 0; border-top: 1px solid var(--rule); margin: 0; }
.plate { background: var(--plate); color: var(--ink); }
.on-black { background: var(--black); color: var(--on-black); }
.on-black a { color: var(--on-black-link); }
.press { transition: text-shadow var(--t-shift) ease-out; text-shadow: 0 0 0 transparent; }
.press:hover { text-shadow: 3px 2px 0 var(--plate); }
html.kid h1, html.kid h2, html.kid .kid-h { font-style: normal; }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.btn:hover, .btn:active { transform: none; }
.btn[data-stamp]::after { display: none; }
.press:hover { text-shadow: none; }
}
html.motion-off { scroll-behavior: auto !important; }
html.motion-off *, html.motion-off *::before, html.motion-off *::after {
animation: none !important; transition: none !important; scroll-behavior: auto !important;
}
html.motion-off .btn:hover,
html.motion-off .btn:active { transform: none; }
html.motion-off .btn[data-stamp]::after { display: none; }
html.motion-off .press:hover { text-shadow: none; }
/* End */
/* Start:/local/templates/.default/css/components.css?179247119356342*/
/* Компоненты HO 2.1–2.10, 2.13, 2.16–2.17 */
html[data-element="wood"] { --el: var(--wood); --el-text: var(--wood-text); }
html[data-element="fire"] { --el: var(--fire); --el-text: var(--fire-text); }
html[data-element="earth"] { --el: var(--earth); --el-text: var(--earth-text); }
html[data-element="metal"] { --el: var(--metal); --el-text: var(--metal-text); }
html[data-element="water"] { --el: var(--water); --el-text: var(--water-text); }
[data-el="wood"] { --c: var(--wood); --ct: var(--wood-text); }
[data-el="fire"] { --c: var(--fire); --ct: var(--fire-text); }
[data-el="earth"] { --c: var(--earth); --ct: var(--earth-text); }
[data-el="metal"] { --c: var(--metal); --ct: var(--metal-text); }
[data-el="water"] { --c: var(--water); --ct: var(--water-text); }
[data-el="ink"] { --c: var(--ink); --ct: var(--ink); }
.sw { display: inline-block; flex: none; width: 16px; height: 16px; vertical-align: -2px; background: var(--c); border: 1.5px solid var(--c); }
.sw--yin { background: repeating-linear-gradient(-45deg, var(--c) 0 2.5px, transparent 2.5px 5px); }
.pat-wood { background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.28) 0 2px, transparent 2px 7px); }
.pat-earth { background-image: radial-gradient(rgba(255,255,255,.35) 1.2px, transparent 1.6px); background-size: 7px 7px; }
.pat-metal { background-image: repeating-linear-gradient(0deg, rgba(255,255,255,.3) 0 2px, transparent 2px 7px); }
.pat-water { background-image: repeating-linear-gradient(135deg, rgba(255,255,255,.26) 0 2px, transparent 2px 8px); }
.pat-fire { background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.26) 0 2px, transparent 2px 8px); }
.rule-el { border-top-color: var(--el); }
html[data-polarity="yin"] .rule-el { border-top: 0; height: 8px; background: repeating-linear-gradient(-45deg, var(--el) 0 var(--hatch-s), transparent var(--hatch-s) var(--hatch-p)); box-shadow: inset 0 -1.5px 0 var(--el), inset 0 1.5px 0 var(--el); }
.chip {
display: inline-flex; align-items: center; gap: var(--s-2); min-height: 44px; padding: 0 14px;
background: transparent; border: 1.5px solid var(--ink); color: var(--ink); cursor: pointer;
font: 400 var(--fs-17)/1 var(--f-text); border-radius: var(--radius);
}
.chip:hover { background: var(--sheet); }
.chip[aria-pressed="true"] { background: var(--ink); color: var(--sheet); }
.chip[aria-pressed="true"]::before { content: "✓"; font-weight: 600; margin-right: -2px; }
.chip[aria-pressed="true"] .sw { border-color: var(--sheet); }
.btn {
--sh: 4px;
display: inline-flex; align-items: center; justify-content: center; gap: 10px;
min-height: 56px; padding: 0 var(--s-7);
background: var(--btn-bg); color: var(--btn-fg);
font: 600 var(--fs-17)/1.1 var(--f-text); letter-spacing: .01em;
border: 2px solid var(--btn-bg); border-radius: var(--radius);
box-shadow: var(--sh) var(--sh) 0 var(--btn-shadow);
text-decoration: none; cursor: pointer; text-align: center;
transition: transform var(--t-press) ease-out, box-shadow var(--t-press) ease-out;
}
.btn:hover { transform: translate(1px, 1px); box-shadow: 3px 3px 0 var(--btn-shadow); text-decoration: none; }
.btn:active { transform: translate(var(--sh), var(--sh)); box-shadow: 0 0 0 var(--btn-shadow); }
.btn--sm { min-height: 44px; padding: 0 18px; font-size: var(--fs-17); --sh: 3px; box-shadow: 3px 3px 0 var(--btn-shadow); }
.btn--sm:active { transform: translate(3px, 3px); }
.btn--lg { min-height: 68px; font-size: var(--fs-22); }
.btn--wide { width: 100%; }
.btn--ghost { background: transparent; color: var(--ink); border-color: var(--ink); box-shadow: none; }
.btn--ghost:hover { background: var(--ink); color: var(--sheet); transform: none; box-shadow: none; }
.btn--ghost:active { transform: translate(2px, 2px); }
.btn--plate { --btn-bg: var(--plate); --btn-fg: var(--ink); --btn-shadow: var(--ink); border-color: var(--ink); }
.btn--plate > span[aria-hidden] { font-size: 1.15em; transition: transform var(--t-shift) ease-out; }
.btn--plate:hover > span[aria-hidden] { transform: translateX(4px); }
/* На коралловой плашке тень та же — тушью (_dev/DESIGN.md, Elevation); у контурной кнопки тени нет. */
.on-plate .btn { --btn-shadow: var(--ink); }
.on-plate .btn--plate { --btn-bg: var(--sheet); }
.btn-link, .btn-text {
display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--s-1);
background: none; border: 0; color: var(--cinnabar); cursor: pointer;
text-decoration: underline; text-underline-offset: .2em; font: inherit;
}
.btn-text { font-weight: 600; text-underline-offset: .18em; }
.btn-link:hover, .btn-text:hover { text-decoration-thickness: 2px; }
html.kid .btn--ghost, .kid-card .btn--ghost { color: var(--cinnabar); border-color: var(--btn-bg); }
html.kid .btn--ghost:hover, .kid-card .btn--ghost:hover { background: var(--btn-bg); color: var(--btn-fg); }
.btn[aria-busy="true"] { cursor: progress; opacity: .85; }
.btn[aria-busy="true"]::before {
content: ""; flex: none; width: 14px; height: 14px; border: 2px solid currentColor; border-right-color: transparent;
animation: btn-busy 900ms steps(8) infinite;
}
@keyframes btn-busy { to { transform: rotate(360deg); } }
.btn[disabled]:not([aria-busy="true"]) { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.btn-link[disabled], .btn-text[disabled] { color: var(--ink-2); text-decoration-style: dotted; cursor: not-allowed; }
.btn[data-stamp] { position: relative; }
.btn[data-stamp]::after {
content: "命"; position: absolute; right: var(--s-3); top: -18px; width: 40px; height: 40px;
display: grid; place-items: center; background: var(--plate); color: var(--sheet);
font: var(--w-han) var(--fs-22)/1 var(--f-han); border-radius: 3px 2px 4px 2px;
box-shadow: inset 0 0 0 3px var(--plate), inset 0 0 0 4.5px var(--sheet);
opacity: 0; transform: rotate(-9deg) scale(1.7); pointer-events: none;
}
.btn.is-stamped::after { animation: stamp-in 460ms cubic-bezier(.25, .9, .35, 1.15) forwards; }
.btn.is-stamped[aria-busy="true"], .btn.is-stamped[disabled] { opacity: 1; }
@keyframes stamp-in {
0% { opacity: 0; transform: rotate(-9deg) scale(1.7); filter: blur(1px); }
45% { opacity: 1; transform: rotate(-9deg) scale(.92); filter: none; }
70% { transform: rotate(-9deg) scale(1.04); }
100% { opacity: .96; transform: rotate(-9deg) scale(1); }
}
.gloss-pop__x { position: absolute; right: 2px; top: 2px; width: 44px; height: 44px; background: none; border: 0; cursor: pointer; font: 400 var(--fs-22)/1 var(--f-text); color: var(--ink); }
@media (max-width: 767px) {
.btn--lg { min-height: 56px; font-size: var(--fs-17); }
.btn--plate { padding: 0 var(--s-3); font-size: var(--fs-17); gap: var(--s-2); }
}
.field { display: flex; flex-direction: column; min-width: 0; }
.label {
display: flex; gap: var(--s-2); align-items: baseline;
font: 600 var(--fs-14)/1.3 var(--f-text); color: var(--ink);
margin-bottom: 8px;
}
.label .n { font: 400 var(--fs-14)/1 var(--f-text); font-feature-settings: "tnum"; color: var(--cinnabar); }
.label .opt { font-weight: 400; color: var(--ink-2); }
.input, .select, .textarea {
width: 100%; min-width: 0; min-height: 52px; padding: 0 12px;
background-color: var(--sheet); border: 1.5px solid var(--ink); border-radius: 0;
font: 400 var(--fs-17)/1.2 var(--f-text); color: var(--ink);
}
.textarea { padding: 12px; line-height: 1.5; }
.input::placeholder, .textarea::placeholder { color: var(--placeholder); opacity: 1; }
.input:disabled { color: var(--ink-2); border-style: dashed; background-color: var(--paper); }
.input[type="date"], .input[type="time"] { font-family: var(--f-text); font-feature-settings: "tnum"; font-size: var(--fs-17); }
.select {
appearance: none; padding-right: 36px; cursor: pointer;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%231C1A17' stroke-width='2'/%3E%3C/svg%3E");
background-repeat: no-repeat; background-position: right 12px center;
}
html.kid .select, .kid-card .select {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%232B2522' stroke-width='2'/%3E%3C/svg%3E");
}
.box .input, .box .select, .filters .select { border: 1.5px solid var(--ink); padding: 10px var(--s-3); background-color: var(--sheet); }
.filters .select { width: auto; min-width: 190px; min-height: 44px; font-size: var(--fs-17); }
.hint { font-size: var(--fs-14); line-height: 1.45; color: var(--ink-2); margin: var(--s-2) 0 0; }
.hint--time { color: var(--ink); background: var(--paper); border-left: 3px solid var(--plate); padding: var(--s-2) var(--s-3); }
.input[readonly] { background-color: var(--paper); color: var(--ink); cursor: default; }
.select:disabled { color: var(--ink-2); border-style: dashed; background-color: var(--paper); cursor: not-allowed; opacity: 1; }
.ixsearch .input { font-size: var(--fs-22); }
.ixsearch .input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; display: none; }
.lined {
width: 100%; min-height: 160px; resize: vertical; border: 0; padding: 0 2px; background-color: transparent;
background-image: repeating-linear-gradient(180deg, transparent 0 35px, var(--ink-a3) 35px 36px);
background-attachment: local; font: 400 var(--fs-17)/36px var(--f-text); color: var(--ink);
border-bottom: 2px solid var(--ink); border-radius: 0;
}
.lined:focus-visible { outline-offset: var(--s-1); }
.counter { display: flex; justify-content: space-between; gap: var(--s-3); margin-top: var(--s-2); font: 400 var(--fs-14)/1.3 var(--f-text); font-feature-settings: "tnum"; color: var(--ink-2); }
.counter.is-near span:last-child { color: var(--err); font-weight: 600; }
.q { padding: 30px 0 22px; border-bottom: 1px solid var(--rule); display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 0 var(--s-4); }
.q__n { display: grid; place-items: center; width: 40px; height: 40px; background: var(--plate); color: var(--ink); font: 600 var(--fs-14)/1 var(--f-text); font-feature-settings: "tnum"; transform: rotate(-3deg); }
html.kid .q__n { background: var(--btn-bg); color: var(--btn-fg); border-radius: 8px; }
.q label { display: block; font: 600 var(--fs-22)/1.35 var(--f-text); margin: var(--s-1) 0 var(--s-3); text-transform: none; letter-spacing: 0; }
.time-line { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.time-line .input { flex: 1 1 128px; min-width: 128px; }
.chip-check { position: relative; flex: none; display: inline-flex; cursor: pointer; }
.chip-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip-check > span {
display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px;
border: 1.5px solid var(--ink); border-radius: 999px; background: var(--sheet);
font: 600 var(--fs-14)/1 var(--f-text); white-space: nowrap;
}
.chip-check > span::before { content: ""; width: 10px; height: 10px; border: 1.5px solid var(--ink); border-radius: 50%; }
.chip-check:hover > span { background: var(--paper); }
.chip-check input:checked + span { background: var(--plate); }
.chip-check input:checked + span::before { background: var(--ink); }
.chip-check input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 2px; }
.chip-check input:disabled + span { opacity: .45; cursor: not-allowed; }
.blank__note { font-size: var(--fs-14); color: var(--ink-2); margin: 0; display: flex; gap: var(--s-2); align-items: flex-start; }
.privacy-note { margin-top: 22px; padding: 14px 18px var(--s-1); background: var(--paper-deep); max-width: 720px; }
.privacy-note__k { margin: 0 0 6px; font: 400 var(--fs-22)/1.2 var(--f-text); }
.privacy-note p { font-size: var(--fs-17); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.captcha {
display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--s-2) 18px; align-items: end;
padding: var(--s-4) 0 18px; border-top: 1px dashed var(--hair); border-bottom: 1px dashed var(--hair); max-width: 560px;
}
.captcha__img {
width: 180px; height: 40px; border: 1.5px solid var(--ink);
background: repeating-linear-gradient(-30deg, var(--paper-deep) 0 6px, var(--sheet) 6px 12px);
display: grid; place-items: center; font: 600 var(--fs-22)/1 var(--f-text); letter-spacing: .3em; color: var(--ink-2);
}
.captcha .btn-link { grid-column: 1; justify-self: start; font-size: var(--fs-14); }
@media (max-width: 767px) {
.q { grid-template-columns: 1fr; padding-top: var(--s-6); }
.q__n { margin-bottom: var(--s-2); }
.captcha { grid-template-columns: 1fr; }
}
.check { display: flex; gap: 14px; align-items: flex-start; min-height: 44px; padding: 10px 0; cursor: pointer; font-size: var(--fs-17); line-height: 1.45; }
.check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.check .box-ui {
flex: none; width: 24px; height: 24px; margin-top: 0; border: 2px solid var(--ink); background: var(--sheet);
display: grid; place-items: center; border-radius: calc(var(--radius) / 3);
}
.check .box-ui::after { content: ""; width: 12px; height: 7px; border-left: 3px solid var(--ink); border-bottom: 3px solid var(--ink); transform: translateY(-2px) rotate(-45deg); opacity: 0; }
.check:hover .box-ui { background: var(--paper); }
.check input:checked + .box-ui { background: var(--plate); }
.check input:checked + .box-ui::after { opacity: 1; }
.check input:focus-visible + .box-ui { outline: 3px solid var(--focus); outline-offset: 2px; }
.check input:disabled + .box-ui { opacity: .5; }
.check small, .check .small { display: block; font-size: var(--fs-14); color: var(--ink-2); margin-top: var(--s-1); }
.check--compact { font-size: var(--fs-17); min-height: 44px; padding: var(--s-2) 0; align-items: center; }
.radio-ui { border-radius: 50% !important; }
.radio-ui::after { width: 10px !important; height: 10px !important; border: 0 !important; background: var(--ink); border-radius: 50%; transform: none !important; }
/* Поля в рамке (_dev/DESIGN.md, Inputs) — класс формы .form-boxed: бланк заказа, проба на главной.
Остальные формы переходят на него в своих проходах; потом этот вид станет общим .input/.label сайта. */
.form-boxed .label, .form-boxed fieldset.seg > legend, .form-boxed .sexes > legend {
display: block; margin: 0 0 8px; padding: 0;
font: 600 var(--fs-14)/1.3 var(--f-text); text-transform: none; letter-spacing: 0; color: var(--ink);
}
.form-boxed .input, .form-boxed .select {
width: 100%; min-width: 0; min-height: 52px; padding: 0 12px;
border: 1.5px solid var(--ink); border-radius: 0; background-color: var(--sheet); color: var(--ink);
font: 400 var(--fs-17)/1.2 var(--f-text);
}
.form-boxed .select { padding-right: 36px; background-position: right 12px center; }
.form-boxed .input::placeholder { color: var(--placeholder); opacity: 1; }
.form-boxed .input.is-empty:not(:focus)::-webkit-datetime-edit { color: var(--placeholder); }
.form-boxed .input:disabled { background-color: var(--paper); color: var(--ink-2); border-style: dashed; }
.form-boxed .input[readonly] { background-color: var(--paper); }
/* Ошибка — только у своего поля: внутри .field города лежат поля координат, их не красим, пока их не трогали. */
.form-boxed .field.is-error > .input, .form-boxed .field.is-error > .select,
.form-boxed .input[aria-invalid="true"], .form-boxed .select[aria-invalid="true"] { border: 2px solid var(--err); background-color: var(--err-tint); }
.form-boxed .field.is-error .field:not(.is-error) > .input:not([aria-invalid="true"]) { border: 1.5px solid var(--ink); background-color: var(--sheet); }
/* Ошибка места — сразу под полем, а не под подсказкой и координатами (.err кладётся в конец .field). */
.form-boxed [data-place] > * { order: 2; }
.form-boxed [data-place] > .label, .form-boxed [data-place] > .input { order: 0; }
.form-boxed [data-place] > .err { order: 1; }
/* «Посчитаем на 12:00…» — сведения, не ошибка: бумага, а не розовый лист ошибки. */
.form-boxed .hint--time { border-left: 0; background: var(--paper-deep); color: var(--ink); padding: 10px 12px; }
/* Сегмент (_dev/DESIGN.md, Inputs): fieldset.seg > legend + .seg__row > label.seg__opt > input[radio] + span.
Один на сайте — бланк заказа и проба на главной. Ошибку группы field-errors.js кладёт в fieldset под ряд. */
.seg__row { display: flex; }
.seg__opt { position: relative; flex: 1 1 0; display: flex; min-height: 52px; border: 1.5px solid var(--ink); cursor: pointer; }
.seg__opt + .seg__opt { margin-left: -1.5px; }
.seg__opt input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.seg__opt span { flex: 1; display: flex; align-items: center; justify-content: center; padding: 0 10px; background: var(--sheet); font-size: var(--fs-17); }
.seg__opt:hover span { background: var(--paper); }
.seg__opt input:checked + span { background: var(--ink); color: var(--sheet); font-weight: var(--w-semi); }
.seg__opt input:focus-visible + span { outline: 3px solid var(--focus); outline-offset: 2px; position: relative; z-index: 1; }
.seg.is-error .seg__opt { border-color: var(--err); border-width: 2px; }
.radios { display: flex; flex-wrap: wrap; gap: 0 var(--s-7); }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { padding: 0; }
.kinds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-3); }
.kind { position: relative; display: block; cursor: pointer; }
.kind input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.kind__ui { display: flex; flex-direction: column; gap: 6px; min-height: 112px; padding: var(--s-4); border: 1.5px solid var(--ink); background: var(--sheet); border-radius: var(--radius); transition: box-shadow var(--t-press) ease-out, transform var(--t-press) ease-out; }
.kind__ui b { font: 600 var(--fs-17)/1.2 var(--f-text); }
.kind__ui small { color: var(--ink-2); font-size: var(--fs-14); }
.kind input:checked + .kind__ui { background: var(--plate); box-shadow: var(--s-1) var(--s-1) 0 var(--ink); transform: translate(-2px, -2px); }
.kind input:checked + .kind__ui small { color: var(--ink); }
.kind input:checked + .kind__ui::after { content: "✓ выбрано"; font: 600 var(--fs-12)/1 var(--f-text); font-feature-settings: "tnum"; text-transform: uppercase; margin-top: auto; }
.kind input:focus-visible + .kind__ui { outline: 3px solid var(--focus); outline-offset: 3px; }
html.kid .kind__ui, html.kid .check .box-ui, .kid-card .kind__ui, .kid-card .check .box-ui { border-radius: 8px; }
html.kid .check .radio-ui, .kid-card .check .radio-ui { border-radius: 50%; }
html.kid .check input:checked + .box-ui, .kid-card .check input:checked + .box-ui { background: var(--btn-bg); border-color: var(--btn-bg); }
html.kid .check input:checked + .box-ui::after, .kid-card .check input:checked + .box-ui::after { border-color: var(--btn-fg); }
html.kid .radio-ui::after, .kid-card .radio-ui::after { background: var(--btn-fg) !important; }
@media (max-width: 767px) { .kinds { grid-template-columns: 1fr; } .kind__ui { min-height: 0; } }
.err { display: flex; gap: var(--s-2); align-items: flex-start; font-size: var(--fs-14); font-weight: 600; color: var(--err); margin-top: var(--s-2); }
.err::before { content: "!"; flex: none; display: inline-grid; place-items: center; width: 20px; height: 20px; background: var(--err); color: #fff; font: 600 var(--fs-12)/1 var(--f-text); margin-top: 1px; }
.field.is-error .input, .field.is-error .select, .input[aria-invalid="true"], .select[aria-invalid="true"] { border: 2px solid var(--err); background-color: var(--err-tint); }
.field.is-error .lined, .lined[aria-invalid="true"] { border-bottom: 3px solid var(--err); background-color: var(--err-tint); }
.check input[aria-invalid="true"] + .box-ui { border: 3px solid var(--err); box-shadow: 0 0 0 3px var(--plate-a2); }
fieldset.is-error > legend, .is-error > .label { color: var(--err); }
fieldset.is-error .radio-ui { border-color: var(--err); border-width: 3px; }
.check .err { margin: var(--s-1) 0 0; font-size: var(--fs-14); }
.alert { display: grid; grid-template-columns: 32px 1fr; gap: var(--s-3); padding: var(--s-4) 18px; border: 2px solid var(--err); background: var(--err-bg); margin: 22px 0 0; color: var(--ink); }
.alert::before { content: "!"; display: grid; place-items: center; width: 30px; height: 30px; background: var(--err); color: #fff; font: 600 var(--fs-17)/1 var(--f-text); }
.alert p { margin: 0; }
.alert a { color: var(--err); font-weight: 600; }
.finder__err { font-size: var(--fs-14); font-weight: 600; color: var(--err); background: var(--err-bg); padding: var(--s-2) var(--s-3); margin: 0 0 14px; }
.statusline { margin-top: var(--s-4); font-weight: 600; display: flex; gap: 10px; align-items: center; }
.statusline:empty { display: none; }
.statusline::before { content: ""; width: 10px; height: 10px; background: var(--plate); transform: rotate(45deg); flex: none; }
.notice { display: grid; grid-template-columns: 28px 1fr; gap: var(--s-3); align-items: start; padding: 14px 18px; background: var(--sheet); border: 1px solid var(--rule); border-left-width: 5px; font-size: var(--fs-17); line-height: 1.45; max-width: 640px; }
.notice::before { display: grid; place-items: center; width: 26px; height: 26px; font: 600 var(--fs-14)/1 var(--f-text); }
.notice p { margin: 0; }
.notice a { font-weight: 600; }
.notice--ok { border-left-color: var(--wood); }
.notice--ok::before { content: "✓"; border: 2px solid var(--wood); color: var(--wood); border-radius: 50%; }
.notice--info { border-left-color: var(--ink); }
.notice--info::before { content: ""; width: 12px; height: 12px; margin: 7px; background: var(--plate); transform: rotate(45deg); }
.notice--warn { border: 0; background: var(--paper-deep); }
.notice--warn::before { content: "!"; border: 2px solid var(--ink); color: var(--ink); }
.notice--err { border-color: var(--err); background: var(--err-bg); }
.notice--err::before { content: "×"; background: var(--err); color: #fff; font-size: var(--fs-22); }
.newprice { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; padding: 14px 18px; background: var(--paper); border-left: 4px solid var(--plate); margin: 14px 0 var(--s-3); }
.newprice .num { font-size: var(--fs-36); }
.disclaimer { font-size: var(--fs-14); line-height: 1.45; color: var(--ink); background: var(--paper); border-left: 3px solid var(--plate); padding: 10px var(--s-3); margin: 0 0 18px; }
.stampnum {
display: inline-grid; place-items: center; flex: none;
width: var(--s-12); height: var(--s-12); background: var(--plate); color: var(--ink);
font: 400 var(--fs-17)/1 var(--f-text); font-feature-settings: "tnum"; transform: rotate(-3deg); border-radius: 0;
}
.blank { background: var(--sheet); border: 1px solid var(--rule); box-shadow: var(--sh-card); border-radius: var(--radius); max-width: 760px; }
.blank__head { display: flex; justify-content: space-between; gap: var(--s-3); padding: var(--s-3) var(--s-5); border-bottom: 3px double var(--rule); font: 600 var(--fs-14)/1.3 var(--f-text); font-feature-settings: "tnum"; }
.blank__body { padding: 22px var(--s-5) var(--s-6); }
.tier { display: flex; flex-direction: column; background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--radius); }
.tier--main { box-shadow: var(--sh-accent); }
.tier__cover { position: relative; overflow: hidden; min-height: 168px; padding: var(--s-5) 22px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; background: var(--plate); border-bottom: 1px solid var(--rule); }
.tier__cover h3 { position: relative; font: 600 var(--fs-36)/1.02 var(--f-text); margin: 0; max-width: 8ch; }
.tier__han { position: absolute; right: 14px; bottom: -22px; font: var(--w-han) 150px/1 var(--f-han); color: var(--ink-a2); pointer-events: none; }
.tier__body { padding: 22px 22px var(--s-6); display: flex; flex-direction: column; }
.tier__price, .edition__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px var(--s-3); font: 400 var(--fs-36)/1 var(--f-text); font-feature-settings: "tnum"; margin: 0 0 14px; }
.tier__price small, .edition__price small { font: 400 var(--fs-14)/1 var(--f-text); color: var(--ink-2); }
.tier__list { list-style: none; margin: var(--s-1) 0 18px; padding: 0; }
.tier__list li { position: relative; padding: 11px 0 11px 26px; border-bottom: 1px dotted var(--hair); font-size: var(--fs-17); line-height: 1.45; }
.tier__list li::before { content: ""; position: absolute; left: 3px; top: 19px; width: 9px; height: 9px; background: var(--plate); transform: rotate(45deg); }
.tier__act { display: grid; gap: var(--s-4); }
.tier__cond { margin-top: 18px; border-top: 3px double var(--rule); }
.tier__cond summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); min-height: 48px; font: 400 var(--fs-12)/1.3 var(--f-text); font-feature-settings: "tnum"; text-transform: uppercase; letter-spacing: .08em; }
.tier__cond summary::-webkit-details-marker { display: none; }
.tier__cond summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 26px; height: 26px; border: 1.5px solid var(--ink); font: 400 var(--fs-17)/1 var(--f-text); }
.tier__cond[open] summary::after { content: "−"; background: var(--plate); }
.tier__cond summary:hover { color: var(--cinnabar); }
/* «Скоро» на главной (тарифы, index.html) — бумажная обложка пунктиром. Издание «скоро» на /service/ (service.html)
так не гасится: обложка своего цвета (пара — плашка, детская — терракота с белым заголовком), приглушение —
saturate(.75) и тень в pricelist/style.css. */
.tier--soon { background: var(--paper); border-style: dashed; border-color: var(--ink-a4); box-shadow: var(--sh-card); }
.tier--soon .tier__cover { background: var(--paper-deep); border-bottom-style: dashed; border-bottom-color: var(--ink-a4); }
.tier--soon .tier__cover h3, .tier--soon .tier__cover .num { color: var(--ink-2); }
.tier--soon .tier__han { color: var(--ink-a1); }
.soon-stamp {
display: inline-flex; align-items: center; gap: var(--s-2);
padding: 6px var(--s-3) 5px; border: 2px solid var(--cinnabar); color: var(--cinnabar);
font: 600 var(--fs-14)/1 var(--f-text); font-feature-settings: "tnum"; text-transform: uppercase; letter-spacing: .1em;
transform: rotate(-3deg); white-space: nowrap; background: var(--paper);
}
.soon-stamp::before { content: ""; width: 8px; height: 8px; border: 2px solid currentColor; border-radius: 50%; }
.soon-stamp--lg { font-size: var(--fs-17); padding: var(--s-2) 14px 7px; }
.soon-note { color: var(--ink-2); font: 400 var(--fs-17)/1.3 var(--f-text); }
.edition { display: flex; flex-direction: column; background: var(--sheet); border: 1px solid var(--rule); box-shadow: var(--sh-card); border-radius: var(--radius); }
.edition--main { box-shadow: 6px 6px 0 var(--plate); }
.edition__cover { position: relative; background: var(--plate); padding: 22px; min-height: 248px; display: flex; flex-direction: column; justify-content: space-between; border-bottom: 1px solid var(--rule); }
.edition__cover h2 { font: 600 var(--fs-36)/1.02 var(--f-text); margin-top: var(--s-2); max-width: 8ch; }
.edition__cover .jia { position: absolute; right: 18px; bottom: 18px; width: 132px; }
.edition__body { padding: 22px 22px var(--s-6); display: flex; flex-direction: column; flex: 1; }
.edition .btn { margin-top: auto; }
.imprint { margin: 0 0 var(--s-5); padding: 14px 0 0; border-top: 3px double var(--rule); font-size: var(--fs-14); }
.imprint dl { display: grid; grid-template-columns: 92px 1fr; gap: 6px var(--s-3); margin: 0; }
.imprint dt { font: 600 var(--fs-14)/1.5 var(--f-text); color: var(--ink-2); }
.imprint dd { margin: 0; }
.edition__cover--kid { background: var(--kid-plate); --plate: var(--kid-plate); }
.edition__cover--kid .num, .edition__cover--kid h2 { color: #fff; }
.edition__cover--kid .num { align-self: flex-start; background: #9A5446; padding: var(--s-1) var(--s-2); }
.edition__cover--kid .kidimg { position: absolute; right: 18px; bottom: 18px; width: 132px; overflow: hidden; aspect-ratio: 1; background: var(--kid-plate); }
.edition__cover--kid .kidimg img { width: 100%; height: 100%; transform: scale(1.24); }
@media (min-width: 1101px) { .edition__cover { min-height: 368px; } .edition__cover .jia:not(.jia--wide) { width: 176px; } }
@media (max-width: 1100px) { .editions { grid-template-columns: 1fr; max-width: 640px; } }
@media (max-width: 767px) {
.tier--main { box-shadow: 6px 6px 0 var(--plate); }
.tier__cover { min-height: 132px; }
.tier__han { font-size: 120px; }
.tier__price, .edition__price { font-size: var(--fs-56); }
.edition__cover { min-height: 0; }
.edition__cover .jia, .edition__cover--kid .kidimg { position: static; align-self: flex-end; width: 120px; }
.blank { box-shadow: 4px 4px 0 var(--paper-deep); }
}
.wo { position: relative; background: var(--sheet); border: 1.5px solid var(--ink); box-shadow: var(--sh-card-ink); border-radius: var(--radius); }
.wo__top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-1) var(--s-3); padding: var(--s-3) var(--s-6); border-bottom: 3px double var(--rule); font: 600 var(--fs-14)/1.3 var(--f-text); font-feature-settings: "tnum"; color: var(--ink-2); }
.wo__body { padding: var(--s-7) var(--s-6) 30px; display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: var(--s-2) var(--s-8); }
.wo__no { font: 400 var(--fs-17)/1 var(--f-text); font-feature-settings: "tnum"; color: var(--ink-2); margin: 0 0 10px; }
.wo__no b { font: 400 var(--fs-56)/1 var(--f-text); font-feature-settings: "tnum"; color: var(--ink); display: block; margin-top: 6px; letter-spacing: -.02em; }
.wo__title { font: 600 var(--fs-36)/1.08 var(--f-text); margin: 6px 0 18px; }
.wo__stamp { grid-column: 2; grid-row: 1 / span 3; align-self: start; justify-self: end; text-align: center; margin: 0; }
.wo__stamp .jia { width: 188px; transform: rotate(-5deg); }
.wo__stamp .jia-cap { font: 400 var(--fs-22)/1.3 var(--f-text); margin-top: 14px; max-width: 210px; }
.wo__rows { grid-column: 1; display: grid; grid-template-columns: 120px 1fr; margin: 0 0 var(--s-6); border-top: 1px solid var(--rule); }
.wo__rows dt, .wo__rows dd { margin: 0; padding: var(--s-3) 0; border-bottom: 1px solid var(--hair); }
.wo__rows dt { font: 600 var(--fs-14)/1.5 var(--f-text); color: var(--ink-2); }
.wo__rows dd { font-size: var(--fs-17); }
.wo__need { grid-column: 1 / -1; border-top: 1px solid var(--rule); padding-top: 22px; margin-top: var(--s-1); }
.wo__need h2, .wo__need h3 { font: 600 var(--fs-22)/1.3 var(--f-text); color: var(--ink); margin-bottom: var(--s-2); }
.wo__need--stub { border-top-style: dashed; }
.wo__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.wo__sub { grid-column: 1 / -1; border-top: 1px dashed var(--hair); margin-top: 26px; padding-top: 22px; }
.paying { display: none; }
.wo.is-paying .paying { display: flex; }
.wo.is-paying .not-paying { display: none; }
.empty { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--gap) var(--s-14); align-items: center; background: var(--sheet); border: 1.5px solid var(--ink); box-shadow: var(--sh-card-ink); padding: var(--s-12); border-radius: var(--radius); }
.empty .jia { width: min(340px, 100%); justify-self: center; }
.empty h2 { font: 600 var(--fs-56)/1.04 var(--f-text); margin-bottom: 18px; }
@media (max-width: 900px) { .empty { grid-template-columns: 1fr; padding: var(--s-7) var(--s-5) 30px; } .empty .jia { width: 220px; } }
@media (max-width: 767px) {
.wo__body { grid-template-columns: 1fr; padding: var(--s-5) var(--s-4) var(--s-6); }
.wo__stamp { grid-column: 1; grid-row: auto; justify-self: start; display: grid; grid-template-columns: 112px 1fr; gap: var(--s-4); align-items: center; text-align: left; margin: var(--s-1) 0 var(--s-4); }
.wo__stamp .jia { width: 112px; }
.wo__stamp .jia-cap { margin: 0; font-size: var(--fs-17); max-width: none; }
.wo__no b { font-size: var(--fs-56); }
.wo__rows { grid-template-columns: 96px 1fr; }
.wo__actions .btn { width: 100%; }
}
.tbl-wrap, .doc__text .tbl-wrap { overflow-x: auto; border-top: 2px solid var(--rule); }
.tbl-wrap:focus-visible { outline-offset: var(--s-1); }
.doc__text table, .tbl-wrap table { width: 100%; border-collapse: collapse; margin: var(--s-2) 0 18px; font-size: var(--fs-17); min-width: 520px; }
.doc__text th, .doc__text td, .tbl-wrap th, .tbl-wrap td { text-align: left; padding: 10px var(--s-3); border-bottom: 1px solid var(--rule); vertical-align: top; }
.doc__text th, .tbl-wrap th { font: 600 var(--fs-14)/1.4 var(--f-text); border-bottom-width: 2px; }
.proof__table { width: 100%; border-collapse: collapse; font-size: var(--fs-14); }
.proof__table tr { border-top: 1px solid var(--hair); }
.proof__table th, .proof__table td { padding: 10px 6px; text-align: left; vertical-align: top; font-weight: 400; }
.proof__table .is-yes { color: var(--wood-text); }
.proof__table .is-no { color: var(--cinnabar); }
.proof__table tr.is-miss { background: repeating-linear-gradient(135deg, transparent 0 7px, color-mix(in srgb, var(--cinnabar) 7%, transparent) 7px 9px); }
.status {
display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px 7px 10px;
border: 2px solid var(--ink); font: 600 var(--fs-17)/1.2 var(--f-text);
transform: rotate(-1.5deg); background: var(--sheet); border-radius: var(--radius);
}
.status svg { flex: none; width: 20px; height: 20px; }
.status--wait { border-color: var(--ink); }
.status--sleep, .status--ask { border-color: var(--cinnabar); color: var(--cinnabar); }
.status--work { border-color: var(--ink); color: var(--ink); }
.status--done { border-color: var(--ink); background: var(--ink); color: var(--sheet); }
.status--off { border-style: dashed; border-color: var(--ink-2); color: var(--ink-2); }
.stages { list-style: none; margin: 14px 0 26px; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.stages li { position: relative; padding: 34px 6px 0 0; font-size: var(--fs-14); line-height: 1.3; color: var(--ink-2); }
.stages li::before { content: ""; position: absolute; left: 0; right: 0; top: 11px; border-top: 2px solid var(--hair); }
.stages li .dot { position: absolute; left: 0; top: 0; width: 24px; height: 24px; border: 2px solid var(--ink-2); background: var(--sheet); display: grid; place-items: center; font: 600 var(--fs-14)/1 var(--f-text); font-feature-settings: "tnum"; z-index: 1; }
.stages li.done { color: var(--ink); }
.stages li.done::before { border-top: 2px solid var(--ink); }
.stages li.done .dot { background: var(--ink); border-color: var(--ink); color: var(--sheet); }
.stages li.cur { color: var(--ink); font-weight: 600; }
.stages li.cur .dot { width: 30px; height: 30px; top: -3px; background: var(--plate); border: 2.5px solid var(--ink); color: var(--ink); }
.stages li.cur--ask .dot { background: var(--sheet); border-style: dashed; }
.stages li .note { display: block; margin-top: 3px; font: 600 var(--fs-14)/1.3 var(--f-text); color: var(--cinnabar); }
.stages li .t { display: block; margin-top: 3px; font: 400 var(--fs-14)/1.3 var(--f-text); font-feature-settings: "tnum"; font-weight: 400; color: var(--ink-2); }
.steplist { list-style: none; margin: 0; padding: 0; }
.steplist li { display: grid; grid-template-columns: 28px 1fr; gap: var(--s-3); align-items: start; margin-bottom: 10px; }
.steplist__m { display: grid; place-items: center; width: 26px; height: 26px; border: 1.5px solid var(--ink); font: 400 var(--fs-14)/1 var(--f-text); font-feature-settings: "tnum"; }
.steplist .is-done { color: var(--ink-2); }
.steplist .is-done .steplist__m { background: var(--ink); color: var(--sheet); border-color: var(--ink); font-weight: 600; }
.steplist .is-now .steplist__m { background: var(--plate); border-color: var(--ink); }
.steplist .is-now small { color: var(--cinnabar); }
.due { margin: -4px 0 26px; padding: 14px 18px var(--s-3); background: var(--paper-deep); }
.due__t { margin: 0 0 30px; font-size: var(--fs-17); line-height: 1.45; }
.due__bar { position: relative; height: 14px; border: 1.5px solid var(--ink); background: repeating-linear-gradient(90deg, transparent 0 calc(100% / 24 - 1px), var(--hair) calc(100% / 24 - 1px) calc(100% / 24)), var(--sheet); }
.due__fill { position: absolute; inset: 0 auto 0 0; width: var(--now); background: repeating-linear-gradient(-45deg, var(--plate) 0 3px, transparent 3px 6px); border-right: 2px solid var(--ink); }
.due__now { position: absolute; left: var(--now); bottom: calc(100% + 6px); transform: translateX(-50%); font: 600 var(--fs-14)/1 var(--f-text); white-space: nowrap; }
.due--paused .due__bar { background: repeating-linear-gradient(-45deg, var(--hair) 0 2px, transparent 2px 7px), var(--sheet); }
@media (max-width: 767px) {
.stages { grid-template-columns: 1fr; }
.stages li { padding: 0 0 14px 40px; min-height: 38px; }
.stages li::before { left: 11px; right: auto; top: 26px; bottom: 0; border-top: 0; border-left: 2px solid var(--hair); }
.stages li.done::before { border-left: 2px solid var(--ink); }
.stages li:last-child::before { display: none; }
.stages li.cur .dot { left: -3px; }
.stages li .note, .stages li .t { display: inline; margin-left: var(--s-2); }
}
/* Липкое под компактной шапкой (60 px) — как .ctoc--side глав и словаря. */
.doc__toc { position: sticky; top: 86px; align-self: start; max-height: calc(100vh - 110px); max-height: calc(100dvh - 110px); overflow-y: auto; padding: var(--s-6) 0 0; }
.doc__toc h2 { font: 600 var(--fs-14)/1.3 var(--f-text); color: var(--ink-2); margin-bottom: 10px; }
.doc__toc ol { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.doc__toc a { display: grid; grid-template-columns: 44px 1fr; column-gap: 8px; align-items: center; min-height: 44px; padding: 6px 0; border-bottom: 1px solid var(--hair); color: var(--ink); text-decoration: none; font-size: var(--fs-17); line-height: 1.3; }
.doc__toc a .num { color: var(--cinnabar); font-size: var(--fs-14); white-space: nowrap; }
.doc__toc a:hover { color: var(--cinnabar); }
.doc__toc a[aria-current="true"] { position: relative; background: var(--sheet); font-weight: 600; }
.doc__toc a[aria-current="true"]::before { content: ""; position: absolute; left: -10px; top: 6px; bottom: 6px; width: 4px; background: var(--ink); }
.doc__toc ol ol a, .doc__toc [data-level="3"] > a { padding-left: var(--s-4); font-size: var(--fs-14); }
.doc__text h2 { scroll-margin-top: 86px; }
.ctoc--side { position: sticky; top: 86px; align-self: start; max-height: calc(100vh - 110px); max-height: calc(100dvh - 110px); overflow-y: auto; }
.ctoc a { position: relative; display: grid; grid-template-columns: 38px 1fr; align-items: center; min-height: 44px; padding: var(--s-1) 0 var(--s-1) 10px; border-bottom: 1px solid var(--hair); color: var(--ink); text-decoration: none; font-size: var(--fs-17); line-height: 1.25; }
/* Пункт без номера (главы «60 характеров», 15.10.2026) — название на всю строку, а не в колонке номера. */
.ctoc a > span:only-child { grid-column: 1 / -1; }
.ctoc a:hover { color: var(--cinnabar); }
.ctoc a[aria-current="true"] { background: var(--sheet); font-weight: 600; }
.ctoc a[aria-current="true"]::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 4px; background: var(--el); }
.ctoc--top summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; cursor: pointer; font: 600 var(--fs-17)/1.3 var(--f-text); list-style: none; }
.ctoc--top summary::-webkit-details-marker { display: none; }
.ctoc--top summary::after { content: "+"; font: 400 var(--fs-22)/1 var(--f-text); }
.ctoc--top[open] summary::after { content: "−"; }
@media (max-width: 1023px) { .doc__toc { position: static; max-height: none; } }
.crumbs { padding: 14px 0 var(--s-1); font-size: var(--fs-14); }
/* Крошки — строкой текста (15.10.2026): длинное название переносится по словам сразу за «›», а не уходит целиком
на новую строку, оставляя «Главная» одну. Высота нажатия ссылки — 44 px за счёт полей строки. */
.crumbs ol { list-style: none; margin: 0; padding: 0; line-height: 1.45; }
.crumbs li { display: inline; }
.crumbs li + li::before { content: "›"; padding: 0 var(--s-2); color: var(--ink-2); }
.crumbs a { display: inline-block; padding-block: 12px; color: var(--ink); text-decoration: none; }
.crumbs a:hover { color: var(--cinnabar); }
.crumbs [aria-current] { color: var(--ink-2); }
dialog.confirm {
border: 2px solid var(--ink); padding: 0; background: var(--sheet); color: var(--ink);
max-width: min(520px, calc(100vw - 32px));
max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px);
box-shadow: 6px 6px 0 var(--ink); border-radius: var(--radius);
}
dialog.confirm::backdrop { background: var(--ink-a4); }
.confirm__head { padding: var(--s-3) 22px; border-bottom: 3px double var(--rule); font: 600 var(--fs-14)/1.3 var(--f-text); font-feature-settings: "tnum"; color: var(--ink-2); }
.confirm__body { padding: 22px 22px var(--s-6); }
.confirm__body h2 { font: 600 var(--fs-36)/1.15 var(--f-text); margin-bottom: var(--s-3); }
.confirm__actions { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-4); margin-top: 18px; }
.confirm--static { position: static; display: block; margin: 0; box-shadow: 6px 6px 0 var(--ink); }
.jia { position: relative; overflow: hidden; aspect-ratio: 1; transform: rotate(-2deg); background: var(--plate); border-radius: var(--radius); }
.jia img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.27); }
.jia::after { content: ""; position: absolute; inset: 0; border: 4px solid var(--plate); pointer-events: none; }
.jia--night { background: var(--plate-night); }
.jia--night::after { border-color: var(--plate-night); }
.jia--wide { aspect-ratio: 2 / 1; }
.jia--wide img { transform: scale(1.12, 1.24); }
.jia--flat { transform: none; }
.jia--tile { background: var(--black); }
.jia--tile img { transform: none; }
.jia--tile::after { content: none; }
.jia-cap { font: 400 var(--fs-22)/1.25 var(--f-text); }
.seal {
--s: 48px; position: relative; flex: none; width: var(--s); height: var(--s);
display: grid; grid-template-rows: 1fr 1fr; place-items: center;
background: var(--plate); color: var(--sheet); font: var(--w-han) calc(var(--s) * .38)/1 var(--f-han);
border-radius: 3px 2px 4px 2px; transform: rotate(-2deg);
}
.seal::after { content: ""; position: absolute; inset: calc(var(--s) * .06); border: max(1.5px, calc(var(--s) * .028)) solid var(--sheet); border-radius: 2px; opacity: .92; }
.ghost-seal { display: grid; justify-items: center; gap: var(--s-3); width: 188px; }
.ghost-seal .seal { --s: 132px; background: transparent; color: color-mix(in srgb, var(--cinnabar) 30%, transparent); border: 3px solid color-mix(in srgb, var(--cinnabar) 45%, transparent); transform: rotate(-5deg); }
.ghost-seal .seal::after { border-color: color-mix(in srgb, var(--cinnabar) 30%, transparent); border-style: dashed; }
.ghost-seal__t { font: 400 var(--fs-22)/1.3 var(--f-text); text-align: center; }
.kid-art { position: relative; aspect-ratio: 1; overflow: hidden; background: var(--plate); border-radius: 18px; }
.kid-art img, .kid-art picture { width: 100%; height: 100%; display: block; }
.kid-art img { transform: scale(1.24); }
.kid-art:not(.kid-art--paper)::after { content: ""; position: absolute; inset: 0; border: 4px solid var(--plate); border-radius: inherit; pointer-events: none; }
.kid-art--paper { background: var(--paper); }
.kid-art--paper img { transform: none; }
html.kid .jia { background: var(--paper); transform: none; overflow: visible; }
html.kid .jia img, html.kid .jia::after { transform: none; }
html.kid .jia::after { content: none; }
/* белый на --kid-plate — 4.25:1, поэтому оттиск номера в детской теме — цветом кнопки (#9A5446, 5.63:1) */
html.kid .stampnum, .kid-card .stampnum { background: var(--btn-bg); color: var(--btn-fg); font-weight: 600; border-radius: 8px; }
html.kid .seal { border-radius: 10px; }
html.kid .wo, .wo.kid-card {
background: var(--paper); border: 2px solid var(--plate); box-shadow: 6px 6px 0 var(--kid-shadow); border-radius: var(--radius); overflow: hidden;
}
html.kid .wo__top, .kid-card .wo__top { border-bottom: 2px dashed var(--plate); }
html.kid .status--sleep, .kid-card .status--sleep { border-color: var(--ink-2); color: var(--ink-2); }
.kid-card .wo__stamp .kid-art { width: 188px; border-radius: var(--radius); }
.kid-pillars { display: flex; gap: var(--s-2); margin: var(--s-1) 0 var(--s-5); flex-wrap: wrap; }
.kid-pillars .t { display: grid; place-items: center; width: 64px; padding: 6px 0; border: 2px solid var(--ink); border-radius: 10px; background: var(--sheet); font: var(--w-han) var(--fs-22)/1.2 var(--f-han); }
.kid-pillars .t--me { background: #F1DDD6; }
.kid-pillars small { display: block; font-size: var(--fs-14); color: var(--ink-2); margin-top: var(--s-1); }
@media (max-width: 767px) { .kid-card .wo__stamp .kid-art { width: 112px; } }
.gloss__han { display: block; font-size: var(--fs-14); color: var(--cinnabar); margin-bottom: 6px; }
.gloss__term { display: block; font-weight: 600; font-size: var(--fs-14); line-height: 1.3; color: var(--ink); }
.gloss__short { display: block; font-size: var(--fs-14); line-height: 1.45; color: var(--ink-2); }
.gloss-pop {
position: absolute; z-index: 40; width: min(360px, calc(100vw - 32px));
background: var(--sheet); border: 1px solid var(--rule); box-shadow: var(--sh-pop);
padding: 14px 52px 10px var(--s-4);
}
.gloss-pop::before { content: ""; position: absolute; top: -8px; left: var(--ax, 24px); width: 14px; height: 14px; background: var(--sheet); border-left: 1px solid var(--rule); border-top: 1px solid var(--rule); transform: rotate(45deg); }
a.term[aria-expanded="true"] { background: var(--plate-a2); }
.ix { padding: var(--s-2) 0 10px; border-bottom: 1px solid var(--hair); scroll-margin-top: var(--s-16); }
.ix:target, .ix.is-target { background: var(--sheet); box-shadow: inset 3px 0 0 var(--cinnabar); }
.ix__term { font-weight: 600; font-size: var(--fs-17); }
.ix__han { font-size: var(--fs-14); color: var(--ink-2); font-weight: var(--w-han); }
.ix__short { margin: var(--s-1) 0 0; font-size: var(--fs-14); line-height: 1.45; color: var(--ink-2); }
.ix mark { background: linear-gradient(transparent 58%, var(--plate-a3) 58%); color: inherit; }
.leaf { position: relative; background: var(--sheet); box-shadow: var(--sh-sheet); padding: 0 30px 26px; }
.leaf__han { font-size: 76px; letter-spacing: .02em; }
.leaf--page .leaf__han { font-size: 96px; }
.leaf--mini .leaf__han { font-size: var(--fs-56); }
.tcal { position: relative; filter: drop-shadow(0 16px 18px rgba(28, 26, 23, .16)) drop-shadow(0 1px 0 rgba(28, 26, 23, .18)); max-width: 600px; }
.tcal__bind { position: relative; z-index: 3; height: 40px; display: flex; align-items: center; justify-content: space-between; padding: 0 22%; background: var(--plate); }
.tcal__body { position: relative; z-index: 2; background: var(--sheet); padding: 0 40px 36px; }
.tcal__num { font: 600 136px/.82 var(--f-text); color: var(--ct); letter-spacing: -.04em; }
.tcal[data-pol="yin"] .tcal__num { color: transparent; -webkit-text-stroke: 2.5px var(--ct); }
.tcal__name { font: 600 var(--fs-36)/1.1 var(--f-text); }
.tcal--s { max-width: 320px; }
.tcal--s .tcal__num { font-size: var(--fs-56); }
.tcal--l { max-width: 720px; }
.tcal--l .tcal__num { font-size: 168px; }
.tcal { --edge: #D9CCB3; --t-flip: 300ms; }
.tcal__body.is-torn { animation: tcal-tear var(--t-flip) cubic-bezier(.5, 0, .8, .4) forwards; }
@keyframes tcal-tear {
0% { transform: none; opacity: 1; }
30% { transform: rotate(-2deg) translateY(-6px); opacity: 1; }
100% { transform: rotate(-9deg) translate(-30px, -120px); opacity: 0; }
}
.tcal__body.is-flip { animation: tcal-flip 90ms ease-out; }
@keyframes tcal-flip { 0% { transform: translateY(-14px) rotate(-1.5deg); opacity: .2; } 100% { transform: none; opacity: 1; } }
/* Forms and LK (moved from components, X-1)
Бланки входа, кабинет и поля анкеты. style.css компонента подключается раньше этого файла:
отличие страницы остаётся в её style.css селектором сильнее (корень страницы). */
.seal--lg { --s: 88px; }
.auth { min-height: 640px; padding-block: 64px 112px; }
.auth__in { width: min(560px, 100%); position: relative; }
.auth__seal { display: flex; justify-content: center; margin-bottom: -40px; position: relative; z-index: 2; }
/* Бланк входа — карточка стандарта: лист, тушь 1.5 px, жёсткая тень тушью (6/4 px). Цзя в углу — под бланком:
не перекрывает кнопки и подписи. */
.auth .blank { position: relative; z-index: 1; padding-top: 44px; border: 1.5px solid var(--ink); box-shadow: var(--sh-card-ink); }
.auth h1 {
margin: 0 0 8px; text-align: center; text-wrap: balance;
font-weight: 600; font-size: var(--fs-56); line-height: 1.05; letter-spacing: -.015em; font-family: var(--f-text);
}
.auth .for { text-align: center; text-wrap: balance; color: var(--ink-2); margin: 0 0 18px; }
.auth .field { margin-top: 18px; }
.auth .btn { margin-top: 26px; width: 100%; }
.auth__jia { position: absolute; right: -104px; bottom: -104px; width: 140px; }
.lk-title { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-6); border-bottom: 4px solid var(--rule); padding-bottom: 18px; margin-bottom: 40px; }
.lk-title h1 { margin: 0; font-weight: 600; font-size: var(--fs-56); line-height: 1.05; font-family: var(--f-text); letter-spacing: -.015em; text-wrap: balance; }
.lk-title p { margin: 0; color: var(--ink-2); }
.lk-grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--gap) 48px; align-items: start; }
.aside-card { border-top: 4px solid var(--rule); padding: 18px 0 0; margin-bottom: 36px; }
.aside-card h2 { margin: 0 0 12px; font-weight: 600; font-size: var(--fs-22); line-height: 1.3; font-family: var(--f-text); }
.aside-card p, .aside-card li { font-size: var(--fs-17); }
.aside-card ol:not(.steplist) { margin: 0; padding-left: 22px; }
.aside-card ol:not(.steplist) li { margin-bottom: var(--s-2); }
.after-pay { font-size: var(--fs-14); color: var(--ink-2); margin: 14px 0 0; max-width: 40em; }
.fs__legend { display: flex; align-items: center; gap: 16px; margin: 0 0 20px; }
.fs__legend .stampnum { width: 40px; height: 40px; font-size: var(--fs-14); }
.fgrid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px 22px; }
.fgrid .c-6 { grid-column: span 6; }
.fgrid .c-4 { grid-column: span 4; }
.fgrid .c-3 { grid-column: span 3; }
.fgrid .c-2 { grid-column: span 2; }
.trio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .78fr) minmax(0, 1.42fr); gap: 18px 22px; }
.person { margin: 10px 0 0; }
.person__legend { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; font-weight: 600; font-size: var(--fs-22); line-height: 1.2; font-family: var(--f-text); }
.person__legend .num { font-weight: 400; font-size: var(--fs-14); color: var(--cinnabar); }
.sexes legend, .whom legend { padding: 0; margin-bottom: 8px; font-weight: 600; font-size: var(--fs-14); line-height: 1.3; font-family: var(--f-text); }
@media (max-width: 1023px) {
.lk-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
.auth__jia { position: static; width: 120px; margin: 28px auto 0; }
}
@media (max-width: 767px) {
.auth { padding-block: 36px 72px; }
.auth .blank { padding-top: 40px; }
.auth h1 { font-size: var(--fs-56); }
.lk-title { flex-direction: column; align-items: flex-start; gap: var(--s-2); margin-bottom: 28px; }
.fgrid, .trio { grid-template-columns: 1fr; }
.fgrid .c-6, .fgrid .c-4, .fgrid .c-3, .fgrid .c-2 { grid-column: 1 / -1; }
}
/* Переключатель разделов ЛК: «Мои разборы» | «Кабинет партнёра» (include/lk-tabs.php, 07.10.2026) */
.lk-tabs { display: flex; flex-wrap: wrap; gap: 0 var(--s-6, 24px); margin: 0 0 var(--s-6, 24px); border-bottom: 1px solid var(--rule); }
.lk-tabs a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 2px; color: var(--ink-2); text-decoration: none; font-weight: 600; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.lk-tabs a:hover { color: var(--ink); }
.lk-tabs a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--cinnabar); }
html.kid .stages li.cur .dot { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
html.kid .btn--plate, .kid-card .btn--plate { --btn-bg: #9A5446; --btn-fg: #FFFFFF; }
html.kid .btn--plate:hover, .kid-card .btn--plate:hover { --btn-bg: #874638; }
.kid-card .stages li.cur .dot { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
/* ---------- Аккордеон вопросов (.acc, [data-acc]): главная (bazi.faq), калькулятор ----------
div.acc[data-acc] > div.acc__item > h3.acc__h > button.acc__btn[aria-expanded][aria-controls] (.acc__q, .acc__pm)
и div.acc__panel[role=region]. Без JS все ответы открыты; site.js открывает первый, остальные — по нажатию. */
.acc { border-top: 3px solid var(--ink); }
.acc__item { border-bottom: 1px solid var(--hair); }
.acc__h { margin: 0; font: inherit; }
.acc__btn {
display: grid; grid-template-columns: minmax(0, 1fr) 36px; gap: 16px; align-items: center;
width: 100%; padding: 22px 12px; border: 0; background: none; text-align: left; color: var(--ink); cursor: pointer;
}
.acc__btn:hover .acc__q { color: var(--cinnabar); }
.acc__btn:focus-visible { outline-offset: -3px; }
.acc__q { font: var(--w-semi) var(--fs-22)/1.3 var(--f-text); }
.acc__pm { position: relative; width: 36px; height: 36px; border: 1.5px solid var(--ink); }
.acc__pm::before, .acc__pm::after {
content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; background: var(--ink); transform: translate(-50%, -50%);
}
.acc__pm::after { transform: translate(-50%, -50%) rotate(90deg); }
.acc__btn[aria-expanded="true"] .acc__pm { background: var(--plate); border-color: var(--plate); }
.acc__btn[aria-expanded="true"] .acc__pm::after { display: none; }
.acc__panel { display: flex; flex-direction: column; gap: 12px; padding: 0 64px 28px 12px; color: var(--ink-2); }
.acc__panel[hidden] { display: none; }
.acc__panel p, .acc__panel ul, .acc__panel ol { max-width: 720px; }
.acc__panel ul { list-style: disc; padding-left: 1.2em; }
.acc__panel ol { list-style: decimal; padding-left: 1.4em; }
.acc__panel a { color: var(--cinnabar); text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; }
.acc__panel a:hover { text-decoration-thickness: 2px; }
@media (max-width: 1023px) { .acc__panel a { padding: 12px 0; } }
@media (max-width: 767px) {
.acc__btn { grid-template-columns: minmax(0, 1fr) 32px; gap: 10px; padding: 16px 2px; }
.acc__pm { width: 32px; height: 32px; }
.acc__panel { padding: 0 2px 20px 2px; }
}
/* End */
/* Start:/local/templates/.default/css/chrome.css?179266291317636*/
/* Каркас сайта: сквозная шапка, компактная липкая шапка, меню на весь экран и подвал (ST 1) — новый вид, как на
главной 10-final (решение заказчика 12.10.2026; china-destiny: design/home-v2/10-final/HANDOFF.md, 2.1, 2.10).
Разметка — include/masthead.php, include/colophon.php; поведение — js/site.js (меню, компактная шапка).
Типографика — Golos Text 400/600, кегли --fs-* (tokens.css). Главная уточняет поля (page-home.css). */
/* ---------- кнопки шапки и меню (вид главной; общий .btn сайта здесь не нужен) ---------- */
.masthead .btn, .stickybar .btn, .mnav .btn {
display: inline-flex; align-items: center; justify-content: center; gap: 0;
min-height: 48px; padding: 0 22px;
background: var(--plate); border: 2px solid var(--ink); border-radius: 0; box-shadow: none; color: var(--ink);
font: var(--w-semi) var(--fs-17)/1.2 var(--f-text); letter-spacing: 0; text-align: center; text-decoration: none; white-space: nowrap;
transition: background-color .15s ease;
}
.masthead .btn:hover, .stickybar .btn:hover, .mnav .btn:hover { background: #E8675A; transform: none; box-shadow: none; }
.masthead .btn:active, .stickybar .btn:active { transform: none; box-shadow: none; }
.stickybar .btn { min-height: 44px; }
/* Контурная кнопка шапки (MINGPAN_ORDER_CTA = 'quiet'): без коралла, при наведении — лист. */
.masthead .btn--ghost, .stickybar .btn--ghost { background: transparent; }
.masthead .btn--ghost:hover, .stickybar .btn--ghost:hover { background: var(--sheet); }
.mnav .btn { min-height: 56px; padding: 10px 20px; white-space: normal; box-shadow: 4px 4px 0 var(--ink); }
.mnav .btn:hover { box-shadow: 4px 4px 0 var(--ink); }
/* Шапки на ≥1024 — по --gutter, на ≤1023 — по --side (HANDOFF главной 1.4); `html` в селекторе — чтобы перебить
html.home-v2 .wrap из page-home.css (он подключается раньше). */
html .masthead .wrap, html .stickybar .wrap { max-width: calc(var(--wrap) + 2 * var(--gutter)); padding-inline: var(--gutter); }
@media (max-width: 1023px) { html .masthead .wrap, html .stickybar .wrap { max-width: calc(var(--wrap) + 2 * var(--side)); padding-inline: var(--side); } }
/* ---------- знак ---------- */
.brand { display: inline-flex; align-items: center; gap: 14px; min-height: 48px; flex: none; color: var(--ink); text-decoration: none; }
.brand:hover { text-decoration: none; }
.brand__seal { flex: none; width: 48px; height: 48px; color: var(--plate); outline: 2px solid var(--plate); outline-offset: 2px; }
.brand__words { display: flex; flex-direction: column; gap: 2px; }
.brand__name { font: var(--w-semi) var(--fs-22)/1.1 var(--f-text); letter-spacing: 0; }
.brand__sub { font: var(--w-reg) var(--fs-14)/1.3 var(--f-text); color: var(--ink-2); white-space: nowrap; }
.brand--sm { gap: 12px; min-height: 44px; }
.brand--sm .brand__seal { width: 34px; height: 34px; }
.brand--sm .brand__name { font-size: var(--fs-17); }
/* ---------- шапка ---------- */
.masthead { --focus: var(--ink); position: relative; z-index: 10; background: var(--paper); color: var(--ink); border-bottom: 1px solid var(--hair); }
.masthead__in { display: flex; align-items: center; gap: 32px; min-height: 84px; }
.topnav { display: flex; align-items: center; gap: 28px; margin-left: auto; }
.topnav a, .masthead__act .login {
display: inline-flex; align-items: center; min-height: 44px; padding: 0;
font: var(--w-reg) var(--fs-17)/1.2 var(--f-text); color: var(--ink); text-decoration: none; white-space: nowrap;
}
.topnav a:hover, .masthead__act .login:hover { color: var(--cinnabar); text-decoration: underline; text-underline-offset: 6px; }
.topnav a[aria-current], .masthead__act .login[aria-current] { color: var(--cinnabar); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.masthead__act { display: flex; align-items: center; gap: 24px; margin-left: 24px; }
.masthead__act .login { font-weight: var(--w-semi); }
.masthead__act .login--quiet { font-weight: var(--w-reg); color: var(--ink-2); }
.masthead__act .login + .login { margin-left: -8px; }
/* «Меню»: без JS — ссылка на #site-nav, с JS — кнопка (site.js); видна до 1023 px */
.menu-btn {
display: none; align-items: center; gap: 10px; min-height: 44px; min-width: 44px; padding: 0 14px;
border: 1.5px solid var(--ink); border-radius: 0; background: var(--sheet); color: var(--ink);
cursor: pointer; font: var(--w-semi) var(--fs-14)/1 var(--f-text); text-decoration: none;
}
.menu-btn:hover { background: var(--paper-deep); color: var(--ink); }
.menu-btn__bars { position: relative; width: 18px; height: 12px; border-top: 2px solid currentColor; border-bottom: 2px solid currentColor; }
.menu-btn__bars::after { content: ""; position: absolute; left: 0; right: 0; top: 3px; border-top: 2px solid currentColor; }
/* ---------- компактная липкая шапка: слой вне потока, скрытая — visibility (вне Tab) ---------- */
.stickybar {
--focus: var(--ink); position: fixed; left: 0; right: 0; top: 0; z-index: 30;
background: var(--paper); color: var(--ink); border-bottom: 1.5px solid var(--ink); box-shadow: 0 6px 0 rgba(28, 26, 23, .07);
transform: translateY(-110%); visibility: hidden;
transition: transform .22s ease, visibility 0s linear .22s;
}
.stickybar.is-on { transform: none; visibility: visible; transition: transform .22s ease; }
.stickybar__in { display: flex; align-items: center; gap: 32px; height: 60px; }
.stickybar__nav { display: flex; align-items: center; gap: 28px; margin-left: auto; }
.stickybar__nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); font: var(--w-reg) var(--fs-17)/1.2 var(--f-text); text-decoration: none; white-space: nowrap; }
.stickybar__nav a:hover { color: var(--cinnabar); text-decoration: underline; text-underline-offset: 6px; }
html:has(.stickybar) { scroll-padding-top: 64px; }
/* ---------- меню на весь экран: