/* Clarity Assistant — launcher and panel.
   Tokens only, so it follows the light/dark theme like everything else. */

.ca-launcher{
  position:fixed;right:1.25rem;bottom:1.25rem;z-index:60;
  display:inline-flex;gap:.5rem;align-items:center;
  padding:.8rem 1.1rem;border:1px solid var(--paul-gold-muted);border-radius:999px;
  background:var(--paul-gold-muted);color:var(--paul-black);
  font:500 .63rem var(--sans);letter-spacing:.14em;text-transform:uppercase;
  cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.18)
}
.ca-launcher span{
  display:grid;place-items:center;width:1.15rem;height:1.15rem;border-radius:50%;
  background:var(--paul-black);color:var(--paul-gold-muted);font-size:.7rem;letter-spacing:0
}
.ca-launcher:hover{background:var(--paul-gold)}

.ca-panel{
  position:fixed;right:1.25rem;bottom:5rem;z-index:61;
  display:flex;flex-direction:column;
  width:min(24rem,calc(100vw - 2.5rem));max-height:min(34rem,calc(100vh - 7rem));
  border:1px solid var(--paul-border);border-radius:14px;
  background:var(--paul-surface);color:var(--paul-text);
  box-shadow:0 18px 50px rgba(0,0,0,.28);overflow:hidden
}
.ca-head{
  display:flex;gap:1rem;justify-content:space-between;align-items:flex-start;
  padding:1rem 1.1rem;border-bottom:1px solid var(--paul-border);background:var(--paul-surface-alt)
}
.ca-head strong{display:block;font:400 1.05rem/1.2 var(--serif)}
.ca-head small{display:block;margin-top:.15rem;font:400 .68rem/1.4 var(--body-serif);color:var(--paul-text-muted)}
.ca-close{
  flex:none;width:1.7rem;height:1.7rem;border:1px solid var(--paul-border);border-radius:7px;
  background:transparent;color:var(--paul-text);cursor:pointer;font-size:1rem;line-height:1
}

.ca-log{flex:1 1 auto;min-height:6rem;overflow-y:auto;padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.75rem}
.ca-msg{max-width:100%;font:400 .84rem/1.6 var(--body-serif)}
.ca-msg.ca-mine{
  align-self:flex-end;padding:.5rem .8rem;border-radius:12px 12px 3px 12px;
  background:var(--paul-ink);color:var(--paul-cream);font-family:var(--sans);font-size:.78rem
}
.ca-msg.ca-from{
  padding:.75rem .9rem;border:1px solid var(--paul-border);border-radius:12px 12px 12px 3px;
  background:var(--paul-surface-alt)
}
.ca-msg.ca-from strong{display:block;margin-bottom:.35rem;font:500 .78rem/1.35 var(--sans)}
.ca-body p{margin:0 0 .55rem}
.ca-body p:last-child{margin-bottom:0}
.ca-body b{font-weight:600}
.ca-body a{color:var(--paul-gold-text)}

.ca-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem}
.ca-chip{
  padding:.4rem .65rem;border:1px solid var(--paul-border);border-radius:999px;
  background:var(--paul-surface);color:var(--paul-text);cursor:pointer;
  font:400 .72rem/1.3 var(--sans);text-align:left
}
.ca-chip:hover{border-color:var(--paul-gold-muted);color:var(--paul-gold-text)}
.ca-go{
  display:inline-block;margin-top:.6rem;padding:.5rem .8rem;
  border:1px solid var(--paul-gold-muted);border-radius:8px;
  background:transparent;color:var(--paul-gold-text);cursor:pointer;
  font:500 .6rem var(--sans);letter-spacing:.12em;text-transform:uppercase
}
.ca-go:hover{background:var(--paul-gold-muted);color:var(--paul-black)}

.ca-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;padding:.85rem 1.1rem;border-top:1px solid var(--paul-border)}
.ca-label{grid-column:1/-1;font:400 .58rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--paul-text-muted)}
.ca-form input{
  padding:.6rem .7rem;border:1px solid var(--paul-border);border-radius:8px;
  background:var(--paul-surface);color:var(--paul-text);font:400 .82rem var(--body-serif)
}
.ca-form button{
  padding:.6rem .95rem;border:1px solid var(--paul-gold-muted);border-radius:8px;
  background:var(--paul-gold-muted);color:var(--paul-black);cursor:pointer;
  font:500 .6rem var(--sans);letter-spacing:.12em;text-transform:uppercase
}
.ca-foot{margin:0;padding:0 1.1rem .9rem;font:400 .68rem/1.5 var(--body-serif);color:var(--paul-text-muted)}
.ca-foot a{color:var(--paul-gold-text)}

/* The workspace styles bare labels and inputs under an id selector, which
   outranks the class rules above. Restate what it clobbers. */
#workspace-content ~ .ca-panel .ca-label,
.ca-panel label.ca-label{margin-bottom:0;text-transform:uppercase;letter-spacing:.14em}

@media (max-width:600px){
  .ca-panel{right:.6rem;left:.6rem;bottom:4.6rem;width:auto;max-height:calc(100vh - 6.5rem)}
  .ca-launcher{right:.6rem;bottom:.6rem}
}
@media print{.ca-launcher,.ca-panel{display:none}}

/* Stepped aside when the page's own call to action occupies this corner. */
.ca-launcher.ca-left{right:auto;left:1.25rem}
.ca-panel.ca-left{right:auto;left:1.25rem}
@media (max-width:600px){.ca-launcher.ca-left{left:.6rem}.ca-panel.ca-left{left:.6rem;right:.6rem}}