/* Optional UIKit defaults. Normal application rules override this layer. */
@layer vui {
.vui {
  --vui-bg: #f7f8f4; --vui-surface: #fff; --vui-muted: #edf1e9;
  --vui-ink: #263a30; --vui-secondary: #68766d; --vui-border: #dfe5dc;
  --vui-accent: #376748; --vui-accent-ink: #fff; --vui-focus: #88a855;
  --vui-radius: 9px; --vui-error: #a23d36;
  color: var(--vui-ink); background: var(--vui-bg); color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif; line-height: 1.5;
}
.vui[data-theme=dark] {
  --vui-bg: #18231e; --vui-surface: #202e26; --vui-muted: #2b3b30;
  --vui-ink: #edf3e9; --vui-secondary: #b4c1b5; --vui-border: #39493d;
  --vui-accent: #b3d592; --vui-accent-ink: #1b2c20; --vui-focus: #d4e7a8;
  --vui-error: #ffaca1; color-scheme: dark;
}
.vui *, .vui *::before, .vui *::after { box-sizing: border-box; }
.vui :focus-visible { outline: 3px solid var(--vui-focus); outline-offset: 3px; }
.vui-button { border: 1px solid transparent; border-radius: var(--vui-radius); min-height: 42px; padding: 9px 17px; font: inherit; font-size: .85rem; font-weight: 650; background: var(--vui-accent); color: var(--vui-accent-ink); cursor: pointer; }
.vui-button[data-variant=secondary] { background: var(--vui-surface); color: var(--vui-ink); border-color: var(--vui-border); }
.vui-button[data-variant=quiet] { background: transparent; color: var(--vui-secondary); }
.vui-button:hover:not(:disabled) { filter: brightness(.94); }
.vui-button:disabled { opacity: .5; cursor: default; }
.vui-field { display: grid; gap: 7px; width: 100%; }
.vui-field label { font-size: .82rem; font-weight: 650; }
.vui-field-label { font-size: .82rem; font-weight: 650; }
.vui-listbox-field { display: grid; gap: 8px; min-width: 0; }
.vui-listbox { background: var(--vui-surface); border: 1px solid var(--vui-border); border-radius: var(--vui-radius); overscroll-behavior: contain; }
.vui-listbox-option { display: flex; align-items: center; padding: 8px 12px; font-size: 13px; cursor: pointer; }
.vui-listbox-option[aria-selected=true] { background: var(--vui-muted); color: var(--vui-accent); font-weight: 650; }
.vui-listbox:focus-within .vui-listbox-option[data-active=true] { outline: 2px solid var(--vui-focus); outline-offset: -3px; }
.vui-listbox-option[aria-disabled=true], .vui-listbox[aria-disabled=true] { opacity: .55; cursor: default; }
.vui-table-scroll { max-width: 100%; overflow: auto; border: 1px solid var(--vui-border); border-radius: var(--vui-radius); }
.vui-table { width: 100%; border-collapse: collapse; font-size: 13px; text-align: start; }
.vui-table caption { padding: 12px; font-weight: 650; text-align: start; }
.vui-table th, .vui-table td { border-block-start: 1px solid var(--vui-border); padding: 10px 12px; text-align: start; vertical-align: middle; }
.vui-table thead { background: var(--vui-muted); }
.vui-table th { font-weight: 600; }
.vui-table-sort { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 3px 0; border: 0; background: transparent; color: inherit; font: inherit; font-weight: inherit; cursor: pointer; }
.vui-table-sort:hover { color: var(--vui-accent); }
.vui-table-sort span { font-size: 11px; }
.vui-table .vui-input { min-width: 120px; font-size: 12px; padding: 8px; }
.vui-table-empty { color: var(--vui-secondary); }
.vui-pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.vui-pagination .vui-button { min-width: 36px; min-height: 36px; padding: 7px 10px; font-size: 12px; }
.vui-pagination [aria-current=page] { background: var(--vui-accent); color: var(--vui-accent-ink); border-color: var(--vui-accent); }
.vui-pagination-gap { padding: 0 3px; color: var(--vui-secondary); }
.vui-tooltip-trigger { display: inline-flex; vertical-align: middle; }
.vui-tooltip { border: 1px solid var(--vui-border); border-radius: 7px; background: var(--vui-ink); color: var(--vui-surface); padding: 8px 11px; max-width: min(260px, var(--ui-popover-width, 90vw)); font-size: 12px; line-height: 1.5; box-shadow: 0 5px 18px #0002; overflow: visible; }
.vui-tooltip::before { content: ''; position: absolute; inset-inline: 0; height: 10px; bottom: 100%; }
.vui-tooltip[data-ui-popover-side=top]::before { top: 100%; bottom: auto; }
.vui-tooltip[data-ui-popover-side=left]::before { inset-block: 0; inset-inline: auto; left: 100%; height: auto; width: 10px; }
.vui-tooltip[data-ui-popover-side=right]::before { inset-block: 0; inset-inline: auto; right: 100%; height: auto; width: 10px; }
.vui-input { border: 1px solid var(--vui-border); border-radius: var(--vui-radius); background: var(--vui-surface); color: var(--vui-ink); padding: 11px 12px; width: 100%; min-width: 0; font: inherit; font-size: .9rem; }
.vui-hint { margin: 0; color: var(--vui-secondary); font-size: .78rem; }
.vui-badge { display: inline-flex; align-items: center; border-radius: 99px; padding: 4px 10px; background: var(--vui-muted); color: var(--vui-accent); font-size: .7rem; font-weight: 650; }
.vui-switch { display: inline-flex; align-items: center; gap: 11px; position: relative; min-height: 44px; cursor: pointer; font-size: .87rem; }
.vui-switch input { position: absolute; opacity: 0; width: 38px; height: 24px; margin: 0; }
.vui-switch-track { width: 38px; height: 24px; background: var(--vui-border); border-radius: 99px; padding: 3px; flex-shrink: 0; pointer-events: none; }
.vui-switch-track::after { content: ''; display: block; width: 18px; height: 18px; border-radius: 50%; background: var(--vui-surface); transition: transform .15s ease; }
.vui-switch input:checked + .vui-switch-track { background: var(--vui-accent); }
.vui-switch input:checked + .vui-switch-track::after { transform: translateX(14px); }
.vui-switch input:focus-visible + .vui-switch-track { outline: 3px solid var(--vui-focus); outline-offset: 3px; }
.vui-switch input:disabled ~ span { opacity: .5; cursor: default; }
.vui-switch:dir(rtl) input:checked + .vui-switch-track::after { transform: translateX(-14px); }
.vui-choice-field { display: grid; gap: 6px; min-width: 0; }
.vui-check { display: flex; align-items: center; gap: 10px; min-height: 36px; font-size: 13px; cursor: pointer; }
.vui-check-input { width: 18px; height: 18px; flex: 0 0 auto; margin: 0; accent-color: var(--vui-accent); }
.vui-check-input:disabled + span { opacity: .6; cursor: default; }
.vui-radio-group, .vui-checkbox-group { border: 0; padding: 0; margin: 0; min-width: 0; }
.vui-radio-group legend, .vui-checkbox-group legend { padding: 0; margin-bottom: 7px; font-size: 13px; font-weight: 650; }
.vui-radio-group > .vui-hint, .vui-checkbox-group > .vui-hint { margin-top: 6px; }
.vui-slider-input.vui-input { padding: 0; border: 0; border-radius: 0; min-height: 36px; margin: 0; accent-color: var(--vui-accent); background: transparent; cursor: pointer; }
.vui-slider-input:disabled { opacity: .55; cursor: default; }
.vui-progress { display: grid; gap: 10px; }
.vui-progress label { font-size: 13px; font-weight: 650; }
.vui-progress-bar { width: 100%; height: 9px; border: 0; border-radius: 99px; overflow: hidden; accent-color: var(--vui-accent); }
.vui-progress-bar::-webkit-progress-bar { background: var(--vui-border); border-radius: 99px; }
.vui-progress-bar::-webkit-progress-value { background: var(--vui-accent); border-radius: 99px; }
.vui-progress-bar::-moz-progress-bar { background: var(--vui-accent); border-radius: 99px; }
.vui-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.vui-spinner { display: inline-flex; align-items: center; vertical-align: middle; color: var(--vui-accent); }
.vui-spinner-art { display: block; width: 20px; height: 20px; border: 2px solid currentColor; border-inline-start-color: transparent; border-radius: 50%; animation: vui-spin .8s linear infinite; }
@keyframes vui-spin { to { transform: rotate(360deg); } }
.vui-alert { display: flex; align-items: start; gap: 12px; padding: 16px; background: var(--vui-muted); border: 1px solid var(--vui-border); border-inline-start: 3px solid var(--vui-accent); border-radius: var(--vui-radius); font-size: 13px; }
.vui-alert-body { flex: 1; min-width: 0; color: var(--vui-ink); }
.vui-alert-title { display: block; margin-bottom: 5px; }
.vui-alert-content { color: var(--vui-secondary); }
.vui-alert-content > :first-child { margin-top: 0; }
.vui-alert-content > :last-child { margin-bottom: 0; }
.vui-alert[data-variant=danger] { border-inline-start-color: var(--vui-error); }
.vui-alert[data-variant=warning] { border-inline-start-color: var(--vui-warning, #aa812f); }
.vui-alert[data-variant=success] { border-inline-start-width: 5px; }
.vui-alert-dismiss.vui-button { min-width: 32px; min-height: 32px; padding: 0; margin-top: -5px; font-size: 23px; }
.vui [role=alert] { color: var(--vui-error); }
.vui-dialog { color: var(--vui-ink); background: var(--vui-surface); border: 1px solid var(--vui-border); border-radius: 16px; padding: 28px; width: min(520px, calc(100% - 32px)); max-height: calc(100dvh - 48px); overflow: auto; box-shadow: 0 24px 80px #14281e26; }
.vui-dialog::backdrop { background: #14281e85; }
.vui-dialog-motion { opacity: 1; transition: opacity 180ms ease; }
.vui-dialog-motion[data-state=closed] { opacity: 0; pointer-events: none; }
.vui-dialog-motion::backdrop { background: #14281e85; transition: background-color 180ms ease; }
.vui-dialog-motion[data-state=closed]::backdrop { background: transparent; }
@starting-style { .vui-dialog-motion[data-state=open] { opacity: 0; } .vui-dialog-motion[data-state=open]::backdrop { background: transparent; } }
.vui-dialog-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 10px; }
.vui-dialog-heading h2 { margin: 0; font-size: 22px; line-height: 1.25; letter-spacing: -.6px; }
.vui-dialog-heading button { font-size: 25px; padding: 0 10px; }
.vui-dialog-description { font-size: 13px; color: var(--vui-secondary); margin: 0 0 25px; line-height: 1.7; }
.vui-dialog .vui-field { margin-bottom: 25px; }
.vui-dialog-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.vui-breadcrumb { color: var(--vui-secondary); font-size: 12px; }
.vui-breadcrumb ol { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 0; list-style: none; margin: 0; padding: 0; }
.vui-breadcrumb li { display: inline-flex; align-items: baseline; min-width: 0; overflow-wrap: anywhere; }
.vui-breadcrumb li + li::before { content: ''; display: inline-block; flex: 0 0 auto; width: 1px; height: 12px; margin-inline: 12px; background: var(--vui-border); transform: rotate(20deg); }
.vui-breadcrumb a { color: inherit; text-decoration: none; }
.vui-breadcrumb a:hover { color: var(--vui-accent); text-decoration: underline; text-underline-offset: 3px; }
.vui-breadcrumb [aria-current=page] { color: var(--vui-ink); }
.vui-toasts { position: fixed; inset-block-end: max(20px, env(safe-area-inset-bottom)); inset-inline-end: max(20px, env(safe-area-inset-right)); z-index: 1000; width: min(370px, calc(100vw - 40px)); max-height: calc(100dvh - 40px); display: grid; gap: 12px; overflow-y: auto; overscroll-behavior: contain; padding: 4px; }
.vui-toasts:empty { padding: 0; }
.vui-toasts:dir(rtl) { inset-inline-end: max(20px, env(safe-area-inset-left)); }
.vui-toast { display: flex; align-items: start; gap: 16px; padding: 18px; background: var(--vui-surface); color: var(--vui-ink); border: 1px solid var(--vui-border); border-inline-start: 3px solid var(--vui-accent); border-radius: var(--vui-radius); box-shadow: 0 8px 28px #14281e24; font-size: 13px; }
.vui-toast[data-variant=danger] { border-inline-start-color: var(--vui-error); }
.vui-toast[data-variant=warning] { border-inline-start-color: #b68126; }
.vui-toast-body { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.vui-toast-body p { margin: 5px 0 0; color: var(--vui-secondary); line-height: 1.5; }
.vui-toast-actions { display: flex; align-items: center; gap: 5px; }
.vui-toast-action { min-height: 32px; padding: 5px 8px; font-size: 12px; }
.vui-toast-dismiss { min-height: 28px; min-width: 28px; padding: 0 5px; font-size: 20px; line-height: 1; }
.vui-presence { opacity: 1; transition: opacity 180ms ease; }
.vui-presence[data-state=closed] { opacity: 0; pointer-events: none; }
@starting-style { .vui-presence[data-state=open] { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .vui-presence { animation: none !important; transition: none !important; } }
.vui-popover { color: var(--vui-ink); background: var(--vui-surface); border: 1px solid var(--vui-border); border-radius: 12px; padding: 20px; width: 320px; max-width: var(--ui-popover-width, calc(100vw - 16px)); max-height: var(--ui-popover-height, calc(100dvh - 16px)); overflow: auto; box-shadow: 0 12px 36px #14281e24; }
.vui-popover-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.vui-popover-heading h2 { margin: 0; font-size: 16px; line-height: 1.4; }
.vui-popover-heading button { padding: 0 8px; font-size: 23px; min-height: 32px; }
@supports (overlay: auto) {
  .vui-popover-motion { opacity: 0; transition: opacity 160ms ease, display 160ms allow-discrete, overlay 160ms allow-discrete; }
  .vui-popover-motion:popover-open { opacity: 1; }
  @starting-style { .vui-popover-motion:popover-open { opacity: 0; } }
}
@media (prefers-reduced-motion: reduce) { .vui-popover-motion { transition: none; } }
.vui-menu { color: var(--vui-ink); background: var(--vui-surface); border: 1px solid var(--vui-border); border-radius: 10px; padding: 6px; width: 232px; max-width: var(--ui-popover-width, calc(100vw - 16px)); max-height: var(--ui-popover-height, calc(100dvh - 16px)); overflow: auto; box-shadow: 0 12px 36px #14281e24; }
.vui-menu-item { display: block; width: 100%; min-height: 38px; padding: 9px 12px; border: 0; border-radius: 5px; font: inherit; font-size: 13px; text-align: start; color: var(--vui-ink); background: transparent; cursor: pointer; }
.vui-menu-item:hover, .vui-menu-item:focus { background: var(--vui-muted); }
.vui-menu-item[aria-disabled=true] { color: var(--vui-secondary); cursor: default; }
.vui-menu-item:focus-visible { outline-offset: -3px; }
.vui-menu-separator { height: 1px; background: var(--vui-border); margin: 5px 7px; }
.vui-combobox { min-width: 0; }
.vui-combobox-popup { color: var(--vui-ink); background: var(--vui-surface); border: 1px solid var(--vui-border); border-radius: 9px; padding: 5px; width: var(--ui-popover-anchor-width, 320px); max-width: var(--ui-popover-width, calc(100vw - 16px)); max-height: min(240px, var(--ui-popover-height, calc(100dvh - 16px))); overflow: auto; overscroll-behavior: contain; box-shadow: 0 12px 36px #14281e24; }
.vui-combobox-option { padding: 9px 12px; border-radius: 5px; min-height: 38px; font-size: 13px; cursor: pointer; }
.vui-combobox-option[aria-selected=true] { background: var(--vui-muted); color: var(--vui-accent); outline: 2px solid var(--vui-focus); outline-offset: -2px; }
.vui-combobox-option:hover { background: var(--vui-muted); }
.vui-combobox-option[aria-disabled=true] { color: var(--vui-secondary); cursor: default; }
.vui-tabs { min-width: 0; }
.vui-tab-list { display: flex; gap: 4px; overflow-x: auto; padding: 5px; border-bottom: 1px solid var(--vui-border); }
.vui-tab-list button { font: inherit; font-size: 12px; border: 0; border-bottom: 2px solid transparent; padding: 11px 12px; background: transparent; color: var(--vui-secondary); cursor: pointer; white-space: nowrap; }
.vui-tab-list button[aria-selected=true] { border-color: var(--vui-accent); color: var(--vui-accent); font-weight: 650; }
.vui-tab-list button:disabled { opacity: .5; cursor: default; }
.vui-tab-panel { padding: 20px 0 0; font-size: 13px; color: var(--vui-secondary); line-height: 1.8; }
.vui-tabs[data-orientation=vertical] { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 20px; }
.vui-tabs[data-orientation=vertical] .vui-tab-list { flex-direction: column; border-bottom: 0; }
.vui-accordion-item { border-bottom: 1px solid var(--vui-border); }
.vui-accordion-heading { margin: 0; font: inherit; }
.vui-accordion-trigger { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; min-height: 52px; padding: 14px 4px; border: 0; background: transparent; color: var(--vui-ink); text-align: start; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.vui-accordion-trigger:disabled { color: var(--vui-secondary); opacity: .6; cursor: default; }
.vui-accordion-panel { padding: 0 4px 22px; font-size: 13px; line-height: 1.8; color: var(--vui-secondary); }
@media (prefers-reduced-motion: reduce) { .vui *, .vui *::after, .vui-dialog-motion::backdrop { transition: none !important; animation: none !important; } }
@media (forced-colors: active) { .vui-switch-track { border: 1px solid ButtonText; } .vui-switch-track::after { background: ButtonText; } .vui-switch input:checked + .vui-switch-track { background: Highlight; } }
}
