.meteo *,.meteo *::before,.meteo *::after{box-sizing:border-box;margin:0;padding:0}
.meteo{--sky:#0a2f2c;--gold:#f2c45a;--gl:#ffe29a;
  --white:#fff;--w60:rgba(255,255,255,.6);--w10:rgba(255,255,255,.08);
  --bg:rgba(255,255,255,.07);--bd:rgba(255,255,255,.12);
  --r:16px;--rsm:10px;--sh:0 8px 32px rgba(0,0,0,.35);}
.meteo{font-family:var(--san);background:var(--sky);color:var(--white);min-height:100vh;overflow-x:hidden}
.meteo::before{content:'';position:absolute;inset:0;background:
  radial-gradient(ellipse 80% 50% at 20% 10%,rgba(47,127,120,.6) 0%,transparent 60%),
  linear-gradient(160deg,#0a2f2c 0%,#0c3f3a 40%,#0a2f2c 100%);z-index:-1}
.meteo::after{content:'';position:absolute;inset:0;background-image:
  radial-gradient(1px 1px at 15% 20%,rgba(255,255,255,.5) 0%,transparent 100%),
  radial-gradient(1px 1px at 60% 10%,rgba(255,255,255,.4) 0%,transparent 100%),
  radial-gradient(1px 1px at 85% 30%,rgba(255,255,255,.5) 0%,transparent 100%);
  z-index:-1;animation:tw 4s ease-in-out infinite alternate}
@keyframes tw{from{opacity:.6}to{opacity:1}}
.meteo .wrap{max-width:1100px;margin:0 auto;padding:24px 16px 60px}
.meteo .hdr{text-align:center;padding:40px 0 36px}
.meteo .badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.15);
  border:1px solid var(--bd);border-radius:50px;padding:5px 16px;
  font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gl);margin-bottom:16px}
.meteo .hdr h1{font-family:var(--ser);font-size:clamp(2rem,6vw,3.5rem);font-weight:900;line-height:1.1}
.meteo .hdr h1 span{color:var(--gold)}
.meteo .v2b{display:inline-block;background:linear-gradient(135deg,#f2c45a,#e8723a);color:#0a2f2c;
  font-size:.650rem;font-weight:700;padding:3px 10px;border-radius:50px;margin-left:8px;vertical-align:middle}
.meteo .msub{margin-top:8px;font-size:.9rem;color:var(--w60)}
.meteo .ri{margin-top:12px;font-size:.75rem;color:var(--w60);display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.meteo .rbtn{background:var(--w10);border:1px solid var(--bd);border-radius:50px;padding:3px 12px;
  font-size:.72rem;color:var(--w60);cursor:pointer;text-decoration:none;transition:all .2s;font-family:inherit}
.meteo .rbtn:hover{background:var(--gold);color:var(--sky);border-color:var(--gold)}
.meteo .st{font-family:var(--ser);font-size:1.1rem;font-weight:700;color:var(--gl);
  text-transform:uppercase;letter-spacing:.1em;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.meteo .st::after{content:'';flex:1;height:1px;background:var(--bd)}
.meteo .card{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r);padding:24px;backdrop-filter:blur(16px)}
.meteo .hgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}
@media(max-width:900px){.meteo .hgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.meteo .hgrid{grid-template-columns:1fr}}
.meteo .hcard{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r);
  padding:28px;backdrop-filter:blur(20px);box-shadow:var(--sh);position:relative;overflow:hidden;transition:transform .3s,box-shadow .3s}
.meteo .hcard:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(0,0,0,.45)}
.meteo .hcard.today{background:linear-gradient(135deg,rgba(47,127,120,.5),rgba(15,44,100,.6));border-color:rgba(242,196,90,.3)}
.meteo .hcard.today::before{content:'';position:absolute;top:-60px;right:-60px;width:180px;height:180px;
  background:radial-gradient(circle,rgba(242,196,90,.15) 0%,transparent 70%);pointer-events:none}
