.callout{--callout-ink:var(--status-neutral);--callout-soft:var(--status-neutral-soft);--callout-title-ink:color-mix(in srgb, var(--callout-ink) 30%, var(--foreground));--callout-copy-ink:color-mix(in srgb, var(--callout-ink) 22%, var(--text-secondary));--callout-action-ink:var(--callout-ink);--callout-ring:color-mix(in srgb, var(--callout-ink) 10%, transparent);--callout-rule:color-mix(in srgb, var(--callout-ink) 16%, transparent);--callout-pill:var(--card);--callout-pill-hover:color-mix(in srgb, var(--callout-ink) 8%, var(--card));--callout-pill-active:color-mix(in srgb, var(--callout-ink) 14%, var(--card));--callout-quiet-hover:color-mix(in srgb, var(--callout-ink) 10%, transparent);--callout-quiet-active:color-mix(in srgb, var(--callout-ink) 16%, transparent);isolation:isolate;margin-block:var(--space-2);border-color:var(--callout-ring);background:var(--callout-soft);position:relative;overflow:hidden}:root.theme-dark .callout{--callout-ring:color-mix(in srgb, var(--callout-ink) 18%, transparent);--callout-rule:color-mix(in srgb, var(--callout-ink) 22%, transparent);--callout-pill:color-mix(in srgb, var(--callout-ink) 14%, var(--callout-soft));--callout-pill-hover:color-mix(in srgb, var(--callout-ink) 22%, var(--callout-soft));--callout-pill-active:color-mix(in srgb, var(--callout-ink) 30%, var(--callout-soft))}.callout[data-tone=neutral]{--callout-action-ink:var(--callout-title-ink)}.callout[data-tone=accent]{--callout-ink:var(--accent-text);--callout-soft:var(--accent-subtle)}.callout[data-tone=info]{--callout-ink:var(--status-info);--callout-soft:var(--status-info-soft)}.callout[data-tone=success]{--callout-ink:var(--status-success);--callout-soft:var(--status-success-soft)}.callout[data-tone=warning]{--callout-ink:var(--status-warning);--callout-soft:var(--status-warning-soft)}.callout[data-tone=danger]{--callout-ink:var(--status-danger);--callout-soft:var(--status-danger-soft)}.callout[data-tone=ai]{--callout-ink:var(--status-ai);--callout-soft:var(--status-ai-soft)}.callout__message{flex:24rem;max-width:100%}.callout__action{flex:0 auto}.callout__action .app-button:where(:not([data-button-size^=icon]):not([data-button-size=header-icon])){max-width:100%;height:auto;min-height:var(--control-height);white-space:normal;overflow-wrap:anywhere}.callout__action .app-button[data-button-size=compact]{min-height:var(--control-height-compact)}@media (width<=879px){.callout__action .app-button.tap-target{min-height:var(--tap-target)}}.callout__icon{color:var(--callout-ink)}.callout__title{color:var(--callout-title-ink);overflow-wrap:anywhere}.callout__title strong{font-weight:inherit}.callout__description{color:var(--callout-copy-ink);overflow-wrap:anywhere}.callout__footer{border-color:var(--callout-rule)}.callout__action .app-button:is([data-button-variant=default],[data-button-variant=accent],[data-button-variant=accent-text]){background-color:var(--callout-pill)!important;color:var(--callout-action-ink)!important;border-color:#0000!important}@media (hover:hover) and (pointer:fine){.callout__action .app-button:is([data-button-variant=default],[data-button-variant=accent],[data-button-variant=accent-text]):hover{background-color:var(--callout-pill-hover)!important}}.callout__action .app-button:is([data-button-variant=default],[data-button-variant=accent],[data-button-variant=accent-text]):active{background-color:var(--callout-pill-active)!important}.callout__action .app-button:is([data-button-variant=secondary],[data-button-variant=ghost],[data-button-variant=outline],[data-button-variant=quiet-accent]){color:var(--callout-action-ink)!important;background-color:#0000!important}@media (hover:hover) and (pointer:fine){.callout__action .app-button:is([data-button-variant=secondary],[data-button-variant=ghost],[data-button-variant=outline],[data-button-variant=quiet-accent]):hover{background-color:var(--callout-quiet-hover)!important}}.callout__action .app-button:is([data-button-variant=secondary],[data-button-variant=ghost],[data-button-variant=outline],[data-button-variant=quiet-accent]):active{background-color:var(--callout-quiet-active)!important}.callout__dismiss{opacity:.72}.callout__dismiss:focus-visible{opacity:1}@media (hover:hover) and (pointer:fine){.callout__dismiss:hover{opacity:1}}@media (forced-colors:active){.callout{background:canvas;border-color:canvastext}.callout__icon,.callout__title,.callout__description{color:canvastext}}
