:root{--ui-font:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--ui-radius:8px;--ui-line:#18533324;--ui-shadow:0 18px 50px #16452b24;--ui-surface:#ffffffb8;--ui-surface-solid:#fff;--ui-text:#14251c;--ui-muted:#66756c;--ui-green:#137343;--ui-green-strong:#0b3f28;--ui-green-soft:#eaf7ed;--ui-blue:#2176ae;--ui-blue-soft:#e7f1fa;--ui-orange:#b26a00;--ui-orange-soft:#fff3cd;--ui-red:#ba1a1a;--ui-red-soft:#ffe2e2;--ui-gray:#5f6763;--ui-gray-soft:#eef0ef}[data-ui-theme=greenglass]{--ui-line:#18533329;--ui-shadow:0 18px 50px #16452b24;--ui-surface:#ffffff94;--ui-surface-solid:#ffffffd1;--ui-green:#137343;--ui-green-strong:#0b3f28;--ui-green-soft:#eaf7ede0}[data-ui-theme=blue]{--ui-green:#2176ae;--ui-green-strong:#0f3d62;--ui-green-soft:#e7f1fa;--ui-shadow:0 18px 50px #134a7524}[data-ui-theme=orange]{--ui-green:#b26a00;--ui-green-strong:#633800;--ui-green-soft:#fff3cd;--ui-shadow:0 18px 50px #8a620024}[data-ui-theme=red]{--ui-green:#ba1a1a;--ui-green-strong:#6f1111;--ui-green-soft:#ffe2e2;--ui-shadow:0 18px 50px #9f161624}.ui-card{border:1px solid var(--ui-line);border-radius:var(--ui-radius);min-width:0;padding:18px}.ui-card--glass{background:var(--ui-surface);box-shadow:var(--ui-shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.ui-card--solid{background:var(--ui-surface-solid)}.ui-card--transparent{background:0 0;border-color:#0000}.ui-button{border-radius:var(--ui-radius);white-space:nowrap;border:0;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:0 14px;font-weight:800;transition:background .16s,border-color .16s,box-shadow .16s,color .16s,transform .16s;display:inline-flex}.ui-button--full{width:100%}.ui-button:disabled{cursor:not-allowed;opacity:.48}.ui-button:not(:disabled):hover,.ui-button:not(:disabled):focus-visible{transform:translateY(-1px);box-shadow:0 10px 24px #16452b1f}.ui-button:not(:disabled):focus-visible{outline-offset:2px;outline:2px solid #1f8a4c47}.ui-button--primary.ui-tone--green,.ui-button--primary.ui-tone--blue,.ui-button--primary.ui-tone--orange,.ui-button--primary.ui-tone--red,.ui-button--primary.ui-tone--gray{color:#fff}.ui-button--primary.ui-tone--green{background:linear-gradient(135deg, var(--ui-green), var(--ui-green-strong))}.ui-button--primary.ui-tone--blue{background:linear-gradient(135deg, var(--ui-blue), #0f3d62)}.ui-button--primary.ui-tone--orange{background:linear-gradient(135deg, var(--ui-orange), #633800)}.ui-button--primary.ui-tone--red{background:linear-gradient(135deg, var(--ui-red), #6f1111)}.ui-button--primary.ui-tone--gray{background:linear-gradient(135deg, var(--ui-gray), #303633)}.ui-button--soft.ui-tone--green{color:var(--ui-green-strong);background:var(--ui-green-soft)}.ui-button--soft.ui-tone--blue{color:#0f3d62;background:var(--ui-blue-soft)}.ui-button--soft.ui-tone--orange{color:var(--ui-orange);background:var(--ui-orange-soft)}.ui-button--soft.ui-tone--red{color:var(--ui-red);background:var(--ui-red-soft)}.ui-button--soft.ui-tone--gray{color:var(--ui-gray);background:var(--ui-gray-soft)}.ui-search{border:1px solid var(--ui-line);border-radius:var(--ui-radius);background:#ffffffd9;align-items:center;gap:8px;min-width:0;padding:0 12px;display:flex}.ui-search input{background:0 0;border:0;outline:none;width:100%;min-height:42px}.ui-badge{white-space:nowrap;border-radius:999px;align-items:center;min-height:28px;padding:0 10px;font-size:.78rem;font-weight:800;display:inline-flex}.ui-badge.ui-tone--green,.ui-metric-card.ui-tone--green .ui-metric-icon{color:var(--ui-green);background:var(--ui-green-soft)}.ui-badge.ui-tone--blue,.ui-metric-card.ui-tone--blue .ui-metric-icon{color:var(--ui-blue);background:var(--ui-blue-soft)}.ui-badge.ui-tone--orange,.ui-metric-card.ui-tone--orange .ui-metric-icon{color:var(--ui-orange);background:var(--ui-orange-soft)}.ui-badge.ui-tone--red,.ui-metric-card.ui-tone--red .ui-metric-icon{color:var(--ui-red);background:var(--ui-red-soft)}.ui-badge.ui-tone--gray,.ui-metric-card.ui-tone--gray .ui-metric-icon{color:var(--ui-gray);background:var(--ui-gray-soft)}.ui-metric-card{border:1px solid var(--ui-line);border-radius:var(--ui-radius);min-height:132px;color:inherit;background:var(--ui-surface);text-align:left;gap:10px;padding:18px;transition:background .16s,border-color .16s,box-shadow .16s,transform .16s;display:grid}button.ui-metric-card{cursor:pointer}button.ui-metric-card:hover,button.ui-metric-card:focus-visible{background:#ffffffc2;border-color:#1f8a4c47;transform:translateY(-2px);box-shadow:0 14px 34px #16452b1f}button.ui-metric-card:focus-visible{outline-offset:2px;outline:2px solid #1f8a4c47}.ui-metric-card span{color:var(--ui-muted)}.ui-metric-card strong{color:var(--ui-text);font-size:2rem}.ui-metric-icon{border-radius:var(--ui-radius);place-items:center;width:40px;height:40px;display:grid}.ui-table-wrap{width:100%;overflow-x:auto}.ui-data-table{border-collapse:collapse;width:100%;min-width:920px}.ui-data-table th,.ui-data-table td{border-bottom:1px solid var(--ui-line);text-align:left;vertical-align:middle;padding:12px 10px}.ui-data-table tbody tr{transition:background .16s,box-shadow .16s}.ui-data-table tbody tr:hover{background:#eaf7ed75}.ui-data-table th{color:var(--ui-muted);letter-spacing:.04em;text-transform:uppercase;font-size:.78rem}.ui-data-table td{color:var(--ui-muted)}.ui-data-table td strong{color:var(--ui-text)}.ui-pagination{color:var(--ui-muted);justify-content:space-between;align-items:center;gap:12px;margin-top:14px;display:flex}.ui-pagination>div{align-items:center;gap:8px;display:flex}.ui-pagination strong{color:var(--ui-text);white-space:nowrap}.ui-field{gap:7px;min-width:0;display:grid}.ui-field span{color:var(--ui-muted);font-size:.86rem;font-weight:700}@media (width<=720px){.ui-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:14px;box-shadow:0 10px 28px #16452b1a}.ui-button{white-space:normal;width:100%}.ui-table-wrap{overflow:visible}.ui-data-table{border-collapse:separate;min-width:0;display:grid}.ui-data-table thead{display:none}.ui-data-table tbody{gap:12px;display:grid}.ui-data-table tr{border:1px solid var(--ui-line);border-radius:var(--ui-radius);background:#ffffff9e;gap:8px;padding:12px;display:grid}.ui-data-table td{text-align:right;border-bottom:0;justify-content:space-between;gap:12px;padding:0;display:flex}.ui-data-table td:before{content:attr(data-label);color:var(--ui-muted);text-align:left;flex:none;font-weight:800}.ui-data-table td[data-label=Aksi]{display:block}.ui-data-table td[data-label=Aksi]:before{display:none}.ui-pagination{flex-direction:column;align-items:stretch}.ui-pagination>div{grid-template-columns:1fr auto 1fr;display:grid}}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--green-900:#0b3f28;--green-700:#137343;--green-600:#1f8a4c;--green-100:#eaf7ed;--mint:#d7f1df;--white:#fff;--ink:#14251c;--muted:#66756c;--line:#18533329;--amber:#f6b82e;--red:#ef4b4b;--gray:#7b8581;--blue:#2176ae;--shadow:0 18px 50px #16452b24;--glass-surface:#ffffff94;--glass-surface-strong:#ffffffb8;--glass-sidebar:#fafffc6b;--glass-highlight:#ffffff8f;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;max-width:100%}body{min-width:320px;color:var(--ink);background:radial-gradient(circle at 8% 8%,#97dbaa85,#0000 24rem),radial-gradient(circle at 72% 14%,#dcf5e2d1,#0000 30rem),linear-gradient(135deg,#edf8ef 0%,#f7fbf5 48%,#e9f6ec 100%);margin:0;overflow-x:hidden}button,input,select,textarea{font:inherit;min-width:0;max-width:100%}button{cursor:pointer}.login-screen{grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);gap:28px;min-height:100vh;padding:28px;display:grid}.login-visual,.login-panel,.panel,.intro-band,.alert-band,.success-band,.toolbar-band,.visual-panel{border:1px solid var(--line);background:var(--glass-surface-strong);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:8px}.login-visual{flex-direction:column;justify-content:space-between;padding:28px;display:flex;overflow:hidden}.login-copy{max-width:760px;padding:48px 0 22px}.login-copy h1{letter-spacing:0;max-width:780px;margin:8px 0 16px;font-size:clamp(2rem,5vw,4.8rem);line-height:.96}.login-copy p,.login-panel p,.intro-band p,.permission-card p,.qc-card p,.notice-box p{color:var(--muted);line-height:1.6}.hero-glass{background:#ffffffc2;border:1px solid #13734329;border-radius:8px;overflow:hidden}.hero-glass img,.visual-panel img{width:100%;height:auto;display:block}.login-panel{align-self:center;gap:18px;padding:28px;display:grid}.login-demo-hint{color:var(--green-900);background:#e8f8efc7;border:1px solid #13734333;border-radius:8px;gap:6px;padding:14px 16px;font-size:.84rem;display:grid}.login-demo-hint strong{font-size:.92rem}.login-demo-hint code{color:var(--green-900);overflow-wrap:anywhere;font-family:inherit;font-weight:800}.login-panel h2,.intro-band h2,.topbar h1,.section-heading h3,.tree-detail-head h3,.phone-content h3{letter-spacing:0;margin:4px 0}.brand{align-items:center;gap:12px;display:flex}.brand.compact{margin-bottom:8px}.brand-mark{color:#fff;background:linear-gradient(135deg, var(--green-700), var(--green-900));border-radius:8px;place-items:center;width:44px;height:44px;display:grid}.brand strong{color:var(--green-900);font-size:1.2rem;display:block}.brand span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;display:block}.eyebrow{color:var(--green-700);letter-spacing:.08em;text-transform:uppercase;font-size:.76rem;font-weight:800}.role-grid,.metric-grid,.detail-grid,.qc-grid,.role-permission-grid,.report-grid,.qr-generator{gap:12px;display:grid}.role-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.role-card,.metric-card,.nav-item,.tree-row,.bar-row,.qc-card,.report-button{border:1px solid var(--line);max-width:100%;color:inherit;background:#ffffffb8;border-radius:8px;transition:background .16s,border-color .16s,box-shadow .16s,color .16s,transform .16s}.role-card:hover,.metric-card:hover,.tree-row:hover,.bar-row:hover,.qc-card:hover,.report-button:hover,.role-card:focus-visible,.metric-card:focus-visible,.tree-row:focus-visible,.bar-row:focus-visible,.qc-card:focus-visible,.report-button:focus-visible{color:var(--green-900);background:#ffffffd1;border-color:#1f8a4c4d;transform:translateY(-1px);box-shadow:0 12px 30px #16452b1c}.role-card:focus-visible,.metric-card:focus-visible,.tree-row:focus-visible,.bar-row:focus-visible,.qc-card:focus-visible,.report-button:focus-visible{outline-offset:2px;outline:2px solid #1f8a4c47}.role-card{text-align:left;align-items:center;gap:10px;min-width:0;min-height:56px;padding:12px;display:flex}.role-card.selected,.nav-item.active,.tree-row.active,.segmented button.selected{background:var(--green-100);color:var(--green-900);border-color:#1f8a4c57}.role-card span,.nav-item span,.tree-row span,.tree-row strong,.data-point strong,.finance-strip strong,.invoice-row>*,.activity-row>div,.task-row>div{min-width:0}.field{gap:7px;min-width:0;display:grid}.field span{color:var(--muted);font-size:.86rem;font-weight:700}.field input,.field select,.field textarea,.search-box,.role-select{border:1px solid var(--line);width:100%;color:var(--ink);background:#ffffffd9;border-radius:8px;outline:none}.field input,.field select,.field textarea{padding:12px 13px}.field textarea{resize:vertical;min-height:92px}.field.full{grid-column:1/-1}.primary-button,.secondary-button,.danger-button,.small-button,.icon-button{white-space:nowrap;border:0;border-radius:8px;justify-content:center;align-items:center;gap:8px;font-weight:800;transition:background .16s,border-color .16s,box-shadow .16s,color .16s,transform .16s;display:inline-flex}.primary-button:not(:disabled):hover,.secondary-button:not(:disabled):hover,.danger-button:not(:disabled):hover,.small-button:not(:disabled):hover,.icon-button:not(:disabled):hover,.primary-button:not(:disabled):focus-visible,.secondary-button:not(:disabled):focus-visible,.danger-button:not(:disabled):focus-visible,.small-button:not(:disabled):focus-visible,.icon-button:not(:disabled):focus-visible{transform:translateY(-1px);box-shadow:0 10px 24px #16452b1f}.primary-button:not(:disabled):focus-visible,.secondary-button:not(:disabled):focus-visible,.danger-button:not(:disabled):focus-visible,.small-button:not(:disabled):focus-visible,.icon-button:not(:disabled):focus-visible{outline-offset:2px;outline:2px solid #1f8a4c47}.primary-button{color:#fff;background:linear-gradient(135deg, var(--green-700), var(--green-900));min-height:46px;padding:0 18px}.secondary-button{min-height:42px;color:var(--green-900);background:var(--mint);padding:0 14px}.danger-button{color:#9f1616;background:#ffe2e2;min-height:42px;padding:0 14px}.primary-button:disabled,.secondary-button:disabled,.danger-button:disabled,.small-button:disabled,.icon-button:disabled{cursor:not-allowed;opacity:.48}.small-button{min-height:34px;color:var(--green-900);background:var(--green-100);padding:0 12px}.icon-button{border:1px solid var(--line);width:42px;height:42px;color:var(--green-900);background:#ffffffbd}.app-shell{grid-template-columns:260px minmax(0,1fr);width:100%;max-width:100vw;min-height:100vh;transition:grid-template-columns .18s;display:grid;overflow-x:hidden}.app-shell.sidebar-collapsed{grid-template-columns:86px minmax(0,1fr)}.scan-page{gap:16px;width:100%;min-height:100vh;padding:18px;display:grid;overflow-x:hidden}.scan-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.scan-layout{grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:16px;display:grid}.scan-layout>.panel:last-child{grid-column:1/-1}.scan-main-panel h1{letter-spacing:0;margin:4px 0;font-size:clamp(1.8rem,4vw,2.7rem)}.sidebar{border-right:1px solid var(--line);background:linear-gradient(160deg, #ffffff8f, #ffffff3d), var(--glass-sidebar);-webkit-backdrop-filter:blur(24px)saturate(1.35);backdrop-filter:blur(24px)saturate(1.35);flex-direction:column;gap:18px;min-width:0;height:100vh;padding:22px;transition:padding .18s;display:flex;position:sticky;top:0;overflow-x:hidden;box-shadow:inset -1px 0 #ffffff80,12px 0 36px #16452b14}.sidebar:before{pointer-events:none;background:linear-gradient(90deg, var(--glass-highlight), transparent 54%), radial-gradient(circle at 30% 8%, #d7f1dfb8, transparent 14rem);content:"";position:absolute;inset:0}.sidebar>*{z-index:1;position:relative}.sidebar-head{grid-template-columns:minmax(0,1fr) 42px;align-items:center;gap:10px;display:grid}.sidebar-toggle{background:#ffffff80;flex:none}.sidebar.collapsed{align-items:center;padding:22px 14px}.sidebar.collapsed .sidebar-head{grid-template-columns:1fr;justify-items:center}.sidebar.collapsed .brand{justify-content:center}.sidebar.collapsed .brand>div:last-child,.sidebar.collapsed .nav-item span,.sidebar.collapsed .sidebar-panel{display:none}.sidebar.collapsed .nav-list{width:100%}.sidebar.collapsed .nav-item{justify-content:center;width:100%;padding:0}.nav-list{gap:8px;min-width:0;max-width:100%;display:grid}.nav-list,.segmented,.mini-tabs{scrollbar-width:thin}.nav-item{text-align:left;white-space:nowrap;border-color:#1853331f;align-items:center;gap:10px;min-height:42px;padding:0 12px;transition:background .16s,border-color .16s,box-shadow .16s,color .16s,transform .16s;display:flex}.nav-item svg{transition:transform .16s,color .16s}.nav-item:hover,.nav-item:focus-visible{color:var(--green-900);background:linear-gradient(135deg,#ffffffc7,#eaf7edb8),#ffffff75;border-color:#1f8a4c57;transform:translate(2px);box-shadow:0 10px 26px #16452b1a}.nav-item:hover svg,.nav-item:focus-visible svg{color:var(--green-700);transform:scale(1.08)}.nav-item:focus-visible{outline-offset:2px;outline:2px solid #1f8a4c47}.sidebar-panel{border:1px solid var(--line);background:#eaf7edb8;border-radius:8px;margin-top:auto;padding:14px}.sidebar-panel p{color:var(--muted);margin-bottom:0;font-size:.86rem;line-height:1.45}.main-content{width:100%;min-width:0;max-width:100%;padding:22px;overflow-x:hidden}.topbar,.topbar-actions,.section-heading,.tree-detail-head,.activity-row,.task-row,.alert-band,.success-band,.stock-row,.invoice-head,.invoice-row,.toolbar-band,.intro-band{align-items:center;display:flex}.topbar{justify-content:space-between;gap:18px;min-width:0;margin-bottom:20px}.topbar h1{font-size:clamp(1.6rem,3vw,2.35rem)}.topbar-actions{gap:10px;min-width:0;max-width:100%}.search-box{align-items:center;gap:8px;min-width:290px;padding:0 12px;display:flex}.search-box input::placeholder{color:#7a8980}.search-box input{background:0 0;border:0;outline:none;width:100%;min-height:42px}.role-select{min-height:42px;padding:0 12px}.page-grid{gap:16px;min-width:0;max-width:100%;display:grid}.intro-band,.toolbar-band{justify-content:space-between;gap:18px;min-width:0;max-width:100%;padding:18px;overflow:hidden}.alert-band{color:#6f4d00;background:#fff3cdd6;gap:12px;padding:14px 16px}.alert-band svg{flex:none}.alert-band strong,.alert-band span{display:block}.alert-band span{color:#7a642b;margin-top:2px}.success-band{color:var(--green-900);background:#d7f1dfe0;gap:10px;margin-bottom:14px;padding:12px}.success-band.compact,.form-error{border-radius:8px;margin:10px 0;padding:10px 12px}.success-band.compact{margin-bottom:12px;display:block}.form-error{color:#9f1616;background:#ffe2e2;font-weight:800}.intro-band h2{font-size:clamp(1.5rem,3vw,2.2rem)}.metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-card{text-align:left;gap:10px;min-height:132px;padding:18px;display:grid}.metric-card span,.data-point span,.finance-strip span,.tree-row span,.activity-row span,.task-row span,.stock-row span,.invoice-row span,.qc-card span,.qr-panel span,.upload-zone span{color:var(--muted)}.metric-card strong{font-size:2rem}.metric-icon{background:var(--green-100);border-radius:8px;place-items:center;width:40px;height:40px;display:grid}.good .metric-icon,.status-pill.good,.bar-fill.good{background:var(--green-100);color:var(--green-700)}.warn .metric-icon,.status-pill.warn,.bar-fill.warn{color:#8a6200;background:#fff3cd}.danger .metric-icon,.status-pill.danger,.bar-fill.danger{color:#ba1a1a;background:#ffe2e2}.muted .metric-icon,.status-pill.muted,.bar-fill.muted{color:#5f6763;background:#eef0ef}.two-column{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;display:grid}.detail-layout{grid-template-columns:minmax(280px,.86fr) minmax(0,1.14fr)}.panel,.visual-panel{min-width:0;padding:18px}.section-heading{justify-content:space-between;gap:12px;min-width:0;margin-bottom:16px}.section-heading>*{min-width:0}.chart-bars,.activity-list,.tree-list,.task-list,.stock-table{gap:10px;display:grid}.task-list{max-height:min(620px,70vh);padding-right:4px;overflow-y:auto}.bar-row{grid-template-columns:92px minmax(0,1fr) 36px;align-items:center;gap:10px;padding:10px 12px;display:grid}.bar-track{background:#edf1ee;border-radius:999px;height:10px;overflow:hidden}.bar-fill{border-radius:inherit;height:100%}.finance-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px;display:grid}.finance-strip.vertical{grid-template-columns:1fr}.finance-strip div,.data-point,.notice-box,.qr-panel,.camera-panel,.scan-result,.upload-zone,.permission-card{border:1px solid var(--line);background:#ffffff9e;border-radius:8px;padding:14px}.finance-strip strong,.data-point strong{margin-top:5px;display:block}.muted-copy{color:var(--muted);margin:0 0 14px;line-height:1.6}.qr-generator{grid-template-columns:minmax(0,1fr) 260px;align-items:stretch}.qr-url-box{border:1px solid var(--line);background:#ffffff9e;border-radius:8px;gap:6px;margin-bottom:14px;padding:12px;display:grid}.qr-url-box span,.qr-label-card span,.qr-label-card small{color:var(--muted)}.qr-url-box strong{overflow-wrap:anywhere;color:var(--green-900)}.qr-label-card{border:1px solid var(--line);box-shadow:var(--shadow);text-align:center;background:#fff;border-radius:8px;justify-items:center;gap:12px;padding:16px;display:grid}.qr-code-preview{border:2px solid var(--green-900);width:194px;height:194px;color:var(--green-900);background:linear-gradient(45deg,#0000 48%,#1373430f 50%,#0000 52%),#fff;border-radius:8px;place-items:center;display:grid}.qr-label-card strong{color:var(--green-900);margin:4px 0;font-size:1.4rem;display:block}.qr-label-card small{line-height:1.4;display:block}.growth-chart{grid-template-columns:repeat(6,minmax(0,1fr));align-items:end;gap:12px;min-height:128px;padding-top:14px;display:grid}.growth-column{text-align:center;align-items:end;gap:8px;display:grid}.growth-column div{background:linear-gradient(180deg, var(--green-600), var(--mint));border-radius:8px 8px 2px 2px;min-height:20px}.growth-column span{color:var(--muted);font-size:.78rem}.tree-row{text-align:left;justify-content:space-between;align-items:center;gap:12px;min-height:68px;padding:12px;display:flex}.tree-row>div{min-width:0}.tree-row span,.tree-row strong{display:block}.status-pill{white-space:nowrap;border-radius:999px;flex:none;align-items:center;min-height:28px;padding:0 10px;font-size:.78rem;font-weight:800;display:inline-flex}.tree-detail-head{gap:14px;margin-bottom:16px}.tree-photo{width:96px;height:96px;color:var(--green-900);background:linear-gradient(135deg, #ffffff80, #d7f1dfd9), var(--green-100);border-radius:8px;flex:0 0 96px;place-items:center;display:grid}.mini-tabs,.segmented{overscroll-behavior-inline:contain;gap:8px;width:100%;min-width:0;max-width:100%;display:flex;overflow-x:auto}.mini-tabs{margin-bottom:14px}.mini-tabs button,.segmented button{border:1px solid var(--line);min-height:36px;color:var(--muted);white-space:nowrap;background:#ffffffad;border-radius:8px;flex:none;padding:0 12px;transition:background .16s,border-color .16s,color .16s,transform .16s}.mini-tabs button:hover,.segmented button:hover,.mini-tabs button:focus-visible,.segmented button:focus-visible{color:var(--green-900);background:#eaf7edd1;border-color:#1f8a4c47;transform:translateY(-1px)}.mini-tabs button.active{color:var(--green-900);background:var(--green-100)}.detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.notice-box{margin:14px 0}.notice-box p{margin:5px 0 12px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.tree-form{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;min-width:0;max-width:100%;display:grid}.action-row,.form-actions{flex-wrap:wrap;gap:10px;min-width:0;max-width:100%;display:flex}.form-actions{grid-column:1/-1}.upload-zone{color:var(--green-700);text-align:center;cursor:pointer;border-style:dashed;justify-items:center;gap:7px;margin:14px 0;transition:background .16s,border-color .16s,box-shadow .16s,transform .16s;display:grid}.upload-zone:hover,.upload-zone:focus-within{background:#eaf7ed94;border-color:#1f8a4c57;transform:translateY(-1px);box-shadow:0 10px 26px #16452b1a}.upload-zone input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.media-preview-list{gap:8px;margin:0 0 12px;display:grid}.media-preview-list span{overflow-wrap:anywhere;border:1px solid var(--line);min-width:0;color:var(--muted);background:#ffffff9e;border-radius:8px;padding:9px 10px}.activity-row,.task-row{border:1px solid var(--line);background:#ffffff94;border-radius:8px;justify-content:space-between;gap:12px;min-height:62px;padding:12px}.activity-row{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;display:grid}.activity-copy{flex-wrap:wrap;gap:4px 9px;min-width:0;line-height:1.35;display:flex}.activity-copy strong{overflow-wrap:anywhere;min-width:0;color:var(--ink)}.activity-copy span{min-width:0;position:relative}.activity-copy span+span:before{content:"|";color:#66756ca6;margin-right:9px}.activity-row small{color:var(--muted);white-space:nowrap}.task-row{grid-template-columns:auto minmax(0,1fr);align-items:start;display:grid}.task-row>svg{color:var(--green-700);margin-top:3px}.task-copy{flex-wrap:wrap;gap:4px 9px;min-width:0;line-height:1.35;display:flex}.task-copy strong{overflow-wrap:anywhere;min-width:0;color:var(--ink);flex-basis:100%}.task-copy span{min-width:0;position:relative}.task-copy span+span:before{content:"|";color:#66756ca6;margin-right:9px}.task-toolbar{grid-template-columns:minmax(0,1fr) 150px auto;gap:10px;margin-bottom:14px;display:grid}.monitoring-toolbar{grid-template-columns:minmax(0,1fr) 150px 170px 150px;gap:10px;margin-bottom:14px;display:grid}.search-box.compact{min-width:0}.report-detail{margin-top:14px}.activity-icon{width:36px;height:36px;color:var(--green-900);background:var(--green-100);border-radius:8px;flex:0 0 36px;place-items:center;display:grid}.qc-grid,.role-permission-grid,.report-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.qc-card{text-align:left;gap:10px;min-height:170px;padding:16px;display:grid}.petani-layout{grid-template-columns:420px minmax(0,1fr);gap:16px;display:grid}.phone-frame{width:100%;max-width:420px;min-height:720px;box-shadow:var(--shadow);background:#f8fbf4;border:10px solid #14251c;border-radius:34px;overflow:hidden}.phone-bar{background:#26362d;border-radius:999px;width:118px;height:6px;margin:14px auto 8px}.phone-content{padding:16px}.phone-content .panel{box-shadow:none}.phone-content .form-grid{grid-template-columns:1fr}.qr-panel{color:var(--green-900);justify-items:center;gap:8px;margin:14px 0;display:grid}.camera-panel{color:#fff;text-align:center;background:linear-gradient(#0b3f28d6, #0b3f28d6), var(--green-900);place-items:center;gap:8px;min-height:178px;margin:14px 0;display:grid;position:relative;overflow:hidden}.camera-panel:before,.camera-panel:after{content:"";border:2px solid #ffffffc7;border-radius:8px;position:absolute;inset:22px}.camera-panel:after{background:var(--mint);border:0;height:2px;inset:50% 22px auto}.camera-panel svg,.camera-panel strong,.camera-panel span{z-index:1;position:relative}.camera-panel span{color:#fffc}.scanner-box{border:1px solid var(--line);background:#ffffff9e;border-radius:8px;gap:12px;margin:14px 0;padding:12px;display:grid}.scanner-box video{aspect-ratio:4/3;object-fit:cover;background:linear-gradient(#0b3f28d6, #0b3f28d6), var(--green-900);border-radius:8px;width:100%}.scanner-placeholder{aspect-ratio:4/3;color:#fff;background:linear-gradient(#0b3f28d6, #0b3f28d6), var(--green-900);text-align:center;border-radius:8px;place-items:center;gap:8px;width:100%;padding:18px;display:grid}.scanner-placeholder strong{font-size:1rem}.scanner-box span,.scanner-hint{color:var(--muted);line-height:1.45}.qr-photo-scan{min-height:40px;color:var(--green-900);background:var(--green-100);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:0 12px;font-weight:800;transition:background .16s,box-shadow .16s,transform .16s;display:inline-flex}.qr-photo-scan:hover,.qr-photo-scan:focus-within{background:#d7f1dff0;transform:translateY(-1px);box-shadow:0 10px 24px #16452b1f}.qr-photo-scan input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.manual-scan-form{grid-template-columns:minmax(0,1fr) auto;gap:8px;display:grid}.manual-scan-form input{border:1px solid var(--line);background:#ffffffd9;border-radius:8px;outline:none;width:100%;min-height:38px;padding:0 10px}.scan-result{gap:10px;margin-bottom:14px;display:grid}.scan-result strong{font-size:1.35rem;display:block}.scan-result p{color:var(--muted);margin:0;line-height:1.5}.stock-row,.invoice-head,.invoice-row{border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr 1fr;gap:12px;min-height:48px;padding:12px;display:grid}.invoice-head,.invoice-row{grid-template-columns:.85fr 1fr 1.3fr .8fr .7fr}.invoice-head{color:var(--muted);font-weight:800}.payment{color:#8a6200;background:#fff3cd;border-radius:999px;align-items:center;width:max-content;min-height:28px;padding:0 10px;font-weight:800;display:inline-flex}.payment.paid{background:var(--green-100);color:var(--green-700)}.report-button{min-height:48px;color:var(--green-900);justify-content:flex-start;align-items:center;gap:9px;padding:0 12px;display:inline-flex}.permission-card{min-height:158px}.permission-card svg{color:var(--green-700)}.empty-state{border:1px dashed var(--line);min-height:92px;color:var(--muted);background:#ffffff85;border-radius:8px;align-content:center;justify-items:start;gap:6px;padding:16px;display:grid}.empty-state strong{color:var(--ink)}@media (width<=1080px){.login-screen,.app-shell,.two-column,.detail-layout,.petani-layout,.scan-layout{grid-template-columns:1fr}.sidebar{gap:14px;height:auto;position:static}.nav-list{gap:10px;padding-bottom:3px;display:flex;overflow-x:auto}.nav-item{flex:0 0 164px;justify-content:flex-start}.metric-grid,.qc-grid,.role-permission-grid,.qr-generator,.tree-form{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{flex-direction:column;align-items:flex-start}.topbar-actions{width:100%}.monitoring-toolbar,.task-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.task-toolbar .secondary-button{grid-column:1/-1}.search-box{flex:320px;min-width:220px}.petani-layout{justify-items:center}.petani-layout>.panel{width:100%}.scan-layout>.panel:last-child{grid-column:auto}}@media (width<=860px){.login-screen{gap:16px;padding:18px}.login-copy{padding:30px 0 18px}.login-copy h1{font-size:clamp(2rem,8vw,3.6rem);line-height:1}.hero-glass{max-height:320px;overflow:hidden}.metric-card{min-height:112px}.detail-grid,.finance-strip,.report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=720px){html,body,#root{max-width:100vw;overflow-x:hidden}.login-screen,.main-content,.sidebar,.scan-page{padding:14px}.app-shell{width:100vw;max-width:100vw;padding-top:120px;display:block;overflow:visible}.sidebar{z-index:100;border-right:0;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(22px)saturate(1.28);backdrop-filter:blur(22px)saturate(1.28);background:linear-gradient(160deg,#ffffffb8,#eaf7ed80),#fafffc94;gap:12px;width:100%;max-width:100vw;height:120px;display:grid;position:fixed;top:0;left:0;overflow:hidden;box-shadow:0 14px 34px #16452b1a}.sidebar.collapsed{align-items:stretch;padding:14px}.sidebar.collapsed .brand>div:last-child,.sidebar.collapsed .nav-item span{display:block}.sidebar .brand{margin-bottom:0}.sidebar-head{grid-template-columns:1fr;min-height:34px}.sidebar-toggle{display:none}.brand-mark{width:34px;height:34px}.brand-mark svg{width:18px;height:18px}.brand strong{font-size:.92rem}.brand span{font-size:.62rem}.sidebar-panel{display:none}.nav-list{width:calc(100vw - 28px);max-width:calc(100vw - 28px);margin:0 -2px;padding-bottom:6px;overflow:auto hidden}.nav-item{text-align:center;flex-direction:column;flex:0 0 88px;justify-content:center;gap:5px;min-height:46px;padding:7px;font-size:.72rem}.topbar,.topbar-actions,.intro-band,.toolbar-band,.scan-header{flex-direction:column;align-items:stretch}.topbar{width:100%;max-width:100%;margin-bottom:14px}.topbar-actions{grid-template-columns:1fr auto auto;width:100%;display:grid}.search-box{grid-column:1/-1;min-width:0}.role-select{min-width:0}.page-grid,.panel,.intro-band,.toolbar-band,.visual-panel{width:100%;max-width:100%;overflow-x:hidden}.segmented,.mini-tabs{width:100%;max-width:100%;padding-bottom:4px;overflow:auto hidden}.role-grid,.metric-grid,.detail-grid,.form-grid,.tree-form,.qc-grid,.role-permission-grid,.report-grid,.qr-generator,.finance-strip,.invoice-head,.invoice-row{grid-template-columns:1fr}.login-visual,.login-panel,.panel,.intro-band,.alert-band,.toolbar-band,.visual-panel{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:14px;box-shadow:0 10px 28px #16452b1a}.hero-glass{max-height:220px}.metric-card{min-height:98px;padding:14px}.metric-card strong{font-size:1.55rem}.section-heading{flex-wrap:wrap;align-items:flex-start}.action-row,.form-actions{width:100%}.action-row>*,.form-actions>*,.manual-scan-form,.monitoring-toolbar,.task-toolbar,.primary-button,.secondary-button,.danger-button{white-space:normal;width:100%;min-width:0}.manual-scan-form,.monitoring-toolbar,.task-toolbar{grid-template-columns:1fr}.tree-detail-head{align-items:flex-start}.tree-photo{flex-basis:72px;width:72px;height:72px}.tree-row,.alert-band,.success-band{grid-template-columns:1fr;align-items:start;display:grid}.activity-row{grid-template-columns:auto minmax(0,1fr)}.activity-row small{grid-column:2;justify-self:start}.task-row{grid-template-columns:auto minmax(0,1fr)}.bar-row{grid-template-columns:78px minmax(0,1fr) 30px;padding:10px;font-size:.88rem}.growth-chart{gap:8px;min-height:104px}.phone-frame{border-width:7px;border-radius:26px;max-width:100%;min-height:0}.phone-content,.phone-content .panel{padding:12px}.invoice-head{display:none}.invoice-table{gap:12px;display:grid}.invoice-row{border:1px solid var(--line);background:#ffffff9e;border-radius:8px;gap:8px}.invoice-row>*{text-align:right;justify-content:space-between;gap:12px;width:100%;display:flex}.invoice-row>:before{content:attr(data-label);color:var(--muted);text-align:left;flex:none;font-weight:800}.payment{background:0 0;justify-content:flex-end;width:100%;padding:0}.payment.paid{background:0 0}}@media (width<=420px){.login-screen,.main-content,.sidebar{padding:10px}.nav-list{width:calc(100vw - 20px);max-width:calc(100vw - 20px)}.topbar h1{font-size:1.45rem}.topbar-actions{grid-template-columns:1fr 42px}.role-select{grid-column:1/-1}.tree-detail-head{display:grid}.bar-row{grid-template-columns:1fr}.bar-row strong{justify-self:start}.stock-row{grid-template-columns:1fr}}