:root {
    --app-bg: #f3f6f8;
    --app-ink: #17202a;
    --app-line: #d9e1e7;
    --app-nav: #102b3a;
}

body {
    background: var(--app-bg);
    color: var(--app-ink);
    min-height: 100vh;
}

.app-navbar {
    background: var(--app-nav);
    color: #fff;
    box-shadow: 0 1px 0 rgba(0, 0, 0, .08);
}

.app-navbar .navbar-brand {
    color: #fff;
    font-weight: 700;
}

.app-shell {
    max-width: 1500px;
}

.app-card {
    border: 1px solid var(--app-line);
    border-radius: 14px;
    box-shadow: 0 8px 28px rgba(20, 42, 56, .06);
}

.step-kicker {
    color: #5f7380;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: .35rem;
}

.config-box,
.csv-help {
    background: #eef3f6;
    border: 1px solid var(--app-line);
    border-radius: 10px;
    padding: .8rem .9rem;
}

.config-box span {
    display: inline-block;
    min-width: 58px;
    font-weight: 700;
}

.table-wrap {
    border: 1px solid var(--app-line);
    border-radius: 10px;
}

.table thead th {
    background: #eaf0f4;
    color: #263945;
    border-bottom-width: 1px;
    white-space: nowrap;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.table tbody td {
    border-color: #e7ecef;
}

.btn {
    border-radius: 9px;
    font-weight: 650;
}

.form-control {
    border-color: #cbd6dc;
    border-radius: 9px;
}

code {
    color: #a43d00;
}

@media (max-width: 767.98px) {
    .app-shell {
        padding-left: 14px;
        padding-right: 14px;
    }

    .app-card {
        border-radius: 10px;
    }
}
