:root{
  --bg:#0a0d0e;
  --surface-0:#10161a;
  --surface-1:#171f23;
  --surface-2:#202a2f;
  --border:#263135;
  --border-strong:#34434a;
  --text-primary:#eaf1f0;
  --text-secondary:#9db0b0;
  --text-muted:#5e7377;
  --accent:#39b3a4;
  --accent-strong:#7fd9cc;
  --accent-bg:#123330;
  --amber:#e8a33d;
  --amber-bg:#3a2d15;
  --red:#e2585d;
  --red-bg:#3a1c1e;
  --blue:#5c93d6;
  --blue-bg:#182a3d;
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --radius:10px;
}
*{box-sizing:border-box;}
html,body{
  margin:0;
  height:100%;
  background:var(--bg);
  color:var(--text-primary);
  font-family:var(--font-sans);
  font-size:14px;
  -webkit-font-smoothing:antialiased;
}
button,input{font-family:inherit;color:inherit;}
ul{list-style:none;margin:0;padding:0;}
.hidden{display:none !important;}

.app{
  position:relative;
  display:flex;
  height:100%;
  width:100%;
  overflow:hidden;
  background:var(--surface-0);
}

/* ---------- rail ---------- */
.rail{
  flex:0 0 auto;
  width:220px;
  background:var(--surface-0);
  border-right:1px solid var(--border);
  display:flex;
  flex-direction:column;
  padding:14px 10px;
  gap:2px;
  transition:width .22s ease;
  z-index:30;
}
.rail.collapsed{width:64px;padding:14px 8px;}
.rail-brand{
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 8px 16px;
  color:var(--text-primary);
}
.rail-brand-mark{
  flex:0 0 auto;
  width:28px;height:28px;
  border-radius:7px;
  background:#fff;
  padding:3px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.rail-brand-mark img{width:100%;height:100%;object-fit:contain;}
.rail-brand-label{
  font-size:13px;
  font-weight:500;
  letter-spacing:.01em;
  white-space:nowrap;
  overflow:hidden;
}
.rail.collapsed .rail-brand-label{display:none;}
.rail-items{display:flex;flex-direction:column;gap:2px;flex:1;}
.rail-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 10px;
  border-radius:8px;
  border:none;
  background:transparent;
  cursor:pointer;
  text-align:left;
  color:var(--text-secondary);
  width:100%;
}
.rail-item:hover{background:var(--surface-1);color:var(--text-primary);}
.rail-item.active{background:var(--accent-bg);color:var(--accent-strong);}
.rail-item svg{flex:0 0 auto;width:18px;height:18px;}
.rail-item span{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.rail.collapsed .rail-item{justify-content:center;padding:9px 0;}
.rail.collapsed .rail-item span{display:none;}
.rail-item .soon{
  margin-left:auto;
  font-size:10px;
  letter-spacing:.04em;
  color:var(--text-muted);
  border:1px solid var(--border-strong);
  border-radius:4px;
  padding:1px 5px;
}
.rail.collapsed .rail-item .soon{display:none;}
.rail-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:8px;
  padding:8px;
  border-radius:8px;
  border:1px solid var(--border);
  background:var(--surface-1);
  color:var(--text-muted);
  cursor:pointer;
}
.rail-toggle:hover{color:var(--text-secondary);border-color:var(--border-strong);}
.rail-toggle svg{width:14px;height:14px;transition:transform .22s ease;flex:0 0 auto;}
.rail.collapsed .rail-toggle svg{transform:rotate(180deg);}
.rail-toggle-label{font-size:12px;}
.rail.collapsed .rail-toggle-label{display:none;}

