/* === SOURCE: css/132-v4640-playstyle-inspector-ux.css === */

#playstylesPanel .ps-page-k6 #psHoverDetail{width:352px!important}
#playstylesPanel .ps-page-k6 #psHoverDetail.active:not(.locked){pointer-events:none!important}
#playstylesPanel .ps-page-k6 #psHoverDetail.locked{pointer-events:auto!important}

#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-inner{padding:15px 16px 15px!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head{grid-template-columns:58px minmax(0,1fr)!important;gap:11px!important;min-height:58px!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell{width:58px!important;height:58px!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell::before{width:39px!important;height:39px!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell img{width:36px!important;height:36px!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>span{margin:0!important;color:#7f8e9a!important;font-size:10.5px!important;line-height:1.1!important;font-weight:750!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>strong{margin-top:7px!important;color:#e3e9ee!important;font-size:28px!important;line-height:1.05!important;font-weight:900!important;letter-spacing:-.025em!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>small{display:none!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-rule{margin:13px 0 11px!important}

#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-title{display:block!important;color:#8bcbd5!important;font-size:12px!important;line-height:1.2!important;font-weight:900!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-title em{display:none!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-reqs{margin-top:9px!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req{display:grid!important;grid-template-columns:minmax(0,1fr) auto 22px!important;align-items:center!important;gap:10px!important;min-height:46px!important;border-bottom:1px solid rgba(255,255,255,.055)!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req:last-child{border-bottom:0!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-name span{color:#c5cdd4!important;font-size:13px!important;font-weight:760!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value{display:flex!important;align-items:baseline!important;gap:8px!important;color:#d7dee4!important;font-size:16px!important;line-height:1!important;font-weight:850!important;font-variant-numeric:tabular-nums lining-nums!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>span{color:#d5dce2!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>em{color:#667582!important;font-size:12px!important;font-style:normal!important;font-weight:650!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>b{color:#d9c47e!important;font-size:16px!important;font-weight:900!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req.missing .ps-req-value,
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req.impossible .ps-req-value{color:#d7dee4!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-check{min-width:18px!important;text-align:center!important;color:#72cda0!important;font-size:16px!important;line-height:1!important;font-style:normal!important;font-weight:950!important}

#playstylesPanel .ps-page-k6 #psHoverDetail .ps-unlock-cost,
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-unlocked-hint{display:none!important}

#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn{width:100%!important;min-height:50px!important;margin-top:15px!important;padding:0 16px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;border-radius:12px!important;font:850 13px/1 inherit!important;letter-spacing:.005em!important;cursor:pointer!important;transition:transform .14s ease,border-color .14s ease,background .14s ease,box-shadow .14s ease!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn small{font-size:10px!important;font-weight:700!important;opacity:.72!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn.unlock{border:1px solid rgba(216,184,95,.34)!important;background:linear-gradient(180deg,rgba(216,184,95,.18),rgba(216,184,95,.085))!important;color:#e7ce76!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn.equip{border:1px solid rgba(112,188,204,.30)!important;background:linear-gradient(180deg,rgba(81,149,165,.15),rgba(68,124,139,.075))!important;color:#a9d9e2!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn.equipped{border:1px solid rgba(112,204,174,.34)!important;background:linear-gradient(180deg,rgba(67,158,126,.18),rgba(52,124,99,.09))!important;color:#9fddc0!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn:not(:disabled):hover{transform:translateY(-1px)!important;box-shadow:0 8px 18px rgba(0,0,0,.16)!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn.disabled,
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn:disabled{cursor:default!important;border:1px solid rgba(255,255,255,.08)!important;background:rgba(255,255,255,.025)!important;color:#7f8b95!important;opacity:.72!important}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-note{margin-top:7px!important;color:#8c8062!important;font-size:9.5px!important;line-height:1.4!important;text-align:center!important}
#playstylesPanel .ps-page-k6 #psHoverDetail.active:not(.locked) .ps-action-btn{opacity:.78!important}
#playstylesPanel .ps-page-k6 #psHoverDetail.locked{border-color:rgba(126,196,211,.40)!important;box-shadow:0 22px 58px rgba(0,0,0,.56),0 0 0 1px rgba(126,196,211,.08) inset!important}

@media(max-width:1000px){
  #playstylesPanel .ps-page-k6 #psHoverDetail{width:auto!important}
  #playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>strong{font-size:25px!important}
}

/* === SOURCE: css/133-v4641-playstyle-compact-inspector.css === */

/* v4.6.41 · Compact PlayStyle inspector */

#playstylesPanel .ps-page-k6 #psHoverDetail{
  width:326px!important;
}

/* Container */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-inner{
  padding:13px 14px 13px!important;
}

/* Header */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head{
  grid-template-columns:50px minmax(0,1fr)!important;
  gap:10px!important;
  min-height:50px!important;
  align-items:center!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell{
  width:50px!important;
  height:50px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell::before{
  width:34px!important;
  height:34px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell img{
  width:31px!important;
  height:31px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>span{
  margin:0!important;
  color:#7f8d98!important;
  font-size:9.5px!important;
  line-height:1.05!important;
  font-weight:750!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>strong{
  margin-top:5px!important;
  color:#e1e7ec!important;
  font-size:24px!important;
  line-height:1.03!important;
  font-weight:900!important;
  letter-spacing:-.025em!important;
}

/* Divider */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-rule{
  margin:10px 0 9px!important;
}

/* Section title */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-title{
  color:#7fb9c3!important;
  font-size:11.5px!important;
  line-height:1.15!important;
  font-weight:850!important;
}

/* Requirements */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-reqs{
  margin-top:6px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req{
  grid-template-columns:minmax(0,1fr) 72px 20px!important;
  gap:7px!important;
  min-height:40px!important;
  padding:0!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-name span{
  color:#c2cbd2!important;
  font-size:12.5px!important;
  font-weight:730!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value{
  width:72px!important;
  justify-content:flex-end!important;
  gap:5px!important;
  font-size:13px!important;
  font-weight:820!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>span{
  width:22px!important;
  text-align:right!important;
  color:#d2d9df!important;
  font-size:13px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>em{
  width:8px!important;
  text-align:center!important;
  color:#5f6c77!important;
  font-size:10px!important;
  font-style:normal!important;
  font-weight:650!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>b{
  width:24px!important;
  text-align:left!important;
  color:#d9c47e!important;
  font-size:16px!important;
  line-height:1!important;
  font-weight:900!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value.is-met>b{
  color:#cbd5dc!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-check{
  width:20px!important;
  min-width:20px!important;
  font-size:15px!important;
}

/* Action */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn{
  min-height:44px!important;
  margin-top:11px!important;
  padding:0 13px!important;
  border-radius:11px!important;
  font-size:12.5px!important;
  font-weight:850!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn small{
  font-size:9.5px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-note{
  margin-top:5px!important;
  font-size:9px!important;
}

/* Slightly tighter shell without changing the established visual language */
#playstylesPanel .ps-page-k6 #psHoverDetail{
  border-radius:17px!important;
}

@media(max-width:1000px){
  #playstylesPanel .ps-page-k6 #psHoverDetail{
    width:auto!important;
  }
}

/* === SOURCE: css/134-v4642-playstyle-narrow-proportional.css === */

/* v4.6.42
   Shared proportional rule for processor-managed PS / PS+ badges. */
#playstylesPanel .ps-icon-shell,
.overview-badge-shell{
  --icon-ratio:.58;
}
#playstylesPanel .ps-icon-shell.plus,
.overview-badge-shell.plus{
  --icon-ratio:.60;
}
body.build-overview-active .fc-build-card-plus{
  --icon-ratio:.60;
}
body.build-overview-active .fc-build-card-plus.is-silver{
  --icon-ratio:.58;
}

/* Narrow desktop inspector. JS positioning uses the same 224px target. */
#playstylesPanel .ps-page-k6 #psHoverDetail{
  width:224px!important;
  border-radius:16px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-inner{
  padding:12px!important;
}

/* Header: keep shell, background badge and inner icon in one scale system. */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head{
  grid-template-columns:44px minmax(0,1fr)!important;
  gap:9px!important;
  min-height:44px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell{
  --badge-h:30px;
  --badge-w:30px;
  --icon-box:17.4px;
  --icon-ratio:.58;
  --gold-lift:0px;
  width:44px!important;
  height:44px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell.plus{
  --badge-w:36px;
  --icon-box:18px;
  --icon-ratio:.60;
  --gold-lift:1.79px;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell::before{
  width:var(--badge-w)!important;
  height:var(--badge-h)!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>.ps-icon-shell img{
  width:var(--icon-box)!important;
  height:var(--icon-box)!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div{
  min-width:0!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>span{
  font-size:9px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-head>div>strong{
  margin-top:4px!important;
  font-size:22px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Slightly tighter structural spacing. */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-rule{
  margin:9px 0 8px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-title{
  font-size:11px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-reqs{
  margin-top:5px!important;
}

/* Move value + check region clearly left.
   ~110px remains for the attribute name, 62px for "75 / 80", 18px for ✓. */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req{
  grid-template-columns:minmax(64px,1fr) 62px 18px!important;
  gap:5px!important;
  min-height:39px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-name{
  min-width:0!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-req-name span{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:12px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value{
  width:62px!important;
  justify-content:flex-end!important;
  gap:3px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>span{
  width:20px!important;
  font-size:12.5px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>em{
  width:7px!important;
  font-size:9.5px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-value>b{
  width:21px!important;
  font-size:15px!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-req-check{
  width:18px!important;
  min-width:18px!important;
  font-size:14px!important;
}

/* Button remains readable in the narrower card. */
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn{
  min-height:42px!important;
  margin-top:10px!important;
  padding:0 9px!important;
  font-size:11.8px!important;
  white-space:nowrap!important;
}
#playstylesPanel .ps-page-k6 #psHoverDetail .ps-action-btn small{
  font-size:8.8px!important;
}

/* Keep the card usable on very narrow screens. */
@media(max-width:520px){
  #playstylesPanel .ps-page-k6 #psHoverDetail{
    width:min(224px,calc(100vw - 20px))!important;
  }
}

/* === SOURCE: css/135-v4643-playstyle-toolbar-undo-reset.css === */

/* v4.6.43 · tighter page header + compact status/tools row */

#playstylesPanel .ps-page-k6{
  gap:9px!important;
}

/* Top page header: retain hierarchy, remove dead vertical space. */
#playstylesPanel .ps-page-k6 .ps-page-head{
  min-height:42px!important;
  padding:0 4px 3px!important;
  align-items:flex-start!important;
}
#playstylesPanel .ps-page-k6 .ps-page-head .advanced-kicker{
  font-size:7.4px!important;
  line-height:1!important;
}
#playstylesPanel .ps-page-k6 .ps-page-title-line{
  margin-top:2px!important;
  gap:8px!important;
}
#playstylesPanel .ps-page-k6 .ps-page-title-line h2{
  font-size:24px!important;
  line-height:1.03!important;
}
#playstylesPanel .ps-page-k6 .ps-page-title-line>span{
  font-size:8.2px!important;
}
#playstylesPanel .ps-page-k6 .ps-page-head p{
  margin-top:3px!important;
  font-size:9.6px!important;
  line-height:1.35!important;
  color:#66747f!important;
}

/* Library toolbar. */
#playstylesPanel .ps-page-k6 .ps-library-toolbar{
  min-height:42px!important;
  padding:7px 12px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-toolbar-main{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  width:100%!important;
}
#playstylesPanel .ps-page-k6 .ps-library-title-group{
  display:flex!important;
  align-items:baseline!important;
  gap:8px!important;
  min-width:0!important;
}
#playstylesPanel .ps-page-k6 .ps-library-title-group .advanced-kicker{
  font-size:7.2px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-title-group>strong{
  font-size:12.5px!important;
  line-height:1!important;
}
#playstylesPanel .ps-page-k6 .ps-library-title-group .ps-source-note{
  font-size:8.2px!important;
  color:#62717d!important;
}

#playstylesPanel .ps-page-k6 .ps-library-controls{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex:0 0 auto!important;
}
#playstylesPanel .ps-page-k6 .ps-library-stats{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-stat{
  min-height:30px!important;
  padding:4px 9px!important;
  gap:5px!important;
  border-radius:9px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-stat small{
  font-size:7.7px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-stat strong{
  font-size:12.5px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-stat strong em{
  font-size:8.5px!important;
}

/* Undo / reset use the same quiet tool-button language as Facilities. */
#playstylesPanel .ps-page-k6 .ps-library-tools{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  margin-left:1px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-tool-btn{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.018)!important;
  color:#a8b2bb!important;
  font-size:15px!important;
  line-height:1!important;
  font-family:inherit!important;
  cursor:pointer!important;
  transition:background .14s ease,border-color .14s ease,color .14s ease,transform .14s ease!important;
}
#playstylesPanel .ps-page-k6 .ps-library-tool-btn:not(:disabled):hover{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(255,255,255,.13)!important;
  color:#dce3e8!important;
  transform:translateY(-1px)!important;
}
#playstylesPanel .ps-page-k6 .ps-library-tool-btn:disabled{
  opacity:.30!important;
  cursor:default!important;
  transform:none!important;
}

@media(max-width:1000px){
  #playstylesPanel .ps-page-k6 .ps-library-toolbar-main{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:7px!important;
  }
  #playstylesPanel .ps-page-k6 .ps-library-controls{
    width:100%!important;
    justify-content:flex-start!important;
  }
}
@media(max-width:620px){
  #playstylesPanel .ps-page-k6 .ps-library-title-group{
    flex-wrap:wrap!important;
  }
  #playstylesPanel .ps-page-k6 .ps-library-controls{
    flex-wrap:wrap!important;
  }
}

/* === SOURCE: css/136-v4644-playstyle-toolbar-content-width.css === */

/* v4.6.44 · Keep PlayStyle toolbar controls aligned with the active content area
   instead of pushing them to the far-right edge of very wide screens. */

#playstylesPanel .ps-page-k6 .ps-library-toolbar-main{
  width:min(100%,1080px)!important;
  max-width:1080px!important;
  margin-left:0!important;
  margin-right:auto!important;
  justify-content:space-between!important;
}

/* Treat stats + tools as one compact status/action cluster. */
#playstylesPanel .ps-page-k6 .ps-library-controls{
  gap:11px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-stats{
  gap:6px!important;
}
#playstylesPanel .ps-page-k6 .ps-library-tools{
  gap:6px!important;
  margin-left:0!important;
}

/* On medium screens, use all available width naturally. */
@media(max-width:1180px){
  #playstylesPanel .ps-page-k6 .ps-library-toolbar-main{
    width:100%!important;
    max-width:none!important;
  }
}

/* === SOURCE: css/137-v4645-reset-tool-unification.css === */

/* v4.6.45 · one site-wide page-level undo / reset tool button language.
   Facilities remains the visual source of truth; Mastery and PlayStyles now match it. */

#masteryCard .page-tool-button,
#facilitiesCard .page-tool-button,
#playstylesPanel .ps-page-k6 .page-tool-button{
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  flex:0 0 36px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(255,255,255,.078)!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.030),rgba(255,255,255,.015))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  color:#aeb7c0!important;
  font-size:15px!important;
  line-height:1!important;
  font-family:inherit!important;
  cursor:pointer!important;
  transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease,opacity .16s ease!important;
}

#masteryCard .page-tool-button:not(:disabled):hover,
#facilitiesCard .page-tool-button:not(:disabled):hover,
#playstylesPanel .ps-page-k6 .page-tool-button:not(:disabled):hover{
  color:#ddd4b1!important;
  border-color:rgba(215,181,90,.20)!important;
  background:linear-gradient(180deg,rgba(215,181,90,.065),rgba(255,255,255,.017))!important;
  transform:translateY(-1px)!important;
}

#masteryCard .page-tool-button:active:not(:disabled),
#facilitiesCard .page-tool-button:active:not(:disabled),
#playstylesPanel .ps-page-k6 .page-tool-button:active:not(:disabled){
  transform:translateY(0)!important;
}

#masteryCard .page-tool-button:disabled,
#facilitiesCard .page-tool-button:disabled,
#playstylesPanel .ps-page-k6 .page-tool-button:disabled{
  opacity:.30!important;
  cursor:not-allowed!important;
  transform:none!important;
}

/* Mastery uses an SVG instead of a text glyph; scale it to the same optical size. */
#masteryCard .page-tool-button .mastery-clear-icon{
  width:15px!important;
  height:15px!important;
  stroke-width:1.9!important;
}

/* Facilities already uses a child span; keep its glyph aligned to the common size. */
#facilitiesCard .page-tool-button span{
  font-size:15px!important;
  line-height:1!important;
}

/* === SOURCE: css/138-v4647-mastery-grid-conflict-fix.css === */

/* v4.6.47 · retire the legacy v4.1.10k2 7+6 Mastery layout overrides.
   The new Mastery UI owns its own 2x2 grouped workspace. */
@media (min-width:861px){
  #advancedPanel #masteryList.mastery-list.mastery-groups{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-template-rows:auto auto!important;
    grid-template-areas:"def att" "mid gk"!important;
    grid-auto-flow:row!important;
    grid-auto-rows:auto!important;
    align-content:start!important;
    align-items:start!important;
    gap:14px!important;
    padding:12px 18px 18px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  #advancedPanel #masteryList .mastery-group-gk{grid-area:gk!important}
  #advancedPanel #masteryList .mastery-group-def{grid-area:def!important}
  #advancedPanel #masteryList .mastery-group-mid{grid-area:mid!important}
  #advancedPanel #masteryList .mastery-group-att{grid-area:att!important}
}

#advancedPanel #masteryList .mastery-group{
  min-width:0!important;
  height:auto!important;
  align-self:start!important;
  overflow:hidden!important;
}
#advancedPanel #masteryList .mastery-group-list{
  display:block!important;
  height:auto!important;
  min-height:0!important;
  padding:6px 8px 8px!important;
  overflow:visible!important;
}
#advancedPanel #masteryList .mastery-row{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(150px,.88fr) minmax(0,1fr) minmax(0,.86fr)!important;
  gap:10px!important;
  align-items:center!important;
  min-width:0!important;
  min-height:58px!important;
  height:auto!important;
  margin:6px 0!important;
  padding:8px 10px 8px 14px!important;
  border:1px solid transparent!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.014)!important;
  overflow:visible!important;
}
#advancedPanel #masteryList .mastery-row.selected{
  border-color:rgba(215,181,90,.14)!important;
  background:linear-gradient(90deg,rgba(215,181,90,.10),rgba(255,255,255,.02) 38%,rgba(255,255,255,.012))!important;
}
#advancedPanel #masteryList .mastery-row.current-model:not(.selected){
  border-color:rgba(121,160,216,.12)!important;
  background:linear-gradient(90deg,rgba(98,130,176,.08),rgba(255,255,255,.016))!important;
}
#advancedPanel #masteryList .mastery-row.fully-mastered{
  border-color:rgba(215,181,90,.14)!important;
  background:linear-gradient(90deg,rgba(215,181,90,.10),rgba(255,255,255,.02) 38%,rgba(255,255,255,.012))!important;
}
#advancedPanel #masteryList .mastery-model{
  gap:10px!important;
  padding:0!important;
  align-items:center!important;
}
#advancedPanel #masteryList .mastery-logo-shell{
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
}
#advancedPanel #masteryList .mastery-logo-shell img{
  width:31px!important;
  height:31px!important;
}
#advancedPanel #masteryList .mastery-model-copy strong{
  font-size:12px!important;
  line-height:1.15!important;
}
#advancedPanel #masteryList .mastery-model-copy small{
  margin-top:2px!important;
  font-size:9px!important;
  line-height:1.15!important;
}
#advancedPanel #masteryList .mastery-node{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:8px!important;
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  overflow:visible!important;
}
#advancedPanel #masteryList .mastery-node-level{
  min-width:38px!important;
  width:auto!important;
  height:22px!important;
  padding:0 7px!important;
  border-radius:999px!important;
  font-size:10px!important;
  line-height:1!important;
}
#advancedPanel #masteryList .mastery-node-stats{
  font-size:10.5px!important;
  line-height:1.4!important;
}

