.sy-toast-stack {
    position: fixed;
    z-index: 10000;
    inset-block-start: max(24px, env(safe-area-inset-top));
    inset-inline-end: max(24px, env(safe-area-inset-right));
    width: min(420px, calc(100vw - 32px));
    display: grid;
    gap: 12px;
    pointer-events: none;
    font-family: var(--sy-font, "Noto Sans Thai", sans-serif);
    font-size: 15px;
    font-weight: var(--sy-control-font-weight, 400);
    line-height: 1.6;
}
.sy-toast {
    --toast-color: #2455a4;
    --toast-icon: #3569db;
    --toast-background: #f2f6ff;
    --toast-border: #c4d3f1;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    padding: 10px;
    color: var(--toast-color);
    background: var(--toast-background);
    border: 1px solid var(--toast-border);
    border-radius: var(--sy-radius, 8px);
    box-shadow: 0 3px 12px rgb(4 34 62 / 8%);
    pointer-events: auto;
    animation: sy-toast-enter 160ms ease-out;
}
.sy-toast--error {
    --toast-color: #a93624;
    --toast-icon: #e45432;
    --toast-background: #fff1ed;
    --toast-border: #efb7a9;
}
.sy-toast--warning {
    --toast-color: #856015;
    --toast-icon: #d9951d;
    --toast-background: #fffaeb;
    --toast-border: #e8cf92;
}
.sy-toast--success {
    --toast-color: #346927;
    --toast-icon: #589a37;
    --toast-background: #f1f8ed;
    --toast-border: #b7d6a5;
}
.sy-toast__icon {
    display: grid;
    place-items: center;
    flex: 0 0 24px;
    height: 24px;
    color: var(--toast-color);
}
.sy-toast__icon svg { width: 24px; height: 24px; }
.sy-toast__icon svg path[stroke] { stroke: var(--toast-background); }
.sy-toast__message { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.sy-toast__close {
    display: grid;
    place-items: center;
    flex: 0 0 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    color: inherit;
    border: 0;
    border-inline-start: 1px solid var(--toast-border);
    border-radius: 0 5px 5px 0;
    cursor: pointer;
}
.sy-toast__close:hover { background: color-mix(in srgb, var(--toast-icon) 10%, transparent); }
.sy-toast__close:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
.sy-toast__close svg { width: 18px; height: 18px; }
@keyframes sy-toast-enter {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 600px) {
    .sy-toast-stack { inset-block-start: max(12px, env(safe-area-inset-top)); inset-inline-end: 16px; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { .sy-toast { animation: none; } }