@import "https://fonts.googleapis.com/css2?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";@import "https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";*{box-sizing:border-box;margin:0;padding:0}.app{place-items:center;min-height:100vh;display:grid}:root{--clr-bg-start:#05006d;--clr-bg-end:#00d4ff;--clr-surface:#ffffff21;--clr-surface-hover:#fff3;--clr-border:#ffffff38;--clr-text:#fff;--clr-text-muted:#c8e8f0;--clr-input-bg:#ffffffeb;--clr-input-text:#0a0a2e;--clr-accent:#00d4ff;--clr-shadow:#00000047;--container-width:440px;--container-padding:36px 32px;--border-radius-lg:24px;--border-radius-md:14px;--border-radius-pill:50px;--font-base:"Poppins", sans-serif;--text-xs:.78rem;--text-sm:.92rem;--text-base:1rem;--text-md:1.15rem;--text-lg:1.4rem;--text-xl:2.1rem;--text-2xl:3rem;--text-3xl:4.2rem;--ease-bounce:cubic-bezier(.34, 1.56, .64, 1);--ease-smooth:cubic-bezier(.4, 0, .2, 1);--duration-fast:.18s;--duration-base:.3s;--duration-slow:.5s}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{background:linear-gradient(135deg, var(--clr-bg-start) 0%, #0a0060 40%, var(--clr-bg-end) 100%);min-height:100vh;font-family:var(--font-base);color:var(--clr-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-attachment:fixed;flex-direction:column;justify-content:center;align-items:center;padding:24px 16px;display:flex}body:before{content:"";pointer-events:none;z-index:0;opacity:.35;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");position:fixed;inset:0}.weather-title{text-align:center;font-size:clamp(1.8rem, 5vw, var(--text-2xl));color:var(--clr-text);letter-spacing:-.02em;text-shadow:0 2px 20px #00d4ff59;animation:fadeSlideDown var(--duration-slow) var(--ease-smooth) both;margin-bottom:22px;font-weight:700}.container{z-index:1;width:min(var(--container-width), 100%);padding:var(--container-padding);border-radius:var(--border-radius-lg);background:var(--clr-surface);-webkit-backdrop-filter:blur(20px)saturate(1.4);border:1px solid var(--clr-border);box-shadow:0 8px 32px var(--clr-shadow), 0 1px 0 #ffffff1f inset, 0 -1px 0 #0000001a inset;animation:fadeSlideUp var(--duration-slow) var(--ease-smooth) both;flex-direction:column;align-items:center;display:flex;position:relative}.container:after{content:"";border-radius:calc(var(--border-radius-lg) + 1px);z-index:-1;pointer-events:none;background:linear-gradient(135deg,#00d4ff4d,#0000 60%);position:absolute;inset:-1px}.search{align-items:center;gap:10px;width:100%;margin-bottom:28px;display:flex}.search input{border-radius:var(--border-radius-pill);height:48px;font-size:var(--text-base);font-family:var(--font-base);color:var(--clr-input-text);background:var(--clr-input-bg);transition:border-color var(--duration-base) var(--ease-smooth), box-shadow var(--duration-base) var(--ease-smooth);border:2px solid #0000;outline:none;flex:1;padding:0 20px;font-weight:400}.search input::placeholder{color:#8a9ab0}.search input:focus{border-color:var(--clr-accent);box-shadow:0 0 0 4px #00d4ff2e}.search-icon{cursor:pointer;width:48px;height:48px;color:var(--clr-text);background:var(--clr-surface-hover);border:none;border:1px solid var(--clr-border);transition:transform var(--duration-base) var(--ease-bounce), background var(--duration-base) var(--ease-smooth), box-shadow var(--duration-base) var(--ease-smooth);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.search-icon:hover,.search-icon:focus-visible{background:#00d4ff40;outline:none;transform:scale(1.12);box-shadow:0 0 0 3px #00d4ff33}.search-icon:active{transform:scale(.96)}.weather-info{flex-direction:column;align-items:center;gap:4px;width:100%;display:flex}.description{font-size:var(--text-md);color:var(--clr-text-muted);text-transform:capitalize;letter-spacing:.02em;font-weight:500}.weather-icon{object-fit:contain;filter:drop-shadow(0 4px 16px #00d4ff66);width:clamp(110px,30vw,148px);height:clamp(110px,30vw,148px);margin:8px 0;animation:4s ease-in-out infinite floatIcon}.temperature{font-size:clamp(3rem, 10vw, var(--text-3xl));color:var(--clr-text);letter-spacing:-.03em;font-weight:700;line-height:1}.city{font-size:clamp(1.3rem, 4vw, var(--text-xl));color:var(--clr-text);letter-spacing:-.01em;margin-top:4px;font-weight:600}.weather-data{border-top:1px solid var(--clr-border);justify-content:space-between;align-items:center;gap:12px;width:100%;margin-top:32px;padding-top:24px;display:flex}.col{flex:1;align-items:center;gap:10px;display:flex}.col:last-child{justify-content:flex-end}.data-icon{opacity:.9;flex-shrink:0;width:38px;height:38px}.col p{font-size:var(--text-md);color:var(--clr-text);font-weight:600;line-height:1.2}.col span{font-size:var(--text-xs);color:var(--clr-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-top:2px;font-weight:400;display:block}.error-message{font-size:var(--text-sm);color:#ff8a80;text-align:center;min-height:1.2em;margin-top:8px}.loading{opacity:.5;pointer-events:none;animation:1.2s ease-in-out infinite pulse}@keyframes fadeSlideDown{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes floatIcon{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes pulse{0%,to{opacity:.5}50%{opacity:.3}}@media (width<=520px){:root{--container-padding:28px 22px}.weather-data{flex-direction:column;align-items:flex-start;gap:16px}.col:last-child{justify-content:flex-start}}@media (width<=360px){:root{--container-padding:22px 16px}.search input{height:42px;font-size:var(--text-sm)}.search-icon{width:42px;height:42px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media (prefers-contrast:high){.container{border-color:#fff9}}.footer-links{justify-content:center;align-items:center;gap:18px;margin:14px 0 10px;display:flex}.footer-links a{color:#ffffffc7;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff0d;border:1px solid #ffffff14;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-size:1.25rem;text-decoration:none;transition:transform .25s,color .25s,background .25s,box-shadow .25s;display:flex}.footer-links a:hover,.footer-links a:focus-visible{color:#00d4ff;background:#00d4ff1f;outline:none;transform:translateY(-3px);box-shadow:0 0 12px #00d4ff59,0 0 24px #00d4ff26}.footer-links a:active{transform:scale(.96)}.footer-links a:after{display:none}