@media (max-width:860px){
  #advancedPanel #masteryList.mastery-list.mastery-groups{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:none!important;
    grid-template-areas:none!important;
    grid-auto-flow:row!important;
    gap:10px!important;
    overflow-y:visible!important;
  }
  #advancedPanel #masteryList .mastery-group{grid-area:auto!important}
  #advancedPanel #masteryList .mastery-row{
    grid-template-columns:1fr!important;
    gap:6px!important;
    min-height:0!important;
    padding:10px 10px 10px 14px!important;
  }
}

/* === SOURCE: css/139-v4650-mastery-column-layout-fix.css === */

/* v4.6.50 · final Mastery desktop layout authority.
   Use two real equal-width stacks instead of legacy grid placement. */
@media (min-width:861px){
  #advancedPanel #masteryList.mastery-list.mastery-groups{
    display:flex!important;
    flex-direction:row!important;
    align-items:flex-start!important;
    justify-content:stretch!important;
    width:100%!important;
    min-width:0!important;
    gap:12px!important;
    padding:10px 18px 16px!important;
    grid-template-columns:none!important;
    grid-template-rows:none!important;
    grid-template-areas:none!important;
    grid-auto-flow:initial!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  #advancedPanel #masteryList > .mastery-column{
    display:flex!important;
    flex-direction:column!important;
    flex:1 1 0!important;
    width:0!important;
    min-width:0!important;
    max-width:none!important;
    gap:10px!important;
    margin:0!important;
    padding:0!important;
    align-self:flex-start!important;
  }
  #advancedPanel #masteryList .mastery-group{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    margin:0!important;
    grid-area:auto!important;
    align-self:stretch!important;
    border-radius:14px!important;
    overflow:hidden!important;
  }
  #advancedPanel #masteryList .mastery-group-head{
    min-height:38px!important;
    height:38px!important;
    padding:0 13px!important;
  }
  #advancedPanel #masteryList .mastery-group-head strong{
    font-size:13px!important;
  }
  #advancedPanel #masteryList .mastery-group-head span{
    font-size:9px!important;
    opacity:.58!important;
  }
  #advancedPanel #masteryList .mastery-group-list{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:5px 7px 7px!important;
    overflow:visible!important;
  }
  #advancedPanel #masteryList .mastery-row{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(150px,.82fr) minmax(0,1.18fr) minmax(0,.82fr)!important;
    gap:9px!important;
    align-items:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:50px!important;
    height:auto!important;
    margin:4px 0!important;
    padding:6px 9px 6px 12px!important;
    border-radius:11px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  #advancedPanel #masteryList .mastery-model{
    gap:9px!important;
    padding:0!important;
  }
  #advancedPanel #masteryList .mastery-logo-shell{
    width:32px!important;
    height:32px!important;
    flex:0 0 32px!important;
  }
  #advancedPanel #masteryList .mastery-logo-shell img{
    width:29px!important;
    height:29px!important;
  }
  #advancedPanel #masteryList .mastery-model-copy strong{
    font-size:11.5px!important;
    line-height:1.1!important;
  }
  #advancedPanel #masteryList .mastery-model-copy small{
    margin-top:2px!important;
    font-size:8px!important;
    line-height:1.1!important;
  }
  #advancedPanel #masteryList .mastery-node{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    overflow:visible!important;
  }
  #advancedPanel #masteryList .mastery-node-level{
    min-width:36px!important;
    height:20px!important;
    padding:0 6px!important;
    font-size:9px!important;
    line-height:1!important;
  }
  #advancedPanel #masteryList .mastery-node-stats{
    min-width:0!important;
    font-size:10px!important;
    line-height:1.28!important;
    white-space:normal!important;
  }
  /* Current archetype is only a locator, not a selected-Mastery state. */
  #advancedPanel #masteryList .mastery-row.current-model:not(.selected){
    border-color:rgba(121,160,216,.075)!important;
    background:linear-gradient(90deg,rgba(98,130,176,.035),rgba(255,255,255,.012))!important;
  }
}

