:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:#102b53;background:#eef5fc;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.6}.shell{min-height:100vh}.top{height:68px;background:linear-gradient(110deg,#03499e,#0877d8);color:#fff;display:flex;align-items:center;gap:12px;padding:0 16px;position:sticky;top:0;z-index:5}.top>div{flex:1}.top small,.person small,.line small{display:block;color:#6f849e;font-size:11px;margin-top:3px}.top small{color:#d5e9ff}.iconbutton{border:0;background:transparent;color:inherit;display:flex;align-items:center;justify-content:center;padding:5px}.avatar{background:#2489ef;border-radius:50%;padding:9px 13px}.drawer{width:230px;background:#064b9b;position:fixed;top:68px;bottom:0;left:0;z-index:8;padding:16px 9px;display:none;color:#fff}.drawer h2{font-size:16px;padding:0 12px}.drawer button{display:flex;align-items:center;gap:12px;width:100%;background:transparent;color:#fff;border:0;text-align:left;padding:12px;border-radius:8px}.drawer button.active,.drawer button:hover{background:#0b78df}.drawer.open{display:block}.shade{position:fixed;top:68px;right:0;bottom:0;left:0;background:#0006;z-index:7}main{max-width:1080px;margin:0 auto;padding:18px 14px 100px}.heading{margin-bottom:18px}.heading h1{margin:0;font-size:24px}.heading small{color:#6c83a0}.metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:13px}.metric,section,.loan{background:#fff;border:1px solid #e0eaf5;border-radius:12px;box-shadow:0 2px 8px #16457708}.metric{min-height:105px;padding:12px}.metricicon{color:#0773d9;background:#e6f3ff;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;margin-bottom:7px}.metric small{display:block;color:#6682a1;font-size:11px}.metric strong{display:block;font-size:18px;margin-top:3px;color:#082d63;overflow-wrap:anywhere}section{padding:14px;margin:13px 0}section h3{font-size:15px;margin:0 0 12px}.bars{height:160px;display:flex;align-items:end;justify-content:space-around;border-bottom:1px solid #dde8f3}.barcol{display:flex;align-items:center;flex-direction:column;gap:6px}.bar{width:23px;background:linear-gradient(#48b4fc,#0868c9);border-radius:4px 4px 0 0}.barcol small{color:#6583a4}.actionrow{display:flex;gap:12px;align-items:center;cursor:pointer}.actionrow div{flex:1}.actionrow small{display:block;color:#6f849e}.line{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid #edf1f7}.line:last-child{border-bottom:0}.line>span:last-child{text-align:right}.person{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #eef2f8}.person>div{flex:1}.personicon{background:#e5f3ff;color:#0876d9;border-radius:50%;width:40px;height:40px;display:grid;place-items:center}.click{cursor:pointer}.pill{background:#ddf8e9;color:#13874b;padding:5px 8px;border-radius:8px;font-size:11px}.primary,.smallbtn{border:0;border-radius:7px;background:#076fd2;color:#fff;padding:12px 16px;font-weight:600}.primary{width:100%;margin:8px 0}.smallbtn{padding:8px 11px}.outline{display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid #91c4f6;color:#0867c9;background:#fff;padding:10px;border-radius:8px;width:100%;margin:9px 0}.search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #dce8f7;border-radius:8px;padding:10px}.search input{border:0;outline:0;flex:1;min-width:0}.loan{padding:14px;margin:12px 0}.loan small{color:#6d86a2}.progress{height:8px;background:#e6eef9;border-radius:8px;margin:12px 0;overflow:hidden}.progress i{height:100%;display:block;background:#0c79e2}.bottom{height:67px;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #dbe6f2;display:flex;z-index:6;justify-content:space-around}.bottom button{background:none;border:0;color:#7992ae;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:55px}.bottom button.active{color:#0068cc}.bottom small{font-size:10px}.field{display:flex;flex-direction:column;gap:6px;margin:10px 0;color:#305176;font-size:13px}.field input,.field select,.login input{width:100%;border:1px solid #d4e3f5;border-radius:8px;padding:12px;background:#fff;color:#18345a;min-width:0}.calendar{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;gap:7px}.calendar>*{padding:9px 2px}.calendar b{font-size:11px}.calendar .payday{background:#086ed1;border-radius:50%;color:#fff;font-weight:700}.hint{color:#7186a0;font-size:12px;line-height:1.5}.textbtn,.link{border:0;background:none;color:#096ac9;display:inline-flex;align-items:center;gap:5px}.link{font-size:12px;padding:5px}.danger{color:#dc3949}.error{padding:12px;background:#fff0f0;border:1px solid #f8c6c6;color:#a11e2b;border-radius:8px;margin:12px 0}.modalwrap{position:fixed;top:0;right:0;bottom:0;left:0;background:#001b3970;z-index:15;display:flex;justify-content:center;align-items:center;padding:15px}.modal{width:100%;max-width:470px;max-height:90vh;overflow:auto;background:#fff;border-radius:15px;padding:20px}.modal h2{margin:0;font-size:19px}.login{min-height:100vh;max-width:450px;margin:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:28px;background:linear-gradient(145deg,#eff9ff,#fff)}.login .logo{background:#066dcc;color:#fff;border-radius:17px;padding:19px}.login h1{font-size:30px;line-height:1.12;color:#07366d}.login p{color:#6a85a6;max-width:270px}.login form{width:100%;margin:25px 0}.login input{margin:7px 0}.login small{margin-top:auto;color:#7b91a9}@media(min-width:850px){.drawer{display:block}.top{padding-left:250px}main{margin-left:245px;max-width:none;padding:25px 32px 90px}.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.bottom,.shade{display:none}.drawer.open{display:block}}@media print{.top,.drawer,.bottom,.primary,.outline,.iconbutton{display:none!important}main{margin:0;padding:0}body{background:#fff}}html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}body{min-width:280px;overflow-x:hidden}button,input,select,textarea{touch-action:manipulation}button{min-height:42px}input,select,textarea{max-width:100%;font-size:16px}@media(max-width:600px){main{padding-left:12px;padding-right:12px}.top{padding-left:12px;padding-right:12px}.metric strong{font-size:clamp(14px,4vw,19px)}.line,.person{min-width:0}.line>*{min-width:0;overflow-wrap:anywhere}.bottom{padding-bottom:env(safe-area-inset-bottom);height:calc(67px + env(safe-area-inset-bottom))}main{padding-bottom:calc(110px + env(safe-area-inset-bottom))}}@media(min-width:768px){.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}}