.gc-collection-page{
  --collection-gold:#d8b56a;
  --collection-gold-soft:#a88345;
  --collection-ivory:#f3ede4;
  --collection-muted:#9f9489;
  --collection-panel:#111014;
  --collection-panel-2:#181419;
  --collection-line:rgba(216,181,106,.18);
  padding-bottom:42px;
}

.gc-collection-page .gc-feature-page-head{
  position:relative;
  overflow:hidden;
}
.gc-collection-page .gc-feature-page-head::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(216,181,106,.48),transparent);
}

.gc-collection-equipped{
  position:relative;
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  align-items:center;
  gap:20px;
  margin:18px 0 14px;
  padding:22px 24px;
  overflow:hidden;
  border:1px solid var(--collection-line);
  border-radius:10px;
  background:
    radial-gradient(420px 180px at 0 50%,rgba(216,181,106,.08),transparent 72%),
    linear-gradient(180deg,#171419,#0f0e11);
  box-shadow:0 8px 24px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.025);
}
.gc-collection-equipped::before{
  content:"";
  position:absolute;
  left:0;
  top:18px;
  bottom:18px;
  width:2px;
  background:linear-gradient(180deg,transparent,var(--collection-gold),transparent);
}
.gc-collection-equipped::after{
  content:"ÉQUIPÉ";
  position:absolute;
  right:18px;
  top:16px;
  color:rgba(216,181,106,.48);
  font-size:9px;
  font-weight:800;
  letter-spacing:.2em;
}
.gc-collection-equipped-icon{
  position:relative;
  display:grid;
  place-items:center;
  width:82px;
  height:82px;
  border:1px solid rgba(216,181,106,.36);
  border-radius:50%;
  color:var(--collection-gold);
  background:linear-gradient(145deg,rgba(216,181,106,.10),rgba(216,181,106,.025));
  box-shadow:inset 0 0 0 5px rgba(0,0,0,.16),0 7px 18px rgba(0,0,0,.25);
  font-size:36px;
}
.gc-collection-equipped-icon::after{
  content:"";
  position:absolute;
  inset:6px;
  border:1px solid rgba(216,181,106,.13);
  border-radius:50%;
  pointer-events:none;
}
.gc-collection-equipped small{
  display:block;
  margin-bottom:5px;
  color:#a99b8c;
  font-size:9px;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.gc-collection-equipped h3{
  margin:0 0 5px;
  color:var(--collection-ivory);
  font-family:Georgia,"Times New Roman",serif;
  font-size:24px;
  font-weight:500;
  letter-spacing:.015em;
}
.gc-collection-equipped p{
  margin:0;
  color:var(--collection-gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:13px;
  font-style:italic;
}

.gc-collection-toolbar{
  display:flex;
  align-items:end;
  gap:12px;
  margin:0 0 16px;
  padding:12px 14px;
  border:1px solid rgba(255,145,39,.12);
  border-radius:8px;
  background:#0f0e11;
}
.gc-collection-toolbar label{
  display:grid;
  gap:6px;
  min-width:210px;
  color:#9d9188;
  font-size:9px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.gc-collection-toolbar select{
  width:100%;
  min-width:0;
  height:39px;
  padding:0 36px 0 12px;
  border:1px solid rgba(216,181,106,.18);
  border-radius:6px;
  outline:none;
  background:#151217;
  color:#e7ded3;
  font-size:12px;
  transition:border-color .18s ease,background .18s ease;
}
.gc-collection-toolbar select:hover,
.gc-collection-toolbar select:focus{
  border-color:rgba(216,181,106,.46);
  background:#19151a;
}

.gc-collection-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:11px;
}
.gc-collection-card{
  position:relative;
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  align-content:start;
  column-gap:13px;
  min-height:222px;
  padding:15px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.065);
  border-radius:9px;
  background:
    radial-gradient(210px 120px at 0 0,rgba(216,181,106,.055),transparent 70%),
    linear-gradient(180deg,#161318,#0e0d10);
  box-shadow:0 5px 15px rgba(0,0,0,.20),inset 0 1px rgba(255,255,255,.018);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.gc-collection-card::before{
  content:"";
  position:absolute;
  left:0;
  top:12px;
  bottom:12px;
  width:2px;
  background:rgba(216,181,106,.5);
}
.gc-collection-card:hover{
  transform:translateY(-2px);
  border-color:rgba(216,181,106,.3);
  box-shadow:0 10px 23px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.025);
}
.gc-collection-card.is-equipped{
  border-color:rgba(216,181,106,.62);
  background:
    radial-gradient(240px 140px at 0 0,rgba(216,181,106,.105),transparent 70%),
    linear-gradient(180deg,#191519,#100e11);
  box-shadow:0 8px 22px rgba(0,0,0,.26),inset 0 0 0 1px rgba(216,181,106,.11);
}
.gc-collection-card.is-equipped::after{
  content:"ÉQUIPÉ";
  position:absolute;
  right:10px;
  top:9px;
  padding:3px 6px;
  border:1px solid rgba(216,181,106,.26);
  border-radius:3px;
  color:#e2c27b;
  background:rgba(216,181,106,.065);
  font-size:8px;
  font-weight:900;
  letter-spacing:.12em;
}
.gc-collection-card.is-locked{
  opacity:.68;
  filter:saturate(.3);
}
.gc-collection-card.is-locked::before{
  background:rgba(160,150,145,.24);
}
.gc-collection-card.is-locked:hover{
  transform:none;
  border-color:rgba(255,255,255,.09);
  box-shadow:0 5px 15px rgba(0,0,0,.20);
}
.gc-collection-card-icon{
  grid-row:1 / span 3;
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  margin:0;
  border:1px solid rgba(216,181,106,.28);
  border-radius:8px;
  color:var(--collection-gold);
  background:linear-gradient(145deg,rgba(216,181,106,.09),rgba(216,181,106,.02));
  box-shadow:inset 0 0 0 4px rgba(0,0,0,.14);
  font-size:25px;
}
.gc-collection-card h3{
  min-width:0;
  margin:1px 52px 3px 0;
  color:#f1ebe4;
  font-family:Georgia,"Times New Roman",serif;
  font-size:16px;
  font-weight:500;
  line-height:1.15;
}
.gc-collection-card-title{
  min-width:0;
  color:#caa85f;
  font-family:Georgia,"Times New Roman",serif;
  font-size:11px;
  font-style:italic;
  line-height:1.3;
}
.gc-collection-card-description{
  grid-column:1/-1;
  min-height:38px;
  margin:14px 0 10px;
  color:#aaa098;
  font-size:11px;
  line-height:1.45;
}
.gc-collection-progress{
  grid-column:1/-1;
  height:4px;
  margin:0 0 9px;
  overflow:hidden;
  border-radius:2px;
  background:#080709;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.7);
}
.gc-collection-progress i{
  display:block;
  height:100%;
  border-radius:2px;
  background:linear-gradient(90deg,#77562a,#d7b361);
  box-shadow:0 0 8px rgba(216,181,106,.25);
}
.gc-collection-card-meta{
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin:0 0 11px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.05);
  color:#887e77;
  font-size:9px;
  font-weight:700;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.gc-collection-equip{
  grid-column:1/-1;
  width:100%;
  height:34px;
  padding:0 12px;
  border:1px solid rgba(216,181,106,.35);
  border-radius:5px;
  background:rgba(216,181,106,.025);
  color:#dfc27e;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.gc-collection-equip:hover:not([disabled]){
  border-color:rgba(216,181,106,.65);
  background:rgba(216,181,106,.10);
  color:#f1d99f;
}
.gc-collection-equip[disabled]{
  cursor:default;
  border-color:rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
  color:#756d68;
}
.gc-collection-card.is-equipped .gc-collection-equip[disabled]{
  border-color:rgba(216,181,106,.24);
  color:#b89a5c;
  background:rgba(216,181,106,.05);
}
.gc-collection-grid .gc-empty-state{
  grid-column:1/-1;
  min-height:160px;
  display:grid;
  place-items:center;
  border:1px dashed rgba(216,181,106,.18);
  border-radius:9px;
  color:#958a82;
  background:#0f0e11;
  font-family:Georgia,"Times New Roman",serif;
  font-style:italic;
}

.gc-profile-badge-title{
  margin-top:3px;
  color:#d9b867;
  font-family:Georgia,"Times New Roman",serif;
  font-size:13px;
  font-style:italic;
}
.gc-profile-badges .gc-earned-badge{max-width:100%}

@media(max-width:1100px){
  .gc-collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .gc-collection-equipped{grid-template-columns:68px minmax(0,1fr);padding:18px}
  .gc-collection-equipped-icon{width:64px;height:64px;font-size:29px}
  .gc-collection-equipped h3{font-size:20px}
  .gc-collection-toolbar{align-items:stretch;flex-direction:column}
  .gc-collection-toolbar label{min-width:0}
}
@media(max-width:520px){
  .gc-collection-grid{grid-template-columns:1fr}
  .gc-collection-card{min-height:210px}
  .gc-collection-equipped::after{display:none}
}
