/* packages/studio-ui/dist/studio.css */
@layer mdy.tokens, mdy.base, mdy.components, mdy.themes;
@layer mdy.tokens {
  :root {
    --mdy-ref-color-indigo:#7067ff;
    --mdy-ref-color-violet:#a855f7;
    --mdy-ref-color-coral:#ff6577;
    --mdy-ref-color-night:#0e0f16;
    --mdy-ref-color-cloud:#f8fafc;
    --mdy-ref-color-slate:#94a3b8;
    --mdy-ref-color-error:#b3261e;
    --mdy-ref-font-family:"Satoshi",ui-sans-serif,system-ui,-apple-system,"Segoe UI","Helvetica Neue",Arial,sans-serif;
    --mdy-comp-date-picker-hover-bg:var(--mdy-sys-color-surface-container-highest);
    --mdy-comp-date-picker-selected-bg:var(--mdy-sys-color-primary);
    --mdy-comp-date-picker-selected-color:var(--mdy-sys-color-on-primary);
    --mdy-comp-date-picker-disabled-opacity:0.25;
    --mdy-comp-date-picker-outside-opacity:0.5;
    --mdy-sys-color-primary:var(--mdy-ref-color-indigo);
    --mdy-sys-color-on-primary:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 95%);
    --mdy-sys-color-primary-container:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 85%);
    --mdy-sys-color-on-primary-container:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 80%);
    --mdy-sys-color-secondary:var(--mdy-ref-color-violet);
    --mdy-sys-color-on-secondary:color-mix(in srgb,var(--mdy-sys-color-secondary),var(--mdy-ref-color-cloud) 90%);
    --mdy-sys-color-secondary-container:color-mix(in srgb,var(--mdy-sys-color-secondary),var(--mdy-ref-color-cloud) 80%);
    --mdy-sys-color-on-secondary-container:color-mix(in srgb,var(--mdy-sys-color-secondary),var(--mdy-ref-color-night) 80%);
    --mdy-sys-color-tertiary:var(--mdy-ref-color-coral);
    --mdy-sys-color-on-tertiary:color-mix(in srgb,var(--mdy-sys-color-tertiary),var(--mdy-ref-color-cloud) 90%);
    --mdy-sys-color-tertiary-container:color-mix(in srgb,var(--mdy-sys-color-tertiary),var(--mdy-ref-color-cloud) 95%);
    --mdy-sys-color-on-tertiary-container:color-mix(in srgb,var(--mdy-sys-color-tertiary),var(--mdy-ref-color-night) 80%);
    --mdy-sys-color-error:var(--mdy-ref-color-error);
    --mdy-sys-color-on-error:color-mix(in srgb,var(--mdy-sys-color-error),var(--mdy-ref-color-cloud) 90%);
    --mdy-sys-color-error-container:color-mix(in srgb,var(--mdy-sys-color-error),var(--mdy-ref-color-cloud) 85%);
    --mdy-sys-color-on-error-container:color-mix(in srgb,var(--mdy-sys-color-error),var(--mdy-ref-color-night) 80%);
    --mdy-sys-color-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 96%);
    --mdy-sys-color-on-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 80%);
    --mdy-sys-color-surface-variant:color-mix(in srgb,var(--mdy-sys-color-primary),color-mix(in srgb,var(--mdy-ref-color-cloud),var(--mdy-ref-color-slate) 18%) 80%);
    --mdy-sys-color-on-surface-variant:color-mix(in srgb,var(--mdy-sys-color-primary),color-mix(in srgb,var(--mdy-ref-color-night),var(--mdy-ref-color-slate) 45%) 60%);
    --mdy-sys-color-surface-container-lowest:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 100%);
    --mdy-sys-color-surface-container-low:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 96%);
    --mdy-sys-color-surface-container:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 92%);
    --mdy-sys-color-surface-container-high:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 88%);
    --mdy-sys-color-surface-container-highest:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 80%);
    --mdy-sys-color-background:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 98%);
    --mdy-sys-color-on-background:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 80%);
    --mdy-sys-color-outline:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-slate) 60%);
    --mdy-sys-color-outline-variant:color-mix(in srgb,var(--mdy-sys-color-primary),color-mix(in srgb,var(--mdy-ref-color-slate),var(--mdy-ref-color-cloud) 45%) 80%);
    --mdy-sys-color-inverse-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 80%);
    --mdy-sys-color-inverse-on-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 80%);
    --mdy-sys-color-inverse-primary:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 60%);
    --mdy-sys-color-scrim:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 90%);
    --mdy-sys-color-shadow:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 80%);
    --mdy-sys-typescale-display-large-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-display-large-size:57px;
    --mdy-sys-typescale-display-large-line-height:64px;
    --mdy-sys-typescale-display-large-weight:400;
    --mdy-sys-typescale-display-large-tracking:-0.25px;
    --mdy-sys-typescale-display-medium-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-display-medium-size:45px;
    --mdy-sys-typescale-display-medium-line-height:52px;
    --mdy-sys-typescale-display-medium-weight:400;
    --mdy-sys-typescale-display-small-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-display-small-size:36px;
    --mdy-sys-typescale-display-small-line-height:44px;
    --mdy-sys-typescale-display-small-weight:400;
    --mdy-sys-typescale-headline-large-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-headline-large-size:32px;
    --mdy-sys-typescale-headline-large-line-height:40px;
    --mdy-sys-typescale-headline-large-weight:400;
    --mdy-sys-typescale-headline-medium-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-headline-medium-size:28px;
    --mdy-sys-typescale-headline-medium-line-height:36px;
    --mdy-sys-typescale-headline-medium-weight:400;
    --mdy-sys-typescale-headline-small-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-headline-small-size:24px;
    --mdy-sys-typescale-headline-small-line-height:32px;
    --mdy-sys-typescale-headline-small-weight:400;
    --mdy-sys-typescale-title-large-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-title-large-size:22px;
    --mdy-sys-typescale-title-large-line-height:28px;
    --mdy-sys-typescale-title-large-weight:400;
    --mdy-sys-typescale-title-medium-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-title-medium-size:16px;
    --mdy-sys-typescale-title-medium-line-height:24px;
    --mdy-sys-typescale-title-medium-weight:500;
    --mdy-sys-typescale-title-medium-tracking:0.15px;
    --mdy-sys-typescale-title-small-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-title-small-size:14px;
    --mdy-sys-typescale-title-small-line-height:20px;
    --mdy-sys-typescale-title-small-weight:500;
    --mdy-sys-typescale-title-small-tracking:0.1px;
    --mdy-sys-typescale-body-large-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-body-large-size:16px;
    --mdy-sys-typescale-body-large-line-height:24px;
    --mdy-sys-typescale-body-large-weight:400;
    --mdy-sys-typescale-body-large-tracking:0.5px;
    --mdy-sys-typescale-body-medium-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-body-medium-size:14px;
    --mdy-sys-typescale-body-medium-line-height:20px;
    --mdy-sys-typescale-body-medium-weight:400;
    --mdy-sys-typescale-body-medium-tracking:0.25px;
    --mdy-sys-typescale-body-small-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-body-small-size:12px;
    --mdy-sys-typescale-body-small-line-height:16px;
    --mdy-sys-typescale-body-small-weight:400;
    --mdy-sys-typescale-body-small-tracking:0.4px;
    --mdy-sys-typescale-label-large-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-label-large-size:14px;
    --mdy-sys-typescale-label-large-line-height:20px;
    --mdy-sys-typescale-label-large-weight:500;
    --mdy-sys-typescale-label-large-tracking:0.1px;
    --mdy-sys-typescale-label-medium-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-label-medium-size:12px;
    --mdy-sys-typescale-label-medium-line-height:16px;
    --mdy-sys-typescale-label-medium-weight:500;
    --mdy-sys-typescale-label-medium-tracking:0.5px;
    --mdy-sys-typescale-label-small-font:var(--mdy-ref-font-family);
    --mdy-sys-typescale-label-small-size:11px;
    --mdy-sys-typescale-label-small-line-height:16px;
    --mdy-sys-typescale-label-small-weight:500;
    --mdy-sys-typescale-label-small-tracking:0.5px;
    --mdy-sys-shape-corner-none:0px;
    --mdy-sys-shape-corner-extra-small:4px;
    --mdy-sys-shape-corner-small:8px;
    --mdy-sys-shape-corner-medium:12px;
    --mdy-sys-shape-corner-large:16px;
    --mdy-sys-shape-corner-extra-large:28px;
    --mdy-sys-shape-corner-full:9999px;
    --mdy-sys-elevation-level0:0px;
    --mdy-sys-elevation-level1:1px;
    --mdy-sys-elevation-level2:3px;
    --mdy-sys-elevation-level3:6px;
    --mdy-sys-elevation-level4:8px;
    --mdy-sys-elevation-level5:12px;
    --mdy-sys-state-hover-opacity:0.08;
    --mdy-sys-state-focus-opacity:0.10;
    --mdy-sys-state-pressed-opacity:0.10;
    --mdy-sys-state-dragged-opacity:0.16;
    --mdy-sys-state-disabled-container-opacity:0.12;
    --mdy-sys-state-disabled-content-opacity:0.38;
    --mdy-comp-date-picker-grid-gap:0;
    --mdy-comp-date-picker-cell-size:2.5rem;
    --mdy-comp-date-picker-cell-font-size:0.875rem;
    --mdy-comp-date-picker-cell-border-radius:50%;
    --mdy-comp-date-picker-cell-font-family:inherit;
    --mdy-comp-date-picker-cell-font-weight:400;
    --mdy-comp-date-picker-cell-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-date-picker-cell-hover-bg:var(--mdy-sys-color-surface-container-highest);
    --mdy-comp-date-picker-cell-selected-bg:var(--mdy-sys-color-primary);
    --mdy-comp-date-picker-cell-selected-color:var(--mdy-sys-color-on-primary);
    --mdy-comp-date-picker-cell-disabled-opacity:0.25;
    --mdy-comp-date-picker-cell-outside-opacity:0.5;
    --mdy-comp-date-picker-cell-today-outline:2px solid var(--mdy-sys-color-primary);
    --mdy-comp-date-picker-cell-focus-outline:2px solid var(--mdy-sys-color-primary);
    --mdy-comp-date-picker-header-gap:0.5rem;
    --mdy-comp-date-picker-header-padding:0.5rem 1rem 0.25rem 1rem;
    --mdy-comp-date-picker-header-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-date-picker-header-font-size:1rem;
    --mdy-comp-date-picker-header-font-weight:500;
    --mdy-comp-date-picker-nav-btn-size:2rem;
    --mdy-comp-date-picker-nav-btn-radius:50%;
    --mdy-comp-date-picker-nav-btn-hover-bg:var(--mdy-sys-color-surface-container-highest);
    --mdy-comp-date-picker-popup-padding:1.25rem;
    --mdy-comp-date-picker-popup-radius:var(--mdy-comp-date-picker-modal-container-shape);
    --mdy-comp-date-picker-popup-shadow:0 8px 32px 0 rgba(0,0,0,.18);
    --mdy-comp-date-picker-popup-bg:var(--mdy-comp-date-picker-modal-container-color);
    --mdy-comp-date-picker-in-range-bg:color-mix(in srgb,var(--mdy-sys-color-primary),#fff 75%);
    --mdy-comp-date-picker-endpoint-bg:var(--mdy-sys-color-primary);
    --mdy-comp-date-picker-endpoint-color:var(--mdy-sys-color-on-primary);
    --mdy-comp-date-picker-input-padding:0.75rem 1rem;
    --mdy-comp-date-picker-input-radius:var(--mdy-comp-date-picker-modal-container-shape);
    --mdy-comp-date-picker-input-bg:var(--mdy-sys-color-surface-container-highest);
    --mdy-comp-date-picker-input-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-date-picker-input-font-size:1rem;
    --mdy-comp-date-picker-input-font-family:inherit;
    --mdy-comp-date-picker-weekday-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-date-picker-weekday-font-size:0.75rem;
    --mdy-comp-date-picker-weekday-font-weight:500;
    --mdy-comp-date-picker-title-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-date-picker-title-font-size:0.875rem;
    --mdy-comp-date-picker-title-font-weight:600;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --mdy-sys-color-on-primary:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 80%);
      --mdy-sys-color-primary-container:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 60%);
      --mdy-sys-color-on-primary-container:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 60%);
      --mdy-sys-color-secondary:color-mix(in srgb,var(--mdy-ref-color-violet),var(--mdy-ref-color-cloud) 20%);
      --mdy-sys-color-on-secondary:color-mix(in srgb,var(--mdy-sys-color-secondary),var(--mdy-ref-color-cloud) 70%);
      --mdy-sys-color-secondary-container:color-mix(in srgb,var(--mdy-sys-color-secondary),var(--mdy-ref-color-night) 80%);
      --mdy-sys-color-on-secondary-container:color-mix(in srgb,var(--mdy-sys-color-secondary),var(--mdy-ref-color-cloud) 60%);
      --mdy-sys-color-tertiary:color-mix(in srgb,var(--mdy-ref-color-coral),var(--mdy-ref-color-cloud) 15%);
      --mdy-sys-color-on-tertiary:color-mix(in srgb,var(--mdy-sys-color-tertiary),var(--mdy-ref-color-cloud) 70%);
      --mdy-sys-color-tertiary-container:color-mix(in srgb,var(--mdy-sys-color-tertiary),var(--mdy-ref-color-night) 90%);
      --mdy-sys-color-on-tertiary-container:color-mix(in srgb,var(--mdy-sys-color-tertiary),var(--mdy-ref-color-cloud) 60%);
      --mdy-sys-color-error:var(--mdy-ref-color-error);
      --mdy-sys-color-on-error:color-mix(in srgb,var(--mdy-sys-color-error),var(--mdy-ref-color-cloud) 80%);
      --mdy-sys-color-error-container:color-mix(in srgb,var(--mdy-sys-color-error),var(--mdy-ref-color-night) 70%);
      --mdy-sys-color-on-error-container:color-mix(in srgb,var(--mdy-sys-color-error),var(--mdy-ref-color-cloud) 60%);
      --mdy-sys-color-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 85%);
      --mdy-sys-color-on-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 80%);
      --mdy-sys-color-surface-variant:color-mix(in srgb,var(--mdy-sys-color-primary),color-mix(in srgb,var(--mdy-ref-color-night),var(--mdy-ref-color-slate) 35%) 60%);
      --mdy-sys-color-on-surface-variant:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 60%);
      --mdy-sys-color-surface-container-lowest:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 100%);
      --mdy-sys-color-surface-container-low:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 88%);
      --mdy-sys-color-surface-container:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 80%);
      --mdy-sys-color-surface-container-high:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 70%);
      --mdy-sys-color-surface-container-highest:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 58%);
      --mdy-sys-color-background:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 95%);
      --mdy-sys-color-on-background:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 80%);
      --mdy-sys-color-outline:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-slate) 40%);
      --mdy-sys-color-outline-variant:color-mix(in srgb,var(--mdy-sys-color-primary),color-mix(in srgb,var(--mdy-ref-color-night),var(--mdy-ref-color-slate) 35%) 60%);
      --mdy-sys-color-inverse-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 60%);
      --mdy-sys-color-inverse-on-surface:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-night) 60%);
      --mdy-sys-color-inverse-primary:color-mix(in srgb,var(--mdy-sys-color-primary),var(--mdy-ref-color-cloud) 40%);
    }
  }
  :root {
    --mdy-comp-filled-text-field-container-color:var(--mdy-sys-color-surface-container-highest);
    --mdy-comp-filled-text-field-container-shape:var(--mdy-sys-shape-corner-extra-small);
    --mdy-comp-filled-text-field-container-height:56px;
    --mdy-comp-filled-text-field-label-text-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-filled-text-field-focus-label-text-color:var(--mdy-sys-color-primary);
    --mdy-comp-filled-text-field-input-text-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-filled-text-field-active-indicator-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-filled-text-field-focus-active-indicator-color:var(--mdy-sys-color-primary);
    --mdy-comp-filled-text-field-active-indicator-height:1px;
    --mdy-comp-filled-text-field-focus-active-indicator-height:2px;
    --mdy-comp-filled-text-field-leading-icon-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-filled-text-field-trailing-icon-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-filled-text-field-supporting-text-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-filled-text-field-error-active-indicator-color:var(--mdy-sys-color-error);
    --mdy-comp-filled-text-field-error-label-text-color:var(--mdy-sys-color-error);
    --mdy-comp-outlined-text-field-container-height:56px;
    --mdy-comp-outlined-text-field-label-text-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-outlined-text-field-focus-label-text-color:var(--mdy-sys-color-primary);
    --mdy-comp-outlined-text-field-input-text-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-outlined-text-field-outline-color:var(--mdy-sys-color-outline);
    --mdy-comp-outlined-text-field-focus-outline-color:var(--mdy-sys-color-primary);
    --mdy-comp-outlined-text-field-outline-width:1px;
    --mdy-comp-outlined-text-field-focus-outline-width:2px;
    --mdy-comp-outlined-text-field-container-shape:var(--mdy-sys-shape-corner-extra-small);
    --mdy-comp-outlined-text-field-supporting-text-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-outlined-text-field-error-outline-color:var(--mdy-sys-color-error);
    --mdy-comp-outlined-text-field-error-label-text-color:var(--mdy-sys-color-error);
    --mdy-comp-checkbox-container-size:18px;
    --mdy-comp-checkbox-container-shape:2px;
    --mdy-comp-checkbox-state-layer-size:40px;
    --mdy-comp-checkbox-state-layer-shape:var(--mdy-sys-shape-corner-full);
    --mdy-comp-checkbox-icon-size:18px;
    --mdy-comp-checkbox-selected-container-color:var(--mdy-sys-color-primary);
    --mdy-comp-checkbox-selected-icon-color:var(--mdy-sys-color-on-primary);
    --mdy-comp-checkbox-selected-state-layer-color:var(--mdy-sys-color-primary);
    --mdy-comp-checkbox-unselected-outline-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-checkbox-unselected-outline-width:2px;
    --mdy-comp-checkbox-unselected-state-layer-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-checkbox-error-container-color:var(--mdy-sys-color-error);
    --mdy-comp-checkbox-error-icon-color:var(--mdy-sys-color-on-error);
    --mdy-comp-checkbox-disabled-selected-container-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-checkbox-disabled-outline-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-switch-track-width:52px;
    --mdy-comp-switch-track-height:32px;
    --mdy-comp-switch-track-shape:9999px;
    --mdy-comp-switch-track-color:transparent;
    --mdy-comp-switch-track-outline-color:var(--mdy-sys-color-outline);
    --mdy-comp-switch-track-outline-width:2px;
    --mdy-comp-switch-selected-track-color:var(--mdy-sys-color-primary);
    --mdy-comp-switch-handle-size:16px;
    --mdy-comp-switch-selected-handle-size:24px;
    --mdy-comp-switch-handle-color:var(--mdy-sys-color-outline);
    --mdy-comp-switch-selected-handle-color:var(--mdy-sys-color-on-primary);
    --mdy-comp-switch-handle-shape:var(--mdy-sys-shape-corner-full);
    --mdy-comp-radio-icon-size:20px;
    --mdy-comp-radio-state-layer-size:40px;
    --mdy-comp-radio-selected-icon-color:var(--mdy-sys-color-primary);
    --mdy-comp-radio-unselected-icon-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-slider-active-track-height:4px;
    --mdy-comp-slider-inactive-track-height:4px;
    --mdy-comp-slider-handle-height:20px;
    --mdy-comp-slider-handle-width:20px;
    --mdy-comp-slider-handle-shape:var(--mdy-sys-shape-corner-full);
    --mdy-comp-slider-active-track-color:var(--mdy-sys-color-primary);
    --mdy-comp-slider-inactive-track-color:var(--mdy-sys-color-secondary-container);
    --mdy-comp-slider-handle-color:var(--mdy-sys-color-primary);
    --mdy-comp-slider-track-shape:var(--mdy-sys-shape-corner-full);
    --mdy-comp-segmented-button-height:40px;
    --mdy-comp-segmented-button-shape:var(--mdy-sys-shape-corner-full);
    --mdy-comp-segmented-button-outline-color:var(--mdy-sys-color-outline);
    --mdy-comp-segmented-button-selected-container-color:var(--mdy-sys-color-secondary-container);
    --mdy-comp-segmented-button-selected-label-text-color:var(--mdy-sys-color-on-secondary-container);
    --mdy-comp-segmented-button-unselected-label-text-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-segmented-button-label-text-font-size:var(--mdy-sys-typescale-label-large-size);
    --mdy-comp-segmented-button-label-text-weight:var(--mdy-sys-typescale-label-large-weight);
    --mdy-comp-filter-chip-container-height:32px;
    --mdy-comp-filter-chip-container-shape:var(--mdy-sys-shape-corner-small);
    --mdy-comp-filter-chip-outline-color:var(--mdy-sys-color-outline);
    --mdy-comp-filter-chip-selected-container-color:var(--mdy-sys-color-secondary-container);
    --mdy-comp-filter-chip-selected-label-text-color:var(--mdy-sys-color-on-secondary-container);
    --mdy-comp-filter-chip-label-text-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-filter-chip-hover-state-layer-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-time-picker-container-color:var(--mdy-sys-color-surface-container-high);
    --mdy-comp-time-picker-container-shape:var(--mdy-sys-shape-corner-extra-large);
    --mdy-comp-time-picker-input-container-color:var(--mdy-sys-color-surface-container-highest);
    --mdy-comp-time-picker-input-container-shape:var(--mdy-sys-shape-corner-small);
    --mdy-comp-time-picker-input-segment-width:96px;
    --mdy-comp-time-picker-input-segment-height:80px;
    --mdy-comp-time-picker-clock-dial-container-color:var(--mdy-sys-color-surface-container-highest);
    --mdy-comp-time-picker-clock-dial-size:256px;
    --mdy-comp-time-picker-headline-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-time-picker-selected-segment-color:var(--mdy-sys-color-primary);
    --mdy-comp-time-picker-selected-segment-container-color:var(--mdy-sys-color-primary-container);
    --mdy-comp-time-picker-period-outline-color:var(--mdy-sys-color-outline);
    --mdy-comp-color-picker-swatch-size:2.5rem;
    --mdy-comp-color-picker-swatch-height:1.25rem;
    --mdy-comp-color-picker-swatch-radius:var(--mdy-sys-shape-corner-full);
    --mdy-comp-color-picker-dropdown-radius:var(--mdy-sys-shape-corner-medium);
    --mdy-comp-color-picker-dropdown-shadow:0 2px 6px 2px rgba(0,0,0,.15),0 1px 2px rgba(0,0,0,.3);
    --mdy-comp-date-picker-docked-container-color:var(--mdy-sys-color-surface-container-high);
    --mdy-comp-date-picker-docked-header-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-comp-date-picker-docked-selected-date-container-color:var(--mdy-sys-color-primary);
    --mdy-comp-date-picker-docked-selected-date-label-color:var(--mdy-sys-color-on-primary);
    --mdy-comp-date-picker-docked-today-date-color:var(--mdy-sys-color-primary);
    --mdy-comp-date-picker-docked-date-label-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-date-picker-docked-weekday-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-date-picker-modal-container-color:var(--mdy-sys-color-surface-container-high);
    --mdy-comp-date-picker-modal-container-shape:var(--mdy-sys-shape-corner-extra-large);
    --mdy-comp-date-picker-modal-headline-color:var(--mdy-sys-color-on-surface);
    --mdy-comp-date-picker-modal-supporting-text-color:var(--mdy-sys-color-on-surface-variant);
    --mdy-floating-density:0;
    --mdy-slider-fill-pct:0%;
    --mdy-overlay-top:auto;
    --mdy-overlay-bottom:auto;
    --mdy-overlay-left:auto;
    --mdy-overlay-right:auto;
    --mdy-overlay-max-height:50vh;
  }
}
@layer mdy.tokens, mdy.base, mdy.components, mdy.themes;
@layer mdy.tokens {
  :root {
    --mdy-primary:var(--mdy-sys-color-primary);
    --mdy-on-primary:var(--mdy-sys-color-on-primary);
    --mdy-primary-container:var(--mdy-sys-color-primary-container);
    --mdy-on-primary-container:var(--mdy-sys-color-on-primary-container);
    --mdy-error:var(--mdy-sys-color-error);
    --mdy-on-error:var(--mdy-sys-color-on-error);
    --mdy-error-container:var(--mdy-sys-color-error-container);
    --mdy-on-error-container:var(--mdy-sys-color-on-error-container);
    --mdy-surface:var(--mdy-sys-color-surface);
    --mdy-on-surface:var(--mdy-sys-color-on-surface);
    --mdy-on-surface-variant:var(--mdy-sys-color-on-surface-variant);
    --mdy-surface-container-lowest:var(--mdy-sys-color-surface-container-lowest);
    --mdy-surface-container-low:var(--mdy-sys-color-surface-container-low);
    --mdy-surface-container:var(--mdy-sys-color-surface-container);
    --mdy-surface-container-high:var(--mdy-sys-color-surface-container-high);
    --mdy-surface-container-highest:var(--mdy-sys-color-surface-container-highest);
    --mdy-surface-container-highest-hover:color-mix(in srgb,var(--mdy-surface-container-highest),var(--mdy-on-surface) 8%);
    --mdy-outline:var(--mdy-sys-color-outline);
    --mdy-outline-variant:var(--mdy-sys-color-outline-variant);
    --mdy-outline-subtle:color-mix(in srgb,var(--mdy-outline-variant),transparent 40%);
    --mdy-corner-none:var(--mdy-sys-shape-corner-none);
    --mdy-corner-extra-small:var(--mdy-sys-shape-corner-extra-small);
    --mdy-corner-small:var(--mdy-sys-shape-corner-small);
    --mdy-corner-medium:var(--mdy-sys-shape-corner-medium);
    --mdy-corner-large:var(--mdy-sys-shape-corner-large);
    --mdy-corner-extra-large:var(--mdy-sys-shape-corner-extra-large);
    --mdy-corner-full:var(--mdy-sys-shape-corner-full);
    --mdy-state-hover-opacity:var(--mdy-sys-state-hover-opacity);
    --mdy-state-focus-opacity:var(--mdy-sys-state-focus-opacity);
    --mdy-state-disabled-content-opacity:var(--mdy-sys-state-disabled-content-opacity);
    --mdy-state-disabled-container-opacity:var(--mdy-sys-state-disabled-container-opacity);
    --mdy-shadow-depth-1:0 1px 2px rgba(0,0,0,.3),0 1px 3px 1px rgba(0,0,0,.15);
    --mdy-shadow-depth-2:0 1px 2px rgba(0,0,0,.3),0 2px 6px 2px rgba(0,0,0,.15);
    --mdy-shadow-depth-3:0 1px 3px rgba(0,0,0,.3),0 4px 8px 3px rgba(0,0,0,.15);
    --mdy-input-height:var(--mdy-comp-filled-text-field-container-height);
    --mdy-input-bg:var(--mdy-comp-filled-text-field-container-color);
    --mdy-input-bg-hover:color-mix(in srgb,var(--mdy-input-bg),var(--mdy-on-surface) 8%);
    --mdy-input-border-radius:var(--mdy-comp-filled-text-field-container-shape);
    --mdy-input-color:var(--mdy-comp-filled-text-field-input-text-color);
    --mdy-input-placeholder-color:var(--mdy-comp-filled-text-field-label-text-color);
    --mdy-input-focus-color:var(--mdy-comp-filled-text-field-focus-active-indicator-color);
    --mdy-input-icon-color:var(--mdy-comp-filled-text-field-leading-icon-color);
    --mdy-input-focus-shadow:inset 0 -2px 0 0 var(--mdy-input-focus-color);
    --mdy-error-color:var(--mdy-comp-filled-text-field-error-active-indicator-color);
    --mdy-error-focus-shadow:inset 0 -2px 0 0 var(--mdy-error-color);
    --mdy-input-font-size:var(--mdy-sys-typescale-body-large-size);
    --mdy-input-line-height:var(--mdy-sys-typescale-body-large-line-height);
    --mdy-input-padding:0.5rem 1rem;
    --mdy-label-font-size:var(--mdy-sys-typescale-body-large-size);
    --mdy-label-font-weight:var(--mdy-sys-typescale-label-large-weight);
    --mdy-helper-font-size:var(--mdy-sys-typescale-body-small-size);
    --mdy-helper-line-height:var(--mdy-sys-typescale-body-small-line-height);
    --mdy-helper-padding-top:4px;
    --mdy-error-font-size:var(--mdy-sys-typescale-body-small-size);
    --mdy-error-line-height:var(--mdy-sys-typescale-body-small-line-height);
    --mdy-renderer-gap:0;
    --mdy-renderer-margin-bottom:1rem;
    --mdy-disabled-bg:color-mix(in srgb,var(--mdy-on-surface),transparent 88%);
    --mdy-disabled-color:color-mix(in srgb,var(--mdy-on-surface),transparent 62%);
    --mdy-overlay-backdrop-bg:rgba(0,0,0,.4);
    --mdy-tooltip-border-radius:var(--mdy-corner-extra-small);
    --mdy-checkbox-size:var(--mdy-comp-checkbox-container-size);
    --mdy-checkbox-border-radius:var(--mdy-comp-checkbox-container-shape);
    --mdy-checkbox-accent:var(--mdy-comp-checkbox-selected-container-color);
    --mdy-checkbox-checkmark-color:var(--mdy-comp-checkbox-selected-icon-color);
    --mdy-checkbox-border:var(--mdy-comp-checkbox-unselected-outline-width) solid var(--mdy-comp-checkbox-unselected-outline-color);
    --mdy-checkbox-gap:0.75rem;
    --mdy-checkbox-transition:0.15s cubic-bezier(0.4,0,0.2,1);
    --mdy-checkbox-tick-w:0.3;
    --mdy-checkbox-tick-h:0.55;
    --mdy-checkbox-tick-left:0.35;
    --mdy-checkbox-tick-offset:-158%;
    --mdy-toggle-width:var(--mdy-comp-switch-track-width);
    --mdy-toggle-height:var(--mdy-comp-switch-track-height);
    --mdy-toggle-bg:var(--mdy-comp-switch-track-color);
    --mdy-toggle-border:var(--mdy-comp-switch-track-outline-width) solid var(--mdy-comp-switch-track-outline-color);
    --mdy-toggle-bg-checked:var(--mdy-comp-switch-selected-track-color);
    --mdy-toggle-border-checked:0px solid transparent;
    --mdy-toggle-thumb-size:var(--mdy-comp-switch-handle-size);
    --mdy-toggle-thumb-size-checked:var(--mdy-comp-switch-selected-handle-size);
    --mdy-toggle-thumb-color:var(--mdy-comp-switch-handle-color);
    --mdy-toggle-thumb-color-checked:var(--mdy-comp-switch-selected-handle-color);
    --mdy-toggle-thumb-offset:4px;
    --mdy-toggle-gap:0.75rem;
    --mdy-toggle-transition:0.2s cubic-bezier(0.4,0,0.2,1);
    --mdy-radio-size:var(--mdy-comp-radio-icon-size);
    --mdy-radio-selected-color:var(--mdy-comp-radio-selected-icon-color);
    --mdy-radio-unselected-color:var(--mdy-comp-radio-unselected-icon-color);
    --mdy-segmented-height:var(--mdy-comp-segmented-button-height);
    --mdy-segmented-border-radius:var(--mdy-comp-segmented-button-shape);
    --mdy-segmented-border-color:var(--mdy-comp-segmented-button-outline-color);
    --mdy-segmented-selected-bg:var(--mdy-comp-segmented-button-selected-container-color);
    --mdy-segmented-selected-color:var(--mdy-comp-segmented-button-selected-label-text-color);
    --mdy-segmented-unselected-color:var(--mdy-comp-segmented-button-unselected-label-text-color);
    --mdy-segmented-font-size:var(--mdy-comp-segmented-button-label-text-font-size);
    --mdy-segmented-font-weight:var(--mdy-comp-segmented-button-label-text-weight);
    --mdy-segmented-btn-bg-selected-hover:color-mix(in srgb,var(--mdy-segmented-selected-bg),var(--mdy-segmented-selected-color) 8%);
    --mdy-button-radius:var(--mdy-corner-full);
    --mdy-chip-height:var(--mdy-comp-filter-chip-container-height);
    --mdy-chip-border-radius:var(--mdy-comp-filter-chip-container-shape);
    --mdy-chip-padding:0 0.75rem;
    --mdy-chip-gap:0.375rem;
    --mdy-chip-border:1px solid var(--mdy-comp-filter-chip-outline-color);
    --mdy-chip-bg:transparent;
    --mdy-chip-color:var(--mdy-comp-filter-chip-label-text-color);
    --mdy-chip-font-size:var(--mdy-sys-typescale-label-large-size);
    --mdy-chip-selected-bg:var(--mdy-comp-filter-chip-selected-container-color);
    --mdy-chip-selected-color:var(--mdy-comp-filter-chip-selected-label-text-color);
    --mdy-chip-selected-border:1px solid var(--mdy-comp-filter-chip-outline-color);
    --mdy-chip-hover-bg:color-mix(in srgb,var(--mdy-on-surface),transparent 92%);
    --mdy-chip-hover-color:var(--mdy-on-surface);
    --mdy-chip-hover-border:1px solid var(--mdy-comp-filter-chip-outline-color);
    --mdy-chip-max-width:11rem;
    --mdy-chip-transition:0.15s cubic-bezier(0.4,0,0.2,1);
    --mdy-slider-track-height:var(--mdy-comp-slider-active-track-height);
    --mdy-slider-thumb-size:var(--mdy-comp-slider-handle-height);
    --mdy-slider-active-color:var(--mdy-comp-slider-active-track-color);
    --mdy-slider-inactive-color:var(--mdy-comp-slider-inactive-track-color);
    --mdy-slider-thumb-color:var(--mdy-comp-slider-handle-color);
    --mdy-slider-track-color:linear-gradient(
        to right,var(--mdy-slider-active-color) var(--mdy-slider-fill-pct,0%),var(--mdy-slider-inactive-color) var(--mdy-slider-fill-pct,0%));
    --mdy-color-swatch-size:var(--mdy-comp-color-picker-swatch-size);
    --mdy-color-swatch-radius:var(--mdy-comp-color-picker-swatch-radius);
    --mdy-color-dropdown-radius:var(--mdy-comp-color-picker-dropdown-radius);
    --mdy-color-dropdown-shadow:var(--mdy-comp-color-picker-dropdown-shadow);
    --mdy-spin-btn-size:1.5rem;
    --mdy-spin-btn-border-radius:var(--mdy-corner-full);
    --mdy-spin-btn-hover-bg:color-mix(in srgb,var(--mdy-primary),transparent 92%);
    --mdy-select-dropdown-bg:var(--mdy-surface-container);
    --mdy-select-dropdown-border:none;
    --mdy-select-dropdown-border-radius:var(--mdy-corner-extra-small);
    --mdy-select-dropdown-shadow:var(--mdy-shadow-depth-2);
    --mdy-select-dropdown-max-height:17.5rem;
    --mdy-select-option-padding:0.75rem 1rem;
    --mdy-select-border-subtle:var(--mdy-outline-variant);
    --mdy-select-no-results-color:var(--mdy-on-surface-variant);
    --mdy-select-placeholder-color:var(--mdy-input-placeholder-color);
    --mdy-select-option-hover-bg:color-mix(in srgb,var(--mdy-on-surface),transparent 92%);
    --mdy-select-option-hover-color:var(--mdy-on-surface);
    --mdy-select-option-selected-bg:color-mix(in srgb,var(--mdy-on-surface),transparent 88%);
    --mdy-select-option-selected-color:var(--mdy-on-surface);
    --mdy-select-option-selected-weight:500;
    --mdy-multiselect-padding:0.5rem 1rem;
    --mdy-multiselect-max-height:5.5rem;
    --mdy-file-container-border:2px dashed var(--mdy-outline-variant);
    --mdy-file-container-radius:var(--mdy-corner-medium);
    --mdy-file-container-bg:var(--mdy-surface-container);
    --mdy-datepicker-cell-size:var(--mdy-comp-date-picker-cell-size);
    --mdy-datepicker-cell-font-size:var(--mdy-comp-date-picker-cell-font-size);
    --mdy-datepicker-popup-padding:var(--mdy-comp-date-picker-popup-padding);
    --mdy-datepicker-popup-shadow:var(--mdy-comp-date-picker-popup-shadow);
    --mdy-datepicker-popup-bg:var(--mdy-comp-date-picker-popup-bg);
    --mdy-datepicker-modal-bg:var(--mdy-comp-date-picker-modal-container-color);
    --mdy-datepicker-modal-radius:var(--mdy-comp-date-picker-modal-container-shape);
    --mdy-datepicker-hover-bg:var(--mdy-comp-date-picker-cell-hover-bg);
    --mdy-datepicker-disabled-opacity:var(--mdy-comp-date-picker-cell-disabled-opacity);
    --mdy-datepicker-today-color:var(--mdy-sys-color-primary);
    --mdy-daterange-in-range-bg:var(--mdy-comp-date-picker-in-range-bg);
    --mdy-daterange-endpoint-bg:var(--mdy-comp-date-picker-endpoint-bg);
    --mdy-daterange-endpoint-color:var(--mdy-comp-date-picker-endpoint-color);
    --mdy-daterange-input-min-width:8ch;
    --mdy-daterange-input-padding:0 0.5rem;
    --mdy-daterange-sep-padding:0 0.25rem;
    --mdy-select-arrow-color:var(--mdy-on-surface-variant);
    --mdy-multiselect-overlay-bg:var(--mdy-surface);
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --mdy-overlay-backdrop-bg:rgba(0,0,0,.6);
      --mdy-shadow-depth-1:0 1px 3px rgba(0,0,0,.5),0 1px 4px 1px rgba(0,0,0,.3);
      --mdy-shadow-depth-2:0 1px 3px rgba(0,0,0,.5),0 2px 8px 2px rgba(0,0,0,.3);
      --mdy-shadow-depth-3:0 1px 3px rgba(0,0,0,.5),0 4px 12px 6px rgba(0,0,0,.3);
    }
  }
  @keyframes mdy-spin {
    0% {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(1turn);
    }
  }
}
@layer mdy.base {
  .mdy-spin-btn {
    align-items: center;
    background: transparent;
    border: none;
    border-radius: var(--mdy-spin-btn-border-radius);
    box-shadow: none;
    color: var(--mdy-input-icon-color);
    display: flex;
    font-size: 1em;
    height: 1.25em;
    justify-content: center;
    line-height: 1;
    outline: none;
    transition: background .15s, color .15s;
    width: var(--mdy-spin-btn-size);
  }
  .mdy-spin-btn-up {
    margin-bottom: .1em;
  }
  .mdy-spin-btn-down {
    margin-top: .1em;
  }
  .mdy-spin-btn:focus,
  .mdy-spin-btn:hover {
    background: var(--mdy-spin-btn-hover-bg);
    color: var(--mdy-input-focus-color);
  }
  .mdy-spin-btn:active {
    background: var(--mdy-input-focus-color);
    color: var(--mdy-on-error);
  }
  .mdy-spin-btn svg {
    display: block;
    height: 1em;
    pointer-events: none;
    width: 1em;
  }
  input[type=number]::-webkit-inner-spin-button,
  input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  input[type=number] {
    appearance: textfield;
    -moz-appearance: textfield;
  }
  input[type=date] {
    font-size: var(--mdy-input-font-size);
  }
  .mdy-datepicker__input:focus,
  .mdy-daterange__input:focus,
  input[type=date]:focus {
    box-shadow: none !important;
    outline: none !important;
  }
  .mdy-colors {
    position: relative;
    width: 100%;
  }
  .mdy-colors .mdy-input-wrapper {
    align-items: center !important;
    display: flex !important;
    padding: 0 !important;
  }
  .mdy-input-wrapper__inliner {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    height: 100%;
    padding: 0 .25rem 0 .75rem;
    width: 100%;
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--colors .mdy-input-wrapper__inliner {
    align-items: center;
    padding-left: 1rem;
    padding-top: var(--mdy-fl-pad-top);
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--colors .mdy-colors__hex-input {
    height: 100% !important;
    line-height: normal !important;
    padding: 0 !important;
  }
  .mdy-colors__primary-picker {
    align-items: center;
    align-self: stretch;
    appearance: none;
    background: none;
    border: none;
    border-radius: var(--mdy-corner-extra-small);
    cursor: pointer;
    display: inline-flex;
    flex-shrink: 0;
    justify-content: center;
    margin: 0;
    padding: 0 .5rem;
    position: relative;
    transition: background .15s;
    width: 3rem;
  }
  .mdy-colors__primary-picker:hover:not(:disabled) {
    background: color-mix(in srgb, var(--mdy-on-surface), transparent 92%);
  }
  .mdy-colors__primary-picker:focus-visible {
    outline: 2px solid var(--mdy-primary);
    outline-offset: -2px;
  }
  .mdy-colors__primary-picker:disabled {
    cursor: not-allowed;
    opacity: .38;
  }
  .mdy-colors__preview-swatch {
    border: 1px solid var(--mdy-outline-variant);
    border-radius: var(--mdy-color-swatch-radius);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
    height: 1.25rem;
    pointer-events: none;
    transition: transform .2s;
    width: 1.625rem;
  }
  .mdy-colors__primary-picker:hover:not(:disabled) .mdy-colors__preview-swatch {
    transform: scale(1.05);
  }
  .mdy-colors__toggle-area {
    align-items: center;
    align-self: stretch;
    appearance: none;
    background: none;
    border: none;
    border-radius: 0 var(--mdy-input-border-radius) var(--mdy-input-border-radius) 0;
    cursor: pointer;
    display: inline-flex;
    flex-shrink: 0;
    height: auto;
    justify-content: center;
    margin: 0 -.25rem 0 0;
    min-width: 2.75rem;
    padding: 0 .75rem 0 .5rem;
    transition: background .15s, color .15s;
  }
  .mdy-colors__toggle-area:hover:not(:disabled) {
    background: color-mix(in srgb, var(--mdy-on-surface), transparent 92%);
  }
  .mdy-colors__toggle-area:focus-visible {
    outline: 2px solid var(--mdy-primary);
    outline-offset: -2px;
  }
  .mdy-colors__toggle-area:disabled {
    cursor: not-allowed;
    opacity: .38;
  }
  .mdy-colors__arrow--open,
  .mdy-select__arrow--open {
    transform: rotate(180deg);
  }
  .mdy-colors__native-hidden {
    border: none;
    cursor: pointer;
    height: 100%;
    left: 0;
    margin: 0;
    opacity: 0 !important;
    padding: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
  }
  .mdy-colors__native-picker::-webkit-color-swatch-wrapper {
    padding: 0;
  }
  .mdy-colors__native-picker::-webkit-color-swatch {
    border: none;
    border-radius: var(--mdy-corner-extra-small);
  }
  .mdy-colors__hex-input {
    flex: 1;
    min-width: 0;
  }
  .mdy-colors__swatch-toggle {
    align-items: center;
    background: transparent;
    border: none;
    color: var(--mdy-on-surface-variant);
    cursor: pointer;
    display: flex;
    height: var(--mdy-input-height);
    justify-content: center;
    transition: color .2s, transform .2s;
    width: 2.5rem;
  }
  .mdy-colors__swatch-toggle:hover {
    color: var(--mdy-primary);
  }
  .mdy-colors--open .mdy-colors__swatch-toggle {
    color: var(--mdy-primary);
    transform: rotate(180deg);
  }
  .mdy-colors__dropdown {
    background: var(--mdy-surface-container);
    border: none;
    border-radius: var(--mdy-color-dropdown-radius);
    box-shadow: var(--mdy-color-dropdown-shadow);
    display: none;
    left: 0;
    margin-top: 8px;
    min-width: 280px;
    padding: 1.25rem;
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 1000;
  }
  .mdy-colors--open .mdy-colors__dropdown {
    bottom: var(--mdy-overlay-bottom,auto);
    display: block;
    left: var(--mdy-overlay-left,auto);
    margin: 4px 0 0;
    min-width: 280px;
    position: fixed;
    right: var(--mdy-overlay-right,auto);
    top: var(--mdy-overlay-top,auto);
    width: auto;
  }
  .mdy-colors__dropdown--above {
    bottom: 100%;
    margin-bottom: 8px;
    margin-top: 0;
    top: auto;
  }
  .mdy-colors__dropdown--overlay {
    left: 50%;
    margin: 0;
    max-width: 320px;
    position: fixed;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 2rem);
    z-index: 9999;
  }
  .mdy-colors__dropdown-header {
    color: var(--mdy-on-surface-variant);
    font-size: var(--mdy-helper-font-size);
    font-weight: var(--mdy-label-font-weight);
    letter-spacing: .006em;
    margin-bottom: .75rem;
    text-transform: none;
  }
  .mdy-colors__presets {
    display: flex;
    flex-wrap: wrap;
    gap: .625rem;
  }
  .mdy-color-swatch {
    background-color: var(--color,transparent);
    border: 2px solid transparent;
    border-radius: var(--mdy-color-swatch-radius);
    cursor: pointer;
    height: var(--mdy-color-swatch-size);
    outline: 2px solid transparent;
    outline-offset: 2px;
    padding: 0;
    transition: all .2s cubic-bezier(.4, 0, .2, 1);
    width: var(--mdy-color-swatch-size);
  }
  .mdy-color-swatch:hover {
    outline-color: var(--mdy-outline);
    transform: scale(1.1);
  }
  .mdy-color-swatch--active {
    box-shadow: 0 0 0 2px var(--mdy-surface);
    outline-color: var(--mdy-primary);
    transform: scale(1.1);
  }
  .mdy-renderer--colors.disabled .mdy-color-swatch {
    cursor: not-allowed;
    opacity: .5;
  }
}
@layer mdy.components {
  .mdy-renderer {
    display: flex;
    flex-direction: column;
    gap: var(--mdy-renderer-gap);
    margin-bottom: var(--mdy-renderer-margin-bottom);
    --mdy-input-height:calc(3.5rem + var(--mdy-floating-density, 0)*0.25rem);
  }
  .mdy-input-wrapper {
    align-items: center;
    background-color: var(--mdy-input-bg);
    border-radius: var(--mdy-input-border-radius) var(--mdy-input-border-radius) 0 0;
    box-shadow: inset 0 -1px 0 0 var(--mdy-outline-variant);
    display: flex;
    min-height: var(--mdy-input-height);
    position: relative;
    transition: background-color .2s, box-shadow .2s;
    width: 100%;
  }
  .mdy-input-wrapper:has(textarea) {
    align-items: flex-start;
  }
  .mdy-input-wrapper:hover:not(:focus-within) {
    background-color: var(--mdy-input-bg-hover);
  }
  .mdy-input-wrapper:focus-within {
    background-color: var(--mdy-input-bg-hover);
    box-shadow: inset 0 -2px 0 0 var(--mdy-input-focus-color);
  }
  .mdy-input-wrapper--error {
    box-shadow: inset 0 -2px 0 0 var(--mdy-error-color) !important;
  }
  .mdy-input-wrapper--disabled {
    cursor: not-allowed;
    opacity: .38;
    pointer-events: none;
  }
  .mdy-input-wrapper input:not(.mdy-checkbox, .mdy-switch),
  .mdy-input-wrapper textarea {
    background: transparent;
    border: none !important;
    box-shadow: none !important;
    color: var(--mdy-input-color);
    flex: 1;
    font-size: var(--mdy-input-font-size);
    min-width: 0;
    outline: none;
    padding: var(--mdy-input-padding);
    width: 100%;
  }
  .mdy-input-prefix + input,
  .mdy-input-prefix + textarea {
    padding-left: .25rem;
  }
  input:has(+ .mdy-input-suffix),
  textarea:has(+ .mdy-input-suffix) {
    padding-right: .25rem;
  }
  .mdy-input-prefix,
  .mdy-input-suffix {
    align-items: center;
    color: var(--mdy-input-icon-color);
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    transition: color .2s;
  }
  .mdy-input-wrapper:focus-within .mdy-input-prefix,
  .mdy-input-wrapper:focus-within .mdy-input-suffix {
    color: var(--mdy-input-focus-color);
  }
  .mdy-input-prefix {
    padding-left: .75rem;
    padding-right: .25rem;
  }
  .mdy-input-suffix {
    padding-left: .25rem;
    padding-right: .75rem;
  }
  .mdy-input-wrapper:has(textarea) .mdy-input-prefix,
  .mdy-input-wrapper:has(textarea) .mdy-input-suffix {
    padding-top: 1rem;
  }
  .mdy-supporting-text {
    color: var(--mdy-on-surface-variant);
    font-size: var(--mdy-helper-font-size);
    line-height: var(--mdy-helper-line-height);
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: var(--mdy-helper-padding-top);
  }
  .mdy-renderer .mdy-label {
    color: var(--mdy-on-surface-variant);
    display: block;
    font-size: var(--mdy-label-font-size);
    font-weight: var(--mdy-label-font-weight);
    margin-bottom: 0;
  }
  .mdy-renderer.mdy-floating-label {
    --mdy-fl-density-val:var(--mdy-floating-density,0);
    --mdy-fl-input-padding-with-prefix:0.75rem;
    --mdy-fl-label-height:0.75rem;
    --mdy-prefix-pad-left:1rem;
    --mdy-prefix-icon-area:2rem;
    --mdy-prefix-spacer:0.25rem;
    --mdy-fl-prefix-width:calc(var(--mdy-prefix-pad-left) + var(--mdy-prefix-icon-area) + var(--mdy-prefix-spacer));
    --mdy-fl-height:calc(3.5rem + var(--mdy-fl-density-val)*0.25rem);
    --mdy-floating-input-height:var(--mdy-fl-height);
    --mdy-fl-label-active-top:calc(0.5rem + var(--mdy-fl-density-val)*0.0625rem);
    --mdy-fl-gap-mid:calc(0.125rem + var(--mdy-fl-density-val)*0.03125rem);
    --mdy-fl-pad-top:calc(var(--mdy-fl-label-active-top) + var(--mdy-fl-label-height) + var(--mdy-fl-gap-mid));
    --mdy-fl-pad-bottom:calc(var(--mdy-floating-input-height) - var(--mdy-fl-pad-top) - 1.45rem);
    --mdy-floating-input-padding:var(--mdy-fl-pad-top) 1rem var(--mdy-fl-pad-bottom);
    margin-top: 0;
    position: relative;
  }
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper {
    align-items: stretch;
    height: var(--mdy-floating-input-height);
    min-height: var(--mdy-floating-input-height);
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--textarea {
    --mdy-fl-pad-top-textarea:2.25rem;
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--textarea .mdy-input-wrapper {
    align-items: stretch;
    height: auto;
    min-height: 6rem;
  }
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper .mdy-select__trigger,
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper input,
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper select,
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper textarea {
    box-sizing: border-box;
    height: var(--mdy-floating-input-height) !important;
    line-height: inherit;
    padding: var(--mdy-floating-input-padding) !important;
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--textarea .mdy-input-wrapper textarea {
    height: auto !important;
    padding-top: var(--mdy-fl-pad-top-textarea) !important;
  }
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper select {
    line-height: var(--mdy-input-line-height) !important;
    padding-bottom: 0 !important;
    padding-top: calc(var(--mdy-fl-pad-top) - 1px) !important;
  }
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper .mdy-select__trigger {
    align-items: flex-start;
    display: flex;
  }
  .mdy-renderer.mdy-floating-label:not(:has(:focus-within)):not(:has(.mdy-label--filled)) .mdy-select__trigger,
  .mdy-renderer.mdy-floating-label:not(:has(:focus-within)):not(:has(.mdy-label--filled)) select {
    color: transparent !important;
  }
  .mdy-renderer.mdy-floating-label:not(:has(:focus-within)):not(:has(.mdy-label--filled)) .mdy-select__value {
    opacity: 0 !important;
  }
  .mdy-renderer.mdy-floating-label .mdy-input-prefix,
  .mdy-renderer.mdy-floating-label .mdy-input-suffix {
    align-items: center;
    display: flex;
    padding-top: 0;
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--textarea .mdy-input-prefix,
  .mdy-renderer.mdy-floating-label.mdy-renderer--textarea .mdy-input-suffix {
    align-items: flex-start;
    padding-top: var(--mdy-fl-pad-top);
  }
  .mdy-renderer.mdy-floating-label .mdy-input-prefix {
    box-sizing: border-box;
    padding-left: 1rem;
    padding-right: 0;
  }
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper:has(.mdy-input-prefix) input,
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper:has(.mdy-input-prefix) select,
  .mdy-renderer.mdy-floating-label .mdy-input-wrapper:has(.mdy-input-prefix) textarea {
    padding-left: var(--mdy-fl-input-padding-with-prefix) !important;
  }
  .mdy-renderer.mdy-floating-label .mdy-label {
    color: var(--mdy-input-placeholder-color);
    font-size: var(--mdy-input-font-size);
    font-weight: 400;
    left: var(--mdy-label-left-offset,1rem);
    margin-bottom: 0;
    pointer-events: auto;
    position: absolute;
    top: 0;
    transform: translateY(calc((var(--mdy-floating-input-height) - 1.25rem)/2)) scale(1);
    transform-origin: left top;
    transition:
      transform .15s cubic-bezier(.4, 0, .2, 1),
      font-size .15s cubic-bezier(.4, 0, .2, 1),
      color .15s cubic-bezier(.4, 0, .2, 1);
    z-index: 10;
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--textarea .mdy-label {
    transform: translateY(.625rem) scale(1);
  }
  .mdy-renderer.mdy-floating-label.mdy-renderer--open .mdy-label,
  .mdy-renderer.mdy-floating-label:has(.mdy-chip) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(.mdy-input-wrapper:focus-within) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(.mdy-label--filled) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(.mdy-label--has-error) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(.mdy-select__option--selected) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(input:not(:placeholder-shown)) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(input[type=date]) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(input[type=time]) .mdy-label {
    color: var(--mdy-on-surface-variant);
    font-weight: 500;
    transform: translateY(var(--mdy-fl-label-active-top)) scale(.75);
  }
  .mdy-renderer.mdy-floating-label:has(.mdy-input-wrapper:focus-within) .mdy-label {
    color: var(--mdy-input-focus-color);
  }
  .mdy-label.mdy-label--has-error,
  .mdy-renderer.mdy-floating-label.mdy-renderer--touched:has([aria-invalid=true]) .mdy-label,
  .mdy-renderer.mdy-floating-label:has(.mdy-label--has-error) .mdy-label {
    color: var(--mdy-error-color) !important;
  }
  .mdy-renderer.mdy-floating-label:has(.mdy-input-prefix) {
    --mdy-label-left-offset:2.5rem;
  }
  .mdy-renderer.mdy-floating-label input:placeholder-shown:not(:focus)::placeholder,
  .mdy-renderer.mdy-floating-label textarea:placeholder-shown:not(:focus)::placeholder {
    color: transparent !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }
  .mdy-renderer.mdy-floating-label input:focus::placeholder,
  .mdy-renderer.mdy-floating-label input:not(:placeholder-shown)::placeholder,
  .mdy-renderer.mdy-floating-label textarea:focus::placeholder,
  .mdy-renderer.mdy-floating-label textarea:not(:placeholder-shown)::placeholder {
    color: var(--mdy-input-placeholder-color) !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  .mdy-renderer.mdy-floating-label:not(:has(:focus-within)):not(:has(.mdy-label--filled)) .mdy-select__placeholder {
    opacity: 0 !important;
    visibility: hidden !important;
  }
  .mdy-renderer input[type=date],
  .mdy-renderer input[type=email],
  .mdy-renderer input[type=number],
  .mdy-renderer input[type=text],
  .mdy-renderer select,
  .mdy-renderer textarea {
    background-color: var(--mdy-input-bg);
    border: none;
    border-radius: var(--mdy-input-border-radius) var(--mdy-input-border-radius) 0 0;
    box-shadow: inset 0 -1px 0 0 var(--mdy-outline-variant);
    color: var(--mdy-input-color);
    font-size: var(--mdy-input-font-size);
    min-height: var(--mdy-input-height);
    outline: none;
    padding: var(--mdy-input-padding);
    transition: background-color .2s, box-shadow .2s;
    width: 100%;
  }
  .mdy-renderer input:hover:not(:focus):not(:disabled),
  .mdy-renderer select:hover:not(:focus):not(:disabled),
  .mdy-renderer textarea:hover:not(:focus):not(:disabled) {
    background-color: var(--mdy-input-bg-hover);
  }
  .mdy-renderer input::placeholder,
  .mdy-renderer textarea::placeholder {
    color: var(--mdy-input-placeholder-color);
  }
  .mdy-renderer input[type=date]::-webkit-calendar-picker-indicator {
    filter: var(--mdy-calendar-icon-filter,none);
  }
  .mdy-renderer input:focus,
  .mdy-renderer select:focus,
  .mdy-renderer textarea:focus {
    background-color: var(--mdy-input-bg-hover);
    box-shadow: var(--mdy-input-focus-shadow);
  }
  .mdy-renderer--touched input[aria-invalid=true],
  .mdy-renderer--touched select[aria-invalid=true],
  .mdy-renderer--touched textarea[aria-invalid=true] {
    box-shadow: inset 0 -2px 0 0 var(--mdy-error-color);
  }
  .mdy-renderer--touched input[aria-invalid=true]:focus,
  .mdy-renderer--touched textarea[aria-invalid=true]:focus {
    box-shadow: var(--mdy-error-focus-shadow);
  }
  .mdy-input-wrapper input:not(.mdy-checkbox, .mdy-switch),
  .mdy-input-wrapper select,
  .mdy-input-wrapper textarea {
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--mdy-input-color);
    flex: 1;
    font-size: var(--mdy-input-font-size);
    line-height: var(--mdy-input-line-height);
    min-width: 0;
    outline: none;
    padding: var(--mdy-input-padding);
    width: 100%;
  }
  .mdy-input-wrapper select,
  .mdy-renderer select,
  .mdy-select__trigger {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-color: transparent;
    cursor: pointer;
    padding-right: 2.5rem !important;
  }
  .mdy-input-wrapper .mdy-select__arrow {
    align-items: center;
    bottom: 0;
    display: flex;
    justify-content: center;
    margin: auto 0;
    pointer-events: none;
    position: absolute;
    right: .75rem;
    top: 0;
    transition: transform .2s cubic-bezier(.4, 0, .2, 1);
    z-index: 2;
  }
  .mdy-renderer--touched .mdy-input-wrapper:has([aria-invalid=true]),
  .mdy-renderer--touched .mdy-input-wrapper:has(input[aria-invalid=true]),
  .mdy-renderer--touched .mdy-input-wrapper:has(select[aria-invalid=true]),
  .mdy-renderer--touched .mdy-multiselect__options[aria-invalid=true],
  .mdy-renderer--touched .mdy-select:has([aria-invalid=true]) {
    box-shadow: inset 0 -2px 0 0 var(--mdy-error-color);
  }
  .mdy-checkbox {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
  }
  .mdy-checkbox,
  .mdy-checkbox > span {
    align-items: center;
    display: inline-flex;
    position: relative;
  }
  .mdy-checkbox > span {
    gap: var(--mdy-checkbox-gap);
  }
  .mdy-checkbox input[type=checkbox] {
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
  }
  .mdy-checkbox input[type=checkbox] + span:before {
    background: transparent;
    border: var(--mdy-checkbox-border);
    border-radius: var(--mdy-checkbox-border-radius);
    content: "";
    display: inline-flex;
    flex-shrink: 0;
    height: var(--mdy-checkbox-size);
    transition: background var(--mdy-checkbox-transition), border-color var(--mdy-checkbox-transition);
    vertical-align: middle;
    width: var(--mdy-checkbox-size);
  }
  .mdy-checkbox input[type=checkbox] + span:after {
    border: solid var(--mdy-checkbox-checkmark-color);
    border-width: 0 2px 2px 0;
    content: "";
    height: calc(var(--mdy-checkbox-size)*var(--mdy-checkbox-tick-h));
    left: calc(var(--mdy-checkbox-size)*var(--mdy-checkbox-tick-left));
    position: absolute;
    top: 50%;
    transform: translateY(var(--mdy-checkbox-tick-offset)) rotate(45deg) scale(0);
    transition: transform var(--mdy-checkbox-transition);
    width: calc(var(--mdy-checkbox-size)*var(--mdy-checkbox-tick-w));
  }
  .mdy-checkbox input[type=checkbox]:checked + span:before {
    background: var(--mdy-checkbox-accent);
    border-color: var(--mdy-checkbox-accent);
  }
  .mdy-checkbox input[type=checkbox]:checked + span:after {
    transform: translateY(var(--mdy-checkbox-tick-offset)) rotate(45deg) scale(1);
  }
  .mdy-checkbox:has(input:not(:disabled)):hover input[type=checkbox] + span:before {
    box-shadow: 0 0 0 11px color-mix(in srgb, var(--mdy-checkbox-accent), transparent 92%);
  }
  .mdy-checkbox:has(input:checked:not(:disabled)):hover input[type=checkbox] + span:before {
    box-shadow: 0 0 0 11px color-mix(in srgb, var(--mdy-checkbox-accent), transparent 88%);
  }
  .mdy-checkbox input[type=checkbox]:focus-visible + span:before {
    outline: 2px solid var(--mdy-checkbox-accent);
    outline-offset: 2px;
  }
  .mdy-checkbox input[type=checkbox]:disabled + span:before {
    cursor: not-allowed;
    opacity: .4;
  }
  .mdy-toggle {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: var(--mdy-toggle-gap);
  }
  .mdy-toggle input[type=checkbox] {
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
  }
  .mdy-toggle__track {
    background: var(--mdy-toggle-bg);
    border: var(--mdy-toggle-border);
    border-radius: calc(var(--mdy-toggle-height)/2);
    display: inline-block;
    flex-shrink: 0;
    height: var(--mdy-toggle-height);
    position: relative;
    transition: background var(--mdy-toggle-transition), border-color var(--mdy-toggle-transition);
    width: var(--mdy-toggle-width);
  }
  .mdy-toggle__thumb {
    background: var(--mdy-toggle-thumb-color);
    border-radius: 50%;
    box-shadow: var(--mdy-shadow-depth-1);
    height: var(--mdy-toggle-thumb-size);
    left: var(--mdy-toggle-thumb-offset);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition:
      transform var(--mdy-toggle-transition),
      width var(--mdy-toggle-transition),
      height var(--mdy-toggle-transition),
      left var(--mdy-toggle-transition),
      background var(--mdy-toggle-transition);
    width: var(--mdy-toggle-thumb-size);
  }
  .mdy-toggle input:checked + .mdy-toggle__track {
    background: var(--mdy-toggle-bg-checked);
    border: var(--mdy-toggle-border-checked);
  }
  .mdy-toggle input:checked + .mdy-toggle__track .mdy-toggle__thumb {
    background: var(--mdy-toggle-thumb-color-checked);
    height: var(--mdy-toggle-thumb-size-checked);
    left: calc(var(--mdy-toggle-width) - var(--mdy-toggle-thumb-size-checked) - var(--mdy-toggle-thumb-offset));
    width: var(--mdy-toggle-thumb-size-checked);
  }
  .mdy-toggle input:focus-visible + .mdy-toggle__track {
    outline: 2px solid var(--mdy-input-focus-color);
    outline-offset: 2px;
  }
  .mdy-toggle input:disabled + .mdy-toggle__track {
    cursor: not-allowed;
    opacity: .5;
  }
  .mdy-radio-group-label {
    display: none;
  }
  .mdy-radio-group {
    display: flex;
    flex-direction: column;
    gap: .75rem;
  }
  .mdy-radio-group--horizontal {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1.5rem;
  }
  .mdy-radio-item {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    gap: .5rem;
    position: relative;
    user-select: none;
    -webkit-user-select: none;
  }
  .mdy-radio-item input[type=radio] {
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
  }
  .mdy-radio-circle {
    background: transparent;
    border: 2px solid var(--mdy-radio-unselected-color);
    border-radius: 50%;
    display: inline-flex;
    flex-shrink: 0;
    height: var(--mdy-radio-size);
    position: relative;
    transition:
      border-color .15s,
      background .15s,
      box-shadow .15s;
    width: var(--mdy-radio-size);
  }
  .mdy-radio-circle:after {
    background: var(--mdy-on-primary);
    border-radius: 50%;
    content: "";
    height: .625rem;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: transform .15s;
    width: .625rem;
  }
  .mdy-radio-item:hover .mdy-radio-circle {
    box-shadow: 0 0 0 10px color-mix(in srgb, var(--mdy-radio-unselected-color), transparent 92%);
  }
  .mdy-radio-item input[type=radio]:checked + .mdy-radio-circle {
    background: var(--mdy-radio-selected-color);
    border-color: var(--mdy-radio-selected-color);
  }
  .mdy-radio-item:has(input:checked):hover .mdy-radio-circle {
    box-shadow: 0 0 0 10px color-mix(in srgb, var(--mdy-radio-selected-color), transparent 92%);
  }
  .mdy-radio-item input[type=radio]:checked + .mdy-radio-circle:after {
    transform: translate(-50%, -50%) scale(1);
  }
  .mdy-radio-item input[type=radio]:focus-visible + .mdy-radio-circle {
    outline: 2px solid var(--mdy-radio-selected-color);
    outline-offset: 2px;
  }
  .mdy-radio-item input[type=radio]:disabled + .mdy-radio-circle {
    opacity: .4;
  }
  .mdy-control__error + .mdy-radio-group {
    margin-top: .25rem;
  }
  .mdy-slider-container {
    align-items: center;
    display: flex;
    gap: 1rem;
    width: 100%;
  }
  .mdy-slider {
    -webkit-appearance: none;
    appearance: none;
    background: var(--mdy-slider-track-color);
    border-radius: var(--mdy-corner-full);
    cursor: pointer;
    flex: 1;
    height: var(--mdy-slider-track-height);
    outline: none;
  }
  .mdy-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    background: var(--mdy-slider-thumb-color);
    border-radius: 50%;
    cursor: pointer;
    height: var(--mdy-slider-thumb-size);
    transition: transform .1s ease;
    width: var(--mdy-slider-thumb-size);
  }
  .mdy-slider::-moz-range-thumb {
    background: var(--mdy-slider-thumb-color);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    height: var(--mdy-slider-thumb-size);
    width: var(--mdy-slider-thumb-size);
  }
  .mdy-label__required {
    color: inherit;
    margin-left: .125rem;
    transition: color .2s ease;
  }
  .mdy-label--has-error .mdy-label__required {
    color: var(--mdy-error-color);
  }
  .mdy-label__required--filled {
    opacity: .7;
  }
  .mdy-slider-value {
    color: var(--mdy-on-surface-variant);
    font-size: .875rem;
    font-weight: 500;
    min-width: 2.5rem;
    text-align: right;
  }
  .mdy-file-container {
    background: var(--mdy-file-container-bg);
    border: var(--mdy-file-container-border);
    border-radius: var(--mdy-file-container-radius);
    padding: 1.5rem;
    transition: border-color .2s, background .2s;
  }
  .mdy-file-container--dragover {
    background: color-mix(in srgb, var(--mdy-input-focus-color), transparent 95%);
    border-color: var(--mdy-input-focus-color);
  }
  .mdy-file-input {
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
  }
  .mdy-file-content {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }
  .mdy-button {
    align-items: center;
    background: var(--mdy-input-focus-color);
    border: none;
    border-radius: var(--mdy-button-radius);
    color: var(--mdy-on-primary);
    cursor: pointer;
    display: inline-flex;
    font-size: .875rem;
    font-weight: 500;
    gap: .5rem;
    height: 2.5rem;
    padding: .5rem 1.5rem;
    transition: opacity .2s;
  }
  .mdy-button:hover:not(:disabled) {
    opacity: .9;
  }
  .mdy-button:disabled {
    cursor: not-allowed;
    opacity: .5;
  }
  .mdy-file-icon {
    fill: currentColor;
    height: 20px;
    width: 20px;
  }
  .mdy-file-info {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: 100%;
  }
  .mdy-file-placeholder {
    color: var(--mdy-on-surface-variant);
    font-size: .875rem;
  }
  .mdy-file-list {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
  }
  .mdy-file-item {
    align-items: center;
    color: var(--mdy-on-surface);
    display: flex;
    font-size: .875rem;
    justify-content: center;
    padding: .25rem 0;
  }
  .mdy-file-clear {
    background: transparent;
    border: none;
    color: var(--mdy-error-color);
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1;
    padding: .25rem;
  }
  .mdy-segmented-label {
    display: none;
  }
  .mdy-segmented {
    align-items: stretch;
    border: 1px solid var(--mdy-segmented-border-color);
    border-radius: var(--mdy-segmented-border-radius);
    height: var(--mdy-segmented-height);
    overflow: hidden;
    padding: 0;
    --mdy-tick-w:1.125rem;
    --mdy-tick-share:calc(var(--mdy-tick-w)/(2*var(--mdy-segments-count, 1)));
  }
  .mdy-segmented,
  .mdy-segmented__button {
    background: transparent;
    display: inline-flex;
    gap: 0;
  }
  .mdy-segmented__button {
    align-items: center;
    border: none;
    border-left: 1px solid var(--mdy-segmented-border-color);
    border-radius: 0;
    color: var(--mdy-segmented-unselected-color);
    cursor: pointer;
    flex: 1 0 auto;
    font-size: var(--mdy-segmented-font-size);
    font-weight: var(--mdy-segmented-font-weight);
    justify-content: center;
    min-width: 3rem;
    padding-left: calc(1.25rem + var(--mdy-tick-share));
    padding-right: calc(1.25rem + var(--mdy-tick-share));
    position: relative;
    transition: background .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1);
    user-select: none;
    white-space: nowrap;
  }
  .mdy-segmented:has(.mdy-segmented__button--selected) .mdy-segmented__button {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
  .mdy-segmented__button:first-child {
    border-left: none;
  }
  .mdy-segmented__button--selected {
    background: var(--mdy-segmented-selected-bg);
    color: var(--mdy-segmented-selected-color);
    font-weight: 600;
    padding-left: calc(1.25rem + var(--mdy-tick-w)) !important;
    padding-right: 1.25rem !important;
  }
  .mdy-segmented__button:hover:not(.mdy-segmented__button--selected):not(:disabled) {
    background: color-mix(in srgb, var(--mdy-on-surface), transparent 92%);
    color: var(--mdy-on-surface);
  }
  .mdy-segmented__button--selected:hover:not(:disabled) {
    background: var(--mdy-segmented-btn-bg-selected-hover);
  }
  .mdy-segmented__button:disabled {
    cursor: not-allowed;
    opacity: .38;
  }
  .mdy-segmented__text {
    align-items: center;
    display: inline-flex;
    flex-direction: column;
  }
  .mdy-segmented__text:after {
    content: attr(data-text);
    font-weight: 600;
    height: 0;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    visibility: hidden;
  }
  .mdy-segmented__check {
    animation: mdy-segmented-check-pop .25s cubic-bezier(.175, .885, .32, 1.275);
    flex-shrink: 0;
    height: 1rem;
    left: 1.125rem;
    position: absolute;
    width: 1rem;
  }
  @keyframes mdy-segmented-check-pop {
    0% {
      opacity: 0;
      transform: scale(.5);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }
  .mdy-multiselect__header {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: end;
  }
  .mdy-multiselect__label {
    font-size: var(--mdy-label-font-size);
    font-weight: var(--mdy-label-font-weight);
  }
  .mdy-multiselect__search-btn {
    align-items: center;
    background: transparent;
    border: none;
    border-radius: 50%;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    height: 1.5rem;
    justify-content: center;
    padding: 0;
    transition: background .15s;
    width: 1.5rem;
  }
  .mdy-multiselect__search-btn:hover:not(:disabled) {
    background: var(--mdy-surface-container);
  }
  .mdy-multiselect__search-btn:disabled {
    cursor: not-allowed;
    opacity: .4;
  }
  .mdy-multiselect__search-btn svg {
    fill: none;
    height: 1rem;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-width: 2;
    width: 1rem;
  }
  .mdy-multiselect__options {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mdy-chip-gap);
    max-height: var(--mdy-multiselect-max-height);
    overflow-y: auto;
    padding: var(--mdy-multiselect-padding);
  }
  .mdy-chip {
    align-items: center;
    background: var(--mdy-chip-bg);
    border: var(--mdy-chip-border);
    border-radius: var(--mdy-chip-border-radius);
    color: var(--mdy-chip-color);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: var(--mdy-chip-font-size);
    gap: 0;
    height: var(--mdy-chip-height);
    justify-content: center;
    line-height: var(--mdy-input-line-height);
    max-width: var(--mdy-chip-max-width);
    padding: var(--mdy-chip-padding);
    position: relative;
    transition:
      background .15s,
      color .15s,
      border-color .15s,
      box-shadow .15s;
    user-select: none;
    white-space: nowrap;
  }
  .mdy-chip--centered {
    --mdy-chip-w:0.65rem;
  }
  .mdy-chip--centered:after,
  .mdy-chip--centered:before {
    content: "";
    flex-shrink: 0;
    transition: width var(--mdy-chip-transition);
    width: var(--mdy-chip-w);
  }
  .mdy-chip--centered.mdy-chip--selected:before {
    width: calc(var(--mdy-chip-w)*2);
  }
  .mdy-chip--centered.mdy-chip--selected:after {
    width: 0;
  }
  button.mdy-chip:hover:not(.mdy-chip--selected):not(:disabled) {
    background: var(--mdy-chip-hover-bg);
    border-color: var(--mdy-chip-hover-border);
    color: var(--mdy-chip-hover-color);
  }
  .mdy-chip__check {
    fill: none;
    flex-shrink: 0;
    height: 1em;
    left: .75rem;
    opacity: 0;
    position: absolute;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
    transform: scale(.5);
    transition:
      opacity var(--mdy-chip-transition),
      transform var(--mdy-chip-transition),
      visibility var(--mdy-chip-transition);
    visibility: hidden;
    width: 1em;
  }
  .mdy-chip--selected .mdy-chip__check {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
  }
  .mdy-chip__label {
    overflow: hidden;
    text-overflow: ellipsis;
    transition: transform var(--mdy-chip-transition);
    white-space: nowrap;
  }
  .mdy-chip--centered.mdy-chip--selected .mdy-chip__label {
    transform: none;
  }
  .mdy-chip--selected {
    background: var(--mdy-chip-selected-bg);
    border: var(--mdy-chip-selected-border);
    color: var(--mdy-chip-selected-color);
  }
  .mdy-chip:focus-visible {
    outline: 2px solid var(--mdy-chip-selected-bg);
    outline-offset: 2px;
  }
  .mdy-chip:disabled {
    cursor: not-allowed;
    opacity: .4;
  }
  .mdy-chip--counter {
    cursor: default;
    gap: 0;
    overflow: hidden;
    padding: 0;
  }
  .mdy-chip--counter .mdy-chip__label {
    padding: 0 .25rem;
  }
  .mdy-chip__btn {
    align-items: center;
    background: transparent;
    border: none;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    height: 100%;
    justify-content: center;
    padding: 0;
    transition: background .15s;
    width: var(--mdy-chip-height);
  }
  .mdy-chip__btn:hover:not(:disabled) {
    background: hsla(0, 0%, 100%, .2);
  }
  .mdy-chip__btn:disabled {
    cursor: not-allowed;
  }
  .mdy-chip__btn svg {
    fill: none;
    height: .75rem;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-width: 2;
    width: .75rem;
  }
  .mdy-chip__count {
    font-size: .6875rem;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    min-width: 3ch;
    opacity: .85;
    text-align: center;
  }
  .mdy-renderer--multiselect {
    position: relative;
  }
  .mdy-multiselect__label {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
  .mdy-multiselect-overlay {
    background: transparent;
    inset: 0;
    position: fixed;
    z-index: 999;
  }
  .mdy-multiselect-overlay__panel {
    background: var(--mdy-multiselect-overlay-bg);
    border: var(--mdy-select-dropdown-border);
    border-radius: var(--mdy-select-dropdown-border-radius);
    box-shadow: var(--mdy-select-dropdown-shadow);
    display: flex;
    flex-direction: column;
    gap: 0;
    left: 0;
    max-height: var(--mdy-overlay-max-height,50vh);
    overflow: hidden;
    padding: 0;
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 1000;
  }
  .mdy-renderer--open .mdy-multiselect-overlay__panel:not(.mdy-multiselect-overlay__panel--overlay) {
    bottom: var(--mdy-overlay-bottom,auto);
    left: var(--mdy-overlay-left,auto);
    margin: 0;
    position: fixed;
    right: var(--mdy-overlay-right,auto);
    top: var(--mdy-overlay-top,auto);
    width: var(--mdy-overlay-width,auto);
  }
  .mdy-multiselect-overlay__panel--above {
    flex-direction: column-reverse;
  }
  .mdy-multiselect-overlay__panel--overlay {
    left: 50%;
    margin: 0;
    max-height: 70vh;
    position: fixed;
    right: auto;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(24rem, 90vw);
    z-index: 1000;
  }
  .mdy-multiselect-overlay__input {
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--mdy-select-border-subtle);
    border-radius: 0;
    box-sizing: border-box;
    color: var(--mdy-input-color);
    flex-shrink: 0;
    font-family: inherit;
    font-size: var(--mdy-input-font-size);
    outline: none;
    padding: .5rem .75rem;
    width: 100%;
  }
  .mdy-multiselect-overlay__input::placeholder {
    color: var(--mdy-input-placeholder-color);
  }
  .mdy-multiselect-overlay__panel--above .mdy-multiselect-overlay__input {
    border-bottom: none;
    border-top: 1px solid var(--mdy-select-border-subtle);
  }
  .mdy-multiselect-overlay__input:focus {
    border-color: var(--mdy-input-focus-color);
  }
  .mdy-multiselect-overlay__grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mdy-chip-gap);
    max-height: 100%;
    overflow-y: auto;
    padding: var(--mdy-multiselect-padding);
    scrollbar-width: thin;
  }
  .mdy-multiselect-overlay__empty {
    box-sizing: border-box;
    color: var(--mdy-select-no-results-color);
    font-style: italic;
    padding: var(--mdy-select-option-padding);
    width: 100%;
  }
  .mdy-control__errors {
    list-style: none;
    margin: 0;
    padding: 0 1rem;
    padding-top: var(--mdy-helper-padding-top);
  }
  .mdy-control__error {
    color: var(--mdy-error-color);
    font-size: var(--mdy-error-font-size);
    line-height: var(--mdy-error-line-height);
  }
  .mdy-select {
    position: relative;
  }
  .mdy-select__trigger {
    align-items: center;
    background: transparent;
    border: none;
    color: var(--mdy-input-color);
    cursor: pointer;
    display: flex;
    font-size: var(--mdy-input-font-size);
    justify-content: space-between;
    line-height: var(--mdy-input-line-height);
    outline: none;
    padding: var(--mdy-input-padding);
    text-align: left;
    width: 100%;
  }
  .mdy-select__trigger:focus {
    outline: none;
  }
  .mdy-renderer--touched .mdy-input-wrapper:has(.mdy-select__trigger[aria-invalid=true]) {
    box-shadow: inset 0 -2px 0 0 var(--mdy-error-color);
  }
  .mdy-select__trigger:disabled {
    cursor: not-allowed;
    opacity: .6;
  }
  .mdy-select__value {
    align-items: center;
    display: flex;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mdy-select__placeholder {
    color: var(--mdy-select-placeholder-color);
    flex: 1;
  }
  .mdy-select__arrow {
    align-items: center;
    color: var(--mdy-select-arrow-color);
    display: flex;
    flex-shrink: 0;
    height: 1rem;
    justify-content: center;
    margin-left: .5rem;
    transition: transform .2s;
    width: 1rem;
  }
  .mdy-select__arrow svg {
    display: block;
    height: 100%;
    width: 100%;
  }
  .mdy-select__dropdown {
    background: var(--mdy-select-dropdown-bg);
    border: var(--mdy-select-dropdown-border);
    border-radius: var(--mdy-select-dropdown-border-radius);
    box-shadow: var(--mdy-select-dropdown-shadow);
    left: 0;
    margin: .25rem 0 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 1000;
  }
  .mdy-renderer--open .mdy-select__dropdown:not(.mdy-select__dropdown--overlay) {
    bottom: var(--mdy-overlay-bottom,auto);
    left: var(--mdy-overlay-left,auto);
    margin: 0;
    position: fixed;
    right: var(--mdy-overlay-right,auto);
    top: var(--mdy-overlay-top,auto);
    width: var(--mdy-overlay-width,auto);
  }
  .mdy-select__overlay-backdrop {
    background: var(--mdy-overlay-backdrop-bg);
    inset: 0;
    position: fixed;
    transition: opacity .2s cubic-bezier(.4, 0, .2, 1);
    z-index: 999;
  }
  .mdy-select__dropdown--overlay {
    display: flex;
    flex-direction: column;
    left: 50%;
    margin: 0;
    max-height: min(70vh, 24rem);
    position: fixed;
    right: auto;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(24rem, 90vw);
    z-index: 1000;
  }
  .mdy-select__search {
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--mdy-select-border-subtle);
    box-sizing: border-box;
    color: var(--mdy-input-color);
    display: block;
    font-family: inherit;
    font-size: var(--mdy-input-font-size);
    line-height: var(--mdy-input-line-height);
    outline: none;
    padding: .5rem .75rem;
    width: 100%;
  }
  .mdy-select__search::placeholder {
    color: var(--mdy-input-placeholder-color);
  }
  .mdy-select__list {
    list-style: none;
    margin: 0;
    max-height: var(--mdy-select-dropdown-max-height);
    overflow-y: auto;
    padding: .25rem 0;
    scrollbar-width: thin;
  }
  .mdy-select__no-results {
    color: var(--mdy-select-no-results-color);
    font-style: italic;
    padding: var(--mdy-select-option-padding);
  }
  .mdy-select__option {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: var(--mdy-input-font-size);
    line-height: var(--mdy-input-line-height);
    padding: var(--mdy-select-option-padding);
    transition: background .1s;
  }
  .mdy-select__option--active {
    background: var(--mdy-select-option-hover-bg);
    color: var(--mdy-select-option-hover-color);
  }
  .mdy-select__option--selected {
    background: var(--mdy-select-option-selected-bg);
    color: var(--mdy-select-option-selected-color);
    font-weight: var(--mdy-select-option-selected-weight);
  }
  .mdy-control__inline-errors {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    margin-left: .25rem;
    position: relative;
    vertical-align: middle;
  }
  .mdy-control__inline-errors-icon {
    fill: var(--mdy-error-color);
    flex-shrink: 0;
    height: 1em;
    width: 1em;
  }
  .mdy-control__inline-errors-tooltip {
    background: var(--mdy-error-color);
    border-radius: var(--mdy-tooltip-border-radius);
    bottom: calc(100% + .5rem);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);
    color: var(--mdy-on-error);
    font-size: var(--mdy-error-font-size);
    font-weight: 500;
    left: 50%;
    line-height: 1.2;
    opacity: 0;
    padding: .375rem .625rem;
    pointer-events: none;
    position: absolute;
    transform: translateX(-50%) scale(.95);
    transition:
      opacity .1s ease-out,
      transform .1s ease-out,
      visibility .1s;
    visibility: hidden;
    white-space: nowrap;
    z-index: 1000;
  }
  .mdy-control__inline-errors-tooltip:before {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid var(--mdy-error-color);
    bottom: -4px;
    content: "";
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
  }
  .mdy-control__inline-errors:focus .mdy-control__inline-errors-tooltip,
  .mdy-control__inline-errors:focus-within .mdy-control__inline-errors-tooltip,
  .mdy-control__inline-errors:hover .mdy-control__inline-errors-tooltip {
    opacity: 1;
    transform: translateX(-50%) scale(1);
    visibility: visible;
  }
  .mdy-datepicker {
    position: relative;
  }
  .mdy-datepicker__input-group {
    align-items: stretch;
    background: var(--mdy-comp-date-picker-popup-bg);
    border: none;
    border-radius: var(--mdy-comp-date-picker-popup-radius);
    display: flex;
    padding: 0;
    position: relative;
  }
  .mdy-datepicker__input-group input {
    flex: 1;
  }
  .mdy-datepicker__input-group:after {
    background: var(--mdy-sys-color-outline);
    border-radius: 0 0 var(--mdy-comp-date-picker-popup-radius) var(--mdy-comp-date-picker-popup-radius);
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    z-index: 2;
  }
  .mdy-datepicker__input-group:focus-within:after {
    background: var(--mdy-sys-color-primary);
    height: 3px;
  }
  .mdy-datepicker__input-group:hover:after {
    background: var(--mdy-sys-color-outline-variant);
  }
  .mdy-datepicker__input {
    background: transparent;
    border: none;
    border-radius: 0;
    color: var(--mdy-comp-date-picker-input-color);
    flex: 1 1 0%;
    font-family: var(--mdy-comp-date-picker-input-font-family);
    font-size: var(--mdy-comp-date-picker-input-font-size);
    max-width: 100%;
    min-width: 10.5rem;
    outline: none;
    padding: var(--mdy-comp-date-picker-input-padding);
    transition: border-color .15s, box-shadow .15s;
  }
  .mdy-datepicker__input:focus {
    border-color: var(--mdy-sys-color-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--mdy-sys-color-primary), #fff 60%);
    z-index: 1;
  }
  .mdy-renderer--touched .mdy-datepicker__input[aria-invalid=true] {
    border-color: var(--mdy-sys-color-error);
  }
  .mdy-datepicker__input::placeholder {
    color: var(--mdy-sys-color-on-surface-variant);
  }
  .mdy-datepicker__toggle {
    align-items: center;
    background: none;
    border: none;
    border-radius: 50%;
    color: var(--mdy-sys-color-on-surface-variant);
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    line-height: 0;
    padding: 0;
    transition: background-color .2s, color .2s;
    width: 32px;
  }
  .mdy-datepicker__toggle svg {
    display: block;
    height: 24px;
    width: 24px;
  }
  .mdy-datepicker__toggle:hover:not(:disabled),
  .mdy-timepicker__toggle:hover:not(:disabled) {
    background-color: var(--mdy-sys-color-surface-container-highest);
  }
  .mdy-datepicker__input {
    padding-right: 40px !important;
  }
  .mdy-datepicker__toggle:disabled {
    cursor: not-allowed;
    opacity: .4;
  }
  .mdy-datepicker .mdy-input-suffix,
  .mdy-timepicker .mdy-input-suffix {
    padding: 0;
    position: relative;
    width: 40px;
  }
  .mdy-timepicker__popup {
    background: transparent;
    border: none;
    margin: 0;
    max-height: 95vh;
    max-width: 95vw;
    overflow: visible;
    padding: 0;
  }
  .mdy-datepicker__icon {
    fill: currentColor;
    height: 1.5rem;
    width: 1.5rem;
  }
  .mdy-datepicker__popup {
    background: var(--mdy-comp-date-picker-popup-bg);
    border: none;
    border-radius: var(--mdy-comp-date-picker-popup-radius);
    box-shadow: var(--mdy-comp-date-picker-popup-shadow);
    box-sizing: border-box;
    left: 0;
    margin-top: .25rem;
    max-height: 90vh;
    max-width: 95vw;
    overflow-y: auto;
    padding: var(--mdy-comp-date-picker-popup-padding);
    position: absolute;
    top: 100%;
    z-index: 1000;
  }
  .mdy-renderer--open .mdy-datepicker__popup:not(.mdy-datepicker__popup--overlay):not(.mdy-datepicker__popup--modal),
  .mdy-renderer--open .mdy-timepicker__popup:not(.mdy-timepicker__popup--overlay):not(.mdy-timepicker__popup--modal) {
    bottom: var(--mdy-overlay-bottom,auto);
    left: var(--mdy-overlay-left,auto);
    margin: 0;
    position: fixed;
    right: var(--mdy-overlay-right,auto);
    top: var(--mdy-overlay-top,auto);
    width: auto;
  }
  .mdy-datepicker__backdrop,
  .mdy-timepicker__backdrop {
    background: var(--mdy-overlay-backdrop-bg,rgba(0,0,0,.4));
    inset: 0;
    position: fixed;
    transition: opacity .2s cubic-bezier(.4, 0, .2, 1);
    z-index: 999;
  }
  .mdy-datepicker__popup--modal,
  .mdy-datepicker__popup--overlay,
  .mdy-timepicker__popup--modal,
  .mdy-timepicker__popup--overlay {
    left: 50%;
    margin: 0;
    position: fixed;
    right: auto;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
  }
  .mdy-timepicker-container {
    --tp-primary:var(--mdy-tp-primary,var(--mdy-primary));
    --tp-on-primary:var(--mdy-tp-on-primary,var(--mdy-on-primary));
    --tp-primary-container:var(--mdy-tp-primary-container,var(--mdy-primary-container));
    --tp-on-primary-container:var(--mdy-tp-on-primary-container,var(--mdy-on-primary-container));
    --tp-surface:var(--mdy-tp-surface,var(--mdy-surface));
    --tp-surface-variant:var(--mdy-tp-surface-variant,var(--mdy-surface-container));
    --tp-outline:var(--mdy-tp-outline,var(--mdy-outline-variant));
    --tp-border-radius:var(--mdy-tp-border-radius,var(--mdy-datepicker-popup-border-radius,var(--mdy-input-border-radius)));
    --tp-font-family:var(--mdy-font-family,"Roboto",sans-serif);
    --tp-font-weight:var(--mdy-tp-font-weight,400);
    --tp-period-font-weight:var(--mdy-tp-period-font-weight,500);
    --tp-dial-size:var(--mdy-comp-time-picker-clock-dial-size,256px);
    --tp-num-size:40px;
    --tp-hand-length:calc(var(--tp-dial-size)/2 - var(--tp-num-size)/2 - 8px);
    --tp-seg-width:var(--mdy-comp-time-picker-input-segment-width,96px);
    --tp-seg-height:var(--mdy-comp-time-picker-input-segment-height,80px);
    background-color: var(--mdy-comp-time-picker-container-color,var(--tp-surface));
    border: none;
    border-radius: var(--mdy-comp-time-picker-container-shape,var(--tp-border-radius));
    box-shadow: var(--mdy-datepicker-popup-shadow,var(--mdy-select-dropdown-shadow,0 4px 12px rgba(0,0,0,.12)));
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    font-family: var(--tp-font-family);
    gap: 16px;
    max-height: 95vh;
    max-width: 95vw;
    overflow-y: auto;
    padding: 24px;
    width: fit-content;
  }
  .mdy-timepicker-content {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
  .mdy-timepicker-header {
    align-items: flex-start;
    display: flex;
    gap: 12px;
  }
  .mdy-timepicker-fields {
    align-items: center;
    display: flex;
    gap: 8px;
  }
  .mdy-timepicker-segment {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .mdy-timepicker-segment-input {
    align-items: center;
    background-color: var(--mdy-comp-time-picker-input-container-color,var(--tp-surface-variant)) !important;
    border: 1.5px solid transparent !important;
    border-radius: var(--mdy-comp-time-picker-input-container-shape,var(--tp-border-radius)) !important;
    box-shadow: none !important;
    color: var(--tp-on-primary-container) !important;
    cursor: text;
    display: flex;
    font-family: inherit;
    font-size: 45px !important;
    font-weight: var(--tp-font-weight) !important;
    height: var(--tp-seg-height) !important;
    justify-content: center;
    outline: none !important;
    padding: 0 !important;
    text-align: center !important;
    transition:
      background-color .15s,
      border-color .15s,
      color .15s;
    width: var(--tp-seg-width) !important;
  }
  .mdy-timepicker-segment-input--readonly {
    cursor: pointer !important;
  }
  .mdy-timepicker-segment-input::-webkit-inner-spin-button,
  .mdy-timepicker-segment-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .mdy-timepicker-segment-input:hover:not(:disabled) {
    background-color: color-mix(in srgb, var(--mdy-comp-time-picker-input-container-color,var(--tp-surface-variant)), var(--mdy-on-surface,#000) 8%) !important;
  }
  .mdy-timepicker-segment--active .mdy-timepicker-segment-input {
    background-color: var(--tp-primary) !important;
    border-color: var(--tp-primary) !important;
    color: var(--tp-on-primary) !important;
  }
  .mdy-timepicker-segment-label {
    color: var(--tp-outline);
    font-size: .75rem;
    letter-spacing: .05em;
    margin-left: 4px;
    text-transform: uppercase;
  }
  .mdy-timepicker-separator {
    align-items: center;
    align-self: flex-start;
    color: var(--tp-on-primary-container);
    display: flex;
    font-size: 45px;
    font-weight: var(--tp-font-weight);
    height: var(--tp-seg-height);
  }
  .mdy-timepicker-period-toggle {
    border: 1.5px solid var(--mdy-comp-time-picker-period-outline-color,var(--tp-outline));
    border-radius: var(--mdy-comp-time-picker-input-container-shape,var(--tp-border-radius));
    display: flex;
    flex-direction: column;
    height: var(--tp-seg-height);
    overflow: hidden;
  }
  .mdy-timepicker-period-toggle--compact {
    align-self: center;
    height: auto;
    margin-left: 8px;
  }
  .mdy-timepicker-period-btn {
    background: transparent;
    border: none;
    color: var(--mdy-on-surface-variant,#3f3f46);
    cursor: pointer;
    flex: 1;
    font-family: inherit;
    font-size: .875rem;
    font-weight: var(--tp-period-font-weight);
    padding: 0;
    transition: background-color .15s, color .15s;
    width: 52px;
  }
  .mdy-timepicker-period-btn:first-child {
    border-bottom: 1.5px solid var(--mdy-comp-time-picker-period-outline-color,var(--tp-outline));
  }
  .mdy-timepicker-period-btn--selected {
    background-color: var(--tp-primary);
    color: var(--tp-on-primary);
    font-weight: 600;
  }
  .mdy-timepicker-period-btn:hover:not(:disabled):not(.mdy-timepicker-period-btn--selected) {
    background-color: var(--mdy-datepicker-hover-bg,rgba(0,0,0,.06));
  }
  .mdy-timepicker-period-btn:disabled {
    cursor: default;
    opacity: .4;
  }
  .mdy-timepicker-dial {
    align-items: center;
    background-color: var(--mdy-comp-time-picker-clock-dial-container-color,var(--tp-surface-variant));
    border-radius: 50%;
    display: flex;
    height: var(--tp-dial-size);
    justify-content: center;
    position: relative;
    touch-action: none;
    user-select: none;
    width: var(--tp-dial-size);
  }
  .mdy-timepicker-dial__face {
    height: 100%;
    position: relative;
    width: 100%;
  }
  .mdy-timepicker-dial__number {
    align-items: center;
    aspect-ratio: 1;
    color: var(--tp-on-primary-container);
    display: flex;
    font-size: .9rem;
    font-weight: 500;
    height: var(--tp-num-size);
    justify-content: center;
    left: 50%;
    line-height: 1;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%) rotate(calc(var(--index)*30deg)) translateY(calc(var(--tp-hand-length)*-1)) rotate(calc(var(--index)*-30deg));
    transition: color .12s;
    width: var(--tp-num-size);
    z-index: 10;
  }
  .mdy-timepicker-dial__number--selected {
    color: var(--tp-on-primary);
  }
  .mdy-timepicker-dial__hand {
    background-color: var(--tp-primary);
    bottom: 50%;
    height: var(--tp-hand-length);
    left: calc(50% - 1px);
    position: absolute;
    transform-origin: bottom center;
    width: 2px;
  }
  .mdy-timepicker-dial__hand:after {
    aspect-ratio: 1;
    height: var(--tp-num-size);
    left: calc(var(--tp-num-size)/-2 + 1px);
    top: calc(var(--tp-num-size)/-2);
    width: var(--tp-num-size);
    z-index: 2;
  }
  .mdy-timepicker-dial__hand:after,
  .mdy-timepicker-dial__hand:before {
    background-color: var(--tp-primary);
    border-radius: 50%;
    content: "";
    position: absolute;
  }
  .mdy-timepicker-dial__hand:before {
    bottom: -4px;
    height: 8px;
    left: -3px;
    width: 8px;
  }
  .mdy-timepicker-actions {
    align-items: center;
    display: flex;
    gap: 4px;
    width: 100%;
  }
  .mdy-timepicker-spacer {
    flex: 1;
  }
  .mdy-timepicker-mode-toggle {
    align-items: center;
    background: none;
    border: none;
    border-radius: 50%;
    color: var(--mdy-on-surface-variant,#3f3f46);
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 6px;
    transition: background-color .15s;
    width: 32px;
  }
  .mdy-timepicker-mode-toggle:hover {
    background-color: var(--mdy-datepicker-hover-bg,rgba(0,0,0,.06));
  }
  .mdy-timepicker-mode-toggle svg {
    display: block;
  }
  .mdy-timepicker-action-btn {
    background: none;
    border: none;
    border-radius: var(--tp-border-radius);
    color: var(--tp-primary);
    cursor: pointer;
    font-family: inherit;
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: .04em;
    padding: 6px 12px;
    transition: background-color .15s;
  }
  .mdy-timepicker-action-btn:hover {
    background-color: var(--mdy-datepicker-hover-bg,rgba(0,0,0,.06));
  }
  .mdy-timepicker-action-btn--confirm {
    font-weight: 700;
  }
  .mdy-datepicker__calendar {
    display: flex;
    flex-direction: column;
    outline: none;
  }
  .mdy-datepicker__header {
    align-items: center;
    color: var(--mdy-comp-date-picker-header-color);
    display: flex;
    font-size: var(--mdy-comp-date-picker-header-font-size);
    font-weight: var(--mdy-comp-date-picker-header-font-weight);
    gap: var(--mdy-comp-date-picker-header-gap);
    justify-content: space-between;
    padding: var(--mdy-comp-date-picker-header-padding);
  }
  .mdy-datepicker__nav-btn {
    align-items: center;
    background: transparent;
    border: none;
    border-radius: var(--mdy-comp-date-picker-nav-btn-radius);
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    height: var(--mdy-comp-date-picker-nav-btn-size);
    justify-content: center;
    padding: 0;
    transition: background .15s;
    width: var(--mdy-comp-date-picker-nav-btn-size);
  }
  .mdy-datepicker__nav-btn:hover {
    background: var(--mdy-comp-date-picker-nav-btn-hover-bg);
  }
  .mdy-datepicker__header-label,
  .mdy-datepicker__header-nav {
    align-items: center;
    display: flex;
  }
  .mdy-datepicker__header-nav {
    gap: .25rem;
  }
  .mdy-datepicker__view-toggle {
    align-items: center;
    background: transparent;
    border: none;
    border-radius: 100px;
    color: var(--mdy-sys-color-on-surface);
    cursor: pointer;
    display: flex;
    font-family: inherit;
    font-size: var(--mdy-comp-date-picker-title-font-size);
    font-weight: var(--mdy-comp-date-picker-title-font-weight);
    gap: .5rem;
    padding: .25rem .75rem;
    transition: background .1s;
  }
  .mdy-datepicker__view-toggle:hover {
    background: var(--mdy-comp-date-picker-cell-hover-bg);
  }
  .mdy-datepicker__view-icon {
    display: block;
    height: 1.125rem;
    opacity: .7;
    width: 1.125rem;
  }
  .mdy-datepicker__title {
    color: var(--mdy-comp-date-picker-title-color);
    font-size: var(--mdy-comp-date-picker-title-font-size);
    font-weight: var(--mdy-comp-date-picker-title-font-weight);
    user-select: none;
  }
  .mdy-datepicker__nav-btn svg {
    fill: none;
    height: 1.25rem;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    width: 1.25rem;
  }
  .mdy-datepicker__grid {
    display: flex;
    flex-direction: column;
  }
  .mdy-datepicker__weekdays {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(7, var(--mdy-datepicker-cell-size));
  }
  .mdy-datepicker__weekday {
    align-items: center;
    color: var(--mdy-comp-date-picker-weekday-color);
    display: flex;
    font-size: var(--mdy-comp-date-picker-weekday-font-size);
    font-weight: var(--mdy-comp-date-picker-weekday-font-weight);
    height: var(--mdy-comp-date-picker-cell-size);
    justify-content: center;
    user-select: none;
  }
  .mdy-datepicker__row {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(7, var(--mdy-datepicker-cell-size));
  }
  .mdy-datepicker__cell {
    align-items: center;
    border: none;
    border-radius: var(--mdy-comp-date-picker-cell-border-radius);
    box-shadow: none;
    color: var(--mdy-comp-date-picker-cell-color);
    cursor: pointer;
    display: flex;
    font-family: var(--mdy-comp-date-picker-cell-font-family);
    font-size: var(--mdy-comp-date-picker-cell-font-size);
    font-weight: var(--mdy-comp-date-picker-cell-font-weight);
    height: var(--mdy-comp-date-picker-cell-size);
    justify-content: center;
    outline: none;
    transition: background .1s, color .1s;
    user-select: none;
    width: var(--mdy-comp-date-picker-cell-size);
  }
  .mdy-datepicker__cell:hover:not(.mdy-datepicker__cell--disabled):not(.mdy-datepicker__cell--selected) {
    background: var(--mdy-comp-date-picker-cell-hover-bg);
  }
  .mdy-datepicker__cell--outside {
    opacity: var(--mdy-comp-date-picker-cell-outside-opacity);
  }
  .mdy-datepicker__cell--today:not(.mdy-datepicker__cell--selected) {
    box-shadow: none;
    outline: var(--mdy-comp-date-picker-cell-today-outline);
    outline-offset: -2px;
  }
  .mdy-datepicker__cell--selected {
    background: var(--mdy-comp-date-picker-cell-selected-bg);
    border: none;
    border-radius: var(--mdy-comp-date-picker-cell-border-radius);
    box-shadow: none;
    color: var(--mdy-comp-date-picker-cell-selected-color);
    font-weight: 600;
    outline: none;
  }
  .mdy-datepicker__cell--focused:not(.mdy-datepicker__cell--selected) {
    background: var(--mdy-comp-date-picker-cell-hover-bg);
    outline: var(--mdy-comp-date-picker-cell-focus-outline);
    outline-offset: -2px;
  }
  .mdy-datepicker__cell--disabled {
    cursor: not-allowed;
    opacity: var(--mdy-comp-date-picker-cell-disabled-opacity);
  }
  .mdy-datepicker__cell--in-range {
    background: var(--mdy-comp-date-picker-in-range-bg);
    border: none;
    border-radius: 0;
    box-shadow: none;
    outline: none;
  }
  .mdy-datepicker__cell--today.mdy-datepicker__cell--in-range {
    outline: var(--mdy-comp-date-picker-cell-today-outline);
    outline-offset: -2px;
  }
  .mdy-datepicker__cell--range-end,
  .mdy-datepicker__cell--range-start {
    background: var(--mdy-comp-date-picker-endpoint-bg);
    border: none;
    border-radius: var(--mdy-comp-date-picker-cell-border-radius);
    box-shadow: none;
    color: var(--mdy-comp-date-picker-endpoint-color);
    font-weight: 600;
    outline: var(--mdy-comp-date-picker-cell-focus-outline);
    outline-offset: -2px;
    position: relative;
    z-index: 1;
  }
  .mdy-datepicker__cell--range-end:before,
  .mdy-datepicker__cell--range-start:before {
    display: none;
  }
  .mdy-datepicker__cell--range-start:not(.mdy-datepicker__cell--range-end) {
    background: linear-gradient(to right, var(--mdy-daterange-in-range-bg) 50%);
    border-radius: 50% 0 0 50%;
  }
  .mdy-datepicker__cell--range-end:not(.mdy-datepicker__cell--range-start) {
    background: linear-gradient(to left, var(--mdy-daterange-in-range-bg) 50%);
    border-radius: 0 50% 50% 0;
  }
  .mdy-datepicker__cell--range-start.mdy-datepicker__cell--range-end {
    background: var(--mdy-daterange-endpoint-bg);
    border-radius: 50%;
  }
  .mdy-daterange__hint {
    color: var(--mdy-on-surface-variant);
    font-size: .75rem;
    padding-top: 0;
    text-align: center;
    user-select: none;
  }
  .mdy-daterange__group {
    align-items: stretch;
    display: flex;
    transition: border-color .15s, box-shadow .15s;
  }
  .mdy-daterange__group:focus-within {
    border-color: var(--mdy-input-focus-color);
    box-shadow: var(--mdy-input-focus-shadow);
    z-index: 1;
  }
  .mdy-daterange__input-sizer {
    align-items: center;
    display: inline-grid;
    min-width: var(--mdy-daterange-input-min-width);
  }
  .mdy-daterange__input-sizer:after {
    content: attr(data-value) "\a0";
    font-size: var(--mdy-input-font-size);
    font-variant-numeric: tabular-nums;
    grid-area: 1/1;
    padding: var(--mdy-daterange-input-padding);
    pointer-events: none;
    visibility: hidden;
    white-space: pre;
  }
  .mdy-input-wrapper.mdy-daterange__group .mdy-daterange__input {
    font-size: var(--mdy-input-font-size);
    font-variant-numeric: tabular-nums;
    grid-area: 1/1;
    min-width: 0 !important;
    padding: var(--mdy-daterange-input-padding) !important;
    text-align: center;
    width: 100% !important;
  }
  .mdy-daterange__group .mdy-daterange__input:focus {
    border-color: inherit;
    box-shadow: none;
    outline: none;
    z-index: auto;
  }
  .mdy-daterange__group .mdy-daterange__input:first-of-type {
    border-radius: var(--mdy-input-border-radius) 0 0 var(--mdy-input-border-radius);
    border-right: none;
    box-shadow: none;
    outline: none;
  }
  .mdy-daterange__group .mdy-daterange__input:nth-of-type(2) {
    border-left: none;
    border-radius: 0;
    border-right: none;
    box-shadow: none;
    outline: none;
  }
  .mdy-input-wrapper.mdy-daterange__group .mdy-input-suffix {
    margin-left: auto !important;
  }
  .mdy-input-wrapper.mdy-daterange__group .mdy-datepicker__toggle {
    flex-shrink: 0;
  }
  .mdy-daterange__sep {
    align-items: center;
    border: none;
    color: var(--mdy-on-surface-variant);
    display: flex;
    font-size: var(--mdy-datepicker-cell-font-size,.875rem);
    padding: var(--mdy-daterange-sep-padding);
    user-select: none;
  }
  .mdy-datepicker__input-group {
    box-shadow: none !important;
    outline: none !important;
  }
  .mdy-datepicker__month-picker,
  .mdy-datepicker__year-picker {
    display: grid;
    gap: .5rem;
    grid-template-columns: repeat(3, 1fr);
    padding: var(--mdy-comp-date-picker-popup-padding);
  }
  .mdy-datepicker__year-picker {
    max-height: 280px;
    overflow-y: auto;
    scrollbar-width: thin;
  }
  .mdy-datepicker__month-cell,
  .mdy-datepicker__year-cell {
    align-items: center;
    background: transparent;
    border: none;
    border-radius: var(--mdy-corner-medium);
    color: var(--mdy-on-surface);
    cursor: pointer;
    display: flex;
    font-family: inherit;
    font-size: var(--mdy-datepicker-cell-font-size,.875rem);
    justify-content: center;
    min-height: 2.75rem;
    outline: none;
    padding: .5rem .75rem;
    transition: background .1s, color .1s;
  }
  .mdy-datepicker__month-cell:hover,
  .mdy-datepicker__year-cell:hover {
    background: var(--mdy-surface-container-highest-hover);
    color: var(--mdy-on-surface);
  }
  .mdy-datepicker__month-cell:focus-visible,
  .mdy-datepicker__year-cell:focus-visible {
    background: var(--mdy-surface-container-highest-hover);
    outline: 2px solid var(--mdy-primary);
    outline-offset: -2px;
  }
  .mdy-datepicker__month-cell--selected,
  .mdy-datepicker__year-cell--selected {
    background: var(--mdy-primary) !important;
    color: var(--mdy-on-primary) !important;
    font-weight: 600;
  }
  .mdy-datepicker__month-cell:disabled,
  .mdy-datepicker__year-cell:disabled {
    background: transparent !important;
    cursor: not-allowed;
    opacity: var(--mdy-datepicker-disabled-opacity,.25);
  }
}
@layer mdy.themes {
  :root {
    --mdy-comp-filled-text-field-container-height:2.25rem;
    --mdy-comp-filled-text-field-container-shape:var(--mdy-sys-shape-corner-small);
    --mdy-comp-filled-text-field-container-color:var(--mdy-sys-color-surface-container-lowest);
    --mdy-comp-date-picker-cell-size:2rem;
    --mdy-comp-date-picker-grid-gap:0.125rem;
    --mdy-comp-date-picker-nav-btn-size:1.75rem;
  }
  .mdy-dynamic-form,
  .mdy-renderer {
    --mdy-modern-font-family:"Satoshi",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
    font-family: var(--mdy-modern-font-family);
  }
  .mdy-renderer .mdy-label {
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: 0;
  }
  .mdy-renderer {
    --mdy-input-height:2.25rem;
    --mdy-input-padding:0.375rem 0.625rem;
    --mdy-input-border-radius:0.5rem;
    --mdy-renderer-gap:0.25rem;
    --mdy-renderer-margin-bottom:0.75rem;
  }
  .mdy-input-wrapper {
    background-color: var(--mdy-surface-container-lowest);
    border: 1px solid var(--mdy-outline-subtle);
    border-radius: var(--mdy-input-border-radius);
    box-shadow: none;
  }
  .mdy-input-wrapper:hover:not(:focus-within) {
    background-color: var(--mdy-surface-container-lowest);
    border-color: var(--mdy-outline-variant);
  }
  .mdy-input-wrapper:focus-within {
    background-color: var(--mdy-surface-container-lowest);
    border-color: var(--mdy-input-focus-color);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--mdy-input-focus-color) 30%, transparent);
  }
  .mdy-input-wrapper--error {
    border-color: var(--mdy-error-color);
  }
  .mdy-renderer--checkbox .mdy-input-wrapper,
  .mdy-renderer--checkbox .mdy-input-wrapper:focus-within,
  .mdy-renderer--checkbox .mdy-input-wrapper:hover:not(:focus-within),
  .mdy-renderer--toggle .mdy-input-wrapper,
  .mdy-renderer--toggle .mdy-input-wrapper:focus-within,
  .mdy-renderer--toggle .mdy-input-wrapper:hover:not(:focus-within) {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
    min-height: 0;
  }
  .mdy-renderer--checkbox .mdy-input-wrapper__inliner,
  .mdy-renderer--toggle .mdy-input-wrapper__inliner {
    width: auto;
  }
  .mdy-input-wrapper input.mdy-checkbox,
  .mdy-input-wrapper input.mdy-switch {
    cursor: pointer;
    flex: 0 0 auto;
    margin: .25rem 0;
    padding: 0;
    width: auto;
  }
  .mdy-input-wrapper input.mdy-checkbox {
    appearance: none;
    background-color: transparent;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: .75rem;
    border: var(--mdy-comp-checkbox-unselected-outline-width) solid var(--mdy-comp-checkbox-unselected-outline-color);
    border-radius: var(--mdy-comp-checkbox-container-shape);
    height: var(--mdy-comp-checkbox-container-size);
    transition: background-color .15s, border-color .15s;
    width: var(--mdy-comp-checkbox-container-size);
  }
  .mdy-input-wrapper input.mdy-checkbox:checked,
  .mdy-input-wrapper input.mdy-checkbox:hover:not(:disabled) {
    border-color: var(--mdy-comp-checkbox-selected-container-color);
  }
  .mdy-input-wrapper input.mdy-checkbox:checked {
    --mdy-comp-checkbox-selected-icon-color:#fff;
    background-color: var(--mdy-comp-checkbox-selected-container-color);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E");
  }
  .mdy-input-wrapper input.mdy-checkbox:indeterminate {
    background-color: var(--mdy-comp-checkbox-selected-container-color);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23fff' stroke-linecap='round' stroke-width='2.5' viewBox='0 0 16 16'%3E%3Cpath d='M4 8h8'/%3E%3C/svg%3E");
    border-color: var(--mdy-comp-checkbox-selected-container-color);
  }
  .mdy-input-wrapper input.mdy-checkbox:focus-visible,
  .mdy-input-wrapper input.mdy-switch:focus-visible {
    outline: 2px solid var(--mdy-primary);
    outline-offset: 2px;
  }
  .mdy-input-wrapper input.mdy-switch {
    appearance: none;
    background-color: var(--mdy-surface-container-highest);
    background-image:
      radial-gradient(
        circle .4375rem at center,
        var(--mdy-on-surface-variant) 98%,
        transparent 100%);
    background-position: left .0625rem center;
    background-repeat: no-repeat;
    border: 1px solid var(--mdy-outline);
    border-radius: var(--mdy-sys-shape-corner-full);
    height: 1.25rem;
    transition:
      background-color .15s,
      border-color .15s,
      background-position .18s cubic-bezier(.2, 0, 0, 1);
    width: 2.25rem;
  }
  .mdy-input-wrapper input.mdy-switch:hover:not(:disabled) {
    border-color: var(--mdy-primary);
  }
  .mdy-input-wrapper input.mdy-switch:checked {
    background-color: var(--mdy-primary);
    background-image:
      radial-gradient(
        circle .46875rem at center,
        var(--mdy-on-primary) 98%,
        transparent 100%);
    background-position: right .0625rem center;
    border-color: var(--mdy-primary);
  }
  .mdy-input-wrapper input.mdy-checkbox:disabled,
  .mdy-input-wrapper input.mdy-switch:disabled {
    cursor: not-allowed;
    opacity: .38;
  }
  .mdy-select {
    align-items: center;
    display: flex;
    min-width: 0;
    width: 100%;
  }
  .mdy-input-wrapper .mdy-select > input.mdy-select__trigger {
    flex: 1 1 auto;
    min-width: 0;
    padding-inline-end: 1.75rem;
  }
  .mdy-select > .mdy-select__arrow {
    inset-inline-end: .75rem;
    margin-left: 0;
    pointer-events: none;
    position: absolute;
  }
  .mdy-select > .mdy-select__arrow:after {
    border-bottom: 1.5px solid;
    border-right: 1.5px solid;
    content: "";
    height: .5rem;
    transform: translateY(-25%) rotate(45deg);
    width: .5rem;
  }
  .mdy-renderer--select .mdy-input-wrapper:focus-within .mdy-select__arrow:after {
    transform: translateY(25%) rotate(225deg);
  }
  .mdy-select__dropdown {
    background: var(--mdy-surface-container-lowest);
    border: 1px solid var(--mdy-outline-variant);
    border-radius: var(--mdy-input-border-radius);
    top: calc(100% + .375rem);
  }
  .mdy-select__option {
    color: var(--mdy-on-surface);
    font-size: var(--mdy-input-font-size);
  }
  .mdy-select__option--hidden {
    display: none;
  }
  .mdy-datepicker,
  .mdy-timepicker {
    align-items: center;
    display: flex;
    min-width: 0;
    position: relative;
    width: 100%;
  }
  .mdy-input-wrapper .mdy-datepicker__trigger,
  .mdy-input-wrapper .mdy-timepicker__trigger {
    background: transparent;
    border: 0;
    border-radius: inherit;
    color: var(--mdy-input-color);
    cursor: pointer;
    flex: 1 1 auto;
    font: inherit;
    font-size: var(--mdy-input-font-size);
    min-width: 0;
    padding: var(--mdy-input-padding);
    text-align: start;
  }
  .mdy-input-wrapper .mdy-datepicker__trigger:not(.mdy-datepicker__trigger--filled),
  .mdy-input-wrapper .mdy-timepicker__trigger:not(.mdy-timepicker__trigger--filled) {
    color: var(--mdy-on-surface-variant);
  }
  .mdy-datepicker__popup,
  .mdy-timepicker__popup {
    top: calc(100% + .375rem);
  }
  .mdy-timepicker__popup {
    align-items: center;
    background: var(--mdy-surface-container-lowest);
    border: 1px solid var(--mdy-outline-subtle);
    border-radius: var(--mdy-input-border-radius);
    box-shadow: var(--mdy-comp-date-picker-popup-shadow);
    display: flex;
    gap: .375rem;
    inset-inline-start: 0;
    padding: .5rem;
    position: absolute;
    z-index: 1000;
  }
  .mdy-timepicker__popup[hidden] {
    display: none;
  }
  .mdy-timepicker__popup button,
  .mdy-timepicker__popup input {
    background: transparent;
    border: 1px solid var(--mdy-outline-subtle);
    border-radius: var(--mdy-sys-shape-corner-extra-small);
    color: var(--mdy-on-surface);
    font: inherit;
    font-size: var(--mdy-helper-font-size);
    padding: .25rem .5rem;
    width: auto;
  }
  .mdy-timepicker__popup input {
    width: 3.25rem;
  }
  .mdy-timepicker__popup button {
    cursor: pointer;
  }
  .mdy-multiselect {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    min-width: 0;
    padding-block: .25rem;
    width: 100%;
  }
  .mdy-multiselect__chip {
    background: transparent;
    border: 1px solid var(--mdy-outline-subtle);
    border-radius: 999px;
    color: var(--mdy-on-surface);
    cursor: pointer;
    font: inherit;
    font-size: var(--mdy-helper-font-size);
    padding: .125rem .5rem;
    width: auto;
  }
  .mdy-multiselect__chip--selected {
    background: var(--mdy-primary);
    border-color: transparent;
    color: var(--mdy-on-primary);
  }
  .mdy-multiselect__chip--disabled {
    cursor: not-allowed;
    opacity: .38;
  }
  .mdy-renderer--radio .mdy-input-wrapper,
  .mdy-renderer--radio .mdy-input-wrapper:focus-within,
  .mdy-renderer--radio .mdy-input-wrapper:hover:not(:focus-within),
  .mdy-renderer--segmented .mdy-input-wrapper,
  .mdy-renderer--segmented .mdy-input-wrapper:focus-within,
  .mdy-renderer--segmented .mdy-input-wrapper:hover:not(:focus-within) {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
    min-height: 0;
  }
  .mdy-radio-group,
  .mdy-segmented {
    align-items: start;
    min-width: 0;
    padding-block: .25rem;
    width: 100%;
  }
  .mdy-radio-group label,
  .mdy-segmented label {
    align-items: center;
    color: var(--mdy-on-surface);
    cursor: pointer;
    display: inline-flex;
    font-size: var(--mdy-input-font-size);
    gap: .375rem;
    justify-content: flex-start;
    width: auto;
  }
  .mdy-supporting-text {
    padding-inline: .125rem;
  }
  .mdy-control__errors {
    color: var(--mdy-error-color);
    font-size: var(--mdy-helper-font-size);
    line-height: var(--mdy-helper-line-height);
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .mdy-control__errors:empty,
  .mdy-description:empty,
  .mdy-supporting-text:empty {
    display: none;
  }
  @media (prefers-reduced-motion: reduce) {
    .mdy-input-wrapper input.mdy-switch {
      transition: none;
    }
  }
}
@font-face {
  font-family: "Satoshi";
  src: url("./Satoshi-Regular-YSPUDOHB.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("./Satoshi-Medium-UBKTXJB3.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("./Satoshi-Bold-M7KPQSIT.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
:root {
  --mdy-indigo: #7067ff;
  --mdy-violet: #a855f7;
  --mdy-coral: #ff6577;
  --mdy-night: #0e0f16;
  --mdy-cloud: #f8fafc;
  --mdy-slate: #94a3b8;
  --mdy-gradient-brand:
    linear-gradient(
      90deg,
      #7067ff 0%,
      #a855f7 50%,
      #ff6577 100%);
  --mdy-bg: var(--mdy-night);
  --mdy-panel: color-mix(in srgb, var(--mdy-night) 92%, white);
  --mdy-border: color-mix(in srgb, var(--mdy-night) 80%, white);
  --mdy-border-accent: color-mix(in srgb, var(--mdy-indigo) 40%, var(--mdy-night));
  --mdy-text: var(--mdy-cloud);
  --mdy-text-muted: #aab6c8;
  --mdy-focus-ring: color-mix(in srgb, var(--mdy-indigo) 35%, transparent);
  --mdy-danger-text: color-mix(in srgb, var(--mdy-coral) 82%, white);
  --mdy-shadow-strong: rgb(0 0 0 / 45%);
  --mdy-shadow-soft: rgb(0 0 0 / 22%);
  --mdy-scheme: dark;
}
@media (prefers-color-scheme: light) {
  :root {
    --mdy-bg: #ffffff;
    --mdy-panel: var(--mdy-cloud);
    --mdy-border: #d5dbe4;
    --mdy-border-accent: color-mix(in srgb, var(--mdy-indigo) 45%, white);
    --mdy-text: #16181f;
    --mdy-text-muted: #55607a;
    --mdy-focus-ring: color-mix(in srgb, var(--mdy-indigo) 30%, transparent);
    --mdy-danger-text: #b3261e;
    --mdy-shadow-strong: rgb(15 23 42 / 22%);
    --mdy-shadow-soft: rgb(15 23 42 / 12%);
    --mdy-scheme: light;
  }
}
html,
body {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  background: var(--mdy-bg);
}
.studio {
  color-scheme: light dark;
  width: 100%;
  height: 100dvh;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: var(--mdy-bg);
  color: var(--mdy-text);
  font:
    14px "Satoshi",
    system-ui,
    sans-serif;
  display: grid;
  grid-template-rows: 40px minmax(0, 1fr) 24px;
}
.studio * {
  box-sizing: border-box;
}
.studio header {
  min-width: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  overflow: hidden;
  border-bottom: 1px solid var(--mdy-border);
}
.brand {
  flex: 0 0 auto;
  font-weight: 700;
  font-size: 13px;
  background-image: var(--mdy-gradient-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.form-name {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 26rem;
  padding: 3px 7px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--mdy-text);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
}
.form-name:hover {
  border-color: var(--mdy-border);
}
.form-name:focus-visible {
  border-color: var(--mdy-indigo);
  background: var(--mdy-panel);
}
.form-meta {
  flex: 0 0 auto;
  margin-inline-start: auto;
  color: var(--mdy-text-muted);
  font-size: 11px;
  white-space: nowrap;
}
.import-button {
  display: inline-flex;
  align-items: center;
  color: var(--mdy-text);
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 6px 10px;
  cursor: pointer;
  font-size: 14px;
}
.import-button:hover,
.import-button:focus-within {
  border-color: var(--mdy-indigo);
  outline: 2px solid var(--mdy-focus-ring);
}
.studio button,
.studio input,
.studio select,
.studio textarea {
  max-width: 100%;
  font: inherit;
}
.studio button {
  background: transparent;
  color: var(--mdy-text);
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 6px 10px;
  cursor: pointer;
}
.studio button:hover,
.studio button:focus-visible {
  border-color: var(--mdy-indigo);
  outline: 2px solid var(--mdy-focus-ring);
}
.studio button:disabled {
  opacity: 0.4;
  cursor: default;
}
.studio main {
  width: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) minmax(280px, 320px);
}
.outline {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 10px 8px;
  border-right: 1px solid var(--mdy-border);
}
.outline-title {
  margin: 0 0 6px 4px;
  color: var(--mdy-text-muted);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.outline .tree {
  font-size: 12px;
}
.outline .node {
  gap: 2px;
  padding: 2px 4px;
  border-radius: 5px;
}
.outline .node .select {
  min-width: 0;
  padding: 1px 2px;
  border-color: transparent;
  background: transparent;
}
.outline .node-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.outline .node small {
  display: none;
}
.outline .node > button:not(.select) {
  padding: 0 4px;
  border-color: transparent;
  background: transparent;
  color: var(--mdy-text-muted);
  font-size: 11px;
  opacity: 0;
  transition: opacity 120ms ease;
}
.outline .node:hover > button:not(.select),
.outline .node:focus-within > button:not(.select),
.outline .node > button:not(.select):focus-visible {
  opacity: 1;
}
.outline .drop-zone {
  height: 6px;
  padding: 0;
  border: 0;
  overflow: hidden;
  color: transparent;
}
.outline .drop-zone.active {
  background: color-mix(in srgb, var(--mdy-indigo) 22%, transparent);
  border-radius: 3px;
}
.outline .drop-zone.drag-over {
  background: var(--mdy-indigo);
  border-radius: 3px;
}
.outline .array-item {
  margin-inline-start: 8px;
}
.outline .array-item b {
  color: var(--mdy-text-muted);
  font-size: 10px;
  font-weight: 600;
}
.outline .empty {
  padding: 8px 4px;
  color: var(--mdy-text-muted);
  font-size: 11px;
}
.outline .empty .drop-zone,
.canvas .empty .drop-zone {
  height: auto;
  padding: 8px;
  overflow: visible;
  border: 1px dashed var(--mdy-border);
  border-radius: 6px;
  color: var(--mdy-text);
  font-size: 11px;
  text-align: center;
}
.outline .empty p {
  margin: 0 0 6px;
}
.canvas-column {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  display: grid;
}
.inspector {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  border-left: 1px solid var(--mdy-border);
}
.inspector-body {
  min-width: 0;
  min-height: 0;
  flex: 1;
  padding: 12px 14px;
  overflow: auto;
  overscroll-behavior: contain;
}
.inspector-tabs {
  min-width: 0;
  display: flex;
  flex-shrink: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}
.inspector-tabs button {
  flex: 1 0 auto;
  border: none;
  border-bottom: 2px solid var(--mdy-border);
  border-radius: 0;
  background: transparent;
  padding: 8px 8px;
  font-size: 11px;
  font-weight: 600;
  color: var(--mdy-text-muted);
}
.inspector-tabs button[aria-selected=true] {
  color: var(--mdy-text);
  border-bottom-color: var(--mdy-indigo);
}
.inspector-tabs button:hover {
  color: var(--mdy-text);
}
.badge {
  display: inline-block;
  background: color-mix(in srgb, var(--mdy-indigo) 30%, transparent);
  color: color-mix(in srgb, var(--mdy-indigo) 55%, var(--mdy-cloud));
  border-radius: 999px;
  padding: 1px 7px;
  font-size: 10px;
  font-weight: 700;
}
.accordion {
  border-top: 1px solid var(--mdy-border);
  margin-top: 4px;
  padding-top: 4px;
}
.accordion summary {
  cursor: pointer;
  padding: 7px 2px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mdy-text-muted);
  list-style: revert;
}
.accordion summary::marker {
  color: var(--mdy-text-muted);
}
.accordion[open] summary {
  color: var(--mdy-text);
}
.accordion-body {
  padding: 2px 2px 8px;
}
.tab-hint {
  font-size: 11px;
  line-height: 1.4;
  color: var(--mdy-text-muted);
  margin: 0 0 9px;
}
.canvas {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 14px 18px;
}
.dock {
  position: absolute;
  inset-block-end: 16px;
  inset-inline-end: 16px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  pointer-events: none;
}
.dock > * {
  pointer-events: auto;
}
.canvas-column[data-dock-open=true] .canvas {
  padding-inline-end: 356px;
}
@media (max-width: 1400px) {
  .canvas-column[data-dock-open=true] .canvas {
    padding-inline-end: 18px;
  }
  .canvas-column[data-dock-open=true] .plain-canvas-frame {
    margin-bottom: min(66vh, 520px);
  }
}
.studio .fab {
  width: 46px !important;
  height: 46px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background-image: var(--mdy-gradient-brand);
  color: white;
  font-size: 20px;
  line-height: 1;
  box-shadow: 0 6px 20px var(--mdy-shadow-strong);
}
.studio .fab:hover,
.studio .fab:focus-visible {
  filter: brightness(1.12);
}
.dock-panel {
  width: min(78vw, 320px);
  max-height: min(60vh, 460px);
  overflow: auto;
  overscroll-behavior: contain;
  display: grid;
  gap: 14px;
  padding: 14px;
  border: 1px solid var(--mdy-border);
  border-radius: 14px;
  background: var(--mdy-panel);
  box-shadow: 0 14px 40px var(--mdy-shadow-strong);
}
.dock-panel[hidden] {
  display: none;
}
.dock-section h3 {
  margin: 0 0 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--mdy-text-muted);
}
.dock-templates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}
.dock-templates button {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 6px 8px;
  font-size: 12px;
  text-align: left;
  text-transform: capitalize;
}
.dock-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.dock-actions > * {
  flex: 0 0 auto;
}
.preview-fields .mdy-layout-columns,
.plain-canvas-form .mdy-layout-columns {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(var(--mdy-layout-column-count, 2), minmax(0, 1fr));
  gap: 4px 12px;
  align-items: start;
}
.preview-fields .mdy-layout-column,
.plain-canvas-form .mdy-layout-column {
  min-width: 0;
  display: grid;
  gap: 2px;
  align-content: start;
}
.plain-canvas-form .mdy-layout-section {
  min-width: 0;
  margin: 0;
  padding: 8px 10px 10px;
  border: 1px solid var(--mdy-border);
  border-radius: 10px;
}
.plain-canvas-form .mdy-layout-legend {
  padding: 0 4px;
  color: var(--mdy-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.plain-canvas-form .mdy-layout-column .plain-canvas-inline-name {
  display: none;
}
.plain-canvas-form .mdy-layout-column .plain-canvas-field {
  min-width: 0;
  overflow: hidden;
}
.plain-canvas-form .mdy-layout-column .plain-canvas-head {
  flex-wrap: wrap;
  row-gap: 2px;
}
.plain-canvas-form .mdy-layout-column .plain-canvas-actions {
  margin-inline-start: auto;
}
@media (max-width: 720px) {
  .plain-canvas-form .mdy-layout-columns {
    grid-template-columns: minmax(0, 1fr);
  }
}
.palette-layer {
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
}
.palette-layer:empty {
  display: none;
}
.palette-backdrop {
  position: absolute;
  inset: 0;
  pointer-events: auto;
  background: color-mix(in srgb, var(--mdy-night) 55%, transparent);
}
.palette-dialog {
  position: absolute;
  inset-block-start: 12vh;
  inset-inline: 0;
  width: min(92%, 460px);
  margin-inline: auto;
  pointer-events: auto;
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--mdy-border-accent);
  border-radius: 14px;
  background: var(--mdy-panel);
  box-shadow: 0 20px 60px var(--mdy-shadow-strong);
}
.studio .palette-input {
  width: 100%;
  padding: 9px 11px;
  border: 1px solid var(--mdy-border);
  border-radius: 8px;
  background: var(--mdy-bg);
  color: var(--mdy-text);
  font-size: 14px;
}
.studio .palette-input:focus-visible {
  border-color: var(--mdy-indigo);
  outline: 2px solid var(--mdy-focus-ring);
}
.palette-list {
  max-height: min(46vh, 340px);
  margin: 0;
  padding: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  list-style: none;
}
.palette-option {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 9px;
  border-radius: 7px;
  cursor: pointer;
}
.palette-option.active {
  background: color-mix(in srgb, var(--mdy-indigo) 26%, var(--mdy-panel));
}
.palette-option-label {
  font-size: 13px;
  font-weight: 600;
}
.palette-option-group,
.palette-empty {
  color: var(--mdy-text-muted);
  font-size: 11px;
}
.palette-option.active .palette-option-group {
  color: var(--mdy-text);
}
.palette-empty {
  padding: 10px 9px;
  list-style: none;
}
.palette-hint {
  margin: 0;
  color: var(--mdy-text-muted);
  font-size: 10px;
}
.dock-section h3 kbd {
  margin-inline-start: 4px;
  padding: 1px 4px;
  border: 1px solid var(--mdy-border);
  border-radius: 4px;
  font-family: inherit;
  font-size: 9px;
  text-transform: none;
  letter-spacing: 0;
}
.dock-group-label {
  margin: 6px 0 4px;
  color: var(--mdy-text-muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.plain-canvas-form .plain-canvas-required {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  padding: 0 3px;
  border-color: transparent;
  background: transparent;
  color: var(--mdy-text-muted);
  font-size: 11px;
  line-height: 1;
  opacity: 0.4;
}
.plain-canvas-form .plain-canvas-required[aria-pressed=true] {
  color: var(--mdy-coral);
  opacity: 1;
}
.plain-canvas-form .plain-canvas-required:hover {
  opacity: 1;
}
.canvas-mode-switch {
  display: inline-flex;
  max-width: 100%;
  padding: 2px;
  border: 1px solid var(--mdy-border);
  border-radius: 8px;
  background: var(--mdy-panel);
}
.canvas-mode-switch button {
  border-color: transparent;
}
.canvas-mode-switch button[aria-pressed=true] {
  border-color: var(--mdy-border-accent);
  background: color-mix(in srgb, var(--mdy-indigo) 18%, transparent);
}
.canvas-surface,
.plain-canvas-frame,
.plain-canvas-form {
  min-width: 0;
}
.plain-canvas-frame {
  width: min(100%, 680px);
  margin: 8px auto 96px;
  padding: 22px 22px 26px;
  border: 1px solid var(--mdy-border);
  border-radius: 16px;
  background: var(--mdy-panel);
}
.plain-canvas-unavailable {
  color: var(--mdy-text-muted);
  font-size: 12px;
  overflow-wrap: anywhere;
  padding: 24px;
  border: 1px dashed var(--mdy-border);
  border-radius: 8px;
  text-align: center;
}
.plain-canvas-form {
  display: grid;
  gap: 2px;
}
.plain-canvas-form .plain-canvas-drop {
  height: auto;
  min-height: 6px;
  padding: 0;
  border-width: 0;
  overflow: hidden;
}
.plain-canvas-form .plain-canvas-drop.active {
  background: color-mix(in srgb, var(--mdy-indigo) 22%, transparent);
  border-radius: 3px;
}
.plain-canvas-form .plain-canvas-drop.drag-over {
  background: var(--mdy-indigo);
  border-radius: 3px;
}
.plain-canvas-form .plain-canvas-insert {
  height: 18px;
  min-height: 0;
  padding: 0 8px;
  border: 0;
  border-radius: 5px;
  line-height: 1.4;
  overflow: visible;
  text-align: center;
  text-align-last: center;
}
.plain-canvas-form .plain-canvas-insert:hover,
.plain-canvas-form .plain-canvas-insert:focus-visible {
  background: color-mix(in srgb, var(--mdy-indigo) 10%, transparent);
  color: var(--mdy-indigo);
}
.plain-canvas-field > label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.plain-canvas-grip {
  flex: 0 0 auto;
  width: 14px;
  padding: 3px 0;
  color: var(--mdy-text-muted);
  font-size: 12px;
  line-height: 1;
  text-align: center;
  cursor: grab;
  opacity: 0.35;
  transition: opacity 120ms ease;
}
.plain-canvas-field:hover .plain-canvas-grip,
.plain-canvas-field.selected .plain-canvas-grip,
.plain-canvas-field:focus-within .plain-canvas-grip,
.plain-canvas-group:hover > legend > .plain-canvas-grip,
.plain-canvas-array:hover .plain-canvas-grip {
  opacity: 0.9;
}
.plain-canvas-grip:active {
  cursor: grabbing;
}
.plain-canvas-head {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 2px;
}
.plain-canvas-group > legend.plain-canvas-head {
  width: 100%;
  padding: 0 4px;
}
.plain-canvas-form .plain-canvas-array-count {
  flex: 0 0 auto;
  color: var(--mdy-text-muted);
  font-size: 10px;
  white-space: nowrap;
}
.plain-canvas-form .plain-canvas-inline {
  width: auto;
  min-width: 0;
  padding: 2px 5px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: var(--mdy-text);
  font: inherit;
}
.plain-canvas-form .plain-canvas-inline:hover {
  border-color: var(--mdy-border);
}
.plain-canvas-form .plain-canvas-inline:focus,
.plain-canvas-form .plain-canvas-inline:focus-visible {
  border-color: var(--mdy-indigo);
  background: var(--mdy-bg);
  outline: none;
}
.plain-canvas-form .plain-canvas-inline-label {
  flex: 1 1 auto;
  width: auto;
  min-width: 4rem;
  font-size: 13px;
  font-weight: 600;
}
.plain-canvas-form .plain-canvas-inline-name {
  flex: 0 1 7rem;
  width: 7rem;
  text-align: right;
  color: var(--mdy-text-muted);
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: 11px;
}
.plain-canvas-inline::placeholder {
  color: var(--mdy-text-muted);
  opacity: 0.6;
}
.plain-canvas-form > div {
  min-width: 0;
  display: grid;
  gap: 5px;
}
.plain-canvas-form p,
.plain-canvas-form ul {
  margin: 0;
}
.plain-canvas-form p:empty,
.plain-canvas-form ul:empty {
  display: none;
}
.plain-canvas-field {
  position: relative;
  padding: 6px 10px 7px;
  border: 1px solid transparent;
  border-radius: 8px;
}
.plain-canvas-field:hover {
  border-color: color-mix(in srgb, var(--mdy-indigo) 55%, var(--mdy-border));
}
.plain-canvas-field.selected {
  border-color: var(--mdy-indigo);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mdy-indigo) 22%, transparent);
}
.plain-canvas-field.has-diagnostic {
  border-style: dashed;
  border-color: var(--mdy-coral);
}
.plain-canvas-form .plain-canvas-select,
.plain-canvas-select {
  flex: 0 0 auto;
  width: auto !important;
  padding: 2px 7px;
  border-color: transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mdy-bg) 82%, transparent);
  color: var(--mdy-text);
  font-size: 10px;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.plain-canvas-form .plain-canvas-field.selected .plain-canvas-select,
.plain-canvas-field.selected .plain-canvas-select,
.plain-canvas-form .plain-canvas-group.selected > .plain-canvas-head > .plain-canvas-select,
.plain-canvas-form .plain-canvas-array.selected > .plain-canvas-head > .plain-canvas-select {
  background: color-mix(in srgb, var(--mdy-indigo) 68%, black);
  color: white;
}
.plain-canvas-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 2px;
  opacity: 0;
  transition: opacity 120ms ease;
}
.plain-canvas-field:hover .plain-canvas-actions,
.plain-canvas-field.selected .plain-canvas-actions,
.plain-canvas-field:focus-within .plain-canvas-actions,
.plain-canvas-array:hover > .plain-canvas-head > .plain-canvas-actions,
.plain-canvas-array.selected > .plain-canvas-head > .plain-canvas-actions,
.plain-canvas-array:focus-within > .plain-canvas-head > .plain-canvas-actions,
.plain-canvas-group:hover > .plain-canvas-head > .plain-canvas-actions,
.plain-canvas-group.selected > .plain-canvas-head > .plain-canvas-actions,
.plain-canvas-group:focus-within > .plain-canvas-head > .plain-canvas-actions {
  opacity: 1;
}
.plain-canvas-actions button {
  width: auto !important;
  min-width: 20px;
  padding: 2px 5px;
  border-color: transparent;
  background: transparent;
  color: var(--mdy-text-muted);
  font-size: 11px;
  line-height: 1.4;
}
.plain-canvas-actions button:hover:not(:disabled) {
  color: var(--mdy-text);
  background: var(--mdy-bg);
}
.plain-canvas-actions [data-delete] {
  color: var(--mdy-danger-text);
}
.plain-canvas-actions button:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.plain-canvas-form .plain-canvas-actions select {
  width: 2.4rem;
  padding: 2px 0 2px 4px;
  border-color: transparent;
  background: transparent;
  color: var(--mdy-text);
  font: inherit;
  font-size: 11px;
}
.plain-canvas-insert {
  display: block;
  width: min(100%, 150px) !important;
  margin: 0 auto;
  background: transparent;
  color: var(--mdy-text-muted);
  font-size: 11px;
  opacity: 0;
  transition: opacity 120ms ease;
}
.plain-canvas-form:hover .plain-canvas-insert,
.plain-canvas-insert:focus-visible {
  opacity: 1;
}
.plain-canvas-insert:hover,
.plain-canvas-insert:focus-visible {
  border-color: var(--mdy-indigo);
  background: color-mix(in srgb, var(--mdy-indigo) 10%, transparent);
  color: var(--mdy-text);
  opacity: 1;
}
.plain-canvas-array {
  margin: 10px 0;
  padding: 12px;
  border: 1px solid var(--mdy-border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--mdy-surface) 96%, var(--mdy-coral));
}
.plain-canvas-array.selected {
  border-color: var(--mdy-indigo);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mdy-indigo) 20%, transparent);
}
.plain-canvas-array-count,
.plain-canvas-array-empty {
  color: var(--mdy-muted);
  font-size: 0.8rem;
}
.plain-canvas-array-body {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}
.plain-canvas-array-empty {
  margin: 0;
  padding: 10px;
  border: 1px dashed var(--mdy-border);
  border-radius: 6px;
  text-align: center;
}
.plain-canvas-array-row {
  padding: 8px 10px;
  border-radius: 6px;
  background: var(--mdy-surface);
}
.plain-canvas-group {
  min-width: 0;
  margin: 10px 0;
  padding: 12px;
  border: 1px solid var(--mdy-border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--mdy-surface) 94%, var(--mdy-indigo));
}
.plain-canvas-group.selected {
  border-color: var(--mdy-indigo);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mdy-indigo) 20%, transparent);
}
.plain-canvas-group[draggable=true] {
  cursor: grab;
}
.plain-canvas-group.dragging {
  cursor: grabbing;
  opacity: 0.55;
}
.plain-canvas-group legend {
  padding: 0 6px;
}
.plain-canvas-group-body {
  display: grid;
  gap: 4px;
}
.plain-canvas-drop-inside.active {
  min-height: 30px;
}
.plain-canvas-drop-root {
  min-height: 24px;
  margin: 10px 0 18px;
}
.plain-canvas-drop-root.active {
  min-height: 38px;
}
.plain-canvas-drop-root.drag-over {
  min-height: 48px;
}
.plain-canvas-field[draggable=true] {
  cursor: grab;
}
.plain-canvas-field.dragging {
  cursor: grabbing;
  opacity: 0.55;
}
.plain-canvas-drop {
  box-sizing: border-box;
  height: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  opacity: 0;
  color: transparent;
  transition: min-height 120ms ease, opacity 120ms ease;
}
.plain-canvas-drop.active {
  min-height: 14px;
  margin: 2px 0;
  border: 1px dashed color-mix(in srgb, var(--mdy-indigo) 55%, var(--mdy-border));
  border-radius: 6px;
  opacity: 0.55;
}
.plain-canvas-drop.drag-over {
  min-height: 24px;
  border-color: var(--mdy-indigo);
  background: color-mix(in srgb, var(--mdy-indigo) 16%, transparent);
  opacity: 1;
}
.dock [data-template][draggable=true] {
  cursor: grab;
}
.dock [data-template][draggable=true]:active {
  cursor: grabbing;
}
@media (prefers-reduced-motion: reduce) {
  .plain-canvas-actions,
  .outline .node > button:not(.select) {
    transition: none;
  }
  .plain-canvas-drop {
    transition: none;
  }
}
.plain-canvas-form label {
  color: var(--mdy-text-muted);
  font-size: 12px;
  font-weight: 600;
}
.plain-canvas-form input:not(:where(.mdy-input-wrapper *)),
.plain-canvas-form textarea:not(:where(.mdy-input-wrapper *)),
.plain-canvas-form select:not(:where(.mdy-input-wrapper *)),
.plain-canvas-form button:not(:where(.mdy-input-wrapper *)) {
  width: 100%;
  min-width: 0;
}
.plain-canvas-form input:not(:where(.mdy-input-wrapper *)),
.plain-canvas-form textarea:not(:where(.mdy-input-wrapper *)),
.plain-canvas-form select:not(:where(.mdy-input-wrapper *, .plain-canvas-insert)) {
  padding: 9px 10px;
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  background: var(--mdy-bg);
  color: var(--mdy-text);
}
.plain-canvas-form input[type=radio] {
  width: auto;
  justify-self: start;
  margin: 2px 0;
}
.plain-canvas-form ul:not(:where(.mdy-input-wrapper *)) {
  margin: 0;
  padding-left: 18px;
  color: var(--mdy-coral);
  font-size: 11px;
}
.tree {
  min-width: 0;
}
.tree,
.tree ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.tree ul {
  border-left: 1px solid var(--mdy-border);
  margin-left: 18px;
  padding-left: 14px;
}
.node {
  min-width: 0;
  display: flex;
  gap: 6px;
  align-items: center;
  border: 1px solid var(--mdy-border);
  border-radius: 7px;
  padding: 6px;
}
.selected > .node {
  border-color: var(--mdy-indigo);
}
.node .select {
  min-width: 0;
  flex: 1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: left;
}
.node-label {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.node-label > span,
.node small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.node small {
  color: var(--mdy-text-muted);
}
.node > button:not(.select),
.node-indicators {
  flex: 0 0 auto;
}
.node-indicators {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  line-height: 1;
}
.indicator.required {
  color: var(--mdy-coral);
  font-size: 14px;
  font-weight: 700;
}
.indicator.count {
  background: color-mix(in srgb, var(--mdy-indigo) 30%, transparent);
  color: color-mix(in srgb, var(--mdy-indigo) 55%, var(--mdy-cloud));
  border-radius: 999px;
  min-width: 15px;
  height: 15px;
  padding: 0 4px;
  font-weight: 700;
}
.indicator.server {
  color: var(--mdy-violet);
  font-size: 12px;
}
.indicator.issue {
  color: var(--mdy-coral);
  font-weight: 700;
  font-size: 13px;
}
.badge-error {
  background: color-mix(in srgb, var(--mdy-coral) 30%, transparent);
  color: var(--mdy-danger-text);
}
.diagnostic-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}
.diagnostic-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--mdy-border);
  border-left: 3px solid var(--mdy-text-muted);
  border-radius: 6px;
  padding: 8px 10px;
}
.diagnostic-row.severity-error {
  border-left-color: var(--mdy-coral);
}
.diagnostic-row.severity-warning {
  border-left-color: color-mix(in srgb, var(--mdy-violet) 70%, var(--mdy-coral));
}
.diag-severity {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--mdy-text-muted);
}
.severity-error .diag-severity {
  color: var(--mdy-danger-text);
}
.diag-message {
  min-width: 0;
  flex: 1 1 100%;
  overflow-wrap: anywhere;
  font-size: 12px;
}
.diag-actions {
  display: flex;
  gap: 6px;
}
.diag-actions button {
  font-size: 11px;
  padding: 5px 8px;
}
.export-error {
  border: 1px solid var(--mdy-coral);
  border-radius: 6px;
  padding: 8px 10px;
  color: var(--mdy-coral);
  font-size: 12px;
}
.export-files {
  list-style: none;
  padding: 0;
  margin: 12px 0 0;
  display: grid;
  gap: 8px;
}
.export-file {
  min-width: 0;
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 12px;
}
.export-file-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.export-file-path {
  font-family: monospace;
  overflow-wrap: anywhere;
}
.export-file .accordion {
  margin-top: 8px;
  padding-top: 8px;
}
.export-file-code {
  margin: 0;
  max-width: 100%;
  max-height: 260px;
  overflow: auto;
  box-sizing: border-box;
  background: var(--mdy-bg);
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 10px;
  font-family: monospace;
  font-size: 11px;
  line-height: 1.5;
  white-space: pre;
}
.preview-status {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
}
.preview-status-badge {
  display: inline-block;
  border-radius: 999px;
  padding: 2px 9px;
  font-size: 11px;
  font-weight: 700;
}
.preview-status-badge.valid {
  background: color-mix(in srgb, var(--mdy-indigo) 30%, transparent);
  color: color-mix(in srgb, var(--mdy-indigo) 55%, var(--mdy-cloud));
}
.preview-status-badge.invalid {
  background: color-mix(in srgb, var(--mdy-coral) 25%, transparent);
  color: var(--mdy-danger-text);
}
.preview-status-badge.pending {
  background: color-mix(in srgb, var(--mdy-violet) 25%, transparent);
  color: color-mix(in srgb, var(--mdy-violet) 55%, var(--mdy-cloud));
}
.preview-fields {
  display: grid;
  gap: 14px;
  margin-bottom: 14px;
}
.preview-field {
  display: grid;
  gap: 4px;
  font-size: 12px;
}
.preview-field > span:first-child {
  color: var(--mdy-text-muted);
}
.preview-pending {
  color: var(--mdy-violet);
  font-weight: 700;
}
.preview-errors {
  color: var(--mdy-coral);
  font-size: 11px;
}
.preview-mock-mode {
  display: grid;
  gap: 4px;
  margin-top: 4px;
  font-size: 11px;
  color: var(--mdy-text-muted);
}
.preview-group {
  border: 1px solid var(--mdy-border);
  border-radius: 8px;
  padding: 12px;
  margin: 0;
  display: grid;
  gap: 14px;
}
.preview-group legend {
  padding: 0 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mdy-text-muted);
}
.preview-array {
  border: 1px solid var(--mdy-border);
  border-radius: 8px;
  padding: 12px;
  display: grid;
  gap: 10px;
}
.preview-array-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mdy-text-muted);
}
.preview-array-row {
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 10px;
  display: grid;
  gap: 10px;
}
.drop-zone {
  height: 8px;
  color: transparent;
  border: 1px dashed transparent;
  border-radius: 6px;
  text-align: center;
  font-size: 11px;
  transition: 0.12s;
}
.drop-zone:hover,
.drop-zone.inside {
  height: 25px;
  padding: 4px;
  color: color-mix(in srgb, var(--mdy-indigo) 60%, var(--mdy-cloud));
  border-color: var(--mdy-border-accent);
}
.array-item {
  margin: 5px 0 5px 18px;
  padding: 8px;
  border: 1px solid var(--mdy-border);
  border-radius: 7px;
}
.array-item b {
  color: var(--mdy-violet);
  font-size: 12px;
}
.empty {
  margin: 40px auto;
  max-width: 480px;
  text-align: center;
  border: 1px dashed var(--mdy-border);
  padding: 32px;
  border-radius: 10px;
  color: var(--mdy-text-muted);
}
.inspector label {
  display: block;
  color: var(--mdy-text-muted);
  font-size: 12px;
  margin: 15px 0;
}
.inspector input,
.inspector textarea {
  display: block;
  width: 100%;
  margin-top: 6px;
  background: transparent;
  color: var(--mdy-text);
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 8px;
}
.inspector textarea {
  min-height: 80px;
}
.inspector dd {
  margin: 3px 0;
  color: color-mix(in srgb, var(--mdy-violet) 55%, var(--mdy-cloud));
  overflow-wrap: anywhere;
}
.accordion-body select,
.accordion-body input:not([type=checkbox]) {
  display: block;
  width: 100%;
  margin-top: 4px;
  background: transparent;
  color: var(--mdy-text);
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 7px;
  font-size: 12px;
}
.accordion-body label {
  display: block;
  color: var(--mdy-text-muted);
  font-size: 12px;
  margin: 10px 0;
}
.validator-list,
.option-list {
  list-style: none;
  padding: 0;
  margin: 0 0 8px;
  display: grid;
  gap: 6px;
}
.validator-row,
.option-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.validator-row span {
  flex: 1;
  font-size: 12px;
  color: var(--mdy-text-muted);
}
.validator-row input,
.option-row input {
  width: auto;
  min-width: 0;
  margin-top: 0;
  padding: 5px 7px;
  font-size: 12px;
}
.validator-row input {
  flex: 1 1 100%;
}
.option-row input {
  flex: 1 1 80px;
}
.dep-row {
  display: flex !important;
  align-items: center;
  gap: 6px;
  margin: 4px 0 !important;
}
.server-deps {
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 8px 10px;
  margin: 10px 0;
  max-height: 140px;
  overflow: auto;
}
.server-deps legend {
  font-size: 11px;
  color: var(--mdy-text-muted);
  padding: 0 4px;
}
.submit-action {
  margin-bottom: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--mdy-border);
}
.submit-action h3 {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--mdy-text-muted);
  margin: 0 0 10px;
}
.submit-action label {
  display: block;
  color: var(--mdy-text-muted);
  font-size: 12px;
  margin: 10px 0;
}
.submit-action select {
  display: block;
  width: 100%;
  margin-top: 4px;
  background: transparent;
  color: var(--mdy-text);
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 7px;
  font-size: 12px;
}
.submit-action button {
  margin-right: 6px;
}
.form-validator-list {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: grid;
  gap: 8px;
}
.form-validator-row {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  border: 1px solid var(--mdy-border);
  border-radius: 8px;
  padding: 8px 10px;
}
.fv-summary {
  min-width: 0;
  flex: 1;
  display: grid;
  gap: 4px;
}
.fv-summary strong {
  font-size: 11px;
  text-transform: uppercase;
  color: var(--mdy-violet);
}
.fv-meta {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 11px;
  color: var(--mdy-text-muted);
}
.fv-draft {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  align-items: end;
}
.fv-draft label {
  display: block;
  color: var(--mdy-text-muted);
  font-size: 12px;
}
.fv-draft select,
.fv-draft input {
  display: block;
  width: 100%;
  margin-top: 4px;
  background: transparent;
  color: var(--mdy-text);
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
  padding: 7px;
  font-size: 12px;
}
.fv-subcondition {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--mdy-border);
  border-radius: 6px;
}
.studio footer {
  min-width: 0;
  display: flex;
  align-items: center;
  padding: 0 14px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  white-space: nowrap;
  border-top: 1px solid var(--mdy-border);
  color: var(--mdy-text-muted);
  font-size: 11px;
}
@media (max-width: 1000px) {
  .studio main {
    grid-template-columns: 180px minmax(0, 1fr);
  }
  .inspector {
    display: none;
  }
}
@media (max-width: 760px) {
  .outline {
    display: none;
  }
}
@media (max-width: 600px) {
  .studio {
    grid-template-rows: 44px minmax(0, 1fr) 24px;
  }
  .studio header {
    padding-inline: 12px;
  }
  .studio header span {
    display: none;
  }
  .studio main {
    grid-template-columns: minmax(0, 1fr);
  }
  .canvas {
    padding: 12px 14px;
  }
  .canvas-column[data-dock-open=true] .canvas {
    padding-inline-end: 14px;
  }
  .plain-canvas-frame {
    padding: 16px 14px 20px;
  }
  .plain-canvas-head {
    flex-wrap: wrap;
  }
}
.plain-canvas-array[draggable=true] {
  cursor: grab;
}
.plain-canvas-array.dragging {
  cursor: grabbing;
  opacity: 0.55;
}
.plain-canvas-array-item {
  width: 100%;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px dashed var(--mdy-border);
  border-radius: 6px;
  background: transparent;
  color: var(--mdy-muted);
  text-align: left;
  cursor: pointer;
}
.plain-canvas-array-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.plain-canvas-array-row-actions {
  display: inline-flex;
  gap: 4px;
}
.plain-canvas-array-row-actions button {
  font: inherit;
  font-size: 0.75rem;
}
.plain-canvas-array-row-actions button:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
/*# sourceMappingURL=studio.css.map */