/* ts-theme-sky.css — 색 테마(사람 지시 2026-09-28 "블루 계열로, 색감을 하늘 밝은, 아주 밝은").
   Keep 뷰어 CSS(keep-*.css)는 그대로 두고, 색만 여기서 덮는다. 모든 색은 :root 토큰 한 곳에서 바꾼다.
   레이아웃·크기·간격은 건드리지 않는다. 단어 대응 선택 표시(빨강)는 ts-overrides.css. */
:root {
  /* 바탕·면 */
  --ts-page: #f3f8fe;            /* 페이지 바탕 — 거의 흰 하늘빛 */
  --ts-page-glass: rgba(243, 248, 254, .92);
  --ts-panel: #f7fbff;           /* 책 목록 패널 */
  --ts-surface: #ffffff;         /* 카드·본문 */
  --ts-surface-glass: rgba(255, 255, 255, .86);
  --ts-glow-1: rgba(150, 196, 245, .34);
  --ts-glow-2: rgba(165, 212, 250, .30);
  /* 선 */
  --ts-line: #dbe7f5;
  --ts-line-soft: #e8f0fa;
  --ts-hover: #f0f6fd;
  /* 글자 */
  --ts-ink: #1b2a3d;
  --ts-ink-strong: #13243a;
  --ts-ink-2: #34506f;
  --ts-ink-3: #4d6582;
  --ts-sub: #6b8099;
  --ts-reading: #14233a;
  /* 강조 */
  --ts-accent: #2b86d6;
  --ts-accent-2: #4a9fe8;
  --ts-accent-soft: #e3f1fd;
  --ts-accent-ink: #1567b3;
  --ts-toggle-on: #1d4f86;
  --ts-badge-shadow: rgba(43, 134, 214, .18);
  --ts-warn-soft: #fff5de; --ts-warn-ink: #7a5200;
  /* 번역본 구분: 한국어 = 하늘, English = 연보라(periwinkle) */
  --ts-ko: #2b86d6; --ts-ko-soft: #e3f1fd; --ts-ko-ink: #125a9c;
  --ts-en: #7a7fdc; --ts-en-soft: #eeefff; --ts-en-ink: #3d4197;

  /* Keep 토큰 재배정 */
  --ink: var(--ts-ink); --ink-light: #4b6078; --sub: var(--ts-sub);
  --rule: var(--ts-line); --rule-light: var(--ts-line-soft);
  --paper: var(--ts-surface); --reading-ink: var(--ts-reading); --bg: var(--ts-page);
  /* 구약 = 하늘 */
  --ot-bg: #f7fbff; --ot-border: #d3e5f8; --ot-text: #24507e; --ot-hover-bg: #eaf4ff; --ot-hover-border: #9cc6ee;
  --ot-active-grad: linear-gradient(135deg, #2b86d6 0%, #4a9fe8 100%);
  --ot-badge-bg: #eaf4ff; --ot-badge-text: #1f5a94; --ot-badge-border: #cfe3f7;
  /* 신약 = 연보라 */
  --nt-bg: #f8f8ff; --nt-border: #e0def8; --nt-text: #3f3f95; --nt-hover-bg: #efeefe; --nt-hover-border: #b3b0ec;
  --nt-active-grad: linear-gradient(135deg, #5b61d6 0%, #7c82e8 100%);
  --nt-badge-bg: #efeefe; --nt-badge-text: #4a4aa8; --nt-badge-border: #dcdaf7;
  /* 장 = 청록빛 하늘 */
  --ch-bg: #ffffff; --ch-border: var(--ts-line); --ch-text: #2c4460;
  --ch-hover-bg: #eaf7fb; --ch-hover-border: #3aa6c9;
  --ch-active-grad: linear-gradient(135deg, #1c93b8 0%, #43b5d6 100%);
  --ch-active-shadow: rgba(28, 147, 184, .30);
  /* 절 줄 얼룩말(사람 지시 2026-09-28): 홀수 = 바탕, 짝수 = 연하늘 — 번호는 줄 색을 그대로 쓴다 */
  --verse-bg: transparent; --verse-alt-bg: #edf4fc; --verse-number-bg: transparent; --verse-number-ink: #1b4a7e;
  /* 해설 상자 = 차분한 중립 회색(하늘 띠와도 갈리게 얇은 테두리) */
  --ts-note-bg: #f6f7f9; --ts-note-ink: #4a5260; --ts-note-border: #e3e7ee; --ts-note-code-bg: #eaecf0; --ts-note-code-ink: #363c46;
}
body.dark-mode {
  --ts-page: #0c1829; --ts-page-glass: rgba(12, 24, 41, .92);
  --ts-panel: #0f1e33; --ts-surface: #12233b; --ts-surface-glass: rgba(18, 35, 59, .86);
  --ts-glow-1: rgba(60, 120, 200, .22); --ts-glow-2: rgba(70, 140, 210, .16);
  --ts-line: #243a57; --ts-line-soft: #1c3049; --ts-hover: #183050;
  --ts-ink: #e6eef8; --ts-ink-strong: #f2f7fd; --ts-ink-2: #c3d3e6; --ts-ink-3: #a9bdd4; --ts-sub: #8fa6c1; --ts-reading: #eef4fb;
  --ts-accent: #4f9fe8; --ts-accent-2: #7bbcf5; --ts-accent-soft: #16365a; --ts-accent-ink: #a6d3ff; --ts-toggle-on: #2c6fb3;
  --ts-badge-shadow: rgba(0, 0, 0, .35); --ts-warn-soft: #3a2f12; --ts-warn-ink: #ffd98a;
  --ts-ko: #5aa9f0; --ts-ko-soft: #15375c; --ts-ko-ink: #cfe6ff;
  --ts-en: #9ea3f0; --ts-en-soft: #23284f; --ts-en-ink: #dfe1ff;
  --ink: var(--ts-ink); --sub: var(--ts-sub); --rule: var(--ts-line); --paper: var(--ts-surface); --bg: var(--ts-page); --reading-ink: var(--ts-reading);
  --ot-bg: #13294a; --ot-text: #cfe4ff; --ot-border: #2d4d78; --ot-badge-bg: #16325a; --ot-badge-text: #cfe4ff; --ot-badge-border: #2d4d78;
  --nt-bg: #1c1f46; --nt-text: #dcdcff; --nt-border: #3b3f7c; --nt-badge-bg: #22265a; --nt-badge-text: #dcdcff; --nt-badge-border: #3b3f7c;
  --ch-bg: #172b45; --ch-text: #e6eef8; --ch-border: #2c4668; --ch-hover-bg: #1b3a56;
  --verse-bg: transparent; --verse-alt-bg: #192f4f; --verse-number-bg: transparent; --verse-number-ink: #e6eef8;
  --ts-note-bg: #1f242c; --ts-note-ink: #d8dde5; --ts-note-border: #353c47; --ts-note-code-bg: #2c323c; --ts-note-code-ink: #eef1f5;
  --six-control-bg: #172b45; --six-accent: var(--ts-accent-ink); --six-soft: var(--ts-accent-soft);
}
body { --six-accent: var(--ts-accent-ink); --six-soft: var(--ts-accent-soft); background: var(--ts-page); }

/* ── 바탕 (옅은 하늘빛 번짐이 보이도록 본문 스크롤 영역은 비침) ── */
.ts-site { background: var(--ts-page); }
@media (min-width: 768px) { .ts-content .main { background: transparent; } }
.sidebar, .sidebar-books-pane { background: var(--ts-panel); }
.sidebar-chapters-pane { background: var(--ts-surface); }
.sidebar-brand { background: linear-gradient(135deg, #3b8fdb 0%, #2468b4 100%); box-shadow: 0 3px 10px rgba(36, 104, 180, .22); }
.sidebar-brand .brand-desc { color: #d6e8fa; }
.section-badge.chap-badge { background: #eef6fc; color: #2c4a6b; border-color: var(--ts-line); }
.chap-info-card { background: linear-gradient(145deg, #f8fbff, #eef5fd); border-color: var(--ts-line); }
.chap-info-card .book-name { color: var(--ts-ink-strong); }
.chap-info-card .chap-total { color: var(--ts-sub); }
.ot-btn:hover { color: #173f69; }
.ot-btn.sel { border-color: #1f6fbf !important; box-shadow: 0 2px 6px rgba(43, 134, 214, .30); }
.nt-btn:hover { color: #2d2d7a; }
.nt-btn.sel { border-color: #4b50b8 !important; box-shadow: 0 2px 6px rgba(91, 97, 214, .30); }
.chap-grid button.sel { border-color: #1784a6 !important; }
.chap-grid button:hover { color: #14708d; }

/* ── Top 바 · 설정 ── */
.main-head { background: rgba(245, 249, 255, .97); }
@media (min-width: 768px) { .six-desktop-toolbar { background: var(--ts-page-glass); backdrop-filter: blur(12px); } }
.searchrow select, .searchrow input { background: var(--ts-surface); color: var(--ts-ink); border-color: var(--ts-line); }
.searchrow button { background: var(--ts-accent); border-color: var(--ts-accent); }
.btn-prev, .btn-next { border-color: var(--ts-line); color: var(--ts-ink-2); }
.btn-view-toggle { border-color: var(--ts-accent); color: var(--ts-accent); box-shadow: 0 2px 5px rgba(43, 134, 214, .12); }
.btn-view-toggle:hover { background: var(--ts-accent-soft); }
.btn-view-toggle.active { background: var(--ts-accent); color: #fff; }
.btn-theme { border-color: #1c93b8; color: #1784a6; }
.btn-theme:hover { background: #eaf7fb; }
.toggle-bar button { color: var(--ts-ink-3); border-color: var(--ts-line); }
.toggle-bar button.on { background: var(--ts-toggle-on); border-color: var(--ts-toggle-on); color: #fff; }
.highlight-control { border-color: var(--ts-line); color: var(--ts-ink-2); }
.highlight-control input { accent-color: var(--ts-accent); }
.six-tab[data-active="true"] { background: var(--ts-accent-soft); border-color: var(--ts-accent); }
.six-tab[data-active="true"] button { color: var(--ts-accent-ink); }
/* 번역본 칩(탭 모양): 한국어 = 하늘, English = 연보라, 준비 중 = 회청; 맨 앞(기준)은 왼쪽 띠 */
.ts-edition-tab[data-tone="ko"] { background: var(--ts-ko-soft); border-color: var(--ts-ko); }
.ts-edition-tab[data-tone="ko"] button { color: var(--ts-ko-ink); }
.ts-edition-tab[data-tone="en"] { background: var(--ts-en-soft); border-color: var(--ts-en); }
.ts-edition-tab[data-tone="en"] button { color: var(--ts-en-ink); }
.ts-edition-tab[data-tone="other"] { background: var(--ts-hover); }
.ts-edition-tab[data-primary="true"] { box-shadow: inset 3px 0 var(--ts-accent); font-weight: 700; }
.ts-edition-tab[data-primary="true"] > button:first-child { font-weight: 700; }
#sixChooseLanguage, #sixJumpGo { background: var(--ts-accent); }
.six-ui-option input, .six-edition-option input { accent-color: var(--ts-accent); }
.toast { background: #1d3a5c; }

/* ── 본문 ── */
.chapter-title { color: var(--ts-ink-strong); }
.note { background: var(--ts-note-bg); color: var(--ts-note-ink); } /* 해설: 중립 회색 */
.note code { background: var(--ts-note-code-bg); color: var(--ts-note-code-ink); }
.sheet .verse-body > .note { border: 1px solid var(--ts-note-border); }
.pilcrow { color: #9db3cc; }
.placeholder { color: var(--ts-sub); }
/* 활자 기호 9종 대조 색(Keep data-type-color 0~8) — 하늘·연보라·청록 계열 안에서 서로 구별 */
.sheet [data-type-color="0"] { --type-rgb: 125, 190, 245; }  /* 【】 여호와: 하늘 */
.sheet [data-type-color="1"] { --type-rgb: 150, 165, 245; }  /* 『』: 페리윙클 */
.sheet [data-type-color="2"] { --type-rgb: 190, 160, 240; }  /* {}: 라벤더 */
.sheet [data-type-color="3"] { --type-rgb: 110, 205, 225; }  /* ⟦⟧: 아쿠아 */
.sheet [data-type-color="4"] { --type-rgb: 110, 215, 190; }  /* ‹›: 민트 청록 */
.sheet [data-type-color="5"] { --type-rgb: 135, 185, 250; }  /* 「」: 콘플라워 */
.sheet [data-type-color="6"] { --type-rgb: 95, 200, 240; }   /* [ ]: 시안 */
.sheet [data-type-color="7"] { --type-rgb: 205, 170, 245; }  /* [[ ]]: 라일락 */
.sheet [data-type-color="8"] { --type-rgb: 165, 185, 210; }  /* 따옴표: 슬레이트 */
.sheet [data-type-color="9"] { --type-rgb: 120, 160, 230; }  /* ** **: 짙은 하늘 */
.sheet [data-type-color="10"] { --type-rgb: 150, 160, 180; }  /* _ _: 회청 */

/* ── 다크: Keep이 박아 둔 색을 깊은 남색 계열로 ── */
body.dark-mode .sidebar, body.dark-mode .sidebar-books-pane, body.dark-mode .sidebar-chapters-pane, body.dark-mode .main-head { background: var(--ts-panel); }
body.dark-mode .guide, body.dark-mode .chap-info-card, body.dark-mode .section-badge, body.dark-mode .note { background: #172b45; color: var(--ts-ink); border-color: var(--ts-line); }
body.dark-mode .note { background: var(--ts-note-bg); color: var(--ts-note-ink); border-color: var(--ts-note-border); }
body.dark-mode .note code { background: var(--ts-note-code-bg); color: var(--ts-note-code-ink); }
body.dark-mode .searchrow input, body.dark-mode .searchrow select, body.dark-mode .navrow button:not(.active), body.dark-mode .toggle-bar button:not(.on) { background: #172b45; color: var(--ts-ink); border-color: #2c4668; }
body.dark-mode .navrow button:not(.active):hover, body.dark-mode .toggle-bar button:not(.on):hover { background: #1f3a5c; }
body.dark-mode .highlight-control { background: #172b45; border-color: #2c4668; color: var(--ts-ink); }
body.dark-mode .highlight-control input { accent-color: var(--ts-accent-2); }
body.dark-mode .sidebar-brand { background: linear-gradient(135deg, #1f5796 0%, #173f70 100%); }
body.dark-mode .six-tab[data-active="true"] { background: var(--ts-accent-soft); border-color: var(--ts-accent-2); }
body.dark-mode .six-tab[data-active="true"] button { color: var(--ts-accent-ink); }
body.dark-mode .btn-theme { color: #8fdcf2; border-color: #3aa6c9; }

/* 모바일 좌우 대조의 영어 칸 윗 점선: Keep 이 박은 베이지(#e5e0d5, keep-3-responsive.css)를 하늘 선으로 (사람 지시 2026-09-28 "베이지가 별로야") */
body:not(.dark-mode) .sheet.view-split .col-en { border-top-color: var(--ts-line); }
/* 다크에서 켜진 표시 필터(대조 색·활자 기호·해설)가 위 .navrow 규칙에 덮여 꺼진 것처럼 보이던 것 바로잡음 */
body.dark-mode .toggle-bar button.on { background: var(--ts-toggle-on); border-color: var(--ts-toggle-on); color: #fff; }
