ui(chart): harmonize StockChart container tone to detail-page body-card palette

상세 페이지 본문 카드 톤 통일 마무리. StockChart 컨테이너는 본문 영역의
top-level 카드 슬롯인데 마지막 남은 분기 톤이었음:

  before:  w-full rounded-lg border border-zinc-800 bg-zinc-900/30 p-2
  after:   w-full rounded-md border border-zinc-800 bg-zinc-900/40 p-2

- rounded-lg → rounded-md : 3b06b95 에서 PredictionPanel 도 같은 통일을 했고,
  같은 좌측 컬럼에서 차트 바로 아래에 PredictionPanel 이 붙어있어 corner radius
  분기는 시각적 톤 점프.
- bg-zinc-900/30 → bg-zinc-900/40 : /30 은 ReturnBucket 같은 nested sub-card
  보조 톤. top-level 본문 카드는 일관되게 /40 이어야 함.
- p-2 유지 : 차트 캔버스가 자체 inner padding 을 들이므로 p-4 는 빈 가장자리
  낭비. 이건 의도된 분기라 주석으로 근거 명시.
- fullscreen 모드는 viewport 전체 차지라 별개 — 손대지 않음.

전체화면 외 모든 종목 페이지에서 StockChart → PredictionPanel 톤 일치 확인.
tsc/next lint 통과.

web/components/CardHeader.tsx

@@ -1,13 +1,15 @@
 // 상세 페이지 본문 카드의 표준 헤더 — title 좌, 옵셔널 subtitle 우.
-// 작은 wrapper 지만 본문 카드 9개(Metrics / IntradayReturns / PeriodReturns /
-// CompositeScoreCard / PeerComparePanel / TradingValuePanel / InvestorCumulative /
-// DisclosuresPanel / NewsList) 가 같은 mb-3 flex items-baseline justify-between
-// 패턴을 character-by-character 로 중복 정의하고 있어, ReturnBucket 분리와 같은
-// 이유로 단일 source of truth 로 묶는다 — 한쪽만 마진/폰트 바꾸면 본문 카드들
-// 사이에 톤 점프가 생기는 future drift 리스크 제거.
+// 작은 wrapper 지만 본문 카드 8개(Metrics / IntradayReturns / PeriodReturns /
+// CompositeScoreCard / PeerComparePanel / TradingValuePanel / DisclosuresPanel /
+// NewsList) 가 같은 mb-3 flex items-baseline justify-between 패턴을
+// character-by-character 로 중복 정의하고 있어, ReturnBucket 분리와 같은 이유로
+// 단일 source of truth 로 묶는다 — 한쪽만 마진/폰트 바꾸면 본문 카드들 사이에
+// 톤 점프가 생기는 future drift 리스크 제거.
 //
-// PredictionPanel 은 우측이 '예측 실행' button 인 커스텀 레이아웃이라 이 wrapper
-// 대상이 아님. 해당 카드는 자체 헤더 유지.
+// 제외 카드 — 우측이 단순 subtitle 텍스트가 아닌 인터랙티브 컨트롤이라 이
+// wrapper 대상이 아님. 자체 헤더 유지:
+//   - PredictionPanel       : 우측이 '예측 실행' button.
+//   - InvestorCumulative    : 우측이 window 선택 button 그룹(aria-pressed).
 
 import type { ReactNode } from "react";
 

web/components/StockChart.tsx

@@ -918,10 +918,14 @@ export function StockChart({ chart, prediction, targets }: Props) {
   };
 
   // 전체화면(native or 폴백) 일 때는 viewport 를 꽉 채워서 차트 면적 최대화.
-  // 일반 모드는 기존 카드 스타일 유지.
+  // 일반 모드는 상세 페이지 본문 카드 표준 톤 (rounded-md / border-zinc-800 /
+  // bg-zinc-900/40) 채택 — 같은 좌측 컬럼 바로 아래의 PredictionPanel 과 톤 일치.
+  // padding 만 p-2 유지: 차트 캔버스가 자체 inner padding 을 들이므로 p-4 는 빈
+  // 가장자리 낭비. (참고: bg-zinc-900/30 은 ReturnBucket 같은 nested sub-card 용
+  // 보조 톤 — top-level 본문 카드는 /40 로 통일.)
   const wrapperCls = fullscreen
     ? "fixed inset-0 z-50 flex w-full flex-col overflow-auto bg-zinc-950 p-3"
-    : "w-full rounded-lg border border-zinc-800 bg-zinc-900/30 p-2";
+    : "w-full rounded-md border border-zinc-800 bg-zinc-900/40 p-2";
   // 차트 본체 높이 — 전체화면이면 가용 공간을 차지하도록 flex-1.
   const chartBoxCls = fullscreen
     ? "relative min-h-[300px] flex-1 w-full"