:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;--accent: #3b82f6;--accent-dim: rgba(59, 130, 246, .15);--border: rgba(255, 255, 255, .1);--bg-card: rgba(255, 255, 255, .03);--text-secondary: rgba(255, 255, 255, .6);--text-tertiary: rgba(255, 255, 255, .4)}*{box-sizing:border-box;margin:0}html,body,#root{min-height:100vh;background:#0a0a0a;color:#fafafa}.app{max-width:960px;margin:0 auto;padding:2rem 1.5rem 4rem}.header{text-align:center;margin-bottom:2.5rem}.header-tag{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;color:var(--text-tertiary);border:1px solid var(--border);padding:.2rem .55rem;border-radius:.25rem;margin-bottom:.75rem}.header h1{font-size:2rem;font-weight:700;letter-spacing:-.03em;margin-bottom:.5rem}.header p{color:var(--text-secondary);font-size:.95rem;max-width:36rem;margin:0 auto}.search-bar{margin-bottom:1.5rem}.search-bar input{width:100%;padding:.7rem 1rem;border-radius:.5rem;border:1px solid var(--border);background:#ffffff0a;color:#fafafa;font-size:.95rem;font-family:inherit;outline:none;transition:border-color .15s}.search-bar input::placeholder{color:var(--text-tertiary)}.search-bar input:focus{border-color:var(--accent)}.filters{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.75rem}.filter-btn{padding:.35rem .85rem;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--text-secondary);font-size:.8rem;font-family:inherit;cursor:pointer;transition:all .15s}.filter-btn:hover{border-color:#ffffff40;color:#fafafa}.filter-btn.active{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.materials-grid{display:flex;flex-direction:column;gap:.75rem}.material-card{border:1px solid var(--border);border-radius:.65rem;background:var(--bg-card);overflow:hidden;transition:border-color .15s}.material-card:hover{border-color:#fff3}.material-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;cursor:pointer;-webkit-user-select:none;user-select:none}.material-title-group{display:flex;align-items:center;gap:.75rem}.material-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.material-name{font-size:1.05rem;font-weight:600;letter-spacing:-.01em}.material-category{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--text-tertiary);background:#ffffff0f;padding:.15rem .5rem;border-radius:.2rem}.material-chevron{color:var(--text-tertiary);font-size:.85rem;transition:transform .2s}.material-chevron.open{transform:rotate(180deg)}.material-body{padding:0 1.25rem 1.25rem}.tip-box{background:#ffffff0a;border-left:3px solid var(--accent);padding:.65rem .9rem;border-radius:0 .35rem .35rem 0;margin-bottom:1rem;font-size:.85rem;color:var(--text-secondary);line-height:1.6}.tip-label{font-weight:600;color:var(--accent);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.25rem}.params-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.5rem}.param-box{background:#ffffff0a;border-radius:.4rem;padding:.65rem .85rem}.param-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.12em;color:var(--text-tertiary);margin-bottom:.2rem}.param-value{font-size:1rem;font-weight:600;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.param-unit{font-size:.75rem;font-weight:400;color:var(--text-tertiary);margin-left:.2rem}.empty{text-align:center;padding:3rem 1rem;color:var(--text-tertiary);font-size:.95rem}@media(max-width:600px){.app{padding:1.25rem 1rem 3rem}.header h1{font-size:1.5rem}.params-grid{grid-template-columns:1fr 1fr}}
