:root {
    --primary: #7e4af2;
    --primary-text: #141413;

    --premium-text: #8b5cf633;

    --success-text: #10b981;
    --success-text-alt: #34d399;
    --warning-text: #f59e0b;
    --warning-text-alt: #fbbf24;
    --error-text: #ef4444;
    --error-text-alt: #fca5a5;

    --bg: #fdfcf8;
    --bg-alt: #fdfcf8c9;
    --text: #334155;
    --surface: #ffffff;
    --surface-alt: #f1f5f9;
    --face: #839dd2;
    --border: #e2e8f0;
    --muted: #64748b;
}

body {
    background: var(--bg) url("/res/gfx/bg.day.png") top center repeat;
    animation: scrollUp 10s linear infinite;
}

header.loggedin .logo,
header .name img.logo {
    filter: invert(50%) sepia(1) hue-rotate(205deg) saturate(10) brightness(90%);
}

@keyframes scrollUp {
    from {
        background-position: center 0;
    }
    to {
        background-position: center 360px;
    }
}