*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:0;padding:0;overflow-x:hidden;width:100vw}.app{min-height:100vh;width:100vw;transition:all .3s ease}.app.dark{background:linear-gradient(135deg,#0b170b,#163e21);color:#fff}.app.light{background:linear-gradient(135deg,#408a58,#83e09f);color:#333}.loading{display:flex;justify-content:center;align-items:center;height:100vh;font-size:1.5rem;color:#fff}.header{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem 1rem;background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-bottom:1px solid rgba(255,255,255,.1);width:100vw;box-sizing:border-box}.location{display:flex;align-items:center;gap:.5rem;font-size:1.3rem;font-weight:500;order:1;color:#fff}.location-icon{font-size:.7rem}.date-display{order:2;display:flex;align-items:center;justify-content:center}.current-date{font-size:1rem;font-weight:500;color:#ffffffe6;text-align:center;padding:.5rem 1rem;background:#ffffff1a;border-radius:15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.controls{display:flex;gap:1rem;order:3}.about-btn,.theme-toggle,.settings{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.about-btn:hover,.theme-toggle:hover,.settings:hover{background:#fff3}.about-btn{position:relative;background:#2e8b5733;border:1px solid rgba(46,139,87,.4);animation:pulse 2s infinite}.about-btn:hover{background:#2e8b574d;transform:scale(1.05);animation:none}@keyframes pulse{0%{box-shadow:0 0 #2e8b5766}70%{box-shadow:0 0 0 10px #2e8b5700}to{box-shadow:0 0 #2e8b5700}}.settings-panel{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.settings-content{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:2rem;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;min-width:300px;max-width:500px}.settings-content h3{margin:0 0 1.5rem;font-size:1.5rem;text-align:center}.setting-item{margin-bottom:1.5rem}.setting-item label{display:block;margin-bottom:.5rem;font-weight:600}.unit-toggle{display:flex;gap:.5rem;flex-direction:column}.unit-btn{padding:.75rem 1rem;border:1px solid rgba(255,255,255,.3);border-radius:10px;background:#ffffff1a;color:#fff;cursor:pointer;transition:all .3s ease;font-size:.9rem}.unit-btn:hover{background:#fff3}.unit-btn.active{background:#2e8b574d;border-color:#2e8b5780;font-weight:600}.close-settings{width:100%;padding:.75rem;margin-top:1rem;border:1px solid rgba(255,255,255,.3);border-radius:10px;background:#fff3;color:#fff;cursor:pointer;font-size:1rem;transition:all .3s ease}.close-settings:hover{background:#ffffff4d}.main-content{padding:1rem;margin:0;width:100vw;box-sizing:border-box}.app.light .main-content,.app.light .current-weather,.app.light .weather-details,.app.light .forecast-section,.app.light .forecast-card,.app.light .about-toggle-btn,.app.light .about-expandable{color:#000}.app.light .feels-like,.app.light .detail-label,.app.light .forecast-day,.app.light .temp-low,.app.light .forecast-precipitation{color:#000000b3!important}.app.light .condition,.app.light .forecast-section h2{color:#000000e6!important}.app.dark .main-content,.app.dark .current-weather,.app.dark .weather-details,.app.dark .forecast-section,.app.dark .forecast-card,.app.dark .about-toggle-btn,.app.dark .about-expandable{color:#fff}.app.dark .feels-like,.app.dark .detail-label,.app.dark .forecast-day,.app.dark .temp-low,.app.dark .forecast-precipitation{color:#ffffffb3!important}.app.dark .condition,.app.dark .forecast-section h2{color:#ffffffe6!important}.weather-overview{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem;width:100%}.current-weather{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;transition:all .3s ease}.current-weather:hover{border-color:#2e8b574d;background:#ffffff1f}.weather-icon{font-size:3rem;margin-bottom:1rem}.temperature{display:flex;flex-direction:column;align-items:center}.temp-main{font-size:3rem;font-weight:300;margin-bottom:.5rem}.feels-like{font-size:.9rem;margin-bottom:1rem}.condition{font-size:1.1rem;font-weight:500}.weather-details{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;transition:all .3s ease}.weather-details:hover{border-color:#2e8b574d;background:#ffffff1f}.detail-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:.75rem .5rem}.detail-icon{font-size:1.2rem;margin-bottom:.5rem}.detail-value{font-size:1.1rem;font-weight:600;margin-bottom:.25rem}.detail-label{font-size:.8rem}.forecast-section{margin-top:2rem}.forecast-section h2{font-size:1.1rem;font-weight:600;margin-bottom:1rem;letter-spacing:1px;border-bottom:2px solid rgba(46,139,87,.3);padding-bottom:.5rem}.forecast-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:.75rem;width:100%}.forecast-card{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:15px;padding:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .3s ease;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;text-align:left}.forecast-card:hover{transform:translateY(-2px);background:#ffffff26;border-color:#2e8b574d}.forecast-day{font-size:.85rem;color:#ffffffb3;margin-bottom:0;grid-column:1;min-width:80px}.forecast-icon{font-size:2rem;margin-bottom:0;grid-column:2;justify-self:center}.forecast-temps{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;margin-bottom:0;grid-column:3}.temp-high{font-size:1.1rem;font-weight:600}.temp-low{font-size:.9rem}.forecast-precipitation{display:none}@media (min-width: 768px){.header{flex-direction:row;justify-content:space-between;padding:2rem}.location{order:1;font-size:1.4rem}.date-display{order:2;flex:1;max-width:400px;margin:0 2rem}.current-date{font-size:1.1rem}.search-container{order:2;flex:1;max-width:400px;margin:0 2rem}.controls{order:3}.main-content{padding:2rem 3rem}.weather-overview{display:grid;grid-template-columns:1fr 2fr;gap:2rem;margin-bottom:3rem}.current-weather{padding:2rem}.weather-icon,.temp-main{font-size:4rem}.feels-like{font-size:1rem}.condition{font-size:1.2rem}.weather-details{padding:2rem;gap:2rem}.detail-item{padding:0}.detail-icon,.detail-value{font-size:1.5rem}.detail-label{font-size:.9rem}.forecast-section{margin-top:3rem}.forecast-section h2{font-size:1.2rem;margin-bottom:1.5rem}.forecast-grid{grid-template-columns:repeat(3,1fr);gap:1rem}.forecast-card{display:flex;flex-direction:column;text-align:center;padding:1.5rem 1rem}.forecast-day{font-size:.9rem;margin-bottom:1rem;min-width:auto}.forecast-icon{font-size:2.5rem;margin-bottom:1rem;justify-self:auto}.forecast-temps{flex-direction:row;justify-content:center;align-items:center;margin-bottom:1rem;gap:.5rem}.forecast-precipitation{display:flex;align-items:center;justify-content:center;gap:.25rem;font-size:.85rem}.precip-icon{font-size:.8rem}.footer{padding:2rem}.about-toggle-container{margin-top:4rem;margin-bottom:4rem}.app.light .about-expandable{background:#0000001f}.app.light .about-expandable .about-content>p{background:#00000026}}@media (min-width: 1024px){.forecast-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width: 1200px){.header{padding:2rem 4rem}.location{font-size:1.6rem}.location-icon{font-size:1.7rem}.main-content{padding:3rem 4rem}.forecast-grid{grid-template-columns:repeat(7,1fr)}.weather-overview{gap:3rem}.footer{padding:2rem 4rem}.about-toggle-container{margin-top:5rem;margin-bottom:5rem}.app.light .about-expandable{background:#0000001f}.app.light .about-expandable .about-content>p{background:#00000026}}@media (min-width: 1600px){.header{padding:2rem 6rem}.location{font-size:1.8rem}.location-icon{font-size:1.9rem}.main-content{padding:4rem 6rem}.weather-overview{gap:4rem}.current-weather{padding:3rem}.weather-details{padding:3rem;gap:3rem}.footer{padding:2rem 6rem}.about-toggle-container{margin-top:6rem;margin-bottom:6rem}.app.light .about-expandable{background:#0000001f}.app.light .about-expandable .about-content{padding:2.5rem}.app.light .about-expandable .about-content>p{background:#00000026;padding:1.5rem}.app.light .about-note{background:#00000014}}@media (max-width: 1024px){.main-content{max-width:900px;padding:1.5rem}.weather-overview{gap:1.5rem}.forecast-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}}@media (max-width: 768px){.header{flex-direction:column;gap:1rem;padding:2rem 1rem}.search-container{margin:0;max-width:none;order:2}.location{order:1;justify-content:center}.controls{order:3;justify-content:center}.main-content{padding:1rem}.weather-overview{grid-template-columns:1fr;gap:1.5rem;margin-bottom:2rem}.weather-details{grid-template-columns:repeat(2,1fr);gap:1.5rem;padding:1.5rem}.current-weather{padding:1.5rem}.temp-main,.weather-icon{font-size:3.5rem}.forecast-grid{grid-template-columns:repeat(3,1fr);gap:.75rem}.forecast-card{padding:1rem .75rem}.forecast-icon{font-size:2rem}}@media (max-width: 600px){.header{padding:2rem 1rem}.search-input{padding:.6rem .8rem;font-size:.9rem}.weather-details{grid-template-columns:1fr;gap:1rem;padding:1.25rem}.detail-item{flex-direction:row;justify-content:space-between;align-items:center;text-align:left;padding:.75rem;background:#ffffff0d;border-radius:10px}.detail-icon{margin-bottom:0;margin-right:.5rem}.detail-value{margin-bottom:0;font-size:1.2rem}.detail-label{margin-left:auto;font-size:.8rem}.forecast-grid{grid-template-columns:repeat(2,1fr)}.forecast-section h2{font-size:1.1rem;margin-bottom:1rem}.app.light .about-expandable{background:#0000001f}.app.light .about-expandable .about-content>p{background:#00000026}}@media (max-width: 480px){.header{padding:2rem 1rem}.location{font-size:1.2rem}.location-icon{font-size:1.3rem}.main-content{padding:.75rem}.current-weather{padding:1.25rem}.temp-main{font-size:3rem}.weather-icon{font-size:3rem;margin-bottom:.75rem}.feels-like{font-size:.9rem}.condition{font-size:1.1rem}.weather-details{padding:1rem}.detail-item{padding:.6rem}.detail-value{font-size:1.1rem}.detail-label{font-size:.75rem}.forecast-grid{grid-template-columns:1fr;gap:.5rem}.forecast-card{padding:1rem;display:grid;grid-template-columns:auto 1fr auto auto;gap:1rem;align-items:center;text-align:left}.forecast-day{margin-bottom:0;font-size:.85rem;grid-column:1}.forecast-icon{font-size:2rem;margin-bottom:0;grid-column:2;justify-self:center}.forecast-temps{margin-bottom:0;grid-column:3;flex-direction:column;align-items:flex-end;gap:.25rem}.forecast-precipitation{grid-column:4;font-size:.75rem}.temp-main{font-size:2.5rem}.app.light .about-toggle-btn{background:#ffffff1a}.app.light .about-expandable{background:#0000001f}.app.light .about-expandable .about-content>p{background:#00000026}.app.light .about-note{background:#00000014}}@media (max-width: 360px){.main-content{padding:.5rem}.weather-overview{gap:1rem}.current-weather{padding:1rem}.temp-main{font-size:2.25rem}.weather-icon{font-size:2.5rem}.weather-details{padding:.75rem}.detail-item{padding:.5rem}.forecast-card{padding:.75rem;gap:.75rem}.forecast-icon{font-size:1.75rem}.temp-high{font-size:1.1rem}.temp-low{font-size:.9rem}.app.light .about-expandable{background:#0000001f}.app.light .about-expandable .about-content{padding:1rem}.app.light .about-expandable .about-content>p{background:#00000026;padding:.75rem}.app.light .about-note{background:#00000014;padding:.6rem .8rem}}.about-toggle-container{margin:3rem 0;max-width:100%}.about-toggle-btn{width:100%;background:#ffffff1a;border:none;border-bottom:1px solid rgba(255,255,255,.2);padding:1.5rem 2rem;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:1.1rem;font-weight:500;color:inherit;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.about-toggle-btn:hover{background:#ffffff26}.app.light .about-expandable{background:#0000001f}.about-arrow{transition:transform .3s ease;font-size:.9rem}.about-arrow.expanded{transform:rotate(180deg)}.about-expandable{max-height:0;overflow:hidden;transition:max-height .4s ease;background:#ffffff0d;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.about-expandable.expanded{max-height:2000px}.about-expandable .about-content{padding:2rem;line-height:1.6}.about-expandable .about-content>p{text-align:center;font-size:1.1rem;margin-bottom:2rem;padding:1rem;background:#ffffff0d;border-radius:10px;border-left:4px solid #52e08f}.app.light .about-expandable .about-content>p{background:#00000026;border-left:4px solid #2E8B57}.about-expandable .about-description,.about-expandable .about-how-it-works,.about-expandable .about-features,.about-expandable .about-data-source{margin-bottom:2rem}.about-expandable h3{color:#52e08f;margin-bottom:1rem;font-size:1.3rem;font-weight:500}.about-expandable ul{padding-left:1.5rem;margin-bottom:1rem}.about-expandable li{margin-bottom:.8rem;position:relative}.about-expandable li::marker{color:#52e08f}.about-expandable strong{color:#52e08f;font-weight:600}.app.light .about-expandable h3,.app.light .about-expandable li::marker,.app.light .about-expandable strong,.app.light .data-source-link{color:#00640fe3}.app.light .data-source-link:hover{color:#228b22;border-bottom-color:#228b22}.app.light .about-note{color:#000c;background:#00000014;border-left:3px solid #00640fe3}.about-note{opacity:.7;font-style:italic;font-size:.95rem;color:#fffc;background:#ffffff08;padding:.8rem 1rem;border-radius:8px;border-left:3px solid rgba(46,139,87,.5);margin-top:1rem}.data-source-link{color:#52e08f;text-decoration:none;font-weight:500;border-bottom:1px solid rgba(46,139,87,.3);transition:all .3s ease}.data-source-link:hover{color:#32cd32;border-bottom-color:#32cd32;text-shadow:0 0 8px rgba(46,139,87,.3)}.footer{background:#0003;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-top:1px solid rgba(255,255,255,.1);padding:2rem 1rem;margin-top:0;width:100vw}.footer-content{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.footer-left p{margin:.5rem 0;font-size:.9rem;opacity:.8}.footer-right{display:flex;align-items:center}.github-link{display:flex;align-items:center;gap:.5rem;color:inherit;text-decoration:none;padding:.8rem 1.5rem;background:#ffffff1a;border-radius:25px;border:1px solid rgba(255,255,255,.2);transition:all .3s ease;font-weight:500}.github-link:hover{background:#fff3;transform:translateY(-2px);box-shadow:0 5px 15px #0003}.github-link svg{transition:transform .3s ease}.github-link:hover svg{transform:rotate(360deg)}@media (max-width: 768px){.about-toggle-btn{padding:1rem 1.5rem;font-size:1rem}.about-expandable .about-content{padding:1.5rem}.about-expandable h3{font-size:1.1rem}.app.light .about-expandable .about-content>p{background:#00000026}.app.light .about-note{background:#00000014}.footer-content{flex-direction:column;text-align:center;gap:1.5rem}.footer-left,.footer-right{width:100%;justify-content:center}}
