.App{max-width:1200px;margin:0 auto;padding:20px}header{text-align:center;margin-bottom:50px}header h1{color:#fff;font-size:2.5rem;font-weight:300;text-shadow:0 2px 4px rgba(0,0,0,.3)}.search-section{margin-bottom:50px}.search-container{background:#fff;border-radius:12px;padding:20px 30px;box-shadow:0 10px 30px #0003;max-width:800px;margin:0 auto}.search-row{display:flex;gap:15px;align-items:center}.search-engine-selector{flex-shrink:0}.search-engine-selector select{width:150px;padding:10px;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;background:#fff;cursor:pointer;transition:border-color .3s}.search-engine-selector select:focus{outline:none;border-color:#667eea}.search-input-container{display:flex;gap:10px;flex:1;align-items:center}.search-input-container input{flex:1;padding:15px;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;transition:border-color .3s}.search-input-container input:focus{outline:none;border-color:#667eea}.search-input-container button{padding:15px 30px;background:linear-gradient(135deg,#4a5db8,#5a3d7a);color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer;transition:transform .2s,box-shadow .2s}.search-input-container button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}.navigation-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 10px 30px #0003}.navigation-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:15px;border-bottom:2px solid #f0f0f0}.navigation-header h2{color:#333;font-size:1.5rem}.btn-primary,.btn-secondary{padding:10px 20px;border:none;border-radius:6px;font-size:14px;cursor:pointer;transition:all .3s;margin-left:10px}.btn-primary{background:linear-gradient(135deg,#4a5db8,#5a3d7a);color:#fff}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 3px 10px #667eea66}.btn-secondary{background:#f0f0f0;color:#333}.btn-secondary:hover{background:#e0e0e0}.categories-container{display:flex;flex-direction:column;gap:20px}.category{background:#f8f9fa;border-radius:10px;padding:20px;transition:transform .3s,box-shadow .3s}.category:hover{transform:translateY(-3px);box-shadow:0 5px 20px #0000001a}.category-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:2px solid #e9ecef}.category-title{font-size:1.1rem;font-weight:600;color:#333}.delete-category{background:#8d67e6;color:#fff;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;transition:background .3s}.delete-category:hover{background:#37138a}.category-actions{display:flex;gap:5px;align-items:center}.edit-category{background:#8d67e6;color:#fff;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;transition:background .3s}.edit-category:hover{background:#37138a}.category-edit{display:flex;align-items:center;gap:8px;flex:1}.category-edit-input{flex:1;padding:8px;border:2px solid #667eea;border-radius:6px;font-size:16px;font-weight:600}.category-edit-actions{display:flex;gap:5px}.save-btn{background:#28a745;color:#fff;border:none;width:28px;height:28px;border-radius:4px;cursor:pointer;font-size:14px}.cancel-btn{background:#dc3545;color:#fff;border:none;width:28px;height:28px;border-radius:4px;cursor:pointer;font-size:14px}.websites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:15px}.website-item{text-align:center;text-decoration:none;color:#333;transition:transform .2s;position:relative;cursor:pointer;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.website-item:hover .website-actions{opacity:1}.website-item.dragging{opacity:.5;transform:scale(.95);cursor:grabbing}.website-item.drag-over{background:#667eea1a;border:2px dashed #667eea;transform:scale(1.05)}.category-wrapper.dragging{opacity:.5;transform:scale(.98);cursor:grabbing}.category-wrapper.drag-over{background:#667eea1a;border:2px dashed #667eea;border-radius:8px;padding:10px;margin:-10px}.category-wrapper{cursor:grab;transition:all .2s ease;border-radius:8px}.category-wrapper:hover{transform:translateY(-2px)}.website-item{cursor:grab;border-radius:8px;padding:10px;transition:all .2s ease}.website-item:hover{transform:scale(1.05)}.icon-container{position:relative;width:40px;height:40px;margin:0 auto 5px}.refreshing-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:16px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.website-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 5px;font-size:18px;overflow:hidden}.website-icon img{width:100%;height:100%;border-radius:50%;object-fit:cover}.website-icon span{color:#2d3748;font-size:20px;text-shadow:0 2px 4px rgba(0,0,0,.15);font-weight:700}.website-icon img.loading{opacity:.5}.website-name{font-size:12px;word-break:break-all;line-height:1.2;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;color:#333}.website-actions{position:absolute;top:-5px;right:-5px;display:flex;gap:2px;opacity:0;transition:opacity .3s}.refresh-icon{background:#28a745;color:#fff;border:none;width:16px;height:16px;border-radius:50%;cursor:pointer;font-size:8px;display:flex;align-items:center;justify-content:center;transition:transform .2s}.refresh-icon:hover{transform:rotate(180deg)}.delete-website{background:#dc3545;color:#fff;border:none;width:16px;height:16px;border-radius:50%;cursor:pointer;font-size:8px;display:flex;align-items:center;justify-content:center}.edit-website{background:#17a2b8;color:#fff;border:none;width:16px;height:16px;border-radius:50%;cursor:pointer;font-size:8px;display:flex;align-items:center;justify-content:center;transition:background .3s}.edit-website:hover{background:#138496}.toggle-edit{background:#ffc107;color:#212529;border:none;width:16px;height:16px;border-radius:50%;cursor:pointer;font-size:8px;display:flex;align-items:center;justify-content:center;transition:all .3s;font-weight:700}.toggle-edit:hover{background:#e0a800;transform:scale(1.1)}.toggle-edit.active{background:#28a745;color:#fff}.website-edit{width:100%;text-align:center;margin-top:5px}.website-edit-input{width:100%;padding:4px 8px;border:2px solid #667eea;border-radius:4px;font-size:12px;text-align:center;margin-bottom:4px}.website-edit-actions{display:flex;gap:4px;justify-content:center}.modal{display:block;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#00000080;animation:fadeIn .3s}.modal-content{background-color:#fff;margin:10% auto;padding:30px;border-radius:12px;width:90%;max-width:500px;position:relative;animation:slideIn .3s}.close{position:absolute;right:20px;top:15px;font-size:28px;font-weight:700;cursor:pointer;color:#aaa;transition:color .3s}.close:hover{color:#333}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333}.form-group input,.form-group select{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;transition:border-color .3s}.form-group input:focus,.form-group select:focus{outline:none;border-color:#667eea}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:30px}.form-actions button{padding:12px 24px;border:none;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 768px){.App{padding:10px}header h1{font-size:2rem}.search-container{padding:15px 20px}.search-row{flex-direction:column;gap:10px}.search-engine-selector select{width:100%}.navigation-header{flex-direction:column;align-items:stretch;gap:15px}.navigation-header h2{text-align:center}.websites-grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr))}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#4a5db8,#5a3d7a);min-height:100vh;color:#333;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}#root{max-width:1200px;margin:0 auto;padding:20px}