:root {
  --page-bg: #FDFDFD;
  --card-bg: #FFFFFF;
  --border: #ECECEC;
  --text: #333333;
  --text-muted: #7A7A7A;
  --action: #00BCD4;
  --action-light: #E0F7FA;
  --accent: #4CAF50;
  --accent-light: #E8F5E9;

  --status-connu: #4CAF50;
  --status-connu-light: #E8F5E9;
  --status-invite: #FF9800;
  --status-invite-light: #FFF3E0;
  --status-inconnu: #9E9E9E;
  --status-inconnu-light: #F0F0F0;
  --status-intrus: #F44336;
  --status-intrus-light: #FDECEA;

  --radius: 16px;
  --shadow: 0 1px 2px rgba(51,51,51,0.04), 0 8px 24px rgba(51,51,51,0.06);
}

* { box-sizing: border-box; }

body {
  background: var(--page-bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  margin: 0;
}

.page { max-width: 1180px; margin: 0 auto; padding: 28px 24px 60px; }

h1 { font-size: 1.5rem; font-weight: 800; color: var(--action); margin: 0 0 4px; letter-spacing: -0.01em; }
h2 { font-size: 1rem; font-weight: 700; color: var(--text); margin: 32px 0 14px; }
.subtitle { color: var(--text-muted); font-size: 0.9rem; margin-bottom: 24px; }

.glass-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}