/* ==========================================================================
   레이아웃 v2 (상단 탭) — v64
   디자인 번들 "ES 재고관리 — 전체 시스템"의 본 시스템 레이아웃.
   html.v2 가 켜진 동안에만 적용 (내부 팀 화면 전용 · 고객사/에이전시는 기존 유지)
   ========================================================================== */
html.v2 body { background: #eef0e6; }
html.v2 #app { flex-direction: column; }
html.v2 #sidebar { display: none !important; }
html.v2 #main { width: 100%; }

/* ---------- 상단 헤더 (54px) ---------- */
#v2hdr { display: none; }
html.v2 #v2hdr {
  display: block; position: sticky; top: 0; z-index: 90;
  background: #fff; border-bottom: 1px solid #dcd8c0;
}
#v2hdr .v2bar { display: flex; align-items: center; gap: 10px; padding: 0 14px; height: 54px; }
#v2hdr .v2brand {
  display: flex; align-items: center; gap: 8px; flex: none; padding: 6px 10px 6px 8px;
  border: 1px solid transparent; border-radius: 9px; background: none; font: inherit;
  cursor: pointer; color: #1c2430;
}
#v2hdr .v2brand:hover { background: #f4f3e8; border-color: #dcd8c0; }
#v2hdr .v2brand i { width: 9px; height: 9px; border-radius: 99px; background: #5a6636; display: inline-block; }
#v2hdr .v2brand b { font-size: 15px; letter-spacing:-.3px; white-space: nowrap; }
#v2hdr nav.v2tabs {
  display: flex; align-items: stretch; gap: 2px; height: 54px; flex: 1 1 auto; min-width: 0;
  overflow-x: auto; overflow-y: hidden; scrollbar-width: none;
}
#v2hdr nav.v2tabs::-webkit-scrollbar { height: 0; }
#v2hdr .v2tab {
  display: flex; align-items: center; gap: 7px; height: 54px; padding: 0 12px; border: 0;
  background: none; font: inherit; font-size: 13.5px; font-weight: 600; white-space: nowrap;
  cursor: pointer; position: relative; color: #4f5644; box-shadow: inset 0 -2px 0 0 transparent;
}
#v2hdr .v2tab:hover { color: #1c2430; background: #f6f5ec; }
#v2hdr .v2tab.on { color: #4d5434; box-shadow: inset 0 -2px 0 0 #5a6636; }
#v2hdr .v2tab .dot { width: 6px; height: 6px; border-radius: 99px; background: #a8442a; display: inline-block; }
#v2hdr .v2right { display: flex; align-items: center; gap: 8px; flex: none; margin-left: auto; }
#v2hdr .v2search {
  display: flex; align-items: center; gap: 8px; flex: 0 1 240px; min-width: 36px;
  padding: 7px 10px; border: 1.5px solid #dcd8c0; border-radius: 9px; background: #f6f5ec;
  color: #6b7160; font: inherit; font-size: 12.5px; cursor: pointer; text-align: left; overflow: hidden;
}
#v2hdr .v2search:hover { border-color: #c9c5a1; background: #fff; }
#v2hdr .v2search .hint { flex: 1 1 0; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#v2hdr .v2search .kbd {
  flex: none; font-size: 11.5px; font-weight: 700; color: #98a08a; border: 1px solid #dcd8c0;
  border-radius: 5px; padding: 1px 5px; background: #fff;
}
#v2hdr .v2ib {
  position: relative; display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px;
  border: 1px solid #dcd8c0; border-radius: 9px; background: #fff; font: inherit; font-size: 12.5px;
  font-weight: 700; color: #1c2430; cursor: pointer; white-space: nowrap;
}
#v2hdr .v2ib:hover { background: #f6f5ec; border-color: #c9c5a1; }
#v2hdr .v2ib .grn { width: 7px; height: 7px; border-radius: 99px; background: #4d7c2f; }
#v2hdr .v2ib .badge {
  position: absolute; top: -6px; right: -6px; background: #a8442a; color: #fff;
  font-size: 10.5px; font-weight: 800; border-radius: 99px; padding: 1px 5px;
}
#v2hdr .v2me {
  display: flex; align-items: center; gap: 7px; flex: none; padding: 3px 9px 3px 3px;
  border: 1px solid #dcd8c0; border-radius: 99px; background: #fff; font: inherit;
  max-width: 130px; overflow: hidden; cursor: pointer;
}
#v2hdr .v2me:hover { background: #f6f5ec; }
#v2hdr .v2me .av {
  width: 26px; height: 26px; border-radius: 99px; background: #ecead7; color: #4d5434;
  font-size: 12.5px; font-weight: 800; display: flex; align-items: center; justify-content: center; flex: none;
}
#v2hdr .v2me b { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- 메가 메뉴 ---------- */
#v2mega {
  position: absolute; left: 0; right: 0; top: 100%; background: #fff;
  border-bottom: 1px solid #dcd8c0; box-shadow: 0 18px 40px rgba(16, 24, 40, .13); z-index: 89;
  animation: v2in .13s ease-out;
}
@keyframes v2in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
#v2mega .mg { display: grid; grid-template-columns: minmax(0, 1fr) 270px; }
#v2mega .mgl { padding: 16px 20px 20px; }
#v2mega .mgh {
  display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 800;
  color: #6b7160;  margin-bottom: 11px;
}
#v2mega .mgh .hint { font-weight: 600; color: #98a08a; }
#v2mega .mgi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 10px; }
#v2mega .mit {
  display: flex; gap: 10px; align-items: flex-start; text-align: left; width: 100%;
  padding: 9px 11px; border: 1px solid transparent; border-radius: 9px; background: none;
  font: inherit; cursor: pointer; color: #1c2430;
}
#v2mega .mit:hover { background: #f4f3e8; border-color: #dcd8c0; }
#v2mega .mit .ico { font-size: 15px; line-height: 1.2; margin-top: 1px; }
#v2mega .mit b { font-size: 13.5px; letter-spacing:-.2px; }
#v2mega .mit .desc { display: block; font-size: 11.5px; color: #6b7160; margin-top: 2px; line-height: 1.45; }
#v2mega .mit .bdg { background: #a8442a; color: #fff; font-size: 10.5px; font-weight: 800; border-radius: 99px; padding: 0 6px; }
#v2mega .mit .adm { background: #eceade; color: #4f5644; font-size: 10.5px; font-weight: 700; border-radius: 4px; padding: 1px 4px; }
#v2mega .mit .soon { background: #fff4e6; color: #8f6708; font-size: 10.5px; font-weight: 800; border-radius: 4px; padding: 1px 5px; }
#v2mega .mgs { margin-top: 11px; padding-top: 11px; border-top: 1px solid #e8e5d1; }
#v2mega .mgs .t { font-size: 11.5px; font-weight: 800; color: #98a08a; margin-right: 7px; }
#v2mega .mgs .t2 { font-size: 11.5px; color: #c6c8b4; }
#v2mega .mgs .chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
#v2mega .mgs .chips button {
  display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px; border: 1px solid #dcd8c0;
  border-radius: 9px; background: #fff; font: inherit; font-size: 12.5px; font-weight: 600;
  color: #3a4030; cursor: pointer; white-space: nowrap;
}
#v2mega .mgs .chips button:hover { border-color: #5a6636; color: #4d5434; background: #f5f4e7; }
#v2mega .mgr { padding: 16px 20px 20px; background: #f7f7ec; border-left: 1px solid #e8e5d1; }
#v2mega .mgr .t { font-size: 12.5px; font-weight: 800; color: #6b7160;  margin-bottom: 9px; }
#v2mega .mgr .qk { display: flex; flex-direction: column; gap: 6px; }
#v2mega .mgr .qk button {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid #dcd8c0;
  border-radius: 8px; background: #fff; font: inherit; font-size: 12.5px; font-weight: 600;
  cursor: pointer; text-align: left; color: #1c2430;
}
#v2mega .mgr .qk button:hover { border-color: #5a6636; color: #4d5434; background: #f5f4e7; }
#v2mega .mgr .note { margin-top: 14px; font-size: 11.5px; color: #98a08a; line-height: 1.6; }

