@charset "UTF-8";
/*
*
* LOCATION: [pages]
* FILE NAME: [player.scss]
* DESCRIPTION: Player profile page styles
*
*/
/*
*
* LOCATION: [core]
* FOLDER: [scss]
* FILE NAME: [variables.scss]
*
*/
/*******************************************************
VARIABLES
*******************************************************/
/*******************************************************
COLORS
*******************************************************/
/* BASICS */
/* SPECIFIC BRAND */
/****** TITLES & TEXTS ******/
/****** MESSAGES & ALERTS ******/
/****** HEADER & FOOTER ******/
/****** POPUP ******/
/*******************************************************
Z-INDEX
*******************************************************/
/*
*
* LOCATION: [core]
* FOLDER: [scss]
* FILE NAME: [variables-admin.scss]
* DESCRIPTION: Standalone admin CMS variables — no website dependencies
*
*/
/*******************************************************
ADMIN VARIABLES
*******************************************************/
/*******************************************************
BASIC COLORS
*******************************************************/
/*******************************************************
ADMIN COLORS
*******************************************************/
/****** BRAND COLORS (used in admin UI accents) ******/
/****** TEXTS ******/
/****** MESSAGES & ALERTS ******/
/****** Z-INDEX ******/
/****** POPUPS ******/
/*
*
* LOCATION: [core]
* FOLDER: [scss]
* FILE NAME: [mixins.scss]
* DESCRIPTION: css properties reused
*
*/
/*******************************************************
MIXINS -
*******************************************************/
/* DARK AND DEFAULT MODE */
/*
*
* LOCATION: [core]
* FOLDER: [scss]
* FILE NAME: [media-queries.scss]
* DESCRIPTION: media queries
*
*/
/************************************************************
MEDIA QUERIES
************************************************************/
/** Target points **/
/* MOBILE - Targeting iPhone 5s only */
/* TABLET - mobile & up */
/* TABLET - 480px & up */
/* TABLET - 520px & up */
/* TABLET - 520px & up */
/* TABLET - 620px & up */
/* MOBILE - Only Mobile */
/* TABLET - Tablet & up */
/* TABLET - Targeting only tablet */
/* TABLET - Targeting Mobile & Tablet */
/* DESKTOP - Desktop & Up */
/* DESKTOP - Custom targeting point */
/* DESKTOP -  13 inch Macbook Pro screen */
/*
*
* LOCATION: [modules]
* FOLDER: [assets/scss]
* FILE NAME: [_font-tools.scss]
* DESCRIPTION: Font mixins ONLY — no CSS output.
*              Use this in page-level SCSS files to access
*              font-family and font-style mixins without
*              duplicating the global font/heading/paragraph rules.
*
*/
/*******************************************************
Mixins - Font Families
*******************************************************/
/*
*
* LOCATION: [pages]
* FILE NAME: [player.scss]
* DESCRIPTION: Player profile page styles
*
*/
/*
*
* LOCATION: [modules]
* FOLDER: [assets/scss]
* FILE NAME: [ads.scss]
* DESCRIPTION: Ad zone containers — CLS-safe reserved heights, responsive sizing
*
*/
/*******************************************************
ADS zone
*******************************************************/
.no-ads .ad-zone-container {
  display: none !important;
}

.ad-zone-container {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 900px;
  margin: 1.25rem auto 1.25rem;
  padding: 0.5rem 0;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  box-sizing: border-box;
}
.ad-zone-container::before {
  display: block;
  content: "Advertisement";
  position: absolute;
  left: 50%;
  top: -6px;
  padding: 0.25rem 0.5rem;
  background: white;
  font-family: "Source Sans 3", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  font-size: 0.625rem;
  line-height: 0.5em;
  color: #d3d3d3;
  text-transform: uppercase;
  letter-spacing: 1px;
  transform: translateX(-50%);
}
.ad-zone-container .adsbygoogle {
  width: 100%;
}
.ad-zone-container.ad-zone-small {
  min-height: calc(90px + 1rem);
}
.ad-zone-container.ad-zone-regular {
  min-height: calc(120px + 1rem);
}
.ad-zone-container.ad-zone-large {
  min-height: calc(280px + 1rem);
}
@media (min-width: 1140px) {
  .ad-zone-container.ad-zone-large {
    max-width: 960px;
  }
}
.ad-zone-container.ad-zone--full-width {
  max-width: 1280px;
}
@media (max-width: 767px) {
  .ad-zone-container.ad-zone--mobile-compact {
    min-height: calc(50px + 1rem);
  }
}

