/* ============================================================
   ARPE · CHROME DU FIL  —  feuille de référence
   Préfixe .arc-  ·  compagnon de arpe-blocs.css / arpe-cartes.css
   Couvre : état « Arpe réfléchit », refus doux / erreur d'outil,
   sélecteur de profil d'agent, sources & citations, quota.
   ============================================================ */

.arc{
  --arc-sans:-apple-system,BlinkMacSystemFont,'Inter','Segoe UI',sans-serif;
  --arc-mono:ui-monospace,'JetBrains Mono','SFMono-Regular',Menlo,monospace;
  font-family:var(--arc-sans);font-size:13.5px;line-height:1.5;color:var(--text);
  flex:none;min-height:min-content;max-width:640px}
.arc *{box-sizing:border-box}

/* ============ C.9 · « ARPE RÉFLÉCHIT » ============
   Un squelette du bloc à venir + un balayage. Le libellé est
   optionnel (punchline) : .arc-think-l, remplaçable à chaud. */
.arc-think{display:flex;flex-direction:column;gap:10px}
.arc-think-h{display:flex;align-items:center;gap:8px;
  font-family:var(--arc-mono);font-size:10px;font-weight:600;letter-spacing:.11em;
  text-transform:uppercase;color:var(--muted)}
.arc-think-l{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arc-dots{display:inline-flex;gap:3px;flex:none}
.arc-dots i{width:4px;height:4px;border-radius:50%;background:var(--accent);opacity:.35;
  animation:arcDot 1.15s ease-in-out infinite}
.arc-dots i:nth-child(2){animation-delay:.16s}
.arc-dots i:nth-child(3){animation-delay:.32s}
@keyframes arcDot{0%,100%{opacity:.28;transform:translateY(0)}45%{opacity:1;transform:translateY(-2px)}}
/* le squelette : des barres qui reprennent la silhouette d'un bloc */
.arc-sk{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);
  padding:12px 13px;display:flex;flex-direction:column;gap:9px;overflow:hidden;position:relative}
.arc-sk-r{display:flex;align-items:center;gap:10px}
.arc-sk-b{height:9px;border-radius:99px;background:var(--s3);flex:none}
.arc-sk-b.g{flex:1;min-width:0}
.arc-sk-c{width:22px;height:22px;border-radius:50%;background:var(--s3);flex:none}
/* le balayage passe sur tout le squelette */
.arc-sk::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 20%,
    color-mix(in srgb,var(--accent) 11%,transparent) 48%,transparent 76%);
  transform:translateX(-60%);animation:arcSweep 1.5s ease-in-out infinite}
@keyframes arcSweep{to{transform:translateX(60%)}}
@media(prefers-reduced-motion:reduce){
  .arc-dots i,.arc-sk::after{animation-duration:3s}
  .arc-sk::after{animation-name:none;opacity:.5}}

/* ============ C.10 · REFUS DOUX / ERREUR D'OUTIL ============
   .arc-msg + .refus (accent) | .tool (chaud) | .info (froid) */
.arc-msg{--st:var(--muted);display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 10px;
  align-items:start;padding:11px 13px;border-radius:var(--radius-lg);
  background:color-mix(in srgb,var(--st) 6%,transparent);
  border:1px solid color-mix(in srgb,var(--st) 22%,transparent)}
.arc-msg.refus{--st:var(--accent)}
.arc-msg.tool{--st:var(--chaud)}
.arc-msg.info{--st:var(--froid)}
.arc-msg-ic{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;flex:none;
  margin-top:1px;color:color-mix(in srgb,var(--st) 88%,var(--text));
  background:color-mix(in srgb,var(--st) 13%,transparent)}