/* ---------- 가입자 목록 팝오버 ---------- */
#v2roster {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 95; width: 320px; max-height: 430px;
  display: flex; flex-direction: column; background: #fff; border: 1px solid #dcd8c0;
  border-radius: 13px; box-shadow: 0 20px 48px rgba(16, 24, 40, .2); overflow: hidden;
  animation: v2in .12s ease-out; text-align: left; font-weight: 400;
}
#v2roster .hd { flex: none; padding: 11px 13px; border-bottom: 1px solid #e8e5d1; }
#v2roster .hd input {
  width: 100%; margin-top: 9px; padding: 7px 10px; border: 1.5px solid #dcd8c0; border-radius: 8px;
  outline: none; font: inherit; font-size: 12.5px; background: #fff;
}
#v2roster .ls { flex: 1; min-height: 0; overflow-y: auto; padding: 6px; }
#v2roster .mem { display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 10px; min-width: 0; }
#v2roster .mem:hover { background: #f6f5ec; }
#v2roster .mem .avw { position: relative; flex: none; }
#v2roster .mem .av {
  width: 30px; height: 30px; border-radius: 10px; font-size: 12.5px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
#v2roster .mem .st { position: absolute; right: -2px; bottom: -2px; width: 10px; height: 10px; border-radius: 99px; border: 2px solid #fff; }
#v2roster .mem .nm { flex: 1; min-width: 0; }
#v2roster .mem .nm b { font-size: 12.5px; }
#v2roster .mem .nm .me { font-size: 10.5px; font-weight: 800; border-radius: 4px; padding: 1px 5px; background: #ecead7; color: #4d5434; margin-left: 5px; }
#v2roster .mem .nm .sub { display: block; font-size: 11.5px; color: #98a08a; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#v2roster .mem .act { flex: none; display: flex; gap: 4px; }
#v2roster .mem .act button {
  width: 28px; height: 28px; border: 1px solid #dcd8c0; border-radius: 8px; background: #fff;
  font: inherit; font-size: 12.5px; cursor: pointer; padding: 0;
}
#v2roster .mem .act button:hover { border-color: #5a6636; background: #f5f4e7; }
#v2roster .ft {
  flex: none; display: flex; align-items: center; gap: 8px; padding: 9px 13px;
  border-top: 1px solid #e8e5d1; background: #fbfaf2; font-size: 10.5px; color: #98a08a;
}

