/* Shared action feedback, including pages that do not load the app design system. */
[data-toast-source] { display: none !important; }
.os-toast-region[data-toast-region] {
    position: fixed; z-index: 2147483000; inset: auto;
    top: max(20px, env(safe-area-inset-top)); right: max(20px, env(safe-area-inset-right));
    width: min(400px, calc(100vw - 28px)); max-height: calc(100dvh - 40px);
    margin: 0; padding: 0; border: 0; background: transparent; overflow: auto;
    display: grid; gap: 10px; pointer-events: none;
    font-family: var(--os-font-family, 'DM Sans', system-ui, sans-serif);
    text-align: left; color-scheme: light;
}
.os-toast-region[data-toast-region]:empty { display: none; }
.os-toast-region[data-toast-region]::backdrop { background: transparent; pointer-events: none; }
.os-toast-region[data-toast-region] .os-toast {
    --toast-tone: var(--os-color-info, #526aa2);
    box-sizing: border-box; position: relative; display: grid; grid-template-columns: 18px minmax(0, 1fr) 24px;
    align-items: start; gap: 12px; margin: 0; padding: 18px 20px 18px 16px;
    border: 1px solid color-mix(in srgb, var(--toast-tone) 42%, var(--os-color-border, #e1e5ee)); border-radius: 16px;
    background: var(--os-color-surface-elevated, #fff); color: var(--os-color-ink, #171d32);
    box-shadow: 0 12px 32px #12192d1a; font-size: 14px; font-weight: 400; line-height: 1.5;
    pointer-events: auto; animation: os-toast-enter .18s ease-out both;
}
.os-toast-region[data-toast-region] .os-toast--success { --toast-tone: var(--os-color-success, #218954); }
.os-toast-region[data-toast-region] .os-toast--danger { --toast-tone: var(--os-color-danger, #c04646); }
.os-toast-region[data-toast-region] .os-toast--warning { --toast-tone: var(--os-color-warning, #b78120); }
.os-toast-region[data-toast-region] .os-toast > svg { width: 18px; height: 18px; margin-top: 2px; color: var(--toast-tone); }
.os-toast-region[data-toast-region] .os-toast-copy { min-width: 0; overflow-wrap: anywhere; }
.os-toast-region[data-toast-region] .os-toast-copy :is(strong,h2,h3,h4) { display: block; margin: 0 0 2px; color: var(--os-color-ink, #171d32); font: inherit; font-size: 14px; font-weight: 700; line-height: 1.5; }
.os-toast-region[data-toast-region] .os-toast-copy :is(div,p,span,small) { margin: 0; color: var(--os-color-text-secondary, #727e98); font: inherit; font-size: 14px; line-height: 1.5; }
.os-toast-region[data-toast-region] .os-toast-copy a { color: var(--os-color-primary, #5746ed); text-decoration: underline; text-underline-offset: 2px; }
.os-toast-region[data-toast-region] .os-toast-close { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; margin: -3px -7px 0 0; border: 0; border-radius: 6px; color: var(--os-color-text-muted, #8993a9); background: transparent; cursor: pointer; }
.os-toast-region[data-toast-region] .os-toast-close svg { width: 18px; height: 18px; }
.os-toast-region[data-toast-region] .os-toast-close:hover { color: var(--os-color-ink, #171d32); background: var(--os-color-hover, #f4f5f8); }
.os-toast-region[data-toast-region] :is(button,a):focus-visible { outline: 2px solid var(--os-color-primary, #5746ed); outline-offset: 3px; }
.os-toast-region[data-toast-region] .os-toast.is-leaving { animation: os-toast-leave .18s ease-in both; }
@keyframes os-toast-enter { from { opacity: 0; transform: translate3d(12px,-4px,0); } to { opacity: 1; transform: translate3d(0,0,0); } }
@keyframes os-toast-leave { to { opacity: 0; transform: translate3d(12px,0,0); } }
@media (max-width: 600px) {
    .os-toast-region[data-toast-region] { top: max(14px, env(safe-area-inset-top)); right: max(14px, env(safe-area-inset-right)); max-height: calc(100dvh - 28px); }
}
@media (prefers-reduced-motion: reduce) { .os-toast-region[data-toast-region] .os-toast, .os-toast-region[data-toast-region] .os-toast.is-leaving { animation: none; } }
