/* ago-demo structural styles. Colors driven by CSS custom properties set per page:
   --demo-bg --demo-fg --demo-dim --demo-codex --demo-claude --demo-sel-bg --demo-prompt --demo-ok */
.ago-screen{
  font-family: var(--demo-mono, ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace);
  background: var(--demo-bg, #07090c);
  color: var(--demo-fg, #d7e0d8);
  font-size: var(--demo-fs, 15px);
  line-height: 1.62;
  padding: clamp(16px, 2.4vw, 26px);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}
.ago-body{ white-space: pre; }
.ago-line{ min-height: 1.62em; }
.ago-prompt{ color: var(--demo-prompt, var(--demo-codex)); }
.ago-typed{ color: var(--demo-fg); }
.ago-caret{
  color: var(--demo-fg);
  animation: agoBlink 1.05s steps(1) infinite;
}
@keyframes agoBlink{ 50%{ opacity: 0; } }
.ago-dim{ color: var(--demo-dim, #6b7a72); }
.ago-ok{ color: var(--demo-ok, var(--demo-codex)); }

.ago-block{ margin: 0.5em 0 0.3em; }

/* picker table */
.ago-row{ display: grid; grid-template-columns: 1.4em minmax(9em,1fr) 6.2em 11em 6em; align-items: center; }
.ago-head{ color: var(--demo-dim); letter-spacing: .06em; font-size: .82em; padding-bottom: .15em; }
.ago-pick{ border-radius: 4px; transition: background .12s ease; padding: .04em 0; }
.ago-c-mark{ color: var(--demo-prompt, var(--demo-codex)); font-weight: 700; }
.ago-sel{ background: var(--demo-sel-bg, rgba(255,255,255,.07)); }
.ago-sel .ago-c-name{ color: var(--demo-fg); font-weight: 700; }
.ago-chosen .ago-c-name{ text-decoration: none; }

.ago-tag{ font-size: .82em; }
.ago-tag-codex{ color: var(--demo-codex); }
.ago-tag-claude{ color: var(--demo-claude); }
.ago-slash{ color: var(--demo-dim); }
.ago-status{ font-size: .82em; }
.ago-status-ok{ color: var(--demo-dim); }
.ago-status-missing{ color: var(--demo-claude); opacity: .85; }

/* cli select */
.ago-q{ color: var(--demo-fg); }
.ago-path{ color: var(--demo-dim); margin-bottom: .2em; }
.ago-opt{ border-radius: 4px; padding: .02em 0; }
.ago-optmark{ color: var(--demo-prompt, var(--demo-codex)); font-weight: 700; }
.ago-fg-codex{ color: var(--demo-codex); }
.ago-fg-claude{ color: var(--demo-claude); }
.ago-rec{ color: var(--demo-dim); font-size: .86em; }

/* generic accents reused by pages */
.fg-codex{ color: var(--codex); }
.fg-claude{ color: var(--claude); }