.lcdh-account {
  background: #fff;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 6px 24px rgba(0,0,0,.06);
  margin: 16px 0 24px;
}

.lcdh-account__header {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 8px;
}

.lcdh-h2 {
  margin: 0;
  font-size: clamp(20px, 2.4vw, 28px);
  font-weight: 700;
  letter-spacing: .2px;
}

.lcdh-name { color: #000000 !important; }

.lcdh-logout {
  font-size: 14px;
  opacity: .85;
  text-decoration: none;
  border: 1px solid #e6e6e6;
  padding: 6px 10px;
  border-radius: 10px;
  transition: transform .12s ease, background .2s ease, opacity .2s ease;
}
.lcdh-logout:hover,
.lcdh-logout:focus-visible {
  background:#f6f6f6;
  transform: translateY(-1px);
  opacity:1;
  outline: none;
}

.lcdh-intro {
  margin: 0 0 14px;
  color: #555;
}

.lcdh-grid {
  display: grid;
  grid-template-columns: repeat( auto-fit, minmax(190px, 1fr) );
  gap: 14px;
  margin-top: 6px;
}

.lcdh-tile {
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 4px;
  padding: 16px;
  border: 1px solid #eaeaea;
  border-radius: 16px;
  text-decoration: none;
  background: #fcfcfc;
  transition: transform .12s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
  color: inherit;
}
.lcdh-tile:hover,
.lcdh-tile:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,.06);
  border-color: #dcdcdc;
  outline: none;
}

.lcdh-emoji { font-size: 22px; line-height: 1; }
.lcdh-title { font-weight: 700; color: #1f2937; }
.lcdh-desc { font-size: 13px; color: #6b7280; }

.lcdh-tile--ghost {
  background: #fff;
  border-style: dashed;
  opacity: .95;
}

/* État actif (onglet courant) */
.lcdh-tile.is-active {
  background: #000000 !important;
  color: #fff !important;
  border-color: #000000 !important;
}
.lcdh-tile.is-active .lcdh-title,
.lcdh-tile.is-active .lcdh-desc,
.lcdh-tile.is-active .lcdh-emoji {
  color: #fff !important;
}

/* Responsive */
@media (max-width: 480px) {
  .lcdh-account { padding: 18px; border-radius: 14px; }
  .lcdh-grid { gap: 10px; }
  .lcdh-tile { padding: 14px; border-radius: 14px; }
}
