*{box-sizing:border-box}body{margin:0;background:#f3f6f7;color:#17333f;font:16px/1.5 'Segoe UI',Arial,sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}aside{position:fixed;width:248px;height:100vh;background:#112d38;color:#d2e0e5;padding:32px 24px;display:flex;flex-direction:column}.brand{color:white;text-decoration:none;font-size:23px;font-weight:700;letter-spacing:-1px}.brand>span:last-child{font-weight:350}.mark{color:#39d6ad;font-size:36px;vertical-align:middle}.eyebrow{font-size:12px;letter-spacing:1.7px;font-weight:700;color:#617f89}aside .eyebrow{color:#7e9ca7;margin:12px 0 40px}nav{display:grid;gap:10px}nav a{color:#b9ced6;text-decoration:none;padding:12px;border-radius:8px;font-size:14px}nav a.active,nav a:hover{background:#234651;color:#fff}nav a.active{box-shadow:inset 3px 0 #39d6ad}.aside-bottom{margin-top:auto;font-size:13px}.aside-bottom p{color:#95b0ba}.ghost{border:1px solid #5b7a86;background:transparent;color:inherit}main{margin-left:248px;padding:34px 42px;max-width:1700px}header{display:flex;justify-content:space-between;align-items:center;gap:20px}h1{font-size:30px;letter-spacing:-1px;margin:5px 0 20px}h2{font-size:20px;margin:0 0 12px}h3{font-size:16px;margin:0}p{margin:8px 0 16px}.client{font-size:13px;color:#617f89;min-width:220px}select,input,textarea{border:1px solid #cbd9dd;border-radius:7px;background:white;padding:11px;width:100%;color:#17333f}select{cursor:pointer}.demo-note{display:flex;gap:12px;font-size:12px;font-weight:700;color:#08735d;padding:10px 14px;background:#e1f4ee;border:1px solid #c4e8de;border-radius:7px;margin:0 0 28px}.demo-note span{font-size:14px;font-weight:400}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}.muted{color:#68808a;font-size:14px}.toolbar select{width:180px}button,.button{border:0;border-radius:7px;padding:10px 17px;cursor:pointer;background:#087f69;color:white;font-weight:600;text-decoration:none;font-size:14px;display:inline-block}button:hover,.button:hover{filter:brightness(.92)}button.secondary{background:#eaf0f2;color:#244653}button.danger{background:#fbe9e7;color:#aa342e}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}.card,.panel{background:#fff;border:1px solid #dfe7e9;border-radius:12px;padding:24px}.metric{font-size:38px;font-weight:700;letter-spacing:-1.5px;margin:8px 0}.card .muted{font-size:13px}.badge{display:inline-block;font-size:12px;font-weight:650;border-radius:30px;padding:4px 10px;background:#e3f5ef;color:#08735d}.badge.red{background:#fce9e6;color:#b43b32}.badge.amber{background:#fff1d4;color:#946216}.grid{display:grid;grid-template-columns:1.35fr 1fr;gap:22px;margin-bottom:24px}.panel-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:24px}.bars{display:grid;gap:23px}.bar-label{display:flex;justify-content:space-between;font-size:14px;margin-bottom:7px}.track{height:12px;border-radius:8px;background:#edf2f4;overflow:hidden}.fill{height:100%;background:#149b7b;border-radius:8px}.fill.amber{background:#e8af42}.fill.red{background:#de6d61}.stack{display:flex;height:36px;border-radius:8px;overflow:hidden;margin:24px 0}.stack span{display:flex;align-items:center;justify-content:center;color:white;font-size:13px}.legend{display:flex;gap:15px;flex-wrap:wrap;font-size:13px}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px}.critical{border-left:3px solid #df6d61;padding:2px 0 2px 15px;margin:20px 0}.critical p{font-size:14px;margin:6px 0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:14px}th{text-align:left;color:#68808a;font-weight:500}td,th{padding:14px 10px;border-bottom:1px solid #edf1f3}td:first-child,th:first-child{padding-left:0}.survey{max-width:750px;margin:auto}.survey-banner{background:#173f4b;color:#fff;padding:30px;border-radius:12px 12px 0 0}.survey-banner p{color:#b9d8dc;margin-bottom:0}.survey form{border-radius:0 0 12px 12px}.field{display:block;margin-bottom:22px}.field>span{display:block;font-weight:600;margin-bottom:9px}.rating{display:flex;gap:7px;flex-wrap:wrap}.rating label{flex:1;min-width:38px;text-align:center}.rating input{position:absolute;opacity:0;width:1px}.rating span{display:block;border:1px solid #cbd9dd;border-radius:7px;padding:9px 0;cursor:pointer}.rating input:checked+span{background:#087f69;color:white;border-color:#087f69}.rating input:focus-visible+span{outline:3px solid #36bd9e;outline-offset:2px}.scale{display:flex;justify-content:space-between;font-size:12px;color:#68808a;margin-top:6px}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.config-row{display:grid;grid-template-columns:1fr 170px 70px 40px;gap:12px;align-items:end;border-bottom:1px solid #e2eaec;padding:18px 0}.config-row label{font-size:13px}.config-row input[type=checkbox]{width:20px;height:20px}.alert-row{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #e2eaec;padding:20px 0}.alert-row p{font-size:14px}.empty{padding:35px;text-align:center;color:#68808a}footer{margin-top:36px;display:flex;justify-content:space-between;color:#7b9199;font-size:12px}#toast{position:fixed;bottom:24px;right:24px;background:#173f4b;color:white;border-radius:8px;padding:14px 22px;box-shadow:0 6px 25px #0002;display:none;max-width:90vw}.check{display:flex;align-items:center;gap:8px}.check input{width:18px;height:18px}@media(max-width:1100px){.cards{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}main{padding:25px}aside{width:210px;padding:25px 15px}main{margin-left:210px}}@media(max-width:700px){aside{position:static;width:auto;height:auto;padding:15px}aside .eyebrow,.aside-bottom{display:none}nav{display:flex;overflow:auto;margin-top:10px;gap:5px}nav a{white-space:nowrap;padding:9px;font-size:12px}main{margin:0;padding:20px 15px}header{align-items:start;flex-direction:column;gap:0}.client{width:100%;margin-bottom:18px}h1{font-size:26px}.cards{gap:10px}.card,.panel{padding:18px}.metric{font-size:32px}.toolbar{flex-wrap:wrap}.config-row{grid-template-columns:1fr 110px}.alert-row{flex-direction:column;gap:0}footer{gap:15px}.demo-note{align-items:center}}
