/* « Mes réseaux » – Carnet construction. Charte re2020expert.fr (tokens de site.css), téléphone d'abord. */
@font-face{font-family:"Plus Jakarta Sans";src:url(plus-jakarta-sans-latin.woff2) format("woff2");font-weight:200 800;font-display:swap}
:root{--navy:#052e64;--teal:#0a7a99;--cyan:#0cc0df;--soft:#e3f7fb;--ok:#2e9e3e;--ok-soft:#e8f6ea;--red:#b3261e;--red-soft:#fdecea;--ink:#0f1f38;--muted:#5a6b84;--line:#e2e8f1;--bg:#f3f6fb;
  --eau:#0a7a99;--elec:#d98c00}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-size:17px;line-height:1.45;display:flex;flex-direction:column;-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer}
.rx-tete{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#fff;border-bottom:1px solid var(--line)}
.rx-logo{height:34px;width:auto}
.rx-titre{flex:1;display:flex;flex-direction:column;line-height:1.15;min-width:0}
.rx-titre b{color:var(--navy);font-size:18px;font-weight:800}
.rx-titre span{font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rx-menu{border:0;border-radius:12px;background:var(--navy);color:#fff;font-weight:800;padding:10px 14px}
.rx-zone{flex:1;display:flex;flex-direction:column;min-height:0}
.rx-bandeau{padding:10px 14px;background:var(--soft);color:var(--navy);font-weight:700;font-size:16px;min-height:44px}
.rx-bandeau:empty{display:none}
.rx-bandeau.alerte{background:var(--red-soft);color:var(--red)}
.rx-bandeau small{display:block;font-weight:500;color:var(--muted);font-size:14px}
.rx-toile{position:relative;flex:1;min-height:240px;background:#fff;overflow:hidden;touch-action:none}
.rx-toile canvas{position:absolute;inset:0;width:100%;height:100%}
.rx-zoom{position:absolute;right:10px;bottom:10px;display:flex;flex-direction:column;gap:8px}
.rx-zoom button{width:46px;height:46px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--navy);font-size:24px;font-weight:800;box-shadow:0 2px 8px rgba(5,46,100,.12)}
.rx-outils{background:var(--soft);border-top:3px solid var(--cyan);padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
.rx-outils:empty{display:none}
.rx-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:8px}
.rx-modes button{border:2px solid var(--line);background:#fff;color:var(--navy);border-radius:14px;padding:9px 6px;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;gap:6px}
.rx-modes button svg{width:22px;height:22px;flex:none}
.rx-modes button[aria-pressed="true"]{border-color:var(--teal);background:var(--teal);color:#fff}
/* palette : tout visible sur téléphone (3 colonnes, icône à gauche du nom), jamais de défilement de côté */
.rx-palette{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:0 0 8px}
.rx-palette button{min-width:0;border:2px solid var(--line);background:#fff;border-radius:12px;padding:4px 6px 4px 4px;display:flex;align-items:center;gap:6px;color:var(--navy);font-size:12.5px;font-weight:700;line-height:1.12;text-align:left;min-height:44px}
.rx-palette button span.ic{flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--soft);color:var(--teal)}
@media (min-width:560px){.rx-palette{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}
.rx-palette.elec button span.ic{background:#f3f6fb}
/* électricité : choisir le circuit (une couleur chacun), puis l'élément */
.rx-groupes{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px}
.rx-groupes button{border:2px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px 6px 9px;font-weight:800;font-size:14px;color:var(--navy);display:flex;align-items:center;gap:7px}
.rx-groupes button i{flex:none;width:14px;height:14px;border-radius:50%;background:var(--c)}
.rx-groupes button[aria-pressed="true"]{border-color:var(--c);color:var(--c);box-shadow:inset 0 0 0 1px var(--c)}
.rx-circ{margin:6px 0 4px;padding:0;list-style:none}
.rx-circ li{display:flex;gap:8px;align-items:baseline;padding:2px 0}
.rx-circ li i{flex:none;width:12px;height:12px;border-radius:50%;background:var(--c)}
.rx-palette button svg{width:20px;height:20px}
.rx-palette button[aria-pressed="true"]{border-color:var(--teal);background:var(--soft);box-shadow:0 0 0 3px rgba(12,192,223,.25)}
.rx-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rx-actions button{border:2px solid var(--line);background:#fff;color:var(--muted);border-radius:12px;padding:11px 8px;font-weight:800;font-size:15px}
.rx-actions button.fin{grid-column:1/-1;border:0;background:var(--teal);color:#fff}
.rx-actions button:disabled{opacity:.45}
.rx-voile{position:fixed;inset:0;background:rgba(5,46,100,.45);display:none;align-items:flex-end;justify-content:center;z-index:20;padding:0}
.rx-fenetre{background:#fff;width:100%;max-width:560px;max-height:92vh;overflow:auto;border-radius:22px 22px 0 0;padding:20px 18px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(5,46,100,.25)}
@media (min-width:700px){.rx-voile{align-items:center}.rx-fenetre{border-radius:22px}}
.rx-avance{display:flex;gap:6px;margin:0 0 12px}
.rx-avance i{flex:1;height:6px;border-radius:999px;background:var(--line)}
.rx-avance i.on{background:var(--teal)}
.rx-fenetre h2{margin:0 0 6px;color:var(--navy);font-size:23px;font-weight:800;line-height:1.2}
.rx-fenetre p{margin:0 0 12px}
.rx-chapo{color:var(--muted)}
.rx-champ{display:flex;flex-direction:column;gap:6px;margin:0 0 14px;font-weight:700;color:var(--ink)}
.rx-champ input{font:inherit;font-size:20px;font-weight:700;border:2px solid #cfd8e3;border-radius:12px;padding:12px 14px;color:var(--navy);width:100%}
.rx-champ input:focus{outline:0;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(12,192,223,.25)}
.rx-champ small{font-weight:500;color:var(--muted);font-size:14px}
.rx-cartes{display:grid;gap:10px;margin:0 0 14px}
.rx-carte{display:flex;align-items:center;gap:14px;text-align:left;border:2px solid var(--line);background:#fff;border-radius:16px;padding:14px;color:var(--navy)}
.rx-carte .ic{flex:none;display:inline-grid;place-items:center;width:52px;height:52px;border-radius:14px;background:var(--soft);color:var(--teal)}
.rx-carte .ic svg{width:32px;height:32px}
.rx-carte b{display:block;font-size:18px}
.rx-carte small{display:block;color:var(--muted);font-size:14px;font-weight:500}
.rx-carte[aria-pressed="true"]{border-color:var(--teal);background:var(--soft)}
.rx-niveaux{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.rx-niveaux button{border:2px solid #cfd8e3;background:#fff;color:var(--navy);border-radius:999px;padding:9px 16px;font-weight:800}
.rx-niveaux button[aria-pressed="true"]{background:var(--teal);border-color:var(--teal);color:#fff}
.rx-pied{display:flex;gap:10px;margin-top:6px}
.rx-btn{flex:1;border:0;border-radius:14px;background:var(--teal);color:#fff;font-weight:800;font-size:17px;padding:14px}
.rx-btn.sec{flex:0 0 auto;background:#fff;color:var(--muted);border:2px solid var(--line)}
.rx-btn:disabled{opacity:.45}
.rx-note{font-size:14px;color:var(--muted)}
.rx-erreur{background:var(--red-soft);color:var(--red);border-radius:12px;padding:10px 12px;font-weight:700}
.rx-recap{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin:0 0 12px;font-size:15.5px}
.rx-recap b{color:var(--navy)}