@import "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap";*{box-sizing:border-box}body{color:#edf4fb;background:#070b11;margin:0;font-family:Manrope,Arial,sans-serif}.login{background:url(/kinwash.png) 50%/cover;place-items:center;min-height:100vh;display:grid}.loginShade{-webkit-backdrop-filter:saturate(.7);backdrop-filter:saturate(.7);background:linear-gradient(90deg,#04070bfa 0%,#04080de8 44%,#030a115c);position:absolute;inset:0}.loginCard{width:min(520px,90vw);margin-right:40%;padding:42px;position:relative}.brand{letter-spacing:-2px;font-size:32px;font-style:italic}.brand b{font-weight:800}.brand span{color:#16bceb;font-weight:500}.brand.small{padding:10px 12px 30px;font-size:24px}.eyebrow{color:#25c7f2;letter-spacing:2.4px;font-size:11px;font-weight:800}.login h1{letter-spacing:-2px;margin:18px 0;font-size:48px;line-height:1.05}.muted,.panelHead p{color:#8492a5;line-height:1.7}.roleCards{grid-template-columns:1fr 1fr;gap:12px;margin:30px 0 16px;display:grid}.roleCards button{color:#fff;text-align:left;cursor:pointer;background:#0d141e;border:1px solid #1d2a39;border-radius:14px;padding:18px}.roleCards button:hover{border-color:#19bde9;transform:translateY(-2px)}.roleCards i{color:#19bde9;margin-bottom:15px;font-size:22px;display:block}.roleCards strong,.roleCards small{display:block}.roleCards small{color:#738195;margin-top:7px;font-size:10px}.login input,.modal input,.modal select{color:#fff;background:#0c131d;border:1px solid #263343;border-radius:10px;outline:none;width:100%;padding:14px}.login input:focus,.modal input:focus{border-color:#17bde9}.hint{color:#607085;margin-top:12px;display:block}.shell{grid-template-columns:230px 1fr;min-height:100vh;display:grid}aside{background:#080d14;border-right:1px solid #18212d;flex-direction:column;width:230px;padding:24px 16px;display:flex;position:fixed;inset:0 auto 0 0}nav{gap:7px;display:grid}nav button{color:#77869a;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:9px;padding:12px 14px;font:600 13px Manrope}nav button span{width:30px;display:inline-block}nav button.active{color:#22c7f4;background:#122432}.profile{border-top:1px solid #18212d;align-items:center;gap:10px;margin-top:auto;padding-top:18px;display:flex}.profile>div{color:#27c8f1;background:#143245;border-radius:9px;place-items:center;width:34px;height:34px;font-size:11px;display:grid}.profile p{flex:1;margin:0}.profile b,.profile small{font-size:11px;display:block}.profile small{color:#657488;margin-top:3px}.profile button{color:#8090a2;background:0 0;border:0}.content{grid-column:2;width:100%;max-width:1600px;padding:34px 42px}header{justify-content:space-between;align-items:center;margin-bottom:28px;display:flex}header h2{margin:5px 0;font-size:28px}.headActions{align-items:flex-end;gap:10px;display:flex}.monthPick{gap:5px;display:grid}.monthPick span{color:#718095;letter-spacing:1px;text-transform:uppercase;font-size:9px;font-weight:800}.monthPick select{color:#dce8f3;cursor:pointer;background:#101720;border:1px solid #223040;border-radius:9px;outline:none;min-width:170px;padding:10px 34px 10px 12px;font:700 12px Manrope}.monthPick select:focus{border-color:#19bee9}button{transition:all .2s}.ghost,.primary{cursor:pointer;border-radius:9px;padding:11px 16px;font:700 12px Manrope}.ghost{color:#b9c6d5;background:#101720;border:1px solid #223040}.primary{color:#041017;background:#19bee9;border:1px solid #19bee9}.hero{background:linear-gradient(105deg,#102b3d,#0d1b28 55%,#0c1520);border:1px solid #174158;border-radius:18px;justify-content:space-between;align-items:center;padding:30px 34px;display:flex;position:relative;overflow:hidden}.hero:after{content:"";border:60px solid #17beea0d;border-radius:50%;width:350px;height:350px;position:absolute;right:-90px}.hero p,.stat p{color:#8796a8;letter-spacing:1.2px;font-size:10px;font-weight:800}.hero h3{margin:8px 0;font-size:38px}.hero small,.stat small{color:#68788c}.split{z-index:1;gap:40px;display:flex}.split span{display:grid}.split b{color:#1cc6f3;font-size:28px}.split small{margin-top:6px}.stats{grid-template-columns:repeat(4,1fr);gap:13px;margin:14px 0;display:grid}.stats.compact{grid-template-columns:repeat(2,minmax(220px,340px))}.stat,.panel{background:#0c121b;border:1px solid #192432;border-radius:14px;padding:20px}.stat h3{margin:9px 0;font-size:21px}.stat.blue h3{color:#21c7f2}.stat.green h3{color:#48d89a}.grid{grid-template-columns:2fr 1fr;gap:14px;display:grid}.panelHead{justify-content:space-between;display:flex}.panelHead h3,.panelHead p{margin:0}.panelHead p{margin-top:5px;font-size:11px}.chart{border-bottom:1px solid #283443;align-items:end;gap:16px;height:210px;padding-top:25px;display:flex}.chart>div{flex-direction:column;flex:1;justify-content:end;align-items:center;gap:8px;height:100%;display:flex}.chart span{background:linear-gradient(#21c9f5,#116a89);border-radius:5px 5px 0 0;width:70%}.chart small{color:#69798d;font-size:9px}.donut{background:conic-gradient(#21c8f2 0 60%,#27536d 60%);border-radius:50%;place-items:center;width:150px;height:150px;margin:16px auto;display:grid}.donut:after{content:"";background:#0c121b;border-radius:50%;width:100px;height:100px;position:absolute}.donut div{z-index:1;text-align:center}.donut b,.donut small{display:block}.donut small{color:#77879b;font-size:9px}.legend{gap:10px;display:grid}.legend span{color:#7f8fa1;align-items:center;gap:8px;font-size:10px;display:flex}.legend i{background:#27536d;border-radius:50%;width:7px;height:7px}.legend i.cyan{background:#21c8f2}.legend b{color:#dfe8f1;margin-left:auto}.table{padding:0;overflow:auto}.table table{border-collapse:collapse;width:100%}.table th,.table td{text-align:left;white-space:nowrap;border-bottom:1px solid #182330;padding:17px 20px}.table th{color:#718095;letter-spacing:1px;font-size:9px}.table td{color:#a8b6c7;font-size:12px}.table tr:last-child td{border:0}.table b{color:#eaf4fc}.red{color:#ff7081!important}.list{max-width:700px}.list h3{margin-top:0}.list>div{border-top:1px solid #1b2633;gap:18px;padding:16px 3px;display:flex}.list span{color:#20c5f1}.overlay{z-index:10;background:#03060acf;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{background:#0d141e;border:1px solid #263343;border-radius:18px;width:min(570px,100%);padding:28px;position:relative}.modal h2{margin-top:5px}.x{color:#8c9bad;cursor:pointer;background:0 0;border:0;font-size:24px;position:absolute;top:18px;right:20px}.formGrid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.formGrid label{color:#8997a8;font-size:10px;font-weight:700}.formGrid input,.formGrid select{margin-top:7px}.save{width:100%;margin-top:20px}@media (width<=900px){.shell{grid-template-columns:1fr}aside{flex-direction:row;align-items:center;width:100%;height:auto;padding:12px;position:static;overflow:auto}aside .brand{padding:0 20px 0 0}nav{display:flex}.profile{display:none}.content{grid-column:1;padding:22px}.stats{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}.loginCard{margin:0}.loginShade{background:#03070be6}}@media (width<=580px){header{align-items:flex-start;gap:15px}.headActions{flex-direction:column}.hero{flex-direction:column;align-items:flex-start;gap:25px}.stats,.stats.compact,.formGrid{grid-template-columns:1fr}.login h1{font-size:38px}.roleCards{grid-template-columns:1fr}nav button{font-size:0}nav button span{width:auto;font-size:18px}.content{padding:16px}}
