body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; display: flex; background: #f8fafc; margin: 0; height: 100vh; color: #334155; }
nav { width: 240px; background: #0f172a; color: #fff; padding: 25px 15px; display: flex; flex-direction: column; flex-shrink: 0; }
nav h2 { border-bottom: 1px solid #1e293b; padding-bottom: 20px; text-align: center; margin-top: 0; font-size: 1.4rem; letter-spacing: 1px; }
nav a { color: #94a3b8; padding: 14px; text-decoration: none; margin-bottom: 8px; border-radius: 8px; transition: all 0.2s; font-weight: 500; display: flex; align-items: center; }
nav a:hover, nav a.active { color: #fff; background: #3b82f6; box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.5); }
main { flex: 1; padding: 40px; overflow-y: auto; }
.card { background: #fff; padding: 30px; margin-bottom: 30px; border-radius: 16px; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); border: 1px solid #e2e8f0; }
h2 { margin-top: 0; color: #0f172a; font-size: 1.5rem; margin-bottom: 20px; }
input, select, button { display: block; margin: 15px 0; padding: 14px; width: 100%; border: 1px solid #cbd5e1; border-radius: 8px; box-sizing: border-box; font-size: 1rem; outline: none; transition: border 0.2s; }
input:focus, select:focus { border-color: #3b82f6; ring: 2px solid #3b82f6; }
button { background: #3b82f6; color: white; border: none; cursor: pointer; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
button:hover { background: #2563eb; transform: translateY(-1px); }
table { width: 100%; border-collapse: separate; border-spacing: 0; margin-top: 10px; }
td, th { padding: 16px; border-bottom: 1px solid #f1f5f9; text-align: left; }
th { color: #64748b; font-weight: 700; font-size: 0.85rem; text-transform: uppercase; background: #f8fafc; border-top: 1px solid #f1f5f9; }
tr:last-child td { border-bottom: none; }
.badge { padding: 6px 12px; border-radius: 99px; background: #e0f2fe; color: #0369a1; font-size: 0.75em; font-weight: 700; }
.row { display: flex; gap: 24px; margin-bottom: 30px; } 
.box { flex: 1; background: #fff; padding: 30px; text-align: center; border-radius: 16px; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); border: 1px solid #e2e8f0; }
.box-val { font-size: 1.8rem; font-weight: 800; margin-top: 10px; }
.box-label { font-size: 0.9rem; color: #64748b; text-transform: uppercase; font-weight: 600; }