/* HotelDelta V1.21 — Météo opérationnelle immersive */
#meteo-panel{background:#071423!important;color:#f6f9ff!important;overflow-y:auto!important;overscroll-behavior:contain;padding:0 0 calc(22px + env(safe-area-inset-bottom,0px))!important}
#meteo-panel>.panel-header.hd-meteo-header{position:sticky!important;top:0!important;z-index:90!important;margin:0!important;padding:calc(8px + env(safe-area-inset-top,0px)) 14px 8px!important;background:linear-gradient(180deg,rgba(5,17,31,.96),rgba(5,17,31,.82) 78%,transparent)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:0!important}
#meteo-panel .hd-panel-title b{color:#fff!important}
#meteo-panel .hd-panel-title small{color:#87a3c6!important}
#meteo-contenu{margin:0!important;padding:0 12px 18px!important}
#meteo-statut{margin:0 16px!important;color:#9db0c9!important}
#meteo-onglets{position:sticky!important;top:calc(58px + env(safe-area-inset-top,0px))!important;z-index:70!important;margin:0 0 10px!important;background:rgba(11,29,49,.86)!important;border:1px solid rgba(255,255,255,.08)!important;box-shadow:0 8px 28px rgba(0,0,0,.2)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
#meteo-onglets button{color:#91a7c3!important;background:transparent!important;border:0!important}
#meteo-onglets button.actif{background:#123a66!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(89,174,255,.34)!important}

