/* 고등 7종의 밝기(다크/라이트)를 원시 토큰 한 곳에서 갈아끼우는 오버레이 */

/* ═══════════════════════════════════════════════════════════
   기본은 다크다 — 여기에 다크 규칙을 적지 않는다.

   페이지 :root 의 현행 값이 그대로 기본값이므로, 아무것도 안 하면
   화면은 지금과 100% 같다. **회귀가 구조적으로 0이다.**

   라이트일 때만 아래 18줄을 덮어쓴다. :root 41줄 중
   원시 색 8개 + 리터럴 6개 + 발광 2개 + 그림자 2개만 실제 값이고
   나머지 25개는 var() 별칭 체인이라 자동으로 따라온다.
   → 인라인 CSS 의 var() 참조 244곳과 starlight.css 의 137곳은 한 줄도 안 건드린다.

   `prefers-color-scheme` 은 **일부러 보지 않는다.**
   Windows 11 기본이 라이트라서 OS 설정을 따르면 대다수 학생이 예고 없이
   라이트로 뒤집힌다. 「기본 다크」 결정과 「회귀 0」 근거를 함께 지키려면
   라이트는 명시적 선택이어야 한다 (context-notes W-1 참조).

   고대비(`html[data-theme="high-contrast"]`)는 `*{...!important}` 라
   밝기와 무관하게 항상 이긴다 — 의도한 순서다.
   ═══════════════════════════════════════════════════════════ */

html[data-appearance="light"]{
  /* ── 표면 3단 ── */
  --night:  #FBFCFE;   /* 배경        (--bg0 --ivory 가 따라온다) */
  --dusk:   #FFFFFF;   /* 카드 표면    (--bg1 --panel --card --white) */
  --dusk-2: #F4F7FB;   /* 내부 박스    (--bg2) */

  /* ── 텍스트 2단 ── */
  --moon:   #111827;   /* 제목·본문  on #FBFCFE = 17.3:1 */
  --mist:   #646E7D;   /* 보조       on #FFFFFF = 5.2:1 · on #F4F7FB = 4.8:1 */

  /* ── 상태 3색. 색이 아니라 **역할**을 옮긴다 ──
     골드 #FFD27D 는 흰 배경에서 1.4:1, 민트 #5EEAD4 는 1.5:1 이라
     같은 색으로는 못 옮긴다. 같은 자리에 쓰이는 어두운 색으로 바꾼다. */
  --ember:  #1D4ED8;   /* 주요 CTA   흰 글자 얹어 6.7:1 */
  --aurora: #047857;   /* 완료·성공  on #FFFFFF = 5.5:1 */
  --star:   #B45309;   /* 진행·보상  on #FFFFFF = 5.0:1 */

  /* ── 경계선 ── */
  --panel-border:  #DDE4EE;
  --border-purple: #DDE4EE;

  /* ── 나머지 리터럴 ── */
  --core2:  #1E40AF;              /* CTA 그라디언트 끝 — --ember 한 단계 진하게 */
  --hp-red: #B91C1C;              /* 오답 */
  --locked: #7A8497;              /* 참조 0건인 데드 토큰이지만 값은 맞춰 둔다 (3.8:1) */
  --flt:    rgba(29,78,216,.07);  /* 옅은 강조 배경 — 민트 틴트 → 블루 틴트 */

  /* ── 그림자 · 발광 ──
     라이트에 발광은 없다. 흰 배경 위의 24px 번짐은 빛이 아니라 흐림으로 보인다. */
  --shadow:    0 1px 2px rgba(16,24,40,.04), 0 4px 12px -4px rgba(16,24,40,.08);
  --shadow-lg: 0 4px 8px -2px rgba(16,24,40,.06), 0 16px 32px -8px rgba(16,24,40,.12);
  --glow-star:   none;
  --glow-aurora: none;
}

/* body 의 라디얼 그라디언트 2겹은 민트·코랄 하드코딩이라 토큰으로 안 잡힌다.
   흰 배경 위에 남으면 얼룩으로 보인다. */
html[data-appearance="light"] body{ background-image:none; }

/* 별밭은 흰 점이다. #FBFCFE 위에서 안 보이는 DOM 130개를 그릴 이유가 없다. */
html[data-appearance="light"] #starfield,
html[data-appearance="light"] .leaf-bg{ display:none; }

/* ── 정답·오답 피드백 (W-5 에서 찾음) ─────────────────────────
   W-1 스캔이 「어두운 하드코딩」만 찾아서 이 둘을 놓쳤다. 반대 방향이다 —
   `.fb-ok{color:#CFFAF3}` · `.fb-err{color:#FFD8CA}` 는 **밝은 글자색**이라
   다크에서만 읽힌다. 라이트에서는 흰 배경 위 흰 글자로 **대비 1.1:1**,
   사실상 안 보인다.

   이 두 상자가 「맞았다/틀렸다」를 말하는 화면에서 가장 중요한 글자다. */
html[data-appearance="light"] .fb-ok{
  background:#E7F5F0; border-color:#047857; color:#0B3B2E;   /* 11.2:1 */
}
html[data-appearance="light"] .fb-err{
  background:#FDECEC; border-color:#B91C1C; color:#5A1212;   /* 12.0:1 */
}

/* ── starlight.css 의 하드코딩 (W-6) ──────────────────────────
   공유 스타일시트 558줄 중 토큰을 안 거치는 자리는 6곳이다.
   **초·중등은 이 파일을 안 쓴다** — 고등 8종 전용임을 확인했으므로
   여기서 덮어도 다른 학년에 영향이 없다. */

/* 지도 제목 — 흰색→라벤더 그라디언트를 글자에 클립한다.
   라이트에서는 흰 글자가 배경에 녹아 위쪽 절반이 사라진다. */
html[data-appearance="light"] .map-title h1{
  background:none; -webkit-text-fill-color:currentColor; color:var(--moon);
}

/* 지도 노드 — 텍스트가 아니라 도형 fill 이라 기준은 3:1 이다.
   #3a4685 는 흰 배경에서 과하게 진해 「잠긴 것」이 「강조된 것」처럼 보인다. */
html[data-appearance="light"] .cst-node .wm-core{ fill:#7A8497; }      /* 3.8:1 */
html[data-appearance="light"] .cst-node:hover .wm-core{ fill:#5C6779; }

/* 단계 확인 보기 — 남색 그라디언트 위에 밝은 글자 전제다 */
html[data-appearance="light"] .drill-opt{
  background:#FFFFFF; border-color:#DDE4EE;
}

/* `.story-tab.on` 은 그대로 둔다 — `var(--core)` 가 라이트에서 #1D4ED8 이라
   흰 글자가 6.7:1 로 통과한다. 하드코딩이지만 결과가 맞다. */
