/* Окно «Динамика показателя» по клику на плитку. Токены — insighter-theme.css. */
[data-md-metric],.md-tile,.rk-tiles .zc-tile.md-tile{cursor:pointer}
[data-md-metric]:focus-visible,.md-tile:focus-visible{outline:2px solid var(--zc-focus,#c4b2ff);outline-offset:2px}
.md-dialog{box-sizing:border-box;width:min(720px,90vw);max-height:min(720px,calc(100vh - 24px));margin:auto;padding:0;overflow:auto;border:1px solid var(--zc-line-strong);border-radius:16px;background:var(--zc-elev-2);color:var(--zc-ink);box-shadow:0 24px 80px #000a}
.md-dialog::backdrop{background:#05070bb8;backdrop-filter:blur(3px)}
.md-dialog [hidden]{display:none!important}
.md-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 16px 8px}
.md-title{margin:0;font-size:18px;line-height:1.25;font-weight:700}
.md-period{margin-top:3px;color:var(--zc-ink-muted);font-size:13px;line-height:1.3}
.md-side{display:flex;align-items:flex-start;gap:12px;flex:none}
.md-total{font-size:28px;line-height:1.1;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.md-total--neg{color:var(--zc-danger)}
.md-period-part{white-space:nowrap}
.md-close{display:grid;width:34px;height:34px;flex:none;place-items:center;border:1px solid var(--zc-line);border-radius:9px;background:var(--zc-surface-2);color:var(--zc-ink);font-size:22px;line-height:1;cursor:pointer}
.md-close:focus-visible{outline:2px solid var(--zc-focus,#c4b2ff);outline-offset:2px}
.md-body{padding:0 16px 16px}
.md-chart{position:relative;min-height:240px}
.md-svg{display:block;width:100%;height:240px;border:1px solid var(--zc-line-soft);border-radius:10px;background:var(--zc-surface-2);touch-action:pan-y}
.md-svg:focus-visible{outline:2px solid var(--zc-focus,#c4b2ff);outline-offset:2px}
.md-svg text{paint-order:stroke;stroke:var(--zc-surface-2);stroke-width:3px;stroke-linejoin:round;fill:var(--zc-ink-muted);font-family:inherit;font-variant-numeric:tabular-nums}
.md-svg .md-sel-label{fill:var(--zc-ink);font-weight:700}
.md-grid{stroke:var(--zc-line-soft);stroke-width:1}
.md-zero{stroke:var(--zc-ink-faint);stroke-width:1}
.md-area{fill:var(--zc-accent);opacity:.14}
.md-line{fill:none;stroke:var(--zc-accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.md-line--dash{stroke-dasharray:4 4}
.md-dot{fill:var(--zc-accent);stroke:var(--zc-surface-2);stroke-width:1.5}
.md-dot--partial{fill:var(--zc-surface-2);stroke:var(--zc-accent);stroke-width:2}
.md-dot--dim{opacity:.55}
.md-cursor{stroke:var(--zc-ink-faint);stroke-width:1;stroke-dasharray:3 3}
.md-tip{position:absolute;z-index:3;min-width:130px;max-width:220px;padding:7px 10px;border:1px solid var(--zc-line-strong);border-radius:10px;background:var(--zc-elev-3);box-shadow:0 8px 24px #0009;font-size:13px;line-height:1.35;pointer-events:none}
.md-tip-date{color:var(--zc-ink-muted)}
.md-tip-val{font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}
.md-tip-note{color:var(--zc-warning)}
.md-state{display:grid;height:240px;place-items:center;align-content:center;gap:10px;border:1px dashed var(--zc-line);border-radius:10px;color:var(--zc-ink-muted);font-size:14px;text-align:center}
.md-state--error{color:var(--zc-danger)}
.md-retry{min-height:34px;padding:6px 14px;border:1px solid var(--zc-line-strong);border-radius:9px;background:var(--zc-surface-2);color:var(--zc-ink);font:inherit;font-size:13px;cursor:pointer}
.md-retry:focus-visible{outline:2px solid var(--zc-focus,#c4b2ff);outline-offset:2px}
.md-skel{height:240px;border:1px solid var(--zc-line-soft);border-radius:10px;background:linear-gradient(100deg,var(--zc-surface-2) 30%,var(--zc-surface-3) 50%,var(--zc-surface-2) 70%) 0 0/200% 100%;animation:md-shimmer 1.2s linear infinite}
.md-skel-line{display:inline-block;height:14px;border-radius:6px;background:var(--zc-surface-3)}
[data-md-metric],.md-tile{transition:background-color .12s}
@media(hover:hover){[data-md-metric]:hover,.md-tile:hover,.rk-tiles .zc-tile.md-tile:hover{background-color:var(--zc-surface-3);border-radius:8px}}
[data-md-metric]:active,.md-tile:active,.rk-tiles .zc-tile.md-tile:active{background-color:var(--zc-surface-3)}
@keyframes md-shimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.md-skel{animation:none}[data-md-metric],.md-tile{transition:none}}
@media(max-width:600px){
 .md-dialog{width:calc(100vw - 12px);max-height:calc(100vh - 12px);border-radius:13px}
 .md-head{padding:12px 12px 8px}.md-body{padding:0 12px 12px}
 .md-total{font-size:20px}
 .md-close{width:44px;height:44px}
 .md-side{gap:8px}
 .md-tip{font-size:12px}
 .md-retry{min-height:44px;padding:6px 20px}
}