.hd-wx-pro{--wx-accent:#46a9ff;--wx-warm:#ffae43;display:grid;gap:12px;padding-bottom:14px}
.hd-wx-hero{position:relative;min-height:315px;border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.10);box-shadow:0 22px 55px rgba(0,0,0,.28);isolation:isolate;background:linear-gradient(180deg,#174f7a,#386b8e 46%,#263b45 100%);transition:background .55s ease}
.hd-wx-hero:before,.hd-wx-hero:after{content:"";position:absolute;inset:0;pointer-events:none;transition:opacity .5s ease}
.hd-wx-hero:before{background:radial-gradient(circle at 73% 28%,rgba(255,214,119,.95) 0 3%,rgba(255,176,67,.35) 4%,transparent 23%),linear-gradient(180deg,transparent 45%,rgba(5,19,31,.55));opacity:.95}
.hd-wx-hero:after{background:linear-gradient(180deg,rgba(3,12,23,.05),rgba(2,9,18,.52));z-index:1}
.hd-wx-hero[data-scene="night"]{background:linear-gradient(180deg,#06162e,#0a2843 60%,#101a27)}
.hd-wx-hero[data-scene="night"]:before{background:radial-gradient(circle at 74% 22%,#f8f3db 0 2.2%,rgba(232,239,255,.25) 2.6%,transparent 15%),radial-gradient(circle at 15% 22%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 42% 14%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 64% 33%,#fff 0 1px,transparent 1.5px);opacity:.8}
.hd-wx-hero[data-weather="rain"]{background:linear-gradient(180deg,#1a3348,#273f52 52%,#162633)}
.hd-wx-hero[data-weather="rain"]:before{background:repeating-linear-gradient(105deg,transparent 0 18px,rgba(147,207,255,.16) 19px 21px,transparent 22px 35px),linear-gradient(180deg,rgba(115,154,178,.2),transparent);animation:hdWxRain 1.25s linear infinite}
.hd-wx-hero[data-weather="storm"]{background:linear-gradient(180deg,#141b31,#252b3e 48%,#101923)}
.hd-wx-hero[data-weather="storm"]:before{background:radial-gradient(circle at 70% 30%,rgba(201,218,255,.38),transparent 11%),linear-gradient(120deg,transparent 46%,rgba(239,245,255,.7) 47%,transparent 48%);animation:hdWxFlash 6s infinite}
.hd-wx-hero[data-weather="cloud"]{background:linear-gradient(180deg,#36546e,#536a7c 54%,#263b47)}
.hd-wx-hero[data-weather="fog"]{background:linear-gradient(180deg,#60717c,#78868d 56%,#4f5c63)}
.hd-wx-hero[data-weather="snow"]{background:linear-gradient(180deg,#7893aa,#afc3d1 60%,#667d91)}
.hd-wx-clouds{position:absolute;inset:0;z-index:0;overflow:hidden;opacity:.75}
.hd-wx-clouds i{position:absolute;width:180px;height:58px;border-radius:70px;background:rgba(255,255,255,.18);filter:blur(8px);animation:hdWxCloud 22s linear infinite}
.hd-wx-clouds i:after,.hd-wx-clouds i:before{content:"";position:absolute;border-radius:50%;background:inherit}
.hd-wx-clouds i:before{width:75px;height:75px;left:30px;top:-28px}.hd-wx-clouds i:after{width:92px;height:92px;right:25px;top:-38px}
.hd-wx-clouds i:nth-child(1){top:18%;left:-35%;animation-duration:26s}.hd-wx-clouds i:nth-child(2){top:39%;left:-55%;width:240px;opacity:.62;animation-duration:34s;animation-delay:-12s}
.hd-wx-hero-body{position:relative;z-index:2;min-height:315px;padding:22px 18px 17px;display:flex;flex-direction:column;justify-content:flex-end;text-shadow:0 2px 14px rgba(0,0,0,.28)}
.hd-wx-place{position:absolute;top:18px;left:18px;right:18px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.hd-wx-place strong{font-size:20px;letter-spacing:.4px;display:block}.hd-wx-place small{font-size:11px;color:rgba(244,249,255,.72)}
.hd-wx-live-btn{border:1px solid rgba(255,255,255,.25)!important;background:rgba(5,20,37,.45)!important;color:#fff!important;min-width:76px;height:40px;border-radius:14px!important;font-size:12px;font-weight:850;display:flex;align-items:center;justify-content:center;gap:7px;backdrop-filter:blur(12px)}
.hd-wx-live-dot{width:7px;height:7px;border-radius:50%;background:#3fb1ff;box-shadow:0 0 0 5px rgba(63,177,255,.15);animation:hdWxPulse 1.8s infinite}
.hd-wx-temp{font-size:78px;line-height:.9;font-weight:300;letter-spacing:-5px}.hd-wx-temp sup{font-size:.42em;vertical-align:top;margin-left:2px}.hd-wx-condition{font-size:20px;font-weight:760;margin-top:8px}.hd-wx-hero-sub{margin-top:8px;display:flex;gap:12px;flex-wrap:wrap;color:#e6f1ff;font-size:12px;font-weight:650}
.hd-wx-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:-29px;position:relative;z-index:4;padding:0 10px}
.hd-wx-card{min-width:0;background:rgba(8,27,48,.84);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:10px 9px;box-shadow:0 9px 24px rgba(0,0,0,.2)}
.hd-wx-card span{display:block;font-size:8px;color:#8da8c8;text-transform:uppercase;letter-spacing:.7px}.hd-wx-card b{display:block;color:#f8fbff;font-size:15px;margin-top:3px;white-space:nowrap}.hd-wx-card small{display:block;color:#7c9bc0;font-size:8px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-wx-op{border-radius:17px;background:linear-gradient(115deg,rgba(18,52,83,.95),rgba(10,31,52,.95));border:1px solid rgba(255,255,255,.08);padding:13px 14px;display:grid;grid-template-columns:37px 1fr auto;gap:10px;align-items:center}
.hd-wx-op-icon{width:37px;height:37px;border-radius:12px;display:grid;place-items:center;background:rgba(255,137,39,.12);font-size:20px}.hd-wx-op b{font-size:13px;color:#fff}.hd-wx-op small{display:block;color:#96aac4;font-size:10px;margin-top:2px}.hd-wx-score{font-size:17px;font-weight:900}.hd-wx-op.low .hd-wx-score{color:#66d492}.hd-wx-op.mid .hd-wx-score{color:#ffbd52}.hd-wx-op.high .hd-wx-score{color:#ff655f}
.hd-wx-switch{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:3px;background:#0b2138;border:1px solid rgba(255,255,255,.07);border-radius:14px;position:sticky;top:calc(109px + env(safe-area-inset-top,0px));z-index:65;backdrop-filter:blur(16px)}
.hd-wx-switch button{border:0!important;background:transparent!important;color:#819bbb!important;border-radius:11px!important;min-height:38px;font-size:11px;font-weight:780}.hd-wx-switch button.active{background:#123f6d!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(78,171,255,.24)}
.hd-wx-view.hidden{display:none!important}
.hd-wx-section{background:linear-gradient(165deg,#0d2138,#0a1b2e);border:1px solid rgba(255,255,255,.075);border-radius:19px;padding:13px;overflow:hidden}.hd-wx-section-head{display:flex;justify-content:space-between;align-items:end;gap:10px;margin-bottom:10px}.hd-wx-kicker{font-size:8px;color:#6d9ed0;font-weight:850;letter-spacing:1.2px;text-transform:uppercase}.hd-wx-section-head b{font-size:15px}.hd-wx-section-head small{font-size:9px;color:#7591b2}
.hd-wx-hour-strip{display:flex;gap:7px;overflow-x:auto;padding:1px 1px 8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.hd-wx-hour-strip::-webkit-scrollbar{display:none}.hd-wx-hour{flex:0 0 69px;scroll-snap-align:center;border:1px solid rgba(255,255,255,.065)!important;background:#0b1d31!important;color:#dfeaff!important;border-radius:15px!important;padding:10px 6px!important;text-align:center;min-height:106px}.hd-wx-hour.active{border-color:#3da8ff!important;background:#10355b!important;box-shadow:0 0 0 1px rgba(61,168,255,.16),0 7px 22px rgba(0,0,0,.2)}.hd-wx-hour time{font-size:10px;color:#91a8c4}.hd-wx-hour .ico{font-size:24px;display:block;margin:7px 0}.hd-wx-hour b{font-size:18px}.hd-wx-hour small{display:block;color:#70baff;font-size:9px;margin-top:4px}
.hd-wx-hour-readout{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:5px}.hd-wx-hour-readout div{background:#09192a;border-radius:11px;padding:8px}.hd-wx-hour-readout span{font-size:7px;color:#6f89a8;text-transform:uppercase}.hd-wx-hour-readout b{display:block;font-size:11px;margin-top:2px}
.hd-wx-wind-grid{display:grid;grid-template-columns:116px 1fr;gap:10px;align-items:center}.hd-wx-rose{position:relative;width:112px;height:112px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:radial-gradient(circle,rgba(46,120,190,.15),transparent 58%)}.hd-wx-rose:before,.hd-wx-rose:after{content:"";position:absolute;background:rgba(255,255,255,.12)}.hd-wx-rose:before{width:1px;height:88%;left:50%;top:6%}.hd-wx-rose:after{height:1px;width:88%;left:6%;top:50%}.hd-wx-rose .n,.hd-wx-rose .s,.hd-wx-rose .e,.hd-wx-rose .o{position:absolute;font-size:8px;color:#9bb1cb}.hd-wx-rose .n{top:3px;left:50%;transform:translateX(-50%)}.hd-wx-rose .s{bottom:3px;left:50%;transform:translateX(-50%)}.hd-wx-rose .e{right:5px;top:50%;transform:translateY(-50%)}.hd-wx-rose .o{left:5px;top:50%;transform:translateY(-50%)}.hd-wx-arrow{position:absolute;width:44px;height:44px;left:34px;top:34px;transition:transform .35s ease}.hd-wx-arrow:before{content:"";position:absolute;left:18px;top:-17px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:42px solid #42aaff;filter:drop-shadow(0 0 5px rgba(56,166,255,.45));transform-origin:50% 38px}.hd-wx-arrow:after{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:#dff2ff;left:17px;top:17px;box-shadow:0 0 0 5px rgba(57,166,255,.18)}
.hd-wx-wind-chart{min-width:0}.hd-wx-wind-chart svg{display:block;width:100%;height:126px}.hd-wx-grid-line{stroke:rgba(255,255,255,.08);stroke-width:1}.hd-wx-wind-line{fill:none;stroke:#42aaff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.hd-wx-gust-line{fill:none;stroke:#ff9d2f;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.hd-wx-wind-cursor{stroke:#fff;stroke-opacity:.35;stroke-dasharray:3 3}.hd-wx-legend{display:flex;gap:10px;font-size:8px;color:#8aa1bd;margin-top:4px}.hd-wx-legend i{display:inline-block;width:12px;height:2px;vertical-align:middle;margin-right:4px;background:#42aaff}.hd-wx-legend span:last-child i{background:#ff9d2f}
.hd-wx-sun{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hd-wx-sun>div{background:#0a1a2b;border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:11px}.hd-wx-sun span{font-size:8px;color:#7895b6;text-transform:uppercase}.hd-wx-sun b{font-size:18px;display:block;margin-top:3px}.hd-wx-daylight{grid-column:1/-1!important;background:linear-gradient(90deg,rgba(255,171,57,.14),rgba(64,165,255,.12))!important}
.hd-wx-days{display:flex;gap:8px;overflow-x:auto;padding-bottom:5px;scroll-snap-type:x mandatory}.hd-wx-days::-webkit-scrollbar{display:none}.hd-wx-day{flex:0 0 118px;scroll-snap-align:start;background:#0a1a2c;border:1px solid rgba(255,255,255,.065);border-radius:15px;padding:11px}.hd-wx-day strong{font-size:11px}.hd-wx-day .ico{display:block;font-size:25px;margin:9px 0}.hd-wx-day b{font-size:18px}.hd-wx-day b span{font-size:12px;color:#718aa8;font-weight:600}.hd-wx-day small{display:block;color:#7d98b7;font-size:8px;margin-top:6px}.hd-wx-day details{margin-top:8px}.hd-wx-day summary{font-size:8px;color:#55afff;cursor:pointer}.hd-wx-day dl{display:grid;gap:4px;margin:8px 0 0}.hd-wx-day dl div{display:flex;justify-content:space-between;gap:5px;font-size:8px}.hd-wx-day dt{color:#7188a5}.hd-wx-day dd{margin:0;color:#dfe9f6;font-weight:700}
.hd-wx-source{text-align:center;color:#607994;font-size:8px;padding:3px 5px 12px}

/* Radar Live */
.hd-wx-live{position:fixed;inset:0;z-index:12000;background:#07131f;display:flex;flex-direction:column}.hd-wx-live.hidden{display:none!important}.hd-wx-live-map{position:absolute;inset:0}.hd-wx-live-top{position:absolute;z-index:5;top:calc(10px + env(safe-area-inset-top,0px));left:12px;right:12px;display:flex;align-items:center;gap:9px;pointer-events:none}.hd-wx-live-top>*{pointer-events:auto}.hd-wx-live-back{width:46px;height:46px;border-radius:16px!important;border:1px solid rgba(255,255,255,.22)!important;background:rgba(6,22,38,.76)!important;color:#fff!important;font-size:25px;backdrop-filter:blur(14px)}.hd-wx-live-title{padding:9px 12px;border-radius:15px;background:rgba(6,22,38,.75);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(14px);min-width:0}.hd-wx-live-title b{display:block;font-size:13px}.hd-wx-live-title small{display:block;font-size:9px;color:#8eabc9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hd-wx-radar-legend{position:absolute;z-index:5;top:calc(72px + env(safe-area-inset-top,0px));left:14px;right:14px;background:rgba(7,24,40,.72);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(14px);border-radius:13px;padding:8px 10px}.hd-wx-radar-legend-head{display:flex;justify-content:space-between;gap:8px;font-size:8px;color:#b8c9dc;margin-bottom:5px}.hd-wx-radar-scale{height:8px;border-radius:9px;background:linear-gradient(90deg,transparent,#88ddee,#00a3e0,#0070a3,#6c56c5,#ffb000,#ff4d00,#ba0015)}
.hd-wx-live-bottom{position:absolute;z-index:5;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));background:rgba(6,22,38,.82);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:10px;backdrop-filter:blur(18px)}.hd-wx-radar-time{font-size:12px;font-weight:800;text-align:center;margin-bottom:7px}.hd-wx-radar-controls{display:grid;grid-template-columns:44px 1fr;gap:8px;align-items:center}.hd-wx-radar-play{height:42px;border-radius:13px!important;border:0!important;background:#143f68!important;color:#fff!important;font-size:17px}.hd-wx-radar-frames{display:flex;gap:5px;overflow-x:auto;scroll-snap-type:x mandatory}.hd-wx-radar-frames::-webkit-scrollbar{display:none}.hd-wx-radar-frame{flex:0 0 60px;scroll-snap-align:center;border:0!important;border-radius:10px!important;background:#102b49!important;color:#8eaac7!important;padding:7px 4px!important;font-size:9px}.hd-wx-radar-frame.active{background:#1762a2!important;color:#fff!important;box-shadow:inset 0 0 0 1px #55b6ff}.hd-wx-radar-credit{font-size:7px;color:#8298b0;text-align:center;margin-top:7px}.hd-wx-radar-status{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(4,17,30,.85);padding:10px 14px;border-radius:12px;font-size:11px;color:#d6e6f7}.hd-wx-radar-status.hidden{display:none}
.hd-wx-live-risks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-bottom:8px}.hd-wx-live-risks article,.hd-wx-live-risks a{min-width:0;border-radius:11px;padding:7px 6px;background:#0b2138;border:1px solid rgba(255,255,255,.09);color:#eef7ff;text-decoration:none}.hd-wx-live-risks span,.hd-wx-live-risks small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hd-wx-live-risks span{font-size:6px;color:#8fa9c5;font-weight:800}.hd-wx-live-risks b{display:block;font-size:10px;margin:3px 0}.hd-wx-live-risks small{font-size:6.5px;color:#7f9ab8}.hd-wx-live-risks .watch b{color:#ffd15c}.hd-wx-live-risks .high b{color:#ff9a4d}.hd-wx-live-risks .danger b{color:#ff5e62}.hd-wx-live-risks .low b{color:#68d59a}.hd-wx-live-risks .official b{color:#63b8ff}.hd-wx-live-risks .loading,.hd-wx-live-risks .unavailable{grid-column:1/-1;text-align:center}

@keyframes hdWxCloud{from{transform:translateX(0)}to{transform:translateX(155vw)}}
@keyframes hdWxRain{from{background-position:0 0,0 0}to{background-position:0 48px,0 0}}
@keyframes hdWxFlash{0%,91%,94%,100%{opacity:.22}92%,93%{opacity:1}}
@keyframes hdWxPulse{0%,100%{transform:scale(.85);opacity:.8}50%{transform:scale(1.12);opacity:1}}
@media(prefers-reduced-motion:reduce){.hd-wx-clouds i,.hd-wx-live-dot,.hd-wx-hero[data-weather="rain"]:before,.hd-wx-hero[data-weather="storm"]:before{animation:none!important}}
@media(max-width:390px){.hd-wx-hero{min-height:292px}.hd-wx-hero-body{min-height:292px}.hd-wx-temp{font-size:69px}.hd-wx-cards{gap:5px;padding:0 6px}.hd-wx-card{padding:9px 6px}.hd-wx-card b{font-size:13px}.hd-wx-wind-grid{grid-template-columns:104px 1fr}.hd-wx-rose{width:100px;height:100px}.hd-wx-arrow{left:28px;top:28px}}
@media(orientation:landscape) and (max-height:600px){#meteo-panel{padding-bottom:10px!important}.hd-wx-hero{min-height:230px}.hd-wx-hero-body{min-height:230px}.hd-wx-temp{font-size:58px}.hd-wx-cards{grid-template-columns:repeat(4,1fr);margin-top:-24px}.hd-wx-pro{grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);align-items:start}.hd-wx-hero,.hd-wx-cards,.hd-wx-op,.hd-wx-switch{grid-column:1/-1}.hd-wx-view{min-width:0}.hd-wx-section{margin-bottom:10px}.hd-wx-live-bottom{left:18%;right:18%}}
@media(max-width:520px){.hd-wx-live-risks{grid-template-columns:repeat(2,minmax(0,1fr))}.hd-wx-live-risks article,.hd-wx-live-risks a{padding:6px}.hd-wx-live-risks b{font-size:9px}}
@media(orientation:landscape) and (max-height:600px){.hd-wx-live-risks{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:5px}.hd-wx-live-risks article,.hd-wx-live-risks a{padding:4px 5px}.hd-wx-live-risks small{display:none}.hd-wx-live-risks b{font-size:8px;margin:2px 0}.hd-wx-radar-time{margin-bottom:4px!important}.hd-wx-radar-controls{grid-template-columns:38px 1fr!important}.hd-wx-radar-play{height:36px!important}}


/* V1.23 — robustesse portrait et lisibilité opérationnelle */
#meteo-panel,
#meteo-contenu,
#meteo-contenu-donnees,
.hd-wx-pro,
.hd-wx-hero,
.hd-wx-cards,
.hd-wx-op,
.hd-wx-switch,
.hd-wx-view,
.hd-wx-section{
  box-sizing:border-box!important;
  max-width:100%!important;
}
#meteo-panel,
#meteo-contenu,
#meteo-contenu-donnees,
.hd-wx-pro{
  overflow-x:hidden!important;
}
.hd-wx-wind-values{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin:0 0 10px;
}
.hd-wx-wind-values>div{
  min-width:0;
  background:#09192a;
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px;
  padding:8px 9px;
}
.hd-wx-wind-values span{
  display:block;
  color:#7893b3;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.5px;
}
.hd-wx-wind-values b{
  display:block;
  color:#f4f8ff;
  font-size:12px;
  margin-top:3px;
  white-space:nowrap;
}
.hd-wx-chart-unit{
  color:#728cab;
  font-size:8px;
  margin:0 0 3px;
}
.hd-wx-wind-note{
  margin:8px 0 0;
  color:#7891af;
  font-size:8px;
  line-height:1.4;
}

.hd-wx-live.closing{
  opacity:0!important;
  pointer-events:auto!important;
  transition:opacity .16s ease!important;
}
.hd-wx-radar-legend{
  pointer-events:none;
}
.hd-wx-radar-labels{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:4px;
  color:#b5c9dd;
  font-size:7px;
  text-align:center;
}
.hd-wx-radar-explain{
  color:#9cb1c8;
  font-size:7px;
  line-height:1.35;
  margin-top:6px;
}
.hd-wx-radar-locate{
  position:absolute;
  z-index:7;
  right:12px;
  top:calc(128px + env(safe-area-inset-top,0px));
  width:42px;
  height:42px;
  border-radius:14px!important;
  border:1px solid rgba(255,255,255,.22)!important;
  background:rgba(6,22,38,.82)!important;
  color:#fff!important;
  font-size:23px;
  font-weight:800;
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.hd-wx-radar-marker{
  width:30px;
  height:30px;
  position:relative;
  pointer-events:none;
}
.hd-wx-radar-marker.user .pulse{
  position:absolute;
  inset:2px;
  border-radius:50%;
  background:rgba(44,166,255,.22);
  animation:hdWxGpsPulse 1.8s ease-out infinite;
}
.hd-wx-radar-marker.user .dot{
  position:absolute;
  width:13px;
  height:13px;
  left:8.5px;
  top:8.5px;
  border-radius:50%;
  background:#2ba6ff;
  border:3px solid #fff;
  box-shadow:0 2px 9px rgba(0,0,0,.45);
}
.hd-wx-radar-marker.target .target-dot{
  position:absolute;
  width:15px;
  height:15px;
  left:7.5px;
  top:7.5px;
  transform:rotate(45deg);
  background:#8b5cf6;
  border:3px solid #fff;
  border-radius:4px 50% 50% 50%;
  box-shadow:0 2px 9px rgba(0,0,0,.45);
}
@keyframes hdWxGpsPulse{
  0%{transform:scale(.6);opacity:.9}
  100%{transform:scale(1.35);opacity:0}
}

@media (orientation:portrait){
  #meteo-contenu{
    padding-left:10px!important;
    padding-right:10px!important;
  }
  .hd-wx-pro{
    width:100%!important;
    gap:10px!important;
  }
  .hd-wx-hero{
    min-height:246px!important;
    border-radius:22px!important;
  }
  .hd-wx-hero-body{
    min-height:246px!important;
    padding:18px 15px 14px!important;
  }
  .hd-wx-place{
    top:14px!important;
    left:15px!important;
    right:15px!important;
  }
  .hd-wx-place strong{font-size:18px!important}
  .hd-wx-live-btn{
    min-width:68px!important;
    height:36px!important;
    border-radius:12px!important;
  }
  .hd-wx-temp{
    font-size:64px!important;
    letter-spacing:-4px!important;
  }
  .hd-wx-condition{font-size:18px!important}
  .hd-wx-hero-sub{
    gap:6px 10px!important;
    font-size:10px!important;
  }

  /* 2 x 2 : plus aucune carte coupée horizontalement. */
  .hd-wx-cards{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    margin-top:-18px!important;
    padding:0 6px!important;
    width:100%!important;
  }
  .hd-wx-card{
    width:auto!important;
    min-width:0!important;
    padding:9px 10px!important;
  }
  .hd-wx-card b{font-size:14px!important}
  .hd-wx-card small{font-size:8px!important}

  .hd-wx-op{
    grid-template-columns:36px minmax(0,1fr)!important;
    gap:9px!important;
    padding:11px!important;
  }
  .hd-wx-score{
    grid-column:2!important;
    font-size:12px!important;
    justify-self:start!important;
  }
  .hd-wx-op b{font-size:12px!important}
  .hd-wx-op small{font-size:9px!important;line-height:1.3!important}

  .hd-wx-switch{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    width:100%!important;
    position:sticky!important;
    top:calc(62px + env(safe-area-inset-top,0px))!important;
  }
  .hd-wx-switch button{
    min-width:0!important;
    width:auto!important;
    padding:0 4px!important;
    font-size:10px!important;
  }
  .hd-wx-section{
    width:100%!important;
    padding:11px!important;
    border-radius:16px!important;
  }
  .hd-wx-section-head{
    align-items:flex-start!important;
    flex-wrap:wrap!important;
    gap:4px 8px!important;
  }
  .hd-wx-section-head>div{min-width:0!important}
  .hd-wx-section-head b{
    display:block!important;
    font-size:13px!important;
    line-height:1.25!important;
  }
  .hd-wx-section-head small{
    width:100%!important;
    text-align:left!important;
    font-size:8px!important;
  }
  .hd-wx-hour{
    flex-basis:66px!important;
    min-height:100px!important;
  }
  .hd-wx-hour-readout{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .hd-wx-wind-values{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .hd-wx-wind-values>div{padding:7px 6px!important}
  .hd-wx-wind-values b{font-size:10px!important}
  .hd-wx-wind-grid{
    grid-template-columns:1fr!important;
    justify-items:center!important;
    gap:4px!important;
  }
  .hd-wx-rose{
    width:112px!important;
    height:112px!important;
  }
  .hd-wx-wind-chart{
    width:100%!important;
    min-width:0!important;
  }
  .hd-wx-wind-chart svg{height:112px!important}
  .hd-wx-legend{
    flex-wrap:wrap!important;
    justify-content:center!important;
  }

  /* Radar : la légende reste compacte et ne masque pas la carte. */
  .hd-wx-radar-legend{
    top:calc(70px + env(safe-area-inset-top,0px))!important;
    left:10px!important;
    right:10px!important;
    padding:7px 9px!important;
  }
  .hd-wx-radar-legend-head{
    font-size:7px!important;
  }
  .hd-wx-radar-explain{
    font-size:6.5px!important;
  }
  .hd-wx-radar-locate{
    top:calc(146px + env(safe-area-inset-top,0px))!important;
  }
  .hd-wx-live-bottom{
    left:10px!important;
    right:10px!important;
    bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;
    padding:9px!important;
  }
}


/* ==========================================================================
   HotelDelta V1.24 — Météo responsive stricte
   Objectif :
   - aucune coupure horizontale en portrait
   - aucune déformation des graphes / rose des vents
   - utilisation de toute la largeur disponible en paysage
   ========================================================================== */

#meteo-panel{
  width:100%!important;
  max-width:none!important;
  overflow-x:hidden!important;
}
#meteo-contenu{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  box-sizing:border-box!important;
  padding-left:max(10px,env(safe-area-inset-left,0px))!important;
  padding-right:max(10px,env(safe-area-inset-right,0px))!important;
}
#meteo-contenu-donnees,
.hd-wx-pro,
.hd-wx-pro>*,
.hd-wx-view,
.hd-wx-view>*,
.hd-wx-section,
.hd-wx-section>*{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.hd-wx-pro{
  width:100%!important;
  grid-template-columns:minmax(0,1fr)!important;
}
.hd-wx-pro>*{
  width:100%!important;
  grid-column:1/-1!important;
}
.hd-wx-view{
  width:100%!important;
  overflow:visible!important;
}
.hd-wx-section{
  width:100%!important;
  overflow:hidden!important;
}
.hd-wx-cards,
.hd-wx-op,
.hd-wx-switch,
.hd-wx-hour-readout,
.hd-wx-wind-values,
.hd-wx-wind-grid,
.hd-wx-sun{
  width:100%!important;
  min-width:0!important;
}
.hd-wx-card,
.hd-wx-op>div,
.hd-wx-hour-readout>div,
.hd-wx-wind-values>div,
.hd-wx-sun>div{
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
.hd-wx-wind-chart{
  min-width:0!important;
  width:100%!important;
  overflow:hidden!important;
}
.hd-wx-wind-chart svg{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  aspect-ratio:2.2 / 1!important;
}
.hd-wx-rose{
  flex:0 0 auto!important;
  aspect-ratio:1 / 1!important;
}

/* ---------- PORTRAIT ---------- */
@media (orientation:portrait){
  #meteo-contenu{
    padding-left:max(10px,env(safe-area-inset-left,0px))!important;
    padding-right:max(10px,env(safe-area-inset-right,0px))!important;
  }

  .hd-wx-pro{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:9px!important;
  }

  .hd-wx-hero{
    width:100%!important;
    min-height:224px!important;
    border-radius:20px!important;
  }
  .hd-wx-hero-body{
    min-height:224px!important;
    padding:16px 14px 13px!important;
  }
  .hd-wx-place{
    left:14px!important;
    right:14px!important;
    top:13px!important;
  }
  .hd-wx-temp{
    font-size:58px!important;
    line-height:.92!important;
  }
  .hd-wx-condition{
    font-size:17px!important;
  }
  .hd-wx-hero-sub{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,auto))!important;
    justify-content:start!important;
    gap:4px 10px!important;
    font-size:9px!important;
  }

  /* 4 indicateurs : toujours 2 x 2, jamais hors écran. */
  .hd-wx-cards{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
    padding:0 4px!important;
    margin-top:-15px!important;
  }
  .hd-wx-card{
    width:100%!important;
    padding:9px!important;
  }
  .hd-wx-card b{
    font-size:13px!important;
    white-space:normal!important;
  }
  .hd-wx-card small{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  .hd-wx-op{
    grid-template-columns:36px minmax(0,1fr) auto!important;
    gap:8px!important;
    padding:10px!important;
  }
  .hd-wx-score{
    grid-column:auto!important;
    justify-self:end!important;
    font-size:13px!important;
    white-space:nowrap!important;
  }

  /* Les 4 onglets doivent toujours être visibles. */
  .hd-wx-switch{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:3px!important;
    padding:3px!important;
    width:100%!important;
    overflow:hidden!important;
  }
  .hd-wx-switch button{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    padding:0 2px!important;
    font-size:9px!important;
    white-space:nowrap!important;
  }

  .hd-wx-section{
    padding:10px!important;
    border-radius:15px!important;
  }
  .hd-wx-section-head{
    width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:start!important;
    gap:4px 8px!important;
  }
  .hd-wx-section-head>div{
    min-width:0!important;
  }
  .hd-wx-section-head b{
    font-size:12px!important;
    line-height:1.22!important;
    overflow-wrap:anywhere!important;
  }
  .hd-wx-section-head small{
    width:auto!important;
    max-width:115px!important;
    text-align:right!important;
    line-height:1.25!important;
  }

  /* Frise : exactement 5 cartes visibles, puis scroll horizontal propre. */
  .hd-wx-hour-strip{
    display:grid!important;
    grid-auto-flow:column!important;
    grid-auto-columns:calc((100% - 24px) / 5)!important;
    gap:6px!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    padding:1px 0 7px!important;
  }
  .hd-wx-hour{
    width:100%!important;
    min-width:0!important;
    min-height:96px!important;
    padding:8px 3px!important;
  }
  .hd-wx-hour .ico{
    font-size:21px!important;
    margin:5px 0!important;
  }
  .hd-wx-hour b{
    font-size:16px!important;
  }
  .hd-wx-hour small{
    font-size:8px!important;
    white-space:nowrap!important;
  }

  /* Les 4 valeurs de l'heure restent toutes visibles en 2 x 2. */
  .hd-wx-hour-readout{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .hd-wx-hour-readout div{
    width:100%!important;
    padding:7px 8px!important;
  }

  /* Vent : les 3 variables restent dans le cadre. */
  .hd-wx-wind-values{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .hd-wx-wind-values>div{
    width:100%!important;
    padding:7px 6px!important;
  }
  .hd-wx-wind-values span{
    font-size:7px!important;
  }
  .hd-wx-wind-values b{
    font-size:9px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  /* Rose + graphe côte à côte sans écraser le graphe. */
  .hd-wx-wind-grid{
    display:grid!important;
    grid-template-columns:94px minmax(0,1fr)!important;
    align-items:center!important;
    gap:8px!important;
  }
  .hd-wx-rose{
    width:94px!important;
    height:94px!important;
    justify-self:center!important;
  }
  .hd-wx-arrow{
    width:38px!important;
    height:38px!important;
    left:28px!important;
    top:28px!important;
  }
  .hd-wx-arrow:before{
    left:15px!important;
    top:-14px!important;
    border-left-width:4px!important;
    border-right-width:4px!important;
    border-bottom-width:35px!important;
    transform-origin:50% 32px!important;
  }
  .hd-wx-arrow:after{
    left:14px!important;
    top:14px!important;
    width:9px!important;
    height:9px!important;
  }
  .hd-wx-wind-chart svg{
    aspect-ratio:2 / 1!important;
  }
  .hd-wx-legend{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:4px!important;
    width:100%!important;
    font-size:7px!important;
  }
  .hd-wx-legend span{
    min-width:0!important;
    white-space:normal!important;
  }
  .hd-wx-wind-note{
    font-size:7px!important;
    line-height:1.35!important;
  }

  /* Cycle solaire : lever + coucher ensemble, durée pleine largeur. */
  .hd-wx-sun{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .hd-wx-sun>div{
    width:100%!important;
    padding:9px!important;
  }
  .hd-wx-sun b{
    font-size:14px!important;
    white-space:nowrap!important;
  }
  .hd-wx-daylight{
    grid-column:1/-1!important;
  }
}

/* Très petits écrans : on réduit, on ne coupe jamais. */
@media (orientation:portrait) and (max-width:360px){
  .hd-wx-temp{font-size:52px!important}
  .hd-wx-place strong{font-size:16px!important}
  .hd-wx-live-btn{min-width:58px!important;height:34px!important;font-size:10px!important}
  .hd-wx-hero-sub{grid-template-columns:1fr!important;gap:2px!important}
  .hd-wx-hour-strip{grid-auto-columns:calc((100% - 18px) / 4)!important}
  .hd-wx-wind-grid{grid-template-columns:82px minmax(0,1fr)!important}
  .hd-wx-rose{width:82px!important;height:82px!important}
  .hd-wx-arrow{left:22px!important;top:22px!important}
  .hd-wx-wind-values{grid-template-columns:1fr 1fr!important}
  .hd-wx-wind-values>div:last-child{grid-column:1/-1!important}
}

/* ---------- PAYSAGE ---------- */
@media (orientation:landscape){
  /* Supprime l'ancien plafond de 1100 px : toute la largeur est utilisée. */
  #meteo-contenu{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding-left:max(14px,env(safe-area-inset-left,0px))!important;
    padding-right:max(14px,env(safe-area-inset-right,0px))!important;
  }

  .hd-wx-pro{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:none!important;
    gap:10px!important;
  }

  .hd-wx-hero,
  .hd-wx-cards,
  .hd-wx-op,
  .hd-wx-switch,
  .hd-wx-source,
  .hd-wx-view{
    grid-column:1/-1!important;
    width:100%!important;
    max-width:none!important;
  }

  .hd-wx-hero{
    min-height:215px!important;
  }
  .hd-wx-hero-body{
    min-height:215px!important;
  }
  .hd-wx-temp{
    font-size:60px!important;
  }

  .hd-wx-cards{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  /* Le contenu "Maintenant" occupe toute la largeur intelligemment :
     horaire pleine largeur, puis vent + solaire côte à côte. */
  .hd-wx-view[data-view-panel="now"]:not(.hidden){
    display:grid!important;
    grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr)!important;
    gap:10px!important;
    align-items:start!important;
  }
  .hd-wx-view[data-view-panel="now"]>.hd-wx-section:first-child{
    grid-column:1/-1!important;
  }
  .hd-wx-view[data-view-panel="now"]>.hd-wx-wind-section{
    grid-column:1!important;
  }
  .hd-wx-view[data-view-panel="now"]>.hd-wx-section:last-child{
    grid-column:2!important;
  }

  .hd-wx-hour-strip{
    width:100%!important;
  }
  .hd-wx-hour-readout{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }

  .hd-wx-wind-grid{
    grid-template-columns:120px minmax(0,1fr)!important;
  }
  .hd-wx-wind-chart svg{
    aspect-ratio:2.5 / 1!important;
  }

  .hd-wx-sun{
    grid-template-columns:1fr!important;
  }
  .hd-wx-daylight{
    grid-column:1!important;
  }

  .hd-wx-source{
    text-align:center!important;
    padding-bottom:8px!important;
  }
}

/* Paysage très bas : tout reste compact, mais jamais comprimé horizontalement. */
@media (orientation:landscape) and (max-height:520px){
  #meteo-panel>.panel-header.hd-meteo-header{
    min-height:48px!important;
    padding-top:max(4px,env(safe-area-inset-top,0px))!important;
    padding-bottom:4px!important;
  }
  .hd-wx-hero{min-height:190px!important}
  .hd-wx-hero-body{min-height:190px!important;padding-top:14px!important}
  .hd-wx-temp{font-size:52px!important}
  .hd-wx-condition{font-size:17px!important}
  .hd-wx-card{padding:8px!important}
  .hd-wx-op{padding:9px 12px!important}
  .hd-wx-switch button{min-height:34px!important}
  .hd-wx-section{padding:10px!important}
}


/* ==========================================================================
   HotelDelta V1.25 — Météo plein écran réel + synthèse opérationnelle
   ========================================================================== */

/* Neutralise définitivement tout ancien conteneur centré/max-width. */
#meteo-panel #meteo-contenu{
  position:relative!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  inline-size:100vw!important;
  width:100vw!important;
  max-width:100vw!important;
  min-width:100vw!important;
  margin:0!important;
  padding-left:max(5px,env(safe-area-inset-left,0px))!important;
  padding-right:max(5px,env(safe-area-inset-right,0px))!important;
  box-sizing:border-box!important;
}
#meteo-panel #meteo-contenu-donnees,
#meteo-panel .hd-wx-pro{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding-inline:0!important;
}
#meteo-panel .hd-wx-pro{
  gap:7px!important;
}
#meteo-panel .hd-wx-hero,
#meteo-panel .hd-wx-op,
#meteo-panel .hd-wx-operational,
#meteo-panel .hd-wx-switch,
#meteo-panel .hd-wx-view{
  margin-left:0!important;
  margin-right:0!important;
}

/* Nouvelle synthèse opérationnelle. */
.hd-wx-operational{
  width:100%;
  border:1px solid rgba(91,156,220,.18);
  background:linear-gradient(145deg,rgba(12,37,61,.96),rgba(7,25,43,.96));
  border-radius:18px;
  padding:11px;
  box-sizing:border-box;
}
.hd-wx-operational-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
}
.hd-wx-operational-head b{
  display:block;
  color:#f4f8ff;
  font-size:13px;
  line-height:1.2;
}
.hd-wx-operational-head small{
  color:#7e9abc;
  font-size:8px;
  white-space:nowrap;
}
.hd-wx-operational-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
}
.hd-wx-operational-grid article{
  min-width:0;
  border-radius:13px;
  padding:8px 9px;
  background:rgba(4,18,32,.66);
  border:1px solid rgba(255,255,255,.055);
}
.hd-wx-operational-grid span{
  display:block;
  color:#83a2c5;
  font-size:7px;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.hd-wx-operational-grid b{
  display:block;
  color:#f5f8ff;
  font-size:13px;
  margin-top:3px;
  white-space:nowrap;
}
.hd-wx-operational-grid small{
  display:block;
  color:#6f8baa;
  font-size:7px;
  margin-top:2px;
  line-height:1.2;
}
.hd-wx-operational-note{
  margin-top:7px;
  padding-top:7px;
  border-top:1px solid rgba(255,255,255,.055);
  color:#8298b4;
  font-size:7px;
  line-height:1.35;
}

/* La météo occupe visuellement presque tout le viewport. */
@media (orientation:portrait){
  #meteo-panel #meteo-contenu{
    padding-left:max(4px,env(safe-area-inset-left,0px))!important;
    padding-right:max(4px,env(safe-area-inset-right,0px))!important;
  }
  #meteo-panel .hd-wx-hero,
  #meteo-panel .hd-wx-section,
  #meteo-panel .hd-wx-operational,
  #meteo-panel .hd-wx-op,
  #meteo-panel .hd-wx-switch{
    border-radius:16px!important;
  }

  .hd-wx-operational-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .hd-wx-operational-grid article{
    padding:7px 8px!important;
  }
  .hd-wx-operational-grid b{
    font-size:12px!important;
  }

  /* Hero plus compact pour faire rentrer davantage d'information utile. */
  #meteo-panel .hd-wx-hero{
    min-height:208px!important;
  }
  #meteo-panel .hd-wx-hero-body{
    min-height:208px!important;
    padding:14px 12px 12px!important;
  }
  #meteo-panel .hd-wx-temp{
    font-size:54px!important;
  }
  #meteo-panel .hd-wx-cards{
    padding:0 2px!important;
    margin-top:-12px!important;
  }
}

/* Paysage : utilisation intégrale de la largeur et densité professionnelle. */
@media (orientation:landscape){
  #meteo-panel #meteo-contenu{
    padding-left:max(6px,env(safe-area-inset-left,0px))!important;
    padding-right:max(6px,env(safe-area-inset-right,0px))!important;
  }

  #meteo-panel .hd-wx-hero{
    min-height:176px!important;
    border-radius:18px!important;
  }
  #meteo-panel .hd-wx-hero-body{
    min-height:176px!important;
    padding:12px 16px 10px!important;
  }
  #meteo-panel .hd-wx-temp{
    font-size:48px!important;
  }
  #meteo-panel .hd-wx-cards{
    margin-top:-18px!important;
    padding:0 8px!important;
  }

  .hd-wx-operational{
    padding:9px 10px!important;
    border-radius:15px!important;
  }
  .hd-wx-operational-grid{
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .hd-wx-operational-grid article{
    padding:7px!important;
  }
  .hd-wx-operational-grid b{
    font-size:11px!important;
  }

  /* Maintenant : frise sur toute la largeur, puis vent + lumière 2 colonnes. */
  .hd-wx-view[data-view-panel="now"]:not(.hidden){
    display:grid!important;
    grid-template-columns:minmax(0,1.55fr) minmax(250px,.65fr)!important;
    gap:7px!important;
  }
  .hd-wx-view[data-view-panel="now"]>.hd-wx-section:first-child{
    grid-column:1/-1!important;
  }
  .hd-wx-view[data-view-panel="now"]>.hd-wx-wind-section{
    grid-column:1!important;
  }
  .hd-wx-view[data-view-panel="now"]>.hd-wx-section:last-child{
    grid-column:2!important;
  }
}

/* Très grands paysages : pas de trou central ou latéral. */
@media (orientation:landscape) and (min-width:1000px){
  #meteo-panel .hd-wx-pro,
  #meteo-panel .hd-wx-view,
  #meteo-panel .hd-wx-section{
    width:100%!important;
    max-width:none!important;
  }
}

/* Respect des ratios: aucun étirement des graphes ou rose des vents. */
#meteo-panel .hd-wx-rose{
  aspect-ratio:1/1!important;
}
#meteo-panel .hd-wx-wind-chart svg{
  width:100%!important;
  height:auto!important;
  aspect-ratio:2.25/1!important;
  preserve-aspect-ratio:xMidYMid meet;
}


/* ==========================================================================
   HotelDelta V1.26 — lisibilité valeurs + détail indicateur + retours sûrs
   ========================================================================== */

/* Valeurs principales plus lisibles sans modifier les proportions des cartes. */
#meteo-panel .hd-wx-card b{
  font-size:clamp(17px,3.7vw,24px)!important;
  line-height:1.05!important;
}
#meteo-panel .hd-wx-operational-grid b{
  font-size:clamp(16px,3.4vw,22px)!important;
  line-height:1.05!important;
}
#meteo-panel .hd-wx-hour-readout b{
  font-size:clamp(16px,3.3vw,21px)!important;
}
#meteo-panel .hd-wx-wind-values b{
  font-size:clamp(14px,3vw,19px)!important;
}
#meteo-panel .hd-wx-sun b{
  font-size:clamp(17px,3.5vw,22px)!important;
}
#meteo-panel .hd-wx-card small,
#meteo-panel .hd-wx-operational-grid small{
  line-height:1.25!important;
}

/* Carte indicateur : devient un vrai bouton, sans perdre le style. */
#meteo-panel .hd-wx-op{
  width:100%!important;
  text-align:left!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  color:inherit!important;
  cursor:pointer!important;
  position:relative!important;
  padding-right:46px!important;
}
#meteo-panel .hd-wx-op-chevron{
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:30px;
  line-height:1;
  color:#8fb7df;
}
#meteo-panel .hd-wx-op:active{
  transform:scale(.995);
}

/* Écran plein détail indicateur. */
.hd-wx-risk-detail{
  position:fixed;
  inset:0;
  z-index:12050;
  overflow-y:auto;
  overflow-x:hidden;
  background:#071423;
  color:#f5f9ff;
  -webkit-overflow-scrolling:touch;
  padding-bottom:calc(22px + env(safe-area-inset-bottom,0px));
  transition:opacity .18s ease;
}
.hd-wx-risk-detail.hidden{display:none!important}
.hd-wx-risk-detail.closing{
  opacity:0!important;
  pointer-events:auto!important;
}
.hd-wx-risk-detail-head{
  position:sticky;
  top:0;
  z-index:4;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:64px;
  padding:calc(8px + env(safe-area-inset-top,0px)) 12px 8px;
  background:linear-gradient(180deg,rgba(5,17,31,.98),rgba(5,17,31,.90));
  border-bottom:1px solid rgba(117,166,218,.12);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.hd-wx-risk-detail-head b{display:block;font-size:15px;letter-spacing:.3px}
.hd-wx-risk-detail-head small{display:block;color:#88a2c1;font-size:9px;margin-top:2px}
.hd-wx-risk-back{
  width:44px;
  height:44px;
  min-width:44px;
  border-radius:14px;
  border:1px solid rgba(100,167,235,.26);
  background:#17375c;
  color:#fff;
  font-size:31px;
  line-height:1;
}
.hd-wx-risk-detail-body{
  width:100%;
  padding:8px max(7px,env(safe-area-inset-right,0px)) 0 max(7px,env(safe-area-inset-left,0px));
  box-sizing:border-box;
  display:grid;
  gap:8px;
}
.hd-wx-risk-overview,
.hd-wx-risk-components,
.hd-wx-risk-evolution,
.hd-wx-risk-method{
  border:1px solid rgba(91,156,220,.16);
  background:linear-gradient(145deg,#0d2844,#081b2e);
  border-radius:18px;
  padding:12px;
}
.hd-wx-risk-overview{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:12px;
  align-items:center;
}
.hd-wx-risk-overview>div{
  min-width:112px;
}
.hd-wx-risk-overview span,
.hd-wx-risk-title span{
  display:block;
  color:#79a9d8;
  font-size:8px;
  font-weight:800;
  letter-spacing:1.3px;
}
.hd-wx-risk-overview b{
  display:block;
  font-size:32px;
  margin-top:3px;
}
.hd-wx-risk-overview small{
  color:#ffb54a;
  font-size:11px;
  font-weight:750;
}
.hd-wx-risk-overview p,
.hd-wx-risk-method p,
.hd-wx-risk-evolution p{
  margin:0;
  color:#9ab0c9;
  font-size:9px;
  line-height:1.45;
}
.hd-wx-risk-title{
  margin-bottom:9px;
}
.hd-wx-risk-title b{
  display:block;
  margin-top:3px;
  font-size:16px;
}
.hd-wx-risk-components{
  display:grid;
  gap:7px;
}
.hd-wx-risk-row{
  background:#071a2d;
  border:1px solid rgba(255,255,255,.055);
  border-radius:14px;
  padding:9px 10px;
}
.hd-wx-risk-row-top{
  display:flex;
  justify-content:space-between;
  align-items:start;
  gap:10px;
}
.hd-wx-risk-row-top>div:first-child{min-width:0}
.hd-wx-risk-row-top b{display:block;font-size:12px}
.hd-wx-risk-row-top small{
  display:block;
  color:#7992af;
  font-size:7px;
  margin-top:2px;
  line-height:1.25;
}
.hd-wx-risk-row-top>div:last-child{
  text-align:right;
  flex:0 0 auto;
}
.hd-wx-risk-row-top strong{
  display:block;
  font-size:14px;
}
.hd-wx-risk-row-top span{
  color:#7d98b7;
  font-size:7px;
}
.hd-wx-risk-bar{
  height:8px;
  margin-top:7px;
  border-radius:99px;
  overflow:hidden;
  background:#102943;
}
.hd-wx-risk-bar i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#39a8ff,#ffb03a,#ef5350);
}
.hd-wx-risk-contrib{
  margin-top:4px;
  color:#7892b0;
  font-size:7px;
}
.hd-wx-risk-chart{
  position:relative;
  height:150px;
  margin-top:3px;
  overflow:hidden;
  border-radius:14px;
  background:#06192a;
  border:1px solid rgba(255,255,255,.05);
}
.hd-wx-risk-chart svg{
  position:absolute;
  inset:8px 8px 24px;
  width:calc(100% - 16px);
  height:calc(100% - 32px);
}
.hd-wx-risk-chart path{
  fill:none;
  stroke:#50b5ff;
  stroke-width:3;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 5px rgba(67,174,255,.3));
}
.hd-wx-risk-zones{
  position:absolute;
  inset:8px 8px 24px;
  display:grid;
  grid-template-rows:35fr 30fr 35fr;
  opacity:.14;
}
.hd-wx-risk-zones i:nth-child(1){background:#e7534f}
.hd-wx-risk-zones i:nth-child(2){background:#ffae42}
.hd-wx-risk-zones i:nth-child(3){background:#4dbb75}
.hd-wx-risk-axis-labels{
  position:absolute;
  left:10px;
  right:10px;
  bottom:5px;
  height:14px;
}
.hd-wx-risk-axis-labels span{
  position:absolute;
  transform:translateX(-50%);
  color:#7893b0;
  font-size:7px;
}
.hd-wx-risk-scale{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5px;
  margin-top:6px;
  font-size:7px;
  color:#8ea6c1;
  text-align:center;
}
.hd-wx-risk-evolution p{margin-top:7px}
.hd-wx-risk-method b{font-size:13px}
.hd-wx-risk-method p{margin-top:6px}

/* LIVE : pendant le retour, l'overlay transparent reste au-dessus assez
   longtemps pour absorber le clic synthétique iOS et empêcher Accueil. */
.hd-wx-live.closing{
  opacity:0!important;
  pointer-events:auto!important;
  display:block!important;
}

@media (orientation:landscape){
  .hd-wx-risk-detail-body{
    grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr);
  }
  .hd-wx-risk-overview,
  .hd-wx-risk-method{grid-column:1}
  .hd-wx-risk-components{grid-column:2;grid-row:1 / span 2}
  .hd-wx-risk-evolution{grid-column:1}
}

@media (orientation:portrait){
  #meteo-panel .hd-wx-card b{
    font-size:20px!important;
  }
  #meteo-panel .hd-wx-operational-grid b{
    font-size:18px!important;
  }
  #meteo-panel .hd-wx-hour-readout b{
    font-size:18px!important;
  }
}


/* ==========================================================================
   HotelDelta V1.27 — Météo dynamique immersive et ergonomie consolidée
   ========================================================================== */

/* Le sélecteur Position / Destination est immédiatement sous le header et
   ne chevauche jamais le hero météo. */
#meteo-panel #meteo-onglets{
  position:sticky!important;
  top:calc(64px + env(safe-area-inset-top,0px))!important;
  z-index:96!important;
  margin:0 0 6px!important;
  transform:translateY(-2px)!important;
  border-radius:14px!important;
  box-shadow:0 10px 28px rgba(0,0,0,.26)!important;
}
#meteo-panel #meteo-onglets + #meteo-contenu-donnees{
  padding-top:0!important;
}
#meteo-panel .hd-wx-switch-three{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

/* Direction du vent : blanche comme les autres informations primaires. */
#meteo-panel .hd-wx-dir-head,
#meteo-panel .hd-wx-dir-head span,
#meteo-panel [data-read="dir-main"],
#meteo-panel [data-read="deg-main"]{
  color:#f5f9ff!important;
  opacity:1!important;
  font-weight:750!important;
}

/* Lecture 24h : 6 variables en grille dense et lisible. */
#meteo-panel .hd-wx-hour-readout{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
#meteo-panel .hd-wx-hour-readout>div{
  min-width:0!important;
}
@media (orientation:portrait){
  #meteo-panel .hd-wx-hour-readout{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* ---------- Ambiance météo quasi-3D ---------- */
#meteo-panel .hd-wx-hero{
  perspective:900px!important;
  transform-style:preserve-3d!important;
  background:#07182b!important;
}
#meteo-panel .hd-wx-atmosphere{
  position:absolute;
  inset:-8%;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  transform-style:preserve-3d;
}
#meteo-panel .hd-wx-celestial,
#meteo-panel .hd-wx-stars,
#meteo-panel .hd-wx-precip,
#meteo-panel .hd-wx-flash,
#meteo-panel .hd-wx-haze{
  position:absolute;
  inset:0;
  pointer-events:none;
}
#meteo-panel .hd-wx-celestial{
  z-index:1;
  transition:all .8s ease;
}
#meteo-panel .hd-wx-hero[data-scene="day"] .hd-wx-celestial{
  inset:auto 8% auto auto;
  top:8%;
  width:120px;
  height:120px;
  border-radius:50%;
  background:radial-gradient(circle at 38% 35%,#fffef0 0 8%,#ffe88c 18%,#ffbd45 42%,rgba(255,170,51,.2) 62%,transparent 73%);
  box-shadow:0 0 46px rgba(255,192,73,.65),0 0 120px rgba(255,157,49,.34);
  animation:hdWxSunFloat 9s ease-in-out infinite alternate;
}
#meteo-panel .hd-wx-hero[data-scene="night"] .hd-wx-celestial{
  inset:auto 9% auto auto;
  top:8%;
  width:94px;
  height:94px;
  border-radius:50%;
  background:
    radial-gradient(circle at 33% 30%,rgba(170,183,201,.55) 0 4%,transparent 5%),
    radial-gradient(circle at 66% 56%,rgba(133,148,169,.4) 0 6%,transparent 7%),
    radial-gradient(circle at 46% 70%,rgba(146,158,178,.34) 0 3%,transparent 4%),
    radial-gradient(circle at 42% 38%,#ffffff 0 8%,#eef1e8 48%,#bac4cf 72%,#8694a7 100%);
  box-shadow:0 0 34px rgba(210,226,255,.46),0 0 88px rgba(87,143,205,.23);
  animation:hdWxMoonFloat 10s ease-in-out infinite alternate;
}
#meteo-panel .hd-wx-stars{
  z-index:0;
  opacity:0;
  background-image:
    radial-gradient(circle,#fff 0 1px,transparent 1.6px),
    radial-gradient(circle,rgba(175,211,255,.9) 0 1px,transparent 1.5px),
    radial-gradient(circle,rgba(255,255,255,.65) 0 .8px,transparent 1.4px);
  background-size:83px 79px,127px 111px,57px 61px;
  background-position:5px 17px,41px 7px,13px 29px;
  animation:hdWxTwinkle 5.5s ease-in-out infinite alternate;
}
#meteo-panel .hd-wx-hero[data-scene="night"] .hd-wx-stars{opacity:.82}

#meteo-panel .hd-wx-clouds{
  position:absolute!important;
  inset:0!important;
  overflow:visible!important;
  opacity:0;
  z-index:2;
  filter:none!important;
}
#meteo-panel .hd-wx-clouds i{
  position:absolute!important;
  display:block!important;
  border-radius:999px!important;
  background:
    radial-gradient(circle at 28% 40%,rgba(255,255,255,.92) 0 24%,transparent 25%),
    radial-gradient(circle at 51% 27%,rgba(255,255,255,.88) 0 31%,transparent 32%),
    radial-gradient(circle at 74% 47%,rgba(238,247,255,.80) 0 27%,transparent 28%),
    linear-gradient(180deg,rgba(245,250,255,.80),rgba(114,141,169,.52))!important;
  box-shadow:inset 0 -18px 25px rgba(27,52,78,.22),0 16px 28px rgba(0,0,0,.18)!important;
}
#meteo-panel .hd-wx-clouds-back{
  transform:translateZ(-90px) scale(1.16);
  opacity:.42;
  filter:blur(5px)!important;
}
#meteo-panel .hd-wx-clouds-back i:nth-child(1){width:250px;height:88px;left:-12%;top:16%;animation:hdWxCloudBack 30s linear infinite}
#meteo-panel .hd-wx-clouds-back i:nth-child(2){width:300px;height:98px;left:54%;top:8%;animation:hdWxCloudBack 35s linear infinite reverse}
#meteo-panel .hd-wx-clouds-front{
  transform:translateZ(55px) scale(1.04);
  opacity:.72;
}
#meteo-panel .hd-wx-clouds-front i:nth-child(1){width:215px;height:78px;left:-8%;top:48%;animation:hdWxCloudFront 19s linear infinite}
#meteo-panel .hd-wx-clouds-front i:nth-child(2){width:255px;height:84px;left:38%;top:38%;animation:hdWxCloudFront 23s linear infinite reverse}
#meteo-panel .hd-wx-clouds-front i:nth-child(3){width:185px;height:70px;left:76%;top:58%;animation:hdWxCloudFront 17s linear infinite}

