/* ═══ variables.css ═══ */
/* ═══════════════════════════════════════════════════════
   파일   : common/variables.css
   역할   : 디자인 토큰(:root) — 색·그림자·radius. 다크모드 오버라이드는 common.css의 body[data-theme]가 담당
   의존   : 없음 (로드 순서: variables → common → views — 캐스케이드 보존, 순서 변경 금지)
   이력   : v206 모듈분리 2단계 — <style> 블록 6개 적출·내용 무변경 (2026-08-18)
   ═══════════════════════════════════════════════════════ */

  :root{
    --bg:#eef1f6;
    --panel:#ffffff;
    --ink:#1c2433;
    --ink-soft:#3F4A59;   /* [v151 선명화2] 삼성 벤치마크 — 보조도 진하게 (구 #5b6577) */
    --ink-faint:#67737F;   /* [v151 선명화2] 구 #8791a3 */
    --line:#e3e7ef;
    --line-soft:#eef1f6;
    --navy:#116BFF;
    --navy-2:#4D8FFF;
    --navy-deep:#0A4FC4;
    --accent:#E07258;
    --accent-soft:#fdeae6;
    --ok:#3AAFA0;
    --ok-soft:#e2f6f3;
    --warn:#E6AE60;
    --warn-soft:#fdf2dc;
    --gold:#E6AE60;
    /* [2026-10-18 사용자 결정 ㉢-1] 글씨용 상태색 — 위 --ok·--warn·--accent 는 바탕·점·아이콘용이라 흰 바탕 글씨로는 2.0~2.9:1. 글씨만 이 값(4.6~5.9:1) */
    --ok-ink:#1F7A6D;
    --warn-ink:#8A5A12;
    --accent-ink:#B4472F;
    --shadow-sm:0 1px 2px rgba(28,36,51,.05);
    --shadow:0 2px 6px rgba(28,36,51,.06),0 10px 30px rgba(28,36,51,.06);
    --shadow-lg:0 8px 24px rgba(28,36,51,.1),0 30px 70px rgba(28,36,51,.14);
    --r:14px;
    /* [2026-10-03 사용자 결정 · 포스트잇 A안] 왼쪽 강조 상자 공통 값 — 모양은 views.css 맨 끝 「포스트잇」 블록 한 곳에서만 쓴다.
       다크 그림자는 common.css body[data-theme="dark"] · 인사평가 iframe(modules/hr/index.html)은 같은 값을 따로 둔다(부모 CSS 를 못 받음) */
    --postit-w:10px;                 /* 띠 두께 (종전 3~5px 둥근 막대) */
    --postit-pl:6px;                 /* 띠 안쪽 글자 여백 → 글자 시작 16px (종전 14~20px) — 9px 이상이면 좁은 칸(경비 분류 요약·수정이력)에서 줄이 하나 더 생겼다(폭 260~720 실측) */
    --postit-tint:11%;               /* 바탕 = 강조색 11% + 카드색 */
    --postit-r:2px 6px 6px 2px;
    --postit-sh:0 1px 0 rgba(0,0,0,.04),2px 3px 6px rgba(0,0,0,.08);
    /* [2026-10-03 사용자 결정 1-②] 제목 앞 표식 = 작은 포스트잇 조각(색 사각형 · 살짝 기울임 · 윗부분 밝은 접착띠) — 종전 4×18px 둥근 세로 막대 */
    --scrap:12px;
    --scrap-rot:-6deg;
    --scrap-sh:1px 2px 3px rgba(0,0,0,.18);
  }

/* ═══ common.css ═══ */
/* ═══════════════════════════════════════════════════════
   파일   : common/common.css
   역할   : 전역 공통 스타일 — 레이아웃 셸·사이드바·탑바·버튼·모달·뷰 전반 (구 head 대형 블록)
   의존   : 없음 (로드 순서: variables → common → views — 캐스케이드 보존, 순서 변경 금지)
   이력   : v206 모듈분리 2단계 — <style> 블록 6개 적출·내용 무변경 (2026-08-18) · 2026-10-16 정리 — 죽은·잉여 코드만 뺌, 동작 동일
   ═══════════════════════════════════════════════════════ */

  *{box-sizing:border-box;margin:0;padding:0}
  body{
    font-family:"Pretendard","Malgun Gothic","맑은 고딕",-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif;   /* v125: Pretendard 통일 (미로딩 시 맑은고딕 폴백) */
    background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;
    line-height:1.55;font-size:14px;   /* [v151 폰트업] 본문 티어업: 13/13.5→14, 12.5→13.5 (2026-07-23 진권) */
  }
  button{font-family:inherit;cursor:pointer}
  .hidden{display:none!important}
  /* ═══ [2026-10-03 줄바꿈 공통] 사용자 지적 「외톨이 낱말」(…이용 / 할 수 있습니다 · 미리 준 / 비하세요) ═══
     ① 한글은 낱말 단위로만 끊는다(keep-all) — 칸보다 긴 영문·URL·숫자만 아무 데서나 끊는다(anywhere).
     ② 문단은 pretty(마지막 줄 외톨이 방지) — html 에 두면 모든 글이 물려받는다.
     ③ 제목·빈 화면·잠금 카드·토스트·모달 짧은 안내는 balance(줄 길이를 고르게).
     ④ 기울임꼴 합성 끔 — Pretendard 는 기울임꼴이 없어 <i>·<em> 기본 기울임이 글자를 억지로 비틀었다(한글이 어색).
     ⚠️ 칸마다 text-wrap:balance(줄임형)를 쓰지 않는다 — 줄임형은 white-space:nowrap(한 줄 고정)까지 풀어 버린다. text-wrap-style 만.
     ⚠️ 따로 뜨는 문서는 부모 CSS 를 못 받는다 — 같은 값을 복사해 둔다(바꾸면 같이):
        modules/hr/index.html · modules/material/index.html(iframe) · common/theme.js F2_TEXT_CSS(메일 새 창·인쇄 팝업·증빙 대조 창)
     ⚠️ 서버 PDF(weasyprint 70)는 keep-all 을 지원하지 않는다(normal|break-all 만) — PDF 는 종전대로 글자 단위.
     문장 단위 줄(여러 문장 안내 → 문장마다 줄)은 common/ui-shell.js 「문장 단위 줄」(<f2-s>) · 확인은 server/check_ui_text.cjs */
  html{word-break:keep-all;overflow-wrap:anywhere;text-wrap:pretty;font-synthesis-style:none}
  textarea,input,select{word-break:normal;overflow-wrap:break-word}   /* 입력 중에는 종전처럼(커서가 낱말 단위로 튀지 않게) */
  pre,code,kbd,samp{word-break:normal}
  button,.btn,.tab{overflow-wrap:break-word}   /* 버튼·탭 — 좁은 줄에서 「임|시|저|장」「전|체」처럼 글자 단위로 눌리던 것(최소폭 = 낱말 폭) */
  .tabs{flex-wrap:wrap}   /* 탭이 한 줄에 안 들어가면 다음 줄로(종전엔 탭마다 글자 단위로 쪼그라들었다) */
  th,td{overflow-wrap:break-word}   /* 표 칸 — anywhere 는 칸 최소폭을 글자 하나로 줄여 자동 너비 표가 짧은 칸(「중|식」「금|액」)을 쪼갰다. break-word 는 낱말 폭을 지킨다 */
  h1,h2,h3,h4,h5,h6,.empty-state,.empty,[class$="-empty"],[class*="-empty "],[class$="-lock"],[class*="-lock "],[class$="-none"],[class*="-none "],
  [class$="-note"],[class*="-note "],[class$="-hint"],[class*="-hint "],[class$="-tip"],[class*="-tip "],th,td,
  #toastMsg,.modal-b>p,.lw-formdesc,.tfa-desc{text-wrap-style:balance}   /* 6줄 넘는 긴 글은 브라우저가 balance 를 건너뛰고 pretty 로 둔다 */
  /* 문장 단위 줄 — 한 줄에 다 들어가면 한 줄, 아니면 문장 경계에서 끊는다(문장마다 인라인 블록) */
  f2-s{display:inline-block}   /* 사용자 정의 태그(span 아님 — 「.x span{…}」 자손 규칙이 안 먹게) · ⚠️ max-width:% 를 주지 않는다 — 부모가 내용 폭인 칸(flex 제목 옆 라벨 등)에서 순환 백분율이 되어 「점수 · / 등급 · / 상태」처럼 쪼그라들었다. 줄보다 긴 문장은 원래 칸 폭까지만 넓어진다 */

  /* ===== LAYOUT ===== */
  .app{display:grid;grid-template-columns:270px 1fr;min-height:100vh}

  /* ===== SIDEBAR ===== */
  .side{
    background:#1B2536;
    color:#fff;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
  }
  /* ⚠️ [v201] flex:none 추가 — .side 가 flex column 이라 .brand 가 아이템으로 **찌그러지고 있었다**.
     height:92px 를 줘도 실제로는 콘텐츠 높이(30px)로 눌려 로고 위아래 여백이 0이 됐다.
     세로 padding 도 함께 준다(높이를 콘텐츠+여백으로 잡히게). */
  .brand{flex:none;min-height:92px;box-sizing:border-box;padding:12px 18px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:transparent}
  .brand .logo{display:flex;align-items:center;gap:11px}
  .brand .mark{
    width:38px;height:38px;border-radius:10px;background:#C4534E;
    display:grid;place-items:center;font-weight:800;font-size:16px;letter-spacing:.02em
  }
  .brand .nm{font-size:15px;font-weight:800;letter-spacing:.01em}
  /* ═══ [v199 로고] F2 Works 워드마크 — 진권 제공 벡터 원본(F2_Works_logo_4_step4_VECTOR.svg) ═══
     ⚠️ 글자 부분은 fill="currentColor" 로 바꿔 두었다. 원본은 #0D1B2A 짙은 네이비인데,
        그대로 두면 다크 사이드바(#0B100D)에서 로고가 배경에 묻혀 사라진다.
        → 색은 여기 .f2mark 의 color 로만 준다. 라이트=원본 네이비 / 다크=흰색.
     ⚠️ 액센트 사선(#2563FF)은 currentColor 로 안 바꿨다 — 브랜드 포인트라 양쪽 테마에서 그대로 살린다.
     ⚠️ 크기는 width 로만 조절한다(height:auto). 비율 737.5:162 ≈ 4.55:1. */
  /* [v201 로고] 진권 제공 4번 시안(F2_Works_logo). 글자는 currentColor 라 테마 따라 뒤집히고,
     액센트 블루(var(--navy))만 SVG 안에 고정돼 양쪽 테마에서 그대로 살아난다.
     ⚠️ 비율 1040:212 ≈ 4.9:1 — 폭만 주고 height:auto 로 둔다. */
  /* [2026-10-01 새 로고] F2Works_logo_v1.svg(viewBox 1510:778 ≈ 1.94:1) — 높이 48px 고정(WORKS 글자 ≈6px), 폭은 비율로(≈93px).
     색은 SVG 원본 fill 그대로(currentColor 아님 → 위 v199·v201 의 color 방식은 끝났다). 다크 사이드바에서만
     검정 글자(f2l-ink → 다크 본문 글자 토큰 --ink)·회색 잔상(f2l-echo)을 바꾼다. 빨강·노랑은 양쪽 테마 고정.
     아래 박음질(f2l-stitch)은 class="f2-accent" 를 달아 두었다 → 꼬리 [v248 계절]의 .f2mark .f2-accent(--sea-on)가 그대로 칠한다. */
  .f2mark{display:block;height:48px;width:auto;aspect-ratio:1510/778}
  body[data-theme="dark"] .f2mark .f2l-ink{fill:var(--ink,#E6E9F0)}
  body[data-theme="dark"] .f2mark .f2l-echo{fill:#4A5266}
  .brand .sub{font-size:10px;color:#6b6790;margin-top:2px;letter-spacing:.02em;font-weight:600}
  .brand-cap{text-align:center;font-size:10.5px;font-weight:600;color:rgba(255,255,255,.8);padding:7px 12px 4px;letter-spacing:.02em}

  .nav{padding:14px 12px;flex:1;overflow-y:auto}
  .nav .grp{font-size:10.5px;font-weight:700;letter-spacing:.1em;color:rgba(255,255,255,.4);padding:14px 12px 7px}
  .nav a{
    display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:10px;
    color:rgba(255,255,255,.78);text-decoration:none;font-size:14px;font-weight:600;
    margin-bottom:2px;transition:all .15s;position:relative;white-space:nowrap;
  }
  .nav a:hover{background:rgba(255,255,255,.10);color:#fff}
  .nav a.on{background:rgba(255,255,255,.16);color:#fff}
  .nav a.on::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:3px;background:#E6AE60}
  .nav a .ic{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.9}
  /* v113: 사이드바 그룹 컬러 아이콘 (C안 · 텍스트/hover는 그대로, 아이콘 stroke만) */
  .nav a[data-g="menu"]  .ic{stroke:#7ea6e0}
  .nav a[data-g="cal"]   .ic{stroke:#55c3ce}
  .nav a[data-g="hr"]    .ic{stroke:#f3c33f}
  .nav a[data-g="buy"]   .ic{stroke:#ee9e7a}
  .nav a[data-g="hrm"]   .ic{stroke:#b79ee8}
  .nav a[data-g="board"] .ic{stroke:#84cf68}
  /* v125 작업반영(①A 확장): 최상위 메뉴 12개 전부 개별 컬러 — 색상환 균등 분배 팔레트 (진권: 겹침 제로 지시)
     [사용 12색] 블루/시안/아쿠아/그린/라임/골드/오렌지/로즈/레드/핑크/바이올렛/인디고
     [여유 팔레트 — 신규 모듈용 예약 ㅋㅋ] 마젠타 #cd8ce0 · 코랄 #f47f63 · 레몬 #e8d05c · 스틸블루 #6a9fe0 */
  .nav a[data-view="dash"] .ic{stroke:#82aee5}      /* 대시보드 · 블루 */
  .nav a#revParent .ic{stroke:#5cc3e8}              /* 매출 현황 · 시안 */
  .nav a#eapprParent .ic{stroke:#ecc04f}            /* 전자결재 · 골드 */
  .nav a[data-view="org"] .ic{stroke:#b79ee8}       /* 조직도 · 바이올렛 */
  .nav a[data-view="schedule"] .ic{stroke:#6bd08a}  /* 업무 일정 · 그린 */
  .nav a#hrParent .ic{stroke:#f5a06a}               /* 인사평가 · 오렌지 */
  .nav a#gumaeParent .ic{stroke:#ea89c3}            /* 구매 · 핑크 */
  .nav a#matParent .ic{stroke:#c3d05a}              /* 자재관리 · 라임 */
  .nav a[data-view="notice"] .ic{stroke:#f484a0}    /* 사내공지 · 로즈 */
  .nav a#vaultParent .ic{stroke:#4fd6c3}            /* 사업부 자료실 · 아쿠아 */
  .nav a[data-view="common"] .ic{stroke:#9aa5f0}    /* 공용자료실 · 인디고 */
  .nav a[data-view="mail"] .ic{stroke:#6a9fe0}      /* [v151] 메일 · 스틸블루(예약 팔레트 소진) */
  .nav a[data-g="admin"] .ic{stroke:#ee6474}        /* 직원 DB 관리 · 레드 (ADMIN 배지와 시멘틱 일치) */
  /* v125 작업반영(②A): 슬림 스크롤바 전역 통일 — 트랙 투명 + 반투명 썸 5px, 호버 시 진해짐 */
  *{scrollbar-width:thin;scrollbar-color:rgba(28,36,51,.22) transparent}
  ::-webkit-scrollbar{width:5px;height:5px}
  ::-webkit-scrollbar-track{background:transparent}
  ::-webkit-scrollbar-thumb{background:rgba(28,36,51,.18);border-radius:10px}
  ::-webkit-scrollbar-thumb:hover{background:rgba(28,36,51,.34)}
  ::-webkit-scrollbar-corner{background:transparent}
  .nav{scrollbar-color:rgba(255,255,255,.18) transparent}   /* 다크 사이드바는 흰 반투명 썸 */
  .nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16)}
  .nav::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.32)}
  /* v125 작업반영(②A+): 사이드바 간격 압축 → 진권 피드백으로 한 단계 완화 (5px는 답답) — 1080p 무스크롤 유지, 720px 노트북은 슬림 스크롤바 폴백 */
  .nav{padding:10px 12px}
  .nav a{padding:7px 12px;margin-bottom:1px}
  .nav .grp{padding:8px 12px 3px;font-size:10px}
  .nav a[data-g].on .ic, .nav a[data-g]:hover .ic{filter:brightness(1.15)}
  .nav a .cnt{margin-left:auto;background:#C4534E;color:#fff;font-size:11px;font-weight:800;min-width:20px;height:20px;border-radius:20px;display:grid;place-items:center;padding:0 6px}

  /* 차량 및 복리후생 메뉴 트리 */
  .nav a.nav-parent{cursor:pointer}
  .nav a.nav-parent .caret{margin-left:auto;width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;transition:transform .2s;flex:none}
  .nav a.nav-parent[aria-expanded="true"] .caret{transform:rotate(180deg)}
  .nav a.nav-parent.parent-on{background:rgba(255,255,255,.12);color:#fff}
  .nav-sub{overflow:hidden;max-height:0;transition:max-height .25s ease;margin-bottom:2px}
  .nav-sub.open{max-height:160px}
  .nav-sub.mail-sub.open{max-height:220px}   /* [LAB 담당] 메일 하위 4개(통합·개인·대표·담당) */
  .nav a.nav-child{padding:9px 13px 9px 30px;font-size:14px;margin-bottom:1px}
  .nav a.nav-child .dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.4);flex:none;margin-right:6px;transition:all .15s}
  .nav a.nav-child.on .dot{background:#E6AE60;box-shadow:0 0 0 3px rgba(241,166,53,.25)}
  .nav a.nav-child.on::before{display:none}
  .nav a.nav-child .cnt{min-width:18px;height:18px;font-size:10px}
  /* v122: 권한(authorize) 메뉴 자물쇠 아이콘 — 관리자·3차 평가자 등 게이트 메뉴 표시 */
  .nav a .auth-lock{margin-left:auto;width:13px;height:13px;flex:none;stroke:#f3c33f;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
  .nav-sub.hr-sub.open{max-height:900px}
  .nav-sub.eappr-sub.open{max-height:400px}
  .nav-sub.vault-sub.open{max-height:520px}
  /* 인사평가: 실제 앱 사이드바 구조(자기평가/평가·검토/관리) 재현 */
  .nav a.hr-grp{display:flex;align-items:center;gap:8px;padding:8px 12px 4px 16px;font-size:11px;font-weight:600;letter-spacing:.03em;color:rgba(255,255,255,.5);cursor:pointer;margin-top:2px}
  .nav a.hr-grp:hover{color:rgba(255,255,255,.8)}
  .nav a.hr-grp .ic-g{width:14px;height:14px;flex:none;stroke:currentColor;fill:none;stroke-width:1.9}
  .nav a.hr-grp .gchev{margin-left:auto;width:13px;height:13px;flex:none;stroke:currentColor;fill:none;stroke-width:2.2;transition:transform .2s;transform:rotate(180deg)}
  .nav a.hr-grp.closed .gchev{transform:rotate(0deg)}
  .hr-grp-body{overflow:hidden;max-height:240px;transition:max-height .22s ease}
  .hr-grp-body.closed{max-height:0}
  .nav .hr-grp-body a.nav-child{padding-left:34px}
  .nav a.nav-child .ic-c{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.9;margin-right:9px}
  /* 하부 아이콘: 부모 그룹색 톤다운 상속 + 호버/활성 시 점등 */
  /* v125 작업반영(①A-2): 하위 트리 아이콘 = 부모 메뉴 색 상속 — 12색 리팔레트와 동기화 */
  .nav .rev-sub a.nav-child .ic-c{stroke:#5cc3e8}    /* 매출 현황 · 시안 */
  .nav .eappr-sub a.nav-child .ic-c{stroke:#ecc04f}  /* 전자결재 · 골드 */
  .nav .hr-sub a.nav-child .ic-c{stroke:#f5a06a}     /* 인사평가 · 오렌지 */
  .nav .gumae-sub a.nav-child .ic-c{stroke:#ea89c3}  /* 구매 · 핑크 */
  .nav .mat-sub a.nav-child .ic-c{stroke:#c3d05a}    /* 자재관리 · 라임 */
  .nav .vault-sub a.nav-child .ic-c{stroke:#4fd6c3}  /* 사업부 자료실 · 아쿠아 */
  .nav .nav-sub a.nav-child .ic-c{opacity:.45;transition:opacity .15s}
  .nav .nav-sub a.nav-child:hover .ic-c{opacity:.8}
  .nav .nav-sub a.nav-child.on .ic-c{opacity:1;filter:brightness(1.15)}
  /* '새 결재 작성' 강조 (주요 액션) */
  .nav a#navWrite{color:#FBD08A;font-weight:800;background:rgba(241,166,53,.14)}
  .nav a#navWrite .ic-c{stroke:#FBD08A;stroke-width:2.4;opacity:1}
  .nav a#navWrite:hover{background:rgba(241,166,53,.24);color:#FFE2AC}
  .nav a#navWrite:hover .ic-c{stroke:#FFE2AC}
  .nav a.nav-child{padding:9px 13px 9px 22px}
  .nav a#hrParent.parent-on .ic{color:#fff}
  /* 인사평가 임베드 호스트 */
  .hr-host{flex:1;min-height:0;display:none;background:var(--bg)}
  .hr-host.show{display:flex;flex-direction:column}   /* [v192] 배너 + iframe 세로 배치 */
  .hr-host iframe{width:100%;flex:1;min-height:0;border:0;display:block;background:var(--bg)}
  /* [v192 평가 소유권 표시] 평가라인 관리자 배너 — iframe 위 호스트 영역 */
  .hr-owner{flex:none;padding:11px 18px;font-size:12.5px;line-height:1.65;color:#3D4A5C;
            background:var(--sea-tint,#EFF4FB);border-bottom:1px solid rgba(var(--sea-rgb,27,111,245),.2)}
  .hr-owner b{font-weight:800;color:var(--navy-deep,#1F3864)}
  .hr-owner.mine{background:#EAF6EF;border-bottom-color:#CBE5D6}
  .hr-owner.mine b{color:#1E6B43}
  .hr-owner.warn{background:#FFF6E8;border-bottom-color:#F0DBB4}
  .hr-owner.warn b{color:#8A5A12}
  .hr-owner-list{display:block;margin-top:5px;font-size:11.5px;color:#6B7A90}
  .hr-owner-ro{color:#8A94A6;font-weight:700}
  /* [2026-10-02 검증] 관리자 배너는 접어서 한 줄 — 펼치면 설명·사업부별 3차 평가자 목록(모바일에서 첫 화면 절반을 덮던 띠) */
  .hr-owner{padding-top:8px;padding-bottom:8px}
  .hr-owner-d>summary{cursor:pointer;list-style:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hr-owner-d>summary::-webkit-details-marker{display:none}
  .hr-owner-d>summary::after{content:' ▾ 펼치기';font-size:11px;font-weight:700;color:#8A94A6}
  .hr-owner-d[open]>summary::after{content:' ▴ 접기'}
  .hr-owner-d[open]>summary{white-space:normal}
  .hr-owner-why{display:block;margin-top:4px}

  /* 화면 상단 유형 전환 탭 */
  .wf-tabs{display:flex;gap:6px;background:var(--line-soft);border:1px solid var(--line);border-radius:13px;padding:5px;margin-bottom:18px;max-width:520px}
  .wf-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;border:none;background:transparent;border-radius:9px;padding:10px 14px;font-size:14px;font-weight:700;color:var(--ink-soft);cursor:pointer;font-family:inherit;transition:all .15s}
  .wf-tab svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.9;flex:none}
  .wf-tab:hover{color:var(--ink)}
  .wf-tab.on{background:var(--panel);color:var(--navy);box-shadow:var(--shadow-sm)}
  .wf-tab .tg{font-size:9px;font-weight:800;color:#fff;background:var(--ok);border-radius:5px;padding:1px 5px;margin-left:2px}

  .me{padding:14px;border-top:1px solid rgba(255,255,255,.1);display:flex;align-items:center;gap:11px}
  .me .me-profile{display:flex;align-items:center;gap:11px;flex:1;min-width:0;cursor:pointer;padding:6px;margin:-6px;border-radius:9px;transition:background .15s}
  .me .me-profile .info{flex:1}
  .me .me-gear{width:15px;height:15px;fill:none;stroke:rgba(255,255,255,.55);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none;opacity:0;transition:opacity .15s}
  .me .me-profile:hover .me-gear{opacity:1}
  .me .av{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-weight:700;font-size:14px;flex:none}
  .me .info{line-height:1.35;min-width:0}
  .me .info b{font-size:14px;display:block}
  .me .info span{font-size:11px;color:rgba(255,255,255,.55);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .me select{
    margin-top:0;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff;
    border-radius:8px;padding:5px 7px;font-size:11px;font-family:inherit;max-width:100%;cursor:pointer
  }
  .me select option{color:#222}

  /* ===== MAIN ===== */
  .main{min-width:0;display:flex;flex-direction:column}
  .topbar{
    background:#1B2536;padding:0 30px;height:92px;
    display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:20;color:#fff;
  }
  .topbar h1{font-size:18px;font-weight:800;letter-spacing:.01em;color:#fff}
  .topbar .crumb{font-size:12px;color:rgba(255,255,255,.55);margin-left:2px}
  .topbar .spacer{flex:1}
  .topbar .demo-tag{
    font-size:11px;font-weight:700;color:#ffb3a0;background:rgba(239,90,60,.16);
    border:1px solid rgba(239,90,60,.45);padding:5px 11px;border-radius:20px;letter-spacing:.03em
  }
  /* [v151] 웹메일 외부링크 제거 — 내장 메일 뷰로 대체(진권 지시) */

  .content{padding:28px 30px 60px;flex:1;overflow-y:auto}
  .view{animation:fade .3s ease}
  @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  /* ===== [v150] 그린/화이트 스코프 — 워크스페이스·오늘의 작업·메일 뷰 전용. CSS 변수 서브트리 상속으로 본문만 리컬러(전역 :root·사이드바·탑바·타 뷰 불변) ===== */
  #content.gw{
    --bg:#F6F8F7; --panel:#FFFFFF;
    --ink:#131B16; --ink-soft:#3A4740; --ink-faint:#65726B;   /* [v151 선명화2] 삼성 벤치마크 */
    --line:#E3EAE5; --line-soft:#EFF3F0;
    --navy:#1B6FF5; --navy-2:#5C9BFF; --navy-deep:#0D57D6;
    --accent:#E07258; --gold:#E2A35D;
    background:#F6F8F7;
  }
  /* ===== [v151 워크스페이스] 3칸 랜딩 — 목업 패밀리(전자결재_3칸) 문법: 사이드바=1칸, 피드=2칸, 요약=3칸 ===== */
  @media(max-width:1100px){}
  .ws3-srch{position:relative;margin-top:9px}
  .ws3-srch input{width:100%;border:1px solid var(--line);border-radius:9px;padding:8px 12px 8px 30px;font-size:13.5px;font-family:inherit;outline:none;background:#F7FAF8;color:var(--ink)}
  .ws3-srch input:focus{border-color:var(--navy-2);background:#fff}
  .ws3-srch svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;stroke:var(--ink-faint);fill:none;stroke-width:2}
  .ws3-empty{padding:36px 16px;text-align:center;color:var(--ink-faint);font-size:13.5px;line-height:1.7}
  @media(max-width:1400px){}
  /* ===== [v151 메일] 3칸 아웃룩 — 메일_3칸 목업 이식(그린/화이트) ===== */
  .mailv-grid{display:grid;grid-template-columns:minmax(280px,var(--mailw,640px)) 6px minmax(420px,1fr);gap:8px;align-items:start}   /* [2026-09-30 메일 화면 A·B·C] 기본 = 드래그 최대 640px(개인·대표 공통) · 읽기 칸은 420px 밑으로 안 줄고 목록이 줄어든다 */   /* [2026-09-20] 기본 폭 380→420 (진권: 지금 쓰는 폭을 기본으로) */   /* [v151 메일풀셋] 드래그 리사이즈 — 너비는 PC별 기억 */
  .mailv-split{width:6px;align-self:stretch;cursor:col-resize;border-radius:4px;transition:background .15s}
  .mailv-split:hover,.mailv-split.on{background:#C4E0D1}
  @media(max-width:1100px){.mailv-grid{grid-template-columns:1fr}.mailv-split{display:none}}
  .mailv-mid{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
  .mailv-mh{padding:14px 16px 10px;border-bottom:1px solid var(--line-soft)}
  .mailv-mh h2{font-size:15.5px;font-weight:800;display:flex;align-items:center;gap:8px}
  .mailv-mh h2 .scope{font-size:10.5px;font-weight:800;background:#E6F6EC;color:var(--navy-deep);padding:2px 9px;border-radius:20px}
  .mailv-addr{font-size:11.5px;color:var(--ink-faint);margin-top:3px}
  .mailv-divtabs{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}
  .mailv-divtabs:empty{display:none}   /* [2026-09-29] 개인·합본(사업부 탭 없음)에서 빈 줄 여백 제거 */
  .mailv-divtab{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:20px;padding:4px 11px;font-size:11.5px;font-weight:700;cursor:pointer;font-family:inherit;color:var(--ink-soft)}
  .mailv-divtab .d{width:7px;height:7px;border-radius:50%;flex:none}
  .mailv-divtab.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .mailv-divtab.on .d{background:#fff!important}
  .mailv-divtab.locked{opacity:.45}
  .mailv-fresh{display:flex;align-items:flex-start;gap:8px;margin-top:10px;font-size:11.5px;line-height:1.5;color:var(--ink-faint)}   /* [v151 메일헤더] 글씨 확대+줄바꿈 정리 · [2026-09-29] 상태 문구만 — 길면 문구 안에서 줄바꿈 */
  .mailv-fresh .d{width:6px;height:6px;border-radius:50%;background:var(--navy);flex:none;margin-top:6px}
  .mailv-fresh span{min-width:0}
  /* [2026-09-29] 버튼 줄 — 왼쪽 묶음(연동·알림 규칙·편지함 담당) + .sp + 오른쪽 🔄. 좁으면 왼쪽 묶음째 줄바꿈(버튼마다 margin-left:auto 로 떠다니던 것 제거) */
  .mailv-acts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:8px}
  .mailv-acts .sp{flex:1 1 0;min-width:0}
  .mailv-acts button{border:1px solid var(--line);background:#fff;border-radius:9px;font-size:12px;font-weight:700;color:var(--navy-deep);padding:6px 12px;cursor:pointer;font-family:inherit;flex:none;white-space:nowrap}
  .mailv-chips{display:block;margin-top:2px}   /* [2026-09-30 메일 화면 A·B·C] 칩 줄은 묶음(.mailv-gch)이 가진다 */   /* [2026-09-20] 좁은 폭에서 칩이 찌그러지지 않게 줄바꿈 */
  .mailv-chip{flex:1 1 0;min-width:72px;text-align:center;border:1px solid var(--line);background:#fff;border-radius:10px;padding:7px 4px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;color:var(--ink-soft)}   /* [v151 메일헤더] 균등 컬럼 정렬+아이콘 */
  .mailv-chip.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .mailv-list{max-height:calc(100vh - 380px);overflow-y:auto;padding:6px 8px 10px}
  .mailv-it{position:relative;padding:11px 12px 11px 22px;border-radius:12px;cursor:pointer;margin-bottom:2px}
  .mailv-it:hover{background:#F2F7F3}
  .mailv-it.on{background:#E6F6EC}
  .mailv-it.unread::before{content:"";position:absolute;left:9px;top:16px;width:7px;height:7px;border-radius:50%;background:var(--navy)}
  .mailv-it .r1{display:flex;align-items:center;gap:7px;font-size:13.5px}   /* [v151] 100% 가독 업 */
  .mailv-it .r1 .from{font-weight:800;flex:none}
  .mailv-it.unread .r1 .from{color:var(--ink)}
  .mailv-it .r1 .cli{font-size:9.5px;font-weight:800;background:#E8F0FE;color:#5D89D4;padding:1px 7px;border-radius:20px;flex:none}
  .mailv-it .r1 .date{margin-left:auto;color:var(--ink-faint);font-size:11px;flex:none}
  .mailv-it .subj{font-size:14px;font-weight:700;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* [v151] 100% 가독 업 */
  .mailv-it .prev{font-size:12px;color:var(--ink-soft);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.9}
  /* [v151 선명화2] 읽음 구분 = 아웃룩식 "굵기" (색칠 회색 폐기 — 전체 흐릿의 주범이었음. 삼성 벤치마크: 본문은 검정, 위계는 굵기) */
  .mailv-it.unread .subj{font-weight:800}
  .mailv-it.unread .r1 .from{font-weight:800}
  .mailv-it:not(.unread):not(.sent) .subj{color:var(--ink);font-weight:500}
  .mailv-it:not(.unread):not(.sent) .r1 .from{color:var(--ink-soft);font-weight:600}
  .mailv-it:not(.unread):not(.sent) .prev{opacity:.85}
  .mailv-it:not(.unread):not(.sent) .r1 .cli{opacity:.8}
  .mailv-it.sent.read .subj{color:var(--ink);font-weight:500}
  .mailv-it.sent.read .r1 .from{color:var(--ink-soft);font-weight:600}
  .mailv-it.sent.read .prev{opacity:.85}
  .mailv-more{display:block;width:100%;margin:6px 0 10px;padding:8px;border:1px dashed var(--line);border-radius:10px;background:none;color:var(--ink-soft);font:inherit;font-size:12px;font-weight:700;cursor:pointer}   /* [v279] 보낸함 더 보기(서버 페이지) */
  .mailv-more:disabled{opacity:.5;cursor:default}
  .mailv-it .mm{display:flex;gap:5px;margin-top:5px;font-size:10px;align-items:center;flex-wrap:wrap}   /* [v151] 아이콘 벌어짐 수정 — 균일 미니 pill로 */
  .mailv-it .mm>span{display:inline-flex;align-items:center;gap:3px;background:var(--line-soft);border-radius:20px;padding:2px 8px;flex:none;line-height:1.5}
  .mailv-it .mm .att{color:var(--ink-soft)}
  .mailv-it .mm .miss{color:#C96455;font-weight:800;background:#FBF0EE}
  /* ═══ [LAB 담당] 편지함 칩 · 담당 배지 · 상세 담당바 · 편지함 담당 모달 — 색은 계절색 변수(--navy 계열·ink·line)만, 파랑 하드코딩 없음 ═══ */
  .mailv-fchips{display:block}   /* [2026-09-30 메일 화면 A·B·C] 편지함(B)·담당(C) 묶음을 세로로 */   /* [2026-09-20] 위 칩 줄과 간격·모양 통일 */
  .mailv-fchips:empty{display:none}
  .mailv-fchips .sep{width:1px;height:14px;background:var(--line);margin:0 2px}
  /* [2026-09-30 메일 화면 A·B·C] 필터 묶음(A 보기 · B 메일서버 편지함 · C 담당) — 왼쪽 작은 이름표 + 묶음 사이 구분선 · 편지함 통수는 따로 된 숫자 배지 */
  .mailv-chips:empty{display:none}
  .mailv-fgrp{display:grid;grid-template-columns:88px minmax(0,1fr);gap:8px;align-items:start;margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
  .mailv-glbl{font-size:10.5px;font-weight:800;line-height:1.3;color:var(--ink-faint);padding-top:7px;white-space:nowrap}   /* 「메일서버 편지함」이 두 줄로 꺾이지 않게 — 세 묶음 이름표 폭을 88px 로 같이 */
  .mailv-gch{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
  .mailv-fchip .fn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}
  .mailv-fchip .cnt{flex:none;min-width:22px;padding:0 7px;border-radius:999px;background:var(--line-soft);border:1px solid var(--line);color:var(--ink);font-size:10.5px;font-weight:800;line-height:16px;text-align:center;font-variant-numeric:tabular-nums}
  .mailv-fchip.on .cnt{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.35);color:#fff}
  .mailv-fchip.off{opacity:.42;cursor:not-allowed}
  .mailv-fchip{border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px 10px;font-size:11.5px;font-weight:700;color:var(--ink-soft);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:5px;line-height:1.45}   /* [2026-09-20] 알약→사각(위 칩과 같은 계열) · 높이 맞춤 */
  .mailv-fchip b{font-weight:800;color:var(--ink)}
  .mailv-fchip small{font-size:10px;font-weight:600;color:var(--ink-faint)}
  .mailv-fchip.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .mailv-fchip.on b,.mailv-fchip.on small{color:#fff}
  .mailv-it .r1 .asg,.mailv-it .r1 .mbox{font-size:9.5px;font-weight:800;padding:1px 7px;border-radius:20px;flex:none;background:var(--line-soft);color:var(--ink-soft);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mailv-it .r1 .asg.done{opacity:.55}
  .mailv-it .r1 .mbox{color:var(--navy-deep)}
  /* [2026-10-07 담당 메일] Works 회신 배지 · 상세 처리 상태 줄(회신·처리 완료 — 누가·언제) */
  .mailv-it .r1 .rpl{font-size:9.5px;font-weight:800;padding:1px 7px;border-radius:20px;flex:none;background:var(--line-soft);color:var(--navy-deep);white-space:nowrap}
  .mailv-asgst{display:flex;gap:6px 14px;flex-wrap:wrap;margin-top:6px;font-size:12px;color:var(--ink-soft)}
  /* [2026-10-07] 담당 줄 한 줄 — 근거 칩은 남는 폭만큼만(넘치면 잘림 · 전체는 툴팁) · 버튼(👍 맞아요 · ✅ 처리완료)은 같은 모양(아이콘·글자 가운데 맞춤)으로 오른쪽 끝에 붙는다 ·
     좁은 화면(700px 이하)만 줄바꿈 */
  .mailv-asgbar{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;margin-top:12px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--line-soft);font-size:12.5px;min-width:0}
  .mailv-asgbar>b,.mailv-asgbar select,.mailv-asgbar .src{flex:none;white-space:nowrap}
  .mailv-asgbar .mtool{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:4px;height:28px;padding:0 10px;border:1px solid var(--line);border-radius:8px;
    background:#fff;color:var(--ink);font-family:inherit;font-size:12px;font-weight:700;line-height:1;white-space:nowrap;cursor:pointer}
  .mailv-asgbar .mtool:hover{background:var(--line-soft)}
  .mailv-asgbar .mtool:disabled{opacity:.55;cursor:default}
  .mailv-asgbar .mailv-why{flex:1 1 auto;min-width:0;flex-wrap:nowrap;overflow:hidden}
  .mailv-asgbar .mailv-why em{white-space:nowrap}
  @media (max-width:700px){ .mailv-asgbar{flex-wrap:wrap} .mailv-asgbar .mailv-why{flex-basis:100%;flex-wrap:wrap} }
  body[data-theme="dark"] .mailv-asgbar .mtool{background:rgba(255,255,255,.06);color:var(--ink-soft);border-color:var(--line)}
  .mailv-asgbar select,.mfr-table select{font:inherit;font-size:12.5px;padding:4px 8px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}
  .mailv-asgbar .src{color:var(--ink-faint);font-weight:600}
  .mailv-asgbar .mtool{margin-left:auto}
  .mfr-table{width:100%;border-collapse:collapse;font-size:13px}
  .mfr-table td{padding:7px 6px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
  .mfr-table td small{display:block;font-size:11px;color:var(--ink-faint);font-weight:600}
  .mfr-table select{min-width:150px}
  .mfr-sug{font-size:12px;white-space:nowrap}
  /* ═══ [2026-09-29 메일 자동분류] 근거 칩 · 💡 추천 · 🧭 담당 분류 모달 — 색은 토큰만(파랑 리터럴 없음) · 다크모드는 아래 body[data-theme="dark"] ═══ */
  .mailv-it .r1 .asg.sug{opacity:.62;background:transparent;border:1px dashed var(--line)}   /* [2026-10-03] 기울임 뺌 — Pretendard 는 기울임꼴이 없어 브라우저가 억지로 비틀었다(점선·흐림으로 「추천」 구분은 그대로) */
  .mailv-it .r1 .asg.out{background:transparent;color:var(--ink-faint);border:1px solid var(--line-soft)}
  .mailv-asgbar .mtool+.mtool{margin-left:0}
  .mailv-why{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:11px}
  .mailv-why i{font-style:normal;font-weight:800;color:var(--ink-soft)}
  .mailv-why em{font-style:normal;font-weight:700;padding:1px 8px;border-radius:20px;background:var(--panel);border:1px solid var(--line);color:var(--ink-soft)}
  .mailv-sugline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;padding:7px 12px;border:1px dashed var(--line);border-radius:10px;font-size:12.5px;color:var(--ink-soft)}
  .mailv-sugline b{color:var(--ink)}
  .mcls-stats{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px;padding:9px 12px;border-radius:10px;background:var(--line-soft);font-size:12.5px;color:var(--ink-soft)}
  .mcls-stats b{color:var(--ink);font-weight:800}
  .mcls-stats .mtool{margin-left:auto}
  .mcls-h{margin:14px 0 6px;font-size:13px;font-weight:800;color:var(--ink)}
  .mcls-h small{font-size:11px;font-weight:600;color:var(--ink-faint);margin-left:6px}
  .mcls-table{width:100%;border-collapse:collapse;font-size:12.5px}
  .mcls-table th{text-align:left;font-size:11px;color:var(--ink-faint);font-weight:700;padding:4px 6px;border-bottom:1px solid var(--line)}
  .mcls-table td{padding:6px;border-bottom:1px solid var(--line-soft);vertical-align:middle;word-break:break-all}
  .mcls-table td small{color:var(--ink-faint);font-weight:600}
  .mcls-table td.acts{white-space:nowrap;text-align:right}
  .mcls-table td.acts .mtool{font-size:11.5px;padding:3px 8px;margin-left:4px}
  .mcls-pinned{font-size:11px;font-weight:800;color:var(--ok-ink)}
  .mcls-rule{display:flex;align-items:center;gap:8px;padding:6px 2px;border-bottom:1px solid var(--line-soft);font-size:12.5px}
  .mcls-rule.off{opacity:.55}
  .mcls-rule small{color:var(--ink-faint);font-weight:600}
  .mcls-rule .mtool{margin-left:auto;font-size:11.5px;padding:3px 8px}
  .mcls-kind{flex:none;font-size:10.5px;font-weight:800;padding:1px 8px;border-radius:20px;background:var(--line-soft);color:var(--ink-soft)}
  .mcls-none{font-size:12px;color:var(--ink-faint);padding:4px 2px}
  .mcls-add{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
  .mcls-add select,.mcls-add input{font:inherit;font-size:12.5px;padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink)}
  .mcls-add input{flex:1;min-width:160px}
  .mcls-blocks{margin-top:12px;font-size:12.5px;color:var(--ink-soft)}
  .mcls-blocks summary{cursor:pointer;font-weight:700}
  .mm-sub.mm-note{color:var(--ink);font-weight:600}
  .mailv-det{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-height:420px}
  .mailv-ds{flex:1;padding:22px 26px}
  /* [2026-09-29] 개인·대표 기본 크기 통일 — 종전엔 목록 칸 = 헤더 높이 + 목록(100vh-380px)이라 헤더가 짧은 개인메일은 칸이 짧고
     대표메일은 화면 밖까지 길었으며, 상세 칸은 min-height 420px 짜리 따로 노는 카드였다.
     → 2단(1101px 이상)에선 두 칸 모두 같은 높이(화면에 맞춤)로 시작하고, 목록은 헤더를 뺀 나머지를 채운다(헤더 높이와 무관).
     긴 메일은 종전처럼 상세 칸이 늘어난다(min-height). 1100px 이하(1단)는 아래 [v250] 규칙 그대로 */
  @media(min-width:1101px){
    .mailv-grid{align-items:stretch}
    .mailv-mid{display:flex;flex-direction:column;height:max(480px,calc(100vh - 140px))}
    .mailv-mh{flex:none}
    .mailv-list{flex:1 1 auto;min-height:0;max-height:none}
    /* [2026-10-09 사용자 결정] 상세 칸도 목록과 같은 높이(화면에 맞춤)로 고정하고 안에서 스크롤 — 종전엔 긴 메일이면 상세 칸만 페이지째 늘어나
       목록 칸이 위에서 끝나 아래가 비어 보였다 · 아래 회신 막대(mailActbar)도 늘 화면 안에 */
    .mailv-det{height:max(480px,calc(100vh - 140px));min-height:0}
    .mailv-ds{overflow-y:auto;min-height:0}
  }
  .mailv-empty{padding:80px 20px;text-align:center;color:var(--ink-faint);font-size:14px;line-height:1.8}
  .mailv-subj{font-size:19px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
  .mailv-subj .cli{font-size:10px;font-weight:800;background:#E8F0FE;color:#5D89D4;padding:2px 9px;border-radius:20px}
  .mailv-fromline{display:flex;align-items:center;gap:10px;margin-top:13px;padding-bottom:13px;border-bottom:1px solid var(--line-soft)}
  .mailv-av{width:34px;height:34px;border-radius:50%;background:#E6F6EC;color:var(--navy-deep);font-weight:800;font-size:14px;display:grid;place-items:center;flex:none}
  .mailv-fn{font-size:14px;font-weight:800}
  .mailv-fe{font-size:11.5px;color:var(--ink-faint)}
  .mailv-fd{margin-left:auto;font-size:11.5px;color:var(--ink-faint)}
  .mailv-body{font-size:15px;line-height:1.85;margin-top:15px;white-space:pre-wrap;color:var(--ink)}   /* [v160 메일UI] 본문 14→15px (진권: 여전히 작다 — 메일은 읽는 양이 많아 본문만 한 단계 더) */
  /* [2026-10-07 서식 보기] 서식 본문 = 흰 종이 카드(다크 모드에서도 흰 바탕 — 보낸 사람 색·로고가 그대로 보이게 · 색 뒤집기 안 함) · 받는 중·실패 한 줄 안내 */
  .mailv-htmlwrap{margin-top:15px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
  .mailv-html{display:block;width:100%;border:0;min-height:60px;background:#fff}
  /* [2026-10-07 대용량 첨부] 카드 — 첨부 줄과 같은 모양 · 기한·보관 상태는 작게 */
  .mailv-bf{margin-top:12px}
  .mailv-bf .bf-row{flex-wrap:wrap;gap:6px 10px}
  .mailv-bf .bf-exp{font-size:12px;color:var(--ink-faint);white-space:nowrap}
  .mailv-bf .bf-link{font-size:12px;font-weight:700;color:var(--navy-deep);white-space:nowrap;text-decoration:none}
  .mailv-bf .bf-ok{font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap}
  .mailv-bf .bf-busy{font-size:12px;color:var(--ink-soft);white-space:nowrap}
  .mailv-bf .bf-err{font-size:11.5px;color:var(--accent-ink);flex-basis:100%}
  .mailv-bf .bf-sum{cursor:pointer;padding:6px 0;font-size:12.5px;color:var(--ink-faint);font-weight:600}
  .mailv-bfnote{padding:8px 13px;font-size:12.5px;line-height:1.55;color:var(--ink-faint)}
  .mailv-atts{margin-top:16px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
  .mailv-ah{font-size:11px;font-weight:800;color:var(--ink-soft);background:#F7FAF8;padding:7px 13px;border-bottom:1px solid var(--line-soft)}
  .mailv-att{display:flex;align-items:center;gap:9px;padding:9px 13px;font-size:13.5px;border-bottom:1px solid var(--line-soft)}
  .mailv-att:last-child{border-bottom:none}
  .mailv-att .an{font-weight:700}
  .mailv-att .asz{color:var(--ink-faint);font-size:11px}
  .mailv-att .tosite{margin-left:auto;border:1px solid var(--navy);background:#fff;color:var(--navy-deep);border-radius:8px;font-size:11px;font-weight:800;padding:4px 10px;cursor:pointer;font-family:inherit}
  .mailv-att .tosite:hover{background:#E6F6EC}
  .mailv-hint{margin-top:10px;font-size:11.5px;color:var(--navy-deep);background:#EFF6F1;border:1px solid #D8E8DD;border-radius:10px;padding:8px 12px}
  .mailv-actbar{border-top:1px solid var(--line-soft);padding:11px 16px;display:flex;align-items:center;gap:8px}
  .mailv-actbar .note{font-size:11px;color:var(--ink-faint);margin-right:auto}
  .mailv-abtn{border:1px solid #C4E0D1;background:#fff;color:var(--navy-deep);border-radius:10px;padding:8px 15px;font-size:13.5px;font-weight:800;cursor:pointer;font-family:inherit}
  .mailv-abtn.pri{background:var(--navy);border-color:var(--navy);color:#fff}
  .mailv-actbar .note{min-width:0;flex:1 1 auto}   /* [2026-09-30 메일 화면 A·B·C] 읽기 칸 최소 420px — 안내 글은 줄바꿈하고 */
  .mailv-abtn{flex:none;white-space:nowrap}   /* 전달·회신 버튼은 안 잘린다 */
  .mailv-compose{position:fixed;right:26px;bottom:26px;width:430px;max-width:calc(100vw - 40px);background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 24px rgba(24,36,32,.14),0 30px 70px rgba(24,36,32,.18);z-index:420;display:none;overflow:hidden}
  .mailv-compose.show{display:block}
  .mailv-cph{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-soft);font-size:14px;font-weight:800;background:#F7FAF8}
  .mailv-cph .x{margin-left:auto;border:none;background:none;font-size:16px;color:var(--ink-faint);cursor:pointer}
  .mailv-cpb{padding:13px 16px}
  .mailv-cpfrom{font-size:11.5px;color:var(--ink-soft);background:#F7FAF8;border:1px solid var(--line-soft);border-radius:9px;padding:7px 11px}
  .mailv-cpfrom .real{color:#A57F3B;font-weight:800}
  .mailv-cpb input,.mailv-cpb textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:8px 11px;font-size:13.5px;font-family:inherit;outline:none;margin-top:8px;color:var(--ink);background:#fff}
  .mailv-cpb input:focus,.mailv-cpb textarea:focus{border-color:var(--navy-2)}
  .mailv-cpb textarea{min-height:110px;resize:vertical;line-height:1.6}
  .mailv-cpsign{font-size:10.5px;color:var(--ink-faint);margin-top:7px;line-height:1.5}
  .mailv-cpf{display:flex;gap:8px;padding:0 16px 14px}
  .mailv-cpf .send{background:var(--navy);color:#fff;border:none;border-radius:10px;padding:9px 18px;font-size:13.5px;font-weight:800;cursor:pointer;font-family:inherit}
  .mailv-cpf .draft{background:#fff;color:var(--ink-soft);border:1px solid var(--line);border-radius:10px;padding:9px 14px;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}

  /* ===== SHARED COMPONENTS ===== */
  .card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm)}
  .badge{font-size:11px;font-weight:800;padding:3px 9px;border-radius:20px;letter-spacing:.02em;white-space:nowrap;display:inline-block}
  .b-prog{background:var(--sea-tint,#e8eefa);color:var(--navy-deep)}
  .b-ok{background:var(--ok-soft);color:var(--ok-ink)}
  @keyframes freshFade{ from{background:var(--ok-soft)} to{background:transparent} }   /* [v128 라이브갱신] */
  .dl tbody tr.row-fresh{ animation:freshFade 2.4s ease-out; box-shadow:inset 3px 0 0 var(--ok) }
  /* [v151] 멀티탭(v128) 완전 제거 — 진권 지시. 구현 필요 시 v150 이전 백업본 참조 */
  /* [v128 퍼스펙티브] 사무/경영 보기 모드 — 사이드바 상단 스위처, nav 링크와 동일 문법으로 배경에 융화 */
  /* [v172 퍼스펙티브 삭제] 구 [v128] 보기 모드(전체/사무/경영) 3버튼 CSS 전량 제거 — 진권 확정.
     제거 사유: ① 권한이 아니라 '메뉴 숨김'일 뿐이고, 실제 접근 통제는 v164 마스킹 등급
     (maskTier/maskCan)이 이미 담당한다 = 중복. ② 경영 모드는 구매·자재·자료실·경비/차량·공지·
     공용·일정 7개를 숨겨서, 켜는 순간 대표가 일정·공지를 못 보는 역효과가 났다.
     ③ 선택이 localStorage에 남아 한 번 켜면 계속 유지 → "메뉴가 사라졌다" 문의를 유발한다. */
  @media (prefers-reduced-motion:reduce){ .dl tbody tr.row-fresh{ animation:none; box-shadow:inset 3px 0 0 var(--ok) } }
  .b-rej{background:var(--accent-soft);color:var(--accent-ink)}
  .b-draft{background:#eef0f4;color:var(--ink-soft)}

  /* ===== [v152 결재3칸] 받은 결재함 = 목록+상세 2패널 (전자결재 3칸 목업 이식, 셀렉터 ibx3-* 격리) ===== */
  .ibx3-grid{display:grid;grid-template-columns:var(--ibx3w,456px) 6px 1fr;gap:8px;align-items:start}   /* 드래그 리사이즈 — PC별 기억 · [2026-10-16 사용자 「왼쪽 목록 20% 더」] 기본 380 → 456px(결재함·공지 공용) */
  .ibx3-split{width:6px;align-self:stretch;cursor:col-resize;border-radius:4px;transition:background .15s}
  .ibx3-split:hover,.ibx3-split.on{background:#C4E0D1}
  .ibx3-list-pane{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
  .ibx3-lh{padding:14px 14px 10px;border-bottom:1px solid var(--line-soft)}
  .ibx3-tabs{margin-bottom:10px}
  .ibx3-srch input{width:100%}
  .ibx3-selall{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-faint);font-weight:600;margin-top:9px;cursor:pointer}
  .ibx3-slist{max-height:calc(100vh - 320px);min-height:200px;overflow-y:auto;padding:7px}
  /* [v175 감사수정] 이 클래스는 내 문서함·임시저장함·처리완료 탭까지 공유한다.
     뷰 줄 때문에 320→356으로 바꿨더니 뷰 줄이 없는 화면 5곳의 목록까지 36px 짧아졌다.
     → 뷰 줄이 실제로 있을 때만 스코핑해서 깎는다. */
  .ibx3-list-pane.has-views .ibx3-slist{max-height:calc(100vh - 356px)}
  /* ===== [v175 스마트뷰] 받은 결재함 — 미리 만들어 둔 시선 5종 =====
     좌측에 칸을 새로 만들면 사이드바 270px 고정 때문에 상세 패널이 365px로 찌그러진다(실측).
     그래서 목록 헤더에 한 줄로 넣되, 배지 숫자로 상황이 즉시 보이게 하는 C안의 핵심은 그대로 살린다. */
  .ibx3-views{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:9px}
  .ibx3-vw{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:4px 9px 4px 8px;font-size:11.5px;font-weight:700;color:var(--ink-soft);cursor:pointer;user-select:none;transition:background .13s,border-color .13s,color .13s}
  .ibx3-vw:hover{border-color:var(--navy-2)}
  .ibx3-vw.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .ibx3-vw .n{font-size:10.5px;font-weight:800;padding:0 5px;border-radius:999px;background:var(--line-soft);color:var(--ink-faint);min-width:17px;text-align:center}
  .ibx3-vw.on .n{background:rgba(255,255,255,.26);color:#fff}
  .ibx3-vw.alert .n{background:var(--accent);color:#fff}
  .ibx3-vw.alert.on .n{background:rgba(255,255,255,.26);color:#fff}
  .ibx3-vw.zero{opacity:.5}
  .ibx3-it{position:relative;display:flex;gap:9px;align-items:flex-start;padding:11px 12px 11px 17px;border-radius:11px;cursor:pointer;margin-bottom:3px;transition:background .12s}
  .ibx3-it:hover{background:#f4f7f5}
  .ibx3-it.on{background:#e6f6ec}
  .ibx3-it::before{content:"";position:absolute;left:6px;top:13px;bottom:13px;width:3.5px;border-radius:3px;background:var(--dvc,var(--line))}
  .ibx3-it .bulkCk{margin-top:3px;flex:none}
  .ibx3-it .b{flex:1;min-width:0}
  .ibx3-it .r1{font-size:14px;font-weight:700;display:flex;align-items:center;gap:7px}
  .ibx3-it .r1 .st{margin-left:auto;flex:none;font-weight:700}
  .ibx3-it .r2{font-size:12px;color:var(--ink-faint);margin-top:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  .ibx3-it .r2 .amt{margin-left:auto;font-weight:700;color:var(--ink-soft);font-variant-numeric:tabular-nums}
  .ibx3-mine{color:var(--navy-deep);font-weight:700;flex:none}
  .ibx3-ag{font-size:11px;font-weight:800;color:var(--ink-faint)}
  .ibx3-ag.a3{color:var(--warn-ink)} .ibx3-ag.a5{color:var(--accent-ink)}
  .ibx3-none{padding:44px 16px;text-align:center;color:var(--ink-faint);font-size:13px}
  .ibx3-det-pane{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-height:420px}
  .ibx3-det{max-height:calc(100vh - 260px);overflow-y:auto;padding:20px 24px 14px}
  .ibx3-empty{padding:90px 20px;text-align:center;color:var(--ink-faint);font-size:14px;line-height:2.2}
  .ibx3-doctop{display:flex;align-items:center;gap:9px;margin-bottom:12px}
  .ibx3-docno{font-size:12px;color:var(--ink-faint);font-weight:600;flex:1}
  .ibx3-actbar{flex:none;border-top:1px solid var(--line);padding:11px 18px;display:flex;gap:8px;align-items:center;background:var(--panel);flex-wrap:wrap}   /* [v177 폰수리] 폰에서 승인·반려 버튼이 밖으로 밀리던 것 */
  .ibx3-actbar input{flex:1;border:1px solid var(--line);border-radius:9px;padding:9px 12px;font-size:13.5px;font-family:inherit;outline:none;color:var(--ink)}
  .ibx3-actbar input:focus{border-color:var(--navy-2)}
  .ibx3-actbar .rej{border:1px solid var(--accent);background:transparent;color:var(--accent-ink);font-size:13.5px;font-weight:800;padding:9px 18px;border-radius:9px}
  .ibx3-actbar .apv{border:none;background:var(--navy);color:#fff;font-size:13.5px;font-weight:800;padding:9px 22px;border-radius:9px}
  .ibx3-actbar .apv:hover,.ibx3-actbar .rej:hover{filter:brightness(1.06)}
  .ibx3-actbar .note{flex:1 1 220px;font-size:13px;color:var(--ink-faint);font-weight:600}   /* [2026-10-03] flex:1(기준 0)이라 줄바꿈 대신 42px 로 눌려 「임시저|장은」 — 기준 220px 이면 좁을 때 제 줄로 내려간다 */
  .ibx3-rejrow{flex:none;background:var(--accent-soft);border-top:1px solid var(--line);padding:10px 18px;display:none;gap:8px;align-items:center}
  .ibx3-rejrow.show{display:flex}
  .ibx3-rejrow input{flex:1;border:1px solid var(--accent);border-radius:9px;padding:9px 12px;font-size:13.5px;font-family:inherit;outline:none;color:var(--ink)}
  .ibx3-rejrow .go{border:none;background:var(--accent);color:#fff;font-size:13px;font-weight:800;padding:9px 16px;border-radius:9px}
  .ibx3-rejrow .cancel{border:none;background:transparent;color:var(--accent-ink);font-size:13px;font-weight:700;padding:9px 6px}
  .astep-opq{color:var(--ink-soft)}   /* [2026-10-03] 기울임 뺌(가짜 기울임) — 회색만 */
  /* ===== [v161 인사3칸] 평가 진행 좌측 대상자 목록 — iframe(srcdoc) 무수술 호스트 브리지 ===== */
  /* [v278] 3칸 격자에 v192 평가라인 배너(#hrOwnerBar)가 자동 배치되던 버그 — 배너가 오른쪽 열 전체를 차지하고 iframe 이 왼쪽 아래 320px 칸으로 밀려
     인사평가 진행·자기평가·최종 피드백 화면이 통째로 깨졌다(배너가 보이는 관리자·관리부·경고 상태에서만). 자리를 못 박는다: 왼쪽 목록 두 줄 · 배너 오른쪽 위 · iframe 오른쪽 아래 */
  #hrHost.hr3on.show{display:grid;grid-template-columns:320px 1fr;grid-template-rows:auto 1fr;gap:0 10px;align-items:stretch}
  #hrHost.hr3on.show .hr3-pane{grid-row:1/3}
  #hrHost.hr3on.show .hr-owner{grid-column:2;grid-row:1}
  #hrHost.hr3on.show iframe{grid-column:2;grid-row:2}
  .hr3-pane{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-height:420px}
  .hr3-h{padding:14px 16px 10px;border-bottom:1px solid var(--line-soft)}
  .hr3-h h3{font-size:15px;font-weight:800}
  .hr3-h h3 span{font-size:12px;color:var(--ink-faint);font-weight:700}
  .hr3-prog{margin-top:9px}
  .hr3-prog .pb{height:7px;border-radius:5px;background:var(--line-soft);overflow:hidden}
  .hr3-prog .pb i{display:block;height:100%;background:var(--navy);border-radius:5px}
  .hr3-prog span{display:block;font-size:11.5px;color:var(--ink-faint);font-weight:600;margin-top:5px;line-height:1.5}
  .hr3-list{flex:1;overflow-y:auto;padding:7px;max-height:calc(100vh - 310px)}
  .hr3-it{position:relative;padding:11px 12px 11px 17px;border-radius:11px;cursor:pointer;margin-bottom:3px}
  .hr3-it:hover{background:#f4f7f5}
  .hr3-it.on{background:#e6f6ec}
  .hr3-it::before{content:"";position:absolute;left:6px;top:12px;bottom:12px;width:3.5px;border-radius:3px;background:var(--hr3c,var(--line))}
  .hr3-it .r1{font-size:14px;font-weight:700;display:flex;align-items:center;gap:7px}
  .hr3-it .r1 .st{margin-left:auto;flex:none}
  .hr3-it .r2{font-size:11.5px;color:var(--ink-faint);margin-top:2px}
  .hr3-b{font-size:10.5px;font-weight:800;padding:2px 9px;border-radius:20px}
  .hr3-b.done{background:#e8f0fe;color:#2F6BD8}
  .hr3-b.ing{background:var(--ok-soft);color:var(--navy-deep)}
  .hr3-b.wip{background:#fdf2dc;color:#9A6B13}
  .hr3-b.hold{background:var(--line-soft);color:var(--ink-faint)}
  .hr3-empty{padding:40px 14px;text-align:center;color:var(--ink-faint);font-size:13px}
  .hr3-div{margin-top:9px;width:100%;padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);font:inherit;font-size:13px;font-weight:700}   /* [2026-10-19] 연도별 추이 사업부 드롭다운 */
  @media(max-width:1100px){#hrHost.hr3on.show{grid-template-columns:1fr}.hr3-pane{display:none}#hrHost.hr3on.show .hr-owner,#hrHost.hr3on.show iframe{grid-column:1}}
  @media(max-width:1100px){.ibx3-grid{grid-template-columns:1fr}.ibx3-split{display:none}}
  /* [2026-10-21 사용자 「사내공지 제목:내용 2:8 → 4:6 · 제목 한 줄」] 공지만 목록 : 본문 = 4 : 6(결재함은 끌어서 바꾸는 종전 그대로) · 제목 한 줄(넘치면 …) · 배지는 안 줄어듦(필수 · 중요가 세로로 쪼개지던 것) */
  @media(min-width:1101px){.ibx3-grid.ntc3-grid{grid-template-columns:minmax(0,4fr) minmax(0,6fr)}.ntc3-grid .ibx3-split{display:none}}
  .ntc3-grid .ntc-tt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ntc3-grid .ibx3-it .r1 .ntc-req,.ntc3-grid .ibx3-it .r1 .ntc-pin,.ntc3-grid .ibx3-it .r1 .ntc-dot{flex:none;white-space:nowrap}
  /* ═══ [v250] 폰에서 "눌렀는데 아무 일도 안 남" ═══
     1단으로 쌓이면 목록이 100vh-320px(=폰에서 화면 62%)를 먹어 상세가 화면 밖에 생겼고,
     문서 자체도 짧아 스크롤로도 끝까지 못 올라왔다(실측: 상세 top 543px → 364px 에서 멈춤).
     · 목록은 화면 38% 로 — 세 건씩 보이면 고르는 데 충분하다
     · 상세는 min-height 를 풀어 내용만큼만 — 빈 상태에서 420px 공백이 스크롤을 잡아먹었다
     ⚠️ 1100px 이하에서만. 2단으로 나란히 보이는 데스크톱은 종전 그대로다. */
  @media(max-width:1100px){
    /* 목록은 화면 30% — 세 건씩 보이면 고르는 데 충분하다 */
    .ibx3-slist,.ibx3-list-pane.has-views .ibx3-slist{max-height:30vh;min-height:120px}
    .mailv-list{max-height:30vh}
    /* 상세는 한 화면을 채운다. min-height 를 이만큼 줘야 문서가 스크롤될 만큼 길어져서
       위임 핸들러(common/ui-shell.js)의 scrollIntoView 가 상세를 화면 맨 위로 올릴 수 있다.
       (min-height 를 0 으로 풀면 문서가 짧아져 아예 스크롤이 안 된다 — 실측으로 확인) */
    .ibx3-det-pane{min-height:calc(100vh - 140px)}
    .ibx3-det{max-height:none}
  }
  /* [v152 결재3칸] 임시저장함 상세 미리보기 */
  .dr3-k{font-size:11.5px;color:var(--ink-faint);font-weight:700;margin:14px 0 4px}
  .dr3-v{font-size:14px;line-height:1.7}
  .dr3-note{background:var(--warn-soft);border:1px solid #f0dcae;border-radius:10px;padding:11px 14px;font-size:13px;color:var(--warn-ink);font-weight:600;margin-bottom:14px}

  /* 받은 결재함 카운트 증가 애니메이션 */
  @keyframes inboxBump{0%{transform:scale(1)}30%{transform:scale(1.5)}100%{transform:scale(1)}}
  .nav a .cnt.bump{animation:inboxBump .55s ease}

  .type-chip{font-size:11px;font-weight:700;padding:3px 9px;border-radius:7px;background:var(--sea-tint,#eef2f8);color:var(--navy-deep)}

  /* ===== DASHBOARD ===== */

  .panel-h{padding:13px 18px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:10px}
  .panel-h h3{font-size:14.5px;font-weight:800}
  .panel-h .more{margin-left:auto;font-size:12px;color:var(--navy-deep);font-weight:700;background:none;border:none}
  .panel-h .more:hover{text-decoration:underline}

  /* (.row-item CSS 제거 — rowItem 함수와 함께 사망, v117 감사) */


  /* ===== TABLE (list views) ===== */
  .toolbar{display:flex;align-items:center;gap:10px;margin-bottom:16px}
  .tabs{display:flex;gap:6px}
  .tab{padding:8px 15px;border-radius:9px;border:1px solid var(--line);background:var(--panel);font-size:13.5px;font-weight:700;color:var(--ink-soft);transition:all .15s}
  .tab:hover{border-color:var(--navy-2);color:var(--navy-deep)}
  .tab.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .search{margin-left:auto;position:relative}
  .search input{border:1px solid var(--line);border-radius:9px;padding:9px 13px 9px 34px;font-size:14px;width:220px;font-family:inherit;background:var(--panel)}
  .search input:focus{outline:none;border-color:var(--navy-2)}
  .search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;stroke:var(--ink-faint);fill:none;stroke-width:2}

  table.dl{width:100%;border-collapse:separate;border-spacing:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm)}
  table.dl th{background:#f7f9fc;font-size:12px;font-weight:700;color:var(--ink-soft);text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);white-space:nowrap}
  table.dl td{padding:14px 16px;border-bottom:1px solid var(--line-soft);font-size:14px;vertical-align:middle}
  table.dl tr:last-child td{border-bottom:none}
  table.dl tbody tr{transition:background .12s}
  table.dl tbody tr[data-open]{cursor:pointer}   /* [2026-10-03 재검증] 손가락 커서는 눌러서 문서가 열리는 줄만(결재 문서 목록 docTable) — 제증명 목록·묶음 상신 대상·연차 표처럼 클릭 동작이 없는 표는 화살표(눌러도 아무 일 없어 「안 눌린다」로 보였다) */
  table.dl tbody tr:hover{background:var(--line-soft)}
  table.dl .doctitle{font-weight:700}
  table.dl .sub{font-size:11.5px;color:var(--ink-faint);margin-top:2px}
  .empty-state{text-align:center;padding:60px 20px;color:var(--ink-faint)}
  .empty-state svg{width:46px;height:46px;stroke:var(--line);fill:none;stroke-width:1.5;margin-bottom:14px}
  .empty-state .t{font-size:14px;font-weight:700;color:var(--ink-soft)}
  .empty-state .s{font-size:13.5px;margin-top:5px}

  /* mini approval-line dots in table */

  /* ===== MODAL ===== */
  .overlay{position:fixed;inset:0;background:rgba(22,29,45,.5);backdrop-filter:blur(3px);z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto;animation:ofade .2s}
  @keyframes ofade{from{opacity:0}to{opacity:1}}
  .modal{background:var(--panel);border-radius:18px;box-shadow:var(--shadow-lg);width:100%;max-width:760px;animation:mpop .25s cubic-bezier(.2,.9,.3,1.2)}
  .modal.wide{max-width:880px}
  .modal.xwide{max-width:1040px}
  @keyframes mpop{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
  .modal-h{padding:18px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;background:var(--panel);border-radius:18px 18px 0 0}
  .modal-h h3{font-size:16px;font-weight:800}
  .modal-h .x{margin-left:auto;width:32px;height:32px;border-radius:8px;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center;color:var(--ink-soft)}
  .modal-h .x:hover{background:var(--line-soft)}
  .modal-h .x svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.4}
  /* ===== [v175 작성창 도크] 접기 버튼 + 우하단 미니바 =====
     문제: 작성 모달이 lockBackdrop=true라 뒤 화면이 통째로 잠겨서, 쓰다가 자재 재고·기준단가·메일 견적을
           확인하려면 작성을 취소하고 나갔다 와야 했다.
     .modal-h .x{margin-left:auto}(742)는 손대지 않고, 접기 버튼이 그 auto를 넘겨받는 규칙만 추가한다. */
  .modal-h .wmin{margin-left:auto;width:32px;height:32px;border-radius:8px;border:1px solid var(--line);background:var(--panel);display:grid;place-items:center;color:var(--ink-soft);cursor:pointer;padding:0}
  .modal-h .wmin:hover{background:var(--line-soft);border-color:var(--navy-2)}
  .modal-h .wmin svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round}
  .modal-h .wmin + .x{margin-left:7px}
  /* z=460 — overlay100·toast200·bulkBar240·notif260·inapp300·dpm400·qv420·mailv430 위,
     cmdk500·dgear520·bf900·login1000·aiFab9000 아래. 접은 뒤 다른 모달을 열어도 미니바가 보이되
     커맨드팔레트·모닝브리핑·챗봇은 정상적으로 미니바를 덮는다. */
  #wdockBar{position:fixed;right:92px;bottom:26px;z-index:460;display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(19,27,22,.18);padding:10px 12px;cursor:pointer;max-width:340px;animation:wdockIn .24s cubic-bezier(.22,1,.36,1)}
  #wdockBar:hover{border-color:var(--navy-2)}
  @keyframes wdockIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  #wdockBar .wd-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);flex:none;animation:wdockPulse 1.8s infinite}
  @keyframes wdockPulse{0%,100%{opacity:1}50%{opacity:.3}}
  #wdockBar .wd-b{flex:1;min-width:0}
  #wdockBar .wd-t{font-size:13px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #wdockBar .wd-s{font-size:11px;font-weight:600;color:var(--ink-faint);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #wdockBar .wd-x{flex:none;border:1px solid var(--line);background:var(--panel);width:24px;height:24px;border-radius:7px;cursor:pointer;color:var(--ink-faint);font-size:14px;font-weight:800;line-height:1;display:grid;place-items:center;padding:0}
  #wdockBar .wd-x:hover{border-color:var(--accent);color:var(--accent-ink)}
  body.locked #wdockBar{display:none}
  /* ===== [v177 마스킹시연] 좌하단 시연 토글 — 사내망 시연 중 '사원에게는 이렇게 보인다'를 즉석에서 =====
     z=470: 미니바(460) 위, 커맨드팔레트(500)·브리핑(900)·챗봇(9000) 아래. 좌하단은 원래 비어 있어 충돌 없음. */
  /* [v177 감사수정] bottom 16→44px — 좌하단 동기화 배지(#f2SyncBadge, left:10 bottom:10 z:99999)와 겹쳐
     배지의 '재접속 리로드' 클릭을 가로채거나 시연 중 오클릭 리로드가 날 수 있었다 */
  /* [v245] 좌하단 고정 카드 → 상단바(돋보기 왼쪽) 아이콘 버튼 + 드롭다운.
     좌하단은 사이드바 하단 메뉴를 계속 가렸다. 상단바는 늘 비어 있어 아무것도 안 가린다. */
  #maskDemo{position:relative;flex:none;margin-right:8px}
  #maskDemo .md-btn{width:34px;height:34px;display:flex;align-items:center;justify-content:center;
    border:1px solid var(--line);background:transparent;border-radius:9px;color:var(--ink-faint);cursor:pointer;padding:0;
    transition:all .14s}
  #maskDemo .md-btn svg{width:17px;height:17px;display:block}
  #maskDemo .md-btn:hover{color:var(--ink);border-color:var(--navy)}
  #maskDemo.on .md-btn,#maskDemo.mz .md-btn{color:#fff;background:var(--accent);border-color:var(--accent)}   /* .mz = 개발부서 모자이크 켬(패널 없이 버튼만 물듦) */
  #maskDemo .md-b{display:none;position:absolute;top:calc(100% + 9px);right:0;z-index:600;width:274px;
    background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 28px rgba(19,27,22,.18);
    padding:12px 13px;font-size:11.5px;font-weight:700;color:var(--ink-soft);text-align:left;white-space:normal}
  #maskDemo.on .md-b{display:block}
  #maskDemo .md-title{font-size:12px;font-weight:800;color:var(--ink);margin-bottom:8px}
  #maskDemo .md-t{border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:4px 8px;font-family:inherit;font-size:11px;font-weight:800;color:var(--ink-soft);cursor:pointer}
  #maskDemo .md-t:hover{border-color:var(--navy-2)}
  #maskDemo .md-t.on{background:var(--accent);border-color:var(--accent);color:#fff}
  #maskDemo .md-note{margin-top:7px;font-size:10.5px;font-weight:600;color:var(--ink-faint);line-height:1.5}
  #maskDemo .md-real{font-size:10.5px;font-weight:700;color:var(--ink-faint)}
  body.locked #maskDemo{display:none}
  /* [v177 감사수정] 폰에서 작성창 미니바(전폭·bottom:92px)가 떠 있으면 펼친 패널과 겹친다 — 시연 도구는 폰에선 숨김
     (기존 body.wdock-on 규칙은 bottom:16px 그대로라 아무 일도 안 하는 no-op이었다 → 삭제) */
  @media(max-width:640px){
    #maskDemo .md-b{width:min(274px,calc(100vw - 24px))}   /* [v245] 상단바로 옮겨 미니바와 안 겹친다 — 숨김 규칙 삭제 */
  }
  body.wdock-on .inapp-wrap{bottom:86px}   /* 알림 스택만 위로 밀어 미니바와 안 겹치게 (원본 규칙은 안 건드림) */
  /* [v175 감사수정] 메일 작성창(.mailv-compose z420, right:26 bottom:26)과 우하단 좌표가 겹쳐
     '보내기' 버튼을 미니바가 덮었다 — 컴포즈를 위로 민다(원본 규칙 미수정, 추가 규칙만) */
  body.wdock-on .mailv-compose{bottom:96px}
  /* [v175 감사수정] 모달이 떠 있는 동안 미니바는 보이되 클릭은 막는다.
     z460 > overlay100이라 넓은 모달의 푸터 버튼을 가리고, 눌리면 wdockExpand가
     열려 있던 모달을 경고 없이 통째로 파괴했다(showModal이 #modalRoot를 innerHTML로 덮어씀). */
  body.modal-on #wdockBar{opacity:.4;pointer-events:none}
  @media(max-width:640px){ #wdockBar{right:16px;left:16px;bottom:92px;max-width:none} }
  .modal-b{padding:24px}
  .modal-f{padding:16px 24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;background:var(--panel);border-radius:0 0 18px 18px}   /* [2026-10-03] flex-wrap — 좁은 화면에서 버튼이 글자 단위로 눌리지 않게 다음 줄로 */

  .btn{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:10px;padding:10px 18px;font-size:14px;font-weight:700;transition:all .15s}
  .btn:hover{background:var(--line-soft)}
  .btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}
  .btn.primary:hover{background:var(--navy-2)}
  .btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
  .btn.ok:hover{filter:brightness(1.06)}
  .btn.danger{background:var(--accent);border-color:var(--accent);color:#fff}
  .btn.danger:hover{filter:brightness(1.06)}
  .btn.ghost{background:none;border:none;color:var(--ink-soft)}

  /* form (작성) */
  /* [v130 템플릿갤러리] 작성 모달 상단 템플릿 카드 스트립 */
  .tpl-gallery{margin-bottom:16px;padding:12px 14px;background:#f7f8fb;border:1px solid #eceaf3;border-radius:12px}
  .tpl-lbl{display:flex;align-items:center;justify-content:space-between;font-size:13.5px;font-weight:700;color:#5a5570;margin-bottom:9px}
  .tpl-save{font-size:11.5px;font-weight:700;color:var(--navy);background:var(--sea-tint,#eaf1fc);border:0;border-radius:7px;padding:5px 10px;cursor:pointer}
  .tpl-save:hover{background:rgba(var(--sea-rgb,27,111,245),.16)}
  .tpl-cards{display:flex;flex-wrap:wrap;gap:7px}
  .tpl-card{position:relative;display:flex;flex-direction:column;gap:2px;align-items:flex-start;background:#fff;border:1px solid #e5e3ef;border-radius:9px;padding:8px 12px;cursor:pointer;text-align:left}
  .tpl-card:hover{border-color:var(--navy);background:#f5f9ff}
  .tpl-card .tpl-nm{font-size:13.5px;font-weight:700;color:#241f33}
  .tpl-card .tpl-ty{font-size:10.5px;color:#8a86a0}
  .tpl-card.tpl-mine{padding-right:24px}
  .tpl-del{position:absolute;top:5px;right:7px;font-size:14px;color:#b6bcc7;line-height:1;cursor:pointer}
  .tpl-del:hover{color:#ef5350}
  .frm-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  /* [2026-10-03] 좁은 화면 작성창 — 2칸 격자가 세부 내역(7칸 고정폭 712px)·입력칸 최소폭에 밀려 모달 밖으로 넘쳤다(390 에서 392px · 768 에서 14px 실측)
     → 칸은 내용에 밀리지 않게(minmax 0) · 세부 내역은 그 칸 안에서 가로 스크롤 · 폰(≤600)은 한 칸 + 결재유형 버튼 줄바꿈(아래 .type-seg 규칙 뒤 블록) */
  @media(max-width:820px){
    .frm-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
    #itemsBlock{overflow-x:auto}
    #itemsBlock .itm-head,#itemsBlock #itmList{min-width:860px}
  }
  .fld{margin-bottom:16px}
  .fld.full{grid-column:1/-1}
  .fld label{display:block;font-size:12px;font-weight:700;margin-bottom:7px;color:var(--ink)}
  .fld label .req{color:var(--accent-ink)}
  .fld input,.fld select,.fld textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;color:var(--ink);background:var(--panel)}
  .fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--navy-2)}
  .fld textarea{resize:vertical;line-height:1.6}
  .fld.invalid input,.fld.invalid textarea{border-color:#d64545;background:#fdeaea}   /* [v128 인라인검증] */
  .fld-err{color:#C4534E;font-size:12px;margin-top:6px;font-weight:600}
  .type-seg{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
  .type-seg .o{border:1.5px solid var(--line);border-radius:9px;padding:10px;text-align:center;font-size:14px;font-weight:700;color:var(--ink-soft);transition:all .15s}
  .type-seg .o:hover{border-color:var(--navy-2)}
  .type-seg .o.on{background:var(--navy);border-color:var(--navy);color:#fff}
  @media(max-width:600px){   /* [2026-10-03] 폰 작성창 — 한 칸 · 결재유형 5개는 줄바꿈(종전 5칸 고정이라 「일반기|안」) · 합의 버튼 폭 제한 풀기 */
    .frm-grid{grid-template-columns:minmax(0,1fr)}
    .frm-grid .type-seg,.frm-grid #fType.type-seg{grid-template-columns:repeat(auto-fit,minmax(96px,1fr))}   /* #fType 은 1378줄에서 4칸 고정(id 특이도) — 같이 이긴다 */
    .frm-grid .agree-seg{max-width:none}
  }
  /* 기안 종류 선택 (결재유형=기안일 때) */
  .kind-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .kind-seg .ko{border:1.5px solid var(--line);border-radius:9px;padding:11px 10px;text-align:center;font-size:14px;font-weight:700;color:var(--ink-soft);transition:all .15s;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
  .kind-seg .ko:hover{border-color:var(--navy-2)}
  .kind-seg .ko.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .kind-seg .ko .ocrb{font-size:9px;font-weight:800;background:var(--ok);color:#fff;border-radius:5px;padding:1px 5px}
  .kind-seg .ko.on .ocrb{background:rgba(255,255,255,.28)}
  /* 근태계 — 근태 종류 세그 / 반차 오전·오후 / 일수 요약 / 안내 */
  .leave-seg,.half-seg{display:grid;gap:8px}
  .leave-seg{grid-template-columns:repeat(6,1fr)}   /* [v282] 연차·반차·병가·교육·훈련·기타 */
  @media(max-width:720px){ .leave-seg{grid-template-columns:repeat(3,1fr)} }
  /* [v282 인사발령] 명단 표 */
  .hr-tbl input,.hr-tbl select{width:100%;min-width:64px;padding:6px 7px;border:1px solid var(--line);border-radius:7px;font:inherit;font-size:13px;background:var(--card,#fff);color:var(--ink)}
  .hr-tbl td{padding:4px 5px} .hr-del{border:none;background:transparent;color:var(--ink-faint);font-size:18px;cursor:pointer;line-height:1} .hr-del:hover{color:var(--accent-ink)}
  .half-seg{grid-template-columns:repeat(2,1fr)}
  .leave-seg .lo,.half-seg .lo{border:1.5px solid var(--line);border-radius:9px;padding:11px 8px;text-align:center;font-size:14px;font-weight:700;color:var(--ink-soft);transition:all .15s;cursor:pointer}
  .half-seg .lo{padding:9px 6px}
  .leave-seg .lo:hover,.half-seg .lo:hover{border-color:var(--navy-2)}
  .leave-seg .lo.on,.half-seg .lo.on{background:var(--navy);border-color:var(--navy);color:#fff}
  /* [v198 연차배지] 근태계 작성창 상단 3칸 — 부여·사용·잔여 */
  .leave-sum{display:flex;align-items:center;gap:9px;background:#f4f6fb;border:1px solid var(--line);border-radius:10px;padding:11px 14px;font-size:14px;color:var(--ink)}
  .leave-sum svg{width:18px;height:18px;flex:none;stroke:var(--navy);stroke-width:1.8;fill:none}
  .leave-sum b{font-size:16px;color:var(--navy);margin:0 1px}
  .leave-sum .leave-hint{margin-left:auto;font-size:11.5px;font-weight:500;color:var(--ink-faint)}
  .lv-warn{margin-top:9px;border-radius:10px;padding:10px 13px;font-size:13.5px;line-height:1.5;font-weight:600}
  .lv-warn.danger{background:#fbe6e7;border:1px solid #eec3c6;color:#C4534E}
  .lv-warn.soft{background:var(--sea-tint,#EEF4FF);border:1px solid rgba(var(--sea-rgb,27,111,245),.28);color:var(--navy)}
  .leave-note{display:flex;align-items:flex-start;gap:8px;margin-top:10px;background:#eef7f0;border:1px solid #cfe8d6;border-radius:10px;padding:11px 13px;font-size:13.5px;line-height:1.55;color:#2f6b46}
  .leave-note svg{width:17px;height:17px;flex:none;margin-top:1px;stroke:#3a8a5a;stroke-width:1.8;fill:none}
  /* 증빙불비(무증빙) 소명 */
  .noevi-toggle{display:flex;align-items:flex-start;gap:11px;border:1.5px solid var(--line);border-radius:11px;padding:13px 14px;cursor:pointer;transition:all .15s}
  .noevi-toggle:hover{border-color:#f0c98a}
  .noevi-toggle.on{border-color:#e6a23c;background:#fff8ec}
  .noevi-toggle input{display:none}
  .noevi-box{width:20px;height:20px;flex:none;border:1.6px solid var(--line);border-radius:6px;display:grid;place-items:center;margin-top:1px;background:#fff}
  .noevi-box svg{width:13px;height:13px;stroke:#fff;stroke-width:2.4;fill:none;opacity:0}
  .noevi-toggle.on .noevi-box{background:#e6a23c;border-color:#e6a23c}
  .noevi-toggle.on .noevi-box svg{opacity:1}
  .noevi-tx b{display:block;font-size:14px;font-weight:800;color:var(--ink)}
  .noevi-tx span{display:block;font-size:12px;color:var(--ink-soft);margin-top:2px;line-height:1.5}
  .noevi-detail{margin-top:12px;padding:14px;border:1px dashed #e6c98a;border-radius:11px;background:#fffdf7}
  .noevi-detail.hide{display:none}
  .ne-sub{margin-bottom:13px}
  .ne-sub:last-child{margin-bottom:0}
  .ne-sub>label{display:block;font-size:12px;font-weight:700;color:var(--ink);margin-bottom:7px}
  .noevi-seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px}
  .noevi-seg .lo{border:1.5px solid var(--line);border-radius:9px;padding:10px 6px;text-align:center;font-size:13.5px;font-weight:700;color:var(--ink-soft);transition:all .15s;cursor:pointer}
  .noevi-seg .lo:hover{border-color:#e6a23c}
  .noevi-seg .lo.on{background:#e6a23c;border-color:#e6a23c;color:#fff}
  .noevi-detail textarea{width:100%;border:1.5px solid var(--line);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;color:var(--ink);resize:vertical;box-sizing:border-box}
  .noevi-detail textarea:focus{outline:none;border-color:#e6a23c}
  .noevi-note{display:flex;align-items:flex-start;gap:8px;margin-top:12px;font-size:12px;line-height:1.55;color:#9a6a16}
  .noevi-note svg{width:16px;height:16px;flex:none;margin-top:1px;stroke:#cf922a;stroke-width:1.8;fill:none}
  .ne-chip{display:inline-block;font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:20px;background:#fdeccf;color:#a8730f;border:1px solid #f0d398;vertical-align:middle;margin-left:2px}
  .noevi-alert{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;padding:13px 15px;background:#fff7ea;border:1px solid #f0d398;border-radius:10px}
  .noevi-alert svg{width:20px;height:20px;flex:none;margin-top:1px;stroke:#cf922a;stroke-width:1.9;fill:none}
  .noevi-alert b{display:block;font-size:14px;font-weight:800;color:#a8730f}
  .noevi-alert>div span{display:block;font-size:13.5px;color:var(--ink);margin-top:3px;line-height:1.5}
  .noevi-alert .ne-tax{font-size:11.5px;color:var(--ink-soft);margin-top:4px}
  /* 법인카드 구분 */
  .corp-reg-strip{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 18px 13px;   /* [v273] 카드 안쪽 여백(.panel-h 18px 와 정렬) */font-size:12px;color:var(--ink-soft);font-weight:700}
  .crchip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:20px;padding:4px 11px}
  .crchip i{width:9px;height:9px;border-radius:50%;flex:none;background:var(--ink-faint)}
  .crchip em{font-style:normal;color:var(--ink-soft);font-weight:600}
  .crchip.cr-personal{border-style:dashed;color:var(--ink-soft)}
  .pay-cell{display:flex;flex-direction:column;gap:5px;align-items:flex-start}
  .pay{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:3px 9px 3px 7px;border-radius:20px;white-space:nowrap}
  .pay svg{width:13px;height:13px;flex:none}
  .card-sel{font-size:11px;color:var(--ink-soft);border:1px solid var(--line);border-radius:7px;padding:3px 6px;background:#fff;max-width:160px;cursor:pointer}
  .card-sel:focus{outline:none;border-color:var(--navy)}
  .exp-split{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:14px 18px 18px}   /* [v273] 좌우·아래 여백 */
  .exp-cbody{padding:12px 18px 14px}   /* [v273] 경비 카드 본문(정합성 검증·증빙 구분) — 카드 벽에서 띄운다 */
  .esp{border-radius:12px;padding:15px 17px;border:1.5px solid}
  .esp-corp{background:var(--sea-tint,#EEF4FF);border-color:rgba(var(--sea-rgb,27,111,245),.28)}
  .esp-personal{background:#fff8ec;border-color:#f0d398}
  .esp-h{font-size:12px;font-weight:700;display:flex;align-items:center;gap:7px}
  .esp-h svg{width:16px;height:16px;flex:none}
  .esp-corp .esp-h{color:var(--navy)}
  .esp-corp .esp-h svg{stroke:var(--navy);fill:none;stroke-width:1.9}
  .esp-personal .esp-h{color:#a8730f}
  .esp-personal .esp-h svg{stroke:#e6a23c;fill:none;stroke-width:1.9}
  .esp-v{font-size:21px;font-weight:800;margin-top:8px;color:var(--ink)}
  .esp-note{font-size:11px;color:var(--ink-soft);margin-top:4px}
  .esp-list{margin-top:11px;padding-top:10px;border-top:1px dashed rgba(var(--sea-rgb,27,111,245),.28);display:flex;flex-direction:column;gap:6px}
  .esp-personal .esp-list{border-top-color:#f0d398}
  .pcrow{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;gap:10px}
  .pcrow span{color:var(--ink-soft);display:flex;align-items:center;gap:6px;min-width:0}
  .pcrow span i{width:8px;height:8px;border-radius:50%;flex:none}
  .pcrow em{font-style:normal;color:var(--ink-faint)}
  .pcrow b{font-weight:700;color:var(--ink);white-space:nowrap}
  .di-corp{display:inline-block;font-size:11px;font-weight:700;color:var(--navy);background:var(--sea-tint,#EEF4FF);border:1px solid rgba(var(--sea-rgb,27,111,245),.28);border-radius:6px;padding:2px 7px}
  .di-personal{display:inline-block;font-size:11px;font-weight:700;color:#a8730f;background:#fff8ec;border:1px solid #f0d398;border-radius:6px;padding:2px 7px}
  .card-summary{margin-top:16px}
  .cs-h{font-size:12px;font-weight:700;color:var(--ink-soft);margin-bottom:9px;display:flex;align-items:center;gap:7px}
  .cs-h svg{width:15px;height:15px;stroke:var(--navy);fill:none;stroke-width:1.9}
  .cs-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .cs-box{border-radius:11px;padding:13px 15px;border:1.5px solid}
  .cs-corp{background:var(--sea-tint,#EEF4FF);border-color:rgba(var(--sea-rgb,27,111,245),.28)}
  .cs-personal{background:#fff8ec;border-color:#f0d398}
  .cs-l{font-size:11.5px;font-weight:700}
  .cs-corp .cs-l{color:var(--navy)}
  .cs-personal .cs-l{color:#a8730f}
  .cs-v{font-size:18px;font-weight:800;margin-top:6px;color:var(--ink)}
  .cs-list{margin-top:10px;padding-top:9px;border-top:1px dashed rgba(var(--sea-rgb,27,111,245),.28);display:flex;flex-direction:column;gap:6px}
  /* (구세대 dx- 대시보드 CSS 제거 — 마크업 생성처 0, v117 감사) */

/* ===== v62 하이브리드 대시보드 (d2-) ===== */
.d2-dash{background:var(--bg);margin:-28px -30px -60px;padding:28px 30px 60px}   /* [v151] 대시보드 바탕색 = 타 화면과 동일(--bg) — 진권 지시 */
.d2-dash *{box-sizing:border-box}
/* [v151] 히어로 = 화이트 패널 + 그린 글로우 (윤비서/목업 패밀리 문법 — 구 딥네이비는 화이트셸에서 튐, 진권 지적) */
.d2-hero{position:relative;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:24px 30px;margin-bottom:16px;box-shadow:var(--shadow-sm)}
.d2-hero:after{content:"";position:absolute;right:-40px;top:-60px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--sea-g2,#5C9BFF) 18%,transparent),transparent 65%)}
.d2-hero:before{content:"";position:absolute;right:150px;top:20px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(var(--sea-rgb,27,111,245),.08),transparent 60%)}
.d2-hrow{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center}
.d2-eyebrow{font-size:11.5px;font-weight:800;letter-spacing:.12em;color:var(--navy-deep)}
.d2-hi{font-size:25px;font-weight:800;letter-spacing:-.02em;margin-top:8px;color:var(--ink)}
.d2-hsub{font-size:14px;color:var(--ink-soft);margin-top:6px}
.d2-hd{text-align:right;flex:none}.d2-hd .c{font-size:47px;font-weight:800;color:var(--ink);letter-spacing:.01em;line-height:1.05}.d2-hd .d{font-size:15px;font-weight:700;color:var(--ink-soft);margin-bottom:5px}   /* [v151 날씨위젯] 날짜↑(15px)+시계↓(47px) — 좌측 멘트 블록과 높이 균형 */
.d2-hd .c .cs{font-size:16px;font-weight:700;color:var(--navy-deep);background:#E6F6EC;margin-left:5px;padding:2px 6px;border-radius:6px;vertical-align:2px}
/* [v178 도장] 히어로 출퇴근 줄 — 버튼은 흰 배경 고정: 날씨 8톤(맑음~폭풍·야간)의 어두운 그라디언트 위에서도
   대비가 유지된다. 글자색은 상태 텍스트만 inherit(wx-dark가 993에서 흰색으로 뒤집어줌). */
.d2-hd .d2-att{margin-top:9px;display:flex;gap:8px;align-items:center;justify-content:flex-end}
.d2-att .da-btn{border:0;border-radius:9px;padding:8px 16px;font-family:inherit;font-size:13px;font-weight:800;cursor:pointer;background:rgba(255,255,255,.93);color:var(--navy-deep);box-shadow:0 2px 8px rgba(0,0,0,.18);transition:transform .12s,background .12s}
.d2-att .da-btn.out{color:#A65331}
.d2-att .da-btn:hover{background:#fff;transform:translateY(-1px)}
.d2-att .da-btn:active{transform:none}
.d2-att .da-in,.d2-att .da-done,.d2-att .da-hint{font-size:12.5px;font-weight:700;color:var(--ink-soft)}
.d2-hero.wx-dark .d2-att .da-in,.d2-hero.wx-dark .d2-att .da-done,.d2-hero.wx-dark .d2-att .da-hint{color:rgba(255,255,255,.85)}
body[data-theme="dark"] .d2-att .da-btn{background:rgba(255,255,255,.9)}
/* v115: 날씨 위젯 */
.d2-weather{display:flex;justify-content:flex-end}
.d2-weather:empty{display:none}
.wx{display:inline-flex;align-items:center;gap:9px;background:#f6f7fb;border:1px solid #ecebf4;border-radius:13px;padding:7px 13px 7px 9px;margin-bottom:11px}
.wx-ic{width:30px;height:30px;flex:none;fill:none;stroke-linecap:round;stroke-linejoin:round}
.wx-t{font-size:23px;font-weight:800;color:#241f33;line-height:1;font-variant-numeric:tabular-nums}
.wx-meta{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.wx-d{font-size:12px;font-weight:700;color:#5f6b80}
.wx-hl{font-size:10.5px;color:var(--ink-faint,#67737F);font-weight:600}
/* [v151] 히어로 날씨칩 = 그린틴트 (화이트 히어로에 맞춤) */
.d2-hero .wx{background:#F7FAF8;border-color:var(--line)}
/* [v151 날씨연출A] 시네마틱 스카이 (진권 픽 2026-07-23) — 히어로 전체가 하늘로 변신, 텍스트 자동 반전, 풀블리드 */
.d2-wxbg{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:inherit;z-index:0}
.d2-hero.wx-sky::before,.d2-hero.wx-sky::after{display:none}
.d2-hero.wx-clear,.d2-mini.d2-heroS.wx-clear{background:linear-gradient(160deg,#8EC9F0,#BCE0F7 60%,#E8F5FD)!important}
.d2-hero.wx-clear.wx-night,.d2-mini.d2-heroS.wx-clear.wx-night{background:linear-gradient(160deg,#1D2A44,#2C3B58 60%,#3D4C6A)!important}
.d2-hero.wx-partly,.d2-mini.d2-heroS.wx-partly{background:linear-gradient(160deg,#A9CFE8,#CFE5F2 55%,#F0F7FB)!important}
.d2-hero.wx-partly.wx-night,.d2-mini.d2-heroS.wx-partly.wx-night{background:linear-gradient(160deg,#26334C,#374561 60%,#485874)!important}
.d2-hero.wx-cloud,.d2-mini.d2-heroS.wx-cloud{background:linear-gradient(160deg,#9FB0C2,#C2CFDA 60%,#E6ECF1)!important}
.d2-hero.wx-fog,.d2-mini.d2-heroS.wx-fog{background:linear-gradient(160deg,#AAB6C2,#CBD4DC 60%,#E9EDF1)!important}
.d2-hero.wx-rain,.d2-mini.d2-heroS.wx-rain,.d2-hero.wx-drizzle,.d2-mini.d2-heroS.wx-drizzle{background:linear-gradient(160deg,#28344A,#3A4761 60%,#4A576E)!important;border-color:rgba(255,255,255,.14)}   /* [2026-10-18 사용자 결정 ㉡-1] 라이트도 다크와 같은 비 하늘 — 종전 #6B7D92 끝에서 시계 흰 글씨 4.2:1 → 7.3:1 */
.d2-hero.wx-storm,.d2-mini.d2-heroS.wx-storm{background:linear-gradient(160deg,#232C3D,#3A4557 60%,#4A576B)!important;border-color:rgba(255,255,255,.12)}
.d2-hero.wx-snow,.d2-mini.d2-heroS.wx-snow{background:linear-gradient(160deg,#8E9BB5,#B4BFD2 60%,#E1E7F0)!important}
body[data-theme="dark"] .d2-hero.wx-clear,body[data-theme="dark"] .d2-hero.wx-partly{background:linear-gradient(160deg,#1D2A44,#2C3B58 60%,#3D4C6A)!important}
body[data-theme="dark"] .d2-hero.wx-cloud,body[data-theme="dark"] .d2-hero.wx-fog{background:linear-gradient(160deg,#252E3C,#39445A 60%,#485874)!important}
body[data-theme="dark"] .d2-hero.wx-snow{background:linear-gradient(160deg,#2E3850,#465372 60%,#5A688A)!important}
/* 하늘이 어두울 땐 텍스트 화이트 반전 */
.d2-hero.wx-dark .d2-eyebrow{color:rgba(255,255,255,.82)}
.d2-hero.wx-dark .d2-hi,.d2-hero.wx-dark .d2-hd .c{color:#fff}
.d2-hero.wx-dark .d2-hsub,.d2-hero.wx-dark .d2-hd .d{color:rgba(255,255,255,.86)}
.d2-mini.d2-heroS.wx-dark .m-clock,.d2-mini.d2-heroS.wx-dark .hs-greet{color:#fff}
.d2-mini.d2-heroS.wx-dark .m-sub{color:rgba(255,255,255,.86)}
body[data-theme="dark"] .d2-hero.wx-cloud .d2-hi,body[data-theme="dark"] .d2-hero.wx-cloud .d2-hd .c,body[data-theme="dark"] .d2-hero.wx-fog .d2-hi,body[data-theme="dark"] .d2-hero.wx-fog .d2-hd .c{color:#fff}
/* 씬 요소 */
.d2-wxbg .cine-cloud{position:absolute;width:250px;height:66px;border-radius:60px;filter:blur(22px);background:rgba(255,255,255,.55);animation:wxaDrift linear infinite}
.wx-dark .d2-wxbg .cine-cloud{background:rgba(255,255,255,.13)}
.d2-wxbg .cine-drop{position:absolute;top:-30px;width:2.5px;height:20px;border-radius:3px;background:linear-gradient(rgba(255,255,255,0),rgba(220,235,255,.75));animation:wxaRain linear infinite}
.d2-wxbg .cine-splash{position:absolute;bottom:8px;width:14px;height:5px;border:2px solid rgba(220,235,255,.5);border-top:none;border-radius:0 0 12px 12px;animation:wxaSplash 1.1s ease-out infinite}
.d2-wxbg .cine-sun{position:absolute;right:170px;top:-56px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(255,214,110,.95),rgba(255,214,110,0) 68%);animation:wxaPulse 4s ease-in-out infinite}
.d2-wxbg .cine-moon{position:absolute;right:200px;top:8px;font-size:34px;opacity:.85}
.d2-wxbg .cine-flash{position:absolute;inset:0;background:rgba(255,255,255,0);animation:wxaFlash 5.2s infinite}
.d2-wxbg .cine-bolt{position:absolute;right:230px;top:6px;font-size:42px;opacity:0;animation:wxaBolt 5.2s infinite}
.d2-wxbg .cine-flake{position:absolute;top:-16px;color:#fff;animation:wxaSnow linear infinite}
.d2-wxbg .cine-fog{position:absolute;left:0;right:0;height:15px;border-radius:10px;background:rgba(255,255,255,.35);animation:wxaFog ease-in-out infinite alternate}
@keyframes wxaDrift{from{transform:translateX(min(96vw,1600px))}to{transform:translateX(-300px)}}
@keyframes wxaRain{from{transform:translateY(0) rotate(14deg)}to{transform:translateY(230px) rotate(14deg)}}
@keyframes wxaSplash{0%{transform:scale(.2);opacity:.9}70%{transform:scale(1);opacity:.25}100%{transform:scale(1.25);opacity:0}}
@keyframes wxaPulse{0%,100%{transform:scale(1);opacity:.95}50%{transform:scale(1.12);opacity:.75}}
@keyframes wxaFlash{0%,88%,94%,100%{background:rgba(255,255,255,0)}90%,92%{background:rgba(255,255,255,.3)}}
@keyframes wxaBolt{0%,88%,96%,100%{opacity:0}90%,93%{opacity:1}}
@keyframes wxaSnow{from{transform:translateY(0) translateX(0)}50%{transform:translateY(110px) translateX(16px)}to{transform:translateY(230px) translateX(-8px)}}
@keyframes wxaFog{from{transform:translateX(-14px)}to{transform:translateX(18px)}}
@media (prefers-reduced-motion:reduce){.d2-wxbg *{animation:none!important}}
/* v115: 히어로 축소(s·m)는 미니 시계 카드로 — 폭/높이 어떤 조합에도 안 깨지게 */
.d2-heroS{align-items:center;text-align:center;justify-content:center;gap:3px;padding:14px 14px;overflow:hidden}
.d2-heroS .m-sub{font-size:12px;margin-top:2px}
.dw-s .d2-heroS .m-clock{font-size:30px}
.dw-m .d2-heroS .m-clock{font-size:40px}
.dw-s .d2-heroS .wx-hl{display:none}          /* 가장 좁을 땐 최고/최저 숨겨 폭 확보 */
.dw-s .d2-heroS .wx-meta{gap:0}
/* [v151] 미니(축소) 히어로도 풀 히어로와 같은 화이트+그린 — 크기 바뀌어도 정체성 유지 */
.d2-mini.d2-heroS{background:var(--panel);border-color:var(--line);box-shadow:var(--shadow-sm)}
.d2-mini.d2-heroS .m-clock{color:var(--ink)}
.d2-mini.d2-heroS .m-clock .cs{color:var(--navy-deep);background:#E6F6EC}
.d2-mini.d2-heroS .m-sub{color:var(--ink-faint)}
.d2-mini.d2-heroS .wx{background:#F7FAF8;border-color:var(--line)}
.d2-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px 24px;box-shadow:0 10px 30px rgba(36,31,51,.05)}
.d2-pr{width:38%}
.d2-ph{display:flex;align-items:center;margin-bottom:18px}
.d2-ph .bar{position:relative;width:var(--scrap);height:var(--scrap);border-radius:1px;margin-right:10px;flex:none;transform:rotate(var(--scrap-rot));box-shadow:var(--scrap-sh)}   /* [2026-10-03 결정 1-②] 포스트잇 조각(색은 dash.js 인라인 그대로) */
.d2-ph .bar::after{content:"";position:absolute;left:0;right:0;top:0;height:35%;background:rgba(255,255,255,.38)}
.d2-ph h3{font-size:15px;font-weight:800;letter-spacing:-.01em;color:#241f33}
.d2-ph .more{margin-left:auto;font-size:12px;color:var(--navy);font-weight:800;cursor:pointer}
.d2-ali{display:flex;align-items:center;padding:12px 4px;border-bottom:1px solid var(--line-soft);cursor:pointer}
.d2-ali:last-child{border-bottom:none}
.d2-aic{width:38px;height:38px;border-radius:12px;background:#eeecf8;display:flex;align-items:center;justify-content:center;margin-right:12px;flex:none}
.d2-aic svg{width:17px;height:17px;stroke:var(--navy);fill:none;stroke-width:1.8}
.d2-am{flex:1;min-width:0}
.d2-at{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#241f33}
.d2-as{font-size:11.5px;color:var(--ink-faint,#67737F);margin-top:2px}
/* ===== 커스텀 대시보드 (v100) ===== */
.dash-top{display:flex;justify-content:flex-end;margin-bottom:12px}
.dash-editbar{display:flex;align-items:center;gap:12px;background:#fff8e6;border:1px solid #f3e2a8;border-radius:12px;padding:12px 16px;margin-bottom:14px;font-size:14px;font-weight:700;color:#8a6d1a}
/* v114: 커맨드팔레트 (Ctrl+K) */
.cmdk-ov{position:fixed;inset:0;background:rgba(15,22,36,.45);z-index:500;display:flex;justify-content:center;align-items:flex-start;padding:12vh 16px 16px}
.cmdk{background:#fff;border-radius:16px;width:100%;max-width:580px;box-shadow:0 24px 70px rgba(0,0,0,.35);overflow:hidden}
.cmdk-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid #edeaf4}
.cmdk-in svg{width:18px;height:18px;stroke:#8a86a0;fill:none;stroke-width:2;flex:none}
.cmdk-in input{flex:1;border:none;outline:none;font-size:15px;font-family:inherit;color:#241f33;background:transparent}
.cmdk-esc{font-size:10px;font-weight:700;border:1px solid #e2e0ee;border-radius:5px;padding:2px 7px;color:var(--ink-faint,#67737F)}
.cmdk-list{max-height:52vh;overflow:auto;padding:7px}
.cmdk-it{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:10px;cursor:pointer;font-size:14px;color:#241f33}
.cmdk-it b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmdk-it.on,.cmdk-it:hover{background:var(--sea-tint,#f0f4fc)}
.cmdk-s{margin-left:auto;font-size:11px;color:var(--ink-faint,#67737F);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}
.cmdk-k{font-size:10px;font-weight:800;border-radius:5px;padding:2px 7px;flex:none}
.ck-메뉴{background:var(--sea-tint,#EEF4FF);color:var(--navy)}.ck-문서{background:#fdf0db;color:#a86a12}.ck-공지{background:#fbe6e7;color:#C4534E}.ck-직원{background:#e2f3f1;color:#1f7a6e}.ck-자료{background:#f0eafd;color:#6b46c1}
.cmdk-empty{padding:26px;text-align:center;color:var(--ink-faint,#67737F);font-size:14px}
/* v114: 대결(위임 결재) 표기 */
.astep .aproxy{display:inline-block;margin-left:6px;font-size:10px;font-weight:800;background:var(--sea-tint,#EEF4FF);color:var(--navy);border:1px solid rgba(var(--sea-rgb,27,111,245),.28);border-radius:20px;padding:1px 7px;vertical-align:middle}
/* ===== v114 갤럭시 위젯 대시보드 (Gridstack + S/M/L tier) ===== */
.grid-stack{background:transparent}
.grid-stack-item-content{inset:0;overflow:hidden;border-radius:20px;display:flex;flex-direction:column}
/* Gridstack 기본 overflow-y:auto(3클래스 우선) 무력화 → 애매한 스크롤바 제거. 스크롤은 내부 패널이 담당 */
.grid-stack>.grid-stack-item>.grid-stack-item-content{overflow:hidden}
.grid-stack-item-content>.dw-body{flex:1;min-height:0;display:flex;flex-direction:column}
.grid-stack-item-content>.dw-body>*{flex:1;min-height:0;margin:0!important;box-sizing:border-box}
/* 위젯 카드가 셀 높이를 꽉 채우도록 */
.dw-body .d2-hero,.dw-body .d2-panel,.dw-body .d2-mini{height:100%;margin:0}
.dw-body .d2-panel{overflow:auto;padding:18px 20px}
/* 옛 좌우배치 고정폭(60.5%/38%) 무효화 → 위젯 셀 100% 채움 (우측 여백/과협소 버그 수정) */
.dw-body .d2-pr{width:100%!important}
/* 결재대기(d2-pr): 좁아질 때 상신자·사업부 줄이 한 글자씩 세로로 터지는 것 방지 */
.dw-body .d2-as{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dw-body .d2-ph h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dw-body .d2-ph .more{flex:none;margin-left:8px}
/* [v269] 응답 현황 위젯 — 태그 · 제목/부제/사업부 응답칩 · 진행 막대 · n/t */
.d2-resp{gap:12px;padding:10px 4px}
.d2-rtag{flex:none;font-size:10.5px;font-weight:800;color:#fff;border-radius:6px;padding:3px 8px;white-space:nowrap}
.d2-rbar{flex:0 0 120px;height:8px;background:var(--line);border-radius:999px;overflow:hidden} .d2-rbar i{display:block;height:100%;border-radius:999px}
.d2-rn{flex:none;font-size:15px;font-weight:800;min-width:52px;text-align:right} .d2-rn small{font-size:11px;font-weight:600;color:var(--ink-faint,#67737F)}
.dw-body .d2-ph .more+.more{margin-left:14px}
@media(max-width:780px){ .d2-rbar{display:none} }
/* [v167 위젯정비] 신규 위젯 공용 3지표 줄 — 가로 배치.
   ⚠️ 매출 위젯의 .rm-kpis를 재사용했다가 그게 `.d2-revM` 스코프 전용이라 스타일이 하나도 안 먹고
      세로로 쌓였다(진권 스샷 지적). 남의 스코프 클래스 빌려 쓰지 말 것 — 전용 클래스로 분리. */
.d2-st3{display:flex;gap:8px;margin-bottom:10px}
.d2-st3 .st{flex:1;min-width:0;background:var(--bg);border-radius:11px;padding:8px 10px;text-align:center}
.d2-st3 .st .l{font-size:10.5px;font-weight:700;color:var(--ink-faint);white-space:nowrap}
.d2-st3 .st .v{font-size:20px;font-weight:800;margin-top:2px;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap}
.d2-st3 .st .v small{font-size:11px;font-weight:700;margin-left:1px;color:var(--ink-faint)}
body[data-theme="dark"] .d2-st3 .st{background:rgba(255,255,255,.05)}
.grid-stack-item.dw-hidden{opacity:.5}
.grid-stack-item.dw-hidden .dw-body{filter:grayscale(1)}
.dw-editcap{position:absolute;top:7px;left:9px;right:9px;z-index:6;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:#4b4668;min-width:0}
.dw-editcap .cap-vis{margin-left:auto;cursor:pointer;background:rgba(255,255,255,.94);border:1px solid #e2e0ee;border-radius:7px;padding:3px 9px;white-space:nowrap;flex:none}
.dw-editcap .cap-vis:hover{border-color:var(--navy);background:var(--sea-tint,#EEF4FF)}
.dw-editcap .cap-kpicfg{margin-left:8px;cursor:pointer;background:var(--sea-tint,#EEF4FF);border:1px solid rgba(var(--sea-rgb,27,111,245),.28);color:var(--navy-deep,#2f3a68);font-weight:800;font-size:11.5px;border-radius:7px;padding:3px 9px;white-space:nowrap;flex:none}
.dw-editcap .cap-kpicfg:hover{border-color:var(--navy);background:var(--sea-tint,#EEF4FF)}
.grid-stack-item>.ui-resizable-se{width:16px;height:16px}
/* tier 별 콤팩트(S) 카드 */
.d2-mini{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px 22px;box-shadow:0 10px 30px rgba(36,31,51,.05);display:flex;flex-direction:column;justify-content:center;position:relative}
.d2-mini .m-lab{font-size:12px;color:#8a86a0;font-weight:800;display:flex;align-items:center;gap:7px}
.d2-mini .m-lab .m-ic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex:none}
.d2-mini .m-ic svg{width:15px;height:15px;fill:none;stroke-width:2}
.d2-mini .m-big{font-size:38px;font-weight:800;line-height:1.05;margin-top:8px;color:var(--ink);font-variant-numeric:tabular-nums}
.d2-mini .m-big small{font-size:15px;font-weight:700;margin-left:3px;color:#8a86a0}
.d2-mini .m-sub{font-size:13.5px;color:#6E6B85;font-weight:600;margin-top:7px}
.d2-mini .m-clock{font-size:34px;font-weight:800;letter-spacing:0;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap}
.d2-mini .m-clock .cs{font-size:15px;font-weight:700;color:#8a86a0;background:#f0eff6;border-radius:6px;padding:1px 5px;margin-left:5px;vertical-align:3px}
/* v114: 구매·재고 위젯 행 */
.d2-prow{display:flex;align-items:center;gap:9px;padding:10px 4px;border-bottom:1px solid var(--line-soft);cursor:pointer;font-size:14px}
.d2-prow:last-child{border-bottom:none}
.d2-prow:hover{background:#f8f9fd}
body[data-theme="dark"] .d2-prow:hover{background:rgba(255,255,255,.06)}   /* [v167 감사수정] 다크에서 호버가 흰색으로 뒤집히던 것 */
.d2-prow .pd{width:9px;height:9px;border-radius:3px;flex:none}
.d2-prow .pl{color:#6e6880;font-weight:600}
.d2-prow .pv{margin-left:auto;font-size:16px;font-weight:800}
/* v116: 삭제(nth-child display:none) 폐지 — 축소는 JS 요약티어가, 남는 건 리플로우/채움만 담당 */
/* ===== v116: 리사이즈 기준 대응 (채움/반응형) ===== */
.d2-mini.d2-heroS .hs-greet{font-size:14px;font-weight:800;color:#fff;margin-bottom:3px}
/* 히어로 표준(m): heroHtml 세로 스택(짤림 방지, 칩 유지=삭제0) */
/* (.dw-m .d2-hero CSS 제거 — 히어로는 m티어에 heroS(d2-mini) 렌더라 매칭 불가, v117 감사) */
/* 좁은 L 인사말 줄바꿈·날씨 말줄임 */
.d2-hero .d2-hrow{flex-wrap:wrap;gap:14px}
.d2-hero .wx-d{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
/* 결재대기/구매 '더보기' 행 */
.d2-ali.d2-more{justify-content:center;cursor:pointer;border-bottom:none;padding:10px 4px}
.d2-ali.d2-more .d2-moretxt{font-size:12px;font-weight:800;color:var(--navy)}
/* v116-fix: 큰 숫자 글자 상하 짤림 방지(line-height 여유) */
.d2-mini .m-clock{line-height:1.14}
.d2-mini .m-big{line-height:1.14}
.d2-hd .c{line-height:1.12}
.wx-t{line-height:1.16}
.dw-body .d2-prow{padding:8px 4px}
/* 결재현황 L(도넛+범례+막대) 세로 여유 확보 */
/* Gridstack 미로드(file:// 등) 폴백: 세로 스택 */
.grid-stack.no-gs{display:flex;flex-direction:column;gap:16px}
.grid-stack.no-gs .grid-stack-item{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:auto!important;min-height:150px;transform:none!important;inset:auto!important}
.grid-stack.no-gs .grid-stack-item-content{position:relative!important;inset:auto!important;height:auto!important}
.dpm-ov{position:fixed;inset:0;background:rgba(20,26,40,.5);z-index:400;display:flex;align-items:center;justify-content:center;padding:20px}
.dpm{background:#fff;border-radius:16px;max-width:640px;width:100%;max-height:86vh;overflow:auto;box-shadow:0 24px 60px rgba(0,0,0,.3)}
/* v117 권한 A: 6역할 매트릭스 + 사업부 스코프 */
.dpm-dv{font-size:11.5px;padding:4px 11px;border-radius:20px;border:1px solid #e2e0ee;background:#fff;color:#6E6B85;cursor:pointer;user-select:none}
.dpm-dv.on{background:var(--navy-deep,#2f3a68);color:#fff;border-color:var(--navy-deep,#2f3a68)}

/* (구 980px 미디어쿼리 제거 — v114 위젯 전환 후 전부 사문 or 히어로 잘림 유발. v117 감사) */
  /* 합의 부서 선택 (기안·기타) */
  .agree-seg{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;max-width:380px}
  .agree-seg .ao{border:1.5px solid var(--line);border-radius:9px;padding:11px;text-align:center;font-size:14px;font-weight:700;color:var(--ink-soft);cursor:pointer;transition:all .15s}
  .agree-seg .ao:hover{border-color:var(--navy-2)}
  .agree-seg .ao.off,.agree-seg .ao.off:hover{opacity:.45;cursor:not-allowed;border-style:dashed;border-color:var(--line)}   /* [2026-10-20 사용자 ㅎ1] 자기 부서 협조 칸 = 꺼짐 */
  .agree-seg .ao.on{background:var(--navy);border-color:var(--navy);color:#fff}
  /* OCR 종류 → 전용 작성화면 연결 카드 */
  .ocr-launch{display:flex;align-items:center;gap:14px;border:1.5px solid var(--ok);background:var(--ok-soft);border-radius:12px;padding:16px}
  .ocr-launch-ic{width:44px;height:44px;border-radius:11px;background:var(--ok);display:grid;place-items:center;flex:none}
  .ocr-launch-ic svg{width:23px;height:23px;stroke:#fff;fill:none;stroke-width:1.9}
  .ocr-launch-tx{flex:1;min-width:0}
  .ocr-launch-tx b{display:block;font-size:14px;color:var(--ink);margin-bottom:3px}
  .ocr-launch-tx span{font-size:12px;color:var(--ink-soft);line-height:1.5}
  .ocr-launch .btn{flex:none}
  .ocr-launch-note{font-size:11.5px;color:var(--ink-faint);margin-top:9px;line-height:1.55}
  .route-fixed{display:flex;align-items:center;gap:10px;border:1.5px solid #cfe3d6;background:#eef6f0;border-radius:10px;padding:12px 14px;font-size:13.5px;color:#2c6b46;font-weight:600;line-height:1.5}
  .route-fixed svg{width:20px;height:20px;stroke:#2c6b46;fill:none;stroke-width:1.9;flex:none}
  .route-fixed b{color:#1f8a5b}

  /* item editor */
  /* [v263 사내양식] 일자 · 계정과목 · 적요 · 거래처 · 공급가액 · 비고(사용인 명단) · 삭제 */
  /* [2026-09-22 진권] 일자 잘림 → 140 · 적요는 6자 안쪽이라 계정과목보다 살짝 넓게(124) · 남는 폭은 비고·사용인 명단(1fr) · 제목 가운데 */
  .itm-head{display:grid;grid-template-columns:140px 112px 124px 150px 110px 1fr 34px;gap:7px;margin-bottom:6px;font-size:10.5px;font-weight:700;color:var(--ink-faint);padding:0 2px}
  .itm-head span{text-align:center}
  .itm{display:grid;grid-template-columns:140px 112px 124px 150px 110px 1fr 34px;gap:7px;margin-bottom:8px;align-items:center}
  .itm input[readonly]{background:var(--line-soft);color:var(--ink-soft)}
  .itm.acct-need .ic_acct{border-color:var(--warn);background:var(--warn-soft)}
  .itm-pol{font-size:11.5px;color:var(--navy-deep);margin:-3px 0 9px 2px;line-height:1.45}
  .itm-pol b{color:var(--accent-ink)}
  .itm-pol.corp{color:var(--ink-faint)}
  /* [2026-10-01 경비기안 통합] 결재유형 4칸 · 경비기안 [영수증][차계부] 탭 · 귀속월 안내 · 이월 줄 · 지출결의서 용도 · 자동 제목 */
  #fType.type-seg{grid-template-columns:repeat(4,1fr)}
  .exp-tabs{display:flex;gap:6px;background:var(--line-soft);border:1px solid var(--line);border-radius:11px;padding:4px;margin-bottom:10px}
  .exp-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;border:none;background:transparent;border-radius:8px;padding:9px 12px;font:inherit;font-size:14px;font-weight:800;color:var(--ink-soft);cursor:pointer;transition:all .15s}
  .exp-tab small{font-size:11px;font-weight:600;color:var(--ink-faint)}
  .exp-tab:hover{color:var(--ink)}
  .exp-tab.on{background:var(--panel);color:var(--navy);box-shadow:var(--shadow-sm)}
  #itemsBlock .ocr-launch{margin-bottom:6px}
  #itemsBlock .ocr-launch-note{margin:0 0 12px}
  .itm-empty{border:1.5px dashed var(--line);border-radius:10px;padding:14px;text-align:center;font-size:12.5px;color:var(--ink-faint);margin-bottom:8px}
  .itm-pol.carry{color:var(--warn-ink)}
  .itm-pol.carry b{color:var(--warn-ink)}
  .exp-mon-note{font-size:12px;color:var(--ink-soft);line-height:1.5;padding-top:9px}
  .exp-mon-warn{border:1.5px solid #f0c9c4;background:var(--accent-soft);color:var(--accent-ink);border-radius:10px;padding:10px 13px;font-size:13px;font-weight:700;line-height:1.5}
  #expMonWarnBox:empty{display:none}
  .use-seg{grid-template-columns:repeat(4,1fr)}
  input.title-auto{cursor:default}
  .itm input,.itm select{min-width:0;width:100%}
  .itm select{font-family:inherit}
  .itm input.am{text-align:right}
  .itm .del{width:34px;height:38px;flex:none;border:1px solid var(--line);background:var(--panel);border-radius:8px;color:var(--ink-faint);font-size:16px}
  .itm .del:hover{border-color:var(--accent);color:var(--accent-ink)}
  .add-itm{width:100%;border:1.5px dashed var(--line);background:none;border-radius:9px;padding:9px;font-size:13.5px;font-weight:700;color:var(--navy-deep)}
  .add-itm:hover{border-color:var(--navy-2);background:#f7f9fc}
  .itm-sum{text-align:right;font-size:14px;margin-top:8px;color:var(--ink-soft)}
  .itm-sum b{color:var(--ink);font-size:14px}
  .itm-sum b.tot{color:var(--accent-ink);font-size:15px}
  /* 임시저장함 */
  .btn.sm{padding:7px 12px;font-size:13.5px}

  /* route preview in form */
  .route-prev{background:#f7f9fc;border:1px solid var(--line);border-radius:11px;padding:14px 16px;margin-top:6px}
  .route-prev .rl-h{font-size:11.5px;font-weight:700;color:var(--ink-soft);margin-bottom:10px;letter-spacing:.02em}
  .route-prev .steps{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
  .route-prev .st{display:flex;align-items:center;gap:4px}
  .route-prev .st .chip{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:5px 10px;font-size:11.5px;font-weight:700;color:var(--ink)}
  .route-prev .st .chip.agree{border-color:#f0c9c4;background:var(--accent-soft);color:var(--accent-ink)}
  .route-prev .st .chip.final{border-color:#e3cfa6;background:#fbf6ec;color:var(--warn-ink)}
  .route-prev .st .arr{color:var(--ink-faint);font-size:11px}
  /* ===== [v193 내 결재선] 편집기 ===== */
  .route-prev .rl-h{display:flex;align-items:center;gap:8px}
  .route-prev .st .chip.mine{border-color:#9fc6ea;background:#EFF6FC;color:#1F4E79}
  .route-prev .st .chip .lk{font-size:9px;opacity:.55}
  .apl-btn{margin-left:auto;background:var(--panel);border:1px solid var(--line);border-radius:7px;
           font-family:inherit;font-size:11px;font-weight:800;color:var(--ink-soft);padding:4px 10px;cursor:pointer}
  .apl-btn:hover{border-color:var(--navy);color:var(--navy)}
  .apl-box{margin-top:12px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
  .apl-row{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink)}
  .apl-row b{font-weight:800;font-size:12.5px}
  .apl-note{font-size:11px;color:var(--ink-faint);font-weight:600}
  .apl-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;min-height:26px}
  .apl-empty{font-size:11.5px;color:var(--ink-faint)}
  .apl-chip{display:inline-flex;align-items:center;gap:4px;border-radius:8px;padding:4px 5px 4px 10px;
            font-size:11.5px;font-weight:800;background:#EFF6FC;color:#1F4E79;border:1px solid #9fc6ea}
  .apl-chip.cc{background:#F3F0FB;color:#4B3B8F;border-color:#c3b6e8}
  .apl-chip button{border:0;background:transparent;color:inherit;opacity:.6;cursor:pointer;font-size:10px;
                   min-width:20px;min-height:20px;border-radius:5px}
  .apl-chip button:hover{opacity:1;background:rgba(0,0,0,.07)}
  .apl-cands{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;max-height:150px;overflow-y:auto}
  .apl-cand{display:inline-flex;align-items:stretch;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--panel)}
  .apl-cand button{border:0;background:transparent;font-family:inherit;font-size:11.5px;font-weight:700;
                   color:var(--ink);padding:5px 9px;cursor:pointer;min-height:30px}
  .apl-cand button i{font-style:normal;font-weight:600;opacity:.5;font-size:10px;margin-left:4px}
  .apl-cand button:hover{background:var(--line-soft)}
  .apl-cand button.cc{border-left:1px solid var(--line);color:#4B3B8F;padding:5px 8px}
  .apl-foot{display:flex;align-items:center;gap:8px;margin-top:11px;padding-top:9px;border-top:1px dashed var(--line)}
  /* ===== [v175 참조자] 문서 참조(Cc) — 결재는 안 하지만 문서를 볼 수 있는 사람 =====
     문제: '참조 —' 자리는 문서상세·공문에 이미 파여 있는데 데이터가 없어서,
           결재선 4명 외에는 자기 사업부 문서를 볼 경로가 아예 없었다.
     ⚠️ .cc- 프리픽스 금지 — .cc-badges(차량 OCR 금액 셀)가 이미 점유 중이라 .rcc-/.dcc- 를 쓴다. */
  .rcc-box{border:1px solid var(--line);border-radius:11px;padding:7px;display:flex;flex-wrap:wrap;gap:5px;align-items:center;min-height:46px;background:var(--panel)}
  .rcc-box:focus-within{border-color:var(--navy-2)}
  .rcc-chip{display:inline-flex;align-items:center;gap:5px;background:var(--line-soft);border:1px solid var(--line);border-radius:999px;padding:3px 5px 3px 4px;font-size:12px;font-weight:700;color:var(--ink)}
  .rcc-chip .x{border:0;background:transparent;cursor:pointer;color:var(--ink-faint);font-weight:800;font-size:13px;line-height:1;padding:0 3px}
  .rcc-chip .x:hover{color:var(--accent-ink)}
  /* ⚠️ 특이도 주의 — .fld input(801줄, 0-2-0)이 단일 클래스 .rcc-in(0-1-0)을 이겨서
     참조 입력칸에 테두리·배경·padding이 다시 붙어 '박스 속 박스'가 됐다. .rcc-box를 앞에 붙여 0-2-0으로 맞춘다. */
  .rcc-box .rcc-in{border:0;outline:0;flex:1;width:auto;min-width:130px;font-family:inherit;font-size:13px;font-weight:600;padding:6px 4px;border-radius:0;background:transparent;color:var(--ink)}
  .rcc-box .rcc-in:focus{outline:0;border:0;box-shadow:none}
  .rcc-wrap{position:relative}
  .rcc-sug{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--panel);border:1px solid var(--line);border-radius:11px;box-shadow:0 12px 30px rgba(19,27,22,.16);z-index:30;max-height:240px;overflow:auto;display:none}
  .rcc-sug.on{display:block}
  .rcc-si{display:flex;align-items:center;gap:9px;padding:9px 11px;cursor:pointer;font-size:12.5px;font-weight:700;border-bottom:1px solid var(--line-soft);color:var(--ink)}
  .rcc-si:last-child{border-bottom:0}
  .rcc-si:hover,.rcc-si.hl{background:var(--line-soft)}
  .rcc-si .m{margin-left:auto;font-size:11px;color:var(--ink-faint);font-weight:600}
  .rcc-tools{display:flex;gap:6px;margin-top:7px;align-items:center;flex-wrap:wrap}
  .rcc-btn{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:6px 11px;font-family:inherit;font-size:12px;font-weight:800;color:var(--ink-soft);cursor:pointer}
  .rcc-btn:hover{border-color:var(--navy-2)}
  .rcc-btn.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .rcc-note{font-size:11.5px;color:var(--ink-faint);font-weight:600;margin-left:auto}
  /* 조직도 트리는 인라인 패널로 — 작성 모달이 lockBackdrop으로 떠 있어서 showModal을 겹치면 #modalRoot가 통째로 덮어써진다 */
  .rcc-tree{margin-top:7px;border:1px solid var(--line);border-radius:11px;max-height:252px;overflow:auto;background:var(--panel);display:none}
  .rcc-tree.on{display:block}
  .rcc-tn{display:flex;align-items:center;gap:8px;padding:8px 11px;border-bottom:1px solid var(--line-soft);cursor:pointer;font-size:12.5px;font-weight:700;color:var(--ink)}
  .rcc-tn:last-child{border-bottom:0}
  .rcc-tn:hover{background:var(--line-soft)}
  .rcc-tn.dv{background:var(--line-soft);font-weight:800}
  .rcc-tn .ck{width:17px;height:17px;flex:none;border-radius:5px;border:1.5px solid var(--line);display:grid;place-items:center;background:var(--panel);color:#fff;font-size:11px;font-weight:800}
  .rcc-tn.on .ck{background:var(--navy);border-color:var(--navy)}
  .rcc-tn.part .ck{border-color:var(--navy);color:var(--navy)}
  .rcc-tn .ind{width:14px;flex:none}
  .rcc-tn .rk{margin-left:auto;font-size:11px;color:var(--ink-faint);font-weight:600}
  .dcc-chip{display:inline-flex;align-items:center;gap:4px;background:var(--line-soft);border-radius:999px;padding:2px 9px;font-size:11.5px;font-weight:700;color:var(--ink-soft);margin:1px 3px 1px 0}
  /* ===== [v176 사내설문] 공지에 질문을 붙여 답을 받는다 (A안 응답자리 + C안 빌더) =====
     문제: NOTICE_ACK[공지id][이름]에 '확인시각' 하나만 담겨 답을 넣을 칸이 없었다.
     그래서 안전화 사이즈·명절선물·신청접수가 전부 카톡·전화로 돌았다.
     색은 전부 var() 토큰 — 다크(#0F1512) 대응 */
  .svq-sec{border:1px solid var(--line);border-radius:11px;padding:11px;margin-top:9px;background:var(--panel)}
  .svq-sech{display:flex;align-items:center;gap:8px;margin-bottom:9px}
  .svq-sech b{font-size:12.5px;font-weight:800}
  .svq-sech .cnt{font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:20px;background:var(--navy);color:#fff}
  .svq-card{border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:7px;background:var(--panel)}
  .svq-ch{display:flex;align-items:center;gap:6px;margin-bottom:7px}
  .svq-ch .t{flex:1;min-width:0;font-size:12.5px;font-weight:800}
  .svq-ty{font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:5px;background:var(--line-soft);color:var(--ink-soft);flex:none}
  .svq-pii{font-size:10.5px;font-weight:800;padding:2px 7px;border-radius:5px;background:var(--accent-soft);color:var(--accent-ink);flex:none}
  .svq-cond{font-size:11px;font-weight:700;color:var(--navy);margin-bottom:5px}
  .svq-x{border:0;background:transparent;color:var(--ink-faint);cursor:pointer;font-weight:800;font-size:14px;line-height:1;padding:0 3px;flex:none}
  .svq-x:hover{color:var(--accent-ink)}
  .svq-tybar{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
  .svq-tyb{border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:5px 9px;font-family:inherit;font-size:11.5px;font-weight:700;color:var(--ink-soft);cursor:pointer}
  .svq-tyb:hover{border-color:var(--navy-2);color:var(--navy)}
  .svq-ed{border-top:1px solid var(--line-soft);margin-top:8px;padding-top:8px}
  .svq-ed .row{display:flex;gap:6px;margin-bottom:6px;flex-wrap:wrap}
  .svq-ed input[type=text]{flex:1;min-width:120px;border:1px solid var(--line);border-radius:7px;padding:6px 9px;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--ink);background:var(--panel)}
  .svq-ed select{border:1px solid var(--line);border-radius:7px;padding:6px 8px;font-family:inherit;font-size:12px;font-weight:700;color:var(--ink);background:var(--panel)}
  .svq-ck{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:var(--ink-soft);cursor:pointer}
  /* 응답 위젯 */
  .svq-q{margin-bottom:13px}
  .svq-qt{font-size:13.5px;font-weight:800;margin-bottom:6px;display:flex;gap:6px;align-items:flex-start}
  .svq-qt .rq{color:var(--accent-ink)}
  .svq-hint{font-size:11.5px;color:var(--ink-faint);font-weight:600;margin-bottom:6px}
  .svq-opl{display:flex;flex-direction:column;gap:6px}
  .svq-o{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:9px;padding:9px 11px;cursor:pointer;font-size:13px;font-weight:700;background:var(--panel);transition:border-color .13s,background .13s}
  .svq-o:hover{border-color:var(--navy-2)}
  .svq-o.on{border-color:var(--navy);background:var(--line-soft)}
  .svq-o .rd{width:17px;height:17px;border-radius:50%;border:2px solid var(--line);flex:none;display:grid;place-items:center}
  .svq-o.on .rd{border-color:var(--navy)}
  .svq-o.on .rd::after{content:'';width:9px;height:9px;border-radius:50%;background:var(--navy)}
  .svq-o .ck{width:17px;height:17px;border-radius:5px;border:2px solid var(--line);flex:none;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800}
  .svq-o.on .ck{background:var(--navy);border-color:var(--navy)}
  .svq-sz{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:6px}
  .svq-szb{border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:9px 0;text-align:center;font-size:13px;font-weight:800;cursor:pointer;color:var(--ink)}
  .svq-szb:hover{border-color:var(--navy-2)}
  .svq-szb.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .svq-in{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:13px;font-weight:600;color:var(--ink);background:var(--panel)}
  .svq-in:focus{outline:none;border-color:var(--navy-2)}
  .svq-piinote{display:flex;gap:7px;align-items:flex-start;margin-top:6px;padding:8px 10px;border-radius:8px;background:var(--accent-soft);color:var(--accent-ink);font-size:11.5px;font-weight:700;line-height:1.5}
  /* 집계 */
  .svq-bar{display:flex;align-items:center;gap:8px;margin-bottom:5px;font-size:12px;font-weight:700}
  .svq-bar .nm{flex:0 0 92px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .svq-bar .tr{flex:1;height:16px;border-radius:5px;background:var(--line-soft);overflow:hidden}
  .svq-bar .tr i{display:block;height:100%;border-radius:5px;background:var(--navy)}
  .svq-bar .vl{flex:0 0 54px;text-align:right;font-variant-numeric:tabular-nums;color:var(--ink)}
  .svq-aggh{font-size:12.5px;font-weight:800;margin:13px 0 7px;display:flex;align-items:center;gap:6px}
  .svq-masked{color:var(--ink-faint);letter-spacing:1px}

  /* ===== DOC DETAIL (read) ===== */
  .doc-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px}
  .doc-head .ttl{flex:1}
  .doc-head .ttl h2{font-size:20px;font-weight:800;line-height:1.3}
  .doc-head .ttl .m{font-size:13.5px;color:var(--ink-faint);margin-top:6px}
  /* 종이 결재 양식 도장란 */
  .stamp-wrap{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px;flex-wrap:wrap}
  .stamp-wrap.stamp-stack{flex-direction:column;align-items:flex-end;gap:8px}   /* [2026-10-21 인계 #9] 자재구입 = 위 본결재 · 아래 합의 */
  .stamp-tbl{border-collapse:collapse}
  .stamp-tbl th,.stamp-tbl td{border:1px solid #c9cdd6;text-align:center}
  .stamp-tbl th{background:#f7f9fc;font-size:11px;font-weight:700;color:var(--ink-soft);width:76px;height:38px;padding:4px 5px;vertical-align:middle;line-height:1.2;white-space:nowrap}
  .stamp-tbl .st-side{background:#eef0f4;width:24px;font-size:11px;font-weight:700;color:var(--ink-soft);line-height:1.35;padding:0;letter-spacing:.02em}
  .stamp-tbl.agree th{background:#eef4ee}
  .stamp-tbl.agree .st-side{background:rgba(var(--sea-rgb,27,111,245),.12);color:var(--navy-deep)}   /* [v201] 브랜드 톤 전환 */
  .st-cell{position:relative;height:52px;width:76px;padding:2px;vertical-align:middle}
  .st-ord{position:absolute;top:2px;left:4px;font-size:9px;font-weight:800;color:var(--ink-faint,#67737F);line-height:1}
  .st-mark{font-size:13.5px;font-weight:800;line-height:1.1}
  .st-mark.stamped{color:var(--accent-ink)}
  .st-mark.rejected{color:#fff;background:#C4534E;border-radius:5px;padding:2px 7px;display:inline-block;line-height:1.2}   /* [v229] 승인 이름(코랄 --accent)과 같은 색이라 혼선 → 빨강 칩(흰 글자)으로 분리(진권 지시) */
  .st-mark.await{color:var(--warn-ink);font-size:10.5px;font-weight:800}
  .st-mark.empty{color:#c9cdd6;font-weight:400}
  .st-date{font-size:9px;color:var(--ink-faint);margin-top:2px}
  .st-name{font-size:10px;color:var(--ink-faint);margin-top:2px}
  .st-name.wait{font-size:11px;color:#aab0bd;font-weight:600;margin-top:0}
  .doc-meta{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-bottom:20px}
  .doc-meta .mr{display:flex;border-bottom:1px solid var(--line-soft)}
  /* [v175 감사수정] 참조 셀이 7번째로 붙으면서 2열 그리드의 마지막 행이 반쪽이 됐고,
     nth-last-child(-n+2)가 6·7번째를 잡아 3행 테두리가 끊겼다.
     → 참조 셀은 grid-column:1/-1 전폭(.mr.full)으로 두고, 테두리 제거는 마지막 셀만. */
  .doc-meta .mr.full{grid-column:1/-1}
  .doc-meta .mr:last-child{border-bottom:none}
  .doc-meta .mr:nth-last-child(2):not(.full){border-bottom:none}
  .doc-meta .k{width:90px;background:#f7f9fc;padding:11px 13px;font-size:12px;font-weight:700;color:var(--ink-soft);flex:none;border-right:1px solid var(--line-soft)}
  .doc-meta .v{padding:11px 13px;font-size:14px;flex:1}

  .doc-body-box{border:1px solid var(--line);border-radius:11px;padding:18px;margin-bottom:20px;font-size:14px;line-height:1.9;white-space:pre-wrap}
  table.di{width:100%;border-collapse:collapse;margin-top:14px}
  table.di th,table.di td{border:1px solid var(--line);padding:9px 11px;font-size:13.5px;text-align:center}
  table.di th{background:#f7f9fc;font-weight:700;color:var(--ink-soft)}
  table.di tr.sum td{font-weight:800;background:#fafbfd}
  table.di.acct th,table.di.acct td{padding:8px 9px;font-size:12px}
  @media(max-width:600px){ table.di.acct{display:block;overflow-x:auto;width:0;min-width:100%} }   /* [2026-10-03] 폰 — 경비 표(칸 9개) 칸이 낱말 폭을 지키며(글자 단위로 안 쪼갬) 모달보다 넓어지면 표만 가로 스크롤(폭 0 + 최소 100% = 바깥을 밀지 않는다) */
  table.di tr.sum.tot td{background:#f3f6fc;color:var(--navy)}

  /* approval line vertical */
  .aline{border:1px solid var(--line);border-radius:11px;overflow:hidden}
  .aline .ah{padding:13px 16px;background:#f7f9fc;font-size:13.5px;font-weight:800;border-bottom:1px solid var(--line)}
  .astep{display:flex;align-items:center;gap:11px;padding:9px 16px;border-bottom:1px solid var(--line-soft)}
  .astep:last-child{border-bottom:none}
  .astep .aic{width:28px;height:28px;border-radius:8px;flex:none;display:grid;place-items:center;background:var(--sea-tint,#eaf1fb);color:var(--navy)}
  .astep .aic svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9}
  .astep.agr .aic{background:#fdeae6;color:var(--accent-ink)}
  .astep.fin .aic{background:#fdf2dc;color:#d9920f}
  .astep.wait .aic{opacity:.55}
  .astep .who{flex:1;min-width:0}
  .astep .who b{font-size:13.5px;font-weight:700}
  .astep .who .r{font-size:11px;color:var(--ink-faint)}
  .astep .stt{font-size:11.5px;font-weight:700;display:flex;align-items:center;gap:5px;white-space:nowrap}
  .astep .stt .sdot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
  .astep.done .stt{color:var(--ok-ink)}
  .astep.cur .stt{color:var(--warn-ink)}
  .astep.rej .stt{color:var(--accent-ink)}
  .astep.wait .stt{color:var(--ink-faint)}
  .astep-time{font-size:10.5px;color:var(--ink-faint);margin-top:2px}   /* [v128 타임라인] */
  .dwell{display:inline-block;font-size:10px;font-weight:800;border-radius:5px;padding:0 5px;background:#eef2f6;color:#5a6b86;margin-left:3px}
  .dwell.a3{background:#fbeecf;color:var(--warn-ink,#8A5A12)}
  .dwell.a5{background:#fdeaea;color:#C4534E}

  /* ===== 첨부파일 ===== */
  .clip-chip{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:800;color:var(--navy-deep);background:var(--sea-tint,#e8eefa);border-radius:20px;padding:1px 8px 1px 6px;vertical-align:middle;margin-left:4px}
  /* v124(UX②): 결재 대기 경과일 배지 — 플랫(흰 배경+테두리), 3일 주황·5일 빨강 */
  /* v124(UI①): 퀵 프리뷰 레이어 (z-420: 문서모달 100 위 · 커맨드팔레트 500 아래) */
  .qv-ov{position:fixed;inset:0;z-index:420;background:rgba(18,24,38,.78);backdrop-filter:blur(2px);display:flex;flex-direction:column;animation:ofade .15s ease-out}
  .qv-top{display:flex;align-items:center;gap:12px;padding:12px 18px;color:#fff}
  .qv-name{font-weight:800;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:44vw}
  .qv-meta{font-size:12px;color:rgba(255,255,255,.72);margin-right:auto;white-space:nowrap}
  .qv-act{color:#fff;text-decoration:none;font-size:13.5px;font-weight:700;border:1px solid rgba(255,255,255,.35);border-radius:9px;padding:6px 12px;white-space:nowrap}
  .qv-act:hover{background:rgba(255,255,255,.12)}
  .qv-x{background:none;border:0;color:#fff;font-size:18px;cursor:pointer;padding:6px 10px;line-height:1}
  .qv-body{flex:1;display:grid;place-items:center;padding:0 64px 24px;min-height:0}
  .qv-img{max-width:100%;max-height:100%;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
  .qv-pdf{width:100%;height:100%;border:0;border-radius:10px;background:#fff}
  .qv-none{background:#fff;border-radius:14px;padding:34px 44px;text-align:center;color:var(--ink-soft);display:grid;gap:8px;justify-items:center;max-width:420px}
  .qv-none svg{width:38px;height:38px;stroke:var(--ink-faint);fill:none;stroke-width:1.6}
  .qv-none b{color:var(--ink);font-size:14px;word-break:break-all}
  .qv-dlbtn{margin-top:6px;background:var(--navy);color:#fff;border-radius:10px;padding:9px 18px;text-decoration:none;font-weight:800;font-size:14px}
  .qv-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:26px;line-height:1;cursor:pointer;z-index:1}
  .qv-nav:hover{background:rgba(255,255,255,.28)}
  .qv-prev{left:12px}.qv-next{right:12px}
  /* v124(UI②): 자료실 신선도 배지 (Verified) */
  .vfy-badge{display:inline-flex;align-items:center;font-size:10.5px;font-weight:800;color:#1f8a5b;background:#eef7f2;border:1px solid #cfe9db;border-radius:20px;padding:1px 8px;vertical-align:middle;margin-left:5px;white-space:nowrap}
  .vfy-btn{display:inline-flex;align-items:center;font-size:10.5px;font-weight:700;color:var(--ink-soft);background:#fff;border:1px solid var(--line);border-radius:8px;padding:2px 8px;vertical-align:middle;margin-left:5px;cursor:pointer;white-space:nowrap}
  .vfy-btn:hover{border-color:#1f8a5b;color:#1f8a5b}
  /* v124(UI③): 접근성 베이스라인 — 키보드 포커스 링(마우스 클릭엔 안 뜸) */
  :focus-visible{outline:2px solid var(--navy-2);outline-offset:2px;border-radius:4px}
  .nav a:focus-visible,.div-pill:focus-visible,.mode-btn:focus-visible{outline-offset:-2px}
  .tbl-scroll:focus-visible{outline-offset:-2px}
  .clip-chip svg{width:12px;height:12px;stroke:var(--navy-2);fill:none;stroke-width:2}
  .att-count{display:inline-grid;place-items:center;min-width:19px;height:19px;background:var(--navy);color:#fff;border-radius:20px;font-size:11px;font-weight:800;padding:0 6px}
  .att-alert{display:flex;align-items:center;gap:9px;margin-bottom:14px;padding:11px 14px;background:var(--sea-tint,#EEF4FF);border:1px solid rgba(var(--sea-rgb,27,111,245),.28);border-radius:10px;font-size:13.5px;color:var(--navy);font-weight:500}
  .att-alert svg{width:18px;height:18px;stroke:var(--navy-2);fill:none;stroke-width:2;flex:none}
  .att-alert b{font-weight:800}
  /* [v177 폰수리] 1fr은 '내용보다 작아지지 않는' 최소폭을 갖는다 — 파일명이 nowrap이라
     트랙이 밀려 첨부 카드가 모달 밖으로 나갔다(390px 실측: scrollWidth 536 vs client 302, 카드 right 569 vs 모달 365).
     minmax(0,1fr)로 최소폭을 0으로 풀면 오버플로가 사라진다(실측 536→302).
     ⚠️ .att-info/.an(1613)의 nowrap은 건드리지 않는다 — 기안 작성 폼의 첨부 목록(renderUpList)이 같은 클래스를 쓴다. */
  .att-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .att-item{display:flex;align-items:center;gap:11px;border:1px solid var(--line);border-radius:11px;padding:11px 13px;background:var(--panel);text-align:left;transition:all .15s;width:100%}
  .att-item:hover{border-color:var(--navy-2);background:#f7f9fc;box-shadow:var(--shadow-sm)}
  .att-ic{width:38px;height:38px;border-radius:9px;flex:none;display:grid;place-items:center}
  .att-ic svg{width:20px;height:20px;fill:none;stroke-width:1.8}
  .att-ic.k-image{background:#e7f3ff}.att-ic.k-image svg{stroke:#2d7dd2}
  .att-ic.k-pdf{background:#fdeaea}.att-ic.k-pdf svg{stroke:#d6453d}
  .att-ic.k-sheet{background:#e7f6ec}.att-ic.k-sheet svg{stroke:#1f8a5b}
  .att-ic.k-word{background:#e8eefa}.att-ic.k-word svg{stroke:var(--navy)}
  .att-ic.k-ppt{background:#fdf0e6}.att-ic.k-ppt svg{stroke:#d2792d}
  .att-ic.k-zip,.att-ic.k-file{background:#eef0f4}.att-ic.k-zip svg,.att-ic.k-file svg{stroke:var(--ink-soft)}
  .att-info{min-width:0;flex:1;display:flex;flex-direction:column}
  .att-info .an{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .att-info .as{font-size:11px;color:var(--ink-faint);margin-top:1px}
  .att-open{flex:none;width:26px;height:26px;border-radius:7px;background:var(--sea-tint,#eef2f8);display:grid;place-items:center}
  .att-open svg{width:14px;height:14px;stroke:var(--navy-2);fill:none;stroke-width:2.2}
  .att-footnote{margin-top:14px;font-size:12px;color:var(--ink-soft);padding:9px 0;border-top:1px dashed var(--line)}
  /* 작성 폼 드롭존 */
  .att-drop{display:flex;flex-direction:column;align-items:center;gap:5px;border:1.5px dashed var(--line);border-radius:11px;padding:22px;cursor:pointer;transition:all .15s;text-align:center}
  .att-drop:hover,.att-drop.over{border-color:var(--navy-2);background:#f7f9fc}
  .att-drop svg{width:26px;height:26px;stroke:var(--navy-2);fill:none;stroke-width:1.8;margin-bottom:3px}
  .att-drop span{font-size:13.5px;color:var(--ink-soft)}
  .att-drop b{color:var(--navy-deep)}
  .att-drop .att-hint{font-size:11px;color:var(--ink-faint)}
  .up-count{font-size:11.5px;font-weight:700;color:var(--ink-soft);margin:12px 0 8px}
  .up-item{display:flex;align-items:center;gap:11px;border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-bottom:7px;background:var(--panel)}
  .up-del{width:28px;height:28px;flex:none;border:1px solid var(--line);background:var(--panel);border-radius:7px;color:var(--ink-faint);font-size:15px}
  .up-del:hover{border-color:var(--accent);color:var(--accent-ink)}

  /* ===== 사내 알림 팝업 ===== */
  .inapp-wrap{position:fixed;right:22px;bottom:22px;z-index:300;display:flex;flex-direction:column;gap:12px;align-items:flex-end}

  /* 헤더 알림 종/패널 */
  .notif-wrap-hdr{position:relative}
  .notif-bell{position:relative;width:40px;height:40px;border:1.5px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);border-radius:10px;color:#fff;cursor:pointer;display:grid;place-items:center;transition:all .15s}
  .notif-bell svg{width:19px;height:19px;stroke:var(--navy);fill:none;stroke-width:2}
  .notif-badge{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#D76A6F;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px #fff}
  .notif-badge[hidden]{display:none}
  .notif-panel{position:absolute;top:50px;right:0;width:366px;max-height:460px;overflow-y:auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 46px rgba(28,36,51,.24);z-index:260}
  .notif-panel-h{position:sticky;top:0;background:var(--panel);display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:1px solid var(--line-soft);font-size:14px;font-weight:800;color:var(--ink)}
  .np-clear{margin-left:auto;font-size:11.5px;font-weight:700;color:var(--navy-deep);background:none;border:none;cursor:pointer}
  .np-clear:hover{text-decoration:underline}
  .notif-item{display:flex;gap:11px;padding:13px 16px;border-bottom:1px solid var(--line-soft);cursor:pointer;transition:background .12s}
  .notif-item:last-child{border-bottom:none}
  .notif-item:hover{background:#f5f8fd}
  .notif-item.unread{background:var(--sea-tint,#eef6ff)}
  .notif-ic{width:34px;height:34px;border-radius:9px;flex:none;display:grid;place-items:center}
  .notif-ic svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:2}
  .ni-txt{min-width:0}
  .ni-txt b{display:block;font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ni-txt .ni-sub{font-size:11px;color:var(--ink-soft);display:block;margin-top:2px;line-height:1.4}
  .ni-txt .ni-time{color:var(--ink-faint);font-size:10.5px;margin-top:3px;display:block}
  .notif-empty{padding:36px 16px;text-align:center;color:var(--ink-faint);font-size:13.5px}


  /* ===== 경비 기안서 (OCR) ===== */
  .exp-intro{display:flex;align-items:center;gap:14px;background:#e7f6ec;border:1px solid #b9e3c9;border-radius:14px;padding:16px 18px;margin-bottom:20px}
  .exp-intro-ic{width:42px;height:42px;border-radius:11px;background:#1f8a5b;color:#fff;display:grid;place-items:center;flex:none}
  .exp-intro-ic svg{width:22px;height:22px}
  .exp-intro b{font-size:14px;color:var(--ink)}
  .exp-drop{display:flex;flex-direction:column;align-items:center;gap:14px;border:2px dashed var(--line);border-radius:16px;padding:40px 24px;cursor:pointer;transition:all .15s;text-align:center;background:var(--panel)}
  .exp-drop:hover,.exp-drop.over{border-color:#1f8a5b;background:#f4fbf6}
  .exp-drop-photo{position:relative;width:150px;height:110px;margin-bottom:4px}
  .exp-drop-photo .rc-mini{position:absolute;width:42px;height:58px;background:#fff;border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow-sm)}
  .exp-drop-photo .rc1{left:6px;top:8px;transform:rotate(-9deg);background:#e8eefa}
  .exp-drop-photo .rc2{left:52px;top:4px;transform:rotate(3deg);background:#fdeaea}
  .exp-drop-photo .rc3{left:98px;top:10px;transform:rotate(8deg);background:#e7f6ec}
  .exp-drop-photo .rc4{left:14px;top:50px;transform:rotate(5deg);background:#fdf0e6}
  .exp-drop-photo .rc5{left:58px;top:54px;transform:rotate(-6deg);background:#f0ecfa}
  .exp-drop-photo .rc6{left:100px;top:50px;transform:rotate(10deg);background:#fbf3e0}
  .exp-drop-txt b{font-size:14px;display:block;color:var(--ink)}
  .exp-drop-txt span{font-size:12px;color:var(--ink-faint);display:block;margin-top:3px}

  .exp-status{display:flex;align-items:center;gap:11px;border-radius:12px;padding:14px 18px;font-size:14px;margin-bottom:18px}
  .exp-status b{font-weight:800}
  .exp-status.analyzing{background:var(--sea-tint,#EEF4FF);border:1px solid rgba(var(--sea-rgb,27,111,245),.28);color:var(--navy)}
  .exp-status.review{background:#e7f6ec;border:1px solid #b9e3c9;color:var(--ok-ink)}
  .exp-status.review svg{width:18px;height:18px;stroke:var(--ok);fill:none;stroke-width:2.5;flex:none}
  .exp-status .exp-count{margin-left:auto;font-weight:800;background:var(--navy);color:#fff;padding:3px 12px;border-radius:20px;font-size:12px}
  .spin{width:18px;height:18px;border:2.5px solid rgba(var(--sea-rgb,27,111,245),.25);border-top-color:var(--navy);border-radius:50%;animation:spin .7s linear infinite;flex:none}
  @keyframes spin{to{transform:rotate(360deg)}}

  .exp-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
  .rc-card{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--panel);box-shadow:var(--shadow-sm);transition:all .3s;opacity:0;transform:translateY(8px)}
  .rc-card.loading{opacity:.5;transform:none}
  .rc-card.done{opacity:1;transform:none;animation:rcpop .35s cubic-bezier(.2,.9,.3,1.2)}
  @keyframes rcpop{from{opacity:0;transform:scale(.9) translateY(8px)}to{opacity:1;transform:none}}
  @keyframes scan{0%{top:-30%}100%{top:100%}}
  .rc-info{padding:8px 10px;border-top:1px solid var(--line-soft);min-height:42px;display:flex;flex-direction:column;justify-content:center}
  .rc-info b{font-size:11.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rc-info span{font-size:10.5px;color:var(--ink-faint);margin-top:1px}
  .rc-info .rc-wait{color:var(--navy-deep);font-weight:600;font-size:11px}

  .exp-table td{vertical-align:middle}
  .exp-table .tm{font-size:10.5px;color:var(--ink-faint);margin-top:2px}
  .cat-sel{width:100%;border:1px solid var(--line);border-radius:7px;padding:6px 4px 6px 6px;font-size:11.5px;font-family:inherit;color:var(--navy-deep);font-weight:700;background:#fff;cursor:pointer}
  .cat-sel:focus{outline:none;border-color:var(--navy-2)}
  .exp-table tr.memo-row td{padding-top:0;padding-bottom:12px;border-top:none}
  .exp-table tr:not(.memo-row) td{border-bottom:none;padding-bottom:6px}
  .memo-grid{display:flex;gap:8px;align-items:flex-end;background:#f7f9fc;border:1px dashed var(--line);border-radius:9px;padding:9px 11px}
  .memo-row.low .memo-grid{background:#fdf6e8;border-color:#f0dcae}
  .memo-f{flex:1;display:flex;flex-direction:column;gap:4px}
  .memo-f.sm{flex:0 0 80px}
  .memo-f label{font-size:10.5px;font-weight:700;color:var(--ink-soft)}
  .memo-f input{border:1px solid var(--line);border-radius:7px;padding:7px 9px;font-size:12px;font-family:inherit;background:#fff}
  .memo-f input:focus{outline:none;border-color:var(--navy-2)}
  /* [2026-09-22 (5)] 동석 직원 칩 · 인원 · 식대 정책 표시 · 상신 게이트 배지 */
  .memo-f.ppl{flex:2}
  .memo-f label em{font-style:normal;font-weight:500;color:var(--ink-faint);margin-left:4px}
  .ppl-box{display:flex;flex-wrap:wrap;gap:5px;align-items:center;border:1px solid var(--line);border-radius:7px;padding:4px 6px;background:var(--panel);min-height:33px}
  .ppl-chip{display:inline-flex;align-items:center;gap:3px;background:var(--line-soft);border-radius:999px;padding:2px 4px 2px 9px;font-size:12px;font-weight:600;color:var(--ink)}
  .ppl-chip button{border:0;background:none;color:var(--ink-faint);font-size:11px;padding:0 3px;cursor:pointer}
  .ppl-chip button:hover{color:var(--accent-ink)}
  /* [2026-10-06 동석 중복] 겹친 동석 칩 · 그 영수증 아래 안내 */
  .ppl-chip.ppl-dup{background:var(--warn-soft);color:var(--ink);box-shadow:0 0 0 1px var(--warn)}
  .sdup-line{margin-top:6px;font-size:12px;line-height:1.55;color:var(--ink);text-wrap:pretty}
  .memo-f .ppl-box input.ppl-add{flex:1;min-width:110px;border:0;padding:4px 2px;background:transparent}
  .ppl-n{height:33px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:7px;font-size:12.5px;font-weight:700;background:var(--line-soft)}
  .pol-line{margin-top:6px;font-size:11.5px;color:var(--navy-deep)}
  .pol-line b{color:var(--accent-ink)}
  .amt-td s.pol-orig,.pcrow s.pol-orig{color:var(--ink-faint);font-weight:500}
  .amt-td small{display:block;font-size:11px;font-weight:700;line-height:1.3}
  .amt-td small.pol-rec{color:var(--accent-ink)}
  .amt-td small.pol-info{color:var(--ink-faint);font-weight:500}
  .pol-chip{margin-left:6px;font-size:10.5px;font-weight:700;color:var(--accent-ink);background:var(--accent-soft);border-radius:5px;padding:2px 6px;white-space:nowrap}
  .pol-chip.corp{color:var(--ink-faint);background:var(--line-soft)}
  select.cat-sel.need{border-color:var(--warn);background:var(--warn-soft)}
  /* [2026-09-28] 계정과목 추천 근거 「추천 · 주유」 — OCR 표·작성창 세부 내역의 계정과목 칸 아래. 토큰만(다크 자동) · 칸 폭을 안 넘긴다 */
  .acct-why{display:block;margin-top:3px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px;font-weight:700;line-height:1.3;color:var(--ink-faint)}
  /* [2026-09-28 리뷰] 근거가 칸 높이를 늘려 계정과목 칸만 ~8px 위로 뜨던 것 — 근거를 흐름 밖(absolute)으로 빼고, 그 줄 아래에만 자리를 둔다.
     작성창: .itm(격자 · align-items:center)의 칸은 한 줄 높이 그대로 → 줄 아래 여백 22px 에 근거. OCR 표: 그 행 칸들 아래 패딩을 늘리고 계정과목 칸 바닥에 근거 */
  .ic_acctw{display:block;position:relative;min-width:0}
  .ic_acctw .acct-why{position:absolute;top:100%;left:2px;right:0;margin:2px 0 0}
  .itm.acct-why-on{margin-bottom:22px}
  table.exp-table tr.acct-why-on > td{padding-bottom:22px}
  .exp-table td.acct-td{position:relative}
  .exp-table td.acct-td .acct-why{position:absolute;left:12px;right:12px;bottom:5px;margin:0}
  /* [2026-09-28] 경비 교차검증 칩 — 점선 알약 + 돋보기. OCR 신호등(10px 꽉 찬 색 점)·식대 정책 칩(네모 코랄)·중복 뱃지(실선 빨강)와 모양·색이 다르다.
     색 = 코랄(--accent)과 글자색(--ink)을 **칩 자신에서** 섞은 벽돌색 — 다크에선 --ink 가 밝아 살구색으로 뒤집힌다(토큰만 · 새 색 리터럴 없음) */
  .xc-chip{--xc-c:color-mix(in srgb,var(--accent) 55%,var(--ink));display:inline-flex;align-items:center;gap:3px;margin-left:6px;padding:0 7px 0 5px;border-radius:999px;
    font-size:10.5px;font-weight:800;line-height:17px;white-space:nowrap;vertical-align:middle;cursor:help;
    color:var(--xc-c);background:color-mix(in srgb,var(--xc-c) 9%,transparent);border:1px dashed color-mix(in srgb,var(--xc-c) 60%,transparent)}
  .xc-chip svg{width:11px;height:11px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
  /* OCR 표 — 걸린 행 바로 아래 한 줄(사유 · 「메모에 사유를 적어 주세요」). 행과 붙어 보이게 위 여백을 없앤다 */
  table.exp-table tr.xc-row > td{padding-top:0;padding-bottom:8px}
  .xc-msg{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:12px;line-height:1.45;color:var(--ink-soft);min-width:0}
  .xc-go{font:inherit;font-weight:700;color:color-mix(in srgb,var(--accent) 55%,var(--ink));background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
  .xc-go:focus-visible{outline:2px solid var(--navy);outline-offset:2px;border-radius:3px}
  .xc-done{font-weight:600;color:var(--ink-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
  /* 작성창 세부 내역 — 걸린 줄 아래(식대 정책 줄 .itm-pol 과 같은 자리 모양) */
  .itm-xc{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:-3px 0 9px 2px;font-size:11.5px;line-height:1.45;color:var(--ink-soft)}
  .itm-xc .xc-chip{margin-left:0}
  /* 문서 보기 — 교차검증 한 칸(칩 · 처리 상태 · 기안자 소명 한 줄) */
  .xcd{margin-top:14px;padding:10px 12px;border-radius:10px;border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line));background:color-mix(in srgb,var(--accent) 4%,var(--panel))}
  .xcd-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;color:var(--ink);margin-bottom:2px}
  .xcd-h svg{width:14px;height:14px;fill:none;stroke:color-mix(in srgb,var(--accent) 55%,var(--ink));stroke-width:2.2;stroke-linecap:round}
  .xcd-h small{margin-left:auto;font-size:11.5px;color:var(--ink-faint)}
  .xcd-row{padding:7px 0 5px;border-top:1px dashed var(--line)}
  .xcd-l{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:12.5px;min-width:0}
  .xcd-l .xc-chip{margin-left:0}
  .xcd-n{font-size:11px;font-weight:800;color:var(--ink-faint);min-width:16px}
  .xcd-t{font-weight:700;color:var(--ink);overflow-wrap:anywhere}.xcd-t small{margin-left:6px;font-size:11.5px;font-weight:500;color:var(--ink-faint)}
  .xcd-st{font-size:10.5px;font-weight:800;border-radius:4px;padding:1px 6px;white-space:nowrap}
  .xcd-st.s-confirmed{color:color-mix(in srgb,var(--ok) 60%,var(--ink));background:var(--ok-soft)}
  .xcd-st.s-asked{color:color-mix(in srgb,var(--warn) 55%,var(--ink));background:var(--warn-soft)}
  .xcd-st.s-replied{color:color-mix(in srgb,var(--accent) 55%,var(--ink));background:var(--accent-soft)}
  .xcd-note{margin:3px 0 0 22px;font-size:12px;color:var(--ink-soft);overflow-wrap:anywhere}
  .xcd-reply{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 2px 22px}
  .xcd-in{flex:1 1 220px;min-width:0;font:inherit;font-size:12.5px;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink)}
  .xcd-in:focus{outline:none;border-color:var(--navy)}
  .xcd-hint{font-size:11.5px;color:var(--ink-faint)}
  @media (max-width:560px){ .xcd-note,.xcd-reply{margin-left:0} .xcd-h small{margin-left:0;flex-basis:100%} }
  .gate-wrap:empty{display:none}
  .gate-pend{align-self:center;border:1px solid var(--warn);background:var(--warn-soft);color:#9a6a1c;font-weight:700;font-size:13px;border-radius:999px;padding:7px 14px;cursor:pointer}
  .gate-pend:hover{filter:brightness(.97)}
  .btn.primary:disabled{opacity:.45;cursor:not-allowed}
  table.di s.di-orig{color:var(--ink-faint);font-weight:500}
  .exp-policy-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin-bottom:12px;font-size:12.5px;color:var(--ink-soft)}
  .exp-policy-bar em{font-style:normal;color:var(--ink-faint)}
  .exp-policy-bar .btn{margin-left:auto}
  .ep-hint{font-size:11.5px;color:var(--ink-faint);margin-top:5px;line-height:1.5}
  /* [2026-09-22 (1)] 경비 묶음 상신 창 */
  .expb-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
  .expb-bar select,.expb-bar input{font:inherit;border:1px solid var(--line);border-radius:8px;padding:6px 9px;background:var(--panel);color:var(--ink)}
  .expb-bar label{display:flex;gap:6px;align-items:center;font-size:13px;color:var(--ink-soft)}
  .expb-note{font-size:12px;color:var(--ink-soft);background:var(--line-soft);border-radius:8px;padding:8px 11px;margin-bottom:10px;line-height:1.5}
  .expb-tbl td.n{text-align:right;white-space:nowrap}
  .expb-sum{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:12px}
  .expb-sum div{border:1px solid var(--line);border-radius:10px;padding:9px 11px;display:flex;flex-direction:column;gap:3px}
  .expb-sum span{font-size:11.5px;color:var(--ink-faint)} .expb-sum b{font-size:15px}
  .expb-sum .tot{border-color:var(--navy);background:color-mix(in srgb,var(--navy) 6%,var(--panel))} .expb-sum .tot b{color:var(--navy)}
  .expb-acct{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:12px;color:var(--ink-soft)}
  .expb-empty{padding:34px 10px;text-align:center;color:var(--ink-faint)}
  .bdl-cover{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:6px 0 14px}
  .bdl-cover .expb-sum{margin-top:0}
  .bdl-child{position:relative;margin:16px 0 6px;font-size:13px;padding-left:20px}   /* [2026-10-03 결정 1-②] 왼쪽 막대 → 포스트잇 조각 */
  .bdl-child::before{content:"";position:absolute;left:1px;top:.45em;width:var(--scrap);height:var(--scrap);background:linear-gradient(rgba(255,255,255,.38) 35%,transparent 35%),var(--navy);border-radius:1px;transform:rotate(var(--scrap-rot));box-shadow:var(--scrap-sh)}
  .bdl-child small{color:var(--ink-faint);margin-left:6px}
  /* [2026-09-22 (8)] 중복 영수증 — 빨간 줄 + 사유 + 빼기 · 상신 때 전체 목록 창 */
  tr.exp-dup td{background:var(--accent-soft)}
  tr.dup-row td{padding-top:0!important;border-top:0!important}
  .dup-msg{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--accent-soft);border:1px solid var(--accent);border-radius:8px;padding:7px 10px;font-size:12.5px;color:var(--ink)}
  .dup-msg a.dup-doc{color:var(--navy);font-weight:700;text-decoration:underline}
  .dup-msg .btn.sm{margin-left:auto;padding:4px 10px;font-size:12px}
  .dup-msg .dup-hint{margin-left:auto;font-size:11.5px;color:var(--ink-faint)}
  .dup-dlg-back{position:fixed;inset:0;z-index:10050;background:rgba(15,22,40,.45);display:flex;align-items:center;justify-content:center;padding:16px}
  .dup-dlg{background:var(--panel);border-radius:14px;box-shadow:var(--shadow-lg);width:min(640px,100%);max-height:80vh;display:flex;flex-direction:column;overflow:hidden}
  .dup-dlg-h{padding:14px 18px;font-weight:800;font-size:15px;color:var(--accent-ink);border-bottom:1px solid var(--line)}
  .dup-dlg ul{list-style:none;margin:0;padding:6px 18px;overflow:auto}
  .dup-dlg li{padding:10px 0;border-bottom:1px solid var(--line-soft);display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:1.5}
  .dup-dlg li span{color:var(--ink-soft)}
  .dup-dlg-f{padding:12px 18px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ink-faint)}
  .dup-dlg-f .btn{margin-left:auto}
  .dup-dlg-f .btn + .btn{margin-left:0}   /* [2026-10-06 동석 중복] 버튼 두 개(닫기 · 빼고 다시 계산) */
  table.di .di-pol{font-size:11px;color:var(--navy-deep);margin-top:2px}
  table.dl tr.low td{background:#fbf3e0!important}
  .conf{font-size:11px;font-weight:800;padding:3px 9px;border-radius:20px}
  .conf.ok{background:var(--ok-soft);color:var(--ok-ink)}
  .conf.low{background:var(--warn-soft);color:var(--warn-ink)}
  .exp-edit{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:6px;padding:5px 6px;font-size:12px;font-family:inherit;color:var(--navy-deep);font-weight:700;background:#fff}
  .exp-edit:focus{outline:none;border-color:var(--navy-2)}
  .exp-total{display:flex;align-items:center;padding:16px 20px;border-top:2px solid var(--line)}
  .exp-total-l{font-size:14px;color:var(--ink-soft)}
  .exp-total-l b{color:var(--ink);font-size:15px}
  .exp-total-r{margin-left:auto;font-size:14px;color:var(--ink-soft)}
  .exp-total-r b{color:var(--accent-ink);font-size:22px;font-weight:800}

  .toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--navy-deep);color:#fff;padding:13px 22px;border-radius:11px;font-size:14px;font-weight:600;box-shadow:var(--shadow-lg);z-index:200;opacity:0;transition:all .35s cubic-bezier(.2,.9,.3,1.2);display:flex;align-items:center;gap:10px}
  /* ===== 연차 캘린더 ===== */
  .lv-intro{display:flex;align-items:center;gap:14px;background:var(--sea-tint,#eef2fb);border:1px solid rgba(var(--sea-rgb,27,111,245),.2);border-radius:14px;padding:16px 18px;margin-bottom:18px}
  .lv-intro-ic{width:42px;height:42px;border-radius:11px;background:var(--navy);color:#fff;display:grid;place-items:center;flex:none}
  .lv-intro-ic svg{width:22px;height:22px}
  .lv-intro b{font-size:14px;color:var(--ink)}
  .lv-bar{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
  .div-pills{display:flex;gap:7px;flex-wrap:wrap}
  .div-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:7px 14px;font-size:13.5px;font-weight:700;color:var(--ink-soft);cursor:pointer}
  .div-pill:hover{border-color:var(--navy-2)}
  .div-pill.on{background:var(--dvc,var(--navy));color:#fff;border-color:var(--dvc,var(--navy))}   /* v122: 사업부 색상 통일 */
  .div-pill.on .lg-dot{box-shadow:0 0 0 2px rgba(255,255,255,.8)}   /* v122: 활성 칩 위 점 가시성 */
  .lg-dot{width:9px;height:9px;border-radius:50%;flex:none;display:inline-block}
  .lv-modes{margin-left:auto;display:flex;background:#eef0f4;border-radius:10px;padding:3px}
  .mode-btn{border:none;background:transparent;padding:7px 15px;border-radius:8px;font-size:13.5px;font-weight:700;color:var(--ink-soft);cursor:pointer}
  .mode-btn.on{background:#fff;color:var(--navy);box-shadow:var(--shadow-sm)}
  .cal-wrap{padding:18px 20px}
  .cal-head{display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:14px}
  .cal-head h3{font-size:16px;font-weight:800;min-width:150px;text-align:center}
  .cal-nav{width:32px;height:32px;border:1px solid var(--line);background:var(--panel);border-radius:9px;font-size:18px;color:var(--ink-soft);cursor:pointer;line-height:1}
  .cal-nav:hover{border-color:var(--navy-2);color:var(--navy)}
  .cal-grid{display:grid;grid-template-columns:repeat(7,1fr)}
  .cal-dowc{text-align:center;font-size:12px;font-weight:700;color:var(--ink-soft);padding:8px 0}
  .cal-dowc.sun{color:var(--accent-ink)}.cal-dowc.sat{color:var(--navy)}
  .cal-cell{min-height:96px;border:1px solid var(--line-soft);padding:5px 6px;display:flex;flex-direction:column;gap:3px}
  .cal-cell.pad{background:#fafbfc}
  .cal-d{font-size:12px;font-weight:700;color:var(--ink-soft);margin-bottom:1px}
  .cal-cell.sun .cal-d{color:var(--accent-ink)}.cal-cell.sat .cal-d{color:var(--navy)}
  /* 연속 연차 막대(주 단위) */
  .cal-weeks{display:flex;flex-direction:column}
  .cal-week{position:relative;display:block;border:0}
  .cal-week-cells{position:relative;z-index:0;height:100%}
  .cal-week .cal-cell{display:block;height:auto;min-height:0}
  /* [2026-10-16 UI 지침 §8 큰 화면] 연차 캘린더(월) — 주 줄이 남은 높이를 똑같이 나눠 가진다(아래 끝 = 화면 높이의 약 75% · 막대가 많은 주는 그만큼 더 큼 · 작은 화면은 종전 96px) */
  .lv-mcal .cal-weeks{min-height:max(480px,calc(75vh - 360px))}
  .lv-mcal .cal-week{flex:1 0 auto;display:flex;flex-direction:column}
  .lv-mcal .cal-week-cells{flex:1 0 auto;height:auto}
  .cal-bars{position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;z-index:2}
  .mbar{position:absolute;height:20px;color:#fff;font-size:11px;font-weight:700;line-height:20px;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;pointer-events:auto;box-shadow:0 1px 2px rgba(0,0,0,.12)}
  .mbar:hover{filter:brightness(1.08)}
  /* 승인 대기(pending) 막대 — 옅고 점선 테두리 + 빗금 */
  .mbar.pending{color:#566;opacity:.92;box-shadow:none;border:1.5px dashed #9aa1ad;
    background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.35) 0, rgba(255,255,255,.35) 5px, transparent 5px, transparent 10px)!important;
    background-blend-mode:overlay}
  .tl-bar.pending{opacity:.95;border:1.5px dashed #9aa1ad;color:#566;
    background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.35) 0, rgba(255,255,255,.35) 5px, transparent 5px, transparent 10px)}
  /* 범례 */
  .lv-legend{display:flex;gap:18px;align-items:center;margin:-4px 2px 14px;font-size:13.5px;color:var(--ink-soft)}
  .lv-leg-item{display:inline-flex;align-items:center;gap:7px;font-weight:600}
  .lv-leg-item small{color:var(--ink-faint);font-weight:500}
  .lv-leg-sw{width:26px;height:14px;border-radius:4px;display:inline-block;flex:none}
  .lv-leg-sw.approved{background:var(--navy)}
  .lv-leg-sw.pending{background:#b6bcc7;border:1.5px dashed #9aa1ad;
    background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.45) 0, rgba(255,255,255,.45) 4px, transparent 4px, transparent 8px)}
  /* 타임라인 */
  .tl{--namew:140px;--dayw:calc((100% - 140px)/7)}
  .tl-row{display:flex;align-items:stretch;border-bottom:1px solid var(--line-soft);min-height:46px}
  .tl-head{border-bottom:2px solid var(--line);min-height:auto}
  .tl-name{width:var(--namew);flex:none;display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;padding:8px 10px}
  .tl-name small{color:var(--ink-faint);font-weight:600;font-size:10.5px}
  .tl-head .tl-name{color:var(--ink-soft);font-size:12px}
  .tl-day{width:var(--dayw);flex:none;text-align:center;font-size:11.5px;font-weight:700;color:var(--ink-soft);padding:7px 0;border-left:1px solid var(--line-soft);display:flex;flex-direction:column}
  .tl-day span{font-size:10px;font-weight:600;color:var(--ink-faint)}
  .tl-day.sun{color:var(--accent-ink)}.tl-day.sat{color:var(--navy)}
  .tl-track{flex:1;position:relative;background-image:repeating-linear-gradient(to right,transparent,transparent calc(var(--dayw) - 1px),var(--line-soft) calc(var(--dayw) - 1px),var(--line-soft) var(--dayw))}
  .tl-bar{position:absolute;top:8px;height:30px;border-radius:8px;color:#fff;font-size:11.5px;font-weight:700;display:flex;align-items:center;padding:0 11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;box-shadow:var(--shadow-sm)}
  .tl-bar:hover{filter:brightness(1.08)}
  .tl-empty{text-align:center;color:var(--ink-faint);font-size:14px;padding:40px 0}
  /* 연차 현황 */
  .lv-note{background:#f7f9fc;border:1px solid var(--line);border-radius:11px;padding:13px 16px;font-size:13.5px;line-height:1.6;color:var(--ink-soft);margin-bottom:16px}
  .lv-note b{color:var(--ink)}
  .lv-note u{text-decoration-color:var(--ok);color:var(--ok-ink);font-weight:600}
   /* [v275] 촉진 달성 카드 추가 → 4열 */
  table.dl .tm{font-size:10.5px;color:var(--ink-faint);margin-top:2px}
  /* 직원 DB 관리 */
  .adm-intro{display:flex;align-items:center;gap:14px;background:#fbeded;border:1px solid #f0cfcf;border-radius:14px;padding:16px 18px;margin-bottom:18px}
  .adm-intro-ic{width:42px;height:42px;border-radius:11px;background:#C4534E;color:#fff;display:grid;place-items:center;flex:none}
  .adm-intro-ic svg{width:22px;height:22px}
  .adm-intro b{font-size:14px;color:var(--ink)}
  .adm-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
  .adm-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow-sm)}
  .adm-k{font-size:12px;color:var(--ink-soft)}
  .adm-v{font-size:26px;font-weight:800;color:var(--ink);margin-top:4px}
  .adm-v small{font-size:12px;font-weight:600;color:var(--ink-soft);margin-left:3px}
  .toast.show{transform:translateX(-50%) translateY(0);opacity:1}
  .toast{width:max-content;max-width:min(560px,calc(100vw - 32px))}   /* [2026-10-03] left:50% 라 쪼그라든 폭(=화면 절반, 390 폰에서 195px)으로 4줄씩 꺾였다 → 글 길이만큼 · 화면-32px · 560px 상한 */
  .toast svg{width:18px;height:18px;stroke:var(--ok);fill:none;stroke-width:2.5}

  /* ===== 차량운행·교통비 정산 ===== */
  .car-head{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
  .car-head .cf{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:10px 12px;box-shadow:var(--shadow-sm)}
  .car-head .cf label{display:block;font-size:11px;color:var(--ink-soft);font-weight:700;margin-bottom:4px}
  .car-head .cf input,.car-head .cf select{width:100%;border:none;background:transparent;font-size:14px;font-weight:700;color:var(--ink);outline:none;font-family:inherit}
  .car-head .cf.ro{background:var(--line-soft)}
  .car-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
  .car-note{font-size:13.5px;color:var(--ink-soft);background:var(--warn-soft);border:1px solid #f0e0b8;border-radius:9px;padding:9px 12px;margin-bottom:14px;line-height:1.5}
  .car-note b{color:var(--warn-ink)}
  .car-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel);box-shadow:var(--shadow-sm);min-height:max(0px,calc(75vh - 809px))}   /* [2026-10-16 UI 지침 §8] 차계부 화면 아래 끝 = 화면 높이의 약 75%(표 위·아래 칸 합 809px · 줄이 많으면 그대로) */
  table.car-table{width:100%;border-collapse:collapse;min-width:964px;font-size:14px}
  table.car-table th{background:var(--line-soft);color:var(--ink-soft);font-weight:700;font-size:11.5px;padding:9px 6px;text-align:center;border-bottom:1px solid var(--line);white-space:nowrap}
  table.car-table th.grp-drive{background:var(--sea-tint,#eaf1fb);color:var(--navy)}
  table.car-table th.grp-cost{background:#e7f6ec;color:var(--ok-ink)}
  table.car-table td{padding:5px 6px;border-bottom:1px solid var(--line-soft);text-align:center;vertical-align:middle}
  table.car-table tr:last-child td{border-bottom:none}
  table.car-table input{width:100%;border:1px solid transparent;background:transparent;font-size:14px;padding:5px 6px;border-radius:7px;font-family:inherit;text-align:center;outline:none;transition:border-color .15s,background .15s}
  table.car-table input:hover{border-color:var(--line)}
  table.car-table input:focus{border-color:var(--navy-2);background:#fff;box-shadow:0 0 0 3px rgba(var(--sea-rgb,27,111,245),.08)}
  table.car-table input.am{text-align:right;font-weight:700}
  table.car-table input::placeholder{color:#aab0bd;font-weight:500}
  table.car-table input.cum-input{color:var(--navy);font-weight:700;cursor:default}
  table.car-table input.cum-input:hover{border-color:transparent}
  table.car-table input.cum-input:focus{border-color:transparent;background:#f6f9fe;box-shadow:none}
  table.car-table td.drive-cell input{background:#f6f9fe}
  table.car-table td.cost-cell input{background:#f3faf5}
  table.car-table td.ocr input{background:#e7f6ec;font-weight:700}
  table.car-table .conf{font-size:9px;font-weight:800;padding:1px 5px;border-radius:5px}
  .car-dupchip{display:inline-block;font-size:9px;font-weight:800;color:#fff;background:var(--accent);border-radius:4px;padding:1px 5px;margin-bottom:3px}
  table.car-table tr.car-dup td{background:#fdeced}
  table.car-table tr.car-dup td input{background:rgba(255,255,255,.5)!important}
  table.car-table tr.car-dup td:first-child{box-shadow:inset 3px 0 0 var(--accent)}
  .biz-tog{display:inline-flex;align-items:center;justify-content:center;width:46px;height:26px;border-radius:7px;border:1px solid var(--line);background:#fff;font-size:11px;font-weight:800;cursor:pointer;color:var(--ink-faint);transition:all .15s}
  .biz-tog.on{background:var(--ok-soft);border-color:#b9e3c9;color:var(--ok-ink)}
  .car-del{width:26px;height:26px;border:1px solid var(--line);background:#fff;border-radius:7px;color:var(--ink-faint);font-size:16px;line-height:1;cursor:pointer}
  .car-del:hover{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-soft)}
  .car-ins{width:26px;height:26px;border:1px solid var(--line);background:#fff;border-radius:7px;color:var(--ink-faint);font-size:16px;line-height:1;cursor:pointer}
  .car-ins:hover{border-color:var(--ok);color:var(--ok-ink);background:var(--ok-soft)}
  .car-act{display:grid;grid-template-columns:repeat(2,auto);gap:4px;justify-content:center}
  .car-mv{width:24px;height:24px;border:1px solid var(--line);background:#fff;border-radius:7px;color:var(--ink-faint);font-size:10px;line-height:1;cursor:pointer}
  .car-mv:hover:not(:disabled){border-color:var(--navy-2);color:var(--navy-deep);background:var(--line-soft)}
  .car-mv:disabled{opacity:.3;cursor:default}
  .car-empty{padding:34px 16px;text-align:center;color:var(--ink-faint);font-size:14px}
  .car-tot-row td{background:var(--line-soft);font-weight:800;color:var(--ink)}
  .car-calc{display:grid;grid-template-columns:1.2fr 1fr;gap:16px;margin-top:18px}
  .car-calc .card{padding:16px 18px}
  .calc-line{display:flex;justify-content:space-between;align-items:baseline;padding:7px 0;border-bottom:1px dashed var(--line);font-size:14px}
  .calc-line:last-child{border-bottom:none}
  .calc-line .lbl{color:var(--ink-soft)}
  .calc-line .lbl small{color:var(--ink-faint);font-weight:500}
  .calc-line .val{font-weight:700;font-variant-numeric:tabular-nums}
  .calc-pay{margin-top:12px;background:linear-gradient(135deg,var(--navy-deep),var(--navy));color:#fff;border-radius:12px;padding:16px 18px;display:flex;justify-content:space-between;align-items:center}
  .calc-pay .pl{font-size:14px;opacity:.85}
  .calc-pay .pv{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}
  .calc-pay .pv small{font-size:14px;font-weight:600;opacity:.8;margin-left:3px}
  .car-param .pf{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line-soft)}
  .car-param .pf:last-child{border-bottom:none}
  .car-param .pf label{font-size:14px;color:var(--ink-soft)}
  .car-param .pf input{width:110px;text-align:right;border:1px solid var(--line);border-radius:7px;padding:5px 8px;font-family:inherit;font-weight:700;font-size:14px;outline:none}
  .car-param .pf input:focus{border-color:var(--navy-2)}
  .car-formula{font-size:11.5px;color:var(--ink-faint);margin-top:10px;line-height:1.5;background:var(--line-soft);padding:9px 11px;border-radius:8px}
  @media(max-width:900px){.car-head{grid-template-columns:1fr 1fr}.car-calc{grid-template-columns:1fr}}
  /* v114: 모바일 셸 — 햄버거 + 오프캔버스 + 백드롭 */
  .ham{display:none;width:40px;height:40px;border:none;background:rgba(255,255,255,.08);border-radius:10px;cursor:pointer;align-items:center;justify-content:center;flex:none;margin-right:4px}
  .ham svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round}
  .side-bd{display:none;position:fixed;inset:0;background:rgba(15,22,36,.5);z-index:49}
  body.nav-open .side-bd{display:block}
  .gsearch{display:flex;align-items:center;gap:7px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);color:#c4cddc;border-radius:10px;padding:8px 12px;cursor:pointer;font-family:inherit;font-size:12px}
  .gsearch svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
  .gsearch .gsk{font-size:10px;font-weight:700;border:1px solid rgba(255,255,255,.2);border-radius:5px;padding:1px 6px;color:#8fa0ba}
  @media(max-width:780px){
    .app{grid-template-columns:1fr}
    .side{position:fixed;left:-260px;z-index:50;transition:left .25s;width:248px}
    .side.open{left:0}
    .ham{display:flex}
    .topbar .crumb,.topbar .demo-tag{display:none}
    .gsearch .gsk{display:none}
    .frm-grid{grid-template-columns:1fr}
    .doc-meta{grid-template-columns:1fr}
    /* ===== [v177 폰수리] 이미 있는 780px 블록에 모아 넣는다 (새 미디어쿼리를 또 만들면 나중에 못 찾는다) ===== */
    .att-grid{grid-template-columns:minmax(0,1fr)}             /* 첨부 1칸 — 2칸이면 파일명이 못 읽을 만큼 잘린다 · [2026-10-03] minmax(0) — 띄어쓰기 없는 긴 파일명(버튼 = 낱말 폭 최소)이 칸을 화면 밖으로 밀던 것 */
    .ibx3-actbar .apv,.ibx3-actbar .rej{flex:1 1 auto;min-height:44px}   /* 승인·반려 터치 타깃 */
    .ibx3-rejrow .go,.ibx3-rejrow .cancel{min-height:44px}   /* [v177 감사수정] 반려 확정·취소는 rejrow 소속 — actbar 셀렉터는 죽은 규칙이었다 */
    /* ⚠️ 출퇴근(#attendRoot) 폰 규칙은 여기 두면 안 된다 — att 스타일 정의가 이 블록보다 '아래'(2100줄대)에 있어서
       같은 특이도면 나중 규칙이 이긴다. 그래서 att 블록 바로 뒤에 별도로 뒀다(아래 [v177 폰수리·출퇴근] 참조). */
    .grid-stack.no-gs .grid-stack-item[gs-id="queue"],
    .grid-stack.no-gs .grid-stack-item[gs-id="cal"],
    .grid-stack.no-gs .grid-stack-item[gs-id="mailg"]{min-height:380px}   /* hero는 제외 — 일괄로 키우면 위쪽에 죽은 여백 */
  }
  /* ===== 업무 일정 캘린더 ===== */
  .sc-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
  .sc-nav{display:flex;align-items:center;gap:6px}
  .sc-nav button{width:34px;height:34px;border:1px solid var(--line);background:var(--panel);border-radius:9px;cursor:pointer;display:grid;place-items:center}
  .sc-nav button svg{width:16px;height:16px;stroke:var(--ink-soft);fill:none;stroke-width:2}
  .sc-nav button:hover{border-color:var(--navy-2)}
  .sc-title{font-size:18px;font-weight:800;color:var(--ink);min-width:130px;text-align:center}
  .sc-today{font-size:12px;font-weight:700;color:var(--navy);background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:8px 12px;cursor:pointer}
  .sc-today:hover{border-color:var(--navy-2)}
  .sc-filters{display:flex;gap:7px;flex-wrap:wrap;margin-left:4px;min-width:0;flex:1 1 240px}   /* [v264] 칩은 안에서 접힌다 — 우측 버튼이 줄 바꿈으로 밀리지 않게 */
  .sc-fil{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;border:1px solid var(--line);border-radius:999px;padding:5px 11px;cursor:pointer;color:var(--ink-soft);background:var(--panel);user-select:none}
  .sc-fil .dot{width:9px;height:9px;border-radius:50%}
  .sc-fil.off{opacity:.4}
  .sc-acts{margin-left:auto;display:flex;gap:8px;flex:none}   /* [v264] 연차 현황 + 일정 추가 — 한 덩어리로 우측 */
  .sc-lvstat{border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
  .sc-lvstat:hover{border-color:var(--navy-2);color:var(--navy-deep)}
  .sc-add{border:none;background:var(--navy);color:#fff;border-radius:10px;padding:9px 15px;font-size:14px;font-weight:800;cursor:pointer;display:flex;align-items:center;gap:6px}
  .sc-add:hover{filter:brightness(1.12)}
  .sc-add svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2.2}
  .sc-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:stretch}   /* [2026-10-16 사용자 「오른쪽 알림 칸도 조금 더 크게」] 270 → 320px · 높이 = 달력(UI 지침 §5) */
  @media(max-width:900px){ .sc-layout{grid-template-columns:1fr} }
  .sc-cal{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}
  .sc-dow{display:grid;grid-template-columns:repeat(7,1fr);background:#f4f6fb;border-bottom:1px solid var(--line)}
  .sc-dow span{padding:9px 0;text-align:center;font-size:12px;font-weight:800;color:var(--ink-soft)}
  .sc-dow span:first-child{color:var(--accent-ink)} .sc-dow span:last-child{color:var(--navy)}
  .sc-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-auto-rows:minmax(104px,auto);min-height:max(520px,calc(75vh - 160px))}   /* [2026-10-16 사용자 「화면 기준으로 채워지게」→「너무 꽉 참 · 70~80%」] 달력 아래 끝 = 화면 높이의 약 75% · 줄 높이 = 그 높이 ÷ 주 수(최소 104px · 일정이 많으면 그 줄만 더 커짐) */
  .sc-cell{min-height:104px;border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);padding:6px 6px 4px;cursor:pointer;position:relative;transition:background .12s}
  .sc-cell:nth-child(7n){border-right:none}
  .sc-cell:hover{background:#f7f9fc}
  .sc-cell.out{background:#fafbfd;cursor:default}
  .sc-cell.out:hover{background:#fafbfd}
  .sc-dnum{font-size:12px;font-weight:700;color:var(--ink-soft);display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%}
  .sc-cell.out .sc-dnum{color:var(--ink-faint)}
  .sc-cell.sun .sc-dnum{color:var(--accent-ink)} .sc-cell.sat .sc-dnum{color:var(--navy)}
  .sc-cell.today .sc-dnum{background:var(--navy);color:#fff}
  .sc-ev{margin-top:3px;font-size:11px;font-weight:700;color:#fff;border-radius:6px;padding:3px 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
  .sc-ev .t{opacity:.85;font-weight:600;margin-right:3px}
  .sc-more{margin-top:3px;font-size:10.5px;font-weight:700;color:var(--ink-faint);padding-left:3px}
  .sc-lv{margin-top:3px;font-size:10.5px;font-weight:800;border:1px dashed;border-radius:6px;padding:2px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;background:#fff;cursor:pointer}
  .sc-lvrow{display:flex;align-items:center;gap:7px;padding:7px 0;border-top:1px solid var(--line-soft);font-size:13.5px;color:var(--ink)}
  .sc-lvrow:first-of-type{border-top:none}
  .sc-lvrow .m{margin-left:auto;font-size:11px;color:var(--ink-faint)}
  .sc-side{display:flex;flex-direction:column;gap:12px}
  .sc-side > .sc-rm:last-child{flex:1 0 auto}   /* 맨 아래 칸(다가오는 일정)이 달력 아래 끝까지 */
  .sc-rm{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:15px}
  .sc-rm h4{margin:0 0 4px;font-size:14px;color:var(--ink);display:flex;align-items:center;gap:7px}
  .sc-rm h4 svg{width:16px;height:16px;stroke:var(--navy);fill:none;stroke-width:2}
  .sc-rm .sub{font-size:11.5px;color:var(--ink-faint);margin-bottom:10px}
  .sc-rmitem{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--line-soft)}
  .sc-rmitem:first-of-type{border-top:none}
  .sc-rmdate{flex:none;width:42px;text-align:center}
  .sc-rmdate .d{font-size:17px;font-weight:800;color:var(--ink);line-height:1}
  .sc-rmdate .m{font-size:10px;color:var(--ink-faint)}
  .sc-rmbody{flex:1;min-width:0}
  .sc-rmbody .ti{font-size:13.5px;font-weight:700;color:var(--ink);display:flex;align-items:flex-start;gap:6px}
  .sc-rmbody .ti .cdot{width:8px;height:8px;border-radius:50%;flex:none;margin-top:5px}
  .sc-rmbody .ti .tt{flex:1;min-width:0;line-height:1.45;word-break:keep-all;text-wrap:pretty}
  .sc-rmbody .me{font-size:11px;color:var(--ink-soft);margin-top:2px}
  .sc-rm-empty{font-size:12px;color:var(--ink-faint);padding:8px 0}
  .sc-when{font-size:11px;color:var(--ink-faint);background:#eef1f7;border-radius:999px;padding:2px 8px;flex:none;white-space:nowrap;margin-left:6px;margin-top:1px}
  /* ===== [v175 날짜패널] 날짜 클릭 → 우측에 그날 전량 목록 (셀은 3건까지만 보여서 4번째부터 볼 방법이 없었다) =====
     색은 전부 var() 토큰만 — .sc-* 에는 body[data-theme="dark"] 오버라이드가 1건도 없어서 하드코딩하면 다크에서 흰 판때기가 된다 */
  .sc-cell.sel{background:var(--line-soft);box-shadow:inset 0 0 0 2px var(--navy)}
  .sc-cell.sel:hover{background:var(--line-soft)}
  .sc-more{cursor:pointer}
  .sc-more:hover{color:var(--navy);text-decoration:underline}
  .sc-dp-h{display:flex;align-items:flex-start;gap:10px;margin-bottom:11px}
  .sc-dp-d{font-size:25px;font-weight:800;color:var(--ink);line-height:1;letter-spacing:-.6px}
  .sc-dp-w{font-size:11.5px;color:var(--ink-faint);font-weight:700;margin-top:5px}
  .sc-dp-x{margin-left:auto;flex:none;border:1px solid var(--line);background:var(--panel);width:26px;height:26px;border-radius:8px;cursor:pointer;color:var(--ink-soft);font-size:15px;font-weight:800;line-height:1;display:grid;place-items:center;padding:0}
  .sc-dp-x:hover{border-color:var(--navy-2)}
  .sc-dp-list{max-height:min(46vh,360px);overflow-y:auto;margin:0 -3px;padding:0 3px}
  .sc-dp-add{width:100%;margin-top:11px;border:1px dashed var(--line);background:var(--line-soft);color:var(--navy);border-radius:10px;padding:9px;font-family:inherit;font-size:12.5px;font-weight:800;cursor:pointer}
  .sc-dp-add:hover{border-color:var(--navy-2)}
  .sc-dp-lock{font-size:10px;font-weight:800;color:var(--ink-faint);background:var(--line-soft);border-radius:999px;padding:1px 7px;flex:none;white-space:nowrap;margin-left:6px;margin-top:1px}
  .sc-dp-holi{display:flex;align-items:center;gap:7px;padding:8px 0;border-top:1px solid var(--line-soft);font-size:13px;font-weight:700;color:var(--accent-ink)}
  .sc-dp-holi:first-of-type{border-top:none}
  /* ===== [2026-10-03 결정 5-①] 주 보기·일 보기 — 월 그리드와 같은 칩(.sc-ev·.sc-lv)·날짜 패널 조각 재사용 · 색은 var() 토큰만(다크·계절색이 따라간다) =====
     열은 minmax(0,1fr) — 긴 제목이 칸을 밀어 가로 넘침을 만들지 않게(칩은 줄바꿈 · 3줄에서 자름) */
  .sc-vseg{margin-left:4px}
  .sc-vseg .tab{padding:8px 13px}
  .sc-wk{display:grid;grid-template-columns:38px repeat(7,minmax(0,1fr))}
  .sc-wk>div{min-width:0;border-right:1px solid var(--line-soft)}
  .sc-wk>div:nth-child(8n){border-right:none}
  .sc-wk-ax{font-size:10.5px;font-weight:800;color:var(--ink-faint);text-align:center;padding-top:9px;border-bottom:1px solid var(--line-soft)}
  .sc-wk-ax.h,.sc-wk-h{background:var(--line-soft);border-bottom:1px solid var(--line)}
  .sc-wk-h{display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 2px 5px;cursor:pointer}
  .sc-wk-h .w{font-size:11.5px;font-weight:800;color:var(--ink-soft)}
  .sc-wk-h .n{font-size:15px;font-weight:800;color:var(--ink);min-width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
  .sc-wk-h.sun .w,.sc-wk-h.sun .n{color:var(--accent-ink)} .sc-wk-h.sat .w,.sc-wk-h.sat .n{color:var(--navy)}
  .sc-wk-h.today .n{background:var(--navy);color:#fff}
  .sc-wk-h.sel .n{box-shadow:inset 0 0 0 2px var(--navy)}
  .sc-wk-h:hover .n{text-decoration:underline}
  .sc-wk-ad{padding:3px 5px 6px;min-height:34px;border-bottom:1px dashed var(--line);cursor:pointer}
  .sc-wk-col{padding:3px 5px 10px;min-height:max(360px,calc(75vh - 250px));cursor:pointer}   /* [2026-10-16] 주간도 화면 높이의 약 75%까지(종전 최대 360px) */
  .sc-wk-ad:hover,.sc-wk-col:hover{background:var(--line-soft)}
  .sc-wk-ad.sel,.sc-wk-col.sel{background:var(--line-soft);box-shadow:inset 2px 0 0 var(--navy),inset -2px 0 0 var(--navy)}
  .sc-wk-ev{white-space:normal;overflow-wrap:anywhere;word-break:keep-all;cursor:pointer}
  .sc-wk-ev .c{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}   /* 줄 자르기는 안쪽 글자에만 — 칩에 걸면 아래 여백으로 4번째 줄이 비친다 */
  .sc-dv{padding:16px 18px 18px}
  .sc-dv-h{display:flex;align-items:flex-end;gap:10px;margin-bottom:12px}
  .sc-dv-h .sc-dp-w{margin:0 0 1px}
  .sc-dv-sec{font-size:11px;font-weight:800;color:var(--ink-faint);margin-bottom:4px}
  .sc-dv-ad{padding-bottom:10px;margin-bottom:8px;border-bottom:1px dashed var(--line)}
  .sc-dv-ad .sc-dv-ev{margin-top:6px}
  .sc-dv-hr{display:flex;gap:10px;min-height:32px;border-top:1px solid var(--line-soft)}
  .sc-dv-hl{flex:0 0 44px;font-size:11.5px;font-weight:800;color:var(--ink-faint);padding-top:7px;text-align:right;font-variant-numeric:tabular-nums;line-height:1.25}
  .sc-dv-hl small{display:block;font-size:10px;font-weight:800}
  .sc-dv-hb{flex:1;min-width:0;padding:5px 0 0}
  .sc-dv-hr.now{border-top:2px solid #C4534E}
  .sc-dv-hr.now .sc-dv-hl{color:#C4534E}
  .sc-dv-ev{--postit-c:var(--sc,var(--navy));padding:9px 12px;cursor:pointer;margin-bottom:5px}   /* 띠·바탕·모서리 = views.css 「포스트잇」 블록 · 테두리 없음(종전 1px 자리 = padding +1) */
  .sc-dv-ev:hover{box-shadow:0 0 0 1px var(--navy-2),var(--postit-sh)}   /* 강조 = 바깥 링(띠까지 감쌈) */
  .sc-dv-ev.ev-no{opacity:.42}
  .sc-dv-ev .sc-dv-ti{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;font-weight:700;color:var(--ink)}
  .sc-dv-ev .tm{flex:none;font-size:12px;font-weight:800;color:var(--ink-soft);font-variant-numeric:tabular-nums;margin-top:1px}
  .sc-dv-ev .tt{flex:1;min-width:0;line-height:1.45;word-break:keep-all;overflow-wrap:anywhere}
  .sc-dv-ev .sc-dv-me{font-size:11.5px;color:var(--ink-soft);margin-top:2px;overflow-wrap:anywhere}
  /* ===== 로그인 화면 — [v151] 화이트 오로라 (진권 확정 화이트+그린 · CSS 드리프트 애니 + 랜덤 오로라 3톤 + 멀티톤 별자리 + 워프 유지, 로직 ID 전부 보존) ===== */
  #loginScreen{display:none}
  body.locked #loginScreen{display:block;position:fixed;inset:0;z-index:1000;overflow:hidden;
    background:#F5F9F6}
  body.locked .app{display:none}
  /* ═══ [2026-10-18 사용자 결정] 로그인 계절 문양(안 B) — 그림은 layout/login-scene.js 가 #lgScene 에 채운다(종전 오로라 · 별자리 → 같은 날 계절 풍경 → 문양)
     층: 종이색 바탕(--lg-bg) · 오른쪽에서 번지는 문양(.pat · 왼쪽으로 갈수록 옅게) · 오른쪽 위 큰 그림(.big) · 떨어지는 것(#lgFx) · 그 위에 브랜드 · 카드 */
  .lg-scene{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--lg-bg,var(--sea-bg,#F5F9F6));transition:transform .9s cubic-bezier(.4,0,.2,1)}
  .lg-scene .pat{position:absolute;right:0;top:0;width:60vw;height:100%;opacity:.75;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.15) 30%,rgba(0,0,0,.85) 80%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.15) 30%,rgba(0,0,0,.85) 80%)}
  .lg-scene .big{position:absolute;right:0;top:0;width:min(44vw,800px);height:auto}
  /* 배치 — 문양마다 lay(login-scene.js): 아래 띠 · 오른쪽 위 모서리(없으면 오른쪽 번짐) */
  .lg-scene[data-lay="bottom"] .pat{width:100%;height:56%;top:auto;bottom:0;opacity:.8;-webkit-mask-image:linear-gradient(0deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.45) 50%,transparent 100%);mask-image:linear-gradient(0deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.45) 50%,transparent 100%)}
  .lg-scene[data-lay="bottom"] .big{top:auto;bottom:0}
  .lg-scene[data-lay="corner"] .pat{width:74vw;height:92%;-webkit-mask-image:radial-gradient(farthest-side at 100% 0%,rgba(0,0,0,.9) 30%,rgba(0,0,0,.35) 70%,transparent 100%);mask-image:radial-gradient(farthest-side at 100% 0%,rgba(0,0,0,.9) 30%,rgba(0,0,0,.35) 70%,transparent 100%)}
  .lg-fx{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
  .lg-fx i{position:absolute;top:-8vh;display:block;will-change:transform;animation:lgFall var(--d) linear var(--dl) infinite}
  .lg-fx i svg{display:block;width:100%;height:100%;animation:lgSway calc(var(--d)/3) ease-in-out infinite alternate}
  .lg-fx i:has(circle){filter:drop-shadow(0 1px 2px rgba(90,110,140,.35))}   /* 눈 — 밝은 하늘에서도 보이게 */
  @keyframes lgFall{to{transform:translate3d(var(--dx),118vh,0)}}
  @keyframes lgSway{from{transform:rotate(-30deg) translateX(-8px)}to{transform:rotate(40deg) translateX(10px)}}
  /* 입장 연출 — login.js startLoginWarp 가 .lg-go 를 붙인다(0.65초 뒤 같은 색 커버가 이어받음)
     [2026-10-19 사용자 ①안 「매일 짧게」] 흰 빛 대신 그날 큰 그림 자리에서 계절색(#lgFlash · --lg-wash)이 번진다 · 큰 그림은 피어나며 사라짐 */
  #loginScreen.lg-go .lg-scene .big{transform:scale(1.18);opacity:0;transition:transform .62s cubic-bezier(.2,.7,.2,1),opacity .5s ease}
  #loginScreen.lg-go .lg-stage,#loginScreen.lg-go .lg-copy{opacity:0;transition:opacity .22s ease}
  #loginScreen.lg-go #lgFlash{clip-path:circle(150% at var(--lg-wx,78%) var(--lg-wy,22%))}
  @media(max-width:900px){ .lg-scene .pat,.lg-scene[data-lay] .pat{top:0;bottom:auto;width:100%;height:100%;opacity:.5;-webkit-mask-image:linear-gradient(180deg,#000,transparent 55%);mask-image:linear-gradient(180deg,#000,transparent 55%)} .lg-scene .big,.lg-scene[data-lay] .big{top:0;bottom:auto;width:70vw;opacity:.55} }
  @media(prefers-reduced-motion:reduce){ .lg-scene *,.lg-scene{animation:none!important;transition:none!important} }
  .lg-stage{position:relative;z-index:3;min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,392px) minmax(0,1fr);align-items:center;column-gap:clamp(20px,4vw,60px);padding:0 clamp(20px,4vw,64px)}   /* [v151] 카드=화면 정중앙(가운데 컬럼), 브랜드=좌측 세로중앙. minmax(0,1fr)=슬로건이 컬럼을 못 밀게 */
  .lg-brand{grid-column:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-width:0}
  .lg-logo{display:flex;align-items:center;gap:11px;margin-bottom:34px;animation:lwRise .6s .05s both}
  .lg-eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--sea-btn2,#0D57D6);text-transform:uppercase;animation:lwRise .6s .12s both}
  .lg-slogan{font-size:clamp(28px,3.4vw,46px);font-weight:900;line-height:1.18;letter-spacing:-.02em;color:#0E1A15;margin-top:10px;animation:lwRise .7s .2s both}
  .lg-sub{margin-top:2.2vh;font-size:14.5px;line-height:1.75;color:#51605A;animation:lwRise .7s .32s both}
  .lg-sub b{color:#182420}
  .lg-sub .hl{color:var(--sea-btn2,#0D57D6);font-weight:700}
  /* [v195] 위아래 여백을 화면 높이에 맞춰 줄인다 — 비번변경 단계는 입력칸이 3개라
     카드가 574px까지 커지는데, 종전 고정 40px 여백이면 616px 미만 화면에서 버튼이 잘렸다. */
  .lg-formside{grid-column:2;display:flex;align-items:center;justify-content:center;padding:clamp(14px,4vh,40px) 0}
  /* [v195] ⚠️ body.locked #loginScreen 이 overflow:hidden 이라 카드가 뷰포트보다 커지면
     잘린 부분에 손이 닿지 않는다(스크롤바도 스와이프도 없음). 비번변경은 서버가 강제하는
     관문이라, 잘리면 그 직원은 시스템에 아예 못 들어온다 — 카드 자체를 스크롤 가능하게 둔다.
     실측: 390×760 폰에서 종전엔 버튼·오류문구가 둘 다 화면 밖이었다. */
  .lw-card{width:100%;max-width:392px;background:#FFFFFF;border:1px solid #E6ECE8;border-radius:22px;
    max-height:calc(100dvh - 28px);overflow-y:auto;overscroll-behavior:contain;
    padding:clamp(28px,4vw,40px) clamp(26px,4vw,36px) clamp(24px,3.6vw,30px);
    box-shadow:0 2px 8px rgba(14,26,21,.05), 0 30px 70px -30px rgba(14,26,21,.24), 0 0 60px -30px rgba(var(--sea-rgb,27,111,245),.3);
    animation:lwRise .7s .28s both}
  @keyframes lwRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
  /* [v201 로고] 로그인 카드 아이콘 — 제목·설명을 걷어낸 자리를 대신한다.
     ⚠️ 카드 폭 392px 기준 88px = 약 22%. 더 키우면 입력칸과 균형이 깨진다. */
  .lw-mark{display:flex;justify-content:center;margin:2px 0 18px}
  /* [2026-10-01 새 로고] 높이 60px(폭 ≈116px) — 색은 SVG 원본 고정(흰 카드), 박음질만 꼬리의 .lw-mark svg .f2-accent(라이트 주색 --sea).
     아래 다크 color 규칙과 [v229 로고수리] color 규칙은 currentColor 가 없어진 지금 효과 없음(옛 로고용). */
  .lw-mark svg{height:60px;width:auto;aspect-ratio:1510/778}
  body[data-theme="dark"] .lw-mark svg{color:#FFFFFF}
  .lw-formtitle{font-size:21px;font-weight:800;color:#0E1A15;letter-spacing:-.01em}
  .lw-formdesc{font-size:14px;color:#51605A;margin:5px 0 10px}
  @media(max-width:900px){
    .lg-stage{grid-template-columns:1fr;align-items:start;padding-top:44px}
    .lg-brand{grid-column:1;align-items:center;text-align:center}
    .lg-logo{margin-bottom:18px}
    .lg-formside{grid-column:1;padding-bottom:56px}
  }
  .lg-form{width:100%;max-width:100%;text-align:left}
  .login-lab{display:block;font-size:11.5px;color:#51605A;font-weight:700;margin:12px 0 6px;letter-spacing:.02em}
  .login-inp{width:100%;border-radius:13px;padding:13px 14px;font-size:14px;font-family:inherit;color:#0E1A15;outline:none;
    border:1.5px solid #E6ECE8;background:#F7FAF8;transition:border-color .15s,background .15s,box-shadow .15s}
  .login-inp::placeholder{color:#8A968F}
  .login-inp:focus{border-color:var(--sea,#1B6FF5);background:#fff;box-shadow:0 0 0 3px rgba(var(--sea-rgb,27,111,245),.16)}
  .login-opts{display:flex;gap:16px;margin:14px 0 16px;font-size:12px;color:#51605A;justify-content:center}
  .login-opts label{display:flex;align-items:center;gap:6px;cursor:pointer}
  .login-btn{width:100%;border:none;background:linear-gradient(135deg,var(--sea,#1B6FF5),var(--sea-btn2,#0D57D6));color:#fff;font-size:14.5px;font-weight:800;padding:13px;border-radius:13px;cursor:pointer;box-shadow:0 10px 30px rgba(var(--sea-rgb,27,111,245),.30);transition:filter .15s}
  .login-btn:hover:not(:disabled){filter:brightness(1.06)}
  /* [v196] 전송 중 잠긴 버튼이 활성처럼 보이던 문제 — hover까지 밝아져서 사용자가 연타했다.
     같은 파일 #attendRoot .att-btn:disabled 가 이미 쓰는 패턴을 맞춘다. */
  .login-btn:disabled{opacity:.55;cursor:default;filter:none;box-shadow:none}
  .login-err{color:#C96455;font-size:13.5px;margin-top:11px;min-height:16px;text-align:center}
  /* ═══ [v199 로그인] 실패를 눈에 보이게 ═══
     텍스트만 바꾸면 같은 문구가 이미 떠 있을 때 화면이 1픽셀도 안 변한다 — 방금 틀린 건지 알 수 없다.
     그래서 ①입력칸을 붉게 ②카드를 한 번 흔들고 ③메시지를 박스로 세운다. */
  .login-inp.bad{border-color:#C96455;background:#FDF3F1}
  .login-inp.bad:focus{border-color:#C96455;box-shadow:0 0 0 3px rgba(201,100,85,.18)}
  .login-err.on{display:flex;align-items:center;justify-content:center;gap:7px;font-weight:700;
    background:#FDF0EE;border:1px solid #F1C9C2;border-radius:10px;padding:9px 12px;text-align:left}
  .login-err .lg-x{width:17px;height:17px;border-radius:50%;background:#C96455;color:#fff;
    font-size:12px;font-weight:800;display:grid;place-items:center;flex:none;line-height:1}
  @keyframes lgShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}
    40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(2px)}}
  .lg-form.shake{animation:lgShake .34s ease}
  @media(prefers-reduced-motion:reduce){ .lg-form.shake{animation:none} }
  /* [v131 2FA] 2차 인증 UI — [v151] 화이트+그린 리스킨 (구조·ID 불변) */
  #lgStepTfa{display:none}
  #loginScreen[data-step="tfa"] #lgStepCred{display:none}
  #loginScreen[data-step="tfa"] #lgStepTfa{display:block}
  .tfa-ic{width:50px;height:50px;border-radius:14px;background:#E6F6EC;border:1px solid #C4E0D1;display:flex;align-items:center;justify-content:center;font-size:25px;margin:0 auto 12px}
  .tfa-title{font-size:18px;font-weight:800;text-align:center;color:#182420}
  .tfa-desc{font-size:13.5px;color:#6B7772;text-align:center;margin-top:6px;line-height:1.6}
  .tfa-risk{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:700;border-radius:10px;padding:9px 12px;margin:15px 0 4px;line-height:1.45;text-align:center;background:#EFF6F1;border:1px solid #D8E8DD;color:var(--sea-btn2,#0D57D6)}
  .tfa-risk.high{background:#FDEBEA;border:1px solid #F3C1BD;color:#C96455}
  .tfa-risk.high #tfaRiskIc,.tfa-risk.high span{color:#C96455}
  .otp-wrap{display:flex;gap:8px;justify-content:center;margin:18px 0 6px}
  .otp-cell{width:44px;height:54px;text-align:center;font-size:23px;font-weight:800;color:#182420;border-radius:11px;border:1.6px solid #E3EAE5;background:#F7FAF8;outline:none;font-family:inherit;transition:border-color .15s,background .15s,box-shadow .15s}
  .otp-cell:focus{border-color:var(--sea,#1B6FF5);background:#fff;box-shadow:0 0 0 3px rgba(var(--sea-rgb,27,111,245),.14)}
  .otp-cell.filled{border-color:rgba(var(--sea-rgb,27,111,245),.55)}
  .otp-timer{text-align:center;font-size:11px;color:#8A968F;margin-top:7px}
  .otp-timer b{color:var(--sea-btn2,#0D57D6)}
  .bio-btn{display:flex;flex-direction:column;align-items:center;gap:9px;width:100%;cursor:pointer;background:#F7FAF8;border:1.5px dashed rgba(var(--sea-rgb,27,111,245),.45);border-radius:15px;padding:24px;margin:16px 0 6px;transition:all .15s}
  .bio-btn:hover{background:#EFF6F1;border-color:rgba(var(--sea-rgb,27,111,245),.75)}
  .bio-ic{font-size:40px;transition:transform .3s}
  .bio-btn.scan .bio-ic{animation:bioPulse .7s ease-in-out infinite}
  @keyframes bioPulse{50%{transform:scale(1.18);filter:drop-shadow(0 0 12px rgba(var(--sea-rgb,27,111,245),.85))}}
  .bio-txt{font-size:14px;font-weight:700;color:#182420}
  .bio-sub{font-size:11px;color:#8A968F;text-align:center;line-height:1.4}
  .tfa-alt{display:flex;justify-content:space-between;margin-top:14px;font-size:12px}
  .tfa-link{color:var(--sea-btn2,#0D57D6);cursor:pointer;font-weight:600}
  .tfa-link:hover{color:var(--sea,#1B6FF5);text-decoration:underline}
  .tfa-recovery{display:none;margin-top:13px;border-top:1px solid #E6ECE8;padding-top:12px}
  .tfa-recovery.show{display:block}
  .tfa-rec-opt{display:flex;gap:9px;align-items:flex-start;font-size:12px;color:#51605A;padding:7px 0;line-height:1.5}
  .tfa-rec-opt .ri{font-size:15px;flex:none}
  .tfa-rec-opt b{color:#182420}
  /* ═══ [v195 첫로그인 비번변경] 로그인 카드의 3번째 단계 ═══
     ⚠️ 색을 var(--navy)로 쓰지 않는다 — :root와 #content.gw에서 값이 서로 달라(#116BFF/#1B6FF5)
        옆의 2FA 화면과 초록이 미묘하게 어긋난다. 로그인 영역은 [v151]부터 hex 직접 지정이 규칙.
     ⚠️ 다크모드 오버라이드도 넣지 않는다 — 로그인 화면은 라이트 고정이고,
        넣으면 로그인→대시보드 전환에서 흰→검정→다크로 한 번 튄다(v171에서 잡은 문제). */
  #lgStepPwc{display:none}
  /* ⚠️ 이 단계에서만 스크롤을 연다. body.locked #loginScreen 은 overflow:hidden 이라
     카드가 화면 아래로 밀리면 손이 닿지 않는데(스크롤바도 스와이프도 없음),
     비번변경은 서버가 강제하는 관문이라 그러면 그 직원은 아예 못 들어온다.
     cred·tfa 는 종전 그대로 hidden — 로그인 연출(오로라)이 만드는 가짜 스크롤을 막기 위함이다.
     ⚠️ 선택자에 body.locked 를 반드시 포함할 것 — 2216행이 `body.locked #loginScreen` 이라
        `#loginScreen[data-step]` 만으로는 우선순위가 낮아 지고, 실측에서 실제로 안 먹었다. */
  /* [v196] 동기화 배지(z-index 99999)가 로그인 카드 위를 덮는다 — 잠금 중에는 위로 보낸다.
     숨기지 않는 이유: '로그인 필요 / 변경분 보관 중' 안내가 정작 이 화면에서 필요하다. */
  body.locked #f2SyncBadge{display:none !important}   /* [v235] 로그인 화면에서는 배지를 숨긴다 — 로그인 폼 자체가 안내라 '로그인 필요'는 동어반복이고,
      브라우저 세션 쿠키로 바꾼 뒤로는 정상 접속에서도 매번 떠서 신호가 죽었다(진권 지시). */
  body.locked #loginScreen[data-step="pwc"]{overflow-y:auto}
  body.locked #loginScreen[data-step="pwc"] .lg-stage{align-items:flex-start}
  #loginScreen[data-step="pwc"] #lgStepCred{display:none}
  #loginScreen[data-step="pwc"] #lgStepTfa{display:none}   /* 기본값에 기대지 않고 명시한다 */
  #loginScreen[data-step="pwc"] #lgStepPwc{display:block}
  .pwc-note{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;line-height:1.55;color:#51605A;
    background:#EFF6F1;border:1px solid #D8E8DD;border-radius:10px;padding:10px 12px;margin:2px 0 14px}
  .pwc-note b{color:#182420}
  /* [2026-10-03 사용자 킵 #1] 안내가 「새 비밀번호 확인」 입력칸에 걸쳐 겹쳤다(margin-top:-4px) → 입력칸 아래 8px 띄우고 문장마다 한 줄(점 목록) */
  .pwc-rule{list-style:none;font-size:12px;color:#6B7772;margin:8px 0 16px;padding:0;line-height:1.5}
  .pwc-rule li{position:relative;padding-left:11px}
  .pwc-rule li+li{margin-top:2px}
  .pwc-rule li::before{content:"";position:absolute;left:2px;top:.62em;width:3px;height:3px;border-radius:50%;background:currentColor}
  .pwc-note,.pwc-rule{text-wrap-style:balance}
   /* [2026-10-03] 운영 감시 점검 카드 설명 — 「(경보 / 3개부터)」 외톨이 · 규칙 본체는 modules/admin/opsmon.js */
  .lv5 .lv5-gh{flex-wrap:wrap}   /* [2026-10-03] 근태 현황 사업부 머리 줄 — 폰에서 「인빌딩사업부 · / 10명」으로 눌리던 것(오른쪽 요약이 다음 줄로) · 규칙 본체는 modules/calendar/leave.js */
  /* 바닥 저작권 줄(.lg-copy · absolute bottom 3vh)이 비번 변경 카드(입력칸 3개라 길다)의 버튼·링크 위에 겹쳐 그려졌다(390×780 실측) — 이 단계에선 뺀다 */
  @media (max-width:900px),(max-height:820px){ #loginScreen[data-step="pwc"] .lg-copy{display:none} }
  /* [v131 출퇴근] 뷰 스타일 — att- 스코프로 격리 (v131 기존 .panel/.badge 충돌 방지) */
  #attendRoot .att-vhead{display:flex;align-items:baseline;gap:12px;margin-bottom:20px}
  #attendRoot .att-vhead h2{font-size:21px;font-weight:800;letter-spacing:-.01em}
  #attendRoot .att-date{font-size:14px;color:var(--ink-soft);font-weight:600}
  #attendRoot .att-today{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:24px 28px;margin-bottom:18px;display:flex;align-items:center;gap:28px;flex-wrap:wrap}
  #attendRoot .att-clock{flex:none}
  #attendRoot .att-now{font-size:44px;font-weight:900;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
  #attendRoot .att-dt{font-size:14px;color:var(--ink-soft);font-weight:600;margin-top:6px}
  #attendRoot .att-stamp{display:flex;gap:26px;padding-left:28px;border-left:1px solid var(--line);flex:1;min-width:220px}
  #attendRoot .att-sc{flex:1}
  #attendRoot .att-lb{font-size:11.5px;color:var(--ink-faint);font-weight:700}
  #attendRoot .att-vv{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;margin-top:3px}
  #attendRoot .att-vv.muted{color:var(--ink-faint)}
  #attendRoot .att-worked{font-size:12px;color:var(--ok-ink);font-weight:700;margin-top:2px}
  #attendRoot .att-acts{display:flex;flex-direction:column;gap:9px;flex:none}
  #attendRoot .att-btn{border:none;border-radius:11px;padding:13px 30px;font-size:15px;font-weight:800;transition:filter .15s,opacity .15s;min-width:150px;cursor:pointer}
  #attendRoot .att-btn.in{background:var(--navy);color:#fff;box-shadow:0 8px 22px rgba(var(--sea-rgb,27,111,245),.32)}
  #attendRoot .att-btn.out{background:var(--panel);color:var(--ink);border:1.5px solid var(--line)}
  #attendRoot .att-btn.out:hover{border-color:var(--accent);color:var(--accent-ink)}
  #attendRoot .att-btn.in:hover{filter:brightness(1.08)}
  #attendRoot .att-btn:disabled{opacity:.42;cursor:default;filter:none;box-shadow:none}
  #attendRoot .att-btn.done{background:var(--ok-soft);color:var(--ok-ink);border:1.5px solid transparent}
  #attendRoot .att-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
  #attendRoot .att-stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm);padding:18px 20px}
  #attendRoot .att-slb{font-size:12px;color:var(--ink-soft);font-weight:700}
  #attendRoot .att-sn{font-size:26px;font-weight:900;margin-top:6px;font-variant-numeric:tabular-nums}
  #attendRoot .att-stat.a .att-sn{color:var(--navy)} #attendRoot .att-stat.b .att-sn{color:var(--ok-ink)} #attendRoot .att-stat.c .att-sn{color:var(--warn-ink)} #attendRoot .att-stat.d .att-sn{color:var(--accent-ink)}
  #attendRoot .att-sn span{font-size:12px;color:var(--ink-faint);font-weight:600;margin-left:2px}
  #attendRoot .att-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm);overflow:hidden}
  #attendRoot .att-card-h{padding:14px 18px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:10px}
  #attendRoot .att-card-h h3{font-size:14.5px;font-weight:800}
  #attendRoot .att-note{margin-left:auto;font-size:11.5px;color:var(--ink-faint);font-weight:600}
  #attendRoot .att-tbl{width:100%;border-collapse:separate;border-spacing:0}
  #attendRoot .att-tbl th{background:#f7f9fc;font-size:12px;font-weight:700;color:var(--ink-soft);text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);white-space:nowrap}
  #attendRoot .att-tbl td{padding:12px 16px;border-bottom:1px solid var(--line-soft);font-size:14px;vertical-align:middle;font-variant-numeric:tabular-nums}
  #attendRoot .att-tbl tr:last-child td{border-bottom:none}
  #attendRoot .att-tbl tr.wk td{color:var(--ink-faint)}
  #attendRoot .att-tbl tr.lvrow{background:#fffaf0}
  #attendRoot .att-tbl .day{color:var(--ink-faint);font-weight:600}
  #attendRoot .att-badge{display:inline-block;font-size:11.5px;font-weight:800;padding:3px 11px;border-radius:20px}
  #attendRoot .att-badge.ok{background:var(--ok-soft);color:var(--ok-ink)}
  #attendRoot .att-badge.lv{background:var(--warn-soft);color:#A57F3B}
  #attendRoot .att-badge.no{background:var(--accent-soft);color:var(--accent-ink)}
  #attendRoot .att-badge.none{background:var(--line-soft);color:var(--ink-faint)}
  #attendRoot .att-rs{font-size:12px;color:var(--ink-faint)}
  #attendRoot .att-rsn-btn{background:var(--line-soft);color:var(--ink-soft);border:none;font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:8px;cursor:pointer}   /* [v189] 빨강(accent) → 중립 — '처리하라'는 독촉 색을 뺐다 */
  #attendRoot .att-rsn-btn:hover{background:var(--line);color:var(--ink)}
  #attendRoot .att-rsn-btn.ghost{background:transparent;color:var(--ink-faint);font-weight:600;padding:5px 2px;text-align:left;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block}
  #attendRoot .att-rsn-btn.ghost:hover{background:var(--line-soft);color:var(--ink-soft)}
  #attendRoot .att-foot{font-size:12px;color:var(--ink-faint);margin-top:14px;line-height:1.6}
  #attendRoot .att-foot b{color:var(--ink-soft)}
  /* ===== [v188 현장선택] 도장 직후 인라인(A) + 표 현장 칸(C) ===== */
  #attendRoot .att-site{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:14px}
  #attendRoot .att-sh{font-size:13.5px;font-weight:800;color:var(--ink);margin-bottom:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  #attendRoot .att-sh b{color:var(--navy)}
  #attendRoot .att-snote{font-size:11.5px;font-weight:600;color:var(--ink-faint)}
  #attendRoot .att-schips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
  #attendRoot .att-schip{display:inline-flex;align-items:center;gap:5px;background:var(--ok-soft);color:var(--ok-ink);font-size:12.5px;font-weight:800;padding:5px 6px 5px 11px;border-radius:9px;max-width:100%;overflow-wrap:anywhere}
  #attendRoot .att-schip i{font-style:normal;font-weight:600;opacity:.7;font-size:11px}
  #attendRoot .att-schip button{border:none;background:transparent;color:inherit;opacity:.6;cursor:pointer;font-size:11px;min-width:24px;min-height:24px;border-radius:6px}
  #attendRoot .att-schip button:hover{opacity:1;background:rgba(0,0,0,.06)}
  #attendRoot .att-sbtns{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
  #attendRoot .att-schoice{background:var(--line-soft);border:1px solid var(--line);color:var(--ink);font-family:inherit;font-size:12.5px;font-weight:700;padding:9px 13px;border-radius:10px;cursor:pointer;min-height:42px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #attendRoot .att-schoice:hover{border-color:var(--navy);color:var(--navy)}
  #attendRoot .att-schoice i{font-style:normal;font-weight:600;opacity:.55;font-size:11px;margin-left:5px}
  #attendRoot .att-schoice.type{background:transparent;border-style:dashed}
  #attendRoot .att-slink{background:none;border:none;color:var(--ink-faint);font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;text-decoration:underline;padding:9px 8px;min-height:42px}
  #attendRoot .att-sskip{font-size:12.5px;color:var(--ink-faint);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  #attendRoot .att-sq{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px 13px;font-family:inherit;font-size:14px;color:var(--ink);background:var(--panel);margin-bottom:8px}
  #attendRoot .att-sq:focus{border-color:var(--navy);outline:none}
  /* ⚠️ 제안 목록 위에 overflow:hidden 조상을 만들지 않는다 — 목업 A안이 부모 overflow에 잘려
     제안 6개 중 1.5개만 보였다(자동완성이 이 기능의 심장인데 절반이 죽어 있었다).
     팝오버가 아니라 인라인 블록이라 구조적으로 잘릴 일이 없다. */
  #attendRoot .att-sugbox{display:flex;flex-direction:column;gap:4px;max-height:280px;overflow-y:auto}
  #attendRoot .att-sug{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--panel);border:1px solid var(--line);color:var(--ink);font-family:inherit;font-size:13px;font-weight:700;padding:10px 12px;border-radius:9px;cursor:pointer;text-align:left;min-height:44px;overflow-wrap:anywhere}
  #attendRoot .att-sug:hover{border-color:var(--navy);background:var(--line-soft)}
  #attendRoot .att-sug i{font-style:normal;font-weight:600;opacity:.5;font-size:11px;flex:none}
  #attendRoot .att-sug.new{border-style:dashed;color:var(--navy)}
  #attendRoot .att-sugnone{font-size:12px;color:var(--ink-faint);padding:10px 2px}
  #attendRoot .att-swarn{background:var(--warn-soft);border:1px solid #E8D3A8;border-radius:10px;padding:11px 13px;font-size:12.5px;color:#8A6522;line-height:1.6;margin-bottom:6px;overflow-wrap:anywhere}
  #attendRoot .att-swarn i{font-style:normal;opacity:.75;font-size:11.5px}
  #attendRoot .att-swarn small{display:block;opacity:.85;margin-top:2px}
  #attendRoot .att-swarn span{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
  #attendRoot .att-sbtn{background:var(--panel);border:1px solid #E0CBA0;color:#8A6522;font-family:inherit;font-size:12px;font-weight:800;padding:8px 12px;border-radius:8px;cursor:pointer;min-height:40px}
  #attendRoot .att-sbtn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
  #attendRoot .att-sfoot{margin-top:8px}
  #attendRoot .att-sitetd{max-width:190px}
  #attendRoot .att-scell{display:flex;flex-wrap:wrap;gap:4px;align-items:center;width:100%;background:none;border:none;font-family:inherit;cursor:pointer;padding:4px 2px;border-radius:7px;min-height:32px;text-align:left}
  #attendRoot .att-scell:hover{background:var(--line-soft)}
  #attendRoot .att-scell .ph{color:var(--ink-faint);opacity:.55;font-size:13px;font-weight:800;border:1px dashed var(--line);border-radius:6px;padding:1px 9px}
  #attendRoot .att-tsite{display:inline-block;background:var(--line-soft);color:var(--ink-soft);font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:7px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #attendRoot .att-tdash{color:var(--ink-faint)}
  #attendRoot .att-lock{font-size:13px;margin-left:6px;vertical-align:-1px;line-height:1}   /* [v189] 권한 표기 — SVG 대신 이모지 */
  /* [v191 퇴사 기록] 결재 도장란의 퇴사자 표시 — 도장을 가리지 않게 작고 옅게 */
  .st-retired{display:block;font-size:9.5px;font-weight:700;color:var(--ink-faint);letter-spacing:-.02em;margin-top:1px}
  /* ===== [v177 폰수리·출퇴근] 반드시 att 정의 '뒤'에 둔다 =====
     통계 4칸: 390px에서 칸당 64px인데 숫자가 26px → 뭉개짐. 2×2로.
     근태 내역: 7열 표가 폰에서 85px 숨는데 overflow:hidden이라 손가락으로 밀 수조차 없었다 → 가로 스크롤 허용.
     (표→카드 전환은 renderLog 분기 6개를 이중화해야 해서 이번 범위에서 제외 — 진권에게 보고) */
  @media(max-width:780px){
    #attendRoot .att-stats{grid-template-columns:1fr 1fr}
    #attendRoot .att-stat{padding:12px 14px}
    #attendRoot .att-sn{font-size:21px}
    #attendRoot .att-card{overflow-x:auto;-webkit-overflow-scrolling:touch}
    #attendRoot .att-rsn-btn{min-height:38px;padding:8px 12px}
    #attendRoot .att-acts{flex-wrap:wrap}
    /* [v188 현장선택] 폰(현장직 주 사용처) — 칩은 2열, 입력칸은 16px(iOS가 16px 미만이면
       탭할 때마다 화면을 자동 확대해 튄다), 표 현장 칸은 좁혀서 가로 스크롤 부담을 줄인다. */
    #attendRoot .att-schoice{flex:1 1 calc(50% - 3px);white-space:normal}
    #attendRoot .att-sq{font-size:16px}
    #attendRoot .att-sitetd{max-width:130px}
    #attendRoot .att-site{padding:12px 13px}
  }
  .att-overlay{position:fixed;inset:0;background:rgba(22,29,45,.5);backdrop-filter:blur(3px);z-index:300;display:flex;align-items:flex-start;justify-content:center;padding:60px 20px;overflow-y:auto}
  .att-modal{background:var(--panel);border-radius:18px;box-shadow:var(--shadow-lg);width:100%;max-width:480px}
  .att-modal-h{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center}
  .att-modal-h h3{font-size:16px;font-weight:800}
  .att-modal-h .att-x{margin-left:auto;width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);font-size:14px;cursor:pointer}
  .att-modal-b{padding:22px}
  .att-modal-f{padding:15px 22px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end}
  .att-mbtn{border:none;border-radius:9px;padding:10px 20px;font-size:14px;font-weight:800;background:var(--navy);color:#fff;cursor:pointer}
  .att-mbtn.ghost{background:var(--panel);border:1px solid var(--line);color:var(--ink-soft)}
  .att-fld{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;color:var(--ink);background:var(--panel);outline:none;margin-bottom:2px}
  .att-fld:focus{border-color:var(--navy-2)}
  .att-rsn-item{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:10px}
  .att-rsn-h{display:flex;align-items:center;gap:9px;font-size:14px;margin-bottom:9px}
  .att-rsn-l{font-size:11px;color:var(--ink-faint);font-weight:700;margin:9px 0 4px}
  .att-rsn-info{font-size:11.5px;color:var(--ink-faint);margin-top:14px;line-height:1.5}
  .lg-copy{position:absolute;bottom:3vh;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:#A9B5AD;z-index:3;white-space:nowrap}
  /* 폰에서는 줄바꿈(종전 nowrap 이라 390px 에서 양옆이 잘렸다) */
  @media(max-width:480px){ .lg-copy{white-space:normal;width:92%;text-align:center;letter-spacing:.12em;font-size:10px} }
  /* [2026-10-19] 흰 빛 → 계절색 번짐: 색 = login.js lgWashColor(그 직원 라이트/다크 바탕 + 계절색 조금) · 큰 그림 자리에서 원으로 퍼진다 */
  #lgFlash{position:absolute;left:0;top:0;width:100%;height:100%;z-index:8;pointer-events:none;background:var(--lg-wash,#F6F8F7);
    clip-path:circle(0% at var(--lg-wx,78%) var(--lg-wy,22%));transition:clip-path .62s cubic-bezier(.45,0,.2,1)}
  /* [v171 진입끊김] 입장 커버 — 워프가 끝나고 applyLogin이 도는 동안 화면을 덮는다.
     ⚠️ 왜 필요한가: `body.locked .app{display:none}`이라 로그인 중엔 앱 트리가 통째로 렌더 밖에 있다.
        locked를 떼는 순간 none→block 전환으로 전체 레이아웃이 한 번에 계산되고, 곧바로
        setView('dash')가 위젯까지 그린다. v170에서는 이 과정이 문 연출 뒤에 가려져 안 보였는데,
        문을 걷어내면서 그대로 노출됐다(진권 "마지막 화면 직전에 끊긴다").
     ⚠️ #lgFlash로는 대체 불가 — 그건 #loginScreen 자식이라 locked가 떨어지면 같이 사라진다.
        그래서 body 직속 독립 요소여야 한다.
     ⚠️ z-index 890 = 브리핑(#bfOv 900)보다 아래. 커버는 브리핑이 뜨기 전에 이미 걷힌다. */
  /* 커버는 '로그인 화면 → 대시보드'를 잇는 다리다. [2026-10-19] 색 = 번짐과 같은 입장 색(login.js lgCoverUp 이 넣음 ·
     다크 직원이면 어두운 계절색) — 종전엔 흰 플래시에 맞춰 다크에서도 흰색 고정이라 다크 직원은 로그인마다 하얗게 번쩍였다. 아래 #F6F8F7 은 색이 안 왔을 때만 */
  #lgCover{position:fixed;inset:0;z-index:890;background:#F6F8F7;pointer-events:none;
    opacity:1;transition:opacity .3s ease}
  @media (prefers-reduced-motion:reduce){ #lgCover{transition:none} }
  @media (prefers-reduced-motion: reduce){ .lg-logo,.lg-eyebrow,.lg-slogan,.lg-sub,.lw-card{animation:none} }
  .me .logout-btn{margin-left:auto;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.07);color:#fff;font-size:11.5px;font-weight:700;padding:6px 11px;border-radius:8px;cursor:pointer;flex:none}
  .me .me-role{font-size:11px;color:rgba(255,255,255,.6)}
  /* ═══════════ [v199 조직도] A안 계층도 — 사업부 특색 반영 ═══════════
     구 v119 좌우 2칸 트리(.org-wrap/.org-tree/.org-p/.org-dhead …)를 걷어내고 계층도로 갈았다.
     ⚠️ 클래스는 전부 org- 접두어를 붙였다. 목업 원본의 .nb/.top/.mid/.lane 같은 짧은 이름을
        그대로 옮기면 메인에 이미 있는 .top(3곳)과 정면 충돌한다.
     ⚠️ 색은 전부 CSS 변수로 바꿨다. 목업은 라이트 전용 하드코딩(#fff·#f6f8f7)이었는데
        메인은 다크 테마가 있어서 그대로 두면 다크에서 흰 박스가 그대로 뜬다. */
  .org-head{display:flex;align-items:center;gap:11px;margin-bottom:13px;flex-wrap:wrap}
  .org-search{display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);border-radius:10px;padding:8px 11px;background:var(--panel);flex:0 1 290px;min-width:190px}
  .org-search svg{width:15px;height:15px;stroke:var(--ink-faint);fill:none;stroke-width:2;flex:none}
  .org-search input{border:none;outline:none;font-size:14px;font-family:inherit;flex:1;min-width:0;background:transparent;color:var(--ink)}
  .org-legend{display:flex;gap:11px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-faint);font-weight:600;align-items:center}
  .org-legend i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:-1px}
  .org-allbtn{margin-left:auto;border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);font-family:inherit;font-size:12px;font-weight:700;border-radius:9px;padding:8px 13px;cursor:pointer;flex:none}
  .org-allbtn:hover{background:var(--bg)}
  .org-stage{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:24px 20px 28px;overflow-x:auto}
  .org-empty{padding:26px 10px;text-align:center;color:var(--ink-faint);font-size:14px}

  /* 검색 결과 — 계층도는 건드리지 않고 위에 따로 깐다.
     계층에서 사람을 걸러내면 소장·팀장이 사라져 라인이 통째로 무너지기 때문이다. */
  .org-hits{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:13px 15px;margin-bottom:13px}
  .org-hits-t{font-size:11.5px;font-weight:800;color:var(--ink-faint);letter-spacing:.03em;margin-bottom:9px}
  .org-hits-w{display:flex;gap:6px;flex-wrap:wrap}

  .org-nb{background:var(--panel);border:1.5px solid var(--line);border-radius:11px;padding:8px 13px;cursor:pointer;transition:border-color .13s,box-shadow .13s,transform .13s;text-align:center;white-space:nowrap}
  .org-nb:hover{border-color:var(--navy);box-shadow:0 4px 13px rgba(var(--sea-rgb,27,111,245),.16);transform:translateY(-1px)}
  .org-nb.on{border-color:var(--navy);box-shadow:0 0 0 3px rgba(var(--sea-rgb,27,111,245),.16)}
  .org-nb .n{font-size:13.5px;font-weight:800;color:var(--ink)}
  .org-nb .r{font-size:11px;color:var(--ink-faint);margin-top:1px;font-weight:600}

  .org-top{display:flex;justify-content:center}
  .org-ceo{background:var(--ink);color:var(--panel);border-radius:14px;padding:13px 30px;cursor:pointer;text-align:center;transition:filter .13s}
  .org-ceo:hover{filter:brightness(1.15)}
  .org-ceo .n{font-size:17px;font-weight:800}
  .org-ceo .r{font-size:11.5px;opacity:.66;margin-top:2px}

  /* ═══ [2026-10-03 조직도 선] 연결선 — 칸이 자기 몫만 그린다(칸 수·칸 폭을 가정하지 않음) ═══
     종전: 탭 줄 가로선 = 무대 폭 8%~92% · 파트 가로선 = calc(50% / --n)(칸이 같은 폭으로 꽉 찬다는 가정)이라
           칸이 max-width 242px + 가운데 정렬이면 가로선이 칸 가운데에 안 닿고 허공에서 끊겼다. 줄기는 머리 칸을 지나쳐 나갔다.
     지금: 「부채」(.org-fan) = 위 칸 하나 → 아래 칸 여럿 · 「단계」(.org-lvl) = 위 칸 하나 → 아래 칸 하나
       · 부채 ::before = 줄기(위 칸 아래 테두리 → 첫 줄 가로선)
       · 칸 ::before = 가로선 몫(양옆 빈틈 절반까지 · 첫 칸은 가운데부터 · 끝 칸은 가운데까지) / 칸 ::after = 칸 위 세로선(가로선 → 칸 위 테두리)
       · 마지막이 아닌 줄 ::after = 줄기가 그 줄 가운데 빈틈을 지나 다음 줄 가로선까지(org.js 가 그 줄 칸 수를 짝수로 맞춘다)
       · 단계 ::before = 위 칸 아래 테두리 → 이 칸 위 테두리
     선 두께 2px · 가운데 정렬(50% - 1px) · 색 var(--line)(다크·계절 테마 그대로). 펼침 애니메이션은 .org-open 이 통째로 움직여 선이 따로 놀지 않는다.
     줄 나누기 · 같은 폭(--cw)은 org.js orgFanLayout. 좁은 화면에서 선을 숨기던 @media 규칙은 없앴다(줄을 감아도 선이 맞는다). */
  .org-fan{position:relative;--g:10px;--h:14px;--t:18px;--rl:22px;--cw:auto;padding-top:var(--t)}
  .org-fan::before{content:'';position:absolute;top:0;left:calc(50% - 1px);width:2px;height:var(--t);background:var(--line)}
  .org-fan.noroot{padding-top:0}
  .org-fan.noroot::before{display:none}
  .org-frow{display:flex;justify-content:center;align-items:flex-start;gap:var(--g);position:relative;padding-top:var(--h)}
  .org-fan.wrap > .org-frow:not(:last-child){padding-bottom:12px}
  .org-fan.wrap > .org-frow:not(:last-child)::after{content:'';position:absolute;top:0;bottom:0;left:calc(50% - 1px);width:2px;background:var(--line)}
  .org-fc{position:relative;flex:0 0 var(--cw);min-width:0;display:flex;flex-direction:column;align-items:center}
  .org-fc::before{content:'';position:absolute;top:calc(-1 * var(--h));left:calc(var(--g) / -2);right:calc(var(--g) / -2);height:2px;background:var(--line)}
  .org-fc:first-child::before{left:calc(50% - 1px)}
  .org-fc:last-child::before{right:calc(50% - 1px)}
  .org-fc:first-child:last-child::before{display:none}
  .org-fc::after{content:'';position:absolute;top:calc(-1 * var(--h));left:calc(50% - 1px);width:2px;height:var(--h);background:var(--line)}
  /* 구분선(사업부 | 지원조직) — 폭을 차지하지 않는다(빈틈 가운데에 선만 · 가로선은 양옆 칸 몫이 이어 그린다). 줄 끝·줄기 자리면 org.js 가 부채 밑으로 빼서 숨긴다 */
  .org-fsep{flex:0 0 2px;align-self:stretch;margin:6px calc((var(--g) + 2px) / -2);background:linear-gradient(var(--line),var(--line)) center / 1px 100% no-repeat}
  .org-fan > .org-fsep{display:none}
  /* 세로 목록(레일 — 한 줄에 두 칸이 안 들어갈 때) — [2026-10-03 실측 재검증 · 사용자 결정 1-1] 트리 목록식 ├─
     · 레일은 칸들 왼쪽에 세우고 칸은 레일보다 들여 쓴다(왼쪽 정렬)
     · 가지는 칸 왼쪽 옆구리의 머리 높이(--by)로 들어간다 — 사람·탭 칸 = 칸 세로 가운데 · 파트 = 파트 머리 가운데 · 라인 블록 = 라인 머리 가운데
     · 위 칸에서 오는 줄기는 가운데에서 내려와 레일로 꺾인다(┘). 레일은 마지막 칸 가지에서 끝난다(└)
     종전엔 가지가 칸 위 가운데로 들어가고 다음 단계 줄기가 마지막 사람 바로 밑에서 내려가, 「셋째 사람 밑에 파트가 달린」 사슬로 읽혔다 */
  .org-fan.rail{--by:50%}
  .org-fan.rail[data-fan="parts"]{--by:15px}   /* 파트 머리 높이 30px 의 가운데 */
  .org-fan.rail[data-fan="blocks"]{--by:28px}  /* 블록 테두리 1 + 위 여백 13 + 라인 머리 높이 28px 의 가운데 14 */
  .org-fan.rail > .org-frow{padding:0 var(--rl) 12px var(--rl);justify-content:flex-start}
  .org-fan.rail > .org-frow:last-child{padding-bottom:0}
  .org-fan.rail > .org-frow > .org-fc::before{display:block;top:calc(var(--by) - 1px);left:calc(var(--rl) / -2 - 1px);right:auto;width:calc(var(--rl) / 2 + 1px);height:2px}
  .org-fan.rail > .org-frow > .org-fc::after{display:none}
  .org-fan.rail > .org-frow::after{content:'';position:absolute;top:0;bottom:0;left:calc(var(--rl) / 2 - 1px);width:2px;background:var(--line)}
  .org-fan.rail:not(.cont) > .org-frow:last-child::after{bottom:auto;height:calc(var(--by) + 1px)}
  .org-fan.rail:not(.noroot){padding-top:calc(var(--t) / 2 + 1px)}   /* 들어오는 줄기: 가운데로 반만 내려와(::before) 레일 쪽으로 꺾인다(::after 가로) — 레일은 첫 줄 위에서 시작 */
  .org-fan.rail:not(.noroot)::before{height:calc(var(--t) / 2 + 1px)}
  .org-fan.rail:not(.noroot)::after{content:'';position:absolute;top:calc(var(--t) / 2 - 1px);height:2px;left:calc(var(--rl) / 2 - 1px);right:calc(50% - 1px);background:var(--line)}
  .org-fan.rail[data-fan="parts"] > .org-frow > .org-fc > .org-phead{align-self:stretch;justify-content:center}   /* 파트 머리를 칸 폭으로 — 가지가 머리 왼쪽 테두리에 닿게 */
  /* 아래 단계가 이어지는 나란한 줄(사업책임자 2명 등) — 칸마다 아래 세로선 + 밑 가로선, 그 가운데에서 다음 단계로 */
  .org-dn{display:none}
  .org-fan.cont:not(.wrap):not(.rail) > .org-frow:last-child{align-items:stretch;padding-bottom:var(--h)}
  .org-fan.cont:not(.wrap):not(.rail) > .org-frow:last-child > .org-fc > .org-dn{display:block;flex:1 0 0;align-self:stretch;position:relative}
  .org-fan.cont:not(.wrap):not(.rail) > .org-frow:last-child > .org-fc > .org-dn::after{content:'';position:absolute;top:0;bottom:calc(-1 * var(--h));left:calc(50% - 1px);width:2px;background:var(--line)}
  .org-fan.cont:not(.wrap):not(.rail) > .org-frow:last-child > .org-fc > .org-dn::before{content:'';position:absolute;bottom:calc(-1 * var(--h));height:2px;left:calc(var(--g) / -2);right:calc(var(--g) / -2);background:var(--line)}
  .org-fan.cont:not(.wrap):not(.rail) > .org-frow:last-child > .org-fc:first-child > .org-dn::before{left:calc(50% - 1px)}
  .org-fan.cont:not(.wrap):not(.rail) > .org-frow:last-child > .org-fc:last-child > .org-dn::before{right:calc(50% - 1px)}
  .org-fan.cont:not(.wrap):not(.rail) > .org-frow:last-child > .org-fc:first-child:last-child > .org-dn::before{display:none}
  /* [2026-10-03 적대 검토 7 · 실측 재검증] 아래 단계가 이어지는 나란한 줄이 레일이 되면 — 아래 단계 선은 마지막 사람 밑이 아니라 **레일 끝**에서 시작한다:
     레일이 마지막 칸보다 14px 더 내려가 부채 바닥에서 꺾여(└) 아래 단계 가운데로 들어간다 → 「이 묶음 전체 밑」으로 읽힌다(사람 칸 가운데와 줄기 x 가 겹치지 않음).
     아래 단계도 레일이면(.to-rail · org.js) 가운데를 들렀다 오지 않고 한 단계 들여 쓴 레일(레일 x + --rl)로 곧장 — ㄷ자 되꺾임 없는 들여쓰기 목록 */
  .org-fan.cont.rail > .org-frow:last-child{padding-bottom:14px}
  .org-fan.cont.rail > .org-frow:last-child::before{content:'';position:absolute;bottom:0;height:2px;left:calc(var(--rl) / 2 - 1px);right:calc(50% - 1px);background:var(--line)}
  .org-fan.cont.rail.to-rail > .org-frow:last-child::before{right:auto;width:calc(var(--rl) + 2px)}
  .org-fan.cont.rail + .org-fan.rail{padding-left:var(--rl)}
  .org-fan.cont.rail + .org-fan.rail::before{left:calc(var(--rl) * 1.5 - 1px)}
  .org-fan.cont.rail + .org-fan.rail::after{display:none}
  /* [2026-10-03 적대 검토 1] 칸 하나뿐인 부채 — 폭이 모자라면 그 칸이 줄어든다(레일 없음) */
  .org-fan.one[data-fan="blocks"] > .org-frow > .org-fc{flex:1 1 auto;min-width:0}
  .org-fan.one[data-fan="parts"] > .org-frow > .org-fc{min-width:0}
  /* [2026-10-03 적대 검토 2] 위 칸이 없으면(대표이사 없음) 줄기뿐 아니라 가로선·칸 위 세로선·레일도 긋지 않는다 — 허공에 뜬 선 토막이 남았다.
     !important = 줄기·레일 규칙(.wrap/.rail/:not(:last-child))이 더 구체적이라 한 번에 끄려고 */
  .org-fan.noroot > .org-frow{padding-top:0}
  .org-fan.noroot > .org-frow::before, .org-fan.noroot > .org-frow::after,
  .org-fan.noroot > .org-frow > .org-fc::before, .org-fan.noroot > .org-frow > .org-fc::after{display:none !important}
  /* 단계 하나(위 칸 하나 → 아래 칸 하나) · 단계 이름은 들어오는 세로선 오른쪽에 작게(선이 글자에서 끊기지 않고 사람 칸 테두리에 닿게) */
  .org-lvl{position:relative;display:flex;flex-direction:column;align-items:center;--t:18px;padding-top:var(--t)}
  .org-lvl::before{content:'';position:absolute;top:0;left:calc(50% - 1px);width:2px;height:var(--t);background:var(--line)}
  .org-lvl.sm{--t:13px;width:100%}
  .org-lvl > .org-vacant{margin:0}
  .org-step{position:absolute;top:calc(var(--t) / 2 - 7px);left:calc(50% + 8px);font-size:10.5px;line-height:14px;color:var(--ink-faint);font-weight:700;white-space:nowrap;pointer-events:none}
  .org-lvl.cap, .org-fan.cap{--t:30px}   /* [2026-10-03] 이름 단 단계는 세로선을 늘려 이름(14px) 위아래로 8px 씩 띄운다 — 머리 상자·칸에 맞닿지 않게 */

  /* ═══ [v199 조직도·파트] 조직 탭 줄 — 접힌 조직은 아이콘+이름만이라 한 줄에 들어간다 ═══
     ⚠️ 구조를 바꾼 이유: 엑셀 「팀·파트」가 채워지면서 계층이 한 단 깊어졌다
        (사업부 → 책임자 → 소장 → **파트(팀장)** → 파트원). 사업부를 가로로 세운 채
        그 안에 파트를 넣으면 컬럼 하나가 292px뿐이라 파트 이름조차 안 들어간다.
        그래서 **한 번에 한 조직만** 아래에 전체 폭으로 펼친다.
     [2026-10-03 조직도 선] 탭은 가장 넓은 탭 폭으로 모두 같은 폭(사용자 결정 3-1 · org.js 가 --cw) — 가로선이 대표이사 줄기에 대해 좌우 대칭.
        새 사업부 이름이 길어도 탭 하나가 한없이 넓어지지 않게 168px 에서 자른다(전체 이름은 title).
     [2026-10-03 사용자 요청] 탭 둘째 줄(인원 · 책임자 · 「책임자 겸직」 · 「결재 합의」)을 뺐다 — 한 줄 높이 · 지원조직은 점선 테두리로만 구분 */
  .org-fan[data-fan="tabs"]{--g:8px;--h:16px;--t:20px}
  .org-fan[data-fan="tabs"] > .org-frow > .org-fc > .org-tab{align-self:stretch}
  .org-tab{border:1.5px solid var(--line);background:var(--panel);border-radius:12px;padding:9px 11px;
           cursor:pointer;text-align:center;transition:all .13s;min-width:96px;max-width:168px;position:relative;
           font-family:inherit;color:var(--ink)}
  .org-tab:hover{border-color:var(--c,var(--navy));transform:translateY(-1px)}
  .org-tab.on{background:var(--c,var(--navy));border-color:var(--c,var(--navy));color:#fff}
  .org-tab .tn{font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:5px;min-width:0}
  .org-tab .tn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9;flex:none}
  .org-tab .tl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .org-tab.sup{border-style:dashed}

  /* 펼친 조직 본문 — 전체 폭. 머리(조직 이름 상자) → 사업책임자 → … 가 한 나무로 이어진다 */
  .org-open{margin-top:16px;padding-top:16px;border-top:2px solid var(--line);position:relative;
            animation:orgIn .19s ease-out both}
  @keyframes orgIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  @media (prefers-reduced-motion: reduce){ .org-open{animation:none} }
  .org-openh{display:flex;justify-content:center}
  .org-openhb{display:inline-flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap;max-width:100%;
              border:1.5px solid var(--line);border-radius:12px;padding:8px 14px;background:var(--panel)}
  .org-openh .t{font-size:15px;font-weight:800;color:var(--c,var(--ink));display:flex;align-items:center;gap:7px}
  body[data-theme="dark"] .org-openh .t{color:color-mix(in srgb,var(--c,var(--ink)) 55%,#fff)}   /* [2026-10-18 8000 점검] 관리부·구매부 색이 다크 패널에서 2.5:1 */
  .org-openh .t svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;flex:none}
  .org-fan[data-fan="peers"]{--g:8px}
  .org-fan[data-fan="peers"] > .org-frow > .org-fc > .org-nb{align-self:stretch}

  /* ═══ 파트 — 파트가 가지처럼 좌우로 갈라지고 팀장→팀원이 아래로 내려온다(칸 안 세로선 하나로 이어짐) ═══
     한 줄이면 칸이 148~242px 사이 같은 폭으로 늘고, 넘치면 org.js 가 짝수 칸 줄로 감는다(--cw) */
  .org-fan[data-fan="parts"]{--g:11px;--h:16px;--t:16px}
  .org-fan[data-fan="parts"] > .org-frow > .org-fc{flex:1 1 0;min-width:148px;max-width:242px}
  .org-fan[data-fan="parts"].wrap > .org-frow > .org-fc{flex:0 0 var(--cw);min-width:0;max-width:none}
  .org-fan.rail[data-fan="parts"] > .org-frow > .org-fc,
  .org-fan.rail[data-fan="blocks"] > .org-frow > .org-fc{flex:1 1 auto;min-width:0;max-width:none}
  .org-phead{background:var(--c,var(--navy));color:#fff;border-radius:10px;padding:0 12px;height:30px;box-sizing:border-box;   /* 높이 고정 — 레일 가지가 머리 가운데(15px)로 들어간다 */
             display:flex;align-items:center;gap:7px;white-space:nowrap;max-width:100%}
  /* [2026-10-03 실측 재검증 · 사용자 결정 2-1] 공동 팀장(한 파트에 팀장 2명 이상) — 다른 「한 단계 여러 명」처럼 나란히(파트 머리 아래 가로선 + 칸마다 세로선) · 좁으면 레일 */
  .org-pcol > .org-fan{align-self:stretch;--t:13px;--h:12px}
  .org-phead .pn{font-size:12.5px;font-weight:800;overflow:hidden;text-overflow:ellipsis}
  /* 파트원 칩 — [2026-10-03 사용자 요청] 테두리 묶음 칸 없이 팀장 칸(없으면 파트명) 바로 밑에 가운데 모은다 · 선 없음(칩 사이 빈틈에 선이 꽂히지 않게) */
  .org-pmem{width:100%;margin-top:6px}
  .org-nolead{font-size:10.5px;color:var(--ink-faint);font-weight:700;margin-top:6px}

  /* 유선 T/B — 라인마다 소장·파트가 따로인 **다른 조직**이라 좌우로 나란히 세운다(진권 지시).
     ⚠️ 세로로 쌓았더니 유선만 1797px까지 길어졌다. 나란히 놓으면 높이가 둘 중 큰 쪽으로 수렴한다.
     [2026-10-03 실측 검증] 블록은 같은 폭(종전 파트 수 비율 4:2 는 사업책임자 줄기가 가로선 가운데에서 44~76px 비켰다) — 좁은 블록 안 파트는 그 안에서 감긴다.
     [2026-10-03 조직도 선] 블록 하한(--mw)을 다 합쳐 안 들어가면 세로 목록(레일)으로 — 종전 @media(max-width:1080px) 100% 쌓기 대신 */
  .org-fan[data-fan="blocks"]{--g:13px;--h:16px}
  .org-fan[data-fan="blocks"]:not(.rail) > .org-frow > .org-fc{flex:1 1 0;min-width:0}
  .org-fan[data-fan="blocks"].wrap > .org-frow > .org-fc{flex:0 0 var(--cw)}
  .org-fan[data-fan="blocks"] > .org-frow > .org-fc > .org-line{align-self:stretch}
  .org-line{display:flex;flex-direction:column;align-items:center;min-width:0;
            border:1px solid var(--line);border-radius:14px;padding:13px 9px 15px;background:var(--bg)}
  .org-line > .org-fan, .org-line > .org-lvl{align-self:stretch}
  .org-lineh{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:800;max-width:100%;height:28px;box-sizing:border-box;   /* 높이 고정 — 레일 가지 높이(--by 28px) */
             color:#fff;background:var(--c,var(--navy));border-radius:9px;padding:0 13px}
  /* [v199] T=빨강 · B=녹색 (진권 지시). 배지가 작아 대비가 중요 — 흰 글자 4.87 / 5.58 실측.
     사업부 5색에서 빨강·녹색을 비워둬서 배지와 색면이 서로 안 헷갈린다. */
  .org-tb{font-size:9.5px;font-weight:800;border-radius:5px;padding:1px 5px;margin-left:4px;
          color:#fff;background:var(--ink-faint);vertical-align:1px}
  .org-tb.t{background:#D53038}
  .org-tb.b{background:#1C7742}

  .org-members{display:flex;gap:5px;flex-wrap:wrap;justify-content:center}
  .org-mchip{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:4px 9px;font-size:11.5px;cursor:pointer;font-weight:700;white-space:nowrap;color:var(--ink);font-family:inherit}
  .org-mchip:hover{border-color:var(--navy);background:var(--bg)}
  .org-mchip.on{border-color:var(--navy);box-shadow:0 0 0 2.5px rgba(var(--sea-rgb,27,111,245),.16)}
  .org-mchip .mr{color:var(--ink-faint);font-weight:600;font-size:10.5px;margin-left:3px}
  .org-moreb{font-size:11px;color:var(--ink-faint);background:var(--bg);border:1px dashed var(--line);border-radius:8px;padding:5px 11px;cursor:pointer;font-family:inherit;font-weight:700}
  .org-solo{font-size:11.5px;color:var(--ink-faint);background:var(--bg);border:1px dashed var(--line);border-radius:9px;padding:8px 13px;text-align:center;word-break:keep-all;max-width:184px;line-height:1.55;font-weight:600}
  .org-vacant{font-size:11px;color:#8A6A20;background:#FDF6E8;border:1px dashed #E8D3A8;border-radius:8px;padding:5px 10px;margin-bottom:7px;font-weight:700}
  body[data-theme="dark"] .org-vacant{color:#E8C98A;background:rgba(232,201,138,.10);border-color:rgba(232,201,138,.30)}
  .org-pleave{font-size:10px;font-weight:800;color:#2E86E8;background:#e2f3f1;border-radius:20px;padding:1px 7px;flex:none}
  body[data-theme="dark"] .org-pleave{color:#7FD9CB;background:rgba(46,134,232,.16)}

  /* 인물카드 = 오버레이. showModal(#modalRoot)을 쓰지 않는다 —
     작성 모달이 떠 있는 상태에서 겹치면 #modalRoot 가 통째로 덮어써지기 때문(1703줄 교훈).
     z-index 440 = 메일모달(430) 위 · 워크독(460)·Ctrl+K(500) 아래. */
  .org-pcb{position:fixed;inset:0;background:rgba(16,26,22,.44);z-index:440;display:none}
  .org-pcb.on{display:block}
  .org-pcard{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(560px,93vw);max-height:86vh;overflow-y:auto;background:var(--panel);border-radius:18px;box-shadow:0 24px 70px rgba(10,20,16,.34);z-index:441;display:none}
  .org-pcard.on{display:block}
  .org-pcard .org-card{border:none;border-radius:18px}
  .org-pcx{position:absolute;top:13px;right:13px;width:30px;height:30px;border:none;background:var(--bg);border-radius:9px;cursor:pointer;font-size:15px;color:var(--ink-soft);font-family:inherit;z-index:2}
  .org-pcx:hover{background:var(--line)}
  .org-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 24px}
  .org-chead{display:flex;align-items:center;gap:15px;padding-bottom:16px;border-bottom:1px solid #f0eef6}
  .org-cname{font-size:19px;font-weight:800;color:var(--ink)}
  .org-csub{font-size:13.5px;color:var(--ink-soft);margin-top:3px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
  .org-divchip{font-size:11px;font-weight:800;color:#fff;border-radius:20px;padding:2px 9px}
  /* ⚠️ 종전엔 margin-left:auto 로 헤더 오른쪽 끝에 붙어서 닫기(✕) 버튼과 겹쳤다(진권 지적).
     이름 바로 옆으로 옮기고, 알약 대신 점 하나 + 글자로 가볍게 바꿨다. */
  .org-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;
             border-radius:20px;padding:2px 9px 2px 8px;margin-left:9px;vertical-align:3px;flex:none}
  .org-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
  .org-badge.work{background:#EAF4EE;color:var(--navy-deep)}
  .org-badge.leave{background:#e2f3f1;color:#1f7a6e}
  body[data-theme="dark"] .org-badge.work{background:rgba(var(--sea-dk-rgb,141,180,255),.14);color:#6FD9AC}
  body[data-theme="dark"] .org-badge.leave{background:rgba(46,134,232,.16);color:#7FD9CB}
  .org-rows{display:grid;grid-template-columns:1fr 1fr;gap:2px 22px;margin-top:14px}
  .org-row{display:flex;align-items:baseline;gap:10px;padding:8px 2px;border-bottom:1px dashed #f0eef6;font-size:14px}
  .org-row .k{flex:0 0 58px;font-size:11.5px;font-weight:700;color:var(--ink-faint)}
  /* ⚠️ word-break:break-all 이었는데 그건 '어디서든' 끊는다 — 이메일이 'f2telecom.' / 'com' 으로,
     근속 표기가 '(근속 1' / '0년차)' 로 잘렸다. anywhere 는 넘칠 때만, 그것도 낱말 우선으로 끊는다. */
  .org-row .v{color:var(--ink);font-weight:600;min-width:0;overflow-wrap:anywhere}
  /* 이메일처럼 긴 값은 2열 그리드에 우겨넣지 않고 한 줄을 통째로 쓴다 */
  .org-row.full{grid-column:1/-1}
  .org-sec{font-size:12px;font-weight:800;color:var(--ink-faint);letter-spacing:.03em;margin:18px 0 8px}
  .org-hist{display:flex;flex-direction:column;gap:7px}
  .org-hi{display:flex;gap:12px;font-size:13.5px;align-items:baseline}
  .org-hi .d{flex:0 0 62px;color:var(--ink-faint);font-weight:700;font-variant-numeric:tabular-nums}
  .org-hi .t{color:var(--ink-soft);font-weight:600}
  @media(max-width:860px){ .org-rows{grid-template-columns:1fr} .org-allbtn{margin-left:0} }
  /* v119: 필수공지 수신확인 */
  .req-banner{--postit-c:#C4534E;display:flex;align-items:center;gap:10px;background:#fdf0f0;padding:12px 17px;margin:0 0 14px;font-size:14px;color:#8a2d33}   /* 띠·모서리 = 「포스트잇」 블록(바탕색 유지) · 테두리 없음(종전 1px #f3c2c6 자리 = padding +1) */
  .req-banner svg{width:18px;height:18px;stroke:#C4534E;fill:none;stroke-width:2;flex:none}
  .req-banner b{color:#C4534E;flex:none}
  .req-banner .rb-t{color:#a05a60;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
  .req-banner button{flex:none;border:none;background:#C4534E;color:#fff;font-weight:800;font-size:12px;border-radius:8px;padding:7px 14px;cursor:pointer;font-family:inherit}
  .req-banner button:hover{background:#9e2429}
  /* [2026-10-03 포스트잇 마감] 다크 — 밝은 분홍(#fdf0f0)이 어두운 화면에서 혼자 눈부셨다 → 띠색을 다크 카드색에 섞은 바탕 · 글자 대비 4.5:1 이상(실측은 보고서) */
  body[data-theme="dark"] .req-banner{background:color-mix(in srgb,#C4534E 18%,var(--panel));color:#EBC9CB}
  body[data-theme="dark"] .req-banner svg{stroke:#E88F86}
  body[data-theme="dark"] .req-banner b{color:#E88F86}
  body[data-theme="dark"] .req-banner .rb-t{color:#D9AFB2}
  .ntc-req{font-size:10px;font-weight:800;color:#fff;background:#C4534E;border-radius:6px;padding:2px 7px;margin-right:7px;vertical-align:1px}
  .ntc.needack{border-color:#f3c2c6;background:#fffbfb}
  .ntc-tgtchip{font-size:10.5px;font-weight:700;color:#5a4fb0;background:#eeecf8;border-radius:20px;padding:2px 8px;margin-left:8px;vertical-align:1px}
  .ntc-ackbtn{border:1px solid #C4534E;background:#fff;color:#C4534E;font-weight:800;font-size:11.5px;border-radius:7px;padding:3px 10px;cursor:pointer;font-family:inherit}
  .ntc-ackbtn:hover{background:#C4534E;color:#fff}
  .ntc-acked{color:#2E86E8;font-weight:800}
  .ntc-ackstat{border:1px solid #e2e0ee;background:#f8f7fc;color:#6E6B85;font-weight:700;font-size:11.5px;border-radius:7px;padding:3px 10px;cursor:pointer;font-family:inherit}
  .ntc-ackstat:hover{border-color:#C4534E;color:#C4534E}
  .ntc-ackstat.full{color:#2E86E8;border-color:#bfe5df}
  .ntc-tgtwrap{background:#f8f7fc;border-radius:10px;padding:12px 14px;margin-top:2px}
  .ntc-tgtl{font-size:11.5px;color:#6E6B85;font-weight:700;margin-bottom:8px}
  .ntc-tgtchips{display:flex;flex-wrap:wrap;gap:7px}
  .modal.req-gate .reqg-meta{font-size:12px;color:#8b85a0;margin-bottom:8px}
  .modal.req-gate .reqg-title{font-size:16.5px;font-weight:800;color:#241f33;margin-bottom:10px}
  .modal.req-gate .reqg-body{font-size:14px;line-height:1.75;color:#4b4668;background:#f8f7fc;border-radius:11px;padding:15px 17px;max-height:290px;overflow-y:auto;white-space:pre-wrap}
  .modal.req-gate .reqg-agree{display:flex;align-items:center;gap:9px;margin-top:15px;font-size:14px;font-weight:700;color:#241f33;cursor:pointer}
  .modal.req-gate .reqg-agree input{width:17px;height:17px;accent-color:#C4534E;cursor:pointer}
  .modal.req-gate .x{display:none}
  #reqAckBtn:disabled{opacity:.4;cursor:not-allowed}
  .reqr-tbl td{vertical-align:top}
  .reqr-bar{display:inline-block;width:90px;height:8px;background:#efedf6;border-radius:5px;overflow:hidden;vertical-align:middle;margin-right:7px}
  .reqr-bar i{display:block;height:100%;background:#2E86E8;border-radius:5px}
  .reqr-pct{font-size:12px;font-weight:800;color:#4b4668}
  .reqr-miss{font-size:12px;color:#8a2d33;max-width:280px}
  /* v119: 자료실 실파일 */
  .bd-filepick{display:flex;align-items:center;gap:10px;margin-top:8px;cursor:pointer}
  .bd-filebtn{border:1.5px dashed #cfcbdd;background:#f8f7fc;color:#4b4668;font-weight:700;font-size:13.5px;border-radius:9px;padding:8px 14px;flex:none}
  .bd-filepick:hover .bd-filebtn{border-color:var(--navy);color:var(--navy)}
  .bd-filename{font-size:12px;color:#8b85a0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .bd-filelink{color:var(--navy);font-weight:700;text-decoration:none}
  .bd-filelink:hover{text-decoration:underline}
  .bd-dl{text-decoration:none;font-size:14px;margin-left:2px}
  .bd-fsize{font-size:11px;color:var(--ink-faint,#67737F);margin-left:6px}
  .bd-textonly{font-size:10px;font-weight:700;color:#8b85a0;background:#f1f0f6;border-radius:6px;padding:2px 7px;margin-left:6px;vertical-align:1px}
  /* v120: 문서 버전관리 */
  .ver-badge{font-size:10px;font-weight:800;color:#5a4fb0;background:#eeecf8;border-radius:6px;padding:2px 7px;margin-left:6px;vertical-align:1px}
  .ver-hist{border:1px solid #e2e0ee;background:#f8f7fc;color:#6E6B85;font-weight:700;font-size:11px;border-radius:7px;padding:2px 9px;cursor:pointer;font-family:inherit;margin-left:6px}
  .ver-hist:hover{border-color:#5a4fb0;color:#5a4fb0}
  .ver-new{border:1px dashed #cfcbdd;background:#fff;color:#4b4668;font-weight:700;font-size:11px;border-radius:7px;padding:2px 9px;cursor:pointer;font-family:inherit;margin-left:6px}
  .ver-new:hover{border-color:var(--navy);color:var(--navy)}
  .ver-hrow td{background:#f8f7fc;padding:10px 14px}
  .ver-hl{font-size:11px;font-weight:800;color:#8b85a0;margin-bottom:7px}
  .ver-hi{display:flex;align-items:center;gap:12px;padding:5px 2px;font-size:13.5px;border-bottom:1px dashed #ecebf3}
  .ver-hi:last-child{border-bottom:none}
  .ver-vn{font-size:10.5px;font-weight:800;color:#8b85a0;background:#f1f0f6;border-radius:6px;padding:2px 8px;flex:none}
  .ver-hname{font-weight:700;color:#4b4668}
  .ver-hat{color:var(--ink-faint,#67737F);font-size:11.5px}
  /* v120: 온보딩 투어 */
  #tourOv{position:fixed;inset:0;z-index:9500}
  .tour-spot{position:fixed;border-radius:12px;box-shadow:0 0 0 9999px rgba(15,22,36,.62),0 0 0 3px rgba(255,255,255,.85);transition:all .28s ease;pointer-events:none}
  .tour-tip{position:fixed;width:310px;background:#fff;border-radius:14px;padding:16px 18px;box-shadow:0 18px 50px rgba(0,0,0,.35);transition:left .28s ease, top .28s ease}
  .tt-t{font-size:15px;font-weight:800;color:#241f33}
  .tt-b{font-size:13.5px;line-height:1.65;color:#4b4668;margin-top:6px}
  .tt-b b{color:var(--navy)}
  .tt-f{display:flex;align-items:center;gap:8px;margin-top:13px}
  .tt-dots{display:flex;gap:4px;margin-right:auto}
  .tt-dots i{width:6px;height:6px;border-radius:50%;background:#e2e0ee;transition:all .2s}
  .tt-dots i.on{background:var(--navy);width:14px;border-radius:4px}
  .tt-skip{border:none;background:none;color:var(--ink-faint,#67737F);font-size:12px;font-weight:700;cursor:pointer;font-family:inherit}
  .tt-skip:hover{color:#6E6B85}
  .tt-prev{border:1px solid #e2e0ee;background:#fff;color:#4b4668;font-size:12px;font-weight:700;border-radius:8px;padding:6px 12px;cursor:pointer;font-family:inherit}
  .tt-next{border:none;background:var(--navy);color:#fff;font-size:12px;font-weight:800;border-radius:8px;padding:6px 14px;cursor:pointer;font-family:inherit}
  .tt-next:hover{filter:brightness(1.15)}
  /* v120: 포털 사용 분석 — 감사로그와 동일한 pc-tbl 테이블 스타일 */
  .usg-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 30px;margin-top:14px;align-items:start}
  .usg-bar{width:100%}
  .usg-empty{font-size:13.5px;color:var(--ink-faint);padding:10px 4px;text-align:center}
  @media(max-width:860px){ .usg-grid{grid-template-columns:1fr} }
  /* v121(UI②): 빈 상태 CTA */
  .empty-state .es-cta{margin-top:16px}
  /* v121(UI③): 화면 밀도 전환 — body[data-density] 오버라이드 (compact=정보량+30% / relaxed=터치 타깃 확대) */
  body[data-density="compact"] .pc-tbl th{padding:5px 8px;font-size:10.5px}
  body[data-density="compact"] .pc-tbl td{padding:4px 8px;font-size:11.5px}
  body[data-density="compact"] table.dl th{padding:8px 12px;font-size:11px}
  body[data-density="compact"] table.dl td{padding:8px 12px;font-size:12px}
  body[data-density="compact"] .ntc{padding:11px 15px}
  body[data-density="relaxed"] .pc-tbl th{padding:12px 12px;font-size:12px}
  body[data-density="relaxed"] .pc-tbl td{padding:13px 12px;font-size:14px}
  body[data-density="relaxed"] table.dl th{padding:16px 18px;font-size:14px}
  body[data-density="relaxed"] table.dl td{padding:18px;font-size:14.5px}
  body[data-density="relaxed"] .btn{padding:12px 20px;font-size:14px}
  body[data-density="relaxed"] .ntc{padding:20px 24px}
  /* v121: 예약 상신 (FN①) */
  .w-sched{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;color:#6E6B85;margin-right:10px}
  .w-sched input{border:1px solid #e0dcec;border-radius:8px;padding:6px 8px;font-size:12px;font-family:inherit;color:#241f33}
  /* v121: 결재함 일괄승인 바 (UX②) */
  #bulkBar{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:240;display:flex;align-items:center;gap:12px;background:var(--navy-deep);color:#fff;border-radius:13px;padding:12px 18px;font-size:14px;box-shadow:0 14px 40px rgba(0,0,0,.35);animation:bulkUp .25s ease}
  @keyframes bulkUp{from{transform:translateX(-50%) translateY(40px);opacity:0}to{transform:translateX(-50%) translateY(0);opacity:1}}
  #bulkBar b{font-size:14px}
  #bulkBar .bb-approve{border:none;background:var(--navy);color:#fff;font-weight:800;font-size:13.5px;border-radius:9px;padding:8px 16px;cursor:pointer;font-family:inherit}
  #bulkBar .bb-approve:hover{filter:brightness(1.12)}
  #bulkBar .bb-clear{border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;font-weight:700;font-size:12px;border-radius:9px;padding:8px 13px;cursor:pointer;font-family:inherit}
  #bulkBar .bb-hint{font-size:11px;color:rgba(255,255,255,.55)}
  .dl .bulkCk,#bulkAll{width:16px;height:16px;accent-color:var(--navy);cursor:pointer}
  /* v121: 실행취소 토스트 (UX①) */
  #toastUndo{border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.12);color:#fff;font-weight:800;font-size:12px;border-radius:8px;padding:5px 12px;cursor:pointer;font-family:inherit;flex:none}
  #toastUndo:hover{background:rgba(255,255,255,.25)}
  /* v121: 기안 자동저장 (UX③) */
  .wauto-ind{margin-right:auto;font-size:11.5px;color:var(--ink-faint,#67737F);font-weight:600;align-self:center}
  .wauto-banner{display:flex;align-items:center;gap:10px;background:#fdf6e5;border:1px solid #f0dfae;border-radius:11px;padding:10px 14px;margin-bottom:14px;font-size:13.5px;color:#7a6320}
  .wauto-banner svg{width:16px;height:16px;stroke:#b58a1f;fill:none;stroke-width:2;flex:none}
  .wauto-banner span{min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .wauto-banner b{color:#5c4a12}
  .wauto-banner em{font-style:normal;color:#b09a55;font-size:11px;margin-left:4px}
  .wauto-banner button{flex:none;border-radius:8px;font-size:11.5px;font-weight:800;padding:5px 11px;cursor:pointer;font-family:inherit}
  .wauto-banner .wa-resume{border:none;background:#b58a1f;color:#fff}
  .wauto-banner .wa-drop{border:1px solid #e5d8ab;background:#fff;color:#8a7433}
  /* [v272] 이어서 작성 / 새로 작성 선택창 · 도크 「새로」 — 전부 토큰이라 다크에서도 그대로 */
  .wchoice{display:flex;flex-direction:column;gap:10px}
  .wchoice .wc-doc{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:10px;background:var(--bg);border:1px solid var(--line-soft);font-size:12.5px;color:var(--ink-soft)}
  .wchoice .wc-doc b{color:var(--ink);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .wchoice .wc-opt{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;width:100%;border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:12px 14px;cursor:pointer;font-family:inherit;color:var(--ink);transition:border-color .15s,background .15s}
  .wchoice .wc-opt:hover,.wchoice .wc-opt:focus-visible{border-color:var(--navy);background:var(--bg);outline:none}
  .wchoice .wc-opt b{font-size:14.5px;font-weight:800}
  .wchoice .wc-opt span{font-size:12.5px;color:var(--ink-soft)}
  #wdockBar .wd-n{flex:none;border:1px solid var(--line);background:var(--panel);height:24px;border-radius:7px;cursor:pointer;color:var(--ink-soft);font-size:11.5px;font-weight:800;padding:0 8px;font-family:inherit;line-height:1}
  #wdockBar .wd-n:hover{border-color:var(--navy);color:var(--navy)}
  /* v112: 직원 상세명단 (직급 아이콘 카드) */
  .rank-av{display:inline-grid;place-items:center;border-radius:50%;flex:none;vertical-align:middle}
  .emp-summary{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin:18px 4px 4px;font-size:14px;color:var(--ink-soft)}
  .emp-summary>b{color:var(--ink)}
  .emp-dist{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ink-soft)}
  .emp-dist b{color:var(--ink);font-weight:600}
  .emp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:12px;margin-top:14px}
  .emp-card{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--panel)}
  .emp-card-top{display:flex;align-items:center;gap:11px}
  .emp-idw{display:flex;flex-direction:column;min-width:0;flex:1}
  .emp-idw>b{font-size:15px;font-weight:700;color:var(--ink)}
  .emp-rank{font-size:11.5px;color:var(--ink-soft);margin-top:2px}
  .emp-grade{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;border:1px solid;white-space:nowrap;flex:none}
  .emp-org{font-size:13.5px;color:var(--ink-soft);margin-top:11px}
  .menu-perms{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
  .mperm{font-size:10.5px;font-weight:600;padding:3px 8px;border-radius:6px;white-space:nowrap;border:1px solid var(--line)}
  .mperm.on{color:#0f9c6c;border-color:#3AAFA055;background:#3AAFA014}
  .mperm.off{color:var(--ink-soft);background:transparent}
  .emp-line{display:flex;gap:8px;margin-top:8px;font-size:11.5px;align-items:baseline}
  .emp-line .k{color:var(--ink-soft);flex:none;width:58px}
  .emp-line .v{color:var(--ink);font-weight:500}
  .emp-acct{display:flex;align-items:center;gap:8px;margin-top:11px;padding-top:10px;border-top:1px solid var(--line);font-size:11.5px;color:var(--ink-soft)}
  .emp-acct>span:first-child{font-family:ui-monospace,Menlo,monospace;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .emp-state{flex:none;padding:1px 7px;border-radius:20px;background:var(--line);color:var(--ink-soft);font-weight:600}
  .emp-state.on{background:#3AAFA018;color:#0f9c6c}
  .emp-sabun{margin-left:auto;opacity:.7;flex:none}
  .gdot{width:9px;height:9px;border-radius:50%;display:inline-block}
  /* v112: 인사관리 모듈 (제안용 프로토타입) */
  .hrm-note{background:#f4f1fb;border:1px solid #e0d8f5;border-radius:10px;padding:11px 14px;font-size:13.5px;color:var(--ink-soft);line-height:1.7;margin-bottom:16px}
  .hrm-note b{color:var(--ink)}
  .hrm-note .dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin:0 4px 0 10px;vertical-align:middle}
  .hrm-note .dot.self{background:#185fa5}   /* [2026-10-21 사용자 「파랑이라는데 빨강」] --navy 는 계절색으로 바뀐다 → 이름표(.hrm-own.self)와 같은 고정 파랑 */
  .hrm-note .dot.corp{background:#b9740a} .hrm-note .dot.proof{background:#6b3fa0}   /* 이름표 글자색과 같게 */
  .hrm-tabs{display:flex;gap:4px;margin-bottom:16px;border-bottom:1px solid var(--line)}
  .hrm-tab{position:relative;background:none;border:none;padding:10px 16px;font-size:14px;font-weight:600;color:var(--ink-soft);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
  .hrm-tab.on{color:var(--ink);border-bottom-color:#8a6fd4}
  .hrm-auth{font-size:9.5px;font-weight:800;letter-spacing:.04em;background:var(--navy);color:#fff;padding:2px 7px;border-radius:20px;margin-left:6px;vertical-align:middle}
  .hrm-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:stretch}   /* [2026-10-03] 나란한 두 카드 = 같은 높이(종전 start — 내 정보 카드가 820/632px 로 들쭉날쭉) */
  @media(max-width:860px){.hrm-grid2{grid-template-columns:1fr}}
  .hrm-card{border:1px solid var(--line);border-radius:12px;padding:16px 18px;background:var(--panel)}
  .hrm-card.self{border-top:3px solid #185fa5}
  .hrm-card.corp{border-top:3px solid #E6AE60}
  .hrm-card-h{display:flex;align-items:center;gap:8px;margin-bottom:14px}
  .hrm-card-h b{font-size:14px;color:var(--ink)}
  .hrm-own{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;background:var(--line);color:var(--ink-soft)}
  .hrm-own.self{background:#e6f1fb;color:#185fa5}
  .hrm-own.corp{background:#fdf2e0;color:#b9740a}
  .hrm-own.proof{background:#f4ecfb;color:#6b3fa0}
  .hrm-own.self::before,.hrm-own.corp::before,.hrm-own.proof::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:1px;background:currentColor}   /* [2026-10-21 사용자] 위 안내의 신호등 점을 이름표 앞에도 — 같은 색 */
  .hrm-f{margin-bottom:12px}
  .hrm-f>label{display:block;font-size:12px;color:var(--ink-soft);margin-bottom:5px}
  .hrm-f input,.hrm-f select{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:14px;font-weight:500;background:var(--panel);color:var(--ink);box-sizing:border-box}   /* [2026-10-21 사용자 「대리 결재자 글꼴이 이상」] 선택·날짜 칸도 본문 글꼴 */
  .hrm-chks{display:flex;gap:16px}
  .hrm-chk{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--ink);white-space:nowrap}
  .hrm-f .hrm-chk input{width:auto;flex:none;padding:0;margin:0}   /* [2026-10-21 사용자 「결/재 세로로」] 위 입력칸 규칙(width 100%)이 체크박스를 늘려 글자가 한 자씩 내려갔다 */
  .hrm-r{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
  .hrm-r:last-child{border-bottom:none}
  .hrm-r .k{display:flex;align-items:center;gap:6px;color:var(--ink-soft);width:82px;flex:none}
  .hrm-r .k .lk{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;opacity:.65}
  .hrm-r .v{color:var(--ink);font-weight:500;display:flex;align-items:center;gap:6px;flex:1}
  .hrm-subh{margin:14px 0 8px;padding-top:12px;border-top:1px solid var(--line)}
  .hrm-state{padding:2px 9px;border-radius:20px;background:#e2f6f3;color:#0f9c6c;font-size:12px;font-weight:600}
  .hrm-tip{margin-top:12px;font-size:11.5px;color:var(--ink-soft);line-height:1.65;background:#f7f8fa;padding:8px 11px;border-radius:8px}
  .hrm-tip b{color:var(--ink)}
  .hs-card{margin-top:14px}   /* [2026-10-21 사용자 2-①] 내 정보 · 본인 입력 인사 정보(두 카드 아래 한 줄 전체) */
  .hs-at{margin-left:auto;font-size:12px;color:var(--ink-soft)}
  .hs-grps{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1.6fr);gap:0 20px}
  @media(max-width:1100px){.hs-grps{grid-template-columns:minmax(0,1fr)}}
  .hs-gt{font-size:13px;font-weight:600;color:var(--ink);margin:2px 0 8px}
  .hs-row{display:flex;gap:8px}
  .hs-row>.hrm-f{flex:1;min-width:0}
  .hs-cert{display:flex;gap:8px;align-items:center;margin-bottom:8px;max-width:640px}
  .hs-cert input{flex:1;min-width:0;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:14px;font-weight:500;background:var(--panel);color:var(--ink);box-sizing:border-box}
  .hs-cert input[data-hsc="date"]{flex:0 0 170px}
  .hs-x{flex:none;padding:6px 10px}
  .hs-add{margin:0 0 14px}
  .hs-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--line)}
  .hs-foot .hrm-tip{margin-top:0;flex:1;min-width:240px}
  .hrm-al{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
  .hrm-al:last-child{border-bottom:none}
  .al-t{font-size:11px;color:var(--ink-soft);width:98px;flex:none;font-family:ui-monospace,monospace}
  .al-b{font-size:13.5px;color:var(--ink);line-height:1.7}
  .al-f{color:#b9740a;font-weight:600}
  .al-v{display:inline-block;font-size:10.5px;color:var(--ink-soft);background:var(--line);padding:1px 7px;border-radius:20px;margin-left:2px}
  /* v113: 인사기록부 카드 */
  .rec-card{margin-top:14px}
  .rec-head{display:flex;align-items:center;gap:8px;margin-bottom:14px}
  .rec-head b{display:flex;align-items:center;gap:7px;font-size:15px;color:var(--ink)}
  .rec-ic{width:17px;height:17px;fill:none;stroke:#b9740a;stroke-width:1.8}
  .rec-prof{display:flex;align-items:center;gap:13px;padding-bottom:14px;border-bottom:1px solid var(--line)}
  .rec-id{flex:1;min-width:0}
  .rec-id b{font-size:16px;color:var(--ink)}
  .rec-pos{font-size:13.5px;color:var(--ink-soft);font-weight:500;margin-left:4px}
  .rec-sub{display:block;font-size:12px;color:var(--ink-soft);margin-top:3px}
  .rec-state{flex:none}
  .rec-basic{display:flex;flex-wrap:wrap;gap:8px 28px;padding:14px 0;border-bottom:1px solid var(--line)}
  .rec-b{display:flex;gap:10px;font-size:14px;min-width:210px}
  .rec-b .k{color:var(--ink-soft);width:52px;flex:none}
  .rec-b .v{color:var(--ink);font-weight:500}
  .rec-yr{color:var(--ink-soft);font-weight:400;font-size:12px}
  .rec-mail{color:var(--navy,#185fa5)}
  .rec-sec{font-size:11.5px;font-weight:700;color:var(--ink-soft);margin:14px 0 8px;letter-spacing:.02em}
  .rec-tl{display:flex;gap:14px;padding:7px 0 7px 14px;border-left:2px solid var(--line);margin-left:4px;position:relative;font-size:14px}
  .rec-tl::before{content:'';position:absolute;left:-5px;top:12px;width:8px;height:8px;border-radius:50%;background:#b79ee8}
  .rec-d{color:var(--ink-soft);width:64px;flex:none;font-variant-numeric:tabular-nums}
  .rec-t{color:var(--ink);font-weight:500}
  .rec-empty{font-size:12px;color:var(--ink-soft);padding:6px 0 6px 18px}
  .rec-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
  .rec-stat{background:#f7f8fa;border-radius:10px;padding:12px 14px}
  .rec-stat .k{display:block;font-size:12px;color:var(--ink-soft);margin-bottom:5px}
  .rec-stat .v{font-size:15px;color:var(--ink)}
  .rec-stat .v b{font-size:22px;font-weight:800}
  .rec-stat .v small{color:var(--ink-soft);font-size:12px;font-weight:400}
  /* === 자재구입 스마트 재고 신청 === */
  .mat-tbl-wrap{overflow-x:auto}
  .mat-hint{font-size:11px;color:var(--ink-soft);background:#f7f9fc;border:1px solid var(--line);border-radius:8px;padding:7px 10px;margin:8px 0 12px}
  .mat-tbl{width:100%;border-collapse:collapse;font-size:12px;table-layout:fixed;min-width:560px}
  .mat-tbl th{font-size:11px;font-weight:700;color:var(--ink-soft);text-align:left;padding:6px 6px;border-bottom:1px solid var(--line)}
  .mat-tbl td{padding:5px 6px;border-bottom:1px solid var(--line);vertical-align:top}
  .mat-tbl .mt-name{width:20%}.mat-tbl .mt-spec{width:11%}.mat-tbl .mt-unit{width:7%}.mat-tbl .mt-num{width:10%;text-align:right}.mat-tbl .mt-judge{width:24%}.mat-tbl .mt-note{width:24%}.mat-tbl .mt-del{width:4%}
  .mat-tbl input.mc{width:100%;border:1.5px solid var(--line);border-radius:7px;padding:6px 8px;font-size:12px;font-family:inherit;color:var(--ink);outline:none}
  .mat-tbl input.mc:focus{border-color:var(--navy-2)}
  .mat-tbl input.num{text-align:right}
  .mat-tbl .mat-amt{text-align:right;font-weight:700;color:var(--ink);padding-top:11px}
  .mat-tbl .mat-stk{display:block;font-size:11px;color:var(--ink-soft);margin-bottom:3px}
  .mat-tbl .mat-stk b{color:var(--accent-ink)}
  .mat-tbl .del{border:none;background:none;color:var(--ink-faint);font-size:17px;cursor:pointer;line-height:1}
  .mat-pill{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px}
  .mat-pill.mj-ok{background:var(--ok-soft);color:#0f8a72}
  .mat-pill.mj-warn{background:var(--warn-soft);color:#b9770a}
  .mat-pill.mj-bad{background:var(--accent-soft);color:var(--accent-ink)}
  .mat-pill.mj-info{background:var(--sea-tint,#eaf1fb);color:var(--navy-deep)}
  .mat-pill.mj-muted{background:#eef0f4;color:var(--ink-faint)}
  .mat-sum{margin-top:10px;font-size:12px;color:var(--ink-soft);text-align:right}
  .mat-sum b{color:var(--ink)} 
  .mat-ac{position:absolute;z-index:99999;display:none;max-height:300px;overflow:auto;background:#fff;border:1px solid var(--navy-2);border-radius:10px;box-shadow:0 10px 30px rgba(20,40,80,.16)}
  .mat-ac .mac-item{padding:8px 11px;border-bottom:1px solid var(--line);cursor:pointer}
  .mat-ac .mac-item:last-child{border-bottom:none}
  .mat-ac .mac-item.hl,.mat-ac .mac-item:hover{background:var(--sea-tint,#eaf1fb)}
  .mac-ttl{font-size:13.5px;font-weight:700;color:var(--ink)}
  .mac-code{font-size:10.5px;font-weight:600;color:var(--ink-faint);margin-left:5px}
  .mac-meta{display:flex;gap:11px;flex-wrap:wrap;font-size:11px;color:var(--ink-soft);margin-top:2px}
  .mac-meta .mac-stk{color:var(--navy);font-weight:700}
  .mat-ac .mac-empty{padding:10px 12px;font-size:12px;color:var(--ink-faint)}
  /* === 자재발주서 === */
  .balju-panel{border:1px solid var(--line);border-radius:12px;background:var(--line-soft);padding:12px 14px}
  .balju-note{font-size:11px;color:var(--ink-faint);margin-top:10px;display:flex;align-items:flex-start;gap:5px;line-height:1.5}
  .balju-list{display:flex;flex-direction:column;gap:3px;margin-bottom:4px}
  .balju-foot{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:11px}
  .balju-vendor{flex:1;min-width:160px;height:34px;border:1.5px solid var(--line);border-radius:9px;padding:0 11px;font-size:14px;font-family:inherit;outline:none}
  .balju-vendor:focus{border-color:var(--navy-2)}
  .balju-ac{position:absolute;z-index:99999;display:none;background:#fff;border:1px solid var(--navy-2);border-radius:10px;max-height:240px;overflow:auto;box-shadow:0 12px 30px rgba(20,40,80,.18)}
  .balju-ac .bac-it{padding:8px 12px;border-bottom:1px solid var(--line);cursor:pointer}
  .balju-ac .bac-it:last-child{border-bottom:none}
  .balju-ac .bac-it:hover{background:var(--sea-tint,#eaf1fb)}
  .balju-ac .bac-it b{display:block;font-size:14px;color:var(--ink);font-weight:700}
  .balju-ac .bac-it span{display:block;font-size:11px;color:var(--ink-soft);margin-top:2px}
  .balju-ac .bac-empty{padding:11px 13px;font-size:12px;color:var(--ink-faint)}
  /* === v109 거래처별 분할 발주 === */
  .balju-foot .btn{display:inline-flex;align-items:center;gap:6px}
  .balju-foot .btn svg{width:15px;height:15px;flex:none;stroke:currentColor;fill:none;stroke-width:2}
  .bj-list-h{font-size:11.5px;font-weight:800;color:var(--ink-soft);margin:2px 0 7px;display:flex;gap:7px;align-items:center}
  .bj-list-h span{font-weight:600;color:var(--ink-faint);font-size:10.5px}
  .bj-row{display:flex;align-items:center;gap:10px;padding:7px 9px;border-radius:8px;background:#f7f9fc;margin-bottom:3px;flex-wrap:wrap}
  .bj-ck{display:flex;align-items:center;cursor:pointer}
  .bj-ck input{width:15px;height:15px;cursor:pointer}
  .bj-info{flex:1;min-width:170px;font-size:13.5px;color:var(--ink)}
  .bj-info span{color:var(--ink-soft)}
  .bj-price{display:flex;align-items:center;gap:7px}
  .bj-pi{width:92px;height:30px;border:1.5px solid var(--line);border-radius:8px;padding:0 9px;font-size:13.5px;font-family:inherit;text-align:right;outline:none;color:var(--ink)}
  .bj-pi:focus{border-color:var(--navy-2)}
  .bj-amt{font-size:12px;font-weight:700;color:var(--ink);min-width:76px;text-align:right}
  .bj-hist{font-size:11px;color:var(--ink-soft);min-width:168px}
  .bj-past{display:inline-flex;flex-direction:column;line-height:1.4}
  .bj-past.none{color:var(--ink-faint)}
  .bj-past i{font-style:normal;color:var(--ink-faint);font-size:10px}
  .bj-up{color:var(--accent-ink)} .bj-down{color:#0f8a72} .bj-same{color:var(--ink-soft)}
  .bj-done-po{border:1px solid var(--line);border-radius:9px;background:#fff;padding:9px 11px;margin-bottom:6px;opacity:.9}
  .bj-done-h{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink);flex-wrap:wrap}
  .bj-done-items{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
  .bj-done-it{font-size:11px;color:var(--ink-faint);background:#f1f3f8;border-radius:6px;padding:3px 8px;text-decoration:line-through}
  /* === 게시판(사내공지/자료실) === */
  .bd-wrap{display:flex;flex-direction:column;gap:14px}
  .bd-actbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .bd-perm{font-size:11.5px;color:var(--ink-soft);background:#f5f7fb;border:1px solid var(--line);border-radius:8px;padding:6px 11px}
  .bd-perm.ok{color:#0f8a72;background:var(--ok-soft);border-color:#bfe9e0}
  .bd-form{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px}
  .bd-form2{display:grid;grid-template-columns:2fr 1fr;gap:10px}
  @media(max-width:640px){.bd-form2{grid-template-columns:1fr}}
  .bd-inp{height:34px;border:1.5px solid var(--line);border-radius:8px;padding:0 11px;font-size:14px;font-family:inherit;outline:none;color:var(--ink)}
  .bd-inp:focus,.bd-ta:focus{border-color:var(--navy-2)}
  .bd-ta{min-height:90px;border:1.5px solid var(--line);border-radius:8px;padding:9px 11px;font-size:14px;font-family:inherit;outline:none;resize:vertical;color:var(--ink)}
  .bd-chk{font-size:13.5px;color:var(--ink);display:flex;align-items:center;gap:7px}
  .bd-formact{display:flex;justify-content:flex-end;gap:8px}
  .bd-note{font-size:11px;color:var(--ink-faint)}
  .bd-empty{padding:26px;text-align:center;color:var(--ink-faint);font-size:14px}
  .ntc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 15px}
  .ntc.pin{border-color:#f0d9ad;background:#fffdf6}
  .ntc.unread{border-left:4px solid var(--navy);cursor:pointer}
  .ntc.unread:hover{background:#f7faff}
  .ntc-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--navy);margin-right:7px;vertical-align:middle}
  .ntc-unread-tag{color:var(--navy);font-weight:800}
  .ntc-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
  .ntc-t{font-size:14px;font-weight:700;color:var(--ink);line-height:1.45}
  .ntc-pin{font-size:10px;font-weight:800;background:var(--warn-soft);color:#b9770a;padding:1px 8px;border-radius:20px;margin-right:8px;vertical-align:middle}
  .ntc-del{border:none;background:none;color:var(--ink-faint);font-size:14px;cursor:pointer;flex:none}
  .ntc-m{font-size:11.5px;color:var(--ink-soft);margin-top:5px}
  .ntc-b{font-size:14px;color:var(--ink-soft);line-height:1.7;margin-top:9px;white-space:pre-wrap}
  .vault-tabs{display:flex;gap:7px;flex-wrap:wrap}
  .vault-tab{border:1.5px solid var(--line);background:#fff;border-radius:9px;padding:7px 12px;font-size:13.5px;font-weight:700;color:var(--ink-soft);cursor:pointer}
  .vault-tab:hover{border-color:var(--navy-2)}
  .vault-tab.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .vault-lock{font-size:10px}
  .vault-deny{display:flex;align-items:center;gap:14px;background:#fff;border:1px dashed var(--line);border-radius:12px;padding:26px}
  .vault-deny .vd-ic{font-size:30px}
  .vault-deny b{font-size:14px;color:var(--ink)} .vault-deny p{font-size:12px;color:var(--ink-soft);margin:6px 0 0;line-height:1.6}
  .pc-tbl-del{border:none;background:none;color:var(--ink-faint);font-size:14px;cursor:pointer}
  /* === 포털 대시보드 === */
  /* === 구매 메뉴 공통/뷰 === */
  .nav .nav-sub.gumae-sub{overflow:hidden}
  .pc-page{display:flex;flex-direction:column;gap:16px}
  .pc-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  @media(max-width:900px){.pc-grid{grid-template-columns:1fr}}
  .pc-box{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
  .pc-head{background:var(--sea-tint,#eef3fb);color:var(--navy-deep,#1f3a66);font-size:14px;font-weight:700;padding:10px 14px;border-bottom:1px solid var(--line)}
  .pc-body{padding:14px}
  .pc-desc{font-size:12px;color:var(--ink-soft);margin-bottom:12px}
  .pc-fld{margin-bottom:10px}
  .pc-fld>label{display:block;font-size:11px;font-weight:600;color:var(--ink-soft);margin-bottom:4px}
  .pc-fld input,.pc-fld select{width:100%;height:33px;font-size:13.5px;border:1.5px solid var(--line);border-radius:8px;padding:0 9px;font-family:inherit;background:#fff;color:var(--ink);outline:none}
  .pc-fld input:focus,.pc-fld select:focus{border-color:var(--navy-2)}
  .pc-fld input.autofill{background:var(--sea-tint,#eaf1fb);border-color:rgba(var(--sea-rgb,27,111,245),.35)}
  .pc-row2{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .pc-row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px}
  .pc-suffix{position:relative}
  .pc-suffix .u{position:absolute;right:10px;top:27px;font-size:10.5px;color:var(--ink-faint);pointer-events:none}
  .pc-grp{margin:14px 0 7px;font-size:12px;font-weight:700;color:var(--navy)}
  .pc-search{position:relative;margin-bottom:10px}
  .mat-results{position:absolute;left:0;right:0;top:60px;z-index:50;background:#fff;border:1px solid var(--navy-2);border-radius:10px;max-height:240px;overflow:auto;display:none;box-shadow:0 10px 26px rgba(20,40,80,.14)}
  .mat-results.show{display:block}
  .mat-results .mr{padding:8px 11px;border-bottom:1px solid var(--line);cursor:pointer}
  .mat-results .mr:last-child{border-bottom:none}
  .mat-results .mr:hover{background:var(--sea-tint,#eaf1fb)}
  .mat-results .mr .t{font-size:13.5px;font-weight:700;color:var(--ink)}
  .mat-results .mr .m{font-size:11px;color:var(--ink-soft);margin-top:2px}
  .pc-tabs{display:flex;gap:7px;margin:4px 0 10px}
  .pc-tabs label{flex:1;text-align:center;font-size:11.5px;font-weight:600;padding:7px;border-radius:8px;border:1.5px solid var(--line);color:var(--ink-soft);cursor:pointer}
  .pc-tabs label.on{background:var(--navy);color:#fff;border-color:var(--navy)}
  .pc-tabs label input{display:none}
  .pc-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
  .pc-step{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;margin-bottom:8px;background:#f5f7fb}
  .pc-step .sl{font-size:11.5px;color:var(--ink-soft)} .pc-step .sl b{display:block;color:var(--ink);font-size:13.5px;margin-top:1px}
  .pc-step .sv{font-size:14px;font-weight:700;color:var(--ink);text-align:right;white-space:nowrap}
  .pc-step .sv.need{color:var(--accent-ink)}
  .pc-chain{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:8px 0}
  .pc-chain div{background:#f5f7fb;border-radius:9px;padding:9px;text-align:center}
  .pc-chain .k{font-size:10.5px;color:var(--ink-soft)} .pc-chain .v{font-size:14px;font-weight:700;margin-top:3px;color:var(--ink)}
  .pc-base{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-radius:10px;background:var(--sea-tint,#eef3fb);border:1px solid rgba(var(--sea-rgb,27,111,245),.28);margin-top:6px}
  .pc-base .sl{font-size:12px;color:var(--navy-deep,#1f3a66)} .pc-base .sl b{display:block;font-size:13.5px;color:var(--navy-deep,#1f3a66);margin-top:1px}
  .pc-base .sv{font-size:19px;font-weight:800;color:var(--navy-deep,#1f3a66);white-space:nowrap}
  .pc-sens{margin-top:10px;font-size:11.5px;color:var(--ink-soft);background:#f5f7fb;padding:9px 12px;border-radius:9px;line-height:1.6}
  .pc-sens b{color:var(--ink)}
  .st-badge{display:inline-block;font-size:10px;font-weight:700;padding:1px 8px;border-radius:20px;margin-left:6px;vertical-align:middle}
  .st-badge.ok{background:var(--ok-soft);color:#0f8a72}
  .st-badge.warn{background:var(--warn-soft);color:#b9770a}
  .st-badge.bad{background:var(--accent-soft);color:var(--accent-ink)}
  .st-badge.info{background:var(--sea-tint,#eaf1fb);color:var(--navy-deep)}
  .src-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  @media(max-width:760px){.src-list{grid-template-columns:1fr}}
  .src{border:1px solid var(--line);border-radius:10px;padding:11px 13px}
  .src a{font-size:13.5px;font-weight:700;color:var(--navy);text-decoration:none;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .src .tag{font-size:10px;font-weight:700;background:var(--sea-tint,#eef3fb);color:var(--navy-deep,#1f3a66);padding:1px 8px;border-radius:20px}
  .src p{font-size:11px;color:var(--ink-soft);margin:5px 0 0;line-height:1.5}
  .pc-tbl{width:100%;border-collapse:collapse;font-size:12px}
  .pc-tbl th{background:#f5f7fb;border-bottom:1.5px solid var(--line);text-align:left;font-weight:700;color:var(--ink-soft);padding:8px 10px;font-size:11px}
  /* v121(UI①): 테이블 표준화 — 스크롤 컨테이너 + 스티키 헤더 (긴 목록에서 헤더 유지) */
  .tbl-scroll{overflow:auto;max-height:calc(100vh - 265px)}
  .tbl-scroll .pc-tbl thead th{position:sticky;top:0;z-index:3;box-shadow:0 1.5px 0 var(--line)}
  .pc-tbl td{border-bottom:1px solid var(--line);padding:8px 10px;color:var(--ink)}
  .pc-tbl td.num,.pc-tbl th.num{text-align:right}
  .pc-tbl .del-row{border:none;background:none;color:var(--ink-faint);cursor:pointer;font-size:14px}
  .pc-empty{padding:24px;text-align:center;color:var(--ink-faint);font-size:13.5px}
  .iv-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;padding:11px 13px;margin-bottom:14px;background:#f7f9fc}
  .iv-bar .iv-ic{width:30px;height:30px;border-radius:8px;background:var(--sea-tint,#eaf1fb);color:var(--navy);display:flex;align-items:center;justify-content:center;flex:none}
  .iv-bar .iv-ic svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
  .iv-bar select{height:33px;font-size:13.5px;padding:0 9px;border:1.5px solid var(--line);border-radius:8px;font-family:inherit}
  .iv-bar .iv-st{font-size:11.5px;color:var(--ink-soft);margin-left:auto}
  .iv-note{font-size:11.5px;color:var(--ink-soft);margin-top:12px;background:#f5f7fb;border-radius:9px;padding:9px 12px}

  /* ═══════════ [v151 화이트셸] 사이드바·탑바 화이트+그린 (윤비서 3칸 목업 표준) — 기존 규칙은 수정하지 않고 후순위 캐스케이드로 오버라이드 ═══════════ */
  :root{
    --sb-bg:#FFFFFF; --sb-line:#E3EAE5; --sb-ink:#303D35; --sb-ink-strong:#131B16; --sb-grp:#6A7972;   /* [v151 선명화2] */
    --sb-hover:#F0F6F1; --sb-on-bg:#E6F6EC; --sb-on-ink:var(--navy-deep); --sb-ic:#7B8A81; --sb-ic-on:var(--navy-deep);   /* [v248 대비] --sb-grp 를 #71807A → #6A7972 로 (흰 배경 4.14:1 → 4.57:1, AA 미달이었다. v248 계절색과 무관한 기존 값 수리) */
    --tb-bg:#FFFFFF; --tb-line:#E3EAE5; --tb-field:#F7FAF8;
  }
  .side{background:var(--sb-bg);color:var(--sb-ink);border-right:1px solid var(--sb-line)}
  .brand-cap{color:var(--sb-grp)}
  /* 브랜드: 라이트=텍스트 로고(로그인과 동일 문법) · 다크=기존 CI 이미지(밝은 픽셀 로고라 화이트 배경에선 안 보임) */
  .brand .tx-logo{display:flex;align-items:center;gap:10px}
  #nav a{color:var(--sb-ink)}
  #nav a:hover{background:var(--sb-hover);color:var(--sb-ink-strong)}
  #nav a.on{background:var(--sb-on-bg);color:var(--sb-on-ink)}
  #nav a.on::before{background:var(--navy)}
  #nav .grp{color:var(--sb-grp)}
  /* [v151] 사이드바 아이콘 컬러 팔레트 복원 — 진권 "겹침 제로 + 여유 팔레트" 원칙.
     라이트=딥파스텔(화이트 배경 대비) / 다크=오리지널 파스텔. 신규 모듈=예약 팔레트에서 배정.
     [남은 예약] 마젠타 #cd8ce0 · 레몬 #e8d05c */
  #nav a .ic-g{stroke:var(--sb-ic)}
  #nav a[data-view="dash"] .ic{stroke:#5586C6}       /* 대시보드 · 블루 */
  #nav a[data-view="workspace"] .ic{stroke:#D3745B}  /* My WORK-SPACE · 코랄(예약분) */
  #nav a#mailParent .ic{stroke:#6588C4}              /* 메일 · 스틸블루(예약분) */
  #nav a#revParent .ic{stroke:#419BBD}               /* 매출 · 시안 */
  #nav a#eapprParent .ic{stroke:#BD9335}             /* 전자결재 · 골드 */
  #nav a[data-view="org"] .ic{stroke:#8873C0}        /* 조직도 · 바이올렛 */
  #nav a[data-view="schedule"] .ic{stroke:#4EA26F}   /* 업무 일정 · 그린 */
  #nav a#hrParent .ic{stroke:#CB7A46}                /* 인사평가 · 오렌지 */
  #nav a#gumaeParent .ic{stroke:#C0669C}             /* 구매 · 핑크 */
  #nav a#matParent .ic{stroke:#99A43B}               /* 자재관리 · 라임 */
  #nav a[data-view="notice"] .ic{stroke:#CB5F79}     /* 사내공지 · 로즈 */
  #nav a#vaultParent .ic{stroke:#37A797}             /* 사업부 자료실 · 아쿠아 */
  #nav a[data-view="common"] .ic{stroke:#6F79C2}     /* 공용자료실 · 인디고 */
  #nav a[data-view="admin"] .ic{stroke:#C4525E}      /* 직원 DB · 레드 */
  /* 하위 트리 = 부모색 상속 */
  #nav .rev-sub a .ic-c{stroke:#419BBD}
  #nav .eappr-sub a .ic-c{stroke:#BD9335}
  #nav .hr-sub a .ic-c{stroke:#CB7A46}
  #nav .gumae-sub a .ic-c{stroke:#C0669C}
  #nav .mat-sub a .ic-c{stroke:#99A43B}
  #nav .vault-sub a .ic-c{stroke:#37A797}
  #nav .mail-sub a .ic-c{stroke:#6588C4}
  /* 다크 = 오리지널 파스텔 (v125 원본색) */
  body[data-theme="dark"] #nav a[data-view="dash"] .ic{stroke:#82aee5}
  body[data-theme="dark"] #nav a[data-view="workspace"] .ic{stroke:#f47f63}
  body[data-theme="dark"] #nav a#mailParent .ic{stroke:#6a9fe0}
  body[data-theme="dark"] #nav a#revParent .ic{stroke:#5cc3e8}
  body[data-theme="dark"] #nav a#eapprParent .ic{stroke:#ecc04f}
  body[data-theme="dark"] #nav a[data-view="org"] .ic{stroke:#b79ee8}
  body[data-theme="dark"] #nav a[data-view="schedule"] .ic{stroke:#6bd08a}
  body[data-theme="dark"] #nav a#hrParent .ic{stroke:#f5a06a}
  body[data-theme="dark"] #nav a#gumaeParent .ic{stroke:#ea89c3}
  body[data-theme="dark"] #nav a#matParent .ic{stroke:#c3d05a}
  body[data-theme="dark"] #nav a[data-view="notice"] .ic{stroke:#f484a0}
  body[data-theme="dark"] #nav a#vaultParent .ic{stroke:#4fd6c3}
  body[data-theme="dark"] #nav a[data-view="common"] .ic{stroke:#9aa5f0}
  body[data-theme="dark"] #nav a[data-view="admin"] .ic{stroke:#ee6474}
  body[data-theme="dark"] #nav .rev-sub a .ic-c{stroke:#5cc3e8}
  body[data-theme="dark"] #nav .eappr-sub a .ic-c{stroke:#ecc04f}
  body[data-theme="dark"] #nav .hr-sub a .ic-c{stroke:#f5a06a}
  body[data-theme="dark"] #nav .gumae-sub a .ic-c{stroke:#ea89c3}
  body[data-theme="dark"] #nav .mat-sub a .ic-c{stroke:#c3d05a}
  body[data-theme="dark"] #nav .vault-sub a .ic-c{stroke:#4fd6c3}
  body[data-theme="dark"] #nav .mail-sub a .ic-c{stroke:#6a9fe0}
  #nav a.nav-parent.parent-on{background:var(--sb-on-bg);color:var(--sb-on-ink)}
  #nav a.nav-child .dot{background:#CBD6CE}
  #nav a.nav-child.on .dot{background:var(--navy);box-shadow:0 0 0 3px rgba(var(--sea-rgb,27,111,245),.18)}
  #nav a.hr-grp{color:var(--sb-grp)}
  #nav a.hr-grp:hover{color:var(--sb-ink-strong)}
  #nav a .auth-lock{stroke:#B7861F}
  #nav a#navWrite{color:var(--navy-deep);background:#E6F6EC}
  #nav a#navWrite .ic-c{stroke:var(--navy-deep)}
  #nav a#navWrite:hover{background:#D8F0E1;color:var(--navy-deep)}
  #nav a#navWrite:hover .ic-c{stroke:var(--navy-deep)}
  #nav a#hrParent.parent-on .ic{color:var(--sb-ic-on)}
  #nav{scrollbar-color:rgba(24,36,32,.16) transparent}
  #nav::-webkit-scrollbar-thumb{background:rgba(24,36,32,.14)}
  #nav::-webkit-scrollbar-thumb:hover{background:rgba(24,36,32,.28)}
  /* [v172 퍼스펙티브 삭제] 사이드바 톤 대응도 본체와 함께 제거 */
  .me{border-top:1px solid var(--sb-line)}
  .me .me-profile:hover{background:var(--sb-hover)}
  .me .av{background:#E6F6EC;color:var(--navy-deep)}
  .me .info b{color:var(--sb-ink-strong)}
  .me .info span{color:var(--sb-grp)}
  .me .me-gear{stroke:var(--sb-grp)}
  .me select{background:var(--tb-field);border:1px solid var(--sb-line);color:var(--sb-ink-strong)}
  .me .logout-btn{border:1px solid var(--sb-line);background:transparent;color:var(--sb-ink)}
  .me .logout-btn:hover{background:var(--sb-hover);color:var(--sb-ink-strong)}
  /* 라이트/다크 토글 — 사이드바 하단, 목업 패밀리 .mode 문법 */
  .mode-seg{margin:6px 14px 8px;display:flex;background:#EFF3F0;border-radius:10px;padding:3px;flex:none}
  .mode-seg button{flex:1;border:none;background:transparent;font-family:inherit;font-size:11.5px;font-weight:700;color:var(--sb-ink);padding:7px 0;border-radius:8px;cursor:pointer;transition:all .15s}
  .mode-seg button.on{background:#fff;color:var(--navy-deep);box-shadow:0 1px 3px rgba(0,0,0,.12)}
  /* 탑바 화이트 */
  .topbar{background:var(--tb-bg);color:var(--ink);border-bottom:1px solid var(--tb-line)}
  .topbar h1{color:var(--ink)}
  .topbar .crumb{color:var(--ink-faint)}
  .topbar .demo-tag{color:#C96455;background:#FDEBEA;border:1px solid #F3C1BD}
  .gsearch{border:1px solid var(--tb-line);background:var(--tb-field);color:var(--ink-soft)}
  .gsearch:hover{background:#EFF6F1}
  .gsearch .gsk{border:1px solid var(--tb-line);color:var(--ink-faint)}
  .notif-bell{border:1.5px solid var(--tb-line);background:var(--tb-field);color:var(--ink)}
  .notif-bell:hover{background:#E6F6EC;border-color:var(--navy)}
  .notif-badge{box-shadow:0 0 0 2px var(--tb-bg)}
  .ham{background:var(--tb-field)}
  .ham svg{stroke:var(--ink)}
  /* [v151 컴팩트헤더] 로고·탑바 축소 + 회색 캡션 제거 — 메뉴·화면을 위로 (진권 빨간줄 기준) */
  .topbar{height:58px;padding:0 24px}
  .topbar h1{font-size:16px}
  .topbar .crumb{display:none}
  .brand{min-height:56px;padding:11px 14px}   /* [v201 로고] 컴팩트 헤더 — 콘텐츠(30px)+여백 22px */
  .brand-cap{display:none}
  .content{padding:20px 30px 60px}
  /* [2026-10-02 검증 모바일 390] ① 위 컴팩트 헤더(padding 24px)가 780px 블록의 14px 를 뒤에서 덮어, 폰에서 상단바 아이콘이 안 줄고 동기화 점(#f2SyncBadge)이 16px 밖으로 밀렸다
     ② 대시보드 바탕 번짐(.d2-dash margin -30px)이 폰 #content 여백(14px · views.css)보다 넓어 화면이 좌우로 16px 흔들렸다 — 폰에서만 여백에 맞춘다 */
  @media(max-width:780px){
    .topbar{padding:0 14px;gap:8px}
    .topbar h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .topbar #f2SyncBadge{margin-left:2px !important}   /* 인라인 style(margin-left:12px — index.html 동기화 배지) 덮기 */
    .d2-dash{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px}
    .hrm-grid2>*{min-width:0}   /* ③ 내 정보 — 대결자 선택(#dgTo) 긴 항목이 1fr 칸을 390px 로 밀어 15px 넘쳤다 */
    .hrm-grid2 select{max-width:100%}
  }
  /* ═══════════ [v151 다크모드] body[data-theme="dark"] — 목업 패밀리 다크 토큰(f2_theme_mode_v1 공유) ═══════════ */
  body[data-theme="dark"]{
    /* [v229 약한다크 C 미드나잇] 진권 픽(2026-08-22) — 검정(#0F1512)에서 네이비 차콜로 한 단계 들어올림. 라이트 토큰 무변경 */
    --bg:#1C2130; --panel:#262C3D; --ink:#E8EBF4; --ink-soft:#B2B9CC; --ink-faint:#939CB1;
    --line:rgba(255,255,255,.10); --line-soft:rgba(255,255,255,.06);
    --navy:var(--sea-dk,#8DB4FF); --navy-2:var(--sea-dk2,#B7D2FF); --navy-deep:var(--sea-dk2,#B7D2FF);
    --sb-bg:#181C2A; --sb-line:rgba(255,255,255,.08); --sb-ink:#CCD2E3; --sb-ink-strong:#F4F6FB; --sb-grp:#8A93A8;
    --sb-hover:rgba(255,255,255,.07); --sb-on-bg:rgba(var(--sea-dk-rgb,141,180,255),.18); --sb-on-ink:var(--sea-dk2,#B7D2FF); --sb-ic:#8F98AD; --sb-ic-on:var(--sea-dk,#8DB4FF);
    --tb-bg:#202536; --tb-line:rgba(255,255,255,.08); --tb-field:rgba(255,255,255,.06);
    --ok:#5BC9B8; --ok-soft:rgba(58,175,160,.16); --warn-soft:rgba(230,174,96,.14); --accent:#F08A72; --accent-soft:rgba(224,114,88,.16);
    --ok-ink:#5BC9B8; --warn-ink:#EBC084; --accent-ink:#F08A72;   /* [2026-10-18 ㉢-1] 글씨용 상태색 — 다크는 지금 밝은 값 그대로 */   /* [v229] 파스텔 토큰 다크 대응 — 종전엔 라이트 값이 그대로 살아 b-ok/b-wait 글자가 묻혔다 */
    --shadow-sm:none; --shadow:none; --shadow-lg:none;
    --postit-sh:0 1px 0 rgba(0,0,0,.18),2px 3px 6px rgba(0,0,0,.26);   /* [2026-10-03 포스트잇 A안] 어두운 바탕에선 라이트 값이 안 보여 한 단계 진하게 */
  }
  body[data-theme="dark"] #nav a.on::before{background:var(--sea-dk,#8DB4FF)}
  body[data-theme="dark"] #nav a.nav-child .dot{background:rgba(255,255,255,.28)}
  body[data-theme="dark"] #nav a.nav-child.on .dot{background:var(--sea-dk,#8DB4FF);box-shadow:0 0 0 3px rgba(var(--sea-dk-rgb,141,180,255),.2)}
  body[data-theme="dark"] #nav a#navWrite{color:var(--sea-dk2,#B7D2FF);background:rgba(var(--sea-dk-rgb,141,180,255),.14)}
  body[data-theme="dark"] #nav a#navWrite .ic-c{stroke:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] #nav a#navWrite:hover{background:rgba(var(--sea-dk-rgb,141,180,255),.24);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] #nav{scrollbar-color:rgba(255,255,255,.18) transparent}
  body[data-theme="dark"] #nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16)}
  body[data-theme="dark"] .me .av{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mode-seg{background:rgba(255,255,255,.08)}
  body[data-theme="dark"] .mode-seg button.on{background:rgba(var(--sea-dk-rgb,141,180,255),.2);color:var(--sea-dk2,#B7D2FF);box-shadow:none}
  body[data-theme="dark"] .topbar .demo-tag{color:#FCA5A5;background:rgba(248,113,113,.14);border-color:rgba(248,113,113,.4)}
  /* [v151] 다크 — 대시보드 히어로(화이트+그린 리컬러분) */
  body[data-theme="dark"] .d2-eyebrow{color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .d2-hd .c .cs, body[data-theme="dark"] .d2-mini.d2-heroS .m-clock .cs{color:var(--sea-dk2,#B7D2FF);background:rgba(var(--sea-dk-rgb,141,180,255),.16)}
  body[data-theme="dark"] .d2-hero .wx, body[data-theme="dark"] .d2-mini.d2-heroS .wx{background:rgba(255,255,255,.06);border-color:var(--line)}
  body[data-theme="dark"] .wx-t{color:var(--ink)}
  body[data-theme="dark"] .wx-d{color:var(--ink-soft)}
  body[data-theme="dark"] .wx-hl{color:var(--ink-faint)}
  /* [v151] 다크 — 대시보드 위젯 전체 (카드·텍스트·트랙·편집 UI) */
  body[data-theme="dark"] .d2-panel,
  body[data-theme="dark"] .d2-mini{background:var(--panel);box-shadow:none}
  body[data-theme="dark"] .d2-ph h3,
  body[data-theme="dark"] .d2-at{color:var(--ink)}
  body[data-theme="dark"] .d2-prow .pl,
  body[data-theme="dark"] .d2-mini .m-sub{color:var(--ink-soft)}
  body[data-theme="dark"] .d2-as,
  body[data-theme="dark"] .d2-mini .m-lab,
  body[data-theme="dark"] .d2-mini .m-big small{color:var(--ink-faint)}
  body[data-theme="dark"] .d2-mini .m-clock .cs{color:var(--ink-faint);background:rgba(255,255,255,.10)}
  body[data-theme="dark"] .dash-editbar{background:rgba(235,192,132,.12);border-color:rgba(235,192,132,.3);color:#E0B983}
  body[data-theme="dark"] .gsearch:hover{background:rgba(var(--sea-dk-rgb,141,180,255),.1)}
  body[data-theme="dark"] .notif-bell:hover{background:rgba(var(--sea-dk-rgb,141,180,255),.12);border-color:var(--sea-dk,#8DB4FF)}
  /* 다크 — 그린/화이트 스코프 뷰(워크스페이스·내할일·메일) */
  body[data-theme="dark"] #content.gw{
    --bg:#1C2130; --panel:#262C3D; --ink:#E8EBF4; --ink-soft:#B2B9CC; --ink-faint:#939CB1;   /* [v229 약한다크] gw 스코프도 동일 토큰 */
    --line:rgba(255,255,255,.10); --line-soft:rgba(255,255,255,.06);
    --navy:var(--sea-dk,#8DB4FF); --navy-2:var(--sea-dk2,#B7D2FF); --navy-deep:var(--sea-dk2,#B7D2FF);
    --accent:#F08A72; --accent-soft:rgba(224,114,88,.16);   /* [2026-10-18] 라이트 gw 의 --accent(#E07258)가 다크에도 남아 「확인필요」 배지가 2.7:1 */
    background:#1C2130;
  }
  body[data-theme="dark"] .ws3-srch input{background:rgba(255,255,255,.06)}
  body[data-theme="dark"] .ws3-srch input:focus{background:rgba(255,255,255,.09);border-color:var(--sea-dk,#8DB4FF)}
  body[data-theme="dark"] .mailv-mh h2 .scope{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-divtab{background:rgba(255,255,255,.06);color:var(--ink-soft);border-color:var(--line)}
  body[data-theme="dark"] .mailv-divtab.on{background:var(--sea-dk,#8DB4FF);border-color:var(--sea-dk,#8DB4FF);color:var(--sea-ink,#04183D)}
  body[data-theme="dark"] .mailv-chip{background:rgba(255,255,255,.06);color:var(--ink-soft);border-color:var(--line)}
  body[data-theme="dark"] .mailv-fchip,body[data-theme="dark"] .mailv-asgbar select,body[data-theme="dark"] .mfr-table select{background:rgba(255,255,255,.06);color:var(--ink-soft);border-color:var(--line)}   /* [LAB 담당] */
  body[data-theme="dark"] .mailv-why em,body[data-theme="dark"] .mcls-add select,body[data-theme="dark"] .mcls-add input,body[data-theme="dark"] .mcls-stats,body[data-theme="dark"] .mcls-kind{background:rgba(255,255,255,.06);color:var(--ink-soft);border-color:var(--line)}   /* [2026-09-29 메일 자동분류] */
  body[data-theme="dark"] .mailv-fchip .cnt{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.14);color:var(--ink)}   /* [2026-09-30 메일 화면 A·B·C] */
  body[data-theme="dark"] .mailv-fchip.on{background:var(--sea-dk,#8DB4FF);border-color:var(--sea-dk,#8DB4FF);color:var(--sea-ink,#04183D)}   /* 종전엔 다크 기본 칩 규칙이 .on 을 덮어 고른 편지함이 안 보였다 */
  body[data-theme="dark"] .mailv-fchip.on b,body[data-theme="dark"] .mailv-fchip.on small{color:var(--sea-ink,#04183D)}
  body[data-theme="dark"] .mailv-fchip.on .cnt{background:color-mix(in srgb,var(--sea-ink,#04183D) 14%,transparent);border-color:color-mix(in srgb,var(--sea-ink,#04183D) 28%,transparent);color:var(--sea-ink,#04183D)}
  body[data-theme="dark"] .mailv-chip.on{background:var(--sea-dk,#8DB4FF);border-color:var(--sea-dk,#8DB4FF);color:var(--sea-ink,#04183D)}
  body[data-theme="dark"] .mailv-acts button{background:rgba(255,255,255,.06);color:var(--sea-dk2);border-color:var(--line)}
  body[data-theme="dark"] .mailv-it:hover{background:rgba(255,255,255,.05)}
  body[data-theme="dark"] .mailv-it.on{background:rgba(var(--sea-dk-rgb,141,180,255),.14)}
  body[data-theme="dark"] .mailv-it.unread::before{background:var(--sea-dk,#8DB4FF)}
  body[data-theme="dark"] .mailv-it .r1 .cli, body[data-theme="dark"] .mailv-subj .cli{background:rgba(96,165,250,.16);color:#93C5FD}
  body[data-theme="dark"] .mailv-av{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-ah{background:rgba(255,255,255,.04)}
  body[data-theme="dark"] .mailv-att .tosite{background:transparent;border-color:rgba(var(--sea-dk-rgb,141,180,255),.5);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-att .tosite:hover{background:rgba(var(--sea-dk-rgb,141,180,255),.12)}
  body[data-theme="dark"] .mailv-hint{background:rgba(var(--sea-dk-rgb,141,180,255),.1);border-color:rgba(var(--sea-dk-rgb,141,180,255),.25);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-abtn{background:transparent;border-color:rgba(var(--sea-dk-rgb,141,180,255),.35);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-abtn.pri{background:var(--sea-dk,#8DB4FF);border-color:var(--sea-dk,#8DB4FF);color:var(--sea-ink,#04183D)}
  body[data-theme="dark"] .mailv-compose{background:var(--panel)}
  body[data-theme="dark"] .mailv-cph{background:rgba(255,255,255,.04)}
  body[data-theme="dark"] .mailv-cpfrom{background:rgba(255,255,255,.04);border-color:var(--line)}
  body[data-theme="dark"] .mailv-cpb input, body[data-theme="dark"] .mailv-cpb textarea{background:rgba(255,255,255,.05);border-color:var(--line)}
  body[data-theme="dark"] .mailv-cpf .draft{background:transparent;border-color:var(--line)}

  /* [v151 메일풀셋] 처리표시·룰·일정·보낸함 */
  .mailv-it .wire{font-size:9.5px;font-weight:800;background:#E6F6EC;color:var(--navy-deep);border-radius:20px;padding:1px 7px;margin-left:6px;flex:none}
  .mailv-it .mm .rule{font-size:10px;font-weight:700;color:#A57F3B;background:#F7F0E3}
  .mailv-it .mm .mlog{font-size:10px;font-weight:700;color:var(--navy-deep);background:#EAF4EE}
  body[data-theme="dark"] .mailv-it .mm .miss{background:rgba(206,130,114,.16)}
  body[data-theme="dark"] .mailv-it .mm .rule{background:rgba(176,141,81,.16)}
  body[data-theme="dark"] .mailv-it .mm .mlog{background:rgba(30,127,77,.2);color:var(--sea-dk2,#B7D2FF)}
  .mailv-log{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#F0F6F1;border:1px solid #DCE9E1;border-radius:10px;padding:8px 12px;margin:10px 0 0;font-size:11.5px}
  .mailv-log b{color:var(--navy-deep);font-size:11px}
  .mailv-log span{color:#4A5A51;font-weight:600}
  .mailv-tools{display:flex;gap:8px;margin-top:10px}
  .mailv-tools .mtool{border:1px solid #C4E0D1;background:#fff;color:var(--navy-deep);border-radius:9px;padding:7px 12px;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer}
  .mailv-tools .mtool:hover{background:#E6F6EC}
  .mailv-tools .mtool.mtool-re{background:var(--accent);border-color:var(--accent);color:#fff}   /* [2026-10-08] 위 도구 줄 답장 — 주 버튼 */
  .mailv-tools .mtool.mtool-re:hover{filter:brightness(.95)}
  .mailv-att .attdl{margin-left:auto;border:1px solid #C4E0D1;background:#fff;color:var(--navy-deep);border-radius:8px;padding:4px 10px;font-family:inherit;font-size:11px;font-weight:700;cursor:pointer;flex:none}
  .mailv-att .attdl:hover{background:#E6F6EC}
  .mailv-log .cur{background:var(--navy);color:#fff;border-radius:20px;padding:2px 10px;font-weight:800;font-size:10.5px}
  .mailv-inline{display:block;max-width:min(100%,560px);border:1px solid var(--line);border-radius:10px;margin:10px 0;background:#fff}
  .mlog-more{cursor:pointer;color:var(--ink-faint);font-weight:700;text-decoration:underline;text-underline-offset:2px}
  .mlog-more:hover{color:var(--ink-soft)}
  /* [v151 메일첨부] 작성창 첨부 */
  .mailv-attadd{border:1px dashed #C4E0D1;background:transparent;color:var(--navy-deep);border-radius:9px;padding:7px 12px;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;margin-bottom:8px}
  .mailv-attadd:hover{background:#E6F6EC}
  .mailv-cpatts:empty{display:none}
  .mailv-cpatts{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}
  .mailv-cpatt{display:flex;align-items:center;gap:8px;background:#F7FAF8;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:11.5px}
  .mailv-cpatt .n{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
  .mailv-cpatt .sz{color:var(--ink-faint);flex:none}
  .mailv-cpatt .rm{border:none;background:none;color:#C4534E;font-weight:800;cursor:pointer;flex:none;font-size:14px}
  body[data-theme="dark"] .mailv-attadd{border-color:rgba(var(--sea-dk-rgb,141,180,255),.35);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-cpatt{background:rgba(255,255,255,.05);border-color:var(--line)}
  body[data-theme="dark"] .mailv-log .cur{background:rgba(var(--sea-dk-rgb,141,180,255),.22);color:var(--sea-dk2,#B7D2FF)}
  .mailv-modal select{width:100%;border:1px solid #E3EAE5;border-radius:9px;padding:10px 11px;font-family:inherit;font-size:13.5px;margin-bottom:8px;background:#fff}
  body[data-theme="dark"] .mailv-modal select{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1);color:#E8EBF4}
  body[data-theme="dark"] .mailv-att .attdl{background:transparent;border-color:rgba(var(--sea-dk-rgb,141,180,255),.35);color:var(--sea-dk2,#B7D2FF)}
  .mailv-modal{position:fixed;inset:0;background:rgba(24,36,32,.4);z-index:430;display:none;align-items:center;justify-content:center}
  .mailv-modal.show{display:flex}
  .mailv-modal .mm-card{width:min(480px,92vw);background:#fff;border-radius:16px;padding:18px 20px;box-shadow:0 24px 60px rgba(24,36,32,.25)}
  .mailv-modal .mm-h{display:flex;align-items:center;font-size:14.5px;font-weight:800;margin-bottom:4px}
  .mailv-modal .mm-x{margin-left:auto;border:none;background:none;font-size:15px;color:#8A968F;cursor:pointer}
  .mailv-modal .mm-sub{font-size:11.5px;color:#8A968F;margin-bottom:12px;line-height:1.6;word-break:keep-all}   /* [v179 담당지정] 안내문이 '이력 남/음)'으로 어색하게 끊기던 것 */
  .mailv-modal input{width:100%;border:1px solid #E3EAE5;border-radius:9px;padding:9px 11px;font-family:inherit;font-size:13.5px;margin-bottom:8px;box-sizing:border-box}
  /* [v179 담당지정] ⚠️ 위 전역 input 규칙이 체크박스까지 width:100%로 늘려, 네모가 왼쪽에 덩그러니 뜨고
     라벨이 오른쪽 끝으로 밀려났다(진권 스샷). 체크박스만 원래 크기로 되돌린다. */
  .mailv-modal input[type="checkbox"]{width:auto;margin:0;padding:0;flex:none;accent-color:var(--navy);cursor:pointer}
  .mailv-modal .mm-row2{display:flex;gap:8px}
  .mailv-modal .mm-row2 input{flex:1}
  .mailv-modal .mm-vis{align-items:center}   /* [2026-10-03 결정 4-②] 메일 → 일정 공개 범위 */
  .mailv-modal .mm-vis>span{flex:none;font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-bottom:8px}
  .mailv-modal .mm-vis select{flex:1;min-width:0}
  .mailv-modal .mm-save{width:100%;border:none;border-radius:10px;background:var(--navy);color:#fff;font-family:inherit;font-size:14px;font-weight:700;padding:10px 0;cursor:pointer}
  .mr-row{display:flex;align-items:center;gap:10px;padding:9px 2px;border-bottom:1px solid #F1F3F6}
  .mr-kind{font-size:10px;font-weight:800;border-radius:20px;padding:2px 8px;flex:none}
  .mr-kind.b{background:#E6F6EC;color:var(--navy-deep)}
  .mr-kind.s{background:#FDF2DC;color:#A57F3B}
  .mr-mid{flex:1;min-width:0}
  .mr-mid b{font-size:13.5px;display:block}
  .mr-mid small{font-size:10.5px;color:#8A968F}
  .mr-del{border:none;background:none;color:#C96455;font-size:11px;font-weight:700;cursor:pointer}
  .mm-add{display:flex;gap:6px;margin-top:10px}
  .mm-add input{margin-bottom:0;flex:1}
  .mm-add button{flex:none;border:none;border-radius:9px;background:var(--navy);color:#fff;font-family:inherit;font-size:12px;font-weight:700;padding:0 13px;cursor:pointer}
  body[data-theme="dark"] .mailv-log{background:rgba(var(--sea-dk-rgb,141,180,255),.1);border-color:rgba(var(--sea-dk-rgb,141,180,255),.25)}
  body[data-theme="dark"] .mailv-log b,body[data-theme="dark"] .mailv-log span{color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-tools .mtool{background:transparent;border-color:rgba(var(--sea-dk-rgb,141,180,255),.35);color:var(--sea-dk2,#B7D2FF)}
  body[data-theme="dark"] .mailv-modal .mm-card{background:#262C3D}
  body[data-theme="dark"] .mailv-modal input{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1);color:#E8EBF4}
  body[data-theme="dark"] .mr-row{border-color:rgba(255,255,255,.08)}

  /* ═══════════ [v229 다크 가독수리] 밝은색 hex 직접 박힌 요소 7군데 — 다크에서 흰 글자/흰 배경이 겹쳐 글자가 사라지던 것.
     실측(2026-08-22, 48개 메뉴 대비비 스캔): 선택 행 1.0:1 · 자료실 탭 2.1 · 표 1.2 · 결재상세 1.1 · AI칩 1.1 · 필수공지 1.07 · 배지 1.7
     원칙: 라이트 규칙은 손대지 않고 다크 오버라이드만 추가. 값은 전부 토큰/반투명이라 테마 재조정 시 자동 추종 ═══════════ */
  /* ① 선택된 목록 행 (#e6f6ec 고정) */
  body[data-theme="dark"] .ibx3-it.on, body[data-theme="dark"] .hr3-it.on, body[data-theme="dark"] .mailv-it.on{background:rgba(var(--sea-dk-rgb,141,180,255),.15)}
  body[data-theme="dark"] .ibx3-mine{color:var(--navy-deep)}
  /* ② 자료실 사업부 탭 (#fff 고정) */
  body[data-theme="dark"] .vault-tab{background:var(--tb-field);color:var(--ink-soft)}
  body[data-theme="dark"] .vault-tab.on{background:var(--navy);border-color:var(--navy);color:var(--sea-ink,#0A1838)}
  /* ③ 표 머리·합계 행 (#f7f9fc·#f5f7fb·#fafbfd 고정) + 구매 박스(#fff) */
  body[data-theme="dark"] table.dl th, body[data-theme="dark"] table.di th, body[data-theme="dark"] .stamp-tbl th,
  body[data-theme="dark"] #attendRoot .att-tbl th, body[data-theme="dark"] .pc-tbl th, body[data-theme="dark"] .ver-hrow td{background:rgba(255,255,255,.05);color:var(--ink-soft)}
  body[data-theme="dark"] table.di tr.sum td{background:rgba(255,255,255,.04)}
  body[data-theme="dark"] table.di tr.sum.tot td{background:rgba(var(--sea-dk-rgb,141,180,255),.12);color:var(--navy-deep)}
  body[data-theme="dark"] table.dl tr.low td{background:rgba(235,192,132,.10)!important}
  body[data-theme="dark"] table.car-table tr.car-dup td{background:rgba(196,83,78,.14)}
  body[data-theme="dark"] .pc-box{background:var(--panel)}
  body[data-theme="dark"] .iv-note{background:rgba(255,255,255,.05)}
  /* ④ 결재 문서 상세 — 결재선 헤더·메타 라벨·첨부 안내 */
  body[data-theme="dark"] .aline .ah{background:rgba(255,255,255,.05)}
  body[data-theme="dark"] .doc-meta .k{background:rgba(255,255,255,.05)}
  body[data-theme="dark"] .att-alert{background:rgba(var(--sea-dk-rgb,141,180,255),.12);border-color:rgba(var(--sea-dk-rgb,141,180,255),.3);color:var(--navy-deep)}
  /* ⑤ AI 어시스턴트 예시 칩·인사말 (#fff 고정) */
  body[data-theme="dark"] .ai-chip{background:var(--panel);border-color:rgba(224,114,88,.4);color:var(--ink)}
  body[data-theme="dark"] .ai-chip:hover{background:rgba(224,114,88,.16);color:#F5A18E;border-color:#E07258}
  body[data-theme="dark"] .ai-hello{background:var(--panel)}
  /* ⑥ 필수공지 게이트 — 글자색 #241f33 고정 */
  body[data-theme="dark"] .modal.req-gate .reqg-title, body[data-theme="dark"] .modal.req-gate .reqg-agree{color:var(--ink)}
  /* ⑦ 상태 배지·유형 칩 — 연한 배경 위 연한 글자 */
  body[data-theme="dark"] .type-chip{background:rgba(255,255,255,.08);color:var(--ink-soft)}
  body[data-theme="dark"] .b-prog{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--navy-deep)}
  body[data-theme="dark"] .mailv-cpf .draft{background:var(--tb-field)}
  /* 부수 — 관리자 안내(#fbeded)·인사 안내(#f4f1fb)·워크스페이스 출처 칩 */
  body[data-theme="dark"] .adm-intro{background:rgba(196,83,78,.12);border-color:rgba(196,83,78,.3)}
  body[data-theme="dark"] .hrm-note{background:rgba(183,158,232,.12);border-color:rgba(183,158,232,.3)}
  body[data-theme="dark"] #tdRoot .s결재{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--navy-deep)}
  body[data-theme="dark"] #tdRoot .s메일{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--navy-deep)}

  /* ═══════════ [v229 다크 가독수리 2차] 1차 적용 후 재실측에서 남은 것들 ═══════════ */
  /* ⑧ 흰 글자 on 네이비 — 약한 다크는 --navy가 밝아져(#8DB4FF) 흰 글자가 2.1:1로 떨어진다 → 네이비 위 글자는 짙은 남색(7.7:1). 라이트는 그대로 흰 글자 */
  body[data-theme="dark"] .ibx3-vw.on, body[data-theme="dark"] .ibx3-actbar .apv, body[data-theme="dark"] .tab.on, body[data-theme="dark"] .btn.primary, body[data-theme="dark"] .type-seg .o.on, body[data-theme="dark"] .kind-seg .ko.on, body[data-theme="dark"] .leave-seg .lo.on, body[data-theme="dark"] .half-seg .lo.on, body[data-theme="dark"] .agree-seg .ao.on, body[data-theme="dark"] .rcc-btn.on, body[data-theme="dark"] .svq-sech .cnt, body[data-theme="dark"] .svq-szb.on, body[data-theme="dark"] .qv-dlbtn, body[data-theme="dark"] .att-count, body[data-theme="dark"] .exp-status .exp-count, body[data-theme="dark"] .toast, body[data-theme="dark"] .lv-intro-ic, body[data-theme="dark"] .sc-add, body[data-theme="dark"] .sc-cell.today .sc-dnum, body[data-theme="dark"] #attendRoot .att-btn.in, body[data-theme="dark"] .att-mbtn, body[data-theme="dark"] .tt-next, body[data-theme="dark"] .pc-tabs label.on, body[data-theme="dark"] .scp-seg button.on, body[data-theme="dark"] .scp-day.today .scp-dnum, body[data-theme="dark"] #tdAddBtn, body[data-theme="dark"] #ntc3Ack{color:var(--sea-ink,#0A1838)}
  body[data-theme="dark"] .ibx3-vw.on .n{background:color-mix(in srgb,var(--sea-ink,#0A1838) 16%,transparent);color:var(--sea-ink,#0A1838)}
  body[data-theme="dark"] .nav-child .cnt, body[data-theme="dark"] #nav .cnt{color:#fff}   /* 빨간 배지는 흰 글자 유지 */
  /* ⑨ 잡다 hex — 캘린더 요일줄·연차 요약·업로드 바·게시판 권한칩·첨부 칩·미읽음 태그·첨부 버튼(UA buttontext 검정 상속) */
  body[data-theme="dark"] .sc-dow, body[data-theme="dark"] .leave-sum, body[data-theme="dark"] .iv-bar, body[data-theme="dark"] .bd-perm{background:rgba(255,255,255,.05)}
  body[data-theme="dark"] .clip-chip{background:rgba(var(--sea-dk-rgb,141,180,255),.16)}
  body[data-theme="dark"] .ntc-unread-tag{color:var(--navy)}
  body[data-theme="dark"] .att-item{color:var(--ink)}
  body[data-theme="dark"] .dr3-note{border-color:rgba(230,174,96,.35)}
  body[data-theme="dark"] [style*="#8E3B36"], body[data-theme="dark"] [style*="rgb(142, 59, 54)"]{color:#F0A39C!important}   /* 직원DB 경고문 인라인색 — 모듈 JS 미수정 대신 다크에서만 뒤집음 */
  /* ⑩ 매출 현황 — views.css .rev-* 78개 규칙이 전부 라이트 hex 고정(다크 오버라이드 0). 카드·글자만 토큰으로 덮는다 */
  body[data-theme="dark"] .rev-wrap{color:var(--ink)}
  body[data-theme="dark"] .rev-head h2, body[data-theme="dark"] .rev-eyebrow, body[data-theme="dark"] .rev-dc .rnm{color:var(--navy-deep)}
  body[data-theme="dark"] .rev-head .rev-sub2, body[data-theme="dark"] .rev-dz, body[data-theme="dark"] .rev-snaphd small, body[data-theme="dark"] .rev-k .rl, body[data-theme="dark"] .rev-k .ru, body[data-theme="dark"] .rev-dc .rrev small, body[data-theme="dark"] .rev-dc .rpt{color:var(--ink-faint)}
  body[data-theme="dark"] .rev-snaphd, body[data-theme="dark"] .rev-dc .rrev, body[data-theme="dark"] .rev-histbar select{color:var(--ink)}
  body[data-theme="dark"] .rev-k, body[data-theme="dark"] .rev-dc, body[data-theme="dark"] .rev-prt, body[data-theme="dark"] .rev-histbar select, body[data-theme="dark"] .rev-mini .rm{background:var(--panel);border-color:var(--line)}
  body[data-theme="dark"] .rev-snapcard{background:rgba(255,255,255,.04);border-color:var(--line)}
  body[data-theme="dark"] .rev-prt:hover{background:rgba(255,255,255,.08)}
  body[data-theme="dark"] .rev-k .rbar, body[data-theme="dark"] .rev-dc .rpb{background:rgba(255,255,255,.12)}
  body[data-theme="dark"] .rev-d.up{background:rgba(58,175,160,.16);color:#5BC9B8}
  body[data-theme="dark"] .rev-d.dn{background:rgba(196,83,78,.16);color:#F0A39C}
  body[data-theme="dark"] .rev-k.hero .rl, body[data-theme="dark"] .rev-k.hero .rv{color:#F0A39C}
  body[data-theme="dark"] .rev-k.hero .rtag{color:#3A2A08}
  body[data-theme="dark"] .rev-dc .rrl, body[data-theme="dark"] .rev-mini .rm .v, body[data-theme="dark"] .rev-mini .rm small, body[data-theme="dark"] .rev-mini .rm b{color:#EBC084}
  body[data-theme="dark"] .rev-mini .rm [style*="rgb(196, 83, 78)"], body[data-theme="dark"] .rev-mini .rm [style*="#C4534E"]{color:#F0A39C!important}

  /* [v229 3차] 매출 화면 나머지 판(패널·박스·이슈·수금표·업로드) + AI 드로어 말풍선/푸터/표(#fff 고정) */
body[data-theme="dark"] .rev-panel, body[data-theme="dark"] .rev-cbox, body[data-theme="dark"] .rev-issue, body[data-theme="dark"] .rcv-card, body[data-theme="dark"] .rcv-inp, body[data-theme="dark"] .rev-upload{background:var(--panel);border-color:var(--line);color:var(--ink)}
body[data-theme="dark"] .rev-k.hero{background:linear-gradient(180deg,rgba(230,174,96,.14),var(--panel) 60%);border-color:rgba(230,174,96,.45)}
body[data-theme="dark"] .rev-cmt{background:rgba(var(--sea-dk-rgb,141,180,255),.12);color:var(--navy-deep)}
body[data-theme="dark"] .rev-wk{background:rgba(255,255,255,.08);color:var(--ink-faint)}
body[data-theme="dark"] .rcv-tbl tr.rcv-late td{background:rgba(196,83,78,.10)}
body[data-theme="dark"] .rcv-b.done, body[data-theme="dark"] .rev-upstat.ok{background:rgba(58,175,160,.16);color:#5BC9B8;border-color:rgba(58,175,160,.3)}
body[data-theme="dark"] .rev-upstat.err{background:rgba(196,83,78,.16);color:#F0A39C;border-color:rgba(196,83,78,.3)}
body[data-theme="dark"] .aud-act{background:rgba(var(--sea-dk-rgb,141,180,255),.14);color:var(--navy-deep)}
body[data-theme="dark"] .ai-m.bot, body[data-theme="dark"] .ai-foot, body[data-theme="dark"] .ai-doccard{background:var(--panel);border-color:var(--line)}
body[data-theme="dark"] .ai-tbl{background:var(--panel);box-shadow:0 0 0 1px var(--line)}
body[data-theme="dark"] .ai-tbl th{background:rgba(255,255,255,.06);color:var(--ink-soft)}

  /* [v229 4차] 매출 글자 hex(#2A2740·#6E6B85·#1D1B2E)·AI 표 글자(#241f33)·일정 D-day 칩·임시저장 배지·워크스페이스 추가 버튼(2-id 특이도) */
body[data-theme="dark"] .rev-blk h4, body[data-theme="dark"] .rev-cbox .ct, body[data-theme="dark"] .rev-issue li, body[data-theme="dark"] .rcv-inp, body[data-theme="dark"] .ai-tbl td, body[data-theme="dark"] .ai-doccard .dc-tt, body[data-theme="dark"] .ai-doccard .dc-amt{color:var(--ink)}
body[data-theme="dark"] .rcv-tbl th, body[data-theme="dark"] .rev-mini .rm .l, body[data-theme="dark"] .rev-issue .none, body[data-theme="dark"] .rev-up-info span, body[data-theme="dark"] .rev-wrap [style*="#6E6B85"], body[data-theme="dark"] .rev-wrap [style*="rgb(110, 107, 133)"]{color:var(--ink-faint)!important}
body[data-theme="dark"] .rcv-tbl th, body[data-theme="dark"] .rev-issue li{border-color:var(--line)}
body[data-theme="dark"] .ai-tbl td{border-top-color:var(--line)}
body[data-theme="dark"] .sc-when{background:rgba(255,255,255,.08)}
body[data-theme="dark"] #draftCnt.cnt{color:var(--sea-ink,#0A1838)}
body[data-theme="dark"] #tdRoot #tdAddBtn{color:var(--sea-ink,#0A1838)}

  /* [v229 5차] 인라인 회색(#6E6B85) 전역 — 로그 분석 td·매출 보조문구 / 평가 연도 칩 / 공지 중요 핀 */
body[data-theme="dark"] [style*="#6E6B85"], body[data-theme="dark"] [style*="rgb(110, 107, 133)"]{color:var(--ink-faint)!important}
body[data-theme="dark"] .syr{color:var(--navy-deep)}
body[data-theme="dark"] .ntc-pin{color:#F3C57B}

  /* [v229 6차] 진권 스샷 3건 — 달력 빈칸(#fafbfd)·인사평가 시즌 배너(season.js 모듈 CSS hex)·챗봇 말풍선 */
body[data-theme="dark"] .sc-cell.out, body[data-theme="dark"] .sc-cell.out:hover{background:rgba(255,255,255,.03)}
/* [v269] 다크 — 응답 현황 칩·휴가기간 띠·사람 칩 */
body[data-theme="dark"] .sg-person{background:var(--panel);color:var(--ink)} body[data-theme="dark"] .sg-person button:hover{background:rgba(184,65,47,.3);color:#F2A79B}
body[data-theme="dark"] .season-banner{background:linear-gradient(90deg,rgba(var(--sea-dk-rgb,141,180,255),.14),rgba(var(--sea-dk-rgb,141,180,255),.06));border-color:rgba(var(--sea-dk-rgb,141,180,255),.3);color:var(--ink)}
body[data-theme="dark"] .season-banner b{color:var(--ink)}
body[data-theme="dark"] .season-banner p{color:var(--ink-soft)}
body[data-theme="dark"] .sdd{background:rgba(230,174,96,.16);color:#EBC084}
body[data-theme="dark"] .srow, body[data-theme="dark"] .strow{border-color:var(--line)}
body[data-theme="dark"] .sgo, body[data-theme="dark"] .season-banner .sgo{color:var(--navy-deep)}
body[data-theme="dark"] .slock{background:rgba(255,255,255,.04);border-color:var(--line);color:var(--ink-faint)}
body[data-theme="dark"] .slock b, body[data-theme="dark"] .sok{color:var(--ink)}
body[data-theme="dark"] .ai-m.bot{background:var(--panel)!important;color:var(--ink)!important;border-color:var(--line)}
body[data-theme="dark"] .ai-m.bot b, body[data-theme="dark"] .ai-m.bot strong{color:var(--ink)}

  /* [v229 7차] 결재 작성 모달 — 결재선 미리보기(.route-prev #f7f9fc)·합의/최종/내 칩·OCR 배지·예약 라벨 */
body[data-theme="dark"] .route-prev{background:rgba(255,255,255,.05)}
body[data-theme="dark"] .route-prev .st .chip.agree, body[data-theme="dark"] .chip.agree{border-color:rgba(224,114,88,.35)}
body[data-theme="dark"] .route-prev .st .chip.final, body[data-theme="dark"] .chip.final{background:rgba(230,174,96,.14);border-color:rgba(230,174,96,.35);color:#EBC084}
body[data-theme="dark"] .route-prev .st .chip.mine, body[data-theme="dark"] .chip.mine{background:rgba(var(--sea-dk-rgb,141,180,255),.14);border-color:rgba(var(--sea-dk-rgb,141,180,255),.35);color:var(--navy-deep)}
body[data-theme="dark"] .route-prev .st .chip .lk, body[data-theme="dark"] .lk{opacity:.8}
body[data-theme="dark"] .kind-seg .ko .ocrb{color:#0A2A24}
body[data-theme="dark"] .kind-seg .ko.on .ocrb{background:color-mix(in srgb,var(--sea-ink,#0A1838) 22%,transparent);color:var(--sea-ink,#0A1838)}
body[data-theme="dark"] .w-sched{color:var(--ink-soft)}
body[data-theme="dark"] .w-sched input{background:var(--tb-field);border-color:var(--line);color:var(--ink)}

  /* [v229 8차] 시즌 관리 — 완료 체크(.sok #E2F6F3)·대기(.swt)·표 머리(#67737F 고정) */
body[data-theme="dark"] .sok{background:rgba(58,175,160,.2);color:#5BC9B8}
body[data-theme="dark"] .swt{background:rgba(230,174,96,.18);color:#EBC084}
body[data-theme="dark"] .scard th, body[data-theme="dark"] .scard td, body[data-theme="dark"] .season-empgrid th{color:var(--ink-soft);border-color:var(--line)}
  /* [v229 로고수리] 로그인 카드(.lw-card)는 테마 무관 흰색인데 v151 다크 규칙이 로고를 흰색으로 바꿔 카드에 묻혔다(v228부터). 카드 안 로고는 네이비 고정 — 진권 스샷 2026-08-22 */
body[data-theme="dark"] .lw-card .lw-mark svg{color:#0B1326}
  /* [v229 9차] 일괄 승인 바 — bg가 --navy-deep인데 다크에선 그 토큰이 연파랑(#D2E2FF)이라 흰 글자가 묻힘 */
body[data-theme="dark"] #bulkBar{background:color-mix(in srgb,var(--sea-dk,#8DB4FF) 14%,#1C2130);border:1px solid rgba(var(--sea-dk-rgb,141,180,255),.35);box-shadow:0 14px 40px rgba(0,0,0,.5)}
body[data-theme="dark"] #bulkBar .bb-approve{background:var(--sea-dk,#8DB4FF);color:var(--sea-ink,#0A1838)}
  /* [v229 9차] 결재 도장표 — 라이트 회색 hex(#eef0f4·#c9cdd6·#c4cad4·#aab0bd) + 반려 빨강은 다크에서 더 밝게 */
body[data-theme="dark"] .stamp-tbl th, body[data-theme="dark"] .stamp-tbl td{border-color:rgba(255,255,255,.14)}
body[data-theme="dark"] .stamp-tbl .st-side{background:rgba(255,255,255,.07);color:var(--ink-soft)}
body[data-theme="dark"] .stamp-tbl.agree th{background:rgba(58,175,160,.12)}
body[data-theme="dark"] .stamp-tbl.agree .st-side{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--navy-deep)}
body[data-theme="dark"] .st-ord, body[data-theme="dark"] .st-mark.empty{color:rgba(255,255,255,.5)}
body[data-theme="dark"] .st-name.wait{color:var(--ink-faint)}
body[data-theme="dark"] .st-mark.rejected{color:#fff;background:#D9534F}

  /* ═══════════ [v230 대표메일 설정] 관리자 › 대표메일 설정 — 사업부 카드. 색은 전부 토큰(다크 자동) ═══════════ */
  #nav a[data-view="mailacct"] .ic{stroke:#C4525E}
  body[data-theme="dark"] #nav a[data-view="mailacct"] .ic{stroke:#ee6474}
  .ma-intro{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:16px;font-size:13px;color:var(--ink-soft);line-height:1.6}
  .ma-intro>div>b{display:block;font-size:15px;color:var(--ink);margin-bottom:2px}
  .ma-intro-ic{width:44px;height:44px;border-radius:12px;background:var(--accent-soft);display:grid;place-items:center;flex:none}
  .ma-intro-ic svg{width:22px;height:22px;fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .ma-perm{margin-left:auto;flex:none;font-size:11px;font-weight:800;padding:3px 10px;border-radius:20px;background:var(--accent-soft);color:#B8432B}
  .ma-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
  .ma-card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px 16px;box-shadow:var(--shadow-sm)}
  .ma-card.ok{border-color:rgba(58,175,160,.45)}
  .ma-card.err{border-color:rgba(196,83,78,.45)}
  .ma-h{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px;color:var(--ink)}
  .ma-dot{width:10px;height:10px;border-radius:50%;flex:none}
  .ma-st{margin-left:auto;font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:20px;white-space:nowrap}
  .ma-st.ok{background:var(--ok-soft);color:#1F7A6E}
  .ma-st.no{background:var(--line-soft);color:var(--ink-soft)}
  .ma-st.err{background:var(--accent-soft);color:#B8432B}
  .ma-st.env{background:var(--warn-soft);color:#8A6100}
  .ma-addr{font-family:ui-monospace,Consolas,"Pretendard",monospace;font-size:12.5px;color:var(--ink);margin:9px 0 3px;word-break:break-all}
  .ma-meta{font-size:11.5px;color:var(--ink-faint);min-height:18px;line-height:1.5}
  .ma-row{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
  .ma-row .btn.sm{padding:6px 11px;font-size:12px}
  .ma-off{color:var(--accent-ink)}
  .ma-empty{grid-column:1/-1;padding:26px;text-align:center;color:var(--ink-faint);font-size:13px}
  .ma-note{font-size:12px;color:var(--ink-faint);margin-top:16px;line-height:1.75}
  .ma-note b{color:var(--ink-soft)}
  .ma-modal-top{background:var(--line-soft);border:1px solid var(--line);border-radius:10px;padding:10px 13px;margin-bottom:12px;color:var(--ink-soft)}
  .ma-modal-note{margin-top:12px;background:var(--warn-soft);border:1px solid rgba(230,174,96,.35);border-radius:10px;padding:9px 12px;font-size:12px;line-height:1.6;color:var(--ink-soft)}
  body[data-theme="dark"] .ma-perm{color:#F5A18E}
  body[data-theme="dark"] .ma-st.no{background:rgba(255,255,255,.08);color:var(--ink-soft)}
  body[data-theme="dark"] .ma-st.ok{color:#5BC9B8}
  body[data-theme="dark"] .ma-st.err{color:#F5A18E}
  body[data-theme="dark"] .ma-st.env{color:#EBC084}
  /* [v230 자동 수집] 헤더 — 실패 시 빨강 점/글자 · 동기화 버튼은 작은 🔄 */
  .mailv-fresh span.bad{color:#C4534E;font-weight:700}
  .mailv-fresh .d.bad{background:#C4534E}
  .mailv-acts button.mini{padding:5px 9px;font-size:13px;line-height:1;border-radius:8px}   /* [2026-09-29] 버튼 줄(.mailv-acts)로 옮김 */
  body[data-theme="dark"] .mailv-fresh span.bad{color:#F0A39C}
  /* [오픈 베타 A안] 보라 BETA — 가을 계절색(주황)과 안 겹치고 「경고」로 안 읽히는 색 · 다크는 아래 */
  #pilotBar{display:flex;align-items:center;gap:8px;padding:6px 18px;font-size:12.5px;font-weight:700;color:#4E33B8;background:#F1EDFF;border-bottom:1px solid #DCD3FF;letter-spacing:.01em}
  #pilotBar[hidden]{display:none}
  #pilotBar .pb-ic{display:inline-flex;align-items:center;flex:none}
  #pilotBar .pb-ic svg{width:15px;height:15px;display:block}
  #pilotBar .pb-tag{flex:none;font-size:10.5px;font-weight:800;letter-spacing:.08em;border-radius:6px;padding:1px 7px;background:#5B3CC4;color:#fff}
  #pilotBar #pilotTxt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #pilotBar .pb-go{margin-left:auto;flex:none;border:0;background:none;padding:2px 6px;font:inherit;font-weight:800;color:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer;border-radius:6px}
  #pilotBar .pb-go:hover{background:rgba(91,60,196,.10)}
  #pilotBar .pb-go:focus-visible{outline:2px solid #8E77FF;outline-offset:1px}
  body[data-theme="dark"] #pilotBar{color:#CFC4FF;background:rgba(155,135,255,.14);border-bottom-color:rgba(155,135,255,.28)}
  body[data-theme="dark"] #pilotBar .pb-tag{background:#8E77FF;color:#14102B}
  body.locked #pilotBar{display:none}

  /* ═══════════════════════════════════════════════════════
     [v248 계절] 4계절 색 — theme.js 의 --sea-* 변수를 여기서만 바른다.
     ⚠️ 이 블록은 common.css 의 **맨 끝**이어야 한다. 위의 [v151 화이트셸](2832행~)과
        body[data-theme="dark"](2949행~)를 순서로 이겨야 하기 때문이다.
        다크 규칙이 var(--sea-dk,#8DB4FF) 를 하드코딩하고 있어 특이도를 [data-theme] 로 맞춘다.
     ⚠️ --sea-* 가 없으면(=theme.js 미로드) 폴백 값으로 v247 파랑이 그대로 나온다.
     ⚠️ 계절색을 여기서 더 넓히지 말 것 — 아이콘 14색·배지 빨강·OCR 신호등은
        "메뉴 구분"과 "상태 신호"라서 계절로 물들이면 의미가 무너진다.
     ═══════════════════════════════════════════════════════ */
  :root{ --sea-on:var(--sea,#0D57D6); --sea-bg2:var(--sea-tint,#E6F6EC); --sea-hv:var(--sea-hover,#F0F6F1) }
  /* ⚠️ 다크는 틴트원(--sea-dk)과 글자(--sea-dk2)가 다른 값이다.
     하나로 합치면 글자/틴트 대비가 3.7:1 로 떨어진다(실측). v247 도 var(--sea-dk,#8DB4FF) 틴트 / var(--sea-dk2,#B7D2FF) 글자로 갈라 뒀다. */
  body[data-theme="dark"]{ --sea-on:var(--sea-dk2,#B7D2FF); --sea-bg2:rgba(var(--sea-dk-rgb,141,180,255),.18); --sea-hv:rgba(255,255,255,.07) }
  /* ═══ [v281 계절 전면] 브랜드 파랑 토큰(--navy 계열)을 계절 주색으로 — 버튼·선택 칩·탭·토글·링크·포커스·토스트 전부(진권 2026-09-14).
     v248 은 사이드바 6곳만 물들였는데 모듈 안 버튼은 파랑 고정이라 로그인 화면과 따로 놀았다.
     라이트: 주색(--sea) / 짙은 주색(--sea-btn2) / 밝은 짝(--sea-g2) · 다크: v229 의 var(--sea-dk,#8DB4FF)/var(--sea-dk2,#B7D2FF)/var(--sea-dk2,#B7D2FF) 자리를 --sea-dk/--sea-dk2 로.
     그대로 두는 것: 메뉴 아이콘 14색 · 상태 배지(빨강·초록·주황) · OCR 신호등 · 직급 아바타 · 일정 분류색 · 자료실 파일형식색 · 날씨 아이콘. */
  body, body #content.gw{ --navy:var(--sea,#1B6FF5); --navy-2:var(--sea-g2,#5C9BFF); --navy-deep:var(--sea-btn2,#0D57D6) }   /* #content.gw(219행)가 토큰을 다시 정의하므로 거기도 */
  body[data-theme="dark"], body[data-theme="dark"] #content.gw{ --navy:var(--sea-dk,#8DB4FF); --navy-2:var(--sea-dk2,#B7D2FF); --navy-deep:var(--sea-dk2,#B7D2FF) }
  /* [2026-10-18 계절 전면 2차] 다크 — 옅은 계절 바탕(--sea-tint)은 html 에 라이트 값이 박혀 다크에서도 밝게 떴다 → 다크 틴트로.
     --sea-ink = 다크 계절색(--sea-dk) 버튼·칩 위 짙은 글자(종전 남색 #0A1838·#04183D 고정 → 계절 쪽 짙은 색 · 가을 대비 7.1) */
  body[data-theme="dark"]{ --sea-tint:rgba(var(--sea-dk-rgb,141,180,255),.16); --sea-ink:color-mix(in srgb,var(--sea-dk,#8DB4FF) 14%,#0b0c0f) }
  body[data-theme="dark"] .hr-owner{color:var(--ink-soft);border-bottom-color:var(--line)}
  body[data-theme="dark"] .hr-owner.mine{background:var(--ok-soft)} body[data-theme="dark"] .hr-owner.mine b{color:var(--ok-ink)}
  body[data-theme="dark"] .hr-owner.warn{background:var(--warn-soft)} body[data-theme="dark"] .hr-owner.warn b{color:#EBC084}
  body[data-theme="dark"] .hr-owner-list, body[data-theme="dark"] .hr-owner-ro, body[data-theme="dark"] .hr-owner-d>summary::after{color:var(--ink-faint)}
  body[data-theme="dark"] .mat-ac, body[data-theme="dark"] .balju-ac, body[data-theme="dark"] .mat-results{background:var(--panel)}
  body[data-theme="dark"] .mat-pill.mj-muted{background:rgba(255,255,255,.08)}
  body[data-theme="dark"] .dpm-dv.on{color:var(--sea-ink)}
  /* 다크에서 흰 · 밝은 회색으로 남아 있던 상자(단가 계산 단계 · 인사관리 요약 · 서식 갤러리 · 연차 보기 전환) */
  body[data-theme="dark"] .pc-step, body[data-theme="dark"] .pc-chain div, body[data-theme="dark"] .pc-sens, body[data-theme="dark"] .hrm-tip, body[data-theme="dark"] .rec-stat{background:rgba(255,255,255,.05)}
  body[data-theme="dark"] .tpl-gallery{background:rgba(255,255,255,.04);border-color:var(--line)} body[data-theme="dark"] .tpl-lbl{color:var(--ink-soft)}
  body[data-theme="dark"] .lv-modes{background:rgba(255,255,255,.06)} body[data-theme="dark"] .mode-btn.on{background:rgba(255,255,255,.12)}
  body[data-theme="dark"] .dwell{background:rgba(255,255,255,.08);color:var(--ink-soft)} body[data-theme="dark"] .dwell.a3{background:rgba(230,174,96,.16);color:#EBC084}
  /* 상태 글자 — 라이트용 짙은 초록 · 갈색이 다크 바탕에서 2.9:1 */
  body[data-theme="dark"] .st-badge.ok, body[data-theme="dark"] .mat-pill.mj-ok{color:var(--ok-ink)} body[data-theme="dark"] .st-badge.warn, body[data-theme="dark"] .mat-pill.mj-warn{color:#EBC084}
  /* 계절색 바탕 위 흰 글자(다크 2.2:1) → 짙은 글자 */
  body[data-theme="dark"] .div-pill.on:not([style*="--dvc"]), body[data-theme="dark"] .hrm-auth, body[data-theme="dark"] .cert-seg button.on, body[data-theme="dark"] .cert-issue{color:var(--sea-ink)}
  body[data-theme="dark"] .arc-chip.on, body[data-theme="dark"] .arc-go{color:#2A1712}   /* 다크 --accent(#F08A72) 위 흰 글자 2.4:1 → 짙은 글자 */
  /* [2026-10-18 8000 실데이터 점검] 밝은 hover 바탕(#f4f7f5 · #f7f9fc …)이 다크에서 흰 줄이 되던 것(임시저장 줄 · 일정 칸 1.1:1) — 시연 데이터엔 없던 요소 · 마우스를 올려야 보임 */
  body[data-theme="dark"] .ibx3-it:hover, body[data-theme="dark"] .hr3-it:hover, body[data-theme="dark"] .sc-cell:hover, body[data-theme="dark"] .tpl-card:hover, body[data-theme="dark"] .add-itm:hover, body[data-theme="dark"] .att-item:hover, body[data-theme="dark"] .notif-item:hover, body[data-theme="dark"] .ntc.unread:hover, body[data-theme="dark"] .mailv-tools .mtool:hover, body[data-theme="dark"] .mailv-att .attdl:hover, body[data-theme="dark"] .mailv-attadd:hover{background:rgba(255,255,255,.07)}
  /* 계절색(--navy) 바탕 위 흰 글씨 — 다크 2.2:1 → 짙은 글자(위 ⑧ 목록에 없던 11곳) */
  body[data-theme="dark"] .mailv-cpf .send, body[data-theme="dark"] .mailv-modal .mm-save, body[data-theme="dark"] .sp-mv .btn.on, body[data-theme="dark"] .rev-chip, body[data-theme="dark"] .rev-up-btn, body[data-theme="dark"] .scp-tday, body[data-theme="dark"] .scp-nexttag, body[data-theme="dark"] .bf-ok, body[data-theme="dark"] .fb-send, body[data-theme="dark"] .bz-rsteps li.now .n{color:var(--sea-ink)}
  body[data-theme="dark"]{ --sb-on-bg:rgba(var(--sea-dk-rgb,141,180,255),.18); --sb-on-ink:var(--sea-dk2,#B7D2FF); --sb-ic-on:var(--sea-dk,#8DB4FF) }
  /* ── 사이드바 6곳 ── */
  body[data-theme] #nav a.on{background:var(--sea-bg2);color:var(--sea-on)}
  body[data-theme] #nav a.on::before{background:var(--sea-on)}
  body[data-theme] #nav a:hover{background:var(--sea-hv)}
  body[data-theme] #nav a.nav-parent.parent-on{background:var(--sea-bg2);color:var(--sea-on)}
  body[data-theme] #nav a.nav-child.on .dot{background:var(--sea-on);box-shadow:0 0 0 3px var(--sea-bg2)}
  body[data-theme] #nav a.nav-child.on .ic-c{stroke:var(--sea-on)}
  body[data-theme] #nav a#navWrite{background:var(--sea-bg2);color:var(--sea-on)}
  body[data-theme] #nav a#navWrite .ic-c{stroke:var(--sea-on)}
  body[data-theme] #nav a#navWrite:hover{background:var(--sea-bg2);color:var(--sea-on);filter:brightness(.96)}
  body[data-theme] #nav a#hrParent.parent-on .ic{color:var(--sea-on)}
  /* ⚠️ .me .av 는 계절색을 주지 않는다 — 직급 아바타(setMeAvatar)가 사원~사장·관리자·개발자
     티어 컬러를 **인라인 스타일**로 박는다. 신분 신호라서 계절로 덮으면 의미가 무너지고,
     인라인이라 CSS 로는 어차피 못 이긴다(실측 확인). */
  body[data-theme] .me .me-profile:hover{background:var(--sea-hv)}
  /* 🔴 라이트는 흰 배경이라 글자만 바꾸면 되지만, 다크는 v247 이 배경을
     rgba(var(--sea-dk-rgb,141,180,255),.2)(파랑)로 박아둬서 글자만 계절색으로 바꾸면
     밝은 계절색 위에 밝은 파랑틴트 → 1.9:1 이 된다(실측). 배경도 같이 바꾼다. */
  body[data-theme] .mode-seg button.on{color:var(--sea-on)}
  body[data-theme="dark"] .mode-seg button.on{background:var(--sea-bg2);color:var(--sea-on)}
  /* ── 로고: 액센트만 ──
     워드마크(currentColor)는 네이비/흰색 그대로 두고, SVG 안에 박힌 브랜드 사선만 계절색.
     SVG 의 fill 은 **표현 속성(presentation attribute)** 이라 CSS 우선순위가 가장 낮다
     → CSS 로 fill 을 주면 그냥 이긴다. JS 불필요.
     ⚠️ 선택자를 hex 값(path[fill="#116BFF"])에 걸지 않는다 — 브랜드 파랑이 한 번만 바뀌어도
        계절 로고가 조용히 죽는다. index.html 의 해당 path 에 class="f2-accent" 를 달아 두고
        그 클래스로만 잡는다. fill 속성값은 theme.js 미로드 시 폴백으로 남겨 둔다. */
  .f2mark .f2-accent{fill:var(--sea-on,#1B6FF5)}
  /* 로그인 카드(.lw-card)는 테마 무관 흰색이다(v229) → 카드 안 로고는 항상 라이트 주색.
     여기에 --sea-on 을 쓰면 다크에서 밝은 계절색이 흰 카드에 묻힌다. */
  .lw-mark svg .f2-accent{fill:var(--sea,#1B6FF5)}
  /* ── 로그인 화면 ── */
  body.locked #loginScreen{background:var(--sea-bg,#F5F9F6)}
  .lg-eyebrow{color:var(--sea,#0D57D6)}
  .lg-slogan .go{background:linear-gradient(90deg,var(--sea,#1B6FF5),var(--sea-g2,#5C9BFF));-webkit-background-clip:text;background-clip:text;color:transparent}
  .lg-sub .hl{color:var(--sea,#0D57D6)}
  /* 버튼 그라데는 방향을 뒤집었다 — 현행은 밝은끝이 4.53:1 로 아슬아슬했다.
     주색 → 더 짙은 주색이라 최악 지점이 5.16:1 이 된다. */
  .login-btn{background:linear-gradient(135deg,var(--sea,#1B6FF5),var(--sea-btn2,#0D57D6));box-shadow:0 10px 30px rgba(var(--sea-rgb,27,111,245),.30)}
  .login-inp:focus{border-color:var(--sea,#1B6FF5);box-shadow:0 0 0 3px rgba(var(--sea-rgb,27,111,245),.16)}
  .login-opts input[type="checkbox"]{accent-color:var(--sea,#1B6FF5)}
  .otp-cell:focus{border-color:var(--sea,#1B6FF5);box-shadow:0 0 0 3px rgba(var(--sea-rgb,27,111,245),.16)}
  /* ═══ [v268 전자서명] 확약서·근로계약서 — 작성창(대상 부서 칩·엑셀 미리보기) · 서명 모달 · 봉인 블록 · 서명 현황 ═══ */
  .sg-chips{display:flex;flex-wrap:wrap;gap:6px}
  .sg-chip{border:1.5px solid var(--line);background:var(--panel);color:var(--ink-soft);border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:700;cursor:pointer}
  .sg-chip .n{font-weight:600;color:var(--ink-faint);margin-left:2px}
  .sg-chip.on{border-color:#B8412F;background:#FBEAE6;color:#8C2E1F} .sg-chip.on .n{color:#B8412F}
  .sg-preview{margin-top:8px;font-size:12.5px;color:var(--ink-soft);line-height:1.6;background:var(--bg);border:1px dashed var(--line);border-radius:9px;padding:8px 11px}
  /* [v269] 대상 명단 사람 칩 — ✕ 개인 제외 · ↩ 복귀 */
  .sg-pv-h{margin-bottom:6px} .sg-pv-h .sub{font-weight:500;color:var(--ink-faint);margin-left:4px}
  .sg-people{display:flex;flex-wrap:wrap;gap:5px;max-height:132px;overflow:auto;padding:2px 0}
  .sg-people.ex{border-top:1px dashed var(--line);margin-top:6px;padding-top:7px}
  .sg-person{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:999px;padding:2px 4px 2px 9px;font-size:12px;font-weight:600;line-height:1.5}
  .sg-person button{border:none;background:transparent;color:var(--ink-faint);cursor:pointer;font-size:11px;line-height:1;padding:3px 5px;border-radius:999px;font-family:inherit}
  .sg-person button:hover{background:#FBEAE6;color:#B8412F}
  .sg-person.off{opacity:.55;text-decoration:line-through;background:var(--bg)} .sg-person.off button{text-decoration:none} .sg-person.off button:hover{background:#E6F3EE;color:#0F7A5F}
  .sg-xl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px} .sg-xlinfo{font-size:12px;color:var(--ink-faint);font-weight:600}
  .sg-xlempty{font-size:12.5px;color:var(--ink-faint);background:var(--bg);border:1px dashed var(--line);border-radius:9px;padding:14px;text-align:center}
  .sg-xlwrap{overflow:auto;max-height:280px;border:1px solid var(--line);border-radius:9px}
  .sg-tbl{width:100%;border-collapse:collapse;font-size:12.5px} .sg-tbl th,.sg-tbl td{border-bottom:1px solid var(--line);padding:6px 9px;text-align:left;white-space:nowrap} .sg-tbl th{background:var(--bg);font-weight:700;color:var(--ink-soft);position:sticky;top:0}
  .sg-tbl .sub{font-size:11px;color:var(--ink-faint);font-weight:500}
  /* [2026-09-22] 연봉계약서 엑셀 검사 배지 · 임금표 */
  .sg-bdgs{white-space:normal!important;min-width:160px} .sg-bdg{display:inline-block;font-size:10.5px;font-weight:700;border-radius:999px;padding:1px 7px;margin:1px 3px 1px 0}
  .sg-bdg.bad{color:#A32A1F;background:#FBECEA} .sg-bdg.warn{color:var(--warn-ink);background:var(--warn-soft)} .sg-bdg.ok{color:var(--ok-ink);background:var(--ok-soft)}
  .sg-tbl tr.sg-xbad td{background:#FDF5F4}
  body[data-theme="dark"] .sg-bdg.bad{background:rgba(163,42,31,.28);color:#F2A79B} body[data-theme="dark"] .sg-tbl tr.sg-xbad td{background:rgba(163,42,31,.12)}
  .sg-sal{margin:6px 0;text-align:center} .sg-sal td{text-align:right} .sg-sal small{font-weight:500}
  .sg-ok{color:#0F7A5F;font-weight:700} .sg-wait{color:#B8412F;font-weight:700} .sg-rej{color:#8C2E1F;font-weight:600}
  /* [v270] 취소·마감 지남 */
  .sg-cx{color:var(--ink-faint);font-weight:600} .sg-row-cx td{opacity:.6}
  .sg-over{display:inline-block;font-size:10.5px;font-weight:800;color:#A32A1F;background:#FBECEA;border-radius:999px;padding:1px 7px;margin-left:4px;vertical-align:1px}
  .d2-rover{display:inline-block;font-size:10px;font-weight:800;color:#A32A1F;background:#FBECEA;border-radius:999px;padding:1px 7px;margin-left:6px;vertical-align:1px}
  body[data-theme="dark"] .sg-over,body[data-theme="dark"] .d2-rover{background:rgba(163,42,31,.28);color:#F2A79B}
  .sg-sign-doc{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 13px;margin-bottom:10px;font-size:14px} .sg-sign-doc .sub{font-size:12px;color:var(--ink-faint);margin-top:2px}
  .sg-sign-note{margin:0 0 12px;padding-left:18px;font-size:13px;color:var(--ink-soft);line-height:1.6}
  .sg-otp{font-size:26px;letter-spacing:.42em;text-align:center;font-weight:800;font-variant-numeric:tabular-nums}
  .seal-box{margin-top:14px;border:1.5px solid #BFE3CF;background:#E4F3EC;border-radius:12px;padding:12px 15px;color:#0F5A44}
  .seal-box.wait{border-color:#F0C9B8;background:#FBEAE6;color:#8C2E1F}
  .seal-h{font-weight:800;font-size:14px;margin-bottom:6px}
  .seal-r{display:flex;gap:10px;font-size:13px;line-height:1.7} .seal-r>span{width:72px;color:inherit;opacity:.75;flex:0 0 auto}
  .seal-hash{font-family:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;font-size:11.5px;word-break:break-all;background:rgba(255,255,255,.55);padding:1px 6px;border-radius:5px}
  .seal-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px} .seal-acts .sub,.seal-box .sub{font-size:12px;opacity:.85;line-height:1.55}
  .seal-box.wait .sub{margin-bottom:4px}
  /* [2026-09-22] 사용시기 지정통보서 격자 — 달마다 일 1–15 / 지정 / 일 16–31 / 지정 */
  .pp-grid{border-collapse:collapse;width:100%;min-width:640px;font-size:11.5px;text-align:center} .pp-grid th,.pp-grid td{border:1px solid var(--line);padding:3px 2px;height:22px}
  .pp-grid th{background:var(--bg);font-weight:600;color:var(--ink-soft)} .pp-grid td.x{background:var(--bg)} .pp-grid td.hol{color:var(--accent-ink)} .pp-grid td.sum{font-weight:800;width:34px}
  .pp-grid td.m{font-size:14px;font-weight:800;color:var(--navy)} .pp-grid.edit td[data-pd]{cursor:pointer} .pp-grid.edit td[data-pd]:hover{outline:2px solid var(--navy);outline-offset:-2px}
  .pp-grid.edit td.off{background:repeating-linear-gradient(135deg,transparent 0 4px,var(--line) 4px 5px);cursor:not-allowed} .pp-grid td.on{background:var(--ok-soft)}
  .pp-sum{margin:8px 0;font-size:13.5px} .pp-box{margin-top:10px}
  .sg-campline{margin-top:10px;font-size:13px;color:var(--ink-soft);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .sg-strip{display:flex;flex-direction:column;gap:6px;padding:8px 10px 6px;border-bottom:1px solid var(--line);background:var(--bg)}
  .sg-camp{display:grid;grid-template-columns:1fr 92px auto;align-items:center;gap:10px;border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:7px 10px;cursor:pointer;text-align:left;font-family:inherit}
  .sg-camp .t{font-size:12.5px;font-weight:700;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .sg-camp .p{height:7px;background:var(--line);border-radius:999px;overflow:hidden} .sg-camp .p i{display:block;height:100%;background:#B8412F;border-radius:999px}
  .sg-camp.done .p i{background:#0F7A5F} .sg-camp .n{font-size:12px;font-weight:700;color:var(--ink-soft);white-space:nowrap}
  .sg-camp:hover{border-color:#B8412F}
  .sg-stat-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--ink-soft);margin-bottom:10px} .sg-stat-n{margin-left:auto;font-size:14px;color:var(--ink)}
  .sg-stat td:nth-child(3){white-space:normal} .sg-statwrap{max-height:62vh}
  /* ═══ [2026-09-30 관리부 서식 간소화] 자동 제목 · 파일 서명(작성·받는 사람 화면) · 발송 전 확인 레이어(#sgcfRoot — 작성창 위, 토스트 아래) ═══ */
  .sg-autottl{font-size:13.5px;font-weight:700;color:var(--ink);background:var(--bg);border:1px dashed var(--line);border-radius:9px;padding:9px 12px}
  .sg-hint{margin-top:7px;font-size:12px;color:var(--ink-faint);line-height:1.55}
  .sgf-one{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:var(--panel)}
  .sgf-one .att-info{flex:1;min-width:0}
  .sgf-box{margin-top:14px;border:1.5px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}
  .sgf-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 12px;background:var(--bg);border-bottom:1px solid var(--line);font-size:13px}
  .sgf-h .sub{font-size:11.5px;color:var(--ink-faint);font-weight:500} .sgf-acts{margin-left:auto;display:flex;gap:6px}
  .sgf-pdf{display:block;width:100%;height:62vh;min-height:360px;border:0;background:#fff}
  .sgf-img{display:block;max-width:100%;max-height:70vh;margin:0 auto;padding:10px}
  .sgf-none{padding:22px 14px;text-align:center;font-size:13px;color:var(--ink-soft)}
  #sgcfRoot .sgcf-ov{position:fixed;inset:0;z-index:150;background:rgba(22,29,45,.55);backdrop-filter:blur(2px);display:flex;align-items:flex-start;justify-content:center;padding:28px 16px;overflow-y:auto;animation:ofade .15s}
  .sgcf-box{width:min(920px,100%);background:var(--panel);border-radius:16px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;max-height:calc(100vh - 56px)}
  .sgcf-h{display:flex;align-items:flex-start;gap:12px;padding:16px 20px 12px;border-bottom:1px solid var(--line)}
  .sgcf-h>div{flex:1;min-width:0} .sgcf-t{font-weight:800;font-size:16px} .sgcf-sum{margin-top:5px;font-size:14px;color:var(--ink-soft)}
  .sgcf-h .x{border:none;background:transparent;font-size:24px;line-height:1;color:var(--ink-faint);cursor:pointer;padding:0 4px}
  .sgcf-b{padding:14px 20px;overflow-y:auto;flex:1}
  .sgcf-f{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px;border-top:1px solid var(--line)}
  .sgcf-nav{display:flex;align-items:center;gap:8px;margin-bottom:10px} .sgcf-nav select{flex:1;min-width:0;max-width:360px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;font-family:inherit;background:var(--panel);color:var(--ink)}
  .sgcf-nav option.bad{color:#A32A1F} .sgcf-pos{font-size:12.5px;color:var(--ink-faint);font-weight:700;white-space:nowrap}
  .sgcf-lbl{font-size:12px;font-weight:700;color:var(--ink-soft);margin:4px 0 8px}
  .sgcf-doc{border:1px solid var(--line);border-radius:12px;padding:16px 18px;background:var(--panel)}
  .sgcf-perr,.sgcf-iss{background:#FBECEA;border:1px solid #F0C9C4;color:#A32A1F;border-radius:10px;padding:9px 12px;font-size:13px;margin-bottom:10px}
  .sgcf-iss ul{margin:6px 0 0;padding-left:18px} .sgcf-iss li{margin:3px 0}
  .sgcf-pwarn{background:var(--warn-soft);border:1px solid #f0dcae;color:var(--warn-ink);border-radius:10px;padding:8px 12px;font-size:13px;margin-bottom:10px}
  /* [2026-09-30 서명 후속] 확인 화면 사내공지 미리보기 · 서명 창 안의 서버 원본 문서 */
  .sgcf-ntc{border:1px dashed var(--line);border-radius:10px;padding:9px 12px;margin-bottom:10px;font-size:13px;background:var(--bg)}
  .sgcf-ntc-h{font-weight:700;color:var(--ink-soft)} .sgcf-ntc-h .sub{font-weight:500;color:var(--ink-faint);font-size:12px;margin-left:4px}
  .sgcf-ntc-t{font-weight:800;margin-top:6px} .sgcf-ntc-b{white-space:pre-wrap;margin-top:3px;color:var(--ink-soft);line-height:1.55}
  .sg-sign-view{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:12px;max-height:52vh;overflow-y:auto;background:var(--panel)}
  body[data-theme="dark"] .sgcf-perr,body[data-theme="dark"] .sgcf-iss{background:rgba(163,42,31,.18);border-color:rgba(163,42,31,.4);color:#F2A79B}
  /* [2026-09-20] 관리부 서식 고르기 모달 — 색은 계절색 변수만(파랑 하드코딩 없음) */
  .mgrf-wrap{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  @media(max-width:560px){ .mgrf-wrap{grid-template-columns:1fr} }
  .mgrf-card{display:flex;align-items:center;gap:11px;text-align:left;padding:13px 14px;border:1px solid var(--line);background:var(--panel);border-radius:12px;cursor:pointer;font-family:inherit;transition:border-color .12s,background .12s}
  .mgrf-card:hover{border-color:var(--navy);background:var(--line-soft)}
  .mgrf-ic{font-size:22px;flex:none;line-height:1}
  .mgrf-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
  .mgrf-tx b{font-size:14px;font-weight:800;color:var(--ink)}
  .mgrf-tx small{font-size:12px;color:var(--ink-soft)}
  .mgrf-tx em{font-style:normal;font-size:11px;font-weight:700;color:var(--navy-deep)}
  .mgrf-note{margin:12px 0 0;font-size:12px;color:var(--ink-faint);line-height:1.6}
  /* [2026-09-21] 관리부 검수 수정이력 — 증빙 대조 팝업에서 고친 항목 (색은 계절색 변수만) */
  .rcp-edits{--postit-c:var(--navy);margin-top:12px;padding:11px 13px;background:var(--line-soft);font-size:12.5px}   /* 띠·모서리 = 「포스트잇」 블록(바탕색 유지) · 테두리 없음(종전 1px 자리 = padding +1) */
  .rcp-edits>b{font-size:13px}
  .rcp-edits>span{color:var(--ink-faint);font-weight:600;margin-left:6px}
  .rcp-edits ul{margin:7px 0 0;padding-left:18px;line-height:1.75}
  .rcp-edits li{color:var(--ink-soft)}
  /* [2026-10-01 영수증 자동 분리] 경비기안 · 영수증 한 번에 올리기 — 작성창 줄 · 자동 분류 결과 목록 · 영수증/차계부 화면 위 한 줄 · 차계부 구분 칩 */
  .wf-tabs.w3{max-width:760px}
  .sp-launch{display:flex;align-items:center;gap:14px;border:1.5px dashed var(--navy-2);background:var(--panel);border-radius:12px;padding:12px 16px;margin-bottom:12px}
  .sp-launch-tx{flex:1;min-width:0}
  .sp-launch-tx b{display:block;font-size:14px;color:var(--ink);margin-bottom:3px}
  .sp-launch-tx span{font-size:12px;color:var(--ink-soft);line-height:1.5}
  .sp-launch .btn{flex:none}
  .sp-card .panel-h .sp-sub{margin-left:auto;font-size:13px;color:var(--ink-soft)}
  .sp-pend{color:#a15c00}
  .sp-sum{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0 14px}
  .sp-sum-b{border-radius:10px;padding:11px 13px;font-size:13px;color:var(--ink-soft);line-height:1.55}   /* 쓰임은 .car·.rcp 둘뿐(둘 다 포스트잇) — 테두리 없음(종전 1px 자리 = padding +1) */
  .sp-sum-b.car{--postit-c:#2d5fae}   /* 띠·바탕 = 「포스트잇」 블록 */
  .sp-sum-b.rcp{--postit-c:#1f8a5b}
  .sp-sum-b b{color:var(--ink)}
  .sp-sum-t{grid-column:1/-1;font-size:12px;color:var(--ink-faint)}
  table.sp-table td{vertical-align:middle}
  table.sp-table td.n,table.sp-table th.n{text-align:right}
  table.sp-table td small{display:block;font-size:11.5px;color:var(--ink-faint);font-weight:500}
  .sp-row.sp-flag td{background:var(--warn-soft)}
  .sp-row.sp-skip td{opacity:.45}
  .sp-row.sp-skip td.sp-mv{opacity:1}
  .sp-tab{display:inline-block;font-size:11px;font-weight:800;border-radius:6px;padding:2px 7px;margin-right:6px;color:#fff;vertical-align:middle}
  .sp-tab.car{background:#2d5fae}
  .sp-tab.rcp{background:#1f8a5b}
  .sp-kind{font-size:12.5px;padding:3px 6px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--ink);font-family:inherit}
  .sp-why{font-size:12.5px;color:var(--ink-soft)}
  .sp-why em{font-style:normal;color:var(--navy);font-weight:700}
  .sp-flagtx{margin-top:3px;font-size:12px;color:#8a5a00;font-weight:600;line-height:1.45}
  .sp-warn{margin-top:3px;font-size:12px;color:var(--accent-ink);font-weight:700;line-height:1.45}
  .sp-mv{white-space:nowrap}
  .sp-mv .btn{margin-left:4px}
  .sp-mv .btn.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .sp-act{display:flex;gap:10px;justify-content:flex-end;align-items:center;margin-top:16px}
  .sp-note{--postit-c:var(--navy-2);display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:11px 15px;margin-bottom:12px;font-size:13px;color:var(--ink-soft)}   /* 띠·바탕·모서리 = 「포스트잇」 블록 · 테두리 없음(종전 1px 자리 = padding +1) */
  .car-kindchip{display:inline-block;font-size:9px;font-weight:800;color:#fff;background:#2d5fae;border-radius:4px;padding:1px 5px;margin-bottom:3px}
  body[data-theme="dark"] .sp-flagtx{color:#f0c36a}
  body[data-theme="dark"] .sp-pend{color:#f0c36a}
  @media(max-width:780px){ .sp-sum{grid-template-columns:1fr} .sp-mv{white-space:normal} }

/* ═══ views.css ═══ */
/* ═══════════════════════════════════════════════════════
   파일   : common/views.css
   역할   : 기능별 후행 스타일 블록 5개(매출·글래스 대시보드·브리핑 등) — 4단계에서 각 모듈 css로 이관 예정
   의존   : 없음 (로드 순서: variables → common → views — 캐스케이드 보존, 순서 변경 금지)
   이력   : v206 모듈분리 2단계 — <style> 블록 6개 적출·내용 무변경 (2026-08-18) · 2026-10-16 정리 — 죽은·잉여 코드만 뺌, 동작 동일
   ═══════════════════════════════════════════════════════ */
/* ═══════════ [2단계 이식] 원위치: index.html 2번째 <style id="rev-module-styles"> ═══════════ */

/* ===== 매출 현황 모듈 (rev- 격리, 리터럴 헥스) ===== */
.rev-wrap{font-family:'Pretendard','Malgun Gothic','맑은 고딕',sans-serif;word-break:keep-all;color:#2A2740} /* v125 */
.rev-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:15px;border-bottom:2px solid var(--navy);margin-bottom:18px}
.rev-head .rev-lft{display:flex;align-items:center;gap:14px}
.rev-head img{height:34px;display:block}
.rev-head h2{margin:0;font-size:18px;font-weight:800;letter-spacing:-.3px;color:var(--navy)}
.rev-head .rev-sub2{margin:2px 0 0;font-size:11.5px;color:#6E6B85;font-weight:600}
.rev-prt{width:33px;height:33px;border:1px solid #E7E5F0;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--navy);flex:none}
.rev-prt:hover{background:#EEEDF6}
.rev-prt svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.rev-eyebrow{font-size:11px;font-weight:800;letter-spacing:.3px;color:var(--navy);margin:0 0 10px}
.rcv-card{background:#fff;border:1px solid #E7E5F0;border-radius:12px;padding:6px 14px 10px;overflow-x:auto}
.rcv-tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.rcv-tbl th{font-size:11px;color:#6E6B85;font-weight:700;text-align:left;padding:9px 8px;border-bottom:1px solid #EDEBF3}
.rcv-tbl td{padding:8px;border-bottom:1px solid #F4F2F8;vertical-align:middle}
.rcv-tbl tfoot td{border-bottom:none;padding-top:11px}
.rcv-tbl tr.rcv-late td{background:#fff7f7}
.rcv-inp{border:1px solid #E7E5F0;border-radius:8px;padding:6px 8px;font-size:12px;font-family:inherit;color:#241f33;background:#fff}
.rcv-inp:focus{outline:none;border-color:var(--navy)}
.rcv-b{font-size:10.5px;font-weight:800;padding:2px 9px;border-radius:20px;white-space:nowrap}
.rcv-b.done{background:#e2f3f1;color:#1f7a6e}.rcv-b.late{background:#fbe6e7;color:#C4534E}.rcv-b.plan{background:var(--sea-tint,#EEF4FF);color:var(--navy)}.rcv-b.none{background:#f0eff6;color:#8a86a0}
.aud-act{font-size:11px;font-weight:800;background:var(--sea-tint,#EEF4FF);color:var(--navy);border-radius:6px;padding:2px 8px;white-space:nowrap}
.rev-kpi{display:grid;grid-template-columns:1.55fr 1fr 1fr 1fr 1fr;gap:11px;margin-bottom:20px}
/* [v178 회차이력] 델타 배지 + 이력 바 + 스냅 카드 (매출 화면은 화이트 고정 팔레트라 하드코딩 색 유지) */
.rev-d{display:inline-block;font-size:11px;font-weight:800;margin:2px 0 4px;padding:2px 7px;border-radius:6px}
.rev-d.up{background:#E9F5EE;color:var(--navy-deep)}
.rev-d.dn{background:#FBE9E7;color:#C4534E}
.rev-d small{font-weight:600;opacity:.75}
.rev-dz{display:inline-block;font-size:10.5px;font-weight:600;color:#8A968F;margin:2px 0 4px}
.rev-histbar{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.rev-histbar select{border:1px solid #E7E5F0;border-radius:9px;padding:8px 11px;font-family:inherit;font-size:13px;font-weight:700;color:#1D1B2E;background:#fff}
.rev-snapcard{border:1px dashed #C9C5DD;border-radius:13px;padding:14px;margin-bottom:16px;background:#FBFAFE}
.rev-snaphd{font-size:13.5px;font-weight:800;color:#1D1B2E;margin-bottom:10px}
.rev-snaphd small{font-weight:600;color:#6E6B85;margin-left:6px}
.rev-k{background:#fff;border:1px solid #E7E5F0;border-radius:12px;padding:14px 15px;position:relative;overflow:hidden}
.rev-k .rl{font-size:11px;color:#6E6B85;font-weight:700;margin-bottom:7px}
.rev-k .rv{font-size:22px;font-weight:800;letter-spacing:-.5px;font-variant-numeric:tabular-nums;line-height:1}
.rev-k .ru{font-size:11.5px;font-weight:700;color:#6E6B85;margin-left:2px}
.rev-k .rbar{height:5px;border-radius:3px;background:#EDEBF3;margin-top:11px;overflow:hidden}
.rev-k .rbar i{display:block;height:100%;border-radius:3px}
.rev-k.hero{border:1.5px solid #E6AE60;background:linear-gradient(180deg,#FDF3E0,#fff 60%)}
.rev-k.hero .rl{color:#C4534E}
.rev-k.hero .rv{font-size:32px;color:#C4534E}
.rev-k.hero .rtag{position:absolute;top:13px;right:13px;font-size:10px;font-weight:800;color:#fff;background:#E6AE60;padding:3px 9px;border-radius:20px}
.rev-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:20px}
.rev-dc{background:#fff;border:1px solid #E7E5F0;border-radius:12px;padding:13px;cursor:pointer;transition:.15s}
.rev-dc:hover{border-color:var(--navy);box-shadow:0 4px 13px rgba(62,55,136,.1);transform:translateY(-2px)}
.rev-dc .rnm{font-size:13.5px;font-weight:800;color:var(--navy);margin-bottom:9px;display:flex;align-items:center;gap:6px}
.rev-dc .rdot{width:8px;height:8px;border-radius:50%;background:var(--navy)}
.rev-dc .rrev{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.4px;color:#2A2740}
.rev-dc .rrev small{font-size:11px;font-weight:700;color:#6E6B85;margin-left:2px}
.rev-dc .rrl{font-size:10px;color:var(--warn-ink,#8A5A12);font-weight:800;margin:1px 0 10px}
.rev-dc .rpb{height:6px;border-radius:3px;background:#EDEBF3;overflow:hidden}
.rev-dc .rpb i{display:block;height:100%;background:#E6AE60;border-radius:3px}
/* v125 작업반영: 매출 사업부 카드 리컬러 — 기존 5색 전부 블루 스펙트럼이라 제목 블루와 뭉개짐 (진권 지적) → 계열 분산 */
.rev-grid .rev-dc:nth-child(1) .rdot,.rev-grid .rev-dc:nth-child(1) .rpb i{background:var(--navy)}   /* 기지국 · 블루 */
.rev-grid .rev-dc:nth-child(2) .rdot,.rev-grid .rev-dc:nth-child(2) .rpb i{background:#4BB7A8}   /* 인빌딩 · 틸 */
.rev-grid .rev-dc:nth-child(3) .rdot,.rev-grid .rev-dc:nth-child(3) .rpb i{background:#9A7DDC}   /* 지하철 · 바이올렛 */
.rev-grid .rev-dc:nth-child(4) .rdot,.rev-grid .rev-dc:nth-child(4) .rpb i{background:#E7AC62}   /* 유선(T) · 앰버 */
.rev-grid .rev-dc:nth-child(5) .rdot,.rev-grid .rev-dc:nth-child(5) .rpb i{background:#DC809A}   /* 유선(B) · 로즈 */
.rev-dc .rpt{font-size:10px;color:#6E6B85;font-weight:700;margin-top:6px;display:flex;justify-content:space-between}
.rev-panel{background:#fff;border:1px solid #E7E5F0;border-radius:14px;padding:19px 21px}
.rev-pnhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px;padding-bottom:12px;border-bottom:1px solid #E7E5F0}
.rev-pnhead h3{margin:0;font-size:15px;font-weight:800;color:var(--navy);display:flex;align-items:center;gap:9px}
.rev-chip{font-size:11px;font-weight:800;color:#fff;background:var(--navy);padding:4px 11px;border-radius:20px}
.rev-pgrid{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}
.rev-blk h4{position:relative;font-size:12px;font-weight:800;color:#2A2740;margin:0 0 10px;padding-left:19px}   /* [2026-10-03 결정 1-②] 왼쪽 막대 → 포스트잇 조각 */
.rev-blk h4::before{content:"";position:absolute;left:1px;top:.2em;width:11px;height:11px;background:linear-gradient(rgba(255,255,255,.38) 35%,transparent 35%),#E6AE60;border-radius:1px;transform:rotate(var(--scrap-rot,-6deg));box-shadow:var(--scrap-sh,1px 2px 3px rgba(0,0,0,.18))}
.rev-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.rev-mini .rm{background:#FAFAFC;border:1px solid #E7E5F0;border-radius:9px;padding:9px 10px}
.rev-mini .rm .l{font-size:10px;color:#6E6B85;font-weight:700;margin-bottom:4px}
.rev-mini .rm .v{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.3px}
.rev-cbox{background:#FAFAFC;border:1px solid #E7E5F0;border-radius:10px;padding:13px 14px;margin-bottom:13px}
.rev-cbox .ct{font-size:11px;font-weight:800;color:#2A2740;margin-bottom:10px}
.rev-issue{background:#FAFAFC;border:1px solid #E7E5F0;border-radius:10px;padding:13px 15px}
.rev-issue ul{margin:0;padding:0;list-style:none}
.rev-issue li{position:relative;padding:8px 0 8px 19px;font-size:12px;color:#2A2740;border-bottom:1px dashed #E7E5F0;line-height:1.6}
.rev-issue li:last-child{border-bottom:none}
.rev-issue li:before{content:'';position:absolute;left:2px;top:13px;width:7px;height:7px;border-radius:2px;background:#E6AE60}
.rev-issue .none{color:#6E6B85;font-size:12px;padding:6px 0}
.rev-cmt{background:#EEEDF6;border-radius:10px;padding:12px 14px;margin-top:11px;font-size:12px;color:var(--navy);font-weight:600;line-height:1.65}
.rev-wrap svg text{font-family:'Pretendard','Malgun Gothic','맑은 고딕',sans-serif} /* v125 */
.nav-sub.rev-sub.open{max-height:360px}
.rev-wk{font-size:9px;font-weight:700;color:#6E6B85;margin-left:auto;background:#F1F0F7;padding:1px 7px;border-radius:10px;letter-spacing:-.2px}
.rev-upload{display:flex;align-items:center;justify-content:space-between;gap:14px;background:linear-gradient(180deg,#F6F5FB,#fff);border:1px solid #E7E5F0;border-radius:12px;padding:13px 16px;margin-bottom:14px}
.rev-up-info{display:flex;align-items:center;gap:12px}
.rev-up-info svg{width:30px;height:30px;stroke:var(--navy);fill:none;stroke-width:1.7;flex:none}
.rev-up-info b{display:block;font-size:14px;font-weight:800;color:var(--navy)}
.rev-up-info span{display:block;font-size:11px;color:#6E6B85;font-weight:600;margin-top:1px}
.rev-up-btn{background:var(--navy);color:#fff;font-size:13.5px;font-weight:800;padding:9px 18px;border-radius:9px;cursor:pointer;flex:none;transition:.15s}
.rev-up-btn:hover{background:#332C6E}
.rev-upstat{font-size:12px;font-weight:700;padding:9px 14px;border-radius:9px;margin-bottom:14px}
.rev-upstat.ok{background:#EAF6F1;color:#1F7A6E;border:1px solid #C5E6DC}
.rev-upstat.err{background:#F8E9EA;color:#C4534E;border:1px solid #E8C9CB}
@media print{.rev-upload,.rev-upstat{display:none!important}}
@media print{
  body.rev-printing .side,body.rev-printing .topbar{display:none!important}
  body.rev-printing .content{padding:0!important}
  body.rev-printing .rev-prt{display:none}
  body.rev-printing .rev-kpi,body.rev-printing .rev-grid,body.rev-printing .rev-panel,
  body.rev-printing .rev-cbox,body.rev-printing .rev-issue,body.rev-printing .rev-blk,
  body.rev-printing .rev-k,body.rev-printing .rev-dc,body.rev-printing .rev-mini{break-inside:avoid;page-break-inside:avoid}
  body.rev-printing .rev-head{page-break-after:avoid}
  @page{size:A4 portrait;margin:12mm}
}

/* ═══════════ [2단계 이식] 원위치: index.html 3번째 <style (무명)> ═══════════ */

/* v115: 챗봇 마크다운 렌더 + 문서카드 */
.ai-m.ai-md{white-space:normal;line-height:1.6}
.ai-m.ai-md>div{margin:0}
.ai-m.ai-md .ai-sp{height:7px}
.ai-m.ai-md .ai-h{font-weight:800;font-size:14px;margin:4px 0 2px;color:#1B2536}
.ai-m.ai-md ul,.ai-m.ai-md ol{margin:4px 0;padding-left:19px}
.ai-m.ai-md li{margin:2px 0}
.ai-m.ai-md code{background:rgba(20,25,40,.07);border-radius:4px;padding:1px 5px;font-size:12px;font-family:ui-monospace,Menlo,Consolas,monospace}
.ai-m.ai-md b{font-weight:800}
.ai-m.ai-md a{color:var(--navy);text-decoration:underline}
.ai-m.ai-md .ai-hr{border:0;border-top:1px solid rgba(20,25,40,.12);margin:8px 0}
.ai-m.ai-md .ai-q{border-left:3px solid #cfd6e4;padding:2px 0 2px 10px;color:#5f6b80;margin:4px 0;font-size:13.5px}
.ai-tbl{border-collapse:collapse;width:100%;margin:7px 0;font-size:13.5px;background:#fff;border-radius:9px;overflow:hidden;box-shadow:0 0 0 1px #e8e6f0}
.ai-tbl th{background:#f2f4f8;color:#3d4657;font-weight:800;text-align:left;padding:7px 10px;font-size:11.5px}
.ai-tbl td{padding:7px 10px;border-top:1px solid #eef0f4;color:#241f33}
.ai-doccards{display:flex;flex-direction:column;gap:9px;margin:9px 0 2px;align-self:stretch}
.ai-doccard{border:1px solid #e2e6ef;border-radius:13px;padding:12px 14px;background:#fff;box-shadow:0 3px 10px rgba(22,30,44,.06)}
.ai-doccard .dc-top{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.ai-doccard .dc-no{font-size:11px;font-weight:700;color:#8a86a0;font-family:ui-monospace,Consolas,monospace}
.ai-doccard .dc-st{margin-left:auto;font-size:10.5px;font-weight:800;padding:2px 9px;border-radius:20px}
.ai-doccard .dc-tt{font-size:14px;font-weight:800;color:#241f33;margin-bottom:4px}
.ai-doccard .dc-meta{font-size:12px;color:#6e6880}
.ai-doccard .dc-amt{font-weight:800;color:#241f33;margin-left:6px}
.ai-doccard .dc-cur{font-size:11.5px;color:#8a86a0;margin-top:4px}
.ai-doccard .dc-open{margin-top:10px;width:100%;background:#1B2536;color:#fff;border:0;border-radius:9px;padding:9px 0;font-size:13.5px;font-weight:700;cursor:pointer}
.ai-doccard .dc-open:hover{background:#2a3852}
/* v115: 결재알림 FAB (챗봇 위 세로 스택 · 결재함 아이콘 · 네이비 · 세게 진동) */
/* [v151] 알림 FAB CSS 제거됨(탑바 종으로 통합) */
#aiFab{position:fixed;right:26px;bottom:26px;width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,#E88B67,#E07258 55%,#CB6A4E);color:#fff;border:0;cursor:pointer;
  box-shadow:0 8px 22px rgba(224,114,88,.4);display:flex;align-items:center;justify-content:center;z-index:9000;
  transition:transform .18s,box-shadow .18s;animation:aiGlow 3s ease-in-out infinite}
#aiFab::before{content:"";position:absolute;inset:-4px;border-radius:50%;
  border:2px solid rgba(224,114,88,.45);animation:aiRing 2.4s ease-out infinite;pointer-events:none}
#aiFab:hover{animation:aiShake .55s ease-in-out infinite;box-shadow:0 12px 30px rgba(203,106,78,.5)}
#aiFab svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 3px rgba(0,0,0,.2))}
#aiFab .ai-emo{font-size:27px;line-height:1;filter:drop-shadow(0 1px 3px rgba(0,0,0,.25))}   /* [v229 챗봇아이콘] 🤖 — 진권 지시 */
.ai-head .ai-emo{font-size:24px;line-height:1;flex:none}
@keyframes aiRing{0%{transform:scale(.85);opacity:.9}75%,100%{transform:scale(1.35);opacity:0}}
@keyframes aiGlow{0%,100%{box-shadow:0 8px 22px rgba(224,114,88,.4)}50%{box-shadow:0 10px 26px rgba(232,139,103,.55)}}
@keyframes aiShake{0%,100%{transform:rotate(0) scale(1.08)}20%{transform:rotate(-11deg) scale(1.08)}40%{transform:rotate(9deg) scale(1.08)}60%{transform:rotate(-7deg) scale(1.08)}85%{transform:rotate(4deg) scale(1.08)}}
#aiDrawer{position:fixed;right:24px;bottom:90px;width:500px;max-width:calc(100vw - 32px);height:min(640px,calc(100vh - 124px));
  background:#fff;z-index:9001;border:1px solid var(--line);border-radius:24px;overflow:hidden;
  box-shadow:0 24px 70px rgba(22,30,44,.30);display:flex;flex-direction:column;
  transform:scale(.12);opacity:0;transform-origin:calc(100% - 35px) calc(100% + 47px);pointer-events:none;
  transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .22s ease}
#aiDrawer.open{transform:scale(1);opacity:1;pointer-events:auto}
body.locked #aiFab,body.locked #aiDrawer{display:none!important}
.ai-head{padding:16px 20px;background:linear-gradient(135deg,#E88B67,#E07258 55%,#CB6A4E);color:#fff;
  display:flex;align-items:center;gap:10px}
.ai-head b{font-size:16px}
.ai-head .sub{font-size:12px;opacity:.75;margin-top:1px}
.ai-close{margin-left:auto;background:rgba(255,255,255,.15);border:0;color:#fff;border-radius:8px;
  width:28px;height:28px;cursor:pointer;font-size:15px}
#aiMsgs{flex:1;overflow-y:auto;padding:16px;background:var(--bg);display:flex;flex-direction:column;gap:10px}
.ai-m{max-width:86%;padding:11px 15px;border-radius:18px;font-size:14.5px;line-height:1.65;white-space:pre-wrap;word-break:break-word}
.ai-m.user{align-self:flex-end;background:#E07258;color:#fff;border-bottom-right-radius:6px}
.ai-m.bot{align-self:flex-start;background:#fff;border:1px solid var(--line);color:var(--ink);border-bottom-left-radius:6px}
.ai-src{align-self:flex-start;font-size:10.5px;color:var(--ink-faint);margin:-4px 0 0 6px}
.ai-hello{font-size:14px;color:var(--ink-soft);background:#fff;border:1px dashed var(--line);border-radius:16px;padding:12px 14px;line-height:1.7}
.ai-chips{display:flex;flex-direction:column;gap:7px;align-items:flex-start}
.ai-chip{border:1px solid #f4cfca;background:#fff;color:var(--ink);font-size:14px;font-weight:600;
  padding:9px 15px;border-radius:20px;cursor:pointer;font-family:inherit;transition:all .15s;text-align:left;line-height:1.5}
.ai-chip:hover{border-color:#E07258;color:#c73e22;background:#fdeae6}
.ai-load{align-self:flex-start;display:flex;gap:4px;padding:12px 14px}
.ai-load i{width:7px;height:7px;border-radius:50%;background:#E07258;animation:aiB 1.1s infinite}
.ai-load i:nth-child(2){animation-delay:.18s}.ai-load i:nth-child(3){animation-delay:.36s}
@keyframes aiB{0%,70%,100%{opacity:.25;transform:translateY(0)}35%{opacity:1;transform:translateY(-4px)}}
.ai-foot{padding:12px;border-top:1px solid var(--line);display:flex;gap:8px;background:#fff}
#aiInput{flex:1;border:1px solid var(--line);border-radius:25px;padding:14px 18px;font-size:14.5px;resize:none;
  height:50px;font-family:inherit;outline:none}
#aiInput:focus{border-color:#E07258}
#aiSend{background:linear-gradient(135deg,#f2825f,#E07258);border:0;color:#fff;border-radius:50%;width:50px;height:50px;flex:none;cursor:pointer;display:flex;
  align-items:center;justify-content:center}
#aiSend:disabled{opacity:.45;cursor:default}
#aiSend svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ═══════════ [2단계 이식] 원위치: index.html 4번째 <style id="v166GlassCss"> ═══════════ */

/* 오로라 배경 — 스크롤하지 않는 부모(.main)에 깐다.
   ⚠️ 여기까지 온 이유(둘 다 진권이 실사용에서 잡음):
     1차: .d2-dash에 깔았더니 콘텐츠 높이만큼만 칠해져 아래로 스크롤 시 빈칸이 드러남.
     2차: #content(=스크롤러)에 옮겼더니 휠을 굴릴 때마다 배경 전체를 재도색 → 스크롤이 뚝뚝 끊김.
   결론: 스크롤하지 않는 .main에 칠하면 페인트 1회로 끝나고, #content는 투명하게 비워 스크롤을 가볍게 한다.
   블롭도 별도 의사요소 대신 그라데이션 레이어로 합쳤다 — 요소가 늘면 스크롤마다 리페인트 대상이 늘고,
   실제로 컨테이너 밖으로 삐져나가 가로 스크롤바까지 만들던 문제도 함께 사라진다. */
.main.b4g-bg{
  background:
    radial-gradient(420px 420px at calc(100% - 30px) -70px, rgba(var(--sea-rgb,62,169,116),.16), transparent 70%),
    radial-gradient(380px 380px at -30px calc(100% + 50px), color-mix(in srgb,var(--sea-g2,#2E86E8) 20%,transparent), transparent 70%),
    linear-gradient(135deg,var(--sea-tint,#DFF3E7) 0%,var(--sea-bg,#F2F8F1) 40%,var(--sea-hover,#E4F0F5) 75%,var(--sea-tint,#EAF6EC) 100%);   /* [2026-10-18 계절 전면 2차] 민트·파랑 → 계절 */
}
#content.b4g{background:transparent}                      /* 스크롤러는 비워둔다 = 스크롤 시 재도색 없음 */
#content.b4g .d2-dash{background:transparent;position:relative}
#content.b4g .dash-top,
#content.b4g .dash-editbar,
#content.b4g .grid-stack{position:relative;z-index:1}
/* 유리 카드 — 기존 레이아웃/라운드는 그대로 두고 표면 재질만 교체
   ⚠️ 히어로/미니히어로는 v151 날씨 씬이 background를 !important로 잡는다(917~926행).
      날씨 클래스가 붙은 동안엔 유리가 지고 backdrop-filter만 GPU를 먹으므로 :not()으로 제외 —
      날씨 정보를 못 받아 씬이 없을 때만 유리로 뜬다. */
#content.b4g .d2-hero:not([class*="wx-"]),
#content.b4g .d2-mini.d2-heroS:not([class*="wx-"]),
#content.b4g .d2-panel,
#content.b4g .d2-mini:not(.d2-heroS){
  /* ⚠️ backdrop-filter 금지 (진권 "휠 스크롤이 뚝뚝 끊긴다" — 내가 만든 성능 버그)
     스크롤 프레임마다 위젯 10여 개의 뒷배경을 재샘플링·재블러 → 프레임 예산 초과.
     게다가 뒷배경이 '매끈한 오로라 그라데이션'이라 블러할 디테일이 없어 시각적 이득도 사실상 0.
     → 반투명 화이트 + 위→아래 미세 하이라이트로 유리질감만 남기고 실시간 블러는 제거(비용 0). */
  background:linear-gradient(180deg,rgba(255,255,255,.74),rgba(255,255,255,.52));
  border-color:rgba(255,255,255,.8);
  box-shadow:0 8px 24px rgba(40,80,60,.08), inset 0 1px 0 rgba(255,255,255,.65);
}
/* 유리 위에서 옅은 구분선은 묻히므로 살짝 진하게 */
#content.b4g .d2-ali,
#content.b4g .d2-prow{border-color:rgba(28,43,34,.07)}
/* 다크 — 딥그린 오로라 + 스모크 글래스 */
body[data-theme="dark"] .main.b4g-bg{
  background:
    radial-gradient(420px 420px at calc(100% - 30px) -70px, rgba(var(--sea-dk-rgb,141,180,255),.16), transparent 70%),
    radial-gradient(380px 380px at -30px calc(100% + 50px), color-mix(in srgb,var(--sea-g2,#2E86E8) 13%,transparent), transparent 70%),
    linear-gradient(135deg,#1F2540 0%,#1C2130 45%,#1E2438 78%,#1C2130 100%);   /* [v229 약한다크] 딥그린 오로라 → 미드나잇 */
}
body[data-theme="dark"] #content.b4g,
body[data-theme="dark"] #content.b4g .d2-dash{background:transparent}
body[data-theme="dark"] #content.b4g .d2-hero:not([class*="wx-"]),
body[data-theme="dark"] #content.b4g .d2-mini.d2-heroS:not([class*="wx-"]),
body[data-theme="dark"] #content.b4g .d2-panel,
body[data-theme="dark"] #content.b4g .d2-mini:not(.d2-heroS){
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.04));
  border-color:rgba(255,255,255,.12);
  box-shadow:0 8px 24px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06);
}
body[data-theme="dark"] #content.b4g .d2-ali,
body[data-theme="dark"] #content.b4g .d2-prow{border-color:rgba(255,255,255,.07)}
/* 접근성 — 투명도 민감 사용자는 불투명 카드로 */
@media (prefers-reduced-transparency:reduce){
  #content.b4g .d2-hero,#content.b4g .d2-panel,#content.b4g .d2-mini{
    background:var(--panel);box-shadow:0 8px 24px rgba(40,80,60,.08)}
}

/* ═══════════ [2단계 이식] 원위치: index.html 5번째 <style id="v166BriefCss"> ═══════════ */

/* [v166 브리핑] 오버레이 + HUD 모달 (bf- 네임스페이스, 기존 스타일 무간섭) */
#bfOv{position:fixed;inset:0;z-index:900;background:rgba(16,28,21,.48);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s ease}
#bfOv.on{opacity:1;pointer-events:auto}
.bf-hud{position:relative;width:560px;max-width:92vw;background:rgba(252,254,252,.95);border-radius:6px;padding:28px 32px;   /* [v179 브리핑여백] 하단 24→28px — 우측 32에 비해 버튼이 모서리에 붙어 보였다 */box-shadow:0 24px 70px rgba(10,30,20,.35);transform:translateY(14px) scale(.97);opacity:0;transition:transform .45s cubic-bezier(.2,.9,.3,1),opacity .4s ease;font-family:inherit}
#bfOv.on .bf-hud{transform:none;opacity:1}
/* [2026-10-19 사용자 ①안] 업무 요약 머리띠 = 로그인 화면과 같은 그날 문양(login-scene.js LG_TODAY · briefing.js bfBandHtml) — 로그인에서 첫 화면으로 이어진 느낌 */
.bf-band{position:absolute;left:0;right:0;top:0;height:40px;border-radius:6px 6px 0 0;overflow:hidden;background:var(--bf-band-bg,var(--sea-bg,#F5F9F6));pointer-events:none}
.bf-band svg{display:block;width:100%;height:100%}
.bf-hud:has(.bf-band){padding-top:60px}   /* 띠 40px(briefing.js BF_BAND_H) + 20 */
.bf-hud:has(.bf-band) .bf-pop{top:90px}   /* ⚙️ 팝오버도 띠만큼 내린다(종전 58 = 위 여백 28 + 30) — 26px 띠 때도 톱니 아래를 6px 덮었다 */
body[data-theme="dark"] .bf-band{opacity:.72}
/* [v171 톤다운] 구 4모서리 코너 마크(.bf-hud::before/::after + .bf-ck) 제거 —
   조준선처럼 보이는 장식이라 "상황실 HUD" 인상의 절반을 차지했다. 리포트는 모서리에 표식을 달지 않는다.
   ⚠️ .bf-ck 요소도 마크업에서 함께 사라졌으므로 이 셀렉터를 남기면 죽은 코드가 된다. */
/* [v171 톤다운] 머리글 = 날짜 · 수신 · 문서명 3단. 구 "MORNING BRIEF · F2 WORKS"(영문 대문자 +
   깜빡이는 점)는 상황실 HUD 느낌이라 리포트 톤과 충돌해 교체했다. */
.bf-eye{display:flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;letter-spacing:.4px;color:#5a6a5e;margin-bottom:11px}
@keyframes bfBlink{0%,100%{opacity:1}50%{opacity:.25}}
.bf-eye .bf-tm{margin-left:auto;letter-spacing:.5px;color:#7c8a80;font-weight:700}
body[data-theme="dark"] .bf-eye{color:#B2B9CC}
.bf-gear{flex:none;font-size:13px;padding:2px 5px;margin-left:6px;opacity:.55;border-radius:6px;cursor:pointer;border:none;background:none;font-family:inherit}
.bf-gear:hover,.bf-gear.on{opacity:1;background:#e2f3ea}
/* [v171 톤다운] 구 인사말 타이핑(.bf-greet/.bf-caret)·본문 3줄(.bf-sub)·세로 카드 리스트
   (.bf-items/.bf-card/.bf-tag/.bf-num/.bf-emptybx) 전량 제거 — 1-H는 히어로 + 미니타일 3칸 구조라
   같은 정보를 .bf-hero / .bf-lead / .bf-tiles 가 대신한다. 남겨두면 죽은 셀렉터가 된다. */
/* [v179 브리핑여백] 타일 바로 밑에 간격 0으로 붙어 있어 [닫기]가 타일에 얹힌 것처럼 보였다(진권 스샷).
   타일 gap 8 · 리드문 13과 어울리는 16px로 띄운다. */
.bf-foot{display:flex;align-items:center;gap:12px;margin-top:16px}
/* ===== [v182 제증명] ===== */
/* [v200] 발급 폼이 340px 고정이라 답답했다(진권 지적) — 넘치진 않았지만 버튼·안내문구가 꽉 차 보였다.
   폼을 넓히고 미리보기는 그만큼 줄인다. 미리보기는 A4 축소본이라 520px 이상이면 읽는 데 지장 없다.
   ⚠️ 고정폭 대신 clamp 로 줘서 창을 줄이면 폼이 먼저 줄고, 더 좁아지면 아래 미디어쿼리가 세로로 접는다. */
.cert-grid{display:grid;grid-template-columns:minmax(0,384px) minmax(0,1fr);gap:18px;align-items:start}
.cert-left{display:contents}   /* 보통 화면: 폼 | 미리보기 · 명단(승인 대기 · 내 발급 신청 · 발급대장)은 아래 한 줄 */
.cert-left > .cert-form{grid-column:1;grid-row:1}
.cert-pv{grid-column:2;grid-row:1}
.cert-lists{grid-column:1 / -1;grid-row:2;min-width:0}
.cert-lists > .card:first-child{margin-top:0!important}
.cert-gonote{margin:10px 0 0;font-size:11.5px;font-weight:600;color:var(--ink-faint);display:flex;flex-direction:column;gap:2px}
@media (min-width:1600px){   /* [2026-10-16 사용자 C1] 왼쪽 = 발급 폼(입력칸 2열) + 그 아래 명단(마지막 칸이 용지 아래 끝까지) · 오른쪽 = A4 */
  .cert-grid{grid-template-columns:minmax(560px,1fr) minmax(0,max(520px,calc((100vh - 190px) * .7071)));align-items:stretch}
  /* ↑ [2026-10-19 사용자 「제증명발급 메뉴가 깨져있다」] 세로로 긴 창(1860×2024)에서 A4 폭이 높이만 보고 1297px 가 돼 폼이 215px 로 눌리고 발급 버튼이 넘쳤다
     → 폼 최소 560px 를 먼저 지키고 A4 는 남는 폭 안에서만(minmax(0, …)) · 보통 창(2560×1330 · 1920×1080)은 그대로 */
  .cert-left{display:flex;flex-direction:column;gap:14px;min-width:0}
  .cert-left > .cert-form,.cert-pv,.cert-lists{grid-column:auto;grid-row:auto}
  .cert-fg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:22px}
  .cert-fg .wide{grid-column:1 / -1}
  .cert-go{display:flex;align-items:center;gap:18px}
  .cert-go .cert-issue{width:auto;min-width:320px;margin-top:0;padding:12px 22px}
  .cert-go .cert-gonote{margin:0}
  .cert-lists{flex:1 0 auto;display:flex;flex-direction:column}
  .cert-lists > .card:last-child{flex:1 0 auto}
}
/* ⚠️ [v200] 발급 폼 카드에 안쪽 여백이 **0** 이었다(진권 지적: "좌우가 딱 붙어 잘린 느낌").
   실측하니 내용이 카드 테두리에서 1px 떨어져 있었다 — 옆의 미리보기는 26/28px 인데 폼만 맨살이었다.
   .card 기본 padding 이 0 이라 여백을 준 화면들이 각자 인라인으로 넣고 있었고, 이 카드는 그걸 안 했다. */
.cert-form{padding:20px 22px 22px}
.cert-form .panel-h{margin-bottom:14px}
.cert-seg{display:flex;gap:6px}
.cert-seg button{flex:1;border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:10px 0;font-family:inherit;font-size:13px;font-weight:800;color:var(--ink-soft);cursor:pointer}
.cert-seg button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.cert-issue{width:100%;margin-top:6px;border:none;border-radius:10px;background:var(--navy);color:#fff;font-family:inherit;font-size:14px;font-weight:800;padding:12px 0;cursor:pointer}
.cert-issue:hover{background:var(--navy-deep)}
/* 증명서 미리보기는 '종이'다 — 다크모드에서도 흰 배경을 유지하는 게 맞다(인쇄물과 같아야 함)
   [2026-10-16 사용자 「한 화면에 차게 · A4 용지로 크게」] A4 한 장(210×297) — 폭 = 화면 높이에 한 장이 다 들어가는 크기(최소 520px · 칸 폭을 넘지 않음)
   글자·여백은 PDF(p140_cert.py _cert_html: 여백 24/22mm · 본문 12.5pt · 제목 26pt …)를 용지 폭 비율로 옮긴 값 — 바탕 글자 = 2.1cqw(12.5pt ÷ 210mm), 나머지는 em */
.cert-pv{min-width:0}
.cert-prev{container-type:inline-size;position:relative;aspect-ratio:210/297;width:min(100%,max(520px,calc((100vh - 190px) * .7071)));margin:0 auto;background:#fff;color:#111;box-shadow:0 1px 3px rgba(0,0,0,.08),0 8px 28px rgba(0,0,0,.10);overflow:hidden;word-break:keep-all;overflow-wrap:anywhere}
.cert-prev .ct-page{position:absolute;inset:0;padding:5.44em 4.99em;font-size:2.1cqw;line-height:1.8}
.cert-prev .ct-title{text-align:center;font-size:2.08em;font-weight:800;letter-spacing:.55em;margin:1.09em 0 1.53em;text-wrap:balance}
.cert-prev table.ct-tbl{width:100%;border-collapse:collapse;margin-bottom:2.72em}
.cert-prev table.ct-tbl th{width:8.62em;text-align:left;font-weight:600;padding:.3em .24em;vertical-align:top;white-space:nowrap}
.cert-prev table.ct-tbl td{padding:.3em .48em;vertical-align:top}
.cert-prev .ct-body{text-align:center;font-size:1.08em;letter-spacing:.05em;margin:2.52em 0 2.94em}
.cert-prev .ct-date{text-align:center;font-size:1.04em;margin:0 0 2.62em}
.cert-prev .ct-co{position:relative;width:min(100%,24.94em);margin:0 auto;text-align:left;line-height:2}
.cert-prev .ct-co b{display:inline-block;width:5.9em;font-weight:600}
.cert-prev .ct-in{position:absolute;right:2.49em;color:#8A968F}
.cert-prev .ct-note{position:absolute;left:0;right:0;bottom:8em;font-size:.68em;color:#8A968F;text-align:center}   /* PDF 꼬리말 자리(아래 여백 위) */
.cert-form select,.cert-form input{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;font:inherit;font-size:13.5px;background:var(--card,#fff);color:var(--ink)}
/* [v200] 900 → 1150px. 계산 근거:
   폼 384 + gap 18 + 미리보기 최소 420 = 822px 의 콘텐츠 폭이 필요하고,
   콘텐츠 폭 ≈ 뷰포트 − 사이드바 270 − 여백 60 이므로 뷰포트로는 약 1152px.
   구 900px 기준이면 그 위 구간(뷰포트 900~1150)에서 미리보기가 300px 안팎으로 짜부라져
   증명서 표가 깨진 채로 보였다. 그 전에 세로로 접는다. */
@media (max-width:1150px){ .cert-grid{grid-template-columns:1fr} .cert-pv{grid-column:1;grid-row:2} .cert-lists{grid-row:3} .cert-prev{width:min(100%,794px)} }   /* 한 줄: 폼 → 미리보기 → 명단 */
@media (max-width:600px){ .cert-prev{aspect-ratio:auto} .cert-prev .ct-page{position:relative;font-size:max(2.1cqw,10px)} }   /* 폰: 글자 최소 10px · 용지 높이는 내용만큼 */
/* ═══ [v180 일정폰뷰] 세로 타임라인 — @media로 통째 감싸 데스크톱엔 단 1바이트도 적용되지 않게 한다 ═══ */
@media (max-width:780px){
  /* ⚠️ [v181 감사수정] .content{overflow-y:auto}(384줄)가 걸려 있으면 #content가 '스크롤 컨테이너'가 되고
     그 안의 position:sticky는 뷰포트가 아니라 #content의 스크롤포트에 묶인다. .app이 min-height:100vh라
     #content는 내부 스크롤이 안 생기므로 스크롤포트가 문서와 함께 통째로 올라가 sticky가 그냥 흘러 나갔다
     (컴팩트 헤더도 날짜 헤더도 안 붙음 = "지금 며칠을 보고 있는지"가 사라짐). 폰에서만 해제한다.
     ⚠️ 좌우 패딩도 폰에서 30px씩 먹어 360px 화면에서 카드 실폭이 300px로 줄었다 → 14px로. */
  #content{overflow:visible;padding-left:14px;padding-right:14px}
  /* [v181] #content의 상단 패딩 상쇄는 루트가 맡는다 — sticky 요소에 음수 margin-top을 주면
     그만큼 고정 위치가 밀려(실측 58px 지정에 66px 착지) 탑바 아래 틈이 생긴다. */
  .scp-root{padding:0 0 40px;margin-top:-20px}
  .scp-top{position:sticky;top:var(--scp-topgap,58px);z-index:15;   /* [v181] 탑바도 sticky top:0(58px)이라 0으로 두면 겹친다 */background:var(--panel);border-bottom:1px solid var(--line);padding:10px 14px 8px;margin:0 -14px 10px}
  .scp-t1{display:flex;align-items:center;gap:8px}
  .scp-t1 b{font-size:16px;font-weight:800}
  .scp-sc{font-size:11px;font-weight:800;color:var(--navy);background:var(--panel-2,#EEF5F0);border-radius:20px;padding:3px 9px}
  /* 터치 타깃 44px — 현장에서 장갑 끼고 누르는 화면이라 28px짜리 버튼은 오조작이 난다(실측 후 수정) */
  .scp-ib{margin-left:auto;border:1px solid var(--line);background:var(--panel);border-radius:9px;min-height:44px;padding:0 14px;font-family:inherit;font-size:12.5px;font-weight:800;color:var(--ink-soft);cursor:pointer}
  .scp-ib+.scp-ib{margin-left:0}
  .scp-chip{min-height:38px}
  .scp-seg button{min-height:44px}
  .scp-add{min-height:44px}
  .scp-drawer{display:none;padding-top:9px}
  .scp-drawer.on{display:block}
  .scp-seg{display:flex;gap:6px;margin-bottom:8px}
  .scp-seg button{flex:1;border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:9px 0;font-family:inherit;font-size:12.5px;font-weight:800;color:var(--ink-soft);cursor:pointer}
  .scp-seg button.on{background:var(--navy);border-color:var(--navy);color:#fff}
  .scp-chips{display:flex;flex-wrap:wrap;gap:6px}
  .scp-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:20px;padding:5px 11px;font-size:11.5px;font-weight:700;color:var(--ink-soft);cursor:pointer}
  .scp-chip i{width:7px;height:7px;border-radius:50%;display:inline-block}
  .scp-chip.off{opacity:.38}
  .scp-edge{text-align:center;font-size:11px;font-weight:600;color:var(--ink-faint);padding:10px 0}
  .scp-day{margin-bottom:6px}
  .scp-day.today .scp-dnum{background:var(--navy);color:#fff;border-radius:9px;padding:1px 8px}
  .scp-dayh{position:sticky;top:var(--scp-dayhtop,52px);z-index:14;   /* [v181] 탑바 실측값 주입 */display:flex;align-items:center;gap:7px;background:var(--bg,#F6F8F7);padding:8px 2px;border-bottom:1px solid var(--line-soft)}
  .scp-dnum{font-size:16px;font-weight:800}
  .scp-dw{font-size:12px;font-weight:700;color:var(--ink-faint)}
  .scp-tday{font-size:10px;font-weight:800;color:#fff;background:var(--navy);border-radius:20px;padding:2px 7px}
  .scp-holi{font-size:10px;font-weight:800;color:#fff;background:#C4534E;border-radius:20px;padding:2px 7px}
  .scp-cnt{margin-left:auto;font-size:11px;font-weight:700;color:var(--ink-faint)}
  .scp-lvwrap{display:flex;flex-wrap:wrap;gap:5px;padding:7px 2px 0}
  .scp-lv{font-size:11px;font-weight:700;border:1px solid;border-radius:20px;padding:3px 9px;background:var(--panel)}
  .scp-rows{position:relative;padding:8px 0 4px 62px}
  .scp-rows::before{content:'';position:absolute;left:52px;top:0;bottom:0;width:2px;background:var(--line)}
  .scp-row{position:relative;margin-bottom:9px}
  .scp-row::before{content:'';position:absolute;left:-14px;top:14px;width:9px;height:9px;border-radius:50%;background:var(--sc,#2E86E8);box-shadow:0 0 0 3px var(--bg,#F6F8F7)}
  .scp-row.past{opacity:.46}
  .scp-time{position:absolute;left:-62px;top:11px;width:46px;text-align:right;font-size:12px;font-weight:800;color:var(--ink-soft);font-variant-numeric:tabular-nums}
  .scp-card{--postit-c:var(--sc,#2E86E8);padding:12px 14px;cursor:pointer}   /* 띠·바탕·모서리 = 맨 끝 「포스트잇」 블록 · 테두리 없음(종전 1px 자리 = padding +1) */
  .scp-row.next .scp-card{box-shadow:0 0 0 1px var(--navy),0 2px 12px rgba(var(--sea-rgb,27,111,245),.16)}   /* 다음 일정 = 계절색 바깥 링(띠까지 감쌈) + 빛 · 띠는 분류색 그대로 */
  .scp-tt{font-size:14.5px;font-weight:800;line-height:1.45;word-break:keep-all}
  .scp-nexttag{margin-left:6px;font-size:10px;font-weight:800;color:#fff;background:var(--navy);border-radius:20px;padding:2px 7px;vertical-align:2px}
  .scp-meta{font-size:12px;font-weight:600;color:var(--ink-faint);margin-top:3px}
  .scp-body{margin-top:9px;padding-top:9px;border-top:1px dashed var(--line);font-size:13px;font-weight:600;line-height:1.7;color:var(--ink-soft);word-break:keep-all}
  .scp-nomemo{color:var(--ink-faint)}
  .scp-open{display:block;margin-top:9px;border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:9px 0;width:100%;font-family:inherit;font-size:12.5px;font-weight:800;color:var(--navy);cursor:pointer}
  .scp-now{position:relative;height:0;margin:5px 0 12px}
  .scp-now::before{content:'';position:absolute;left:-18px;right:0;top:0;height:2px;background:#C4534E}
  .scp-now span{position:absolute;left:-56px;top:-8px;font-size:10px;font-weight:800;color:#fff;background:#C4534E;border-radius:20px;padding:2px 7px;white-space:nowrap}
  .scp-none{font-size:12.5px;font-weight:600;color:var(--ink-faint);padding:10px 2px}
  .scp-add{width:100%;margin-top:4px;border:1px dashed var(--line);background:transparent;border-radius:10px;padding:10px 0;font-family:inherit;font-size:12.5px;font-weight:800;color:var(--ink-faint);cursor:pointer}
  .scp-slim{display:flex;align-items:center;gap:7px;padding:9px 2px;border-bottom:1px solid var(--line-soft);font-size:12.5px;font-weight:700;color:var(--ink-faint);cursor:pointer}
  .scp-slim b{font-size:13.5px;color:var(--ink-soft)}
  .scp-slim span{margin-left:auto;font-size:11.5px;font-weight:600}
}
/* ===== [v180 근태확인함] .ibx3-*로 안 덮이는 것만 정의 — 레이아웃은 결재함 3칸을 그대로 쓴다 ===== */
#aackRoot .aack-chip{display:inline-block;font-size:10.5px;font-weight:800;color:#fff;border-radius:20px;padding:2px 8px;margin-right:7px;flex:none}
#aackRoot .aack-pos{font-size:11.5px;font-weight:700;color:var(--ink-faint)}
#aackRoot .aack-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:-1px}
#aackRoot .aack-state{border-radius:10px;padding:11px 14px;font-size:13px;font-weight:700;margin-bottom:14px;word-break:keep-all;line-height:1.6}
#aackRoot .aack-state.wait{background:var(--panel-2,#F2F8F4);border:1px solid var(--line);color:var(--ink-soft)}
#aackRoot .aack-state.ack{background:#E9F5EE;border:1px solid #BFE0D2;color:var(--navy-deep)}
#aackRoot .aack-state.ask{background:#FBE9E7;border:1px solid #F0C9C4;color:#8E3B36}
#aackRoot .aack-state .memo{margin-top:6px;font-size:12.5px;font-weight:600;opacity:.9}
#aackRoot .aack-grid{display:flex;gap:22px;padding:12px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);margin-bottom:14px}
#aackRoot .aack-grid .k{display:block;font-size:11px;font-weight:700;color:var(--ink-faint);margin-bottom:3px}
#aackRoot .aack-grid b{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums}
#aackRoot .aack-rsnbox{--postit-c:var(--navy);background:var(--panel-2,#F7FAF8);padding:12px 15px}   /* 띠·모서리 = 맨 끝 「포스트잇」 블록(바탕색 유지) */
#aackRoot .aack-rsnbox .k{font-size:11px;font-weight:800;color:var(--ink-faint);margin-bottom:5px}
#aackRoot .aack-rsnbox .v{font-size:14px;font-weight:700;line-height:1.7;word-break:keep-all}
#aackRoot .aack-audit{margin-top:14px;font-size:11px;font-weight:600;color:var(--ink-faint);word-break:keep-all}
#aackRoot #aackMemo{flex:1;min-width:0;border:1px solid var(--line);border-radius:9px;padding:9px 12px;font-family:inherit;font-size:13px;outline:none;color:var(--ink)}
#aackRoot #aackMemo:focus{border-color:var(--navy-2,var(--navy-2))}
body[data-theme="dark"] #aackRoot .aack-state.ack{background:rgba(var(--sea-dk-rgb,141,180,255),.18);border-color:rgba(var(--sea-dk-rgb,141,180,255),.3);color:var(--sea-dk2,#B7D2FF)}
body[data-theme="dark"] #aackRoot .aack-state.ask{background:rgba(196,83,78,.18);border-color:rgba(196,83,78,.32);color:#E88F86}
body[data-theme="dark"] #aackRoot .aack-rsnbox{background:rgba(255,255,255,.04)}
/* [v179 마스킹] 가려진 금액 — 마스킹 레드. 폭이 들쭉날쭉하면 표가 흔들려 tabular-nums로 고정폭 */
.mask-amt{color:#C4534E;letter-spacing:.06em;font-variant-numeric:tabular-nums;font-weight:800;cursor:help}
body[data-theme="dark"] .mask-amt{color:#E88F86}
.mask-note{display:flex;align-items:center;gap:8px;margin:0 0 14px;padding:9px 13px;border-radius:10px;background:#FBE9E7;border:1px solid #F0C9C4;color:#8E3B36;font-size:12.5px;font-weight:700;word-break:keep-all}
body[data-theme="dark"] .mask-note{background:rgba(196,83,78,.16);border-color:rgba(196,83,78,.3);color:#E88F86}
/* [v171 톤다운] 하단은 [닫기] 하나만. 구 [업무 시작]+[건너뛰기] 두 버튼은 둘 다 '그냥 닫기'라
   사실상 같은 일을 하는 중복이었다(이동 기능 없음). 화면 이동은 위 미니타일이 맡는다.
   ⚠️ ESC=건너뛰기 키 동작은 그대로 살아 있다 — 버튼만 없앤 것. */
.bf-fnote{flex:1;min-width:0;font-size:11.5px;font-weight:600;color:#5a6a5e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bf-ok{flex:none;padding:11px 20px;border-radius:9px;background:var(--navy);color:#fff;font-size:13.5px;font-weight:800;letter-spacing:.3px;border:none;cursor:pointer;font-family:inherit;opacity:0;transition:opacity .3s}
.bf-ok.in{opacity:1}
.bf-ok:hover{background:var(--navy-deep)}
.bf-ok kbd{font-family:inherit;font-size:10.5px;font-weight:700;background:rgba(255,255,255,.22);border-radius:4px;padding:1.5px 6px;margin-left:7px;vertical-align:1px}
body[data-theme="dark"] .bf-fnote{color:#B2B9CC}
/* [v167] top 42→58px — 팝오버가 톱니(⚙️)를 덮어 다시 못 누르던 문제(진권 스샷) */
.bf-pop{position:absolute;top:58px;right:14px;z-index:6;width:230px;background:#fff;border:1px solid #e2e8e3;border-radius:12px;padding:12px 15px;box-shadow:0 16px 44px rgba(10,30,20,.18)}
.bf-pop::before{content:'';position:absolute;top:-7px;right:16px;width:12px;height:12px;background:#fff;border-left:1px solid #e2e8e3;border-top:1px solid #e2e8e3;transform:rotate(45deg)}
body[data-theme="dark"] .bf-pop::before{background:#262C3D;border-color:rgba(255,255,255,.12)}
.bf-pop h4{font-size:11px;font-weight:800;color:#7c8a80;letter-spacing:.5px;margin:0 0 7px}
/* [v171 톤다운] 구 토글 행(.bf-oprow/.bf-lb)과 스위치(.bf-sw) 제거 — 해당 설정 자체가 없어졌다.
   [v172 정리] 다크 대응(.bf-oprow/.bf-sw)과 .bf-urgent 잔여 규칙 2건도 함께 제거 — bf-urgent 클래스는
   v171에서 마크업에서 빠졌다(경보는 이제 타일 하나에만 표시). */
.bf-offbtn{width:100%;margin-top:2px;padding:8px;border-radius:8px;background:#f7f8f7;font-size:11.5px;font-weight:700;color:#5a6a5e;text-align:center;border:none;cursor:pointer;font-family:inherit}
.bf-offbtn:hover{color:#C4534E;background:#fbf3f3}
/* [v171 톤다운] 닫힘 연출 = 안 ① 테두리 펄스 (진권 확정).
   구 연출(모달 축소 → 종이비행기 포물선 → ✅ 통 튐, FAB 굴러오기)은 캐릭터성으로 판정되어 전량 제거.
   대체: 브리핑이 닫힐 때 「워크스페이스」 위젯 둘레가 두 번 깜빡여 "여기를 보세요"만 알린다. */
/* ⚠️ [v172 감사수정] 반드시 inset(안쪽) 링이어야 한다 — 바깥 box-shadow로 만들면 화면에 0픽셀이다.
   착지 대상 .d2-panel의 테두리박스가 클리핑 조상의 패딩박스와 정확히 일치하기 때문:
     .grid-stack-item-content{overflow:hidden}(1057·1059, padding 선언 없음)
     └ .dw-body>*{margin:0!important}(1061) └ .d2-panel{height:100%;margin:0}(1063)
   즉 바깥으로 3px 퍼지는 그림자는 전부 잘린다. 실제로 .d2-panel 자신의 box-shadow(976)도 같은 이유로
   이미 안 보이는 상태다. 이 결함은 "클래스가 붙었는지"로는 절대 안 잡히고(붙긴 붙는다),
   콘솔 에러도 0이다 — 실기기에서 [닫기]를 눌러 링이 눈에 보이는지로만 확인된다. */
.bf-pulse{animation:bfPulse .9s ease both}
@keyframes bfPulse{
  0%,100%{box-shadow:inset 0 0 0 0 rgba(var(--sea-rgb,27,111,245),0)}
  25%    {box-shadow:inset 0 0 0 3px rgba(var(--sea-rgb,27,111,245),.55)}
  50%    {box-shadow:inset 0 0 0 0 rgba(var(--sea-rgb,27,111,245),0)}
  75%    {box-shadow:inset 0 0 0 3px rgba(var(--sea-rgb,27,111,245),.55)}
}
/* 모션 최소화에서도 "어디를 보라"는 안내 자체는 남긴다 — 정적 테두리로 대체(여기도 inset) */
@media (prefers-reduced-motion:reduce){
  .bf-pulse{animation:none!important;box-shadow:inset 0 0 0 3px rgba(var(--sea-rgb,27,111,245),.55)!important}
}
/* [v172 정리] 구 .bf-land 제거 — JS 참조 0건(종이비행기 착지 강조용이었다) */
#bfToast{position:fixed;left:50%;top:14px;transform:translate(-50%,-10px);z-index:880;background:#1c2b22;color:#fff;border-radius:11px;padding:11px 16px;font-size:13px;font-weight:700;display:flex;align-items:center;gap:10px;opacity:0;pointer-events:none;transition:all .4s cubic-bezier(.2,.9,.3,1);box-shadow:0 10px 30px rgba(10,25,15,.3);max-width:88vw}
#bfToast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
#bfToast .bf-tdot{width:7px;height:7px;border-radius:50%;background:#3EA974;animation:bfBlink 1.4s infinite;flex:none}
#bfToast .bf-tmsg{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#bfToast button{color:#8fd4ae;font-size:12px;font-weight:800;padding:2px 4px;border:none;background:none;cursor:pointer;font-family:inherit;flex:none}
#bfToast .bf-tx{color:#7c8a80}

/* [v171 톤다운] 구 [v167 문연출](닫힌 문 → 1.35초 열림) 블록 전량 제거 —
   "게임 로딩 화면"으로 읽혀 경영진 시선 우려의 핵심 항목이었다. 이제 모달만 조용히 올라온다. */

/* ===================== [v171 톤다운] 1-H 수리판 본문 — 히어로 + 산식 + 미니타일 3칸 =====================
   총합 정의 = 결재 + 일정 + 기타(공지·내 할 일·재고). 메일은 참고 지표라 총합에서 제외하고 타일로만 보여준다.
   ⚠️ 12.5px 미만 텍스트에 흐린 회색(#8b988f)을 쓰지 않는다 — 대비 미달로 정작 제일 쓸모있는
      "최장 N일"이 안 읽히던 것이 목업 단계 판정에서 드러났다. */
/* ===== [v173 리빌] 빈 셸 → 잉크가 배어 나오듯 좌→우로 채워지는 등장 (진권 확정: 목업 4안) =====
   ⚠️ 셸(모달 틀)이 먼저 뜨고 내용이 '작성되는' 순서여야 한다 — 예전엔 완성본이 통째로 튀어나왔다
      (진권 "너무 휙 튀어나온다").
   ⚠️ 글자 단위 타이핑이 아니라 clip-path 마스크다. 같은 "써지는" 인상을 주면서 총 0.9초로 끝나,
      하루 1회 × 1년 = 250번 반복돼도 기다림이 부담이 되지 않는다.
   ⚠️ display:inline-block 필수 — inline 요소에는 clip-path가 먹지 않는다. */
.bf-rv{display:inline-block;clip-path:inset(0 100% 0 0);animation:bfRv .34s cubic-bezier(.25,.9,.3,1) forwards}
@keyframes bfRv{to{clip-path:inset(0 0 0 0)}}
@media (prefers-reduced-motion:reduce){
  .bf-rv{animation:none!important;clip-path:none!important}
}
.bf-hero{display:flex;align-items:baseline;gap:8px;margin:2px 0 0;flex-wrap:wrap}
.bf-hero b{font-size:44px;font-weight:800;letter-spacing:-2px;line-height:1;color:#1c2b22;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;display:inline-block;text-align:left}
.bf-hero em{font-style:normal;font-size:15px;font-weight:700;color:#5a6a5e}
.bf-lead{font-size:13.5px;font-weight:600;color:#5a6a5e;margin:5px 0 13px;line-height:1.6;min-height:22px}
.bf-lead b{font-weight:800;color:#C4534E}
.bf-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:0}
/* [v173 리빌] 타일 '박스'는 셸의 일부라 처음부터 그려져 있고, 그 안의 글자만 배어 나온다.
   구 페이드 등장(opacity 0 + 6px 상승 + .in)은 제거 — 박스가 늦게 나타나면 "빈 셸이 먼저"라는
   컨셉이 깨지고, 리빌과 이중으로 겹쳐 과해진다. */
.bf-tile{display:block;box-sizing:border-box;width:100%;text-align:left;cursor:pointer;font-family:inherit;
  border:1px solid #e4ece6;border-radius:10px;padding:11px 12px;background:#f7f9f8;
  transition:border-color .15s ease}
.bf-tile:hover{border-color:var(--navy)}
.bf-tile:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.bf-tile .bf-tl{display:block;font-size:11.5px;font-weight:700;color:#5a6a5e;margin-bottom:2px}
.bf-tile .bf-tv{display:block;font-size:24px;font-weight:800;letter-spacing:-1px;line-height:1.15;color:#1c2b22;
  font-variant-numeric:tabular-nums}
.bf-tile .bf-ts{display:block;font-size:11.5px;font-weight:600;color:#5a6a5e;margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bf-tile.bf-hot{border-color:#C4534E;background:#fbf3f2}
.bf-tile.bf-hot .bf-tv{color:#C4534E}
.bf-tile.bf-hot .bf-ts{color:#C4534E;font-weight:800}
.bf-tile.bf-zero .bf-tv{color:#a3aea6}
.bf-more{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;text-align:left;
  margin-top:10px;padding:9px 2px 0;border-top:1px solid #eef1ef;background:none;border-left:0;border-right:0;border-bottom:0;
  font-family:inherit;font-size:12.5px;font-weight:600;color:#5a6a5e;cursor:pointer;
  transition:color .15s ease}
/* [v173 리빌] 구 opacity 페이드(.bf-more/.in) 제거 — 등장은 내부 글자의 .bf-rv 마스크가 담당 */
.bf-more strong{font-weight:800;color:#1c2b22}
.bf-more::after{content:"›";margin-left:auto;font-weight:800}
.bf-more:hover{color:var(--navy)}
.bf-more:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
body[data-theme="dark"] .bf-hero b{color:#E8EBF4}
body[data-theme="dark"] .bf-hero em{color:#B2B9CC}
body[data-theme="dark"] .bf-lead{color:#B2B9CC}
body[data-theme="dark"] .bf-tile{background:#2B3245;border-color:rgba(255,255,255,.10)}
body[data-theme="dark"] .bf-tile .bf-tl,body[data-theme="dark"] .bf-tile .bf-ts{color:#B2B9CC}
body[data-theme="dark"] .bf-tile .bf-tv{color:#E8EBF4}
body[data-theme="dark"] .bf-tile.bf-hot{background:#2A1D1C;border-color:#C4534E}
body[data-theme="dark"] .bf-tile.bf-hot .bf-tv,body[data-theme="dark"] .bf-tile.bf-hot .bf-ts{color:#E89A96}
body[data-theme="dark"] .bf-tile.bf-zero .bf-tv{color:#939CB1}
body[data-theme="dark"] .bf-more{color:#B2B9CC;border-top-color:rgba(255,255,255,.10)}
body[data-theme="dark"] .bf-more strong{color:#E8EBF4}
/* [v172 감사수정] 리드문 강조 숫자의 다크 토큰 누락 — 라이트 적색(#C4534E)이 다크 배경에서 3.80:1로
   주변 본문(8.01:1)보다 오히려 어두워, 굵게 강조한 숫자가 제일 안 읽혔다. 기존 다크 적색 재사용. */
body[data-theme="dark"] .bf-lead b{color:#E89A96}

/* ===== [감사수정] 짧은 뷰포트 대응 — 화면이 낮으면 [업무 시작]·[건너뛰기]가 잘려 빠져나갈 수 없었다 ===== */
#bfOv{padding:24px;overflow-y:auto}
@media (max-height:760px){ #bfOv{align-items:flex-start} }
/* ===== [감사수정] AI 챗봇 FAB(z9000)·드로어(z9001)가 브리핑 딤을 뚫고 나와 클릭까지 되던 것 차단 ===== */
body.bf-on #aiFab, body.bf-on #aiDrawer{display:none!important}
/* ===== [감사수정] 다크모드 미대응 — 다크 사용자가 새까만 화면에 흰 판때기를 맞던 문제 ===== */
body[data-theme="dark"] .bf-hud{background:rgba(38,44,61,.96);box-shadow:0 24px 70px rgba(0,0,0,.55)}
/* [v171 톤다운] 구 .bf-greet/.bf-sub/.bf-card/.bf-emptybx 다크 대응은 해당 요소와 함께 제거.
   1-H용 다크 토큰은 위 「1-H 수리판 본문」 블록 끝에 모아뒀다. */
body[data-theme="dark"] .bf-pop{background:#262C3D;border-color:rgba(255,255,255,.12)}
body[data-theme="dark"] .bf-offbtn{background:rgba(255,255,255,.06);color:#B2B9CC}
body[data-theme="dark"] .bf-offbtn:hover{background:rgba(196,83,78,.15);color:#E89A96}
body[data-theme="dark"] .bf-gear:hover,body[data-theme="dark"] .bf-gear.on{background:rgba(var(--sea-dk-rgb,141,180,255),.18)}
/* ===== [감사수정] 모션 최소화 설정 존중 — 같은 v166 글래스 블록엔 넣었으면서 브리핑만 빠져 있었다 ===== */
@media (prefers-reduced-motion:reduce){
  #bfOv,.bf-hud,.bf-tile,.bf-more,#bfToast{transition:none!important;animation:none!important}
  /* [v173 리빌] 구 .bf-tile 페이드 복구 규칙 제거 — 이제 타일은 항상 보이고, 글자 마스크는
     위 .bf-rv 규칙이 해제한다(RM에서는 애초에 span으로 감싸지도 않는다). */
  .bf-more,.bf-ok{opacity:1!important}
  #bfToast .bf-tdot{animation:none!important}
}

/* ═══ [v232 2FA] OTP 등록 QR ═══ */
.tfa-qr-wrap{display:flex;justify-content:center;margin:14px 0 10px}
.tfa-qr-wrap img{width:180px;height:180px;background:#fff;border-radius:12px;padding:8px;box-shadow:0 2px 14px rgba(0,0,0,.28)}
.tfa-qr-help{text-align:center;font-size:12.5px;opacity:.72;margin-bottom:6px}

/* ═══ [v234] 구매·자재 서브메뉴 클리핑 수리 (구매V3.2fix)
   전역 .nav-sub.open{max-height:160px} 가 구매 5개(≈208px)·자재관리 5개(≈173px)를 잘랐다.
   전역값은 건드리지 않고 두 메뉴에만 스코프해서 올린다. ═══ */
.nav-sub.gumae-sub.open,.nav-sub.mat-sub.open{max-height:640px}   /* [2026-10-21 인계 #8] 매입마감 폴더 + 4 — 340 이면 관리자 메뉴가 잘림 */
.nav-sub2{padding-left:14px}
.nav-sub.db-sub.open{max-height:240px}   /* [2026-10-21] DB 관리 넷 */
.db-state{margin-top:12px;padding:11px 14px;border-radius:10px;font-size:13px;line-height:1.6;color:var(--ink-soft);background:color-mix(in srgb,var(--ink) 4%,transparent);display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}   /* 사용자 DB · 법인카드 목록의 상태 칸(emp-state-bar)과 같은 틀 */
.db-btns{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px 14px}

/* ═══════════════════════════════════════════════════════════════════
   [v240] 경비·차량운행 화면 — 다크 시인성 + 표 밀도
   ───────────────────────────────────────────────────────────────────
   왜: 이 화면의 배경색이 토큰이 아니라 하드코딩(var(--sea-tint,#EEF4FF)·#fff8ec·#fdeaea·#fff…)이라
       다크로 바꾸면 **글자만 밝아지고 배경은 밝은 채로 남았다**.
       실측(WCAG): 합계 금액 102,300원 = 1.08:1, 영수증 저신뢰 칸 = 1.03:1 → 사실상 안 보임.
   어떻게: 라이트 규칙은 한 줄도 안 건드리고, 다크에서만 배경을 반투명 틴트로 덮는다.
       패널(#262C3D) 위에서 합성되므로 본문 잉크 대비가 5.3:1 이상 나온다(계산 확인).
   ⚠️ 원본 규칙에 !important 가 붙은 자리(td.cell-low)는 여기서도 붙여야 이긴다.
   ═══════════════════════════════════════════════════════════════════ */

/* ── 상태 배너 ── */
body[data-theme="dark"] .exp-status.analyzing{background:rgba(var(--sea-dk-rgb,141,180,255),.16);border-color:rgba(var(--sea-dk-rgb,141,180,255),.38)}
body[data-theme="dark"] .exp-status.review{background:rgba(58,175,160,.16);border-color:rgba(58,175,160,.38)}

/* ── 합계 분리 카드(법인카드 / 개인지출) — 금액이 안 보이던 자리 ── */
body[data-theme="dark"] .esp-corp{background:rgba(var(--sea-dk-rgb,141,180,255),.16);border-color:rgba(var(--sea-dk-rgb,141,180,255),.38)}
body[data-theme="dark"] .esp-personal{background:rgba(230,174,96,.14);border-color:rgba(230,174,96,.38)}
body[data-theme="dark"] .esp-list{border-top-color:rgba(var(--sea-dk-rgb,141,180,255),.38)}
body[data-theme="dark"] .esp-personal .esp-list{border-top-color:rgba(230,174,96,.38)}

/* ── 표: 저신뢰 칸 · 입력칸 · 메모줄 ── */
body[data-theme="dark"] .exp-edit{background:rgba(255,255,255,.06);color:var(--navy-deep)}
body[data-theme="dark"] .memo-grid{background:rgba(255,255,255,.05)}
body[data-theme="dark"] .memo-row.low .memo-grid{background:rgba(235,192,132,.12);border-color:rgba(235,192,132,.34)}

/* ── 등록 법인카드 칩 ── */
body[data-theme="dark"] .crchip{background:rgba(255,255,255,.06)}

/* ── 업로드 화면 ── */
body[data-theme="dark"] .exp-intro{background:rgba(58,175,160,.14)}
body[data-theme="dark"] .exp-drop:hover,body[data-theme="dark"] .exp-drop.over{background:rgba(58,175,160,.10)}
body[data-theme="dark"] .exp-drop-photo .rc-mini{background:rgba(255,255,255,.10)}
body[data-theme="dark"] .exp-drop-photo .rc1{background:rgba(var(--sea-dk-rgb,141,180,255),.18)}
body[data-theme="dark"] .exp-drop-photo .rc2{background:rgba(214,69,69,.18)}
body[data-theme="dark"] .exp-drop-photo .rc3{background:rgba(58,175,160,.18)}
body[data-theme="dark"] .exp-drop-photo .rc4{background:rgba(230,174,96,.18)}
body[data-theme="dark"] .exp-drop-photo .rc5{background:rgba(160,140,220,.18)}
body[data-theme="dark"] .exp-drop-photo .rc6{background:rgba(235,192,132,.18)}

/* ── 차량운행·교통비 표 (tr.car-low·car-dup 는 v229 에서 이미 처리됨) ── */
body[data-theme="dark"] table.car-table th.grp-drive{background:rgba(var(--sea-dk-rgb,141,180,255),.16);color:var(--navy-deep)}
body[data-theme="dark"] table.car-table th.grp-cost{background:rgba(58,175,160,.16);color:var(--ok-ink)}
body[data-theme="dark"] table.car-table td.drive-cell input{background:rgba(var(--sea-dk-rgb,141,180,255),.10)}
body[data-theme="dark"] table.car-table td.cost-cell input{background:rgba(58,175,160,.10)}
body[data-theme="dark"] table.car-table td.ocr input{background:rgba(58,175,160,.18)}
body[data-theme="dark"] table.car-table input:focus{background:rgba(255,255,255,.10)}
body[data-theme="dark"] table.car-table input.cum-input:focus{background:rgba(255,255,255,.06)}
body[data-theme="dark"] .car-del,body[data-theme="dark"] .car-ins,body[data-theme="dark"] .car-mv{background:rgba(255,255,255,.06)}

/* ═══ [v240] 라이트 — OCR 신뢰도 배지 대비 ═══
   #3AAFA0/#E6AE60 을 같은 계열 연한 배경에 올려 2.4:1·1.8:1 이었다(AA 기준 4.5).
   전역 토큰(--ok·--warn)은 다른 화면 수십 곳이 쓰므로 건드리지 않고 이 배지만 어둡게 한다. */
.conf.ok{color:#1F7A6E}      /* on #e2f6f3 → 4.60:1 */
.conf.low{color:#8A5F00}     /* on #fdf2dc → 5.09:1 */
body[data-theme="dark"] .conf.ok{color:var(--ok-ink)}
body[data-theme="dark"] .conf.low{color:var(--warn-ink)}

/* ═══ [v240] 메모줄 접기 ═══
   영수증 1건이 본문 72px + 메모 83px = 155px 였다. 10장이면 표만 1,600px.
   기본은 접고 상호 옆 ✎ 버튼으로 편다. 이미 입력값이 있으면 처음부터 펼쳐진다(expense.js). */
.exp-table tr.memo-row{display:none}
.exp-table tr.memo-row.on{display:table-row}
.memo-tg{margin-left:8px;border:1px solid var(--line);background:transparent;color:var(--ink-faint);
  border-radius:6px;padding:2px 7px;font-size:10.5px;font-weight:700;font-family:inherit;cursor:pointer;
  vertical-align:middle;white-space:nowrap;transition:all .12s}
.memo-tg:hover{color:var(--navy);border-color:var(--navy)}
.memo-tg.on{color:var(--navy);border-color:var(--navy);background:var(--navy-soft,rgba(var(--sea-rgb,27,111,245),.08))}
body[data-theme="dark"] .memo-tg.on{background:rgba(var(--sea-dk-rgb,141,180,255),.16)}

/* ═══ [v240] 결제수단 드롭다운 잘림 ═══
   열을 넓혀도 계속 잘렸다 — 원인은 열 폭이 아니라 .card-sel 의 max-width:160px 였다.
   가장 긴 항목 '삼성 ····5678 (영업팀(메뚜기 부장))' 이 186px 인데 글자 자리는 128px 뿐(실측).
   칸 폭을 그대로 쓰게 풀어준다. */
.card-sel{max-width:100%}

/* ═══ [v240] 결제수단 칩 — 라이트 대비 + 다크 배경 ═══
   var(--navy)/#a8730f 를 같은 계열 연한 배경에 올려 4.16:1·3.88:1 이었다(AA 4.5).
   배경(var(--sea-tint,#EEF4FF)·#fff8ec)은 하드코딩이라 다크에서 그대로 밝게 남아 있었다. */
body[data-theme="dark"] .card-sel{background:rgba(255,255,255,.06);color:var(--ink-soft)}

/* ═══ [v240-2] 남은 AA 미달 정리 ═══
   1차 수정 뒤 재측정에서 남은 12종. 전부 '연한 배경 위 연한 글자' 조합이다.
   전역 토큰(--ok·--warn·--navy·--ink-faint)은 다른 화면 수십 곳이 쓰므로 건드리지 않고
   이 화면 셀렉터에만 스코프한다. 괄호 안 숫자는 계산으로 확인한 대비비.  */

/* 탭의 'OCR' 배지 — 흰 글자를 --ok(#3AAFA0) 에 올려 2.69:1 이었다 */
.wf-tab .tg,.kind-seg .ko .ocrb{background:#1F7A6E}                 /* #fff on #1F7A6E → 5.16 */
body[data-theme="dark"] .wf-tab .tg,body[data-theme="dark"] .kind-seg .ko .ocrb{background:#17564E}

/* 인식 완료 배너 */
.exp-status.review{color:#1F7A6E}                                    /* on #e7f6ec → 4.62 */
                                           /* on #e7f6ec → 5.05 */
body[data-theme="dark"] .exp-status.review{color:var(--ok-ink)}

/* 합계 카드 머리글 */
.esp-corp .esp-h{color:var(--navy-deep)}                                      /* on var(--sea-tint,#EEF4FF) → 5.78 */
.esp-personal .esp-h{color:#8A5F00}                                  /* on #fff8ec → 5.35 */
body[data-theme="dark"] .esp-corp .esp-h{color:var(--navy-deep)}
body[data-theme="dark"] .esp-personal .esp-h{color:#EBC084}           /* on 틴트 → 6.23 */
body[data-theme="dark"] .esp-corp .esp-h svg{stroke:var(--navy-2)}

/* 시각·메모 버튼 — --ink-faint 는 이 크기(10.5px)에서 4.3:1 밖에 안 된다 */
.exp-table .tm{color:var(--ink-soft)}
.memo-tg{color:var(--ink-soft)}
body[data-theme="dark"] .crchip em{color:var(--ink)}

/* 경비 정합성 검증 칩 (인라인 하드코딩을 클래스로 뺀 자리) */
.expaud-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;
  padding:5px 11px;border-radius:9px}
.expaud-chip.zero{background:var(--line-soft,#eef2f4);color:var(--ink-soft)}
body[data-theme="dark"] .expaud-chip.zero{background:rgba(255,255,255,.07);color:var(--ink-soft)}
.expaud-clean{font-size:14px;font-weight:700;color:var(--navy-deep)}          /* on #fff → 6.39 */
body[data-theme="dark"] .expaud-clean{color:var(--navy-deep)}

/* ═══ [v240-3] 마지막 2건 — 특이도 때문에 안 먹던 자리 ═══ */
/* 시각(19:41): 앞서 넣은 `.exp-table .tm` 이 `table.dl .tm`(요소+클래스+클래스)에 밀렸다.
   같은 특이도로 맞춰서 뒤에 두면 이긴다. */
table.exp-table .tm{color:var(--ink-soft)}
/* 카드별 소계의 (용도) 라벨 — 연한 틴트 위 --ink-faint 라 4.1:1 이었다 */
.pcrow em{color:var(--ink-soft)}

/* ═══════════════════════════════════════════════════════════════════
   [v241] 경비표 — 색 블록 제거 · 신호등 점 · 행 높이
   ───────────────────────────────────────────────────────────────────
   진권 피드백(2026-08-28):
     ① 다크에서 유효성 색이 눈이 아프다  ② 행이 아직 높다
     ③ OCR 신뢰도 노랑/빨강 알약이 어색하다 → 오른쪽 끝에 신호등 점으로
     ④ 미인식 칸을 배경색으로 덮지 말고 글자만 바꿔라
   → 표에서 '면(배경)' 을 전부 걷어내고 '점·글자색' 으로만 상태를 말하게 했다.
   ═══════════════════════════════════════════════════════════════════ */

/* ── ④ 미인식/저신뢰 칸: 배경 덮기 → 글자색만 ──
   종전 .cell-low 는 background:#fdeaea!important + 왼쪽 3px 빨간 막대였다.
   글자만 바꾸면 다크에서도 '밝은 면'이 안 생겨 눈이 편하다. */
.exp-table td.cell-warn{color:#B3261E}                                  /* on #fff → 6.54 */
.exp-table td.cell-warn .exp-edit{color:#B3261E;border-color:rgba(179,38,30,.45)}
.exp-table td.cell-warn .tm{color:#B3261E;opacity:.75}
body[data-theme="dark"] .exp-table td.cell-warn{color:#F2B8B5}          /* on #262C3D → 8.14 */
body[data-theme="dark"] .exp-table td.cell-warn .exp-edit{color:#F2B8B5;border-color:rgba(242,184,181,.40)}
body[data-theme="dark"] .exp-table td.cell-warn .tm{color:#F2B8B5;opacity:.75}



/* ── ② 행 높이 ──
   날짜/시각을 두 줄(42px)에서 한 줄로, 셀 여백 14px → 9px. */
.dtcell{display:flex;align-items:center;gap:7px}
.dtcell .exp-edit{width:86px;flex:none}   /* [v272] 실데이터 날짜는 YYYY-MM-DD(10자) — 66px 는 데모 MM.DD 기준이라 "2026-08" 에서 잘렸다 */
.exp-table .tm{margin-top:0;white-space:nowrap}
table.exp-table td{padding:9px 12px}
table.exp-table th{padding:9px 12px}

/* ── 행 뱃지: 채운 블록 → 글자+가는 테두리 ── */
.rowflag{display:inline-block;font-size:10px;font-weight:800;padding:1px 6px;border-radius:6px;
  margin-left:5px;background:transparent;border:1px solid currentColor;cursor:help}
.f-dup{color:#B3261E}
.f-evi{color:#A96F00}
.f-pol{color:var(--ink-soft)}
body[data-theme="dark"] .f-dup{color:#EF8B85}
body[data-theme="dark"] .f-evi{color:#E0A32E}

/* ═══ [v241] 표 안 드롭다운 다크 대응 ═══
   .cat-sel 이 background:#fff + color:var(--navy-deep) 라 다크에서 흰 칸에 연한 파란 글자(1.7:1)가 됐다.
   ⚠️ 이 유형은 대비 자동점검이 놓친다 — select 의 글자는 <option> 안에 있어
      '텍스트 노드를 가진 요소' 순회에 안 잡힌다. 점검 스크립트에 폼 컨트롤을 따로 추가했다. */
body[data-theme="dark"] .cat-sel{background:rgba(255,255,255,.06);color:var(--navy-deep)}
body[data-theme="dark"] .cat-sel option{background:var(--panel);color:var(--ink)}
body[data-theme="dark"] .card-sel option{background:var(--panel);color:var(--ink)}

/* ═══ [v241] 라이트 모드에서 놓치고 있던 2건 ═══
   폼 컨트롤을 점검에 넣고 나서야 잡혔다 — 둘 다 **다크용 밝은 파랑(--navy-2)** 을
   흰 배경 위에 쓰고 있었다(2.77:1). 날짜칸과 분류 드롭다운 글자가 계속 흐렸던 원인. */
.exp-edit{color:var(--navy-deep)}                                   /* on #fff → 6.39 */
.cat-sel{color:var(--navy-deep)}
body[data-theme="dark"] .exp-edit{color:var(--navy-deep)}     /* 다크는 종전 그대로 */
body[data-theme="dark"] .cat-sel{color:var(--navy-deep)}

/* 차량운행 안내문의 <b> — --warn(#E6AE60) 을 연노랑 배경에 올려 1.79:1 이었다 */
.car-note b{color:#8A5F00}
body[data-theme="dark"] .car-note b{color:#EBC084}

/* ═══ [v243] 서버 상태 배지 — 좌하단 텍스트 배지 → 상단바 색점 ═══
   position:fixed 를 인라인으로 갖고 있던 걸 상단바 flex 자식으로 바꿨다.
   ⚠️ 인라인 스타일이라 CSS 로는 못 덮는다 — index.html 의 cssText 를 직접 고쳤다(그쪽 주석 참고). */
.topbar #f2SyncBadge{cursor:inherit}
body[data-theme="dark"] .topbar #f2SyncBadge{box-shadow:0 0 0 3px rgba(255,255,255,.08)}

/* ═══════════════════════════════════════════════════════════════════
   [v246] B안 — 결제수단 아이콘 · 검토 큐 · 한 건씩 검토
   표에서 유효성 색을 전부 뺐다(v241 의 신호등 점·v242 의 셀렉트 색 테두리 모두 삭제).
   색이 남은 곳은 결제수단 아이콘과 검토창 안뿐이다.
   ═══════════════════════════════════════════════════════════════════ */
:root{--rv-g:#1F8A57;--rv-y:#A96F00;--rv-r:#B3261E;--rv-b:#1D5FD6}
body[data-theme="dark"]{--rv-g:#4FC08A;--rv-y:#E0A32E;--rv-r:#EF8B85;--rv-b:#6FA2F7}   /* rv-b: [v282] 사용자 확인 완료 */

/* ── 결제수단 아이콘 (법인=채운 카드·카드색 / 개인=실선 사람) ── */
.pay-cell{flex-direction:row;align-items:center;gap:8px}
.pi{width:20px;height:20px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.pi svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:1.9}
.pi.pers{background:transparent;border:1.5px solid var(--ink-faint)}   /* [v246] 점선 → 실선 (진권 지시) */
.pi.pers svg{stroke:var(--ink-faint)}
.card-sel{flex:1;min-width:0}
/* [2026-10-12 ⑪-1] 법인카드 확인 필요 — 영수증 카드번호가 등록 카드 여러 장과 맞음(후보 중에서 고르거나 개인) */
.pi.ask{background:var(--warn-soft);border:1.5px solid var(--warn);color:var(--warn-ink);font-size:12px;font-weight:800;line-height:1}
.card-sel.need{border-color:var(--warn);background:var(--warn-soft);color:var(--ink)}
/* [2026-10-12 ⑰-1] 법인카드 식대 — 사용 목적을 적어야 하는 칸 */
.memo-f input.need{border-color:var(--warn);background:var(--warn-soft)}

/* ── 검토 큐 ── */
.exp-queue{--postit-c:var(--rv-y);display:flex;align-items:center;gap:13px;
  padding:13px 16px;margin-bottom:16px;cursor:pointer;transition:all .14s}   /* 띠·바탕·모서리 = 맨 끝 「포스트잇」 블록 · 테두리 없음(종전 1px 자리 = padding +1) */
.exp-queue:not(.ok):hover{box-shadow:0 0 0 1px var(--navy),0 4px 14px rgba(19,27,22,.08)}   /* 강조 = 바깥 링(띠까지 감쌈) */
.exp-queue:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.exp-queue.ok{--postit-c:var(--rv-g);cursor:default}
.exp-queue .q-n{font-size:21px;font-weight:800;color:var(--rv-y);line-height:1;font-variant-numeric:tabular-nums;flex:none}
.exp-queue.ok .q-n{color:var(--rv-g)}
.exp-queue .q-t{display:flex;flex-direction:column;gap:1px;min-width:0}
.exp-queue .q-t b{font-size:13.5px;font-weight:800;color:var(--ink)}
.exp-queue .q-t span{font-size:12px;color:var(--ink-soft)}
.exp-queue .q-go{margin-left:auto;flex:none;font-size:12px;font-weight:800;color:var(--navy);
  border:1px solid var(--navy);border-radius:9px;padding:7px 13px}

/* ── 한 건씩 검토 ── */
.rv-back{position:fixed;inset:0;z-index:9200;background:rgba(19,27,22,.46);display:flex;align-items:center;
  justify-content:center;padding:24px}
body[data-theme="dark"] .rv-back{background:rgba(0,0,0,.62)}
.rv-box{width:min(860px,100%);max-height:calc(100vh - 48px);overflow:auto;background:var(--panel);
  border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.rv-h{display:flex;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid var(--line-soft)}
.rv-h b{font-size:14px;font-weight:800}
.rv-h .rv-sub{font-size:13px;color:var(--ink-soft);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rv-steps{margin-left:auto;display:flex;gap:4px;flex:none}
.rv-steps i{width:22px;height:4px;border-radius:2px;background:var(--line)}
.rv-steps i.done{background:var(--rv-g)} .rv-steps i.on{background:var(--navy)}
.rv-x{width:28px;height:28px;flex:none;border:1px solid var(--line);background:transparent;border-radius:8px;
  color:var(--ink-faint);cursor:pointer;font-size:13px;line-height:1}
.rv-x:hover{color:var(--ink);border-color:var(--navy)}
.rv-b{display:grid;grid-template-columns:230px 1fr;gap:20px;padding:18px}
.rv-shot{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--line-soft);
  aspect-ratio:3/4;display:flex;align-items:center;justify-content:center}
.rv-img{width:100%;height:100%;object-fit:contain;display:block}
.rv-noimg{text-align:center;color:var(--ink-faint);font-size:12px;padding:14px;display:flex;flex-direction:column;gap:4px}
.rv-noimg b{font-size:13px;color:var(--ink-soft)}
.rv-f{display:grid;grid-template-columns:52px 1fr 96px;gap:11px;align-items:center;padding:10px 0;
  border-bottom:1px dashed var(--line)}
.rv-f label{font-size:11.5px;font-weight:700;color:var(--ink-faint)}
.rv-f input{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;
  font:700 14px inherit;font-family:inherit;background:transparent;color:var(--ink)}
.rv-f input:focus{outline:none;border-color:var(--navy)}
.rv-c{display:flex;flex-direction:column;gap:3px}
.rv-bar{height:5px;border-radius:3px;background:var(--line-soft);overflow:hidden}
.rv-bar i{display:block;height:100%;border-radius:3px}
.rv-bar i.lv-g{background:var(--rv-g)} .rv-bar i.lv-y{background:var(--rv-y)} .rv-bar i.lv-r{background:var(--rv-r)}
.rv-c span{font-size:10.5px;font-weight:800;text-align:right;font-variant-numeric:tabular-nums}
.rv-c span.lv-g{color:var(--rv-g)} .rv-c span.lv-r{color:var(--rv-r)}
.rv-pay{grid-template-columns:52px 1fr;border-bottom:0}
.rv-payt{font-size:13px;font-weight:700;color:var(--ink)}
.rv-act{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
.rv-f select{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:14px;background:var(--panel);color:var(--ink)}   /* [v274] 차량운행 검토창 구분 */
.exp-status.car-queue{cursor:pointer}
.exp-status.car-queue .q-go{margin-left:8px;color:var(--navy);font-weight:800}
@media(max-width:720px){ .rv-b{grid-template-columns:1fr} .rv-shot{aspect-ratio:4/3;max-height:230px} }

/* ═══ [v246-1] 검토창 잔여 대비 2건 ═══
   폼 컨트롤까지 넣은 자동 점검에서 걸린 것. 둘 다 '작은 글자 + 연한 색' 조합이다. */
.rv-c span.lv-y{color:#8A5F00}                 /* --rv-y(#A96F00) 는 흰 패널에서 4.23:1 → 5.65:1 로 */
body[data-theme="dark"] .rv-c span.lv-y{color:var(--rv-y)}
.rv-noimg span{color:var(--ink-soft)}          /* --ink-faint 는 이 크기(12px)에서 4.2~4.5:1 */

/* ═══ [v247] OCR 판독 신호등 — 표 오른쪽 끝 ═══
   v246 에서 뺐다가 되살린다. 색이 한 열에 정렬되면 흩어지는 게 아니라 하나의 열로 읽힌다.
   빨강(확인 필요)만 누를 수 있다 — 누르면 그 영수증 검토 화면으로 바로 간다. */
.conf-td{text-align:center;white-space:nowrap}   /* [v273] 머리글 OCR 과 같은 가운데 */
table.exp-table th:nth-child(5){text-align:right}   /* [v273] 금액 머리글은 숫자와 같이 오른쪽 */
table.exp-table th:last-child{text-align:center}    /* OCR 머리글은 점과 같이 가운데 */
table.car-table th.num{text-align:right;padding-right:12px}   /* [v273] 숫자 열 머리글 = 값과 같이 오른쪽(입력칸 6px + 셀 6px) */
.conf-dot{display:inline-block;width:10px;height:10px;border-radius:50%;
  box-shadow:0 0 0 3px rgba(0,0,0,.05);cursor:help;vertical-align:middle}
.conf-dot.lv-g{background:var(--rv-g)}
.conf-dot.lv-y{background:var(--rv-y)}
.conf-dot.lv-r{background:var(--rv-r)}
.conf-dot.lv-b{background:var(--rv-b)}   /* [v282] 사용자가 검토 화면에서 확인함 */
.conf-dot.lv-b.hit:hover{box-shadow:0 0 0 4px color-mix(in srgb,var(--rv-b) 30%,transparent)}
.conf-dot.hit{cursor:pointer}
.conf-dot.hit:hover{box-shadow:0 0 0 4px color-mix(in srgb,var(--rv-r) 30%,transparent)}
.conf-dot.hit:focus-visible{outline:2px solid var(--navy);outline-offset:3px}
body[data-theme="dark"] .conf-dot{box-shadow:0 0 0 3px rgba(255,255,255,.07)}

/* ═══════════════════════════════════════════════════════
   [v248 24절기] 날씨 위젯 안 절기칩
   ⚠️ 계절색을 쓰지 않는다 — 시네마틱 스카이 8톤 위에 얹히므로
      반투명 글라스 + 하늘 밝기 따라 글자만 반전(.wx-dark).
      계절색을 넣으면 비 오는 날 하늘색과 싸운다.
   ⚠️ .jq-chip 은 .wx 안쪽 마지막 자식이다(weatherInline). 구분선은 왼쪽 border.
   ═══════════════════════════════════════════════════════ */
.jq-chip{display:flex;align-items:center;gap:8px;padding-left:11px;margin-left:3px;border-left:1px solid rgba(120,132,150,.32)}
.jq-chip .jq-ic{width:26px;height:26px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.jq-chip .jq-tx{display:flex;flex-direction:column;align-items:flex-start;gap:1px;line-height:1.2}
.jq-chip .jq-tx b{font-size:13px;font-weight:800;color:#241f33}
.jq-chip .jq-tx i{font-style:normal;font-size:10.5px;font-weight:600;color:#4E5A6E}
/* ⚠️ 위 두 색은 토큰(var(--ink)/--ink-soft)이 **아니어야** 한다.
   이 칩의 배경은 테마가 아니라 '하늘'이 정한다(밝은 하늘=흰 글라스 / 어두운 하늘=검은 스크림).
   토큰을 쓰면 다크 테마에서 글자만 밝아져 밝은 하늘 위 흰 글라스에서 사라진다. */
/* 히어로 안 날씨칩 — 하늘 위 글라스
   ⚠️ 칩 색은 **테마가 아니라 하늘 밝기**로 갈린다:
        밝은 하늘 = 라이트 테마의 wx-dark 아닌 하늘(맑음·구름·안개·눈)
        어두운 하늘 = 라이트 테마의 .wx-dark  또는  다크 테마 전부(다크는 8톤이 모두 어둡다)
   ⚠️ 종전 rgba(255,255,255,.14) 흰 글라스는 '비' 하늘(#55677F)에서 칩이 밝아져
      흰 글자 대비가 4.24:1 로 떨어졌다(AA 미달). 어두운 스크림으로 뒤집는다 → 최악 6.94:1. */
.d2-weather-hero{display:flex;justify-content:flex-start;margin-top:13px}
body[data-theme] .d2-hero .d2-weather-hero .wx{align-items:center;margin-bottom:0;
  background:rgba(255,255,255,.74);border-color:rgba(255,255,255,.6);backdrop-filter:blur(3px)}
body[data-theme] .d2-hero.wx-dark .d2-weather-hero .wx,
body[data-theme="dark"] .d2-hero .d2-weather-hero .wx{background:rgba(10,16,28,.30);border-color:rgba(255,255,255,.22)}
body[data-theme] .d2-hero.wx-dark .wx-t,      body[data-theme] .d2-hero.wx-dark .jq-chip .jq-tx b,
body[data-theme="dark"] .d2-hero .wx-t,       body[data-theme="dark"] .d2-hero .jq-chip .jq-tx b{color:#fff}
body[data-theme] .d2-hero.wx-dark .wx-d,      body[data-theme] .d2-hero.wx-dark .jq-chip .jq-tx i,
body[data-theme="dark"] .d2-hero .wx-d,       body[data-theme="dark"] .d2-hero .jq-chip .jq-tx i{color:rgba(255,255,255,.88)}
body[data-theme] .d2-hero.wx-dark .wx-hl,     body[data-theme="dark"] .d2-hero .wx-hl{color:rgba(255,255,255,.68)}
body[data-theme] .d2-hero.wx-dark .jq-chip,   body[data-theme="dark"] .d2-hero .jq-chip{border-left-color:rgba(255,255,255,.3);color:rgba(255,255,255,.92)}   /* 절기 아이콘(currentColor)도 흰색 — 라이트 비 하늘에서 짙은 아이콘이 칩에 묻혔다 */
/* 🔴 [v248 수리] 다크 테마의 눈 하늘은 어둡다 — dash.js 에서 snow 를 wx-dark 에서 뺐으므로 여기서 흰 글자를 준다 */
body[data-theme="dark"] .d2-hero.wx-snow .d2-hi,
body[data-theme="dark"] .d2-hero.wx-snow .d2-hd .c,
body[data-theme="dark"] .d2-mini.d2-heroS.wx-snow .m-clock{color:#fff}
body[data-theme="dark"] .d2-hero.wx-snow .d2-hsub,
body[data-theme="dark"] .d2-hero.wx-snow .d2-hd .d{color:rgba(255,255,255,.75)}
/* (눈 전용 칩 규칙은 위 '어두운 하늘' 통합 규칙이 이미 덮는다 — 중복 삭제) */
@media(max-width:760px){
  .jq-chip .jq-tx i{display:none}
  .jq-chip{padding-left:9px;gap:6px}
  .jq-chip .jq-ic{width:22px;height:22px}
}

/* ═══════════════════════════════════════════════════════
   [v249 의견함] 보내기 팝오버 + 목록/상세 + 처리
   ⚠️ 권한이 없으면 처리 UI 를 **흐리는 게 아니라 렌더하지 않는다**(feedback.js).
      여기 CSS 에도 disabled 상태를 두지 않는다 — 없는 게 제일 확실하다.
   ═══════════════════════════════════════════════════════ */
.fb-btn{width:34px;height:34px;border-radius:9px;border:1px solid var(--tb-line);background:var(--tb-field);color:var(--ink-soft);display:grid;place-items:center;cursor:pointer;flex:none;transition:.15s}
.fb-btn svg{width:18px;height:18px}
.fb-btn:hover{background:var(--sb-on-bg);color:var(--sb-on-ink);border-color:transparent}
.fb-pop{position:absolute;right:112px;top:52px;width:286px;background:var(--panel);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow-lg),0 14px 38px rgba(28,36,51,.18);padding:13px;z-index:60}
.fb-pop:before{content:"";position:absolute;right:24px;top:-7px;width:12px;height:12px;background:var(--panel);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.fb-pt{font-size:12.5px;font-weight:800;margin-bottom:10px;color:var(--ink)}
.fb-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:9px}
.fb-chip{font-size:11px;font-weight:700;padding:6px 10px;border-radius:20px;border:1.5px solid var(--line);background:var(--panel);color:var(--ink-soft);cursor:pointer;font-family:inherit}
.fb-chip.on{border-color:var(--sb-on-ink);background:var(--sb-on-bg);color:var(--sb-on-ink)}
.fb-drop{border:1.5px dashed var(--line);border-radius:10px;padding:10px 11px;margin-bottom:9px;text-align:center;font-size:11px;color:var(--ink-faint);line-height:1.6}
.fb-drop.over{border-color:var(--sb-on-ink);background:var(--sb-on-bg)}
.fb-drop b{display:block;font-size:11.5px;color:var(--ink);margin-bottom:3px}
.fb-drop .fb-pick{color:var(--sb-on-ink);font-weight:700;cursor:pointer;text-decoration:underline}
.fb-has{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;color:var(--sb-on-ink)}
.fb-x{border:none;background:none;color:var(--ink-faint);cursor:pointer;font-size:12px;font-family:inherit}
.fb-ta{width:100%;border:1.5px solid var(--line);border-radius:9px;padding:9px 11px;font-family:inherit;font-size:12.5px;background:var(--tb-field);color:var(--ink);resize:vertical}
.fb-ta:focus{outline:none;border-color:var(--sb-on-ink)}
.fb-inp{width:100%;border:1.5px solid var(--line);border-radius:8px;padding:7px 10px;font-family:inherit;font-size:12px;background:var(--panel);color:var(--ink)}
.fb-meta{background:var(--tb-field);border-radius:8px;padding:9px 11px;font-size:10.5px;color:var(--ink-soft);line-height:1.9;margin-top:9px}
.fb-meta .k{display:inline-block;min-width:64px;color:var(--ink-faint);font-weight:700}
.fb-meta b{color:var(--ink)}
.fb-send{width:100%;border:none;background:var(--navy);color:#fff;font-family:inherit;font-size:12.5px;font-weight:800;padding:10px;border-radius:9px;cursor:pointer;margin-top:9px}
.fb-send:disabled{opacity:.6;cursor:default}
/* ═══ [2026-10-03 사용자 결정 · 의견함 A안] 목록 = 머리(건수·상태 거르기) + 하나씩 떨어진 포스트잇 카드 · 오른쪽 상세 ═══
   상태색(라이트/다크) — 접수 파랑 · 검토 중 주황 · 정보 필요 보라 · 반영 완료 초록 · 반려 회색. 카드 띠·바탕·모서리는 맨 끝 공통 「포스트잇」 블록(.f2-postit)이 그린다. */
.fb-s-new{--fb-c:#3B82F6}.fb-s-doing{--fb-c:#D98A1C}.fb-s-ask{--fb-c:#8B5CF6}.fb-s-done{--fb-c:#2BA58E}.fb-s-rej{--fb-c:#9CA3AF}
body[data-theme="dark"] .fb-s-new{--fb-c:#6FA3F8}body[data-theme="dark"] .fb-s-doing{--fb-c:#EBA94A}body[data-theme="dark"] .fb-s-ask{--fb-c:#A98BF8}
body[data-theme="dark"] .fb-s-done{--fb-c:#4CC2AA}body[data-theme="dark"] .fb-s-rej{--fb-c:#8E96A3}
.fb-wrap{display:grid;grid-template-columns:408px minmax(0,1fr);gap:16px;align-items:start}   /* [2026-10-16 사용자 「왼쪽 목록 20% 더」] 340 → 408px */
.fb-col{display:flex;flex-direction:column;gap:10px;min-width:0}
.fb-head{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow-sm)}
.fb-head .hh{display:flex;align-items:baseline;gap:8px;margin-bottom:9px}
.fb-head .hh b{font-size:14.5px;color:var(--ink)}
.fb-head .hh small{font-size:12px;color:var(--ink-faint);font-weight:600}
.fb-flt{display:flex;flex-wrap:wrap;gap:6px}
.fb-flt button{border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);font-family:inherit;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;cursor:pointer}
.fb-flt button b{margin-left:4px;color:var(--ink)}
.fb-flt button.on{background:var(--ink);color:var(--panel);border-color:var(--ink)}
.fb-flt button.on b{color:var(--panel)}
.fb-list{display:flex;flex-direction:column;gap:10px}
/* 카드 — 공통 포스트잇(.f2-postit)에 상태색만 준다. 안쪽 여백 왼쪽은 공통 값(--postit-pl) 그대로 */
.fb-card{--postit-c:var(--fb-c);position:relative;cursor:pointer;padding-top:11px;padding-right:13px;padding-bottom:11px;transition:box-shadow .12s,background-color .12s}
.fb-card:hover{box-shadow:0 1px 0 rgba(0,0,0,.05),3px 4px 10px rgba(0,0,0,.12)}
.fb-card:focus-visible{outline:2px solid var(--fb-c);outline-offset:-2px}
/* 선택 — 자리를 옮기지 않는다(왼쪽 끝 = 다른 카드와 같은 x). 바탕 진하게 · 안쪽 outline 2px(모서리 따라감) · 그림자 */
.fb-list .fb-card.sel{background:color-mix(in srgb,var(--fb-c) 20%,var(--panel));outline:2px solid var(--fb-c);outline-offset:-2px;
  box-shadow:0 1px 0 rgba(0,0,0,.05),3px 5px 12px rgba(0,0,0,.14)}
.fb-card .r1{display:flex;align-items:center;gap:7px;margin-bottom:6px}
.fb-card .tm{margin-left:auto;font-size:11px;color:var(--ink-faint);font-weight:600;font-variant-numeric:tabular-nums}
.fb-card .t{font-size:13.5px;font-weight:700;line-height:1.45;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fb-card .s{font-size:11.5px;color:var(--ink-soft);margin-top:3px}
.fb-card .need{margin-top:7px;font-size:12px;font-weight:800;color:color-mix(in srgb,var(--fb-c) 72%,var(--ink))}
.fb-card .fb-th{position:absolute;right:10px;top:38px;width:46px;height:34px;border-radius:4px;border:1px solid var(--line);background-color:var(--panel);background-size:cover;background-position:center top}
.fb-card.has-th .t,.fb-card.has-th .s,.fb-card.has-th .need{margin-right:56px}   /* [2026-10-03 통일성] 썸네일은 제목 옆(위쪽) — 진행 막대는 모든 카드에서 같은 폭(UI 지침 §5) */
/* 카드 진행 막대 3칸(접수 → 검토 → 완료) — 정보 필요는 가운데 칸 이름, 반려는 끝 칸 이름 */
.fb-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:9px}
.fb-steps i{display:block;height:4px;border-radius:2px;background:color-mix(in srgb,var(--ink) 12%,transparent)}
.fb-steps .on i{background:var(--fb-c)}
.fb-steps span{display:block;font-size:11px;font-weight:700;color:var(--ink-faint);margin-top:3px;white-space:nowrap}
.fb-steps .on span{color:color-mix(in srgb,var(--fb-c) 65%,var(--ink))}
.fb-stc{display:inline-flex;align-items:center;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;white-space:nowrap;
  background:color-mix(in srgb,var(--fb-c) 22%,var(--panel));color:color-mix(in srgb,var(--fb-c) 62%,var(--ink))}
.fb-ver{font-size:10.5px;font-weight:800;padding:1px 6px;border-radius:5px;color:color-mix(in srgb,#2BA58E 70%,var(--ink));border:1px solid color-mix(in srgb,#2BA58E 45%,transparent)}
.fb-none{padding:26px 12px;text-align:center;font-size:13px;color:var(--ink-faint)}
/* 상세 */
.fb-det{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;box-shadow:var(--shadow-sm);min-height:220px;min-width:0}
.fb-dhd{display:flex;gap:7px;align-items:center}
.fb-dt{font-size:17px;font-weight:800;line-height:1.45;color:var(--ink);margin:8px 0 4px}
.fb-body{font-size:14px;font-weight:500;line-height:1.75;color:var(--ink);white-space:pre-wrap;margin:6px 0 2px}   /* 의견 글 전체 = 일반 본문 크기(제목은 첫 줄만) */
.fb-dm{font-size:12px;color:var(--ink-faint);margin:6px 0 0;line-height:1.7}
.fb-dm b{color:var(--ink-soft)}
.fb-sec{font-size:12px;font-weight:800;color:var(--ink-soft);margin:20px 0 10px}
/* 진행 상황 3단계 — 날짜는 DB 에 있는 값만(접수 = at · 지금 단계 = 마지막 변경 · 지나간 가운데 단계는 저장된 날짜가 없어 비운다) */
.fb-tl3{display:grid;grid-template-columns:repeat(3,1fr)}
.fb-tl3 .n{position:relative;padding-top:22px;text-align:center}
.fb-tl3 .n::before{content:"";position:absolute;top:6px;left:0;right:0;height:3px;background:color-mix(in srgb,var(--ink) 12%,transparent)}
.fb-tl3 .n:first-child::before{left:50%}
.fb-tl3 .n:last-child::before{right:50%}
.fb-tl3 .n.on::before{background:var(--fb-c)}
.fb-tl3 .n.half::before{background:linear-gradient(90deg,var(--fb-c) 50%,color-mix(in srgb,var(--ink) 12%,transparent) 50%)}
.fb-tl3 .n i{position:absolute;top:0;left:50%;width:15px;height:15px;margin-left:-7.5px;border-radius:3px;background:var(--panel);border:3px solid color-mix(in srgb,var(--ink) 18%,transparent);transform:rotate(-6deg)}
.fb-tl3 .n.on i,.fb-tl3 .n.cur i{background:var(--fb-c);border-color:var(--fb-c)}
.fb-tl3 .n b{display:block;font-size:13px;color:var(--ink)}
.fb-tl3 .n.cur b{color:color-mix(in srgb,var(--fb-c) 72%,var(--ink))}
.fb-tl3 .n span{display:block;font-size:11.5px;color:var(--ink-faint);margin-top:2px;min-height:1.5em}
/* [2026-10-03 사용자 킵 #2 · 결정 2-2] 캡처 = 원래 크기 이하(칸 폭에 맞춰 키우지 않는다) · 높이 200 상한(비율 유지) · 누르면 퀵 프리뷰(커서 zoom-in · title) */
.fb-shot{display:block;color:var(--ink);width:fit-content;max-width:100%;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:14px;cursor:zoom-in;background:var(--bg)}
.fb-shot img{display:block;max-width:100%;width:auto;height:auto;max-height:200px;object-fit:contain}   /* [2026-10-03 사용자 결정 2-2] 미리보기는 작게(200px) — 고해상도 캡처는 픽셀이 실제의 1.5~2배라 원래 크기로도 본문보다 커 보였다 · 누르면 퀵 프리뷰 */
.fb-err{margin-bottom:12px;font-size:11.5px;color:var(--ink-soft)}
.fb-err summary{cursor:pointer;font-weight:700}
.fb-err pre{background:var(--tb-field);border-radius:8px;padding:10px 12px;font-size:10.5px;line-height:1.7;overflow-x:auto;margin:7px 0 0;white-space:pre-wrap}
.fb-ans{border-radius:10px;padding:12px 14px;font-size:13px;line-height:1.7;margin:14px 0 12px}
.fb-ans b{font-weight:800}
.fb-ans.ok{background:var(--ok-soft);--postit-c:#1E8A5F}   /* 띠·모서리 = 맨 끝 「포스트잇」 블록(바탕색 유지) */
.fb-ans.no{background:var(--line-soft);--postit-c:var(--ink-faint)}
.fb-ans.doing{background:var(--warn-soft);--postit-c:#96660B}
.fb-tl{border-left:2px solid var(--line);margin:0 0 12px 6px;padding-left:15px}
.fb-tl .ev{position:relative;padding-bottom:12px}
.fb-tl .ev:before{content:"";position:absolute;left:-21px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--line);border:2px solid var(--panel)}
.fb-tl .ev.dev:before{background:var(--navy)}
.fb-tl .who{font-size:11.5px;font-weight:800;color:var(--ink)}
.fb-tl .when{font-size:10px;color:var(--ink-faint);margin-left:6px;font-weight:600}
.fb-tl .msg{font-size:13px;color:var(--ink-soft);line-height:1.7;margin-top:3px;white-space:pre-wrap}
/* 처리 */
.fb-act{border-top:1px solid var(--line-soft);padding-top:14px;margin-top:14px}
.fb-al{font-size:10.5px;font-weight:800;color:var(--ink-faint);letter-spacing:.05em;margin-bottom:10px}
.fb-sts{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:11px}
.fb-sb{font-size:11.5px;font-weight:700;padding:7px 13px;border-radius:9px;border:1.5px solid var(--line);background:var(--panel);color:var(--ink-soft);cursor:pointer;font-family:inherit}
.fb-sb.on{border-width:2px}
.fb-sb.on.done{border-color:#1E8A5F;background:var(--ok-soft);color:#1E8A5F}
.fb-sb.on.rej{border-color:var(--ink-faint);background:var(--line-soft);color:var(--ink)}
.fb-sb.on.ask{border-color:var(--navy);background:var(--sea-tint,#E7F1FB);color:var(--navy-deep)}
.fb-sb.on.doing{border-color:#96660B;background:var(--warn-soft);color:#96660B}
.fb-sub{background:var(--tb-field);border:1px solid var(--line);border-radius:10px;padding:11px 13px;margin-bottom:10px}
.fb-sub .sl{font-size:10.5px;font-weight:800;color:var(--ink-faint);margin-bottom:8px}
.fb-sub .sl i{color:var(--accent-ink);font-style:normal}
.fb-rc{display:flex;align-items:center;gap:8px;font-size:12px;padding:5px 0;color:var(--ink-soft);cursor:pointer}
.fb-rc input{display:none}
.fb-rc i{width:13px;height:13px;border-radius:50%;border:1.5px solid #C3CBD6;flex:none}
.fb-rc.on{color:var(--ink);font-weight:700}
.fb-rc.on i{border-color:var(--sb-on-ink);border-width:4px}
.fb-hint{font-size:10.5px;color:var(--ink-faint);margin-top:7px;line-height:1.65}
.fb-lock{border:1px dashed var(--line);border-radius:10px;padding:10px 12px;font-size:12px;color:var(--ink-faint);line-height:1.6;margin-top:16px}
.fb-empty{grid-column:1/-1;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:44px 20px;text-align:center;font-size:14px;font-weight:700;color:var(--ink-soft);line-height:1.9}
.fb-empty span{font-size:12.5px;font-weight:500;color:var(--ink-faint)}
@media(max-width:900px){
  .fb-wrap{grid-template-columns:1fr}
  .fb-pop{right:8px;left:8px;width:auto}
}


/* ═══ [v254] 결재 PDF 아카이브 ═══ */
.arc-wrap{padding:2px 0}
.arc-warn{background:var(--bad-bg,#FBECEA);color:var(--bad,#A32A1F);border-radius:10px;padding:12px 15px;
  font-size:13.5px;line-height:1.7;margin-bottom:14px}
.arc-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.arc-scope{font-size:12.5px;color:var(--ink-faint)}
.arc-scope b{color:var(--ink)}
.arc-chips{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.arc-chip{border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);border-radius:999px;
  padding:5px 13px;font-size:12.5px;font-weight:600;cursor:pointer}
.arc-chip:hover{background:var(--hover)}
.arc-chip.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.arc-chip .n{opacity:.7;font-weight:500;margin-left:3px}
/* [v269] 유형 칩 줄 — 소관 칩 아래 한 줄, 작은 칩·보라 강조(소관=파랑과 구분) */
.arc-types{margin:-4px 0 12px;justify-content:flex-start;align-items:center}
.arc-tylab{font-size:12px;color:var(--ink-faint);margin-right:2px}
.arc-chip.ty{padding:4px 11px;font-size:12px}
.arc-chip.ty.on{background:#5B3A8C;border-color:#5B3A8C}
.arc-filter{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--panel);
  border:1px solid var(--line);border-radius:12px;padding:11px 14px;margin-bottom:10px}
.arc-filter label{font-size:12.5px;color:var(--ink-faint);display:flex;align-items:center;gap:6px}
.arc-filter input[type=date]{padding:6px 9px}
.arc-filter .tilde{color:var(--ink-faint)}
.arc-filter #arcQ{flex:1;min-width:180px;padding:7px 11px}
.arc-go,.arc-zip{border:none;border-radius:9px;padding:8px 15px;font-size:12.5px;font-weight:700;cursor:pointer}
.arc-go{background:var(--accent);color:#fff}
.arc-zip{background:var(--ink);color:var(--panel)}
.arc-zip:hover,.arc-go:hover{opacity:.9}
.arc-cnt{font-size:12px;color:var(--ink-faint);margin:0 0 8px 3px}
.arc-cnt .warn{color:var(--warn-ink,#8A5410)}
.arc-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.arc-tbl{width:100%;border-collapse:collapse;font-size:13px;min-width:820px}
.arc-tbl th{background:var(--hover);text-align:center;font-size:11.5px;font-weight:700;color:var(--ink-faint);
  padding:10px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.arc-tbl th.l,.arc-tbl td.l{text-align:left}
.arc-tbl td{padding:10px 8px;border-bottom:1px solid var(--line-soft);text-align:center;vertical-align:middle}
.arc-tbl tr:last-child td{border-bottom:none}
.arc-tbl td.mono{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--ink-faint);white-space:nowrap}
.arc-tbl td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.arc-tbl td.sz{color:var(--ink-faint);font-size:12px}
.arc-tbl td .sub{font-size:11.5px;color:var(--ink-faint);margin-top:2px}
.arc-dept{display:inline-block;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap}
.arc-dept.d-gm{background:#E9F0F6;color:#2B5578}
.arc-dept.d-pur{background:#EAF3EC;color:#1C6B3F}
body[data-theme="dark"] .arc-dept.d-gm{background:#1B2733;color:#8FB8DA}
body[data-theme="dark"] .arc-dept.d-pur{background:#16291D;color:#6FC08D}
.arc-btn{display:inline-block;border:1px solid var(--line);border-radius:7px;padding:4px 10px;font-size:12px;
  font-weight:600;color:var(--ink-soft);text-decoration:none;white-space:nowrap}
.arc-btn:hover{background:var(--hover)}
.arc-btn.dl{background:var(--accent);color:#fff;border-color:var(--accent)}
.arc-empty{padding:64px 20px;text-align:center;color:var(--ink-faint);font-size:15px;line-height:2}
.arc-empty .sub{font-size:12.5px;margin-top:6px}
@media(max-width:1100px){ .arc-chips{margin-left:0} .arc-filter #arcQ{min-width:120px} }

/* ═══ [v257] 승인 문서함 — 열람 감사로그 ═══ */
.arc-aud{border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);border-radius:8px;
  padding:7px 12px;font-size:12.5px;cursor:pointer;white-space:nowrap}
.arc-aud:hover{background:var(--hover)}
.arc-aud.on{background:var(--ink);color:var(--panel);border-color:var(--ink)}
.aud-panel{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:12px 14px;margin:10px 0 4px}
.aud-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px;font-size:13px}
.aud-head .sub{color:var(--ink-soft);font-size:12px}
.aud-head input{margin-left:auto;border:1px solid var(--line);background:var(--bg);color:var(--ink);
  border-radius:8px;padding:6px 10px;font-size:12.5px;min-width:220px}
.aud-scroll{max-height:max(340px,55vh);overflow:auto}   /* [2026-10-16 UI 지침 §8 큰 화면] 화면 높이를 따라(종전 340px 고정) */
.aud-tbl td{font-size:12.5px}
.aud-tbl .sub{color:var(--ink-soft);font-size:11px}
.arca-act{display:inline-block;font-size:11px;font-weight:700;border-radius:999px;padding:2px 9px}
.arca-act.a-view{background:var(--sea-tint,#E8F0FE);color:var(--navy)}
.arca-act.a-dl{background:#E5F3EC;color:#1D7A4F}
.arca-act.a-zip{background:#FDF3E0;color:#9A6B00}
.arca-act.a-deny{background:#FBECEA;color:#A32A1F}
.arca-act.a-sig{background:#EFE9FA;color:#5B3A8C}   /* [v270] 서명·독촉·취소 */
body[data-theme="dark"] .arca-act.a-sig{background:rgba(123,79,214,.22);color:#C9B6F2}
/* 다크 — 앱의 배지 관용구(반투명 어두운 알약)와 맞춘다. .arc-dept 다크 오버라이드와 같은 계열 */
body[data-theme="dark"] .arca-act.a-view{background:rgba(var(--sea-dk-rgb,141,180,255),.14);color:var(--sea-dk2,#B7D2FF)}
body[data-theme="dark"] .arca-act.a-dl{background:rgba(111,192,141,.16);color:#6FC08D}
body[data-theme="dark"] .arca-act.a-zip{background:rgba(230,174,96,.16);color:var(--warn-ink,#8A5A12)}
body[data-theme="dark"] .arca-act.a-deny{background:rgba(240,163,156,.16);color:#F0A39C}
.arc-empty.sm{padding:18px;font-size:13px}

/* [v259] 승인 문서함 — PDF 생성 대기 배지 */
.arc-pend{font-size:12px;color:var(--warn-ink,#9A6B00);background:var(--panel);border:1px dashed var(--line);border-radius:8px;padding:3px 9px;margin-left:8px}

/* ═══ [v274] 영수증 라이트박스(.rcp-*) — 토큰만 (증빙 대조 .recon .rc-* 는 2026-10-16 정리 — 만들던 옛 모달 openReconLegacy 와 함께 뺌) ═══ */
.rcp-box{width:min(1100px,100%);max-height:calc(100vh - 48px);display:flex;flex-direction:column;background:var(--panel);border-radius:14px;box-shadow:var(--shadow-lg);overflow:hidden}
.rcp-h{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line-soft);font-size:13px}
.rcp-h>b{font-size:13.5px;font-weight:800;white-space:nowrap}
.rcp-h .rcp-sub{flex:1;min-width:0;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rcp-tools{display:flex;align-items:center;gap:4px;flex:none}
.rcp-tools b{min-width:44px;text-align:center;font-size:12px;color:var(--ink-soft)}
.rcp-tools button,.rcp-nav,.rcp-x{height:28px;min-width:28px;padding:0 8px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:8px;cursor:pointer;font-family:inherit;font-size:14px;font-weight:700;line-height:1}
.rcp-tools button:hover,.rcp-nav:hover,.rcp-x:hover{border-color:var(--navy);color:var(--navy)}
.rcp-nav{font-size:18px}
.rcp-b{flex:1;min-height:0;overflow:auto;background:var(--bg);padding:12px;text-align:center}
.rcp-wrap{position:relative;display:inline-block;max-width:none;transition:width .12s}
.rcp-wrap .rcp-img{width:100%;display:block;border-radius:6px;background:var(--panel)}
.rcp-hl{position:absolute;border:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 16%,transparent);border-radius:4px;box-shadow:0 0 0 2000px color-mix(in srgb,var(--ink) 22%,transparent);pointer-events:none}
.rcp-none{padding:40px;color:var(--ink-faint)}
/* [v274] 더존 엑셀 — 사업부 셀렉트 + 버튼 한 묶음 */
.arc-xl{display:inline-flex;align-items:center;gap:6px}
.arc-xl select{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:8px;padding:6px 8px;font-family:inherit;font-size:12.5px}

/* ═══ [v275] 연차 — 본인 띠(.lv-me) · 현황 표 사업부 그룹 · 촉진 · 조정 표시 — 토큰만 ═══ */
.lv-me{--postit-c:var(--navy);padding:10px 13px;margin-bottom:10px;font-size:13px}   /* 띠·바탕·모서리 = 맨 끝 「포스트잇」 블록 · 테두리 없음(종전 1px 자리 = padding +1) */
.lv-me-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;color:var(--ink-soft)} .lv-me-h b{color:var(--ink)} .lv-me-h small{color:var(--ink-faint)}
.lv-me-tg{margin-left:auto;border:1px solid var(--line);background:var(--panel);color:var(--ink-soft);border-radius:7px;padding:3px 8px;font-size:11.5px;font-weight:700;cursor:pointer;font-family:inherit}
.lv-me-tg:hover{border-color:var(--navy);color:var(--navy)}
.lv-me-a{margin-top:5px;font-size:12.5px;color:var(--ink-soft)} .lv-me-a b{color:var(--ok-ink)} .lv-me-a b.over{color:var(--accent-ink)}
.lv-me-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.lv-me-it{font-size:12px;border:1px solid var(--line-soft);border-radius:7px;padding:3px 8px;background:var(--bg);color:var(--ink-soft)}
.lv-me-it i{font-style:normal;font-weight:800;margin-left:3px} .lv-me-it i.ok{color:var(--ok-ink)} .lv-me-it i.wait{color:var(--warn-ink)} .lv-me-it i.plan{color:var(--navy)}
.lv-tg{font-weight:800;color:var(--warn-ink);white-space:nowrap} .lv-tg.ok{color:var(--ok-ink)} .lv-tg.warn{color:var(--accent-ink)} .lv-tg small{font-weight:600;color:var(--ink-faint)}
/* [2026-09-22 (9)] 근태 현황 — 사람 행 펼침 */
.lv-rec{width:100%;border-collapse:collapse;font-size:12.5px;background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.lv-rec th{background:var(--line-soft);color:var(--ink-soft);font-weight:700;padding:6px 10px;text-align:left;font-size:11.5px}
.lv-rec td{padding:6px 10px;border-top:1px solid var(--line-soft)} .lv-rec td small{color:var(--ink-faint)}
.lv-rec a{color:var(--navy);font-weight:700;text-decoration:underline}
.lv-nd{font-size:11px;font-weight:700;color:var(--ink-faint);background:var(--line-soft);border-radius:5px;padding:2px 7px}
.lv-dd{font-size:11px;font-weight:700;color:var(--warn-ink)}
.lv-pend{font-size:11px;font-weight:700;color:var(--ink-faint)}
.lv-rec-sum{margin-top:6px;font-size:12px;color:var(--ink-soft)} .lv-rec-empty{font-size:12.5px;color:var(--ink-faint)}
/* [2026-10-01 AI 안전장치] 영수증 AI 판독 근거 — 판단 옆 회색 작은 글씨 한 줄(OCR 표 상호 칸 · 검토창) */
.ai-why{display:block;margin-top:2px;font-size:11.5px;font-weight:400;line-height:1.4;color:var(--ink-faint);overflow-wrap:anywhere}
.rv-fields .ai-why{margin:-2px 0 6px}

/* ═══ [2026-10-13 명함 신청] 화면 — 프로토타입 v4 CSS 를 bz- 접두어로 옮김(.tag·.chip·.tabs·.steps·.bar·.st·.mini·.ph·.empty·.btn·.none 은 F2 에 이미 있는 이름) ═══
   버튼은 F2 공용 .btn(primary·ok·sm) · 빨간 테두리 버튼만 .btn.bz-bad · 색은 F2 변수 + 이 화면 전용 --bz-* (다크는 아래에서 바꿈)
   ⚠️ 명함(.bz-bc) 앞면 위치·크기(cqw)는 실물 명함 스캔(300dpi)에 Pretendard 를 맞춘 값 — 숫자를 바꾸지 말 것. 명함·신청서(종이)는 다크에서도 흰 종이 그대로 */
.bz{--bz-blue-bg:var(--sea-tint,#EAF2FF);--bz-ok:#1F8A57;--bz-ok-bg:#E6F6EC;--bz-warn:#A96F00;--bz-warn-bg:#FFF4DB;--bz-bad:#B3261E;--bz-bad-bg:#FDECEA;--bz-sel:var(--sea-hover,#F1F6FF);--bz-hover:#F7FAF8}
body[data-theme="dark"] .bz{--bz-blue-bg:rgba(var(--sea-dk-rgb,141,180,255),.16);--bz-ok:#5CC48F;--bz-ok-bg:#16332A;--bz-warn:#E0B054;--bz-warn-bg:#3A2D12;--bz-bad:#F08C84;--bz-bad-bg:#3B1E1C;--bz-sel:rgba(var(--sea-dk-rgb,141,180,255),.10);--bz-hover:#1E2530}
.bz .bz-vh{display:flex;align-items:flex-end;gap:16px;margin-bottom:14px;flex-wrap:wrap}
.bz .bz-vh p{margin:0;color:var(--ink-soft);font-size:13.5px}
.bz-panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;min-width:0}
.bz-ph{display:flex;align-items:center;gap:10px;padding:13px 18px;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.bz-ph h3{margin:0;font-size:14.5px;font-weight:800}
.bz-ph .bz-sub{margin-left:auto;font-size:12px;color:var(--ink-faint)}
.bz-pad{padding:16px 18px}
.bz-empty{padding:28px 16px;text-align:center;color:var(--ink-faint);font-size:13px}
.btn.bz-bad{color:var(--bz-bad);border-color:color-mix(in srgb,var(--bz-bad) 35%,transparent)}
.bz .btn:disabled{opacity:.45;cursor:not-allowed}
.bz-tag{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;border-radius:6px;padding:1px 7px;white-space:nowrap}
.bz-tag.ok{background:var(--bz-ok-bg);color:var(--bz-ok)}
.bz-tag.warn{background:var(--bz-warn-bg);color:var(--bz-warn)}
.bz-tag.bad{background:var(--bz-bad-bg);color:var(--bz-bad)}
.bz-tag.blue{background:var(--bz-blue-bg);color:var(--navy-deep)}
.bz-tag.gray{background:var(--line-soft);color:var(--ink-soft)}
body[data-theme="dark"] .bz-tag.blue{color:var(--sea-dk2,#9CC0FF)}
/* 탭 */
.bz-tabs{display:flex;gap:4px;background:var(--line-soft);border-radius:11px;padding:4px;width:max-content;max-width:100%;overflow-x:auto;margin-bottom:14px}
.bz-tabs button{border:0;background:transparent;border-radius:8px;padding:7px 14px;font-weight:700;font-size:13px;color:var(--ink-soft);display:flex;gap:6px;align-items:center;white-space:nowrap;cursor:pointer}
.bz-tabs button.on{background:var(--panel);color:var(--navy-deep);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.bz-tabs .c{font-size:11px;background:var(--line);color:var(--ink-soft);border-radius:9px;padding:0 7px}
.bz-tabs button.on .c{background:var(--bz-blue-bg);color:var(--navy-deep)}
body[data-theme="dark"] .bz-tabs button.on{color:var(--sea-dk2,#9CC0FF)}
/* 신청 */
.bz-g6{display:grid;grid-template-columns:minmax(0,1fr) clamp(420px,30%,720px);gap:16px;align-items:stretch}   /* [2026-10-16 사용자 B1] 왼쪽 한 패널(단계 · 찍히는 값 · 1~4 입력 · 신청서 · 신청) | 오른쪽 명함 앞·뒤 위아래 — 두 칸 높이 같음(§5) · 오른쪽 = 폭의 30%(420~720px) */
.bz-steprow .bz-rsteps{flex-direction:row;padding:14px 18px;gap:8px;border-bottom:1px solid var(--line-soft)}
.bz-steprow .bz-rsteps li{flex:1 1 0;min-width:0}
.bz-steprow .bz-rvals{border-top:0;padding:12px 18px;border-bottom:1px solid var(--line-soft)}
.bz-rsteps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.bz-rsteps li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;font-size:13.5px}
.bz-rsteps .n{width:22px;height:22px;border-radius:50%;background:var(--line-soft);color:var(--ink-soft);font-size:11px;font-weight:700;display:grid;place-items:center;flex:none}
.bz-rsteps b{font-weight:700;color:var(--ink-soft)}
.bz-rsteps .v{margin-left:auto;font-size:12px;color:var(--ink-faint);text-align:right}
.bz-rsteps li.done{background:var(--line-soft)}
.bz-rsteps li.done .n{background:var(--bz-ok);color:#fff}
.bz-rsteps li.done b{color:var(--ink)}
.bz-rsteps li.done .v{color:var(--ink-soft)}
.bz-rsteps li.now{background:var(--bz-blue-bg)}
.bz-rsteps li.now .n{background:var(--navy);color:#fff}
.bz-rsteps li.now b,.bz-rsteps li.now .v{color:var(--navy-deep)}
.bz-rsteps li.bad .v{color:var(--bz-bad);font-weight:700}
body[data-theme="dark"] .bz-rsteps li.now b,body[data-theme="dark"] .bz-rsteps li.now .v{color:var(--sea-dk2,#9CC0FF)}
.bz-rvals{border-top:1px solid var(--line-soft);padding-top:12px;display:flex;flex-direction:column;gap:8px;font-size:12.5px}
.bz-rvals .h{font-weight:700}
.bz-vchips{display:flex;flex-wrap:wrap;gap:6px}
.bz-vchip{display:inline-flex;align-items:baseline;gap:5px;border-radius:999px;padding:3px 10px;background:var(--line-soft);white-space:nowrap;max-width:100%}
.bz-vchip small{font-size:11px;color:var(--ink-faint);flex:none;white-space:nowrap}   /* 이름표는 안 줄어듦 — 주소 칩에서 「주|소」로 끊겼다(check_ui_text ①) */
.bz-vchip b{font-weight:700;min-width:0}
.bz-vchip.w{white-space:normal;border-radius:10px}   /* 주소는 길어서 칩 안에서 낱말 단위로 줄바꿈 */
.bz-vchip.miss b{color:var(--bz-bad)}
.bz-go{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:16px 18px}   /* 왼쪽 패널 맨 아래 · 오류 줄은 버튼 위 한 줄 */
.bz-go .btn{min-height:42px;min-width:300px;justify-content:center;font-size:14px}
.bz-go .err{flex-basis:100%;font-size:12.5px;font-weight:700;color:var(--bz-bad)}
.bz-go .err:empty{display:none}
.bz-gonote{margin:0;font-size:12px;color:var(--ink-faint);display:flex;flex-direction:column;gap:2px}
.bz-main{display:flex;flex-direction:column}
.bz-ph0{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.bz-ph0 h3{margin:0;font-size:14.5px;font-weight:800}
.bz-ph0 .bz-sub{font-size:12px;color:var(--ink-faint)}
.bz-row{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap}
.bz-row .bz-st{margin-bottom:0}
.bz-row .bz-lockline{flex:1 1 320px}
.bz-hist .bz-my{padding:10px 0}
.bz-main > .bz-sec{border-bottom:1px solid var(--line-soft)}
.bz-main > .bz-sec:last-child{border-bottom:0}
.bz-sec{padding:16px 18px;border-bottom:1px solid var(--line-soft)}
.bz-sec:last-of-type{border-bottom:0}
.bz-st{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px;margin-bottom:11px}
.bz-st .n{width:21px;height:21px;border-radius:50%;background:var(--bz-blue-bg);color:var(--navy-deep);font-size:11.5px;display:grid;place-items:center;flex:none}
.bz-st .bz-tag{margin-left:auto}
.bz-st .bz-opt-s{font-size:12px;color:var(--ink-faint);font-weight:600}
.bz-chips{display:flex;flex-wrap:wrap;gap:7px}
.bz-chip{border:1.5px solid var(--line);background:var(--panel);border-radius:20px;padding:7px 14px;font-size:13px;font-weight:700;color:var(--ink-soft);cursor:pointer}
.bz-chip.on{border-color:var(--navy);background:var(--bz-blue-bg);color:var(--navy-deep)}
.bz-kv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 24px;font-size:13.5px;margin:0}   /* [2026-10-16 안 5] 3열 · 이름표 위 값 아래 */
.bz-kv > div{display:flex;flex-direction:column;gap:2px;min-width:0}
.bz-kv > .w2{grid-column:span 2}
.bz-kv > .w3{grid-column:1 / -1}
.bz-kv dt{color:var(--ink-faint);font-weight:600;font-size:12px}
.bz-kv dd{margin:0;font-weight:600;min-width:0;overflow-wrap:anywhere}
.bz-kv dd.miss{color:var(--bz-bad)}
.bz-hint{margin:9px 0 0;font-size:12px;color:var(--ink-faint);text-wrap:pretty}
.bz-fl{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-top:12px}
.bz-fl .lab{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}   /* 이름표·작은 글씨 = 글자 바닥선 맞춤(가운데 맞춤은 글씨 크기가 달라 어긋남 · 사용자 2026-10-14) */
.bz-fl small{font-weight:600;color:var(--ink-faint)}
.bz-fl input[type=text],.bz-fl textarea{border:1.5px solid var(--line);border-radius:9px;padding:8px 11px;font-size:14px;font-weight:600;color:var(--ink);background:var(--panel);width:100%;outline:none}
.bz-fl input:focus,.bz-fl textarea:focus{border-color:var(--navy-2)}
.bz-fl input:disabled{background:var(--line-soft);color:var(--ink-faint)}
.bz-fl textarea{resize:vertical;font-weight:500}
.bz-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bz-pin{display:flex;gap:6px;align-items:center}
.bz-pin input[type=text]{flex:1;min-width:0}
.bz-none{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:var(--ink-soft);white-space:nowrap;cursor:pointer}
.bz-linkb{border:0;background:none;color:var(--navy-deep);font-size:11.5px;font-weight:700;padding:0;text-decoration:underline;cursor:pointer}
body[data-theme="dark"] .bz-linkb{color:var(--sea-dk2,#9CC0FF)}
.bz-opts{display:flex;flex-direction:column;gap:12px}
.bz-opt{border:1.5px solid var(--line);border-radius:12px;padding:12px 14px}
.bz-opt.on{border-color:color-mix(in srgb,var(--navy) 35%,transparent);background:color-mix(in srgb,var(--navy) 4%,var(--panel))}
.bz-sw{display:flex;align-items:center;gap:10px;font-weight:800;font-size:13.5px;cursor:pointer;position:relative}
.bz-sw input{position:absolute;opacity:0;width:1px;height:1px}
.bz-sw i{width:36px;height:21px;border-radius:11px;background:#CDD6D1;position:relative;flex:none;transition:background .15s;font-style:normal}
.bz-sw i::after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.bz-sw input:checked + i{background:var(--navy)}
.bz-sw input:checked + i::after{transform:translateX(15px)}
.bz-sw input:focus-visible + i{outline:2.5px solid var(--navy-2);outline-offset:2px}
.bz-sw small{font-weight:600;color:var(--ink-faint);font-size:12px}
.bz-lockline{display:flex;gap:8px;align-items:center;background:var(--line-soft);border-radius:10px;padding:10px 12px;font-size:12.5px;color:var(--ink-soft);font-weight:600}
.bz-memo{border:1.5px solid var(--line);border-radius:9px;padding:8px 11px;font-size:14px;color:var(--ink);background:var(--panel);width:100%;outline:none;resize:vertical;font-family:inherit}
.bz-memo:focus{border-color:var(--navy-2)}
.bz-banner{margin:14px 18px 0;padding:10px 13px;border-radius:10px;font-size:13px;font-weight:600;text-wrap:pretty}
.bz-banner.warn{background:var(--bz-warn-bg);color:var(--bz-warn)}
.bz-banner.bad{background:var(--bz-bad-bg);color:var(--bz-bad)}
.bz-banner.blue{background:var(--bz-blue-bg);color:var(--navy-deep)}
body[data-theme="dark"] .bz-banner.blue{color:var(--sea-dk2,#9CC0FF)}
.bz-pvcol{display:flex;flex-direction:column;padding:16px 18px;min-width:0}
.bz-cards1{display:flex;flex-direction:column;gap:16px}   /* [2026-10-16 B1] 앞·뒤(임원 영문 면) 위아래 · 칸 폭 그대로(카드 안 cqw 값은 그대로) */
.bz-cards1 figure{margin:0;min-width:0}
.bz-cards1 figcaption{font-size:11.5px;color:var(--ink-faint);font-weight:700;margin-bottom:6px}
/* 실물 명함 — 90×50mm · 위치·크기는 스캔(300dpi)에 Pretendard 를 맞춘 값(cqw = 카드 폭 1%) · ⚠️ 숫자 바꾸지 말 것 */
.bz-bc{aspect-ratio:90/50;container-type:inline-size;position:relative;overflow:hidden;background:#fff;color:#3B3B3B;border-radius:5px;border:1px solid #DCE3DF;box-shadow:0 8px 20px rgba(19,27,22,.10);font-family:'Pretendard Variable','Pretendard',sans-serif}
.bz-bc > *{position:absolute;white-space:nowrap;line-height:1}
.bz-bc .lg{left:65.4cqw;top:4.4cqw;width:32.1cqw}
.bz-bc .nm{left:4.6cqw;top:11.8cqw;font-size:4.9cqw;font-weight:800;letter-spacing:.53em}
.bz-bc .nm .hj{font-size:.56em;font-weight:600;letter-spacing:.12em;color:#6A6A6A;margin-left:-.2em}
.bz-bc .dp{left:4.6cqw;top:17.5cqw;font-size:2.93cqw;font-weight:700}
.bz-bc .co{left:4.6cqw;top:30.4cqw;font-size:2.85cqw;font-weight:700;letter-spacing:-.05em}
.bz-bc .ad{left:4.6cqw;top:34.6cqw;font-size:2.6cqw;font-weight:500;letter-spacing:.03em}
.bz-bc .c1,.bz-bc .c2{left:4.6cqw;font-size:2.76cqw;font-weight:500;color:#494949}
.bz-bc .c1{top:40.4cqw}.bz-bc .c2{top:44.7cqw}
.bz-bc .c1 b,.bz-bc .c2 b{font-weight:700;margin-right:.3em}
.bz-bc .c1 .em{position:absolute;left:32.8cqw;top:0}
.bz-bc .url{left:0;right:0;bottom:0;height:3.9cqw;background:#4D4A50;color:#fff;font-weight:700;font-size:2.66cqw;display:flex;align-items:center;justify-content:flex-end;padding-right:7.5cqw}
.bz-bc.en .nm{letter-spacing:.02em;font-size:4.5cqw}
.bz-bc.en .dp{font-size:2.6cqw}
.bz-bc.en .ad{font-size:2.35cqw}
.bz-bc.en .co,.bz-bc.en .ad{letter-spacing:0}
.bz-bc.back{background:#4C4D53;border-color:#4C4D53}
.bz-bc.back .lg{left:32.1cqw;top:17.3cqw;width:34.8cqw}
.bz-bc .ph-x{color:#B9C1BC;font-style:normal}
.bz-bar{display:flex;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid var(--line-soft);background:color-mix(in srgb,var(--line-soft) 45%,var(--panel));border-radius:0 0 14px 14px;flex-wrap:wrap}
.bz-bar .err{color:var(--bz-bad);font-size:12.5px;font-weight:700}
.bz-bar .btn{margin-left:auto}
.bz-my{padding:12px 18px;border-bottom:1px solid var(--line-soft)}
.bz-my:last-child{border-bottom:0}
.bz-my .t{display:flex;align-items:center;gap:8px;font-weight:700;font-size:13.5px;flex-wrap:wrap}
.bz-my .t .bz-tag:last-child{margin-left:auto}
.bz-my .s{font-size:12px;color:var(--ink-faint);margin-top:2px}
.bz-my .nt{font-size:12px;color:var(--bz-bad);margin-top:4px;font-weight:600}
.bz-steps{display:flex;align-items:center;margin-top:10px}
.bz-steps .d{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--ink-faint);width:52px;flex:none}
.bz-steps .d i{width:12px;height:12px;border-radius:50%;border:2px solid #C9D3CD;background:var(--panel)}
.bz-steps .d.on{color:var(--bz-ok)}
.bz-steps .d.on i{background:var(--bz-ok);border-color:var(--bz-ok)}
.bz-steps .d.now{color:var(--navy-deep)}
.bz-steps .d.now i{border-color:var(--navy);box-shadow:0 0 0 3px var(--bz-blue-bg)}
.bz-steps .ln{flex:1;height:2px;background:#DCE3DF;margin:0 -16px 15px;min-width:10px}
.bz-steps .ln.on{background:var(--bz-ok)}
/* 대상 찾기(관리부 대리 신청) */
.bz-tgt{padding:14px 18px;margin-bottom:16px;display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.bz-tgt .lab{font-weight:800;font-size:13.5px;padding-top:8px;white-space:nowrap}
.bz-srch{position:relative;flex:1;min-width:240px;max-width:420px}
.bz-srch input{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:9px 12px 9px 34px;font-size:14px;font-weight:600;outline:none;background:var(--panel);color:var(--ink)}
.bz-srch input:focus{border-color:var(--navy-2)}
.bz-srch svg{position:absolute;left:11px;top:11px;width:16px;height:16px;stroke:var(--ink-faint);fill:none;stroke-width:2}
.bz-sug{display:flex;flex-direction:column;margin-top:6px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel)}
.bz-sug:empty{display:none}
.bz-sug button{border:0;background:var(--panel);color:var(--ink);text-align:left;padding:9px 12px;display:flex;gap:8px;align-items:center;border-bottom:1px solid var(--line-soft);font-size:13.5px;cursor:pointer}
.bz-sug button:last-child{border-bottom:0}
.bz-sug button:hover{background:var(--bz-sel)}
.bz-sug small{color:var(--ink-faint);font-size:12px}
.bz-who{display:flex;align-items:center;gap:8px;background:var(--bz-blue-bg);color:var(--navy-deep);border-radius:10px;padding:8px 12px;font-weight:800}
.bz-who small{color:var(--ink-soft);font-weight:600}
body[data-theme="dark"] .bz-who{color:var(--sea-dk2,#9CC0FF)}
/* 양식 줄(관리부 신청서 그대로) — 종이색 그대로
   ⚠️ table.bz-ft 로 한 단계 높여 둔다 — 관리부 처리 표(.bz-tbl th · .bz-det td) 안에 펼쳐 넣으면 바깥 규칙(왼쪽 정렬 · 큰 여백 · 바탕)이 새어 들어왔다(사용자 지적 「제목 중앙정렬」) */
.bz-fx{overflow-x:auto}
table.bz-ft{border-collapse:collapse;width:100%;min-width:900px;table-layout:fixed;font-size:11.5px;background:#fff;color:#131B16}
table.bz-ft th,table.bz-ft td{border:1px solid #8E9A94;padding:4px 5px;text-align:center;vertical-align:middle;height:27px;word-break:keep-all;overflow-wrap:anywhere;background:#fff;color:#131B16;font-size:11.5px;font-weight:500}
table.bz-ft thead th{background:#E6E9E7;font-weight:800;font-size:11px}
table.bz-ft tbody th{font-weight:800;background:#FAFBFA}
/* 빈칸 — [2026-10-13 사용자 결정 ⑲-2] 빗금(거슬림) 대신 연한 (푸른) 회색 채우기 · 제목 줄(E6E9E7 · 엑셀 양식 D9D9D9)과 구분되는 색 = 서버 BIZ_BLANK_RGB(발주 엑셀·승인함 PDF 같은 색) */
table.bz-ft td.dg{background:#EDF2FA;-webkit-print-color-adjust:exact;print-color-adjust:exact}
table.bz-ft td.ad{font-size:10.5px}
table.bz-ft td.nb{white-space:nowrap;font-size:10.5px;letter-spacing:-.01em}
table.bz-ft .nw{white-space:nowrap}   /* 전화·팩스·휴대전화 = 한 줄(번호 중간에서 줄이 바뀌지 않게 · UI 지침 낱말 끊김) */
table.bz-ft tr.gap td,table.bz-ft tr.gap th{border-top:2px solid #4B5751}
/* 관리부 처리 */
.bz-tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.bz-tbl th{font-size:11.5px;color:var(--ink-faint);font-weight:700;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.bz-tbl td{padding:11px 12px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.bz-tbl tr.rw{cursor:pointer}
.bz-tbl tr.rw:hover td{background:var(--bz-hover)}
.bz-tbl tr.rw.sel td{background:var(--bz-sel)}
.bz-tbl .who b{font-weight:800}
.bz-tbl .who small{display:block;color:var(--ink-faint);font-size:12px}
.bz-tbl .who .bz-tag{margin-left:4px}
.bz-tbl input[type=checkbox]{width:17px;height:17px;accent-color:var(--navy)}
.bz-tbl .chev{transition:transform .15s;width:16px;height:16px;stroke:var(--ink-faint);fill:none;stroke-width:2}
.bz-tbl tr.rw.open .chev{transform:rotate(180deg)}
.bz-det > td{background:color-mix(in srgb,var(--line-soft) 45%,var(--panel));padding:14px 16px 16px}   /* > — 안에 넣은 신청서 칸까지 번지지 않게 */
.bz-det-g{display:flex;flex-direction:column;gap:12px}
.bz-ed{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.bz-ed .bz-fl{margin:0;flex:1;min-width:200px}
.bz-ed .note{flex-basis:100%;font-size:12.5px;color:var(--ink-soft)}
.bz-ed .btn{margin-left:auto}
.bz-flags{display:flex;flex-wrap:wrap;gap:4px}
.bz-bcard{display:flex;align-items:center;gap:16px;padding:14px 18px;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.bz-bcard:last-child{border-bottom:0}
.bz-bcard .t b{font-weight:800}
.bz-bcard .t small{display:block;color:var(--ink-faint);font-size:12px}
.bz-bcard .acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.bz-mini{display:flex;gap:4px;flex-wrap:wrap}
.bz-mini span{font-size:11px;font-weight:700;border-radius:7px;padding:3px 8px;background:var(--line-soft);color:var(--ink-faint)}
.bz-mini span.on{background:var(--bz-ok-bg);color:var(--bz-ok)}
.bz-mini span.now{background:var(--bz-blue-bg);color:var(--navy-deep)}
/* 결재(검토·승인) */
.bz-queue{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:16px}
.bz-qc{border:1.5px solid var(--line);background:var(--panel);color:var(--ink);border-radius:12px;padding:13px 15px;text-align:left;cursor:pointer}
.bz-qc.on{border-color:var(--navy);box-shadow:0 0 0 3px var(--bz-blue-bg)}
.bz-qc b{display:block;font-weight:800}
.bz-qc small{color:var(--ink-faint);font-size:12px}
.bz-qc .bz-mini{margin-top:8px}
/* 신청서(종이) — 흰 종이 그대로 */
.bz-papers{background:#F2F5F3}
.bz-paper{background:#fff;color:#131B16;border:1px solid #CFD8D3;box-shadow:0 10px 30px rgba(19,27,22,.08);border-radius:4px;padding:26px 30px 30px;margin:0 auto 16px;min-width:960px}
.bz-pp-title{text-align:center;font-size:24px;font-weight:800;letter-spacing:.5em;margin:4px 0 18px;padding-left:.5em}
.bz-pp-top{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:12px}
.bz-sign{border-collapse:collapse;font-size:11px}
.bz-sign th,.bz-sign td{border:1px solid #4B5751;text-align:center}
.bz-sign th{padding:2px 0;width:62px;font-weight:700}
.bz-sign th.v{width:22px;line-height:1.25;font-size:11px}
.bz-sign td{height:50px;vertical-align:middle}
.bz-stamp{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;border:2px solid #D2483B;color:#D2483B;font-size:10.5px;font-weight:800;transform:rotate(-8deg);line-height:1}
.bz-sign small{display:block;font-size:9.5px;color:#65726B;margin-top:1px}
.bz-pp-no{font-size:11.5px;color:#65726B;font-weight:600;text-align:right}
.bz-pp-no b{color:#131B16;font-weight:800}
.modal.bz-modal{max-width:1080px;width:calc(100vw - 32px)}
.modal.bz-modal .modal-b{overflow-x:auto}
.bz-ask ul{margin:8px 0 0;padding-left:18px;font-size:13px;color:var(--ink-soft)}
@media (max-width:1100px){.bz-g6{grid-template-columns:1fr}.bz-pvcol{order:-1}.bz-steprow .bz-rsteps{flex-wrap:wrap}.bz-steprow .bz-rsteps li{flex:1 1 40%}}   /* 좁으면 한 줄 — 미리보기 먼저, 입력·신청은 아래 */
@media (max-width:760px){.bz-two{grid-template-columns:1fr}.bz-tbl .hide-s{display:none}.bz-kv{grid-template-columns:minmax(0,1fr)}.bz-kv > .w2{grid-column:auto}}
/* 인쇄 — 신청서 창을 띄우고 「인쇄 · PDF」를 눌렀을 때만(body.bz-print) · 다른 화면 인쇄는 그대로 */
@media print{
  body.bz-print > *:not(#modalRoot){display:none!important}
  body.bz-print #modalRoot .overlay{position:static;background:none;padding:0;display:block}
  body.bz-print .modal.bz-modal{box-shadow:none;max-width:none;width:auto;border:0}
  body.bz-print .modal.bz-modal .modal-h,body.bz-print .modal.bz-modal .modal-f{display:none}
  body.bz-print .bz-papers{background:none}
  body.bz-print .bz-paper{box-shadow:none;border:0;page-break-after:always;min-width:0;page:bzland}
}
@page bzland{size:A4 landscape;margin:10mm}   /* 이름 붙인 페이지 — 신청서(.bz-paper)에만 가로 A4 · 다른 화면 인쇄 용지는 그대로 */

/* ═══ [2026-10-19 ⑭-1] 법인카드 대조(corp-recon.js) — 카드 띠(위) · 결제 표(왼쪽) · 문서에 추가(오른쪽) · 문서 항목표 카드사 칩
   10-17 목업 안 「다」 · 고른 줄은 바탕색만(왼쪽 막대 없음 — UI 지침 3) · 색은 F2 변수 + 이 화면 전용 --cr-*(다크는 아래) ═══ */
.cr{--cr-ok:#1F8A57;--cr-ok-bg:#E6F6EC;--cr-warn:#9A6200;--cr-warn-bg:#FFF4DB;--cr-bad:#B3261E;--cr-bad-bg:#FDECEA;--cr-sel:var(--sea-hover,#F1F6FF);display:flex;flex-direction:column;gap:16px}
body[data-theme="dark"] .cr{--cr-ok:#5CC48F;--cr-ok-bg:#16332A;--cr-warn:#E0B054;--cr-warn-bg:#3A2D12;--cr-bad:#F08C84;--cr-bad-bg:#3B1E1C;--cr-sel:rgba(var(--sea-dk-rgb,141,180,255),.14)}
.cr-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cr-ym{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--ink-soft)}
.cr-ym select{font:inherit;font-size:14px;font-weight:700;height:38px;padding:0 12px;border:1.5px solid var(--line);border-radius:9px;background:var(--panel);color:var(--ink)}
.cr-sp{flex:1}
.cr-closed{font-size:13px;font-weight:700;color:var(--ink-soft);background:var(--line-soft);border-radius:8px;padding:6px 10px}
.cr-pane{background:var(--panel);border:1px solid var(--line);border-radius:14px;min-width:0}
.cr-empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 16px;text-align:center;color:var(--ink-faint);font-size:13.5px;text-wrap:balance}
.cr-empty b{color:var(--ink);font-size:15px}
.cr-top{padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.cr-sum{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--ink-soft)}
.cr-sum>b{font-size:14.5px;color:var(--ink)}
.cr-sum b.ok{color:var(--cr-ok)}
.cr-sum b.bad{color:var(--cr-bad)}
.cr-tab{font:inherit;padding:7px 13px;border-radius:9px;border:1px solid var(--line);background:var(--panel);font-size:13px;font-weight:700;color:var(--ink-soft);cursor:pointer}
.cr-tab.on{background:var(--navy);border-color:var(--navy);color:#fff}
.cr-strip{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 8px}
.cr-card{font:inherit;flex:0 0 184px;height:104px;border-radius:12px;border:0;padding:12px 13px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;color:#fff;cursor:pointer;text-align:left;position:relative;background:var(--cc);box-shadow:var(--shadow-sm)}
.cr-card.on{outline:3px solid var(--navy);outline-offset:2px}
.cr-card .cr-chipic{width:22px;height:15px;border-radius:3px;background:#f2d38a}
.cr-card .cr-nm{display:flex;flex-direction:column;gap:2px}
.cr-card .cr-nm b{font-size:13.5px;font-weight:800}
.cr-card .cr-nm span{font-size:12px;letter-spacing:.08em;opacity:.92}
.cr-badge{position:absolute;top:10px;right:10px;min-width:22px;text-align:center;font-size:11.5px;font-weight:800;padding:2px 7px;border-radius:20px;background:#fff;color:var(--cr-bad)}
.cr-card.cr-more{background:var(--line-soft);color:var(--ink-soft);box-shadow:none;border:1.5px dashed var(--line);justify-content:center;align-items:center}
.cr-main{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch}
.cr-tblp{flex:999 1 560px;display:flex;flex-direction:column;height:max(520px, calc(100vh - 380px))}   /* 표는 칸 안에서 넘김(머리 줄 고정) — 옆 「문서에 추가」 버튼이 늘 보이게 */
.cr-ph{display:flex;align-items:baseline;gap:10px;padding:13px 18px;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.cr-ph h3{margin:0;font-size:14.5px;font-weight:800}
.cr-ph span{font-size:12px;color:var(--ink-faint)}
.cr-tw{overflow:auto;flex:1;min-height:0}
.cr-tbl{width:100%;border-collapse:separate;border-spacing:0}
.cr-tbl th{background:var(--line-soft);font-size:12px;font-weight:700;color:var(--ink-soft);text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0}
.cr-tbl td{padding:11px 14px;border-bottom:1px solid var(--line-soft);font-size:13.5px;vertical-align:middle}
.cr-tbl .r{text-align:right;font-variant-numeric:tabular-nums}
.cr-tbl td.cr-mer{font-weight:700}
.cr-tbl tr.on td{background:var(--cr-sel)}
.cr-tbl tr.cr-x td{color:var(--ink-faint)}
.cr-tbl a{color:var(--navy-deep);font-weight:700;text-decoration:none}
.cr-tbl a:hover{text-decoration:underline}
.cr-st{display:inline-block;font-size:11.5px;font-weight:800;border-radius:20px;padding:3px 9px;white-space:nowrap;background:var(--line-soft);color:var(--ink-soft)}
.cr-st.s-ok{background:var(--cr-ok-bg);color:var(--cr-ok)}
.cr-st.s-amt,.cr-st.s-other,.cr-st.s-dup,.cr-st.s-cl{background:var(--cr-warn-bg);color:var(--cr-warn)}
.cr-st.s-left,.cr-st.s-none{background:var(--cr-bad-bg);color:var(--cr-bad)}
.cr-faint{color:var(--ink-faint);font-size:12.5px}
.cr-adding{color:var(--navy);font-size:13px}
.cr-add{flex:1 1 380px;max-width:480px;max-height:max(520px, calc(100vh - 380px));display:flex;flex-direction:column;box-shadow:var(--shadow)}
.cr-x{margin-left:auto;border:0;background:none;font-size:20px;line-height:1;color:var(--ink-faint);cursor:pointer}
.cr-ab{padding:16px 18px;display:flex;flex-direction:column;gap:13px;overflow:auto;min-height:0}
.cr-line{background:var(--line-soft);border-radius:10px;padding:11px 13px;font-size:13px;line-height:1.7;display:flex;flex-direction:column}
.cr-line b{font-size:14px}
.cr-line span{color:var(--ink-soft)}
.cr-note{font-size:13px;color:var(--cr-bad);line-height:1.6}
.cr-fld{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:var(--ink-soft)}
.cr-fld input,.cr-fld select{font:inherit;font-size:14px;font-weight:500;color:var(--ink);padding:9px 11px;border:1.5px solid var(--line);border-radius:9px;background:var(--panel);width:100%;box-sizing:border-box}
.cr-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cr-prev{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:var(--ink-soft)}
.cr-pb{border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:13px;font-weight:500}
.cr-pb>div{display:flex;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line-soft);color:var(--ink-soft)}
.cr-pb>div:last-child{border-bottom:0}
.cr-pb>div.on{background:var(--cr-bad-bg);color:var(--cr-bad);font-weight:800}
.cr-pb span:first-child{width:52px;flex:none}
.cr-pb span:nth-child(2){flex:1;min-width:0}
.cr-af{margin-top:auto;padding:14px 18px;border-top:1px solid var(--line-soft);display:flex;gap:8px;justify-content:flex-end}
.cr-up p{margin:10px 0 0;font-size:13px;color:var(--ink-soft);text-wrap:pretty}
.cr-up p.cr-warn{color:var(--cr-bad)}
.cr-up .cr-tbl td,.cr-up .cr-tbl th{padding:8px 10px}
.cs-chip{display:inline-block;margin-left:6px;font-size:11px;font-weight:800;border-radius:6px;padding:1px 7px;white-space:nowrap;background:var(--ok-soft);color:var(--ok-ink)}
.cs-chip.bad{background:var(--warn-soft);color:var(--warn-ink)}
.cs-chip.madd{background:var(--accent-soft);color:var(--accent-ink)}
@media (max-width:720px){ .cr-2{grid-template-columns:1fr} .cr-add{max-width:none} }
.csm-tbl th,.csm-tbl td{padding:9px 6px;font-size:13px;white-space:nowrap}
.csm-tbl th.csm-div{background:var(--panel);text-align:center;vertical-align:middle;border-right:1px solid var(--line-soft);position:static}
.csm-tbl td.csm-u{font-weight:700}
.csm-tbl td.csm-c{color:var(--ink-soft)}
/* [2026-10-20 사용자 ②] 사용 집계 — 글자·제목 가운데 · 금액 오른쪽(천 단위 자리 맞춤) · 칸 너비 고정(월 = 99,999,999 · 소계 = 9,999,999,999 까지 안 밀림) */
.csm-tbl{table-layout:fixed;width:100%;min-width:76rem}   /* [2026-10-21 사용자 「해상도 따라 리사이징 · 11월까지만 보임」] 칸 = 화면 너비 비율(종전 고정 rem 합 109rem 이 1,744px 보다 좁은 화면을 밀어냈다) · 76rem 보다 좁을 때만 옆으로 */
.csm-tbl col.c-div{width:4.5%}.csm-tbl col.c-u{width:5.5%}.csm-tbl col.c-c{width:8%}.csm-tbl col.c-m{width:6.2%}.csm-tbl col.c-t{width:7.6%}
.csm-tbl td.r{font-variant-numeric:tabular-nums}
.csm-up{display:block;margin:4px auto 0;padding:1px 9px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink-soft);font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.csm-up:hover,.csm-up:focus-visible{border-color:var(--navy);color:var(--navy)}
.csm-tbl th,.csm-tbl th.r,.csm-tbl td{text-align:center}
.csm-tbl td.r,.csm-tbl tfoot td.r{text-align:right}
.csm-tbl td.r:not(.csm-t){font-weight:500}
.csm-tbl .csm-t{font-weight:800}
.csm-tbl tfoot th,.csm-tbl tfoot td{background:var(--line-soft);font-weight:800;border-top:1px solid var(--line)}
/* [2026-10-20 사용자 목업 ③] 부서 소계 줄 · 부서가 바뀌면 옅은 띠 */
.csm-tbl tbody tr.csm-g1 td{background:color-mix(in srgb,var(--line-soft) 55%,transparent)}
.csm-tbl tbody tr.csm-sub td,.csm-tbl tbody tr.csm-sub.csm-g1 td{background:var(--line-soft);font-weight:800;border-bottom:2px solid var(--line)}
.csm-cl{display:block;font-size:10.5px;font-weight:700;color:var(--ok-ink)}

/* ═══ [2026-10-03 사용자 결정] 포스트잇 A안 — 「얇은 둥근 왼쪽 강조 막대」(3~5px 띠 + 둥근 모서리) 대체 ═══
   모양은 여기 한 곳에서만 정한다: 연한 강조색 바탕 + 10px 사각 띠 + 살짝 뜬 그림자 (목업 mockup_postit .v1).
   · 값: variables.css --postit-*(띠 두께·글자 여백·섞는 비율·모서리·그림자) · 다크 그림자는 common.css 다크 블록.
   · 강조색: 각 대상 규칙이 --postit-c 만 준다(분류색 --sc · 계절색 --navy · 상태색 --rv-y 등) — 계절·다크가 바뀌면 띠도 따라간다.
   · 새 대상은 마크업에 class="f2-postit"(+ style="--postit-c:색") 또는 아래 목록에 선택자 추가.
   ⚠️ 이 블록은 views.css 맨 끝(= bundle.css 맨 끝)에 둔다 — 대상 규칙의 border:1px 축약형보다 뒤여야 띠가 산다.
   ⚠️ 인사평가 iframe(modules/hr/index.html)은 이 CSS 를 못 받아 같은 값을 그 파일 안에 따로 둔다.
   ⚠️ [2026-10-03 마감] 포스트잇엔 바깥 테두리가 없다 — 위·오른쪽·아래 두께 0. 1px 테두리가 남으면(투명이어도) 10px 띠와 만나는 모서리가
      비스듬히 잘려(miter) 띠 위·아래 끝이 상자 끝보다 1px 안쪽 + 사선이 된다(사용자 지적 「테두리 마감이 빠진 것」).
      · 대상 규칙에 border:1px 를 다시 넣지 말 것 — 종전 1px 자리는 각 규칙 padding +1px 로 메워 높이·폭을 그대로 뒀다.
      · 강조(hover·다음 일정 등)는 테두리색 대신 바깥 1px 링(box-shadow:0 0 0 1px 색, …) — 모서리 반경을 따라 띠까지 감싼다.
        inset 그림자·background 축약형으로 강조하면 띠 옆에 다른 색 줄이 끼거나 띠가 지워진다.
   ① 모든 대상 — 띠·모서리·그림자·안쪽 여백 · 위·오른쪽·아래 테두리 없음 */
.f2-postit,.sc-dv-ev,.scp-card,.lv-me,.sp-note,.sp-sum-b.car,.sp-sum-b.rcp,.exp-queue,
.req-banner,.rcp-edits,.fb-ans.ok,.fb-ans.no,.fb-ans.doing,#aackRoot .aack-rsnbox{
  border-left:var(--postit-w) solid var(--postit-c,var(--navy));border-top:0;border-right:0;border-bottom:0;
  border-radius:var(--postit-r);box-shadow:var(--postit-sh);padding-left:var(--postit-pl)}
/* ② 바탕이 카드색(흰 카드 · 다크 카드)이던 것 — 강조색을 카드색에 섞은 연한 바탕.
      이미 제 바탕색이 있는 상자(필수 공지 배너·수정이력·피드백 답변·근태 사유)는 ①만 — 톤 유지(다크에서 밝게 뜨는 배너는 제 규칙에서 다크 톤) */
.f2-postit,.sc-dv-ev,.scp-card,.lv-me,.sp-note,.sp-sum-b.car,.sp-sum-b.rcp,.exp-queue{
  background:color-mix(in srgb,var(--postit-c,var(--navy)) var(--postit-tint),var(--panel))}