:root{--nav:#0b1f33;--accent:#12a594;--bg:#f3f6f9;--text:#233142;--line:#dce4eb}
*{box-sizing:border-box}body{margin:0;font:14px/1.45 Arial,sans-serif;background:var(--bg);color:var(--text)}
.app{display:grid;grid-template-columns:250px 1fr;min-height:100vh}.sidebar{background:var(--nav);color:white;padding:22px;display:flex;flex-direction:column}
.brand{font-size:22px;font-weight:800;margin-bottom:25px}.brand span{background:var(--accent);padding:5px;border-radius:7px}
.user{padding:12px;background:#ffffff10;border-radius:9px;margin-bottom:15px}.user small,td small,.dochead small{display:block;opacity:.7}
nav{display:grid;gap:4px;flex:1}nav a,.linkbtn{color:#dbe8f2;text-decoration:none;padding:10px;border-radius:7px;background:none;border:0;text-align:left;width:100%;cursor:pointer}
nav a:hover,.linkbtn:hover{background:#ffffff15}main header{height:72px;background:white;border-bottom:1px solid var(--line);padding:0 28px;display:flex;align-items:center}h1{font-size:22px}.content{padding:24px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:18px}.card{background:white;border:1px solid var(--line);border-radius:12px;padding:18px;overflow:auto;box-shadow:0 3px 10px #1231}.metric strong{font-size:32px;color:var(--accent)}.metric span{display:block}
.grid2{display:grid;grid-template-columns:1fr 2fr;gap:18px}.flow{font-size:18px;padding:28px;background:#edf9f7;border-radius:10px}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px;border-bottom:1px solid var(--line);vertical-align:top}th{font-size:12px;text-transform:uppercase;color:#64778a}
label{display:block;margin:10px 0;font-weight:600}input,select,textarea{width:100%;padding:10px;border:1px solid #cdd8e1;border-radius:7px;margin-top:4px;background:white}
button,.button{display:inline-block;border:1px solid #c9d3dc;background:white;padding:9px 13px;border-radius:7px;text-decoration:none;color:var(--text);cursor:pointer}.primary{background:var(--accent);color:white;border-color:var(--accent)}.full{width:100%}
.toolbar{display:flex;gap:10px;justify-content:flex-end;margin-bottom:14px}.toolbar input{width:auto}.inline{display:flex;gap:6px}.inline input{width:110px;margin:0}.badge{background:#e8f5f3;color:#087c70;padding:4px 8px;border-radius:999px;font-size:12px}
.alert{padding:12px;border-radius:8px;background:#fff6d9;margin-bottom:14px}.alert.success{background:#e5f8f1}.alert.error{background:#ffe7e7;color:#a40000}
.login-wrap{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#0b1f33,#0e8178)}.login-card{width:min(390px,92vw);background:white;padding:32px;border-radius:18px;box-shadow:0 20px 60px #0005}.login-logo{font-size:32px;font-weight:900}.login-logo span{color:var(--accent)}
.dochead{display:flex;justify-content:space-between;margin-bottom:15px}.variance{background:#fff1f1}
@media(max-width:900px){.app{grid-template-columns:1fr}.sidebar{position:relative}.cards{grid-template-columns:1fr 1fr}.grid2{grid-template-columns:1fr}}