/* Утверждённая карточка динамики: постоянная высота данных при обновлении. */
.ovf { min-width: 0; border: 1px solid #353b47; background: #171d28; border-radius: 14px; color: #e3e7ee; overflow: hidden; }
.ovf [hidden] { display: none !important; }
.ovf button, .ovf select { font: inherit; color: inherit; }
.ovf button { cursor: pointer; }
.ovf button:focus-visible, .ovf a:focus-visible, .ovf select:focus-visible, .ovf canvas:focus-visible, .ovf summary:focus-visible { outline: 2px solid #efbd39; outline-offset: 3px; }
.ovf-head { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 23px 23px 20px; }
.ovf-head h2 { margin: 0 0 6px; font-size: 19px; font-weight: 600; }
.ovf-head p { margin: 0; font-size: 11px; color: #8b94a3; }
.ovf-periods { display: flex; gap: 3px; padding: 3px; border: 1px solid #303642; border-radius: 8px; background: #10151e; }
.ovf-periods button { border: 1px solid transparent; background: transparent; color: #8b94a3; padding: 8px 11px; border-radius: 5px; font-size: 12px; white-space: nowrap; }
.ovf-periods button[aria-pressed=true] { color: #efbd39; border-color: #806724; background: #362f1d; }
.ovf-tools { padding: 0 23px; display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 43px; }
.ovf-modes { display: flex; gap: 20px; align-self: stretch; }
.ovf-modes button { border: 0; border-bottom: 2px solid transparent; background: none; padding: 10px 0 12px; color: #8b94a3; font-size: 12px; white-space: nowrap; }
.ovf-modes button[aria-pressed=true] { border-color: #efbd39; color: #e3e7ee; }
.ovf-target { border: 1px solid #303642; background: #111721; padding: 6px 9px; border-radius: 6px; font-size: 11px !important; }
.ovf-body { position: relative; }
.ovf-pending .ovf-content { filter: blur(3px); opacity: .4; pointer-events: none; user-select: none; }
.ovf-feedback { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 20px; text-align: center; font-size: 13px; }
.ovf-feedback button { border: 1px solid #806724; border-radius: 5px; background: #362f1d; padding: 7px 12px; color: #efbd39; }
.ovf-summary { display: flex; align-items: center; gap: 20px 30px; padding: 23px 23px 12px; min-height: 92px; font-size: 12px; color: #8b94a3; }
.ovf-metric strong { display: block; font-size: 28px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -.5px; }
.ovf-metric span { display: block; margin-top: 4px; font-size: 12px; color: #8b94a3; }
.ovf-green { color: #74c98e; }.ovf-red { color: #ed7b80; }.ovf-gold { color: #efbd39; }
.ovf-summary small { margin-left: auto; font-size: 11px; }
.ovf-plot { position: relative; height: 290px; margin: 5px 18px 0; }
.ovf-canvas { max-width: 100%; }
.ovf-chart-note { position: absolute; inset: 0; display: grid; place-items: center; color: #8b94a3; font-size: 12px; }
.ovf-foot { min-height: 80px; padding: 14px 23px; display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 11px; line-height: 1.6; color: #8b94a3; }
.ovf-foot a { color: #efbd39; text-decoration: none; white-space: nowrap; }
.ovf-point { height: 48px; overflow: auto; margin: 0 23px 10px; font-size: 11px; color: #adb5c3; line-height: 1.5; }
.ovf-details { padding: 0 23px 20px; color: #8b94a3; font-size: 11px; line-height: 1.6; }
.ovf-details summary { cursor: pointer; max-width: max-content; }
.ovf-details p { max-width: 90ch; margin: 9px 0 0; }
@media (max-width: 1170px) {
    .ovf-head { align-items: flex-start; flex-direction: column; gap: 18px; }
    .ovf-summary small { margin-left: 0; }
}
@media (max-width: 600px) {
    .ovf-head { padding: 19px 15px 13px; gap: 18px; }
    .ovf-head h2 { font-size: 17px; }.ovf-head p { font-size: 10px; }
    .ovf-periods { width: 100%; box-sizing: border-box; }
    .ovf-periods button { flex: 1; padding: 8px 5px; font-size: 11px; }
    .ovf-tools { padding: 0 15px; flex-wrap: wrap; gap: 8px; }
    .ovf-modes { width: 100%; gap: 14px; justify-content: space-between; }
    .ovf-modes button { font-size: 11px; }.ovf-target { margin-top: 5px; }
    .ovf-summary { padding: 18px 15px 10px; flex-wrap: wrap; gap: 13px 20px; min-height: 110px; box-sizing: border-box; }
    .ovf-metric strong { font-size: 23px; }.ovf-metric span { font-size: 11px; }
    .ovf-summary small { width: 100%; font-size: 10px; }
    .ovf-plot { height: 255px; margin: 5px 9px 0; }
    .ovf-foot { min-height: 90px; padding: 13px 15px; align-items: flex-start; font-size: 10px; }
    .ovf-point { margin: 0 15px 10px; height: 65px; font-size: 10px; }
    .ovf-details { padding: 0 15px 15px; font-size: 10px; }
}
