:root {
    --ink: #17202a;
    --steel: #26313d;
    --accent: #d94f27;
    --soft: #f4f6f8;
    --line: #dfe5ea;
}

body {
    background: var(--soft);
    color: var(--ink);
    font-size: 15px;
}

.app-nav {
    background: linear-gradient(90deg, #1f2933, #34414f);
}

.page-title {
    font-weight: 700;
    letter-spacing: 0;
}

.stat-card,
.panel,
.table-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(23, 32, 42, 0.04);
}

.stat-card {
    padding: 18px;
}

.stat-card .label {
    color: #66717d;
    font-size: 13px;
}

.stat-card .value {
    font-size: 28px;
    font-weight: 800;
}

.btn-primary {
    background: var(--accent);
    border-color: var(--accent);
}

.btn-primary:hover {
    background: #c34521;
    border-color: #c34521;
}

.badge-soft {
    background: #eef2f5;
    color: #34414f;
}

.form-label {
    font-weight: 600;
}

.table > :not(caption) > * > * {
    vertical-align: middle;
}

.mobile-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

@media (max-width: 768px) {
    .stat-card .value {
        font-size: 23px;
    }

    .table-responsive {
        font-size: 14px;
    }

    .mobile-actions .btn {
        flex: 1 1 auto;
    }
}