/* Player compare — player profiles (#profilePlayerCompare) and squad page (#squadPlayerCompare) */
    #profilePlayerCompare,
    #squadPlayerCompare {
      box-sizing: border-box;
    }
    #squadPlayerCompare .pc-section {
      margin-top: 48px;
      padding-top: 40px;
      border-top: 1px solid var(--border);
      scroll-margin-top: 88px;
    }
    #playerCompareSection { scroll-margin-top: 88px; }
    .pc-section { margin-top: 56px; padding-bottom: 48px; }
    .pc-head {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 14px;
      margin-bottom: 20px;
    }
    .pc-head svg {
      flex-shrink: 0;
      color: var(--green);
      width: 36px;
      height: 36px;
    }
    .pc-head > div {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      max-width: 520px;
    }
    .pc-head-title {
      font-size: clamp(24px, 4vw, 34px);
      font-weight: 900;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      line-height: 1.15;
      background: linear-gradient(135deg, #1a7a3c 0%, #22804a 35%, #2563eb 68%, #1a3a7a 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }
    .pc-head-sub {
      font-size: 17px;
      color: var(--text-secondary);
      font-weight: 500;
      letter-spacing: normal;
      text-transform: none;
      line-height: 1.45;
      margin: 0;
    }

    .pc-card {
      margin-top: 20px;
      border: none;
      border-radius: 0;
      background: #fff;
      box-shadow: none;
      padding: 20px 0 24px;
    }
    .pc-grid {
      display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 300px) minmax(0, 1fr);
      gap: 28px; align-items: start;
    }

    /* Same portrait frame whether photo or placeholder (matches previous image slot height) */
    .pc-photo {
      width: 100%;
      height: min(72vh, 640px);
      border-radius: 0;
      overflow: hidden;
      background: linear-gradient(145deg, #0a0a0f 0%, #111827 38%, #1e3a5f 72%, #1a3a7a 100%);
      border: none;
      box-shadow: none;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 12px;
      box-sizing: border-box;
    }
    .pc-photo img {
      width: auto;
      max-width: 100%;
      height: auto;
      max-height: 100%;
      object-fit: contain;
      object-position: center;
      display: block;
      margin: 0 auto;
    }
    .pc-photo-placeholder {
      flex: 1;
      align-self: stretch;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      min-height: 0;
      box-sizing: border-box;
      padding: 12px 16px 20px;
    }
    .pc-photo .pc-photo-placeholder-ring.avatar.avatar-placeholder {
      width: min(44vw, 200px);
      height: min(44vw, 200px);
      flex-shrink: 0;
    }

    .pc-picker-card {
      margin-top: 16px; padding: 14px 0; border-radius: 0;
      border: none; background: transparent;
    }
    .pc-picker-card .select-wrap select { width: 100%; }
    .pc-picker-cta {
      font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-align: center;
      margin-bottom: 14px; line-height: 1.35;
    }
    .pc-picker-card--left .pc-picker-cta { color: var(--green); }
    .pc-picker-card--right .pc-picker-cta { color: var(--blue); }
    .pc-picker-card--left .select-wrap select:focus { border-color: var(--green); }
    .pc-picker-card--right .select-wrap select:focus { border-color: var(--blue); }

    .pc-center {
      display: flex; flex-direction: column; align-items: stretch; gap: 0;
      background: linear-gradient(135deg, #1a7a3c 0%, #1a3a7a 100%);
      border-radius: 0;
      padding: 22px 18px 24px;
      box-shadow: none;
    }
    .pc-center .pc-stat-rows { border-top-color: rgba(255, 255, 255, 0.22); }
    .pc-center .pc-stat-row { border-bottom-color: rgba(255, 255, 255, 0.18); }
    .pc-center .pc-stat-name {
      font-size: 16px;
      font-weight: 800;
      letter-spacing: 0.03em;
      background: linear-gradient(135deg, #ecfdf5 0%, #dbeafe 55%, #bfdbfe 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }
    .pc-center .pc-stat-val--l { color: #a7f3d0; }
    .pc-center .pc-stat-val--r { color: #bfdbfe; }
    .pc-center .pc-vs-score--l { color: #6ee7b7; }
    .pc-center .pc-vs-score--r { color: #93c5fd; }
    .pc-center .pc-btn-all-stats {
      background: #fff; color: var(--green) !important;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    }
    .pc-center .pc-btn-all-stats:hover {
      filter: none; background: rgba(255, 255, 255, 0.94); color: var(--green-dark) !important;
    }
    .pc-vs-head {
      display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 20px;
    }
    .pc-vs-score { font-size: 42px; font-weight: 900; line-height: 1; min-width: 56px; text-align: center; }
    .pc-vs-score--l { color: var(--green); }
    .pc-vs-score--r { color: var(--blue); }

    .pc-vs-ring-wrap {
      width: 108px; height: 108px; flex-shrink: 0; border-radius: 50%; padding: 7px;
      background: conic-gradient(from 270deg, var(--green) 0deg 180deg, var(--blue) 180deg 360deg);
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    }
    .pc-vs-ring-inner {
      width: 100%; height: 100%; border-radius: 50%; background: #fff;
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      text-align: center; padding: 6px;
    }
    .pc-vs-ring-inner span:first-child { font-size: 13px; font-weight: 900; color: var(--text-primary); letter-spacing: 0.04em; }
    .pc-vs-ring-inner span:last-child { font-size: 10px; font-weight: 700; color: var(--text-secondary); letter-spacing: 0.08em; margin-top: 2px; }
    .pc-center .pc-vs-ring-inner span:first-child {
      font-size: 24px;
      font-weight: 900;
      letter-spacing: 0.1em;
      line-height: 1;
      background: linear-gradient(135deg, #1a7a3c 0%, #2563eb 52%, #1a3a7a 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }
    .pc-center .pc-vs-ring-inner span:last-child {
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 0.14em;
      margin-top: 6px;
      line-height: 1.2;
      background: linear-gradient(135deg, #15803d 0%, #1d4ed8 55%, #1e3a8a 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }

    .pc-stat-rows { border-top: 1px solid var(--border); }
    .pc-stat-row {
      display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
      align-items: center; gap: 12px; padding: 14px 8px; border-bottom: 1px solid var(--border);
      font-size: 14px;
    }
    .pc-stat-row:last-child { border-bottom: none; }
    .pc-stat-val { font-weight: 700; text-align: center; }
    .pc-stat-val--l { color: var(--green); }
    .pc-stat-val--r { color: var(--blue); }
    .pc-stat-name {
      font-weight: 700; color: var(--text-primary); text-align: center; white-space: nowrap;
    }

    .pc-btn-all-stats {
      display: block; width: 100%; margin-top: 22px; text-align: center;
      padding: 14px 20px; border-radius: 999px; background: var(--green); color: #fff !important;
      font-size: 13px; font-weight: 800; letter-spacing: 0.06em; border: none;
      transition: background 0.2s, filter 0.2s;
    }
    .pc-btn-all-stats:hover { filter: brightness(1.05); background: var(--green-dark); }

    /* Mobile: edge-to-edge width, no outer chrome */
    @media (max-width: 640px) {
      #profilePlayerCompare,
      #squadPlayerCompare {
        width: 100vw;
        max-width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        position: relative;
        left: auto;
      }
      #profilePlayerCompare .pc-section,
      #squadPlayerCompare .pc-section {
        margin-top: 28px;
        padding-bottom: 32px;
        padding-left: max(0px, env(safe-area-inset-left));
        padding-right: max(0px, env(safe-area-inset-right));
      }
      .pc-head {
        padding-left: 12px;
        padding-right: 12px;
      }
      .pc-card {
        margin-top: 12px;
        padding: 8px 0 16px;
      }
      .pc-grid {
        padding-left: 8px;
        padding-right: 8px;
        box-sizing: border-box;
      }
    }

    @media (max-width: 768px) {
      .pc-head-title {
        font-size: 20px;
        font-weight: 500;
        letter-spacing: 0.04em;
      }
      .pc-head-sub {
        font-size: 14px;
        font-weight: 500;
      }
      .pc-head svg {
        width: 28px;
        height: 28px;
      }
      .pc-vs-score,
      .pc-stat-val,
      .pc-stat-name,
      .pc-btn-all-stats,
      .pc-picker-cta,
      .pc-locked-player-name {
        font-weight: 500;
      }
      .pc-photo {
        height: min(36vh, 220px);
      }
      .pc-photo .pc-photo-placeholder-ring.avatar.avatar-placeholder {
        width: min(30vw, 120px);
        height: min(30vw, 120px);
      }
    }

    /* Mobile / tablet: same 3-column structure as desktop — tighter spacing & type */
    @media (max-width: 960px) {
      .pc-card {
        padding: 8px 0 16px;
      }
      .pc-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: clamp(4px, 1.2vw, 10px);
        align-items: start;
      }
      .pc-grid .pc-col {
        min-width: 0;
      }
      .pc-center {
        order: unset;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 10px 6px 12px;
      }
      .pc-vs-head {
        gap: clamp(2px, 1vw, 8px);
        margin-bottom: 12px;
        flex-wrap: nowrap;
      }
      .pc-vs-score {
        font-size: clamp(16px, 5.5vw, 26px);
        min-width: 0;
      }
      .pc-vs-ring-wrap {
        width: clamp(52px, 16vw, 76px);
        height: clamp(52px, 16vw, 76px);
        padding: 4px;
      }
      .pc-vs-ring-inner {
        padding: 3px;
      }
      .pc-center .pc-vs-ring-inner span:first-child {
        font-size: clamp(12px, 3.8vw, 18px);
        letter-spacing: 0.06em;
      }
      .pc-center .pc-vs-ring-inner span:last-child {
        font-size: clamp(7px, 2vw, 10px);
        letter-spacing: 0.1em;
        margin-top: 2px;
      }
      .pc-stat-row {
        gap: clamp(2px, 1vw, 6px);
        padding: 8px 2px;
        font-size: clamp(10px, 2.8vw, 13px);
      }
      .pc-center .pc-stat-name {
        font-size: clamp(9px, 2.5vw, 14px);
        white-space: normal;
        line-height: 1.15;
        overflow-wrap: anywhere;
      }
      .pc-btn-all-stats {
        margin-top: 12px;
        padding: 10px 8px;
        font-size: clamp(9px, 2.4vw, 12px);
      }
      .pc-center .pc-btn-all-stats {
        padding: 10px 8px;
        font-size: clamp(9px, 2.4vw, 12px);
      }
      .pc-photo {
        height: min(42vh, 280px);
        padding: clamp(4px, 1.2vw, 8px);
      }
      .pc-photo img {
        max-height: 100%;
        max-width: 100%;
      }
      .pc-photo-placeholder {
        padding: 8px 10px 14px;
      }
      .pc-photo .pc-photo-placeholder-ring.avatar.avatar-placeholder {
        width: min(36vw, 160px);
        height: min(36vw, 160px);
      }
      .pc-picker-card {
        margin-top: 8px;
        padding: 8px 0;
      }
      .pc-picker-cta {
        font-size: clamp(7px, 1.8vw, 10px);
        margin-bottom: 6px;
      }
      .pc-picker-card .select-wrap select {
        font-size: clamp(11px, 3vw, 14px);
        height: auto;
        min-height: 38px;
        padding: 6px 28px 6px 8px;
      }
    }
  

.pc-locked-player-name {
  text-align: center;
  font-weight: 700;
  font-size: 15px;
  color: var(--text-primary);
  margin-top: 10px;
  line-height: 1.25;
}
@media (min-width: 641px) {
  #profilePlayerCompare .pc-section { margin-top: 40px; }
}

.pc-picker-card--locked {
  padding-top: 12px;
  padding-bottom: 12px;
}