/* ============================================================================
   AIHUB 대시보드 — 디자인 토큰 단일 SoT (tokens.css)
   출처: docs/reports/dashboard-redesign-2026-07-07/00_MASTER_AUDIT_REDESIGN.md §5.2
        + 02_DESIGN_UPDATE_PLAN.md (디자인 심화 W1, 2026-07-08)
   T-01 · 2026-07-07. 분열된 --*(style.css) / --n-*(noc.css) / 임베드 각자 토큰을
   단일 --ds-* 네임스페이스로 통합. style.css/noc.css/임베드는 이 파일을 참조(alias)한다.
   ⚠ Opus 규칙: 신규 UI는 --ds-* 만 사용. 하드코드 hex 금지.
   ============================================================================ */

/* ── 폰트 셀프호스트 (D-01) — CDN 금지(§5.1). 5패밀리 → 2패밀리 ── */
@font-face {
  font-family: 'Pretendard';
  src: url('/static/fonts/PretendardVariable.woff2') format('woff2-variations');
  font-weight: 45 920;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/static/fonts/JetBrainsMono-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/static/fonts/JetBrainsMono-SemiBold.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/static/fonts/JetBrainsMono-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}
:root {
  /* ── 표면(다크 기본) ── */
  --ds-bg-0:#1c1b17; --ds-bg-1:#211f1b; --ds-bg-2:#262521; --ds-bg-3:#2f2e28;
  --ds-border:#43413a; --ds-border-strong:#5a574e; --ds-hairline:rgba(255,255,255,.06);

  /* ── 텍스트 ── */
  --ds-text:#ece8df; --ds-text-2:#c2bcad; --ds-text-3:#a09a8a;  /* D-10: 칩배경 위 4.5:1 (#8f897b→) */

  /* ── 브랜드/강조 ── */
  --ds-accent:#5fb4c4; --ds-accent-2:#8fd4e2;
  --ds-accent-soft:rgba(95,180,196,.14); --ds-accent-line:rgba(95,180,196,.55);
  --ds-glow:0 0 0 1px rgba(95,180,196,.55), 0 0 14px rgba(95,180,196,.10);

  /* ── 시맨틱(상태) — base + 조화된 -bg 틴트(같은 hue 파생) ── */
  --ds-success:#7fb069; --ds-success-bg:rgba(127,176,105,.15);
  --ds-warn:#f4c430;    --ds-warn-bg:rgba(244,196,48,.15);
  --ds-danger:#d8593f;  --ds-danger-bg:rgba(216,89,63,.15);
  --ds-info:#5fb4c4;    --ds-info-bg:rgba(95,180,196,.15);
  --ds-neutral:#8f897b; --ds-neutral-bg:rgba(143,137,123,.14);

  /* ── 봇 작업상태 전용(신규 · C1 해결의 핵심) ── */
  --ds-bot-working:#5fb4c4;  /* 작업 중 (info/청록, LiveDot 펄스) */
  --ds-bot-idle:#7fb069;     /* 대기·정상 (success/녹) */
  --ds-bot-warn:#f4c430;     /* 지연·부분 (warn/황) */
  --ds-bot-error:#d8593f;    /* 오류 (danger/적) */
  --ds-bot-offline:#948e7e;  /* 오프라인 (중립/회 — D-10 배지 가독) */
  --ds-bot-unknown:#a09a8a;  /* 미상 (점선 테두리) */

  /* ── 타이포 ── (Pretendard 미확보 → Noto Sans KR 폴백 유지: 회귀 없음. 자체호스트는 후속) */
  --ds-font:'Pretendard','Noto Sans KR',system-ui,sans-serif;
  --ds-font-mono:'JetBrains Mono','Fira Code',ui-monospace,monospace;
  --ds-fs-2xs:10px; --ds-fs-xs:11px; --ds-fs-sm:12px; --ds-fs-md:13px;
  --ds-fs-base:14px; --ds-fs-lg:16px; --ds-fs-xl:21px; --ds-fs-2xl:28px; --ds-fs-3xl:40px;
  --ds-fw-reg:400; --ds-fw-med:500; --ds-fw-semi:600; --ds-fw-bold:700;

  /* ── 간격(4px 그리드) ── */
  --ds-sp-1:4px; --ds-sp-2:8px; --ds-sp-3:12px; --ds-sp-4:16px; --ds-sp-5:20px; --ds-sp-6:24px; --ds-sp-8:32px;

  /* ── 라운드/그림자/모션/z ── */
  --ds-radius-sm:4px; --ds-radius:8px; --ds-radius-lg:12px; --ds-radius-pill:999px;
  --ds-elev-1:0 2px 8px rgba(0,0,0,.35); --ds-elev-2:0 4px 18px rgba(0,0,0,.32); --ds-elev-pop:0 10px 30px rgba(0,0,0,.55);
  --ds-motion:.14s ease; --ds-motion-slow:.24s ease;
  --ds-z-base:0; --ds-z-sticky:100; --ds-z-nav:200; --ds-z-overlay:800; --ds-z-modal:900; --ds-z-toast:1000;
}

