:root{--bg: #f6f8ff;--panel: #f8fafc;--card: #ffffff;--muted: #64748b;--text: #0f172a;--primary: #3b82f6;--primary-600: #2563eb;--danger: #ef4444;--success: #16a34a;--warning: #f59e0b;--border: #e2e8f0}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(1200px 800px at 10% -10%,rgba(59,130,246,.18),transparent 60%),radial-gradient(1000px 700px at 110% 20%,rgba(99,102,241,.16),transparent 60%),linear-gradient(180deg,#fafdff,#f5f7ff 40%,#eef2ff);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";position:relative}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:linear-gradient(to right,rgba(2,6,23,.06) 1px,transparent 1px),linear-gradient(to bottom,rgba(2,6,23,.06) 1px,transparent 1px);background-size:24px 24px;-webkit-mask-image:radial-gradient(closest-side,rgba(0,0,0,.5),transparent 80%);mask-image:radial-gradient(closest-side,rgba(0,0,0,.5),transparent 80%);z-index:-1}.container{max-width:1200px;margin:0 auto;padding:28px}.content{max-width:920px;margin:0 auto}.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 8px 30px #0206170f}.panel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:14px}.header{gap:6px}.title{font-size:22px;font-weight:700;letter-spacing:.2px}.subtitle{color:var(--muted);font-size:13px}.input,.select,.textarea{width:100%;background:#fff;color:var(--text);border:1px solid var(--border);border-radius:12px;padding:12px 14px;outline:none}.input:focus,.select:focus,.textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #3b82f640}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:#fff;color:var(--text);border-radius:999px;padding:10px 16px;cursor:pointer;transition:all .18s ease;box-shadow:0 4px 14px #0206170f}.btn:hover{transform:translateY(-1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--primary);border-color:var(--primary-600);color:#fff}.btn-primary:hover{background:var(--primary-600)}.btn-secondary{background:#eef2ff}.btn-danger{background:var(--danger);color:#fff;border-color:#b91c1c}.table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden}.table th,.table td{padding:12px 14px;border-bottom:1px solid var(--border);text-align:left}.table thead th{background:#f1f5f9;color:#0f172a;position:sticky;top:0}.table tbody tr:nth-child(odd) td{background:#fff}.table tbody tr:nth-child(2n) td{background:#f9fbff}.table tr:hover td{background:#f3f6ff}.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600}.badge-pending{background:#f59e0b2e;color:#b45309}.badge-processing{background:#3b82f62e;color:#1d4ed8}.badge-done{background:#22c55e2e;color:#15803d}.badge-closed{background:#94a3b833;color:#334155}.badge-rejected{background:#ef44442e;color:#b91c1c}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a59;display:flex;align-items:center;justify-content:center;z-index:9999}.modal{width:min(980px,96vw);max-height:92vh;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:0 30px 70px #0206172e}.header{display:flex;align-items:center;justify-content:space-between;gap:12px}.header h2,.header h3{margin:0}.grid{display:grid;gap:12px}.grid-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.m-0{margin:0}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.p-0{padding:0}.p-2{padding:8px}.p-3{padding:12px}.p-4{padding:16px}.flex{display:flex}.center{display:grid;place-items:center}.gap-1{gap:6px}.gap-2{gap:10px}.gap-3{gap:14px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.actions{display:flex;gap:8px;flex-wrap:wrap}.small{font-size:12px;color:var(--muted)}.table-scroll{width:100%;overflow:auto;border-radius:12px}@media (max-width: 640px){.container{padding:16px}.content{max-width:100%}.header{flex-direction:column;align-items:flex-start;gap:2px}.title{font-size:20px}}
