:root {
    --bg: rgb(250, 236, 237);
    --card-bg: rgba(255, 255, 255, 0.96);
    --card-border: #e5e7eb;
    --text: #2d2a2a;
    --muted: #6b6767;
    --accent: rgb(208, 44, 42);
    --shadow: 0 12px 35px rgba(0, 0, 0, 0.12);
}

* { box-sizing: border-box; }

body {
    background: var(--bg);
    color: var(--text);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.card {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    box-shadow: var(--shadow);
    backdrop-filter: blur(4px);
}

.accent { color: var(--accent); }
.spinner-border { width: 3rem; height: 3rem; color: var(--accent); border-color: var(--accent); border-right-color: transparent; }
.spinner-border.text-info { color: var(--accent) !important; border-color: var(--accent) !important; border-right-color: transparent !important; }
.attempts { font-variant-numeric: tabular-nums; }
.form-text, .text-secondary { color: var(--muted) !important; }
.alert { border: 1px solid var(--card-border); }

.btn-primary {
    background-color: var(--accent);
    border-color: var(--accent);
    color: #fff;
    font-weight: 600;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #b51f1e;
    border-color: #b51f1e;
    color: #fff;
}

#statusText { color: var(--text); }