/* ── 밝은 테마 ───────────────────────────────────────────
   프로젝터는 검정을 만들지 못한다. 방의 빛이 화면에 반사되어 제일 어두운
   색에 바닥이 깔린다. 어두운 테마는 정보를 전부 그 어두운 쪽에 쌓아 두어서,
   낮에 띄우면 설명 글자(--text2)가 7.4:1 → 2.2:1 로 뭉개진다.
   밝은 테마에서는 같은 조건에서 3.6:1 이 남는다.

   어두운 색은 각 페이지의 :root 에 그대로 있다. 여기서는 밝을 때만 덮는다.
   html[data-theme] 가 :root 보다 구체적이라, 불러오는 순서와 상관없이 이긴다.
   켜고 끄는 일은 /theme.js 가 한다.

   ⚠️ 색을 바꾸면 tools/ 의 명암비 계산으로 다시 확인할 것.
      테두리는 모니터에서 은은해 보여도 프로젝터에선 제일 먼저 사라진다. */
html[data-theme="light"] {
  color-scheme: light;
  --bg: #eef0f5; --surface: #ffffff; --surface2: #e6e9f0;
  --border: #bcc3d3; --border2: #939db4;
  --text: #111827; --text2: #334155; --text3: #475569; --text4: #5b6577;
  --accent: #3446d4; --accent2: #2a3ab8;
  --green: #166534; --cyan: #0e6377; --amber: #92400e; --red: #991b1b; --danger: #991b1b;
  /* 어두운 테마에서 #1e2135, #0a0c14 로 박혀 있던 자리 */
  --chip: #e3e7fb; --code-bg: #eef0f6; --code-fg: #3730a3;
  --head: #0b1220;   /* 제목. 어두울 때는 #f1f5f9 / #f8fafc 로 박혀 있던 자리 */
}
html[data-theme="dark"] { color-scheme: dark; }

/* 그림 크게 보기는 밝을 때도 어둡게 둔다 — 화면 캡처는 어두운 바탕에서 봐야
   제대로 보인다. 그 안의 단추 글자까지 밝은 테마 색을 받지 않게 되돌린다. */
html[data-theme="light"] .lb {
  --text: #e2e8f0; --text2: #94a3b8; --text3: #64748b;
  --border2: #3d4463; --surface: #1a1d27;
}

/* 밝게/어둡게 단추 — 메뉴 맨 끝에 theme.js 가 붙인다 */
.theme-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; padding: 0; flex-shrink: 0;
  border: 1px solid var(--border2); border-radius: 8px; background: transparent;
  color: var(--text3); font-size: 15px; line-height: 1; cursor: pointer;
  transition: color .15s, border-color .15s;
}
.theme-btn:hover { color: var(--accent); border-color: var(--accent); }
/* 메뉴가 없는 페이지(로그인)에서는 오른쪽 위에 띄운다 */
.theme-btn.float { position: fixed; top: 16px; right: 16px; z-index: 50; }

/* 폰에서는 메뉴 다섯 개가 이미 폭을 다 쓴다. 메뉴에 끼우면 오른쪽 끝이 잘린다.
   맨 위로 단추(오른쪽 아래, top.js)와 짝을 이루게 왼쪽 아래에 띄운다. */
@media (max-width: 600px) {
  .theme-btn, .theme-btn.float {
    position: fixed; top: auto; right: auto; left: 14px; bottom: 14px; z-index: 200;
    width: 42px; height: 42px; border-radius: 50%; font-size: 17px;
    background: var(--surface); box-shadow: 0 6px 20px rgba(0,0,0,.25);
  }
}

/* 로고: IC∞ 뒤의 APA 는 작게 위로 올린 ΛPΛ 로 쓴다(2026-09-25).
   "…아파" 로 이어 읽히지 않게 — 8 을 ∞ 로 눕힌 것과 같은 요령으로 A 도 기호(Λ)로 바꿨다.
   주소 · 메일(ic8apa)은 그대로다. */
.brand-apa { font-size: .62em; letter-spacing: .1em; color: var(--accent); vertical-align: .7em; margin-left: .02em; }