:root {
    --success-container: #006800;
    --on-success-container: #f5fcf5;

    --primary: rgb(121, 138, 251);
    --primary-variant: rgb(176, 186, 253);
    --on-primary: rgb(244, 244, 255);
    --primary-container: rgb(0, 24, 235);
    --primary-container-hover: rgb(57, 71, 255);
    --on-primary-container: rgb(255 255 255);
    
    --secondary: rgb(18 51 113);
    --on-secondary: rgb(255 255 255);
    --secondary-container: rgb(80 107 172);
    --on-secondary-container: rgb(255 255 255);
    
    --error: rgb(113, 8, 14);
    --on-error: rgb(255 255 255);
    --error-container: rgb(184, 17, 11);
    --on-error-container: rgb(255 255 255);
    
    --surface: rgb(0 0 5);
    --on-surface: rgb(237, 240, 255);
    --surface-variant: rgb(18, 18, 25);
    --on-surface-variant: rgb(135, 140, 159);
    
    --outline: rgb(44, 50, 67);
    --outline-variant: rgb(37, 41, 54);

    --container-lowest: #08080b;
    --container-low: #0f0f12;
    --container: #161622;
    --container-high: #191921;
    --container-highest: #202022;
}