/*
*
* LOCATION: [pages]
* FILE NAME: [player.scss]
* DESCRIPTION: Player profile page styles
*
*/
/*
*
* LOCATION: [core]
* FOLDER: [scss]
* FILE NAME: [article-card.scss]
* DESCRIPTION: article style
*
*/
/****************************************
Global CSS
****************************************/
.article-card {
  position: relative;
  container: c-article-card/inline-size;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  align-content: start;
  gap: 1rem;
  width: 100%;
  grid-template-areas: "article-image" "article-content";
  padding: 1rem;
  border-radius: 2rem;
  border: 2px solid #15171a;
}
.article-card .overlink {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.article-card .w-img {
  position: relative;
  grid-area: article-image;
  margin: 0;
  border-radius: 1rem 1rem 0 0;
  overflow: hidden;
  transition: all 0.3s ease;
}
.article-card .w-img:hover {
  filter: brightness(1.1);
}
.article-card .w-content {
  position: relative;
  grid-area: article-content;
}
.article-card.horizontal {
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "article-image article-content";
}
.tag-list .article-card.horizontal {
  gap: 1.5rem;
}
@media (min-width: 1140px) {
  .tag-list .article-card.horizontal {
    grid-template-columns: 320px 1fr;
  }
}
@media (min-width: 1240px) {
  .tag-list .article-card.horizontal {
    grid-template-columns: 480px 1fr;
  }
}
.article-card.horizontal .w-img {
  border-radius: 1rem 0 0 1rem;
}
.article-card.cover {
  grid-template-areas: "article-image";
  align-items: end;
  border-radius: 2rem;
  overflow: hidden;
}
.article-card.cover .w-content {
  grid-area: article-image;
  z-index: 3;
  padding: 3rem 0.75rem 1rem 0.75rem;
  background: linear-gradient(rgba(21, 23, 26, 0) 0%, rgba(21, 23, 26, 0.9) 90%);
  border-radius: 0 0 1rem 1rem;
}
.article-card.cover .article-title {
  color: white;
}
.article-card.cover .w-img {
  border-radius: 1rem;
}
.article-card .article-title {
  margin-bottom: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 3;
  max-height: 4.5em;
}
@media (min-width: 1140px) {
  .article-card .article-title:hover {
    text-decoration: underline;
  }
}
@container c-article-card (width >= 600px) {
  .article-card .article-title {
    font-size: 2rem;
  }
}
@container c-article-card (width >= 540px) and (width < 600px) {
  .article-card .article-title {
    font-size: 1.75rem;
  }
}
@container c-article-card (width >= 440px) and (width < 540px) {
  .article-card .article-title {
    font-size: 1.5rem;
  }
}
@container c-article-card (width >= 340px) and (width < 440px) {
  .article-card .article-title {
    font-size: 1.25rem;
  }
}
@container c-article-card (width < 340px) {
  .article-card .article-title {
    font-size: 1.125rem;
  }
}
.article-card .date {
  font-size: 0.75rem;
  color: #229886;
}
.article-card .deck {
  font-size: 1rem;
  line-height: 1.5em;
  color: #4f535a;
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 3;
  max-height: 4.5em;
}
.article-card.small {
  grid-template-columns: 100px 1fr;
  grid-template-areas: "article-image article-content";
}
@media (min-width: 768px) {
  .article-card.small {
    grid-template-columns: 1fr;
    grid-template-areas: "article-image" "article-content";
  }
}
.article-card.small .w-img {
  flex: 1 0 100px;
  border-radius: 1rem;
}
@media (min-width: 480px) {
  .article-card.small .w-img {
    border-radius: 1rem 1rem 0 0;
  }
}
@container c-article-card (width < 340px) {
  .article-card.small .article-title {
    font-size: 1rem;
  }
}

/*
*
* LOCATION: [pages]
* FILE NAME: [player.scss]
* DESCRIPTION: Player profile page styles
*
*/
/*******************************************************
Squad — .squad
Player grid grouped by position
Shared between club and player pages
*******************************************************/
.w-squad {
  background-color: #f2f2f2;
}

.squad {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.squad__group {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.squad__group-label {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 800;
  font-size: 0.6875rem;
  line-height: 1em;
  color: #84888f;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #d3d3d3;
}
.squad__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
}
@media (min-width: 620px) {
  .squad__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 768px) {
  .squad__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1140px) {
  .squad__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
.squad__player {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  background-color: white;
  border-radius: 0.75rem;
  border: 1px solid #d3d3d3;
  transition: border-color 0.2s ease;
  text-decoration: none;
  color: inherit;
}
.squad__player:hover {
  border-color: #9689F7;
}
.squad__player--active {
  border-color: #6FFFE9;
  background-color: rgba(111, 255, 233, 0.08);
}
.squad__number {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1em;
  color: #15171a;
  min-width: 1.5rem;
  aspect-ratio: 1;
  padding: 0.25rem;
  flex-shrink: 0;
  background-color: #6FFFE9;
  border-radius: 0.25rem;
}
.squad__photo {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background-color: #f2f2f2;
}
.squad__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.squad__photo svg {
  width: 1.75rem;
  height: 1.75rem;
  display: block;
  margin: auto;
  margin-top: 0.5rem;
  color: #84888f;
}
.squad__info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  flex: 1;
  min-width: 0;
}
.squad__name {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.8125rem;
  line-height: 1.3em;
  color: #15171a;
  white-space: wrap;
}
.squad__nationality {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  font-size: 0.6875rem;
  line-height: 1.2em;
  color: #84888f;
}
.squad__stats {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  flex-shrink: 0;
}
.squad__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.0625rem;
  padding: 0.25rem 0.375rem;
  background-color: #f2f2f2;
  border-radius: 0.25rem;
  min-width: 1.75rem;
}
.squad__stat-value {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 0.75rem;
  line-height: 1em;
  color: #15171a;
}
.squad__stat-label {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.5rem;
  line-height: 1em;
  color: #84888f;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/*******************************************************
Hero — .pp-hero
Player hero section with photo + info + details
*******************************************************/
.pp-hero {
  padding: 0 0 2rem 0;
}
@media (min-width: 768px) {
  .pp-hero {
    padding: 3rem 2rem;
  }
}
@media (min-width: 1140px) {
  .pp-hero {
    padding: 3rem 3rem;
  }
}
.pp-hero__layout {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 2rem;
}
.pp-hero__header {
  position: relative;
  display: flex;
  gap: 1rem;
  padding: 1rem;
  background-color: #f2f2f2;
}
@media (min-width: 768px) {
  .pp-hero__header {
    border-radius: 10rem;
  }
}
.pp-hero__photo {
  flex-shrink: 0;
  overflow: hidden;
  background-color: #f2f2f2;
  width: 4rem;
  height: 4rem;
  border-radius: 2rem;
  border: 4px solid #FF1541;
}
@media (min-width: 768px) {
  .pp-hero__photo {
    width: 8rem;
    height: 8rem;
    border-radius: 4rem;
  }
}
.pp-hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pp-hero__photo-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f2f2f2;
}
.pp-hero__photo-placeholder svg {
  width: 6rem;
  height: 6rem;
  color: #84888f;
}
.pp-hero__content {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  gap: 1rem;
}
.pp-hero__number {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 900;
  font-size: 2rem;
  line-height: 1em;
  color: #FFDEE4;
  background-color: #FF1541;
}
@media (min-width: 768px) {
  .pp-hero__number {
    padding: 1rem;
    font-size: 3rem;
  }
}
@media (min-width: 1140px) {
  .pp-hero__number {
    font-size: 4rem;
  }
}
.pp-hero__info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
@media (min-width: 768px) {
  .pp-hero__info {
    gap: 0.25rem;
  }
}
.pp-hero__name {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.125em;
  color: #15171a;
  margin: 0;
}
@media (min-width: 768px) {
  .pp-hero__name {
    font-size: 2.25rem;
  }
}
@media (min-width: 1140px) {
  .pp-hero__name {
    font-size: 2.5rem;
  }
}
.pp-hero__club {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.pp-hero__club:hover {
  opacity: 0.75;
}
.pp-hero__club-logo {
  height: 1.5rem;
  width: auto;
  object-fit: contain;
}
.pp-hero__club-name {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.3em;
  color: #4f535a;
}
.pp-hero__body {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 1rem 2rem;
}
.pp-hero__trophies {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.pp-hero__trophy-more {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1em;
  color: #4f535a;
  padding: 0.5rem 0.75rem;
  background-color: #f2f2f2;
  border-radius: 0.5rem;
}
.pp-hero__details {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
  gap: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #d3d3d3;
}
.pp-hero__field {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.pp-hero__field-label {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.6875rem;
  line-height: 1em;
  color: #84888f;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.pp-hero__field-value {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.25em;
  color: #15171a;
}
.pp-hero__deck {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.5em;
  color: #84888f;
  font-style: italic;
  margin: 0;
}
.pp-hero__bio {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.625em;
  color: #363b41;
  margin: 0.25rem 0 0 0;
}
.pp-hero--featured {
  padding: 0;
}
@media (min-width: 768px) {
  .pp-hero--featured {
    padding: 3rem 2rem;
  }
}
@media (min-width: 1140px) {
  .pp-hero--featured {
    padding: 3rem 3rem;
  }
}
.pp-hero--featured .pp-hero__featured-content {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
}
@media (min-width: 768px) {
  .pp-hero--featured .pp-hero__featured-content {
    padding: 1rem;
  }
}
.pp-hero--featured .pp-hero__name {
  color: #15171a;
}
.pp-hero--featured .pp-hero__club-name {
  color: #84888f;
}
.pp-hero--featured .pp-hero__deck {
  color: #84888f;
}
.pp-hero--featured .pp-hero__bio {
  color: #15171a;
}
.pp-hero--featured .pp-hero__field-label {
  color: #84888f;
}
.pp-hero--featured .pp-hero__field-value {
  color: #15171a;
}
.pp-hero--featured .pp-hero__details {
  border-top-color: #363b41;
}
.pp-hero--featured .pp-hero__number {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
}
.pp-hero--featured .pp-hero__position {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background-color: #FFDEE4;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 900;
  font-size: 1.5rem;
  line-height: 1em;
  color: #FF1541;
}
@media (min-width: 768px) {
  .pp-hero--featured .pp-hero__position {
    font-size: 2.25rem;
  }
}
@media (min-width: 1140px) {
  .pp-hero--featured .pp-hero__position {
    font-size: 2.75rem;
  }
}
.pp-hero__featured {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 0.5rem;
  padding: 1.25rem 1.25rem 4rem;
}
@media (min-width: 768px) {
  .pp-hero__featured {
    padding: 0;
    gap: 2rem;
    flex-direction: row;
    align-items: flex-start;
  }
}
.pp-hero__featured-info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
  min-width: 0;
}
.pp-hero__featured-image {
  position: relative;
  flex-shrink: 0;
  width: 12rem;
  overflow: hidden;
  padding: 1rem;
  background-color: #f2f2f2;
}
@media (min-width: 768px) {
  .pp-hero__featured-image {
    width: 18rem;
  }
}
@media (min-width: 1140px) {
  .pp-hero__featured-image {
    width: 22rem;
  }
}
.pp-hero__featured-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 2rem 0 2rem 0;
  border: 4px solid #FF1541;
}

.card-trophy {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  background-color: #f2f2f2;
  border-radius: 0.5rem;
  cursor: default;
}
.card-trophy__icon {
  font-size: 1.125rem;
  flex-shrink: 0;
}
.card-trophy__logo {
  height: 1.5rem;
  width: 1.5rem;
}
.card-trophy__logo picture {
  width: 100%;
  height: 100%;
}
.card-trophy__logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.card-trophy__info {
  display: flex;
  gap: 0.5rem;
}
.card-trophy__count {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 800;
  font-size: 0.875rem;
  line-height: 1em;
  color: #15171a;
  flex-shrink: 0;
}
.card-trophy__count--hero {
  font-size: 4rem;
  background: linear-gradient(180deg, #FF1541 19.1%, #B70D2D 94.27%);
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.card-trophy__name {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 500;
  font-size: 0.625rem;
  line-height: 1.25em;
  color: #4f535a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: auto;
}
.card-trophy--hero {
  flex-direction: column;
  align-items: start;
  gap: 0.25rem;
  flex: 1 0 150px;
}
@media (min-width: 768px) {
  .card-trophy--hero {
    flex: 0 0 160px;
  }
}

/*******************************************************
Season Stats — .pp-season
Grouped by team (club / nation), each with 3-panel layout
*******************************************************/
.pp-season {
  background-color: #f2f2f2;
  padding: 2rem 0 2.5rem;
}
@media (min-width: 768px) {
  .pp-season {
    padding: 2.5rem 0 3rem;
  }
}

.pp-season__team {
  margin-bottom: 1.5rem;
}
.pp-season__team:last-child {
  margin-bottom: 0;
}

.pp-season__team-header {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 1rem;
}

.pp-season__team-logo {
  height: 1.75rem;
  width: auto;
  object-fit: contain;
  flex-shrink: 0;
}

.pp-season__team-name {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.25em;
  color: #15171a;
}

.pp-season__team-badge {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.625rem;
  line-height: 1em;
  color: #262050;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 0.25rem 0.5rem;
  background-color: #E2DEFF;
  border-radius: 0.25rem;
}

.pp-season__layout {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 768px) {
  .pp-season__layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
  }
}

.pp-season__panel {
  background-color: white;
  border-radius: 0.75rem;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .pp-season__panel {
    padding: 1.5rem;
  }
}

.pp-season__panel-title {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1em;
  color: #363b41;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid #6153CC;
}

.pp-season__list {
  display: flex;
  flex-direction: column;
}

.pp-season__list-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.625rem 0;
  border-bottom: 1px solid #f2f2f2;
}
.pp-season__list-row:last-child {
  border-bottom: none;
}

.pp-season__list-label {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.25em;
  color: #4f535a;
}

.pp-season__list-value {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1em;
  color: #15171a;
}

.pp-season__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.625rem;
}

.pp-season__grid-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.375rem;
  padding: 0.75rem 0.5rem;
  background-color: #f2f2f2;
  border-radius: 0.5rem;
}

