/* ==========================================================================
   비디아 디자인 토큰 정본 (단일 출처).
   값의 의미와 규칙은 docs/ui/tokens.md, 값 목록은 docs/ui/audit-2026-10-06.md 참고.

   규칙
   - 새 토큰·값 변경은 이 파일에서만 한다.
   - 화면별 예외는 이름을 그대로 두고 **값만** 덮어쓴다. 그때 그 파일에
     `/* 밀도 정본 덮어씀 (tokens.css) *\/` 주석을 남긴다.
   - 로드 순서: tokens.css → vidia.css → market-refresh.css → console.css → vidia-player.css → ui-consistency.css.
     ui-consistency.css 의 `:root` 밀도 묶음(작은 제어 요소·여백)은 이 파일 뒤에 로드되어 의도적으로 이긴다.
   ========================================================================== */

:root {
	--accent: #1E4FD8;
	--accent-hover: #173FB0;
	--accent-soft: #E8EEFF;
	--accent-soft-2: #D6E0FF;
	--accent-ink: #12307F;
	--ink: #111827;
	--ink-2: #374151;
	--muted: #5B6472;
	--muted-2: #5C6573;
	/* 흰 패널·옅은 바탕·청회색 상태 바의 명도를 구분한다. */
	--line: #DCE2EA;
	--line-2: #BCC4D1;
	--canvas: #F4F6FA;
	--status-bg: #E2EAF5;
	--status-line: #CAD7E8;
	--console-bg: #E9EDF3; /* 제작 콘솔·관리자 화면 바탕(public/css/console.css). 어두운 테마는 예전 그대로 --surface-2 색 */
	--surface: #FFFFFF;
	--surface-2: #F1F4F8;
	--ok: #137A4A; --ok-soft: #E3F5EC;
	--warn: #9A5A05; --warn-soft: #FDF1DC;
	--danger: #B42318; --danger-soft: #FCE8E6;
	--info: #1E4FD8; --info-soft: #E8EEFF;
	/* 흰 글자를 올리는 채움색(버튼·뱃지·토스트). --accent·--ok 등은 어두운 테마에서 글자용 밝은 색이라 흰 글자 바탕으로 쓰면 대비가 3:1 아래로 떨어진다. 모든 조합 4.5:1 이상. */
	--accent-fill: #1E4FD8; --accent-fill-hover: #173FB0; --ok-fill: #137A4A; --danger-fill: #B42318; --warn-fill: #9A5A05; --on-fill: #FFFFFF;
	--r-1: 8px; --r-2: 12px; --r-3: 16px; --r-pill: 999px;
	--sh-1: 0 1px 2px rgba(17, 24, 39, .08), 0 1px 4px rgba(17, 24, 39, .06);
	--sh-2: 0 8px 24px rgba(17, 24, 39, .12), 0 2px 6px rgba(17, 24, 39, .07);
	--s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-7: 32px; --s-8: 40px; --s-9: 56px; --s-10: 72px;
	--font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, "Segoe UI", Roboto, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
	--mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
	--container: 1200px;
	--gutter: 24px;
	--header-h: 64px;
	--tap: 44px;
	--tr: .18s ease;
	color-scheme: light;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--accent: #6B8DFF; --accent-hover: #86A2FF; --accent-soft: #1B2A55; --accent-soft-2: #24397A; --accent-ink: #C8D6FF;
		--ink: #F3F4F6; --ink-2: #D1D5DB; --muted: #A1A8B5; --muted-2: #8E96A4;
		--line: #2A3140; --line-2: #3A4252; --canvas: #0F1319; --surface: #171C25; --surface-2: #1F2530; --console-bg: #1F2530;
		--status-bg: #25344C; --status-line: #374C69;
		--ok: #4ADE80; --ok-soft: #12301F; --warn: #FBBF24; --warn-soft: #3A2B0A; --danger: #F87171; --danger-soft: #3B1513; --info: #6B8DFF; --info-soft: #1B2A55;
		--accent-fill: #3558D4; --accent-fill-hover: #2A48B8; --ok-fill: #146C43; --danger-fill: #C62828; --warn-fill: #8A5104;
		--sh-1: 0 1px 2px rgba(0, 0, 0, .4); --sh-2: 0 10px 30px rgba(0, 0, 0, .5);
		color-scheme: dark;
	}
}
:root[data-theme="dark"] {
	--accent: #6B8DFF; --accent-hover: #86A2FF; --accent-soft: #1B2A55; --accent-soft-2: #24397A; --accent-ink: #C8D6FF;
	--ink: #F3F4F6; --ink-2: #D1D5DB; --muted: #A1A8B5; --muted-2: #8E96A4;
	--line: #2A3140; --line-2: #3A4252; --canvas: #0F1319; --surface: #171C25; --surface-2: #1F2530; --console-bg: #1F2530;
	--status-bg: #25344C; --status-line: #374C69;
	--ok: #4ADE80; --ok-soft: #12301F; --warn: #FBBF24; --warn-soft: #3A2B0A; --danger: #F87171; --danger-soft: #3B1513; --info: #6B8DFF; --info-soft: #1B2A55;
	--accent-fill: #3558D4; --accent-fill-hover: #2A48B8; --ok-fill: #146C43; --danger-fill: #C62828; --warn-fill: #8A5104;
	--sh-1: 0 1px 2px rgba(0, 0, 0, .4); --sh-2: 0 10px 30px rgba(0, 0, 0, .5);
	color-scheme: dark;
}

/* 반응형 토큰: 여백·헤더 높이만 줄인다. 순서(파일 로드 순)는 파일이 바뀌어도 유지된다. */
@media (max-width: 800px) {
	:root { --gutter: 16px; --header-h: 56px; }
}
@media (max-width: 390px) {
	:root { --gutter: 14px; }
}