/* ============================================================
   Nim v8 "Singularity Sovereign" — Agency OS layer.
   Pure CSS3, zero external assets. Covers: the admin Agency OS
   consoles (developer API, webhooks, static cache), the brief
   intelligence panel, white-label branding form, rollback guard
   and the public exit-intent conversion drawer.
   ============================================================ */

/* ---------- shared admin bits introduced by v8 ---------- */
.code-secret {
  display: inline-block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .82rem;
  padding: 6px 12px;
  border-radius: 8px;
  background: rgba(181, 227, 60, .12);
  border: 1px solid rgba(181, 227, 60, .35);
  color: inherit;
  user-select: all;
  word-break: break-all;
}

.cell-break { overflow-wrap: anywhere; }

.check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0;
}

.rollback-guard {
  margin-top: 14px;
  border: 1px dashed rgba(196, 61, 61, .45);
  border-radius: 10px;
  padding: 10px 14px;
}
.rollback-guard summary { cursor: pointer; font-weight: 600; }

/* ---------- brief intelligence (proposals show) ---------- */
.brief-analysis { margin-bottom: 22px; }
.brief-analysis-grid {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 24px;
  align-items: start;
}
@media (max-width: 860px) {
  .brief-analysis-grid { grid-template-columns: 1fr; }
}

.brief-ring-wrap { display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; }
.ring-track { stroke: rgba(128, 138, 155, .22); }
.ring-fill {
  stroke: var(--lime, #B5E33C);
  stroke-dasharray: 327;
  stroke-dashoffset: calc(327 - 327 * var(--ring, 0));
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  transition: stroke-dashoffset .8s cubic-bezier(.2, .8, .2, 1);
}
.ring-num { font: 700 30px var(--font-head, system-ui); fill: currentColor; }
.ring-cap { font: 600 10px var(--font-head, system-ui); letter-spacing: .08em; text-transform: uppercase; fill: var(--muted, #75808F); }

.brief-signals { margin: 0; padding: 0; list-style: none; font-size: .8rem; color: var(--muted, #75808F); max-width: 300px; }
.brief-signals li { margin: 4px 0; }

.brief-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.brief-chips .chip { margin: 0; }

.brief-checklist { list-style: none; margin: 0; padding: 0; }
.brief-checklist li { display: flex; align-items: center; gap: 8px; margin: 5px 0; }
.brief-tick { display: inline-flex; width: 18px; height: 18px; color: var(--lime, #B5E33C); }
.brief-tick svg { width: 100%; height: 100%; }

/* ---------- white-label branding form ---------- */
.branding-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 14px 22px;
  align-items: start;
  margin-bottom: 14px;
}
.branding-current { display: flex; align-items: center; gap: 10px; margin: 6px 0; }
.branding-current img { border-radius: 8px; background: #fff; }

/* ---------- public: exit-intent conversion drawer ---------- */
.exit-drawer {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 16px);
  width: min(560px, calc(100vw - 24px));
  z-index: 90;
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s ease, transform .35s cubic-bezier(.2, .8, .2, 1);
}
.exit-drawer--in { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
@media (prefers-reduced-motion: reduce) {
  .exit-drawer { transition: none; }
}

.exit-drawer-in {
  position: relative;
  margin: 0 0 18px;
  padding: 22px 24px;
  border-radius: 16px;
  background: var(--navy, #0B1324);
  color: #E8ECF4;
  border: 1px solid rgba(181, 227, 60, .28);
  box-shadow: 0 24px 60px rgba(11, 19, 36, .45);
}
html.theme-dark .exit-drawer-in {
  background: var(--navy-2, #121D36);
  border-color: rgba(181, 227, 60, .4);
}

.exit-drawer-kicker {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lime, #B5E33C);
}
.exit-pulse {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--lime, #B5E33C);
  animation: exitPulse 1.6s ease-in-out infinite;
}
@keyframes exitPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(181, 227, 60, .55); }
  50%      { box-shadow: 0 0 0 6px rgba(181, 227, 60, 0); }
}
@media (prefers-reduced-motion: reduce) { .exit-pulse { animation: none; } }

.exit-drawer h2 {
  margin: 0 0 6px;
  font: 700 1.15rem/1.3 var(--font-head, system-ui);
  color: inherit;
}
.exit-drawer p { margin: 0 0 12px; font-size: .92rem; color: rgba(232, 236, 244, .8); }

.exit-drawer-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.exit-drawer-x {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 34px; height: 34px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  color: inherit;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
}
.exit-drawer-x:hover { background: rgba(255, 255, 255, .16); }

/* The drawer renders on the public site which uses light tokens too —
   keep its panel dark in both themes for the executive feel. */
.exit-drawer .btn-ghost { color: rgba(232, 236, 244, .75); border-color: rgba(255, 255, 255, .25); }