:root{--n:#06203E;--t:#0BB4B5;--l:#B1D236;--bg:#F2F5F8;--b:#DAE3EA;--tx:#1B2B3C;--mu:#667889}
*{box-sizing:border-box}body{margin:0;font:14px/1.5 Inter,sans-serif;color:var(--tx);background:var(--bg)}
h1,h2,h3{font-family:Outfit,sans-serif;margin:0;color:var(--n)}h2{font-size:24px}h3{font-size:16px;margin-bottom:12px}
a{color:var(--t);text-decoration:none}
.btn{background:var(--t);color:#fff;border:0;padding:9px 18px;border-radius:6px;font:600 14px Inter;cursor:pointer;display:inline-block}
.btn:hover{background:var(--n)}.btn.o{background:#fff;color:var(--n);border:1px solid var(--b)}.btn.o:hover{border-color:var(--t)}.btn.d{background:#fff;color:#b3261e;border:1px solid var(--b)}
.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--t);outline-offset:2px}
label{display:block;font-weight:500;font-size:13px;color:var(--mu)}
input,select,textarea{width:100%;margin-top:4px;padding:8px 10px;border:1px solid var(--b);border-radius:6px;font:14px Inter;color:var(--tx);background:#fff}
#login{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}
.lp{background:var(--n);color:#fff;padding:64px;display:flex;flex-direction:column;justify-content:flex-end;border-bottom:8px solid var(--l)}
.lp h1{color:#fff;font-size:40px;line-height:1.15;max-width:420px}.lp p{color:#b9c8d8;max-width:380px}
.rp{display:flex;align-items:center;justify-content:center;padding:32px;background:#fff}
.rp form{width:100%;max-width:340px;display:grid;gap:14px}.rp img{width:260px;max-width:100%}
.err{color:#b3261e;font-size:13px;min-height:18px}
#app{display:none;min-height:100vh}#bye{display:none;min-height:100vh;align-items:center;justify-content:center;text-align:center;background:#fff}
aside{position:fixed;inset:0 auto 0 0;width:230px;background:var(--n);display:flex;flex-direction:column}
aside .lg{background:#fff;padding:16px 14px;border-bottom:4px solid var(--l)}aside .lg img{width:100%}
aside nav{padding:14px 0;flex:1}aside nav a{display:block;padding:10px 20px;color:#c4d2e0;border-left:4px solid transparent}
aside nav a:hover{color:#fff}aside nav a.on{color:#fff;background:rgba(11,180,181,.18);border-left-color:var(--t)}
aside .sep{margin:12px 20px 4px;font-size:12px;color:#7d92a8}
main{margin-left:230px;padding:28px 32px;max-width:1200px}
.ph{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:12px;flex-wrap:wrap}
.card{background:#fff;border:1px solid var(--b);border-radius:8px;padding:18px;margin-bottom:18px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.g2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.stat{background:#fff;border:1px solid var(--b);border-left:5px solid var(--t);border-radius:8px;padding:16px}
.stat:nth-child(1){border-left-color:var(--n)}.stat:nth-child(3){border-left-color:var(--l)}
.stat b{display:block;font:600 26px Outfit;color:var(--n)}.stat span{color:var(--mu)}
.tw{overflow-x:auto}table{width:100%;border-collapse:collapse}
th{background:var(--n);color:#fff;text-align:left;padding:9px 10px;font-weight:600;font-size:13px;white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--b)}tr:hover td{background:#fafcfd}.r{text-align:right}
.it td{padding:6px;vertical-align:top}.it input,.it select{margin:0 0 4px}.it th{background:var(--t)}
.tots{margin-left:auto;max-width:340px}.tots div{display:flex;justify-content:space-between;padding:5px 0}
.tots .tt{border-top:2px solid var(--n);font:600 18px Outfit;color:var(--n);margin-top:6px;padding-top:8px}
.empty{text-align:center;color:var(--mu);padding:28px}
/* invoice sheet */
#inv{background:#fff;max-width:820px;margin:0 auto;padding:26px;border:1px solid var(--b);font-size:11.5px;line-height:1.45}
#inv .hd{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}#inv .hd img{width:210px}
#inv .co{text-align:right}#inv .co b{font:700 17px Outfit;color:var(--n)}#inv .ph1{color:var(--t);font-weight:700;margin:6px 0 2px}
#inv .bar{height:7px;margin:14px 0;background:linear-gradient(90deg,var(--n) 0 45%,var(--t) 45% 75%,var(--l) 75%)}
#inv h2{text-align:center;font-size:20px;margin:6px 0 10px}
#inv table{border:1px solid var(--b)}#inv td,#inv th{padding:5px 7px;border:1px solid var(--b);font-size:11.5px}
#inv th{background:var(--t);color:#fff}#inv .m td.k{background:var(--t);color:#fff;font-weight:600;width:14%}
#inv .nv{background:var(--n);color:#fff;font-weight:700;padding:5px 7px}#inv .tl{background:var(--t);color:#fff;font-weight:700;padding:5px 7px}
#inv .two{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--b);margin-bottom:14px}#inv .two>div{padding:0 0 8px}#inv .two p{margin:4px 7px}
#inv .bt{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:14px}
#inv .tr{display:grid;grid-template-columns:42% 58%;border-bottom:1px solid var(--b)}#inv .tr span:last-child{text-align:right;padding:5px 7px;font-weight:600}
#inv .tr.f span:last-child{background:#eef5cf}#inv .tr.f span:first-child{background:var(--l);color:var(--n)}
#inv .sg{text-align:right;margin-top:14px}#inv .qr{width:90px;margin:8px 7px}#inv .ft{text-align:center;font-weight:600;margin-top:30px}
@media(max-width:860px){#login{grid-template-columns:1fr}.lp{display:none}aside{position:static;width:auto;flex-direction:row;flex-wrap:wrap}aside .lg{width:100%}aside nav{display:flex;flex-wrap:wrap;padding:4px}aside .sep{display:none}main{margin:0;padding:18px}#app{display:block}.g4,.stats,.g2{grid-template-columns:1fr 1fr}}
@media print{aside,.ph,.noprint{display:none!important}main{margin:0;padding:0;max-width:none}body{background:#fff}#inv{border:0;padding:0;max-width:none}@page{size:A4;margin:10mm}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}