:root {
    --bg-main: #060606;
    --bg-panel: #0d0d0d;
    --border-color: #1a1a1a;
    --text-main: #e5e5e5;
    --text-muted: #737373;
    --gold: #8e04ff;
    --gold-hover: #7303d4;
    --gold-glow: rgba(142, 4, 255, 0.4);
}

* {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent; /* Verhindert Blitzen beim Antippen auf iOS */
}

/* Custom WebKit scrollbars */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
    background: rgba(142, 4, 255, 0.35);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
    background: rgba(142, 4, 255, 0.65);
}

html {
    scrollbar-width: thin;
    scrollbar-color: rgba(142, 4, 255, 0.35) rgba(255, 255, 255, 0.03);
    scroll-behavior: smooth;
    overflow-y: scroll;
}

/* --- GLOBAL ANIMATIONS --- */
@-webkit-keyframes popIn {
    from {
        -webkit-transform: translateY(18px) scale(0.98);
        transform: translateY(18px) scale(0.98);
        opacity: 0;
    }
    to {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
        opacity: 1;
    }
}

@keyframes popIn {
    from {
        -webkit-transform: translateY(18px) scale(0.98);
        transform: translateY(18px) scale(0.98);
        opacity: 0;
    }
    to {
        -webkit-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
        opacity: 1;
    }
}

@-webkit-keyframes fadeInUp {
    from {
        -webkit-transform: translateY(16px);
        transform: translateY(16px);
        opacity: 0;
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fadeInUp {
    from {
        -webkit-transform: translateY(16px);
        transform: translateY(16px);
        opacity: 0;
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@-webkit-keyframes toastIn {
    from {
        opacity: 0;
        -webkit-transform: translateY(16px);
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes toastIn {
    from {
        opacity: 0;
        -webkit-transform: translateY(16px);
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}