/* Generated from design_system/tokens.json. Do not edit directly. */
:root {
  --jys-breakpoint-desktop: 1280px;
  --jys-breakpoint-mobile: 768px;
  --jys-breakpoint-tablet: 1024px;
  --jys-color-action-danger: #B91C1C;
  --jys-color-action-primary: #2563EB;
  --jys-color-action-primary-active: #1E40AF;
  --jys-color-action-primary-hover: #1D4ED8;
  --jys-color-action-primary-subtle: #EFF6FF;
  --jys-color-border-default: #E5E7EB;
  --jys-color-border-focus: #2563EB;
  --jys-color-border-strong: #CBD5E1;
  --jys-color-status-danger-background: #FEF2F2;
  --jys-color-status-danger-border: #FECACA;
  --jys-color-status-danger-text: #991B1B;
  --jys-color-status-info-background: #EFF6FF;
  --jys-color-status-info-border: #BFDBFE;
  --jys-color-status-info-text: #1E40AF;
  --jys-color-status-success-background: #F0FDF4;
  --jys-color-status-success-border: #BBF7D0;
  --jys-color-status-success-text: #166534;
  --jys-color-status-warning-background: #FEFCE8;
  --jys-color-status-warning-border: #FDE68A;
  --jys-color-status-warning-text: #854D0E;
  --jys-color-surface-base: #FFFFFF;
  --jys-color-surface-disabled: #F3F4F6;
  --jys-color-surface-overlay: rgba(15, 23, 42, 0.46);
  --jys-color-surface-page: #F5F7FA;
  --jys-color-surface-raised: #FFFFFF;
  --jys-color-surface-selected: #EFF6FF;
  --jys-color-surface-sunken: #EEF2F7;
  --jys-color-text-disabled: #9CA3AF;
  --jys-color-text-inverse: #FFFFFF;
  --jys-color-text-link: #1D4ED8;
  --jys-color-text-muted: #6B7280;
  --jys-color-text-primary: #172033;
  --jys-color-text-secondary: #4B5563;
  --jys-font-family-numeric: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --jys-font-family-sans: -apple-system, BlinkMacSystemFont, Segoe UI, Microsoft YaHei, Helvetica Neue, Arial, sans-serif;
  --jys-font-line-height-body: 1.5;
  --jys-font-line-height-compact: 1.3;
  --jys-font-line-height-relaxed: 1.65;
  --jys-font-line-height-title: 1.25;
  --jys-font-size-body: 14px;
  --jys-font-size-body-large: 16px;
  --jys-font-size-caption: 12px;
  --jys-font-size-display: 30px;
  --jys-font-size-label: 13px;
  --jys-font-size-page-title: 24px;
  --jys-font-size-section-title: 18px;
  --jys-font-weight-bold: 700;
  --jys-font-weight-medium: 500;
  --jys-font-weight-regular: 400;
  --jys-font-weight-semibold: 600;
  --jys-layer-base: 0;
  --jys-layer-dropdown: 400;
  --jys-layer-modal: 800;
  --jys-layer-overlay: 700;
  --jys-layer-shell-modal: 10080;
  --jys-layer-sticky: 100;
  --jys-layer-toast: 1000;
  --jys-motion-duration-fast: 120ms;
  --jys-motion-duration-normal: 180ms;
  --jys-motion-duration-slow: 240ms;
  --jys-motion-easing-enter: cubic-bezier(0, 0, 0, 1);
  --jys-motion-easing-exit: cubic-bezier(0.3, 0, 1, 1);
  --jys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --jys-opacity-disabled: 0.48;
  --jys-opacity-muted: 0.72;
  --jys-radius-card: 12px;
  --jys-radius-control: 8px;
  --jys-radius-dialog: 16px;
  --jys-radius-none: 0px;
  --jys-radius-pill: 999px;
  --jys-radius-small: 6px;
  --jys-shadow-floating: 0 16px 40px rgba(15, 23, 42, 0.16);
  --jys-shadow-focus: 0 0 0 3px rgba(37, 99, 235, 0.24);
  --jys-shadow-none: none;
  --jys-shadow-raised: 0 1px 2px rgba(15, 23, 42, 0.06), 0 6px 18px rgba(15, 23, 42, 0.05);
  --jys-size-content-admin-max: 1600px;
  --jys-size-content-assistant-max: 480px;
  --jys-size-content-service-max: 1200px;
  --jys-size-control-compact: 32px;
  --jys-size-control-dense: 36px;
  --jys-size-control-standard: 40px;
  --jys-size-control-touch: 44px;
  --jys-size-icon-large: 24px;
  --jys-size-icon-medium: 20px;
  --jys-size-icon-small: 16px;
  --jys-size-touch-minimum: 44px;
  --jys-space-0: 0px;
  --jys-space-1: 4px;
  --jys-space-10: 40px;
  --jys-space-12: 48px;
  --jys-space-16: 64px;
  --jys-space-2: 8px;
  --jys-space-3: 12px;
  --jys-space-4: 16px;
  --jys-space-5: 20px;
  --jys-space-6: 24px;
  --jys-space-8: 32px;
}

