:root {
--jv-space-xs: 4px;
--jv-space-sm: 8px;
--jv-space-md: 16px;
--jv-space-lg: 24px;
--jv-space-xl: 32px;
--jv-radius-xs: 4px;
--jv-radius-sm: 6px;
--jv-radius-md: 8px;
--jv-radius-lg: 12px;
--jv-elevation-1: 0 1px 3px rgba(15, 23, 42, 0.12);
--jv-elevation-2: 0 6px 18px rgba(15, 23, 42, 0.14);
--jv-elevation-3: 0 12px 28px rgba(15, 23, 42, 0.16);
--jv-motion-quick: 120ms ease-out;
--jv-motion-standard: 180ms ease-in-out;
}

.body--dark, [data-theme="dark"], .theme-dark { color-scheme: dark; }
.body--light { color-scheme: light; }
.desktop { --jv-platform-density: 1; }
.mobile, .touch { --jv-platform-density: 1.08; }
.platform-ios, .platform-android { -webkit-tap-highlight-color: transparent; }

.j-app, .j-layout, .j-page, .j-page-container { min-width: 0; }
.j-app { min-height: 100vh; background: var(--jv-color-surface); color: var(--jv-color-on-surface); }
.j-splitter { display: flex; min-width: 0; min-height: 0; overflow: hidden; }
.j-splitter--vertical { flex-direction: row; }
.j-splitter--horizontal { flex-direction: column; }
.j-splitter__before, .j-splitter__after, .j-splitter > [slot="before"], .j-splitter > [slot="after"] { min-width: 0; min-height: 0; overflow: auto; }
.j-splitter__separator { position: relative; flex: none; border: 0; background: transparent; touch-action: none; user-select: none; outline: none; }
.j-splitter__separator::after { content: ""; position: absolute; border-radius: 999px; background: var(--jv-color-outline); transition: background var(--jv-motion-quick), box-shadow var(--jv-motion-quick); }
.j-splitter__separator.gutter-horizontal { cursor: col-resize; }
.j-splitter__separator.gutter-horizontal::after { inset-block: 8px; left: 50%; width: 2px; transform: translateX(-50%); }
.j-splitter__separator.gutter-vertical { cursor: row-resize; }
.j-splitter__separator.gutter-vertical::after { inset-inline: 8px; top: 50%; height: 2px; transform: translateY(-50%); }
.j-splitter__separator:hover::after, .j-splitter__separator:focus-visible::after, .j-splitter--dragging .j-splitter__separator::after { background: var(--jv-color-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--jv-color-primary) 16%, transparent); }
.j-splitter--disabled .j-splitter__separator { cursor: default; pointer-events: none; opacity: .48; }
.j-layout { min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; }
.j-layout--row { grid-template-columns: auto 1fr; grid-template-rows: auto 1fr auto; }
.j-layout--column { grid-template-columns: 1fr; }
.j-layout--full-height { min-height: 100vh; }
.j-layout > .j-header, .j-layout > .j-footer { grid-column: 1 / -1; }
.j-layout > .j-drawer--left { grid-column: 1; grid-row: 2; }
.j-layout > .j-drawer--right { grid-column: -2; grid-row: 2; }
.j-layout > .j-page-container { grid-column: 1 / -1; grid-row: 2; }
.j-layout--row > .j-drawer--left ~ .j-page-container { grid-column: 2; }
.j-page-container { width: 100%; min-height: 0; }
.j-page { width: 100%; }
.j-header, .j-footer, .j-toolbar { display: flex; align-items: center; gap: var(--jv-space-md); }
.j-toolbar { min-height: 56px; }
.j-toolbar-title { flex: 1 1 auto; margin: 0; font-size: var(--jv-type-title-medium-size); line-height: var(--jv-type-title-medium-line-height); font-weight: 600; }
.j-drawer { width: 280px; max-width: 86vw; }
.j-drawer--above, .j-drawer--overlay { position: fixed; top: 0; bottom: 0; z-index: 1200; max-width: 86vw; opacity: 0; pointer-events: none; transition: transform var(--jv-motion-standard), opacity var(--jv-motion-quick), box-shadow var(--jv-motion-standard); box-shadow: 18px 0 40px rgba(15, 23, 42, 0.2); }
.j-drawer--above.j-drawer--left, .j-drawer--overlay.j-drawer--left { left: 0; transform: translateX(-100%); }
.j-drawer--above.j-drawer--right, .j-drawer--overlay.j-drawer--right { right: 0; transform: translateX(100%); box-shadow: -18px 0 40px rgba(15, 23, 42, 0.2); }
.j-drawer--above.j-drawer--open, .j-drawer--overlay.j-drawer--open { opacity: 1; pointer-events: auto; transform: translateX(0); }
.j-layout--drawer-above { grid-template-columns: 1fr; }
.j-layout--drawer-above > .j-drawer { grid-column: 1; grid-row: 1 / -1; }
.j-layout--drawer-above > .j-page-container, .j-layout--drawer-above > .j-header, .j-layout--drawer-above > .j-footer { grid-column: 1 / -1; }
.j-layout--drawer-push-all { grid-template-columns: auto 1fr; }
.j-layout--drawer-push-all > .j-drawer--left { grid-column: 1; grid-row: 1 / -1; }
.j-layout--drawer-push-all > .j-drawer--right { grid-column: 2; grid-row: 1 / -1; }
.j-layout--drawer-push-all > .j-header, .j-layout--drawer-push-all > .j-page-container, .j-layout--drawer-push-all > .j-footer { grid-column: 2; }
.j-layout--drawer-push-all > .j-drawer--right ~ .j-header, .j-layout--drawer-push-all > .j-drawer--right ~ .j-page-container, .j-layout--drawer-push-all > .j-drawer--right ~ .j-footer { grid-column: 1; }
.j-card { border: 1px solid transparent; border-radius: var(--jv-shape-radius); background: var(--jv-color-surface); color: var(--jv-color-on-surface); padding: var(--jv-space-md); box-shadow: var(--jv-elevation-1); }
.j-card--flat { box-shadow: none; }
.j-card--bordered { border-color: var(--jv-color-outline); }
.j-card--square { border-radius: 0; }
.j-card--dark { background: var(--jv-color-on-surface); color: var(--jv-color-surface); }
.j-bar { min-height: 32px; display: flex; align-items: center; gap: var(--jv-space-sm); padding: 0 var(--jv-space-sm); }
.j-button { min-height: 40px; border: 0; border-radius: var(--jv-shape-radius); display: inline-flex; align-items: center; justify-content: center; gap: var(--jv-space-sm); padding: 0 var(--jv-space-md); font: inherit; line-height: 1; color: var(--jv-color-primary); background: transparent; cursor: pointer; text-decoration: none; user-select: none; transition: background var(--jv-motion-standard), border-color var(--jv-motion-standard), box-shadow var(--jv-motion-quick), transform var(--jv-motion-quick); }
.j-button:hover { background: color-mix(in srgb, var(--jv-color-primary) 10%, transparent); }
.j-button:active { transform: translateY(1px); }
.j-button--filled { background: var(--jv-color-primary); color: var(--jv-color-on-primary); box-shadow: var(--jv-elevation-1); }
.j-button--filled:hover, .j-button--filled.j-button--hover, .j-button--filled.j-button--hovered { background: var(--jv-color-primary); box-shadow: var(--jv-elevation-2); }
.j-button--unelevated { background: var(--jv-color-primary); color: var(--jv-color-on-primary); box-shadow: none; }
.j-button--outlined, .j-button--outline { border: 1px solid currentColor; background: transparent; color: var(--jv-color-primary); }
.j-button--flat, .j-button--text { background: transparent; color: var(--jv-color-primary); box-shadow: none; }
.j-button--push { background: var(--jv-color-primary); color: var(--jv-color-on-primary); box-shadow: 0 3px 0 color-mix(in srgb, var(--jv-color-primary) 70%, #000); }
.j-button--unelevated:hover, .j-button--push:hover, .j-button--unelevated.j-button--hover, .j-button--push.j-button--hover, .j-button--unelevated.j-button--hovered, .j-button--push.j-button--hovered { filter: brightness(0.96); }
.j-button--outlined:hover, .j-button--outline:hover, .j-button--flat:hover, .j-button--text:hover, .j-button--outlined.j-button--hover, .j-button--outline.j-button--hover, .j-button--flat.j-button--hover, .j-button--text.j-button--hover, .j-button--outlined.j-button--hovered, .j-button--outline.j-button--hovered, .j-button--flat.j-button--hovered, .j-button--text.j-button--hovered { background: color-mix(in srgb, currentColor 10%, transparent); }
.j-button--secondary.j-button--filled, .j-button--secondary.j-button--unelevated, .j-button--secondary.j-button--push { background: var(--jv-color-secondary); color: var(--jv-color-on-secondary, #fff); }
.j-button--secondary.j-button--text, .j-button--secondary.j-button--flat, .j-button--secondary.j-button--outlined, .j-button--secondary.j-button--outline { color: var(--jv-color-secondary); }
.j-button--tertiary.j-button--filled, .j-button--tertiary.j-button--unelevated, .j-button--tertiary.j-button--push { background: var(--jv-color-tertiary); color: var(--jv-color-on-tertiary, #fff); }
.j-button--tertiary.j-button--text, .j-button--tertiary.j-button--flat, .j-button--tertiary.j-button--outlined, .j-button--tertiary.j-button--outline { color: var(--jv-color-tertiary); }
.j-button--positive.j-button--filled, .j-button--positive.j-button--unelevated, .j-button--positive.j-button--push { background: var(--jv-color-positive, #16a34a); color: var(--jv-color-on-positive, #fff); }
.j-button--positive.j-button--text, .j-button--positive.j-button--flat, .j-button--positive.j-button--outlined, .j-button--positive.j-button--outline { color: var(--jv-color-positive, #16a34a); }
.j-button--negative.j-button--filled, .j-button--negative.j-button--unelevated, .j-button--negative.j-button--push, .j-button--error.j-button--filled, .j-button--error.j-button--unelevated, .j-button--error.j-button--push { background: var(--jv-color-error, #b3261e); color: var(--jv-color-on-error, #fff); }
.j-button--negative.j-button--text, .j-button--negative.j-button--flat, .j-button--negative.j-button--outlined, .j-button--negative.j-button--outline, .j-button--error.j-button--text, .j-button--error.j-button--flat, .j-button--error.j-button--outlined, .j-button--error.j-button--outline { color: var(--jv-color-error, #b3261e); }
.j-button--dense { min-height: 32px; padding-left: var(--jv-space-sm); padding-right: var(--jv-space-sm); font-size: 0.875rem; }
.j-button--round { width: 40px; padding: 0; border-radius: 50%; aspect-ratio: 1; }
.j-button--dense.j-button--round { width: 32px; }
.j-button--rounded { border-radius: 999px; }
.j-button--square { border-radius: 0; }
.j-button--block { display: flex; width: 100%; }
.j-button--stack { flex-direction: column; min-height: 56px; gap: 2px; }
.j-button--no-caps { text-transform: none; }
.j-button--loading, .j-button--disabled, .j-button:disabled, .j-button[aria-disabled="true"] { cursor: not-allowed; opacity: 0.56; pointer-events: none; }
.j-button--size-xs { min-height: 24px; padding-left: var(--jv-space-xs); padding-right: var(--jv-space-xs); font-size: 0.75rem; }
.j-button--size-sm { min-height: 32px; padding-left: var(--jv-space-sm); padding-right: var(--jv-space-sm); font-size: 0.875rem; }
.j-button--size-lg { min-height: 48px; padding-left: var(--jv-space-lg); padding-right: var(--jv-space-lg); font-size: 1rem; }
.j-button--size-xl { min-height: 56px; padding-left: var(--jv-space-xl); padding-right: var(--jv-space-xl); font-size: 1.125rem; }
.j-button--padding-xs { padding-left: var(--jv-space-xs); padding-right: var(--jv-space-xs); }
.j-button--padding-sm { padding-left: var(--jv-space-sm); padding-right: var(--jv-space-sm); }
.j-button--padding-lg { padding-left: var(--jv-space-lg); padding-right: var(--jv-space-lg); }
.j-button--padding-xl { padding-left: var(--jv-space-xl); padding-right: var(--jv-space-xl); }
.j-button__icon { display: inline-flex; align-items: center; justify-content: center; }
.j-button__spinner { width: 1em; height: 1em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: jv-spin 700ms linear infinite; }
.j-button--text-primary { color: var(--jv-color-primary); }
.j-button--text-secondary { color: var(--jv-color-secondary); }
.j-button--text-tertiary { color: var(--jv-color-tertiary); }
.j-button--text-error, .j-button--text-negative { color: var(--jv-color-error, #b3261e); }
.j-button--text-white { color: #fff; }
.j-button--text-black { color: #000; }
@keyframes jv-spin { to { transform: rotate(360deg); } }
.j-button-group { display: inline-flex; align-items: center; border-radius: var(--jv-shape-radius); overflow: hidden; }
.j-button-group .j-button { border-radius: 0; }
j-toggle.j-toggle { position: relative; min-height: 40px; display: inline-flex; align-items: center; gap: var(--jv-space-sm); cursor: pointer; user-select: none; color: var(--jv-color-on-surface); }
j-toggle.j-toggle::before { content: ""; width: 36px; height: 20px; border-radius: 999px; background: #cbd5e1; border: 0px solid var(--jv-color-outline); transition: background var(--jv-motion-standard), border-color var(--jv-motion-standard); }
j-toggle.j-toggle::after { content: ""; position: absolute; left: 2px; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: var(--jv-color-surface); box-shadow: 0 1px 2px rgba(15, 23, 42, 0.32); transform: translateY(-50%); transition: transform var(--jv-motion-standard), background var(--jv-motion-standard); }
j-toggle.j-toggle[aria-checked="true"]::before, j-toggle.j-toggle.j-toggle--checked::before { background: var(--jv-color-primary); border-color: var(--jv-color-primary); }
j-toggle.j-toggle[aria-checked="true"]::after, j-toggle.j-toggle.j-toggle--checked::after { transform: translate(16px, -50%); background: var(--jv-color-on-primary); }
j-toggle.j-toggle:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; border-radius: 999px; }
label.j-toggle { position: relative; min-height: 40px; display: inline-flex; align-items: center; gap: var(--jv-space-sm); cursor: pointer; user-select: none; color: var(--jv-color-on-surface); }
label.j-toggle .j-toggle__input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
label.j-toggle .j-toggle__track { width: 36px; height: 20px; border-radius: 999px; background: #cbd5e1; border: 0px solid var(--jv-color-outline); display: inline-flex; align-items: center; padding: 1px; transition: background var(--jv-motion-standard), border-color var(--jv-motion-standard); }
label.j-toggle .j-toggle__thumb { width: 16px; height: 16px; border-radius: 50%; background: var(--jv-color-surface); box-shadow: 0 1px 2px rgba(15, 23, 42, 0.32); transition: transform var(--jv-motion-standard), background var(--jv-motion-standard); }
label.j-toggle .j-toggle__input:checked + .j-toggle__track { background: var(--jv-color-primary); border-color: var(--jv-color-primary); }
label.j-toggle .j-toggle__input:checked + .j-toggle__track .j-toggle__thumb { transform: translateX(16px); background: var(--jv-color-on-primary); }
label.j-toggle .j-toggle__input:focus-visible + .j-toggle__track { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
label.j-toggle .j-toggle__label { color: var(--jv-color-on-surface); }
.j-dropdown { position: relative; display: inline-block; }
.j-dropdown__menu, .j-menu { min-width: 160px; border: 0px solid var(--jv-color-outline); border-radius: var(--jv-shape-radius); background: var(--jv-color-surface); box-shadow: var(--jv-elevation-2); padding: var(--jv-space-xs); }
.j-dropdown__item { width: 100%; min-height: 36px; border: 0; background: transparent; color: inherit; text-align: start; padding: 0 var(--jv-space-sm); border-radius: var(--jv-radius-xs); }
.j-icon-button { width: 40px; height: 40px; border-radius: 50%; border: 0; display: inline-grid; place-items: center; background: transparent; color: inherit; }
.j-icon { display: inline-block; flex-shrink: 0; font-size: calc(var(--jv-icon-size, 24) * 1px); line-height: 1; vertical-align: middle; }
.j-field { display: grid; gap: var(--jv-space-xs); }
.j-field__label { color: var(--jv-color-on-surface-muted); font-size: var(--jv-type-label-large-size); line-height: var(--jv-type-label-large-line-height); }
.j-field__hint { color: var(--jv-color-on-surface-muted); font-size: 0.75rem; }
.j-field__error, .j-field__required { color: var(--jv-color-error, #b3261e); }
.j-input, .j-textarea, .j-select__native, select.j-select { width: 100%; min-height: 40px; border: 0px solid var(--jv-color-outline); border-radius: var(--jv-shape-radius); padding: 0 var(--jv-space-sm); font: inherit; color: inherit; background: var(--jv-color-surface); }
.j-input:focus, .j-textarea:focus, .j-select__native:focus, select.j-select:focus, .j-input:focus-visible, .j-textarea:focus-visible, .j-select__native:focus-visible, select.j-select:focus-visible { outline: none; box-shadow: none; }
.j-field--dense .j-input, .j-field--dense .j-select__native { min-height: 32px; }
.j-field--dense .j-textarea { min-height: 72px; }
.j-field--filled .j-input, .j-field--filled .j-textarea, .j-field--filled .j-select__native { background: color-mix(in srgb, var(--jv-color-on-surface) 5%, var(--jv-color-surface)); border-color: transparent; }
.j-field--outlined .j-input, .j-field--outline .j-input, .j-field--outlined .j-textarea, .j-field--outline .j-textarea, .j-field--outlined .j-select__native, .j-field--outline .j-select__native { border-color: var(--jv-color-outline); background: var(--jv-color-surface); }
.j-field--standout .j-input, .j-field--standout .j-textarea, .j-field--standout .j-select__native { background: var(--jv-color-surface); border-color: transparent; box-shadow: 0 0 0 2px color-mix(in srgb, var(--jv-color-primary) 24%, transparent); }
.j-field--borderless .j-input, .j-field--borderless .j-textarea, .j-field--borderless .j-select__native { border-color: transparent; background: transparent; }
.j-field--underline .j-input, .j-field--underline .j-textarea, .j-field--underline .j-select__native { border: 0; border-bottom: 1px solid var(--jv-color-outline); border-radius: 0; padding-inline: 0; background: transparent; }
.j-field--underline .j-input:focus, .j-field--underline .j-textarea:focus, .j-field--underline .j-select__native:focus { border-bottom-color: var(--jv-color-primary); outline: none; box-shadow: 0 1px 0 var(--jv-color-primary); }
.j-field--rounded .j-input, .j-field--rounded .j-textarea, .j-field--rounded .j-select__native { border-radius: 999px; }
.j-field--square .j-input, .j-field--square .j-textarea, .j-field--square .j-select__native { border-radius: 0; }
.j-field--disabled { opacity: 0.56; cursor: not-allowed; }
.j-textarea { min-height: 96px; padding-top: var(--jv-space-sm); resize: vertical; }
.j-table { width: 100%; border-collapse: collapse; }
.j-calendar { display: grid; gap: var(--jv-space-sm); border-radius: var(--jv-shape-radius); background: var(--jv-color-surface); color: var(--jv-color-on-surface); }
.j-calendar--bordered { border: 0px solid var(--jv-color-outline); padding: var(--jv-space-sm); }
.j-calendar__header { display: flex; align-items: center; gap: var(--jv-space-sm); min-width: 0; }
.j-calendar__title { flex: 1 1 auto; min-width: 0; font-weight: 700; }
.j-calendar__nav { width: 36px; height: 36px; border: 0px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); display: inline-grid; place-items: center; background: var(--jv-color-surface); color: inherit; cursor: pointer; }
.j-calendar__weekdays, .j-calendar__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.j-calendar__weekday { padding: var(--jv-space-xs); color: var(--jv-color-on-surface-muted); font-size: 0.75rem; font-weight: 700; text-align: center; }
.j-calendar__day { min-height: 96px; border: 1px solid color-mix(in srgb, var(--jv-color-outline) 70%, transparent); padding: var(--jv-space-xs); display: grid; align-content: start; gap: 4px; }
.j-calendar--dense .j-calendar__day { min-height: 64px; }
.j-calendar__day--outside { color: var(--jv-color-on-surface-muted); background: color-mix(in srgb, var(--jv-color-on-surface) 3%, transparent); }
.j-calendar__day--today { box-shadow: inset 0 0 0 2px var(--jv-color-primary); }
.j-calendar__day--selected { background: color-mix(in srgb, var(--jv-color-primary) 10%, var(--jv-color-surface)); }
.j-calendar__day--disabled { opacity: 0.45; }
.j-calendar__day-button { width: 28px; height: 28px; border: 0; border-radius: 50%; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.j-calendar__day--selected .j-calendar__day-button { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }
.j-calendar__events { display: grid; gap: 3px; min-width: 0; }
.j-calendar-event { min-width: 0; display: flex; align-items: center; gap: 4px; border-radius: var(--jv-radius-xs); padding: 2px 6px; background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); font-size: 0.75rem; line-height: 1.4; text-decoration: none; }
.j-calendar-event__title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.j-calendar-event__time { font-weight: 700; }
.j-calendar__more, .j-calendar__empty, .j-calendar__agenda-date { color: var(--jv-color-on-surface-muted); font-size: 0.75rem; }
.j-calendar__title-wrap { flex: 1 1 auto; min-width: 0; }
.j-calendar__modes { display: inline-flex; gap: 2px; border: 0px solid var(--jv-color-outline); border-radius: 999px; padding: 2px; }
.j-calendar__mode { padding: 4px 10px; border: 0; background: transparent; color: inherit; font: inherit; font-size: 0.75rem; font-weight: 600; border-radius: 999px; cursor: pointer; }
.j-calendar__mode.is-active { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }
.j-calendar__agenda { display: grid; gap: 6px; }
.j-calendar__agenda-date { padding-top: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
.j-calendar__agenda-item { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 0px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); background: var(--jv-color-surface); color: inherit; cursor: pointer; text-align: left; }
.j-calendar__agenda-item:hover { background: color-mix(in srgb, var(--jv-color-primary) 8%, var(--jv-color-surface)); }
.j-calendar__agenda { display: grid; gap: var(--jv-space-xs); }
.j-calendar__agenda-date { margin-top: var(--jv-space-sm); font-weight: 700; }
.j-flow { position: relative; min-height: 320px; border: 0px solid var(--jv-color-outline); border-radius: var(--jv-shape-radius); background: var(--jv-color-surface); overflow: hidden; }
.j-flow__viewport { position: relative; width: 100%; height: 100%; min-height: inherit; overflow: hidden; }
.j-flow-background { position: absolute; inset: 0; pointer-events: none; --j-flow-background-color: color-mix(in srgb, var(--jv-color-outline) 65%, transparent); }
.j-flow-background--lines { background-image: linear-gradient(var(--j-flow-background-color) var(--j-flow-background-size), transparent var(--j-flow-background-size)), linear-gradient(90deg, var(--j-flow-background-color) var(--j-flow-background-size), transparent var(--j-flow-background-size)); background-size: var(--j-flow-background-gap) var(--j-flow-background-gap); }
.j-flow-background--dots { background-image: radial-gradient(var(--j-flow-background-color) var(--j-flow-background-size), transparent var(--j-flow-background-size)); background-size: var(--j-flow-background-gap) var(--j-flow-background-gap); }
.j-flow__edges { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.j-flow-edge__path { stroke: var(--jv-color-outline); stroke-width: 2; }
.j-flow-edge__marker { fill: var(--jv-color-outline); }
.j-flow-edge--animated .j-flow-edge__path { stroke-dasharray: 6 4; animation: jv-flow-dash 900ms linear infinite; }
.j-flow-edge__label { font-size: 12px; fill: var(--jv-color-on-surface-muted); paint-order: stroke; stroke: var(--jv-color-surface); stroke-width: 4px; }
@keyframes jv-flow-dash { to { stroke-dashoffset: -10; } }
.j-flow__nodes { position: absolute; inset: 0; }
.j-flow-node { position: absolute; min-width: 80px; border: 0px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); display: grid; place-items: center; padding: var(--jv-space-sm); background: var(--jv-color-surface); color: var(--jv-color-on-surface); box-shadow: var(--jv-elevation-1); cursor: grab; }
.j-flow-node--selected { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.j-flow-node__content { min-width: 0; text-align: center; }
.j-flow-node__handle { position: absolute; top: 50%; width: 10px; height: 10px; border: 2px solid var(--jv-color-primary); border-radius: 50%; background: var(--jv-color-surface); transform: translateY(-50%); }
.j-flow-node__handle--target { left: -6px; }
.j-flow-node__handle--source { right: -6px; }
.j-flow-controls, .j-flow-panel, .j-flow-minimap { position: absolute; z-index: 2; }
.j-flow-controls { left: var(--jv-space-sm); bottom: var(--jv-space-sm); display: inline-flex; overflow: hidden; border: 0px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); background: var(--jv-color-surface); box-shadow: var(--jv-elevation-1); }
.j-flow-controls__button { width: 36px; height: 36px; border: 0; border-right: 1px solid var(--jv-color-outline); display: inline-grid; place-items: center; background: transparent; color: inherit; cursor: pointer; }
.j-flow-controls__button:last-child { border-right: 0; }
.j-flow-panel { top: var(--jv-space-sm); left: var(--jv-space-sm); border: 0px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); background: color-mix(in srgb, var(--jv-color-surface) 92%, transparent); padding: var(--jv-space-xs) var(--jv-space-sm); box-shadow: var(--jv-elevation-1); }
.j-flow-panel--top-right { right: var(--jv-space-sm); left: auto; }
.j-flow-panel--bottom-left { top: auto; bottom: var(--jv-space-sm); }
.j-flow-panel--bottom-right { top: auto; right: var(--jv-space-sm); bottom: var(--jv-space-sm); left: auto; }
.j-flow-minimap { right: var(--jv-space-sm); bottom: var(--jv-space-sm); border: 0px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); background: color-mix(in srgb, var(--jv-color-surface) 92%, transparent); box-shadow: var(--jv-elevation-1); overflow: hidden; }
.j-flow-minimap__svg { width: 100%; height: 100%; display: block; }
.j-flow-minimap__node { fill: color-mix(in srgb, var(--jv-color-primary) 55%, var(--jv-color-surface)); }
.j-flow { touch-action: none; user-select: none; }
.j-flow--panning { cursor: grabbing; }
.j-flow--dragging .j-flow-node { transition: none !important; }
.j-flow--locked .j-flow-node { cursor: not-allowed !important; }
.j-flow--locked .j-flow__viewport { pointer-events: none; }
.j-flow-node:active { cursor: grabbing; }
.j-flow-node--selected { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; box-shadow: 0 6px 22px color-mix(in srgb, var(--jv-color-primary) 35%, transparent); }
.j-flow-edge--preview { stroke: var(--jv-color-primary); stroke-width: 2; stroke-dasharray: 4 4; opacity: 0.85; }
.j-flow-node__handle { cursor: crosshair; transition: transform 0.18s ease, background 0.18s ease; }
.j-flow-node__handle:hover { transform: translateY(-50%) scale(1.4); background: var(--jv-color-primary); }
.j-flow-controls__button[aria-pressed="true"] { background: color-mix(in srgb, var(--jv-color-primary) 18%, transparent); color: var(--jv-color-primary); }
.j-flow-minimap { width: 168px; height: 110px; padding: 6px; }
.j-flow-minimap__svg { width: 100%; height: 100%; display: block; cursor: pointer; }
.j-flow-minimap__viewport { color: color-mix(in srgb, var(--jv-color-primary) 80%, transparent); pointer-events: none; }
.j-flow__viewport { transform-origin: 0 0; will-change: transform; position: absolute; inset: 0; }
.j-flow-node { transition: box-shadow 0.18s ease, transform 0.18s ease; }
.j-flow-node--input { border-left: 3px solid color-mix(in srgb, #22c55e 60%, transparent); }
.j-flow-node--output { border-right: 3px solid color-mix(in srgb, #ef4444 60%, transparent); }
.j-chip, .j-badge { min-height: 28px; display: inline-flex; align-items: center; gap: var(--jv-space-xs); border-radius: 999px; padding: 2px 10px; background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); }
.j-chip--primary { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }
.j-chip--secondary { background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); }
.j-chip--positive { background: var(--jv-color-positive, #16a34a); color: var(--jv-color-on-positive, #fff); }
.j-chip--negative, .j-chip--error { background: var(--jv-color-error, #b3261e); color: var(--jv-color-on-error, #fff); }
.j-chip--outlined, .j-chip--outline { border: 1px solid currentColor; background: transparent; color: var(--jv-color-primary); }
.j-chip--text-primary { color: var(--jv-color-primary); }
.j-chip--text-secondary { color: var(--jv-color-secondary); }
.j-chip--text-error, .j-chip--text-negative { color: var(--jv-color-error, #b3261e); }
.j-chip--text-white { color: #fff; }
.j-chip--text-black { color: #000; }
.j-chip--dense { min-height: 22px; padding: 0 8px; font-size: 0.8125rem; }
.j-chip--square { border-radius: var(--jv-radius-xs); }
.j-chip--clickable { cursor: pointer; user-select: none; }
.j-chip--selected { box-shadow: inset 0 0 0 1px currentColor; }
.j-chip--disabled { opacity: 0.56; pointer-events: none; }
.j-chip__icon { display: inline-flex; align-items: center; justify-content: center; }
.j-chip__remove { width: 20px; height: 20px; border: 0; border-radius: 50%; display: inline-grid; place-items: center; padding: 0; color: inherit; background: transparent; cursor: pointer; }
.j-dialog { position: fixed; inset: 0; z-index: var(--jv-z-dialog, 1200); display: grid; place-items: center; padding: var(--jv-space-md); background: rgba(15, 23, 42, 0.38); }
.j-dialog[hidden] { display: none !important; }
.j-dialog-panel { width: min(100%, 500px); border: 0; border-radius: var(--jv-shape-radius); background: var(--jv-color-surface); color: var(--jv-color-on-surface); box-shadow: var(--jv-elevation-3); padding: var(--jv-space-lg); }
.j-dialog__header { display: flex; align-items: center; gap: var(--jv-space-sm); margin-bottom: var(--jv-space-sm); }
.j-dialog__icon { color: var(--jv-color-primary); font-size: 28px; }
.j-dialog--success .j-dialog__icon { color: var(--jv-color-positive, #16a34a); }
.j-dialog--warning .j-dialog__icon { color: var(--jv-color-warning, #b45309); }
.j-dialog--error .j-dialog__icon { color: var(--jv-color-error, #b3261e); }
.j-dialog-title { font-size: 1.125rem; font-weight: 700; line-height: 1.3; }
.j-dialog-content { color: var(--jv-color-on-surface-variant, #475569); line-height: 1.55; }
.j-dialog-actions { display: flex; justify-content: flex-end; gap: var(--jv-space-sm); margin-top: var(--jv-space-lg); }
.j-alert, .j-banner, .j-snackbar { border-radius: var(--jv-shape-radius); padding: var(--jv-space-md); }
.j-snackbar { display: flex; align-items: center; gap: var(--jv-space-md); background: var(--jv-color-on-surface); color: var(--jv-color-surface); box-shadow: var(--jv-elevation-3); }
.j-breadcrumbs, .j-tabs, .j-tab-panels, .j-stepper { display: flex; gap: var(--jv-space-sm); }
.j-tab-panel { width: 100%; }
.j-tree, .j-list { list-style: none; margin: 0; padding: 0; }
.j-separator { border: 0; border-top: 1px solid var(--jv-color-outline); width: 100%; }
.j-responsive { width: 100%; overflow: hidden; }
.j-responsive > * { width: 100%; height: 100%; }
.j-popup-proxy, .j-no-ssr, .j-intersection, .j-pull-to-refresh { min-width: 0; }
.j-slide-transition { overflow: hidden; transition: max-height var(--jv-slide-duration, 180ms) ease-in-out; }
.j-space { flex: 1 1 auto; }
.j-linear-progress { min-height: 4px; }

.pa-none, .jv-pa-none { padding: 0; } .pa-xs, .jv-pa-xs { padding: var(--jv-space-xs); } .pa-sm, .jv-pa-sm { padding: var(--jv-space-sm); } .pa-md, .jv-pa-md { padding: var(--jv-space-md); } .pa-lg, .jv-pa-lg { padding: var(--jv-space-lg); } .pa-xl, .jv-pa-xl { padding: var(--jv-space-xl); }
.px-none, .jv-px-none { padding-left: 0; padding-right: 0; } .px-xs, .jv-px-xs { padding-left: var(--jv-space-xs); padding-right: var(--jv-space-xs); } .px-sm, .jv-px-sm { padding-left: var(--jv-space-sm); padding-right: var(--jv-space-sm); } .px-md, .jv-px-md { padding-left: var(--jv-space-md); padding-right: var(--jv-space-md); } .px-lg, .jv-px-lg { padding-left: var(--jv-space-lg); padding-right: var(--jv-space-lg); } .px-xl, .jv-px-xl { padding-left: var(--jv-space-xl); padding-right: var(--jv-space-xl); }
.py-none, .jv-py-none { padding-top: 0; padding-bottom: 0; } .py-xs, .jv-py-xs { padding-top: var(--jv-space-xs); padding-bottom: var(--jv-space-xs); } .py-sm, .jv-py-sm { padding-top: var(--jv-space-sm); padding-bottom: var(--jv-space-sm); } .py-md, .jv-py-md { padding-top: var(--jv-space-md); padding-bottom: var(--jv-space-md); } .py-lg, .jv-py-lg { padding-top: var(--jv-space-lg); padding-bottom: var(--jv-space-lg); } .py-xl, .jv-py-xl { padding-top: var(--jv-space-xl); padding-bottom: var(--jv-space-xl); }
.pt-md, .jv-pt-md { padding-top: var(--jv-space-md); } .pr-md, .jv-pr-md { padding-right: var(--jv-space-md); } .pb-md, .jv-pb-md { padding-bottom: var(--jv-space-md); } .pl-md, .jv-pl-md { padding-left: var(--jv-space-md); }
.ma-none, .jv-ma-none { margin: 0; } .ma-xs, .jv-ma-xs { margin: var(--jv-space-xs); } .ma-sm, .jv-ma-sm { margin: var(--jv-space-sm); } .ma-md, .jv-ma-md { margin: var(--jv-space-md); } .ma-lg, .jv-ma-lg { margin: var(--jv-space-lg); } .ma-xl, .jv-ma-xl { margin: var(--jv-space-xl); }
.mx-auto, .jv-mx-auto { margin-left: auto; margin-right: auto; } .mx-md, .jv-mx-md { margin-left: var(--jv-space-md); margin-right: var(--jv-space-md); } .my-md, .jv-my-md { margin-top: var(--jv-space-md); margin-bottom: var(--jv-space-md); }
.mt-md, .jv-mt-md { margin-top: var(--jv-space-md); } .mb-md, .jv-mb-md { margin-bottom: var(--jv-space-md); } .mt-lg, .jv-mt-lg { margin-top: var(--jv-space-lg); }
.row { display: flex; flex-direction: row; flex-wrap: wrap; } .row.inline { display: inline-flex; } .column { display: flex; flex-direction: column; } .grid { display: grid; } .stack { display: grid; gap: var(--jv-space-md); }
.wrap { flex-wrap: wrap; } .no-wrap { flex-wrap: nowrap; } .reverse-wrap { flex-wrap: wrap-reverse; }
.col { flex: 1 1 0; min-width: 0; } .col-auto { flex: 0 0 auto; } .col-grow { flex: 1 0 auto; } .col-shrink { flex: 0 1 auto; }
.items-center { align-items: center; } .items-start { align-items: flex-start; } .items-end { align-items: flex-end; } .items-stretch { align-items: stretch; }
.justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .justify-around { justify-content: space-around; }
.content-center { align-content: center; } .content-start { align-content: flex-start; } .content-end { align-content: flex-end; } .content-between { align-content: space-between; }
.self-center { align-self: center; } .self-start { align-self: flex-start; } .self-end { align-self: flex-end; } .self-stretch { align-self: stretch; }
.gap-xs { gap: var(--jv-space-xs); } .gap-sm { gap: var(--jv-space-sm); } .gap-md { gap: var(--jv-space-md); } .gap-lg { gap: var(--jv-space-lg); } .gap-xl { gap: var(--jv-space-xl); }
.text-display-lg { font-size: var(--jv-type-display-large-size); line-height: var(--jv-type-display-large-line-height); }
.text-headline-md { font-size: var(--jv-type-headline-large-size); line-height: var(--jv-type-headline-large-line-height); }
.text-title-sm { font-size: var(--jv-type-title-medium-size); line-height: var(--jv-type-title-medium-line-height); }
.text-body-md { font-size: var(--jv-type-body-medium-size); line-height: var(--jv-type-body-medium-line-height); }
.text-label-lg { font-size: var(--jv-type-label-large-size); line-height: var(--jv-type-label-large-line-height); }
.text-left { text-align: left; } .text-center { text-align: center; } .text-right { text-align: right; } .text-justify { text-align: justify; }
.text-weight-light { font-weight: 300; } .text-weight-regular { font-weight: 400; } .text-weight-medium { font-weight: 500; } .text-weight-bold { font-weight: 700; }
.text-uppercase { text-transform: uppercase; } .text-lowercase { text-transform: lowercase; } .text-capitalize { text-transform: capitalize; }
.text-primary { color: var(--jv-color-primary); } .text-secondary { color: var(--jv-color-secondary); } .text-error { color: var(--jv-color-error); }
.bg-surface { background: var(--jv-color-surface); } .bg-primary { background: var(--jv-color-primary); } .text-on-primary { color: var(--jv-color-on-primary); }
.fit { width: 100%; height: 100%; } .full-width { width: 100%; } .full-height { height: 100%; } .window-width { width: 100vw; } .window-height { min-height: 100vh; }
.block { display: block; } .inline-block { display: inline-block; } .hidden { display: none !important; } .invisible { visibility: hidden !important; }
.relative-position { position: relative; } .absolute { position: absolute; } .absolute-full { position: absolute; inset: 0; } .fixed { position: fixed; } .fixed-full { position: fixed; inset: 0; }
.fixed-top { position: fixed; top: 0; right: 0; left: 0; } .fixed-right { position: fixed; top: 0; right: 0; bottom: 0; } .fixed-bottom { position: fixed; right: 0; bottom: 0; left: 0; } .fixed-left { position: fixed; top: 0; bottom: 0; left: 0; }
.float-left { float: left; } .float-right { float: right; } .clear { clear: both; }
.z-top { z-index: 9000; } .z-max { z-index: 9998; }
.scroll { overflow: auto; } .no-scroll { overflow: hidden; } .overflow-hidden { overflow: hidden; }
.ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ellipsis-2-lines { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cursor-pointer { cursor: pointer; } .cursor-not-allowed { cursor: not-allowed; } .cursor-wait { cursor: wait; } .cursor-move { cursor: move; }
.disabled, [disabled] { opacity: 0.55; pointer-events: none; } .loading { cursor: wait; }

.jv-active, .jv-selected, .active:focus-visible, .selected:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.elevation-0 { box-shadow: none; } .elevation-1 { box-shadow: var(--jv-elevation-1); } .elevation-2 { box-shadow: var(--jv-elevation-2); } .elevation-3, .elevation-4, .elevation-5 { box-shadow: var(--jv-elevation-3); }
.radius-md { border-radius: var(--jv-radius-md); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.only-mobile { display: none; }
.show-xs, .show-sm, .show-md, .show-lg, .show-xl { display: none; }
@media (max-width: 599px) { .hide-xs, .only-desktop { display: none !important; } .only-mobile, .show-xs { display: initial; } }
@media (min-width: 600px) and (max-width: 1023px) { .hide-sm { display: none !important; } .show-sm { display: initial; } }
@media (min-width: 1024px) and (max-width: 1439px) { .hide-md { display: none !important; } .show-md { display: initial; } }
@media (min-width: 1440px) and (max-width: 1919px) { .hide-lg { display: none !important; } .show-lg { display: initial; } }
@media (min-width: 1920px) { .hide-xl { display: none !important; } .show-xl { display: initial; } }

:root {
--jv-color-on-secondary: var(--jv-color-on-secondary-fixed, #ffffff);
--jv-color-on-tertiary: #ffffff;
--jv-color-on-error: #ffffff;
--jv-color-positive: #146c2e;
--jv-color-on-positive: #ffffff;
--jv-color-warning: #7a5900;
--jv-color-on-warning: #ffffff;
--jv-color-info: #00639b;
--jv-color-on-info: #ffffff;

--jv-color-surface-container-lowest: #ffffff;
--jv-color-surface-container-low: #f7f6fb;
--jv-color-surface-container: #f2f0f7;
--jv-color-surface-container-high: #ecebf2;
--jv-color-surface-container-highest: #e6e4ed;
--jv-color-surface-variant: #e7e0ec;
--jv-color-on-surface-variant: #49454f;

--jv-color-primary-container: #eaddff;
--jv-color-on-primary-container: #21005d;
--jv-color-error-container: #f9dedc;
--jv-color-on-error-container: #410e0b;

--jv-state-hover: 0.08;
--jv-state-focus: 0.12;
--jv-state-pressed: 0.12;
--jv-state-dragged: 0.16;
--jv-state-disabled-content: 0.38;
--jv-state-disabled-container: 0.12;

--jv-motion-emphasized: 300ms cubic-bezier(0.2, 0, 0, 1);
}

[data-theme="dark"], .theme-dark, .body--dark {
--jv-color-surface-container-lowest: #0b0f19;
--jv-color-surface-container-low: #161b26;
--jv-color-surface-container: #1b2130;
--jv-color-surface-container-high: #232a3a;
--jv-color-surface-container-highest: #2c3344;
--jv-color-surface-variant: #2a2f3d;
--jv-color-on-surface-variant: #cbd5e1;
--jv-color-primary-container: #4f378b;
--jv-color-on-primary-container: #eaddff;
--jv-color-error-container: #8c1d18;
--jv-color-on-error-container: #f9dedc;
--jv-color-positive: #6dd58c;
--jv-color-on-positive: #003912;
--jv-color-warning: #f5bd41;
--jv-color-on-warning: #3d2e00;
--jv-color-info: #8ecdff;
--jv-color-on-info: #003354;
}

.j-row { display: flex; flex-wrap: wrap; min-width: 0; }
.j-row--nowrap { flex-wrap: nowrap; }
.j-row--justify-start { justify-content: flex-start; }
.j-row--justify-end { justify-content: flex-end; }
.j-row--justify-center { justify-content: center; }
.j-row--justify-between { justify-content: space-between; }
.j-row--justify-around { justify-content: space-around; }
.j-row--justify-evenly { justify-content: space-evenly; }
.j-row--align-start { align-items: flex-start; }
.j-row--align-center { align-items: center; }
.j-row--align-end { align-items: flex-end; }
.j-row--align-stretch { align-items: stretch; }
.j-row--align-baseline { align-items: baseline; }
.j-row--gutter-none { gap: 0; }
.j-row--gutter-xs { gap: var(--jv-space-xs); }
.j-row--gutter-sm { gap: var(--jv-space-sm); }
.j-row--gutter-md { gap: var(--jv-space-md); }
.j-row--gutter-lg { gap: var(--jv-space-lg); }
.j-row--gutter-xl { gap: var(--jv-space-xl); }

.j-col { flex: 1 1 0%; min-width: 0; }
.j-col-1 { flex: 0 0 8.3333%; max-width: 8.3333%; }
.j-col-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
.j-col-3 { flex: 0 0 25%; max-width: 25%; }
.j-col-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
.j-col-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
.j-col-6 { flex: 0 0 50%; max-width: 50%; }
.j-col-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
.j-col-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
.j-col-9 { flex: 0 0 75%; max-width: 75%; }
.j-col-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.j-col-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.j-col-12 { flex: 0 0 100%; max-width: 100%; }
.j-col-offset-1 { margin-inline-start: 8.3333%; }
.j-col-offset-2 { margin-inline-start: 16.6667%; }
.j-col-offset-3 { margin-inline-start: 25%; }
.j-col-offset-4 { margin-inline-start: 33.3333%; }
.j-col-offset-5 { margin-inline-start: 41.6667%; }
.j-col-offset-6 { margin-inline-start: 50%; }
.j-col-offset-7 { margin-inline-start: 58.3333%; }
.j-col-offset-8 { margin-inline-start: 66.6667%; }
.j-col-offset-9 { margin-inline-start: 75%; }
.j-col-offset-10 { margin-inline-start: 83.3333%; }
.j-col-offset-11 { margin-inline-start: 91.6667%; }
.j-col-offset-12 { margin-inline-start: 100%; }

@media (min-width: 600px) {
.j-col-sm-1 { flex: 0 0 8.3333%; max-width: 8.3333%; }
.j-col-sm-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
.j-col-sm-3 { flex: 0 0 25%; max-width: 25%; }
.j-col-sm-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
.j-col-sm-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
.j-col-sm-6 { flex: 0 0 50%; max-width: 50%; }
.j-col-sm-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
.j-col-sm-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
.j-col-sm-9 { flex: 0 0 75%; max-width: 75%; }
.j-col-sm-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.j-col-sm-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.j-col-sm-12 { flex: 0 0 100%; max-width: 100%; }
}
@media (min-width: 1024px) {
.j-col-md-1 { flex: 0 0 8.3333%; max-width: 8.3333%; }
.j-col-md-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
.j-col-md-3 { flex: 0 0 25%; max-width: 25%; }
.j-col-md-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
.j-col-md-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
.j-col-md-6 { flex: 0 0 50%; max-width: 50%; }
.j-col-md-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
.j-col-md-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
.j-col-md-9 { flex: 0 0 75%; max-width: 75%; }
.j-col-md-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.j-col-md-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.j-col-md-12 { flex: 0 0 100%; max-width: 100%; }
}
@media (min-width: 1440px) {
.j-col-lg-1 { flex: 0 0 8.3333%; max-width: 8.3333%; }
.j-col-lg-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
.j-col-lg-3 { flex: 0 0 25%; max-width: 25%; }
.j-col-lg-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
.j-col-lg-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
.j-col-lg-6 { flex: 0 0 50%; max-width: 50%; }
.j-col-lg-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
.j-col-lg-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
.j-col-lg-9 { flex: 0 0 75%; max-width: 75%; }
.j-col-lg-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.j-col-lg-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.j-col-lg-12 { flex: 0 0 100%; max-width: 100%; }
}
@media (min-width: 1920px) {
.j-col-xl-1 { flex: 0 0 8.3333%; max-width: 8.3333%; }
.j-col-xl-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
.j-col-xl-3 { flex: 0 0 25%; max-width: 25%; }
.j-col-xl-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
.j-col-xl-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
.j-col-xl-6 { flex: 0 0 50%; max-width: 50%; }
.j-col-xl-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
.j-col-xl-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
.j-col-xl-9 { flex: 0 0 75%; max-width: 75%; }
.j-col-xl-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.j-col-xl-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.j-col-xl-12 { flex: 0 0 100%; max-width: 100%; }
}

.j-layout-container { position: relative; width: 100%; height: 100%; overflow: hidden; }
.j-layout--containerized { height: 100%; min-height: 0; }
.j-layout--standard { min-height: 100vh; }

[class*="j-layout--view-"] { --jv-layout-view: 1; }

.j-section { display: block; width: 100%; min-width: 0; }
.j-section--padded { padding: var(--jv-space-lg) var(--jv-space-md); }
.j-section--full-width { max-width: none; width: 100%; }
.j-page--padding { padding: var(--jv-space-md); }

.j-page-sticky { position: absolute; z-index: 1000; display: flex; }
.j-page-sticky--fixed-top { position: fixed; top: 0; left: 50%; transform: translateX(-50%); }
.j-page-sticky--fixed-bottom { position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); }
.j-page-sticky--fixed-left { position: fixed; left: 0; top: 50%; transform: translateY(-50%); }
.j-page-sticky--fixed-right { position: fixed; right: 0; top: 50%; transform: translateY(-50%); }
.j-page-sticky--fixed-top-left { position: fixed; top: 0; left: 0; }
.j-page-sticky--fixed-top-right { position: fixed; top: 0; right: 0; }
.j-page-sticky--fixed-bottom-left { position: fixed; bottom: 0; left: 0; }
.j-page-sticky--fixed-bottom-right { position: fixed; bottom: 0; right: 0; }
.j-page-sticky__content { display: flex; align-items: center; }
.j-page-sticky__shrink { display: inline-flex; align-items: center; }

.j-page-scroller, j-page-scroller { position: fixed; right: var(--jv-space-md); bottom: var(--jv-space-md); z-index: 1100; display: inline-flex; }

.j-avatar, j-avatar.j-avatar {
display: inline-flex; align-items: center; justify-content: center;
width: 40px; height: 40px; flex: 0 0 auto;
border-radius: 50%; overflow: hidden;
background: var(--jv-color-surface-variant); color: var(--jv-color-on-surface-variant);
font-size: var(--jv-type-label-large-size); line-height: 1; font-weight: 500;
user-select: none;
}
.j-avatar__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.j-avatar__icon { font-size: 24px; line-height: 1; }
.j-avatar__text { text-transform: uppercase; letter-spacing: 0.02em; }
.j-avatar--primary { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }
.j-avatar--secondary { background: var(--jv-color-secondary); color: var(--jv-color-on-secondary); }
.j-avatar--tertiary { background: var(--jv-color-tertiary); color: var(--jv-color-on-tertiary); }
.j-avatar--positive { background: var(--jv-color-positive); color: var(--jv-color-on-positive); }
.j-avatar--negative, .j-avatar--error { background: var(--jv-color-error); color: var(--jv-color-on-error); }
.j-avatar--warning { background: var(--jv-color-warning); color: var(--jv-color-on-warning); }
.j-avatar--info { background: var(--jv-color-info); color: var(--jv-color-on-info); }
.j-avatar--surface { background: var(--jv-color-surface-container-high); color: var(--jv-color-on-surface); }

.j-badge--dot { width: 6px; height: 6px; min-width: 6px; min-height: 6px; padding: 0; border-radius: 50%; font-size: 0; line-height: 0; overflow: hidden; }

.j-alert__icon { flex: 0 0 auto; font-size: 20px; line-height: 1; margin-top: 1px; }
.j-alert__message { flex: 1 1 auto; min-width: 0; }
.j-alert__close {
flex: 0 0 auto; appearance: none; border: 0; background: transparent; color: inherit;
cursor: pointer; border-radius: 50%; width: 28px; height: 28px; line-height: 1;
display: inline-flex; align-items: center; justify-content: center;
transition: background var(--jv-motion-quick);
}
.j-alert__close:hover { background: color-mix(in srgb, currentColor calc(var(--jv-state-hover) * 100%), transparent); }
.j-alert__close:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.j-alert--info { background: color-mix(in srgb, var(--jv-color-info) 14%, var(--jv-color-surface)); color: var(--jv-color-on-surface); border-left: 4px solid var(--jv-color-info); }
.j-alert--success { background: color-mix(in srgb, var(--jv-color-positive) 14%, var(--jv-color-surface)); color: var(--jv-color-on-surface); border-left: 4px solid var(--jv-color-positive); }
.j-alert--warning { background: color-mix(in srgb, var(--jv-color-warning) 16%, var(--jv-color-surface)); color: var(--jv-color-on-surface); border-left: 4px solid var(--jv-color-warning); }
.j-alert--error { background: var(--jv-color-error-container); color: var(--jv-color-on-error-container); border-left: 4px solid var(--jv-color-error); }

.j-banner__content { display: flex; align-items: flex-start; gap: var(--jv-space-md); flex: 1 1 auto; min-width: 0; }
.j-banner__icon { flex: 0 0 auto; font-size: 24px; line-height: 1; color: var(--jv-color-primary); }
.j-banner__message { flex: 1 1 auto; min-width: 0; font-size: var(--jv-type-body-medium-size); line-height: var(--jv-type-body-medium-line-height); }
.j-banner__actions { display: flex; align-items: center; gap: var(--jv-space-sm); flex: 0 0 auto; }
.j-banner--inline { display: flex; align-items: center; }
.j-banner--inline .j-banner__actions { margin-inline-start: auto; }
.j-banner--rounded { border-radius: var(--jv-radius-lg); }

.j-bar__title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--jv-type-title-medium-size); font-weight: 500; }
.j-bar__actions { display: flex; align-items: center; gap: var(--jv-space-xs); flex: 0 0 auto; }
.j-bar--dark { background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface); }

.j-breadcrumbs__list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--jv-space-xs); margin: 0; padding: 0; list-style: none; }
.j-breadcrumbs__item { display: inline-flex; align-items: center; gap: var(--jv-space-xs); font-size: var(--jv-type-body-medium-size); color: var(--jv-color-on-surface-muted); min-width: 0; }
.j-breadcrumbs__item--active { color: var(--jv-color-on-surface); font-weight: 500; }
.j-breadcrumbs__separator { color: var(--jv-color-on-surface-muted); user-select: none; opacity: 0.7; }
.j-breadcrumb { display: inline-flex; align-items: center; gap: var(--jv-space-xs); color: inherit; text-decoration: none; border-radius: var(--jv-radius-xs); min-width: 0; }
.j-breadcrumb:hover { text-decoration: underline; }
.j-breadcrumb:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.j-breadcrumb__icon { font-size: 18px; line-height: 1; flex: 0 0 auto; }
.j-breadcrumb__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.j-button__label { display: inline-block; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.j-button__icon { flex: 0 0 auto; font-size: 18px; line-height: 1; }
.j-button__icon--left { margin-inline-end: 0; }
.j-button__icon--right { margin-inline-start: 0; }
.j-button--primary.j-button--filled, .j-button--primary.j-button--unelevated, .j-button--primary.j-button--push { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }
.j-button--primary.j-button--text, .j-button--primary.j-button--flat, .j-button--primary.j-button--outlined, .j-button--primary.j-button--outline { color: var(--jv-color-primary); }
.j-button-group--spread { display: flex; width: 100%; }
.j-button-group--spread > * { flex: 1 1 0%; }

.j-button-dropdown, j-button-dropdown.j-button-dropdown { position: relative; display: inline-flex; align-items: stretch; }
.j-button-dropdown__panel {
position: absolute; top: calc(100% + 4px); inset-inline-start: 0; z-index: 1200;
min-width: 180px; padding: var(--jv-space-xs);
background: var(--jv-color-surface-container-low); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md);
box-shadow: var(--jv-elevation-2);
}
.j-button-dropdown__panel[hidden] { display: none; }
.j-button-toggle, j-button-toggle.j-button-toggle { display: inline-flex; align-items: stretch; border-radius: 999px; overflow: hidden; border: 1px solid var(--jv-color-outline); }
.j-button-toggle > .j-button { border-radius: 0; box-shadow: none; }
.j-button-toggle > .j-button + .j-button { border-inline-start: 1px solid var(--jv-color-outline); }
.j-button-toggle__btn--active { background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); }

.j-card__section { display: block; padding: var(--jv-space-md); min-width: 0; }
.j-card__section--horiz { display: flex; align-items: center; gap: var(--jv-space-md); }
.j-card__section--vert { display: flex; flex-direction: column; gap: var(--jv-space-sm); }
.j-card__actions { display: flex; align-items: center; gap: var(--jv-space-sm); padding: var(--jv-space-sm) var(--jv-space-md); }
.j-card__actions--horiz { flex-direction: row; }
.j-card__actions--vert { flex-direction: column; align-items: stretch; }

.j-carousel, j-carousel.j-carousel { position: relative; display: block; overflow: hidden; border-radius: var(--jv-radius-md); background: var(--jv-color-surface-container); }
.j-carousel__track { display: flex; transition: transform var(--jv-motion-emphasized); will-change: transform; }
.j-carousel__arrow {
position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
appearance: none; border: 0; cursor: pointer;
width: 40px; height: 40px; border-radius: 50%;
display: inline-flex; align-items: center; justify-content: center;
background: color-mix(in srgb, var(--jv-color-surface) 78%, transparent);
color: var(--jv-color-on-surface); box-shadow: var(--jv-elevation-1);
transition: background var(--jv-motion-quick), box-shadow var(--jv-motion-quick);
}
.j-carousel__arrow:hover { background: var(--jv-color-surface); box-shadow: var(--jv-elevation-2); }
.j-carousel__arrow:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.j-carousel__arrow--prev { inset-inline-start: var(--jv-space-sm); }
.j-carousel__arrow--next { inset-inline-end: var(--jv-space-sm); }
.j-carousel__dots { position: absolute; left: 0; right: 0; bottom: var(--jv-space-sm); z-index: 2; display: flex; justify-content: center; gap: var(--jv-space-xs); }
.j-carousel__dot { width: 8px; height: 8px; border-radius: 50%; background: color-mix(in srgb, var(--jv-color-on-surface) 32%, transparent); cursor: pointer; transition: background var(--jv-motion-quick), width var(--jv-motion-quick); }
.j-carousel__dot--active { background: var(--jv-color-primary); width: 20px; border-radius: 999px; }
.j-carousel__control { position: absolute; z-index: 3; display: inline-flex; }
.j-carousel-slide, j-carousel-slide.j-carousel-slide { flex: 0 0 100%; min-width: 0; position: relative; display: block; }
.j-carousel-slide__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.j-carousel-slide__caption {
position: absolute; left: 0; right: 0; bottom: 0; padding: var(--jv-space-md);
background: linear-gradient(to top, color-mix(in srgb, #000 62%, transparent), transparent);
color: #fff; font-size: var(--jv-type-body-medium-size);
}
.j-carousel-slide--primary { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }
.j-carousel-slide--secondary { background: var(--jv-color-secondary); color: var(--jv-color-on-secondary); }
.j-carousel-slide--tertiary { background: var(--jv-color-tertiary); color: var(--jv-color-on-tertiary); }
.j-carousel-slide--surface { background: var(--jv-color-surface-container-high); color: var(--jv-color-on-surface); }

.j-chat-message, j-chat-message.j-chat-message { display: flex; gap: var(--jv-space-sm); align-items: flex-end; margin-bottom: var(--jv-space-sm); min-width: 0; }
.j-chat-message__avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.j-chat-message__content { display: flex; flex-direction: column; gap: 2px; min-width: 0; max-width: 76%; }
.j-chat-message__name { font-size: 0.75rem; font-weight: 500; color: var(--jv-color-on-surface-muted); }
.j-chat-message__bubble {
padding: var(--jv-space-sm) var(--jv-space-md);
border-radius: var(--jv-radius-lg);
background: var(--jv-color-surface-container-high); color: var(--jv-color-on-surface);
font-size: var(--jv-type-body-medium-size); line-height: var(--jv-type-body-medium-line-height);
overflow-wrap: anywhere;
}
.j-chat-message__stamp { font-size: 0.6875rem; color: var(--jv-color-on-surface-muted); }
.j-chat-message--sent { flex-direction: row-reverse; }
.j-chat-message--sent .j-chat-message__content { align-items: flex-end; }
.j-chat-message--sent .j-chat-message__bubble { background: var(--jv-color-primary); color: var(--jv-color-on-primary); border-bottom-right-radius: var(--jv-radius-xs); }
.j-chat-message--received .j-chat-message__bubble { border-bottom-left-radius: var(--jv-radius-xs); }

.j-chip__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.j-chip__icon { flex: 0 0 auto; font-size: 18px; line-height: 1; }
.j-chip__icon--left { margin-inline-start: -2px; }
.j-chip__icon--right { margin-inline-end: -2px; }
.j-chip--size-xs { min-height: 20px; padding: 0 var(--jv-space-xs); font-size: 0.6875rem; }
.j-chip--size-sm { min-height: 24px; padding: 0 var(--jv-space-sm); font-size: 0.75rem; }
.j-chip--size-md { min-height: 32px; padding: 0 var(--jv-space-md); font-size: 0.875rem; }
.j-chip--size-lg { min-height: 40px; padding: 0 var(--jv-space-md); font-size: 1rem; }
.j-chip--size-xl { min-height: 48px; padding: 0 var(--jv-space-lg); font-size: 1.125rem; }
.j-chip--text-tertiary { color: var(--jv-color-tertiary); }
.j-chip--text-positive { color: var(--jv-color-positive); }
.j-chip--text-warning { color: var(--jv-color-warning); }
.j-chip--text-info { color: var(--jv-color-info); }

.j-chart, j-chart.j-chart { display: block; margin: 0; min-width: 0; color: var(--jv-color-on-surface); }
.j-chart__svg { display: block; width: 100%; height: auto; overflow: visible; }
.j-chart__caption { margin-top: var(--jv-space-sm); font-size: 0.75rem; color: var(--jv-color-on-surface-muted); text-align: center; }
.j-chart__axis { stroke: var(--jv-color-outline); stroke-width: 1; }
.j-chart__bar { fill: var(--jv-color-primary); transition: fill var(--jv-motion-quick); }
.j-chart__bar:hover { fill: color-mix(in srgb, var(--jv-color-primary) 82%, #000); }
.j-chart__line { fill: none; stroke: var(--jv-color-primary); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.j-chart__area { fill: color-mix(in srgb, var(--jv-color-primary) 22%, transparent); stroke: none; }
.j-chart__slice { stroke: var(--jv-color-surface); stroke-width: 1; transition: opacity var(--jv-motion-quick); }
.j-chart__slice:hover { opacity: 0.86; }
.j-chart__slice:nth-of-type(1) { fill: var(--jv-color-primary); }
.j-chart__slice:nth-of-type(2) { fill: var(--jv-color-secondary); }
.j-chart__slice:nth-of-type(3) { fill: var(--jv-color-tertiary); }
.j-chart__slice:nth-of-type(4) { fill: var(--jv-color-positive); }
.j-chart__slice:nth-of-type(5) { fill: var(--jv-color-warning); }
.j-chart__slice:nth-of-type(6) { fill: var(--jv-color-info); }
.j-chart--sparkline .j-chart__svg { height: 40px; }
.j-chart--sparkline .j-chart__axis { display: none; }
.j-chart--bar, .j-chart--line, .j-chart--area, .j-chart--pie { display: block; }

.j-circular-progress, j-circular-progress.j-circular-progress { position: relative; display: inline-flex; align-items: center; justify-content: center; color: var(--jv-color-primary); }
.j-circular-progress svg { display: block; transform: rotate(-90deg); }
.j-circular-progress__track { fill: none; stroke: color-mix(in srgb, currentColor 20%, transparent); }
.j-circular-progress__arc { fill: none; stroke: currentColor; stroke-linecap: round; transition: stroke-dashoffset var(--jv-motion-standard); }
.j-circular-progress__label { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 500; color: var(--jv-color-on-surface); }
.j-circular-progress--indeterminate svg { animation: jv-spin 1.4s linear infinite; }
.j-circular-progress--indeterminate .j-circular-progress__arc { animation: jv-dash 1.4s ease-in-out infinite; }

.j-knob, j-knob.j-knob { position: relative; display: inline-flex; align-items: center; justify-content: center; color: var(--jv-color-primary); }
.j-knob svg { display: block; transform: rotate(-90deg); }
.j-knob__track { fill: none; stroke: color-mix(in srgb, currentColor 20%, transparent); }
.j-knob__arc { fill: none; stroke: currentColor; stroke-linecap: round; transition: stroke-dashoffset var(--jv-motion-standard); }
.j-knob__value { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: var(--jv-type-title-medium-size); font-weight: 500; color: var(--jv-color-on-surface); }
.j-knob__label { position: absolute; left: 0; right: 0; bottom: -1.4em; text-align: center; font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }

@keyframes jv-spin { to { transform: rotate(270deg); } }
@keyframes jv-dash {
0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; }
50% { stroke-dasharray: 90, 200; stroke-dashoffset: -35; }
100% { stroke-dasharray: 90, 200; stroke-dashoffset: -125; }
}

.j-command-bar, j-command-bar.j-command-bar {
display: flex; flex-direction: column; min-width: 0;
background: var(--jv-color-surface-container-low); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-lg);
box-shadow: var(--jv-elevation-3); overflow: hidden;
}
.j-command-bar__field { display: flex; align-items: center; gap: var(--jv-space-sm); padding: var(--jv-space-sm) var(--jv-space-md); border-bottom: 1px solid var(--jv-color-outline); }
.j-command-bar__icon { flex: 0 0 auto; color: var(--jv-color-on-surface-muted); font-size: 18px; }
.j-command-bar__input { flex: 1 1 auto; min-width: 0; border: 0; background: transparent; color: inherit; font: inherit; outline: none; padding: var(--jv-space-xs) 0; }
.j-command-bar__hint { flex: 0 0 auto; padding: 2px 6px; border-radius: var(--jv-radius-xs); background: var(--jv-color-surface-container-high); color: var(--jv-color-on-surface-muted); font-size: 0.6875rem; font-family: var(--jv-font-mono, monospace); }
.j-command-bar__list { margin: 0; padding: var(--jv-space-xs); list-style: none; max-height: 320px; overflow-y: auto; }
.j-command-bar__empty { padding: var(--jv-space-md); text-align: center; color: var(--jv-color-on-surface-muted); font-size: var(--jv-type-body-medium-size); }
.j-command-bar__item {
display: flex; align-items: center; gap: var(--jv-space-sm);
padding: var(--jv-space-sm) var(--jv-space-md); border-radius: var(--jv-radius-sm);
cursor: pointer; min-width: 0;
transition: background var(--jv-motion-quick);
}
.j-command-bar__item:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-command-bar__item--active { background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); }
.j-command-bar__item-icon { flex: 0 0 auto; font-size: 20px; line-height: 1; color: var(--jv-color-on-surface-variant); }
.j-command-bar__item-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.j-command-bar__item-group { flex: 0 0 auto; font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }
.j-command-bar__item-shortcut { flex: 0 0 auto; padding: 2px 6px; border-radius: var(--jv-radius-xs); background: var(--jv-color-surface-container-high); color: var(--jv-color-on-surface-muted); font-size: 0.6875rem; font-family: var(--jv-font-mono, monospace); }

.j-context-menu, j-context-menu.j-context-menu {
position: fixed; z-index: 1300; min-width: 180px; padding: var(--jv-space-xs);
background: var(--jv-color-surface-container-low); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md);
box-shadow: var(--jv-elevation-3);
}
.j-context-menu[hidden] { display: none; }

.j-datagrid, .j-data-grid, j-data-grid.j-data-grid {
display: flex; flex-direction: column; min-width: 0;
background: var(--jv-color-surface); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md); overflow: hidden;
}
.j-datagrid__toolbar { display: flex; align-items: center; gap: var(--jv-space-sm); padding: var(--jv-space-sm) var(--jv-space-md); border-bottom: 1px solid var(--jv-color-outline); background: var(--jv-color-surface-container-low); }
.j-datagrid__filter { flex: 1 1 auto; min-width: 0; min-height: 36px; padding: 0 var(--jv-space-sm); font: inherit; color: inherit; background: var(--jv-color-surface); border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); }
.j-datagrid__filter:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: -1px; }
.j-datagrid__selection-count { flex: 0 0 auto; font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }
.j-datagrid__loading { padding: var(--jv-space-sm) var(--jv-space-md); font-size: 0.75rem; color: var(--jv-color-on-surface-muted); background: var(--jv-color-surface-container-low); }
.j-datagrid__table { width: 100%; border-collapse: collapse; font-size: var(--jv-type-body-medium-size); }
.j-datagrid__table th, .j-datagrid__table td { padding: var(--jv-space-sm) var(--jv-space-md); text-align: start; border-bottom: 1px solid var(--jv-color-outline); }
.j-datagrid__table th { font-weight: 500; color: var(--jv-color-on-surface-variant); background: var(--jv-color-surface-container-low); white-space: nowrap; }
.j-datagrid__table--striped tbody tr:nth-child(even) { background: color-mix(in srgb, var(--jv-color-on-surface) 4%, transparent); }
.j-datagrid__table tbody tr:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-datagrid__th--sortable { cursor: pointer; user-select: none; }
.j-datagrid__sort { appearance: none; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: var(--jv-space-xs); padding: 0; }
.j-datagrid__sort:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.j-datagrid__sort-icon { font-size: 16px; line-height: 1; color: var(--jv-color-primary); }
.j-datagrid__select-col { width: 44px; text-align: center; }
.j-datagrid__checkbox { width: 16px; height: 16px; accent-color: var(--jv-color-primary); cursor: pointer; }
.j-datagrid__row--selected { background: var(--jv-color-secondary-container) !important; color: var(--jv-color-on-secondary-container); }
.j-datagrid__empty { padding: var(--jv-space-xl) var(--jv-space-md); text-align: center; color: var(--jv-color-on-surface-muted); }
.j-datagrid__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--jv-space-md); padding: var(--jv-space-sm) var(--jv-space-md); border-top: 1px solid var(--jv-color-outline); background: var(--jv-color-surface-container-low); }
.j-datagrid__range { font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }
.j-datagrid__pager { display: flex; align-items: center; gap: var(--jv-space-xs); }
.j-datagrid__page-indicator { font-size: 0.75rem; color: var(--jv-color-on-surface-muted); min-width: 6ch; text-align: center; }
.j-datagrid__page-btn {
appearance: none; cursor: pointer; width: 32px; height: 32px; border-radius: 50%;
display: inline-flex; align-items: center; justify-content: center;
border: 1px solid var(--jv-color-outline); background: var(--jv-color-surface); color: inherit;
transition: background var(--jv-motion-quick);
}
.j-datagrid__page-btn:hover:not(:disabled) { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-datagrid__page-btn:disabled { opacity: var(--jv-state-disabled-content); cursor: not-allowed; }
.j-datagrid__page-btn:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }

.j-date-picker, .j-time-picker, .j-color-picker, .j-file,
j-date-picker.j-date-picker, j-time-picker.j-time-picker, j-color-picker.j-color-picker, j-file.j-file {
display: inline-flex; flex-direction: column; gap: var(--jv-space-xs); min-width: 0;
}
.j-date-picker__label, .j-time-picker__label, .j-color-picker__label, .j-file__label {
font-size: var(--jv-type-label-large-size); line-height: var(--jv-type-label-large-line-height);
color: var(--jv-color-on-surface-variant);
}
.j-date-picker__input, .j-time-picker__input {
min-height: 40px; padding: 0 var(--jv-space-sm); font: inherit; color: inherit;
background: var(--jv-color-surface); border: 1px solid var(--jv-color-outline);
border-radius: var(--jv-shape-radius);
transition: border-color var(--jv-motion-quick), box-shadow var(--jv-motion-quick);
}
.j-date-picker__input:focus-visible, .j-time-picker__input:focus-visible {
outline: none; border-color: var(--jv-color-primary);
box-shadow: 0 0 0 2px color-mix(in srgb, var(--jv-color-primary) 24%, transparent);
}
.j-color-picker { flex-direction: row; align-items: center; gap: var(--jv-space-sm); }
.j-color-picker__input { width: 40px; height: 40px; padding: 0; border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm); background: none; cursor: pointer; }
.j-color-picker__swatch { display: inline-block; width: 20px; height: 20px; border-radius: var(--jv-radius-xs); border: 1px solid var(--jv-color-outline); }
.j-file__input { font: inherit; color: inherit; }
.j-file__input::file-selector-button {
margin-inline-end: var(--jv-space-sm); padding: var(--jv-space-xs) var(--jv-space-md);
border: 0; border-radius: 999px; cursor: pointer; font: inherit;
background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container);
}
.j-file__preview { display: flex; flex-wrap: wrap; gap: var(--jv-space-xs); font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }

.j-drawer__content { height: 100%; overflow-y: auto; min-width: 0; }
.j-drawer--bordered { border-inline-end: 1px solid var(--jv-color-outline); }
.j-drawer--right.j-drawer--bordered { border-inline-end: 0; border-inline-start: 1px solid var(--jv-color-outline); }
.j-drawer--elevated { box-shadow: var(--jv-elevation-2); }
.j-drawer--dark { background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface); }
.j-drawer--mini { width: 56px; min-width: 56px; overflow-x: hidden; }
.j-drawer--mini-overlay { position: absolute; z-index: 1250; }
.j-drawer--no-mini-animate { transition: none !important; }
.j-drawer--on-top { z-index: 1300; }

.j-dropdown__trigger { display: inline-flex; align-items: center; gap: var(--jv-space-xs); cursor: pointer; }

.j-editor, j-editor.j-editor {
display: flex; flex-direction: column; min-width: 0;
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md);
background: var(--jv-color-surface); overflow: hidden;
}
.j-editor__toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--jv-space-xs); padding: var(--jv-space-xs) var(--jv-space-sm); border-bottom: 1px solid var(--jv-color-outline); background: var(--jv-color-surface-container-low); }
.j-editor__content { min-height: 160px; padding: var(--jv-space-md); border: 0; outline: none; resize: vertical; font: inherit; color: inherit; background: transparent; }
.j-editor--dense .j-editor__content { min-height: 96px; padding: var(--jv-space-sm); }
.j-code-editor, j-code-editor.j-code-editor {
display: block; min-width: 0;
font-family: var(--jv-font-mono, ui-monospace, monospace); font-size: 0.875rem; line-height: 1.6;
background: var(--jv-color-surface-container-lowest); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md); overflow: auto;
}

.j-expansion-item, j-expansion-item.j-expansion-item { display: block; border-bottom: 1px solid var(--jv-color-outline); min-width: 0; }
.j-expansion-item__header {
display: flex; align-items: center; gap: var(--jv-space-md); cursor: pointer; list-style: none;
padding: var(--jv-space-md); min-height: 48px; user-select: none;
transition: background var(--jv-motion-quick);
}
.j-expansion-item__header::-webkit-details-marker { display: none; }
.j-expansion-item__header:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-expansion-item__header:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: -2px; }
.j-expansion-item__icon { flex: 0 0 auto; font-size: 24px; line-height: 1; color: var(--jv-color-on-surface-variant); }
.j-expansion-item__label-wrap { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.j-expansion-item__label { font-size: var(--jv-type-body-medium-size); overflow: hidden; text-overflow: ellipsis; }
.j-expansion-item__caption { font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }
.j-expansion-item__arrow { flex: 0 0 auto; font-size: 24px; line-height: 1; color: var(--jv-color-on-surface-variant); transition: transform var(--jv-motion-standard); }
.j-expansion-item[open] > .j-expansion-item__header .j-expansion-item__arrow { transform: rotate(180deg); }
.j-expansion-item__content { padding: 0 var(--jv-space-md) var(--jv-space-md); }
.j-expansion-item--dense .j-expansion-item__header { min-height: 40px; padding: var(--jv-space-sm) var(--jv-space-md); }
.j-expansion-item--dense .j-expansion-item__content { padding: 0 var(--jv-space-md) var(--jv-space-sm); }

.j-expansion-panel, j-expansion-panel.j-expansion-panel { display: block; border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md); background: var(--jv-color-surface); overflow: hidden; }
.j-expansion-panel__title { display: flex; align-items: center; gap: var(--jv-space-sm); padding: var(--jv-space-md); font-weight: 500; cursor: pointer; }
.j-expansion-panel__body { padding: 0 var(--jv-space-md) var(--jv-space-md); }

.j-fab, j-fab.j-fab { position: relative; display: inline-flex; align-items: center; z-index: 1000; }
.j-fab--fixed { position: fixed; z-index: 1100; }
.j-fab--align-left { justify-content: flex-start; }
.j-fab--align-center { justify-content: center; }
.j-fab--align-right { justify-content: flex-end; }
.j-fab__trigger {
width: 56px; height: 56px; min-height: 56px; padding: 0; border: 0; border-radius: var(--jv-radius-lg);
display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
background: var(--jv-color-primary-container); color: var(--jv-color-on-primary-container);
box-shadow: var(--jv-elevation-2);
transition: box-shadow var(--jv-motion-standard), background var(--jv-motion-quick);
}
.j-fab__trigger:hover { box-shadow: var(--jv-elevation-3); }
.j-fab__trigger:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.j-fab--mini .j-fab__trigger, .j-fab__trigger.j-fab--mini { width: 40px; height: 40px; min-height: 40px; border-radius: var(--jv-radius-md); }
.j-fab--primary { background: var(--jv-color-primary-container); color: var(--jv-color-on-primary-container); }
.j-fab--secondary { background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); }
.j-fab--tertiary { background: var(--jv-color-tertiary); color: var(--jv-color-on-tertiary); }
.j-fab--surface { background: var(--jv-color-surface-container-high); color: var(--jv-color-primary); }
.j-fab__icon-holder { position: relative; width: 24px; height: 24px; flex: 0 0 auto; }
.j-fab__icon, .j-fab__active-icon { display: inline-flex; align-items: center; justify-content: center; font-size: 24px; line-height: 1; transition: opacity var(--jv-motion-quick), transform var(--jv-motion-quick); }
.j-fab__active-icon { opacity: 0; transform: rotate(-45deg); }
.j-fab[data-open="true"] .j-fab__icon { opacity: 0; transform: rotate(45deg); }
.j-fab[data-open="true"] .j-fab__active-icon { opacity: 1; transform: rotate(0deg); }
.j-fab__label { margin-inline-start: var(--jv-space-sm); font-size: var(--jv-type-label-large-size); font-weight: 500; }
.j-fab__trigger:has(.j-fab__label) { width: auto; padding: 0 var(--jv-space-md); }
.j-fab__actions { position: absolute; display: flex; gap: var(--jv-space-sm); align-items: center; transition: opacity var(--jv-motion-standard), transform var(--jv-motion-standard); }
.j-fab__actions--up { flex-direction: column-reverse; bottom: calc(100% + var(--jv-space-sm)); left: 50%; transform: translateX(-50%); }
.j-fab__actions--down { flex-direction: column; top: calc(100% + var(--jv-space-sm)); left: 50%; transform: translateX(-50%); }
.j-fab__actions--left { flex-direction: row-reverse; right: calc(100% + var(--jv-space-sm)); top: 50%; transform: translateY(-50%); }
.j-fab__actions--right { flex-direction: row; left: calc(100% + var(--jv-space-sm)); top: 50%; transform: translateY(-50%); }
.j-fab__actions--closed { opacity: 0; pointer-events: none; }
.j-fab-action, j-fab-action.j-fab-action {
width: 40px; height: 40px; border: 0; border-radius: var(--jv-radius-md); cursor: pointer;
display: inline-flex; align-items: center; justify-content: center;
background: var(--jv-color-surface-container-high); color: var(--jv-color-on-surface);
box-shadow: var(--jv-elevation-1); transition: box-shadow var(--jv-motion-quick);
}
.j-fab-action:hover { box-shadow: var(--jv-elevation-2); }
.j-fab-action__label { margin-inline-start: var(--jv-space-sm); font-size: 0.875rem; }

.j-field__control { display: flex; align-items: center; gap: var(--jv-space-sm); min-width: 0; width: 100%; }
.j-field__bottom { display: flex; align-items: center; justify-content: space-between; gap: var(--jv-space-sm); min-height: 20px; font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }
.j-field--error { color: var(--jv-color-error); }
.j-field--error .j-input, .j-field--error .j-textarea, .j-field--error .j-select__native { border-color: var(--jv-color-error); }
.j-field--required .j-field__label::after { content: " *"; color: var(--jv-color-error); }
.j-field--readonly .j-input, .j-field--readonly .j-textarea { background: var(--jv-color-surface-container); cursor: default; }

.j-form, j-form.j-form { display: flex; flex-direction: column; gap: var(--jv-space-md); min-width: 0; }
.j-json-form, j-json-form.j-json-form { display: flex; flex-direction: column; gap: var(--jv-space-md); min-width: 0; }

.j-header--elevated { box-shadow: var(--jv-elevation-2); }
.j-footer--elevated { box-shadow: 0 -6px 18px rgba(15, 23, 42, 0.14); }
.j-header--bordered { border-bottom: 1px solid var(--jv-color-outline); }
.j-footer--bordered { border-top: 1px solid var(--jv-color-outline); }
.j-header--reveal, .j-footer--reveal { transition: transform var(--jv-motion-standard); will-change: transform; }
.j-header--hidden { transform: translateY(-100%); }
.j-footer--hidden { transform: translateY(100%); }

.j-img-wrap { position: relative; display: block; overflow: hidden; background: var(--jv-color-surface-container); }
.j-img, j-img.j-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.j-video, j-video.j-video { position: relative; display: block; width: 100%; overflow: hidden; border-radius: var(--jv-radius-md); background: #000; }
.j-video__inner { display: block; width: 100%; height: 100%; }
.j-parallax, j-parallax.j-parallax { position: relative; display: block; overflow: hidden; min-height: 240px; }
.j-parallax__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; will-change: transform; z-index: 0; }
.j-parallax__content { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; height: 100%; }
.j-lazy, j-lazy.j-lazy { display: block; min-width: 0; }
.j-lazy__placeholder { display: block; background: var(--jv-color-surface-container); border-radius: var(--jv-radius-sm); min-height: 24px; }
.j-lazy__content { display: contents; }

.j-infinite-scroll, j-infinite-scroll.j-infinite-scroll { display: block; overflow-y: auto; min-height: 0; }
.j-infinite-scroll--horizontal { overflow-x: auto; overflow-y: hidden; display: flex; }
.j-infinite-scroll__sentinel { flex: 0 0 auto; width: 100%; height: 1px; }
.j-virtual-scroll, j-virtual-scroll.j-virtual-scroll { display: block; overflow-y: auto; min-height: 0; position: relative; }
.j-virtual-scroll--horizontal { overflow-x: auto; overflow-y: hidden; }
.j-virtual-scroll__item { min-width: 0; }

.j-scroll-area, j-scroll-area.j-scroll-area { position: relative; overflow: hidden; display: block; min-height: 0; }
.j-scroll-area__content { overflow: auto; height: 100%; width: 100%; scrollbar-width: none; }
.j-scroll-area__content::-webkit-scrollbar { display: none; }
.j-scroll-area--horizontal .j-scroll-area__content { overflow-x: auto; overflow-y: hidden; }
.j-scroll-area__bar { position: absolute; background: transparent; opacity: 0; transition: opacity var(--jv-motion-quick); }
.j-scroll-area:hover .j-scroll-area__bar { opacity: 1; }
.j-scroll-area__bar--v { top: 0; bottom: 0; inset-inline-end: 0; width: 8px; }
.j-scroll-area__bar--h { left: 0; right: 0; bottom: 0; height: 8px; }
.j-scroll-area__thumb { position: absolute; border-radius: 999px; background: color-mix(in srgb, var(--jv-color-on-surface) 32%, transparent); }
.j-scroll-area__thumb--v { inset-inline: 1px; top: 0; min-height: 24px; }
.j-scroll-area__thumb--h { inset-block: 1px; left: 0; min-width: 24px; }
.j-scroll-area--dark { background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface); }
.j-scroll-area--dark .j-scroll-area__thumb { background: color-mix(in srgb, #fff 40%, transparent); }

.j-resize-observer, j-resize-observer.j-resize-observer,
.j-scroll-observer, j-scroll-observer.j-scroll-observer { display: block; position: absolute; inset: 0; pointer-events: none; visibility: hidden; }

.j-inner-loading, j-inner-loading.j-inner-loading {
position: absolute; inset: 0; z-index: 900;
display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--jv-space-sm);
background: color-mix(in srgb, var(--jv-color-surface) 72%, transparent);
transition: opacity var(--jv-motion-quick);
}
.j-inner-loading--hidden { display: none; }
.j-inner-loading__label { font-size: var(--jv-type-body-medium-size); color: var(--jv-color-on-surface-muted); }
.j-inner-loading--primary { color: var(--jv-color-primary); }
.j-inner-loading--secondary { color: var(--jv-color-secondary); }

.j-item, .j-list-item, j-item.j-item, j-list-item.j-list-item {
display: flex; align-items: center; gap: var(--jv-space-md);
min-height: 48px; padding: var(--jv-space-sm) var(--jv-space-md);
color: inherit; text-decoration: none; min-width: 0;
transition: background var(--jv-motion-quick);
}
.j-item-type { position: relative; }
.j-item--clickable { cursor: pointer; }
.j-item--clickable:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-item--clickable:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: -2px; }
.j-item--active { background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); }
.j-item--dense { min-height: 40px; padding: var(--jv-space-xs) var(--jv-space-md); }
.j-item--dark { background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface); }

.j-item__section { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.j-item__section--main { flex: 1 1 auto; min-width: 0; }
.j-item__section--side { flex: 0 0 auto; color: var(--jv-color-on-surface-variant); }
.j-item__section--top { align-self: flex-start; }
.j-item__section--avatar { flex: 0 0 auto; min-width: 40px; }
.j-item__section--thumbnail { flex: 0 0 auto; min-width: 56px; }
.j-item__section--nowrap { flex-wrap: nowrap; white-space: nowrap; }

.j-item-label, .j-item__label, j-item-label.j-item-label {
display: block; min-width: 0;
font-size: var(--jv-type-body-medium-size); line-height: var(--jv-type-body-medium-line-height);
}
.j-item__label--caption { font-size: 0.75rem; line-height: 1.4; color: var(--jv-color-on-surface-muted); }
.j-item__label--overline { font-size: 0.6875rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--jv-color-on-surface-muted); }
.j-item__label--header { font-size: var(--jv-type-title-medium-size); font-weight: 500; color: var(--jv-color-on-surface-variant); padding: var(--jv-space-sm) 0; }

.j-list--bordered { border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md); }
.j-list--dense .j-item, .j-list--dense .j-list-item { min-height: 40px; padding: var(--jv-space-xs) var(--jv-space-md); }
.j-list--padding { padding: var(--jv-space-sm) 0; }
.j-list--separator > * + * { border-top: 1px solid var(--jv-color-outline); }
.j-list--dark { background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface); }

.j-menu-item, .j-menu__item, j-menu-item.j-menu-item {
display: flex; align-items: center; gap: var(--jv-space-sm);
min-height: 40px; padding: var(--jv-space-xs) var(--jv-space-md);
border-radius: var(--jv-radius-sm); cursor: pointer; color: inherit; text-decoration: none;
min-width: 0; transition: background var(--jv-motion-quick);
}
.j-menu-item:hover, .j-menu__item:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-menu-item:focus-visible, .j-menu__item:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: -2px; }
.j-menu-item__icon, .j-menu__icon { flex: 0 0 auto; font-size: 20px; line-height: 1; color: var(--jv-color-on-surface-variant); }
.j-menu-item__label, .j-menu__label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.j-menu__shortcut { flex: 0 0 auto; font-size: 0.6875rem; color: var(--jv-color-on-surface-muted); font-family: var(--jv-font-mono, monospace); }
.j-menu__action { flex: 0 0 auto; display: inline-flex; align-items: center; }
.j-menu__divider { height: 1px; margin: var(--jv-space-xs) 0; background: var(--jv-color-outline); border: 0; }
.j-menu__item--danger { color: var(--jv-color-error); }
.j-menu__item--danger .j-menu-item__icon, .j-menu__item--danger .j-menu__icon { color: var(--jv-color-error); }

.j-markup-table, j-markup-table.j-markup-table {
width: 100%; border-collapse: collapse;
font-size: var(--jv-type-body-medium-size); color: var(--jv-color-on-surface);
background: var(--jv-color-surface);
}
.j-markup-table th, .j-markup-table td { padding: var(--jv-space-sm) var(--jv-space-md); text-align: start; border-bottom: 1px solid var(--jv-color-outline); }
.j-markup-table th { font-weight: 500; color: var(--jv-color-on-surface-variant); }
.j-markup-table--dense th, .j-markup-table--dense td { padding: var(--jv-space-xs) var(--jv-space-sm); }
.j-markup-table--bordered, .j-markup-table--bordered th, .j-markup-table--bordered td { border: 1px solid var(--jv-color-outline); }
.j-markup-table--striped tbody tr:nth-child(even) { background: color-mix(in srgb, var(--jv-color-on-surface) 4%, transparent); }

.j-map, j-map.j-map { position: relative; display: block; min-height: 240px; border-radius: var(--jv-radius-md); overflow: hidden; background: var(--jv-color-surface-container); }
.j-map__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.j-map__fallback { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--jv-space-xs); padding: var(--jv-space-md); text-align: center; background: var(--jv-color-surface-container); }
.j-map__fallback-title { font-size: var(--jv-type-title-medium-size); font-weight: 500; color: var(--jv-color-on-surface); }
.j-map__fallback-reason { font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }

.j-notify, j-notify.j-notify {
display: flex; align-items: center; gap: var(--jv-space-sm);
padding: var(--jv-space-sm) var(--jv-space-md); border-radius: var(--jv-radius-sm);
background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface);
box-shadow: var(--jv-elevation-2); min-width: 0;
}
.j-notify__icon { flex: 0 0 auto; font-size: 20px; line-height: 1; }
.j-notify__message { flex: 1 1 auto; min-width: 0; font-size: var(--jv-type-body-medium-size); }
.j-notify--info { background: var(--jv-color-info); color: var(--jv-color-on-info); }
.j-notify--positive, .j-notify--success { background: var(--jv-color-positive); color: var(--jv-color-on-positive); }
.j-notify--warning { background: var(--jv-color-warning); color: var(--jv-color-on-warning); }
.j-notify--negative, .j-notify--error { background: var(--jv-color-error); color: var(--jv-color-on-error); }
.j-notify--primary { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }

.j-option-group, j-option-group.j-option-group { display: flex; flex-direction: column; gap: var(--jv-space-xs); border: 0; margin: 0; padding: 0; min-width: 0; }
.j-option-group--inline { flex-direction: row; flex-wrap: wrap; gap: var(--jv-space-md); }
.j-option-group__item { display: inline-flex; align-items: center; gap: var(--jv-space-sm); cursor: pointer; min-width: 0; }
.j-option-group__item input { accent-color: var(--jv-color-primary); width: 18px; height: 18px; cursor: pointer; }
.j-option-group__label { min-width: 0; font-size: var(--jv-type-body-medium-size); }

.j-radio, j-radio.j-radio { display: inline-flex; align-items: center; gap: var(--jv-space-sm); cursor: pointer; min-width: 0; }
.j-radio__input {
appearance: none; width: 20px; height: 20px; flex: 0 0 auto; margin: 0; cursor: pointer;
border: 2px solid var(--jv-color-outline); border-radius: 50%;
display: inline-grid; place-content: center;
transition: border-color var(--jv-motion-quick), box-shadow var(--jv-motion-quick);
}
.j-radio__input::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--jv-color-primary); transform: scale(0); transition: transform var(--jv-motion-quick); }
.j-radio__input:checked { border-color: var(--jv-color-primary); }
.j-radio__input:checked::before { transform: scale(1); }
.j-radio__input:focus-visible { outline: none; box-shadow: 0 0 0 4px color-mix(in srgb, var(--jv-color-primary) calc(var(--jv-state-focus) * 100%), transparent); }
.j-radio__input:disabled { opacity: var(--jv-state-disabled-content); cursor: not-allowed; }
.j-radio__label { min-width: 0; font-size: var(--jv-type-body-medium-size); }

.j-pagination, j-pagination.j-pagination { display: block; min-width: 0; }
.j-pagination__list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--jv-space-xs); margin: 0; padding: 0; list-style: none; }
.j-pagination__btn {
appearance: none; cursor: pointer; min-width: 36px; height: 36px; padding: 0 var(--jv-space-xs);
display: inline-flex; align-items: center; justify-content: center;
border: 0; border-radius: 50%; background: transparent; color: var(--jv-color-on-surface);
font: inherit; transition: background var(--jv-motion-quick), color var(--jv-motion-quick);
}
.j-pagination__btn:hover:not(:disabled) { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-pagination__btn:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.j-pagination__btn:disabled { opacity: var(--jv-state-disabled-content); cursor: not-allowed; }
.j-pagination__btn--active { background: var(--jv-color-primary); color: var(--jv-color-on-primary); font-weight: 500; }
.j-pagination__btn--active:hover { background: var(--jv-color-primary); }
.j-pagination__prev, .j-pagination__next { display: inline-flex; }
.j-pagination__ellipsis { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; color: var(--jv-color-on-surface-muted); user-select: none; }

.j-popup-edit, j-popup-edit.j-popup-edit { position: relative; display: inline-flex; align-items: center; min-width: 0; }
.j-popup-edit__value { cursor: pointer; border-bottom: 1px dashed var(--jv-color-outline); min-width: 0; }
.j-popup-edit__value:hover { border-bottom-color: var(--jv-color-primary); }
.j-popup-edit__popup {
position: absolute; top: calc(100% + 4px); inset-inline-start: 0; z-index: 1250;
display: flex; flex-direction: column; gap: var(--jv-space-sm);
min-width: 220px; padding: var(--jv-space-md);
background: var(--jv-color-surface-container-low); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md);
box-shadow: var(--jv-elevation-3);
}
.j-popup-edit__popup[hidden] { display: none; }
.j-popup-edit__label { font-size: var(--jv-type-label-large-size); color: var(--jv-color-on-surface-variant); }
.j-popup-edit__input { min-height: 40px; padding: 0 var(--jv-space-sm); font: inherit; color: inherit; background: var(--jv-color-surface); border: 1px solid var(--jv-color-outline); border-radius: var(--jv-shape-radius); }
.j-popup-edit__input:focus-visible { outline: none; border-color: var(--jv-color-primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--jv-color-primary) 24%, transparent); }
.j-popup-edit__actions { display: flex; justify-content: flex-end; gap: var(--jv-space-sm); }

.j-progress, j-progress.j-progress {
display: block; width: 100%; height: 4px; overflow: hidden;
border-radius: 999px; background: color-mix(in srgb, var(--jv-color-primary) 20%, transparent);
color: var(--jv-color-primary);
}
.j-progress__fill { height: 100%; background: currentColor; border-radius: inherit; transition: width var(--jv-motion-standard); }
.j-progress__fill--striped {
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.22) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.22) 50%, rgba(255, 255, 255, 0.22) 75%, transparent 75%, transparent);
background-size: 16px 16px;
animation: jv-progress-stripes 1s linear infinite;
}
.j-progress--indeterminate { position: relative; }

.j-progress--indeterminate::after {
content: ""; position: absolute; inset-inline-start: -40%; inset-block: 0; width: 40%;
background: currentColor; border-radius: inherit;
animation: jv-progress-indeterminate 1.4s ease-in-out infinite;
}
.j-progress--primary { color: var(--jv-color-primary); background: color-mix(in srgb, var(--jv-color-primary) 20%, transparent); }
.j-progress--secondary { color: var(--jv-color-secondary); background: color-mix(in srgb, var(--jv-color-secondary) 20%, transparent); }
.j-progress--tertiary { color: var(--jv-color-tertiary); background: color-mix(in srgb, var(--jv-color-tertiary) 20%, transparent); }
.j-progress--positive { color: var(--jv-color-positive); background: color-mix(in srgb, var(--jv-color-positive) 20%, transparent); }
.j-progress--negative, .j-progress--error { color: var(--jv-color-error); background: color-mix(in srgb, var(--jv-color-error) 20%, transparent); }
.j-progress--warning { color: var(--jv-color-warning); background: color-mix(in srgb, var(--jv-color-warning) 20%, transparent); }
@keyframes jv-progress-stripes { to { background-position: 16px 0; } }
@keyframes jv-progress-indeterminate {
0% { inset-inline-start: -40%; }
100% { inset-inline-start: 100%; }
}

.j-range, j-range.j-range { display: flex; align-items: center; gap: var(--jv-space-sm); min-width: 0; }
.j-range__from, .j-range__to { flex: 1 1 0%; min-width: 0; accent-color: var(--jv-color-primary); cursor: pointer; }
.j-range--primary { accent-color: var(--jv-color-primary); }
.j-range--secondary { accent-color: var(--jv-color-secondary); }

.j-slider, j-slider.j-slider { display: flex; flex-direction: column; gap: var(--jv-space-xs); min-width: 0; }
.j-slider__label { font-size: var(--jv-type-label-large-size); color: var(--jv-color-on-surface-variant); }
.j-slider__native { width: 100%; accent-color: var(--jv-color-primary); cursor: pointer; height: 20px; }
.j-slider__native:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 4px; }
.j-slider__native:disabled { opacity: var(--jv-state-disabled-content); cursor: not-allowed; }
.j-slider--primary { accent-color: var(--jv-color-primary); }
.j-slider--secondary { accent-color: var(--jv-color-secondary); }

.j-rating, j-rating.j-rating { display: inline-flex; align-items: center; gap: 2px; color: var(--jv-color-warning); }
.j-rating__star { font-size: 24px; line-height: 1; cursor: pointer; transition: transform var(--jv-motion-quick), color var(--jv-motion-quick); }
.j-rating__star:hover { transform: scale(1.14); }
.j-rating__star[aria-checked="false"], .j-rating__star[data-filled="false"] { color: color-mix(in srgb, var(--jv-color-on-surface) 26%, transparent); }

.j-skeleton, j-skeleton.j-skeleton {
display: block; background: color-mix(in srgb, var(--jv-color-on-surface) 11%, transparent);
border-radius: var(--jv-radius-xs); min-height: 1em;
}
.j-skeleton--text { height: 1em; border-radius: var(--jv-radius-xs); }
.j-skeleton--rect { border-radius: var(--jv-radius-sm); }
.j-skeleton--circle { border-radius: 50%; }
.j-skeleton--animated {
background-image: linear-gradient(90deg, transparent, color-mix(in srgb, var(--jv-color-on-surface) 8%, transparent), transparent);
background-size: 200% 100%;
animation: jv-skeleton-shimmer 1.4s ease-in-out infinite;
}
@keyframes jv-skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

.j-slide-item, j-slide-item.j-slide-item { position: relative; display: block; overflow: hidden; touch-action: pan-y; }
.j-slide-item__content { position: relative; z-index: 1; background: var(--jv-color-surface); transition: transform var(--jv-motion-standard); }
.j-slide-item__action { position: absolute; top: 0; bottom: 0; z-index: 0; display: flex; align-items: center; justify-content: center; width: 72px; color: #fff; }
.j-slide-item__action--left { inset-inline-start: 0; background: var(--jv-color-positive); }
.j-slide-item__action--right { inset-inline-end: 0; background: var(--jv-color-error); }

.j-snackbar__message { flex: 1 1 auto; min-width: 0; font-size: var(--jv-type-body-medium-size); }
.j-snackbar__action { flex: 0 0 auto; appearance: none; border: 0; background: transparent; cursor: pointer; font: inherit; font-weight: 500; color: var(--jv-color-primary); border-radius: var(--jv-radius-xs); padding: var(--jv-space-xs) var(--jv-space-sm); }
.j-snackbar__action:hover { background: color-mix(in srgb, currentColor calc(var(--jv-state-hover) * 100%), transparent); }
.j-snackbar__action:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

.j-separator--horizontal { width: 100%; height: 1px; border: 0; margin: 0; background: var(--jv-color-outline); }
.j-separator--vertical { width: 1px; align-self: stretch; min-height: 1em; border: 0; margin: 0; background: var(--jv-color-outline); }
.j-separator--inset { margin-inline: var(--jv-space-md); }
.j-separator--primary { background: var(--jv-color-primary); }
.j-separator--secondary { background: var(--jv-color-secondary); }
.j-separator--negative, .j-separator--error { background: var(--jv-color-error); }

.j-toolbar--inset { padding-inline-start: 56px; }
.j-pull-to-refresh__indicator { display: flex; align-items: center; justify-content: center; height: 48px; color: var(--jv-color-primary); transition: opacity var(--jv-motion-quick); }

.j-ajax-bar, j-ajax-bar.j-ajax-bar { position: fixed; z-index: 1400; pointer-events: none; overflow: hidden; }
.j-ajax-bar--top { top: 0; left: 0; right: 0; }
.j-ajax-bar--bottom { bottom: 0; left: 0; right: 0; }
.j-ajax-bar--left { top: 0; bottom: 0; left: 0; }
.j-ajax-bar--right { top: 0; bottom: 0; right: 0; }
.j-ajax-bar__fill { width: 0; height: 100%; background: var(--jv-color-primary); transition: width var(--jv-motion-standard); }
.j-ajax-bar--left .j-ajax-bar__fill, .j-ajax-bar--right .j-ajax-bar__fill { width: 100%; height: 0; transition: height var(--jv-motion-standard); }
.j-ajax-bar--primary .j-ajax-bar__fill { background: var(--jv-color-primary); }
.j-ajax-bar--secondary .j-ajax-bar__fill { background: var(--jv-color-secondary); }
.j-ajax-bar--positive .j-ajax-bar__fill { background: var(--jv-color-positive); }
.j-ajax-bar--negative .j-ajax-bar__fill, .j-ajax-bar--error .j-ajax-bar__fill { background: var(--jv-color-error); }

.j-tooltip, j-tooltip.j-tooltip {
position: absolute; z-index: 1500; pointer-events: none;
padding: var(--jv-space-xs) var(--jv-space-sm); max-width: 240px;
border-radius: var(--jv-radius-xs);
background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface);
font-size: 0.75rem; line-height: 1.4; box-shadow: var(--jv-elevation-2);
opacity: 0; transition: opacity var(--jv-motion-quick);
}
.j-tooltip[data-open="true"], .j-tooltip:not([hidden]):hover, [data-jv-tooltip-open] > .j-tooltip { opacity: 1; }
.j-tooltip--top { bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
.j-tooltip--bottom { top: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
.j-tooltip--left { right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
.j-tooltip--right { left: calc(100% + 6px); top: 50%; transform: translateY(-50%); }

.j-calendar-event--timed { border-inline-start: 3px solid var(--jv-color-primary); }
.j-calendar-event--all-day { background: var(--jv-color-primary); color: var(--jv-color-on-primary); border-radius: var(--jv-radius-xs); }
.j-calendar-event--disabled { opacity: var(--jv-state-disabled-content); pointer-events: none; }
.j-flow-edge--selected { stroke: var(--jv-color-primary); stroke-width: 3; }
.j-flow-marker-arrow { fill: var(--jv-color-outline); }

.j-spinner, j-spinner.j-spinner {
display: inline-flex; align-items: center; justify-content: center;
width: 24px; height: 24px; flex: 0 0 auto;
color: var(--jv-color-primary); vertical-align: middle;
}
.j-spinner svg { display: block; width: 100%; height: 100%; }
.j-spinner__track { fill: none; stroke: color-mix(in srgb, currentColor 20%, transparent); }
.j-spinner__path { fill: none; stroke: currentColor; stroke-linecap: round; }
.j-spinner__bar, .j-spinner__dot, .j-spinner__box, .j-spinner__ring,
.j-spinner__heart, .j-spinner__gear, .j-spinner__pie, .j-spinner__comment,
.j-spinner__infinity, .j-spinner__hourglass, .j-spinner__clock-face, .j-spinner__clock-hand { fill: currentColor; }
.j-spinner__track, .j-spinner__path, .j-spinner__clock-face { transform-origin: center; }

.j-spinner--oval .j-spinner__path,
.j-spinner--tail .j-spinner__path,
.j-spinner--rings .j-spinner__ring,
.j-spinner--puff .j-spinner__ring,
.j-spinner--orbit .j-spinner__dot,
.j-spinner--ios .j-spinner__bar,
.j-spinner--radio .j-spinner__ring,
.j-spinner--gears .j-spinner__gear,
.j-spinner--infinity .j-spinner__infinity,
.j-spinner--pie .j-spinner__pie,
.j-spinner--facebook .j-spinner__bar { transform-origin: center; }
.j-spinner--oval svg, .j-spinner--tail svg, .j-spinner--rings svg,
.j-spinner--orbit svg, .j-spinner--radio svg, .j-spinner--pie svg,
.j-spinner--infinity svg { animation: jv-spinner-rotate 1s linear infinite; }
.j-spinner--ios svg { animation: jv-spinner-rotate 1s steps(8) infinite; }
.j-spinner--gears .j-spinner__gear { animation: jv-spinner-rotate 2s linear infinite; }
.j-spinner--gears .j-spinner__gear:nth-of-type(2) { animation-direction: reverse; animation-duration: 1.4s; }

.j-spinner--ball .j-spinner__dot,
.j-spinner--puff .j-spinner__ring,
.j-spinner--hearts .j-spinner__heart,
.j-spinner--comment .j-spinner__comment { animation: jv-spinner-pulse 1.2s ease-in-out infinite; }
.j-spinner--puff .j-spinner__ring:nth-of-type(2) { animation-delay: -0.6s; }
.j-spinner--hearts .j-spinner__heart:nth-of-type(2) { animation-delay: -0.4s; }
.j-spinner--hearts .j-spinner__heart:nth-of-type(3) { animation-delay: -0.8s; }

.j-spinner--bars .j-spinner__bar,
.j-spinner--audio .j-spinner__bar,
.j-spinner--facebook .j-spinner__bar { animation: jv-spinner-bar 1s ease-in-out infinite; transform-origin: center bottom; }
.j-spinner--bars .j-spinner__bar:nth-of-type(2),
.j-spinner--audio .j-spinner__bar:nth-of-type(2),
.j-spinner--facebook .j-spinner__bar:nth-of-type(2) { animation-delay: -0.8s; }
.j-spinner--bars .j-spinner__bar:nth-of-type(3),
.j-spinner--audio .j-spinner__bar:nth-of-type(3),
.j-spinner--facebook .j-spinner__bar:nth-of-type(3) { animation-delay: -0.6s; }
.j-spinner--bars .j-spinner__bar:nth-of-type(4),
.j-spinner--audio .j-spinner__bar:nth-of-type(4) { animation-delay: -0.4s; }
.j-spinner--bars .j-spinner__bar:nth-of-type(5),
.j-spinner--audio .j-spinner__bar:nth-of-type(5) { animation-delay: -0.2s; }

.j-spinner--dots .j-spinner__dot,
.j-spinner--grid .j-spinner__dot { animation: jv-spinner-fade 1.2s ease-in-out infinite; }
.j-spinner--dots .j-spinner__dot:nth-of-type(2) { animation-delay: -0.9s; }
.j-spinner--dots .j-spinner__dot:nth-of-type(3) { animation-delay: -0.6s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(2) { animation-delay: -0.1s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(3) { animation-delay: -0.2s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(4) { animation-delay: -0.3s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(5) { animation-delay: -0.4s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(6) { animation-delay: -0.5s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(7) { animation-delay: -0.6s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(8) { animation-delay: -0.7s; }
.j-spinner--grid .j-spinner__dot:nth-of-type(9) { animation-delay: -0.8s; }

.j-spinner--box .j-spinner__box,
.j-spinner--cube .j-spinner__box { animation: jv-spinner-flip 1.4s ease-in-out infinite; transform-origin: center; }
.j-spinner--hourglass .j-spinner__hourglass { animation: jv-spinner-hourglass 1.6s ease-in-out infinite; transform-origin: center; }
.j-spinner--clock .j-spinner__clock-hand { animation: jv-spinner-rotate 2s steps(12) infinite; transform-origin: center; }

@keyframes jv-spinner-rotate { to { transform: rotate(360deg); } }
@keyframes jv-spinner-pulse { 0%, 100% { transform: scale(0.6); opacity: 0.55; } 50% { transform: scale(1); opacity: 1; } }
@keyframes jv-spinner-bar { 0%, 100% { transform: scaleY(0.4); } 50% { transform: scaleY(1); } }
@keyframes jv-spinner-fade { 0%, 100% { opacity: 0.25; } 50% { opacity: 1; } }
@keyframes jv-spinner-flip { 0% { transform: rotateX(0) rotateY(0); } 50% { transform: rotateX(180deg) rotateY(0); } 100% { transform: rotateX(180deg) rotateY(180deg); } }
@keyframes jv-spinner-hourglass { 0%, 45% { transform: rotate(0); } 50%, 95% { transform: rotate(180deg); } 100% { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
.j-spinner svg, .j-spinner *, .j-skeleton--animated,
.j-circular-progress--indeterminate svg, .j-circular-progress--indeterminate .j-circular-progress__arc,
.j-progress--indeterminate::after, .j-progress__fill--striped { animation-duration: 3s !important; }
}

.j-stepper__list { display: flex; align-items: flex-start; gap: var(--jv-space-sm); margin: 0; padding: 0; list-style: none; min-width: 0; }
.j-stepper__connector { flex: 1 1 auto; height: 2px; margin-top: 15px; background: var(--jv-color-outline); border-radius: 999px; min-width: 16px; }
.j-stepper__content { padding: var(--jv-space-md) 0; min-width: 0; }
.j-stepper__nav, .j-stepper-navigation { display: flex; align-items: center; justify-content: flex-end; gap: var(--jv-space-sm); padding-top: var(--jv-space-md); }
.j-stepper--alternative .j-stepper__list { align-items: center; }
.j-stepper--alternative .j-step { flex-direction: column; text-align: center; gap: var(--jv-space-xs); }

.j-step, j-step.j-step { display: flex; align-items: flex-start; gap: var(--jv-space-sm); min-width: 0; }
.j-step__dot {
flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%;
display: inline-flex; align-items: center; justify-content: center;
background: var(--jv-color-surface-container-highest); color: var(--jv-color-on-surface-variant);
font-size: 18px; line-height: 1; font-weight: 500;
transition: background var(--jv-motion-quick), color var(--jv-motion-quick);
}
.j-step__labels { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-top: 4px; }
.j-step__title { font-size: var(--jv-type-body-medium-size); font-weight: 500; color: var(--jv-color-on-surface); }
.j-step__caption { font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }
.j-step--active .j-step__dot { background: var(--jv-color-primary); color: var(--jv-color-on-primary); }
.j-step--active .j-step__title { color: var(--jv-color-primary); }
.j-step--done .j-step__dot { background: var(--jv-color-primary-container); color: var(--jv-color-on-primary-container); }
.j-step--error .j-step__dot { background: var(--jv-color-error); color: var(--jv-color-on-error); }
.j-step--error .j-step__title { color: var(--jv-color-error); }

.j-tab__icon { flex: 0 0 auto; font-size: 20px; line-height: 1; }
.j-tab__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.j-tab--active { color: var(--jv-color-primary); font-weight: 500; }
.j-tab--active::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 999px 999px 0 0; background: var(--jv-color-primary); }
.j-route-tab, j-route-tab.j-route-tab {
position: relative; display: inline-flex; align-items: center; gap: var(--jv-space-sm);
min-height: 48px; padding: 0 var(--jv-space-md); color: inherit; text-decoration: none;
cursor: pointer; transition: color var(--jv-motion-quick), background var(--jv-motion-quick);
}
.j-route-tab:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-route-tab:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: -2px; }
.j-tab-panel--active { display: block; }

.j-table-wrap { position: relative; width: 100%; overflow-x: auto; border-radius: var(--jv-radius-md); }
.j-table__loading { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--jv-color-surface) 66%, transparent); }
.j-table--dense th, .j-table--dense td, .j-table--dense .j-th, .j-table--dense .j-td { padding: var(--jv-space-xs) var(--jv-space-sm); }
.j-table--bordered, .j-table--bordered th, .j-table--bordered td { border: 1px solid var(--jv-color-outline); }
.j-table--striped tbody tr:nth-child(even) { background: color-mix(in srgb, var(--jv-color-on-surface) 4%, transparent); }
.j-table--col-auto-width { width: 1%; white-space: nowrap; }
.j-table__th--sortable { cursor: pointer; user-select: none; }
.j-table__th--sortable:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }

.j-tr, j-tr.j-tr { transition: background var(--jv-motion-quick); }
.j-tr:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-tr--no-hover:hover { background: transparent; }
.j-tr--header { background: var(--jv-color-surface-container-low); }
.j-tr--header:hover { background: var(--jv-color-surface-container-low); }
.j-tr--selected { background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container); }

.j-td, j-td.j-td { padding: var(--jv-space-sm) var(--jv-space-md); text-align: start; border-bottom: 1px solid var(--jv-color-outline); vertical-align: middle; }
.j-td--no-hover { background: transparent; }
.j-th, j-th.j-th {
padding: var(--jv-space-sm) var(--jv-space-md); text-align: start;
border-bottom: 1px solid var(--jv-color-outline);
font-weight: 500; color: var(--jv-color-on-surface-variant); white-space: nowrap;
}
.j-th__label { display: inline-block; min-width: 0; }
.j-th__sort-icon { font-size: 16px; line-height: 1; vertical-align: middle; margin-inline-start: var(--jv-space-xs); color: var(--jv-color-primary); }

.j-timeline, j-timeline.j-timeline { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; min-width: 0; }
.j-timeline-entry, j-timeline-entry.j-timeline-entry {
position: relative; display: flex; gap: var(--jv-space-md);
padding-bottom: var(--jv-space-lg); min-width: 0;
}
.j-timeline-entry::before {
content: ""; position: absolute; inset-inline-start: 15px; top: 32px; bottom: 0;
width: 2px; background: var(--jv-color-outline);
}
.j-timeline-entry:last-child::before { display: none; }
.j-timeline-entry__dot {
position: relative; z-index: 1; flex: 0 0 auto;
width: 32px; height: 32px; border-radius: 50%;
display: inline-flex; align-items: center; justify-content: center;
background: var(--jv-color-primary-container); color: var(--jv-color-on-primary-container);
font-size: 18px; line-height: 1;
}
.j-timeline-entry__content { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; padding-top: 4px; }
.j-timeline-entry__title { font-size: var(--jv-type-body-medium-size); font-weight: 500; color: var(--jv-color-on-surface); }
.j-timeline-entry__subtitle { font-size: 0.75rem; color: var(--jv-color-on-surface-muted); }
.j-timeline-entry__body { font-size: var(--jv-type-body-medium-size); line-height: var(--jv-type-body-medium-line-height); color: var(--jv-color-on-surface); }
.j-timeline--dense .j-timeline-entry { padding-bottom: var(--jv-space-md); gap: var(--jv-space-sm); }
.j-timeline--dense .j-timeline-entry__dot { width: 24px; height: 24px; font-size: 14px; }
.j-timeline--dense .j-timeline-entry::before { inset-inline-start: 11px; top: 24px; }

.j-tree-node, j-tree-node.j-tree-node { display: block; list-style: none; min-width: 0; }
.j-tree-node__row {
display: flex; align-items: center; gap: var(--jv-space-xs);
min-height: 36px; padding: 0 var(--jv-space-sm); border-radius: var(--jv-radius-sm);
cursor: pointer; min-width: 0; transition: background var(--jv-motion-quick);
}
.j-tree-node__row:hover { background: color-mix(in srgb, var(--jv-color-on-surface) calc(var(--jv-state-hover) * 100%), transparent); }
.j-tree-node__row:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: -2px; }
.j-tree-node__toggle { flex: 0 0 auto; width: 20px; font-size: 20px; line-height: 1; color: var(--jv-color-on-surface-variant); transition: transform var(--jv-motion-quick); }
.j-tree-node[aria-expanded="true"] > .j-tree-node__row > .j-tree-node__toggle, .j-tree-node--expanded > .j-tree-node__row > .j-tree-node__toggle { transform: rotate(90deg); }
.j-tree-node__spacer { flex: 0 0 auto; width: 20px; }
.j-tree-node__icon { flex: 0 0 auto; font-size: 20px; line-height: 1; color: var(--jv-color-on-surface-variant); }
.j-tree-node__label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--jv-type-body-medium-size); }
.j-tree-node__children { margin: 0; padding-inline-start: var(--jv-space-lg); list-style: none; position: relative; }
.j-tree-node__children::before { content: ""; position: absolute; inset-inline-start: 10px; top: 0; bottom: 0; width: 1px; background: var(--jv-color-outline); }
.j-tree--no-connectors .j-tree-node__children::before { display: none; }
.j-tree--dense .j-tree-node__row { min-height: 28px; }

.j-uploader, j-uploader.j-uploader {
display: flex; flex-direction: column; gap: var(--jv-space-sm); min-width: 0;
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md);
background: var(--jv-color-surface); padding: var(--jv-space-md);
}
.j-uploader__zone {
display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--jv-space-sm);
padding: var(--jv-space-xl) var(--jv-space-md); text-align: center; cursor: pointer;
border: 2px dashed var(--jv-color-outline); border-radius: var(--jv-radius-md);
color: var(--jv-color-on-surface-muted);
transition: border-color var(--jv-motion-quick), background var(--jv-motion-quick);
}
.j-uploader__zone:hover, .j-uploader__zone[data-dragover="true"] {
border-color: var(--jv-color-primary);
background: color-mix(in srgb, var(--jv-color-primary) calc(var(--jv-state-hover) * 100%), transparent);
}
.j-uploader__icon { font-size: 32px; line-height: 1; color: var(--jv-color-primary); }
.j-uploader__label { font-size: var(--jv-type-body-medium-size); }
.j-uploader__input { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.j-uploader__list { display: flex; flex-direction: column; gap: var(--jv-space-xs); margin: 0; padding: 0; list-style: none; }
.j-uploader__list > li { display: flex; align-items: center; gap: var(--jv-space-sm); padding: var(--jv-space-xs) var(--jv-space-sm); border-radius: var(--jv-radius-sm); background: var(--jv-color-surface-container-low); font-size: 0.875rem; }
.j-uploader-add-trigger, .j-uploader__add-trigger, j-uploader-add-trigger.j-uploader-add-trigger {
display: inline-flex; align-items: center; justify-content: center; gap: var(--jv-space-sm);
min-height: 40px; padding: 0 var(--jv-space-md); cursor: pointer;
border: 0; border-radius: var(--jv-shape-radius);
background: var(--jv-color-secondary-container); color: var(--jv-color-on-secondary-container);
font: inherit; transition: background var(--jv-motion-quick);
}
.j-uploader__add-trigger:hover { background: color-mix(in srgb, var(--jv-color-secondary-container) 86%, var(--jv-color-on-surface)); }
.j-uploader__add-trigger:focus-visible { outline: 2px solid var(--jv-color-primary); outline-offset: 2px; }
.j-uploader__add-trigger--dense { min-height: 32px; padding: 0 var(--jv-space-sm); font-size: 0.875rem; }
.j-uploader__add-trigger--round { width: 40px; padding: 0; border-radius: 50%; }
.j-uploader__add-trigger--round.j-uploader__add-trigger--dense { width: 32px; }
.j-uploader__add-trigger-label { min-width: 0; }

.j-dialog-panel--medium { max-width: 640px; width: 100%; }
.j-dialog-panel--wide { max-width: 960px; width: 100%; }

.j-floating-panel, j-floating-panel.j-floating-panel {
position: fixed; z-index: 1250; min-width: 240px;
background: var(--jv-color-surface-container-low); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-lg);
box-shadow: var(--jv-elevation-3); overflow: hidden;
}
.j-hover-card, j-hover-card.j-hover-card {
position: absolute; z-index: 1300; max-width: 320px; padding: var(--jv-space-md);
background: var(--jv-color-surface-container-low); color: var(--jv-color-on-surface);
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md);
box-shadow: var(--jv-elevation-2);
opacity: 0; pointer-events: none; transition: opacity var(--jv-motion-quick);
}
.j-hover-card[data-open="true"] { opacity: 1; pointer-events: auto; }
.j-tour, j-tour.j-tour { position: fixed; inset: 0; z-index: 1400; pointer-events: none; }
.j-timer, j-timer.j-timer { display: inline-flex; align-items: baseline; gap: var(--jv-space-xs); font-variant-numeric: tabular-nums; font-family: var(--jv-font-mono, ui-monospace, monospace); }
.j-marquee, j-marquee.j-marquee { display: block; overflow: hidden; white-space: nowrap; }
.j-marquee > * { display: inline-block; padding-inline-end: 100%; animation: jv-marquee 18s linear infinite; }
@keyframes jv-marquee { from { transform: translateX(0); } to { transform: translateX(-100%); } }
.j-qr-code, j-qr-code.j-qr-code { display: inline-block; line-height: 0; background: #fff; padding: var(--jv-space-sm); border-radius: var(--jv-radius-sm); }
.j-qr-code svg, .j-qr-code img, .j-qr-code canvas { display: block; width: 100%; height: auto; }
.j-signature-pad, j-signature-pad.j-signature-pad { display: block; border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-md); background: var(--jv-color-surface); touch-action: none; }
.j-pin-input, j-pin-input.j-pin-input { display: inline-flex; align-items: center; gap: var(--jv-space-sm); }
.j-pin-input input {
width: 44px; height: 52px; text-align: center; font-size: 1.25rem; font-variant-numeric: tabular-nums;
border: 1px solid var(--jv-color-outline); border-radius: var(--jv-radius-sm);
background: var(--jv-color-surface); color: inherit;
transition: border-color var(--jv-motion-quick), box-shadow var(--jv-motion-quick);
}
.j-pin-input input:focus-visible { outline: none; border-color: var(--jv-color-primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--jv-color-primary) 24%, transparent); }
.j-npm, j-npm.j-npm { display: contents; }

j-app, j-layout, j-layout-container, j-page, j-page-container, j-section,
j-header, j-footer, j-drawer, j-toolbar, j-card, j-card-section, j-card-actions,
j-list, j-item, j-list-item, j-form, j-json-form, j-field, j-banner, j-alert,
j-carousel, j-carousel-slide, j-tab-panels, j-tab-panel, j-stepper, j-tree,
j-timeline, j-uploader, j-editor, j-code-editor, j-data-grid, j-table-wrap,
j-markup-table, j-scroll-area, j-virtual-scroll, j-infinite-scroll, j-map,
j-video, j-parallax, j-lazy, j-expansion-item, j-expansion-panel, j-command-bar,
j-signature-pad, j-qr-code, j-marquee, j-img-wrap, j-flow-background,
j-flow-controls, j-flow-minimap, j-flow-panel, j-no-ssr, j-responsive,
j-slide-transition, j-slide-item, j-pull-to-refresh, j-page-scroller,
j-linear-progress, j-progress, j-ajax-bar, j-separator, j-skeleton {
display: block;
min-width: 0;
}

j-row { display: flex; flex-wrap: wrap; min-width: 0; }
j-col { display: block; flex: 1 1 0%; min-width: 0; }

j-button, j-icon-button, j-button-group, j-button-toggle, j-button-dropdown,
j-chip, j-badge, j-avatar, j-icon, j-spinner, j-tab, j-route-tab, j-tabs,
j-breadcrumb, j-breadcrumbs, j-toolbar-title, j-bar, j-space, j-timer,
j-pin-input, j-rating, j-knob, j-circular-progress, j-item-section,
j-item-label, j-step, j-stepper-navigation, j-fab, j-fab-action,
j-carousel-control, j-dialog-title, j-popup-edit, j-color-picker, j-file,
j-date-picker, j-time-picker, j-slider, j-range, j-radio, j-option-group {
display: inline-flex;
align-items: center;
min-width: 0;
}

j-menu, j-context-menu, j-dropdown, j-snackbar, j-notify, j-tooltip,
j-hover-card, j-floating-panel, j-popup-proxy, j-tour, j-chat-message,
j-tree-node, j-timeline-entry, j-pagination, j-breadcrumb, j-npm,
j-intersection, j-resize-observer, j-scroll-observer { min-width: 0; }

j-space { flex: 1 1 auto; }
j-npm, j-intersection { display: contents; }
j-resize-observer, j-scroll-observer { display: block; position: absolute; inset: 0; visibility: hidden; pointer-events: none; }

j-spinner, j-spinner-audio, j-spinner-ball, j-spinner-bars, j-spinner-box,
j-spinner-clock, j-spinner-comment, j-spinner-cube, j-spinner-dots,
j-spinner-facebook, j-spinner-gears, j-spinner-grid, j-spinner-hearts,
j-spinner-hourglass, j-spinner-infinity, j-spinner-ios, j-spinner-orbit,
j-spinner-oval, j-spinner-pie, j-spinner-puff, j-spinner-radio,
j-spinner-rings, j-spinner-tail {
display: inline-flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
flex: 0 0 auto;
color: var(--jv-color-primary);
vertical-align: middle;
}
j-spinner-audio svg, j-spinner-ball svg, j-spinner-bars svg, j-spinner-box svg,
j-spinner-clock svg, j-spinner-comment svg, j-spinner-cube svg,
j-spinner-dots svg, j-spinner-facebook svg, j-spinner-gears svg,
j-spinner-grid svg, j-spinner-hearts svg, j-spinner-hourglass svg,
j-spinner-infinity svg, j-spinner-ios svg, j-spinner-orbit svg,
j-spinner-oval svg, j-spinner-pie svg, j-spinner-puff svg,
j-spinner-radio svg, j-spinner-rings svg, j-spinner-tail svg {
display: block;
width: 100%;
height: 100%;
}

j-card-section { padding: var(--jv-space-md); }
j-card-actions { display: flex; align-items: center; gap: var(--jv-space-sm); padding: var(--jv-space-sm) var(--jv-space-md); }
j-item-section { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
j-carousel-control { position: absolute; z-index: 3; display: inline-flex; }
j-stepper-navigation { display: flex; align-items: center; justify-content: flex-end; gap: var(--jv-space-sm); padding-top: var(--jv-space-md); }
j-toolbar-title { flex: 1 1 auto; min-width: 0; font-size: var(--jv-type-title-medium-size); font-weight: 600; }
j-dialog-title { display: block; font-size: var(--jv-type-title-medium-size); font-weight: 500; }

[hidden] { display: none !important; }
j-input { display: inline-flex; align-items: center; min-width: 0; }
j-page-sticky { position: absolute; z-index: 1000; display: flex; }