:root{--bg: #F5F6F8;--surface: #FFFFFF;--surface-2: #FBFBFC;--text: #0F172A;--muted: #64748B;--border: #E5E7EB;--border-2: #EEF2F7;--shadow: 0 10px 30px rgba(15, 23, 42, .06);--shadow-sm: 0 6px 18px rgba(15, 23, 42, .06);--accent: #2563EB;--accent-2: #1D4ED8;--accent-soft: rgba(37, 99, 235, .12);--ok: #16A34A;--ok-soft: rgba(22,163,74,.12);--warn: #F59E0B;--warn-soft: rgba(245,158,11,.14);--bad: #DC2626;--bad-soft: rgba(220,38,38,.12);--info: #0EA5E9;--info-soft: rgba(14,165,233,.12);--radius: 14px;--radius-sm: 10px;--pad-1: 10px;--pad-2: 14px;--pad-3: 18px;--gap-1: 10px;--gap-2: 14px;--gap-3: 18px;--font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";--mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--fs-1: 12px;--fs-2: 14px;--fs-3: 16px;--fs-4: 18px;--fs-5: 22px}body{margin:0;font-family:var(--font);color:var(--text);background:var(--bg);line-height:1.45;font-size:var(--fs-2)}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.shell{display:flex;min-height:100vh}.sidebar{width:260px;padding:18px;background:var(--surface);border-right:1px solid var(--border);position:sticky;top:0;height:100vh;overflow:auto}.main{flex:1;padding:20px 22px;max-width:1220px;margin:0 auto}.nav{display:flex;flex-direction:column;gap:6px;margin-top:12px}.nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;color:var(--text);border:1px solid transparent}.nav a:hover{background:var(--surface-2);border-color:var(--border-2);text-decoration:none}.nav a.active{background:var(--accent-soft);border-color:#2563eb2e;color:var(--accent-2);font-weight:700}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--pad-3);box-shadow:var(--shadow-sm)}.card .card{box-shadow:none;background:var(--surface-2);border-color:var(--border-2)}.row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-3)}@media (max-width: 980px){.sidebar{width:230px}.row{grid-template-columns:1fr}.main{padding:18px}}h1,h2,h3{margin:0 0 10px}.muted{color:var(--muted);font-size:var(--fs-1)}label{display:block;margin-top:12px;margin-bottom:6px;font-size:var(--fs-1);color:var(--muted);font-weight:700;letter-spacing:.2px}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:var(--surface);color:var(--text);font-size:var(--fs-2);outline:none}textarea{min-height:92px;resize:vertical;line-height:1.4}input:focus,select:focus,textarea:focus{border-color:#2563eb66;box-shadow:0 0 0 4px #2563eb1f}button{border:1px solid rgba(15,23,42,.14);background:var(--accent);color:#fff;font-weight:800;border-radius:12px;padding:10px 12px;cursor:pointer;transition:transform .02s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease}button:hover{background:var(--accent-2)}button:active{transform:translateY(1px)}button.ghost{background:transparent;color:var(--text);border-color:var(--border)}button.ghost:hover{background:var(--surface-2);border-color:var(--border)}.err{background:var(--bad-soft);border:1px solid rgba(220,38,38,.25);color:#991b1b;padding:10px 12px;border-radius:12px;font-size:var(--fs-2)}pre{margin:0;padding:12px;border-radius:12px;background:#0b1220;color:#e5e7eb;border:1px solid rgba(255,255,255,.08);overflow:auto;font-family:var(--mono);font-size:12px;line-height:1.45}.hr{height:1px;background:var(--border);margin:12px 0}.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}.badge:before{content:"";width:8px;height:8px;border-radius:50%;background:#0f172a59}.badge-draft{background:#f8fafc}.badge-draft:before{background:#64748be6}.badge-sent{background:var(--info-soft);border-color:#0ea5e940;color:#075985}.badge-sent:before{background:var(--info)}.badge-approved{background:#6366f11f;border-color:#6366f140;color:#3730a3}.badge-approved:before{background:#6366f1}.badge-paid{background:var(--ok-soft);border-color:#16a34a40;color:#166534}.badge-paid:before{background:var(--ok)}.badge-cancelled{background:var(--bad-soft);border-color:#dc262640;color:#991b1b}.badge-cancelled:before{background:var(--bad)}.kpi{display:flex;flex-direction:column;gap:2px}.kpi .label{color:var(--muted);font-size:12px;font-weight:700}.kpi .value{font-size:20px;font-weight:900;letter-spacing:-.2px}:root{--bg: #0b0f14;--surface: #0f1620;--surface-2: #121b27;--text: #e8eef6;--muted: #a7b3c2;--border: rgba(255,255,255,.1);--primary: #3b82f6;--violet: #8b5cf6;--green: #22c55e;--red: #ef4444;--amber: #f59e0b;--radius: 14px;--shadow: 0 14px 40px rgba(0,0,0,.35);--gap-1: 8px;--gap-2: 12px;--gap-3: 16px;--gap-4: 20px;--font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(1200px 500px at 20% -10%,rgba(59,130,246,.25),transparent 60%),radial-gradient(900px 500px at 90% 0%,rgba(139,92,246,.18),transparent 60%),var(--bg);color:var(--text);font-family:var(--font)}.container{max-width:1160px;margin:0 auto;padding:24px}.pageTitle{display:flex;align-items:baseline;justify-content:space-between;gap:var(--gap-3);margin:6px 0 16px}.pageTitle h1{margin:0;font-size:22px;font-weight:650;letter-spacing:.2px}.pageTitle .sub{color:var(--muted);font-size:13px}.card{background:linear-gradient(180deg,#ffffff0a,#ffffff05);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.cardHeader{padding:14px 16px;border-bottom:1px solid var(--border);background:#ffffff05;display:flex;align-items:center;justify-content:space-between;gap:var(--gap-3)}.cardHeader h2{margin:0;font-size:14px;font-weight:650;color:var(--text)}.cardBody{padding:16px}.toolbar{display:flex;flex-wrap:wrap;gap:var(--gap-2);padding:12px 16px;border-bottom:1px solid var(--border);background:#ffffff05}.toolbarGroup{display:flex;flex-wrap:wrap;gap:var(--gap-1);align-items:center}.toolbarLabel{font-size:12px;color:var(--muted);margin-right:6px}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:#ffffffeb;padding:10px 12px;border-radius:12px;font-weight:700;cursor:pointer;transition:transform .06s ease,background .12s ease,border-color .12s ease}.btn:hover{background:#ffffff1a}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.55;cursor:not-allowed}.btnPrimary{background:#60a5fa29;border-color:#60a5fa59}.btnPrimary:hover{background:#60a5fa38}.btnGhost{background:transparent;border-color:#ffffff1f}.btnGhost:hover{background:#ffffff14}.btnRed{background:#f8717124;border-color:#f8717152}.btnRed:hover{background:#f8717133}.btnGreen{background:#34d39924;border-color:#34d39952}.btnGreen:hover{background:#34d39933}.btnViolet{background:#a78bfa24;border-color:#a78bfa52}.btnViolet:hover{background:#a78bfa33}.cardHeader{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}.cardBody{padding-top:6px}.toolbar{display:flex;flex-wrap:wrap;gap:12px;padding:12px;border-radius:14px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);margin-top:12px}.toolbarGroup{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.toolbarLabel{font-size:12px;font-weight:800;letter-spacing:.02em;opacity:.7;margin-right:6px}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid rgba(255,255,255,.16);background:#ffffff0f;text-transform:lowercase}.pillSent{background:#60a5fa24;border-color:#60a5fa52}.pillApproved{background:#a78bfa24;border-color:#a78bfa52}.pillPaid{background:#34d39924;border-color:#34d39952}.pillCancelled{background:#f8717124;border-color:#f8717152}