@media (max-width:860px){
  #advancedPanel #masteryList.mastery-list.mastery-groups{
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    padding:8px 10px 12px!important;
    overflow-y:visible!important;
  }
  #advancedPanel #masteryList > .mastery-column{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
  }
}

/* === SOURCE: css/140-v4651-mastery-one-screen-compact.css === */

/* v4.6.51 · one-screen Mastery density pass.
   Compress vertical chrome and spacing without sacrificing content type sizes. */
@media (min-width:861px){
  #masteryCard > .mastery-head{
    min-height:70px!important;
    height:70px!important;
    padding:10px 20px 11px!important;
    box-sizing:border-box!important;
  }
  #masteryCard > .mastery-head .advanced-kicker{
    font-size:9px!important;
    line-height:1!important;
  }
  #masteryCard > .mastery-head h2{
    margin-top:2px!important;
    font-size:18px!important;
    line-height:1.06!important;
  }
  #masteryCard > .mastery-head p{
    margin-top:5px!important;
    font-size:10px!important;
    line-height:1.3!important;
  }

  #masteryCard .mastery-toolbar{
    min-height:42px!important;
    height:42px!important;
    padding:0 18px!important;
    gap:12px!important;
    box-sizing:border-box!important;
  }
  #masteryCard .mastery-toolbar-stats{gap:10px!important}
  #masteryCard .mastery-metric{gap:6px!important}
  #masteryCard .mastery-metric span{font-size:10px!important}
  #masteryCard .mastery-metric strong{font-size:14px!important}
  #masteryCard .mastery-metric-divider{height:16px!important}
  #masteryCard .mastery-toolbar-tools{gap:6px!important}
  #masteryCard .mastery-bulk-btn{
    height:30px!important;
    min-width:54px!important;
    padding:0 10px!important;
    border-radius:9px!important;
    font-size:11px!important;
  }
  #masteryCard .mastery-visibility-btn,
  #masteryCard .page-tool-button{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    flex:0 0 30px!important;
    border-radius:9px!important;
  }
  #masteryCard .mastery-eye{width:14px!important;height:14px!important}

  #advancedPanel #masteryList.mastery-list.mastery-groups{
    gap:12px!important;
    padding:6px 18px 8px!important;
    overflow-y:hidden!important;
    overflow-x:hidden!important;
    align-items:flex-start!important;
  }
  #advancedPanel #masteryList > .mastery-column{
    gap:6px!important;
  }
  #advancedPanel #masteryList .mastery-group{
    border-radius:13px!important;
  }
  #advancedPanel #masteryList .mastery-group-head{
    min-height:32px!important;
    height:32px!important;
    padding:0 12px!important;
  }
  #advancedPanel #masteryList .mastery-group-head strong{
    font-size:12.5px!important;
  }
  #advancedPanel #masteryList .mastery-group-head span{
    font-size:8.5px!important;
  }
  #advancedPanel #masteryList .mastery-group-list{
    padding:3px 6px 5px!important;
  }
  #advancedPanel #masteryList .mastery-row{
    min-height:45px!important;
    height:45px!important;
    margin:2px 0!important;
    padding:4px 8px 4px 11px!important;
    gap:8px!important;
    border-radius:10px!important;
    box-sizing:border-box!important;
  }
  #advancedPanel #masteryList .mastery-row::before{
    top:8px!important;
    bottom:8px!important;
  }
  #advancedPanel #masteryList .mastery-model{
    gap:8px!important;
  }
  #advancedPanel #masteryList .mastery-logo-shell{
    width:30px!important;
    height:30px!important;
    flex:0 0 30px!important;
  }
  #advancedPanel #masteryList .mastery-logo-shell img{
    width:28px!important;
    height:28px!important;
  }
  #advancedPanel #masteryList .mastery-model-copy strong{
    font-size:11.5px!important;
    line-height:1.05!important;
  }
  #advancedPanel #masteryList .mastery-model-copy small{
    margin-top:1px!important;
    font-size:8px!important;
    line-height:1.05!important;
  }
  #advancedPanel #masteryList .mastery-node{
    gap:6px!important;
  }
  #advancedPanel #masteryList .mastery-node-level{
    min-width:34px!important;
    height:19px!important;
    padding:0 5px!important;
    font-size:8.5px!important;
  }
  #advancedPanel #masteryList .mastery-node-stats{
    font-size:10px!important;
    line-height:1.2!important;
  }
}