.pp-season__grid-value {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 800;
  font-size: 1.5rem;
  line-height: 1em;
  color: #15171a;
}

.pp-season__grid-label {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 500;
  font-size: 0.625rem;
  line-height: 1em;
  color: #84888f;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-align: center;
}

.pp-season__panel--table {
  padding: 0;
  overflow: hidden;
}
.pp-season__panel--table .pp-season__panel-title {
  padding: 1.25rem 1.25rem 0.75rem;
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .pp-season__panel--table .pp-season__panel-title {
    padding: 1.5rem 1.5rem 0.75rem;
  }
}

.pp-season__table {
  display: flex;
  flex-direction: column;
}

.pp-season__table-header,
.pp-season__table-row {
  display: grid;
  grid-template-columns: 1fr repeat(4, 2.75rem);
  gap: 0.25rem;
  padding: 0.5rem 1.25rem;
  align-items: center;
}
@media (min-width: 768px) {
  .pp-season__table-header,
  .pp-season__table-row {
    grid-template-columns: 1fr repeat(4, 3rem);
    padding: 0.5rem 1.5rem;
  }
}

.pp-season__table-header {
  background-color: #262050;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.pp-season__table-header .pp-season__table-col {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 0.625rem;
  line-height: 1em;
  color: rgba(255, 255, 255, 0.75);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-align: center;
}
.pp-season__table-header .pp-season__table-col--name {
  text-align: left;
  color: white;
}

