:root {
    --app-bg: #f4f7fb;
    --app-primary: #315efb;
    --app-text: #182230;
    --app-muted: #667085;
    --app-border: #e7ecf3;
}

body {
    min-height: 100vh;
    background: var(--app-bg);
    color: var(--app-text);
    font-size: .94rem;
}

.app-navbar {
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid var(--app-border);
    backdrop-filter: blur(12px);
}

.brand-mark {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: linear-gradient(135deg, #315efb, #6e56cf);
    color: #fff;
    box-shadow: 0 8px 18px rgba(49, 94, 251, .22);
}

.page-title { font-size: 1.45rem; font-weight: 750; letter-spacing: -.02em; }
.page-subtitle { color: var(--app-muted); }

.card-soft {
    border: 1px solid var(--app-border);
    border-radius: 18px;
    box-shadow: 0 8px 30px rgba(16, 24, 40, .045);
}

.stat-card {
    min-height: 116px;
    overflow: hidden;
    position: relative;
}
.stat-icon {
    width: 42px;
    height: 42px;
    border-radius: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef3ff;
    color: var(--app-primary);
    font-size: 1.15rem;
}
.stat-label { color: var(--app-muted); font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.stat-value { font-size: 1.35rem; font-weight: 750; }

.form-control, .form-select {
    border-color: #dbe2ea;
    min-height: 42px;
    border-radius: 11px;
}
.form-control:focus, .form-select:focus {
    border-color: #8aa4ff;
    box-shadow: 0 0 0 .22rem rgba(49, 94, 251, .10);
}
.btn { border-radius: 10px; font-weight: 600; }
.btn-primary { background: var(--app-primary); border-color: var(--app-primary); }

.table > :not(caption) > * > * { padding: .85rem .8rem; border-bottom-color: #edf0f5; }
.table thead th { color: #475467; font-size: .78rem; text-transform: uppercase; letter-spacing: .035em; white-space: nowrap; background: #f8fafc; }
.table tbody tr:hover { background: #fafcff; }
.badge { font-weight: 650; letter-spacing: .01em; padding: .5em .65em; }

.evidence-preview {
    width: 100%;
    height: 280px;
    object-fit: contain;
    background: #f8fafc;
    border-radius: 12px;
}

.empty-state { padding: 3.5rem 1rem; color: var(--app-muted); text-align: center; }
.empty-state i { font-size: 2rem; display: block; margin-bottom: .75rem; color: #98a2b3; }

.login-shell {
    min-height: 100vh;
    background:
        radial-gradient(circle at 15% 15%, rgba(72, 98, 255, .24), transparent 28%),
        radial-gradient(circle at 90% 80%, rgba(126, 87, 194, .22), transparent 30%),
        #101828;
}
.login-card { border: 0; border-radius: 22px; box-shadow: 0 30px 80px rgba(0,0,0,.25); }

@media (max-width: 767.98px) {
    .table-responsive { border-radius: 14px; }
    .page-title { font-size: 1.25rem; }
}