/* ---------- zone de prospection panel ---------- */
.zone-panel{
  flex:0 0 auto;
  width:296px;
  border-right:1px solid var(--border);
  background:var(--surface-0);
  display:flex;
  flex-direction:column;
  transition:width .22s ease;
  overflow:hidden;
  z-index:20;
}
.zone-panel.collapsed{width:40px;}
.zone-panel[hidden]{display:none;}
.zone-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 16px 12px;
  flex:0 0 auto;
}
.zone-panel.collapsed .zone-panel-head{padding:16px 0 12px;justify-content:center;}
.zone-panel-head h2{margin:0;font-size:14px;font-weight:500;white-space:nowrap;}
.zone-panel.collapsed .zone-panel-head h2{display:none;}
.panel-tabs{display:flex;gap:4px;min-width:0;}
.zone-panel.collapsed .panel-tabs{display:none;}
.panel-tab{
  font-size:12.5px;
  padding:5px 10px;
  border-radius:7px;
  border:1px solid transparent;
  background:transparent;
  color:var(--text-muted);
  cursor:pointer;
  white-space:nowrap;
}
.panel-tab:hover{color:var(--text-secondary);}
.panel-tab.active{background:var(--surface-1);color:var(--text-primary);border-color:var(--border);}

.subtabs{display:flex;gap:4px;margin-bottom:10px;background:var(--surface-1);border-radius:8px;padding:3px;}
.subtab{
  flex:1;font-size:11.5px;padding:6px 8px;border-radius:6px;
  border:none;background:transparent;color:var(--text-muted);cursor:pointer;
}
.subtab:hover{color:var(--text-secondary);}
.subtab.active{background:var(--surface-2);color:var(--text-primary);}
.panel-collapse-btn{
  flex:0 0 auto;
  width:24px;height:24px;
  border-radius:6px;
  border:1px solid var(--border);
  background:var(--surface-1);
  color:var(--text-muted);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
}
.panel-collapse-btn:hover{color:var(--text-secondary);border-color:var(--border-strong);}
.panel-collapse-btn svg{width:12px;height:12px;}
.zone-panel.collapsed .panel-collapse-btn svg{transform:rotate(180deg);}
.zone-panel-body{
  padding:0 16px 16px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.zone-panel.collapsed .zone-panel-body{display:none;}

.zone-create-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:9px 12px;
  border-radius:8px;
  border:1px solid var(--border-strong);
  background:var(--surface-1);
  color:var(--text-secondary);
  font-size:12.5px;
  cursor:pointer;
}
.zone-create-toggle:hover{color:var(--text-primary);border-color:var(--text-muted);}
.zone-create-toggle svg{width:13px;height:13px;transition:transform .18s ease;flex:0 0 auto;}
.zone-create-toggle.expanded svg{transform:rotate(180deg);}
.zone-create-body{display:flex;flex-direction:column;gap:18px;}

.field-label{
  display:block;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--text-muted);
  margin-bottom:6px;
}
.text-input{
  width:100%;
  padding:8px 10px;
  border-radius:7px;
  border:1px solid var(--border-strong);
  background:var(--surface-1);
  color:var(--text-primary);
  font-size:13px;
}
.text-input:focus{outline:none;border-color:var(--accent);}
input[type="range"]{width:100%;accent-color:var(--accent);margin:6px 0 12px;}
.hint{font-size:12px;line-height:1.5;color:var(--text-muted);margin:0;}
.row{display:flex;gap:8px;}
.header-row{justify-content:space-between;align-items:center;margin-bottom:6px;}
.stat{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:5px;}
.stat span{color:var(--text-muted);}

.btn{
  flex:1;
  font-size:12px;
  padding:8px 10px;
  border-radius:7px;
  cursor:pointer;
  text-align:center;
  border:1px solid var(--border-strong);
  background:var(--surface-2);
  color:var(--text-secondary);
}
.btn:hover{color:var(--text-primary);border-color:var(--text-muted);}
.btn-primary{background:var(--accent-bg);border-color:var(--accent);color:var(--accent-strong);}
.btn-primary:hover{color:var(--accent-strong);border-color:var(--accent-strong);}
.btn-secondary{}
.btn-danger{background:transparent;border-color:var(--border-strong);color:var(--red);}
.btn-danger:hover{background:var(--red-bg);border-color:var(--red);color:var(--red);}
.btn-mini{
  flex:0 0 auto;
  font-size:11px;
  padding:4px 8px;
  border-radius:6px;
  border:1px solid var(--border-strong);
  background:var(--surface-2);
  color:var(--text-secondary);
  cursor:pointer;
}
.btn-mini:hover{border-color:var(--accent);color:var(--accent-strong);}
.btn-mini:disabled{opacity:.55;cursor:default;}
.link-btn{
  background:none;
  border:none;
  color:var(--accent-strong);
  font-size:11.5px;
  cursor:pointer;
  padding:0;
}
.link-btn:hover{color:var(--accent);}

