/* === styles/main.css ===
 * VEAT 인트라넷 메인 스타일시트
 * 원본 index.html 라인 27-692 에서 추출 (666줄)
 */

:root{
  /* Toss-style palette */
  --navy:#191F28;--navy2:#2C3444;--navy3:#3D4A5C;
  --accent:#3182F6;--accent2:#1B64DA;--accent-bg:#EBF3FF;
  --gold:#F5C842;--gold2:#F0B429;--gold-bg:#FFFAE6;
  /* Surface - 토스 특유의 밝고 깨끗한 배경 */
  --bg:#F9FAFB;--white:#FFFFFF;--surface:#F2F4F6;--surface2:#F9FAFB;
  /* Text */
  --text:#191F28;--text2:#3D4A5C;--muted:#6B7684;--muted2:#ADB5C0;
  /* Border - 토스는 선이 매우 얇고 연함 */
  --border:#E5E8EB;--border2:#D1D6DB;
  /* Status */
  --ok:#00C471;--ok-bg:#E8FDF4;
  --warn:#F5A623;--warn-bg:#FFF8EC;
  --danger:#F04452;--danger-bg:#FFF0F2;
  --info:#3182F6;--info-bg:#EBF3FF;
  --purple:#7B61FF;--purple-bg:#F3F0FF;
  /* Shadow - 토스는 그림자 거의 없음 */
  --shadow-xs:0 1px 3px rgba(0,0,0,0.04);
  --shadow-sm:0 2px 8px rgba(0,0,0,0.06);
  --shadow-md:0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg:0 8px 24px rgba(0,0,0,0.10);
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Inter','Noto Sans KR',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;}

/* ── LOGIN - 토스 스타일 ── */
#loginScreen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:#101520;position:relative;overflow:hidden;
}
#loginScreen::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 80% 50% at 20% 50%, rgba(49,130,246,0.12) 0%,transparent 60%),
    radial-gradient(ellipse 60% 60% at 80% 60%, rgba(123,97,255,0.08) 0%,transparent 60%);
}
#loginScreen::after{display:none;}
.lbox{
  position:relative;z-index:1;width:360px;
  padding:44px 40px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:20px;
  backdrop-filter:blur(24px);
  box-shadow:0 24px 48px rgba(0,0,0,0.5);
}
.l-logo-wrap{display:flex;justify-content:center;margin-bottom:32px;}
.l-logo-wrap img{height:32px;filter:brightness(0) invert(1);opacity:.9;}
.l-divider{display:none;}
.lf{display:block;font-size:11px;color:#6B7684;text-align:left;margin-bottom:6px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;font-family:'Inter',sans-serif;}
.li{
  width:100%;padding:13px 16px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:12px;color:#F2F4F6;font-size:14px;
  font-family:'Inter','Noto Sans KR',sans-serif;
  appearance:none;outline:none;margin-bottom:12px;
  transition:all .15s;
}
.li:focus{
  border-color:rgba(49,130,246,0.6);
  background:rgba(255,255,255,0.08);
  box-shadow:0 0 0 3px rgba(49,130,246,0.15);
}
.li option{background:#1C2333;color:#E5E8EB;}
.l-pin-hint{
  font-size:11.5px;color:#4A5568;
  text-align:left;margin-bottom:20px;
  display:flex;align-items:center;gap:6px;
}
.l-pin-hint span{
  display:inline-block;padding:2px 8px;
  background:rgba(49,130,246,0.15);
  border:1px solid rgba(49,130,246,0.25);
  border-radius:6px;color:#7EB8F7;
  font-size:11px;font-weight:600;
}
.lbtn{
  width:100%;padding:14px;
  background:var(--accent);
  border:none;border-radius:12px;
  color:#fff;font-size:15px;font-weight:700;
  cursor:pointer;font-family:'Inter','Noto Sans KR',sans-serif;
  transition:all .15s;margin-top:4px;
}
.lbtn:hover{background:var(--accent2);transform:translateY(-1px);box-shadow:0 8px 20px rgba(49,130,246,0.35);}
.lbtn:active{transform:none;box-shadow:none;}
.lerr{font-size:12px;color:#F87171;margin-top:10px;min-height:16px;text-align:center;}

/* ── SHELL ── */
#app{display:none;min-height:100vh;flex-direction:column;}
header{
  background:var(--white);height:56px;padding:0 20px;
  display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;z-index:300;
  border-bottom:1px solid var(--border);
}
.hlogo img{height:22px;}
@media(max-width:680px){
  .hlogo{overflow:hidden;width:80px;flex-shrink:0;display:flex;align-items:center;}
  .hlogo img{height:20px;width:171px;max-width:none;}
}
.hright{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);}
.hname{color:var(--text);font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:72px;}
.hrole{font-size:11px;padding:2px 8px;border-radius:20px;background:var(--accent-bg);color:var(--accent2);font-weight:600;}
.hbell{position:relative;cursor:pointer;padding:6px 8px;font-size:18px;border-radius:10px;transition:background .15s;}
.hbell:hover{background:var(--surface);}
.hbell-dot{position:absolute;top:4px;right:4px;width:7px;height:7px;border-radius:50%;
  background:var(--danger);border:2px solid var(--white);display:none;}
.hbell-dot.on{display:block;}
.logoutbtn{
  background:none;border:1px solid var(--border);color:var(--muted);
  font-size:12px;padding:5px 12px;border-radius:8px;cursor:pointer;white-space:nowrap;
  font-family:'Inter','Noto Sans KR',sans-serif;transition:all .15s;
}
.logoutbtn:hover{border-color:var(--danger);color:var(--danger);}
@media(max-width:680px){
  #hambtn{display:flex !important;align-items:center;}
  .hrole{display:none;}
  .hname{max-width:52px;font-size:12px;}
  .logoutbtn{padding:4px 8px;font-size:11px;}
  header{padding:0 12px;height:52px;}
}

/* ── SIDEBAR - 토스 스타일 ── */
.app-body{display:flex;flex:1;min-height:calc(100vh - 56px);}
aside{
  width:216px;background:var(--white);border-right:1px solid var(--border);
  flex-shrink:0;display:flex;flex-direction:column;
  position:sticky;top:56px;height:calc(100vh - 56px);overflow-y:auto;
}
aside::-webkit-scrollbar{width:3px;}
aside::-webkit-scrollbar-thumb{background:var(--border);}
.aside-section{padding:20px 12px 4px;}
.aside-label{
  font-size:10px;font-weight:700;color:var(--muted2);
  letter-spacing:1.2px;text-transform:uppercase;
  padding:0 8px;margin-bottom:4px;
}
.nb{
  display:flex;align-items:center;gap:9px;width:100%;
  background:none;border:none;
  padding:9px 10px;border-radius:10px;
  font-size:14px;font-weight:500;color:var(--muted);
  cursor:pointer;font-family:'Inter','Noto Sans KR',sans-serif;
  text-align:left;transition:all .1s;position:relative;
}
.nb:hover{background:var(--surface);color:var(--text);}
.nb.active{background:var(--accent-bg);color:var(--accent2);font-weight:700;}
.nb .icon{font-size:16px;width:24px;text-align:center;flex-shrink:0;}
.nb-badge{
  position:absolute;right:10px;
  background:var(--danger);color:#fff;
  font-size:10px;font-weight:700;
  padding:1px 6px;border-radius:10px;display:none;
  min-width:18px;text-align:center;
}
.nb-badge.on{display:inline-block;}

/* 모바일 슬라이드 사이드바 */
.mob-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:500;backdrop-filter:blur(2px);}
.mob-overlay.on{display:block;}

/* ── 모바일 하단 탭바 ── */
.mobile-nav{
  display:none;
  position:fixed;left:0;right:0;bottom:0;z-index:450;
  background:rgba(255,255,255,0.96);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-top:1px solid var(--border);
  box-shadow:0 -4px 16px rgba(0,0,0,0.04);
  padding:6px 4px calc(4px + env(safe-area-inset-bottom));
  gap:2px;
}
.mnb{
  flex:1 1 0;min-width:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;padding:6px 2px;
  background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:10px;color:var(--muted);
  border-radius:10px;transition:background .12s,color .12s;
  -webkit-tap-highlight-color:transparent;
  position:relative;
}
.mnb .mnb-icon{font-size:19px;line-height:1;}
.mnb .mnb-label{font-size:10.5px;font-weight:600;letter-spacing:-0.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
.mnb.active{color:var(--accent);background:var(--accent-bg);}
.mnb.active .mnb-icon{transform:scale(1.05);}
.mnb:active{background:var(--surface);}
.mnb .mnb-badge{
  position:absolute;top:2px;right:6px;
  min-width:14px;height:14px;padding:0 4px;
  background:var(--danger);color:#fff;
  border-radius:8px;font-size:9px;font-weight:700;
  display:none;align-items:center;justify-content:center;line-height:1;
}
.mnb .mnb-badge.on{display:inline-flex;}

@media(max-width:680px){
  aside{
    position:fixed;top:0;left:-260px;width:260px;height:100vh;
    z-index:600;display:flex !important;
    transition:left .25s cubic-bezier(.4,0,.2,1);
    box-shadow:4px 0 24px rgba(0,0,0,0.12);
    padding-bottom:calc(16px + env(safe-area-inset-bottom));
  }
  aside.open{left:0;}
  .mobile-nav{display:flex;}
  main{padding:16px 14px calc(72px + env(safe-area-inset-bottom));max-width:100%;}
  .app-body{min-height:calc(100vh - 52px);}
}

/* ── MAIN CONTENT ── */
main{flex:1;padding:32px 28px 80px;overflow-x:hidden;max-width:960px;}
.page{display:none;}.page.active{display:block;}
.ptitle{
  font-size:26px;font-weight:700;color:var(--text);
  margin-bottom:4px;letter-spacing:-0.8px;
  font-family:'Inter','Noto Sans KR',sans-serif;
}
.pdesc{font-size:13.5px;color:var(--muted);margin-bottom:24px;}

/* ── CARD - 토스는 그림자 최소화, 배경색 구분 ── */
.card{
  background:var(--white);border-radius:16px;
  border:1px solid var(--border);
  padding:22px;margin-bottom:12px;
  transition:box-shadow .15s;
}
.card:hover{box-shadow:var(--shadow-sm);}
.ctitle{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:14px;letter-spacing:.3px;text-transform:uppercase;}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px;}
@media(max-width:600px){.g4{grid-template-columns:1fr 1fr;}.g2,.g3{grid-template-columns:1fr;}}

/* 통계 카드 - 토스 스타일 */
.sc{
  background:var(--white);border-radius:14px;
  border:1px solid var(--border);
  padding:18px 20px;
  transition:all .15s;cursor:default;
}
.sc:hover{background:var(--surface);border-color:var(--border2);}
.sl{font-size:12px;color:var(--muted);margin-bottom:6px;font-weight:500;}
.sv{font-size:24px;font-weight:700;color:var(--text);letter-spacing:-0.5px;}
.ss{font-size:11.5px;color:var(--muted2);margin-top:4px;}

/* ── FORMS - 토스 입력 스타일 ── */
label.fl{display:block;font-size:13px;color:var(--muted);margin-bottom:6px;font-weight:500;}
input,select,textarea{
  width:100%;padding:11px 14px;
  border:1.5px solid var(--border);border-radius:10px;
  font-size:14px;color:var(--text);background:var(--white);
  font-family:'Inter','Noto Sans KR',sans-serif;
  outline:none;transition:all .15s;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(49,130,246,0.10);
}
input::placeholder,textarea::placeholder{color:var(--muted2);}
.fr{margin-bottom:12px;}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.fg3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:12px;}
@media(max-width:500px){.fg,.fg3{grid-template-columns:1fr;}}