/* ---------- 페이지 헤더 밴드 (#topbar 재구성) ---------- */
html.v2 #topbar {
  top: 54px; z-index: 40; background: #fff; border-bottom: 1px solid #dcd8c0;
  padding: 9px 18px 10px; box-shadow: none; display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
html.v2 #topbar #menuBtn { display: none; }
html.v2 #v2crumb { display: block; font-size: 11.5px; color: #98a08a; font-weight: 600; margin-bottom: 2px; }
html.v2 #v2crumb b { color: #6b7160; font-weight: 600; }
html.v2 #topbar h1 { font-size: 17px; font-weight: 800; letter-spacing:-.3px; margin: 0; }
#v2crumb { display: none; }
html.v2 #gsearch { display: none; } /* 전역검색은 ⌘K 팔레트로 통합 */
html.v2 #content { max-width: none; padding: 16px 18px 90px; margin: 0; }

/* ---------- 명령 팔레트 (⌘K) ---------- */
#v2pal { display: none; position: fixed; inset: 0; z-index: 300; background: rgba(16, 24, 40, .4); padding: 9vh 16px 0; }
#v2pal.show { display: block; }
#v2pal .box {
  width: 620px; max-width: 100%; margin: 0 auto; background: #fff; border-radius: 14px;
  box-shadow: 0 30px 70px rgba(16, 24, 40, .35); overflow: hidden; display: flex; flex-direction: column;
  max-height: 66vh;
}
#v2pal input {
  width: 100%; border: 0; outline: none; padding: 15px 17px; font: inherit; font-size: 15px;
  border-bottom: 1px solid #e8e5d1; background: #fff; color: #1c2430;
}
#v2pal .rs { flex: 1; min-height: 0; overflow-y: auto; padding: 7px; }
#v2pal .sec { font-size: 10.5px; font-weight: 800; color: #98a08a;  padding: 8px 10px 4px; }
#v2pal .it {
  display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 9px 11px;
  border: 0; border-radius: 9px; background: none; font: inherit; font-size: 13.5px; cursor: pointer; color: #1c2430;
}
#v2pal .it:hover, #v2pal .it.sel { background: #f3f2e6; }
#v2pal .it .sub { font-size: 11.5px; color: #98a08a; margin-left: auto; white-space: nowrap; }
#v2pal .ft { padding: 8px 14px; border-top: 1px solid #e8e5d1; background: #fbfaf2; font-size: 11.5px; color: #98a08a; display: flex; gap: 14px; }

