@import"https://fonts.googleapis.com/css2?family=Miniver&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Orbitron:wght@400..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";:root{--bg-main: #eef2ff;--bg-glass: rgba(255, 255, 255, .65);--card-border: rgba(255, 255, 255, .35);--text-main: #1a1a1a;--text-soft: #6c757d;--primary: #4361ee;--secondary: #4895ef;--accent: #4cc9f0;--pink: #f72585;--shadow: 0 10px 30px rgba(0, 0, 0, .08)}body.dark{--bg-main: #0f172a;--bg-glass: rgba(30, 41, 59, .6);--card-border: rgba(255, 255, 255, .08);--text-main: #f1f5f9;--text-soft: #94a3b8;--shadow: 0 10px 30px rgba(0, 0, 0, .4)}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}html{font-size:62.5%}body{width:100%;min-height:100vh;background:linear-gradient(135deg,#4361ee,#4895ef,#4cc9f0);color:var(--text-main);background-size:400% 400%;animation:bgMove 15s ease infinite}@keyframes bgMove{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}hr{margin-top:1rem;margin-bottom:1rem}.header{width:100%;display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding:1.8rem 3rem;background:var(--bg-glass);backdrop-filter:blur(2rem);-webkit-backdrop-filter:blur(2rem);border-bottom:1px solid var(--card-border)}.header h2{font-size:3rem}.weather-input{display:flex;flex-wrap:wrap;gap:1rem}#city_input{background-color:var(--bg-glass);-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem);color:var(--text-main);padding:1.2rem 1.6rem;font-size:1.6rem;border:none;border-radius:3rem}#city_input:focus{outline:none}#search_btn,#location_btn,#theme_toggle{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;padding:1.2rem 1.6rem;font-size:1.6rem;border:none;border-radius:3rem;cursor:pointer;transition:.3s}#search_btn:hover,#location_btn:hover,#theme_toggle:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.card{position:relative;background:var(--bg-glass);border-radius:2rem;padding:2rem;border:1px solid var(--card-border);-webkit-backdrop-filter:blur(1.5rem);backdrop-filter:blur(1.5rem);box-shadow:var(--shadow);margin-bottom:1.5rem;transition:transform .25s ease,box-shadow .25s ease}.card:before{content:"";position:absolute;inset:0;border-radius:2rem;padding:1px;background:linear-gradient(120deg,#fff9,#ffffff1a);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.card p{font-size:1.4rem;color:var(--text-soft)}.card h2{color:var(--text-main);font-size:3.2rem;font-weight:500}.weather-data{width:100%;padding:2rem;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem}.weather-data .weather-left{grid-column:span 1}.weather-data .current-weather{display:flex;justify-content:space-between;align-items:center}.weather-data .current-weather h2{margin:.7rem 0}.weather-data .current-weather p{color:var(--text-main)}.weather-data .card-footer p{font-size:1.4rem;margin-bottom:1.2rem}.weather-data .forecast-item{display:grid;grid-template-columns:repeat(3,1fr);place-items:center;margin-bottom:1.5rem;padding:.6rem 0;border-bottom:1px solid rgba(255,255,255,.15)}.weather-data .forecast-item:last-child{border-bottom:none}.weather-data .forecast-item .icon-wrapper{display:flex;align-items:center}.weather-data .weather-right{grid-column:span 3}.weather-data .weather-right h2{margin-bottom:1.5rem}.weather-data .weather-right .highlights{display:grid;grid-template-columns:repeat(5,1fr);gap:2rem}.weather-data .weather-right .highlights .card:nth-of-type(1),.weather-data .weather-right .highlights .card:nth-of-type(2){grid-column:span 2}.weather-data .weather-right .highlights .card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.weather-data .weather-right .highlights .air-index{padding:.5rem 1.2rem;border-radius:2rem;font-size:1.2rem}.aqi-1{background:#4cc9f0;color:#fff}.aqi-2{background:#4895ef;color:#fff}.aqi-3{background:#4361ee;color:#fff}.aqi-4{background:#7209b7;color:#fff}.aqi-5{background:#f72585;color:#fff}.weather-data .weather-right .air-indices{width:100%;display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;place-items:center}.weather-data .weather-right .air-indices p{text-align:center}.weather-data .weather-right .sunrise-sunset{display:grid;grid-template-columns:repeat(2,1fr);place-items:center;gap:1rem}.weather-data .weather-right .sunrise-sunset .item{display:flex;justify-content:center;align-items:center;gap:1rem}.weather-data .weather-right .sunrise-sunset .item h2{margin-top:1.5rem;text-align:center}.weather-data .weather-right .card-item{display:flex;justify-content:space-between;align-items:center}.hourly-forecast{display:grid;gap:1.5rem;padding-bottom:1rem;grid-template-columns:repeat(8,1fr)}.hourly-forecast .card{padding:1.2rem;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:.6rem;-webkit-backdrop-filter:blur(1.2rem);backdrop-filter:blur(1.2rem);min-width:9rem}@media(max-width:1280px){.weather-data{grid-template-columns:repeat(3,1fr)}.weather-data .weather-right{grid-column:span 2}.weather-data .weather-right .highlights{grid-template-columns:repeat(3,1fr)}.weather-data .weather-right .highlights .card:nth-of-type(1){grid-column:span 3}.hourly-forecast{grid-template-columns:repeat(6,1fr)}}@media(max-width:1080px){.weather-data{grid-template-columns:repeat(2,1fr)}.weather-data .weather-right{grid-column:span 1}.weather-data .weather-right .highlights{grid-template-columns:repeat(2,1fr)}.weather-data .weather-right .highlights .card:nth-of-type(1){grid-column:span 2}.hourly-forecast{grid-template-columns:repeat(4,1fr)}}@media(max-width:992px){.weather-data .weather-right .highlights .card{grid-column:span 2}.weather-data .weather-right .air-indices{grid-template-columns:repeat(3,1fr)}}@media(max-width:850px){.header{flex-direction:column}.header h2{margin-bottom:.8rem}.header #city_input,#search_btn,#location_btn,#theme_toggle{width:100%;margin-bottom:1rem}.weather-data{grid-template-columns:1fr}.weather-data .weather-right .highlights .card:nth-of-type(3),.weather-data .weather-right .highlights .card:nth-of-type(4),.weather-data .weather-right .highlights .card:nth-of-type(5),.weather-data .weather-right .highlights .card:nth-of-type(6),.weather-data .weather-right .highlights .card:nth-of-type(7){grid-column:span 1}.weather-data .weather-right .air-indices{grid-template-columns:repeat(3,1fr)}}@media(max-width:580px){.weather-data .weather-right .air-indices{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.weather-data .weather-right .highlights .card:nth-of-type(3),.weather-data .weather-right .highlights .card:nth-of-type(4),.weather-data .weather-right .highlights .card:nth-of-type(5),.weather-data .weather-right .highlights .card:nth-of-type(6),.weather-data .weather-right .highlights .card:nth-of-type(7){grid-column:span 1}.weather-data .weather-right .air-indices{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.weather-data .weather-right .highlights .sunrise-sunset{grid-template-columns:1fr}}@media(max-width:450px){.hourly-forecast{grid-template-columns:repeat(3,1fr)}}@media(max-width:380px){.weather-data .weather-right .air-indices{grid-template-columns:repeat(2,1fr)}}body,.card,.header{transition:background .4s ease,color .4s ease,border .4s ease}