:root {
  /* ── 차트 전용 팔레트 (D-02) — dataviz 검증기 ALL PASS (다크 표면 #211f1b:
        명도대역 L0.48–0.67 · 채도≥0.1 · CVD 최악 인접쌍 ΔE41.9 · 대비≥3:1).
        규칙: 고정 순서·순환 금지, 5번째 계열부터 '기타'로 폴딩. 상태색(--ds-success 등)을
        차트 계열색으로 재사용 금지. 순차=시안 단일 hue 램프, 분기=시안↔러스트+회색 중점.
        변경 시 검증기 재실행 의무: node scripts/validate_palette.js "<hex,..>" --mode dark --surface "#211f1b" ── */
  --ds-chart-1:#1c94b0;      /* 청사진 시안 */
  --ds-chart-2:#c9821f;      /* 앰버 */
  --ds-chart-3:#9a7ae0;      /* 바이올렛 */
  --ds-chart-4:#d66a8e;      /* 로즈 */
  --ds-chart-other:#8f897b;  /* 기타 폴딩 = 중립 */
  --ds-chart-diverge-neg:#c1502e; /* 분기 음극(러스트 — 상태 danger 와 별개 스텝) */
}

:root {
  /* 도면 그리드 선색 — 다크: 콘크리트 보더 / 라이트: 연청 제도선(§4 인쇄 도면) */
  --ds-grid: #43413a;
}

/* ============================================================================
   라이트 테마 "인쇄 도면 (Printed Site-Plan)" — D-09 (02_PLAN §4)
   다크(관제실)와 짝: 제도용지 웜화이트 + 연청 제도선 + 먹색 텍스트.
   활성화 = html[data-theme="light"] (theme-init.js 가 localStorage/OS 선호로 설정).
   차트 라이트 스텝 = 검증기 ALL PASS·WARN 0 (surface #f2efe7).
   ============================================================================ */
