.staff-material h2{font-size:19px}.material-location{font-size:12px;color:var(--muted);margin:0 0 12px}.material-room{margin-top:16px}.material-room h3{font-size:14px;margin:0 0 8px}.material-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.material-tile{aspect-ratio:1;min-width:0;padding:9px;border:1px solid var(--stone);border-radius:12px;background:var(--paper);color:var(--olive);display:grid;place-items:center}.material-tile.selected{border:2px solid #218549;background:#e7f5eb}.material-tile img,.material-tile svg{width:100%;height:100%;object-fit:contain;max-height:110px}.material-tile:focus-visible{outline:3px solid var(--bronze);outline-offset:2px}.employee .material-send{width:100%;margin-top:15px;font-size:16px;min-height:48px}.material-order{font-size:12px;padding:12px 0;border-bottom:1px solid var(--stone)}.material-order p{margin:4px 0}.material-quantity{width:min(94vw,440px);max-height:90dvh;overflow:auto;border:1px solid var(--stone);border-radius:17px;background:var(--paper);color:var(--ink);padding:20px}.material-quantity::backdrop{background:#0008}.material-quantity-image{height:85px;text-align:center;color:var(--olive)}.material-quantity-image img,.material-quantity-image svg{height:100%;max-width:140px;object-fit:contain}.material-quantity h2{text-align:center;font-size:19px;margin:10px 0 18px}.quantity-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px}.quantity-field>label{font-size:12px;min-height:65px;text-align:center}.quantity-field small{display:block;color:var(--muted)}.quantity-wheel{height:120px;position:relative;border:1px solid var(--stone);border-radius:10px;overflow:hidden}.quantity-center{position:absolute;inset:40px 0;border-block:1px solid #7bb78b;background:#c1dfcb44;pointer-events:none}.quantity-scroll{height:120px;overflow-y:auto;overscroll-behavior:contain;scroll-snap-type:y mandatory;scrollbar-width:none;padding-block:40px;touch-action:pan-y}.quantity-scroll::-webkit-scrollbar{display:none}.quantity-scroll button{display:block;height:40px;width:100%;padding:0;border:0;background:transparent;color:var(--muted);font-size:19px;scroll-snap-align:center;line-height:40px;min-height:40px}.quantity-scroll button.active{font-size:26px;font-weight:650;color:var(--ink)}.material-dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.material-dialog-actions>.btn:first-child{background:#218549;color:white}.material-remove{display:block;margin:14px auto 0;background:transparent;border:0;color:#b3302a;font-size:12px}.material-admin-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px}.material-admin-list>button{display:flex;gap:10px;align-items:center;text-align:start;background:var(--paper);color:var(--ink);border:1px solid var(--stone);padding:8px;border-radius:9px}.material-admin-list img,.material-admin-list svg{width:55px;height:55px;object-fit:contain;color:var(--olive)}.material-admin-list small{display:block}.material-catalog-options,.periodic-options{display:flex;gap:8px 16px;flex-wrap:wrap;margin:10px 0}.material-catalog-options label,.periodic-options label{display:inline-flex;align-items:center;gap:7px;font-size:13px}.periodic-task-panel{border:1px solid #d9bb70;border-radius:9px;padding:12px;margin:12px 0;background:#fff7df;color:#503c12}.periodic-task-panel h3{font-size:16px}.periodic-task-panel article{padding:8px 0}.periodic-task-panel article+article{border-top:1px solid #d9bb70}.periodic-task-panel span{display:block;font-size:12px}.periodic-task-panel p{font-size:13px;margin:5px 0;white-space:pre-wrap}.periodic-occurrence summary{display:flex;justify-content:space-between;gap:12px}.periodic-occurrence select{width:100%}.periodic-occurrence form{max-width:500px;margin:12px 0}.employee-mode:has(.staff-sticky-header) input,.employee-mode:has(.staff-sticky-header) button{scroll-margin-top:145px}html[data-theme=dark] .material-tile.selected{background:#1c4d30}html[data-theme=dark] .periodic-task-panel{background:#433719;color:#f8e8b8}html[data-theme=dark] .material-dialog-actions>.btn:first-child{background:#218549}

.quantity-scroll button{scroll-margin:0!important}
/* Fixed square media slots; labels cannot shrink or stretch product photos. */
.material-admin-list img,.material-admin-list svg{flex:0 0 64px;width:64px;height:64px;aspect-ratio:1;object-fit:contain;box-sizing:border-box}.material-admin-list>button>span{min-width:0;overflow-wrap:anywhere}.material-tile img,.material-tile svg{width:100%;height:auto;aspect-ratio:1;max-height:none;object-fit:contain;min-width:0}.material-quantity-image{width:96px;height:96px;aspect-ratio:1;margin-inline:auto}.material-quantity-image img,.material-quantity-image svg{width:100%;height:100%;object-fit:contain}.material-image-editor{margin-block:14px;padding:14px;border:1px solid var(--stone);border-radius:12px}.material-image-editor[hidden]{display:none}.material-image-editor canvas{display:block;width:min(100%,260px);height:auto;aspect-ratio:1;margin:0 auto 14px;border:1px solid var(--stone);border-radius:8px;background:repeating-conic-gradient(#e5e5e5 0% 25%,white 0% 50%) 0/18px 18px}.material-image-editor input[type=range]{width:100%;touch-action:pan-y}.material-image-actions{display:flex;gap:8px;flex-wrap:wrap;margin-block:12px}.material-image-actions button{min-height:44px}.material-image-editor output{font-variant-numeric:tabular-nums}.material-image-editor h3{margin-top:0}
.material-image-editor{display:grid;grid-template-columns:minmax(180px,260px) minmax(0,1fr);gap:8px 20px;align-items:start}.material-image-editor h3{grid-column:1/-1;margin-bottom:0}.material-image-editor canvas{grid-column:1;grid-row:2/7;margin:0;width:100%}.material-image-editor>label,.material-image-editor>.material-image-actions,.material-image-editor>p{grid-column:2;margin:0}.material-image-editor .material-image-actions{margin-block:4px}.material-image-editor [hidden]{display:none}@media(max-width:600px){.material-image-editor{display:block}.material-image-editor canvas{width:min(100%,240px);margin:10px auto}.material-image-editor>label,.material-image-editor>p{margin-block:10px}}
.material-image-editor canvas.material-pick-hole{cursor:crosshair;outline:2px solid #218549;outline-offset:2px}.material-image-editor [data-holes][aria-pressed=true]{background:#218549;color:white}.material-image-editor canvas{touch-action:pan-y}

/* Article detail is 2.5 times its originating tile, with scrollable height. */
.material-quantity{box-sizing:border-box;width:min(calc(100vw - 24px),max(440px,calc(var(--material-detail-image-size,240px) + 40px)));max-height:92dvh;overflow-y:auto;overflow-x:hidden}.material-quantity-image{width:min(100%,var(--material-detail-image-size,240px));height:auto;aspect-ratio:1;margin-inline:auto}.material-quantity-image img,.material-quantity-image svg{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain}.quantity-field>label{min-height:90px;display:flex;flex-direction:column;gap:4px;margin:0 0 8px;line-height:1.3}.quantity-field>label strong{font-size:13px;font-weight:650}.quantity-help{display:block;font-size:11px;color:var(--muted)}.quantity-columns{align-items:start}
.material-quantity-image{line-height:0}.material-quantity-image img,.material-quantity-image svg{display:block}

.quantity-field>label{min-height:102px;gap:8px;margin-bottom:12px;justify-content:space-between}.quantity-field>label .quantity-help{margin-top:0;line-height:1.4;min-height:31px;display:flex;align-items:center;justify-content:center}
