html, body { height: 100%; }
body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; background:#0f172a; color:#e5e7eb; }
.main { min-height: 100vh; }
.card { background:#1f2937; border-radius:10px; padding:14px 16px; box-shadow: 0 6px 16px rgba(0,0,0,.25); border:1px solid #293548; }
.badge { display:inline-block; border-radius:6px; padding:2px 8px; font-size:12px; }

.branding-bar {
    background: linear-gradient(90deg, rgba(15,23,42,0.95), rgba(30,64,175,0.9));
    border-bottom: 1px solid rgba(148,163,184,0.3);
    box-shadow: 0 4px 12px rgba(2,6,23,0.6);
}

.branding-content {
    max-width: 1440px;
    margin: 0 auto;
    padding: 18px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.brand-left {
    display:flex;
    align-items:center;
    gap:14px;
}

.brand-logo {
    width:56px;
    height:56px;
    object-fit:contain;
    border-radius:14px;
    border:1px solid rgba(148,163,184,0.4);
    background:rgba(15,23,42,0.6);
    padding:8px;
}

.brand-text {
    display:flex;
    flex-direction:column;
    gap:4px;
}

.brand-name {
    font-size:1.5rem;
    font-weight:800;
    color:#f8fafc;
}

.brand-tagline {
    font-size:0.85rem;
    color:#cbd5f5;
    letter-spacing:0.06em;
    font-weight:600;
}

.brand-pill {
    padding:8px 18px;
    border-radius:999px;
    border:1px solid rgba(191,219,254,0.5);
    color:#bfdbfe;
    font-size:0.85rem;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
    background:rgba(15,23,42,0.4);
}

/* Dashboard KPI */
.kpi { background: linear-gradient(135deg,#1f2937,#0f172a); border:1px solid #233044; }
.kpi .value { font-size:28px; font-weight:800; }
.kpi .label { font-size:12px; opacity:.9 }

/* Table */
.table thead th { font-size:12px; color:#cbd5e1; letter-spacing:.2px; }
.table tbody tr { transition: background-color .15s ease; }
.table tbody tr:hover { background: rgba(59,130,246,.08); }
.table td { vertical-align: middle; }
.sticky-head { position: sticky; top: 0; z-index: 2; }

/* Progress */
.progress { height:8px; background:#4b5563; border-radius:8px; overflow:hidden }
.progress-bar { background:#3b82f6 }

/* Utilities */
.text-dim { color:#9ca3af }
.pill { padding:2px 10px; border-radius:999px; font-size:12px }
.pill-blue { background:#2563eb }
.pill-red { background:#ef4444 }
.pill-green { background:#22c55e }
.pill-yellow { background:#eab308 }


