@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 layouts {
  .kit-layout-kiosk {
    --_kit-kiosk-key: 64px;
    --_kit-kiosk-photo: 96px;
    --_kit-kiosk-idle: 20s;
    --_kit-kiosk-result: 10s;
    display: flex;
    flex-direction: column;
    gap: var(--_kit-region);
    box-sizing: border-box;
    min-block-size: 100svh;
    padding-block: var(--_kit-region);
    padding-inline: calc(var(--_kit-page-inset) + env(safe-area-inset-left)) calc(var(--_kit-page-inset) + env(safe-area-inset-right));
  }
  .kit-layout-kiosk > .kit-region-top-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: var(--_kit-region);
    margin: 0;
    font-size: var(--_kit-result-size);
  }
  .kit-layout-kiosk > .kit-region-top-line > .kit-region-time {
    margin-inline-start: auto;
    font-variant-numeric: tabular-nums;
  }
  .kit-layout-kiosk > .kit-region-rest {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: var(--_kit-region);
    min-inline-size: 0;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--_kit-stack);
    min-inline-size: 0;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry > .kit-region-prompt {
    margin: 0;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry > .kit-region-places {
    display: flex;
    grid-row: 2;
    grid-column: 1;
    justify-self: start;
    gap: var(--_kit-stack);
    margin-block: var(--_kit-stack);
    font-size: var(--_kit-result-size);
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry > .kit-region-native-control {
    grid-row: 2;
    grid-column: 1;
    box-sizing: border-box;
    inline-size: 100%;
    block-size: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 0;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry:has(> .kit-region-native-control:focus-visible) > .kit-region-places {
    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-layout-kiosk > .kit-region-rest > .kit-region-pin-entry > .kit-region-places > .kit-region-place {
    flex: none;
    inline-size: 1cap;
    block-size: 1cap;
    border: var(--_kit-rule) solid var(--_kit-text-ink);
    border-radius: 50%;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry > .kit-region-places > .kit-region-place[data-kit-state~=filled] {
    background: var(--_kit-text-ink);
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry > .kit-region-refusal-place {
    min-block-size: calc(1lh + 2 * var(--_kit-inset) + 2 * var(--_kit-rule));
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad {
    --_kit-control-height: var(--_kit-kiosk-key);
    display: grid;
    grid-template-columns: repeat(3, minmax(var(--_kit-kiosk-key), 1fr));
    grid-auto-rows: minmax(var(--_kit-kiosk-key), 1fr);
    gap: var(--_kit-stack);
    align-self: center;
    inline-size: max-content;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-key,
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-backspace,
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-clear {
    inline-size: auto;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-backspace > .kit-region-label:empty {
    display: none;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-key {
    font-size: var(--_kit-result-size);
    font-variant-numeric: tabular-nums;
  }
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-backspace,
  .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-clear {
    --_kit-control-icon: var(--_kit-result-size);
    font-size: var(--_kit-result-size);
  }
  .kit-layout-kiosk > .kit-region-act,
  .kit-layout-kiosk > .kit-region-result {
    display: flex;
    flex-direction: column;
    gap: var(--_kit-region);
    inline-size: 100%;
    max-inline-size: var(--_kit-focused-width);
    margin-inline: auto;
  }
  .kit-layout-kiosk > .kit-region-act > .kit-region-person {
    display: flex;
    flex-direction: column;
    gap: var(--_kit-stack);
  }
  .kit-layout-kiosk > .kit-region-act > .kit-region-person > .kit-region-photo {
    flex: none;
    inline-size: var(--_kit-kiosk-photo);
    block-size: var(--_kit-kiosk-photo);
    object-fit: cover;
  }
  .kit-layout-kiosk > .kit-region-act > .kit-region-person > .kit-region-name,
  .kit-layout-kiosk > .kit-region-act > .kit-region-person > .kit-region-standing {
    margin: 0;
  }
  .kit-layout-kiosk > .kit-region-act > .kit-region-act-form {
    display: flex;
    flex-direction: column;
    gap: var(--_kit-region);
  }
  .kit-layout-kiosk > .kit-region-act > .kit-region-act-form > .kit-region-acts {
    --_kit-control-height: var(--_kit-kiosk-key);
    display: flex;
    flex-direction: column;
    gap: var(--_kit-stack);
  }
  .kit-layout-kiosk > .kit-region-result .kit-region-next-action {
    --_kit-control-height: var(--_kit-kiosk-key);
    display: flex;
    flex-wrap: wrap;
    gap: var(--_kit-stack);
  }
  @media screen and (orientation: landscape) {
    .kit-layout-kiosk > .kit-region-rest {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      grid-template-rows: auto 1fr;
      column-gap: var(--_kit-region);
    }
  }
  @media screen and (orientation: landscape) {
    .kit-layout-kiosk > .kit-region-rest > .kit-region-pin-entry {
      grid-column: 1;
      grid-row: 1;
    }
  }
  @media screen and (orientation: landscape) {
    .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad {
      container-type: size;
      grid-column: 2;
      grid-row: 1 / 3;
      grid-template-columns: repeat(3, auto);
      grid-auto-rows: auto;
      place-content: center;
      align-self: stretch;
      justify-self: stretch;
      inline-size: auto;
    }
  }
  @media screen and (orientation: landscape) {
    .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-key,
    .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-backspace,
    .kit-layout-kiosk > .kit-region-rest > .kit-region-keypad > .kit-region-clear {
      inline-size: max(var(--_kit-kiosk-key), min((100cqi - 2 * var(--_kit-stack)) / 3, (100cqb - 3 * var(--_kit-stack)) / 4));
      block-size: max(var(--_kit-kiosk-key), min((100cqi - 2 * var(--_kit-stack)) / 3, (100cqb - 3 * var(--_kit-stack)) / 4));
    }
  }
}