@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 roles {
  @media screen {
    @container style(--_kit-unsaved: true) {
      .kit-role-toast:not(.kit-role-dialog > *) {
        inset-block-end: calc(2 * var(--_kit-inset) + env(safe-area-inset-bottom) + var(--kit-held-height, 0px) + var(--_kit-stack) + var(--_kit-rule));
      }
    }
  }
  @media screen and (width < 720px) {
    @container style(--_kit-railed: true) and style(--_kit-unsaved: true) {
      .kit-role-toast:not(.kit-role-dialog > *) {
        inset-block-end: calc(var(--_kit-bottom-bar-height) + env(safe-area-inset-bottom) + var(--kit-bar-growth, 0px) + var(--_kit-inset) + var(--kit-held-height, 0px) + var(--_kit-stack) + var(--_kit-rule));
      }
    }
  }
}
@layer shell {
  @media screen and (width < 720px) {
    @container style(--_kit-railed: true) and (not style(--_kit-unsaved: true)) {
      .kit-role-toast:not(.kit-role-dialog > *) {
        inset-block-end: calc(var(--_kit-bottom-bar-height) + env(safe-area-inset-bottom) + var(--kit-bar-growth, 0px));
      }
    }
  }
}