body {
    background-color: #020617; /* slate-950 */
    overflow: hidden;
}

/* Glassmorphism panel (darker for dark mode) */
.glass-panel {
    background: rgba(15, 23, 42, 0.85); /* darker slate-900-ish */
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* Input autofill for dark mode: avoid bright white background */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #020617 inset !important; /* matches body bg */
    -webkit-text-fill-color: #f8fafc !important;           /* slate-50 */
    transition: background-color 5000s ease-in-out 0s;
}

/* Toast notification */
.toast {
    visibility: hidden;
    min-width: 280px;
    color: #f8fafc;
    text-align: center;
    border-radius: 10px;
    padding: 14px 18px;
    position: fixed;
    z-index: 50;
    left: 50%;
    bottom: 30px;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.25s ease, bottom 0.25s ease;
    box-shadow: 0 12px 24px -10px rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
}

.toast.show {
    visibility: visible;
    opacity: 1;
    bottom: 50px;
}

.toast.success {
    border-left: 4px solid #10b981; /* emerald-500 */
    background: linear-gradient(to right, rgba(6, 78, 59, 0.95), rgba(6, 95, 70, 0.9)); /* dark emerald */
}

.toast.error {
    border-left: 4px solid #ef4444; /* red-500 */
    background: linear-gradient(to right, rgba(69, 10, 10, 0.95), rgba(88, 28, 28, 0.9)); /* dark red */
}

/* Animation delays for blobs */
.animation-delay-2000 {
    animation-delay: 2s;
}

.animation-delay-4000 {
    animation-delay: 4s;
}