.pp-season__table-row {
  border-bottom: 1px solid #f2f2f2;
}
.pp-season__table-row:last-child {
  border-bottom: none;
}
.pp-season__table-row .pp-season__table-col {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.8125rem;
  line-height: 1.25em;
  color: #363b41;
  text-align: center;
}
.pp-season__table-row .pp-season__table-col--name {
  text-align: left;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
}

.pp-season__table-logo {
  height: 1.125rem;
  width: auto;
  object-fit: contain;
  flex-shrink: 0;
}

/*******************************************************
Detailed Stats — .pp-detailed
Purple section with big numbers + stat grid
*******************************************************/
.pp-detailed {
  position: relative;
  padding: 1rem;
  background-color: #E2DEFF;
}
@media (min-width: 768px) {
  .pp-detailed {
    padding: 0;
  }
}
.pp-detailed__layout {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .pp-detailed__layout {
    display: grid;
    grid-template-columns: 560px 1fr;
  }
}
.pp-detailed__panel {
  overflow: hidden;
  padding: 2rem;
  background-color: #E2DEFF;
}
@media (min-width: 1140px) {
  .pp-detailed__panel {
    padding: 4rem 6rem;
  }
}
.pp-detailed__panel .pp-stats__value,
.pp-detailed__panel .pp-stats__label {
  color: #262050;
}
.pp-detailed__panel--inverted {
  background-color: #262050;
}
.pp-detailed__panel--inverted .pp-stats__value,
.pp-detailed__panel--inverted .pp-stats__label {
  color: #E2DEFF;
}
.pp-detailed__panel--inverted .pp-detailed__panel-title {
  color: white;
}
.pp-detailed__panel--featured {
  width: 100%;
}
.pp-detailed__panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pp-detailed__panel-title {
  color: #262050;
}

