:root{--ink:#0e2d62;--navy:#09214b;--blue:#1264e8;--blue-50:#edf4ff;--canvas:#f4f8fd;--surface:#fff;--line:#e3eaf4;--muted:#637796;--soft:#f8faff;--green:#15805e;--amber:#ae741d;--red:#c53d48;--radius:8px;--shadow:0 12px 32px rgba(16,53,104,.07);font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--canvas)}*{box-sizing:border-box}body{margin:0;font-size:12px;line-height:1.45;background:linear-gradient(125deg,#f6faff 0%,#fff 52%,#f1f7ff 100%)}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #61a1ff;outline-offset:2px}.rail{position:fixed;left:0;top:0;bottom:0;width:218px;background:#fff;border-right:1px solid var(--line);padding:17px 12px;display:flex;flex-direction:column;z-index:2}.brand{align-items:center;display:flex;gap:7px;font-size:0;margin:0 10px 22px;color:var(--navy)}.brand-mark{display:none}.brand div{font-size:20px;font-weight:850;letter-spacing:-1px}.brand small{display:none}.brand b{font-size:8px;letter-spacing:.7px;background:#eaf2ff;color:var(--blue);padding:3px 5px;border-radius:4px;margin-left:2px}.nav{border:0;background:transparent;border-radius:5px;color:#334d73;display:flex;align-items:center;gap:10px;font-size:12px;font-weight:550;margin:2px 0;padding:8px 10px;text-align:left;width:100%;transition:.15s}.nav:hover{background:#f3f7fd;color:var(--blue)}.nav.active{background:#e8f0ff;color:#075fe7;font-weight:700;box-shadow:none}.nav-icon{font-size:14px;text-align:center;width:15px;color:inherit}.rail-bottom{border-top:1px solid #edf1f7;margin:18px 6px 0;padding:14px 3px 0;gap:10px;font-size:10px}.rail-bottom small{color:#8a9ab3}.demo-data{color:var(--green);font-weight:650}main{margin-left:218px;min-height:100vh;padding-bottom:36px}header{height:52px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px}.crumb{font-size:11px;color:var(--muted)}.crumb b{color:#385276}.header-actions{display:flex;align-items:center;gap:13px}.demo-pill{background:#eff5ff;color:#2f6dd3;border-radius:100px;font-weight:800;font-size:9px;letter-spacing:.65px;padding:4px 7px}.btn{border:1px solid transparent;border-radius:5px;font-size:12px;font-weight:700;padding:8px 13px;transition:all .16s}.btn.primary{background:var(--blue);box-shadow:0 3px 7px #1264e82e;color:white}.btn.primary:hover{background:#0759d7;transform:translateY(-1px)}.btn.secondary{background:white;border-color:#dce5f1;color:#24436e}.btn.secondary:hover,.btn.subtle:hover{background:#f5f8fc}.btn.subtle{background:transparent;color:#5f7594;font-size:11px;padding:6px}.btn.danger{background:var(--red);color:white}.btn:disabled{cursor:not-allowed;opacity:.48}.page-head{max-width:1380px;margin:0 auto;padding:25px 30px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1px;color:var(--blue);margin-bottom:3px}.page-head h1{color:var(--navy);font-size:20px;letter-spacing:-.45px;line-height:1.2;margin:0 0 3px}.page-head p{color:var(--muted);font-size:12px;margin:0;max-width:700px}.promise,.kpis,.card,.detail-grid,.action-grid,.steps,.tracking-layout,.billing-layout,.myob-layout,.notice-banner,.simulation-banner{max-width:1380px;margin-left:auto;margin-right:auto}.promise{align-items:center;background:#f2f7ff;border:1px solid #d9e9ff;border-radius:7px;display:flex;gap:18px;justify-content:space-between;margin-bottom:14px;padding:12px 16px}.promise b{color:var(--navy);display:block;font-size:13px}.promise span{color:var(--muted);font-size:11px;margin-left:5px}.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-bottom:14px}.kpis article,.card{background:#fff;border:1px solid var(--line);border-radius:7px;box-shadow:0 4px 16px rgba(27,67,120,.035)}.kpis article{min-height:86px;padding:14px 16px;position:relative}.kpis article:before{background:#e7f0ff;border-radius:7px;color:var(--blue);content:'◈';display:grid;height:23px;place-items:center;position:absolute;right:15px;top:15px;width:23px}.kpis small,.totals-card>small,.approval>small,.document small,.invoice small{color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.55px}.kpis strong{color:var(--navy);display:block;font-size:20px;letter-spacing:-.5px;margin:2px 0}.kpis span{color:var(--muted);font-size:10px}.card{padding:17px}.card h2{color:var(--navy);font-size:15px;margin:0}.card h3{color:var(--navy);font-size:14px;margin:8px 0}.card-title{align-items:flex-start;display:flex;gap:14px;justify-content:space-between;margin-bottom:13px}.card-title p,.charge-block p,.mapping>p{color:var(--muted);font-size:11px;margin:2px 0}.text-btn{background:transparent;border:0;color:var(--blue);font-size:11px;font-weight:750;padding:3px}.table-wrap{overflow:auto}table{border-collapse:separate;border-spacing:0;width:100%;font-size:11px}thead{background:#f2f6fb}th{border-bottom:1px solid #e7edf5;color:#385278;font-size:9px;font-weight:800;letter-spacing:.25px;padding:8px 9px;text-align:left;white-space:nowrap}th:first-child{border-radius:5px 0 0 5px}th:last-child{border-radius:0 5px 5px 0}td{border-bottom:1px solid #edf1f6;color:#294563;padding:10px 9px;vertical-align:middle}tbody tr:last-child td{border-bottom:0}tbody tr[data-open]{cursor:pointer}tbody tr[data-open]:hover{background:#f7faff}td b{color:var(--navy)}td span{color:var(--muted);display:block;font-size:10px;margin-top:1px}.num{text-align:right}.money{font-variant-numeric:tabular-nums}.site{color:var(--muted);max-width:210px}.chip{border-radius:100px;display:inline-block;font-size:9px;font-weight:750;padding:3px 7px;white-space:nowrap}.chip.neutral{background:#eef2f7;color:#536a88}.chip.warning{background:#e8f8ef;color:#17805e}.chip.blue{background:#e9f0ff;color:#1763d5}.chip.success{background:#e4f7ed;color:#15805e}.filters{border-bottom:1px solid var(--line);display:flex;gap:12px;margin-bottom:12px;padding-bottom:13px}.filters label{color:var(--muted);display:grid;font-size:10px;font-weight:750;gap:4px}.filters input{width:300px}.filters select{min-width:160px}input,select,textarea{background:white;border:1px solid #dce5f0;border-radius:4px;color:#203d63;font-size:11px;padding:7px 9px;width:100%}input::placeholder{color:#a2b0c3}textarea{min-height:76px;resize:vertical}.form-card{background:white;border:1px solid var(--line);border-radius:7px;box-shadow:var(--shadow);margin:0 auto;max-width:1120px;padding:0 22px}.form-section{border-bottom:1px solid var(--line);padding:20px 0}.form-section h2{color:var(--navy);font-size:13px;margin:0 0 13px}.form-section h2 small{color:var(--muted);font-size:10px;font-weight:500}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}.field{color:#47607f;font-size:10px;font-weight:750}.field em{color:var(--red);font-style:normal;margin-left:2px}.field input,.field select,.field textarea{display:block;font-weight:400;margin-top:4px}.field.wide{grid-column:1/-1}.hint{color:var(--muted);font-size:10px;margin:10px 0 0}.form-actions{align-items:center;display:flex;gap:14px;justify-content:flex-end;padding:15px 0}.error{color:var(--red);font-size:10px;margin-right:auto}.steps{display:flex;gap:0;margin-bottom:17px;padding:0 30px}.steps button{align-items:center;background:transparent;border:0;color:#7990ac;display:flex;font-size:10px;font-weight:700;gap:5px;padding:4px 11px 4px 0}.steps button:after{color:#b7c5d5;content:'›';font-size:14px;margin-left:6px}.steps button:last-child:after{display:none}.steps span{background:#edf1f7;border-radius:50%;display:grid;font-size:9px;height:18px;place-items:center;width:18px}.steps .current{color:var(--blue)}.steps .current span,.steps .done span{background:var(--blue);color:#fff}.detail-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:12px}.hero-job{align-items:center;display:flex;justify-content:space-between}.hero-job h2{font-size:18px;margin:9px 0 4px}.hero-job p,.facts p{color:var(--muted);font-size:11px;margin:0}.amount{text-align:right}.amount small,.amount span{color:var(--muted);display:block;font-size:10px}.amount strong{color:var(--navy);display:block;font-size:22px}.facts h3{margin-top:0}.facts small{font-weight:800}.action-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}.action-card{background:#fff;border:1px solid var(--line);border-radius:7px;box-shadow:0 4px 15px rgba(27,67,120,.03);color:var(--ink);display:grid;gap:4px;padding:16px;text-align:left;transition:.16s}.action-card:hover{border-color:#a8ccff;box-shadow:0 8px 20px #2c67ba14;transform:translateY(-1px)}.action-card span{color:var(--blue);font-size:10px;font-weight:800}.action-card b{font-size:13px}.action-card small{color:var(--muted);font-size:10px}.action-card i{color:var(--blue);font-size:10px;font-style:normal;font-weight:700;margin-top:6px}.doc-wrap{background:#f0f5fb;border-top:1px solid #e4ecf6;padding:26px 0}.document{background:white;box-shadow:0 8px 25px rgba(15,44,90,.13);margin:auto;min-height:820px;padding:50px 62px;width:min(800px,calc(100% - 40px))}.doc-top{border-bottom:2px solid var(--navy);display:flex;justify-content:space-between;padding-bottom:17px}.doc-top b{color:var(--navy);font-size:24px}.doc-top span{color:var(--muted);display:block;font-size:8px;letter-spacing:1.8px}.sample{color:var(--red);font-size:9px;font-weight:850;text-align:right}.doc-title{margin:42px 0}.doc-title h1{color:var(--navy);font-size:28px;margin:0}.doc-title p{color:var(--muted);font-size:11px}.doc-grid{display:grid;gap:22px;grid-template-columns:1fr 1fr}.document p{font-size:11px;line-height:1.7}.document hr{border:0;border-top:1px solid var(--line);margin:21px 0}.document h2{color:var(--navy);font-size:18px;margin:6px 0}.doc-callout{background:#f3f7fc;border-left:3px solid var(--blue);display:grid;font-size:11px;gap:3px;padding:12px}.terms{color:var(--muted);font-size:10px!important;margin-top:40px}.document footer{border-top:1px solid var(--line);color:var(--muted);font-size:9px;margin-top:65px;padding-top:13px}.tracking-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:12px}.charges{padding:0}.charge-block{padding:17px}.charge-block+.charge-block{border-top:6px solid var(--canvas)}.totals-card{height:max-content}.totals-card h2{font-size:23px;margin:3px 0 14px}.totals-card>div{color:var(--muted);display:flex;font-size:11px;justify-content:space-between;margin:8px 0}.totals-card b{color:var(--ink);font-variant-numeric:tabular-nums}.totals-card hr{border:0;border-top:1px solid var(--line);margin:12px 0}.totals-card .grand{color:var(--navy);font-size:14px}.full{margin-top:13px;width:100%}.empty{color:var(--muted);padding:20px;text-align:center}.icon-btn{background:transparent;border:0;color:var(--blue);font-size:10px;font-weight:700;padding:2px}.danger-text{color:var(--red)}.notice-banner,.simulation-banner{border-radius:5px;font-size:11px;margin-bottom:12px;padding:10px 13px}.notice-banner{background:#fff8e9;border:1px solid #f2dfb4;color:#7e5b20}.billing-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:12px}.invoice-head{border-bottom:1px solid var(--line);display:flex;justify-content:space-between;margin-bottom:13px;padding-bottom:15px}.invoice-head p{color:var(--muted);font-size:11px;line-height:1.55}.invoice-totals{margin-left:auto;padding-top:14px;width:270px}.invoice-totals p,.invoice-totals h2{display:flex;justify-content:space-between;margin:7px 0}.invoice-totals h2{border-top:1px solid var(--line);font-size:16px;padding-top:10px}.approval{height:max-content}.approval p{color:var(--muted);font-size:11px;line-height:1.6}.simulation-banner{align-items:center;background:#eaf7ef;border:1px solid #c8ead5;color:#197151;display:flex;gap:10px}.simulation-banner b{background:#1b8a64;border-radius:100px;color:#fff;font-size:9px;letter-spacing:.5px;padding:4px 6px}.myob-layout{display:grid;grid-template-columns:1.12fr .88fr;gap:12px}.map-row{align-items:center;border-bottom:1px solid var(--line);display:grid;font-size:11px;gap:7px;grid-template-columns:1.05fr 1.1fr 20px .9fr;padding:10px 0}.map-row span{color:var(--muted)}.map-row i{color:var(--blue);font-size:15px;font-style:normal}.map-row code{background:#f2f5fa;border-radius:3px;color:#496482;font-size:9px;padding:3px}.payload{background:#102c59;border:0;color:#dceafd}.payload h2{color:#fff}.payload .text-btn{color:#9bc3ff}.payload pre{background:#092248;border-radius:5px;color:#bef0d4;font-size:10px;line-height:1.48;max-height:350px;overflow:auto;padding:12px}.success-copy{color:#a7ebc8;font-size:10px}.toast{background:#123d38;border-radius:5px;bottom:20px;box-shadow:0 8px 24px #0f2e2966;color:#fff;font-size:11px;font-weight:650;padding:10px 13px;position:fixed;right:20px;z-index:5}.line-dialog,dialog{border:0;border-radius:8px;box-shadow:0 20px 70px #08172f55;padding:0;width:min(600px,calc(100% - 30px))}dialog::backdrop{background:#10234366}.line-dialog form,dialog form{padding:20px}.line-dialog h2,dialog h3{color:var(--navy);font-size:16px;margin:0 0 15px}.dialog-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:18px}
@media(max-width:900px){.rail{padding:16px 8px;width:61px}.brand{justify-content:center;margin:0 0 22px}.brand div,.brand b,.rail-bottom{display:none}.brand:before{color:var(--navy);content:'P';font-size:21px;font-weight:900}.nav{font-size:0;justify-content:center;padding:10px}.nav-icon{font-size:16px}main{margin-left:61px}.page-head,.steps{padding-left:22px;padding-right:22px}.promise,.kpis,.card,.detail-grid,.action-grid,.tracking-layout,.billing-layout,.myob-layout{margin-left:22px;margin-right:22px}.tracking-layout,.billing-layout,.myob-layout{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr}.action-grid{grid-template-columns:1fr}.steps{overflow:auto}.site{display:none}}
@media(max-width:640px){header{padding:0 12px}.header-actions .demo-pill{display:none}.page-head{display:block;padding:20px 14px 14px}.page-head .btn{margin-top:11px}.promise,.kpis,.card,.detail-grid,.action-grid,.tracking-layout,.billing-layout,.myob-layout{margin-left:14px;margin-right:14px}.promise{display:block}.promise .btn{margin-top:9px}.kpis{grid-template-columns:1fr}.form-card{margin:0 14px;padding:0 15px}.form-grid,.doc-grid{grid-template-columns:1fr}.field.wide{grid-column:auto}.steps{padding:0 14px}.document{padding:32px 27px}.invoice-head{display:block}.invoice-totals{width:100%}.filters{display:block}.filters label{margin-bottom:8px}.filters input{width:100%}}
@media print{body{background:white}.rail,header,.page-head,.steps,.btn,.toast,dialog{display:none!important}main{margin:0}.doc-wrap{background:white;padding:0}.document{box-shadow:none;min-height:0;padding:18mm 16mm;width:100%}.document footer{margin-top:40px}@page{size:A4;margin:0}}
/* Compact utility treatment from the supplied product mockup. */
header{padding:0 24px}.top-search{align-items:center;background:#f4f7fb;border-radius:4px;color:#7790ad;display:flex;height:26px;padding:0 8px;width:295px}.top-search span{font-size:14px;line-height:1}.top-search input{background:transparent;border:0;font-size:9px;outline:0;padding:4px 6px}.top-search input:focus-visible{outline:0}.header-actions{gap:11px}.notification{color:#27486f;font-size:15px}.avatar{align-items:center;background:#3867d3;border-radius:50%;color:#fff;display:inline-flex;font-size:9px;height:23px;justify-content:center;width:23px}.user-name{color:#264260;font-size:10px;font-weight:700}@media(max-width:640px){.top-search{width:150px}.notification,.user-name,.header-actions .btn.subtle{display:none}}
/* Presentation-scale adjustments: broader canvas, tighter gutters, more legible type. */
body{font-size:13px;line-height:1.5}.page-head{max-width:1500px;padding-left:20px;padding-right:20px}.promise,.kpis,.card,.detail-grid,.action-grid,.steps,.tracking-layout,.billing-layout,.myob-layout,.notice-banner,.simulation-banner{max-width:1500px}.page-head h1{font-size:22px}.page-head p{font-size:13px}.card h2{font-size:16px}.card h3{font-size:15px}.card-title p,.charge-block p,.mapping>p{font-size:12px}table{font-size:12px}th{font-size:10px}td{padding-top:11px;padding-bottom:11px}.nav{font-size:13px}.btn{font-size:13px}.kpis strong{font-size:22px}.kpis small,.kpis span{font-size:11px}.field{font-size:11px}input,select,textarea{font-size:12px}.steps{padding-left:20px;padding-right:20px}.steps button{font-size:11px}.hero-job p,.facts p,.invoice-head p,.approval p{font-size:12px}.action-card b{font-size:14px}.action-card small{font-size:11px}.map-row{font-size:12px}.top-search input{font-size:10px}
/* Higher-contrast presentation palette. */
body{font-size:14px}.page-head h1{font-size:24px}.page-head p{font-size:14px}.card h2{font-size:17px}.card h3{font-size:16px}.card-title p,.charge-block p,.mapping>p{font-size:13px}table{font-size:13px}th{font-size:11px}td{padding-top:12px;padding-bottom:12px}.nav{font-size:14px}.btn{font-size:14px}.kpis strong{font-size:24px}.kpis small,.kpis span{font-size:12px}.field{font-size:12px}input,select,textarea{font-size:13px}.steps button{font-size:12px}.hero-job p,.facts p,.invoice-head p,.approval p{font-size:13px}.action-card b{font-size:15px}.action-card small{font-size:12px}.rail{background:#29313d;border-right-color:#242b35}.brand{color:#fff}.brand b{background:#475569;color:#e6f0ff}.nav{color:#edf2f8}.nav:hover{background:#3b4552;color:#fff}.nav.active{background:#1d232c;color:#fff;box-shadow:inset 3px 0 #4a90ff}.rail-bottom{border-top-color:#46505d}.rail-bottom small{color:#b8c2d0}.demo-data{color:#8ee0bd}.kpis article:nth-child(1){background:linear-gradient(135deg,#eaf2ff,#f9fbff);border-color:#cbdfff}.kpis article:nth-child(2){background:linear-gradient(135deg,#e9fbf2,#fbfffd);border-color:#c3ead5}.kpis article:nth-child(3){background:linear-gradient(135deg,#fff4df,#fffdf9);border-color:#f3dcae}.kpis article:nth-child(1):before{background:#d5e6ff;color:#1465e8}.kpis article:nth-child(2):before{background:#c9f1da;color:#08794f}.kpis article:nth-child(3):before{background:#ffe1a8;color:#a85e00}.action-card:nth-child(1){background:linear-gradient(135deg,#f0f6ff,#fff)}.action-card:nth-child(2){background:linear-gradient(135deg,#ecfbf5,#fff)}.action-card:nth-child(3){background:linear-gradient(135deg,#fff6e6,#fff)}.chip{font-size:11px;font-weight:800;padding:4px 9px}.chip.neutral{background:#dceaff;color:#075fd7}.chip.warning{background:#fff0c9;color:#9a5600}.chip.blue{background:#e8ddff;color:#6236bd}.chip.success{background:#cdf4df;color:#09764b}.approval{background:linear-gradient(180deg,#f7fbff,#fff)}
/* Let the line-item work area lead the page at desktop widths. */
.tracking-layout{grid-template-columns:minmax(0,1fr) 170px;gap:12px}.totals-card{padding:13px}.totals-card h2{font-size:20px}.totals-card>div{font-size:10px}
/* Tracking benefits from a wider canvas than summary-oriented pages. */
.tracking-layout{max-width:1500px;width:calc(100% - 40px);margin-left:auto;margin-right:auto;grid-template-columns:minmax(0,1fr) 170px}@media(max-width:900px){.tracking-layout{width:auto;max-width:1500px;margin-left:22px;margin-right:22px;grid-template-columns:1fr}}@media(max-width:640px){.tracking-layout{margin-left:14px;margin-right:14px}}
.tracking-layout>.charges,.tracking-layout>.totals-card{margin-left:0;margin-right:0;max-width:none;width:100%}
/* Keep invoice review and billing actions aligned as adjacent panels. */
.billing-layout{max-width:1500px;width:calc(100% - 40px);margin-left:auto;margin-right:auto;grid-template-columns:minmax(0,1fr) 240px;gap:12px}.billing-layout>.invoice,.billing-layout>.approval{margin-left:0;margin-right:0;max-width:none;width:100%}@media(max-width:900px){.billing-layout{width:auto;max-width:1500px;margin-left:22px;margin-right:22px;grid-template-columns:1fr}}@media(max-width:640px){.billing-layout{margin-left:14px;margin-right:14px}}
/* Supplied PGA favicon, retained as a direct source URL at the user's request. */
.brand .brand-mark{display:block;width:25px;height:25px;object-fit:contain;flex:0 0 25px}@media(max-width:900px){.brand .brand-mark{display:block}.brand:before{display:none}}
/* Logo-led rail identity: the supplied mark carries the brand, with demo state below. */
.brand{align-items:flex-start;flex-direction:column;gap:6px;margin:4px 10px 26px}.brand .brand-mark{height:76px;width:132px;max-width:100%;object-fit:contain;object-position:left center;flex:none}.brand b{margin-left:0}@media(max-width:900px){.brand{align-items:center;margin:0 0 22px}.brand .brand-mark{height:34px;width:34px}.brand b{font-size:0;padding:0;background:transparent}}
.brand .brand-mark{filter:brightness(0) invert(1)}