/* === SOURCE: css/141-v4654-specialization-copper-silver-gold.css === */

/* v4.6.54 · Specialization state hierarchy
   Focus = copper, Unlocked = silver, Equipped = existing gold + growth.
   Browsing/focus never moves a card; only equipped state owns geometry motion. */

:root{
  --spec-copper:177,125,75;
  --spec-silver:198,208,219;
}

/* Selection and hover are visual-only: no lift, no scale, no portrait zoom. */
.specialization-card:not(.state-3),
.specialization-card:not(.state-3):hover,
.specialization-card.is-focused:not(.state-3){
  transform:none!important;
}
.specialization-card:not(.state-3):hover .spec-player-image img,
.specialization-card.is-focused:not(.state-3) .spec-player-image img{
  transform:none!important;
}

/* LOCKED — intentionally darker and flatter than every other state. */
.specialization-card.state-1{
  opacity:1!important;
  border-color:rgba(255,255,255,.045)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.008),transparent 30%),
    rgba(8,13,18,.965)!important;
  box-shadow:0 12px 28px rgba(0,0,0,.20),inset 0 0 0 1px rgba(255,255,255,.008)!important;
}
.specialization-card.state-1 .spec-player-image img{
  filter:grayscale(.96) saturate(.22) brightness(.50)!important;
}
.specialization-card.state-1 .spec-player-image>span{
  color:#59636d!important;
}
.specialization-card.state-1 .spec-card-title h3{
  color:#7d8790!important;
}
.specialization-card.state-1 .spec-card-title>span{
  color:#505b65!important;
}
.specialization-card.state-1 .spec-requirements,
.specialization-card.state-1 .spec-reward-row{
  opacity:.67;
}
.specialization-card.state-1 .spec-card-status{
  color:#68737e!important;
  border-color:rgba(255,255,255,.065)!important;
  background:rgba(7,11,15,.88)!important;
  box-shadow:none!important;
}
.specialization-card.state-1 .spec-action-btn{
  opacity:.74;
}

