:root{font-family:Arial,sans-serif;color:#243349;background:#f4f6f9;font-size:14px}*{box-sizing:border-box}body{margin:0}aside{position:fixed;width:218px;background:#14273d;color:#c9d4e0;height:100vh;padding:30px 20px}.brand{font-size:23px;font-weight:700;color:white!important;margin-bottom:48px;display:block}.brand span{font-size:16px;margin-left:8px}.nav-label{font-size:11px;letter-spacing:1.5px;margin-bottom:15px;color:#8fa2b7}a{color:inherit;text-decoration:none}aside>a:not(.brand){display:block;padding:13px 12px;margin:6px 0;border-radius:5px}aside a.active{background:#29455f;color:white;border-left:3px solid #55bec0}.aside-note{position:absolute;bottom:28px;font-size:12px;line-height:1.8;color:#99acbf}main{margin-left:218px;padding:0 36px 40px;max-width:1600px}header{height:72px;border-bottom:1px solid #dce2e9;display:flex;justify-content:space-between;align-items:center;color:#64758a}.environment{font-size:11px;letter-spacing:1px;border:1px solid #d2dce5;padding:6px 10px}.heading{display:flex;justify-content:space-between;align-items:center;margin:28px 0 24px}h1{font-size:29px;letter-spacing:-.7px;margin:0 0 8px}p{color:#68778a;line-height:1.5;margin:0}button,.button{font:600 13px Arial;cursor:pointer;border:1px solid #cbd6e0;background:white;color:#29435a;padding:11px 15px;border-radius:4px;display:inline-block}button.primary{background:#17696c;border-color:#17696c;color:white}button:hover{filter:brightness(.96)}input,select{font:14px Arial;border:1px solid #cad5df;padding:10px;border-radius:4px;background:white;color:#263b50}input[type=number]{width:88px}label{display:block;font-size:12px;color:#556b81;margin-bottom:7px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:26px}.metric{padding:20px;background:white;border:1px solid #dce3ea;border-radius:5px}.metric small{color:#64758a}.metric strong{display:block;font-size:27px;margin:12px 0 8px;font-weight:600}.metric span{font-size:12px;color:#64758a}.grid{display:grid;grid-template-columns:minmax(0,1fr) 305px;gap:22px}.panel{background:white;border:1px solid #dce3ea;border-radius:5px;overflow:hidden;margin-bottom:20px}.panel-head{padding:18px 20px;border-bottom:1px solid #e1e7ed;display:flex;justify-content:space-between;align-items:center;gap:12px}h2{font-size:16px;margin:0}table{border-collapse:collapse;width:100%;font-size:13px}th{text-align:left;background:#f8fafc;color:#607287;font-size:11px;text-transform:uppercase;letter-spacing:.5px;padding:13px 16px}td{padding:14px 16px;border-top:1px solid #e6ebf0}td strong{display:block;font-size:13px}td small{display:block;color:#7a8798;margin-top:5px}td input{max-width:80px;width:100%;padding:8px}.badge{font-size:11px;border-radius:3px;padding:5px 8px;background:#edf3f8;color:#4b647b;white-space:nowrap}.badge.warn{background:#fff3dc;color:#8d6011}.badge.good{background:#e6f4ed;color:#28745a}.summary{padding:20px}.summary>div{display:flex;justify-content:space-between;padding:12px 0;gap:10px}.summary .total{border-top:1px solid #d9e2e9;font-size:20px;font-weight:700;margin-top:15px}.bar{height:6px;background:#e7eef3;margin:5px 0 15px}.bar span{display:block;height:100%;background:#278587}.subtle{font-size:12px;line-height:1.6;color:#738399}.toolbar{display:flex;gap:12px}.toolbar input{min-width:245px}.selection{background:#f0f8f8}.footnote{padding:15px 20px;color:#718096;font-size:12px}.form-body{padding:20px}.form-body>div{margin-bottom:18px}.form-body input,.form-body select{width:100%}#notice{position:fixed;bottom:20px;right:30px;max-width:460px;background:#163f42;color:white;padding:0;border-radius:5px}#notice:not(:empty){padding:16px 20px}.number{text-align:right}.right{display:flex;gap:10px}.full{width:100%}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #318aa8;outline-offset:3px}@media(max-width:900px){aside{position:static;width:auto;height:auto;padding:15px}.brand{margin:0}.nav-label,.aside-note{display:none}aside>a:not(.brand){display:inline-block}main{margin:0;padding:0 16px 30px}.grid{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,1fr)}.panel{overflow:auto}.heading{gap:15px}.toolbar{flex-wrap:wrap}}
.grid>div{min-width:0}@media(max-width:600px){.heading{align-items:flex-start;flex-direction:column}.panel-head{flex-wrap:wrap}.metrics{gap:10px}.metric{padding:14px}.metric strong{font-size:22px}.panel table{min-width:550px}.panel-head input{max-width:100%;min-width:0}}
.summary>.bar{display:block;padding:0;height:6px}.summary>.bar span{height:6px}td input{max-width:102px;width:102px}