/* GitBook 호환 테마 — 공통 레이아웃(docpod.css)의 토큰만 원본(docs.wrks.ai 2026-11 기준 실측)으로 덮는다.
   구조·반응형·드로어·하위 페이지는 모든 테마 공통 코드. 여기엔 시각 값과 GitBook 만의 반응형 알고리즘(헤더 링크 접힘)만 둔다. */
body.th-gitbook {
  --font: Inter, "Inter Fallback", system-ui, arial;
  --gb-word-break: normal; --gb-overflow-wrap: anywhere;
  /* 컨테이너 */
  --gb-container-max: 1440px;
  --gb-side-w: 288px; --gb-side-gap: 48px;
  --gb-toc-w: 256px; --gb-toc-pl: 32px; --gb-toc-gap: 16px; --gb-toc-pt: 32px;
  --gb-main-max: 768px; --gb-main-pt: 32px;
  /* 헤더 */
  --tabs-h: 45px;
  --gb-header-bg: rgba(255, 255, 255, .88); --gb-header-blur: 16px;
  --gb-header-bw: 0px; --gb-header-shadow: 0 1px 0 rgba(28, 29, 31, .07);
  --gb-logo-radius: 0px; --gb-logo-fs: 18px; --gb-logo-fw: 600; --gb-logo-ls: -0.45px; --gb-logo-lh: 22.5px; --gb-logo-fs-sm: 16px; --gb-logo-lh-sm: 20px; --gb-logo-ls-sm: -0.4px;
  --gb-search-flex: 0 0 auto;
  --gb-search-btn-max: none;
  --gb-search-h: 39px; --gb-search-pad: 0 12px; --gb-search-gap: 8px; --gb-search-radius: 12px;
  --gb-search-line: #D5D9E0; --gb-search-icon-size: 38px; --gb-search-icon-radius: 12px; --gb-search-icon-line: #D5D9E0; --gb-search-fs: 14px; --gb-search-color: #6A6E77;
  --gb-more-gap: 4px; --gb-tabsrow-bt: 0px; --gb-link-lh: 20px; --gb-btn-icon: 14px;
  --gb-toc-h: calc(100vh - var(--header-h) - var(--tabs-h));
  --gb-link-fs: 14px; --gb-link-fw: 400; --gb-link-color: #6A6E77;
  /* 탭 */
  --gb-tab-fs: 14px; --gb-tab-fw: 400; --gb-tab-lh: 21px; --gb-tab-pad: 6px 12px; --gb-tab-my: 6px; --gb-tab-radius: 12px;
  --gb-tabs-pr: calc(var(--gb-px) - 12px); --gb-tab-first-ml: -12px; --gb-tab-ind-x: 12px; --gb-tab-ind-b: -6px;
  /* 사이드바 */
  --gb-side-pr: 0px; --gb-side-ml: -12px; --gb-side-list-w: 281px;
  --gb-side-fs: 14px; --gb-side-lh: 20px;
  --gb-side-pad: 6px 6px 6px 12px; --gb-side-radius: 6px;
  --gb-side-color: rgba(28, 29, 31, .64);
  --gb-side-hover-bg: #F0F2F6; --gb-side-hover-color: #1C1D1F;
  --gb-side-active-bg: transparent; --gb-side-active-fw: 600;
  --gb-side-item-gap: 2px; --gb-list-mb: 0px;
  --gb-group-fs: 12px; --gb-group-ls: .3px; --gb-group-lh: 16px; --gb-group-pad: 6px 6px 6px 12px;
  --gb-group-mt: 16px; --gb-group-mb: 1px; --gb-group-chev: flex; --gb-group-minh: 32px;
  --gb-sub-ml: 20px; --gb-sub-my: 8px; --gb-sub-pl: 20px; --gb-sub-line: #E2E6EC; --gb-sub-radius: 0 6px 6px 0; --gb-sub-active-bar: 1px;
  /* 본문 머리 */
  --gb-crumb-fs: 12px; --gb-crumb-fw: 400; --gb-crumb-lh: 19.5px; --gb-crumb-sep: 8px; --gb-crumb-sep-color: #AEB4BD;
  --gb-topline-mb: 12px; --gb-topline-display: flow-root; --gb-topline-align: flex-start; --gb-actions-float: right; --gb-actions-ml: 16px; --gb-actions-my: -6px -4px; --gb-head-mb: 24px;
  --gb-title-fs: 36px; --gb-title-lh: 45px; --gb-title-ls: -0.9px; --gb-title-mb: 0px;
  --gb-btn-fs: 14px; --gb-btn-h: 27.5px; --gb-btn-pad: 0 8px; --gb-btn-gap: 8px; --gb-btn-line: #D5D9E0; --gb-tocbtn-bg: #F6F7FA; --gb-tocbtn-hover: #EEF0F4; --gb-burger-color: #1C1D1F; --gb-more-chev: #C3C5C8; --gb-btn-color: #6A6E77; --gb-btn-fw: 400;
  --gb-copymd-display: none; --gb-copymore-display: inline-flex; --gb-lastupdated-display: block;
  /* 목차 */
  --gb-toc-fs: 14px; --gb-toc-lh: 20px; --gb-toc-head-fs: 12px; --gb-toc-head-ls: .05em; --gb-toc-head-ml: 12px; --gb-toc-head-gap: 4px;
  --gb-toc-line: 0 solid transparent; --gb-toc-pad: 4px 12px; --gb-toc-radius: 6px;
  --gb-toc-li-mt: 8px; --gb-toc-li-mb: 2px; --gb-toc-a-bl: 0px; --gb-toc-bar-color: transparent;
  --gb-toc-color: #6A6E77;
  /* 이전/다음 */
  --gb-card-radius: 12px; --gb-card-pad: 16px; --gb-card-line: #E2E6EC; --gb-card-gap: 0px;
  --gb-card-label-fs: 12px; --gb-card-title-fs: 16px; --gb-card-title-fw: 400; --gb-card-mt: 24px; --gb-card-gap-x: 12px; --gb-card-ico: flex;
  --gb-sheet-line: #E2E6EC;
}
@media (max-width: 1023.98px) { body.th-gitbook { --gb-hrow-gap: 16px; } }
/* 깃북 헤더 링크 접힘 — 헤더 폭(컨테이너 쿼리)으로 결정 */
@media (min-width: 1024px) { body.th-gitbook { --gb-hleft-basis: 288px; --gb-hleft-mr: 24px; } }
@container header (min-width: 672px) { body.th-gitbook .gb-search-wrap { flex: 0.8 0 224px; max-width: 50%; } }
@container header (min-width: 896px) { body.th-gitbook .gb-search-wrap { flex: 0.8 0 160px; } }

