:root{font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#253a35;background:#f4f5f2;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #d5dcd5;border-radius:9px;background:#fff;color:#284039;padding:10px 14px;white-space:nowrap}button:hover{filter:brightness(.96)}button:disabled{opacity:.5;cursor:wait}button.primary{background:#315e4c;border-color:#315e4c;color:#fff;font-weight:650}button.subtle{background:transparent}button.danger{color:#a02d39}.hidden{display:none!important}.shell{display:flex;min-height:100vh}.sidebar{width:248px;flex-shrink:0;background:#213d32;color:#f7f8f3;display:flex;flex-direction:column;padding:26px 16px;position:sticky;height:100vh;top:0}.brand{font-size:22px;font-weight:780;letter-spacing:-1px;white-space:nowrap}.brand-contrast{color:#9ab9aa}.subtitle{font-size:10px;letter-spacing:2px;color:#bacbc0;margin:4px 2px 28px}.sidebar nav{display:flex;flex-direction:column;gap:4px}.sidebar nav button{display:block;text-align:left;color:#d9e5dc;background:transparent;border:0;border-radius:9px;width:100%;padding:11px 14px}.sidebar nav button.active,.sidebar nav button:hover{background:#416451;color:#fff}.sidebar-bottom{margin-top:auto;padding:15px 12px;font-size:12px;color:#acc4b6}.content{flex:1;min-width:0;padding:30px clamp(16px,3vw,50px) 60px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px}h1{font-size:27px;font-weight:700;letter-spacing:-.6px;margin:6px 0}h2{font-size:19px;margin:0 0 16px}h3{font-size:15px;margin:0 0 13px}.overline{font-size:10px;font-weight:750;letter-spacing:2px;color:#7c9489}.topbar-right{display:flex;align-items:center;gap:18px}.dashboard{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:16px;margin-bottom:22px}.metric,.panel{background:#fff;border:1px solid #e4e9e3;box-shadow:0 2px 6px #263d2c08;border-radius:14px;padding:20px}.metric label{font-size:12px;color:#798a80}.metric strong{display:block;font-size:25px;margin-top:10px;color:#2a5845}.panel{margin-bottom:18px}.panel-header{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:16px}.panel-header h2{margin:0}.description{color:#718277;margin:0 0 20px}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:13px}.form-grid.two{grid-template-columns:repeat(2,minmax(150px,1fr))}.form-grid.four{grid-template-columns:repeat(4,minmax(130px,1fr))}label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#60736a;font-weight:600}input,select{min-width:0;width:100%;border:1px solid #d8e2d9;background:#fff;border-radius:8px;padding:10px 11px;color:#203a30}input:focus,select:focus{outline:2px solid #b4d0bb}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:17px 0 0}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}th{font-weight:650;color:#7e8f85;font-size:11px;background:#f8faf8}td,th{padding:12px 14px;border-bottom:1px solid #edf0ed}td{font-size:13px}tbody tr:last-child td{border-bottom:none}.muted{color:#819086}.notice{margin:0 0 18px;padding:12px 16px;border-radius:10px;background:#e4f2e8;color:#255d40}.notice.error-notice{background:#fbe7e8;color:#9a2638}.line-group{display:grid;gap:8px}.line-row{display:grid;grid-template-columns:1.2fr .8fr .7fr .8fr 44px;gap:8px;align-items:end;background:#f8faf8;padding:9px;border-radius:9px}.line-row.transfer{grid-template-columns:1.2fr .8fr .7fr 44px}.line-row.worker{grid-template-columns:1.2fr .8fr 44px}.line-row.expense{grid-template-columns:1.5fr .8fr 44px}.line-row.receipt{grid-template-columns:1.5fr .8fr 44px}.section-title{font-weight:700;margin:22px 0 10px;color:#3c594b}.auth-screen,.overlay{min-height:100vh;display:grid;place-items:center;background:#edf1ed}.overlay{position:fixed;inset:0;background:#243e34bd;z-index:4}.auth-card{display:grid;gap:16px;background:#fff;padding:34px;border-radius:17px;width:min(420px,95vw);box-shadow:0 9px 40px #1b40252c}.auth-card h1{font-size:23px}.error{color:#af3540;font-size:12px}.pill{display:inline-block;background:#edf5ef;color:#327149;padding:4px 9px;border-radius:7px;font-size:12px}.permission-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.permission-grid label{flex-direction:row;align-items:center}.permission-grid input{width:auto}details{padding:10px;background:#f8faf8;border-radius:8px}summary{cursor:pointer;font-weight:650}.footer-note{color:#8b968e;font-size:11px;margin-top:25px}@media(max-width:980px){.dashboard{grid-template-columns:repeat(2,minmax(140px,1fr))}.form-grid,.form-grid.four{grid-template-columns:repeat(2,minmax(150px,1fr))}}@media(max-width:700px){.shell{display:block}.sidebar{width:100%;height:auto;position:static;padding:14px}.sidebar .subtitle,.sidebar-bottom{display:none}.sidebar nav{flex-direction:row;overflow-x:auto;margin-top:10px}.sidebar nav button{white-space:nowrap;width:auto;padding:9px}.content{padding:16px}.topbar{align-items:flex-start}.topbar-right{gap:8px}.topbar-right span{display:none}.dashboard{gap:9px}.metric,.panel{padding:14px}.form-grid,.form-grid.two,.form-grid.four{grid-template-columns:1fr}.line-row,.line-row.transfer,.line-row.worker,.line-row.expense,.line-row.receipt{grid-template-columns:1fr 1fr}.line-row label:first-child{grid-column:1/-1}.line-row button{align-self:end}.permission-grid{grid-template-columns:1fr}h1{font-size:23px}}
a.download{display:inline-block;padding:10px 14px;border-radius:9px;background:#315e4c;color:#fff;text-decoration:none;font-weight:650}.actions:has(.download){margin:0 0 14px}

/* Production Control vNext: compact working dashboards */
.quick-actions{display:flex;flex-wrap:wrap;gap:10px}
.quick-actions button{flex:1 1 170px;text-align:left;min-height:46px;font-weight:600}
.quick-actions button:first-child{background:#385d4d;border-color:#385d4d;color:#fff}
.summary-columns{display:grid;grid-template-columns:1.35fr 1fr;gap:16px}
.summary-columns>.panel{min-width:0}
.panel:has(.quick-actions){padding:21px 22px}
.metric strong{font-variant-numeric:tabular-nums}
#navigation button{transition:background .12s ease}
@media(max-width:950px){.summary-columns{grid-template-columns:1fr}}
@media(max-width:700px){.quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.quick-actions button{min-width:0;white-space:normal}.summary-columns{gap:0}}

/* Demo-style operation dialogs */
body.modal-open{overflow:hidden}
.operation-overlay{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:#152a20ba;padding:24px}
.operation-dialog{background:#fff;border-radius:18px;width:min(990px,100%);max-height:min(92vh,1000px);overflow:hidden;display:flex;flex-direction:column;box-shadow:0 22px 70px #102b2755}
.operation-header{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:22px 26px 14px;border-bottom:1px solid #e4e9e3}
.operation-header h2{margin:0;font-size:23px}
.operation-header button{font-size:23px;line-height:1;padding:8px 13px}
.operation-content{padding:22px 26px;overflow:auto;min-height:80px;overscroll-behavior:contain}
.operation-content .panel{box-shadow:none;padding:16px 0;border:0;border-bottom:1px solid #e4e9e3;border-radius:0}
.operation-content .panel:last-child{border-bottom:0}
.operation-content .panel h2{font-size:17px}
.operation-content .actions{justify-content:flex-end}
.operation-footer{padding:12px 26px 18px;border-top:1px solid #e4e9e3;display:flex;justify-content:flex-end}
.operation-dialog>.notice{margin:12px 26px 0}
.operation-content .form-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:700px){.operation-overlay{padding:0;align-items:stretch}.operation-dialog{height:100dvh;max-height:100dvh;width:100%;border-radius:0}.operation-header{padding:14px 16px}.operation-content{padding:16px}.operation-footer{padding:10px 16px}.operation-content .form-grid.four{grid-template-columns:1fr}.operation-content .line-row{grid-template-columns:1fr 1fr}}

/* Compact timber receipt */
.raw-receipt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end}
.raw-material-picker{display:flex;gap:7px;align-items:end;position:relative;min-width:0}
.raw-material-picker>label{flex:1;min-width:0}
.raw-material-picker>button{flex:none;min-height:41px;font-weight:700;font-size:19px}
.raw-add-inline{position:absolute;z-index:3;top:calc(100% + 8px);left:0;right:0;display:flex;align-items:end;flex-wrap:wrap;gap:7px;background:#fff;padding:14px;border:1px solid #d8e2d9;border-radius:10px;box-shadow:0 8px 22px #182a1833}
.raw-add-inline label{flex:1 1 170px}
.raw-add-inline button{padding:10px}
.operation-content:has(.raw-receipt-grid) .panel{padding:0;border:0}
.operation-content:has(.raw-receipt-grid) .panel>h2{display:none}
.operation-content:has(.raw-receipt-grid) .actions{margin-top:20px}
@media(max-width:800px){.raw-receipt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:550px){.raw-receipt-grid{grid-template-columns:1fr}.raw-add-inline{position:static;flex-direction:column;align-items:stretch}.raw-add-inline label{width:100%}}

/* Compact sawing report */
.saw-top-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.saw-section{border-top:1px solid #e3e8e2;margin-top:18px;padding-top:18px}
.saw-section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.saw-section-head h3{font-size:18px;margin:0}
.saw-section-head button{background:#e7efe8;border-color:#e7efe8;color:#315e4c}
.saw-output-row{display:grid;grid-template-columns:minmax(0,1fr) 115px 85px 42px;align-items:end;gap:9px;background:transparent;padding:8px 0;border-bottom:1px solid #edf0ed}
.saw-item-picker{display:flex;align-items:end;gap:7px;position:relative;min-width:0}
.saw-item-picker>label{flex:1;min-width:0}
.saw-item-picker>button{min-height:41px;font-size:17px}
.saw-output-volume{align-self:center;text-align:right;white-space:nowrap}
.saw-add-inline{position:absolute;top:calc(100% + 8px);left:0;right:0;background:white;padding:14px;border:1px solid #d6dfd7;border-radius:10px;box-shadow:0 10px 28px #213d3238;z-index:5;min-width:min(560px,80vw)}
.saw-new-item-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.saw-add-inline .actions{justify-content:flex-end}
.saw-hint{padding:12px 15px;background:#eff3ed;border-radius:10px;color:#587266;line-height:1.5}
.operation-content:has(.saw-top-grid) .panel{padding:0;border:0}
.operation-content:has(.saw-top-grid) .panel>h2{display:none}
@media(max-width:740px){.saw-top-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.saw-new-item-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:550px){.saw-top-grid{grid-template-columns:1fr}.saw-output-row{grid-template-columns:1fr 90px 50px}.saw-item-picker{grid-column:1/-1}.saw-add-inline{position:static;min-width:0}.saw-new-item-grid{grid-template-columns:1fr}.saw-output-volume{font-size:12px}}

/* Payroll dashboard styled after the demo */
.payroll-section{background:#fff;border:1px solid #e0e5df;border-radius:16px;padding:24px;margin-bottom:20px}
.payroll-section h3{font-size:19px;margin:0 0 18px}
.payroll-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.payroll-head h3{margin:0}
.payroll-section table{width:100%}
.payroll-section th,.payroll-section td{padding:14px 10px}
.payroll-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
.payroll-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}
.payroll-metrics .metric{border:1px solid #e0e5df;box-shadow:none}
.payroll-add-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin-top:18px;padding:14px;background:#f5f7f3;border-radius:12px}
.payroll-add-form label{flex:1 1 220px}
@media(max-width:770px){.payroll-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.payroll-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.payroll-section{padding:16px}}
@media(max-width:480px){.payroll-filters,.payroll-metrics{grid-template-columns:1fr}.payroll-head{align-items:flex-start;flex-direction:column}}

/* Payroll overview matches demo cards and supports selected employee details. */
.payroll-staff,.payroll-accruals{max-width:none}
.payroll-staff .payroll-head h3,.payroll-accruals>h3{font-weight:700}
.payroll-daily{margin-top:22px;border-top:1px solid #e1e6e0;padding-top:17px}
.payroll-daily h4{margin:0 0 12px;font-size:17px}
.payroll-daily .table-wrap{max-width:100%;overflow-x:auto}
.operation-content:has(.payroll-section){padding:20px 24px}
.operation-content .payroll-section{padding:20px;border:1px solid #e0e5df;border-radius:14px;margin-bottom:16px}
.operation-content .payroll-section h3{font-size:19px}
.operation-content .payroll-section .metric{padding:14px}
@media(max-width:550px){.operation-content:has(.payroll-section){padding:12px}.operation-content .payroll-section{padding:15px}.payroll-daily h4{font-size:16px}}

/* Shipping from warehouse #1: compact demo-inspired form. */
.shipping-top{display:grid;grid-template-columns:minmax(130px,.85fr) minmax(180px,1.3fr) minmax(190px,1fr) minmax(190px,1fr);gap:12px;align-items:end}
.shipping-top label{min-width:0}
.shipping-rate{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px;align-items:end}
.shipping-carrier-row{display:flex;align-items:end;gap:6px}
.shipping-carrier-row>label{flex:1;min-width:0}
.shipping-carrier-row>button{flex:none;font-size:22px;min-height:42px;padding:8px 12px}
.shipping-carrier-slot{position:relative}
.shipping-add-carrier{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-top:8px;padding:12px;background:#f6f8f5;border:1px solid #dae3d9;border-radius:10px}
.shipping-add-carrier>label{flex:1 1 180px}
.shipping-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;padding-top:15px;border-top:1px solid #e1e6e0}
.shipping-section-head h3{margin:0;font-size:18px}
.shipping-lines .shipping-line{display:grid;grid-template-columns:minmax(0,1fr) 115px 110px 44px;gap:8px;align-items:end;border-bottom:1px solid #e7eae5;padding:9px 0}
.shipping-line .shipping-volume{align-self:center;text-align:right;white-space:nowrap;color:#52705b}
.shipping-line>button{align-self:end}
.shipping-expenses .line-row{padding:8px 0}
.shipping-summary{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px 22px;margin-top:15px;padding:15px 0;border-top:1px solid #e1e6e0}
.operation-content:has(.shipping-top) .panel{border:0;padding:0}
.operation-content:has(.shipping-top) .panel>h2{display:none}
@media(max-width:900px){.shipping-top{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.shipping-top{grid-template-columns:1fr}.shipping-lines .shipping-line{grid-template-columns:minmax(0,1fr) 100px;gap:6px}.shipping-line .shipping-volume{grid-column:1}.shipping-line>button{grid-column:2;grid-row:2}.shipping-section-head h3{font-size:16px}}

/* Demo-matched sales dialog */
.sale-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:680px}
.sale-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 10px}
.sale-section-head h3{margin:0;font-size:18px}
.sale-section-head>button{background:#e6eee8;color:#39584b;border:0;border-radius:12px;padding:13px 18px}
.sale-lines .sale-line{display:grid;grid-template-columns:minmax(0,1fr) 115px 145px 44px;align-items:start;gap:8px;padding:12px 0}
.sale-line>button{align-self:start;margin-top:24px}
.sale-line .sale-price{display:flex;flex-direction:column;gap:2px}
.sale-line .sale-volume{display:block;font-size:13px;color:#567461;margin:0 0 0 5px}
.sale-hint{background:#edf2ed;color:#536e5c;padding:16px;border-radius:12px;margin:17px 0}
.sale-summary{display:flex;justify-content:flex-end;gap:22px;flex-wrap:wrap;margin:10px 0 16px;color:#39584b}
@media(max-width:720px){.sale-lines .sale-line{grid-template-columns:minmax(0,1fr) 90px 110px 32px}.sale-section-head h3{font-size:16px}}
@media(max-width:520px){.sale-top{grid-template-columns:1fr}.sale-lines .sale-line{grid-template-columns:minmax(0,1fr) 95px;gap:7px}.sale-line>label:first-child{grid-column:1 / -1}.sale-line>button{grid-column:2;grid-row:2;margin-top:22px}.sale-line .sale-price{grid-column:1;grid-row:2}}