@scope([data-example]){[data-slot=toast-region]{--dir:-1;box-sizing:border-box;width:356px;max-width:calc(100vw - 2rem);height:var(--toast-front-height);margin:var(--space-4);outline:none;padding:0;list-style:none}[data-slot=toast-region][data-side=top]{--dir:1}[data-slot=toast-region][data-align=center]{margin-inline:0}[data-slot=toast-region][data-expanded]{height:calc(var(--toast-stack-height) + (var(--toast-count) - 1) * var(--space-3))}[data-slot=toast]{--y:calc(var(--dir) * var(--toast-index) * var(--space-3));z-index:calc(100 - var(--toast-index));align-items:center;gap:var(--space-3);box-sizing:border-box;padding:var(--space-4);border-radius:var(--radius-popup);background:var(--surface-2);box-shadow:var(--shadow-2);color:var(--ink);height:var(--toast-height);font-size:var(--text-md);outline-offset:2px;translate:calc(var(--toast-swipe-x,0px) + var(--exit-x,0px)) calc(var(--y) + var(--toast-swipe-y,0px) + var(--exit-y,0px) * var(--slide,1));scale:calc(1 - var(--toast-index) * .05);-webkit-user-select:none;user-select:none;transition-property:translate,scale,opacity,height,box-shadow;transition-duration:.4s;transition-timing-function:ease;display:flex;position:absolute;inset-inline:0;overflow:hidden}[data-slot=toast]:before{content:"";background:inherit;opacity:0;pointer-events:none;transition:inherit;position:absolute;inset:0}[data-side=bottom] [data-slot=toast]{bottom:0}[data-side=top] [data-slot=toast]{top:0}[data-slot=toast]:not([data-front],[data-expanded]){height:var(--toast-front-height)}[data-slot=toast]:not([data-front],[data-expanded]):before{opacity:1}[data-slot=toast][data-expanded]{--y:calc(var(--dir) * (var(--toast-offset) + var(--toast-index) * var(--space-3)));transition-duration:.2s;transition-timing-function:ease-out;scale:1}[data-slot=toast][data-starting-style]{transition:none}[data-slot=toast][data-starting-style]:not([data-front]){opacity:0}[data-slot=toast][data-starting-style][data-front]{--y:calc(var(--dir) * -100%)}[data-slot=toast][data-ending-style]{opacity:0;transition-duration:.2s;transition-timing-function:ease-out}@media (prefers-reduced-motion:no-preference){[data-slot=toast][data-ending-style]{--exit-y:calc(var(--dir) * -100%)}[data-slot=toast][data-ending-style][data-swipe-direction=left]{--exit-x:-100%}[data-slot=toast][data-ending-style][data-swipe-direction=right]{--exit-x:100%}}[data-slot=toast][data-ending-style]:not([data-front],[data-expanded]){--exit-y:0px}[data-slot=toast]:is([data-swipe-direction=left],[data-swipe-direction=right]){--slide:0}[data-slot=toast][data-swiping]{transition:none}@media (prefers-reduced-motion:reduce){[data-slot=toast]{transition-property:opacity}}[data-slot=toast]>[data-slot=stack]{flex:1;align-items:flex-start;gap:2px;min-width:0}[data-slot=toast] [data-slot=toast-close][aria-label]{width:var(--size-sm);height:var(--size-sm);box-shadow:none;color:var(--muted);background:0 0;padding:0}[data-slot=toast] [data-slot=toast-close][aria-label]:hover{background:var(--tint);color:var(--ink)}[data-slot=toast]>[data-slot=toast-title]{flex:1}[data-slot=toast]>svg{width:var(--size-icon);height:var(--size-icon);color:var(--muted);flex-shrink:0}[data-slot=toast]>svg+svg{display:block}[data-slot=toast][data-type=error] [data-show=error]{color:var(--danger)}[data-slot=toast]:not([data-type=success]) [data-show=success],[data-slot=toast]:not([data-type=info]) [data-show=info],[data-slot=toast]:not([data-type=warning]) [data-show=warning],[data-slot=toast]:not([data-type=error]) [data-show=error],[data-slot=toast]:not([data-type=loading]) [data-show=loading]{display:none}[data-slot=toast] [data-show=loading]{animation:.8s linear infinite example-spin}[data-slot=toast-title]{font-size:var(--text-md);margin:0;font-weight:600;line-height:20px}[data-slot=toast-description]{color:var(--muted);font-size:var(--text-sm);margin:0}:scope[data-example=toast\/position] [data-slot=controls]{gap:var(--space-2) var(--space-3);grid-template-columns:auto auto;display:grid}:scope[data-example=toast\/position] [data-slot=controls] [data-slot=select-label]{justify-self:end}:scope[data-example=toast\/position] [data-slot=controls] [data-slot=select-trigger]{min-width:8rem}:scope[data-example=toast\/position] [data-slot=stack]:has(>[data-slot=controls]){width:auto}:scope[data-example=toast\/overlay-host] :is([data-slot=list],[data-slot=controls]){width:20rem}:scope[data-example=toast\/overlay-host] [data-slot=list]>[data-slot=row]{justify-content:space-between;padding-inline-end:var(--space-1)}}