:root{color-scheme:light;--bg: #ffffff;--card: #ffffff;--card2: #ffffff;--text: #111111;--muted: rgba(17, 17, 17, .62);--border: rgba(122, 11, 18, .14);--accent: #d4af37;--primary: #7a0b12;--danger: #ef4444;--sidebar: #7a0b12;--sidebarText: #fff7e6;--sidebarMuted: rgba(255, 247, 230, .72);--sidebarBorder: rgba(212, 175, 55, .35);--topbar: #f2f2f2;--topbarBorder: rgba(0, 0, 0, .08)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";background:var(--bg);color:var(--text)}.appShell{min-height:100vh;display:grid;grid-template-columns:260px 1fr;isolation:isolate}.sidebarOverlay{display:none}.menuButton{display:none;padding:9px 12px;border-radius:10px;border:1px solid rgba(122,11,18,.22);background:#fff;cursor:pointer}.sidebar{position:relative;position:sticky;top:0;height:100vh;padding:18px 14px;background:var(--sidebar);background-color:var(--sidebar);border-right:1px solid var(--sidebarBorder);display:flex;flex-direction:column}.sidebar:before{content:"";position:absolute;top:0;left:0;width:6px;height:100%;background:var(--accent)}.brand{display:flex;align-items:center;gap:10px;padding:10px 10px 14px;border-bottom:1px solid rgba(212,175,55,.35);margin-bottom:12px}.brandMark{width:14px;height:14px;border-radius:4px;background:var(--accent);box-shadow:0 0 0 4px #d4af3729}.brandText{font-weight:800;letter-spacing:.4px;color:var(--sidebarText)}.nav{display:grid;gap:2px;padding:4px 4px 12px;flex:1;overflow-y:auto}.navGroup{margin-top:2px}.navGroupTitleButton{width:100%;display:flex;align-items:center;gap:10px;text-align:left;padding:10px;border-radius:10px;border:1px solid rgba(255,247,230,.16);background:#fff7e60a;color:var(--sidebarText);font-weight:700}.navGroupTitleButton:after{content:"▾";margin-left:auto;color:var(--sidebarMuted)}.navGroupTitleButton.open:after{content:"▴"}.subNav{display:grid;gap:6px;margin-top:4px;margin-left:8px;padding-left:10px;border-left:1px solid rgba(255,247,230,.22)}.subNav.collapsed{display:none}.subNavLink{padding-left:34px;position:relative;font-size:13px;font-weight:600;border-color:#fff7e61a;background:#fff7e608}.subNavLink:hover{border-color:#d4af378c;background:#fff7e614}.subNavLink.active{border-color:#d4af37f2;background:#d4af3729;box-shadow:inset 0 0 0 1px #d4af3773}.navLink{text-decoration:none;color:var(--sidebarText);display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;border:1px solid rgba(255,247,230,.16);background:#fff7e60f}.navIcon{width:18px;height:18px;flex:0 0 18px;color:#fff7e6eb}.subNavLink .navIcon{width:16px;height:16px;flex:0 0 16px;color:#fff7e6db}.navLabel{line-height:1.1}.navLink:hover{border-color:#d4af37bf;background:#d4af3724}.navLink.active{border-color:#d4af37f2;background:#d4af3738;box-shadow:inset 0 0 0 1px #d4af378c}.sidebarFooter{position:static;margin-top:auto;color:var(--sidebarMuted);border-top:1px solid var(--sidebarBorder);padding-top:10px}.content{min-width:0;display:flex;flex-direction:column;min-height:100vh}.topbar{display:flex;justify-content:flex-end;align-items:center;gap:10px;padding:12px 18px;background:var(--topbar);border-bottom:1px solid var(--topbarBorder);position:sticky;top:0;z-index:50}.contentBody{min-width:0;flex:1;display:flex}@media (max-width: 900px){.appShell{grid-template-columns:1fr}.sidebar{position:fixed;top:0;left:0;bottom:0;width:min(92vw,320px);height:100vh;z-index:10000;transform:translate(-105%);transition:transform .18s ease;border-right:1px solid var(--sidebarBorder)}.nav,.navGroup,.subNav{background:var(--sidebar);background-color:var(--sidebar)}.navLink,.navGroupTitleButton{background:#8a0c14;border-color:#fff7e633}.subNavLink{background:#840b13;border-color:#fff7e629}.appShell.sidebarOpen .sidebar{transform:translate(0)}.appShell.sidebarOpen .content{pointer-events:none}.sidebarOverlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;border:0;padding:0;margin:0;background:#000000eb;z-index:9999;opacity:0;pointer-events:none;transition:opacity .18s ease}.sidebarOverlay.show{opacity:1;pointer-events:auto}.menuButton{display:inline-flex;align-items:center;justify-content:center}.topbar{padding:10px 14px}.sidebarFooter{margin-top:12px}}.page{max-width:1100px;margin:0 auto;padding:28px 18px 40px}.contentWrap{max-width:1200px;margin:0 auto;padding:28px 18px 40px;width:100%;display:flex;flex-direction:column;flex:1}.grid{flex:1}.header{margin-bottom:18px}h1{margin:0;letter-spacing:.2px;font-size:34px}.subtitle{margin:8px 0 0;color:var(--muted)}.grid{display:grid;grid-template-columns:1fr;gap:14px}@media (min-width: 950px){.grid{grid-template-columns:.95fr 1.05fr;align-items:start}}.card{background:linear-gradient(180deg,var(--card),var(--card2));border:1px solid var(--border);border-radius:14px;padding:14px}.cardTitleRow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}h2{margin:0;font-size:18px}.form{display:grid;gap:10px}label{display:grid;gap:6px;color:var(--muted);font-size:13px}input,textarea,select{width:100%;padding:10px 11px;border-radius:10px;border:1px solid var(--border);background:#ffffffeb;color:var(--text);outline:none}input:focus,textarea:focus{border-color:#7a0b1273;box-shadow:0 0 0 4px #d4af3738}select:focus{border-color:#7a0b1273;box-shadow:0 0 0 4px #d4af3738}.actions{display:flex;justify-content:flex-end}button{padding:9px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.18);border-color:#7a0b1238;background:linear-gradient(180deg,#d4af378c,#d4af3757);color:var(--text);cursor:pointer}button.secondary{border-color:#7a0b1229;background:#fff}button.btn-view,button.secondary.btn-view{border-color:#0f172a38;background:#0f172a0f}button.btn-add{border-color:#16a34a59;background:linear-gradient(180deg,#22c55e6b,#22c55e38)}button.secondary.btn-add{border-color:#16a34a59;background:#22c55e1a}button.btn-edit{border-color:#2563eb59;background:linear-gradient(180deg,#3b82f666,#3b82f638)}button.secondary.btn-edit{border-color:#2563eb59;background:#3b82f61a}button.btn-refresh{border-color:#47556959;background:linear-gradient(180deg,#94a3b873,#94a3b83d)}button.secondary.btn-refresh{border-color:#47556959;background:#94a3b824}button.btn-print{border-color:#7c3aed59;background:linear-gradient(180deg,#a78bfa85,#a78bfa42)}button.secondary.btn-print{border-color:#7c3aed59;background:#a78bfa1f}button.btn-approve{border-color:#16a34a73;background:linear-gradient(180deg,#22c55e9e,#22c55e57)}button.secondary.btn-approve{border-color:#16a34a73;background:#22c55e29}button.btn-reject{border-color:#dc262673;background:linear-gradient(180deg,#f871718c,#f8717142)}button.secondary.btn-reject{border-color:#dc262673;background:#f8717124}button.btn-pay{border-color:#ca8a0473;background:linear-gradient(180deg,#facc158c,#facc1542)}button.secondary.btn-pay{border-color:#ca8a0473;background:#facc1524}button.danger{border-color:#ef44448c;background:#ef44441f}button:disabled{opacity:.6;cursor:not-allowed}.formGrid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.formGrid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}@media (max-width: 768px){.formGrid2,.formGrid3{grid-template-columns:1fr}}.list{display:flex;flex-direction:column;gap:12px}.listScroll{max-height:520px;overflow:auto;padding-right:6px}.clientsToolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px}.clientsToolbar input{flex:1}.listItem{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--border);border-radius:12px;padding:12px;background:#ffffffc7}.listItemMain{min-width:0}.listItemTitle{font-weight:700;margin-bottom:4px}.listItemMeta{color:var(--muted);font-size:12px}.listItemDesc{margin:10px 0 0;color:#111111c7;font-size:13px;line-height:1.35}.listItemActions{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px}.piLayout{display:grid;grid-template-columns:minmax(260px,360px) minmax(0,1fr);gap:14px;align-items:start}@media (max-width: 950px){.piLayout{grid-template-columns:1fr}}.piLeftTop{display:grid;gap:8px;margin-bottom:12px}.piPlatList{max-height:520px;overflow:auto;padding-right:6px;display:flex;flex-direction:column;gap:10px}.piPlatButton{width:100%;text-align:center;padding:12px 10px;border-radius:12px;border:1px solid rgba(0,0,0,.12);background:#00000014;font-weight:800;letter-spacing:.3px}.piPlatButton.active{background:#0000002e;border-color:#0003}.piRightTop{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}.piTableWrap{border:1px solid rgba(0,0,0,.08);border-radius:12px;overflow:auto;max-height:520px;max-width:100%;background:#ffffffb3}.piTable{width:100%;border-collapse:collapse;min-width:0}.piTable thead th{position:sticky;top:0;background:#00000014;padding:10px;font-size:12px;text-transform:uppercase;letter-spacing:.6px}.piTable td{padding:10px;border-top:1px solid rgba(0,0,0,.06);font-size:13px}.piTable tr.disabled{opacity:.55}.piTotalRow{display:flex;justify-content:flex-end;gap:18px;margin-top:12px;align-items:baseline}.cmHeaderRow{display:flex;justify-content:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:12px}.cmBudgetBox{border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:10px 12px;background:#ffffffbf;min-width:220px}.cmBudgetLabel{font-size:12px;opacity:.75}.cmBudgetValue{font-weight:900;margin-top:4px}.cmLayout{display:grid;grid-template-columns:minmax(320px,1fr) 60px minmax(320px,1fr);gap:14px;align-items:start}@media (max-width: 1100px){.cmLayout{grid-template-columns:1fr}}.cmLeft,.cmRight{min-width:0}.cmMiddle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px}.cmTableWrap{border:1px solid rgba(0,0,0,.08);border-radius:12px;overflow:auto;max-height:520px;background:#ffffffb3}.cmTable{width:100%;border-collapse:collapse;min-width:0}.cmTable thead th{position:sticky;top:0;background:#00000014;padding:10px;font-size:12px;text-transform:uppercase;letter-spacing:.6px}.cmTable td{padding:10px;border-top:1px solid rgba(0,0,0,.06);font-size:13px}.cmTable tr.active{background:#0000000f}.cmTable tr.selectedRow{outline:2px solid rgba(10,88,202,.55);outline-offset:-2px;background:#0a58ca14}.cmFooterRow{display:flex;justify-content:flex-end;gap:18px;margin-top:12px;align-items:baseline}.tableWrap{border:1px solid rgba(0,0,0,.08);border-radius:12px;overflow:auto;max-height:clamp(320px,calc(100vh - 320px),640px);max-width:100%;background:#ffffffb3}.table{width:100%;border-collapse:separate;border-spacing:0}.table thead th{position:sticky;top:0;background:#f0bcbc;color:#2a0b0b;background-clip:padding-box;padding:10px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;z-index:2;border-bottom:1px solid rgba(0,0,0,.16);box-shadow:0 2px #0000001f}.table td{padding:10px;border-top:1px solid rgba(0,0,0,.06);font-size:13px}.table tbody tr:nth-child(2n) td{background:#00000008}.table tbody tr:hover td{background:#b91c1c0f}.error{margin-top:10px;padding:10px;border-radius:12px;border:1px solid rgba(239,68,68,.45);background:#ef44441f}.footer{margin-top:auto;padding-top:16px;color:var(--muted)}.modalOverlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1111118c;display:grid;place-items:center;padding:18px;z-index:60}.modal{width:min(1100px,100%);max-height:min(86vh,920px);overflow:auto;border-radius:14px;background:var(--card);border:1px solid rgba(122,11,18,.16);box-shadow:0 18px 60px #00000059;padding:16px}.modalHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;background:var(--card);padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid rgba(122,11,18,.12)}.modalHeader h2{margin:0}.modalClose{width:36px;height:36px;border-radius:10px;border:1px solid rgba(122,11,18,.16);background:#fff;color:var(--text);cursor:pointer;display:grid;place-items:center;font-size:22px;line-height:1}.modalClose:hover{background:#d4af372e}code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}