/* 헤더 링크 접힘(원본 규칙 그대로) */
@container header not (min-width: 1280px) { body.th-gitbook .gb-extlinks { container: headerlinks / inline-size; flex: 1 1 0%; } }
@container headerlinks not (min-width: 150px) { body.th-gitbook .gb-extlinks > :nth-child(n+1) { display: none; } body.th-gitbook .gb-extlinks > :nth-child(n+1) ~ .gb-extmore, body.th-gitbook .gb-extlinks > :nth-child(n+1) ~ .gb-extmore .gb-extmenu > :nth-child(n+1) { display: flex; } }
@container headerlinks not (min-width: 300px) { body.th-gitbook .gb-extlinks > :nth-child(n+2) { display: none; } body.th-gitbook .gb-extlinks > :nth-child(n+2) ~ .gb-extmore, body.th-gitbook .gb-extlinks > :nth-child(n+2) ~ .gb-extmore .gb-extmenu > :nth-child(n+2) { display: flex; } }
@container headerlinks not (min-width: 450px) { body.th-gitbook .gb-extlinks > :nth-child(n+3) { display: none; } body.th-gitbook .gb-extlinks > :nth-child(n+3) ~ .gb-extmore, body.th-gitbook .gb-extlinks > :nth-child(n+3) ~ .gb-extmore .gb-extmenu > :nth-child(n+3) { display: flex; } }
@container headerlinks not (min-width: 550px) { body.th-gitbook .gb-extlinks > :nth-child(n+4) { display: none; } body.th-gitbook .gb-extlinks > :nth-child(n+4) ~ .gb-extmore, body.th-gitbook .gb-extlinks > :nth-child(n+4) ~ .gb-extmore .gb-extmenu > :nth-child(n+4) { display: flex; } }
@container headerlinks not (min-width: 650px) { body.th-gitbook .gb-extlinks > :nth-child(n+5) { display: none; } body.th-gitbook .gb-extlinks > :nth-child(n+5) ~ .gb-extmore, body.th-gitbook .gb-extlinks > :nth-child(n+5) ~ .gb-extmore .gb-extmenu > :nth-child(n+5) { display: flex; } }
@container headerlinks not (min-width: 750px) { body.th-gitbook .gb-extlinks > :nth-child(n+6) { display: none; } body.th-gitbook .gb-extlinks > :nth-child(n+6) ~ .gb-extmore, body.th-gitbook .gb-extlinks > :nth-child(n+6) ~ .gb-extmore .gb-extmenu > :nth-child(n+6) { display: flex; } }