#meteo-panel .hd-wx-hero[data-weather="cloud"] .hd-wx-clouds-back,
#meteo-panel .hd-wx-hero[data-weather="cloud"] .hd-wx-clouds-front,
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-clouds-back,
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-clouds-front,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-clouds-back,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-clouds-front,
#meteo-panel .hd-wx-hero[data-weather="snow"] .hd-wx-clouds-back,
#meteo-panel .hd-wx-hero[data-weather="snow"] .hd-wx-clouds-front,
#meteo-panel .hd-wx-hero[data-weather="fog"] .hd-wx-clouds-back{
  opacity:1;
}
#meteo-panel .hd-wx-hero[data-weather="clear"] .hd-wx-clouds-back{opacity:.16}
#meteo-panel .hd-wx-hero[data-weather="clear"] .hd-wx-clouds-front{opacity:.08}

#meteo-panel .hd-wx-precip{
  z-index:5;
  opacity:0;
  transform:translateZ(90px);
}
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-precip,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-precip{
  opacity:.82;
  background-image:
    repeating-linear-gradient(105deg,transparent 0 18px,rgba(157,214,255,.76) 19px 21px,transparent 22px 34px),
    repeating-linear-gradient(105deg,transparent 0 33px,rgba(205,233,255,.46) 34px 35px,transparent 36px 54px);
  background-size:100% 58px,100% 83px;
  animation:hdWxRainFall .48s linear infinite;
  filter:drop-shadow(0 0 3px rgba(77,175,255,.28));
}
#meteo-panel .hd-wx-hero[data-weather="snow"] .hd-wx-precip{
  opacity:.9;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.95) 0 2px,transparent 2.8px),
    radial-gradient(circle,rgba(220,239,255,.85) 0 1.5px,transparent 2.4px),
    radial-gradient(circle,rgba(255,255,255,.75) 0 1px,transparent 2px);
  background-size:46px 46px,68px 68px,31px 31px;
  animation:hdWxSnowFall 5s linear infinite;
}
#meteo-panel .hd-wx-flash{
  z-index:6;
  opacity:0;
  background:radial-gradient(circle at 58% 18%,rgba(255,255,255,.98),rgba(183,216,255,.62) 9%,transparent 34%);
  mix-blend-mode:screen;
}
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-flash{
  animation:hdWxLightning 7.2s steps(1,end) infinite;
}
#meteo-panel .hd-wx-haze{
  z-index:4;
  opacity:0;
  background:
    linear-gradient(180deg,transparent,rgba(218,232,239,.25) 45%,rgba(195,216,227,.42)),
    repeating-linear-gradient(180deg,rgba(232,240,245,.10) 0 11px,transparent 12px 30px);
  filter:blur(9px);
  transform:scale(1.08);
}
#meteo-panel .hd-wx-hero[data-weather="fog"] .hd-wx-haze{
  opacity:.92;
  animation:hdWxFogDrift 9s ease-in-out infinite alternate;
}

