:root{--red:#9c1d21;--red2:#7b1418;--gold:#d1af2b;--blue:#617bbd;--ink:#211315;--muted:#75686a;--cream:#fff7e7;--paper:#fffdf7;--line:rgba(33,19,21,.12);--shadow:0 20px 70px rgba(124,20,24,.16)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'Poppins',system-ui,sans-serif;color:var(--ink);background:radial-gradient(circle at top left,rgba(209,175,43,.28),transparent 28rem),radial-gradient(circle at top right,rgba(97,123,189,.2),transparent 24rem),linear-gradient(135deg,#fff7e7,#fffdf7 45%,#f8ead7);min-height:100vh}button,input,textarea,select{font:inherit}button{cursor:pointer}.app{max-width:1480px;margin:auto;padding:18px;display:grid;gap:16px}.topbar,.card,.quick-stats>div{background:rgba(255,253,247,.9);border:1px solid rgba(255,255,255,.78);box-shadow:var(--shadow);border-radius:26px}.topbar{padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:18px}.eyebrow{margin:0 0 5px;text-transform:uppercase;letter-spacing:.15em;font-size:11px;font-weight:900;color:var(--blue)}h1{font-size:clamp(27px,4vw,50px);line-height:.92;letter-spacing:-.06em;margin:0}.subcopy{margin:8px 0 0;color:var(--muted);font-weight:600}.top-actions{display:flex;gap:10px;flex-wrap:wrap}.btn{border:0;border-radius:999px;padding:11px 16px;font-weight:900;box-shadow:0 10px 25px rgba(33,19,21,.12);white-space:nowrap}.btn.primary{background:var(--red);color:#fff}.btn.gold{background:var(--gold);color:#261900}.btn.ghost{background:#fff;color:var(--red);border:1px solid var(--line)}.btn.mini{padding:8px 12px;font-size:13px}.quick-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.quick-stats>div{padding:14px 16px}.quick-stats span{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:var(--muted)}.quick-stats strong{display:block;font-size:25px;letter-spacing:-.04em;margin-top:2px}.layout{display:grid;grid-template-columns:minmax(420px,.9fr) minmax(540px,1.1fr);gap:16px;align-items:start}.editor,.history,.preview-bar{padding:20px}.preview-col{position:sticky;top:14px;display:grid;gap:12px}.preview-bar{display:flex;justify-content:space-between;align-items:center;gap:10px}.preview-bar h2,.section-title h2{margin:0;letter-spacing:-.04em}.section-title{display:flex;align-items:center;gap:9px;margin:20px 0 10px}.section-title:first-child{margin-top:0}.section-title span{width:28px;height:28px;border-radius:50%;display:inline-grid;place-items:center;background:var(--red);color:#fff;font-weight:900;font-size:13px}.section-title small{color:var(--blue);font-size:13px}.row-between{justify-content:space-between}.row-between>div{display:flex;align-items:center;gap:9px}.form-grid{display:grid;gap:10px}.form-grid.two{grid-template-columns:repeat(2,1fr)}.form-grid.three{grid-template-columns:repeat(3,1fr)}.span-2{grid-column:1/-1}label{display:grid;gap:6px;font-size:12px;font-weight:900;color:#48383a}input,textarea,select{width:100%;border:1px solid var(--line);background:#fff;border-radius:15px;padding:11px 12px;outline:none;color:var(--ink)}textarea{resize:vertical}input:focus,textarea:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(97,123,189,.11)}.items-wrap{overflow:auto;border:1px solid var(--line);border-radius:18px;background:#fff}.items-table{width:100%;border-collapse:collapse;min-width:520px}.items-table th{text-align:left;padding:10px 8px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);background:#f7edd9}.items-table td{padding:8px;border-top:1px solid var(--line)}.items-table td:nth-child(2),.items-table td:nth-child(3){width:105px}.items-table td:last-child{width:42px}.items-table input{border-radius:12px}.icon-btn{width:32px;height:32px;border:0;border-radius:50%;background:#fce3e2;color:var(--red);font-size:20px;font-weight:900}.history-actions{display:flex;gap:8px;flex-wrap:wrap}.history-actions input{min-width:180px}.history-list{display:grid;gap:9px}.history-row{display:grid;grid-template-columns:1.25fr .75fr auto;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:12px}.history-row strong{display:block}.history-row span{font-size:12px;color:var(--muted)}.row-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.import-label{display:inline-flex;align-items:center}.toast{position:fixed;right:18px;bottom:18px;background:var(--ink);color:#fff;border-radius:16px;padding:12px 15px;font-weight:900;box-shadow:var(--shadow);z-index:99}
/* A4 preview */
.invoice-paper{width:min(100%,794px);aspect-ratio:210/297;background:var(--paper);margin:auto;border-radius:16px;box-shadow:0 20px 65px rgba(33,19,21,.18);overflow:hidden;border:1px solid var(--line);display:block}.invoice-head{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;padding:24px 30px 20px;display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.logo-img{width:245px;max-width:48%;display:block}.invoice-title{text-align:right}.invoice-title h3{margin:0;font-size:38px;letter-spacing:-.06em;line-height:.9}.status-chip{display:inline-block;margin-top:8px;border-radius:999px;background:var(--gold);color:#221600;padding:5px 10px;font-size:10px;font-weight:900;text-transform:uppercase}.invoice-body{padding:18px 28px 8px;display:grid;gap:10px}.party-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.box{background:#fff;border:1px solid var(--line);border-radius:13px;padding:10px;min-height:0}.box h4{margin:0 0 4px;color:var(--red);font-size:9px;text-transform:uppercase;letter-spacing:.1em}.box p{margin:1px 0;font-size:11px;line-height:1.28}.meta-line{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:8px 10px;font-size:11px}.meta-line span{white-space:nowrap}.meta-line b,.payment-line b{color:var(--red);font-size:9px;text-transform:uppercase;letter-spacing:.08em}.payment-line{border:1px solid var(--line);border-radius:12px;background:#fff;padding:8px 10px;font-size:11px;line-height:1.3}.preview-items{width:100%;border-collapse:collapse}.preview-items th{background:#f6ead4;color:var(--red);font-size:8.5px;text-transform:uppercase;letter-spacing:.08em;text-align:left;padding:7px 8px}.preview-items td{padding:7px 8px;border-bottom:1px solid var(--line);font-size:11px;vertical-align:top}.preview-items th:nth-child(n+2),.preview-items td:nth-child(n+2){text-align:right}.totals-box{margin-left:auto;min-width:285px;display:grid;gap:0}.totals-box div{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:6px 0;font-size:11px}.totals-box .grand{font-size:18px;font-weight:900;color:var(--red);border:0}.balance-pill{display:flex;justify-content:space-between;background:var(--red);color:#fff;border-radius:999px;padding:8px 11px;font-weight:900;font-size:11px;margin-top:7px}.invoice-foot{padding:6px 28px 16px;color:var(--muted);font-size:9.5px;line-height:1.32}.invoice-foot strong{color:var(--ink)}
@media(max-width:1080px){.layout{grid-template-columns:1fr}.preview-col{position:static}.quick-stats{grid-template-columns:repeat(3,1fr)}}@media(max-width:680px){.app{padding:8px}.topbar{align-items:flex-start;flex-direction:column;padding:16px;border-radius:20px}.top-actions{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}.btn{padding:10px 9px}.quick-stats{grid-template-columns:1fr 1fr 1fr;gap:7px}.quick-stats>div{padding:10px}.quick-stats strong{font-size:17px}.layout{gap:10px}.editor,.history,.preview-bar{padding:14px;border-radius:20px}.form-grid.two,.form-grid.three{grid-template-columns:1fr}.span-2{grid-column:auto}.preview-bar{align-items:flex-start;flex-direction:column}.invoice-paper{border-radius:10px}.invoice-head{padding:16px 18px;align-items:center}.logo-img{width:170px}.invoice-title h3{font-size:25px}.invoice-body{padding:12px;gap:8px}.party-grid{grid-template-columns:1fr}.box{padding:9px}.box p{font-size:10.5px}.meta-line{font-size:9.5px;gap:5px;padding:7px;overflow:auto}.payment-line{font-size:10px;padding:7px}.preview-items th,.preview-items td{padding:6px 5px;font-size:9.5px}.totals-box{min-width:0;width:100%}.invoice-foot{padding:5px 12px 12px}.history-row{grid-template-columns:1fr}}
@page{size:A4;margin:0}@media print{html,body{background:#fff;width:100%;height:auto}.topbar,.quick-stats,.editor,.preview-bar,.history{display:none!important}.app,.layout,.preview-col{display:block!important;padding:0!important;margin:0!important;max-width:none!important}.invoice-paper{width:100%!important;max-width:210mm!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;page-break-inside:avoid!important;break-inside:avoid!important}.invoice-head{padding:10mm 12mm 7mm!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.logo-img{width:58mm!important}.invoice-title h3{font-size:25pt!important}.status-chip{font-size:7pt!important;padding:1.4mm 2.4mm!important}.invoice-body{padding:7mm 10mm 3mm!important;gap:3mm!important}.party-grid{gap:3mm!important}.box{padding:2.6mm!important;border-radius:3mm!important;min-height:0!important}.box p{font-size:7.4pt!important;line-height:1.2!important;margin:.6mm 0!important}.box h4{font-size:6pt!important;margin:0 0 1.2mm!important}.meta-line{padding:2.2mm 2.8mm!important;font-size:7.3pt!important;border-radius:3mm!important}.meta-line b,.payment-line b{font-size:5.8pt!important}.payment-line{padding:2.2mm 2.8mm!important;font-size:7.2pt!important;border-radius:3mm!important}.preview-items th{font-size:5.9pt!important;padding:2mm!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.preview-items td{font-size:7.2pt!important;padding:2.1mm!important}.totals-box{min-width:70mm!important}.totals-box div{font-size:7.4pt!important;padding:1.4mm 0!important}.totals-box .grand{font-size:13pt!important}.balance-pill{font-size:7.4pt!important;padding:2mm 3mm!important;margin-top:1.6mm!important}.invoice-foot{padding:1.5mm 10mm 5mm!important;font-size:6.5pt!important}}