.operations-react-hidden{display:none!important}
.operations-center{
 --operations-blue:#0785c2;
 --operations-sky:#29b7e5;
 --operations-ink:#123a54;
 --operations-muted:#6d8495;
 width:100%;
 max-width:1480px;
 margin:0 auto;
 color:var(--operations-ink);
 font-family:"Manrope","Segoe UI",sans-serif;
}
.operations-heading,.operations-detail-heading{
 display:flex;
 align-items:flex-end;
 justify-content:space-between;
 gap:24px;
 padding:10px 2px 22px;
 border-bottom:1px solid #d4e6ee;
}
.operations-heading>div:first-child,.operations-detail-heading>div{min-width:0;flex:1}
.operations-heading span,.operations-detail-heading span{
 color:#0985ba;
 font-size:12px;
 font-weight:850;
 letter-spacing:.12em;
}
.operations-heading h1,.operations-detail-heading h1{
 margin:7px 0 5px;
 color:#0d3855;
 font-size:clamp(25px,2.5vw,36px);
 line-height:1.12;
 letter-spacing:-.045em;
}
.operations-heading p,.operations-detail-heading p{
 max-width:720px;
 margin:0;
 color:var(--operations-muted);
 font-size:13px;
 line-height:1.6;
}
.operations-total{
 display:flex;
 flex:0 0 auto;
 align-items:center;
 gap:11px;
 min-width:174px;
 padding-left:22px;
 border-left:1px solid #d4e6ee;
}
.operations-total b{color:#087caf;font-size:29px;line-height:1}
.operations-total small{max-width:94px;color:#718797;font-size:12px;line-height:1.35}
.operations-feature-grid{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));
 gap:12px;
 padding-top:20px;
}
.operations-feature-card{
 position:relative;
 display:grid;
 grid-template-columns:46px minmax(0,1fr);
 grid-template-rows:auto auto;
 gap:0 14px;
 min-height:140px;
 padding:20px;
 overflow:hidden;
 border:1px solid #d4e6ee;
 border-radius:15px;
 background:#fff;
 color:var(--operations-ink);
 text-align:left;
 box-shadow:0 8px 24px rgba(13,64,91,.06);
 transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.operations-feature-card::after{
 position:absolute;
 right:-32px;
 bottom:-54px;
 width:122px;
 height:122px;
 border:20px solid rgba(38,181,228,.08);
 border-radius:50%;
 content:"";
}
.operations-feature-card:hover,.operations-feature-card:focus-visible{
 outline:0;
 border-color:#70c9e8;
 box-shadow:0 15px 34px rgba(8,119,165,.13);
 transform:translateY(-3px);
}
.operations-feature-icon{
 display:grid;
 grid-row:1/3;
 width:46px;
 height:46px;
 place-items:center;
 border-radius:13px;
 background:linear-gradient(145deg,#dff5fd,#c8edfb);
 color:#087faf;
}
.operations-feature-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
.operations-feature-copy{display:block;min-width:0;padding-right:5px}
.operations-feature-copy b{display:block;margin:1px 0 6px;color:#153d57;font-size:15px;line-height:1.3}
.operations-feature-copy small{display:block;color:#718697;font-size:12px;line-height:1.5}
.operations-feature-count{align-self:end;margin-top:13px;color:#0781b4;font-size:12px;font-weight:800}
.operations-detail-heading{align-items:center}
.operations-detail-heading>[data-back-features]{
 flex:0 0 auto;
 min-height:40px;
 padding:0 13px;
 border:1px solid #cbdfe8;
 border-radius:9px;
 background:#fff;
 color:#315970;
 font-size:12px;
 font-weight:800;
}
.operations-primary{
 min-height:43px;
 padding:0 18px;
 border:0;
 border-radius:10px;
 background:linear-gradient(115deg,#087bb8,#26b6e3);
 color:#fff;
 font-size:12px;
 font-weight:850;
 box-shadow:0 9px 21px rgba(7,132,185,.22);
}
.operations-primary:hover{filter:saturate(1.08);transform:translateY(-1px)}
.operations-primary:disabled{cursor:wait;opacity:.55;transform:none}
.operations-toolbar{
 display:flex;
 align-items:flex-end;
 justify-content:space-between;
 gap:18px;
 padding:18px 0 13px;
}
.operations-toolbar label{display:block;width:min(100%,380px);color:#526c7d;font-size:12px;font-weight:800}
.operations-toolbar label span{display:block;margin-bottom:6px}
.operations-toolbar input{
 width:100%;
 height:42px;
 padding:0 13px;
 border:1px solid #cedfe8;
 border-radius:9px;
 outline:0;
 background:#fff;
 color:#183d56;
 font-size:12px;
}
.operations-toolbar input:focus{border-color:#35b5df;box-shadow:0 0 0 3px rgba(53,181,223,.14)}
.operations-toolbar>span{padding-bottom:11px;color:#748998;font-size:12px;font-weight:750}
.operations-table-panel{
 overflow:hidden;
 border:1px solid #d5e5ec;
 border-radius:14px;
 background:#fff;
 box-shadow:0 9px 27px rgba(11,61,87,.06);
}
.operations-table-scroll{width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
.operations-table-panel table{width:100%;min-width:1060px;border-collapse:collapse}
.operations-table-panel th{
 padding:13px 12px;
 border-bottom:1px solid #d5e5ec;
 background:#f2f9fc;
 color:#5c788a;
 font-size:12px;
 font-weight:850;
 letter-spacing:.025em;
 text-align:left;
 text-transform:uppercase;
 white-space:nowrap;
}
.operations-table-panel td{padding:13px 12px;border-bottom:1px solid #e5eef2;color:#345367;font-size:12px;vertical-align:middle}
.operations-table-panel tbody tr:last-child td{border-bottom:0}
.operations-table-panel td b,.operations-table-panel td small{display:block}
.operations-table-panel td b{color:#183e57;font-size:12px}
.operations-table-panel td small{max-width:340px;margin-top:4px;overflow:hidden;color:#7d909d;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.operations-empty{padding:42px 20px!important;color:#748a99!important;text-align:center!important}
.operations-status{display:inline-flex;min-height:28px;align-items:center;padding:4px 9px;border-radius:999px;background:#e9f4f8;color:#527286;font-size:12px;font-weight:850;white-space:nowrap}
.operations-status[data-status="Selesai"],.operations-status[data-status="Aman"]{background:#e3f7ef;color:#08785a}
.operations-status[data-status="Diajukan"],.operations-status[data-status="Proses"]{background:#e5f4fd;color:#087bb4}
.operations-status[data-status="Perlu Tindakan"]{background:#fff0df;color:#a75d09}
.operations-photo-link{color:#087eae;font-size:12px;font-weight:850;text-decoration:none;white-space:nowrap}
.operations-photo-link:hover{text-decoration:underline}
.operations-row-actions{display:flex;gap:6px}
.operations-row-actions button{
 min-height:34px;
 padding:0 10px;
 border:1px solid #c9dee8;
 border-radius:8px;
 background:#fff;
 color:#17678a;
 font-size:12px;
 font-weight:800;
}
.operations-row-actions button:last-child{border-color:#eed0d0;color:#a94747}
.operations-alert{margin:16px 0 0;padding:12px 14px;border-radius:10px;font-size:12px;font-weight:750}
.operations-alert.is-error{border:1px solid #efc6c6;background:#fff1f1;color:#a53d3d}
.operations-loading{display:flex;min-height:280px;align-items:center;justify-content:center;gap:12px;color:#5f7889}
.operations-loading span{width:22px;height:22px;border:3px solid #ccebf6;border-top-color:#159dd0;border-radius:50%;animation:operations-spin .75s linear infinite}
.operations-loading b{font-size:13px}
body.operations-modal-open{overflow:hidden!important}
.operations-modal-backdrop{
 position:fixed;
 inset:0;
 z-index:10200;
 display:grid;
 place-items:center;
 padding:20px;
 background:rgba(3,35,55,.58);
 backdrop-filter:blur(4px);
}
.operations-modal{
 width:min(720px,100%);
 max-height:calc(100dvh - 40px);
 padding:0;
 overflow-y:auto;
 border:0;
 border-radius:18px;
 background:#fff;
 box-shadow:0 25px 70px rgba(2,31,50,.32);
 color:#173c55;
 font-family:"Manrope","Segoe UI",sans-serif;
 animation:operations-modal-in .2s ease-out;
}
.operations-modal>header{
 position:sticky;
 top:0;
 z-index:2;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:16px;
 padding:19px 22px 16px;
 border-bottom:1px solid #dbe8ee;
 background:rgba(255,255,255,.96);
 backdrop-filter:blur(8px);
}
.operations-modal>header span{color:#1689b8;font-size:12px;font-weight:850;letter-spacing:.1em}
.operations-modal>header h2{margin:4px 0 0;color:#123a54;font-size:21px}
.operations-modal>header button,.operations-modal>footer>button:first-child{
 min-height:38px;
 padding:0 13px;
 border:1px solid #d2e2e9;
 border-radius:9px;
 background:#f8fbfc;
 color:#48697c;
 font-size:12px;
 font-weight:800;
}
.operations-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:20px 22px 8px}
.operations-form-grid label{display:block;min-width:0;color:#4e6879;font-size:12px;font-weight:800}
.operations-form-grid label.wide{grid-column:1/-1}
.operations-form-grid input,.operations-form-grid select,.operations-form-grid textarea{
 display:block;
 width:100%;
 margin-top:7px;
 padding:11px 12px;
 border:1px solid #d3e1e8;
 border-radius:9px;
 outline:0;
 background:#fafdfe;
 color:#173c55;
 font-size:12px;
}
.operations-form-grid input,.operations-form-grid select{min-height:43px}
.operations-form-grid textarea{min-height:92px;resize:vertical}
.operations-form-grid input:focus,.operations-form-grid select:focus,.operations-form-grid textarea:focus{border-color:#39b7df;box-shadow:0 0 0 3px rgba(57,183,223,.14)}
.operations-form-grid input[readonly]{background:#edf5f8;color:#506d7e}
.operations-file-field small{display:block;margin-top:6px;color:#8294a0;font-size:12px;font-weight:550;line-height:1.45}
.operations-remove-photo{display:flex!important;grid-column:1/-1;align-items:center;gap:8px}
.operations-remove-photo input{display:inline-block;width:17px;min-height:17px;margin:0;accent-color:#0989bf}
.operations-form-message{min-height:18px;margin:8px 22px 0;color:#08795d;font-size:12px;font-weight:750}
.operations-form-message.is-error{color:#ae3d3d}
.operations-modal>footer{display:flex;justify-content:flex-end;gap:9px;padding:14px 22px 21px}
@keyframes operations-spin{to{transform:rotate(360deg)}}
@keyframes operations-modal-in{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:760px){
 .operations-center{padding-top:4px}
 .operations-heading,.operations-detail-heading{align-items:flex-start;flex-direction:column;gap:14px;padding-top:4px}
 .operations-total{width:100%;min-width:0;padding:12px 0 0;border-top:1px solid #d4e6ee;border-left:0}
 .operations-total small{max-width:none}
 .operations-feature-grid{grid-template-columns:1fr;gap:9px;padding-top:14px}
 .operations-feature-card{min-height:118px;padding:16px}
 .operations-detail-heading>[data-back-features]{order:-1}
 .operations-detail-heading>.operations-primary{width:100%}
 .operations-toolbar{align-items:stretch;flex-direction:column;gap:5px}
 .operations-toolbar label{width:100%}
 .operations-toolbar>span{padding:4px 1px 0}
 .operations-table-panel{margin-inline:-1px;border-radius:11px}
 .operations-modal-backdrop{align-items:end;padding:26px 0 0}
 .operations-modal{max-height:calc(100dvh - 26px);border-radius:22px 22px 0 0}
 .operations-form-grid{grid-template-columns:1fr;padding-inline:16px}
 .operations-form-grid label.wide,.operations-remove-photo{grid-column:auto}
 .operations-modal>header{padding-inline:16px}
 .operations-modal>footer{position:sticky;bottom:0;padding:13px 16px calc(16px + env(safe-area-inset-bottom));border-top:1px solid #dbe8ee;background:#fff}
 .operations-modal>footer>*{flex:1}
 .operations-form-message{margin-inline:16px}
}
@media(prefers-reduced-motion:reduce){.operations-feature-card,.operations-primary,.operations-modal{transition:none;animation:none}}