#meteo-panel .hd-wx-hero[data-weather="rain"]{
  background:linear-gradient(180deg,#263c52,#183349 48%,#0b1e31)!important;
}
#meteo-panel .hd-wx-hero[data-weather="storm"]{
  background:linear-gradient(180deg,#141d2e,#1e2a3d 45%,#071321)!important;
}
#meteo-panel .hd-wx-hero[data-weather="cloud"]{
  background:linear-gradient(180deg,#34536d,#223d56 52%,#10253a)!important;
}
#meteo-panel .hd-wx-hero[data-weather="fog"]{
  background:linear-gradient(180deg,#516675,#425a68 48%,#263c4a)!important;
}
#meteo-panel .hd-wx-hero[data-weather="snow"]{
  background:linear-gradient(180deg,#5e7891,#718aa0 50%,#40566d)!important;
}
#meteo-panel .hd-wx-hero[data-weather="clear"][data-scene="day"]{
  background:linear-gradient(180deg,#2584d8 0%,#4aa9e8 52%,#93cce9 100%)!important;
}
#meteo-panel .hd-wx-hero[data-weather="clear"][data-scene="night"]{
  background:linear-gradient(180deg,#020c20 0%,#071d3a 55%,#0c2235 100%)!important;
}

@keyframes hdWxSunFloat{from{transform:translate3d(0,-2px,70px) scale(.98)}to{transform:translate3d(-10px,8px,90px) scale(1.05)}}
@keyframes hdWxMoonFloat{from{transform:translate3d(0,-2px,55px) scale(.98)}to{transform:translate3d(-8px,6px,75px) scale(1.04)}}
@keyframes hdWxTwinkle{from{filter:brightness(.75);transform:translate3d(0,0,-40px)}to{filter:brightness(1.3);transform:translate3d(-5px,3px,-40px)}}
@keyframes hdWxCloudBack{from{transform:translate3d(-34vw,0,-90px)}to{transform:translate3d(110vw,6px,-90px)}}
@keyframes hdWxCloudFront{from{transform:translate3d(-28vw,0,55px)}to{transform:translate3d(112vw,-4px,55px)}}
@keyframes hdWxRainFall{from{background-position:0 -80px,20px -120px}to{background-position:-36px 110px,-12px 166px}}
@keyframes hdWxSnowFall{from{background-position:0 -80px,20px -120px,10px -40px}to{background-position:55px 180px,-28px 220px,34px 150px}}
@keyframes hdWxLightning{0%,8%,10%,67%,69%,71%,100%{opacity:0}9%,68%{opacity:.95}70%{opacity:.5}}
@keyframes hdWxFogDrift{from{transform:translate3d(-3%,0,30px) scale(1.08)}to{transform:translate3d(4%,2%,30px) scale(1.12)}}

