/* HoaiFx-provided live trading range; styles isolated to this section. */
#win-rate{font:400 15px/1.5 Inter,sans-serif;color:#f2f2f2;letter-spacing:normal;scroll-margin-top:105px}
#win-rate svg{display:block}
#win-rate p{margin-bottom:0}
#win-rate.performance-card{max-width:1120px;margin:0 auto;border:1px solid #242428;border-radius:22px;overflow:hidden;background:radial-gradient(ellipse at 22% 42%,#34d39904,transparent 65%),#101012;box-shadow:0 0 0 5px #ffffff02,0 28px 80px #0004}
#win-rate .performance-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:33px 38px 25px}
#win-rate .section-kicker{font-size:10px;letter-spacing:1.2px;color:#77777f}
#win-rate .performance-header h2{font-size:25px;line-height:1.2;letter-spacing:-.8px;font-weight:500;margin:10px 0 0}
#win-rate .performance-header h2>span{color:#8f8f94}
#win-rate .preview-badge{display:flex;align-items:center;gap:7px;border:1px solid #2a2a2f;border-radius:30px;padding:6px 10px;color:#8f8f94;font-size:10px;background:#141416}
#win-rate .preview-badge>span{width:5px;height:5px;border-radius:50%;background:#7c858f}
#win-rate .performance-body{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);align-items:center;padding:0 38px 31px;gap:47px}
#win-rate .performance-plot{min-width:0;margin:0;padding:14px 0 0}
#win-rate .chart-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 15px;font-size:10px;color:#8f8f94}
#win-rate .chart-meta>span:first-child{display:flex;align-items:center;gap:7px}
#win-rate .chart-meta i{display:block;width:13px;height:2px;background:#34d399;border-radius:2px}
#win-rate .chart-meta>span:last-child{color:#626268;font-size:8px;letter-spacing:1px}
#win-rate .chart-canvas{position:relative;padding-right:42px;margin-top:12px}
#win-rate .trend-chart{display:block;width:100%;height:auto;margin:0;overflow:visible}
#win-rate .chart-axis{position:absolute;top:0;bottom:0;right:0;width:32px;pointer-events:none}
#win-rate .chart-axis>span{position:absolute;left:0;transform:translateY(-50%);color:#8f8f94;font-size:11px;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
#win-rate .performance-plot figcaption{font-size:10px;color:#7f7f87;margin:9px 15px 0}
#win-rate .performance-metric{border-left:1px solid #ffffff08;padding:12px 0 12px 35px}
#win-rate .metric-label{font-size:11px;letter-spacing:1.1px;color:#8f8f94}
#win-rate .metric-value{display:flex;align-items:baseline;white-space:nowrap;font-size:64px;line-height:1.1;font-weight:500;letter-spacing:-3.8px;margin:18px 0 24px;font-variant-numeric:tabular-nums}
#win-rate .range-dash{font-weight:400;color:#7b7b83;margin:0 4px}
#win-rate .metric-value .percent{font-size:31px;letter-spacing:-1.5px;color:#8f8f94;margin-left:6px}
#win-rate .metric-divider{height:1px;width:31px;background:#2b5948;margin-bottom:18px}
#win-rate .metric-description{display:block;font-size:16px;line-height:1.5;letter-spacing:-.25px;color:#c4c4c9}
#win-rate .performance-metric>p{font-size:11px;line-height:1.7;color:#8f8f94;margin-top:16px;max-width:245px}
#win-rate .performance-footer{border-top:1px solid #202024;display:flex;align-items:center;gap:8px;min-height:48px;padding:12px 38px;color:#74747d;font-size:10px}
#win-rate .footer-dot{width:4px;height:4px;border-radius:50%;background:#8f8f94}
#win-rate .footer-separator{width:1px;height:9px;background:#34343a;margin:0 5px}
#win-rate .trend-line,#win-rate .trend-soft{stroke-dasharray:1;stroke-dashoffset:0}
#win-rate .trend-area,#win-rate .trend-endpoint{opacity:1}
#win-rate.performance-card.has-motion:not(.is-visible) .trend-line,#win-rate.performance-card.has-motion:not(.is-visible) .trend-soft{stroke-dashoffset:1}
#win-rate.performance-card.has-motion:not(.is-visible) .trend-area,#win-rate.performance-card.has-motion:not(.is-visible) .trend-endpoint{opacity:0}
#win-rate.performance-card.has-motion.is-visible .trend-line,#win-rate.performance-card.has-motion.is-visible .trend-soft{transition:stroke-dashoffset 2.8s cubic-bezier(.3,.55,.35,1)}
#win-rate.performance-card.has-motion.is-visible .trend-area{transition:opacity 1.6s ease .65s}
#win-rate.performance-card.has-motion.is-visible .trend-endpoint{transition:opacity .7s ease 2.4s}
#win-rate.performance-card.has-motion.is-visible .endpoint-ring{transform-box:fill-box;transform-origin:center;animation:win-rate-endpoint-breathe 3.8s ease-in-out 3s infinite}
@keyframes win-rate-endpoint-breathe{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}
@media(max-width:1199px){#win-rate.performance-card{margin-left:28px;margin-right:28px}
#win-rate .performance-body{gap:25px;padding-left:28px;padding-right:28px;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
#win-rate .performance-header{padding-left:28px;padding-right:28px}
#win-rate .performance-metric{padding-left:25px}
#win-rate .metric-value{font-size:55px;letter-spacing:-3px}}
@media(max-width:767.98px){#win-rate.performance-card{margin-left:22px;margin-right:22px;border-radius:18px}
#win-rate .performance-header{padding:25px 23px 16px;align-items:flex-start}
#win-rate .performance-header h2{font-size:22px;letter-spacing:-.6px}
#win-rate .section-kicker{font-size:8px;letter-spacing:.9px}
#win-rate .preview-badge{font-size:8px;padding:4px 7px;gap:5px;margin-top:3px;white-space:nowrap}
#win-rate .performance-body{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0 23px 27px}
#win-rate .performance-plot{padding-top:12px}
#win-rate .chart-meta{font-size:8px;padding:0 4px;gap:9px}
#win-rate .chart-meta>span:last-child{font-size:7px}
#win-rate .chart-canvas{margin-top:14px;padding-right:36px}
#win-rate .chart-axis{width:29px}
#win-rate .chart-axis>span{font-size:10px}
#win-rate .performance-plot figcaption{font-size:9px;margin:10px 4px 0;line-height:1.6}
#win-rate .performance-metric{border-left:0;border-top:1px solid #202024;margin-top:25px;padding:23px 0 0}
#win-rate .metric-value{font-size:62px;margin:13px 0 20px;letter-spacing:-3px}
#win-rate .metric-value .percent{font-size:28px}
#win-rate .metric-label{font-size:10px}
#win-rate .metric-description{font-size:15px}
#win-rate .metric-description br{display:none}
#win-rate .performance-metric>p{font-size:10px;max-width:none;margin-top:12px}
#win-rate .performance-footer{padding:12px 23px;font-size:8px;gap:6px}
#win-rate .footer-separator{margin:0 3px}}
@media(max-width:380px){#win-rate .performance-header{display:block}
#win-rate .preview-badge{width:max-content;margin-top:13px}
#win-rate .metric-value{font-size:55px}
#win-rate .chart-meta>span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){#win-rate.performance-card .trend-line,#win-rate.performance-card .trend-soft{stroke-dashoffset:0!important;transition:none!important}
#win-rate.performance-card .trend-area,#win-rate.performance-card .trend-endpoint{opacity:1!important;transition:none!important}
#win-rate.performance-card .endpoint-ring{animation:none!important;transform:none!important}}
/* Position immediately below the five-market strip. */
#win-rate.performance-card{margin-top:35px}
@media(max-width:767.98px){#win-rate.performance-card{margin-top:22px}}

/* Keep the approved final-number widths while counting. */
#win-rate .metric-number{display:inline-grid}
#win-rate .metric-number::before{content:attr(data-count-to);visibility:hidden;grid-area:1/1}
#win-rate .metric-number>[data-count-value]{grid-area:1/1;text-align:right}
