.material-summary{display:flex;justify-content:space-between;align-items:center;gap:24px;border:1px solid var(--border);border-left:4px solid var(--brand);border-radius:20px;padding:28px 32px;background:var(--surface);margin-bottom:24px}
.material-eyebrow{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--secondary)}
.material-summary h2{font-size:26px;line-height:1.3;letter-spacing:-.04em;margin:12px 0 10px}.material-summary p{margin:0;color:var(--secondary)}
.material-summary-avatar{width:72px;height:72px;object-fit:contain;border-radius:50%;flex-shrink:0}
.material-toolbar{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin-bottom:16px}.material-toolbar>label{display:grid;gap:5px;font-size:12px;color:var(--secondary)}
.material-toolbar select{min-width:110px;max-width:180px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);padding:9px 12px;min-height:42px}
.material-toolbar .material-search{display:flex;align-items:center;gap:10px;flex:1;min-width:220px;height:42px;border:1px solid var(--border);border-radius:9px;padding:0 12px;background:var(--surface)}
.material-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font-size:14px}.material-search:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.material-note{display:flex;gap:8px;align-items:start;color:var(--secondary);font-size:12px;max-width:100ch}.material-note .icon{flex-shrink:0;margin-top:2px}.material-result-count{font-size:12px;color:var(--secondary);margin:18px 0 12px}
.material-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.material-card{min-width:0;overflow:hidden;border:1px solid var(--border);border-radius:16px;background:var(--surface);display:flex;flex-direction:column}
.material-preview{width:100%;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;border:0;border-bottom:1px solid var(--border);padding:12px;background:var(--raised);overflow:hidden}
.material-preview img{width:100%;height:100%;object-fit:contain;display:block}.material-preview:hover{background:var(--hover)}
.material-preview:has(img),.material-preview:has(img):hover{background:#f3f0e8}
.material-document{gap:12px;flex-direction:column;color:var(--secondary)}.material-document>.icon{width:42px;height:42px}
.material-body{padding:18px;display:flex;flex-direction:column;flex:1}.material-meta{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--secondary)}
.material-body h2{font-size:16px;line-height:1.45;margin:10px 0 8px;overflow-wrap:anywhere}.material-body p{color:var(--secondary);font-size:12px;line-height:1.65;margin:0 0 12px;min-height:3.3em}.material-spec{font-size:11px;color:var(--secondary);font-variant-numeric:tabular-nums}
.material-tags{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 18px}.material-tags span{font-size:10px;background:var(--raised);padding:2px 7px;border-radius:5px;color:var(--secondary)}.material-actions{margin-top:auto;gap:7px;flex-wrap:wrap}.material-actions .btn{font-size:11px;padding:7px 9px;min-height:34px}
.material-modal-image{display:flex;justify-content:center;background:#f3f0e8;border-radius:12px;padding:12px;margin-bottom:18px}.material-modal-image img{max-width:100%;max-height:65vh;object-fit:contain}
.material-detail{display:grid;grid-template-columns:80px minmax(0,1fr);gap:8px;font-size:13px;margin:18px 0}.material-detail dt{color:var(--secondary)}.material-detail dd{margin:0;overflow-wrap:anywhere}
@media(max-width:760px){.material-search input,.material-toolbar select{font-size:16px}}
@media(min-width:1700px){.material-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.material-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.material-grid{grid-template-columns:minmax(0,1fr)}.material-summary{padding:22px}.material-summary h2{font-size:22px}.material-summary-avatar{display:none}.material-toolbar{gap:10px}.material-toolbar .material-search{flex-basis:100%}.material-toolbar>label{flex:1;min-width:0}.material-toolbar select{min-width:0;max-width:none;width:100%}.material-body{padding:16px}.material-body p{min-height:0}}