/* LOCKED + FOCUSED — copper means "this is the card I'm operating".
   It remains visibly locked; focus does not make it look unlocked. */
.specialization-card.state-1.is-focused{
  border-color:rgba(var(--spec-copper),.78)!important;
  background:
    linear-gradient(180deg,rgba(var(--spec-copper),.045),transparent 28%),
    rgba(10,15,20,.97)!important;
  box-shadow:
    0 14px 32px rgba(0,0,0,.23),
    0 0 0 1px rgba(var(--spec-copper),.12),
    inset 0 0 22px rgba(var(--spec-copper),.035)!important;
}
.specialization-card.state-1.is-focused .spec-player-image img{
  filter:grayscale(.82) saturate(.34) brightness(.59)!important;
}
.specialization-card.state-1.is-focused .spec-card-title h3{
  color:#a8907a!important;
}
.specialization-card.state-1.is-focused .spec-card-status{
  color:#b78a60!important;
  border-color:rgba(var(--spec-copper),.28)!important;
}

/* UNLOCKED — a permanent silver identity, clearly brighter than locked. */
.specialization-card.state-2{
  opacity:1!important;
  border-color:rgba(var(--spec-silver),.40)!important;
  background:
    radial-gradient(ellipse 80% 28% at 50% -4%,rgba(var(--spec-silver),.075),transparent 72%),
    linear-gradient(145deg,rgba(255,255,255,.040),rgba(255,255,255,.010) 44%,transparent 72%),
    rgba(12,18,24,.965)!important;
  box-shadow:
    0 15px 34px rgba(0,0,0,.20),
    inset 0 0 0 1px rgba(225,233,240,.045),
    inset 0 18px 30px rgba(var(--spec-silver),.025)!important;
}
.specialization-card.state-2 .spec-player-image img{
  filter:saturate(.94) brightness(.97)!important;
}
.specialization-card.state-2 .spec-player-image>span{
  color:#a9b4be!important;
}
.specialization-card.state-2 .spec-card-title h3{
  color:#edf2f6!important;
}
.specialization-card.state-2 .spec-card-title>span{
  color:#7c8894!important;
}
.specialization-card.state-2 .spec-requirements,
.specialization-card.state-2 .spec-reward-row{
  opacity:1!important;
}
.specialization-card.state-2 .spec-card-status{
  color:#c8d1da!important;
  border-color:rgba(var(--spec-silver),.30)!important;
  background:rgba(25,32,39,.86)!important;
  box-shadow:inset 0 0 12px rgba(var(--spec-silver),.025)!important;
}
.specialization-card.state-2 .spec-action-btn.is-equip{
  color:#d4dbe2!important;
  border-color:rgba(var(--spec-silver),.28)!important;
  background:linear-gradient(180deg,rgba(var(--spec-silver),.065),rgba(255,255,255,.018))!important;
}

