html,body{height:100%;margin:0;padding:0;font-family:Montserrat,sans-serif;background-color:#fff}body{font-size:85%;display:flex;flex-direction:column}header{background-color:#1d262e;color:#94a0ab;text-align:center;padding:1rem;flex-shrink:0}main{flex-grow:1;overflow-y:auto;padding:1rem}.sort-options{display:flex;justify-content:flex-end;align-items:center;margin-bottom:1rem;margin-right:1rem}.sort-options label{margin-right:.5rem}#sortSelect{width:250px;height:30px;border-radius:5px;border:1px solid;background-color:#fff;border-color:#dee3e6}.download-selected-button{width:auto;padding:0 35px;height:30px;border-radius:5px;margin-left:1rem;border:1px solid;border-color:#dee3e6;font-size:20px;cursor:pointer;transition:background-color .3s ease;position:relative;background-color:#fff}.download-selected-button:hover{color:#00ace2;background-color:#fff}.download-selected-button:hover:after{content:"Скачать выбранные компоненты";position:absolute;bottom:100%;right:0;transform:translateY(-5px);color:#000;border:1px solid rgb(222,227,230);background-color:#fff;padding:5px 10px;border-radius:3px;font-size:12px;white-space:nowrap;opacity:1;transition:opacity .3s ease;pointer-events:none;z-index:99999;box-shadow:0 2px 5px #0003}#memoryUsage{color:#fff}.info-button{position:fixed;margin-right:4rem;margin-top:.3rem;right:1rem;top:20px;width:50px;height:50px;border:rgb(222,227,230);border-radius:50%;background:transparent;border:none;font-size:20px;color:#94a0ab;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background-color .3s ease;font-family:Arial,sans-serif;font-style:bold;border-color:#3b82f680;font-weight:900}.info-button:hover{color:#00ace2}.dark-button{position:fixed;margin-right:4rem;margin-top:.3rem;right:1rem;top:42px;width:50px;height:50px;border-radius:50%;background:transparent;border:none;font-size:35px;color:#94a0ab;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background-color .3s ease;font-family:Arial,sans-serif;font-weight:900}.dark-button:hover{color:#00ace2}.info-modal{position:fixed;top:35%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;background-color:#333;color:#fff;padding:2.5rem;border-radius:5px;width:600px;height:fit-content;box-shadow:0 4px 8px #00000080;font-size:14px;line-height:1.4;overflow-y:auto;z-index:1001;text-align:center}.info-modal.content-wrapper{flex-direction:column}.info-modal a{color:inherit}.image-content-wrapper{display:flex;align-items:center;justify-content:center}.info-modal-image{height:100px;margin-right:1rem;padding-left:2rem;padding-right:2rem}.info-modal-text{flex:1}#noResultsMessage{font-size:2.5rem;color:#6666668e;text-align:center;padding:2rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%}.library{height:100%;margin:1rem 3rem 0 0}.component-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1.5rem}.component-tile{line-height:1;max-width:300px;width:85%;height:auto;display:flex;flex-direction:column;align-items:center;background-color:#fff;border:1px solid rgb(222,227,230);border-radius:5px;transition:box-shadow .3s ease;padding:1rem;text-align:center}.component-tile:hover{box-shadow:inset 0 0 0 1px #00ace2;border-color:#00ace2}.component-tile img{width:100%;aspect-ratio:16 / 9;object-fit:cover;filter:grayscale(100%)}.component-details{width:100%;padding:5px}.component-name{text-align:left;margin:5px 0 0;font-size:1em;font-weight:700}.gray-info{text-align:left;font-size:1em;margin:2px 0;line-height:1.2}.filters{width:300px;background-color:#fff;margin:2rem 4rem .5rem;padding:1rem;border-radius:7px;border:1px solid rgb(222,227,230);box-shadow:0 2px 5px #0000001a;overflow-y:auto;display:flex;flex-direction:column;line-height:.8;color:#000}.filters:hover{border-color:#b6b9bb}.filters{padding:0 0 0 20px;border:1px solid rgb(222,227,230);text-align:left;box-sizing:border-box;display:flex;flex-direction:column;max-height:90vh;background-color:#fff}.filter-section{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#c6c6c6 #f1f1f1;border-radius:7px}.filter-section::-webkit-scrollbar{width:0;transition:width .3s ease}.filter-section::-webkit-scrollbar-track{background:#f1f1f1}.filter-section::-webkit-scrollbar-thumb{background:#888;border-radius:7px}.filter-section::-webkit-scrollbar-thumb:hover{background:#555}.filter-category{margin-top:.25rem}.filter-subcategory{margin-left:1.5rem}.filter-category h3{margin-top:1.4rem;margin-bottom:.5rem}.filter-options label{margin-left:.5rem;cursor:pointer}.filter-header{padding-top:15px;display:flex;justify-content:space-between;align-items:center;margin-bottom:-.5rem}.content-wrapper{flex-grow:1;display:flex;overflow-y:auto;border-radius:7px;background-color:#fff;overflow:hidden}#resetFilters{padding:.5rem 1rem;background-color:#f44336;color:#fff;border:none;border-radius:3px;cursor:pointer;margin-bottom:.3rem;margin-right:1.3rem;font-size:.9rem}#resetFilters:hover{background-color:#d32f2f}.filter-divider{border:0;height:1px;background-color:#ccc;margin:10px 15% 10px 0}.filter-toggle{display:none;position:fixed;left:10px;top:10px;z-index:1001;background-color:#808080cc;color:#fff;border:none;border-radius:50px;padding:15px 20px;font-size:18px;font-weight:700;cursor:pointer;transition:background-color .3s ease}.filter-toggle:hover{background-color:#646464e6}.filter-textsearch{margin-top:15px;margin-bottom:-8px}.filter-textsearch input{width:75%;padding:4px;border:1px solid #ccc;border-radius:4px;box-sizing:border-box}.filter-textsearch input:hover{border-color:#888}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center}.modal-scroll-container{width:60%;max-width:60vw;max-height:90vh;overflow-y:auto;border-radius:15px;background-color:#fff;overflow:hidden}.modal-content{padding:20px;border:1px solid rgb(222,227,230);text-align:left;box-sizing:border-box;display:flex;flex-direction:column;max-height:90vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#888 #f1f1f1}.modal-content::-webkit-scrollbar{width:8px}.modal-content::-webkit-scrollbar-track{background:#f1f1f1}.modal-content::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.modal-content::-webkit-scrollbar-thumb:hover{background:#555}.modal-inner{min-height:40vh;flex:1;overflow:hidden}.modal-content p{margin-left:5%;margin-right:5%;margin-top:10px;display:flex;align-items:flex-start}.modal-content p strong{flex:0 0 300px;margin-right:0}.modal-content p span{flex:1;padding-left:0}#modal-image{max-height:40vh;width:auto;display:block;margin:15px auto 0}#modal-text,#modal-link{text-align:left;margin-top:10px;position:relative}.modal-content hr{border:0;height:1px;background:#ccc;margin:25px 7% 30px}#modal-link a{color:#000;text-decoration:underline}.modal-buttons{display:flex;justify-content:flex-end;position:absolute;right:5%}.modal-buttons a,.modal-buttons button{margin-left:5px}.view-3d-button{display:inline-block;padding:.9rem 1.7rem;border-radius:7px;font-size:.9 rem;cursor:pointer;transition:background-color .3s ease;text-align:center;text-decoration:none;margin-right:5%;color:#000;border:1px solid rgb(222,227,230)}.view-3d-button-inactive,.view-3d-button-active{color:#000;background-color:#fff}.view-3d-button:hover{color:#00ace2;background-color:#fff}.download-button{display:block;padding:.9rem 1.7rem;background-color:#fff;color:#000;border:none;border-radius:5px;text-decoration:none;font-size:.9rem;cursor:pointer;transition:background-color .3s ease;text-align:center;margin-right:5%;border:1px solid;border-color:#dee3e6}.download-button:hover{color:#00ace2;background-color:#fff}.info-icon{display:inline-block;width:18px;height:18px;border-radius:50%;background-color:#5ba5f5;color:#fff;text-align:center;line-height:18px;font-size:12px;cursor:help;transition:background-color .3s ease}.info-icon:hover{background-color:#0056b3}