/* Character dossier visual connections, 2026. */
.ids-character-connections{box-sizing:border-box;position:relative;overflow:hidden;margin:3rem 0 2rem;padding:clamp(1rem,3vw,2.4rem);border:1px solid #75333c;border-radius:16px;color:#f6eff1;background:radial-gradient(ellipse at 80% 0%,#431824 0,transparent 57%),linear-gradient(135deg,#14141d,#08090e 70%)}
.ids-character-connections *{box-sizing:border-box}
.ids-character-connections header{margin-bottom:1.4rem}
.ids-connection-kicker{color:#f39298;font-size:.72rem;letter-spacing:.19em;font-weight:800}
.ids-character-connections h2{color:#fff!important;font-size:clamp(1.6rem,3vw,2.35rem)!important;line-height:1.15;margin:.55rem 0!important}
.ids-character-connections header p{color:#cec8d1;line-height:1.65;max-width:72ch}
.ids-connection-network{display:grid;grid-template-columns:minmax(145px,.75fr) minmax(0,2fr);align-items:center;gap:clamp(.9rem,3vw,2rem);padding:1.7rem 0;border-top:1px solid #504049;border-bottom:1px solid #504049}
.ids-connection-center{display:flex;flex-direction:column;align-items:center;justify-content:center;justify-self:center;aspect-ratio:1;width:100%;max-width:226px;border:2px solid #cf606b;outline:7px solid #491d28;border-radius:50%;padding:1rem;text-align:center;background:radial-gradient(circle,#532332,#12121a 75%);box-shadow:0 0 42px #411a2688}
.ids-connection-center strong{color:#fff;font-size:clamp(1.05rem,2.2vw,1.5rem);line-height:1.2;padding:.6rem 0}
.ids-connection-center small,.ids-connection-center span{color:#deabb1;font-size:.62rem;letter-spacing:.09em}
.ids-connection-nodes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.ids-character-connections .ids-connection-node{position:relative;display:block;min-height:78px;padding:.7rem 1.45rem .7rem .85rem;border:0;border-left:2px solid #df737a;border-radius:0 9px 9px 0;background:#ffffff0d;text-decoration:none}
.ids-character-connections .ids-connection-node strong,.ids-character-connections .ids-connection-entry strong{display:block;color:#fefafa;font-size:.9rem}
.ids-character-connections .ids-connection-node small,.ids-character-connections .ids-connection-entry small{display:block;color:#b8b5be;line-height:1.4;font-size:.73rem;margin-top:.2rem}
.ids-character-connections .ids-connection-node>span,.ids-character-connections .ids-connection-entry>span{position:absolute;right:.45rem;top:.75rem;color:#fa9da4}
.ids-character-connections .ids-connection-node:hover,.ids-character-connections .ids-connection-entry:hover,.ids-character-connections .ids-connection-node:focus-visible,.ids-character-connections .ids-connection-entry:focus-visible{background:#8f2f4052}
.ids-connection-subheading{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.4rem 1rem;margin:1.7rem 0 .8rem}
.ids-character-connections .ids-connection-subheading h3{font-size:1.3rem!important;color:#fff!important;margin:0!important}
.ids-connection-subheading p{color:#b5adb8;font-size:.8rem;margin:0!important}
.ids-connection-bands{border-top:1px solid #57414a}
.ids-connection-band{border-bottom:1px solid #57414a}
.ids-connection-band summary{display:flex;align-items:center;gap:.8rem;cursor:pointer;list-style:none;padding:1.05rem .2rem;color:#fff}
.ids-connection-band summary::-webkit-details-marker{display:none}
.ids-connection-band summary em{color:#f08b95;font-style:normal;font-size:.8rem;font-weight:800}
.ids-connection-band summary>span{flex:1}
.ids-connection-band summary strong{display:block;font-size:1rem;color:#fff}
.ids-connection-band summary small{display:block;margin-top:.2rem;color:#b8acb9;font-size:.78rem;line-height:1.4}
.ids-connection-band summary b{font-size:1.35rem;color:#f18b94;transition:transform .2s}
.ids-connection-band[open] summary b{transform:rotate(45deg)}
.ids-connection-entries{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;padding:0 0 1rem 1.6rem}
.ids-character-connections .ids-connection-entry{position:relative;display:block;padding:.65rem 1.5rem .65rem .75rem;border-radius:8px;background:#ffffff0a;text-decoration:none}
.ids-connection-timeline{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(170px,1fr);overflow-x:auto;gap:0;scroll-snap-type:x proximity;padding:0!important;margin:1.25rem 0!important;list-style:none}
.ids-connection-timeline li{position:relative;list-style:none;scroll-snap-align:start;padding:1.5rem .9rem .5rem;border-top:2px solid #b95163}
.ids-connection-timeline li:before{content:"";position:absolute;top:-7px;left:.95rem;width:11px;height:11px;border:2px solid #ef8892;border-radius:50%;background:#130e18}
.ids-connection-timeline strong{color:#ffc1c5;font-size:.86rem}
.ids-connection-timeline p{font-size:.78rem;line-height:1.5;color:#c7c1c8;margin:.3rem 0!important}
.ids-connection-next{border-top:1px solid #57414a;margin:1.2rem 0 0!important;padding-top:1rem;color:#bcb4c0;font-size:.82rem}
.ids-character-connections .ids-connection-next a{color:#ffa7ae}
.ids-character-connections a:focus-visible,.ids-character-connections summary:focus-visible{outline:2px solid #ffa7ae;outline-offset:3px}
@media(max-width:740px){.ids-connection-network{grid-template-columns:1fr}.ids-connection-center{max-width:172px}.ids-connection-timeline{grid-auto-columns:minmax(175px,65%)}}
@media(max-width:470px){.ids-character-connections{padding:1rem}.ids-connection-nodes,.ids-connection-entries{grid-template-columns:1fr}.ids-connection-entries{padding-left:0}.ids-character-connections .ids-connection-node{min-height:0}}

/* Match the existing Vader dossier architecture on standard character pages.
   These neutral accents keep movie, television, comic and game profiles uniform. */
.ids-connected-generated{grid-column:1/-1;width:min(100%,1200px);max-width:100%;margin:2.75rem auto;padding:clamp(1rem,3vw,2.3rem);border-color:#56616c;background:radial-gradient(ellipse at 80% 0%,#282d36 0,transparent 60%),linear-gradient(140deg,#171a20,#090b0e 75%)}
.ids-connected-generated .ids-connection-kicker{color:#c8d2df}
.ids-connected-generated .ids-connection-center{border-color:#9eafc0;outline-color:#333b45;background:radial-gradient(circle,#303b48,#11151a 75%);box-shadow:0 0 38px #202a3688}
.ids-connected-generated .ids-connection-center small,.ids-connected-generated .ids-connection-center span{color:#d3dce7}
.ids-connected-generated .ids-connection-node{border-left-color:#9cabbc}
.ids-connected-generated .ids-connection-node>span,.ids-connected-generated .ids-connection-entry>span,.ids-connected-generated .ids-connection-band summary em,.ids-connected-generated .ids-connection-band summary b{color:#d2dce8}
.ids-connected-generated .ids-connection-timeline li{border-top-color:#98a8b9}
.ids-connected-generated .ids-connection-timeline li:before{border-color:#d9e2eb}
.ids-connected-generated .ids-connection-timeline strong,.ids-connected-generated .ids-connection-next a{color:#dbe5ef}
.ids-connected-generated a:focus-visible,.ids-connected-generated summary:focus-visible{outline-color:#f1f5f9}

/* Keyboard navigation, long names and reduced motion across authored and generated panels. */
.ids-character-connections .ids-connection-node strong,
.ids-character-connections .ids-connection-entry strong,
.ids-character-connections .ids-connection-center strong{overflow-wrap:anywhere}
.ids-connection-timeline{overscroll-behavior-inline:contain;scrollbar-gutter:stable}
.ids-character-connections .ids-connection-timeline:focus-visible{outline:2px solid #ffa7ae;outline-offset:3px;border-radius:4px}
.ids-connected-generated .ids-connection-timeline:focus-visible{outline-color:#f1f5f9}
@media (prefers-reduced-motion:reduce){
  .ids-connection-band summary b{transition:none}
  .ids-connection-timeline{scroll-behavior:auto}
}