/* ── BUTTONS - 토스 버튼 ── */
.btn{
  background:var(--white);color:var(--text);
  border:1.5px solid var(--border);
  padding:10px 18px;border-radius:10px;
  font-size:14px;font-weight:600;cursor:pointer;
  font-family:'Inter','Noto Sans KR',sans-serif;
  transition:all .15s;
}
.btn:hover{background:var(--surface);border-color:var(--border2);}
.btng{
  display:block;width:100%;
  background:var(--accent);color:#fff;
  border:none;padding:14px 24px;
  border-radius:12px;font-size:15px;font-weight:700;
  cursor:pointer;font-family:'Inter','Noto Sans KR',sans-serif;
  transition:all .15s;text-align:center;margin:16px 0 4px;
  letter-spacing:-0.2px;
}
.btng:hover{background:var(--accent2);box-shadow:0 4px 16px rgba(49,130,246,0.25);}
.btnsm{padding:7px 13px;font-size:13px;border-radius:8px;margin:0;}
.btndel{
  background:var(--danger-bg);color:var(--danger);
  border:1.5px solid #FECDD3;
  padding:7px 13px;border-radius:8px;font-size:13px;
  cursor:pointer;font-weight:600;transition:all .15s;
}
.btndel:hover{background:#FEE2E2;}
.btnedit{
  background:var(--accent-bg);color:var(--accent2);
  border:1.5px solid #BFDBFE;
  padding:5px 11px;border-radius:8px;font-size:12px;
  cursor:pointer;transition:all .15s;
}

/* ── BADGE - 토스 스타일 ── */
.badge{display:inline-flex;align-items:center;font-size:12px;font-weight:600;padding:3px 9px;border-radius:6px;}
.bok{background:#E8FDF4;color:#00A35A;}
.bwarn{background:#FFF8EC;color:#E07A00;}
.bdanger{background:#FFF0F2;color:#D91E2A;}
.bnavy{background:var(--accent-bg);color:var(--accent2);}
.bgold{background:#FFFAE6;color:#996A00;}
.bpurple{background:#F3F0FF;color:#5A3DB5;}
.bgray{background:var(--surface);color:var(--muted);}

/* ── TABLE ── */
table{width:100%;border-collapse:collapse;font-size:13.5px;}
th{text-align:left;padding:10px 14px;font-size:11.5px;color:var(--muted);font-weight:700;
  border-bottom:1.5px solid var(--border);background:var(--surface2);letter-spacing:.3px;text-transform:uppercase;}
td{padding:13px 14px;border-bottom:1px solid var(--border);vertical-align:middle;}
tr:last-child td{border-bottom:none;}
tr:hover td{background:var(--surface2);}

/* ── PIPELINE KANBAN ── */
.pipe-col{flex:0 0 220px;min-width:220px;background:var(--surface);border-radius:14px;padding:12px 10px;display:flex;flex-direction:column;gap:8px;}
.pipe-col-header{display:flex;align-items:center;justify-content:space-between;padding:0 2px;margin-bottom:4px;}
.pipe-col-title{font-size:12px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;}
.pipe-col-count{font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;}
.rd-stage-card{
  border-radius:14px;padding:18px 8px;cursor:pointer;
  border:1.5px solid;text-align:center;position:relative;
  box-shadow:0 2px 8px rgba(0,0,0,0.04);
  transition:all .18s cubic-bezier(.4,0,.2,1);
}
.rd-stage-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,0.10);}
.rd-stage-card:active{transform:none;opacity:.85;}
.pipe-card{background:var(--white);border:1px solid var(--border);border-radius:10px;padding:11px 12px;cursor:pointer;transition:box-shadow .15s;position:relative;}
.pipe-card:hover{box-shadow:0 3px 12px rgba(0,0,0,.1);}
.pipe-card-name{font-size:13px;font-weight:700;color:var(--text);margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pipe-card-sub{font-size:11px;color:var(--muted);margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pipe-card-action{width:100%;padding:7px 10px;border:none;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;text-align:center;transition:opacity .15s;}
.pipe-card-action:hover{opacity:.85;}
.pipe-card-lawyer{font-size:10px;color:var(--muted);margin-top:6px;display:flex;align-items:center;gap:4px;}
.pipe-empty{text-align:center;padding:24px 8px;color:var(--muted);font-size:12px;}
@media(max-width:680px){.pipe-col{flex:0 0 180px;min-width:180px;}}

/* ── MISC ── */
.bar-t{background:var(--surface);border-radius:4px;height:5px;overflow:hidden;}
.bar-f{height:100%;border-radius:4px;}
.av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;}
.okmsg{
  color:var(--ok);font-size:13px;padding:10px 16px;
  background:var(--ok-bg);border:1.5px solid #A7F3D0;
  border-radius:10px;margin-top:8px;display:none;font-weight:600;
}
.empty{text-align:center;padding:48px 16px;color:var(--muted2);font-size:14px;}

/* 계약 유형 라디오 pill */
.mt-pill{
  display:flex;align-items:center;gap:5px;cursor:pointer;font-size:13.5px;
  padding:8px 16px;border:1.5px solid var(--border);border-radius:10px;
  transition:all .15s;background:var(--white);user-select:none;white-space:nowrap;
  font-weight:500;
}
.mt-pill:hover{border-color:var(--accent);background:var(--accent-bg);}
.mt-pill input[type=radio]{display:none;} /* 라디오 버튼 숨김 — 전체 레이블이 클릭 영역 */
.mt-pill:has(input:checked){border-color:var(--navy);background:var(--navy);color:#fff;}
.mt-pill:has(input:checked):hover{background:var(--navy);}

/* 계약 금액 프리셋 버튼 */
.fee-preset{
  background:var(--white);border:1.5px solid var(--border);color:var(--text2);
  padding:7px 16px;border-radius:10px;font-size:13.5px;font-weight:600;
  cursor:pointer;transition:all .15s;white-space:nowrap;
  font-family:'Inter','Noto Sans KR',sans-serif;
}
.fee-preset:hover{border-color:var(--accent);background:var(--accent-bg);color:var(--accent);}
.fee-preset.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.fee-preset-direct{color:var(--muted);border-style:dashed;}
.fee-preset-direct:hover{border-color:var(--warn);color:var(--warn);background:var(--warn-bg);}

/* 변호사 피커 */
.lawyer-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
@media(max-width:500px){.lawyer-picker{grid-template-columns:repeat(2,1fr);}}
.lawyer-chip{
  display:flex;align-items:center;gap:7px;padding:9px 11px;
  border:1.5px solid var(--border);border-radius:12px;
  cursor:pointer;transition:all .15s;background:var(--white);
}
.lawyer-chip:hover{border-color:var(--accent);background:var(--accent-bg);}
.lawyer-chip.selected{border-color:var(--accent);background:var(--accent);color:#fff;}
.lawyer-chip.selected .lc-role{color:rgba(255,255,255,0.65);}
.lc-av{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;}
.lc-name{font-size:13px;font-weight:600;line-height:1.2;}
.lc-role{font-size:10.5px;color:var(--muted);margin-top:1px;}

/* 드롭다운 태그 변호사 피커 */
.lawyer-tag-picker{position:relative;}
.ltp-dropdown{
  width:100%;padding:9px 12px;border:1.5px solid var(--border);border-radius:10px;
  font-size:13px;font-family:inherit;background:var(--white);cursor:pointer;
  color:var(--text);appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236B7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
}
.ltp-dropdown:focus{border-color:var(--navy);outline:none;}
.ltp-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px;min-height:0;}
.ltp-tag{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 8px 3px 10px;border-radius:20px;
  background:var(--navy);color:#fff;font-size:12px;font-weight:600;
}
.ltp-tag-remove{
  width:15px;height:15px;border-radius:50%;
  background:rgba(255,255,255,.25);border:none;color:#fff;
  font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  padding:0;line-height:1;flex-shrink:0;
}
.ltp-tag-remove:hover{background:rgba(255,255,255,.45);}

/* 심플 텍스트 변호사 피커 */
.lawyer-simple-picker{display:flex;flex-wrap:wrap;gap:5px;}
.lsp-chip{
  padding:5px 12px;border-radius:20px;cursor:pointer;
  border:1.5px solid var(--border);background:var(--white);
  font-size:12px;font-weight:500;color:var(--text2);
  transition:all .12s;user-select:none;
}
.lsp-chip:hover{border-color:var(--accent);color:var(--accent);}
.lsp-chip.selected{background:var(--navy);color:#fff;border-color:var(--navy);font-weight:600;}
.lsp-summary{font-size:12px;color:var(--muted);margin-top:6px;min-height:16px;}

/* 필터 탭 */
.ftabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap;}
.ftab{
  padding:7px 16px;border-radius:20px;
  border:1.5px solid var(--border);background:var(--white);
  font-size:13px;color:var(--muted);cursor:pointer;
  font-family:'Inter','Noto Sans KR',sans-serif;
  transition:all .12s;font-weight:500;
}
.ftab.on{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:700;}
.ftab:hover:not(.on){background:var(--surface);color:var(--text);}
.clickable{cursor:pointer;}
.clickable:hover{opacity:.8;}

/* ── PIPELINE ── */
.pipeline{display:flex;gap:8px;margin-bottom:16px;overflow-x:auto;}
.pipeline::-webkit-scrollbar{display:none;}
.pcol{flex:1;min-width:80px;text-align:center;padding:14px 8px;border-radius:14px;}
.pcol .pnum{font-size:24px;font-weight:800;letter-spacing:-0.5px;}
.pcol .plbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-top:2px;}

/* ── CALENDAR ── */
.cal-wrap{background:var(--white);border-radius:16px;border:1px solid var(--border);overflow:hidden;}
.cal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--border);}
.cal-nav{background:var(--surface);border:none;border-radius:8px;padding:6px 12px;font-size:13px;cursor:pointer;font-family:'Noto Sans KR',sans-serif;color:var(--text);transition:background .15s;}
.cal-nav:hover{background:var(--border);}
.cal-title{font-size:16px;font-weight:700;color:var(--text);}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);}
.cal-day-header{text-align:center;font-size:11px;font-weight:700;color:var(--muted);padding:8px 0;border-bottom:1px solid var(--border);}
.cal-day-header:first-child{color:var(--danger);}
.cal-day-header:last-child{color:var(--info);}
.cal-cell{min-height:68px;padding:4px 5px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);position:relative;cursor:pointer;transition:background .1s;}
.cal-cell:nth-child(7n){border-right:none;}
.cal-cell:hover{background:var(--surface2);}
.cal-cell.today{background:#EBF3FF;}
.cal-cell.other-month .cal-date{color:var(--muted2);}
.cal-date{font-size:12px;font-weight:600;margin-bottom:3px;color:var(--text);}
.cal-cell:nth-child(7n+1) .cal-date{color:var(--danger);}
.cal-cell:nth-child(7n) .cal-date{color:var(--info);}
.cal-event{font-size:9.5px;padding:1px 5px;border-radius:4px;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;font-weight:500;}
.cal-event.deadline{background:#FFF0F2;color:var(--danger);}
.cal-event.court{background:var(--accent-bg);color:var(--accent2);}
.cal-event.meeting{background:var(--ok-bg);color:#00A35A;}
.cal-event.contract{background:var(--warn-bg);color:#A06000;}
.cal-event.other{background:var(--purple-bg);color:var(--purple);}
.cal-more{font-size:9px;color:var(--muted);padding:1px 4px;}

/* ── CRM MATTER CARD ── */
.matter-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:16px;padding:18px;margin-bottom:10px;
  cursor:pointer;transition:all .15s;
}
.matter-card:hover{box-shadow:var(--shadow-sm);border-color:var(--border2);transform:translateY(-1px);}
.matter-card.active-matter{border-left:4px solid var(--ok);}
.matter-card.pending{border-left:4px solid var(--warn);}
.matter-card.closed{border-left:4px solid var(--accent2);}
.matter-card.contracted{border-left:4px solid var(--accent2);}
.m-top{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px;}
.m-num{font-size:10.5px;color:var(--muted2);font-weight:600;flex-shrink:0;margin-top:2px;}
.m-title{font-size:14.5px;font-weight:700;flex:1;color:var(--text);line-height:1.4;letter-spacing:-0.2px;}
.m-meta{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.m-footer{display:flex;align-items:center;justify-content:space-between;margin-top:10px;font-size:12px;color:var(--muted);}

/* ── CLIENT CARD ── */
.client-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--border);cursor:pointer;transition:background .12s;}
.client-row:last-child{border-bottom:none;}
.client-row:hover{background:var(--surface2);margin:0 -15px;padding-left:15px;padding-right:15px;border-radius:10px;}
.c-av{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0;}
.c-info{flex:1;min-width:0;}
.c-name{font-size:14.5px;font-weight:700;color:var(--text);letter-spacing:-0.2px;}
.c-sub{font-size:12px;color:var(--muted);margin-top:2px;}
.c-stat{text-align:right;flex-shrink:0;}

/* ── LOG ── */
.log-item{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid var(--border);}
.log-item:last-child{border-bottom:none;}
.log-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;margin-top:2px;}
.log-body{flex:1;}
.log-title{font-size:13px;font-weight:600;margin-bottom:3px;}
.log-content{font-size:12.5px;color:var(--muted);line-height:1.6;}
.log-meta{display:flex;gap:10px;margin-top:5px;font-size:11px;color:var(--muted2);}

/* ── MODAL ── */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.36);z-index:500;align-items:flex-start;justify-content:center;padding:16px;overflow-y:auto;}
.modal-bg.open{display:flex;}
.modal{background:var(--white);border-radius:20px;padding:24px;width:100%;max-width:580px;margin:auto;}
.modal-lg{max-width:760px;}
.mtitle{font-size:17px;font-weight:700;color:var(--text);margin-bottom:18px;letter-spacing:-0.4px;display:flex;align-items:center;justify-content:space-between;}
.mclose{background:none;border:none;font-size:24px;cursor:pointer;color:var(--muted2);line-height:1;transition:color .15s;}
.mclose:hover{color:var(--text);}

