*{box-sizing:border-box} 
body {
  margin: 0;
  padding: 0;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: #fafafa;
  color: #333;
  overflow: hidden;
}

#modeIndicator {
  position: fixed;
  top: 70px;
  left: 50%;
  transform: translateX(-50%);
  background: #2e7d32;
  color: white;
  padding: 8px 16px;
  border-radius: 20px;
  font-weight: 600;
  font-size: 14px;
  z-index: 1000;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.ctx-menu {
  background: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 4px 16px rgba(0,0,0,0.15);
  padding: 4px;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 180px;
}
.ctx-menu button {
  background: #f5f5f5;
  border: none;
  padding: 6px 10px;
  text-align: left;
  border-radius: 4px;
  cursor: pointer;
  font-size: 13px;
}
.ctx-menu button:hover {
  background: #e0e0e0;
}
.ctx-menu button[disabled] {
  opacity: .4;
  cursor: default;
}

header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,0,0,0.1);position:sticky;top:0;z-index:100;box-shadow:0 4px 6px rgba(0,0,0,0.1)}

h1{font-size:24px;margin:0;font-weight:700;background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

.toolbar{display:flex;align-items:center;gap:12px}
.toolbar button{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);color:white;border:none;border-radius:8px;padding:8px 14px;font-weight:600;font-size:14px;cursor:pointer;transition:all 0.2s ease;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
.toolbar button:hover{transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,0.2);background:linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);color:#fff}
.toolbar button:active{transform:translateY(0);background:linear-gradient(135deg, #4338ca 0%, #6d28d9 100%);color:#fff}

.toolbar label{color:#374151;font-weight:500;font-size:14px}
.toolbar input[type="range"]{width:80px;accent-color:#4f46e5}

main{display:flex;height:calc(100vh - 76px);min-width:0;overflow:hidden}
#canvasWrap{flex:1 1 auto;min-width:0;position:relative;background:linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);padding:0 !important;margin:0;border:none;border-radius:0;box-shadow:none}

/* Canvas plein écran quand modal fermé, avec panneau réservé quand ouvert */
#properties{width:300px;flex-shrink:0}
body:not(.properties-open) #properties{
	width:0;
	visibility:hidden;
	opacity:0;
	pointer-events:none;
	overflow:hidden;
	display:none;
	border-left:0;
	padding:0;
	box-shadow:none;
	background:transparent;
}
body.properties-open #properties{display:block}
body.properties-open #canvasWrap{flex:1}

#sidebar{width:320px;flex:0 0 320px;overflow:auto;border-right:1px solid rgba(0,0,0,0.1);background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);padding:20px;box-shadow:2px 0 10px rgba(0,0,0,0.1)}

#canvasWrap{flex:1 1 auto;min-width:0;position:relative;background:linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%)}

#properties{width:300px;border-left:1px solid rgba(0,0,0,0.1);background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);padding:20px;overflow:auto;box-shadow:-2px 0 10px rgba(0,0,0,0.1)}
#properties h3{margin:0 0 16px 0;font-size:18px;font-weight:700;color:#1a202c}
#properties label{display:block;margin-bottom:12px;font-weight:500;color:#374151}
#properties input{width:100%;padding:8px 12px;margin-top:4px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;transition:border-color 0.2s ease}
#properties input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px rgba(79,70,229,0.1)}
#properties select.styled-select{width:100%;padding:8px 12px;margin-top:4px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;background:white;color:#374151;transition:all 0.2s ease;cursor:pointer}
#properties select.styled-select:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px rgba(79,70,229,0.1)}
#properties select.styled-select:hover{border-color:#9ca3af;background:#f9fafb}

#c{width:100%;height:100%;cursor:crosshair;display:block;margin:0;border:none;outline:none;border-radius:0;box-shadow:none;background:transparent}

section{margin-bottom:24px;background:white;border-radius:12px;padding:16px;box-shadow:0 2px 4px rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.05)}
section h2{font-size:18px;margin:0 0 12px 0;font-weight:700;color:#1a202c}
section p{color:#6b7280;margin:0 0 12px 0;font-size:14px}

label{display:inline-flex;align-items:center;margin-right:12px;gap:8px;font-size:14px;font-weight:500;color:#374151}
input[type=number],input[type=text]{width:90px;padding:6px 10px;border:2px solid #e5e7eb;border-radius:6px;font-size:14px;transition:border-color 0.2s ease}
input[type=number]:focus,input[type=text]:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px rgba(79,70,229,0.1)}

button{display:inline-flex;align-items:center;gap:8px;cursor:pointer;border:2px solid #e5e7eb;background:white;border-radius:8px;padding:8px 16px;font-weight:600;font-size:14px;transition:all 0.2s ease;color:#374151}
button:hover{background:#f9fafb;border-color:#d1d5db;transform:translateY(-1px)}
button:active{transform:translateY(0)}
button svg{display:block}

.add-wall-item,.row button{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg, #10b981 0%, #059669 100%);color:white;border:none}
.add-wall-item:hover,.row button:hover{background:linear-gradient(135deg, #059669 0%, #047857 100%)}

#propApply{background:linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);color:white;border:none}
#propApply:hover{background:linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%)}

#propDelete{background:linear-gradient(135deg, #ef4444 0%, #dc2626 100%);color:white;border:none}
#propDelete:hover{background:linear-gradient(135deg, #dc2626 0%, #b91c1c 100%)}

#propClose{background:linear-gradient(135deg, #6b7280 0%, #4b5563 100%);color:white;border:none;padding:6px 10px;font-size:12px;border-radius:6px}

.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0}

ul{margin:8px 0 0 20px;color:#6b7280}
ul li{margin-bottom:4px}
ul b{color:#374151}

/* Suggestions recherche meubles */
.suggestions{position:relative;margin-top:6px;border:1px solid #e5e7eb;border-radius:8px;background:white;max-height:160px;overflow:auto;box-shadow:0 4px 12px rgba(0,0,0,0.08);font-size:13px}
.suggestions.hidden{display:none}
.suggestions-item{padding:6px 10px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px}
.suggestions-item:hover{background:#f1f5f9}
.suggestions-item b{font-weight:600;color:#111827}
.suggestions-item small{font-size:11px;color:#64748b}

/* Textures canvas (générées en JS) aucune règle ici mais placeholder */

/* Status & toggles */
#systemStatus .status-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.3px;background:#e5e7eb;color:#374151;border:1px solid #d1d5db;transition:.2s}
.badge.on{background:#dcfce7;color:#166534;border-color:#16a34a}
.badge.off{background:#fee2e2;color:#991b1b;border-color:#dc2626}
.mini-toggle{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:#374151;background:#f1f5f9;padding:4px 8px;border-radius:6px;border:1px solid #e2e8f0}
.mini-toggle input{accent-color:#4f46e5;cursor:pointer}
.hint{display:block;margin-top:4px;color:#64748b;font-size:11px}

footer{padding:12px 20px;border-top:1px solid rgba(0,0,0,0.1);background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);text-align:center;color:#6b7280;font-size:14px}

/* Mesure hint (dessiné sur canvas, pas d'élément DOM dédié) */