*{box-sizing:border-box}body{margin:0;background:#f5f7fa;color:#172b40;font:14px 'Segoe UI',sans-serif}button,input,select,textarea,.button{font:inherit}button,.button{cursor:pointer;background:white;border:1px solid #dce3ea;border-radius:7px;padding:10px 14px;color:#34475a}button:hover,.button:hover{background:#eaf3f3}button:focus-visible,input:focus,select:focus,textarea:focus{outline:2px solid #159887;outline-offset:2px}.primary{background:#087e72;color:white;border-color:#087e72}.primary:hover{background:#09675f}aside{position:fixed;inset:0 auto 0 0;width:238px;background:#102b36;color:#d4e0e5;padding:34px 22px}.brand{font-weight:750;font-size:32px;color:white;letter-spacing:-1px}.brand span{color:#49cbb1}.brand small{font-size:18px;font-weight:400;color:#95adb9}.overline{font-size:11px;font-weight:700;letter-spacing:1.8px;color:#708894}aside .overline{margin:42px 12px 17px}.nav{display:block;width:100%;text-align:left;border:0;color:#b7cbd3;background:transparent;margin-bottom:8px;padding:14px 12px}.nav.active{background:#254750;color:#7aead0}.aside-bottom{position:absolute;bottom:32px;font-size:11px;line-height:1.8}.aside-bottom b{color:#6fd4bf;font-size:10px;letter-spacing:1px}main{margin-left:238px;padding:0 38px 22px;max-width:1800px}header{height:77px;border-bottom:1px solid #e1e7ec;display:flex;align-items:center;justify-content:space-between;color:#7a8b99;font-size:12px}.env{font-size:11px;background:#e6f3ef;color:#267764;padding:7px 11px;border-radius:6px;white-space:nowrap}.heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:33px 0 27px}h1{font-size:32px;letter-spacing:-1px;margin:9px 0}h2{font-size:18px;margin:0 0 8px}p{color:#748492;line-height:1.6;margin:8px 0}.actions{display:flex;gap:8px;flex-wrap:wrap}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat{border:1px solid #e2e8ed;background:white;border-radius:10px;padding:20px;text-align:left}.stat strong{display:block;font-size:31px;margin:12px 0 5px;color:#193344}.stat span{color:#718492;font-size:12px}.stat .dot{float:right;border-radius:50%;width:9px;height:9px;margin-top:3px;background:#91a4b4}.stat:nth-child(2) .dot{background:#28a989}.stat:nth-child(3) .dot{background:#e47778}.stat:nth-child(4) .dot{background:#c4913a}.progress-panel{background:#eaf3f2;border:1px solid #d4e6e2;border-radius:10px;margin:22px 0;display:flex;align-items:center;gap:40px;padding:23px 26px}.progress-panel h2{font-size:24px}.progress-panel p{font-size:12px}.progress-right{flex:1}.track{background:#cfe0dc;border-radius:20px;height:10px;overflow:hidden;margin:12px 0}.track div{height:100%;background:#168c79;transition:width .3s}.progress-right small{color:#627e7a;font-size:11px}.list-panel{background:white;border:1px solid #e1e7ec;border-radius:11px;overflow:hidden}.list-title{display:flex;justify-content:space-between;align-items:center;padding:24px 24px 10px}.list-title p{font-size:12px}.filters{display:flex;gap:10px;padding:16px 24px 22px}input,textarea,select{border:1px solid #dae2e8;border-radius:6px;padding:10px;background:#fff;color:#34495b;min-width:0}#search{flex:1;min-width:180px}select{max-width:220px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;font-size:10px;letter-spacing:1px;background:#f8fafb;color:#7c8d9a;padding:14px 20px;border-block:1px solid #e7edf1}td{padding:18px 20px;border-bottom:1px solid #edf1f4;font-size:12px}td:first-child{white-space:normal;min-width:260px}td b{display:block;font-size:13px;color:#293f52;margin:5px 0}td small{color:#8a99a5;font-size:10px}.badge{display:inline-block;background:#eff2f5;color:#697e90;border-radius:5px;padding:6px 9px;font-size:11px}.badge.Lulus{background:#e2f4eb;color:#248559}.badge.Gagal{background:#fcebec;color:#b65860}.badge.wait{background:#fff3d9;color:#9e771f}.note{font-size:11px;margin:18px 3px}dialog{border:0;border-radius:13px;padding:0;width:760px;max-width:95vw;max-height:92vh;box-shadow:0 25px 100px #102b3655}dialog::backdrop{background:#102b3677}.modal-head,.modal-foot{display:flex;justify-content:space-between;align-items:center;padding:22px;gap:15px}.modal-head{border-bottom:1px solid #e1e7ec}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;padding:22px}label{display:flex;flex-direction:column;gap:7px;color:#567;font-size:12px}label.button{display:block}.wide{grid-column:1/-1}textarea{min-height:65px;resize:vertical}.instructions{margin:20px 22px 0;padding:14px;background:#edf6f3;color:#426b62;line-height:1.8;font-size:12px}.modal-foot{background:#f7f9fa;position:sticky;bottom:0}.modal-foot small{color:#798c99}#previews{display:flex;gap:10px;flex-wrap:wrap}#previews img{width:110px;height:75px;object-fit:cover}#previews a{display:block}#previews button{display:block;font-size:11px;padding:4px}#toast{position:fixed;bottom:25px;right:25px;background:#173d42;color:white;padding:14px 22px;border-radius:8px;display:none;z-index:10}@media(max-width:1100px){aside{width:190px;padding:24px 14px}main{margin-left:190px;padding:0 20px}.heading{align-items:flex-start;flex-direction:column}.filters{flex-wrap:wrap}}@media(max-width:700px){aside{position:relative;width:auto;padding:16px}.brand{font-size:24px}aside .overline,.aside-bottom{display:none}.nav{display:inline-block;width:auto;padding:9px;font-size:11px;margin:10px 0 0}main{margin:0;padding:0 14px}header{height:55px;font-size:10px}.stats{grid-template-columns:1fr 1fr;gap:9px}.progress-panel{display:block}.filters{padding:15px}.filters>*{flex:1}h1{font-size:28px}.form-grid{grid-template-columns:1fr}.wide{grid-column:auto}}