/* ── LOADING ── */
#loadOv{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:999;align-items:center;justify-content:center;flex-direction:column;gap:12px;backdrop-filter:blur(4px);}
#loadOv.on{display:flex;}
.spin{width:36px;height:36px;border:3px solid rgba(49,130,246,0.2);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.4;}}
@keyframes fadeIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:translateY(0);}}
.ldtxt{color:#fff;font-size:13px;font-family:'Inter',sans-serif;font-weight:500;}

/* ── ALERT BAR ── */
.alert-bar{
  background:var(--danger-bg);border:1.5px solid #FECDD3;border-radius:12px;
  padding:12px 16px;margin-bottom:10px;display:flex;align-items:center;gap:10px;font-size:13.5px;
}
.alert-bar .alert-icon{font-size:16px;flex-shrink:0;}

/* ── TABS ── */
.tab-nav{display:flex;border-bottom:1.5px solid var(--border);margin-bottom:16px;overflow-x:auto;}
.tab-nav::-webkit-scrollbar{display:none;}
.tab-btn{flex-shrink:0;background:none;border:none;border-bottom:2.5px solid transparent;padding:10px 16px;font-size:13.5px;font-weight:500;color:var(--muted);cursor:pointer;font-family:'Inter','Noto Sans KR',sans-serif;white-space:nowrap;transition:all .15s;margin-bottom:-1.5px;}
.tab-btn.on{color:var(--accent);border-bottom-color:var(--accent);font-weight:700;}
.tab-pane{display:none;}.tab-pane.on{display:block;}

/* ── 변호사 프로필 모달 ── */
.mp-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px;}
.mp-stat{background:var(--surface);border-radius:12px;padding:12px;}
.mp-stat .lbl{font-size:11px;color:var(--muted);margin-bottom:3px;font-weight:500;}
.mp-stat .val{font-size:20px;font-weight:700;color:var(--text);}
.mp-name{font-size:22px;font-weight:700;color:#fff;letter-spacing:-0.5px;}
.mp-role{font-size:13px;color:rgba(255,255,255,0.6);margin-top:3px;}
.mp-spec{font-size:13px;color:rgba(255,255,255,0.5);margin-top:2px;}
.mp-id{font-size:12px;color:var(--gold2);margin-top:3px;font-weight:600;}
.mp-contact-tag{font-size:13px;color:var(--gold2);margin-top:5px;}
.mp-av-lg{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;flex-shrink:0;}

/* ── TOAST ── */
#toastContainer{position:fixed;bottom:24px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none;}
.toast{
  background:var(--navy);color:#fff;border-radius:16px;
  min-width:280px;max-width:340px;
  box-shadow:0 8px 32px rgba(0,0,0,0.16);
  pointer-events:auto;overflow:hidden;
  animation:toastIn .3s cubic-bezier(.34,1.56,.64,1) forwards;
}
.toast.hiding{animation:toastOut .3s ease forwards;}
@keyframes toastIn{from{opacity:0;transform:translateX(120%)}to{opacity:1;transform:translateX(0)}}
@keyframes toastOut{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(120%)}}
.toast-accent{height:3px;width:100%;}
.toast-body{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;}
.toast-icon{font-size:20px;flex-shrink:0;margin-top:1px;}
.toast-content{flex:1;min-width:0;}
.toast-title{font-size:13px;font-weight:700;color:#fff;margin-bottom:2px;}
.toast-msg{font-size:12px;color:rgba(255,255,255,0.6);line-height:1.5;}
.toast-close{background:none;border:none;color:rgba(255,255,255,0.4);font-size:16px;cursor:pointer;padding:0 4px;line-height:1;flex-shrink:0;}
.toast-close:hover{color:#fff;}
.toast-progress{height:3px;background:rgba(255,255,255,0.1);position:relative;overflow:hidden;}
.toast-progress-bar{height:100%;position:absolute;left:0;top:0;transition:width linear;}

/* ── TIMESHEET REMINDER ── */
#tsReminderModal{position:fixed;bottom:24px;right:20px;z-index:9998;width:360px;background:var(--white);border-radius:20px;box-shadow:var(--shadow-lg);border:1.5px solid var(--border);overflow:hidden;display:none;}
#tsReminderModal.open{display:block;animation:toastIn .3s cubic-bezier(.34,1.56,.64,1) forwards;}
.tsrm-header{background:var(--navy);padding:16px 18px;display:flex;align-items:center;gap:10px;border-radius:18px 18px 0 0;}
.tsrm-title{font-size:14px;font-weight:700;color:#fff;flex:1;}
.tsrm-close{background:none;border:none;color:rgba(255,255,255,0.4);font-size:18px;cursor:pointer;line-height:1;padding:0;}
.tsrm-close:hover{color:#fff;}
.tsrm-body{padding:16px;}
.tsrm-date{font-size:12px;font-weight:700;color:var(--warn);background:var(--warn-bg);padding:4px 10px;border-radius:8px;display:inline-block;margin-bottom:12px;}
.tsrm-row{margin-bottom:10px;}
.tsrm-row label{display:block;font-size:11.5px;color:var(--muted);font-weight:500;margin-bottom:4px;}
.tsrm-row input,.tsrm-row select,.tsrm-row textarea{width:100%;padding:9px 12px;border:1.5px solid var(--border);border-radius:10px;font-size:13px;font-family:'Noto Sans KR',sans-serif;background:var(--white);outline:none;}
.tsrm-row input:focus,.tsrm-row select:focus{border-color:var(--accent);}
.tsrm-2col{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px;}
.tsrm-footer{padding:0 16px 16px;display:flex;gap:8px;}
.tsrm-save{flex:1;background:var(--accent);color:#fff;border:none;padding:11px;border-radius:10px;font-size:13.5px;font-weight:700;cursor:pointer;transition:background .15s;}
.tsrm-save:hover{background:var(--accent2);}
.tsrm-skip{background:none;color:var(--muted);border:1.5px solid var(--border);padding:11px 14px;border-radius:10px;font-size:12px;cursor:pointer;transition:all .15s;}
.tsrm-skip:hover{border-color:var(--danger);color:var(--danger);}
.tsrm-add-more{width:100%;background:none;border:1.5px dashed var(--border);color:var(--muted);padding:8px;border-radius:10px;font-size:12.5px;cursor:pointer;margin-bottom:10px;transition:all .15s;}
.tsrm-add-more:hover{border-color:var(--accent);color:var(--accent);}
.tsrm-entries{max-height:280px;overflow-y:auto;}

/* TS 리마인더 - 모바일: 하단탭 위에 붙는 시트 형태로 */
@media(max-width:680px){
  #tsReminderModal{
    left:10px;right:10px;
    /* 하단탭(약 58px) + safe-area 를 띄우고 배치 */
    bottom:calc(72px + env(safe-area-inset-bottom));
    width:auto;
    max-height:calc(100vh - 180px);
    border-radius:16px;
    display:flex;flex-direction:column;
  }
  #tsReminderModal.open{display:flex;}
  .tsrm-body{padding:14px;overflow-y:auto;flex:1;}
  .tsrm-entries{max-height:none;}
}

/* ── DASHBOARD QUICK MENU ── */
.dash-card{
  border-radius:18px;padding:24px 16px 20px;cursor:pointer;
  transition:all .18s cubic-bezier(.4,0,.2,1);
  border:1.5px solid transparent;
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;
  min-height:130px;
}
.dash-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.10);border-color:rgba(0,0,0,0.06);}
.dash-card:active{transform:translateY(0);box-shadow:none;opacity:.85;}
.dash-card .dc-icon{font-size:32px;margin-bottom:10px;line-height:1;}
.dash-card .dc-label{font-size:14px;font-weight:700;margin-bottom:3px;letter-spacing:-0.2px;}
.dash-card .dc-desc{font-size:11.5px;color:var(--muted);line-height:1.4;}

/* ── TIMESHEET 새 UI ── */
.ts-date-btn{
  padding:7px 14px;border-radius:20px;border:1.5px solid var(--border);
  background:var(--white);color:var(--muted);font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .12s;white-space:nowrap;
}
.ts-date-btn:hover{border-color:var(--accent);color:var(--accent2);}
.ts-date-btn.on{background:var(--accent);color:#fff;border-color:var(--accent);}
.ts-h-btn{
  padding:7px 14px;border-radius:20px;border:1.5px solid var(--border);
  background:var(--white);color:var(--text2);font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .12s;
}
.ts-h-btn:hover{border-color:var(--accent);color:var(--accent2);background:var(--accent-bg);}
.ts-h-btn.on{background:var(--ok);color:#fff;border-color:var(--ok);}
.ts-recent-btn{
  display:flex;align-items:center;gap:5px;
  padding:6px 12px;border-radius:10px;
  border:1.5px solid #e8d8b0;background:#faf0e0;
  color:#7a5020;font-size:12px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .12s;max-width:180px;
}
.ts-recent-btn:hover{border-color:#c4a36a;background:#f5e6c8;}
.ts-recent-btn.on{border-color:var(--accent);background:var(--accent-bg);color:var(--accent2);}
.ts-queue-item{
  display:flex;align-items:center;gap:8px;
  background:var(--white);border:1.5px solid var(--border);
  border-radius:12px;padding:10px 12px;
  font-size:13px;
}