/* Справочник садовода — вид сайта (docs/STYLE.md). Токены §3: «Британский журнал» по умолчанию,
   «Полевой контраст» — html[data-view="sun"]. Контраст текста ≥ 7:1, основной текст ≥ 18 px, зона нажатия ≥ 48 px. */
@font-face {
  font-family: "Playfair Display";
  src: url("/static/fonts/PlayfairDisplay-VF.woff2") format("woff2");
  font-weight: 400 900;
  font-display: swap;
}
@font-face {
  font-family: Manrope;
  src: url("/static/fonts/Manrope-VF.woff2") format("woff2");
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: Inter;
  src: url("/static/fonts/Inter-VF.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --zoom: 1; /* размер текста — настройка «Моего огорода» (SCREENS Н): data-text на html */
  --bg: #FAF9F5;
  --card: #FFFFFF;
  --line: #E5DFD3;
  --brand: #0C3824;
  --on-brand: #FFFFFF;
  --chip: #174E34;
  --on-chip: #E5F3EB;
  --head: #10241A;
  --text: #1E3125;
  --muted: #3E5046;
  --tab-off: #4B5951;
  --warn-bg: #FBECE8;
  --warn-line: #E86548;
  --warn-text: #861C06;
  --key: #9A1C15;
  --r-card: 14px;
  --r-btn: 10px;
  --shadow: none;
  --card-line: 1px solid var(--line);
  --f-head: "Playfair Display", Georgia, "Times New Roman", serif;
  --f-text: Manrope, Inter, "Segoe UI", Roboto, system-ui, sans-serif;
  --fs: calc(18px * var(--zoom));
  --fs-small: calc(15px * var(--zoom));
  --h1: calc(40px * var(--zoom));
  --h2: calc(28px * var(--zoom));
  --h3: calc(19px * var(--zoom));
  --touch: 52px;
  --leaf: #DCEBDD;
  --sand: #F1EDE3;
  /* разделы страницы: в «журнале» — без рамок, отбивка линией; «На солнце» — белые карточки */
  --sec-bg: transparent;
  --sec-line: 0;
  --sec-pad: 6px 0 8px;
  --sec-shadow: none;
  --sec-top: 1px solid var(--line);
  --measure: 40em;
}
html[data-view="sun"] {
  --bg: #0B2418;
  --card: #FFFFFF;
  --line: #000000;
  --brand: #06180F;
  --chip: #005A32;
  --on-chip: #FFFFFF;
  --head: #FFFFFF;
  --text: #0A140E;
  --muted: #243329;
  --warn-bg: #FFF0F0;
  --warn-line: #D61F1F;
  --warn-text: #8A0808;
  --r-card: 10px;
  --r-btn: 8px;
  --shadow: 0 4px 0 rgba(0, 0, 0, .25);
  --card-line: 2px solid #000;
  --f-head: Inter, "Segoe UI", Roboto, system-ui, sans-serif;
  --f-text: Inter, "Segoe UI", Roboto, system-ui, sans-serif;
  --fs: calc(20px * var(--zoom));
  --fs-small: calc(17px * var(--zoom));
  --h1: calc(32px * var(--zoom));
  --h2: calc(26px * var(--zoom));
  --h3: calc(22px * var(--zoom));
  --sec-bg: var(--card);
  --sec-line: var(--card-line);
  --sec-pad: 4px 18px 14px;
  --sec-shadow: var(--shadow);
  --sec-top: var(--card-line);
}
html[data-text="l"] { --zoom: 1.15; }
html[data-text="xl"] { --zoom: 1.3; }
* { box-sizing: border-box; }
/* width/height у картинок ставит генератор (место до загрузки, REVISION Г7); высоту даёт пропорция или правило блока */
img { height: auto; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 500 var(--fs)/1.55 var(--f-text);
  font-variant-numeric: lining-nums tabular-nums;  /* Playfair по умолчанию — цифры старого стиля, разной высоты */
  padding-bottom: 72px;
}
a { color: var(--brand); text-underline-offset: 3px; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #E8A33D; outline-offset: 2px; }
h1, h2 { font-family: var(--f-head); color: var(--head); line-height: 1.2; font-weight: 700; margin: 0 0 .4em; }
h1 { font-size: var(--h1); }
h2 { font-size: var(--h2); margin-top: 1.4em; }
h3 { font-size: var(--h3); color: var(--head); margin: 1em 0 .3em; font-weight: 800; }
p { margin: 0 0 .8em; }
.muted { color: var(--muted); }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 16px; top: 8px; z-index: 10; background: var(--card); padding: 8px 12px; }

/* шапка */
.top { background: var(--brand); color: var(--on-brand); position: sticky; top: 0; z-index: 5; }
/* якорь и scrollIntoView — ниже липкой шапки, заголовок виден; --top-h меряет site.js (шапка 68–132 px) */
html { scroll-padding-top: calc(var(--top-h, 132px) + 12px); }
.top-in { max-width: 1180px; margin: 0 auto; padding: 8px 16px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--on-brand); text-decoration: none; min-height: var(--touch); }
.brand img { display: block; }  /* белый знак на прозрачном — design/logo/mark-header.png */
.brand span { font-family: var(--f-head); font-size: 22px; font-weight: 700; }
.verbs { display: flex; gap: 4px; flex-wrap: wrap; }
.verbs a, .verbs span { color: var(--on-brand); text-decoration: none; font-weight: 700; padding: 0 12px; min-height: 48px; display: flex; align-items: center; border-radius: var(--r-btn); }
.verbs a:hover { background: rgba(255, 255, 255, .12); }
.verbs [aria-disabled="true"] { opacity: .7; cursor: default; }
.top-tools { margin-left: auto; display: flex; gap: 8px; }
.region, .sun {
  font: 700 var(--fs-small)/1.2 var(--f-text);
  min-height: 48px; padding: 0 14px; border-radius: 999px; border: 0; cursor: pointer;
  background: var(--chip); color: var(--on-chip);
}
/* крупный контрастный вид (бывш. «На солнце»): белая кнопка со значком «аА»; включён — контурная, подпись «Обычный текст» */
.sun { display: inline-flex; align-items: center; gap: 8px; background: #fff; color: #06180F; border: 2px solid #fff; }
.sun[aria-pressed="true"] { background: transparent; color: #fff; }
.sun-ico { font: 700 15px/1 var(--f-text); letter-spacing: -.02em; white-space: nowrap; }
.sun-ico b { font-size: 24px; font-weight: 800; }
/* шапка — всегда одна строка (2026-11-05: длинная область + подпись «аА» переносили инструменты вниз):
   меню и знак не сжимаются, область обрезается многоточием, подпись «аА» — только где хватает места */
.top-in { flex-wrap: nowrap; }
.brand, .verbs { flex: none; }
.verbs { flex-wrap: nowrap; white-space: nowrap; }
.top-tools { min-width: 0; }
.region { min-width: 0; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sun { flex: none; }
.verbs a, .verbs span { padding: 0 10px; }
@media (max-width: 1239px) {
  .sun { width: 48px; padding: 0; justify-content: center; }
  .sun-lbl { display: none; }
}
@media (max-width: 1000px) {
  .verbs a, .verbs span { padding: 0 8px; }
  .brand span { font-size: 18px; line-height: 1.05; max-width: 6em; }
}
@media (min-width: 761px) and (max-width: 900px) {
  .brand span { display: none; }  /* знак остаётся, имя — в aria-label ссылки; иначе области не остаётся места */
}
@media (max-width: 760px) {
  .verbs { display: none; }
  .brand span { font-size: 19px; }
  .top-in { flex-wrap: nowrap; gap: 8px; }
  .brand span { font-size: 16px; line-height: 1.05; max-width: 6em; }
  .brand img { width: 30px; height: 30px; }
  .top-tools { margin-left: auto; min-width: 0; }
  .region { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 12px; }
  .sun { width: 48px; padding: 0; flex: none; justify-content: center; }
  .sun-lbl { display: none; }
}

/* выбор области */
.region-dlg { border: var(--card-line); border-radius: var(--r-card); max-width: 520px; width: calc(100% - 32px); padding: 20px; color: #1E3125; }
.region-dlg h2 { margin-top: 0; color: #10241A; }
.region-dlg input { width: 100%; font: inherit; min-height: var(--touch); padding: 0 12px; border: 2px solid #3E5046; border-radius: var(--r-btn); }
.region-list { list-style: none; padding: 0; margin: 12px 0; max-height: 50vh; overflow: auto; }
.region-list button { width: 100%; text-align: left; font: inherit; min-height: 48px; padding: 0 10px; border: 0; background: none; border-bottom: 1px solid #E5DFD3; cursor: pointer; color: #1E3125; }
.region-list button:hover { background: #F1EEE6; }
.btn-ghost { font: inherit; min-height: 48px; padding: 0 16px; border-radius: var(--r-btn); border: 2px solid #0C3824; background: #fff; color: #0C3824; font-weight: 700; cursor: pointer; }

/* крошки и подвал */
.crumbs { font-size: var(--fs-small); color: var(--muted); padding: 14px 0 6px; }
html[data-view="sun"] .crumbs, html[data-view="sun"] .crumbs a { color: #D1E7DC; }
.foot { margin-top: 48px; padding: 24px 0; border-top: 1px solid var(--line); font-size: var(--fs-small); }
html[data-view="sun"] .foot { color: #D1E7DC; }
.tabbar { position: fixed; left: 0; right: 0; bottom: 0; display: none; background: var(--card); border-top: var(--card-line); }
.tabbar a, .tabbar span { flex: 1; text-align: center; min-height: 56px; display: flex; align-items: center; justify-content: center; color: var(--tab-off); text-decoration: none; font-weight: 700; font-size: var(--fs-small); }
@media (max-width: 760px) { .tabbar { display: flex; } }
@media (min-width: 761px) { body { padding-bottom: 0; } }

/* карточки и герой */
.hero { display: grid; gap: 24px; align-items: start; margin: 8px 0 24px; }
.hero.has-photo { grid-template-columns: 1fr minmax(260px, 420px); }
@media (max-width: 760px) { .hero.has-photo { grid-template-columns: 1fr; } .hero-photo { order: -1; } }
.kicker { text-transform: uppercase; letter-spacing: .06em; font-size: var(--fs-small); font-weight: 800; color: var(--muted); margin: 0 0 4px; }
html[data-view="sun"] .kicker, html[data-view="sun"] .latin, html[data-view="sun"] .lead-plain { color: #D1E7DC; }
.latin { font-style: italic; color: var(--muted); margin-top: -4px; }
.hero-photo { margin: 0; background: var(--card); border: var(--card-line); border-radius: var(--r-card); overflow: hidden; box-shadow: var(--shadow); }
.hero-photo img { width: 100%; height: auto; display: block; aspect-ratio: 4 / 3; object-fit: cover; }
.hero-photo figcaption { font-size: var(--fs-small); color: var(--muted); padding: 8px 12px; }
html[data-view="sun"] .hero-photo { max-height: 220px; }
.tag { display: inline-block; font-size: 14px; font-weight: 800; padding: 1px 8px; border-radius: 6px; background: var(--line); color: var(--text); }
.tag-key { background: var(--key); color: #fff; }
.verdict { background: var(--card); border: var(--card-line); border-radius: var(--r-card); padding: 14px 16px; margin: 14px 0; box-shadow: var(--shadow); }
.verdict p { margin: 0; }
.mine { background: var(--card); border: var(--card-line); border-radius: var(--r-card); padding: 14px 16px; margin: 14px 0; }
.mine h2 { font-size: 1.1em; margin: 0 0 4px; }
.mine .og-list { margin: 0; }
.mine .og-list li { padding: 8px 0; border-bottom: 1px solid var(--line); }
.mine .og-list li:last-child { border-bottom: 0; }
.mine p { margin: 6px 0 0; }
.verdict .ok { color: #0C3824; font-weight: 800; }
.verdict .no { color: var(--warn-text); font-weight: 800; }
.btn { font: 800 var(--fs)/1 var(--f-text); min-height: var(--touch); padding: 0 22px; border-radius: var(--r-btn); border: 0; background: var(--brand); color: #fff; cursor: pointer; }
html[data-view="sun"] .btn { background: #005A32; border: 2px solid #fff; }
a.btn { display: inline-flex; align-items: center; text-decoration: none; } /* ссылка-кнопка: строчная — высота и отступы не работали */
.btn:disabled { opacity: .75; cursor: not-allowed; }

.facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin: 8px 0 8px; }
.fact { background: var(--card); border: var(--card-line); border-radius: var(--r-card); padding: 12px 14px; box-shadow: var(--shadow); }
.fact h3 { margin: 0 0 4px; font-size: var(--fs-small); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.fact p { margin: 0; color: var(--text); }

.verb, .text, .specs, .sources, .group, .lead { background: var(--sec-bg); border: var(--sec-line); border-top: var(--sec-top); border-radius: var(--r-card); padding: var(--sec-pad); margin: 28px 0; box-shadow: var(--sec-shadow); }
html:not([data-view="sun"]) :is(.verb, .text, .specs, .sources, .group, .lead) { border-radius: 0; }
.text p, .text li, .lead p, .verb > p, .text h3 { max-width: var(--measure); }
.text .text { border: 0; margin: 0; padding: 0; }
.verb > h2, .text > h2, .specs > h2, .sources > h2, .group > h2 { margin-top: .7em; }
html[data-view="sun"] .verb h2, html[data-view="sun"] .text h2, html[data-view="sun"] .specs h2, html[data-view="sun"] .sources h2, html[data-view="sun"] .group h2,
html[data-view="sun"] .verb h3, html[data-view="sun"] .text h3 { color: #0A140E; }
html[data-view="sun"] h1 { color: #fff; }
.lead { padding-top: 14px; }
.cards { list-style: none; padding: 0; margin: 8px 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.cards li { border: 1px solid var(--line); border-radius: var(--r-btn); padding: 8px 12px; min-height: var(--touch); display: flex; flex-direction: column; justify-content: center; }
html[data-view="sun"] .cards li { border: 2px solid #000; }
.cards li.main { border-color: var(--brand); border-width: 2px; }
.cards a { font-weight: 800; text-decoration: none; }
.cards a:hover { text-decoration: underline; }
.cards small { color: var(--muted); font-size: var(--fs-small); }
.chips { list-style: none; padding: 0; margin: 8px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.chips li > * { display: inline-flex; align-items: center; min-height: 48px; padding: 0 16px; border-radius: 999px; border: 2px solid var(--brand); font-weight: 700; text-decoration: none; }
.chips span { border-color: var(--line) !important; color: var(--muted); }
html[data-view="sun"] .chips span { color: #243329; }
.season { border-top: 1px solid var(--line); padding-top: .6em; }
.works { list-style: none; padding: 0; margin: 0; }
.work { padding: 8px 0; }
.work p { margin: 2px 0 0; color: var(--muted); font-size: var(--fs-small); }
.more { font-weight: 800; }
.specs dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); column-gap: 24px; }
.specs dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.specs dt { color: var(--muted); }
.specs dd { margin: 0; font-weight: 700; text-align: right; }
.specs .low dd::after { content: " *"; color: var(--muted); }
/* характеристики по профилю растения (2026-11-05): главное — крупнее, группы — подзаголовками, Госреестр свёрнут */
.specs .spec-main dd { font-size: 1.05em; }
.specs .none dd { font-weight: 400; font-style: italic; color: var(--muted); }
.specs h3 { margin: 1.4em 0 .3em; font: 800 var(--fs-small)/1.3 var(--f-text); letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.specs .spec-reg { margin-top: 1.4em; }
.specs .spec-reg > summary { cursor: pointer; font-weight: 800; color: var(--brand); min-height: var(--touch); display: flex; align-items: center; }
html[data-view="sun"] .specs .spec-reg > summary { color: #0A140E; }
.sources { font-size: var(--fs-small); }
.text ul { padding-left: 1.2em; }
.lead-plain { font-size: calc(var(--fs) + 2px); color: var(--muted); max-width: 46em; }
.doors { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; margin: 16px 0; }
.door { display: block; background: var(--card); border: var(--card-line); border-radius: var(--r-card); padding: 6px 18px 12px; text-decoration: none; color: var(--text); box-shadow: var(--shadow); }
.door h2 { margin-top: .5em; }
.door:hover { border-color: var(--brand); }
details { margin: 8px 0; }
details > summary { cursor: pointer; font-weight: 800; color: var(--brand); min-height: 48px; display: flex; align-items: center; }
.table-tools input { font: inherit; width: 100%; max-width: 420px; min-height: var(--touch); padding: 0 12px; border: 2px solid var(--muted); border-radius: var(--r-btn); margin: 8px 0; background: #fff; color: #1E3125; }
.table-wrap { overflow-x: auto; }
.sorts { width: 100%; border-collapse: collapse; background: var(--card); font-size: var(--fs-small); }
.sorts th, .sorts td { text-align: left; padding: 10px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.sorts th { color: var(--muted); font-weight: 800; }
.sorts td:first-child { font-size: var(--fs); }
.sorts a { font-weight: 800; }
html[data-view="sun"] .sorts td, html[data-view="sun"] .sorts th { color: #0A140E; border-color: #000; }
.chips small { font-weight: 600; margin-left: 4px; }
.pager { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0; }
.pager a, .pager span { min-width: 48px; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--brand); border-radius: var(--r-btn); font-weight: 800; text-decoration: none; }
.pager span { background: var(--brand); color: #fff; }
html[data-view="sun"] .pager a { background: #fff; }
html[data-view="sun"] main > p a, html[data-view="sun"] .lead-plain a { color: #FFFFFF; }
.small { font-size: var(--fs-small); }
@media (max-width: 760px) {
  .treat thead { display: none; }
  .treat, .treat tbody, .treat tr, .treat td { display: block; width: 100%; }
  .treat tr { border-bottom: 2px solid var(--line); padding: 8px 0; }
  .treat td { border: 0; padding: 2px 0; }
  .treat td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); font-weight: 700; }
}

/* календарь: срок работы перед названием (calendar.js) */
.works .when { display: inline-block; min-width: 8.5em; font-weight: 700; font-variant-numeric: lining-nums tabular-nums; }
.tabbar [aria-disabled="true"] { opacity: .6; }

/* инструменты АР (/instrumenty/…): поиск, карточка препарата, калькулятор, уведомление пасечникам */
.tool label, .home-search label { display: block; font-weight: 700; margin: 16px 0 6px; }
.tool input, .tool select, .tool textarea, .home-search input { font: inherit; width: 100%; max-width: 520px; min-height: var(--touch); padding: 8px 12px; border: 2px solid var(--muted); border-radius: var(--r-btn); background: #fff; color: #1E3125; box-sizing: border-box; }
.tool-form div { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.tool-form input { flex: 1 1 240px; }
.tool-res { padding-left: 1.2em; }
.tool-res li { margin: 10px 0; }
.tool-res a { display: inline-block; min-height: 44px; line-height: 44px; font-weight: 700; }
.tool-card { border: 2px solid var(--line); border-radius: var(--r-btn); padding: 16px; margin: 16px 0; }
.tool-out strong { font-size: calc(var(--fs) + 8px); }
.badge { display: inline-block; padding: 4px 12px; border-radius: 999px; border: 2px solid var(--brand); font-weight: 700; }
.badge.warn { border-color: var(--warn-line); background: var(--warn-bg); color: var(--warn-text); }
.note { border-left: 4px solid var(--warn-line); padding: 8px 12px; }

/* «Мой огород» (app/garden/ui.ts): дела с «Сделано», карточки культур, мастер добавления, плашка отмены */
.og-list { list-style: none; padding: 0; margin: 8px 0; }
.og-due { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.og-due.late strong { color: var(--warn-text); }
.og-due .btn { flex: none; }
.og-done { flex: none; font-weight: 700; color: var(--muted); }
.og-cards { list-style: none; padding: 0; display: grid; gap: 12px; }
.og-cards a { display: grid; gap: 4px; padding: 14px 16px; border: 2px solid var(--line); border-radius: var(--r-btn); text-decoration: none; color: inherit; }
.og-choice { list-style: none; padding: 0; display: grid; gap: 10px; max-width: 520px; }
.og-choice .btn-ghost { width: 100%; text-align: left; }
.og-check { display: flex; gap: 12px; align-items: flex-start; min-height: 48px; padding: 8px 0; cursor: pointer; }
.og-check input { width: 24px; height: 24px; flex: none; margin-top: 2px; }
.og-input { font: inherit; min-height: var(--touch); padding: 0 12px; border: 2px solid var(--muted); border-radius: var(--r-btn); background: #fff; color: #1E3125; max-width: 100%; box-sizing: border-box; }
#ogorod label { display: block; font-weight: 700; margin: 12px 0 6px; }
#og-q { width: 100%; max-width: 520px; }
.og-mark { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.og-mark label { flex-basis: 100%; }
.og-mark p { flex-basis: 100%; margin: 0; }
.og-hist { padding-left: 1.2em; }
.og-toast { position: fixed; left: 16px; right: 16px; bottom: calc(var(--touch) + 24px); max-width: 560px; margin: 0 auto; padding: 12px 16px; border-radius: var(--r-btn); background: #0C3824; color: #fff; display: flex; justify-content: space-between; align-items: center; gap: 12px; z-index: 20; }
.og-toast .btn-ghost { background: transparent; color: #fff; border-color: #fff; }
.og-file { margin: 24px 0; }
.og-text { width: 100%; max-width: 560px; min-height: 96px; padding: 8px 12px; }
.og-ask { flex-basis: 100%; color: var(--muted); }
.og-due:has(.og-ask) { flex-wrap: wrap; }
.og-shop-big { position: fixed; inset: 0; z-index: 30; overflow: auto; padding: 24px 16px; background: var(--bg); font-size: 1.6rem; line-height: 1.4; }
.og-shop-big ul { list-style: none; padding: 0; margin: 0 0 24px; }
.og-shop-big li { padding: 12px 0; border-bottom: 1px solid var(--line); }
.og-shop-big input { width: 32px; height: 32px; margin-right: 8px; vertical-align: middle; }
@media print {
  .top, .crumbs, .foot, .tabbar, .og-toast, .og-noprint { display: none !important; }
}
.og-item { margin-top: 4px; }
.og-item summary { color: var(--muted); cursor: pointer; }
.og-item p { margin: 8px 0; }
.og-result { padding: 12px 0; border-bottom: 1px solid var(--line); display: grid; gap: 8px; }
.og-stars { display: flex; gap: 4px; }
.og-stars button { min-width: var(--touch); min-height: var(--touch); font-size: 1.5rem; line-height: 1; border: 0; background: none; color: var(--muted); cursor: pointer; }
.og-stars button.on { color: #B8860B; }
@media print { .og-stars button:not(.on) { display: none; } }
.og-also { flex-basis: 100%; border: 1px solid var(--line); border-radius: var(--r-btn); padding: 8px 12px; margin: 0; }
.og-also legend { padding: 0 4px; }
.og-note { display: block; font-size: 0.95em; color: var(--muted); }
p.og-note { border-left: 3px solid var(--line); padding-left: 12px; }
.og-toast { flex-wrap: wrap; }
.og-ask-what { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.og-ask-what > span { flex-basis: 100%; }
.og-ask-what .og-input { flex: 1 1 160px; color: var(--text); background: var(--bg); }
.og-choice .og-check { display: flex; margin: 6px 0; }
.og-sample { font-size: var(--fs); border-left: 3px solid var(--line); padding-left: 12px; }
.og-once { border: 1px solid var(--line); border-radius: var(--r-btn); padding: 12px; margin-top: 16px; }
.og-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0; }
.og-thumb { width: 96px; height: 96px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); display: block; }
.og-photo { display: inline-flex; flex-direction: column; gap: 4px; max-width: 100%; }
.og-photo small { color: var(--muted); }
.og-sortq { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 6px 0; }
.og-sortq > span { flex-basis: 100%; }
.og-sortq [aria-pressed="true"] { background: var(--brand); color: var(--on-brand); }
.og-carry { border: 2px solid var(--brand); border-radius: var(--r-btn); padding: 16px; }
.og-past { background: var(--line); padding: 8px 12px; border-radius: var(--r-btn); }
.og-bigcode { font-size: 2em; letter-spacing: .15em; font-variant-numeric: lining-nums tabular-nums; }

/* ---------- вид «Журнал» (design/ui-audit, направление А, 2026-11-02) ---------- */
.foot-links { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.foot-links a, .foot-links span { min-height: 44px; display: inline-flex; align-items: center; }
.foot-links span { color: var(--muted); }
html[data-view="sun"] .foot a { color: #fff; }
.tabbar svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tabbar a, .tabbar span { flex-direction: column; gap: 2px; min-height: 64px; font-size: 14px; }
.tabbar [aria-current="page"] { color: var(--brand); }
html[data-view="sun"] .tabbar [aria-current="page"] { color: #005A32; }
.btn-light { background: #fff; color: var(--brand); }
html[data-view="sun"] .btn-light { background: #fff; color: #06180F; border: 2px solid #000; }

/* обложка страницы растения */
.cover { display: grid; gap: 40px; align-items: center; margin: 8px 0 28px; }
.cover.has-pic { grid-template-columns: 1.1fr .9fr; }
.cover h1 { font-size: calc(64px * var(--zoom)); line-height: 1.05; margin: 4px 0 8px; }
.cover .latin { font-size: calc(var(--fs) + 1px); }
.cover .btn { margin-top: 12px; }
.cover-pic { margin: 0; background: #fff; border-radius: 20px; overflow: hidden; border: var(--card-line); }
.cover-pic img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.cover-pic figcaption { font-size: var(--fs-small); color: var(--muted); padding: 10px 14px; }
html[data-view="sun"] .cover-pic figcaption { color: #243329; }
html[data-view="sun"] .cover-pic img { max-height: 220px; }

/* «Сейчас»: что делать с растением в этом месяце для области (static/plant.js) */
.now { display: grid; grid-template-columns: minmax(180px, auto) 1fr auto; gap: 28px; align-items: center; background: var(--brand); color: #fff;
  border-radius: 18px; padding: 24px 28px; margin: 0 0 8px; }
html[data-view="sun"] .now { background: #005A32; border: 2px solid #fff; }
.now-when { font: 700 calc(36px * var(--zoom))/1.05 var(--f-head); }
.now-when small { display: block; font: 800 14px/1.3 var(--f-text); letter-spacing: .07em; text-transform: uppercase; color: #CFE5D6; margin-bottom: 6px; }
.now-body p { margin: 0; font-size: calc(var(--fs) + 1px); }
.now-body strong { color: #fff; }
.now-list { list-style: none; margin: 0; padding: 0; }
.now-list li { padding: 4px 0; }
.now-list span { color: #CFE5D6; white-space: nowrap; }
.now .btn { white-space: nowrap; }

/* коротко: строка фактов без карточек */
.strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 28px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.strip > div { padding: 16px 20px 16px 0; }
.strip > div:not(:nth-child(3n + 1)) { border-left: 1px solid var(--line); padding-left: 20px; }
.strip > div:nth-child(n + 4) { border-top: 1px solid var(--line); }
.strip dt { font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.strip dd { margin: 4px 0 0; }
html[data-view="sun"] .strip { background: var(--card); border: var(--card-line); border-radius: var(--r-card); padding: 0 16px; }

/* три двери растения (вариант Б): рисунок-плитка слева, заголовок, что внутри, действие; рисунки — одна серия, static/doors/.
   Фон рисунков чуть разный — плитка песочная, смешивание «затемнение» делает его ровным у всех трёх */
.doors3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 28px 0; }
.door3 { display: flex; gap: 16px; align-items: flex-start; padding: 16px; background: var(--card); border: var(--card-line); border-radius: 18px; text-decoration: none; color: var(--text); box-shadow: var(--shadow); }
.door3:hover { border-color: var(--brand); }
.door3-pic { flex: 0 0 calc(112px * var(--zoom)); aspect-ratio: 1; border-radius: 14px; background: var(--sand); overflow: hidden; }
.door3-pic img { display: block; width: 100%; height: 100%; object-fit: cover; mix-blend-mode: darken; }
.door3-t { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.door3-t strong { font: 700 calc(24px * var(--zoom))/1.2 var(--f-head); color: var(--head); }
.door3-t span { color: var(--muted); overflow-wrap: break-word; }
.door3-t em { font-style: normal; font-weight: 700; color: var(--brand); margin-top: 4px; }
.door3:hover em { text-decoration: underline; }
html[data-view="sun"] .door3-t strong, html[data-view="sun"] .door3-t em { color: #0A140E; }
html[data-view="sun"] .door3-pic { flex-basis: 72px; }

/* год растения: 12 месяцев, окна работ полосами (static/plant.js) */
.year { background: var(--card); border: var(--card-line); border-radius: 18px; padding: 8px 24px 16px; margin: 28px 0; box-shadow: var(--shadow); }
.year h2 { margin-top: .6em; }
html[data-view="sun"] .year h2 { color: #0A140E; }
.yr-months, .yr-row { display: grid; grid-template-columns: 112px minmax(0, 1fr) 220px; gap: 0 16px; align-items: center; }
.yr-months { grid-template-columns: 128px repeat(12, minmax(0, 1fr)) 236px; gap: 0; }
.yr-months > span:first-child { grid-column: 2; }
.yr-months > span { text-align: center; font-size: 14px; font-weight: 800; color: var(--muted); padding: 4px 0; border-left: 1px solid var(--line); }
.yr-months > span.on { background: var(--leaf); color: var(--brand); border-radius: 6px 6px 0 0; }
.yr-row { padding: 6px 0; }
.yr-lab { font-weight: 800; }
.yr-track { position: relative; height: 26px; border-radius: 6px;
  background: repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px calc(100% / 12)); }
.yr-bar { position: absolute; top: 3px; bottom: 3px; border-radius: 999px; }
.yr-now { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--key); }
.yr-when { font-size: var(--fs-small); color: var(--muted); }
.yr-sow { background: #A9CDA5; }
.yr-plant { background: #4E8A5C; }
.yr-bloom { background: #E2A9C0; }
.yr-crop { background: #D0553B; }
.yr-cut { background: #8E7A5A; }
.yr-cover { background: #8FB3D1; }

/* статья: оглавление слева, текст колонкой */
.article { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 48px; margin-top: 12px; }
.toc { position: sticky; top: calc(var(--top-h, 132px) + 16px); align-self: start; display: grid; gap: 2px; border-left: 3px solid var(--leaf); padding-left: 16px; }
.toc a { text-decoration: none; font-weight: 700; padding: 6px 0; line-height: 1.3; }
.toc a:hover { text-decoration: underline; }
html[data-view="sun"] .toc { display: none; }
html[data-view="sun"] .article { grid-template-columns: minmax(0, 1fr); }
.article-body > :first-child { margin-top: 0; }

/* плитки с картинкой: сорта, проблемы */
.tiles { list-style: none; padding: 0; margin: 12px 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.tiles li > a, .tiles li > span { display: flex; flex-direction: column; height: 100%; background: var(--card); border: var(--card-line); border-radius: 14px; overflow: hidden; text-decoration: none; color: var(--head); }
.tiles li > a:hover { border-color: var(--brand); }
.tile-pic { aspect-ratio: 1; background: var(--sand); display: block; overflow: hidden; }
.tile-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tile-pic.cut { background: var(--ill-bg); }
.tile-pic.cut img { object-fit: contain; padding: 8px; }
.tile-name { font-weight: 800; padding: 10px 12px 12px; line-height: 1.25; }
.tiles small { color: var(--muted); padding: 0 12px 10px; font-size: var(--fs-small); margin-top: -8px; }
.tiles-problem { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.tiles-problem .tile-pic { aspect-ratio: 4 / 3; }

details.season { border-top: 1px solid var(--line); margin: 0; }
details.season > summary { font: 700 calc(21px * var(--zoom)) var(--f-head); color: var(--head); }
details.season > summary small { font: 700 var(--fs-small) var(--f-text); color: var(--muted); margin-left: 6px; }
html[data-view="sun"] details.season > summary { color: #0A140E; }

@media (max-width: 900px) {
  .article { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .toc { position: static; border-left: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 16px; }
  .toc .kicker { flex-basis: 100%; }
}
@media (max-width: 760px) {
  .cover { gap: 16px; margin-top: 0; }
  .cover.has-pic { grid-template-columns: 1fr; }
  .cover-pic { order: -1; border-radius: 16px; }
  .cover h1 { font-size: calc(44px * var(--zoom)); }
  .now { grid-template-columns: 1fr; gap: 12px; padding: 20px; }
  .now .btn { justify-self: start; }
  .strip { grid-template-columns: 1fr; }
  .strip > div:nth-child(n) { border-left: 0; border-top: 0; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .strip > div:last-child { border-bottom: 0; }
  .doors3 { grid-template-columns: 1fr; gap: 12px; }
  .door3 { padding: 12px; gap: 14px; }
  .door3-pic { flex-basis: 88px; }
  .door3-t strong { font-size: 22px; }
  .door3-t span { font-size: var(--fs-small); }
  .year { padding: 4px 14px 12px; }
  .yr-months { grid-template-columns: 80px repeat(12, minmax(0, 1fr)); }
  .yr-months > span { font-size: 12px; }
  .yr-row { grid-template-columns: 64px minmax(0, 1fr); }
  .yr-lab { font-size: 14px; }
  .yr-when { grid-column: 2; font-size: 14px; }
  .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
details.fold { border-top: 1px solid var(--line); margin: 0; max-width: var(--measure); }
details.fold > summary { font-size: calc(var(--fs) + 1px); color: var(--head); }
details.fold[open] > summary { color: var(--brand); }
html[data-view="sun"] details.fold > summary { color: #0A140E; }

/* главная, вариант «в» (design/home/BRIEF.md, 2026-11-07): общие классы — поиск, кружки, цифры */
.home-search-hint { color: #CFE5D6; font-size: var(--fs-small) !important; margin: 8px 0 0; }
.home-search { margin: 0 0 40px; }
.home-search > div { display: flex; gap: 10px; }
.home-search input { max-width: none !important; flex: 1; min-width: 0; min-height: 60px !important; }
.rounds { list-style: none; padding: 0; margin: 16px 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px 16px; }
.rounds li[hidden] { display: none; }
.rounds li > a, .rounds li > span { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; font-weight: 800; text-decoration: none; color: var(--head); }
html[data-view="sun"] .rounds li > a { color: #fff; }
.round { width: 100%; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--leaf); border: var(--card-line); display: grid; place-items: center; }
.round img { width: 100%; height: 100%; object-fit: cover; }
/* рисунок растения (pl/) — с широкими белыми полями: обрезать и приблизить, как на главной (design/home/BRIEF.md, этап 6) */
.round:not(.cut) img[src*="/img/pl/"] { transform: scale(1.35); object-position: 50% 45%; }
.round:has(img[src*="/img/pl/"]) { background: #fff; }
.round.cut { background: var(--ill-bg); }
.round.cut img { object-fit: contain; padding: 10%; }
.round b { font: 700 calc(44px * var(--zoom)) var(--f-head); color: var(--brand); }
.rounds a:hover .round { border-color: var(--brand); }
.home-facts { border-top: 2px solid var(--head); padding-top: 8px; margin: 0 0 40px; }
html[data-view="sun"] .home-facts { border-color: #fff; }
.home-facts ul { list-style: none; margin: 12px 0 16px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.home-facts li { color: var(--muted); }
.home-facts b { display: block; font: 700 calc(40px * var(--zoom)) / 1.1 var(--f-head); color: var(--head); }
.home-about summary { cursor: pointer; font-weight: 800; min-height: 44px; display: flex; align-items: center; }
.home-about .text h2 { display: none; }
.doors-rule { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; border-top: 2px solid var(--head); margin: 40px 0; }
html[data-view="sun"] .doors-rule { border-color: #fff; }
.doors-rule a { text-decoration: none; color: var(--text); padding: 16px 0; }
.doors-rule h2 { margin: 0 0 6px; }
.doors-rule p { color: var(--muted); margin: 0; }
html[data-view="sun"] .doors-rule a { background: var(--card); border: var(--card-line); border-radius: var(--r-card); padding: 12px 16px; margin-top: 16px; }
html[data-view="sun"] .doors-rule h2 { color: #0A140E; }
@media (max-width: 760px) {
  .home-search > div .btn { padding: 0 16px; }
  .rounds { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 12px; }
  .home-facts b { font-size: calc(30px * var(--zoom)); }
  .doors-rule { grid-template-columns: 1fr; gap: 0; }
  .doors-rule a { border-bottom: 1px solid var(--line); }
}
@media (max-width: 960px) { .home-facts ul { grid-template-columns: repeat(2, 1fr); } }
/* главная: свои блоки hm-* — перенесены из макета design/home/mockup/mockup.css */
/* «кто мы» */
.hm-who { margin: 24px 0 20px; font: 400 calc(22px * var(--zoom))/1.35 var(--f-head); color: var(--head); max-width: 52em; }
.hm-who strong { font-weight: 700; }
.hm-who small { display: block; margin-top: 6px; font: var(--fs-small)/1.4 var(--f-text); color: var(--muted); }

/* первый экран: справочник | месяц */
.hm-often { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; margin: 14px 0 0; font-size: var(--fs-small); }
.hm-often span { color: var(--muted); }
.hm-often a { padding: 4px 10px; border-radius: 999px; background: var(--leaf); color: var(--brand); text-decoration: none; font-weight: 700; }
.hm-often a:hover { text-decoration: underline; }
.hm-top { display: grid; grid-template-columns: 1.15fr .85fr; gap: 24px; align-items: stretch; margin-bottom: 28px; }
.hm-find { background: var(--card); border: var(--card-line); border-radius: 22px; padding: 28px 28px 24px; display: flex; flex-direction: column; }
.hm-find .hm-kinds { margin-top: auto; padding-top: 18px; }
.hm-find h1 { margin: 0 0 14px; font-size: calc(40px * var(--zoom)); }
.hm-find .home-search { margin: 0; }
.hm-find .home-search label { margin-top: 0; }
.hm-kinds { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.hm-kinds a { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 10px 10px 12px; border: var(--card-line); border-radius: var(--r-card);
  background: var(--bg); text-decoration: none; color: var(--head); }
.hm-kinds a:hover { border-color: var(--brand); }
.hm-kinds .pic { width: 100%; aspect-ratio: 1; border-radius: 10px; background: var(--ill-bg, var(--sand)); overflow: hidden; margin-bottom: 8px; display: grid; place-items: center; }
/* квадраты, как и круги: рисунок обрезан и приближен, а не вписан с полями */
.hm-kinds .pic { background: #fff; }
.hm-kinds .pic img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.35); object-position: 50% 45%; }
.hm-kinds .pic.photo img { transform: none; }
.hm-kinds .pic:has(svg) { background: var(--leaf); }
.hm-kinds .pic svg { width: 54%; height: 54%; stroke: var(--brand); fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.hm-kinds b { font-weight: 800; line-height: 1.2; font-size: calc(15px * var(--zoom)); }
.hm-kinds span { color: var(--muted); font-size: var(--fs-small); }

.hm-month { background: var(--brand); color: #fff; border-radius: 22px; padding: 26px 28px 24px; display: flex; flex-direction: column; }
.hm-month .kicker { color: #CFE5D6; margin: 0 0 8px; }
.hm-q { font: 700 calc(27px * var(--zoom))/1.15 var(--f-head); color: #fff; margin: 0 0 16px; }
.hm-q button { font: inherit; color: #fff; background: none; border: 0; border-bottom: 3px solid #CFE5D6; padding: 0; cursor: pointer; text-align: left; }
.hm-q button::after { content: " ▾"; font-size: .55em; vertical-align: middle; }
.hm-jobs { list-style: none; margin: 0 0 18px; padding: 0; flex: 1; }
.hm-jobs li { display: flex; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.hm-jobs li:first-child { padding-top: 0; }
/* рисунок растения в круге — обрезаем (cover) и приближаем: у рисунков широкие белые поля */
.hm-av { flex: none; width: 56px; height: 56px; border-radius: 50%; overflow: hidden; background: #fff; }
.hm-av img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.45); object-position: 50% 45%; }
.hm-jobs a { color: #fff; font-weight: 800; }
.hm-jobs span { display: block; color: #CFE5D6; font-size: var(--fs-small); }
.hm-month .btn-light { align-self: flex-start; }
.hm-month .hm-note { color: #CFE5D6; font-size: var(--fs-small); margin: -6px 0 14px; }

/* мой огород */
.hm-garden { display: flex; gap: 20px; align-items: center; margin: 0 0 44px; padding: 20px 24px; border-radius: var(--r-card); background: var(--leaf); }
.hm-garden svg { flex: none; width: 56px; height: 56px; stroke: var(--brand); fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.hm-garden div { flex: 1; }
.hm-garden h2 { margin: 0 0 4px; font-size: calc(24px * var(--zoom)); }
.hm-garden p { margin: 0; max-width: 44em; }
.hm-garden .btn { flex: none; }
.hm-garden.has { background: var(--card); border: var(--card-line); }

/* двери — как на странице растения (.doors3), подссылки строкой под карточкой */
.hm-sec { margin: 0 0 44px; }
.hm-sec > h2 { margin: 0 0 16px; }
.hm-doors { margin: 0; }
.hm-door { display: flex; flex-direction: column; gap: 10px; }
.hm-door .door3 { flex: 1; }
.hm-door .tag-month { display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--brand); background: var(--leaf);
  border-radius: 6px; padding: 2px 8px; margin-bottom: 4px; align-self: flex-start; }
.hm-door .tag-month[hidden] { display: none; }
.hm-door .sub { display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 0 4px; font-size: var(--fs-small); font-weight: 700; }

/* разделы кружками — .rounds сайта; рисунок обрезан кругом и приближен, а не вписан */
.hm-cats .rounds { margin: 0; }
.round.hm-crop { background: #fff; }
.round.hm-crop img { object-fit: cover; transform: scale(1.35); object-position: 50% 45%; }

/* советы */
.hm-tips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.hm-tip { display: flex; flex-direction: column; background: var(--card); border: var(--card-line); border-radius: var(--r-card); overflow: hidden; text-decoration: none; color: var(--text); }
.hm-tip:hover { border-color: var(--brand); }
.hm-tip .pic { aspect-ratio: 16 / 9; background: #fff; overflow: hidden; }
.hm-tip .pic img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.2); object-position: 50% 40%; }
.hm-tip .pic.photo img { transform: none; }
.hm-tip .pic.photo img { object-fit: cover; padding: 0; }
.hm-tip .t { padding: 14px 16px 16px; }
.hm-tip .t .kicker { display: block; margin: 0 0 4px; }
.hm-tip h3 { margin: 0 0 6px; font-size: calc(21px * var(--zoom)); }
.hm-tip .line { display: block; margin: 0; color: var(--muted); font-size: var(--fs-small); }

/* подбор сорта — сначала растение */
.hm-pick > p { margin: -8px 0 16px; color: var(--muted); }
.hm-pick ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(9, 1fr); gap: 12px; }
.hm-pick a { display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; padding: 10px 6px 12px; text-align: center; background: var(--card);
  border: var(--card-line); border-radius: var(--r-card); text-decoration: none; color: var(--head); font-weight: 800; }
.hm-pick a:hover { border-color: var(--brand); }
.hm-sq { display: block; width: 100%; aspect-ratio: 1; border-radius: 10px; overflow: hidden; background: #fff; }
.hm-sq img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.35); object-position: 50% 45%; }
.hm-pick .other { border-style: dashed; }
.hm-pick .other span { font-weight: 400; color: var(--muted); font-size: var(--fs-small); }

/* алфавит */
.hm-abc { display: flex; flex-wrap: wrap; gap: 5px; }
.hm-abc a { min-width: 36px; min-height: 40px; display: grid; place-items: center; border: var(--card-line); border-radius: 8px; background: var(--card);
  text-decoration: none; font-weight: 700; color: var(--head); }
.hm-abc a:hover { border-color: var(--brand); }

@media (max-width: 960px) {
  .hm-top { grid-template-columns: 1fr; }
  .hm-kinds { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
  .hm-pick ul { grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 760px) {
  .hm-who { font-size: calc(18px * var(--zoom)); margin: 16px 0 14px; }
  .hm-find { padding: 18px 16px; border-radius: 18px; }
  .hm-find h1 { font-size: calc(28px * var(--zoom)); }
  .hm-kinds { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hm-kinds span { display: none; }
  .hm-often a:nth-child(n+5) { display: none; }
  .hm-month { padding: 20px 18px; border-radius: 18px; order: -1; } /* телефон: вопрос с областью — главное действие, первым */
  .hm-q { font-size: calc(24px * var(--zoom)); }
  .hm-garden { flex-direction: column; align-items: flex-start; padding: 18px; }
  .hm-garden svg { display: none; }
  .hm-sec { margin-bottom: 32px; }
  /* на телефоне длинные ряды — лентой с прокруткой вбок, а не столбиком: страница короче */
  .hm-tips, .hm-pick ul { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; padding-bottom: 6px; }
  .hm-tip { flex: 0 0 78%; scroll-snap-align: start; }
  .hm-pick li { flex: 0 0 30%; scroll-snap-align: start; }
  .hm-cats .rounds { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hm-abc-sec .hm-abc { display: none; }
  .hm-abc-sec .more { display: inline-block; }
}
.hm-abc-sec .more { display: none; }

html[data-view="sun"] .tag:not(.tag-key) { background: #E5DFD3; color: #0A140E; }

/* сорт: паспорт под заголовком, вердикт допуска полосой, характеристики карточками */
.cover h1.h1-sort { font-size: calc(46px * var(--zoom)); }
.cover-pic.cut img { object-fit: contain; }
/* рисунки нарисованы под фон сайта (2026-11-05): подложка рисунка — цвет фона, не белый, иначе вокруг белая рамка;
   у карточки с рисунком — тот же цвет; в контрастном виде карточки белые — и подложка белая */
html { --ill-bg: var(--bg); }
html[data-view="sun"] { --ill-bg: #fff; }
.cover-pic.cut, .tiles li > a:has(> .tile-pic.cut) { background: var(--ill-bg); }
html:not([data-view="sun"]) .cover-pic.cut { border-color: transparent; }
/* фон рисунка #FAFAFA, сайта — тёплый #FAF9F5: «darken» берёт тёмное из двух — светлый фон рисунка становится
   цветом подложки, сам рисунок (темнее) не меняется; края прямоугольника не видно */
:is(.cover-pic, .tile-pic, .round).cut img { mix-blend-mode: darken; }
.passport { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 20px 0 8px; border-top: 1px solid var(--line); }
.passport > div { padding: 12px 16px 12px 0; border-bottom: 1px solid var(--line); }
.passport > div:nth-child(2n) { padding-left: 16px; border-left: 1px solid var(--line); }
.passport dt { font-size: 14px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.passport dd { margin: 2px 0 0; font: 700 calc(24px * var(--zoom))/1.2 var(--f-head); color: var(--head); }
html[data-view="sun"] .passport { background: var(--card); border: var(--card-line); border-radius: var(--r-card); padding: 0 14px; }
html[data-view="sun"] .passport dd { color: #0A140E; }
html[data-view="sun"] .passport dt { color: #243329; }
.band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 28px; background: var(--brand); color: #fff;
  border: 0; border-radius: 18px; padding: 22px 28px; margin: 0 0 28px; box-shadow: none; }
.band p { margin: 0; font-size: calc(var(--fs) + 1px); flex: 1 1 320px; }
.band .ok, .verdict.band .ok { color: #fff; }
.band .ok::before { content: "✓ "; color: #9FD8B0; }
.band .no, .verdict.band .no { color: #FFE2D6; }
.band .no::before { content: "! "; }
html[data-view="sun"] .band { background: #005A32; border: 2px solid #fff; }
.lead { font-size: calc(var(--fs) + 2px); }
html:not([data-view="sun"]) .lead { border-top: 0; padding-top: 0; }
.specs dl { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; column-gap: 10px; }
.specs dl > div { display: block; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
.specs dt { font-size: var(--fs-small); }
.specs dd { text-align: left; margin-top: 2px; }
html[data-view="sun"] .specs dl > div { border: 1px solid #000; }
@media (max-width: 760px) {
  .cover h1.h1-sort { font-size: calc(32px * var(--zoom)); }
  .passport dd { font-size: calc(20px * var(--zoom)); hyphens: auto; overflow-wrap: break-word; }  /* «детерми-нантный» в полколонки */
  .band { padding: 18px 20px; }
  .specs dl { grid-template-columns: minmax(0, 1fr); gap: 0; }
  /* подпись над значением (2026-11-05): в строку «детерминантный» рвался посреди слова */
  .specs dl > div { display: block; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 10px 0; background: none; }
  .specs dd { text-align: left; margin-top: 2px; overflow-wrap: break-word; min-width: 0; }
}

/* пара «проблема × растение»: как узнать, чем обработать карточками */
.signs { border-left: 4px solid var(--warn-line); padding: 4px 0 4px 16px; margin: 16px 0; max-width: var(--measure); }
.signs p { margin: 0; font-size: calc(var(--fs) + 1px); }
.signs .kicker { font-size: 14px; margin-bottom: 4px; }
html[data-view="sun"] .signs { background: var(--card); border: var(--card-line); border-left: 6px solid var(--warn-line); border-radius: var(--r-card); padding: 10px 14px; }
html[data-view="sun"] .signs p { color: #0A140E; }
.cover-jump { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; }
.btn-ghost-dark { background: transparent; color: var(--brand); border: 2px solid var(--brand); }
html[data-view="sun"] .btn-ghost-dark { background: #fff; color: #06180F; }
.treat-cards { list-style: none; padding: 0; margin: 12px 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.treat-cards > li { background: var(--card); border: var(--card-line); border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; }
.tc-name { margin: 0; font-size: calc(var(--fs) + 1px); }
.tc-name a { font-weight: 800; }
.tc-name small { color: var(--muted); font-size: var(--fs-small); margin-left: 4px; }
.tc-doses { list-style: none; margin: 0; padding: 0; }
.tc-doses li { padding: 2px 0; }
.tc-meta { margin: auto 0 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--fs-small); color: var(--muted); border-top: 1px solid var(--line); padding-top: 8px; }
.tc-meta b { color: var(--head); }
html[data-view="sun"] .tc-meta b { color: #0A140E; }

/* хаб и подборки сортов: подбор крупными карточками с числом, плитки сортов */
.dek { font-size: calc(var(--fs) + 2px); color: var(--muted); max-width: 32em; }
html[data-view="sun"] .dek { color: #D1E7DC; }
.pick-h { font: 800 14px/1.3 var(--f-text); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin: 18px 0 8px; }
.picks { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.picks a { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 12px 14px; background: var(--card); border: var(--card-line); border-radius: 14px; text-decoration: none; color: var(--head); }
.picks a:hover, .picks a.mine { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.picks a.mine { background: var(--leaf); }
.pick-n { font: 700 calc(26px * var(--zoom))/1 var(--f-head); color: var(--brand); font-variant-numeric: lining-nums tabular-nums; }
.pick-l { font-weight: 700; line-height: 1.3; }
.picks-small { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
html[data-view="sun"] .pick-h { color: #243329; }
@media (max-width: 760px) {
  .picks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .picks-small { grid-template-columns: minmax(0, 1fr); }
}

/* препарат: паспорт в строку, вердикт полосой, нормы по культурам карточками */
.passport-wide { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 16px 0 20px; }
.passport-wide > div { padding-left: 16px; border-left: 1px solid var(--line); }
.passport-wide > div:first-child { padding-left: 0; border-left: 0; }
.passport-wide dd { font-size: calc(21px * var(--zoom)); }
.passport-wide small { font: 600 var(--fs-small) var(--f-text); color: var(--muted); }
.band-warn { background: #7A1B0C; }
html[data-view="sun"] .band-warn { background: #8A0808; }
.crop-cards { list-style: none; padding: 0; margin: 12px 0; columns: 3 300px; column-gap: 14px; }
.crop-cards > li { break-inside: avoid; margin-bottom: 14px; display: block; background: var(--card); border: var(--card-line); border-radius: 14px; padding: 4px 16px 10px; }
.crop-cards h3 { font: 700 calc(22px * var(--zoom)) var(--f-head); margin: 10px 0 4px; }
html[data-view="sun"] .crop-cards h3 { font-family: var(--f-text); color: #0A140E; }
.crop-cards ul { list-style: none; padding: 0; margin: 0; }
.crop-cards ul > li { padding: 8px 0; border-top: 1px solid var(--line); }
.crop-cards ul > li:first-child { border-top: 0; }
.cc-target { margin: 0; color: var(--muted); font-size: var(--fs-small); }
.cc-dose { margin: 2px 0 4px; font-weight: 700; }
.cc-dose small { font-weight: 600; color: var(--muted); }
.crop-cards .tc-meta { border-top: 0; padding-top: 0; }
.picks small { font-size: var(--fs-small); }
@media (max-width: 760px) {
  .passport-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .passport-wide > div:nth-child(odd) { padding-left: 0; border-left: 0; }
}
.cc-mark { margin: 0 0 2px; color: var(--muted); font-size: var(--fs-small); }
.crop-cards ul > li:has(> .cc-target) { border-top: 1px solid var(--line); }
.crop-cards ul > li:not(:has(> .cc-target)) { border-top: 0; padding-top: 0; }
.passport .dd-sm { font: 700 calc(var(--fs) + 1px)/1.3 var(--f-text); }

/* поиск: крупная строка, результаты строками во всю ширину */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.search-form { margin: 8px 0 12px; }
.s-list { list-style: none; padding: 0; margin: 8px 0; }
.s-list a { display: flex; flex-direction: column; gap: 2px; padding: 12px 40px 12px 0; border-bottom: 1px solid var(--line); text-decoration: none; position: relative; min-height: var(--touch); justify-content: center; }
.s-list a::after { content: "›"; position: absolute; right: 8px; top: 50%; transform: translateY(-50%); font-size: 28px; color: var(--muted); }
.s-list span { font-weight: 800; font-size: calc(var(--fs) + 1px); color: var(--head); }
.s-list small { color: var(--muted); font-size: var(--fs-small); }
.s-list a:hover span { text-decoration: underline; }
html[data-view="sun"] .s-list span { color: #0A140E; }

/* месяц: лента месяцев, работы карточками, заморозки плашкой */
.months { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); border-bottom: 2px solid var(--head); margin: 8px 0 20px; }
.months a, .months span { text-align: center; padding: 10px 0; font-weight: 800; text-decoration: none; color: var(--muted); border-radius: 10px 10px 0 0; }
.months a:hover { color: var(--brand); background: var(--leaf); }
.months [aria-current="page"] { background: var(--brand); color: #fff; }
html[data-view="sun"] .months { border-color: #fff; }
html[data-view="sun"] .months a { color: #D1E7DC; }
.month-plan > div > p:first-child { font-size: calc(var(--fs) + 1px); }
.month-plan h2 { margin-top: 1.2em; }
.month-plan .works { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.month-plan .work { background: var(--card); border: var(--card-line); border-radius: 12px; padding: 10px 14px; }
.month-plan .works .when { display: block; min-width: 0; color: var(--muted); font-size: var(--fs-small); }
.month-plan details { border-top: 1px solid var(--line); margin: 0; }
.month-plan details > summary { color: var(--head); }
.frost { border-left: 4px solid var(--warn-line); background: var(--warn-bg); color: var(--warn-text); padding: 10px 14px; border-radius: 0 10px 10px 0; max-width: var(--measure); }
html[data-view="sun"] .month-plan > div > p, html[data-view="sun"] .month-plan h2, html[data-view="sun"] .month-plan details > summary { color: #fff; }
.pager-wide a { padding: 0 18px; }
.now-list li.on strong { text-decoration: underline; text-decoration-color: #9FD8B0; text-decoration-thickness: 3px; }
@media (max-width: 760px) {
  .months { display: flex; overflow-x: auto; }
  .months a, .months span { flex: 0 0 52px; }
  .month-plan .works { grid-template-columns: minmax(0, 1fr); }
}
.by-plant { columns: 4 220px; column-gap: 24px; }
.by-plant details { break-inside: avoid; }
.by-plant details[open] { column-span: all; }
.by-plant details[open] .works { margin-bottom: 12px; }
@media (max-width: 760px) { .by-plant { columns: 2; } }

/* подкормка: схема по фазам карточками-шагами, удобрения по видам свёрнутыми карточками, хаб — кружки группами */
.steps { list-style: none; padding: 0; margin: 12px 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; counter-reset: step; }
.steps > li { counter-increment: step; position: relative; background: var(--card); border: var(--card-line); border-top: 6px solid var(--brand); border-radius: 14px; padding: 14px 18px 16px; }
.steps > li::before { content: counter(step); position: absolute; top: 12px; right: 16px; font: 700 calc(30px * var(--zoom))/1 var(--f-head); color: var(--muted); }
.steps h3 { margin: 0 2em 6px 0; font-size: calc(22px * var(--zoom)); line-height: 1.2; color: var(--brand); }
.step-what { font-weight: 700; margin: 0 0 8px; color: var(--head); }
.steps dl { margin: 0; display: grid; gap: 6px; }
.steps dt { font-size: 14px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.steps dd { margin: 0; }
html[data-view="sun"] .steps > li { border-top: 6px solid #000; }
html[data-view="sun"] .steps h3, html[data-view="sun"] .step-what, html[data-view="sun"] .steps dd { color: #0A140E; }
html[data-view="sun"] .steps dt { color: #243329; }
html[data-view="sun"] .steps > li::before { color: #243329; }
.fert-kinds { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; align-items: start; }
.fert-kinds details { min-width: 0; overflow-wrap: anywhere; background: var(--card); border: var(--card-line); border-radius: 14px; padding: 0 14px; margin: 0; }
.fert-kinds details[open] { grid-column: 1 / -1; }
.fert-kinds summary { font-weight: 800; color: var(--head); padding: 12px 0; display: flex; align-items: baseline; gap: 10px; }
.fert-kinds .pick-n { font: 700 calc(24px * var(--zoom))/1 var(--f-head); color: var(--brand); }
html[data-view="sun"] .fert-kinds summary, html[data-view="sun"] .fert-kinds .pick-n { color: #0A140E; }
.picks-chips { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.picks-chips a { padding: 10px 14px; font-weight: 800; overflow-wrap: break-word; hyphens: auto; }
.picks-chips li { min-width: 0; }
.btn-small { min-height: 44px; padding: 0 14px; font-size: var(--fs-small); display: inline-flex; align-items: center; text-decoration: none; }
.rounds-small { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 16px 14px; }
.rounds-small .round { max-width: 96px; }
.rounds-small li > a { font-size: var(--fs-small); }
.rounds-small .round b { font-size: calc(32px * var(--zoom)); }
@media (max-width: 760px) {
  .steps { grid-template-columns: minmax(0, 1fr); }
  .rounds-small { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 8px; }
  .rounds-small li > a, .rounds-small li > span { font-size: 14px; gap: 4px; overflow-wrap: break-word; hyphens: auto; }
  .rounds-small .round b { font-size: calc(24px * var(--zoom)); }
  .fert-kinds, .picks-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fert-kinds summary { flex-direction: column; gap: 0; font-size: var(--fs-small); }
}

/* нехватка элементов: признаки крупно, «что и когда вносить» карточками, избыток плашкой */
.def .signs ul { margin: 8px 0 0; padding-left: 1.2em; }
.def-do { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin: 16px 0; max-width: 60em; }
.def-do > div { background: var(--card); border: var(--card-line); border-radius: 14px; padding: 12px 18px; }
.def-do h3 { margin: 0 0 6px; font-size: calc(20px * var(--zoom)); color: var(--brand); }
.def-do p { margin: 0; }
.def-do ul { margin: 8px 0 0; padding-left: 1.2em; }
.def .frost { margin: 16px 0; }
.def .frost ul { margin: 6px 0 0; padding-left: 1.2em; }
html[data-view="sun"] .def-do h3, html[data-view="sun"] .def-do p, html[data-view="sun"] .def-do li { color: #0A140E; }

/* каталог растений: поиск по названию на странице */
.cat-find { margin: 0 0 24px; }
.cat-find input { font: inherit; width: 100%; max-width: 560px; min-height: 56px; padding: 0 16px; border: 2px solid var(--muted); border-radius: var(--r-btn); background: #fff; color: #1E3125; box-sizing: border-box; display: block; margin: 4px 0 12px; }
.group h2 .more { font: 700 var(--fs-small) var(--f-text); margin-left: 8px; }
html[data-view="sun"] .cat-find label { color: #D1E7DC; }
@media (max-width: 760px) {
  .doors-compact { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 20px 0; }
  .doors-compact a { padding: 10px 0; border-bottom: 0; }
  .doors-compact h2 { font-size: calc(19px * var(--zoom)); }
  .doors-compact p { display: none; }
}

/* разделы меню: подразделы карточками с числом, «Ещё N» у длинных облаков, подпись под кружком */
.sec-doors { margin: 8px 0 28px; }
.sec-doors .picks { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.rounds li small { display: block; font-weight: 600; font-size: 13px; color: var(--muted); margin-top: -4px; }
html[data-view="sun"] .rounds li small { color: #D1E7DC; }
details.more-chips { margin: 4px 0 0; }
details.more-chips > summary { font-weight: 800; color: var(--brand); }
html[data-view="sun"] details.more-chips > summary { color: #0A140E; }
@media (max-width: 760px) {
  .sec-doors .picks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .sec-doors .picks a { padding: 8px 12px; overflow-wrap: break-word; hyphens: auto; }
}
/* «На солнце»: карточки выбора — белые, текст на них тёмный; кружки внутри разделов-карточек — тёмные подписи */
html[data-view="sun"] .picks a, html[data-view="sun"] .picks .pick-n, html[data-view="sun"] .picks .pick-l { color: #0A140E; }
html[data-view="sun"] .picks small { color: #243329; }
html[data-view="sun"] :is(.verb, .group, .text) .rounds li > a { color: #0A140E; }
html[data-view="sun"] :is(.verb, .group, .text) .rounds li small { color: #243329; }
.picks li { min-width: 0; }
.picks a { overflow-wrap: break-word; hyphens: auto; }

/* «Вылечить»: возможные причины карточками с картинкой */
.causes { list-style: none; padding: 0; margin: 12px 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.causes > li { display: flex; gap: 14px; background: var(--card); border: var(--card-line); border-radius: 14px; padding: 12px; }
.causes .tile-pic { flex: 0 0 96px; height: 96px; border-radius: 10px; }
.causes h3 { margin: 2px 0 6px; font-size: calc(20px * var(--zoom)); line-height: 1.25; }
.causes p { margin: 4px 0 0; font-size: var(--fs-small); }
.causes p.cause-note { color: var(--muted); font-style: italic; }  /* причина не сверена с источником (REVISION А3) */
/* «Определить по шагам» (static/diagnosis.js, REVISION Б3) */
.diag-box { background: var(--card); border: var(--card-line); border-radius: 14px; padding: 16px; margin: 12px 0; }
.diag-note { color: var(--muted); font-size: var(--fs-small); font-style: italic; }
.diag-step { margin: 0; color: var(--muted); font-size: var(--fs-small); }
.diag-q { margin: 4px 0 12px; font-weight: 700; font-size: calc(20px * var(--zoom)); line-height: 1.3; }
.diag-hint { margin: 0 0 10px; font-size: var(--fs-small); }
.diag-answers { display: flex; flex-direction: column; gap: 8px; align-items: stretch; max-width: 560px; }
.diag-answers button { text-align: left; padding: 10px 16px; line-height: 1.3; }
.diag-answers .diag-unknown { border-style: dashed; }
.diag-check { margin: 0 0 12px; padding-left: 20px; }
.diag-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.diag-nav button { min-height: 44px; font-size: var(--fs-small); }
.diag-box .causes { margin: 8px 0 0; }
.causes[hidden], .diag[hidden] { display: none; }  /* у .causes и .verb свой display — hidden без этого не прячет */
html[data-view="sun"] .causes h3, html[data-view="sun"] .causes h3 a, html[data-view="sun"] .causes p { color: #0A140E; }
@media (max-width: 760px) {
  .causes { grid-template-columns: minmax(0, 1fr); }
  .causes .tile-pic { flex-basis: 72px; height: 72px; }
}
.crop-filter { margin: 4px 0 16px; }
.crop-filter .cover-jump { margin-top: 4px; gap: 8px; }
.crop-cards > li[hidden] { display: none; }

/* вещество и удобрение: препараты карточками, нормы по группам культур карточками */
.picks .pick-static { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 12px 14px; background: var(--card); border: var(--card-line); border-radius: 14px; color: var(--head); }
.picks small { color: var(--muted); font-size: var(--fs-small); }
.cc-mark { margin: 0 0 4px; font-size: var(--fs-small); color: var(--muted); }
#preparaty h3 { margin: 8px 0 10px; }
#preparaty details { margin-top: 12px; }
html[data-view="sun"] .picks .pick-static { color: #0A140E; }

/* календарь растения: работы месяца карточками, текущий месяц отмечен */
.cal-months .works { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.cal-months .work { background: var(--card); border: var(--card-line); border-radius: 12px; padding: 10px 14px; }
.cal-months .works .when { display: block; min-width: 0; color: var(--muted); font-size: var(--fs-small); }
.cal-months h3.on { color: var(--brand); }
.cal-months h3 small { font: 800 13px var(--f-text); text-transform: uppercase; letter-spacing: .06em; background: var(--leaf); color: var(--brand); padding: 2px 8px; border-radius: 999px; margin-left: 6px; vertical-align: middle; }
html[data-view="sun"] .cal-months .work, html[data-view="sun"] .cal-months h3 { color: #0A140E; }
@media (max-width: 760px) { .cal-months .works { grid-template-columns: minmax(0, 1fr); } }

/* инструменты: крупные поля и результат карточкой */
.tool-form { background: var(--card); border: var(--card-line); border-radius: 18px; padding: 8px 20px 20px; margin: 16px 0; box-shadow: var(--shadow); max-width: 760px; }
.tool-form input, .tool-form .btn { min-height: 60px; }
.tool-form label { font-size: calc(var(--fs) + 1px); }
.tool-card { background: var(--card); border: var(--card-line); border-top: 6px solid var(--brand); border-radius: 18px; padding: 16px 20px; box-shadow: var(--shadow); max-width: 760px; }
.tool-card select, .tool-card input { min-height: 56px; }
.tool-out { background: var(--leaf); border-radius: 12px; padding: 12px 16px; }
.tool-out strong { font: 700 calc(32px * var(--zoom))/1.15 var(--f-head); color: var(--brand); }
html[data-view="sun"] .tool-form label, html[data-view="sun"] .tool-card, html[data-view="sun"] .tool-card * { color: #0A140E; }
html[data-view="sun"] .tool-out { background: #E5DFD3; }
/* крупный текст на телефоне: подписи кружков, плиток и нижней панели переносятся, а не раздвигают страницу */
.tabbar a, .tabbar span { min-width: 0; overflow-wrap: anywhere; }
.rounds li > a, .rounds li > span, .tile-name { overflow-wrap: break-word; hyphens: auto; }
h1, h2, h3 { overflow-wrap: break-word; hyphens: auto; }
/* общий проход: фокус клавиатурой у раскрывашек и полей выбора; печать — без кнопок и навигации по странице */
summary:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid #E8A33D; outline-offset: 2px; }
@media print {
  .cover-jump, .crop-filter, .cat-find, .toc, .sec-doors, .doors-rule, .now .btn, .home-search { display: none !important; }
  .article { display: block; }
  .cover.has-pic { grid-template-columns: 1fr 1fr; }
  .now, .band, .home-cover { background: #fff !important; color: #000 !important; border: 2px solid #000; }
  .now *, .band *, .home-cover * { color: #000 !important; }
}
/* «На солнце»: подписи и подсказки прямо на тёмном фоне (не в карточке-разделе) — светлые */
html[data-view="sun"] :is(main, article) > p:not(.kicker), html[data-view="sun"] .home-search label,
html[data-view="sun"] [data-t-status], html[data-view="sun"] [data-s-status], html[data-view="sun"] .tool-res li { color: #D1E7DC; }
/* 2026-11-05: «Все растения · Календарь садовода» на главной и подпись чужого фото сорта были тёмными на тёмном (1,1–1,2) */
html[data-view="sun"] .home-plants > p, html[data-view="sun"] .home-plants > p a,
html[data-view="sun"] .shots figcaption, html[data-view="sun"] .shots figcaption a { color: #D1E7DC; }
@media (max-width: 760px) {
  .doors-compact { grid-template-columns: minmax(0, 1fr); gap: 0; margin: 16px 0; }
  .doors-compact a { padding: 8px 0; border-bottom: 1px solid var(--line); }
  html[data-view="sun"] .doors-compact a { margin-top: 8px; padding: 8px 14px; }
}
@media (max-width: 760px) {
  html[data-text="l"] .rounds-small, html[data-text="xl"] .rounds-small { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rounds-small li > a, .rounds-small li > span { overflow-wrap: anywhere; }
}
.by-plant .work { overflow-wrap: anywhere; }
@media (max-width: 760px) { html[data-text="xl"] .by-plant { columns: 1; } }
@media (max-width: 760px) { html[data-text="xl"] .yr-lab { font-size: 13px; } }
/* ux-аудит 2026-11-02, «На солнце»: названия на белых плитках, подпись внутри раздела-карточки — тёмные; ссылки
   «Подробнее» и списки работ по растениям прямо на тёмном фоне — светлые */
html[data-view="sun"] .tiles li > a, html[data-view="sun"] .tiles li > span, html[data-view="sun"] .tile-name { color: #0A140E; }
html[data-view="sun"] :is(.verb, .text, .group, .specs, .sources) .kicker { color: #243329; }
html[data-view="sun"] :is(main, article, .article-body, .cover-text, .cat-find) > p:not(.kicker, .dek, .cover-jump) { color: #D1E7DC; }
html[data-view="sun"] :is(main, article, .article-body, .cover-text, .cat-find) > p a:not(.btn), html[data-view="sun"] .by-plant details > p a { color: #FFFFFF; }
html[data-view="sun"] .by-plant details > p, html[data-view="sun"] .by-plant details > summary { color: #D1E7DC; }
html[data-view="sun"] :is(.verb, .text, .group, .tool-form) .btn-ghost-dark { border: 2px solid #000; }
.nf { padding-top: 24px; }

/* аудит глазами ЦА: длинные списки — «Показать ещё», таблица сортов на телефоне — строками */
.more-btn { margin: 4px 0 16px; }
.more-btn[hidden] { display: none !important; }  /* display у .btn перебивает hidden — кнопка оставалась с «−N» */
[data-more] > [hidden] { display: none !important; }
@media (max-width: 760px) {
  .sorts-list thead { display: none; }
  .sorts-list, .sorts-list tbody { display: block; width: 100%; }
  .sorts-list tr { display: block; padding: 10px 0; border-bottom: 1px solid var(--line); }
  .sorts-list td { display: inline; border: 0; padding: 0; font-size: var(--fs-small); color: var(--muted); }
  .sorts-list td:first-child { display: block; font-size: var(--fs); color: var(--text); margin-bottom: 2px; }
  .sorts-list td:empty { display: none; }
  .sorts-list td:nth-child(n+3):not(:empty)::before { content: " · "; }
  html[data-view="sun"] .sorts-list td { color: #243329; }
  html[data-view="sun"] .sorts-list td:first-child { color: #0A140E; }
}

/* «Вырастить» на странице растения: подразделы карточками, сезоны карточками (аудит ЦА 2026-11-02) */
.grow-cards { list-style: none; padding: 0; margin: 16px 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; align-items: start; }
.grow-cards > li { background: var(--card); border: var(--card-line); border-radius: 14px; padding: 14px 18px; }
.grow-cards h3 { margin: 0 0 6px; font-size: calc(21px * var(--zoom)); line-height: 1.2; }
.grow-cards h3 a { text-decoration: none; }
.grow-cards p, .grow-cards li li { font-size: var(--fs-small); }
.grow-cards p:last-child { margin-bottom: 0; }
.grow-cards .more { display: inline-block; margin-top: 8px; font-size: var(--fs-small); }
.grow-more > summary { font-size: var(--fs-small); font-weight: 800; color: var(--brand); min-height: 44px; }
.season-cards { columns: 3 260px; column-gap: 14px; }
.season-card { break-inside: avoid; margin: 0 0 14px; background: var(--card); border: var(--card-line); border-radius: 14px; padding: 12px 16px; }
/* заголовок сезона — шрифтом заголовков, крупнее и с линией: был как названия работ и сливался (2026-11-05) */
.season-card h3 { margin: 0 0 10px; padding-bottom: 8px; border-bottom: 2px solid var(--leaf); color: var(--head);
  font: 700 calc(24px * var(--zoom))/1.15 var(--f-head); }
.season-card .works { margin: 0; }
html[data-view="sun"] :is(.grow-cards, .season-card) :is(h3, h3 a, p, li, strong) { color: #0A140E; }
html[data-view="sun"] .grow-more > summary { color: #0A140E; }
@media (max-width: 760px) { .grow-cards { grid-template-columns: minmax(0, 1fr); } .season-cards { columns: 1; } }
.task-cards { list-style: none; padding: 0; margin: 12px 0; columns: 3 280px; column-gap: 14px; }
.task-cards > li { break-inside: avoid; margin: 0 0 14px; background: var(--card); border: var(--card-line); border-radius: 14px; padding: 12px 16px; }
.task-cards h3 { margin: 0 0 8px; }
.task-cards h3 small { font: 700 var(--fs-small) var(--f-text); color: var(--muted); }
html[data-view="sun"] .task-cards h3 { color: #0A140E; }
@media (max-width: 760px) { .task-cards { columns: 1; } }
/* таблицы внутри текстов (тема «Почва»: типы почв) на телефоне — прокрутка внутри, страница не шире экрана */
@media (max-width: 760px) {
  :is(.text, .article-body, .lead) table { display: block; max-width: 100%; overflow-x: auto; font-size: var(--fs-small); }
}
/* плитка сорта без фото — буква на листовом фоне (как кружок растения), а не пустой квадрат */
.tile-pic { display: grid; place-items: center; }
.tile-pic > b { font: 700 calc(56px * var(--zoom)) var(--f-head); color: var(--brand); }
.tile-pic:has(> b) { background: var(--leaf); }

/* хаб сортов: карточки подбора — переключатели (static/hubpick.js), результат пересечения */
.picks a.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.picks a.on .pick-n, .picks a.on .pick-l, .picks a.on small { color: #fff; }
.picks a.on .pick-l::before { content: "✓ "; }
html[data-view="sun"] .picks a.on, html[data-view="sun"] .picks a.on * { background: #005A32; color: #fff; }
.hp-result { margin: 20px 0 8px; padding: 16px 18px; background: var(--leaf); border-radius: 14px; }
.hp-result h3 { margin: 0 0 4px; }
.hp-list { list-style: none; padding: 0; margin: 10px 0; columns: 3 220px; column-gap: 20px; }
.hp-list li { break-inside: avoid; padding: 4px 0; }
.hp-list a { font-weight: 800; }
.hp-list small { color: var(--muted); }
.linkish { font: inherit; background: none; border: 0; padding: 0; color: var(--brand); text-decoration: underline; cursor: pointer; }
html[data-view="sun"] .hp-result { background: #fff; border: 2px solid #000; }
html[data-view="sun"] .hp-result :is(h3, p, li, a, small, .linkish) { color: #0A140E; }
.hp-bar { position: fixed; left: 50%; transform: translateX(-50%); bottom: 16px; z-index: 20; display: flex; align-items: center; gap: 14px; background: var(--brand); color: #fff; border-radius: 999px; padding: 8px 8px 8px 20px; box-shadow: 0 6px 20px rgba(0, 0, 0, .25); font-weight: 800; white-space: nowrap; }
.hp-bar.only-btns { padding: 8px; gap: 8px; }  /* одна «Сравнить N» без текста: слева было 20 px, справа 8 — криво */
.hp-bar[hidden], .hp-bar.away { display: none; }  /* display: flex перебивает hidden — без выбора плашки нет */
html[data-view="sun"] .hp-bar { background: #005A32; border: 2px solid #fff; }
@media (max-width: 760px) { .hp-bar { bottom: 80px; } }
/* хаб сортов на телефоне: фото одного сорта занимало первый экран — подбор начинается сразу под заголовком */
@media (max-width: 760px) { .cover-hub .cover-pic { display: none; } }
/* сравнение сортов (hubpick.js) */
.cmp-table th[scope="row"] { text-align: left; font-weight: 700; color: var(--muted); white-space: normal; min-width: 110px; }
.cmp-table thead th { vertical-align: bottom; }
.cmp-table thead th a { font-weight: 800; }
.cmp-table thead th .linkish { display: block; font-size: var(--fs-small); font-weight: 400; }
.cmp-table td { vertical-align: top; }
.cmp-sort { margin: 10px 0 0; }
.cmp-sort .btn { margin-top: 0; }
.hp-list .cmp-add { font-size: var(--fs-small); margin-left: 4px; }
/* похожие сорта: срок и «допущен у вас» под названием */
.tile-meta, .tile-ok { display: block; padding: 0 12px 10px; margin-top: -8px; font-size: var(--fs-small); color: var(--muted); font-weight: 400; }
.tile-ok { color: var(--brand); font-weight: 800; }
html[data-view="sun"] .tile-meta { color: #243329; }
html[data-view="sun"] .tile-ok { color: #005A32; }
.quick-picks { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.quick-picks .btn { margin: 0; }
.cmp-lab { display: none; }
@media (max-width: 760px) {
  .cmp-table { table-layout: fixed; width: 100%; }
  .cmp-table th[scope="row"], .cmp-table .cmp-corner { display: none; }
  .cmp-table .cmp-lab { display: table-row; }
  .cmp-table .cmp-lab td { padding: 10px 0 0; border-bottom: 0; font-size: var(--fs-small); font-weight: 800; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
  .cmp-table td, .cmp-table thead th { overflow-wrap: break-word; padding-left: 0; }
}
html[data-view="sun"] :is(main, article) > .quick-picks .muted { color: #D1E7DC; }
/* «Мой огород», аудит ЦА 2026-11-02: шаги мастера, «Сохранить» внизу экрана, «по мере надобности» строками */
.og-step { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0 0 4px; }
.og-savebar { position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; background: var(--bg); padding: 10px 0; margin: 12px 0 0; border-top: 1px solid var(--line); }
@media (max-width: 760px) { .og-savebar { bottom: 64px; } }
.og-reg-h { margin: 10px 0 2px; font-weight: 800; }
.og-reg { list-style: none; padding: 0; margin: 0 0 8px; }
.og-reg li { padding: 6px 0; border-bottom: 1px solid var(--line); }
.og-reg li:last-child { border-bottom: 0; }
.og-often { margin: 14px 0 4px; }
/* настройки огорода: варианты-переключатели плотнее и в цвет сайта (были через 80 px синими кнопками браузера) */
/* `#ogorod label` (display: block, поля) перебивал класс: галочка и переключатель стояли над подписью */
#ogorod label.og-check { display: flex; margin: 0; }
.og-choice[role="radiogroup"] { gap: 0; }
#ogorod .og-choice label.og-check { align-items: center; min-height: 44px; padding: 4px 0; }
.og-check input { accent-color: var(--brand); margin-top: 0; }
/* огород, второй проход: пояснения к вариантам мастера, план по месяцам, неделя плотнее */
.og-opt { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.og-opt small { font-weight: 400; font-size: var(--fs-small); color: var(--muted); }
.og-month { margin: 18px 0 0; font-size: calc(var(--fs) + 1px); }
.og-due { padding: 10px 0; }
.og-item { margin-top: 2px; }
.og-item summary { font-size: var(--fs-small); padding: 4px 0; }
html[data-view="sun"] .og-opt small { color: #243329; }
/* огород, аудит А1 2026-11-03: ссылки строкой без пробелов между ними (htm съедает перевод строки) — «Настройки»
   уезжали за экран на 375; раскрытое «Подробнее» выталкивало «Сделано»; «На солнце» — текст вне карточек на тёмном */
#ogorod p:has(> a.more) { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; }
.og-due > div { min-width: 0; flex: 1 1 auto; }
.og-due:has(details[open]) { flex-wrap: wrap; }
html[data-view="sun"] #ogorod > p, html[data-view="sun"] #ogorod > details > summary, html[data-view="sun"] #ogorod > details p,
html[data-view="sun"] #ogorod > details label { color: #D1E7DC; }
html[data-view="sun"] #ogorod > p a:not(.btn):not(.btn-ghost) { color: #FFFFFF; }
/* огород А2 (крупный текст, «На солнце», 375): итоги — строка сорта и комментарий сжимаются, звёзды крупнее;
   поле фото — в палец; подвал — несобранная ссылка («Как мы выбираем») видна на тёмном */
.og-result > * { min-width: 0; overflow-wrap: anywhere; }
.og-result .og-input { width: 100%; }
.og-stars button { font-size: calc(28px * var(--zoom)); }
#ogorod input[type="file"] { min-height: var(--touch); padding: 8px 0; font: inherit; max-width: 100%; }
html[data-view="sun"] .foot-links span { color: #D1E7DC; }
/* хаб: «+ сравнить» у плиток и строк таблицы, «Сравнить N» в плашке (PLAN §10 А4) */
.hp-bar [hidden] { display: none !important; }
.tiles li:has(> .cmp-tile) { position: relative; }
.tiles li:has(> .cmp-tile) > a { padding-bottom: 36px; }
.cmp-tile { position: absolute; left: 12px; bottom: 8px; min-height: 32px; padding: 0; background: none; font-size: var(--fs-small); }
.cmp-row { margin-left: 8px; font-size: var(--fs-small); }
.cmp-add[aria-pressed="true"] { font-weight: 800; text-decoration: none; }
/* подбор: на ненажатых карточках — сколько сортов будет, если нажать (А5); ноль — блёкло */
.picks a.hp-if .pick-n::before { content: "→ "; font-size: .7em; color: var(--muted); }
.picks a.hp-zero { opacity: .55; }
/* А3 (медленная сеть): место под то, что дорисует скрипт, — подвал и блоки не прыгают (CLS огорода 0,44, поиска 0,17) */
#ogorod { min-height: 75vh; }
.s-q [data-s-empty] { display: none; }
.s-q [data-s-res] { min-height: 70vh; }
/* печать (А6): кнопки на бумагу не идут — кроме звёзд оценки в итогах сезона */
@media print {
  main button:not(.og-stars *), main a.btn, main a.btn-ghost, .more-btn, .hp-bar, .quick-picks, .cmp-sort, .cmp-add, .table-tools { display: none !important; }
  main details > summary { list-style: none; font-weight: 800; }
}

/* Снимки сорта (Викисклад) рядом с рисунком — с автором и лицензией */
.shots { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin: 0 0 24px; }
.shots figure { margin: 0; }
.shots img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--r-btn); display: block; }
.shots figcaption { font-size: var(--fs-small); color: var(--muted); padding-top: 4px; overflow-wrap: anywhere; }
/* баннер о cookie и Метрике (docs/legal/consent.md С3): внизу экрана, над нижней панелью; две равные кнопки */
.cookie { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: var(--card); border-top: var(--card-line); box-shadow: 0 -4px 16px rgba(0,0,0,.12); padding: 14px 16px; }
.cookie p { max-width: 860px; margin: 0 auto 10px; }
.cookie-btns { max-width: 860px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 10px; }
.cookie-btns .btn { flex: 1 1 180px; }
@media (max-width: 760px) { .cookie { bottom: 64px; } }
body.cookie-on { padding-bottom: calc(72px + var(--cookie-h, 0px)); }
@media (min-width: 761px) { body.cookie-on { padding-bottom: var(--cookie-h, 0px); } }
.foot-btn { font: inherit; min-height: 44px; padding: 0; border: 0; background: none; color: var(--brand); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media print { .cookie { display: none !important; } }
html[data-view="sun"] .foot-btn { color: #fff; }
html[data-view="sun"] .cookie { border-top: 3px solid #000; color: #06180F; }
/* пока баннер открыт — плашки внизу экрана над ним, а не под ним (сравнение сортов, «Сохранить план», подсказки огорода) */
body.cookie-on .hp-bar { bottom: calc(16px + var(--cookie-h, 0px)); }
body.cookie-on .og-toast { bottom: calc(var(--touch) + 24px + var(--cookie-h, 0px)); }
body.cookie-on .og-savebar { bottom: var(--cookie-h, 0px); }
@media (max-width: 760px) {
  body.cookie-on .hp-bar { bottom: calc(80px + var(--cookie-h, 0px)); }
  body.cookie-on .og-savebar { bottom: calc(64px + var(--cookie-h, 0px)); }
}