/* Блоки поверх игры и лендинга: итоги (рекорды), полка трофеев, заказ недели, вспышка таймера,
   меню пинга. Токены темы, как в style.css; файл вынесен из него по пределу 500 строк. */
/* Рекорды на итогах: крючок на вторую смену — свой рекорд, лучшая бригада, место за неделю. */
.records{margin:var(--space-3) 0;padding:var(--space-3);border:1px solid var(--color-border-default);border-radius:var(--radius-md);background:var(--color-surface-card)}
.records h3{margin:0 0 var(--space-2);font-size:var(--text-base);text-transform:uppercase;letter-spacing:.06em}
.records p{margin:var(--space-1) 0}
.records .record-best,.records .record-weekly{color:var(--color-text-accent)}
.records .record-first{color:var(--color-text-secondary)}
/* Моменты смены на итогах: время и фраза радио — история, которую можно пересказать. */
.moments{margin:var(--space-3) 0}
.moments h3{margin:0 0 var(--space-1);font-size:var(--text-base);text-transform:uppercase;letter-spacing:.06em}
.moments p{margin:var(--space-1) 0;color:var(--color-text-accent)}
/* Полка трофеев гостя: кнопка-счётчик в строке наряда, список раскрывается под ней. */
.shelf{position:relative}
.shelf[hidden],.shelf-list[hidden]{display:none}
.shelf-list{
  position:absolute;right:0;top:calc(100% + var(--space-1));z-index:3;min-width:16rem;max-width:min(24rem,90vw);
  padding:var(--space-3);background:var(--color-surface-raised);border:1px solid var(--color-border-strong);
  border-radius:var(--radius-md);box-shadow:var(--shadow-md)
}
.shelf-list p{margin:0 0 var(--space-2)}
.trophy{display:grid;gap:0;padding:var(--space-1) 0;border-top:1px solid var(--color-border-default)}
.trophy strong{color:var(--color-text-accent)}
.trophy-new{color:var(--color-text-accent)}
/* Заказ недели на лендинге: контракт недели и таблица лучших бригад (имена из наряда). */
.weekly{margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--color-border-default)}
.weekly-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.weekly-table th,.weekly-table td{padding:var(--space-1) var(--space-2);text-align:left;border-bottom:1px solid var(--color-border-default)}
.weekly-table th{font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-secondary)}
.weekly-table td.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.weekly-table tr.won td{color:var(--color-text-accent)}

/* Поправка времени от часов: короткая вспышка у таймера, прячется по hidden. */
.time-shift{display:inline-block;margin-left:var(--space-2);font-family:var(--font-mono);font-weight:var(--weight-bold);color:var(--color-text-accent);animation:time-shift var(--duration-slow) ease-out}
.time-shift.minus{color:var(--color-action-danger)}
.time-shift[hidden]{display:none}
@keyframes time-shift{from{opacity:0;transform:translateY(.3em)}to{opacity:1;transform:none}}

/* Меню пинга: три слова у точки нажатия, кнопки не меньше цели касания. */
.ping-menu{
  position:absolute;z-index:3;display:grid;gap:var(--space-1);padding:var(--space-2);
  background:var(--color-surface-raised);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);
  box-shadow:var(--shadow-md);min-width:12rem
}
.ping-menu .ping-title{font-family:var(--font-display);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-secondary);padding:0 var(--space-2)}
.ping-menu button{min-height:var(--size-target-min);text-align:left}
.ping-menu[hidden]{display:none}