.shell>#view-materials{padding-top:0;background:#fafbf9}.material-banner{background:#c97128;color:#23312c;margin:0 -32px 22px;padding:26px 32px;min-height:140px}.material-banner h2{font-size:34px}.material-subtitle{font-size:16px;font-weight:600;margin:4px 0}.material-banner #materialCount{color:#374a3f;font-size:13px}.material-pages{display:flex;gap:24px;border-bottom:1px solid var(--line);margin-bottom:22px}.material-pages button{border:0;border-bottom:3px solid transparent;background:none;padding:12px 4px;font-size:18px;color:#66766d}.material-pages button.active{border-color:#3f7158;color:#264e3b;font-weight:700}.material-pages span{font-size:14px;margin-left:9px;color:#697c70}.material-query-band{display:grid;grid-template-columns:minmax(280px,380px) minmax(0,1fr);gap:24px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:20px}.material-fixed-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.material-fixed-fields label{font-size:14px}.material-category-rail{display:flex;gap:12px;overflow-x:auto;padding:4px 3px 12px;min-width:0}.material-category{flex:0 0 120px;width:120px;display:grid;gap:7px;padding:6px;border:1px solid #d5ded7;border-radius:6px;background:white;text-align:center}.material-category.active{outline:2px solid #8aa891;outline-offset:1px}.material-category>div{height:96px;overflow:hidden;background:#edf2ee;border-radius:3px}.material-category img{width:100%;height:100%;object-fit:contain}.material-category>strong{font-size:16px}.material-category>span{font-size:12px;color:#748579}.material-query-secondary{display:flex;gap:12px;align-items:end;flex-wrap:wrap;padding:20px 0;border-bottom:1px solid var(--line)}.material-query-secondary label{min-width:135px;flex:1}.material-query-secondary label:first-child{flex:2}.material-query-secondary button{margin-bottom:1px}.material-results-heading{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin:22px 0 18px}.material-results-heading h2{font-size:25px}.material-browser-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:18px}.material-browser-card{border:1px solid #dbe2db;border-radius:6px;background:white;overflow:hidden;min-width:0}.material-photo{width:100%;aspect-ratio:4/3;display:block;padding:0;border:0;background:#edf2ee}.material-photo img{display:block;width:100%;height:100%;object-fit:contain}.material-no-photo{display:flex;flex-direction:column;gap:10px;height:100%;justify-content:center;align-items:center;text-align:center;padding:12px;color:#526c5b;overflow-wrap:anywhere}.material-no-photo strong{font-size:22px}.material-category .material-no-photo strong{font-size:18px}.material-no-photo span{font-size:15px}.material-no-photo small{font-size:12px;color:#819186}.material-card-body{padding:14px;display:grid;gap:12px}.material-card-title{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.material-card-title h3{font-size:16px;overflow-wrap:anywhere}.material-card-title>span{font-size:12px;color:#557763;background:#eef4ef;padding:3px 5px;border-radius:3px}.material-supplier{font-size:14px;color:#6c7c72;overflow-wrap:anywhere}.material-card-body dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}.material-card-body dt{font-size:12px;color:#7d897f}.material-card-body dd{margin:4px 0 0;font-size:14px;overflow-wrap:anywhere}.material-composition{line-height:1.5;font-size:13px;overflow-wrap:anywhere}.material-card-actions{display:flex;gap:8px;flex-wrap:wrap}.material-card-actions button{font-size:13px;min-height:35px;padding:7px 10px}.material-linked-styles{display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:10px}.material-linked-styles .material-style-link{font-size:12px}.material-upload-preview:empty{display:none}.material-upload-preview img{display:block;width:160px;height:120px;object-fit:contain;background:#edf2ee}@media(max-width:1100px){.material-banner{margin-left:-24px;margin-right:-24px}.material-query-band{grid-template-columns:1fr}.material-fixed-fields{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:760px){.material-banner{margin-left:-16px;margin-right:-16px;padding:24px 16px}.material-banner h2{font-size:28px}.material-fixed-fields{grid-template-columns:1fr 1fr}.material-browser-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.material-card-body{padding:10px}.material-card-body dl{grid-template-columns:1fr}.material-card-title h3{font-size:14px}.material-query-secondary label{min-width:120px}.material-card-actions button{width:100%}.material-results-heading h2{font-size:22px}}
.shell>#view-materials{padding:16px 24px 24px}
.shell>#view-materials>.view-heading.material-banner{min-height:58px;padding:10px 14px;margin:0!important;gap:12px;flex-wrap:nowrap}
.shell>#view-materials>.view-heading.material-banner>div{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.shell>#view-materials>.view-heading.material-banner h2{font-size:22px;line-height:1.35}
.shell>#view-materials>.view-heading.material-banner #materialCount{margin:0;font-size:12px}
.shell>#view-materials>.view-heading.material-banner button{min-height:32px;padding:5px 12px;font-size:13px;white-space:nowrap}
#view-materials .material-compact-toolbar{display:flex;gap:18px;align-items:center;min-width:0;border-bottom:1px solid var(--line);padding:4px 0}
#view-materials .material-pages{flex:none;gap:16px;margin:0;border:0}
#view-materials .material-pages button{padding:8px 2px;font-size:14px;min-height:36px;white-space:nowrap}
#view-materials .material-pages span{font-size:12px;margin-left:5px}
#view-materials .material-category-rail{flex:1;gap:4px;padding:4px 2px;min-width:0;align-items:center}
#view-materials .material-category{flex:0 0 auto;width:auto;display:flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid transparent;border-radius:4px;min-height:30px;background:transparent;white-space:nowrap}
#view-materials .material-category strong{font-size:12px;font-weight:500}
#view-materials .material-category span{font-size:12px;color:#65746a}
#view-materials .material-category.active{outline:none;border-color:#84a996;background:#e7f2ec;color:#1b6244}
#view-materials .material-query-band{display:block;padding:8px 0 10px;border-bottom:1px solid var(--line)}
#view-materials .material-fixed-fields{display:grid;grid-template-columns:repeat(4,minmax(90px,1fr)) minmax(200px,1.7fr) repeat(2,minmax(105px,1fr)) auto;gap:8px;align-items:end}
#view-materials .material-fixed-fields label{font-size:12px;gap:4px;min-width:0}
#view-materials .material-fixed-fields input,#view-materials .material-fixed-fields select{min-width:0;width:100%;height:32px;min-height:32px;padding:5px 8px;font-size:13px}
#view-materials #resetMaterialQuery{min-height:32px;padding:5px 9px;font-size:12px;white-space:nowrap}
#view-materials .material-results-heading{gap:10px;margin:8px 0;align-items:center}
#view-materials .material-results-heading h2{font-size:14px;line-height:1.5}
#view-materials .material-results-heading .small{font-size:12px}
#view-materials .material-detail-table{max-height:calc(100dvh - 235px);overflow:auto;scrollbar-gutter:stable}
#view-materials .material-detail-table th,#view-materials .material-detail-table td{padding:8px 10px;font-size:13px}
#view-materials .material-detail-table th{position:sticky;top:0;z-index:2;background:#e8efeb}
#view-materials .material-detail-table thead th:first-child{z-index:3;background:#e8efeb}
#view-materials .material-detail-table .small{font-size:12px}
#view-materials .material-detail-table button{font-size:12px;min-height:28px;padding:4px 8px}
@media(max-width:1350px){#view-materials .material-fixed-fields{grid-template-columns:repeat(4,minmax(0,1fr))}#view-materials .material-detail-table{max-height:calc(100dvh - 292px)}}
@media(max-width:950px){#view-materials .material-compact-toolbar{display:block;padding-bottom:2px}#view-materials .material-category-rail{padding:2px 0 4px}#view-materials .material-detail-table{max-height:calc(100dvh - 328px)}}
@media(max-width:650px){.shell>#view-materials{padding:10px 12px 20px}.shell>#view-materials>.view-heading.material-banner{padding:10px;gap:8px}.shell>#view-materials>.view-heading.material-banner>div{gap:2px;flex-direction:column}.shell>#view-materials>.view-heading.material-banner h2{font-size:20px}#view-materials .material-fixed-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#view-materials .material-keyword-field{grid-column:1/-1}#view-materials #resetMaterialQuery{grid-column:1/-1}#view-materials .material-detail-table{max-height:none}#view-materials .material-results-heading{flex-wrap:wrap}}
