.growth-up{color:var(--green)}
.growth-down{color:var(--red)}

/* 차트 커서 툴팁 */
.chart-wrap canvas{cursor:crosshair;touch-action:pan-y}
.chart-cursor{position:absolute;top:18px;bottom:43px;width:1px;background:rgba(150,172,204,.45);pointer-events:none}
.chart-dot{position:absolute;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;border:2px solid #0a0e15;pointer-events:none}
.chart-tip{position:absolute;z-index:3;min-width:180px;max-width:300px;padding:8px 10px;background:rgba(8,12,19,.96);border:1px solid #2a3a52;border-radius:6px;box-shadow:0 8px 20px rgba(0,0,0,.45);color:#dbe4f0;font-size:11px;line-height:1.55;pointer-events:none}
.chart-tip .tt-time{margin-bottom:4px;color:#8fa0b8;font-size:10px}
.chart-tip .tt-row{display:flex;align-items:center;gap:6px}
.chart-tip .tt-row i{flex:none;width:8px;height:8px;border-radius:2px}
.chart-tip .tt-row span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chart-tip .tt-row b{color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
.chart-tip .tt-sub{margin:0 0 3px 14px;color:#7d8ca3;font-size:10px}
.dot.orange{background:#f08a4b}
.line.orange{background:#f08a4b}

/* 히트 랭킹 — 개요 하이라이트 카드와 순위 표 */
.hl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:0 0 16px}
.hl-card{background:var(--panel,#141821);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.hl-card span{font-size:11px;letter-spacing:.04em;color:#8b93a7;text-transform:uppercase}
.hl-card strong{font-size:15px;font-weight:600;line-height:1.3}
.hl-card small{font-size:12px;color:#9aa3b5}
.hl-card small.up{color:#4ec38a}
#hitTable td.rank{width:38px;color:#8b93a7;font-variant-numeric:tabular-nums}
#hitTable td.game b{display:block;font-weight:600}
#hitTable td.game small{display:block;font-size:11px;color:#8b93a7;margin-top:2px}
#hitTable td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
#hitTable td.num small{display:block;font-size:11px;color:#8b93a7}
#hitTable td.num.up{color:#4ec38a}
#hitTable td.num.down{color:#e2685f}
#hitTable tr{cursor:pointer}
#hitTable tr.active{background:rgba(76,145,255,.10)}
#hitDetail .detail-head{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
#hitDetail .kpi-grid{margin:14px 0}

/* 히트의 역사 — 비중 곡선 범례(선이 12개라 차트만으론 뭐가 뭔지 모름) */
.share-legend{display:flex;flex-wrap:wrap;gap:6px 14px;padding:10px 4px 2px}
.share-legend .lg{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#c3cad8;white-space:nowrap}
.share-legend .lg i{width:14px;height:3px;border-radius:2px;flex:0 0 auto}