:root{--brand-soft:#e8f2ef;--gold-soft:#fbf2df;--line:#dfe7e4;--radius:18px;--shadow-soft:0 8px 30px rgba(24,55,49,.06)}
.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:1.65rem}.page-heading h1{font-size:clamp(2rem,3vw,2.65rem);letter-spacing:-.045em;margin:.3rem 0}.page-heading p{color:var(--muted);margin:0;line-height:1.6}.heading-actions{display:flex;gap:.7rem}.button{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;border:1px solid transparent;border-radius:12px;padding:.78rem 1rem;font:inherit;font-weight:750;white-space:nowrap}.button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2}.button.primary{background:var(--brand);color:#fff}.button.secondary{background:#fff;color:var(--brand);border-color:var(--line)}.button.quiet{background:var(--brand-soft);color:var(--brand)}.button.light{background:#fff;color:var(--brand-dark)}.text-button{border:0;background:transparent;color:var(--brand);font-weight:750}.icon-button,.row-action{border:0;background:transparent;color:var(--muted);font-size:1.3rem}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-bottom:1.25rem}.metric-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow-soft)}.metric-card:after{content:'';position:absolute;width:70px;height:70px;border-radius:50%;right:-25px;top:-25px;background:#eaf1f8}.metric-card.positive:after{background:var(--brand-soft)}.metric-card.gold:after{background:var(--gold-soft)}.metric-card>span{display:block;color:var(--muted);font-size:.82rem;font-weight:750}.metric-card>strong{display:block;font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.04em;margin:.55rem 0}.metric-card>small{color:var(--muted)}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem;box-shadow:var(--shadow-soft)}.panel-head{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1.2rem}.panel-head h2{font-size:1.1rem;margin:0 0 .3rem}.panel-head p{color:var(--muted);font-size:.85rem;margin:0}.split-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:1rem;margin-bottom:1.25rem}.bar-chart{height:230px;display:flex;align-items:flex-end;gap:1rem;padding:1.5rem .7rem .3rem;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to bottom,transparent 0,transparent 54px,#edf1ef 55px)}.bar-chart i{flex:1;max-width:50px;margin:auto;background:linear-gradient(#2a806f,#175d50);border-radius:8px 8px 2px 2px}.chart-labels{display:flex;justify-content:space-around;color:var(--muted);font-size:.73rem;padding:.65rem}.list>div{display:flex;justify-content:space-between;padding:.95rem 0;border-bottom:1px solid var(--line)}.list span{color:var(--muted)}
.tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:1rem;overflow:auto}.tabs button{border:0;background:transparent;color:var(--muted);padding:.8rem 1rem;font-weight:700;white-space:nowrap;border-bottom:2px solid transparent}.tabs button.active{color:var(--brand);border-bottom-color:var(--brand)}.responsive-table{overflow:auto;margin:0 -1.3rem -1.3rem}.status{display:inline-flex;padding:.28rem .6rem;border-radius:99px;font-size:.72rem;font-weight:800;text-transform:capitalize}.status.success{background:#e5f3ed;color:#17604f}.status.warning{background:#fff3d6;color:#805f18}.status.danger{background:#feeaea;color:#9c3030}.status.neutral{background:#edf1f0;color:#596863}
.progress-row{margin:1rem 0}.progress-row>div:first-child{display:flex;justify-content:space-between;margin-bottom:.45rem}.progress{height:8px;background:#eaf0ed;border-radius:99px;overflow:hidden}.progress i{display:block;height:100%;background:var(--brand)}.timeline>div{display:flex;gap:.8rem;padding:.8rem 0;border-bottom:1px solid var(--line)}.timeline i{width:9px;height:9px;background:var(--accent);border-radius:50%;margin-top:.35rem}.timeline p{margin:0}.timeline strong,.timeline span{display:block}.timeline span{color:var(--muted);font-size:.8rem}
.people-grid{display:grid;gap:.7rem}.people-grid article{display:flex;align-items:center;gap:.8rem;padding:.9rem;border:1px solid var(--line);border-radius:14px}.people-grid article>div{flex:1}.people-grid small{display:block;color:var(--muted)}.avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--brand-soft);color:var(--brand);font-weight:850}.avatar.large{width:62px;height:62px}.payrun{display:grid;grid-template-columns:180px 1fr;align-items:center;gap:2rem}.payrun-ring{width:145px;height:145px;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle,#fff 58%,transparent 59%),conic-gradient(var(--brand) 72%,#e7eeeb 0)}.payrun-ring strong{font-size:1.6rem}.check-list>div{display:flex;justify-content:space-between;padding:.75rem;border-bottom:1px solid var(--line)}
.report-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.report-grid article,.document-grid>article{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem;box-shadow:var(--shadow-soft)}.report-grid p{color:var(--muted);line-height:1.55;min-height:48px}.report-icon,.doc-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:var(--brand-soft);color:var(--brand);font-weight:900}
.settings-layout{display:grid;grid-template-columns:220px 1fr;gap:1rem}.settings-nav{display:flex;flex-direction:column}.settings-nav button{text-align:left;border:0;background:transparent;padding:.8rem 1rem;border-radius:10px;color:var(--muted)}.settings-nav button.active{background:#fff;color:var(--brand);font-weight:750}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.form-grid label{margin:0}.form-grid .wide{grid-column:1/-1}select,textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:.9rem 1rem;background:#fff;font:inherit}textarea{min-height:110px}.logo-upload,.profile-summary{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--canvas);border-radius:14px;margin-bottom:1.3rem}.logo-upload>span{width:66px;height:66px;display:grid;place-items:center;background:var(--brand);border-radius:17px;color:#fff;font-weight:900}
.application-layout{display:grid;grid-template-columns:1fr 300px;gap:1rem}.steps{display:flex;align-items:center;max-width:420px;margin:0 auto 2rem}.steps span{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line)}.steps span.active{background:var(--brand);color:#fff}.steps i{flex:1;height:1px;background:var(--line)}.form-actions{display:flex;justify-content:flex-end;gap:.7rem;margin-top:1.5rem}.summary-card{align-self:start;background:linear-gradient(150deg,#123f37,#1c6b5c);color:#fff}.summary-card>div{display:flex;justify-content:space-between;padding:.9rem 0;border-top:1px solid #ffffff28}
.application-card{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:14px;padding:1rem}.document-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.document-grid>article{display:flex;align-items:center;gap:1rem}.document-grid article>div{flex:1}.empty-state{text-align:center;width:100%}.empty-icon{margin:auto;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--brand-soft);color:var(--brand)}.profile-summary>div{flex:1}.toast{position:fixed;right:1rem;bottom:1rem;z-index:100;background:#173f38;color:#fff;padding:.9rem 1.1rem;border-radius:12px;opacity:0;transform:translateY(20px);transition:.2s}.toast.show{opacity:1;transform:none}
@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.report-grid,.document-grid{grid-template-columns:repeat(2,1fr)}.application-layout,.settings-layout{grid-template-columns:1fr}.settings-nav{flex-direction:row;overflow:auto}}
@media(max-width:760px){.page-heading{align-items:flex-start;flex-direction:column}.split-grid{grid-template-columns:1fr}.report-grid,.document-grid,.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.payrun{grid-template-columns:1fr}.heading-actions{width:100%}}
@media(max-width:520px){.metric-grid{grid-template-columns:1fr}.form-actions{flex-direction:column}.form-actions .button{width:100%}}
.back-site{position:absolute;top:28px;left:32px;color:#d5e7e2;text-decoration:none;font-size:.8rem;font-weight:700}