/* Reused from restaurant-order/dist/style.css; scoped to the integrated settings view. */
.view-settings{--green:#284c3c;--muted:#889086;--line:#e6eae1;--gold:#9a7939}
@scope (.view-settings) {
:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#253c33;background:#f6f7f3;font-size:14px;line-height:1.6;--green:#214f40;--muted:#7a847d;--line:#e6eae3;--amber:#987332}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid #dbe1d8;background:#fff;color:var(--green);padding:9px 16px;min-height:42px;border-radius:8px;font-weight:550}button:hover{background:#f1f5ee}button:disabled{opacity:.48;cursor:not-allowed}button.primary{background:var(--green);color:#fff;border-color:var(--green)}button.primary:hover{background:#183f31}.quiet{background:transparent}.icon-button{font-size:24px;border:0;padding:0 8px;min-width:40px}.small{font-size:12px}.muted{color:var(--muted)}p{margin:6px 0 0}h1,h2,h3{line-height:1.35}h1{font-size:30px;font-weight:650;letter-spacing:.03em;margin:10px 0}h2{font-size:17px;font-weight:650;margin:0}h3{font-size:14px;margin:24px 0 12px}input,select,textarea{min-width:0;max-width:100%;width:100%;padding:10px 12px;color:#253c33;background:#fff;border:1px solid #dce2d9;border-radius:7px;min-height:43px}input::placeholder{color:#a4aaa3}input:focus,select:focus,textarea:focus{outline:2px solid #a7c7b6;outline-offset:1px}button:focus-visible,a:focus-visible{outline:3px solid #a7c7b6;outline-offset:3px}label{display:block;font-size:13px;font-weight:550;margin-bottom:7px}.top{border-bottom:1px solid var(--line);background:#fff}.top-inner{max-width:1280px;padding:0 34px;margin:auto;height:82px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;gap:12px;align-items:center;color:var(--green);text-decoration:none;font-size:18px;font-weight:650}.brand small{display:block;font-size:10px;color:var(--muted);font-weight:400;letter-spacing:2px;margin-top:1px}.brand-icon{background:var(--green);color:#fff;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;font-size:21px;font-family:serif}nav{display:flex;gap:8px}.nav{border:0;color:var(--muted);background:transparent;padding:10px 20px}.nav.active{color:var(--green);background:#edf3ed}main{max-width:1280px;margin:auto;padding:34px}.page-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:26px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:2px;color:#8b998c}.card{background:#fff;border:1px solid var(--line);border-radius:12px}.context{display:grid;grid-template-columns:1.1fr 1.4fr .7fr;gap:30px;padding:22px 26px;align-items:center}.date-line{display:flex;align-items:center;gap:10px}.date-line input{max-width:180px}.pill{display:inline-block;background:#edf3eb;border:1px solid #e4eade;border-radius:5px;padding:3px 9px;color:#4d6a4a;font-size:12px;white-space:nowrap}.context-rule{display:flex;flex-direction:column;gap:5px;padding-left:28px;border-left:1px solid var(--line)}.context-rule strong{font-size:15px;font-weight:550}.progress-block{display:flex;flex-direction:column;padding-left:24px;border-left:1px solid var(--line)}.progress-block strong{font-size:24px;line-height:1.35;font-variant-numeric:tabular-nums}.progress-track{height:4px;background:#edf0e8;border-radius:3px;margin-top:12px;width:120px;max-width:100%}#progress-bar{height:100%;background:#91aa77;border-radius:3px;transition:width .2s}.setup-banner{padding:13px 17px;background:#f5f0e3;border:1px solid #eee5ce;border-radius:8px;color:#846e3c;margin:17px 0 24px;font-size:13px;display:flex;align-items:center;justify-content:space-between;gap:16px}.setup-banner button{background:transparent;color:#826329;border-color:#dfd1ae;min-height:34px;padding:4px 13px;font-size:12px;flex-shrink:0}.workspace{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:24px;align-items:start}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.inventory>.section-head{padding:23px 23px 17px}.count{display:inline-block;font-size:11px;font-weight:500;vertical-align:middle;padding:2px 7px;background:#f2f4ee;color:#7d8977;border-radius:4px;margin-left:5px}.filters{display:flex;gap:10px;padding:0 23px 20px}.filters input{flex:1;width:60%}.filters select{width:38%;font-size:12px}.inventory-columns,.stock-row{display:grid;grid-template-columns:minmax(0,1.25fr) 134px minmax(92px,.8fr);gap:18px;align-items:center}.inventory-columns{padding:10px 23px;background:#f8faf6;font-size:11px;color:#929a90;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.inventory-columns span:last-child{text-align:right}.stock-row{padding:16px 23px;border-bottom:1px solid #eff1ec;min-height:85px}.stock-row:last-child{border-bottom:0}.item-name{font-size:14px;font-weight:550;overflow-wrap:anywhere}.item-detail{color:#8b9488;font-size:11px;margin-top:4px}.stock-input{display:flex;align-items:center;gap:8px}.stock-input input{width:94px;padding:8px;text-align:center;font-weight:550;font-variant-numeric:tabular-nums}.stock-input span{font-size:12px;color:#858f82;white-space:nowrap}.row-result{text-align:right;font-size:12px;color:#9ba194}.row-result.order{color:var(--green);font-weight:600;font-size:15px}.row-result.missing{color:#9b8457;font-size:11px}.row-result small{display:block;color:#8c9987;font-size:10px;font-weight:400}.table-foot{background:#fafbf8;border-radius:0 0 12px 12px;padding:14px 23px;font-size:11px;color:#8a9285;border-top:1px solid var(--line)}.report-heading{display:flex;align-items:center;justify-content:space-between;margin:3px 0 16px}.report-heading h2{margin-top:7px}.note-card{padding:16px;margin-bottom:14px}.note-card input{font-size:12px}.supplier-report{margin-bottom:14px;overflow:hidden}.supplier-report-head{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.supplier-report-head h3{font-size:14px;margin:0}.supplier-report-body{padding:18px}.supplier-report pre{font-family:inherit;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-size:13px;line-height:1.9}.supplier-report button.copy{width:100%;margin-top:16px}.blocked{padding:2px 0 7px}.blocked strong{font-size:14px;font-weight:550}.blocked p{font-size:12px;color:var(--muted);margin-top:8px}.blocked-list{font-size:12px;color:#8c7856;margin:13px 0 0;padding:12px;background:#faf7ef;border-radius:6px;line-height:1.9}.report-tip{padding:0 6px;line-height:1.8}.empty{padding:35px 24px;text-align:center;color:var(--muted)}.settings-top{display:grid;grid-template-columns:1.15fr 1fr;gap:24px;margin-bottom:24px}.padded{padding:24px}.padded>h2{margin-bottom:18px}.padded>label{margin-top:16px}.inline{display:flex;gap:8px}.inline button{white-space:nowrap}.supplier-head{margin-top:18px}.supplier-head label{margin:0 0 6px}.supplier-chip{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 0;border-bottom:1px solid var(--line)}.supplier-chip>span{overflow-wrap:anywhere}.supplier-chip button{font-size:11px;min-height:30px;padding:2px 8px;border:0;color:var(--muted)}.backup-actions{display:flex;gap:10px;margin:20px 0 12px}.paper-note{font-size:12px;line-height:1.8;background:#f7f4ea;color:#8a784c;border-radius:7px;padding:11px 13px;margin-top:16px}.table-title{border-bottom:1px solid var(--line)}.settings-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:13px;white-space:nowrap;text-align:left}thead{background:#f8faf6}th{padding:12px 18px;font-size:12px;color:#86907f;font-weight:500}td{padding:16px 18px;border-top:1px solid var(--line)}td:first-child{white-space:normal;min-width:140px}td small{display:block;color:var(--muted);font-size:11px}td button{font-size:12px;padding:4px 12px;min-height:32px}.disabled-row{opacity:.6}.pending-text{color:#a28e63;font-size:12px}.status-disabled{color:#ad8b6a}footer{display:flex;justify-content:space-between;color:#9ba193;font-size:11px;margin-top:32px;padding:12px 0;gap:12px}dialog{border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 70px #1c302b22;max-width:640px;width:calc(100% - 28px);max-height:90dvh;padding:0;color:#253c33}dialog::backdrop{background:#182a2459;backdrop-filter:blur(3px)}.dialog-head{padding:19px 23px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.dialog-body{padding:22px 23px}.dialog-foot{padding:16px 23px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end;background:#fafbf8}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-grid.three{grid-template-columns:repeat(3,1fr)}.formula-note{padding:12px;background:#eef4ee;border-radius:7px;font-size:12px;margin-top:14px}.checkbox{display:flex;align-items:center;gap:8px;margin-top:22px}.checkbox input{width:17px;height:17px;min-height:0;accent-color:var(--green)}.error,.alert{color:#9d422f}.alert{padding:15px;background:#ffefe8;border-radius:8px;margin-bottom:16px}#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:#214f40;color:white;padding:12px 22px;border-radius:9px;box-shadow:0 8px 28px #12332226;z-index:100;max-width:90vw;width:max-content;font-size:13px}#manual-copy-text{resize:vertical}[hidden]{display:none!important}
@media(min-width:1100px){.report{position:sticky;top:24px}}@media(max-width:1000px){main{padding:24px}.top-inner{padding:0 24px}.workspace{gap:16px;grid-template-columns:minmax(0,1.3fr) minmax(270px,1fr)}.context{gap:18px;padding:20px}.context-rule{padding-left:18px}.context-rule strong{font-size:13px}.stock-row,.inventory-columns{padding-left:16px;padding-right:16px;gap:10px;grid-template-columns:minmax(0,1fr) 106px 78px}.stock-input input{width:74px}.inventory>.section-head{padding:20px 16px 16px}.filters{padding:0 16px 16px}}
@media(max-width:760px){.workspace{grid-template-columns:1fr}.report{margin-top:10px}.context{grid-template-columns:1fr auto;gap:16px}.context-rule{grid-column:1/-1;grid-row:2;padding:12px 0 0;border-left:0;border-top:1px solid var(--line);gap:2px}.context-rule>span:first-child{display:none}.progress-block{padding-left:16px}.settings-top{grid-template-columns:1fr;gap:16px}.page-head{align-items:flex-start}h1{font-size:25px}.page-head>.quiet{font-size:11px;padding:6px 10px;min-height:34px;white-space:nowrap;margin-top:28px}.top-inner{height:72px;padding:0 16px}.brand{font-size:15px;gap:8px}.brand-icon{width:34px;height:34px;font-size:19px}.brand small{font-size:8px;letter-spacing:1px}nav{gap:2px}.nav{padding:8px 10px;font-size:12px}main{padding:25px 16px}.page-head .muted{font-size:12px}.setup-banner{align-items:flex-start;font-size:12px;padding:12px}.inventory-columns,.stock-row{grid-template-columns:minmax(0,1fr) 117px 87px;gap:10px}.stock-input input{width:82px}.stock-row{min-height:87px}.filters select{width:42%}.form-grid{gap:13px}.form-grid.three{gap:8px}.dialog-body{padding:18px}.dialog-head,.dialog-foot{padding:16px 18px}.form-grid label{font-size:12px}.form-grid.three input{padding:10px 8px}input,select,textarea{font-size:16px}.backup-actions button{flex:1}.padded{padding:20px}.page-head>#add-product{font-size:12px;padding:8px 12px;white-space:nowrap;margin-top:28px}.section-head #save-status{font-size:10px}footer{font-size:10px}.date-line{gap:7px}.date-line input{max-width:160px;font-size:14px}}
@media(max-width:380px){main{padding:22px 10px}.top-inner{padding:0 12px}.brand small{display:none}.nav{padding:7px 8px}.stock-row,.inventory-columns{grid-template-columns:minmax(0,1fr) 101px 76px;padding-left:12px;padding-right:12px}.stock-input input{width:68px}.page-head{gap:7px}h1{font-size:22px}.context{padding:16px}.progress-track{width:75px}}
.prototype-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#edf2e7;border:1px solid #dce5d2;border-radius:8px;padding:11px 16px;margin-bottom:24px;font-size:12px;color:#718161}.prototype-banner strong{color:#3e5738;margin-right:8px}.prototype-banner button{font-size:12px;min-height:32px;padding:4px 12px;white-space:nowrap;background:transparent;border-color:#cbd8bf}.stock-input input[aria-invalid=true]{border-color:#b66c53}.stock-row:focus-within{background:#f7faf4}.supplier-report pre{background:#f7f9f4;border-radius:7px;padding:14px}.dialog-body{max-height:65dvh;overflow-y:auto}.form-grid .form-grid{gap:12px}@media(max-width:760px){.prototype-banner{align-items:flex-start;font-size:11px;padding:11px 12px}.prototype-banner span{line-height:1.8}.settings-scroll{overflow:visible}.settings-scroll table,.settings-scroll tbody,.settings-scroll tr,.settings-scroll td{display:block;white-space:normal}.settings-scroll thead{display:none}.settings-scroll tr{padding:16px;border-bottom:1px solid var(--line);position:relative}.settings-scroll td{border:0;padding:4px 0;display:flex;gap:12px;font-size:13px}.settings-scroll td:first-child{padding-bottom:7px;display:block}.settings-scroll td:first-child strong{font-size:15px}.settings-scroll td:first-child small{margin-top:3px}.settings-scroll td[data-label]::before{content:attr(data-label);width:72px;color:#8a9483;flex-shrink:0}.settings-scroll td[data-label] small{display:inline-block;padding-left:5px}.settings-scroll td:last-child{position:absolute;right:16px;top:16px}.settings-scroll td[colspan]{position:static}.form-grid label{min-height:19px}}
/* Phone layout: keep stock entry close to the top and navigation within reach. */
.prototype-detail{display:block;font-size:11px;color:#7b8970;line-height:1.5;margin-top:2px}
.context-rule summary{cursor:pointer;font-size:12px;color:var(--muted)}
.context-rule strong{display:block;margin-top:7px}.context-rule>span{display:block;margin-top:4px}
.conversion-editor{display:flex;align-items:center;gap:12px;background:#f1f5ed;border:1px solid #e3ebda;border-radius:8px;padding:12px}
.conversion-editor>span{overflow-wrap:anywhere;font-weight:550;flex:0 1 auto;min-width:0}
.conversion-editor input{flex:1;width:110px;max-width:170px;text-align:center;background:#fff}
.spec-field{margin-top:20px}.paper-reference-details{margin-top:15px;font-size:12px;color:var(--muted)}
.paper-reference-details summary{cursor:pointer;padding:5px 0}.paper-reference-details .paper-note{margin-top:6px}
@media(max-width:760px){
 :root{--muted:#707c73}
 html{scroll-padding-top:65px;scroll-padding-bottom:85px}
 body{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
 body:has(dialog[open]){overflow:hidden}
 .top{position:sticky;top:0;z-index:20}
 .top-inner{height:54px;padding:0 16px}
 .brand{font-size:16px;gap:9px}.brand small{display:none}.brand-icon{width:30px;height:30px;border-radius:8px;font-size:18px}
 .top nav{position:fixed;z-index:30;left:0;right:0;bottom:0;display:flex;gap:8px;background:#fff;border-top:1px solid #dfe6db;box-shadow:0 -4px 18px #243a2a06;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px))}
 .nav{flex:1;min-height:48px;font-size:14px;border-radius:9px;font-weight:550}
 main{padding:12px 12px 16px}
 .prototype-banner{margin-bottom:14px;padding:8px 11px;gap:10px;align-items:center;font-size:11px}
 .prototype-banner strong{margin-right:4px}.prototype-banner>span{min-width:0;line-height:1.5}
 .prototype-banner button{font-size:11px;min-height:44px;padding:6px 9px;flex-shrink:0}
 .prototype-detail{font-size:10px}
 .page-head{align-items:center;margin-bottom:12px;gap:10px}
 h1{font-size:22px;margin:0;line-height:1.4;letter-spacing:0}
 .page-head p{display:none}
 .page-head>.quiet,.page-head>#add-product{min-height:44px;margin-top:0;font-size:12px;padding:8px 12px}
 .context{padding:13px 14px;gap:10px 12px;grid-template-columns:minmax(0,1fr) 84px}
 .context>div:first-child{min-width:0}.context label{font-size:12px;margin-bottom:6px}
 .date-line{gap:6px;min-width:0}.date-line input{width:100%;max-width:180px;min-height:46px;font-size:16px;padding:7px 8px}
 .date-line .pill{padding:3px 5px;font-size:11px}
 .context>div:first-child>p{display:none}
 .progress-block{min-width:0;padding-left:12px}.progress-block strong{font-size:21px;white-space:nowrap}.progress-block>span{font-size:11px}
 .progress-track{width:100%;margin-top:7px}
 .context-rule{grid-column:1/-1;grid-row:auto;padding:7px 0 0;margin-top:1px;border-top:1px solid var(--line)}
 .context-rule summary{font-size:11px;line-height:1.4}.context-rule strong{font-size:12px}.context-rule>span{font-size:11px}
 .setup-banner{margin:10px 0 12px;gap:10px;padding:8px 11px;align-items:center;font-size:11px;line-height:1.6}
 .setup-banner button{min-height:44px;font-size:11px;padding:5px 10px}
 .workspace{gap:18px}
 .inventory>.section-head{padding:15px 13px 10px;gap:8px}
 .inventory .section-head h2{font-size:16px}.inventory .section-head p{font-size:11px;margin-top:3px}
 #save-status{font-size:10px;white-space:nowrap}.count{font-size:10px}
 .filters{gap:8px;padding:0 13px 12px}.filters input{width:58%;font-size:16px;min-height:46px;padding:9px 10px}.filters select{width:42%;font-size:16px;min-height:46px;padding:8px 7px}
 .inventory-columns,.stock-row{grid-template-columns:minmax(0,1fr) 108px 76px;gap:8px;padding-left:13px;padding-right:13px}
 .inventory-columns{padding-top:8px;padding-bottom:8px;font-size:10px}
 .stock-row{min-height:94px;padding-top:13px;padding-bottom:13px}
 .item-name{font-size:15px}.item-detail{font-size:11px;line-height:1.5;margin-top:3px;overflow-wrap:anywhere}
 .stock-input{gap:6px;min-width:0}.stock-input input{flex:1;width:80px;min-width:0;min-height:48px;font-size:18px;padding:8px 6px;border-radius:8px}
 .stock-input input::-webkit-inner-spin-button,.stock-input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
 .stock-input>span{font-size:12px;max-width:25px;overflow-wrap:anywhere;white-space:normal}
 .row-result{display:block;text-align:right;font-size:12px;overflow-wrap:anywhere}.row-result.order{font-size:16px}.row-result small{font-size:10px;margin-top:3px}.row-result.missing{font-size:11px}
 .table-foot{padding:12px 13px;font-size:11px}
 .report{margin-top:0}.report-heading{margin-bottom:12px}.report-heading h2{margin:0;font-size:18px}
 .note-card{padding:13px;margin-bottom:12px}.note-card input{font-size:16px;min-height:46px}
 .supplier-report-head{padding:14px}.supplier-report-body{padding:14px}
 .supplier-report pre{font-size:14px;padding:13px;line-height:1.9}.supplier-report button.copy{min-height:48px;font-size:14px;margin-top:14px}
 #settings-view{display:flex;flex-direction:column;gap:14px}#settings-view>.page-head{margin-bottom:0}
 .settings-top{display:contents}.settings-top>.card:first-child{order:1}.settings-top>.card:last-child{order:3}#settings-view>.card{order:2}
 .padded{padding:16px}.padded>h2{margin-bottom:13px;font-size:17px}.supplier-chip button{min-height:44px;padding:6px 10px;font-size:12px}.supplier-chip{padding:5px 0}.supplier-head .hint,.supplier-head>.small{font-size:10px}
 .backup-actions button{min-height:48px}.table-title{gap:8px}.table-title>.small{display:none}
 .settings-scroll tr{padding:15px}.settings-scroll td:last-child{right:15px;top:12px}.settings-scroll td button{min-height:44px;padding:6px 15px;font-size:13px}
 .settings-scroll td[data-label]{font-size:13px;line-height:1.6}.settings-scroll td:first-child{padding-right:75px}
 footer{margin-top:16px;flex-direction:column;align-items:center;gap:3px;font-size:10px}
 dialog{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:94dvh;border-radius:16px 16px 0 0;border-bottom:0;overflow:hidden}
 #product-dialog[open]{display:flex}#product-form{display:flex;flex-direction:column;width:100%;max-height:94dvh}
 .dialog-head{flex-shrink:0;padding:12px 16px;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:18px}.icon-button{min-height:44px;min-width:44px}
 .dialog-body{padding:16px;max-height:calc(94dvh - 150px);min-height:0;overflow-y:auto;overscroll-behavior:contain}
 #product-dialog .dialog-body{flex:1;max-height:none}
 .dialog-foot{flex-shrink:0;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));gap:10px}
 .dialog-foot button{flex:1;min-height:48px;font-size:15px}
 .form-grid{gap:14px 12px}.form-grid label{font-size:13px}.form-grid input,.form-grid select{min-height:46px;font-size:16px;padding:9px 10px}
 .form-grid.three{gap:10px}.form-grid.three input{padding:9px 8px}
 .dialog-body h3{font-size:14px;margin:19px 0 10px}.dialog-body h3>.small{font-size:12px}
 .conversion-editor{padding:10px 12px;gap:10px;font-size:15px}.conversion-editor input{min-height:46px;font-size:18px;max-width:150px;padding:8px}
 #conversion-explain{font-size:11px;margin-top:8px}
 .spec-field{margin-top:17px}.spec-field input{min-height:46px}
 .checkbox{min-height:44px;margin-top:10px;font-size:13px}.checkbox input{width:20px;height:20px}
 #toast{bottom:calc(84px + env(safe-area-inset-bottom,0px));padding:11px 16px;font-size:12px}
}
@media(max-width:350px){
 main{padding-left:10px;padding-right:10px}.context{grid-template-columns:minmax(0,1fr) 67px;padding:12px;gap:8px}
 .date-line input{font-size:16px;padding:7px 4px}.date-line .pill{font-size:10px;padding:2px 4px}.progress-block{padding-left:8px}.progress-block strong{font-size:18px}
 .inventory-columns,.stock-row{grid-template-columns:minmax(0,1fr) 96px 65px;padding-left:11px;padding-right:11px;gap:6px}
 .stock-input input{font-size:17px}.item-name{font-size:14px}.item-detail{font-size:10px}.row-result.order{font-size:15px}
 .filters{padding-left:11px;padding-right:11px}.filters select{font-size:14px}.section-head #save-status{font-size:9px}
 .dialog-body,.dialog-head,.dialog-foot{padding-left:13px;padding-right:13px}.form-grid{gap:12px 9px}.form-grid.three{gap:8px}
}
@media(max-width:760px){
 .context>div:first-child{grid-column:1;grid-row:1}
 .context>.progress-block{grid-column:2;grid-row:1;align-self:center}
 .context>.context-rule{grid-row:2}
}
/* Supplier / material / history management. */
.supplier-list{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.supplier-management-row{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.supplier-management-row h2{font-size:16px;overflow-wrap:anywhere}.supplier-actions{display:flex;gap:8px}
.view-materials{width:100%;text-align:left;border:0;border-top:1px solid var(--line);border-radius:0;padding:10px 0 0;min-height:42px;font-size:12px;background:transparent}
.material-card>.section-head{padding-bottom:14px}.material-card .filters{padding-bottom:20px}
.management-tools{margin-top:18px}.management-tools>summary{padding:16px 20px;color:var(--muted);font-size:13px;cursor:pointer}
.management-tools .padded{padding-top:0}.management-tools #switch-mode{margin-bottom:10px;font-size:12px}
.history-entry{padding:18px 20px;margin-bottom:14px}.history-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.history-heading>strong{font-size:15px;overflow-wrap:anywhere}
.history-changes{border-top:1px solid var(--line);margin-top:12px;padding-top:4px}.history-changes>div{display:flex;align-items:start;gap:14px;padding:10px 0;font-size:13px}
.history-changes>div>span{color:var(--muted);min-width:85px;flex-shrink:0}.history-changes>div>div{display:flex;gap:10px;flex-wrap:wrap;overflow-wrap:anywhere;min-width:0}
.history-before{color:#8b9487}.history-arrow{color:#8ea77f}.history-changes strong{font-weight:550}.load-history{width:100%;margin-top:4px}
@media(max-width:760px){
 .top nav{gap:6px;padding-left:10px;padding-right:10px}.nav{min-width:0;font-size:13px;padding:8px 6px;white-space:nowrap}
 .prototype-banner{padding:8px 11px;min-height:40px;margin-bottom:14px}.prototype-banner #save-status{font-size:10px}
 #materials-view>.page-head{margin-bottom:14px}.material-card .section-head{padding:12px 14px 8px}.material-card .filters{padding:0 14px 14px}
 .supplier-list{gap:12px;margin-top:12px}.supplier-management-row{padding:15px;gap:10px}.supplier-management-row>div:first-child{min-width:0;flex:1}.supplier-management-row h2{font-size:15px}
 .supplier-actions button{min-height:44px;padding:6px 11px;font-size:12px}.supplier-actions{gap:4px}.view-materials{min-height:44px;padding-top:9px;font-size:12px}
 .management-tools{margin-top:14px}.management-tools>summary{padding:14px 16px;min-height:48px}.management-tools #switch-mode{min-height:44px}
 .history-entry{padding:15px;margin-bottom:12px}.history-heading>strong{font-size:14px}.history-changes>div{flex-direction:column;gap:4px;padding:10px 0;font-size:13px}.history-changes>div>span{font-size:11px}
 .history-changes>div>div{gap:8px}.history-changes strong{font-weight:550}.load-history{min-height:48px}
}
/* Inline material cards: no modal or navigation when editing. */
.material-toolbar>.section-head{padding-bottom:12px}.material-toolbar .filters{padding-bottom:18px}
.material-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px;align-items:start}
.material-editor{padding:20px;min-width:0}.material-editor:focus-within{border-color:#a9bca1}
.material-editor-title{display:flex;align-items:center;gap:10px;margin-bottom:16px}.material-editor-title>input{flex:1;min-width:0;font-size:18px;font-weight:650;min-height:46px}
.draft-badge{font-size:11px;color:#9b753a;white-space:nowrap}
.material-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.material-fields>div{min-width:0}.material-fields label{font-size:13px}
.material-fields input,.material-fields select{min-height:46px;font-size:16px}
.base-stock-input{display:flex;align-items:center;gap:8px;min-width:0}.base-stock-input input{flex:1;width:100px;min-width:0}.base-stock-input>span{font-size:12px;flex-shrink:0;max-width:40px;overflow-wrap:anywhere}
.conversion-field{grid-column:1/-1}.material-editor .conversion-editor{padding:9px 12px;gap:10px}.material-editor .conversion-editor input{max-width:160px;min-height:46px}
.material-extra{margin-top:14px;font-size:12px;color:var(--muted)}.material-extra>summary{cursor:pointer;padding:10px 0;min-height:40px}.material-extra>div{padding:8px 0}
.material-save{display:flex;gap:10px;border-top:1px solid var(--line);padding-top:14px;margin-top:12px}.material-save button{flex:1;min-height:46px}
.material-error{font-size:12px}.material-error:empty{display:none}.unit-review{margin-top:12px}.inactive-material{opacity:.75}
@media(max-width:760px){
 .material-toolbar>.section-head{padding:12px 13px 10px}.material-toolbar>.section-head>span:last-child{font-size:10px}
 .material-toolbar .filters{padding:0 13px 14px}
 .material-list{grid-template-columns:1fr;gap:14px;margin-top:14px}
 .material-editor{padding:15px}.material-editor-title{gap:8px;margin-bottom:14px}.material-editor-title>input{font-size:17px;min-height:46px;padding:8px 10px}
 .material-fields{gap:14px 12px}.material-fields label{font-size:12px;margin-bottom:6px;line-height:1.5}
 .material-fields input,.material-fields select{min-height:46px;font-size:16px;padding:9px 10px}
 .material-editor .conversion-editor{font-size:14px;gap:10px}.material-editor .conversion-editor input{font-size:17px;padding:8px;max-width:145px}
 .material-save{padding-top:12px;margin-top:10px}.material-save button{min-height:48px;font-size:14px}
 .material-extra>summary{min-height:44px;padding:11px 0}
}
@media(max-width:350px){
 .material-editor{padding:13px}.material-fields{gap:12px 10px}.material-fields label{font-size:11px}.material-fields input,.material-fields select{padding:9px 7px}
 .material-editor .conversion-editor{padding:9px 10px;gap:8px}.material-editor .conversion-editor input{max-width:125px}.base-stock-input{gap:5px}
}
/* Readable material form: aligned label/value rows, explicit field order. */
.material-editor{padding:18px 20px}
.material-editor-title{padding-bottom:10px;margin-bottom:2px;border-bottom:1px solid #e7ece5}
.material-editor-title>input{padding:4px 0;border:0;background:transparent;font-size:20px;font-weight:650;min-height:42px;border-radius:4px}
.material-editor-title>input:focus{background:#f6f9f3}
.material-fields{display:flex;flex-direction:column;gap:0}
.material-fields>div{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #edf0ea}
.material-fields>div>label{font-size:13px;font-weight:450;color:#5c6d62;line-height:1.6;margin:0}
.material-fields input,.material-fields select{font-size:16px;min-height:44px;font-weight:400;color:#243c30;border-color:#d7dfd3;background:#fff;border-radius:7px;padding:8px 10px}
.material-fields>.conversion-field{padding:0;margin:0;display:block}
.conversion-field>summary{cursor:pointer;font-size:12px;font-weight:450;color:#6c7b70;min-height:44px;padding:11px 0;line-height:1.7}
.conversion-field[open]>summary{color:#4b5d50;font-weight:500;padding-bottom:8px}
.material-editor .conversion-editor{margin-bottom:10px;background:#f5f7f1;border-color:#e3e8dc;gap:10px;padding:10px 12px;font-size:15px}
.material-editor .conversion-editor>span{font-weight:450}
.material-editor .conversion-editor input{min-height:44px;font-size:18px;font-weight:550;max-width:190px}
.material-extra{margin-top:0;border-top:1px solid #edf0ea}.material-extra>summary{font-size:12px;min-height:42px;padding:10px 0;color:#7a857b}
@media(max-width:760px){
 .material-list{gap:16px}
 .material-editor{padding:15px 17px}
 .material-editor-title{padding-bottom:9px;margin-bottom:2px}.material-editor-title>input{font-size:19px;min-height:40px;padding:3px 0}
 .material-fields>div{grid-template-columns:110px minmax(0,1fr);gap:12px;padding:10px 0}
 .material-fields>div>label{font-size:13px;font-weight:450}
 .material-fields input,.material-fields select{font-size:16px;min-height:44px;padding:8px 10px}
 .material-editor .conversion-editor{font-size:14px;gap:10px;padding:10px 12px}
 .material-editor .conversion-editor input{font-size:18px;max-width:185px}
 .material-fields>.conversion-field{padding:0}.conversion-field>summary{font-size:12px}
 .material-extra>summary{min-height:40px;padding:9px 0}
}
@media(max-width:350px){
 .material-editor{padding:13px 14px}.material-fields>div{grid-template-columns:95px minmax(0,1fr);gap:10px}
 .material-fields>div>label{font-size:12px}
 .material-fields input,.material-fields select{padding:8px 8px;font-size:16px}
 .material-editor .conversion-editor input{max-width:135px}
}
/* Always-open material fields and the complete unit equation on one line. */
.material-fields>.spec-field{margin-top:0}
.material-fields>.post-field{display:block;padding:12px 0}
.post-label{display:block;color:#5c6d62;font-size:13px;margin-bottom:8px}
.post-label small{font-size:11px;color:#7a857a;font-weight:400;margin-left:5px}
.post-options{display:flex;gap:8px;flex-wrap:wrap}
.post-options .post-choice{display:flex;align-items:center;gap:6px;margin:0;padding:8px 9px;min-height:44px;border:1px solid #dce3d6;border-radius:7px;font-size:12px;font-weight:450;cursor:pointer;color:#52644e;background:#fff}
.post-choice:has(input:checked){background:#edf4e7;border-color:#b8c9a6;color:#254c33}
.post-choice input{width:17px;height:17px;min-height:0;padding:0;margin:0;accent-color:var(--green);flex-shrink:0}
.material-fields>.unit-match-field{display:block;padding:12px 0}
.unit-match-heading{display:block;color:#5f6f60;font-size:13px;font-weight:550;line-height:1.5}
.unit-match-captions,.unit-match-row{display:grid;grid-template-columns:16px minmax(0,1.1fr) 14px minmax(0,.9fr) minmax(0,1.1fr);gap:7px;align-items:center}
.unit-match-captions{font-size:12px;color:#526450;text-align:center;margin:9px 0 5px}
.unit-match-captions>label{font-size:inherit;color:inherit;line-height:1.4;white-space:nowrap}
.unit-match-captions>label:nth-child(1){grid-column:2}.unit-match-captions>label:nth-child(2){grid-column:4}.unit-match-captions>label:nth-child(3){grid-column:5}
.unit-match-row>span{text-align:center;font-size:16px;font-weight:550;color:#38503d}
.unit-match-row>select,.unit-match-row>input{min-width:0;width:100%;min-height:46px;font-size:16px;text-align:center;padding:8px 6px}
.unit-match-row>input{font-weight:550}
.material-enabled{display:flex;align-items:center;gap:8px;min-height:44px;font-size:13px;font-weight:450;color:#54624f;margin:8px 0 0}
.material-enabled>input{width:19px;height:19px;min-height:0;padding:0;margin:0;accent-color:var(--green)}
.material-paper{font-size:11px;line-height:1.6;color:#8a927f;margin:2px 0 0}
.management-title{padding:15px 16px 8px;font-size:13px;color:var(--muted)}
@media(max-width:350px){
 .unit-match-captions,.unit-match-row{grid-template-columns:14px minmax(0,1.1fr) 12px minmax(0,.95fr) minmax(0,1.1fr);gap:5px}
 .unit-match-row>select,.unit-match-row>input{padding:8px 4px}
 .post-options{gap:6px}.post-options .post-choice{padding:8px 7px;font-size:12px;gap:5px}
}
/* Final compact card: one label column, one value column, one reading direction. */
.material-editor{padding:16px 18px;border-color:#e2e7dc}
.material-editor-title{border-bottom:1px solid #e5eade;padding-bottom:9px;margin-bottom:8px}
.material-editor-title>input{font-size:20px;font-weight:650;min-height:38px}
.material-fields>div{grid-template-columns:86px minmax(0,1fr);gap:10px;padding:7px 0;border-bottom:0}
.material-fields>div>label,.material-fields .post-label{color:#788271;font-size:13px;font-weight:400;line-height:1.5;margin:0}
.material-fields input,.material-fields select{border-color:#e9ede3;background:#fafbf8;border-radius:6px;font-size:16px;min-height:40px;padding:7px 9px;box-shadow:none}
.material-fields>.post-field{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;padding:7px 0}
.post-options{gap:4px 7px;align-items:center}
.post-options .post-choice{border:0;background:transparent;min-height:40px;padding:3px 0;font-size:13px;font-weight:450;gap:5px;white-space:nowrap;color:#48583f}
.post-choice:has(input:checked){background:transparent;border-color:transparent;color:#234b32}
.post-choice input{width:16px;height:16px;min-height:0;padding:0;border:0;margin:0;accent-color:var(--green)}
.post-legacy{flex-basis:100%;font-size:11px;color:#967447;line-height:1.6}
.material-fields>.unit-match-field{display:block;padding:10px 0 9px}
.unit-match-captions,.unit-match-row{grid-template-columns:16px minmax(0,1fr) 14px minmax(0,1fr) minmax(0,1fr);gap:6px}
.unit-match-row>span{font-size:16px;font-weight:450;color:#40513b}
.material-fields .unit-match-row>select{appearance:none;-webkit-appearance:none;background-color:#fafbf8;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M1 1l3 3 3-3' fill='none' stroke='%2374826a' stroke-width='1'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 4px center;background-size:8px 5px;padding:7px 12px 7px 4px;text-align:center;min-height:40px;font-size:16px}
.material-fields .unit-match-row>input{padding:7px 3px;min-height:40px;font-size:16px;font-weight:500;text-align:center}
.base-day{font-size:10px;color:#8b9582;white-space:nowrap;font-weight:400}
.material-enabled-row{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;align-items:center;margin:0;padding:7px 0;min-height:48px}
.material-enabled-row>label{color:#788271;font-size:13px;font-weight:400;margin:0}
.material-enabled-row>input{width:18px;height:18px;min-height:0;padding:0;margin:0;accent-color:var(--green);cursor:pointer;justify-self:start}
.material-save{border-top:0;padding-top:8px;margin-top:4px;justify-content:flex-end;gap:8px}
.material-save>button{flex:0 1 auto;padding:7px 14px;min-height:40px;font-size:13px}
@media(max-width:760px){
 .material-editor{padding:14px 15px}.material-editor-title>input{font-size:19px;min-height:38px}
 .material-fields>div,.material-fields>.post-field{grid-template-columns:78px minmax(0,1fr);gap:8px;padding:7px 0}
 .material-fields>.unit-match-field{padding:10px 0 9px}
 .material-fields>div>label,.material-fields .post-label,.material-enabled-row>label{font-size:13px;font-weight:400}
 .material-fields input,.material-fields select{font-size:16px;min-height:42px;padding:7px 8px}
 .post-options{gap:0 7px}.post-options .post-choice{font-size:13px;min-height:42px;padding:3px 0;gap:4px}
 .material-fields .unit-match-row>select,.material-fields .unit-match-row>input{min-height:42px}
 .material-enabled-row{grid-template-columns:78px minmax(0,1fr);gap:8px;padding:7px 0}
 .material-save>button{min-height:44px;font-size:13px;padding:7px 14px}
}
@media(max-width:350px){
 .material-editor{padding:13px 12px}.material-fields>div,.material-fields>.post-field,.material-enabled-row{grid-template-columns:72px minmax(0,1fr);gap:8px}
 .post-options{gap:0 7px}.post-options .post-choice{font-size:12px;gap:4px}
 .unit-match-captions,.unit-match-row{grid-template-columns:14px minmax(0,1fr) 12px minmax(0,1fr) minmax(0,1fr);gap:4px}
 .material-fields .unit-match-row>select{padding-left:2px;padding-right:10px;background-position:right 2px center}
 .base-day{font-size:9px}
}
@media(max-width:350px){.post-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 8px}}
.post-legacy{grid-column:1/-1}
/* Material filters stay legible on phones: search first, then two filter menus. */
.material-toolbar .material-filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,190px) minmax(150px,190px);gap:10px}
.material-toolbar .material-filters>input,.material-toolbar .material-filters>select{width:100%;min-width:0;font-size:14px}
@media(max-width:760px){
 .material-toolbar .material-filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .material-toolbar .material-filters>input{grid-column:1/-1}
 .material-toolbar .material-filters>input,.material-toolbar .material-filters>select{min-height:44px;font-size:16px}
}
/* A single surface makes the three parts of the conversion read as one equation. */
.unit-match-control{margin-top:8px;padding:8px 10px 9px;border:1px solid #dfe6d9;border-radius:8px;background:#fafbf8}
.unit-match-control:focus-within{border-color:#a7c7b6}
.unit-match-control .unit-match-captions{margin:0 0 3px}
.material-fields .unit-match-control .unit-match-row>select,.material-fields .unit-match-control .unit-match-row>input{border:0;border-radius:0;background-color:transparent;box-shadow:none}
.material-fields .unit-match-control .unit-match-row>select{background-color:transparent}
.material-fields .unit-match-control .unit-match-row>input{background:transparent}
@media(max-width:350px){.unit-match-control{padding-left:6px;padding-right:6px}}
/* One global rule for Saturday and Sunday, with no calculated example on the page. */
.rules-card{max-width:620px;padding:24px}
.rules-card>p{margin:5px 0 18px}
.rules-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0}
.rules-row label{margin:0;font-size:14px;color:#50614f}
.rules-input{display:flex;align-items:center;width:210px;max-width:60%;border:1px solid #dce4d8;border-radius:8px;background:#fafbf8;padding-right:13px}
.rules-input:focus-within{outline:2px solid #a7c7b6;outline-offset:1px}
.rules-input input{border:0;background:transparent;text-align:right;font-size:18px;font-weight:550;min-height:48px;outline:0;padding:8px 10px}
.rules-input span{font-size:14px;color:#627260;white-space:nowrap}
.rules-actions{display:flex;justify-content:flex-end;border-top:1px solid #edf0ea;margin-top:12px;padding-top:18px}
.rules-actions button{min-width:130px}
#rules-error:empty{display:none}
@media(max-width:760px){
 .top nav .nav{font-size:12px;padding:8px 2px}
 .rules-card{padding:18px 16px}
 .rules-card>p{margin-bottom:12px}
 .rules-input{width:170px}
 .rules-actions button{width:100%;min-height:48px}
}
@media(max-width:350px){.top nav{gap:3px;padding-left:7px;padding-right:7px}.top nav .nav{font-size:11px}}
/* The conversion amount is the editable cell inside the otherwise unified equation. */
.unit-match-captions .conversion-caption{display:flex;align-items:center;justify-content:center;gap:2px;cursor:text}
.material-fields .unit-match-control .unit-match-row>input[data-field="conversion"]{background:#fff;border:1px solid #b8c9b7;border-radius:6px;box-shadow:0 1px 3px #233d2512;font-weight:650;cursor:text;padding:7px 3px}
.material-fields .unit-match-control .unit-match-row>input[data-field="conversion"]:focus{border-color:#4d8b61;outline:2px solid #a7c7b6;outline-offset:1px}
/* Only the number is editable; its unit and day label sit outside the input border. */
.base-stock-input{gap:8px;background:transparent;border:0;padding:0;min-height:0}
.material-fields .base-stock-input>input{flex:1;width:100%;min-width:0;min-height:42px;padding:7px 9px;border:1px solid #d7dfd3;border-radius:6px;background:#fff;font-size:19px;font-weight:550;box-shadow:none}
.material-fields .base-stock-input>input:focus{border-color:#4d8b61;outline:2px solid #a7c7b6;outline-offset:1px}
.base-stock-input>span{max-width:none;color:#516249;font-size:14px;font-weight:450;white-space:nowrap}

}
