@import url('/css/overview-dashboard-upgrade.css');
@import url('/css/mobile-polish.css');
.parity-editor{display:grid;grid-template-columns:minmax(190px,.72fr) minmax(0,1.28fr);gap:18px;margin-top:14px}.parity-editor-art{position:relative;display:grid;place-items:center;align-self:start;min-height:310px;border:1px solid rgba(255,255,255,.09);border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 34%,rgba(99,165,255,.20),transparent 44%),linear-gradient(160deg,rgba(22,31,51,.95),rgba(9,16,29,.98))}.parity-editor.is-mastered .parity-editor-art{border-color:rgba(255,70,88,.62);box-shadow:0 0 22px rgba(255,70,88,.18),inset 0 0 26px rgba(255,70,88,.07)}.parity-editor-art img{width:min(240px,86%);height:235px;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(0,0,0,.45));animation:public-sprite-float 4.6s ease-in-out infinite}.parity-editor-badges{position:absolute;left:10px;right:10px;top:10px;display:flex;flex-wrap:wrap;gap:6px}.parity-editor-badges span{padding:5px 8px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(5,10,19,.78);font-size:.6rem;font-weight:900;letter-spacing:.04em}.parity-editor-badges .status{margin-left:auto;color:#8feeff}.parity-editor.is-mastered .parity-editor-badges .status{color:#ff9eaa}.parity-editor-copy h3{margin:5px 0 7px;font-size:1.55rem}.parity-power{margin:0 0 13px;color:#b8c5d6;line-height:1.55}.parity-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.parity-info-grid>div,.parity-level-power{padding:11px 12px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(5,12,24,.48)}.parity-info-grid span,.parity-level-power span{display:block;color:#74859d;font-size:.57rem;font-weight:900;letter-spacing:.09em}.parity-info-grid strong,.parity-level-power strong{display:block;margin-top:5px;color:#edf4ff;font-size:.76rem;line-height:1.4}.parity-level-power{margin:8px 0 12px;border-color:rgba(255,212,92,.16);background:linear-gradient(145deg,rgba(255,212,92,.055),rgba(5,12,24,.54))}.parity-levels button{position:relative;overflow:hidden;font-weight:900}.parity-levels .level-rank-1{border-color:rgba(220,229,243,.55)}.parity-levels .level-rank-2{border-color:rgba(91,232,128,.65);color:#8ff0a7}.parity-levels .level-rank-3{border-color:rgba(99,165,255,.7);color:#9ac4ff}.parity-levels .level-rank-4{border-color:rgba(199,116,255,.72);color:#d29cff}.parity-levels .level-rank-5{border-color:rgba(255,224,107,.78);color:#ffe98c}.parity-levels button.active{color:#08121d;box-shadow:0 0 16px currentColor}.parity-levels .level-rank-1.active{background:#dce5f3}.parity-levels .level-rank-2.active{background:#5be880}.parity-levels .level-rank-3.active{background:#63a5ff}.parity-levels .level-rank-4.active{background:#c774ff}.parity-levels .level-rank-5.active{background:#ffe06b}.parity-status{grid-template-columns:repeat(3,1fr);margin-bottom:10px}.parity-status button.active{border-color:#69dff2;color:#fff;background:linear-gradient(145deg,rgba(54,220,255,.15),rgba(108,69,255,.16))}.parity-mastery-note{display:flex;gap:10px;align-items:center;margin-top:12px;padding:11px 12px;border:1px solid rgba(255,70,88,.28);border-radius:12px;background:linear-gradient(130deg,rgba(255,70,88,.10),rgba(255,212,92,.04));color:#fff}.parity-mastery-note>span{font-size:1.3rem}.parity-mastery-note strong,.parity-mastery-note small{display:block}.parity-mastery-note strong{color:#ff9eaa;font-size:.72rem;letter-spacing:.07em}.parity-mastery-note small{margin-top:3px;color:#aeb9ca;line-height:1.4}.parity-mastery-note.pending{border-color:rgba(255,255,255,.08);background:rgba(255,255,255,.025)}.parity-mastery-note.pending strong{color:#c2ccda}.parity-save{width:100%;margin-top:12px}.sprite-info-trigger{display:block!important;visibility:visible!important;opacity:1!important}.familyhead .sprite-info-trigger{order:3}.familyhead{align-items:flex-start}.variant{position:relative}.mastery-crown{position:absolute;top:8px;right:8px;z-index:6;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;color:#ffd86b;background:radial-gradient(circle,rgba(255,216,107,.22),rgba(74,20,32,.88));border:1px solid rgba(255,216,107,.72);font-size:1.05rem;line-height:1;filter:drop-shadow(0 0 8px rgba(255,216,107,.45));box-shadow:0 0 18px rgba(255,70,88,.24)}.mastery-card-label{margin-top:2px;color:#ff9eaa;font-size:.62rem;font-weight:1000;letter-spacing:.11em;text-shadow:0 0 10px rgba(255,70,88,.32)}.sprite-mastered .vn{color:#fff}.sprite-mastered .vs{margin-top:3px}@media(max-width:720px){.familyhead:has(.sprite-info-trigger){display:grid;grid-template-columns:1fr auto;align-items:start}.familyhead .sprite-info-trigger{grid-column:1/-1;min-height:42px;font-size:.72rem}.parity-editor{grid-template-columns:1fr}.parity-editor-art{min-height:220px}.parity-editor-art img{height:170px}.parity-info-grid{grid-template-columns:1fr}.parity-status{grid-template-columns:1fr}.dialog{max-height:92dvh;overflow:auto}.parity-levels button{min-height:44px}.mastery-crown{width:27px;height:27px;top:7px;right:7px}.mastery-card-label{font-size:.58rem}}@media(prefers-reduced-motion:reduce){.parity-editor-art img{animation:none!important}}

/* Collection states stay visually obvious without adding another card style. */
.variant.collected:not(.sprite-mastered) img{
  opacity:1;
  filter:drop-shadow(0 0 13px rgba(105,223,242,.42)) drop-shadow(0 16px 20px rgba(0,0,0,.42));
}
.variant.missing img{
  opacity:.38;
  filter:grayscale(.72) saturate(.42) contrast(.88);
}
.variant.lost img{
  opacity:.68;
  filter:grayscale(.28) saturate(.62) drop-shadow(0 12px 18px rgba(0,0,0,.46));
}
.lost-fracture{
  position:absolute;
  inset:0;
  z-index:7;
  overflow:hidden;
  pointer-events:none;
}
.lost-fracture i{
  position:absolute;
  left:48%;
  top:7%;
  width:2px;
  height:46%;
  border-radius:2px;
  background:linear-gradient(#fff0,#f4f7ff 18%,#617083 48%,#f4f7ff 82%,#fff0);
  box-shadow:0 0 3px rgba(0,0,0,.9);
  transform-origin:top;
}
.lost-fracture i:nth-child(1){transform:rotate(18deg)}
.lost-fracture i:nth-child(2){height:34%;transform:rotate(-31deg)}
.lost-fracture i:nth-child(3){top:38%;height:31%;transform:rotate(52deg)}
.lost-fracture i:nth-child(4){left:64%;top:33%;height:27%;transform:rotate(-58deg)}
.parity-editor.is-missing .parity-editor-art img{
  opacity:.42;
  filter:grayscale(.72) saturate(.42);
}
.parity-editor.is-lost .parity-editor-art img{
  opacity:.7;
  filter:grayscale(.25) saturate(.64) drop-shadow(0 18px 24px rgba(0,0,0,.45));
}
.parity-save-note{
  display:block;
  margin-top:7px;
  color:#9eabbd;
  font-size:.7rem;
  line-height:1.45;
  text-align:center;
}
