:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh;background:#0a0a0a;color:#fafafa}.app{min-height:100vh;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 2rem;border-bottom:1px solid rgba(255,255,255,.06);background:#ffffff05;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0;z-index:100}.header-left{display:flex;align-items:baseline;gap:1rem}.logo{margin:0;font-size:1.4rem;font-weight:700;letter-spacing:-.03em;display:flex;align-items:center;gap:.5rem}.logo-icon{font-size:1.5rem}.logo-sub{margin:0;font-size:.75rem;color:#fff6;text-transform:uppercase;letter-spacing:.1em}.unit-toggle{display:flex;align-items:center;gap:.25rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:.5rem;padding:.4rem .75rem;cursor:pointer;font-size:.9rem;font-family:inherit;color:#fafafa;transition:background .2s}.unit-toggle:hover{background:#ffffff1a}.unit-active{color:#60a5fa;font-weight:700}.unit-inactive{color:#ffffff59}.unit-divider{color:#fff3;margin:0 .1rem}.main{flex:1;max-width:72rem;width:100%;margin:0 auto;padding:2rem;display:flex;flex-direction:column;gap:1.5rem}.search-container{position:relative;width:100%;max-width:32rem;margin:0 auto}.search-input-wrap{display:flex;align-items:center;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:.75rem;padding:0 1rem;transition:border-color .2s,box-shadow .2s}.search-input-wrap:focus-within{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f626}.search-icon{width:1.1rem;height:1.1rem;color:#ffffff59;flex-shrink:0}.search-input{flex:1;background:none;border:none;outline:none;color:#fafafa;font-size:.95rem;font-family:inherit;padding:.75rem}.search-input::placeholder{color:#ffffff4d}.search-clear{background:none;border:none;cursor:pointer;padding:.25rem;display:flex;color:#ffffff59;transition:color .2s}.search-clear:hover{color:#ffffffb3}.search-clear svg{width:1rem;height:1rem}.suggestions{position:absolute;top:calc(100% + .25rem);left:0;right:0;list-style:none;margin:0;padding:.35rem;background:#1a1a2e;border:1px solid rgba(255,255,255,.1);border-radius:.75rem;z-index:50;box-shadow:0 8px 32px #0006}.suggestion-item{display:flex;align-items:center;gap:.6rem;padding:.6rem .75rem;border-radius:.5rem;cursor:pointer;font-size:.9rem;color:#ffffffbf;transition:background .15s}.suggestion-item:hover{background:#ffffff14;color:#fafafa}.suggestion-icon{width:1rem;height:1rem;color:#ffffff59;flex-shrink:0}.quick-cities{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.quick-city{background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:2rem;padding:.35rem 1rem;color:#fff9;font-size:.8rem;font-family:inherit;cursor:pointer;transition:all .2s}.quick-city:hover{background:#3b82f626;border-color:#3b82f64d;color:#93c5fd}.current-weather{border-radius:1rem;padding:2rem;color:#fff;position:relative;overflow:hidden}.current-weather:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#00000040;pointer-events:none}.current-weather>*{position:relative;z-index:1}.current-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}.current-city{margin:0;font-size:2rem;font-weight:700;letter-spacing:-.03em}.current-country{margin:.15rem 0 0;font-size:.85rem;opacity:.7;text-transform:uppercase;letter-spacing:.1em}.current-temp-main{display:flex;align-items:center;gap:.5rem}.current-icon{font-size:2.5rem}.current-temp{font-size:3.5rem;font-weight:700;letter-spacing:-.04em;line-height:1}.current-details{margin-bottom:1.5rem}.current-condition{margin:0;font-size:1.15rem;font-weight:500}.current-feels{margin:.25rem 0 0;font-size:.85rem;opacity:.7}.current-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.stat{background:#0003;border-radius:.5rem;padding:.75rem;display:flex;flex-direction:column;gap:.25rem}.stat-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;opacity:.6}.stat-value{font-size:1rem;font-weight:600}.forecast-section{margin-top:.5rem}.forecast-title,.section-title{margin:0 0 1rem;font-size:1.1rem;font-weight:600;letter-spacing:-.02em;color:#ffffffd9}.forecast-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.65rem}.forecast-card{background:#ffffff0a;border:1px solid rgba(255,255,255,.06);border-radius:.75rem;padding:1rem .5rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.35rem;transition:background .2s,border-color .2s}.forecast-card:hover{background:#ffffff12;border-color:#ffffff1f}.forecast-day{margin:0;font-size:.85rem;font-weight:600;color:#ffffffe6}.forecast-date{margin:0;font-size:.7rem;color:#fff6}.forecast-icon{font-size:1.8rem;line-height:1}.forecast-condition{margin:0;font-size:.7rem;color:#ffffff80;min-height:2em}.forecast-temps{display:flex;gap:.5rem;font-size:.95rem;font-weight:600}.forecast-high{color:#fbbf24}.forecast-low{color:#fff6}.forecast-meta{display:flex;flex-direction:column;gap:.15rem;font-size:.65rem;color:#fff6}.insights-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}.insight-card{background:#ffffff0a;border:1px solid rgba(255,255,255,.06);border-radius:.75rem;padding:1.25rem;display:flex;flex-direction:column;gap:.5rem;transition:background .2s}.insight-card:hover{background:#ffffff0f}.insight-icon{font-size:1.5rem}.insight-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#ffffff73}.insight-value{font-size:.9rem;font-weight:600;color:#ffffffd9}.footer{text-align:center;padding:1.5rem;border-top:1px solid rgba(255,255,255,.06)}.footer p{margin:0;font-size:.75rem;color:#ffffff40}@media(max-width:768px){.header{flex-direction:column;gap:.75rem;align-items:flex-start}.main{padding:1.25rem}.current-header{flex-direction:column;gap:.75rem}.current-stats{grid-template-columns:repeat(2,1fr)}.forecast-grid{grid-template-columns:repeat(4,1fr)}.insights-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.forecast-grid{grid-template-columns:repeat(3,1fr)}.insights-grid{grid-template-columns:1fr}.current-temp{font-size:2.5rem}.current-city{font-size:1.5rem}}