/* ══════════════════════════════════════════════════════════════════════════
   h5u-tokens.css — 병합 템플릿(h5u.css)이 참조하는 색 토큰 + 액센트 계열 스위치
   ══════════════════════════════════════════════════════════════════════════

   h5u.css 는 Spectral 원본이 하드코딩했던 hex 를 전부 변수로 바꾼 상태다
   (tools/build_h5u_css.py 의 PALETTE). 그 변수를 여기서 정의한다.

   값은 `H S% L%` 형태(공백 구분)로 둔다 — 쓰는 쪽이 `hsl(var(--x))` 로도,
   `hsl(var(--x) / 0.4)` 로도 쓸 수 있어야 한다.

   액센트 계열은 `html[data-accent="…"]` 로 통째로 갈아끼운다. 스위치는 나브바에
   있고 선택은 localStorage 에 남는다. 기본값은 원본 Spectral 에 가장 가까운
   vermilion.

     · --accent      버튼·링크·강조 (원본 #ed4933)
     · --band-1      wrapper.style1 배경 + 오프캔버스 #menu 배경 (원본 #21b2a6)
     · --band-3      wrapper.style3 배경 (원본 #505393)
     · --slate       body·header·wrapper.style2 배경 (원본 #2e3842) — 계열 불변
   ══════════════════════════════════════════════════════════════════════════ */

:root,
html[data-accent='vermilion'] {
	/* 원본 Spectral 팔레트를 HSL 로 옮긴 값 */
	--accent: 8 84% 57%;
	--accent-hi: 8 82% 62%;
	--accent-lo: 8 82% 51%;

	--band-1: 174 70% 41%;
	--band-1-hi: 173 51% 86%;
	--band-1-lo: 173 51% 76%;

	--band-3: 238 26% 45%;
	--band-3-hi: 236 27% 86%;
	--band-3-lo: 236 27% 78%;
}

html[data-accent='teal'] {
	--accent: 175 68% 40%;
	--accent-hi: 175 62% 46%;
	--accent-lo: 175 72% 34%;

	--band-1: 199 62% 44%;
	--band-1-hi: 195 55% 87%;
	--band-1-lo: 195 55% 77%;

	--band-3: 205 35% 34%;
	--band-3-hi: 205 30% 85%;
	--band-3-lo: 205 30% 76%;
}

html[data-accent='indigo'] {
	--accent: 250 62% 58%;
	--accent-hi: 250 60% 65%;
	--accent-lo: 250 62% 50%;

	--band-1: 280 42% 47%;
	--band-1-hi: 278 45% 88%;
	--band-1-lo: 278 45% 79%;

	--band-3: 222 38% 40%;
	--band-3-hi: 222 32% 86%;
	--band-3-lo: 222 32% 77%;
}

:root {
	/* 계열과 무관한 셸 색 — 어떤 액센트에서도 동일하게 유지한다. */
	--slate: 210 18% 22%;
}