/* Complète /comptines/style.css (même DA) : seule la grille de photos est nouvelle. */
.galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; }
.oeuvre { background: white; border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--line); }
.oeuvre-photo { display: block; width: 100%; aspect-ratio: 4 / 3; padding: 0; border: 0; border-radius: 0; background: var(--accent-soft); overflow: hidden; }
.oeuvre-photo:hover { background: var(--accent-soft); }
.oeuvre-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.oeuvre-photo .vide { display: grid; place-items: center; height: 100%; font-size: 3rem; }
.oeuvre-corps { padding: 14px 16px 16px; display: grid; gap: 6px; align-content: start; flex: 1; }
.oeuvre .song-open { display: block; width: 100%; }
.oeuvre .tags { margin-top: 4px; }
.tag.idee { background: var(--accent-soft); color: #4537a4; }
.fiche-photo { display: block; width: 100%; max-height: 60dvh; object-fit: contain; background: var(--ground); border-radius: 10px; }
.documents { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.documents li { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; }
.documents a { display: inline-flex; align-items: center; min-height: 46px; }
.consigne { white-space: pre-wrap; overflow-wrap: anywhere; padding: 20px; background: var(--ground); border-radius: 10px; }
.slot { border: 1px solid var(--line); border-radius: 10px; padding: 14px; display: grid; gap: 12px; margin: 0; min-width: 0; }
.slot legend { font-weight: 800; padding: 0 6px; font-size: .9rem; }
@media (max-width: 680px) { .galerie { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .oeuvre-corps { padding: 10px 12px 12px; } .oeuvre .song-title { font-size: .95rem; } }
@media print { .galerie { display: block; } .oeuvre { break-inside: avoid; display: inline-block; width: 31%; margin: 0 1% 14px; vertical-align: top; } .oeuvre-photo { aspect-ratio: auto; } }
