/* JRNY Assistant — floating bubble. All rules namespaced under #jrny-root. */
#jrny-root{
  --jrny-forest:#173404; --jrny-forest-2:#0d2102; --jrny-emerald:#2EBF7B; --jrny-emerald-deep:#1f9c63;
  --jrny-paper:#f6f4ec; --jrny-paper-2:#fffdf7; --jrny-ink:#19211a; --jrny-muted:#5f6a5e;
  --jrny-line:rgba(23,52,4,.12); --jrny-line-soft:rgba(23,52,4,.07);
  position:fixed; right:22px; bottom:22px; z-index:2147483000;
  font-family:"Hanken Grotesk",system-ui,-apple-system,sans-serif;
}
#jrny-root *{ box-sizing:border-box; }

/* launcher */
#jrny-root .jrny-fab{
  width:60px; height:60px; border-radius:50%; border:none; cursor:pointer;
  background:linear-gradient(145deg,var(--jrny-forest),var(--jrny-forest-2));
  box-shadow:0 12px 30px -8px rgba(13,33,2,.55); color:var(--jrny-paper-2);
  display:flex; align-items:center; justify-content:center; transition:transform .18s, box-shadow .2s;
  position:relative;
}
#jrny-root .jrny-fab:hover{ transform:translateY(-2px) scale(1.03); }
#jrny-root .jrny-fab svg{ width:27px; height:27px; }
#jrny-root .jrny-fab .jrny-dotmark{
  position:absolute; top:-3px; right:-3px; width:15px; height:15px; border-radius:50%;
  background:var(--jrny-emerald); border:2.5px solid var(--jrny-paper-2);
}

/* chat panel */
#jrny-root .jrny-panel{
  position:absolute; right:0; bottom:74px; width:390px; max-width:calc(100vw - 32px);
  height:min(620px, calc(100vh - 120px));
  background:var(--jrny-paper); border-radius:20px; overflow:hidden;
  box-shadow:0 28px 64px -18px rgba(13,33,2,.5); display:flex; flex-direction:column;
  opacity:0; transform:translateY(14px) scale(.98); pointer-events:none;
  transition:opacity .26s ease, transform .26s cubic-bezier(.2,.8,.2,1);
}
#jrny-root.jrny-open .jrny-panel{ opacity:1; transform:none; pointer-events:auto; }

#jrny-root .jrny-head{ background:var(--jrny-forest); color:var(--jrny-paper-2); padding:16px 16px 15px;
  display:flex; align-items:center; gap:11px; }
#jrny-root .jrny-mark{ width:38px; height:38px; border-radius:11px; flex:none;
  background:linear-gradient(145deg,var(--jrny-emerald),var(--jrny-emerald-deep));
  display:flex; align-items:center; justify-content:center;
  font-family:"Fraunces",serif; font-weight:600; font-size:19px; color:var(--jrny-forest-2); }
#jrny-root .jrny-head h2{ font-family:"Fraunces",serif; font-weight:500; font-size:16.5px; margin:0; line-height:1.1; color:var(--jrny-paper-2); }
#jrny-root .jrny-head .jrny-sub{ font-size:12px; color:rgba(246,244,236,.62); margin-top:2px; display:flex; align-items:center; gap:6px; }
#jrny-root .jrny-livedot{ width:7px; height:7px; border-radius:50%; background:var(--jrny-emerald); }
#jrny-root .jrny-close{ margin-left:auto; background:rgba(255,255,255,.12); border:none; color:var(--jrny-paper-2);
  width:30px; height:30px; border-radius:9px; cursor:pointer; font-size:18px; line-height:1; display:flex; align-items:center; justify-content:center; }
#jrny-root .jrny-close:hover{ background:rgba(255,255,255,.22); }

#jrny-root .jrny-log{ flex:1; overflow-y:auto; padding:18px 16px 6px; display:flex; flex-direction:column; gap:12px; background:var(--jrny-paper); }
#jrny-root .jrny-log::-webkit-scrollbar{ width:7px; }
#jrny-root .jrny-log::-webkit-scrollbar-thumb{ background:var(--jrny-line); border-radius:7px; }

#jrny-root .jrny-row{ display:flex; animation:jrny-fade .4s ease both; }
@keyframes jrny-fade{ from{opacity:0; transform:translateY(7px);} to{opacity:1; transform:none;} }
#jrny-root .jrny-row.jrny-user{ justify-content:flex-end; }
#jrny-root .jrny-bubble{ max-width:85%; padding:11px 14px; border-radius:15px; font-size:14px; line-height:1.5; color:var(--jrny-ink); }
#jrny-root .jrny-row.jrny-bot .jrny-bubble{ background:var(--jrny-paper-2); border:1px solid var(--jrny-line-soft); border-bottom-left-radius:5px; }
#jrny-root .jrny-row.jrny-user .jrny-bubble{ background:var(--jrny-forest); color:var(--jrny-paper-2); border-bottom-right-radius:5px; }
#jrny-root .jrny-bubble p{ margin:0 0 7px; } #jrny-root .jrny-bubble p:last-child{ margin:0; }

