/* «Аналитика» → «Разбор баланса» (manalreview.ts, 07.10). Colours only through the theme tokens (docs/design/themes/TOKENS.md),
   each with the base theme's value as the fallback, so the tab looks right before and after the token migration. */
.ana-top { display: flex; align-items: center; gap: 12px; min-height: 30px; }
.ana-note { flex: 1; display: flex; align-items: flex-start; gap: 10px; padding: 8px 12px; border-radius: 10px; font-size: 14px; line-height: 1.4; white-space: pre-wrap; user-select: text;
  background: var(--c-surface-2, #2b251f); box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb, 201, 162, 102), .6); }
.ana-note span { flex: 1; max-height: 92px; overflow: auto; }
.ana-cols { flex: 1; min-height: 0; display: grid; grid-template-columns: 300px minmax(0, 1fr) 790px; gap: 16px; }
/* plaque: surface → surface-2 only (07.10 contrast pass: bg-2 / surface-3 drift too far in the light d2 and the green d4) */
.ana-plq { border-radius: 14px; background: linear-gradient(175deg, var(--c-surface-2, #2b251f) 0%, var(--c-surface, #1d1915) 100%);
  box-shadow: inset 0 1px 0 rgba(var(--c-hi-rgb, 255, 236, 200), .08), inset 0 0 0 1px rgba(var(--c-accent-rgb, 201, 162, 102), .26), 0 10px 26px rgba(0, 0, 0, .45); }
.ana-left { display: flex; flex-direction: column; gap: 10px; min-height: 0; overflow: auto; }
.ana-verdict { padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.ana-ring svg { width: 180px; height: 180px; }
.ana-arc { fill: none; stroke-width: 15; }
.ana-ringn { font: 700 58px var(--font-num, "Fira Sans Condensed", sans-serif); fill: var(--c-danger-2, #ef8f7e); }
.ana-ringt { font: 500 13px var(--font-body, "Fira Sans", sans-serif); fill: var(--c-ink-2, #a99d89); }
.ana-tally { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; font-size: 14px; color: var(--c-ink-2, #a99d89); }
.ana-tally span { display: flex; align-items: center; gap: 6px; }
.ana-tally b { color: var(--c-ink, #efe6d3); }
.ana-sw { width: 10px; height: 10px; border-radius: 50%; background: currentColor; }
.ana-limit { padding: 12px 14px; border-radius: 12px; background: rgba(var(--c-bg-rgb, 8, 6, 5), .5); box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb, 201, 162, 102), .16); }
.ana-limit p { margin: 6px 0 0; font-size: 14px; line-height: 1.45; color: var(--c-ink-2, #d8c7a2); }
.ana-limitcap { color: var(--c-danger-2, #ef8f7e); }
.ana-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.btn.ana-pill { height: 30px; min-height: 0; padding: 0 12px; border-radius: 15px; font: 500 13px/1 var(--font-body, "Fira Sans", sans-serif); color: var(--c-ink-2, #c4b79f);
  background: none; box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb, 201, 162, 102), .3); }
.btn.ana-pill.on { color: var(--c-ink); background: rgba(var(--c-accent-rgb), .1); box-shadow: inset 0 0 0 var(--bw-strong) var(--c-accent-2); }
.ana-grid-note { margin: 4px 0 0; font-size: 14px; line-height: 1.45; color: var(--c-ink-2, #a99d89); }
.ana-list { min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 10px; padding-right: 6px; }
.ana-f { padding: 12px 16px 10px; display: flex; flex-direction: column; gap: 6px; border-left: 4px solid currentColor; cursor: pointer; flex: none; }
.ana-f.picked { box-shadow: inset 0 0 0 2px var(--c-ink-2, #a99d89), 0 10px 26px rgba(0, 0, 0, .45); }
.ana-fh { display: flex; align-items: center; gap: 10px; }
.ana-tag { font: 600 11.5px/1 var(--font-body, "Fira Sans", sans-serif); letter-spacing: .08em; text-transform: uppercase; }
.ana-dimtag { color: var(--c-ink-2, #a99d89); }
/* severity tag: ink text, the colour as a bar (the theme's gold / red / green are not text colours in every theme) */
.ana-st { color: var(--c-ink, #efe6d3); padding-left: 7px; border-left: 7px solid currentColor; }
.ana-st.ana-st-alarm { border-left-color: var(--c-danger-2, #ef8f7e); }
.ana-st.ana-st-watch { border-left-color: var(--c-warn, #e7c070); }
.ana-st.ana-st-few { border-left-color: var(--c-ink-2, #a99d89); }
.ana-st.ana-st-ok { border-left-color: var(--c-ok, #93c58c); }
.ana-ba { margin-left: auto; font: 500 12.5px var(--font-num, "Fira Sans Condensed", sans-serif); color: var(--c-ink-2, #a99d89); }
.ana-ba b { color: var(--c-ink-2, #d9ccb2); }
.ana-ba b.now { color: var(--c-ink, #f3e7cf); }
.ana-ft { font-size: 18px; line-height: 1.3; font-weight: 600; color: var(--c-ink, #f3e7cf); }
.ana-fp { font: 500 13.5px/1.45 var(--font-num, "Fira Sans Condensed", sans-serif); color: var(--c-ink-2, #c4b79f); overflow-wrap: anywhere; }
.ana-fa { font-size: 14px; line-height: 1.4; font-weight: 600; color: var(--c-ink, #efe6d3); }
.ana-read { font-size: 14px; line-height: 1.4; color: var(--c-ink-2, #d8c7a2); background: rgba(var(--c-accent-rgb, 201, 162, 102), .08); border-radius: 8px; padding: 7px 10px; }
.ana-read b { color: var(--c-ink, #efe6d3); }
.ana-fb { display: flex; gap: 8px; }
.btn.ana-mini { height: 26px; min-height: 0; padding: 0 10px; border-radius: 13px; font: 600 12px/1 var(--font-body, "Fira Sans", sans-serif); color: var(--c-ink-2, #c4b79f);
  background: none; box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb, 201, 162, 102), .35); white-space: nowrap; }
.btn.ana-mini.ask { color: var(--c-on-accent, #1a130a); background: linear-gradient(180deg, var(--c-accent-2, #e7c98f), var(--c-accent, #c9a266)); box-shadow: none; }
.ana-nothing { padding: 24px; text-align: center; color: var(--c-ink-2, #a99d89); }
.ana-charts { min-height: 0; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.ana-ch { padding: 12px 14px 10px; display: flex; flex-direction: column; gap: 4px; min-height: 0; }
.ana-chh { display: flex; align-items: flex-start; gap: 8px; }
.ana-chh h3 { flex: 1; margin: 0; font: 700 20px/1.1 var(--font-display, "Cormorant SC", serif); color: var(--c-ink, #f3e7cf); }
.ana-sub { font-size: 14px; line-height: 1.35; color: var(--c-ink-2, #a99d89); }
.ana-svg { flex: 1; min-height: 0; display: flex; }
.ana-svg svg { width: 100%; height: 100%; }
.ana-how { font-size: 14px; line-height: 1.4; color: var(--c-ink-2, #d8c7a2); border-top: 1px solid rgba(var(--c-accent-rgb, 201, 162, 102), .2); padding-top: 6px; }
.ana-how b { color: var(--c-ink, #efe6d3); font-weight: 700; }
.ana-empty { padding: 40px; text-align: center; color: var(--c-ink-2, #a99d89); }
.ana-empty h3 { font: 700 30px var(--font-display, "Cormorant SC", serif); color: var(--c-ink, #f3e7cf); margin: 0 0 10px; }
/* severity colours (text, swatches, arcs, the card edge) */
.ana-alarm, .ana-f-alarm { color: var(--c-danger-2, #ef8f7e); stroke: var(--c-danger-2, #ef8f7e); }
.ana-watch, .ana-f-watch { color: var(--c-warn, #e7c070); stroke: var(--c-warn, #e7c070); }
.ana-few, .ana-f-few { color: var(--c-ink-2, #a99d89); stroke: var(--c-ink-2, #a99d89); }
.ana-ok, .ana-f-ok { color: var(--c-ok, #93c58c); stroke: var(--c-ok, #93c58c); }
/* chart marks */
.ana-grid { stroke: rgba(var(--c-accent-rgb, 201, 162, 102), .15); }
.ana-tick { font: 500 11px var(--font-num, "Fira Sans Condensed", sans-serif); fill: var(--c-ink-2, #a99d89); }
.ana-lab { font: 500 12px var(--font-num, "Fira Sans Condensed", sans-serif); fill: var(--c-ink-2, #c4b79f); }
.ana-fair { stroke: var(--c-ink-2, #a99d89); stroke-dasharray: 5 4; }
.ana-fairt { font: 600 11px var(--font-num, "Fira Sans Condensed", sans-serif); fill: var(--c-ink-2, #a99d89); }
.ana-ci { stroke-width: 7; stroke-linecap: round; opacity: .4; }
.ana-whisk { opacity: .35; }
.ana-dot { fill: currentColor; stroke: none; }
.ana-plain { color: var(--c-ink, #efe6d3); stroke: var(--c-ink, #efe6d3); }
.ana-dim { color: var(--c-ink-2, #a99d89); stroke: var(--c-ink-2, #a99d89); }
.ana-band { fill: rgba(var(--c-ok-rgb, 147, 197, 140), .09); }
.ana-bandt { font: 600 11px var(--font-num, "Fira Sans Condensed", sans-serif); fill: var(--c-ink-2, #a99d89); }
.ana-line { fill: none; stroke-width: 2.4; }
.ana-lead { color: var(--c-warn, #e7c070); stroke: var(--c-warn, #e7c070); }
.ana-last { color: var(--c-info, #8cbcff); stroke: var(--c-info, #8cbcff); }
.ana-bar { opacity: .85; }
.ana-b-zero { fill: var(--c-ink-2, #a99d89); }
.ana-b-middle { fill: var(--c-ok, #93c58c); }
.ana-b-max { fill: var(--c-danger-2, #ef8f7e); }
.ana-barv { font: 600 11.5px var(--font-num, "Fira Sans Condensed", sans-serif); fill: var(--c-ink-2, #c4b79f); }
.ana-carry { stroke: var(--c-ink, #efe6d3); stroke-width: 2; }
.ana-watchline { stroke: var(--c-warn, #e7c070); }

/* «Люди», «Все цифры», «Покрытие» (manalpeople.ts, manalbots.ts, manalcover.ts — 08.10): one scrolling column of plaques. */
.mp { display: flex; flex-direction: column; gap: 12px; height: 100%; min-height: 0; overflow: auto; padding-right: 6px; font-family: var(--font-body, "Fira Sans", sans-serif); color: var(--c-ink, #efe6d3); }
.mp .cap { font: 600 12px/1 var(--font-body, "Fira Sans", sans-serif); letter-spacing: .08em; text-transform: uppercase; color: var(--c-ink-2, #a99d89); }
.mp-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; flex: none; }
.mp-filters .cap { margin-left: 8px; }
.mp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: start; }
.mp-card { padding: 12px 16px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.mp-card.wide { grid-column: 1 / -1; }
.mp-card h3, .mb-sec h3 { margin: 0; font: 700 20px/1.1 var(--font-display, "Cormorant SC", serif); color: var(--c-ink, #f3e7cf); }
.mp-t { width: 100%; border-collapse: collapse; font-size: 14px; }
.mp-t td { padding: 3px 4px; vertical-align: top; border-bottom: 1px solid rgba(var(--c-accent-rgb, 201, 162, 102), .12); color: var(--c-ink-2, #d8c7a2); }
.mp-t td.v { font: 600 14px var(--font-num, "Fira Sans Condensed", sans-serif); color: var(--c-ink, #efe6d3); text-align: right; white-space: nowrap; }
.mp-t td.n { font: 500 12px var(--font-num, "Fira Sans Condensed", sans-serif); color: var(--c-ink-2, #a99d89); text-align: right; white-space: nowrap; width: 1%; }
.mp-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.mp-cols b { display: block; margin: 6px 0 2px; font-size: 13px; color: var(--c-ink-2, #a99d89); }
.mp-list td, .mb-t td, .mc-t td { font-size: 13.5px; }
.mb-list { display: flex; flex-direction: column; gap: 8px; }
.mb-sec { padding: 6px 12px; flex: none; }
.btn.mb-head { width: 100%; justify-content: flex-start; min-height: 0; height: 36px; padding: 0 4px; background: none; box-shadow: none;
  font: 700 19px/1 var(--font-display, "Cormorant SC", serif); color: var(--c-ink, #f3e7cf); }
.mb-body { padding: 0 4px 8px; overflow-x: auto; }
.mb-t td { font-family: var(--font-num, "Fira Sans Condensed", sans-serif); white-space: nowrap; }
.mc-area { flex: none; }
.mc-t td { vertical-align: top; }
.mc-t td.v { font: 600 13.5px var(--font-num, "Fira Sans Condensed", sans-serif); white-space: nowrap; }
.mc-m, .mc-new { font: 500 12px var(--font-num, "Fira Sans Condensed", sans-serif); color: var(--c-ink-2, #a99d89); }
.mc-note { max-width: 560px; color: var(--c-ink-2, #a99d89); }
/* status: ink text, the colour as a bar (as .ana-st) */
.mc-st { padding-left: 7px; border-left: 7px solid currentColor; color: var(--c-ink, #efe6d3); white-space: nowrap; }
.mc-st.mc-shown { border-left-color: var(--c-ok, #93c58c); }
.mc-st.mc-partial { border-left-color: var(--c-warn, #e7c070); }
.mc-st.mc-hidden { border-left-color: var(--c-ink-2, #a99d89); }
.mc-st.mc-missing { border-left-color: var(--c-danger-2, #ef8f7e); }

/* ===== «Аналитика» 08.10 (manal.ts mx): four sections, readable at any window size. The 1920×1080 stage shrinks to the
   window; the screen zooms itself back by --u (manal.ts density) and lays out for the width it then has: w-l ≥ 1500 · w-m · w-s < 1000. */
.screen.manal.mana { inset: auto; left: 0; top: 0; width: calc(1920px / var(--u, 1)); height: calc(1080px / var(--u, 1)); zoom: var(--u, 1); padding: 0; gap: 0; }
.mana .manal-h { height: 104px; flex: none; box-sizing: border-box; padding: 0 44px; gap: 24px; border-bottom: 1px solid rgba(var(--c-accent-rgb), .3); }
.mana .manal-h h1 { font-size: 50px; }
.mx-sec { display: flex; gap: 6px; padding: 6px; margin-left: 20px; border-radius: 14px; background: rgba(var(--c-bg-rgb), .55); box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb), .25); }
.btn.mx-sb { height: 50px; min-height: 0; padding: 0 26px; border-radius: 10px; background: none; box-shadow: none; color: var(--c-ink-2); font: 500 20px var(--font-body); letter-spacing: 0; text-transform: none; }
.btn.mx-sb.on { background: var(--c-accent); color: var(--c-on-accent); font-weight: 600; }
.mana .manal-h > .btn.icon { margin-left: auto; }
.mx-sub { flex: none; display: flex; gap: 4px; margin: 14px 44px 0; border-bottom: 1px solid rgba(var(--c-accent-rgb), .25); overflow-x: auto; }
.btn.mx-st { height: 46px; min-height: 0; padding: 0 18px; border-radius: 0; background: none; box-shadow: none; color: var(--c-ink-2); font: 500 19px var(--font-body); letter-spacing: 0; text-transform: none; border-bottom: 3px solid transparent; white-space: nowrap; }
.btn.mx-st.on { color: var(--c-ink); font-weight: 600; border-bottom-color: var(--c-accent-2); }
.mana .manal-body { margin: 16px 44px 24px; padding: 0; background: none; box-shadow: none; border-radius: 0; }
.mana.w-s .manal-h { height: 72px; padding: 0 16px; gap: 12px; }
.mana.w-s .manal-h h1 { display: none; }
.mana.w-s .mx-sec { margin-left: 0; padding: 4px; }
.mana.w-s .btn.mx-sb { height: 44px; padding: 0 14px; font-size: 17px; }
.mana.w-s .mx-sub { margin: 8px 16px 0; }
.mana.w-s .btn.mx-st { height: 44px; padding: 0 12px; font-size: 16px; }
.mana.w-s .manal-body { margin: 10px 16px 14px; }

/* the bullet bar (manaldata.ts bullet) */
.mbl-wrap { display: flex; flex-direction: column; gap: 6px; }
.mbl { position: relative; height: 26px; }
.mbl > div { position: absolute; }
.mbl-axis { left: 0; right: 0; top: 11px; height: 4px; border-radius: 2px; background: rgba(var(--c-accent-rgb), .18); }
.mbl-band { top: 6px; height: 14px; border-radius: 7px; background: rgba(var(--c-ok-rgb), .24); }
.mbl-mark { top: 0; width: 2px; height: 26px; margin-left: -1px; background: var(--c-accent-2); }
.mbl-pt { top: 7px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--c-ink); }
.mbl-pt.dim { width: 10px; height: 10px; top: 8px; margin-left: -5px; background: var(--c-ink-2); opacity: .75; }
.mbl-pt.hot { background: var(--c-danger-2); }
.mbl-ci { top: 9px; height: 8px; border-radius: 4px; background: rgba(var(--c-ink-rgb), .35); }
.mbl-ci.watch { background: rgba(var(--c-warn-rgb), .55); }
.mbl-ci.bad { background: rgba(var(--c-danger-2-rgb), .55); }
.mbl-dot { top: 5px; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: var(--c-ink); box-shadow: 0 0 0 3px rgba(var(--c-bg-rgb), .7); }
.mbl-dot.watch { background: var(--c-warn); }
.mbl-dot.bad { background: var(--c-danger-2); }
.mbl-ticks { display: flex; justify-content: space-between; gap: 8px; font: 500 15px var(--font-num); color: var(--c-ink-2); }

/* «Сводка» (manalhome.ts) */
.mh { height: 100%; min-height: 0; overflow: auto; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); grid-template-rows: auto auto; align-content: start; align-items: start; gap: 24px 26px; color: var(--c-ink); padding-right: 6px; }
.mh-goals, .mh-card { border-radius: 18px; background: linear-gradient(175deg, var(--c-surface-2) 0%, var(--c-surface) 100%); box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb), .26), 0 12px 30px rgba(var(--c-shadow-rgb), .45); }
.mh-goals { padding: 26px 34px 10px; display: flex; flex-direction: column; }
.mh-gh { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; margin-bottom: 4px; }
.mh-gh h2 { margin: 0; font: 700 38px/1.1 var(--font-display); color: var(--c-accent-2-tx); }
.mh-gh span { font-size: 18px; color: var(--c-ink-2); }
.mh-goal { display: grid; grid-template-columns: 280px minmax(0, 1fr) 160px; gap: 8px 28px; align-items: center; padding: 20px 0; border-bottom: 1px solid rgba(var(--c-accent-rgb), .16); }
.mh-goal:last-child { border-bottom: none; }
.mh-gn b { display: block; font: 600 24px/1.25 var(--font-body); }
.mh-gn span { display: block; margin-top: 4px; font-size: 16px; color: var(--c-ink-2); }
.mh-gm { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.mh-big { font: 600 30px/1.2 var(--font-num); }
.mh-big span { margin-left: 10px; font-size: 18px; font-weight: 500; color: var(--c-ink-2); }
.mh-v { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.mh-vt { display: inline-flex; align-items: center; gap: 8px; font: 600 19px var(--font-body); }
.mh-vt i, .mh-sev i { width: 13px; height: 13px; border-radius: 50%; background: var(--c-ink-2); }
.mh-yes i { background: var(--c-ok); }
.mh-no i { background: var(--c-danger-2); }
.mh-watch i { background: var(--c-warn); }
.mh-vn { font: 500 16px var(--font-num); color: var(--c-ink-2); }
.mh-vn.few { color: var(--c-warn); }
.mh-side { display: flex; flex-direction: column; gap: 20px; min-height: 0; }
.mh-card { display: flex; flex-direction: column; gap: 14px; padding: 22px 28px; text-align: left; color: var(--c-ink); font: inherit; cursor: pointer; border: none; }
.mh-card:hover { box-shadow: inset 0 0 0 2px rgba(var(--c-accent-2-rgb), .7), 0 12px 30px rgba(var(--c-shadow-rgb), .45); }
.mh-card:focus-visible { outline: 3px solid var(--c-accent-2); outline-offset: 2px; }
.mh-ch { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.mh-ch h2 { margin: 0; font: 700 32px var(--font-display); color: var(--c-accent-2-tx); }
.mh-ch span { font: 600 17px var(--font-body); color: var(--c-accent-2); white-space: nowrap; }
.mh-card p { margin: 0; font-size: 16px; line-height: 1.4; color: var(--c-ink-2); }
.mh-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.mh-kpi b { display: block; font: 700 44px/1 var(--font-num); }
.mh-kpi span { display: block; margin-top: 6px; font-size: 16px; line-height: 1.35; color: var(--c-ink-2); }
.mh-sevs { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.mh-sev { display: inline-flex; align-items: center; gap: 8px; font: 600 19px var(--font-body); }
.mh-s-alarm i { background: var(--c-danger-2); }
.mh-s-watch i { background: var(--c-warn); }
.mh-s-ok { color: var(--c-ink-2); }
.mh-s-ok i { background: var(--c-ok); }
.mh-top { margin: 0; padding-left: 26px; font-size: 18px; line-height: 1.5; }
.mh-cov { display: flex; align-items: center; gap: 18px; }
.mh-cov b { font: 700 26px var(--font-num); white-space: nowrap; }
.mh-covbar { flex: 1; height: 14px; border-radius: 7px; overflow: hidden; display: flex; background: rgba(var(--c-accent-rgb), .18); }
.mh-covbar i { display: block; height: 100%; }
.mh-c-shown { background: var(--c-ok); }
.mh-c-partial { background: var(--c-warn); }
.mh-c-hidden { background: var(--c-ink-2); }
.mh-c-missing { background: var(--c-danger-2); }
.mh-limit { grid-column: 1 / -1; margin: 0; font-size: 16px; color: var(--c-ink-2); }
.mh-limit b { color: var(--c-danger-2); font-size: 14px; letter-spacing: .1em; text-transform: uppercase; }
.mana.w-m .mh { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
.mana.w-m .mh-goal { grid-template-columns: minmax(0, 1fr) auto; }
.mana.w-m .mh-gm { grid-column: 1 / -1; grid-row: 2; }
.mana.w-s .mh { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
.mana.w-s .mh-goals { padding: 16px 18px 4px; }
.mana.w-s .mh-goal { grid-template-columns: minmax(0, 1fr) auto; padding: 14px 0; }
.mana.w-s .mh-gm { grid-column: 1 / -1; grid-row: 2; }
.mana.w-s .mh-gh h2 { font-size: 30px; }
.mana.w-s .mh-card { padding: 16px 18px; }

/* «Люди» → «Обзор» (manalpeople.ts) */
.mp-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; flex: none; }
.mp-tile { padding: 18px 22px; display: flex; flex-direction: column; gap: 10px; }
.mp-th { display: flex; justify-content: space-between; gap: 8px; font: 600 15px var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--c-ink-2); }
.mp-tone.ok { color: var(--c-ok); }
.mp-tone.watch { color: var(--c-warn); }
.mp-tone.alarm { color: var(--c-danger-2); }
.mp-big { font: 700 50px/1 var(--font-num); }
.mp-tf { display: flex; justify-content: space-between; gap: 8px; font: 500 16px var(--font-num); color: var(--c-ink-2); }
.mp-panels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; flex: none; }
.mp-panel { padding: 20px 24px; display: flex; flex-direction: column; gap: 14px; }
.mp-panel h3, .mp-card h3 { margin: 0; font: 700 28px var(--font-display); color: var(--c-accent-2-tx); }
.mp-bars { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content; gap: 12px 14px; align-items: center; font-size: 18px; }
.mp-bars b { font: 600 18px var(--font-num); text-align: right; }
.mp-barw { position: relative; height: 14px; border-radius: 7px; background: rgba(var(--c-accent-rgb), .12); }
.mp-barw i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 7px; background: var(--c-accent); }
.mp-barw.think i { background: rgba(var(--c-ink-rgb), .3); }
.mp-barw em { position: absolute; top: -4px; width: 4px; height: 22px; margin-left: -2px; background: var(--c-ink); }
.mp-ct { width: 100%; border-collapse: collapse; font-size: 18px; }
.mp-ct th { text-align: right; font: 600 14px var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--c-ink-2); padding: 4px 0; }
.mp-ct th:first-child, .mp-ct td:first-child { text-align: left; }
.mp-ct td { text-align: right; padding: 7px 0 7px 10px; border-top: 1px solid rgba(var(--c-accent-rgb), .14); font-family: var(--font-num); }
.mp-ct td:first-child { font-family: var(--font-body); padding-left: 0; }
.mp-ct td span { color: var(--c-ink-2); }
.mana.w-m .mp-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mana.w-m .mp-panels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mana.w-s .mp-tiles, .mana.w-s .mp-panels { grid-template-columns: minmax(0, 1fr); }
.mana.w-m .mp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mana.w-s .mp-grid { grid-template-columns: minmax(0, 1fr); }
.mana.w-s .mp-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* «Баланс» → «Разбор» and the older tabs at the narrower widths */
/* narrower: the review's three columns become one scrolling page (list under the verdict, charts after) */
.mana.w-m .ana-cols { flex: none; grid-template-columns: 280px minmax(0, 1fr); align-items: start; }
.mana.w-m .ana-charts { grid-column: 1 / -1; grid-template-rows: none; }
.mana.w-s .ana-cols { flex: none; grid-template-columns: minmax(0, 1fr); }
.mana.w-s .ana-charts { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
.mana.w-s .ana-left, .mana.w-s .ana-list, .mana.w-m .ana-list, .mana.w-m .ana-left { overflow: visible; }
.mana.w-m .ana-svg, .mana.w-s .ana-svg { flex: none; }
.mana.w-m .ana-svg svg, .mana.w-s .ana-svg svg { height: auto; aspect-ratio: 360 / 250; }
.mana.w-s .ana-verdict .ana-ring svg { width: 140px; height: 140px; }
.mana.w-s .mc-area, .mana.w-s .mp-card { overflow-x: auto; }
.mana.w-s .mc-note { min-width: 260px; }
.mana .manal-svg { width: 100%; height: auto; }

/* 09.10: the funnel panel across the grid, one fight in detail (fightDetail), the day-by-day sparkline */
.mp-panel.wide { grid-column: 1 / -1; }
.mp-row { cursor: pointer; }
.mp-row:hover td { background: rgba(var(--c-accent-rgb), .08); }
.mp-row.on td { background: rgba(var(--c-accent-rgb), .16); }

/* ===== 09.10 «Гроссбух» (owner: «экраны аналитики очень некрасивые»): calmer plaques, numbers large, explanations behind «?»,
   an empty card one quiet line, the fight in detail as one table (canvas «Разбор боя v2»). Later rules override the ones above. */
.mana .ana-plq { background: var(--c-surface); box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb), .14); border-radius: 16px; }
.mana .mp-grid { gap: 18px; }
.mana .mp-card, .mana .mp-panel { padding: 20px 24px; gap: 14px; }
.mp-ch { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mp-ch h3 { margin: 0; font: 700 26px/1.15 var(--font-display); color: var(--c-accent-2-tx); }
.btn.mp-q { flex: none; width: 32px; height: 32px; min-height: 0; padding: 0; border-radius: 50%; background: none; box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb), .4); color: var(--c-ink-2); font: 600 16px var(--font-body); }
.btn.mp-q.on, .btn.mp-q:hover { color: var(--c-on-accent); background: var(--c-accent-2); box-shadow: none; }
.mp-note { margin: 0; padding: 12px 14px; border-radius: 10px; background: rgba(var(--c-accent-rgb), .07); font-size: 16px; line-height: 1.45; color: var(--c-ink-2); }
.mp-empty { margin: 0; font-size: 17px; color: var(--c-ink-2); font-style: italic; }
.mp-cells { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 16px 20px; }
.mp-cell { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mp-cl { font-size: 15px; line-height: 1.3; color: var(--c-ink-2); }
.mp-cv { font: 700 30px/1.1 var(--font-num); color: var(--c-ink); overflow-wrap: anywhere; }
.mp-cn { font: 500 14px var(--font-num); color: var(--c-ink-2); }
.mp-cell.long { grid-column: 1 / -1; }
.mp-cell.long .mp-cv { font: 500 19px/1.4 var(--font-body); }
.mana .btn.ana-pill { height: 36px; padding: 0 14px; font-size: 15px; }
.mana .mp-filters .cap { font-size: 13px; }
.mp-fewchip { margin-left: auto; padding: 7px 14px; border-radius: 999px; background: rgba(var(--c-warn-rgb), .12); color: var(--c-warn); font: 600 15px var(--font-body); }
.mana .ana-sub, .mana .mp-tf, .mana .mbl-ticks { font-size: 16px; }
.mana .manal-t td, .mana .manal-t th, .mana .mp-t td, .mana .mb-t td { font-size: 16px; }
.mana .mp-tile { padding: 20px 24px; }
.mana .mp-big { font-size: 54px; }

/* the fight in detail */
.fd { display: flex; flex-direction: column; gap: 18px; }
.fd-h { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.fd-h h2 { margin: 0; font: 700 40px/1 var(--font-display); color: var(--c-accent-2-tx); }
.btn.fd-back { height: 44px; min-height: 0; padding: 0 18px; border-radius: 10px; background: none; box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb), .4); color: var(--c-accent-2); font: 600 17px var(--font-body); }
.fd-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.fd-chips span { padding: 7px 14px; border-radius: 999px; background: rgba(var(--c-ink-rgb), .07); font: 500 16px var(--font-body); }
.fd-chips span.ok { background: rgba(var(--c-ok-rgb), .14); color: var(--c-ok); font-weight: 600; }
.fd-chips span.bad { background: rgba(var(--c-danger-2-rgb), .14); color: var(--c-danger-2); font-weight: 600; }
.fd-sec { padding: 20px 26px; display: flex; flex-direction: column; gap: 12px; }
.fd-legend { display: flex; gap: 18px; flex-wrap: wrap; font-size: 17px; }
.fd-legend span { display: inline-flex; align-items: center; gap: 8px; }
.fd-sw { width: 16px; height: 4px; border-radius: 2px; }
.fd-chart svg { display: block; width: 100%; height: 230px; }
.fd-line { fill: none; stroke-width: 3.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.fd-line.bot { stroke-dasharray: 7 6; opacity: .75; }
.fd-dash { stroke-dasharray: 4 6; }
.fd-tick { font: 500 15px var(--font-num); fill: var(--c-ink-2); }
.fd-axis { display: flex; justify-content: space-between; padding: 0 0 0 4%; font: 500 15px var(--font-num); color: var(--c-ink-2); }
.fd-hint { font-size: 16px; color: var(--c-ink-2); }
.fd-scroll { overflow-x: auto; }
.fd-t { width: 100%; border-collapse: collapse; font-family: var(--font-num); }
.fd-t th { text-align: left; padding: 4px 10px 10px; font: 600 14px var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--c-ink-2); white-space: nowrap; }
.fd-t td { padding: 9px 10px; border-top: 1px solid rgba(var(--c-accent-rgb), .12); font-size: 15px; color: var(--c-ink-2); white-space: nowrap; }
.fd-t td b { font-size: 19px; color: var(--c-ink); margin-right: 6px; }
.fd-t td.fd-r { font-size: 19px; color: var(--c-ink); }
.fd-t td.fd-rule { font: 500 17px var(--font-body); color: var(--c-ink); }
.fd-t tr.fd-pick td { font-size: 16px; }
.fd-t td.fd-gone { color: var(--c-ink-dim); }
.fd-t td.out { background: rgba(var(--c-danger-2-rgb), .1); }
.fd-t td.win { background: rgba(var(--c-ok-rgb), .1); }
.fd-out { color: var(--c-danger-2); }
.fd-win { color: var(--c-ok); }
.s0.fd-sw, .fd-line.s0 { background: var(--c-accent-2); stroke: var(--c-accent-2); } .fd-t th.s0 { color: var(--c-accent-2); }
.s1.fd-sw, .fd-line.s1 { background: var(--c-info); stroke: var(--c-info); } .fd-t th.s1 { color: var(--c-info); }
.s2.fd-sw, .fd-line.s2 { background: var(--c-ok); stroke: var(--c-ok); } .fd-t th.s2 { color: var(--c-ok); }
.s3.fd-sw, .fd-line.s3 { background: var(--c-danger-2); stroke: var(--c-danger-2); } .fd-t th.s3 { color: var(--c-danger-2); }
.s4.fd-sw, .fd-line.s4 { background: var(--c-magic); stroke: var(--c-magic); } .fd-t th.s4 { color: var(--c-magic); }
.mana.w-s .fd-h h2 { font-size: 30px; }
.mana.w-s .mp-ch, .mana.w-m .mp-ch { flex-wrap: wrap; }

/* ===== «Баланс» v2 (09.10, canvas «Баланс → Разбор v2»): the counts are the filter, the list on the left, the charts on the right. */
.rv-page { display: flex; flex-direction: column; gap: 16px; height: 100%; min-height: 0; color: var(--c-ink); font-family: var(--font-body); }
.rv-head { display: flex; align-items: center; gap: 12px 14px; flex-wrap: wrap; flex: none; }
.rv-sevs, .rv-fams { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.rv-fams { padding-left: 14px; border-left: 1px solid rgba(var(--c-accent-rgb), .3); }
.btn.rv-sev { height: 54px; min-height: 0; padding: 0 16px; border-radius: 14px; gap: 10px; align-items: baseline; background: none; box-shadow: inset 0 0 0 1px rgba(var(--c-accent-rgb), .3); color: var(--c-ink-2); text-transform: none; letter-spacing: 0; }
.btn.rv-sev b { font: 700 30px/1 var(--font-num); }
.btn.rv-sev span { font: 500 17px var(--font-body); }
.btn.rv-sev.on { color: var(--c-ink); }
.btn.rv-sev.rv-alarm.on { box-shadow: inset 0 0 0 2px var(--c-danger-2); background: rgba(var(--c-danger-2-rgb), .1); }
.btn.rv-sev.rv-alarm b { color: var(--c-danger-2); }
.btn.rv-sev.rv-watch.on { box-shadow: inset 0 0 0 2px var(--c-warn); background: rgba(var(--c-warn-rgb), .1); }
.btn.rv-sev.rv-watch b { color: var(--c-warn); }
.btn.rv-sev.rv-few.on, .btn.rv-sev.rv-ok.on { box-shadow: inset 0 0 0 2px var(--c-ink-2); background: rgba(var(--c-ink-rgb), .06); }
.btn.rv-sev.rv-ok b { color: var(--c-ok); }
.rv-meta { margin-left: auto; display: flex; align-items: center; gap: 12px; font: 500 15px var(--font-num); color: var(--c-ink-2); }
.mb-meta { margin-left: 0; }
.rv-cols { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 20px; }
.rv-list { min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 12px; padding-right: 6px; }
.rv-charts { min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 16px; padding-right: 6px; }
.rv-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.rv-f { padding: 16px 22px; display: flex; flex-direction: column; gap: 8px; flex: none; }
.rv-fh { display: flex; align-items: center; gap: 12px; font: 600 14px var(--font-body); letter-spacing: .08em; text-transform: uppercase; }
.rv-dot { display: inline-flex; align-items: center; gap: 7px; }
.rv-dot i { width: 11px; height: 11px; border-radius: 50%; background: var(--c-ink-2); }
.rv-dot.rv-alarm i { background: var(--c-danger-2); }
.rv-dot.rv-watch i { background: var(--c-warn); }
.rv-dot.rv-ok i { background: var(--c-ok); }
.rv-fam { color: var(--c-ink-2); }
.rv-ba { margin-left: auto; text-transform: none; letter-spacing: 0; font: 500 16px var(--font-num); color: var(--c-ink-2); }
.rv-ba b { color: var(--c-ink); }
.rv-ft { font: 600 21px/1.3 var(--font-body); }
.rv-fp { font-size: 16px; line-height: 1.45; color: var(--c-ink-2); overflow-wrap: anywhere; }
.rv-fa { font-size: 16px; line-height: 1.4; color: var(--c-accent-2); }
.rv-fb { display: flex; gap: 8px; }
.rv-none { padding: 20px 24px; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.rv-ch { padding: 18px 22px; display: flex; flex-direction: column; gap: 10px; flex: none; }
.rv-chb { display: flex; gap: 8px; align-items: center; }
.rv-sub { font-size: 15px; color: var(--c-ink-2); }
.rv-row { display: grid; grid-template-columns: 120px minmax(0, 1fr) 110px; gap: 14px; align-items: center; font-size: 18px; }
.rv-row .mbl-wrap { gap: 0; }
.rv-val { text-align: right; font: 600 18px var(--font-num); }
.rv-val small { font-size: 13px; font-weight: 500; color: var(--c-ink-2); }
.rv-cls { display: flex; flex-direction: column; gap: 10px; }
.rv-axis { display: flex; justify-content: space-between; margin: 0 124px 0 134px; font: 500 14px var(--font-num); color: var(--c-ink-2); }
.rv-tempo { display: grid; grid-template-columns: max-content repeat(5, minmax(0, 1fr)); gap: 8px; align-items: center; text-align: center; font: 600 17px var(--font-num); }
.rv-th { font: 500 14px var(--font-body); color: var(--c-ink-2); text-align: left; }
.rv-th.c { text-align: center; }
.rv-tl { font: 500 15px var(--font-body); text-align: left; padding-right: 6px; }
.rv-tc { padding: 8px 0; border-radius: 8px; }
.rv-tc.lead { background: rgba(var(--c-accent-rgb), var(--a)); }
.rv-tc.last { background: rgba(var(--c-info-rgb), var(--a)); }
.rv-bets { display: flex; flex-direction: column; gap: 10px; }
.rv-leg { display: flex; gap: 14px; font-size: 14px; color: var(--c-ink-2); }
.rv-leg span { display: inline-flex; align-items: center; gap: 6px; }
.rv-leg i { width: 12px; height: 12px; border-radius: 3px; }
.rv-bet { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 4px 12px; align-items: center; }
.rv-bw { font-size: 16px; }
.rv-bw small { font-size: 12px; color: var(--c-ink-2); }
.rv-bars { display: flex; height: 24px; border-radius: 6px; overflow: hidden; background: rgba(var(--c-accent-rgb), .1); }
.rv-bars i { display: block; height: 100%; }
.rv-bv { grid-column: 2; font: 500 14px var(--font-num); color: var(--c-ink-2); }
.rv-b-zero { background: var(--c-ink-dim); }
.rv-b-middle { background: var(--c-accent); }
.rv-b-max { background: var(--c-danger-2); }
.rv-carry { margin: 0; font-size: 14px; color: var(--c-ink-2); }
.rv-svg svg { width: 100%; height: auto; max-height: 300px; display: block; }
.mana.w-m .rv-cols, .mana.w-s .rv-cols { grid-template-columns: minmax(0, 1fr); flex: none; }
.mana.w-m .rv, .mana.w-s .rv { height: auto; }
.mana.w-m .rv-list, .mana.w-s .rv-list, .mana.w-m .rv-charts, .mana.w-s .rv-charts { overflow: visible; }
.mana.w-s .rv-two { grid-template-columns: minmax(0, 1fr); }
.mana.w-s .rv-fams { padding-left: 0; border-left: none; }
.mana.w-s .rv-meta { margin-left: 0; }
.mana.w-s .rv-row { grid-template-columns: 90px minmax(0, 1fr) 90px; }
.mana.w-s .rv-axis { margin: 0 94px 0 104px; }
/* «Все цифры»: sections as plaques, numbers right, intervals dim */
.mana .mb-sec { padding: 4px 16px; }
.mana .btn.mb-head { height: 52px; font-size: 22px; }
.mana .mb-body { padding: 0 6px 14px; display: flex; flex-direction: column; gap: 10px; }
.mb-scroll { overflow-x: auto; }
.mana .mb-t { width: 100%; }
.mana .mb-t th { font-size: 13px; padding: 8px 12px; white-space: nowrap; }
.mana .mb-t td { font-size: 17px; padding: 8px 12px; color: var(--c-ink); }
.mana .mb-t td.num { text-align: right; font-family: var(--font-num); }
.mana .mb-t td small { font-size: 13px; color: var(--c-ink-2); }
/* the kit tourney: the same plaques and number cells */

/* ===== «Турнир наборов» v2 and «Данные» v2 (09.10, canvas «Турнир наборов v2»): tables instead of paragraphs, the same plaques */
.tv { display: flex; flex-direction: column; gap: 16px; }
.tv-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.tv-kpi { padding: 14px 20px; display: flex; flex-direction: column; gap: 2px; }
.tv-kpi span { font-size: 15px; color: var(--c-ink-2); }
.tv-kpi b { font: 700 42px/1.1 var(--font-num); }
.tv-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.tv-main { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.tv-side { display: flex; flex-direction: column; gap: 16px; }
.tv-card { padding: 18px 24px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.tv-tag { display: flex; align-items: center; gap: 9px; font: 600 14px var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--c-ink-2); }
.tv-tag i { width: 11px; height: 11px; border-radius: 50%; }
.tv-tag i.bad { background: var(--c-danger-2); }
.tv-tag i.warn { background: var(--c-warn); }
.tv-tag i.ok { background: var(--c-ok); }
.tv-big { font: 600 22px/1.3 var(--font-body); }
.tv-sub { margin: 0; font-size: 16px; color: var(--c-ink-2); }
.tv-act { font-size: 16px; color: var(--c-accent-2); }
.tv-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.tv-chips span { padding: 6px 12px; border-radius: 999px; background: rgba(var(--c-ink-rgb), .07); font: 600 16px var(--font-num); }
.tv-chips span.dim { background: none; color: var(--c-ink-2); }
.tv-t { width: 100%; border-collapse: collapse; font-family: var(--font-num); }
.tv-t th { text-align: right; padding: 4px 10px 8px; font: 600 13px var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--c-ink-2); white-space: nowrap; }
.tv-t th:first-child { text-align: left; padding-left: 0; }
.tv-t td { text-align: right; padding: 8px 10px; border-top: 1px solid rgba(var(--c-accent-rgb), .12); font-size: 18px; }
.tv-t td:first-child { text-align: left; padding-left: 0; }
.tv-t td.nm { font: 500 18px var(--font-body); }
.tv-price .tv-t th:last-child { text-align: left; }
.tv-t td.act { text-align: left; font: 500 15px var(--font-body); color: var(--c-ink-2); }
.tv-t td.hi { color: var(--c-danger-2); }
.tv-t td.lo { color: var(--c-info); }
.tv .hot { color: var(--c-danger-2); }
.tv .cold { color: var(--c-info); }
.tv .dim { color: var(--c-ink-2); }
.tv-rows { display: flex; flex-direction: column; gap: 8px; }
.tv-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 18px; align-items: baseline; font-size: 18px; }
.tv-row small { color: var(--c-ink-2); font-size: 14px; }
.tv-row b { font: 600 18px var(--font-num); }
.tv-spr { display: grid; grid-template-columns: max-content minmax(0, 1fr) minmax(0, 1fr); gap: 8px 16px; font-size: 17px; }
.tv-spr b { font-family: var(--font-num); }
.tv-leg { display: flex; gap: 18px; font-size: 15px; color: var(--c-ink-2); }
.tv-leg span { display: inline-flex; align-items: center; gap: 7px; }
.tv-leg i { width: 14px; height: 8px; border-radius: 3px; }
.tv-leg i.top, .tv-mb i.top { background: var(--c-accent); }
.tv-leg i.all, .tv-mb i.all { background: rgba(var(--c-ink-rgb), .3); }
.tv-mrows { display: flex; flex-direction: column; gap: 10px; }
.tv-mrow { display: grid; grid-template-columns: 220px minmax(0, 1fr) 120px; gap: 14px; align-items: center; font-size: 17px; }
.tv-mrow b { text-align: right; font: 600 17px var(--font-num); }
.tv-nm { font: 500 17px var(--font-body); }
.tv-mb { display: flex; flex-direction: column; gap: 3px; }
.tv-mb i { display: block; height: 9px; border-radius: 4px; }
.tv .manal-svg { width: 100%; height: auto; }
.mana.w-m .tv-main, .mana.w-s .tv-main, .mana.w-s .tv-two { grid-template-columns: minmax(0, 1fr); }
.mana.w-s .tv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mana.w-s .tv-mrow { grid-template-columns: 120px minmax(0, 1fr) 90px; }
/* «Данные» */
.mc-sum { padding: 18px 24px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 20px; align-items: center; flex: none; }
.mc-big { display: flex; align-items: baseline; gap: 10px; }
.mc-big b { font: 700 46px/1 var(--font-num); color: var(--c-ok); }
.mc-big span { font-size: 18px; color: var(--c-ink-2); }
.mc-bar { height: 14px; border-radius: 7px; overflow: hidden; display: flex; background: rgba(var(--c-accent-rgb), .12); }
.mc-bar i { display: block; height: 100%; }
.mc-b-shown { background: var(--c-ok); }
.mc-b-partial { background: var(--c-warn); }
.mc-b-hidden { background: var(--c-ink-2); }
.mc-b-missing { background: var(--c-danger-2); }
.mc-meta { display: flex; align-items: center; gap: 10px; font: 500 15px var(--font-num); color: var(--c-ink-2); }
.mc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.mana .mc-area { padding: 18px 22px; display: flex; flex-direction: column; gap: 10px; }
.mc-cnt { font: 600 18px var(--font-num); color: var(--c-ink-2); }
.mc-mini { height: 4px; border-radius: 2px; background: rgba(var(--c-accent-rgb), .14); overflow: hidden; }
.mc-mini i { display: block; height: 100%; background: var(--c-ok); }
.mc-rows { display: flex; flex-direction: column; }
.mc-row { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 9px 0; border-top: 1px solid rgba(var(--c-accent-rgb), .1); }
.mc-row:first-child { border-top: none; }
.mc-dot { width: 10px; height: 10px; margin-top: 7px; border-radius: 50%; }
.mc-dot.mc-shown { background: var(--c-ok); }
.mc-dot.mc-partial { background: var(--c-warn); }
.mc-dot.mc-hidden { background: var(--c-ink-2); }
.mc-dot.mc-missing { background: var(--c-danger-2); }
.mc-name { font-size: 17px; line-height: 1.35; }
.mc-src { font-size: 14px; line-height: 1.4; color: var(--c-ink-2); }
.mc-have { font: 600 16px var(--font-num); white-space: nowrap; color: var(--c-ink); text-align: right; }
.mana.w-s .mc-grid, .mana.w-m .mc-grid { grid-template-columns: minmax(0, 1fr); }
.mana.w-s .mc-sum { grid-template-columns: minmax(0, 1fr); }
.tv-hist .manal-svg { max-height: 320px; }
.tv-top .tv-t td:nth-child(2), .tv-top .tv-t td:nth-child(5), .tv-top .tv-t td:nth-child(6), .tv-top .tv-t th:nth-child(2), .tv-top .tv-t th:nth-child(5), .tv-top .tv-t th:nth-child(6) { text-align: left; }
.tv-top .tv-t td:nth-child(5), .tv-top .tv-t td:nth-child(6) { font: 500 15px var(--font-body); color: var(--c-ink-2); }
.tv-pairs .tv-t td:nth-child(2), .tv-pairs .tv-t th:nth-child(2) { text-align: left; }
.tv-pairs .tv-t td:nth-child(-n+2) { font: 500 17px var(--font-body); }

/* «Баланс» → «Прогоны» (manalruns.ts, 09.10): the run now on the left (state, bar, stages, output), a new run on the right */
.mrun-cols { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.mrun-left { display: flex; flex-direction: column; gap: 18px; }
.mrun-now, .mrun-start, .mrun-log { padding: 20px 24px; display: flex; flex-direction: column; gap: 14px; }
.mrun-head { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.mrun-state { display: inline-flex; align-items: center; gap: 10px; font: 700 26px var(--font-display); color: var(--c-accent-2-tx); }
.mrun-state i { width: 14px; height: 14px; border-radius: 50%; background: var(--c-ink-2); }
.mrun-state.st-running i { background: var(--c-warn); animation: mrun-pulse 1.2s ease-in-out infinite; }
.mrun-state.st-done i { background: var(--c-ok); }
.mrun-state.st-error i, .mrun-state.st-stopped i { background: var(--c-danger-2); }
@keyframes mrun-pulse { 50% { opacity: .35; } }
.mrun-req { font: 500 16px var(--font-num); color: var(--c-ink-2); }
.btn.mrun-stopb { margin-left: auto; }
.mrun-bar { height: 18px; border-radius: 9px; background: rgba(var(--c-accent-rgb), .14); overflow: hidden; }
.mrun-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--c-accent), var(--c-accent-2)); transition: width .6s ease; }
.mrun-stats { display: flex; gap: 22px; flex-wrap: wrap; font-size: 16px; color: var(--c-ink-2); }
.mrun-stats b { font: 700 24px var(--font-num); color: var(--c-ink); }
.mrun-steps { display: flex; flex-direction: column; gap: 9px; }
.mrun-step { display: grid; grid-template-columns: 240px minmax(0, 1fr) 110px; gap: 14px; align-items: center; font-size: 17px; }
.mrun-step b { text-align: right; font: 600 16px var(--font-num); color: var(--c-ink-2); }
.mrun-step.full b { color: var(--c-ok); }
.mrun-sb { height: 10px; border-radius: 5px; background: rgba(var(--c-accent-rgb), .12); overflow: hidden; }
.mrun-sb i { display: block; height: 100%; background: var(--c-accent); transition: width .6s ease; }
.mrun-step.full .mrun-sb i { background: var(--c-ok); }
.mrun-err { margin: 0; color: var(--c-danger-2); font-size: 16px; }
.mrun-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mrun-row .cap { min-width: 180px; font-size: 13px; }
.mrun-key input { flex: 1; min-width: 200px; height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid rgba(var(--c-accent-rgb), .35); background: rgba(var(--c-bg-rgb), .5); color: var(--c-ink); font: 500 16px var(--font-body); }
.mrun-hint { margin: 0; font-size: 15px; color: var(--c-ink-2); }
.mrun-log pre { margin: 0; max-height: 280px; overflow: auto; font: 13px/1.5 ui-monospace, Consolas, monospace; color: var(--c-ink-2); white-space: pre-wrap; }
.mana.w-m .mrun-cols, .mana.w-s .mrun-cols { grid-template-columns: minmax(0, 1fr); }
.mana.w-s .mrun-step { grid-template-columns: 120px minmax(0, 1fr) 90px; }
