:root {
    --color-bg: #e8edf5;
    --color-card-bg: #ffffff;
    --color-fg: #212529;
    --color-primary: #0d6efd;
    --color-navbar: #1a3a5c;
    --color-accent: #6c757d;
}

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

.app-navbar {
    background-color: var(--color-navbar) !important;
}

.timeline-card {
    background-color: var(--color-card-bg);
    border: none;
    box-shadow: 0 .125rem .5rem rgba(0, 0, 0, .08);
    transition: box-shadow .15s ease, transform .15s ease;
}

.timeline-card:hover {
    box-shadow: 0 .5rem 1.25rem rgba(0, 0, 0, .1) !important;
    transform: translateY(-2px);
}

.timeline-card .card-title-link {
    color: var(--color-fg);
}

.timeline-card .card-title-link:hover {
    color: var(--color-primary);
}

.feed-avatar {
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    font-size: .8rem;
}