.rag-governance {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid #e3e5e8;
  border-radius: 14px;
  background: linear-gradient(135deg, #171a1f, #252a31);
  color: #fff;
}

.rag-governance > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.rag-governance > header span { color: #ffc400; font-size: 9px; font-weight: 900; letter-spacing: 1px; }
.rag-governance h3 { margin: 5px 0; font: 900 20px Lato, sans-serif; }
.rag-governance p { max-width: 670px; margin: 0; color: #b8bdc4; font-size: 11px; line-height: 1.5; }
.rag-mode { padding: 7px 10px; border: 1px solid rgba(255,255,255,.15); border-radius: 99px; background: rgba(255,255,255,.07); color: #d8dce1; font-size: 9px; font-weight: 900; white-space: nowrap; }
.rag-mode.hybrid { border-color: rgba(255,196,0,.45); color: #ffd84a; }
.rag-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-top: 15px; }
.rag-metrics article { padding: 13px; border: 1px solid rgba(255,255,255,.1); border-radius: 11px; background: rgba(255,255,255,.05); }
.rag-metrics span, .rag-metrics strong, .rag-metrics small { display: block; }
.rag-metrics span { color: #9299a2; font-size: 8px; font-weight: 900; letter-spacing: .7px; }
.rag-metrics strong { margin-top: 5px; font-size: 23px; }
.rag-metrics small { margin-top: 3px; color: #aeb4bb; font-size: 8px; }
.rag-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 13px; }
.rag-actions p { color: #aeb4bb; font-size: 9px; }
.rag-actions button { padding: 10px 13px; border: 0; border-radius: 9px; background: #ffc400; color: #171a1f; font-size: 10px; font-weight: 900; }
.rag-actions button:disabled { opacity: .55; }

@media (max-width: 720px) {
  .rag-governance > header, .rag-actions { align-items: stretch; flex-direction: column; }
  .rag-metrics { grid-template-columns: 1fr 1fr; }
  .rag-actions button { width: 100%; }
}