.search-results{max-height:150px;overflow-y:auto;margin-top:6px;}
.search-results li{
  padding:6px 8px;
  font-size:12px;
  border-radius:5px;
  cursor:pointer;
  color:var(--text-secondary);
}
.search-results li:hover{background:var(--surface-1);color:var(--text-primary);}

.zones-list{display:flex;flex-direction:column;gap:4px;}
.zone-row{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 9px;
  border-radius:7px;
  border:1px solid transparent;
}
.zone-row:hover{background:var(--surface-1);}
.zone-row.selected{background:var(--amber-bg);border-color:#5a441f;}
.zone-row-dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--text-muted);}
.zone-row.selected .zone-row-dot{background:var(--amber);}
.zone-row-text{flex:1;min-width:0;cursor:pointer;}
.zone-row-name{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}
.zone-row-meta{font-size:11px;color:var(--text-muted);}
.zone-row.selected .zone-row-meta{color:#c9a25f;}
.zone-del{
  flex:0 0 auto;
  width:20px;height:20px;
  border-radius:5px;
  border:none;
  background:transparent;
  color:var(--text-muted);
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;
}
.zone-del:hover{background:var(--red-bg);color:var(--red);}

/* ---------- stage ---------- */
.stage{flex:1 1 auto;position:relative;overflow:hidden;background:var(--bg);min-width:0;}
.page{position:absolute;inset:0;display:none;}
.page.active{display:block;}
#page-zone.active{display:flex;}
#page-prospects.active{display:flex;}
.zone-stage{flex:1 1 auto;position:relative;height:100%;overflow:hidden;min-width:0;}

#map{position:absolute;inset:0;background:#0d1417;z-index:1;}

.empty-state{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;text-align:center;padding:24px;
}
.empty-state-icon{
  width:52px;height:52px;border-radius:14px;
  background:var(--surface-1);border:1px solid var(--border);color:var(--text-muted);
  display:flex;align-items:center;justify-content:center;
}
.empty-state-icon svg{width:24px;height:24px;}
.empty-state h3{margin:0;font-size:16px;font-weight:500;}
.empty-state p{margin:0;max-width:320px;font-size:13px;color:var(--text-muted);line-height:1.6;}
.empty-state .soon-badge{
  font-size:10px;letter-spacing:.05em;text-transform:uppercase;
  color:var(--amber);background:var(--amber-bg);border-radius:5px;padding:3px 8px;
}

.random-pick{
  position:absolute;inset:0;overflow-y:auto;
  display:flex;flex-direction:column;align-items:center;
  gap:14px;text-align:center;padding:40px 24px;
}
.random-pick h3{margin:0;font-size:16px;font-weight:500;}
.random-pick > p{margin:0;max-width:340px;font-size:13px;color:var(--text-muted);line-height:1.6;}
.random-pick-body{
  display:flex;flex-direction:row;flex-wrap:wrap;
  gap:24px;justify-content:center;
  width:100%;max-width:900px;
}
.random-pick-form{
  display:flex;flex-direction:column;gap:12px;
  width:100%;max-width:280px;text-align:left;
  flex:0 0 auto;
}
#randomPickStatus{min-height:16px;}
#randomPickStatus.error{color:var(--red);}

.random-pick-map-wrap{
  flex:1 1 420px;max-width:520px;min-width:280px;
  display:flex;flex-direction:column;gap:6px;text-align:left;
}
.random-pick-map{
  width:100%;height:480px;border-radius:10px;
  border:1px solid var(--border-strong);background:#0d1417;
  z-index:1;
}
.random-pick-map .leaflet-container{border-radius:10px;font-family:inherit;}
#pickMapHint{margin:0;text-align:center;}

.commune-list{
  max-height:220px;overflow-y:auto;
  display:flex;flex-direction:column;gap:2px;
  border:1px solid var(--border-strong);border-radius:7px;
  padding:4px;margin-top:2px;
}
.commune-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:7px 8px;border-radius:5px;cursor:pointer;font-size:12.5px;
  color:var(--text-secondary);
}
.commune-row:hover{background:var(--surface-1);color:var(--text-primary);}
.commune-row.selected{background:var(--amber-bg);color:var(--amber);}
.commune-row-pop{font-size:11px;color:var(--text-muted);flex:0 0 auto;}
.commune-row.selected .commune-row-pop{color:#c9a25f;}
.commune-row-empty{padding:7px 8px;font-size:12px;color:var(--text-muted);}

.map-toolbar{
  position:absolute;left:16px;bottom:16px;z-index:15;
  display:flex;gap:6px;
  background:var(--surface-1);border:1px solid var(--border);border-radius:8px;padding:4px;
}
.map-toolbar button{
  border:none;background:transparent;color:var(--text-muted);
  font-size:12px;padding:6px 10px;border-radius:6px;cursor:pointer;
}
.map-toolbar button.active{background:var(--surface-2);color:var(--text-primary);}

.map-hint{
  position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:15;
  background:var(--surface-1);border:1px solid var(--accent);color:var(--accent-strong);
  font-size:12px;padding:7px 14px;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.35);
}

