/* ---------------------------------------------------------------------------
   font-scale.css - 사람마다 정하는 글자 크기 (licensemanager · fbhq · membermanage · planner 공통, 같은 파일)

   planner 의 방식(2026-10-01 사용자 결정 "planner 방식으로 모든 앱을 통일"):
     --fb-fs   사람마다 정하는 배수. 개인 설정에서 본문 글자 크기를 px 숫자(10 ~ 24, 기본 14)로 적으면
               그 px 를 앱 본문의 기본 px 로 나눈 값입니다. 계정에 저장되어 다른 PC 에서도 따라옵니다.
               화면 머리에서 <style>:root{--fb-fs:N}</style> 로 찍습니다(처음 그릴 때부터 그 크기).
     --fb-base 모든 앱 1. 앱마다 다른 기본 크기는 --fb-fs 를 셈할 때 반영합니다.
   **글자만** 바꿉니다. 간격(padding · gap)은 그대로 둡니다 - 같이 늘리면 표가 화면 밖으로 밀려나고,
   사람이 원하는 것은 글자가 읽히는 것이지 화면이 커지는 것이 아닙니다(planner/assets/plan.css 첫머리).

   이 파일은 Hyper(app.min.css) 바로 뒤, 앱 CSS 앞에 둡니다. 앱 CSS 의 font-size 는
   calc(var(--fb-fs, 1) * 크기) 로 씁니다 - 손으로 적은 값은 배수를 타지 않습니다.
   planner 는 이미 --pl-fs 로 같은 일을 하므로 거기서는 --fb-fs 를 --pl-fs 로 잇습니다.
   --------------------------------------------------------------------------- */
:root {
    --fb-fs: 1;
    --fb-base: 1;
    --fb-k: calc(var(--fb-base) * var(--fb-fs));

    --ct-body-font-size: calc(.9rem * var(--fb-k));
    --ct-menu-item-font-size: calc(.9375rem * var(--fb-k));
}
/* Hyper 는 아래 변수를 :root 가 아니라 그 요소에 둡니다 - :root 에 두면 가려져 배수를 타지 않았습니다. */
.dropdown-menu { --ct-dropdown-font-size: calc(.9rem * var(--fb-k)); }
.tooltip { --ct-tooltip-font-size: calc(.875rem * var(--fb-k)); }
.popover { --ct-popover-font-size: calc(.875rem * var(--fb-k)); --ct-popover-header-font-size: calc(.9rem * var(--fb-k)); }
.toast { --ct-toast-font-size: calc(.875rem * var(--fb-k)); }
body { font-size: var(--ct-body-font-size); }

/* h1 ~ h3 · fs-1 ~ fs-3 은 Hyper 처럼 1200px 아래에서 화면 폭을 따라 작아집니다(그 값에 배수만 곱함). */
h1, .h1 { font-size: calc((1.35rem + 1.2vw) * var(--fb-k)); }
h2, .h2 { font-size: calc((1.3122rem + .7464vw) * var(--fb-k)); }
h3, .h3 { font-size: calc((1.2753rem + .3036vw) * var(--fb-k)); }
.fs-1 { font-size: calc((1.35rem + 1.2vw) * var(--fb-k)) !important; }
.fs-2 { font-size: calc((1.3122rem + .7464vw) * var(--fb-k)) !important; }
.fs-3 { font-size: calc((1.2753rem + .3036vw) * var(--fb-k)) !important; }
@media (min-width: 1200px) {
    h1, .h1 { font-size: calc(2.25rem * var(--fb-k)); }
    h2, .h2 { font-size: calc(1.872rem * var(--fb-k)); }
    h3, .h3 { font-size: calc(1.503rem * var(--fb-k)); }
    .fs-1 { font-size: calc(2.25rem * var(--fb-k)) !important; }
    .fs-2 { font-size: calc(1.872rem * var(--fb-k)) !important; }
    .fs-3 { font-size: calc(1.503rem * var(--fb-k)) !important; }
}
h4, .h4 { font-size: calc(1.125rem * var(--fb-k)); }
h5, .h5 { font-size: calc(.936rem * var(--fb-k)); }
h6, .h6 { font-size: calc(.765rem * var(--fb-k)); }
.fs-4 { font-size: calc(1.125rem * var(--fb-k)) !important; }
.fs-5 { font-size: calc(.936rem * var(--fb-k)) !important; }
.fs-6 { font-size: calc(.765rem * var(--fb-k)) !important; }
.card .header-title { font-size: calc(.9rem * var(--fb-k)); }
.lead { font-size: calc(1.125rem * var(--fb-k)); }

.form-control, .form-select, .input-group-text { font-size: calc(.9rem * var(--fb-k)); }
.form-control-sm, .form-select-sm, .input-group-sm > .form-control, .input-group-sm > .form-select,
.input-group-sm > .input-group-text { font-size: calc(.875rem * var(--fb-k)); }
.col-form-label-sm { font-size: calc(.875rem * var(--fb-k)); }
.form-text, .invalid-feedback, .valid-feedback { font-size: calc(.75rem * var(--fb-k)); }

.btn { --ct-btn-font-size: calc(.9rem * var(--fb-k)); }
.btn-sm, .btn-group-sm > .btn, .input-group-sm > .btn { --ct-btn-font-size: calc(.875rem * var(--fb-k)); }
.btn-lg, .btn-group-lg > .btn, .input-group-lg > .btn { --ct-btn-font-size: calc(1.251rem * var(--fb-k)); }
.form-control-lg, .form-select-lg, .input-group-lg > .form-control, .input-group-lg > .form-select { font-size: calc(1.251rem * var(--fb-k)); }
.pagination { --ct-pagination-font-size: calc(.9rem * var(--fb-k)); }
.pagination-sm { --ct-pagination-font-size: calc(.875rem * var(--fb-k)); }
.pagination-lg { --ct-pagination-font-size: calc(1.251rem * var(--fb-k)); }
.dropdown-header { font-size: calc(.875rem * var(--fb-k)); }
.accordion-button { font-size: calc(.9rem * var(--fb-k)); }

/* 사람마다 정하는 글자 크기 칸 (assets/font-scale.js) - 이 칸과 단추는 배수를 타지 않습니다.
   크기를 줄이다 보면 칸이 읽히지 않아 되돌릴 수 없게 됩니다. */
.fb-fs .form-control.fb-fs-px { width: 80px; font-size: 13px; padding: 4px 8px; font-variant-numeric: tabular-nums; }
.fb-fs .fb-fs-unit { font-size: 13px; color: var(--ct-secondary-color, #6c757d); }
.fb-fs .btn { --ct-btn-font-size: 13px; padding: 4px 12px; }

/* =========================================================================
 * 글꼴 한 벌 (2026-10-12) - 한글 · 영문 같은 글꼴 (네 앱이 같은 내용을 씁니다)
 * Hyper 의 Nunito 는 영문 전용이라 한글만 시스템 글꼴로 떨어져 글자 모양이 섞였습니다. Noto Sans KR(한글 + 영문)을 먼저,
 * 안 올라오면 맑은 고딕 · Apple SD Gothic Neo 로 한글 · 영문을 같이 그립니다. 글꼴 파일은 화면 머리의 <link> 가 부릅니다.
 * ========================================================================= */
:root {
    --ct-font-sans-serif: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", "Segoe UI", sans-serif;
}
body, .btn, .form-control, .form-select, .dropdown-menu, .modal, .tooltip, .popover, .badge, .table, .nav-link {
    font-family: var(--ct-font-sans-serif);
}