/* Карточки и блоки дашборда: KPI, справка, таблицы, типы продаж, обзор, LFL, иконки блока, матрица */
.rd-list.scroll{max-height:440px;overflow:auto;scrollbar-width:none;-ms-overflow-style:none}
.catmenu{min-width:260px;max-height:none;scrollbar-width:none;-ms-overflow-style:none}
.catmenu::-webkit-scrollbar,.rd-list.scroll::-webkit-scrollbar{display:none;width:0;height:0}
#dd-shop .catmenu{min-width:300px}
.catsearch{width:100%;height:34px;margin:0 0 6px;font-size:13px}
.catopt .ol>span:last-child{overflow:hidden;text-overflow:ellipsis}
.rd-tiles{grid-template-columns:repeat(auto-fit,minmax(min(100%,128px),1fr))}
.rd-tile.sm .lbl{min-height:2.6em}
.rd-tile[data-go]{cursor:pointer;position:relative;transition:background .15s,transform .15s,box-shadow .15s}
.rd-tile[data-go]:hover{background:var(--accent-soft);transform:translateY(-1px)}
.rd-tile[data-go]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.rd-tile[data-go]::after{content:"";position:absolute;top:14px;right:14px;width:16px;height:16px;opacity:0;transition:opacity .15s;
  background:var(--accent);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M9 7h8v8'/%3E%3C/svg%3E") center/contain no-repeat}
.rd-tile[data-go]:hover::after{opacity:1}
.rd-tile.on,.rd-card.on{box-shadow:inset 0 0 0 1.5px var(--accent-line);background:var(--card)}
.rd-tile.on:hover{background:var(--card)}
.rd-tile.on .lbl{color:var(--accent);font-weight:400}
@keyframes rdflash{0%{box-shadow:0 0 0 4px var(--accent-line)}100%{box-shadow:0 0 0 0 transparent}}
.flash{animation:rdflash 1.4s ease-out}
#dd-metric{min-width:170px}
#dd-metric .catsel{height:30px;font-size:12.5px}
#lfl-m{margin-top:0}
.rd-tile[data-go] .lbl,.rd-tile.sm[data-go] .lbl{padding-right:10px}
.rd-tile[data-go]::after,.rd-tile.sm[data-go]::after{width:14px;height:14px;top:12px;right:10px}
/* нижняя строка KPI: подпись + иконка справки */
.rd-tile{padding:16px 18px}
.rd-tile.sm{padding:12px 16px}
.rd-tile.sm .lbl{margin-bottom:0}
.rd-tile.sm .val{margin-bottom:6px}
.rd-tile:not(.sm) .lbl{margin-bottom:0}
.rd-tile:not(.sm) .val{margin-bottom:6px}
.rd-tile .tf{position:relative;margin-top:auto;padding-right:26px;min-height:16px;display:flex;align-items:center}
.rd-tile .tf .help-btn,.rd-tile.sm .tf .help-btn{position:absolute;top:50%;bottom:auto;right:-6px;transform:translateY(-50%)}
.rd-tile .dlt{font-size:12.5px;color:var(--muted);line-height:1.35;white-space:nowrap;min-height:1.35em}
.rd-tile .dlt b{font-weight:600}
.rd-tile .dlt.none b{color:var(--muted2)}
.rd-tile.sm .help-btn{bottom:12px}
/* заголовок страницы */
:root{--text:var(--fg)}
.rd-title{font-family:inherit;font-size:20px;font-weight:700;letter-spacing:normal;line-height:1.3;color:var(--text);display:flex;align-items:center;gap:6px}
/* кнопка справки */
.help-btn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:none;background:none;color:var(--muted2);cursor:pointer;border-radius:50%;flex:none;transition:color .15s}
.help-btn svg{width:20px;height:20px}
.help-btn:hover{color:var(--fg)}
.help-btn:focus-visible{outline:none;color:var(--fg);background:var(--split)}
.rd-tile .help-btn{position:absolute;top:10px;right:10px}
.rd-tile .lbl{padding-right:24px}
.rd-tile.sm .help-btn{top:auto;bottom:10px;right:8px}
.rd-tile.sm .lbl{padding-right:0}
.rd-card-h h2{margin-right:auto}
/* модальное окно справки */
html.hm-lock{overflow:hidden}
.hm-ov{position:fixed;inset:0;z-index:100;background:rgba(20,20,60,.28);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .18s}
.hm-ov.in{opacity:1}
.hm{background:var(--card);border-radius:20px;box-shadow:0 24px 64px rgba(20,20,60,.22);width:min(660px,100%);max-height:calc(100vh - 40px);overflow:auto;scrollbar-width:none;padding:22px 22px 20px;display:flex;flex-direction:column;gap:14px;transform:translateY(8px) scale(.985);transition:transform .2s}
.hm::-webkit-scrollbar{display:none}
.hm-ov.in .hm{transform:none}
.hm-head{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.hm-ic{display:inline-flex;width:20px;height:20px;color:var(--muted)}
.hm-ic svg{width:20px;height:20px}
.hm-head h3{margin:0;font-size:16px;font-weight:700;flex:1;line-height:1.3}
.hm-x{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:none;background:var(--bg);color:var(--muted);cursor:pointer;flex:none}
.hm-x svg{width:16px;height:16px}
.hm-x:hover{color:var(--fg)}
.hm-desc{background:var(--bg);border-radius:12px;padding:14px 16px;font-size:14px;line-height:1.55}
.hm-lbl{font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.hm-formula{background:var(--bg);border-radius:12px;padding:12px 16px;font-size:14px;font-weight:600;line-height:1.5}
.hm-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.hm-lv{border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:5px}
.hm-lv-t{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13.5px}
.hm-lv-t .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.hm-lv-t .rg{font-weight:600}
.hm-lv-d{font-size:12.5px;line-height:1.45}
.hm-lv.ok{background:var(--ok-soft);color:var(--ok)}
.hm-lv.mid{background:var(--warn-soft);color:var(--warn)}
.hm-lv.bad{background:var(--bad-soft);color:var(--bad)}
.hm-cols{display:grid;grid-template-columns:1fr 1fr;gap:6px 28px}
.hm-cols>div{display:flex;flex-direction:column;gap:8px}
.hm-ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.hm-ul li{position:relative;padding-left:14px;font-size:13.5px;line-height:1.45}
.hm-ul li::before{content:"";position:absolute;left:1px;top:.58em;width:5px;height:5px;border-radius:50%;background:var(--muted2)}
.hm-rel{background:var(--bg);border-radius:12px;padding:12px 16px;font-size:13.5px;line-height:1.5;display:flex;gap:10px;align-items:flex-start;margin-top:6px}
.hm-ri{display:inline-flex;width:18px;height:18px;color:var(--muted);flex:none;margin-top:1px}
.hm-ri svg{width:18px;height:18px}
@media (max-width:600px){.hm-levels,.hm-cols{grid-template-columns:1fr}.hm{padding:18px 16px}}

/* таблицы: значения по центру, наименование слева */
.rd table th,.rd table td,.rd table th.r,.rd table td.r{text-align:center}
.rd table th[data-f=name],.rd table td.nm{text-align:left}

/* типы продаж: название и доля сверху, полоса, сумма и LFL снизу */
.rd-list.stack{gap:10px}
.rd-list.stack.scroll{gap:4px}
.rd-list.stack.scroll .rd-row{gap:6px;padding:7px 10px}
.rd-list.stack.scroll .st-name{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.rd-list.stack.scroll .st-sh{font-size:13.5px}
.rd-list.stack.scroll .track{height:7px}
.rd-list.stack .rd-row{display:flex;flex-direction:column;align-items:stretch;gap:7px;padding:8px 10px}
.rd-list.stack .st-top,.rd-list.stack .st-bot{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.rd-list.stack .st-name{font-size:14.5px;font-weight:600;color:var(--fg)}
.rd-list.stack .st-sh{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.rd-list.stack .track{height:9px;border-radius:99px;background:var(--split)}
.rd-list.stack .fill{border-radius:99px}
.rd-list.stack .st-sum{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.rd-list.stack .st-lfl{font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums}
.rd-list.stack .st-lfl:not(.up):not(.down){color:var(--muted)}
/* обзор: РТО 70% + типы продаж 30%, под ними LFL 70% + магазины 30% */
.rd-grid.ov{grid-template-columns:minmax(0,7fr) minmax(0,3fr)}
.rd-grid.ov>#card-trend{grid-column:1;grid-row:1}
.rd-grid.ov>#card-types{grid-column:2;grid-row:1}
.rd-grid.lf{grid-template-columns:minmax(0,7fr) minmax(0,3fr)}
.rd-grid.lf>#card-lfl{grid-column:1;grid-row:1}
.rd-grid.lf>#card-shops{grid-column:2;grid-row:1/3;min-height:0;position:relative}
.rd-grid.lf>#card-lflshops{grid-column:1;grid-row:2}
.rd-grid.lf>.wide{grid-column:1/-1}
.rd-grid.ov>.wide{grid-column:1/-1}
#card-shops .rd-list.scroll{max-height:350px}
@media (max-width:900px){
  .rd-grid.ov{grid-template-columns:minmax(0,1fr)}
  .rd-grid.ov>#card-trend,.rd-grid.ov>#card-types,.rd-grid.lf>#card-lfl,.rd-grid.lf>#card-shops,.rd-grid.lf>#card-lflshops{grid-column:1;grid-row:auto}
  .rd-grid.lf{grid-template-columns:minmax(0,1fr)}
}
/* одинаковые полосы во всех списках - как в «Магазинах» */
.rd-list .rd-row .track,.rd-list.inline .rd-row .track,.rd-list.stack .track,.rd-list.stack.scroll .track{height:7px;border-radius:99px;background:var(--split)}
.rd-list .rd-row .fill,.rd-list.stack .fill{border-radius:99px}
@media (min-width:641px){.rd-list.inline .rd-row{grid-template-columns:minmax(9rem,13rem) minmax(3rem,1fr) 22rem}}
/* второй ряд KPI - по 5 карточек */
@media (min-width:901px){.rd-tiles.sm-row{grid-template-columns:repeat(5,minmax(0,1fr))}.rd-tiles.sm-row .rd-tile.sm .lbl{min-height:0}}
/* LFL по магазинам */
.ls-wrap{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:18px;align-items:start}
.ls-groups{display:flex;flex-direction:column;gap:10px}
.ls-g{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:2px;align-items:center;border-radius:12px;padding:12px 14px;cursor:pointer;border:1.5px solid transparent;user-select:none}
.ls-g .n{grid-row:span 2;font-family:var(--head);font-size:28px;font-weight:700;line-height:1;min-width:2ch;font-variant-numeric:tabular-nums}
.ls-g .t{font-size:13.5px;font-weight:600}
.ls-g .s{font-size:12.5px;opacity:.85}
.ls-g.ok{background:var(--ok-soft);color:var(--ok)}
.ls-g.mid{background:var(--split);color:var(--muted)}
.ls-g.bad{background:var(--bad-soft);color:var(--bad)}
.ls-g.sel{border-color:currentColor}
.ls-g.zero{opacity:.5;cursor:default}
.ls-g:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ls-nb{font-size:12.5px;color:var(--muted);padding:0 4px}
.ls-hist{min-height:250px}
@media (max-width:900px){.ls-wrap{grid-template-columns:minmax(0,1fr)}}
/* иконки блока: фильтр, на весь экран, справка */
.rd-card-h{position:relative;flex-wrap:nowrap}
.rd-card-h h2{min-width:0}
.h-sub{font-size:12.5px;color:var(--muted);margin-right:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.rd-card-h .h-sub:not(:empty){margin-left:-2px}
.rd-card-h h2:has(+ .h-sub:not(:empty)){margin-right:8px}
.ci{display:flex;align-items:center;gap:4px;flex:none;margin-left:auto}
.ci-f{position:relative;display:flex}
.f-btn svg,.fs-btn svg{width:19px;height:19px}
.f-btn{position:relative}
.f-btn.dot::after{content:"";position:absolute;top:3px;right:3px;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px var(--card)}
.f-btn[aria-expanded=true]{color:var(--fg)}
.cm{position:absolute;top:calc(100% + 6px);right:-4px;width:min(290px,calc(100vw - 32px));background:var(--card);border-radius:14px;box-shadow:var(--menu-shadow);padding:8px;z-index:45;display:none;flex-direction:column;gap:6px;overflow-y:auto;scrollbar-width:none}
.cm::-webkit-scrollbar{display:none}
.cm.open{display:flex}
.cm-sec{display:flex;flex-direction:column;gap:2px;min-height:0;flex:none}
.cm-sec.many{flex:1 1 auto;min-height:120px}
.cm-sec+.cm-sec{border-top:1px solid var(--split);padding-top:8px}
.cm-t{display:flex;align-items:center;justify-content:space-between;font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted2);padding:4px 10px 6px}
.cm-reset{border:none;background:none;padding:0;font:inherit;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--accent);cursor:pointer}
.cm .catsearch{margin:0 0 6px;flex:none}
.cm-list{overflow-y:auto;min-height:0;flex:1 1 auto;scrollbar-width:none;display:flex;flex-direction:column;gap:2px}
.cm-list::-webkit-scrollbar{display:none}
.cm-o{display:flex;align-items:center;gap:8px;width:100%;border:none;background:none;text-align:left;font:inherit;font-size:13.5px;color:var(--fg);padding:8px 10px;border-radius:8px;cursor:pointer;flex:none}
.cm-o:hover,.cm-o:focus-visible{outline:none;background:var(--bg)}
.cm-o.sel{color:var(--accent);font-weight:600}
.cm-o .ck{margin-right:0}
.cm-l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-ic{width:18px;height:18px;flex:none;color:var(--accent)}
.cm-ic svg{width:18px;height:18px;display:block}
.cm-empty{font-size:13px;color:var(--muted);padding:10px}
/* блок на весь экран */
.fs-back{position:fixed;inset:0;z-index:90;background:rgba(20,20,60,.28);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.rd-card.fs{position:fixed;inset:24px;z-index:95;margin:0;overflow:auto;scrollbar-width:none;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(20,20,60,.22);max-height:none;grid-column:auto!important;grid-row:auto!important}
.rd-card.fs::-webkit-scrollbar{display:none}
.rd-card.fs .rd-list.scroll{max-height:none;overflow:visible}
.rd-card.fs .rd-tbox{max-height:none}
.rd-card.fs .ls-wrap{flex:1}
@media (max-width:600px){.rd-card.fs{inset:8px}}
/* выбранные значения фильтра блока */
.cf{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 2px}
.cf:empty{display:none}
.cf-c{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border:none;border-radius:99px;background:var(--bg);font:inherit;font-size:12.5px;color:var(--fg);cursor:pointer;max-width:100%;white-space:nowrap;overflow:hidden}
.cf-c .k{color:var(--muted)}
.cf-c .v{font-weight:600;overflow:hidden;text-overflow:ellipsis;min-width:0}
.cf-c.on{background:var(--accent-soft);color:var(--accent)}
.cf-c.on .k{color:var(--accent);opacity:.8}
.cf-c .x{opacity:.65;font-size:12px;margin-left:2px}
.cf-c .x:hover{opacity:1}
/* сводка вкладки */
.pg-sum{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.pg-sum:empty{display:none}
.ps-i{display:inline-flex;align-items:baseline;gap:6px;background:var(--card);border-radius:10px;padding:8px 12px;font-size:13px}
.ps-i .k{color:var(--muted)}
.ps-i b{font-weight:700;font-variant-numeric:tabular-nums}
.rd-grid.one{grid-template-columns:minmax(0,1fr)}
/* LFL: список магазинов по высоте графика */
@media (min-width:901px){.rd-grid.lf>#card-shops{display:flex;flex-direction:column}.rd-grid.lf>#card-shops .rd-list.scroll{flex:1 1 0;min-height:0;max-height:none}}
/* матрица */
.mx-wrap{grid-template-columns:minmax(0,3fr) minmax(0,7fr)}
.ls-g.acc{background:var(--warn-soft);color:var(--warn)}
.hm-lv.acc{background:var(--warn-soft);color:var(--warn)}
.hm-lv.weak{background:var(--split);color:var(--muted)}
.hm-levels.n4{grid-template-columns:repeat(2,1fr)}
#ch-lfl,#ch-lflshops{min-height:0}
@media (max-width:900px){.mx-wrap{grid-template-columns:minmax(0,1fr)}.mx-groups{grid-template-columns:repeat(2,minmax(0,1fr));display:grid;gap:8px}}
