/* tierlist/assets/css/board.css — vignettes d'éléments (image + nom au survol) et plateau de la console */
.tlt { position: relative; width: 64px; height: 64px; flex: 0 0 auto; border-radius: 8px; overflow: hidden; display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .08); outline: none; box-sizing: border-box; }
.tlt img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tlt__ph { font-weight: 800; font-size: 1.3rem; color: #7c83ff; }
.tlt__nm { position: absolute; left: 0; right: 0; bottom: 0; padding: 3px 4px; font-size: .62rem; line-height: 1.15; text-align: center; color: #fff;
  background: rgba(7, 7, 15, .92); transform: translateY(101%); transition: transform .12s ease; word-break: break-word; max-height: 100%; overflow: hidden; }
.tlt:hover .tlt__nm, .tlt:focus .tlt__nm { transform: none; }
.tlt--txt { width: auto; min-width: 64px; height: auto; min-height: 34px; padding: 5px 12px; }
.tlt--txt .tlt__nm { position: static; transform: none; background: transparent; padding: 0; font-size: .76rem; color: inherit; max-width: 230px; }
.tlt--cur { outline: 3px solid #ffd166; }
.tlt[draggable="true"] { cursor: grab; }
.tlt--big { width: 150px; height: 150px; margin: 0 auto var(--space-3, 12px); }
.tlt--big .tlt__ph { font-size: 3.6rem; }
.tlt--big.tlt--txt { width: auto; min-width: 150px; height: 90px; }

/* plateau de la console : on glisse l'image dans un rang */
.tlb { display: flex; flex-direction: column; gap: 6px; margin-top: var(--space-3, 12px); }
.tlb-row { display: flex; min-height: 80px; border-radius: 12px; overflow: hidden; background: var(--surface-2, #14141f); border: 2px solid transparent; transition: border-color .1s, background .1s; }
.tlb-row.is-over { border-color: #fff; background: rgba(255, 255, 255, .09); }
.tlb-row__k { width: 84px; flex: 0 0 84px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #1a1a1a; font-family: 'Bebas Neue', sans-serif; font-size: 2.4rem; line-height: 1; }
.tlb-row__k small { font-family: 'DM Mono', monospace; font-size: .56rem; max-width: 78px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tlb-row__c { flex: 1; display: flex; flex-wrap: wrap; gap: 6px; padding: 7px 9px; align-items: center; min-width: 0; }
.tlb-hint { font-size: .74rem; color: var(--muted-2, #8a8aa3); margin: var(--space-2, 8px) 0 0; }