@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--navy:#0b2333;--navy2:#153b4f;--gold:#be975c;--goldsoft:#f5ede0;--ink:#1b2e3b;--muted:#72808b;--border:#e2e8eb;--bg:#f4f6f7;--white:#fff;--red:#b84d4b;--green:#288368;--amber:#976223;--shadow:0 14px 40px rgba(13,43,59,.055)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);font:14px/1.52 'DM Sans',Arial,sans-serif;color:var(--ink)}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}
.app{display:grid;grid-template-columns:262px minmax(0,1fr);min-height:100vh}
.sidebar{background:var(--navy);color:#edf2f3;padding:20px 14px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;overflow-y:auto}
.brand{display:flex;gap:11px;align-items:center;padding:4px 8px 20px}.brand img{width:52px;height:52px;object-fit:contain;border-radius:10px;background:#fff1;padding:3px}.brand b{font:800 12.5px 'Manrope',Arial,sans-serif;letter-spacing:.03em;display:block;line-height:1.25}.brand small{font-size:9.5px;color:#d3b585;letter-spacing:.2em}
.brand{flex-direction:column;gap:8px;padding:2px 2px 16px}.brand img.brand-wide{width:100%;max-width:224px;height:auto;background:none;padding:0;border-radius:0;filter:drop-shadow(0 6px 14px #0007)}.brand img.brand-badge{display:none;background:none;padding:0;border-radius:50%}.brand>small{font-size:9px;letter-spacing:.32em;color:#d3b585}
.sidebar-label{font-size:9.5px;text-transform:uppercase;letter-spacing:.2em;color:#7796a2;margin:14px 12px 6px}
.nav{border:0;color:#bcd0d8;display:flex;gap:11px;align-items:center;text-align:left;background:none;width:100%;border-radius:9px;padding:9px 12px;font-weight:600;font-size:13px;margin:1px 0}.nav i{font-style:normal;width:18px;text-align:center;opacity:.9}.nav:hover,.nav.active{background:#1b4052;color:#fff}.nav.active{box-shadow:inset 3px 0 var(--gold)}.nav .count{margin-left:auto;background:var(--gold);color:#132b38;border-radius:999px;font-size:10px;padding:1px 7px;font-weight:800}
.sidefooter{margin-top:auto;border-top:1px solid #294959;padding:16px 10px 4px;color:#afc3c9;font-size:11.5px}.sidefooter a{display:block;color:#efd4a0;text-decoration:none;margin-top:9px;font-weight:700}.sidefooter .powered{margin-top:12px;font-size:10px;letter-spacing:.14em;color:#7f9aa5}
.main{min-width:0;padding:24px clamp(18px,3vw,46px) 70px}
.top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.eyebrow{color:#a77d44;text-transform:uppercase;letter-spacing:.22em;font-size:10px;font-weight:800}.top h1{font:800 clamp(24px,2.8vw,34px) 'Manrope',Arial,sans-serif;margin:4px 0;letter-spacing:-.045em}.sub{color:var(--muted);font-size:13px}
.actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.btn{border:1px solid #cfdae0;background:#fff;color:var(--ink);padding:10px 15px;border-radius:9px;font-weight:700;font-size:12px;text-decoration:none;display:inline-flex;gap:7px;align-items:center;justify-content:center;white-space:nowrap}.btn:hover{border-color:var(--gold)}.btn.primary{background:var(--navy);color:#fff;border-color:var(--navy)}.btn.gold{background:var(--gold);color:#172b38;border-color:var(--gold)}.btn.tiny{padding:6px 10px;font-size:11px}.btn.danger{color:var(--red)}.btn:disabled{opacity:.5;cursor:not-allowed}
.hidden{display:none!important}.view{display:none}.view.active{display:block}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin:6px 0 16px}
.kpi{background:#fff;border:1px solid var(--border);border-radius:12px;padding:17px 19px;box-shadow:var(--shadow);position:relative;overflow:hidden}.kpi:before{content:'';position:absolute;top:0;left:0;width:100%;height:3px;background:#d2b68b}.kpi small{color:var(--muted);display:block;margin-bottom:8px;font-size:11px}.kpi strong{display:block;font:800 26px 'Manrope',Arial,sans-serif;letter-spacing:-.05em}.kpi span{display:block;color:var(--muted);font-size:11px;margin-top:5px}
.meter{height:7px;background:#edf0f1;border-radius:9px;overflow:hidden;margin-top:9px}.meter b{display:block;height:100%;background:linear-gradient(90deg,#1c5e77,var(--gold))}
.columns{display:grid;grid-template-columns:1.55fr 1fr;gap:16px}.columns.even{grid-template-columns:1fr 1fr}
.panel{background:#fff;border:1px solid var(--border);border-radius:13px;box-shadow:var(--shadow);padding:20px;margin-bottom:16px;min-width:0}.panel h2{font:750 16px 'Manrope',Arial,sans-serif;margin:0}.panel h3{font:750 13px 'Manrope',Arial,sans-serif;margin:16px 0 8px;color:var(--navy2)}
.panelhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px;flex-wrap:wrap}.panelhead small{color:var(--muted)}.muted{color:var(--muted)}
.pipeline{display:flex;gap:5px;width:100%;height:13px;overflow:hidden;border-radius:10px;background:#eff1f2;margin:18px 0 12px}.pipeline span{min-width:0}
.legend{display:flex;gap:15px;flex-wrap:wrap;color:var(--muted);font-size:11px}.dot{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:5px}
.tablewrap{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left}th{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#8897a0;font-weight:700;padding:11px 9px;border-bottom:1px solid var(--border);white-space:nowrap}td{padding:12px 9px;border-bottom:1px solid #eef1f2;font-size:12.5px;vertical-align:middle}tr:last-child td{border:0}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.person{font-weight:700;color:var(--navy);font-size:13px}
.tag{display:inline-flex;padding:4px 9px;border-radius:999px;background:#eff3f4;color:#536d79;font-size:10px;font-weight:800;white-space:nowrap}.tag.signed,.tag.booked,.tag.completed,.tag.paid,.tag.resolved,.tag.good{background:#e5f5ed;color:#1e7957}.tag.deposit_due,.tag.balance_due,.tag.follow_up,.tag.draft,.tag.scheduled,.tag.warn{background:#fff0d7;color:#976223}.tag.cancelled,.tag.overdue,.tag.declined,.tag.expired,.tag.open,.tag.bad{background:#fbeaea;color:#9c3e3e}.tag.gold{background:var(--goldsoft);color:#86622f}
.linkbtn{border:0;background:none;color:#956b3b;font-weight:800;text-decoration:underline;font-size:11.5px;padding:2px 4px}
.field{display:flex;flex-direction:column;gap:5px;color:#a17b4d;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.field input,.field select,.field textarea{border:1px solid #dce4e8;border-radius:8px;padding:10px 11px;background:#fff;font-size:13px;color:#1c3645;letter-spacing:0;text-transform:none;width:100%;outline:none;font-weight:400}.field textarea{min-height:70px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#c5a16e;box-shadow:0 0 0 3px #e8d4ad55}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fields.three{grid-template-columns:repeat(3,minmax(0,1fr))}.fields.four{grid-template-columns:repeat(4,minmax(0,1fr))}.span2{grid-column:span 2}.full{grid-column:1/-1}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:15px}.toolbar input,.toolbar select{border:1px solid #dbe2e6;border-radius:9px;padding:10px 12px;background:#fff;outline:0}.toolbar input[type=search]{max-width:360px;width:100%}.toolbar .spacer{flex:1}
.calendarhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.calendarhead strong{font:750 19px 'Manrope',Arial,sans-serif;min-width:200px}
.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.dayname{font-size:10px;text-align:center;color:#91a0a7;text-transform:uppercase;font-weight:800;letter-spacing:.11em;padding-bottom:6px}
.day{border:1px solid #e3e9eb;background:#fff;border-radius:9px;min-height:104px;cursor:pointer;text-align:left;padding:8px 7px;min-width:0}.day:hover{background:#faf5ea;border-color:#b89c70}.day.empty{background:#f7f8f8;border:0;cursor:default}.day.today{outline:2px solid #c6a575}.day b{font-size:12px;color:#778892}
.event{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 5px;margin-top:4px;border-radius:4px;font-size:10px;font-weight:700}.event.install{background:#e7f2f6;color:#205d7a}.event.removal{background:#efe5d6;color:#89663d}.event.service{background:#e5f4ea;color:#2b7958}
.emptymsg{text-align:center;padding:30px 12px;color:#81919b}
.tasks{display:flex;flex-direction:column;gap:9px}.task{display:flex;align-items:flex-start;gap:11px;padding:11px;background:#fafbfb;border:1px solid #edf0f1;border-radius:10px}.task>span{width:8px;height:8px;border-radius:50%;margin-top:7px;background:var(--gold);flex-shrink:0}.task>span.red{background:var(--red)}.task>span.green{background:var(--green)}.task strong{font-size:12.5px}.task small{display:block;color:#778891;font-size:11px;margin-top:2px}.task>div{flex:1;min-width:0}
.money{font-variant-numeric:tabular-nums}.row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px}
.notice{padding:12px 15px;background:#f6f0e5;border:1px solid #e7d8c0;border-radius:9px;font-size:12px;color:#705630;margin:10px 0 14px}.notice.good{background:#eaf6ed;border-color:#cce8da;color:#236443}.notice.bad{background:#faebea;border-color:#f0d3d0;color:#984340}
.doc{background:#fff;border:1px solid #dae4e6;padding:34px 38px;max-width:800px;margin:14px auto;box-shadow:0 13px 45px #142f3e13}
.docbrand{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:3px solid #b99358;padding-bottom:18px}.docbrand img{height:64px;width:auto}.docbrand b{font:800 19px 'Manrope',Arial,sans-serif;color:#102f40}.docbrand small{font-size:11px;color:#67808b}
.doctitle{font:800 32px 'Manrope',Arial,sans-serif;color:#16384a;margin:26px 0 6px;letter-spacing:-.03em}
.totals{width:290px;margin:18px 0 0 auto}.totals div{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e7e7e7}.totals div:last-child{font-weight:800;font-size:18px;color:#0b293c;border-top:2px solid #cba86d}
.bars{display:flex;align-items:flex-end;gap:8px;height:150px;padding:8px 2px 0}.bars div{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;height:100%;min-width:0}.bars i{display:block;width:100%;background:linear-gradient(0deg,#194860,#c0a06b);border-radius:5px 5px 0 0;min-height:3px}.bars span{font-size:10px;color:#87969c;white-space:nowrap}.bars em{font-style:normal;font-size:10px;color:#4b6470;font-weight:700}
.hbar{display:grid;grid-template-columns:150px 1fr 90px;gap:10px;align-items:center;margin:7px 0;font-size:12px}.hbar .track{height:10px;background:#eef1f2;border-radius:6px;overflow:hidden}.hbar .track b{display:block;height:100%;background:linear-gradient(90deg,#1c5e77,#c0a06b)}.hbar .v{text-align:right;font-weight:700}
.kanban{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:12px;overflow-x:auto;padding-bottom:10px}.kcol{background:#eef2f3;border-radius:12px;padding:10px;min-height:380px}.kcol.drop{outline:2px dashed var(--gold);background:#faf5ea}.kcol h4{margin:2px 4px 10px;font:800 11px 'Manrope',Arial;letter-spacing:.12em;text-transform:uppercase;color:#4c6773;display:flex;justify-content:space-between}.kcard{background:#fff;border:1px solid #e1e8ea;border-radius:10px;padding:11px;margin-bottom:8px;cursor:grab;box-shadow:0 3px 10px #0b233308}.kcard:hover{border-color:var(--gold)}.kcard b{display:block;font-size:13px;color:var(--navy)}.kcard small{display:block;color:var(--muted);font-size:11px}.kcard .kv{display:flex;justify-content:space-between;margin-top:7px;font-size:11px;font-weight:700;color:#3f5a66}
.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{border:1px solid #d8e1e4;background:#fff;border-radius:999px;padding:6px 12px;font-size:11.5px;font-weight:700;color:#4b6470}.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.checklist label{display:flex;gap:9px;align-items:flex-start;padding:7px 0;border-bottom:1px dashed #e4e9eb;font-size:12.5px}.checkline{display:flex;align-items:center;gap:7px;color:#435d6a;font-size:12px}.checkline input{accent-color:#a6834d}
.modalShade{display:none;position:fixed;inset:0;background:#061b2aba;z-index:30;align-items:center;justify-content:center;padding:14px}.modalShade.open{display:flex}.modal{background:#fff;border-radius:16px;max-width:900px;width:100%;max-height:93vh;overflow:auto;box-shadow:0 40px 100px #04182477}.modalheader{position:sticky;top:0;z-index:2;background:#fff;border-bottom:1px solid #e9eeee;padding:17px 23px;display:flex;align-items:center;justify-content:space-between;gap:10px}.modalheader h2{margin:0;font:750 18px 'Manrope',Arial,sans-serif}.modalbody{padding:21px 23px 26px}
.split{display:flex;justify-content:space-between;align-items:center;gap:12px}.hr{height:1px;background:#e3e9eb;margin:18px 0}.smallhelp{font-size:11px;color:#87969c;margin-top:6px}
.statline{display:flex;gap:12px;flex-wrap:wrap;color:#758793;font-size:12px}.statline b{color:#173446}
.sigbox{border:1px solid #e1d6c2;background:#fffdf8;border-radius:10px;padding:13px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}.sigbox img{max-height:60px;max-width:220px;background:#fff;border:1px solid #eee;border-radius:6px;padding:4px}
.timeline{border-left:2px solid #e4d5bb;margin:6px 0 0 6px;padding-left:14px}.timeline div{position:relative;font-size:12px;padding:5px 0;color:#435d6a}.timeline div:before{content:'';position:absolute;left:-19px;top:10px;width:8px;height:8px;border-radius:50%;background:var(--gold)}.timeline small{color:#8a989f;margin-right:6px}
.toast{position:fixed;right:20px;bottom:20px;z-index:60;background:var(--navy);color:#f3e4c5;border:1px solid var(--gold);padding:13px 17px;border-radius:11px;box-shadow:0 14px 40px #0008;font-weight:700;font-size:13px;max-width:360px;transform:translateY(130%);transition:transform .25s}.toast.show{transform:none}
.stockbad{color:var(--red);font-weight:800}.stockok{color:var(--green);font-weight:800}
.qtyin{width:90px;border:1px solid #dce4e8;border-radius:7px;padding:6px 8px}
@media(max-width:1100px){.columns,.columns.even{grid-template-columns:1fr}}
@media(max-width:980px){.brand img.brand-wide,.brand>small{display:none}.brand img.brand-badge{display:block;width:48px;height:48px}.app{grid-template-columns:76px 1fr}.sidebar{padding:16px 8px}.brand div,.sidebar-label,.nav span,.nav .count,.sidefooter{display:none}.brand{padding:4px 4px 14px;justify-content:center}.brand img{width:44px;height:44px}.nav{justify-content:center;padding:11px}.nav i{font-size:16px}}
@media(max-width:650px){.app{display:block}.sidebar{position:sticky;top:0;z-index:20;height:auto;display:flex;flex-direction:row;align-items:center;padding:6px 8px;gap:2px;overflow-x:auto}#nav{display:flex;gap:2px}.sidebar-label{display:none}.brand{padding:2px 6px 2px 2px}.brand img.brand-badge{width:36px;height:36px}.nav{width:auto;white-space:nowrap;padding:9px 10px}.main{padding:16px 12px 80px}.top{display:block}.actions{margin-top:12px}.kpi{padding:14px}.kpi strong{font-size:21px}.panel{padding:14px}.day{min-height:64px;padding:5px 3px}.event{font-size:8px}.fields,.fields.three,.fields.four{grid-template-columns:1fr}.span2{grid-column:auto}.doc{padding:18px}.modalheader,.modalbody{padding:14px}.hbar{grid-template-columns:100px 1fr 70px}}
@media print{body{background:#fff}.sidebar,.top,.toolbar,.actions,.row-actions,.noprint,.panelhead .actions{display:none!important}.app,.main{display:block;padding:0!important}.view{display:none!important}.view.printing{display:block!important}.panel{border:0;box-shadow:none;padding:0!important}.doc{max-width:none;box-shadow:none;border:0;padding:0;margin:0}}
