/* 리디자인 v3 "산중 일지" 라이트. index.html·산 상세·상고대·세계의 명산이 media 없이(늘 렌더 차단) 부른다.
   화면 테마(더보기): 기기 설정이면 prefers-color-scheme, 고르면 html[data-theme]. 링크 media를 머리 스크립트가 바꾸면
   Chromium이 첫 화면을 안 기다려 반대 테마가 번쩍이므로 조건은 여기 선택자에 둔다. 두 블록 값은 같아야 한다(tests/theme-setting.test.mjs).
   지도(/map/)는 앱 WebView가 쓰므로 부르지 않는다(브라우저 지도는 map.css에서 따로). 색 값은 hex/rgb만. */
@media (prefers-color-scheme: light) {
	:root:where(:not([data-theme="dark"])) {
		color-scheme: light;

		--bg-canvas:    #f4f3ef;   /* 바탕(종이) */
		--bg-surface:   #fcfbf8;   /* 떠 있는 면 */
		--bg-raised:    #ecebe5;   /* 칩·입력 바탕 */
		--bg-hover:     #e6e4dd;
		--bg-sunken:    #e4e2da;
		--band:         #ecebe5;   /* 구역 사이 8px 띠 */

		--text-primary:    #1b1f1d;  /* 먹 */
		--text-secondary:  #4a504c;  /* 먹 2 */
		--text-tertiary:   #6a706b;  /* 먹 3 */
		--text-quaternary: #a3a7a2;

		--accent-brand:    #2f5a80;  /* 산청: 좋음·선택에만 */
		--accent-success:  #3f7a57;
		--accent-warning:  #7e4510;  /* 황토: 특보·강풍 */
		--accent-danger:   #a9473c;
		--accent-info:     #2f5a80;
		--accent-pink:     #a8455f;

		--accent-brand-bright:   #2f5a80;
		--accent-success-bright: #2f5a80;
		--accent-warning-bright: #7e4510;
		--accent-danger-bright:  #a9473c;
		--accent-critical-bright:#a9332a;
		--accent-info-bright:    #2f5a80;
		--accent-pink-bright:    #a8455f;
		--accent-event:          #9a5426;

		--score-good: #2f5a80;
		--score-mid:  #8a5a14;
		--score-bad:  #a9473c;

		--border-subtle:  #e6e4dd;
		--border-default: #dedcd5;
		--border-strong:  #b9b6ad;
		--field-border:   #d3d0c7;

		--fill-subtle:        rgba(27,31,29,0.05);
		--fill-medium:        rgba(27,31,29,0.08);
		--fill-sunken:        rgba(27,31,29,0.06);
		--fill-strong:        rgba(27,31,29,0.25);
		--ring:               rgba(27,31,29,0.12);
		--skeleton-shine:     rgba(255,255,255,0.7);
		--spinner-head:       rgba(27,31,29,0.55);
		--shadow-color:       rgba(27,31,29,0.10);
		--shadow-color-strong:rgba(27,31,29,0.16);
		--scrim:              rgba(27,31,29,0.38);
		--scrim-strong:       rgba(27,31,29,0.5);
		--media-well:         #2b302d;
		--map-land:           #e4e2da;
		--map-line:           #d3d0c7;
		--chart-line:         rgba(27,31,29,0.42);
		--chart-fill-top:     rgba(27,31,29,0.3);
		--chart-fill-bottom:  rgba(27,31,29,0.08);
		--status-warning-bg:  #f1e5d2;
		--foliage-text:       #9a5a4c;
		--text-on-media: #fff;
		--seg-on: #1b1f1d;
		--seg-shadow: none;
	}
}
:root:where([data-theme="light"]) {
	color-scheme: light;

	--bg-canvas:    #f4f3ef;   /* 바탕(종이) */
	--bg-surface:   #fcfbf8;   /* 떠 있는 면 */
	--bg-raised:    #ecebe5;   /* 칩·입력 바탕 */
	--bg-hover:     #e6e4dd;
	--bg-sunken:    #e4e2da;
	--band:         #ecebe5;   /* 구역 사이 8px 띠 */

	--text-primary:    #1b1f1d;  /* 먹 */
	--text-secondary:  #4a504c;  /* 먹 2 */
	--text-tertiary:   #6a706b;  /* 먹 3 */
	--text-quaternary: #a3a7a2;

	--accent-brand:    #2f5a80;  /* 산청: 좋음·선택에만 */
	--accent-success:  #3f7a57;
	--accent-warning:  #7e4510;  /* 황토: 특보·강풍 */
	--accent-danger:   #a9473c;
	--accent-info:     #2f5a80;
	--accent-pink:     #a8455f;

	--accent-brand-bright:   #2f5a80;
	--accent-success-bright: #2f5a80;
	--accent-warning-bright: #7e4510;
	--accent-danger-bright:  #a9473c;
	--accent-critical-bright:#a9332a;
	--accent-info-bright:    #2f5a80;
	--accent-pink-bright:    #a8455f;
	--accent-event:          #9a5426;

	--score-good: #2f5a80;
	--score-mid:  #8a5a14;
	--score-bad:  #a9473c;

	--border-subtle:  #e6e4dd;
	--border-default: #dedcd5;
	--border-strong:  #b9b6ad;
	--field-border:   #d3d0c7;

	--fill-subtle:        rgba(27,31,29,0.05);
	--fill-medium:        rgba(27,31,29,0.08);
	--fill-sunken:        rgba(27,31,29,0.06);
	--fill-strong:        rgba(27,31,29,0.25);
	--ring:               rgba(27,31,29,0.12);
	--skeleton-shine:     rgba(255,255,255,0.7);
	--spinner-head:       rgba(27,31,29,0.55);
	--shadow-color:       rgba(27,31,29,0.10);
	--shadow-color-strong:rgba(27,31,29,0.16);
	--scrim:              rgba(27,31,29,0.38);
	--scrim-strong:       rgba(27,31,29,0.5);
	--media-well:         #2b302d;
	--map-land:           #e4e2da;
	--map-line:           #d3d0c7;
	--chart-line:         rgba(27,31,29,0.42);
	--chart-fill-top:     rgba(27,31,29,0.3);
	--chart-fill-bottom:  rgba(27,31,29,0.08);
	--status-warning-bg:  #f1e5d2;
	--foliage-text:       #9a5a4c;
	--text-on-media: #fff;
	--seg-on: #1b1f1d;
	--seg-shadow: none;
}