.meteo .hl{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--gold);font-weight:600;margin-bottom:4px}
.meteo .hd{font-size:.85rem;color:var(--w60);margin-bottom:20px}
.meteo .hm{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.meteo .ht{font-family:var(--ser);font-size:clamp(3.5rem,10vw,5rem);font-weight:900;line-height:1}
.meteo .ht sup{font-size:.4em;vertical-align:top;margin-top:.3em}
.meteo .he{font-size:3rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3));animation:fi 3s ease-in-out infinite}
@keyframes fi{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.meteo .hdesc{font-size:1rem;color:var(--w60);margin-top:6px}
.meteo .hfeel{margin-top:4px;font-size:.85rem;color:var(--gl)}
.meteo .hstats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:20px}
.meteo .si{background:var(--w10);border-radius:var(--rsm);padding:10px 12px}
.meteo .sl{color:var(--w60);font-size:.72rem;margin-bottom:2px}
.meteo .sv{font-weight:600;font-size:.92rem}
.meteo .sr{display:flex;gap:16px;margin-top:12px;font-size:.82rem;color:var(--w60)}
.meteo .sr strong{color:var(--gl)}
.meteo .frow{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-bottom:32px}
@media(max-width:900px){.meteo .frow{grid-template-columns:repeat(4,1fr)}}
@media(max-width:560px){.meteo .frow{grid-template-columns:repeat(2,1fr)}}
.meteo .dc{background:var(--bg);border:1px solid var(--bd);border-radius:var(--rsm);
  padding:14px 10px;text-align:center;backdrop-filter:blur(12px);transition:transform .25s}