.pp-stats {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (max-width: 520px) {
  .pp-stats {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem 1.25rem;
  }
}
.pp-stats--grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem 1.5rem;
}
@media (min-width: 768px) {
  .pp-stats--grid {
    gap: 1rem 2.5rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
.pp-stats__item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 0.25rem;
}
.pp-stats__item--inline {
  flex-direction: row-reverse;
  align-items: baseline;
  justify-content: space-between;
  padding: 0;
  gap: 6rem;
}
@media (max-width: 767px) {
  .pp-stats__item--inline {
    flex-direction: column;
    gap: 0.25rem;
  }
}
.pp-stats__item--featured_primary {
  background-color: #6FFFE9;
}
.pp-stats__item--featured_secondary {
  background-color: #262050;
}
.pp-stats__value {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 800;
  font-size: 1.5rem;
  line-height: 1em;
  color: #15171a;
  flex-shrink: 0;
}
.pp-stats__value--xl {
  font-size: 3rem;
}
.pp-stats__label {
  flex-grow: 1;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.25em;
  color: #4f535a;
}

.team-ranking {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #9689F7;
}
.team-ranking__label {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.625rem;
  line-height: 1em;
  color: #E2DEFF;
  text-transform: uppercase;
  letter-spacing: 1px;
  flex-grow: 1;
}
.team-ranking__value {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.625rem;
  line-height: 1em;
  color: #6FFFE9;
  text-transform: uppercase;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .pp-detailed__dropdown {
    position: absolute;
    top: 1rem;
    right: 1rem;
  }
}

/*******************************************************
Career Stats — .pp-career
Grouped by season → team → competitions
*******************************************************/
.pp-career {
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem;
  width: 100%;
  justify-content: center;
}

.pp-career__season {
  width: 100%;
  height: fit-content;
  background-color: white;
  border-radius: 0.75rem;
  border: 1px solid #9689F7;
  overflow: hidden;
}
@media (min-width: 768px) {
  .pp-career__season {
    width: 40%;
    max-width: 50%;
    flex-grow: 1;
  }
}

.pp-career__season-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  background-color: #6153CC;
  border-bottom: 1px solid #9689F7;
}
@media (min-width: 768px) {
  .pp-career__season-header {
    padding: 1rem 1.5rem;
  }
}

