/* ================= Player cards ================= */

.il-pcard-wrap {
    max-width: 340px;
    margin: 0 auto;
}

.il-pcard {
    container-type: inline-size;
    perspective: 1400px;
    cursor: pointer;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

.il-pcard-inner {
    position: relative;
    aspect-ratio: 760 / 1163;
    transform-style: preserve-3d;
    transition: transform .75s cubic-bezier(.3, .7, .2, 1);
}

.il-pcard.is-flipped .il-pcard-inner { transform: rotateY(180deg); }

.il-pcard-face {
    position: absolute;
    inset: 0;
    border-radius: 6cqw;
    overflow: hidden;
    background: #0A0A0A;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.il-pcard-back { transform: rotateY(180deg); }

.il-pcard-frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
    user-select: none;
}

/* light sweep on hover / after flip */
.il-pcard-face::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 5;
    pointer-events: none;
    background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, 0.16) 47%, transparent 60%);
    transform: translateX(-130%);
    transition: transform 1.1s ease;
}
.il-pcard:hover .il-pcard-face::after { transform: translateX(130%); }

/* ---------- Front ---------- */
.il-pcard-photo {
    position: absolute;
    left: 6.5%;
    top: 4.2%;
    width: 87.1%;
    height: 90.9%;
    object-fit: cover;
    object-position: center 30%;
    z-index: 1;
}

.il-pcard-fname {
    position: absolute;
    z-index: 4;
    left: 17%;
    right: 17%;
    top: 81.6%;
    height: 7.5%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Bebas Neue", Impact, sans-serif;
    font-size: 10cqw;
    line-height: 1;
    letter-spacing: .4cqw;
    text-transform: uppercase;
    color: #F5F0E1;
    text-shadow: 0 .4cqw 1.2cqw rgba(0, 0, 0, 0.8);
    white-space: nowrap;
    overflow: hidden;
}

.il-pcard-fsub {
    position: absolute;
    z-index: 4;
    left: 0;
    right: 0;
    top: 90.2%;
    text-align: center;
    font-size: 3.4cqw;
    font-weight: 700;
    letter-spacing: .6cqw;
    text-transform: uppercase;
    color: #B79B5A;
    text-shadow: 0 .3cqw .8cqw rgba(0, 0, 0, 0.9);
}

/* ---------- Back ---------- */
.il-pcard-bname {
    position: absolute;
    z-index: 4;
    left: 15%;
    right: 15%;
    top: 15%;
    height: 6.9%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Bebas Neue", Impact, sans-serif;
    font-size: 9cqw;
    line-height: 1;
    letter-spacing: .4cqw;
    text-transform: uppercase;
    color: #F5F0E1;
    white-space: nowrap;
    overflow: hidden;
}

/* one ruled band = 6.48% of the card height */
.il-pcard-row {
    position: absolute;
    z-index: 4;
    left: 8%;
    right: 8%;
    height: 6.48%;
    display: grid;
    align-items: center;
    text-align: center;
    color: #F5F0E1;
}

.il-pcard-bio {
    grid-template-columns: 1fr;
    font-size: 3.3cqw;
    font-weight: 600;
    letter-spacing: .3cqw;
    text-transform: uppercase;
    color: #B79B5A;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.il-pcard-heads {
    font-size: 2.7cqw;
    font-weight: 700;
    letter-spacing: .4cqw;
    text-transform: uppercase;
    color: #B79B5A;
    align-items: end;
    padding-bottom: .8cqw;
}

.il-pcard-vals {
    font-family: "Bebas Neue", Impact, sans-serif;
    font-size: 8cqw;
    line-height: 1;
    align-items: start;
    padding-top: .6cqw;
}

.il-pcard-c5 { grid-template-columns: repeat(5, 1fr); }
.il-pcard-c4 { grid-template-columns: repeat(4, 1fr); }

