body { font-family: 'Plus Jakarta Sans', sans-serif; }
.app-shell { min-height: 100vh; background: #f8fafc; color: #1e293b; }
.card { background: white; border: 1px solid #cbd5e1; border-radius: 1.25rem; box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04); }
.nav-link { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; border: 1px solid transparent; border-radius: .75rem; color: #475569; font-size: .875rem; font-weight: 500; transition: .15s; }
.nav-link:hover, .nav-link.active { color: #4f46e5; background: #eef2ff; }
.nav-link.active { border-color: #c7d2fe; font-weight: 600; }
.btn { border-radius: .75rem; padding: .65rem 1rem; font-size: .875rem; font-weight: 700; transition: .15s; }
.btn-primary { color: white; background: #4f46e5; }
.btn-primary:hover { background: #4338ca; }
.btn-secondary { color: #334155; background: #f1f5f9; border: 1px solid #cbd5e1; }
.action-group { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.action-btn { display: inline-flex; align-items: center; gap: .3rem; border-radius: .55rem; border: 1px solid transparent; padding: .4rem .6rem; font-size: .72rem; font-weight: 700; transition: .15s; white-space: nowrap; }
.action-btn-edit { color: #4338ca; background: #eef2ff; border-color: #c7d2fe; }
.action-btn-edit:hover { background: #e0e7ff; }
.action-btn-password { color: #b45309; background: #fffbeb; border-color: #fde68a; }
.action-btn-password:hover { background: #fef3c7; }
.action-btn-danger { color: #be123c; background: #fff1f2; border-color: #fecdd3; }
.action-btn-danger:hover { background: #ffe4e6; }
.input { width: 100%; border: 1px solid #cbd5e1; border-radius: .75rem; padding: .65rem .8rem; background: white; }
.badge { display: inline-flex; border-radius: 999px; padding: .2rem .6rem; font-size: .7rem; font-weight: 800; }
.badge-process { background: #fff7ed; color: #c2410c; }
.badge-approve { background: #ecfdf5; color: #047857; }
.badge-review { background: #fffbeb; color: #b45309; }
.badge-reject { background: #fff1f2; color: #be123c; }
table { width: 100%; border-collapse: collapse; }
th { text-align: left; color: #64748b; font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; padding: .75rem; background: #f8fafc; }
th:last-child { text-align: center; }
td { padding: .8rem .75rem; border-top: 1px solid #e2e8f0; font-size: .82rem; }
.app-content { max-width: 80rem; margin: 0 auto; width: 100%; }