.pp-career__season-label {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 800;
  font-size: 1rem;
  line-height: 1em;
  color: white;
}

.pp-career__season-totals {
  display: flex;
  gap: 0.75rem;
  flex-shrink: 0;
}

.pp-career__total {
  width: 2rem;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 1em;
  color: #E2DEFF;
}
@media (min-width: 768px) {
  .pp-career__total {
    width: 3rem;
  }
}

.pp-career__teams {
  display: flex;
  flex-direction: column;
}

.pp-career__team {
  border-bottom: 1px solid #9689F7;
}
.pp-career__team:last-child {
  border-bottom: none;
}
.pp-career__team > summary {
  list-style: none;
  cursor: pointer;
}
.pp-career__team > summary::marker, .pp-career__team > summary::-webkit-details-marker {
  display: none;
}

.pp-career__team-row {
  display: grid;
  grid-template-columns: 1.5rem 1fr repeat(3, 2rem);
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  align-items: center;
  transition: background-color 0.15s ease;
}
@media (min-width: 768px) {
  .pp-career__team-row {
    grid-template-columns: 1.75rem 1fr repeat(3, 3rem);
    padding: 0.75rem 1.5rem;
  }
}

summary.pp-career__team-row {
  user-select: none;
  cursor: pointer;
}
summary.pp-career__team-row:hover {
  background-color: #f2f2f2;
}

