:root {
  color-scheme: light;
  /* 알엔헬스케어 공식 로고 색: 로열 블루 #2F4295 + 검정 */
  --bg: #f5f7fb;
  --surface: #ffffff;
  --surface-2: #f5f7fb;
  --line: #e1e5ef;
  --line-strong: #c7cedf;
  --text: #131722;
  --text-2: #464e61;
  --text-3: #6a7285;
  --heading: #131722;
  --brand: #2f4295;
  --brand-soft: #eceff9;
  --brand-ink: #24337a;
  --series: #2f4295;
  --planned: #9aa3af;
  --warn: #b35900;
  --warn-soft: #fff3e5;
  --danger: #c62828;
  --danger-soft: #fdecec;
  --good: #1a7f37;
  --rise: #d32f2f; /* 증가는 빨강, 감소는 파랑 (우리나라 증감 표기 관례, 사용자 요청 2026-10-04) */
  --fall: #1565c0;
  --shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .05);
  --radius: 10px;
  --side-w: 208px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0f121b; --surface: #171b27; --surface-2: #1d2231; --line: #2a3144;
    --text: #eef0f6; --text-2: #b7bdcd; --text-3: #8a91a6; --heading: #eef0f6;
    --line-strong: #3b4461;
    --brand: #7d8ee0; --brand-soft: #1f2748; --brand-ink: #b8c2f2; --series: #7d8ee0; --planned: #6b7389;
    --warn: #f0a24a; --warn-soft: #3a2a17; --danger: #f07070; --danger-soft: #3a1d1d; --good: #4cc26b; --rise: #ff6b6b; --fall: #5aa9ff;
    --shadow: none;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0f121b; --surface: #171b27; --surface-2: #1d2231; --line: #2a3144;
  --text: #eef0f6; --text-2: #b7bdcd; --text-3: #8a91a6; --heading: #eef0f6;
  --line-strong: #3b4461;
  --brand: #7d8ee0; --brand-soft: #1f2748; --brand-ink: #b8c2f2; --series: #7d8ee0; --planned: #6b7389;
  --warn: #f0a24a; --warn-soft: #3a2a17; --danger: #f07070; --danger-soft: #3a1d1d; --good: #4cc26b; --rise: #ff6b6b; --fall: #5aa9ff;
  --shadow: none;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; } /* display 지정이 hidden 속성을 덮지 않도록 */
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 14px/1.5 "Pretendard Variable", Pretendard, -apple-system, "Malgun Gothic", sans-serif;
  font-feature-settings: "tnum";
}
a { color: var(--brand); text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3 { margin: 0; letter-spacing: -.01em; }
h1 { font-size: 22px; font-weight: 700; }
h2 { font-size: 15px; font-weight: 650; }
h2 small { color: var(--text-3); font-weight: 500; margin-left: 4px; }

/* ---------- 레이아웃 ---------- */
body { padding-top: env(safe-area-inset-top); }
.demo-bar { background: var(--warn-soft); color: var(--warn); font-size: 12.5px; padding: 5px 12px; font-weight: 600; display: flex; flex-wrap: wrap; gap: 4px 12px; justify-content: center; align-items: center; }
.demo-bar .link-btn { color: var(--warn); text-decoration: underline; font-size: 12.5px; padding: 2px 4px; margin: 0; }
/* 무료 안내 (체험판) */
.free-note { display: flex; gap: 10px; align-items: center; padding: 10px 14px; border-radius: 12px; background: rgba(255,255,255,.12); color: #fff; font-size: 14px; line-height: 1.5; }
.free-note b { flex: none; padding: 3px 10px; border-radius: 999px; background: #ffd75e; color: #1d2340; font-size: 13px; font-weight: 800; }
.free-card { display: grid; gap: 4px; padding: 12px 14px; border-radius: 12px; border: 1.5px solid var(--brand); background: var(--brand-soft); color: var(--brand-ink); margin: 4px 0 10px; }
.free-card b { font-size: 16px; font-weight: 800; }
.free-card span { font-size: 13px; line-height: 1.5; }
.free-card a { font-size: 13px; font-weight: 700; color: var(--brand-ink); text-decoration: underline; justify-self: start; }
.free-chip { padding: 1px 8px; border-radius: 999px; background: var(--warn); color: var(--bg); font-size: 12px; }
/* 체험 로그인 */
.demo-id { display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; background: var(--brand-soft); color: var(--brand-ink); margin: 4px 0 12px; }
.demo-id span { font-size: 12px; } .demo-id b { font-size: 15px; }
.persona { border: 0; padding: 0; margin: 4px 0 0; display: grid; gap: 8px; }
.persona legend { font-size: 13px; color: var(--text-2); margin-bottom: 6px; }
.persona-opt { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.persona-opt:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.login-form .persona-opt { display: flex; flex-direction: row; }
.login-form .persona-opt input[type=radio] { width: 18px; height: 18px; min-height: 0; flex: none; padding: 0; margin: 2px 0 0; accent-color: var(--brand); box-shadow: none; }
.persona-opt span { display: grid; gap: 2px; } .persona-opt small { color: var(--text-3); font-size: 12px; }
.demo-link { display: block; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 13px; color: var(--text-2); text-align: center; }
.demo-link b { color: var(--brand); }
/* 연습 과제 패널 */
.practice { position: fixed; right: 16px; bottom: 16px; z-index: 40; width: min(340px, calc(100vw - 32px)); background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 10px 30px rgba(15, 18, 30, .18); padding: 12px 14px; max-height: calc(100vh - 120px); overflow: auto; }
.practice.closed { width: auto; padding: 0; border: 0; background: none; box-shadow: none; }
.practice header { display: flex; justify-content: space-between; align-items: center; }
.practice header span { color: var(--brand); }
.practice-bar { height: 6px; border-radius: 3px; background: var(--chart-soft); margin: 8px 0 10px; overflow: hidden; }
.practice-bar i { display: block; height: 100%; background: var(--chart); border-radius: 3px; transition: width .3s; }
.practice ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.practice li { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; }
.practice li a { color: var(--text); font-weight: 600; }
.practice li small { display: block; color: var(--text-3); font-size: 12px; margin-top: 1px; }
.practice li.ok a { color: var(--text-3); text-decoration: line-through; }
.chk-dot { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--line-strong); display: grid; place-items: center; font-size: 12px; color: #fff; margin-top: 1px; }
.practice li.ok .chk-dot { background: var(--good); border-color: var(--good); }
.practice footer { display: flex; justify-content: space-between; margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
.practice-done { background: color-mix(in srgb, var(--good) 12%, transparent); color: var(--good); border-radius: 8px; padding: 8px 10px; font-size: 13px; margin: 0 0 10px; }
.practice-pill { border: 0; border-radius: 999px; padding: 10px 16px; background: var(--brand); color: #fff; font: inherit; font-weight: 700; box-shadow: 0 6px 18px rgba(15, 18, 30, .25); cursor: pointer; }
@media (max-width: 768px) { .practice { bottom: calc(76px + env(safe-area-inset-bottom)); right: 8px; } }
body.presenting .practice { display: none; }
.layout { display: flex; min-height: 100vh; }
.side {
  width: var(--side-w); flex: none; background: var(--surface); border-right: 1px solid var(--line);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; padding: 16px 10px;
}
/* 제품 로고 (VisitSales) · 고객사 표기 */
.vs-mark { display: inline-flex; align-items: center; gap: 8px; line-height: 1; }
.vs-symbol { flex: none; display: block; }
.vs-word { font-family: 'Sora', 'Pretendard Variable', sans-serif; font-weight: 800; letter-spacing: -.03em; color: var(--heading); font-size: 21px; }
.vs-word { white-space: nowrap; }
.vs-word b, .brand .vs-word b { display: inline; font-size: inherit; color: var(--brand); font-weight: 800; }
.vs-mark.on-dark .vs-word, .vs-mark.on-dark .vs-word b { color: #fff; }
.vs-for { display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; color: var(--text-3); font-weight: 600; }
.vs-for > span:first-child { font-style: italic; }
.client-logo { display: block; height: 20px; width: auto; }
.client-logo img { display: block; height: 100%; width: auto; }
.side .client-logo { height: 26px; }
.client-name { font-family: 'Sora', sans-serif; font-weight: 700; font-size: 11.5px; letter-spacing: .12em; color: var(--brand-ink); }
.vs-for.on-dark, .vs-for.on-dark .client-name { color: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .vs-word b { color: #8fb0ff; } :root:not([data-theme="light"]) { --vs-pin: #5b8cff; } }
:root[data-theme="dark"] .vs-word b { color: #8fb0ff; } :root[data-theme="dark"] { --vs-pin: #5b8cff; }
.vs-mark.on-dark .vs-word, .vs-mark.on-dark .vs-word b { color: #fff !important; }
.auth-brand { --vs-on: var(--brand); }
.m-brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.m-brand .vs-word { font-size: 18px; }
.m-client { padding-left: 10px; border-left: 1px solid var(--line); display: inline-flex; }
.m-top .m-user { white-space: nowrap; }
.m-client .client-name { font-size: 10.5px; letter-spacing: .08em; line-height: 1.2; }
.m-client .client-logo { height: 16px; }
@media (max-width: 360px) { .m-client { display: none; } }
.auth-top .vs-word { font-size: 30px; }
.auth-client { display: flex; align-items: center; gap: 12px; font-size: 12px; letter-spacing: .08em; color: #c9d0f0; }
.auth-client .client-logo { height: 28px; }
.auth-client .client-name { color: #fff; font-size: 14px; }
/* 브랜드 패널 맨 아래: 고객사 로고 + 만든 곳을 한 덩어리로 (space-between 이 둘을 떼어놓지 않게) */
.auth-foot { display: grid; gap: 18px; }
/* 만든 곳 — 가느다란 구분선 위에 심벌 + 이름 로크업 */
.auth-made {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .13);
}
.auth-made-label {
  font-size: 10.5px; font-weight: 600; letter-spacing: .2em;
  color: rgba(201, 208, 240, .5); white-space: nowrap;
}
.auth-made-link {
  display: inline-flex; align-items: center; gap: 10px;
  color: #fff; opacity: .9; transition: opacity .2s ease;
}
.auth-made-link:hover { opacity: 1; }
.auth-made-mark { display: block; width: 29px; height: 29px; color: #fff; flex: none; }
.auth-made-mark svg { display: block; width: 100%; height: 100%; }
.auth-made-name { display: grid; line-height: 1.2; }
.auth-made-name b { font-size: 13.5px; font-weight: 700; letter-spacing: -.02em; }
.auth-made-name em {
  font-style: normal; font-size: 8.5px; font-weight: 600; letter-spacing: .16em;
  color: rgba(201, 208, 240, .62); margin-top: 1px;
}
.auth-made-go { width: 11px; height: 11px; opacity: .45; transition: opacity .2s ease, transform .2s ease; }
.auth-made-link:hover .auth-made-go { opacity: .9; transform: translate(1px, -1px); }

.brand { display: flex; gap: 10px; align-items: center; padding: 4px 8px 18px; }
.brand b { display: block; font-size: 15px; }
.brand small { color: var(--text-3); font-size: 12px; }
h1 { color: var(--heading); }
/* 공식 로고 */
.brand-logo { display: block; height: 38px; width: auto; }
.brand-logo img { display: block; height: 100%; width: auto; }
.layout .side .brand { flex-direction: column; align-items: flex-start; gap: 10px; padding: 6px 8px 18px; }
.layout .side .brand .vs-word { font-size: 23px; }
.layout .side .brand small { color: var(--text-3); font-size: 12px; font-weight: 600; letter-spacing: .02em; }
.layout .side nav a { position: relative; }
.layout .side nav a.on { background: var(--brand-soft); color: var(--brand-ink); }
.layout .side nav a.on::before { content: ""; position: absolute; left: 0; top: 9px; bottom: 9px; width: 3px; border-radius: 2px; background: var(--brand); }
/* 로그인 화면: 왼쪽 로고 색 패널 + 오른쪽 입력 */
.auth-screen { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, 44%) 1fr; }
.auth-brand { background: var(--brand); color: #fff; padding: 48px 56px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.auth-brand .brand-logo { height: 46px; }
.auth-copy { display: grid; gap: 14px; max-width: 460px; }
.eyebrow { font-size: 12.5px; font-weight: 700; letter-spacing: .2em; color: #c9d0f0; }
.auth-headline { margin: 0; font-size: clamp(28px, 3.2vw, 40px); font-weight: 800; line-height: 1.35; letter-spacing: -.01em; }
.auth-desc { margin: 0; color: #dfe3f6; font-size: 15px; line-height: 1.7; }
.auth-main { display: grid; place-items: center; padding: 24px 16px; background: var(--bg); }
.auth-main .login-card { border: 0; box-shadow: none; background: transparent; padding: 0; width: min(380px, 100%); }
.auth-main .login-card h1 { font-size: 26px; font-weight: 800; margin: 0 0 6px; }
.auth-main .login-form input { min-height: 48px; font-size: 16px; }
.auth-main .btn.big { min-height: 50px; }
@media (max-width: 768px) {
  .auth-screen { grid-template-columns: 1fr; }
  .auth-brand { padding: 20px 20px 24px; gap: 16px; }
  .auth-brand .brand-logo { height: 34px; }
  .auth-headline { font-size: 24px; }
  .auth-desc { display: none; }
}
.side nav { display: flex; flex-direction: column; gap: 2px; }
.side nav a { display: flex; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 8px; color: var(--text-2); font-weight: 550; }
.side nav a svg { width: 18px; height: 18px; fill: currentColor; opacity: .8; }
.side nav a:hover { background: var(--surface-2); color: var(--text); }
.side nav a.on { background: var(--brand-soft); color: var(--brand-ink); }
.side-foot { margin-top: auto; padding: 10px; border-top: 1px solid var(--line); display: grid; gap: 6px; font-size: 13px; }
.side-foot .me { color: var(--text-2); font-weight: 600; }
.pi-old { margin-top: 6px; }
.pi-old summary { cursor: pointer; color: var(--text-3); font-size: 13px; padding: 6px 4px; }
.link-btn { background: none; border: 0; padding: 0; color: var(--text-3); cursor: pointer; text-align: left; }
.link-btn:hover { color: var(--brand); }
main { flex: 1; min-width: 0; padding: 24px 28px 60px; max-width: 1400px; outline: none; }

.page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.page-head .sub { margin: 4px 0 0; color: var(--text-3); }
.head-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.back { display: inline-block; margin-bottom: 8px; color: var(--text-3); }

/* ---------- 부품 ---------- */
.btn {
  border: 1px solid var(--line); background: var(--surface); padding: 7px 13px; border-radius: 8px; cursor: pointer;
  font-weight: 600; white-space: nowrap; line-height: 1.3;
}
.btn:hover { border-color: var(--text-3); }
.btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; }
.btn:not(.primary):not(.danger):not(.ghost) { border-color: #c9d2db; }
.btn.primary:hover { filter: brightness(1.08); }
.btn.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn.danger.ghost { background: transparent; color: var(--danger); border-color: transparent; }
.btn.sm { padding: 4px 10px; font-size: 13px; }
.btn.big { padding: 11px 20px; font-size: 15px; width: 100%; }
.btn:disabled { opacity: .5; cursor: wait; }
.seg { display: inline-flex; }
.seg .btn { border-radius: 0; margin-left: -1px; }
.seg .btn:first-child { border-radius: 8px 0 0 8px; }
.seg .btn:last-child { border-radius: 0 8px 8px 0; }
.icon-btn { border: 0; background: none; cursor: pointer; width: 28px; height: 28px; border-radius: 6px; color: var(--text-3); font-size: 16px; }
.icon-btn:hover { background: var(--surface-2); color: var(--text); }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

select, input[type=text], input[type=search], input[type=date], input[type=number], input[type=email], input:not([type]), textarea {
  border: 1px solid var(--line-strong, #c9d2db); background: var(--surface); border-radius: 8px; padding: 7px 10px; min-height: 36px; max-width: 100%;
}
textarea { resize: vertical; width: 100%; line-height: 1.55; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; box-shadow: var(--shadow); margin-bottom: 16px; }
.card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; gap: 8px; }
.link { font-size: 13px; font-weight: 600; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.grid-2 > .card { margin-bottom: 0; }
.grid-2 + .card, .grid-2 { margin-bottom: 16px; }
.empty { color: var(--text-3); text-align: center; padding: 20px 8px; margin: 0; }
.help { color: var(--text-2); margin: -4px 0 12px; font-size: 13px; }
.count { color: var(--text-3); font-size: 13px; margin: 0 0 8px; }
.legend { color: var(--text-3); font-size: 12.5px; margin: -6px 0 16px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.badge { display: inline-block; font-size: 11.5px; font-weight: 600; padding: 1px 7px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--text-2); white-space: nowrap; }
.badge.soft { background: var(--brand-soft); border-color: transparent; color: var(--brand-ink); }
.badge.stage-won { background: #e6f4ea; color: #1a7f37; border-color: transparent; }
.badge.stage-lost { background: var(--surface-2); color: var(--text-3); }
.muted-warn { color: var(--warn); }
.row-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* 타일 */
.tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.tile { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; display: grid; gap: 2px; box-shadow: var(--shadow); }
.tile-label { color: var(--text-2); font-size: 13px; font-weight: 600; }
.tile-val { font-size: 26px; font-weight: 750; letter-spacing: -.02em; }
.tile-val small { font-size: 14px; font-weight: 600; color: var(--text-3); margin-left: 2px; }
.tile-sub { color: var(--text-3); font-size: 12.5px; }
.tile.alert { border-color: var(--warn); background: var(--warn-soft); }
.tile.alert .tile-val { color: var(--warn); }

/* 막대 차트 */
.bars { display: flex; align-items: stretch; gap: 6px; height: calc(var(--h) + 40px); padding-top: 4px; }
.bar-col { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; min-width: 0; cursor: default; }
.bar-col:hover .bar { filter: brightness(1.12); }
.bar { width: 100%; max-width: 42px; background: var(--series); border-radius: 4px 4px 0 0; }
.bar-val { font-size: 11.5px; color: var(--text-2); font-weight: 600; min-height: 17px; white-space: nowrap; }
.bar-label { font-size: 11.5px; color: var(--text-3); margin-top: 6px; border-top: 1px solid var(--line); width: 100%; text-align: center; padding-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chart-tip { position: absolute; z-index: 60; background: var(--text); color: var(--surface); font-size: 12px; padding: 5px 9px; border-radius: 6px; pointer-events: none; opacity: 0; transition: opacity .1s; white-space: nowrap; }
.chart-tip.show { opacity: 1; }

/* 활동 목록 */
.act-list, .fu-list, .deal-list { list-style: none; margin: 0; padding: 0; }
.act-list.card, .fu-list.card { padding: 4px 18px; }
.act-item { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.act-item:last-child { border-bottom: 0; }
.act-item:hover .act-title strong { color: var(--brand); }
.act-date { color: var(--text-2); font-weight: 600; font-size: 13px; padding-top: 1px; }
.act-title { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.act-title span:not(.badge) { color: var(--text-2); }
.act-note { margin: 3px 0 0; color: var(--text-2); white-space: pre-line; }
.act-next { margin: 3px 0 0; font-size: 13px; color: var(--brand-ink); font-weight: 550; }
.act-next.overdue { color: var(--warn); }
.act-next.done { color: var(--text-3); text-decoration: line-through; }
.act-owner { color: var(--text-3); font-size: 12.5px; white-space: nowrap; }
.act-item.planned .act-date, .act-item.planned .act-title strong { color: var(--text-3); }
.act-list.compact .act-item { grid-template-columns: 56px 1fr auto; padding: 8px 0; }
.act-list.compact .act-note { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.fu-item { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px solid var(--line); }
.fu-item:last-child { border-bottom: 0; }
.fu-item small { color: var(--text-3); }
.fu-item.overdue small { color: var(--warn); font-weight: 600; }
.fu-main { cursor: pointer; flex: 1; }
.check { display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
.check input { width: 17px; height: 17px; accent-color: var(--brand); margin: 2px 0 0; }

.deal-list li { padding: 10px 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.deal-list li:last-child { border-bottom: 0; }
.deal-meta { color: var(--text-3); font-size: 13px; margin-top: 2px; }

/* 필터·탭 */
.filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; align-items: center; }
.filters input[type=search] { min-width: 220px; flex: 1; max-width: 340px; }
.tilde { color: var(--text-3); }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.tab { border: 0; background: none; padding: 8px 12px; cursor: pointer; color: var(--text-3); font-weight: 600; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tab.on { color: var(--brand-ink); border-bottom-color: var(--brand); }

/* 표 */
.table-wrap { overflow-x: auto; }
.card.table-wrap { padding: 0; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { padding: 10px 14px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.table th { font-size: 12.5px; color: var(--text-3); font-weight: 600; background: var(--surface-2); white-space: nowrap; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr[tabindex] { cursor: pointer; }
.table tbody tr[tabindex]:hover td { background: var(--surface-2); }
.table .num { text-align: right; }
.table .nowrap { white-space: nowrap; }
.table .clip { max-width: 260px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card > .table-wrap { margin: 0 -18px -16px; }
.table.clinic th:first-child { width: 56px; }
.table.clinic td { min-width: 110px; }
.clinic-doc { padding: 2px 0; }
.clinic-doc em { font-style: normal; color: var(--text-3); font-size: 12px; }
.info-card { display: grid; gap: 6px; }
.info-card .k { display: inline-block; width: 72px; color: var(--text-3); font-size: 13px; }
.info-card .memo { white-space: pre-line; }
.info-card .badge { margin-right: 4px; }

/* 주간 플래너 */
.planner-top { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 12px; }
.plan-box { margin: 0; padding: 12px 14px; }
.plan-box h2 { font-size: 13.5px; color: var(--text-2); margin-bottom: 6px; }
.plan-box textarea { border-color: transparent; background: var(--surface-2); padding: 8px; }
.planner-days { display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.day-col { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); min-height: 220px; display: flex; flex-direction: column; }
.day-col header { display: flex; align-items: center; gap: 6px; padding: 8px 8px 8px 12px; border-bottom: 1px solid var(--line); font-weight: 600; color: var(--text-2); }
.day-col header .icon-btn { margin-left: auto; font-size: 18px; color: var(--brand); }
.day-num { font-size: 18px; font-weight: 750; color: var(--text); }
.day-col.is-today { border-color: var(--brand); }
.day-col.is-today header { background: var(--brand-soft); border-radius: var(--radius) var(--radius) 0 0; }
.day-col ul { list-style: none; margin: 0; padding: 6px; display: grid; gap: 5px; align-content: start; }
.plan-item { padding: 7px 8px; border-radius: 7px; background: var(--surface-2); border-left: 3px solid var(--brand); cursor: pointer; font-size: 13px; line-height: 1.4; }
.plan-item.planned { border-left-color: var(--planned); }
.plan-item.planned .plan-h { color: var(--text-2); }
.plan-item:hover { background: var(--brand-soft); }
.plan-h { display: block; font-weight: 650; }
.plan-c, .plan-p { display: block; color: var(--text-2); font-size: 12.5px; }
.plan-p { color: var(--text-3); }
.dot { width: 10px; height: 10px; border-radius: 3px; display: inline-block; background: var(--brand); margin-left: 4px; }
.dot.planned { background: var(--planned); }
.memo-auto { margin: 0 0 10px; padding-left: 18px; color: var(--text-2); display: grid; gap: 3px; }

/* 칸반 */
.kanban { display: grid; grid-template-columns: repeat(8, minmax(180px, 1fr)); gap: 10px; overflow-x: auto; padding-bottom: 10px; align-items: start; }
.kcol { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; min-height: 300px; transition: background .1s; }
.kcol.drop { background: var(--brand-soft); border-color: var(--brand); }
.kcol header { display: flex; align-items: baseline; gap: 6px; margin-bottom: 8px; }
.kcol h2 { font-size: 13.5px; }
.kcount { color: var(--text-3); font-size: 12.5px; }
.ktotal { margin-left: auto; font-size: 12.5px; font-weight: 650; color: var(--text-2); }
.khint { margin: -4px 0 8px; font-size: 11.5px; color: var(--text-3); }
.kcol ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kcard { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 9px 10px; cursor: grab; display: grid; gap: 2px; font-size: 13px; box-shadow: var(--shadow); }
.kcard:hover { border-color: var(--brand); }
.kcard.dragging { opacity: .4; }
.kcard > span { color: var(--text-2); }
.kmeta { display: flex; gap: 8px; color: var(--text-3); font-size: 12px; margin-top: 3px; }
.kmeta span:first-child { color: var(--text); font-weight: 650; }
.kmeta .overdue { color: var(--warn); font-weight: 600; }
.stage-col-won { background: #eef7f0; }
.stage-col-lost { opacity: .8; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .stage-col-won { background: #172a1c; } :root:not([data-theme="light"]) .badge.stage-won { background: #1d3a24; color: #7bd88f; } }

.kcode { font-size: 11.5px; color: var(--brand-ink); background: var(--brand-soft); border-radius: 4px; padding: 1px 6px; justify-self: start; }
.stage-col-hold { opacity: .85; }
.badge.stage-codein { background: var(--brand-soft); color: var(--brand-ink); border-color: transparent; }
.badge.stage-hold { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.badge.warn { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.muted { color: var(--text-3); }

/* 제품별 현황 */
.stage-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: -2px 0 12px; }
.stage-chip { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: 4px 12px; cursor: pointer; font-size: 13px; color: var(--text-2); }
.stage-chip b { margin-left: 4px; color: var(--text); }
.stage-chip.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.stage-chip.on b { color: #fff; }
.table.tracker td { font-size: 13px; }
.table.tracker th.wide { min-width: 280px; }
.status-cell > div { margin-bottom: 3px; white-space: pre-line; }
.status-cell b { color: var(--text-2); font-weight: 650; margin-right: 2px; }
.clip-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-line; color: var(--text-2); }

/* 주간 플래너 이월·외래 경고 */
.plan-warn { display: block; font-size: 11.5px; color: var(--warn); font-weight: 600; }
.carry { border-color: var(--warn); }
.carry-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.carry-list li { padding: 6px 8px; border-radius: 6px; cursor: pointer; }
.carry-list li:hover { background: var(--warn-soft); }
.carry-list small { color: var(--text-3); }

/* 폼 안내 */
.form-info { background: var(--surface-2); border-radius: 8px; padding: 8px 12px; font-size: 13px; color: var(--text-2); }
.form-info .ok { color: var(--good); font-weight: 600; }
.form-info .warn { color: var(--warn); font-weight: 600; }
.deal-history { background: var(--surface-2); border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; }
.deal-history h3 { font-size: 13.5px; margin: 0 0 6px; }
.deal-history h3 small { color: var(--text-3); font-weight: 500; margin-left: 6px; }
.deal-history ul { margin: 0; padding-left: 16px; display: grid; gap: 3px; font-size: 13px; color: var(--text-2); white-space: pre-line; max-height: 160px; overflow-y: auto; }

/* 가져오기 */
.import-kinds { margin: 0 0 12px; padding-left: 18px; color: var(--text-2); font-size: 13px; display: grid; gap: 3px; }
.file-drop { display: block; border: 2px dashed var(--line); border-radius: 10px; padding: 18px; text-align: center; cursor: pointer; color: var(--brand); font-weight: 600; margin-bottom: 12px; }
.file-drop:hover { border-color: var(--brand); }
.file-drop input { display: block; margin: 0 auto 6px; }
.import-summary ul { margin: 6px 0 10px; padding-left: 18px; font-size: 13px; }
.import-summary li.warn { color: var(--warn); }
.error { color: var(--danger); }
.warn-box { background: var(--warn-soft); color: var(--warn); border-radius: 8px; padding: 10px 12px; font-size: 13px; }
.import-summary .warn { color: var(--warn); font-weight: 600; }
.table.small th, .table.small td { padding: 6px 10px; font-size: 12.5px; }

/* 팀 일정 — 팀원 색 (검증된 8색, 이름 글자와 항상 함께 표시) */
:root { --m0: #9aa3af; --m1: #2a78d6; --m2: #eb6834; --m3: #1baf7a; --m4: #eda100; --m5: #e87ba4; --m6: #008300; --m7: #4a3aa7; --m8: #e34948; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --m1: #3987e5; --m2: #d95926; --m3: #199e70; --m4: #c98500; --m5: #d55181; --m6: #008300; --m7: #9085e9; --m8: #e66767; } }
:root[data-theme="dark"] { --m1: #3987e5; --m2: #d95926; --m3: #199e70; --m4: #c98500; --m5: #d55181; --m6: #008300; --m7: #9085e9; --m8: #e66767; }
.mdot.m0 { background: var(--m0); } .t-item.m0 { border-left-color: var(--m0); }
.mdot.m1 { background: var(--m1); } .t-item.m1 { border-left-color: var(--m1); }
.mdot.m2 { background: var(--m2); } .t-item.m2 { border-left-color: var(--m2); }
.mdot.m3 { background: var(--m3); } .t-item.m3 { border-left-color: var(--m3); }
.mdot.m4 { background: var(--m4); } .t-item.m4 { border-left-color: var(--m4); }
.mdot.m5 { background: var(--m5); } .t-item.m5 { border-left-color: var(--m5); }
.mdot.m6 { background: var(--m6); } .t-item.m6 { border-left-color: var(--m6); }
.mdot.m7 { background: var(--m7); } .t-item.m7 { border-left-color: var(--m7); }
.mdot.m8 { background: var(--m8); } .t-item.m8 { border-left-color: var(--m8); }
.mdot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; flex: none; }
.mtag { display: inline-flex; align-items: center; font-weight: 650; font-size: 12.5px; color: var(--text); white-space: nowrap; }
.seg .btn.on { background: var(--brand-soft); color: var(--brand-ink); border-color: var(--brand); position: relative; z-index: 1; }
.team-wrap { padding: 0; }
.team-grid { border-collapse: collapse; width: 100%; min-width: 760px; table-layout: fixed; }
.team-grid th, .team-grid td { border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); vertical-align: top; padding: 6px; text-align: left; }
.team-grid thead th { background: var(--surface-2); font-size: 12.5px; color: var(--text-2); font-weight: 650; padding: 8px; }
.team-grid thead th span { color: var(--text-3); font-weight: 500; margin-left: 2px; }
.team-grid .t-who { width: 128px; border-left: 0; background: var(--surface-2); }
.team-grid tbody th.t-who { padding: 10px 10px; }
.team-grid tbody th small { display: block; color: var(--text-3); font-weight: 500; font-size: 11.5px; margin-top: 3px; }
.team-grid tbody tr:last-child > * { border-bottom: 0; }
.team-grid .is-today { background: color-mix(in srgb, var(--brand-soft) 60%, transparent); }
.team-grid ul, .team-days ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.t-item { padding: 5px 7px; border-radius: 6px; background: var(--surface-2); border-left: 3px solid var(--m0); cursor: pointer; font-size: 12.5px; line-height: 1.35; display: grid; gap: 1px; }
.t-item:hover { background: var(--brand-soft); }
.t-item.planned { background: transparent; border: 1px dashed var(--line); border-left-width: 3px; border-left-style: solid; }
.t-item.planned .t-h { color: var(--text-2); font-weight: 550; }
.t-h { font-weight: 650; }
.t-c { color: var(--text-3); font-size: 12px; }
.team-days .day-col ul { padding: 6px; }
.t-count { margin-left: auto; font-size: 12px; color: var(--text-3); padding-right: 6px; }
.team-goals { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.team-goal { background: var(--surface-2); border-radius: 8px; padding: 10px 12px; }
.team-goal h3 { margin: 0 0 6px; }
.team-goal p { margin: 0 0 4px; white-space: pre-line; font-size: 13px; }

/* 데일리 보고 */
.daily-slot .card-head h2 small { color: var(--text-3); }
.badge.ok { background: #e6f4ea; color: var(--good); border-color: transparent; }
.d-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.d-item { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; padding: 10px 12px; border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: 10px; background: var(--surface); }
.d-item.planned { border-left-color: var(--planned); background: var(--surface-2); }
.d-item.missed { border-left-color: var(--warn); opacity: .85; }
.d-item.missed .d-title strong { text-decoration: line-through; }
.d-title { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.d-title span:not(.badge) { color: var(--text-2); }
.d-sub { margin: 3px 0 0; font-size: 12.5px; color: var(--text-3); }
.d-sub.warn { color: var(--warn); }
.d-note { margin: 4px 0 0; white-space: pre-line; color: var(--text-2); }
.d-actions { display: flex; gap: 6px; align-items: flex-start; }
.btn.ghost { background: transparent; }
.d-panel { grid-column: 1 / -1; display: grid; gap: 8px; padding: 10px; background: var(--surface-2); border-radius: 8px; margin-top: 4px; }
.d-panel label { display: grid; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--text-2); }
.d-panel textarea, .d-panel input, .d-panel select { width: 100%; }
.d-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.d-btns { display: flex; gap: 6px; justify-content: flex-end; }
.d-add { margin-top: 10px; }
.d-add summary { cursor: pointer; color: var(--brand); font-weight: 600; font-size: 13.5px; padding: 4px 0; }
.slot-report { display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line); }
.slot-report label { display: grid; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--text-2); }
.slot-tag { display: inline-block; font-size: 10.5px; font-weight: 700; color: var(--brand-ink); background: var(--brand-soft); border-radius: 4px; padding: 0 5px; margin-right: 4px; }
.plan-item.missed, .t-item.missed { opacity: .6; text-decoration: line-through; }
.act-item.missed .act-title strong { text-decoration: line-through; }
.act-date small { display: block; font-weight: 500; color: var(--text-3); }
.act-change { margin: 3px 0 0; font-size: 12.5px; color: var(--warn); }
.report-bar { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px 14px; margin-bottom: 12px; color: var(--text); }
.report-bar .ok { color: var(--good); font-weight: 600; }
.report-bar .warn { color: var(--warn); font-weight: 600; }
.report-bar .go { margin-left: auto; color: var(--brand); font-weight: 600; }

/* 주간 보고 */
.review-table tr[data-person] { cursor: pointer; }
.review-table tr.on td { background: var(--brand-soft); }
.section-title { margin: 22px 0 10px; font-size: 17px; }
.daily-grid td { min-width: 120px; font-size: 12.5px; }
.daily-grid td.ok { background: color-mix(in srgb, #e6f4ea 70%, transparent); }
.daily-grid td small { display: block; color: var(--text-3); }
.daily-grid td p { margin: 4px 0 0; white-space: pre-line; color: var(--text-2); }
.review-day { margin-bottom: 12px; }
.review-day h3 { font-size: 13.5px; margin: 0 0 4px; color: var(--text-2); }
.review-day ul { margin: 0; padding-left: 0; list-style: none; display: grid; gap: 3px; font-size: 13px; }
.review-day li { cursor: pointer; }
.pre { white-space: pre-line; margin: 0 0 6px; }

/* 학회 OPP */
.badge.opp { background: var(--brand); color: #fff; border-color: transparent; }
.opp-table td { font-size: 13px; }
.opp-table tr.need td { background: color-mix(in srgb, var(--warn-soft) 55%, transparent); }
.opp-table td[data-deal] { cursor: pointer; }
.opp-table td[data-deal]:hover strong { color: var(--brand); }
.opp-last { max-width: 240px; }
.clip-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--text-2); }
.opp-update { border: 1px solid var(--brand); border-radius: 8px; padding: 8px 10px 10px; margin: 2px 0 0; background: var(--brand-soft); }
.opp-update legend { font-size: 12px; font-weight: 700; color: var(--brand-ink); padding: 0 4px; }
.opp-bar { border-color: color-mix(in srgb, var(--brand) 35%, var(--line)); }

/* 휴대폰 상단 바 + 전체 메뉴 */
.m-top, .m-sheet { display: none; }
@media (max-width: 768px) {
  .m-top { display: flex; align-items: center; gap: 10px; position: sticky; top: 0; z-index: 30; background: var(--surface); border-bottom: 1px solid var(--line); padding: calc(8px + env(safe-area-inset-top)) 12px 8px 16px; }
  body { padding-top: 0; }
  .m-top .brand-logo { height: 30px; }
  .m-user { margin-left: auto; font-size: 13px; font-weight: 600; color: var(--text-2); }
  .m-more { width: 44px; height: 44px; display: grid; place-items: center; }
  .m-more svg { width: 24px; height: 24px; fill: var(--text); }
  .m-sheet:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 60; background: rgba(15, 18, 30, .4); }
  .m-sheet-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(300px, 84vw); background: var(--surface); padding: calc(16px + env(safe-area-inset-top)) 12px calc(16px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 8px; overflow-y: auto; }
  .m-sheet-panel nav { display: grid; gap: 2px; }
  .m-sheet-panel nav a { display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: 10px; color: var(--text); font-weight: 600; min-height: 44px; }
  .m-sheet-panel nav a:hover { background: var(--surface-2); }
  .m-sheet-panel nav svg { width: 20px; height: 20px; fill: var(--brand); }
  .m-sheet-foot { margin-top: auto; display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
  .m-sheet-foot .btn { min-height: 44px; }
  .demo-bar { position: relative; z-index: 31; }
}

/* 대시보드 — 차트 색 --chart 는 밝은/어두운 화면 각각 검증한 한 가지 색. '예정'은 속 빈 막대로 구분 */
:root { --chart: #3b56c8; --chart-soft: #dfe5fb; --chart-mute: #c9d0e3; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --chart: #7a8de6; --chart-soft: #262f55; --chart-mute: #39405a; } }
:root[data-theme="dark"] { --chart: #7a8de6; --chart-soft: #262f55; --chart-mute: #39405a; }
.dash-top { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.dash-top > a { color: var(--text); margin: 0; }
.dash-top > a:hover { border-color: var(--brand); }
.hero { display: grid; gap: 6px; align-content: start; }
.hero-l, .kpi > span { font-size: 13px; color: var(--text-2); font-weight: 600; }
.hero-v { font-size: 56px; line-height: 1; font-weight: 800; color: var(--heading); letter-spacing: -1px; }
.hero-v.good { color: var(--good); } .hero-v.warn { color: var(--warn); } .hero-v.bad { color: var(--danger); }
.hero-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hero-pct { font-size: 44px; font-weight: 800; margin-left: 2px; letter-spacing: 0; }
.ring { width: 84px; height: 84px; flex: none; }
.ring-t { fill: none; stroke: var(--chart-soft); stroke-width: 9; }
.ring-v { fill: none; stroke: var(--chart); stroke-width: 9; stroke-linecap: round; }
.ring.good .ring-v { stroke: var(--good); } .ring.warn .ring-v { stroke: var(--warn); } .ring.bad .ring-v { stroke: var(--danger); }
.ring text { font-size: 15px; font-weight: 700; fill: var(--text); }
.hero-s { font-size: 12.5px; color: var(--text-3); }
.meter { display: flex; gap: 2px; height: 10px; border-radius: 5px; background: var(--chart-soft); overflow: hidden; margin-top: 6px; }
.meter i { display: block; height: 100%; }
.m-on { background: var(--chart); } .m-chg { background: color-mix(in srgb, var(--chart) 55%, var(--surface)); } .m-off { background: var(--warn); } .m-miss { background: var(--danger); }
.meter-key { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--text-2); }
.meter-key i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 4px; }
.kpi { display: grid; gap: 2px; align-content: start; }
.kpi b { font-size: 30px; line-height: 1.15; font-weight: 700; color: var(--heading); }
.kpi b small { font-size: 14px; font-weight: 500; margin-left: 2px; color: var(--text-2); }
.kpi em { font-style: normal; font-size: 12.5px; color: var(--text-3); }
.kpi em.up { color: var(--rise); } .kpi em.down { color: var(--fall); }
.spark { display: flex; align-items: flex-end; gap: 2px; height: 30px; margin-top: 8px; }
.spark i { flex: 1; max-width: 12px; background: var(--chart-mute); border-radius: 2px 2px 0 0; }
.spark i.cur { background: var(--chart); }
.dash-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; align-items: start; }
.dash-grid > .card { margin: 0; }
/* 세로 막대 */
.cc { display: flex; align-items: flex-end; gap: 4px; height: calc(var(--h) + 24px); padding-top: 4px; border-bottom: 1px solid var(--line); }
.cc-col { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; cursor: default; }
.cc-col:hover .cc-bar { filter: brightness(1.1); }
.cc-val { font-size: 12px; color: var(--text-2); height: 16px; white-space: nowrap; }
.cc-bar { display: block; width: 70%; max-width: 24px; background: var(--chart); border-radius: 4px 4px 0 0; }
.cc-bar.stack { border-radius: 0; }
.cc-bar.plan { background: color-mix(in srgb, var(--chart) 10%, transparent); border: 1.5px solid var(--chart); border-bottom: 0; box-sizing: border-box; border-radius: 4px 4px 0 0; margin-bottom: 2px; }
.cc-col:not(.cur) .cc-bar:not(.plan) { opacity: .75; }
.cc-lab { position: absolute; bottom: -20px; font-size: 11.5px; color: var(--text-3); white-space: nowrap; }
.cc-col.cur .cc-lab { color: var(--text); font-weight: 700; }
.cc + * { margin-top: 24px; }
.dash-grid .card .cc { margin-bottom: 22px; }
.legend-inline { display: flex; gap: 12px; font-size: 12px; color: var(--text-2); }
.legend-inline i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }
.k-done { background: var(--chart); } .k-plan { background: color-mix(in srgb, var(--chart) 10%, transparent); border: 1.5px solid var(--chart); box-sizing: border-box; }
/* 가로 막대 */
.hb { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.hb li { display: grid; grid-template-columns: 96px 1fr 44px; gap: 10px; align-items: center; font-size: 13px; }
.hb-l { color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-t { height: 14px; background: var(--surface-2); border-radius: 0 4px 4px 0; }
.hb-t i { display: block; height: 100%; background: var(--chart); border-radius: 0 4px 4px 0; }
.hb-v { text-align: right; font-variant-numeric: tabular-nums; color: var(--text); font-weight: 600; }
.rep-chips { display: flex; gap: 6px; font-size: 12.5px; }
.rep-chips span { padding: 2px 8px; border-radius: 999px; background: var(--surface-2); color: var(--text-2); }
.rep-chips .ok { background: color-mix(in srgb, var(--good) 14%, transparent); color: var(--good); font-weight: 600; }
.rep-chips .warn { background: var(--warn-soft); color: var(--warn); font-weight: 600; }
.today-list { list-style: none; margin: 0; padding: 0; }
.today-list li { display: flex; align-items: center; gap: 10px; padding: 9px 4px; border-bottom: 1px solid var(--line); cursor: pointer; }
.today-list li:last-child { border-bottom: 0; }
.today-list li:hover { background: var(--surface-2); }
.today-list .tl-main { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.today-list .tl-who { font-size: 12.5px; color: var(--text-2); }
.today-list .tl-st { font-size: 12px; color: var(--text-3); white-space: nowrap; }
.today-list li.done .tl-st { color: var(--good); font-weight: 600; }
.btn.block { display: flex; justify-content: center; margin-top: 12px; }
.more { margin: 8px 0 0; }
.todo-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.todo-list a { display: flex; align-items: center; gap: 12px; padding: 8px 6px; border-radius: 8px; color: var(--text); }
.todo-list a:hover { background: var(--surface-2); }
.todo-list .go { margin-left: auto; color: var(--text-3); }
.todo-n { min-width: 32px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: var(--surface-2); font-weight: 700; font-variant-numeric: tabular-nums; }
.todo-n.bad { background: var(--danger-soft); color: var(--danger); }
.todo-n.warn { background: var(--warn-soft); color: var(--warn); }
.sub-h { font-size: 13.5px; color: var(--text-2); margin: 14px 0 6px; }
@media (max-width: 1100px) { .dash-top { grid-template-columns: repeat(3, 1fr); } .hero { grid-column: 1 / -1; } }
@media (max-width: 600px) { .cc-col:nth-last-child(even):not(.cur) .cc-lab { visibility: hidden; } .cc-lab { font-size: 11px; } }
@media (max-width: 900px) { .dash-top { grid-template-columns: 1fr 1fr; } .dash-grid { grid-template-columns: 1fr; } .kpi b { font-size: 24px; } .hero-v { font-size: 44px; } .kpi:last-child { grid-column: 1 / -1; } }

/* 주간 플랜 달성률 */
.report-bar .muted, .plan-bar .muted { color: var(--text-3); font-size: 12.5px; }
.plan-bar .go-btn { margin-left: auto; }
.ach-top { display: flex; gap: 20px 32px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.ach-big b { display: block; font-size: 40px; line-height: 1; color: var(--brand-ink); font-variant-numeric: tabular-nums; }
.ach-big span { color: var(--text-3); font-size: 13px; }
.ach-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; list-style: none; margin: 0; padding: 0; font-size: 13px; color: var(--text-2); }
.ach-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.ach-bar { display: flex; gap: 2px; height: 12px; border-radius: 6px; background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line); overflow: hidden; }
.ach-bar i { display: block; height: 100%; }
.ach-on { background: var(--brand); } .ach-chg { background: #8a98d6; } .ach-off { background: var(--warn); } .ach-miss { background: var(--danger); }
.ach-rest { background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line-strong); }
.ach-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ach-rows a { display: grid; grid-template-columns: minmax(120px, 180px) 1fr 92px; gap: 12px; align-items: center; padding: 8px 6px; border-radius: 8px; color: var(--text); }
.ach-rows a:hover { background: var(--surface-2); }
.ach-num { text-align: right; font-variant-numeric: tabular-nums; } .ach-num small { color: var(--text-3); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .ach-chg { background: #4a5aa8; } }
:root[data-theme="dark"] .ach-chg { background: #4a5aa8; }
@media (max-width: 768px) { .ach-rows a { grid-template-columns: 1fr 70px; } .ach-rows .ach-bar { grid-column: 1 / -1; grid-row: 2; } .ach-big b { font-size: 34px; } }

/* 병원별 진행 현황 */
.hp-stages { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.hp-stage { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--text-2); font: inherit; font-size: 13.5px; cursor: pointer; }
.hp-stage b { color: var(--text); font-variant-numeric: tabular-nums; }
.hp-stage:hover { border-color: var(--line-strong); }
.hp-stage.on { background: var(--brand-soft); border-color: var(--brand); color: var(--brand-ink); }
.stepper { display: inline-flex; gap: 2px; vertical-align: middle; }
.stepper i { width: 9px; height: 6px; border-radius: 2px; background: var(--line); }
.stepper i.on { background: var(--brand); }
.stepper.off { width: 64px; height: 6px; border-radius: 2px; background: repeating-linear-gradient(45deg, var(--line) 0 3px, transparent 3px 6px); }
.hp-table td { vertical-align: top; }
.hp-table td:first-child { min-width: 150px; }
.hp-table td:nth-child(2) { min-width: 240px; }
.hp-table tr.need td { background: color-mix(in srgb, var(--warn-soft) 55%, transparent); }
.hp-name { color: var(--text); }
.hp-name:hover strong { color: var(--brand); text-decoration: underline; }
.hp-deals { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.hp-deals li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 4px 6px; margin: -4px -6px 0; border-radius: 6px; cursor: pointer; }
.hp-deals li:hover { background: var(--surface-2); }
.hp-prod { font-weight: 600; }
.hp-st { color: var(--text-3); font-size: 12.5px; }
.hp-last { max-width: 260px; }
.hp-table [data-act] { cursor: pointer; }
@media (max-width: 768px) {
  .hp-stages { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px 12px; padding: 0 16px 4px; scrollbar-width: none; }
  .hp-stage { flex: none; }
  .hp-table thead { display: none; }
  .hp-table, .hp-table tbody, .hp-table tr, .hp-table td { display: block; }
  .hp-table tr { padding: 12px 14px; border-bottom: 1px solid var(--line); }
  .hp-table td { padding: 0; border: 0; min-width: 0 !important; max-width: none; }
  .hp-table td + td { margin-top: 8px; }
  .hp-table tr.need { background: color-mix(in srgb, var(--warn-soft) 55%, transparent); }
  .hp-table tr.need td { background: none; }
  .hp-stages ~ .filters input[type=search] { flex: 1 1 100%; }
  .hp-table td:nth-child(3)::before { content: '최근 접촉 '; color: var(--text-3); font-size: 12px; }
  .hp-table td:nth-child(4):not(:empty)::before { content: '다음 일정'; display: block; color: var(--text-3); font-size: 12px; }
  .hp-table td:nth-child(5)::before { content: '담당 '; color: var(--text-3); font-size: 12px; }
  .hp-table td:nth-child(3) b, .hp-table td:nth-child(3) .muted-warn { display: inline; }
}
.chk { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--text-2); min-height: 40px; }

/* 플랜 불러오기 */
.plan-empty { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; justify-content: space-between; background: var(--brand-soft); border: 1px solid var(--brand); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 12px; color: var(--brand-ink); }
.pi-sec { border-top: 1px solid var(--line); padding: 12px 0 4px; }
.pi-sec header { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.pi-sec h3 { font-size: 15px; margin: 0; }
.pi-sec h3 small { color: var(--text-3); font-weight: 400; }
.pi-sec header select { max-width: 220px; }
.pi-sec ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.pi-row { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center; padding: 6px 4px; border-radius: 8px; }
.pi-row:hover { background: var(--surface-2); }
.pi-row.is-dup .pi-check span { opacity: .75; }
.pi-check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; min-width: 0; }
.pi-check input { width: 18px; height: 18px; margin-top: 2px; flex: none; }
.pi-check span { min-width: 0; }
.pi-check small { display: block; color: var(--text-3); font-size: 12.5px; }
.pi-row select { min-height: 36px; padding: 4px 8px; }
.link-btn { background: none; border: 0; color: var(--brand); font: inherit; font-size: 13px; cursor: pointer; padding: 4px; margin-left: auto; }
.pi-foot { position: sticky; bottom: -1px; background: var(--surface); display: flex; align-items: center; gap: 8px; justify-content: flex-end; padding-top: 12px; border-top: 1px solid var(--line); }
.pi-count { margin-right: auto; color: var(--text-2); font-weight: 600; }
@media (max-width: 768px) { .pi-row { grid-template-columns: 1fr 1fr; } .pi-check { grid-column: 1 / -1; } }

/* 외래 스케줄 */
.modal.xwide { width: min(1040px, 100%); }
.chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 10px; }
.chip { min-height: 32px; padding: 4px 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--text-2); font: inherit; font-size: 13px; cursor: pointer; }
.chip.on { background: var(--brand-soft); border-color: var(--brand); color: var(--brand-ink); font-weight: 600; }
.ce-table th, .ce-table td { padding: 4px 6px; text-align: center; vertical-align: middle; }
.ce-table tbody th { text-align: left; white-space: nowrap; font-weight: 400; }
.ce-table tbody th small { display: block; color: var(--text-3); font-size: 12px; }
.ce-table thead tr.sub th { font-size: 11.5px; color: var(--text-3); font-weight: 400; }
.ce-table tbody th { min-width: 170px; }
.ce-table td.ce-cell:nth-child(even), .ce-table thead tr:first-child th:not(:first-child) { border-left: 1px solid var(--line); }
.ce-cell label { position: relative; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; cursor: pointer; }
.ce-cell input { position: absolute; opacity: 0; pointer-events: none; }
.ce-cell span { width: 22px; height: 22px; border-radius: 6px; border: 1.5px solid var(--line-strong); background: var(--surface); }
.ce-cell input:checked + span { background: var(--brand); border-color: var(--brand); box-shadow: inset 0 0 0 3px var(--surface); }
.ce-cell input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }
.ce-table td:last-child input { width: 140px; min-height: 34px; }
.ce-new th input { width: 100%; min-height: 32px; }
.ce-new2 { display: flex; gap: 4px; margin-top: 4px; } .ce-new2 input { width: 50%; }
.cp-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 8px; font-size: 13px; }
.cp-top select { min-width: 220px; }
.cp-top .link-btn { margin-left: 0; }
.cp-grid th, .cp-grid td { vertical-align: top; }
.cp-grid td { min-width: 150px; }
.cp-grid thead th small { color: var(--text-3); font-weight: 400; }
.cp-doc { display: block; width: 100%; text-align: left; margin: 0 0 6px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; font-size: 13px; cursor: pointer; }
.cp-doc span { color: var(--text-2); }
.cp-doc small { display: block; color: var(--text-3); font-size: 12px; margin-top: 2px; }
.cp-doc:hover { border-color: var(--brand); }
.cp-doc.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.cp-doc.on span, .cp-doc.on small { color: rgba(255, 255, 255, .85); }
.cp-doc.planned:not(.on) { border-style: dashed; }
.cp-focus { align-items: center; }
.cp-focus .muted { font-size: 12.5px; color: var(--text-3); }
.cp-deal { display: inline-block; white-space: nowrap; line-height: 18px; font-style: normal; font-size: 11px; font-weight: 700; color: #b8452c; background: #fff0eb; border-radius: 4px; padding: 0 5px; margin-left: 2px; }
.cp-doc.on .cp-deal { background: rgba(255,255,255,.2); color: #fff; }
.modal-body { min-width: 0; }
@media (max-width: 768px) {
  .cp-top select { min-width: 0; width: 100%; }
  .cp-top label { flex: 1 1 100%; display: grid; gap: 4px; }
  .cp-grid thead, .cp-grid tbody th { display: none; }
  .cp-grid, .cp-grid td { display: block; }
  .cp-grid tbody { display: flex; flex-direction: column; }
  .cp-grid tr { display: contents; }
  .cp-grid td { order: var(--o); }
  .cp-grid td { min-width: 0; padding: 8px 0; border: 0; }
  .cp-grid td.cp-empty { display: none; }
  .cp-grid td::before { content: attr(data-label); display: block; font-weight: 700; font-size: 13px; margin-bottom: 6px; }
}
.d-clinic { margin: 4px 0; }
.d-clinic summary { cursor: pointer; font-size: 13px; color: var(--brand); padding: 4px 0; }
.d-clinic summary small { color: var(--text-3); }
.d-clinic .slot-grid { margin-top: 6px; }

/* 외래 보드 (끌어놓기) */
.cb-help { margin: 0 0 8px; }
.cb-roster { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; padding: 8px; border: 1px dashed var(--line-strong); border-radius: var(--radius); margin-bottom: 10px; min-height: 40px; }
.cb-add { display: inline-flex; gap: 4px; margin-left: auto; }
.cb-add input { width: 92px; min-height: 30px; padding: 2px 8px; font-size: 13px; }
.cb-add input[data-new-dept] { width: 72px; }
.cb-grid { display: grid; grid-template-columns: 40px repeat(5, minmax(0, 1fr)); gap: 4px; }
.cb-dh { text-align: center; font-weight: 700; font-size: 13px; padding: 2px 0; }
.cb-ph { display: grid; place-items: center; font-size: 12px; color: var(--text-3); writing-mode: vertical-rl; letter-spacing: 2px; }
.cb-cell { min-width: 0; min-height: 92px; border: 1px solid var(--line); border-radius: 8px; padding: 4px; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 3px; background: var(--surface); }
.cb-cell.over, .cb-roster.over { border-color: var(--brand); background: var(--brand-soft); }
.cb-chip { display: inline-flex; align-items: center; gap: 3px; padding: 1px 4px 1px 6px; border-radius: 6px; border: 1px solid var(--line-strong); background: var(--surface-2); font-size: 12px; line-height: 20px; white-space: nowrap; cursor: grab; user-select: none; touch-action: none; }
.cb-roster .cb-chip { padding-right: 6px; }
.cb-chip i { font-style: normal; font-size: 10px; color: var(--brand-ink); background: var(--brand-soft); border-radius: 3px; padding: 0 3px; }
.cb-chip.sel { outline: 2px solid var(--brand); outline-offset: 1px; background: var(--brand-soft); }
.cb-chip.new { border-style: dashed; }
.cb-chip.cb-src { opacity: .35; }
.cb-dot { color: var(--warn); font-size: 12px; margin-left: -1px; }
.cb-x { border: 0; background: none; color: var(--text-3); font-size: 13px; line-height: 1; padding: 0 2px; cursor: pointer; border-radius: 4px; }
.cb-x:hover { color: var(--danger); background: var(--danger-soft); }
.cb-ghost { position: fixed; z-index: 200; pointer-events: none; transform: translate(-50%, -60%) rotate(-2deg); box-shadow: 0 6px 16px rgba(0,0,0,.25); background: var(--surface); }
.cb-trash { display: none; margin-top: 8px; padding: 10px; text-align: center; border: 1px dashed var(--danger); border-radius: 8px; color: var(--danger); font-size: 13px; }
[data-cb].dragging .cb-trash { display: block; }
.cb-trash.over { background: var(--danger-soft); }
.cb-detail { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end; margin-top: 10px; padding: 10px 12px; border-radius: var(--radius); background: var(--surface-2); }
.cb-detail > b { flex-basis: 100%; }
.cb-detail label { display: grid; gap: 2px; font-size: 12px; color: var(--text-3); }
.cb-detail input { min-height: 32px; width: 120px; }
.cb-detail label.grow { flex: 1 1 220px; } .cb-detail label.grow input { width: 100%; }
.cb-detail .muted, .cb-tip { font-size: 12.5px; color: var(--text-3); flex-basis: 100%; margin: 6px 0 0; }
@media (max-width: 768px) {
  .cb-grid { grid-template-columns: 22px repeat(5, minmax(0, 1fr)); gap: 2px; }
  .cb-cell { min-height: 72px; padding: 2px; }
  .cb-chip { font-size: 11px; padding: 0 3px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: block; }
  .cb-cell .cb-x { display: none; }
  .cb-roster .cb-chip { display: inline-flex; max-width: none; }
  .cb-chip i { display: none; }
  .cb-add { margin-left: 0; width: 100%; } .cb-add input { flex: 1; width: auto; }
}

/* 외래표 가져오기·만들기 */
.ci-top { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 8px; }
.ci-top label { display: grid; gap: 4px; font-size: 13px; color: var(--text-2); }
.ci-top input { min-width: 260px; }
.ci-sum { margin: 12px 0 6px; }
.ci-table-wrap { max-height: 46vh; overflow: auto; }
.ci-table td { vertical-align: top; }
.ci-table tr.muted td { color: var(--text-3); }
.ci-note { max-width: 260px; font-size: 12.5px; color: var(--text-2); }
.ce-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
.ce-tools .muted { color: var(--text-3); font-size: 12.5px; }
.ce-more { margin: 6px 0 0; }
.ce-new2 input { min-width: 0; }
label.stack { display: grid; gap: 4px; margin-bottom: 10px; }
.cl-table { min-width: 640px; }
.cl-table td:first-child { min-width: 140px; }
.cc-ways { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cc-way { display: grid; gap: 4px; text-align: left; padding: 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--text); font: inherit; cursor: pointer; }
.cc-way:hover { border-color: var(--brand); background: var(--brand-soft); }
.cc-way span { color: var(--text-3); font-size: 13px; }
@media (max-width: 768px) { .cc-ways { grid-template-columns: 1fr; } .ci-top input { min-width: 0; width: 100%; } .ci-top label { flex: 1 1 100%; } }
.pi-clinic .ok { color: var(--good); } .pi-clinic .warn { color: var(--warn); font-weight: 600; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; }

/* 월요 영업회의 */
.print-only { display: none; }
.mt-deck { display: grid; gap: 16px; }
.mt-nav { display: none; }
.mt-slide { scroll-margin-top: 16px; }
.mt-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.mt-head h2 { font-size: 20px; margin: 0; }
.mt-head .muted, .mt-slide .muted { color: var(--text-3); }
.mt-sum tbody tr { cursor: pointer; }
.mt-sum tbody tr:hover td { background: var(--surface-2); }
.mt-sum tfoot th { border-top: 2px solid var(--line-strong); }
.ok-text { color: var(--good); font-weight: 600; }
.mt-reasons { margin: 12px 0 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.mt-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.mt-col h3 { font-size: 16px; margin: 0 0 10px; color: var(--brand-ink); }
.mt-col h3 small, .mt-col h4 small { color: var(--text-3); font-weight: 400; }
.mt-col h4 { font-size: 14px; margin: 14px 0 6px; }
.mt-kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.mt-kpis div { background: var(--surface-2); border-radius: 8px; padding: 8px 6px; text-align: center; }
.mt-kpis b { display: block; font-size: 20px; color: var(--heading); font-variant-numeric: tabular-nums; }
.mt-kpis span { font-size: 11.5px; color: var(--text-3); }
.mt-kpis .warn b { color: var(--warn); }
.mt-goal { background: var(--brand-soft); color: var(--brand-ink); border-radius: 8px; padding: 8px 10px; margin: 10px 0 0; white-space: pre-line; font-size: 13.5px; }
.mt-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13.5px; }
.mt-list li[data-act], .mt-list li[data-deal] { cursor: pointer; }
.mt-date { color: var(--text-3); font-variant-numeric: tabular-nums; margin-right: 6px; }
.mt-note { color: var(--text-2); margin-left: 44px; }
.mt-list .act-next { margin-left: 44px; }
.mt-week { display: grid; gap: 4px; }
.mt-day { display: grid; grid-template-columns: 64px 1fr; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.mt-day ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; }
.mt-day li[data-act] { cursor: pointer; }
.mt-dow { font-weight: 700; } .mt-dow small { color: var(--text-3); font-weight: 400; }
.mt-memo { display: grid; gap: 6px; margin-top: 16px; }
.mt-memo textarea { min-height: 56px; }
.meet-note { background: var(--brand-soft); border: 1px solid var(--brand); border-radius: var(--radius); padding: 10px 14px; margin-bottom: 12px; color: var(--brand-ink); }
.meet-note p { margin: 4px 0; color: var(--text); }
.small { font-size: 12.5px; }
/* 발표 모드: 한 장씩 전체 화면 */
.mt-overlay { position: fixed; inset: 0; z-index: 80; background: var(--bg); overflow: auto; padding: 24px 32px 80px; }
.mt-overlay .mt-deck.presenting { position: static; padding: 0; overflow: visible; background: none; }
.mt-overlay .mt-nav { display: flex; gap: 8px; align-items: center; position: fixed; right: 24px; bottom: 20px; z-index: 81; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 6px 10px; box-shadow: var(--shadow); }
.mt-overlay .mt-nav span { min-width: 56px; text-align: center; font-variant-numeric: tabular-nums; color: var(--text-2); }
.mt-sum tbody tr[data-goto] { cursor: pointer; }
.mt-deck.presenting { position: fixed; inset: 0; z-index: 80; background: var(--bg); padding: 24px 32px 72px; overflow: auto; display: block; }
.mt-deck.presenting .mt-slide { display: none; max-width: 1400px; margin: 0 auto; font-size: 15px; }
.mt-deck.presenting .mt-slide.on { display: block; }
.mt-deck.presenting .mt-head h2 { font-size: 26px; }
.mt-deck.presenting .mt-list, .mt-deck.presenting .mt-day { font-size: 15px; }
.mt-deck.presenting .mt-nav { display: flex; gap: 8px; align-items: center; position: fixed; right: 24px; bottom: 20px; z-index: 81; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 6px 10px; box-shadow: var(--shadow); }
.mt-deck.presenting .mt-nav span { min-width: 56px; text-align: center; font-variant-numeric: tabular-nums; color: var(--text-2); }
body.presenting .m-top, body.presenting .demo-bar { display: none; }
@media (max-width: 900px) { .mt-cols { grid-template-columns: 1fr; } .mt-kpis { grid-template-columns: repeat(3, 1fr); } .mt-deck.presenting { padding: 16px 16px 72px; } }
@media print {
  .print-only { display: block; font-weight: 700; margin: 0 0 8px; }
  body.presenting > *:not(.mt-overlay) { display: none !important; }
  .mt-overlay { position: static; overflow: visible; padding: 0; background: #fff; }
  .mt-overlay .mt-slide { display: block !important; }
  .mt-slide { break-after: page; }
  .mt-slide:last-child { break-after: auto; }
  .mt-memo textarea:placeholder-shown { display: none; }
  .chk { display: none; }
}

/* 모달·폼 */
.modal-backdrop { position: fixed; inset: 0; background: rgba(15, 18, 25, .45); display: grid; place-items: center; z-index: 50; padding: 16px; }
.modal { background: var(--surface); border-radius: 14px; width: min(520px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; box-shadow: 0 20px 50px rgba(0, 0, 0, .25); }
.modal.wide { width: min(720px, 100%); }
.modal header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px 8px; }
.modal h2 { font-size: 17px; }
.modal-body { padding: 8px 20px 20px; overflow-y: auto; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; }
.field { display: grid; gap: 5px; align-content: start; min-width: 0; }
.field.full { grid-column: 1 / -1; }
.field > label { font-size: 13px; font-weight: 600; color: var(--text-2); }
.field small { color: var(--text-3); font-size: 12px; }
.field input, .field select { width: 100%; }
.req { color: var(--danger); }
.form-actions { display: flex; gap: 8px; align-items: center; margin-top: 6px; }
.form-actions .spacer { flex: 1; }
.confirm-msg { margin: 4px 0 16px; white-space: pre-line; }
.chips-select { display: flex; flex-wrap: wrap; gap: 6px; max-height: 140px; overflow-y: auto; }
.chip-check input { position: absolute; opacity: 0; pointer-events: none; }
.chip-check span { display: inline-block; padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; cursor: pointer; user-select: none; }
.chip-check input:checked + span { background: var(--brand); border-color: var(--brand); color: #fff; }
.chip-check input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }
.slot-grid { display: grid; grid-template-columns: 44px repeat(5, 44px); gap: 4px; align-items: center; }
.slot-head { font-size: 12px; color: var(--text-3); text-align: center; font-weight: 600; }
.slot { position: relative; }
.slot input, .d-panel .slot input { position: absolute; opacity: 0; width: 1px; height: 1px; min-height: 0; }
.slot span { display: block; height: 30px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
.slot input:checked + span { background: var(--brand); border-color: var(--brand); }
.slot input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px; }

.toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); background: var(--text); color: var(--surface); padding: 10px 18px; border-radius: 10px; opacity: 0; transition: .2s; z-index: 70; font-weight: 600; max-width: calc(100vw - 32px); }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast.warn { background: var(--warn); color: #fff; }
.toast.error { background: var(--danger); color: #fff; }

/* 로그인 */
.center-screen { min-height: 100vh; display: grid; place-items: center; padding: 16px; color: var(--text-3); }
.login-card { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 32px; width: min(400px, 100%); box-shadow: var(--shadow); color: var(--text); }
.login-card h1 { font-size: 20px; margin: 8px 0 6px; }
.login-card p { color: var(--text-2); margin: 0 0 20px; }
.brand.big { padding: 0 0 12px; }
.login-form { display: grid; gap: 12px; }
.login-form label { display: grid; gap: 5px; font-size: 13px; font-weight: 600; color: var(--text-2); }
.login-form input { width: 100%; font-size: 15px; min-height: 42px; }
.login-error { margin: 0; color: var(--danger); font-size: 13px; }
.login-links { display: flex; justify-content: space-between; margin-top: 14px; font-size: 13px; }
.login-admin { width: 100%; margin-top: 10px; }
.help-body h3 { font-size: 14px; margin: 14px 0 6px; }
.help-body h3:first-child { margin-top: 0; }
.help-body ol { padding-left: 18px; margin: 0; display: grid; gap: 4px; }
.help-body p { margin: 0; color: var(--text-2); }

/* ---------- 반응형 ---------- */
@media (max-width: 1100px) {
  .tiles { grid-template-columns: repeat(2, 1fr); }
  .planner-top { grid-template-columns: 1fr; }
  .planner-days { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
}
@media (max-width: 860px) {
  .grid-2 { grid-template-columns: 1fr; }
  .grid-2 > .card { margin-bottom: 0; }
}
@media (max-width: 768px) {
  .layout { display: block; }
  .side { position: fixed; bottom: 0; top: auto; left: 0; right: 0; height: auto; width: auto; flex-direction: row; padding: 4px; border-right: 0; border-top: 1px solid var(--line); z-index: 40; }
  .brand, .side-foot { display: none; }
  .layout .side nav a.on::before { display: none; }
  .side nav { flex-direction: row; width: 100%; justify-content: space-around; }
  .side nav a { flex-direction: column; gap: 2px; padding: 6px 2px; font-size: 10.5px; flex: 1; text-align: center; }
  .side nav a[data-nav="#/products"], .side nav a[data-nav="#/settings"], .side nav a[data-nav="#/audit"], .side nav a[data-nav="#/activities"], .side nav a[data-nav="#/opp"], .side nav a[data-nav="#/tracker"], .side nav a[data-nav="#/pipeline"], .side nav a[data-nav="#/review"] { display: none; }
  main { padding: 16px 16px calc(90px + env(safe-area-inset-bottom)); }
  .layout .side { padding-bottom: calc(4px + env(safe-area-inset-bottom)); }
  .page-head { align-items: flex-start; }
  h1 { font-size: 20px; }
  .head-actions { width: 100%; }
  .filters input[type=search] { min-width: 0; max-width: none; width: 100%; }
  .form-grid { grid-template-columns: 1fr; }
  .act-item { grid-template-columns: 52px 1fr; }
  .act-owner { grid-column: 2; }
  .tile-val { font-size: 22px; }
  .kanban { grid-template-columns: repeat(8, 78vw); scroll-snap-type: x mandatory; }
  .kcol { scroll-snap-align: start; }
}

/* ---------- 인쇄 (주간 플래너 보고용) ---------- */
@media print {
  @page { size: A4 landscape; margin: 10mm; }
  :root { --bg: #fff; --shadow: none; }
  body { background: #fff; font-size: 11px; }
  .side, .demo-bar, .no-print, .chart-tip, .toast { display: none !important; }
  main { padding: 0; max-width: none; }
  .card, .day-col { break-inside: avoid; box-shadow: none; }
  .planner-top { grid-template-columns: repeat(3, 1fr); }
  .planner-days { grid-template-columns: repeat(var(--cols), 1fr); }
  textarea { border: 0 !important; background: none !important; resize: none; overflow: hidden; }
  .day-col { min-height: 140px; }
}

/* 공지·이용 기간 알림, 이용 정보 */
.notice-bar { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; padding: 12px 16px; margin: 0 0 14px; border-radius: var(--radius); background: var(--brand-soft); color: var(--text); border: 1px solid var(--line); }
.notice-bar b { color: var(--brand-ink); flex: none; }
.notice-bar span { flex: 1 1 240px; white-space: pre-wrap; }
.notice-bar small { color: var(--text-3); }
.notice-bar.warn { background: var(--warn-soft); }
.notice-bar.warn b { color: var(--warn); }
.lic-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin-bottom: 10px; }
.lic-grid div { display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); }
.lic-grid span { font-size: 12px; color: var(--text-3); }
.card textarea[data-notice] { width: 100%; }

/* 변경 기록 (Audit Trail) */
.audit-filters { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: end; padding: 14px 16px; }
.audit-filters label { display: grid; gap: 4px; font-size: 12.5px; color: var(--text-2); }
.audit-filters label.grow { flex: 1 1 200px; }
.audit-filters input, .audit-filters select { min-width: 130px; }
.audit-sum { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 4px 2px 10px; font-size: 13.5px; }
.pill-s { display: inline-block; font-size: 12px; font-weight: 600; padding: 2px 9px; border-radius: 999px; white-space: nowrap; background: var(--surface-2); color: var(--text-2); }
.pill-s.good { background: color-mix(in srgb, var(--good) 14%, transparent); color: var(--good); }
.pill-s.info { background: var(--brand-soft); color: var(--brand-ink); }
.pill-s.danger { background: var(--danger-soft); color: var(--danger); }
.pill-s.warn { background: var(--warn-soft); color: var(--warn); }
.audit-table td { vertical-align: top; }
.audit-ch { font-size: 13px; min-width: 260px; }
.audit-ch .ch + .ch { margin-top: 3px; }
.audit-ch b { color: var(--text-2); font-weight: 600; margin-right: 4px; }
.audit-ch s { color: var(--text-3); }
@media (max-width: 767px) { .audit-filters input, .audit-filters select { min-width: 0; width: 100%; } .audit-filters label { flex: 1 1 45%; } }

/* 일정 끌어놓기 */
.slot-zone { border-radius: 8px; min-height: 48px; transition: background .12s; }
.slot-zone + .slot-zone { border-top: 1px dashed var(--line); }
.slot-zone .zone-lbl { display: block; font-size: 11px; font-weight: 600; color: var(--text-3); padding: 5px 8px 0; }
.slot-zone ul { padding-top: 4px; min-height: 30px; }
.slot-zone .slot-tag { display: none; }
.can-drag { cursor: grab; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.sd-src { opacity: .35; }
.sd-ghost { position: fixed; z-index: 300; pointer-events: none; list-style: none; margin: 0; transform: translate(-50%, -60%) rotate(-2deg); box-shadow: 0 8px 20px rgba(0, 0, 0, .22); opacity: .95; }
.sd-over { background: var(--brand-soft) !important; outline: 2px dashed var(--brand); outline-offset: -2px; }
body.sd-dragging, body.sd-dragging * { cursor: grabbing !important; }
@media print { .slot-zone .zone-lbl { padding-top: 2px; } .slot-zone { min-height: 0; } }

/* 메신저 공유 */
.share-text { width: 100%; font-family: inherit; font-size: 13.5px; line-height: 1.55; white-space: pre-wrap; resize: vertical; margin: 6px 0 10px; }

/* VisitSales 이야기 */
.story-teaser { margin: 10px 0 0; padding: 14px 0 0; border-top: 1px solid rgba(255, 255, 255, .22); display: grid; gap: 10px; }
.story-teaser blockquote { margin: 0; font-size: 14.5px; line-height: 1.65; color: #fff; font-weight: 600; }
.story-teaser blockquote::before { content: "“"; color: #ff8a70; font-size: 22px; line-height: 0; margin-right: 3px; vertical-align: -4px; }
.story-link { justify-self: start; display: inline-flex; gap: 6px; align-items: center; padding: 7px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .08); color: #fff; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.story-link:hover { background: rgba(255, 255, 255, .18); }
.story { max-width: 680px; margin: 0 auto; font-size: 15px; line-height: 1.8; color: var(--text); }
.story-mark { margin: 4px 0 6px; }
.story-head { margin: 6px 0 14px; font-size: 26px; line-height: 1.35; font-weight: 800; color: var(--heading); letter-spacing: -.01em; }
.story p { margin: 0 0 14px; }
.story p b { color: var(--brand-ink); }
.story-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0; }
.story-cols section { background: var(--brand-soft); border-radius: 12px; padding: 14px 16px; }
.story-cols h4 { margin: 0 0 6px; font-size: 14.5px; color: var(--brand-ink); }
.story-cols ul { margin: 0; padding-left: 18px; font-size: 14px; line-height: 1.65; }
.story-cols li + li { margin-top: 4px; }
.story-closing { font-weight: 600; }
.story-sign { text-align: right; color: var(--text-2); font-size: 14px; }
@media (max-width: 767px) {
  .story-teaser { border-top: 0; padding-top: 0; margin-top: 2px; }
  .story-teaser blockquote { display: none; }
  .story-cols { grid-template-columns: 1fr; }
  .story-head { font-size: 22px; }
}

/* 사이드바: 메뉴가 길어도 아래(사용 안내·이야기·로그아웃)는 항상 보이게 — 메뉴 목록만 스크롤 */
@media (min-width: 769px) {
  .side { height: 100vh; height: 100dvh; }
  .side nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
  .side-foot { flex: none; grid-template-columns: auto auto; justify-content: space-between; align-items: center; row-gap: 4px; }
  .side-foot .me, .side-foot [data-logout] { grid-column: 1 / -1; }
  .side-foot [data-logout] { justify-self: start; }
}
@media (min-width: 769px) and (max-height: 820px) {
  .side { padding-top: 10px; padding-bottom: 8px; }
  .layout .side .brand { padding-bottom: 10px; gap: 6px; }
  .side nav a { padding-top: 6px; padding-bottom: 6px; }
  .side-foot { padding: 8px 10px 4px; }
}

/* 체험 화면 버튼 줄 · 제품소개서 보기 */
.auth-links { display: flex; flex-wrap: wrap; gap: 8px; }
.modal.pitch-modal { width: min(1100px, calc(100vw - 32px)); max-width: none; }
.pitch-stage { background: #0f1424; border-radius: 10px; overflow: hidden; }
.pitch-stage img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; cursor: pointer; user-select: none; }
.pitch-nav { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.pitch-pos { min-width: 56px; text-align: center; font-weight: 600; color: var(--text-2); }
.pitch-nav .spacer { flex: 1; }

/* VisitSales 이야기 — 서명 */
.story-signoff { display: grid; justify-items: end; gap: 2px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.story-signoff .so-label { font-size: 13px; color: var(--text-3); }
.story-signoff .so-line { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 4px 14px; }
.story-signoff .so-org { white-space: nowrap; font-size: 16px; font-weight: 700; color: var(--heading); letter-spacing: .02em; }
.story-signoff .so-sign { display: block; flex: none; width: 190px; height: auto; overflow: visible; color: #111; }
.story-signoff .so-sign path { fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .story-signoff .so-sign { color: #f1f3f8; } }
:root[data-theme="dark"] .story-signoff .so-sign { color: #f1f3f8; }

/* ---------- 매출분석 (#/sales) ---------- */
.sales-kpis { grid-template-columns: repeat(4, 1fr); }
.sales-kpis > .card { margin: 0; }
.sales-filters .check { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--text-2); }
.sc-range-row { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.chip-filter { border: 1px solid var(--brand); background: var(--brand-soft); color: var(--brand-ink); border-radius: 999px; padding: 4px 10px; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.sales-table td.up { color: var(--rise); }
.sales-table td.down { color: var(--fall); }
.sales-table tbody tr[tabindex] { cursor: pointer; }
.sales-tabs { border-bottom: 0; margin-bottom: 0; flex-wrap: wrap; }
.sales-collect .sc-list { list-style: none; padding: 0; margin: 0 0 12px; display: grid; gap: 8px; }
.sales-collect .sc-list li { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; }
.sales-collect .sc-st { margin-left: auto; font-size: 13px; }
.sales-collect .good { color: var(--good); font-weight: 600; }
.sales-collect .bad { color: var(--danger); font-weight: 600; }
.sales-collect .form-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sales-collect .form-actions .spacer { flex: 1; }
.sc-range summary { cursor: pointer; color: var(--text-2); font-size: 13px; }
.sc-range .sc-range-row { margin-top: 8px; }
@media (max-width: 768px) {
  .sales-kpis { grid-template-columns: repeat(2, 1fr); }
  .sales-filters .seg { flex-wrap: wrap; }
}
.sales-kpis .kpi:last-child { grid-column: auto; }
/* 매출분석 막대: 부서·품목 이름이 길어서 이름 칸을 넓히고 금액이 줄바꿈되지 않게 */
.sales-hb .hb li { grid-template-columns: minmax(0, 46%) 1fr 64px; }
.sales-hb .hb-v { white-space: nowrap; }
.sales-collect .sc-list { max-height: 55vh; overflow-y: auto; }
/* 매출분석 v2: 요약·분석표 */
.sales-views { margin-bottom: 10px; }
.pivot-ctl label { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--text-2); }
.pivot-ctl .spacer, .sales-filters .spacer { flex: 1; }
.table.pivot td, .table.pivot th { white-space: nowrap; }
.table.pivot .pv-label { white-space: normal; min-width: 220px; max-width: 360px; }
.table.pivot tr.lv0 td { font-weight: 600; }
.table.pivot tr.lv1 td { color: var(--text-2); }
.table.pivot .pv-ind { color: var(--text-3); margin: 0 6px 0 8px; }
.table.pivot .pv-tot { font-weight: 700; }
.table.pivot tfoot td { font-weight: 700; border-top: 2px solid var(--line); background: var(--surface-2); }
.table td.up, .hb small.up, .fc-row em.up, .mv-d.up { color: var(--rise); }
.table td.down, .hb small.down, .fc-row em.down, .mv-d.down { color: var(--fall); }
.sales-kpis .kpi em { display: block; }
.dbars { display: flex; align-items: flex-end; gap: 6px; height: var(--h); padding-top: 18px; }
.db-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; }
.db-pair { display: flex; align-items: flex-end; gap: 2px; width: 100%; justify-content: center; }
.db-pair i { display: block; width: 42%; max-width: 18px; border-radius: 3px 3px 0 0; }
.db-prev { background: color-mix(in srgb, var(--chart) 28%, transparent); }
.db-cur { background: var(--chart); }
.db-col.now .db-cur { background: color-mix(in srgb, var(--chart) 60%, transparent); }
.db-val { font-size: 11px; color: var(--text-2); position: absolute; top: -2px; white-space: nowrap; }
.db-lab { font-size: 11px; color: var(--text-3); margin-top: 4px; }
.movers { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.movers li { display: grid; grid-template-columns: 1fr auto 64px; gap: 8px; font-size: 13px; cursor: pointer; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.movers .mv-k { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.movers .mv-d { font-weight: 700; font-variant-numeric: tabular-nums; }
.dash-grid.tight { gap: 16px; margin: 0; }
.focus-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.focus-card { cursor: pointer; display: grid; gap: 2px; margin: 0; }
.focus-card .fc-name { font-weight: 700; }
.focus-card b { font-size: 22px; }
.focus-card .fc-row { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12px; color: var(--text-3); }
.sales-hb li { cursor: pointer; }
.sales-hb .hb li, ul.hb.sales-hb li { grid-template-columns: minmax(0, 40%) 1fr 104px; }
.items-ed input:not([type=checkbox]) { width: 100%; min-width: 120px; }
.items-ed tr.chg td { background: var(--warn-soft); }
.items-ed .table-wrap { max-height: 60vh; overflow: auto; }

/* 케어캠프 납품 (매일 납품처·부서·품목) */
.dv-ctl .seg { flex-wrap: wrap; }
.dv-table .dv-row { cursor: pointer; }
.dv-table .dv-row:hover td { background: var(--hover, rgba(127,127,127,.08)); }
.dv-arrow { display: inline-block; width: 1em; color: var(--muted, #888); }

/* 메뉴 대분류 › 소분류 (사이드바는 접고 펼침, 휴대폰 아래 메뉴는 예전처럼 납작하게) */
.nav-gh { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 9px 10px; margin-top: 4px; border: 0; border-radius: 8px; background: none; color: var(--text-2); font: inherit; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; cursor: pointer; }
.nav-gh:hover { background: var(--surface-2); color: var(--text); }
.nav-gh i { font-style: normal; font-size: 11px; transition: transform .15s; }
.nav-group.open .nav-gh i { transform: rotate(90deg); }
.nav-sub { display: none; flex-direction: column; gap: 2px; }
.nav-group.open .nav-sub { display: flex; }
.side .nav-sub a { padding-left: 18px; }
.m-sheet-panel .nav-gh { pointer-events: none; padding: 10px 12px 2px; }
.m-sheet-panel .nav-gh i { display: none; }
.m-sheet-panel .nav-sub { display: grid; }
@media (max-width: 768px) {
  .side .nav-group, .side .nav-group .nav-sub { display: contents; }
  .side .nav-gh { display: none; }
  .side .nav-sub a { padding-left: 2px; }
  .side nav a[data-nav="#/sales"], .side nav a[data-nav="#/salesmeeting"] { display: none; }
}

/* 매출분석 › 변동 분석 */
.tv-ctl label { display: inline-flex; align-items: center; gap: 6px; }
.tv-svg { width: 100%; height: auto; display: block; overflow: visible; }
.tv-svg .tv-val { font-size: 11px; fill: var(--text-2); font-weight: 600; }
.tv-svg .tv-lab { font-size: 10.5px; fill: var(--text-3); }
.tv-svg .tv-ch { font-size: 10.5px; font-weight: 700; }
.tv-svg .tv-ch.up { fill: var(--rise); } .tv-svg .tv-ch.down { fill: var(--fall); }
.tv-svg .tv-grid { stroke: var(--line); stroke-dasharray: 3 3; }
.tv-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; list-style: none; padding: 8px 0 0; margin: 0; font-size: 12.5px; }
.tv-legend li { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; color: var(--text-2); }
.tv-legend li:hover { color: var(--text); }
.tv-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.tv-div { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.tv-div li { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto auto; gap: 8px; align-items: center; font-size: 13px; cursor: pointer; padding: 3px 4px; border-radius: 6px; }
.tv-div li:hover { background: var(--surface-2); }
.tv-div .dv-k { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-div .dv-bar { height: 10px; background: var(--surface-2); border-radius: 5px; overflow: hidden; }
.tv-div .dv-bar i { display: block; height: 100%; border-radius: 5px; }
.tv-div .dv-bar i.up { background: var(--rise); } .tv-div .dv-bar i.down { background: var(--fall); }
.tv-div .dv-d { font-weight: 700; font-variant-numeric: tabular-nums; } .tv-div .dv-d.up { color: var(--rise); } .tv-div .dv-d.down { color: var(--fall); }
.tv-table tbody tr { cursor: pointer; }
.tv-table .tv-cell small { margin-left: 3px; font-size: 9.5px; } .tv-table .tv-cell small.up { color: var(--rise); } .tv-table .tv-cell small.down { color: var(--fall); }
.tv-spark { width: 90px; height: 24px; display: block; }
.tv-cv { display: inline-block; min-width: 44px; padding: 1px 6px; border-radius: 6px; background: linear-gradient(90deg, color-mix(in srgb, var(--warn) 45%, transparent) var(--w), transparent var(--w)); font-variant-numeric: tabular-nums; }

/* 매출분석 › 요약 › 변동성 한눈에 */
.vol-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1100px) { .vol-grid { grid-template-columns: 1fr; } }
.vol-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.vol-list li { display: grid; grid-template-columns: minmax(0, 1fr) 90px auto 64px; gap: 8px; align-items: center; font-size: 13px; padding: 4px; border-radius: 6px; cursor: pointer; }
.vol-list li:hover { background: var(--surface-2); }
.vol-list .vl-k { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vol-list .vl-v { font-variant-numeric: tabular-nums; color: var(--text-2); }
.vol-list .vl-p { font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.vol-list .vl-p.up { color: var(--rise); } .vol-list .vl-p.down { color: var(--fall); }
.vol-total { font-size: 13px; color: var(--text-2); margin-right: 8px; } .vol-total b { color: var(--text); }

/* 세일즈 미팅 */
.mt-sec { font-size: 15px; margin: 18px 0 8px; color: var(--text-2); }
.mt-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 1200px) { .mt-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .mt-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mt-kpis .kpi b.up { color: var(--rise); } .mt-kpis .kpi b.down { color: var(--fall); }
.mt-table .mt-tot { font-weight: 700; background: color-mix(in srgb, var(--warn) 12%, transparent); }
.mt-tag { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 10px; }
.mt-tag.up { background: color-mix(in srgb, var(--rise) 15%, transparent); color: var(--rise); }
.mt-tag.down { background: color-mix(in srgb, var(--fall) 15%, transparent); color: var(--fall); }
.mt-tag.focus { background: var(--brand-soft); color: var(--brand-ink); }
.mt-act { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 2fr; gap: 12px; align-items: stretch; }
@media (max-width: 900px) { .mt-act { grid-template-columns: 1fr 1fr; } }
.mt-stat { background: var(--surface-2); border-radius: 10px; padding: 10px 12px; display: grid; gap: 2px; }
.mt-stat span { font-size: 12.5px; color: var(--text-2); } .mt-stat b { font-size: 22px; } .mt-stat small { font-size: 12px; margin-left: 2px; } .mt-stat em { font-style: normal; font-size: 12px; }
.mt-pipe { display: flex; flex-wrap: wrap; gap: 6px; align-content: center; }
.mt-stage { background: var(--brand-soft); color: var(--brand-ink); border-radius: 8px; padding: 4px 10px; font-size: 13px; }
.mt-warn { margin: 10px 0 0; font-size: 13px; color: var(--warn); }
.mt-plan input, .mt-plan textarea, .mt-note { width: 100%; box-sizing: border-box; font: inherit; font-size: 13px; }
.mt-plan input.num { text-align: right; }
.mt-plan tr.mt-need td { background: color-mix(in srgb, var(--danger) 8%, transparent); }
.mt-done { font-size: 13px; padding: 6px 10px; border-radius: 8px; background: color-mix(in srgb, var(--warn) 18%, transparent); color: var(--text); align-self: center; }
.mt-done.ok { background: color-mix(in srgb, var(--good) 18%, transparent); }
.mt-lbl { display: grid; gap: 6px; font-weight: 600; font-size: 13px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 900px) { .grid-3 { grid-template-columns: 1fr; } }
.mt-assign .tabs { margin-bottom: 10px; }

/* 세일즈 미팅 › 담당자별 현황 · 내 담당 고르기 */
.rep-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.rep-card { text-align: left; font: inherit; color: inherit; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; display: grid; gap: 6px; cursor: pointer; }
.rep-card:hover { border-color: var(--brand); }
.rep-card.rep-none { opacity: .8; border-style: dashed; }
.rep-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.rep-top b { font-size: 15px; }
.rep-top .mt-done { padding: 2px 8px; font-size: 11.5px; }
.rep-num { font-size: 22px; font-weight: 800; } .rep-num small { font-size: 13px; margin-left: 2px; } .rep-num em { font-style: normal; font-size: 13px; margin-left: 6px; }
.rep-num em.up, .rep-meta .up { color: var(--rise); } .rep-num em.down, .rep-meta .down { color: var(--fall); }
.rep-bar { height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; } .rep-bar i { display: block; height: 100%; border-radius: 3px; }
.rep-meta { font-size: 12.5px; }
.rep-card .tv-spark { width: 100%; height: 26px; }
.mine-list { display: grid; gap: 6px; max-height: 60vh; overflow: auto; padding-right: 4px; }
.mine-h { border: 1px solid var(--line); border-radius: 10px; padding: 6px 10px; }
.mine-h summary { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; }
.mine-h summary::-webkit-details-marker { display: none; }
.mine-h summary small { font-size: 12px; } .mine-n { margin-left: auto; color: var(--brand-ink); font-weight: 700; }
.mine-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; padding: 8px 0 4px 24px; }
.mine-cell { display: grid; grid-template-columns: auto 1fr; column-gap: 6px; align-items: center; padding: 6px 8px; border-radius: 8px; background: var(--surface-2); cursor: pointer; font-size: 13px; }
.mine-cell small { grid-column: 2; color: var(--text-3); font-size: 11.5px; }
.mine-cell.on { background: var(--brand-soft); color: var(--brand-ink); }
.mine-cell.locked { opacity: .5; cursor: not-allowed; }
.mine-h.single { display: flex; align-items: center; gap: 10px; }
.mine-h.single.on { background: var(--brand-soft); }
.mine-h.single.locked { opacity: .5; }
.mine-row { display: flex; align-items: center; gap: 8px; flex: 1; cursor: pointer; }
.mine-row small { font-size: 12px; }
.mine-h .link-btn { margin-left: auto; font-size: 12px; white-space: nowrap; }
/* 케어캠프 납품 목록 — 정렬 제목, 묶음 소계 */
.dv-list th.dv-sort { cursor: pointer; user-select: none; white-space: nowrap; }
.dv-list th.dv-sort:hover { color: var(--brand); }
.dv-list tr.dv-sub td { background: color-mix(in srgb, var(--brand) 8%, transparent); font-weight: 700; border-bottom: 2px solid var(--line, #ddd); }
.dv-more { display: flex; gap: 8px; align-items: center; justify-content: center; padding: 12px 0 4px; flex-wrap: wrap; }
.sales-collect .sc-login { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--warn, #f0a24a) 14%, transparent); font-size: 13px; }
.sales-collect .sc-login-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sales-collect .sc-login.ok { background: color-mix(in srgb, var(--text-3, #888) 8%, transparent); }
/* 품목 분류: 급여 중분류 */
.items-ed .items-filters { margin: 8px 0; }
.items-ed .items-table td .small { font-size: 11px; margin-top: 2px; }
.items-ed .ins-cell { max-width: 320px; }
.items-ed tr[data-st="need"] input[data-k="group"]::placeholder { color: var(--danger, #c62828); }

/* 외부 접속자(제조사) 화면 */
.partner-note { margin-bottom: 14px; }
.partner-note p { margin: 0; line-height: 1.6; }
.side .nav-sub a small { margin-left: auto; font-size: 11px; }

/* 매출 취합 창: 자동 취합 켜기 */
.sc-auto { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-2); width: 100%; margin-bottom: 6px; }

/* 스마트 입력 — 자동완성 목록 (모달 위에 뜨도록 body 에 fixed) */
.ac-box { position: fixed; z-index: 70; max-height: 300px; overflow-y: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 12px 30px rgba(0, 0, 0, .18); padding: 4px; }
.ac-row { display: flex; flex-direction: column; gap: 1px; padding: 8px 10px; border-radius: 7px; cursor: pointer; }
.ac-row small { color: var(--text-2); font-size: 12px; }
.ac-row.on, .ac-row:hover { background: var(--brand-soft); }
.ac-row.ac-act { color: var(--brand-ink); font-weight: 700; border-top: 1px dashed var(--line); border-radius: 0 0 7px 7px; }
.hosp-ac { width: 100%; }
/* 한 번에 적기 */
.smart-box { display: grid; gap: 6px; padding: 10px 12px; border: 1.5px dashed var(--brand); border-radius: 12px; background: var(--brand-soft); margin-bottom: 12px; }
.smart-box > label { display: grid; gap: 4px; font-weight: 700; color: var(--brand-ink); }
.smart-box > label small { font-weight: 400; color: var(--text-2); }
.smart-box textarea { width: 100%; resize: vertical; }
.smart-act { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.smart-out { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; flex: 1; min-width: 0; }
.sm-chip { display: inline-flex; gap: 4px; align-items: baseline; padding: 2px 8px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); font-size: 12.5px; }
.sm-chip small { color: var(--text-2); font-size: 11px; }
.sm-chip.ok { border-color: var(--good); }
.sm-chip.new { border-color: var(--warn); }
.sm-chip.warn { border-color: var(--danger); color: var(--danger); }
.sm-note { flex-basis: 100%; margin: 2px 0 0; font-size: 12.5px; color: var(--text-2); }
.d-row3 { grid-template-columns: 1fr 2fr 1fr; }
@media (max-width: 640px) { .d-row3 { grid-template-columns: 1fr; } }