:root{--primary: #003087;--primary-strong: #01215f;--bg: #f3f6fb;--card: #ffffff;--text: #1b2940;--muted: #5f708f;--border: #d6e0f1;--ok: #0c8a4a;--danger: #c53434;font-family:Segoe UI,Helvetica Neue,sans-serif;color:var(--text)}*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#f9fbff,#edf3fb)}h1,h2,h3{margin:0}.login-page{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(480px,100%);background:var(--card);border:1px solid var(--border);border-radius:14px;padding:24px;box-shadow:0 20px 40px #00308714}.stack,.stack-lg{display:grid;gap:12px}.stack-lg{gap:20px}.app-shell{min-height:100vh;display:grid;grid-template-columns:260px 1fr}.sidebar{background:linear-gradient(170deg,var(--primary) 0%,#0242b6 100%);color:#fff;padding:20px;display:grid;grid-template-rows:auto 1fr auto;gap:18px}.sidebar .role{margin-top:8px;color:#d7e4ff;font-size:12px;letter-spacing:.04em}.nav-item{width:100%;border:0;background:#ffffff14;color:#fff;padding:12px;margin-bottom:10px;border-radius:10px;text-align:left;cursor:pointer}.nav-item.active{background:#fff;color:var(--primary);font-weight:700}.nav-item.logout{background:#0003}.content{padding:24px}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px}.cards-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.metric-card{display:grid;gap:6px}.metric-card strong{font-size:28px;color:var(--primary)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:12px}.form-grid.compact{grid-template-columns:repeat(3,minmax(140px,1fr))}label{display:grid;gap:6px;font-size:13px}input,select,textarea,button{font:inherit}input,select,textarea{border:1px solid var(--border);border-radius:8px;padding:10px;background:#fff}textarea{min-height:70px;resize:vertical}.btn{border:1px solid var(--border);padding:10px 14px;border-radius:8px;background:#fff;cursor:pointer}.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn.success{background:var(--ok);border-color:var(--ok);color:#fff}.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}.inline{display:flex;align-items:center;gap:8px}.inline-buttons{display:flex;gap:8px}.actions{display:flex;align-items:end}.between{display:flex;justify-content:space-between;align-items:center}.text-muted,.hint{color:var(--muted);font-size:12px}.error,.success{border-radius:8px;padding:10px}.error{background:#ffe8e8;color:#8d1a1a}.success{background:#e7f7ef;color:#0e6b3d}.status{padding:4px 8px;border-radius:999px;font-size:12px;border:1px solid var(--border)}.status.pending-manager-approval,.status.pending-finance-approval,.status.pending{background:#fff8df;color:#8f6b00}.status.approved,.status.manager-approved,.status.finance-approved,.status.approved-for-payout{background:#e8f9ef;color:#1f7c49}.status.rejected{background:#fde9e9;color:#9f2424}table{width:100%;border-collapse:collapse}th,td{border-bottom:1px solid var(--border);padding:10px;text-align:left;font-size:13px;vertical-align:top}@media (max-width: 1024px){.app-shell{grid-template-columns:1fr}.sidebar{grid-template-rows:auto auto auto}.form-grid,.form-grid.compact{grid-template-columns:1fr}}
