*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0a0a1a;color:#e0e0e0;min-height:100vh}.landing{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(160deg,#0a0a1a,#0d1b2a,#1b2838)}.hero{text-align:center}.hero h1{font-size:3.5rem;font-weight:200;letter-spacing:.15em;color:#fff}.dot{color:#0cf}.tagline{margin-top:.5rem;font-size:.9rem;color:#667;letter-spacing:.3em;text-transform:uppercase}.actions{margin-top:2.5rem;display:flex;gap:1rem;justify-content:center}button{padding:.6rem 2rem;border:1px solid #00ccff;background:transparent;color:#0cf;font-size:.85rem;letter-spacing:.1em;cursor:pointer;transition:all .2s;text-transform:uppercase}button:hover{background:#0cf;color:#0a0a1a}button.secondary{border-color:#444;color:#888}button.secondary:hover{background:#333;color:#eee}.form-page{max-width:340px;margin:15vh auto;padding:0 1rem}.form-page h2{font-weight:200;font-size:1.6rem;letter-spacing:.1em;margin-bottom:1.5rem;color:#fff}form{display:flex;flex-direction:column;gap:.8rem}input{padding:.7rem;background:#111;border:1px solid #333;color:#eee;font-size:.9rem}input:focus{outline:none;border-color:#0cf}.error{color:#f55;font-size:.8rem;margin-bottom:.5rem}.hint{color:#888;font-size:.85rem;margin-bottom:.3rem}.link{margin-top:1rem;color:#556;font-size:.8rem;cursor:pointer}.link:hover{color:#0cf}.remember{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:#888;cursor:pointer}.remember input{accent-color:#00ccff}.dashboard header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;border-bottom:1px solid #1a1a2e}.dashboard header h1{font-size:1.2rem;font-weight:200;letter-spacing:.1em;color:#fff}.section-title{text-align:center;font-weight:300;font-size:1rem;color:#888;letter-spacing:.05em;margin:1rem 0 1.5rem}.city-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;max-width:800px;margin:1.5rem auto 0;padding:0 1rem}.city-box{height:75px;border:1px solid #1a1a2e;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.city-box:hover{border-color:#334}.city-box.active{border-color:#0cf;background:#00ccff0d}.city-name{font-size:.8rem;color:#aaa;letter-spacing:.05em}.city-temp{font-size:1rem;color:#fff;margin-top:.2rem}.city-cond{font-size:.65rem;color:#556;margin-top:.1rem}.tiles{display:grid;grid-template-columns:1fr 1fr;gap:1rem;max-width:800px;margin:0 auto;padding:0 1rem}.card{padding:1.5rem;border:1px solid #1a1a2e}.card h3{font-weight:400;font-size:.8rem;color:#556;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1rem}.weather{display:flex;align-items:center;gap:2rem;margin-bottom:1.5rem}.temp{font-size:3rem;font-weight:100;color:#fff}.details p{font-size:.85rem;color:#aaa;line-height:1.8}.forecast-row{display:flex;justify-content:space-between;align-items:center;padding:.3rem 0;font-size:.8rem;border-bottom:1px solid #111}.forecast-row:last-child{border-bottom:none}.day{width:50px;color:#aaa}.cond{flex:1;color:#777;font-size:.75rem}.hi-lo{width:70px;text-align:right}.hi{color:#eee}.lo{color:#556;margin-left:.5rem}.precip-row{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.8rem}.bar-wrap{flex:1;height:4px;background:#111;border-radius:2px}.bar{height:100%;background:#0cf;border-radius:2px;transition:width .3s}.pct{width:35px;text-align:right;color:#aaa}.amt{width:40px;text-align:right;color:#556;font-size:.75rem}.wind-now{margin-bottom:1rem;padding-bottom:.8rem;border-bottom:1px solid #1a1a2e}.wind-now strong{color:#fff;font-size:1.5rem;font-weight:200}.wind-now p{color:#aaa}.sub{color:#556;font-size:.75rem}.wind-row{display:flex;justify-content:space-between;align-items:center;padding:.3rem 0;font-size:.8rem;color:#aaa;border-bottom:1px solid #111}.wind-row:last-child{border-bottom:none}.refresh-btn{display:block;margin:1.5rem auto}.chart-wrap{margin:1.5rem 5% 0;padding:1.5rem 1rem;border:1px solid #1a1a2e;box-sizing:border-box}@media (max-width: 600px){.tiles{grid-template-columns:1fr}.city-bar{grid-template-columns:repeat(2,1fr)}}