.rua-chart .rua-f2-root {
  position: relative;
  color: #151617;
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
.rua-chart .rua-f2-root svg { display: block; width: 100%; height: auto; overflow: visible; }
.rua-chart .rua-f2-root svg text { font-family: inherit; }
.rua-chart .rua-f2-measure { position: absolute; left: 0; top: 0; width: 0; height: 0; visibility: hidden; overflow: hidden; }


.rua-chart .rua-f2-ptitle { font-size: 15px; font-weight: 600; line-height: 1.35; margin: 0 0 10px; color: #151617; }
.rua-chart .rua-f2-letter { display: inline-block; min-width: 1.35em; color: #406D5C; font-weight: 600; }


.rua-chart .rua-f2-a { margin-bottom: 26px; }
.rua-chart .rua-f2-arow { display: block; }
.rua-chart .rua-f2-code {
  box-sizing: border-box;
  width: -webkit-fit-content;
  width: fit-content;
  max-width: 100%;
  background: #fff;
  border: 1px solid #E2E2DE;
  border-radius: 10px;
  padding: 10px 0;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  font-size: 12.5px;
  line-height: 1.55;
  color: #151617;
  overflow-x: auto;
}
.rua-chart .rua-f2-cl { position: relative; display: flex; padding: 2.5px 18px 2.5px 0; }
.rua-chart .rua-f2-gut { position: relative; z-index: 1; flex: 0 0 18px; text-align: center; font-weight: 700; }
.rua-chart .rua-f2-ct { position: relative; z-index: 1; white-space: pre; }
.rua-chart .rua-f2-cm { color: #6B6E71; }
.rua-chart .rua-f2-hl .rua-f2-gut { color: #A56D42; }
.rua-chart .rua-f2-hl::before {
  content: "";
  position: absolute;
  left: 8px; right: 8px; top: 0; bottom: 0;
  border-radius: 4px;
  background: #E9D3C2;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.7s cubic-bezier(0.22, 0.8, 0.3, 1) 0.15s;
}
.rua-chart .rua-f2-on .rua-f2-hl::before { transform: none; }


.rua-chart .rua-f2-legend { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: -2px 0 10px; font-size: 13px; color: #151617; }
.rua-chart .rua-f2-li { display: inline-flex; align-items: flex-start; gap: 7px; line-height: 1.35; }
.rua-chart .rua-f2-sq { flex: 0 0 auto; width: 11px; height: 11px; border-radius: 2px; margin-top: 0.25em; }
.rua-chart .rua-f2-row { display: block; }
.rua-chart .rua-f2-row > .rua-f2-plot + .rua-f2-plot { margin-top: 18px; }
.rua-chart .rua-f2-row.rua-f2-side { display: flex; align-items: flex-start; gap: 22px; }
.rua-chart .rua-f2-row.rua-f2-side > .rua-f2-plot { min-width: 0; }
.rua-chart .rua-f2-row.rua-f2-side > .rua-f2-plot + .rua-f2-plot { margin-top: 0; flex: 1 1 0; }
.rua-chart .rua-f2-hit { cursor: pointer; }

.rua-chart .rua-f2-dot {
  opacity: 0;
  transform: translate(var(--dx, -7px), var(--dy, 0px)) scale(0.3);
  transform-box: fill-box;
  transform-origin: center;
  transition: opacity 0.3s ease-out, transform 0.6s cubic-bezier(0.3, 1.45, 0.5, 1), stroke 0.15s;
}
.rua-chart .rua-f2-dot.rua-f2-on { opacity: 1; transform: none; }
.rua-chart .rua-f2-dot.rua-f2-hot { stroke: #151617; stroke-width: 1.6px; transform: scale(1.35); transition: transform 0.15s, stroke 0.15s; }


.rua-chart .rua-f2-fade { opacity: 0; transition: opacity 0.45s ease-out; }
.rua-chart .rua-f2-fade.rua-f2-on { opacity: 1; }


.rua-chart .rua-f2-tip {
  position: absolute;
  z-index: 20;
  left: 0; top: 0;
  max-width: 260px;
  padding: 8px 11px;
  background: #fff;
  border: 1px solid #E2E2DE;
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(21, 22, 23, 0.08);
  font-size: 12.5px;
  line-height: 1.45;
  color: #151617;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s ease-out, visibility 0s linear 0.15s;
}
.rua-chart .rua-f2-tip.rua-f2-show { opacity: 1; visibility: visible; transition: opacity 0.15s ease-out; }
.rua-chart .rua-f2-tip .rua-f2-tt { font-weight: 600; }
.rua-chart .rua-f2-tip .rua-f2-tm { color: #6B6E71; overflow-wrap: anywhere; }
.rua-chart .rua-f2-sw { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 6px; vertical-align: 0; }


.rua-chart .rua-f2-static *,
.rua-chart .rua-f2-static *::before { transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  .rua-chart .rua-f2-root *,
  .rua-chart .rua-f2-root *::before { transition: none !important; }
}