/* A single detail collection, shared by relationship and release-date views. */
.connection-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.connection-heading .eyebrow{font-size:9px;letter-spacing:1.8px;margin:0 0 7px;color:#8996aa}
.connection-heading h3{display:flex;align-items:center;gap:12px;margin:0;font-size:21px;font-weight:600;line-height:1.5}
#connection-total{padding:2px 8px;border:1px solid #ffffff16;border-radius:6px;color:#9eaabd;font-size:11px;font-weight:400;white-space:nowrap}
#connection-expand{flex:none;min-height:38px;padding:8px 11px;border:1px solid #ffffff20;border-radius:8px;background:#ffffff03;color:#a7b3c6;font-size:11px}
#connection-expand:hover{border-color:#d4f58a40;color:var(--lime)}
#connection-expand:disabled{cursor:wait;opacity:.6}
.connection-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--line)}
.connection-tabs{display:inline-flex;gap:4px;padding:4px;border:1px solid #ffffff12;border-radius:10px;background:#11141c}
.connection-tabs>button{min-height:36px;padding:8px 15px;border:0;border-radius:7px;background:transparent;color:#98a6bb;font-size:12px;white-space:nowrap}
.connection-tabs>button[aria-selected=true]{background:#d4f58a17;color:var(--lime)}
.connection-filter{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0;color:#a6b2c4;font-size:11px;cursor:pointer;white-space:nowrap}
.connection-filter input{width:15px;height:15px;min-width:15px;margin:0;padding:0;accent-color:var(--lime)}
.connection-status{min-height:20px;margin:11px 0 16px;color:#8b9aaf;font-size:11px;line-height:1.8}
#retry-relations{min-height:38px;margin:0 0 16px;padding:8px 12px;border:1px solid #ffffff24;border-radius:8px;background:#252c3a;color:#dce5f2;font-size:12px}
.connection-note,.connection-empty-note{margin:18px 0 0;color:#8290a5;font-size:11px;line-height:1.9}
.connection-warning{padding:12px;margin:12px 0;border:1px solid #d5b87c33;border-radius:9px;background:#d5b87c0a;color:#d8c194;font-size:11px;line-height:1.8}
.connection-group{margin:20px 0 0}.connection-group:first-child{margin-top:0}
.connection-group-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}
.connection-group-heading h4{margin:0;font-size:13px;font-weight:550;color:#c4cddc}
.connection-group-heading>span{color:#8291a6;font-size:10px}
.connection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.connection-card{position:relative;display:grid;grid-template-columns:60px minmax(0,1fr);column-gap:14px;row-gap:8px;min-width:0;padding:14px;border:1px solid #ffffff12;border-radius:12px;background:#11141c;align-content:start}
.connection-card>.cover-retry{left:14px;top:14px;width:60px;height:86px;min-height:0;max-width:none;padding:5px;font-size:10px;line-height:1.6}
.connection-list .connection-card>.cover-retry{left:52px;top:12px;width:46px;height:66px}
.connection-cover{position:relative;grid-column:1;grid-row:1/3;display:block;width:60px;height:86px;min-width:0;margin:0;padding:0;border:1px solid #ffffff0d;border-radius:7px;overflow:hidden;background:#252b38}
.connection-cover img{display:block;width:100%;height:100%;object-fit:cover}
.connection-cover:disabled{opacity:1;cursor:default}
.connection-copy{grid-column:2;grid-row:1;min-width:0}
.connection-copy h4{margin:6px 0 4px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;font-weight:600;line-height:1.6;overflow-wrap:anywhere;color:#e2e7ef}
.connection-badges{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.connection-badges>span{padding:2px 6px;border:1px solid #ffffff0f;border-radius:5px;background:#ffffff03;color:#92a0b5;font-size:9px;line-height:1.5}
.connection-badges .connection-current-badge{border-color:#d4f58a30;background:#d4f58a0e;color:var(--lime)}
.connection-badges [data-state=watching]{border-color:#9bb6ec25;color:#a2c0f2;background:#9bb6ec08}
.connection-badges [data-state=completed]{border-color:#d4f58a25;color:#b8d68b;background:#d4f58a08}
.connection-meta{margin:0;color:#8291a6;font-size:10px;line-height:1.8}
.connection-actions{grid-column:2;grid-row:2;display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.connection-actions>button{min-height:32px;padding:6px 10px;border:1px solid #ffffff22;border-radius:6px;background:transparent;color:#b7c3d5;font-size:10px;white-space:nowrap}
.connection-actions>[data-related-save]{border-color:#d4f58a28;color:#c6dfa5;background:#d4f58a05}
.connection-actions>button:disabled{color:#8794a6;border-color:#ffffff10;background:transparent;opacity:.7;cursor:default}
.connection-current{display:flex;align-items:center;gap:10px;min-width:0;margin:18px 0;padding:13px 14px;border:1px solid #d4f58a22;border-radius:9px;background:#d4f58a05;color:#8f9db0;font-size:10px}
.connection-dot{width:5px;height:5px;border-radius:50%;background:var(--lime);flex:none}
.connection-current>span{flex:none}.connection-current strong{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#d6dfec;font-size:13px;font-weight:550}
.connection-current-state{margin-left:auto;color:#9facbe}
.connection-list{display:grid;gap:9px}
.connection-list .connection-card{grid-template-columns:24px 46px minmax(0,1fr) auto;gap:14px;align-items:center;align-content:center;min-height:88px;padding:12px 14px}
.connection-order{grid-column:1;grid-row:1;color:#64748c;font-size:13px;font-variant-numeric:tabular-nums}
.connection-list .connection-cover{grid-column:2;grid-row:1;width:46px;height:66px}
.connection-list .connection-copy{grid-column:3;grid-row:1}
.connection-list .connection-actions{grid-column:4;grid-row:1;justify-content:flex-end;flex-wrap:nowrap}
.connection-list .connection-card.is-current{border-color:#d4f58a30;background:#d4f58a05}
.connection-empty{padding:26px 18px;border:1px dashed #ffffff1e;border-radius:12px;background:#ffffff02;text-align:center}
.connection-empty strong{font-size:14px;font-weight:550;color:#d4deed}.connection-empty p{margin:8px 0 16px;color:#93a1b6;font-size:12px;line-height:1.8}
.connection-empty button{min-height:40px;padding:8px 14px;border:1px solid #d4f58a30;border-radius:8px;background:#d4f58a0a;color:var(--lime);font-size:12px}
#connection-content:focus-visible{outline-offset:4px}
@media(hover:hover){.connection-card:hover{border-color:#ffffff26}.connection-actions>button:not(:disabled):hover{border-color:#d4f58a50;color:var(--lime)}.connection-cover:not(:disabled):hover img{filter:brightness(1.08)}}
@media(max-width:700px){
 .connection-heading{gap:10px;margin-bottom:15px}.connection-heading h3{font-size:19px;gap:9px}.connection-heading .eyebrow{font-size:8px;letter-spacing:1.4px}
 #connection-total{font-size:10px;padding:2px 6px}#connection-expand{font-size:10px;min-height:36px;padding:7px 9px}
 .connection-toolbar{gap:10px;padding-bottom:12px}.connection-tabs{padding:3px;gap:2px}.connection-tabs>button{padding:8px 11px;font-size:11px;min-height:36px}.connection-filter{font-size:10px;min-height:36px;gap:6px}
 .connection-status{font-size:10px;margin:10px 0 14px}.connection-grid{grid-template-columns:1fr;gap:10px}
 .connection-card{grid-template-columns:56px minmax(0,1fr);padding:12px;gap:8px 12px;border-radius:10px}.connection-cover{width:56px;height:80px}.connection-copy h4{font-size:13px;margin:5px 0 3px}
 .connection-card>.cover-retry{left:12px;top:12px;width:56px;height:80px}.connection-list .connection-card>.cover-retry{left:40px;top:12px;width:42px;height:60px}
 .connection-actions>button{min-height:36px;padding:7px 11px;font-size:10px}.connection-current{padding:12px;gap:8px;font-size:9px}.connection-current strong{font-size:12px}
 .connection-list .connection-card{grid-template-columns:18px 42px minmax(0,1fr);gap:7px 10px;padding:12px;align-items:start}.connection-order{grid-row:1/3;align-self:center;font-size:11px}
 .connection-list .connection-cover{grid-row:1/3;width:42px;height:60px}.connection-list .connection-copy{grid-column:3;grid-row:1}.connection-list .connection-actions{grid-column:3;grid-row:2;justify-content:flex-start;flex-wrap:wrap;margin-top:2px}
 .connection-note,.connection-empty-note{font-size:10px;margin-top:15px}
}
@media(max-width:360px){.connection-toolbar{align-items:flex-start}.connection-filter{margin-left:auto}.connection-heading h3{font-size:18px}#connection-expand{padding-inline:7px;font-size:9px}.connection-current{gap:6px}.connection-current strong{font-size:11px}}
@media(forced-colors:active){.connection-tabs>button[aria-selected=true],.connection-card.is-current{outline:1px solid Highlight}.connection-dot{background:Highlight}}
