:root{--font-heading: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--transition-speed: .3s;--transition-ease: cubic-bezier(.4, 0, .2, 1);--border-radius-lg: 24px;--border-radius-md: 16px;--border-radius-sm: 12px}:root.dark{--bg-app: linear-gradient(135deg, #0b0f19 0%, #111827 50%, #070a13 100%);--card-bg: rgba(17, 24, 39, .65);--card-hover-bg: rgba(31, 41, 55, .75);--card-border: rgba(255, 255, 255, .08);--card-glow: 0 8px 32px 0 rgba(0, 0, 0, .37);--border-hover: rgba(59, 130, 246, .4);--text-primary: #f3f4f6;--text-secondary: #9ca3af;--text-muted: #6b7280;--accent-primary: #3b82f6;--accent-secondary: #8b5cf6;--accent-glow: rgba(59, 130, 246, .25);--accent-glow-purple: rgba(139, 92, 246, .25);--temp-hot: #f97316;--temp-cold: #38bdf8;--success: #10b981;--warning: #f59e0b;--danger: #ef4444;--glass-blur: blur(16px)}:root.light{--bg-app: linear-gradient(135deg, #f0f4f8 0%, #e2e8f0 50%, #d9e2ec 100%);--card-bg: rgba(255, 255, 255, .75);--card-hover-bg: rgba(255, 255, 255, .9);--card-border: rgba(0, 0, 0, .06);--card-glow: 0 8px 32px 0 rgba(15, 23, 42, .06);--border-hover: rgba(59, 130, 246, .3);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--accent-primary: #2563eb;--accent-secondary: #7c3aed;--accent-glow: rgba(37, 99, 235, .15);--accent-glow-purple: rgba(124, 58, 237, .15);--temp-hot: #ea580c;--temp-cold: #0284c7;--success: #059669;--warning: #d97706;--danger: #dc2626;--glass-blur: blur(12px)}*{box-sizing:border-box;margin:0;padding:0;transition:background-color var(--transition-speed) var(--transition-ease),border-color var(--transition-speed) var(--transition-ease),box-shadow var(--transition-speed) var(--transition-ease),color var(--transition-speed) var(--transition-ease)}body{font-family:var(--font-body);background:var(--bg-app);color:var(--text-primary);min-height:100vh;line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:600;letter-spacing:-.02em}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes drift{0%{transform:translate(0) scale(1)}50%{transform:translate(4%,3%) scale(1.05)}to{transform:translate(0) scale(1)}}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-soft{0%,to{opacity:.6;transform:scale(1)}50%{opacity:.9;transform:scale(1.02)}}.animate-fade-in{animation:fadeInUp .6s var(--transition-ease) forwards}.app-container{max-width:1400px;margin:0 auto;padding:2rem;min-height:100vh;display:flex;flex-direction:column;gap:2rem;position:relative;z-index:10}.ambient-glow{position:fixed;width:50vw;height:50vw;border-radius:50%;filter:blur(120px);opacity:.15;pointer-events:none;z-index:1;animation:drift 20s infinite ease-in-out}.ambient-glow-1{top:-10%;left:-10%;background:var(--accent-primary)}.ambient-glow-2{bottom:-10%;right:-10%;background:var(--accent-secondary);animation-delay:-5s}.glass-card{background:var(--card-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--card-border);border-radius:var(--border-radius-lg);box-shadow:var(--card-glow);padding:1.75rem;overflow:hidden;position:relative}.glass-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,#ffffff26,#fff0);pointer-events:none}.glass-card:hover{border-color:var(--border-hover);box-shadow:0 10px 40px 0 var(--accent-glow)}.header-wrapper{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap}.logo-section{display:flex;align-items:center;gap:.75rem}.logo-section h1{font-size:1.75rem;background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:800}.header-controls{display:flex;align-items:center;gap:1rem}.search-form{position:relative;display:flex;width:100%;max-width:450px}.search-input{width:100%;padding:.85rem 1rem .85rem 3rem;background:#ffffff0d;border:1px solid var(--card-border);border-radius:50px;color:var(--text-primary);font-size:.95rem;outline:none;font-family:var(--font-body)}.light .search-input{background:#00000008}.search-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-glow);background:#ffffff14}.light .search-input:focus{background:#ffffffe6}.search-icon{position:absolute;left:1.1rem;top:50%;transform:translateY(-50%);color:var(--text-secondary);pointer-events:none;width:1.1rem;height:1.1rem}.search-button{padding:0 1.5rem;background:linear-gradient(135deg,var(--accent-primary) 0%,var(--accent-secondary) 100%);color:#fff;border:none;border-radius:50px;font-family:var(--font-heading);font-weight:500;cursor:pointer;margin-left:.5rem}.search-button:hover{transform:translateY(-1px);box-shadow:0 4px 15px var(--accent-glow)}.icon-btn{background:var(--card-bg);border:1px solid var(--card-border);border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--text-primary);cursor:pointer}.icon-btn:hover{background:var(--card-hover-bg);transform:scale(1.05);border-color:var(--accent-primary)}.language-dropdown{position:relative}.language-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--card-bg);border:1px solid var(--card-border);padding:.6rem 2.2rem .6rem 1.2rem;border-radius:50px;color:var(--text-primary);font-family:var(--font-heading);font-weight:500;font-size:.9rem;cursor:pointer;outline:none}.language-select:hover{border-color:var(--accent-primary)}.language-icon-arrow{position:absolute;right:1rem;top:50%;transform:translateY(-50%);pointer-events:none;width:.9rem;height:.9rem;color:var(--text-secondary)}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2rem}@media (max-width: 1100px){.dashboard-grid{grid-template-columns:1fr 1fr}}@media (max-width: 768px){.dashboard-grid{grid-template-columns:1fr}.app-container{padding:1rem}}.hero-card{grid-column:span 2;display:flex;flex-direction:column;gap:2rem}@media (max-width: 1100px){.hero-card{grid-column:span 2}}@media (max-width: 768px){.hero-card{grid-column:span 1}}.hero-main-weather{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap}.hero-temp-section{display:flex;align-items:flex-start;gap:1.5rem}.big-temp{font-size:5.5rem;font-family:var(--font-heading);font-weight:800;line-height:1;background:linear-gradient(135deg,var(--text-primary) 50%,var(--text-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.weather-condition-desc{display:flex;flex-direction:column;justify-content:center}.weather-city{font-size:2.25rem;font-weight:700;line-height:1.2}.weather-status{font-size:1.15rem;color:var(--text-secondary);margin-top:.25rem;text-transform:capitalize}.weather-extra-meta{color:var(--text-muted);font-size:.85rem;margin-top:.5rem}.big-weather-icon{width:140px;height:140px;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 10px 20px var(--accent-glow));animation:pulse-soft 6s infinite ease-in-out}.big-weather-icon svg{width:100%;height:100%}.meteorology-highlights{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1rem;margin-top:auto}.highlight-item{background:#ffffff08;border:1px solid rgba(255,255,255,.03);border-radius:var(--border-radius-md);padding:1.1rem;display:flex;flex-direction:column;gap:.5rem}.light .highlight-item{background:#00000005}.highlight-label{font-size:.8rem;color:var(--text-secondary);display:flex;align-items:center;gap:.4rem}.highlight-label svg{color:var(--accent-primary)}.highlight-value{font-size:1.2rem;font-weight:700;font-family:var(--font-heading)}.aqi-card{display:flex;flex-direction:column;justify-content:space-between}.card-title{font-size:1.15rem;color:var(--text-primary);display:flex;align-items:center;gap:.6rem;margin-bottom:1.5rem;font-weight:700}.card-title svg{color:var(--accent-secondary)}.aqi-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.aqi-score{font-size:2.75rem;font-family:var(--font-heading);font-weight:800;line-height:1}.aqi-badge{padding:.35rem .85rem;border-radius:50px;font-size:.8rem;font-weight:700;text-transform:uppercase}.aqi-level-1{background:#10b98126;color:#10b981;border:1px solid rgba(16,185,129,.3)}.aqi-level-2{background:#f59e0b26;color:#f59e0b;border:1px solid rgba(245,158,11,.3)}.aqi-level-3{background:#f9731626;color:#f97316;border:1px solid rgba(249,115,22,.3)}.aqi-level-4{background:#ef444426;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.aqi-level-5{background:#8b5cf626;color:#8b5cf6;border:1px solid rgba(139,92,246,.3)}.aqi-level-6{background:#7f1d1d26;color:#7f1d1d;border:1px solid rgba(127,29,29,.3)}.aqi-meter-wrapper{margin-bottom:1.5rem}.aqi-meter-labels{display:flex;justify-content:space-between;font-size:.75rem;color:var(--text-secondary);margin-top:.4rem}.aqi-slider-bg{height:8px;background:linear-gradient(90deg,#10b981,#f59e0b,#f97316,#ef4444,#8b5cf6,#7f1d1d);border-radius:50px;position:relative}.aqi-slider-indicator{width:14px;height:14px;background:#fff;border:3px solid #111827;border-radius:50%;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 6px #00000080;transition:left .5s ease-in-out}.light .aqi-slider-indicator{border-color:#fff}.aqi-details-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.aqi-detail-subitem{display:flex;justify-content:space-between;font-size:.8rem;padding:.4rem;background:#ffffff05;border-radius:var(--border-radius-sm)}.light .aqi-detail-subitem{background:#00000003}.aqi-chemical{color:var(--text-secondary)}.aqi-chemical-val{font-weight:600}.forecast-scroll-container{display:flex;gap:1rem;overflow-x:auto;padding-bottom:.5rem;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--card-border) transparent}.forecast-scroll-container::-webkit-scrollbar{height:6px}.forecast-scroll-container::-webkit-scrollbar-thumb{background:var(--card-border);border-radius:10px}.forecast-day-card{flex:0 0 140px;display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1.25rem 1rem;background:#ffffff05;border:1px solid var(--card-border);border-radius:var(--border-radius-md);text-align:center;cursor:pointer}.light .forecast-day-card{background:#00000003}.forecast-day-card:hover{transform:translateY(-4px);border-color:var(--accent-primary);background:#ffffff0a}.light .forecast-day-card:hover{background:#ffffffe6}.forecast-day-card.active-day{background:linear-gradient(180deg,#3b82f61a,#8b5cf60d);border-color:var(--accent-primary);box-shadow:0 0 15px #3b82f633}.forecast-day-name{font-weight:600;font-size:.95rem}.forecast-day-date{font-size:.75rem;color:var(--text-secondary)}.forecast-day-icon{width:52px;height:52px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15))}.forecast-day-temps{display:flex;gap:.6rem;font-size:.9rem}.forecast-temp-max{font-weight:700}.forecast-temp-min{color:var(--text-secondary)}.chart-container{height:320px;width:100%;margin-top:1rem}.alerts-container{display:flex;flex-direction:column;gap:1rem}.alert-banner{background:#ef44441a;border:1px solid rgba(239,68,68,.25);border-radius:var(--border-radius-md);padding:1.25rem;display:flex;gap:1rem;position:relative;overflow:hidden}.alert-banner:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--danger)}.alert-icon-wrapper{color:var(--danger);flex-shrink:0;display:flex;align-items:flex-start;padding-top:.2rem}.alert-details{display:flex;flex-direction:column;gap:.4rem}.alert-event{font-family:var(--font-heading);font-weight:700;font-size:1.05rem;color:var(--text-primary)}.alert-sender{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.alert-desc{font-size:.85rem;color:var(--text-secondary);line-height:1.4;white-space:pre-line}.no-alerts-msg{display:flex;align-items:center;justify-content:center;padding:2.5rem;color:var(--text-secondary);font-size:.95rem;gap:.6rem;text-align:center;background:#ffffff03;border:1px dashed var(--card-border);border-radius:var(--border-radius-md)}.no-alerts-msg svg{color:var(--success)}.search-history-container{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.8rem}.history-chip{display:flex;align-items:center;gap:.5rem;padding:.4rem .9rem;background:#ffffff08;border:1px solid var(--card-border);border-radius:50px;font-size:.85rem;color:var(--text-secondary);cursor:pointer}.light .history-chip{background:#00000005}.history-chip:hover{background:var(--card-hover-bg);border-color:var(--accent-primary);color:var(--text-primary);transform:translateY(-1px)}.history-chip-remove{background:none;border:none;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;padding:0;border-radius:50%}.history-chip-remove:hover{color:var(--danger);background:#ef44441a}.loading-viewport{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg-app);z-index:1000;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem}.spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--accent-primary);border-radius:50%;animation:spin-slow 1s linear infinite}.light .spinner{border-color:#0000000d;border-top-color:var(--accent-primary)}.loading-text{font-family:var(--font-heading);font-size:1.1rem;color:var(--text-secondary);font-weight:500}.error-banner{background:#ef44441f;border:1px solid rgba(239,68,68,.2);border-radius:var(--border-radius-md);padding:1rem 1.5rem;display:flex;align-items:center;gap:.8rem;color:#ef4444;margin-bottom:1.5rem}.info-banner{background:#3b82f61a;border:1px solid rgba(59,130,246,.2);border-radius:var(--border-radius-md);padding:.75rem 1.25rem;display:flex;align-items:center;gap:.6rem;color:var(--accent-primary);font-size:.85rem;margin-bottom:1.5rem}.info-banner svg{flex-shrink:0}.recharts-tooltip-cursor{stroke:var(--card-border)!important}.recharts-default-tooltip{background-color:var(--card-bg)!important;border:1px solid var(--card-border)!important;border-radius:var(--border-radius-sm)!important;box-shadow:var(--card-glow)!important;-webkit-backdrop-filter:var(--glass-blur)!important;backdrop-filter:var(--glass-blur)!important;color:var(--text-primary)!important}