/* 디자인 토큰. SPEC 3장. 모든 화면은 이 값만 쓴다. */
:root {
  color-scheme: dark;
  --bg: #0e1015;
  --surface: #151820;
  --line: #262b35;
  --fg: #eceef2;
  --dim: #b4bcc7;
  --faint: #959eab;
  --accent: #7cc8f5;
  --on-accent: #08121a;
  --busy: #e9b872;
  --err: #f39a90;

  /* 작가 · 분야 색 팔레트 (site.json accents 순서). 화면은 데이터 색 대신 이 토큰을 써서 라이트에서 짝으로 바뀜 */
  --pal-1: #7cc8f5; --pal-2: #f0a3c0; --pal-3: #b4a2f0; --pal-4: #edc27d; --pal-5: #8fd9c0; --pal-6: #f2a58a;
  --art: #f0a3c0;
  --audio: #7cc8f5;
  --video: #edc27d;
  --virtual: #b4a2f0;

  /* VS Code 기본 에디터 폰트. 한글은 IBM Plex Sans KR로 이어짐 */
  --font: Menlo, Consolas, "Droid Sans Mono", "IBM Plex Mono", "IBM Plex Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", monospace;

  /* JIHO MIX 프로젝트(style.css)에서 가져온 값: 장식 전용 금색, 바탕 빛 두 개 */
  --brand-2: #F59E0B;
  --glow-1: rgba(14, 165, 233, 0.16);
  --glow-2: rgba(245, 158, 11, 0.11);
  --font-display: "Plus Jakarta Sans", "IBM Plex Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --font-script: "Instrument Serif", Georgia, "Times New Roman", serif; /* 메인 월페이퍼 워드마크만 (이탤릭으로 씀: 프로페셔널하되 딱딱하지 않게) */
  /* 큰 제목 그라데이션 (JIHO MIX와 같은 방향 · 비율) */
  --grad: linear-gradient(120deg, var(--accent) 15%, var(--brand-2) 100%);

  --shadow: none; /* 라이트에서만: 카드 빛번짐 */
  --cta-glow: none; /* 라이트에서만: 버튼 빛번짐 */
  /* 메인 월페이퍼 빛 (다크: 하늘 · 분홍 · 금 / 라이트: 그라데이션의 장미 · 자홍 · 보라) */
  --wall-1: #7cc8f5;
  --wall-2: #f0a3c0;
  --wall-3: #edc27d;
  --wall-ink: #FFFFFF; /* 월페이퍼 로고: 흰색 (지나가는 빛은 순백 띠) */
  --wall-ink-dim: rgba(255, 255, 255, 0.8);
  --radius: 10px;
  --radius-lg: 16px;
  --pill: 999px;
}

/* 라이트 모드 = 깔끔한 흰 바탕 · 검정과 그레이 + 큰 문구 그라데이션 하나 (SPEC 3장, Jiho 결정). 박스 · 띠 바탕색은 안 바꿈.
   기본은 다크(기기 설정과 상관없이). 위 메뉴 해/달 버튼으로 라이트를 고르면 그 선택을 기억 (data-theme) */
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --line: rgba(0, 0, 0, 0.10);
  --fg: #1D1D1F; /* 새까맣지 않은 검정 */
  --dim: #5F5F64; /* 그레이 */
  --faint: #737378;
  --accent: #1D1D1F; /* 누르는 것도 검정 (버튼은 검정 바탕 흰 글자) */
  --on-accent: #FFFFFF;
  --busy: #6E6E73;
  --err: #C2183D;
  /* 분야 · 작가 색은 빼고 검정 · 그레이 (색은 큰 문구 그라데이션 하나만) */
  --pal-1: var(--fg); --pal-2: var(--fg); --pal-3: var(--fg); --pal-4: var(--fg); --pal-5: var(--fg); --pal-6: var(--fg);
  --audio: var(--dim);
  --art: var(--dim);
  --virtual: var(--dim);
  --video: var(--dim);
  --brand-2: #C026D3;
  --grad: linear-gradient(110deg, #F43F5E 0%, #E11D74 30%, #C026D3 62%, #7C3AED 100%); /* 장미 → 핑크 → 자홍 → 보라, 중간이 탁해지지 않게 4단 */
  --wall-1: #F43F5E;
  --wall-2: #C026D3;
  --wall-3: #7C3AED;
  --wall-ink: #000000; /* 월페이퍼 로고: 검정 (지나가는 빛은 조금 더 짙은 띠) */
  --wall-ink-dim: rgba(0, 0, 0, 0.84);
  --glow-1: transparent;
  --glow-2: transparent;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  --cta-glow: none;
  --eyebrow-glow: none;
  --paper: #FFFFFF;
  --desk: #F5F5F7;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.7;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}