:root {
    --dark-bg: #0a0a0a;
    --card-bg: #111111;
    --border-color: #2a2a2a;
    --text-color: #e5e5e5;
    --text-muted: #888888;

    --ps-blue: #555555;
    --xbox-green: #555555;
    --dualsense-purple: #555555;

    --widget-accent: #aaaaaa;
    --widget-success: #888888;
    --widget-warn: #999999;
    --widget-error: #666666;
}

.tab-btn.active-dualsense {
    border-color: var(--dualsense-purple);
    background-color: rgba(85, 85, 85, 0.08);
    box-shadow: 0 0 15px rgba(85, 85, 85, 0.15);
}
.tab-btn.active-playstation {
    border-color: var(--ps-blue);
    background-color: rgba(85, 85, 85, 0.08);
    box-shadow: 0 0 15px rgba(85, 85, 85, 0.15);
}
.tab-btn.active-xbox {
    border-color: var(--xbox-green);
    background-color: rgba(85, 85, 85, 0.08);
    box-shadow: 0 0 15px rgba(85, 85, 85, 0.15);
}

canvas.radar-canvas {
    width: 100%;
    max-width: 240px;
    aspect-ratio: 1;
    background: rgba(0,0,0,0.6);
    border-radius: 50%;
}
canvas.osc-canvas {
    width: 100%;
    height: 45px;
    background: #0a0a0a;
    border: 1px solid #222222;
    margin-top: 8px;
    border-radius: 3px;
}