/* Trophy cabinet ---------------------------------------------------------- */
.trophies, .trophies-strip {
  --trophies-gold: #d6a531; --trophies-silver: #a9b2bd; --trophies-bronze: #c07a45; --trophies-ink: #1b1d22;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .trophies, :root:not([data-theme="dark"]) .trophies-strip { --trophies-gold: #b8860b; --trophies-silver: #8a939e; --trophies-bronze: #a5622f; --trophies-ink: #ffffff; }
}
:root[data-theme="light"] .trophies, :root[data-theme="light"] .trophies-strip { --trophies-gold: #b8860b; --trophies-silver: #8a939e; --trophies-bronze: #a5622f; --trophies-ink: #ffffff; }

.trophies .gold { --tc: var(--trophies-gold); } .trophies .silver { --tc: var(--trophies-silver); } .trophies .bronze { --tc: var(--trophies-bronze); }

/* Shelf */
.trophies-shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; padding: 16px 14px 18px; border-radius: 12px;
  background: linear-gradient(to bottom, var(--surface-2), var(--surface-2) calc(100% - 10px), var(--surface-3) calc(100% - 10px)); border: 1px solid var(--line); }
.trophies-tile { position: relative; text-align: center; padding: 14px 8px 12px; border-radius: 12px; background: var(--surface-1); border: 1px solid var(--line);
  box-shadow: inset 0 -3px 0 color-mix(in srgb, var(--tc) 55%, transparent); min-width: 0; }
.trophies-icon { display: inline-block; width: 44px; height: 44px; color: var(--tc, var(--trophies-gold)); filter: drop-shadow(0 2px 4px color-mix(in srgb, var(--tc, var(--trophies-gold)) 35%, transparent)); }
.trophies-icon svg { width: 100%; height: 100%; display: block; }
.trophies-count { position: absolute; top: 8px; right: 10px; font-family: var(--display); font-weight: 700; font-size: 18px; color: var(--tc); }
.trophies-name { font-family: var(--display); font-weight: 700; font-size: 19px; line-height: 1.1; margin-top: 6px; overflow-wrap: anywhere; }
.trophies-what { font-size: 12px; color: var(--text-muted); }

.trophies-facts { margin-top: 18px; }
.trophies-facts h3 { margin-bottom: 10px; }

/* Promotions vs relegations bar */
.trophies-pr { display: flex; height: 26px; border-radius: 8px; overflow: hidden; background: var(--surface-3); font-size: 12px; font-weight: 700; color: #fff; }
.trophies-pr span { display: grid; place-items: center; min-width: 0; white-space: nowrap; overflow: hidden; }
.trophies-pr .up { background: var(--good); } .trophies-pr .down { background: var(--bad); }
.trophies-prlab { display: flex; justify-content: space-between; gap: 8px; margin-top: 6px; font-size: 12px; color: var(--text-secondary); flex-wrap: wrap; }
.trophies-prlab span:nth-child(2) { font-weight: 700; }

/* Streak / count badges */
.trophies-streaks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.trophies-streak { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line); min-width: 0; }
.trophies-streak.on { border-color: color-mix(in srgb, var(--good) 55%, transparent); background: color-mix(in srgb, var(--good) 10%, var(--surface-2)); }
.trophies-sicon { font-size: 20px; flex: none; }
.trophies-sval { font-family: var(--display); font-size: 26px; font-weight: 700; line-height: 1; }
.trophies-form span { cursor: default; }

/* Honours */
.trophies-honours { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.trophies-honour { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line);
  border-left: 4px solid var(--tc); text-align: left; cursor: pointer; min-width: 0; color: inherit; font: inherit; }
.trophies-honour:hover, .trophies-honour:focus-visible { border-color: var(--tc); outline: none; }
.trophies-honour .trophies-icon { width: 36px; height: 36px; flex: none; }
.trophies-hbody { display: flex; flex-direction: column; min-width: 0; }
.trophies-who { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trophies-cents { display: flex; flex-wrap: wrap; gap: 6px; }
.trophies-cent { font: inherit; font-size: 12px; color: var(--text-primary); background: var(--surface-2); border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; cursor: pointer; text-align: left; max-width: 100%; }
.trophies-cent:hover { border-color: var(--trophies-gold); }

.trophies-table td:first-child { color: var(--text-secondary); white-space: normal; }
.trophies-table th, .trophies-table td { padding-left: 6px; padding-right: 6px; }
.trophies-table td.num, .trophies-table th:not(:first-child) { text-align: right; }

/* Summary strip */
.trophies-strip { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.trophies-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface-2); color: var(--text-secondary); white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.trophies-chip.gold { border-color: color-mix(in srgb, var(--trophies-gold) 65%, transparent); color: var(--text-primary); background: color-mix(in srgb, var(--trophies-gold) 14%, var(--surface-2)); font-weight: 600; }
.trophies-chip.good { border-color: color-mix(in srgb, var(--good) 50%, transparent); color: var(--good); }

@media (max-width: 720px) {
  .trophies-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px 10px 16px; gap: 8px; }
  .trophies-honours { grid-template-columns: minmax(0, 1fr); }
}