/* ── Vigía: el doble check antes de aprobar ──
   Por encima de los diálogos (100200+): se abre DESDE el editor o el centro
   de aprobaciones, que ya son diálogos. */
.cgm-vg {
  --vg-card: var(--ft-card, #fff);
  --vg-ink: var(--ft-ink, #1b2435);
  --vg-muted: var(--ft-muted, #79829a);
  --vg-line: var(--ft-line, #e9ebf1);
  --vg-canvas: var(--ft-canvas, #f5f6f9);
  --vg-accent: var(--ft-accent, #7c3aed);
  --vg-red: #c8462a;
  --vg-amber: #b7700c;
  --vg-green: #16a06b;
  position: fixed; inset: 0; z-index: 100400;
  display: flex; align-items: center; justify-content: center;
  padding: 24px max(16px, env(safe-area-inset-right, 0px)) 24px max(16px, env(safe-area-inset-left, 0px));
  background: rgba(15, 18, 30, .45);
  font-family: inherit;
}
.cgm-vg__box {
  width: min(640px, 100%); max-height: calc(100vh - 48px); display: flex; flex-direction: column;
  background: var(--vg-card); color: var(--vg-ink); border-radius: 18px; overflow: hidden;
  box-shadow: 0 24px 64px -20px rgba(10, 14, 40, .45);
  animation: cgmVgIn .22s ease;
}
@keyframes cgmVgIn { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.cgm-vg__head { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--vg-line); }
.cgm-vg__head svg { flex: none; }
.cgm-vg__head b { display: block; font-size: 16px; font-weight: 650; }
.cgm-vg__head span { display: block; font-size: 13px; color: var(--vg-muted); }
.cgm-vg__verdict { margin-left: auto; font-style: normal; font-size: 12.5px; font-weight: 650; padding: 5px 11px; border-radius: 999px; white-space: nowrap; }
.cgm-vg__verdict.is-ok { background: rgba(22, 160, 107, .14); color: var(--vg-green); }
.cgm-vg__verdict.is-ojo { background: rgba(224, 149, 43, .16); color: var(--vg-amber); }
.cgm-vg__verdict.is-para { background: rgba(200, 70, 42, .14); color: var(--vg-red); }
.cgm-vg__x { border: 0; background: none; font-size: 24px; line-height: 1; color: var(--vg-muted); cursor: pointer; padding: 0 4px; margin-left: 4px; }
.cgm-vg__head .cgm-vg__verdict + .cgm-vg__x { margin-left: 4px; }
.cgm-vg__head > div + .cgm-vg__x { margin-left: auto; }

.cgm-vg__body { padding: 16px 18px; overflow-y: auto; display: flex; flex-direction: column; gap: 18px; }
.cgm-vg__piece { display: flex; flex-direction: column; gap: 10px; }
.cgm-vg__piece + .cgm-vg__piece { border-top: 1px solid var(--vg-line); padding-top: 16px; }
.cgm-vg__piece h3 { margin: 0; font-size: 15px; font-weight: 650; }
.cgm-vg__piece h3 small { font-weight: 500; color: var(--vg-muted); }
.cgm-vg__sum { margin: 0; font-size: 14px; color: var(--vg-muted); line-height: 1.5; }
.cgm-vg__copy { white-space: pre-wrap; font-size: 14px; line-height: 1.55; background: var(--vg-canvas); border-radius: 12px; padding: 12px 14px; max-height: 220px; overflow-y: auto; }
.cgm-vg__copy mark { border-radius: 3px; padding: 0 2px; color: inherit; }
.cgm-vg__copy mark.is-regla { background: rgba(200, 70, 42, .18); border-bottom: 2px solid var(--vg-red); }
.cgm-vg__copy mark.is-preferencia, .cgm-vg__copy mark.is-hecho { background: rgba(224, 149, 43, .2); border-bottom: 2px solid #e0952b; }
.cgm-vg__copy mark.is-ortografia { background: transparent; text-decoration: underline wavy #d64545; text-underline-offset: 3px; }

.cgm-vg__issues { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.cgm-vg__issues li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; font-size: 14px; }
.cgm-vg__issues b { font-weight: 600; display: block; line-height: 1.4; }
.cgm-vg__pill { font-size: 11.5px; font-weight: 650; padding: 3px 9px; border-radius: 999px; white-space: nowrap; background: var(--vg-canvas); color: var(--vg-muted); margin-top: 1px; }
.cgm-vg__pill.is-regla { background: rgba(200, 70, 42, .14); color: var(--vg-red); }
.cgm-vg__pill.is-preferencia, .cgm-vg__pill.is-hecho { background: rgba(224, 149, 43, .16); color: var(--vg-amber); }
.cgm-vg__fix { display: block; font-size: 13px; color: var(--vg-ink); margin-top: 3px; }
.cgm-vg__proof { margin-top: 8px; border-left: 3px solid #e0952b; background: var(--vg-canvas); padding: 8px 11px; border-radius: 0 8px 8px 0; font-size: 12.5px; }
.cgm-vg__proof q { display: block; font-style: italic; }
.cgm-vg__proof small { display: block; color: var(--vg-muted); margin-top: 3px; }
.cgm-vg__proof a { color: var(--vg-accent); font-weight: 600; text-decoration: none; }
.cgm-vg__links { display: flex; gap: 12px; margin-top: 6px; align-items: center; }
.cgm-vg__links button { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; color: var(--vg-muted); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.cgm-vg__allgood { margin: 0; font-size: 14px; color: var(--vg-green); font-weight: 600; }
.cgm-vg__fixed summary { cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--vg-accent); }
.cgm-vg__fixed pre { white-space: pre-wrap; font-family: inherit; font-size: 14px; line-height: 1.55; background: var(--vg-canvas); border-radius: 12px; padding: 12px 14px; margin: 8px 0; }
.cgm-vg__when { margin: 0; font-size: 12px; color: var(--vg-muted); }
.cgm-vg__report { border: 0; background: none; padding: 0; font: inherit; color: var(--vg-muted); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.cgm-vg__report:hover { color: var(--vg-red); }
.cgm-vg .cgm-rep { --asst-ink: var(--vg-ink); --asst-ink-2: var(--vg-muted); --asst-line-2: var(--vg-line); --asst-card: var(--vg-card); }

.cgm-vg__wait { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 34px 24px; text-align: center; }
.cgm-vg__wait p { margin: 0; max-width: 40ch; font-size: 14px; color: var(--vg-muted); line-height: 1.5; }
.cgm-vg__eye { width: 46px; height: 46px; border-radius: 14px; background: var(--vg-red); position: relative; animation: cgmVgLook 1.6s ease-in-out infinite; }
.cgm-vg__eye::before, .cgm-vg__eye::after { content: ""; position: absolute; top: 17px; width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: cgmVgEyes 1.6s ease-in-out infinite; }
.cgm-vg__eye::before { left: 13px; } .cgm-vg__eye::after { right: 13px; }
@keyframes cgmVgLook { 50% { transform: rotate(-6deg); } }
@keyframes cgmVgEyes { 0%, 100% { transform: translateX(-3px); } 50% { transform: translateX(3px); } }

.cgm-vg__foot { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; padding: 12px 18px; border-top: 1px solid var(--vg-line); }
.cgm-vg__btn, .cgm-vg__ghost { font: inherit; font-size: 14px; font-weight: 600; border-radius: 10px; padding: 9px 16px; cursor: pointer; }
.cgm-vg__btn { border: 0; background: var(--vg-accent); color: #fff; }
.cgm-vg__btn.is-warn { background: var(--vg-red); }
.cgm-vg__btn[disabled] { opacity: .6; cursor: wait; }
.cgm-vg__ghost { border: 1px solid var(--vg-line); background: var(--vg-card); color: var(--vg-ink); }
.cgm-vg button:focus-visible, .cgm-vg a:focus-visible, .cgm-vg summary:focus-visible { outline: 2px solid var(--vg-accent); outline-offset: 2px; }

:root[data-theme="dark"] .cgm-vg {
  --vg-card: #161a24; --vg-ink: #e7e9ef; --vg-muted: #8b93a7; --vg-line: #262c3a; --vg-canvas: #0f1219;
  --vg-red: #ff7a5c; --vg-amber: #f2b24e; --vg-green: #34d399;
}
@media (prefers-reduced-motion: reduce) { .cgm-vg__box, .cgm-vg__eye, .cgm-vg__eye::before, .cgm-vg__eye::after { animation: none; } }