@media (prefers-reduced-motion:reduce){
  #meteo-panel .hd-wx-celestial,
  #meteo-panel .hd-wx-stars,
  #meteo-panel .hd-wx-clouds i,
  #meteo-panel .hd-wx-precip,
  #meteo-panel .hd-wx-flash,
  #meteo-panel .hd-wx-haze{
    animation:none!important;
  }
}


/* ==========================================================================
   HotelDelta V1.28 — météo immersive, sans chevauchement
   ========================================================================== */

/* Les anciens pseudo-effets V1.21 ne doivent plus recouvrir la nouvelle scène. */
#meteo-panel .hd-wx-hero::before{
  display:none!important;
}
#meteo-panel .hd-wx-hero::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  display:block!important;
  z-index:7!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,rgba(0,7,18,.02) 0%,rgba(0,8,19,.04) 44%,rgba(1,10,20,.52) 100%)!important;
}

/* Hero = scène, pas simple carte plate. */
#meteo-panel .hd-wx-hero{
  isolation:isolate!important;
  overflow:hidden!important;
  min-height:250px!important;
  background:#07182b!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.10),
    inset 0 -40px 70px rgba(0,0,0,.18),
    0 18px 52px rgba(0,0,0,.26)!important;
}
#meteo-panel .hd-wx-hero-body{
  z-index:12!important;
}
#meteo-panel .hd-wx-atmosphere{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  transform:translateZ(0)!important;
}
#meteo-panel .hd-wx-atmosphere>*{
  pointer-events:none!important;
}

/* Profondeur du ciel : déplacement lent et continu, visible même par temps clair. */
#meteo-panel .hd-wx-sky-depth{
  position:absolute;
  inset:-14%;
  z-index:0;
  background:
    radial-gradient(ellipse at 72% 18%,rgba(104,183,255,.24),transparent 36%),
    radial-gradient(ellipse at 18% 64%,rgba(54,111,173,.20),transparent 46%),
    linear-gradient(160deg,#07162b,#092844 56%,#123348);
  animation:hdWxSkyBreath 10s ease-in-out infinite alternate;
}
#meteo-panel .hd-wx-hero[data-scene="day"] .hd-wx-sky-depth{
  background:
    radial-gradient(ellipse at 72% 14%,rgba(255,241,190,.50),transparent 26%),
    radial-gradient(ellipse at 16% 68%,rgba(92,193,255,.34),transparent 44%),
    linear-gradient(165deg,#1476c6 0%,#49a8e7 48%,#a7d9ee 100%);
}
#meteo-panel .hd-wx-hero[data-scene="night"] .hd-wx-sky-depth{
  background:
    radial-gradient(ellipse at 76% 12%,rgba(105,151,209,.24),transparent 31%),
    radial-gradient(ellipse at 15% 70%,rgba(22,63,111,.38),transparent 46%),
    linear-gradient(160deg,#020817 0%,#06152e 50%,#0c2842 100%);
}

/* Étoiles : plusieurs couches, faible parallaxe. */
#meteo-panel .hd-wx-stars{
  position:absolute!important;
  inset:-10%!important;
  z-index:1!important;
  opacity:0!important;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.96) 0 1px,transparent 1.7px),
    radial-gradient(circle,rgba(177,214,255,.82) 0 1px,transparent 1.6px),
    radial-gradient(circle,rgba(255,255,255,.56) 0 .8px,transparent 1.4px)!important;
  background-size:71px 67px,113px 107px,43px 49px!important;
  background-position:9px 17px,27px 3px,5px 29px!important;
  animation:hdWxStarsDrift 16s linear infinite,hdWxTwinkle128 4.5s ease-in-out infinite alternate!important;
}
#meteo-panel .hd-wx-hero[data-scene="night"] .hd-wx-stars{opacity:.78!important}

/* Soleil / lune : disque texturé + halo volumétrique. */
#meteo-panel .hd-wx-celestial{
  position:absolute!important;
  z-index:3!important;
  border-radius:50%!important;
  transform-origin:center!important;
}
#meteo-panel .hd-wx-celestial i{
  position:absolute;
  inset:16%;
  border-radius:50%;
  box-shadow:inset -10px -12px 18px rgba(0,0,0,.16),inset 8px 6px 18px rgba(255,255,255,.18);
}
#meteo-panel .hd-wx-hero[data-scene="day"] .hd-wx-celestial{
  width:148px!important;height:148px!important;right:6%!important;top:5%!important;
  background:radial-gradient(circle,rgba(255,238,165,.65) 0 24%,rgba(255,189,65,.28) 43%,rgba(255,174,43,.08) 59%,transparent 72%)!important;
  filter:drop-shadow(0 0 28px rgba(255,194,78,.52))!important;
  animation:hdWxCelestialFloat 8s ease-in-out infinite alternate!important;
}
#meteo-panel .hd-wx-hero[data-scene="day"] .hd-wx-celestial i{
  background:radial-gradient(circle at 38% 34%,#fffdf1 0 13%,#ffea91 36%,#ffbd47 72%,#f39428 100%);
}
#meteo-panel .hd-wx-hero[data-scene="night"] .hd-wx-celestial{
  width:118px!important;height:118px!important;right:7%!important;top:7%!important;
  background:radial-gradient(circle,rgba(222,235,255,.44),rgba(104,151,209,.16) 45%,transparent 72%)!important;
  filter:drop-shadow(0 0 28px rgba(145,186,238,.36))!important;
  animation:hdWxCelestialFloat 10s ease-in-out infinite alternate!important;
}
#meteo-panel .hd-wx-hero[data-scene="night"] .hd-wx-celestial i{
  background:
    radial-gradient(circle at 32% 29%,rgba(137,151,171,.42) 0 5%,transparent 6%),
    radial-gradient(circle at 68% 57%,rgba(110,124,145,.34) 0 7%,transparent 8%),
    radial-gradient(circle at 46% 70%,rgba(126,139,159,.30) 0 4%,transparent 5%),
    radial-gradient(circle at 39% 37%,#fbfbf5 0 10%,#e8e9df 47%,#adb8c5 78%,#7b899a 100%);
}

/* Rayons et halo : donnent de la profondeur autour de l'astre. */
#meteo-panel .hd-wx-light-rays{
  position:absolute;
  inset:-30%;
  z-index:2;
  opacity:.22;
  background:conic-gradient(from 220deg at 76% 18%,transparent 0 6deg,rgba(190,221,255,.24) 8deg,transparent 15deg,transparent 34deg,rgba(255,235,171,.16) 38deg,transparent 47deg);
  filter:blur(8px);
  animation:hdWxRayRotate 28s linear infinite;
}
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-light-rays,
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-light-rays{opacity:.05}

/* Nuages volumétriques : 3 plans à vitesses différentes. */
#meteo-panel .hd-wx-clouds{
  position:absolute!important;
  inset:0!important;
  z-index:4!important;
  overflow:visible!important;
  opacity:0!important;
}
#meteo-panel .hd-wx-clouds i{
  position:absolute!important;
  display:block!important;
  border-radius:50%!important;
  background:
    radial-gradient(ellipse at 26% 53%,rgba(250,253,255,.92) 0 23%,transparent 24%),
    radial-gradient(ellipse at 46% 35%,rgba(248,252,255,.94) 0 29%,transparent 30%),
    radial-gradient(ellipse at 66% 51%,rgba(235,244,251,.88) 0 27%,transparent 28%),
    radial-gradient(ellipse at 53% 64%,rgba(204,221,234,.72) 0 39%,transparent 40%)!important;
  box-shadow:none!important;
  filter:drop-shadow(0 16px 20px rgba(0,0,0,.22))!important;
  will-change:transform!important;
}
#meteo-panel .hd-wx-clouds-far{filter:blur(8px)!important;z-index:2!important}
#meteo-panel .hd-wx-clouds-mid{filter:blur(3px)!important;z-index:4!important}
#meteo-panel .hd-wx-clouds-near{filter:blur(.6px)!important;z-index:6!important}

#meteo-panel .hd-wx-clouds-far i:nth-child(1){width:330px!important;height:135px!important;top:6%!important;left:-28%!important;animation:hdWxCloudFar calc(52s / var(--wx-wind-phase,1)) linear infinite!important}
#meteo-panel .hd-wx-clouds-far i:nth-child(2){width:400px!important;height:150px!important;top:28%!important;left:48%!important;animation:hdWxCloudFar calc(61s / var(--wx-wind-phase,1)) linear infinite reverse!important}
#meteo-panel .hd-wx-clouds-far i:nth-child(3){width:280px!important;height:120px!important;top:56%!important;left:18%!important;animation:hdWxCloudFar calc(57s / var(--wx-wind-phase,1)) linear infinite!important}
#meteo-panel .hd-wx-clouds-mid i:nth-child(1){width:270px!important;height:120px!important;top:22%!important;left:-22%!important;animation:hdWxCloudMid calc(34s / var(--wx-wind-phase,1)) linear infinite!important}
#meteo-panel .hd-wx-clouds-mid i:nth-child(2){width:310px!important;height:130px!important;top:44%!important;left:58%!important;animation:hdWxCloudMid calc(39s / var(--wx-wind-phase,1)) linear infinite reverse!important}
#meteo-panel .hd-wx-clouds-mid i:nth-child(3){width:235px!important;height:104px!important;top:68%!important;left:14%!important;animation:hdWxCloudMid calc(37s / var(--wx-wind-phase,1)) linear infinite!important}
#meteo-panel .hd-wx-clouds-near i:nth-child(1){width:230px!important;height:106px!important;top:48%!important;left:-25%!important;animation:hdWxCloudNear calc(25s / var(--wx-wind-phase,1)) linear infinite!important}
#meteo-panel .hd-wx-clouds-near i:nth-child(2){width:260px!important;height:112px!important;top:66%!important;left:70%!important;animation:hdWxCloudNear calc(29s / var(--wx-wind-phase,1)) linear infinite reverse!important}

/* Couverture nuageuse adaptée au type de temps. */
#meteo-panel .hd-wx-hero[data-weather="clear"] .hd-wx-clouds-far{opacity:.24!important}
#meteo-panel .hd-wx-hero[data-weather="clear"] .hd-wx-clouds-mid{opacity:.10!important}
#meteo-panel .hd-wx-hero[data-weather="clear"] .hd-wx-clouds-near{opacity:.05!important}
#meteo-panel .hd-wx-hero[data-weather="cloud"] .hd-wx-clouds-far{opacity:.78!important}
#meteo-panel .hd-wx-hero[data-weather="cloud"] .hd-wx-clouds-mid{opacity:.92!important}
#meteo-panel .hd-wx-hero[data-weather="cloud"] .hd-wx-clouds-near{opacity:.68!important}
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-clouds-far,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-clouds-far{opacity:.92!important}
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-clouds-mid,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-clouds-mid{opacity:1!important}
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-clouds-near,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-clouds-near{opacity:.90!important}
#meteo-panel .hd-wx-hero[data-weather="snow"] .hd-wx-clouds-far,
#meteo-panel .hd-wx-hero[data-weather="snow"] .hd-wx-clouds-mid{opacity:.82!important}

/* En pluie/orage, assombrir naturellement les nuages. */
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-clouds i,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-clouds i{
  background:
    radial-gradient(ellipse at 26% 53%,rgba(155,176,193,.88) 0 23%,transparent 24%),
    radial-gradient(ellipse at 46% 35%,rgba(137,160,181,.90) 0 29%,transparent 30%),
    radial-gradient(ellipse at 66% 51%,rgba(111,137,160,.86) 0 27%,transparent 28%),
    radial-gradient(ellipse at 53% 64%,rgba(71,96,120,.80) 0 39%,transparent 40%)!important;
}

/* Précipitations au premier plan. */
#meteo-panel .hd-wx-precip{
  position:absolute!important;
  inset:-20%!important;
  z-index:8!important;
  opacity:0!important;
}
#meteo-panel .hd-wx-hero[data-weather="rain"] .hd-wx-precip,
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-precip{
  opacity:.75!important;
  background-image:
    repeating-linear-gradient(108deg,transparent 0 19px,rgba(159,214,255,.72) 20px 21.5px,transparent 22px 35px),
    repeating-linear-gradient(108deg,transparent 0 37px,rgba(217,239,255,.38) 38px 39px,transparent 40px 58px)!important;
  background-size:100% 58px,100% 91px!important;
  animation:hdWxRain128 .46s linear infinite!important;
}
#meteo-panel .hd-wx-hero[data-weather="snow"] .hd-wx-precip{
  opacity:.90!important;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.96) 0 2px,transparent 2.6px),
    radial-gradient(circle,rgba(229,242,255,.84) 0 1.4px,transparent 2.2px),
    radial-gradient(circle,rgba(255,255,255,.70) 0 .9px,transparent 1.7px)!important;
  background-size:42px 42px,67px 67px,29px 29px!important;
  animation:hdWxSnow128 5.4s linear infinite!important;
}

/* Brouillard en nappes. */
#meteo-panel .hd-wx-haze{
  position:absolute!important;
  inset:-16%!important;
  z-index:9!important;
  opacity:0!important;
  background:
    repeating-linear-gradient(180deg,rgba(231,241,246,.20) 0 22px,rgba(214,231,240,.08) 23px 45px,transparent 46px 72px)!important;
  filter:blur(12px)!important;
}
#meteo-panel .hd-wx-hero[data-weather="fog"] .hd-wx-haze{
  opacity:.82!important;
  animation:hdWxFog128 8.5s ease-in-out infinite alternate!important;
}

/* Éclair bref mais réellement visible. */
#meteo-panel .hd-wx-flash{
  position:absolute!important;
  inset:0!important;
  z-index:10!important;
  opacity:0!important;
  background:
    linear-gradient(117deg,transparent 0 53%,rgba(255,255,255,.96) 53.5%,transparent 54.4%),
    radial-gradient(circle at 62% 18%,rgba(238,246,255,.92),rgba(137,185,255,.34) 16%,transparent 43%)!important;
  mix-blend-mode:screen!important;
}
#meteo-panel .hd-wx-hero[data-weather="storm"] .hd-wx-flash{
  animation:hdWxFlash128 6.8s steps(1,end) infinite!important;
}

/* Finition type verre / profondeur. */
#meteo-panel .hd-wx-vignette{
  position:absolute;
  inset:0;
  z-index:11;
  background:
    linear-gradient(90deg,rgba(0,8,20,.17),transparent 28%,transparent 72%,rgba(0,8,20,.12)),
    linear-gradient(180deg,transparent 52%,rgba(0,8,18,.26));
}

@keyframes hdWxSkyBreath{from{transform:scale(1.02) translate3d(-1%,0,0)}to{transform:scale(1.08) translate3d(1.5%,-1%,0)}}
@keyframes hdWxStarsDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-22px,11px,0)}}
@keyframes hdWxTwinkle128{from{filter:brightness(.75)}to{filter:brightness(1.35)}}
@keyframes hdWxCelestialFloat{from{transform:translate3d(0,-3px,0) scale(.98)}to{transform:translate3d(-9px,7px,0) scale(1.045)}}
@keyframes hdWxRayRotate{from{transform:rotate(0deg) scale(1.06)}to{transform:rotate(360deg) scale(1.06)}}
@keyframes hdWxCloudFar{from{transform:translate3d(-42vw,0,0) scale(.92)}to{transform:translate3d(125vw,4px,0) scale(1.04)}}
@keyframes hdWxCloudMid{from{transform:translate3d(-38vw,0,0) scale(.95)}to{transform:translate3d(122vw,-5px,0) scale(1.07)}}
@keyframes hdWxCloudNear{from{transform:translate3d(-34vw,0,0) scale(.98)}to{transform:translate3d(118vw,-7px,0) scale(1.10)}}
@keyframes hdWxRain128{from{background-position:0 -120px,18px -170px}to{background-position:-48px 160px,-20px 235px}}
@keyframes hdWxSnow128{from{background-position:0 -90px,20px -140px,8px -50px}to{background-position:54px 210px,-36px 260px,31px 175px}}
@keyframes hdWxFog128{from{transform:translate3d(-4%,0,0) scale(1.08)}to{transform:translate3d(5%,2%,0) scale(1.12)}}
@keyframes hdWxFlash128{0%,7%,9%,63%,65%,67%,100%{opacity:0}8%,64%{opacity:.92}66%{opacity:.42}}