#jrny-root .jrny-typing{ display:inline-flex; gap:4px; padding:3px 2px; }
#jrny-root .jrny-typing span{ width:6px; height:6px; border-radius:50%; background:var(--jrny-emerald-deep); opacity:.5; animation:jrny-bounce 1.3s infinite; }
#jrny-root .jrny-typing span:nth-child(2){ animation-delay:.18s; } #jrny-root .jrny-typing span:nth-child(3){ animation-delay:.36s; }
@keyframes jrny-bounce{ 0%,60%,100%{transform:translateY(0);opacity:.4;} 30%{transform:translateY(-5px);opacity:1;} }

#jrny-root .jrny-composer{ border-top:1px solid var(--jrny-line-soft); background:var(--jrny-paper-2); padding:11px 12px; display:flex; gap:9px; align-items:flex-end; }
#jrny-root .jrny-composer textarea{ flex:1; resize:none; border:1px solid var(--jrny-line); border-radius:13px; padding:10px 12px;
  font-family:inherit; font-size:14px; color:var(--jrny-ink); background:var(--jrny-paper); max-height:110px; line-height:1.45; outline:none; }
#jrny-root .jrny-composer textarea:focus{ border-color:var(--jrny-emerald); box-shadow:0 0 0 3px rgba(46,191,123,.16); }
#jrny-root .jrny-send{ flex:none; width:42px; height:42px; border-radius:12px; border:none; cursor:pointer;
  background:linear-gradient(145deg,var(--jrny-emerald),var(--jrny-emerald-deep)); color:#fff; display:flex; align-items:center; justify-content:center; transition:transform .15s; }
#jrny-root .jrny-send:hover{ transform:translateY(-1px); } #jrny-root .jrny-send:disabled{ filter:grayscale(.5) brightness(.92); cursor:default; transform:none; }
#jrny-root .jrny-send svg{ width:19px; height:19px; }
#jrny-root .jrny-foot{ text-align:center; font-size:10.5px; color:var(--jrny-muted); padding:0 0 9px; background:var(--jrny-paper-2); }

/* handoff overlay */
#jrny-root .jrny-scrim{ position:absolute; inset:0; background:rgba(13,33,2,.45); opacity:0; pointer-events:none; transition:opacity .24s; }
#jrny-root .jrny-scrim.jrny-on{ opacity:1; pointer-events:auto; }
#jrny-root .jrny-lead{ position:absolute; left:0; right:0; bottom:0; background:var(--jrny-paper-2); border-radius:18px 18px 0 0;
  padding:20px 18px 18px; transform:translateY(105%); transition:transform .3s cubic-bezier(.2,.8,.2,1); }
#jrny-root .jrny-lead.jrny-on{ transform:none; }
#jrny-root .jrny-lead h3{ font-family:"Fraunces",serif; font-weight:500; font-size:17px; margin:0 0 4px; color:var(--jrny-ink); }
#jrny-root .jrny-lead p{ font-size:13px; color:var(--jrny-muted); margin:0 0 14px; line-height:1.5; }
#jrny-root .jrny-field{ margin-bottom:10px; }
#jrny-root .jrny-field label{ display:block; font-size:11.5px; font-weight:600; color:var(--jrny-forest); margin-bottom:4px; }
#jrny-root .jrny-field input, #jrny-root .jrny-field textarea{ width:100%; border:1px solid var(--jrny-line); border-radius:10px; padding:9px 11px;
  font-family:inherit; font-size:13.5px; color:var(--jrny-ink); background:var(--jrny-paper); outline:none; }
#jrny-root .jrny-field input:focus, #jrny-root .jrny-field textarea:focus{ border-color:var(--jrny-emerald); box-shadow:0 0 0 3px rgba(46,191,123,.16); }
#jrny-root .jrny-actions{ display:flex; gap:9px; margin-top:4px; }
#jrny-root .jrny-btn-primary{ flex:1; background:var(--jrny-forest); color:var(--jrny-paper-2); border:none; border-radius:11px; padding:12px; font-family:inherit; font-size:13.5px; font-weight:700; cursor:pointer; }
#jrny-root .jrny-btn-primary:hover{ background:#1d4406; }
#jrny-root .jrny-btn-ghost{ background:none; border:1px solid var(--jrny-line); border-radius:11px; padding:12px 15px; font-family:inherit; font-size:13.5px; font-weight:600; color:var(--jrny-muted); cursor:pointer; }

@media (max-width:480px){
  #jrny-root{ right:14px; bottom:14px; }
  #jrny-root .jrny-panel{ width:calc(100vw - 24px); height:min(80vh, calc(100vh - 96px)); bottom:72px; }
}
