/* Composants UI génériques – scoped to .btn only so raw <button> elements
   (map controls, collapsible headers, etc.) are not accidentally coloured. */
.btn {
  background: var(--primary-color);
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: background 0.2s;
}
.btn:hover {
  background: var(--accent-color);
}
input, select, textarea {
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 0.5rem;
  font-family: inherit;
}
..popup {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.debug-overlay {
  background: #222;
  color: #fff;
  font-size: 0.9em;
  padding: 0.5rem;
}

/* First-aid (PSC1) */
.firstaid-intro { font-size: 14px; }
.firstaid-card { background: linear-gradient(180deg,#fff,#fbfbfb); border:1px solid #eee; border-radius:8px; padding:10px 12px; margin-bottom:8px; box-shadow: 0 1px 0 rgba(0,0,0,0.02); }
.firstaid-card h3 { margin:0 0 6px 0; font-size:14px; }
.firstaid-card p { margin:0; font-size:13px; color:var(--text-secondary); line-height:1.35; }
.beat-indicator { width:36px; height:36px; border-radius:50%; border:2px solid var(--accent); margin:6px 0; background:transparent; transition: transform 120ms ease, background 120ms ease; }
.beat-indicator.active { background: var(--accent); transform: scale(1.08); }

/* Landing page overlay (mobile-first) */
.landing-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.45); display: none; align-items: center; justify-content: center; z-index: 1200; }
.landing-overlay.visible { display: flex; }
.landing-panel { width: min(720px, 96%); max-width: 720px; background: var(--bg); border-radius: 12px; padding: 18px; box-shadow: 0 20px 40px rgba(0,0,0,0.35); text-align: left; }
.landing-close { position: absolute; right: 18px; top: 18px; background:transparent; border:none; font-size:20px; cursor:pointer; color:var(--text-muted); }
.landing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 14px; }
.landing-btn { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding: 12px; background: linear-gradient(180deg,#fff,#f7f7fb); border-radius:10px; border:1px solid #eee; cursor:pointer; min-height:92px; }
.landing-btn .landing-ico { font-size:28px; }
.landing-btn .landing-label { font-size:13px; color:var(--text-secondary); }
@media (max-width:640px) { .landing-grid { grid-template-columns: repeat(2, 1fr); } .landing-panel { padding:14px; } }