/* La salle du dimanche : le commissaire-priseur derrière son pupitre, le carton du lot où les offres montent,
   « une fois… deux fois… adjugé ! » puis le tampon VENDU. À côté, le vrai règlement de la salle, en avis imprimé. */
.salle-in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(24px, 4vw, 54px); align-items: start; }
.salle-scene { position: relative; padding-bottom: 36px; }
.commissaire { margin: 0; position: relative; z-index: 1; width: 72%; }
.commissaire img { width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 20%; border: 8px solid var(--carte);
  box-shadow: 0 0 0 1px var(--ligne), 0 18px 26px -18px rgba(43, 35, 28, .7); transform: rotate(-2deg); }
.commissaire figcaption { font-family: var(--etiquette); font-size: 14px; color: var(--doux); margin-top: 10px; text-align: center; }
.lot { position: absolute; right: 0; bottom: 0; width: 46%; z-index: 2; background: var(--carte); padding: 16px 16px 18px;
  box-shadow: 0 0 0 1px var(--ligne), 0 20px 30px -20px rgba(43, 35, 28, .8); transform: rotate(1.5deg); }
.lot.secousse { animation: secousse .35s ease; }
.lot-tete { display: flex; justify-content: space-between; align-items: baseline; font-family: var(--etiquette); font-size: 14px; color: var(--doux);
  border-bottom: 1px solid var(--ligne); padding-bottom: 6px; }
.lot-tete b { font-family: var(--titre); font-weight: 400; font-size: 20px; color: var(--encre); }
.lot img { height: 118px; width: auto; margin: 10px auto 6px; }
.lot-nom { font-family: var(--titre); font-size: 17px; text-align: center; margin: 0 0 8px; }
.offres { list-style: none; margin: 0; padding: 0; font-size: 15px; min-height: 104px; }
.offres li { display: flex; justify-content: space-between; gap: 8px; padding: 3px 0; border-bottom: 1px dotted var(--ligne); color: var(--doux);
  animation: offre-entre .4s ease both; }
.offres li:last-child { color: var(--encre); font-weight: 700; }
.offres li b { font-family: var(--etiquette); font-weight: 600; }
.crieur { font-family: var(--titre); color: var(--brique); font-size: 20px; text-align: center; min-height: 1.3em; margin: 10px 0 0; }
.lot .tampon { position: absolute; left: 50%; top: 42%; font-size: 34px; margin-left: -80px; opacity: 0; pointer-events: none; }
.lot.adjuge .tampon { animation: coup-vendu .45s cubic-bezier(.3, 1.6, .5, 1) both; }
.demo { display: inline-block; font-family: var(--etiquette); font-size: 13px; letter-spacing: .04em; color: var(--carte); background: var(--doux);
  padding: 2px 8px; margin-bottom: 10px; }
.avis { background: var(--carte); padding: clamp(22px, 3vw, 34px); position: relative;
  box-shadow: inset 0 0 0 1px var(--ligne), inset 0 0 0 6px var(--carte), inset 0 0 0 7px var(--encre); }
.avis h3 { text-align: center; font-size: clamp(22px, 2.4vw, 30px); }
.avis .ar-texte { display: block; text-align: center; color: var(--brique); font-size: 22px; margin: 2px 0 12px; }
.avis ol { margin: 0; padding: 0; list-style: none; counter-reset: art; }
.avis li { counter-increment: art; padding: 10px 0 10px 54px; position: relative; border-top: 1px solid var(--ligne); }
.avis li::before { content: "Art. " counter(art); position: absolute; left: 0; top: 12px; font-family: var(--etiquette); font-size: 13px; color: var(--brique);
  font-weight: 600; }
.avis .boutons { margin-top: 18px; }
@keyframes offre-entre { from { opacity: 0; transform: translateX(-10px); } }
@keyframes coup-vendu { from { opacity: 0; transform: rotate(-14deg) scale(2); } to { opacity: 1; transform: rotate(-14deg) scale(1); } }
@keyframes secousse { 30% { transform: rotate(1.5deg) translateY(4px); } 60% { transform: rotate(1.5deg) translateY(-2px); } }

@media (max-width: 960px) {
  .salle-in { grid-template-columns: minmax(0, 1fr); }
  .salle-scene { max-width: 620px; }
}
@media (max-width: 520px) {
  .salle-scene { padding-bottom: 0; }
  .commissaire { width: 78%; }
  .commissaire figcaption { position: absolute; left: 10px; top: 12px; margin: 0; background: var(--carte); padding: 2px 8px; font-size: 13px;
    transform: rotate(-3deg); box-shadow: 0 0 0 1px var(--ligne); }
  .lot { position: relative; right: auto; bottom: auto; width: 72%; margin: -96px 0 0 auto; padding: 12px 12px 14px; }
  .lot img { height: 80px; }
  .offres { font-size: 14px; min-height: 92px; }
}