/* ═══════════════════════════════════════════════════════════
   PARK'S STUDIO — 현대자동차 디자인 시스템(hyundai-motor.md) 적용
   ─────────────────────────────────────────────────────────
   색의 몫 (섞지 않는다)
     · 현대 블루 #002C5F  — 실행·주요 버튼, 사이드바 활성 막대, 강조 카드
     · 청록 #007FA8/#009EC3 — "지금 고른 것": 탭·체크·선택·단계
     · 샌드 #E4DCD3 / 라이트 샌드 #F6F3F2 — 나누는 선과 바탕(표 머리·목록 테두리)
   모서리 Soft(4~8px) · 그림자 거의 없음(면 + 1px 선) · 자간 -0.4px
   ※ 전용 서체 Hyundai Sans 는 비공개라 Pretendard → Apple SD Gothic Neo → 맑은 고딕 순으로 대체
═══════════════════════════════════════════════════════════ */
:root{
  /* Hyundai Blue */
  --navy:#002C5F;--navy-600:#002651;--navy-700:#001F44;--navy-50:#E6EAEF;--navy-100:#CCD5DF;--navy-400:#4D6B8F;
  /* 선택·활성 청록 */
  --teal:#007FA8;--teal-lt:#E6F6FA;--teal-dk:#29789C;--control:#009EC3;
  /* CI 보조색 */
  --sand:#E4DCD3;--sand-lt:#F6F3F2;--gold:#A36B4F;--active-red:#E63312;--active-blue:#00AAD2;

  /* 앱 공통 토큰 (기존 이름 유지 → 값만 현대 팔레트로) */
  --bg:#F4F5F6;--white:#fff;--surface:#F6F3F2;--border:#E5E5E5;--border2:#B1B1B1;
  --text:#000000;--text2:#444444;--text3:#767676;
  --accent:var(--navy);--accent-lt:var(--navy-50);--accent-dk:var(--navy);
  --green:var(--control);--green-lt:var(--teal-lt);
  --red:var(--active-red);--red-lt:#FDF0EC;
  --orange:var(--gold);--orange-lt:var(--sand-lt);
  --yellow:#C9A227;
  --purple:var(--navy-400);--purple-lt:var(--navy-50);
  --sky:var(--teal);--sky-lt:var(--teal-lt);
  --pink:var(--navy-400);--pink-lt:var(--navy-50);
  --up:#E63312;--down:#1F5FBF;
  --c-in:var(--navy);--c-out:var(--active-red);--c-goal:var(--gold);
  --sh0:none;
  --sh1:0 1px 2px 2px rgba(0,0,0,.08);
  --sh2:0 2px 6px 2px rgba(0,0,0,.1);
  --r:5px;--rl:8px;
  --font:'Pretendard','Apple SD Gothic Neo','Malgun Gothic','맑은 고딕','Segoe UI',Arial,sans-serif;--mono:var(--font);
  --ls:-0.4px;
  --dur:300ms;--ease:cubic-bezier(0.25,0.1,0.25,1);
  --sbw:236px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg);color:var(--text);overflow:hidden;letter-spacing:var(--ls)}
