@layer ui.tokens,ui.base;@layer ui.components{.alert{--alert-tone:var(--ui-tone,var(--ui-color-text));--alert-gap:var(--ui-space-3);--alert-padding:var(--ui-space-3) var(--ui-space-4);--alert-align:flex-start;--alert-radius:var(--ui-radius-control);--alert-border-block:var(--ui-border-width);--alert-border-inline:var(--ui-border-width);--alert-background:color-mix(in oklab, var(--alert-tone) 10%, var(--ui-color-surface));align-items:var(--alert-align);gap:var(--alert-gap);padding:var(--alert-padding);border-block-width:var(--alert-border-block);border-inline-width:var(--alert-border-inline);border-style:solid;border-color:var(--ui-tone-edge,color-mix(in oklab, var(--ui-color-text) 40%, transparent));border-radius:var(--alert-radius);background-color:var(--alert-background);color:var(--ui-color-text);font-size:var(--ui-text-sm);line-height:var(--ui-leading-body);display:flex}.alert-icon{color:var(--alert-tone);flex-shrink:0}@media (prefers-contrast:more){.alert{border-color:var(--ui-tone,var(--ui-color-border))}}@media (forced-colors:active){.alert{border-color:canvastext}}}