.related-list { margin-top:20px; }
.related-list .list-controls h2 { margin:3px 0 0; font-size:1.05rem; }
.related-list .list-controls .section-kicker { margin:0; }

/* Cabeçalho da related list. O título cede espaço primeiro, a busca encolhe até um piso e o
   botão nunca encolhe — sem o flex:0 0 auto ele era o item espremido e o rótulo quebrava em
   duas linhas. Abaixo de 560px de painel a faixa de ações desce inteira para a linha de baixo. */
.related-list .list-controls { flex-wrap:wrap; row-gap:12px; }
.related-list .list-controls > div:first-child { flex:1 1 210px; min-width:0; }
.related-list .page-actions { flex:1 1 auto; justify-content:flex-end; align-items:center; gap:10px; }
.related-list .search-box { flex:1 1 190px; width:auto; min-width:0; max-width:330px; }
.related-list .page-actions .button { flex:0 0 auto; }

/* A ação de uma related list é secundária ao conteúdo da tela. O gradiente + sombra projetada
   do .button-primary a faziam competir com a ação primária do topo da página; aqui ela fica
   chapada e um pouco menor, no mesmo peso visual do campo de busca ao lado. */
.related-list .page-actions .button-primary { padding:.6rem .95rem; background:var(--brand-primary); box-shadow:none; font-size:.76rem; }
.related-list .page-actions .button-primary:hover { background:color-mix(in srgb,var(--brand-primary) 86%,#000); box-shadow:none; transform:none; }
/* Desvio deliberado do padrão mobile do app (.page-actions .button{flex:1} em site.css, que estica
   os botões abaixo de 767px): aqui o botão divide a linha com a busca em vez de empurrá-la para
   baixo, o que aproveita melhor a largura estreita. Declarado para não parecer efeito colateral
   da especificidade das regras acima. */
@media(max-width:767px){ .related-list .page-actions .button { flex:0 0 auto; } }
.relationship-context { display:grid; grid-template-columns:auto 1fr; gap:2px 12px; align-items:center; margin-bottom:20px; padding:13px 15px; border:1px solid #cfe3f2; border-radius:10px; background:#edf7fd; }
.relationship-context > span { grid-row:1/3; display:grid; place-items:center; min-width:48px; height:34px; border-radius:8px; background:#0877d1; color:#fff; font-size:.58rem; font-weight:800; text-transform:uppercase; }
.relationship-context strong { font-size:.72rem; }
.relationship-context small { color:#668095; font-size:.58rem; }

/* Feedback operacional: centralizado horizontalmente e próximo ao topo. */
.operation-toast {
    top: 100px;
    transform: translate(-50%, -16px) scale(.96);
}

.operation-toast.is-visible {
    transform: translate(-50%, 0) scale(1);
}

@media (max-width: 767px) {
    .operation-toast { top: 84px; }
}

.operation-loading { position:fixed; inset:0; z-index:2100; display:grid; place-items:center; padding:24px; visibility:hidden; opacity:0; transition:opacity .22s ease,visibility .22s; }
.operation-loading.is-visible { visibility:visible; opacity:1; }
.operation-loading__backdrop { position:absolute; inset:0; background:rgba(3,13,27,.72); backdrop-filter:blur(8px); }
.operation-loading__card { position:relative; width:min(440px,100%); overflow:hidden; padding:38px 34px 28px; border:1px solid rgba(126,211,255,.3); border-radius:22px; background:linear-gradient(145deg,rgba(10,31,55,.98),rgba(5,20,38,.98)); color:#fff; text-align:center; box-shadow:0 28px 80px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.08); transform:translateY(14px) scale(.98); transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.operation-loading.is-visible .operation-loading__card { transform:none; }
.operation-loading__card::before { content:""; position:absolute; inset:0 0 auto; height:3px; background:linear-gradient(90deg,transparent,#35b9ff,#68e2b7,transparent); animation:loading-shimmer 1.8s linear infinite; }
.operation-loading__card .section-kicker { color:#68d5ff; }
.operation-loading__card h2 { margin:8px 0 7px; font-size:1.45rem; letter-spacing:-.025em; }
.operation-loading__card p { min-height:24px; margin:0 0 19px; color:#b7cbe0; font-size:.84rem; }
.operation-loading__card > small { display:block; margin-top:18px; color:#718aa3; font-size:.67rem; }
.git-loader { position:relative; width:88px; height:88px; margin:0 auto 22px; display:grid; place-items:center; }
.git-loader svg { width:50px; height:50px; fill:none; stroke:#fff; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 9px rgba(53,185,255,.55)); }
.git-loader svg circle { fill:#0d2f4e; stroke:#68d5ff; }
/* O mesmo overlay serve operações diferentes: a marca acompanha a operação (ramo do Git ao sincronizar,
   escudo ao verificar credenciais), já que um ícone de Git num teste de autenticação confundiria o admin. */
.git-loader .git-loader__mark { grid-area:1/1; }
.git-loader .git-loader__mark--auth { display:none; }
.git-loader.is-auth .git-loader__mark--git { display:none; }
.git-loader.is-auth .git-loader__mark--auth { display:block; }
.git-loader.is-auth .git-loader__mark--auth path:last-child { stroke:#68e2b7; animation:auth-check-draw 1.9s ease-in-out infinite; stroke-dasharray:30; }
@keyframes auth-check-draw { 0%,12%{stroke-dashoffset:30} 45%,72%{stroke-dashoffset:0} 100%{stroke-dashoffset:30} }
.git-loader__orbit { position:absolute; inset:0; border:1px solid rgba(104,213,255,.24); border-radius:50%; animation:git-orbit 2.4s linear infinite; }
.git-loader__orbit i { position:absolute; width:7px; height:7px; border-radius:50%; background:#68e2b7; box-shadow:0 0 12px #68e2b7; }
.git-loader__orbit i:nth-child(1){left:8px;top:15px}.git-loader__orbit i:nth-child(2){right:-3px;top:41px}.git-loader__orbit i:nth-child(3){left:24px;bottom:-1px}
.operation-loading__track { height:6px; overflow:hidden; border-radius:99px; background:rgba(255,255,255,.08); }
.operation-loading__track i { display:block; width:38%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#168eea,#67e1b5); box-shadow:0 0 14px rgba(53,185,255,.5); animation:loading-progress 1.7s ease-in-out infinite; }
.operation-loading__meta { display:flex; justify-content:center; align-items:center; gap:9px; margin-top:14px; color:#d7e8f7; font-size:.72rem; font-weight:700; }
.operation-loading__meta .status-dot { background:#67e1b5; box-shadow:0 0 0 4px rgba(103,225,181,.12); animation:loading-pulse 1.5s ease-in-out infinite; }
body.operation-in-progress { overflow:hidden; }
@keyframes git-orbit { to{transform:rotate(360deg)} }
@keyframes loading-progress { 0%{transform:translateX(-110%)} 55%,100%{transform:translateX(265%)} }
@keyframes loading-shimmer { from{transform:translateX(-70%)} to{transform:translateX(70%)} }
@keyframes loading-pulse { 50%{opacity:.45;transform:scale(.78)} }
@media (prefers-reduced-motion:reduce){.git-loader__orbit,.operation-loading__track i,.operation-loading__card::before,.operation-loading__meta .status-dot{animation-duration:5s}.operation-loading__card{transition:none}.git-loader.is-auth .git-loader__mark--auth path:last-child{animation:none;stroke-dashoffset:0}}

.credential-value { min-width:0; }
.credential-value strong { display:block; max-width:100%; overflow-wrap:anywhere; word-break:break-word; font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; font-size:.72rem; line-height:1.55; color:#24445e; }
.agent-readiness { margin-bottom:20px; border-color:rgba(22,142,234,.22); background:linear-gradient(135deg,rgba(22,142,234,.055),rgba(103,225,181,.035)); }
.agent-readiness > header { align-items:center; }
.agent-readiness > header h2 { margin-top:4px; }
.agent-readiness > p { margin:0 0 18px; color:var(--text-muted); }