:root {
    --bg1: #090411;
    --bg2: #14091f;
    --bg3: #2a1050;
    --text: #f7efff;
    --muted: #cfb9e7;
    --accent: #8d4cff;
    --accent2: #b97cff;
    --gold: #f1c27a;
    --border: rgba(185, 124, 255, 0.22);
    --shadow: 0 20px 80px rgba(0, 0, 0, 0.45);
}

* {
    box-sizing: border-box;
    min-width: 0;
}

html,
body {
    margin: 0;
    min-height: 100%;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background:
        radial-gradient(circle at 50% 18%, rgba(125, 70, 210, 0.22), transparent 26%),
        radial-gradient(circle at 20% 80%, rgba(90, 50, 160, 0.16), transparent 26%),
        linear-gradient(180deg, var(--bg2) 0%, var(--bg1) 55%, #040208 100%);
    overflow-x: hidden;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at center, transparent 0 48%, rgba(0, 0, 0, 0.28) 100%);
}