/* ---------- 채팅 FAB ---------- */
#v2fab { display: none; }
html.v2 #v2fab {
  display: flex; position: fixed; right: 20px; bottom: 20px; z-index: 80;
  width: 56px; height: 56px; border-radius: 99px; border: 0; background: #5a6636; color: #fff;
  font-size: 22px; align-items: center; justify-content: center; cursor: pointer;
  box-shadow: 0 10px 26px rgba(90,102,54, .45);
  transition: transform .12s ease, background .12s ease;
}
html.v2 #v2fab:hover { background: #4d5434; transform: translateY(-2px); }
html.v2 #v2fab .badge {
  position: absolute; top: -4px; right: -4px; background: #a8442a; color: #fff;
  font-size: 11px; font-weight: 800; border-radius: 99px; padding: 2px 7px; border: 2px solid #fff;
}

/* ---------- 홈 v2 ---------- */
#h2 { min-width: 0; }
#h2 .strip { display: flex; align-items: center; gap: 8px; padding-bottom: 13px; min-width: 0; overflow-x: auto; }
#h2 .strip .lb { font-size: 11.5px; font-weight: 800; color: #98a08a;  flex: none; }
#h2 .strip .lb.warn { color: #8f6708; }
#h2 .pill {
  display: inline-flex; align-items: center; gap: 7px; flex: none; padding: 8px 13px;
  border: 1px solid #dcd8c0; border-radius: 99px; background: #fff; font: inherit; font-size: 12.5px;
  font-weight: 600; cursor: pointer; color: #1c2430; white-space: nowrap;
}
#h2 .pill:hover { border-color: #5a6636; color: #4d5434; background: #f5f4e7; }
#h2 .pill.ghost { border-style: dashed; border-color: #c6c8b4; background: none; color: #6b7160; font-weight: 500; }
#h2 .pill.rec { border-color: #e8e5d1; background: #fbfaf2; color: #4f5644; font-size: 12.5px; padding: 7px 11px; }
#h2 .pill.appr { border-width: 1.5px; }
#h2 .pill .n { font-size: 11.5px; font-weight: 800; color: #fff; border-radius: 99px; padding: 1px 7px; }
#h2 .pill .go { font-size: 11.5px; font-weight: 700; color: #4d5434; }
#h2 .cfg { display: flex; align-items: center; gap: 9px; margin: 2px 0 10px; flex-wrap: wrap; }
#h2 .cfg .t { font-size: 12.5px; font-weight: 800; color: #98a08a;  }
#h2 .cfg .d { font-size: 11.5px; color: #6b7160; }
#h2 .grid {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; min-width: 0;
  align-items: stretch; grid-auto-rows: minmax(min-content, auto); grid-auto-flow: dense;
}
#h2 .pan {
  display: flex; flex-direction: column; min-height: 0; min-width: 0; background: #fff;
  border: 1.5px solid #dcd8c0; border-radius: 12px; padding: 13px 15px;
}
#h2 .pan.drag { opacity: .4; border-style: dashed; }
#h2 .pan.dover { border-color: #5a6636; }
#h2 .pan .ph { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 11px; }
#h2 .pan .ph .grip { font-size: 12.5px; color: #c6c8b4; cursor: grab; }
#h2 .pan .ph > b { font-size: 13.5px; }
#h2 .pan .ph .chip2 { font-size: 11.5px; font-weight: 700; border-radius: 6px; padding: 2px 7px; background: #eceade; color: #4f5644; white-space: nowrap; }
#h2 .pan .ph .ctr { margin-left: auto; display: flex; gap: 4px; align-items: center; }
#h2 .pan .ph .ctr .sp {
  padding: 3px 8px; border: 1px solid #dcd8c0; border-radius: 6px; background: #fff; font: inherit;
  font-size: 10.5px; font-weight: 700; color: #6b7160; cursor: pointer;
}
#h2 .pan .ph .ctr .sp.on { border-color: #c9c5a1; background: #f5f4e7; color: #4d5434; }
#h2 .pan .ph .ctr .x { width: 24px; height: 24px; border: 0; border-radius: 6px; background: none; font: inherit; font-size: 12.5px; color: #c6c8b4; cursor: pointer; padding: 0; }
#h2 .pan .ph .ctr .x:hover { background: #f4f3e8; color: #a8442a; }
#h2 .kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; min-width: 0; }
#h2 .kpi { border: 1px solid #e8e5d1; border-radius: 11px; padding: 10px 11px; min-width: 0; }
#h2 .kpi .l { display: flex; align-items: center; gap: 5px; font-size: 11.5px; color: #6b7160; font-weight: 600; white-space: nowrap; overflow: hidden; }
#h2 .kpi .v { display: flex; align-items: baseline; gap: 5px; margin-top: 5px; }
#h2 .kpi .v b { font-size: 20px; letter-spacing:-.4px; font-variant-numeric: tabular-nums; }
#h2 .kpi .v span { font-size: 11.5px; color: #98a08a; }
#h2 .kpi a, #h2 .kpi button.go2 {
  display: inline-block; margin-top: 7px; padding: 3px 8px; border: 1px solid #dcd8c0; border-radius: 7px;
  background: #fff; font: inherit; font-size: 11.5px; font-weight: 600; color: #4d5434; cursor: pointer;
  white-space: nowrap; text-decoration: none;
}
#h2 .kpi a:hover { background: #f5f4e7; border-color: #5a6636; }
#h2 .lvh { display: flex; align-items: center; gap: 7px; margin: 11px 0 8px; padding-top: 11px; border-top: 1px solid #edebdb; flex-wrap: wrap; }
#h2 .lvh b { font-size: 11.5px; color: #4f5644; }
#h2 .live { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; color: #3f6626; background: #e9f0e0; border-radius: 99px; padding: 1px 7px; }
#h2 .lrow {
  display: flex; align-items: center; gap: 8px; padding: 6px 9px; border: 1px solid #edebdb;
  border-radius: 8px; background: #fff; min-width: 0; font-size: 11.5px;
}
#h2 .lrow .at { flex: none; font-size: 10.5px; color: #98a08a; font-variant-numeric: tabular-nums; }
#h2 .lrow .k { flex: none; font-size: 10.5px; font-weight: 800; border-radius: 4px; padding: 1px 6px; white-space: nowrap; }
#h2 .lrow .cd { flex: none; font-weight: 700; color: #4d5434; white-space: nowrap; }
#h2 .lrow .m { flex: 1 1 90px; min-width: 0; font-size: 11.5px; color: #6b7160; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#h2 .lrow b.q { flex: none; font-variant-numeric: tabular-nums; }
#h2 .hidden-row { grid-column: span 12; order: 999; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
#h2 .sgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: 6px; min-width: 0; }
#h2 .sstep { min-width: 0; text-align: left; padding: 10px 11px; border: 1px solid #e8e5d1; border-radius: 10px; background: #fff; font: inherit; cursor: pointer; color: #1c2430; text-decoration: none; display: block; }
#h2 .sstep:hover { border-color: #5a6636; }
#h2 .sstep .l { display: block; font-size: 11.5px; color: #6b7160; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#h2 .sstep .v { display: flex; align-items: baseline; gap: 4px; margin-top: 4px; }
#h2 .sstep .v b { font-size: 17px; font-variant-numeric: tabular-nums; }
#h2 .sstep .v span { font-size: 11.5px; color: #98a08a; }
#h2 .pan .empty { padding: 16px; text-align: center; font-size: 12.5px; color: #98a08a; }
#h2 #apiPanel { width: auto !important; }
#h2 #apiPanel .hcard { width: auto !important; border: 0; padding: 0; margin: 0; box-shadow: none; background: none; }
#h2 #zoomCal .hcard { border: 0; padding: 0; margin: 0 !important; box-shadow: none; background: none; }

