/* Task 256: a universal card — income and expense lines of a project / client / company group in a grid like Excel */
#bgp-sales .bi-ec{display:flex;flex-direction:column;gap:12px;padding:8px 24px 32px;min-width:0}
#bgp-sales .bi-ec-head small{color:var(--secondary);font-size:12px}
#bgp-sales .bi-ec-head h1{margin:2px 0 4px;font-size:22px;line-height:1.25}
#bgp-sales .bi-ec-related{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px}
#bgp-sales .bi-ec-related a,#bgp-sales .bi-ec-grid a{color:inherit;text-decoration:underline;text-underline-offset:3px}
#bgp-sales .bi-ec-entity-head{display:flex;justify-content:space-between;align-items:start;gap:16px 32px;flex-wrap:wrap}
#bgp-sales .bi-ec-heading{flex:1 1 300px;min-width:0;overflow-wrap:anywhere}
#bgp-sales .bi-ec-relations{display:grid;gap:10px;max-width:100%;flex:0 1 48%;min-width:min(320px,100%);margin-left:auto}
#bgp-sales .bi-ec-relation{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px 16px;overflow-wrap:anywhere}
#bgp-sales .bi-ec-relation-label{color:var(--secondary)}
#bgp-sales .bi-ec-debt{min-width:0}
#bgp-sales .bi-ec>.bi-ec-scroll[hidden],#bgp-sales .bi-ec>.bi-ec-more[hidden],#bgp-sales .bi-ec-tools>[hidden]{display:none!important}
#bgp-sales .bi-ec-debt .bi-debt{padding:0;max-width:none}
#bgp-sales .bi-ec-debt .bd-head>div:first-of-type,#bgp-sales .bi-ec-debt .bd-back,#bgp-sales .bi-ec-debt .bd-relations,#bgp-sales .bi-ec-debt .bd-kpis{display:none}
#bgp-sales .bi-ec-debt .bd-head{flex-wrap:wrap;gap:12px;align-items:center}
#bgp-sales .bi-ec-debt .bd-head-meta{flex:1 1 auto}
#bgp-sales .bi-ec-debt .bd-paid-toggle{display:flex;align-items:center;flex-direction:row;gap:8px;white-space:nowrap;color:var(--text);font-size:13px}
#bgp-sales .bi-ec-debt .bd-paid-toggle input{width:auto;margin:0;accent-color:var(--actual)}
@media(max-width:700px){#bgp-sales .bi-ec-relations{flex-basis:100%;margin-left:0}}
#bgp-sales .bi-ec-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
#bgp-sales .bi-ec-kpis>div{display:grid;gap:2px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
#bgp-sales .bi-ec-kpis small{color:var(--secondary);font-size:12px}
#bgp-sales .bi-ec-kpis strong{font-size:16px;font-variant-numeric:tabular-nums;white-space:nowrap}
#bgp-sales .bi-ec-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
#bgp-sales .bi-ec-tabs{display:flex;gap:4px}
#bgp-sales .bi-ec-tabs button{height:32px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--text);font-size:13px;cursor:pointer}
#bgp-sales .bi-ec-tabs button span{color:var(--secondary);font-variant-numeric:tabular-nums}
#bgp-sales .bi-ec-tabs button[aria-selected=true]{background:var(--actual);border-color:var(--actual);color:var(--bg,#111)}
#bgp-sales .bi-ec-tabs button[aria-selected=true] span{color:inherit}
#bgp-sales .bi-ec-search input{height:32px;width:min(320px,80vw);padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font-size:13px}
#bgp-sales .bi-ec-excel{display:inline-flex;align-items:center;gap:8px;margin-left:auto}
#bgp-sales .bi-ec-note{margin:0;color:var(--secondary);font-size:12px}
#bgp-sales .bi-ec-scroll{overflow:auto;max-height:calc(100vh - 330px);min-height:200px;border:1px solid var(--line);border-radius:8px}
#bgp-sales .bi-ec-grid{min-width:100%;border-collapse:separate;border-spacing:0;font-size:12px;line-height:1.3}
#bgp-sales .bi-ec-grid th,#bgp-sales .bi-ec-grid td{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
#bgp-sales .bi-ec-grid th{position:sticky;top:0;z-index:2;padding:0;background:color-mix(in srgb,var(--line) 35%,var(--surface));text-align:left}
#bgp-sales .bi-ec-grid th button{width:100%;padding:4px 8px;border:0;background:transparent;color:var(--text);font-size:11px;font-weight:600;text-align:inherit;white-space:nowrap;cursor:pointer}
#bgp-sales .bi-ec-grid th.num{text-align:right}
#bgp-sales .bi-ec-grid th[aria-sort=ascending] button::after{content:' ↑'}
#bgp-sales .bi-ec-grid th[aria-sort=descending] button::after{content:' ↓'}
#bgp-sales .bi-ec-grid td{height:24px;padding:3px 8px;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:var(--surface)}
#bgp-sales .bi-ec-grid td.num{text-align:right;font-variant-numeric:tabular-nums}
#bgp-sales .bi-ec-grid tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--line) 12%,var(--surface))}
#bgp-sales .bi-ec-grid tbody tr:hover td{background:color-mix(in srgb,var(--actual) 10%,var(--surface))}
#bgp-sales .bi-ec-grid tr.bi-ec-skipped td{color:var(--secondary)}
#bgp-sales .bi-ec-grid td.bi-ec-empty{text-align:center;color:var(--secondary);padding:24px;max-width:none}
#bgp-sales .bi-ec-more{align-self:flex-start;height:32px;padding:0 14px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--text);cursor:pointer}
@media (max-width:700px){#bgp-sales .bi-ec{padding:4px 16px 24px}#bgp-sales .bi-ec-head h1{font-size:19px}#bgp-sales .bi-ec-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}#bgp-sales .bi-ec-excel{margin-left:0}#bgp-sales .bi-ec-scroll{max-height:70vh}}
#bgp-sales .bi-ec-gt{display:inline-flex}
/* Task 260: the filter row sticks under the header row */
#bgp-sales .bi-ec-grid .bi-gt-filter th{position:sticky;top:var(--gt-head-height,27px);z-index:1;padding:2px 4px;background:var(--surface);font-weight:400;text-align:left}
#bgp-sales .bi-ec-grid .bi-gt-filter th.num{text-align:left}
#bgp-sales .bi-ec-grid .bi-gt-filter .bi-gt-funnel{width:22px;padding:0;font-size:12px;font-weight:400;color:var(--secondary)}
#bgp-sales .bi-ec-grid .bi-gt-filter .bi-gt-funnel.is-active{color:var(--actual);font-weight:600}
/* Task 263: totals under the grid */
#bgp-sales .bi-ec-grid tfoot td{position:sticky;bottom:0;z-index:1;background:color-mix(in srgb,var(--line) 35%,var(--surface));font-weight:600;border-top:1px solid var(--line);white-space:nowrap}
#bgp-sales .bi-ec-grid tfoot td.num{text-align:right;font-variant-numeric:tabular-nums}

/* Task 267: the «Вид» combo and the group rows of the card grid */
#bgp-sales .bi-ec-view{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
#bgp-sales .bi-ec-viewlabel{display:inline-flex;flex-direction:row;align-items:center;gap:6px;margin:0;font-size:12px;color:var(--secondary);width:auto}
#bgp-sales .bi-ec-view select{height:32px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);font-size:13px}
#bgp-sales .bi-ec-viewactions{display:inline-flex;gap:6px}
#bgp-sales .bi-ec-viewactions button{height:28px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--text);font-size:12px;cursor:pointer}
#bgp-sales .bi-ec-grid tr.bi-ec-group td{background:color-mix(in srgb,var(--actual) 7%,var(--surface));font-weight:600;cursor:pointer;max-width:none}
#bgp-sales .bi-ec-grid tr.bi-ec-group td:first-child{white-space:nowrap}
#bgp-sales .bi-ec-grid tr.bi-ec-group small{color:var(--secondary);font-weight:400;margin-left:4px}
#bgp-sales .bi-ec-grid tr.bi-ec-group .bi-ec-group-toggle{width:20px;height:20px;padding:0;margin-right:4px;display:inline-grid;place-items:center;border:0;background:transparent;color:var(--text);cursor:pointer;font-size:12px;min-height:0}
#bgp-sales .bi-ec-grid tbody tr[style*="--group-level"] td:first-child{padding-left:calc(8px + var(--group-level,0) * 18px)}

/* Task 271: the «Остаток авансов» tile opens the «Авансы» tab */
#bgp-sales .bi-ec-kpis .bi-ec-kpi-link{cursor:pointer}
#bgp-sales .bi-ec-kpis .bi-ec-kpi-link:hover,#bgp-sales .bi-ec-kpis .bi-ec-kpi-link:focus-visible{border-color:var(--actual);outline:none}
/* Task 301: the charts of the card — the sales dashboard's panels (dynamics by month; the map with presets) between the tiles and the tabs */
#bgp-sales .bi-ec .bi-ec-charts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;height:max(420px,calc(100dvh - 520px));min-height:0}
#bgp-sales .bi-ec .bi-ec-charts>.bgp-panel{display:flex;flex-direction:column;min-height:0;min-width:0;height:100%;margin:0}
#bgp-sales .bi-ec .bi-ec-charts>.bgp-panel>.bgp-panel-head{flex:0 0 auto;padding:14px 18px 0;gap:10px}
#bgp-sales .bi-ec .bi-ec-charts>.bgp-dynamics-panel>.bgp-legend{flex:0 0 auto;padding:8px 18px 3px}
#bgp-sales .bi-ec .bi-ec-charts>.bgp-dynamics-panel>.bgp-plot-wrap{flex:1 1 auto;min-height:0;margin:4px 14px 0}
#bgp-sales .bi-ec .bi-ec-charts .bgp-plot{height:100%;min-height:0;width:100%}
#bgp-sales .bi-ec .bi-ec-charts>.bgp-sellers-panel>.bgp-seller-list{flex:1 1 auto;min-height:0;overflow:auto;padding:8px 12px 12px}
#bgp-sales .bi-ec .bi-ec-charts .bi-map-canvas{height:100%;min-height:260px}
#bgp-sales .bi-ec .bi-ec-chart-footer{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding:8px 18px}
#bgp-sales .bi-ec .bi-ec-range{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--secondary)}
#bgp-sales .bi-ec .bi-ec-range{flex-wrap:wrap;justify-content:center}
#bgp-sales .bi-ec .bi-ec-range label{display:flex;align-items:center;gap:6px}
#bgp-sales .bi-ec .bi-ec-range input[type=month]{width:145px;min-width:0;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:inherit;color-scheme:inherit}
#bgp-sales .bi-ec .bi-ec-range .xsel{min-width:210px}
#bgp-sales .bi-ec .bi-ec-revenue-swatch{background:var(--plan)}
/* task 345: the card's lines — a checkbox and the line's own swatch (the colour and the dash of the chart) */
#bgp-sales .bi-ec .bi-ec-legend{flex-wrap:wrap;column-gap:18px;row-gap:8px}
#bgp-sales .bi-ec .bi-ec-line-toggle{display:inline-flex;flex-direction:row;align-items:center;margin:0;width:auto;gap:8px;color:var(--secondary);font-size:11px;white-space:nowrap;cursor:pointer;user-select:none}
#bgp-sales .bi-ec .bi-ec-line-toggle input{appearance:auto;width:15px;height:15px;margin:0;padding:0;min-height:0;flex:none;accent-color:var(--actual);cursor:pointer}
#bgp-sales .bi-ec .bi-ec-line-toggle input:focus-visible{outline:2px solid var(--actual);outline-offset:2px;box-shadow:none}
#bgp-sales .bi-ec .bi-ec-line-toggle:has(input:not(:checked)){opacity:.55}
#bgp-sales .bi-ec .bi-ec-line-swatch{width:20px;height:0;border-top:2.5px solid var(--plan)}
#bgp-sales .bi-ec .bi-ec-line-swatch[data-line-kind="sales"]{border-color:var(--actual);border-top-width:3px}
#bgp-sales .bi-ec .bi-ec-line-swatch[data-line-kind="portfolio"]{border-color:var(--rr);border-top-style:dashed}
#bgp-sales .bi-ec .bi-ec-line-swatch[data-line-kind="advances"]{border-color:var(--warn);border-top-style:dotted;border-top-width:3px}
#bgp-sales .bi-ec .bi-ec-line-swatch[data-line-kind="debt"]{border-color:var(--bad)}
#bgp-sales .bi-ec .bi-ec-line-swatch[data-line-kind="margin"]{border-color:var(--cfo-margin);border-top-style:dashed;border-top-width:3px}
#bgp-sales .bi-ec .bi-ec-map-panel .bgp-panel-head{flex-wrap:wrap}
#bgp-sales .bi-ec .xsel-ec-map{min-width:220px}
#bgp-sales .bi-period-lines .bi-period-year{stroke:var(--line);stroke-dasharray:3 4}
#bgp-sales .bi-period-lines .bi-period-year-label{font-weight:600}
#bgp-sales .bi-period-dot{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;vertical-align:middle}
@media(max-width:1099px){#bgp-sales .bi-ec .bi-ec-charts{grid-template-columns:minmax(0,1fr);height:auto}#bgp-sales .bi-ec .bi-ec-charts>.bgp-dynamics-panel{height:440px}#bgp-sales .bi-ec .bi-ec-charts>.bgp-sellers-panel{height:520px}}
@media(max-width:600px){#bgp-sales .bi-ec .bi-ec-charts>.bgp-dynamics-panel{height:400px}#bgp-sales .bi-ec .bi-ec-charts>.bgp-sellers-panel{height:480px}#bgp-sales .bi-ec .bi-ec-range .xsel{min-width:170px}}
/* Task 310: the card of a cell of «Маркетинг» — what cell the lines are from, and «Вся карточка» */
#bgp-sales .bi-ec-cell{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin:0;padding:10px 14px;border:1px solid var(--line);border-left:3px solid var(--actual);border-radius:8px;background:var(--surface);color:var(--text);font-size:13px;line-height:1.45}
#bgp-sales .bi-ec-cell a{color:var(--actual);font-weight:600;white-space:nowrap}
#bgp-sales .bi-ec-kpis .bi-ec-kpi-sub{display:block;margin-top:2px;font-size:12px;color:var(--secondary)}#bgp-sales .bi-ec-kpis .bi-ec-kpi-sub[data-overdue="true"]{color:var(--bad)}  /* task 298 */
/* Task 337: the originators of the card — a list under the tiles, «уволен» when Bitrix says he no longer works */
#bgp-sales .bi-ec-people{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:0;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
#bgp-sales .bi-ec-people>small{color:var(--secondary);font-size:12px}
#bgp-sales .bi-ec-people ul{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0;padding:0;list-style:none}
#bgp-sales .bi-ec-people li{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;min-width:0}
#bgp-sales .bi-ec-person{font-weight:600;color:var(--text)}
#bgp-sales .bi-ec-person-meta{color:var(--secondary);font-size:12px}
#bgp-sales .bi-ec-badge{display:inline-block;padding:1px 8px;border:1px solid var(--bad);border-radius:6px;color:var(--bad);font-size:11px;font-weight:600;line-height:1.5;white-space:nowrap}
/* Task 350: the CFO card — the period «с … по» in the header, the rows of a negative portfolio */
#bgp-sales .bi-ec .bi-ec-charts-single,#bgp-sales #sales-view .bi-ec .bgp-charts-grid.bi-ec-charts-single{grid-template-columns:minmax(0,1fr);height:auto;flex:none}
#bgp-sales .bi-ec .bi-ec-charts-single>.bgp-dynamics-panel{height:440px}
#bgp-sales .bi-cfo-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 24px}
#bgp-sales .bi-cfo-head>div:first-child{min-width:0}
#bgp-sales .bi-cfo-asof{color:var(--secondary)}
#bgp-sales .bi-cfo-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
#bgp-sales .bi-cfo-period{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;color:var(--secondary);font-size:12px}
#bgp-sales .bi-cfo-period-part{display:flex;align-items:center;gap:6px 8px;min-width:0}
#bgp-sales .bi-cfo-period .xsel{min-width:96px;width:auto}
#bgp-sales .bi-period-lines .bi-period-unit{fill:var(--secondary);font-size:10px}
#bgp-sales .bi-period-lines .bi-period-right{fill:var(--cfo-margin,var(--secondary))}   /* task 364: the right scale (к.марж) */
/* Task 353 (owner 29.10.2026, «доделай карточку ЦФО по макету»): the mockup's colours as tokens of the four themes (contrast ≥ 4.5 on the
   tiles and on the pink of a negative row), the path, the coloured sums, the framed table; on a phone (< 600 px) the rows are cards */
#bgp-sales .bi-cfo{--cfo-sales:#167d5a;--cfo-revenue:#5a6fa3;--cfo-portfolio:#8553c2;--cfo-advances:#906018;--cfo-debt:#b23748;--cfo-debt-line:#f0c9cf;--cfo-debt-bg:#fdf6f7;--cfo-flag-bg:#b2374814;--cfo-margin:#1f6fae}
#bgp-sales[data-theme="dark"] .bi-cfo{--cfo-sales:#2ed9c3;--cfo-revenue:#9fb0dc;--cfo-portfolio:#d08ad4;--cfo-advances:#f3bd48;--cfo-debt:#ff7279;--cfo-debt-line:#7a3a3f;--cfo-debt-bg:#ff727910;--cfo-flag-bg:#ff72791f;--cfo-margin:#6fb6ff}
#bgp-sales[data-theme="light-mono"] .bi-cfo{--cfo-sales:#252525;--cfo-revenue:#555555;--cfo-portfolio:#555555;--cfo-advances:#494949;--cfo-debt:#494949;--cfo-debt-line:#bdbdbd;--cfo-debt-bg:#f6f6f6;--cfo-flag-bg:#0000000f;--cfo-margin:#333333}
#bgp-sales[data-theme="dark-mono"] .bi-cfo{--cfo-sales:#f4f4f4;--cfo-revenue:#c8c8c8;--cfo-portfolio:#c8c8c8;--cfo-advances:#d4d4d4;--cfo-debt:#d4d4d4;--cfo-debt-line:#5a5a5a;--cfo-debt-bg:#ffffff08;--cfo-flag-bg:#ffffff14;--cfo-margin:#e0e0e0}
#bgp-sales .bi-cfo-path{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:8px;margin:0;padding:0;font-size:12px;color:var(--secondary)}
#bgp-sales .bi-cfo-path a,#bgp-sales .bi-cfo-back{color:var(--secondary);text-underline-offset:3px}
#bgp-sales .bi-cfo-back{display:none;align-items:center;align-self:flex-start;min-height:32px;font-size:12px}
#bgp-sales .bi-cfo-narrow{display:none}
#bgp-sales .bi-cfo .bi-cfo-kpis{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
#bgp-sales .bi-cfo-kpis>div{gap:4px;padding:10px 14px}
#bgp-sales .bi-cfo-kpis strong{font-size:17px}
#bgp-sales .bi-cfo-kpis [data-cfo-kpi=sales]{color:var(--cfo-sales)}
#bgp-sales .bi-cfo-kpis [data-cfo-kpi=revenue]{color:var(--cfo-revenue)}
#bgp-sales .bi-cfo-kpis [data-cfo-kpi=portfolio]{color:var(--cfo-portfolio)}
#bgp-sales .bi-cfo-kpis [data-cfo-kpi=advances]{color:var(--cfo-advances)}
#bgp-sales .bi-cfo-kpis [data-cfo-kpi=margin]{color:var(--cfo-margin)}   /* task 364: «К.марж» */
#bgp-sales .bi-cfo-kpis [data-cfo-kpi=debt],#bgp-sales .bi-cfo-kpis [data-cfo-kpi][data-negative=true]{color:var(--cfo-debt)}
#bgp-sales .bi-cfo-kpis>[data-tip=debt]{border-color:var(--cfo-debt-line)}
#bgp-sales .bi-cfo-kpis .bi-ec-kpi-sub{margin-top:0;font-size:11px}
#bgp-sales .bi-cfo-rows{display:flex;flex-direction:column;gap:10px;min-width:0;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
#bgp-sales .bi-cfo-rows>.bi-ec-tools{justify-content:space-between}
#bgp-sales .bi-cfo-filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;min-width:0;max-width:100%}
#bgp-sales .bi-ec .bi-cfo-negative{min-height:32px;color:var(--text);font-size:12px}
#bgp-sales .bi-ec .bi-cfo-negative:has(input:not(:checked)){opacity:1}
#bgp-sales .bi-ec .bi-cfo-negative input{width:16px;height:16px;accent-color:var(--cfo-debt)}
#bgp-sales .bi-cfo-search{display:flex;flex-direction:row;align-items:center;gap:6px;width:auto;max-width:100%;min-width:0;margin:0;font-size:12px;color:var(--secondary)}
#bgp-sales .bi-cfo-search input{width:240px;max-width:100%;min-width:0}
#bgp-sales .bi-cfo-grid td[data-cfo-cell=portfolio]{color:var(--cfo-portfolio)}
#bgp-sales .bi-cfo-grid td[data-cfo-cell=debt]{color:var(--cfo-debt)}
#bgp-sales .bi-cfo-grid tr[data-negative=true] td{background:color-mix(in srgb,var(--cfo-debt) 5%,var(--surface))}
#bgp-sales .bi-cfo-grid tr[data-negative=true] td[data-cfo-cell=portfolio],#bgp-sales .bi-cfo-grid tfoot td[data-negative=true]{color:var(--cfo-debt);font-weight:600}
#bgp-sales .bi-cfo-grid tfoot td{font-weight:600}
#bgp-sales .bi-cfo-grid tbody tr[data-cfo-row]{cursor:default}
#bgp-sales .bi-cfo-grid td:first-child{min-width:160px;max-width:420px;white-space:normal}
#bgp-sales .bi-cfo-flag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:6px;background:var(--cfo-flag-bg);color:var(--cfo-debt);font-size:11px;font-weight:400;line-height:1.4;white-space:nowrap}
#bgp-sales .bi-cfo-cards{display:none}
#bgp-sales .bi-cfo .bi-ec-scroll{min-height:0}
#bgp-sales .bi-ec .bi-ec-line-short{display:none}
/* the mockup's legend sits in the chart's header on the right — on the CFO card only, where it fits (≥ 1200 px) */
@media(min-width:1200px){
#bgp-sales #sales-view .bi-cfo .bi-ec-charts-single>.bgp-dynamics-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(0,1fr) auto}
#bgp-sales .bi-cfo .bi-ec-charts>.bgp-dynamics-panel>.bgp-panel-head{grid-column:1;grid-row:1}
#bgp-sales .bi-cfo .bi-ec-charts>.bgp-dynamics-panel>.bi-ec-legend{grid-column:2;grid-row:1;align-self:start;flex-wrap:nowrap;justify-content:flex-end;padding:16px 18px 0}
#bgp-sales .bi-cfo .bi-ec-charts>.bgp-dynamics-panel>.bgp-plot-wrap,#bgp-sales .bi-cfo .bi-ec-charts>.bgp-dynamics-panel>.bi-ec-chart-footer{grid-column:1/-1}
}
@media(max-width:599px){
#bgp-sales .bi-cfo-path,#bgp-sales .bi-cfo .bi-cfo-wide,#bgp-sales .bi-cfo .bi-ec-excel,#bgp-sales .bi-cfo-filters,#bgp-sales .bi-cfo-state,#bgp-sales .bi-cfo-hint,#bgp-sales .bi-cfo .bi-ec-scroll{display:none}
#bgp-sales .bi-cfo-back{display:flex}
#bgp-sales .bi-cfo .bi-cfo-narrow{display:block;font-size:12px}
#bgp-sales .bi-cfo .bi-cfo-head{margin-top:-8px}
#bgp-sales .bi-cfo .bi-cfo-head small{font-size:11px}
#bgp-sales .bi-cfo .bi-cfo-head h1{margin:4px 0;font-size:20px}
#bgp-sales .bi-cfo-meta{flex-direction:column;gap:4px}
#bgp-sales .bi-cfo-tools,#bgp-sales .bi-cfo-period{width:100%}
#bgp-sales .bi-cfo-period{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#bgp-sales .bi-cfo-period-part{flex-direction:column;align-items:stretch;gap:4px}
#bgp-sales .bi-cfo-period .xsel{min-width:0;width:100%}
#bgp-sales .bi-cfo-period .xsel-t{height:44px;min-height:44px;font-size:14px}
#bgp-sales .bi-cfo .bi-cfo-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#bgp-sales .bi-cfo-kpis>div{gap:2px;padding:10px 12px}
#bgp-sales .bi-cfo-kpis small{font-size:11px}
#bgp-sales .bi-cfo-kpis strong{font-size:15px}
#bgp-sales .bi-cfo-kpis>[data-tip=debt],#bgp-sales .bi-cfo-kpis>[data-tip=margin]{grid-column:1/-1}
#bgp-sales .bi-cfo-kpis>:not([data-tip=debt]):not([data-tip=margin]):not([data-tip=portfolio]) .bi-ec-kpi-sub{display:none}   /* task 417: the portfolio's change stays */
#bgp-sales .bi-cfo .bi-ec-charts-single>.bgp-dynamics-panel{height:auto}
#bgp-sales .bi-cfo .bi-ec-charts>.bgp-dynamics-panel>.bgp-plot-wrap{flex:none;order:2;height:230px}
#bgp-sales .bi-cfo .bi-ec-charts>.bgp-dynamics-panel>.bi-ec-legend{order:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 8px;padding:4px 12px}
#bgp-sales .bi-cfo .bi-ec-charts>.bgp-dynamics-panel>.bi-ec-chart-footer{order:4}
#bgp-sales .bi-cfo .bi-ec-legend .bi-ec-line-toggle{min-height:44px;min-width:0;font-size:12px;white-space:normal}
#bgp-sales .bi-cfo .bi-ec-legend .bi-ec-line-toggle input{width:18px;height:18px}
#bgp-sales .bi-cfo .bi-ec-line-name{display:none}
#bgp-sales .bi-cfo .bi-ec-line-short{display:inline}
#bgp-sales .bi-cfo-rows{gap:8px;padding:0;border:0;background:none}
#bgp-sales .bi-cfo .bi-ec-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
#bgp-sales .bi-cfo .bi-ec-tabs button{height:44px;min-width:0;padding:0 6px;background:var(--surface)}
#bgp-sales .bi-cfo .bi-ec-tabs button[aria-selected=true]{background:var(--actual)}
#bgp-sales .bi-cfo-cards{display:flex;flex-direction:column;gap:8px;min-width:0}
}
#bgp-sales .bi-cfo-card{display:grid;gap:6px;min-width:0;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);text-decoration:none}
#bgp-sales .bi-cfo-card>strong{font-size:13px;overflow-wrap:anywhere}
#bgp-sales .bi-cfo-card-note{color:var(--secondary);font-size:11px;overflow-wrap:anywhere}
#bgp-sales .bi-cfo-card[data-negative=true]{border-color:var(--cfo-debt-line);background:var(--cfo-debt-bg)}
#bgp-sales .bi-cfo-card .bi-cfo-flag{justify-self:start;margin-left:0;white-space:normal}
#bgp-sales .bi-cfo-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 8px;font-size:12px}
#bgp-sales .bi-cfo-card-grid>span{min-width:0;overflow-wrap:anywhere}
#bgp-sales .bi-cfo-card-grid small{font-size:12px;color:inherit}
#bgp-sales .bi-cfo-card-grid b{font-weight:400;white-space:nowrap}
#bgp-sales .bi-cfo-card [data-cfo-cell=portfolio],#bgp-sales .bi-cfo-cards-total [data-cfo-cell=portfolio]{color:var(--cfo-portfolio)}
#bgp-sales .bi-cfo-card [data-cfo-cell=debt]{color:var(--cfo-debt)}
#bgp-sales .bi-cfo-card[data-negative=true] [data-cfo-cell=portfolio],#bgp-sales .bi-cfo-cards-total [data-negative=true]{color:var(--cfo-debt)}
#bgp-sales .bi-cfo-card[data-negative=true] [data-cfo-cell=portfolio] b{font-weight:600}
#bgp-sales .bi-cfo-cards-total{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-top:2px solid var(--line);font-weight:600}