/* =========================================================================
   Уклад — переходный слой (v1, 30.10.2026)
   Подключать ПОСЛЕДНИМ, после uklad-shell.css:
     <link rel="stylesheet" href="uklad-bridge.css?v=1">
   Что делает:
   1. Чинит раскладку: правило «main:has([data-u-home])» в uklad-shell.css
      срабатывало на ВСЕХ разделах (скрытый #today всегда в DOM),
      поэтому «Улучшения», «Страницы», «Сведения», «Доступ» прилипали к левому краю.
   2. Выравнивает низ главной: все блоки под тёмным верхом — по одной левой линии.
   3. Переодевает старые экраны в новые токены, не трогая разметку и логику:
      старые переменные (--paper, --ink, --forest…) указывают на --u-*,
      заголовки, кнопки, карточки, раскрывашки и поля — в стиле дизайн-системы.
   4. Тёмная тема: старые экраны, пока их не перевели, остаются светлыми
      (у них сотни зашитых hex-цветов, в тёмной теме текст пропадает).
   Когда экран переведён на u-* полностью — его правила отсюда удаляются.
   ========================================================================= */

/* ---------- 1. старые переменные → токены ---------- */
body.u-app{
  --paper:var(--u-bg);
  --paper-deep:var(--u-surface-3);
  --surface:var(--u-surface);
  --ink:var(--u-ink);
  --ink-soft:var(--u-ink-2);
  --muted:var(--u-muted);
  --line:var(--u-line-2);
  --forest:var(--u-accent);
  --forest-dark:var(--u-ink);
  --forest-soft:var(--u-accent-soft);
  --clay:var(--u-warn);
  --clay-soft:var(--u-warn-soft);
  --verified:var(--u-ok);
  --verified-soft:var(--u-ok-soft);
  --danger:var(--u-danger);
  --shadow:var(--u-shadow-2);
  --font-ui:var(--u-font);
  --weight-heading:var(--u-w-semibold);
  --leading-body:var(--u-leading);
  background:var(--u-bg);
  color:var(--u-ink);
  font-family:var(--u-font);
  -webkit-font-smoothing:antialiased;
}
body.u-app .app-shell{background:var(--u-bg)}
body.u-app .u-bar{top:0;margin-top:0}
/* набор иконок <svg> в начале body занимал строку и давал полосу 24px над шапкой */
body.u-app > svg:not([class]){position:absolute;width:0;height:0;overflow:hidden}

