:root {
    --primary-color: #00a8ff;
    --secondary-color: #0097e6;
    --accent-color: #7bed9f;
    --dark-bg: #0a1930;
    --card-bg: rgba(13, 25, 42, 0.7);
    --glow-color: rgba(0, 168, 255, 0.5);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', 'Arial', sans-serif;
}

body {
    background: linear-gradient(135deg, var(--dark-bg) 0%, #152642 100%);
    color: #fff;
    min-height: 100vh;
    padding: 20px;
    position: relative;
    overflow-x: hidden;
}

body::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(circle at 10% 20%, rgba(0, 168, 255, 0.1) 0%, transparent 20%),
        radial-gradient(circle at 90% 80%, rgba(123, 237, 159, 0.1) 0%, transparent 20%);
    z-index: -1;
}