실시간 차트 우측 상단 주가, 등락율 현재가로 반영

frontend/src/App.css

@@ -569,6 +569,12 @@ html.theme-blue {
 }
 
 .upbit-market  { font-weight: 700; color: var(--text); }
+.upbit-quote-group {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+}
 .upbit-price   { font-weight: 700; font-size: 13px; }
 .upbit-change.up   { color: var(--up); font-weight: 600; }
 .upbit-change.down { color: var(--down); font-weight: 600; }
@@ -844,14 +850,44 @@ html.theme-blue {
   position: absolute;
   top: 6px;
   left: 8px;
+  right: 8px;
   z-index: 10;
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 4px;
+  pointer-events: none;
+  font-size: 12px;
+}
+.tv-legend-top {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  width: 100%;
+  min-width: 0;
+}
+.tv-legend-meta {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 6px;
-  pointer-events: none;
-  font-size: 12px;
-  max-width: calc(100% - 80px);
+  min-width: 0;
+}
+.tv-legend-quote {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+  font-weight: 700;
+}
+.tv-legend-quote-price { font-size: 13px; }
+.tv-legend-quote-chg { font-size: 12px; font-weight: 600; }
+.tv-legend-bottom {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 6px;
+  max-width: calc(100% - 72px);
 }
 .tv-legend-sym {
   display: flex;