* { transition: color 0.35s ease, background-color 0.35s ease, box-shadow 0.35s ease; }
:root {
    --bg-main: #050814;
    --bg-card: #0f1424;
    --text-primary: #ffffff;
    --text-secondary: #a8b2d5;
    --text-light: #7982a8;
    --shadow-card: rgba(120, 150, 255, 0.08);
    --mask-gradient-bottom: rgba(5, 8, 20, 0.92);
    --nav-opacity: 0.75;
}
body.theme-white {
    --bg-main: #f8f6f2;
    --bg-card: #ffffff;
    --text-primary: #2c2c2c;
    --text-secondary: #999999;
    --text-light: #999999;
    --shadow-card: rgba(0, 0, 0, 0.06);
    --mask-gradient-bottom: rgba(255, 255, 255, 0.88);
    --nav-opacity: 0.85;
}
body { background-color: var(--bg-main); color: var(--text-primary); }
.theme-switch {
    position: fixed;
    top: 2rem;
    right: 2.5rem;
    z-index: 999;
    padding: 0.5rem 1.2rem;
    border-radius: 999px;
    border: none;
    font-size: 0.85rem;
    cursor: pointer;
    background: var(--bg-card);
    color: var(--text-primary);
    box-shadow: 0 4px 15px var(--shadow-card);
}
@media screen and (max-width: 768px) {
    .theme-switch {
        right: 1rem;
        top: 1.2rem;
        font-size: 0.75rem;
        padding: 0.4rem 0.9rem;
    }
}