*, *::before, *::after { box-sizing: border-box; }

:root {
    --bg-color: #121212;
    --surface-color: #1e1e1e;
    --primary-text-color: #e0e0e0;
    --secondary-text-color: #a0a0a0;
    --accent-color: #bb86fc;
}

body {
    margin: 0;
    padding-bottom: 120px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.6;
    background-color: var(--bg-color);
    color: var(--primary-text-color);
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.main-content { padding: 2rem 0; }
h1 { margin-bottom: 2rem; text-align: center; color: #ffffff; }

.centered-text { text-align: center; margin-top: 1rem; }
.centered-text a { color: var(--accent-color); font-weight: bold; }

.alert { 
    padding: 1rem; 
    margin-bottom: 1rem; 
    border: 1px solid transparent; 
    border-radius: 4px; 
    text-align: center; 
}
.alert.success { color: #c3e6cb; background-color: #28a745; border-color: #1c7430; }
.alert.error { color: #f5c6cb; background-color: #dc3545; border-color: #b21f2d; }

.text-center { text-align: center; }