.meteo .dc:hover{transform:translateY(-3px)}
.meteo .dn{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gl);font-weight:600}
.meteo .mdd{font-size:.7rem;color:var(--w60);margin-bottom:10px}
.meteo .de{font-size:1.8rem;display:block;margin:4px 0}
.meteo .dtp{display:flex;justify-content:center;gap:6px;font-size:.85rem;margin-top:6px}
.meteo .dmax{font-weight:700}
.meteo .dmin{color:var(--w60)}
.meteo .mdp{font-size:.7rem;color:#90caf9;margin-top:4px}
.meteo .drb{height:3px;background:var(--w10);border-radius:2px;margin-top:6px;overflow:hidden}
.meteo .drf{height:100%;background:linear-gradient(90deg,#42a5f5,#90caf9);border-radius:2px;transition:width 1s}
.meteo .agrid{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center}
@media(max-width:560px){.meteo .agrid{grid-template-columns:1fr}}
.meteo .an{font-family:var(--ser);font-size:4rem;font-weight:900;line-height:1}
.meteo .aqi-1{color:#66bb6a}
.meteo .aqi-2{color:#ffee58}
.meteo .aqi-3{color:#ffa726}
.meteo .aqi-4{color:#ef5350}
.meteo .aqi-5{color:#ab47bc}
.meteo .aqi-6{color:#8d6e63}
.meteo .al{font-size:.85rem;font-weight:600;margin-top:4px}
.meteo .ab{background:var(--w10);height:8px;border-radius:4px;overflow:hidden;margin:12px 0}
.meteo .abf{height:100%;border-radius:4px;background:linear-gradient(90deg,#66bb6a,#ffee58,#ffa726,#ef5350,#ab47bc)}
.meteo .polls{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin-top:8px}
.meteo .poll{background:var(--w10);border-radius:8px;padding:8px 10px;font-size:.75rem}
.meteo .pn{color:var(--w60)}
.meteo .pv{font-weight:600;font-size:.88rem;margin-top:2px}
.meteo .ctab{background:var(--w10);border:1px solid var(--bd);border-radius:50px;
  padding:5px 16px;font-size:.78rem;font-weight:600;color:var(--w60);cursor:pointer;transition:all .2s}
.meteo .ctab.active,.meteo .ctab:hover{background:var(--gold);border-color:var(--gold);color:var(--sky)}
.meteo .mac{border-radius:var(--rsm);padding:16px 20px;display:flex;align-items:flex-start;gap:14px}
.meteo .mac.ok{background:rgba(102,187,106,.12);border:1px solid rgba(102,187,106,.3)}
.meteo .mac.warning{background:rgba(255,167,38,.12); border:1px solid rgba(255,167,38,.4)}
.meteo .mac.danger{background:rgba(239,83,80,.15);  border:1px solid rgba(239,83,80,.5)}
.meteo .ai{font-size:1.8rem;flex-shrink:0}
.meteo .atit{font-weight:700;font-size:.92rem;margin-bottom:4px}
.meteo .mac.ok      .atit{color:#a5d6a7}
.meteo .mac.warning .atit{color:#ffcc80}
.meteo .mac.danger  .atit{color:#ef9a9a}
.meteo .amsg{font-size:.82rem;color:var(--w60);line-height:1.5}
.meteo .amsg strong{color:var(--white)}
.meteo .rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}
@media(max-width:700px){.meteo .rgrid{grid-template-columns:1fr}}
.meteo .rcard{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r);padding:20px;backdrop-filter:blur(14px)}
.meteo .rtit{font-family:var(--ser);font-size:1rem;font-weight:700;color:var(--gl);margin-bottom:4px}
.meteo .rsub{font-size:.75rem;color:var(--w60);margin-bottom:16px}
.meteo .rval{font-family:var(--ser);font-size:2.8rem;font-weight:900;line-height:1}
.meteo .runit{font-size:.82rem;color:var(--w60);margin-top:4px}
.meteo .rday{display:flex;justify-content:space-between;align-items:center;
  font-size:.78rem;padding:5px 0;border-bottom:1px solid var(--bd)}
.meteo .rday:last-child{border-bottom:none}
.meteo .rbw{flex:1;margin:0 10px;background:var(--w10);height:4px;border-radius:2px;overflow:hidden}
.meteo .rbf{height:100%;border-radius:2px}
.meteo .rbadge{display:inline-block;padding:1px 8px;border-radius:50px;font-size:.68rem;font-weight:600}
.meteo .rb-low{background:rgba(102,187,106,.2);color:#a5d6a7;border:1px solid rgba(102,187,106,.3)}
.meteo .rb-med{background:rgba(255,167,38,.2); color:#ffcc80;border:1px solid rgba(255,167,38,.3)}
.meteo .rb-high{background:rgba(239,83,80,.2);  color:#ef9a9a;border:1px solid rgba(239,83,80,.3)}
.meteo .sgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:32px}
.meteo .scard{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r);padding:20px;backdrop-filter:blur(14px);text-align:center}
.meteo .sico{font-size:2rem;margin-bottom:8px}
.meteo .sval{font-family:var(--ser);font-size:2.4rem;font-weight:900;color:var(--gold);line-height:1}
.meteo .sunit{font-size:.8rem;color:var(--w60);margin-top:4px}
.meteo .slbl{font-size:.82rem;font-weight:600;margin-top:8px;color:var(--gold)}
.meteo .ssub{font-size:.72rem;color:var(--w60);margin-top:4px}
.meteo .hicard{background:linear-gradient(135deg,rgba(47,127,120,.3),rgba(10,47,44,.5));
  border:1px solid rgba(242,196,90,.25);border-radius:var(--r);padding:24px;margin-bottom:32px}
.meteo .histats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-top:16px}
.meteo .histat{background:var(--w10);border-radius:var(--rsm);padding:12px;text-align:center}
.meteo .hisv{font-family:var(--ser);font-size:1.8rem;font-weight:900;color:var(--gold);line-height:1}
.meteo .hisl{font-size:.72rem;color:var(--w60);margin-top:4px}
.meteo .hdelta{background:var(--w10);border-radius:50px;padding:5px 14px;font-size:.78rem;font-weight:600}
.meteo .mtabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.meteo .mtab{background:var(--w10);border:1px solid var(--bd);border-radius:50px;
  padding:6px 18px;font-size:.8rem;font-weight:600;color:var(--w60);cursor:pointer;transition:all .2s}
.meteo .mtab.active,.meteo .mtab:hover{background:var(--gold);border-color:var(--gold);color:var(--sky)}
.meteo .mpanel{display:none}
.meteo .mpanel.active{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:700px){.meteo .mpanel.active{grid-template-columns:1fr}}
.meteo .mcard{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r);padding:20px;backdrop-filter:blur(16px)}
.meteo .mctit{font-family:var(--ser);font-size:1rem;font-weight:700;color:var(--gl);margin-bottom:14px}
.meteo .lmap{height:420px;border-radius:10px;overflow:hidden;border:1px solid var(--bd)}
.meteo .leaflet-popup-content-wrapper{background:#0c3f3a!important;color:#fff!important;
  border:1px solid rgba(255,255,255,.15)!important;border-radius:10px!important}
.meteo .leaflet-popup-tip{background:#0c3f3a!important}
.meteo .leaflet-popup-content{margin:10px 14px!important;font-family:var(--san)}
.meteo .pcity{font-weight:700;font-size:.95rem;margin-bottom:4px}
.meteo .ptemp{font-size:1.4rem;font-weight:900;color:#f2c45a}
.meteo .pdesc{font-size:.78rem;color:rgba(255,255,255,.7);margin-top:2px}
.meteo .pdet{font-size:.75rem;color:rgba(255,255,255,.6);margin-top:6px;display:flex;gap:8px;flex-wrap:wrap}
.meteo .mleg{display:flex;flex-direction:column;gap:6px;overflow-y:auto;max-height:420px}
.meteo .li{display:flex;align-items:center;gap:10px;background:var(--w10);
  border-radius:8px;padding:8px 12px;font-size:.8rem;transition:background .2s;cursor:pointer}
.meteo .li:hover{background:rgba(255,255,255,.14)}
.meteo .li.home{border:2px solid var(--gold)}
.meteo .li.sel{border:2px solid #66bb6a!important;background:rgba(102,187,106,.15)!important}
.meteo .ldot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.meteo .lcity{font-weight:600;flex:1}
.meteo .ltemp{font-weight:700;font-size:.9rem}
.meteo .footer{text-align:center;padding:24px 0;font-size:.75rem;color:var(--w60);border-top:1px solid var(--bd)}
.meteo .footer a{color:var(--gl);text-decoration:none}
.meteo .merr{background:rgba(239,83,80,.15);border:1px solid rgba(239,83,80,.3);border-radius:var(--rsm);padding:16px;text-align:center;color:#ef9a9a;margin-bottom:24px}
@keyframes fd{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fu{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.meteo{position:relative;isolation:isolate;overflow:hidden;min-height:100vh;padding-top:calc(var(--hh,78px) + 6px);font-family:var(--san);color:#fff;line-height:1.5}
.meteo a{color:inherit}.meteo h1,.meteo h2,.meteo h3{margin:0}.meteo p{margin:0}
.ma1{color:#66bb6a}
.ma2{color:var(--gold)}
.ma3{color:var(--gl);font-weight:600}
.ma4{margin-bottom:32px}
.ma5{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.ma6{position:relative;height:280px}
.ma7{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--w60);text-align:center}
.ma8{color:var(--gl)}
.ma9{display:flex;flex-direction:column;gap:12px;margin-bottom:32px}
.ma10{margin-top:14px}
.ma11{width:36px;color:var(--w60);font-size:.75rem}
.ma12{font-weight:700;font-size:.88rem}
.ma13{color:var(--w60);font-size:.85rem;margin-top:12px}
.ma14{display:flex;align-items:center;gap:12px}
.ma15{font-size:2rem}
.ma16{font-family:var(--ser);font-size:1.1rem;font-weight:700;color:var(--gl)}
.ma17{font-size:.8rem;color:var(--w60);margin-top:2px}
.ma18{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.ma19{color:#ef9a9a}
.ma20{color:#a5d6a7}
.ma21{color:var(--w60)}
.ma22{text-align:center}
.ma23{font-size:.72rem;color:var(--w60);margin-top:4px}
.ma24{color:var(--w60);font-size:.68rem}
.ma25{color:var(--w60);font-size:.8rem;font-weight:400}
.ma26{font-size:.72rem;color:var(--w60)}
.ma27{color:var(--w60);font-size:.75rem}
.ma28{margin-top:6px}
.meteo .frm-inline{display:inline;margin:0}.meteo .lnk-btn{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}.meteo .lnk-av.lnk-btn{color:var(--gold-light,#ffe29a);font-weight:600}.meteo button.rbtn{font:inherit;cursor:pointer}
