/* 다크 모드 — <html data-theme="dark"> 일 때 본문(.app-body)에 반전 필터를 적용한다.
   이 앱은 색을 인라인 스타일로 지정한 곳이 많아서(표·카드·경고 박스·Plotly 그래프 포함) 한 번에 일관되게 바꾸려고
   invert + hue-rotate 방식을 쓴다: 밝기만 뒤집고 색상(빨강=상승, 파랑=하락)은 유지된다. */
/* color-scheme 은 항상 light 로 둔다: dark 로 바꾸면 브라우저 기본 글자색(제목·라벨·입력값)이 먼저 흰색이 된 뒤
   아래 반전 필터가 한 번 더 뒤집어서 오히려 어두운 글자가 된다. */
html { color-scheme: light; }
html[data-theme="dark"] body { background: #1a1a1a; }
html[data-theme="dark"] .app-body {
  filter: invert(0.92) hue-rotate(180deg);
}

/* 전환 버튼 (상단 서비스 바 우측) — 바는 원래 어두운 색이라 필터 밖에 둔다 */
#theme-toggle {
  margin-left: auto;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  color: #d1d5db;
  background: #1f2937;
  border: 1px solid #374151;
  border-radius: 999px;
  padding: 4px 12px;
  cursor: pointer;
}
#theme-toggle:hover { color: #fff; border-color: #6b7280; }
#theme-toggle::after { content: "다크"; }
html[data-theme="dark"] #theme-toggle::after { content: "라이트"; }