/* --------------------------------------------------------------------------
   Alignement / tailles paysage : valeurs volontairement plus compactes.
   Portrait reste inchangé et lisible.
   -------------------------------------------------------------------------- */
@media (orientation:landscape){
  #meteo-panel #meteo-contenu{
    padding-left:max(8px,env(safe-area-inset-left,0px))!important;
    padding-right:max(8px,env(safe-area-inset-right,0px))!important;
  }
  #meteo-panel .hd-wx-pro{
    gap:6px!important;
  }
  #meteo-panel .hd-wx-hero{
    min-height:164px!important;
    border-radius:17px!important;
  }
  #meteo-panel .hd-wx-hero-body{
    min-height:164px!important;
    padding:11px 15px 10px!important;
  }
  #meteo-panel .hd-wx-temp{
    font-size:44px!important;
    letter-spacing:-3px!important;
  }
  #meteo-panel .hd-wx-condition{
    font-size:15px!important;
    margin-top:4px!important;
  }
  #meteo-panel .hd-wx-hero-sub{
    font-size:9px!important;
    gap:5px 10px!important;
    margin-top:5px!important;
  }
  #meteo-panel .hd-wx-place strong{font-size:16px!important}
  #meteo-panel .hd-wx-place small{font-size:8px!important}
  #meteo-panel .hd-wx-live-btn{
    min-width:62px!important;
    height:33px!important;
    font-size:10px!important;
  }

  #meteo-panel .hd-wx-cards{
    margin-top:-15px!important;
    padding:0 7px!important;
    gap:6px!important;
  }
  #meteo-panel .hd-wx-card{
    padding:7px 8px!important;
    min-height:58px!important;
  }
  #meteo-panel .hd-wx-card span{font-size:7px!important}
  #meteo-panel .hd-wx-card b{
    font-size:15px!important;
    line-height:1.05!important;
  }
  #meteo-panel .hd-wx-card small{
    font-size:7px!important;
    line-height:1.15!important;
  }

  #meteo-panel .hd-wx-op{
    min-height:58px!important;
    padding:8px 42px 8px 10px!important;
  }
  #meteo-panel .hd-wx-op-icon{
    width:38px!important;height:38px!important;font-size:20px!important;
  }
  #meteo-panel .hd-wx-op b{font-size:11px!important}
  #meteo-panel .hd-wx-op small{font-size:7px!important;line-height:1.2!important}
  #meteo-panel .hd-wx-score{font-size:16px!important}

  #meteo-panel .hd-wx-operational{
    padding:8px!important;
  }
  #meteo-panel .hd-wx-operational-head b{font-size:11px!important}
  #meteo-panel .hd-wx-operational-grid{
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    gap:4px!important;
  }
  #meteo-panel .hd-wx-operational-grid article{
    padding:6px!important;
    min-height:54px!important;
  }
  #meteo-panel .hd-wx-operational-grid span{font-size:6px!important}
  #meteo-panel .hd-wx-operational-grid b{
    font-size:13px!important;
    white-space:nowrap!important;
  }
  #meteo-panel .hd-wx-operational-grid small{
    font-size:6px!important;
    line-height:1.15!important;
  }

  #meteo-panel .hd-wx-switch{
    min-height:37px!important;
  }
  #meteo-panel .hd-wx-switch button{
    min-height:31px!important;
    font-size:9px!important;
  }

  #meteo-panel .hd-wx-section{
    padding:8px!important;
    border-radius:14px!important;
  }
  #meteo-panel .hd-wx-section-head b{font-size:11px!important}
  #meteo-panel .hd-wx-section-head small{font-size:7px!important}
  #meteo-panel .hd-wx-hour{
    min-height:88px!important;
    padding:6px 3px!important;
  }
  #meteo-panel .hd-wx-hour b{font-size:14px!important}
  #meteo-panel .hd-wx-hour small{font-size:7px!important}
  #meteo-panel .hd-wx-hour-readout b{
    font-size:13px!important;
  }
  #meteo-panel .hd-wx-wind-values b{
    font-size:13px!important;
  }
  #meteo-panel .hd-wx-sun b{
    font-size:14px!important;
  }

  /* grille stable : aucun chevauchement entre vent et cycle solaire */
  #meteo-panel .hd-wx-view[data-view-panel="hourly"]:not(.hidden){
    display:grid!important;
    grid-template-columns:minmax(0,1.52fr) minmax(260px,.62fr)!important;
    gap:6px!important;
    align-items:start!important;
  }
  #meteo-panel .hd-wx-view[data-view-panel="hourly"]>.hd-wx-section:first-child{
    grid-column:1/-1!important;
  }
  #meteo-panel .hd-wx-view[data-view-panel="hourly"]>.hd-wx-wind-section{
    grid-column:1!important;
    min-width:0!important;
  }
  #meteo-panel .hd-wx-view[data-view-panel="hourly"]>.hd-wx-section:last-child{
    grid-column:2!important;
    min-width:0!important;
  }
  #meteo-panel .hd-wx-wind-grid{
    grid-template-columns:105px minmax(0,1fr)!important;
    gap:7px!important;
  }
  #meteo-panel .hd-wx-rose{
    width:105px!important;height:105px!important;
  }

  /* le sélecteur position/destination reste sous le header, sans couvrir le hero */
  #meteo-panel #meteo-onglets{
    top:calc(48px + env(safe-area-inset-top,0px))!important;
    margin-bottom:5px!important;
    transform:none!important;
  }
}

/* Portrait : conserve les tailles validées, mais scène plus haute pour respirer. */
@media (orientation:portrait){
  #meteo-panel .hd-wx-hero{
    min-height:224px!important;
  }
  #meteo-panel .hd-wx-hero-body{
    min-height:224px!important;
  }
  #meteo-panel #meteo-onglets{
    top:calc(64px + env(safe-area-inset-top,0px))!important;
    margin-bottom:7px!important;
    transform:none!important;
  }
}

/* On respecte l'accessibilité mais on conserve un léger mouvement d'ambiance :
   pas de flash/pluie rapide lorsque Réduire les animations est activé. */
@media (prefers-reduced-motion:reduce){
  #meteo-panel .hd-wx-sky-depth{
    animation:hdWxSkyBreath 18s ease-in-out infinite alternate!important;
  }
  #meteo-panel .hd-wx-stars{
    animation:hdWxTwinkle128 8s ease-in-out infinite alternate!important;
  }
  #meteo-panel .hd-wx-celestial{
    animation:none!important;
  }
  #meteo-panel .hd-wx-clouds i{
    animation-duration:70s!important;
  }
  #meteo-panel .hd-wx-precip,
  #meteo-panel .hd-wx-flash,
  #meteo-panel .hd-wx-haze{
    animation:none!important;
  }
}


/* ==========================================================================
   HotelDelta V1.30 — marges hero/cartes + zones risque lisibles
   ========================================================================== */

/* 1) Plus aucun chevauchement entre la scène météo et les cartes Vent/Rafales.
   On supprime le recouvrement visuel hérité des versions précédentes. */
#meteo-panel .hd-wx-cards{
  margin-top:8px!important;
  padding-top:0!important;
}
#meteo-panel .hd-wx-hero{
  margin-bottom:0!important;
}
#meteo-panel .hd-wx-hero + .hd-wx-cards{
  position:relative!important;
  z-index:14!important;
}

/* Portrait : marge nette, homogène avec les autres espacements. */
@media (orientation:portrait){
  #meteo-panel .hd-wx-cards{
    margin-top:9px!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }
}

/* Paysage : compact mais sans chevauchement. */
@media (orientation:landscape){
  #meteo-panel .hd-wx-cards{
    margin-top:6px!important;
    padding-left:7px!important;
    padding-right:7px!important;
  }
}

/* 2) Évolution du risque : les 3 bandes sont maintenant explicitement
   colorées et lisibles au lieu de paraître grises/foncées. */
.hd-wx-risk-chart{
  background:#06192a!important;
}
.hd-wx-risk-zones{
  position:absolute!important;
  inset:8px 8px 24px!important;
  display:grid!important;
  grid-template-rows:35fr 30fr 35fr!important;
  opacity:1!important;
  overflow:hidden!important;
  border-radius:10px!important;
}
.hd-wx-risk-zones i{
  position:relative!important;
  display:block!important;
}
.hd-wx-risk-zones i:nth-child(1){
  background:linear-gradient(180deg,rgba(229,76,74,.28),rgba(229,76,74,.20))!important;
  border-bottom:1px solid rgba(229,76,74,.18)!important;
}
.hd-wx-risk-zones i:nth-child(2){
  background:linear-gradient(180deg,rgba(255,174,66,.24),rgba(255,174,66,.17))!important;
  border-bottom:1px solid rgba(255,174,66,.17)!important;
}
.hd-wx-risk-zones i:nth-child(3){
  background:linear-gradient(180deg,rgba(71,187,116,.22),rgba(71,187,116,.16))!important;
}

/* Ligne de courbe plus lumineuse et contrastée. */
.hd-wx-risk-chart path{
  stroke:#55baff!important;
  stroke-width:3.4!important;
  filter:
    drop-shadow(0 0 3px rgba(77,181,255,.55))
    drop-shadow(0 0 8px rgba(77,181,255,.20))!important;
}

/* Légende sous le graphique : couleurs cohérentes avec les zones. */
.hd-wx-risk-scale span{
  border-radius:999px!important;
  padding:4px 6px!important;
  font-weight:700!important;
}
.hd-wx-risk-scale span:nth-child(1){
  color:#78d59a!important;
  background:rgba(71,187,116,.10)!important;
}
.hd-wx-risk-scale span:nth-child(2){
  color:#ffc066!important;
  background:rgba(255,174,66,.10)!important;
}
.hd-wx-risk-scale span:nth-child(3){
  color:#ff827f!important;
  background:rgba(229,76,74,.10)!important;
}


/* ==========================================================================
   HotelDelta V1.31 — thème clair météo complet
   ========================================================================== */
html[data-theme="light"] #meteo-panel,
html[data-theme="light"] #meteo-contenu,
html[data-theme="light"] .hd-wx-pro{
  background:var(--hd-bg)!important;
  color:var(--hd-text)!important;
}
@media (prefers-color-scheme: light) and (min-width: 99999px){
  html[data-theme="auto"] #meteo-panel,
  html[data-theme="auto"] #meteo-contenu,
  html[data-theme="auto"] .hd-wx-pro{
    background:var(--hd-bg)!important;
    color:var(--hd-text)!important;
  }
}

/* Surfaces claires — le hero animé reste une scène météo colorée. */
html[data-theme="light"] #meteo-panel :is(
  .hd-wx-card,.hd-wx-op,.hd-wx-operational,.hd-wx-section,.hd-wx-day,
  .hd-wx-hour,.hd-wx-hour-readout>div,.hd-wx-wind-values>div,.hd-wx-sun,
  .hd-wx-risk-overview,.hd-wx-risk-components,.hd-wx-risk-row,
  .hd-wx-risk-evolution,.hd-wx-risk-method
){
  background:#fff!important;
  border-color:rgba(74,112,157,.20)!important;
  color:#17283e!important;
  box-shadow:0 8px 22px rgba(51,76,104,.08)!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-op{
  background:linear-gradient(135deg,#f8fbff,#edf6fd)!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-operational{
  background:linear-gradient(180deg,#fff,#f5f9fd)!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-section{
  background:#f8fbfe!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-operational-grid article{
  background:#fff!important;
  border-color:rgba(74,112,157,.14)!important;
  color:#17283e!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-switch{
  background:#e8f1f9!important;
  border-color:rgba(74,112,157,.18)!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-switch button{
  color:#60738a!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-switch button.active{
  color:#fff!important;
  background:#1b5f96!important;
  box-shadow:inset 0 0 0 1px rgba(62,155,224,.55)!important;
}

/* Textes secondaires */
html[data-theme="light"] #meteo-panel :is(
  .hd-wx-card span,.hd-wx-card small,.hd-wx-operational-grid span,
  .hd-wx-operational-grid small,.hd-wx-section-head small,.hd-wx-hour small,
  .hd-wx-day small,.hd-wx-wind-note,.hd-wx-source,.hd-wx-risk-row small,
  .hd-wx-risk-contrib,.hd-wx-risk-method p,.hd-wx-risk-axis-labels,
  .hd-wx-risk-scale
){
  color:#60738a!important;
}
html[data-theme="light"] #meteo-panel :is(
  .hd-wx-card b,.hd-wx-operational-grid b,.hd-wx-operational-head b,
  .hd-wx-section-head b,.hd-wx-hour b,.hd-wx-day b,.hd-wx-wind-values b,
  .hd-wx-sun b,.hd-wx-risk-row b,.hd-wx-risk-title,.hd-wx-risk-method b
){
  color:#17283e!important;
}

/* Vent / graphiques sur fond clair */
html[data-theme="light"] #meteo-panel .hd-wx-rose,
html[data-theme="light"] #meteo-panel .hd-wx-wind-chart{
  background:#f2f7fb!important;
  border-color:rgba(74,112,157,.17)!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-grid-line{
  stroke:rgba(60,91,126,.20)!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-chart-unit,
html[data-theme="light"] #meteo-panel .hd-wx-dir-head{
  color:#60738a!important;
}

/* Détail indicateur : en-tête et corps clairs, sans casser les couleurs de risque. */
html[data-theme="light"] .hd-wx-risk-detail{
  background:#eef4fa!important;
  color:#17283e!important;
}
html[data-theme="light"] .hd-wx-risk-detail-head{
  background:rgba(247,250,255,.97)!important;
  border-bottom:1px solid rgba(74,112,157,.16)!important;
  box-shadow:0 8px 20px rgba(51,76,104,.08)!important;
}
html[data-theme="light"] .hd-wx-risk-detail-head strong,
html[data-theme="light"] .hd-wx-risk-detail-head b{
  color:#17283e!important;
}
html[data-theme="light"] .hd-wx-risk-detail-head small{
  color:#60738a!important;
}
html[data-theme="light"] .hd-wx-risk-back{
  background:#e4eef8!important;
  color:#17314f!important;
  border-color:rgba(74,112,157,.20)!important;
}
html[data-theme="light"] .hd-wx-risk-chart{
  background:#f7fbfe!important;
  border-color:rgba(74,112,157,.17)!important;
}
/* Les trois zones restent volontairement colorées : vert / orange / rouge. */
html[data-theme="light"] .hd-wx-risk-zones i:nth-child(1){
  background:linear-gradient(180deg,rgba(229,76,74,.22),rgba(229,76,74,.14))!important;
}
html[data-theme="light"] .hd-wx-risk-zones i:nth-child(2){
  background:linear-gradient(180deg,rgba(255,174,66,.22),rgba(255,174,66,.14))!important;
}
html[data-theme="light"] .hd-wx-risk-zones i:nth-child(3){
  background:linear-gradient(180deg,rgba(71,187,116,.20),rgba(71,187,116,.12))!important;
}

/* Auto + système clair : mêmes règles sans dupliquer le moteur météo animé. */
@media (prefers-color-scheme: light) and (min-width: 99999px){
  html[data-theme="auto"] #meteo-panel :is(
    .hd-wx-card,.hd-wx-op,.hd-wx-operational,.hd-wx-section,.hd-wx-day,
    .hd-wx-hour,.hd-wx-hour-readout>div,.hd-wx-wind-values>div,.hd-wx-sun
  ){
    background:#fff!important;
    border-color:rgba(74,112,157,.20)!important;
    color:#17283e!important;
    box-shadow:0 8px 22px rgba(51,76,104,.08)!important;
  }
  html[data-theme="auto"] #meteo-panel .hd-wx-operational-grid article{
    background:#fff!important;color:#17283e!important;
  }
  html[data-theme="auto"] #meteo-panel .hd-wx-switch{
    background:#e8f1f9!important;
  }
  html[data-theme="auto"] #meteo-panel .hd-wx-switch button{color:#60738a!important}
  html[data-theme="auto"] #meteo-panel .hd-wx-switch button.active{
    color:#fff!important;background:#1b5f96!important;
  }
  html[data-theme="auto"] #meteo-panel :is(
    .hd-wx-card b,.hd-wx-operational-grid b,.hd-wx-operational-head b,
    .hd-wx-section-head b,.hd-wx-hour b,.hd-wx-day b,.hd-wx-wind-values b,.hd-wx-sun b
  ){color:#17283e!important}
  html[data-theme="auto"] #meteo-panel :is(
    .hd-wx-card span,.hd-wx-card small,.hd-wx-operational-grid span,
    .hd-wx-operational-grid small,.hd-wx-section-head small,.hd-wx-hour small,
    .hd-wx-day small,.hd-wx-wind-note,.hd-wx-source
  ){color:#60738a!important}
  html[data-theme="auto"] .hd-wx-risk-detail{
    background:#eef4fa!important;color:#17283e!important;
  }
  html[data-theme="auto"] .hd-wx-risk-detail-head{
    background:rgba(247,250,255,.97)!important;
    border-bottom-color:rgba(74,112,157,.16)!important;
  }
  html[data-theme="auto"] .hd-wx-risk-row,
  html[data-theme="auto"] .hd-wx-risk-evolution,
  html[data-theme="auto"] .hd-wx-risk-method{
    background:#fff!important;color:#17283e!important;
    border-color:rgba(74,112,157,.20)!important;
  }
  html[data-theme="auto"] .hd-wx-risk-chart{background:#f7fbfe!important}
}


/* ==========================================================================
   HotelDelta V1.32 — finition thème clair + météo immersive accueil
   ========================================================================== */

/* ---------- THÈME CLAIR : aucune carte météo résiduelle sombre ---------- */
html[data-theme="light"] .hd-wx-risk-detail :is(
  .hd-wx-risk-overview,
  .hd-wx-risk-components,
  .hd-wx-risk-row,
  .hd-wx-risk-evolution,
  .hd-wx-risk-method
){
  background:#ffffff!important;
  color:#17283e!important;
  border-color:rgba(74,112,157,.18)!important;
  box-shadow:0 7px 20px rgba(51,76,104,.07)!important;
}
html[data-theme="light"] .hd-wx-risk-detail :is(
  .hd-wx-risk-overview b,
  .hd-wx-risk-overview strong,
  .hd-wx-risk-title b,
  .hd-wx-risk-row-top b,
  .hd-wx-risk-row-top strong,
  .hd-wx-risk-method b,
  .hd-wx-risk-evolution b
){
  color:#17283e!important;
}
html[data-theme="light"] .hd-wx-risk-detail :is(
  .hd-wx-risk-overview p,
  .hd-wx-risk-row-top small,
  .hd-wx-risk-row-top span,
  .hd-wx-risk-contrib,
  .hd-wx-risk-method p,
  .hd-wx-risk-evolution p,
  .hd-wx-risk-axis-labels span
){
  color:#60738a!important;
}
html[data-theme="light"] .hd-wx-risk-detail .hd-wx-risk-bar{
  background:#dfeaf4!important;
}
html[data-theme="light"] .hd-wx-risk-detail .hd-wx-risk-chart{
  background:#f8fbfe!important;
  border-color:rgba(74,112,157,.16)!important;
}

/* Cycle solaire : ce sont les ENFANTS qui avaient encore le fond nuit. */
html[data-theme="light"] #meteo-panel .hd-wx-sun>div{
  background:#ffffff!important;
  border-color:rgba(74,112,157,.18)!important;
  color:#17283e!important;
  box-shadow:0 6px 16px rgba(51,76,104,.06)!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-sun>div span{
  color:#60738a!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-sun>div b{
  color:#17283e!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-daylight{
  background:linear-gradient(90deg,#fff4df,#edf7ff)!important;
}

/* Jours : détails déroulés eux aussi en clair. */
html[data-theme="light"] #meteo-panel .hd-wx-day :is(dt,small){
  color:#60738a!important;
}
html[data-theme="light"] #meteo-panel .hd-wx-day dd,
html[data-theme="light"] #meteo-panel .hd-wx-day strong{
  color:#17283e!important;
}

