/* CSS Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* CSS Variables */
:root {
    /* Layout */
    --navbar-height: 72px;
    --container-width: 1200px;
    --container-padding: 24px;
    --content-spacing: 20px;

    /* Colors */
    --bg-primary: #050505;
    --bg-secondary: #111114;
    --bg-tertiary: #1a1a1f;
    --bg-card: #141418;
    --text-primary: #f0f0f0;
    --text-secondary: #888899;
    --text-muted: #444455;
    --border-color: #222228;
    --border-subtle: #1a1a20;

    /* Accent — a warm ember red, fits civic energy without Twitter blue */
    --accent-color: #c0392b;
    --accent-hover: #a93226;
    --accent-glow: rgba(192, 57, 43, 0.18);

    /* Gold highlight for numbers / premium */
    --gold: #c9a84c;
    --gold-dim: rgba(201, 168, 76, 0.12);

    --error-color: #f4212e;
}

/* Base styles */
html, body {
    height: 100%;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

a {
    text-decoration: none;
    color: inherit;
}

/* Form element resets */
input, textarea, select {
    font: inherit;
    color: inherit;
    background: none;
    border: none;
}