:root{--bg: #F7F6F2;--surface: #FFFFFF;--sunk: #EFEDE6;--line: #E8E5DC;--line-strong: #D3D1C7;--fg: #1A1A18;--muted: #6B6A66;--accent: #0F6E56;--accent-fg: #FFFFFF;--accent-soft: #E1F5EE;--amber: #BA7517;--amber-soft: #FDF3E3;--blue: #185FA5;--blue-soft: #E6F1FB;--red: #A32D2D;--red-soft: #FCEBEB;--violet: #534AB7;--violet-soft: #EEEDFE;--shadow: 0 4px 16px rgba(0,0,0,.08), 0 1px 3px rgba(0,0,0,.05);--sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;color-scheme:light}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}a{color:var(--accent)}[hidden]{display:none!important}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.topbar{position:sticky;top:0;z-index:10;background:var(--surface);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}.topbar-in{max-width:1080px;margin:0 auto;padding:10px max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))}.brand-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:10px;min-width:0}.logo{width:36px;height:36px;border-radius:8px;object-fit:cover;flex:none;display:block}.brand-name{font-weight:600;font-size:14px;line-height:1.2;letter-spacing:-.3px}.brand-sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav{display:flex;gap:2px;overflow-x:auto;margin-top:8px;scrollbar-width:none}.nav::-webkit-scrollbar{display:none}.nav button{border:none;background:none;padding:9px 12px 11px;font-size:14px;font-weight:500;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap}.nav button[aria-current=page]{color:var(--fg);border-bottom-color:var(--accent);font-weight:600}.nav .badge{display:inline-block;min-width:18px;padding:0 5px;margin-left:5px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;line-height:18px;text-align:center;font-variant-numeric:tabular-nums}.main{max-width:1080px;margin:0 auto;padding-block:20px 64px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:16px}.page-head h1{margin:0;font-size:20px;font-weight:600;letter-spacing:-.5px;text-wrap:balance}.page-head p{margin:2px 0 0;color:var(--muted);font-size:14px}.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 14px;font-weight:500;font-size:13px;line-height:1.3}.btn:hover{border-color:var(--muted)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}.btn.primary:hover{background:#0d5e49;border-color:#0d5e49}.btn.danger{color:var(--red);border-color:var(--red-soft)}.btn.ghost{border-color:transparent;background:transparent}.btn.sm{padding:5px 10px;font-size:13px}.btn:disabled{opacity:.5;cursor:not-allowed}.linkbtn{border:none;background:none;padding:0;color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:2px}input,select,textarea{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:9px 11px;min-width:0}textarea{resize:vertical;min-height:72px}input[type=file]{padding:7px}input[type=checkbox]{width:auto}.field{display:grid;gap:5px;min-width:0}.field>label,.label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em}.hint{font-size:12px;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid .full{grid-column:1 / -1}@media (max-width: 560px){.form-grid{grid-template-columns:1fr}}.err{color:var(--red);font-size:13px}.actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:16px}.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}.toolbar .grow{flex:1 1 200px;min-width:0}.toolbar select{width:auto;max-width:100%}.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:8px;overflow:hidden;flex-wrap:nowrap}.seg button{border:none;background:var(--surface);padding:7px 12px;font-size:13px;font-weight:500;color:var(--muted);border-right:1px solid var(--line);white-space:nowrap}.seg button:last-child{border-right:none}.seg button[aria-pressed=true]{background:var(--accent);color:var(--accent-fg)}.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px}.panel-pad{padding:16px}.panel h2{margin:0 0 12px;font-size:15px}.kpis{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:18px}.kpis>.kpi{flex:1 1 140px}.kpi{background:var(--surface);padding:12px 14px;min-width:0}.kpi b{display:block;font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.2}.kpi span{font-size:12px;color:var(--muted)}.kpi.alert b{color:var(--red)}.list{display:grid;gap:8px}.row{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 3px #0000000d;padding:12px 14px;display:grid;gap:8px;text-align:left;width:100%}button.row:hover{border-color:var(--line-strong)}.row-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.row-title{font-weight:600;font-size:15px;overflow-wrap:anywhere}.code{font-family:var(--mono);font-size:12px;color:var(--muted)}.meta{display:flex;flex-wrap:wrap;gap:2px 14px;font-size:13px;color:var(--muted)}.meta strong{color:var(--fg);font-weight:500}.late{color:var(--red)!important;font-weight:600}.pill{display:inline-block;white-space:nowrap;font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--sunk);color:var(--fg)}.pill.blue{background:var(--blue-soft);color:var(--blue)}.pill.amber{background:var(--amber-soft);color:var(--amber)}.pill.violet{background:var(--violet-soft);color:var(--violet)}.pill.green{background:var(--accent-soft);color:var(--accent)}.pill.red{background:var(--red-soft);color:var(--red)}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.steps i{height:4px;border-radius:2px;background:var(--sunk)}.steps i.on{background:var(--accent)}.steps.cancel i.on{background:var(--red)}.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--surface)}table{border-collapse:collapse;width:100%;font-size:14px}th,td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{font-size:12px;font-weight:600;color:var(--muted);background:var(--sunk)}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}tr:last-child td{border-bottom:none}.empty{border:1px dashed var(--line-strong);border-radius:10px;padding:28px 18px;text-align:center;color:var(--muted)}.empty b{display:block;color:var(--fg);font-size:15px;margin-bottom:4px}dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:0;font-size:14px}dl.kv dt{color:var(--muted)}dl.kv dd{margin:0;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap}@media (max-width: 420px){dl.kv{grid-template-columns:1fr;gap:0 0}dl.kv dd{margin-bottom:8px}}.section{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}.section h3{margin:0 0 10px;font-family:var(--mono);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.timeline{list-style:none;margin:0;padding:0;display:grid;gap:12px}.timeline li{display:grid;grid-template-columns:10px 1fr;gap:10px}.timeline .dot{width:10px;height:10px;border-radius:50%;background:var(--accent);margin-top:5px}.tl-top{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--muted)}.tl-note{font-size:14px;margin-top:3px;white-space:pre-wrap;overflow-wrap:anywhere}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media (max-width: 760px){.two-col{grid-template-columns:1fr}}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#1a1a1866;z-index:40}.sheet{position:fixed;left:0;right:0;bottom:0;z-index:41;max-height:92%;overflow:auto;background:var(--surface);border-radius:16px 16px 0 0;box-shadow:var(--shadow);padding:18px max(18px,env(safe-area-inset-right,0px)) calc(22px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px))}@media (min-width: 720px){.sheet{left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%);width:min(680px,calc(100% - 48px));border-radius:14px;max-height:88%}}.sheet-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}.sheet-head h2{margin:0;font-size:19px;overflow-wrap:anywhere}.x{flex:none;width:34px;height:34px;border-radius:8px;border:none;background:var(--sunk);font-size:18px;line-height:1}.toast{position:fixed;left:50%;transform:translate(-50%);bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:60;background:var(--fg);color:var(--bg);padding:10px 16px;border-radius:8px;font-size:14px;max-width:calc(100% - 32px)}.toast.error{background:var(--red);color:#fff}.login{min-height:100vh;display:grid;place-items:center;padding:24px max(16px,env(safe-area-inset-right,0px)) 24px max(16px,env(safe-area-inset-left,0px))}.login-card{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:28px 24px 22px;box-shadow:var(--shadow)}.login-logo{width:120px;height:120px;border-radius:14px;object-fit:cover;display:block;margin:0 auto 6px}.login-card h1{font-size:20px;font-weight:600;letter-spacing:-.4px;margin:14px 0 4px;text-align:center}.login-card p{color:var(--muted);margin:0 0 20px;font-size:13px;text-align:center}.login-card form{display:grid;gap:12px}.center-msg{min-height:60vh;display:grid;place-items:center;color:var(--muted);text-align:center;padding:24px}@media (prefers-reduced-motion: no-preference){.sheet{animation:rise .16s ease-out}@keyframes rise{0%{opacity:.5}to{opacity:1}}}.kpi-btn{border:none;text-align:left;font:inherit;color:inherit;cursor:pointer;position:relative}.kpi-btn:hover{background:var(--accent-soft)}.kpi-btn:after{content:"Lihat →";position:absolute;right:12px;top:10px;font-size:11px;color:var(--accent);opacity:0;transition:opacity .12s}.kpi-btn:hover:after,.kpi-btn:focus-visible:after{opacity:1}.kpi-group-label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em;margin:0 0 8px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.filter-note{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:-4px 0 12px}tr.click{cursor:pointer}tr.click:hover td{background:var(--accent-soft)}.click-row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:14px;flex-wrap:wrap;width:100%;background:none;border-left:0;border-right:0;border-bottom:0;text-align:left;cursor:pointer;color:inherit;font:inherit}.click-row:hover{color:var(--accent)}.choice{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer;font-size:14px}.choice.on{border-color:var(--accent);background:var(--accent-soft)}.choice input{margin-top:3px}.internal{background:var(--sunk);margin-left:-18px;margin-right:-18px;padding:16px 18px;border-top:1px dashed var(--line-strong)}.stage-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}@media (max-width: 520px){.stage-row{grid-template-columns:1fr 1fr}}.stage{border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:8px 6px;font-size:12px;font-weight:500;color:var(--muted)}.stage.done{border-color:var(--accent-soft);background:var(--accent-soft);color:var(--accent)}.stage.cur{border-color:var(--accent);background:var(--accent);color:var(--accent-fg);font-weight:600}.stage:hover:not(.cur){border-color:var(--accent);color:var(--accent)}.funnel{display:grid;gap:8px}.funnel-row{display:grid;grid-template-columns:minmax(150px,220px) 1fr auto;gap:10px;align-items:center;font-size:13px}.funnel-bar{height:10px;border-radius:5px;background:var(--sunk);overflow:hidden}.funnel-bar i{display:block;height:100%;background:var(--accent);border-radius:5px}@media (max-width: 560px){.funnel-row{grid-template-columns:1fr auto}.funnel-row .funnel-bar{grid-column:1 / -1;grid-row:2}}.check-list{display:grid;gap:6px;max-height:220px;overflow-y:auto}.os-note{background:var(--accent-soft);color:var(--accent);border-radius:10px;padding:10px 12px;font-size:13px}.os-note a{font-weight:600;margin-left:4px}.stage:disabled{cursor:default}.sec-title{font-size:15px;font-weight:600;margin:0 0 10px}.sec-title .hint{font-weight:400}.chip-row{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-strong);border-radius:999px;padding:6px 12px;font-size:13px;cursor:pointer;background:var(--surface);-webkit-user-select:none;user-select:none}.chip input{width:auto;margin:0;accent-color:var(--accent)}.chip.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);font-weight:500}.kode-tag{display:inline-block;font-family:var(--mono);font-size:12px;font-weight:500;background:var(--sunk);color:var(--fg);border-radius:6px;padding:1px 6px;margin-right:6px;vertical-align:1px}.doc-lines{display:grid;gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}.doc-line{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;border-top:1px solid var(--line);background:var(--surface)}.doc-line:first-child{border-top:none}.doc-jenis{display:flex;align-items:center;gap:8px;font-size:14px}.doc-files{display:flex;gap:6px;flex-wrap:wrap}.dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}.dot.ok{background:var(--accent)}.dot.wait{background:var(--amber)}.dot.no{background:var(--red)}