*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;color:#333;background-color:#f8fafc}.container{max-width:1200px;margin:0 auto;padding:0 20px}.header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:1rem 0;box-shadow:0 2px 10px rgba(0,0,0,.1);position:-webkit-sticky;position:sticky;top:0;z-index:100}.header-content{justify-content:space-between}.header-content,.logo{display:flex;align-items:center}.logo{gap:.5rem}.logo h1,.logo i{font-size:1.5rem}.logo h1{font-weight:700}.nav{display:flex;gap:2rem}.nav-link{color:#fff;text-decoration:none;font-weight:500;transition:opacity .3s ease;position:relative}.nav-link.active,.nav-link:hover{opacity:.8}.nav-link.active:after{content:"";position:absolute;bottom:-.5rem;left:0;right:0;height:2px;background:#fff}.main{min-height:calc(100vh - 200px);padding:2rem 0}.hero{text-align:center;padding:3rem 0;background:linear-gradient(135deg,#f093fb,#f5576c);border-radius:20px;color:#fff;margin:0 20px 3rem}.hero-content h2{font-size:2.5rem;font-weight:700;margin-bottom:1rem}.hero-content p{font-size:1.2rem;opacity:.9;margin-bottom:1.5rem}.hero-badge{display:inline-flex;align-items:center;gap:.5rem;background:hsla(0,0%,100%,.2);padding:.75rem 1.5rem;border-radius:25px;border:1px solid hsla(0,0%,100%,.3);font-weight:500;font-size:.9rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.hero-badge:hover{background:hsla(0,0%,100%,.3);transform:translateY(-2px)}.hero-badge i{font-size:1rem}.search-container,.search-section{margin-bottom:2rem}.search-container{background:#fff;padding:2rem;border-radius:15px;box-shadow:0 4px 20px rgba(0,0,0,.1)}.search-box{position:relative;margin-bottom:1.5rem}.search-box i{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#666;font-size:1.1rem}.search-box input{width:100%;padding:1rem 1rem 1rem 3rem;border:2px solid #e2e8f0;border-radius:10px;font-size:1rem;transition:all .3s ease;background:#f8fafc}.search-box input:focus{outline:none;border-color:#667eea;background:#fff;box-shadow:0 0 0 3px rgba(102,126,234,.1)}.clear-btn{position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:none;border:none;color:#666;cursor:pointer;padding:.5rem;border-radius:50%;transition:all .3s ease}.clear-btn:hover{background:#f1f5f9;color:#333}.filter-controls{display:flex;gap:1rem;flex-wrap:wrap}.filter-controls select{padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:8px;background:#fff;font-size:.9rem;cursor:pointer;transition:all .3s ease;min-width:150px}.filter-controls select:focus{outline:none;border-color:#667eea}.stats-section{margin-bottom:2rem}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-gap:1.5rem;gap:1.5rem}.stat-card{background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.1);display:flex;align-items:center;gap:1rem;transition:transform .3s ease}.stat-card:hover{transform:translateY(-2px)}.stat-card i{font-size:2rem;color:#667eea}.stat-content h3{font-size:1.5rem;font-weight:700;color:#333;margin-bottom:.25rem}.stat-content p{color:#666;font-size:.9rem}.domains-section{background:#fff;border-radius:15px;padding:2rem;box-shadow:0 4px 20px rgba(0,0,0,.1)}.domains-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.domains-header h3{font-size:1.5rem;font-weight:600;color:#333}.view-controls{display:flex;gap:.5rem}.view-btn{padding:.5rem;border:2px solid #e2e8f0;background:#fff;border-radius:6px;cursor:pointer;transition:all .3s ease;color:#666}.view-btn.active,.view-btn:hover{border-color:#667eea;color:#667eea;background:#f8fafc}.loading-spinner{text-align:center;padding:3rem;color:#666}.loading-spinner i{font-size:2rem;margin-bottom:1rem;color:#667eea}.domains-container{margin-bottom:2rem}.grid-view{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:1.5rem;gap:1.5rem}.list-view{display:flex;flex-direction:column;gap:1rem}.domain-card{background:#f8fafc;border:2px solid #e2e8f0;border-radius:12px;padding:1.5rem;transition:all .3s ease;cursor:pointer;position:relative;overflow:hidden}.domain-card:hover{border-color:#667eea;transform:translateY(-2px);box-shadow:0 8px 25px rgba(102,126,234,.15);background:#fff}.domain-card:active{transform:translateY(0);box-shadow:0 4px 15px rgba(102,126,234,.2)}.domain-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);transform:scaleX(0);transition:transform .3s ease}.domain-card:hover:before{transform:scaleX(1)}.domain-name{font-size:1.1rem;font-weight:600;color:#333;margin-bottom:.5rem;word-break:break-all}.domain-url{color:#667eea;text-decoration:none;font-size:.9rem;display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.domain-url:hover{text-decoration:underline}.domain-category{display:inline-block;background:#667eea;color:#fff;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:500}.domain-actions{margin-top:1rem;display:flex;gap:.5rem}.action-btn{padding:.5rem 1rem;border:1px solid #e2e8f0;background:#fff;border-radius:6px;cursor:pointer;font-size:.8rem;transition:all .3s ease;color:#666}.action-btn:hover{border-color:#667eea;color:#667eea}.list-view .domain-card{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem}.list-view .domain-info{display:flex;align-items:center;gap:1rem;flex:1 1}.list-view .domain-name{margin-bottom:0;min-width:200px}.list-view .domain-url{margin-bottom:0;min-width:150px}.list-view .domain-actions{margin-top:0}.no-results{text-align:center;padding:3rem;color:#666}.no-results i{font-size:3rem;margin-bottom:1rem;color:#cbd5e0}.no-results h3{font-size:1.5rem;margin-bottom:.5rem;color:#4a5568}.pagination{justify-content:space-between;margin-top:2rem;padding-top:2rem;border-top:1px solid #e2e8f0}.pagination,.pagination-btn{display:flex;align-items:center}.pagination-btn{padding:.75rem 1.5rem;border:2px solid #e2e8f0;background:#fff;border-radius:8px;cursor:pointer;font-weight:500;transition:all .3s ease;gap:.5rem}.pagination-btn:hover:not(:disabled){border-color:#667eea;color:#667eea}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.pagination-info{color:#666;font-weight:500}.footer{background:#2d3748;color:#fff;padding:3rem 0 1rem;margin-top:3rem}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-gap:2rem;gap:2rem;margin-bottom:2rem}.footer-section h4{font-size:1.2rem;margin-bottom:1rem;color:#e2e8f0}.footer-section p{color:#a0aec0;line-height:1.6}.footer-section ul{list-style:none}.footer-section ul li{margin-bottom:.5rem}.footer-section ul li a{color:#a0aec0;text-decoration:none;transition:color .3s ease}.footer-section ul li a:hover{color:#fff}.social-links{display:flex;gap:1rem}.social-link{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;background:#4a5568;border-radius:50%;color:#fff;text-decoration:none;transition:all .3s ease}.social-link:hover{background:#667eea;transform:translateY(-2px)}.footer-bottom{text-align:center;padding-top:2rem;border-top:1px solid #4a5568;color:#a0aec0}@media (max-width:768px){.header-content{flex-direction:column;gap:1rem}.nav{gap:1rem}.hero-content h2{font-size:2rem}.hero-content p{font-size:1rem}.search-container{padding:1.5rem}.filter-controls{flex-direction:column}.filter-controls select{min-width:100%}.domains-header{flex-direction:column;align-items:flex-start}.grid-view{grid-template-columns:1fr}.list-view .domain-card{flex-direction:column;align-items:flex-start;gap:1rem}.list-view .domain-info{flex-direction:column;align-items:flex-start;gap:.5rem}.list-view .domain-name,.list-view .domain-url{min-width:auto}.pagination{flex-direction:column;gap:1rem}.footer-content{grid-template-columns:1fr;text-align:center}}@media (max-width:480px){.container{padding:0 15px}.hero{margin:0 15px 3rem;padding:2rem 1rem}.domain-card,.domains-section,.search-container,.stat-card{padding:1rem}}.fade-in{animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.slide-in{animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translateX(-20px);opacity:0}to{transform:translateX(0);opacity:1}}