:root{--color-primary: #cc785c;--color-primary-active: #a9583e;--color-primary-disabled: #e6dfd8;--color-accent-teal: #5db8a6;--color-accent-amber: #e8a55a;--color-canvas: #faf9f5;--color-surface-soft: #f5f0e8;--color-surface-card: #efe9de;--color-surface-cream-strong: #e8e0d2;--color-surface-dark: #181715;--color-surface-dark-elevated: #252320;--color-surface-dark-soft: #1f1e1b;--color-hairline: #e6dfd8;--color-hairline-soft: #ebe6df;--color-ink: #141413;--color-body-strong: #252523;--color-body: #3d3d3a;--color-muted: #6c6a64;--color-muted-soft: #8e8b82;--color-on-primary: #ffffff;--color-on-dark: #faf9f5;--color-on-dark-soft: #a09d96;--color-success: #5db872;--color-warning: #d4a017;--color-error: #c64545;--color-info: #5b8fbf;--ring-focus: 0 0 0 3px rgba(204, 120, 92, .15);--font-serif: "Cormorant Garamond", "Tiempos Headline", "Copernicus", Georgia, serif;--font-sans: "Inter", "StyreneB", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--fs-display-md: 36px;--lh-display-md: 1.15;--ls-display-md: -.5px;--fs-display-sm: 28px;--lh-display-sm: 1.2;--ls-display-sm: -.3px;--fs-title-lg: 22px;--lh-title-lg: 1.3;--fs-title-md: 18px;--lh-title-md: 1.4;--fs-title-sm: 16px;--lh-title-sm: 1.4;--fs-body-md: 16px;--lh-body-md: 1.55;--fs-body-sm: 14px;--lh-body-sm: 1.55;--fs-caption: 13px;--lh-caption: 1.4;--fs-caption-up: 12px;--ls-caption-up: 1.5px;--fs-code: 14px;--lh-code: 1.6;--fs-button: 14px;--lh-button: 1;--fs-nav: 14px;--lh-nav: 1.4;--space-xxs: 4px;--space-xs: 8px;--space-sm: 12px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-xxl: 48px;--space-section: 64px;--radius-xs: 4px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-pill: 9999px;--radius-full: 9999px;--shadow-dropdown: 0 4px 12px rgba(20, 20, 19, .08);--shadow-modal: 0 24px 48px -12px rgba(20, 20, 19, .18)}html,body{background:var(--color-canvas);color:var(--color-body);font-family:var(--font-sans);font-size:var(--fs-body-md);line-height:var(--lh-body-md);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,.h1,.display-md{font-family:var(--font-serif);font-size:var(--fs-display-md);font-weight:400;line-height:var(--lh-display-md);letter-spacing:var(--ls-display-md);color:var(--color-ink);margin:0}h2,.h2,.display-sm{font-family:var(--font-serif);font-size:var(--fs-display-sm);font-weight:400;line-height:var(--lh-display-sm);letter-spacing:var(--ls-display-sm);color:var(--color-ink);margin:0}h3,.title-lg{font-family:var(--font-sans);font-size:var(--fs-title-lg);font-weight:500;line-height:var(--lh-title-lg);color:var(--color-ink);margin:0}h4,.title-md{font-family:var(--font-sans);font-size:var(--fs-title-md);font-weight:500;line-height:var(--lh-title-md);color:var(--color-ink);margin:0}h5,.title-sm{font-family:var(--font-sans);font-size:var(--fs-title-sm);font-weight:500;line-height:var(--lh-title-sm);color:var(--color-ink);margin:0}p,.body-md{font-family:var(--font-sans);font-size:var(--fs-body-md);font-weight:400;line-height:var(--lh-body-md);color:var(--color-body)}.body-sm{font-family:var(--font-sans);font-size:var(--fs-body-sm);font-weight:400;line-height:var(--lh-body-sm);color:var(--color-body)}.caption{font-family:var(--font-sans);font-size:var(--fs-caption);font-weight:500;line-height:var(--lh-caption);color:var(--color-muted)}.caption-up,.eyebrow{font-family:var(--font-sans);font-size:var(--fs-caption-up);font-weight:500;letter-spacing:var(--ls-caption-up);text-transform:uppercase;color:var(--color-muted)}code,.code,pre{font-family:var(--font-mono);font-size:var(--fs-code);line-height:var(--lh-code)}.muted-soft{color:var(--color-muted-soft)}.ink{color:var(--color-ink)}.body-strong{color:var(--color-body-strong)}.focus-ring:focus-visible{outline:none;border-color:var(--color-primary);box-shadow:var(--ring-focus)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--color-canvas);color:var(--color-body);font-family:var(--font-sans);font-size:14px;min-height:100vh}button{font-family:inherit;cursor:pointer}button:disabled{cursor:not-allowed}input,select,textarea{font-family:inherit;font-size:inherit;color:var(--color-ink)}input::placeholder,textarea::placeholder{color:var(--color-muted-soft)}a{color:var(--color-primary);text-decoration:none}a:hover{color:var(--color-primary-active);text-decoration:underline}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-hairline);border-radius:8px;border:2px solid var(--color-canvas)}::-webkit-scrollbar-thumb:hover{background:var(--color-muted-soft)}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.flex-1{flex:1}.flex-col{flex-direction:column}.w-full{width:100%}.text-right{text-align:right}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 20px;border-radius:8px;font-family:var(--font-sans);font-weight:500;font-size:14px;line-height:1;border:1px solid transparent;transition:background .12s ease,color .12s ease,transform 50ms ease;white-space:nowrap}.btn:active:not(:disabled){transform:scale(.98)}.btn:focus-visible{outline:none;box-shadow:var(--ring-focus)}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-active)}.btn-primary:disabled{background:var(--color-primary-disabled);color:var(--color-muted)}.btn-secondary{background:var(--color-canvas);color:var(--color-ink);border-color:var(--color-hairline)}.btn-secondary:hover:not(:disabled){background:var(--color-surface-soft)}.btn-danger{background:var(--color-error);color:#fff}.btn-danger:hover:not(:disabled){background:#a53636}.btn-danger-outline{background:var(--color-canvas);color:var(--color-error);border-color:var(--color-error)}.btn-danger-outline:hover:not(:disabled){background:#fdf3f3}.btn-ghost{background:transparent;color:var(--color-primary);border:none}.btn-ghost:hover:not(:disabled){color:var(--color-primary-active)}.btn-sm{height:32px;padding:0 12px;font-size:13px}.btn-icon{width:36px;height:36px;padding:0;border-radius:9999px;background:var(--color-canvas);color:var(--color-body);border:1px solid var(--color-hairline)}.btn-icon:hover:not(:disabled){background:var(--color-surface-soft);color:var(--color-ink)}.field-label{display:block;font-size:13px;font-weight:500;color:var(--color-ink);margin-bottom:6px}.input,.select{display:block;width:100%;height:40px;padding:0 14px;background:var(--color-canvas);border:1px solid var(--color-hairline);border-radius:8px;font-size:14px;color:var(--color-ink);outline:none;transition:border .12s ease,box-shadow .12s ease}.input:focus,.select:focus{border-color:var(--color-primary);box-shadow:var(--ring-focus)}.input-error{border-color:var(--color-error)}.card{background:var(--color-surface-card);border:1px solid var(--color-hairline);border-radius:12px;padding:24px}.card-canvas{background:var(--color-canvas);border:1px solid var(--color-hairline);border-radius:12px;padding:24px}.well{background:var(--color-canvas);border-radius:8px;padding:14px 16px}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:9999px;font-size:12px;font-weight:500;line-height:1.4}.badge-dot{width:5px;height:5px;border-radius:9999px}.badge-success{background:#5db87229;color:#3f8a4f}.badge-success .badge-dot{background:#3f8a4f}.badge-warning{background:#d4a01729;color:#8f6d11}.badge-warning .badge-dot{background:#8f6d11}.badge-error{background:#c6454524;color:#9b3838}.badge-error .badge-dot{background:#9b3838}.badge-info{background:#5b8fbf29;color:#3f6f96}.badge-info .badge-dot{background:#3f6f96}.badge-default{background:var(--color-surface-card);color:var(--color-body)}.badge-default .badge-dot{background:var(--color-muted)}.role-pill{display:inline-flex;align-items:center;padding:3px 12px;background:var(--color-surface-cream-strong);color:var(--color-ink);border-radius:9999px;font-size:12px;font-weight:500}.dt{width:100%;border:1px solid var(--color-hairline);border-radius:12px;overflow:hidden;background:var(--color-canvas)}.dt-head{background:var(--color-surface-card);padding:12px 16px;font-size:13px;font-weight:500;color:var(--color-body);display:grid}.dt-row{padding:14px 16px;font-size:14px;color:var(--color-body-strong);display:grid;align-items:center;border-bottom:1px solid var(--color-hairline-soft);transition:background .1s ease;cursor:pointer}.dt-row:last-child{border-bottom:none}.dt-row:hover{background:var(--color-surface-soft)}.dt-row.selected{background:var(--color-surface-cream-strong)}.dt-name{font-weight:500;color:var(--color-ink)}.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;background:var(--color-surface-card);color:var(--color-ink);border:1px solid var(--color-hairline);font-weight:500;flex-shrink:0}.sb{width:240px;flex-shrink:0;background:var(--color-canvas);border-right:1px solid var(--color-hairline);height:100vh;position:sticky;top:0;display:flex;flex-direction:column}.sb-section-label{font-size:11px;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;color:var(--color-muted);padding:16px 20px 6px}.sb-item{display:flex;align-items:center;gap:10px;padding:9px 12px;margin:0 12px;border-radius:8px;font-size:14px;font-weight:500;color:var(--color-muted);cursor:pointer;transition:background .12s ease,color .12s ease;position:relative;text-decoration:none}.sb-item:hover{background:var(--color-surface-soft);color:var(--color-ink)}.sb-item.active{background:var(--color-surface-card);color:var(--color-ink)}.sb-item.active:before{content:"";position:absolute;left:-12px;top:6px;bottom:6px;width:3px;background:var(--color-primary);border-radius:0 3px 3px 0}.tb{height:64px;background:var(--color-canvas);border-bottom:1px solid var(--color-hairline);padding:0 32px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#14141380;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .15s ease-out}.modal{background:var(--color-canvas);border-radius:16px;padding:28px;width:480px;max-width:calc(100vw - 48px);max-height:calc(100vh - 48px);overflow:auto;box-shadow:0 24px 48px -12px #1414132e;animation:modalIn .15s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.detail-panel{position:fixed;right:0;top:64px;bottom:0;width:480px;background:var(--color-canvas);border-left:1px solid var(--color-hairline);z-index:50;animation:slideIn .2s ease-out;display:flex;flex-direction:column}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.detail-panel-header{padding:20px 24px;border-bottom:1px solid var(--color-hairline);display:flex;align-items:center;justify-content:space-between}.detail-panel-body{flex:1;overflow:auto;padding:24px}.detail-panel-footer{padding:16px 24px;border-top:1px solid var(--color-hairline);display:flex;justify-content:flex-end;gap:12px}.code-block{background:var(--color-surface-dark);color:var(--color-on-dark);padding:20px;border-radius:12px;font-family:var(--font-mono);font-size:14px;line-height:1.6;position:relative;overflow-x:auto}.code-block .copy-btn{position:absolute;top:10px;right:10px;width:30px;height:30px;background:var(--color-surface-dark-elevated);border:1px solid #2a2724;border-radius:6px;color:var(--color-on-dark-soft);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.code-block .copy-btn:hover{color:var(--color-on-dark)}.code-key{color:var(--color-accent-teal)}.code-bool,.code-num{color:var(--color-accent-amber)}.code-comment{color:var(--color-on-dark-soft)}.h1{font-family:var(--font-serif);font-weight:400;font-size:36px;line-height:1.15;letter-spacing:-.5px;color:var(--color-ink);margin:0}.h2{font-family:var(--font-serif);font-weight:400;font-size:28px;line-height:1.2;letter-spacing:-.3px;color:var(--color-ink);margin:0}.section-title{font-size:18px;font-weight:500;color:var(--color-ink);margin:0}.muted{color:var(--color-muted)}.mono{font-family:var(--font-mono)}.warning-banner{background:#d4a0171a;border:1px solid rgba(212,160,23,.4);color:#6b4f0d;border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:12px}.warning-banner .head{display:flex;align-items:center;gap:8px;font-weight:600;font-size:14px}#root{min-height:100vh}.erp-main{flex:1;min-width:0;display:flex;flex-direction:column}.erp-content{flex:1;padding:28px 36px 64px;width:100%;max-width:1320px}.density-compact .dt-row,.density-compact .dt-head{padding-top:9px;padding-bottom:9px}.density-compact .erp-content{padding-top:20px}.sb-role{margin:10px 12px 4px;padding:8px 12px;background:var(--color-surface-card);border:1px solid var(--color-hairline);border-radius:10px;display:flex;align-items:center;gap:8px}.sb-wordmark-sub{font-size:11px;color:var(--color-muted);margin-top:2px}.metric-grid{display:grid;gap:14px}.metric{background:var(--color-canvas);border:1px solid var(--color-hairline);border-radius:var(--radius-lg);padding:18px 18px 16px;position:relative}.metric .label{font-size:11px;color:var(--color-muted);font-weight:500;letter-spacing:1px;text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;gap:6px}.metric .value{font-family:var(--font-serif);font-size:34px;line-height:1;letter-spacing:-.5px;color:var(--color-ink)}.metric .value.mono-val{font-family:var(--font-mono);font-size:26px;letter-spacing:0}.metric .sub{font-size:12px;margin-top:8px;color:var(--color-muted)}.metric .up{color:var(--color-success)}.metric .down{color:var(--color-error)}.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.sec-head .title{font-size:18px;font-weight:500;color:var(--color-ink)}.sec-head .eyebrow{display:block}.panel{background:var(--color-surface-card);border:1px solid var(--color-hairline);border-radius:var(--radius-lg);overflow:hidden}.panel-head{padding:16px 20px;border-bottom:1px solid var(--color-hairline);display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-head .title{font-size:15px;font-weight:500;color:var(--color-ink)}.panel-body{padding:8px 0}.panel-body.pad{padding:20px}.lrow{display:grid;align-items:center;padding:12px 20px;border-bottom:1px solid var(--color-hairline-soft);font-size:13px}.lrow:last-child{border-bottom:none}.lrow.click{cursor:pointer;transition:background .1s ease}.lrow.click:hover{background:var(--color-surface-soft)}.chip{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:var(--radius-pill);font-size:11.5px;font-weight:500;white-space:nowrap;border:1px solid transparent}.chip svg{width:12px;height:12px}.chip-halal{background:#5db87224;color:#3f8a4f}.chip-nonhalal{background:#c645451f;color:#9b3838}.chip-pending{background:#d4a01724;color:#8f6d11}.chip-bpom{background:var(--color-surface-cream-strong);color:var(--color-body-strong);font-family:var(--font-mono);font-size:11px}.chip-umkm{background:#5b8fbf24;color:#3f6f96}.chip-cold{background:#5db8a629;color:#2f7d6e}.chip-ppn{background:var(--color-surface-soft);color:var(--color-muted);font-family:var(--font-mono)}.hide-compliance .compliance-only{display:none!important}.state{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;letter-spacing:.3px;padding:3px 10px;border-radius:var(--radius-pill);font-family:var(--font-mono)}.state .dot{width:6px;height:6px;border-radius:9999px}.state-draft{background:var(--color-surface-cream-strong);color:var(--color-muted)}.state-await{background:#d4a01729;color:#8f6d11}.state-issued{background:#5b8fbf29;color:#3f6f96}.state-partial{background:#e8a55a2e;color:#9c6418}.state-full{background:#5db87229;color:#3f8a4f}.state-closed{background:var(--color-surface-cream-strong);color:var(--color-body-strong)}.state-transit{background:#5b8fbf29;color:#3f6f96}.state-rejected{background:#c6454524;color:#9b3838}.diff{display:grid;grid-template-columns:1fr 28px 1fr;gap:0;align-items:stretch}.diff-side{padding:14px 16px;border-radius:var(--radius-md);border:1px solid var(--color-hairline);background:var(--color-canvas)}.diff-before{border-color:var(--color-hairline)}.diff-after{border-color:#cc785c66;background:#cc785c0d}.diff-arrow{display:flex;align-items:center;justify-content:center;color:var(--color-muted)}.diff-label{font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--color-muted);margin-bottom:8px;font-weight:600}.diff-k{font-size:11px;color:var(--color-muted);margin-top:8px}.diff-v{font-size:13px;color:var(--color-ink);font-weight:500}.diff-v.mono{font-family:var(--font-mono);font-size:12px}.q-row{border-left:3px solid transparent}.q-row.risk-high{border-left-color:var(--color-error)}.q-row.risk-med{border-left-color:var(--color-warning)}.lrow-card{transition:background .12s ease}.lrow-card:hover{background:var(--color-surface-soft)}.pin-row{display:flex;gap:10px;justify-content:center}.pin-box{width:46px;height:56px;border:1.5px solid var(--color-hairline);border-radius:var(--radius-md);background:var(--color-canvas);text-align:center;font-family:var(--font-mono);font-size:24px;color:var(--color-ink);outline:none;transition:border .12s ease,box-shadow .12s ease}.pin-box:focus{border-color:var(--color-primary);box-shadow:var(--ring-focus)}.pin-box.filled{border-color:var(--color-primary)}.feed-row{display:grid;grid-template-columns:96px 1fr auto;gap:12px;padding:10px 20px;border-bottom:1px solid var(--color-hairline-soft);font-size:13px;align-items:center}.feed-row:last-child{border-bottom:none}.feed-row .mono{font-family:var(--font-mono);font-size:12px;color:var(--color-muted)}@keyframes feedIn{0%{transform:translateY(-5px);background:#cc785c1a}to{transform:translateY(0);background:transparent}}.feed-new{animation:feedIn .6s ease-out}.chain-link{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:12px;color:var(--color-accent-teal)}.temp{font-family:var(--font-mono);font-weight:500;font-size:20px}.temp.ok{color:var(--color-success)}.temp.warn{color:var(--color-warning)}.temp.breach{color:var(--color-error)}.empty{text-align:center;padding:64px 24px;color:var(--color-muted)}.empty .ic{color:var(--color-muted-soft);margin-bottom:14px;display:inline-flex}.empty .t{font-size:18px;font-weight:500;color:var(--color-ink);margin-bottom:6px}.seg{display:inline-flex;border:1px solid var(--color-hairline);border-radius:var(--radius-md);overflow:hidden;height:36px}.seg button{padding:0 14px;background:var(--color-canvas);color:var(--color-muted);border:none;font-size:13px;font-weight:500;cursor:pointer}.seg button.on{background:var(--color-surface-card);color:var(--color-ink)}.seg button+button{border-left:1px solid var(--color-hairline)}.minibar{height:5px;border-radius:3px;background:var(--color-surface-cream-strong);overflow:hidden}.minibar>span{display:block;height:100%;background:var(--color-primary)}.tnum{font-variant-numeric:tabular-nums}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;bottom:24px;right:24px;z-index:200;background:var(--color-surface-dark);color:var(--color-on-dark);border-radius:var(--radius-md);padding:14px 16px 14px 14px;border-left:4px solid var(--color-success);display:flex;gap:10px;align-items:center;box-shadow:var(--shadow-modal);animation:toastIn .2s ease-out;max-width:380px}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}