/* ============================================================================
   @name  파랑 입체
   @color #e8edf3
   ----------------------------------------------------------------------------
   기본 테마 - 회청색 바탕 · 파랑 · 테두리 없이 그림자로 떠 있는 면, 입력칸은 들어간다 (phpdashapi 웹 모드 2026-09-26)

   테마 파일 규칙 (claude_common/ui/design-system.md "테마"):
   - 테마 하나 = 이 파일 하나. 화면은 고른 테마 파일 하나만 싣는다
   - 변수 값만 둔다. 컴포넌트 CSS는 이 변수만 쓰고 색·그림자·모서리 값을 직접 쓰지 않는다
   - :root = 라이트 + 모드와 상관없는 값(모서리), :root[data-mode="dark"] = 다크
   - 새 테마는 이 파일을 복사해 값만 바꾼다. @name은 테마 고르기 이름, @color는 휴대폰 브라우저 윗줄 색
   - 모든 변수를 빠짐없이 채운다 - server/check-theme.py가 확인한다
   ============================================================================ */
:root {
  /* 모서리 - 모든 테마가 같은 값(2026-10-02 "모양은 그대로"). 버튼 네모/알약(--uk-r-btn)만 테마가 고른다 */
  --uk-r-xs: 4px;  --uk-r-sm: 8px;  --uk-r-md: 12px;  --uk-r-lg: 16px;  --uk-r-xl: 24px;  --uk-r-pill: 999px;
  --uk-r-btn: 12px;                 /* 버튼 - 네모 12px / 알약 999px 중 테마가 고른다 */

  color-scheme: light;
  /* 면 · 선 · 글자 */
  --uk-bg: #e8edf3;       --uk-surface: #f1f4f8;  --uk-head: #eef2f7;  --uk-sunk: #e2e8ef;
  --uk-border: #d4dce6;   --uk-line: #dfe5ec;
  --uk-fg: #1e2733;       --uk-muted: #5d6b7c;
  /* 뜻 색 */
  --uk-brand: #2f83fd;    --uk-brand-dark: #1d6de6;   --uk-brand-light: #dce8fc;
  --uk-pick: var(--uk-brand);  --uk-pick-dark: var(--uk-brand-dark);  --uk-pick-light: var(--uk-brand-light);  /* 선택 표시(지금 보는 곳) - 이 테마는 강조색과 같다 */
  --uk-danger: #d94141;   --uk-danger-dark: #c53434;  --uk-danger-light: #fdecec;  --uk-danger-fg: #9f2b2b;
  --uk-ok: #16a34a;       --uk-ok-fg: #1f6e48;        --uk-ok-light: #e6f6ec;
  --uk-warn: #e8950f;     --uk-warn-fg: #8a5a06;      --uk-warn-light: #fff6df;
  /* 차트 계열 색 - 선·막대를 가르는 차례 색(1~4는 뜻 색과 같다). 규칙은 ui/chart.md */
  --uk-series-1: var(--uk-brand); --uk-series-2: var(--uk-ok); --uk-series-3: var(--uk-warn); --uk-series-4: var(--uk-danger);
  --uk-series-5: #7c3aed; --uk-series-6: #0891b2; --uk-series-7: #db2777; --uk-series-8: #65a30d;
  --uk-on-strong: #fff;   /* 진한 바탕(강조색·빨강·초록·노랑) 위 글자 */
  /* 부품 색 */
  --uk-folder: #f0b429;   /* 폴더 그림 */
  --uk-tip-bg: #3c4552;   --uk-tip-fg: #fff;          /* 도움말 말풍선 */
  --uk-today: #fff5d1;    /* 달력 오늘 칸 */
  /* 막 · 그림자 */
  --uk-backdrop: rgba(30, 40, 56, .16);  /* 가운데 창 뒤 옅은 막 */
  --uk-scrim: rgba(0, 0, 0, .45);        /* 바닥 시트·서랍 뒤 막 */
  --uk-shc: 92, 110, 140;                /* 그림자 색(r, g, b) */
  --uk-up-sm: -2px -2px 6px rgba(var(--uk-shc), .17), 1px 1px 2px rgba(var(--uk-shc), .2), 3px 4px 10px rgba(var(--uk-shc), .34);
  --uk-up: -3px -3px 9px rgba(var(--uk-shc), .18), 1px 2px 3px rgba(var(--uk-shc), .22), 5px 6px 16px rgba(var(--uk-shc), .36);
  --uk-up-lg: -5px -5px 14px rgba(var(--uk-shc), .17), 2px 3px 5px rgba(var(--uk-shc), .2), 10px 12px 28px rgba(var(--uk-shc), .34);
  --uk-down: inset 3px 3px 7px rgba(var(--uk-shc), .32), inset -1px -1px 2px rgba(var(--uk-shc), .1);
}
:root[data-mode="dark"] {
  color-scheme: dark;
  --uk-bg: #161b22;       --uk-surface: #1d242d;  --uk-head: #1a2029;  --uk-sunk: #12171d;
  --uk-border: #2c3642;   --uk-line: #252e38;
  --uk-fg: #e3e9f0;       --uk-muted: #93a1b2;
  --uk-brand: #5a9dff;    --uk-brand-dark: #7bb0ff;   --uk-brand-light: #1e3352;
  --uk-pick: var(--uk-brand);  --uk-pick-dark: var(--uk-brand-dark);  --uk-pick-light: var(--uk-brand-light);  /* 선택 표시(지금 보는 곳) - 이 테마는 강조색과 같다 */
  --uk-danger: #f06464;   --uk-danger-dark: #ff7b7b;  --uk-danger-light: #3a1f22;  --uk-danger-fg: #f4b0b0;
  --uk-ok: #3fc272;       --uk-ok-fg: #9be0b8;        --uk-ok-light: #173226;
  --uk-warn: #f0b04a;     --uk-warn-fg: #f3d9a4;      --uk-warn-light: #3a2f17;
  --uk-series-1: var(--uk-brand); --uk-series-2: var(--uk-ok); --uk-series-3: var(--uk-warn); --uk-series-4: var(--uk-danger);
  --uk-series-5: #a78bfa; --uk-series-6: #22c3dc; --uk-series-7: #f472b6; --uk-series-8: #9fd34a;
  --uk-on-strong: #fff;
  --uk-folder: #e8b13a;
  --uk-tip-bg: #4a5768;   --uk-tip-fg: #fff;
  --uk-today: #3a3320;
  --uk-backdrop: rgba(0, 0, 0, .4);
  --uk-scrim: rgba(0, 0, 0, .55);
  --uk-shc: 0, 0, 0;
  --uk-up-sm: -2px -2px 6px rgba(var(--uk-shc), .17), 1px 1px 2px rgba(var(--uk-shc), .2), 3px 4px 10px rgba(var(--uk-shc), .34);
  --uk-up: -3px -3px 9px rgba(var(--uk-shc), .18), 1px 2px 3px rgba(var(--uk-shc), .22), 5px 6px 16px rgba(var(--uk-shc), .36);
  --uk-up-lg: -5px -5px 14px rgba(var(--uk-shc), .17), 2px 3px 5px rgba(var(--uk-shc), .2), 10px 12px 28px rgba(var(--uk-shc), .34);
  --uk-down: inset 3px 3px 7px rgba(var(--uk-shc), .32), inset -1px -1px 2px rgba(var(--uk-shc), .1);
}