/* ---------- houses column (fixed, full height) ---------- */
.houses-column{
  flex:0 0 auto;
  width:320px;
  height:100%;
  display:flex;
  flex-direction:column;
  background:var(--surface-0);
  border-left:1px solid var(--border);
  transition:width .22s ease;
  overflow:hidden;
  z-index:25;
}
.houses-column.collapsed{width:56px;}
.panel-head{
  display:flex;align-items:center;gap:8px;
  padding:14px 14px 12px;flex:0 0 auto;border-bottom:1px solid var(--border);
}
.houses-column.collapsed .panel-head{padding:14px 0 12px;justify-content:center;border-bottom:none;}
.panel-head-text{flex:1;min-width:0;}
.houses-column.collapsed .panel-head-text{display:none;}
.panel-head h2{margin:0;font-size:13.5px;font-weight:500;}
.panel-head .count{font-size:11px;color:var(--text-muted);}
.city-pick-badge{
  margin-top:4px;font-size:10.5px;letter-spacing:.02em;
  color:var(--accent-strong);background:var(--accent-bg);
  border-radius:5px;padding:2px 7px;display:inline-block;
}
.city-pick-more-btn{margin:0 14px 12px;width:calc(100% - 28px);}
.panel-body{flex:1 1 auto;overflow-y:auto;padding:6px;}
.houses-column.collapsed .panel-body{display:none;}
.houses-column.collapsed .panel-collapse-btn svg{transform:rotate(-90deg);}
.panel-body .hint{padding:10px 8px;}

