:root {
    --brand-red: #cc3333;
    --brand-red-dark: #330000;
    --brand-red-deep: #160000;
    --brand-gray: #919fa4;
    --brand-black: #000000;
    --card-bg: #1a1a1a;
    --text-primary: #ffffff;
    --text-secondary: var(--brand-gray);
    --accent-color: var(--brand-red);
    --dark-bg: var(--brand-black);
    --surface: rgba(26, 26, 26, .82);
    --surface-solid: #151515;
    --border-red: rgba(204, 51, 51, .28);
    --shadow-red: rgba(204, 51, 51, .32);
    --container: min(var(--container-max, 1240px), calc(100% - 7rem));
}

@media(max-width: 1040px) {
    :root {
        --container: min(100% - 3rem, 1040px);
    }
}

@media(max-width: 640px) {
    :root {
        --container: min(100% - 2rem, 640px);
    }
}