/* recent rounds table */
.il-pcard-rr {
    grid-template-columns: 15% 1fr 15% 12%;
    font-size: 3.2cqw;
    font-weight: 600;
    text-align: left;
    column-gap: 2cqw;
    padding: 0 3cqw;
}
.il-pcard-rr > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.il-pcard-rr > span:nth-child(3),
.il-pcard-rr > span:nth-child(4) { text-align: right; }
.il-pcard-rr.is-head {
    font-size: 2.5cqw;
    font-weight: 700;
    letter-spacing: .25cqw;
    text-transform: uppercase;
    color: #B79B5A;
}
.il-pcard-rr .il-under { color: #6FD27C; }
.il-pcard-rr .il-over  { color: #F08A8A; }

.il-pcard-empty {
    grid-template-columns: 1fr;
    font-size: 3.2cqw;
    color: rgba(245, 240, 225, 0.6);
}

/* band positions (top of each ruled row) */
.il-r1  { top: 24.5%; }
.il-r2  { top: 30.95%; }
.il-r3  { top: 37.45%; }
.il-r4  { top: 43.9%; }
.il-r5  { top: 50.4%; }
.il-r6  { top: 56.9%; }
.il-r7  { top: 63.35%; }
.il-r8  { top: 69.85%; }
.il-r9  { top: 76.3%; }
.il-r10 { top: 82.8%; }
.il-r11 { top: 89.3%; height: 4.9%; }

.il-pcard-hint {
    text-align: center;
    font-size: 12px;
    color: var(--il-muted);
    margin: 12px 0 0;
}

/* leaderboard / player list links to cards */
.il-lb-link { color: inherit; text-decoration: none; }
.il-lb-link:hover { color: var(--il-gold); }

/* ---------- Profile form ---------- */
.il-photo-pick {
    display: flex;
    align-items: center;
    gap: 14px;
}
.il-photo-pick img {
    width: 64px;
    height: 80px;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid rgba(183, 155, 90, 0.5);
}
.il-photo-pick input[type="file"] { display: none; }

/* ================= Handles, follow, profile ================= */

/* handle down the left edge of the card front */
.il-pcard-handle {
    position: absolute;
    z-index: 4;
    left: 7.5%;
    top: 27%;
    max-height: 52%;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-family: "Bebas Neue", Impact, sans-serif;
    font-size: 8.5cqw;
    line-height: 1;
    letter-spacing: .5cqw;
    color: #F5F0E1;
    text-shadow: 0 0 .5cqw rgba(0, 0, 0, 0.9), 0 .4cqw 1.6cqw rgba(0, 0, 0, 0.8);
    white-space: nowrap;
    overflow: hidden;
}

/* follow button on card backs */
.il-pcard-follow {
    position: absolute;
    z-index: 6;
    left: 24%;
    right: 24%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.il-pcard-follow-big  { top: 89.6%; height: 4.4%; }
.il-pcard-follow-mini { top: 59%;   height: 9.5%; left: 18%; right: 18%; }

.il-follow-btn {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 999px;
    background: linear-gradient(180deg, #D2B672, #A58A4C);
    color: #0A0A0A;
    font-family: "Inter", system-ui, sans-serif;
    font-weight: 800;
    font-size: 3.4cqw;
    letter-spacing: .4cqw;
    text-transform: uppercase;
    box-shadow: 0 .6cqw 1.6cqw rgba(0, 0, 0, 0.45);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.il-follow-btn.is-on {
    background: linear-gradient(180deg, #A32626, #7A1A1A);
    color: #fff;
}
.il-follow-btn:disabled { opacity: .7; }

/* ---------- Mini cards (Followers / Following) ---------- */
.il-pcard-mini .il-pcard-face   { border-radius: 6cqw; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5); }
.il-pcard-mini .il-pcard-fname  { font-size: 12cqw; }
.il-pcard-mini .il-pcard-fsub   { font-size: 5cqw; top: 90%; }
.il-pcard-mini .il-pcard-handle { font-size: 11cqw; }
.il-pcard-mini .il-pcard-bname  { font-size: 11cqw; }
.il-pcard-mini .il-pcard-bio    { font-size: 5.2cqw; }
.il-pcard-mini .il-pcard-heads  { font-size: 4.4cqw; letter-spacing: .2cqw; }
.il-pcard-mini .il-pcard-vals   { font-size: 12cqw; }
.il-pcard-mini .il-follow-btn   { font-size: 5.6cqw; }

.il-mini-go { margin-top: 10px; font-size: 13px; padding: 7px 0; }

.il-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px 14px;
}
@media (min-width: 520px) {
    .il-grid:not(.il-grid-t) { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Follower counts ---------- */
.il-follow-counts {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 10px;
    font-size: 15px;
}
.il-follow-counts a { color: var(--il-text); text-decoration: none; }
.il-follow-counts strong { color: #fff; font-weight: 800; }
.il-follow-counts .il-dot { color: var(--il-muted); }

/* ---------- Gold ribbon headers ---------- */
.il-ribbon {
    position: relative;
    display: table;
    margin: 34px auto 18px;
    padding: 0 18px;
    font-family: "Bebas Neue", Impact, sans-serif;
    font-size: 24px;
    letter-spacing: 1px;
    color: #0A0A0A;
    scroll-margin-top: 80px;
}
.il-ribbon > span {
    position: relative;
    z-index: 1;
    display: block;
    padding: 6px 26px 4px;
    background: linear-gradient(180deg, #D7BC7A 0%, #B79B5A 55%, #9A7F44 100%);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.45);
}
.il-ribbon::before,
.il-ribbon::after {
    content: "";
    position: absolute;
    top: 9px;
    width: 34px;
    height: 100%;
    background: #7E6838;
}
.il-ribbon::before { left: 0;  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 38% 50%); }
.il-ribbon::after  { right: 0; clip-path: polygon(0 0, 100% 0, 62% 50%, 100% 100%, 0 100%); }

.il-empty { text-align: center; color: var(--il-muted); font-size: 14px; }

/* ---------- Tournament tiles ---------- */
.il-ttile {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px;
    border-radius: 14px;
    background: var(--il-surface);
    border: 1px solid var(--il-border);
    box-shadow: var(--il-shadow);
    color: var(--il-text);
    text-decoration: none;
}
a.il-ttile:hover { border-color: rgba(183, 155, 90, 0.6); color: var(--il-text); }
.il-ttile .il-badge { align-self: flex-start; margin-bottom: 4px; }
.il-ttile-name { font-weight: 700; font-size: 16px; line-height: 1.2; }
.il-ttile-meta { font-size: 12px; color: var(--il-muted); }
.il-ttile-foot { margin-top: 6px; font-size: 12px; font-weight: 700; color: var(--il-gold); }

/* ---------- Edit form ---------- */
.il-edit summary {
    cursor: pointer;
    font-family: "Bebas Neue", Impact, sans-serif;
    font-size: 22px;
    letter-spacing: 1px;
    color: #fff;
    list-style: none;
}
.il-edit summary::-webkit-details-marker { display: none; }
.il-edit summary::after { content: " +"; color: var(--il-gold); }
.il-edit[open] summary::after { content: " −"; }

.il-at {
    background: var(--il-surface-2);
    border-color: rgba(255, 255, 255, 0.14);
    color: var(--il-gold);
}

.il-alert-gold {
    background: rgba(183, 155, 90, 0.14);
    border: 1px solid rgba(183, 155, 90, 0.45);
    color: #EBDDB8;
}

/* ---------- Long names shrink to fit the nameplate ---------- */
.il-pcard-fname.is-long,
.il-pcard-bname.is-long  { font-size: 7.5cqw; }
.il-pcard-fname.is-xlong,
.il-pcard-bname.is-xlong { font-size: 6cqw; }

.il-pcard-mini .il-pcard-fname,
.il-pcard-mini .il-pcard-bname          { font-size: 10cqw; }
.il-pcard-mini .il-pcard-fname.is-long,
.il-pcard-mini .il-pcard-bname.is-long  { font-size: 8cqw; }
.il-pcard-mini .il-pcard-fname.is-xlong,
.il-pcard-mini .il-pcard-bname.is-xlong { font-size: 6.5cqw; }
.il-pcard-mini .il-pcard-vals           { font-size: 10cqw; }

/* ribbons stay on one line on phones */
.il-ribbon { white-space: nowrap; font-size: clamp(18px, 5.6vw, 24px); }
.il-ribbon > span { padding-left: clamp(14px, 4vw, 26px); padding-right: clamp(14px, 4vw, 26px); }

/* Only the side facing you can be tapped (Chrome still hit-tests the hidden side) */
.il-pcard.is-flipped .il-pcard-front,
.il-pcard:not(.is-flipped) .il-pcard-back { pointer-events: none; }