:root{
  --bg:#f3f5f2;--card:#fff;--ink:#1b2520;--muted:#66726b;--line:#e3e8e4;--soft:#f7f9f7;
  --brand:#1f5f3f;--brand2:#2f7a54;--brandSoft:#e5efe8;
  --in:#1d7a46;--out:#b2412f;--amber:#a86a00;--amberSoft:#fff3d6;--blue:#2b5fa8;--blueSoft:#e6eefa;
  --redSoft:#fbe6e2;--greenSoft:#e2f3e8;--grey:#eef1ef;--pink:#b8346b;--pinkSoft:#fce7f0;--r:12px;
}
*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font:14.5px/1.45 "Plus Jakarta Sans",system-ui,sans-serif}
button{font:inherit;cursor:pointer;color:inherit}
svg.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:middle}
/* ---------- login ---------- */
#login{position:fixed;inset:0;z-index:60;background:linear-gradient(160deg,#173f2b 0%,#1f5f3f 55%,#2f7a54 100%);display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}
.lbox{background:#fff;border-radius:18px;width:min(400px,100%);padding:26px 24px;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.lbox .brand{display:flex;gap:12px;align-items:center;margin-bottom:18px}
.lbox .brand .mark{width:44px;height:44px;border-radius:12px;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:700;font-size:19px}
.lbox h1{font-size:19px;margin:0}.lbox .brand small{color:var(--muted);font-size:12.5px}
.lerr{background:var(--redSoft);color:var(--out);border-radius:8px;padding:9px 12px;font-size:13px;margin:12px 0 0}
.lok{background:var(--greenSoft);color:#11673a;border-radius:8px;padding:9px 12px;font-size:13px;margin:12px 0 0}
.demo{margin-top:16px;border-top:1px dashed var(--line);padding-top:12px;font-size:12px;color:var(--muted)}
.demo .acc{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.demo .acc button{border:1px solid var(--line);background:var(--soft);border-radius:16px;padding:4px 10px;font-size:12px;font-weight:600}
.demo .acc button:hover{border-color:var(--brand2);color:var(--brand)}
.pwrap{position:relative}.pwrap button{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--muted);font-size:12px;font-weight:600}
/* ---------- layout ---------- */
.app{display:grid;grid-template-columns:228px 1fr;min-height:100vh}
aside{background:#173f2b;color:#dfe9e3;padding:18px 12px;position:sticky;top:0;height:100vh;overflow:auto}
.logo{display:flex;align-items:center;gap:10px;padding:0 8px 16px}
.logo .mark{width:34px;height:34px;border-radius:9px;background:#3d9a69;display:grid;place-items:center;font-weight:700;color:#fff;flex:none}
.logo b{display:block;font-size:15px;color:#fff}.logo small{font-size:11.5px;opacity:.7}
.outlet{margin:0 8px 14px;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,.07);font-size:12px}
.outlet b{display:block;color:#fff;font-size:13.5px}
nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:#cfe0d6;font-size:14px;margin-bottom:2px;cursor:pointer}
nav a:hover{background:rgba(255,255,255,.07)}
nav a.on{background:#fff;color:var(--brand);font-weight:600}
nav a .badge{margin-left:auto;background:#e8a33a;color:#2b1d00;font-size:11px;font-weight:700;border-radius:10px;padding:1px 7px}
nav .sep{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.5;margin:14px 10px 6px}
.main{min-width:0}
.topbar{display:flex;align-items:center;gap:10px;padding:10px 24px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:12}
.topbar .ttl{font-weight:700;font-size:15px;display:none}
.proto{font-size:11.5px;background:var(--amberSoft);color:var(--amber);padding:4px 10px;border-radius:20px;font-weight:600;white-space:nowrap}
.sel{font:inherit;font-size:13px;font-weight:600;border:1px solid var(--line);border-radius:8px;padding:6px 9px;background:#fff;color:var(--ink)}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.iconbtn{position:relative;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;color:var(--ink)}
.iconbtn .dot{position:absolute;top:-5px;right:-5px;background:var(--out);color:#fff;font-size:10.5px;font-weight:700;border-radius:10px;min-width:18px;height:18px;padding:0 5px;display:grid;place-items:center}
.uchip{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:22px;padding:3px 10px 3px 3px;background:#fff}
.uchip .nm{font-size:12.5px;line-height:1.2}.uchip .nm b{display:block;font-size:13px}.uchip .nm span{color:var(--muted)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--brandSoft);color:var(--brand);display:grid;place-items:center;font-weight:700;font-size:12px;flex:none}
.avatar.sa{background:#2a2f4a;color:#fff}
.pop{position:fixed;z-index:40;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.14);width:min(380px,94vw);max-height:70vh;overflow:auto}
.pop .ph{padding:12px 14px;border-bottom:1px solid var(--line);font-weight:700;display:flex;align-items:center;gap:8px}
.pop .pi{display:flex;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px;cursor:pointer}
.pop .pi:hover{background:var(--soft)}
.pop .pf{padding:10px 14px;text-align:center;font-size:12.5px;font-weight:700;color:var(--brand2);cursor:pointer}
.content{padding:22px 24px 60px;max-width:1180px}
h1{font-size:21px;margin:0 0 4px}.sub{color:var(--muted);margin:0 0 16px;font-size:13.5px}
.head{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap;margin-bottom:4px}.head .grow{flex:1;min-width:220px}
.card{background:var(--card);border-radius:var(--r);padding:16px 18px;box-shadow:0 1px 2px rgba(0,0,0,.04);margin-bottom:16px}
.card h2{font-size:15px;margin:0 0 12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card h2 .more{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--brand2);cursor:pointer}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
.kpi{background:#fff;border-radius:var(--r);padding:14px 16px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.kpi .k{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px}.kpi .v{font-size:20px;font-weight:700;margin-top:3px;font-variant-numeric:tabular-nums}
.kpi .s{font-size:12px;color:var(--muted);margin-top:2px}
.kpi.hl{background:var(--brand);color:#fff}.kpi.hl .k,.kpi.hl .s{color:#cfe5d8}
.g2{display:grid;grid-template-columns:1.35fr 1fr;gap:16px}.g2>*,.g3>*{min-width:0}.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:8px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
tr.click{cursor:pointer}tr.click:hover td{background:var(--soft)}
tr.tot td{background:var(--brandSoft);font-weight:700}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.cin{color:var(--in);font-weight:600}.cout{color:var(--out);font-weight:600}
.mono{font-size:12px;color:var(--muted);white-space:nowrap}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:20px;white-space:nowrap}
.chip:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.c-amber{background:var(--amberSoft);color:var(--amber)}.c-green{background:var(--greenSoft);color:#11673a}.c-grey{background:var(--grey);color:var(--muted)}
.c-blue{background:var(--blueSoft);color:var(--blue)}.c-red{background:var(--redSoft);color:var(--out)}.c-pink{background:var(--pinkSoft);color:var(--pink)}
.c-yellow{background:#fff1c2;color:#8a6500}
.cat{font-size:11.5px;padding:2px 8px;border-radius:6px;background:var(--grey);color:var(--muted);white-space:nowrap;display:inline-block}
.dlink{border:0;background:var(--brandSoft);color:var(--brand);font-size:12px;font-weight:700;padding:5px 10px;border-radius:20px;white-space:nowrap;display:inline-flex;align-items:center;gap:2px}
.dlink:hover{background:var(--brand);color:#fff}
.dlink svg.i{width:14px;height:14px}
.btn{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:9px;padding:8px 13px;font-weight:600;font-size:13.5px;white-space:nowrap}
.btn svg.i{width:16px;height:16px}
.btn.p{background:var(--brand);color:#fff}.btn.p:hover{background:var(--brand2)}
.btn.s{background:var(--brandSoft);color:var(--brand)}
.btn.w{background:#fff;border:1px solid var(--line);color:var(--ink)}
.btn.d{background:var(--redSoft);color:var(--out)}
.btn.a{background:var(--amberSoft);color:#7a5200}
.btn.sm{padding:5px 10px;font-size:12.5px}
.btn:disabled{opacity:.45;cursor:not-allowed}
/* tab: tombol yang turun baris, tanpa geser */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.tabs button{border:1px solid var(--line);background:#fff;padding:7px 12px;font-weight:600;color:var(--muted);border-radius:9px;display:inline-flex;align-items:center;gap:6px;font-size:13px}
.tabs button svg.i{width:15px;height:15px}
.tabs button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.tabs button .n{font-size:11px;background:rgba(0,0,0,.08);border-radius:10px;padding:0 6px}
.tabs button.on .n{background:rgba(255,255,255,.22)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.filters select,.filters input{font:inherit;font-size:13px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:#fff}
.range{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:14px}
.range label{font-size:11.5px;font-weight:600;color:var(--muted);display:block;margin-bottom:3px}
.range input{font:inherit;font-size:13px;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:#fff}
.range .presets{display:flex;gap:4px;flex-wrap:wrap}
.range .presets button{border:1px solid var(--line);background:#fff;border-radius:16px;padding:5px 10px;font-size:12px;font-weight:600;color:var(--muted)}
.range .acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.bar{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:13px}
.bar .lbl{width:150px;flex:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar .track{flex:1;height:10px;background:var(--grey);border-radius:6px;overflow:hidden;position:relative}
.bar .fill{height:100%;background:var(--brand2);border-radius:6px}
.bar .val{width:120px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.bar .pct{width:44px;text-align:right;color:var(--muted);font-size:12px}
.progress{height:10px;background:var(--grey);border-radius:6px;overflow:hidden;margin:8px 0 4px}
.progress div{height:100%;border-radius:6px}
.week{display:flex;align-items:flex-end;gap:18px;height:180px;padding:6px 4px 0}
.week .col{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%;justify-content:flex-end}
.week .pair{display:flex;gap:4px;align-items:flex-end;height:100%;width:100%;justify-content:center}
.week .b{width:40%;max-width:26px;border-radius:5px 5px 0 0}
.week .b.o{background:var(--brand2)}.week .b.x{background:#d98b7d}
.week .lab{font-size:12px;font-weight:600;text-align:center;line-height:1.25}
.week .lab span{display:block;font-size:11px;color:var(--muted);font-weight:500}
.legend{display:flex;gap:14px;font-size:12px;color:var(--muted);margin-bottom:6px;flex-wrap:wrap}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.legend i.ln{height:3px;border-radius:2px;vertical-align:3px;width:14px}
.chartw{overflow:hidden}
.chartw svg{display:block;width:100%;height:auto}
.chartw .grp{cursor:pointer}.chartw .grp:hover .hit{fill:rgba(47,122,84,.07)}
.task{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line)}
.task:last-child{border:0}
.task .cb{width:24px;height:24px;border-radius:7px;border:2px solid #b9c4bd;display:grid;place-items:center;flex:none;background:#fff;color:#fff;padding:0}
.task .cb svg.i{width:14px;height:14px;stroke-width:3}
.task.done .cb{background:var(--brand2);border-color:var(--brand2)}
.task.done .t{text-decoration:line-through;color:var(--muted)}
.task .t{flex:1}.task .meta{font-size:12px;color:var(--muted)}
.task .who{font-size:11.5px;padding:2px 8px;border-radius:12px;background:var(--grey);color:var(--muted);white-space:nowrap}
.task.mine .who{background:var(--brandSoft);color:var(--brand)}
.late{font-size:11.5px;color:var(--out);font-weight:700}
.daygrp{font-size:12px;font-weight:700;color:var(--brand);margin:14px 0 2px;text-transform:uppercase;letter-spacing:.05em}
.alert{padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:14px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.alert.i{background:var(--blueSoft);color:var(--blue)}.alert.w{background:var(--amberSoft);color:#7a5200}.alert.e{background:var(--redSoft);color:var(--out)}
.alert .btn{margin-left:auto}
.empty{text-align:center;color:var(--muted);padding:22px}
.muted{color:var(--muted)}.small{font-size:12.5px}
.mg{font-weight:700}.mg.hi{color:var(--in)}.mg.lo{color:var(--out)}
/* SPMU progres */
.prog{display:flex;align-items:center;min-width:250px}
.prog .st{display:flex;flex-direction:column;align-items:center;flex:1;font-size:11px;color:var(--muted);position:relative}
.prog .st .dt{width:16px;height:16px;border-radius:50%;background:var(--grey);border:2px solid #fff;box-shadow:0 0 0 1px #cfd7d2;z-index:1;margin-bottom:3px}
.prog .st:after{content:"";position:absolute;top:7px;left:-50%;width:100%;height:2px;background:#dfe5e1}
.prog .st:first-child:after{display:none}
.prog .st .d{font-size:10.5px;color:var(--muted)}
.prog .st.s1 .dt{background:var(--blue);box-shadow:0 0 0 1px var(--blue)}.prog .st.s1{color:var(--blue)}
.prog .st.s2 .dt{background:#e0a800;box-shadow:0 0 0 1px #e0a800}.prog .st.s2{color:#8a6500}.prog .st.s2:after{background:#e0a800}
.prog .st.s3 .dt{background:var(--brand2);box-shadow:0 0 0 1px var(--brand2)}.prog .st.s3{color:var(--in)}.prog .st.s3:after{background:var(--brand2)}
.prog .st.sx .dt{background:var(--out);box-shadow:0 0 0 1px var(--out)}.prog .st.sx{color:var(--out)}.prog .st.sx:after{background:var(--out)}
.prog .st.sp .dt{background:var(--pink);box-shadow:0 0 0 1px var(--pink)}.prog .st.sp{color:var(--pink)}
/* daftar kartu (HP) */
.desk{display:block}.mob{display:none}
.tw{overflow-x:auto}
.citem{display:flex;gap:10px;align-items:flex-start;padding:12px 2px;border-bottom:1px solid var(--line);cursor:pointer}
.citem:last-child{border:0}
.citem .cm{flex:1;min-width:0}
.citem .ct{font-weight:600;font-size:14px}
.citem .cs{font-size:12px;color:var(--muted);margin-top:2px}
.citem .cc{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.citem .cr{text-align:right;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.citem .cr small{display:block;font-weight:500;color:var(--muted);font-size:11.5px}
.citem .chev{color:#b5bfb9;align-self:center}
.acts-td{text-align:right;white-space:nowrap;width:1%}.acts-w{display:flex;flex-direction:column;gap:4px;align-items:flex-end;margin-bottom:4px}.more-btn{display:block;width:100%;margin-top:10px;border:1px dashed #c6d0ca;background:var(--soft);border-radius:9px;padding:9px;font-weight:600;color:var(--brand2);font-size:13px}
/* drawer & modal */
.ov{position:fixed;inset:0;background:rgba(15,25,20,.38);z-index:20;display:none}.ov.show{display:block}
.drawer{position:fixed;top:0;right:0;height:100vh;width:min(440px,100%);background:#fff;z-index:21;transform:translateX(100%);transition:.22s;overflow:auto;box-shadow:-10px 0 30px rgba(0,0,0,.12);display:flex;flex-direction:column}
.drawer.show{transform:none;visibility:visible}.drawer{visibility:hidden}
.dh{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:flex-start;position:sticky;top:0;background:#fff;z-index:1}
.dh h3{margin:0;font-size:16px}.dh .x{margin-left:auto;border:0;background:var(--grey);border-radius:8px;width:32px;height:32px;flex:none;display:grid;place-items:center}
.db{padding:16px 18px;flex:1}
.kv{display:grid;grid-template-columns:120px 1fr;gap:7px 10px;font-size:13.5px;margin:0 0 14px}.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:500}
.nota-img{height:120px;border-radius:10px;background:repeating-linear-gradient(45deg,#f1f4f2,#f1f4f2 10px,#e8ece9 10px,#e8ece9 20px);display:grid;place-items:center;color:var(--muted);font-size:13px;margin-bottom:14px;border:1px dashed #cdd6d0;text-align:center}
.tl{border-left:2px solid var(--line);margin-left:6px;padding-left:14px}
.tl .ev{position:relative;margin-bottom:11px;font-size:13px}
.tl .ev:before{content:"";position:absolute;left:-20px;top:4px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--brand2)}
.tl .ev .w{font-size:11.5px;color:var(--muted)}
.actions{display:flex;gap:8px;flex-wrap:wrap;padding:14px 18px;border-top:1px solid var(--line);background:#fff;position:sticky;bottom:0}
.postep{display:flex;gap:0;margin:2px 0 14px}
.postep div{flex:1;text-align:center;font-size:11.5px;color:var(--muted);padding-top:22px;position:relative}
.postep div:before{content:"";position:absolute;top:4px;left:50%;transform:translateX(-50%);width:14px;height:14px;border-radius:50%;background:var(--grey);box-shadow:0 0 0 2px #fff,0 0 0 3px #cfd7d2;z-index:1}
.postep div:after{content:"";position:absolute;top:10px;left:-50%;width:100%;height:2px;background:#dfe5e1}
.postep div:first-child:after{display:none}
.postep div.ok{color:var(--ink);font-weight:600}.postep div.ok:before{background:var(--brand2);box-shadow:0 0 0 2px #fff,0 0 0 3px var(--brand2)}.postep div.ok:after{background:var(--brand2)}
.postep div.cur{color:var(--amber);font-weight:700}.postep div.cur:before{background:#e8a33a;box-shadow:0 0 0 2px #fff,0 0 0 3px #e8a33a}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-48%);width:min(480px,94vw);max-height:90vh;overflow:auto;background:#fff;border-radius:14px;z-index:31;opacity:0;pointer-events:none;transition:.18s}
.modal.wide{width:min(840px,96vw)}
.modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%)}
#mov{z-index:30}
.modal .mh{padding:16px 20px 0;font-weight:700;font-size:16px}.modal .mb{padding:12px 20px}.modal .mf{padding:12px 20px 18px;display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
label.f{display:block;font-size:12px;font-weight:600;color:var(--muted);margin:10px 0 4px}
.in{width:100%;font:inherit;border:1px solid var(--line);border-radius:8px;padding:10px 11px;background:#fff;color:var(--ink)}
.in:focus{outline:2px solid var(--brand2);border-color:transparent}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.seg button{border:0;background:#fff;padding:9px;font-weight:600;font-size:13px;color:var(--muted)}
.seg button.on[data-v=in]{background:var(--greenSoft);color:var(--in)}.seg button.on[data-v=out]{background:var(--redSoft);color:var(--out)}
.seg button.on[data-v=rek],.seg button.on[data-v=kas]{background:var(--brandSoft);color:var(--brand)}
.upload{border:1px dashed #c3cec7;border-radius:10px;padding:16px;text-align:center;font-size:13px;color:var(--muted);display:block;cursor:pointer}
.upload:hover{background:var(--soft)}
.fmt{font-size:12.5px;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:8px 0}
.fmt th{background:var(--soft)}
.check{width:17px;height:17px;accent-color:var(--brand2)}
.cbrow{display:flex;gap:8px;align-items:center;margin-top:12px;font-size:13px}
.selbar{display:flex;align-items:center;gap:10px;background:var(--brand);color:#fff;border-radius:10px;padding:8px 12px;margin-bottom:12px;font-size:13px}
.selbar .btn{margin-left:auto;background:#fff;color:var(--brand)}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(16px);background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;font-size:13.5px;opacity:0;transition:.2s;z-index:70;pointer-events:none;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%)}
.sum{display:grid;grid-template-columns:1fr auto;gap:8px 16px;font-size:14px;max-width:600px}
.sum .l{color:var(--muted)}.sum .v{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.sum .hr{grid-column:1/-1;border-top:1px solid var(--line)}
.sum .h{color:var(--ink);font-weight:700}
.sum .big{font-size:16px;font-weight:700;color:var(--ink)}
.switch{position:relative;display:inline-block;width:38px;height:22px;flex:none}
.switch input{opacity:0;width:0;height:0}
.switch span{position:absolute;inset:0;background:#cfd7d2;border-radius:20px;transition:.15s;cursor:pointer}
.switch span:before{content:"";position:absolute;width:18px;height:18px;left:2px;top:2px;background:#fff;border-radius:50%;transition:.15s}
.switch input:checked+span{background:var(--brand2)}.switch input:checked+span:before{transform:translateX(16px)}
.switch input:disabled+span{opacity:.5;cursor:not-allowed}
.permgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.permcard{border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.permcard h4{margin:0 0 2px;font-size:14px}.permcard .grp{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:12px 0 4px}
.permrow{display:flex;align-items:center;gap:10px;font-size:13px;padding:5px 0}
.permrow span.t{flex:1;display:flex;align-items:center;gap:6px}
.master{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.mlist{border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.mlist h4{margin:0 0 8px;font-size:14px;display:flex;align-items:center;gap:6px}
.mitem{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
.mitem:last-child{border:0}.mitem>span{flex:1}
.mitem .rm{border:0;background:none;color:var(--muted);font-size:16px;padding:0 4px}
.subs{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.subs span{font-size:11.5px;background:var(--grey);border-radius:6px;padding:1px 7px;color:var(--muted)}
.addrow{display:flex;gap:6px;margin-top:8px}.addrow input,.addrow select{flex:1;min-width:0;font:inherit;font-size:13px;padding:6px 9px;border:1px solid var(--line);border-radius:8px}
.preview{border:1px solid var(--line);border-radius:10px;padding:18px;background:#fff;font-size:12.5px}
.preview h3{text-align:center;margin:0;font-size:15px}.preview .ps{text-align:center;color:var(--muted);margin:2px 0 12px}
.preview .stamp{font-size:11px;color:var(--muted);margin-top:12px;border-top:1px solid var(--line);padding-top:6px}
/* pengingat */
.rem{display:flex;gap:12px;padding:12px 4px;border-bottom:1px solid var(--line);align-items:flex-start}
.rem:last-child{border:0}
.rem .ri{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}
.rem .ri.urgent{background:var(--redSoft);color:var(--out)}.rem .ri.warn{background:var(--amberSoft);color:var(--amber)}.rem .ri.info{background:var(--blueSoft);color:var(--blue)}
.rem .rm2{flex:1;min-width:0}.rem .rt{font-weight:600;font-size:13.5px}.rem .rs{font-size:12.5px;color:var(--muted);margin-top:2px}
.esc{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px;align-items:center;font-size:11.5px;color:var(--muted)}
.esc span{padding:1px 7px;border-radius:10px;background:var(--grey)}
.esc span.on{background:var(--amberSoft);color:#7a5200;font-weight:700}
/* telegram */
.tg{background:#cfe3d2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Ccircle cx='20' cy='20' r='1.2' fill='%23b7d0bb'/%3E%3C/svg%3E");border-radius:12px;max-width:430px;margin:0 auto;overflow:hidden;border:1px solid #b9cfbd}
.tg .tgh{background:#2a7a5a;color:#fff;padding:10px 14px;display:flex;gap:10px;align-items:center}
.tg .tgh .av{width:36px;height:36px;border-radius:50%;background:#fff;color:#2a7a5a;display:grid;place-items:center;font-weight:700}
.tg .tgh small{display:block;opacity:.8;font-size:11.5px}
.tg .tgb{padding:12px;height:440px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.tg .msg{max-width:86%;padding:8px 11px;border-radius:12px;font-size:13px;white-space:pre-line;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.tg .msg.bot{background:#fff;align-self:flex-start;border-top-left-radius:3px}
.tg .msg.me{background:#e1f7cf;align-self:flex-end;border-top-right-radius:3px}
.tg .msg .tm{display:block;text-align:right;font-size:10.5px;color:#8a9a90;margin-top:3px}
.tg .ibtn{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px}
.tg .ibtn button{flex:1;min-width:120px;border:0;background:#edf6ef;color:#226a4c;border-radius:7px;padding:6px;font-size:12px;font-weight:700}
.tg .kb{background:#f2f5f3;padding:8px;display:grid;grid-template-columns:1fr 1fr;gap:6px;border-top:1px solid #d5ded8}
.tg .kb button{border:0;background:#fff;border-radius:8px;padding:9px 6px;font-size:12.5px;font-weight:600;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.tg .kb button.full{grid-column:1/-1}
/* menu lainnya (HP) */
.sheet{position:fixed;left:0;right:0;bottom:0;background:#fff;border-radius:18px 18px 0 0;z-index:31;transform:translateY(100%);transition:.22s;padding:14px 16px 24px;max-height:80vh;overflow:auto}
.sheet.show{transform:none;visibility:visible}.sheet{visibility:hidden}
.sheet .grab{width:40px;height:4px;border-radius:4px;background:#d5ddd8;margin:0 auto 12px}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tiles button{border:1px solid var(--line);background:var(--soft);border-radius:14px;padding:14px 6px;display:flex;flex-direction:column;align-items:center;gap:7px;font-size:12.5px;font-weight:600;position:relative}
.tiles button svg.i{width:24px;height:24px;color:var(--brand)}
.tiles button .badge{position:absolute;top:6px;right:8px;background:#e8a33a;color:#2b1d00;font-size:10.5px;font-weight:700;border-radius:10px;padding:0 6px}
.mobnav{display:none}
.outcard{border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff}
.outcard h4{margin:0;font-size:14.5px;display:flex;align-items:center;gap:8px}
.outcard .row{display:flex;justify-content:space-between;font-size:13px;margin-top:6px}
.outcard.off{background:var(--soft);color:var(--muted)}
.outs{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}

/* pencarian global */
.gs{position:relative;flex:1;max-width:420px}
.gs input{width:100%;font:inherit;font-size:13.5px;border:1px solid var(--line);border-radius:10px;padding:9px 12px 9px 36px;background:var(--soft)}
.gs input:focus{outline:2px solid var(--brand2);background:#fff;border-color:transparent}
.gs .gsi{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--muted);display:flex}
.gsres{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.14);max-height:70vh;overflow:auto;z-index:45}
.gsres .gh{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:10px 14px 4px}
.gsres .gr{display:flex;gap:10px;align-items:center;padding:8px 14px;cursor:pointer;font-size:13px}
.gsres .gr:hover,.gsres .gr.on{background:var(--brandSoft)}
.gsres .gr .gi{width:28px;height:28px;border-radius:8px;background:var(--grey);display:grid;place-items:center;flex:none;color:var(--brand)}
.gsres .gr .gt{flex:1;min-width:0}.gsres .gr .gt b{font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gsres .gr .gt span{font-size:11.5px;color:var(--muted)}
.gsres .gr .gv{font-weight:600;font-size:12.5px;white-space:nowrap}
.gsres mark{background:#fff1a8;color:inherit;border-radius:3px;padding:0 1px}
.gsbtn{display:none}
/* bar periode di dalam halaman */
.pbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fff;border-radius:12px;padding:10px 12px;margin-bottom:16px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.pbar .pl{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);font-weight:600}
.pbar .pl svg.i{color:var(--brand)}
.pbar .pacts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
/* beranda baru */
.hero{background:linear-gradient(135deg,#173f2b 0%,#1f5f3f 50%,#2f7a54 100%);color:#fff;border-radius:18px;padding:22px 24px;margin-bottom:16px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;border-radius:50%;background:rgba(255,255,255,.06)}
.hero:before{content:"";position:absolute;right:60px;bottom:-90px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.05)}
.hero .hd{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;position:relative;z-index:1}
.hero .hd .grow{flex:1;min-width:200px}
.hero .date{font-size:12.5px;opacity:.8}
.hero h1{color:#fff;font-size:22px;margin:2px 0 4px}
.hero .lead{font-size:13.5px;opacity:.85;margin:0}
.hero .persel{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:20px;padding:6px 12px;font:inherit;font-size:12.5px;font-weight:600}
.hero .persel option{color:var(--ink)}
.hero .hstats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px;position:relative;z-index:1}
.hero .hs{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:12px 14px}
.hero .hs .k{font-size:12px;opacity:.8;display:flex;gap:6px;align-items:center}
.hero .hs .v{font-size:19px;font-weight:700;margin-top:2px;font-variant-numeric:tabular-nums}
.hero .hs .s{font-size:11.5px;opacity:.75}
.hero .hacts{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;position:relative;z-index:1}
.hero .hacts .btn{background:rgba(255,255,255,.95);color:var(--brand)}
.hero .hacts .btn.ghost{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25)}
.remcard .rsum{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.remcard .rsum span{font-size:12px;font-weight:600;padding:4px 10px;border-radius:20px;background:var(--grey);color:var(--muted);display:inline-flex;gap:5px;align-items:center}
.remcard .rsum span b{color:var(--ink)}
.rl{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer}
.rl:last-child{border:0}
.rl .d{width:9px;height:9px;border-radius:50%;flex:none}
.rl .d.urgent{background:var(--out)}.rl .d.warn{background:#e8a33a}.rl .d.info{background:var(--blue)}
.rl .x{flex:1;min-width:0}.rl .x b{font-weight:600;font-size:13.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rl .x span{font-size:12px;color:var(--muted)}
.rl .tag{font-size:11px;color:var(--muted);background:var(--grey);border-radius:6px;padding:1px 7px;white-space:nowrap}
.ring{--p:0;--c:var(--brand2);width:120px;height:120px;border-radius:50%;background:conic-gradient(var(--c) calc(var(--p)*1%),#e8ece9 0);display:grid;place-items:center;flex:none}
.ring>div{width:92px;height:92px;border-radius:50%;background:#fff;display:grid;place-items:center;text-align:center}
.ring b{font-size:20px;display:block;line-height:1}.ring span{font-size:11px;color:var(--muted)}
.tgwrap{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.tgwrap .tx{flex:1;min-width:180px;font-size:13.5px}
.tgwrap .tx p{margin:0 0 8px}
.donutw{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.donut{width:130px;height:130px;border-radius:50%;flex:none;display:grid;place-items:center}
.donut>div{width:84px;height:84px;border-radius:50%;background:#fff;display:grid;place-items:center;text-align:center;font-size:11px;color:var(--muted)}
.donut b{display:block;font-size:14px;color:var(--ink)}
.dleg{flex:1;min-width:180px;font-size:13px}
.dleg div{display:flex;align-items:center;gap:8px;padding:4px 0}
.dleg i{width:10px;height:10px;border-radius:3px;flex:none}
.dleg span{flex:1}.dleg b{font-variant-numeric:tabular-nums;font-weight:600}
.kpi .k .ib{width:26px;height:26px;border-radius:8px;background:var(--brandSoft);color:var(--brand);display:grid;place-items:center}
.kpi .k .ib svg.i{width:15px;height:15px}
/* ringkasan grafik */
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.fact{background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13px}
.fact b{display:block;font-size:17px;margin-bottom:2px}
.fact.ok b{color:var(--in)}.fact.bad b{color:var(--out)}
.howto{font-size:12.5px;color:var(--muted);background:var(--soft);border-radius:8px;padding:8px 10px;margin-top:8px}
/* kolom tabel */
.k2 b{font-weight:600;font-size:12.5px;display:block}.k2 span{font-size:11.5px;color:var(--muted)}
.stk{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.custom{font-size:10.5px;font-weight:700;color:#6a3fb0;background:#efe8fb;border-radius:8px;padding:1px 7px}
@media (max-width:900px){
  .app{grid-template-columns:1fr}aside{display:none}
  .topbar{padding:8px 12px;gap:8px}
  .topbar .ttl{display:block;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .proto,.uchip .nm{display:none}
  .gs{display:none;position:fixed;left:0;right:0;top:0;max-width:none;background:#fff;padding:10px 12px;z-index:46;box-shadow:0 6px 20px rgba(0,0,0,.12)}
  .gs.open{display:block}.gs .gsi{left:23px}.gsres{left:12px;right:12px}
  .gsbtn{display:grid}
  .hero{padding:18px 16px;border-radius:16px}.hero .hstats{grid-template-columns:1fr 1fr}.hero .hs:first-child{grid-column:1/-1}
  .facts{grid-template-columns:1fr}
  .pbar .pacts{margin-left:0;width:100%}.pbar .pacts .btn{flex:1;justify-content:center}.uchip{padding:2px;border-radius:50%}
  .tb-right{margin-left:0}
  .kpis{grid-template-columns:repeat(2,1fr);gap:10px}.kpi{padding:12px 13px}.kpi .v{font-size:17px}
  .g2,.g3,.row2{grid-template-columns:1fr}
  .content{padding:14px 12px 96px}
  h1{font-size:19px}
  .desk{display:none}.mob{display:block}
  .card{padding:14px}
  .mobnav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);z-index:15;padding-bottom:env(safe-area-inset-bottom)}
  .mobnav a{flex:1;text-align:center;font-size:11px;padding:8px 2px 9px;color:var(--muted);cursor:pointer;position:relative}
  .mobnav a svg.i{display:block;margin:0 auto 3px;width:22px;height:22px}
  .mobnav a.on{color:var(--brand);font-weight:700}
  .mobnav a .badge{position:absolute;top:3px;left:calc(50% + 6px);background:#e8a33a;color:#2b1d00;font-size:10px;font-weight:700;border-radius:10px;padding:0 5px}
  .bar .lbl{width:96px}.bar .pct{display:none}.bar .val{width:auto}
  .range .acts{margin-left:0;width:100%}.range .acts .btn{flex:1;justify-content:center}
  .head .btn{flex:1;justify-content:center}
  .modal{top:auto;bottom:0;left:0;transform:translateY(20px);width:100%;max-height:92vh;border-radius:18px 18px 0 0}
  .modal.show{transform:none}.modal.wide{width:100%}
  .tg .tgb{height:360px}
  .prog{min-width:0}
}

/* v6 */
nav a{padding:7px 10px;font-size:13.6px}nav .sep:first-of-type{margin-top:10px}
aside nav{overflow-y:auto}
nav a.ng .chv{margin-left:auto;display:flex;transition:.15s}nav a.ng .chv svg{width:15px;height:15px}nav a.ng.op .chv{transform:rotate(90deg)}
nav a.ng .badge{margin-left:auto}nav a.ng .badge+.chv{margin-left:6px}
nav a.ng.cur{color:#fff;font-weight:600}
nav .nsub{margin:0 0 6px 20px;border-left:1px solid rgba(255,255,255,.14);padding-left:8px}
nav .nsub a{font-size:13.3px;padding:7px 10px}
.helpb{border:0;background:var(--brandSoft);color:var(--brand);width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;vertical-align:middle;cursor:pointer;margin-left:4px;padding:0}
.helpb svg.i{width:15px;height:15px}.hero .helpb{background:rgba(255,255,255,.18);color:#fff}
.ph4{font-size:13px;margin:0 0 6px;color:var(--brand);text-transform:uppercase;letter-spacing:.04em}
.steps2{margin:0 0 14px;padding-left:20px;font-size:13.8px;line-height:1.7}
.svc{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;background:var(--soft)}
.labels{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.labels .lbl{border:1px dashed #9aa5a0;border-radius:8px;padding:10px;display:flex;justify-content:space-between;gap:8px;align-items:center;background:#fff}
.labels .lbl svg{flex:none}
.kgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.kcard{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:12px;cursor:pointer;background:#fff}
.kcard:hover{border-color:var(--brand2)}.kcard svg.i{width:13px;height:13px;vertical-align:-2px}
.sesi{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.sesi .sx{width:110px;display:flex;flex-direction:column}
.seg4{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;flex-wrap:wrap}
.seg4 button{border:0;background:#fff;padding:5px 10px;font-size:12.5px;cursor:pointer;border-right:1px solid var(--line)}
.seg4 button:last-child{border-right:0}.seg4 button.on.cH{background:var(--greenSoft);color:var(--in);font-weight:700}.seg4 button.on.cI{background:var(--blueSoft);color:var(--blue);font-weight:700}
.seg4 button.on.cS{background:var(--amberSoft);color:var(--amber);font-weight:700}.seg4 button.on.cA{background:var(--redSoft);color:var(--out);font-weight:700}
.pesan{display:grid;grid-template-columns:340px 1fr;gap:14px;min-height:460px}
.pesan>*{min-width:0}
.thlist{border:1px solid var(--line);border-radius:12px;overflow:auto;max-height:620px}
.thi{display:flex;gap:10px;padding:11px 12px;border-bottom:1px solid var(--line);cursor:pointer;position:relative}
.thi:hover{background:var(--soft)}.thi.on{background:var(--brandSoft)}
.udot{width:9px;height:9px;border-radius:50%;background:var(--out);flex:none;margin-top:6px}
.thpane{border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column}
.thpane.empty{color:var(--muted)}
.thhead{display:flex;gap:10px;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--line)}
.thback{display:none}
.thmsgs{flex:1;overflow:auto;padding:12px 2px;display:flex;flex-direction:column;gap:8px;max-height:440px;min-height:200px}
.bub{max-width:80%;background:var(--soft);border:1px solid var(--line);border-radius:12px 12px 12px 4px;padding:8px 11px;font-size:13.8px;white-space:pre-wrap}
.bub.me{align-self:flex-end;background:var(--brandSoft);border-color:#cfe1d5;border-radius:12px 12px 4px 12px}
.bub .tm{display:block;font-size:10.5px;color:var(--muted);text-align:right;margin-top:3px}
.threply{display:flex;gap:8px;align-items:flex-end;border-top:1px solid var(--line);padding-top:10px}
.threply textarea{flex:1;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font:inherit;resize:vertical}
.divpick{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;max-height:200px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:6px 10px;margin-top:6px}
@media (max-width:900px){
  .pesan{grid-template-columns:1fr}.pesan.has .thlist{display:none}.pesan:not(.has) .thpane{display:none!important}.thback{display:inline-flex}
  .divpick{grid-template-columns:1fr}.sesi .sx{width:90px}.labels{grid-template-columns:1fr}
}

/* v7 */
#pSeg{grid-template-columns:repeat(3,1fr)}.seg button.on{background:var(--brandSoft);color:var(--brand)}
.kfg{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:10px}
.kfgh{display:flex;align-items:center;gap:10px;margin-bottom:6px}.kfgh svg.i{color:var(--brand)}
.kfrow{display:flex;align-items:center;gap:6px;padding:5px 0;border-top:1px solid var(--line);flex-wrap:wrap}
.kfrow.off{opacity:.55}.kfrow .in{flex:1;min-width:160px;padding:6px 9px}.kfrow .sel{max-width:150px}
.kfic{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--brandSoft);color:var(--brand)}
.icpick{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.icpick label{cursor:pointer}.icpick input{display:none}
.icpick label svg.i{width:34px;height:34px;padding:7px;border:1px solid var(--line);border-radius:9px;box-sizing:border-box}
.icpick input:checked+svg.i{border-color:var(--brand);background:var(--brandSoft);color:var(--brand)}
.cfbox{margin-top:12px;padding:10px 12px;border:1px dashed var(--line);border-radius:10px;background:var(--soft)}
.chip.c-pink{background:var(--pinkSoft);color:var(--pink)}
.logo .mark,.brand .mark{display:grid;place-items:center}
@media (max-width:900px){.master .mlist{grid-column:auto!important}.kfrow .in{min-width:120px}.addrow{flex-wrap:wrap}}
/* v12 */
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.galit{border:1px solid var(--line);border-radius:10px;padding:0;background:#fff;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;font:inherit;text-align:left}
.galit img{width:100%;aspect-ratio:1;object-fit:cover;display:block}.galit span{font-size:11px;padding:4px 6px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.galit.add{border-style:dashed;align-items:center;justify-content:center;aspect-ratio:1;color:var(--brand);gap:4px}.galit.add span{color:var(--brand);padding:0}
.orgout{display:flex;align-items:center;gap:10px;border:0;border-radius:12px;padding:10px 12px;background:var(--brand);color:#fff;cursor:pointer;text-align:left;font:inherit;width:100%}
.orgout img{width:40px;height:40px;border-radius:9px;object-fit:cover;flex:none}.orgout .oico{width:40px;height:40px;border-radius:9px;background:rgba(255,255,255,.15);display:grid;place-items:center;flex:none}
.orgout span{display:flex;flex-direction:column}.orgout b{font-size:13.5px}.orgout small{font-size:11.5px;color:#cfe0d6}
/* v11 */
.riw{display:flex;gap:10px;align-items:flex-start;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}.riw:last-child{border:0}
.riwd{width:190px;flex:none;color:var(--muted);font-size:12.5px}.riwb{flex:1;min-width:0}
@media (max-width:900px){.riw{flex-wrap:wrap}.riwd{width:100%}}
.ratebox{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:12px;background:var(--soft)}.ratebox b{font-size:16px}
.org{overflow-x:auto}
.orgrow{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.orgline{width:2px;height:22px;background:var(--line);margin:0 auto}
.orgbox{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:9px 12px;background:#fff;cursor:pointer;text-align:left;font:inherit;min-width:200px}
.orgbox:hover{border-color:var(--brand2)}.orgbox span{display:flex;flex-direction:column}.orgbox b{font-size:13.5px}.orgbox small{font-size:11.5px;color:var(--muted)}
.orgbox.top{background:var(--brand);border-color:var(--brand)}.orgbox.top b{color:#fff}.orgbox.top small{color:#cfe0d6}
.orgbox.mid{background:var(--brandSoft)}.orgbox.pic{border-color:var(--brand2);border-width:2px}.orgbox.empty{cursor:default;border-style:dashed}
.orgbox.sm{min-width:0;width:100%;padding:6px 8px}.orgbox.sm b{font-size:12.5px}
.orgcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;border-top:2px solid var(--line);padding-top:14px}
.orgcol{display:flex;flex-direction:column;gap:8px}.orgsub{border-left:2px solid var(--line);margin-left:20px;padding-left:10px;display:flex;flex-direction:column;gap:8px}
.orgdiv{display:flex;flex-direction:column;gap:6px}.orgdh{font-size:11.5px;font-weight:700;color:var(--brand);text-transform:uppercase;letter-spacing:.04em}
/* v10 */
.kpis.k5{grid-template-columns:repeat(5,minmax(0,1fr))}@media (max-width:900px){.kpis.k5{grid-template-columns:repeat(2,minmax(0,1fr))}}

.obar{margin-bottom:9px}.obar .ol{display:flex;justify-content:space-between;gap:8px;font-size:13px;margin-bottom:3px}.obar .ol b{font-weight:600}

details.permdet{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}details.permdet summary{cursor:pointer;font-weight:600;font-size:13px;color:var(--brand);list-style:none;display:flex;align-items:center;gap:6px}
details.permdet summary::before{content:"▸";transition:.15s}details.permdet[open] summary::before{transform:rotate(90deg)}
.pwshow{font-family:ui-monospace,Menlo,monospace;font-size:22px;font-weight:700;letter-spacing:.06em;text-align:center;padding:16px;border:1px dashed var(--line);border-radius:12px;background:var(--soft)}
.mitem.off{opacity:.55}
/* v9 */
.logo .mark,.lbox .brand .mark{background:none!important;padding:0;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.25)}.lbox .brand .mark{width:48px;height:48px;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.logo .mark{width:36px;height:36px}
.riwbox{border:1px solid var(--line);border-radius:10px;padding:2px 10px;max-height:180px;overflow:auto}
/* v8 */
.bar .lbl.wide{width:200px;white-space:normal;line-height:1.25;overflow:visible}@media (max-width:900px){.bar .lbl.wide{width:112px}}
.logo small{font-size:11px!important;line-height:1.3;display:block}
.brand small{display:block}
.alwrap{border:1px solid var(--line);border-radius:10px;max-height:240px;overflow:auto;padding:4px 10px}
.alrow{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--line)}.alrow:last-child{border:0}
.wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.wkd{border:1px solid var(--line);border-radius:10px;padding:8px;min-height:110px;display:flex;flex-direction:column;gap:5px;background:#fff}
.wkd.off{background:var(--soft)}.wkd.today{border-color:var(--brand2);box-shadow:0 0 0 2px var(--brandSoft)}
.wkh{display:flex;justify-content:space-between;align-items:baseline;gap:4px}
.wkp,.wkk{font-size:12px;border-radius:7px;padding:4px 6px;display:flex;flex-direction:column;gap:1px}
.wkp{background:var(--blueSoft);color:var(--blue)}.wkk{background:var(--greenSoft);color:var(--in)}
.wkp span,.wkk span{font-size:10.5px;opacity:.8}.wkp svg.i,.wkk svg.i{width:12px;height:12px;display:inline;vertical-align:-1px;margin-right:3px}
.ihtab th.grp{text-align:center;background:var(--brandSoft);color:var(--brand)}.ihtab th.grp.pot{background:var(--amberSoft);color:var(--amber)}
.ihtab td,.ihtab th{white-space:nowrap}
.ihin{width:120px;padding:6px 8px;text-align:right}
.slip{max-width:330px;margin:0 auto;border:1px solid #cfd6d1;border-radius:6px;padding:14px 16px;font-size:12.5px;background:#fff;font-family:Arial,Helvetica,sans-serif}
.sliph{display:flex;gap:10px;align-items:center;text-align:center;border-bottom:2px solid #222;padding-bottom:8px;margin-bottom:8px}
.sliph>div:not(.logoph){flex:1;font-size:9.5px;font-weight:700;line-height:1.35}.sliph b{font-size:12px}
.slip table{width:100%;border-collapse:collapse}.slip td{padding:2px 2px}.slip td:nth-child(2),.slip td:nth-child(3){width:14px}
.slip td.num{text-align:right}.slip tr.b td{font-weight:700;border-top:1px solid #222}.slip tr.big td{font-size:13.5px}.slip tr.sp td{height:6px}
.slipf{text-align:right;margin-top:14px;font-size:11.5px}.slipf .ttd{height:34px}
.logoph{border:1.5px dashed #9aa5a0;border-radius:50%;display:grid;place-items:center;font-size:9px;color:#7a857f;flex:none}
@media (max-width:900px){.wk{grid-template-columns:1fr}.wkd{min-height:0}}
/* v18 */
.filters .seg{display:inline-flex;flex-wrap:wrap}.filters .seg button{padding:7px 12px;white-space:nowrap}
.obar .track{height:7px;background:var(--grey);border-radius:6px;overflow:hidden}.obar .fill{height:100%;background:linear-gradient(90deg,#2f7a54,#5bb383);border-radius:6px}
@media (max-width:900px){.trxi{display:none}.trxtab td:nth-child(3){display:none}.trxtab td:first-child{width:55%}.pencard .penh{flex-wrap:wrap}}
.navtools{display:flex;gap:4px;margin:0 2px 6px}.navtools button{flex:1;border:0;background:rgba(255,255,255,.06);color:#bcd2c4;border-radius:7px;padding:5px 6px;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:4px}
.navtools button svg.i{width:12px;height:12px}.navtools button:hover{background:rgba(255,255,255,.12);color:#fff}
.sepb{display:flex;align-items:center;gap:6px;width:100%;border:0;background:none;color:#cfe0d6;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;opacity:.7;padding:12px 10px 6px;border-radius:6px;text-align:left}
.sepb:hover{opacity:1}.sepb.cur{opacity:1;color:#fff}.sepb span:first-child{flex:1}
.sepb .chv{display:flex;transition:transform .2s;transform:rotate(90deg)}.sepb .chv svg{width:14px;height:14px}.sepb.cl .chv{transform:none}
.sepb .badge{background:#e8a33a;color:#2b1d00;font-size:10px;border-radius:10px;padding:0 6px;letter-spacing:0}
.nsubg{display:grid;grid-template-rows:1fr;transition:grid-template-rows .25s ease}.nsubg>div{overflow:hidden;min-height:0}.nsubg.cl{grid-template-rows:0fr}
.msubnav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}.msubnav button{border:1px solid var(--line);background:#fff;border-radius:20px;padding:6px 12px;font-size:12.5px;font-weight:600;color:var(--muted);display:inline-flex;gap:6px;align-items:center}
.msubnav button svg.i{width:15px;height:15px}.msubnav button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.jgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:6px}.jcol{border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--soft)}
.jhead{display:flex;align-items:center;gap:8px;padding-bottom:6px;border-bottom:2px solid var(--brandSoft)}.jhead b{flex:1}
.permh{display:flex;align-items:flex-start;gap:6px}.permh h4{flex:1}.permacts{display:flex;gap:3px}.permacts .btn{padding:4px 6px}.permacts svg.i{width:13px;height:13px}
.wzs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:12px}.wzs button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px;font-size:12.5px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:6px;text-align:left}
.wzs button b{width:22px;height:22px;border-radius:50%;background:var(--grey);display:grid;place-items:center;font-size:11.5px;flex:none}.wzs button.on{border-color:var(--brand);color:var(--brand)}.wzs button.on b{background:var(--brand);color:#fff}.wzs button.ok b{background:var(--brandSoft);color:var(--brand)}
.wztpl{display:flex;gap:6px;flex-wrap:wrap}.wzcol{border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin-bottom:8px;background:var(--soft)}
.wzcolh{display:grid;grid-template-columns:24px 1.4fr 1fr auto auto auto;gap:6px;align-items:center}.wzcolh>b{width:22px;height:22px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:11.5px}
.wzcolb{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;margin-top:6px;padding-left:30px}.wzcolb input.in{grid-column:1/-1}
.wznav{display:flex;justify-content:space-between;margin-top:14px;padding-top:10px;border-top:1px solid var(--line)}.wzprev{border:1px dashed var(--line);border-radius:10px;padding:4px 12px 12px;background:var(--soft)}
@media (max-width:700px){.wzs{grid-template-columns:1fr 1fr}.wzcolh{grid-template-columns:24px 1fr auto auto auto}.wzcolh select{grid-column:2/-1;grid-row:2}.wzcolb{padding-left:0}}
.cfgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}.cfcard{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff;text-align:left;font:inherit}
.cfh{display:flex;gap:10px;align-items:center}.cfi{width:36px;height:36px;border-radius:10px;background:var(--brandSoft);color:var(--brand);display:grid;place-items:center;flex:none}
.cfadd{border-style:dashed;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--brand);background:var(--soft);min-height:150px;cursor:pointer}.cfadd:hover{border-color:var(--brand2)}
tr.rowoff td{opacity:.55}
.katgrp{margin-bottom:14px}.kath{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--brandSoft);border-radius:9px;color:var(--brand);margin-bottom:4px}.kath b{flex:1}
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:10px}.fl{display:flex;gap:10px;align-items:center;border-radius:12px;padding:10px 12px;border:1px solid var(--line)}
.fl>svg.i{width:34px;height:34px;padding:8px;border-radius:10px;box-sizing:border-box;flex:none}.fl b{display:block;font-size:15px}.fl span{font-size:11.5px;color:var(--muted)}
.t-in>svg.i,.t-in .trxi{background:var(--greenSoft);color:var(--in)}.t-tit>svg.i,.t-tit .trxi{background:var(--blueSoft);color:var(--blue)}.t-out>svg.i,.t-out .trxi{background:var(--amberSoft);color:var(--amber)}.t-adj>svg.i,.t-adj .trxi{background:var(--grey);color:var(--muted)}
.dayh{font-size:12px;font-weight:700;color:var(--brand);text-transform:uppercase;letter-spacing:.05em;margin:14px 0 6px}
.trx{display:flex;gap:12px;border:1px solid var(--line);border-left:4px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px;cursor:pointer;background:#fff;transition:box-shadow .15s,transform .15s}
.trx:hover{box-shadow:0 4px 14px rgba(0,0,0,.07);transform:translateY(-1px)}.trx.t-in{border-left-color:var(--in)}.trx.t-tit{border-left-color:var(--blue)}.trx.t-out{border-left-color:#e8a33a}.trx.t-adj{border-left-color:#b9c4bd}
.trxi{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;flex:none}.trxm{flex:1;min-width:0}.trxt{font-weight:700;font-size:14px}
.trxtab{margin-top:6px;font-size:12.5px}.trxtab td{padding:4px 6px;border-bottom:1px dashed var(--line)}.trxtab tr:last-child td{border:0}
.trxr{display:flex;flex-direction:column;align-items:flex-end;gap:4px;white-space:nowrap}.trxr b{font-size:15px}
.mfhead{display:grid;grid-template-columns:2fr 1fr 1fr 28px;gap:6px}#mfI .mrow{display:grid;grid-template-columns:2fr 1fr 1fr 28px;gap:6px;align-items:end;margin-top:6px}
#mfI.wexp .mrow,.mfhead:has(span:nth-child(5)){grid-template-columns:2fr .8fr 1fr 1.1fr 28px}
@media (max-width:700px){.mfhead{display:none}#mfI .mrow,#mfI.wexp .mrow{grid-template-columns:1fr 1fr 28px!important}#mfI .mrow>div:first-child{grid-column:1/-1}#mfI.wexp .mrow>div:nth-child(4){grid-column:1/3}.flow{grid-template-columns:1fr 1fr}.trx{flex-wrap:wrap}.trxr{flex-direction:row;width:100%;justify-content:space-between;align-items:center}}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.steps3>div{display:flex;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--soft);font-size:12.5px;color:var(--muted)}
.steps3>div>b{width:26px;height:26px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;flex:none}.steps3 span b{display:block;color:var(--ink);font-size:13.5px;margin-bottom:2px}
.pencard{border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:12px;background:#fff}.penh{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:6px}.penh b{font-size:15px}
.penf{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
@media (max-width:700px){.steps3{grid-template-columns:1fr}}
/* login */
.lg{position:absolute;inset:0;display:grid;grid-template-columns:1.15fr 1fr;background:#f6f8f6;overflow:auto}
.lg-hero{position:relative;overflow:hidden;background:linear-gradient(140deg,#0f2f20 0%,#174a32 45%,#21704b 100%);background-size:200% 200%;animation:lgShift 18s ease-in-out infinite;color:#fff;display:flex;align-items:center;padding:48px 56px}
@keyframes lgShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.lg-grid{position:absolute;inset:0;width:100%;height:100%}
.orb{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;animation:orb 16s ease-in-out infinite}
.orb.o1{width:360px;height:360px;background:#2f9a64;top:-90px;right:-80px}.orb.o2{width:260px;height:260px;background:#c9a33a;bottom:-80px;left:-60px;opacity:.35;animation-delay:-5s}.orb.o3{width:180px;height:180px;background:#4fc48a;top:45%;left:55%;opacity:.25;animation-delay:-9s}
@keyframes orb{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-20px) scale(1.08)}66%{transform:translate(-20px,25px) scale(.95)}}
.lg-in{position:relative;z-index:1;max-width:520px}
.lg-brand{display:flex;align-items:center;gap:16px;animation:fadeUp .7s both}.lg-logo{border-radius:50%;box-shadow:0 0 0 6px rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.25);animation:floaty 6s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.lg-name{font-size:30px;font-weight:700;letter-spacing:-.01em}.lg-tag{font-size:14px;color:#e8c766;font-style:italic}
.lg-h{font-size:26px;line-height:1.3;font-weight:600;margin:28px 0 10px;max-width:460px;animation:fadeUp .7s .1s both}
.lg-chart{width:100%;max-width:420px;height:auto;margin:6px 0 18px;animation:fadeUp .7s .15s both}
.lg-line{stroke-dasharray:520;stroke-dashoffset:520;animation:draw 2.2s .4s ease forwards}.lg-area{opacity:0;animation:fadeIn 1.2s 1.4s forwards}.lg-dot{opacity:0;animation:fadeIn .4s 2.3s forwards,pulse 2s 2.7s ease-in-out infinite;transform-origin:320px 10px}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes fadeIn{to{opacity:1}}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.5)}}
.lg-feats{display:flex;flex-direction:column;gap:12px}.lg-f{display:flex;gap:12px;align-items:flex-start;animation:fadeUp .6s var(--d) both}
.lg-f>span{width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);display:grid;place-items:center;flex:none;color:#e8c766}
.lg-f b{display:block;font-size:14.5px}.lg-f small{font-size:12.5px;color:#bfd6c8}
.lg-foot{margin-top:34px;font-size:12px;color:#9dbfab;line-height:1.6;animation:fadeIn 1s .8s both;opacity:0}
.lg-side{display:flex;align-items:center;justify-content:center;padding:32px 24px}
.lg-card{width:min(400px,100%);background:#fff;border-radius:20px;padding:30px 28px;box-shadow:0 1px 2px rgba(0,0,0,.04),0 24px 60px -20px rgba(23,63,43,.28);animation:fadeUp .7s .15s both}
.lg-mob{display:none}.lg-hi{font-size:13px;color:var(--brand2);font-weight:600}.lg-title{font-size:22px;margin:4px 0 2px}.lg-sub{font-size:12.5px;color:var(--muted);margin:0 0 10px}
.lg-in2{position:relative}.lg-in2>svg.i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted);width:17px;height:17px;pointer-events:none}.lg-in2 .in{padding-left:38px;transition:box-shadow .2s}
.lg-in2 .in:focus{box-shadow:0 0 0 4px var(--brandSoft)}
.lg-btn{width:100%;justify-content:center;margin-top:18px;padding:12px;position:relative;overflow:hidden;font-size:14.5px;border-radius:11px;background:linear-gradient(135deg,#1f5f3f,#2f7a54);transition:transform .15s,box-shadow .2s}
.lg-btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px -10px rgba(31,95,63,.7)}
.lg-shine{position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:shine 3.5s 1.5s ease-in-out infinite}
@keyframes shine{0%{left:-60%}35%,100%{left:130%}}
.lg-demo{margin-top:16px;border-top:1px dashed var(--line);padding-top:10px;font-size:12px;color:var(--muted)}.lg-demo summary{cursor:pointer;font-weight:600}.lg-demo .acc{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.lg-demo .acc button{border:1px solid var(--line);background:var(--soft);border-radius:16px;padding:4px 10px;font-size:12px;font-weight:600}.lg-demo .acc button:hover{border-color:var(--brand2);color:var(--brand)}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (max-width:900px){.lg{grid-template-columns:1fr;background:linear-gradient(170deg,#174a32 0%,#21704b 260px,#f6f8f6 260px)}.lg-hero{display:none}.lg-side{padding:28px 16px;align-items:flex-start}
  .lg-mob{display:flex;gap:12px;align-items:center;margin:-6px 0 16px}.lg-mob b{display:block;font-size:17px}.lg-mob small{font-size:12px;color:var(--brand2);font-style:italic}.lg-card{padding:24px 20px}}
/* dashboard */
.hero{background:linear-gradient(135deg,#123826 0%,#1f5f3f 45%,#2f7a54 100%);background-size:200% 200%;animation:lgShift 20s ease-in-out infinite}
.hero:after{animation:orb 18s ease-in-out infinite}.hero:before{animation:orb 22s ease-in-out infinite reverse}
.hero .hs{backdrop-filter:blur(4px);transition:transform .2s,background .2s}.hero .hs:hover{transform:translateY(-2px);background:rgba(255,255,255,.15)}
.spark{display:block;width:100%;height:34px;margin-top:6px}.dash.anim .spl{stroke-dasharray:400;stroke-dashoffset:400;animation:draw 1.6s .3s ease forwards}
.qtiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.qt{display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px 14px;text-align:left;font:inherit;cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.qt:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(23,63,43,.45);border-color:#cfe1d5}
.qi{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none}.qt.ok .qi{background:var(--greenSoft);color:var(--in)}.qt.warn .qi{background:var(--amberSoft);color:var(--amber)}.qt.bad .qi{background:var(--redSoft);color:var(--out)}
.qm{flex:1;min-width:0;display:flex;flex-direction:column}.qk{font-size:12px;color:var(--muted)}.qv{font-size:20px;line-height:1.2;font-variant-numeric:tabular-nums}.qm small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.qc{color:#b5bfb9;display:flex}
.dash.anim>*{animation:fadeUp .55s both}.dash.anim>*:nth-child(2){animation-delay:.08s}.dash.anim>*:nth-child(3){animation-delay:.14s}.dash.anim>*:nth-child(4){animation-delay:.2s}.dash.anim>*:nth-child(5){animation-delay:.26s}.dash.anim>*:nth-child(6){animation-delay:.32s}
.dash.anim .qt{animation:fadeUp .5s var(--d) both}.dash.anim .obar .fill{transform-origin:left;animation:grow 1s .25s cubic-bezier(.2,.8,.2,1) both}@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.dash .card{transition:box-shadow .2s}.dash .card:hover{box-shadow:0 8px 26px -16px rgba(23,63,43,.35)}
@media (max-width:900px){.qtiles{grid-template-columns:1fr 1fr;gap:10px}.qt{padding:10px}.qi{width:34px;height:34px}.qv{font-size:17px}.qc{display:none}}
@media (prefers-reduced-motion: reduce){.lg-hero,.orb,.lg-logo,.lg-shine,.hero,.hero:after,.hero:before{animation:none!important}.lg-line{stroke-dashoffset:0;animation:none}.lg-area,.lg-dot,.lg-foot{opacity:1;animation:none}.dash.anim *,.lg *{animation-duration:.01s!important;animation-delay:0s!important}}

/* v17 */ @media(max-width:700px){#mfI .mrow{grid-template-columns:1fr 1fr 28px!important}#mfI .mrow>div:first-child{grid-column:1/-1}#mfI+button{margin-top:8px}.optab td,.optab th{padding:6px 5px}}
/* v16 */ .rapor{border:1px solid var(--line);border-radius:12px;padding:14px}.raph{display:flex;gap:12px;align-items:center;background:#1f5f3f;color:#fff;margin:-14px -14px 12px;padding:12px 14px;border-radius:12px 12px 0 0;font-size:12px}.raph b{font-size:15px}.rapsk{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.rapsk>div{background:var(--brandSoft);border-radius:10px;padding:9px 11px}.rapsk .big{font-size:20px;font-weight:700;color:#1f5f3f}.rapor .ph4{margin-top:12px}
/* v15 */ .drback{border:0;background:var(--grey);border-radius:8px;width:30px;height:30px;font-size:20px;line-height:1;cursor:pointer;margin-right:8px;flex:none;color:var(--ink,#222)} .riw.click,.svc.click,tr.click{cursor:pointer} .riw.click:hover,.svc.click:hover{background:var(--brandSoft)} .riw .chev{color:var(--muted);align-self:center} #drawer .ihdet thead{display:none}#drawer .ihdet tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 0;border-bottom:1px solid var(--line)}#drawer .ihdet td{border:0!important;padding:0!important}#drawer .ihdet tr:not(.tot) td:nth-child(2){grid-column:1/-1;order:3}#drawer .ihdet td:nth-child(4){display:none}#drawer .ihdet tr.tot td[colspan="4"]{grid-column:1/-1}
/* v14 */ @media(max-width:700px){.ihdet thead{display:none}.ihdet tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 0;border-bottom:1px solid var(--line)}.ihdet td{border:0!important;padding:0!important}.ihdet tr:not(.tot) td:nth-child(2){grid-column:1/-1;order:3}.ihdet td:nth-child(4){display:none}.ihdet tr.tot td[colspan="4"]{grid-column:1/-1}.ihdet tr.tot{padding:7px 0}} .alert.s{background:var(--greenSoft,#e6f2ea);color:#1f5a3c} .ihname{background:none;border:0;padding:0;font:inherit;font-weight:600;color:inherit;cursor:pointer;text-align:left;text-decoration:underline dotted;text-underline-offset:3px} .kpi.clk{cursor:pointer} .kpi.clk:hover{outline:2px solid var(--line)}
/* v19 */
.sepb span.sgi{flex:none!important}.sepb span.sgt{flex:1;text-align:left}
.navtools{display:none!important}
.sepb{gap:8px;font-size:11px;padding:12px 10px 6px}.sepb .sgi{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:rgba(255,255,255,.1);color:#e8c766;flex:none}.sepb .sgi svg.i{width:13px;height:13px}.sepb .sgt{flex:1}
nav a .nic{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.06);flex:none;margin-left:-4px;transition:background .15s}nav a .nic svg.i{width:16px;height:16px}
nav a:hover .nic{background:rgba(255,255,255,.12)}nav a.on .nic{background:var(--brandSoft);color:var(--brand)}
.permhd{display:grid;grid-template-columns:1fr 40px 40px;gap:8px;margin-top:12px}.permhd span:not(:first-child){text-align:center}
.permcard .permrow .switch{margin-left:2px}.sw-e input:checked+span{background:#2b5fa8}
.ro-hide{display:none!important}.robanner{margin-bottom:14px}
.hpos{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}.hp{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--soft)}.hpb{display:flex;justify-content:space-between;font-size:12.5px;margin:4px 0}
.hpbar{height:7px;background:var(--redSoft);border-radius:6px;overflow:hidden;margin:4px 0}.hpbar i{display:block;height:100%;background:var(--brand2);border-radius:6px}
.mfhead2,#mfI .mrow2{display:grid;grid-template-columns:2.2fr .8fr 1.3fr 1fr 28px;gap:6px;align-items:center}#mfI .mrow2{margin-top:6px}
.in.pk{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2366726b' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 10px center;padding-left:32px}.in.pk.bad{border-color:var(--out);background-color:var(--redSoft)}
@media (max-width:700px){.mfhead2{display:none}#mfI .mrow2{grid-template-columns:1fr 1fr 28px;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}#mfI .mrow2>div:first-child{grid-column:1/-1}#mfI .mrow2>div:nth-child(4){grid-column:1/3}}
.jpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.jpick label{cursor:pointer}.jpick input{display:none}.jpick span{display:block;border:1px solid var(--line);border-radius:10px;padding:8px 10px;height:100%}.jpick b{display:block;font-size:13px}.jpick small{font-size:11.5px;color:var(--muted)}
.jpick input:checked+span{border-color:var(--brand);background:var(--brandSoft);box-shadow:0 0 0 1px var(--brand)}
@media (max-width:700px){.jpick{grid-template-columns:1fr}}
.rcgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}.rcard{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff}
.rch{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;margin-bottom:6px}.rch b{font-size:14.5px}.rcp{font-weight:700;color:var(--brand);background:var(--brandSoft);border-radius:8px;padding:3px 8px;white-space:nowrap}
.rct{font-size:12.5px}.rct td,.rct th{padding:5px 6px}.rcap{display:flex;flex-wrap:wrap;gap:4px 10px;justify-content:space-between;font-size:12.5px;padding:6px 8px;border-radius:8px;background:var(--soft);margin-top:4px}
.rcf{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.rsrow{display:grid;grid-template-columns:2fr 1fr 60px 28px;gap:6px;align-items:center;margin-top:6px}
.capgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}.cap{border:1px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer;display:flex;flex-direction:column;gap:6px}.cap:hover{border-color:var(--brand2)}
.capn{font-size:22px;font-weight:700}.capn small{font-size:11.5px;font-weight:500;color:var(--muted);margin-left:6px}
.alarmbox{display:flex;gap:12px;align-items:center;border-radius:14px;padding:12px 14px;margin-bottom:12px;background:linear-gradient(135deg,#fff3f0,#fff);border:1px solid #f3cfc6}.alarmbox.off{background:var(--soft);border-color:var(--line)}
.ab-i{width:44px;height:44px;border-radius:12px;background:var(--redSoft);color:var(--out);display:grid;place-items:center;flex:none;animation:ring 2.4s ease-in-out infinite}.alarmbox.off .ab-i{animation:none;background:var(--grey);color:var(--muted)}
@keyframes ring{0%,80%,100%{transform:rotate(0)}84%{transform:rotate(-12deg)}88%{transform:rotate(12deg)}92%{transform:rotate(-8deg)}96%{transform:rotate(6deg)}}
.amin{width:80px;padding:5px 8px;text-align:right}tr.rowalarm td{background:#fff6f4}tr.rowalarm td:first-child{box-shadow:inset 3px 0 0 var(--out)}
@media (prefers-reduced-motion: reduce){.ab-i{animation:none}}

/* v20 */
aside,aside nav,aside .nsubg,aside .nsubg>div{overflow-x:hidden!important}aside{scrollbar-width:none}aside::-webkit-scrollbar,aside nav::-webkit-scrollbar{width:0;height:0;display:none}aside nav{scrollbar-width:none}nav a .nic{margin-left:0}
nav a .badge{flex:none;white-space:nowrap;overflow-wrap:normal}
.master.one{grid-template-columns:1fr}.master.one>.mlist{grid-column:1/-1!important}
aside{overflow-x:hidden}nav .nsubg a{min-width:0;overflow-wrap:anywhere}.sepb{max-width:100%}
/* menu: judul kelompok jelas berbeda dari item menu */
.sepb{margin:14px 0 4px;padding:9px 10px;border-radius:10px;background:rgba(255,255,255,.08);color:#fff;opacity:1;font-size:11.5px;letter-spacing:.07em;border:1px solid rgba(255,255,255,.08)}
.sepb:hover{background:rgba(255,255,255,.13)}.sepb.cur{background:rgba(232,199,102,.16);border-color:rgba(232,199,102,.35)}
.sepb .sgi{background:#e8c766;color:#173f2b}.sepb .chv{color:#e8c766}
.nsubg>div{margin:2px 0 2px 16px;padding-left:8px;border-left:2px solid rgba(255,255,255,.12)}
nav .nsubg a{color:#e6efe9;font-size:13.4px;font-weight:500;padding:7px 8px}nav .nsubg a .nic{width:26px;height:26px;background:rgba(255,255,255,.05)}
nav .nsubg a.on{color:var(--brand);font-weight:600}nav a.on{box-shadow:0 4px 12px rgba(0,0,0,.18)}
/* animasi perpindahan menu & sub menu */
#view.vin>*{animation:pgIn .45s cubic-bezier(.2,.8,.2,1) both}#view.vin>*:nth-child(2){animation-delay:.05s}#view.vin>*:nth-child(3){animation-delay:.1s}#view.vin>*:nth-child(4){animation-delay:.15s}#view.vin>*:nth-child(5){animation-delay:.2s}
@keyframes pgIn{from{opacity:0;transform:translateY(16px) scale(.99)}to{opacity:1;transform:none}}
#view.tin .tabs~*,#view.tin .msubnav~*,#view.tin .seg~*{animation:tabIn .35s ease both}
@keyframes tabIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
.tabs button,.msubnav button,.seg button{transition:background .2s,color .2s,border-color .2s,transform .15s}.tabs button:active,.msubnav button:active{transform:scale(.97)}
nav a{transition:background .18s,color .18s}
@media (prefers-reduced-motion: reduce){#view.vin>*,#view.tin *{animation:none!important}}
/* waktu & surat */
.tsline{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);background:var(--soft);border:1px solid var(--line);border-radius:20px;padding:3px 10px;margin-bottom:10px}.tsline svg.i{width:13px;height:13px}
.surat{font-family:"Times New Roman",Georgia,serif;font-size:14px;line-height:1.55;color:#111;background:#fff;border:1px solid var(--line);border-radius:6px;padding:26px 30px;max-width:720px;margin:0 auto}
.surat .sk{display:flex;gap:14px;align-items:center;border-bottom:3px double #222;padding-bottom:10px;text-align:center}.surat .sk>div:last-child{flex:1;font-size:12.5px}.surat .sk b{font-size:14.5px;display:block}
.surat .sj{text-align:center;margin:16px 0 12px}.surat .sj b{text-decoration:underline;font-size:15px}.surat .sj div{font-size:13px}
.surat .skv td{border:0;padding:2px 6px;vertical-align:top}.surat .skv td:first-child{width:180px;color:#333}.surat .skv td:nth-child(2){width:10px}
.surat .stab{margin:10px 0;font-size:12.5px}.surat .stab th,.surat .stab td{border:1px solid #bbb;padding:4px 6px;text-transform:none;letter-spacing:0;color:#111}.surat .stab th{background:#eef3ef}.surat tfoot td{font-weight:700;background:#f5f8f6}
.surat .sttd{margin-top:18px}.surat .stt{text-align:right}.surat .stg{display:flex;justify-content:space-around;gap:12px;text-align:center;margin-top:8px}.surat .stg>div{flex:1}.surat .sline{height:56px}
.surat .sfoot{margin-top:18px;font-size:11px;color:#777;border-top:1px dashed #ccc;padding-top:6px;font-family:inherit}
.lampprev{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:26px;border:1px dashed var(--line);border-radius:12px;background:var(--soft)}.lampprev svg.i{width:46px;height:46px;color:var(--brand)}
/* keuangan semua divisi */
.rkbars{display:flex;flex-direction:column;gap:9px}.rkb{display:grid;grid-template-columns:190px 1fr 120px;gap:10px;align-items:center;font-size:13px}
.rkt{position:relative;height:22px}.rkt i{position:absolute;left:0;border-radius:5px;animation:grow .9s cubic-bezier(.2,.8,.2,1) both;transform-origin:left}.rkt i.o{top:0;height:10px;background:#2f7a54}.rkt i.l{top:0;height:10px;background:#9cc9ad;opacity:.9}.rkt i.b{top:13px;height:7px;background:#e8a33a}
.rkv{display:flex;flex-direction:column;align-items:flex-end;font-size:12.5px}.rktrend{width:100%;height:auto;max-height:240px}
.rkmon{margin-bottom:16px}.rkmh{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--brandSoft);border-radius:9px;color:var(--brand);margin-bottom:4px}
@media (max-width:700px){.rkb{grid-template-columns:1fr 90px}.rkb .rkl{grid-column:1/-1}}
/* stock opname & riwayat ringkas */
.sogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-bottom:6px}
.socard{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff;cursor:pointer;transition:transform .18s,box-shadow .18s}.socard:hover{transform:translateY(-2px);box-shadow:0 10px 24px -16px rgba(23,63,43,.5)}.socard.run{border-color:#efc77b;background:#fffaf0}
.soh{display:flex;justify-content:space-between;gap:8px;align-items:center}.sobar{height:6px;border-radius:6px;background:var(--grey);overflow:hidden;margin:10px 0 6px}.sobar i{display:block;height:100%;background:var(--brand2)}.sofoot{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted)}
.soh3{display:flex;align-items:center;gap:8px;font-size:14px;margin:18px 0 8px}.soh3 svg.i{color:var(--brand)}
.tline{position:relative;margin-left:4px}.tl2{display:grid;grid-template-columns:62px 30px 1fr auto;gap:10px;align-items:center;padding:8px 10px;border-radius:10px;cursor:pointer;transition:background .15s}.tl2:hover{background:var(--soft)}
.tlt{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.tld{width:30px;height:30px;border-radius:50%;display:grid;place-items:center}.tld svg.i{width:15px;height:15px}
.tl2.t-in .tld{background:var(--greenSoft);color:var(--in)}.tl2.t-tit .tld{background:var(--blueSoft);color:var(--blue)}.tl2.t-out .tld{background:var(--amberSoft);color:var(--amber)}.tl2.t-adj .tld{background:var(--grey);color:var(--muted)}
.tlm{min-width:0}.tlm b{font-weight:600;font-size:13.5px}.tlm .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tlr{display:flex;flex-direction:column;align-items:flex-end;font-size:13px}
.hpplist .tl2,.tline .tl2{border-bottom:1px solid var(--line);border-radius:0}
@media (max-width:700px){.tl2{grid-template-columns:30px 1fr;}.tl2 .tlt{grid-column:1/-1;order:-1}.tl2 .tlr{grid-column:2;align-items:flex-start;flex-direction:row;gap:8px}.tlm .small{white-space:normal}}
/* HPP bahan baku ringkas */
.hpplist{display:flex;flex-direction:column;gap:8px}.hpprow{border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.hpprow summary{display:grid;grid-template-columns:1fr auto 120px 20px;gap:14px;align-items:center;padding:10px 14px;cursor:pointer;list-style:none}.hpprow summary::-webkit-details-marker{display:none}
.hpn{display:flex;flex-direction:column}.hpm{display:flex;gap:16px}.hpm span{display:flex;flex-direction:column;align-items:flex-end}.hpm small{font-size:11px;color:var(--muted)}
.hpbar2{height:6px;border-radius:6px;background:var(--greenSoft);overflow:hidden}.hpbar2 i{display:block;height:100%;background:#e8a33a}
.hpc{transition:transform .2s;color:var(--muted)}.hpprow[open] .hpc{transform:rotate(90deg)}.hpprow[open]{box-shadow:0 8px 22px -16px rgba(23,63,43,.45)}
.hpd{padding:0 14px 12px;border-top:1px dashed var(--line);animation:tabIn .3s ease both}.hpchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.hpchips span{font-size:12px;background:var(--soft);border:1px solid var(--line);border-radius:20px;padding:3px 10px;cursor:pointer}
.hpout{display:flex;flex-direction:column;gap:3px;font-size:12.5px;margin-top:8px}
@media (max-width:700px){.hpprow summary{grid-template-columns:1fr 20px}.hpm{grid-column:1/-1;order:3;justify-content:space-between}.hpbar2{grid-column:1/-1;order:4}}
/* ACC Bendahara */
.accbox{border:1px solid #efc77b;background:#fffaf0;border-radius:14px;padding:10px 14px;margin-bottom:14px}.acch{display:flex;align-items:center;gap:8px;margin-bottom:6px;color:#7a5200}
.accrow{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 0;border-top:1px solid #f3e2bd;flex-wrap:wrap}.accb{display:flex;gap:6px}

/* v21 */
.dlogo{border-radius:12px;object-fit:cover;flex:none;display:inline-grid;place-items:center;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.dlogo.gen{color:#fff;font-weight:800;letter-spacing:.5px;font-family:inherit}
.oid .oidh{display:flex;gap:12px;align-items:center}.oid .oidh b{font-size:16px}
.oide{display:grid;grid-template-columns:120px 1fr;gap:14px}.oidl{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
@media(max-width:560px){.oide{grid-template-columns:1fr}}
.hpick{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.hpick label{cursor:pointer}.hpick input{display:none}
.hpick span{display:inline-block;padding:6px 10px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;background:#fff}
.hpick input:checked+span{background:var(--brand);color:#fff;border-color:var(--brand)}
.mlogo{display:flex;align-items:center;gap:8px;min-width:0}.mlogo .dlogo{border-radius:7px}
.txnote{margin-top:4px;font-size:12px;color:#a33;background:#fdeeee;border-radius:6px;padding:3px 7px;display:inline-flex;gap:4px;align-items:center}
.txnote svg{width:12px;height:12px}
.txstat{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:10px;margin-bottom:12px;font-size:13px;border:1px solid var(--line)}
.txstat.Ditolak{background:#fdeeee;border-color:#f3c7c7}.txstat.Menunggu{background:#fff7e8;border-color:#f2dcae}.txstat.Berhasil{background:#ecf7f0;border-color:#c5e6d2}
.lcsvg .lcdot{transition:r .15s}.lcsvg .grp:hover~*{opacity:1}.lcsvg .grp{cursor:pointer}.lcsvg .grp:hover .hit{fill:rgba(47,122,84,.06)}
.anim-on .lcarea{animation:lcFade 1.1s ease both}.anim-on .lcdot{animation:lcFade .5s ease both;animation-delay:.7s}
@keyframes lcFade{from{opacity:0}to{opacity:1}}
.ai{animation:aiIn .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--ai)*35ms)}
@keyframes aiIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.anim-on .ring{animation:ringIn 1s cubic-bezier(.2,.8,.2,1) both}@keyframes ringIn{from{transform:rotate(-90deg) scale(.85);opacity:0}to{transform:none;opacity:1}}
.anim-on .rbar i,.anim-on .pbar2 i,.anim-on .meter i,.anim-on .prog i{animation:barX .9s cubic-bezier(.2,.8,.2,1) both;transform-origin:left}@keyframes barX{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.awm .ring b{font-size:17px}.awm .awmb{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.awchips{display:flex;flex-wrap:wrap;gap:6px}.awc{border:1px solid #c5e6d2;background:#ecf7f0;color:#1f5f3f;border-radius:999px;padding:5px 10px;font-size:12.5px;cursor:pointer;font-family:inherit}
.awc b{margin-left:4px}.awc:hover{background:#d9efe2}
.awd{margin-top:12px;border-top:1px dashed var(--line);padding-top:8px}.awd summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--brand)}
.galb{overflow:hidden}.gtrack{overflow:hidden;margin:0 -16px;padding:4px 0;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.grun{display:flex;gap:12px;width:max-content;animation:gRun linear infinite}.gtrack:hover .grun{animation-play-state:paused}
@keyframes gRun{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.gcard{position:relative;width:210px;height:140px;border-radius:14px;flex:none;background-size:cover;background-position:center;cursor:pointer;overflow:hidden;color:#fff;transition:transform .25s,box-shadow .25s}
.gcard:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.gcp{background:linear-gradient(135deg,#f3efe4,#e6dcc4);color:#1b2520}
.gcl{position:absolute;inset:0 0 40px;display:grid;place-items:center}.gcl .dlogo{box-shadow:0 2px 10px rgba(0,0,0,.2);border:2px solid rgba(255,255,255,.6)}
.gcl img,.gcl .ava{border-radius:50%!important;border:3px solid #fff}
.gcc{position:absolute;left:0;right:0;bottom:0;padding:8px 12px;display:flex;flex-direction:column;line-height:1.25}
.gcc b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gcc span{font-size:11.5px;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:700px){.gcard{width:170px;height:118px}}
@media(prefers-reduced-motion:reduce){.grun{animation:none;flex-wrap:nowrap;overflow-x:auto}}
.iptguide{background:#f4f8f5;border:1px solid #d6e8dc;border-radius:12px;padding:12px 14px;margin-top:10px;font-size:13px}
.iptguide>b{display:flex;gap:6px;align-items:center}.iptguide ol{margin:6px 0 10px;padding-left:20px}.iptguide li{margin:3px 0}
.iptb{display:flex;gap:8px;flex-wrap:wrap}
/* v22 */
@property --sw{syntax:'<angle>';initial-value:0deg;inherits:false}
.wl-ar,.sphero .ar{text-align:left}.lg-salam span{align-self:flex-start}
.copyr{font-size:11.5px;letter-spacing:.3px;opacity:.75;margin-top:8px}
.wibc{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.wibc svg{width:15px;height:15px;flex:none}.wibc .wibt b{font-weight:700;letter-spacing:.4px}
.wibc .wibd:after{content:"·";margin-left:7px;opacity:.6}
.tbclock{margin-left:auto;color:var(--muted);background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:6px 12px}
.tbclock .wibt b{color:var(--brand)}
.tbclock+.tb-right{margin-left:0}
@media(max-width:1180px){.tbclock .wibd{display:none}}
@media(max-width:900px){.tbclock{padding:4px 9px;margin-left:0}.tbclock svg{display:none}.tbclock .wibc{font-size:11.5px}}
.asfoot{padding:14px 18px 18px;font-size:11px;color:rgba(255,255,255,.55);letter-spacing:.3px}
.appfoot{display:none;text-align:center;font-size:11.5px;color:var(--muted);padding:22px 0 6px}
@media(max-width:900px){.appfoot{display:block}}
/* halaman awal */
.wl{position:absolute;inset:0;overflow:auto;background:radial-gradient(1200px 600px at 10% -10%,#2a7a52 0%,transparent 60%),linear-gradient(150deg,#0d2a1c,#174a32 55%,#1e6643);color:#fff}
.wl-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.45;pointer-events:none}
.wl-orb.a{width:420px;height:420px;background:#e8c766;left:-120px;bottom:-140px;animation:orbF 14s ease-in-out infinite}
.wl-orb.b{width:360px;height:360px;background:#3fbf86;right:-100px;top:-80px;animation:orbF 17s ease-in-out infinite reverse}
@keyframes orbF{50%{transform:translate(40px,-30px) scale(1.1)}}
.wl-in{position:relative;z-index:1;min-height:100%;display:grid;grid-template-columns:minmax(340px,520px) minmax(0,1fr);gap:48px;align-items:center;padding:44px 56px;max-width:1360px;margin:0 auto;box-sizing:border-box}
.wl-left>*{animation:fadeUp .7s both}.wl-left>*:nth-child(2){animation-delay:.08s}.wl-left>*:nth-child(3){animation-delay:.16s}.wl-left>*:nth-child(4){animation-delay:.24s}.wl-left>*:nth-child(5){animation-delay:.32s}
.wl-brand{display:flex;gap:12px;align-items:center;margin-bottom:28px}.wl-brand b{display:block;font-size:19px}.wl-brand small{color:#e8c766;font-style:italic;font-size:12.5px}
.wl-brand img{box-shadow:0 0 0 4px rgba(255,255,255,.12)}
.wl-ar{font-family:"Amiri","Scheherazade New","Traditional Arabic",serif;font-size:34px;line-height:1.6;color:#f3dc92;text-shadow:0 2px 18px rgba(232,199,102,.35)}
.wl-h{font-size:clamp(22px,2.6vw,32px);line-height:1.25;margin:6px 0 12px;font-weight:800;letter-spacing:-.3px}
.wl-p{color:rgba(255,255,255,.82);font-size:14.5px;line-height:1.6;margin:0 0 16px;max-width:460px}
.wl-clock{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);padding:8px 14px;border-radius:999px;backdrop-filter:blur(6px)}
.wl-clock .wibt b{color:#f3dc92}
.wl-choice{display:grid;gap:12px;margin:24px 0 22px}
.wlc{display:flex;align-items:center;gap:14px;text-align:left;font:inherit;color:#1b2520;background:#fff;border:0;border-radius:16px;padding:16px 16px;cursor:pointer;box-shadow:0 10px 30px -12px rgba(0,0,0,.45);transition:transform .25s,box-shadow .25s;animation:fadeUp .6s var(--d) both;position:relative;overflow:hidden}
.wlc:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(232,199,102,.25) 50%,transparent 70%);transform:translateX(-100%);transition:transform .7s}
.wlc:hover{transform:translateY(-3px);box-shadow:0 18px 40px -14px rgba(0,0,0,.55)}.wlc:hover:before{transform:translateX(100%)}
.wlci{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,#1f5f3f,#3d9a69);color:#fff;transition:transform .3s}
.wlc.s .wlci{background:linear-gradient(135deg,#b07a14,#e8b54a)}
.wlc:hover .wlci{transform:rotate(-8deg) scale(1.08)}.wlci svg{width:24px;height:24px}
.wlct{flex:1;min-width:0}.wlct b{display:block;font-size:16px}.wlct small{display:block;color:var(--muted);font-size:12.5px;line-height:1.4;margin-top:2px}
.wlca{color:var(--brand2);transition:transform .25s}.wlc:hover .wlca{transform:translateX(4px)}
.wl-foot{font-size:12px;color:rgba(255,255,255,.6);line-height:1.6}
.wl-right{display:flex;flex-direction:column;gap:10px;min-width:0}
.wl-mosaic{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,minmax(120px,1fr));grid-template-areas:"a a b" "a a c" "d e e";gap:14px;height:min(72vh,600px)}
.wt{position:relative;border-radius:20px;overflow:hidden;animation:wtIn .8s cubic-bezier(.2,.8,.2,1) var(--d) both;transition:opacity .42s,transform .42s;box-shadow:0 20px 40px -20px rgba(0,0,0,.6)}
.wt.t0{grid-area:a}.wt.t1{grid-area:b}.wt.t2{grid-area:c}.wt.t3{grid-area:d}.wt.t4{grid-area:e}
@keyframes wtIn{from{opacity:0;transform:translateY(24px) scale(.94) rotate(-1deg)}}
.wt.swap{opacity:0;transform:scale(.92) rotateY(25deg)}.wt.swapin{animation:wtSw .7s cubic-bezier(.2,.8,.2,1)}
@keyframes wtSw{from{opacity:0;transform:scale(1.06)}}
.wl-cap{font-size:12px;color:rgba(255,255,255,.7);display:flex;align-items:center;gap:8px;justify-content:flex-end}
.dotlive{width:8px;height:8px;border-radius:50%;background:#5fe0a0;box-shadow:0 0 0 0 rgba(95,224,160,.6);animation:dl 1.8s infinite}@keyframes dl{70%{box-shadow:0 0 0 8px rgba(95,224,160,0)}100%{box-shadow:0 0 0 0 rgba(95,224,160,0)}}
.gt{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;color:#fff}
.gt.outlet{background:linear-gradient(140deg,var(--a),var(--b))}
.gt.tim{background:linear-gradient(150deg,#fbf6e8,#efe3c4);color:#1b2520}
.gtpat{position:absolute;inset:0;width:100%;height:100%}
.gtbig{position:absolute;right:-14px;top:-10px;opacity:.12;transform:rotate(-12deg)}.gtbig svg{width:150px;height:150px;stroke-width:1.2}
.gtl{position:absolute;inset:0 0 56px;display:grid;place-items:center;animation:kb 9s ease-in-out infinite alternate}
.gtl .dlogo{border:3px solid rgba(255,255,255,.55);box-shadow:0 10px 24px rgba(0,0,0,.25)}
.gt.tim .gtl>*{border-radius:50%!important;box-shadow:0 0 0 4px #fff,0 12px 26px rgba(80,60,10,.25)}
@keyframes kb{to{transform:scale(1.08) translateY(-4px)}}
.gtimg{position:absolute;inset:0;background-size:cover;background-position:center;animation:kb 10s ease-in-out infinite alternate}
.gt.foto:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.7))}
.gtc{position:relative;z-index:1;padding:12px 14px;display:flex;flex-direction:column;gap:2px;line-height:1.3}
.gtc b{font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gtc span{font-size:12px;opacity:.85}
.gtc small{font-size:11.5px;opacity:.85;display:flex;gap:4px;align-items:center}.gtc small svg{width:12px;height:12px}
.wt.t0 .gtc b{font-size:19px}.wt.t0 .gtl .dlogo{transform:scale(1.35)}
@media(max-width:980px){.wl-in{grid-template-columns:1fr;padding:22px 18px 30px;gap:18px}.wl-right{order:-1}.wl-mosaic{height:300px;grid-template-rows:repeat(3,1fr);gap:10px}.wl-brand{margin-bottom:14px}.wl-ar{font-size:26px}.gtbig svg{width:90px;height:90px}.wt.t0 .gtc b{font-size:15px}.gtc{padding:8px 10px}.gtc span,.gtc small{font-size:10.5px}.wl-cap{justify-content:center}}
#login.lgfade>*{animation:fadeUp .45s both}
/* form masuk */
.lg-back{background:none;border:0;font:inherit;font-size:12.5px;color:var(--brand2);cursor:pointer;padding:0;margin:0 0 10px}
.lg-back:hover{text-decoration:underline}
.lgmode{position:relative;display:grid;grid-template-columns:1fr 1fr;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:4px;margin-bottom:16px}
.lgmode button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:13.5px;font-weight:600;color:var(--muted);background:none;border:0;padding:9px;border-radius:9px;cursor:pointer;transition:color .25s}
.lgmode button svg{width:16px;height:16px}.lgmode button.on{color:#fff}
.lgmi{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:9px;background:linear-gradient(135deg,#1f5f3f,#3d9a69);transition:transform .35s cubic-bezier(.2,.8,.2,1);box-shadow:0 4px 12px rgba(31,95,63,.3)}
.lgm-supplier .lgmi{transform:translateX(100%);background:linear-gradient(135deg,#b07a14,#e8b54a)}
.lg-salam{font-size:13px;color:var(--brand2);font-weight:600;display:flex;flex-direction:column;gap:2px}
.lg-salam span{font-family:"Amiri","Traditional Arabic",serif;font-size:22px;color:#b07a14;line-height:1.4}
.lgm-supplier .lg-title{color:#7a520b}
.lg-sub2{font-size:13px;color:var(--muted);line-height:1.5;margin:4px 0 10px}.lg-sub2 b{color:var(--ink)}
.lg-clock{color:var(--muted);background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:6px 12px;margin-bottom:14px}
.lg-clock .wibt b{color:var(--brand)}
.lgm-supplier .lg-btn{background:linear-gradient(135deg,#a8700f,#d9a53c)}
.lg-q{margin:18px 0 0;padding:12px 14px;border-left:3px solid #e8c766;background:#fbf7ea;border-radius:0 10px 10px 0;font-size:12.5px;color:#4b4630;line-height:1.5;font-style:italic}
.lg-q cite{display:block;font-style:normal;font-weight:700;font-size:11.5px;color:#9a7a1c;margin-top:4px}
.lg-card>.copyr{text-align:center;color:var(--muted)}
.lg-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0 22px}
.lgg{position:relative;height:96px;border-radius:14px;overflow:hidden;animation:lggIn .7s cubic-bezier(.2,.8,.2,1) calc(.3s + var(--i)*.09s) both,lggF 6s ease-in-out calc(var(--i)*.7s) infinite alternate;box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.lgg .gtl{inset:0 0 30px}.lgg .gtl>*{transform:scale(.62)}.lgg .gtc{padding:6px 9px}.lgg .gtc b{font-size:11.5px}.lgg .gtc span,.lgg .gtc small{display:none}.lgg .gtbig svg{width:80px;height:80px}
@keyframes lggIn{from{opacity:0;transform:translateY(16px) scale(.9)}}@keyframes lggF{to{transform:translateY(-5px)}}
/* sapaan setelah masuk */
.hello{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:radial-gradient(800px 500px at 50% 40%,rgba(23,74,50,.92),rgba(10,30,20,.96));color:#fff;animation:hlIn .4s both;cursor:pointer}
.hello.supplier{background:radial-gradient(800px 500px at 50% 40%,rgba(120,82,12,.92),rgba(40,26,4,.96))}
.hello.out{animation:hlOut .6s both}@keyframes hlIn{from{opacity:0}}@keyframes hlOut{to{opacity:0;visibility:hidden}}
.hl-in{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px;animation:fadeUp .7s .1s both}
.hl-ar{font-family:"Amiri","Traditional Arabic",serif;font-size:40px;color:#f3dc92}.hl-in>b{font-size:22px}.hl-in>span{opacity:.85;font-size:14px}
.hl-clock{margin-top:8px;opacity:.85}
/* diagram lingkar */
.dring-c{position:relative;width:150px;height:150px;flex:none}
.dsvg{width:150px;height:150px;overflow:visible}
.dseg{stroke-dasharray:var(--l) var(--C);stroke-dashoffset:var(--o);animation:dsegIn 1s cubic-bezier(.2,.8,.2,1) var(--d) both;transition:stroke-width .2s,opacity .2s;cursor:pointer}
@keyframes dsegIn{from{stroke-dasharray:0 var(--C)}}
.dring.hl .dseg{opacity:.35}.dring.hl .dseg.on{opacity:1;stroke-width:23}
.dctr{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-size:11px;color:var(--muted);pointer-events:none;padding:0 34px;animation:fadeUp .6s .5s both}
.dctr b{display:block;font-size:15px;color:var(--ink)}.dctr span{line-height:1.2}
.dring .dleg>div{animation:fadeUp .5s var(--d) both;border-radius:8px;padding:4px 6px;margin:0 -6px;transition:background .2s;cursor:default}
.dring .dleg>div.on{background:var(--brandSoft)}
.dring .dleg i{transition:transform .2s}.dring .dleg>div.on i{transform:scale(1.4)}
/* ikon judul halaman & animasi */
.hico{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;margin-right:10px;vertical-align:-9px;background:linear-gradient(135deg,#1f5f3f,#3d9a69);color:#fff;box-shadow:0 6px 16px -6px rgba(31,95,63,.6);animation:hicoIn .6s cubic-bezier(.3,1.6,.5,1) both}
.hico svg{width:20px;height:20px}
@keyframes hicoIn{from{transform:scale(.4) rotate(-25deg);opacity:0}}
@media(max-width:700px){.hico{width:30px;height:30px;border-radius:9px;margin-right:8px;vertical-align:-6px}.hico svg{width:16px;height:16px}}
nav a .nic svg,nav a>svg{transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
nav a:hover .nic svg,nav a:hover>svg{transform:scale(1.18) rotate(-6deg)}
nav a.on .nic{animation:nicPop .5s cubic-bezier(.3,1.6,.5,1)}@keyframes nicPop{from{transform:scale(.6)}}
.sepb .sgi svg{transition:transform .35s}.sepb:hover .sgi svg{transform:rotate(-10deg) scale(1.1)}
.kpi{transition:transform .25s,box-shadow .25s}.kpi:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(23,63,43,.35)}
.btn svg{transition:transform .25s}.btn:hover svg{transform:translateY(-1px) scale(1.08)}
.chip.c-amber:before{animation:pulseDot 1.6s ease-in-out infinite}@keyframes pulseDot{50%{opacity:.35}}
.mobnav a svg{transition:transform .3s cubic-bezier(.3,1.6,.5,1)}.mobnav a.on svg{transform:translateY(-2px) scale(1.12)}
.card h2 svg{transition:transform .3s}.card:hover h2 svg{transform:rotate(-8deg) scale(1.1)}
/* portal supplier */
#sp{min-height:100vh;background:#f4f6f3;display:flex;flex-direction:column}
.sph{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;padding:10px 24px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.sphb{display:flex;gap:10px;align-items:center}.sphb b{display:block;font-size:15px}.sphb small{font-size:11.5px;color:#a8700f;font-weight:600}
.spnav{display:flex;gap:4px;margin:0 auto}
.spnav button,.spmob button{display:flex;align-items:center;gap:7px;font:inherit;font-size:13.5px;font-weight:600;color:var(--muted);background:none;border:0;border-radius:10px;padding:9px 13px;cursor:pointer;transition:background .2s,color .2s}
.spnav button svg{width:17px;height:17px;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}.spnav button:hover{background:var(--soft);color:var(--ink)}.spnav button:hover svg{transform:scale(1.15) rotate(-6deg)}
.spnav button.on{background:linear-gradient(135deg,#1f5f3f,#3d9a69);color:#fff;box-shadow:0 6px 14px -8px rgba(31,95,63,.7)}
.sphr{display:flex;align-items:center;gap:10px}
.sph-clock{color:var(--muted);font-size:12px}.sph-clock .wibd{display:none}.sph-clock .wibt b{color:var(--brand)}
.spu{display:flex;align-items:center;gap:8px;background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:4px 12px 4px 4px;cursor:pointer;font:inherit;text-align:left}
.spu b{display:block;font-size:12.5px}.spu small{display:block;font-size:11px;color:var(--muted)}
.spu .avatar,.such .avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#b07a14,#e8b54a);color:#fff;font-weight:700;font-size:12px}
.spm{flex:1;width:100%;max-width:1240px;margin:0 auto;padding:22px 24px 30px;box-sizing:border-box}
.spm.vin>*{animation:fadeUp .5s both}.spm.vin>*:nth-child(2){animation-delay:.05s}.spm.vin>*:nth-child(3){animation-delay:.1s}.spm.vin>*:nth-child(4){animation-delay:.15s}.spm.vin>*:nth-child(5){animation-delay:.2s}
.spfoot{text-align:center;font-size:12px;color:var(--muted);padding:16px 16px 22px}
.spmob{display:none}
.sphero{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;align-items:center;background:linear-gradient(135deg,#123b28,#1f5f3f 50%,#2f7a54);color:#fff;border-radius:22px;padding:24px 26px;position:relative;overflow:hidden;margin-bottom:16px}
.sphero:after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(232,199,102,.35),transparent 70%);right:-80px;top:-120px;animation:orbF 12s ease-in-out infinite}
.sphero .ar{font-family:"Amiri","Traditional Arabic",serif;font-size:24px;color:#f3dc92}
.sphero h1{margin:2px 0 6px;font-size:24px}.sphero p{margin:0 0 12px;opacity:.85;font-size:14px}
.sp-clock{background:rgba(255,255,255,.12);border-radius:999px;padding:6px 12px}.sp-clock .wibt b{color:#f3dc92}
.sphero-q{position:relative;z-index:1;margin:0;font-size:13.5px;font-style:italic;line-height:1.55;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:14px 16px}
.sphero-q cite{display:block;font-style:normal;font-weight:700;color:#f3dc92;font-size:12px;margin-top:6px}
.sphead h1{display:flex;align-items:center;gap:10px;font-size:22px;margin:0 0 4px}.sphead h1 svg{width:22px;height:22px;padding:8px;border-radius:12px;background:linear-gradient(135deg,#1f5f3f,#3d9a69);color:#fff;box-sizing:content-box;animation:hicoIn .6s cubic-bezier(.3,1.6,.5,1) both}
.sphead p{margin:0 0 14px;color:var(--muted);font-size:13.5px}
.spf{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 12px;margin-bottom:14px;color:var(--muted)}
.spf svg{width:16px;height:16px}.spf .sel{max-width:240px}.spper{margin-left:auto;display:flex;gap:6px;align-items:center;font-size:13px;font-weight:600;color:var(--ink)}
.spkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:14px}
.spk{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;transition:transform .25s,box-shadow .25s}
.spk:hover{transform:translateY(-2px);box-shadow:0 12px 26px -16px rgba(23,63,43,.4)}
.spki{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;background:var(--brandSoft);color:var(--brand)}.spki svg{width:20px;height:20px}
.spk.green .spki{background:#e3f4ea;color:#1d7a46}.spk.amber .spki{background:#fff3d6;color:#a86a00}.spk.blue .spki{background:#e6eefa;color:#2b5fa8}
.spk .k{font-size:12px;color:var(--muted)}.spk .v{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums}.spk .s{font-size:11.5px;color:var(--muted)}
.spg2{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;margin-bottom:14px}.spg2>.card{margin:0}
.splow{display:flex;justify-content:space-between;gap:10px;width:100%;text-align:left;font:inherit;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px;cursor:pointer;transition:transform .2s,border-color .2s}
.splow:hover{transform:translateX(3px);border-color:#e8c766}.splow b{display:block;font-size:13.5px}.splow small{font-size:11.5px;color:var(--muted)}
.splq{display:flex;flex-direction:column;align-items:flex-end;gap:3px;white-space:nowrap}
.spok{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:26px 10px;color:var(--muted);font-size:13px}.spok svg{width:38px;height:38px;color:#1d7a46;padding:10px;border-radius:50%;background:#e3f4ea;animation:hicoIn .6s both}.spok b{color:var(--ink)}
.sptop{display:flex;flex-direction:column;gap:6px}
.sptr{display:grid;grid-template-columns:30px minmax(150px,1.2fr) 2fr auto;gap:12px;align-items:center;font:inherit;text-align:left;background:none;border:0;border-radius:10px;padding:8px;cursor:pointer;animation:fadeUp .5s var(--d) both}
.sptr:hover{background:var(--soft)}.sprk{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--brandSoft);color:var(--brand);font-weight:800;font-size:12.5px}
.sptr:nth-child(1) .sprk{background:linear-gradient(135deg,#d9a53c,#f3dc92);color:#5a3d05}
.sptn b{display:block;font-size:13.5px}.sptn small{font-size:11.5px;color:var(--muted)}
.sptb{height:10px;border-radius:99px;background:#eef2ef;overflow:hidden}.sptb i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#2f7a54,#7fbf97);animation:barX 1s cubic-bezier(.2,.8,.2,1) both;transform-origin:left}
.sptq{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:13px}
.spcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px}
.spc{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;animation:fadeUp .5s var(--d) both;transition:transform .25s,box-shadow .25s}
.spc:hover{transform:translateY(-3px);box-shadow:0 16px 32px -18px rgba(23,63,43,.45)}
.spc header{display:flex;gap:10px;align-items:center;margin-bottom:12px}.spc header>div{flex:1;min-width:0}.spc header b{display:block;font-size:15px}.spc header small{font-size:12px;color:var(--muted)}
.spci{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#fbf2da,#f3dc92);color:#7a520b;flex:none}.spci svg{width:20px;height:20px}
.spprice{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.spprice span{background:var(--soft);border-radius:10px;padding:8px 10px;font-size:11px;color:var(--muted)}.spprice b{display:block;font-size:13.5px;color:var(--ink)}
.spst{padding:8px 0;border-top:1px dashed var(--line)}.spsth{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px}.spsth>span{display:flex;align-items:center;gap:7px}
.spsth .dlogo{border-radius:6px}
.spbar{position:relative;height:9px;border-radius:99px;background:#eef2ef;margin:7px 0 5px;overflow:visible}.spbar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#2f7a54,#5fbf8c);animation:barX 1s cubic-bezier(.2,.8,.2,1) both;transform-origin:left}
.spbar.c-amber i{background:linear-gradient(90deg,#d08a2e,#f0c060)}.spbar.c-red i{background:#d0533e}
.spbar em{position:absolute;top:-3px;bottom:-3px;width:2px;background:#1b2520;opacity:.45;border-radius:2px}
.spstf{display:flex;justify-content:space-between;gap:8px;font-size:12px}.spstf span{color:var(--muted)}
.spseg{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin-bottom:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:4px}
.sptable tbody tr{cursor:pointer}.sptable tbody tr:hover{background:var(--soft)}.sptable tfoot td{border-top:2px solid var(--line);background:var(--brandSoft)}
.sptl{display:flex;flex-direction:column;gap:2px}
.sptli{display:flex;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line);animation:fadeUp .45s both}
.sptld{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none;background:var(--soft);color:var(--muted)}.sptld svg{width:16px;height:16px}
.sptld.in{background:#e3f4ea;color:#1d7a46}.sptld.out{background:#fdeeee;color:#b2412f}
.spacc .spacch{display:flex;gap:14px;align-items:center;margin-bottom:12px}.spacch b{display:block;font-size:17px}.spacch span{display:block;font-size:12.5px;color:var(--muted);margin-bottom:4px}
.avatar.xl{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#b07a14,#e8b54a);color:#fff;font-weight:800;font-size:20px}
@media(max-width:900px){
  .sph{padding:8px 12px;gap:10px}.sphb small{display:none}.spnav{display:none}.sph-clock{margin-left:auto}.spu span:not(.avatar){display:none}.spu{padding:3px}.sphr{margin-left:auto}
  .spm{padding:14px 12px 90px}.sphero{grid-template-columns:1fr;padding:18px;border-radius:18px}.sphero h1{font-size:19px}.spg2{grid-template-columns:1fr}
  .spmob{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid var(--line);padding:4px 4px calc(4px + env(safe-area-inset-bottom));justify-content:space-around}
  .spmob button{flex-direction:column;gap:2px;font-size:10.5px;padding:6px 4px;flex:1}.spmob button svg{width:20px;height:20px;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}.spmob button.on{color:var(--brand)}.spmob button.on svg{transform:translateY(-2px) scale(1.15)}
  .spmob button:nth-child(2) span,.spmob button:nth-child(3) span{font-size:0}.spmob button:nth-child(2) span:before{content:"Produk";font-size:10.5px}.spmob button:nth-child(3) span:before{content:"Penjualan";font-size:10.5px}
  .spfoot{padding-bottom:84px}.sptr{grid-template-columns:26px 1fr auto}.sptb{display:none}.spcards{grid-template-columns:1fr}.spf .sel{max-width:none;flex:1}.spper{margin-left:0}
}
/* Setting › Akun Supplier */
.sulist{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.suc{border:1px solid var(--line);border-radius:16px;padding:14px;background:#fff;transition:box-shadow .25s,transform .25s;animation:fadeUp .45s both}
.suc:hover{box-shadow:0 12px 26px -16px rgba(23,63,43,.4);transform:translateY(-2px)}.suc.off{opacity:.6}
.such{display:flex;gap:10px;align-items:center}.sucn{flex:1;min-width:0}.sucn b{display:block}.sucn span{font-size:12px;color:var(--muted)}
.sucm{margin:10px 0 6px;display:flex;align-items:center;gap:6px;font-size:13.5px}
.sucf{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
@media(max-width:980px){.wt:not(.t0) .gtc span,.wt:not(.t0) .gtc small{display:none}.wt:not(.t0) .gtl{inset:0 0 26px}.wt:not(.t0) .gtl>*{transform:scale(.62)}.wt:not(.t0) .gtc b{font-size:11.5px}.wt .gtbig{display:none}}
@media(max-width:900px){.spkpis{grid-template-columns:repeat(2,1fr);gap:8px}.spk{padding:10px;gap:8px}.spki{width:32px;height:32px}.spk .v{font-size:16px}.spk:last-child:nth-child(odd){grid-column:1/-1}}
.spacch .chip{display:inline-flex}
.pwm{font-family:ui-monospace,monospace;font-size:12.5px;background:var(--soft);padding:2px 6px;border-radius:6px}
/* v23 */
body.wm-off .copyr,body.wm-off .asfoot,body.wm-off .appfoot,body.wm-off .swm{display:none!important}
body.tx-nojam .wl-clock,body.tx-nojam .lg-clock,body.tx-nojam .sp-clock{display:none}
body.tx-noqs .sphero-q{display:none}body.tx-noqs .sphero{grid-template-columns:1fr}
/* lapisan galeri: pergantian tanpa kedip */
.wt,.lgg{isolation:isolate}
.gl{position:absolute;inset:0;opacity:0;will-change:opacity,transform;transition:opacity var(--td,1.4s) cubic-bezier(.45,.05,.2,1),transform calc(var(--td,1.4s) * 1.25) cubic-bezier(.2,.7,.2,1),filter var(--td,1.4s) ease}
.gl.on{opacity:1;transform:none;filter:none}
.tr-zoom .gl:not(.on){transform:scale(1.14)}
.tr-slide .gl:not(.on){transform:translateX(22%)}.tr-slide .gl.on.old{transform:translateX(-14%)}
.tr-blur .gl:not(.on){filter:blur(16px) saturate(1.3)}
.gl.old{z-index:0}.gl.on:not(.old){z-index:1}
.gtl,.gtimg{animation:none}
.kb .gtimg{animation:kb2 14s ease-in-out infinite alternate}.kb .gtl{animation:kb 10s ease-in-out infinite alternate}
@keyframes kb2{from{transform:scale(1.02)}to{transform:scale(1.14) translate(-2%,-2%)}}
.gtc0{display:none}.gtl0{inset:0!important}
.wt.t0 .gl .gtc b{font-size:19px}
.wl.nogal .wl-in{grid-template-columns:minmax(320px,560px);justify-content:center}
.lgg .gl .gtl{inset:0 0 30px}.lgg .gl .gtl0{inset:0!important}
.gcard{position:relative;width:220px;height:146px;border-radius:14px;flex:none;overflow:hidden;cursor:pointer;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.gcard:hover{transform:translateY(-4px);box-shadow:0 12px 26px -10px rgba(0,0,0,.35)}
.gcard .gtl .dlogo,.gcard .gtl>*{transform:scale(.85)}
.grun{will-change:transform;animation-timing-function:linear}
@media(max-width:700px){.gcard{width:170px;height:118px}}
.swm{text-align:center;font-size:10.5px;color:#9aa5a0;margin-top:6px}
/* tanda tangan */
.ttdw{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.ttdprev{width:200px;height:96px;flex:none;border:1px dashed #c9d3cd;border-radius:12px;display:grid;place-items:center;background:#fff repeating-conic-gradient(#f1f4f2 0 25%,#fff 0 50%) 0 0/16px 16px;overflow:hidden}
.ttdprev img{max-width:186px;max-height:84px;animation:fadeUp .5s both}.ttdprev span{display:flex;gap:6px;align-items:center;font-size:12px;color:var(--muted);background:#fff;padding:4px 8px;border-radius:8px}
.ttdi{flex:1;min-width:200px}
.surat .sline{display:flex;align-items:flex-end;justify-content:center}
.surat .sline img.ttdimg,.slipf .ttd img{max-height:52px;max-width:160px;display:block;margin:0 auto}
.slipf .ttd{display:flex;justify-content:flex-end}.slipf .ttd img{max-height:34px;margin:0}
.ttdlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px}
.ttdli{display:flex;gap:10px;align-items:center;text-align:left;font:inherit;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px;cursor:pointer;transition:border-color .2s,transform .2s}
.ttdli:hover{border-color:var(--brand2);transform:translateY(-1px)}.ttdli>span:nth-child(2){flex:1;min-width:0}.ttdli b{display:block;font-size:13px}.ttdli small{font-size:11.5px;color:var(--muted)}
.ttdth{width:84px;height:40px;flex:none;border-radius:8px;background:#f7f9f7;display:grid;place-items:center;overflow:hidden}.ttdth img{max-width:80px;max-height:36px}.ttdth em{font-size:10.5px;color:var(--muted)}
/* Setting › Tampilan & Galeri */
.tpg2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}.tpg2>.card{margin:0}
@media(max-width:900px){.tpg2{grid-template-columns:1fr}}
.tprow{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer}
.tprow:last-of-type{border-bottom:0}.tprow b{display:block;font-size:13.5px;font-weight:600}.tprow small{display:block;font-size:12px;color:var(--muted)}
.tpgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.tpit{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;transition:box-shadow .25s,transform .25s;animation:fadeUp .45s both}
.tpit:hover{box-shadow:0 12px 26px -16px rgba(23,63,43,.45);transform:translateY(-2px)}.tpit.off{opacity:.55}
.tpth{position:relative;height:140px;background-size:cover;background-position:center}
.tpcap{position:absolute;left:0;right:0;bottom:0;padding:18px 10px 8px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.65));line-height:1.25}.tpcap b{display:block;font-size:13px}.tpcap span{font-size:11px;opacity:.85}
.tpno{position:absolute;top:8px;left:8px;width:24px;height:24px;border-radius:8px;background:rgba(0,0,0,.55);color:#fff;font-size:12px;font-weight:700;display:grid;place-items:center}
.tpib{padding:10px 12px}.tpib>b{display:block;font-size:13.5px}.tpib>small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tpat{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0}.tpat span{font-size:10.5px;padding:2px 7px;border-radius:99px;background:#f1f3f2;color:#9aa5a0}.tpat span.on{background:var(--brandSoft);color:var(--brand);font-weight:600}
.tpia{display:flex;align-items:center;gap:6px}.tpia .btn{margin-left:auto}
.iconbtn.sm{width:28px;height:28px;font-size:14px}
.txl{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:10px}
.txr{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:6px;transition:opacity .25s,background .25s}
.txr.off{background:#f7f8f7}.txr.off .in{opacity:.5}
.txh{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.txh b{display:block;font-size:13.5px}.txh small{font-size:11.5px;color:var(--muted)}
.tpjen{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
.tpjen button{text-align:left;font:inherit;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.tpjen button b{display:block;font-size:13px}.tpjen button small{font-size:11.5px;color:var(--muted)}
.tpjen button.on{border-color:var(--brand2);box-shadow:0 0 0 3px var(--brandSoft)}
.rng{width:100%;accent-color:var(--brand2);margin:4px 0 6px}
.tpprev{background:linear-gradient(150deg,#0d2a1c,#174a32 55%,#1e6643);border-radius:16px;padding:12px}
.tpmos{height:300px!important;gap:8px!important}
.tpmos .wt:not(.t0) .gtc span,.tpmos .wt:not(.t0) .gtc small{display:none}.tpmos .wt:not(.t0) .gtl{inset:0 0 24px}.tpmos .wt:not(.t0) .gtl>*{transform:scale(.6)}.tpmos .gtbig{display:none}.tpmos .gtc{padding:6px 9px}
.tpmos .gtc b{font-size:12px!important}.tpmos .gtc span,.tpmos .gtc small{font-size:10px}.tpmos .gtbig svg{width:70px;height:70px}
.wmpage{position:relative;width:min(100%,300px);aspect-ratio:210/297;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 10px 30px -18px rgba(0,0,0,.4);padding:22px 20px;overflow:hidden;box-sizing:border-box}
.wmh{height:10px;width:60%;background:#dfe6e1;border-radius:3px;margin-bottom:16px}.wml{height:6px;background:#eef2ef;border-radius:3px;margin:9px 0}.wml.s{width:70%}
.wmpage i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-54deg);white-space:nowrap;font-style:normal;font-weight:800;font-size:22px;color:#1f5f3f}
.wmpage.kaki i{display:none}.wmpage em{position:absolute;left:0;right:0;bottom:6px;text-align:center;font-style:normal;font-size:8px;color:#9aa5a0}
.tpfull{position:fixed;inset:0;z-index:95;animation:fadeUp .4s both}.tpfull .wl{position:absolute}
.tpx{position:absolute;z-index:3;top:14px;right:14px;font:inherit;font-weight:600;background:#fff;border:0;border-radius:999px;padding:8px 14px;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.3)}
/* v24 */
#msgBtn[hidden]{display:none}
#msgBtn svg{transition:transform .3s cubic-bezier(.3,1.6,.5,1)}#msgBtn:hover svg{transform:rotate(-10deg) scale(1.1)}
#msgBtn.has svg{animation:msgWig 2.6s ease-in-out infinite}@keyframes msgWig{0%,86%,100%{transform:none}90%{transform:rotate(-12deg)}94%{transform:rotate(10deg)}}
#msgBtn.on{border-color:var(--brand2);color:var(--brand);background:var(--brandSoft)}
#pop .mpl{max-height:min(60vh,420px);overflow:auto}
.mpi{display:flex;gap:10px;align-items:flex-start;cursor:pointer}.mpi.un{background:#f5faf7}
.mpa{width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--brandSoft);color:var(--brand);font-weight:700;font-size:11.5px}
.mpa.ann{border-radius:10px;background:linear-gradient(135deg,#b07a14,#e8b54a);color:#fff}.mpa svg{width:16px;height:16px}
.mpt{display:flex;gap:6px;align-items:center}.mpt b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mpi.un .mpt b{font-weight:800}
.mpm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mpr{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:none}
.mpf{display:flex;border-top:1px solid var(--line)}.mpf .pf{flex:1;border-top:0}.mpnew{display:flex;gap:5px;align-items:center;justify-content:center;border-left:1px solid var(--line);color:var(--brand);font-weight:600}.mpnew svg{width:15px;height:15px}
/* v25 */
.camber{color:var(--amber)}.nowrap{white-space:nowrap}.mono2{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;font-weight:600;letter-spacing:-.2px}
.alert.s{background:#e3f4ea;color:#1d6a3f}
.prdintro{display:flex;gap:10px;align-items:flex-start;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:14px;font-size:13px}.prdintro p{margin:0}.prdintro svg{color:var(--brand2)}
.prdpan{border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:18px;background:#fff;animation:fadeUp .45s both}
.prdh{display:flex;align-items:center;gap:12px;margin-bottom:14px}.prdh b{font-size:17px}
.pflow{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;counter-reset:s;position:relative}
.pfs{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;font:inherit;background:linear-gradient(160deg,#fff,#f4f8f5);border:1px solid var(--line);border-radius:14px;padding:12px;cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s}
.pfs:hover:not([disabled]){transform:translateY(-3px);box-shadow:0 12px 24px -16px rgba(23,63,43,.5);border-color:var(--brand2)}
.pfs:not(:last-child):after{content:"›";position:absolute;right:-9px;top:50%;transform:translateY(-50%);z-index:1;width:16px;height:16px;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;font-size:12px;color:var(--brand2);line-height:14px;text-align:center}
.pfs.off,.pfs[disabled]{opacity:.55;cursor:default}
.pfn{position:absolute;top:8px;right:10px;font-size:11px;font-weight:800;color:#b9c4bd}
.pfi{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#1f5f3f,#3d9a69);color:#fff}.pfi svg{width:18px;height:18px}
.pfs:nth-child(2) .pfi{background:linear-gradient(135deg,#2b5fa8,#5b8fd6)}.pfs:nth-child(3) .pfi{background:linear-gradient(135deg,#b07a14,#e8b54a)}.pfs:nth-child(4) .pfi{background:linear-gradient(135deg,#7a4fb0,#a985d6)}.pfs:nth-child(5) .pfi{background:linear-gradient(135deg,#b2412f,#e07b62)}
.pfs b{font-size:13.5px}.pfs small{font-size:11.5px;color:var(--muted);line-height:1.35}
.pfx{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 12px}
.prk{margin-bottom:10px}.pal{margin:0 0 8px;align-items:center}.pal .btn{margin-left:auto;flex:none}
.prh{margin:16px 0 8px!important}
.kelgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.kelc{border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:var(--soft)}
.kelh{display:flex;gap:8px;align-items:center;margin-bottom:6px}.kelh>div{flex:1}.kelh b{display:block;font-size:13.5px}.kelh small{font-size:11px;color:var(--muted)}
.keli{width:30px;height:30px;border-radius:9px;display:grid;place-items:center}.keli svg{width:16px;height:16px}
.keli.c-amber{background:#fff3d6;color:#a86a00}.keli.c-blue{background:#e6eefa;color:#2b5fa8}.keli.c-green{background:#e3f4ea;color:#1d7a46}.keli.c-grey{background:#eceff0;color:#59645e}
.kelr{background:#fff;border-radius:10px;padding:8px 10px;margin-top:6px;cursor:pointer;transition:box-shadow .2s}.kelr:hover{box-shadow:0 6px 14px -10px rgba(0,0,0,.3)}
.kelrn{display:flex;justify-content:space-between;gap:8px;font-size:13px}.kelrn span{font-variant-numeric:tabular-nums;font-weight:700}
.kelrf{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:11.5px;color:var(--muted)}
tr.rover td{background:#fdf1ef}
.rtab td{vertical-align:top}.rtab .iconbtn.sm{display:inline-grid;margin-left:2px}
.rngrid{display:grid;gap:8px;margin:10px 0}.rnit{display:grid;grid-template-columns:1fr 110px 50px;gap:8px;align-items:center;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.rnit b{display:block;font-size:13px}.rnit small{font-size:11.5px;color:var(--muted)}.rnit em{font-style:normal;font-size:12px;color:var(--muted)}
.prsteps{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}.prsteps span{font-size:11.5px;padding:4px 9px;border-radius:99px;background:var(--soft);color:var(--muted);font-weight:600}.prsteps span.on{background:var(--brandSoft);color:var(--brand)}
input.pain{width:96px;text-align:right;padding:5px 8px}
.kirb{align-items:center;flex-wrap:wrap;margin-bottom:12px}.kirb .btn{flex:none}
.jjk{position:relative;padding-left:4px}.jjr{display:flex;gap:10px;align-items:flex-start;padding:6px 0;position:relative}
.jjr:not(:last-child):before{content:"";position:absolute;left:13px;top:30px;bottom:-6px;width:2px;background:var(--line)}
.jji{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--brandSoft);color:var(--brand);flex:none}.jji svg{width:14px;height:14px}
.rtbox{margin-top:4px}.rtf{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}.rtf input[data-xi]{flex:1;min-width:200px;font:inherit;font-size:13.5px;border:1px solid var(--line);border-radius:10px;padding:8px 12px}
.rtf .sel{max-width:190px}.rtdt{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}.rtdt .sel{max-width:150px}
.rtbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 0;border-top:1px solid var(--line)}
.rtselc{display:flex;gap:6px;align-items:center;font-size:13px;font-weight:600;color:var(--brand);background:var(--brandSoft);padding:4px 6px 4px 12px;border-radius:999px;animation:fadeUp .3s both}
.rtcb{width:30px}tr.rsel td{background:#f2f8f4}
.rtjn{display:inline-block;font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:99px;background:var(--soft);border:1px solid var(--line);white-space:nowrap}
.rtur{min-width:210px;max-width:340px}.rtab td:nth-child(2){white-space:nowrap}.rtab .mono2{font-size:11px}
.rtc{display:flex;gap:8px;align-items:flex-start}.rtc .cr{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.soh3 .seg.rtv{margin-left:auto;font-size:12px}.soh3{display:flex;align-items:center;gap:8px}
details.konsum{border:1px solid var(--line);border-radius:14px;padding:0 12px;margin-bottom:12px;background:var(--soft)}
details.konsum>summary{list-style:none;display:flex;align-items:center;gap:8px;padding:10px 0;cursor:pointer}details.konsum>summary::-webkit-details-marker{display:none}
details.konsum>summary svg:last-child{margin-left:auto;transition:transform .25s}details.konsum[open]>summary svg:last-child{transform:rotate(90deg)}
details.konsum[open]{padding-bottom:12px}
.tgm .c{text-align:center}.tgm td,.tgm th{padding:8px 10px}
.rowoff{opacity:.55}
.tgsl{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.tgsc{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff}
.tgsh{display:flex;gap:10px;align-items:center;margin-bottom:8px}.tgsh>div{flex:1}.tgsh b{display:block}.tgsh small{font-size:12px;color:var(--muted)}
.tgsh .avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#b07a14,#e8b54a);color:#fff;font-weight:700;font-size:12px}
.tgno{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:8px 0;border-top:1px dashed var(--line)}
.tgno>span:first-child{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.tgno>span:first-child svg{width:15px;height:15px;color:var(--muted)}.tgno small{color:var(--muted);font-size:11.5px;width:100%;padding-left:21px}
.hpg{margin-bottom:10px}.hpgh{display:flex;gap:8px;align-items:center;margin-bottom:4px}.hpgh b{font-size:13px}
@media(max-width:900px){.pflow{grid-template-columns:repeat(2,1fr)}.pfs:after{display:none}.prdh{flex-wrap:wrap}.rnit{grid-template-columns:1fr 90px}.rnit em{display:none}.rtf .sel{max-width:none;flex:1}}
/* v26 */
.c-teal{background:#dff3f1;color:#14736b}.c-purple{background:#efe7fa;color:#6a3fa8}
.jchips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.jchips button{font:inherit;font-size:12.5px;font-weight:600;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;cursor:pointer;color:var(--ink);transition:background .2s,border-color .2s,transform .2s}
.jchips button b{margin-left:4px;font-size:11px;opacity:.7}.jchips button:hover{transform:translateY(-1px)}
.jchips button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.jp7{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))!important}
.prdpan.jasa{border-color:#cfe8e5;background:linear-gradient(180deg,#f6fbfa,#fff 180px)}
.pflow.jf{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.pflow.jf .pfs:after{display:none}
.pflow.jf .pfs:nth-child(1) .pfi{background:linear-gradient(135deg,#14736b,#3fb3a7)}
.laygrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.layc{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;cursor:pointer;transition:transform .25s,box-shadow .25s;animation:fadeUp .45s both}
.layc:hover{transform:translateY(-2px);box-shadow:0 12px 24px -16px rgba(20,115,107,.5)}
.layh{display:flex;justify-content:space-between;gap:8px;align-items:center}.layh b{font-size:14px}
.laym{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0}.laym span{background:var(--soft);border-radius:9px;padding:6px 8px;font-size:11px;color:var(--muted)}.laym b{display:block;font-size:13px;color:var(--ink)}.laym em{font-style:normal;font-size:10.5px}
.layb{display:flex;flex-wrap:wrap;gap:4px}.layb span{font-size:11px;background:#eef6f5;color:#335;border-radius:99px;padding:2px 8px}.layb b{font-weight:600}
.jmgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.jmc{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff}.jmc.off{opacity:.55}
.jmh{display:flex;gap:8px;align-items:center}.jmh .small{flex:1}
/* v27 */
.pbdiv{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.pbdiv button{display:flex;align-items:center;gap:8px;font:inherit;font-weight:600;font-size:13.5px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 12px 6px 6px;cursor:pointer;transition:all .2s}
.pbdiv button.on{border-color:var(--brand2);box-shadow:0 0 0 3px var(--brandSoft);color:var(--brand)}.pbdiv .dlogo{border-radius:8px}
.pbgrid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:14px;margin-bottom:14px;align-items:start}.pbgrid>.card,.pbside>.card{margin:0}
.pbside{display:flex;flex-direction:column;gap:10px}.pbside .alert{margin:0}
.pbtool h2 .more{font-weight:500}
.pbprod{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;margin-bottom:6px}
.pbprod button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;font:inherit;background:var(--soft);border:2px solid transparent;border-radius:14px;padding:10px 12px;cursor:pointer;transition:all .2s}
.pbprod button:hover{transform:translateY(-2px);background:#fff;border-color:var(--line)}
.pbprod button.on{background:#fff;border-color:var(--brand2);box-shadow:0 8px 20px -14px rgba(31,95,63,.6)}
.pbprod b{font-size:13.5px}.pbprod small{font-size:11.5px;color:var(--muted)}.pbprod span{font-size:12px}
.pbin{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
#pbQ{font-size:20px;font-weight:700;padding:10px 12px}
.pbemp{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:26px 10px;border:2px dashed var(--line);border-radius:14px;color:var(--muted);font-size:13px}.pbemp svg{width:32px;height:32px;color:var(--brand2)}.pbemp b{color:var(--ink)}
.pbt td{vertical-align:middle}.pbbar{height:6px;border-radius:99px;background:#eef2ef;margin-top:4px;overflow:hidden;width:120px;margin-left:auto}.pbbar i{display:block;height:100%;background:linear-gradient(90deg,#2f7a54,#5fbf8c);border-radius:99px;transition:width .35s}.pbbar i.a{background:#e8b54a}.pbbar i.r{background:#d0533e}
.pbsum{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.pbsum span{flex:1;min-width:120px;background:var(--soft);border-radius:10px;padding:8px 10px;font-size:11.5px;color:var(--muted)}.pbsum b{display:block;font-size:14px;color:var(--ink)}
.pbaft{border:1px solid #cfe5d7;background:#f2f9f4;border-radius:12px;padding:10px 12px}.pbaft>b{font-size:13px}
.pbcap{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:8px}.pbcap>div{background:#fff;border-radius:10px;padding:8px 10px;border:1px solid var(--line)}.pbcap>div.on{border-color:var(--brand2)}
.pbcap span{display:block;font-size:12px;color:var(--muted)}.pbcap b{font-size:18px}.pbcap small{display:block;font-size:11px;color:var(--muted)}
.pbact{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}
.pbkel{margin-bottom:10px}.pbkel>.chip{margin-bottom:4px}
.pbbr{padding:6px 0;cursor:pointer}.pbbr>div:first-child{display:flex;justify-content:space-between;gap:8px;font-size:13px}.pbbr span{font-weight:700;font-variant-numeric:tabular-nums}.pbbr .spbar{margin:4px 0 0}
.pbmore{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.pbdet{border-top:1px solid var(--line);padding-top:8px;margin-top:8px}.pbdet summary{cursor:pointer;font-weight:600;font-size:13.5px;color:var(--brand);padding:4px 0}
@media(max-width:900px){.pbgrid{grid-template-columns:1fr}.pbin{grid-template-columns:1fr 1fr}.pbin>div:last-child{grid-column:1/-1}.pbbar{width:70px}}
/* v28 */
.opsl{display:flex;flex-direction:column;gap:2px}.opsl span{font-size:12.5px}.opsl b{font-variant-numeric:tabular-nums;margin-right:4px}
.opsmode{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}.opsmode label{cursor:pointer}.opsmode input{display:none}
.opsmode span{display:block;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff;transition:all .2s}.opsmode b{display:block;font-size:13.5px}.opsmode small{font-size:11.5px;color:var(--muted)}
.opsmode input:checked+span{border-color:var(--brand2);box-shadow:0 0 0 3px var(--brandSoft)}
.opsrows{display:flex;flex-direction:column;gap:6px}.opsr{display:grid;grid-template-columns:1.4fr 1fr auto 1fr auto;gap:6px;align-items:center}.opsr span{color:var(--muted)}
.mslist{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:12px}
.msc{border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px;transition:box-shadow .25s,transform .25s;animation:fadeUp .45s both}.msc:hover{box-shadow:0 14px 28px -18px rgba(23,63,43,.45);transform:translateY(-2px)}.msc.off{opacity:.55}
.msh{display:flex;gap:10px;align-items:center}.msn{flex:1;min-width:0}.msn b{display:block;font-size:15px}.msn span{font-size:12px;color:var(--muted)}
.msav{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,#1f5f3f,#3d9a69);color:#fff;font-weight:800;font-size:13px}.msav.p{background:linear-gradient(135deg,#2b5fa8,#5b8fd6)}
.msg{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0}.msg>div{background:var(--soft);border-radius:10px;padding:7px 10px;min-width:0}
.msg small{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}.msg b{display:block;font-size:13px}.msg span{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.msg>div:last-child{grid-column:1/-1}
.msf{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.msf .rm{margin-left:auto}
.mftg{display:flex;flex-direction:column;gap:6px}
.sattab .satg td{background:var(--soft);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--brand)}.sattab .satg .muted{font-weight:500}
.sattab code{background:var(--brandSoft);color:var(--brand);padding:2px 7px;border-radius:6px;font-weight:700;font-size:12px}
.pbcapc .pbcr{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line)}.pbcr b{display:block;font-size:13.5px}.pbcr span{font-size:11.5px;color:var(--muted)}
.pbcr strong{font-size:22px;font-variant-numeric:tabular-nums;line-height:1;text-align:right}.pbcr strong small{display:block;font-size:10.5px;font-weight:500;color:var(--muted)}
.sisac .sish{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:10px}.sish>div:first-child{flex:1;min-width:240px}
.sistot{text-align:right;padding:6px 12px;border-left:3px solid var(--brand2)}.sistot small{display:block;font-size:11px;color:var(--muted)}.sistot b{font-size:17px}
.sistab{font-size:13px}.sistab th{white-space:nowrap}.sistab td{padding-top:7px;padding-bottom:7px}
.sistab .sisg td{background:linear-gradient(90deg,var(--brandSoft),transparent);font-weight:700;font-size:12px;color:var(--brand);letter-spacing:.3px;text-transform:uppercase}.sistab .sisg span{font-weight:500;text-transform:none}
.sisbar{position:relative;height:4px;border-radius:99px;background:#eef2ef;margin-top:4px;width:90px;margin-left:auto}.sisbar i{display:block;height:100%;border-radius:99px;background:#3d9a69}.sisbar.c-amber i{background:#e8b54a}.sisbar.c-red i{background:#d0533e}.sisbar em{position:absolute;top:-2px;bottom:-2px;width:1.5px;background:#1b2520;opacity:.5}
.sistab tfoot td{border-top:2px solid var(--line);background:var(--soft)}
.dlb{display:flex;gap:6px;flex-wrap:wrap}
.tbl2{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}.tbl2 small{display:block;font-size:10.5px;color:var(--muted);margin-bottom:2px}
@media(max-width:900px){.mslist{grid-template-columns:1fr}.opsmode{grid-template-columns:1fr}.opsr{grid-template-columns:1fr 1fr auto 1fr auto}.sistot{text-align:left;border-left:0;padding:0}}
/* v29 */
.cpd{border:1px solid var(--line);border-radius:12px;margin-top:8px;background:#fff;transition:box-shadow .2s}.cpd[open]{box-shadow:0 10px 24px -18px rgba(23,63,43,.5);border-color:#cfe5d7}
.cpd>summary{list-style:none;display:flex;align-items:center;gap:10px;padding:10px 12px;cursor:pointer}.cpd>summary::-webkit-details-marker{display:none}
.cph{flex:1;min-width:0}.cph b{display:block;font-size:13.5px}.cph span{font-size:11.5px;color:var(--muted)}
.cpd strong{font-size:22px;line-height:1;text-align:right;font-variant-numeric:tabular-nums}.cpd strong small{display:block;font-size:10.5px;font-weight:500;color:var(--muted)}
.cpch{color:var(--muted);transition:transform .25s}.cpd[open] .cpch{transform:rotate(90deg)}
.cpb{padding:0 12px 12px}.cpt{width:100%;font-size:12.5px;border-collapse:collapse}.cpt th{font-size:10.5px;text-transform:uppercase;letter-spacing:.3px;color:var(--muted);text-align:left;padding:4px 4px;border-bottom:1px solid var(--line)}.cpt td{padding:5px 4px;border-bottom:1px solid #f0f3f1}
.cpt tr.lim td{background:#fff6e5}.cpt tr.lim td:first-child{font-weight:700}.cpt td:last-child{display:flex;align-items:center;gap:6px}.cpbar{flex:1;height:5px;border-radius:99px;background:#eef2ef;overflow:hidden;min-width:40px}.cpbar i{display:block;height:100%;background:#3d9a69;border-radius:99px}.cpt tr.lim .cpbar i{background:#e8b54a}
.cptg{margin-top:10px}.cptg label{font-size:12px;font-weight:600;display:block;margin-bottom:4px}.cptg .in{max-width:180px}
.cpok{display:flex;gap:8px;align-items:center;background:#ecf7f0;color:#1d6a3f;border-radius:10px;padding:8px 10px;margin-top:8px;font-size:12.5px}.cpok svg{width:16px;height:16px}
.cpkur{background:#fdf3f1;border:1px solid #f3cdc6;border-radius:10px;padding:8px 10px;margin-top:8px;font-size:12.5px}.cpkur>b{display:block;margin-bottom:4px;color:#9b3423}
.cpkur>div{display:grid;grid-template-columns:1fr auto auto;gap:8px;padding:3px 0;border-top:1px dashed #f0d4ce}.cpkur small{color:var(--muted);min-width:70px;text-align:right}.cpkt{font-weight:700}
.cpa{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.cppre{white-space:pre-wrap;font:inherit;font-size:13px;background:var(--soft);padding:10px;border-radius:10px}
.pntt td{vertical-align:middle}.pnto{display:flex;align-items:center;gap:8px}.pnto .dlogo{border-radius:7px}
.pnbar{height:6px;width:90px;border-radius:99px;background:#eef2ef;overflow:hidden;margin-bottom:2px}.pnbar i{display:block;height:100%;background:#3d9a69}
.pnsk{display:inline-block;min-width:46px;text-align:center;font-weight:800;font-size:12.5px;padding:3px 8px;border-radius:99px}.pnsk.g{background:#e3f4ea;color:#1d7a46}.pnsk.a{background:#fff3d6;color:#a86a00}.pnsk.r{background:#fdeeee;color:#b2412f}.pnsk.n{background:#f1f3f2;color:#9aa5a0}
.aulist{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}.auc{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;animation:fadeUp .45s both}
.auh{display:flex;align-items:center;gap:8px}.auh b{flex:1}.auh .dlogo{border-radius:8px}
.aui{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:10px 0 6px}.aui span{display:flex;gap:5px;align-items:center;font-size:12px;padding:4px 6px;border-radius:8px}.aui svg{width:14px;height:14px}.aui .ok{background:#ecf7f0;color:#1d6a3f}.aui .no{background:#fff6e5;color:#8a5a00}
.aur{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.aucek{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}.aucek>div{display:flex;gap:8px;align-items:center;padding:8px 10px;border-radius:10px;font-size:13px}.aucek>div span{flex:1}.aucek small{color:var(--muted)}.aucek .ok{background:#ecf7f0}.aucek .no{background:#fff6e5}.aucek svg{width:16px;height:16px}
/* v30 */
.pvbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0;padding:9px 18px;background:linear-gradient(90deg,#123d2a,#1d5b3f);color:#fff;font-size:13px;box-shadow:0 4px 14px rgba(0,0,0,.12)}
.pvbar[hidden]{display:none}.pvbar>svg{width:18px;height:18px;flex:none}.pvbar>span{flex:1;min-width:220px;line-height:1.45}.pvbar .pvro{display:block;font-size:11.5px;opacity:.8}
.pvbar .sel{max-width:240px;height:32px;font-size:12.5px;background:#fff}.pvbar .btn.p{background:#f3c75a;color:#2a2205;border-color:#f3c75a}
body.pvon .main{outline:3px solid #f3c75a;outline-offset:-3px}
.pvlist{max-height:300px;overflow:auto;padding:2px 0 6px}.pvg{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:8px 14px 2px}
.pvroles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.pvr{border:1px solid var(--line);border-radius:14px;padding:10px;background:#fbfcfb;display:flex;flex-direction:column;gap:6px}
.pvrh{display:flex;align-items:center;gap:8px}.pvrh b{flex:1;font-size:13.5px}.pvrh small{color:var(--muted);font-size:11px}
.pvi{width:28px;height:28px;border-radius:9px;background:#e3f4ea;color:#1d7a46;display:grid;place-items:center}.pvi svg{width:15px;height:15px}
.pvr button{all:unset;cursor:pointer;display:flex;flex-direction:column;padding:7px 9px;border-radius:9px;background:#fff;border:1px solid var(--line);transition:.15s}
.pvr button:hover{border-color:#3d9a69;background:#f1f8f4}.pvr button span{font-size:13px;font-weight:600}.pvr button small{font-size:11px;color:var(--muted)}
@media(max-width:700px){.pvbar{padding:8px 12px;position:static}.pvbar .pvro{display:none}.pvbar .sel{flex:1;max-width:none}}
/* v31 */
.lcard [hidden]{display:none!important}.lcard .tw table td{vertical-align:middle}
.lname{display:flex;align-items:center;gap:10px;min-width:0}.lname>div{min-width:0;display:flex;flex-direction:column}.lname b{font-weight:600}.lname small{font-size:11.5px;color:var(--muted)}.lname .dlogo{border-radius:8px;flex:none}
.msav.sm{width:32px;height:32px;border-radius:10px;font-size:11.5px}.msav.p{background:linear-gradient(135deg,#2b5fa8,#5b8fd6)}
.kode{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;font-weight:700;letter-spacing:.3px;padding:3px 8px;border-radius:7px;background:#eef5f0;color:#1d5b3c;border:1px solid #d5e8dc}
tr.rowoff td{opacity:.55}.msubnav .n{background:var(--line);border-radius:99px;padding:0 7px;font-size:11px;margin-left:2px}.msubnav button.on .n{background:rgba(255,255,255,.25)}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}@media(max-width:700px){.row3{grid-template-columns:1fr}}
.nstok{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 4px}.nstok button{border:1px dashed #b9d4c4;background:#f6faf7;border-radius:9px;padding:5px 9px;font-size:12px;color:var(--ink);display:inline-flex;gap:6px;align-items:center;cursor:pointer}.nstok button:hover{border-style:solid;border-color:#3d9a69;background:#eaf5ee}.nstok code{font-size:11px;font-weight:700;color:#1d5b3c}
.nsprev{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}.nsprev>div{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:linear-gradient(180deg,#fff,#f7faf8)}.nsprev small{display:block;font-size:11px;color:var(--muted);margin-bottom:3px}.nsprev b{font-size:13.5px;color:#123d2a;word-break:break-all}
.nsact{display:flex;gap:8px;justify-content:flex-end;margin-top:14px;flex-wrap:wrap}
.cfbox{display:flex;gap:12px;align-items:flex-start;padding:4px 0}.cfbox .cfi{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;flex:none;background:#e3f4ea;color:#1d7a46}.cfbox .cfi svg{width:22px;height:22px}.cfbox>div>b{font-size:14.5px;display:block;margin-bottom:4px}.cfbox p{margin:0;font-size:13px;line-height:1.5;color:#3f4a44}
.cfmeta{display:inline-flex;gap:6px;align-items:center;margin-top:8px;font-size:11.5px;color:var(--muted);background:#f3f6f4;border-radius:99px;padding:3px 10px}.cfmeta svg{width:13px;height:13px}
.cflist{margin-top:12px;border:1px solid var(--line);border-radius:12px;padding:8px 10px;max-height:220px;overflow:auto}.cflist>div{display:flex;gap:7px;align-items:flex-start;font-size:12.5px;padding:4px 0}.cflist svg{width:14px;height:14px;color:#1d7a46;flex:none;margin-top:2px}
.mcf{flex:1 1 100%;display:flex;gap:10px;align-items:center;background:#fff8e6;border:1px solid #f3d98c;border-radius:12px;padding:9px 12px;font-size:12.5px;color:#5c4400;animation:fadeUp .25s both}.mcf>svg{width:18px;height:18px;flex:none;color:#a86a00}.mcf span{flex:1}
#draftbar{position:fixed;left:0;right:0;margin:0 auto;bottom:18px;z-index:120;display:flex;align-items:center;gap:10px;background:#123d2a;color:#fff;border-radius:16px;padding:10px 12px 10px 14px;box-shadow:0 14px 40px rgba(10,40,25,.35);width:min(760px,calc(100vw - 24px));animation:fadeUp .3s both}
#draftbar[hidden],#mov.show~#draftbar{display:none}#draftbar .dbi{width:34px;height:34px;border-radius:10px;background:#f3c75a;color:#2a2205;display:grid;place-items:center;flex:none}#draftbar .dbi svg{width:17px;height:17px}
#draftbar .dbt{flex:1;min-width:0;display:flex;flex-direction:column}#draftbar .dbt b{font-size:13.5px}#draftbar .dbt small{font-size:11.5px;opacity:.75}#draftbar .btn.w{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}#draftbar .btn.p{background:#f3c75a;border-color:#f3c75a;color:#2a2205}
body.drafton .content{padding-bottom:96px}body.drafton #toast{bottom:96px}
@media(max-width:700px){#draftbar{bottom:72px;flex-wrap:wrap}#draftbar .dbt{flex:1 1 calc(100% - 50px)}#draftbar .btn{flex:1}}
/* v32 */
.kode.sm{font-size:10.5px;padding:1px 6px;margin-right:3px;vertical-align:1px}
.aktag{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:4px}.aktag .chip{font-size:10.5px;padding:1px 7px}
.akbox{border:1px solid var(--line);border-radius:14px;padding:12px;background:linear-gradient(180deg,#f7fbf8,#fff);margin-bottom:14px}.akh{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:6px}.akbox>b{font-size:14px}.akp{display:flex;flex-direction:column;gap:4px;margin-top:8px}.akp .dlink{justify-content:flex-start;text-align:left}
.kkper{display:flex;flex-wrap:wrap;gap:4px 10px}.kkper span{font-size:12px}.kkper code{font-size:10.5px;font-weight:700;color:#1d5b3c;background:#eef5f0;border-radius:5px;padding:1px 5px}
#spBox{margin-top:2px}
/* v33 */
.kflow{display:flex;gap:3px;margin-top:5px;flex-wrap:wrap}.kflow span{font-size:10px;padding:1px 7px;border-radius:99px;background:#eef1ef;color:#8a948e}.kflow span.ok{background:#e3f4ea;color:#1d7a46}.kflow span.now{background:#fff1d1;color:#8a5a00;font-weight:700}
.udocs{display:flex;flex-direction:column;gap:6px}.udoc{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:6px 8px;background:#fff}.udoc>div{flex:1;min-width:0;display:flex;flex-direction:column}.udoc b{font-size:12.5px}.udoc small{font-size:11px;color:var(--muted)}
.udt{all:unset;cursor:pointer;width:46px;height:46px;border-radius:9px;overflow:hidden;flex:none;background:#f1f5f2;display:grid;place-items:center}.udt img{width:100%;height:100%;object-fit:cover}.udi svg{width:20px;height:20px;color:#1d7a46}
.jplist{display:flex;flex-direction:column;gap:6px}.jplist .cbrow{align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:8px 10px}
.jpo{display:flex;flex-direction:column;gap:6px}.jpo>div{display:flex;gap:8px;align-items:flex-start}.jpo .chip{flex:none}
.kkrows{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}.kkr{display:flex;gap:8px;align-items:center}.kkr .in{width:110px;flex:none}.kkr span{font-size:13px}
.scanbox{position:relative;border-radius:14px;overflow:hidden;background:#0f2a1d;aspect-ratio:4/3;margin-bottom:10px}.scanbox video{width:100%;height:100%;object-fit:cover}.scfr{position:absolute;inset:18% 24%;border:3px solid #f3c75a;border-radius:16px;box-shadow:0 0 0 999px rgba(0,0,0,.35)}.scmsg{position:absolute;left:0;right:0;bottom:10px;text-align:center;color:#fff;font-size:12.5px;padding:0 14px}
.lblno{font-family:ui-monospace,Menlo,monospace;font-size:10px;font-weight:700;text-align:center;margin-top:3px}.lblno small{display:block;font-weight:500;font-size:9px;color:#666}
/* v34 */
.tvrow{display:flex;gap:10px;align-items:center;padding:8px 2px;border-bottom:1px solid var(--line)}.tvrow:last-child{border-bottom:0}.tvrow.click{cursor:pointer}.tvrow.click:hover{background:#f7faf8}
.tvd{width:42px;text-align:center;flex:none;border-radius:10px;background:#eef5f0;padding:4px 0}.tvd b{display:block;font-size:16px;color:#1d5b3c;line-height:1.1}.tvd small{font-size:10.5px;color:var(--muted)}
.tvm{flex:1;min-width:0;display:flex;flex-direction:column}.tvm b{font-size:13px;font-weight:600}.tvm small{font-size:11.5px;color:var(--muted)}
.tvdot{width:9px;height:9px;border-radius:50%;flex:none}.tvdot.c-red{background:#d64545}.tvdot.c-amber{background:#e0a21a}.tvdot.c-green{background:#3d9a69}
.tjad{border-collapse:separate;border-spacing:2px;width:100%;font-size:11.5px}.tjad th{font-size:11px;font-weight:700;text-align:center;color:var(--muted);padding:4px 2px;min-width:44px}.tjad th small{display:block;font-weight:500}.tjad th.td{color:#1d5b3c;background:#eef5f0;border-radius:6px}
.tjad td{background:#f6f8f7;border-radius:6px;height:34px;text-align:center;padding:2px}.tjad td:first-child{background:none;text-align:left;min-width:170px}.tjad td:first-child b{display:block;font-size:12px}.tjad td:first-child small{color:var(--muted);font-size:10.5px}
.tjc{background:#3d9a69!important;color:#fff;font-weight:600;cursor:pointer;font-size:10.5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:60px}.tjc.lu{background:#2b5fa8!important}.tjc.bad{background:#d64545!important}
.tjg td{background:none!important;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:left!important;height:auto;padding-top:8px}
.tjlg{display:flex;gap:6px;align-items:center;font-size:11.5px;color:var(--muted);margin-top:8px}.tjlg .tjc{display:inline-block;width:14px;height:14px;border-radius:4px;margin-left:8px}
.tftot{border:1px solid var(--line);border-radius:10px;padding:8px 12px;background:#f7faf8}.tftot b{display:block;font-size:16px;color:#123d2a}.tftot small{font-size:11.5px;color:var(--muted)}
.tvhero{margin-bottom:12px}.tvht{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:flex-start;margin-bottom:6px}
.tchk{display:flex;flex-direction:column;gap:6px}.tci{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:8px 10px}.tci.done{background:#f4faf6}.tci.done .tvm b{color:#1d7a46}
.trun{display:flex;flex-direction:column}.trr{display:flex;gap:12px;align-items:flex-start;padding:8px 0;border-bottom:1px dashed var(--line)}.trr>b{width:60px;flex:none;color:#1d5b3c;font-family:ui-monospace,Menlo,monospace}.trr>div{flex:1;display:flex;flex-direction:column}.trr small{font-size:11.5px;color:var(--muted)}
.trvra{flex-wrap:wrap}.trvra input{flex:1;min-width:120px}
/* v35 */
.kchips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.kchip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;border-radius:99px;padding:6px 8px 6px 12px;font-size:12.5px;font-weight:600;color:#3f4a44;cursor:pointer;transition:.15s}
.kchip i{width:8px;height:8px;border-radius:50%;display:inline-block}.kchip i.c-green{background:#3d9a69}.kchip i.c-teal{background:#14736b}.kchip i.c-amber{background:#e0a21a}.kchip i.c-red{background:#d64545}.kchip i.c-blue{background:#2b5fa8}.kchip i.c-grey{background:#9aa39e}
.kchip span{background:#eef1ef;border-radius:99px;padding:1px 8px;font-size:11px}.kchip.on{background:#1d5b3c;border-color:#1d5b3c;color:#fff}.kchip.on span{background:rgba(255,255,255,.22)}.kchip.on i{box-shadow:0 0 0 2px #fff}
.acw .acwh{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}.acwl{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.acwr{display:grid;grid-template-columns:minmax(180px,1.1fr) 2.2fr auto minmax(160px,1fr);gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:#fff}
.acwn{display:flex;flex-direction:column;min-width:0}.acwn b{font-size:13.5px}.acwn small{font-size:11.5px;color:var(--muted)}
.acwk{display:flex;gap:4px;flex-wrap:wrap}.acwk label{border:1px solid var(--line);border-radius:99px;padding:4px 10px;font-size:11.5px;cursor:pointer;color:#59645e;background:#fafbfa;transition:.12s}.acwk label input{display:none}
.acwk label.on.c-green{background:#e3f4ea;border-color:#3d9a69;color:#1d7a46;font-weight:700}.acwk label.on.c-teal{background:#dff3f1;border-color:#14736b;color:#14736b;font-weight:700}.acwk label.on.c-amber{background:#fff3d6;border-color:#e0a21a;color:#8a5a00;font-weight:700}.acwk label.on.c-red{background:#fde8e8;border-color:#d64545;color:#a12a2a;font-weight:700}.acwk label.on.c-blue{background:#e6eefa;border-color:#2b5fa8;color:#2b5fa8;font-weight:700}
.acwa{font-size:12px;display:flex;gap:6px;align-items:center;white-space:nowrap}.acwt{padding:7px 10px;font-size:12.5px}
.acwf{display:flex;gap:8px;justify-content:flex-end;align-items:center;flex-wrap:wrap;margin-top:12px}.acwf svg{width:14px;height:14px;vertical-align:-2px}
.iflag{margin-bottom:12px}.alert.ok{background:#eef8f2;border:1px solid #cfe9d9;color:#1d6b42}.ifr{padding:8px 0;border-bottom:1px solid var(--line)}.ifr:last-of-type{border:0}.ifh{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}.ifh b{font-size:13px}
.dstrip{display:flex;gap:3px;flex-wrap:wrap}.dstrip span{width:24px;height:22px;border-radius:6px;display:grid;place-items:center;font-size:10.5px;font-weight:600}.dstrip .ok{background:#e3f4ea;color:#1d7a46}.dstrip .no{background:#fde8e8;color:#a12a2a}
.iflg{display:flex;gap:6px;align-items:center;font-size:11.5px;color:var(--muted);margin-top:8px}.iflg span{width:12px;height:12px;border-radius:4px;margin-left:8px}.iflg .ok{background:#e3f4ea}.iflg .no{background:#fde8e8}
.dtj{display:flex;gap:6px}.dtj .in[type=time]{max-width:120px}
.sbus{display:inline-flex;flex-direction:column;gap:5px;padding:12px;border:2px solid #cfdcd4;border-radius:22px 22px 12px 12px;background:#f7faf8}
.sfront,.srow{display:flex;gap:5px;justify-content:center}.sfront{padding-bottom:8px;border-bottom:2px dashed #cfdcd4;margin-bottom:3px;justify-content:space-between}
.seat{width:72px;height:46px;border-radius:9px 9px 6px 6px;border:1px solid #d6e2db;background:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2px 4px;text-align:center;user-select:none}
.seat small{font-size:9px;color:#8a948e;line-height:1}.seat b{font-size:10.5px;font-weight:600;line-height:1.15;color:#1f2a24;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.seat.fill{background:#e3f4ea;border-color:#9fd0b4}.seat.crew{background:#123d2a;border-color:#123d2a}.seat.crew small{color:#b8d4c4}.seat.crew b{color:#fff}
.seat[data-seat]{cursor:pointer}.seat.over{outline:2px dashed #3d9a69}.seat.pick{outline:3px solid #f3c75a}.seat.drag{opacity:.4}.saisle{width:18px}
.smini .sbus{transform-origin:left top}.smini .seat{width:54px;height:36px}.smini .seat b{font-size:9px}.smini{overflow-x:auto;max-width:100%}
.sedit{display:grid;grid-template-columns:260px 1fr;gap:16px}.sright{overflow:auto;max-height:62vh;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.swait{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.swait span{background:#fff3d6;border:1px solid #f0d58a;border-radius:99px;padding:3px 9px;font-size:11.5px;cursor:grab}.swait span.pick{outline:2px solid #e0a21a}
.fak{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;font-size:13px}
.fakh{display:flex;gap:12px;align-items:center;background:linear-gradient(120deg,#123d2a,#1d5b3c);color:#fff;padding:14px 18px;border-bottom:4px solid #f3c75a}.fakh img{width:48px;height:48px;border-radius:50%;background:#fff;padding:3px}.fakh div{display:flex;flex-direction:column}.fakh b{font-size:13px;letter-spacing:.02em}.fakh span{font-size:12px;opacity:.9}.fakh small{font-size:10.5px;opacity:.75}
.fakt{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:16px 18px 6px}.fakt h3{margin:0;font-size:19px;letter-spacing:.02em;color:#123d2a}.fakst{border:2px solid;border-radius:8px;padding:5px 12px;font-weight:800;font-size:12px;letter-spacing:.06em;transform:rotate(-3deg)}.fakst.ok{color:#1d7a46}.fakst.dp{color:#2b5fa8}.fakst.no{color:#b37400}
.fakg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px 18px}.fakg>div{background:#f2f7f4;border-radius:10px;padding:9px 11px;display:flex;flex-direction:column;gap:2px}.fakg small{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.fakg b{font-size:13px}.fakg span{font-size:11.5px;color:#4b5650}
.faktab{width:calc(100% - 36px);margin:8px 18px;border-collapse:collapse}.faktab th{background:#1d5b3c;color:#fff;text-align:left;padding:8px 10px;font-size:11.5px}.faktab td{padding:10px;border-bottom:1px solid var(--line)}.faktab .num{text-align:right}
.fakb{display:grid;grid-template-columns:1fr 260px;gap:14px;padding:6px 18px 10px}.faknote{display:flex;flex-direction:column;gap:3px;font-size:11.5px;color:#4b5650}.faknote b{color:#1f2a24;font-size:12px}
.faktot>div{display:flex;justify-content:space-between;padding:5px 0;font-size:12.5px;color:#4b5650}.faktot>div b{color:#1f2a24}.faktot .big{border-top:2px solid #1d5b3c;margin-top:4px;padding-top:8px;font-size:14px}.faktot .big b{font-size:16px;color:#123d2a}
.fakttd{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:14px 18px 6px;text-align:center}.fakttd small{display:block;font-size:11.5px;color:var(--muted);margin-bottom:38px}.fakttd b{border-top:1px solid #aab4ae;padding-top:4px;display:inline-block;min-width:160px;font-size:12.5px}
.fakf{background:#123d2a;color:#cfe3d7;font-size:10.5px;text-align:center;padding:6px}
@media(max-width:700px){.acwr{grid-template-columns:1fr}.sedit{grid-template-columns:1fr}.fakg{grid-template-columns:1fr}.fakb{grid-template-columns:1fr}.fakt{flex-direction:column}.seat{width:60px;height:42px}}
/* v35 · tampilan ponsel */
@media(max-width:700px){
  .content{padding-left:12px!important;padding-right:12px!important}
  .head{gap:8px;margin-bottom:10px}.head>.grow{flex:1 1 100%;min-width:0}.head h1{font-size:20px;line-height:1.25;display:flex;align-items:center;flex-wrap:wrap;gap:4px}.head h1 .hico{margin-right:6px}.head .sub{font-size:12.5px;line-height:1.5;margin-top:4px}
  .head>.btn,.head>.dlb,.head>span:not(.grow){flex:1 1 calc(50% - 4px);justify-content:center;min-height:42px}.head>.dlb{display:flex;gap:8px}.head>.dlb .btn{flex:1;justify-content:center}.head>.btn.p{flex-basis:100%}
  .msubnav,.kchips,.card>.tabs,.rtf{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-left:-2px;margin-right:-2px;padding-bottom:4px}
  .msubnav::-webkit-scrollbar,.kchips::-webkit-scrollbar,.card>.tabs::-webkit-scrollbar{display:none}.msubnav button,.kchip,.card>.tabs button{flex:none;white-space:nowrap}
  .card{padding:14px;border-radius:16px}.card h2{font-size:14.5px;flex-wrap:wrap;gap:6px}.card h2 .more{margin-left:0;width:100%}
  .kpis{gap:8px}.kpi{padding:12px;border-radius:14px}.kpi .v{font-size:19px}.kpis>.kpi:last-child:nth-child(odd){grid-column:1/-1}
  .pbar{gap:8px;padding:10px 12px}.pbar .pacts{width:100%;display:flex;gap:8px}.pbar .pacts .btn{flex:1;justify-content:center}
  .filters{gap:8px}.filters>input{min-width:0!important;flex:1 1 100%!important}.filters>.sel{flex:1 1 calc(50% - 4px)}.filters>.btn{flex:1 1 auto;justify-content:center}
  .citem{padding:12px 4px}.mob .citem .ct{font-size:13.5px}
  .modal .mb{padding-left:16px;padding-right:16px}.modal .row2,.modal .row3{grid-template-columns:1fr!important}
  .drawer .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.drawer .actions .btn{justify-content:center}
  .topbar .ttl{max-width:34vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .dtj{flex-direction:row}.tvrow{padding:10px 2px}
}
@media(max-width:700px){.faktab th,.faktab td{padding:6px;font-size:11px}.fakh small{display:none}.fakt h3{font-size:16px}}
/* v36 */
.vbody{display:inline-flex;flex-direction:column;gap:6px;padding:10px 14px 8px;border:2px solid #b9cfc2;border-radius:34px 34px 14px 14px;background:linear-gradient(180deg,#f3f8f5,#fbfcfb);position:relative}
.vbody.big{border-radius:22px 22px 12px 12px}.vwind{align-self:stretch;text-align:center;font-size:9px;font-weight:800;letter-spacing:.2em;color:#7d9b8a;background:#e1ece6;border-radius:18px 18px 6px 6px;padding:3px 0;margin:-2px -6px 2px}
.vback{align-self:stretch;text-align:center;font-size:9px;font-weight:800;letter-spacing:.2em;color:#9aa8a0;border-top:2px dashed #d3e0d8;padding-top:4px;margin-top:2px}
.vdoor{position:absolute;left:-9px;top:62px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:9px;font-weight:700;color:#fff;background:#e0a21a;border-radius:6px;padding:6px 2px}
.vbody .sfront{display:flex;gap:5px;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:2px dashed #cfdcd4;margin-bottom:2px}.vbody .sgap{flex:1;min-width:6px}
.seat.drv{background:#123d2a;position:relative}.seat .wheel{position:absolute;right:4px;top:4px;width:12px;height:12px;border:2px solid #f3c75a;border-radius:50%}
.seat[data-st]{cursor:pointer}.seat[data-st]:hover{border-color:#3d9a69}
.pxtop{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}.pxtop label.btn{cursor:pointer}
.pxwrap{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}.pxdia{overflow:auto;max-height:64vh;padding:2px}.pxtab{max-height:64vh;overflow:auto;border:1px solid var(--line);border-radius:12px}
.pxt th{position:sticky;top:0;background:#f4f7f5;z-index:1}.pxt td{padding:4px 6px}.pxt .in{padding:6px 8px;font-size:12.5px;min-width:90px}.pxt td:nth-child(3) .in{min-width:170px}.pxn{display:inline-grid;place-items:center;width:28px;height:24px;border-radius:7px;background:#e3f4ea;color:#1d5b3c;font-size:12px}.pxt tr.rsel td{background:#fff8e6}
.jwk{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin-bottom:12px}.jwk>div{background:#f2f7f4;border-radius:12px;padding:10px 12px;display:flex;flex-direction:column}.jwk small{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.jwk b{font-size:16px;color:#123d2a}.jwk span{font-size:11.5px;color:#4b5650}
.rtab th.c{text-align:center}
.tpgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}.tpc{border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px;background:#fff}.tph{display:flex;justify-content:space-between;gap:6px;align-items:center}.tph b{font-size:13.5px}.tpc .smini{display:flex;justify-content:center}
.prog .st.s4 .dt{background:#14736b;box-shadow:0 0 0 1px #14736b}.prog .st.s4{color:#14736b}.prog .st.s4w .dt{background:#fff;box-shadow:0 0 0 2px #e0a21a}.prog .st.s4w{color:#a86a00}.prog{min-width:320px}
.pl.small{display:inline-flex;align-items:center;gap:6px}
@media(max-width:700px){.pxwrap{grid-template-columns:1fr}.pxdia{max-height:none}.vdoor{display:none}}
/* v37 */
.pxform{border:1px solid var(--line);border-radius:14px;padding:10px;background:#fbfcfb;margin-top:4px}.pxform .pxdia,.pxform .pxtab{max-height:52vh}
.pxt tr[draggable=true]{cursor:grab}.pxt tr.over td{background:#eaf5ee;box-shadow:inset 0 2px 0 #3d9a69}.pxmv{min-width:96px!important}
.pxinfo{border:1px solid #cfe3d7;background:#f4faf6;border-radius:12px;padding:12px;margin-bottom:10px;font-size:12.5px}.pxinfo p{margin:4px 0}.pxinfo .rtab{font-size:12px;background:#fff}
/* v38 */
.dlpv .dlh{display:flex;gap:10px;align-items:center;margin-bottom:10px}.dlpv .dli{width:40px;height:40px;border-radius:12px;background:#e3f4ea;color:#1d7a46;display:grid;place-items:center;flex:none}.dlpv .dlh b{display:block;font-size:14px;word-break:break-all}.dlpv .dlh small{color:var(--muted);font-size:11.5px}
.dlb2{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.dlb2 .btn{text-decoration:none}
.dlbody{background:#eef1ef;border-radius:12px;padding:10px;max-height:62vh;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:10px}.dlpg{background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.12);max-width:100%;height:auto}
.dlx{background:#fff;border-radius:8px;width:100%}.dlx table{border-collapse:collapse;font-size:12px}.dlx td{border:1px solid #e1e6e3;padding:4px 8px;white-space:nowrap}.dlpre{background:#fff;width:100%;margin:0;padding:10px;border-radius:8px;font-size:12px;overflow:auto}.dlif{width:100%;height:60vh;border:0;border-radius:8px;background:#fff}
/* v39 */
.seat.crew.tlr{background:#1d5b3c;border-color:#1d5b3c;color:#fff}.seat.crew.tlr small{color:#cfe6d8}
.pxtl{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;margin:0 0 10px;padding:10px;border:1px dashed var(--line,#d6ded9);border-radius:12px;background:var(--soft,#f6faf7)}
.pxtl label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600}.pxtl label span{display:flex;align-items:center;gap:6px}
.tjc.sv{background:repeating-linear-gradient(45deg,#fde7c2,#fde7c2 5px,#f9d79c 5px,#f9d79c 10px)!important;color:#7a4a00;font-size:10px;font-weight:700}
span.tjc.sv{display:inline-block;width:12px;height:12px;border-radius:3px;margin:0 4px 0 12px;vertical-align:middle}
.svcar h2{flex-wrap:wrap;gap:6px}.svsum{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--mut,#6b7a72);margin:0 0 10px}.svsum b{color:var(--ink,#1f2a24);font-weight:600}
.slt{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line,#e6ece8)}.slt:last-child{border-bottom:0}.slt .tvm{flex:1;min-width:0}.slt .tvm b{display:block}.slt .tvm small{color:var(--mut,#6b7a72)}
@media(max-width:640px){.slt{flex-wrap:wrap}.slt .btn{width:100%}}
/* v40 */
.dstrip button{width:28px;height:26px;border-radius:7px;display:grid;place-items:center;font-size:11px;font-weight:700;border:0;cursor:pointer;font-family:inherit;transition:transform .12s,box-shadow .12s}
.dstrip button:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,.12)}
.dstrip .lib,.iflg .lib{background:#e3ecfb;color:#2d559c}
.dstrip button.no{outline:1px dashed #e7a3a3}
.jfl .ifr{padding:10px 0;border-top:1px solid var(--line,#e6ece8)}.jfl .ifr:first-of-type{border-top:0}
tr.jhl td{background:#fff6d6!important;transition:background 1s}
tr.js-lib td{background:#f5f8fe}tr.js-no td{background:#fff7f7}
.ttdm{display:flex;flex-direction:column;gap:10px}.ttdr{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border:1px solid var(--line,#e2e8e4);border-radius:12px}
.ttdr>b{font-size:13px;font-weight:600}.ttdc{display:flex;flex-wrap:wrap;gap:6px}
.tgl2{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--line,#d6ded9);background:#fff;font:inherit;font-size:12px;cursor:pointer;color:#7a8a82}
.tgl2 svg{width:14px;height:14px}.tgl2.on{background:#e3f4ea;border-color:#9fd0b4;color:#1d5b3c;font-weight:600}
/* v41 */
.wl.lp{background:#f5f7f4;color:#1c2a22;scroll-behavior:smooth}
.lp-w{max-width:1180px;margin:0 auto;padding:0 28px;box-sizing:border-box}
.lp-nav{position:sticky;top:0;z-index:20;transition:background .25s,box-shadow .25s,color .25s;color:#fff}
.lp-nav.solid,.lp-nav.lpopen{background:rgba(13,42,28,.94);backdrop-filter:blur(10px);box-shadow:0 6px 24px rgba(0,0,0,.18)}
.lp-navin{display:flex;align-items:center;gap:18px;height:68px}
.lp-brand{display:flex;align-items:center;gap:10px;min-width:0}.lp-brand b{display:block;font-size:15.5px;letter-spacing:.2px}.lp-brand small{display:block;font-size:11.5px;opacity:.75;white-space:nowrap}
.lp-links{display:flex;gap:2px;margin-left:auto}.lp-links button,.lp-help{background:none;border:0;color:inherit;font:inherit;font-size:13.5px;font-weight:500;padding:8px 12px;border-radius:9px;cursor:pointer;opacity:.88}
.lp-links button:hover,.lp-help:hover{background:rgba(255,255,255,.1);opacity:1}
.lp-act{display:flex;align-items:center;gap:6px}.lp-help{display:flex;align-items:center;gap:6px}.lp-help svg{width:16px;height:16px}
.lpm{position:relative}.lpm-b{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px 0 11px;border-radius:9px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.lpm-b svg{width:14px;height:14px}.lpm-c svg{transform:rotate(90deg);width:12px;height:12px;transition:transform .2s}.lpm.open .lpm-c svg{transform:rotate(-90deg)}.lpm-b:hover{background:rgba(255,255,255,.16)}
.lpm-d{position:absolute;right:0;top:calc(100% + 8px);width:270px;background:#fff;color:#1c2a22;border-radius:14px;box-shadow:0 18px 48px rgba(10,30,20,.28);padding:6px;opacity:0;transform:translateY(-6px);pointer-events:none;transition:.18s;z-index:5}
.lpm.open .lpm-d{opacity:1;transform:none;pointer-events:auto}.lpm.up .lpm-d{top:auto;bottom:calc(100% + 8px);left:0;right:auto}
.lpm-d button{display:flex;gap:10px;align-items:center;width:100%;text-align:left;background:none;border:0;padding:10px;border-radius:10px;cursor:pointer;font:inherit}.lpm-d button:hover{background:#eef5f0}
.lpm-d b{display:block;font-size:13.5px}.lpm-d small{display:block;font-size:11.5px;color:#6b7a72}.lpm-i{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:#e3f1e8;color:#1d5b3c;flex:none}.lpm-i.s{background:#fdf1d6;color:#8a5a00}.lpm-i svg{width:17px;height:17px}
.lpm.up .lpm-b{background:#1d5b3c;border-color:#1d5b3c}
.lp-burger{display:none;background:none;border:0;color:inherit;padding:8px;border-radius:9px;cursor:pointer}.lp-burger svg{width:22px;height:22px}
.lp-sheet{display:none}
.lp-hero{position:relative;overflow:hidden;margin-top:-68px;padding:108px 0 34px;background:radial-gradient(1000px 520px at 8% -10%,#2a7a52 0%,transparent 60%),linear-gradient(150deg,#0d2a1c,#174a32 55%,#1e6643);color:#fff}
.lp-heroin{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:44px;align-items:center}
.lp-salam{font-size:14px;opacity:.85;margin:6px 0 10px}.lp-hero .wl-ar{font-size:26px}
.lp-h1{font-size:clamp(28px,3.6vw,44px);line-height:1.15;margin:0 0 14px;font-weight:700;letter-spacing:-.4px}.lp-h1 em{font-style:normal;color:#f3c75a}
.lp-lead{font-size:15.5px;line-height:1.65;opacity:.88;margin:0 0 20px;max-width:540px}
.lp-cta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}.lp-btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:11px;font:inherit;font-weight:600;font-size:14px;cursor:pointer;border:1px solid transparent}
.lp-btn svg{width:17px;height:17px}.lp-btn.p{background:#f3c75a;color:#1c2a22}.lp-btn.p:hover{background:#f6d277}.lp-btn.g{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}.lp-btn.g:hover{background:rgba(255,255,255,.1)}
.lp-gal .wl-mosaic{height:min(54vh,440px)}.lp-gal{display:flex;flex-direction:column;gap:10px;min-width:0}
.lp-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:34px;background:rgba(255,255,255,.14);border-radius:16px;overflow:hidden}
.lp-stats div{background:rgba(13,42,28,.55);padding:16px 18px}.lp-stats b{display:block;font-size:22px;font-weight:700}.lp-stats span{font-size:12.5px;opacity:.78}
.lp-sec{padding:64px 0}.lp-sec.alt{background:#fff}.lp-eb{font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#2f7a54;margin-bottom:6px}
.lp-h2{font-size:clamp(22px,2.6vw,30px);margin:0 0 18px;letter-spacing:-.3px;color:#14301f}
.lp-p{font-size:15px;line-height:1.75;color:#3d4c44;margin:0}.lp-narrow{max-width:760px;margin-bottom:24px}
.lp-2{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;align-items:start}
.lp-vm{display:grid;gap:14px}.lp-vm>div{background:#fff;border:1px solid #e1e9e3;border-radius:14px;padding:16px 18px}.lp-vm b{color:#1d5b3c;font-size:13px;text-transform:uppercase;letter-spacing:1px}.lp-vm p{margin:6px 0 0;line-height:1.6;color:#3d4c44}.lp-vm ol{margin:8px 0 0;padding-left:18px;line-height:1.7;color:#3d4c44;font-size:14px}
.lp-div{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.lp-dc{border:1px solid #e1e9e3;border-radius:16px;padding:20px;background:#f8fbf9}
.lp-dn{font-size:12px;font-weight:700;color:#b98a1c}.lp-dc b{display:block;font-size:17px;margin:4px 0 2px;color:#14301f}.lp-dc small{color:#6b7a72}.lp-dc ul{margin:12px 0 0;padding-left:16px;line-height:1.8;font-size:13.5px;color:#3d4c44}
.lp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}.lp-chips button{border:1px solid #d6e2da;background:#fff;border-radius:999px;padding:7px 14px;font:inherit;font-size:13px;cursor:pointer;color:#3d4c44}.lp-chips button.on{background:#1d5b3c;border-color:#1d5b3c;color:#fff}
.lp-og{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}.lp-oc{background:#fff;border:1px solid #e1e9e3;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px;transition:transform .2s,box-shadow .2s}
.lp-oc:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(20,48,31,.08)}.lp-oc[hidden]{display:none}.lp-oh{display:flex;gap:10px;align-items:center}.lp-oh b{display:block;font-size:15px;color:#14301f}.lp-oh small{color:#6b7a72;font-size:12px}
.lp-oi,.lp-li{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#e3f1e8;color:#1d5b3c;flex:none}.lp-oi svg,.lp-li svg{width:19px;height:19px}
.lp-oc p{margin:0;font-size:13.5px;line-height:1.6;color:#4a5a51}.lp-ou{display:flex;gap:6px}.lp-ou span{font-size:11.5px;padding:3px 9px;border-radius:999px;background:#f1f5f2;color:#3d4c44}
.lp-lg{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.lp-lc{border:1px solid #e1e9e3;border-radius:16px;padding:18px;background:#f8fbf9}.lp-lc b{display:block;margin:12px 0 6px;font-size:15.5px;color:#14301f}.lp-lc p{margin:0;font-size:13.5px;line-height:1.6;color:#4a5a51}
.lp-faq details{background:#fff;border:1px solid #e1e9e3;border-radius:12px;margin-bottom:8px}.lp-faq summary{list-style:none;cursor:pointer;padding:14px 16px;font-weight:600;font-size:14.5px;display:flex;justify-content:space-between;gap:10px;color:#14301f}
.lp-faq summary::-webkit-details-marker{display:none}.lp-faq summary span svg{width:16px;height:16px;transition:transform .2s}.lp-faq details[open] summary span svg{transform:rotate(45deg)}.lp-faq p{margin:0;padding:0 16px 14px;font-size:14px;line-height:1.65;color:#4a5a51}
.lp-guide{background:#14301f;color:#fff;border-radius:16px;padding:22px}.lp-guide>b{display:flex;gap:8px;align-items:center;font-size:15px}.lp-guide>b svg{width:18px;height:18px}.lp-guide ol{padding-left:18px;line-height:1.9;font-size:14px;opacity:.9;margin:12px 0 16px}
.lp-foot{background:#0d2a1c;color:#cfe0d5;padding:40px 0 18px}.lp-fin{display:grid;grid-template-columns:1fr 1.4fr auto;gap:28px;align-items:start}.lp-fb{display:flex;gap:10px;align-items:center}.lp-fb b{display:block;color:#fff}.lp-fb small{font-size:12px;opacity:.75}
.lp-fk{display:grid;gap:8px;font-size:13.5px}.lp-fk div{display:flex;gap:9px;align-items:flex-start}.lp-fk svg{width:16px;height:16px;flex:none;margin-top:2px;color:#f3c75a}
.lp-fl{display:flex;flex-direction:column;gap:4px;align-items:flex-start}.lp-fl button{background:none;border:0;color:#cfe0d5;font:inherit;font-size:13.5px;cursor:pointer;padding:3px 0}.lp-fl button:hover{color:#fff;text-decoration:underline}
.lp-copy{margin-top:26px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);font-size:12px;opacity:.6}
.lp-help span{display:none}
@media(max-width:900px){.lp-links{display:none}.lp-burger{display:block}.lp-heroin,.lp-2,.lp-fin{grid-template-columns:1fr}.lp-div,.lp-lg{grid-template-columns:1fr 1fr}.lp-stats{grid-template-columns:1fr 1fr}
 .lp-nav.lpopen .lp-sheet{display:flex;flex-direction:column;padding:6px 18px 16px}.lp-sheet>button{background:none;border:0;color:#fff;text-align:left;font:inherit;font-size:15px;padding:12px 4px;border-bottom:1px solid rgba(255,255,255,.08)}
 .lp-sheet-lg{display:grid;gap:8px;margin-top:12px}.lp-sheet-lg button{display:flex;gap:8px;align-items:center;justify-content:center;height:42px;border-radius:10px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff;font:inherit;font-weight:600}.lp-sheet-lg svg{width:16px;height:16px}}
@media(max-width:600px){.lp-w{padding:0 16px}.lp-navin{height:60px;gap:8px}.lp-brand small{display:none}.lp-hero{margin-top:-60px;padding:84px 0 24px}.lp-gal .wl-mosaic{height:240px}.lp-div,.lp-lg{grid-template-columns:1fr}.lp-sec{padding:44px 0}.lp-hero .wl-ar{font-size:21px}.lpm-d{width:250px}.lp-lead{font-size:14.5px}.lp-stats b{font-size:18px}}
.tpdesk{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--mut,#6b7a72);margin:-4px 0 14px}.tpdesk svg{width:16px;height:16px;flex:none;margin-top:1px}
.lpsws{display:flex;flex-wrap:wrap;gap:8px 18px;margin-bottom:10px}.lpsw{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer}
.lpe{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lpd{margin:12px 0;border:1px solid var(--line,#e1e9e3);border-radius:12px;padding:10px 12px}.lpd summary{cursor:pointer;font-weight:600;font-size:13.5px}.lpog{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;margin-top:6px}
@media(max-width:700px){.lpe,.lpog{grid-template-columns:1fr}}
.ksboard{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:12px;overflow-x:auto;padding-bottom:6px}
.kscol{background:var(--soft,#f3f6f4);border-radius:14px;padding:10px;min-height:160px;display:flex;flex-direction:column;gap:8px}.kscolh{display:flex;gap:8px;align-items:center;padding:2px 2px 4px}.kscolh>div{flex:1;min-width:0}.kscolh b{display:block;font-size:13px}.kscolh small{font-size:11px;color:var(--mut,#6b7a72)}
.ksn{width:22px;height:22px;border-radius:50%;background:#1d5b3c;color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;flex:none}
.kscard{background:#fff;border:1px solid var(--line,#e1e9e3);border-radius:12px;padding:10px;cursor:pointer;display:flex;flex-direction:column;gap:4px}.kscard:hover{border-color:#9fd0b4}.kscard.late{border-color:#f0b4b4;box-shadow:inset 3px 0 0 #d64545}
.ksct{display:flex;justify-content:space-between;gap:6px;align-items:flex-start}.ksct b{font-size:13.5px}.kscard>small{color:var(--mut,#6b7a72);font-size:11.5px}
.ksmeta{display:flex;justify-content:space-between;gap:6px;font-size:11.5px;color:var(--mut,#6b7a72);margin-top:2px}.ksmeta span{display:flex;gap:4px;align-items:center}.ksmeta svg{width:12px;height:12px}.ksmeta b{font-weight:600;color:#1d5b3c}.ksmeta b.bad,.cbad{color:#c03a3a!important}
.ksca{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.ksca .btn{flex:1}.ksempty{font-size:12px;color:var(--mut,#6b7a72);text-align:center;padding:18px 0}.ksbulk .btn{width:100%}
.ksbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#eef6f1;border:1px solid #d3e7da;border-radius:12px;padding:10px 12px;margin-bottom:12px;font-size:13px}.ksbar>svg{width:16px;height:16px}.ksbar span{flex:1}
.kstw{max-height:46vh;overflow:auto}.kstab{width:100%;border-collapse:collapse;min-width:760px}.kstab th{font-size:11.5px;text-align:left;color:var(--mut,#6b7a72);font-weight:600;padding:4px}.kstab td{padding:3px 4px}.kstab .in{height:36px}
.kstot{display:flex;justify-content:space-between;margin-top:12px;padding:12px 14px;border-radius:12px;background:#eef6f1;font-size:14px}
.ksflow{list-style:none;margin:0;padding:0;display:grid;gap:10px}.ksflow li{display:flex;gap:12px}.ksflow li>span{width:26px;height:26px;border-radius:50%;background:#1d5b3c;color:#fff;font-weight:700;font-size:12px;display:grid;place-items:center;flex:none}.ksflow p{margin:2px 0 0;font-size:13px;color:var(--mut,#6b7a72);line-height:1.55}
.kssec{font-size:11.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--mut,#6b7a72);margin:16px 0 8px}
.kstl>div{position:relative;padding:0 0 12px 20px;border-left:2px solid #d3e7da;margin-left:5px}.kstl>div:last-child{border-color:transparent}.kstl>div>span{position:absolute;left:-7px;top:2px;width:12px;height:12px;border-radius:50%;background:#1d5b3c;border:2px solid #fff}.kstl b{display:block;font-size:13px;font-weight:600}.kstl small{font-size:12px;color:var(--mut,#6b7a72)}
@media(max-width:700px){.ksboard{grid-template-columns:repeat(5,82vw);scroll-snap-type:x mandatory}.kscol{scroll-snap-align:start}}
/* v42 */
.pdbox{margin-top:12px;border:1px solid var(--line,#e1e9e3);border-radius:14px;padding:12px 14px;background:var(--soft,#f6faf7)}.pdh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}.pdh svg{width:16px;height:16px}
.pdc{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}.pdbt{display:flex;gap:6px;flex:none;margin-left:auto}.pdact{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;flex-wrap:wrap}
/* v43 */
.ksr2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}@media(max-width:900px){.ksr2{grid-template-columns:1fr}}
.snsum{display:flex;flex-wrap:wrap;gap:6px 16px;margin:6px 0 10px;font-size:13px}
.opgrid{display:grid;grid-template-columns:300px 1fr;gap:14px;align-items:start}@media(max-width:860px){.opgrid{grid-template-columns:1fr}}
.oplist{display:flex;flex-direction:column;gap:4px;padding:10px}.oplist>button{text-align:left;background:none;border:1px solid transparent;border-radius:10px;padding:9px 10px;cursor:pointer;font:inherit}.oplist>button b{display:block;font-size:13.5px;font-weight:600}.oplist>button small{font-size:11.5px;color:var(--mut,#6b7a72)}
.oplist>button:hover{background:var(--soft,#f3f6f4)}.oplist>button.on{background:#e3f1e8;border-color:#b9dcc6}.opnote{display:flex;gap:6px;padding:10px 6px 2px;line-height:1.5}.opnote svg{width:14px;height:14px;flex:none;margin-top:2px}
.opitems{display:flex;flex-direction:column;gap:6px}.opi{display:flex;gap:6px;align-items:center}.opi .in{flex:1;height:38px}.opi .btn{min-width:34px;justify-content:center}.opn{width:24px;text-align:center;font-size:12px;color:var(--mut,#6b7a72)}.opi.add{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line,#e1e9e3)}
.trjbar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center;margin:4px 0 12px}.trjchips{display:flex;flex-wrap:wrap;gap:6px}
.trjchips button{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line,#d6e2da);background:var(--card,#fff);border-radius:999px;padding:6px 12px;font:inherit;font-size:12.5px;cursor:pointer;color:inherit}
.trjchips button span{font-size:11px;background:var(--soft,#eef3f0);border-radius:999px;padding:1px 7px;font-weight:600}.trjchips button.on{background:#1d5b3c;border-color:#1d5b3c;color:#fff}.trjchips button.on span{background:rgba(255,255,255,.2)}
.trjchips button.bad{border-color:#f0b4b4;color:#b33}.trjchips button.bad.on{background:#c03a3a;border-color:#c03a3a;color:#fff}.trjr{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.trjd{width:44px;text-align:center;border-radius:10px;background:var(--soft,#eef3f0);padding:4px 0}.trjd b{display:block;font-size:17px;line-height:1.1}.trjd small{font-size:11px;color:var(--mut,#6b7a72)}
.trja{display:flex;justify-content:flex-end}.trja .btn{white-space:nowrap}tr.rowlate td:first-child{box-shadow:inset 3px 0 0 #d64545}
/* v44 */
.smtabs{display:flex;gap:6px;flex-wrap:wrap;margin:-4px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--line,#e1e9e3)}
.smtabs button{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line,#d6e2da);background:var(--card,#fff);color:inherit;border-radius:10px;padding:8px 13px;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.smtabs button svg{width:15px;height:15px;opacity:.75}.smtabs button:hover{background:var(--soft,#f1f6f3)}.smtabs button.on{background:#1d5b3c;border-color:#1d5b3c;color:#fff}.smtabs button.on svg{opacity:1}
.smtabs button .n{font-size:11px;background:#f3c75a;color:#1c2a22;border-radius:999px;padding:0 6px;font-weight:700}
@media(max-width:700px){.smtabs{flex-wrap:nowrap;overflow-x:auto;margin-left:-4px;margin-right:-4px;padding:0 4px 10px}.smtabs button{white-space:nowrap;flex:none}}
.stjrow{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line,#e6ece8)}.stjrow:last-child{border-bottom:0}.stjrow.bad b{color:#b33}

/* ===== Apps Script: status simpan, draf, unduhan ===== */
.lg-demo,.lbox .demo{display:none!important}
#rcStat{position:fixed;right:14px;bottom:14px;z-index:95;display:flex;align-items:center;gap:9px;max-width:min(460px,calc(100vw - 28px));background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 12px;box-shadow:0 8px 24px rgba(0,0,0,.14);font-size:13px}
#rcStat[hidden]{display:none}
#rcStat .rcd{width:9px;height:9px;border-radius:50%;flex:none;background:#999}
#rcStat.saving .rcd{background:#2b5fa8;animation:rcpul 1s infinite}#rcStat.queue .rcd{background:#a86a00;animation:rcpul 1s infinite}
#rcStat.ok .rcd{background:#1d7a46}#rcStat.err .rcd,#rcStat.warn .rcd{background:#b2412f}#rcStat.err{border-color:#e7b8ae;background:#fff7f5}
@keyframes rcpul{50%{opacity:.35}}
.rcb{border:1px solid var(--brand2);background:var(--brand);color:#fff;border-radius:8px;padding:5px 10px;font-size:12.5px;font-weight:600;white-space:nowrap;text-decoration:none}
.rcx{border:0;background:none;font-size:18px;line-height:1;color:var(--muted);padding:0 4px}
.rcdraf{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--amberSoft);color:#6b4a00;border-radius:10px;padding:9px 11px;margin:0 0 12px;font-size:13px}
.rcdraf span{flex:1 1 200px;display:flex;gap:6px;align-items:center}
.rcdl{position:fixed;left:50%;transform:translateX(-50%);bottom:64px;z-index:96;display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 12px;box-shadow:0 8px 24px rgba(0,0,0,.16);font-size:13px;max-width:calc(100vw - 24px)}
body.rc-busy #mok{opacity:.55;cursor:wait}
@media(max-width:700px){#rcStat{bottom:74px;right:10px;left:10px;max-width:none}}