/*! vfunc-ui (vfunc.js layer 2) v1.2.0 | Apache-2.0 | (c) 2026 vidkid | https://github.com/vidkid-indy/vfunc */
/* IE11: fixed light theme values (no dark theme, no token overrides), left to right.
   Customize with rules in your own CSS loaded after this file. */

.vf-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@keyframes vf-spin {
  to { transform: rotate(360deg); }
}

[data-vf-scroll-lock] { overflow: hidden; }
[data-vf-scroll-lock] body { overflow: hidden; }

.vf-accordion {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  color: #0f172a;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.vf-accordion__item + .vf-accordion__item { border-top: 1px solid #e2e8f0; }

.vf-accordion__heading { margin: 0; font-size: inherit; }

.vf-accordion__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 16px; padding-right: 16px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.vf-accordion__trigger::after {
  content: "";
  flex: none;
  width: 0.5em;
  height: 0.5em;
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.15s ease;
}

.vf-accordion__trigger[aria-expanded="true"]::after { transform: rotate(-135deg); }
.vf-accordion__trigger:hover { background: #f1f5f9; }
.vf-accordion__trigger:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-accordion__trigger:disabled { color: #94a3b8; cursor: not-allowed; }

.vf-accordion__panel {
  padding-top: 0; padding-bottom: 16px;
  padding-left: 16px; padding-right: 16px;
}

.vf-accordion__panel[hidden] { display: none; }

@media (prefers-reduced-motion: reduce) {
  .vf-accordion__trigger::after { transition: none; }
}

.vf-alert {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 16px; padding-right: 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid transparent;
  border-left: 2px solid #2563eb;
  border-radius: 6px;
}

.vf-alert[data-variant="success"] { color: #047857; background: #ecfdf5; border-left-color: #059669; }
.vf-alert[data-variant="warning"] { color: #b45309; background: #fffbeb; border-left-color: #d97706; }
.vf-alert[data-variant="danger"] { color: #b91c1c; background: #fef2f2; border-left-color: #dc2626; }

.vf-alert__body { flex: 1; min-width: 0; }
.vf-alert__title { margin: 0; font-weight: 600; }
.vf-alert__message > :first-child { margin-top: 0; }
.vf-alert__message > :last-child { margin-bottom: 0; }

.vf-alert__dismiss {
  flex: none;
  padding: 0;
  width: 1.5em;
  height: 1.5em;
  font: inherit;
  font-size: 16px;
  line-height: 1;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}

.vf-alert__dismiss:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-avatar {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 2.5em;
  height: 2.5em;
  overflow: hidden;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #2563eb;
  background: #eff6ff;
  border-radius: 9999px;
}

.vf-avatar[data-size="sm"] { font-size: 12px; }
.vf-avatar[data-size="lg"] { font-size: 20px; }

.vf-avatar__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.vf-badge,
.vf-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding-top: 0; padding-bottom: 0;
  padding-left: 8px; padding-right: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
  color: #0f172a;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 9999px;
}

.vf-badge__dot {
  width: 0.5em;
  height: 0.5em;
  background: currentColor;
  border-radius: 9999px;
}

.vf-badge[data-variant="primary"],
.vf-tag[data-variant="primary"] { color: #2563eb; background: #eff6ff; border-color: transparent; }
.vf-badge[data-variant="success"],
.vf-tag[data-variant="success"] { color: #047857; background: #ecfdf5; border-color: transparent; }
.vf-badge[data-variant="warning"],
.vf-tag[data-variant="warning"] { color: #b45309; background: #fffbeb; border-color: transparent; }
.vf-badge[data-variant="danger"],
.vf-tag[data-variant="danger"] { color: #b91c1c; background: #fef2f2; border-color: transparent; }
.vf-badge[data-variant="info"],
.vf-tag[data-variant="info"] { color: #1d4ed8; background: #eff6ff; border-color: transparent; }

.vf-breadcrumb {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 13px;
  line-height: 1.5;
}

.vf-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.vf-breadcrumb__item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #475569;
}

.vf-breadcrumb__item + .vf-breadcrumb__item::before {
  content: "/";
  color: #cbd5e1;
}

.vf-breadcrumb__link {
  color: #2563eb;
  text-decoration: none;
  border-radius: 4px;
}

.vf-breadcrumb__link:hover { text-decoration: underline; }
.vf-breadcrumb__link:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-breadcrumb__current[aria-current="page"] { color: #0f172a; font-weight: 600; }

.vf-button-group {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}

.vf-button-group[data-attached="true"] { gap: 0; flex-wrap: nowrap; }
.vf-button-group[data-attached="true"] > .vf-button { border-radius: 0; }
.vf-button-group[data-attached="true"] > .vf-button + .vf-button { margin-left: -1px; }
.vf-button-group[data-attached="true"] > .vf-button:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.vf-button-group[data-attached="true"] > .vf-button:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.vf-button-group[data-attached="true"] > .vf-button:focus-visible { position: relative; }

.vf-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding-top: 8px; padding-bottom: 8px;
  padding-left: 16px; padding-right: 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.vf-button:hover { background: #f1f5f9; }
.vf-button:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-button[data-size="sm"] {
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 12px; padding-right: 12px;
  font-size: 13px;
}

.vf-button[data-size="lg"] {
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 24px; padding-right: 24px;
  font-size: 16px;
}

.vf-button[data-variant="primary"] {
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}
.vf-button[data-variant="primary"]:hover { background: #1d4ed8; border-color: #1d4ed8; }

.vf-button[data-variant="danger"] {
  color: #ffffff;
  background: #dc2626;
  border-color: #dc2626;
}
.vf-button[data-variant="danger"]:hover { background: #b91c1c; border-color: #b91c1c; }

.vf-button[data-variant="ghost"] {
  background: transparent;
  border-color: transparent;
}
.vf-button[data-variant="ghost"]:hover { background: #f1f5f9; }

.vf-button:disabled {
  color: #94a3b8;
  background: #f1f5f9;
  border-color: #e2e8f0;
  cursor: not-allowed;
}

.vf-button[aria-busy="true"] { cursor: progress; }

.vf-button__spinner {
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 9999px;
  animation: vf-spin 0.8s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .vf-button__spinner { animation-duration: 2.4s; }
}

.vf-card {
  display: flex;
  flex-direction: column;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.vf-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-top: 16px; padding-bottom: 0;
  padding-left: 24px; padding-right: 24px;
}

.vf-card__heading { min-width: 0; }

.vf-card__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.vf-card__subtitle {
  margin: 0;
  font-size: 13px;
  color: #475569;
}

.vf-card__actions { display: flex; flex: none; gap: 8px; }

.vf-card__body {
  flex: 1;
  padding-top: 16px; padding-bottom: 16px;
  padding-left: 24px; padding-right: 24px;
}

.vf-card__footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 24px; padding-right: 24px;
  border-top: 1px solid #e2e8f0;
}

.vf-carousel {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  color: #0f172a;
}

.vf-carousel__slides {
  overflow: hidden;
  background: #f1f5f9;
  border-radius: 10px;
}

.vf-carousel__slide[hidden] { display: none; }
.vf-carousel__image { display: block; width: 100%; height: auto; }

.vf-carousel__controls {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  order: 2;
}

.vf-carousel__prev,
.vf-carousel__next,
.vf-carousel__rotation {
  min-width: 2.25em;
  height: 2.25em;
  padding-top: 0; padding-bottom: 0;
  padding-left: 8px; padding-right: 8px;
  font: inherit;
  font-size: 13px;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
}

.vf-carousel__rotation { margin-right: auto; }

.vf-carousel__prev:hover,
.vf-carousel__next:hover,
.vf-carousel__rotation:hover { background: #f1f5f9; }

.vf-carousel__prev:focus-visible,
.vf-carousel__next:focus-visible,
.vf-carousel__rotation:focus-visible,
.vf-carousel__dot:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-carousel__prev:disabled,
.vf-carousel__next:disabled { color: #94a3b8; cursor: not-allowed; }

.vf-carousel__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  order: 1;
}

.vf-carousel__dot {
  width: 0.625em;
  height: 0.625em;
  padding: 0;
  background: #cbd5e1;
  border: 0;
  border-radius: 9999px;
  cursor: pointer;
}

.vf-carousel__dot[aria-current="true"] { background: #2563eb; }

.vf-chart {
  position: relative;
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  color: #0f172a;
}

.vf-chart__svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.vf-chart [data-series="0"] { color: #2563eb; }
.vf-chart [data-series="1"] { color: #d97706; }
.vf-chart [data-series="2"] { color: #059669; }
.vf-chart [data-series="3"] { color: #dc2626; }
.vf-chart [data-series="4"] { color: #7c3aed; }
.vf-chart [data-series="5"] { color: #0891b2; }
.vf-chart [data-series="6"] { color: #db2777; }
.vf-chart [data-series="7"] { color: #65a30d; }

.vf-chart__gridline { stroke: #e2e8f0; stroke-width: 1; }
.vf-chart__tick,
.vf-chart__label { fill: #475569; font-size: 12px; }

.vf-chart__bar,
.vf-chart__slice,
.vf-chart__point { fill: currentColor; }
.vf-chart__slice { stroke: #ffffff; stroke-width: 1; }
.vf-chart__point { stroke: #ffffff; stroke-width: 2; }
.vf-chart__line { fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.vf-chart__area { fill: currentColor; opacity: 0.15; }

.vf-chart__mark[tabindex] { cursor: pointer; outline: none; }
.vf-chart__mark[tabindex]:hover,
.vf-chart__mark[tabindex]:focus { opacity: 0.8; stroke: #3b82f6; stroke-width: 2; }

.vf-chart[data-animate] .vf-chart__mark,
.vf-chart[data-animate] .vf-chart__line,
.vf-chart[data-animate] .vf-chart__area { animation: vf-chart-in 0.2s ease; }

@keyframes vf-chart-in {
  from { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .vf-chart[data-animate] .vf-chart__mark,
  .vf-chart[data-animate] .vf-chart__line,
  .vf-chart[data-animate] .vf-chart__area { animation: none; }
}

.vf-chart__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin: 0;
  margin-top: 8px;
  padding: 0;
  list-style: none;
  font-size: 13px;
}

.vf-chart__entry,
.vf-chart__toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.vf-chart__toggle {
  padding-top: 0; padding-bottom: 0;
  padding-left: 4px; padding-right: 4px;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}

.vf-chart__toggle[aria-pressed="false"] { color: #94a3b8; text-decoration: line-through; }
.vf-chart__toggle:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-chart__swatch {
  width: 0.75em;
  height: 0.75em;
  background: currentColor;
  border-radius: 4px;
}

.vf-chart__toggle[aria-pressed="false"] .vf-chart__swatch { opacity: 0.3; }

.vf-chart__tooltip {
  position: absolute;
  z-index: 1100;
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 8px; padding-right: 8px;
  font-size: 12px;
  white-space: nowrap;
  color: #ffffff;
  background: #0f172a;
  border-radius: 4px;
  box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1);
  pointer-events: none;
  transform: translate(-50%, -110%);
}

.vf-chart__tooltip[hidden] { display: none; }

.vf-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
  cursor: pointer;
}

.vf-check__input {
  flex: none;
  width: 1.1em;
  height: 1.1em;
  margin: 0;
  accent-color: #2563eb;
  cursor: pointer;
}

.vf-check__input:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-check__input[aria-invalid="true"] { outline: 1px solid #dc2626; }

.vf-check__input:disabled,
.vf-check__input:disabled + .vf-check__label {
  color: #94a3b8;
  cursor: not-allowed;
}

.vf-chips-input {
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 8px; padding-right: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
}

.vf-chips-input:focus-within { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-chips-input[data-state="disabled"] { background: #f1f5f9; }

.vf-chips-input__list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.vf-chips-input__chip { display: inline-flex; }

.vf-chips-input__input {
  flex: 1;
  min-width: 6em;
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 4px; padding-right: 4px;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  outline: none;
}

.vf-chips-input__input[aria-invalid="true"] { color: #b91c1c; }

.vf-date-range__inputs {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px;
}

.vf-date-range__part {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 4px;
  min-width: 10em;
}

.vf-date-range__label {
  font-size: 12px;
  color: #475569;
}

.vf-date-range__separator {
  padding-bottom: 8px;
  color: #475569;
}

.vf-descriptions {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
}

.vf-descriptions__title {
  margin-top: 0; margin-bottom: 8px;
  font-weight: 600;
}

.vf-descriptions__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px 24px;
  margin: 0;
}

.vf-descriptions__item { min-width: 0; }

.vf-descriptions__label {
  font-size: 13px;
  color: #475569;
}

.vf-descriptions__value {
  margin: 0;
  overflow-wrap: anywhere;
}

@media (min-width: 40em) {
  .vf-descriptions[data-columns="2"] .vf-descriptions__list { grid-template-columns: repeat(2, 1fr); }
  .vf-descriptions[data-columns="3"] .vf-descriptions__list { grid-template-columns: repeat(3, 1fr); }
  .vf-descriptions[data-columns="4"] .vf-descriptions__list { grid-template-columns: repeat(4, 1fr); }
}

.vf-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding-top: 48px; padding-bottom: 48px;
  padding-left: 24px; padding-right: 24px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  text-align: center;
  color: #475569;
}

.vf-empty-state__icon { font-size: 24px; }

.vf-empty-state__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: #0f172a;
}

.vf-empty-state__description { margin: 0; }
.vf-empty-state__action { margin-top: 12px; }

.vf-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.vf-field__label {
  padding: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #0f172a;
}

.vf-field__required {
  margin-left: 4px;
  color: #b91c1c;
}

.vf-field__hint,
.vf-field__error {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

.vf-field__hint { color: #475569; }
.vf-field__error { color: #b91c1c; }

.vf-radio-group__options {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.vf-radio-group[data-direction="horizontal"] .vf-radio-group__options {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
}

.vf-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
}

.vf-grid__scroll { overflow: auto; }
.vf-grid__scroll[data-height] .vf-table { overflow: visible; }
.vf-grid__scroll[data-height] .vf-table__head {
  position: sticky;
  top: 0;
  z-index: 1;
}

.vf-grid__check {
  width: 1em;
  height: 1em;
  margin: 0;
  accent-color: #2563eb;
  cursor: pointer;
}

.vf-grid__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.vf-grid__range {
  margin: 0;
  font-size: 13px;
  color: #475569;
  font-variant-numeric: tabular-nums;
}

.vf-input,
.vf-textarea,
.vf-select {
  box-sizing: border-box;
  width: 100%;
  padding-top: 8px; padding-bottom: 8px;
  padding-left: 12px; padding-right: 12px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.vf-textarea { resize: vertical; }
.vf-select[multiple] { padding-top: 4px; padding-bottom: 4px; }

.vf-input::placeholder,
.vf-textarea::placeholder { color: #475569; }

.vf-input:focus,
.vf-textarea:focus,
.vf-select:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35);
}

.vf-input[data-size="sm"],
.vf-textarea[data-size="sm"],
.vf-select[data-size="sm"] {
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 8px; padding-right: 8px;
  font-size: 13px;
}

.vf-input[data-size="lg"],
.vf-textarea[data-size="lg"],
.vf-select[data-size="lg"] {
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 16px; padding-right: 16px;
  font-size: 16px;
}

.vf-input[aria-invalid="true"],
.vf-textarea[aria-invalid="true"],
.vf-select[aria-invalid="true"] { border-color: #dc2626; }

.vf-input:disabled,
.vf-textarea:disabled,
.vf-select:disabled {
  color: #94a3b8;
  background: #f1f5f9;
  cursor: not-allowed;
}

.vf-input[readonly],
.vf-textarea[readonly] { background: #f1f5f9; }

.vf-list-view {
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.vf-list-view__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 16px; padding-right: 16px;
}

.vf-list-view__item + .vf-list-view__item { border-top: 1px solid #e2e8f0; }

.vf-list-view__item[role="option"] { cursor: pointer; }
.vf-list-view__item[role="option"]:hover { background: #f1f5f9; }
.vf-list-view__item[role="option"]:focus-visible { outline: none; box-shadow: inset 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-list-view__item[aria-selected="true"] { background: #eff6ff; }

.vf-list-view__title { font-weight: 600; }
.vf-list-view__description,
.vf-list-view__meta { font-size: 13px; color: #475569; }

.vf-list-view[data-state="empty"] { border-style: dashed; }

.vf-dropdown,
.vf-split-button { position: relative; display: inline-flex; }

.vf-menu {
  position: fixed;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  min-width: 10em;
  max-width: 20em;
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 0; padding-right: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1);
}

.vf-menu[hidden] { display: none; }
.vf-menu[data-placement="bottom"],
.vf-popover__panel[data-placement="bottom"] { margin-top: 4px; }
.vf-menu[data-placement="top"],
.vf-popover__panel[data-placement="top"] { margin-top: calc(4px * -1); }

.vf-menu__item {
  display: block;
  width: 100%;
  padding-top: 8px; padding-bottom: 8px;
  padding-left: 12px; padding-right: 12px;
  font: inherit;
  text-align: left;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.vf-menu__item:hover,
.vf-menu__item:focus { outline: none; background: #f1f5f9; }
.vf-menu__item[data-variant="danger"] { color: #b91c1c; }
.vf-menu__item[aria-disabled="true"] { color: #94a3b8; cursor: not-allowed; }

.vf-menu__separator {
  margin-top: 4px; margin-bottom: 4px;
  border-top: 1px solid #e2e8f0;
}

.vf-split-button > .vf-button:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.vf-split-button > .vf-split-button__toggle {
  margin-left: -1px;
  padding-left: 8px; padding-right: 8px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.vf-split-button > .vf-button:focus-visible { position: relative; }

.vf-split-button__caret {
  width: 0.4em;
  height: 0.4em;
  margin-bottom: 0.2em;
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}

.vf-modal {
  position: fixed;
  top: 0; bottom: 0;
  left: 0; right: 0;
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  color: #0f172a;
}

.vf-modal__backdrop {
  position: absolute;
  top: 0; bottom: 0;
  left: 0; right: 0;
  background: rgba(15, 23, 42, 0.5);
}

.vf-modal__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
  max-width: 32em;
  max-height: 100%;
  overflow: hidden;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 10px 15px -3px rgba(15, 23, 42, 0.12), 0 4px 6px -4px rgba(15, 23, 42, 0.1);
}

.vf-modal[data-size="sm"] .vf-modal__dialog { max-width: 24em; }
.vf-modal[data-size="lg"] .vf-modal__dialog { max-width: 48em; }
.vf-modal__dialog:focus-visible { outline: none; box-shadow: 0 10px 15px -3px rgba(15, 23, 42, 0.12), 0 4px 6px -4px rgba(15, 23, 42, 0.1), 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-modal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-top: 16px; padding-bottom: 0;
  padding-left: 24px; padding-right: 24px;
}

.vf-modal__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.vf-modal__close {
  flex: none;
  margin-left: auto;
  padding: 0;
  width: 2em;
  height: 2em;
  font: inherit;
  font-size: 16px;
  line-height: 1;
  color: #475569;
  background: transparent;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}

.vf-modal__close:hover { color: #0f172a; background: #f1f5f9; }
.vf-modal__close:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-modal__body {
  flex: 1;
  overflow: auto;
  padding-top: 16px; padding-bottom: 16px;
  padding-left: 24px; padding-right: 24px;
  line-height: 1.5;
}

.vf-modal__footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 24px; padding-right: 24px;
  border-top: 1px solid #e2e8f0;
}

.vf-confirm__message { margin: 0; }

.vf-drawer { padding: 0; justify-content: flex-end; align-items: stretch; z-index: 1200; }
.vf-drawer[data-side="start"] { justify-content: flex-start; }
.vf-drawer[data-side="bottom"] { flex-direction: column; justify-content: flex-end; }
.vf-drawer .vf-modal__dialog { max-width: 24em; border-radius: 0; }
.vf-drawer[data-size="sm"] .vf-modal__dialog { max-width: 18em; }
.vf-drawer[data-size="lg"] .vf-modal__dialog { max-width: 40em; }
.vf-drawer[data-side="bottom"] .vf-modal__dialog { max-width: none; max-height: 80%; }

.vf-number-input,
.vf-search-input,
.vf-password-input {
  box-sizing: border-box;
  display: flex;
  align-items: stretch;
  width: 100%;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.vf-number-input:focus-within,
.vf-search-input:focus-within,
.vf-password-input:focus-within {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35);
}

.vf-number-input[data-size="sm"],
.vf-search-input[data-size="sm"],
.vf-password-input[data-size="sm"] { font-size: 13px; }

.vf-number-input[data-size="lg"],
.vf-search-input[data-size="lg"],
.vf-password-input[data-size="lg"] { font-size: 16px; }

.vf-number-input__input,
.vf-search-input__input,
.vf-password-input__input {
  flex: 1;
  min-width: 0;
  padding-top: 8px; padding-bottom: 8px;
  padding-left: 12px; padding-right: 12px;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  outline: none;
}

.vf-number-input__input { text-align: center; -moz-appearance: textfield; }
.vf-number-input__input::-webkit-inner-spin-button,
.vf-number-input__input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; }
.vf-search-input__input::-webkit-search-cancel-button { -webkit-appearance: none; }

.vf-number-input__input[aria-invalid="true"],
.vf-search-input__input[aria-invalid="true"],
.vf-password-input__input[aria-invalid="true"] { color: #b91c1c; }

.vf-number-input__step,
.vf-search-input__clear,
.vf-password-input__toggle {
  flex: none;
  padding-top: 0; padding-bottom: 0;
  padding-left: 12px; padding-right: 12px;
  font: inherit;
  color: #475569;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.vf-number-input__step:hover,
.vf-search-input__clear:hover,
.vf-password-input__toggle:hover { color: #0f172a; background: #f1f5f9; }

.vf-number-input__step:focus-visible,
.vf-search-input__clear:focus-visible,
.vf-password-input__toggle:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-number-input__step:disabled,
.vf-password-input__toggle:disabled {
  color: #94a3b8;
  background: transparent;
  cursor: not-allowed;
}

.vf-number-input__step:first-child { border-right: 1px solid #e2e8f0; }
.vf-number-input__step:last-child { border-left: 1px solid #e2e8f0; }

.vf-password-input__toggle {
  font-size: 13px;
  font-weight: 600;
}

.vf-search-input__clear[hidden] { display: none; }

.vf-number-input:has(:disabled),
.vf-search-input:has(:disabled),
.vf-password-input:has(:disabled) { background: #f1f5f9; }

.vf-pagination { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif; }

.vf-pagination__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.vf-pagination__button {
  min-width: 2.25em;
  height: 2.25em;
  padding-top: 0; padding-bottom: 0;
  padding-left: 8px; padding-right: 8px;
  font: inherit;
  font-size: 13px;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}

.vf-pagination__button:hover { background: #f1f5f9; }
.vf-pagination__button:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-pagination__button[aria-current="page"] {
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}

.vf-pagination__button:disabled {
  color: #94a3b8;
  background: transparent;
  cursor: not-allowed;
}

.vf-pagination__gap {
  padding-left: 4px; padding-right: 4px;
  color: #475569;
}

.vf-popover { position: relative; display: inline-flex; }

.vf-popover__panel {
  position: fixed;
  z-index: 1100;
  box-sizing: border-box;
  width: max-content;
  max-width: 22em;
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 16px; padding-right: 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 13px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1);
}

.vf-popover__panel[hidden] { display: none; }
.vf-popover__panel:focus-visible { outline: none; box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1), 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-popover__header {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.vf-popover__title { margin: 0; font-weight: 600; }

.vf-popover__close {
  flex: none;
  margin-left: auto;
  padding: 0;
  width: 1.5em;
  height: 1.5em;
  font: inherit;
  font-size: 14px;
  line-height: 1;
  color: #475569;
  background: transparent;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}

.vf-popover__close:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-popover__body { margin-top: 4px; }

.vf-progress {
  display: block;
  width: 100%;
  height: 0.5em;
  overflow: hidden;
  color: #2563eb;
  background: #f1f5f9;
  border: 0;
  border-radius: 9999px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.vf-progress::-webkit-progress-bar { background: #f1f5f9; }
.vf-progress::-webkit-progress-value { background: #2563eb; border-radius: 9999px; }
.vf-progress::-moz-progress-bar { background: #2563eb; border-radius: 9999px; }

.vf-progress__row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.vf-progress__value {
  flex: none;
  font-size: 13px;
  color: #475569;
  font-variant-numeric: tabular-nums;
}

.vf-rating__stars,
.vf-rating[data-readonly="true"] {
  display: inline-flex;
  gap: 4px;
}

.vf-rating__item {
  position: relative;
  display: inline-flex;
  cursor: pointer;
}

.vf-rating__star {
  font-size: 20px;
  line-height: 1;
  color: #cbd5e1;
  transition: color 0.15s ease;
}

.vf-rating[data-readonly="true"] .vf-rating__star { font-size: 14px; }
.vf-rating__star[data-state="on"] { color: #d97706; }
.vf-rating__item:hover .vf-rating__star { color: #d97706; }
.vf-rating__input:focus-visible + .vf-rating__star { border-radius: 4px; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-rating__input:disabled + .vf-rating__star { opacity: 0.5; }
.vf-rating__item:has(:disabled) { cursor: not-allowed; }

.vf-select-button {
  display: inline-flex;
  flex-wrap: wrap;
}

.vf-select-button__option {
  padding-top: 8px; padding-bottom: 8px;
  padding-left: 16px; padding-right: 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 0;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.vf-select-button__option + .vf-select-button__option { margin-left: -1px; }
.vf-select-button__option:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
.vf-select-button__option:last-of-type { border-top-right-radius: 6px; border-bottom-right-radius: 6px; }

.vf-select-button__option:hover { background: #f1f5f9; }
.vf-select-button__option:focus-visible { position: relative; outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-select-button__option[aria-pressed="true"] {
  position: relative;
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}

.vf-select-button__option:disabled {
  color: #94a3b8;
  background: #f1f5f9;
  cursor: not-allowed;
}

.vf-select-button[data-size="sm"] .vf-select-button__option {
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 12px; padding-right: 12px;
  font-size: 13px;
}

.vf-select-button[data-size="lg"] .vf-select-button__option {
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 24px; padding-right: 24px;
  font-size: 16px;
}

.vf-skeleton {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.vf-skeleton__line {
  display: block;
  height: 1em;
  background: #f1f5f9;
  border-radius: 4px;
  animation: vf-skeleton-pulse 1.5s ease infinite;
}

.vf-skeleton[data-variant="text"] .vf-skeleton__line:last-child:not(:first-child) { width: 60%; }
.vf-skeleton[data-variant="rect"] .vf-skeleton__line { height: 8em; border-radius: 6px; }
.vf-skeleton[data-variant="circle"] { display: inline-flex; }
.vf-skeleton[data-variant="circle"] .vf-skeleton__line { width: 2.5em; height: 2.5em; border-radius: 9999px; }

@keyframes vf-skeleton-pulse {
  50% { opacity: 0.5; }
}

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

.vf-slider {
  width: 100%;
  margin: 0;
  accent-color: #2563eb;
  cursor: pointer;
}

.vf-slider:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); border-radius: 4px; }
.vf-slider:disabled { cursor: not-allowed; opacity: 0.5; }

.vf-sparkline {
  display: inline-block;
  width: 6em;
  height: 1.5em;
  overflow: visible;
  color: #2563eb;
  vertical-align: middle;
}

.vf-sparkline__line {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linejoin: round;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

.vf-sparkline__bar { fill: currentColor; }

.vf-spinner {
  display: inline-flex;
  align-items: center;
  font-size: 16px;
  color: #2563eb;
}

.vf-spinner[data-size="sm"] { font-size: 13px; }
.vf-spinner[data-size="lg"] { font-size: 24px; }

.vf-spinner__circle {
  display: block;
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 9999px;
  animation: vf-spin 0.8s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .vf-spinner__circle { animation-duration: 2.4s; }
}

.vf-stat-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 16px; padding-bottom: 16px;
  padding-left: 24px; padding-right: 24px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.vf-stat-card__label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 13px;
  color: #475569;
}

.vf-stat-card__value {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
}

.vf-stat-card__delta {
  margin: 0;
  font-size: 13px;
  color: #475569;
}

.vf-stat-card__delta[data-trend="up"] .vf-stat-card__change { color: #047857; }
.vf-stat-card__delta[data-trend="down"] .vf-stat-card__change { color: #b91c1c; }
.vf-stat-card__change { font-weight: 600; }

.vf-stat-card__description {
  margin: 0;
  font-size: 13px;
  color: #475569;
}

.vf-stepper {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 13px;
  color: #475569;
}

.vf-stepper__step { flex: 1; min-width: 8em; }

.vf-stepper__button {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  padding: 0;
  font: inherit;
  text-align: left;
  color: inherit;
  background: transparent;
  border: 0;
}

button.vf-stepper__button { cursor: pointer; border-radius: 4px; }
button.vf-stepper__button:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-stepper__marker {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 1.75em;
  height: 1.75em;
  font-weight: 600;
  color: #475569;
  background: #ffffff;
  border: 2px solid #cbd5e1;
  border-radius: 9999px;
}

.vf-stepper__text { display: flex; flex-direction: column; padding-top: 4px; }
.vf-stepper__label { font-weight: 600; }
.vf-stepper__description { font-size: 12px; }

.vf-stepper__step[data-state="current"] { color: #0f172a; }
.vf-stepper__step[data-state="current"] .vf-stepper__marker { color: #2563eb; border-color: #2563eb; }
.vf-stepper__step[data-state="complete"] .vf-stepper__marker {
  color: #ffffff;
  background: #2563eb;
  border-color: #2563eb;
}

.vf-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
  cursor: pointer;
}

.vf-switch__input {
  position: absolute;
  left: 0;
  top: 0;
  width: 2.25em;
  height: 1.25em;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.vf-switch__track {
  position: relative;
  flex: none;
  width: 2.25em;
  height: 1.25em;
  background: #cbd5e1;
  border-radius: 9999px;
  transition: background-color 0.15s ease;
}

.vf-switch__track::after {
  content: "";
  position: absolute;
  top: 0.125em;
  left: 0.125em;
  width: 1em;
  height: 1em;
  background: #ffffff;
  border-radius: 9999px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  transition: transform 0.15s ease;
}

.vf-switch__input:checked + .vf-switch__track { background: #2563eb; }
.vf-switch__input:checked + .vf-switch__track::after { transform: translateX(1em); }
[dir="rtl"] .vf-switch__input:checked + .vf-switch__track::after { transform: translateX(-1em); }
.vf-switch__input:focus-visible + .vf-switch__track { box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-switch__input:disabled + .vf-switch__track { opacity: 0.5; }
.vf-switch__input:disabled,
.vf-switch__input:disabled ~ .vf-switch__label {
  color: #94a3b8;
  cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
  .vf-switch__track,
  .vf-switch__track::after { transition: none; }
}

.vf-table {
  overflow-x: auto;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 13px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.vf-table__table {
  width: 100%;
  border-collapse: collapse;
}

.vf-table__caption {
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 16px; padding-right: 16px;
  font-weight: 600;
  text-align: left;
}

.vf-table__head,
.vf-table__cell {
  padding-top: 8px; padding-bottom: 8px;
  padding-left: 12px; padding-right: 12px;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid #e2e8f0;
}

.vf-table__head {
  font-weight: 600;
  color: #475569;
  background: #f1f5f9;
  white-space: nowrap;
}

.vf-table__head[data-align="center"],
.vf-table__cell[data-align="center"] { text-align: center; }
.vf-table__head[data-align="end"],
.vf-table__cell[data-align="end"] { text-align: right; font-variant-numeric: tabular-nums; }

.vf-table__row:last-child .vf-table__cell { border-bottom: 0; }
.vf-table__row:hover { background: #f1f5f9; }
.vf-table__row[data-state="selected"] { background: #eff6ff; }
.vf-table__row[data-action] { cursor: pointer; }

.vf-table__sort {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}

.vf-table__sort:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-table__sort-icon {
  width: 0.4em;
  height: 0.4em;
  border-bottom: 2px solid currentColor;
  border-right: 2px solid currentColor;
  opacity: 0.3;
  transform: rotate(45deg);
}

[aria-sort="ascending"] .vf-table__sort-icon { opacity: 1; transform: rotate(-135deg); }
[aria-sort="descending"] .vf-table__sort-icon { opacity: 1; }

.vf-table__empty { padding: 0; }
.vf-table__loading {
  display: block;
  padding: 24px;
  text-align: center;
  color: #475569;
}

.vf-table[data-state="loading"] .vf-table__row { opacity: 0.5; }

.vf-tabs { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif; color: #0f172a; }

.vf-tabs__list {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  border-bottom: 1px solid #e2e8f0;
}

.vf-tabs__tab {
  flex: none;
  margin-bottom: -1px;
  padding-top: 8px; padding-bottom: 8px;
  padding-left: 16px; padding-right: 16px;
  font: inherit;
  font-size: 14px;
  color: #475569;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  cursor: pointer;
}

.vf-tabs__tab:hover { color: #0f172a; }
.vf-tabs__tab:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); border-radius: 4px; }

.vf-tabs__tab[aria-selected="true"] {
  color: #2563eb;
  font-weight: 600;
  border-bottom-color: #2563eb;
}

.vf-tabs__tab:disabled { color: #94a3b8; cursor: not-allowed; }

.vf-tabs__panel { padding-top: 16px; padding-bottom: 16px; }
.vf-tabs__panel:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); border-radius: 4px; }
.vf-tabs__panel[hidden] { display: none; }

.vf-tag {
  font-weight: 400;
  border-radius: 4px;
}

.vf-tag__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin-right: calc(4px * -1);
  width: 1.25em;
  height: 1.25em;
  font: inherit;
  line-height: 1;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 9999px;
  cursor: pointer;
}

.vf-tag__remove:hover { background: #e2e8f0; }
.vf-tag__remove:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }
.vf-tag__remove:disabled { cursor: not-allowed; opacity: 0.5; }

.vf-timeline {
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #0f172a;
}

.vf-timeline__item {
  position: relative;
  display: flex;
  gap: 12px;
  padding-bottom: 16px;
}

.vf-timeline__item::before {
  content: "";
  position: absolute;
  top: 1.25em; bottom: 0;
  left: calc(0.375em - 1px);
  border-left: 2px solid #e2e8f0;
}

.vf-timeline__item:last-child::before { display: none; }

.vf-timeline__marker {
  position: relative;
  flex: none;
  width: 0.75em;
  height: 0.75em;
  margin-top: 0.375em;
  background: #475569;
  border-radius: 9999px;
}

.vf-timeline__item[data-variant="primary"] .vf-timeline__marker { background: #2563eb; }
.vf-timeline__item[data-variant="success"] .vf-timeline__marker { background: #059669; }
.vf-timeline__item[data-variant="warning"] .vf-timeline__marker { background: #d97706; }
.vf-timeline__item[data-variant="danger"] .vf-timeline__marker { background: #dc2626; }
.vf-timeline__item[data-variant="info"] .vf-timeline__marker { background: #2563eb; }

.vf-timeline__content { min-width: 0; }
.vf-timeline__title { margin: 0; font-weight: 600; }
.vf-timeline__time { display: block; font-size: 13px; color: #475569; }
.vf-timeline__description { margin: 0; margin-top: 4px; }

.vf-toast-region {
  position: fixed;
  z-index: 1400;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-sizing: border-box;
  max-width: 100%;
  width: 24em;
  padding: 16px;
  pointer-events: none;
  bottom: 0;
  right: 0;
}

.vf-toast-region[data-position="bottom-start"] { left: 0; right: auto; }
.vf-toast-region[data-position="bottom-center"] { left: 0; right: 0; margin-left: auto; margin-right: auto; }
.vf-toast-region[data-position^="top"] { top: 0; bottom: auto; }
.vf-toast-region[data-position="top-start"] { left: 0; right: auto; }
.vf-toast-region[data-position="top-center"] { left: 0; right: 0; margin-left: auto; margin-right: auto; }

.vf-toast {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding-top: 12px; padding-bottom: 12px;
  padding-left: 16px; padding-right: 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 13px;
  line-height: 1.5;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-left: 2px solid #2563eb;
  border-radius: 6px;
  box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1);
  pointer-events: auto;
}

.vf-toast[data-variant="success"] { border-left-color: #059669; }
.vf-toast[data-variant="warning"] { border-left-color: #d97706; }
.vf-toast[data-variant="danger"] { border-left-color: #dc2626; }

.vf-toast__body { flex: 1; min-width: 0; }
.vf-toast__title { margin: 0; font-weight: 600; }
.vf-toast__message { margin: 0; }

.vf-toast__action,
.vf-toast__dismiss {
  flex: none;
  padding-top: 0; padding-bottom: 0;
  padding-left: 8px; padding-right: 8px;
  font: inherit;
  color: #2563eb;
  background: transparent;
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}

.vf-toast__action { font-weight: 600; }
.vf-toast__dismiss { color: #475569; font-size: 16px; line-height: 1; }
.vf-toast__action:focus-visible,
.vf-toast__dismiss:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35); }

.vf-tooltip {
  position: relative;
  display: inline-flex;
}

.vf-tooltip__bubble {
  position: absolute;
  z-index: 1100;
  bottom: 100%;
  left: 50%;
  margin-bottom: 4px;
  padding-top: 4px; padding-bottom: 4px;
  padding-left: 8px; padding-right: 8px;
  max-width: 20em;
  width: max-content;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans KR", "Malgun Gothic", sans-serif;
  font-size: 12px;
  line-height: 1.5;
  color: #ffffff;
  background: #0f172a;
  border-radius: 4px;
  box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1);
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transform: translateX(-50%);
  transition: opacity 0.15s ease;
}

[dir="rtl"] .vf-tooltip__bubble { transform: translateX(50%); }

.vf-tooltip:hover .vf-tooltip__bubble,
.vf-tooltip:focus-within .vf-tooltip__bubble {
  visibility: visible;
  opacity: 1;
}

.vf-tooltip[data-placement="bottom"] .vf-tooltip__bubble {
  top: 100%; bottom: auto;
  margin-top: 4px; margin-bottom: 0;
}

.vf-tooltip[data-placement="start"] .vf-tooltip__bubble,
.vf-tooltip[data-placement="end"] .vf-tooltip__bubble {
  top: 50%; bottom: auto;
  margin: 0;
  transform: translateY(-50%);
}

.vf-tooltip[data-placement="start"] .vf-tooltip__bubble { left: auto; right: 100%; margin-right: 4px; }
.vf-tooltip[data-placement="end"] .vf-tooltip__bubble { left: 100%; right: auto; margin-left: 4px; }

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