.weather-container{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem;position:relative;overflow:hidden}.weather-bg{position:fixed;inset:0;z-index:-1;transition:background 1.5s ease}.weather-bg--clear{background:linear-gradient(135deg,#0f172a,#1e3a5f 50%,#0f172a)}.weather-bg--cloudy{background:linear-gradient(135deg,#1a1a2e,#2d2d44 50%,#1a1a2e)}.weather-bg--rain{background:linear-gradient(135deg,#0d1117,#1a2332 50%,#0d1117)}.weather-bg--snow{background:linear-gradient(135deg,#1a1a2e,#2a2a4a 50%,#1a1a2e)}.weather-bg--storm{background:linear-gradient(135deg,#0a0a0a,#1a1520 50%,#0a0a0a)}.weather-bg--fog{background:linear-gradient(135deg,#1a1a1a,#2a2a2a 50%,#1a1a1a)}.weather-bg--loading{background:var(--background)}.weather-character{font-size:5rem;margin-bottom:1rem;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 4px 20px rgba(255,255,255,.1))}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.weather-icon{font-size:4rem;margin-bottom:.5rem;opacity:.9}.weather-dialogue{background:rgba(255,255,255,.06);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:1.25rem;padding:1.5rem 2rem;max-width:420px;text-align:center;position:relative;margin-bottom:2rem}.weather-dialogue:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);border:10px solid transparent;border-top-color:rgba(255,255,255,.06)}.weather-dialogue p{font-size:1.05rem;line-height:1.7;color:rgba(255,255,255,.9)}.weather-info{background:rgba(255,255,255,.04);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.08);border-radius:1rem;padding:1.5rem;width:100%;max-width:360px}.weather-temp{font-size:3.5rem;font-weight:200;letter-spacing:-2px;text-align:center;margin-bottom:.25rem}.weather-condition{text-align:center;font-size:.95rem;color:rgba(255,255,255,.6);margin-bottom:1rem}.weather-details{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.weather-detail{display:flex;flex-direction:column;align-items:center;gap:.25rem}.weather-detail__label{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.4)}.weather-detail__value{font-size:1rem;font-weight:500}.weather-location{display:flex;align-items:center;gap:.4rem;margin-bottom:2rem;font-size:.85rem;color:rgba(255,255,255,.5)}.weather-loading{display:flex;flex-direction:column;align-items:center;gap:1rem}.weather-loading__spinner{width:32px;height:32px;border:2px solid rgba(255,255,255,.1);border-top-color:rgba(255,255,255,.6);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.weather-error{text-align:center;color:rgba(255,255,255,.6)}.weather-error button{margin-top:1rem;padding:.5rem 1.5rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:.5rem;color:rgba(255,255,255,.8);cursor:pointer;transition:background .2s}.weather-error button:hover{background:rgba(255,255,255,.15)}.weather-location--clickable{background:none;border:1px solid transparent;border-radius:2rem;padding:.4rem 1rem;cursor:pointer;transition:all .2s;font:inherit}.weather-location--clickable:hover{border-color:rgba(255,255,255,.15);background:rgba(255,255,255,.05)}.weather-location__change{font-size:.6rem;opacity:.4;margin-left:.2rem}.weather-actions{display:flex;gap:.5rem;margin-top:1.5rem}.weather-action-btn{padding:.4rem 1rem;background:transparent;border:1px solid rgba(255,255,255,.12);border-radius:.5rem;color:rgba(255,255,255,.4);font-size:.75rem;cursor:pointer;transition:all .2s}.weather-action-btn:hover{border-color:rgba(255,255,255,.25);color:rgba(255,255,255,.7)}.city-search{display:flex;flex-direction:column;gap:1.5rem}.city-search__back{background:none;border:none;color:rgba(255,255,255,.5);font-size:.85rem;cursor:pointer;padding:0;margin-bottom:.5rem;transition:color .2s}.city-search__back:hover{color:rgba(255,255,255,.8)}.city-search__title{font-size:1.25rem;font-weight:600;margin-bottom:1rem;color:rgba(255,255,255,.9)}.city-search__bar{position:relative}.city-search__input-wrap{display:flex;align-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:.75rem;padding:.6rem 1rem;gap:.5rem;transition:border-color .2s}.city-search__input-wrap:focus-within{border-color:rgba(255,255,255,.3)}.city-search__icon{font-size:.9rem;opacity:.5}.city-search__input{flex:1;background:none;border:none;outline:none;color:rgba(255,255,255,.9);font-size:.95rem;font-family:inherit}.city-search__input::placeholder{color:rgba(255,255,255,.3)}.city-search__spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.1);border-top-color:rgba(255,255,255,.5);border-radius:50%;animation:spin .6s linear infinite}.city-search__dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:rgba(20,20,20,.95);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.12);border-radius:.75rem;overflow:hidden;list-style:none;margin:0;padding:0;z-index:10;animation:dropIn .15s ease}@keyframes dropIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.city-search__dropdown li button{display:flex;flex-direction:column;width:100%;padding:.7rem 1rem;background:none;border:none;color:rgba(255,255,255,.85);cursor:pointer;text-align:left;font-family:inherit;transition:background .15s}.city-search__dropdown li button:hover{background:rgba(255,255,255,.08)}.city-search__dropdown li+li{border-top:1px solid rgba(255,255,255,.06)}.city-search__result-name{font-size:.95rem;font-weight:500}.city-search__result-detail{font-size:.75rem;color:rgba(255,255,255,.4);margin-top:.15rem}.city-search__my-location{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.6rem;background:rgba(74,158,255,.1);border:1px solid rgba(74,158,255,.25);border-radius:.75rem;color:rgba(74,158,255,.9);font-size:.9rem;font-family:inherit;cursor:pointer;transition:all .2s}.city-search__my-location:hover{background:rgba(74,158,255,.18);border-color:rgba(74,158,255,.4)}.city-search__popular{display:flex;flex-direction:column;gap:1rem}.city-search__group{display:flex;flex-direction:column;gap:.4rem}.city-search__group-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.35);padding-left:.2rem}.city-search__chips{display:flex;flex-wrap:wrap;gap:.4rem}.city-search__chip{display:flex;align-items:center;gap:.3rem;padding:.35rem .7rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:2rem;color:rgba(255,255,255,.75);font-size:.8rem;font-family:inherit;cursor:pointer;transition:all .2s;white-space:nowrap}.city-search__chip:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.95)}.weather-fade-in{animation:fadeIn .8s ease forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}