/* Shared styling for the live agent consoles (vauth-agent.js). */
.ag-box { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:1.2rem; }
.ag-row { display:flex; gap:0.65rem; flex-wrap:wrap; }
.ag-row input { flex:1 1 300px; min-width:0; background:var(--bg-2); border:1px solid var(--line-2);
  border-radius:10px; padding:0.9rem 1rem; color:var(--ink); font-family:var(--mono); font-size:0.85rem; }
.ag-row input:focus { outline:none; border-color:var(--gold-dk); }
.ag-row select { background:var(--bg-2); border:1px solid var(--line-2); border-radius:10px;
  padding:0.9rem 0.85rem; color:var(--ink); font-family:var(--mono); font-size:0.8rem; cursor:pointer; }
.ag-row select:focus { outline:none; border-color:var(--gold-dk); }
.ag-row button { background:linear-gradient(120deg,var(--gold-dk),var(--gold-lt) 55%,var(--gold));
  color:#100d08; font-weight:700; font-family:var(--mono); font-size:0.8rem; letter-spacing:0.05em;
  border:none; border-radius:10px; padding:0.9rem 1.6rem; cursor:pointer;
  transition:transform .35s var(--ease),filter .3s; }
.ag-row button:hover:not(:disabled) { transform:translateY(-2px); filter:brightness(1.07); }
.ag-row button:disabled { opacity:.55; cursor:progress; }
.ag-hint { font-family:var(--mono); font-size:0.68rem; color:var(--muted); margin-top:0.8rem; }
.ag-ex { color:var(--gold-dk); cursor:pointer; border-bottom:1px dashed var(--faint); }
.ag-ex:hover { color:var(--gold-lt); }

.ag-out { margin-top:1.3rem; display:none; }
.ag-out.on { display:block; }
.ag-term { background:#07060a; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.ag-bar { display:flex; align-items:center; gap:.55rem; padding:.6rem .95rem; border-bottom:1px solid var(--line-2);
  font-family:var(--mono); font-size:.66rem; color:var(--muted); letter-spacing:.1em; }
.ag-bar b { color:var(--gold); font-weight:600; letter-spacing:.14em; }
.ag-bar .rt { margin-left:auto; color:var(--ink-2); }
.ag-log { padding:.9rem 1.1rem; font-family:var(--mono); font-size:.76rem; line-height:1.95;
  color:var(--ink-2); border-bottom:1px solid var(--line-2); }
.ag-log div { opacity:0; animation:agLine .3s var(--ease) forwards; }
@keyframes agLine { from{opacity:0;transform:translateX(-6px)} to{opacity:1;transform:none} }
.ag-log .ok { color:var(--grn); }
.ag-facts { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:1px;
  background:var(--line-2); border-bottom:1px solid var(--line-2); }
.ag-fact { background:#07060a; padding:.85rem 1.05rem; }
.ag-fact span { display:block; font-family:var(--mono); font-size:.6rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); margin-bottom:.28rem; }
.ag-fact b { font-family:var(--mono); font-size:.86rem; color:var(--ink); font-weight:500; overflow-wrap:anywhere; }
.ag-find { padding:1rem 1.1rem; display:grid; gap:.6rem; }
.ag-f { display:flex; gap:.7rem; align-items:flex-start; font-size:.9rem; line-height:1.6; color:var(--ink-2); }
.ag-f i { width:8px; height:8px; border-radius:50%; margin-top:.48rem; flex-shrink:0; }
.ag-f.high i { background:var(--red); } .ag-f.warn i { background:var(--amber); }
.ag-f.good i { background:var(--grn); }  .ag-f.info i { background:var(--muted); }
.ag-caps { padding:0 1.1rem 1.1rem; display:flex; flex-wrap:wrap; gap:.4rem; }
.ag-cap { font-family:var(--mono); font-size:.66rem; padding:.3rem .6rem; border-radius:6px;
  border:1px solid var(--line-2); color:var(--ink-2); }
.ag-err { padding:1.4rem; text-align:center; color:var(--ink-2); font-size:.92rem; }