:root[data-theme="light"] {
  /* 표면 — 제도용지 */
  --ds-bg-0:#e4dfd1; --ds-bg-1:#faf8f2; --ds-bg-2:#f2efe7; --ds-bg-3:#eae5d9;
  --ds-border:#d5cec0; --ds-border-strong:#b6ad99; --ds-hairline:rgba(0,0,0,.07);
  --ds-grid: rgba(28,148,176,.14);   /* 연청 제도선 — 청사진의 음화 */
  /* 텍스트 — 먹색 */
  --ds-text:#26241f; --ds-text-2:#57534a; --ds-text-3:#67614f;
  /* 강조 — 라이트 대비 스텝 */
  --ds-accent:#136379; --ds-accent-2:#1c94b0;
  --ds-accent-soft:rgba(28,148,176,.12); --ds-accent-line:rgba(23,117,141,.45);
  --ds-glow:0 0 0 1px rgba(23,117,141,.35), 0 0 14px rgba(23,117,141,.08);
  /* 시맨틱 — 동일 hue, 라이트 표면용 어두운 스텝(자동 반전 아님) */
  --ds-success:#426633; --ds-success-bg:rgba(79,122,60,.13);
  --ds-warn:#7a5a06;    --ds-warn-bg:rgba(150,112,10,.14);
  --ds-danger:#9c3418;  --ds-danger-bg:rgba(179,66,38,.12);
  --ds-info:#136379;    --ds-info-bg:rgba(23,117,141,.12);
  --ds-neutral:#6f695c; --ds-neutral-bg:rgba(124,118,104,.13);
  /* 봇 작업상태 */
  --ds-bot-working:#136379; --ds-bot-idle:#426633; --ds-bot-warn:#7a5a06;
  --ds-bot-error:#9c3418; --ds-bot-offline:#87816f; --ds-bot-unknown:#67614f;
  /* 차트 — 라이트 스텝 (검증기 ALL PASS) */
  --ds-chart-1:#0e7fa0; --ds-chart-2:#a86a0f; --ds-chart-3:#7d5cc8; --ds-chart-4:#b84a6e;
  --ds-chart-other:#8a8477; --ds-chart-diverge-neg:#a84a28;
  /* 그림자 — 종이 위 얕은 부양 */
  --ds-elev-1:0 2px 8px rgba(0,0,0,.10); --ds-elev-2:0 4px 18px rgba(0,0,0,.09);
  --ds-elev-pop:0 10px 30px rgba(0,0,0,.18);
}

/* 다크 아일랜드 — 셸이 라이트여도 내부는 다크 유지(캔버스·갤럭시 시각화 패널용).
   지도 iframe 임베드는 자체 다크 고정, 셸 내부 네이티브 시각화 패널은 이 클래스로. (2026-07-08) */
.ds-dark-island {
  --ds-bg-0:#1c1b17; --ds-bg-1:#211f1b; --ds-bg-2:#262521; --ds-bg-3:#2f2e28;
  --ds-border:#43413a; --ds-border-strong:#5a574e; --ds-hairline:rgba(255,255,255,.06);
  --ds-grid:#43413a;
  --ds-text:#ece8df; --ds-text-2:#c2bcad; --ds-text-3:#a09a8a;
  --ds-accent:#5fb4c4; --ds-accent-2:#8fd4e2;
  --ds-accent-soft:rgba(95,180,196,.14); --ds-accent-line:rgba(95,180,196,.55);
  --ds-success:#7fb069; --ds-success-bg:rgba(127,176,105,.15);
  --ds-warn:#f4c430; --ds-warn-bg:rgba(244,196,48,.15);
  --ds-danger:#d8593f; --ds-danger-bg:rgba(216,89,63,.15);
  --ds-info:#5fb4c4; --ds-info-bg:rgba(95,180,196,.15);
  --ds-neutral:#8f897b; --ds-neutral-bg:rgba(143,137,123,.14);
  --ds-chart-1:#1c94b0; --ds-chart-2:#c9821f; --ds-chart-3:#9a7ae0; --ds-chart-4:#d66a8e;
  --ds-chart-other:#8f897b;
  background: var(--ds-bg-2); color: var(--ds-text);
  color-scheme: dark;
}

/* 접근성: 가시적 키보드 포커스 (D-10) — 컴포넌트 자체 정의가 있으면 그것이 우선 */
:focus-visible { outline: 2px solid var(--ds-accent); outline-offset: 2px; }
:focus:not(:focus-visible) { outline: none; }

/* 접근성: 모션 축소 선호 시 트랜지션 무효화 (T-02/T-27 연동) */
@media (prefers-reduced-motion: reduce) {
  :root { --ds-motion:0s; --ds-motion-slow:0s; }
}