:root{--rimba:#07332a;--zamrud:#0e6b4f;--zamrud-dark:#0a4f3a;--songket:#b9975b;--songket-soft:#d8c08d;--stempel:#1d4e6b;--merah:#a63a2e;--kertas:#f3f5f1;--panel:#fff;--ink:#16211b;--muted:#66736a;--rule:#dde3dc;--rule-dark:#c8d2c7;--focus:#e8b93e;--serif:"Fraunces",Georgia,"Times New Roman",serif;--sans:"Archivo","Segoe UI",system-ui,-apple-system,Arial,sans-serif}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{font-family:var(--sans);background:var(--kertas);color:var(--ink);margin:0;font-size:15.5px;line-height:1.5}.hidden{display:none!important}.muted{color:var(--muted)}.small-txt{font-size:13px}::selection{background:var(--songket-soft)}button,input,select,textarea{font:inherit}:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}input,select,textarea{border:1px solid var(--rule-dark);width:100%;color:var(--ink);background:#fff;border-radius:6px;margin-top:5px;padding:10px 12px}input:hover,select:hover,textarea:hover{border-color:var(--zamrud)}label{color:#2b3a31;font-size:13.5px;font-weight:600;display:block}.pass-wrap{align-items:stretch;gap:8px;display:flex}.pass-wrap input{flex:1;margin-top:0}.pass-wrap .btn{white-space:nowrap;margin-top:5px}h1,h2,h3{font-family:var(--serif);color:var(--rimba);margin:0 0 8px;font-weight:700;line-height:1.15}h2{font-size:25px}h3{font-size:19px}.songket{background:repeating-linear-gradient(45deg,var(--songket) 0 6px,var(--rimba) 6px 12px,var(--songket-soft) 12px 14px,var(--rimba) 14px 20px);height:8px}.login-screen{background:var(--panel);grid-template-columns:1.02fr 1fr;min-height:100dvh;display:grid}.login-brand{background:var(--rimba);color:#e9efe9;border-right:4px solid var(--songket);flex-direction:column;justify-content:space-between;gap:30px;padding:44px 42px;display:flex}.login-brand .app-logo{border-radius:18px;width:104px;height:104px}.login-brand h2{color:#fff;margin:18px 0 2px;font-size:34px}.login-brand p{color:#c3d4c6;margin:0}.login-brand .login-brand-sub{max-width:38ch;margin-top:16px;font-size:15px;line-height:1.6}.login-brand-foot{color:var(--songket-soft);border-top:1px solid #d8c08d59;padding-top:14px;font-size:13px}.login-panel{background:var(--panel);place-items:center;padding:32px 22px;display:grid}.login-form-wrap{width:100%;max-width:380px}.login-form-wrap h1{margin-bottom:6px;font-size:32px}.login-form-wrap form{gap:14px;margin-top:22px;display:grid}.login-row{justify-content:space-between;align-items:center;gap:10px;display:flex}.login-row .check{align-items:center;gap:8px;margin:0;font-size:14px;font-weight:500;display:flex}.login-row .check input{width:auto;margin:0}.link-btn{color:var(--stempel);cursor:pointer;background:0 0;border:0;padding:0;font-size:14px;font-weight:600}.link-btn:hover{text-decoration:underline}.login-noacct{color:var(--muted);margin-top:18px;font-size:13.5px}.login-card{background:var(--panel);border-top:8px solid var(--songket);border-radius:4px;width:100%;max-width:460px;padding:0 34px 30px}.eyebrow{color:var(--zamrud-dark);margin:0 0 6px;font-size:12.5px;font-weight:600}.hint{color:#43534a;border-left:3px solid var(--songket);background:#f0f3ee;padding:10px 12px;font-size:13px}.quick-logins{flex-wrap:wrap;gap:8px;margin-top:14px;display:flex}.brand-mark{background:var(--rimba);width:60px;height:60px;color:var(--songket-soft);font-family:var(--serif);border:1.5px solid var(--songket);border-radius:10px;place-items:center;font-size:32px;font-weight:700;display:grid}.brand-mark.small{width:42px;height:42px;font-size:21px}.app-logo{object-fit:cover;border:2px solid var(--songket);border-radius:16px;width:120px;height:120px}.app-logo.small{border-radius:9px;width:44px;height:44px}.app{min-height:100dvh;display:flex}.sidebar{background:var(--rimba);color:#e9efe9;z-index:30;flex-direction:column;flex:0 0 258px;width:258px;height:100dvh;display:flex;position:sticky;top:0}.sidebar:before{content:"";background:repeating-linear-gradient(45deg,var(--songket) 0 6px,var(--rimba) 6px 12px,var(--songket-soft) 12px 14px,var(--rimba) 14px 20px);height:8px;display:block}.side-brand{border-bottom:1px solid #d8c08d47;align-items:center;gap:11px;padding:16px 16px 14px;display:flex}.side-brand strong{font-family:var(--serif);letter-spacing:.01em;color:#fff;font-size:19px;line-height:1.1;display:block}.side-brand span{color:#b9cbbd;font-size:12px}#main-nav{flex-direction:column;flex:1;padding:10px;display:flex;overflow-y:auto}#main-nav button{text-align:left;color:#cfddd1;cursor:pointer;background:0 0;border:0;border-radius:4px;padding:10px 12px 10px 16px;font-size:14.5px;position:relative}#main-nav button:before{content:"";background:0 0;width:3px;position:absolute;top:9px;bottom:9px;left:0}#main-nav button:hover{color:#fff;background:#ffffff12}#main-nav button.active{color:#fff;background:#b9975b29;font-weight:700}#main-nav button.active:before{background:var(--songket)}.side-foot{color:#cfddd1;border-top:1px solid #d8c08d47;padding:13px 14px;font-size:12.5px}.side-foot b{color:#fff}.main{flex:1;width:100%;min-width:0;max-width:1440px;margin:0 auto;padding:20px 26px 56px}.topbar{border-bottom:2px solid var(--rimba);align-items:center;gap:14px;margin-bottom:20px;padding-bottom:14px;display:flex}.topbar h2{margin:0;font-size:26px}.topbar p{margin:2px 0 0;font-size:13px}.top-actions{align-items:center;gap:10px;margin-left:auto;display:flex}.user-chip{border:1px solid var(--rule-dark);border-left:3px solid var(--songket);background:#fff;border-radius:4px;padding:7px 11px;font-size:12.5px;font-weight:600}.icon-btn{border:1px solid var(--rule-dark);cursor:pointer;color:var(--rimba);background:#fff;border-radius:6px;padding:8px 11px;position:relative}.icon-btn:hover{border-color:var(--zamrud)}.badge{background:var(--merah);color:#fff;border-radius:99px;padding:1px 6px;font-size:11px;font-weight:700;position:absolute;top:-7px;right:-7px}.masthead{background:var(--rimba);color:#e9efe9;border-bottom:4px solid var(--songket);border-radius:4px;align-items:center;gap:16px;margin-bottom:18px;padding:18px 20px;display:flex}.masthead img{object-fit:cover;border:1.5px solid var(--songket);border-radius:10px;width:64px;height:64px}.masthead h3{color:#fff;margin:0 0 3px;font-size:22px}.masthead p{color:#c3d4c6;margin:0;font-size:13px}.masthead .mast-period{text-align:right;color:var(--songket-soft);white-space:nowrap;border-left:1px solid #d8c08d66;margin-left:auto;padding-left:16px;font-size:13px}.masthead .mast-period b{color:#fff;font-family:var(--serif);font-size:20px;display:block}.btn{border:1px solid var(--zamrud-dark);background:var(--zamrud);color:#fff;cursor:pointer;border-radius:6px;justify-content:center;align-items:center;gap:7px;min-height:42px;padding:10px 16px;font-size:14.5px;font-weight:600;display:inline-flex}.btn:hover{background:var(--zamrud-dark)}.btn:active{transform:translateY(1px)}.btn.gold{background:var(--songket);color:#241a05;border-color:#97793f}.btn.gold:hover{background:#a8874c}.btn.navy{background:var(--stempel);border-color:#173e56}.btn.navy:hover{background:#173e56}.btn.ghost{color:#fff;background:0 0;border-color:#fff6}.btn.outline{border:1.5px solid var(--songket);color:var(--songket-soft);background:0 0}.btn.danger{background:var(--merah);border-color:#843025}.btn.light{color:var(--rimba);border-color:var(--rule-dark);background:#eef2ec}.btn.light:hover{background:#e2e9df}.btn.sm{min-height:34px;padding:6px 10px;font-size:13px}.btn.full{width:100%}.btn:disabled{opacity:.45;cursor:not-allowed}.grid{gap:16px;display:grid}.grid.kpi{background:var(--panel);border:1px solid var(--rule-dark);border-top:3px solid var(--rimba);border-radius:4px;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:0;margin-bottom:2px;overflow:hidden}.grid.two{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}.grid.three{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.card{background:var(--panel);border:1px solid var(--rule-dark);border-radius:4px;padding:18px 20px}.card h3{border-bottom:1px solid var(--rule);margin-bottom:12px;padding-bottom:9px}#view>.card{margin-bottom:2px}.grid.kpi>.kpi{border:0;border-right:1px solid var(--rule);background:0 0;border-radius:0}.kpi{padding:16px 18px}.kpi:last-child{border-right:0}.kpi .label{color:var(--muted);font-size:13px;font-weight:600}.kpi .value{font-family:var(--serif);color:var(--rimba);font-variant-numeric:tabular-nums;margin:5px 0 3px;font-size:27px;font-weight:700}.kpi .sub{color:var(--muted);font-size:12.5px}.kpi.gold-card .value{color:#7d5f22}.kpi.navy-card .value{color:var(--stempel)}table{border-collapse:collapse;width:100%;font-size:14px}th,td{border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;padding:9px 10px}thead th,tbody th{color:var(--rimba)}th{border-bottom:1.5px solid var(--rule-dark);font-size:12.5px;font-weight:700}tbody tr:hover{background:#f7f9f5}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}.table-wrap{overflow-x:auto}#view .table-wrap table{min-width:1180px}.modal .table-wrap table{min-width:560px}.pill{color:var(--zamrud-dark);background:#e4ede4;border:1px solid #c9d8c8;border-radius:3px;padding:2px 9px;font-size:12px;font-weight:700;display:inline-block}.pill.gold{color:#7d5f22;background:#f6ecd3;border-color:#ddc88f}.pill.red{color:var(--merah);background:#f9e3df;border-color:#ecc0b8}.pill.blue{color:var(--stempel);background:#e0ebf2;border-color:#bcd2e0}.pill.grey{color:#555;background:#eee;border-color:#ddd}.toolbar{flex-wrap:wrap;align-items:end;gap:10px;margin-bottom:14px;display:flex}.toolbar .grow{flex:220px}.form-grid{grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px;display:grid}canvas.chart{width:100%;height:260px}.progress{background:#e6ece5;border-radius:99px;height:9px;overflow:hidden}.progress>i{background:var(--zamrud);height:100%;display:block}.modal-back{z-index:80;background:#071e179e;place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow-y:auto}.modal{border-top:5px solid var(--songket);background:#fff;border-radius:4px;width:100%;max-width:640px;max-height:92dvh;padding:22px;overflow-y:auto}.modal.wide{max-width:880px}.modal-head{justify-content:space-between;align-items:start;gap:12px;display:flex}#toast-root{z-index:99;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:18px;right:18px}.toast{background:var(--rimba);color:#fff;border-left:4px solid var(--songket);border-radius:4px;max-width:360px;padding:12px 15px;font-size:14px;box-shadow:0 10px 26px #00000047}.toast.err{background:#7c2d23;border-left-color:#e09a8d}.member-card{background:var(--rimba);color:#eef3ec;border:1px solid var(--songket);border-radius:6px;max-width:480px;padding:22px;position:relative;overflow:hidden}.member-card:after{content:"";background:repeating-linear-gradient(45deg,var(--songket) 0 6px,var(--rimba) 6px 12px,var(--songket-soft) 12px 14px,var(--rimba) 14px 20px);height:7px;position:absolute;bottom:0;left:0;right:0}.member-card h3{color:#fff;border:0;padding:0}.member-card .mc-num{letter-spacing:.12em;color:var(--songket-soft);font-weight:700;font-family:var(--serif)}.qr-box{border:1px solid var(--rule-dark);background:#fff;border-radius:6px;padding:9px;display:inline-block}.qr-box canvas,.qr-box img{width:120px!important;height:120px!important}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px;display:grid}.shop-item{border:1px solid var(--rule-dark);background:#fff;border-radius:4px;padding:13px}.shop-item b{font-size:14.5px;display:block}.shop-item:hover{border-color:var(--zamrud)}.sig-grid{text-align:center;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px;margin-top:28px;display:grid}.sig-box{padding-top:54px}.sig-name{font-weight:700;text-decoration:underline}.kop{text-align:center;border-bottom:3px double #000;margin-bottom:16px;padding-bottom:10px}.kop h3{color:#000;margin:2px}.print-only{display:none}.flow{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.flow .step{border:1px solid var(--rule-dark);background:#eef2ec;border-radius:3px;padding:7px 12px;font-size:13px;font-weight:600}.flow .step.done{background:var(--zamrud);color:#fff;border-color:var(--zamrud-dark)}.flow .step.now{background:var(--songket);color:#241a05;border-color:#97793f}.copyright{text-align:center;color:var(--muted);border-top:1px solid var(--rule);margin-top:26px;padding:22px 10px 4px;font-size:12.5px}.login-copy{color:var(--muted);text-align:left;border-top:0;margin-top:26px;padding-top:0;position:relative}@media (max-width:860px){.login-screen{grid-template-columns:1fr}.login-brand{border-right:0;border-bottom:4px solid var(--songket);padding:24px 22px}.login-brand .app-logo{border-radius:12px;width:64px;height:64px}.login-brand h2{margin-top:10px;font-size:24px}.login-brand-sub,.login-brand-foot{display:none}.login-panel{padding:26px 18px 34px}.sidebar{width:268px;transition:transform .25s;position:fixed;left:0;transform:translate(-105%)}.sidebar.open{transform:none;box-shadow:20px 0 50px #00000059}.main{padding:14px 14px 48px}.kpi .value{font-size:23px}.grid.kpi>.kpi{border-right:0;border-bottom:1px solid var(--rule)}.top-actions{flex-wrap:wrap}.user-chip{white-space:normal}.masthead{flex-wrap:wrap}.masthead .mast-period{text-align:left;border-left:0;margin-left:0;padding-left:0}.topbar h2{font-size:21px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}@media print{body>*{display:none!important}#print-area.print-only{color:#000;background:#fff;font-family:Times New Roman,serif;display:block!important}table{font-size:12px}th,td{border:1px solid #000;padding:6px}th{color:#000}}