.arc-msg-ic svg{width:12px;height:12px}
.arc-msg-m{min-width:0}
.arc-msg-t{display:block;font-size:13px;font-weight:650;color:var(--text)}
.arc-msg-p{display:block;margin-top:2px;font-size:12.5px;line-height:1.55;color:var(--text-dim)}
.arc-msg-a{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.arc-msg-a button{height:26px;padding:0 10px;border-radius:var(--radius);cursor:pointer;
  font-family:var(--arc-sans);font-size:12px;font-weight:650;
  background:var(--surface);color:var(--text);border:1px solid var(--border)}
.arc-msg-a button:hover{background:var(--s2);border-color:var(--border-hi)}
.arc-msg-a button.g{background:transparent;border-color:transparent;color:var(--text-dim)}
.arc-msg-a button.g:hover{background:color-mix(in srgb,var(--st) 10%,transparent);color:var(--text)}

/* ============ C.11 · QUOTA / LIMITE QUOTIDIENNE ============ */
.arc-quota{padding:12px 13px;border-radius:var(--radius-lg);background:var(--surface);
  border:1px solid var(--border)}
.arc-q-h{display:flex;align-items:baseline;gap:8px}
.arc-q-t{font-size:13px;font-weight:650}
.arc-q-n{margin-left:auto;font-family:var(--arc-mono);font-size:11.5px;font-weight:700;
  font-variant-numeric:tabular-nums;color:var(--text-dim)}
.arc-q-bar{height:5px;border-radius:99px;background:var(--s3);margin:9px 0 0;overflow:hidden}
.arc-q-bar i{display:block;height:100%;border-radius:99px;background:var(--accent)}
.arc-quota.full .arc-q-bar i{background:var(--chaud)}
.arc-q-s{display:block;margin-top:8px;font-size:12px;color:var(--muted)}
.arc-q-s b{color:var(--text-dim);font-weight:650}

/* ============ C.12 · SÉLECTEUR DE PROFIL D'AGENT ============ */
.arc-prof{position:relative;display:inline-block}
.arc-prof-b{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 9px;
  border-radius:99px;cursor:pointer;font-family:var(--arc-sans);font-size:11.5px;font-weight:650;
  color:var(--text-dim);background:var(--surface);border:1px solid var(--border-hi);
  transition:color .14s,background .14s,border-color .14s}
.arc-prof-b:hover{color:var(--text);background:var(--s2)}
.arc-prof-b .sp{width:12px;height:12px;flex:none;color:var(--accent)}
.arc-prof-b .cv{width:10px;height:10px;flex:none;opacity:.6}
.arc-prof.open .arc-prof-b{color:var(--text);background:var(--s2);border-color:var(--border-hi)}
/* le menu */
.arc-prof-m{display:none;position:absolute;bottom:calc(100% + 7px);left:0;z-index:40;
  min-width:236px;padding:5px;background:var(--surface);border:1px solid var(--border);
  border-radius:12px;box-shadow:0 12px 40px rgba(20,22,31,.22)}
[data-theme="noir"] .arc-prof-m{box-shadow:0 12px 40px rgba(0,0,0,.7)}
.arc-prof.open .arc-prof-m{display:block}
.arc-prof-h{padding:6px 8px 5px;font-family:var(--arc-mono);font-size:9.5px;font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.arc-prof-i{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0 9px;
  width:100%;padding:7px 8px;border:0;border-radius:8px;background:none;cursor:pointer;
  text-align:left;font-family:var(--arc-sans)}
.arc-prof-i:hover{background:var(--s2)}
.arc-prof-i .av{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;flex:none;
  font-family:var(--arc-mono);font-size:9.5px;font-weight:700;color:var(--accent);
  background:var(--accent-dim);border:1px solid color-mix(in srgb,var(--accent) 24%,transparent)}
.arc-prof-i b{display:block;font-size:12.5px;font-weight:650;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arc-prof-i span{display:block;font-size:11.5px;color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arc-prof-i .ck{width:13px;height:13px;flex:none;color:var(--accent);opacity:0}
.arc-prof-i[aria-selected="true"] .ck{opacity:1}
.arc-prof-i[aria-selected="true"]{background:var(--s2)}
.arc-prof-m hr{height:1px;border:0;background:var(--border);margin:5px 0}
.arc-prof-new{display:flex;align-items:center;gap:8px;width:100%;padding:7px 8px;border:0;
  border-radius:8px;background:none;cursor:pointer;font-family:var(--arc-sans);font-size:12.5px;
  font-weight:600;color:var(--text-dim);text-align:left}
.arc-prof-new:hover{background:var(--s2);color:var(--text)}
.arc-prof-new svg{width:13px;height:13px;opacity:.7}

/* ============ C.13 · SOURCES & CITATIONS ============ */
.arc-src{border-top:1px solid var(--border);padding-top:10px}
.arc-src-h{display:flex;align-items:center;gap:8px;margin-bottom:7px;
  font-family:var(--arc-mono);font-size:9.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted)}
.arc-src-l{display:flex;flex-direction:column;gap:4px}
.arc-src-i{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:0 9px;
  padding:6px 8px;border-radius:var(--radius);text-decoration:none;color:inherit;
  transition:background .14s}
.arc-src-i:hover{background:var(--s2)}
.arc-src-n{width:17px;height:17px;border-radius:var(--radius-sm);display:grid;place-items:center;flex:none;
  font-family:var(--arc-mono);font-size:9.5px;font-weight:700;color:var(--text-dim);
  background:var(--s2);border:1px solid var(--border);font-variant-numeric:tabular-nums}
.arc-src-m{min-width:0}
.arc-src-t{display:block;font-size:12.5px;font-weight:600;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arc-src-u{display:block;font-family:var(--arc-mono);font-size:10.5px;color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arc-src-i svg{width:12px;height:12px;flex:none;color:var(--muted);opacity:0;transition:opacity .14s}
.arc-src-i:hover svg{opacity:.8}
/* l'appel de citation dans le texte courant */
.arc-cite{display:inline-grid;place-items:center;min-width:15px;height:15px;padding:0 3px;
  margin:0 1px;vertical-align:1px;border-radius:var(--radius-sm);cursor:pointer;
  font-family:var(--arc-mono);font-size:9.5px;font-weight:700;text-decoration:none;
  color:color-mix(in srgb,var(--accent) 86%,var(--text));
  background:color-mix(in srgb,var(--accent) 12%,transparent)}
.arc-cite:hover{background:color-mix(in srgb,var(--accent) 20%,transparent)}

@media(max-width:520px){
  .arc-prof-m{min-width:0;width:calc(100vw - 32px)}
  .arc-msg-a button{flex:1}
}