details[open] > summary.pp-career__team-row .pp-career__toggle {
  transform: rotate(45deg);
}

.pp-career__team-logo {
  height: 1.5rem;
  width: 1.5rem;
  object-fit: contain;
  flex-shrink: 0;
}

.pp-career__team-info {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.pp-career__team-name {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1.25em;
  color: #262050;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pp-career__intl-badge {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.625rem;
  line-height: 1em;
  color: #262050;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 0.25rem 0.5rem;
  background-color: #E2DEFF;
  border-radius: 0.25rem;
  flex-shrink: 0;
}

.pp-career__toggle {
  margin-left: auto;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.pp-career__team-stats {
  display: contents;
}

.pp-career__stat {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.8125rem;
  line-height: 1em;
  color: #15171a;
  text-align: center;
}

.pp-career__comp-list {
  background-color: #E2DEFF;
  border-top: 1px solid #9689F7;
}

.pp-career__comp-row {
  display: grid;
  grid-template-columns: 1fr repeat(3, 2.5rem);
  gap: 0.5rem;
  padding: 0.5rem 1.25rem 0.5rem 1.25rem;
  align-items: center;
  border-bottom: 1px solid #9689F7;
}
.pp-career__comp-row:last-child {
  border-bottom: none;
}
@media (min-width: 768px) {
  .pp-career__comp-row {
    grid-template-columns: 1fr repeat(3, 3rem);
    padding: 0.5rem 1.5rem 0.5rem 3.75rem;
  }
}

.pp-career__comp-name {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 500;
  font-size: 0.75rem;
  line-height: 1.25em;
  color: #363b41;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/*******************************************************
Trophies — .pp-trophies
Grouped by competition, showing winning years
*******************************************************/
.pp-trophies-section {
  background-color: #f2f2f2;
}

.pp-trophies {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
}
@media (min-width: 768px) {
  .pp-trophies {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem 2.5rem;
  }
}

.pp-trophies__item {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem 1.25rem;
  background-color: white;
  border-radius: 0.75rem;
  border: 1px solid #d3d3d3;
}
@media (min-width: 768px) {
  .pp-trophies__item {
    padding: 1.25rem 1.5rem;
  }
}

.pp-trophies__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  font-size: 1.5rem;
}
.pp-trophies__icon picture {
  width: 100%;
  height: 100%;
}
.pp-trophies__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.pp-trophies__info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
  min-width: 0;
}

.pp-trophies__league {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1.25em;
  color: #15171a;
}

.pp-trophies__seasons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.pp-trophies__season-tag {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 600;
  font-size: 0.6875rem;
  line-height: 1em;
  color: #363b41;
  padding: 0.25rem 0.5rem;
  background-color: #f2f2f2;
  border-radius: 0.25rem;
}

/*# sourceMappingURL=player.css.map */