/* UNLOCKED + FOCUSED — preserve the silver card itself, then add a thin copper
   outer focus ring. This keeps "unlocked" and "selected" legible at once. */
.specialization-card.state-2.is-focused{
  border-color:rgba(var(--spec-silver),.48)!important;
  box-shadow:
    0 15px 34px rgba(0,0,0,.22),
    0 0 0 2px rgba(var(--spec-copper),.60),
    0 0 18px rgba(var(--spec-copper),.065),
    inset 0 0 0 1px rgba(225,233,240,.055)!important;
}

/* Equipped remains the existing premium gold state. Focus must never replace it. */
.specialization-card.state-3.is-focused{
  outline:none!important;
}

/* Buttons become visually ready only on the card currently being operated,
   without disabling direct interaction. */
.specialization-card.state-1:not(.is-focused) .spec-action-btn.is-match,
.specialization-card.state-2:not(.is-focused) .spec-action-btn.is-equip{
  opacity:.72;
}
.specialization-card.state-1.is-focused .spec-action-btn.is-match,
.specialization-card.state-2.is-focused .spec-action-btn.is-equip{
  opacity:1!important;
}

@media(max-width:760px){
  .specialization-card.state-2.is-focused{
    box-shadow:
      0 12px 28px rgba(0,0,0,.20),
      0 0 0 1.5px rgba(var(--spec-copper),.58),
      inset 0 0 0 1px rgba(225,233,240,.05)!important;
  }
}

/* === SOURCE: css/142-v4655-specialization-undo.css === */

/* v4.6.55 — specialization local action is Undo, not Reset. */
.spec-local-undo-btn:disabled{
  opacity:.34!important;
  cursor:default!important;
  border-color:rgba(255,255,255,.055)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.01))!important;
  color:#737d86!important;
  transform:none!important;
  box-shadow:none!important;
}
.spec-local-undo-btn:disabled .spec-local-reset-icon{color:#737d86!important}