button,input,select,textarea{font-family:var(--font);letter-spacing:var(--ls)}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--control)}
.ico-svg{display:inline-block;vertical-align:-0.2em;flex-shrink:0}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-thumb{background:#CECDCA;border-radius:3px}
::-webkit-scrollbar-track{background:transparent}
a{color:var(--navy)}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

#app{display:flex;height:100vh;height:100dvh;overflow:hidden}

/* ── SIDEBAR (현대닷컴 GNB 방식: 흰 면 · 활성 4px 남색 막대) ── */
#sb{width:var(--sbw);flex-shrink:0;background:var(--white);border-right:1px solid var(--border);display:flex;flex-direction:column;height:100%;z-index:50}
.sb-logo{height:64px;padding:0 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;cursor:pointer;flex-shrink:0}
.sb-logo-ico{width:30px;height:30px;object-fit:contain;flex-shrink:0;display:block}
.sb-logo-name{font-size:14px;font-weight:700;letter-spacing:.2px;color:var(--navy)}
.sb-logo-ver{font-size:10.5px;color:var(--text3);letter-spacing:0}
.sb-nav{flex:1;overflow-y:auto;padding:8px 0 16px;display:flex;flex-direction:column}
.sb-sec{font-size:10.5px;color:var(--text3);letter-spacing:1.4px;padding:16px 20px 6px;font-weight:600;display:flex;align-items:center;justify-content:space-between;user-select:none;border-top:1px solid var(--sand-lt);margin-top:6px}
.sb-sec .sb-sec-act{background:none;border:1px solid transparent;color:var(--text3);border-radius:4px;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.sb-sec .sb-sec-act:hover{border-color:var(--navy);color:var(--navy)}
.sb-sec.sb-tog{cursor:pointer}
.sb-sec.sb-tog:hover{color:var(--navy)}
.sb-chev{display:inline-flex;transition:transform .2s var(--ease)}
.sb-sec.closed .sb-chev{transform:rotate(-90deg)}
.sb-sec.closed + .sb-body{display:none}
.sb-zone{display:flex;align-items:center;gap:7px;margin:14px 12px 2px;padding:9px 10px;border-radius:5px;cursor:pointer;user-select:none;font-size:13px;letter-spacing:0;border-left:4px solid var(--zc);background:var(--zbg)}
.sb-zone b{color:var(--zc);font-weight:700}
.sb-zone span:last-child{font-size:11px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-zone .sb-chev{color:var(--zc);transition:transform .2s var(--ease)}
.sb-zone.closed .sb-chev{transform:rotate(-90deg)}
.sb-zone.closed + .sb-zone-body{display:none}
.sb-zone-body > .sb-sec:first-child{border-top:none;margin-top:0;padding-top:10px}
.z-common{--zc:#4A565E;--zbg:#F2F2F2}
.z-pages{--zc:#1C1B1B;--zbg:#F4F5F6}
.pg-sec{letter-spacing:0;font-size:12px;color:var(--text2);font-weight:600}
.pa-dot{width:7px;height:7px;border-radius:2px;background:var(--pc);display:inline-block}
.pa-common{--pc:#4A565E}.pa-work{--pc:var(--navy)}.pa-personal{--pc:var(--gold)}
.pt-hidden{color:var(--text3);font-size:11.5px;text-decoration:none}
.pp-area i{width:8px;height:8px;border-radius:2px;background:var(--ac);display:inline-block}
.pp-area{border-color:var(--ac)!important;color:var(--ac)!important;font-weight:600}
.z-work{--zc:var(--navy);--zbg:var(--navy-50)}
.z-personal{--zc:var(--gold);--zbg:var(--sand-lt)}
.sb-link{display:flex;align-items:center;gap:10px;height:40px;padding:0 20px;cursor:pointer;color:var(--text2);font-size:13.5px;transition:background var(--dur) var(--ease),color var(--dur) var(--ease);position:relative;user-select:none;text-decoration:none}
.sb-link:hover{background:var(--sand-lt);color:var(--text)}
.sb-link.on{background:var(--sand-lt);color:var(--navy);font-weight:700}
.sb-link.on::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--navy)}
.sb-ico{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--text3)}
.sb-link.on .sb-ico,.sb-link:hover .sb-ico{color:var(--navy)}
.sb-badge{margin-left:auto;font-size:10.5px;background:var(--navy);color:#fff;border-radius:4px;padding:1px 6px;font-weight:600;letter-spacing:0}
.sb-badge.or{background:var(--gold)}.sb-badge.rd{background:var(--active-red)}.sb-badge.mut{background:#CECDCA;color:#444}
.sb-bottom{flex-shrink:0;border-top:1px solid var(--border);padding:4px 0}
.sb-foot{padding:12px 20px;border-top:1px solid var(--border);font-size:11px;color:var(--text3);display:flex;align-items:center;gap:6px}
.sb-foot .dot{width:6px;height:6px;border-radius:50%;background:var(--control)}

/* 페이지 트리 */
.ptree{padding:0 0 4px}
.pt-row{display:flex;align-items:center;gap:3px;height:34px;padding:0 10px 0 12px;cursor:pointer;color:var(--text2);font-size:13px;position:relative;user-select:none}
.pt-row:hover{background:var(--sand-lt);color:var(--text)}
.pt-row.on{background:var(--sand-lt);color:var(--navy);font-weight:700}
.pt-row.on::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--navy)}
.pt-row.drop-in{outline:2px solid var(--teal);outline-offset:-2px}
.pt-tog{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;color:var(--text3);flex-shrink:0;border:none;background:none;cursor:pointer}
.pt-tog:hover{background:var(--sand)}
.pt-tog svg{transition:transform .2s var(--ease)}
.pt-tog.open svg{transform:rotate(90deg)}
.pt-ico{width:18px;text-align:center;flex-shrink:0;font-size:13px;line-height:1}
.pt-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-acts{display:none;gap:1px}
.pt-row:hover .pt-acts{display:flex}
.pt-acts button{width:22px;height:22px;border:none;background:none;border-radius:4px;color:var(--text3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.pt-acts button:hover{background:var(--sand);color:var(--navy)}
.pt-empty{font-size:12px;color:var(--text3);padding:4px 20px 6px}
.pt-add{display:flex;align-items:center;gap:6px;height:32px;padding:0 20px;font-size:12.5px;color:var(--text3);cursor:pointer}
.pt-add:hover{background:var(--sand-lt);color:var(--navy)}

/* ── MAIN ── */
#main{flex:1;display:flex;flex-direction:column;height:100%;overflow:hidden;min-width:0}
#topbar{height:64px;background:var(--white);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 30px;gap:10px;flex-shrink:0}
.tb-menu{display:none;width:36px;height:36px;border-radius:5px;border:1px solid var(--border);background:#fff;align-items:center;justify-content:center;cursor:pointer;color:var(--text)}
.tb-title{font-size:18px;font-weight:700;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:8px}
.tb-title .ico-svg{color:var(--navy)}
.tb-crumb{color:var(--text3);font-weight:400;cursor:pointer}
.tb-crumb:hover{color:var(--navy)}
.tb-search{position:relative;display:flex;align-items:center;gap:8px;background:#F2F2F2;border:1px solid transparent;border-radius:5px;padding:0 12px;height:38px;width:280px;transition:box-shadow var(--dur) var(--ease);color:var(--text3)}
.tb-search:focus-within{background:#fff;border-color:var(--border);box-shadow:inset 0 -2px 0 var(--navy)}
.tb-search input{background:none;border:none;outline:none;font-size:13px;color:var(--text);width:100%}
.tb-search input::placeholder{color:var(--text3)}
.search-pop{position:absolute;right:0;top:calc(100% + 6px);width:380px;max-height:440px;overflow-y:auto;background:#fff;border:1px solid var(--sand);border-radius:5px;box-shadow:var(--sh2);padding:6px;z-index:200}
.sr-head{font-size:11px;font-weight:600;color:var(--text3);padding:8px 8px 4px;letter-spacing:.4px}
.sr-item{display:flex;gap:8px;align-items:center;padding:8px;border-radius:4px;cursor:pointer;font-size:13px;color:var(--text)}
.sr-item:hover,.sr-item.on{background:var(--sand-lt)}
.sr-item small{color:var(--text3);margin-left:auto;font-size:11px;white-space:nowrap}
#page-wrap{flex:1;overflow-y:auto;padding:24px 30px 48px}
#page-wrap.flush{padding:0;background:#fff}

/* ── 버튼 (현대닷컴 .btn 계열: 5px 모서리) ── */
.btn{height:36px;padding:0 16px;border-radius:var(--r);font-size:13px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease);border:1px solid transparent;white-space:nowrap;color:var(--text2);background:transparent;text-decoration:none}
.btn-p{background:var(--navy);color:#fff}
.btn-p:hover{background:var(--navy-600)}
.btn-p:active{background:var(--navy-700)}
.btn:disabled{background:#CECDCA;border-color:#CECDCA;color:#fff;cursor:default}
.btn-o{background:#fff;color:var(--navy);border-color:var(--navy)}
.btn-o:hover{background:var(--navy-50)}
.btn-o.on{background:var(--teal);border-color:var(--teal);color:#fff;font-weight:600}
.btn-r{background:#fff;color:var(--active-red);border-color:var(--active-red)}
.btn-r:hover{background:#FDF0EC}
.btn-danger{background:var(--active-red);color:#fff}
.btn-danger:hover{background:#C42A0E}
.btn-g{background:var(--teal);color:#fff}
.btn-sm{height:30px;padding:0 12px;font-size:12.5px}
.btn-ghost{background:none;color:var(--navy);padding:0 8px}
.btn-ghost:hover{background:var(--sand-lt)}
.icon-btn{width:32px;height:32px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r);border:1px solid var(--border);background:var(--white);color:var(--text);cursor:pointer;transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.icon-btn:hover{border-color:var(--navy);color:var(--navy)}
.icon-btn.sm{width:30px;height:30px}
.icon-btn.plain{border-color:transparent;background:none}
.icon-btn.plain:hover{background:var(--sand-lt);border-color:transparent;color:var(--navy)}
/* 알약 탭 (.hm-tab: 라이트 샌드 바탕 · 고른 것은 청록) */
.seg{display:inline-flex;background:var(--sand-lt);border-radius:50px;padding:3px;gap:2px}
.seg button{border:none;background:none;height:28px;padding:0 14px;border-radius:50px;font-size:12.5px;color:#6A6E72;cursor:pointer;display:inline-flex;align-items:center;gap:5px;transition:background-color .2s var(--ease),color .2s var(--ease)}
.seg button:hover{color:var(--text)}
.seg button.on{background:var(--teal);color:#fff;font-weight:600}

/* ── 카드 (면 + 1px 선, 그림자 없음) ── */
.card{background:var(--white);border:1px solid var(--border);border-radius:var(--rl);overflow:hidden}
.card-h{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;min-height:54px}
.card-title{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.card-title .ti{color:var(--navy);display:inline-flex}
.card-sub{font-size:12px;color:var(--text3);margin-top:2px}
.card-b{padding:16px 20px}
.card-h .ml{margin-left:auto;display:flex;gap:6px;align-items:center}
.sec-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.sec-ttl{font-size:26px;font-weight:700;line-height:1.3;letter-spacing:-0.6px}
.sec-sub{font-size:13px;color:var(--text3);margin-top:6px;line-height:1.6}
.sec-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.stack{display:flex;flex-direction:column;gap:16px}
.muted{color:var(--text3)}
.small{font-size:12px}
.mt{margin-top:16px}
.empty{display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--text3);font-size:13px;padding:32px 12px;text-align:center}
.chip{display:inline-flex;align-items:center;font-size:11.5px;font-weight:500;padding:1px 7px;border-radius:4px;white-space:nowrap;margin:1px 3px 1px 0;line-height:1.6;letter-spacing:-0.2px}
/* 상태 배지 (.hm-badge: 4px · 점 없음) */
.badge{display:inline-flex;align-items:center;height:20px;font-size:11.5px;font-weight:500;padding:0 7px;border-radius:4px;white-space:nowrap;letter-spacing:-0.2px}
.b-blue{background:var(--teal-lt);color:var(--teal-dk)}
.b-green{background:#EFF2F7;color:#1A4E8A}
.b-orange{background:var(--sand-lt);color:var(--gold);box-shadow:inset 0 0 0 1px var(--sand)}
.b-red{background:#FDF0EC;color:var(--active-red)}
.b-gray{background:#E8EAEB;color:#4A565E}
.b-purple{background:var(--navy);color:#fff}

/* KPI — 첫 카드(kbl)는 마이현대 원격제어 카드처럼 남색 면 */
.kpi-grid{display:grid;gap:10px;margin-bottom:14px;grid-template-columns:repeat(4,1fr)}
/* 컴팩트 카드: 왼쪽 아이콘·이름·설명, 오른쪽 숫자 */
.kpi{background:var(--white);border:1px solid var(--border);border-radius:var(--rl);padding:10px 14px;position:relative;overflow:hidden;cursor:pointer;transition:border-color var(--dur) var(--ease);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"top val" "sub val";column-gap:12px;row-gap:1px;align-items:center}
.kpi:hover{border-color:var(--navy)}
.kpi-top{grid-area:top;display:flex;align-items:center;gap:7px;min-width:0}
.kpi>.kpi-lbl{grid-area:top}
.kpi-ico{width:22px;height:22px;flex-shrink:0;border-radius:4px;display:flex;align-items:center;justify-content:center;background:var(--sand-lt);color:var(--navy)}
.kpi-ico svg{width:13px;height:13px}
.kpi.krd .kpi-ico{color:var(--active-red)}.kpi.kgr .kpi-ico{color:var(--teal)}.kpi.kor .kpi-ico{color:var(--gold)}
.kpi-lbl{font-size:12.5px;color:var(--text2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi-val{grid-area:val;font-size:22px;font-weight:500;line-height:1;letter-spacing:-.5px;white-space:nowrap;text-align:right}
.kpi-val small{font-size:14px;color:inherit;opacity:.7;font-weight:400;margin-left:2px}
.kpi-sub{grid-area:sub;font-size:11.5px;line-height:1.35;color:var(--text3);min-width:0;word-break:keep-all}
.kpi-top+.kpi-val+.kpi-sub{padding-left:29px}
.kpi.kbl{background:var(--navy);border-color:var(--navy);color:#fff!important}
.kpi.kbl .kpi-ico{background:transparent;border:1px solid rgba(255,255,255,.32);color:#fff}
.kpi.kbl .kpi-lbl{color:#fff}
.kpi.kbl .kpi-sub{color:rgba(255,255,255,.75)}
.kpi.kbl .kpi-sub span{color:#FFB4A3!important}
.kpi.kbl:hover{background:var(--navy-600)}

/* ── 폼 (.hm-input) ── */
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:2px 14px}
.fgrid .span2,.fsec{grid-column:1/-1}
.fsec{font-size:12px;font-weight:700;color:var(--navy);padding:12px 0 8px;border-bottom:1px solid var(--sand);margin-bottom:10px}
.fgrp{margin-bottom:12px;min-width:0}
.flbl{display:block;font-size:12px;font-weight:500;color:var(--text2);margin-bottom:6px}
.flbl .req{color:var(--active-red)}
.fhelp{font-size:11.5px;color:var(--text3);margin-top:4px;line-height:1.5}
.finput,.fselect,.ftextarea{width:100%;height:42px;padding:0 12px;background:#fff;border:1px solid var(--border);border-radius:4px;font-size:14px;color:var(--text);outline:none;transition:border-color .2s var(--ease)}
.finput:focus,.fselect:focus,.ftextarea:focus{border-color:var(--teal)}
.finput::placeholder,.ftextarea::placeholder{color:var(--text3)}
.ftextarea{height:auto;padding:10px 12px;resize:vertical;min-height:72px;line-height:1.6}
.fselwrap{display:flex;gap:6px}
.fselwrap .icon-btn{height:42px;width:42px}
.fcheck{display:inline-flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;height:42px}
.fcheck input{width:18px;height:18px}
.frange{display:flex;align-items:center;gap:12px;height:42px}
.frange input{flex:1}
.frange b{min-width:42px;text-align:right;font-size:14px;font-weight:600}
.fswatch{display:flex;gap:7px;align-items:center;flex-wrap:wrap;min-height:42px}
.fswatch button{width:24px;height:24px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--border);cursor:pointer}
.fswatch button.on{box-shadow:0 0 0 2px var(--teal)}
.fswatch input{width:30px;height:28px;border:none;background:none;cursor:pointer}
.fmulti{display:flex;flex-wrap:wrap;gap:6px;padding:7px;border:1px solid var(--border);border-radius:4px;background:#fff;min-height:42px}
.mchip{display:inline-flex;align-items:center;gap:3px;border:1px solid var(--border);background:#fff;color:var(--text2);border-radius:4px;font-size:12px;height:26px;padding:0 9px;cursor:pointer}
.mchip:hover{border-color:var(--teal)}
.mchip.add{border-style:dashed;color:var(--text3)}
.ffiles{display:flex;flex-wrap:wrap;gap:8px}
.fthumb{width:84px;height:84px;border-radius:5px;border:1px solid var(--border);overflow:hidden;position:relative;background:var(--sand-lt)}
.fthumb img{width:100%;height:100%;object-fit:cover;cursor:zoom-in}
.fthumb-x{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;border:none;background:rgba(0,0,0,.6);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}
.fthumb.add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-style:dashed;cursor:pointer;color:var(--text3);font-size:11px}
.fthumb.add:hover{border-color:var(--navy);color:var(--navy)}

/* ── 표 (샌드 머리 · 1px 선) ── */
.tbl-wrap{overflow-x:auto}
.dtbl{width:100%;border-collapse:collapse;font-size:13px}
.dtbl th{height:40px;padding:0 12px;background:var(--sand-lt);color:var(--text2);font-size:12px;font-weight:500;text-align:left;border-bottom:1px solid var(--sand);border-right:1px solid var(--sand);white-space:nowrap;position:sticky;top:0;z-index:1}
.dtbl td{height:46px;padding:6px 12px;border-bottom:1px solid #EEEEEE;border-right:1px solid #EEEEEE;color:var(--text);white-space:nowrap;max-width:280px;overflow:hidden;text-overflow:ellipsis}
.dtbl th:last-child,.dtbl td:last-child{border-right:none}
.dtbl tbody tr{cursor:pointer;transition:background-color .15s var(--ease)}
.dtbl tbody tr:hover td{background:#FAF8F7}
.dtbl tr:last-child td{border-bottom:none}
.dtbl tr.dim td{color:var(--text3);background:#FAFAFA}
.dtbl tr.warn td{background:#FFF8F5}
.dtbl td.num,.dtbl th.num{text-align:right}
.dtbl td.c,.dtbl th.c{text-align:center}
.dtbl tfoot td{background:var(--sand-lt);font-weight:600;border-top:1px solid var(--sand)}
/* 행 선택 · 삭제 (OMS 방식: 행 왼쪽 체크 → Backspace) */
.sel-wrap{padding-left:24px}
.dtbl .sel-td{position:relative;overflow:visible}
.dtbl th.sel-td{position:sticky}
.row-sel,.row-sel-all{position:absolute;left:-21px;top:50%;transform:translateY(-50%);width:15px;height:15px;margin:0;opacity:0;cursor:pointer;transition:opacity .12s}
.dtbl tr:hover .row-sel,.row-sel:checked,.has-sel .row-sel,.dtbl thead:hover .row-sel-all,.has-sel .row-sel-all{opacity:1}
.dtbl tr:has(.row-sel:checked) td{background:var(--teal-lt)!important}
/* 표에서 바로 입력 (하이브리드: 칸은 입력, '열기'는 사이드 보기) — 입력 상자 없이 표 칸 그대로 */
.dtbl.ie-tbl tbody tr{cursor:default}
.dtbl td.ie-td{padding:0;max-width:none}
.dtbl .ie-cell{display:flex;align-items:center;gap:4px;height:100%;min-height:46px;position:relative}
.dtbl .ie-cell .badge{flex-shrink:0}
.dtbl td.sel-td .ie-cell{padding-left:0}
.dtbl .ie{flex:1;width:100%;min-width:80px;height:46px;border:none;border-radius:0;background:transparent;padding:0 12px;font:inherit;font-size:13px;color:var(--text);outline:none;box-shadow:none;cursor:text}
.dtbl select.ie{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:12px}
.dtbl input[type=date].ie{min-width:120px;cursor:pointer}
.dtbl input[type=date].ie::-webkit-calendar-picker-indicator{opacity:0;cursor:pointer}
.dtbl tr:hover input[type=date].ie::-webkit-calendar-picker-indicator,.dtbl input[type=date].ie:focus::-webkit-calendar-picker-indicator{opacity:.45}
.dtbl input[type=date].ie:invalid:not(:focus){color:transparent}
.dtbl .ie::placeholder{color:transparent}
.dtbl tr:hover .ie::placeholder,.dtbl .ie:focus::placeholder{color:var(--text3)}
.dtbl input[data-ik=company].ie{font-weight:700}
.dtbl td.ie-td:hover{background:#F3EFEC}
.dtbl td.ie-td:focus-within{background:#fff;box-shadow:inset 0 0 0 2px var(--teal)}
.dtbl .ie-chk{width:16px;height:16px;margin:0 auto;cursor:pointer}
.dtbl td.c .ie-cell{justify-content:center}
.dtbl .ie-open{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:none;align-items:center;gap:3px;height:24px;padding:0 7px;border:1px solid var(--sand);border-radius:4px;background:#fff;color:var(--text2);font-size:11px;font-weight:600;cursor:pointer;z-index:2}
.dtbl tr:hover .ie-open{display:inline-flex}
.dtbl .ie-open:hover{border-color:var(--navy);color:var(--navy)}
.ie-pop{min-width:220px}
/* 드롭다운 칸: 오른쪽 ▼ 표시 */
.dtbl .ie-dd{display:flex;align-items:center;gap:6px;cursor:pointer;text-align:left;min-width:110px;padding-right:8px}
.dtbl .ie-dd-v{flex:1;display:flex;align-items:center;gap:3px;overflow:hidden;white-space:nowrap}
.dtbl .ie-dd .muted{opacity:0}
.dtbl tr:hover .ie-dd .muted,.dtbl .ie-dd:focus .muted,.dtbl .ie-dd.open .muted{opacity:1;color:var(--text3)}
.dtbl .ie-caret{flex-shrink:0;display:inline-flex;color:var(--text3);opacity:.55;transition:transform .15s var(--ease),opacity .15s}
.dtbl td.ie-td:hover .ie-caret,.dtbl .ie-dd:focus .ie-caret{opacity:1;color:var(--text2)}
.dtbl .ie-dd.open .ie-caret{transform:rotate(180deg);opacity:1;color:var(--teal)}
.dtbl .ie-tog{display:flex;align-items:center;cursor:pointer;min-width:84px}
.dtbl .ie-tog .badge{transition:transform .1s}
.dtbl .ie-tog:active .badge{transform:scale(.94)}
.dtbl tr.dim.ie-row td{background:#FBF4F3}
.dtbl tr.dim.ie-row .ie{color:var(--text3)}
.dtbl input[data-ik=address].ie{min-width:240px}
.dtbl input[data-ik=email].ie{min-width:190px}
.dtbl input[data-ik=zip].ie{min-width:72px}
/* 고객 DB — 우편 발송 횟수 */
.mail-cnt{display:flex;align-items:center;gap:6px;width:100%;min-width:150px;height:34px;border:none;background:none;padding:0;cursor:pointer;font:inherit;text-align:left}
.mail-cnt .ie-caret{margin-left:auto;display:inline-flex;color:var(--text3);opacity:.55;transition:transform .15s var(--ease)}
.dtbl td:hover .mail-cnt .ie-caret{opacity:1}
.mail-cnt.open .ie-caret{transform:rotate(180deg);opacity:1;color:var(--teal)}
.mail-pop{min-width:300px;max-width:420px}
.em-row{cursor:default;gap:8px}
.em-row span{flex:1;overflow:hidden;text-overflow:ellipsis}
.em-add{display:flex;gap:6px;padding:6px 8px 4px}
.em-add [data-d]{width:132px}
.em-add [data-s]{flex:1;min-width:0}
.dtbl tr.dup-row td.sel-td{box-shadow:inset 3px 0 0 #E8A15A}
.mail-ex{display:flex;align-items:center;gap:8px;padding:6px 10px;font-size:13px}
.mail-ex span{margin-right:auto;display:flex;flex-direction:column}
.mail-ex small{font-size:11px;color:var(--text3)}
.mail-ex b{min-width:34px;text-align:center}
.stage-tag{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text)}
.ie-pop .stage-tag{font-size:13px}

.tbl-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 20px;border-top:1px solid var(--border)}
.tbl-hint{font-size:11.5px;color:var(--text3)}
.sel-bar{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:12.5px}
.sel-bar:empty{display:none}
.sel-bar b{color:var(--teal-dk)}
.fbar{display:flex;align-items:center;gap:8px;padding:12px 20px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.fsel{background:#fff;border:1px solid var(--border);color:var(--text);font-size:12.5px;height:32px;padding:0 8px;border-radius:4px;cursor:pointer;outline:none}
.fsel:focus{border-color:var(--teal)}
.finp-sm{background:#F2F2F2;border:1px solid transparent;color:var(--text);font-size:12.5px;height:32px;padding:0 10px;border-radius:4px;outline:none;width:190px}
.finp-sm:focus{background:#fff;border-color:var(--teal)}
.finp-sm::placeholder{color:var(--text3)}
.tog{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text2);cursor:pointer;user-select:none}
.tog input{width:15px;height:15px}
.fbar .count{font-size:12px;color:var(--text3);margin-left:auto}

/* ── 서브 내비 탭 (청록 글자 + 2px 밑줄) ── */
.tabbar{display:flex;gap:28px;border-bottom:1px solid var(--border);margin-bottom:20px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.tabbar::-webkit-scrollbar{display:none}
.tab{border:none;background:none;height:46px;padding:0 2px;font-size:14px;color:var(--text2);cursor:pointer;position:relative;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.tab:hover{color:var(--text)}
.tab.on{color:var(--teal);font-weight:600}
.tab.on::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--teal)}
.tab-n{font-size:11px;background:var(--sand-lt);color:var(--text3);border-radius:4px;padding:0 6px;font-weight:500;letter-spacing:0}
.tab.on .tab-n{background:var(--teal-lt);color:var(--teal-dk)}

/* ── 모달 ── */
.moverlay{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:12px}
.mdl{background:var(--white);border-radius:var(--rl);box-shadow:var(--sh2);width:520px;max-width:100%;max-height:92vh;display:flex;flex-direction:column;animation:mdlIn .3s var(--ease)}
.mdl-lg{width:700px}.mdl-xl{width:940px}.mdl-sm{width:420px}
@keyframes mdlIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.mdl-h{padding:18px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:10px;flex-shrink:0}
.mdl-title{font-size:17px;font-weight:700}
.mdl-x{width:30px;height:30px;border-radius:4px;background:none;border:1px solid transparent;cursor:pointer;color:var(--text);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mdl-x:hover{border-color:var(--border);background:var(--sand-lt)}
.mdl-b{padding:20px 22px;overflow-y:auto}
.mdl-foot{display:flex;gap:8px;justify-content:flex-end;padding:14px 22px 18px;border-top:1px solid var(--border);flex-shrink:0;flex-wrap:wrap}
.mdl-foot .btn{height:40px;min-width:84px}
.confirm-msg{font-size:14px;line-height:1.7;color:var(--text)}

/* ── 상세 패널 ── */
.drawer-ov{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;justify-content:flex-end;animation:fadeIn .2s}
.drawer-ov.out{opacity:0;transition:opacity .2s}
.drawer{width:540px;max-width:100%;height:100%;background:#fff;box-shadow:var(--sh2);display:flex;flex-direction:column;animation:slideIn .3s var(--ease)}
@keyframes slideIn{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.drawer-h{display:flex;align-items:center;gap:8px;padding:0 20px;height:64px;border-bottom:1px solid var(--border);flex-shrink:0}
.drawer-title{font-size:17px;font-weight:700;flex:1;min-width:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.drawer-acts{display:flex;gap:6px}
.drawer-b{flex:1;overflow-y:auto;padding:20px}
.dsec{margin-bottom:22px}
.dsec-h{font-size:13px;font-weight:700;color:var(--text);margin-bottom:10px;display:flex;align-items:center;gap:6px}
.dsec-h .ml{margin-left:auto}
.kv{display:grid;grid-template-columns:100px 1fr;gap:10px 12px;font-size:13.5px;line-height:1.55}
.kv dt{color:var(--text3)}
.kv dd{min-width:0;word-break:break-all}

/* ── 팝업 메뉴 ── */
.pop-menu{position:fixed;z-index:2000;background:#fff;border:1px solid var(--sand);border-radius:5px;box-shadow:var(--sh2);padding:6px;min-width:190px;max-height:70vh;overflow-y:auto}
.pop-item{display:flex;align-items:center;gap:9px;width:100%;border:none;background:none;height:36px;padding:0 10px;border-radius:4px;font-size:13px;color:var(--text);cursor:pointer;text-align:left}
.pop-item:hover,.pop-item.sel{background:var(--sand-lt)}
.pop-item.on{color:var(--teal);font-weight:600}
.pop-item.danger{color:var(--active-red)}
.pop-item.danger:hover{background:#FDF0EC}
.pop-ico{width:20px;display:inline-flex;justify-content:center;color:var(--text2)}
.pop-hint{margin-left:auto;font-size:11px;color:var(--text3)}
.pop-sep{height:1px;background:var(--border);margin:5px 2px}
.pop-head{font-size:11px;font-weight:600;color:var(--text3);padding:8px 10px 4px}

/* ── 토스트 ── */
#toast-wrap{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:5000;display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:none}
.toast{background:var(--navy);color:#fff;font-size:13px;padding:11px 18px;border-radius:5px;box-shadow:var(--sh2);transition:opacity .3s,transform .3s;max-width:90vw}
.toast.ok{background:var(--navy)}.toast.err{background:var(--active-red)}
.toast.out{opacity:0;transform:translateY(8px)}
.img-viewer{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;cursor:zoom-out;padding:20px}
.img-viewer img{max-width:100%;max-height:100%;border-radius:4px}

/* ═══════════ 프로젝트 타임라인 ═══════════ */
.tl-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 20px;border-bottom:1px solid var(--border)}
.tl-range{font-size:15px;font-weight:700;min-width:130px;text-align:center}
.tl{--dw:20px;--lw:230px;position:relative;overflow:auto;max-height:var(--tlh,none)}
.tl-grid{position:relative;min-width:calc(var(--lw) + var(--days) * var(--dw))}
.tl-head{position:sticky;top:0;z-index:4;display:flex;background:#fff;border-bottom:1px solid var(--sand)}
.tl-corner{position:sticky;left:0;z-index:5;width:var(--lw);flex-shrink:0;background:var(--sand-lt);border-right:1px solid var(--sand);display:flex;align-items:flex-end;padding:8px 14px;font-size:12px;font-weight:500;color:var(--text2)}
.tl-scale{position:relative;flex:1;height:50px}
.tl-mon{position:absolute;top:0;height:24px;border-left:1px solid var(--sand);font-size:12px;font-weight:600;padding:5px 8px;color:var(--text);white-space:nowrap;overflow:hidden;background:var(--sand-lt)}
.tl-day{position:absolute;top:24px;height:26px;border-left:1px solid #F0EEEC;font-size:10.5px;color:var(--text3);display:flex;align-items:center;justify-content:center;letter-spacing:0}
.tl-day.we{color:var(--active-red);opacity:.7}
.tl-day.td{color:#fff;font-weight:700;opacity:1}
.tl-day.td span{background:var(--active-red);border-radius:9px;padding:0 5px}
.tl-row{display:flex;border-bottom:1px solid #EEEEEE;min-height:50px}
.tl-row:hover .tl-lab,.tl-row:hover .tl-track{background:#FAF8F7}
.tl-lab{position:sticky;left:0;z-index:3;width:var(--lw);flex-shrink:0;background:#fff;border-right:1px solid var(--sand);padding:7px 14px;display:flex;flex-direction:column;justify-content:center;gap:3px;cursor:pointer;min-width:0}
.tl-lab-n{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:7px;min-width:0}
.tl-lab-n span.nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-dot{width:8px;height:8px;border-radius:2px;flex-shrink:0}
.tl-lab-s{font-size:11.5px;color:var(--text3);display:flex;gap:6px;align-items:center;white-space:nowrap}
.tl-lab-s .badge{height:18px;font-size:11px;padding:0 5px}
.tl-track{position:relative;flex:1}
.tl-bg{position:absolute;inset:0;pointer-events:none}
.tl-we{position:absolute;top:0;bottom:0;background:rgba(228,220,211,.22)}
.tl-today{position:absolute;top:0;bottom:0;width:2px;background:var(--active-red);opacity:.8;z-index:2;pointer-events:none}
.tl-pbar{position:absolute;top:12px;height:26px;border-radius:4px;display:flex;align-items:center;cursor:grab;user-select:none;touch-action:none;overflow:hidden;z-index:2;min-width:6px}
.tl-pbar:active{cursor:grabbing}
.tl-pbar .fill{position:absolute;left:0;top:0;bottom:0;background:rgba(0,0,0,.18)}
.tl-pbar .lbl{position:relative;font-size:12px;font-weight:600;color:#fff;padding:0 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.tl-pbar .hdl{position:absolute;top:0;bottom:0;width:8px;cursor:ew-resize;z-index:2}
.tl-pbar .hdl.l{left:0}.tl-pbar .hdl.r{right:0}
.tl-pbar .hdl:hover{background:rgba(255,255,255,.35)}
.tl-pbar.clipL{border-top-left-radius:0;border-bottom-left-radius:0}
.tl-pbar.clipR{border-top-right-radius:0;border-bottom-right-radius:0}
.tl-pbar.done{opacity:.45}
.tl-pbar.hold{background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.2) 0 6px,transparent 6px 12px)}
.tl-ext{position:absolute;top:16px;font-size:11.5px;color:var(--text3);white-space:nowrap;pointer-events:none;z-index:1}
.tl-tip{position:fixed;z-index:3000;background:var(--navy);color:#fff;font-size:12px;padding:6px 10px;border-radius:4px;pointer-events:none;white-space:nowrap}
.tl-undated{padding:12px 20px;border-top:1px solid var(--sand);background:var(--sand-lt);display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:12.5px}
.tl-undated .lb{color:var(--text2);font-weight:600;font-size:12px;margin-right:4px}
.pchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:4px;height:28px;padding:0 10px;font-size:12.5px;cursor:pointer;background:#fff}
.pchip:hover{border-color:var(--navy)}
.prog{height:4px;border-radius:0;background:#E5E5E5;overflow:hidden}
.prog>i{display:block;height:100%;background:var(--navy)}

/* ═══════════ 주간 할 일 캘린더 ═══════════ */
.wk-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 20px;border-bottom:1px solid var(--border)}
.wk-range{font-size:15px;font-weight:700;min-width:170px;text-align:center;line-height:1.3}
.wk-range small{display:block;font-size:11px;color:var(--text3);font-weight:400}
.wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));min-height:var(--wkh,420px)}
.wk-col{border-right:1px solid var(--border);display:flex;flex-direction:column;min-width:0;background:#fff;transition:background-color .2s var(--ease)}
.wk-col:last-child{border-right:none}
.wk-col.sel{background:#FBFAF9}
.wk-col.drag{background:var(--teal-lt)}
.wk-col.we .wk-dn{color:var(--active-red)}
.wk-h{height:48px;padding:0 12px;border-bottom:1px solid var(--sand);display:flex;align-items:center;gap:7px;cursor:pointer;user-select:none;background:var(--sand-lt);position:relative}
.wk-dn{font-size:12px;font-weight:500;color:var(--text2)}
.wk-dd{font-size:18px;font-weight:400;width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;letter-spacing:-0.5px}
.wk-col.today .wk-dd{background:var(--navy);color:#fff;font-weight:600}
.wk-col.sel .wk-h::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--teal)}
.wk-cnt{margin-left:auto;font-size:11px;color:var(--text3);letter-spacing:0}
.wk-list{flex:1;padding:8px;display:flex;flex-direction:column;gap:6px;overflow-y:auto;max-height:var(--wklh,none)}
.td-card{display:flex;align-items:flex-start;gap:7px;padding:8px 9px;border:1px solid var(--border);border-left:3px solid var(--tc,#CECDCA);border-radius:4px;background:#fff;cursor:pointer;font-size:12.5px;line-height:1.4;transition:border-color .2s var(--ease)}
.td-card:hover{border-color:var(--navy-100);border-left-color:var(--tc,#CECDCA)}
.td-card.dragging{opacity:.4}
.td-card.done .td-t{text-decoration:line-through;color:var(--text3)}
.td-card.done{background:#FAFAFA}
.td-ck{width:16px;height:16px;border-radius:3px;border:1.5px solid #B1B1B1;flex-shrink:0;margin-top:1px;display:inline-flex;align-items:center;justify-content:center;background:#fff;cursor:pointer;color:#fff;padding:0}
.td-ck:hover{border-color:var(--control)}
.td-ck.on{background:var(--control);border-color:var(--control)}
.td-body{flex:1;min-width:0}
.td-t{word-break:break-word}
.td-meta{display:flex;gap:5px;align-items:center;margin-top:3px;flex-wrap:wrap}
.td-time{font-size:11px;color:var(--teal);font-weight:600;letter-spacing:0}
.td-proj{font-size:11px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.td-pri{width:6px;height:6px;border-radius:50%;flex-shrink:0;margin-top:6px}
.pri-높음{background:var(--active-red)}.pri-보통{background:transparent}.pri-낮음{background:#CECDCA}
.wk-add{margin:2px 8px 8px;border:1px dashed transparent;border-radius:4px;height:32px;padding:0 9px;font-size:12.5px;color:var(--text3);cursor:text;display:flex;align-items:center;gap:6px}
.wk-col:hover .wk-add{border-color:var(--sand)}
.wk-add input{border:none;outline:none;background:none;font-size:12.5px;width:100%;height:100%;color:var(--text);cursor:text}
.wk-add:focus-within{border-color:var(--teal);border-style:solid;background:#fff}
.wk-add:hover{color:var(--text2)}
.wk-strip{display:none}
/* 선택한 날(오늘) 할 일 — 주간 칸과 구분되는 박스 */
.wk-day{margin:18px 20px 20px;padding:16px 18px 14px;background:var(--sand-lt);border:1px solid var(--sand);border-left:4px solid var(--navy);border-radius:8px}
.wk-day.is-today{border-left-color:var(--teal);background:#F1F8FA;border-color:#CFE6EE}
.wk-day-h{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.wk-day-h b{font-size:15px}
.wk-day-tag{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:50px;background:var(--navy);color:#fff;font-size:12px;font-weight:600}
.wk-day.is-today .wk-day-tag{background:var(--teal)}
.wk-day-n{font-size:12px;color:var(--text3)}
.wk-day-bar{width:120px;height:6px;border-radius:3px;background:rgba(0,0,0,.08);overflow:hidden}
.wk-day-bar i{display:block;height:100%;background:var(--teal)}
.wk-day .td-card{background:#fff}
.wk-day .wk-add{background:transparent}
.wk-day-list{display:flex;flex-direction:column;gap:6px}
.wk-day-list .td-card{padding:10px 12px;font-size:13.5px}
.td-memo{font-size:12px;color:var(--text3);margin-top:3px;white-space:pre-wrap}
.wk-inbox{border-top:1px solid var(--sand);background:var(--sand-lt);padding:12px 20px;display:flex;gap:6px;align-items:flex-start;flex-wrap:wrap}
.wk-inbox.drag{background:var(--teal-lt)}
.wk-inbox .lb{font-size:12px;color:var(--text2);font-weight:600;padding:8px 6px 0 0;display:flex;gap:5px;align-items:center}
.wk-inbox .td-card{max-width:250px}
.wk-inbox .wk-add{background:#fff}

/* ═══════════ 대시보드 ═══════════ */
.dash-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
/* 설정 > 선택지 관리 — 화면별 분류 */
.opt-sec{margin-bottom:4px}
.opt-sec-h{display:flex;align-items:center;gap:6px;width:100%;height:34px;padding:0 8px;border:none;background:none;cursor:pointer;font-size:12px;font-weight:700;color:var(--text2);text-align:left;border-radius:4px}
.opt-sec-h:hover{background:var(--sand-lt)}
.opt-sec-h svg{transition:transform .15s var(--ease);flex-shrink:0;color:var(--text3)}
.opt-sec.closed .opt-sec-h svg{transform:rotate(-90deg)}
.opt-sec.closed .opt-sec-b{display:none}
.opt-sec-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.opt-sec-h .badge{font-size:10px;padding:1px 5px}
.opt-sec-h .r,.opt-g .r{margin-left:auto;font-size:11px;color:var(--text3);font-weight:500}
.opt-sec-b{margin-left:14px;padding-left:6px;border-left:1px solid var(--sand)}
.mini-row.opt-g{min-height:34px;border-bottom:none}
.mini-row.opt-g.on{background:var(--accent-lt);color:var(--accent-dk);font-weight:700}
.opt-use{display:flex;align-items:center;flex-wrap:wrap;gap:5px;padding:8px 16px 0;font-size:12px;color:var(--text3)}
.mini-row{display:flex;align-items:center;gap:8px;min-height:38px;padding:4px 10px;border-radius:4px;cursor:pointer;font-size:13px;border-bottom:1px solid #F2F0EE}
.mini-row:last-child{border-bottom:none}
.mini-row:hover{background:var(--sand-lt)}
.mini-row .r{margin-left:auto;font-size:12px;color:var(--text3);white-space:nowrap}
.hbar{display:flex;align-items:center;gap:10px;font-size:12.5px;margin-bottom:9px}
.hbar .lb{width:90px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text2)}
.hbar .tr{flex:1;height:8px;background:#EEEEEE;overflow:hidden}
.hbar .tr i{display:block;height:100%;background:var(--navy)}
.hbar .v{width:34px;text-align:right;font-weight:600}
.meter{margin-bottom:14px}
.meter-h{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;gap:8px}
.meter-h b{font-weight:700}
.meter .prog{height:4px}

/* ═══════════ 자유형 페이지 편집기 ═══════════ */
/* 노션 '전체 너비'처럼 화면 폭을 다 쓴다 (왼쪽 64px은 블록 손잡이 자리) */
.pg{max-width:none;margin:0;padding:40px 64px 120px}
.pg-cover{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px;min-height:28px}
.pg-icon{font-size:46px;line-height:1;cursor:pointer;border-radius:5px;padding:2px;display:inline-block}
.pg-icon:hover{background:var(--sand-lt)}
.pg-meta-btn{opacity:0;transition:opacity .2s}
.pg:hover .pg-meta-btn{opacity:1}
.pg-title{font-size:36px;font-weight:700;outline:none;line-height:1.3;padding:2px 0 8px;word-break:break-word;letter-spacing:-1px}
.pg-title:empty::before{content:'제목 없음';color:#CECDCA}
.pg-props{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--text3);padding:6px 0 16px;border-bottom:1px solid var(--sand);margin-bottom:18px}
.pg-props .pp{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--border);border-radius:4px;height:28px;padding:0 10px;cursor:pointer;color:var(--text2);background:#fff}
.pg-props .pp:hover{border-color:var(--navy);color:var(--navy)}
.pg-folder{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-bottom:22px}
.pf-card{border:1px solid var(--border);border-radius:5px;padding:14px;cursor:pointer;background:#F4F5F6;display:flex;flex-direction:column;gap:6px;min-height:90px;transition:border-color .2s var(--ease)}
.pf-card:hover{border-color:var(--navy)}
.pf-card .ic{font-size:22px;line-height:1}
.pf-card .nm{font-size:14px;font-weight:600;word-break:break-word}
.pf-card .sub{font-size:11.5px;color:var(--text3)}
.pf-new{background:#fff;border-style:dashed;align-items:center;justify-content:center;color:var(--text3);font-size:13px;flex-direction:row}
.pe{position:relative}
.pb{position:relative;display:flex;align-items:flex-start;padding:1px 0;border-radius:4px}
.pb-hd{position:absolute;left:-52px;top:3px;display:flex;gap:1px;opacity:0;transition:opacity .15s}
.pb:hover>.pb-hd,.pb.focus>.pb-hd{opacity:1}
.pb-hd button{width:22px;height:24px;border:none;background:none;border-radius:4px;color:#B1B1B1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.pb-hd button:hover{background:var(--sand-lt);color:var(--navy)}
.pb-hd .grip{cursor:grab}
.pb.drop-before::before,.pb.drop-after::after{content:'';position:absolute;left:0;right:0;height:3px;background:var(--teal);z-index:3}
.pb.drop-before::before{top:-2px}.pb.drop-after::after{bottom:-2px}
.pb.sel{background:var(--teal-lt)}
.pb-c{flex:1;min-width:0}
.pb-t{outline:none;min-height:1.7em;line-height:1.75;font-size:15.5px;padding:2px 2px;word-break:break-word;white-space:pre-wrap}
.pb-t:empty::before{content:attr(data-ph);color:#CECDCA;pointer-events:none}
.pb-t:not(:focus):empty::before{content:''}
.pb[data-type="p"]:only-child .pb-t:empty::before,.pb[data-type="h1"] .pb-t:empty::before,.pb[data-type="h2"] .pb-t:empty::before,.pb[data-type="h3"] .pb-t:empty::before{content:attr(data-ph)}
.pb[data-type="h1"] .pb-t{font-size:28px;font-weight:700;margin-top:18px;line-height:1.4;letter-spacing:-0.8px}
.pb[data-type="h2"] .pb-t{font-size:22px;font-weight:700;margin-top:14px;line-height:1.45;letter-spacing:-0.6px}
.pb[data-type="h3"] .pb-t{font-size:18px;font-weight:600;margin-top:8px}
.pb-mark{width:24px;flex-shrink:0;display:flex;justify-content:center;padding-top:4px;font-size:15.5px;line-height:1.75;color:var(--navy);user-select:none}
.pb[data-type="bullet"] .pb-mark::before{content:'';width:5px;height:5px;background:var(--navy);margin-top:9px}
.pb[data-type="number"] .pb-mark::before{content:attr(data-n) '.';font-size:15px;line-height:1.75;font-weight:600}
.pb[data-type="number"] .pb-mark{padding-top:2px}
.pb-ck{width:17px;height:17px;border-radius:3px;border:1.5px solid #B1B1B1;background:#fff;cursor:pointer;margin-top:5px;display:inline-flex;align-items:center;justify-content:center;color:#fff;padding:0}
.pb-ck.on{background:var(--control);border-color:var(--control)}
.pb.checked .pb-t{text-decoration:line-through;color:var(--text3)}
.pb[data-type="quote"] .pb-c{border-left:3px solid var(--navy);padding-left:14px}
.pb[data-type="callout"] .pb-c{display:flex;gap:10px;background:var(--sand-lt);border:1px solid var(--sand);border-radius:5px;padding:12px 14px;margin:4px 0}
.pb-emoji{font-size:18px;cursor:pointer;line-height:1.6;user-select:none}
.pb[data-type="code"] .pb-t{font-family:Consolas,'D2Coding',monospace;font-size:13px;background:#F4F5F6;border:1px solid var(--border);border-radius:4px;padding:12px 14px;white-space:pre-wrap;margin:4px 0;letter-spacing:0}
.pb[data-type="divider"] .pb-c{padding:12px 0;cursor:pointer}
.pb[data-type="divider"] hr{border:none;border-top:1px solid var(--sand)}
.pb-t code{font-family:Consolas,monospace;background:var(--sand-lt);color:var(--active-red);padding:1px 4px;border-radius:3px;font-size:.88em;letter-spacing:0}
.pb-t mark{background:#FFF1B8;padding:0 1px}
.pb-t a{color:var(--teal)}
/* 표 블록 */
.pbt{overflow-x:auto;margin:6px 0;position:relative}
.pbt table{border-collapse:collapse;font-size:14px;min-width:100%}
.pbt td{border:1px solid var(--sand);padding:8px 10px;min-width:90px;vertical-align:top;outline:none;line-height:1.55;white-space:pre-wrap;word-break:break-word}
.pbt td:focus{box-shadow:inset 0 0 0 2px var(--teal)}
.pbt tr.hdr td{background:var(--sand-lt);font-weight:600;border-bottom-color:var(--sand)}
.pbt-tools{display:flex;gap:4px;margin-top:6px;opacity:0;transition:opacity .15s;flex-wrap:wrap;align-items:center;padding-left:24px}
.pbt td.tr-gut{border:none!important;width:24px;min-width:24px;padding:0;background:transparent!important;vertical-align:middle;text-align:left}
.pbt .tr-gut .row-sel{position:static;transform:none;vertical-align:middle}
.pbt tr:hover .tr-gut .row-sel,.pbt .has-sel .row-sel{opacity:1}
.pbt tr:has(.row-sel:checked) td:not(.tr-gut){background:var(--teal-lt)}
.pb-c.has-sel .pbt-tools{opacity:1}
.pb:hover .pbt-tools,.pb.focus .pbt-tools{opacity:1}
.pbt-tools button{border:1px solid var(--border);background:#fff;border-radius:4px;font-size:11.5px;height:26px;padding:0 9px;cursor:pointer;color:var(--text2);display:inline-flex;align-items:center;gap:3px}
.pbt-tools button:hover{border-color:var(--navy);color:var(--navy)}
/* 미디어·파일·링크·하위 페이지 블록 */
.pb-img{margin:8px 0}
.pb-img img{max-width:100%;border-radius:4px;display:block;cursor:zoom-in}
.pb-cap{font-size:13px;color:var(--text3);outline:none;padding:5px 2px;min-height:1.4em}
.pb-cap:empty::before{content:'설명 추가…';color:#D6D4D1}
.pb-file,.pb-link,.pb-child{display:flex;align-items:center;gap:12px;border:1px solid var(--border);border-radius:5px;padding:10px 14px;margin:4px 0;background:#fff;cursor:pointer;text-decoration:none;color:var(--text);transition:border-color .2s var(--ease)}
.pb-file:hover,.pb-link:hover{border-color:var(--navy)}
.pb-file .ic,.pb-link .ic{width:36px;height:36px;border-radius:4px;background:var(--sand-lt);display:flex;align-items:center;justify-content:center;color:var(--navy);flex-shrink:0}
.pb-file .nm,.pb-link .nm{font-size:14px;font-weight:600;word-break:break-all}
.pb-file .sub,.pb-link .sub{font-size:12px;color:var(--text3);word-break:break-all}
.pb-child{border:none;padding:4px 4px;margin:1px 0;font-size:15.5px;font-weight:600;text-decoration:underline;text-decoration-color:var(--sand);text-underline-offset:4px}
.pb-child:hover{color:var(--navy);text-decoration-color:var(--navy)}
.pb-child .ic{font-size:16px;width:22px;text-align:center}
.pb-child .tag{font-size:11px;color:var(--text3);font-weight:400;text-decoration:none;border:1px solid var(--border);border-radius:4px;padding:0 5px}
.pb-up{display:flex;align-items:center;gap:8px;background:var(--sand-lt);border:1px dashed var(--sand);border-radius:5px;padding:14px;color:var(--text3);cursor:pointer;font-size:13.5px;margin:4px 0}
.pb-up:hover{border-color:var(--navy);color:var(--navy)}
.pe-add{margin-top:10px;padding:8px 2px;color:#CECDCA;font-size:14px;cursor:text}
.pe-orph{margin-top:24px;border-top:1px solid var(--sand);padding-top:12px}
.slash{position:fixed;z-index:2500;background:#fff;border:1px solid var(--sand);border-radius:5px;box-shadow:var(--sh2);padding:6px;width:270px;max-height:340px;overflow-y:auto}
.slash .pop-item{height:auto;padding:7px 10px}
.slash .pop-item small{display:block;font-size:11px;color:var(--text3);font-weight:400}
.fmt-bar{position:fixed;z-index:2400;display:flex;gap:2px;background:var(--navy);border-radius:5px;padding:3px;box-shadow:var(--sh2)}
.fmt-bar button{border:none;background:none;color:#fff;min-width:30px;height:30px;border-radius:4px;cursor:pointer;font-size:13px;padding:0 6px}
.fmt-bar button:hover{background:rgba(255,255,255,.16)}
.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
.emoji-grid button{font-size:20px;border:none;background:none;border-radius:4px;cursor:pointer;padding:4px}
.emoji-grid button:hover{background:var(--sand-lt)}
.pg-save{font-size:11.5px;color:var(--text3);display:inline-flex;align-items:center;gap:4px}



/* 페이지 아이콘 (선 아이콘) · 아이콘 고르기 */
.picon{display:inline-block;vertical-align:-0.18em;flex-shrink:0}
.pt-ico .picon{vertical-align:-3px}
.pg-icon .picon{display:block}
.icon-picker{width:372px;padding:10px;max-height:min(460px,80vh);display:flex;flex-direction:column;gap:8px;overflow:hidden}
.ip-top{display:flex;align-items:center;justify-content:space-between}
.ip-search{width:100%}
.ip-colors{display:flex;gap:5px;flex-wrap:wrap}
.ip-colors button{width:20px;height:20px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--border);cursor:pointer}
.ip-colors button.on{box-shadow:0 0 0 2px var(--teal)}
.ip-body{overflow-y:auto;min-height:0;flex:1}
.ip-g{font-size:11px;font-weight:600;color:var(--text3);margin:8px 2px 4px}
.ip-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:2px}
.ip-grid button{height:34px;border:none;background:none;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ip-grid button:hover{background:var(--sand-lt)}

/* 링크 · 파비콘 상자 */
.fav{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin:0 5px 0 2px;border:1px solid var(--border);border-radius:4px;background:#fff;vertical-align:-0.3em;cursor:pointer;position:relative;overflow:hidden;user-select:none;transition:border-color .2s var(--ease)}
.fav::before{content:attr(data-l);font-size:10.5px;font-weight:700;color:var(--navy)}
.fav img{position:absolute;inset:2px;width:14px;height:14px;object-fit:contain}
.fav.ok::before{content:''}
.fav:hover{border-color:var(--navy);box-shadow:0 0 0 2px var(--navy-50)}
.fav.lg{width:36px;height:36px;margin:0;border:none;background:transparent;vertical-align:middle}
.fav.lg img{inset:8px;width:20px;height:20px;background:transparent}
.fav.lg::before{font-size:15px}
.pb-t a{cursor:pointer;text-decoration:underline;text-decoration-color:rgba(0,127,168,.4);text-underline-offset:3px;word-break:break-all}
.pb-t a:hover{text-decoration-color:var(--teal)}
/* 블록 배경색 (노션처럼 제목 막대 등) */
.pb.has-bg>.pb-c{background:var(--bgc);border-radius:5px;padding:2px 10px}
.pb.has-bg[data-type=h1]>.pb-c,.pb.has-bg[data-type=h2]>.pb-c,.pb.has-bg[data-type=h3]>.pb-c{padding:4px 12px}
.pb.has-bg[data-type^=h] .pb-t{margin-top:0}
/* 단 나누기 */
.pcols-wrap{margin:8px 0;position:relative}
.pcols{display:flex;gap:48px;align-items:flex-start}
.pcol{flex:1 1 0;min-width:0}
.pb-colhead{height:14px;margin-bottom:2px}
.pb-colhead .pb-hd{top:-6px}
.pb-colhead .colbar{display:block;height:2px;margin-top:6px;background:transparent;font-size:0}
.pcols-wrap:hover .pb-colhead .colbar{background:var(--sand)}
.pcol-empty{padding:8px 6px;color:#CECDCA;font-size:13px;cursor:text;border:1px dashed transparent;border-radius:4px}
.pcols-wrap:hover .pcol-empty{border-color:var(--sand)}


/* 콘텐츠 자료함 — 자료 × 채널 게시 현황 */
.as-tbl td{max-width:none}
.as-tbl .as-title{font-weight:700;color:var(--text);text-decoration:none}
.as-tbl .as-title:hover{color:var(--navy);text-decoration:underline}
.as-ch{display:inline-flex;align-items:center;gap:4px;color:var(--text2);text-decoration:none;font-weight:600}
.as-ch:hover{color:var(--navy)}
.as-td{min-width:92px}
.as-cell{display:inline-flex;align-items:center;justify-content:center;min-width:64px;height:26px;padding:0 8px;margin:1px;border-radius:4px;font-size:11.5px;font-weight:600;cursor:pointer;border:1px solid transparent;white-space:nowrap}
.as-cell.done{background:#EFF2F7;color:#1A4E8A;border-color:#D5DEEB}
.as-cell.plan{background:var(--teal-lt);color:var(--teal-dk);border-color:#BFE3EE}
.as-cell.none{background:none;color:#CECDCA;border:1px dashed var(--border);font-size:14px;font-weight:400}
.as-cell.none:hover{color:var(--navy);border-color:var(--navy);background:var(--navy-50)}
.as-cell:hover{filter:brightness(.97)}
.as-dup{display:block;font-size:10.5px;color:var(--active-red);font-weight:700}
.as-lg{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-2px}
.as-lg.done{background:#EFF2F7;border:1px solid #D5DEEB}.as-lg.plan{background:var(--teal-lt);border:1px solid #BFE3EE}.as-lg.none{border:1px dashed var(--border2)}.as-lg.dup{background:var(--active-red)}

/* ═══════════ 영업 / 홍보 / 돈관리 ═══════════ */
.stepper{display:flex;gap:4px;margin:2px 0 4px}
.step{flex:1;text-align:center;font-size:12px;font-weight:500;color:var(--text3);background:var(--sand-lt);height:34px;line-height:34px;padding:0 2px;cursor:pointer;border:1px solid transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:4px}
.step.done{background:var(--teal-lt);color:var(--teal-dk)}
.step.cur{background:var(--control);color:#fff;font-weight:700}
.step:hover{border-color:var(--teal)}
.mini-steps{display:inline-flex;gap:2px}
.mini-steps i{width:12px;height:5px;background:#E5E5E5}
.mini-steps i.on{background:var(--control)}
.ckq{border:1px solid var(--sand);border-radius:5px;padding:12px 14px;margin-bottom:8px;background:#fff}
.ckq-h{display:flex;gap:9px;align-items:flex-start;font-size:14px;font-weight:600}
.ckq-h .no{width:22px;height:22px;border-radius:50%;background:var(--sand-lt);color:var(--navy);font-size:11px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;letter-spacing:0}
.ckq.ok .ckq-h .no{background:var(--control);color:#fff}
.ckq-ex{font-size:12px;color:var(--text3);margin:5px 0 7px 31px;line-height:1.5}
.ckq-in{margin-left:31px;display:flex;gap:6px;flex-wrap:wrap}
.ckq-in .finput{height:32px;font-size:13px}
.faq{border:1px solid var(--sand);border-radius:5px;margin-bottom:8px;background:#fff;overflow:hidden}
.faq-q{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 16px;cursor:pointer;font-size:14px;font-weight:600}
.faq-q:hover{background:#FBFAF9}
.faq-q .chev{color:var(--navy);transition:transform .3s var(--ease);display:inline-flex}
.faq.open .faq-q .chev{transform:rotate(90deg)}
.faq.open .faq-q{border-bottom:1px solid var(--sand-lt)}
.faq-a{display:none;padding:14px 18px 16px 42px;font-size:14px;line-height:1.85;color:#222;background:#FDFCFB}
.faq.open .faq-a{display:block}
.faq-acts{display:flex;gap:6px;margin-top:12px}
.kan{display:grid;grid-template-columns:repeat(5,minmax(210px,1fr));gap:12px;overflow-x:auto;padding:16px 20px}
.kan-col{background:var(--sand-lt);border-radius:5px;padding:10px;min-height:220px;display:flex;flex-direction:column;gap:8px}
.kan-col.drag{background:var(--teal-lt)}
.kan-h{font-size:13px;font-weight:700;padding:2px 4px 6px;display:flex;justify-content:space-between;border-bottom:2px solid var(--navy)}
.kan-card{background:#fff;border:1px solid var(--border);border-radius:4px;padding:10px 12px;font-size:13px;cursor:pointer;transition:border-color .2s var(--ease)}
.kan-card:hover{border-color:var(--navy)}
.kan-card .sub{font-size:11.5px;color:var(--text3);margin-top:4px}
.tpl{border:1px solid var(--sand);border-radius:5px;background:#fff;margin-bottom:12px}
.tpl-h{display:flex;align-items:center;gap:8px;min-height:48px;padding:6px 14px;border-bottom:1px solid var(--sand-lt);background:#FBFAF9}
.tpl-h b{font-size:14px}
.tpl-h .ml{margin-left:auto;display:flex;gap:6px}
.tpl-b{padding:14px 16px;font-size:13px;line-height:1.75;white-space:pre-wrap;color:#222;max-height:280px;overflow-y:auto}
.out-box{position:relative}
.out-box textarea{font-size:13px}
.vbars{display:flex;align-items:flex-end;gap:6px;height:170px;padding:8px 4px 0;border-bottom:1px solid var(--sand)}
.vbar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;position:relative;min-width:0}
.vbar .b{width:62%;max-width:26px;background:var(--navy)}
.vbar .tg{position:absolute;left:6%;right:6%;border-top:2px dashed var(--c-goal)}
.vbar .v{font-size:10.5px;color:var(--text3);margin-bottom:3px;white-space:nowrap;letter-spacing:0}
.vlabels{display:flex;gap:6px;padding:6px 4px 0}
.vlabels span{flex:1;text-align:center;font-size:11px;color:var(--text3)}
.legend{display:flex;gap:14px;font-size:12px;color:var(--text3);margin-top:10px;flex-wrap:wrap}
.legend i{display:inline-block;width:10px;height:10px;margin-right:5px;vertical-align:-1px}
.gin{width:100%;border:1px solid transparent;background:none;padding:5px 6px;border-radius:4px;font-size:12.5px;text-align:right}
.gin:hover{border-color:var(--border)}
.gin:focus{outline:none;border-color:var(--teal);background:#fff}
.cal-m{display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid var(--border);border-left:1px solid var(--border)}
.cal-m>div{border-right:1px solid var(--border);border-bottom:1px solid var(--border);min-height:100px;padding:6px 7px;font-size:11.5px;overflow:hidden;cursor:pointer}
.cal-m>div:hover{background:#FBFAF9}
.cal-m .dh{min-height:0;text-align:center;font-weight:500;color:var(--text2);background:var(--sand-lt);padding:8px;cursor:default;border-bottom-color:var(--sand)}
.cal-m .out{background:#FAFAFA;color:#BBB}
.cal-m .d{font-weight:600;margin-bottom:4px;font-size:13px}
.cal-m .today .d{color:#fff;background:var(--navy);display:inline-block;padding:0 6px;border-radius:9px}
.cal-ev{display:block;font-size:11px;border-radius:3px;padding:2px 6px;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.bal-card{border:1px solid var(--border);border-radius:var(--rl);padding:16px 18px;background:#fff;cursor:pointer;transition:border-color .2s var(--ease)}
.bal-card:hover{border-color:var(--navy)}
.bal-card .nm{font-size:13px;color:var(--text2);font-weight:500;display:flex;justify-content:space-between;align-items:center}
.bal-card .v{font-size:26px;font-weight:400;margin-top:8px;letter-spacing:-0.8px}
.sw{position:relative;display:inline-block;width:36px;height:20px;flex-shrink:0}
.sw input{opacity:0;width:0;height:0}
.sw span{position:absolute;inset:0;background:#CECDCA;border-radius:10px;cursor:pointer;transition:.2s}
.sw span::before{content:'';position:absolute;width:16px;height:16px;left:2px;top:2px;background:#fff;border-radius:50%;transition:.2s}
.sw input:checked+span{background:var(--control)}
.sw input:checked+span::before{transform:translateX(16px)}
.pl-up{color:var(--up);font-weight:600}.pl-down{color:var(--down);font-weight:600}
.inv-tbl tr.grp th{text-align:center;background:#EFEAE5;color:var(--text);font-weight:600;border-right:1px solid var(--sand)}
.inv-tbl thead tr:nth-child(2) th{top:40px}
.inv-tbl td{max-width:none}
.amt-in{color:var(--c-in);font-weight:600}.amt-out{color:var(--c-out);font-weight:600}
.opt-row{display:flex;align-items:center;gap:8px;padding:7px 8px;border-bottom:1px solid #F2F0EE}
.opt-row:last-child{border-bottom:none}
.opt-row.off{opacity:.45}
.color-dots{display:flex;gap:3px}
.color-dots button{width:16px;height:16px;border-radius:3px;border:1px solid rgba(0,0,0,.12);cursor:pointer}
.color-dots button.on{outline:2px solid var(--teal);outline-offset:1px}
.notice{border:1px solid var(--sand);background:var(--sand-lt);border-radius:5px;padding:12px 14px;font-size:13px;color:#6B4A36;line-height:1.65}
.notice.blue{border-color:#BFE3EE;background:var(--teal-lt);color:var(--teal-dk)}


/* ═══════════ 홈 (메뉴 바로가기 · 한 화면) ═══════════ */
.home2{display:flex;flex-direction:column;gap:14px}
.hz{border:1px solid var(--border);border-top:3px solid var(--zc);border-radius:var(--rl);background:#fff;padding:12px 16px 14px;min-width:0}
.hz-h{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}
.hz-h b{font-size:16px;color:var(--zc);letter-spacing:-0.3px}
.hz-h span{font-size:12px;color:var(--text3)}
.home-cols{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:14px;align-items:stretch}
.hsec{margin-bottom:10px}
.hsec-h{font-size:11px;font-weight:600;letter-spacing:1.2px;color:var(--text3);margin-bottom:6px}
.hgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.z-personal .hgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.z-personal .ht2[data-r=money]{grid-column:1/-1;background:#FBF9F7}
.hgrid-row{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin-bottom:10px}
.ht2{display:flex;align-items:center;gap:10px;min-height:58px;padding:9px 11px;border:1px solid var(--border);border-radius:5px;background:#fff;text-decoration:none;color:var(--text);min-width:0;transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease)}
.ht2:hover{border-color:var(--navy);background:#FBFAF9}
.ht2-ico{width:34px;height:34px;flex-shrink:0;border-radius:5px;background:var(--sand-lt);color:var(--navy);display:flex;align-items:center;justify-content:center;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.ht2:hover .ht2-ico{background:var(--navy);color:#fff}
.z-personal .ht2-ico{color:var(--gold)}
.z-personal .ht2:hover{border-color:var(--gold)}
.z-personal .ht2:hover .ht2-ico{background:var(--gold);color:#fff}
.ht2-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.ht2-txt b{font-size:13.5px;font-weight:700;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ht2-txt small{font-size:11.5px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ht2-txt small b{font-size:11.5px;color:var(--navy);font-weight:700;display:inline}
.ht2-txt small b.warn{color:var(--active-red)}
.hp{border-top:1px solid #F0EEEC;padding-top:9px;margin-top:2px}
.hp-h{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--text2);margin-bottom:6px}
.hp-h span{font-weight:400;color:var(--text3)}
.hp-list{display:flex;flex-wrap:wrap;gap:6px}
.hp-chip{display:inline-flex;align-items:center;gap:4px;max-width:220px;height:28px;padding:0 10px;border:1px solid var(--border);border-radius:4px;background:#fff;font-size:12.5px;color:var(--text);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.hp-chip:hover{border-color:var(--navy);color:var(--navy)}
.hp-chip.new{border-style:dashed;color:var(--text3)}
.home-foot{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text3)}
.home-foot a{display:inline-flex;align-items:center;gap:5px;color:var(--navy);text-decoration:none}
.home-foot a:hover{text-decoration:underline}
@media (max-width:1180px){ .hgrid{grid-template-columns:repeat(2,minmax(0,1fr))} .z-personal .hgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:960px){ .home-cols{grid-template-columns:1fr} .hgrid,.z-personal .hgrid{grid-template-columns:repeat(3,minmax(0,1fr))} }

/* ═══════════ 반응형 ═══════════ */
#sb-ov{display:none}
@media (max-width:1180px){
  .dash-grid{grid-template-columns:1fr 1fr}
  .kpi-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
  #sb{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);transition:transform .3s var(--ease);box-shadow:var(--sh2)}
  body.sb-open #sb{transform:none}
  body.sb-open #sb-ov{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:40}
  .tb-menu{display:inline-flex}
  #topbar{padding:0 16px}
  #page-wrap{padding:18px 16px 44px}
  .tb-search{width:200px}
  .grid2,.grid3{grid-template-columns:1fr}
  .pg{padding:28px 22px 100px 48px}
}
@media (max-width:720px){
  #topbar{height:55px;padding:0 10px;gap:6px}
  .tb-title{font-size:16px}
  #page-wrap{padding:14px 10px 40px}
  .tb-search{width:auto;flex:0 0 38px;padding:0 10px}
  .tb-search input{display:none}
  .tb-search.open{position:absolute;left:8px;right:8px;width:auto;z-index:60;background:#fff;border-color:var(--border)}
  .tb-search.open input{display:block}
  .search-pop{width:auto;left:0;right:0}
  .dash-grid{grid-template-columns:1fr}
  .kpi-grid{grid-template-columns:1fr 1fr;gap:8px}
  .kpi{padding:9px 12px}
  .kpi-val{font-size:20px}
  .sec-ttl{font-size:21px}
  .fgrid{grid-template-columns:1fr}
  .moverlay{padding:0;align-items:flex-end}
  .mdl{max-height:94vh;border-radius:12px 12px 0 0}
  .drawer{width:100%}
  .tabbar{gap:18px}
  .tl{--lw:120px}
  .tl-lab-s{display:none}
  .card-h,.fbar,.tl-bar,.wk-bar{padding-left:12px;padding-right:12px}
  /* 주간 캘린더: 7칸 대신 요일 띠 + 선택한 날 목록 */
  .wk{display:none}
  .wk-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:10px 10px 4px}
  .wk-pill{border:1px solid var(--border);border-radius:5px;padding:6px 0;text-align:center;cursor:pointer;background:#fff;user-select:none}
  .wk-pill .a{font-size:11px;color:var(--text3)}
  .wk-pill .b{font-size:17px;font-weight:500}
  .wk-pill .c{font-size:10px;color:var(--teal);font-weight:600;min-height:12px}
  .wk-pill.today .b{color:var(--navy);font-weight:700}
  .wk-pill.sel{background:var(--navy);border-color:var(--navy)}
  .wk-pill.sel .a,.wk-pill.sel .b,.wk-pill.sel .c{color:#fff}
  .wk-range{min-width:0;flex:1;font-size:13px;white-space:nowrap}
  .wk-day{padding:12px;margin:12px}
  .pg{padding:20px 14px 90px 36px}
  .pg-title{font-size:27px}
  .pb-hd{left:-34px}
  .pb-hd .grip{display:none}
  .pcols{flex-direction:column;gap:6px}
  .pb-colhead .pb-hd .grip{display:inline-flex}
  .kv{grid-template-columns:84px 1fr}
  .dtbl{font-size:12.5px}
  .hide-m{display:none!important}
  .row-sel,.row-sel-all{opacity:.55}
  .tbl-hint{display:none}
}
@media (max-width:720px){ .hgrid,.z-personal .hgrid,.hgrid-row{grid-template-columns:repeat(2,minmax(0,1fr))} .hz{padding:10px 10px 12px} .home-foot span{display:none} }
@media (min-width:721px){ .show-m{display:none!important} }
@media print{
  #sb,#topbar{display:none!important}
  #page-wrap{overflow:visible}
  body{overflow:visible}
}

/* 프로젝트 상세 — 할 일별 비중 */
.pj-prog{display:flex;align-items:center;gap:10px}
.pj-prog .prog{flex:1;max-width:240px;height:8px}
.pj-td{display:flex;align-items:stretch;gap:6px}
.pj-td .td-card{flex:1;min-width:0}
.pj-w{display:flex;align-items:center;gap:2px;flex-shrink:0;width:74px;padding:0 8px;border:1px solid var(--border);border-radius:5px;background:#fff;font-size:12px;color:var(--text2)}
.pj-w:focus-within{border-color:var(--teal);box-shadow:0 0 0 2px var(--teal-lt)}
.pj-w input{width:100%;min-width:0;border:none;outline:none;background:transparent;font:inherit;font-size:13px;font-weight:600;text-align:right;color:var(--text);-moz-appearance:textfield}
.pj-w input::-webkit-inner-spin-button,.pj-w input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.pj-w.auto input{font-weight:400}
.pj-w.auto input::placeholder{color:var(--text3)}

/* 루틴 */
.td-rt{display:inline-flex;align-items:center;gap:2px;color:var(--teal);font-weight:600}
.rt-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}
.rt-head .ml{display:flex;align-items:center;margin-left:auto}
.rt-ttl{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:700;margin-bottom:3px}
.rt-tbl td{vertical-align:middle}
.rt-tbl .td-ck{margin:0 auto}
.rt-rate{display:flex;align-items:center;gap:8px}
.rt-rate .prog{width:110px;height:7px}
.rt-rate .prog i{background:var(--teal)}
.rt-dows{display:flex;gap:6px}
.rt-dows button{width:38px;height:34px;border:1px solid var(--border);border-radius:5px;background:#fff;font-size:13px;cursor:pointer;color:var(--text)}
.rt-dows button.we{color:var(--active-red)}
.rt-dows button.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600}
.rt-form .seg{flex-wrap:wrap}
.rt-preview{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;background:var(--sand-lt);border-radius:5px}

/* 프로젝트 · 할 일 화면 */
.pj-view button{padding:0 10px}
.pj-tbl-only{display:none}
.pj-list{display:none;border-top:1px solid var(--border)}
.pj-tbl-mode .pj-list{display:block}
.pj-tbl-mode .pj-tbl-only{display:inline-block}
.pj-tbl-mode .tl,.pj-tbl-mode .tl-undated,.pj-tbl-mode [data-a=prev],.pj-tbl-mode [data-a=next],.pj-tbl-mode .tl-range,.pj-tbl-mode [data-a=today],.pj-tbl-mode [data-a=zoom],.pj-tbl-mode [data-a=cat],.pj-tbl-mode .tog{display:none!important}
.td-sec-h{display:flex;align-items:center;gap:14px;padding:4px 18px 0;border-bottom:1px solid var(--border)}
.td-sec-h .tabbar{border-bottom:none;margin:0;overflow:visible}
/* 프로젝트 / 할 일 구역 제목 */
.pj-sec-h{display:flex;align-items:center;gap:10px;margin:2px 0 12px}
.pj-sec-h.td{margin-top:34px;padding-top:24px;border-top:2px solid var(--sand)}
.pj-sec-ico{width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;background:var(--navy);color:#fff;flex-shrink:0}
.pj-sec-h.td .pj-sec-ico{background:var(--teal)}
.pj-sec-t{font-size:17px;font-weight:700;letter-spacing:-.3px;line-height:1.2}
.pj-sec-s{font-size:12px;color:var(--text3);margin-top:2px}
.td-sec{border-top:3px solid var(--teal)}
.pj-card{border-top:3px solid var(--navy)}
.td-rt-box{padding:16px 18px}

/* 주간 할 일: 오른쪽에 선택한 날(오늘) 패널 · 주말 포함/제외 · 프로젝트 색상 필터 */
.wk-main{display:flex;align-items:stretch;gap:16px;background:var(--sand-lt)}
.wk-main.no-day{background:none}
.wk-main .wk{flex:1;min-width:0;background:#fff;border-right:1px solid var(--border)}
.wk-main:not(.no-day) .wk{border-bottom:1px solid var(--border)}
/* 오늘(선택한 날) 패널 — 주간 칸과 떨어진 별도 카드 */
.wk-main .wk-day{width:300px;flex-shrink:0;margin:14px 14px 14px 0;border:1px solid var(--sand);border-top:4px solid var(--navy);border-radius:8px;background:#fff;padding:14px 14px 12px;display:flex;flex-direction:column;align-self:flex-start;max-height:calc(var(--wkh,420px) + 20px)}
.wk-main .wk-day.is-today{border-color:#BFDCE6;border-top-color:var(--teal);background:#F4FAFC}
.wk-main .wk-day-h{gap:6px 8px;margin-bottom:10px}
.wk-main .wk-day-h b{font-size:14px;width:100%;order:2}
.wk-main .wk-day-tag{order:1}
.wk-main .wk-day-n{order:1;margin-left:auto}
.wk-main .wk-day-bar{order:3;width:100%}
.wk-main .wk-day-list{flex:1;overflow-y:auto;max-height:var(--wkh,420px)}
.wk-main.no-day .wk-day{display:none}
.wk-we button{height:26px;padding:0 11px;font-size:12px}
.wk-proj{display:inline-flex;align-items:center;gap:7px;max-width:220px;cursor:pointer;text-align:left}
.wk-proj.on{border-color:var(--navy);color:var(--navy);font-weight:600}
.wk-proj svg{margin-left:auto;flex-shrink:0;color:var(--text3)}
.wk-pnm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wk-pdot{width:10px;height:10px;border-radius:3px;flex-shrink:0;display:inline-block}
.wk-pdot.all{background:conic-gradient(#002C5F 0 25%,#007FA8 0 50%,#A36B4F 0 75%,#4F4A86 0)}
.wk-proj-pop{min-width:240px}
.wk-proj-pop .pop-item{gap:9px}
@media (max-width:720px){
  .wk-main{display:block}
  .wk-main .wk-day{width:auto;margin:12px;border:1px solid var(--sand);border-left:4px solid var(--navy);border-radius:8px}
  .wk-main .wk-day.is-today{border-left-color:var(--teal)}
}

/* 할 일 추가 줄의 '추가' 버튼 — 글자를 입력하면 나타남 */
.wk-add-go{display:none;flex-shrink:0;height:22px;padding:0 8px;border:none;border-radius:4px;background:var(--navy);color:#fff;font-size:11.5px;font-weight:600;cursor:pointer}
.wk-add.has .wk-add-go{display:inline-flex;align-items:center}
.wk-add-go:hover{background:var(--navy-600)}

/* 선택지 관리 — 끌어서 순서 · 색 계열 미리보기 */
.opt-row{transition:background-color .15s}
.opt-row.dragging{opacity:.4}
.opt-row.drop-before{box-shadow:inset 0 2px 0 var(--teal)}
.opt-row.drop-after{box-shadow:inset 0 -2px 0 var(--teal)}
.opt-grip{display:inline-flex;color:var(--text3);cursor:grab;padding:4px 2px}
.opt-grip:active{cursor:grabbing}
.opt-shades{display:flex;gap:2px;margin-left:6px}
.opt-shades i{width:14px;height:14px;border-radius:3px;display:block}
/* 프로젝트 색: 분류 색 계열 */
.fpcolor .fswatch{min-height:36px}
.fpcolor .fswatch button{width:30px;height:30px}
.fpcolor .fhelp b{color:var(--text)}

/* 새로 추가한 프로젝트 줄 강조 */
.tl-row.tl-flash .tl-lab,.tl-row.tl-flash .tl-track{animation:tlFlash 2.4s ease}
.pchip.tl-flash{animation:tlFlash 2.4s ease}
@keyframes tlFlash{0%,40%{background:#FFF3C4}100%{background:transparent}}

/* 할 일: 주간 할 일 상자 | 오늘 할 일 상자 (분리) */
.td-split{display:flex;gap:16px;align-items:stretch}
.td-split>.td-sec{flex:1;min-width:0}
.td-day-card{width:320px;flex-shrink:0;border-top:4px solid var(--navy);display:flex;flex-direction:column;position:relative}
.td-day-card.is-today{border-top-color:var(--teal)}
.td-day-card .wk-day{margin:0;border:none;border-radius:0;background:transparent;padding:16px 16px 12px;display:flex;flex-direction:column;flex:1;min-height:0;position:absolute;inset:0}
.td-day-card .wk-day.is-today{background:transparent}
.td-day-card .wk-day-h{gap:6px 8px;margin-bottom:12px}
.td-day-card .wk-day-h b{font-size:15px;width:100%;order:2}
.td-day-card .wk-day-tag{order:1}
.td-day-card .wk-day-n{order:1;margin-left:auto}
.td-day-card .wk-day-bar{order:3;width:100%}
.td-day-card .wk-day-list{flex:0 1 auto;min-height:0;overflow-y:auto}
.td-day-card .td-card{background:#fff}
@media (max-width:720px){
  .td-split{flex-direction:column-reverse}
  .td-day-card{width:100%;position:static}
  .td-day-card .wk-day{position:static}
}

/* 주간 할 일 도구 줄 한 줄로 */
.td-sec .wk-bar{gap:6px;padding:10px 14px;flex-wrap:nowrap;overflow:hidden}
.td-sec .wk-range{min-width:140px}
.td-sec .wk-bar>*{flex-shrink:0;white-space:nowrap}
.td-sec .wk-bar .wk-proj{flex-shrink:1;min-width:90px}
@media (max-width:1400px){ .td-sec .wk-bar .tog{display:none} .td-sec .wk-range small{display:none} .td-sec .wk-range{min-width:110px;font-size:14px} }
.td-sec .wk-bar [data-a=sum]{white-space:nowrap}
.wk-jump{position:relative;display:inline-flex}
.wk-jump input{position:absolute;inset:0;opacity:0;pointer-events:none;width:100%}
@media (max-width:1500px){ .td-sec .wk-bar [data-a=sum]{display:none} }
@media (max-width:720px){ .td-sec .wk-bar{flex-wrap:wrap} }

/* ═══════════ [[페이지 링크]] · 백링크 (v0.3.0) ═══════════ */
.pb-t a.wl,.pb-t a[href^="#/page/"]{color:var(--navy);font-weight:600;text-decoration:none;background:var(--navy-50);border-radius:3px;padding:0 3px;word-break:keep-all}
.pb-t a.wl::before,.pb-t a[href^="#/page/"]::before{content:'↗';font-size:.8em;margin-right:2px;color:var(--teal)}
.pb-t a.wl:hover,.pb-t a[href^="#/page/"]:hover{background:var(--navy-100)}
.wl-pop{width:290px}
.pe-back{margin-top:28px;border-top:1px solid var(--sand);padding-top:12px}
.pe-back-h{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--text3);margin-bottom:6px}
.pe-back-h b{color:var(--navy)}
.pe-back-h a{color:var(--teal);text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.pe-back-h a:hover{text-decoration:underline}
.pe-back-i{display:flex;align-items:center;gap:8px;padding:5px 6px;border-radius:4px;color:var(--text);text-decoration:none;font-size:13.5px}
.pe-back-i:hover{background:var(--sand-lt);color:var(--navy)}

/* ═══════════ 그래프 뷰 ═══════════ */
.gv{position:relative;height:100%;min-height:calc(100dvh - 64px);overflow:hidden;background:#FBFAF9}
.gv-cv{position:absolute;inset:0;display:block;cursor:default;touch-action:none}
.gv-panel{position:absolute;top:14px;right:14px;width:236px;max-height:calc(100% - 28px);overflow-y:auto;background:rgba(255,255,255,.96);border:1px solid var(--border);border-radius:var(--rl);box-shadow:var(--sh1);padding:4px 12px 10px;z-index:3}
.gv-panel.hide{display:none}
.gv-sec{padding:10px 0;border-bottom:1px solid var(--sand-lt);display:flex;flex-direction:column;gap:5px}
.gv-sec:last-child{border-bottom:none}
.gv-h{font-size:10.5px;font-weight:700;letter-spacing:1.2px;color:var(--text3);margin-bottom:2px}
.gv-q{width:100%!important;margin-bottom:4px}
.gv-ck{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text2);cursor:pointer}
.gv-ck.dis{opacity:.45;cursor:default}
.gv-areas{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.gv-area{display:inline-flex;align-items:center;gap:5px;font-size:12px;border:1px solid var(--border);border-radius:50px;padding:3px 9px 3px 6px;cursor:pointer;color:var(--text2)}
.gv-area input{display:none}
.gv-area i{width:9px;height:9px;border-radius:50%;background:var(--ac);opacity:.3}
.gv-area:has(input:checked){border-color:var(--ac);color:var(--text)}
.gv-area:has(input:checked) i{opacity:1}
.gv-sl{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--text2)}
.gv-sl input{width:100%}
.gv-sec .btn{align-self:flex-start;margin-top:2px}
.gv-legend span{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text2)}
.gv-legend i{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.gv-legend i.sq{border-radius:2px}
.gv-legend i.dia{border-radius:1px;transform:rotate(45deg) scale(.85)}
.gv-zoom{position:absolute;left:14px;bottom:14px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;z-index:3}
.gv-zoom button{width:34px;height:32px;border:none;background:none;cursor:pointer;color:var(--text2);display:flex;align-items:center;justify-content:center}
.gv-zoom button+button{border-top:1px solid var(--border)}
.gv-zoom button:hover{background:var(--sand-lt);color:var(--navy)}
.gv-stat{position:absolute;left:60px;bottom:16px;font-size:11.5px;color:var(--text3);z-index:3;pointer-events:none}
.gv-tip{position:absolute;display:none;pointer-events:none;background:#1C1B1B;color:#fff;border-radius:4px;padding:6px 9px;font-size:12px;z-index:4;max-width:260px}
.gv-tip b{display:block;font-weight:600}
.gv-tip span{color:#C9CCCF;font-size:11px}
.gv-local{position:absolute;top:14px;left:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:rgba(255,255,255,.96);border:1px solid var(--border);border-radius:var(--rl);padding:6px 8px 6px 12px;font-size:12.5px;z-index:3;max-width:calc(100% - 280px)}
.gv-local b{color:var(--navy)}
.gv-local .seg button{height:24px;padding:0 10px}

/* ═══════════ 캔버스 목록 ═══════════ */
.cvl-intro{display:flex;gap:8px;align-items:flex-start;color:var(--text2);font-size:13px;background:var(--sand-lt);border-radius:var(--r);padding:10px 14px;margin-bottom:18px;line-height:1.55}
.cvl-intro svg{color:var(--teal);margin-top:2px}
.cvl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.cvl-card{position:relative;background:#fff;border:1px solid var(--border);border-radius:var(--rl);overflow:hidden;cursor:pointer;transition:border-color var(--dur) var(--ease)}
.cvl-card:hover{border-color:var(--navy)}
.cvl-pv{height:150px;background:#FBFAF9 radial-gradient(circle,#DDD8D2 1px,transparent 1.2px) 0 0/16px 16px;border-bottom:1px solid var(--sand-lt);display:flex;align-items:center;justify-content:center;padding:10px}
.cvl-pv svg{width:100%;height:100%}
.cvl-empty{color:var(--border2)}
.cvl-meta{padding:10px 40px 12px 14px}
.cvl-t{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cvl-s{font-size:11.5px;color:var(--text3);margin-top:3px}
.cvl-more{position:absolute;right:6px;bottom:12px}
.cvl-new{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:212px;color:var(--text3);border-style:dashed;font-size:13px}
.cvl-new:hover{color:var(--navy)}

/* ═══════════ 캔버스 편집 ═══════════ */
.cv{position:relative;height:100%;min-height:calc(100dvh - 64px);overflow:hidden;user-select:none}
.cv-vp{position:absolute;inset:0;overflow:hidden;background-color:#FBFAF9;background-image:radial-gradient(circle,#D6D0C9 1px,transparent 1.3px);cursor:default;touch-action:none}
.cv-vp.far{background-image:none}
.cv-vp.space,.cv-vp.panning{cursor:grabbing}
.cv-vp.drop{box-shadow:inset 0 0 0 3px var(--teal)}
.cv-world{position:absolute;left:0;top:0;transform-origin:0 0}
.cv-edges{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;z-index:1}
.cv-e .ln{fill:none;stroke:var(--ec,#8E99A4);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.cv-e polygon{fill:var(--ec,#8E99A4)}
.cv-e .hit{fill:none;stroke:transparent;stroke-width:16;pointer-events:stroke;cursor:pointer}
.cv-e:hover .ln{stroke-width:3}
.cv-e.sel .ln{stroke:var(--ec,var(--teal));stroke-width:3.4}
.cv-e.sel polygon{fill:var(--ec,var(--teal))}
.cv-e.temp .ln{stroke:var(--teal);stroke-dasharray:6 4}
.cv-e.temp polygon{fill:var(--teal)}
.cv-elabel{position:absolute;transform:translate(-50%,-50%);background:#FBFAF9;color:var(--ec,var(--text2));border:1px solid transparent;border-radius:4px;padding:2px 7px;font-size:13px;white-space:nowrap;z-index:2;cursor:pointer}
.cv-elabel.sel{border-color:var(--teal)}
.cv-node{position:absolute;z-index:2;background:#fff;border:1.5px solid #D5D9DD;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.cv-node.has-c{border-color:var(--nc)}
.cv-node.has-c:not(.t-group){background:color-mix(in srgb,var(--nc) 7%,#fff)}
.cv-node:hover{border-color:var(--navy-400)}
.cv-node.has-c:hover{border-color:var(--nc)}
.cv-node.sel{box-shadow:0 0 0 2px var(--teal);border-color:var(--teal)}
.cv-node.target{box-shadow:0 0 0 3px var(--teal)}
.cv-in{position:absolute;inset:0;overflow:hidden;border-radius:7px}
.cv-node.t-group{z-index:0;background:rgba(0,0,0,.025);border-color:#CFC8BF}
.cv-node.t-group.has-c{background:color-mix(in srgb,var(--nc) 9%,transparent);border-color:var(--nc)}
.cv-node.t-group .cv-in{overflow:visible}
.cv-glabel{position:absolute;left:0;bottom:100%;margin-bottom:6px;font-size:15px;font-weight:600;white-space:nowrap;background:var(--nc,#E9E5E0);color:#fff;padding:3px 10px;border-radius:5px}
.cv-node.t-group:not(.has-c) .cv-glabel{color:var(--text2)}
.cv-glabel .ph{opacity:.6;font-weight:400}
/* 텍스트 카드 (마크다운) */
.cv-md{position:absolute;inset:0;overflow:auto;padding:12px 16px;font-size:14px;line-height:1.6;color:var(--text);cursor:default}
.cv-md::-webkit-scrollbar{width:4px}
.cv-md h1,.cv-md h2,.cv-md h3,.cv-md h4{line-height:1.3;margin:4px 0 6px;letter-spacing:-0.6px}
.cv-md h1{font-size:24px}.cv-md h2{font-size:19px}.cv-md h3{font-size:16px}.cv-md h4{font-size:14.5px}
.cv-md p{margin:0}
.cv-md p.gap{height:.6em}
.cv-md p.ph{color:var(--text3)}
.cv-md ul,.cv-md ol{padding-left:20px;margin:2px 0}
.cv-md ul.ck{list-style:none;padding-left:2px}
.cv-md ul.ck li{display:flex;gap:7px;align-items:baseline}
.cv-md ul.ck li i{width:12px;height:12px;border:1.5px solid var(--border2);border-radius:3px;flex-shrink:0;position:relative;top:1px}
.cv-md ul.ck li.done{color:var(--text3);text-decoration:line-through}
.cv-md ul.ck li.done i{background:var(--control);border-color:var(--control)}
.cv-md blockquote{border-left:3px solid var(--nc,var(--sand));padding-left:10px;color:var(--text2);margin:2px 0}
.cv-md hr{border:none;border-top:1px solid var(--border);margin:8px 0}
.cv-md code{background:var(--sand-lt);border-radius:3px;padding:0 4px;font-size:.92em}
.cv-md pre{background:var(--sand-lt);border-radius:4px;padding:8px 10px;font-size:12.5px;white-space:pre-wrap;margin:4px 0}
.cv-md mark{background:#FFF1A8}
.cv-md a{color:var(--teal);cursor:pointer}
.cv-md a.wl{color:var(--navy);font-weight:600;text-decoration:none;background:var(--navy-50);border-radius:3px;padding:0 3px}
.cv-md a.wl:hover{background:var(--navy-100)}
.cv-md a.wl.miss{color:var(--text3);background:none;border-bottom:1px dashed var(--border2);border-radius:0}
.cv-node.editing{box-shadow:0 0 0 2px var(--teal)}
.cv-ta{position:absolute;inset:0;width:100%;height:100%;border:none;outline:none;resize:none;padding:12px 16px;font-family:var(--font);font-size:14px;line-height:1.6;background:transparent;color:var(--text);user-select:text}
/* 페이지 · 프로젝트 카드 */
.cv-ref{position:absolute;inset:0;display:flex;flex-direction:column;border-left:4px solid var(--ac,var(--border))}
.cv-ref.miss{border-left:none;align-items:center;justify-content:center;flex-direction:row;gap:6px;color:var(--text3);font-size:13px}
.cv-ref-h{display:flex;align-items:center;gap:7px;padding:10px 12px 8px;border-bottom:1px solid var(--sand-lt)}
.cv-ref-h b{flex:1;min-width:0;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-ref-h .ic{display:inline-flex;font-size:15px}
.cv-ref-k{font-size:10.5px;color:var(--text3);border:1px solid var(--border);border-radius:4px;padding:0 5px;white-space:nowrap}
.cv-ref-b{flex:1;overflow:hidden;padding:8px 12px 10px;font-size:12.5px;line-height:1.55;color:var(--text2);display:flex;flex-direction:column;gap:2px}
.cv-ref-b .ex-h{font-weight:700;color:var(--text);font-size:13px;margin-top:3px}
.cv-ref-b .ex-li::before{content:'• ';color:var(--text3)}
.cv-ref-b .ex-todo::before{content:'☐ ';color:var(--text3)}
.cv-ref-b .ex-todo.done{text-decoration:line-through;color:var(--text3)}
.cv-ref-b .ex-todo.done::before{content:'☑ '}
.cv-ref-b .ex-q{border-left:2px solid var(--sand);padding-left:7px}
.cv-ref-b .ex-muted{color:var(--text3);display:flex;align-items:center;gap:4px}
.cv-ref-b .ex-child{color:var(--navy);font-weight:600}
.cv-ref-b hr{border:none;border-top:1px solid var(--sand-lt);margin:3px 0}
.cv-prog{height:6px;background:var(--sand-lt);border-radius:3px;overflow:hidden;margin:6px 0 2px}
.cv-prog i{display:block;height:100%;background:var(--ac)}
.cv-desc{margin-top:6px;white-space:pre-wrap;color:var(--text2)}
.cv-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:7px;pointer-events:none}
.cv-link{position:absolute;inset:0;display:flex;align-items:center;gap:12px;padding:10px 14px}
.cv-link b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-link span{display:block;font-size:11.5px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cv-link .fav{flex-shrink:0}
.cv-file.miss{color:var(--text3)}
.cv-file.miss b{color:var(--text2)}
/* 연결 점 · 크기 조절 */
.cv-hd{position:absolute;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--teal);opacity:0;transition:opacity .15s;cursor:crosshair;z-index:3}
.cv-hd[data-side=top]{left:50%;top:-8px;margin-left:-7px}
.cv-hd[data-side=bottom]{left:50%;bottom:-8px;margin-left:-7px}
.cv-hd[data-side=left]{top:50%;left:-8px;margin-top:-7px}
.cv-hd[data-side=right]{top:50%;right:-8px;margin-top:-7px}
.cv-node:hover>.cv-hd,.cv-node.sel>.cv-hd{opacity:1}
.cv-hd:hover{background:var(--teal)}
.cv-node.editing>.cv-hd{opacity:0;pointer-events:none}
.cv-rs{position:absolute;right:-5px;bottom:-5px;width:14px;height:14px;cursor:nwse-resize;z-index:3;opacity:0}
.cv-rs::after{content:'';position:absolute;right:5px;bottom:5px;width:8px;height:8px;border-right:2px solid var(--teal);border-bottom:2px solid var(--teal);border-radius:0 0 3px 0}
.cv-node.sel>.cv-rs,.cv-node:hover>.cv-rs{opacity:1}
.cv-marq{position:absolute;display:none;border:1px solid var(--teal);background:rgba(0,127,168,.08);z-index:5;pointer-events:none}
/* 떠 있는 막대들 */
.cv-tools{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;gap:2px;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:var(--sh2);padding:4px;z-index:6}
.cv-tools button{display:flex;flex-direction:column;align-items:center;gap:2px;border:none;background:none;border-radius:7px;padding:6px 10px 5px;cursor:pointer;color:var(--text2);font-size:11px;min-width:54px}
.cv-tools button:hover{background:var(--sand-lt);color:var(--navy)}
.cv-zoom{position:absolute;right:14px;bottom:18px;display:flex;align-items:center;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:var(--sh1);padding:2px;z-index:6}
.cv-zoom button{height:30px;min-width:30px;border:none;background:none;border-radius:5px;cursor:pointer;color:var(--text2);display:flex;align-items:center;justify-content:center;font-size:12px}
.cv-zoom button.pct{min-width:48px;font-variant-numeric:tabular-nums}
.cv-zoom button:hover{background:var(--sand-lt);color:var(--navy)}
.cv-zoom i{width:1px;height:18px;background:var(--border);margin:0 3px}
.cv-bar{position:absolute;display:none;align-items:center;gap:2px;background:#fff;border:1px solid var(--border);border-radius:8px;box-shadow:var(--sh2);padding:4px;z-index:7;white-space:nowrap}
.cv-bar>i{width:1px;height:20px;background:var(--border);margin:0 3px}
.cv-bar button{height:28px;border:none;background:none;border-radius:5px;padding:0 8px;cursor:pointer;color:var(--text2);font-size:12.5px;display:inline-flex;align-items:center;gap:4px}
.cv-bar button:hover{background:var(--sand-lt);color:var(--navy)}
.cv-bar button.danger:hover{color:var(--red);background:var(--red-lt)}
.cv-sw{display:inline-flex;gap:3px;padding:0 3px}
.cv-sw button{width:20px;height:20px;padding:0;border-radius:50%;background:var(--c,#fff);border:1.5px solid var(--c,#B1B1B1)}
.cv-sw button[data-col=""]{background:linear-gradient(135deg,#fff 45%,#E63312 46%,#E63312 54%,#fff 55%)}
.cv-sw button.on{box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--c,var(--text2))}
.cv-sw button:hover{transform:scale(1.12);background:var(--c,#fff)}
.cv-sw button[data-col=""]:hover{background:linear-gradient(135deg,#fff 45%,#E63312 46%,#E63312 54%,#fff 55%)}
.cv-cnt{font-size:12px;color:var(--text3);padding:0 6px}
.cv-title{cursor:pointer}
.cv-title:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.cv-save{margin-right:6px;display:inline-flex;align-items:center;gap:3px}
.cv-pick{width:300px;padding:8px}
.cv-pick .finp-sm{width:100%;margin-bottom:6px}
.cv-pick-l{max-height:300px;overflow-y:auto}
.cv-pick .pop-item{height:auto;padding:6px 8px}
.cv-pick .pop-item.sel{background:var(--sand-lt)}
.cv-pick .pop-item small{display:block;font-size:11px;color:var(--text3)}
.cv-drawer-pg .pg{padding:24px 28px 80px}
.cv-help h4{font-size:13px;color:var(--navy);margin:14px 0 6px}
.cv-help h4:first-child{margin-top:0}
.cv-help ul{padding-left:18px;font-size:13px;line-height:1.75;color:var(--text2)}
.cv-help code{background:var(--sand-lt);border-radius:3px;padding:0 4px}
@media (max-width:720px){
  .gv,.cv{min-height:calc(100dvh - 55px)}
  .gv-panel{left:10px;right:10px;width:auto;max-height:60%}
  .gv-local{max-width:calc(100% - 20px)}
  .cv-tools{bottom:64px}
  .cv-tools button{min-width:44px;padding:6px 6px 5px}
  .cv-tools button span{display:none}
  .cv-zoom{right:10px;bottom:12px}
}
.cv-vp.cut .cv-e.temp .ln{stroke:var(--red)}
.cv-vp.cut .cv-e.temp polygon{fill:var(--red)}
.cv-vp.cut{cursor:no-drop}

/* ═══════════ 페이지 — 박스 (v0.3.1) ═══════════ */
.pbox-wrap{position:relative;margin:8px 0;border:1px solid var(--sand);border-radius:8px;background:var(--sand-lt);padding:4px 10px 8px 4px}
.pbox-wrap.has-bg{background:var(--bxc);border-color:color-mix(in srgb,var(--bxl) 22%,transparent)}
.pb.pb-boxhead{margin:0;padding-top:2px}
.pb-boxhead .pb-c{display:flex;align-items:center;gap:6px;min-height:34px}
.pbox-tog{border:none;background:none;width:22px;height:22px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;color:var(--text3);cursor:pointer;transition:transform .2s var(--ease);flex-shrink:0}
.pbox-tog:hover{background:rgba(0,0,0,.06);color:var(--navy)}
.pbox-wrap.closed .pbox-tog{transform:rotate(-90deg)}
.pbox-emoji{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:5px;cursor:pointer;font-size:19px;color:var(--bxl,var(--text3));flex-shrink:0}
.pbox-emoji:hover{background:rgba(0,0,0,.06)}
.pbox-title{flex:1;min-width:0;font-size:15.5px;font-weight:700;outline:none;color:var(--bxl,var(--text));padding:3px 2px}
.pbox-title:empty::before{content:attr(data-ph);color:var(--text3);font-weight:500}
.pbox-cnt{font-size:11.5px;color:var(--text3);white-space:nowrap;margin-right:4px}
.pbox-body{padding:2px 0 0 26px;min-height:8px}
.pbox-wrap.closed .pbox-body{display:none}
.pbox-wrap.closed{padding-bottom:4px}
.pbox-body .pb.has-bg{background:rgba(255,255,255,.6)}
.pbox-empty{margin:4px 0 2px}
.pcol-empty.drop-in{border-color:var(--teal)!important;background:var(--teal-lt)!important;color:var(--teal)!important}
.pbox-wrap .pcols-wrap{margin:4px 0}

/* ═══════════ 페이지 — 앱 아이콘 ═══════════ */
.pa-grid{display:flex;flex-wrap:wrap;gap:14px 10px;padding:6px 0}
.pa-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;width:calc(var(--s) + 22px);cursor:pointer;user-select:none;border-radius:8px;padding:4px 0}
.pa-grid.sz-s{--s:44px}.pa-grid.sz-m{--s:58px}.pa-grid.sz-l{--s:76px}
.pa-ic{width:var(--s);height:var(--s);border-radius:calc(var(--s) * .26);background:var(--pa,#fff);border:1px solid rgba(0,0,0,.08);box-shadow:0 1px 3px rgba(0,0,0,.08);display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:calc(var(--s) * .5);line-height:1;color:var(--navy);transition:transform .15s var(--ease),box-shadow .15s var(--ease)}
.pa-ic.dark{color:#fff;border-color:transparent}
.pa-ic b{font-size:calc(var(--s) * .42);font-weight:700}
.pa-ic img{width:100%;height:100%;object-fit:cover}
.pa-ic .picon{width:55%;height:55%}
.pa-tile:hover .pa-ic{transform:translateY(-2px);box-shadow:0 4px 10px rgba(0,0,0,.12)}
.pa-tile:active .pa-ic{transform:scale(.95)}
.pa-nm{font-size:12px;color:var(--text2);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;line-height:1.3}
.pa-grid.sz-s .pa-nm{font-size:11px}
.pa-edit{position:absolute;top:-2px;right:4px;width:22px;height:22px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--text2);display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--sh1)}
.pa-tile:hover .pa-edit{display:flex}
.pa-edit:hover{color:var(--navy);border-color:var(--navy)}
.pa-add .pa-ic{background:transparent;border:1.5px dashed var(--border2);box-shadow:none;color:var(--text3)}
.pa-add:hover .pa-ic{border-color:var(--navy);color:var(--navy);transform:none;box-shadow:none}
.pa-add .pa-nm{color:var(--text3)}
.pa-tile.dragging{opacity:.4}
.pa-tile.drop-l::before,.pa-tile.drop-r::after{content:'';position:absolute;top:4px;bottom:22px;width:3px;border-radius:2px;background:var(--teal)}
.pa-tile.drop-l::before{left:-6px}.pa-tile.drop-r::after{right:-6px}
.pa-form{display:flex;gap:20px;align-items:flex-start}
.pa-prev{width:120px;flex-shrink:0;display:flex;justify-content:center;background:var(--sand-lt);border-radius:8px;padding:16px 0}
.pa-prev .pa-tile{pointer-events:none}
.pa-fields{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.pa-fields .flabel{margin-top:6px;font-size:12.5px;color:var(--text2);font-weight:600}
.pa-fields .fselect{height:36px;font-size:13px}
.pa-icbtns{display:flex;gap:6px;flex-wrap:wrap}
.pa-bgs{display:flex;gap:6px;flex-wrap:wrap}
.pa-bgs button{width:24px;height:24px;border-radius:7px;background:var(--c);border:1px solid rgba(0,0,0,.15);cursor:pointer}
.pa-bgs button.on{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--teal)}
@media (max-width:720px){ .pa-form{flex-direction:column;align-items:stretch} .pa-prev{width:auto} .pbox-body{padding-left:8px} }
.pcols.n4,.pcols.n5{gap:24px}
@media (max-width:1100px){ .pcols.n4,.pcols.n5{flex-wrap:wrap} .pcols.n4>.pcol,.pcols.n5>.pcol{flex:1 1 40%} }

/* ── 콜아웃 상자 (v0.3.2): 흰 바탕 · 회색 테두리, 블록을 끌어 넣기 ── */
.pbox-wrap.pcall{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;column-gap:4px;background:#fff;border:1px solid #D5D9DD;border-radius:6px;padding:8px 14px 8px 10px}
.pbox-wrap.pcall.has-bg{background:var(--bxc);border-color:#D5D9DD}
.pcall>.pb-boxhead{padding:0}
.pcall>.pb-boxhead .pb-c{min-height:0;gap:0}
.pcall.has-ic>.pb-boxhead .pb-c{min-height:30px}
.pcall>.pb-boxhead .pb-hd{left:-48px;top:2px}
.pcall:not(.has-ic)>.pb-boxhead{width:0}
.pcall>.pbox-body{padding:0}
.pcall .pbox-empty{margin:2px 0}
.pcall:hover>.pb-boxhead>.pb-hd{opacity:1}

/* ═══════════ 돈관리 · 거래내역 (CMS 방식 엑셀형 표, v0.4.0) ═══════════ */
.lg-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.lg-month{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:4px 6px}
.lg-month b{min-width:96px;text-align:center;font-size:14px}
.lg-month .btn.on{background:var(--teal);border-color:var(--teal);color:#fff}
.lg-search{position:relative;display:flex;align-items:center}
.lg-search svg{position:absolute;left:9px;color:var(--text3);pointer-events:none}
.lg-search input{padding-left:28px;width:200px}
.lg-bar-r{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.lg-card .card-h{min-height:46px;padding:10px 16px}
.lg-info{display:flex;gap:14px;font-size:12.5px;color:var(--text2)}
.lg-info b{color:var(--text)}
.lg-scrl{overflow:auto;max-height:calc(100vh - 300px);min-height:220px}
.lg-tbl{border-collapse:collapse;table-layout:fixed;width:100%;min-width:1150px;font-size:12.5px}
.lg-tbl thead th{position:sticky;top:0;z-index:4;background:var(--sand-lt);height:36px;padding:0 8px;font-size:11.5px;font-weight:600;color:var(--text2);text-align:left;border-bottom:1px solid var(--sand);border-right:1px solid #E7E1DA;white-space:nowrap;cursor:pointer;user-select:none}
.lg-tbl thead th.num{text-align:right}
.lg-tbl thead th.g1{background:#EEF5F0}
.lg-tbl thead th.g2{background:#F3F0F7}
.lg-tbl thead th:hover{color:var(--navy)}
.lg-th{display:flex;align-items:center;justify-content:space-between;gap:4px}
.lg-fbtn{border:none;background:none;width:20px;height:20px;border-radius:4px;color:var(--text3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.lg-fbtn:hover{background:rgba(0,0,0,.06);color:var(--text2)}
.lg-fbtn.on{background:var(--teal);color:#fff}
.lg-sorti{font-style:normal;font-size:9px;color:var(--teal);margin-left:3px}
.lg-tbl td{position:relative;padding:0;height:34px;border-bottom:1px solid #EEECEA;border-right:1px solid #F1EFEC;vertical-align:middle}
.lg-tbl td:last-child,.lg-tbl th:last-child{border-right:none}
/* 굵은 세로 구분선: 일자 | CNY | KRW | 내용 | 계좌 */
.lg-tbl tbody td[data-col=cny_in],.lg-tbl tbody td[data-col=krw_in],.lg-tbl tbody td[data-col=content],.lg-tbl tbody td[data-col=account_id]{border-left:2px solid #B9C0C6}
.lg-tbl .vc{display:block;padding:0 8px;line-height:33px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:cell}
.lg-tbl td.num .vc{text-align:right;font-variant-numeric:tabular-nums}
.lg-tbl td[data-col=date] .vc{font-weight:600;color:var(--text2)}
.lg-tbl td:hover .vc{background:rgba(0,127,168,.06)}
.lg-tbl td.editing .vc{visibility:hidden}
.lg-ed{position:absolute;inset:0;width:100%;height:100%;border:2px solid var(--teal);border-radius:3px;background:#fff;padding:0 7px;font-size:12.5px;font-family:var(--font);color:var(--text);outline:none;z-index:3}
.lg-ed.num{text-align:right}
.lg-ed[type=number]{-moz-appearance:textfield}
.lg-ed[type=number]::-webkit-inner-spin-button,.lg-ed[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.lg-fill{position:absolute;right:-3px;bottom:-3px;width:8px;height:8px;background:var(--teal);border:1px solid #fff;box-shadow:0 0 0 1px rgba(0,127,168,.5);cursor:crosshair;z-index:5}
.lg-tbl td.fill-pv{background:var(--teal-lt);box-shadow:inset 0 0 0 2px var(--teal)}
body.lg-filling,body.lg-filling *{cursor:crosshair!important;user-select:none!important}
.lg-tbl tr.lg-row:hover td{background:#FAFBFC}
.lg-tbl tr.brk td{border-top:2px solid #C9CED3}
.lg-tbl tr.blank td{background:#FBFBFD}
.lg-tbl tr.blank:hover td{background:#F2F6FA}
.lg-tbl tr.lg-full td{text-align:center;color:var(--text3);font-size:12px;padding:10px;background:var(--sand-lt)}
.lg-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:1px}
.lg-badge{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:4px;font-size:11.5px;font-weight:600;white-space:nowrap}
.lg-act{text-align:center}
.lg-del{border:none;background:none;width:26px;height:26px;border-radius:4px;color:var(--text3);cursor:pointer;opacity:0;display:inline-flex;align-items:center;justify-content:center}
.lg-tbl tr:hover .lg-del{opacity:1}
.lg-del:hover{color:var(--red);background:var(--red-lt)}
/* 행 사이 + (경계선 위에 마우스를 올리면) */
.lg-tbl tr.lg-addrow td{height:0;padding:0;border:none;overflow:visible}
.lg-addhit{position:absolute;left:0;right:0;top:-6px;height:12px;z-index:2}
.lg-addline{position:absolute;left:0;right:0;top:50%;height:2px;transform:translateY(-50%);pointer-events:none}
.lg-addhit:hover .lg-addline{background:var(--teal)}
.lg-addbtn{position:absolute;left:4px;top:50%;transform:translateY(-50%) scale(.5);width:18px;height:18px;border-radius:50%;background:var(--teal);color:#fff;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);font-size:13px;font-weight:800;line-height:1;cursor:pointer;opacity:0;display:flex;align-items:center;justify-content:center;padding:0;transition:opacity .15s,transform .15s}
.lg-addhit:hover .lg-addbtn{opacity:1;transform:translateY(-50%) scale(1)}
.lg-pager{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;border-top:1px solid var(--border);font-size:11.5px;color:var(--text3)}
.lg-pg{display:inline-flex;gap:2px;background:var(--sand-lt);border-radius:999px;padding:3px}
.lg-pg button{min-width:28px;height:26px;border:none;background:none;border-radius:999px;font-size:12px;font-weight:600;color:var(--text2);cursor:pointer}
.lg-pg button.on{background:var(--teal);color:#fff}
.lg-pg button:disabled{opacity:.35;cursor:default}
.lg-hint{font-size:11px;color:var(--text3);padding:7px 14px;text-align:right;border-top:1px solid var(--border)}
.lg-hint kbd{background:var(--sand-lt);border:1px solid var(--border);border-radius:3px;padding:1px 5px;font-family:inherit;font-size:10.5px}
.lg-fmenu{padding:0;min-width:170px;max-width:280px}
.lg-fbody{max-height:280px;overflow-y:auto;padding:6px}
.lg-fopt{display:flex;align-items:center;gap:7px;padding:5px 6px;border-radius:4px;cursor:pointer;font-size:12.5px}
.lg-fopt:hover{background:var(--sand-lt)}
.lg-ffoot{display:flex;justify-content:space-between;padding:4px 6px;border-top:1px solid var(--border)}
/* 목록 관리 */
.lgm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.lgm-grid.one{grid-template-columns:minmax(0,360px)}
.lgm-col{border:1px solid var(--border);border-radius:6px;display:flex;flex-direction:column;min-height:320px}
.lgm-h{padding:8px 10px;font-size:12.5px;font-weight:700;border-bottom:1px solid var(--border);background:var(--sand-lt)}
.lgm-list{flex:1;overflow-y:auto;max-height:340px;padding:4px}
.lgm-it{display:flex;align-items:center;justify-content:space-between;padding:4px 6px;border-radius:4px;cursor:pointer;font-size:13px}
.lgm-it:hover{background:var(--sand-lt)}
.lgm-it.on{background:var(--teal-lt);box-shadow:inset 3px 0 0 var(--teal)}
.lgm-it button{border:none;background:none;color:var(--text3);cursor:pointer;width:22px;height:22px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;opacity:0}
.lgm-it:hover button{opacity:1}
.lgm-it button:hover{color:var(--red);background:var(--red-lt)}
.lgm-add{display:flex;gap:4px;padding:6px;border-top:1px solid var(--border)}
.lgm-add .finp-sm{flex:1;width:auto}
@media (max-width:720px){ .lg-bar-r{margin-left:0} .lg-scrl{max-height:none} .lgm-grid{grid-template-columns:1fr} }
.lgm-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.lgm-acts{display:inline-flex;gap:2px}
.lgm-it .lgm-acts button{opacity:0}
.lgm-it:hover .lgm-acts button{opacity:1}
.lgm-n{color:var(--text3);font-size:11px;margin-left:6px}
.sb-zone.fixed{cursor:default}

/* ── 사이드바 영역 머리글 (v0.4.9) — 아이콘 엠블럼 · 자간 넓은 이름 · 가는 그라데이션 선 ── */
.sb-zone{display:flex;align-items:center;gap:10px;margin:22px 16px 6px;padding:0;background:none;border:none;border-radius:0;font-size:13px;letter-spacing:0}
.sb-zone:first-child{margin-top:14px}
.sb-zone .sb-zic{width:26px;height:26px;flex-shrink:0;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(140deg,var(--zc) 0%,var(--zc2) 100%);box-shadow:0 3px 8px -2px color-mix(in srgb,var(--zc) 55%,transparent),inset 0 1px 0 rgba(255,255,255,.25)}
.sb-zone b{font-size:12.5px;font-weight:800;letter-spacing:4px;color:var(--zc)}
.sb-zone .sb-zline{flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--zc) 45%,transparent),color-mix(in srgb,var(--zc) 8%,transparent) 70%,transparent)}
.z-work{--zc:#002C5F;--zc2:#1F5F9E;--zbg:transparent}
.z-personal{--zc:#7A4E36;--zc2:#C49373;--zbg:transparent}
.sb-zone-body{position:relative}
.sb-zone-body > .sb-sec:first-child{padding-top:8px}
/* 자동이체 합계 · 표 아래 최소 막대 (v0.4.10) */
.tbl-foot.tbl-foot-min{padding:0;border:none;min-height:0}
.tbl-foot.tbl-foot-min .sel-bar:empty{display:none}
.dtbl tr.at-foot td{height:auto;padding:10px 16px;background:var(--sand-lt);border-top:1px solid var(--sand);white-space:normal;max-width:none}
.at-sum{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 0}
.at-sum + .at-sum{border-top:1px dashed var(--sand);margin-top:4px;padding-top:8px}
.at-cur{display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:24px;border-radius:12px;background:var(--navy);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.5px}
.at-k{display:flex;flex-direction:column;gap:1px;padding:4px 14px;border-left:1px solid var(--sand);min-width:120px}
.at-k small{font-size:11px;color:var(--text3)}
.at-k b{font-size:14px;font-variant-numeric:tabular-nums}
.at-k.now{margin-left:auto;background:#fff;border:1px solid var(--sand);border-radius:6px;padding:5px 14px}
.at-k.now b{color:var(--red)}

/* ── 대시보드 업무 / 개인 구역 (v0.4.11) — 사이드바 영역 머리글과 같은 모양 ── */
.dz{--zc:#002C5F;--zc2:#1F5F9E;--zbg:#F3F6FA;background:linear-gradient(180deg,var(--zbg),rgba(255,255,255,0) 160px);border:1px solid #E4E8EE;border-radius:12px;padding:16px 18px 18px;margin-bottom:20px}
.dz-personal{--zc:#7A4E36;--zc2:#C49373;--zbg:#FAF5F1;border-color:#EDE3DA}
.dz-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.dz-em{width:32px;height:32px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(140deg,var(--zc),var(--zc2));box-shadow:0 4px 10px -3px color-mix(in srgb,var(--zc) 55%,transparent),inset 0 1px 0 rgba(255,255,255,.25);flex-shrink:0}
.dz-h b{font-size:17px;font-weight:800;letter-spacing:5px;color:var(--zc)}
.dz-ln{flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--zc) 40%,transparent),transparent)}
.dz-links{display:flex;gap:4px}
.dz-links a{font-size:12px;color:var(--zc);text-decoration:none;padding:4px 10px;border-radius:14px;border:1px solid color-mix(in srgb,var(--zc) 25%,transparent);background:#fff}
.dz-links a:hover{background:var(--zc);color:#fff}
.dz .kpi-grid{margin-bottom:0}
.dz .dash-grid{margin-top:14px}
.dz-personal .kpi.kbl{background:var(--zc);border-color:var(--zc)}
.dz-personal .kpi.kbl:hover{background:#68412C}
.dz-personal .dash-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:960px){ .dz-personal .dash-grid{grid-template-columns:1fr} .dz-links{display:none} }

/* ── 사이드바 영역 머리글 시안 F (v0.4.12) — 글꼴은 Pretendard 고딕 ── */
.sb-zone.sbz-f{display:block;margin:26px 20px 4px;padding:0;background:none;border:none}
.sb-zone.sbz-f:first-child{margin-top:16px}
.sbz-f .sbz-t{display:flex;align-items:baseline;gap:8px}
.sbz-f .sbz-t b{font-family:var(--font);font-size:17px;font-weight:700;letter-spacing:-0.3px;color:var(--zc);line-height:1.2}
.sbz-f .sbz-t small{font-size:9.5px;font-weight:700;letter-spacing:2.4px;color:var(--zc2)}
.sbz-f .sbz-ln{position:relative;height:1px;margin-top:8px;background:color-mix(in srgb,var(--zc) 22%,transparent)}
.sbz-f .sbz-ln::after{content:'';position:absolute;left:0;top:-1px;width:30px;height:3px;border-radius:2px;background:var(--zc)}
.sb-zone.sbz-f + .sb-zone-body > .sb-sec:first-child{padding-top:10px}

/* ── 사이드바 업무 페이지 · 개인 페이지 머리글: SALES · MARKETING 과 같은 글자 톤 (v0.4.13) ── */
.sb-sec.pg-sec{font-size:10.5px;letter-spacing:1.4px;color:var(--text3);font-weight:600}
.sb-sec.pg-sec:hover{color:var(--navy)}
.sb-sec.pg-sec .pa-dot{width:5px;height:5px;border-radius:50%;background:var(--border2)}
/* 한글은 같은 10.5px라도 영문 대문자(SALES)보다 작고 성글어 보여 크기 · 자간을 보정 (v0.4.14) */
.sb-sec.pg-sec{font-size:11px;letter-spacing:.6px;font-weight:600}
.sb-sec.pg-sec .sb-sec-act{width:18px;height:18px}

/* ── 사이드바 그룹 소제목 (SALES · MARKETING · MONEY · 업무/개인 페이지) — 메뉴와 구분되는 옅은 색 띠 (v0.4.15) ── */
.sb-zone-body .sb-sec{margin:12px 12px 3px;padding:6px 8px 6px 9px;border:none;border-radius:6px;background:color-mix(in srgb,var(--zc) 6%,#fff);color:color-mix(in srgb,var(--zc) 78%,#fff);font-size:10.5px;font-weight:700;letter-spacing:1.6px;position:relative}
.sb-zone-body .sb-sec::before{content:'';position:absolute;left:0;top:6px;bottom:6px;width:2px;border-radius:2px;background:var(--zc);opacity:.55}
.sb-zone-body > .sb-sec:first-child{margin-top:8px;padding-top:6px}
.sb-zone-body .sb-sec .sb-chev{color:inherit;opacity:.7}
.sb-zone-body .sb-sec.sb-tog:hover{background:color-mix(in srgb,var(--zc) 11%,#fff);color:var(--zc)}
.sb-zone-body .sb-sec.pg-sec{font-size:11px;letter-spacing:.6px;font-weight:700}
.sb-zone-body .sb-sec.pg-sec .pa-dot{background:color-mix(in srgb,var(--zc) 50%,#fff)}
.sb-zone-body .sb-sec .sb-sec-act{color:inherit}
.sb-zone-body .sb-sec .sb-sec-act:hover{border-color:var(--zc);color:var(--zc);background:#fff}

/* ── 콘텐츠 자료함 · 통합 캘린더 (v0.4.16) ── */
.ac-bar{flex-wrap:wrap;gap:8px}
.ac-sum{font-size:12.5px;color:var(--text2);margin-left:6px}
.ac-chs{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.ac-chip{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 9px;border-radius:13px;border:1px solid var(--border);background:#fff;color:var(--text3);font-size:12px;cursor:pointer}
.ac-chip small{font-size:10.5px;color:inherit;opacity:.75}
.ac-chip.on{border-color:var(--cc);color:var(--cc);background:color-mix(in srgb,var(--cc) 8%,#fff);font-weight:600}
.ac-m>div{min-height:112px}
.ac-m>div.drop{background:var(--teal-lt);box-shadow:inset 0 0 0 2px var(--teal)}
.ac-ev{display:flex;align-items:center;gap:4px;font-size:11px;border-radius:4px;padding:2px 6px 2px 5px;margin-bottom:3px;cursor:grab;color:color-mix(in srgb,var(--cc) 85%,#000);background:color-mix(in srgb,var(--cc) 10%,#fff);border-left:3px solid var(--cc);white-space:nowrap;overflow:hidden}
.ac-ev .t{overflow:hidden;text-overflow:ellipsis;min-width:0}
.ac-ev svg{flex-shrink:0;opacity:.85}
.ac-ev.done{background:var(--cc);color:#fff}
.ac-ev.late{box-shadow:inset 0 0 0 1px var(--red)}
.ac-ev.dragging{opacity:.4}
.ac-ev:hover{filter:brightness(.96)}
.ac-hint{padding:8px 14px;border-top:1px solid var(--border)}
.ac-undated{margin-top:14px}
.ac-ud{display:flex;flex-wrap:wrap;gap:6px}
.ac-ud .ac-ev{margin:0;max-width:260px}

/* ── 채널 목표 · 실적 (v0.4.17) ── */
.gl-goal{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text2)}
.gl-goal .gl-in{width:120px;height:30px;border:1px solid var(--border);background:#fff;border-radius:5px;text-align:right;padding:0 8px;font-weight:700}
.gl-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
.gl-st{border:1px solid var(--border);border-radius:8px;padding:10px 14px;display:flex;flex-direction:column;gap:2px;background:#fff}
.gl-st small{font-size:11.5px;color:var(--text3)}
.gl-st b{font-size:22px;font-weight:800;letter-spacing:-0.5px;font-variant-numeric:tabular-nums;color:var(--text)}
.gl-st b em{font-style:normal;font-size:14px;margin-left:1px;color:var(--text2)}
.gl-st span{font-size:11.5px;color:var(--text3)}
.gl-pct{background:var(--navy-50);border-color:var(--navy-100)}
.gl-bar{position:relative;height:8px;border-radius:4px;background:#fff;margin-top:6px;overflow:visible}
.gl-bar i{display:block;height:100%;border-radius:4px;background:var(--navy)}
.gl-bar u{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--gold);border-radius:1px;transform:translateX(-1px)}
.gc-wrap{position:relative}
.gc{width:100%;height:auto;display:block}
.gc-grid{stroke:#EFECE8;stroke-width:1}
.gc-base{stroke:#C9C2BA;stroke-width:1}
.gc-ax{font-size:10.5px;fill:var(--text3);font-family:var(--font)}
.gc-lb{font-size:11px;fill:var(--text2);font-family:var(--font)}
.gc-lb.cur{fill:var(--navy);font-weight:700}
.gc-v{font-size:10.5px;fill:var(--text);font-weight:700;font-family:var(--font)}
.gc-tg{fill:#E9E3DC}
.gc-ac{fill:var(--navy)}
.gc-hit{fill:transparent}
.gc-m.cur .gc-hit{fill:rgba(0,44,95,.035)}
.gc-m.on .gc-hit{fill:rgba(0,127,168,.07)}
.gc-tip{position:absolute;display:none;pointer-events:none;background:#1C1B1B;color:#fff;border-radius:6px;padding:7px 10px;font-size:12px;line-height:1.6;z-index:3;min-width:130px}
.gc-tip i,.gl-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.gc-tip i.ac,.gl-legend i.ac{background:var(--navy)}
.gc-tip i.tg,.gl-legend i.tg{background:#E9E3DC}
.gc-tip .r{margin-top:2px;color:#C9CCCF}.gc-tip .r.ok{color:#8CE0B5}
.gc-tip small{color:#C9CCCF}
.gl-legend{display:flex;gap:14px;font-size:12px;color:var(--text2);margin-top:6px;flex-wrap:wrap}
.gl-tbl .gl-rate td{font-size:11.5px;color:var(--text3);height:30px}
.gl-tbl .gl-rate td.ok{color:#2E6B4F;font-weight:700}
@media (max-width:900px){ .gl-stats{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ── 홈: 업무 홈 · 개인 홈 · 페이지 카드 (v0.4.18) ── */
.z-work{--zc2:#1F5F9E}.z-personal{--zc2:#C49373}
.hz-h{align-items:center}
.hz-h b{font-size:17px;font-weight:700}
.hz-h .hz-en{font-size:9.5px;font-weight:700;letter-spacing:2.4px;color:var(--zc2)}
.hz-go{margin-left:auto;font-size:12px;color:var(--zc);text-decoration:none;display:inline-flex;align-items:center;gap:2px;padding:3px 8px;border-radius:12px;border:1px solid color-mix(in srgb,var(--zc) 22%,transparent)}
.hz-go:hover{background:var(--zc);color:#fff}
.hsec-h{display:flex;align-items:center;gap:6px}
.hsec-n{font-weight:500;letter-spacing:0;color:var(--text3)}
.hsec-pg{border-top:1px solid #F0EEEC;padding-top:10px;margin-top:4px}
.ht2.hpg .ht2-ico.hpg-ic{background:#fff;border:1px solid var(--border);font-size:17px}
.ht2.hpg:hover .ht2-ico.hpg-ic{background:#fff;color:inherit;border-color:var(--zc)}
.ht2.hpg.new{border-style:dashed;background:transparent;cursor:pointer;font-family:var(--font);text-align:left}
.ht2.hpg.new .ht2-ico{background:transparent;border:1px dashed var(--border2);color:var(--text3)}
.ht2.hpg.new b{color:var(--text2);font-weight:600}
/* 업무 홈 · 개인 홈 (한 영역만 넓게) */
.hsolo-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap;position:relative;padding-bottom:12px}
.hsolo-t{display:flex;align-items:baseline;gap:8px}
.hsolo-t b{font-size:24px;font-weight:800;color:var(--zc);letter-spacing:-0.5px}
.hsolo-t small{font-size:11px;font-weight:700;letter-spacing:3px;color:var(--zc2)}
.hsolo-d{font-size:13px;color:var(--text3)}
.hsolo-h .btn{margin-left:auto}
.hsolo-ln{position:absolute;left:0;right:0;bottom:0;height:1px;background:color-mix(in srgb,var(--zc) 22%,transparent)}
.hsolo-ln::after{content:'';position:absolute;left:0;top:-1px;width:40px;height:3px;border-radius:2px;background:var(--zc)}
.hz.hz-solo{border-top-width:1px;padding:16px 18px 18px}
.hz-solo .hgrid,.z-personal.hz-solo .hgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
.z-personal.hz-solo .ht2[data-r=money]{grid-column:auto;background:#fff}
.hz-solo .hsec{margin-bottom:16px}
.hz-solo .hsec-h{font-size:11.5px;margin-bottom:8px}
@media (max-width:1180px){ .hz-solo .hgrid,.z-personal.hz-solo .hgrid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:720px){ .hz-solo .hgrid,.z-personal.hz-solo .hgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ── 사이드바 업무 홈 · 개인 홈: 메뉴 · 소제목과 다른 영역 색 버튼 (v0.4.19) ── */
.sb-zone-body .sb-link[data-r^="home/"]{margin:10px 14px 2px;height:40px;padding:0 10px 0 7px;border-radius:9px;border:1px solid color-mix(in srgb,var(--zc) 22%,transparent);background:linear-gradient(90deg,color-mix(in srgb,var(--zc) 7%,#fff),#fff);color:var(--zc);font-weight:700;font-size:13px;gap:9px}
.sb-zone-body .sb-link[data-r^="home/"] .sb-ico{width:26px;height:26px;border-radius:7px;background:linear-gradient(140deg,var(--zc),var(--zc2,var(--zc)));color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 6px -2px color-mix(in srgb,var(--zc) 60%,transparent)}
.sb-zone-body .sb-link[data-r^="home/"] .sb-ico svg{width:14px;height:14px}
.sb-zone-body .sb-link[data-r^="home/"]::after{content:'';margin-left:auto;width:6px;height:6px;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg);opacity:.5}
.sb-zone-body .sb-link[data-r^="home/"]:hover{background:color-mix(in srgb,var(--zc) 10%,#fff);color:var(--zc);border-color:color-mix(in srgb,var(--zc) 40%,transparent)}
.sb-zone-body .sb-link[data-r^="home/"]:hover .sb-ico{color:#fff}
.sb-zone-body .sb-link[data-r^="home/"].on{background:linear-gradient(140deg,var(--zc),var(--zc2,var(--zc)));color:#fff;border-color:transparent}
.sb-zone-body .sb-link[data-r^="home/"].on::before{display:none}
.sb-zone-body .sb-link[data-r^="home/"].on .sb-ico{background:rgba(255,255,255,.18);box-shadow:none;color:#fff}
.sb-zone-body .sb-link[data-r^="home/"].on::after{opacity:.8}

/* ── 소제목 높이 통일 · 업무/개인 홈 버튼 크기 (v0.4.20) ── */
.sb-zone-body .sb-sec{height:28px;padding:0 8px 0 9px;display:flex;align-items:center;box-sizing:border-box}
.sb-zone-body > .sb-sec:first-child{padding-top:0}
.sb-zone-body .sb-sec .sb-sec-act{width:18px;height:18px;padding:0}
.sb-zone-body .sb-sec .sb-sec-act svg{width:11px;height:11px}
.sb-zone-body .sb-link[data-r^="home/"]{margin:10px 12px 2px;height:32px;padding:0 9px 0 5px;border-radius:7px;gap:8px;font-size:12.5px}
.sb-zone-body .sb-link[data-r^="home/"] .sb-ico{width:22px;height:22px;border-radius:6px}
.sb-zone-body .sb-link[data-r^="home/"] .sb-ico svg{width:12px;height:12px}

/* ── 홈: 페이지 펼치기 · 홈 고정 (v0.4.21) ── */
.ht2.hpg{position:relative}
.hpg-acts{margin-left:auto;display:flex;gap:2px;flex-shrink:0}
.hpg-acts button{width:24px;height:24px;border:none;background:none;border-radius:5px;color:var(--text3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.hpg-acts button:hover{background:var(--sand-lt);color:var(--zc,var(--navy))}
.hpg-pin{opacity:0}
.ht2.hpg:hover .hpg-pin,.hpg-pin.on{opacity:1}
.hpg-pin.on{color:var(--zc,var(--navy))}
.hpg-exp svg{transition:transform .2s var(--ease)}
.ht2.hpg.opened{border-color:color-mix(in srgb,var(--zc,var(--navy)) 45%,transparent);background:color-mix(in srgb,var(--zc,var(--navy)) 4%,#fff)}
.ht2.hpg.opened .hpg-exp svg{transform:rotate(180deg)}
.ht2.hpg.opened .hpg-exp{color:var(--zc,var(--navy))}
.hexp{margin-top:8px;margin-left:calc(var(--d) * 14px);padding:8px 10px 10px;border-radius:8px;background:color-mix(in srgb,var(--zc,var(--navy)) 4%,#fff);border:1px dashed color-mix(in srgb,var(--zc,var(--navy)) 25%,transparent)}
.hexp-h{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text3);margin-bottom:7px}
.hexp-h b{color:var(--text2)}
.hexp-x{margin-left:auto;width:22px;height:22px;border:none;background:none;border-radius:5px;color:var(--text3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.hexp-x:hover{background:#fff;color:var(--text)}
.hexp .ht2{background:#fff}
.hsec-pin .hsec-h{color:var(--zc,var(--navy))}
.hsec-pin .ht2.hpg{border-color:color-mix(in srgb,var(--zc,var(--navy)) 30%,transparent)}
.hsec-tip{margin-left:auto;font-weight:400;letter-spacing:0;color:var(--text3);font-size:11px}

/* ── 홈 폴더 카드 미리보기 (v0.4.22) ── */
.ht2.hpg.has-prev{flex-direction:column;align-items:stretch;gap:8px}
.hpg-top{display:flex;align-items:center;gap:10px;min-width:0}
.hpg-prev{display:flex;flex-direction:column;gap:1px;border-top:1px dashed var(--border);padding-top:6px;margin-left:44px}
.hpg-pi{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text2);padding:2px 6px;border-radius:4px;cursor:pointer;min-width:0}
.hpg-pi span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.hpg-pi em{font-style:normal;font-size:10.5px;color:var(--text3);background:var(--sand-lt);border-radius:8px;padding:0 5px;margin-left:auto;flex-shrink:0}
.hpg-pi:hover{background:color-mix(in srgb,var(--zc,var(--navy)) 7%,#fff);color:var(--zc,var(--navy))}
.hpg-more{font-size:11.5px;color:var(--text3);padding:2px 6px}
.hgrid{align-items:start}

/* ── 홈 페이지 카드: 한 줄 미리보기 · 팝업 · 업무/개인 홈 6열 (v0.4.24) ── */
.hpg-line{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hpg-ln{color:var(--text2);cursor:pointer;border-radius:3px}
.hpg-ln:hover{color:var(--zc,var(--navy));text-decoration:underline;text-underline-offset:2px}
.hpg-line i{font-style:normal;color:var(--border2);margin:0 4px}
.hpg-line em{font-style:normal;color:var(--text3);margin-left:5px}
.hpg-cnt{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:16px;padding:0 5px;margin-left:5px;border-radius:8px;background:var(--sand-lt);color:var(--text3);font-size:10.5px;font-weight:600;vertical-align:1px}
.hpg-pop{position:fixed;z-index:1500;width:250px;max-height:340px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-top:3px solid var(--zc,var(--navy));border-radius:8px;box-shadow:var(--sh2)}
.hpg-pop-h{display:flex;align-items:center;gap:6px;padding:9px 12px;border-bottom:1px solid #F0EEEC;font-size:13px}
.hpg-pop-h span{margin-left:auto;font-size:11.5px;color:var(--text3)}
.hpg-pop-l{overflow-y:auto;padding:4px}
.hpg-pop-i{display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:5px;font-size:13px;color:var(--text);text-decoration:none}
.hpg-pop-i span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.hpg-pop-i em{font-style:normal;margin-left:auto;font-size:10.5px;color:var(--text3);background:var(--sand-lt);border-radius:8px;padding:0 6px}
.hpg-pop-i:hover{background:color-mix(in srgb,var(--zc,var(--navy)) 7%,#fff);color:var(--zc,var(--navy))}
.hz-solo .hsec-pg .hgrid,.hz-solo .hsec-pin .hgrid,.z-personal.hz-solo .hsec-pg .hgrid,.z-personal.hz-solo .hsec-pin .hgrid{grid-template-columns:repeat(6,minmax(0,1fr))}
.hz-solo .hsec-pg .ht2,.hz-solo .hsec-pin .ht2{padding:9px 8px 9px 10px;gap:8px}
.hz-solo .hsec-pg .hpg-ic,.hz-solo .hsec-pin .hpg-ic{width:30px;height:30px}
@media (max-width:1500px){ .hz-solo .hsec-pg .hgrid,.hz-solo .hsec-pin .hgrid,.z-personal.hz-solo .hsec-pg .hgrid,.z-personal.hz-solo .hsec-pin .hgrid{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:900px){ .hz-solo .hsec-pg .hgrid,.hz-solo .hsec-pin .hgrid,.z-personal.hz-solo .hsec-pg .hgrid,.z-personal.hz-solo .hsec-pin .hgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ── 업무 홈 · 개인 홈: 메뉴 카드(문의 업체 관리 등)도 6열 (v0.4.25) ── */
.hz-solo .hgrid,.z-personal.hz-solo .hgrid{grid-template-columns:repeat(6,minmax(0,1fr))}
.hz-solo .ht2{padding:9px 8px 9px 10px;gap:8px}
.hz-solo .ht2-ico{width:30px;height:30px}
@media (max-width:1500px){ .hz-solo .hgrid,.z-personal.hz-solo .hgrid{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:900px){ .hz-solo .hgrid,.z-personal.hz-solo .hgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ── 할 일(위) + 프로젝트(아래) 한 화면 (v0.4.27) ── */
.td-split .wk{height:var(--wkh);min-height:0}
.td-split .wk-col{min-height:0}
.td-split .wk-list{max-height:none;min-height:0}
.td-split .td-day-card{width:300px}
.pj-below{margin-top:16px}

/* ── 그래프 뷰 다크 모드 (v0.4.29) ── */
.gv-mode button{height:26px;padding:0 11px}
.gv{transition:background-color .25s var(--ease)}
.gv.dark{background:#14181E;color-scheme:dark}
.gv.dark .gv-panel,.gv.dark .gv-local{background:rgba(29,34,41,.96);border-color:#2E353E;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.gv.dark .gv-sec{border-bottom-color:#2A3038}
.gv.dark .gv-h{color:#8B9097}
.gv.dark .gv-ck,.gv.dark .gv-sl,.gv.dark .gv-legend span,.gv.dark .gv-area{color:#C4C8CE}
.gv.dark .gv-area{border-color:#3A424C}
.gv.dark .gv-area:has(input:checked){color:#fff}
.gv.dark .gv-q{background:#14181E;border-color:#3A424C;color:#E6E8EB}
.gv.dark .gv-q::placeholder{color:#6E747C}
.gv.dark .gv-sec .btn{color:#C4C8CE}
.gv.dark .gv-sec .btn:hover{background:#2A3038;color:#fff}
.gv.dark .gv-zoom{background:#1D2229;border-color:#2E353E}
.gv.dark .gv-zoom button{color:#C4C8CE}
.gv.dark .gv-zoom button+button{border-top-color:#2E353E}
.gv.dark .gv-zoom button:hover{background:#2A3038;color:#fff}
.gv.dark .gv-stat{color:#7D838B}
.gv.dark .gv-tip{background:#F2F3F5;color:#1C1B1B;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.gv.dark .gv-tip span{color:#5D6268}
.gv.dark .gv-local b{color:#7FD3EC}
.gv.dark .gv-local .seg{background:#2A3038}
.gv.dark .gv-local .seg button{color:#AEB3BA}
.gv.dark .gv-local .seg button.on{color:#fff}
.gv.dark .gv-local .btn{color:#C4C8CE}
.gv.dark .gv-local .btn:hover{background:#2A3038;color:#fff}
.gv.dark .gv-panel::-webkit-scrollbar-thumb{background:#3A424C}
.gv.dark .gv-legend i,.gv.dark .gv-area i{box-shadow:0 0 0 1.5px rgba(255,255,255,.55)}
/* 프로젝트 · 할 일 화면 섹션 제목 (v0.4.30) — 아이콘 + 이름 */
.pj-head{display:flex;align-items:center;gap:10px;height:34px;margin:0 0 10px}
.pj-head+*{margin-top:0}
*+.pj-head{margin-top:18px}
.pj-hico{width:34px;height:34px;flex-shrink:0;border-radius:5px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center}
.pj-head b{font-size:16px;font-weight:700;color:var(--text);letter-spacing:-.2px}
.pj-head-td .pj-hico{background:var(--teal)} /* 할 일 = 오늘 할 일 표시와 같은 색 */
/* 슬라이서 버튼 (폼 'pick') — 우선순위 · 프로젝트 연결 (v0.4.35) */
.fpick{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:38px}
.fpick button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 13px;border:1px solid var(--border);border-radius:50px;background:#fff;color:var(--text2);font-size:13px;cursor:pointer;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background-color .15s var(--ease),border-color .15s var(--ease),color .15s var(--ease)}
.fpick button:hover{border-color:var(--teal);color:var(--text)}
.fpick button i{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.fpick button.none{color:var(--text3)}
.fpick button.on{background:var(--teal);border-color:var(--teal);color:#fff;font-weight:600}
.fpick button.on i{box-shadow:0 0 0 1.5px #fff}
.fpick .prio-bars{flex-shrink:0}
.fpick button.on .prio-bars rect{fill:#fff;opacity:1}
.fpick button.on .prio-bars rect[opacity]{opacity:.35}

/* ═══════════ 지식 · 자료 (v0.5.0) ═══════════ */
/* 공통 보드 */
.lb-intro{font-size:13px;color:var(--text3);margin:0 0 12px;line-height:1.6}
.lb-intro mark,.lb-var{background:#FFF4CC;color:#7A5B00;border-radius:3px;padding:0 3px;font-weight:600}
.lb-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.lb-search{display:flex;align-items:center;gap:6px;height:34px;padding:0 10px;border:1px solid var(--border);border-radius:var(--r);background:#fff;color:var(--text3);min-width:200px}
.lb-search input{border:none;outline:none;font:inherit;font-size:13px;flex:1;min-width:0;background:none}
.lb-search:focus-within{border-color:var(--teal)}
.lb-chips{display:flex;gap:5px;flex-wrap:wrap;flex:1 1 320px}
.lb-chip{display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 11px;border:1px solid var(--border);border-radius:50px;background:#fff;font:inherit;font-size:12.5px;color:var(--text2);cursor:pointer;transition:background-color .15s var(--ease),border-color .15s var(--ease),color .15s var(--ease)}
.lb-chip span{font-size:11px;color:var(--text3)}
.lb-chip:hover{border-color:var(--teal)}
.lb-chip.on{background:var(--teal);border-color:var(--teal);color:#fff;font-weight:600}
.lb-chip.on span{color:#D7EEF5}
.lb-x button{height:26px;padding:0 11px}
.lb-favf{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 11px;border:1px solid var(--border);border-radius:50px;background:#fff;font:inherit;font-size:12.5px;color:var(--text2);cursor:pointer}
.lb-favf.on{border-color:#C9A227;color:#7A5B00;background:#FFF8E1}
.lb-favf.on svg{fill:#C9A227;stroke:#C9A227}
.lb-cnt{font-size:12px;color:var(--text3);white-space:nowrap}
.lb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.lb-card{background:#fff;border:1px solid var(--border);border-radius:var(--rl);padding:14px 15px 12px;display:flex;flex-direction:column;gap:7px;cursor:pointer;min-width:0;transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
.lb-card:hover{border-color:var(--teal);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.lb-ch{display:flex;align-items:center;gap:4px;min-height:22px}
.lb-sub{font-size:11.5px;color:var(--text3);background:var(--sand-lt);border-radius:4px;padding:1px 7px;white-space:nowrap}
.lb-star{margin-left:auto;border:none;background:none;cursor:pointer;color:#C9CCCF;padding:2px;display:inline-flex;border-radius:4px}
.lb-star:hover{color:#C9A227;background:#FFF8E1}
.lb-star.on{color:#C9A227}.lb-star.on svg{fill:#C9A227}
.lb-tt{font-size:14.5px;font-weight:700;color:var(--text);line-height:1.35}
.lb-body{font-size:12.5px;color:var(--text2);line-height:1.65;background:#FAFAFA;border-radius:5px;padding:8px 10px;flex:1}
.lb-bt{white-space:pre-wrap;word-break:break-all;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.lb-body.mono{font-family:Consolas,'D2Coding',monospace,var(--font);font-size:12px}
.lb-ft{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--text3);margin-top:auto}
.lb-open{color:var(--teal);font-weight:600;display:inline-flex;align-items:center;gap:2px}
.lb-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:14px}
.lb-sum>div{background:#fff;border:1px solid var(--border);border-radius:var(--rl);padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.lb-sum span{font-size:12px;color:var(--text3)}.lb-sum b{font-size:20px;font-weight:800;color:var(--text)}.lb-sum small{font-size:11.5px;color:var(--text3)}
.lb-sum .warn b{color:var(--red)}
/* 빈칸 채워 복사 */
.fill-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.fill-prev{background:#FAFAFA;border:1px solid var(--border);border-radius:var(--r);padding:12px 14px;font-size:13px;line-height:1.7;max-height:260px;overflow:auto}

/* 수출 가이드 */
.eg-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.eg-bar .seg button{height:28px}
.eg-flow{display:flex;gap:0;overflow-x:auto;padding:4px 2px 14px;margin-bottom:6px}
.eg-step{position:relative;flex:1 0 82px;display:flex;flex-direction:column;align-items:center;gap:4px;border:none;background:none;cursor:pointer;font:inherit;padding:0 2px;color:var(--text2)}
.eg-step::before{content:'';position:absolute;top:15px;left:-50%;right:50%;height:2px;background:#DDE1E5;z-index:0}
.eg-step:first-child::before{display:none}
.eg-step.past::before,.eg-step.on::before{background:var(--teal)}
.eg-dot{position:relative;z-index:1;width:30px;height:30px;border-radius:50%;background:#fff;border:2px solid #CDD2D7;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;color:var(--text3);transition:all .15s var(--ease)}
.eg-step.past .eg-dot{border-color:var(--teal);color:var(--teal)}
.eg-step.on .eg-dot{background:var(--teal);border-color:var(--teal);color:#fff;box-shadow:0 0 0 4px var(--teal-lt)}
.eg-step b{font-size:12.5px;white-space:nowrap}.eg-step small{font-size:11px;color:var(--text3);white-space:nowrap}
.eg-step.on b{color:var(--teal)}
.eg-step:hover .eg-dot{border-color:var(--teal)}
.eg-det{padding:20px 22px}
.eg-det-h{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--border);margin-bottom:16px}
.eg-no{width:38px;height:38px;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-size:16px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.eg-no.sm{width:24px;height:24px;font-size:11.5px}
.eg-det-t{font-size:20px;font-weight:800;color:var(--navy);letter-spacing:-.4px}
.eg-det-s{font-size:13px;color:var(--text2);margin-top:2px}
.eg-det-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
.eg-meta{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:600;color:var(--teal);background:var(--teal-lt);border-radius:50px;padding:3px 10px;margin-right:4px}
.eg-grid{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:14px}
.eg-col{display:flex;flex-direction:column;gap:14px}
.eg-box{border:1px solid var(--border);border-radius:var(--rl);padding:13px 15px;font-size:13px;line-height:1.65;color:var(--text2)}
.eg-bh{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:8px}
.eg-bh .ml{margin-left:auto}
.eg-ul{margin:0;padding-left:18px}.eg-ul li{margin:3px 0}.eg-ul li::marker{color:var(--teal)}
.eg-ul.sm{font-size:12px;padding-left:15px}.eg-ul.sm li{margin:1px 0}
.eg-docs{display:flex;flex-wrap:wrap;gap:5px}
.eg-doc{font-size:12px;background:var(--navy-50);color:var(--navy);border-radius:4px;padding:2px 8px;font-weight:600}
.eg-warn{background:#FFF8F0;border-color:#F3DCC8}.eg-warn .eg-bh{color:var(--gold)}
.eg-msg{background:#F4FAFC;border-color:#CFE6EE}
.eg-quote{font-size:13px;line-height:1.75;color:var(--text);background:#fff;border-radius:6px;padding:10px 12px;border-left:3px solid var(--teal)}
.eg-quote mark{background:#FFF4CC;color:#7A5B00;border-radius:3px;padding:0 2px}
.eg-nav{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding-top:12px;border-top:1px solid var(--border)}
.eg-all td{vertical-align:top}
.eg-all tr{cursor:pointer}
.egc-card{padding:34px 30px}
@media (max-width:1100px){.eg-grid{grid-template-columns:1fr 1fr}.eg-msg{grid-column:span 2}}
@media (max-width:720px){.eg-grid{grid-template-columns:1fr}.eg-msg{grid-column:auto}.egc-list{grid-template-columns:1fr!important}.fill-grid{grid-template-columns:1fr}}

/* 경쟁사 노트 */
.rv-card{border-top:3px solid var(--rc)}
.rv-h{display:flex;align-items:center;gap:7px}
.rv-h b{font-size:15px}
.rv-dot{width:9px;height:9px;border-radius:50%;background:var(--rc,#6A6E72);flex-shrink:0;display:inline-block}
.drawer-title .rv-dot{margin-right:7px;vertical-align:1px}
.rv-icons{margin-left:auto;display:flex;gap:4px}
.rv-icons a{color:var(--text3);display:inline-flex;padding:3px;border-radius:4px}.rv-icons a:hover{color:var(--teal);background:var(--teal-lt)}
.rv-row{display:flex;gap:8px;font-size:12.5px;color:var(--text2);line-height:1.5}
.rv-row span{flex-shrink:0;width:30px;color:var(--text3);font-size:11.5px;padding-top:1px}
.rv-row.good{color:var(--teal-dk)}.rv-row.bad{color:var(--red)}
.rv-feed{padding:12px 16px;margin-bottom:14px}
.rv-feed-h{display:flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:6px}
.rv-feed-r{display:flex;align-items:center;gap:7px;font-size:12.5px;padding:5px 0;border-top:1px solid #F1F1F1;cursor:pointer;white-space:nowrap;overflow:hidden}
.rv-feed-r:hover{color:var(--teal)}
.rv-feed-t{color:var(--text2);overflow:hidden;text-overflow:ellipsis}
.rv-nd{font-size:11.5px;color:var(--text3);width:38px;flex-shrink:0}
.rv-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.rv-link{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;border:1px solid var(--border);border-radius:50px;padding:3px 10px;color:var(--text2);text-decoration:none}
.rv-link:hover{border-color:var(--teal);color:var(--teal)}
.rv-dl{display:grid;grid-template-columns:70px 1fr;gap:6px 10px;font-size:13px;margin:0}
.rv-dl dt{color:var(--text3);font-size:12px}.rv-dl dd{margin:0;line-height:1.55}
.rv-dl dd.good{color:var(--teal-dk)}.rv-dl dd.bad{color:var(--red)}
.rv-add{border:1px solid var(--border);border-radius:var(--rl);padding:10px;display:flex;flex-direction:column;gap:7px;background:#FAFAFA}
.rv-kinds{display:flex;gap:4px;flex-wrap:wrap}.rv-kinds .lb-chip{height:26px;padding:0 10px}
.rv-add-r{display:flex;gap:6px}.rv-add-r .finput{height:32px}.rv-add-r input[type=date]{width:150px;flex-shrink:0}
.rv-tl{margin-top:10px}
.rv-n{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid #F1F1F1;align-items:flex-start}
.rv-nb{flex:1;font-size:13px;line-height:1.6}
.rv-n .icon-btn{width:24px;height:24px;border:none;opacity:0}.rv-n:hover .icon-btn{opacity:1}

/* 레퍼런스 보드 */
.rf-grid{display:block;columns:4 230px;column-gap:12px}
.rf-card{break-inside:avoid;margin-bottom:12px;padding:0;overflow:hidden;gap:0}
.rf-img{position:relative;background:var(--sand-lt)}
.rf-img img{display:block;width:100%;height:auto;min-height:80px}
.rf-noimg{height:120px;display:flex;align-items:center;justify-content:center;color:var(--text3)}
.rf-n{position:absolute;right:8px;top:8px;background:rgba(0,0,0,.6);color:#fff;font-size:11px;font-weight:700;border-radius:10px;padding:1px 7px}
.rf-b{padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.rf-t{font-size:13px;font-weight:700;line-height:1.4}
.rf-f{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.rf-tag{font-size:11.5px;color:var(--teal)}
.rf-view{display:flex;flex-direction:column;gap:12px}
.rf-imgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px}
.rf-imgs img{width:100%;border-radius:6px;cursor:zoom-in;display:block}
.rf-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rf-meta .btn{margin-left:auto}
.rf-memo{font-size:13.5px;line-height:1.7;background:#FAFAFA;border-radius:6px;padding:10px 12px}

/* 아이디어 뱅크 */
.id-quick{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--teal);border-radius:var(--rl);padding:0 14px;height:46px;margin-bottom:14px;color:var(--teal)}
.id-quick input{flex:1;border:none;outline:none;font:inherit;font-size:14.5px;background:none;color:var(--text)}
.id-kan{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:12px;overflow-x:auto;align-items:start}
.id-col{background:#F1F2F4;border-radius:var(--rl);padding:10px;min-height:200px;transition:background-color .15s}
.id-col.over{background:var(--teal-lt);outline:2px dashed var(--teal)}
.id-h{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--navy);padding:2px 4px 10px}
.id-h span{margin-left:auto;font-size:12px;color:var(--text3);font-weight:600}
.id-list{display:flex;flex-direction:column;gap:8px}
.id-card{background:#fff;border:1px solid var(--border);border-radius:6px;padding:10px 11px 8px;cursor:grab}
.id-card:hover{border-color:var(--teal)}
.id-card.drag{opacity:.4}
.id-t{font-size:13.5px;font-weight:600;line-height:1.45}
.id-m{font-size:12px;color:var(--text3);margin-top:4px;line-height:1.5}
.id-f{display:flex;align-items:center;gap:5px;margin-top:7px}
.id-f .icon-btn{width:24px;height:24px;border:none;margin-left:auto;background:none}
.id-d{font-size:11px;color:var(--text3)}
.id-link{display:inline-flex;align-items:center;gap:3px;font-size:11px;color:var(--teal);font-weight:600}
.id-empty{font-size:12px;color:var(--text3);text-align:center;padding:18px 0;border:1.5px dashed #D5D9DD;border-radius:6px}

/* 독서 · 콘텐츠 기록 */
.rd-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.rd-card{padding:0;overflow:hidden;gap:0}
.rd-cv{aspect-ratio:3/4;background:var(--sand-lt);overflow:hidden}
.rd-cv img{width:100%;height:100%;object-fit:cover;display:block}
.rd-nocv{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:14px;text-align:center;color:#fff;background:linear-gradient(150deg,#4D6B8F,#002C5F)}
.rd-nocv b{font-size:14px;line-height:1.4}
.rd-nocv.k-영화,.rd-nocv.k-드라마{background:linear-gradient(150deg,#B4501C,#5C3A28)}
.rd-nocv.k-강의,.rd-nocv.k-유튜브{background:linear-gradient(150deg,#3B8462,#1E4A36)}
.rd-b{padding:10px 11px 12px;display:flex;flex-direction:column;gap:4px}
.rd-t{font-size:13.5px;font-weight:700;line-height:1.35}
.rd-c{font-size:12px;color:var(--text3)}
.rd-m{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.rd-r{font-size:12px;color:var(--text2);line-height:1.5}
.rd-stars{font-size:12px;letter-spacing:-1px;color:#DADCDE}.rd-stars i{font-style:normal}.rd-stars i.on{color:#C9A227}
.rd-view{display:flex;gap:18px}
.rd-vc{width:170px;border-radius:6px;align-self:flex-start;flex-shrink:0}
.rd-vb{flex:1;min-width:0}
.rd-vm{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.rd-txt{font-size:13.5px;line-height:1.75}
.rd-q{margin:0 0 8px;padding:8px 12px;border-left:3px solid var(--gold);background:var(--sand-lt);font-size:13.5px;line-height:1.7;border-radius:0 6px 6px 0}
@media (max-width:720px){.rd-view{flex-direction:column}.rd-vc{width:120px}.id-kan{grid-template-columns:repeat(4,78vw)}}
/* 지금 보고 있는 메뉴가 든 묶음 — 접기 잠금 (v0.5.1) */
.sb-sec.sb-tog.act-sec{cursor:default}
.sb-sec.act-sec .sb-chev{opacity:.3}
.sb-sec.nope{animation:sbNope .32s ease}
@keyframes sbNope{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
/* 영역 자동 접기 (v0.5.2) — 다른 영역을 보는 동안 머리글 한 줄로 */
.sbz-all{margin-left:auto;align-self:center;width:22px;height:22px;border:none;border-radius:5px;background:none;color:var(--zc2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;opacity:.75;transition:background-color .15s var(--ease),color .15s var(--ease),opacity .15s}
.sbz-all:hover{opacity:1;color:var(--zc);background:color-mix(in srgb,var(--zc) 10%,#fff)}
.sbz-all.folded{opacity:1;color:var(--zc)}
/* 소제목(SALES · MONEY …)은 남기고 메뉴만 접음 — 소제목을 누르면 그 묶음만 잠깐 펼침 */
.sb-zone.zc + .sb-zone-body .sb-body{display:none}
.sb-zone.zc + .sb-zone-body .sb-sec .sb-chev{transform:rotate(-90deg)}
.sb-zone.zc + .sb-zone-body .sb-sec.peek + .sb-body{display:block}
.sb-zone.zc + .sb-zone-body .sb-sec.peek .sb-chev{transform:none}
.sb-zone.zc + .sb-zone-body .sb-sec{margin-top:6px}

/* ═══════════ 대시보드 시안 B (v0.6.0) ═══════════ */
.db2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.dz2{--zc:#002C5F;--zc2:#1F5F9E;background:#fff;border:1px solid #E4E8EE;border-top:3px solid var(--zc);border-radius:10px;padding:14px 16px 16px;min-width:0}
.dz2.dz-personal{--zc:#7A4E36;--zc2:#C49373;border-color:#EDE3DA;border-top-color:var(--zc)}
.dz2-h{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.dz2-h .dz-em{width:28px;height:28px;border-radius:8px}
.dz2-h b{font-size:16px;font-weight:800;color:var(--zc);letter-spacing:-.2px}
.dz2-h small{font-size:9.5px;font-weight:700;letter-spacing:2.2px;color:var(--zc2)}
.dz2 .kpi-grid{margin-bottom:12px;gap:8px}
.dz2 .kpi{padding:9px 11px}
.dz2 .kpi-val{font-size:20px}
.dz2 .kpi-val .sm{font-size:15px;font-weight:600}
.dz2 .kpi-top+.kpi-val+.kpi-sub{padding-left:0}
.dz2.dz-personal .kpi.kbl{background:var(--zc);border-color:var(--zc)}
.dz2.dz-personal .kpi.kbl:hover{background:#68412C}
.dz2-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;grid-auto-flow:row dense}
.dw{border-radius:8px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.dw-full{grid-column:span 2}
.dw-h{display:flex;align-items:center;gap:6px;padding:10px 12px 6px;font-size:13px;font-weight:700;color:var(--text)}
.dw-h .ti{color:var(--zc);display:inline-flex}
.dw-s{font-size:11px;font-weight:500;color:var(--text3)}
.dw-more{margin-left:auto;color:var(--text3);display:inline-flex;padding:3px;border-radius:4px}
.dw-more:hover{color:var(--zc);background:var(--sand-lt)}
.dw-b{padding:2px 10px 10px;font-size:12.5px}
.dw-b .mini-row{min-height:31px;padding:3px 4px;font-size:12.5px;gap:6px}
.dw-b .mini-row .chip{margin:0}
.dw-b .hbar{margin-bottom:7px;font-size:12px}
.dw-b .hbar .lb{width:100px}
.dw-b .hbar .tr{height:7px;border-radius:4px}
.dw-b .hbar .tr i{border-radius:4px}
.dw-sub{font-size:11.5px;color:var(--text3);padding:0 4px 6px}
.dw-empty{font-size:12px;color:var(--text3);padding:10px 4px}
.dw-none{grid-column:span 2;font-size:13px;color:var(--text3);padding:18px;text-align:center;border:1.5px dashed #DDE1E5;border-radius:8px}
.dw-bars{display:flex;align-items:flex-end;gap:10px;height:118px;padding:6px 4px 0}
.dw-bar{flex:1;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;min-width:0}
.dw-bar i{display:block;width:min(34px,70%);background:color-mix(in srgb,var(--bc) 28%,#fff);border-radius:4px 4px 0 0;transition:background-color .15s}
.dw-bar.cur i{background:var(--bc)}
.dw-bar:hover i{background:var(--bc)}
.dw-bv{font-size:11px;font-weight:700;color:var(--text2);white-space:nowrap}
.dw-bl{font-size:11px;color:var(--text3);border-top:1px solid #E5E7EA;width:100%;text-align:center;padding-top:3px}
.dw-donut{display:flex;align-items:center;gap:14px;padding:4px}
.dw-donut svg{width:84px;height:84px;flex-shrink:0}
.dw-leg{display:flex;flex-direction:column;gap:5px;font-size:12px;flex:1;min-width:0}
.dw-leg div{display:flex;align-items:center;gap:6px}
.dw-leg i{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.dw-leg b{margin-left:auto;font-weight:700}
.dw-leg span{width:52px;text-align:right;color:var(--text3)}
.dw-ck{width:15px;height:15px;border:1.5px solid #B9BEC3;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;cursor:pointer}
.dw-ck.on{background:var(--teal);border-color:var(--teal)}
@media (max-width:1180px){.db2{grid-template-columns:1fr}}
@media (max-width:720px){.dz2-g{grid-template-columns:1fr}.dw-full{grid-column:auto}.dz2 .kpi-grid{grid-template-columns:repeat(2,1fr)}}

/* 설정 › 대시보드 */
.dcfg{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px}
.dcfg-col{--zc:#002C5F;padding:14px 16px;border-top:3px solid var(--zc)}
.dcfg-col.dz-personal{--zc:#7A4E36}
.dcfg-h{font-size:15px;font-weight:800;color:var(--zc);margin-bottom:6px}
.dcfg-sec{font-size:12.5px;font-weight:700;color:var(--text);margin:14px 0 7px;display:flex;gap:8px;align-items:baseline}
.dcfg-sec .muted{font-weight:400;font-size:11.5px}
.dcfg-kpis,.dcfg-cat{display:flex;flex-wrap:wrap;gap:5px}
.dcfg-n{display:inline-flex;width:16px;height:16px;border-radius:50%;background:#fff;color:var(--teal);font-size:10.5px;align-items:center;justify-content:center}
.dcfg-list{display:flex;flex-direction:column;gap:5px}
.dcfg-w{display:flex;align-items:center;gap:7px;border:1px solid var(--border);border-radius:6px;padding:6px 8px;background:#fff;font-size:13px}
.dcfg-w b{font-weight:600}
.dcfg-ic{color:var(--zc);display:inline-flex}
.dcfg-size{margin-left:auto}
.dcfg-size button{height:24px;padding:0 9px;font-size:11.5px}
.dcfg-w .icon-btn{width:26px;height:26px}
.dcfg-w .icon-btn:disabled{opacity:.3;cursor:default}
.dcfg-add{display:flex;flex-direction:column;gap:7px}
.dcfg-cat span{font-size:11.5px;color:var(--text3);width:44px;flex-shrink:0;padding-top:7px}
.dcfg-cat .lb-chip{height:28px}
@media (max-width:1000px){.dcfg{grid-template-columns:1fr}}

/* ═══════════ 떠 있는 오늘 할 일 ═══════════ */
.tf{position:fixed;z-index:900;right:18px;bottom:18px;font-size:13px}
.tf-pill{display:flex;align-items:center;gap:7px;height:36px;padding:0 13px 0 10px;border:1px solid #CFE0E7;border-radius:50px;background:rgba(255,255,255,.94);backdrop-filter:blur(6px);box-shadow:0 3px 12px rgba(0,40,70,.13);cursor:pointer;font:inherit;font-size:12.5px;color:var(--text2);transition:box-shadow .15s,transform .15s}
.tf-pill:hover{box-shadow:0 5px 16px rgba(0,40,70,.2);transform:translateY(-1px)}
.tf-pill b{color:var(--teal);font-weight:800}
.tf-ring{width:18px;height:18px;color:var(--teal);flex-shrink:0}
.tf.all-done .tf-ring{color:#2E9E6B}
.tf.open{width:300px;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);border:1px solid #D7E3EA;border-radius:12px;box-shadow:0 8px 28px rgba(0,40,70,.18);overflow:hidden}
.tf.drag{opacity:.9;box-shadow:0 12px 34px rgba(0,40,70,.28)}
.tf-h{display:flex;align-items:center;gap:7px;padding:10px 8px 9px 12px;border-bottom:1px solid #EEF1F3;cursor:grab;user-select:none;background:linear-gradient(180deg,#F4FAFC,#fff)}
.tf.drag .tf-h{cursor:grabbing}
.tf-h b{font-size:13px;color:var(--text)}
.tf-d{font-size:11.5px;color:var(--text3)}
.tf-n{margin-left:auto;font-size:12px;font-weight:800;color:var(--teal)}
.tf-ib{width:26px;height:26px;border:none;background:none;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:var(--text3);cursor:pointer}
.tf-ib:hover{background:var(--sand-lt);color:var(--navy)}
.tf-list{max-height:min(260px,40vh);overflow-y:auto;padding:4px 6px}
.tf-row{display:flex;align-items:center;gap:8px;padding:7px 6px;border-radius:6px;cursor:pointer}
.tf-row:hover{background:#F5F8FA}
.tf-ck{width:17px;height:17px;flex-shrink:0;border:1.5px solid #B4BBC1;border-radius:5px;background:#fff;display:inline-flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;padding:0}
.tf-ck:hover{border-color:var(--teal)}
.tf-ck.on{background:var(--teal);border-color:var(--teal)}
.tf-tm{font-size:11.5px;font-weight:700;color:var(--teal);flex-shrink:0}
.tf-t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-row.done .tf-t{text-decoration:line-through;color:var(--text3)}
.tf-hi{width:6px;height:6px;border-radius:50%;background:var(--red);flex-shrink:0}
.tf-empty{font-size:12.5px;color:var(--text3);padding:14px 6px;text-align:center}
.tf-add{display:flex;align-items:center;gap:6px;padding:8px 12px 10px;border-top:1px solid #EEF1F3;color:var(--text3)}
.tf-add input{flex:1;border:none;outline:none;font:inherit;font-size:12.5px;background:none;min-width:0}
.tf-add:focus-within{color:var(--teal)}
@media print{.tf{display:none}}
@media (max-width:720px){.tf.open{width:calc(100vw - 24px)}}
/* 대시보드 열 안 숫자 칸: 이름 → 숫자 → 설명 세로 배치 (좁은 칸에서도 안 잘리게) */
.dz2 .kpi{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "val" "sub";row-gap:3px;align-items:start;padding:10px 12px}
.dz2 .kpi-val{text-align:left;margin-top:3px}
.dz2 .kpi-lbl{font-size:12px}
.dz2 .kpi-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ═══════════ 설정 › 대시보드 편집 보드 (v0.6.1) ═══════════ */
.de{display:flex;gap:16px;align-items:flex-start;margin-top:12px}
.de-stage{position:relative;flex-shrink:0;overflow:hidden;border-radius:10px;background:repeating-linear-gradient(45deg,#F7F8F9,#F7F8F9 10px,#F3F4F6 10px,#F3F4F6 20px);outline:1px solid #E4E8EE}
.de-canvas{position:absolute;left:0;top:0;transform-origin:0 0;padding:0}
.de .dw-b,.de .dw-more,.de .kpi{pointer-events:none}
.de-w{position:relative;border-radius:9px;outline:1.5px dashed #9CC9DA;outline-offset:2px;cursor:grab;display:flex;flex-direction:column;min-width:0}
.de-w>.dw{flex:1}
.de-w.lifting{opacity:.35}
.de-w:hover{outline-color:var(--teal);outline-style:solid}
.de-bar{position:absolute;top:6px;right:8px;display:flex;align-items:center;gap:4px;background:rgba(255,255,255,.95);border-radius:7px;padding:2px 3px;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.de-grip{color:var(--text3);display:inline-flex;padding:0 2px}
.de-size button{height:22px;padding:0 8px;font-size:11px}
.de-x2,.de-x{border:none;background:none;width:24px;height:24px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:var(--text3);cursor:pointer}
.de-x2:hover,.de-x:hover{background:#FDF0EC;color:var(--red)}
.de-w.drop-before::before,.de-w.drop-after::after{content:'';position:absolute;background:var(--teal);border-radius:3px;z-index:3;box-shadow:0 0 0 3px rgba(0,127,168,.18)}
.de-w:not(.dw-full).drop-before::before{left:-9px;top:0;bottom:0;width:4px}
.de-w:not(.dw-full).drop-after::after{right:-9px;top:0;bottom:0;width:4px}
.de-w.dw-full.drop-before::before{top:-9px;left:0;right:0;height:4px}
.de-w.dw-full.drop-after::after{bottom:-9px;left:0;right:0;height:4px}
.de-drop{display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;border:1.5px dashed #CDD3D9;border-radius:9px;color:var(--text3);font-size:13px;font-weight:600;background:rgba(255,255,255,.6)}
.de-dragging .de-drop{min-height:90px;border-color:var(--teal);color:var(--teal)}
.de-drop.drop-on{background:var(--teal-lt);border-style:solid}
.de-k{position:relative;border-radius:var(--rl);outline:1.5px dashed #9CC9DA;outline-offset:1px;cursor:grab;display:flex}
.de-k>.kpi{flex:1}
.de-k:hover{outline-color:var(--teal);outline-style:solid}
.de-k.lifting{opacity:.35}
.de-k.drop-on{outline:3px solid var(--teal)}
.de-k .de-x{position:absolute;top:3px;right:3px;width:20px;height:20px;background:rgba(255,255,255,.9);opacity:0}
.de-k:hover .de-x{opacity:1}
.de-kempty{border:1.5px dashed #CDD3D9;outline:none;background:rgba(255,255,255,.7);border-radius:var(--rl);font:inherit;font-size:13px;font-weight:600;color:var(--text3);align-items:center;justify-content:center;gap:5px;min-height:76px;cursor:pointer}
.de-kempty:hover{border-color:var(--teal);color:var(--teal)}
.de-panel{flex-shrink:0;position:sticky;top:12px;background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:10px;max-height:calc(100dvh - 110px)}
.de-ph{font-size:14px;font-weight:800;color:var(--text)}
.de-cats{display:flex;flex-wrap:wrap;gap:4px}
.de-cats .lb-chip{height:26px;padding:0 10px;font-size:12px}
.de-lib{display:flex;flex-direction:column;gap:6px;overflow-y:auto;min-height:0;flex:1}
.de-item{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:7px;padding:9px 10px;background:#fff;cursor:grab;font-size:13px;transition:border-color .15s,box-shadow .15s}
.de-item:hover{border-color:var(--teal);box-shadow:0 2px 8px rgba(0,127,168,.15)}
.de-item b{font-weight:600;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.de-ic{color:var(--navy);display:inline-flex}
.de-sz{font-size:11px;color:var(--text3);white-space:nowrap}
.de-item.used{opacity:.45;cursor:default}
.de-item.used:hover{border-color:var(--border);box-shadow:none}
.de-tip{font-size:11.5px;color:var(--text3);line-height:1.6;border-top:1px solid var(--border);padding-top:8px}
@media (max-width:900px){.de{flex-direction:column}.de-panel{position:static;width:100%!important}}
.boot-err{position:fixed;inset:0;z-index:5001;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#F7F8FA;font-size:14px;color:var(--text2);text-align:center;padding:20px}
.boot-err b{font-size:18px;color:var(--text)}
.boot-err button{height:38px;padding:0 18px;border:1px solid var(--border);border-radius:8px;background:#fff;cursor:pointer;font:inherit}
.sb-foot.remote{display:flex;align-items:center;gap:6px}
.sb-foot.remote .dot{background:#2E9E6B}
.sb-logout{margin-left:auto;border:none;background:none;color:var(--text3);cursor:pointer;display:inline-flex;padding:4px;border-radius:5px}
.sb-logout:hover{color:var(--red);background:#FDF0EC}
.mig-card{margin-bottom:14px;border-color:#CFE6EE;background:#F4FAFC}
.mig{display:flex;align-items:center;gap:14px}
.mig-ic{width:42px;height:42px;border-radius:10px;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mig b{font-size:14px}.mig p{font-size:12.5px;color:var(--text2);margin:3px 0 0;line-height:1.6}
.mig .btn{margin-left:auto;flex-shrink:0}

/* ═══════════ 로그인 · 로딩 (v0.7.1, CMS 방식) ═══════════ */
#boot{position:fixed;inset:0;z-index:6000;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;transition:opacity .25s}
#boot.out{opacity:0}
#boot.hide{display:none}
.ll-badge{position:relative;width:76px;height:76px;border-radius:22px;background:linear-gradient(155deg,#0B4A82,#002C5F);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px rgba(0,44,95,.28)}
.ll-badge::after{content:'';position:absolute;inset:0;border-radius:22px;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);background-size:250% 100%;animation:llSheen 2.4s linear infinite}
.ll-ring{position:absolute;inset:-7px;border-radius:26px;border:1.5px solid #0B4A82;opacity:.35;animation:llRing 2.4s ease-out infinite}
#boot-ic{display:flex;color:#fff;position:relative;z-index:1}
.ll-logo{width:44px;height:44px;filter:brightness(0) invert(1)}
.ll-ico{display:flex;animation:llPop .5s cubic-bezier(.34,1.56,.64,1)}
.ll-name{font-size:15px;font-weight:800;color:var(--navy);letter-spacing:.4px;margin-top:4px}
.ll-text{font-size:12.5px;color:var(--text2);font-weight:600;display:flex;gap:2px;margin-top:-8px}
.ll-text .ll-dot{animation:llBlink 1.4s infinite}
.ll-text .ll-dot:nth-child(2){animation-delay:.2s}
.ll-text .ll-dot:nth-child(3){animation-delay:.4s}
@keyframes llPop{0%{opacity:0;transform:scale(.5) rotate(-10deg)}60%{opacity:1;transform:scale(1.15) rotate(3deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes llSheen{0%{background-position:-130% 0}100%{background-position:130% 0}}
@keyframes llRing{0%{transform:scale(.85);opacity:.5}100%{transform:scale(1.25);opacity:0}}
@keyframes llBlink{0%,80%,100%{opacity:.25}40%{opacity:1}}

#login{position:fixed;inset:0;z-index:5900;display:flex;align-items:center;justify-content:center;background:var(--bg);transition:opacity .25s}
#login.out{opacity:0}
#login.busy .lock-card{visibility:hidden}
.lock-card{background:#fff;border-radius:16px;padding:36px 32px 22px;text-align:center;box-shadow:0 18px 50px rgba(0,30,60,.12);width:min(340px,calc(100vw - 32px));border:1px solid #E6E9ED}
.lock-icon{margin-bottom:12px}
.lock-icon img{width:64px;height:64px;border-radius:16px;box-shadow:0 6px 16px rgba(0,0,0,.12);background:#fff;padding:6px}
.lock-title{font-size:22px;font-weight:800;letter-spacing:-.04em;margin-bottom:4px;color:var(--navy)}
.lock-sub{font-size:13px;font-weight:500;color:var(--text2);margin-bottom:22px}
.lg-form{display:flex;flex-direction:column;gap:12px;text-align:left}
.lg-f{display:flex;flex-direction:column;gap:5px}
.lg-f>span:first-child{font-size:12px;font-weight:600;color:var(--text2)}
.lg-f input{width:100%;height:42px;border:1px solid #D5DBE1;border-radius:8px;padding:0 12px;font:inherit;font-size:14px;outline:none;background:#fff}
.lg-f input:focus{border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-lt)}
.pw-field{position:relative;display:block}
.pw-field input{padding-right:40px}
.pw-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:30px;height:30px;border:none;background:none;color:var(--text3);cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px}
.pw-eye:hover{background:var(--sand-lt);color:var(--navy)}
.lg-keep{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text2);cursor:pointer}
.lg-keep input{width:14px;height:14px;margin:0}
.lg-err{min-height:18px;font-size:12px;font-weight:600;color:var(--red)}
.lg-btn{height:44px;border:none;border-radius:8px;background:var(--navy);color:#fff;font:inherit;font-size:14.5px;font-weight:700;cursor:pointer}
.lg-btn:hover{background:var(--navy-600)}
.lg-btn:disabled{opacity:.6;cursor:wait}
.lg-link{border:none;background:none;font:inherit;font-size:12.5px;color:var(--text3);cursor:pointer;padding:2px}
.lg-link b{color:var(--teal)}
.lg-host{margin-top:18px;font-size:11px;color:var(--text3)}
.boot-err img{width:56px;height:56px;opacity:.85}

/* 화면 이동 중 작은 로딩 — 0.15초 뒤에 나타나 빠른 화면에서는 깜빡이지 않음 */
.pg-load{display:flex;align-items:center;justify-content:center;gap:10px;min-height:40vh;color:var(--text3);font-size:13px;font-weight:600;opacity:0;animation:pgIn .2s ease .15s forwards}
.pg-spin{width:22px;height:22px;border-radius:50%;border:2.5px solid #DDE3E8;border-top-color:var(--teal);animation:pgSpin .8s linear infinite}
.card-b .pg-load,.dw-b .pg-load{min-height:80px}
@keyframes pgSpin{to{transform:rotate(360deg)}}
@keyframes pgIn{to{opacity:1}}
.dz2-g>.pg-load{grid-column:1/-1;min-height:260px}
.lg-f[hidden]{display:none}
/* 모바일 그래프 뷰 안에 들어갈 때(embed) — 사이드바 · 상단바 없이 그래프만 */
html.embed #sb,html.embed #topbar,html.embed #sb-ov,html.embed .tf{display:none!important}
html.embed #page-wrap{padding:0}
html.embed .gv{min-height:100dvh}

/* ═══════════ 토스트 · 저장 중 (v0.8.4) ═══════════ */
#toast-wrap{bottom:30px;gap:8px}
.toast{display:flex;align-items:center;gap:10px;min-height:44px;padding:9px 18px 9px 10px;border-radius:50px;background:rgba(24,30,38,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;font-size:13.5px;font-weight:600;letter-spacing:-.2px;box-shadow:0 10px 30px rgba(0,20,40,.28),0 0 0 1px rgba(255,255,255,.06) inset;opacity:0;transform:translateY(12px) scale(.96);transition:opacity .22s ease,transform .28s cubic-bezier(.2,.9,.3,1.2)}
.toast.in{opacity:1;transform:none}
.toast.out{opacity:0;transform:translateY(6px) scale(.98)}
.toast.ok,.toast.err,.toast.info{background:rgba(24,30,38,.92)}
.toast-ic{width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;background:#4FB5D6}
.toast.ok .toast-ic{background:linear-gradient(150deg,#2EC4A0,#1A9E7E);box-shadow:0 0 0 4px rgba(46,196,160,.18)}
.toast.err .toast-ic{background:linear-gradient(150deg,#FF6B52,#E63312);box-shadow:0 0 0 4px rgba(230,51,18,.2)}
.toast.info .toast-ic{background:linear-gradient(150deg,#4FB5D6,#007FA8);box-shadow:0 0 0 4px rgba(0,127,168,.2)}
.toast-m{line-height:1.4}

#saving{position:fixed;inset:0;z-index:5500;display:none;align-items:center;justify-content:center;background:rgba(16,24,34,.26);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
#saving.show{display:flex}
.sv-box{display:flex;align-items:center;gap:14px;background:#fff;border-radius:18px;padding:16px 22px 16px 16px;box-shadow:0 18px 50px rgba(0,20,40,.22);animation:svIn .2s cubic-bezier(.2,.9,.3,1.2)}
@keyframes svIn{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
.sv-gauge{--p:0%;position:relative;width:54px;height:54px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:conic-gradient(#007FA8 var(--p),#E6EBEF 0)}
.sv-gauge::after{content:'';position:absolute;inset:6px;border-radius:50%;background:#fff}
.sv-gauge span{position:relative;z-index:1;font-size:13px;font-weight:800;color:#007FA8;font-variant-numeric:tabular-nums}
.sv-t{display:flex;flex-direction:column;gap:2px}
.sv-t b{font-size:14.5px;font-weight:800;color:var(--text)}
.sv-t small{font-size:12px;color:var(--text3)}
