/* Режим рынка: the gauge, the canvas chart and year tiles; everything else is radar-ui.css. Tokens only. */
.mr-hero { align-items: center; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-4); padding: var(--sp-4) var(--sp-6); }
.mr-gauge { display: flex; justify-content: center; }
.mr-gauge svg { display: block; width: 100%; max-width: calc(var(--sp-6) * 10); height: auto; overflow: visible; }
.mr-gauge .g-track { fill: none; stroke: var(--panel-2); }
.mr-gauge .g-invest { fill: none; stroke: var(--accent); }
.mr-gauge .g-mixed { fill: none; stroke: var(--line-strong); }
.mr-gauge .g-spec { fill: none; stroke: var(--warn); }
.mr-gauge .g-red { fill: none; stroke: var(--short); }
.mr-gauge .g-tick { stroke: var(--muted); stroke-width: 1.5; }
.mr-gauge .g-tick.is-major { stroke: var(--text); stroke-width: 2.5; }
.mr-gauge .g-num { fill: var(--muted); font-size: var(--fs-s); text-anchor: middle; dominant-baseline: middle; }
.mr-gauge .g-needle { stroke: var(--text); stroke-width: 4; stroke-linecap: round; }
.mr-gauge .g-hub { fill: var(--text); }
.mr-gauge .g-hub-in { fill: var(--panel); }
.mr-gauge .g-value { fill: var(--text); font-size: var(--fs-2xl); font-weight: 700; text-anchor: middle; }
.mr-gauge .g-value.is-spec { fill: var(--warn); }
.mr-gauge .g-value.is-invest { fill: var(--accent); }

.mr-chart-panel { margin-bottom: var(--sp-4); }
.mr-canvas { display: block; width: 100%; height: calc(var(--sp-6) * 17); }
.mr-hover { margin: 0; padding: var(--sp-2) var(--sp-4); color: var(--muted); font-size: var(--fs-s); min-height: var(--control-height); }
.mr-hover b { color: var(--text); }
.mr-hover .is-spec { color: var(--warn); }
.mr-hover .is-invest { color: var(--accent); }
.mr-legend { display: flex; flex-wrap: wrap; gap: var(--sp-4); padding: var(--sp-2) var(--sp-4); color: var(--muted); font-size: var(--fs-xs); }
.mr-legend span::before { content: ""; display: inline-block; width: var(--sp-3); height: var(--sp-3); margin-right: var(--sp-1); vertical-align: -2px; border-radius: var(--r-s); }
.mr-legend .mr-l-invest::before { background: var(--accent-bg); border: 1px solid var(--accent); }
.mr-legend .mr-l-mixed::before { background: var(--panel-2); border: 1px solid var(--line-strong); }
.mr-legend .mr-l-idx::before { height: 0; border-top: 2px solid var(--muted); border-radius: 0; vertical-align: 3px; }
.mr-legend .mr-l-spec::before { background: var(--warn-bg); border: 1px solid var(--warn); }
.mr-legend .mr-l-median::before { height: 0; border-top: 3px solid var(--blue); border-radius: 0; vertical-align: 3px; }

.mr-years { display: grid; grid-template-columns: repeat(auto-fill, minmax(calc(var(--sp-6) * 3.4), 1fr)); gap: var(--sp-2); padding: 0 var(--sp-4) var(--sp-4); }
.mr-year { padding: var(--sp-2); border: 1px solid var(--line-soft); border-radius: var(--r-m); background: var(--panel-2); text-align: center; }
.mr-year span { display: block; color: var(--muted); font-size: var(--fs-xs); }
.mr-year strong { font-size: var(--fs-m); }
.mr-year.is-invest strong { color: var(--accent); }
.mr-year.is-spec strong { color: var(--warn); }

.mr-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); align-items: start; margin-bottom: var(--sp-4); }
.mr-col.is-spec .rd-panel-head h2 { color: var(--warn); }
.mr-col.is-invest .rd-panel-head h2 { color: var(--accent); }
.mr-list { margin: 0; padding: 0; list-style: none; }
.mr-item { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-2) var(--sp-4); border-top: 1px solid var(--line-soft); }
.mr-t { display: flex; flex-direction: column; min-width: 0; }
.mr-t small { overflow: hidden; color: var(--muted); font-size: var(--fs-xs); text-overflow: ellipsis; white-space: nowrap; }
.mr-s { font-weight: 700; font-variant-numeric: tabular-nums; }
.mr-col.is-spec .mr-s { color: var(--warn); }
.mr-col.is-invest .mr-s { color: var(--accent); }

@media (max-width: 800px) {
  .mr-cols { grid-template-columns: 1fr; }
  .mr-canvas { height: calc(var(--sp-6) * 13); }
  .mr-hero { grid-template-columns: 1fr; padding: var(--sp-4); }
  .mr-gauge svg { max-width: calc(var(--sp-6) * 11); }
}