/* 디자인 토큰: 색 · 글꼴. 디자인 템플릿을 바꿀 때 가장 먼저 여기를 바꾼다 */
:root {
  --bg: #F4F4F2;
  --paper: #FFFFFF;
  --fg: #111111;
  --mid: #6B6B6B;
  --faint: #CFCFCB;
  --hover: #E8E8E5;
  /* 테두리: 굵기 · 색 · 강조(선택 · 마우스) */
  --bw: 2px;
  --line: var(--fg);
  --line-hi: var(--fg);
  /* 조직 색: 들어간 조직의 색 (없으면 흑백). JS가 --org-l/--org-d 를 넣는다 */
  --org: var(--org-l, var(--fg));
  --on-org: var(--on-org-l, var(--bg));
  --pixel: "SOLOM DOS", ui-monospace, monospace;   /* 영문 라벨 · 숫자도 도스이야기 (가독성) */
  --logo: "Silkscreen", "SOLOM DOS", ui-monospace, monospace;   /* SOLOM 로고만 픽셀체 */
  --body: "SOLOM DOS", "Apple SD Gothic Neo", "Malgun Gothic", ui-monospace, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --bg: #0E0E0E; --paper: #161616; --fg: #EDEDED; --mid: #8F8F8F; --faint: #383838; --hover: #222222; --org: var(--org-d, var(--fg)); --on-org: var(--on-org-d, var(--bg)); color-scheme: dark; }
}
:root[data-theme="dark"] { --bg: #0E0E0E; --paper: #161616; --fg: #EDEDED; --mid: #8F8F8F; --faint: #383838; --hover: #222222; --org: var(--org-d, var(--fg)); --on-org: var(--on-org-d, var(--bg)); color-scheme: dark; }