@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');body{font-family:'Inter',system-ui,sans-serif;scroll-behavior:smooth;background:linear-gradient(135deg,#f0f4ff 0%,#e6e6ff 100%)}.dark body{background:linear-gradient(135deg,#0D1117 0%,#1F2937 100%);color:#F3F4F6}.light-theme-dark-bg body{color:#ffffff}.light-theme-dark-bg .text-neutral-600,.light-theme-dark-bg .text-neutral-500,.light-theme-dark-bg .text-neutral-400,.light-theme-dark-bg .text-neutral-300,.light-theme-dark-bg .text-neutral-800{color:rgba(255,255,255,0.9)!important}.light-theme-dark-bg .search-icon,.light-theme-dark-bg .dark:text-neutral-400,.light-theme-dark-bg .dark:text-neutral-300{color:rgba(255,255,255,0.8)!important}.light-theme-dark-bg .hot-cities-title,.light-theme-dark-bg .forecast-title{color:rgba(255,255,255,0.7)!important}.background-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-2;overflow:hidden}.background-image{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.5s ease-in-out}.dark .background-image{filter:brightness(0.5) contrast(1.1)}.background-image.loaded{opacity:1}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background-color:rgba(156,163,175,0.5);border-radius:4px}.dark ::-webkit-scrollbar-thumb{background-color:rgba(75,85,99,0.7)}::-webkit-scrollbar-thumb:hover{background-color:rgba(156,163,175,0.8)}.dark ::-webkit-scrollbar-thumb:hover{background-color:rgba(75,85,99,0.9)}.website-card{transition:all 0.3s ease}.website-card:hover{transform:translateY(-5px)}.suggestion-enter{opacity:0;transform:translateY(-10px)}.suggestion-enter-active{opacity:1;transform:translateY(0);transition:opacity 300ms,transform 300ms}.suggestion-item{transition:all 0.2s ease}.suggestion-item:hover{background-color:rgba(255,255,255,0.3)}.dark .suggestion-item:hover{background-color:rgba(79,70,229,0.15)}.search-icon{color:#9CA3AF}.dark .search-icon{color:#9CA3AF}.loading-dots{display:inline-flex}.loading-dots span{width:6px;height:6px;margin:0 2px;background-color:currentColor;border-radius:50%;animation:loading-dots 1.4s infinite ease-in-out both}.loading-dots span:nth-child(1){animation-delay:-0.32s}.loading-dots span:nth-child(2){animation-delay:-0.16s}@keyframes loading-dots{0%,80%,100%{transform:scale(0)}40%{transform:scale(1)}}.weather-selector{position:relative}.weather-dropdown{position:absolute;top:100%;right:0;min-width:300px;background:rgba(255,255,255,0.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.18);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,0.1);z-index:50;margin-top:8px;overflow:hidden}.dark .weather-dropdown{background:rgba(17,24,39,0.7);border:1px solid rgba(255,255,255,0.08);box-shadow:0 8px 32px rgba(0,0,0,0.4)}.light-theme-dark-bg .weather-dropdown,.light-theme-dark-bg .more-dropdown,.light-theme-dark-bg .history-dropdown{background:rgba(0,0,0,0.4);border:1px solid rgba(255,255,255,0.1)}.city-option{padding:8px 12px;cursor:pointer;transition:background-color 0.2s}.city-option:hover{background-color:rgba(255,255,255,0.3)}.dark .city-option:hover{background-color:rgba(79,70,229,0.15)}.hot-cities{padding:8px 0}.hot-cities-title{padding:4px 12px;font-size:12px;color:#6b7280}.dark .hot-cities-title{color:#9ca3af}.city-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:0 8px}.weather-forecast{padding:12px}.forecast-title{font-size:14px;color:#6b7280;margin-bottom:8px;padding-left:4px}.dark .forecast-title{color:'9ca3af'}.forecast-days{display:flex;justify-content:space-between;margin-top:12px}.forecast-day{flex:1;text-align:center;padding:8px 4px}.forecast-date{font-size:13px;margin-bottom:6px}.forecast-icon{font-size:20px;margin-bottom:6px}.forecast-temp{font-size:13px}.current-weather-details{padding:12px;border-bottom:1px solid rgba(229,231,235,0.5)}.dark .current-weather-details{border-color:rgba(55,65,81,0.7)}.current-weather-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.current-city-container{display:flex;align-items:center;gap:8px}.current-city{font-weight:600;font-size:16px}.current-temp{font-size:28px;font-weight:500}.current-condition{text-align:right;margin-bottom:8px}.more-menu-container{position:relative}.more-dropdown{position:absolute;top:100%;right:0;min-width:160px;background:rgba(255,255,255,0.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.18);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,0.1);z-index:50;margin-top:8px;overflow:hidden}.dark .more-dropdown{background:rgba(17,24,39,0.7);border:1px solid rgba(255,255,255,0.08);box-shadow:0 8px 32px rgba(0,0,0,0.4)}.more-link{display:block;padding:8px 16px;color:inherit;text-decoration:none;transition:background-color 0.2s}.more-link:hover{background-color:rgba(255,255,255,0.3)}.dark .more-link:hover{background-color:rgba(79,70,229,0.15)}.history-menu-container{position:relative}.history-dropdown{position:absolute;top:100%;right:0;min-width:300px;max-width:500px;max-height:400px;overflow-y:auto;background:rgba(255,255,255,0.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.18);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,0.1);z-index:50;margin-top:8px;overflow:hidden}.dark .history-dropdown{background:rgba(17,24,39,0.7);border:1px solid rgba(255,255,255,0.08);box-shadow:0 8px 32px rgba(0,0,0,0.4)}.history-header{padding:12px 16px;border-bottom:1px solid rgba(229,231,235,0.5);display:flex;justify-content:space-between;align-items:center}.dark .history-header{border-color:rgba(55,65,81,0.7)}.history-title{font-weight:500;font-size:15px}.clear-history{font-size:13px;color:#4F46E5;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background-color 0.2s}.clear-history:hover{background-color:rgba(255,255,255,0.3)}.dark .clear-history:hover{background-color:rgba(79,70,229,0.15)}.history-list{padding:8px 0}.history-item{padding:8px 16px;display:flex;align-items:center;cursor:pointer;transition:background-color 0.2s}.history-item:hover{background-color:rgba(255,255,255,0.3)}.dark .history-item:hover{background-color:rgba(79,70,229,0.15)}.history-item i{margin-right:10px;color:#9CA3AF}.history-item .remove-history{margin-left:auto;color:#9CA3AF;opacity:0;transition:all 0.2s}.history-item:hover .remove-history{opacity:1}.no-history{padding:20px 16px;text-align:center;color:#6b7280;font-size:14px}.dark .no-history{color:#9ca3af}.iconfont{font-size:inherit;display:inline-block;font-style:normal;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.status-info{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);padding:10px 20px;background:rgba(0,0,0,0.7);color:white;border-radius:8px;font-size:14px;z-index:100;display:none}.status-info.error{background:rgba(220,38,38,0.8)}.light-theme-dark-bg #search-input{background:rgba(255,255,255,0.15);border-color:rgba(255,255,255,0.2);color:white}.light-theme-dark-bg #search-input::placeholder{color:rgba(255,255,255,0.7)}#use-location{cursor:pointer;color:#4F46E5;transition:all 0.2s}#use-location:hover{color:#6366F1;transform:scale(1.1)}footer{position:fixed;bottom:0;left:0;right:0;z-index:40;padding:8px 0;background:rgba(255,255,255,0.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(255,255,255,0.18)}.light-theme-dark-bg footer{background:rgba(0,0,0,0.3);border-top:1px solid rgba(255,255,255,0.1)}.dark footer{background:rgba(17,24,39,0.6);border-top:1px solid rgba(255,255,255,0.08)}main{padding-bottom:60px}#search-input:focus{box-shadow:0 0 0 2px #4F46E5}.dark #search-input:focus{box-shadow:0 0 0 2px #4F46E5}#search-btn:hover{background-color:#6366F1;transform:translateY(-1px)}.dark .website-card{border:1px solid rgba(255,255,255,0.05)}.dark .website-card:hover{border-color:rgba(79,70,229,0.3)}.light-theme-dark-bg .website-card{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.15)}.search-engine-btn.active{background-color:rgba(255,255,255,0.5);color:#4F46E5}.dark .search-engine-btn.active{background-color:rgba(79,70,229,0.2);color:#4F46E5}.light-theme-dark-bg .search-engine-btn{color:rgba(255,255,255,0.8)}.light-theme-dark-bg .search-engine-btn.active{background-color:rgba(255,255,255,0.2);color:#4F46E5}