feat(symbol-page): aria-pressed PeriodTabs + sticky orderbook in 1D mode

PeriodTabs (reviewer 488fb32 concern):
- Drop role=tablist/tab/aria-selected. These imply a full ARIA tab
  pattern (tabpanel, aria-controls, roving tabIndex, internal Arrow
  focus traversal) which we don't implement — page-level left/right keys
  drive period change instead. Switch to plain button group with
  aria-pressed={active}, which accurately describes a segmented
  toggle. Comment updated to match.

OrderbookPanel sticky (new slice):
- Add optional sticky prop. When true, panel uses 'sticky top-4' with
  a slightly heavier bg-zinc-900/80 + backdrop-blur so it stays
  legible over the panels scrolling behind it.
- page.tsx passes sticky={isIntraday} — only 1D (10m bars) mode
  benefits, since orderbook timeliness drops on daily+ charts and the
  fixed slot would harm sidebar layout stability there.

web/components/PeriodTabs.tsx

@@ -43,10 +43,12 @@ export function PeriodTabs({ value, onChange }: Props) {
   //   페이지에서 "지금 어느 기간이 선택돼 있는지" 한눈에 안 들어왔음.
   //   한국 컬러 상승 톤(rose-500) 으로 칠해서 zinc 버튼군 사이에서 즉시 식별. 다른 모듈의 활성/positive
   //   상태(목표가 라인, 등락 양수 등) 도 같은 rose 계열이라 톤 일관성 유지.
-  // aria-pressed: 토글 그룹 의미 명시 — 스크린리더가 선택 상태 읽어줌.
+  // ARIA: 이건 tabpanel 을 가진 진짜 탭이 아니라 차트 기간 segmented control 임.
+  //   role=tablist/tab 을 붙이면 스크린리더가 aria-controls·roving tabIndex·Arrow focus 이동 같은
+  //   ARIA 탭 패턴을 기대하는데 여기엔 그 인프라가 없음 (←/→ 는 페이지 전역 단축키로 처리). 단순
+  //   버튼 그룹 + aria-pressed 가 정확한 표현.
   return (
     <div
-      role="tablist"
       aria-label="기간 선택"
       className="inline-flex rounded-full border border-zinc-800 bg-zinc-900 p-1 text-xs"
     >
@@ -56,8 +58,7 @@ export function PeriodTabs({ value, onChange }: Props) {
           <button
             key={p.id}
             type="button"
-            role="tab"
-            aria-selected={active}
+            aria-pressed={active}
             onClick={() => onChange(p.id, p.interval, p.days)}
             className={
               active