:root{font-family:Arial,Helvetica,sans-serif;color:#21152d;background:#eee8f4}*{box-sizing:border-box}body{margin:0}.shell{width:min(100%,616px);min-height:100dvh;margin:auto;padding-bottom:104px;background:linear-gradient(180deg,#f9f7fc 0%,#eee5f5 54%,#f9f6fc 100%);box-shadow:0 0 35px #593f6624}button{font:inherit;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.34;cursor:not-allowed}button:focus-visible,input:focus-visible{outline:3px solid #a455e4;outline-offset:2px}.hero{position:relative;width:100%;aspect-ratio:616/144;overflow:hidden;background:white}.hero-art{display:block;width:100%;height:100%;object-fit:cover}.settings-overlay{position:absolute;top:6%;right:2%;height:38%;width:11%;border:0;background:transparent;border-radius:50%}.modules{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:0 15px 14px;margin-top:0}.modules button{border:1px solid #fff;border-radius:19px;min-width:0;height:89px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:4px 1px;background:linear-gradient(155deg,#fff,#f2eef6);color:#211a29;font-size:clamp(10px,2.1vw,14px);font-weight:750;box-shadow:0 4px 1px #b8a6c58a,0 9px 15px #4e2d6536,inset 0 2px 3px #fff}.modules span{font-size:34px;line-height:1;color:#7b36a9;text-shadow:0 2px 2px #b997d6}.modules button.selected{color:white;background:linear-gradient(150deg,#c76af0 0%,#9a3dca 45%,#6420a0 100%);box-shadow:0 5px 1px #5e298d,0 8px 16px #8030ad69,inset 0 2px 4px #e5a9ff}.modules button.selected span{color:white}.toast{color:#6c3d89;font-size:11px;text-align:center;padding:0 16px;min-height:0}.toast:not(:empty){padding:4px 16px 9px}.all-controls{margin:0 10px 18px;padding:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border-radius:29px;background:linear-gradient(165deg,#fff,#f1eaf8);box-shadow:0 7px 17px #79579c35,inset 0 2px 3px #fff}.all-controls button{min-height:78px;border-radius:19px;border:2px solid #fff;background:linear-gradient(160deg,#fafbff,#e6e0f0);box-shadow:0 4px 1px #a5a0b7,0 7px 10px #6b507b42,inset 0 2px 5px #fff;font-weight:800;font-size:clamp(11px,2.5vw,17px);color:#1f172b}.all-controls button:first-child,.all-controls button:last-child{color:#fff;background:linear-gradient(155deg,#c36ce6 0%,#9943c8 52%,#67229e 100%);box-shadow:0 4px 1px #60298d,0 7px 12px #7d4a9b68,inset 0 3px 5px #f0b5ff}.all-controls span{display:block;font-size:34px;line-height:1.05;margin-bottom:5px;text-shadow:0 2px 2px #4320524f}.section-title{display:flex;align-items:center;justify-content:space-between;margin:0 18px 12px}.section-title h2{font-size:20px;margin:0}.section-title p{font-size:11px;color:#8a6b9c;margin:3px 0 0}.add,.primary{border:0;border-radius:13px;background:linear-gradient(155deg,#bb6ae2,#7025a8);color:#fff;font-weight:750;padding:10px 14px;box-shadow:0 5px 8px #7b4a9957}#rooms{padding:0 11px}.room-group{border:2px solid #fff;border-radius:21px;background:linear-gradient(160deg,#fff,#f5f2f9);box-shadow:0 4px 1px #c5b6d0,0 8px 13px #6d527e40,inset 0 1px 3px #fff;margin:0 0 12px;overflow:hidden}.room-main{display:flex;align-items:center;gap:9px;min-height:85px;padding:7px 8px}.room-shutter{width:clamp(85px,22%,122px);height:71px;object-fit:cover;border-radius:7px;border:1px solid #c7c2cd;box-shadow:0 2px 4px #55466438}.room-info{min-width:0;flex:1}.room-info strong{display:block;font-size:clamp(12px,3.1vw,19px);line-height:1.12;letter-spacing:-.4px}.room-info small{display:block;font-size:clamp(11px,2.5vw,15px);font-weight:700;color:#7e2bb0;margin-top:4px}.controls{display:flex;gap:6px;border-left:1px solid #b9a9c5;padding-left:8px}.controls button{width:clamp(29px,7.6vw,47px);height:clamp(35px,8.6vw,48px);border:2px solid #a34bd4;border-radius:14px;background:linear-gradient(150deg,#fff,#f3e8fd);box-shadow:0 3px 1px #8e6aab,0 5px 6px #5c397842,inset 0 2px 4px #fff;color:#7520a6;font-size:clamp(23px,5.4vw,35px);line-height:1;font-weight:800}.controls button:nth-child(2){border-color:#a6a0b3;background:linear-gradient(#fff,#e8e5ed);color:#24202c;font-size:20px}.expand{background:transparent;border:0;color:#25192e;font-size:32px;padding:0 2px}.room-details{background:#f5edf9;border-top:1px solid #ddcce8}.device-row{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid #e1d2eb}.device-name{flex:1;min-width:0}.device-name strong{font-size:13px;display:block}.device-name small{display:block;font-size:10px;color:#846595;margin-top:4px}.mini-controls{display:flex;gap:4px}.mini-controls button{width:30px;height:32px;border:1px solid #a74cd0;border-radius:9px;background:white;color:#742aa4;font-size:21px}.edit{border:0;background:transparent;color:#6e2d98;font-size:19px}.hint{font-size:11px;color:#7c6688;text-align:center;line-height:1.5;margin:18px}.panel{background:#fff;margin:15px;padding:22px;border-radius:22px;box-shadow:0 6px 20px #7d61912b}.panel h2{margin-top:0}.panel label,dialog label{display:block;font-size:13px;font-weight:700;margin:13px 0}.panel input,dialog input{display:block;width:100%;padding:13px;border:1px solid #d8c5e2;border-radius:12px;margin-top:7px;font:inherit}.panel p{font-size:12px;color:#7e6889;line-height:1.6}.setting-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.setting-actions button,.import{background:#f3e8fa;border:1px solid #cdb2dd;border-radius:11px;padding:10px;color:#6e2899;font-size:12px;font-weight:700}.import input{display:none}footer{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(616px,100%);display:grid;grid-template-columns:repeat(5,1fr);gap:3px;padding:9px 7px max(10px,env(safe-area-inset-bottom));background:linear-gradient(#fff,#f3eff9);border:2px solid white;border-radius:29px 29px 0 0;box-shadow:0 -3px 16px #745a8e3d;z-index:5}footer button{border:0;background:transparent;border-radius:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px 1px;color:#292131;font-size:clamp(9px,2vw,12px)}footer button span{font-size:29px}footer button.active{background:linear-gradient(155deg,#bc6be3,#7021aa);color:white;box-shadow:0 4px 8px #7c35a6a1}dialog{border:0;border-radius:22px;padding:24px;width:min(94vw,430px);box-shadow:0 15px 65px #2a163e66}dialog::backdrop{background:#20102d99}dialog h2{margin-top:0}.dialog-actions{display:flex;justify-content:space-between;gap:7px;margin-top:18px}.dialog-actions button{border:1px solid #d7c4e3;border-radius:10px;padding:9px;background:#f6effa}.dialog-actions .primary{background:linear-gradient(145deg,#b668d7,#7023a6)}[hidden]{display:none!important}@media(max-width:410px){.modules{gap:4px;padding:0 7px 10px}.modules button{height:72px;border-radius:13px}.modules span{font-size:26px}.room-main{gap:5px;padding:6px}.room-shutter{width:76px;height:60px}.controls{gap:3px;padding-left:5px}.controls button{width:28px;height:34px;border-radius:9px}.room-info strong{font-size:12px}.room-info small{font-size:11px}}



/* Barre de modules et navigation : éléments HTML réels, aucun collage de captures. */
.hero{aspect-ratio:612/157;background:#fff}.hero-art{object-fit:cover}.settings-overlay{right:1.5%;top:17%;height:48%;width:12%}
.modules{margin-top:0;padding:5px 14px 14px;gap:6px}
.modules button{height:88px;position:relative;border:2px solid white;border-radius:19px;background:linear-gradient(150deg,#fff 5%,#f5f1fa 62%,#e5deed);box-shadow:0 4px 1px #b4a5c0,0 9px 13px #64497930,inset 0 3px 5px white;color:#21192b;font-size:clamp(10px,2.2vw,14px);transition:background .16s,color .16s}
.modules button span{color:#6a2995;font-size:35px;text-shadow:0 1px 2px #9c6bad44}
.modules button.selected{color:white;background:linear-gradient(155deg,#b961d9 0%,#8c39be 52%,#67229d 100%);box-shadow:0 4px 1px #5b267d,0 8px 14px #60357860,inset 0 2px 6px #e9adff}
.modules button.selected span{color:white}
.all-controls{margin:0 10px 19px;padding:11px;gap:8px}
.all-controls button{min-height:80px;font-size:clamp(12px,2.4vw,17px)}
.all-controls span{font-size:32px}
footer{height:89px;gap:1px;border-radius:30px 30px 0 0;background:linear-gradient(160deg,#fff,#f5f1fa)}
footer button{font-size:clamp(9px,2.1vw,12px);border-radius:17px;transition:background .16s,color .16s}
footer button span{font-size:29px}
footer button.active{color:#fff;background:linear-gradient(150deg,#b964e0,#7023a5);box-shadow:0 4px 1px #652c8e,0 7px 12px #71418e55}
footer button:not(.active){color:#251b2c;background:transparent;box-shadow:none}
.settings-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.close-settings{width:46px;height:46px;border:2px solid white;border-radius:50%;background:linear-gradient(155deg,#ff777f,#c91d42);color:white;font-size:30px;box-shadow:0 4px 8px #ac224366}
@media(max-width:410px){.modules{gap:4px;padding:4px 7px 10px}.modules button{height:75px}.modules button span{font-size:28px}}

/* Fidélité de la maquette : icônes détaillées séparées, vrais boutons interactifs */
.modules{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;padding:0 14px 13px;margin-top:0}
.modules button,.modules button.selected{height:auto;aspect-ratio:1.23;border:0;border-radius:0;background-color:transparent;background-repeat:no-repeat;background-position:center;background-size:100% 100%;box-shadow:none;color:transparent;font-size:0;padding:0;min-width:0;transition:transform .1s ease}
.modules button:active,footer button:active,.all-controls button:active{transform:scale(.96)}
.modules button[data-module="Volets"]{background-image:url('assets/module-0-white.png')}
.modules button[data-module="Volets"].selected{background-image:url('assets/module-0-active.png')}
.modules button[data-module="Éclairages"]{background-image:url('assets/module-1-white.png')}
.modules button[data-module="Éclairages"].selected{background-image:url('assets/module-1-active.png')}
.modules button[data-module="Chauffage"]{background-image:url('assets/module-2-white.png')}
.modules button[data-module="Chauffage"].selected{background-image:url('assets/module-2-active.png')}
.modules button[data-module="Énergie"]{background-image:url('assets/module-3-white.png')}
.modules button[data-module="Énergie"].selected{background-image:url('assets/module-3-active.png')}
.modules button[data-module="Équipements"]{background-image:url('assets/module-4-white.png')}
.modules button[data-module="Équipements"].selected{background-image:url('assets/module-4-active.png')}
.all-controls{margin:0 12px 20px;padding:4px 7px;gap:2px;align-items:center;border:1px solid #fff;box-shadow:0 7px 18px #76529a38;background:linear-gradient(145deg,#fff,#ebe6f4)}
.all-controls button,.all-controls button:first-child,.all-controls button:last-child{width:100%;min-height:0;aspect-ratio:2.25;border:0;border-radius:0;background-color:transparent;background-size:100% 100%;background-position:center;background-repeat:no-repeat;box-shadow:none;font-size:0;padding:0;color:transparent}
.all-controls button[data-all="up"]{background-image:url('assets/global-0.png')}
.all-controls button[data-all="stop"]{background-image:url('assets/global-1.png')}
.all-controls button[data-all="down"]{background-image:url('assets/global-2.png')}
footer{height:auto;min-height:84px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;padding:7px 7px max(9px,env(safe-area-inset-bottom));background:linear-gradient(165deg,#fff,#eae6f5);border:2px solid white;border-radius:30px 30px 0 0}
footer button,footer button:not(.active){padding:7px 1px;border-radius:18px;background:transparent;color:#282131;box-shadow:none;font-size:clamp(9px,1.95vw,12px);gap:2px;min-width:0}
footer button.active{background:linear-gradient(155deg,#c579e8 0%,#9740c6 46%,#6824a3 100%);color:white;box-shadow:0 4px 1px #5b2788,0 6px 11px #5e34915b,inset 0 2px 5px #e9b9ff}
footer button span{width:37px;height:37px;display:block;font-size:0;flex:0 0 auto;background-repeat:no-repeat;background-size:contain;background-position:center;filter:none}
footer button[data-tab="home"] span{background-image:url('assets/nav-icon-0.png')}
footer button[data-tab="shutters"] span{background-image:url('assets/nav-icon-1.png')}
footer button[data-tab="automations"] span{background-image:url('assets/nav-icon-2.png')}
footer button[data-tab="scenes"] span{background-image:url('assets/nav-icon-3.png')}
footer button[data-tab="settings"] span{background-image:url('assets/nav-icon-4.png')}
footer button.active span{filter:brightness(0) invert(1)}
@media(max-width:410px){.modules{gap:1px;padding:0 7px 11px}.modules button,.modules button.selected{height:auto;aspect-ratio:1.23}.all-controls{padding:4px}.all-controls button{aspect-ratio:2.25}footer button span{height:30px;width:32px}}

/* Correctif haut : recadrage de la bande noire et sélection exclusivement dynamique */
.hero{aspect-ratio:612/157;overflow:hidden;background:#f6f0fa}
.hero-art{display:block;width:100%;height:100%;object-fit:cover}
.modules button,.modules button.selected{background-size:100% 100%;background-position:center;background-repeat:no-repeat}


/* Module tiles: fixed exact glyph positions in selected + unselected states.
   No screenshot fragments, no inherited backgrounds, no motion. */
.modules{
 display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
 gap:7px; padding:6px 15px 16px; margin:0;
 background:linear-gradient(180deg,#f2edf8 0%,#f8f5fc 100%);
}
.modules button, .modules button.selected,
.modules button[data-module], .modules button[data-module].selected{
 background-image:none!important; background-size:auto!important;
 width:100%; height:95px; min-width:0; aspect-ratio:auto;
 display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
 position:relative;gap:0;overflow:hidden;
 margin:0; padding:5px 2px 5px;
 border-radius:19px; border:2px solid #fff;
 background-color:#f8f5fd;
 background:linear-gradient(155deg,#fffdfd 0%,#f8f4fb 45%,#eae4f1 100%);
 box-shadow:0 4px 0 #a9a0b4, 0 7px 9px #59427136, inset 0 2px 3px white;
 color:#17121d; transform:none!important;transition:none!important;
 font-size:inherit;line-height:normal;
}
.modules button.selected, .modules button[data-module].selected{
 border-color:#f7e7ff;
 background:linear-gradient(155deg,#ba72e5 0%,#8d45bd 55%,#63248e 100%);
 box-shadow:0 4px 0 #6c3694,0 7px 9px #59427136,inset 0 2px 3px #d9adf5;
 color:#fff;
}
.modules button:active,.modules button.selected:active{transform:none!important}
.modules .module-illustration,.modules button .module-illustration{
 display:block;flex:0 0 54px;width:56px;height:54px;max-width:90%;
 object-fit:contain; object-position:center; position:static;
 margin:0 auto; padding:0;filter:none!important;transform:none!important;
 pointer-events:none; user-select:none;
}
.modules .module-caption,.modules button .module-caption,
.modules button.selected .module-caption{
 display:block;flex:0 0 auto;position:static;
 width:100%;max-width:100%;margin:0;padding:0;
 color:inherit!important;text-align:center;
 font:700 clamp(9px,1.95vw,13px)/1.15 Arial,Helvetica,sans-serif;
 text-shadow:none!important;transform:none!important;
 white-space:nowrap;
}
.modules button[data-module="Équipements"] .module-caption{font-size:clamp(9px,1.75vw,12px)}
/* Only shutter artwork changes its ink colour for contrast; its pixels never move. */
.modules button[data-module="Volets"].selected .module-illustration{filter:brightness(0) invert(1)!important}
@media(max-width:410px){
 .modules{gap:4px;padding:5px 7px 13px}
 .modules button,.modules button.selected,.modules button[data-module],.modules button[data-module].selected{height:78px;border-radius:14px;padding:3px 0}
 .modules .module-illustration,.modules button .module-illustration{flex-basis:47px;width:48px;height:47px}
 .modules .module-caption,.modules button .module-caption,.modules button.selected .module-caption{font-size:clamp(8px,2.25vw,10px)}
}

/* CORRECTION FINALE : les anciennes images de fond imposaient background-image:none!important,
   ce qui supprimait aussi les dégradés des boutons sélectionnés. */
.modules button[data-module], .modules button[data-module]:not(.selected) {
 background-image:linear-gradient(155deg,#fffdfd 0%,#f8f4fb 45%,#eae4f1 100%) !important;
 color:#17121d !important;
}
.modules button[data-module].selected {
 background-image:linear-gradient(155deg,#ba72e5 0%,#8d45bd 55%,#63248e 100%) !important;
 color:#fff !important;
 border-color:#f7e7ff;
}
.modules button[data-module].selected .module-caption{color:#fff !important}
.modules button[data-module]:not(.selected) .module-caption{color:#17121d !important}

/* Identification non destructive et visuel fixe. */
.modules button .module-illustration{filter:none!important;transition:none!important}
.modules button[data-module="Volets"].selected .module-illustration{filter:brightness(0) invert(1)!important}
.modules button,.modules button.selected{transition:none!important}
.identify-dialog{max-height:min(90dvh,850px);overflow-y:auto;background:#faf7fe;color:#21152d}
.identify-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.identify-head h2{margin:0}
.identify-close{border:0;background:#da364b;color:white;font-size:24px;width:39px;height:39px;border-radius:12px}
.identify-dialog p{line-height:1.4;font-size:13px}
.identify-dialog label{display:block;margin:13px 0;font-weight:700;font-size:13px}
.identify-dialog select{display:block;margin-top:7px;width:100%;padding:11px;border:1px solid #bda4cd;border-radius:11px;background:white;font:inherit}
.identify-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.identify-actions button,.identify-save{border-radius:11px;border:1px solid #8f3cbb;background:#f7ebff;color:#5f2287;padding:12px 7px;font-size:12px;font-weight:700}
#identifyStop{grid-column:1/-1;border-color:#ad304b;background:#fce2e8;color:#a4203d;font-size:14px}
.identify-confirm{display:flex!important;align-items:center;gap:10px;background:#efe4fa;padding:12px;border-radius:12px}
.identify-confirm input{width:18px;height:18px;margin:0}
.identify-save{width:100%;background:linear-gradient(#b665d6,#7430a8);color:white;font-size:14px}
.identify-save:disabled{background:#ddd4e6;color:#877591;opacity:1}
#identifyStatus{padding:11px;border-radius:11px;background:#fff;border:1px solid #d9c7e7;min-height:40px}
.identify-caution{color:#725b80}
.identify-trigger{border:1px solid #af5dd5;border-radius:9px;background:#f3e6fb;padding:8px;color:#65228f;font-size:12px;font-weight:700;margin-top:8px}
.room-details .identify-trigger{margin:6px 12px 12px}


/* VISEL VERROUILLE : boutons correspondant aux références fournies le 03/11.
   Les mêmes illustrations restent immobiles; seule la sélection colore le bouton. */
.modules{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:6px!important;
  padding:5px 10px 16px!important;
  background:#f4eef8!important;
}
.modules button[data-module],
.modules button[data-module]:not(.selected){
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  width:100%!important;
  height:96px!important;
  aspect-ratio:auto!important;
  margin:0!important;
  padding:4px 1px 7px!important;
  border-radius:22px!important;
  border:2px solid #fff!important;
  background:#f9f7fc!important;
  background-image:linear-gradient(154deg,#fff 0%,#faf7fc 51%,#eee9f4 100%)!important;
  color:#101017!important;
  box-shadow:0 4px 0 #a9a1b4,0 7px 10px #5c436e36,inset 0 2px 2px white!important;
  transform:none!important;
  transition:none!important;
  overflow:hidden!important;
}
.modules button[data-module].selected{
  background:#752fa3!important;
  background-image:linear-gradient(155deg,#b66bd9 0%,#7e36b0 56%,#59228b 100%)!important;
  color:white!important;
  border-color:#f6e8ff!important;
  box-shadow:0 4px 0 #65358c,0 7px 12px #56307160,inset 0 2px 5px #d6a5e9!important;
}
.modules button .module-illustration,
.modules button.selected .module-illustration{
  position:static!important;
  display:block!important;
  width:56px!important;
  height:55px!important;
  max-width:88%!important;
  min-width:0!important;
  flex:0 0 55px!important;
  margin:0 auto!important;
  padding:0!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  transition:none!important;
  filter:none!important;
  opacity:1!important;
}
.modules button .module-caption,
.modules button.selected .module-caption{
  position:static!important;
  flex:0 0 auto!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  color:#0c0b12!important;
  font:700 clamp(10px,1.95vw,15px)/1.1 Arial,sans-serif!important;
  white-space:nowrap!important;
  text-shadow:none!important;
  transform:none!important;
  transition:none!important;
}
.modules button[data-module].selected .module-caption{color:white!important}
.modules button[data-module="Équipements"] .module-caption{font-size:clamp(9px,1.7vw,13px)!important}
/* Sur le violet, seule la couleur du pictogramme volet devient blanche ; aucune translation. */
.modules button[data-module="Volets"].selected .module-illustration{filter:brightness(0) invert(1)!important}
.modules button[data-module]:active{transform:none!important}

/* Commandes par pièce : relief, contour et symboles identiques au modèle. */
.controls{display:flex;gap:7px;padding-left:12px;align-items:center}
.controls button{
  display:grid;place-items:center;flex:0 0 auto;
  width:51px;height:48px;
  margin:0;padding:0 0 5px;
  border:2px solid #9b40da;
  border-radius:16px;
  background:linear-gradient(150deg,#fff,#f0ddfc 88%);
  background-image:linear-gradient(150deg,#fff,#f0ddfc 88%);
  box-shadow:0 3px 0 #7f4baa,0 5px 9px #7b579b66,inset 0 2px 3px #fff;
  color:#7030a4;
  font:bold 36px/1 Arial,sans-serif;
  transform:none;transition:none;
}
.controls button:nth-child(2){
  background:linear-gradient(145deg,#fff,#e6e4ec);
  color:#13131a;
  border-color:#a0a2b0;
  box-shadow:0 3px 0 #787984,0 5px 8px #55566c6b,inset 0 2px 3px #fff;
  font-size:22px;padding-bottom:0;
}
.controls button:active{transform:none}
.controls button:disabled{opacity:.36}
.expand{font-size:29px}
@media(max-width:480px){
 .modules{gap:3px!important;padding:4px 5px 12px!important}
 .modules button[data-module],.modules button[data-module]:not(.selected),.modules button[data-module].selected{height:79px!important;border-radius:16px!important;padding:3px 0 4px!important}
 .modules button .module-illustration,.modules button.selected .module-illustration{width:44px!important;height:45px!important;flex-basis:45px!important}
 .modules button .module-caption,.modules button.selected .module-caption{font-size:clamp(8px,2.6vw,12px)!important}
 .modules button[data-module="Équipements"] .module-caption{font-size:clamp(7px,2.3vw,10px)!important}
 .controls{gap:3px;padding-left:5px}
 .controls button{width:32px;height:36px;font-size:27px;border-radius:11px;padding-bottom:3px}
 .controls button:nth-child(2){font-size:15px;padding-bottom:0}
}

/* MAISON CONNECTÉE - unique final module component: no image backgrounds or motion */
.modules{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:7px!important;padding:5px 14px 17px!important;margin:0!important;background:transparent!important}
.modules button[data-module],.modules button[data-module]:not(.selected),.modules button[data-module].selected{
  box-sizing:border-box!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  width:100%!important;min-width:0!important;height:100px!important;aspect-ratio:auto!important;
  margin:0!important;padding:5px 2px 7px!important;gap:2px!important;overflow:visible!important;
  border-radius:20px!important;border:2px solid #fff!important;
  background:#f6f2fa!important;background-image:linear-gradient(155deg,#fff 0%,#f9f6fc 54%,#e9e3f0 100%)!important;
  background-position:initial!important;background-size:auto!important;
  box-shadow:0 4px 0 #aaa0b4,0 8px 12px #6f507b43,inset 0 2px 3px #fff!important;
  color:#121018!important;opacity:1!important;transform:none!important;transition:none!important;
}
.modules button[data-module].selected{
 background:#7931a7!important;background-image:linear-gradient(155deg,#ba6fdf 0%,#8236b4 51%,#60258f 100%)!important;
 border-color:#f7edff!important;box-shadow:0 4px 0 #5e2b86,0 8px 13px #62358364,inset 0 2px 5px #e6b8ff!important;
 color:white!important;
}
.modules button[data-module]:active,.modules button[data-module]:hover,.modules button[data-module]:focus{transform:none!important}
.modules button[data-module] .module-illustration,.modules button[data-module].selected .module-illustration{
 display:block!important;position:static!important;box-sizing:border-box!important;
 width:59px!important;height:59px!important;min-width:0!important;max-width:85%!important;flex:0 0 59px!important;
 margin:0 auto!important;padding:0!important;object-fit:contain!important;object-position:center!important;
 opacity:1!important;transform:none!important;transition:none!important;filter:none!important;pointer-events:none!important;
}
.modules button[data-module] .module-caption,.modules button[data-module].selected .module-caption{
 position:static!important;display:block!important;width:100%!important;flex:0 0 auto!important;margin:0!important;padding:0!important;
 text-align:center!important;white-space:nowrap!important;color:inherit!important;
 font:700 clamp(10px,1.85vw,14px)/1.1 Arial,Helvetica,sans-serif!important;text-shadow:none!important;transform:none!important;transition:none!important;
}
.modules button[data-module="Équipements"] .module-caption{font-size:clamp(9px,1.65vw,13px)!important}
/* Transparent outlined shutter artwork - white ink on purple, same image geometry */
.modules button[data-module="Volets"].selected .module-illustration{filter:brightness(0) invert(1)!important}
@media(max-width:480px){
 .modules{gap:5px!important;padding:4px 7px 13px!important}
 .modules button[data-module],.modules button[data-module]:not(.selected),.modules button[data-module].selected{height:83px!important;border-radius:16px!important;padding:3px 1px 5px!important}
 .modules button[data-module] .module-illustration,.modules button[data-module].selected .module-illustration{width:46px!important;height:46px!important;flex-basis:46px!important}
 .modules button[data-module] .module-caption,.modules button[data-module].selected .module-caption{font-size:clamp(8px,2.55vw,12px)!important}
 .modules button[data-module="Équipements"] .module-caption{font-size:clamp(7px,2.3vw,11px)!important}
}

/* Patch cible : trois boutons de volet identiques aux découpes fournies, dans les lignes et détails. */
.controls button[data-action],.mini-controls button[data-action],
.controls button[data-action]:nth-child(2),.mini-controls button[data-action]:nth-child(2){
 appearance:none!important;
 background-color:transparent!important;
 background-repeat:no-repeat!important;
 background-position:center!important;
 background-size:100% 100%!important;
 border:0!important;
 border-radius:12px!important;
 padding:0!important;
 box-shadow:none!important;
 text-shadow:none!important;
 font-size:0!important;
 color:transparent!important;
 line-height:0!important;
 width:48px!important;
 height:43px!important;
 min-width:0!important;
 transform:none!important;
 transition:none!important;
}
.controls button[data-action="up"],.mini-controls button[data-action="up"]{background-image:url('commande-up-simple.svg')!important}
.controls button[data-action="stop"],.mini-controls button[data-action="stop"]{background-image:url('commande-stop-simple.svg')!important}
.controls button[data-action="down"],.mini-controls button[data-action="down"]{background-image:url('commande-down-simple.svg')!important}
.controls button[data-action]:disabled,.mini-controls button[data-action]:disabled{opacity:.34!important}
/* Flèche d'ouverture de la pièce : plus grande, sans changer les autres contrôles. */
.room-main .expand{font:700 43px/1 Arial,Helvetica,sans-serif!important;min-width:29px!important;padding:0 1px!important;align-self:center!important;transform:none!important}
@media(max-width:480px){
 .controls button[data-action],.mini-controls button[data-action],
 .controls button[data-action]:nth-child(2),.mini-controls button[data-action]:nth-child(2){width:clamp(29px,8.1vw,45px)!important;height:clamp(28px,7.4vw,39px)!important}
 .room-main .expand{font-size:37px!important;min-width:23px!important}
}

/* Réglages séparés des commandes : sans toucher aux tuiles ni aux boutons validés. */
.settings-device{background:#faf7fd;border:1px solid #e3d2ed;border-radius:14px;padding:12px;margin:10px 0}
.settings-device strong{display:block;font-size:14px;color:#342443}
.settings-device label{margin:8px 0;font-size:12px}
.settings-device input{margin-top:5px}
.device-settings{margin-top:24px;border-top:1px solid #e6d8ec;padding-top:12px}
.device-settings h3{font-size:17px}
.device-settings #saveSettings{margin-top:10px}
.commands-only{justify-content:flex-end;padding:8px 14px}
.commands-only .mini-controls{gap:8px}
.commands-only .mini-controls button{width:45px;height:45px}

.settings-device .rename-device{display:block;margin:8px 0 10px;padding:7px 12px;border:1px solid #c7a9db;background:#f5ebfa;color:#6e2899;border-radius:10px;font-weight:700}


/* Corrections demandées 03/11 soir : alignement identique des commandes, 
   suppression de la ligne Adresse dans les sous-volets, 
   et absence de flèche déroulante visuelle pour les pièces à un seul volet. */
.room-main{justify-content:flex-start;}
.room-info{min-width:0;flex:1 1 auto;}
.room-actions{margin-left:auto;display:flex;align-items:center;gap:8px;flex:0 0 auto;min-width:190px;justify-content:flex-end;}
.room-actions .controls{border-left:1px solid #b9a9c5;padding-left:12px;gap:7px;flex:0 0 auto;}
.room-actions .expand,.room-actions .expand-spacer{display:flex;align-items:center;justify-content:center;flex:0 0 24px;width:24px;min-width:24px;height:48px;}
.room-actions .expand-spacer{visibility:hidden;pointer-events:none;}
.room-details .device-name small{display:none!important;}
.device-row{min-height:58px;}
.device-name{display:flex;align-items:center;min-height:36px;}
.device-name strong{margin:0;}
.expand{font-size:32px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;color:#23142e!important;}
@media(max-width:410px){
 .room-actions{min-width:142px;gap:5px;}
 .room-actions .expand,.room-actions .expand-spacer{width:20px;min-width:20px;height:36px;}
}

/* En-tête validé : afficher entièrement la nouvelle illustration sans recadrage. */
.hero{aspect-ratio:2170/652!important;}
.hero-art{object-fit:contain!important;}

/* Routines — diagnostic sûr et brouillons locaux */
.routine-panel{padding-bottom:24px}.routine-alert{padding:12px;border-radius:12px;background:#fff2de;color:#643b19;font-weight:600}.routine-read-item{border:1px solid #e0d1eb;background:#f8f4fc;padding:12px;border-radius:12px;margin:10px 0}.routine-read-item p{margin:7px 0}.routine-draft{margin-top:22px;padding-top:12px;border-top:1px solid #ddd}.routine-draft label{display:block;margin:12px 0}.routine-draft input,.routine-draft select{width:100%;display:block;margin-top:7px;padding:12px;border:1px solid #cdbbdc;border-radius:12px;background:white}.routine-panel #routineStatus{font-size:.95rem;color:#57397b}

/* Routines — édition complète dans la passerelle */
.routine-toolbar{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:12px 0}
.routine-toolbar button,.routine-item button{cursor:pointer;border-radius:10px;padding:10px 14px;border:1px solid #bda0d1;background:#f8f2ff;color:#42235b;font-weight:650}
.routine-toolbar button.primary,.routine-item button.primary{background:#74409b;color:#fff;border:0}
.routine-toolbar button:disabled,.routine-item button:disabled{opacity:.55;cursor:wait}
.routine-device-list,.routine-days{border:1px solid #d2c0df;border-radius:12px;padding:12px;margin:14px 0}
.routine-days{display:flex;gap:10px;flex-wrap:wrap}
.routine-days legend,.routine-device-list legend{font-weight:750}
.routine-days label,.routine-device-list label{display:inline-flex!important;gap:6px;align-items:center;margin:5px 10px 5px 0!important;font-size:.92rem}
.routine-days input,.routine-device-list input,.routine-toggle input{width:auto!important;margin:0!important}
.routine-toggle{display:flex!important;align-items:center;gap:9px}
.routine-item{background:#faf7ff;border:1px solid #ded0e9;border-radius:14px;padding:14px;margin:10px 0}
.routine-item header{display:flex;justify-content:space-between;align-items:center;gap:10px}
.routine-item h4{margin:0;color:#2a1439}
.routine-item p{margin:7px 0;font-size:.9rem}
.routine-item .routine-toolbar{margin-bottom:0}
.routine-old{opacity:.83}
.routine-warning{font-size:.83rem;color:#6c4c2a;background:#fff5e6;padding:12px;border-radius:10px}

#routineStatus:not([hidden]){background:#fff0f1;color:#9f1734;border:1px solid #dc536e;border-radius:10px;padding:12px;font-weight:700;margin:12px 0}

/* --- Maison Connectée : adaptation fidèle de la maquette bleu nuit --- */
:root{color-scheme:dark; color:#eaf6ff; background:#050f24}
body{background:#050f24}
.shell{background:linear-gradient(180deg,#061730 0%,#041126 55%,#081b34 100%);box-shadow:0 0 40px #010717}
.hero{aspect-ratio:883/194!important;background:#07162b!important}
.hero-art{width:100%;height:100%;object-fit:cover!important}
.modules{padding:7px 12px 18px;gap:8px}
.modules button[data-module]{background:linear-gradient(145deg,#0a3556,#06162f)!important;border:2px solid #27c4fc!important;color:#effaff!important;box-shadow:0 0 13px #03bdf059,inset 0 0 17px #06609a88!important}
.modules button[data-module].selected{background:linear-gradient(135deg,#8b3ac5,#311276)!important;border-color:#e38aff!important;box-shadow:0 0 15px #ac48ef90,inset 0 0 18px #b961e288!important}
.modules button[data-module] .module-caption{color:#f4faff!important}
.toast{color:#c5eafa!important}
#automationsPanel .routine-panel{position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(8,37,75,.94),rgba(3,18,40,.96)),url('montagnes-routines.svg') center/cover;border:2px solid #08b8f2;border-radius:24px;box-shadow:0 0 18px #00b6ff56,inset 0 0 30px #0d7bc329;color:#f3fbff;padding:25px 25px 30px}
#automationsPanel .routine-panel::before{content:"";position:absolute;inset:0;background:url('montagnes-routines.svg') center top/100% auto no-repeat;opacity:.20;pointer-events:none}
#automationsPanel .routine-panel>*{position:relative}
#automationsPanel h2{font-size:26px;color:#f9fcff;margin:0 0 18px}
#automationsPanel h3{color:#e9f7ff;font-size:21px;margin:0 0 15px}
#automationsPanel .routine-draft{border-top:1px solid #0ac3f5;margin-top:23px;padding-top:22px}
#automationsPanel label,#automationsPanel legend{color:#f7fcff}
#automationsPanel .routine-draft input:not([type="checkbox"]),#automationsPanel select{background:linear-gradient(130deg,#0b3055,#071b37);border:1.5px solid #3acaff;color:#fff;box-shadow:inset 0 1px 7px #07122b;font-size:14px}
#automationsPanel .routine-draft input::placeholder{color:#b2c7dd}
#automationsPanel .routine-draft input[type="checkbox"]{accent-color:#04c8ef}
#automationsPanel .routine-days,#automationsPanel .routine-device-list{background:linear-gradient(120deg,#072747d9,#061c37d9);border:1.5px solid #34c6f2;box-shadow:inset 0 0 10px #075a9045}
#automationsPanel .routine-toolbar button.primary,#automationsPanel .primary{background:linear-gradient(135deg,#ab5fe9,#5b1a9f)!important;border:1px solid #e18bff!important;color:#fff;box-shadow:0 0 12px #ac43f07a}
#automationsPanel .routine-toolbar button:not(.primary),#automationsPanel #resetRoutine,#automationsPanel .routine-item button{background:linear-gradient(135deg,#0d5a8f,#061f42);border:1px solid #39caff;color:#fff;box-shadow:0 0 9px #19b9eb47}
#automationsPanel .routine-item{background:linear-gradient(135deg,#08294c,#071d3b);border:1px solid #35bce9;box-shadow:inset 0 0 12px #0a5a8a55;color:#fff}
#automationsPanel .routine-item h4{color:#fff}
#automationsPanel .routine-item p{color:#c9dfef}
#automationsPanel .routine-panel p{color:#c9dfef}
#automationsPanel .routine-panel #routineStatus:not([hidden]){background:#341326;border:1px solid #fa4b55;color:#ffe9eb}
.routine-auth-error:not([hidden]){border:1.5px solid #ff535c;border-radius:12px;background:linear-gradient(135deg,#3e1527,#211528);box-shadow:0 0 12px #f0445455;padding:14px;margin:15px 0;color:#fff}
.routine-auth-error strong{display:block;color:#ffc1c6;font-size:15px}
#automationsPanel .routine-auth-error p{margin:7px 0 12px;color:#fff}
#routineRetryAuth{background:linear-gradient(135deg,#a751d8,#55179c);border:1px solid #da90ff;border-radius:9px;padding:9px 17px;color:#fff;font-weight:750;box-shadow:0 0 11px #ab4de177}
footer{background:linear-gradient(155deg,#071c38,#06142b);border:1.5px solid #27bdf5;box-shadow:0 -3px 18px #00b7f440}
footer button{color:#e8f6ff!important}
footer button.active{background:linear-gradient(155deg,#a247de,#47158b);border:1px solid #dc86ff;box-shadow:0 0 15px #bd4cec8c}
#automationsPanel .routine-toolbar{margin-top:12px}
@media(max-width:420px){#automationsPanel .routine-panel{padding:18px 13px 25px}.modules{gap:4px;padding-left:6px;padding-right:6px}#automationsPanel h2{font-size:22px}}

/* Corrections navigation : icônes blanches sur fond nuit, actives ou non. */
footer button span,footer button.active span,footer button:not(.active) span{filter:brightness(0) invert(1)!important;opacity:1!important}
footer button,footer button:not(.active),footer button.active{color:#fff!important}


/* Correctif lisibilité : noms des pièces plus foncés pour un contraste net. */
.room-info strong,
.device-name strong{
  color:#52227e !important;
  text-shadow:none !important;
  opacity:1 !important;
}


/* Mise en couleur des seules cartes Volets : fond bleu nuit et texte blanc. */
#rooms .room-group {
  background:linear-gradient(135deg,#0b3159 0%,#081e3c 58%,#06172f 100%) !important;
  border-color:#2abcf3 !important;
  box-shadow:0 3px 0 #08466e,0 7px 14px #000c224d,inset 0 0 13px #008bd029 !important;
  color:#fff !important;
}
#rooms .room-info strong,
#rooms .room-info small,
#rooms .device-name strong {
  color:#fff !important;
  opacity:1 !important;
  text-shadow:none !important;
}
#rooms .room-details {
  background:#092344 !important;
  border-top-color:#2a719e !important;
  color:#fff !important;
}
#rooms .device-row {border-top-color:#24577d !important;}
#rooms .room-actions .expand {color:#fff !important;}
#rooms .room-actions .controls {border-left-color:#3b80a8 !important;}

/* Alignement vertical du bouton de dépliage sur les boutons monter/stop/descendre.
   Pas de changement de dimensions ni d'interactions. */
#rooms .room-actions .expand {
  display:grid !important;
  place-items:center !important;
  align-self:center !important;
  font-size:0 !important;
  line-height:0 !important;
  padding:0 !important;
}
#rooms .room-actions .expand::before {
  content:"";
  box-sizing:border-box;
  width:13px;
  height:13px;
  border-right:3px solid #fff;
  border-bottom:3px solid #fff;
  transform:translateY(-3px) rotate(45deg);
  border-radius:1px;
}
#rooms .room-actions .expand[aria-expanded="true"]::before {
  transform:translateY(3px) rotate(225deg);
}

/* 2026-11 : interface harmonisée — uniquement apparence. */
#settings .panel{background:linear-gradient(145deg,#09264a,#06172f 70%,#041226)!important;color:#f1f9ff!important;border:1.5px solid #33c8f6;box-shadow:0 0 16px #02a8eb55!important;}
#settings .panel h2,#settings .panel h3,#settings .panel label,#settings .panel strong{color:#fff!important;}
#settings .panel p{color:#d7eaff!important;}
#settings .panel input,#settings .panel select{background:#092640!important;border:1px solid #46bdf4!important;color:#fff!important;}
#settings .settings-device{background:linear-gradient(140deg,#0a3157,#071b3b)!important;border:1px solid #22a9e8!important;color:#fff!important;}
#settings .settings-device label{color:#eaf7ff!important;}
#settings .setting-actions button,#settings .import,#settings .rename-device{background:linear-gradient(135deg,#a65bde,#5e22a5)!important;border:1px solid #bd8cef!important;color:white!important;}
#settings .close-settings{display:none!important;}
#editDialog{background:linear-gradient(145deg,#0a3154,#05152d)!important;color:#fff!important;border:1.5px solid #35c2fa!important;}
#editDialog label,#editDialog h2{color:#fff!important;}
#editDialog input,#editDialog select{background:#08243d!important;color:#fff!important;border:1px solid #47c7f5!important;}
#editDialog .dialog-actions button{color:#fff!important;background:linear-gradient(135deg,#ab5cdb,#5923a2)!important;border:1px solid #cf82f5!important;}
#identifyDialog{background:linear-gradient(145deg,#0b3157,#061b36 70%,#041529)!important;color:#fff!important;border:1.5px solid #28bff4!important;}
#identifyDialog h2,#identifyDialog label{color:#fff!important;}
#identifyDialog select{background:#082744!important;color:#fff!important;border:1px solid #4bcbff!important;}
#identifyDialog select option,#settings select option,#editDialog select option{background:#0b2545!important;color:#fff!important;}
#identifyDialog .identify-confirm{background:#0c385a!important;color:#fff!important;}
#identifyDialog .identify-test,#identifyDialog .identify-save{background:linear-gradient(140deg,#a458dc,#57239d)!important;color:#fff!important;border:1px solid #c780f7!important;}
#identifyDialog #identifyStop{background:#6a1935!important;color:#fff!important;border-color:#f05a7a!important;}
#identifyDialog .identify-save:disabled{opacity:.45!important;}
#identifyStatus:not([hidden]){background:#351a2c!important;border:1px solid #f66!important;color:#fff!important;}
.room-icon-preview{display:block;width:112px;max-width:100%;height:86px;object-fit:contain;margin:8px 0;border-radius:12px;}
#rooms .room-shutter{object-fit:contain!important;background:#041329!important;border:0!important;box-shadow:none!important;}
#editorRoomFields[hidden]{display:none!important;}

/* Menu Action et Vitesse : choix visibles sur fond sombre, homogènes avec le menu Identifier. */
#routineAction, #routineSpeed {
  background-color:#0a2948 !important;
  color:#fff !important;
  border:1px solid #39c5fc !important;
  color-scheme: dark;
}
#routineAction option, #routineSpeed option {
  color:#fff !important;
  background-color:#0a2948 !important;
}
#routineAction option:checked, #routineSpeed option:checked {
  color:#fff !important;
  background-color:#245c93 !important;
}

/* Retrait du rectangle sombre autour des illustrations des pièces.
   On garde les bordures lumineuses intégrées aux PNG. */
#rooms .room-shutter {
  width:76px !important;
  height:71px !important;
  flex:0 0 76px !important;
  object-fit:contain !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
@media(max-width:410px){
 #rooms .room-shutter{width:64px!important;height:60px!important;flex-basis:64px!important;}
}


/* Scénarios : même thème bleu nuit que les automatisations, sans changer leurs styles. */
#scenesPanel .scenes-panel{position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(8,37,75,.95),rgba(3,18,40,.97)),url('montagnes-routines.svg') center/cover;border:2px solid #08b8f2;border-radius:24px;box-shadow:0 0 18px #00b6ff56,inset 0 0 30px #0d7bc329;color:#f3fbff;padding:25px 25px 30px}
#scenesPanel h2{font-size:26px;color:#f9fcff;margin:0 0 22px}
#scenesPanel h3{font-size:21px;color:#fff;margin:0 0 17px}
#scenesPanel .scene-draft{border-top:1px solid #0ac3f5;margin-top:24px;padding-top:22px}
#scenesPanel label,#scenesPanel strong{color:#fff}
#scenesPanel #sceneName,#scenesPanel select{background:#0b2949;color:#fff;border:1.5px solid #36c4f7;border-radius:11px;padding:12px;font:inherit;max-width:100%}
#scenesPanel select option{background:#0b2949;color:#fff}
#scenesPanel #sceneName{width:100%;margin:8px 0 20px}
#scenesPanel #sceneName::placeholder{color:#aabed5}
#scenesPanel .scene-headings{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}
#scenesPanel .scene-headings span{font-size:12px;color:#c5dfef}
#scenesPanel .scene-device-rows{border:1.5px solid #32bde9;border-radius:13px;background:#06223e;padding:9px;display:grid;gap:8px}
#scenesPanel .scene-device-row{display:grid;grid-template-columns:minmax(100px,1fr) minmax(114px,140px) minmax(110px,140px);align-items:center;gap:9px;padding:7px 5px;border-bottom:1px solid #1c5073}
#scenesPanel .scene-device-row:last-child{border:0}
#scenesPanel .scene-device-row strong{font-size:13px;overflow-wrap:anywhere}
#scenesPanel .scene-device-row select{font-size:13px;width:100%;padding:9px 7px}
#scenesPanel select:disabled{opacity:.38}
#scenesPanel .scene-toolbar{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
#scenesPanel .scene-toolbar button{background:linear-gradient(135deg,#0d5a8f,#061f42);border:1px solid #39caff;color:white;border-radius:10px;padding:10px 14px;box-shadow:0 0 9px #19b9eb47;font-weight:700}
#scenesPanel .scene-toolbar button.primary{background:linear-gradient(135deg,#ab5fe9,#5b1a9f);border:1px solid #e18bff;box-shadow:0 0 12px #ac43f07a}
#scenesPanel .scene-toolbar button:disabled{opacity:.45}
#scenesPanel .scene-item{padding:15px 14px;margin-bottom:10px;background:linear-gradient(135deg,#08294c,#071d3b);border:1px solid #35bce9;border-radius:13px;box-shadow:inset 0 0 12px #0a5a8a55}
#scenesPanel .scene-item h4{color:#fff;font-size:16px;margin:0 0 9px}
#scenesPanel .scene-item p,#scenesPanel .scene-empty{color:#cce7f7;margin:0;font-size:13px;line-height:1.6}
#scenesPanel .scene-status:not([hidden]){background:#0b3956;border:1px solid #39caff;color:#fff;padding:12px;border-radius:11px;margin:0 0 15px;font-size:13px}
#scenesPanel .scene-status.scene-error:not([hidden]){background:#3e1928;border-color:#fd5b7c}
@media(max-width:540px){#scenesPanel .scenes-panel{padding:18px 12px}#scenesPanel .scene-device-row{grid-template-columns:minmax(0,1fr) minmax(96px,1fr);gap:6px}#scenesPanel .scene-device-row strong{grid-column:1/-1}#scenesPanel .scene-device-row select{padding:9px 5px}}

/* Les commandes globales restent identiques ; suppression du panneau blanc derrière. */
#home .all-controls{background:transparent!important;border-color:transparent!important;box-shadow:none!important;}

/* Scénarios : liste compacte puis réglages pour les volets cochés uniquement. */
#scenesPanel .scene-device-rows{display:block;padding:0;border:0;background:transparent}
#scenesPanel .scene-pick-list{min-width:0;margin:0;padding:12px;border:1.5px solid #32bde9;border-radius:13px;background:#06223e}
#scenesPanel .scene-pick-list legend{color:#fff;font-weight:700;padding:0 5px;font-size:15px}
#scenesPanel .scene-checkboxes{display:flex;flex-wrap:wrap;gap:9px 11px;align-items:center}
#scenesPanel .scene-pick{display:inline-flex;align-items:center;gap:5px;margin:0;color:white;font-weight:700;font-size:13px;cursor:pointer}
#scenesPanel .scene-pick input{width:14px;height:14px;accent-color:#19cafa;margin:0}
#scenesPanel .scene-selected-details{margin-top:15px;padding:12px 10px;border:1px solid #226d97;border-radius:13px;background:#06223e}
#scenesPanel .scene-selected-details[hidden],#scenesPanel .scene-device-row[hidden]{display:none!important}
#scenesPanel .scene-selected-details h4{font-size:14px;color:#fff;margin:0 0 8px}
#scenesPanel .scene-device-row{grid-template-columns:minmax(100px,1fr) minmax(112px,140px) minmax(112px,140px)}
/* Les trois images de commande ont été recoupées de 5px au bas. */
#home .all-controls button{aspect-ratio:2.43!important}
@media(max-width:540px){
 #scenesPanel .scene-device-row{grid-template-columns:minmax(0,1fr) minmax(96px,1fr)!important}
 #scenesPanel .scene-device-row strong{grid-column:1/-1}
}

/* Ecran d'accueil dédié : la maquette validée est l'illustration de fond,
   les zones transparentes sont de vrais boutons accessibles. */
.shell.landing-mode{width:min(100%,616px);padding:0;background:#061429;box-shadow:0 0 35px #0008;min-height:100dvh}
.shell.landing-mode > .hero,.shell.landing-mode > main,.shell.landing-mode > footer{display:none!important}
.main-menu{display:block;width:100%;background:#061429}
.main-menu[hidden]{display:none!important}
.menu-image-wrap{position:relative;width:100%;margin:0 auto;line-height:0}
.menu-image{display:block;width:100%;height:auto}
.menu-hitbox{position:absolute;border:0;border-radius:12%;background:transparent;color:transparent;cursor:pointer;z-index:2;touch-action:manipulation}
.menu-hitbox:focus-visible{outline:3px solid white;outline-offset:2px;background:#ffffff16}
.menu-hitbox:active{background:#ffffff22}
.menu-settings{top:4.5%;left:86%;width:11%;height:6.5%;border-radius:18px}
.menu-shutters{top:40.8%;left:12.0%;width:35.4%;height:15.8%}
.menu-lighting{top:40.8%;left:50.7%;width:36.1%;height:15.8%}
.menu-heating{top:57.2%;left:12%;width:35.4%;height:15.9%}
.menu-energy{top:57.2%;left:50.7%;width:36.1%;height:15.9%}
.menu-equipment{top:73.4%;left:12%;width:35.4%;height:16.1%}
.menu-scenarios{top:73.4%;left:50.7%;width:36.1%;height:16.1%}
.future-module{min-height:230px;color:white;background:linear-gradient(140deg,#102d50,#061a31);border:1px solid #25b8ef}
.future-module p{color:#e5f6ff!important}
footer button[data-tab="home"]{font-size:clamp(8px,1.7vw,11px)}

/* Accueil : image sans faux bandeau du telephone ; tuiles plus compactes.
   L'image occupe la hauteur disponible sans laisser de bande vide au bas. */
.shell.landing-mode,.shell.landing-mode .main-menu{min-height:100dvh;background:#061429}
.shell.landing-mode .menu-image-wrap{height:max(100dvh,calc(100vw * 1.777));max-height:none;overflow:hidden}
.shell.landing-mode .menu-image{width:100%;height:100%;object-fit:fill}
.shell.landing-mode .menu-settings{left:86%;top:4.1%;width:10.4%;height:5.3%}
.shell.landing-mode .menu-shutters{left:18.3%;top:43.7%;width:28.6%;height:11.3%}
.shell.landing-mode .menu-lighting{left:52.5%;top:43.7%;width:28.6%;height:11.3%}
.shell.landing-mode .menu-heating{left:18.3%;top:56.2%;width:28.6%;height:10.9%}
.shell.landing-mode .menu-energy{left:52.5%;top:56.2%;width:28.6%;height:10.9%}
.shell.landing-mode .menu-equipment{left:18.3%;top:68.1%;width:28.6%;height:11%}
.shell.landing-mode .menu-scenarios{left:52.5%;top:68.1%;width:28.6%;height:11%}
@media(min-width:617px){.shell.landing-mode .menu-image-wrap{height:max(100dvh,1095px)}}

/* Page d'accueil - nouvelle illustration à proportions naturelles et tuiles plus petites. */
.shell.landing-mode .menu-image-wrap{height:auto!important;max-height:none!important;overflow:visible!important;aspect-ratio:941 / 1672}
.shell.landing-mode .menu-image{width:100%;height:auto!important;object-fit:contain!important}
.shell.landing-mode .menu-settings{left:84.5%;top:4%;width:12%;height:7%}
.shell.landing-mode .menu-shutters{left:23.5%;top:50.5%;width:22.5%;height:9.9%}
.shell.landing-mode .menu-lighting{left:51.4%;top:50.5%;width:22.5%;height:9.9%}
.shell.landing-mode .menu-heating{left:23.5%;top:61.1%;width:22.5%;height:9.8%}
.shell.landing-mode .menu-energy{left:51.4%;top:61.1%;width:22.5%;height:9.8%}
.shell.landing-mode .menu-equipment{left:23.5%;top:71.5%;width:22.5%;height:9.8%}
.shell.landing-mode .menu-scenarios{left:51.4%;top:71.5%;width:22.5%;height:9.8%}
/* L'erreur reste sur le menu principal, sans accéder aux volets. */
.menu-centero-error{position:absolute;top:11%;left:3%;right:3%;z-index:12;
 background:linear-gradient(135deg,#321b28f7,#291420fa);border:1px solid #ef4758;
 border-radius:14px;padding:14px;color:#fff;font:13px/1.45 Arial,Helvetica,sans-serif;
 box-shadow:0 5px 22px #0009;}
.menu-centero-error[hidden]{display:none!important}
.menu-centero-error strong{font-size:14px;color:#fff}
.menu-centero-error p{margin:8px 0 12px;color:#fff}
.menu-centero-error button{background:linear-gradient(140deg,#a45be3,#6d2b9f);color:#fff;
 font-weight:bold;border:1px solid #d7a6ff;border-radius:11px;padding:9px 17px;box-shadow:0 4px 9px #0007}
.main-menu{position:relative}

/* Correctifs accueil : la maquette conserve son rapport hauteur/largeur.
   L'espace disponible en bas continue le sol de la maquette, sans étirer le salon. */
.shell.landing-mode,
.shell.landing-mode .main-menu{min-height:100dvh}
.shell.landing-mode .main-menu{display:flex;flex-direction:column;position:relative}
.shell.landing-mode .main-menu[hidden]{display:none!important}
.shell.landing-mode .menu-image-wrap{flex:0 0 auto}
.shell.landing-mode .main-menu::after{
 content:"";display:block;flex:1 0 0;min-height:0;width:100%;
 background-image:linear-gradient(to bottom,transparent,#04152b55),url('menu-sol-extension.webp');
 background-size:100% 100%,100% 100%;background-repeat:no-repeat;
}
/* Message unique : titre, description et bouton centrés dans le panneau. */
.shell.landing-mode .menu-centero-error{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 text-align:center;gap:10px;padding:17px 16px;
}
.shell.landing-mode .menu-centero-error strong{text-align:center;display:block}
.shell.landing-mode .menu-centero-error p{margin:0;text-align:center}
.shell.landing-mode .menu-centero-error button{display:block;margin:2px auto 0}

/* Menu de novembre — image recadree a la ligne indiquee, sans bande ajoutee. */
.shell.landing-mode,.shell.landing-mode .main-menu {min-height:0!important;}
.shell.landing-mode .main-menu {display:block!important;}
.shell.landing-mode .main-menu[hidden] {display:none!important;}
.shell.landing-mode .main-menu::after {display:none!important;content:none!important;background:none!important;}
.shell.landing-mode .menu-image-wrap {display:block!important;aspect-ratio:597/1045!important;width:100%!important;height:auto!important;max-height:none!important;overflow:hidden!important;flex:none!important;}
.shell.landing-mode .menu-image {display:block;width:100%!important;height:auto!important;object-fit:contain!important;}
.shell.landing-mode .menu-settings {left:91%;top:2%;width:8%;height:6%;}
.shell.landing-mode .menu-shutters {left:26%;top:40.1%;width:22%;height:9%;}
.shell.landing-mode .menu-lighting {left:52%;top:40.1%;width:22%;height:9%;}
.shell.landing-mode .menu-heating {left:26%;top:49.8%;width:22%;height:9%;}
.shell.landing-mode .menu-energy {left:52%;top:49.8%;width:22%;height:9%;}
.shell.landing-mode .menu-equipment {left:26%;top:59%;width:22%;height:9%;}
.shell.landing-mode .menu-scenarios {left:52%;top:59%;width:22%;height:9%;}

/* Scénarios : espace indépendant du module volets. */
.scenarios-hub{min-height:calc(100dvh - 170px);padding:24px 16px 118px;color:#f2f9ff;background:linear-gradient(160deg,#06152d,#0a2e50 60%,#091632)}
.scenarios-hub-head{text-align:center;max-width:540px;margin:0 auto 25px;position:relative}
.scenarios-hub-head h2{font-size:27px;margin:16px 0 8px;text-shadow:0 0 12px #34bafa}
.scenarios-hub-head p{font-size:14px;color:#b4d8f3;line-height:1.5}
.scenarios-back{display:block;border:1px solid #40bffa;border-radius:12px;padding:10px 14px;background:#10365a;color:white;font-weight:700}
.scenarios-hub-options{max-width:530px;display:grid;gap:18px;margin:0 auto}
.scenarios-hub-card{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;width:100%;min-height:175px;padding:22px 15px;background:linear-gradient(140deg,#132a58,#07182f);border:2px solid #40bbfa;border-radius:24px;color:#fff;box-shadow:0 0 17px #16a7f35a,inset 0 0 15px #06497166}
.scenarios-hub-card:first-child{border-color:#c56cff;box-shadow:0 0 17px #a74feb66,inset 0 0 15px #582e8166}
.scenarios-hub-icon{font-size:36px;line-height:1.1;color:#e2c7ff}
.scenarios-hub-card strong{font-size:19px}
.scenarios-hub-card small{font-size:13px;line-height:1.45;color:#c6daed;max-width:350px}
.maison-scenarios-empty{max-width:530px;margin:auto;padding:24px;border:1px solid #3ebafa;border-radius:20px;background:#0a2947;text-align:center;line-height:1.6}
.maison-scenarios-empty p{font-size:14px;color:#d3e6f6}

/* Paramètres : gestion du mot de passe Centero mémorisé */
#settings .forget-password{margin:10px 0 0;padding:10px 14px;background:#102b47;color:#fff;border:1px solid #39baf1;border-radius:11px;font-weight:700;}
#settings .password-hint{font-size:12px;line-height:1.5;}