.jys-focus-ring:focus-visible {
  outline: 2px solid var(--jys-color-border-focus);
  outline-offset: 2px;
  box-shadow: var(--jys-shadow-focus);
}

.jys-tabular-numbers {
  font-variant-numeric: tabular-nums;
}

.jys-form-field {
  display: grid;
  gap: var(--jys-space-1);
  min-width: 0;
}

.jys-field-frame {
  --jys-field-control-height: var(--jys-size-control-standard);
  align-items: stretch;
  background: var(--jys-color-surface-base);
  border: 1px solid var(--jys-color-border-strong);
  border-radius: var(--jys-radius-control);
  box-shadow: var(--jys-shadow-none);
  box-sizing: border-box;
  display: grid;
  gap: 0;
  grid-template-columns: var(--jys-field-label-width, max-content) minmax(0, 1fr);
  min-height: var(--jys-field-control-height);
  min-width: 0;
  overflow: hidden;
  transition: border-color var(--jys-motion-duration-fast) var(--jys-motion-easing-standard), box-shadow var(--jys-motion-duration-fast) var(--jys-motion-easing-standard);
  width: 100%;
}

.jys-field-frame--dense {
  --jys-field-control-height: var(--jys-size-control-dense);
}

.jys-field-frame--touch {
  --jys-field-control-height: var(--jys-size-control-touch);
}

.jys-field-frame__label {
  align-items: center;
  background: var(--jys-color-surface-sunken);
  border-right: 1px solid var(--jys-color-border-default);
  color: var(--jys-color-text-secondary);
  display: inline-flex;
  font-size: var(--jys-font-size-label);
  font-weight: var(--jys-font-weight-medium);
  line-height: var(--jys-font-line-height-compact);
  min-height: var(--jys-field-control-height);
  padding: 0 var(--jys-space-2);
  white-space: nowrap;
}

.jys-field-frame__control {
  background: transparent;
  border: 0;
  border-radius: var(--jys-radius-none);
  box-shadow: var(--jys-shadow-none);
  box-sizing: border-box;
  color: var(--jys-color-text-primary);
  font: inherit;
  min-height: var(--jys-field-control-height);
  min-width: 0;
  padding: 0 var(--jys-space-3);
  width: 100%;
}

.jys-field-frame__control::placeholder {
  color: var(--jys-color-text-muted);
  opacity: var(--jys-opacity-muted);
}

.jys-field-frame:focus-within,
.jys-field-frame.is-focused {
  border-color: var(--jys-color-border-focus);
  box-shadow: var(--jys-shadow-focus);
}

.jys-field-frame__control:focus,
.jys-field-frame__control:focus-visible {
  box-shadow: var(--jys-shadow-none);
  outline: none;
}

.jys-field-frame.is-invalid {
  border-color: var(--jys-color-status-danger-text);
}

.jys-field-frame.is-disabled,
.jys-field-frame:has(.jys-field-frame__control:disabled) {
  background: var(--jys-color-surface-disabled);
  color: var(--jys-color-text-disabled);
  opacity: var(--jys-opacity-disabled);
}

.jys-field-frame--multiline {
  align-items: start;
}

.jys-field-frame--multiline .jys-field-frame__label {
  align-items: flex-start;
  padding-top: var(--jys-space-3);
}

.jys-field-frame--multiline .jys-field-frame__control {
  line-height: var(--jys-font-line-height-body);
  padding-bottom: var(--jys-space-2);
  padding-top: var(--jys-space-2);
  resize: vertical;
}

.jys-field-frame__help,
.jys-field-frame__error {
  font-size: var(--jys-font-size-caption);
  line-height: var(--jys-font-line-height-body);
}

.jys-field-frame__help {
  color: var(--jys-color-text-muted);
}

.jys-field-frame__error {
  color: var(--jys-color-status-danger-text);
}

@media (prefers-reduced-motion: reduce) {
  .jys-motion,
  .jys-motion::before,
  .jys-motion::after {
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
    scroll-behavior: auto;
    transition-duration: 0.01ms;
  }
}