:root{--bg:#07111f;--panel:#0d1b2b;--panel2:#10243a;--border:#20364e;--text:#eaf1f8;--muted:#91a4b8;--orange:#ff6a00;--green:#2ecc71;--yellow:#f5c542;--red:#ff5d5d;--blue:#4da3ff;--white:#fff}
*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:22px;padding:12px 18px;background:#07131f;border-bottom:1px solid var(--border);box-shadow:0 6px 20px #0004}.brand{display:flex;align-items:center;gap:12px;min-width:250px}.brand img{width:54px;height:54px;border-radius:50%;object-fit:cover}.brand strong{display:block;font-size:18px;color:#ff7d27}.brand span{display:block;color:var(--muted);font-size:12px;line-height:1.25;max-width:340px}.top-controls{display:flex;gap:10px;flex:1;justify-content:flex-end;flex-wrap:wrap}.top-controls label{font-size:11px;color:var(--muted)}select,input,textarea,button{font:inherit}.top-controls select,.top-controls input{display:block;margin-top:4px;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:7px 9px;min-height:32px}.top-controls input[type=date]{color-scheme:dark}.top-controls #actor{width:150px}.app-shell{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 79px)}aside{border-right:1px solid var(--border);padding:14px;background:#091522}aside button{width:100%;text-align:left;padding:11px 12px;margin:3px 0;border:0;border-radius:8px;background:transparent;color:#b9c8d7;cursor:pointer}aside button:hover,aside button.active{background:var(--panel2);color:#fff;border-left:3px solid var(--orange)}aside .nav-section{font-size:10px;color:#657e95;margin:15px 10px 6px;text-transform:uppercase;letter-spacing:.12em}main{padding:20px;max-width:1700px}.head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:16px}.head h1{margin:0 0 3px;font-size:24px}.muted{color:var(--muted)}.badge{display:inline-flex;align-items:center;border:1px solid var(--border);background:#122439;padding:4px 8px;border-radius:999px;font-size:11px}.badge.orange{background:#4b280e;color:#ffb47f;border-color:#7d431a}.badge.green{background:#103925;color:#81efad}.badge.yellow{background:#40360c;color:#ffe171}.badge.red{background:#441a1a;color:#ff9a9a}.badge.blue{background:#102e51;color:#82bfff}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card,.panel{background:var(--panel);border:1px solid var(--border);border-radius:11px;padding:14px}.card .label{font-size:11px;text-transform:uppercase;color:var(--muted)}.card .value{font-size:23px;font-weight:800;margin:6px 0}.section{margin-top:14px}.panel h2{font-size:16px;margin:0 0 10px}.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}.btn{border:1px solid var(--border);border-radius:7px;background:#17314d;color:#fff;padding:8px 11px;cursor:pointer}.btn:hover{filter:brightness(1.12)}.btn.primary{background:var(--orange);border-color:#d85a00}.btn.success{background:#176b41}.btn.danger{background:#6e2b2b}.btn.ghost{background:transparent}.btn.small{padding:5px 8px;font-size:12px}.btn[disabled]{opacity:.45;cursor:not-allowed}.notice{border:1px solid #3e5368;background:#0d2135;border-left:4px solid var(--blue);border-radius:8px;padding:10px 12px;margin:12px 0}.warning{border-left-color:var(--yellow)}.dangerbox{border-left-color:var(--red)}.successbox{border-left-color:var(--green)}table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px}th{position:sticky;top:0;background:#13283d;color:#dce8f3;text-align:left;padding:8px;border-bottom:1px solid var(--border)}td{padding:8px;border-bottom:1px solid #192c3f;vertical-align:top}tr.clickable{cursor:pointer}tr.clickable:hover td{background:#102840}.table-wrap{max-height:520px;overflow:auto;border:1px solid var(--border);border-radius:8px}.right{text-align:right}.red{color:var(--red)}.green{color:var(--green)}.yellow{color:var(--yellow)}.blue{color:var(--blue)}.flow{padding:12px;background:#071824;border:1px dashed #31506d;border-radius:8px;color:#b9c8d7}.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.tabs button{background:#11243a;color:#bcd0e2;border:1px solid var(--border);padding:7px 10px;border-radius:7px;cursor:pointer}.tabs button.active{background:#244564;color:#fff}.task-list{display:grid;gap:7px}.task-row{display:grid;grid-template-columns:32px 65px 1fr 120px 130px 90px;gap:8px;align-items:center;background:#0a1a29;border:1px solid #1e354a;border-radius:8px;padding:8px;cursor:pointer}.task-row:hover{border-color:#42749d}.task-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--green)}.progress{height:7px;background:#152637;border-radius:99px;overflow:hidden}.progress span{display:block;height:100%;background:var(--green)}.pill{font-size:11px;padding:3px 6px;border-radius:5px;background:#182e43}.modal{position:fixed;inset:0;z-index:100}.modal.hidden{display:none}.modal-backdrop{position:absolute;inset:0;background:#000b}.modal-card{position:relative;margin:5vh auto;width:min(900px,94vw);max-height:90vh;overflow:auto;background:#0b1a2a;border:1px solid #2b4965;border-radius:13px;padding:18px;box-shadow:0 20px 70px #000}.modal-close{position:absolute;right:10px;top:8px;background:transparent;border:0;color:#fff;font-size:26px;cursor:pointer}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.form-grid .full{grid-column:1/-1}.field label{display:block;color:var(--muted);font-size:11px;margin-bottom:4px}.field input,.field select,.field textarea{width:100%;background:#071420;color:#fff;border:1px solid #2b4157;border-radius:7px;padding:8px}.field textarea{min-height:80px}.toast{position:fixed;right:20px;bottom:20px;z-index:200;background:#193952;border:1px solid #315c7c;color:#fff;padding:11px 16px;border-radius:8px;box-shadow:0 8px 25px #0008}.toast.hidden{display:none}.role-lock{padding:30px;text-align:center;background:#0c1d2d;border:1px solid #2b4157;border-radius:12px}.mini{font-size:11px}.nowrap{white-space:nowrap}.summary-line{display:flex;justify-content:space-between;border-bottom:1px solid #1c3145;padding:7px 0}.summary-line:last-child{border:0}.search{min-width:260px}.split{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:12px}.source-issue{background:#331e17;border:1px solid #6f442c;padding:8px;border-radius:7px}.link{color:#77baff;text-decoration:underline;cursor:pointer}.statline{display:flex;gap:18px;flex-wrap:wrap;margin:8px 0}.statline span{color:var(--muted)}.statline b{color:#fff}
@media(max-width:1000px){.app-shell{grid-template-columns:1fr}aside{display:flex;overflow:auto;position:sticky;top:79px;z-index:10;border-right:0;border-bottom:1px solid var(--border)}aside button{min-width:max-content}.grid,.grid.three,.grid.two,.split{grid-template-columns:1fr 1fr}.task-row{grid-template-columns:28px 55px 1fr 100px}.task-row>*:nth-child(5),.task-row>*:nth-child(6){display:none}}
@media(max-width:640px){main{padding:12px}.grid,.grid.three,.grid.two,.split,.form-grid{grid-template-columns:1fr}.topbar{align-items:flex-start}.brand{min-width:auto}.top-controls{justify-content:flex-start}.task-row{grid-template-columns:28px 50px 1fr}.task-row>*:nth-child(n+4){display:none}}

.report-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.report-card{background:#0a1a29;border:1px solid #1e354a;border-radius:10px;padding:14px}.report-card h3{margin:0 0 6px}.filterbar{display:flex;gap:8px;flex-wrap:wrap;align-items:end;margin:10px 0}.filterbar .field{min-width:170px;flex:1}.date-chip{display:inline-flex;padding:5px 9px;border-radius:7px;background:#0c2b44;border:1px solid #285271;color:#bfe0ff;font-size:12px}.task-meta{font-size:11px;color:#92b4d1}.search-input{min-width:280px;max-width:520px;width:100%;background:#071420;color:#fff;border:1px solid #2b4157;border-radius:7px;padding:9px 10px}.subtle{background:#091a28;border:1px dashed #2a4660;border-radius:8px;padding:9px 11px}.audit-line{display:grid;grid-template-columns:155px 120px 160px 1fr;gap:8px;padding:6px 0;border-bottom:1px solid #1c3145;font-size:12px}.auto-plan-row.warn td{background:#2b2510}.auto-plan-row.critical td{background:#31191b}.btn.secondary{background:#28445f}.owner-export{border-color:#6b4a15;background:#51330d}.table-wrap.tall{max-height:650px}
@media(max-width:1000px){.report-grid{grid-template-columns:1fr 1fr}.audit-line{grid-template-columns:1fr 1fr}}@media(max-width:640px){.report-grid{grid-template-columns:1fr}.audit-line{grid-template-columns:1fr}}

/* v0.6 auth + QA checklist */
.hidden-control{display:none!important}.session-box{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:6px 9px;color:#dbe7f3;font-size:12px}.login-overlay{position:fixed;inset:0;z-index:1000;background:radial-gradient(circle at top,#102b45,#02070c 65%);display:flex;align-items:center;justify-content:center;padding:20px}.login-overlay.hidden{display:none}.login-card{width:min(430px,94vw);background:#0b1a2a;border:1px solid #31506d;border-radius:16px;padding:28px;box-shadow:0 28px 90px #000c}.login-card img{width:82px;height:82px;border-radius:50%;display:block;margin:0 auto 12px}.login-card h1{text-align:center;font-size:22px;margin:0 0 4px}.login-card>p{text-align:center}.login-card .field{margin:12px 0}.login-btn{width:100%;margin-top:8px;padding:11px}.login-error{min-height:22px;color:#ff9393;margin-top:8px}.qa-check-row{display:grid;grid-template-columns:minmax(260px,1fr) 80px 80px;gap:8px;align-items:center;padding:9px;border-bottom:1px solid #1c3145}.qa-choice{display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid var(--border);border-radius:7px;padding:7px;cursor:pointer;font-weight:800}.qa-choice input{accent-color:var(--green)}.qa-choice.pass{background:#103925;color:#81efad}.qa-choice.fail{background:#441a1a;color:#ff9a9a}.qa-result-summary{display:flex;gap:8px;flex-wrap:wrap}.pax-edit-line{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}.future-tag{font-size:11px;color:#9bd2ff}.account-card{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr auto;gap:8px;align-items:center;padding:9px;border-bottom:1px solid #1c3145}.approval-pending{border-left:4px solid var(--yellow)}


/* v1.0 Final UAT */
.stage-grid{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:10px;margin:16px 0}
.stage-btn{background:#0e2133;border:1px solid #28435b;color:#e8f1fb;border-radius:10px;padding:12px;text-align:left;cursor:pointer;min-height:72px}
.stage-btn:hover{border-color:#4aa8ff;transform:translateY(-1px)}
.stage-btn.done{background:#103b2c;border-color:#26865e}
.stage-btn b{display:block;margin-bottom:6px}.stage-btn small{display:block;color:#9bb5cc;line-height:1.3}
.stage-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.production-card{margin-bottom:14px}
.locked-row{opacity:.72}
.locked-row::after{content:"LOCKED";float:right;color:#ff7b49;font-size:11px;font-weight:800}
@media(max-width:1100px){.stage-grid{grid-template-columns:repeat(2,minmax(150px,1fr))}}
@media(max-width:700px){.stage-grid{grid-template-columns:1fr}}

/* v1.1 POV final refinements */
.badge.red{background:#4a1518;color:#ffc9c9}.badge.yellow{background:#4a3710;color:#ffe59a}.badge.green{background:#103b2c;color:#b9f5d8}.badge.blue{background:#123457;color:#b9ddff}
.dangerbox{border-left:5px solid #ef4444;background:#351719}.warn{background:rgba(245,158,11,.07)}

/* v1.2 Finance + HRD */
.fin-confidential{border-left:4px solid #ef8b2c}
.table-wrap.tall table td{vertical-align:top}
@media(max-width:900px){.finance-hr-grid{grid-template-columns:1fr}}

/* v1.3 Documents + History */
.doc-detail-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.detail-kv th{width:28%;white-space:nowrap}.detail-kv td{word-break:break-word}
.timeline-row{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid #21384d}
.timeline-dot{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#163552;color:#fff;font-weight:700}
.recent-doc{padding:10px 0}.doc-scope-tabs{margin-top:14px}
@media(max-width:800px){.doc-detail-head{display:block}.detail-kv th{width:auto;white-space:normal}}

/* v1.3.1 HRD standalone */
#nav button[data-view="hrd"]{border-left:3px solid #ff6a00}

/* v1.3.3 On-screen employee signature */
.pkwt-sign-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.pkwt-read-box{height:min(58vh,620px);overflow:auto;border:1px solid #2b4359;border-radius:10px;background:#f8fafc;color:#111;padding:18px;margin-top:12px}
.contract-paper{max-width:820px;margin:0 auto;background:#fff;padding:18px 24px;box-shadow:0 1px 8px rgba(0,0,0,.08)}
.contract-title{text-align:center;font-size:15px;line-height:1.5;margin-bottom:18px}.contract-title b{font-size:18px}
.contract-paper p{text-align:justify;line-height:1.48;margin:6px 0 12px}.contract-paper h4{text-align:center;margin:18px 0 6px}
.contract-meta{width:100%;border-collapse:collapse;margin:10px 0 16px}.contract-meta th,.contract-meta td{border:1px solid #bbb;padding:6px;text-align:left}.contract-meta th{width:30%;background:#f3f4f6}
.contract-end{text-align:center;border-top:2px solid #111;padding-top:14px;margin-top:22px}
.read-progress{padding:10px 14px;background:#3d2f0f;border:1px solid #7d6425;border-radius:8px;margin-top:8px}.read-progress.done{background:#11382a;border-color:#2d805e}
.consent-line{display:block;padding:10px 4px;border-bottom:1px solid #294157;line-height:1.4}.consent-line input{transform:scale(1.2);margin-right:10px}
.signature-area{margin-top:14px}.signature-canvas-wrap{background:#fff;border:2px dashed #66788a;border-radius:10px;padding:4px;overflow:hidden;touch-action:none}
#employeeSignatureCanvas{display:block;background:#fff;touch-action:none;cursor:crosshair}
.saved-signature{max-width:360px;max-height:160px;background:#fff;border:1px solid #ddd;padding:8px;border-radius:8px}
.center{text-align:center}
@media(max-width:700px){.pkwt-sign-head{display:block}.pkwt-read-box{height:55vh;padding:8px}.contract-paper{padding:12px}.contract-meta th{width:38%}}

/* v1.3.4 PKWT owner delete */
.select-col{width:38px;text-align:center!important}.pkwt-delete-check,#pkwtSelectAll{transform:scale(1.25);cursor:pointer}
.btn.danger:disabled{opacity:.45;cursor:not-allowed}

/* v1.3.5 Finance Indonesian */
.finance-list-columns{align-items:start}.finance-list{min-height:320px}.finance-list-row{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:11px 0;border-bottom:1px solid #21384d}.amount-in{font-weight:800;color:#2bd37f;white-space:nowrap}.amount-out{font-weight:800;color:#ff7272;white-space:nowrap}.finance-feed{max-height:560px;overflow:auto}.summary-line.strong{font-size:1.08em;border-top:2px solid #ff6a00;margin-top:6px;padding-top:12px}
@media(max-width:900px){.finance-list-columns{grid-template-columns:1fr}.finance-list-row{grid-template-columns:1fr}.amount-in,.amount-out{text-align:right}}

/* v1.3.6 Preparation auto */
#miDaily[readonly]{background:#12283a;color:#7fe5ac;font-weight:700;cursor:not-allowed}
.task-row .task-meta{color:#8fc6ee}

/* v1.3.7 Owner KPI drilldown */
.owner-kpi-card{appearance:none;-webkit-appearance:none;width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;position:relative;transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease}
.owner-kpi-card:hover,.owner-kpi-card:focus{transform:translateY(-2px);border-color:#3b82b6;box-shadow:0 8px 24px rgba(0,0,0,.18);outline:none}
.owner-kpi-card:focus-visible{outline:2px solid #ff6a00;outline-offset:2px}
.kpi-open-hint{margin-top:8px;font-size:11px;color:#79b9e8;opacity:.78}
.owner-drill-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
@media(max-width:720px){.owner-drill-head{display:block}.owner-drill-head .btn{margin-top:10px}}

/* v1.3.8 Owner shortcut cards */
.owner-kpi-card-wrap{display:flex;flex-direction:column;gap:12px}
.owner-kpi-main{appearance:none;-webkit-appearance:none;width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;background:transparent;border:0;padding:0;margin:0}
.owner-kpi-main:hover,.owner-kpi-main:focus{outline:none}
.owner-kpi-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto}
.btn.tiny{padding:8px 12px;font-size:12px;line-height:1.1;border-radius:10px}
.drill-toolbar{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:720px){.owner-kpi-actions,.drill-toolbar{display:grid;grid-template-columns:1fr 1fr}}

/* v1.3.9 Responsive HP + Laptop and secure login */
html,body{max-width:100%;overflow-x:hidden}
.mobile-head-row{display:flex;align-items:center;gap:10px}
.mobile-nav-btn{display:none;width:44px;height:44px;min-width:44px;border:1px solid var(--border);border-radius:10px;background:#17314d;color:#fff;font-size:22px;cursor:pointer}
.nav-backdrop{display:none}
.login-security-note{margin-top:14px;padding-top:12px;border-top:1px solid #263d52;color:var(--muted);font-size:11px;line-height:1.45;text-align:center}
.table-wrap{width:100%;overflow:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{min-width:max-content}
button,input,select,textarea{max-width:100%}

@media(max-width:1200px){
  .topbar{gap:12px;padding:10px 12px;align-items:flex-start;flex-wrap:wrap}
  .mobile-head-row{flex:0 0 auto}
  .top-controls{flex:1 1 620px;justify-content:flex-start}
  .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:900px){
  body.nav-open{overflow:hidden}
  .topbar{position:sticky;top:0;padding:8px 10px;display:block}
  .mobile-head-row{display:flex;width:100%;justify-content:flex-start}
  .mobile-nav-btn{display:inline-grid;place-items:center}
  .brand{min-width:0;flex:1}
  .brand img{width:44px;height:44px}
  .brand strong{font-size:16px}.brand span{font-size:10px;line-height:1.25;white-space:normal;overflow:visible;text-overflow:clip;max-width:62vw}
  .top-controls{display:flex;width:100%;gap:8px;margin-top:8px;padding-bottom:4px;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;justify-content:flex-start;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
  .top-controls>label,.top-controls>.session-box{flex:0 0 auto}
  .top-controls label{min-width:132px}
  .top-controls select,.top-controls input{width:100%;min-height:42px;padding:9px 10px}
  .session-box{min-height:42px;padding:7px 10px}
  .app-shell{display:block;min-height:calc(100vh - 104px)}
  aside#nav{display:block!important;position:fixed;top:0;left:0;bottom:0;width:min(84vw,320px);height:100dvh;z-index:120;padding:78px 12px 18px;overflow-y:auto;overflow-x:hidden;background:#091522;border-right:1px solid #29445e;border-bottom:0;transform:translateX(-105%);transition:transform .2s ease;box-shadow:10px 0 32px #0008}
  aside#nav.mobile-open{transform:translateX(0)}
  aside#nav button{min-width:0;width:100%;white-space:normal;min-height:44px;margin:3px 0;padding:11px 12px}
  .nav-backdrop{position:fixed;inset:0;z-index:110;background:#0009;display:block}
  .nav-backdrop.hidden{display:none}
  main{width:100%;max-width:none;padding:14px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.three,.grid.two,.split,.report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .head{flex-direction:column;align-items:stretch}
  .head .toolbar,.head>div:last-child{width:100%}
  .head .btn{min-height:42px}
  .modal-card{margin:2vh auto;width:min(96vw,900px);max-height:96dvh;padding:16px;padding-top:46px}
  .modal-close{top:8px;right:10px;width:40px;height:40px}
  .form-grid{grid-template-columns:1fr 1fr}
  .btn{min-height:42px;padding:9px 12px}
  .btn.small,.btn.tiny{min-height:38px}
  .tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px;-webkit-overflow-scrolling:touch}
  .tabs button{min-width:max-content;min-height:42px}
  .filterbar{align-items:stretch}.filterbar .field{min-width:min(230px,80vw)}
  .task-row{grid-template-columns:30px 62px minmax(170px,1fr) minmax(90px,auto);overflow:auto}
  .task-row>*:nth-child(5),.task-row>*:nth-child(6){display:block}
  .account-card{grid-template-columns:1fr 1fr;align-items:start}
}

@media(max-width:640px){
  body{font-size:13px}
  main{padding:10px}
  .grid,.grid.three,.grid.two,.split,.form-grid,.report-grid{grid-template-columns:1fr}
  .card,.panel{padding:12px;border-radius:10px}
  .card .value{font-size:22px}
  .head h1{font-size:21px}
  .head .toolbar,.toolbar{display:grid;grid-template-columns:1fr;align-items:stretch}
  .toolbar .btn,.toolbar a.btn{width:100%;text-align:center}
  .top-controls label{min-width:122px}
  .top-controls .session-box{min-width:max-content}
  .modal-card{margin:0;width:100vw;max-width:none;height:100dvh;max-height:100dvh;border-radius:0;border-left:0;border-right:0;padding:54px 12px 16px}
  .modal-backdrop{display:none}
  .field input,.field select,.field textarea{min-height:44px;font-size:16px}
  .login-overlay{padding:10px;align-items:center}
  .login-card{width:min(100%,430px);padding:20px 16px;border-radius:14px;max-height:96dvh;overflow:auto}
  .login-card img{width:68px;height:68px}.login-card h1{font-size:19px}
  .login-card .field input{min-height:46px;font-size:16px}
  .login-btn{min-height:48px;font-size:16px}
  .summary-line{gap:10px;align-items:flex-start;flex-direction:column}
  .owner-kpi-actions,.drill-toolbar{grid-template-columns:1fr 1fr}
  .owner-kpi-main{min-height:112px}
  .task-row{display:grid;grid-template-columns:28px 58px minmax(0,1fr);gap:7px;padding:10px}
  .task-row>*:nth-child(n+4){display:block!important;grid-column:3;text-align:left!important}
  .task-row .right{text-align:left}
  .qa-check-row{grid-template-columns:1fr 1fr}.qa-check-row>*:first-child{grid-column:1/-1}
  .account-card{grid-template-columns:1fr}.account-card>*{min-width:0}
  .audit-line{grid-template-columns:1fr}
  .contract-paper{padding:10px;font-size:12px}.contract-meta{display:block;overflow-x:auto}.contract-meta th{width:42%}
  .pkwt-read-box{height:58dvh;padding:6px}
  .signature-canvas-wrap{width:100%}#employeeSignatureCanvas{max-width:100%}
  .saved-signature{max-width:100%;height:auto}
  .table-wrap{max-height:58dvh}
  .toast{left:10px;right:10px;bottom:10px;text-align:center}
}

@media(min-width:901px){
  .nav-backdrop{display:none!important}
  aside#nav{transform:none!important}
}
.hidden{display:none!important}

/* v1.4.0 Local Sync */
.sync-pre{max-width:340px;max-height:180px;overflow:auto;white-space:pre-wrap;word-break:break-word;font-size:10px;background:#081724;padding:8px;border-radius:8px}
@media(max-width:700px){.sync-pre{max-width:220px}.panel.table-wrap table{min-width:760px}}

/* v1.4.2 All-role actionable dashboards */
.role-action-card{display:flex;flex-direction:column;gap:12px;min-width:0}
.role-card-main{appearance:none;-webkit-appearance:none;background:transparent;border:0;color:inherit;font:inherit;text-align:left;padding:0;margin:0;cursor:pointer;width:100%}
.role-card-main:focus-visible{outline:2px solid #ff6a00;outline-offset:5px;border-radius:8px}
.role-action-card:hover{border-color:#3d7da8;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.role-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
.role-card-hint{font-size:11px;color:#79b9e8;margin-top:8px}
.btn.tiny{padding:8px 12px;font-size:12px;border-radius:9px;min-height:36px}
.role-detail-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
@media(max-width:760px){.role-action-grid{grid-template-columns:1fr!important}.role-detail-head{display:block}.role-detail-head .btn{margin-top:10px}.role-card-actions{display:grid;grid-template-columns:1fr 1fr}.btn.tiny{min-height:44px}}

/* v1.4.3 Manual Purchase Plan */
.manual-purchase-panel{border-color:#2d6a8f}.manual-purchase-panel textarea{min-height:82px}
@media(max-width:720px){.manual-purchase-panel .form-grid{grid-template-columns:1fr}.manual-purchase-panel .toolbar{display:grid;grid-template-columns:1fr}.manual-purchase-panel .btn{width:100%}}

/* v1.4.5 Purchase workflow */
.inline-edit{display:flex;gap:6px;align-items:center;min-width:220px}.inline-qty{width:105px;min-height:38px;padding:7px 9px}.inline-price{width:125px;min-height:38px;padding:7px 9px}.action-stack{display:flex;gap:6px;flex-wrap:wrap;min-width:180px}.hidden{display:none!important}.manual-purchase-panel{margin-top:12px}
@media(max-width:700px){.inline-edit{min-width:190px}.action-stack{min-width:160px}.inline-qty,.inline-price{min-height:44px}}

/* v1.4.6 Stock Opname inline list */
.opname-live-table .opname-physical-input{min-width:120px;width:150px;padding:9px 10px}.opname-live-table td{vertical-align:middle}.opname-live-table .red{color:#ff6b6b}.opname-live-table .green{color:#2dd17d}
@media(max-width:760px){.opname-live-table{min-width:900px}.opname-live-table .opname-physical-input{width:130px}}

/* v1.4.7 visible PR workflow */
.pr-workflow-table th.pr-sticky-action,.pr-workflow-table td.pr-sticky-action{position:sticky;right:0;z-index:3;background:#10263b;min-width:170px;box-shadow:-5px 0 10px rgba(0,0,0,.18)}
.pr-workflow-table td.pr-sticky-action{background:#0d2031}
.pr-workflow-btn{font-weight:800;white-space:normal;min-width:150px}
.pr-flow-summary{margin:14px 0}.inline-edit{min-width:260px}.inline-qty{min-width:115px}
@media(max-width:800px){.pr-workflow-table th.pr-sticky-action,.pr-workflow-table td.pr-sticky-action{position:sticky;right:0;min-width:145px}.pr-workflow-btn{min-width:130px}.inline-edit{min-width:220px}}


/* v1.4.9 Purchase decision table */
.purchasing-decision-table{max-height:620px;overflow:auto}
.purchasing-decision-table table{min-width:1080px}
.purchasing-decision-table td,.purchasing-decision-table th{vertical-align:middle}
.purchase-decision-qty{min-width:110px;max-width:140px}
.inline-edit.compact{display:flex;align-items:center;gap:6px;min-width:150px}
.center-cell{text-align:center}
@media(max-width:760px){
  .purchasing-decision-table table{min-width:950px}
  .purchase-decision-qty{min-width:95px;max-width:115px}
}

/* v1.5.0 Performance Safe */
.table-wrap{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}


/* v1.5.1 Approval queue visible */
.approval-queue-panel{border-color:#315c7c;box-shadow:0 8px 28px #0003}
.approval-queue-panel h2{font-size:20px}
.approval-action-cell{position:sticky;right:0;background:#0d2135;min-width:190px;z-index:3}
.approval-queue-table{max-height:420px}
.approval-queue-table th:last-child{position:sticky;right:0;z-index:5}
.approval-queue-table .inline-qty,.approval-queue-table .inline-price{max-width:145px}
@media(max-width:800px){.approval-action-cell{position:static}.approval-queue-table th:last-child{position:sticky;right:auto}.approval-queue-panel .statline{align-items:flex-start}}

/* v1.6.0 Role Workspace */
.workspace-section{margin-top:18px}.workspace-first{margin-top:4px}.workspace-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin:0 0 10px}.workspace-section-head h2{margin:0 0 3px;font-size:18px}.workspace-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.workspace-quick{min-height:78px;padding:13px 14px;border:1px solid var(--border);border-radius:12px;background:#102841;color:#fff;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:6px;justify-content:center;transition:transform .12s ease,border-color .12s ease,background .12s ease}.workspace-quick b{font-size:14px}.workspace-quick span{font-size:11px;color:#9fc2df;line-height:1.35}.workspace-quick:hover,.workspace-quick:focus-visible{background:#173752;border-color:#ff7d27;transform:translateY(-1px);outline:none}.workspace-card-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.workspace-history{margin-top:10px}.workspace-mini-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.role-action-card{min-height:155px}.role-card-actions{margin-top:10px}.workspace-section .card .value{font-size:24px}
@media(max-width:1100px){.workspace-quick-grid,.workspace-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.workspace-quick-grid,.workspace-card-grid,.workspace-mini-grid{grid-template-columns:1fr}.workspace-quick{min-height:68px}.workspace-section{margin-top:14px}.workspace-section-head{align-items:flex-start}.role-action-card{min-height:auto}}


/* v1.6.1 Superadmin Audit */
.superadmin-nav-note{margin:0 10px 10px;padding:8px 10px;border:1px solid #36536d;border-radius:8px;background:#0d2135;color:#9ec6e7;font-size:11px}
.superadmin-perspective{display:flex;align-items:center;gap:7px;padding:5px 8px;border:1px solid #36536d;border-radius:9px;background:#0d2135;color:#9ec6e7;font-size:11px}
.superadmin-perspective select{background:#071420;color:#fff;border:1px solid #36536d;border-radius:6px;padding:5px 8px;min-height:30px}
.superadmin-perspective-buttons{gap:8px}
@media(max-width:720px){.superadmin-perspective{width:100%;justify-content:space-between}.superadmin-perspective select{flex:1}.superadmin-perspective-buttons .btn{flex:1 1 42%}}


/* ======================= v1.6.2 LAPTOP WIDTH FIT ======================= */
/* Keep the whole application inside the visible laptop viewport. Wide data tables
   scroll inside their own container instead of pushing the application off-screen. */
html,body{width:100%;max-width:100%;overflow-x:hidden}
body{min-width:0}
.topbar{width:100%;max-width:100vw;min-width:0}
.mobile-head-row,.brand,.top-controls,.session-box,.app-shell,aside,main,.head,.panel,.card,.section,.grid,.split,.form-grid{min-width:0}
.app-shell{width:100%;max-width:100vw;grid-template-columns:clamp(210px,16vw,240px) minmax(0,1fr);overflow:hidden}
aside{width:100%;min-width:0;overflow-x:hidden}
main{width:100%;max-width:none;min-width:0;padding:18px;overflow-x:hidden}
.head{flex-wrap:wrap}.head>div:first-child{min-width:0;flex:1 1 480px}.head>.toolbar,.head>div:last-child{max-width:100%}
.toolbar{max-width:100%}.toolbar .btn{white-space:normal}
.grid,.grid.two,.grid.three,.grid.four{width:100%;max-width:100%;min-width:0}
.card,.panel{max-width:100%;overflow:hidden}
.notice,.flow{max-width:100%;overflow-wrap:anywhere}
.table-wrap{display:block;width:100%;max-width:100%;min-width:0;overflow-x:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{width:max-content;min-width:100%;max-width:none}
table th,table td{max-width:340px;overflow-wrap:anywhere}
.form-grid input,.form-grid select,.form-grid textarea,.filterbar input,.filterbar select{min-width:0;max-width:100%}
.top-controls{min-width:0;max-width:100%;justify-content:flex-end}
.top-controls label{min-width:0}.top-controls select,.top-controls input{max-width:190px;min-width:0}

/* Standard laptop screens: keep controls compact and content fully visible. */
@media (min-width:901px) and (max-width:1600px){
  body{font-size:13px}
  .topbar{gap:12px;padding:9px 12px;align-items:center;flex-wrap:nowrap}
  .brand{min-width:220px;max-width:320px;flex:0 1 300px}
  .brand img{width:46px;height:46px}.brand strong{font-size:17px}.brand span{font-size:10px}
  .top-controls{gap:7px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px}
  .top-controls label{font-size:10px;flex:0 0 auto}.top-controls select,.top-controls input{padding:6px 7px;min-height:30px;max-width:165px}
  .session-box{flex:0 0 auto}
  .app-shell{grid-template-columns:clamp(205px,16vw,230px) minmax(0,1fr)}
  main{padding:16px}
  .head h1{font-size:22px}.head{gap:10px;margin-bottom:12px}
  .grid{gap:10px}.card,.panel{padding:12px}.card .value{font-size:21px}
  .btn{padding:7px 9px}.btn.small{padding:5px 7px}
  .table-wrap{max-width:100%}
}

/* 1366px class laptops: prefer 3 KPI columns and compact header. */
@media (min-width:1001px) and (max-width:1400px){
  .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
  .grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
  .brand{min-width:205px;max-width:255px}.brand span{max-width:190px}
  .top-controls select,.top-controls input{max-width:145px}
}

/* If a module has a very wide horizontal workflow, only that section scrolls. */
.pr-workflow-table,.detail-kv,.contract-meta{max-width:none}
.pr-flow-summary{max-width:100%}

/* ======================= END v1.6.2 LAPTOP WIDTH FIT ======================= */

/* ======================= v1.6.4 PROJECT OWNER WORKSPACE ======================= */
#projectControl{min-width:190px}#projectControl select{min-width:190px;max-width:260px}
#projectCreateBtn{align-self:flex-end;margin-bottom:1px;white-space:nowrap}
.project-readonly-note{font-size:10px;color:var(--muted);margin-top:3px}
.project-setup-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}
.project-setup-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.project-setup-tabs .btn.active{background:#244564;border-color:#3b678b}
.project-master-actions{display:flex;gap:6px;flex-wrap:wrap}.project-master-actions .btn{white-space:nowrap}
.project-service-card{border:1px solid var(--border);background:#0a1a29;border-radius:9px;padding:10px}.project-service-card b{font-size:14px}
.project-form-help{font-size:11px;color:var(--muted);margin-top:4px}.project-warning{border-left:4px solid var(--orange)}
.project-bom-input{min-height:180px!important;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}
@media(max-width:1366px){#projectControl{min-width:165px}#projectControl select{min-width:165px;max-width:210px}.project-setup-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){#projectCreateBtn{width:100%}.project-setup-summary{grid-template-columns:1fr}}
/* ======================= END v1.6.4 ======================= */

/* v1.9.6 — Vale-only initial project + Owner project deletion */
#projectDeleteBtn{align-self:flex-end;margin-bottom:1px;white-space:nowrap}
.v196-delete-summary{display:grid;gap:7px;margin:12px 0;padding:12px;border:1px solid #613737;border-radius:9px;background:#251518}
.v196-delete-summary b{color:#fff}.v196-protected{border-left:4px solid var(--green)}
@media(max-width:760px){#projectDeleteBtn{width:100%}}
/* v1.7.0 Rumah Aqiqah incidental workspace */
.raa-order-selector{display:flex;flex-direction:column;gap:4px;min-width:min(420px,100%);font-size:11px;color:var(--muted)}
.raa-order-selector select{background:#071420;color:#fff;border:1px solid #2b4157;border-radius:7px;padding:8px;max-width:100%}
tr.row-active td{background:#102d48}
.project-bom-input{min-height:210px!important;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}
@media(max-width:900px){.raa-order-selector{min-width:100%}.workspace-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.workspace-quick-grid{grid-template-columns:1fr}.raa-order-selector select{width:100%}}

/* v1.8.0 Task-First Workspace */
.v180-context-strip{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:9px 12px;margin:0 0 14px;background:#081827;border:1px solid #203a51;border-radius:9px;color:#9dbbd4;font-size:12px}.v180-context-strip b{color:#fff}.v180-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.v180-quick{min-width:0;min-height:76px;padding:12px 14px;background:#0d263c;border:1px solid #29445d;border-radius:11px;color:#fff;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:5px;justify-content:center}.v180-quick.primary{border-color:#e66b12;background:#17324c}.v180-quick:hover{border-color:#ff7d27;background:#173a57}.v180-quick b{font-size:14px}.v180-quick span{font-size:11px;color:#9fbfd9;line-height:1.35}.v180-task-list{display:grid;gap:8px}.v180-task-row{display:grid;grid-template-columns:92px minmax(0,1fr) 150px 92px;gap:10px;align-items:center;background:#0a1b2b;border:1px solid #223a50;border-radius:10px;padding:10px 12px}.v180-task-main{min-width:0}.v180-task-main b{font-size:13px}.v180-readiness{background:#0a1b2b;border:1px solid #223a50;border-radius:10px;padding:4px 12px}.v180-flow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#0a1b2b;border:1px solid #223a50;border-radius:10px;padding:14px}.v180-flow span{padding:8px 10px;background:#102b43;border-radius:8px}.v180-kpi{margin-top:0}
@media(max-width:1180px){.v180-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.v180-task-row{grid-template-columns:80px minmax(0,1fr) 130px 84px}}
@media(max-width:700px){.v180-context-strip{display:grid;gap:5px}.v180-quick-grid{grid-template-columns:1fr}.v180-task-row{grid-template-columns:1fr;gap:6px}.v180-task-row>div:last-child{justify-self:stretch}.v180-task-row .btn{width:100%}}

/* v1.9.0 Strict Project Isolation */
.strict-project-badge{display:flex;flex-direction:column;justify-content:center;min-width:155px;max-width:240px;padding:6px 10px;border:1px solid var(--border);border-radius:9px;background:#0b1d2f;line-height:1.15}
.strict-project-badge span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.strict-project-badge b{font-size:12px;color:#fff;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.strict-project-badge small{font-size:9px;color:#79bfff;margin-top:3px}
.strict-account-head,.strict-account-row{grid-template-columns:1.1fr 1fr .8fr 1.25fr .65fr .55fr}.strict-account-row .badge{max-width:100%;white-space:normal}
@media(max-width:900px){.strict-project-badge{min-width:130px;max-width:55vw}.strict-account-head{display:none}.strict-account-row{grid-template-columns:1fr 1fr}.strict-account-row>span{min-width:0}.strict-account-row>span:nth-child(n+3){font-size:11px}}

/* v1.9.1 — Gudang Simple */
.wh-quick-modal{min-width:0}.wh-quick-toolbar{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin:10px 0}.wh-search-field{flex:1;min-width:220px}.wh-quick-table-wrap{max-height:58vh}.wh-quick-table th:nth-child(1){width:48%}.wh-quick-table th:nth-child(2){width:16%}.wh-quick-table th:nth-child(3){width:22%}.wh-quick-table th:nth-child(4){width:14%}.wh-qty-input{width:100%;min-width:100px;background:#071420;color:#fff;border:1px solid #31506d;border-radius:7px;padding:9px 10px;text-align:right}.wh-qty-input:focus{outline:2px solid #3a8bd8;outline-offset:1px}.wh-uom-pill{display:inline-flex;min-width:44px;justify-content:center;border:1px solid #31506d;background:#10253a;border-radius:999px;padding:5px 8px;font-weight:700}.wh-savebar{position:sticky;bottom:-18px;display:flex;justify-content:space-between;align-items:center;gap:12px;background:#0b1a2a;border-top:1px solid #2b4965;margin:14px -18px -18px;padding:12px 18px;z-index:4}.wh-more-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0}.wh-more-options.hidden{display:none}.wh-quick-row td{vertical-align:middle}
@media(max-width:700px){.wh-more-options{grid-template-columns:1fr}.wh-quick-table th:nth-child(1){width:auto}.wh-quick-table-wrap{max-height:60vh}.wh-savebar{flex-direction:column;align-items:stretch}.wh-savebar .btn{width:100%}.wh-quick-table{min-width:620px}}

/* v1.9.3 Vale client request */
.v193-alert{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:11px 14px;border:1px solid #315c7c;border-left:4px solid #ff7d27;border-radius:9px;background:#0d2135}.v193-alert.success{border-left-color:#2bd37f}.v193-alert span{color:var(--muted);flex:1;min-width:220px}.vr-inner{background:#091a2b}.vr-inner h3{margin:0 0 8px}.action-stack{display:flex;gap:5px;flex-wrap:wrap}
@media(max-width:900px){.v193-alert{align-items:flex-start}.v193-alert span{flex-basis:100%}.vr-inner .table-wrap{max-height:460px}}

/* v1.9.4 Final RBAC */
.rbac-project-note{margin:4px 8px 12px;padding:9px 10px;border:1px solid #29445d;border-radius:8px;background:#0b1c2c;color:#a9bfd2;font-size:11px;line-height:1.35}.rbac-project-note b{color:#fff;font-size:10px;letter-spacing:.04em}.rbac-scope-lock{border-left:4px solid var(--orange)}

/* v1.9.5 Vale extra-item and event-menu overlays */
.v195-tabs{margin:0 0 14px}.v195-current{background:#091a2b;border-left:4px solid #3b8bd8}.v195-current ol{columns:2;column-gap:28px}.v195-items{display:grid;gap:9px;margin:8px 0}.v195-item-row{display:grid;grid-template-columns:minmax(170px,1.2fr) minmax(210px,1.4fr) minmax(100px,.55fr) minmax(130px,.65fr) 38px;gap:8px;align-items:end;padding:10px;background:#091a2b;border:1px solid #29445d;border-radius:10px}.v195-item-row .field{margin:0}.v195-item-row .btn{height:38px}.v195-check{display:flex;gap:8px;align-items:center;margin:14px 0;color:#b9cbda}.v195-check input{width:17px;height:17px}.v195-current .statline{align-items:center}.v195-current ol{margin-bottom:0}.v195-current li{break-inside:avoid;margin:4px 0}
@media(max-width:1050px){.v195-item-row{grid-template-columns:1fr 1fr}.v195-item-row .v195-remove-item{grid-column:2;justify-self:end}.v195-current ol{columns:1}}
@media(max-width:640px){.v195-item-row{grid-template-columns:1fr}.v195-item-row .v195-remove-item{grid-column:1;width:100%}.v195-tabs{display:grid}.v195-tabs button{width:100%}}