:root{--ink:#0b1f16;--forest:#00573f;--forest-2:#0c8b5e;--gold:#c79a3b;--gold-light:#e8c874;--cream:#f6f2e7;--paper:#fcfaf5;--line:#0b1f161a;--line-light:#f6f2e724;--font-display:"Sora", sans-serif;--font-body:"Inter", sans-serif;--ease:cubic-bezier(.22, 1, .36, 1);--r-lg:20px;--r-md:14px;--r-sm:10px;--shadow-1:0 1px 2px #0b1f160f, 0 8px 24px -12px #0b1f162e;--shadow-2:0 2px 4px #0b1f1614, 0 18px 40px -16px #0b1f1647;--maxw:1180px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-body);color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased;line-height:1.55}h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.2}body:after{content:"";z-index:1;pointer-events:none;opacity:.035;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");position:fixed;inset:0}.app-shell{flex-direction:column;min-height:100vh;display:flex}.app-main{flex:1}.app-nav{z-index:50;-webkit-backdrop-filter:blur(14px)saturate(140%);border-bottom:1px solid var(--line-light);background:#0b1f16e0;position:sticky;top:0}.app-nav-inner{width:100%;max-width:var(--maxw);align-items:center;gap:14px;margin:0 auto;padding:12px 24px;display:flex}.brand{cursor:default;align-items:center;gap:12px;text-decoration:none;display:flex}.brand-logo{width:auto;height:40px}.brand-text{flex-direction:column;line-height:1.15;display:flex}.brand-text strong{font-family:var(--font-display);color:var(--gold-light);letter-spacing:.06em;font-size:.95rem}.brand-text small{color:#f6f2e7b3;font-size:.7rem}.page-hero{background:radial-gradient(1200px 500px at 85% -10%, #0c8b5e80, transparent 60%), radial-gradient(900px 420px at 5% 10%, #c79a3b59, transparent 55%), var(--ink);color:var(--cream);border-bottom:1px solid var(--line-light)}.page-hero-inner{width:100%;max-width:var(--maxw);margin:0 auto;padding:44px 24px}.page-hero h1{margin-bottom:10px;font-size:clamp(1.7rem,4vw,2.4rem)}.page-hero h1 .accent{color:var(--gold-light)}.page-hero p{color:#f6f2e7b8;max-width:64ch;font-size:.98rem}.section-shell{width:100%;max-width:var(--maxw);margin:0 auto;padding:40px 24px}.section-light{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.app-footer{background:var(--ink);color:#f6f2e7b3;border-top:1px solid var(--line-light)}.app-footer-inner{width:100%;max-width:var(--maxw);margin:0 auto;padding:28px 24px}.footer-note{color:#f6f2e773;font-size:.78rem}.panel-box{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-1);margin-bottom:20px;padding:24px}.panel-box h2{color:var(--forest);letter-spacing:.02em;margin-top:0;font-size:1.05rem}.panel-box .hint,.hint{color:#0b1f1699;font-size:13.5px;line-height:1.6}.panel-box code,.hint code{background:var(--cream);color:var(--forest);border-radius:6px;padding:1px 6px;font-size:12px;font-weight:600}.dropzone{border-radius:var(--r-lg);text-align:center;background:var(--paper);cursor:pointer;transition:border-color .25s var(--ease), background .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);border:2px dashed #0b1f1647;padding:34px 24px}.dropzone:hover{border-color:var(--forest-2);box-shadow:var(--shadow-1);background:#0c8b5e0a;transform:translateY(-2px)}.dropzone:active{transform:scale(.99)}.dropzone.is-drag{border-color:var(--gold);background:#c79a3b14}.dropzone.has-file{border-style:solid;border-color:var(--forest-2)}.dropzone input{display:none}.dropzone .icon{margin-bottom:10px;font-size:32px}.btn{font-family:var(--font-display);cursor:pointer;transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .3s var(--ease);border:0;border-radius:999px;align-items:center;gap:6px;padding:10px 18px;font-size:.85rem;font-weight:600;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.97)}.btn-primary{background:var(--forest);color:var(--cream);box-shadow:0 6px 18px -8px #0b1f1680}.btn-primary:hover{background:var(--forest-2)}.btn-secondary{background:var(--paper);color:var(--forest);border:1px solid var(--line);box-shadow:var(--shadow-1)}.btn-secondary:hover{border-color:var(--forest-2)}.btn-gold{background:var(--gold);color:var(--ink);box-shadow:0 6px 18px -8px #c79a3bb3}.btn-gold:hover{background:var(--gold-light)}.btn-row{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.validation-banner{border-radius:var(--r-sm);padding:10px 14px;font-size:13px;font-weight:600}.validation-ok{color:var(--forest);background:#0c8b5e1a;border:1px solid #0c8b5e59}.validation-warn{color:#8a6410;background:#c79a3b24;border:1px solid #c79a3b66}.date-chip-row{flex-wrap:wrap;gap:8px;display:flex}.date-chip{border:1px solid var(--forest-2);color:var(--forest);background:#0c8b5e14;border-radius:999px;align-items:center;gap:8px;padding:5px 8px 5px 12px;font-size:12.5px;font-weight:600;display:inline-flex}.date-chip-remove{color:var(--ink);cursor:pointer;background:#0b1f161a;border:none;border-radius:50%;width:18px;height:18px;font-size:13px;line-height:1}.date-chip-remove:hover{color:#fff;background:#a33c2c}.filter-bar{flex-wrap:wrap;align-items:flex-end;gap:18px;display:flex}.filter-field{flex-direction:column;gap:6px;min-width:220px;display:flex}.filter-field label{font-family:var(--font-display);color:var(--forest);letter-spacing:.06em;text-transform:uppercase;font-size:.7rem;font-weight:700}.filter-field select{appearance:none;border:1px solid var(--line);border-radius:var(--r-sm);background-color:var(--paper);color:var(--forest);font-family:var(--font-body);cursor:pointer;box-shadow:var(--shadow-1);transition:border-color .25s var(--ease), box-shadow .25s var(--ease);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230B1F16' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:12px;padding:10px 38px 10px 14px;font-size:.9rem;font-weight:600}.filter-field select:focus{border-color:var(--forest-2);outline:none;box-shadow:0 0 0 3px #0c8b5e2e}.dash-root{background:0 0;padding:0}.dash-header{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:22px;display:flex}.dash-logo{width:auto;height:64px}.dash-title-block{text-align:center;flex:1}.dash-title-block h1{letter-spacing:.02em;color:var(--forest);text-transform:uppercase;margin:0;font-size:clamp(1.3rem,2.4vw,1.7rem)}.dash-aging-pill{background:var(--forest);color:var(--cream);font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;border-radius:999px;margin-top:8px;padding:5px 18px;font-size:.68rem;font-weight:700;display:inline-block}.dash-period{color:#0b1f16a6;margin-top:6px;font-size:12px;font-weight:600}.dash-badge{background:var(--ink);color:var(--cream);text-align:center;border-radius:var(--r-md);border:1px solid var(--line-light);min-width:170px;box-shadow:var(--shadow-1);padding:10px 16px}.dash-badge .label{font-family:var(--font-display);letter-spacing:.12em;text-transform:uppercase;opacity:.7;font-size:.6rem}.dash-badge .value{font-family:var(--font-display);color:var(--gold-light);margin-top:2px;font-size:15px;font-weight:800}.dash-kpi-row{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:18px;display:grid}.dash-kpi-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);border-top:4px solid var(--forest);box-shadow:var(--shadow-1);padding:16px 18px}.dash-kpi-card .kpi-title{font-family:var(--font-display);color:#0b1f168c;letter-spacing:.08em;text-transform:uppercase;font-size:.68rem;font-weight:700}.dash-kpi-card .kpi-value{color:var(--forest);font-variant-numeric:tabular-nums;margin-top:6px;font-size:1.15rem;font-weight:800;line-height:1.25}.dash-kpi-card .kpi-sub{color:#0b1f168c;margin-top:4px;font-size:.72rem}.dash-panel-wide{width:100%;margin-bottom:18px}.dash-bottom-row{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px;display:grid}.dash-bottom-row-2{grid-template-columns:1fr 1fr}.dash-panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-1);overflow:hidden}.dash-panel-title{background:var(--forest);color:var(--cream);text-align:center;font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;padding:10px 12px;font-size:.8rem;font-weight:600}.dash-panel-body{padding:18px}.dash-table{border-collapse:collapse;background:var(--paper);width:100%;color:var(--ink);font-size:.82rem}.dash-table thead tr.top-row th{background:var(--forest);color:var(--cream);height:38px;font-family:var(--font-display);letter-spacing:.05em;text-transform:uppercase;text-align:center;border:1px solid var(--forest);padding:10px;font-size:.72rem;font-weight:600}.dash-table thead tr.sub-row th{background:var(--forest-2);color:var(--cream);text-align:center;border:1px solid #0b1f164d;padding:6px 10px;font-size:.7rem;font-weight:600}.dash-table thead tr.top-row th,.dash-table thead tr.sub-row th{z-index:2;position:sticky}.dash-table thead tr.top-row th{top:0}.dash-table thead tr.sub-row th{top:38px}.dash-table tbody td{text-align:right;border:1px solid var(--line);white-space:nowrap;background:var(--paper);font-variant-numeric:tabular-nums;padding:8px 10px}.dash-table tbody td.upc-name{text-align:left;color:var(--ink);white-space:normal;word-break:break-word;overflow-wrap:break-word;font-weight:600}.dash-table tbody tr:nth-child(2n) td{background:#f7f8f4}.dash-table tr.total-row td{background:var(--gold);color:var(--ink);border-color:#c79a3b99;font-weight:800}tr.cabang-row td{border-top:1.5px solid var(--forest-2);font-weight:700;background:#0c8b5e12!important}tr.outlet-nested-row td{background:var(--paper)}td.outlet-nested-name{font-size:11.5px;color:var(--ink)!important;padding-left:24px!important;font-weight:400!important}td.outlet-nested-name:before{content:"↳";color:#0b1f1680;margin-right:6px}.outlet-table-scroll{max-height:380px;overflow-y:auto}.dash-table-section{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-1);margin-top:4px;overflow:hidden}.dash-table-section-header{background:var(--cream);border-bottom:1px solid var(--line);padding:14px 18px}.table-mode-toggle{gap:18px;display:flex}.table-mode-toggle label{color:#0b1f168c;cursor:pointer;align-items:center;gap:6px;font-size:12.5px;font-weight:600;display:flex}.table-mode-toggle label.active{color:var(--forest)}.table-mode-toggle input{cursor:pointer;accent-color:var(--forest)}.sortable-th{cursor:pointer;-webkit-user-select:none;user-select:none}.sortable-th:hover{background:var(--forest-2)}.sort-indicator{opacity:.9;font-size:10px}.sort-indicator-inactive{opacity:.4}.detail-table-filters{flex-direction:column;gap:14px;display:flex}.detail-filters-row{flex-wrap:wrap;align-items:flex-end;gap:20px;display:flex}.detail-print-btn-row{display:flex}.filter-field-products{width:100%}.product-filter-actions{color:#0b1f1680;margin-left:8px;font-weight:400}.link-btn{color:var(--forest-2);cursor:pointer;background:0 0;border:none;padding:0;font-size:11.5px;font-weight:700;text-decoration:underline}.link-btn:hover{color:var(--forest)}.product-checklist{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);flex-wrap:wrap;gap:4px 14px;max-height:110px;padding:8px 10px;display:flex;overflow-y:auto}.product-checkbox{color:var(--ink);cursor:pointer;white-space:nowrap;align-items:center;gap:5px;font-size:12px;display:flex}.product-checkbox input{cursor:pointer;accent-color:var(--forest)}.detail-table td.delta-up{color:var(--forest-2);font-weight:700}.detail-table td.delta-down{color:#a33c2c;font-weight:700}.linechart-wrap{position:relative}.linechart-svg{width:100%;height:auto;display:block}.linechart-grid{stroke:var(--line);stroke-width:1px}.linechart-xlabel{fill:#0b1f168c;font-size:9.5px;font-family:var(--font-body)}.linechart-tooltip{background:var(--ink);color:var(--cream);border-radius:var(--r-sm);white-space:nowrap;pointer-events:none;box-shadow:var(--shadow-2);padding:8px 12px;font-size:11px;position:absolute;transform:translate(-50%,-120%)}.linechart-tooltip-label{opacity:.75;font-size:10px}.linechart-tooltip-value{font-variant-numeric:tabular-nums;font-weight:800}.chart-empty{color:#0b1f168c;text-align:center;padding:20px 0;font-size:12.5px}.toplist{flex-direction:column;gap:12px;display:flex}.toplist-row{grid-template-columns:1fr 2fr auto;align-items:center;gap:12px;display:grid}.toplist-label{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:11.5px;font-weight:500;overflow:hidden}.toplist-bar-track{background:var(--cream);height:10px;box-shadow:inset 0 0 0 1px var(--line);border-radius:999px;overflow:hidden}.toplist-bar-fill{height:100%;transition:width .6s var(--ease);border-radius:999px}.toplist-value{color:var(--forest);white-space:nowrap;font-variant-numeric:tabular-nums;font-size:11px;font-weight:700}@media (width<=768px){.dash-header{text-align:center;flex-direction:column;align-items:center}.dash-badge{order:-1;width:100%;min-width:0;margin-bottom:12px}.dash-bottom-row,.dash-bottom-row-2{grid-template-columns:1fr}.filter-field{flex:100%;min-width:0}.detail-filters-row{flex-direction:column;align-items:stretch}}@media (width<=480px){.panel-box{padding:16px}.app-nav-inner{padding:10px 14px}.brand-logo{height:32px}.brand-text strong{font-size:.82rem}.brand-text small{font-size:.62rem}.dash-logo{height:44px}.dash-title-block h1{font-size:1rem}.dash-aging-pill{padding:4px 12px;font-size:.6rem}.dash-badge{display:none}.dash-kpi-row{grid-template-columns:1fr;gap:10px}.dash-panel-body{padding:12px}.outlet-table-scroll{max-height:300px}.btn-row{flex-direction:column;align-items:stretch}.btn-row .btn{justify-content:center}.toplist-row{grid-template-columns:1fr auto}.toplist-label{white-space:normal}.filter-bar{gap:12px}}@page{size:legal landscape;margin:7mm}@media print{.no-print{display:none!important}body{color:#000;background:#fff}body:after{display:none!important}body *{visibility:hidden}#dash-print-area,#dash-print-area *{visibility:visible}#dash-print-area{width:100%;position:absolute;top:0;left:0}*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.dash-kpi-card,.dash-panel,.dash-table-section,.panel-box{box-shadow:none;background:#fff;border-color:#ddd}.dash-kpi-card{border-top:4px solid #00573f}.dash-panel-title,.dash-table thead tr.top-row th{color:#fff;background:#00573f}.dash-table thead tr.sub-row th{color:#fff;background:#0c8b5e}.dash-table tbody td{color:#000;background:#fff;border-color:#ddd}.dash-table tbody tr:nth-child(2n) td{background:#f6f2e7}.dash-table tbody td.upc-name{color:#000}.dash-table tr.total-row td{color:#000;background:#c79a3b;border-color:#b98a2c}tr.cabang-row td{background:#eef3ee!important}.dash-table-section-header{background:#f6f2e7;border-bottom:1px solid #ddd}.dash-badge{color:#f6f2e7;background:#0b1f16;border:1px solid #ddd}.dash-badge .value{color:#e8c874}.linechart-tooltip{color:#fff;background:#0b1f16}.chart-empty,.dash-period,.hint,.dash-kpi-card .kpi-title,.dash-kpi-card .kpi-sub{color:#000}.kpi-value{color:#00573f}.dash-panel,.dash-kpi-card{break-inside:avoid;page-break-inside:avoid}.print-page-break{break-before:page;page-break-before:always}.dash-table-section{break-inside:auto;page-break-inside:auto}.dash-table tr{break-inside:avoid;page-break-inside:avoid}.dash-table thead{display:table-header-group}.outlet-table-scroll{max-height:none!important;overflow:visible!important}.detail-table-filters,body.print-table-only .dash-header,body.print-table-only .dash-kpi-row,body.print-table-only .dash-bottom-row,body.print-table-only .dash-panel-wide{display:none!important}body.print-table-only .print-page-break{break-before:auto!important;page-break-before:auto!important}body.print-table-only .dash-root{padding-top:0}.dash-table{table-layout:fixed;width:100%;font-size:9px}.dash-table th,.dash-table td{white-space:normal;word-break:break-word;overflow-wrap:break-word;padding:4px 3px}.pivot-table{font-size:7.6px}.pivot-table th,.pivot-table td{padding:3px 2px}.pivot-table col.col-outlet,.pivot-table col.col-product{width:13%}.pivot-table col.col-bucket{width:7%}.pivot-table col.col-total{width:8.33%}.pivot-table th:nth-child(-n+2),.pivot-table td:nth-child(-n+2){white-space:normal;word-break:normal;overflow-wrap:break-word}.pivot-table th:nth-child(n+3),.pivot-table td:nth-child(n+3){white-space:normal;word-break:break-all;overflow-wrap:anywhere;text-align:center}.pivot-table .sub-row th{white-space:nowrap;word-break:normal;font-size:7.6px}}