/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 독립 guard 로딩 표시도 배경 dim과 그림자 없이 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 17:07 KST
// 413cbaca-2ec7-4b61-8273-e710619cbaf2
// 공통 로딩 카드와 상태 안내 디자인 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
:where(:root) {
  --ui-working-backdrop: transparent;
  --ui-working-bg: var(--ui-surface, #ffffff);
  --ui-working-text: var(--ui-popup-text, #172b4d);
  --ui-working-border: var(--ui-border, #dfe0e3);
  --ui-working-primary: var(--ui-primary, #0066ff);
  --ui-working-track: color-mix(in srgb, var(--ui-working-primary) 14%, transparent);
  --ui-working-shadow: none;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 17:07 KST
// 413cbaca-2ec7-4b61-8273-e710619cbaf2
// 공통 로딩 카드와 상태 안내 디자인 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
body.app-is-loading,
body.app-is-loading * {
  cursor: wait !important;
}

._workingPanel_oomdl_28 {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background-color: var(--ui-working-backdrop);
  display: flex;
  align-items: center;
  justify-content: center;
}

._workingPanelContent_oomdl_38 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-sizing: border-box;
  max-width: calc(100vw - 32px);
  padding: 12px 18px;
  border: 1px solid var(--ui-working-border);
  border-radius: var(--ui-radius-compact, 3px);
  background: var(--ui-working-bg);
  box-shadow: var(--ui-working-shadow);
}

._workingPanelText_oomdl_53 {
  color: var(--ui-working-text);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}

._workingPanelSpinner_oomdl_62 {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  box-sizing: border-box;
  border-radius: var(--ui-radius-circle, 50%);
  border: 2px solid var(--ui-working-track);
  border-top-color: var(--ui-working-primary);
  animation: _workingSpin_oomdl_1 0.8s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  ._workingPanelSpinner_oomdl_62 {
    animation: none;
  }
}

@keyframes _workingSpin_oomdl_1 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 17:07 KST
// 413cbaca-2ec7-4b61-8273-e710619cbaf2
// 공통 로딩 카드와 상태 안내 디자인 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
body.app-is-loading,
body.app-is-loading * {
  cursor: wait !important;
}

._workingPanel_oomdl_28 {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background-color: var(--ui-working-backdrop);
  display: flex;
  align-items: center;
  justify-content: center;
}

._workingPanelContent_oomdl_38 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 10px;
  box-sizing: border-box;
  max-width: calc(100vw - 32px);
  padding: 12px 18px;
  border: 1px solid var(--ui-working-border);
  border-radius: var(--ui-radius-compact, 3px);
  background: var(--ui-working-bg);
  box-shadow: var(--ui-working-shadow);
}

._workingPanelText_oomdl_53 {
  color: var(--ui-working-text);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}

._workingPanelSpinner_oomdl_62 {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  box-sizing: border-box;
  border-radius: var(--ui-radius-circle, 50%);
  border: 2px solid var(--ui-working-track);
  border-top-color: var(--ui-working-primary);
  animation: _workingSpin_oomdl_1 0.8s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  ._workingPanelSpinner_oomdl_62 {
    animation: none;
  }
}

@keyframes _workingSpin_oomdl_1 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}
/* 00000000-0000-0000-0000-000000000000
   2026-07-10 23:10 KST
   a7c3e91f-4b2d-4e8a-9f1c-6d5b8a0e3c72
   BasePage 루트/본문 높이 고정: 부모를 채우고 내부 오버플로 시 스크롤
   2026-07-11 07:40 KST
   d5e6f7a8-9b0c-4d1e-2f3a-4b5c6d7e8f9a
   FixedHeightPannel 제거 후 mainContentFill 단일 경로
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._pageRoot_12lma_9 {
	height: 100%;
	min-height: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

._mainContentFill_12lma_17 {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 0 10px;
}

._pageHeader_12lma_26 {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	flex-shrink: 0;
}

._pageTitle_12lma_33 {
	margin: 0;
	padding: 8px 12px;
	font-size: 20px;
	font-weight: var(--app-font-weight-bold);
	display: none;
}

._headerActions_12lma_41 {
	display: flex;
	align-items: center;
	gap: 8px;
	padding-right: 12px;
}

._dataTransferPrintButton_12lma_48 {
	height: 32px;
	padding: 0 10px;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
	background: #f8fafc;
	color: #0f172a;
	font-size: 1rem;
	cursor: pointer;
}

._dataTransferPrintButton_12lma_48:hover {
	background: #f1f5f9;
}
/* 00000000-0000-0000-0000-000000000000
   2026-07-10 11:58 KST
   c3d4e5f6-a7b8-9012-cdef-123456789012
   기본요소(그리드 제외) 공통 스크롤바 스타일
   ffffffff-ffff-ffff-ffff-ffffffffffff */

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 17:14 KST
// 89d60380-07fc-45c0-bfe7-c41bf7c3a9e3
// 기본 스크롤 두께와 색상을 공통 토큰으로 조정
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._appScrollbar_kekyf_14 {
  scrollbar-width: thin;
  scrollbar-color: var(--ui-scrollbar-thumb, #b5bdc9) transparent;
}

._appScrollbar_kekyf_14::-webkit-scrollbar {
  width: var(--ui-scrollbar-size, 8px);
  height: var(--ui-scrollbar-size, 8px);
}

._appScrollbar_kekyf_14::-webkit-scrollbar-track {
  background-color: transparent;
}

._appScrollbar_kekyf_14::-webkit-scrollbar-thumb {
  background-color: var(--ui-scrollbar-thumb, #b5bdc9);
  border: none;
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 18:54 KST
  // 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
  // 앱 공통 스크롤바의 둥근 형태를 곡률 토큰에 연결
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  border-radius: var(--ui-radius-pill, 999px);
  box-shadow: none;
}

._appScrollbar_kekyf_14::-webkit-scrollbar-thumb:hover {
  background-color: var(--ui-scrollbar-thumb-hover, #8994a6);
  cursor: default;
}

._appScrollbar_kekyf_14::-webkit-scrollbar-button,
._appScrollbar_kekyf_14::-webkit-scrollbar-button:single-button,
._appScrollbar_kekyf_14::-webkit-scrollbar-button:vertical:start:decrement,
._appScrollbar_kekyf_14::-webkit-scrollbar-button:vertical:end:increment,
._appScrollbar_kekyf_14::-webkit-scrollbar-button:horizontal:start:decrement,
._appScrollbar_kekyf_14::-webkit-scrollbar-button:horizontal:end:increment {
  display: none;
  width: 0;
  height: 0;
  background: transparent;
}

._appScrollbar_kekyf_14::-webkit-scrollbar-corner {
  background-color: transparent;
}
._aboutPage_1qsol_1 {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  background: #f0f0f0;
  font-size: 1rem;
  color: #333;
}


._aboutInner_1qsol_11 {
  max-width: 900px;
  margin: 0 auto;
}


/* 상단 2컬럼 (Developer + Design 나란히) */
._aboutTopColumns_1qsol_18 {
  display: flex;
  gap: 0;
  align-items: flex-start;
}

._aboutTopCol_1qsol_18 {
  flex: 1;
}

._aboutSection_1qsol_28 {
  margin-bottom: 20px;
}

._aboutSectionTitle_1qsol_32 {
  font-family: var(--default-font-family-bold), sans-serif;
  font-size: 1.7rem;
  font-weight: var(--app-font-weight-bold);
  margin: 0 0 10px 0;
  padding: 0;
  text-align: left;
  color: black;
}

._aboutVersionBox_1qsol_42 {
  font-size: 1.15rem;
  color: #333;
  text-align: left;
  padding: 0px 0;
}


/* 00000000-0000-0000-0000-000000000000
   2026-07-10 16:15 KST
   e9f0a1b2-c3d4-5678-9012-def3456789ab
   About 글자 행간 간격 축소
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._aboutMembers_1qsol_55 {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

/* 멤버 카드 - 가로형 (이미지 왼쪽, 텍스트 오른쪽) */
._aboutMemberCard_1qsol_62 {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 12px;
  padding: 2px 0;
}

._aboutMemberAvatar_1qsol_70 {
  width: 56px;
  height: 56px;
  object-fit: cover;
  background: #ccc;
  flex-shrink: 0;
}

._aboutMemberAvatarPlaceholder_1qsol_78 {
  width: 56px;
  height: 56px;
  background: #ccc;
  border: 1px solid black;
  flex-shrink: 0;
}

._aboutMemberInfo_1qsol_86 {
  display: flex;
  flex-direction: column;
  justify-content: left;
  text-align: left;
  line-height: 1.25;
  gap: 0;
}

._aboutMemberEmail_1qsol_95 {
  font-size: 1.1rem;
  color: #4a7abf;
  word-break: break-all;
  margin-bottom: 0;
}

._aboutMemberRole_1qsol_102 {
  font-size: 1.05rem;
  color: #555;
  margin-bottom: 0;
}

._aboutMemberPhone_1qsol_108 {
  font-size: 1.02rem;
  color: #888;
}


/* Reference - 세로 목록 */
._aboutRefList_1qsol_115 {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  text-align: left;
}

._aboutRefList_1qsol_115 li {
  font-size: 1.1rem;
  color: #444;
  padding: 0;
  line-height: 1.3;
  background: none;
  border: none;
}

._aboutRefList_1qsol_115 li a {
  color: #4a7abf;
  text-decoration: none;
}

._aboutRefList_1qsol_115 li a:hover {
  text-decoration: underline;
}


/* Provider - 테두리 없는 일반 텍스트 */
._aboutProviderBox_1qsol_145 {
  font-size: 1.1rem;
  color: #444;
  line-height: 1.35;
  text-align: left;
}

._companyName_1qsol_152 {
  font-size: 1.1rem;
  font-weight: var(--app-font-weight-bold);
  color: #444;
}

._aboutProviderBox_1qsol_145 a {
  color: #4a7abf;
  text-decoration: none;
}

._aboutProviderBox_1qsol_145 a:hover {
  text-decoration: underline;
}

._aboutCopyright_1qsol_167 {
  color: #aaa;
  font-size: 1.02rem;
  margin-top: 24px;
}
/* 00000000-0000-0000-0000-000000000000
   2026-09-11 15:07 KST
   35184fff-ff7e-4188-94ea-ba5a920196f9
   아이콘 굵기와 상태 색상 및 초기 화면 표시 개선
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-29 21:20 KST
   7c4e19a2-8b5d-4f16-9e30-1a6d0c8b2f47
   grid package tokens. Host :root overrides win.
   ffffffff-ffff-ffff-ffff-ffffffffffff */
:where(:root) {
  --app-font-weight-bold: bold;
  --default-font-family: 'Malgun Gothic', sans-serif;
  --ui-button-disabled-text: #999999;
  --edited-row-text-color: #dc2626;
  --ui-grid-active-bg: #f4c430;
  --ui-grid-active-text: #1a1d22;
  --ui-grid-hover: #eaf2fe;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 00000000-0000-0000-0000-000000000000
   2026-07-15 15:00 KST
   c6d7e8f9-a0b1-2345-6789-345678901234
   < > 확대 + 년월 수직 중앙 정렬
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-29 08:00 KST
   9e4b7c12-8a30-4f56-b1d8-6c2e0a9f5d47
   ShadcnCalendarModal을 GridCalendarPopup으로 이름 변경
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-17 09:45 KST
   a4e7b2c9-1f83-4d50-9c26-8e0b5a7d3f14
   달력 셀·간격을 기본글자(14px=1배) rem 비율로 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._calendarModalPanel_91zq9_23 {
  width: 100%;
  max-width: 100vw;
  min-width: 0;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  box-shadow: 0 calc(12rem / 14) calc(28rem / 14) rgba(15, 23, 42, 0.2);
  padding: calc(16rem / 14);
  box-sizing: border-box;
  min-height: calc(560rem / 14);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

._calendarToolbar_91zq9_38 {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  width: 100%;
  max-width: calc(420rem / 14);
  margin: 0 auto calc(12rem / 14);
  min-height: calc(64rem / 14);
  user-select: none;
}

._monthNavCenter_91zq9_50 {
  grid-column: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(16rem / 14);
  min-height: calc(56rem / 14);
}

._monthLabel_91zq9_59 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 7.5ch;
  min-height: calc(56rem / 14);
  text-align: center;
  font-size: 3rem;
  font-weight: var(--app-font-weight-bold);
  line-height: 1;
  color: #0f172a;
}

._navButton_91zq9_72 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc(56rem / 14);
  height: calc(56rem / 14);
  border: none;
  border-radius: var(--ui-radius-surface, 8px);
  background: transparent;
  color: #2563eb;
  font-size: 2.75rem;
  line-height: 1;
  cursor: pointer;
}

._navButton_91zq9_72:hover {
  background: #dbeafe;
  color: #1d4ed8;
}

._navButton_91zq9_72:active {
  background: #bfdbfe;
  color: #1e40af;
}

._toolbarEnd_91zq9_97 {
  grid-column: 3;
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: calc(4rem / 14);
  min-width: max-content;
  white-space: nowrap;
}

._closeBtn_91zq9_107 {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc(32rem / 14);
  height: calc(32rem / 14);
  border: none;
  background: transparent;
  color: #aaaaaa;
  font-size: 3rem;
  font-weight: 0;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  font-family: var(--default-font-family), 'Arial', sans-serif;
}

._closeBtn_91zq9_107:hover {
  color: #000;
}

._todayButton_91zq9_129 {
  border: none;
  border-radius: var(--ui-radius-menu, 6px);
  background: transparent;
  color: #dc2626;
  padding: calc(6rem / 14) calc(10rem / 14);
  font-size: 1rem;
  font-weight: var(--app-font-weight-bold);
  cursor: pointer;
  white-space: nowrap;
}

._todayButton_91zq9_129:hover {
  background: #fee2e2;
  color: #b91c1c;
}

._todayButton_91zq9_129:active {
  background: #fecaca;
  color: #991b1b;
}

._monthCalendar_91zq9_151 {
  --cal-day-width: calc(52rem / 14);
  --cal-day-height: calc(64rem / 14);
  --cal-gap-x: min(calc(12rem / 14), 2vw);
  --cal-gap-y: min(calc(10rem / 14), 1.6vw);
  --rdp-day-width: var(--cal-day-width);
  --rdp-day-height: var(--cal-day-height);
  --rdp-day_button-width: 100%;
  --rdp-day_button-height: 100%;
  --rdp-day_button-border-radius: var(--ui-radius-control, 4px);
  --rdp-weekday-padding: calc(4rem / 14) 0;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

._monthCalendar_91zq9_151 .rdp-root,
._monthCalendar_91zq9_151 .rdp-months,
._monthCalendar_91zq9_151 .rdp-month {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

._monthCalendar_91zq9_151 .rdp-day,
._monthCalendar_91zq9_151 .rdp-weekday {
  width: calc(100% / 7);
  min-width: 0;
  padding: calc(var(--cal-gap-y) / 2) calc(var(--cal-gap-x) / 2);
}

._monthCalendar_91zq9_151 .rdp-day {
  height: var(--cal-day-height);
}

._monthCalendar_91zq9_151 .rdp-day_button {
  width: 100%;
  height: 100%;
  max-width: 100%;
  overflow: hidden;
  font-size: 1rem;
}

._monthCalendar_91zq9_151 .rdp-month_grid,
._monthCalendar_91zq9_151 .rdp-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}

._monthCalendar_91zq9_151 .rdp-weekday,
._monthCalendar_91zq9_151 .rdp-day {
  border: 0;
  font-weight: inherit;
}

._monthCalendar_91zq9_151 .rdp-week,
._monthCalendar_91zq9_151 .rdp-weeks {
  gap: var(--cal-gap-y);
}

._monthCalendar_91zq9_151 .rdp-month_caption {
  display: none;
}

._monthCalendar_91zq9_151 .rdp-day:not(.rdp-outside) .rdp-day_button,
._monthCalendar_91zq9_151 .rdp-day_button:not(.rdp-outside) {
  width: 100%;
  height: 100%;
  font-size: 2.2rem;
  font-style: normal;
  border: 0;
  background: transparent;
}

._monthCalendar_91zq9_151 .rdp-outside .rdp-day_button,
._monthCalendar_91zq9_151 .rdp-day_button.rdp-outside {
  width: 100%;
  height: 100%;
  font-size: 0.8rem;
  opacity: 0.65;
}

._monthCalendar_91zq9_151 .rdp-day_button:hover:not([disabled]):not(.rdp-selected) {
  background: #e2e8f0;
  border-radius: var(--ui-radius-control, 4px);
}

._monthCalendar_91zq9_151 .rdp-selected .rdp-day_button,
._monthCalendar_91zq9_151 .rdp-day_button[aria-selected='true'] {
  background: #2563eb !important;
  color: #ffffff !important;
  border-radius: var(--ui-radius-control, 4px) !important;
}

._monthCalendar_91zq9_151 .rdp-today.rdp-selected .rdp-day_button,
._monthCalendar_91zq9_151 .rdp-day_button[aria-selected='true'] {
  text-decoration: none;
}

._monthCalendar_91zq9_151 .rdp-weekdays .rdp-weekday:nth-child(1) {
  color: #dc2626;
}

._monthCalendar_91zq9_151 .rdp-weekdays .rdp-weekday:nth-child(7) {
  color: #0ea5e9;
}

._monthCalendar_91zq9_151 .rdp-weeks .rdp-week .rdp-day:nth-child(1) .rdp-day_button {
  color: #dc2626;
}

._monthCalendar_91zq9_151 .rdp-weeks .rdp-week .rdp-day:nth-child(7) .rdp-day_button {
  color: #0ea5e9;
}

._monthCalendar_91zq9_151 .rdp-today .rdp-day_button,
._monthCalendar_91zq9_151 .rdp-day_today {
  color: #111111 !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-15 22:59 KST
   a9b0c1d2-e3f4-4567-8901-23456789abcd
   오늘 밑줄: 일자 숫자에만 (초복 등 라벨과 겹침 방지)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._monthCalendar_91zq9_151 .rdp-today .rdp-day_button {
  text-decoration: none;
}

._monthCalendar_91zq9_151 .rdp-today .rdp-day_button ._dayNumber_91zq9_284,
._monthCalendar_91zq9_151 .rdp-today .rdp-day_button ._dayNumberHoliday_91zq9_285 {
  text-decoration: underline;
  text-decoration-color: #dc2626;
  text-decoration-thickness: calc(3rem / 14);
  text-underline-offset: calc(3rem / 14);
}

._monthCalendar_91zq9_151 .rdp-month_grid {
  margin-top: calc(8rem / 14);
}

._dayButtonInner_91zq9_296 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  line-height: 1.1;
  gap: 1px;
}

._dayNumber_91zq9_284 {
  display: block;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-15 16:58 KST
   a1b2c3d4-e5f6-4789-9012-34567890abcd
   holiday matched day number + comment label
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._dayNumberHoliday_91zq9_285 {
  display: block;
  color: #dc2626;
  font-weight: var(--app-font-weight-bold);
}

._holidayLabel_91zq9_322 {
  display: block;
  max-width: 100%;
  font-size: 0.65rem;
  font-weight: var(--app-font-weight-bold);
  line-height: 1.15;
  color: #dc2626;
  white-space: normal;
  word-break: keep-all;
  overflow: visible;
}

._lunarLabel_91zq9_334 {
  display: block;
  font-size: 0.65rem;
  line-height: 1;
  color: #64748b;
  white-space: nowrap;
}

._solarTermLabel_91zq9_342 {
  display: block;
  font-size: 0.8rem;
  font-weight: var(--app-font-weight-bold);
  line-height: 1;
  color: #059669;
  white-space: nowrap;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-15 22:57 KST
   f7a8b9c0-d1e2-4345-f789-0abcdef12345
   boknal (chobok/jungbok/malbok) label
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._boknalLabel_91zq9_356 {
  display: block;
  font-size: 0.8rem;
  font-weight: var(--app-font-weight-bold);
  line-height: 1;
  color: #c2410c;
  white-space: nowrap;
}

._monthCalendar_91zq9_151 .rdp-selected .rdp-day_button ._lunarLabel_91zq9_334,
._monthCalendar_91zq9_151 .rdp-day_button[aria-selected='true'] ._lunarLabel_91zq9_334,
._monthCalendar_91zq9_151 .rdp-selected .rdp-day_button ._solarTermLabel_91zq9_342,
._monthCalendar_91zq9_151 .rdp-day_button[aria-selected='true'] ._solarTermLabel_91zq9_342,
._monthCalendar_91zq9_151 .rdp-selected .rdp-day_button ._boknalLabel_91zq9_356,
._monthCalendar_91zq9_151 .rdp-day_button[aria-selected='true'] ._boknalLabel_91zq9_356,
._monthCalendar_91zq9_151 .rdp-selected .rdp-day_button ._holidayLabel_91zq9_322,
._monthCalendar_91zq9_151 .rdp-day_button[aria-selected='true'] ._holidayLabel_91zq9_322 {
  color: #e2e8f0;
}

._monthCalendar_91zq9_151 .rdp-selected .rdp-day_button ._dayNumberHoliday_91zq9_285,
._monthCalendar_91zq9_151 .rdp-day_button[aria-selected='true'] ._dayNumberHoliday_91zq9_285 {
  color: #ffffff;
}

._monthCalendar_91zq9_151 .rdp-outside .rdp-day_button ._lunarLabel_91zq9_334,
._monthCalendar_91zq9_151 .rdp-outside .rdp-day_button ._solarTermLabel_91zq9_342,
._monthCalendar_91zq9_151 .rdp-outside .rdp-day_button ._boknalLabel_91zq9_356,
._monthCalendar_91zq9_151 .rdp-outside .rdp-day_button ._holidayLabel_91zq9_322 {
  opacity: 0.8;
}



/* 00000000-0000-0000-0000-000000000000
   2026-08-29 08:48 KST
   d4a7c2e9-1b58-4f06-8c13-9e0a5d7b3f21
   그리드 달력은 한 달만 그려 요일·날짜가 밀리지 않게 함
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-29 08:55 KST
   a7c3e1d8-4b26-4f09-8e15-2d9a0c6b5f38
   한 달 달력에서 손가락 스와이프로 월 이동
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._monthSwipeViewport_91zq9_400 {
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  align-self: stretch;
  touch-action: none;
}

._monthPane_91zq9_409 {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}



/* 00000000-0000-0000-0000-000000000000
   2026-08-18 15:52 KST
   a8d3e1c6-4f20-4b57-9c14-7e6a2d5b0f38
   달력 닫기를 팝업 윈도우 X 형식으로 변경, 모바일 좌우 이동 버튼 축소
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-27 10:50 KST
   c8e4b1a7-2d59-4f06-9c13-8a7e0b5d4f26
   달력 모바일 내비 기준을 앱 공통 1024px로 통일
   ffffffff-ffff-ffff-ffff-ffffffffffff */
@media (max-width: 1024px) {
  html[data-app-layout='responsive'] {
  ._monthNavCenter_91zq9_50 {
    gap: calc(6rem / 14);
    min-height: calc(36rem / 14);
  }

  ._navButton_91zq9_72 {
    width: calc(28rem / 14);
    height: calc(28rem / 14);
    border-radius: var(--ui-radius-control, 4px);
    font-size: 1.35rem;
  }
  }
}



/* 00000000-0000-0000-0000-000000000000
   2026-08-18 22:34 KST
   c4f8a2b1-6d39-4e17-8a50-1b7c3e9d2f46
   PC에서 달력 일자 그리드를 화면 중앙에 모아 표시
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-27 10:50 KST
   c8e4b1a7-2d59-4f06-9c13-8a7e0b5d4f26
   달력 PC 중앙 정렬을 1025px 이상과 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
@media (min-width: 1025px) {
  ._calendarToolbar_91zq9_38 {
    max-width: calc((52rem / 14) * 7);
  }

  ._monthSwipeViewport_91zq9_400 {
    width: calc((52rem / 14) * 7);
    max-width: 100%;
    align-self: center;
  }
}
/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:18 KST
   f2b8d4e1-6a37-4c19-9e05-8d0c3a7b5f46
   엑셀 아이콘: 비활성 버튼에서는 회색(currentColor)으로 표기
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._icon_1ykwi_6 {
  color: #217346;
}

button:disabled ._icon_1ykwi_6 {
  color: var(--ui-button-disabled-text, #999999);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 15:07 KST
// 35184fff-ff7e-4188-94ea-ba5a920196f9
// 아이콘 굵기와 상태 색상 및 초기 화면 표시 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 12:39 KST
// 767f32f3-2dc0-4a3d-80a1-98eb1b208d6a
// 다크 모드의 그리드·탭·팝업 색상 대비와 선택 상태 연결 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 11:20 KST
// c32148e8-5f5c-4677-8adc-b3309691edd9
// 팝업과 등록 입력폼 및 조직도 카드 디자인 정리
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 10:23 KST
// 2abf3334-fff5-4d34-afa6-ac8a387fcf90
// 화살표 투명 배경과 헤더 구분선 복원 및 행 정렬·사이드 팝업 슬라이드 수정
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 17:50 KST
// 7113633c-1a26-466b-b093-12b3bdbba7d8
// 실제 브라우저 검증 후 회원 하위 탭과 바로가기 디자인 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
.common-grid-ag .ag-root-wrapper {
  --ag-background-color: var(--ui-grid-surface, #ffffff);
  --ag-foreground-color: var(--ui-grid-text, #2a2f36);
  --ag-header-background-color: var(--ui-grid-header-bg, #f7f7f8);
  --ag-header-foreground-color: var(--ui-grid-text, #2a2f36);
  --ag-secondary-foreground-color: var(--ui-grid-muted, #70737c);
  --ag-border-color: var(--ui-grid-border, #dfe0e3);
  --ag-row-border-color: var(--ui-grid-row-border, #eeeeef);
  --ag-selected-row-background-color: var(--ui-grid-active-bg, #f4c430);
  --ag-row-hover-color: var(--ui-grid-hover, #eaf2fe);
  --ag-input-border-color: var(--ui-grid-border, #dfe0e3);
  --ag-input-focus-border-color: var(--ui-grid-primary, #0066ff);
  --ag-checkbox-unchecked-color: var(--ui-grid-muted, #70737c);
  --ag-checkbox-checked-color: var(--ui-grid-primary, #0066ff);
  color: var(--ui-grid-text, #2a2f36);
  background: var(--ui-grid-surface, #ffffff);
}

.common-grid-ag .ag-selection-checkbox {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.common-grid-ag .ag-selection-checkbox input[type='checkbox'] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.common-grid-ag .ag-selection-checkbox .ag-checkbox-input,
.common-grid-ag .ag-selection-checkbox .ag-checkbox-input-wrapper .ag-checkbox-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.common-grid-ag .ag-selection-checkbox .ag-checkbox-input-wrapper {
  position: relative;
  width: 18px;
  height: 18px;
  border: 2px solid var(--ui-grid-text, #111111);
  border-radius: var(--ui-radius-tight, 2px);
  background: var(--ui-grid-surface, #ffffff);
  box-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex: none;
}

.common-grid-ag .ag-selection-checkbox .ag-checkbox-input-wrapper .ag-icon {
  display: none !important;
}

.common-grid-ag .ag-selection-checkbox .ag-checkbox-input-wrapper::after {
  content: none !important;
  display: none !important;
}

.common-grid-ag .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-checked,
.common-grid-ag .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-indeterminate {
  background: linear-gradient(var(--ui-grid-primary, #2563eb), var(--ui-grid-primary, #2563eb)) center / 10px 10px no-repeat, var(--ui-grid-surface, #ffffff);
}

.common-grid-ag .ag-header-select-all .ag-checkbox-input,
.common-grid-ag .ag-header-select-all input[type='checkbox'] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.common-grid-ag .ag-header-select-all .ag-checkbox-input-wrapper {
  position: relative;
  width: 18px;
  height: 18px;
  border: 2px solid var(--ui-grid-text, #111111);
  border-radius: var(--ui-radius-tight, 2px);
  background: var(--ui-grid-surface, #ffffff);
  box-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.common-grid-ag .ag-header-select-all .ag-checkbox-input-wrapper .ag-icon,
.common-grid-ag .ag-header-select-all .ag-checkbox-input-wrapper::after {
  display: none !important;
  content: none !important;
}

.common-grid-ag .ag-header-select-all .ag-checkbox-input-wrapper.ag-checked,
.common-grid-ag .ag-header-select-all .ag-checkbox-input-wrapper.ag-indeterminate {
  background: linear-gradient(var(--ui-grid-primary, #2563eb), var(--ui-grid-primary, #2563eb)) center / 10px 10px no-repeat, var(--ui-grid-surface, #ffffff);
}

.common-grid-ag .ag-header-select-all {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0;
}

.common-grid-ag .ag-header-cell .ag-header-cell-comp-wrapper {
  width: 100%;
  justify-content: flex-start;
}

.common-grid-ag .ag-header-cell .ag-header-cell-label {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  justify-content: flex-start !important;
}

.common-grid-ag .ag-header-cell .ag-header-cell-text {
  text-align: left !important;
}

.common-grid-ag .ag-header-row .ag-header-cell,
.common-grid-ag .ag-pinned-left-header .ag-header-cell {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.common-grid-ag .ag-header-cell .ag-header-cell-comp-wrapper,
.common-grid-ag .ag-header-cell .ag-header-cell-label,
.common-grid-ag .ag-header-cell .ag-header-cell-text,
.common-grid-ag .ag-header-cell .ag-sort-indicator-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='ag-Grid-SelectionColumn'] {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 선택 컬럼 헤더의 기본 경계선 + 커스텀 ::after 가 겹쳐 두 줄로 보이는 현상 제거 */
.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='ag-Grid-SelectionColumn']::after,
.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='__rowSelection__']::after {
  content: none !important;
}

.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='ag-Grid-SelectionColumn'] .ag-header-cell-comp-wrapper,
.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='__rowSelection__'] .ag-header-cell-comp-wrapper {
  justify-content: center !important;
}

.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='ag-Grid-SelectionColumn'] .ag-header-cell-label,
.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='__rowSelection__'] .ag-header-cell-label {
  justify-content: center !important;
  align-items: center !important;
}

.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='ag-Grid-SelectionColumn'] .ag-header-select-all,
.common-grid-ag .ag-pinned-left-header .ag-header-cell[col-id='__rowSelection__'] .ag-header-select-all {
  margin: 0 auto !important;
}

.common-grid-ag .ag-header-cell.midas-selection-header-cell .ag-header-cell-comp-wrapper,
.common-grid-ag .ag-header-cell.midas-selection-header-cell .ag-header-cell-label,
.common-grid-ag .ag-header-cell.midas-selection-header-cell .ag-header-select-all {
  justify-content: center !important;
  align-items: center !important;
}

.common-grid-ag .ag-header-cell:not(.ag-header-cell-last)::after {
  content: none;
}

/* pinned-left 헤더는 자체 경계선이 있어 커스텀 분리선을 제거해 겹선을 방지한다. */
.common-grid-ag .ag-pinned-left-header .ag-header-cell::after {
  content: none !important;
}

/* Pinned 영역 경계선과 첫 번째 센터 헤더 구분선이 겹쳐 두 줄로 보이는 현상 방지 */
.common-grid-ag .ag-center-cols-header .ag-header-cell.ag-column-first::after {
  content: none;
}

.common-grid-ag .ag-root-wrapper {
  border: none !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-23 16:39 KST
   b20cc922-e554-44e7-aa36-9d7fc82bd08a
   그리드 내부 애니메이션/transition 전면 비활성
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag,
.common-grid-ag *,
.common-grid-ag *::before,
.common-grid-ag *::after {
  animation: none !important;
  animation-duration: 0s !important;
  animation-delay: 0s !important;
  transition: none !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
}

.common-grid-ag .ag-row,
.common-grid-ag .ag-row-animation .ag-row,
.common-grid-ag .ag-row-animation .ag-row.ag-after-created {
  transition: none !important;
}

.common-grid-ag .ag-value-change-value,
.common-grid-ag .ag-value-change-value-highlight,
.common-grid-ag .ag-cell-data-changed,
.common-grid-ag .ag-cell-data-changed-animation {
  transition: none !important;
  animation: none !important;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-06-25 15:10 */
/* d8f2c4b1-9a7e-4f3c-b6d2-1e8a9c7f5b3d */
/* 작업바 visibility 전환·초기 숨김 시 content-visibility:auto 로 행이 그려지지 않는 현상 방지 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag .ag-root-wrapper.ag-layout-normal {
  content-visibility: visible !important;
}



/* 00000000-0000-0000-0000-000000000000 */
/* 2026-06-25 17:12 */
/* 53b39943-b8ca-4f1e-a257-d60c9e2c7001 */
/* ag-grid v36 새 렌더링에서 데이터 로드 시 본문(.ag-root)이 0높이로 붕괴하는 현상 방지: JS로 측정한 픽셀 높이를 본문에 강제 적용 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag .ag-root-wrapper-body.ag-layout-normal,
.common-grid-ag .ag-root.ag-layout-normal.ag-unselectable {
  height: var(--grid-ag-body-height, 100%) !important;
  min-height: var(--grid-ag-body-height, 0px) !important;
}

.common-grid-ag .ag-header-viewport,
.common-grid-ag .ag-center-cols-viewport,
.common-grid-ag .ag-body-horizontal-scroll-viewport {
  box-sizing: border-box;
}

.common-grid-ag .ag-body-viewport,
.common-grid-ag .ag-center-cols-viewport {
  overflow-anchor: none;
  overscroll-behavior-x: none;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-23 10:35 KST
   a1c5e8f2-3b7d-4e9a-8c16-2f4d0a9b5e73
   will-change:transform 제거 — 대형 레이어가 세로 스크롤 성능을 떨어뜨리는 경우 완화
   ffffffff-ffff-ffff-ffff-ffffffffffff */

/* Color/ForeColor는 행(getRowStyle) 단위로만 적용하고 셀은 투명하게 두어 수평 스크롤 시 cellStyle 재계산 비용을 줄인다. */
.common-grid-ag .ag-row .ag-cell {
  background-color: transparent;
  color: var(--midas-grid-row-forecolor, var(--midas-grid-column-text, inherit));
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-09 14:13 KST
   a385fab0-90cd-4ca0-b9a3-25fa4ab477a5
   선택 배경에는 테마 글자색을 사용하고 명시적 업무 글자색은 유지
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin .ag-row.ag-row-selected,
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-row.midas-row-focused {
  --midas-grid-selection-text: var(--ui-grid-active-text, #1a1d22);
}

.common-grid-ag.selection-unit-row {
  --ag-range-selection-border-color: transparent;
  --ag-range-selection-border-style: none;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-02 30:00 KST */
/* c9d0e1f2-a3b4-5678-c901-23456789abcd */
/* selectionUnit='row'일 때 셀 클릭 네모박스(포커스 테두리) 미표시 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-23 10:05 KST */
/* 6f2a9c1e-4b8d-4e3a-9c71-2d5e8a0b4f63 */
/* row 모드: ag-cell-range-single-cell 포커스 테두리도 숨김(셀모드 잔상 방지) */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-10 14:30 KST
   8f2c1a9e-4b6d-4e3a-9c71-1d5e8a0b4f82
   클릭/포커스 시 border:none 제거로 생기던 셀 텍스트 1px 밀림 방지(투명 1px 보더 유지)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.selection-unit-row .ag-cell.ag-cell-focus:not(.ag-cell-inline-editing),
.common-grid-ag.selection-unit-row .ag-cell.ag-cell-focus:not(.ag-cell-inline-editing):focus-within,
.common-grid-ag.selection-unit-row .ag-cell-range-single-cell,
.common-grid-ag.selection-unit-row .ag-cell-range-single-cell.ag-cell-range-handle {
  border: 1px solid transparent !important;
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-06-25 22:42 */
/* 7a9c2d4e-1f8b-4c6a-9d3e-5b7f1a2c8d90 */
/* selectionUnit='row'일 때 행 선택 커서를 pointer로 고정 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.selection-unit-row .ag-row .ag-cell {
  cursor: pointer;
}

.common-grid-ag.selection-unit-row .ag-row .ag-cell.ag-cell-inline-editing,
.common-grid-ag.selection-unit-row .ag-row .ag-cell.ag-cell-inline-editing * {
  cursor: text;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-23 10:35 KST
   a1c5e8f2-3b7d-4e9a-8c16-2f4d0a9b5e73
   수직 스크롤바: 호버 확대/transition 제거(고정폭) — 드래그 스크롤 레이아웃 재계산 비용 제거
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag .ag-body-vertical-scroll {
  overflow: hidden;
  z-index: 2;
  min-width: var(--grid-scrollbar-size) !important;
  max-width: var(--grid-scrollbar-size) !important;
  width: var(--grid-scrollbar-size) !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-24 11:42 KST
   6a3e9c5d-2f8b-4d1a-9e7c-4b0d8a6f2c53
   수직 스크롤바: ::-webkit-scrollbar(메인스레드 페인트) → scrollbar-color(컴포지터 페인트) 전환
   — 스크롤 프레임 작업과 무관하게 썸이 마우스를 즉시 추적
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag .ag-body-vertical-scroll-viewport {
  min-width: var(--grid-scrollbar-size) !important;
  max-width: var(--grid-scrollbar-size) !important;
  width: var(--grid-scrollbar-size) !important;
  scrollbar-width: auto;
  scrollbar-color: var(--grid-scrollbar-thumb-color) var(--grid-scrollbar-track-color);
}

.common-grid-ag {
  --ag-header-background-color: var(--ui-grid-header-bg, #f7f7f8);
  --ag-header-font-weight: 0; /* var(--ag-font-weight) */
  /* 00000000-0000-0000-0000-000000000000
     2026-07-16 16:30 KST
     eec57449-bd31-4bf1-aff8-9b3f8e95c1a3
     수평 스크롤 높이 = 수직 스크롤 폭 (--grid-scrollbar-size 공통)
     ffffffff-ffff-ffff-ffff-ffffffffffff */
  --grid-scrollbar-size: 18px;
  /* 00000000-0000-0000-0000-000000000000
     2026-07-20 11:50 KST
     de5ba3da-afb2-4159-a7c1-d2af27bf34d0
     수평 스크롤바: 기본 50% 높이, 호버 시 전체 높이
     ffffffff-ffff-ffff-ffff-ffffffffffff */
  --grid-scrollbar-horizontal-size: calc(var(--grid-scrollbar-size) * 0.7);
  --grid-scrollbar-vertical-size: calc(var(--grid-scrollbar-size) * 0.7);
  --grid-scrollbar-track-color: var(--ui-grid-border, #e8ebef);
  --grid-scrollbar-thumb-color: var(--ui-grid-muted, #9aa3ad);
  --grid-scrollbar-thumb-hover-color: var(--ui-grid-muted, #7b8490);
  /* 00000000-0000-0000-0000-000000000000
     2026-07-20 11:52 KST
     460222e2-6229-4baf-977d-05132ec34626
     수평 스크롤바 축소(50%) 상태: 트랙/썸 회색 더 연하게, 호버 시 본색
     ffffffff-ffff-ffff-ffff-ffffffffffff */
  --grid-scrollbar-track-collapsed-color: var(--ui-grid-header-bg, #f3f5f7);
  --grid-scrollbar-thumb-collapsed-color: var(--ui-grid-border, #c8cfd6);
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-20 11:55 KST
   4320c28b-4fb5-40ad-a05a-6aa12a6f23d3
   수평 스크롤: 레이아웃은 50% 고정, viewport 호버 시에만 위로 확대(그리드 리플로우 없음)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag .ag-body-horizontal-scroll {
  position: relative;
  overflow: visible;
  z-index: 2;
  min-height: var(--grid-scrollbar-horizontal-size) !important;
  max-height: var(--grid-scrollbar-horizontal-size) !important;
  height: var(--grid-scrollbar-horizontal-size) !important;
}

.common-grid-ag .ag-body-horizontal-scroll-viewport {
  min-height: var(--grid-scrollbar-horizontal-size) !important;
  max-height: var(--grid-scrollbar-horizontal-size) !important;
  height: var(--grid-scrollbar-horizontal-size) !important;
}

.common-grid-ag .ag-body-horizontal-scroll-viewport:hover {
  min-height: var(--grid-scrollbar-size) !important;
  max-height: var(--grid-scrollbar-size) !important;
  height: var(--grid-scrollbar-size) !important;
  margin-top: calc(var(--grid-scrollbar-horizontal-size) - var(--grid-scrollbar-size));
  z-index: 5;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-23 16:39 KST
   b20cc922-e554-44e7-aa36-9d7fc82bd08a
   수평 스크롤바 호버 확대 transition 제거(즉시 반영)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag .ag-body-horizontal-scroll-viewport:active,
.common-grid-ag .ag-body-horizontal-scroll-viewport.midas-scrollbar-dragging {
  min-height: var(--grid-scrollbar-size) !important;
  max-height: var(--grid-scrollbar-size) !important;
  height: var(--grid-scrollbar-size) !important;
  margin-top: calc(var(--grid-scrollbar-horizontal-size) - var(--grid-scrollbar-size));
  z-index: 5;
}

.common-grid-ag .ag-body-horizontal-scroll-viewport:active::-webkit-scrollbar,
.common-grid-ag .ag-body-horizontal-scroll-viewport.midas-scrollbar-dragging::-webkit-scrollbar {
  height: var(--grid-scrollbar-size) !important;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-06-29 12:00 */
/* 4e8b1c2d-9f3a-4b7e-a1d6-5c0f8e2b7a91 */
/* scrollX/scrollY=false 시 TUI no-scroll-x/y와 동일하게 스크롤바 영역 숨김 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-no-scroll-x .ag-body-horizontal-scroll,
.common-grid-ag.midas-grid-no-scroll-x .ag-body-horizontal-scroll-viewport {
  display: none !important;
  min-height: 0 !important;
  max-height: 0 !important;
  height: 0 !important;
}

.common-grid-ag.midas-grid-no-scroll-y .ag-body-vertical-scroll,
.common-grid-ag.midas-grid-no-scroll-y .ag-body-vertical-scroll-viewport {
  display: none !important;
  min-width: 0 !important;
  max-width: 0 !important;
  width: 0 !important;
}

/* CSS 표준 스크롤바 간섭 제거 */

.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar {
  display: block !important;
  -webkit-appearance: none;
  appearance: none;
  width: var(--grid-scrollbar-size) !important;
  height: var(--grid-scrollbar-horizontal-size) !important;
}

.common-grid-ag .ag-body-horizontal-scroll-viewport:hover::-webkit-scrollbar {
  height: var(--grid-scrollbar-size) !important;
}

.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track {
  background-color: var(--grid-scrollbar-track-collapsed-color);
}

.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb {
  background-color: var(--grid-scrollbar-thumb-collapsed-color);
  border: none;
  border-radius: var(--ui-radius-pill, 999px);
  box-shadow: none;
  min-width: 60px;
}

.common-grid-ag .ag-body-horizontal-scroll-viewport:hover::-webkit-scrollbar-track {
  background-color: var(--grid-scrollbar-track-color);
}

.common-grid-ag .ag-body-horizontal-scroll-viewport:hover::-webkit-scrollbar-thumb {
  background-color: var(--grid-scrollbar-thumb-color);
}

.common-grid-ag .ag-body-horizontal-scroll-viewport:hover::-webkit-scrollbar-thumb:hover {
  background-color: var(--grid-scrollbar-thumb-hover-color);
}

.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-button,
.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-button:single-button,
.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-button:horizontal:start:decrement,
.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-button:horizontal:end:increment {
  -webkit-appearance: none;
  appearance: none;
  display: none;
  width: 0 !important;
  height: 0 !important;
  background: transparent;
}

.common-grid-ag .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-corner {
  background-color: var(--grid-scrollbar-track-collapsed-color);
}

.common-grid-ag .ag-body-horizontal-scroll-viewport:hover::-webkit-scrollbar-corner {
  background-color: var(--grid-scrollbar-track-color);
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-10 10:20 KST
   8dffed25-d469-4caa-8c8c-9f1e121c5f5d
   그리드 폰트를 html font-size(1rem)에 직접 연동
   (alpine .ag-row calc(+1px) 덮어쓰기 방지)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-17 12:35 KST
   a4c8e2b1-7d39-4f16-9a50-8e1c3b6d0f47
   그리드 글꼴을 환경설정 --default-font-family 에 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 17:22 KST
// 2f6db7bf-5f4d-473d-a0d9-7994dcce63f0
// 공통 그리드 기본 행과 헤더 높이를 4px 축소
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
.common-grid-ag.midas-grid-skin {
  --ag-font-family: var(--default-font-family);
  --ag-font-size: 1rem;
  --ag-header-font-size: 1rem;
  font-size: 1rem;
  --ag-header-height: 26px;
  --ag-row-height: 26px;
  --ag-header-background-color: var(--ui-grid-header-bg, #f7f7f8);
  --ag-foreground-color: var(--ui-grid-text, #2a2f36);
  --ag-background-color: var(--ui-grid-surface, #ffffff);
  --ag-borders: none;
  --ag-border-color: var(--ui-grid-border, #dfe0e3);
  --ag-row-border-color: var(--ui-grid-border, #eeeeef);
  /* 열 구분선은 쓰지 않되 1px 폭은 유지 → 포커스 보더 토글 시 레이아웃 고정 */
  --ag-cell-horizontal-border: solid transparent;
  --ag-header-column-separator-color: transparent;
  --ag-header-column-separator-display: none;
  --ag-pinned-column-border: none;
  --ag-header-column-separator-height: 100%;
  --ag-checkbox-checked-color: var(--ui-grid-primary, #2b86df);
  --ag-selected-row-background-color: var(--ui-grid-active-bg, #f4c430);
  --ag-odd-row-background-color: var(--ui-grid-surface, #ffffff);
  --ag-even-row-background-color: var(--ui-grid-surface, #ffffff);
  --grid-scrollbar-size: 18px;
  --grid-scrollbar-horizontal-size: calc(var(--grid-scrollbar-size) * 0.7);
  --grid-scrollbar-vertical-size: calc(var(--grid-scrollbar-size) * 0.7);
  --grid-scrollbar-track-color: var(--ui-grid-on-primary, #ffffff);
  --grid-scrollbar-thumb-color: var(--ui-grid-muted, #8d8d8d);
  --grid-scrollbar-thumb-hover-color: var(--ui-grid-muted, #737373);
  --grid-scrollbar-track-collapsed-color: var(--ui-grid-on-primary, #ffffff);
  --grid-scrollbar-thumb-collapsed-color: var(--ui-grid-border, #c8c8c8);
  /* 00000000-0000-0000-0000-000000000000
     2026-07-20 15:06 KST
     91566316-8a0e-469e-bb42-6630d15fd279
     행 호버 배경 제거: CSS변수 + AG Grid ::before 오버레이까지 비활성
     ffffffff-ffff-ffff-ffff-ffffffffffff */
  --ag-row-hover-color: var(--ui-grid-hover, #eaf2fe);
  --ag-column-hover-color: transparent;
}

.common-grid-ag.midas-grid-skin .ag-row-hover:not(.ag-full-width-row) .ag-grid-pinned-left-cells::before,
.common-grid-ag.midas-grid-skin .ag-row-hover:not(.ag-full-width-row) .ag-grid-pinned-right-cells::before,
.common-grid-ag.midas-grid-skin .ag-row-hover:not(.ag-full-width-row) .ag-grid-scrolling-cells::before,
.common-grid-ag.midas-grid-skin .ag-row-hover.ag-full-width-row.ag-row-group::before {
  background-color: transparent !important;
  background-image: none !important;
}

.common-grid-ag.midas-grid-skin .ag-row,
.common-grid-ag.midas-grid-skin .ag-cell,
.common-grid-ag.midas-grid-skin .ag-header-cell,
.common-grid-ag.midas-grid-skin .ag-header-cell-text,
.common-grid-ag.midas-grid-skin .ag-cell .ag-cell-value {
  font-size: 1rem !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-14 14:54 KST
   8f2c1a47-6d9e-4b03-a5c8-1e7b0d4f9a26
   그리드 숫자 가로폭 고정(tabular-nums) — 표 정렬 시 숫자 흔들림 방지
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-17 12:35 KST
   a4c8e2b1-7d39-4f16-9a50-8e1c3b6d0f47
   그리드 셀 글꼴을 환경설정 기본 글꼴로 적용
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag,
.common-grid-ag .ag-cell,
.common-grid-ag .ag-cell .ag-cell-value,
.common-grid-ag .ag-header-cell,
.common-grid-ag .ag-header-cell-text,
.common-grid-ag .ag-input-field-input,
.common-grid-ag .midas-date-cell-editor__input {
  font-family: var(--default-font-family);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.common-grid-ag.midas-grid-skin.selection-unit-row {
  --ag-range-selection-border-color: transparent;
  --ag-range-selection-border-style: none;
}

.common-grid-ag.midas-grid-skin.selection-unit-row .ag-cell.ag-cell-focus:not(.ag-cell-inline-editing),
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-cell.ag-cell-focus:not(.ag-cell-inline-editing):focus-within,
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-cell-range-single-cell,
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-cell-range-single-cell.ag-cell-range-handle {
  border: 1px solid transparent !important;
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

.common-grid-ag.midas-grid-skin .ag-root-wrapper {
  border: none !important;
  border-radius: var(--ui-radius-menu, 6px) !important;
}

.common-grid-ag.midas-grid-skin .ag-header,
.common-grid-ag.midas-grid-skin .ag-pinned-left-header,
.common-grid-ag.midas-grid-skin .ag-header-viewport,
.common-grid-ag.midas-grid-skin .ag-header-container {
  background-color: var(--ui-grid-surface, #ffffff) !important;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-06-25 17:31 */
/* dc243f0b-5545-4995-aea7-8732c14a9bb1 */
/* 그리드 타이틀 행 배경색 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin .ag-header-row,
.common-grid-ag.midas-grid-skin .ag-header-cell,
.common-grid-ag.midas-grid-skin .ag-header-cell-comp-wrapper,
.common-grid-ag.midas-grid-skin .ag-header-cell-label {
  background-color: var(--ui-grid-header-bg, #f7f7f8) !important;
  /* #ebebeb, #f8f8f8 */
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-06-26 01:20 */
/* f1b3d5e7-9a2c-4d6f-8b1e-3c5a7d9e2f40 */
/* row 선택 모드에서 단일 클릭 포커스 행도 즉시 회색 배경 표시 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-row.midas-row-focused,
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-row.midas-row-focused .ag-cell {
  background-color: var(--ui-grid-active-bg, #f4c430) !important;
  color: var(--midas-grid-row-forecolor, var(--midas-grid-column-text, var(--ui-grid-active-text, #1a1d22)));
}


/* 00000000-0000-0000-0000-000000000000
   2026-07-29 09:06 KST
   3a8f1c2e-6d4b-4e9a-b2c7-5f0e8a1d9c36
   그리드 타이틀행 하단: 연한 실선
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin .ag-header {
  border-bottom: 1px solid var(--ui-grid-border, #dfe0e3) !important;
}

.common-grid-ag.midas-grid-skin .ag-header-row {
  border-bottom: none;
}

.common-grid-ag.midas-grid-skin .ag-row {
  border-bottom: 1px solid var(--ui-grid-border, #eeeeef) !important;
  color: var(--ui-grid-text, #2a2f36);
  background-color: var(--ui-grid-surface, #ffffff);
}

.common-grid-ag.midas-grid-skin .ag-grid-scrolling-rows,
.common-grid-ag.midas-grid-skin .ag-grid-pinned-top-rows,
.common-grid-ag.midas-grid-skin .ag-grid-pinned-bottom-rows {
  background-color: var(--ui-grid-surface, #ffffff);
}

.common-grid-ag.midas-grid-skin .ag-row::after {
  background-color: inherit;
}

/* AG Grid의 행 내부 경계선은 외부 행 경계선과 중복하지 않는다. */
.common-grid-ag.midas-grid-skin .ag-row > .ag-grid-scrolling-cells,
.common-grid-ag.midas-grid-skin .ag-row > .ag-grid-pinned-left-cells,
.common-grid-ag.midas-grid-skin .ag-row > .ag-grid-pinned-right-cells {
  border-bottom: none;
}

.common-grid-ag.midas-grid-skin .ag-cell-normal-height:not(.midas-tree-cell) {
  line-height: calc(var(--ag-line-height, var(--ag-row-height)) - var(--ag-row-border-width, 1px) - 2px);
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-06-25 17:34 */
/* 642ad38e-2f21-4f4e-8814-42226e8a4902 */
/* 데이터가 없을 때 중앙에 표시되는 No Rows To Show 오버레이 숨김 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag .ag-overlay-no-rows-wrapper,
.common-grid-ag .ag-overlay {
  display: none !important;
}

.common-grid-ag.midas-grid-skin .ag-cell[col-id='ag-Grid-SelectionColumn'],
.common-grid-ag.midas-grid-skin .ag-cell[col-id='__rowSelection__'] {
  border-right: none !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-21 09:05 KST
   c5ace4e7-4156-4e01-8bf5-6b9b4f4dd0b1
   체크열 포커스: border-right:none 으로 파란 테두리 우측이 안 그려지는 문제 보정
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin.selection-unit-cell .ag-cell.ag-cell-focus[col-id='ag-Grid-SelectionColumn']:not(.ag-cell-inline-editing),
.common-grid-ag.midas-grid-skin.selection-unit-cell .ag-cell.ag-cell-focus[col-id='__rowSelection__']:not(.ag-cell-inline-editing) {
  border-right: 1px solid var(--ag-range-selection-border-color, var(--ui-grid-primary, #2196f3)) !important;
  z-index: 1;
}

.common-grid-ag.midas-grid-skin .ag-row.ag-row-selected,
.common-grid-ag.midas-grid-skin .ag-row.ag-row-selected .ag-cell {
  background-color: var(--ui-grid-active-bg, #f4c430) !important;
  color: var(--midas-grid-row-forecolor, var(--midas-grid-column-text, var(--ui-grid-active-text, #1a1d22)));
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-16 17:55 KST */
/* 9d22b1e4-836c-4b02-b0fc-f105d31df769 */
/* 체크박스 선택(회색)보다 클릭 포커스 행(노랑) 우선 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-row.ag-row-selected.midas-row-focused,
.common-grid-ag.midas-grid-skin.selection-unit-row .ag-row.ag-row-selected.midas-row-focused .ag-cell {
  background-color: var(--ui-grid-active-bg, #f4c430) !important;
}



.common-grid-ag.midas-grid-skin .ag-row.editedRow .ag-cell,
.common-grid-ag.midas-grid-skin .ag-row.editedRow .ag-cell .ag-cell-value {
  color: var(--edited-row-text-color, var(--ui-grid-danger, #dc2626));
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-18 12:26 KST */
/* 1d174e63-2da7-4e54-9c0a-303d1a1d4fe6 */
/* selectionUnit=cell 클릭/선택 셀도 row 포커스와 동일 노랑 배경 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin.selection-unit-cell .ag-cell.midas-cell-selected {
  background-color: var(--ui-grid-active-bg, #f4c430) !important;
  color: var(--midas-grid-row-forecolor, var(--midas-grid-column-text, var(--ui-grid-active-text, #1a1d22)));
}

.common-grid-ag.midas-grid-skin .ag-cell-editor.ag-select .ag-picker-field-display {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  border-radius: var(--ui-radius-none, 0) !important;
}

.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing.ag-cell-focus:focus-within {
  border: none !important;
  outline: none !important;
}

.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing .ag-cell-edit-wrapper,
.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing .ag-cell-editor {
  height: 100%;
  width: 100%;
}

.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing .ag-input-field-input,
.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing .ag-input-field-input:focus,
.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing .ag-input-field-input:focus-visible {
  height: 100%;
  min-height: 100%;
  width: 100%;
  border: 1px solid var(--ui-grid-primary, #0066ff) !important;
  border-radius: var(--ui-radius-none, 0);
  box-shadow: none !important;
  outline: none !important;
  background-color: var(--ui-grid-surface, #ffffff);
}

.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing:has(.ag-cell-editor.ag-select) .ag-picker-field-wrapper,
.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing:has(.ag-cell-editor.ag-select) .ag-picker-field-wrapper:focus-within,
.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing:has(.ag-cell-editor.ag-select) .ag-picker-field-wrapper.ag-picker-has-focus {
  min-height: 100%;
  height: 100%;
  border: 1px solid var(--ui-grid-primary, #0066ff) !important;
  border-radius: var(--ui-radius-none, 0);
  box-shadow: none !important;
  background-color: var(--ui-grid-surface, #ffffff);
}

.common-grid-ag.midas-grid-skin .ag-cell.ag-cell-inline-editing:has(.midas-date-cell-editor) .midas-date-cell-editor {
  display: flex;
  align-items: stretch;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border: 1px solid var(--ui-grid-primary, #0066ff);
  background-color: var(--ui-grid-surface, #ffffff);
}

.common-grid-ag.midas-grid-skin .midas-date-cell-editor__input {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  border-radius: var(--ui-radius-none, 0);
  background-color: var(--ui-grid-surface, #ffffff);
  padding-left: 5px;
  padding-right: 4px;
}

.common-grid-ag.midas-grid-skin .midas-date-cell-editor__input:focus,
.common-grid-ag.midas-grid-skin .midas-date-cell-editor__input:focus-visible {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.common-grid-ag.midas-grid-skin .midas-date-cell-editor__button {
  flex: 0 0 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  border: none;
  border-left: 1px solid var(--ui-grid-border, #c9ced5);
  background-color: var(--ui-grid-header-bg, #f3f4f6);
  color: var(--ui-grid-muted, #4b5563);
  cursor: pointer;
  padding: 0;
}

.common-grid-ag.midas-grid-skin .midas-date-cell-editor__button:hover {
  background-color: var(--ui-grid-border, #e5e7eb);
  color: var(--ui-grid-primary, #2b86df);
}

.common-grid-ag.midas-grid-skin .ag-cell.midas-select-action-cell {
  padding-left: 1 !important;
  padding-right: 1 !important;
}

.common-grid-ag.midas-grid-skin .midas-select-action-cell-renderer {
  display: flex;
  align-items: stretch;
  width: 100%;
  height: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.common-grid-ag.midas-grid-skin .midas-select-action-cell-renderer__value {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-left: 5px;
  padding-right: 4px;
  line-height: inherit;
}

.common-grid-ag.midas-grid-skin .midas-select-action-cell-renderer__button {
  flex: 0 0 28px;
  display: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  border: none;
  border-left: 1px solid var(--ui-grid-border, #c9ced5);
  background-color: var(--ui-grid-primary, #2b86df);
  color: var(--ui-grid-on-primary, #ffffff);
  cursor: pointer;
  padding: 0;
  font-size: 22px;
  font-weight: 0;
  letter-spacing: -2px;
  line-height: 1;
}

.common-grid-ag.midas-grid-skin .ag-cell-focus.midas-select-action-cell .midas-select-action-cell-renderer__button,
.common-grid-ag.midas-grid-skin .ag-cell.midas-select-action-cell.midas-cell-selected .midas-select-action-cell-renderer__button {
  display: inline-flex;
}

.common-grid-ag.midas-grid-skin .midas-select-action-cell-renderer__button:hover {
  background-color: var(--ui-grid-primary-hover, #1f6ec0);
}

.common-grid-ag.midas-grid-skin .ag-cell.midas-tree-cell {
  padding-left: 0 !important;
  padding-right: 0 !important;
  line-height: normal;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-10 14:58 KST
   e2b9f4a1-6c3d-4e8b-9a15-7d0c2f8e5b64
   트리셀 absolute/relative 해킹 제거 — AG Grid 셀 position:absolute 깨져 엉뚱한 열에 그려지던 문제 수정
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin .ag-cell.midas-tree-cell .ag-cell-wrapper,
.common-grid-ag.midas-grid-skin .ag-cell.midas-tree-cell .ag-cell-value {
  width: 100%;
  height: 100%;
  min-width: 0;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-11 10:47 KST
   dd217533-c62f-418e-8af1-bb42670f7b68
   트리 가이드선: border 서브픽셀(0.1px)은 1px로 고정되므로 width/height+gradient로 굵기 적용
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer {
  --midas-tree-indent: 16px;
  --midas-tree-line: #9aa3b2;
  --midas-tree-line-width: 1px;
  --midas-tree-line-dash: 3px;
  --midas-tree-line-gap: 2px;
  --midas-tree-line-v: repeating-linear-gradient(
    to bottom,
    var(--midas-tree-line) 0,
    var(--midas-tree-line) var(--midas-tree-line-dash),
    transparent var(--midas-tree-line-dash),
    transparent calc(var(--midas-tree-line-dash) + var(--midas-tree-line-gap))
  );
  --midas-tree-line-h: repeating-linear-gradient(
    to right,
    var(--midas-tree-line) 0,
    var(--midas-tree-line) var(--midas-tree-line-dash),
    transparent var(--midas-tree-line-dash),
    transparent calc(var(--midas-tree-line-dash) + var(--midas-tree-line-gap))
  );
  display: flex;
  align-items: stretch;
  width: 100%;
  height: 100%;
  min-width: 0;
  box-sizing: border-box;
  line-height: normal;
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__guide,
.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__node {
  flex: none;
  position: relative;
  width: var(--midas-tree-indent);
  align-self: stretch;
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__guide--line::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: var(--midas-tree-line-width);
  background: var(--midas-tree-line-v);
  transform: translateX(-50%);
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__guide--branch::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  height: 50%;
  width: var(--midas-tree-line-width);
  background: var(--midas-tree-line-v);
  transform: translateX(-50%);
}

.common-grid-ag.midas-grid-skin
  .midas-tree-cell-renderer__guide--branch:not(.midas-tree-cell-renderer__guide--last)::before {
  height: 100%;
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__guide--branch::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  right: 0;
  height: var(--midas-tree-line-width);
  background: var(--midas-tree-line-h);
  transform: translateY(-50%);
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__node {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__node--expanded::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: 0;
  width: var(--midas-tree-line-width);
  background: var(--midas-tree-line-v);
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 0;
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__node--leaf::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 50%;
  height: var(--midas-tree-line-width);
  background: var(--midas-tree-line-h);
  transform: translateY(-50%);
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__toggle {
  position: relative;
  z-index: 1;
  flex: none;
  width: 12px;
  height: 12px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--ui-grid-muted, #8a94a6);
  border-radius: var(--ui-radius-tight, 2px);
  background: var(--ui-grid-surface, #ffffff);
  color: var(--ui-grid-text, #2a2f36);
  font-size: 10px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__toggle:hover {
  background: var(--ui-grid-header-bg, #eceff4);
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__toggle-spacer {
  flex: none;
  width: 12px;
  height: 12px;
}

.common-grid-ag.midas-grid-skin .midas-tree-cell-renderer__value {
  flex: 1;
  min-width: 0;
  margin-left: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: flex;
  align-items: center;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-20 17:05 KST
   a8edb1dc-75e3-47ef-b31a-b581eaa1c0eb
   select 팝업 body 호스트 + z-index 상향(스플리터 overflow 잘림 방지)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.midas-grid-popup-host {
  position: fixed;
  inset: 0;
  z-index: 10050;
  overflow: visible !important;
  pointer-events: none;
}

.midas-grid-popup-host .ag-popup,
.midas-grid-popup-host .ag-popup-child,
.common-grid-ag .ag-popup,
.common-grid-ag .ag-popup-child {
  z-index: 10051 !important;
  pointer-events: auto;
}

.common-grid-ag.midas-grid-skin .ag-popup .ag-select-list.midas-select-list-resizable,
.midas-grid-popup-host .ag-popup .ag-select-list.midas-select-list-resizable {
  min-width: 180px;
  max-width: min(560px, 92vw);
  min-height: 120px;
  max-height: 400px;
  overflow: auto;
}

.common-grid-ag.midas-grid-skin .ag-popup .midas-select-list-resize-handle,
.midas-grid-popup-host .ag-popup .midas-select-list-resize-handle {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 5;
  width: 14px;
  height: 14px;
  cursor: nwse-resize;
  background: linear-gradient(
    135deg,
    transparent 0 45%,
    var(--ui-grid-muted, #8d98a5) 45% 55%,
    transparent 55% 65%,
    var(--ui-grid-muted, #8d98a5) 65% 75%,
    transparent 75% 100%
  );
}

.common-grid-ag.midas-grid-skin .ag-popup .ag-select-list-item,
.midas-grid-popup-host .ag-popup .ag-select-list-item {
  min-width: max-content;
}

.common-grid-ag.midas-grid-skin .ag-popup .ag-select-list-item-text,
.midas-grid-popup-host .ag-popup .ag-select-list-item-text {
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

.common-grid-ag.midas-grid-skin .ag-popup .ag-select-list-item.midas-select-original-value,
.midas-grid-popup-host .ag-popup .ag-select-list-item.midas-select-original-value {
  background-color: var(--ui-grid-original-value-bg, #fff3b0) !important;
}

.common-grid-ag.midas-grid-skin .ag-popup .ag-select-list-item.ag-active-item:not(.midas-select-original-value),
.midas-grid-popup-host .ag-popup .ag-select-list-item.ag-active-item:not(.midas-select-original-value) {
  background-color: var(--ui-grid-selected, #dce3eb);
}

.common-grid-ag.midas-grid-skin.midas-cell-dragging {
  cursor: cell;
  user-select: none;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 09:52 KST
// 5f76c25a-5e7b-4a49-a368-fa17d75c301a
// 시안 기준 공통 회원검색과 사이드 메뉴 확장 및 드롭다운·그리드 스타일 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
.common-grid-ag.midas-grid-skin .ag-pinned-left-header,
.common-grid-ag.midas-grid-skin .ag-pinned-right-header {
  border-left: none;
  border-right: none;
}

.common-grid-ag.midas-grid-skin .ag-header-cell,
.common-grid-ag.midas-grid-skin .ag-header-group-cell {
  border-left: none;
  border-right: 1px solid var(--ui-grid-border, #dfe0e3);
}

.common-grid-ag.midas-grid-skin .ag-header-cell.ag-column-last {
  border-right: 1px solid var(--ui-grid-border, #dfe0e3);
}

/* 열 폭 조절 핸들의 실제 클릭 영역을 넓혀 드래그 놓침을 줄인다. */
.common-grid-ag.midas-grid-skin .ag-header-cell-resize {
  right: -9px;
  width: 18px;
  top: 0;
  bottom: 0;
  cursor: col-resize;
  z-index: 3;
  border: none !important;
  background: transparent !important;
}

/* 기본 테마 핸들 마커는 숨기고, 긴 단일 라인 마커만 보여준다. */
.common-grid-ag.midas-grid-skin .ag-header-cell-resize::before {
  content: none !important;
  display: none !important;
}

.common-grid-ag.midas-grid-skin .ag-header-cell-resize::after {
  content: none !important;
  display: none !important;
}

.common-grid-ag.midas-grid-skin .ag-header-cell-resize:hover::after,
.common-grid-ag.midas-grid-skin .ag-header-cell-resize:active::after {
  content: none !important;
  display: none !important;
}

.common-grid-ag.midas-grid-skin .ag-cell {
  box-sizing: border-box;
  color: var(--midas-grid-row-forecolor, var(--midas-grid-column-text, inherit));
  background-color: transparent;
  padding-left: 8px !important;
  padding-right: 8px !important;
  /* AG 기본 1px 투명 보더 유지(포커스 시 border 제거하면 텍스트가 밀림) */
  border: 1px solid transparent;
  border-right-color: transparent;
  user-select: none;
}

.common-grid-ag.midas-grid-skin .ag-cell .ag-cell-wrapper,
.common-grid-ag.midas-grid-skin .ag-cell .ag-cell-value {
  padding-left: 0 !important;
  padding-right: 0 !important;
  color: inherit;
}

.common-grid-ag.midas-grid-skin .ag-pinned-left-cols-container .ag-cell[col-id='ag-Grid-SelectionColumn'],
.common-grid-ag.midas-grid-skin .ag-pinned-left-cols-container .ag-cell[col-id='__rowSelection__'] {
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.common-grid-ag.midas-grid-skin .ag-header-cell-text {
  color: var(--ui-grid-text, #2a2f36);
}

.common-grid-ag.midas-grid-skin .ag-icon {
  color: var(--ui-grid-muted, #8b9198);
}

.common-grid-ag.midas-grid-skin .ag-selection-checkbox .ag-checkbox-input-wrapper,
.common-grid-ag.midas-grid-skin .ag-header-select-all .ag-checkbox-input-wrapper {
  width: 14px;
  height: 14px;
  border: 1px solid var(--ui-grid-muted, #bcc2ca);
  background: var(--ui-grid-surface, #f7f8fa);
}

.common-grid-ag.midas-grid-skin .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-checked,
.common-grid-ag.midas-grid-skin .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-indeterminate,
.common-grid-ag.midas-grid-skin .ag-header-select-all .ag-checkbox-input-wrapper.ag-checked,
.common-grid-ag.midas-grid-skin .ag-header-select-all .ag-checkbox-input-wrapper.ag-indeterminate {
  border-color: var(--ui-grid-primary, #0066ff);
  background: linear-gradient(var(--ui-grid-primary, #0066ff), var(--ui-grid-primary, #0066ff)) center / 8px 8px no-repeat, var(--ui-grid-surface, #ffffff);
}

.common-grid-ag.midas-grid-skin .ag-pinned-left-cols-container .ag-cell {
  background-color: transparent;
}

.common-grid-ag.midas-grid-skin .ag-body-horizontal-scroll {
  min-height: var(--grid-scrollbar-horizontal-size) !important;
  max-height: var(--grid-scrollbar-horizontal-size) !important;
  height: var(--grid-scrollbar-horizontal-size) !important;
}

.common-grid-ag.midas-grid-skin .ag-body-horizontal-scroll-viewport {
  min-height: var(--grid-scrollbar-horizontal-size) !important;
  max-height: var(--grid-scrollbar-horizontal-size) !important;
  height: var(--grid-scrollbar-horizontal-size) !important;
}

.common-grid-ag.midas-grid-skin .ag-body-horizontal-scroll-viewport:hover {
  min-height: var(--grid-scrollbar-size) !important;
  max-height: var(--grid-scrollbar-size) !important;
  height: var(--grid-scrollbar-size) !important;
  margin-top: calc(var(--grid-scrollbar-horizontal-size) - var(--grid-scrollbar-size));
}


.common-grid-ag.midas-grid-skin .ag-body-horizontal-scroll:not(.ag-scrollbar-invisible) .ag-horizontal-left-spacer:not(.ag-scroller-corner) {
    display: none !important;
}

.midas-grid-context-menu {
  min-width: 148px;
  padding: 4px 0;
  border: 1px solid var(--ui-grid-border, #c9ced5);
  border-radius: var(--ui-radius-menu, 6px);
  background-color: var(--ui-grid-surface, #ffffff);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.16);
}

.midas-grid-context-menu__item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: none;
  background: transparent;
  color: var(--ui-grid-text, #2a2f36);
  font: inherit;
  font-size: 14px;
  line-height: 1.2;
  text-align: left;
  padding: 8px 14px;
  cursor: pointer;
}

.midas-grid-context-menu__icon {
  flex: none;
  width: 20px;
  height: 20px;
  color: var(--ui-grid-muted, #4b5563);
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-26 06:15 KST
   a7c3e9d1-4b58-4f2a-8c16-9e0d5b7a3f24
   그리드 컨텍스트 메뉴 엑셀내보내기 아이콘을 녹색으로 표시
   ffffffff-ffff-ffff-ffff-ffffffffffff */
.midas-grid-context-menu__icon.midas-grid-context-menu__icon--excel {
  color: #217346;
}

.midas-grid-context-menu__label {
  flex: 1;
  min-width: 0;
}

.midas-grid-context-menu__separator {
  height: 1px;
  margin: 4px 0;
  background-color: var(--ui-grid-hover, #d3d7dc);
}

.midas-grid-context-menu__item:hover,
.midas-grid-context-menu__item:focus-visible {
  background-color: var(--ui-grid-selected, #eaf2fe);
  outline: none;
}



.midas-grid-context-menu--columns {
  min-width: 260px;
  padding: 0;
}



.midas-grid-column-panel {
  display: flex;
  flex-direction: column;
  min-width: 260px;
  max-height: 360px;
}



.midas-grid-column-panel__search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 12px 6px;
  padding: 6px 10px;
  border: 1px solid var(--ui-grid-primary, #1a73e8);
  border-radius: var(--ui-input-radius, 4px);
  background: var(--ui-grid-surface, #ffffff);
}



.midas-grid-column-panel__search-icon {
  flex: none;
  color: var(--ui-grid-muted, #5f6368);
}



.midas-grid-column-panel__search-input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--ui-grid-text, #202124);
  font: inherit;
  font-size: 13px;
  line-height: 1.3;
}



.midas-grid-column-panel__search-input::placeholder {
  color: #9aa0a6;
}



.midas-grid-column-panel__list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 4px 0;
}



.midas-grid-column-panel__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 14px;
  cursor: pointer;
  color: var(--ui-grid-text, #202124);
  font-size: 13px;
  line-height: 1.3;
  user-select: none;
}



.midas-grid-column-panel__item:hover {
  background-color: var(--ui-grid-hover, #f1f3f4);
}



.midas-grid-column-panel__checkbox {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--ui-grid-primary, #1a73e8);
  cursor: pointer;
}



.midas-grid-column-panel__item-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}



.midas-grid-column-panel__empty {
  padding: 16px 14px;
  color: #80868b;
  font-size: 13px;
}



.midas-grid-column-panel__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px 10px;
  border-top: 1px solid var(--ui-grid-border, #e0e3e7);
}



.midas-grid-column-panel__show-all {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  color: var(--ui-grid-text, #202124);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  padding: 0;
}



.midas-grid-column-panel__show-all-icon {
  width: 16px;
  height: 16px;
  border: 1.5px solid var(--ui-grid-muted, #5f6368);
  border-radius: var(--ui-radius-tight, 2px);
  box-sizing: border-box;
  background: var(--ui-grid-surface, #ffffff);
  position: relative;
}



.midas-grid-column-panel__show-all-icon.is-checked {
  border-color: var(--ui-grid-primary, #1a73e8);
  background: var(--ui-grid-primary, #1a73e8);
}



.midas-grid-column-panel__show-all-icon.is-checked::after {
  content: '';
  position: absolute;
  left: 4px;
  top: 1px;
  width: 4px;
  height: 8px;
  border: solid var(--ui-grid-surface, #ffffff);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}



.midas-grid-column-panel__show-all-icon.is-indeterminate {
  border-color: var(--ui-grid-primary, #1a73e8);
  background: var(--ui-grid-primary, #1a73e8);
}



.midas-grid-column-panel__show-all-icon.is-indeterminate::after {
  content: '';
  position: absolute;
  left: 3px;
  top: 6px;
  width: 8px;
  height: 2px;
  background: var(--ui-grid-surface, #ffffff);
}



.midas-grid-column-panel__reset {
  border: 0;
  background: transparent;
  color: var(--ui-grid-primary, #1a73e8);
  font: inherit;
  font-size: 12px;
  font-weight: var(--app-font-weight-bold);
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 0;
}



.midas-grid-column-panel__reset:hover {
  text-decoration: underline;
}



.common-grid-ag.midas-grid-skin .ag-header-cell-text {
  color: var(--ui-grid-header-text, #374151);
  font-size: 1rem !important;
  font-weight: 700;
}

.common-grid-ag.midas-grid-skin .ag-row:not(.ag-row-selected):not(.midas-row-focused):hover {
  background-color: var(--ui-grid-hover, #eaf2fe);
}

.common-grid-ag.midas-grid-skin.selection-unit-row:focus-within .midas-row-focused {
  box-shadow: inset 3px 0 0 var(--ui-grid-primary, #0066ff);
}

.common-grid-ag.midas-grid-skin.selection-unit-cell .ag-cell.midas-cell-selected {
  outline: 1px solid var(--ui-grid-primary, #0066ff);
  outline-offset: -1px;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 00000000-0000-0000-0000-000000000000
   2026-09-02 18:40 KST
   a3e7c91b-5d48-4f02-8e16-7c0b9a4d2f53
   taskbar package tokens. Host :root overrides win.
   ffffffff-ffff-ffff-ffff-ffffffffffff */
:where(:root) {
  --app-font-size: 14px;
  --app-font-weight: normal;
  --app-font-weight-bold: bold;
  --default-font-family: 'Malgun Gothic', sans-serif;
  --default-font-family-bold: 'Malgun Gothic Bold', 'Malgun Gothic', sans-serif;
  --taskbar-bar-height: 36px;
}

:where(html) {
  font-size: var(--app-font-size, 14px);
}

:where(:root) {
  --ui-surface: #ffffff;
  --ui-text: #2e2f33;
  --ui-muted: #70737c;
  --ui-border: #dfe0e3;
  --ui-canvas: #f7f7f8;
  --ui-selected: #eaf2fe;
  --ui-primary: #0066ff;
  --ui-primary-hover: #005eeb;
  --ui-on-primary: #ffffff;
  --ui-danger: #e52222;
  --ui-danger-tint: #fff1f1;
  --ui-success: #009632;
  --ui-success-tint: #d9ffe6;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 12:39 KST
// 767f32f3-2dc0-4a3d-80a1-98eb1b208d6a
// 다크 모드의 그리드·탭·팝업 색상 대비와 선택 상태 연결 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 16:45 KST
// 279f544a-ad32-447c-9abd-ea50230f4070
// 회원등록 시안 직접 대조 후 레이아웃 및 누락 디자인 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/* 00000000-0000-0000-0000-000000000000
   2026-07-10 11:25 KST
   b61e0c4e-1a92-4062-93a8-34401cedb67f
   작업바 탭 사이즈를 회원등록 탭(32/34px, 1rem)에 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-taskbar_1gcqq_35 {
  position: relative;
  width: auto;
  height: 100%;
  min-height: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

._main-taskbar-list_1gcqq_45 {
  position: relative;
  display: inline-flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: center;
  width: auto;
  min-height: 34px;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 0;
  overflow-x: auto;
  overflow-y: hidden;
  background-color: transparent;
}

._main-taskbar-list_1gcqq_45::-webkit-scrollbar {
  height: 4px;
}

._main-taskbar-list_1gcqq_45::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
  border-radius: var(--ui-radius-tight, 2px);
}

._main-taskbar-item_1gcqq_71 {
  flex: 0 0 auto;
  position: relative;
}

._main-taskbar-tab_1gcqq_76 {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  height: 32px;
  margin: 0;
  border: none;
  border-radius: var(--ui-radius-none, 0);
  background: transparent;
  color: var(--ui-muted, #666);
  overflow: visible;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

._main-taskbar-item_1gcqq_71 + ._main-taskbar-item_1gcqq_71 ._main-taskbar-tab_1gcqq_76:not(._is-active_1gcqq_94)::before {
  content: '|';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: #bdbdbd;
  font-size: 0.95rem;
  pointer-events: none;
}

._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94::before {
  display: none;
}

._main-taskbar-item_1gcqq_71:has(._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94) + ._main-taskbar-item_1gcqq_71 ._main-taskbar-tab_1gcqq_76::before {
  display: none;
}

._main-taskbar-link_1gcqq_113 {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  max-width: 220px;
  height: 32px;
  padding: 4px 10px;
  border: none;
  border-radius: var(--ui-radius-none, 0);
  background: transparent;
  color: var(--ui-muted, #666);
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-24 14:06 KST
   e2b6c9a0-4d1f-4a8e-9c3b-7f0d5e1a2b84
   작업바 바탕화면 버튼 (탭 유지한 채 EmptyDesktopPanel 진입)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-taskbar-desktop-tab_1gcqq_136 {
  cursor: pointer;
}

._main-taskbar-desktop-link_1gcqq_140 {
  gap: 6px;
  max-width: none;
}

._main-taskbar-desktop-link_1gcqq_140 ._main-taskbar-title_1gcqq_145 {
  width: auto;
  text-align: left;
}

._main-taskbar-title_1gcqq_145 {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  font-size: 1rem;
}

._main-taskbar-item_1gcqq_71:has(._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94) {
  z-index: 3;
}

/* 활성탭 배경색 */
._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 {
  z-index: 2;
  height: 34px;
  margin-top: -1px;
  padding: 0;
  border: none;
  border-top: 0;
  border-left: 1px solid #8b8b8b;
  border-right: 1px solid #8b8b8b;
  border-bottom: 2px solid var(--ui-text, #000);
  background-color: #e3e3e3;
  color: var(--ui-text, #333);
  max-width: 240px;
}

._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94::after {
  content: '';
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  height: 2px;
  background-color: #f0f0f0;
  pointer-events: none;
  z-index: 4;
}


._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-link_1gcqq_113 {
  height: 34px;
  padding: 4px 12px 4px 12px;
  background-color: transparent;
  color: var(--ui-text, #333);
}

/* 활성탭 글자색 */
._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-title_1gcqq_145 {
  font-size: 1rem;
  font-weight: var(--app-font-weight-bold);
  color: var(--ui-text, #333);
}

._main-taskbar-close_1gcqq_207 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-right: 4px;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--ui-muted, #888);
  cursor: pointer;
  font-size: 1.5rem;
  font-family: var(--default-font-family-bold), Arial, sans-serif;
  line-height: 1;
  flex: 0 0 auto;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease, color 0.15s ease;
  touch-action: auto;
  user-select: none;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-24 17:10 KST
   7a7f230a-22e1-42f5-bfbb-84e06777a98e
   작업바 탭 드래그: 원위치 빈 슬롯 + 커서 플로팅 미리보기 (EmptyDesktopPanel과 동일 스타일)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-taskbar-list_1gcqq_45._is-list-dragging_1gcqq_235 {
  cursor: grabbing;
  overflow: visible;
}

._main-taskbar-item_1gcqq_71._is-dragging_1gcqq_240 {
  cursor: grabbing;
}

._main-taskbar-item_1gcqq_71._is-dragging_1gcqq_240 ._main-taskbar-tab_1gcqq_76 {
  cursor: grabbing;
  height: 32px;
  margin-top: 0;
  border-color: transparent;
  background: transparent;
  max-width: none;
}

._main-taskbar-item_1gcqq_71._is-dragging_1gcqq_240 ._main-taskbar-tab_1gcqq_76::before,
._main-taskbar-item_1gcqq_71._is-dragging_1gcqq_240 ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94::after {
  display: none;
}

._main-taskbar-item_1gcqq_71._is-dragging_1gcqq_240 ._main-taskbar-link_1gcqq_113,
._main-taskbar-item_1gcqq_71._is-dragging_1gcqq_240 ._main-taskbar-close_1gcqq_207 {
  visibility: hidden;
  pointer-events: none;
}

._main-taskbar-item_1gcqq_71._is-dragging_1gcqq_240::after {
  content: '';
  position: absolute;
  inset: 2px 4px;
  border: 2px dashed var(--ui-muted, #9aa0a6);
  border-radius: var(--ui-radius-compact, 3px);
  background: rgba(232, 234, 237, 0.65);
  pointer-events: none;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 20:50 KST
   8c4f2a71-9e36-4b18-a047-5d1e8c6b3f92
   작업바 드래그 순서조정 시 대상 우측(다음) 경계에 세로 삽입선 표시
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-25 20:52 KST
   a3e7b91c-4d28-4f16-8a05-9c1e0d7b5f42
   카테고리 관리와 같은 삽입선 모양을 유지하고 반투명 처리
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:02 KST
   e5b1d3f7-8a26-4c19-9e04-7d0b2a6c5f48
   점프탭과 같이 대상 다음(우측) 삽입선이 구분선에 가려지지 않게 함
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-taskbar-item_1gcqq_71._is-drag-over_1gcqq_289 {
  z-index: 4;
  overflow: visible;
}

._main-taskbar-item_1gcqq_71._is-drag-over_1gcqq_289::before {
  content: '' !important;
  position: absolute !important;
  top: 8px !important;
  bottom: 8px !important;
  left: auto !important;
  right: -2px !important;
  width: 3px !important;
  height: auto !important;
  border: none !important;
  border-radius: var(--ui-radius-none, 0) !important;
  background: rgba(26, 115, 232, 0.45) !important;
  background-color: rgba(26, 115, 232, 0.45) !important;
  pointer-events: none !important;
  z-index: 5 !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:12 KST
   b9e4c2d6-1a38-4f17-8b05-7d0c3e9a6f42
   카테고리관리처럼 앞쪽이면 왼선에 드롭해 대상 앞에 넣음
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-taskbar-item_1gcqq_71._is-drag-over-before_1gcqq_316::before {
  left: -2px !important;
  right: auto !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 20:56 KST
   c1f8a4d2-6e39-4b17-9c05-8d0a3e7b5f42
   드래그 미리보기 기울기 제거, 드래그 개체는 반투명 표기
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._drag-preview_1gcqq_326 {
  position: fixed;
  z-index: 9000;
  display: inline-flex;
  align-items: center;
  max-width: 220px;
  height: 32px;
  padding: 0 14px;
  border: 1px solid #8b8b8b;
  border-radius: var(--ui-radius-compact, 3px);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 28px rgba(32, 33, 36, 0.28);
  transform: translate(-50%, -60%);
  opacity: 0.7;
  pointer-events: none;
}

._drag-preview-title_1gcqq_343 {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1rem;
  font-weight: var(--app-font-weight-bold);
  color: var(--ui-text, #333);
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:06 KST
   a7d3f1c5-8e29-4b16-9a04-6c0d2e8b5f31
   작업바 밖으로 드롭하면 해당 작업 창을 닫음
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._drag-preview_1gcqq_326._is-drop-close_1gcqq_358 {
  border-color: #c5221f;
}

._drag-preview_1gcqq_326._is-drop-close_1gcqq_358 ._drag-preview-title_1gcqq_343 {
  color: #c5221f;
}

/* 활성탭 닫기 버튼 색상 */
._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-close_1gcqq_207 {
  height: 34px;
  opacity: 1;
  pointer-events: auto;
  color: black;
}

._main-taskbar-item_1gcqq_71:hover ._main-taskbar-close_1gcqq_207 {
  opacity: 1;
  pointer-events: auto;
}

._main-taskbar-close_1gcqq_207:hover {
  color: #a31c1c;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-10 16:27 KST
   a1b2c3d4-e5f6-7890-abcd-ef1234567890
   현재탭 닫기(X) 호버 확대 시 광학 수직 보정
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-close_1gcqq_207:hover {
  
  color: #c62828;
  border-radius: var(--ui-radius-none, 0);
  /*
  font-size: 2rem;
  font-weight: var(--app-font-weight-bold);
  transform: translateY(-2px);
  */
}

@media (max-width: 1024px) {
  html[data-app-layout='responsive'] {
  ._main-taskbar-link_1gcqq_113 {
    max-width: 180px;
    padding: 4px 8px;
  }

  ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 {
    max-width: 200px;
  }

  ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-link_1gcqq_113 {
    padding: 4px 10px;
  }

  ._main-taskbar-title_1gcqq_145 {
    font-size: 1rem;
  }

  ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-title_1gcqq_145 {
    font-size: 1rem;
  }
  }
}


/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 18:06 KST
// 0d31bef6-af32-4879-abb6-d1fa46a6ddd6
// 퀵메뉴 높이와 여백 통일 및 선택·키보드 포커스 효과 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._main-taskbar_1gcqq_35 { display: flex; align-items: center; max-width: 100%; }
._main-taskbar-list_1gcqq_45 { align-items: center; gap: 6px; min-height: 0; max-width: 100%; padding: 2px 0; }
._main-taskbar-tab_1gcqq_76, ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 {
  height: 28px;
  margin: 0;
  border: 1px solid transparent;
  border-radius: var(--ui-radius-menu, 6px);
  color: var(--ui-muted);
  background: var(--ui-surface, #fff);
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 {
  border-color: var(--ui-tab-active-indicator, var(--ui-border));
  background: var(--ui-tab-active-bg, var(--ui-surface));
  box-shadow: 0 1px 3px rgb(23 23 23 / 6%);
}
._main-taskbar-tab_1gcqq_76::before, ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94::after { display: none; }
._main-taskbar-link_1gcqq_113, ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-link_1gcqq_113 {
  box-sizing: border-box;
  height: 26px;
  padding: 0 12px;
  border-radius: var(--ui-radius-menu, 6px);
  color: var(--ui-muted);
}
._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-title_1gcqq_145 { color: var(--ui-text); font-weight: 700; }
._main-taskbar-tab_1gcqq_76:hover:not(._is-active_1gcqq_94) { background: var(--ui-canvas); border-color: var(--ui-border); }
._main-taskbar-link_1gcqq_113:focus-visible, ._main-taskbar-close_1gcqq_207:focus-visible { outline: 2px solid var(--ui-primary); outline-offset: -2px; }
._main-taskbar-close_1gcqq_207, ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-close_1gcqq_207 {
  width: 20px; height: 20px; margin-right: 4px; border-radius: var(--ui-radius-control, 4px); color: var(--ui-muted); font-size: 16px;
}
._main-taskbar-item_1gcqq_71:focus-within ._main-taskbar-close_1gcqq_207 { opacity: 1; pointer-events: auto; }
._main-taskbar-close_1gcqq_207:hover, ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-close_1gcqq_207:hover { border-radius: var(--ui-radius-control, 4px); background: var(--ui-danger-tint); color: var(--ui-danger); }
._main-taskbar-desktop-link_1gcqq_140, ._main-taskbar-tab_1gcqq_76._is-active_1gcqq_94 ._main-taskbar-desktop-link_1gcqq_140 { padding: 0 10px; gap: 7px; justify-content: center; color: var(--ui-muted); }
@media (prefers-reduced-motion: reduce) {
  ._main-taskbar-tab_1gcqq_76, ._main-taskbar-link_1gcqq_113, ._main-taskbar-close_1gcqq_207 { transition: none; }
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 16:45 KST
// 279f544a-ad32-447c-9abd-ea50230f4070
// 회원등록 시안 직접 대조 후 레이아웃 및 누락 디자인 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/* 00000000-0000-0000-0000-000000000000
   2026-07-10 11:25 KST
   b61e0c4e-1a92-4062-93a8-34401cedb67f
   하단 작업바 사이즈를 회원등록 탭에 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-bottom-bar_59qcr_28 {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  width: 100%;
  height: var(--taskbar-bar-height, var(--main-bottom-bar-height, 36px));
  background: #f0f0f0;
  border-top: none;
  box-shadow: none;
  overflow: visible;
}

._main-bottom-bar_59qcr_28._is-embedded_59qcr_42 {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
}

._main-bottom-bar-tab-strip_59qcr_49 {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 0;
  padding-bottom: 2px;
  box-sizing: border-box;
  background: #fffafa;
}

._main-bottom-bar-tab-strip_59qcr_49::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #8b8b8b;
  pointer-events: none;
  z-index: 1;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:13 KST
   c8e2a4f1-7b39-4d16-9e05-6a0c3d8b5f47
   작업바 밖으로 드래그하면 하단 작업바 테두리를 붉은 점선으로 표시 (드롭 시 닫기)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-bottom-bar-tab-strip_59qcr_49:has([data-taskbar-drop-close]) {
  background: rgba(197, 34, 31, 0.04);
}

._main-bottom-bar-tab-strip_59qcr_49:has([data-taskbar-drop-close])::after {
  content: '';
  position: absolute;
  inset: 2px;
  border: 2px dashed #c5221f;
  pointer-events: none;
  z-index: 10;
}

._main-bottom-bar-leading_59qcr_93 {
  flex: 1 1 auto;
  min-width: 0;
  height: 32px;
  padding: 0 12px;
  display: flex;
  align-items: center;
  color: var(--ui-muted, #666);
  font-size: 0.95rem;
  font-weight: var(--app-font-weight-bold);
  font-family: var(--default-font-family-bold), sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._main-bottom-bar-taskbar-wrap_59qcr_109 {
  grid-column: 2;
  justify-self: center;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-13 12:22 KST
   3f8a6c21-b4d7-4e9a-91c0-2d5b7e8f0a14
   작업탭 배치: 왼쪽 (개인설정)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-bottom-bar-tab-strip_59qcr_49._is-taskbar-left_59qcr_125 {
  grid-template-columns: 1fr auto;
}

._main-bottom-bar-tab-strip_59qcr_49._is-taskbar-left_59qcr_125 ._main-bottom-bar-taskbar-wrap_59qcr_109 {
  grid-column: 1;
  justify-self: stretch;
  justify-content: flex-start;
  overflow: hidden;
  padding-left: 4px;
}

._main-bottom-bar-tab-strip_59qcr_49._is-taskbar-left_59qcr_125 ._main-bottom-bar-meta_59qcr_137 {
  grid-column: 2;
}

._main-bottom-bar-meta_59qcr_137 {
  grid-column: 3;
  justify-self: end;
  align-self: flex-end;
  min-width: 0;
  height: 32px;
  padding-right: 10px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  color: var(--ui-muted, #666);
  overflow: visible;
}

._main-bottom-bar-connection-summary-wrap_59qcr_156 {
  position: relative;
  max-width: 320px;
  min-width: 0;
  cursor: default;
}

._main-bottom-bar-connection-summary-wrap_59qcr_156::after {
  content: attr(data-tooltip);
  position: absolute;
  right: 0;
  bottom: calc(100% + 6px);
  display: none;
  width: max-content;
  max-width: min(90vw, 720px);
  padding: 6px 10px;
  border: 1px solid #8b8b8b;
  border-radius: var(--ui-radius-tight, 2px);
  background: var(--ui-surface, #fff);
  color: var(--ui-text, #444);
  font-size: 0.85rem;
  font-weight: var(--app-font-weight);
  font-family: var(--default-font-family), sans-serif;
  line-height: 1.35;
  white-space: normal;
  word-break: break-all;
  text-align: left;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
  z-index: 60;
  pointer-events: none;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-10 16:10 KST
   c7d8e9f0-a1b2-3456-7890-bcdef1234567
   서버정보: 앞부분만 노출, 호버 시 전체 툴팁
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-07-10 16:12 KST
   d8e9f0a1-b2c3-4567-8901-cdef23456789
   서버정보: 진회색·굵게·우측 여백
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._main-bottom-bar-connection-summary-wrap_59qcr_156:hover:not([data-tooltip='']):not([data-tooltip=' '])::after {
  display: block;
  font-size: 1.1rem;
}

._main-bottom-bar-connection-summary_59qcr_156 {
  max-width: 100px;
  color: gray;
  font-size: 0.9rem;
  font-family: var(--default-font-family), sans-serif;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._main-bottom-bar-user_59qcr_215 {
  font-size: 0.95rem;
  font-weight: var(--app-font-weigh);
  font-family: var(--default-font-family), sans-serif;
  white-space: nowrap;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-27 10:50 KST
   c8e4b1a7-2d59-4f06-9c13-8a7e0b5d4f26
   하단바 축소 표시 기준을 앱 공통 1024px로 통일
   ffffffff-ffff-ffff-ffff-ffffffffffff */
@media (max-width: 1024px) {
  html[data-app-layout='responsive'] {
  ._main-bottom-bar-leading_59qcr_93 {
    display: none;
  }

  ._main-bottom-bar-meta_59qcr_137 {
    padding: 0 20px 0 8px;
    gap: 8px;
  }

  ._main-bottom-bar-connection-summary-wrap_59qcr_156 {
    display: none;
  }

  ._main-bottom-bar-user_59qcr_215 {
    font-size: 0.85rem;
  }
  }
}


._main-bottom-bar_59qcr_28, ._main-bottom-bar-tab-strip_59qcr_49 {
  background: var(--ui-surface, #fff);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 18:06 KST
// 0d31bef6-af32-4879-abb6-d1fa46a6ddd6
// 퀵메뉴 상하 여백과 중앙 정렬 확보
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._main-bottom-bar-tab-strip_59qcr_49 { padding: 3px 8px; }
._main-bottom-bar-tab-strip_59qcr_49::before { background: #e1e2e4; }
._main-bottom-bar-taskbar-wrap_59qcr_109 { align-items: center; }
._main-bottom-bar-meta_59qcr_137 { align-self: center; height: 100%; }
._cached-page_hu0lc_1 {
  width: 100%;
  height: 100%;
  min-height: 0;
}

._cached-page_hu0lc_1._is-hidden_hu0lc_7,
._is-hidden_hu0lc_7 {
  position: absolute;
  inset: 0;
  visibility: hidden;
  pointer-events: none;
}

._cached-page_hu0lc_1._is-active_hu0lc_15,
._is-active_hu0lc_15 {
  position: relative;
  height: 100%;
  visibility: visible;
  pointer-events: auto;
}
/* 00000000-0000-0000-0000-000000000000
   2026-08-29 21:20 KST
   7c4e19a2-8b5d-4f16-9e30-1a6d0c8b2f47
   default package tokens. Host :root overrides win.
   ffffffff-ffff-ffff-ffff-ffffffffffff */
:where(:root) {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 18:54 KST
  // 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
  // 텍스트박스 4px를 기준으로 역할별 곡률과 콤보 우측 여백을 토큰화
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-radius-none: 0;
  --ui-radius-control: 4px;
  --ui-radius-tight: calc(var(--ui-radius-control) * 0.5);
  --ui-radius-compact: calc(var(--ui-radius-control) * 0.75);
  --ui-radius-menu: calc(var(--ui-radius-control) * 1.5);
  --ui-radius-surface: calc(var(--ui-radius-control) * 2);
  --ui-radius-pill: 999px;
  --ui-radius-circle: 50%;
  --ui-input-radius: var(--ui-radius-control);
  --ui-combo-radius: var(--ui-radius-control);
  --ui-menu-radius: var(--ui-radius-menu);
  --ui-tooltip-radius: var(--ui-radius-control);
  --ui-combo-arrow-inset: 5px;
  --ui-combo-arrow-width: 16px;
  --ui-combo-end-space: 24px;
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 17:22 KST
  // f18f622d-3c78-40fc-8b49-e6c9d03e1c90
  // 공통 상태 전환과 메뉴 모션 속도 통일
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-motion-fast: 160ms;
  --ui-motion-panel: 220ms;
  --ui-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 17:14 KST
  // 89d60380-07fc-45c0-bfe7-c41bf7c3a9e3
  // 기본 스크롤 두께와 색상을 공통 토큰으로 조정
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-scrollbar-size: 8px;
  --ui-scrollbar-thumb: #b5bdc9;
  --ui-scrollbar-thumb-hover: #8994a6;
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 12:20 KST
  // 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
  // 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-section-bg: #ffffff;
  --ui-section-border: #dfe0e3;
  --ui-section-radius: var(--ui-radius-surface);
  --ui-section-shadow: 0 1px 2px rgb(23 23 23 / 6%);
  --ui-section-heading-bg: #e3ebf3;
  --ui-section-heading-text: #16243b;
  --ui-section-heading-height: 33px;
  --ui-section-accent: #0066ff;
  --ui-section-hover-bg: #eaf2fe;
  --ui-section-muted: #70737c;
  --ui-field-row-height: 34px;
  --ui-field-label-width: 150px;
  --ui-field-label-bg: #f1f1f3;
  /* 00000000-0000-0000-0000-000000000000
     2026-09-08 18:39 KST
     696d7d36-234e-44d1-9f44-eaa66483f52d
     공통 입력폼 필드 제목 라벨 색상 통일
     ffffffff-ffff-ffff-ffff-ffffffffffff */
  --ui-field-label-text: #5A5C63;
  --ui-field-padding-x: 10px;
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 14:37 KST
  // 1527a783-296b-4534-9522-25229aa95249
  // 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-field-control-padding-x: 8px;
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 18:00 KST
  // 6c777d1c-dc3d-420a-be6e-13a4882092a3
  // 이식 호스트에서도 공통 소형 폼 입력과 버튼 높이를 28px로 통일
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-field-control-height: 28px;
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 18:28 KST
  // 7799d18d-8dea-489a-b8a6-a92dc91e8fcd
  // 공통 소형 폼 입력의 글자 크기를 12px 토큰으로 제공
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 18:41 KST
  // ad26efff-1c60-4800-9abc-15e685ba2d41
  // 소형 폼 글자 크기를 기존 14px로 복원
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-field-control-font-size: 14px;
  --ui-toolbar-height: 40px;
  --ui-toolbar-gap: 3px;
  --ui-option-border: #64748b;
  --ui-option-bg: #ffffff;
  --ui-option-checked-bg: #0066ff;
  --ui-option-focus-ring: rgb(0 102 255 / 18%);
  --app-font-size: 14px;
  --app-font-weight-bold: bold;
  --default-font-family: 'Malgun Gothic', sans-serif;
  --default-font-family-bold: 'Malgun Gothic Bold', 'Malgun Gothic', sans-serif;

  --ui-input-border: darkgray;
  --ui-input-bg: #ffffff;
  --ui-input-text: #000000;
  --ui-input-focus-bg: #ffffd4;
  --ui-input-focus-border: blue;
  --ui-input-disabled-bg: #d3d3d3;
  --ui-input-disabled-border: #4b5563;
  --ui-input-autofill-bg: #dddddd;
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-09 14:04 KST
  // ecb80801-3c68-4968-963a-346925f99f4c
  // 검색 팝업과 공통 입력 색상을 테마 역할 토큰으로 연결
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-input-placeholder: #8b919b;
  --ui-input-focus-ring: rgb(0 102 255 / 12%);
  --ui-search-option-hover-bg: rgba(47, 108, 229, 0.12);
  --ui-search-option-active-bg: #dbeafe;
  --ui-search-option-active-text: #1d4ed8;

  --ui-button-border: transparent;
  --ui-button-radius: var(--ui-radius-control);
  --ui-button-text: #333333;
  --ui-button-disabled-text: #999999;
  --ui-button-hover-bg: #d9d9d9;
  --ui-button-hover-border: gray;
  --ui-button-refresh-hover-bg: #e0f7fa;
  --ui-button-refresh-hover-text: #00c181;
  --ui-button-refresh-active-bg: #c8edf2;
  --ui-button-refresh-active-border: #6fcbd4;
  --ui-button-danger-hover-bg: #fee2e2;
  --ui-button-danger-hover-text: #ef4444;
  --ui-open-button-border: #4a4a4a;
  --ui-open-button-bg: #bdbdbd;
  --ui-open-button-hover-bg: #a9a9a9;
  --ui-open-button-active-bg: #979797;

  --ui-search-button-bg: dodgerblue;
  --ui-search-button-text: #ffffff;

  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 16:57 KST
  // 8fcac96d-1dd8-46d0-81d3-f16dbe91ecea
  // 독립 이식 호스트에도 shadcn 콤보 기본 색상 적용
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  --ui-combo-border: #dfe0e3;
  --ui-combo-bg: #ffffff;
  --ui-combo-text: #171719;
  --ui-combo-focus-bg: #ffffff;
  --ui-combo-focus-border: #0066ff;
  --ui-combo-disabled-bg: #f1f1f3;
  --ui-combo-option-bg: #ffffff;
  --ui-combo-option-checked-bg: #eaf2fe;
  --ui-combo-arrow: #70737c;
  --ui-combo-arrow-disabled: #aeb0b6;

  --ui-multiselect-border: #cccccc;
  --ui-multiselect-bg: #ffffff;
  --ui-multiselect-hover-bg: #f0f0f0;
  --ui-multiselect-separator: #dddddd;
  --ui-searchable-combo-box-hover-bg: #eaf2fe;

  --ui-checkbox-border: #5f6368;
  --ui-checkbox-bg: #ffffff;
  --ui-checkbox-hover-bg: rgba(26, 115, 232, 0.06);
  --ui-checkbox-checked-bg: #1a73e8;
  --ui-checkbox-checked-mark: #ffffff;
  --ui-checkbox-focus-ring: rgba(26, 115, 232, 0.28);
  --ui-checkbox-disabled-bg: #f1f3f4;
  --ui-checkbox-disabled-border: #dadce0;
  --ui-checkbox-disabled-checked-bg: #9aa0a6;
}

:where(html) {
  font-size: var(--app-font-size, 14px);
}

:where(:root) {
  --ui-surface: #ffffff;
  --ui-text: #2e2f33;
  --ui-muted: #70737c;
  --ui-border: #dfe0e3;
  --ui-canvas: #f7f7f8;
  --ui-selected: #eaf2fe;
  --ui-primary: #0066ff;
  --ui-primary-hover: #005eeb;
  --ui-on-primary: #ffffff;
  --ui-danger: #e52222;
  --ui-danger-tint: #fff1f1;
  --ui-success: #009632;
  --ui-success-tint: #d9ffe6;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._actionButton_j4ltc_22 {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--ui-button-border);
  border-radius: var(--ui-button-radius, 4px);
  background: var(--ui-surface, #ffffff);
  cursor: pointer;
  color: var(--ui-button-text);
  padding: 5px 10px;
  font-weight: 500;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}

._actionButtonLabel_j4ltc_38 {
  display: block;
  font-size: 1rem;
  line-height: 1.35;
  margin-top: 0;
  letter-spacing: -0.02em;
  white-space: nowrap;
  color: inherit;
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-11 14:09 KST
   8f1edb98-0024-4b5a-ab76-4432b0b0c6ba
   회원 입력과 아이콘 정렬 및 초기 화면과 팝업 경로 개선
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._actionButton_j4ltc_22:has(._actionButtonLabel_j4ltc_38:empty),
._actionButton_j4ltc_22:has(._actionButtonLabel_j4ltc_38 > .sr-only) {
  gap: 0;
}

._actionButtonLabel_j4ltc_38:empty,
._actionButtonLabel_j4ltc_38:has(> .sr-only) {
  position: absolute;
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-09 16:04 KST
   44881bd1-579a-4dbd-bc08-8efee0397752
   입력 높이와 맞는 12px 소형 버튼 규격 및 주 버튼 강조 추가
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._actionButtonSizeSmall_j4ltc_68 {
  min-height: var(--ui-field-control-height);
  height: var(--ui-field-control-height);
  gap: 4px;
  padding: 0 8px;
}

._actionButtonSizeSmall_j4ltc_68 ._actionButtonLabel_j4ltc_38 {
  font-size: 12px;
  line-height: 1;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 14:37 KST
// 1527a783-296b-4534-9522-25229aa95249
// 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._actionButtonSizeSmall_j4ltc_68 ._actionButtonIcon_j4ltc_87 {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

._actionButtonSizeSmall_j4ltc_68 ._actionButtonIconSvg_j4ltc_93 {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

._actionButton_j4ltc_22:hover {
  background: var(--ui-button-hover-bg);
  border-color: var(--ui-button-hover-border);
}

._actionButton_j4ltc_22:disabled:hover {
  background: var(--ui-input-disabled-bg);
  border-color: var(--ui-button-border);
  color: var(--ui-button-disabled-text);
}

._actionButton_j4ltc_22:not(:disabled):active {
  transform: translateY(1px);
}

._actionButton_j4ltc_22:disabled {
  opacity: 1;
  cursor: not-allowed;
  border-color: var(--ui-button-border);
  color: var(--ui-button-disabled-text);
  background: var(--ui-input-disabled-bg);
}

._actionButton_j4ltc_22:focus-visible {
  outline: 2px solid var(--ui-primary, #0066ff);
  outline-offset: 2px;
}

._actionButtonMain_j4ltc_127:not(:disabled),
._actionButtonSave_j4ltc_128:not(:disabled) {
  border-color: var(--ui-primary, #0066ff);
  background: var(--ui-primary, #0066ff);
  color: var(--ui-on-primary, #ffffff);
  font-weight: var(--app-font-weight-bold);
}

._actionButtonMain_j4ltc_127 ._actionButtonLabel_j4ltc_38,
._actionButtonSave_j4ltc_128 ._actionButtonLabel_j4ltc_38 {
  font-weight: var(--app-font-weight-bold);
}

._actionButtonMain_j4ltc_127:not(:disabled):hover,
._actionButtonSave_j4ltc_128:not(:disabled):hover {
  border-color: var(--ui-primary-hover, #005eeb);
  background: var(--ui-primary-hover, #005eeb);
}

._actionButtonDelete_j4ltc_146:not(:disabled) {
  color: var(--ui-danger, #dc2626);
}

._actionButtonDelete_j4ltc_146:not(:disabled):hover {
  border-color: var(--ui-danger-tint, #fecaca);
  background: var(--ui-danger-tint, #fef2f2);
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:18 KST
   f2b8d4e1-6a37-4c19-9e05-8d0c3a7b5f46
   엑셀 아이콘: 비활성 버튼에서는 회색(currentColor)으로 표기
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._actionButton_j4ltc_22:disabled ._actionButtonLabel_j4ltc_38 {
  color: var(--ui-button-disabled-text);
}



._actionButtonRefresh_j4ltc_166:not(:disabled):hover {
  background: var(--ui-button-refresh-hover-bg);
  color: var(--ui-button-refresh-hover-text);
}

._actionButtonRefresh_j4ltc_166:not(:disabled):active {
  background: var(--ui-button-refresh-active-bg);
  border-color: var(--ui-button-refresh-active-border);
}


._actionButtonRed_j4ltc_177:not(:disabled):hover {
  background: var(--ui-button-danger-hover-bg);
  color: var(--ui-button-danger-hover-text);
}


._actionButtonIcon_j4ltc_87 {
  width: 16px;
  height: 16px;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 15:07 KST
// 35184fff-ff7e-4188-94ea-ba5a920196f9
// 아이콘 굵기와 상태 색상 및 초기 화면 표시 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._actionButtonIconSvg_j4ltc_93 {
  display: block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: transform 120ms ease;
}

._actionButtonRefresh_j4ltc_166:not(:disabled):active ._actionButtonIconSvg_j4ltc_93 {
  transform: rotate(-18deg);
}



/* 00000000-0000-0000-0000-000000000000
   2026-07-24 15:14 KST
   a7c3f8e2-4b91-4d6e-9f2a-1c8e5d7b0a34
   ActionButton confirm/cancel 필 스타일 (EmptyDesktopPanel editor 버튼과 동일)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._actionButtonCancel_j4ltc_214,
._actionButtonConfirm_j4ltc_215 {
  flex-direction: row;
  align-items: center;
  justify-content: center;
  min-width: 84px;
  height: 36px;
  padding: 0 18px;
  border: none;
  border-radius: var(--ui-radius-menu, 6px);
  font-size: 0.875rem;
  font-weight: var(--app-font-weight-bold);
}

._actionButtonCancel_j4ltc_214 {
  background: var(--ui-canvas, #f1f3f4);
  color: var(--ui-text, #3c4043);
}

._actionButtonConfirm_j4ltc_215 {
  background: var(--ui-primary, #0066ff);
  color: var(--ui-on-primary, #ffffff);
  box-shadow: 0 1px 2px rgba(26, 115, 232, 0.28);
}

._actionButtonCancel_j4ltc_214:hover {
  background: var(--ui-canvas, #e8eaed);
  border-color: transparent;
}

._actionButtonConfirm_j4ltc_215:hover {
  background: var(--ui-primary-hover, #005eeb);
  border-color: transparent;
}

._actionButtonCancel_j4ltc_214:disabled,
._actionButtonConfirm_j4ltc_215:disabled {
  opacity: 0.55;
  border-color: transparent;
}

._actionButtonCancel_j4ltc_214:disabled:hover {
  background: var(--ui-canvas, #f1f3f4);
  border-color: transparent;
}

._actionButtonConfirm_j4ltc_215:disabled:hover {
  background: var(--ui-primary, #0066ff);
  border-color: transparent;
}

._actionButtonConfirm_j4ltc_215 ._actionButtonLabel_j4ltc_38,
._actionButtonCancel_j4ltc_214 ._actionButtonLabel_j4ltc_38 {
  color: inherit;
  margin-top: 0;
  letter-spacing: 0;
  font-size: 0.875rem;
  font-weight: var(--app-font-weight-bold);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:15 KST
// a80e13f6-89dc-4a54-b882-bd9bc764e0b8
// 조회 버튼의 크기와 테두리 및 포커스를 시안에 맞춤
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._openButton_14kln_15 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 17:07 KST
  // 413cbaca-2ec7-4b61-8273-e710619cbaf2
  // 숨김 버튼 설명을 버튼 내부에 고정하여 바깥 스크롤 방지
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 33px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--ui-section-border);
  border-radius: var(--ui-button-radius, 4px);
  background-color: var(--ui-section-bg);
  color: var(--ui-section-muted);
  font-size: 1.125rem;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
}

._openButton_14kln_15:hover:not(:disabled) {
  background-color: var(--ui-section-hover-bg);
  border-color: var(--ui-section-accent);
  color: var(--ui-section-accent);
}

._openButton_14kln_15:focus-visible {
  outline: 2px solid var(--ui-section-accent);
  outline-offset: 2px;
}

._openButton_14kln_15:active:not(:disabled) {
  background-color: var(--ui-open-button-active-bg);
}

._openButton_14kln_15:disabled {
  opacity: 0.5;
  cursor: default;
}

._accessibleLabel_14kln_61 {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
/* 00000000-0000-0000-0000-000000000000
   2026-09-09 16:04 KST
   44881bd1-579a-4dbd-bc08-8efee0397752
   검색 버튼을 입력 높이와 같은 가로 아이콘 주 버튼으로 통일
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._searchButton_1ouj8_6 {
  box-sizing: border-box;
  height: var(--ui-control-height, 32px);
  min-width: 64px;
  flex-shrink: 0;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  gap: 6px;
}
._searchButton_1ouj8_6 .actionButtonIconSvg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: inherit;
}
._searchButton_1ouj8_6 .actionButtonLabel {
  line-height: 1;
  font-weight: 700;
  color: inherit;
}/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 00000000-0000-0000-0000-000000000000
   2026-07-10 11:38 KST
   222f0f55-4eed-471c-a39c-3ff4af6da80b
   공통 툴바 버튼을 앱 컴팩트 기준(20px/1rem)으로 통일
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._toolbarButton_1fdbg_20 {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border: 1px solid var(--ui-button-border);
  border-radius: var(--ui-button-radius, 4px);
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 14:37 KST
// 1527a783-296b-4534-9522-25229aa95249
// 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 15:07 KST
// 35184fff-ff7e-4188-94ea-ba5a920196f9
// 아이콘 굵기와 상태 색상 및 초기 화면 표시 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 아이콘 크기는 ActionButton의 18px 공통 규격을 그대로 사용한다. */

._toolbarButton_1fdbg_20 .actionButtonLabel {
  display: block;
  font-size: 1rem;
  line-height: 1.35;
  margin-top: 0;
  letter-spacing: -0.02em;
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-09 16:04 KST
   44881bd1-579a-4dbd-bc08-8efee0397752
   툴바 버튼도 공통 소형 크기 계약을 그대로 따르도록 보완
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._toolbarButton_1fdbg_20.action-button-size-small {
  height: var(--ui-field-control-height);
  gap: 4px;
  padding: 0 8px;
}

._toolbarButton_1fdbg_20.action-button-size-small .actionButtonLabel {
  font-size: 12px;
  line-height: 1;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._toolbarButton_1mlhn_15 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  
  border-radius: var(--ui-radius-compact, 3px);
  
  color: var(--ui-text, #4f4f4f);
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease, transform 120ms ease;
}

._toolbarButton_1mlhn_15:hover:not(:disabled) {
  background: var(--ui-canvas, #d9d9d9);
}

._toolbarButton_1mlhn_15:active:not(:disabled) {
  transform: translateY(1px) scale(0.95);
}

._toolbarButton_1mlhn_15:disabled {
  color: var(--ui-muted, #9a9a9a);
  background: var(--ui-canvas, #f2f2f2);
  cursor: not-allowed;
}

._toolbarButton_1mlhn_15:disabled:hover {
  background: var(--ui-canvas, #f2f2f2);
}

._toolbarButtonIcon_1mlhn_48 {
  display: block;
  width: 24px;
  height: 24px;
}

._toolbarButtonLabel_1mlhn_54 {
  display: none;
}

._toolbarButtonDelete_1mlhn_58:not(:disabled):hover {
  background: var(--ui-danger-tint, #fee2e2);
  color: var(--ui-danger, #ef4444);
}

._toolbarButtonRefresh_1mlhn_63:not(:disabled):hover {
  background: var(--ui-success-tint, #e0f7fa);
  color: var(--ui-success, #00c181);
}

._toolbarButtonRefresh_1mlhn_63:not(:disabled):active {
  background: var(--ui-success-tint, #c8edf2);
}/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 14:04 KST
// ecb80801-3c68-4968-963a-346925f99f4c
// 검색 팝업과 공통 입력 색상을 테마 역할 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 11:59 KST
// 3f6fd57f-665c-48a0-8277-5edee35ede19
// 입력 상태를 즉시 표시해 테두리와 그림자의 반복 보간 비용 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._inputDefault_1slyi_29 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 14:37 KST
  // 1527a783-296b-4534-9522-25229aa95249
  // 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  border: 1px solid var(--ui-input-border);
  outline: 0;
  background-color: var(--ui-input-bg);
  transition: none;
  padding: 2px var(--ui-field-control-padding-x, 8px);
  color: var(--ui-input-text);
  font-size: 1rem;
  line-height: 1.75rem;
  border-radius: var(--ui-input-radius, 4px);
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 16:55 KST
// 30c76b27-920e-456b-91e5-0befb28980d7
// 단독 입력에도 회원 정보 폼과 같은 hover 및 focus 효과 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:28 KST
// 7799d18d-8dea-489a-b8a6-a92dc91e8fcd
// 단독 소형 입력을 높이 28px와 글자 12px 및 세로 중앙 정렬로 제공
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:41 KST
// ad26efff-1c60-4800-9abc-15e685ba2d41
// 소형 입력의 높이와 중앙 정렬을 유지하며 글자를 14px로 복원
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._inputDefault_1slyi_29._inputSmall_1slyi_69 {
  box-sizing: border-box;
  height: var(--ui-field-control-height, 28px);
  padding-top: 0;
  padding-bottom: 0;
  font-size: var(--ui-field-control-font-size, 14px);
  line-height: normal;
}

._inputDefault_1slyi_29:is(:hover, :focus):not([readonly]):not(:disabled) {
  background-color: var(--ui-input-focus-bg);
  border-color: var(--ui-input-focus-border);
  box-shadow: 0 0 0 3px var(--ui-option-focus-ring, var(--ui-input-focus-ring, rgb(0 102 255 / 12%)));
}

._inputDefault_1slyi_29:focus[readonly],
._inputDefault_1slyi_29:focus:read-only,
._inputDefault_1slyi_29:focus:disabled {
  background-color: var(--ui-input-disabled-bg);
  border-bottom-color: var(--ui-input-disabled-border);
}


._inputDefault_1slyi_29[readonly],
._inputDefault_1slyi_29:read-only {
  background-color: var(--ui-input-disabled-bg);
}


._inputDisabledBackground_1slyi_98 {
  background-color: var(--ui-input-disabled-bg);
}

._inputAutofillBackground_1slyi_102 {
  background-color: var(--ui-input-autofill-bg);
}
._inputDefault_1slyi_29::placeholder {
  color: var(--ui-input-placeholder, GrayText);
  opacity: 1;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/* 00000000-0000-0000-0000-000000000000
   2026-07-28 18:40 KST
   a3f8c2e1-9b4d-4e6a-8c1f-2d5e7a9b0c3d
   체크박스 현대적 디자인: PNG 제거, CSS 체크마크/토큰 기반 스타일
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-17 07:35 KST
   d5a1c8e3-4b27-4f91-8e0a-2c5d9b7f1e44
   체크박스 크기를 기본 글자 크기(14px=1rem)에 비례
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._customCheckbox_nxsq5_26 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 17:14 KST
  // 89d60380-07fc-45c0-bfe7-c41bf7c3a9e3
  // 체크 표시를 체크박스 중심에 정렬
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  display: grid;
  place-items: center;
  appearance: none;
  -webkit-appearance: none;
  width: calc(16rem / 14);
  height: calc(16rem / 14);
  margin: 0;
  flex: none;
  box-sizing: border-box;
  border: calc(1.5rem / 14) solid var(--ui-checkbox-border, #5f6368);
  border-radius: var(--ui-radius-tight, 2px);
  background-color: var(--ui-checkbox-bg, #ffffff);
  cursor: pointer;
  position: relative;
  outline: none;
  vertical-align: middle;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

._customCheckbox_nxsq5_26:hover:not([data-disabled]):not([data-checked]):not([data-indeterminate]) {
  border-color: var(--ui-checkbox-checked-bg, #1a73e8);
  background-color: var(--ui-checkbox-hover-bg, rgba(26, 115, 232, 0.06));
}

._customCheckbox_nxsq5_26[data-checked],
._customCheckbox_nxsq5_26[data-indeterminate] {
  background-color: var(--ui-checkbox-checked-bg, #1a73e8);
  border-color: var(--ui-checkbox-checked-bg, #1a73e8);
}

._customCheckbox_nxsq5_26 svg {
  display: block;
  width: calc(12rem / 14);
  height: calc(12rem / 14);
  fill: none;
  stroke: var(--ui-checkbox-checked-mark, #ffffff);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

._customCheckbox_nxsq5_26:focus {
  outline: none;
}

._customCheckbox_nxsq5_26:focus-visible,
._customCheckbox_nxsq5_26[data-focus-visible] {
  box-shadow: 0 0 0 calc(3rem / 14) var(--ui-checkbox-focus-ring, rgba(26, 115, 232, 0.28));
}

._customCheckbox_nxsq5_26[data-disabled] {
  cursor: not-allowed;
  opacity: 1;
  background-color: var(--ui-checkbox-disabled-bg, #f1f3f4);
  border-color: var(--ui-checkbox-disabled-border, #dadce0);
}

._customCheckbox_nxsq5_26[data-disabled][data-checked],
._customCheckbox_nxsq5_26[data-disabled][data-indeterminate] {
  background-color: var(--ui-checkbox-disabled-checked-bg, #9aa0a6);
  border-color: var(--ui-checkbox-disabled-checked-bg, #9aa0a6);
}

._checkboxWrap_nxsq5_100 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 17:07 KST
  // 413cbaca-2ec7-4b61-8273-e710619cbaf2
  // 숨김 입력 위치를 체크박스에 고정하여 바깥 탭 스크롤 방지
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: calc(22rem / 14);
  min-width: calc(22rem / 14);
}

._checkboxLabeled_nxsq5_117 {
  display: inline-flex;
  align-items: center;
  gap: calc(6rem / 14);
  min-height: calc(22rem / 14);
}

._checkboxInlineLabel_nxsq5_124 {
  margin: 0;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1.3;
  white-space: nowrap;
  user-select: none;
  display: inline-flex;
  align-items: center;
  color: var(--ui-input-text, #000000);
}

._checkboxInlineLabel_nxsq5_124[data-disabled='true'] {
  cursor: not-allowed;
  color: var(--ui-button-disabled-text, #999999);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 00000000-0000-0000-0000-000000000000
   2026-08-28 17:50 KST
   a7e4c2b1-9d58-4f03-8e16-2b0a5c7d9f31
   default 패키지 이식: 공통 스크롤바를 @styles 없이 폴더 안에 둠
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-07-10 11:58 KST
   c3d4e5f6-a7b8-9012-cdef-123456789012
   기본요소(그리드 제외) 공통 스크롤바 스타일
   ffffffff-ffff-ffff-ffff-ffffffffffff */

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 17:14 KST
// 89d60380-07fc-45c0-bfe7-c41bf7c3a9e3
// 기본 스크롤 두께와 색상을 공통 토큰으로 조정
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._appScrollbar_soyrd_26 {
  scrollbar-width: thin;
  scrollbar-color: var(--ui-scrollbar-thumb, #b5bdc9) transparent;
}

._appScrollbar_soyrd_26::-webkit-scrollbar {
  width: var(--ui-scrollbar-size, 8px);
  height: var(--ui-scrollbar-size, 8px);
}

._appScrollbar_soyrd_26::-webkit-scrollbar-track {
  background-color: transparent;
}

._appScrollbar_soyrd_26::-webkit-scrollbar-thumb {
  background-color: var(--ui-scrollbar-thumb, #b5bdc9);
  border: none;
  border-radius: var(--ui-radius-pill, 999px);
  box-shadow: none;
}

._appScrollbar_soyrd_26::-webkit-scrollbar-thumb:hover {
  background-color: var(--ui-scrollbar-thumb-hover, #8994a6);
  cursor: default;
}

._appScrollbar_soyrd_26::-webkit-scrollbar-button,
._appScrollbar_soyrd_26::-webkit-scrollbar-button:single-button,
._appScrollbar_soyrd_26::-webkit-scrollbar-button:vertical:start:decrement,
._appScrollbar_soyrd_26::-webkit-scrollbar-button:vertical:end:increment,
._appScrollbar_soyrd_26::-webkit-scrollbar-button:horizontal:start:decrement,
._appScrollbar_soyrd_26::-webkit-scrollbar-button:horizontal:end:increment {
  display: none;
  width: 0;
  height: 0;
  background: transparent;
}

._appScrollbar_soyrd_26::-webkit-scrollbar-corner {
  background-color: transparent;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:57 KST
// 8fcac96d-1dd8-46d0-81d3-f16dbe91ecea
// shadcn 선택 컴포넌트 기준으로 콤보 종류별 공통 스타일 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 11:59 KST
// 3f6fd57f-665c-48a0-8277-5edee35ede19
// 콤보 입력 상태를 즉시 표시하고 목록 진입 효과는 유지
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 17:47 KST
// 5020ab7b-75c4-4acd-bbe5-0b017e00247e
// 공통 콤보 화살표를 Lucide SVG와 중앙정렬 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/._trigger_fx20j_38 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 14:37 KST
  // 1527a783-296b-4534-9522-25229aa95249
  // 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  display: block;
  box-sizing: border-box;
  margin: 0;
  padding: 2px var(--ui-combo-end-space, 24px) 2px var(--ui-field-control-padding-x, 8px);
  border: 1px solid var(--ui-combo-border);
  border-radius: var(--ui-combo-radius, 4px);
  outline: none;
  background: var(--ui-combo-bg);
  color: var(--ui-combo-text);
  font: inherit;
  font-size: 1rem;
  line-height: 1.75rem;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgb(0 0 0 / 3%);
  transition: none;
}/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:00 KST
// 6c777d1c-dc3d-420a-be6e-13a4882092a3
// CSS 로드 순서와 무관하게 소형 콤보의 높이와 세로 중앙 정렬을 우선 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:28 KST
// 7799d18d-8dea-489a-b8a6-a92dc91e8fcd
// 소형 콤보 입력과 선택 목록 글자 크기를 공통 12px 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:41 KST
// ad26efff-1c60-4800-9abc-15e685ba2d41
// 소형 콤보 입력과 선택 목록의 기본 글자 크기를 14px로 복원
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/._trigger_fx20j_38._triggerSmall_fx20j_87 {
  height: var(--ui-field-control-height, 28px);
  min-height: var(--ui-field-control-height, 28px);
  padding-top: 0;
  padding-bottom: 0;
  font-size: var(--ui-field-control-font-size, 14px);
  line-height: normal;
}._trigger_fx20j_38._triggerSmall_fx20j_87 option,
._popup_fx20j_97[data-ui-size='small'],
._popup_fx20j_97[data-ui-size='small'] :is(._option_fx20j_98, ._searchInput_fx20j_98, ._emptyText_fx20j_98, label) {
  font-size: var(--ui-field-control-font-size, 14px);
}._trigger_fx20j_38:not(:disabled):is(:hover, :focus, [aria-expanded='true']) {
  border-color: var(--ui-combo-focus-border);
  background: var(--ui-combo-focus-bg);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-combo-focus-border) 12%, transparent);
}._trigger_fx20j_38:disabled {
  cursor: not-allowed;
  background: var(--ui-combo-disabled-bg);
  box-shadow: none;
}._popup_fx20j_97 {
  box-sizing: border-box;
  padding: 4px;
  border: 1px solid var(--ui-combo-border);
  border-radius: var(--ui-menu-radius, 6px);
  background: var(--ui-combo-option-bg);
  color: var(--ui-combo-text);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -2px rgb(0 0 0 / 10%);
}._option_fx20j_98 {
  box-sizing: border-box;
  min-height: 30px;
  padding: 5px 8px;
  border-radius: var(--ui-radius-tight, 2px);
  color: var(--ui-combo-text);
  font: inherit;
  line-height: 1.4;
  cursor: pointer;
}._option_fx20j_98:is(:hover, :focus-within, [data-highlighted]) {
  background: var(--ui-searchable-combo-box-hover-bg);
}._arrow_fx20j_139 {
  position: absolute;
  top: 50%;
  right: var(--ui-combo-arrow-inset, 5px);
  display: block;
  width: var(--ui-combo-arrow-width, 16px);
  height: var(--ui-combo-arrow-width, 16px);
  color: var(--ui-combo-arrow);
  transform: translateY(-50%);
  pointer-events: none;
}._emptyText_fx20j_98 {
  padding: 20px 8px;
  color: var(--ui-muted);
  font-size: 1rem;
  text-align: center;
}._searchRow_fx20j_158 {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 8px;
  margin: 0 -4px 4px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--ui-combo-border);
}._searchInput_fx20j_98 {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--ui-combo-text);
  font: inherit;
  line-height: 1.4;
}._searchInput_fx20j_98::placeholder {
  color: var(--ui-muted);
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 18:03 KST
// 45cb58b7-a7f1-4a2f-bb01-3b7986dd7ccb
// ERP 테마를 유지하며 단일 선택 목록은 네이티브 select로 표시
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 17:50 KST
// 7113633c-1a26-466b-b093-12b3bdbba7d8
// 실제 브라우저 검증 후 회원 하위 탭과 바로가기 디자인 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 17:40 KST
// 46c2e901-0111-40c1-b491-8da127720e4e
// 네이티브 셀렉트 기본 화살표를 Lucide SVG 아이콘으로 교체
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 17:47 KST
// 5020ab7b-75c4-4acd-bbe5-0b017e00247e
// 공통 콤보 화살표를 Lucide SVG와 중앙정렬 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._comboBoxSelectWrap_j5253_48 {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  vertical-align: middle;
  max-width: 100%;
}

._comboBoxSelectWrapFluid_j5253_56 {
  display: block;
  width: 100%;
}



/* 00000000-0000-0000-0000-000000000000
   2026-07-10 14:14 KST
   d0e1f2a3-b4c5-6789-defa-890123456789
   콤보 높이를 TextBox(line-height 1.75rem)와 동일하게 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-07-13 11:02 KST
   f6a7b8c9-d0e1-2345-fabc-456789012345
   폭 className은 select에 적용(TextBox input과 동일 ch) — wrap은 inline-block으로 select에 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 네이티브 셀렉트의 우측 패딩과 화살표 위치를 축소된 공통 토큰에 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._inputSelect_j5253_80 {
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  padding-right: var(--ui-combo-end-space, 24px);
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-09 16:55 KST
   30c76b27-920e-456b-91e5-0befb28980d7
   입력 및 소형 작업 버튼과 높이가 같은 ComboBox small 규격 추가
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:00 KST
// 6c777d1c-dc3d-420a-be6e-13a4882092a3
// 네이티브 소형 셀렉트에 공통 중앙 정렬 규격을 적용하고 짝수 높이에 화살표 정렬
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._inputSelectSmall_j5253_102 {
}

._inputSelectFillWrap_j5253_106 {
  width: 100%;
  min-width: 0;
}

._inputSelect_j5253_80 option {
  background: var(--ui-combo-option-bg);
  color: var(--ui-combo-text);
  font-size: 1rem;
}

._comboBoxArrow_j5253_117 {
}

._comboBoxArrowSmall_j5253_121 {
  top: 50%;
  right: var(--ui-combo-arrow-inset, 5px);
  width: 14px;
  height: 14px;
}

._inputSelect_j5253_80:disabled + ._comboBoxArrow_j5253_117,
._inputSelect_j5253_80[data-disabled] + ._comboBoxArrow_j5253_117 {
  color: var(--ui-combo-arrow-disabled);
}

._selectPositioner_j5253_133 {
  z-index: var(--ui-select-layer, 10000);
}

._selectPopup_j5253_137 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 17:14 KST
  // 89d60380-07fc-45c0-bfe7-c41bf7c3a9e3
  // 기본 콤보 목록 최대 높이 축소
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  min-width: max(var(--anchor-width), 120px);
  max-width: var(--available-width);
  max-height: min(var(--available-height), 200px);
  overflow: auto;
}

._selectList_j5253_152 {
  outline: none;
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-09 17:05 KST
   62abec2c-b825-4ad0-9a41-11be8ea7205a
   소형 입력 글자는 14px로 유지하고 목록 체크 표시 공간 분리
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._selectItem_j5253_161 {
}

._selectItem_j5253_161._selectItem_j5253_161 {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px;
  font-size: 14px;
}

._selectItem_j5253_161 > :first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

._selectItem_j5253_161[data-highlighted],
._selectItem_j5253_161:hover {
  background: var(--ui-searchable-combo-box-hover-bg);
}

._selectItemIndicator_j5253_187 {
  grid-column: 2;
  display: flex;
  align-items: center;
  color: var(--ui-combo-text);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:57 KST
// 8fcac96d-1dd8-46d0-81d3-f16dbe91ecea
// shadcn 선택 컴포넌트 기준으로 콤보 종류별 공통 스타일 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 11:59 KST
// 3f6fd57f-665c-48a0-8277-5edee35ede19
// 콤보 입력 상태를 즉시 표시하고 목록 진입 효과는 유지
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 17:47 KST
// 5020ab7b-75c4-4acd-bbe5-0b017e00247e
// 공통 콤보 화살표를 Lucide SVG와 중앙정렬 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/._trigger_fx20j_38 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 14:37 KST
  // 1527a783-296b-4534-9522-25229aa95249
  // 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  display: block;
  box-sizing: border-box;
  margin: 0;
  padding: 2px var(--ui-combo-end-space, 24px) 2px var(--ui-field-control-padding-x, 8px);
  border: 1px solid var(--ui-combo-border);
  border-radius: var(--ui-combo-radius, 4px);
  outline: none;
  background: var(--ui-combo-bg);
  color: var(--ui-combo-text);
  font: inherit;
  font-size: 1rem;
  line-height: 1.75rem;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgb(0 0 0 / 3%);
  transition: none;
}/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:00 KST
// 6c777d1c-dc3d-420a-be6e-13a4882092a3
// CSS 로드 순서와 무관하게 소형 콤보의 높이와 세로 중앙 정렬을 우선 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:28 KST
// 7799d18d-8dea-489a-b8a6-a92dc91e8fcd
// 소형 콤보 입력과 선택 목록 글자 크기를 공통 12px 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:41 KST
// ad26efff-1c60-4800-9abc-15e685ba2d41
// 소형 콤보 입력과 선택 목록의 기본 글자 크기를 14px로 복원
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/._trigger_fx20j_38._triggerSmall_fx20j_87 {
  height: var(--ui-field-control-height, 28px);
  min-height: var(--ui-field-control-height, 28px);
  padding-top: 0;
  padding-bottom: 0;
  font-size: var(--ui-field-control-font-size, 14px);
  line-height: normal;
}._trigger_fx20j_38._triggerSmall_fx20j_87 option,
._popup_fx20j_97[data-ui-size='small'],
._popup_fx20j_97[data-ui-size='small'] :is(._option_fx20j_98, ._searchInput_fx20j_98, ._emptyText_fx20j_98, label) {
  font-size: var(--ui-field-control-font-size, 14px);
}._trigger_fx20j_38:not(:disabled):is(:hover, :focus, [aria-expanded='true']) {
  border-color: var(--ui-combo-focus-border);
  background: var(--ui-combo-focus-bg);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-combo-focus-border) 12%, transparent);
}._trigger_fx20j_38:disabled {
  cursor: not-allowed;
  background: var(--ui-combo-disabled-bg);
  box-shadow: none;
}._popup_fx20j_97 {
  box-sizing: border-box;
  padding: 4px;
  border: 1px solid var(--ui-combo-border);
  border-radius: var(--ui-menu-radius, 6px);
  background: var(--ui-combo-option-bg);
  color: var(--ui-combo-text);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -2px rgb(0 0 0 / 10%);
}._option_fx20j_98 {
  box-sizing: border-box;
  min-height: 30px;
  padding: 5px 8px;
  border-radius: var(--ui-radius-tight, 2px);
  color: var(--ui-combo-text);
  font: inherit;
  line-height: 1.4;
  cursor: pointer;
}._option_fx20j_98:is(:hover, :focus-within, [data-highlighted]) {
  background: var(--ui-searchable-combo-box-hover-bg);
}._arrow_fx20j_139 {
  position: absolute;
  top: 50%;
  right: var(--ui-combo-arrow-inset, 5px);
  display: block;
  width: var(--ui-combo-arrow-width, 16px);
  height: var(--ui-combo-arrow-width, 16px);
  color: var(--ui-combo-arrow);
  transform: translateY(-50%);
  pointer-events: none;
}._emptyText_fx20j_98 {
  padding: 20px 8px;
  color: var(--ui-muted);
  font-size: 1rem;
  text-align: center;
}._searchRow_fx20j_158 {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 8px;
  margin: 0 -4px 4px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--ui-combo-border);
}._searchInput_fx20j_98 {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--ui-combo-text);
  font: inherit;
  line-height: 1.4;
}._searchInput_fx20j_98::placeholder {
  color: var(--ui-muted);
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:57 KST
// 8fcac96d-1dd8-46d0-81d3-f16dbe91ecea
// shadcn 선택 컴포넌트 기준으로 콤보 종류별 공통 스타일 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 17:47 KST
// 5020ab7b-75c4-4acd-bbe5-0b017e00247e
// 공통 콤보 화살표를 Lucide SVG와 중앙정렬 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

._root_13ge6_17 {
  position: relative;
  width: 100%;
}

._comboBoxSelectWrap_13ge6_22 {
  position: relative;
}

._trigger_13ge6_26 {
  width: 100%;
  cursor: pointer;
}

._trigger_13ge6_26:disabled {
  cursor: not-allowed;
  background-color: var(--ui-combo-disabled-bg);
}

._triggerText_13ge6_37 {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

._placeholderText_13ge6_44 {
  color: var(--ui-muted);
}

._comboBoxArrow_13ge6_48 {
}

._trigger_13ge6_26:disabled + ._comboBoxArrow_13ge6_48 {
  color: var(--ui-combo-arrow-disabled);
}

._dropdown_13ge6_56 {
  position: fixed;
  z-index: 1000;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

._resizeHandle_13ge6_65 {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 5;
  width: 14px;
  height: 14px;
  cursor: nwse-resize;
  background: linear-gradient(
    135deg,
    transparent 0 45%,
    #8d98a5 45% 55%,
    transparent 55% 65%,
    #8d98a5 65% 75%,
    transparent 75% 100%
  );
}

body.searchable-check-combo-resizing {
  user-select: none;
  cursor: nwse-resize;
}

._dropdownWithSearch_13ge6_88 {
  padding-top: 0;
}

._searchRow_13ge6_92 {
}

._searchIcon_13ge6_96 {
  flex: none;
  color: var(--ui-muted);
}

._searchInput_13ge6_101 {
}

._searchInput_13ge6_101::placeholder {
  color: var(--ui-muted);
}

._listArea_13ge6_109 {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-10 18:34 KST
   b9c0d1e2-f3a4-5678-bcde-901234567890
   아이템 많을 때 스크롤 thumb 최소 높이(첨부 대비 약 2배)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._listArea_13ge6_109::-webkit-scrollbar-thumb {
  min-height: 48px;
}

._emptyText_13ge6_125 {
}

._selectAllRow_13ge6_129 {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow: visible;
}

._selectAllRow_13ge6_129 .checkboxWrap {
  flex-shrink: 0;
  overflow: visible;
}

._selectAllRow_13ge6_129 label {
  margin: 0;
  cursor: pointer;
  white-space: nowrap;
}

._selectAllRow_13ge6_129:hover {
  background: var(--ui-searchable-combo-box-hover-bg);
}

._separator_13ge6_152 {
  margin: 4px 0;
  border: none;
  border-top: 1px solid var(--ui-multiselect-separator);
}

._itemRow_13ge6_158 {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow: visible;
}

._itemRow_13ge6_158 .checkboxWrap {
  flex-shrink: 0;
  overflow: visible;
}

._itemRow_13ge6_158 label {
  margin: 0;
  cursor: pointer;
  white-space: nowrap;
}

._itemRow_13ge6_158:hover {
  background: var(--ui-searchable-combo-box-hover-bg);
}

/* SearchableCheckComboBox ? trigger area search input */
._searchTriggerInput_13ge6_182 {
  width: 100%;
  cursor: text;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:00 KST
// 6c777d1c-dc3d-420a-be6e-13a4882092a3
// 검색형 다중 선택 콤보에 공통 소형 입력 규격 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._small_13ge6_195 {
}

._searchTriggerInput_13ge6_182:disabled {
  cursor: not-allowed;
  background-color: var(--ui-combo-disabled-bg);
}

._searchTriggerInput_13ge6_182::placeholder {
  color: var(--ui-combo-text);
  opacity: 1;
}

._searchTriggerInput_13ge6_182._isPlaceholder_13ge6_209::placeholder {
  color: var(--ui-muted);
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 다중 선택 콤보의 화살표 영역을 공통 우측 여백 토큰에 맞춤
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._searchTriggerArrowButton_13ge6_220 {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--ui-combo-end-space, 24px);
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

._searchTriggerArrowButton_13ge6_220:disabled {
  cursor: not-allowed;
}

._searchTriggerArrowButton_13ge6_220:disabled ._comboBoxArrow_13ge6_48 {
  color: var(--ui-combo-arrow-disabled);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:57 KST
// 8fcac96d-1dd8-46d0-81d3-f16dbe91ecea
// shadcn 선택 컴포넌트 기준으로 콤보 종류별 공통 스타일 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 11:59 KST
// 3f6fd57f-665c-48a0-8277-5edee35ede19
// 콤보 입력 상태를 즉시 표시하고 목록 진입 효과는 유지
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 17:47 KST
// 5020ab7b-75c4-4acd-bbe5-0b017e00247e
// 공통 콤보 화살표를 Lucide SVG와 중앙정렬 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/._trigger_fx20j_38 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 14:37 KST
  // 1527a783-296b-4534-9522-25229aa95249
  // 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  display: block;
  box-sizing: border-box;
  margin: 0;
  padding: 2px var(--ui-combo-end-space, 24px) 2px var(--ui-field-control-padding-x, 8px);
  border: 1px solid var(--ui-combo-border);
  border-radius: var(--ui-combo-radius, 4px);
  outline: none;
  background: var(--ui-combo-bg);
  color: var(--ui-combo-text);
  font: inherit;
  font-size: 1rem;
  line-height: 1.75rem;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgb(0 0 0 / 3%);
  transition: none;
}/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:00 KST
// 6c777d1c-dc3d-420a-be6e-13a4882092a3
// CSS 로드 순서와 무관하게 소형 콤보의 높이와 세로 중앙 정렬을 우선 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:28 KST
// 7799d18d-8dea-489a-b8a6-a92dc91e8fcd
// 소형 콤보 입력과 선택 목록 글자 크기를 공통 12px 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*//*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:41 KST
// ad26efff-1c60-4800-9abc-15e685ba2d41
// 소형 콤보 입력과 선택 목록의 기본 글자 크기를 14px로 복원
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/._trigger_fx20j_38._triggerSmall_fx20j_87 {
  height: var(--ui-field-control-height, 28px);
  min-height: var(--ui-field-control-height, 28px);
  padding-top: 0;
  padding-bottom: 0;
  font-size: var(--ui-field-control-font-size, 14px);
  line-height: normal;
}._trigger_fx20j_38._triggerSmall_fx20j_87 option,
._popup_fx20j_97[data-ui-size='small'],
._popup_fx20j_97[data-ui-size='small'] :is(._option_fx20j_98, ._searchInput_fx20j_98, ._emptyText_fx20j_98, label) {
  font-size: var(--ui-field-control-font-size, 14px);
}._trigger_fx20j_38:not(:disabled):is(:hover, :focus, [aria-expanded='true']) {
  border-color: var(--ui-combo-focus-border);
  background: var(--ui-combo-focus-bg);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-combo-focus-border) 12%, transparent);
}._trigger_fx20j_38:disabled {
  cursor: not-allowed;
  background: var(--ui-combo-disabled-bg);
  box-shadow: none;
}._popup_fx20j_97 {
  box-sizing: border-box;
  padding: 4px;
  border: 1px solid var(--ui-combo-border);
  border-radius: var(--ui-menu-radius, 6px);
  background: var(--ui-combo-option-bg);
  color: var(--ui-combo-text);
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -2px rgb(0 0 0 / 10%);
}._option_fx20j_98 {
  box-sizing: border-box;
  min-height: 30px;
  padding: 5px 8px;
  border-radius: var(--ui-radius-tight, 2px);
  color: var(--ui-combo-text);
  font: inherit;
  line-height: 1.4;
  cursor: pointer;
}._option_fx20j_98:is(:hover, :focus-within, [data-highlighted]) {
  background: var(--ui-searchable-combo-box-hover-bg);
}._arrow_fx20j_139 {
  position: absolute;
  top: 50%;
  right: var(--ui-combo-arrow-inset, 5px);
  display: block;
  width: var(--ui-combo-arrow-width, 16px);
  height: var(--ui-combo-arrow-width, 16px);
  color: var(--ui-combo-arrow);
  transform: translateY(-50%);
  pointer-events: none;
}._emptyText_fx20j_98 {
  padding: 20px 8px;
  color: var(--ui-muted);
  font-size: 1rem;
  text-align: center;
}._searchRow_fx20j_158 {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 8px;
  margin: 0 -4px 4px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--ui-combo-border);
}._searchInput_fx20j_98 {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--ui-combo-text);
  font: inherit;
  line-height: 1.4;
}._searchInput_fx20j_98::placeholder {
  color: var(--ui-muted);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:57 KST
// 8fcac96d-1dd8-46d0-81d3-f16dbe91ecea
// shadcn 선택 컴포넌트 기준으로 콤보 종류별 공통 스타일 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 17:47 KST
// 5020ab7b-75c4-4acd-bbe5-0b017e00247e
// 공통 콤보 화살표를 Lucide SVG와 중앙정렬 규격으로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._root_gz12e_31 {
  position: relative;
  width: 100%;
}

._comboBoxSelectWrap_gz12e_36 {
  position: relative;
}

._comboBoxArrow_gz12e_40 {
}

._comboBoxArrowSmall_gz12e_44 {
  top: calc(50% - 0.5px);
  right: var(--ui-combo-arrow-inset, 5px);
  width: 14px;
  height: 14px;
}

._dropdown_gz12e_51 {
  position: fixed;
  z-index: 1000;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

._resizeHandle_gz12e_60 {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 5;
  width: 14px;
  height: 14px;
  cursor: nwse-resize;
  background: linear-gradient(
    135deg,
    transparent 0 45%,
    #8d98a5 45% 55%,
    transparent 55% 65%,
    #8d98a5 65% 75%,
    transparent 75% 100%
  );
}

body.searchable-combo-resizing {
  user-select: none;
  cursor: nwse-resize;
}

._listArea_gz12e_83 {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-10 18:34 KST
   b9c0d1e2-f3a4-5678-bcde-901234567890
   아이템 많을 때 스크롤 thumb 최소 높이(첨부 대비 약 2배)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._listArea_gz12e_83::-webkit-scrollbar-thumb {
  min-height: 48px;
}

._emptyText_gz12e_99 {
}

._optionRow_gz12e_103 {
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding-right: 30px;
  border: 0;
  background: transparent;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._optionRow_gz12e_103:hover,
._optionRow_gz12e_103._isActive_gz12e_119 {
  background: var(--ui-searchable-combo-box-hover-bg);
}

._optionRow_gz12e_103._isSelected_gz12e_123 {
  font-weight: 500;
}

._optionRow_gz12e_103:disabled,
._optionRow_gz12e_103[aria-disabled='true'] {
  cursor: not-allowed;
  opacity: 0.6;
}

._searchTriggerInput_gz12e_133 {
  width: 100%;
  cursor: text;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 12:56 KST
// 51401723-e83a-419c-9e84-5c5e0d79e6f8
// Lucide 아이콘 통일과 입력 및 작업영역 사용성 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:00 KST
// 6c777d1c-dc3d-420a-be6e-13a4882092a3
// 검색형 단일 콤보도 동일한 소형 높이와 중앙 정렬 규격 공유
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._small_gz12e_153 {
}

._searchTriggerInput_gz12e_133._hasClearButton_gz12e_157 {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-08 17:19 KST
  // 62d97ac5-fb59-4d34-bfa2-ce00b9e6d65f
  // 입력 초기화 아이콘의 중앙 정렬과 화살표 버튼 간격 보정
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  padding-right: calc(var(--ui-combo-end-space, 24px) + 22px);
}

._clearButton_gz12e_168 {
  position: absolute;
  top: 50%;
  right: var(--ui-combo-end-space, 24px);
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--ui-radius-compact, 3px);
  background: transparent;
  color: var(--ui-muted);
  font-size: 0;
  line-height: 1;
  cursor: pointer;
}

._clearButton_gz12e_168:hover {
  background: var(--ui-searchable-combo-box-hover-bg);
  color: var(--ui-combo-text);
}

._clearButton_gz12e_168 > svg {
  display: block;
  width: 14px;
  height: 14px;
  flex: none;
}

._searchTriggerInput_gz12e_133:disabled {
  cursor: not-allowed;
  background-color: var(--ui-combo-disabled-bg);
}

._searchTriggerInput_gz12e_133::placeholder {
  color: var(--ui-combo-text);
  opacity: 1;
}

._searchTriggerInput_gz12e_133._isPlaceholder_gz12e_210::placeholder {
  color: var(--ui-muted);
}

._searchTriggerArrowButton_gz12e_214 {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--ui-combo-end-space, 24px);
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

._searchTriggerArrowButton_gz12e_214:disabled {
  cursor: not-allowed;
}

._searchTriggerArrowButton_gz12e_214:disabled ._comboBoxArrow_gz12e_40 {
  color: var(--ui-combo-arrow-disabled);
}

._optionRow_gz12e_103._isSelected_gz12e_123::after {
  content: "";
  position: absolute;
  right: 11px;
  top: 50%;
  width: 5px;
  height: 9px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-65%) rotate(45deg);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 12:39 KST
// 767f32f3-2dc0-4a3d-80a1-98eb1b208d6a
// 다크 모드의 그리드·탭·팝업 색상 대비와 선택 상태 연결 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._tabRoot_16cf3_22 {
  gap: 0;
  margin-top: 0;
  min-height: 0;
  position: relative;
}

._tabRootTop_16cf3_29,
._tabRootBottom_16cf3_30 {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-08-23 14:42 KST */
/* 50f2e719-0450-4cef-9609-1197a18cc2a9 */
/* 탭 구분선과 컨텐츠 사이 간격을 배치별로 10px 확보 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._tabRootTop_16cf3_29 {
  row-gap: 10px;
}

._tabRootBottom_16cf3_30 {
  flex-direction: column-reverse;
  row-gap: 10px;
}

._tabRootLeft_16cf3_51,
._tabRootRight_16cf3_52 {
  display: grid;
  align-items: stretch;
  min-height: 360px;
  overflow: hidden;
  column-gap: 10px;
}

._tabRootLeft_16cf3_51 {
  grid-template-columns: auto 1fr;
}

._tabRootRight_16cf3_52 {
  grid-template-columns: 1fr auto;
}

._tabList_16cf3_68 {
  position: relative;
  display: inline-flex;
  gap: 0;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  background-color: var(--ui-tab-list-bg, #f0f0f0);
  color: var(--ui-muted, #666);
}

._tabRootTop_16cf3_29 ._tabList_16cf3_68,
._tabRootBottom_16cf3_30 ._tabList_16cf3_68 {
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-start;
  width: 100%;
  min-height: 34px;
}

._tabRootTop_16cf3_29 ._tabList_16cf3_68 {
  padding-top: 4px;
  border-bottom: 1px solid var(--ui-tab-border, #8b8b8b);
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:56 KST
   e7c2a9b4-5d18-4f36-8a07-1b9c4e6d8f25
   bottom 탭 align(left/center/right), 좌우 탭 align(top/middle/bottom) 지원
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._tabRootTop_16cf3_29._tabAlignRight_16cf3_98 ._tabList_16cf3_68,
._tabRootBottom_16cf3_30._tabAlignRight_16cf3_98 ._tabList_16cf3_68 {
  justify-content: flex-end;
}

._tabRootTop_16cf3_29._tabAlignCenter_16cf3_103 ._tabList_16cf3_68,
._tabRootBottom_16cf3_30._tabAlignCenter_16cf3_103 ._tabList_16cf3_68 {
  justify-content: center;
}

._tabRootTop_16cf3_29._tabAlignRight_16cf3_98 ._tabTriggerLeading_16cf3_108:disabled,
._tabRootBottom_16cf3_30._tabAlignRight_16cf3_98 ._tabTriggerLeading_16cf3_108:disabled,
._tabRootTop_16cf3_29._tabAlignCenter_16cf3_103 ._tabTriggerLeading_16cf3_108:disabled,
._tabRootBottom_16cf3_30._tabAlignCenter_16cf3_103 ._tabTriggerLeading_16cf3_108:disabled {
  flex: 0 0 auto;
}

._tabRootBottom_16cf3_30 ._tabList_16cf3_68 {
  padding-bottom: 4px;
  border-top: 1px solid var(--ui-tab-border, #8b8b8b);
}

._tabRootLeft_16cf3_51 ._tabList_16cf3_68,
._tabRootRight_16cf3_52 ._tabList_16cf3_68 {
  flex-direction: column;
  justify-content: flex-start;
  align-self: stretch;
  height: 100%;
  width: auto;
  min-width: 132px;
  grid-row: 1;
  border-bottom: none;
}

._tabRootLeft_16cf3_51 ._tabList_16cf3_68 {
  grid-column: 1;
  align-items: flex-end;
  border-right: 2px solid var(--ui-tab-border, #8b8b8b);
}

._tabRootRight_16cf3_52 ._tabList_16cf3_68 {
  grid-column: 2;
  align-items: flex-start;
  border-left: 2px solid var(--ui-tab-border, #8b8b8b);
}

._tabTrigger_16cf3_108 {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  margin: 0;
  border-radius: var(--ui-radius-none, 0);
  font-size: 1rem;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

._tabTriggerLabel_16cf3_160 {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
  text-overflow: ellipsis;
  font-size: 1rem;
  /* transition: font-size 0.10s ease, font-weight 0.10s ease; */

}

._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[data-active] ._tabTriggerLabel_16cf3_160,
._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[data-selected] ._tabTriggerLabel_16cf3_160,
._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[aria-selected="true"] ._tabTriggerLabel_16cf3_160,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[data-active] ._tabTriggerLabel_16cf3_160,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[data-selected] ._tabTriggerLabel_16cf3_160,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[aria-selected="true"] ._tabTriggerLabel_16cf3_160,
._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[data-active] ._tabTriggerLabel_16cf3_160,
._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[data-selected] ._tabTriggerLabel_16cf3_160,
._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[aria-selected="true"] ._tabTriggerLabel_16cf3_160,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[data-active] ._tabTriggerLabel_16cf3_160,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[data-selected] ._tabTriggerLabel_16cf3_160,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[aria-selected="true"] ._tabTriggerLabel_16cf3_160 {
  font-size: 1rem;
  font-weight: var(--app-font-weight-bold);
}

._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108 {
  height: 32px;
  padding: 4px 10px;
  border: none;
  background: transparent;
  color: var(--ui-muted, #666);
}

._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108:not(._tabTriggerLeading_16cf3_108):not([data-active]):not([data-selected]):not([aria-selected="true"]) + ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"])::before,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108:not(._tabTriggerLeading_16cf3_108):not([data-active]):not([data-selected]):not([aria-selected="true"]) + ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"])::before {
  content: "|";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ui-tab-separator, #bdbdbd);
  font-size: 0.95rem;
  pointer-events: none;
}

/* Remove uneven padding-left override for center alignment */


._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108 {
  min-width: 132px;
  min-height: 36px;
  padding: 8px 14px;
  border: 0 solid var(--ui-tab-separator, #bdbdbd);
  background-color: var(--ui-tab-list-bg, #f0f0f0);
  color: var(--ui-muted, #666);
}

._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108 {
  width: 132px;
  justify-content: flex-end;
}

._tabRootLeft_16cf3_51 ._tabTriggerLabel_16cf3_160 {
  text-align: right;
}

._tabRootRight_16cf3_52 ._tabTriggerLabel_16cf3_160 {
  text-align: left;
}

._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108 {
  width: 132px;
  justify-content: flex-start;
}

._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"]):not(:disabled):not(._tabTriggerTrailing_16cf3_241):not(._tabTriggerLeading_16cf3_108)::after {
  content: "";
  position: absolute;
  left: 10%;
  bottom: 0;
  width: 50%;
  height: 1px;
  background-color: var(--ui-tab-separator, #bdbdbd);
  pointer-events: none;
}

._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"]):not(:disabled):not(._tabTriggerTrailing_16cf3_241):not(._tabTriggerLeading_16cf3_108)::after {
  content: "";
  position: absolute;
  right: 10%;
  bottom: 0;
  width: 50%;
  height: 1px;
  background-color: var(--ui-tab-separator, #bdbdbd);
  pointer-events: none;
}

._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"]):not(:disabled):not(._tabTriggerTrailing_16cf3_241):has(
  + ._tabTrigger_16cf3_108[data-active],
  + ._tabTrigger_16cf3_108[data-selected],
  + ._tabTrigger_16cf3_108[aria-selected="true"]
)::after,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"]):not(:disabled):not(._tabTriggerTrailing_16cf3_241):has(
  + ._tabTrigger_16cf3_108[data-active],
  + ._tabTrigger_16cf3_108[data-selected],
  + ._tabTrigger_16cf3_108[aria-selected="true"]
)::after {
  display: none;
}

._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"]):not(:disabled):not(._tabTriggerTrailing_16cf3_241):has(+ ._tabTriggerTrailing_16cf3_241)::after,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108:not([data-active]):not([data-selected]):not([aria-selected="true"]):not(:disabled):not(._tabTriggerTrailing_16cf3_241):has(+ ._tabTriggerTrailing_16cf3_241)::after {
  display: none;
}

._tabRootLeft_16cf3_51 ._tabTriggerLeading_16cf3_108:disabled::after,
._tabRootLeft_16cf3_51 ._tabTriggerTrailing_16cf3_241::after,
._tabRootLeft_16cf3_51 ._tabList_16cf3_68 > ._tabTrigger_16cf3_108:last-child::after,
._tabRootRight_16cf3_52 ._tabTriggerLeading_16cf3_108:disabled::after,
._tabRootRight_16cf3_52 ._tabTriggerTrailing_16cf3_241::after,
._tabRootRight_16cf3_52 ._tabList_16cf3_68 > ._tabTrigger_16cf3_108:last-child::after {
  display: none !important;
  content: none !important;
}

._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[data-active],
._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[data-selected],
._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[aria-selected="true"] {
  z-index: 2;
  height: 34px !important;
  margin-bottom: -1px;
  padding: 4px 12px;
  border-style: solid;
  border-color: var(--ui-tab-border, #8b8b8b);
  border-width: 2px 1px 0 1px;
  border-top-color: var(--ui-tab-active-indicator, var(--ui-text, #000));
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  color: var(--ui-text, #333);
  max-width: 220px;
  overflow: visible;
}

._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[data-selected]::before,
._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[aria-selected="true"]::before {
  display: none !important;
}

._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[data-active]::after,
._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[data-selected]::after,
._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108[aria-selected="true"]::after {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  bottom: -2px;
  height: 3px;
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  pointer-events: none;
}

._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[data-active],
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[data-selected],
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[aria-selected="true"] {
  z-index: 2;
  height: 34px !important;
  margin-top: -1px;
  padding: 4px 12px;
  border-style: solid;
  border-color: var(--ui-tab-border, #8b8b8b);
  border-width: 0 1px 2px 1px;
  border-bottom-color: var(--ui-tab-active-indicator, var(--ui-text, #000));
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  color: var(--ui-text, #333);
  max-width: 220px;
  overflow: visible;
}

._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[data-selected]::before,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[aria-selected="true"]::before {
  display: none !important;
}

._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[data-active]::after,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[data-selected]::after,
._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108[aria-selected="true"]::after {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  top: -2px;
  height: 3px;
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  pointer-events: none;
}

._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108 + ._tabTrigger_16cf3_108,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108 + ._tabTrigger_16cf3_108 {
  border-top: none;
}

._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[data-active],
._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[data-selected],
._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[aria-selected="true"] {
  z-index: 1;
  width: 20ch;
  padding: 10px 18px;
  border-style: solid;
  border-color: var(--ui-tab-border, #8b8b8b);
  border-width: 1px 0 3px 1px;
  border-bottom-color: var(--ui-tab-active-indicator, var(--ui-text, #000));
  border-right: none !important;
  margin-right: -2px;
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  color: var(--ui-text, #333);
  justify-content: flex-end;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-03 14:47 KST */
/* a1b2c3d4-e5f6-7890-abcd-ef1234567890 */
/* 우측 배치 선택 탭이 탭리스트 좌측 구분선과 연결되도록 margin-left 보정 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[data-active],
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[data-selected],
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[aria-selected="true"] {
  z-index: 1;
  width: 20ch;
  padding: 10px 18px;
  border-style: solid;
  border-color: var(--ui-tab-border, #8b8b8b);
  border-width: 1px 1px 3px 0;
  border-bottom-color: var(--ui-tab-active-indicator, var(--ui-text, #000));
  border-left: none !important;
  margin-left: -2px;
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  color: var(--ui-text, #333);
}

._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[data-active]::after,
._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[data-selected]::after,
._tabRootLeft_16cf3_51 ._tabTrigger_16cf3_108[aria-selected="true"]::after,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[data-active]::after,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[data-selected]::after,
._tabRootRight_16cf3_52 ._tabTrigger_16cf3_108[aria-selected="true"]::after {
  display: none !important;
  content: none !important;
}

._tabTrigger_16cf3_108:focus-visible {
  outline: 2px solid var(--ui-primary, #2563eb);
  outline-offset: 1px;
}

._tabTrigger_16cf3_108:disabled {
  pointer-events: none;
  cursor: default;
}

._tabRootTop_16cf3_29 ._tabTriggerLeading_16cf3_108:disabled,
._tabRootBottom_16cf3_30 ._tabTriggerLeading_16cf3_108:disabled {
  opacity: 1;
  flex: 1;
  padding: 0 !important;
  border: none;
  background: transparent;
}

._tabRootLeft_16cf3_51 ._tabTriggerLeading_16cf3_108:disabled,
._tabRootRight_16cf3_52 ._tabTriggerLeading_16cf3_108:disabled {
  opacity: 1;
  width: 20ch;
  min-height: 12px;
  height: 12px;
  padding: 0 !important;
  border: none;
  background-color: var(--ui-tab-list-bg, #f0f0f0);
}

._tabRootLeft_16cf3_51 ._tabTriggerTrailing_16cf3_241,
._tabRootRight_16cf3_52 ._tabTriggerTrailing_16cf3_241 {
  min-height: 12px;
  height: 12px;
}

._tabRootLeft_16cf3_51 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241:last-child,
._tabRootRight_16cf3_52 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241:last-child {
  flex: 1 1 auto;
  height: auto;
  min-height: 12px;
  align-self: stretch;
}

._tabRootLeft_16cf3_51._tabAlignMiddle_16cf3_458 ._tabList_16cf3_68,
._tabRootRight_16cf3_52._tabAlignMiddle_16cf3_458 ._tabList_16cf3_68 {
  justify-content: center;
}

._tabRootLeft_16cf3_51._tabAlignBottom_16cf3_463 ._tabList_16cf3_68,
._tabRootRight_16cf3_52._tabAlignBottom_16cf3_463 ._tabList_16cf3_68 {
  justify-content: flex-end;
}

._tabRootLeft_16cf3_51._tabAlignMiddle_16cf3_458 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241,
._tabRootRight_16cf3_52._tabAlignMiddle_16cf3_458 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241,
._tabRootLeft_16cf3_51._tabAlignBottom_16cf3_463 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241,
._tabRootRight_16cf3_52._tabAlignBottom_16cf3_463 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241,
._tabRootLeft_16cf3_51._tabAlignMiddle_16cf3_458 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241:last-child,
._tabRootRight_16cf3_52._tabAlignMiddle_16cf3_458 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241:last-child,
._tabRootLeft_16cf3_51._tabAlignBottom_16cf3_463 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241:last-child,
._tabRootRight_16cf3_52._tabAlignBottom_16cf3_463 ._tabList_16cf3_68 > ._tabTriggerTrailing_16cf3_241:last-child {
  flex: 0 0 auto;
  height: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: none;
}

._tabPanel_16cf3_484 {
  min-height: 0;
  /* padding: 16px; */
  background-color: transparent;
  outline: none;
  font-size: 0.875rem;
}

._tabRootTop_16cf3_29 ._tabPanel_16cf3_484,
._tabRootBottom_16cf3_30 ._tabPanel_16cf3_484 {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  border: none;
  background-color: transparent;
}

._tabRootLeft_16cf3_51 ._tabPanel_16cf3_484 {
  grid-column: 2;
  grid-row: 1;
  min-height: 0;
  overflow: auto;
}

._tabRootRight_16cf3_52 ._tabPanel_16cf3_484 {
  grid-column: 1;
  grid-row: 1;
  min-height: 0;
  overflow: auto;
}

._tabPanelHidden_16cf3_515 {
  visibility: hidden;
  pointer-events: none;
  overflow: hidden;
  padding: 0;
  border: none;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

._tabRootTop_16cf3_29 ._tabPanelHidden_16cf3_515,
._tabRootBottom_16cf3_30 ._tabPanelHidden_16cf3_515,
._tabRootLeft_16cf3_51 ._tabPanelHidden_16cf3_515,
._tabRootRight_16cf3_52 ._tabPanelHidden_16cf3_515 {
  top: 0;
  left: 0;
}



/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-07 12:25 KST */
/* 123e4567-e89b-12d3-a456-426614174000 */
/* TabsTrigger closable 옵션 시 MainTaskbar 패턴 닫기 버튼 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._tabTriggerWrap_16cf3_544 {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  height: 44px;
  margin: 0;
  border: none;
  border-radius: var(--ui-radius-none, 0);
  background: transparent;
  color: var(--ui-muted, #666);
  overflow: visible;
  flex: 0 0 auto;
}

._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544:not(:has(._tabTriggerLeading_16cf3_108)):not(:has(._tabTrigger_16cf3_108[aria-selected="true"])) + ._tabTriggerWrap_16cf3_544:not(:has(._tabTrigger_16cf3_108[aria-selected="true"])) ._tabTrigger_16cf3_108::before,
._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544:not(:has(._tabTriggerLeading_16cf3_108)):not(:has(._tabTrigger_16cf3_108[aria-selected="true"])) + ._tabTriggerWrap_16cf3_544:not(:has(._tabTrigger_16cf3_108[aria-selected="true"])) ._tabTrigger_16cf3_108::before {
  content: "|";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ui-tab-separator, #bdbdbd);
  font-size: 0.95rem;
  pointer-events: none;
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-08 07:02 KST */
/* 4c8e2f91-7b6d-4a1e-9c3d-5e8f0a2b1c4d */
/* closable 탭: 활성 탭 ::before만 숨김(왼쪽 이웃 탭 구분선은 유지) */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTrigger_16cf3_108::before,
._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTrigger_16cf3_108::before {
  display: none !important;
}

._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544 ._tabTriggerInWrap_16cf3_582,
._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544 ._tabTriggerInWrap_16cf3_582 {
  height: 44px;
  max-width: 220px;
  padding: 10px 8px;
  border: none;
  background: transparent;
}

._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) {
  z-index: 2;
  /* height: 48px !important; */
  margin-bottom: -1px;
  border-style: solid;
  border-color: var(--ui-tab-border, #8b8b8b);
  border-width: 3px 1px 0 1px;
  border-top-color: var(--ui-tab-active-indicator, var(--ui-text, #000));
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  color: var(--ui-text, #333);
  max-width: 240px;
  overflow: visible;
}

._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTriggerInWrap_16cf3_582 {
  /* height: 48px !important; */
  padding: 8px 10px 8px 16px;
  border: none !important;
  background: transparent !important;
  color: var(--ui-text, #333);
  max-width: none;
  margin-bottom: 0 !important;
}

._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTriggerInWrap_16cf3_582::after {
  display: none !important;
  content: none !important;
}

._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"])::after {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  bottom: -2px;
  height: 3px;
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  pointer-events: none;
}

._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) {
  z-index: 2;
  /* height: 48px !important; */
  margin-top: -1px;
  padding: 0;
  border: none;
  border-left: 1px solid var(--ui-tab-border, #8b8b8b);
  border-right: 1px solid var(--ui-tab-border, #8b8b8b);
  border-bottom: 3px solid var(--ui-tab-active-indicator, var(--ui-text, #000));
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  color: var(--ui-text, #333);
  max-width: 240px;
  overflow: visible;
}

._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTriggerInWrap_16cf3_582 {
  /* height: 48px !important; */
  padding: 8px 10px 8px 16px;
  border: none !important;
  background: transparent !important;
  color: var(--ui-text, #333);
  max-width: none;
  margin-top: 0 !important;
}

._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTriggerInWrap_16cf3_582::after {
  display: none !important;
  content: none !important;
}

._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"])::after {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  top: -2px;
  height: 3px;
  background-color: var(--ui-tab-active-bg, #e3e3e3);
  pointer-events: none;
}

._tabTriggerClose_16cf3_672 {
  width: 22px;
  height: 44px;
  margin-right: 4px;
  border: none;
  background: transparent;
  color: var(--ui-muted, #888);
  cursor: pointer;
  font-size: 1.2rem;
  font-family: var(--default-font-family-bold), Arial, sans-serif;
  line-height: 1;
  flex: 0 0 auto;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease, color 0.15s ease;
}

._tabTriggerWrap_16cf3_544:hover ._tabTriggerClose_16cf3_672,
._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTriggerClose_16cf3_672 {
  opacity: 1;
  pointer-events: auto;
}

._tabRootTop_16cf3_29 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTriggerClose_16cf3_672,
._tabRootBottom_16cf3_30 ._tabTriggerWrap_16cf3_544:has(._tabTrigger_16cf3_108[aria-selected="true"]) ._tabTriggerClose_16cf3_672 {
  height: 48px;
}

._tabTriggerClose_16cf3_672:hover {
  color: var(--ui-danger, #a31c1c);
}

@media (max-width: 1024px) {
  html[data-app-layout='responsive'] {
  /* 00000000-0000-0000-0000-000000000000
     2026-08-27 11:05 KST
     a8c3e1b6-7d29-4f15-9a03-8e0c2d7b5f41
     모바일 상단 탭은 한 줄 유지하고 가로 드래그로 나머지 메뉴를 보게 함
     ffffffff-ffff-ffff-ffff-ffffffffffff */
  ._tabRootTop_16cf3_29 ._tabList_16cf3_68,
  ._tabRootBottom_16cf3_30 ._tabList_16cf3_68 {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  ._tabRootTop_16cf3_29 ._tabList_16cf3_68::-webkit-scrollbar,
  ._tabRootBottom_16cf3_30 ._tabList_16cf3_68::-webkit-scrollbar {
    display: none;
  }

  ._tabRootTop_16cf3_29 ._tabTrigger_16cf3_108,
  ._tabRootBottom_16cf3_30 ._tabTrigger_16cf3_108 {
    flex: 0 0 auto;
    flex-shrink: 0;
    max-width: none;
    min-width: max-content;
    overflow: visible;
  }

  ._tabRootTop_16cf3_29 ._tabTriggerLabel_16cf3_160,
  ._tabRootBottom_16cf3_30 ._tabTriggerLabel_16cf3_160 {
    width: auto;
    min-width: max-content;
    overflow: visible;
    text-overflow: clip;
  }
  }
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 00000000-0000-0000-0000-000000000000
   2026-08-23 11:44 KST
   3e7a8dc1-2fe1-4c9c-9f39-27e0a7ac6d17
   상품등록 점프탭 드래그 재정렬 시 원위치/드롭영역/플로팅 미리보기 스타일 추가
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._isListDragging_1anw7_20 {
  cursor: grabbing;
}

._draggableTabTrigger_1anw7_24 {
  touch-action: none;
  user-select: none;
}

@media (max-width: 1024px) {
  html[data-app-layout='responsive'] {
  /* 00000000-0000-0000-0000-000000000000
     2026-08-27 11:05 KST
     a8c3e1b6-7d29-4f15-9a03-8e0c2d7b5f41
     모바일 점프탭은 가로 스와이프 스크롤이 가능하도록 터치 제스처를 허용
     ffffffff-ffff-ffff-ffff-ffffffffffff */
  ._draggableTabTrigger_1anw7_24 {
    touch-action: pan-x;
  }
  }
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:05 KST
   f6c2e4a8-9b37-4d18-a015-8e1c3b7d6a59
   점프탭 드래그 시 원위치를 작업바와 같이 점선 네모로 표기
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._draggableTabTrigger_1anw7_24._isDragging_1anw7_47 {
  cursor: grabbing;
  color: transparent !important;
  position: relative;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
  overflow: visible !important;
}

._draggableTabTrigger_1anw7_24._isDragging_1anw7_47 > span {
  visibility: hidden !important;
}

._draggableTabTrigger_1anw7_24._isDragging_1anw7_47::before {
  display: none !important;
  content: none !important;
}

._draggableTabTrigger_1anw7_24._isDragging_1anw7_47::after,
[data-slot="tabs-trigger"]._draggableTabTrigger_1anw7_24._isDragging_1anw7_47::after,
[data-slot="tabs-trigger"][data-active]._draggableTabTrigger_1anw7_24._isDragging_1anw7_47::after,
[data-slot="tabs-trigger"][data-selected]._draggableTabTrigger_1anw7_24._isDragging_1anw7_47::after,
[data-slot="tabs-trigger"][aria-selected="true"]._draggableTabTrigger_1anw7_24._isDragging_1anw7_47::after {
  display: block !important;
  content: '' !important;
  position: absolute !important;
  inset: 2px !important;
  left: 2px !important;
  right: 2px !important;
  top: 2px !important;
  bottom: 2px !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  border: 2px dashed var(--ui-muted, #9aa0a6) !important;
  border-radius: var(--ui-radius-compact, 3px) !important;
  background: rgba(232, 234, 237, 0.65) !important;
  background-color: rgba(232, 234, 237, 0.65) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 20:50 KST
   8c4f2a71-9e36-4b18-a047-5d1e8c6b3f92
   점프탭 드래그 순서조정 시 대상 다음 경계에 삽입선 표시 (가로: 우측 세로선, 세로: 하단 가로선)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-25 20:52 KST
   a3e7b91c-4d28-4f16-8a05-9c1e0d7b5f42
   카테고리 관리와 같은 삽입선 모양을 유지하고 반투명 처리
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-25 20:55 KST
   b8d4e1a6-7c29-4f15-9a03-8e0c2d6b5f41
   탭 구분선 ::after보다 삽입선이 우선되도록 세로배치 클래스와 속성 고정
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._draggableTabTrigger_1anw7_24._isDragOver_1anw7_108 {
  position: relative;
  overflow: visible !important;
  z-index: 2;
}

._draggableTabTrigger_1anw7_24._isDragOver_1anw7_108::before {
  display: none !important;
  content: none !important;
}

._draggableTabTrigger_1anw7_24._isDragOver_1anw7_108::after {
  display: block !important;
  content: '' !important;
  position: absolute !important;
  top: 8px !important;
  bottom: 8px !important;
  left: auto !important;
  right: -2px !important;
  width: 3px !important;
  height: auto !important;
  transform: none !important;
  border: none !important;
  border-radius: var(--ui-radius-none, 0) !important;
  background: rgba(26, 115, 232, 0.45) !important;
  background-color: rgba(26, 115, 232, 0.45) !important;
  pointer-events: none !important;
  z-index: 5 !important;
}

._draggableTabTrigger_1anw7_24._isDragOverVertical_1anw7_138._isDragOverAfter_1anw7_138::after {
  top: auto !important;
  left: 8px !important;
  right: 8px !important;
  bottom: -2px !important;
  width: auto !important;
  height: 3px !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 21:12 KST
   b9e4c2d6-1a38-4f17-8b05-7d0c3e9a6f42
   카테고리관리처럼 앞쪽이면 윗선(가로목록은 왼선)에 드롭해 대상 앞에 넣음
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._draggableTabTrigger_1anw7_24._isDragOverBefore_1anw7_152::after {
  left: -2px !important;
  right: auto !important;
}

._draggableTabTrigger_1anw7_24._isDragOverVertical_1anw7_138._isDragOverBefore_1anw7_152::after {
  top: -2px !important;
  bottom: auto !important;
  left: 8px !important;
  right: 8px !important;
  width: auto !important;
  height: 3px !important;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-25 20:56 KST
   c1f8a4d2-6e39-4b17-9c05-8d0a3e7b5f42
   드래그 미리보기 기울기 제거, 드래그 개체는 반투명 표기
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._dragPreview_1anw7_171 {
  position: fixed;
  z-index: 9000;
  display: inline-flex;
  align-items: center;
  max-width: 220px;
  height: 32px;
  padding: 0 14px;
  border: 1px solid #8b8b8b;
  border-radius: var(--ui-radius-compact, 3px);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 28px rgba(32, 33, 36, 0.28);
  transform: translate(-50%, -60%);
  opacity: 0.7;
  pointer-events: none;
}

._dragPreviewTitle_1anw7_188 {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1rem;
  font-weight: var(--app-font-weight-bold);
  color: var(--ui-text, #333);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 14:04 KST
// ecb80801-3c68-4968-963a-346925f99f4c
// 검색 팝업과 공통 입력 색상을 테마 역할 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-16 18:45 KST */
/* f28e3858-e79d-4c9d-b609-3d2c22a79dd9 */
/* DateTextBox 기본폭: 폼 inputDefault(9.07rem)과 동일, 페이지 className이 우선 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._wrap_yroqe_20 {
  position: relative;
  display: inline-flex;
  align-items: stretch;
  box-sizing: border-box;
  width: fit-content;
  max-width: 100%;
}

._input_yroqe_29 {
  box-sizing: border-box;
  padding-right: 2rem !important;
}

:where(._input_yroqe_29) {
  width: 16ch;
}

._calendarButton_yroqe_38 {
  position: absolute;
  top: 50%;
  right: 0.15rem;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--ui-radius-compact, 3px);
  background: transparent;
  color: var(--ui-muted, #64748b);
  cursor: pointer;
}

._calendarButton_yroqe_38:hover:not(:disabled) {
  background-color: var(--ui-search-option-hover-bg, rgba(47, 108, 229, 0.12));
  color: var(--ui-primary, #1d4ed8);
}

._calendarButton_yroqe_38:disabled {
  cursor: default;
  opacity: 0.45;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 14:37 KST
// 1527a783-296b-4534-9522-25229aa95249
// 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 15:07 KST
// 35184fff-ff7e-4188-94ea-ba5a920196f9
// 아이콘 굵기와 상태 색상 및 초기 화면 표시 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._calendarIcon_yroqe_81 {
  display: block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  stroke-width: 1.75;
}

._popover_yroqe_89 {
  position: fixed;
  z-index: 10050;
  box-sizing: border-box;
  width: 300px;
  min-width: 280px;
  padding: 10px 10px 8px;
  border: 1px solid var(--ui-border, #cbd5e1);
  border-radius: var(--ui-menu-radius, 6px);
  background: var(--ui-surface, #ffffff);
  color: var(--ui-text, #0f172a);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
}

._calendar_yroqe_38 {
  --rdp-accent-color: var(--ui-primary, #334155);
  --rdp-accent-background-color: var(--ui-primary, #334155);
  --rdp-day_button-border-radius: var(--ui-radius-compact, 3px);
  --rdp-selected-border: 2px solid var(--ui-primary, #facc15);
  margin: 0;
  width: 100%;
}

._calendar_yroqe_38 .rdp-month_grid {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

._calendar_yroqe_38 .rdp-weekday,
._calendar_yroqe_38 .rdp-day {
  padding: 0;
  text-align: center;
  font-weight: inherit;
  border: 0;
}

._calendar_yroqe_38 .rdp-months {
  justify-content: center;
  width: 100%;
}

._calendar_yroqe_38 .rdp-month_caption {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 0 6px;
}

._calendar_yroqe_38 .rdp-dropdowns {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

._calendar_yroqe_38 .rdp-dropdown {
  padding: 2px 4px;
  border: 1px solid var(--ui-border, #cbd5e1);
  border-radius: var(--ui-combo-radius, 4px);
  background: var(--ui-input-bg, #fff);
  font-size: 1.2rem;
  color: var(--ui-input-text, #0f172a);
}

._calendar_yroqe_38 .rdp-button_previous,
._calendar_yroqe_38 .rdp-button_next {
  width: 28px;
  height: 28px;
  border: none;
  border-radius: var(--ui-radius-compact, 3px);
  background: transparent;
  color: var(--ui-primary, #2563eb);
  cursor: pointer;
}

._calendar_yroqe_38 .rdp-button_previous:hover,
._calendar_yroqe_38 .rdp-button_next:hover {
  background: var(--ui-selected, #dbeafe);
}

._calendar_yroqe_38 .rdp-weekday {
  font-size: 0.75rem;
  font-weight: var(--app-font-weight-bold);
  color: var(--ui-muted, #475569);
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-16 18:50 KST */
/* 293b2769-cb4a-4c73-ab20-ae1b998e3a20 */
/* 요일/일자: 일·공휴일 빨강, 토 연한파랑 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._calendar_yroqe_38 .rdp-weekdays .rdp-weekday:nth-child(1) {
  color: var(--ui-danger, #dc2626);
}

._calendar_yroqe_38 .rdp-weekdays .rdp-weekday:nth-child(7) {
  color: var(--ui-primary, #0ea5e9);
}

._calendar_yroqe_38 .rdp-day_button {
  width: 32px;
  height: 32px;
  font-size: 1rem;
  border: 0;
  background: transparent;
}

._calendar_yroqe_38 .rdp-weeks .rdp-week .rdp-day:nth-child(1):not(.rdp-outside):not(.rdp-selected) .rdp-day_button {
  color: var(--ui-danger, #dc2626);
}

._calendar_yroqe_38 .rdp-weeks .rdp-week .rdp-day:nth-child(7):not(.rdp-outside):not(.rdp-selected) .rdp-day_button {
  color: var(--ui-primary, #0ea5e9);
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-07-16 18:55 KST */
/* ad57aa97-bce4-4afe-ae02-1ecf50e2893e */
/* 공휴일 붉은색: 토/일 색보다 나중에·더 강하게 적용(10-3 등) */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._calendar_yroqe_38 .rdp-weeks .rdp-week ._dayHoliday_yroqe_210:not(.rdp-outside):not(.rdp-selected) .rdp-day_button,
._calendar_yroqe_38 .rdp-weeks .rdp-week .rdp-day:nth-child(1)._dayHoliday_yroqe_210:not(.rdp-outside):not(.rdp-selected) .rdp-day_button,
._calendar_yroqe_38 .rdp-weeks .rdp-week .rdp-day:nth-child(7)._dayHoliday_yroqe_210:not(.rdp-outside):not(.rdp-selected) .rdp-day_button {
  color: var(--ui-danger, #dc2626);
}

._calendar_yroqe_38 .rdp-outside .rdp-day_button {
  color: var(--ui-muted, #94a3b8);
  font-size: 0.7rem;
}

._calendar_yroqe_38 .rdp-selected .rdp-day_button,
._calendar_yroqe_38 .rdp-day_button[aria-selected='true'] {
  background: var(--ui-primary, #334155) !important;
  color: var(--ui-on-primary, #ffffff) !important;
  border: 2px solid var(--ui-primary, #facc15) !important;
  font-weight: var(--app-font-weight-bold);
}

._calendar_yroqe_38 .rdp-today:not(.rdp-selected) .rdp-day_button {
  border-bottom: 2px solid var(--ui-danger, red);
  
}

/* 00000000-0000-0000-0000-000000000000 */
/* 2026-08-29 08:48 KST */
/* d4a7c2e9-1b58-4f06-8c13-9e0a5d7b3f21 */
/* 달력은 한 달만 그려 요일·날짜가 밀리지 않게 함 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000 */
/* 2026-08-29 08:55 KST */
/* a7c3e1d8-4b26-4f09-8e15-2d9a0c6b5f38 */
/* 한 달 달력에서 손가락 스와이프로 월 이동 */
/* ffffffff-ffff-ffff-ffff-ffffffffffff */
._monthSwipeViewport_yroqe_244 {
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  touch-action: none;
}

._monthPane_yroqe_252 {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

._footer_yroqe_259 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px solid var(--ui-border, #e2e8f0);
}

._footerButton_yroqe_269 {
  min-width: 4.5rem;
  height: 1.75rem;
  padding: 0 0.75rem;
  border: 1px solid var(--ui-border, #cbd5e1);
  border-radius: var(--ui-radius-compact, 3px);
  background: var(--ui-surface, #f8fafc);
  color: var(--ui-input-text, #0f172a);
  font-size: 0.8125rem;
  cursor: pointer;
}

._footerButton_yroqe_269:hover {
  background: var(--ui-selected, #e2e8f0);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

._optionButton_1kcir_16 {
  display: inline-flex;
  align-items: flex-start;
  gap: 4px;
  cursor: pointer;
  font-size: 1rem;
  user-select: none;
}

._optionButtonTextWrap_1kcir_25 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.25;
}

._optionButtonLabel_1kcir_32 {
  font-size: 1rem;
}

._optionButtonComment_1kcir_36 {
  font-size: 0.9rem;
  color: var(--ui-muted, #555);
}

._optionButtonDisabled_1kcir_41 {
  cursor: not-allowed;
  opacity: 0.6;
}

._optionButtonInput_1kcir_46 {
  cursor: pointer;
  width: 14px;
  height: 14px;
  margin-top: 1px;
  border: 1px solid var(--ui-option-border, #64748b);
  border-radius: var(--ui-radius-pill, 999px);
  background: var(--ui-option-bg, #ffffff);
  position: relative;
}

._optionButtonInput_1kcir_46[data-checked] {
  border-color: var(--ui-option-checked-bg, #2563eb);
}

._optionButtonInput_1kcir_46[data-checked]::after {
  content: '';
  position: absolute;
  inset: 3px;
  border-radius: inherit;
  background: var(--ui-option-checked-bg, #2563eb);
}

._optionButtonInput_1kcir_46:focus-visible,
._optionButtonInput_1kcir_46[data-focus-visible] {
  outline: 2px solid var(--ui-option-focus-ring, rgb(37 99 235 / 30%));
  outline-offset: 2px;
}

._optionButtonDisabled_1kcir_41 ._optionButtonInput_1kcir_46,
._optionButtonInput_1kcir_46[data-disabled] {
  cursor: not-allowed;
}
._optionButtonGroup_tq95h_1 {
  display: flex;
  
  gap: 10px;
}._container_17xcp_1 {
  display: flex;
  flex-direction: row;
  align-items: center;
}


._header_17xcp_8 {
  width: 2ch;
  text-align: right;
  margin-left: 0px;
  margin-right: 4px;
  color: red;
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  border: 0px solid red;
}


._label_17xcp_21 {
  /* width: 20ch; */ /* 라벨의 최대 너비를 20ch로 설정, 이후 텍스트박스 등장 */
  font-size: 1rem;
  text-align: left;
  padding-left: 5px;
}


._labelFlush_17xcp_29 {
  padding-left: 0;
}


._required_17xcp_34 {
  font-size: 1.2rem;
}

._input_17xcp_38 {
  flex: 1 1 auto;
}/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._section_hzzkl_8 {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--ui-section-border);
  border-radius: var(--ui-section-radius);
  background: var(--ui-section-bg);
  box-shadow: var(--ui-section-shadow);
}

._headingRow_hzzkl_17 { display: flex; align-items: stretch; background: var(--ui-section-heading-bg); }
._heading_hzzkl_17 {
  display: flex;
  flex: 1;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: var(--ui-section-heading-height);
  margin: 0;
  padding: 0 12px;
  border: 0;
  border-left: 3px solid var(--ui-section-accent);
  background: transparent;
  color: var(--ui-section-heading-text);
  font: inherit;
  font-weight: 700;
  text-align: left;
}
button._heading_hzzkl_17 { cursor: pointer; }
button._heading_hzzkl_17:hover { background: var(--ui-section-hover-bg); }
button._heading_hzzkl_17:focus-visible { outline: 2px solid var(--ui-section-accent); outline-offset: -2px; }
._summary_hzzkl_38 { font-size: 12px; font-weight: 400; color: var(--ui-section-muted); }
._chevron_hzzkl_39 { flex-shrink: 0; margin-left: auto; color: var(--ui-section-muted); }
._chevron_hzzkl_39[data-expanded='false'] { transform: rotate(-90deg); }
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 18:34 KST
// e6704aad-ec35-49a4-9914-f93f6de88e0f
// 공용 입력폼 섹션 제목을 14px로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._heading_hzzkl_17 { font-size: 14px; }
._headingActions_hzzkl_49 { display: flex; align-items: center; gap: 8px; padding: 0 12px; }
._content_hzzkl_50 { min-width: 0; }
._content_hzzkl_50[hidden] { display: none; }

._fieldGrid_hzzkl_53 { display: grid; min-width: 0; grid-template-columns: repeat(var(--ui-field-columns, 2), minmax(0, 1fr)); }
._fieldGrid_hzzkl_53 [data-ui-field] {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  min-width: 0;
  min-height: var(--ui-field-row-height);
  max-width: 100%;
  margin: 0;
  border-right: 1px solid var(--ui-section-border);
  border-bottom: 1px solid var(--ui-section-border);
}
._fieldGrid_hzzkl_53 [data-ui-field] > :first-child {
  width: var(--ui-field-label-width);
  flex-shrink: 0;
  align-items: center;
  padding: 3px var(--ui-field-padding-x);
  border-right: 1px solid var(--ui-section-border);
  background: var(--ui-field-label-bg);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:00 KST
// 6c777d1c-dc3d-420a-be6e-13a4882092a3
// 28px 소형 입력을 기존 폼 행 안에 중앙 정렬하고 세로 넘침 방지
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._fieldGrid_hzzkl_53 [data-ui-field] > :last-child { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; padding: 2px 9px; }
._fieldGrid_hzzkl_53 [data-ui-field] label { padding-left: 0; font-size: 12px; line-height: 1.4; font-weight: 500; color: var(--ui-field-label-text); }
._fieldGrid_hzzkl_53 [data-ui-field] > :first-child > div:empty { display: none; }
._fieldGrid_hzzkl_53 [data-ui-field] > :first-child > div:has(+ label) { width: auto; }
._fieldGrid_hzzkl_53 [data-ui-field] :is(input:not([type='radio']):not([type='checkbox']), select, textarea, [data-slot='select-trigger']) { width: 100%; min-width: 0; max-width: 100%; }
._fieldGrid_hzzkl_53 [data-ui-field] :is(input:not([type='radio']):not([type='checkbox']), select, [data-slot='select-trigger']) { height: var(--ui-field-control-height); min-height: 0; padding-top: 0; padding-bottom: 0; line-height: normal; }
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:28 KST
// 7799d18d-8dea-489a-b8a6-a92dc91e8fcd
// 공통 필드 행의 소형 입력과 셀렉트 글자를 12px로 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:41 KST
// ad26efff-1c60-4800-9abc-15e685ba2d41
// 필드 행의 소형 입력 글자 크기를 14px로 복원
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._fieldGrid_hzzkl_53 [data-ui-field] :is(input:not([type='radio']):not([type='checkbox']), select, [data-slot='select-trigger']) {
  font-size: var(--ui-field-control-font-size, 14px);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 14:37 KST
// 1527a783-296b-4534-9522-25229aa95249
// 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._fieldGrid_hzzkl_53 [data-ui-field] :is(input:not([type='radio']):not([type='checkbox']), select, textarea, [data-slot='select-trigger']) {
  padding-left: var(--ui-field-control-padding-x);
}
._fieldGrid_hzzkl_53 [data-ui-field] [data-option-button-group='true'] {
  box-sizing: border-box;
  border-left: 1px solid transparent;
  padding-left: var(--ui-field-control-padding-x);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:15 KST
// a80e13f6-89dc-4a54-b882-bd9bc764e0b8
// 정보 입력의 hover와 포커스 효과를 동일하게 적용
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._fieldGrid_hzzkl_53 [data-ui-field] :is(input:not([type='radio']):not([type='checkbox']), select, textarea, [data-slot='select-trigger']):not(:disabled):not([readonly]):not(:hover):not(:focus):not(:focus-visible) { border-color: transparent; background-color: transparent; }
._fieldGrid_hzzkl_53 [data-ui-field] :is(input:not([type='radio']):not([type='checkbox']), select, textarea, [data-slot='select-trigger']):not(:disabled):not([readonly]):is(:hover, :focus, :focus-visible) {
  border-color: var(--ui-input-focus-border);
  background-color: var(--ui-input-focus-bg);
  box-shadow: 0 0 0 3px var(--ui-option-focus-ring);
  outline: none;
}
._fieldGrid_hzzkl_53 [data-ui-field][data-full-width] { grid-column: 1 / -1; }
._fieldGrid_hzzkl_53 [data-ui-field] > :last-child > div:has(> input),
._fieldGrid_hzzkl_53 [data-ui-field] > :last-child > div:has(> select) { min-width: 0; flex: 1 1 auto; }
._toolbar_hzzkl_135 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-toolbar-gap); min-height: var(--ui-toolbar-height); padding: 4px 12px; border-bottom: 1px solid var(--ui-section-border); background: var(--ui-section-bg); }

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 17:22 KST
// 2f6db7bf-5f4d-473d-a0d9-7994dcce63f0
// 회원과 주문 등록의 안내 및 저장 버튼 영역을 공통 푸터로 구성
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._actionFooter_hzzkl_144 {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
}

@media (max-width: 1100px) {
  html[data-app-layout='responsive'] ._fieldGrid_hzzkl_53 { grid-template-columns: minmax(0, 1fr); }
}


/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 16:41 KST
// 8fcac96d-1dd8-46d0-81d3-f16dbe91ecea
// 상담과 메시지 팝업의 공통 폼 디자인 및 입력 제목과 즐겨찾기 표시 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._fieldGrid_hzzkl_53 [data-ui-field] > :first-child label { font-weight: 700; }
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

._positioner_1p5h6_24 {
  z-index: var(--ui-menu-layer, 10000);
}

._content_1p5h6_28 {
  border: 1px solid var(--ui-menu-border, rgb(255 255 255 / 10%));
  border-radius: var(--ui-menu-radius, 6px);
  background: var(--ui-menu-surface, #1e2333);
  color: var(--ui-menu-text, #ffffff);
  box-shadow: var(--ui-menu-shadow, 0 12px 28px rgb(0 0 0 / 28%));
  outline: 0;
}

._content_1p5h6_28[data-ending-style] {
  pointer-events: none;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 12:56 KST
// 51401723-e83a-419c-9e84-5c5e0d79e6f8
// Lucide 아이콘 통일과 입력 및 작업영역 사용성 개선
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._positioner_4tsur_23 {
  z-index: var(--ui-tooltip-layer, 12000);
}

._content_4tsur_27 {
  position: relative;
  max-width: min(320px, calc(100vw - 16px));
  padding: 8px 10px;
  border: 1px solid var(--ui-tooltip-border, rgb(255 255 255 / 12%));
  border-radius: var(--ui-tooltip-radius, 4px);
  background: var(--ui-tooltip-surface, #141a26);
  color: var(--ui-tooltip-text, #f8fafc);
  box-shadow: var(--ui-tooltip-shadow, 0 8px 20px rgb(0 0 0 / 28%));
  font-family: var(--default-font-family, 'Malgun Gothic', sans-serif);
  font-size: 12px;
  line-height: 1.45;
  pointer-events: none;
  white-space: normal;
  overflow-wrap: anywhere;
}

._arrow_4tsur_44 {
  width: 8px;
  height: 8px;
  background: var(--ui-tooltip-surface, #141a26);
  transform: rotate(45deg);
}

._arrow_4tsur_44[data-side='top'] {
  bottom: -4px;
}

._arrow_4tsur_44[data-side='bottom'] {
  top: -4px;
}

._arrow_4tsur_44[data-side='left'] {
  right: -4px;
}

._arrow_4tsur_44[data-side='right'] {
  left: -4px;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 17:22 KST
// 2f6db7bf-5f4d-473d-a0d9-7994dcce63f0
// HTML title 툴팁의 포털 위치와 화살표 방향 구성
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._htmlTitleTooltip_4tsur_74 {
  position: fixed;
  z-index: var(--ui-tooltip-layer, 12000);
}

._htmlTitleArrow_4tsur_79 {
  position: absolute;
  left: 50%;
  width: 8px;
  height: 8px;
  border-right: 1px solid var(--ui-tooltip-border, rgb(255 255 255 / 12%));
  border-bottom: 1px solid var(--ui-tooltip-border, rgb(255 255 255 / 12%));
  background: var(--ui-tooltip-surface, #141a26);
}

._htmlTitleTooltip_4tsur_74[data-placement='top'] ._htmlTitleArrow_4tsur_79 {
  bottom: -5px;
  transform: translateX(-50%) rotate(45deg);
}

._htmlTitleTooltip_4tsur_74[data-placement='bottom'] ._htmlTitleArrow_4tsur_79 {
  top: -5px;
  transform: translateX(-50%) rotate(225deg);
}

._helpButton_4tsur_99 {
  display: inline-flex;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--ui-section-border, #dfe0e3);
  border-radius: var(--ui-radius-circle, 50%);
  background: var(--ui-section-bg, #ffffff);
  color: var(--ui-section-muted, #70737c);
  font-family: var(--default-font-family, 'Malgun Gothic', sans-serif);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: help;
}

._helpButton_4tsur_99:hover {
  border-color: var(--ui-section-accent, #0066ff);
  background: var(--ui-section-hover-bg, #eaf2fe);
  color: var(--ui-section-accent, #0066ff);
}

._helpButton_4tsur_99:focus-visible {
  outline: 2px solid var(--ui-option-focus-ring, rgb(0 102 255 / 18%));
  outline-offset: 2px;
}

._helpButton_4tsur_99:disabled {
  cursor: default;
  opacity: 0.5;
}
._container_k9t34_1 {
  display: flex;
  flex-direction: row;
  align-items: center;
}

._header_k9t34_7 {
  width: 2ch;
  text-align: right;
  margin-left: 0px;
  margin-right: 4px;
  color: red;
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  border: 0px solid red;
}


._label_k9t34_20 {
  /* width: 20ch; */ /* 라벨의 최대 너비를 20ch로 설정, 이후 텍스트박스 등장 */
  font-size: 1rem;
  text-align: left;
  padding-left: 5px;
}


._labelFlush_k9t34_28 {
  padding-left: 0;
}



._labelAfter_k9t34_34 {
  display: inline-flex;
  align-items: center;
  height: 1.25em;
  margin-left: 2px;
  flex-shrink: 0;
}


._required_k9t34_43 {
  font-size: 1.2rem;
 }

._input_k9t34_47 {
  flex: 1 1 auto;
}/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 14:04 KST
// ecb80801-3c68-4968-963a-346925f99f4c
// 검색 팝업과 공통 입력 색상을 테마 역할 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._wrap_1ril3_15 {
  display: inline-flex;
  align-items: stretch;
  box-sizing: border-box;
  min-width: 12ch;
  border-bottom: 1px solid var(--ui-input-border);
  background-color: var(--ui-input-bg);
  transition: border-color 0.5s ease, background-color 0.3s ease;
}

._wrap_1ril3_15:focus-within {
  background-color: var(--ui-input-focus-bg);
  border-bottom-color: var(--ui-input-focus-border);
}

._wrapDisabled_1ril3_30 {
  background-color: var(--ui-input-disabled-bg);
  border-bottom-color: var(--ui-input-disabled-border);
}

._percentButton_1ril3_35 {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  margin: 0;
  padding: 0 0.2rem;
  border: 0;
  border-radius: var(--ui-input-radius, 4px);
  background: transparent;
  color: var(--ui-muted, #8a93a3);
  font-size: 1rem;
  line-height: 1.75rem;
  cursor: pointer;
  user-select: none;
}

._percentButton_1ril3_35:hover:not(:disabled) {
  background-color: var(--ui-search-option-hover-bg, rgba(47, 108, 229, 0.12));
}

._percentButtonActive_1ril3_57 {
  background-color: var(--ui-search-option-active-bg, #dbeafe);
  color: var(--ui-search-option-active-text, #1d4ed8);
  font-weight: var(--app-font-weight-bold);
}

._percentButton_1ril3_35:disabled {
  cursor: default;
  opacity: 0.55;
}

._input_1ril3_68 {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  border-bottom: 0 !important;
  background: transparent !important;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-09 12:39 KST
// 767f32f3-2dc0-4a3d-80a1-98eb1b208d6a
// 다크 모드의 그리드·탭·팝업 색상 대비와 선택 상태 연결 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 10:54 KST
// e28f9de0-9d2c-40d3-aeff-e5b96c01c77e
// 팝업 경로 표시와 닫기 버튼 및 본문·푸터 공통 디자인 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 11:20 KST
// c32148e8-5f5c-4677-8adc-b3309691edd9
// 팝업과 등록 입력폼 및 조직도 카드 디자인 정리
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._popupWindowBackdrop_x7mos_53 {
  position: fixed;
  inset: 0;
  background-color: var(--ui-popup-overlay, rgb(15 23 42 / 45%));
  z-index: 8000;
  opacity: 0;
  pointer-events: none;
}

._popupWindowLayer_x7mos_62 {
  position: fixed;
  inset: 0;
  z-index: 8000;
  pointer-events: none;
}

._visible_x7mos_69 {
  opacity: 1;
  pointer-events: auto;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-23 11:10 KST
   7c3e91a2-5b8d-4f01-9e6a-2d4b8c0f1a57
   닫힘/페이드 중 투명 팝업이 클릭을 가로채지 않도록 visible일 때만 포인터 허용
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._popupWindow_x7mos_53 {
  position: fixed;
  display: flex;
  flex-direction: column;
  max-width: 100vw;
  max-height: calc(100vh - 16px);
  overflow: hidden;
  background: var(--ui-popup-bg);
  color: var(--ui-popup-text);
  border: 1px solid var(--ui-popup-border);
  border-radius: var(--ui-radius-surface, 8px);
  box-shadow: 0 12px 32px rgb(0 0 0 / 14%), 0 4px 12px rgb(0 0 0 / 8%);
  opacity: 0;
  pointer-events: none;
}

._popupWindowDimmed_x7mos_95 {
  border: none;
}

._popupWindowFitContent_x7mos_99 ._popupWindowBody_x7mos_99 {
  flex: 0 1 auto;
}

._popupWindow_x7mos_53._visible_x7mos_69 {
  opacity: 1;
  pointer-events: auto;
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-17 09:50 KST
   c8f1a3d6-2b47-4e90-9d15-6a0c4e8b7f32
   팝업 헤더·닫기·푸터를 기본글자 rem 비율로 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._popupWindowHeader_x7mos_113 {
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 8px var(--ui-popup-padding-x);
  flex: 0 0 auto;
  cursor: move;
  border-bottom: 1px solid var(--ui-popup-border);
  background: var(--ui-popup-bg);
  touch-action: none;
  user-select: none;
}

._titleStyle_x7mos_126 {
  font-family: var(--default-font-family-bold), sans-serif;
  font-size: 14px;
  font-weight: var(--app-font-weight-bold);
  color: var(--ui-popup-text);
  line-height: 1.4;
  letter-spacing: 0;
}

._popupWindowHeaderContent_x7mos_135 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(12rem / 14);
  width: 100%;
}

._popupWindowHeaderActions_x7mos_143 {
  display: flex;
  align-items: center;
  gap: calc(6rem / 14);
}

._popupWindowHeader_x7mos_113 h2 {
  font-family: var(--default-font-family-bold), sans-serif;
  font-size: 14px;
  font-weight: var(--app-font-weight-bold);
  color: var(--ui-popup-text, #172b4d);
  line-height: 1;
  letter-spacing: 0;
  margin: 0;
}


button._closeBtn_x7mos_160 {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  border-radius: var(--ui-radius-compact, 3px);
  background: var(--ui-popup-close-bg);
  color: var(--ui-popup-muted);
  flex: 0 0 28px;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  font-family: var(--default-font-family), 'Arial', sans-serif;
}

button._closeBtn_x7mos_160:hover {
  color: var(--ui-popup-text);
  background-color: var(--ui-popup-close-hover-bg);
}

button._closeBtn_x7mos_160 > svg {
  display: block;
  flex: none;
}

button._closeBtn_x7mos_160:focus-visible {
  outline: 2px solid var(--ui-popup-primary);
  outline-offset: 2px;
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-10 17:22 KST
   2f6db7bf-5f4d-473d-a0d9-7994dcce63f0
   팝업 경로를 본문 우측 상단의 보조 정보로 표시
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._breadcrumb_x7mos_198 {
  flex: none;
  align-self: stretch;
  padding: 0 0 8px;
  background: transparent;
  color: var(--ui-popup-muted, #6b7280);
  font-size: 12px;
  line-height: 16px;
}

._breadcrumb_x7mos_198 ol {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
  justify-content: flex-end;
}

._breadcrumb_x7mos_198 li { display: flex; align-items: center; }
._breadcrumb_x7mos_198 [aria-current='page'] { font-weight: 700; }
._breadcrumbSeparator_x7mos_220 { margin: 0 6px; opacity: 0.45; }

._popupWindowClose_x7mos_222 {
  color: #aaaaaa;
  font-size: 2.6rem;
  line-height: 1;
  cursor: pointer;
  border: none;
  background: none;
  font-weight: var(--app-font-weight-bold);
  padding: 0;
}

._popupWindowClose_x7mos_222:hover {
  color: var(--ui-popup-text, #172b4d);
  background-color: var(--ui-popup-hover-bg, #eef1f5);
}

.popup-window-header-button {
  min-width: 28px;
  height: 28px;
  border: 1px solid var(--ui-popup-border, #dfe0e3);
  border-radius: var(--ui-radius-control, 4px);
  background: var(--ui-popup-bg, #ffffff);

  color: var(--ui-popup-text, #1c2b3a);
  font-size: 0.8rem;
  line-height: 1;
  font-weight: var(--app-font-weight-bold);
  cursor: pointer;
}

._popupWindowBody_x7mos_99 {
  padding: var(--ui-popup-padding-y) var(--ui-popup-padding-x);
  overflow: auto;
  flex: 1 1 auto;
  min-height: 0;
}

._popupWindowFooter_x7mos_259 {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ui-popup-action-gap);
  padding: var(--ui-popup-footer-padding-y) var(--ui-popup-padding-x);
  border-top: 1px solid var(--ui-popup-border);
  background: var(--ui-popup-bg);
  flex: 0 0 auto;
}

._popupWindowFooter_x7mos_259 .action-button {
  min-width: var(--ui-popup-action-min-width);
  min-height: var(--ui-popup-action-height);
  padding: 4px 16px;
  justify-content: center;
  border-radius: var(--ui-radius-menu, 6px);
}

._popupWindowFooter_x7mos_259 [data-popup-primary]:not(:disabled) {
  background: var(--ui-popup-primary);
  border-color: var(--ui-popup-primary);
  color: var(--ui-popup-on-primary);
  font-weight: 700;
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-09 16:04 KST
   44881bd1-579a-4dbd-bc08-8efee0397752
   공통 팝업의 주 동작 버튼에도 굵은 글자 규칙 적용
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._popupWindowFooter_x7mos_259 [data-popup-primary] .actionButtonLabel {
  font-weight: 700;
}

._popupWindowFooter_x7mos_259 [data-popup-primary]:not(:disabled):hover {
  background: var(--ui-popup-primary-hover);
  border-color: var(--ui-popup-primary-hover);
}

._popupWindowResizeHandle_x7mos_300 {
  position: absolute;
  background: transparent;
  z-index: 1;
  pointer-events: auto;
  touch-action: none;
}

._popupWindowResizeHandleX_x7mos_308 {
  top: 0;
  right: 0;
  width: 8px;
  height: 100%;
  cursor: ew-resize;

}

._popupWindowResizeHandleY_x7mos_317 {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 14px;
  transform: none;
  cursor: ns-resize;
  z-index: 10;

}

._popupWindowResizeHandleY_x7mos_317::before {
  content: none;
}

._popupWindowResizeHandleXy_x7mos_332 {
  right: 0;
  bottom: 0;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
  z-index: 20;
}

body.popup-window-resizing {
  user-select: none;
  touch-action: none;
}

body.popup-window-dragging {
  user-select: none;
  touch-action: none;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 10:54 KST
// e28f9de0-9d2c-40d3-aeff-e5b96c01c77e
// 팝업 경로 표시와 닫기 버튼 및 본문·푸터 공통 디자인 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 11:20 KST
// c32148e8-5f5c-4677-8adc-b3309691edd9
// 팝업과 등록 입력폼 및 조직도 카드 디자인 정리
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/* 00000000-0000-0000-0000-000000000000
   2026-08-12 17:06 KST
   e6f7a8b9-c0d1-4e2f-3a4b-5c6d7e8f9a0b
   size: 컨텐츠 100% + margin 0 auto / full: contentWidth 밴드 + margin 0 auto
   ffffffff-ffff-ffff-ffff-ffffffffffff */

._generalWindow_1y08d_30 {
  max-width: 100vw;
  box-sizing: border-box;
}

._generalWindowSize_1y08d_35 {
  box-sizing: border-box;
  max-width: 100vw;
}

._generalHeaderContent_1y08d_40 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: var(--general-popup-content-width, 100%);
  max-width: calc(100% - (var(--general-popup-edge-x, 10px) * 2));
  margin: 0 auto;
  min-width: 0;
  box-sizing: border-box;
}

._generalHeaderContent_1y08d_40 > span {
  margin-left: 0;
}

/* PopupWindow.popupWindowBody padding(14/18)보다 우선 */
._centerBody_1y08d_56 {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: var(--ui-popup-padding-y) max(var(--general-popup-edge-x, 10px), var(--ui-popup-padding-x)) !important;
  box-sizing: border-box;
}

._centerBodySize_1y08d_65 {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: var(--ui-popup-padding-y) var(--ui-popup-padding-x) !important;
  box-sizing: border-box;
}

._centerBodyFitContent_1y08d_74 {
  height: auto;
  flex: 0 1 auto;
}

/*
 * size: --general-popup-content-width = 100% (창 채움)
 * full: --general-popup-content-width = contentWidth (팝업 대비 %)
 * 직계 자식: 고정폭/콘텐츠폭은 가로 중앙, 전체폭이 필요하면 width:100% 또는 align-self:stretch
 */
/* 00000000-0000-0000-0000-000000000000
   2026-08-12 18:10 KST
   59f0994f-c5ea-4082-91c3-c603b2436ebb
   contentColumn 직계 자식 가로 중앙(저장팝업·직급조정과 동일)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._contentColumn_1y08d_89 {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: var(--general-popup-content-width, 100%);
  max-width: 100%;
  height: 100%;
  min-width: 0;
  margin: 0 auto;
  box-sizing: border-box;
}

/* 00000000-0000-0000-0000-000000000000
   2026-09-10 17:22 KST
   2f6db7bf-5f4d-473d-a0d9-7994dcce63f0
   본문 상단 경로 아래에서 콘텐츠가 남은 높이를 사용하도록 조정
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._centerBody_1y08d_56 > ._contentColumn_1y08d_89,
._centerBodySize_1y08d_65 > ._contentColumn_1y08d_89 {
  flex: 1 1 auto;
  height: auto;
}

._contentColumnFitContent_1y08d_112 {
  height: auto;
}

._contentColumnFitContent_1y08d_112._standardContent_1y08d_116 > :only-child {
  height: auto;
}

._contentColumn_1y08d_89 > * {
  max-width: 100%;
  box-sizing: border-box;
}

/* 단일 본문 래퍼의 바깥 여백은 창이 한 번만 적용한다. */
._contentColumn_1y08d_89._standardContent_1y08d_116 > :only-child {
  padding: 0;
  margin: 0;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  align-self: stretch;
}

._generalFooterContent_1y08d_135 {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: var(--ui-popup-action-gap);
  width: var(--general-popup-content-width, 100%);
  max-width: 100%;
  margin: 0 auto;
}
/* 00000000-0000-0000-0000-000000000000
   2026-08-13 12:04 KST
   6e1a9c24-0f83-4b7d-9a52-3d8e1c7b6045
   드래그/리사이즈 중 iframe 포인터 이벤트 차단
   ffffffff-ffff-ffff-ffff-ffffffffffff */

._host_2thes_7 {
  width: 100%;
  flex: 1 1 auto;
  min-height: 460px;
  align-self: stretch;
  overflow: hidden;
  position: relative;
}

._host_2thes_7 iframe {
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-height: 460px;
  border: 0;
}

body.popup-window-dragging ._host_2thes_7,
body.popup-window-resizing ._host_2thes_7 {
  pointer-events: none;
}
._page_1i8v1_1 {
  max-width: 520px;
  margin: 40px auto;
  padding: 16px;
}

._logo_1i8v1_7 {
  display: none;
  width: 72px;
  height: 72px;
  object-fit: contain;
  margin-bottom: 16px;
  border-radius: 16px;
}

._title_1i8v1_16 {
  font-size: 2.2rem;
  font-weight: var(--app-font-weight-bold);
}

._form_1i8v1_21 {
  display: flex;
  flex-direction: column;
}

._input_1i8v1_26 {
  width: 100%;
  margin-bottom: 12px;
  border: 1px solid #ccc;
  height: 2em;
  padding: 0.5em;
}

._error_1i8v1_34 {
  color: crimson;
}

._requestUrlList_1i8v1_38 {
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  font-size: 12px;
  color: #555;
  line-height: 1.6;
  word-break: break-all;
}

._requestUrlLabel_1i8v1_48 {
  margin-right: 6px;
  font-weight: var(--app-font-weight-bold);
}

._loginPageSuccess_1i8v1_53 {
  opacity: 0.3;
  filter: blur(1px);
  transition: opacity 0.2s ease, filter 0.2s ease;
}

._successOverlay_1i8v1_59 {
  position: fixed;
  border-radius: 0;
  background-color: #2196f3;
  opacity: 0.8;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='110' height='28'%3E%3Ctext x='4' y='20' font-size='13' fill='rgba(255,255,255,0.25)' font-family='sans-serif'%3E%EC%95%8C%EC%95%A4%EB%94%94%ED%94%BC%EC%95%84%3C/text%3E%3C/svg%3E");
  background-repeat: repeat;
  z-index: 1;
  pointer-events: none;
  width: 10px;
  height: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%) scale(1) rotate(0deg);
  animation: _square-expand_1i8v1_1 1.6s cubic-bezier(0.5, 0, 0.5, 1) forwards;
}

@keyframes _square-expand_1i8v1_1 {
  from {
    transform: translate(-50%, -50%) scale(1) rotate(0deg);
  }

  to {
    transform: translate(-50%, -50%) scale(500) rotate(720deg);
  }
}

._successOverlayText_1i8v1_87 {
  font-size: 0.2px;
  color: white;
  white-space: nowrap;
}

._successOverlayBlocker_1i8v1_93 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  z-index: 1;
  pointer-events: auto;
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 13:16 KST
// 4716864a-1ea2-482e-88a7-a02fcb679a39
// 회원정보 행 배치와 팝업 입력 밀도 및 화면 회귀 수정
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 11:20 KST
// c32148e8-5f5c-4677-8adc-b3309691edd9
// 팝업과 등록 입력폼 및 조직도 카드 디자인 정리
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._form_1kciv_16 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: var(--ui-form-row-gap) var(--ui-form-column-gap);
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  box-sizing: border-box;
  font-family: var(--default-font-family), sans-serif;
}

._field_1kciv_29 {
  display: flex;
  flex-direction: column;
  gap: var(--ui-form-label-gap);
  min-width: 0;
}

._fullWidth_1kciv_36 { grid-column: 1 / -1; }

._inline_1kciv_38 {
  row-gap: 8px;
}

._inline_1kciv_38 ._field_1kciv_29 {
  display: grid;
  grid-template-columns: minmax(0, 112px) minmax(0, 1fr);
  align-items: center;
  column-gap: 8px;
}

._inline_1kciv_38 ._label_1kciv_49 {
  font-size: 12px;
  overflow-wrap: anywhere;
}

._label_1kciv_49 {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  color: var(--ui-form-label);
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 600;
  text-align: left;
}

._required_1kciv_66 { color: var(--ui-form-danger); }

._controls_1kciv_68 {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

/* 제어 컴포넌트는 호스트에서 주입하고 패키지는 입력 표면만 정의한다. */
._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 :where(input:not([type='checkbox']):not([type='radio']):not([type='hidden']), select, textarea) {
  /*
  // 00000000-0000-0000-0000-000000000000
  // 2026-09-11 14:37 KST
  // 1527a783-296b-4534-9522-25229aa95249
  // 아이콘 선명도와 주문서 작업행 및 공통 입력 정렬 개선
  // ffffffff-ffff-ffff-ffff-ffffffffffff
  */
  box-sizing: border-box;
  flex: 1 1 0%;
  min-width: 0;
  width: 100%;
  height: var(--ui-form-control-height);
  margin: 0;
  padding: 0 var(--ui-form-control-padding-x);
  border: 1px solid var(--ui-form-border);
  border-radius: var(--ui-form-control-radius);
  background: var(--ui-form-control-bg);
  color: var(--ui-form-text);
  font: inherit;
  line-height: normal;
  box-shadow: none;
}

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 textarea {
  min-height: calc(var(--ui-form-control-height) * 2);
  padding: 8px var(--ui-form-control-padding-x);
  line-height: 1.5;
  resize: vertical;
}

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 [data-option-button-group='true'] {
  box-sizing: border-box;
  border-left: 1px solid transparent;
  padding-left: var(--ui-form-control-padding-x);
}

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 :is(input, select, textarea):hover:not(:disabled):not([readonly]) {
  border-color: var(--ui-form-border-hover);
}

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 :is(input, select, textarea):focus {
  outline: none;
  border-color: var(--ui-form-focus);
  box-shadow: 0 0 0 2px var(--ui-form-focus-ring);
}

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 :is(input, select, textarea):is(:disabled, [readonly]) {
  background: var(--ui-form-inactive-bg);
  color: var(--ui-form-muted);
}

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 :is(input, select, textarea):disabled { cursor: not-allowed; }

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 :is(input, textarea)::placeholder { color: var(--ui-form-muted); }

._form_1kciv_16 ._field_1kciv_29 ._controls_1kciv_68 :is(input, select, textarea)[aria-invalid='true'] {
  border-color: var(--ui-form-danger);
}

._controls_1kciv_68 > button {
  flex-shrink: 0;
  min-height: var(--ui-form-control-height);
  border-radius: var(--ui-form-control-radius);
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 18:54 KST
// 2fdfa646-dec6-4c71-b3c7-bfa1ba2c6e1a
// 공통 컴포넌트 곡률을 입력 4px 기준의 역할별 토큰으로 연결
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-10 15:10 KST
// e0bbfc34-e21f-4fc5-a2f2-ee8a2501a98d
// 로딩 표시를 간소화하고 공통 화면 등장 효과와 전환 대기 제거
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 10:54 KST
// e28f9de0-9d2c-40d3-aeff-e5b96c01c77e
// 팝업 경로 표시와 닫기 버튼 및 본문·푸터 공통 디자인 통일
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 10:23 KST
// 2abf3334-fff5-4d34-afa6-ac8a387fcf90
// 화살표 투명 배경과 헤더 구분선 복원 및 행 정렬·사이드 팝업 슬라이드 수정
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 15:54 KST
// dbb187a7-6811-4811-ae73-beef21e8554e
// 이전 회원등록 화면과 공통 UI 디자인을 현 프로젝트에 이식
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
/*
00000000-0000-0000-0000-000000000000
2026-08-22 09:12 KST
1f7ec082-0c95-4c46-a014-b100eef95f0a
사이드팝업 엣지버튼의 화면 바깥 돌출 오프셋을 제거해 바로가기 바와 동일한 돌출 정도로 정렬
ffffffff-ffff-ffff-ffff-ffffffffffff
*/

._sidePopupOpenEdgeBtn_v8991_54 {
/*
00000000-0000-0000-0000-000000000000
2026-08-22 10:34 KST
46b0ab15-272b-4ca0-aa04-d2fc69d0783d
엣지버튼 side peek 상태(rest) + 드래그 오프셋 합산 transform 적용
ffffffff-ffff-ffff-ffff-ffffffffffff
*/
  --side-popup-edge-rest-offset-x: 0px;
  --side-popup-edge-drag-offset-x: 0px;
  position: fixed;
  top: 40%;
  left: 0;
  transform: translate(calc(var(--side-popup-edge-rest-offset-x) + var(--side-popup-edge-drag-offset-x)), -50%);

/*
00000000-0000-0000-0000-000000000000
2026-08-21 14:45 KST
74b14f58-4606-4218-8492-0c1315e68041
사이드팝업 엣지버튼 폭을 바로가기바와 동일한 52px로 고정
ffffffff-ffff-ffff-ffff-ffffffffffff
*/
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 52px;
  min-width: 52px;
  max-width: 52px;
  gap: 8px;
  padding: 10px 16px;
  background-color: var(--ui-popup-primary, #0066ff);
  color: var(--ui-popup-on-primary);
  border: none;
  border-radius: var(--ui-radius-none, 0) var(--ui-radius-surface, 8px) var(--ui-radius-surface, 8px) var(--ui-radius-none, 0);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
  cursor: grab;
  font-family: var(--default-font-family-bold), 'Arial', sans-serif;
  font-size: 1.5rem;
  font-weight: var(--app-font-weight-bold);
  white-space: nowrap;
  z-index: 40;
  transition: background-color 0.2s, transform 0.2s;
  touch-action: none;
  user-select: none;
}

._openButtonRight_v8991_101 {
  left: auto;
  right: 0;
  transform: translate(calc(var(--side-popup-edge-rest-offset-x) + var(--side-popup-edge-drag-offset-x)), -50%);
  border-radius: var(--ui-radius-surface, 8px) var(--ui-radius-none, 0) var(--ui-radius-none, 0) var(--ui-radius-surface, 8px);
  justify-content: flex-start;
  padding-left: 10px;
  padding-right: 18px;
}

._sidePopupOpenEdgeBtn_v8991_54:hover {
  background-color: var(--ui-popup-primary-hover, #005eeb);
}

._edgeDragging_v8991_115 {
/*
00000000-0000-0000-0000-000000000000
2026-08-22 15:16 KST
2a9d5a31-4b36-4e2f-8c31-8d9a0f1b44c2
드래그 중 엣지버튼을 팝업 본체보다 위에 유지해 손잡이처럼 보이게 함
ffffffff-ffff-ffff-ffff-ffffffffffff
*/
  cursor: grabbing;
  transition: none;
  background-color: #60a5fa;
  box-shadow: 0 10px 26px rgba(37, 99, 235, 0.42);
  opacity: 0.96;
  z-index: 8002;
}

body.side-popup-edge-dragging {
  cursor: grabbing !important;
  user-select: none !important;
}

._hiddenOpenButton_v8991_136 {
  display: none;
}

._arrow_v8991_140 {
  display: inline-block;
}

div._popupOverlay_v8991_144 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgb(20 22 28 / 34%);
  z-index: 8000;
}

/*
00000000-0000-0000-0000-000000000000
2026-09-10 17:22 KST
2f6db7bf-5f4d-473d-a0d9-7994dcce63f0
push 사이드패널은 배경을 가리지 않고 패널 외부 조작을 허용
ffffffff-ffff-ffff-ffff-ffffffffffff
*/
div._popupOverlayPush_v8991_161 {
  background-color: transparent;
  pointer-events: none;
}

._popupOverlayPush_v8991_161 ._popupContent_v8991_166 {
  pointer-events: auto;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-23 11:10 KST
   7c3e91a2-5b8d-4f01-9e6a-2d4b8c0f1a57
   닫힌 사이드팝업: 오버레이뿐 아니라 콘텐츠/리사이즈핸들도 포인터 차단
   ffffffff-ffff-ffff-ffff-ffffffffffff */
div._popupOverlayHidden_v8991_175 {
  pointer-events: none;
  background-color: transparent;
}

._popupOverlayHidden_v8991_175 ._popupContent_v8991_166,
._popupOverlayHidden_v8991_175 ._popupContent_v8991_166 * {
  pointer-events: none !important;
}

._popupOverlay_v8991_144 ._popupContent_v8991_166 {
  position: absolute;
  top: 0;
  width: auto;
  height: 100%;
  background: var(--ui-popup-bg);
  padding: 0;
  border-radius: var(--ui-radius-none, 0);
  opacity: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  z-index: 8001;
  box-shadow: 4px 0 28px rgb(0 0 0 / 18%);
}

._popupContentLeft_v8991_201 {
  left: 0;
  transform: translateX(-100%);
}

._popupContentRight_v8991_206 {
  right: 0;
  transform: translateX(100%);
}

._popupHeader_v8991_211 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  padding: 0 16px;
  border-bottom: 1px solid var(--ui-popup-border, #dfe0e3);
  background-color: var(--ui-popup-bg, #ffffff);
  cursor: move;
  flex: 0 0 auto;
  user-select: none;
  height: 50px;
  touch-action: none;
}

._popupTitle_v8991_226 {
  min-width: 0;
  color: var(--ui-popup-text, #172b4d);
  font-size: 14px;
  font-weight: var(--app-font-weight-bold);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._popupBody_v8991_236 {
  flex: 1;
  overflow: auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

._popupBody_v8991_236 > * {
  width: 100%;
  height: 100%;
}

._popupBody_v8991_236 > ._popupBodyBreadcrumb_v8991_249 {
  height: auto;
  flex: 0 0 auto;
  padding: var(--ui-popup-padding-y) var(--ui-popup-padding-x) 0;
  box-sizing: border-box;
}

._popupContent_v8991_166._visible_v8991_256 {
  transform: translateX(0);
  opacity: 1;
}

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-11 09:41 KST
// 52be0257-0ebf-4d26-8f15-3f0160747f3f
// 회원검색 팝업과 본문을 같은 속도로 이동하고 본문 너비 유지
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/
._popupOverlayPush_v8991_161 ._popupContent_v8991_166 {
  opacity: 1;
  visibility: hidden;
  transition: transform 240ms ease, visibility 240ms;
}



._popupOverlayPush_v8991_161 ._popupContent_v8991_166._visible_v8991_256 {
  visibility: visible;
}



@starting-style {
  ._popupOverlayPush_v8991_161 ._popupContentLeft_v8991_201._visible_v8991_256 {
    transform: translateX(-100%);
  }

  ._popupOverlayPush_v8991_161 ._popupContentRight_v8991_206._visible_v8991_256 {
    transform: translateX(100%);
  }
}



@media (prefers-reduced-motion: reduce) {
  ._popupOverlayPush_v8991_161 ._popupContent_v8991_166 {
    transition: none;
  }
}



._popupContent_v8991_166._dragging_v8991_302 {
  transition: none;
}

._resizeHandleLeft_v8991_306 {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 10px;
  cursor: ew-resize;
  z-index: 30;
  pointer-events: auto;
  touch-action: none;
  /* background: linear-gradient(to right, rgba(148, 163, 184, 0.75), rgba(148, 163, 184, 0)); */
}

._resizeHandleRight_v8991_319 {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 10px;
  cursor: ew-resize;
  z-index: 30;
  pointer-events: auto;
  touch-action: none;
}
/* 00000000-0000-0000-0000-000000000000
   2026-08-12 22:20 KST
   e2f8a1c4-6b9d-4e3f-a7c2-1d5e8b0f4a63
   사용자 폼/암호변경 — 콘텐츠폭 + 가로 중앙(d431aaf8 GeneralPopupWindow 패턴)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._layout_1ekzh_6 {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: fit-content;
  max-width: 100%;
  height: 100%;
  min-height: 0;
  gap: 10px;
  padding: 10px 14px;
  overflow-y: auto;
  margin: 0 auto;
}

._guideText_1ekzh_20 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.4;
  color: #4b5563;
}

._popupBody_1ekzh_27 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  min-height: 0;
}

._popupBodyFieldArea_1ekzh_35 {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 30px;
}

._inputDefault_1ekzh_42 {
  width: 30ch;
}

._inputWide_1ekzh_46 {
  width: 46ch;
}

._inputSelect_1ekzh_50 {
  width: 16ch;
}

._comboBoxLabel_1ekzh_54 {
  width: 14ch;
  min-width: 14ch;
  flex-shrink: 0;
  margin: 0 10px 0 0;
  padding-left: 5px;
  box-sizing: border-box;
}

._imageField_1ekzh_63 {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

._imageLabel_1ekzh_69 {
  font-size: 1rem;
  line-height: 1.2;
  text-align: left;
}

._imageUploadRow_1ekzh_75 {
  display: flex;
  align-items: end;
  gap: 6px;
}

._imageBox_1ekzh_81 {
  position: relative;
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  margin-right: 15px;
}

._previewImage_1ekzh_89 {
  width: 100%;
  height: 100%;
  background-color: #dddddd;
  object-fit: cover;
  display: block;
}

._adminKeyBadge_1ekzh_97 {
  position: absolute;
  right: -16px;
  bottom: 0;
  width: 42px;
  height: 42px;
  pointer-events: none;
  object-fit: contain;
}

._imagePlaceholder_1ekzh_107 {
  font-size: 0.85rem;
  color: #666666;
}

._imageFileNameInput_1ekzh_112 {
  width: 28ch;
}

._saveConfirmButtonGroup_1ekzh_116 {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  gap: 10px;
  margin-top: auto;
  padding-top: 10px;
}

._saveConfirmConfirmButton_1ekzh_125,
._saveConfirmCancelButton_1ekzh_126 {
  min-width: 96px;
  min-height: 34px;
  justify-content: center;
  box-sizing: border-box;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-11 07:50 KST
   a8b9c0d1-2e3f-4a5b-6c7d-8e9f0a1b2c3d
   popup confirm/close button min-width
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._saveConfirmButtonGroup_1ekzh_116 .action-button {
  min-width: 96px;
  min-height: 34px;
  justify-content: center;
  box-sizing: border-box;
}
/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-border-style: solid;
      --tw-font-weight: initial;
    }
  }
}

._popupCustomerListPanel_1hfb2_11 {
  height: 100%;
  min-height: calc(var(--spacing, .25rem) * 0);
  width: 100%;
  min-width: calc(var(--spacing, .25rem) * 0);
  background-color: var(--color-erp-surface, var(--erp-color-surface));
  flex-direction: column;
  display: flex;
}

._popupCustomerListToolbar_1hfb2_21 {
  border-bottom-style: var(--tw-border-style);
  border-bottom-width: 1px;
  border-color: var(--color-erp-line, var(--erp-color-line));
  flex-shrink: 0;
  padding-block: 12px;
  padding-inline: 16px;
}

._popupCustomerInlineSearch_1hfb2_30 {
  width: 100%;
  min-width: calc(var(--spacing, .25rem) * 0);
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  display: grid;
}

._popupCustomerSearchCondition_1hfb2_39 {
  grid-column: 1 / -1;
  gap: 12px;
  flex-direction: row !important;
  align-items: center !important;
}

._popupCustomerSearchConditionLabel_1hfb2_46 {
  --tw-font-weight: var(--font-weight-semibold, 600);
  width: auto;
  font-size: 12px;
  font-weight: var(--font-weight-semibold, 600);
  color: var(--color-erp-muted, var(--erp-color-muted));
}

._popupCustomerSearchConditionInput_1hfb2_54 {
  border-style: var(--tw-border-style);
  border-width: 1px;
  border-color: var(--color-erp-line, var(--erp-color-line));
  background-color: var(--color-erp-canvas, var(--erp-color-canvas));
  border-radius: 7px;
  min-width: 180px;
  height: 34px;
  padding-inline: 10px;
}

._popupCustomerInlineSearchField_1hfb2_65 {
  height: 34px;
  min-width: calc(var(--spacing, .25rem) * 0);
  border-style: var(--tw-border-style);
  border-width: 1px;
  border-color: var(--color-erp-line, var(--erp-color-line));
  background-color: var(--ui-input-bg);
  border-radius: 7px;
  display: flex;
  overflow: hidden;
}

._popupCustomerInlineSearchField_1hfb2_65:focus-within {
  border-color: var(--color-erp-primary, var(--erp-color-primary));
  background-color: var(--ui-input-focus-bg);
  box-shadow: 0 0 0 3px var(--erp-color-search-focus-ring);
}

._popupCustomerInlineSearchField_1hfb2_65 input {
  background: none;
  min-width: 0;
  height: 100%;
  box-shadow: none !important;
  border: 0 !important;
}

._popupCustomerInlineSearchField_1hfb2_65:has(input:disabled) {
  background-color: var(--ui-input-disabled-bg);
}

._popupCustomerInlineSearchField_1hfb2_65 button {
  min-width: 28px;
  height: 100%;
  font-size: 12px;
}

._popupCustomerInlineSearchButton_1hfb2_101 {
  cursor: pointer;
  border-style: var(--tw-border-style);
  background-color: var(--color-erp-primary, var(--erp-color-primary));
  --tw-font-weight: var(--font-weight-semibold, 600);
  height: 34px;
  font-size: 14px;
  font-weight: var(--font-weight-semibold, 600);
  color: var(--color-erp-on-primary, var(--erp-color-on-primary));
  border-width: 0;
  border-radius: 7px;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding-inline: 14px;
  display: inline-flex;
}

._popupCustomerInlineSearchButton_1hfb2_101:hover {
  background-color: var(--color-erp-primary-hover, var(--erp-color-primary-hover));
}

._popupCustomerInlineSearchButton_1hfb2_101:disabled {
  cursor: wait;
  opacity: .5;
}

._popupCustomerInlineSearchButton_1hfb2_101:focus-visible {
  outline: 2px solid var(--color-erp-primary);
  outline-offset: 2px;
}

._resultMeta_1hfb2_133 {
  border-bottom-style: var(--tw-border-style);
  border-bottom-width: 1px;
  border-color: var(--color-erp-line, var(--erp-color-line));
  color: var(--color-erp-muted, var(--erp-color-muted));
  flex-wrap: wrap;
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  padding-block: 10px;
  padding-inline: 16px;
  font-size: 12px;
  display: flex;
}

._resultMeta_1hfb2_133 > :first-child {
  --tw-font-weight: var(--font-weight-semibold, 600);
  font-weight: var(--font-weight-semibold, 600);
  color: var(--color-erp-navy, var(--erp-color-navy));
}

._popupCustomerListGridWrap_1hfb2_155 {
  isolation: isolate;
  min-height: calc(var(--spacing, .25rem) * 0);
  width: 100%;
  min-width: calc(var(--spacing, .25rem) * 0);
  flex-direction: column;
  flex: 1;
  display: flex;
  position: relative;
}

._popupCustomerListGridWrap_1hfb2_155 > :first-child {
  min-height: calc(var(--spacing, .25rem) * 0);
  flex: 1;
}

._popupCustomerListGridWrap_1hfb2_155 .ag-root-wrapper {
  border: 0 !important;
  border-radius: 0 !important;
}

._emptyState_1hfb2_176 {
  pointer-events: none;
  inset-inline: calc(var(--spacing, .25rem) * 0);
  top: 38px;
  bottom: calc(var(--spacing, .25rem) * 0);
  z-index: 10;
  text-align: center;
  color: var(--color-erp-muted, var(--erp-color-muted));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding-inline: 20px;
  font-size: 13px;
  display: flex;
  position: absolute;
}

._emptyState_1hfb2_176 svg {
  color: var(--color-erp-primary, var(--erp-color-primary));
}

@supports (color: color-mix(in lab, red, red)) {
  ._emptyState_1hfb2_176 svg {
    color: color-mix(in oklab, var(--color-erp-primary, var(--erp-color-primary)) 40%, transparent);
  }
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}
/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-07 17:50 KST
// 7113633c-1a26-466b-b093-12b3bdbba7d8
// 실제 브라우저 검증 후 회원 하위 탭과 바로가기 디자인 보완
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

/*
// 00000000-0000-0000-0000-000000000000
// 2026-09-08 12:20 KST
// 53e0f2c9-9305-44f0-a2e0-7a2fcb5a8a99
// 테마 토큰과 공통 화면 구조 및 shadcn 입력 요소 통합
// ffffffff-ffff-ffff-ffff-ffffffffffff
*/

._root_1lpb0_17 {
  position: relative;
  width: 100%;
}

._triggerWrap_1lpb0_22 {
  position: relative;
}

._triggerInput_1lpb0_26 {
  display: block;
  width: 100%;
  height: 34px;
  margin: 0;
  padding: 0 30px 0 10px;
  border: 1px solid var(--color-erp-line);
  border-radius: 7px;
  background: var(--color-erp-surface);
  box-sizing: border-box;
  font: inherit;
  font-size: 1rem;
  line-height: 1.75rem;
  color: var(--color-erp-ink);
}

._triggerInput_1lpb0_26::placeholder {
  color: var(--color-erp-placeholder);
}

._triggerInput_1lpb0_26:focus {
  outline: none;
  border-color: var(--color-erp-primary);
  box-shadow: 0 0 0 3px var(--color-erp-focus-ring);
}

._arrow_1lpb0_52 {
  position: absolute;
  top: 50%;
  right: 1ch;
  width: 1ch;
  height: 1ch;
  transform: translateY(-65%) rotate(45deg);
  border-right: 1px solid #5f6368;
  border-bottom: 1px solid #5f6368;
  pointer-events: none;
}

._dropdown_1lpb0_64 {
  position: fixed;
  z-index: 9100;
  box-sizing: border-box;
  overflow: hidden;
  padding: 4px;
  border: 1px solid var(--color-erp-line);
  border-radius: 8px;
  background: var(--color-erp-surface);
  color: var(--color-erp-ink);
  box-shadow: 0 4px 12px rgb(0 0 0 / 12%);
  display: flex;
  flex-direction: column;
}

._listArea_1lpb0_79 {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

._emptyText_1lpb0_86 {
  padding: 12px 8px;
  color: var(--color-erp-muted);
  font-size: 13px;
}

._row_1lpb0_92 {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0;
  min-height: 34px;
  padding: 6px 10px;
  border-radius: 5px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 1rem;
  text-align: left;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

._rowSelectable_1lpb0_112 {
  cursor: pointer;
}

._rowHeader_1lpb0_116 {
  cursor: default;
  color: var(--color-erp-muted);
  font-weight: var(--app-font-weight-bold);
}

._rowSelectable_1lpb0_112:hover,
._rowActive_1lpb0_123 {
  background: var(--color-erp-tint);
}

._rowSelected_1lpb0_127 {
  font-weight: var(--app-font-weight-bold);
  color: var(--color-erp-primary);
  background: var(--color-erp-tint);
}

._rowDepth0_1lpb0_133 {
  font-weight: var(--app-font-weight-bold);
}

._rowLabel_1lpb0_137 {
  overflow: hidden;
  text-overflow: ellipsis;
}
/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-border-style: solid;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-leading: initial;
      --tw-outline-style: solid;
    }
  }
}

._dock_og0ak_14 {
  top: calc(var(--spacing, .25rem) * 0);
  left: calc(var(--spacing, .25rem) * 0);
  z-index: 90;
  border-right-style: var(--tw-border-style);
  border-right-width: 1px;
  border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  flex-direction: column;
  width: 55px;
  display: flex;
  position: fixed;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  ._dock_og0ak_14 {
    border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 6%, transparent);
  }
}

._dock_og0ak_14 {
  background-color: var(--color-erp-shell, var(--erp-color-shell));
  bottom: var(--main-bottom-bar-height);
  font-family: var(--default-font-family), sans-serif;
}

._expanded_og0ak_40 {
  width: 210px;
  box-shadow: 6px 0 24px #00000059;
}

._railToggle_og0ak_45 {
  border-style: var(--tw-border-style);
  border-width: 0;
  border-bottom-style: var(--tw-border-style);
  border-bottom-width: 1px;
  border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  flex-shrink: 0;
  align-items: center;
  gap: 10px;
  display: flex;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  ._railToggle_og0ak_45 {
    border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 7.0%, transparent);
  }
}

._railToggle_og0ak_45 {
  text-align: left;
  --tw-font-weight: var(--font-weight-semibold, 600);
  font-size: 14px;
  font-weight: var(--font-weight-semibold, 600);
  white-space: nowrap;
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  background-color: #0000;
  padding-inline: 15px;
}

@supports (color: color-mix(in lab, red, red)) {
  ._railToggle_og0ak_45 {
    color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 65%, transparent);
  }
}

@media (hover: hover) {
  ._railToggle_og0ak_45:hover {
    color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  }
}

._railToggle_og0ak_45 {
  height: var(--main-header-height);
}

._railToggle_og0ak_45 svg, ._searchButton_og0ak_91 svg, ._addButton_og0ak_91 svg {
  flex-shrink: 0;
}

._searchArea_og0ak_95 {
  flex-shrink: 0;
  padding-block: 8px;
  padding-inline: 6px;
}

._searchButton_og0ak_91 {
  border-style: var(--tw-border-style);
  text-align: left;
  --tw-font-weight: var(--font-weight-semibold, 600);
  width: 100%;
  height: 40px;
  font-size: 14px;
  font-weight: var(--font-weight-semibold, 600);
  white-space: nowrap;
  border-width: 0;
  border-radius: 8px;
  align-items: center;
  gap: 13px;
  padding-inline: 11px;
  display: flex;
  overflow: hidden;
}

._searchButton_og0ak_91:disabled {
  cursor: wait;
  opacity: .6;
}

._searchButton_og0ak_91 {
  background: var(--erp-shortcut-search-bg, #f4c430);
  color: var(--erp-shortcut-search-text, #1a1d22);
}

._searchButton_og0ak_91:hover:not(:disabled) {
  background: var(--erp-shortcut-search-hover-bg, #f6ce4c);
}

._list_og0ak_133 {
  min-height: calc(var(--spacing, .25rem) * 0);
  border-top-style: var(--tw-border-style);
  border-top-width: 1px;
  border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  flex-direction: column;
  gap: 4px;
  margin-top: 4px;
  display: flex;
  overflow: hidden auto;
}

@supports (color: color-mix(in lab, red, red)) {
  ._list_og0ak_133 {
    border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 7.0%, transparent);
  }
}

._list_og0ak_133 {
  scrollbar-width: thin;
  scrollbar-color: var(--color-erp-shell-hover) transparent;
  padding-inline: 6px;
  padding-top: 6px;
  padding-bottom: 4px;
}

._shortcutButton_og0ak_159 {
  border-style: var(--tw-border-style);
  padding-inline: 4px;
  background-color: #0000;
  border-width: 0;
  border-radius: 8px;
  flex-direction: column;
  flex-shrink: 0;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding-top: 8px;
  padding-bottom: 7px;
  display: flex;
  position: relative;
}

@media (hover: hover) {
  ._shortcutButton_og0ak_159:hover {
    background-color: var(--color-erp-shell-hover, var(--erp-color-shell-hover));
  }
}

._shortcutIcon_og0ak_182 {
  transition: background-color var(--ui-motion-fast, .16s) ease-out;
  background-color: var(--color-erp-shell-hover, var(--erp-color-shell-hover));
  --tw-font-weight: var(--font-weight-bold, 700);
  width: 34px;
  height: 34px;
  font-size: 12px;
  font-weight: var(--font-weight-bold, 700);
  --tw-tracking: -.2px;
  letter-spacing: -.2px;
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  border-radius: 3.40282e38px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

._shortcutLabel_og0ak_200 {
  transition: color var(--ui-motion-fast, .16s) ease-out;
  width: 100%;
  max-width: 100%;
  min-width: calc(var(--spacing, .25rem) * 0);
  text-align: center;
  --tw-leading: 1.2;
  --tw-font-weight: var(--font-weight-semibold, 600);
  font-size: 12px;
  line-height: 1.2;
  font-weight: var(--font-weight-semibold, 600);
  white-space: nowrap;
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  display: block;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  ._shortcutLabel_og0ak_200 {
    color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 70%, transparent);
  }
}

._shortcutLabel_og0ak_200 {
  overflow-wrap: normal;
}

._expanded_og0ak_40 ._shortcutLabel_og0ak_200 {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

._shortcutButton_og0ak_159[aria-current="page"] {
  background-color: var(--color-erp-primary, var(--erp-color-primary));
}

@supports (color: color-mix(in lab, red, red)) {
  ._shortcutButton_og0ak_159[aria-current="page"] {
    background-color: color-mix(in oklab, var(--color-erp-primary, var(--erp-color-primary)) 20%, transparent);
  }
}

._shortcutButton_og0ak_159[aria-current="page"] ._shortcutIcon_og0ak_182 {
  background-color: var(--color-erp-primary, var(--erp-color-primary));
}

._shortcutButton_og0ak_159[aria-current="page"] ._shortcutLabel_og0ak_200 {
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
}

._dock_og0ak_14 button:not(._searchButton_og0ak_91):hover {
  background-color: var(--color-erp-shell);
}

@supports (color: color-mix(in lab, red, red)) {
  ._dock_og0ak_14 button:not(._searchButton_og0ak_91):hover {
    background-color: color-mix(in srgb, var(--color-erp-shell) 75%, var(--color-erp-shell-text));
  }
}

._dock_og0ak_14 button:not(._searchButton_og0ak_91):hover {
  color: var(--color-erp-shell-text);
}

._dock_og0ak_14 ._shortcutButton_og0ak_159[aria-current="page"]:hover {
  background-color: var(--color-erp-primary);
}

@supports (color: color-mix(in lab, red, red)) {
  ._dock_og0ak_14 ._shortcutButton_og0ak_159[aria-current="page"]:hover {
    background-color: color-mix(in srgb, var(--color-erp-primary) 40%, var(--color-erp-shell));
  }
}

._shortcutButton_og0ak_159:hover ._shortcutIcon_og0ak_182 {
  box-shadow: inset 0 0 0 1px var(--color-erp-shell-text);
}

@supports (color: color-mix(in lab, red, red)) {
  ._shortcutButton_og0ak_159:hover ._shortcutIcon_og0ak_182 {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-erp-shell-text) 45%, transparent);
  }
}

._shortcutButton_og0ak_159:hover ._shortcutLabel_og0ak_200 {
  color: var(--color-erp-shell-text);
}

._addButton_og0ak_91 {
  border-style: var(--tw-border-style);
  --tw-border-style: dashed;
  border-style: dashed;
  border-width: 1px;
  border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 34px;
  margin-top: 4px;
  display: flex;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  ._addButton_og0ak_91 {
    border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 25%, transparent);
  }
}

._addButton_og0ak_91 {
  padding: calc(var(--spacing, .25rem) * 0);
  --tw-font-weight: var(--font-weight-semibold, 600);
  font-size: 14px;
  font-weight: var(--font-weight-semibold, 600);
  white-space: nowrap;
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  background-color: #0000;
}

@supports (color: color-mix(in lab, red, red)) {
  ._addButton_og0ak_91 {
    color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 60%, transparent);
  }
}

@media (hover: hover) {
  ._addButton_og0ak_91:hover {
    border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  }

  @supports (color: color-mix(in lab, red, red)) {
    ._addButton_og0ak_91:hover {
      border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 40%, transparent);
    }
  }

  ._addButton_og0ak_91:hover {
    background-color: var(--color-erp-shell-hover, var(--erp-color-shell-hover));
    color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  }
}

._expanded_og0ak_40 ._addButton_og0ak_91 {
  justify-content: flex-start;
  padding-inline: 12px;
}

._dock_og0ak_14 button:focus-visible {
  outline-style: var(--tw-outline-style);
  outline-offset: -2px;
  outline-width: 2px;
  outline-color: var(--color-erp-focus-ring, var(--erp-color-focus-ring));
}

._dock_og0ak_14 button:not(:disabled) {
  cursor: pointer;
}

#root:has([data-empty-desktop-shortcut-dock]) > header {
  width: calc(100% - 55px);
  margin-left: 55px;
}

#root:has([data-empty-desktop-shortcut-dock]) > main {
  --main-content-rail-width: 55px;
}

#root:has([data-empty-desktop-shortcut-dock]) > footer {
  width: calc(100% - 55px);
  left: 55px;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-tracking {
  syntax: "*";
  inherits: false
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
/* 00000000-0000-0000-0000-000000000000
   2026-07-24 13:51 KST
   c1e8a4f0-2b7d-4c9e-9a3f-6d5e1b8c0a72
   빈 바탕화면 Chrome형 바로가기 타일 스타일
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-07-26 10:12 KST
   7e2c9a1b-4d5f-4a80-9c3e-1b6d8f0a2e45
   바로가기 개수 무제한 — 가로폭 제한 완화(줄바꿈)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-07-24 14:49 KST
   8b1d4e6a-3c7f-4a90-9e2d-5f0c1a8b7d36
   바탕화면 컨텐츠(브랜드+바로가기) 시각적 수직 중앙: 약간 위로 보정
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._panel_cu47d_16 {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 36px;
  box-sizing: border-box;
  /* 하단 여백을 더 줘 묶음 중심을 화면 중앙에 가깝게 */
  padding-bottom: 26vh;
  pointer-events: none;
  user-select: none;
}

._brand_cu47d_32 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: #8a9099;
  font-family: 'Malgun Gothic', '맑은 고딕', sans-serif;
}

._brandTitle_cu47d_41 {
  margin: 0;
  font-size: 2.4rem;
  font-weight: var(--app-font-weight-bold);
  letter-spacing: 0.04em;
  opacity: 0.45;
  line-height: 1.1;
}

._brandVersion_cu47d_50 {
  margin: 0;
  font-size: 0.95rem;
  opacity: 0.4;
  line-height: 1.2;
}

._shortcuts_cu47d_57 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 12px;
  max-width: calc((112px * 6) + (12px * 5));
  margin: 0;
  padding: 8px;
  pointer-events: auto;
  font-family: 'Malgun Gothic', '맑은 고딕', sans-serif;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-24 14:28 KST
   1a8f3c6e-2d4b-4e9a-b0c1-5f7d8e9a0b12
   드래그 표기: 원위치 빈 슬롯 + 커서 추적 플로팅 미리보기
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._shortcutTile_cu47d_74 {
  position: relative;
  width: 112px;
  touch-action: none;
  user-select: none;
  cursor: grab;
  transition: background-color 120ms ease, box-shadow 120ms ease;
}

._shortcutsDragging_cu47d_83 {
  cursor: grabbing;
}

._shortcutTileDragging_cu47d_87 {
  cursor: grabbing;
}

._shortcutTileDragging_cu47d_87 ._shortcutButton_cu47d_91 {
  visibility: hidden;
  pointer-events: none;
}

._shortcutTileDragging_cu47d_87 ._menuRoot_cu47d_96 {
  display: none;
}

._shortcutTileDragging_cu47d_87::after {
  content: '';
  position: absolute;
  inset: 8px 12px;
  border: 2px dashed #9aa0a6;
  border-radius: 14px;
  background: rgba(232, 234, 237, 0.65);
  pointer-events: none;
}

._shortcutTileDragOver_cu47d_110 ._shortcutButton_cu47d_91 {
  background: rgba(60, 64, 67, 0.06);
}

._shortcutTileDragOver_cu47d_110::before {
  content: '';
  position: absolute;
  inset: 4px;
  border-radius: 14px;
  border: 2px solid #5f6368;
  background: repeating-linear-gradient(
    -45deg,
    rgba(95, 99, 104, 0.08),
    rgba(95, 99, 104, 0.08) 6px,
    rgba(95, 99, 104, 0.02) 6px,
    rgba(95, 99, 104, 0.02) 12px
  );
  pointer-events: none;
  z-index: 0;
}

._shortcutTileDragOver_cu47d_110 ._shortcutButton_cu47d_91,
._shortcutTileDragOver_cu47d_110 ._menuRoot_cu47d_96 {
  position: relative;
  z-index: 1;
}

._dragPreview_cu47d_137 {
  position: fixed;
  z-index: 9000;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 112px;
  padding: 12px 8px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 28px rgba(32, 33, 36, 0.28);
  transform: translate(-50%, -60%) rotate(-3deg);
  pointer-events: none;
}

._shortcutButton_cu47d_91,
._addTile_cu47d_154 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 112px;
  margin: 0;
  padding: 12px 8px 10px;
  border: none;
  border-radius: 12px;
  background: transparent;
  color: #3c4043;
  font: inherit;
  cursor: pointer;
}

._shortcutButton_cu47d_91:hover,
._addTile_cu47d_154:hover,
._shortcutTile_cu47d_74:hover ._shortcutButton_cu47d_91 {
  background: rgba(60, 64, 67, 0.08);
}

._shortcutButton_cu47d_91:focus-visible,
._addTile_cu47d_154:focus-visible,
._menuButton_cu47d_178:focus-visible {
  outline: 2px solid #8ab4f8;
  outline-offset: 2px;
}

._shortcutIcon_cu47d_183,
._addIcon_cu47d_184 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(60, 64, 67, 0.18);
  font-size: 1.35rem;
  font-weight: var(--app-font-weight-bold);
  line-height: 1;
}

._shortcutIcon_cu47d_183 {
  background: #e8f1ff;
  color: #1a56c4;
}

._addIcon_cu47d_184 {
  background: #ffffff;
  color: #5f6368;
}

._shortcutText_cu47d_207 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 0;
  max-width: 96px;
}

._shortcutLabel_cu47d_216 {
  max-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.8125rem;
  line-height: 1.25;
  text-align: center;
  color: #3c4043;
}

._shortcutHotkey_cu47d_227 {
  max-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1rem;
  font-weight: var(--app-font-weight-bold);
  line-height: 1.2;
  text-align: center;
  color: #1a73e8;
}

._menuRoot_cu47d_96 {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 2;
}

._menuButton_cu47d_178 {
  display: none;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: #ffffff;
  color: #5f6368;
  box-shadow: 0 1px 2px rgba(60, 64, 67, 0.28);
  cursor: pointer;
}

._shortcutTile_cu47d_74:hover ._menuButton_cu47d_178,
._shortcutTile_cu47d_74:focus-within ._menuButton_cu47d_178,
._menuRoot_cu47d_96:has(._menuDropdown_cu47d_264) ._menuButton_cu47d_178 {
  display: inline-flex;
}

._menuButton_cu47d_178:hover {
  background: #f1f3f4;
  color: #202124;
}

._menuDropdown_cu47d_264 {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  min-width: max-content;
  width: max-content;
  padding: 4px 0;
  border: 1px solid #dadce0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(60, 64, 67, 0.24);
}

/* 00000000-0000-0000-0000-000000000000
   2026-08-21 14:10 KST
   d8a1c4e7-3b29-4f16-9a05-7c0e2d8b5f31
   바로가기 메뉴 한 줄 유지, 바로가기 바 표시 항목 추가
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._menuItem_cu47d_291 {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 8px 14px;
  border: none;
  background: transparent;
  color: #202124;
  font: inherit;
  font-size: 0.875rem;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
}

._menuItemCheck_cu47d_308 {
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
  color: #1a73e8;
}

._menuItem_cu47d_291:hover {
  background: #f1f3f4;
}

/* 00000000-0000-0000-0000-000000000000
   2026-07-24 13:58 KST
   d4a7b1c2-8e0f-4a59-9c3d-1f6b7e2a0d85
   바로가기 편집 PopupWindow: 스크롤 제거 + 현대적 폼 레이아웃
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-17 09:50 KST
   c8f1a3d6-2b47-4e90-9d15-6a0c4e8b7f32
   바로가기 편집 폼·버튼을 기본글자 rem 비율로 맞춤
   ffffffff-ffff-ffff-ffff-ffffffffffff */
._editorPopupWindow_cu47d_329 {
  border: none;
  border-radius: calc(16rem / 14);
  box-shadow: 0 calc(18rem / 14) calc(48rem / 14) rgba(32, 33, 36, 0.2);
}

._editorPopupBody_cu47d_335 {
  overflow: hidden !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
}

._editorBody_cu47d_341 {
  display: flex;
  flex-direction: column;
  gap: calc(20rem / 14);
  padding: calc(8rem / 14) calc(22rem / 14) calc(6rem / 14);
  box-sizing: border-box;
}

._editorField_cu47d_349 {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: calc(8rem / 14);
}

._editorLabel_cu47d_356 {
  font-size: 0.8125rem;
  font-weight: var(--app-font-weight-bold);
  letter-spacing: 0.01em;
  color: #5f6368;
  text-align: left;
}

._editorInput_cu47d_364 {
  width: 100%;
  height: calc(36rem / 14);
  margin: 0;
  padding: 0 calc(2rem / 14);
  border: 0;
  border-bottom: 1px solid #dadce0;
  border-radius: 0;
  background: transparent;
  box-sizing: border-box;
  font: inherit;
  font-size: 1rem;
  line-height: 1.75rem;
  color: #202124;
}

._editorInput_cu47d_364::placeholder {
  color: #9aa0a6;
}

._editorInput_cu47d_364:focus {
  outline: none;
  border-bottom-color: #1a73e8;
  background: rgba(26, 115, 232, 0.04);
}

._editorCombo_cu47d_390 {
  width: 100%;
}

._editorFooter_cu47d_394 {
  display: flex;
  justify-content: flex-end;
  gap: calc(10rem / 14);
  width: 100%;
  padding: calc(4rem / 14) calc(4rem / 14) calc(2rem / 14);
  box-sizing: border-box;
  margin-top: calc(10rem / 14);
}

._editorCancelButton_cu47d_404,
._editorSaveButton_cu47d_405 {
  min-width: calc(84rem / 14);
  height: calc(36rem / 14);
  padding: 0 calc(18rem / 14);
  border: none;
  border-radius: calc(18rem / 14);
  font: inherit;
  font-size: 0.875rem;
  font-weight: var(--app-font-weight-bold);
  cursor: pointer;
}

._editorCancelButton_cu47d_404 {
  background: #f1f3f4;
  color: #3c4043;
}

._editorSaveButton_cu47d_405 {
  background: #1a73e8;
  color: #ffffff;
  box-shadow: 0 1px 2px rgba(26, 115, 232, 0.28);
}

._editorCancelButton_cu47d_404:hover {
  background: #e8eaed;
}

._editorSaveButton_cu47d_405:hover {
  background: #1765cc;
}



/* 00000000-0000-0000-0000-000000000000
   2026-07-24 17:26 KST
   22f68934-e0a4-480d-bc60-c1706a1ac552
   모바일 바탕화면: 타일 폭 축소 + 컨텐츠 중앙 배치
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-07-24 17:42 KST
   e7b2c9a4-1f58-4d03-9c6e-8a0d4b5f2e17
   모바일 바로가기 아이콘·타일 크기 확대(터치 가독성)
   ffffffff-ffff-ffff-ffff-ffffffffffff */
/* 00000000-0000-0000-0000-000000000000
   2026-08-27 10:50 KST
   c8e4b1a7-2d59-4f06-9c13-8a7e0b5d4f26
   빈 바탕화면 모바일 타일 기준을 앱 공통 1024px로 통일
   ffffffff-ffff-ffff-ffff-ffffffffffff */
@media (max-width: 1024px) {
  html[data-app-layout='responsive'] {
  ._panel_cu47d_16 {
    gap: 20px;
    padding: 12px 10px 10vh;
    justify-content: center;
    align-items: center;
  }

  ._brandTitle_cu47d_41 {
    font-size: 1.7rem;
  }

  ._brandVersion_cu47d_50 {
    font-size: 0.85rem;
  }

  ._shortcuts_cu47d_57 {
    width: min(100%, calc((108px * 3) + (10px * 2) + 16px));
    max-width: min(100%, calc((108px * 3) + (10px * 2) + 16px));
    gap: 6px 10px;
    padding: 4px;
    justify-content: center;
  }

  ._shortcutTile_cu47d_74 {
    width: 108px;
  }

  ._shortcutButton_cu47d_91,
  ._addTile_cu47d_154 {
    width: 108px;
    gap: 10px;
    padding: 10px 6px 8px;
  }

  ._shortcutIcon_cu47d_183,
  ._addIcon_cu47d_184 {
    width: 64px;
    height: 64px;
    font-size: 1.45rem;
  }

  ._addIcon_cu47d_184 svg {
    width: 32px;
    height: 32px;
  }

  ._shortcutLabel_cu47d_216 {
    max-width: 100px;
    font-size: 0.8125rem;
  }

  ._shortcutText_cu47d_207,
  ._shortcutHotkey_cu47d_227 {
    max-width: 100px;
  }

  ._dragPreview_cu47d_137 {
    width: 108px;
    gap: 10px;
    padding: 10px 6px 8px;
  }

  ._shortcutTileDragging_cu47d_87::after {
    inset: 6px 10px;
    border-radius: 14px;
  }

  ._shortcutTileDragOver_cu47d_110::before {
    inset: 2px;
    border-radius: 12px;
  }
  }
}/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
._main-bottom-bar_hh7b0_2 {
  z-index: 50;
  width: 100%;
  height: var(--main-bottom-bar-height);
  box-shadow: none;
  background: #f0f0f0;
  border-top: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: visible;
}

._main-bottom-bar-tab-strip_hh7b0_16 {
  z-index: 2;
  box-sizing: border-box;
  background: snow;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 0;
  width: 100%;
  height: 100%;
  padding-bottom: 2px;
  display: grid;
  position: relative;
}

._main-bottom-bar-tab-strip_hh7b0_16:before {
  content: "";
  pointer-events: none;
  z-index: 1;
  background-color: #8b8b8b;
  height: 1px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

._main-bottom-bar-tab-strip_hh7b0_16:has([data-taskbar-drop-close]) {
  background: #c5221f0a;
}

._main-bottom-bar-tab-strip_hh7b0_16:has([data-taskbar-drop-close]):after {
  content: "";
  pointer-events: none;
  z-index: 10;
  border: 2px dashed #c5221f;
  position: absolute;
  inset: 2px;
}

._main-bottom-bar-leading_hh7b0_55 {
  color: #666;
  min-width: 0;
  height: 32px;
  font-size: .95rem;
  font-weight: var(--app-font-weight-bold);
  font-family: var(--default-font-family-bold), sans-serif;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: auto;
  align-items: center;
  padding: 0 12px;
  display: flex;
  overflow: hidden;
}

._main-bottom-bar-taskbar-wrap_hh7b0_71 {
  grid-column: 2;
  justify-content: center;
  justify-self: center;
  align-items: flex-end;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  display: flex;
}

._main-bottom-bar-tab-strip_hh7b0_16._is-taskbar-left_hh7b0_82 {
  grid-template-columns: 1fr auto;
}

._main-bottom-bar-tab-strip_hh7b0_16._is-taskbar-left_hh7b0_82 ._main-bottom-bar-taskbar-wrap_hh7b0_71 {
  grid-column: 1;
  justify-content: flex-start;
  justify-self: stretch;
  padding-left: 4px;
  overflow: hidden;
}

._main-bottom-bar-tab-strip_hh7b0_16._is-taskbar-left_hh7b0_82 ._main-bottom-bar-meta_hh7b0_94 {
  grid-column: 2;
}

._main-bottom-bar-meta_hh7b0_94 {
  color: #666;
  grid-column: 3;
  justify-content: flex-end;
  place-self: flex-end end;
  align-items: center;
  gap: 12px;
  min-width: 0;
  height: 32px;
  padding-right: 10px;
  display: flex;
  overflow: visible;
}

._main-bottom-bar-connection-summary-wrap_hh7b0_112 {
  cursor: default;
  width: 100px;
  min-width: 0;
  max-width: 320px;
  position: relative;
}

._main-bottom-bar-connection-summary-wrap_hh7b0_112:after {
  content: attr(data-tooltip);
  color: #444;
  width: max-content;
  max-width: min(90vw, 720px);
  font-size: .85rem;
  font-weight: var(--app-font-weight);
  font-family: var(--default-font-family), sans-serif;
  white-space: normal;
  word-break: break-all;
  text-align: left;
  z-index: 60;
  pointer-events: none;
  background: #fff;
  border: 1px solid #8b8b8b;
  border-radius: 2px;
  padding: 6px 10px;
  line-height: 1.35;
  display: none;
  position: absolute;
  bottom: calc(100% + 6px);
  right: 0;
  box-shadow: 0 2px 8px #00000029;
}

._main-bottom-bar-connection-summary-wrap_hh7b0_112:hover:not([data-tooltip=""]):not([data-tooltip=" "]):after {
  font-size: 1.1rem;
  display: block;
}

._main-bottom-bar-connection-summary_hh7b0_112 {
  color: gray;
  max-width: 100px;
  font-size: .9rem;
  font-family: var(--default-font-family), sans-serif;
  text-align: right;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1.2;
  overflow: hidden;
}

._main-bottom-bar-user_hh7b0_162 {
  font-size: .95rem;
  font-weight: var(--app-font-weigh);
  font-family: var(--default-font-family), sans-serif;
  white-space: nowrap;
}

@media (max-width: 1024px) {
  html[data-app-layout="responsive"] ._main-bottom-bar-leading_hh7b0_55 {
    display: none;
  }

  html[data-app-layout="responsive"] ._main-bottom-bar-meta_hh7b0_94 {
    gap: 8px;
    padding: 0 20px 0 8px;
  }

  html[data-app-layout="responsive"] ._main-bottom-bar-connection-summary-wrap_hh7b0_112 {
    display: none;
  }

  html[data-app-layout="responsive"] ._main-bottom-bar-user_hh7b0_162 {
    font-size: .85rem;
  }
}

._main-bottom-bar_hh7b0_2, ._main-bottom-bar-tab-strip_hh7b0_16 {
  background-color: var(--color-white, #fff);
}

._main-bottom-bar-tab-strip_hh7b0_16:before {
  background-color: var(--color-erp-line);
}
/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-outline-style: solid;
    }
  }
}

._main-menu-bar-header_bum01_27 {
  width: 100%;
  padding-top: var(--main-top-bar-padding);
  z-index: 50;
  position: relative;
}

._main-menu-bar-nav_bum01_34 {
  width: 100%;
  height: var(--main-top-bar-height);
  background: #5a6370;
  align-items: center;
  margin-top: 0;
  display: flex;
  overflow: visible;
  box-shadow: 0 2px #a9a9a9;
}

._main-menu-bar-connection-summary_bum01_45 {
  color: red;
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 100%;
  margin: 0;
  padding: 0 14px 2px;
  font-size: .9rem;
  line-height: 1.2;
  position: absolute;
  overflow: hidden;
}

._main-menu-bar-submenu-label_bum01_59 {
  display: block;
}

._primary-font_bum01_63 {
  font-size: 1.2rem;
  font-weight: var(--app-font-weight-bold);
  font-family: var(--default-font-family-bold), sans-serif;
}

._primary-font_bum01_63 a {
  font-size: 1.2rem;
  font-weight: var(--app-font-weight-bold);
  font-family: var(--default-font-family-bold), sans-serif;
  text-decoration: none;
}

._main-menu-bar-nav-shell_bum01_76 {
  align-items: center;
  gap: 14px;
  width: 70%;
  height: 100%;
  min-height: 0;
  margin: 0 auto;
  display: flex;
  overflow: visible;
}

._main-menu-bar-collapsible_bum01_87 {
  flex: auto;
  align-items: center;
  min-width: 0;
  height: 100%;
  display: flex;
}

._main-menu-bar-brand-wrap_bum01_95 {
  flex: none;
  align-items: center;
  gap: 8px;
  height: 100%;
  display: flex;
}

._main-menu-bar-mobile-toggle_bum01_103 {
  color: #fff;
  cursor: pointer;
  background: #ffffff1f;
  border: 1px solid #ffffff73;
  border-radius: 4px;
  height: 30px;
  margin-left: 4px;
  padding: 0 8px;
  font-size: 1rem;
  display: none;
}

._main-menu-bar-mobile-toggle_bum01_103:hover {
  background: #fff3;
}

._main-menu-bar-brand-icon_bum01_120 {
  object-fit: contain;
  width: 28px;
  height: 28px;
}

._main-menu-bar-brand_bum01_95 {
  color: #fff;
  font-size: 1.6rem;
  font-weight: var(--app-font-weight-bold);
  white-space: nowrap;
  font-family: var(--default-font-family-bold), sans-serif;
  align-items: center;
  height: 100%;
  line-height: 1;
  text-decoration: none;
  display: inline-flex;
}

._main-menu-bar-nav-list_bum01_139 {
  flex: auto;
  align-items: center;
  gap: 2px;
  height: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

._main-menu-bar-nav-item_bum01_150 {
  cursor: pointer;
  align-items: center;
  height: 100%;
  display: flex;
}

._main-menu-bar-nav-item_bum01_150 a, ._main-menu-bar-login-link_bum01_157 {
  font-family: var(--default-font-family-bold), sans-serif;
  color: #fff;
  white-space: nowrap;
  cursor: pointer;
  align-items: center;
  height: 100%;
  min-height: 0;
  padding: 0 10px;
  font-size: 1.2rem;
  line-height: 1;
  text-decoration: none;
  display: flex;
}

._main-menu-bar-nav-item_bum01_150 a {
  transition: background-color .14s, color .14s;
  position: relative;
}

._main-menu-bar-login-link_bum01_157 {
  position: relative;
}

._main-menu-bar-nav-item_bum01_150 a:after, ._main-menu-bar-login-link_bum01_157:after {
  content: "";
  transform-origin: center;
  background: #ff0;
  width: 66%;
  height: 2px;
  transition: transform .18s;
  position: absolute;
  bottom: 2px;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
}

._main-menu-bar-nav-item_bum01_150 a:hover:after, ._main-menu-bar-nav-item_bum01_150 a._is-active_bum01_194:after, ._main-menu-bar-login-link_bum01_157:hover:after {
  transform: translateX(-50%) scaleX(1);
}

._main-menu-bar-nav-meta_bum01_198 {
  z-index: 90;
  flex: none;
  align-items: center;
  gap: 8px;
  height: 100%;
  margin-left: auto;
  padding-left: 6px;
  display: flex;
  position: relative;
}

._main-menu-bar-profile-block_bum01_210 {
  z-index: 91;
  flex: none;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 64px;
  height: 64px;
  margin: 0;
  display: flex;
  position: relative;
  overflow: visible;
}

._main-menu-bar-profile-notify-visual_bum01_224 {
  transform-origin: 50% 85%;
  will-change: transform;
  display: block;
}

._main-menu-bar-message-badge_bum01_230 {
  color: #fff;
  min-width: 18px;
  height: 18px;
  font-size: .7rem;
  font-weight: var(--app-font-weight-bold);
  z-index: 92;
  cursor: pointer;
  background: #d71f2a;
  border-radius: 1px;
  justify-content: center;
  align-items: center;
  padding: 0 4px;
  line-height: 1;
  text-decoration: none;
  display: inline-flex;
  position: absolute;
  top: 5px;
  right: 0;
  box-shadow: 0 0 0 2px #5a6370;
}

._main-menu-bar-profile-image_bum01_252 {
  object-fit: cover;
  z-index: 91;
  background-color: #0000;
  width: 64px;
  height: 64px;
  display: block;
  position: relative;
}

._main-menu-bar-profile-placeholder_bum01_262 {
  z-index: 91;
  background-color: #e3e3e3;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  display: flex;
  position: relative;
}

._main-menu-bar-profile-placeholder-image_bum01_273 {
  object-fit: contain;
  width: 90%;
  height: 90%;
  display: block;
}

._main-menu-bar-profile-button_bum01_280 {
  cursor: pointer;
  background: none;
  border: none;
  margin: 0;
  padding: 0;
  display: block;
  overflow: visible;
}

._main-menu-bar-profile-button_bum01_280:disabled {
  cursor: wait;
  opacity: .75;
}

._main-menu-bar-login-link_bum01_157 {
  cursor: pointer;
  background: none;
  border: none;
  padding: 0 4px 0 0;
}

._main-menu-bar-flag-link_bum01_302 {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 22px;
  display: inline-flex;
}

._main-menu-bar-flag-link_bum01_302 img {
  object-fit: cover;
  border-radius: 2px;
  flex-shrink: 0;
  width: 32px;
  min-width: 32px;
  max-width: none;
  height: 22px;
  min-height: 22px;
  max-height: none;
  display: block;
}

._main-menu-bar-main-shell_bum01_324 {
  width: 100%;
  margin: 0;
  padding: 0;
}

._main-menu-cached-page_bum01_330 {
  width: 100%;
  height: 100%;
  min-height: 0;
}

._main-menu-cached-page_bum01_330._is-hidden_bum01_336 {
  visibility: hidden;
  pointer-events: none;
  position: absolute;
  inset: 0;
}

._main-menu-cached-page_bum01_330._is-active_bum01_194 {
  visibility: visible;
  pointer-events: auto;
  height: 100%;
  position: relative;
}

body:has(._main-content_bum01_350) {
  overflow-x: clip;
}

._main-content_bum01_350 {
  left: var(--main-content-push-offset, 0px);
  width: calc(100% - var(--main-content-rail-width, 0px));
  margin-left: var(--main-content-rail-width, 0px);
  height: calc(100vh - var(--main-header-height) - var(--main-bottom-bar-height));
  box-sizing: border-box;
  min-height: 0;
  padding-top: var(--main-content-top-gap);
  padding-bottom: var(--main-content-bottom-gap);
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: hidden;
}

body[data-side-popup-push-side="left"] ._main-content_bum01_350 {
  --main-content-push-offset: max(0px, calc(var(--side-popup-push-width, 0px) - var(--main-content-rail-width, 0px)));
}

body[data-side-popup-push-side="right"] ._main-content_bum01_350 {
  --main-content-push-offset: calc(-1 * var(--side-popup-push-width, 0px));
}

@media (max-width: 1024px) {
  html[data-app-layout="responsive"] ._main-menu-bar-nav_bum01_34 {
    height: auto;
    min-height: var(--main-top-bar-height);
    align-items: flex-start;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-shell_bum01_76 {
    width: calc(100% - 24px);
    height: auto;
    min-height: var(--main-top-bar-height);
    flex-flow: column;
    align-items: stretch;
    gap: 0;
    padding: 0;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-brand-wrap_bum01_95 {
    width: 100%;
    height: var(--main-top-bar-height);
    justify-content: space-between;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-mobile-toggle_bum01_103 {
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-collapsible_bum01_87 {
    flex-direction: column;
    flex: none;
    align-items: stretch;
    width: 100%;
    height: auto;
    min-height: 0;
    display: none;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-collapsible_bum01_87._is-open_bum01_416 {
    display: flex;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-list_bum01_139 {
    flex-flow: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    height: auto;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-item_bum01_150 {
    width: 100%;
    height: auto;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-item_bum01_150 a {
    box-sizing: border-box;
    background: #535c69;
    justify-content: flex-start;
    width: 100%;
    height: auto;
    min-height: 44px;
    padding: 8px 12px;
    font-size: 1.2rem;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-login-link_bum01_157 {
    box-sizing: border-box;
    background: #535c69;
    justify-content: flex-start;
    width: 100%;
    height: auto;
    min-height: 44px;
    padding: 8px 12px;
    font-size: 1.2rem;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-item_bum01_150 a:after {
    transform-origin: 0;
    left: 12px;
    transform: scaleX(0);
  }

  html[data-app-layout="responsive"] ._main-menu-bar-login-link_bum01_157:after {
    transform-origin: 0;
    left: 12px;
    transform: scaleX(0);
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-item_bum01_150 a:hover:after {
    transform: scaleX(1);
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-item_bum01_150 a._is-active_bum01_194:after {
    transform: scaleX(1);
  }

  html[data-app-layout="responsive"] ._main-menu-bar-login-link_bum01_157:hover:after {
    transform: scaleX(1);
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-meta_bum01_198 {
    box-sizing: border-box;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    width: 100%;
    height: auto;
    margin-left: 0;
    padding: 8px 12px;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-profile-block_bum01_210 {
    width: 44px;
    height: 44px;
    margin: 0;
  }

  :is(html[data-app-layout="responsive"] ._main-menu-bar-profile-image_bum01_252, html[data-app-layout="responsive"] ._main-menu-bar-profile-placeholder_bum01_262) {
    width: 44px;
    height: 44px;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-profile-placeholder-image_bum01_273 {
    width: 24px;
    height: 24px;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-item_bum01_150 a._is-active_bum01_194 {
    color: #fff8cf;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-brand_bum01_95 {
    font-size: 1.2rem;
  }
}

._main-menu-bar-nav_bum01_34 {
  background-color: var(--color-erp-shell, var(--erp-color-shell));
  --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  color: var(--color-erp-shell-text);
}

._primary-font_bum01_63, ._primary-font_bum01_63 a {
  font-size: 1rem;
}

._main-menu-bar-nav-shell_bum01_76 {
  gap: 26px;
  width: 100%;
  padding: 0 20px;
}

._main-menu-bar-brand-icon_bum01_120 {
  width: 26px;
  height: 26px;
}

._main-menu-bar-brand_bum01_95 {
  text-overflow: ellipsis;
  width: 128px;
  font-size: 16px;
  line-height: var(--main-top-bar-height);
  flex: 0 0 128px;
  display: block;
  overflow: hidden;
}

._main-menu-bar-product-name_bum01_547 {
  color: var(--color-erp-shell-text);
  opacity: .45;
  border-left: 1px solid #ffffff26;
  margin-left: 4px;
  padding-left: 10px;
  font-size: 12px;
  line-height: 1;
}

._main-menu-bar-nav-list_bum01_139 {
  scrollbar-width: none;
  min-width: 0;
  overflow-x: auto;
}

._main-menu-bar-nav-item_bum01_150 a {
  height: 34px;
  font-size: 14px;
  font-weight: 400;
  font-family: var(--default-font-family), sans-serif;
  border-radius: 6px;
  padding: 0 14px;
}

._main-menu-bar-nav-item_bum01_150 a._is-active_bum01_194 {
  background: #ffffff0f;
}

._main-menu-bar-nav-item_bum01_150 a:after, ._main-menu-bar-login-link_bum01_157:after {
  background: #69a5ff;
}

._main-menu-bar-profile-block_bum01_210, ._main-menu-bar-profile-image_bum01_252, ._main-menu-bar-profile-placeholder_bum01_262 {
  width: 28px;
  height: 28px;
}

._main-menu-bar-profile-image_bum01_252, ._main-menu-bar-profile-placeholder_bum01_262 {
  border-radius: 50%;
}

._main-menu-bar-message-badge_bum01_230 {
  box-shadow: 0 0 0 2px var(--color-erp-shell);
}

._main-menu-bar-login-link_bum01_157 {
  color: #a4aebf;
  border: none;
  border-left: 1px solid #ffffff26;
  height: 18px;
  margin-left: 4px;
  padding-left: 12px;
  font-size: 12px;
  font-weight: 400;
}

._main-menu-bar-user-name_bum01_604 {
  max-width: 100px;
  color: var(--color-erp-shell-text);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  overflow: hidden;
}

._main-menu-bar-flag-link_bum01_302 {
  order: -1;
}

._main-content_bum01_350 {
  padding-top: 0;
  padding-bottom: 0;
}

@media (max-width: 1024px) {
  html[data-app-layout="responsive"] ._main-menu-bar-nav-shell_bum01_76 {
    gap: 0;
    width: calc(100% - 24px);
    padding: 0;
  }

  html[data-app-layout="responsive"] ._main-menu-bar-nav-item_bum01_150 a {
    background: #535c69;
    height: auto;
    min-height: 44px;
    padding: 8px 12px;
    font-size: 1.2rem;
  }

  :is(html[data-app-layout="responsive"] ._main-menu-bar-profile-block_bum01_210, html[data-app-layout="responsive"] ._main-menu-bar-profile-image_bum01_252, html[data-app-layout="responsive"] ._main-menu-bar-profile-placeholder_bum01_262) {
    width: 44px;
    height: 44px;
  }
}

._main-menu-bar-submenu-dim_bum01_643 {
  inset: calc(var(--spacing, .25rem) * 0);
  z-index: 65;
  cursor: default;
  border-style: var(--tw-border-style);
  padding: calc(var(--spacing, .25rem) * 0);
  top: var(--main-header-height);
  background-color: oklab(16.4945% -.00107072 -.0221346 / .35);
  border-width: 0;
  position: fixed;
}

._main-menu-bar-submenu-dim_bum01_643[data-ending-style] {
  pointer-events: none;
}

._main-menu-bar-submenu-positioner_bum01_659 {
  z-index: var(--ui-menu-main-layer, 70);
}

._main-menu-bar-submenu-board_bum01_663 {
  --ui-menu-surface: var(--color-erp-menu);
  --ui-menu-text: var(--color-erp-shell-text);
  --ui-menu-border: var(--color-erp-shell-hover);
  border-style: var(--tw-border-style);
  border-width: 0;
  border-top-style: var(--tw-border-style);
  border-top-width: 1px;
  border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  border-bottom-right-radius: 8px;
  width: max-content;
  overflow: auto;
}

@supports (color: color-mix(in lab, red, red)) {
  ._main-menu-bar-submenu-board_bum01_663 {
    border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 8%, transparent);
  }
}

._main-menu-bar-submenu-board_bum01_663 {
  text-align: left;
  color: var(--ui-menu-text);
  background-color: #1e2333;
  background: var(--ui-menu-surface);
  max-width: calc(100vw - 24px);
  max-height: calc(100dvh - var(--main-header-height) - 12px);
  padding: 16px 32px 20px 22px;
  box-shadow: 0 8px 20px #0003;
}

._main-menu-bar-submenu-close_bum01_694 {
  border-style: var(--tw-border-style);
  width: 22px;
  height: 22px;
  padding: calc(var(--spacing, .25rem) * 0);
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  background-color: #0000;
  border-width: 0;
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 10px;
  right: 10px;
}

@supports (color: color-mix(in lab, red, red)) {
  ._main-menu-bar-submenu-close_bum01_694 {
    color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 40%, transparent);
  }
}

@media (hover: hover) {
  ._main-menu-bar-submenu-close_bum01_694:hover {
    background-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  }

  @supports (color: color-mix(in lab, red, red)) {
    ._main-menu-bar-submenu-close_bum01_694:hover {
      background-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 10%, transparent);
    }
  }

  ._main-menu-bar-submenu-close_bum01_694:hover {
    color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  }
}

._main-menu-bar-submenu-shell_bum01_733 {
  margin: calc(var(--spacing, .25rem) * 0);
  justify-content: flex-start;
  align-items: flex-start;
  gap: calc(var(--spacing, .25rem) * 0);
  width: max-content;
  padding: calc(var(--spacing, .25rem) * 0);
  display: flex;
}

._main-menu-bar-submenu-column_bum01_743 {
  margin: calc(var(--spacing, .25rem) * 0);
  border-right-style: var(--tw-border-style);
  border-right-width: 1px;
  border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  flex-direction: column;
  align-self: stretch;
  gap: 18px;
  min-width: 170px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  ._main-menu-bar-submenu-column_bum01_743 {
    border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 7.0%, transparent);
  }
}

._main-menu-bar-submenu-column_bum01_743 {
  padding-inline: 28px;
  padding-block: calc(var(--spacing, .25rem) * 0);
  text-align: left;
}

._main-menu-bar-submenu-column_bum01_743:first-child {
  padding-left: 0;
}

._main-menu-bar-submenu-column_bum01_743:last-child {
  border-right: 0;
  padding-right: 0;
}

._main-menu-bar-submenu-group_bum01_776 {
  flex-direction: column;
  gap: 2px;
  display: flex;
}

._main-menu-bar-submenu-primary_bum01_782 {
  border-bottom-style: var(--tw-border-style);
  border-bottom-width: 1px;
  border-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 2px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  ._main-menu-bar-submenu-primary_bum01_782 {
    border-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 14.0%, transparent);
  }
}

._main-menu-bar-submenu-primary_bum01_782 {
  --tw-leading: 1.2;
  --tw-font-weight: var(--font-weight-bold, 700);
  font-size: 14px;
  line-height: 1.2;
  font-weight: var(--font-weight-bold, 700);
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  padding-bottom: 8px;
  text-decoration-line: none;
}

._main-menu-bar-submenu-primary_bum01_782:not([aria-disabled="true"]):hover {
  color: #69a5ff;
}

._main-menu-bar-submenu-primary-plain_bum01_813 {
  cursor: default;
}

._main-menu-bar-submenu-primary-disabled_bum01_817 {
  color: #ffffff59;
  pointer-events: none;
}

._main-menu-bar-submenu-list_bum01_822 {
  margin: calc(var(--spacing, .25rem) * 0);
  padding: calc(var(--spacing, .25rem) * 0);
  list-style-type: none;
}

._main-menu-bar-submenu-list_bum01_822 li + li {
  margin-top: 0;
}

._main-menu-bar-submenu-list_bum01_822 a, ._main-menu-bar-submenu-list_bum01_822 ._main-menu-bar-submenu-text_bum01_832 {
  --tw-leading: 1.2;
  --tw-font-weight: var(--font-weight-normal, 400);
  font-size: 14px;
  line-height: 1.2;
  font-weight: var(--font-weight-normal, 400);
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  border-radius: 5px;
  flex-direction: column;
  align-items: flex-start;
  margin-inline: -6px;
  padding-block: 5px;
  padding-inline: 6px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  ._main-menu-bar-submenu-list_bum01_822 a, ._main-menu-bar-submenu-list_bum01_822 ._main-menu-bar-submenu-text_bum01_832 {
    color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 55%, transparent);
  }
}

._main-menu-bar-submenu-list_bum01_822 a, ._main-menu-bar-submenu-list_bum01_822 ._main-menu-bar-submenu-text_bum01_832 {
  text-decoration-line: none;
}

._main-menu-bar-submenu-list_bum01_822 a:hover {
  background-color: var(--color-erp-shell-text, var(--erp-color-shell-text));
}

@supports (color: color-mix(in lab, red, red)) {
  ._main-menu-bar-submenu-list_bum01_822 a:hover {
    background-color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 7.0%, transparent);
  }
}

._main-menu-bar-submenu-list_bum01_822 a:hover {
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
}

._main-menu-bar-submenu-hotkey_bum01_872 {
  margin-top: 2px;
  margin-left: calc(var(--spacing, .25rem) * 0);
  --tw-leading: 1.25;
  color: #69a5ff;
  font-size: 11px;
  line-height: 1.25;
}

._main-menu-bar-submenu-comment_bum01_881 {
  margin-top: 2px;
  margin-left: calc(var(--spacing, .25rem) * 0);
  --tw-leading: 1.25;
  color: var(--color-erp-shell-text, var(--erp-color-shell-text));
  font-size: 11px;
  line-height: 1.25;
}

@supports (color: color-mix(in lab, red, red)) {
  ._main-menu-bar-submenu-comment_bum01_881 {
    color: color-mix(in oklab, var(--color-erp-shell-text, var(--erp-color-shell-text)) 40%, transparent);
  }
}

._main-menu-bar-submenu-board_bum01_663 a:focus-visible, ._main-menu-bar-submenu-close_bum01_694:focus-visible {
  outline-style: var(--tw-outline-style);
  outline-width: 2px;
  outline-color: #69a5ff;
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
.counter {
  font-size: 16px;
  padding: 5px 10px;
  border-radius: 5px;
  color: var(--accent);
  background: var(--accent-bg);
  border: 2px solid transparent;
  transition: border-color 0.3s;
  margin-bottom: 24px;

  &:hover {
    border-color: var(--accent-border);
  }
  &:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
  }
}

.hero {
  position: relative;

  .base,
  .framework,
  .vite {
    inset-inline: 0;
    margin: 0 auto;
  }

  .base {
    width: 170px;
    position: relative;
    z-index: 0;
  }

  .framework,
  .vite {
    position: absolute;
  }

  .framework {
    z-index: 1;
    top: 34px;
    height: 28px;
    transform: perspective(2000px) rotateZ(300deg) rotateX(44deg) rotateY(39deg)
      scale(1.4);
  }

  .vite {
    z-index: 0;
    top: 107px;
    height: 26px;
    width: auto;
    transform: perspective(2000px) rotateZ(300deg) rotateX(40deg) rotateY(39deg)
      scale(0.8);
  }
}

#center-css {
  display: flex;
  flex-direction: column;
  gap: 25px;
  place-content: center;
  place-items: center;
  flex-grow: 1;

  @media (max-width: 1024px) {
    padding: 32px 20px 24px;
    gap: 18px;
  }
}

#next-steps {
  display: flex;
  border-top: 1px solid var(--border);
  text-align: left;

  & > div {
    flex: 1 1 0;
    padding: 32px;
    @media (max-width: 1024px) {
      padding: 24px 20px;
    }
  }

  .icon {
    margin-bottom: 16px;
    width: 22px;
    height: 22px;
  }

  @media (max-width: 1024px) {
    flex-direction: column;
    text-align: center;
  }
}

#docs {
  border-right: 1px solid var(--border);

  @media (max-width: 1024px) {
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
}

#next-steps ul {
  list-style: none;
  padding: 0;
  display: flex;
  gap: 8px;
  margin: 32px 0 0;

  .logo {
    height: 18px;
  }

  a {
    color: var(--text-h);
    font-size: 16px;
    border-radius: 6px;
    background: var(--social-bg);
    display: flex;
    padding: 6px 12px;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    transition: box-shadow 0.3s;

    &:hover {
      box-shadow: var(--shadow);
    }
    .button-icon {
      height: 18px;
      width: 18px;
    }
  }

  @media (max-width: 1024px) {
    margin-top: 20px;
    flex-wrap: wrap;
    justify-content: center;

    li {
      flex: 1 1 calc(50% - 8px);
    }

    a {
      width: 100%;
      justify-content: center;
      box-sizing: border-box;
    }
  }
}

#spacer {
  height: 88px;
  border-top: 1px solid var(--border);
  @media (max-width: 1024px) {
    height: 48px;
  }
}

.ticks {
  position: relative;
  width: 100%;

  &::before,
  &::after {
    content: '';
    position: absolute;
    top: -4.5px;
    border: 5px solid transparent;
  }

  &::before {
    left: 0;
    border-left-color: var(--border);
  }
  &::after {
    right: 0;
    border-right-color: var(--border);
  }
}

.auth-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.auth-card {
  width: min(420px, 100%);
  border: 1px solid #d9d9d9;
  border-radius: 12px;
  padding: 24px;
  background: #fff;
}

.auth-card h1 {
  margin: 0 0 12px;
  font-size: 24px;
}

.auth-card p {
  margin: 0 0 16px;
  color: #555;
}

.auth-link {
  color: #0d6efd;
  text-decoration: none;
  font-weight: var(--app-font-weight-bold);
}

.auth-link:hover {
  text-decoration: underline;
}
/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-divide-x-reverse: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-ease: initial;
    }
  }
}

:root {
  overflow-wrap: break-word;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  text-size-adjust: none;
  text-rendering: optimizelegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  --tt-gray-light-a-50: #3838380a;
  --tt-gray-light-a-100: #0f16240d;
  --tt-gray-light-a-200: #25272d1a;
  --tt-gray-light-a-300: #2f323733;
  --tt-gray-light-a-400: #282c336b;
  --tt-gray-light-a-500: #34373ca3;
  --tt-gray-light-a-600: #24272ec7;
  --tt-gray-light-a-700: #23252ade;
  --tt-gray-light-a-800: #1e2024f2;
  --tt-gray-light-a-900: #1d1e20fa;
  --tt-gray-light-50: #fafafa;
  --tt-gray-light-100: #f4f4f5;
  --tt-gray-light-200: #eaeaeb;
  --tt-gray-light-300: #d5d6d7;
  --tt-gray-light-400: #a6a7ab;
  --tt-gray-light-500: #7d7f82;
  --tt-gray-light-600: #53565a;
  --tt-gray-light-700: #404145;
  --tt-gray-light-800: #2c2d30;
  --tt-gray-light-900: #222325;
  --tt-gray-dark-a-50: #e8e8fd0d;
  --tt-gray-dark-a-100: #e7e7f312;
  --tt-gray-dark-a-200: #eeeef61c;
  --tt-gray-dark-a-300: #efeff538;
  --tt-gray-dark-a-400: #f4f4ff5e;
  --tt-gray-dark-a-500: #eceefd80;
  --tt-gray-dark-a-600: #f7f7fda3;
  --tt-gray-dark-a-700: #fbfbfebf;
  --tt-gray-dark-a-800: #fdfdfde0;
  --tt-gray-dark-a-900: #fffffff5;
  --tt-gray-dark-50: #19191a;
  --tt-gray-dark-100: #202022;
  --tt-gray-dark-200: #2d2d2f;
  --tt-gray-dark-300: #464649;
  --tt-gray-dark-400: #636369;
  --tt-gray-dark-500: #7c7c83;
  --tt-gray-dark-600: #a3a3a8;
  --tt-gray-dark-700: #c0c0c3;
  --tt-gray-dark-800: #e0e0e1;
  --tt-gray-dark-900: #f5f5f5;
  --tt-brand-color-50: #efeeff;
  --tt-brand-color-100: #dedbff;
  --tt-brand-color-200: #c3bdff;
  --tt-brand-color-300: #9d8aff;
  --tt-brand-color-400: #7a52ff;
  --tt-brand-color-500: #6229ff;
  --tt-brand-color-600: #5400e5;
  --tt-brand-color-700: #4b00cc;
  --tt-brand-color-800: #380099;
  --tt-brand-color-900: #2b1966;
  --tt-brand-color-950: #0d002e;
  --tt-color-green-inc-5: #f0fff2;
  --tt-color-green-inc-4: #d6ffdc;
  --tt-color-green-inc-3: #b8ffc5;
  --tt-color-green-inc-2: #90fea8;
  --tt-color-green-inc-1: #67fe92;
  --tt-color-green-base: #01fe73;
  --tt-color-green-dec-1: #03ce5e;
  --tt-color-green-dec-2: #02a247;
  --tt-color-green-dec-3: #007a35;
  --tt-color-green-dec-4: #005221;
  --tt-color-green-dec-5: #002e0f;
  --tt-color-yellow-inc-5: #fffcf0;
  --tt-color-yellow-inc-4: #fff7d1;
  --tt-color-yellow-inc-3: #fff1ad;
  --tt-color-yellow-inc-2: #ffeb8a;
  --tt-color-yellow-inc-1: #ffe45c;
  --tt-color-yellow-base: #fd0;
  --tt-color-yellow-dec-1: #d1b500;
  --tt-color-yellow-dec-2: #a38d00;
  --tt-color-yellow-dec-3: #7a6a00;
  --tt-color-yellow-dec-4: #524500;
  --tt-color-yellow-dec-5: #2e2600;
  --tt-color-red-inc-5: #ffeeeb;
  --tt-color-red-inc-4: #ffcdc2;
  --tt-color-red-inc-3: #fa9;
  --tt-color-red-inc-2: #ff8a75;
  --tt-color-red-inc-1: #ff5d47;
  --tt-color-red-base: #ff3014;
  --tt-color-red-dec-1: #d11800;
  --tt-color-red-dec-2: #a30e00;
  --tt-color-red-dec-3: #7a0800;
  --tt-color-red-dec-4: #520400;
  --tt-color-red-dec-5: #2e0100;
  --white: #fff;
  --black: #0e0e11;
  --transparent: #fff0;
  --tt-shadow-elevated-md: 0px 16px 48px 0px #1118270a,
    0px 12px 24px 0px #1118270a,
    0px 6px 8px 0px #11182705,
    0px 2px 3px 0px #11182705;
  --tt-radius-none: 0;
  --tt-radius-hairline: 1px;
  --tt-radius-control: var(--ui-radius-control, 4px);
  --tt-radius-xxs: calc(var(--tt-radius-control) * .5);
  --tt-radius-xs: calc(var(--tt-radius-control) * .75);
  --tt-radius-sm: var(--tt-radius-control);
  --tt-radius-md: var(--tt-radius-control);
  --tt-radius-lg: calc(var(--tt-radius-control) * 1.5);
  --tt-radius-xl: calc(var(--tt-radius-control) * 2);
  --tt-radius-pill: 999px;
  --tt-transition-duration-short: .1s;
  --tt-transition-duration-default: .2s;
  --tt-transition-duration-long: .64s;
  --tt-transition-easing-default: cubic-bezier(.46, .03, .52, .96);
  --tt-transition-easing-cubic: cubic-bezier(.65, .05, .36, 1);
  --tt-transition-easing-quart: cubic-bezier(.77, 0, .18, 1);
  --tt-transition-easing-circ: cubic-bezier(.79, .14, .15, .86);
  --tt-transition-easing-back: cubic-bezier(.68, -.55, .27, 1.55);
  --tt-accent-contrast: 8%;
  --tt-destructive-contrast: 8%;
  --tt-foreground-contrast: 8%;
}

:root, :root *, :root :before, :root :after {
  box-sizing: border-box;
}

:root {
  --tt-bg-color: var(--white);
  --tt-border-color: var(--tt-gray-light-a-200);
  --tt-border-color-tint: var(--tt-gray-light-a-100);
  --tt-sidebar-bg-color: var(--tt-gray-light-100);
  --tt-scrollbar-color: var(--tt-gray-light-a-200);
  --tt-cursor-color: var(--tt-brand-color-500);
  --tt-selection-color: #9d8aff33;
  --tt-card-bg-color: var(--white);
  --tt-card-border-color: var(--tt-gray-light-a-100);
}

.dark {
  --tt-bg-color: var(--black);
  --tt-border-color: var(--tt-gray-dark-a-200);
  --tt-border-color-tint: var(--tt-gray-dark-a-100);
  --tt-sidebar-bg-color: var(--tt-gray-dark-100);
  --tt-scrollbar-color: var(--tt-gray-dark-a-200);
  --tt-cursor-color: var(--tt-brand-color-400);
  --tt-selection-color: #7a52ff33;
  --tt-card-bg-color: var(--tt-gray-dark-50);
  --tt-card-border-color: var(--tt-gray-dark-a-50);
  --tt-shadow-elevated-md: 0px 16px 48px 0px #00000080, 0px 12px 24px 0px #0000003d,
    0px 6px 8px 0px #00000038, 0px 2px 3px 0px #0000001f;
}

:root {
  --tt-color-text-gray: #787673;
  --tt-color-text-brown: #9d6a53;
  --tt-color-text-orange: #d9730d;
  --tt-color-text-yellow: #ca922f;
  --tt-color-text-green: #448361;
  --tt-color-text-blue: #327da9;
  --tt-color-text-purple: #8f64af;
  --tt-color-text-pink: #c24c8b;
  --tt-color-text-red: #d34a45;
  --tt-color-text-gray-contrast: #54473126;
  --tt-color-text-brown-contrast: #d2a28e59;
  --tt-color-text-orange-contrast: #e07b3845;
  --tt-color-text-yellow-contrast: #ecbe4163;
  --tt-color-text-green-contrast: #7bb78145;
  --tt-color-text-blue-contrast: #5ea6cf45;
  --tt-color-text-purple-contrast: #a881c545;
  --tt-color-text-pink-contrast: #e189b445;
  --tt-color-text-red-contrast: #f4aa9f66;
}

.dark {
  --tt-color-text-gray: #9c9c9c;
  --tt-color-text-brown: #b9856e;
  --tt-color-text-orange: #c77d48;
  --tt-color-text-yellow: #ca994e;
  --tt-color-text-green: #519e71;
  --tt-color-text-blue: #3699d3;
  --tt-color-text-purple: #9e69d3;
  --tt-color-text-pink: #d15796;
  --tt-color-text-red: #df5553;
  --tt-color-text-gray-contrast: #ffffff17;
  --tt-color-text-brown-contrast: #b9674640;
  --tt-color-text-orange-contrast: #e97d2533;
  --tt-color-text-yellow-contrast: #b3823d33;
  --tt-color-text-green-contrast: #2d9a6533;
  --tt-color-text-blue-contrast: #327da933;
  --tt-color-text-purple-contrast: #9b60d22e;
  --tt-color-text-pink-contrast: #dc4c9238;
  --tt-color-text-red-contrast: #dd555540;
}

:root {
  --tt-color-highlight-yellow: #fef9c3;
  --tt-color-highlight-green: #dcfce7;
  --tt-color-highlight-blue: #e0f2fe;
  --tt-color-highlight-purple: #f3e8ff;
  --tt-color-highlight-red: #ffe4e6;
  --tt-color-highlight-gray: #f8f8f7;
  --tt-color-highlight-brown: #f4eeee;
  --tt-color-highlight-orange: #fbecdd;
  --tt-color-highlight-pink: #fcf1f6;
  --tt-color-highlight-yellow-contrast: #fbe604;
  --tt-color-highlight-green-contrast: #c7fad8;
  --tt-color-highlight-blue-contrast: #ceeafd;
  --tt-color-highlight-purple-contrast: #e4ccff;
  --tt-color-highlight-red-contrast: #ffccd0;
  --tt-color-highlight-gray-contrast: #54483126;
  --tt-color-highlight-brown-contrast: #d2a28d59;
  --tt-color-highlight-orange-contrast: #e07c3945;
  --tt-color-highlight-pink-contrast: #e188b345;
}

.dark {
  --tt-color-highlight-yellow: #6b6524;
  --tt-color-highlight-green: #509568;
  --tt-color-highlight-blue: #6e92aa;
  --tt-color-highlight-purple: #583e74;
  --tt-color-highlight-red: #743e42;
  --tt-color-highlight-gray: #2f2f2f;
  --tt-color-highlight-brown: #4a3228;
  --tt-color-highlight-orange: #5c3b23;
  --tt-color-highlight-pink: #4e2c3c;
  --tt-color-highlight-yellow-contrast: #58531e;
  --tt-color-highlight-green-contrast: #47855d;
  --tt-color-highlight-blue-contrast: #5e86a1;
  --tt-color-highlight-purple-contrast: #4c3564;
  --tt-color-highlight-red-contrast: #643539;
  --tt-color-highlight-gray-contrast: #ffffff18;
  --tt-color-highlight-brown-contrast: #b8654540;
  --tt-color-highlight-orange-contrast: #e97e2533;
  --tt-color-highlight-pink-contrast: #dc4c9138;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomIn {
  from {
    transform: scale(.95);
  }

  to {
    transform: scale(1);
  }
}

@keyframes zoomOut {
  from {
    transform: scale(1);
  }

  to {
    transform: scale(.95);
  }
}

@keyframes zoom {
  0% {
    opacity: 0;
    transform: scale(.95);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slideFromTop {
  from {
    transform: translateY(-.5rem);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes slideFromRight {
  from {
    transform: translateX(.5rem);
  }

  to {
    transform: translateX(0);
  }
}

@keyframes slideFromLeft {
  from {
    transform: translateX(-.5rem);
  }

  to {
    transform: translateX(0);
  }
}

@keyframes slideFromBottom {
  from {
    transform: translateY(.5rem);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes spin {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-white: #fff;
    --spacing: .25rem;
    --text-xs: .75rem;
    --text-xs--line-height: calc(1 / .75);
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --radius-md: var(--ui-radius-control);
    --radius-lg: var(--ui-radius-menu);
    --radius-xl: var(--ui-radius-surface);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-erp-summary: var(--erp-color-summary);
    --color-erp-menu: var(--erp-color-menu);
    --color-erp-surface: var(--erp-color-surface);
    --color-erp-primary: var(--erp-color-primary);
    --color-erp-primary-hover: var(--erp-color-primary-hover);
    --color-erp-tint: var(--erp-color-tint);
    --color-erp-navy: var(--erp-color-navy);
    --color-erp-shell: var(--erp-color-shell);
    --color-erp-shell-hover: var(--erp-color-shell-hover);
    --color-erp-shell-text: var(--erp-color-shell-text);
    --color-erp-canvas: var(--erp-color-canvas);
    --color-erp-section: var(--erp-color-section);
    --color-erp-label: var(--erp-color-label);
    --color-erp-ink: var(--erp-color-ink);
    --color-erp-ink-strong: var(--erp-color-ink-strong);
    --color-erp-muted: var(--erp-color-muted);
    --color-erp-placeholder: var(--erp-color-placeholder);
    --color-erp-line: var(--erp-color-line);
    --color-erp-danger: var(--erp-color-danger);
    --color-erp-danger-tint: var(--erp-color-danger-tint);
    --color-erp-on-primary: var(--erp-color-on-primary);
    --color-erp-disabled: var(--erp-color-disabled);
    --color-erp-success: var(--erp-color-success);
    --color-erp-success-tint: var(--erp-color-success-tint);
    --color-erp-warning: var(--erp-color-warning);
    --color-erp-warning-tint: var(--erp-color-warning-tint);
    --color-erp-selected: var(--erp-color-selected);
    --color-erp-focus-ring: var(--erp-color-focus-ring);
    --color-erp-overlay: var(--erp-color-overlay);
  }
}

@layer base {
  *, :after, :before, ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  html, :host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }

  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }

  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }

  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }

  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }

  small {
    font-size: 80%;
  }

  sub, sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative;
  }

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }

  :-moz-focusring {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

  ol, ul, menu {
    list-style: none;
  }

  img, svg, video, canvas, audio, iframe, embed, object {
    vertical-align: middle;
    display: block;
  }

  img, video {
    max-width: 100%;
    height: auto;
  }

  button, input, select, optgroup, textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }

  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }

  ::file-selector-button {
    margin-inline-end: 4px;
  }

  ::placeholder {
    opacity: 1;
  }

  @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab, red, red)) {
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }

  textarea {
    resize: vertical;
  }

  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }

  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }

  ::-webkit-datetime-edit {
    display: inline-flex;
  }

  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }

  ::-webkit-datetime-edit {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

  :-moz-ui-invalid {
    box-shadow: none;
  }

  button, input:where([type="button"], [type="reset"], [type="submit"]) {
    appearance: button;
  }

  ::file-selector-button {
    appearance: button;
  }

  ::-webkit-inner-spin-button {
    height: auto;
  }

  ::-webkit-outer-spin-button {
    height: auto;
  }

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }

  :where(*) {
    scrollbar-width: thin;
    scrollbar-color: var(--ui-scrollbar-thumb, #b5bdc9) transparent;
  }

  ::-webkit-scrollbar {
    width: var(--ui-scrollbar-size, 8px);
    height: var(--ui-scrollbar-size, 8px);
  }

  ::-webkit-scrollbar-thumb {
    border-radius: var(--ui-radius-pill, 999px);
    background: var(--ui-scrollbar-thumb, #b5bdc9);
  }

  ::-webkit-scrollbar-thumb:hover {
    background: var(--ui-scrollbar-thumb-hover, #8994a6);
  }

  ::-webkit-scrollbar-track {
    background: none;
  }

  ::-webkit-scrollbar-corner {
    background: none;
  }

  * {
    font-family: var(--default-font-family);
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }
}

@layer components;

@layer utilities {
  .pointer-events-none {
    pointer-events: none;
  }

  .visible {
    visibility: visible;
  }

  .sr-only {
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
  }

  .absolute {
    position: absolute;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .static {
    position: static;
  }

  .sticky {
    position: sticky;
  }

  .inset-0 {
    inset: calc(var(--spacing) * 0);
  }

  .start {
    inset-inline-start: var(--spacing);
  }

  .end {
    inset-inline-end: var(--spacing);
  }

  .top-2 {
    top: calc(var(--spacing) * 2);
  }

  .top-3 {
    top: calc(var(--spacing) * 3);
  }

  .top-\[4px\] {
    top: 4px;
  }

  .right-2 {
    right: calc(var(--spacing) * 2);
  }

  .right-4 {
    right: calc(var(--spacing) * 4);
  }

  .right-6 {
    right: calc(var(--spacing) * 6);
  }

  .right-\[10px\] {
    right: 10px;
  }

  .bottom-6 {
    bottom: calc(var(--spacing) * 6);
  }

  .z-10 {
    z-index: 10;
  }

  .z-30 {
    z-index: 30;
  }

  .z-\[9000\] {
    z-index: 9000;
  }

  .col-span-full {
    grid-column: 1 / -1;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .-m-\[4px\] {
    margin: -4px;
  }

  .m-0 {
    margin: calc(var(--spacing) * 0);
  }

  .mx-1 {
    margin-inline: calc(var(--spacing) * 1);
  }

  .mt-auto {
    margin-top: auto;
  }

  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }

  .ml-auto {
    margin-left: auto;
  }

  .block {
    display: block;
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .inline-flex {
    display: inline-flex;
  }

  .table {
    display: table;
  }

  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .size-\[18px\] {
    width: 18px;
    height: 18px;
  }

  .size-\[24px\] {
    width: 24px;
    height: 24px;
  }

  .size-\[28px\] {
    width: 28px;
    height: 28px;
  }

  .\!h-\[280px\] {
    height: 280px !important;
  }

  .h-3 {
    height: calc(var(--spacing) * 3);
  }

  .h-5 {
    height: calc(var(--spacing) * 5);
  }

  .h-8 {
    height: calc(var(--spacing) * 8);
  }

  .h-\[4px\] {
    height: 4px;
  }

  .h-\[30px\] {
    height: 30px;
  }

  .h-\[34px\] {
    height: 34px;
  }

  .h-\[36px\] {
    height: 36px;
  }

  .h-\[56px\] {
    height: 56px;
  }

  .h-full {
    height: 100%;
  }

  .h-px {
    height: 1px;
  }

  .\!min-h-\[200px\] {
    min-height: 200px !important;
  }

  .min-h-0 {
    min-height: calc(var(--spacing) * 0);
  }

  .min-h-20 {
    min-height: calc(var(--spacing) * 20);
  }

  .min-h-40 {
    min-height: calc(var(--spacing) * 40);
  }

  .min-h-64 {
    min-height: calc(var(--spacing) * 64);
  }

  .min-h-\[36px\] {
    min-height: 36px;
  }

  .min-h-\[56px\] {
    min-height: 56px;
  }

  .min-h-\[84px\] {
    min-height: 84px;
  }

  .w-12 {
    width: calc(var(--spacing) * 12);
  }

  .w-32 {
    width: calc(var(--spacing) * 32);
  }

  .w-36 {
    width: calc(var(--spacing) * 36);
  }

  .w-60 {
    width: calc(var(--spacing) * 60);
  }

  .w-\[52px\] {
    width: 52px;
  }

  .w-\[56px\] {
    width: 56px;
  }

  .w-\[112px\] {
    width: 112px;
  }

  .w-\[140px\] {
    width: 140px;
  }

  .w-\[170px\] {
    width: 170px;
  }

  .w-\[240px\] {
    width: 240px;
  }

  .w-\[320px\] {
    width: 320px;
  }

  .w-full {
    width: 100%;
  }

  .w-px {
    width: 1px;
  }

  .max-w-\[calc\(100vw-32px\)\] {
    max-width: calc(100vw - 32px);
  }

  .min-w-0 {
    min-width: calc(var(--spacing) * 0);
  }

  .min-w-\[72px\] {
    min-width: 72px;
  }

  .flex-1 {
    flex: 1;
  }

  .shrink-0 {
    flex-shrink: 0;
  }

  .transform {
    transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .cursor-row-resize {
    cursor: row-resize;
  }

  .touch-none {
    touch-action: none;
  }

  .resize {
    resize: both;
  }

  .resize-y {
    resize: vertical;
  }

  .grid-cols-\[120px_minmax\(0\,1fr\)_auto\] {
    grid-template-columns: 120px minmax(0, 1fr) auto;
  }

  .grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,2fr\)_auto\] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto;
  }

  .flex-col {
    flex-direction: column;
  }

  .flex-row {
    flex-direction: row;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .place-items-center {
    place-items: center;
  }

  .items-center {
    align-items: center;
  }

  .items-start {
    align-items: flex-start;
  }

  .justify-between {
    justify-content: space-between;
  }

  .justify-center {
    justify-content: center;
  }

  .justify-end {
    justify-content: flex-end;
  }

  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }

  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }

  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5);
  }

  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }

  .gap-\[2px\] {
    gap: 2px;
  }

  .gap-\[6px\] {
    gap: 6px;
  }

  .gap-\[8px\] {
    gap: 8px;
  }

  .gap-\[10px\] {
    gap: 10px;
  }

  .gap-\[12px\] {
    gap: 12px;
  }

  .gap-\[13px\] {
    gap: 13px;
  }

  .gap-\[16px\] {
    gap: 16px;
  }

  .gap-x-4 {
    column-gap: calc(var(--spacing) * 4);
  }

  .gap-x-\[10px\] {
    column-gap: 10px;
  }

  .gap-y-2 {
    row-gap: calc(var(--spacing) * 2);
  }

  .gap-y-\[8px\] {
    row-gap: 8px;
  }

  :where(.divide-x > :not(:last-child)) {
    --tw-divide-x-reverse: 0;
    border-inline-style: var(--tw-border-style);
    border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
    border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
  }

  :where(.divide-erp-line\/20 > :not(:last-child)) {
    border-color: var(--color-erp-line);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :where(.divide-erp-line\/20 > :not(:last-child)) {
      border-color: color-mix(in oklab, var(--color-erp-line) 20%, transparent);
    }
  }

  .truncate {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .overflow-auto {
    overflow: auto;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .overflow-x-auto {
    overflow-x: auto;
  }

  .rounded {
    border-radius: .25rem;
  }

  .rounded-\[4px\] {
    border-radius: 4px;
  }

  .rounded-\[7px\] {
    border-radius: 7px;
  }

  .rounded-\[8px\] {
    border-radius: 8px;
  }

  .rounded-\[16px\] {
    border-radius: 16px;
  }

  .rounded-\[var\(--ui-button-radius\)\] {
    border-radius: var(--ui-button-radius);
  }

  .rounded-\[var\(--ui-radius-compact\)\] {
    border-radius: var(--ui-radius-compact);
  }

  .rounded-\[var\(--ui-section-radius\)\] {
    border-radius: var(--ui-section-radius);
  }

  .rounded-full {
    border-radius: 3.40282e38px;
  }

  .rounded-lg {
    border-radius: var(--radius-lg);
  }

  .rounded-md {
    border-radius: var(--radius-md);
  }

  .rounded-xl {
    border-radius: var(--radius-xl);
  }

  .rounded-b-\[var\(--ui-section-radius\)\] {
    border-bottom-right-radius: var(--ui-section-radius);
    border-bottom-left-radius: var(--ui-section-radius);
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }

  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }

  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }

  .border-erp-line, .border-erp-line\/20 {
    border-color: var(--color-erp-line);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-erp-line\/20 {
      border-color: color-mix(in oklab, var(--color-erp-line) 20%, transparent);
    }
  }

  .border-erp-shell-text\/30 {
    border-color: var(--color-erp-shell-text);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-erp-shell-text\/30 {
      border-color: color-mix(in oklab, var(--color-erp-shell-text) 30%, transparent);
    }
  }

  .border-erp-shell-text\/\[0\.07\] {
    border-color: var(--color-erp-shell-text);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-erp-shell-text\/\[0\.07\] {
      border-color: color-mix(in oklab, var(--color-erp-shell-text) 7.0%, transparent);
    }
  }

  .bg-\[var\(--ui-scrollbar-thumb\)\] {
    background-color: var(--ui-scrollbar-thumb);
  }

  .bg-erp-canvas, .bg-erp-canvas\/50 {
    background-color: var(--color-erp-canvas);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-erp-canvas\/50 {
      background-color: color-mix(in oklab, var(--color-erp-canvas) 50%, transparent);
    }
  }

  .bg-erp-danger-tint {
    background-color: var(--color-erp-danger-tint);
  }

  .bg-erp-label {
    background-color: var(--color-erp-label);
  }

  .bg-erp-line {
    background-color: var(--color-erp-line);
  }

  .bg-erp-menu {
    background-color: var(--color-erp-menu);
  }

  .bg-erp-primary {
    background-color: var(--color-erp-primary);
  }

  .bg-erp-section {
    background-color: var(--color-erp-section);
  }

  .bg-erp-summary {
    background-color: var(--color-erp-summary);
  }

  .bg-erp-surface, .bg-erp-surface\/10 {
    background-color: var(--color-erp-surface);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-erp-surface\/10 {
      background-color: color-mix(in oklab, var(--color-erp-surface) 10%, transparent);
    }
  }

  .bg-erp-surface\/20 {
    background-color: var(--color-erp-surface);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-erp-surface\/20 {
      background-color: color-mix(in oklab, var(--color-erp-surface) 20%, transparent);
    }
  }

  .bg-erp-warning-tint {
    background-color: var(--color-erp-warning-tint);
  }

  .bg-transparent {
    background-color: #0000;
  }

  .bg-white {
    background-color: var(--color-white);
  }

  .p-0 {
    padding: calc(var(--spacing) * 0);
  }

  .p-3 {
    padding: calc(var(--spacing) * 3);
  }

  .p-4 {
    padding: calc(var(--spacing) * 4);
  }

  .p-\[4px\] {
    padding: 4px;
  }

  .px-1 {
    padding-inline: calc(var(--spacing) * 1);
  }

  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }

  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }

  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }

  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }

  .px-\[6px\] {
    padding-inline: 6px;
  }

  .px-\[8px\] {
    padding-inline: 8px;
  }

  .px-\[10px\] {
    padding-inline: 10px;
  }

  .px-\[12px\] {
    padding-inline: 12px;
  }

  .px-\[14px\] {
    padding-inline: 14px;
  }

  .px-\[20px\] {
    padding-inline: 20px;
  }

  .px-\[24px\] {
    padding-inline: 24px;
  }

  .py-1 {
    padding-block: calc(var(--spacing) * 1);
  }

  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }

  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }

  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }

  .py-\[2px\] {
    padding-block: 2px;
  }

  .py-\[8px\] {
    padding-block: 8px;
  }

  .py-\[10px\] {
    padding-block: 10px;
  }

  .py-\[24px\] {
    padding-block: 24px;
  }

  .pt-\[30px\] {
    padding-top: 30px;
  }

  .pt-\[80px\] {
    padding-top: 80px;
  }

  .pr-1 {
    padding-right: calc(var(--spacing) * 1);
  }

  .pr-9 {
    padding-right: calc(var(--spacing) * 9);
  }

  .text-center {
    text-align: center;
  }

  .text-left {
    text-align: left;
  }

  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .text-\[12px\] {
    font-size: 12px;
  }

  .text-\[13px\] {
    font-size: 13px;
  }

  .text-\[14px\] {
    font-size: 14px;
  }

  .text-\[18px\] {
    font-size: 18px;
  }

  .leading-5 {
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
  }

  .leading-6 {
    --tw-leading: calc(var(--spacing) * 6);
    line-height: calc(var(--spacing) * 6);
  }

  .leading-\[1\.5\] {
    --tw-leading: 1.5;
    line-height: 1.5;
  }

  .leading-\[28px\] {
    --tw-leading: 28px;
    line-height: 28px;
  }

  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }

  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }

  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }

  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .text-wrap {
    text-wrap: wrap;
  }

  .break-words {
    overflow-wrap: break-word;
  }

  .break-all {
    word-break: break-all;
  }

  .whitespace-nowrap {
    white-space: nowrap;
  }

  .whitespace-pre-wrap {
    white-space: pre-wrap;
  }

  .text-erp-danger {
    color: var(--color-erp-danger);
  }

  .text-erp-ink {
    color: var(--color-erp-ink);
  }

  .text-erp-ink-strong {
    color: var(--color-erp-ink-strong);
  }

  .text-erp-muted {
    color: var(--color-erp-muted);
  }

  .text-erp-navy {
    color: var(--color-erp-navy);
  }

  .text-erp-on-primary {
    color: var(--color-erp-on-primary);
  }

  .text-erp-primary\/40 {
    color: var(--color-erp-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-erp-primary\/40 {
      color: color-mix(in oklab, var(--color-erp-primary) 40%, transparent);
    }
  }

  .text-erp-shell-text, .text-erp-shell-text\/65 {
    color: var(--color-erp-shell-text);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-erp-shell-text\/65 {
      color: color-mix(in oklab, var(--color-erp-shell-text) 65%, transparent);
    }
  }

  .text-erp-warning {
    color: var(--color-erp-warning);
  }

  .text-inherit {
    color: inherit;
  }

  .text-white {
    color: var(--color-white);
  }

  .capitalize {
    text-transform: capitalize;
  }

  .lowercase {
    text-transform: lowercase;
  }

  .italic {
    font-style: italic;
  }

  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .underline {
    text-decoration-line: underline;
  }

  .underline-offset-2 {
    text-underline-offset: 2px;
  }

  .opacity-45 {
    opacity: .45;
  }

  .opacity-100 {
    opacity: 1;
  }

  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-erp-card {
    --tw-shadow: 0 1px 2px var(--tw-shadow-color, #1717170f);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-sm {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .outline-2 {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }

  .outline-offset-\[3px\] {
    outline-offset: 3px;
  }

  .outline-erp-shell-text {
    outline-color: var(--color-erp-shell-text);
  }

  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .filter {
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-\[border-color\,box-shadow\] {
    transition-property: border-color, box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-shadow {
    transition-property: box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .ease-in-out {
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }

  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }

  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }

  .\[verify\:utf8\] {
    verify: utf8;
  }

  @media (hover: hover) {
    .group-hover\:opacity-100:is(:where(.group):hover *) {
      opacity: 1;
    }
  }

  .placeholder\:text-erp-muted\/60::placeholder {
    color: var(--color-erp-muted);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .placeholder\:text-erp-muted\/60::placeholder {
      color: color-mix(in oklab, var(--color-erp-muted) 60%, transparent);
    }
  }

  .last\:pr-0:last-child {
    padding-right: calc(var(--spacing) * 0);
  }

  @media (hover: hover) {
    .hover\:border-erp-primary:hover {
      border-color: var(--color-erp-primary);
    }

    .hover\:bg-erp-canvas:hover {
      background-color: var(--color-erp-canvas);
    }

    .hover\:bg-erp-shell-hover:hover {
      background-color: var(--color-erp-shell-hover);
    }

    .hover\:bg-erp-shell-text\/10:hover {
      background-color: var(--color-erp-shell-text);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-erp-shell-text\/10:hover {
        background-color: color-mix(in oklab, var(--color-erp-shell-text) 10%, transparent);
      }
    }

    .hover\:text-erp-ink:hover {
      color: var(--color-erp-ink);
    }

    .hover\:text-erp-shell-text:hover {
      color: var(--color-erp-shell-text);
    }

    .hover\:underline:hover {
      text-decoration-line: underline;
    }
  }

  .focus\:border-erp-focus-ring:focus {
    border-color: var(--color-erp-focus-ring);
  }

  .focus\:border-erp-primary:focus {
    border-color: var(--color-erp-primary);
  }

  .focus\:bg-erp-surface:focus {
    background-color: var(--color-erp-surface);
  }

  .focus\:ring-2:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .focus\:ring-\[3px\]:focus {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .focus\:ring-erp-focus-ring:focus {
    --tw-ring-color: var(--color-erp-focus-ring);
  }

  .focus\:ring-erp-primary\/10:focus {
    --tw-ring-color: var(--color-erp-primary);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .focus\:ring-erp-primary\/10:focus {
      --tw-ring-color: color-mix(in oklab, var(--color-erp-primary) 10%, transparent);
    }
  }

  .focus-visible\:ring-2:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .focus-visible\:ring-erp-shell-text\/70:focus-visible {
    --tw-ring-color: var(--color-erp-shell-text);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .focus-visible\:ring-erp-shell-text\/70:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-erp-shell-text) 70%, transparent);
    }
  }

  .disabled\:pointer-events-none:disabled {
    pointer-events: none;
  }

  .disabled\:opacity-40:disabled {
    opacity: .4;
  }

  @media (prefers-reduced-motion: reduce) {
    .motion-reduce\:transition-none {
      transition-property: none;
    }
  }

  .\[\&_input\]\:h-\[var\(--ui-field-control-height\)\] input {
    height: var(--ui-field-control-height);
  }
}

html:root {
  --text: var(--color-erp-ink);
  --text-h: var(--color-erp-ink-strong);
  --bg: var(--color-erp-surface);
  --border: var(--color-erp-line);
  --code-bg: var(--color-erp-section);
  --accent: var(--color-erp-primary);
  --accent-bg: var(--color-erp-tint);
  --accent-border: var(--color-erp-primary);
  --erp-color-surface: #fff;
  --erp-color-primary: #06f;
  --erp-color-primary-hover: #005eeb;
  --erp-color-tint: #eaf2fe;
  --erp-color-navy: #16243b;
  --erp-color-navy-soft: #1e3350;
  --erp-color-shell: #16243b;
  --erp-color-shell-hover: #1e3350;
  --erp-color-shell-text: #fff;
  --erp-color-summary: #1a2c56;
  --erp-color-tabs: #354157;
  --erp-color-menu: #1e2333;
  --erp-color-canvas: #f7f7f8;
  --erp-color-section: #e3ebf3;
  --erp-color-label: #f1f1f3;
  --erp-color-ink: #2e2f33;
  --erp-color-ink-strong: #172033;
  --erp-color-muted: #70737c;
  --erp-color-placeholder: #8b919b;
  --erp-color-line: #dfe0e3;
  --erp-color-danger: #e52222;
  --erp-color-danger-tint: #fff1f1;
  --erp-color-on-primary: #fff;
  --erp-color-disabled: #f4f4f5;
  --erp-color-success: #009632;
  --erp-color-success-tint: #d9ffe6;
  --erp-color-warning: #b45309;
  --erp-color-warning-tint: #fff7ed;
  --erp-color-selected: #eaf2fe;
  --erp-color-focus-ring: #0066ff2e;
  --erp-color-overlay: #0f172a7a;
  --erp-color-input: var(--erp-color-surface);
  --erp-color-input-focus: var(--erp-color-surface);
  --erp-color-input-border: var(--erp-color-line);
  --erp-color-input-focus-ring: #0066ff1f;
  --erp-color-search-focus-ring: #0066ff1a;
  --erp-color-search-option-hover: #2f6ce51f;
  --erp-color-search-option-active: #dbeafe;
  --erp-color-search-option-text: #1d4ed8;
  --erp-control-height: 32px;
  --erp-row-height: 34px;
  --erp-radius: 4px;
  --erp-section-radius: calc(var(--erp-radius) * 2);
  --ui-radius-control: var(--erp-radius);
  --erp-gap: 10px;
  --erp-field-padding-x: 10px;
  --erp-color-scheme: light;
}

:root[data-theme="dark"] {
  --erp-field-label-color: var(--erp-color-ink);
  --erp-popup-label-color: var(--erp-color-ink-strong);
  --erp-color-surface: #1f1f1f;
  --erp-color-primary: #4daafc;
  --erp-color-primary-hover: #75bdff;
  --erp-color-tint: #263442;
  --erp-color-navy: #e0e0e0;
  --erp-color-navy-soft: #ccc;
  --erp-color-shell: #181818;
  --erp-color-shell-hover: #2b2b2b;
  --erp-color-shell-text: #d7d7d7;
  --erp-color-summary: #252526;
  --erp-color-tabs: #181818;
  --erp-color-menu: #252526;
  --erp-color-canvas: #181818;
  --erp-color-section: #2b2b2b;
  --erp-color-label: #252526;
  --erp-color-ink: #ccc;
  --erp-color-ink-strong: #eee;
  --erp-color-muted: #a6a6a6;
  --erp-color-placeholder: #a0a0a0;
  --erp-color-line: #3c3c3c;
  --erp-color-danger: #f48771;
  --erp-color-danger-tint: #402825;
  --erp-color-on-primary: #101820;
  --erp-color-disabled: #252526;
  --erp-color-success: #89c997;
  --erp-color-success-tint: #25392c;
  --erp-color-warning: #dcca89;
  --erp-color-warning-tint: #3a3426;
  --erp-color-selected: #26445c;
  --erp-color-focus-ring: #4daafca6;
  --erp-color-overlay: #0009;
  --erp-color-scheme: dark;
  --erp-color-input: #2b2b2b;
  --erp-color-input-focus: #313131;
  --erp-color-input-border: #616161;
  --erp-color-input-focus-ring: #4daafc1f;
  --erp-color-search-focus-ring: #4daafc1a;
  --erp-color-search-option-hover: var(--erp-color-tint);
  --erp-color-search-option-active: var(--erp-color-selected);
  --erp-color-search-option-text: var(--erp-color-primary);
  --ui-grid-header-bg: #252526;
  --ui-grid-header-text: #eee;
  --ui-grid-original-value-bg: #3a3426;
  --ui-tab-list-bg: #181818;
  --ui-tab-active-bg: #26445c;
  --ui-tab-border: #616161;
  --ui-tab-separator: #616161;
  --ui-tab-active-indicator: #4daafc;
  --ui-grid-row-border: #333;
  --ui-grid-scrollbar: #686868;
  --ui-grid-scrollbar-hover: #858585;
  --ui-scrollbar-thumb: #686868;
  --ui-scrollbar-thumb-hover: #858585;
  --ui-tooltip-surface: #2b2b2b;
  --ui-tooltip-border: #616161;
  --ui-section-shadow: 0 1px 3px #0000003d;
  --erp-shortcut-search-bg: #d7ba7d;
  --erp-shortcut-search-hover-bg: #e2ca97;
  --erp-shortcut-search-text: #181818;
}

:root[data-theme="high-contrast"] {
  --erp-color-surface: #fff;
  --erp-color-primary: #0037b8;
  --erp-color-primary-hover: #002887;
  --erp-color-tint: #e8efff;
  --erp-color-navy: #101828;
  --erp-color-navy-soft: #1f2937;
  --erp-color-shell: #101828;
  --erp-color-shell-hover: #1f2937;
  --erp-color-shell-text: #fff;
  --erp-color-canvas: #fff;
  --erp-color-section: #edf2f7;
  --erp-color-label: #e5e7eb;
  --erp-color-ink: #111827;
  --erp-color-ink-strong: #000;
  --erp-color-muted: #374151;
  --erp-color-placeholder: #4b5563;
  --erp-color-line: #111827;
  --erp-color-danger: #b42318;
  --erp-color-danger-tint: #fff1f1;
  --erp-color-on-primary: #fff;
  --erp-color-disabled: #e5e7eb;
  --erp-color-success: #087443;
  --erp-color-success-tint: #dcfce7;
  --erp-color-warning: #8a3d00;
  --erp-color-warning-tint: #fff3b0;
  --erp-color-selected: #dbeafe;
  --erp-color-focus-ring: #0037b85c;
  --erp-color-overlay: #000000b8;
  --erp-color-input-focus-ring: #0037b81f;
  --erp-color-search-focus-ring: #0037b81a;
  --erp-color-search-option-hover: var(--erp-color-tint);
  --erp-color-search-option-active: var(--erp-color-selected);
  --erp-color-search-option-text: var(--erp-color-primary);
  --erp-color-scheme: light;
}

html:root {
  --ui-input-border: var(--erp-color-input-border);
  --ui-input-bg: var(--erp-color-input);
  --ui-input-text: var(--color-erp-ink);
  --ui-input-focus-bg: var(--erp-color-input-focus);
  --ui-input-placeholder: var(--erp-color-placeholder);
  --ui-input-focus-ring: var(--erp-color-input-focus-ring);
  --ui-search-option-hover-bg: var(--erp-color-search-option-hover);
  --ui-search-option-active-bg: var(--erp-color-search-option-active);
  --ui-search-option-active-text: var(--erp-color-search-option-text);
  --ui-input-focus-border: var(--color-erp-primary);
  --ui-input-disabled-bg: var(--color-erp-disabled);
  --ui-input-disabled-border: var(--color-erp-line);
  --ui-input-autofill-bg: var(--color-erp-disabled);
  --ui-button-border: var(--color-erp-line);
  --ui-button-radius: var(--erp-radius);
  --ui-button-text: var(--color-erp-ink);
  --ui-button-disabled-text: var(--color-erp-muted);
  --ui-button-hover-bg: var(--color-erp-tint);
  --ui-button-hover-border: var(--color-erp-primary);
  --ui-button-refresh-hover-bg: var(--color-erp-success-tint);
  --ui-button-refresh-hover-text: var(--color-erp-success);
  --ui-button-refresh-active-bg: var(--color-erp-success-tint);
  --ui-button-refresh-active-border: var(--color-erp-success);
  --ui-button-danger-hover-bg: var(--color-erp-danger-tint);
  --ui-button-danger-hover-text: var(--color-erp-danger);
  --ui-open-button-border: var(--color-erp-primary);
  --ui-open-button-bg: var(--color-erp-tint);
  --ui-open-button-hover-bg: var(--color-erp-selected);
  --ui-open-button-active-bg: var(--color-erp-selected);
  --ui-search-button-bg: var(--color-erp-primary);
  --ui-search-button-text: var(--color-erp-on-primary);
  --ui-combo-border: var(--erp-color-input-border);
  --ui-combo-bg: var(--erp-color-input);
  --ui-combo-text: var(--color-erp-ink);
  --ui-combo-focus-bg: var(--erp-color-input-focus);
  --ui-combo-focus-border: var(--color-erp-primary);
  --ui-combo-disabled-bg: var(--color-erp-disabled);
  --ui-combo-option-bg: var(--color-erp-surface);
  --ui-combo-option-checked-bg: var(--color-erp-selected);
  --ui-combo-arrow: var(--color-erp-muted);
  --ui-combo-arrow-disabled: var(--color-erp-placeholder);
  --ui-autocomplete-bg: var(--color-erp-surface);
  --ui-autocomplete-text: var(--color-erp-ink);
  --ui-autocomplete-scrollbar: var(--color-erp-muted);
  --ui-autocomplete-active-bg: var(--color-erp-selected);
  --ui-autocomplete-active-text: var(--color-erp-ink-strong);
  --ui-multiselect-border: var(--erp-color-input-border);
  --ui-multiselect-bg: var(--color-erp-surface);
  --ui-multiselect-hover-bg: var(--color-erp-tint);
  --ui-multiselect-separator: var(--color-erp-line);
  --ui-searchable-combo-box-hover-bg: var(--color-erp-tint);
  --ui-checkbox-border: var(--color-erp-muted);
  --ui-checkbox-bg: var(--color-erp-surface);
  --ui-checkbox-hover-bg: var(--color-erp-tint);
  --ui-checkbox-checked-bg: var(--color-erp-primary);
  --ui-checkbox-checked-mark: var(--color-erp-on-primary);
  --ui-checkbox-focus-ring: var(--color-erp-focus-ring);
  --ui-checkbox-disabled-bg: var(--color-erp-disabled);
  --ui-checkbox-disabled-border: var(--color-erp-line);
  --ui-checkbox-disabled-checked-bg: var(--color-erp-muted);
  --ui-option-border: var(--color-erp-muted);
  --ui-option-bg: var(--color-erp-surface);
  --ui-option-checked-bg: var(--color-erp-primary);
  --ui-option-focus-ring: var(--color-erp-focus-ring);
  --ui-section-bg: var(--color-erp-surface);
  --ui-section-border: var(--color-erp-line);
  --ui-section-radius: var(--erp-section-radius);
  --ui-section-shadow: 0 1px 2px #1717170f;
  --ui-section-heading-bg: var(--color-erp-section);
  --ui-section-heading-text: var(--color-erp-navy);
  --ui-section-heading-height: calc(var(--erp-row-height) - 1px);
  --ui-section-accent: var(--color-erp-primary);
  --ui-section-hover-bg: var(--color-erp-tint);
  --ui-section-muted: var(--color-erp-muted);
  --ui-field-row-height: var(--erp-row-height);
  --ui-field-label-bg: var(--color-erp-label);
  --ui-field-label-text: var(--erp-field-label-color, #5a5c63);
  --ui-field-padding-x: var(--erp-field-padding-x);
  --ui-field-control-height: calc(var(--erp-row-height) - 6px);
  --ui-toolbar-height: 40px;
  --ui-toolbar-gap: 3px;
  --ui-popup-bg: var(--color-erp-surface);
  --ui-popup-text: var(--color-erp-ink);
  --ui-popup-muted: var(--color-erp-muted);
  --ui-popup-border: var(--color-erp-line);
  --ui-popup-breadcrumb-bg: var(--color-erp-summary);
  --ui-popup-breadcrumb-text: var(--color-erp-shell-text);
  --ui-popup-close-bg: var(--color-erp-disabled);
  --ui-popup-close-hover-bg: var(--color-erp-tint);
  --ui-popup-primary: var(--color-erp-primary);
  --ui-popup-primary-hover: var(--color-erp-primary-hover);
  --ui-popup-on-primary: var(--color-erp-on-primary);
  --ui-popup-hover-bg: var(--color-erp-tint);
  --ui-popup-overlay: var(--color-erp-overlay);
  --ui-popup-action-height: var(--erp-control-height);
  --ui-form-control-bg: var(--erp-color-input);
  --ui-form-text: var(--color-erp-ink);
  --ui-form-label: var(--erp-popup-label-color, #000);
  --ui-form-muted: var(--color-erp-muted);
  --ui-form-border: var(--erp-color-input-border);
  --ui-form-border-hover: var(--color-erp-primary);
  --ui-form-focus: var(--color-erp-primary);
  --ui-form-focus-ring: var(--color-erp-focus-ring);
  --ui-form-inactive-bg: var(--color-erp-disabled);
  --ui-form-danger: var(--color-erp-danger);
  --ui-form-control-height: var(--erp-control-height);
  --ui-form-control-radius: var(--erp-radius);
  --ui-grid-surface: var(--color-erp-surface);
  --ui-grid-header-bg: var(--color-erp-canvas);
  --ui-grid-text: var(--color-erp-ink);
  --ui-grid-muted: var(--color-erp-muted);
  --ui-grid-border: var(--color-erp-line);
  --ui-grid-row-border: var(--color-erp-line);
  --ui-grid-primary: var(--color-erp-primary);
  --ui-grid-selected: var(--color-erp-selected);
  --ui-grid-active-bg: var(--erp-shortcut-search-bg, #f4c430);
  --ui-grid-active-text: var(--erp-shortcut-search-text, #1a1d22);
  --ui-grid-hover: var(--color-erp-selected);
  --ui-grid-disabled: var(--color-erp-disabled);
  --ui-grid-scrollbar: var(--color-erp-muted);
  --ui-grid-scrollbar-hover: var(--color-erp-ink);
  --ui-grid-on-primary: var(--color-erp-on-primary);
  --ui-grid-primary-hover: var(--color-erp-primary-hover);
  --ui-grid-tree-line: var(--color-erp-line);
  --ui-menu-surface: var(--color-erp-surface);
  --ui-menu-text: var(--color-erp-ink);
  --ui-menu-border: var(--color-erp-line);
  --ui-tooltip-surface: var(--color-erp-shell);
  --ui-tooltip-text: var(--color-erp-shell-text);
  --ui-tooltip-border: var(--color-erp-shell);
  --ui-surface: var(--color-erp-surface);
  --ui-text: var(--color-erp-ink);
  --ui-muted: var(--color-erp-muted);
  --ui-border: var(--color-erp-line);
  --ui-canvas: var(--color-erp-canvas);
  --ui-selected: var(--color-erp-selected);
  --ui-primary: var(--color-erp-primary);
  --ui-primary-hover: var(--color-erp-primary-hover);
  --ui-on-primary: var(--color-erp-on-primary);
  --ui-danger: var(--color-erp-danger);
  --ui-danger-tint: var(--color-erp-danger-tint);
  --ui-success: var(--color-erp-success);
  --ui-success-tint: var(--color-erp-success-tint);
}

.erp-page-heading {
  display: none;
}

@font-face {
  font-family: Malgun Gothic;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local(Malgun Gothic), local(맑은 고딕);
}

@font-face {
  font-family: Malgun Gothic;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local(Malgun Gothic Bold), local(맑은 고딕 Bold), local(Malgun Gothic);
}

@font-face {
  font-family: Malgun Gothic Bold;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local(Malgun Gothic Bold), local(맑은 고딕 Bold);
}

@font-face {
  font-family: Malgun Gothic Bold;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local(Malgun Gothic Bold), local(맑은 고딕 Bold);
}

html {
  font-size: var(--app-font-size, 12px);
}

html, body, #root {
  background-color: var(--color-erp-canvas);
  font-family: var(--default-font-family);
  margin: 0;
  padding: 0;
}

body, #root {
  font-size: 1rem;
}

b, strong, h1, h2 {
  font-family: var(--default-font-family-bold);
}

:root {
  --app-font-size: 14px;
  --app-font-weight-bold: bold;
  --social-bg: #f4f3ec80;
  --shadow: #0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;
  --sans: system-ui, "Segoe UI", Roboto, sans-serif;
  --heading: system-ui, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, Consolas, monospace;
  --default: "Malgun Gothic", sans-serif;
  --default-font-family-a: "NanumSquareNeoLight", serif;
  --font-erp: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", 
  Roboto, "Helvetica Neue", Arial, "Noto Sans KR", "Malgun Gothic", 
  sans-serif;
  --font-erp-mono: "D2Coding", "JetBrains Mono", Consolas, Monaco, monospace;
  --default-font-family: var(--default);
  --default-font-family-bold: "Malgun Gothic Bold", "맑은 고딕 Bold", "Malgun Gothic", sans-serif;
  --main-bottom-bar-height: 38px;
  --main-top-bar-height: 50px;
  --main-top-bar-padding: 0px;
  --main-header-height: calc(var(--main-top-bar-padding) + var(--main-top-bar-height));
  --main-content-top-gap: 12px;
  --main-content-bottom-gap: 8px;
  letter-spacing: normal;
  font-kerning: auto;
  color-scheme: var(--erp-color-scheme, light);
  color: var(--text);
  background: var(--bg);
  font-synthesis: none;
  text-rendering: geometricprecision;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: auto;
}

@media (prefers-color-scheme: dark) {
  :root {
    --text: #9ca3af;
    --text-h: #f3f4f6;
    --bg: #16171d;
    --border: #2e303a;
    --code-bg: #1f2028;
    --accent: #c084fc;
    --accent-bg: #c084fc26;
    --accent-border: #c084fc80;
    --social-bg: #2f303a80;
    --shadow: #0006 0 10px 15px -3px, #00000040 0 4px 6px -2px;
  }

  #social .button-icon {
    filter: invert() brightness(2);
  }
}

#root {
  text-align: center;
  flex-direction: column;
  width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 100svh;
  margin: 0 auto;
  display: flex;
}

#root .simple-editor-wrapper, #root .simple-editor-wrapper .tiptap.ProseMirror, #root .simple-editor-wrapper .source {
  text-align: left;
}

body {
  margin: 0;
}

h1, h2 {
  font-weight: var(--app-font-weight-bold);
  color: var(--text-h);
}

h1 {
  letter-spacing: -1.68px;
  margin: 32px 0;
  font-size: 56px;
}

@media (max-width: 1024px) {
  h1 {
    margin: 20px 0;
    font-size: 36px;
  }
}

h2 {
  letter-spacing: -.24px;
  margin: 0 0 8px;
  font-size: 24px;
  line-height: 118%;
}

@media (max-width: 1024px) {
  h2 {
    font-size: 20px;
  }
}

p {
  margin: 0;
}

code, .counter {
  color: var(--text-h);
  border-radius: 4px;
  display: inline-flex;
}

code {
  background: var(--code-bg);
  padding: 4px 8px;
  font-size: 15px;
  line-height: 135%;
}

.button {
  background: var(--accent-bg);
  color: var(--accent);
  border: 1px solid var(--accent-border);
  cursor: pointer;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  display: inline-flex;
}

.main-content {
  width: 100%;
  height: calc(100vh - var(--main-header-height) - var(--main-bottom-bar-height));
  box-sizing: border-box;
  min-height: 0;
  padding-top: var(--main-content-top-gap);
  padding-bottom: var(--main-content-bottom-gap);
  overflow: hidden;
}

.scrollHidden {
  -ms-overflow-style: none;
  scrollbar-width: none;
  overflow: auto;
}

.scrollHidden::-webkit-scrollbar {
  display: none;
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-divide-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-ordinal {
  syntax: "*";
  inherits: false
}

@property --tw-slashed-zero {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-figure {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@property --tw-ease {
  syntax: "*";
  inherits: false
}