/* ---------- 2. раскладка разделов ---------- */
/* главная: тёмный верх во всю ширину (как в uklad-shell.css) — только когда открыта «Проверка» */
body.u-app main:has(> #today[hidden]){
  width:100%;max-width:var(--u-content);margin:0 auto;
  padding:var(--u-s7) var(--u-gutter) var(--u-s8);
  background:transparent;
}
body.u-app main > .view:not(#today){min-width:0}

/* шапка раздела: подпись + крупный заголовок + пояснение */
body.u-app .view:not(#today) > .page-head{
  display:flex;gap:var(--u-s5);align-items:flex-end;justify-content:space-between;
  margin:0 0 var(--u-s6);padding-bottom:var(--u-s5);border-bottom:1px solid var(--u-line);
}
body.u-app .view:not(#today) > .page-head h1{
  margin:0;font-size:var(--u-text-2xl);line-height:var(--u-leading-tight);
  letter-spacing:-.025em;font-weight:var(--u-w-semibold);color:var(--u-ink);
}
body.u-app .view:not(#today) > .page-head p:not(.eyebrow){
  max-width:62ch;margin:var(--u-s3) 0 0;color:var(--u-muted);
  font-size:var(--u-text-md);line-height:var(--u-leading);
}
body.u-app .view:not(#today) .eyebrow{
  margin:0 0 var(--u-s2);color:var(--u-accent);
  font-size:var(--u-text-sm);font-weight:var(--u-w-semibold);letter-spacing:.03em;text-transform:none;
}

/* заголовки внутри разделов — одна шкала вместо 13 размеров */
body.u-app .view:not(#today) h2{
  font-size:var(--u-text-xl);line-height:1.25;letter-spacing:-.015em;
  font-weight:var(--u-w-semibold);color:var(--u-ink);
}
body.u-app .view:not(#today) h3{
  font-size:var(--u-text-lg);line-height:1.35;letter-spacing:-.01em;
  font-weight:var(--u-w-semibold);color:var(--u-ink);
}
body.u-app .view:not(#today) :is(p,li,dd){line-height:var(--u-leading)}
body.u-app .view:not(#today) small{color:var(--u-muted)}

/* ---------- 3. карточки и панели ---------- */
body.u-app .view:not(#today) :is(
  section[class*="-panel"],section[class*="-card"],article[class*="-card"],
  .budget-card,.budget-protection,.organization-budget,.usage-access-card,
  .site-analysis-launch,.seo-issue-view,.site-safety,.site-analysis-status,
  .fact-summary,.visibility-principle,.demand-evidence-note
){
  background:var(--u-surface);
  border:1px solid var(--u-line);
  border-radius:var(--u-r-lg);
  box-shadow:var(--u-shadow-1);
}
/* карточка внутри карточки — плоская подложка, без второй тени */
body.u-app .view:not(#today) :is(section,article)[class*="-card"] :is(article,[class*="-card"]),
body.u-app .view:not(#today) [class*="-panel"] :is(article,[class*="-card"]){
  background:var(--u-surface-2);box-shadow:none;border-radius:var(--u-r-md);
}

/* раскрывающиеся блоки «Подробнее…»: только цвет и высота, внутренняя раскладка — своя */
body.u-app .view:not(#today) details{border-radius:var(--u-r-lg)}
body.u-app .view:not(#today) details > summary{min-height:var(--u-tap);cursor:pointer;color:var(--u-ink)}
body.u-app .view:not(#today) details > summary:hover{color:var(--u-accent)}
body.u-app .view:not(#today) details > summary::marker{color:var(--u-muted)}

/* ---------- 4. кнопки ---------- */
body.u-app :is(.primary-button,.secondary-button,.quiet-button){
  min-height:var(--u-tap);padding:0 18px;border-radius:var(--u-r-md);
  font-family:var(--u-font);font-size:var(--u-text-md);font-weight:var(--u-w-semibold);
  transition:background var(--u-fast) var(--u-ease),box-shadow var(--u-fast) var(--u-ease),transform var(--u-fast) var(--u-ease);
}
body.u-app .primary-button{
  border:0;background:var(--u-accent);color:var(--u-accent-ink);
  box-shadow:0 8px 22px -8px color-mix(in srgb,var(--u-accent) 70%,transparent);
}
body.u-app .primary-button:hover{background:var(--u-accent-hover)}
body.u-app :is(.secondary-button,.quiet-button){
  border:1px solid var(--u-line-2);background:var(--u-surface);color:var(--u-ink);box-shadow:none;
}
body.u-app :is(.secondary-button,.quiet-button):hover{background:var(--u-surface-2)}
body.u-app :is(.primary-button,.secondary-button,.quiet-button):active{transform:scale(.98)}
body.u-app :is(.primary-button,.secondary-button,.quiet-button):focus-visible{
  outline:2px solid var(--u-accent);outline-offset:2px;
}
body.u-app :is(.primary-button,.secondary-button)[disabled]{opacity:.45;box-shadow:none;cursor:not-allowed}
body.u-app .text-button{color:var(--u-accent);font-weight:var(--u-w-semibold)}
body.u-app .view:not(#today) a:not([class]){color:var(--u-accent);text-underline-offset:3px}

/* ---------- 5. поля ввода ---------- */
body.u-app .view:not(#today) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),select,textarea){
  min-height:var(--u-tap);padding:10px 12px;border:1px solid var(--u-line-2);border-radius:var(--u-r-sm);
  background:var(--u-surface);color:var(--u-ink);font:inherit;font-size:var(--u-text-md);
  transition:border-color var(--u-fast),box-shadow var(--u-fast);
}
body.u-app .view:not(#today) :is(input,select,textarea):focus{
  outline:none;border-color:var(--u-accent);box-shadow:0 0 0 3px var(--u-accent-soft);
}
body.u-app .view:not(#today) :is(input[type="checkbox"],input[type="radio"]){accent-color:var(--u-accent)}

/* ---------- 6. низ главной: одна левая линия ---------- */
/* все блоки под тёмным верхом — по контейнеру 1240 с полями, как текст внутри верха */
/* :not(#u-none) — только чтобы перебить правило uklad-shell.css (1,5,1) */
body.u-app #today [data-result-summary] > :not(.u-hero):not(#u-none){
  box-sizing:border-box;
  width:min(calc(var(--u-content) - 2 * var(--u-gutter)), calc(100% - 2 * var(--u-gutter)));
  margin-left:auto;margin-right:auto;padding-left:0;padding-right:0;
}
body.u-app #today [data-result-summary] > .audit-dated-result{padding:var(--u-s4) 0 0;color:var(--u-muted);font-size:var(--u-text-sm)}
body.u-app #today [data-result-summary] > .result-columns{padding-top:var(--u-s7)}
/* «Подробности…» под отчётом — отдельные карточки-строки с одинаковыми полями */
body.u-app #today [data-result-summary]{display:flex;flex-direction:column}
body.u-app #today [data-result-summary] > .audit-report-tools{order:99}
body.u-app #today [data-result-summary] > details:not(.u-hero):not(#u-none){
  margin-top:var(--u-s2);margin-bottom:0;padding:0 var(--u-s5);
  border:1px solid var(--u-line);border-radius:var(--u-r-md);
  background:var(--u-surface);box-shadow:none;
}
body.u-app #today [data-result-summary] > .result-columns + details:not(.u-hero):not(#u-none){margin-top:var(--u-s7)}
/* «Скачать отчёт» уезжает в самый низ (order:99), «Управление проверкой» остаётся в общем списке */
body.u-app #today [data-result-summary] > .audit-report-tools + details:not(.u-hero):not(#u-none){margin-top:var(--u-s2)}
body.u-app #today [data-result-summary] > details > summary{
  display:flex;align-items:center;gap:var(--u-s3);min-height:56px;padding:0;margin:0;
  cursor:pointer;list-style:none;font-weight:var(--u-w-semibold);color:var(--u-ink);font-size:var(--u-text-md);
}
body.u-app #today [data-result-summary] > details > summary::-webkit-details-marker{display:none}
body.u-app #today [data-result-summary] > details > summary::after{
  content:"";margin-left:auto;flex:none;width:8px;height:8px;
  border-right:2px solid var(--u-muted);border-bottom:2px solid var(--u-muted);
  transform:rotate(45deg) translateY(-2px);transition:transform var(--u-fast) var(--u-ease);
}
body.u-app #today [data-result-summary] > details[open] > summary::after{transform:rotate(-135deg)}
body.u-app #today [data-result-summary] > details[open]{padding-bottom:var(--u-s5)}
body.u-app #today [data-result-summary] > .audit-report-tools{
  display:flex;justify-content:flex-end;margin-top:var(--u-s5);margin-bottom:0;padding-top:0;
}
body.u-app #today [data-result-summary] > details > summary > *{margin:0}

/* ---------- 7. тёмная тема ---------- */
/* старые экраны остаются светлыми до перевода; верх и шапка — тёмные, как в эталоне */
html[data-u-theme="dark"] body.u-app main:has(> #today[hidden]){
  --u-bg:#F4F3EF;--u-surface:#FFFFFF;--u-surface-2:#F9F8F5;--u-surface-3:#F1EFEA;
  --u-ink:#0E1014;--u-ink-2:#363B44;--u-muted:#61666D;--u-faint:#9A9EA6;
  --u-line:rgba(14,16,20,.08);--u-line-2:rgba(14,16,20,.14);
  --u-accent:#3550D4;--u-accent-hover:#2A43BC;--u-accent-ink:#FFFFFF;--u-accent-soft:#ECEFFD;
  --u-ok:#1E7451;--u-ok-soft:#E4F3EB;--u-warn:#8F5E12;--u-warn-soft:#FBF1DF;
  --u-danger:#B4382F;--u-danger-soft:#FBE9E7;
  --u-shadow-1:0 1px 2px rgba(14,16,20,.05);--u-shadow-2:0 8px 24px -6px rgba(14,16,20,.10);
  --paper:#F4F3EF;--surface:#FFFFFF;--ink:#0E1014;--muted:#61666D;--line:rgba(14,16,20,.14);
  color-scheme:light;color:var(--u-ink);
  max-width:none;
  padding-left:max(var(--u-gutter), calc((100% - var(--u-content)) / 2 + var(--u-gutter)));
  padding-right:max(var(--u-gutter), calc((100% - var(--u-content)) / 2 + var(--u-gutter)));
  background:#F4F3EF;min-height:calc(100vh - var(--u-bar-h));
}

/* ---------- 8. телефон ---------- */
@media (max-width:720px){
  body.u-app main:has(> #today[hidden]){padding-top:var(--u-s5)}
  body.u-app .view:not(#today) > .page-head{flex-direction:column;align-items:stretch;margin-bottom:var(--u-s5)}
  body.u-app .view:not(#today) :is(.primary-button,.secondary-button){white-space:normal;text-align:center}
  body.u-app #today [data-result-summary] > details:not(.u-hero):not(#u-none){padding:0 var(--u-s4)}
  body.u-app #today [data-result-summary] > .audit-report-tools{justify-content:stretch}
  body.u-app #today [data-result-summary] > .audit-report-tools > *{flex:1}
}