:root {
    --bg: #fafafa;
    --surface: #ffffff;
    --border: #e4e4e7;
    --txt-main: #18181b;
    --txt-sub: #71717a;
    --txt-muted: #a1a1aa;
    --glass-bg: rgba(250, 250, 250, 0.85);
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #09090b;
        --surface: #121214;
        --border: #27272a;
        --txt-main: #f4f4f5;
        --txt-sub: #a1a1aa;
        --txt-muted: #52525b;
        --glass-bg: rgba(9, 9, 11, 0.85);
    }
}

body {
    background-color: var(--bg);
    color: var(--txt-main);
}

.glass {
    background: var(--glass-bg);
    border-bottom: 1px solid var(--border);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.fade-in {
    animation: fadeIn 0.4s ease-in-out forwards;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Typography Overrides */
.prose-custom p {
    line-height: 1.75;
    margin-bottom: 1.25em;
}