/* Direction en clair : plus de texte blanc/fantomatique sur fond blanc. */
html[data-theme="light"] #meteo-panel :is(
  .hd-wx-dir-head,
  .hd-wx-dir-head span,
  [data-read="dir-main"],
  [data-read="deg-main"]
){
  color:#17283e!important;
}

/* Même finition lorsque le thème est AUTO et que l'iPhone est en clair. */
@media (prefers-color-scheme: light) and (min-width: 99999px){
  html[data-theme="auto"] .hd-wx-risk-detail :is(
    .hd-wx-risk-overview,.hd-wx-risk-components,.hd-wx-risk-row,
    .hd-wx-risk-evolution,.hd-wx-risk-method
  ){
    background:#fff!important;color:#17283e!important;
    border-color:rgba(74,112,157,.18)!important;
  }
  html[data-theme="auto"] .hd-wx-risk-detail :is(
    .hd-wx-risk-overview b,.hd-wx-risk-overview strong,.hd-wx-risk-title b,
    .hd-wx-risk-row-top b,.hd-wx-risk-row-top strong,.hd-wx-risk-method b,
    .hd-wx-risk-evolution b
  ){color:#17283e!important}
  html[data-theme="auto"] .hd-wx-risk-detail :is(
    .hd-wx-risk-overview p,.hd-wx-risk-row-top small,.hd-wx-risk-row-top span,
    .hd-wx-risk-contrib,.hd-wx-risk-method p,.hd-wx-risk-evolution p,
    .hd-wx-risk-axis-labels span
  ){color:#60738a!important}
  html[data-theme="auto"] .hd-wx-risk-detail .hd-wx-risk-bar{background:#dfeaf4!important}
  html[data-theme="auto"] #meteo-panel .hd-wx-sun>div{
    background:#fff!important;border-color:rgba(74,112,157,.18)!important;color:#17283e!important;
  }
  html[data-theme="auto"] #meteo-panel .hd-wx-sun>div span{color:#60738a!important}
  html[data-theme="auto"] #meteo-panel .hd-wx-sun>div b{color:#17283e!important}
  html[data-theme="auto"] #meteo-panel .hd-wx-daylight{
    background:linear-gradient(90deg,#fff4df,#edf7ff)!important;
  }
  html[data-theme="auto"] #meteo-panel :is(
    .hd-wx-dir-head,.hd-wx-dir-head span,[data-read="dir-main"],[data-read="deg-main"]
  ){color:#17283e!important}
}

/* ---------- ACCUEIL : rappel de la scène météo immersive ---------- */
#ecran-accueil #accueil-statut{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
#ecran-accueil #accueil-statut .accueil-statut-corps{
  position:relative!important;
  z-index:3!important;
}
#ecran-accueil #accueil-statut .accueil-statut-texte{
  position:relative!important;
  z-index:4!important;
}
#ecran-accueil #accueil-statut .accueil-meteo-anim{
  position:relative!important;
  z-index:3!important;
  overflow:visible!important;
  height:72px!important;
  width:82px!important;
  min-width:82px!important;
  flex-basis:82px!important;
  align-self:center!important;
}
.home-wx-mini{
  position:absolute;
  inset:-5px -8px -5px -8px;
  overflow:hidden;
  border-radius:18px;
  pointer-events:none;
  background:linear-gradient(160deg,#0b2b49,#102944);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 8px 20px rgba(0,0,0,.16);
}
.home-wx-mini::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:8;
  background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 48%,rgba(3,14,27,.25));
}
.home-wx-mini .home-wx-sky,
.home-wx-mini .home-wx-stars,
.home-wx-mini .home-wx-celestial,
.home-wx-mini .home-wx-cloud,
.home-wx-mini .home-wx-rain,
.home-wx-mini .home-wx-flash,
.home-wx-mini .home-wx-fog{
  position:absolute;
  pointer-events:none;
}
.home-wx-mini .home-wx-sky{
  inset:-16%;
  z-index:0;
  background:radial-gradient(circle at 70% 18%,rgba(105,181,247,.35),transparent 32%),linear-gradient(165deg,#0c3557,#0c2038);
  animation:homeWxSky 8s ease-in-out infinite alternate;
}
.home-wx-mini[data-scene="day"] .home-wx-sky{
  background:radial-gradient(circle at 72% 15%,rgba(255,240,179,.48),transparent 28%),linear-gradient(165deg,#278fd8,#67bae9 62%,#b7dff0);
}
.home-wx-mini[data-scene="night"] .home-wx-sky{
  background:radial-gradient(circle at 75% 14%,rgba(104,150,207,.30),transparent 31%),linear-gradient(165deg,#020a1d,#09243e);
}
.home-wx-stars{
  inset:-8%;
  z-index:1;
  opacity:0;
  background-image:
    radial-gradient(circle,#fff 0 1px,transparent 1.5px),
    radial-gradient(circle,rgba(192,222,255,.8) 0 .8px,transparent 1.4px);
  background-size:31px 29px,47px 43px;
  animation:homeWxStars 7s linear infinite;
}
.home-wx-mini[data-scene="night"] .home-wx-stars{opacity:.70}
.home-wx-celestial{
  z-index:3;
  width:44px;height:44px;
  right:7px;top:6px;
  border-radius:50%;
  animation:homeWxFloat 5s ease-in-out infinite alternate;
}
.home-wx-mini[data-scene="day"] .home-wx-celestial{
  background:radial-gradient(circle at 35% 32%,#fffde7 0 12%,#ffe575 34%,#ffb638 69%,#ed8e1e 100%);
  box-shadow:0 0 14px rgba(255,204,80,.82),0 0 32px rgba(255,181,53,.38);
}
.home-wx-mini[data-scene="night"] .home-wx-celestial{
  background:
    radial-gradient(circle at 30% 35%,rgba(132,144,161,.45) 0 6%,transparent 7%),
    radial-gradient(circle at 42% 37%,#fff 0 14%,#e8e9df 58%,#9daab8 100%);
  box-shadow:0 0 18px rgba(190,216,248,.46);
}
.home-wx-cloud{
  z-index:5;
  width:78px;height:37px;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 25% 58%,rgba(255,255,255,.91) 0 25%,transparent 26%),
    radial-gradient(ellipse at 48% 39%,rgba(249,253,255,.94) 0 33%,transparent 34%),
    radial-gradient(ellipse at 70% 57%,rgba(221,235,246,.87) 0 29%,transparent 30%),
    radial-gradient(ellipse at 52% 68%,rgba(190,210,226,.70) 0 42%,transparent 43%);
  filter:drop-shadow(0 7px 8px rgba(0,0,0,.22));
  opacity:0;
}
.home-wx-cloud.one{left:-48px;top:29px;animation:homeWxCloud 13s linear infinite}
.home-wx-cloud.two{left:25px;top:43px;transform:scale(.78);animation:homeWxCloud2 17s linear infinite reverse}
.home-wx-mini[data-weather="clear"] .home-wx-cloud{opacity:.12}
.home-wx-mini[data-weather="cloud"] .home-wx-cloud,
.home-wx-mini[data-weather="rain"] .home-wx-cloud,
.home-wx-mini[data-weather="storm"] .home-wx-cloud,
.home-wx-mini[data-weather="snow"] .home-wx-cloud{opacity:.92}
.home-wx-mini[data-weather="rain"] .home-wx-cloud,
.home-wx-mini[data-weather="storm"] .home-wx-cloud{
  filter:brightness(.66) drop-shadow(0 7px 8px rgba(0,0,0,.25));
}
.home-wx-rain{
  inset:-20%;
  z-index:6;
  opacity:0;
  background:repeating-linear-gradient(108deg,transparent 0 10px,rgba(177,220,255,.78) 11px 12px,transparent 13px 20px);
  animation:homeWxRain .55s linear infinite;
}
.home-wx-mini[data-weather="rain"] .home-wx-rain,
.home-wx-mini[data-weather="storm"] .home-wx-rain{opacity:.82}
.home-wx-flash{
  inset:0;z-index:7;opacity:0;
  background:radial-gradient(circle at 60% 18%,rgba(255,255,255,.95),rgba(166,207,255,.36) 19%,transparent 44%);
}
.home-wx-mini[data-weather="storm"] .home-wx-flash{animation:homeWxFlash 6s steps(1,end) infinite}
.home-wx-fog{
  inset:-20%;
  z-index:6;
  opacity:0;
  background:repeating-linear-gradient(180deg,rgba(232,241,247,.24) 0 8px,transparent 9px 18px);
  filter:blur(5px);
  animation:homeWxFog 6s ease-in-out infinite alternate;
}
.home-wx-mini[data-weather="fog"] .home-wx-fog{opacity:.86}
.home-wx-mini[data-weather="snow"] .home-wx-rain{
  opacity:.90;
  background-image:
    radial-gradient(circle,#fff 0 1.5px,transparent 2.2px),
    radial-gradient(circle,rgba(220,240,255,.9) 0 1px,transparent 1.8px);
  background-size:18px 18px,27px 27px;
  animation:homeWxSnow 3.8s linear infinite;
}

/* La météo miniature ne masque jamais les informations DFCI existantes. */
#ecran-accueil #accueil-statut .accueil-statut-ligne1,
#ecran-accueil #accueil-statut .accueil-coords,
#ecran-accueil #accueil-statut .accueil-meteo{
  position:relative!important;
  z-index:5!important;
}
#ecran-accueil #accueil-statut .accueil-meteo{
  padding-right:2px!important;
}

/* Légère ambiance de fond dans le bandeau, mais données intactes. */
#ecran-accueil #accueil-statut[data-home-scene="day"]{
  background:linear-gradient(145deg,#1d5279,#1a3459)!important;
}
#ecran-accueil #accueil-statut[data-home-scene="night"]{
  background:linear-gradient(145deg,#10284b,#101d38)!important;
}

/* En mode clair : le bandeau garde une identité météo colorée,
   mais les textes DFCI restent fortement contrastés. */
html[data-theme="light"] #ecran-accueil #accueil-statut{color:#fff!important}
@media (prefers-color-scheme: light) and (min-width: 99999px){
  html[data-theme="auto"] #ecran-accueil #accueil-statut{color:#fff!important}
}

@keyframes homeWxSky{from{transform:scale(1.03) translateX(-1%)}to{transform:scale(1.10) translateX(2%)}}
@keyframes homeWxStars{from{transform:translate(0,0)}to{transform:translate(-12px,6px)}}
@keyframes homeWxFloat{from{transform:translateY(-2px) scale(.97)}to{transform:translate(-3px,3px) scale(1.04)}}
@keyframes homeWxCloud{from{transform:translateX(-18px) scale(.92)}to{transform:translateX(145px) scale(1.02)}}
@keyframes homeWxCloud2{from{transform:translateX(-25px) scale(.72)}to{transform:translateX(125px) scale(.84)}}
@keyframes homeWxRain{from{background-position:0 -40px}to{background-position:-18px 85px}}
@keyframes homeWxSnow{from{background-position:0 -30px,8px -45px}to{background-position:24px 90px,-17px 110px}}
@keyframes homeWxFlash{0%,9%,11%,68%,70%,100%{opacity:0}10%,69%{opacity:.95}}
@keyframes homeWxFog{from{transform:translateX(-5%)}to{transform:translateX(5%)}}

@media (orientation:portrait){
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    width:76px!important;min-width:76px!important;flex-basis:76px!important;height:68px!important;
  }
}
@media (orientation:landscape){
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    width:64px!important;min-width:64px!important;flex-basis:64px!important;height:56px!important;
  }
  .home-wx-mini{border-radius:14px}
  .home-wx-celestial{width:36px;height:36px;right:5px;top:4px}
  .home-wx-cloud{width:64px;height:31px}
}


/* ==========================================================================
   HotelDelta V1.33 — accueil météo paysage : aucune donnée coupée
   ========================================================================== */

/* En paysage, le bandeau météo doit rester suffisamment haut pour afficher
   code/commune/coordonnées + les 3 valeurs météo sur deux lignes. */
@media (orientation:landscape){
  #ecran-accueil #accueil-statut{
    min-height:112px!important;
    height:auto!important;
    padding:9px 12px!important;
    overflow:hidden!important;
  }
  #ecran-accueil #accueil-statut .accueil-statut-corps{
    min-height:92px!important;
    align-items:center!important;
    gap:10px!important;
  }
  #ecran-accueil #accueil-statut .accueil-statut-texte{
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    overflow:visible!important;
  }
  #ecran-accueil #accueil-statut .accueil-statut-ligne1{
    line-height:1.05!important;
    margin:0!important;
  }
  #ecran-accueil #accueil-statut .accueil-coords{
    line-height:1.15!important;
    margin-top:3px!important;
  }
  #ecran-accueil #accueil-statut .accueil-meteo{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px 10px!important;
    margin-top:7px!important;
    padding-top:7px!important;
    min-height:36px!important;
    overflow:visible!important;
  }
  #ecran-accueil #accueil-statut .accueil-meteo-item{
    min-width:0!important;
    overflow:visible!important;
  }
  #ecran-accueil #accueil-statut .accueil-meteo-item b{
    font-size:13px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  #ecran-accueil #accueil-statut .accueil-meteo-item span{
    font-size:7.5px!important;
    line-height:1.1!important;
    margin-top:2px!important;
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  /* Animation compacte à droite, elle ne vole jamais la hauteur du texte. */
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    width:58px!important;
    min-width:58px!important;
    flex-basis:58px!important;
    height:58px!important;
    align-self:center!important;
  }

  /* La colonne gauche de l'accueil doit accepter la nouvelle hauteur
     sans pousser/couper les tuiles suivantes. */
  #ecran-accueil .hd-home-v097{
    grid-template-rows:auto minmax(112px,auto) auto minmax(58px,1fr)!important;
  }
}