/* ---- 호버·활성 배경 (원본 실측) ---- */
body.th-gitbook {
  --gb-tab-hover-bg: #F0F2F6;
  --gb-side-active-hover-bg: #E9F3FF; --gb-side-active-hover-color: #576E98;
}
/* 데스크톱: 사이드바 스크롤 컨테이너가 글자보다 20px 왼쪽에서 시작해야 링크 박스(글자-12px)의 호버 배경이 잘리지 않는다 */
@media (min-width: 1024px) {
  body.th-gitbook .gb-sidebar {
    margin-left: -20px; padding-left: 8px; width: calc(var(--gb-side-w) + 20px);
    display: flex; flex-direction: column; height: calc(100vh - var(--header-h) - var(--tabs-h)); padding-bottom: 7px;
  }
  /* 목록만 따로 스크롤하고 「Powered by」 카드는 그 아래에 고정 — 카드 뒤로 항목이 비치지 않는다 */
  body.th-gitbook .gb-sidebar { overflow: hidden; }
  body.th-gitbook .gb-sidebar-nav { margin-left: 0; flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: transparent transparent; padding-bottom: 12px; }
  body.th-gitbook .gb-sidebar-nav:hover { scrollbar-color: #C9CDD4 transparent; }
  body.th-gitbook .gb-powered-card { position: static; margin: 12px 0 16px 0; }
}
/* ---- 「Powered by」 카드 — 원본 카드와 같은 위치·모양(사이드바 맨 아래 고정) ---- */
body.th-gitbook .gb-footer { display: none; }
body.th-gitbook .gb-powered-card {
  display: flex; align-items: center; gap: 12px; flex: none; box-sizing: border-box;
  width: fit-content; max-width: 100%; align-self: flex-start; margin: auto 0 16px 0; padding: 14px 20px 14px 16px;
  border: 1px solid #E2E6EC; border-radius: 12px; background: #fff;   /* 불투명 — 목록이 길 때 항목이 카드를 뚫고 비치지 않게 */
  font-size: 14px; font-weight: 600; line-height: 21px; color: #6A6E77; text-decoration: none;
  position: sticky; bottom: 16px;
}
body.th-gitbook .gb-powered-card:hover { color: #1C1D1F; background: #F7F8FA; }
body.th-gitbook .gb-powered-card .gb-powered-mark { width: 21px; height: 21px; border-radius: 5px; }
@media (min-width: 1024px) { body.th-gitbook .gb-powered-card { margin-left: 0; } }
@media (max-width: 1023.98px) { body.th-gitbook .gb-powered-card { width: fit-content; margin: 0 32px 16px 0; position: static; } }
