@layer brand, tokens, density, elements, values, brand-mark, spacing, cut-edges, actions, panels, marks, roles, headings, regions, authored-text, shell, absence, layouts, motion, states, embed, tables, truncation, print, without-fills, hidden;
@layer elements {
  .kit-role-number-field {
    overflow-wrap: break-word;
  }
}
@layer roles {
  .kit-role-entry-grid .kit-region-cell > .kit-role-number-field {
    min-inline-size: var(--_kit-field-step);
    margin-inline-start: auto;
  }
  .kit-role-entry-grid .kit-region-cell > .kit-role-number-field:has(> .kit-region-text[readonly]) {
    min-inline-size: 0;
    border-color: transparent;
    background: none;
    cursor: default;
  }
  .kit-role-entry-grid .kit-region-cell > .kit-role-number-field > .kit-region-text[readonly] {
    cursor: default;
  }
  @media screen {
    @container (inline-size < 720px) {
      .kit-role-entry-grid .kit-region-cell > .kit-role-number-field {
        margin-inline-start: 0;
      }
    }
  }
  .kit-role-number-field {
    --_kit-held-part-size: calc(var(--_kit-control-height) - 2 * (var(--_kit-rhythm) + var(--_kit-rule)));
  }
  .kit-role-number-field[data-kit-width=narrow] {
    --_kit-field-step: calc(var(--_kit-field-narrow) + 2 * (var(--_kit-inset-tight) + var(--_kit-rule)));
  }
  .kit-role-number-field[data-kit-width=short] {
    --_kit-field-step: calc(var(--_kit-field-short) + 2 * (var(--_kit-inset-tight) + var(--_kit-rule)));
  }
  .kit-role-number-field[data-kit-width=medium] {
    --_kit-field-step: calc(var(--_kit-field-medium) + 2 * (var(--_kit-inset-tight) + var(--_kit-rule)));
  }
  .kit-role-number-field[data-kit-width=wide] {
    --_kit-field-step: calc(var(--_kit-field-wide) + 2 * (var(--_kit-inset-tight) + var(--_kit-rule)));
  }
  .kit-role-number-field[data-kit-state~=disabled] {
    border-color: var(--_kit-panel-boundary);
    background-color: color-mix(in oklch, var(--_kit-text-muted) 18%, var(--_kit-panel-surface));
  }
  .kit-role-number-field {
    display: flex;
    align-items: center;
    gap: var(--_kit-rhythm);
    box-sizing: border-box;
    inline-size: fit-content;
    max-inline-size: 100%;
    min-inline-size: min(var(--_kit-field-step, 0px), 100%);
    block-size: var(--_kit-control-height);
    min-block-size: var(--_kit-control-height);
    border: var(--_kit-rule) solid var(--_kit-field-edge);
    border-radius: var(--_kit-radius);
    background: var(--_kit-panel-surface);
    font-size: var(--_kit-value-size);
    cursor: text;
  }
  .kit-role-number-field[data-kit-side=trailing] {
    justify-content: flex-end;
  }
  .kit-role-number-field > .kit-region-unit {
    flex: none;
    align-self: center;
    padding-inline: var(--_kit-inset-tight);
    color: var(--_kit-text-muted);
    white-space: pre;
  }
  .kit-role-number-field > .kit-region-unit:first-child {
    margin-inline-end: calc(-1 * var(--_kit-rhythm));
    padding-inline-end: 0;
  }
  .kit-role-number-field > .kit-region-text + .kit-region-unit {
    margin-inline-start: calc(-1 * var(--_kit-rhythm));
    padding-inline-start: 0;
  }
  .kit-role-number-field > .kit-region-text {
    flex: 0 1 auto;
    field-sizing: content;
    align-self: stretch;
    min-inline-size: calc(var(--_kit-inset-tight) + 1ch);
    padding: 0 var(--_kit-inset-tight);
    border: 0;
    background: none;
    color: var(--_kit-text-ink);
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    font-variant-numeric: tabular-nums;
  }
  .kit-role-number-field > .kit-region-unit:first-child + .kit-region-text {
    padding-inline-start: 0;
  }
  .kit-role-number-field[data-kit-holds~=unit] > .kit-region-text:first-child {
    padding-inline-end: 0;
  }
  .kit-role-number-field > .kit-region-decrease,
  .kit-role-number-field > .kit-region-increase {
    flex: none;
    background-color: transparent;
    &[data-kit-state~=submitting],
    &[aria-busy=true],
    &[data-kit-state~=inert],
    &:disabled:where(:not([data-phx-disabled=false])) {
      background-color: var(--_kit-wash);
    }
  }
  .kit-role-number-field[data-kit-holds~=decrease] {
    padding-inline-end: var(--_kit-rhythm);
  }
  .kit-role-number-field > .kit-region-decrease {
    margin-inline-start: auto;
  }
  .kit-role-number-field:has(> .kit-region-text:focus-visible) {
    outline: var(--_kit-focus-edge) solid var(--_kit-text-ink);
    outline-offset: var(--_kit-focus-edge);
    box-shadow: 0 0 0 var(--_kit-focus-edge) var(--_kit-focus-halo);
  }
  .kit-role-number-field > .kit-region-text:focus-visible {
    outline: none;
    box-shadow: none;
  }
  :is(.kit-region-page-foot, .kit-region-count-continuation) > :is(.kit-region-rows-per-page, .kit-region-go-to-page) > .kit-role-form-group > .kit-role-number-field {
    grid-column: 2;
  }
  :is(.kit-region-page-foot, .kit-region-count-continuation) > :is(.kit-region-rows-per-page, .kit-region-go-to-page) > .kit-role-form-group > .kit-role-number-field {
    min-inline-size: var(--_kit-field-step);
  }
}
@layer layouts {
  @media screen {
    .kit-region-form-row-list[data-kit-fit=lined] > .kit-region-form-row > .kit-role-form-group > .kit-role-number-field {
      min-inline-size: var(--_kit-field-step, 0px);
    }
  }
  @media screen {
    .kit-region-form-row-list[data-kit-fit=lined] > .kit-region-form-row > .kit-role-form-group > .kit-role-number-field {
      grid-row: 2;
    }
  }
  @media screen {
    @container (inline-size >= 720px) {
      .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-region-filters > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-region-filters > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-calendar > .kit-region-toolbar > .kit-region-view > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-view > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-region-filters > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-region-filters > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-reports > .kit-region-period-filters-schedule > .kit-region-filters > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-reports > .kit-region-period-filters-schedule > :where(.kit-region-period-filters:not([hidden])) > .kit-region-filters > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field,
      .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-role-form-group[data-kit-holds~=help] > .kit-role-number-field {
        justify-self: start;
      }
    }
  }
  @media screen {
    .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-view > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-view > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > :where(.kit-region-period-filters:not([hidden])) > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > :where(.kit-region-period-filters:not([hidden])) > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field {
      grid-column: 2;
    }
  }
  @media screen {
    .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-view > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-view > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > :where(.kit-region-period-filters:not([hidden])) > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-list > .kit-region-saved-views-filters-sort > :where(.kit-region-form) > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-reports > .kit-region-period-filters-schedule > :where(.kit-region-period-filters:not([hidden])) > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field,
    .kit-layout-calendar > .kit-region-toolbar > .kit-region-scope-form > .kit-region-scope > .kit-region-filters > .kit-region-filter > .kit-role-popover:not(:popover-open) > .kit-role-form-group > .kit-role-number-field {
      grid-row: 2 / span 2;
    }
  }
  @media screen {
    @container (inline-size >= 720px) {
      .kit-layout-reports > .kit-region-period-filters-schedule > .kit-region-filters > .kit-role-form-group > .kit-role-number-field,
      .kit-layout-reports > .kit-region-period-filters-schedule > .kit-region-period-filters > .kit-region-filters > .kit-role-form-group > .kit-role-number-field {
        margin-block-start: calc(var(--_kit-rhythm) - var(--_kit-stack));
      }
    }
  }
}