/* Paysage bas type iPhone : encore plus compact mais complet. */
@media (orientation:landscape) and (max-height:430px){
  #ecran-accueil #accueil-statut{
    min-height:104px!important;
    padding:7px 10px!important;
  }
  #ecran-accueil #accueil-statut .accueil-statut-corps{
    min-height:88px!important;
  }
  #ecran-accueil #accueil-statut .accueil-meteo-item b{font-size:12px!important}
  #ecran-accueil #accueil-statut .accueil-meteo-item span{font-size:7px!important}
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    width:52px!important;min-width:52px!important;flex-basis:52px!important;height:52px!important;
  }
}


/* ==========================================================================
   HotelDelta V1.34 — accueil météo clair + animation intégrée sans carré
   ========================================================================== */

/* 1) En thème clair, le bandeau météo d'accueil devient réellement clair. */
html[data-theme="light"] #ecran-accueil #accueil-statut{
  background:
    radial-gradient(circle at 78% 22%,rgba(79,168,235,.13),transparent 28%),
    linear-gradient(145deg,#ffffff,#eef6fc)!important;
  color:#17283e!important;
  border:1px solid rgba(74,112,157,.20)!important;
  box-shadow:0 8px 24px rgba(51,76,104,.10)!important;
}
html[data-theme="light"] #ecran-accueil #accueil-statut :is(
  #accueil-code,#accueil-commune,#accueil-coords,.accueil-meteo-item b
){
  color:#17283e!important;
}
html[data-theme="light"] #ecran-accueil #accueil-statut .accueil-meteo-item span{
  color:#60738a!important;
}
html[data-theme="light"] #ecran-accueil #accueil-statut .accueil-meteo{
  border-top-color:rgba(74,112,157,.18)!important;
}

@media (prefers-color-scheme: light) and (min-width: 99999px){
  html[data-theme="auto"] #ecran-accueil #accueil-statut{
    background:
      radial-gradient(circle at 78% 22%,rgba(79,168,235,.13),transparent 28%),
      linear-gradient(145deg,#ffffff,#eef6fc)!important;
    color:#17283e!important;
    border:1px solid rgba(74,112,157,.20)!important;
    box-shadow:0 8px 24px rgba(51,76,104,.10)!important;
  }
  html[data-theme="auto"] #ecran-accueil #accueil-statut :is(
    #accueil-code,#accueil-commune,#accueil-coords,.accueil-meteo-item b
  ){color:#17283e!important}
  html[data-theme="auto"] #ecran-accueil #accueil-statut .accueil-meteo-item span{
    color:#60738a!important;
  }
  html[data-theme="auto"] #ecran-accueil #accueil-statut .accueil-meteo{
    border-top-color:rgba(74,112,157,.18)!important;
  }
}

/* 2) L'animation ne doit plus apparaître dans un carré.
   Elle devient une ambiance flottante intégrée directement au bandeau. */
#ecran-accueil #accueil-statut .accueil-meteo-anim{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
#ecran-accueil #accueil-statut .home-wx-mini{
  inset:-18px -20px -18px -20px!important;
  border-radius:0!important;
  overflow:visible!important;
  background:transparent!important;
  box-shadow:none!important;
}
#ecran-accueil #accueil-statut .home-wx-mini::after{
  display:none!important;
}
#ecran-accueil #accueil-statut .home-wx-sky{
  display:none!important;
}

/* Soleil/lune plus organiques, sans disque-carte derrière. */
#ecran-accueil #accueil-statut .home-wx-celestial{
  width:52px!important;
  height:52px!important;
  right:10px!important;
  top:8px!important;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.10));
}
#ecran-accueil #accueil-statut .home-wx-mini[data-scene="day"] .home-wx-celestial{
  background:
    radial-gradient(circle at 34% 30%,#fffef2 0 10%,#ffe474 32%,#ffb83c 69%,#f49325 100%)!important;
  box-shadow:
    0 0 20px rgba(255,199,78,.55),
    0 0 42px rgba(255,181,63,.22)!important;
}
#ecran-accueil #accueil-statut .home-wx-mini[data-scene="night"] .home-wx-celestial{
  background:
    radial-gradient(circle at 32% 28%,rgba(144,157,174,.34) 0 5%,transparent 6%),
    radial-gradient(circle at 45% 42%,#fff 0 12%,#e8e9df 54%,#a7b3c0 100%)!important;
  box-shadow:0 0 24px rgba(188,215,247,.30)!important;
}

/* Nuages plus fins et étalés dans le bandeau au lieu d'un pictogramme carré. */
#ecran-accueil #accueil-statut .home-wx-cloud{
  width:92px!important;
  height:42px!important;
  filter:drop-shadow(0 7px 9px rgba(0,0,0,.10))!important;
}
#ecran-accueil #accueil-statut .home-wx-cloud.one{
  top:24px!important;
  left:-38px!important;
}
#ecran-accueil #accueil-statut .home-wx-cloud.two{
  top:42px!important;
  left:14px!important;
}

/* En clair : nuages plus lumineux, nuit : plus gris bleutés. */
html[data-theme="light"] #ecran-accueil #accueil-statut .home-wx-cloud{opacity:.82}
@media (prefers-color-scheme: light) and (min-width: 99999px){
  html[data-theme="auto"] #ecran-accueil #accueil-statut .home-wx-cloud{opacity:.82}
}

/* Masque les étoiles en thème clair de jour ; conserve la nuit. */
html[data-theme="light"] #ecran-accueil #accueil-statut .home-wx-mini[data-scene="day"] .home-wx-stars{
  display:none!important;
}
@media (prefers-color-scheme: light) and (min-width: 99999px){
  html[data-theme="auto"] #ecran-accueil #accueil-statut .home-wx-mini[data-scene="day"] .home-wx-stars{
    display:none!important;
  }
}

/* 3) Animation intégrée en arrière-plan léger du bandeau, sans recouvrir les textes. */
#ecran-accueil #accueil-statut .accueil-meteo-anim{
  position:absolute!important;
  right:8px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  z-index:2!important;
  pointer-events:none!important;
}
#ecran-accueil #accueil-statut .accueil-statut-corps{
  padding-right:78px!important;
}
#ecran-accueil #accueil-statut .accueil-statut-texte{
  z-index:4!important;
}

/* Portrait : animation plus diffuse, jamais collée dans un carré. */
@media (orientation:portrait){
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    right:10px!important;
    width:72px!important;
    min-width:72px!important;
    height:72px!important;
  }
  #ecran-accueil #accueil-statut .accueil-statut-corps{
    padding-right:80px!important;
  }
}

/* Paysage : animation légèrement plus petite, informations prioritaires. */
@media (orientation:landscape){
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    right:8px!important;
    width:58px!important;
    min-width:58px!important;
    height:58px!important;
  }
  #ecran-accueil #accueil-statut .accueil-statut-corps{
    padding-right:68px!important;
  }
  #ecran-accueil #accueil-statut .home-wx-celestial{
    width:44px!important;
    height:44px!important;
    right:6px!important;
    top:7px!important;
  }
  #ecran-accueil #accueil-statut .home-wx-cloud{
    width:76px!important;
    height:35px!important;
  }
}


/* ==========================================================================
   HotelDelta V1.35 — Ma position / Destination hors du hero météo
   ========================================================================== */

/* Le sélecteur n'est plus superposé à la scène météo.
   Il reste dans le flux normal, juste sous le header. */
#meteo-panel #meteo-onglets{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
  z-index:20!important;
  margin:0 0 10px 0!important;
  width:100%!important;
  box-sizing:border-box!important;
}

/* Le contenu météo commence APRÈS le sélecteur, jamais dessous. */
#meteo-panel #meteo-contenu{
  display:block!important;
}
#meteo-panel #meteo-contenu-donnees{
  position:relative!important;
  z-index:1!important;
  padding-top:0!important;
}
#meteo-panel #meteo-onglets + #meteo-contenu-donnees{
  margin-top:0!important;
  padding-top:0!important;
}
#meteo-panel .hd-wx-pro{
  margin-top:0!important;
}
#meteo-panel .hd-wx-hero{
  margin-top:0!important;
}

/* Portrait : respiration claire entre les onglets et le visuel. */
@media (orientation:portrait){
  #meteo-panel #meteo-onglets{
    margin-bottom:10px!important;
    min-height:48px!important;
  }
  #meteo-panel #meteo-onglets button{
    min-height:44px!important;
  }
}

/* Paysage : bandeau compact mais toujours distinct du hero. */
@media (orientation:landscape){
  #meteo-panel #meteo-onglets{
    margin-bottom:7px!important;
    min-height:38px!important;
  }
  #meteo-panel #meteo-onglets button{
    min-height:34px!important;
  }
}

/* Très petits écrans paysage : aucune translation ni chevauchement. */
@media (orientation:landscape) and (max-height:430px){
  #meteo-panel #meteo-onglets{
    margin-bottom:6px!important;
    min-height:36px!important;
  }
  #meteo-panel #meteo-onglets button{
    min-height:32px!important;
  }
}


/* HotelDelta V1.35.1 — suppression ciblée du bouton LIVE du hero météo.
   L'onglet Live de la navigation météo reste inchangé et accessible. */
.hd-wx-hero .hd-wx-live,
.hd-wx-hero [data-weather-live],
.hd-wx-hero .hd-wx-live-btn{
  display:none!important;
}


/* ==========================================================================
   HotelDelta V1.35.3 — accueil navigateur iPhone : aucune info météo coupée
   ========================================================================== */

/* Safari/Chrome disposent d'une hauteur utile plus faible que la PWA à cause
   des barres du navigateur. Dans ce mode uniquement, on refuse de compresser
   le bandeau météo jusqu'à masquer sa dernière ligne. */
html:not(.hd-standalone) #ecran-accueil{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-y:contain!important;
}

/* Le tableau de bord peut dépasser légèrement le viewport web :
   priorité à l'intégrité des informations plutôt qu'au rognage. */
html:not(.hd-standalone) #ecran-accueil .hd-home-v097{
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  align-content:start!important;
}

/* Neutralise les modes de compression automatiques qui réduisaient
   le bandeau à 76/82 px dans le navigateur. */
html:not(.hd-standalone) body.hd-home-fit-tight #accueil-statut,
html:not(.hd-standalone) body.hd-home-fit-ultra #accueil-statut,
html:not(.hd-standalone) #accueil-statut{
  height:auto!important;
  min-height:116px!important;
  max-height:none!important;
  overflow:hidden!important;
  padding-top:9px!important;
  padding-bottom:9px!important;
}

html:not(.hd-standalone) #accueil-statut .accueil-statut-corps{
  height:auto!important;
  min-height:96px!important;
  max-height:none!important;
  overflow:visible!important;
  align-items:center!important;
}

html:not(.hd-standalone) #accueil-statut .accueil-statut-texte,
html:not(.hd-standalone) #accueil-statut .accueil-meteo{
  overflow:visible!important;
  max-height:none!important;
}

html:not(.hd-standalone) #accueil-statut .accueil-meteo{
  min-height:38px!important;
  margin-top:7px!important;
  padding-top:7px!important;
}

/* Les deux lignes de chaque valeur doivent rester visibles. */
html:not(.hd-standalone) #accueil-statut .accueil-meteo-item{
  min-height:34px!important;
  overflow:visible!important;
}
html:not(.hd-standalone) #accueil-statut .accueil-meteo-item b,
html:not(.hd-standalone) #accueil-statut .accueil-meteo-item span{
  overflow:visible!important;
  text-overflow:clip!important;
}

/* Portrait navigateur : on récupère la hauteur nécessaire sur la carte
   plutôt que d'écraser le bandeau météo. */
@media (orientation:portrait){
  html:not(.hd-standalone) #ecran-accueil .hd-home-v097{
    grid-template-rows:auto auto minmax(138px,1fr) auto auto auto!important;
  }
  html:not(.hd-standalone) .hd-home-map-hero{
    min-height:138px!important;
  }
}

/* Paysage navigateur : même principe, avec bandeau météo intégral. */
@media (orientation:landscape){
  html:not(.hd-standalone) #ecran-accueil .hd-home-v097{
    grid-template-rows:auto minmax(112px,auto) auto minmax(54px,1fr)!important;
  }
  html:not(.hd-standalone) #accueil-statut{
    min-height:112px!important;
  }
  html:not(.hd-standalone) #accueil-statut .accueil-statut-corps{
    min-height:92px!important;
  }
}


/* ==========================================================================
   HotelDelta V1.35.5 — thème sombre unique + Accueil simplifié
   Modifications strictement ciblées : Paramètres / bandeau météo Accueil.
   ========================================================================== */

/* Paramètres : Référentiel intégré et titres d'entrées parfaitement centrés
   sans modifier la logique d'ouverture existante. */
#parametres-panel .hd-reference-settings-entry,
#parametres-panel .hd-about-entry{
  width:100%!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr) 44px!important;
  align-items:center!important;
  text-align:center!important;
}
#parametres-panel .hd-reference-settings-entry > span:nth-child(2),
#parametres-panel .hd-about-entry > span:nth-child(2){
  justify-self:center!important;
  text-align:center!important;
  min-width:0!important;
}
#parametres-panel .hd-reference-settings-entry .hd-about-entry-icon svg{
  width:22px!important;
  height:22px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

/* Accueil : les deux tuiles rapides ont été retirées du DOM. On conserve
   exactement les autres blocs et on redonne leur hauteur au bandeau météo. */
@media (orientation:portrait){
  #ecran-accueil .hd-home-v097{
    grid-template-areas:
      "top"
      "status"
      "map"
      "actions"
      "memo"!important;
    grid-template-rows:auto minmax(126px,auto) minmax(154px,1fr) auto auto!important;
  }
  #ecran-accueil #accueil-statut{
    min-height:126px!important;
    padding:11px 13px!important;
  }
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    width:78px!important;
    min-width:78px!important;
    flex-basis:78px!important;
  }
}

@media (orientation:landscape){
  #ecran-accueil .hd-home-v097{
    grid-template-areas:
      "top map"
      "status map"
      "actions actions"
      "memo memo"!important;
    grid-template-rows:auto minmax(108px,1fr) auto minmax(62px,auto)!important;
  }
  #ecran-accueil #accueil-statut{
    min-height:108px!important;
    padding:9px 11px!important;
  }
  #ecran-accueil #accueil-statut .accueil-meteo-anim{
    width:66px!important;
    min-width:66px!important;
    flex-basis:66px!important;
  }
}

/* Les classes de compression ne doivent plus écraser le bandeau météo alors
   que l'ancienne rangée de raccourcis a disparu. */
body.hd-home-fit-tight #ecran-accueil #accueil-statut,
body.hd-home-fit-ultra #ecran-accueil #accueil-statut{
  min-height:104px!important;
}
