body {
}

/* ===== Tournament placement certificate (Performance Arena Events) =====
   Text overlay positioned over the pre-rendered 1080x1080 background
   (tournament_cert_{rank}.png, served by /dynamic/TournamentCertificateBackground).
   Only 4 dynamic fields; logo/hero/medal/signature are baked into the PNG. */
.ttt-cert {
    position: relative;
    width: 1080px;
    height: 1080px;
    font-family: 'Space Grotesk', sans-serif;
    color: #ffffff;
    overflow: hidden;
}

.ttt-cert .bg {
    position: absolute;
    inset: 0;
    width: 1080px;
    height: 1080px;
    display: block;
}

.ttt-cert .winner-name {
    position: absolute;
    left: 0;
    right: 0;
    top: 632px;
    text-align: center;
    font-size: 64px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1;
}

.ttt-cert .meta {
    position: absolute;
    left: 0;
    right: 0;
    top: 758px;
}

.ttt-cert .meta .meta-value {
    position: absolute;
    transform: translateX(-50%);
    text-align: center;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

/* Each value centered on its own baked underline, independent of text width.
   Order is fixed: 1=Event, 2=Edition, 3=Reward. */
.ttt-cert .meta .meta-value:nth-child(1) { left: 354px; }
.ttt-cert .meta .meta-value:nth-child(2) { left: 540px; }
.ttt-cert .meta .meta-value:nth-child(3) { left: 726px; }

.ttt-cert.rank-1 .meta .reward { color: #FFD86B; }
.ttt-cert.rank-2 .meta .reward { color: #E8E8E8; }
.ttt-cert.rank-3 .meta .reward { color: #E8A878; }