:root {
  --sidebar-w: 260px;
  --gold: #c9a227;
  --ink: #1c1917;
  --panel: #ffffff;
  --muted: #78716c;
  --bg: linear-gradient(145deg, #f5f0e6 0%, #e7eef5 45%, #f8fafc 100%);
  --sidebar-bg: #1a2332;
}
html[data-bs-theme="dark"] {
  --panel: #1e293b;
  --ink: #e2e8f0;
  --muted: #94a3b8;
  --bg: linear-gradient(145deg, #0f172a 0%, #1e293b 50%, #0b1220 100%);
  --sidebar-bg: #0b1220;
}
body { margin: 0; font-family: "Segoe UI", "Candara", sans-serif; background: var(--bg); color: var(--ink); min-height: 100vh; }
.app-shell { display: flex; min-height: 100vh; }
.sidebar { width: var(--sidebar-w); background: var(--sidebar-bg); color: #cbd5e1; position: sticky; top: 0; height: 100vh; padding: 1rem .75rem; transition: margin .2s; }
.sidebar .brand { font-size: 1.35rem; font-weight: 700; color: var(--gold); letter-spacing: .02em; padding: .75rem .85rem 1.25rem; }
.sidebar .nav-link { color: #94a3b8; border-radius: .5rem; padding: .65rem .85rem; margin-bottom: .2rem; display: flex; gap: .6rem; align-items: center; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { background: rgba(201,162,39,.15); color: #f8fafc; }
.main { flex: 1; min-width: 0; }
.topbar { display: flex; align-items: center; gap: .75rem; padding: .85rem 1.25rem; background: color-mix(in srgb, var(--panel) 88%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(0,0,0,.06); position: sticky; top: 0; z-index: 20; }
.content { padding: 1.25rem; position: relative; }
.user-chip { font-size: .9rem; color: var(--muted); }
.kpi { background: var(--panel); border-radius: 1rem; padding: 1.1rem 1.2rem; box-shadow: 0 8px 24px rgba(15,23,42,.06); border: 1px solid rgba(15,23,42,.05); }
.kpi .label { color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.kpi .value { font-size: 1.55rem; font-weight: 700; margin-top: .25rem; }
.card-panel { background: var(--panel); border-radius: 1rem; padding: 1.25rem; border: 1px solid rgba(15,23,42,.05); box-shadow: 0 8px 24px rgba(15,23,42,.05); }
.global-loader { position: absolute; inset: 0; background: rgba(255,255,255,.45); display: flex; align-items: center; justify-content: center; z-index: 50; }
html[data-bs-theme="dark"] .global-loader { background: rgba(0,0,0,.35); }
.login-wrap { min-height: 100vh; display: grid; place-items: center; background: radial-gradient(circle at 20% 20%, #c9a22733, transparent 40%), radial-gradient(circle at 80% 0%, #1a233255, transparent 35%), var(--bg); }
.login-card { width: min(420px, 92vw); background: var(--panel); border-radius: 1.25rem; padding: 2rem; box-shadow: 0 20px 50px rgba(0,0,0,.12); }
.login-card h1 { font-size: 1.75rem; font-weight: 800; color: var(--gold); margin-bottom: .25rem; }
@media (max-width: 992px) {
  .sidebar { position: fixed; z-index: 40; margin-left: calc(var(--sidebar-w) * -1); }
  .sidebar.open { margin-left: 0; }
}
@media print {
  .sidebar, .topbar, .no-print { display: none !important; }
  .main { width: 100%; }
}