/* Build-card color accents: make progression types easier to scan without losing the dark Diablo look. */
.build-category{
  --accent:#d6b879;
  --accent-label:#bda979;
  --accent-border:#594d37;
  --accent-glow:rgba(214,184,121,.08);
}

/* Leveling = icy blue */
.build-category:nth-child(1){
  --accent:#82b9d8;
  --accent-label:#94b9ca;
  --accent-border:#355668;
  --accent-glow:rgba(79,143,178,.10);
}

/* Early Farming = druid/forest green */
.build-category:nth-child(2){
  --accent:#91bd72;
  --accent-label:#9fb98c;
  --accent-border:#405b35;
  --accent-glow:rgba(110,158,79,.10);
}

/* Early Bossing = ember red/orange */
.build-category:nth-child(3){
  --accent:#d07b60;
  --accent-label:#c79584;
  --accent-border:#6a3f34;
  --accent-glow:rgba(184,83,55,.11);
}

/* Cheap Mappers = arcane purple */
.build-category:nth-child(4){
  --accent:#b393d1;
  --accent-label:#b5a1c7;
  --accent-border:#59456b;
  --accent-glow:rgba(137,98,174,.11);
}

/* Endgame Mappers = molten gold */
.build-category:nth-child(5){
  --accent:#d7a950;
  --accent-label:#c9ad78;
  --accent-border:#6b542c;
  --accent-glow:rgba(214,160,67,.11);
}

/* Tier 2 Bossing = blood-crimson */
.build-category:nth-child(6){
  --accent:#d86f83;
  --accent-label:#ca98a3;
  --accent-border:#6c3743;
  --accent-glow:rgba(194,71,95,.11);
}

.build-category-heading{border-bottom-color:var(--accent-border)}
.build-category-heading h3{color:var(--accent);text-shadow:0 0 10px var(--accent-glow)}
.build-category-heading p{color:#aaa194}

.build-card{
  position:relative;
  border-color:#3c352d;
  border-left:3px solid var(--accent);
  background:linear-gradient(105deg,var(--accent-glow),rgba(17,18,20,.94) 22%,#0b0c0d 100%);
}
.build-card h4{color:#f0dfbf;text-shadow:0 1px 0 #000}
.build-card-head{padding-right:58px}

/* Season Tested badge: intentionally cyan/teal so it stands apart from every category accent. */
.build-season-badge{
  position:absolute;
  top:11px;
  right:11px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  min-height:25px;
  padding:3px 8px;
  border:1px solid #45d6c2;
  border-radius:6px;
  background:linear-gradient(180deg,#12312f,#091917);
  color:#8ff3e4;
  box-shadow:0 0 12px rgba(69,214,194,.12),inset 0 1px 0 rgba(255,255,255,.04);
  font-family:"Cinzel",Georgia,serif;
  font-size:11px;
  font-weight:800;
  letter-spacing:.055em;
  line-height:1;
  text-transform:uppercase;
}

.build-category .build-detail>span,
.build-category .build-rating>span,
.build-category .build-block-label{color:var(--accent-label)}

/* Keep all letter-grade displays the same size. */
.build-rating>.build-rating-value{
  font-size:18px!important;
  line-height:1;
  min-height:25px;
}

/* Farming areas use the same centered layout across every class. */
.build-farming-areas{text-align:center}
.build-farming-areas>span{text-align:center}
.build-farming-areas>strong{
  display:flex!important;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  min-height:25px;
  text-align:center;
}

/* Center every field in the Early Bossing comparison grid. */
.build-category:nth-child(3) .build-detail{text-align:center}
.build-category:nth-child(3) .build-detail>span{text-align:center}
.build-category:nth-child(3) .build-detail>strong{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:25px;
  text-align:center;
}

/* Boss rating cells such as Ubers, DClone and future bosses. */
.build-detail-rank{text-align:center}
.build-detail-rank>span{text-align:center}
.build-detail-rank>strong{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:25px;
  font-family:"Cinzel",Georgia,serif;
  font-size:18px;
  font-weight:700;
}
.build-detail-rank .build-detail-rating.has-tooltip{font-size:18px!important}

/* Give the repeated information types their own visual language. */
.build-head-links-label{color:#d08e79}
.build-link{border-color:#754638;color:#edc2b3;background:linear-gradient(#2d1c18,#18100e)}
.build-link:hover{border-color:#a9624c;color:#ffe1d6;background:linear-gradient(#3a221b,#21120e)}

.build-chip-row>span:not(.build-gear){border-color:#405943;color:#b8d0b9;background:#0d120e}
.build-gear{border-color:#3d5360;color:#b9ccd7;background:#0b1013}
a.build-gear:hover{border-color:#668496;color:#deedf5}

.build-placeholder{
  border-style:dashed!important;
  color:#8f887d!important;
  background:#0b0c0d!important;
  font-style:italic;
  opacity:.9;
}

.build-notes{border-left-color:#9a753c;background:#100e0a;color:#c1b5a1}
.build-notes span{color:#d2a85f!important}

.build-detail strong{color:#d4cabb}
.build-area-token{color:#ddd1ba!important}
.build-area-token.has-tooltip,.build-detail-rating.has-tooltip{border-bottom-color:var(--accent);color:var(--accent)!important}

/* Compact About section lives inside the selected class build panel. */
.build-about-compact{
  margin:-8px 0 18px;
  padding:9px 12px 10px;
  border:1px solid #34383f;
  border-radius:8px;
  background:linear-gradient(180deg,#101215,#0b0c0e);
}
.build-about-compact h3{
  margin:0 0 5px;
  font-family:"Cinzel",Georgia,serif;
  color:#d8bd8b;
  font-size:14px;
  letter-spacing:.035em;
}
.build-about-copy{
  margin:0;
  padding:0 0 0 17px;
  display:block;
  color:#aba397;
}
.build-about-copy li{
  margin:2px 0;
  padding-left:2px;
  color:#aba397;
  font-size:10.5px;
  line-height:1.38;
}
.build-about-copy li::marker{color:#b9955e}
.build-about-copy strong{color:#d9c49d}

@media(max-width:760px){
  .build-card{border-left-width:2px}
  .build-season-badge{top:9px;right:9px;min-width:40px}
  .build-card-head{padding-right:52px}
}