/* ---------- 모바일 ---------- */
@media (max-width: 860px) {
  #v2hdr .v2bar { padding: 0 8px; gap: 6px; }
  #v2hdr .v2search { flex-basis: 40px; }
  #v2hdr .v2search .hint, #v2hdr .v2search .kbd { display: none; }
  #v2hdr .v2me b { display: none; }
  #v2hdr .v2brand b { font-size: 13.5px; }
  #v2mega .mg { grid-template-columns: 1fr; }
  #v2mega .mgr { border-left: 0; border-top: 1px solid #e8e5d1; }
  #v2mega .mgi { grid-template-columns: 1fr; }
  html.v2 #topbar { top: 54px; padding: 8px 12px; }
  html.v2 #content { padding: 12px 12px 96px; }
  #h2 .grid > .pan { grid-column: span 12 !important; }
  #h2 .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html.v2 #v2fab { bottom: 76px; }
  #v2roster { width: min(320px, calc(100vw - 24px)); }
}

/* AI 플로팅 버튼과 겹치지 않게 채팅 FAB 위로 올림 */
html.v2 #aiFab { bottom: 86px !important; }
@media (max-width: 860px) { html.v2 #aiFab { bottom: 140px !important; } }

/* 🎨 테마 색상 버튼은 채팅 FAB과 같은 자리(우측 하단)에 겹칩니다.
   상단 탭 레이아웃에서는 채팅 버튼만 남기고 숨기며, 색상 설정은
   프로필 메뉴 → 「🎨 테마 · 화면 색상」 에서 엽니다. */
html.v2 #retroFab { display: none !important; }
html.v2 #retroPanel { bottom: 22px; right: 84px; }
@media (max-width: 860px) { html.v2 #retroPanel { right: 12px; bottom: 138px; } }

/* ===== v66 내 워크스페이스 — 반응형 ===== */
@media (max-width: 1180px) {
  #h2grid { grid-template-columns: repeat(6, minmax(0,1fr)) !important; }
  #h2grid > * { grid-column: span 6 !important; grid-row: span 1 !important; }
}
@media (max-width: 900px) {
  #h2grid { grid-template-columns: 1fr !important; }
  #h2grid > * { grid-column: span 1 !important; grid-row: span 1 !important; }
  .h2kpi { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .h2api { grid-template-columns: 1fr !important; }
}
@media (max-width: 560px) {
  .h2kpi { grid-template-columns: 1fr !important; }
}

/* ============================================================
   v113 — 상단 메뉴 적응형 배치
   창 너비가 줄어도 메뉴 탭이 검색창·아이콘에 가려지지 않도록
   오른쪽 도구부터 단계적으로 접고(c1→c2→c3), 그래도 넘치면
   좌우 화살표로 스크롤한다.
   ============================================================ */
#v2hdr .v2navw {
  display: flex; align-items: stretch; flex: 1 1 auto; min-width: 0; position: relative;
}
#v2hdr .v2navw .v2nav {
  display: none; flex: none; width: 24px; align-items: center; justify-content: center;
  border: 0; background: none; font: inherit; font-size: 17px; line-height: 1;
  color: #6b7160; cursor: pointer; padding: 0;
}
#v2hdr .v2navw.ovf .v2nav { display: flex; }
#v2hdr .v2navw .v2nav:disabled { opacity: .25; cursor: default; }
#v2hdr .v2navw .v2nav:not(:disabled):hover { color: #1c2430; background: #f6f5ec; }
#v2hdr .v2tabs { scroll-behavior: smooth; }
#v2hdr .v2tab { flex: none; }
#v2hdr .v2tab .lb { white-space: nowrap; }

/* 오른쪽 도구가 탭을 밀어내지 않도록 함께 줄어들 수 있게 */
#v2hdr .v2right { flex: 0 1 auto; min-width: 0; }
#v2hdr .v2search { flex: 0 1 240px; min-width: 0; }

/* ① 검색창을 아이콘으로 */
#v2hdr.c1 .v2search .hint, #v2hdr.c1 .v2search .kbd { display: none; }
#v2hdr.c1 .v2search { flex: 0 0 34px; width: 34px; padding: 0; justify-content: center; }
/* ② 접속자 수 · 내 이름 숨김 */
#v2hdr.c2 #v2onN, #v2hdr.c2 .v2me b { display: none; }
#v2hdr.c2 .v2ib { padding: 0 8px; }
#v2hdr.c2 .v2me { padding: 3px; max-width: none; }
/* ③ 탭 여백 축소 */
#v2hdr.c3 .v2tab { padding: 0 9px; gap: 6px; }
/* ④ 브랜드 이름 숨김 */
#v2hdr.c4 .v2brand { padding-right: 2px; }
#v2hdr.c4 .v2brand b { display: none; }
#v2hdr.c4 .v2tab { padding: 0 7px; font-size: 12.5px; }
/* ⑤ 탭 아이콘 숨김 (마지막 수단) */
#v2hdr.c5 .v2tab .ic { display: none; }

/* ── v205: 홈 작업 바 — 고정 작업 · 최근 · 승인 요청 한 줄 통합 (시안 workspace.css wbar) ── */
#h2 .wbar { display: flex; align-items: stretch; margin-bottom: 12px; border: 1px solid #dcd8c0; border-radius: 12px; background: #fff; min-width: 0; }
#h2 .wbar__pins { display: flex; align-items: center; gap: 7px; flex: 1 1 auto; min-width: 0; padding: 8px 12px; overflow-x: auto; scrollbar-width: none; }
#h2 .wbar__pins::-webkit-scrollbar { height: 0; }
#h2 .wbar__gear { flex: none; width: 30px; height: 30px; padding: 0; border: 1px dashed #c6c8b4; border-radius: 99px; background: none; font: inherit; font-size: 12.5px; color: #6b7160; cursor: pointer; }
#h2 .wbar__gear:hover { border-color: #5a6636; color: #4d5434; }
#h2 .wbar__seg { position: relative; flex: none; display: flex; align-items: center; border-left: 1px solid #e8e5d1; }
#h2 .wbar__seg:last-child { border-radius: 0 12px 12px 0; overflow: visible; }
#h2 .wbar__btn { display: inline-flex; align-items: center; gap: 6px; height: 100%; padding: 0 14px; border: 0; background: #fff; font: inherit; font-size: 12px; font-weight: 700; color: #6b7160; cursor: pointer; white-space: nowrap; }
#h2 .wbar__seg:last-child .wbar__btn { border-radius: 0 11px 11px 0; }
#h2 .wbar__btn:hover, #h2 .wbar__btn.is-on { background: #f6f5ec; color: #1c2430; }
#h2 .wbar__btn--warn { background: #fffaf3; color: #8f6708; font-size: 12.5px; }
#h2 .wbar__btn--warn:hover, #h2 .wbar__btn--warn.is-on { background: #fef3e2; color: #8f6708; }
#h2 .wbar__n { font-size: 11px; font-weight: 800; color: #fff; background: #d97706; border-radius: 99px; padding: 1px 7px; font-variant-numeric: tabular-nums; }
#h2 .wbar__caret { font-size: 9.5px; color: #98a08a; }
#h2 .wbar__pop { position: absolute; top: calc(100% + 6px); right: 0; z-index: 58; width: 238px; background: #fff; border: 1px solid #dcd8c0; border-radius: 11px; overflow: hidden; box-shadow: 0 18px 40px rgba(16,24,40,.16); }
#h2 .wbar__pop--wide { width: 318px; }
#h2 .wbar__pop-head { padding: 8px 12px; border-bottom: 1px solid #edebdb; font-size: 10.5px; font-weight: 800; color: #98a08a; }
#h2 .wbar__pop-head--row { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-bottom: 1px solid #edebdb; }
#h2 .wbar__pop-head--row b { font-size: 12px; color: #1c2430; font-weight: 700; }
#h2 .wbar__pop-head--row span { margin-left: auto; font-size: 10.5px; color: #98a08a; }
#h2 .wbar__row { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 8px 12px; border: 0; border-bottom: 1px solid #f2f1e4; background: #fff; font: inherit; font-size: 12px; font-weight: 600; color: #33415c; cursor: pointer; }
#h2 .wbar__row:last-of-type { border-bottom: 0; }
#h2 .wbar__row:hover { background: #f5f4e7; }
#h2 .wbar__row--ap { padding: 10px 12px; gap: 9px; }
#h2 .wbar__row--ap:hover { background: #fffaf3; }
#h2 .wbar__row-ico { flex: none; font-size: 13px; }
#h2 .wbar__row-label { flex: 1; min-width: 0; font-size: 12.5px; color: #1c2430; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#h2 .wbar__row-go { flex: none; font-size: 11.5px; font-weight: 700; color: #4d5434; }
#h2 .wbar__all { display: block; width: 100%; padding: 9px; border: 0; border-top: 1px solid #edebdb; background: #fbfaf2; font: inherit; font-size: 11.5px; font-weight: 700; color: #4d5434; cursor: pointer; }
#h2 .wbar__all:hover { background: #f5f4e7; }
@media (max-width: 720px) { #h2 .wbar { flex-wrap: wrap; } #h2 .wbar__pins { flex-basis: 100%; border-bottom: 1px solid #e8e5d1; } #h2 .wbar__seg { flex: 1; border-left: 0; } #h2 .wbar__seg + .wbar__seg { border-left: 1px solid #e8e5d1; } #h2 .wbar__btn { width: 100%; justify-content: center; } }