.ag-main{ max-width:1100px; margin:0 auto; padding:var(--sp-21) 16px var(--sp-30); display:grid; gap:var(--sp-18); }
.ag-panel{ background:var(--paper); border:1px solid var(--border); border-radius:12px; padding:var(--sp-18); display:grid; gap:var(--sp-12); }
.ag-panel h2{ font-family:var(--font-display); font-size:var(--fs-xl); margin:0; }
.ag-panel h3{ font-family:var(--font-display); font-size:var(--fs-md); margin:var(--sp-9) 0 0; }
.ag-lede{ color:var(--graphite); max-width:64ch; margin:0; }
.ag-note{ color:var(--graphite); font-size:var(--fs-sm); margin:0; }
.ag-err{ color:var(--danger-text); margin:0; }
.ag-form{ display:grid; gap:var(--sp-9); max-width:560px; }
.ag-form label{ display:grid; gap:4px; font-size:var(--fs-sm); color:var(--graphite); }
.ag-opt{ opacity:.7; }
.ag-existing{ border-top:1px dashed var(--border); padding-top:var(--sp-12); }
.ag-head{ display:flex; justify-content:space-between; gap:var(--sp-12); flex-wrap:wrap; align-items:flex-start; }
.ag-meta{ display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.cx-chip.is-on{ border-color:var(--brand-55); } .cx-chip.is-off{ border-style:dashed; color:var(--graphite); } .cx-chip--sys{ background:var(--brand-10); }
.ag-stats{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:var(--sp-9); }
.ag-stat{ display:grid; gap:2px; padding:var(--sp-9) var(--sp-11); border:1px solid var(--border); border-radius:10px; }
.ag-stat__v{ font-family:var(--font-display); font-size:28px; font-variant-numeric:tabular-nums; }
.ag-stat__l{ font-size:var(--fs-sm); } .ag-stat__s{ font-size:12px; color:var(--graphite); }
.ag-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:var(--sp-18); }
.ag-rows, .ag-feed{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.ag-rows li{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; font-size:var(--fs-sm); }
.ag-feed li{ display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; font-size:var(--fs-sm); }
.ag-feed__k{ font-weight:600; } .ag-feed__p{ color:var(--graphite); } .ag-feed time{ margin-left:auto; color:var(--graphite); font-size:12px; }
.ag-cred{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.ag-cred code{ font-family:var(--font-mono); font-size:var(--fs-sm); padding:8px 10px; border:1px solid var(--brand-55); border-radius:8px; background:var(--brand-10); word-break:break-all; }
.ag-snips{ display:grid; gap:var(--sp-9); }
.ag-snip{ border:1px solid var(--border); border-radius:10px; padding:var(--sp-9); }
.ag-snip__h{ display:flex; gap:8px; align-items:center; } .ag-snip__h button{ margin-left:auto; }
.ag-snip pre{ margin:8px 0 0; white-space:pre-wrap; word-break:break-all; font-family:var(--font-mono); font-size:12px; line-height:1.5; }
@media (max-width:640px){ .ag-stat__v{ font-size:22px; } }

/* first success panel */
.ag-first__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ag-first__list li { display: flex; gap: 12px; align-items: flex-start; }
.ag-first__list li.is-done { opacity: 0.6; }
.ag-first__tick { flex: 0 0 26px; height: 26px; border-radius: 50%; border: 1px solid currentColor; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
.ag-first__prompt { white-space: pre-wrap; margin: 6px 0; padding: 8px 10px; border-radius: 6px; background: rgba(127,127,127,0.10); font-size: 13px; }

.ag-feedback .ag-form { display: grid; gap: 10px; max-width: 640px; }
.ag-feedback select.cx-input { width: 100%; }