.street-header{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  padding:9px 8px 4px;font-size:10.5px;text-transform:uppercase;
  letter-spacing:.04em;color:var(--text-muted);
}
.street-add{
  flex:0 0 auto;width:16px;height:16px;border-radius:4px;border:none;background:transparent;
  color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;
  text-transform:none;letter-spacing:normal;
}
.street-add:hover{background:var(--accent-bg);color:var(--accent-strong);}
.street-add svg{width:11px;height:11px;}
.prospect-row{
  display:flex;align-items:center;gap:6px;padding:7px 8px;border-radius:7px;cursor:pointer;
}
.prospect-row:hover{background:var(--surface-1);}
.prospect-row.selected{background:var(--amber-bg);}
.prospect-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;}
.prospect-addr{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.prospect-row.no-address .prospect-addr{color:var(--red);}
.prospect-tag{font-size:10.5px;color:var(--text-muted);}
.prospect-open-badges{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px;}
.prospect-render-badge{font-size:10.5px;color:var(--accent-strong);}
.prospect-del{
  flex:0 0 auto;width:20px;height:20px;border-radius:5px;border:none;background:transparent;
  color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.prospect-del:hover{background:var(--red-bg);color:var(--red);}
.prospect-del svg{width:12px;height:12px;}

/* ---------- building tab content (inside the zone panel) ---------- */
.building-address{margin:0;font-size:13px;color:var(--text-primary);}
.building-address-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;}
.building-address-row .building-address{margin:0;flex:1;min-width:0;}
.building-address-row .link-btn{flex:0 0 auto;white-space:nowrap;}
.address-edit{margin-bottom:10px;}
.building-extra-info{resize:vertical;min-height:44px;margin-top:10px;font-family:inherit;}
.building-generate-btn{width:100%;margin-top:10px;}
.building-generate-btn:disabled{opacity:.6;cursor:default;}
.building-render-img{display:block;width:100%;border-radius:8px;margin-top:10px;}
.building-field{
  display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;
  border-bottom:1px solid var(--border);font-size:12.5px;
}
.building-field:last-of-type{border-bottom:none;}
.building-field span{color:var(--text-muted);}
.building-field strong{font-weight:500;text-align:right;display:flex;align-items:center;gap:6px;justify-content:flex-end;}
.field-edit-link{font-size:11px;}
.field-input{
  font-size:12px;padding:4px 6px;border-radius:5px;
  border:1px solid var(--border-strong);background:var(--surface-1);color:var(--text-primary);
}
input.field-input{width:70px;}
.building-flags{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0;}
.building-flags:empty{margin:0;}
.flag{font-size:10.5px;padding:3px 8px;border-radius:5px;}
.flag.warn{background:var(--red-bg);color:var(--red);}
.flag.edited{background:var(--blue-bg);color:#8fb6e8;}
.building-actions{display:flex;gap:8px;margin-top:10px;}
.building-nav{
  display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--border);
}
.building-nav button{
  flex:0 0 auto;background:none;border:none;color:var(--text-muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:6px;
}
.building-nav button:hover{background:var(--surface-1);color:var(--text-primary);}
.building-nav button svg{width:14px;height:14px;}
.building-nav .pos{flex:1;text-align:center;font-size:11.5px;color:var(--text-muted);font-variant-numeric:tabular-nums;}

/* ---------- leaflet edit handles ---------- */
.vertex-handle{
  width:12px;height:12px;background:var(--amber);border:2px solid #10161a;
  border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.6);cursor:grab;
}
.mid-handle{
  width:9px;height:9px;background:#10161a;border:2px solid var(--amber);
  border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.5);cursor:copy;opacity:.9;
}
.edge-handle{
  width:10px;height:10px;background:var(--blue);border:2px solid #10161a;
  border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.5);cursor:ew-resize;
}

/* ---------- "Choix aléatoire" : révélation maison par maison sur la carte
   pendant le scan (cf. app.js playRevealQueue) ---------- */
@keyframes reveal-pop{
  0%{transform:scale(0);opacity:0;}
  60%{transform:scale(1.15);opacity:1;}
  100%{transform:scale(1);opacity:1;}
}
.reveal-marker{
  width:30px;height:30px;border-radius:50%;
  background:var(--accent-bg);border:2px solid var(--accent);
  box-shadow:0 0 0 4px rgba(57,179,164,.18),0 4px 14px rgba(0,0,0,.45);
  display:flex;align-items:center;justify-content:center;
  animation:reveal-pop .38s cubic-bezier(.34,1.56,.64,1);
}
.reveal-marker svg{width:16px;height:16px;color:var(--accent-strong);}

