:root {
    --ink: #232a3b;
    --ink-muted: #5c6473;
    --bg: #fdfdfd;
    --surface: #ffffff;
    --border: #e3e5ea;
    --primary: #008ec3;
    --primary-soft: #66BBDB;
    --primary-softer: #E0F1F8;
    --gold: #b8863a;
}

body {
    margin: 0;
    font-family: 'Source Sans 3', system-ui, sans-serif;
    background: var(--bg);
    color: var(--ink);
    overflow-x: hidden;
}

h1, h2, h3, .font-serif {
    font-family: 'Merriweather', Georgia, serif;
}

a {
    color: var(--primary);
    text-decoration: none;
}

a:hover {
    color: var(--gold);
    text-decoration: underline;
}

.hover-card {
    transition: transform .15s ease, box-shadow .15s ease;
}

.hover-card:hover {
    transform: translateY(-3px);
}

.navbar {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--border) !important;
}

.nav-link {
    color: var(--ink) !important;
    font-size: .92rem;
}

.nav-link.active-view {
    color: #fff !important;
    background: var(--primary);
    border-radius: 999px;
}

.nav-item .btn.active {
    color: #fff !important;
    background: var(--primary);
}

.badge-soft {
    background: var(--primary-soft);
    color: var(--surface);
    font-weight: 600;
}

.badge-primary-solid {
    background: var(--primary);
    color: #fff;
}

.badge-gold-solid {
    background: var(--gold);
    color: #fff;
}

.muted {
    color: var(--ink-muted);
}

.card-surface {
    background: var(--surface);
    border: 1px solid var(--border) !important;
}

.hero-band {
    background: linear-gradient(180deg, var(--primary-soft), var(--bg));
}

.stats-band {
    background: var(--primary-softer);
}

.search-wrap {
    background: var(--surface);
    border: 1px solid var(--border);
}

.search-wrap input {
    background: transparent;
    color: var(--ink);
}

.search-wrap input::placeholder {
    color: var(--ink-muted);
}

.table thead th {
    color: var(--ink);
    text-transform: uppercase;
    background: var(--primary-soft);
}

.table td {
    color: var(--ink);
    border-color: var(--border);
}

footer {
    background: var(--surface);
    border-top: 1px solid var(--border);
}

.theme-btn {
    width: 34px;
    height: 34px;
    background: var(--primary-soft);
    color: var(--primary);
    border: none;
}

.logo-box {
    width: 38px;
    height: 38px;
    background: var(--primary);
    color: #fff;
}

.hdrifpt {
    background-color: #414042;
}

.hdrifpt .btn {
    font-weight: bold;
}

.hdrifpt .btn:hover {
    text-decoration: none
}

.btn:hover {
    text-decoration: none;
}

.nav a.nav-link {
    margin: 0 5px;
}

.nav a.nav-link.active {
    background-color: var(--primary) !important;
    color: #fff !important;
    text-decoration: none;
}

.nav .nav-item a.nav-link:hover {
    background-color: var(--primary-soft);
    color: var(--surface);
    text-decoration: none;
}

#page-loader.hide { opacity:0; visibility:hidden; transition:opacity .25s ease; }

.truncate {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}