:root{
    --app-bg:#f4f7fb;
    --app-card-radius:16px;
    --app-shadow:0 10px 28px rgba(26,43,78,.08);
}

body{background:var(--app-bg);color:#28334a;font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif}
.navbar{box-shadow:0 3px 14px rgba(8,18,38,.16)}
.navbar-brand{font-weight:650;letter-spacing:.01em}
.card{border:1px solid rgba(31,50,85,.06);border-radius:var(--app-card-radius);box-shadow:var(--app-shadow);background:#fff}
.btn,.form-control,.form-select{border-radius:10px}
.btn{font-weight:550;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible{outline:3px solid rgba(13,110,253,.25);outline-offset:2px}
.form-label{color:#465269;font-weight:600}
.form-control,.form-select{border-color:#d9e0eb}
.form-control:focus,.form-select:focus{border-color:#86b7fe;box-shadow:0 0 0 .22rem rgba(13,110,253,.12)}
.table>:not(caption)>*>*{padding:.78rem .72rem;border-bottom-color:#e9edf3}
.table thead th{color:#657189;font-size:.8rem;white-space:nowrap}
.money{letter-spacing:-.025em}

@media (max-width:575.98px){
    .card.p-4{padding:1rem!important}
    .money{font-size:1.65rem!important}
}

@media (prefers-reduced-motion:reduce){
    .btn{transition:none}
    .btn:hover{transform:none}
}