.search-status-hint{
  position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:15;
  background:var(--surface-1);border:1px solid var(--accent);color:var(--accent-strong);
  font-size:12px;padding:7px 14px;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.35);
  display:flex;align-items:center;gap:8px;
}
.search-status-hint .spinner{
  width:12px;height:12px;border-radius:50%;
  border:2px solid var(--accent-bg);border-top-color:var(--accent-strong);
  animation:search-spin .7s linear infinite;flex:0 0 auto;
}
@keyframes search-spin{to{transform:rotate(360deg);}}
.search-status-hint.error{border-color:var(--red);color:var(--red);}
.search-status-hint.error .spinner{display:none;}

/* ---------- leaflet dark repaint ---------- */
.leaflet-container{background:#0d1417;}
.leaflet-control-attribution{background:rgba(16,22,26,.75) !important;color:var(--text-muted) !important;}
.leaflet-control-attribution a{color:var(--text-secondary) !important;}
.leaflet-bar a{background:var(--surface-1) !important;color:var(--text-secondary) !important;border-color:var(--border) !important;}
.leaflet-bar a:hover{background:var(--surface-2) !important;color:var(--text-primary) !important;}
.leaflet-tooltip{
  background:var(--surface-2) !important;color:var(--text-primary) !important;
  border:1px solid var(--border) !important;box-shadow:none !important;
}
.leaflet-popup-content-wrapper{
  background:var(--surface-1) !important;color:var(--text-primary) !important;
  border:1px solid var(--border-strong) !important;box-shadow:0 6px 18px rgba(0,0,0,.4) !important;
}
.leaflet-popup-tip{background:var(--surface-1) !important;box-shadow:none !important;}
.leaflet-popup-close-button{color:var(--text-muted) !important;}
.map-adding-house .leaflet-container{cursor:crosshair;}

/* ---------- carte postale (recto/verso) ---------- */
.postcard-stage{position:absolute;inset:0;}
.postcard-content{display:flex;height:100%;}

.postcard-house-list{
  flex:0 0 260px;border-right:1px solid var(--border);
  padding:16px;overflow-y:auto;
}
.postcard-house-list h2{margin:0 0 4px;font-size:13.5px;font-weight:500;}
.postcard-house-list .count{font-size:11px;color:var(--text-muted);margin-bottom:12px;}
.postcard-house-ul{display:flex;flex-direction:column;gap:2px;}
.postcard-house-row{
  display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:7px;cursor:pointer;
}
.postcard-house-row:hover{background:var(--surface-1);}
.postcard-house-row.selected{background:var(--amber-bg);}
.postcard-house-row.no-render{opacity:.4;cursor:default;}
.postcard-house-dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--text-muted);}
.postcard-house-row:not(.no-render) .postcard-house-dot{background:var(--accent-strong);}
.postcard-house-addr{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.postcard-preview{
  flex:1 1 auto;overflow:auto;
  display:flex;flex-direction:column;gap:16px;align-items:center;justify-content:center;
  padding:20px 24px;
}
.postcard-pair{
  display:flex;flex-direction:row;flex-wrap:wrap;gap:22px;
  align-items:flex-start;justify-content:center;
}
.postcard-card-wrap{display:flex;flex-direction:column;align-items:center;gap:6px;width:320px;max-width:90vw;}
.postcard-card-label{margin:0;font-size:10.5px;color:var(--text-muted);text-align:center;}
.postcard-card-controls{width:100%;}
.postcard-qr-input{font-size:11.5px;padding:6px 8px;}
.postcard-card{
  width:320px;max-width:90vw;aspect-ratio:1.41/1;border-radius:14px;
  background:#fdfdfb;color:#1c1c1c;box-shadow:0 16px 40px rgba(0,0,0,.5);
  position:relative;overflow:hidden;flex:0 0 auto;
}
.postcard-recto{padding:0;}
.postcard-recto img{width:100%;height:100%;object-fit:cover;display:block;}
.postcard-verso{padding:18px;}
.postcard-message-input-full{
  width:100%;height:100%;border:none;resize:none;background:transparent;
  color:#1c1c1c;font-family:var(--font-sans);font-size:11px;line-height:1.6;outline:none;
  padding-right:84px;
}
.postcard-verso-qr{
  position:absolute;bottom:14px;right:14px;
  display:flex;flex-direction:column;align-items:center;gap:4px;
}
.postcard-qr-svg{width:60px;height:60px;}
.postcard-qr-svg svg,.postcard-qr-svg table{width:100%;height:100%;display:block;}
.postcard-qr-caption{font-size:7px;color:#7a7a74;max-width:66px;text-align:center;line-height:1.25;}

.postcard-send-bar{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  width:100%;margin-top:0;
}
.postcard-send-status{font-size:11.5px;color:var(--text-muted);}

/* ---------- prospects (cartes postales envoyées) ---------- */
.prospects-stage{flex:1 1 auto;position:relative;height:100%;min-width:0;display:flex;flex-direction:column;overflow:hidden;}
.prospects-topbar{padding:20px 28px 0;}
.prospects-search{max-width:320px;}
.prospects-breadcrumb{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:14px 28px 0;font-size:12.5px;color:var(--text-muted);
}
.prospects-breadcrumb button{background:none;border:none;color:var(--accent-strong);cursor:pointer;font-size:12.5px;padding:0;}
.prospects-breadcrumb button:hover{color:var(--accent);}
.prospects-breadcrumb .crumb-sep{color:var(--text-muted);}
.prospects-breadcrumb .crumb-current{color:var(--text-primary);}

.prospects-scroll{flex:1 1 auto;overflow:auto;padding:16px 28px 32px;}
.prospects-list{max-width:640px;}
.prospects-list .zone-row{cursor:pointer;}
.prospects-row-count{flex:0 0 auto;font-size:11px;color:var(--text-muted);}
.prospects-row-badges{flex:0 0 auto;display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end;max-width:55%;}

.prospects-detail{display:flex;gap:32px;align-items:flex-start;max-width:920px;}

.prospects-detail-media{width:320px;flex:0 0 auto;display:flex;flex-direction:column;gap:10px;}
.prospects-detail-imgwrap{position:relative;width:100%;}
.prospects-detail-imgwrap .postcard-card-wrap{width:100%;gap:0;}
.prospects-detail-imgwrap .postcard-card{width:100%;border-radius:12px;box-shadow:0 10px 28px rgba(0,0,0,.4);}
.prospects-img-toggle{
  position:absolute;bottom:10px;left:50%;transform:translateX(-50%);
  display:flex;gap:2px;padding:3px;border-radius:20px;
  background:rgba(10,12,12,.72);backdrop-filter:blur(4px);
}
.prospects-img-toggle-btn{
  border:none;background:none;color:var(--text-muted);font-size:10.5px;
  padding:5px 10px;border-radius:16px;cursor:pointer;
}
.prospects-img-toggle-btn.active{background:var(--accent-bg);color:var(--accent-strong);}
.prospects-detail-links{display:flex;flex-direction:column;gap:6px;}
.prospects-detail-links .btn-mini{width:100%;box-sizing:border-box;text-decoration:none;text-align:center;}

.prospects-detail-info{flex:1;min-width:280px;display:flex;flex-direction:column;gap:14px;padding-top:4px;}
.prospects-detail-info h3{margin:0;font-size:16px;font-weight:500;}
.prospects-detail-info .field-label{margin:0 0 -6px;}

.prospects-detail-meta{display:flex;flex-wrap:wrap;gap:8px;}
.prospects-meta-chip{
  font-size:11.5px;color:var(--text-muted);background:var(--surface-2);
  border:1px solid var(--border);border-radius:20px;padding:4px 11px;
}
.prospects-meta-chip b{color:var(--text-primary);font-weight:500;}

.status-badge{
  flex:0 0 auto;padding:2px 9px;border-radius:20px;font-size:10.5px;white-space:nowrap;
}
.status-envoye{background:var(--blue-bg);color:var(--blue);}
.status-formulaire_repondu,.status-client_appele{background:var(--amber-bg);color:var(--amber);}
.status-rdv_confirme,.status-rdv_effectue{background:var(--amber-bg);color:var(--amber);}
.status-devis_envoye,.status-devis_signe{background:var(--accent-bg);color:var(--accent-strong);}
.status-cloture{background:var(--surface-2);color:var(--text-muted);}

.prospects-status-checks{
  display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:0;padding:0;list-style:none;
}
.prospects-status-check{
  display:flex;align-items:center;gap:7px;font-size:12px;cursor:pointer;
}
.prospects-status-check input{accent-color:var(--accent);width:14px;height:14px;flex:0 0 auto;}

/* colonne "notification" : nombre de réponses au formulaire pas encore
   lues, sous la maison directement ou agrégé sur sa zone/son département */
.prospects-notif-badge{
  flex:0 0 auto;min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:var(--red-bg);color:var(--red);font-size:10.5px;font-weight:600;
  display:flex;align-items:center;justify-content:center;
}

.prospects-contacts-empty,.prospects-notes-empty{font-size:12px;color:var(--text-muted);margin:0;}
.prospects-contacts-list{
  display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto;
  margin:0;padding:0;list-style:none;
}
.prospects-contact-card{
  border:1px solid var(--border);border-radius:8px;padding:8px 10px;font-size:12px;
  background:var(--surface-1);position:relative;
}
.prospects-contact-card.unread{border-color:var(--accent);}
.prospects-contact-head{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.prospects-contact-name{font-weight:500;display:flex;align-items:center;gap:6px;}
.prospects-contact-name .prospects-new-dot{
  width:6px;height:6px;border-radius:50%;background:var(--accent);flex:0 0 auto;
}
.prospects-contact-date{color:var(--text-muted);font-size:11px;white-space:nowrap;}
.prospects-contact-meta{color:var(--text-secondary);margin-top:3px;}
.prospects-contact-message{color:var(--text-secondary);margin-top:5px;line-height:1.4;}

/* journal de suivi : historique façon fil de discussion, saisi à la main
   (cf. add_prospect_note côté serveur) — sous les réponses au formulaire */
.prospects-notes-list{
  display:flex;flex-direction:column;gap:6px;max-height:200px;overflow-y:auto;
  margin:0;padding:0;list-style:none;
}
.prospects-note-card{
  background:var(--surface-1);border:1px solid var(--border);border-radius:8px;
  padding:7px 10px;font-size:12px;color:var(--text-secondary);
}
.prospects-note-date{display:block;color:var(--text-muted);font-size:10.5px;margin-bottom:2px;}
.prospects-note-form{display:flex;gap:8px;align-items:flex-end;}
.prospects-note-form textarea{
  flex:1;resize:none;font-family:var(--font-sans);font-size:12px;line-height:1.4;
  padding:7px 9px;border-radius:7px;border:1px solid var(--border-strong);
  background:var(--surface-2);color:var(--text-primary);
}
.prospects-note-form textarea:focus{outline:none;border-color:var(--accent);}
.prospects-note-form .btn-mini{flex:0 0 auto;}

/* ---------- ajout manuel d'une maison (popup carte) ---------- */
.add-house-popup{width:230px;font-size:12.5px;}
.add-house-popup h4{margin:0 0 8px;font-size:12px;font-weight:500;color:var(--text-secondary);}
.add-house-suggestions{list-style:none;margin:0 0 8px;padding:0;max-height:110px;overflow-y:auto;}
.add-house-suggestions li{
  padding:5px 7px;border-radius:5px;cursor:pointer;color:var(--text-secondary);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.add-house-suggestions li:hover{background:var(--surface-2);color:var(--text-primary);}
.add-house-suggestions li.chosen{background:var(--accent-bg);color:var(--accent-strong);}
.add-house-popup .text-input{margin-bottom:8px;font-size:12.5px;padding:6px 8px;}
.add-house-actions{display:flex;gap:6px;}
.add-house-actions .btn{padding:6px 8px;font-size:11.5px;}