*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f4f7fb;color:#172033}.app{display:grid;grid-template-columns:245px 1fr;min-height:100vh}aside{background:#061f3b;color:white;padding:28px 18px;display:flex;flex-direction:column}.logo{width:175px;background:white;border-radius:12px;padding:8px;margin:0 auto 34px}.nav{width:100%;border:0;background:transparent;color:#9fb0c4;text-align:left;padding:14px 16px;border-radius:10px;font-size:15px;margin:3px 0;cursor:pointer}.nav.active,.nav:hover{background:#123b64;color:white}.nav span{margin-left:10px}.user{margin-top:auto;display:flex;gap:10px;align-items:center;padding:14px 8px;border-top:1px solid #29425d}.user small{display:block;color:#9fb0c4;margin-top:3px}.avatar{width:38px;height:38px;border-radius:50%;background:#1e5c91;display:grid;place-items:center;font-size:12px;font-weight:700}main{padding:34px 42px;max-width:1500px;width:100%;margin:auto}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}h1{margin:0;font-size:28px}header p,.modalhead p{margin:6px 0 0;color:#7d8899}.primary,.secondary{border:0;border-radius:9px;padding:12px 17px;font-weight:650;cursor:pointer}.primary{background:#082e55;color:white}.secondary{background:white;border:1px solid #dce2e9;color:#24364b}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card,.panel{background:white;border:1px solid #e4e9ef;border-radius:14px;box-shadow:0 3px 14px #18324c0a}.card{padding:20px}.card span{color:#7d8899;font-size:13px}.card strong{display:block;font-size:26px;margin:11px 0}.card em{font-style:normal;color:#718096;font-size:12px}.good{color:#16855b!important}.bad{color:#c04444!important}.panel{margin-top:22px;overflow:hidden}.panelhead{padding:19px 21px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #edf0f4}.panelhead h2{font-size:17px;margin:0}.link{border:0;background:none;color:#1a5b91;cursor:pointer}.row{display:grid;grid-template-columns:120px 1.3fr 1fr 130px 110px;align-items:center;padding:16px 21px;border-bottom:1px solid #f0f2f5;font-size:14px}.row:last-child{border-bottom:0}.row b{color:#17324e}.status{justify-self:start;padding:6px 10px;border-radius:20px;font-size:12px;font-weight:650}.paid{background:#e8f7f0;color:#14724f}.waiting{background:#fff5d9;color:#946b00}.late{background:#fdecec;color:#ad3636}.toolbar{display:flex;gap:12px;margin-bottom:16px}.toolbar input{flex:1}.toolbar input,.toolbar select,.form input,.form select{border:1px solid #dce2e9;border-radius:9px;padding:12px;background:white;font:inherit}.page{display:none}.page.active{display:block}.clientrow{display:flex;justify-content:space-between;padding:17px 21px;border-bottom:1px solid #edf0f4}.clientrow small{display:block;color:#7d8899;margin-top:4px}.modal{position:fixed;inset:0;background:#0a1728aa;display:none;align-items:center;justify-content:center;padding:20px}.modal.show{display:flex}.modalbox{background:white;width:min(720px,100%);border-radius:16px;box-shadow:0 30px 70px #0004}.modalhead{display:flex;justify-content:space-between;padding:23px 25px;border-bottom:1px solid #e8ecf1}.modalhead h2{margin:0;font-size:21px}.x{font-size:28px;background:none;border:0;cursor:pointer;color:#788597}.form{padding:24px 25px;display:grid;grid-template-columns:repeat(2,1fr);gap:17px}.form label{font-size:13px;font-weight:650;color:#526173;display:flex;flex-direction:column;gap:7px}.wide{grid-column:1/-1}.summary{background:#f6f8fb;border-radius:10px;padding:16px}.summary div{display:flex;justify-content:space-between;padding:5px}.summary .total{border-top:1px solid #dfe5ec;margin-top:6px;padding-top:12px;font-size:17px;color:#092f56}.actions{padding:18px 25px;border-top:1px solid #e8ecf1;display:flex;justify-content:flex-end;gap:10px}.toast{position:fixed;right:25px;bottom:25px;background:#112d49;color:white;padding:14px 18px;border-radius:10px;opacity:0;transform:translateY(15px);transition:.2s}.toast.show{opacity:1;transform:none}@media(max-width:850px){.app{grid-template-columns:1fr}aside{position:fixed;z-index:10;bottom:0;left:0;right:0;height:70px;padding:8px 12px;flex-direction:row;align-items:center}.logo,.user{display:none}nav{display:flex;width:100%;justify-content:space-around}.nav{width:auto;text-align:center;margin:0;padding:10px 18px}.nav span{display:block;margin:3px 0 0;font-size:11px}main{padding:22px 16px 90px}header{align-items:flex-start}header p{display:none}h1{font-size:24px}.primary{padding:11px 13px}.stats{grid-template-columns:1fr 1fr;gap:10px}.card{padding:15px}.card strong{font-size:21px}.row{grid-template-columns:85px 1fr 95px}.row .hide-mobile{display:none}.toolbar{flex-direction:column}.form{grid-template-columns:1fr}.wide{grid-column:auto}.modal{align-items:flex-end;padding:0}.modalbox{border-radius:18px 18px 0 0;max-height:92vh;overflow:auto}}
.notice{background:#eef5fb;border:1px solid #d7e7f5;color:#315a7e;padding:12px 15px;border-radius:10px;margin-bottom:16px;font-size:13px}.muted{color:#8995a5;font-size:13px}.empty{padding:28px;text-align:center;color:#8995a5}.invoice-row{cursor:pointer}.invoice-row:hover{background:#f8fafc}.row small{display:block;color:#8995a5;margin-top:4px}
.sectiontop{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px}.sectiontop h2{margin:0 0 5px}.monthselect{border:1px solid #dce2e9;border-radius:9px;padding:11px 13px;background:#fff;font:inherit}.expense-row{display:grid;grid-template-columns:110px 1.4fr 1fr 130px 130px 42px;gap:12px;align-items:center;padding:15px 21px;border-bottom:1px solid #edf0f4;font-size:14px}.expense-row small{display:block;color:#8995a5;margin-top:3px}.delete-exp{border:0;background:#fdecec;color:#ad3636;border-radius:8px;width:32px;height:32px;cursor:pointer}.vat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.vatcard.result{border-color:#b9cee2;background:#f7fbff}.vatcard.result strong{color:#082e55}.vat-info{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#edf0f4}.vat-info div{background:white;padding:20px}.vat-info span{display:block;color:#7d8899;font-size:12px;margin-bottom:7px}.vat-warning{margin:18px;background:#fff8e7;border:1px solid #f1dfac;color:#735d20;padding:13px 15px;border-radius:9px;font-size:13px;line-height:1.5}.vatdetail{overflow:hidden}@media(max-width:850px){.sectiontop{align-items:flex-start;flex-direction:column}.vat-grid{grid-template-columns:1fr}.vat-info{grid-template-columns:1fr}.expense-row{grid-template-columns:90px 1fr 100px}.expense-row .exp-hide{display:none}}

/* v2.5 – mobile invoice modal fix */
.modal{z-index:100}
@media(max-width:850px){
  .modal{align-items:stretch;justify-content:flex-end;padding:0;overflow:hidden}
  .modalbox{width:100%;max-height:100dvh;height:auto;display:flex;flex-direction:column;overflow:hidden;border-radius:18px 18px 0 0}
  .modalhead{flex:0 0 auto;padding:18px 18px 14px}
  .form{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:18px 18px 24px}
  .actions{position:relative;z-index:2;flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#fff;padding:12px 16px calc(12px + env(safe-area-inset-bottom));box-shadow:0 -8px 22px rgba(10,23,40,.08)}
  .actions button{width:100%;min-height:46px}
}
@media(max-width:430px){
  .modalhead h2{font-size:18px}
  .modalhead p{font-size:12px}
  .form{gap:13px}
  .actions{grid-template-columns:1fr}
}
/* v3.0 – projects */
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.project-card{cursor:pointer}.project-card:hover{border-color:#b9cee2}.project-card h3{margin:0 0 5px;font-size:17px}.project-card .proj-status{font-size:11px;padding:5px 8px;border-radius:12px;background:#eef5fb;color:#315a7e;float:right}.project-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.project-kpis .card strong{font-size:20px}.profit-good{color:#16855b!important}.profit-bad{color:#c04444!important}.project-table{margin-top:18px}.assign-row{display:grid;grid-template-columns:110px 1.5fr 140px 1fr;gap:12px;align-items:center;padding:12px 18px;border-bottom:1px solid #edf0f4;font-size:13px}.assign-row select{border:1px solid #dce2e9;border-radius:8px;padding:8px;background:#fff;max-width:100%}.category-bars{padding:18px 21px}.category-line{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #f0f2f5}.smallmodal{max-width:620px}
@media(max-width:1000px){.project-grid{grid-template-columns:1fr 1fr}.project-kpis{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.project-grid{grid-template-columns:1fr}.assign-row{grid-template-columns:80px 1fr}.assign-row .assign-amount{display:none}.project-kpis{grid-template-columns:1fr 1fr}.nav{padding:8px 10px}}

.invoice-row{position:relative}
.invoice-delete{border:0;background:#fff1f1;color:#b42318;width:30px;height:30px;border-radius:8px;font-size:20px;line-height:28px;cursor:pointer;font-weight:700}
.invoice-delete:hover{background:#fee4e2}
@media(max-width:700px){
  .invoice-delete{width:34px;height:34px;min-width:34px}
}

.clientrow{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 18px;border-bottom:1px solid #edf0f4}
.clientrow:last-child{border-bottom:0}
.clientrow small{display:block;color:#7b8492;margin-top:4px}
.client-contact{display:flex;flex-direction:column;align-items:flex-end;gap:3px;color:#586274;font-size:13px}
@media(max-width:700px){
 .clientrow{align-items:flex-start}
 .client-contact{align-items:flex-start;font-size:12px}
}

#invoiceNo{font-weight:700;letter-spacing:.3px}

.expense-file-label input[type=file]{padding:10px;background:#f8fafc}
.expense-file-label small{display:block;margin-top:6px}
.file-exp{border:0;background:#eef4ff;color:#244a8f;width:34px;height:34px;border-radius:8px;cursor:pointer;font-size:16px}
.file-exp:hover{background:#dfeaff}
@media(max-width:700px){
 .file-exp,.delete-exp{min-width:34px}
}

.cloud-notice{background:#eef7ff;border-color:#cfe6ff;color:#244a70}
.user-meta{min-width:0}.user-meta a{display:inline-block;margin-right:8px;margin-top:4px;color:#9fb1c5;font-size:11px;text-decoration:none}.user-meta a:hover{color:#fff}
.auth-body{min-height:100vh;margin:0;background:#f1f4f8;display:flex;align-items:center;justify-content:center;font-family:Inter,Arial,sans-serif;color:#172033;padding:24px}
.auth-card,.users-card{width:min(460px,100%);background:#fff;border-radius:18px;padding:30px;box-shadow:0 20px 60px #0c20351a}.auth-card img{width:230px;max-width:70%;display:block;margin:0 auto 28px}.auth-card h1,.users-card h1{margin:0 0 8px}.auth-card p,.users-card p{color:#6f7887}.auth-card form,.user-create{display:grid;gap:14px;margin-top:22px}.auth-card label,.user-create label{display:grid;gap:7px;font-weight:600;font-size:13px}.auth-card input,.user-create input,.user-create select{border:1px solid #d9dee6;border-radius:10px;padding:12px 13px;font:inherit}.auth-error,.auth-ok{padding:12px;border-radius:10px;margin:14px 0;font-size:13px}.auth-error{background:#fff0f0;color:#a32929}.auth-ok{background:#edf9f1;color:#26713d}.setup-link{text-align:center;font-size:13px}.setup-link a{color:#173f72}.users-card{width:min(760px,100%)}.users-head{display:flex;justify-content:space-between;gap:20px;align-items:center}.secondary-link{color:#244a70;text-decoration:none}.user-list{margin:20px 0 28px;border:1px solid #e5e9ef;border-radius:12px;overflow:hidden}.user-list>div{display:grid;grid-template-columns:1.2fr 1.5fr .6fr;gap:12px;padding:13px 15px;border-bottom:1px solid #edf0f4}.user-list>div:last-child{border-bottom:0}.user-list span,.user-list em{font-size:13px;color:#6d7785}.user-create{grid-template-columns:1fr 1fr}.user-create button{grid-column:1/-1}
@media(max-width:650px){.user-create{grid-template-columns:1fr}.users-head{align-items:flex-start;flex-direction:column}.user-list>div{grid-template-columns:1fr}}

.invoice-status{border:1px solid transparent;cursor:pointer;appearance:auto;padding:7px 10px;min-width:118px;font-weight:700}
.invoice-status.paid{background:#e9f8ee;color:#28733d}
.invoice-status.late{background:#fff0f0;color:#a52c2c}
.invoice-status.waiting{background:#fff7df;color:#946200}
.invoice-status.paused{background:#eef1f5;color:#596372}
.invoice-status.cancelled{background:#f2f2f2;color:#777;text-decoration:line-through}
@media(max-width:700px){.invoice-status{min-width:105px;font-size:12px;padding:7px 6px}}