:root{--ink:#172033;--nav:#101827;--muted:#718096;--line:#e6eaf0;--blue:#3568ff;--soft:#f4f7fb}*{box-sizing:border-box}body{margin:0;background:var(--soft);color:var(--ink);font-family:Arial,Helvetica,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.app{min-height:100vh;display:flex}aside{width:244px;position:fixed;inset:0 auto 0 0;background:linear-gradient(180deg,#111a2a,#0c1320);color:#fff;padding:28px 18px;display:flex;flex-direction:column}.brand,.login-brand{display:flex;align-items:center;gap:12px}.brand{padding:0 8px 30px}.brand b,.login-brand b,.company>b{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#3568ff,#7b55ec);font-size:22px}.brand strong,.brand span,.login-brand strong,.login-brand span{display:block}.brand strong,.login-brand strong{font-size:14px;letter-spacing:.08em}.brand span,.login-brand span{color:#8f9bad;margin-top:3px;font-size:11px}aside nav{display:grid;gap:6px}aside nav a{color:#aeb8c8;text-decoration:none;border-radius:11px;padding:13px 14px}aside nav a:hover,aside nav a.active{color:#fff;background:#1d2a41;box-shadow:inset 3px 0 #5280ff}.aside-foot{margin-top:auto;color:#8692a4;font-size:11px;display:flex;justify-content:space-between}.aside-foot a{color:#9db4ff}main{margin-left:244px;width:calc(100% - 244px);padding:28px 34px 50px}.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.top h1{margin:3px 0;font-size:27px}.top small,.panel-head small,.hero small,.report-head small{font-size:10px;letter-spacing:.18em;color:#8793a5;font-weight:800}.top>div:last-child{display:flex;gap:10px}.primary,.secondary,.button{border:0;border-radius:9px;padding:11px 16px;font-weight:700;text-decoration:none;display:inline-block}.primary{color:#fff;background:var(--blue);box-shadow:0 6px 16px rgba(53,104,255,.2)}.secondary{background:#fff;color:#3f4b60;border:1px solid var(--line)}.hero{min-height:230px;color:#fff;border-radius:18px;padding:34px 38px;display:flex;align-items:end;justify-content:space-between;background:radial-gradient(circle at 80% 0%,rgba(94,129,255,.45),transparent 34%),linear-gradient(120deg,#18233a,#26385e);box-shadow:0 18px 38px rgba(28,44,78,.16)}.hero h2{font-size:35px;line-height:1.08;margin:10px 0 12px}.hero p{color:#b8c5dc;max-width:590px;line-height:1.6;font-size:14px}.hero-button{min-width:235px;border:0;background:#fff;color:#1e2a40;padding:17px 18px;border-radius:12px;font-weight:800}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.stats article{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px}.stats span{display:block;color:var(--muted);font-size:12px;margin-bottom:10px}.stats strong{display:block;font-size:24px}.stats small{display:block;color:#9aa4b4;margin-top:9px}.panel,.result{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 5px 18px rgba(30,45,75,.04)}.panel-head{min-height:78px;padding:18px 21px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.panel-head h3{margin:5px 0 0}.panel-head em{background:#f1f5fb;color:#536176;border-radius:20px;padding:7px 10px;font-size:11px;font-style:normal}.table{overflow:auto}.table table{width:100%;border-collapse:collapse}.table th{color:#8894a6;font-size:10px;letter-spacing:.1em;text-transform:uppercase;text-align:left;padding:12px 18px;background:#fafbfc}.table td{padding:14px 18px;border-top:1px solid #edf0f4;font-size:13px;white-space:nowrap}.table td small{display:block;color:#9aa4b3;margin-top:4px}.table td a,.table td button{border:0;background:none;color:#3568ff;font-weight:700;text-decoration:none}.inline{display:inline;margin-left:10px}.badge{display:inline-block;border-radius:20px;padding:6px 9px;font-size:10px;font-weight:800}.badge.paid{background:#e8fbf2;color:#17865c}.badge.sent{background:#eaf1ff;color:#3568ff}.badge.overdue{background:#ffeded;color:#c54141}.badge.draft{background:#f1f2f5;color:#667085}.badge.cancelled{background:#f3f3f3;color:#777}.empty{text-align:center;padding:60px;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:20px}.cards article{border:1px solid var(--line);border-radius:13px;padding:18px}.cards article>b{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:#eaf0ff;color:#315ed9}.cards h4{margin:12px 0 5px}.cards p{color:var(--muted);font-size:11px}.cards dl{display:grid;grid-template-columns:1fr 1fr;font-size:11px}.cards dt,.cards dd{padding:8px 0;border-top:1px solid #eef1f5}.cards dd{margin:0;text-align:right}.report-head{padding:28px 30px;border-radius:15px;color:#fff;background:linear-gradient(120deg,#253759,#142036)}.report-head h2{margin:9px 0}.report-head p{color:#bdc9dc;font-size:13px}.result{display:flex;align-items:center;justify-content:space-around;padding:28px}.result span{display:block;color:var(--muted);font-size:11px;margin-bottom:7px}.result strong{font-size:25px}.result i{font-size:24px;color:#aaa}.result .highlight{background:#eef3ff;border-radius:12px;padding:16px 24px;color:#2759dd}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:22px}.form-grid label{display:grid;gap:7px;color:#647086;font-size:11px;font-weight:700}.form-grid .wide{grid-column:1/-1}.form-grid input,.form-grid select,.form-grid textarea{border:1px solid #dce2ea;border-radius:8px;padding:11px 12px;background:#fff}.form-grid textarea{min-height:72px}.form-grid .check{display:flex;align-items:center;flex-direction:row}.settings>.primary{align-self:end}.success,.error{border-radius:9px;padding:12px 15px;margin-bottom:16px}.success{background:#e8fbf2;color:#187655}.error{background:#ffeded;color:#a73535}.modal{display:none;position:fixed;inset:0;z-index:50;background:rgba(8,15,28,.65);padding:25px;place-items:center}.modal.show{display:grid}.modal>section{position:relative;width:min(650px,100%);max-height:calc(100vh - 50px);overflow:auto;background:#fff;border-radius:16px;padding:22px;box-shadow:0 30px 80px rgba(0,0,0,.28)}.modal>section.large{width:min(920px,100%)}.modal h2{margin:5px 0}.modal>section>p{color:var(--muted);font-size:12px}.close{position:absolute;right:18px;top:18px;width:35px;height:35px;border:0;border-radius:8px;font-size:20px}.line{display:grid;grid-template-columns:1fr 90px 130px 35px;gap:8px;padding:9px;border:1px solid var(--line);border-bottom:0}.line:first-child{border-radius:9px 9px 0 0}.line input{min-width:0;border:1px solid #dce2ea;border-radius:7px;padding:9px}.line button{border:0;border-radius:7px}.link{border:0;background:none;color:#3568ff;font-weight:700;padding:10px}.login-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#111a2a,#26385e);padding:20px}.login-card{width:min(430px,100%);background:#fff;border-radius:18px;padding:32px;box-shadow:0 30px 80px rgba(0,0,0,.3)}.login-card h1{margin:28px 0 7px}.login-card>p{color:var(--muted);font-size:13px}.login-card form{display:grid;gap:16px;margin-top:24px}.login-card label{display:grid;gap:7px;font-size:12px;font-weight:700}.login-card input{padding:12px;border:1px solid #dce2ea;border-radius:8px}.login-brand b{color:#fff}.invoice-view{background:#dfe4eb;padding:78px 20px 40px}.invoice-tools{position:fixed;z-index:2;inset:0 0 auto;height:58px;background:#111a2a;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 25px}.invoice-tools a{color:#fff;text-decoration:none}.invoice-paper{width:210mm;min-height:297mm;margin:auto;background:#fff;padding:15mm;box-shadow:0 15px 50px rgba(20,30,50,.18)}.invoice-paper>header{display:flex;justify-content:space-between;border-bottom:3px solid #1a2740;padding-bottom:25px}.company{display:flex;gap:12px}.company>b{color:#fff}.company h2{margin:4px 0}.company p{font-size:10px;line-height:1.5;color:#6f7b8d}.invoice-name{text-align:right}.invoice-name span{display:block;font-size:12px;font-weight:800;letter-spacing:.16em;margin-bottom:10px}.invoice-meta{display:grid;grid-template-columns:1fr 280px;gap:40px;padding:30px 0}.invoice-meta small,.payment small{font-size:9px;letter-spacing:.12em;color:#7d899b;font-weight:800}.invoice-meta>div>strong{display:block;margin:9px 0 4px}.invoice-meta p{font-size:10px;line-height:1.6}.invoice-meta dl{display:grid;grid-template-columns:1fr 1fr;margin:0;font-size:10px}.invoice-meta dt,.invoice-meta dd{padding:6px 0;border-bottom:1px solid #edf0f4}.invoice-meta dd{margin:0;text-align:right;font-weight:700}.invoice-table{width:100%;border-collapse:collapse}.invoice-table th{background:#1a2740;color:#fff;padding:10px;font-size:9px;text-align:left}.invoice-table td{padding:12px 10px;font-size:10px;border-bottom:1px solid #edf0f4}.invoice-summary{display:grid;grid-template-columns:1fr 260px;gap:30px;margin-top:25px}.invoice-summary p{font-size:10px;color:#667386}.invoice-summary dl{display:grid;grid-template-columns:1fr 1fr;font-size:10px}.invoice-summary dt,.invoice-summary dd{padding:7px 0}.invoice-summary dd{text-align:right;margin:0}.invoice-summary .total{border-top:2px solid #1a2740;font-size:15px;font-weight:800;padding-top:12px}.payment{margin-top:35px;border:1px solid #dfe4eb;border-radius:8px;padding:17px;display:flex;justify-content:space-between}.payment p{display:grid;grid-template-columns:75px 1fr;font-size:10px;margin:8px 0}.payment>div:last-child{text-align:right}.amount{display:block;color:#2f62e8;font-size:24px;margin-top:9px}.barcode{margin-top:26px;text-align:center}.barcode svg{width:100%;height:58px}.barcode p{font-size:8px;letter-spacing:.08em}.barcode-error{margin-top:25px;padding:12px;background:#fff6e6;color:#916012;font-size:10px;text-align:center}.invoice-paper footer{margin-top:28px;border-top:1px solid #dfe4eb;padding-top:12px;display:flex;justify-content:space-between;color:#7c8797;font-size:8px}
@media print{body{background:#fff;padding:0}.invoice-tools{display:none}.invoice-paper{box-shadow:none;margin:0;width:210mm;min-height:297mm}}@media(max-width:900px){aside{width:82px;padding:24px 10px}.brand div{display:none}.brand{padding:0 10px 28px}aside nav a{font-size:0;text-align:center}aside nav a::first-letter{font-size:18px}main{margin-left:82px;width:calc(100% - 82px);padding:22px}.stats{grid-template-columns:1fr 1fr}.cards{grid-template-columns:1fr 1fr}.hero{align-items:start;flex-direction:column;gap:20px}}@media(max-width:620px){aside{inset:auto 0 0;width:100%;height:66px;padding:7px}aside .brand,.aside-foot{display:none}aside nav{grid-template-columns:repeat(6,1fr);gap:2px}aside nav a{padding:9px 2px;font-size:0}main{margin:0;width:100%;padding:16px 12px 88px}.top h1{font-size:22px}.top .secondary{display:none}.hero{padding:24px;min-height:300px}.hero h2{font-size:28px}.hero-button{width:100%}.stats,.cards{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr;padding:12px}.form-grid .wide{grid-column:1}.modal{padding:8px}.line{grid-template-columns:1fr 60px 85px 30px}.invoice-paper{transform:scale(.46);transform-origin:top left;margin:0}.invoice-view{padding:68px 6px}.invoice-tools strong{display:none}}