#tkToastContainer,
.tk-toast-container {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 999999;
    display: flex;
    flex-direction: column-reverse;
    gap: 10px;
    max-height: calc(100vh - 40px);
    pointer-events: none;
}

.tk-toast-container .tk-toast {
    --tk-accent: #2563EB;
    --tk-icon: #1D4ED8;
    --tk-progress: linear-gradient(90deg, #3B82F6, #2563EB);
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 372px;
    max-width: calc(100vw - 32px);
    padding: 12px 12px 14px 18px;
    overflow: hidden;
    background: #E9F1FE;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(37, 99, 235, .22);
    border-radius: var(--radius-xl, .75rem);
    box-shadow: 0 12px 28px -8px rgba(16, 24, 40, .18), 0 4px 10px -4px rgba(16, 24, 40, .10);
    font-family: inherit;
    pointer-events: auto;
    animation: tk-toast-in 320ms cubic-bezier(.21, 1.02, .73, 1) both;
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.tk-toast-container .tk-toast--success { --tk-accent: #16A34A; --tk-icon: #15803D; --tk-progress: linear-gradient(90deg, #22C55E, #16A34A); background: #E7F8EE; border-color: rgba(22, 163, 74, .22); }
.tk-toast-container .tk-toast--warning { --tk-accent: #F59E0B; --tk-icon: #B45309; --tk-progress: linear-gradient(90deg, #FBBF24, #F59E0B); background: #FFF6DF; border-color: rgba(245, 158, 11, .26); }
.tk-toast-container .tk-toast--error { --tk-accent: #DC2626; --tk-icon: #B91C1C; --tk-progress: linear-gradient(90deg, #EF4444, #DC2626); background: #FDECEC; border-color: rgba(220, 38, 38, .22); }
.tk-toast-container .tk-toast--info { --tk-accent: #2563EB; --tk-icon: #1D4ED8; --tk-progress: linear-gradient(90deg, #3B82F6, #2563EB); background: #E9F1FE; border-color: rgba(37, 99, 235, .22); }

.tk-toast-container .tk-toast:hover,
.tk-toast-container .tk-toast:focus-within {
    transform: translateY(-2px);
    box-shadow: 0 16px 32px -8px rgba(16, 24, 40, .24), 0 6px 12px -4px rgba(16, 24, 40, .12);
}
.tk-toast-container .tk-toast:hover .tk-toast__progress-bar,
.tk-toast-container .tk-toast:focus-within .tk-toast__progress-bar { animation-play-state: paused; }

.tk-toast-container .tk-toast__accent { position: absolute; top: 0; bottom: 0; left: 0; width: 4px; background: var(--tk-accent); }
.tk-toast-container .tk-toast__icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 30px;
    height: 30px;
    color: var(--tk-icon);
    background: #FFFFFF;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .10);
    animation: tk-toast-icon-pop 380ms 60ms cubic-bezier(.2, 1.4, .4, 1) both;
}
.tk-toast-container .tk-toast__icon svg { width: 17px; height: 17px; }
.tk-toast-container .tk-toast__body { min-width: 0; flex: 1 1 auto; padding-top: 1px; }
.tk-toast-container .tk-toast__title { margin-bottom: 2px; color: #111827; font-size: 13px; font-weight: 700; line-height: 1.3; }
.tk-toast-container .tk-toast__message { color: #374151; font-size: 12.5px; font-weight: 500; line-height: 1.55; overflow-wrap: anywhere; }
.tk-toast-container .tk-toast__close { width: 22px; height: 22px; padding: 0; color: #9CA3AF; background: transparent; border: 0; border-radius: 6px; opacity: .55; cursor: pointer; }
.tk-toast-container .tk-toast__close:hover { color: #111827; background: rgba(17, 24, 39, .07); opacity: 1; }
.tk-toast-container .tk-toast__close:focus-visible { outline: 2px solid var(--primary, #ff7043); outline-offset: 1px; }
.tk-toast-container .tk-toast__close svg { width: 14px; height: 14px; }
.tk-toast-container .tk-toast__progress { position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: rgba(17, 24, 39, .09); }
.tk-toast-container .tk-toast__progress-bar { display: block; width: 100%; height: 100%; transform-origin: left; background: var(--tk-progress); animation: tk-toast-progress var(--tk-duration, 5000ms) linear forwards; }
.tk-toast-container .tk-toast--bump { animation: tk-toast-bump 400ms ease both; }
.tk-toast-container .tk-toast--out { animation: tk-toast-out 220ms ease-in forwards; }
.tk-toast-container .tk-toast--out .tk-toast__progress-bar { animation-play-state: paused; }
.tk-toast-container .tk-toast--dragging { transition: none; cursor: grabbing; }

@keyframes tk-toast-in { from { transform: translateX(115%) scale(.96); opacity: 0; } to { transform: translateX(0) scale(1); opacity: 1; } }
@keyframes tk-toast-out { to { transform: translateX(115%); opacity: 0; } }
@keyframes tk-toast-icon-pop { 0% { transform: scale(.5); } 70% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes tk-toast-progress { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@keyframes tk-toast-bump { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }

@media (prefers-reduced-motion: reduce) {
    .tk-toast-container .tk-toast { animation: tk-toast-fade 180ms ease both; transition: none; }
    .tk-toast-container .tk-toast--bump { animation: tk-toast-fade 180ms ease both; }
    .tk-toast-container .tk-toast--out { animation: tk-toast-fade-out 180ms ease forwards; }
}
@keyframes tk-toast-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes tk-toast-fade-out { from { opacity: 1; } to { opacity: 0; } }

@media (max-width: 576px) {
    #tkToastContainer, .tk-toast-container { right: 12px; bottom: 12px; left: 12px; }
    .tk-toast-container .tk-toast { width: auto; max-width: none; }
}