:root {
    --primary: #FF2A2A;
    --secondary: #6C63FF;
    --success: #29F0B4;
    --info: #00CFFF;
    --warning: #FF9900;
    --danger: #FF0044;
    --light: #1C1C1C;
    --dark: #0A0A0A;
    --bg: #0A0A0A;
    --card-bg: #1C1C1C;
    --border: #2a2a2a;
    --border-glow: #FF2A2A33;
    --text: #E0E0E0;
    --text-muted: #888888;
    --hover: #252525;
    --link: #FF2A2A;
    --link-hover: #FF6600;
}

body {
    background: var(--bg);
    color: var(--text);
}

.navbar {
    background: var(--primary);
}

.nav-menu {
    background: var(--card-bg);
    border-bottom: 1px solid var(--border);
}

.nav-menu a {
    color: var(--text);
}

.nav-menu a:hover,
.nav-menu a.active {
    background: var(--primary);
    color: #fff;
}

.card {
    background: var(--card-bg);
    border: 1px solid var(--border);
    box-shadow: 0 0 20px rgba(255, 61, 0, 0.15);
}

.btn {
    background: var(--primary);
    color: #fff;
    border: 1px solid var(--primary);
}

.btn:hover {
    background: var(--primary-dark);
    border-color: var(--primary-dark);
}

.btn-secondary {
    background: var(--card-bg);
    color: var(--text);
    border: 1px solid var(--border);
}

.btn-secondary:hover {
    background: var(--hover);
}

.list-item {
    border-bottom: 1px solid var(--border);
}

nav[role="navigation"] a,
nav[role="navigation"] span {
    border: 1px solid var(--border);
    color: var(--text);
}

nav[role="navigation"] a:hover {
    background: var(--hover);
    border-color: var(--primary);
    color: var(--primary);
}

nav[role="navigation"] span[aria-current="page"] {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

nav[role="navigation"] span[aria-disabled="true"] {
    color: var(--text-muted);
    border-color: var(--border);
}