/* Système 3-6-9 des spares */
.spares-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem; }
@media (max-width: 800px) { .spares-grid { grid-template-columns: 1fr; } }
.pin-rack { direction: ltr; display: grid; grid-template-columns: repeat(7, minmax(0, 3.2rem)); grid-template-rows: repeat(4, 3.2rem); gap: .35rem 0; justify-content: center; padding: 1.2rem .6rem; border-radius: var(--radius); background: linear-gradient(180deg, #e9c89a, #d8ad73); margin-top: .8rem; }
.pin { justify-self: center; width: 2.9rem; height: 2.9rem; border-radius: 50%; border: 2px dashed rgba(15, 27, 45, .35); background: rgba(255, 255, 255, .25); color: rgba(15, 27, 45, .55); font: 700 1rem/1 var(--font-head); cursor: pointer; transition: transform .12s ease; }
.pin:hover { transform: scale(1.08); }
.pin[aria-pressed="true"] { border: 2px solid var(--ink); background: #fff; color: var(--ink); box-shadow: inset 0 -.35rem 0 var(--terra), 0 3px 6px rgba(15, 27, 45, .25); }
.rack-foul { text-align: center; font-size: .85rem; color: var(--muted); margin: .4rem 0 0; }
.stat-split { background: #fbe9e7; }
.stat-split strong { color: #8c1d18; }