/* 宠物羁绊 / 合体技 / 专属命座（宠物面板「羁绊·命座」页，类名前缀 pb-；星图复用 constellation.css 的 cst-） */
.pb-line { gap: 6px; margin-top: 2px; }
.pb-main { gap: 10px; min-width: 0; overflow: auto; }
.pb-bond { --cc: #7dff8a; display: flex; flex-direction: column; gap: 8px; background: radial-gradient(70% 90% at 50% 0%, color-mix(in srgb, var(--cc) 14%, transparent), transparent 70%), linear-gradient(180deg, #1c1436, #120c22); }
.pb-duo { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.pb-side { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.pb-side > img { image-rendering: pixelated; height: 96px; object-fit: contain; filter: drop-shadow(0 3px 0 #07040f) drop-shadow(0 0 10px color-mix(in srgb, var(--ec) 60%, transparent)); }
.pb-side > .pb-hero { filter: drop-shadow(0 3px 0 #07040f) drop-shadow(0 0 10px color-mix(in srgb, var(--hc) 60%, transparent)); }
.pb-mid { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; max-width: 180px; }
.pb-heart { font-size: 30px; color: #ff7ab6; text-shadow: 0 0 12px #ff7ab6, 0 2px 0 #07040f; animation: pbBeat 1.2s ease-in-out infinite; }
@keyframes pbBeat { 15% { transform: scale(1.25); } 30% { transform: scale(1); } 45% { transform: scale(1.15); } 60% { transform: scale(1); } }
.pb-compat { font-size: 18px; letter-spacing: .2em; text-shadow: 0 2px 0 #07040f, 0 0 10px currentColor; }
.pb-mid .dim { font-size: 11px; }
.pb-lv { display: flex; align-items: baseline; gap: 6px; } .pb-lv b { font-size: 22px; color: #ff9ad8; } .pb-title { color: #ffd0e8; }
.pb-bonus { font-size: 12px; line-height: 1.65; color: #d8d0f0; }
.pb-combo { --ca: #ff6a3a; --cb: #7fe6ff; position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 6px; opacity: .72;
  background: linear-gradient(120deg, color-mix(in srgb, var(--ca) 22%, #140e26), #110b20 45%, color-mix(in srgb, var(--cb) 22%, #140e26)); box-shadow: 0 0 0 2px var(--ink), inset 0 0 0 1px color-mix(in srgb, var(--ca) 45%, transparent); }
.pb-combo.on { opacity: 1; box-shadow: 0 0 0 2px var(--ink), inset 0 0 0 1px var(--ca), 0 0 18px color-mix(in srgb, var(--ca) 35%, transparent); }
.pb-combo.none { opacity: 1; background: #140e26; }
.pb-cbg { position: absolute; inset: -40% -10%; pointer-events: none; background: conic-gradient(from 0deg, transparent, color-mix(in srgb, var(--ca) 25%, transparent), transparent 30%, color-mix(in srgb, var(--cb) 25%, transparent), transparent 60%); animation: pbSpin 8s linear infinite; opacity: .6; }
@keyframes pbSpin { to { transform: rotate(360deg); } }
.pb-combo > * { position: relative; }
.pb-cname small { display: block; font-size: 11px; letter-spacing: .4em; color: #c8b8f0; }
.pb-cname b { font-size: 24px; letter-spacing: .12em; background: linear-gradient(90deg, var(--ca), #ffffff 50%, var(--cb)); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 2px 0 #07040f); }
.pb-combo.none .pb-cname b { background: none; color: #8a80b0; }
.pb-csub { font-size: 13px; color: #e8e0ff; font-style: italic; }
.pb-ctxt { font-size: 12px; line-height: 1.6; color: #c8c0e0; }
.pb-chow { font-size: 12px; color: #ffd84a; }
.pb-cons { display: flex; flex-direction: column; gap: 6px; }
.pb-consgrid { display: grid; grid-template-columns: minmax(200px, 300px) 1fr; gap: 12px; align-items: start; }
.cst-chart.pb-chart { width: 100%; }
.pb-conslist { min-width: 0; }
.pb-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.pb-gc { --ec: #b48cff; display: flex; align-items: center; gap: 5px; padding: 4px 8px; font-size: 12px; background: color-mix(in srgb, var(--ec) 10%, #120c22); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ec) 35%, transparent); clip-path: var(--notch); }
.pb-gc b { color: var(--ec); font-weight: normal; } .pb-gc span { margin-left: auto; font-size: 11px; } .pb-gc img { image-rendering: pixelated; }
.pb-gc.cur { box-shadow: inset 0 0 0 2px var(--ec), 0 0 8px var(--ec); }
@media (max-width: 760px), (pointer: coarse) {
  .win-body.pb-body { flex-direction: column; }
  .win-body.pb-body > .pet-list { width: 100% !important; max-height: 132px; }
  .pb-side > img { height: 64px; }
  .pb-consgrid { grid-template-columns: 1fr; }
  .cst-chart.pb-chart { width: min(100%, 300px); justify-self: center; }
  .pb-grid { grid-template-columns: repeat(2, 1fr); }
  .pb-cname b { font-size: 19px; }
  .pb-cons h3.sec .sec-x { display: none; }
}