/* ====== Smooth UI (1.6.1 + Live Monitor) ====== */
#v98pro-root{ position:relative; z-index:2147483000; font-size:14px; }
.v98pro-fab{
  position: fixed; right: 18px; bottom: 18px; z-index: 2147483001;
  width: 52px; height: 52px; border-radius: 14px; border: none; cursor: pointer;
  background: var(--v98pro); color: #fff; display:flex; align-items:center; justify-content:center;
  box-shadow: 0 16px 36px rgba(16,24,40,.24);
}
.v98pro-pane{
  position: fixed; right: 18px; bottom: 96px; z-index: 2147483002;
  width: 340px; max-width: 94vw; height: min(560px, calc(100vh - 120px));
  display:none; flex-direction:column;
  background:#fff; color:#0B1220; border:1px solid #EAECF0; border-radius:18px;
  box-shadow: 0 22px 56px rgba(16,24,40,.24);
}
.v98pro-pane.open{ display:flex; }
.v98pro-head{ height:62px; padding:12px 12px; display:flex; align-items:center; justify-content:space-between;
  background: linear-gradient(135deg, var(--v98pro) 0%, #8f7afe 100%); color:#fff; }
.v98pro-brand{ display:flex; align-items:center; gap:10px; }
.v98pro-avatar{ width:28px; height:28px; border-radius:8px; background: rgba(255,255,255,.22); display:grid; place-items:center; font-weight:700; }
.v98pro-avatar img{ width:28px; height:28px; border-radius:8px; display:block; }
.v98pro-title{ font-weight:700; font-size:14px; line-height:1.25; }
.v98pro-sub{ font-size:11.5px; opacity:.95; margin-top:2px; }
.v98pro-actions{ display:flex; gap:8px; }
.v98pro-actions button{ width:30px; height:30px; border-radius:8px; background: rgba(255,255,255,.22); color:#fff; border: 1px solid rgba(255,255,255,.45); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 1px 2px rgba(16,24,40,.10); cursor:pointer; line-height:0; display:grid; place-items:center; }

.v98pro-body{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; background:#fff; position:relative; }
.v98pro-msgs{ flex:1 1 auto; min-height:0; overflow:auto; padding:12px; display:flex; flex-direction:column; gap:8px; }
.msg{ display:flex; } .msg.user{ justify-content:flex-end; }
.msg .bubble{ max-width:80%; padding:10px 12px; border-radius:14px; line-height:1.6; background:#F9FAFB; border:1px solid #EDF1F4; box-shadow: 0 1px 2px rgba(16,24,40,.03);
  word-break: break-word; overflow-wrap: anywhere; white-space: pre-wrap; }
.msg.user .bubble{ background:#EEF4FF; border-color:#E3EDFF; }

.v98pro-suggests{ padding: 0 12px 8px 12px; display:flex; gap:6px; flex-wrap:wrap; }
.v98pro-suggests .chip{ border:1px solid #E7E9EE; border-radius:999px; padding:5px 9px; background:#fff; cursor:pointer; font-size:12.5px; transition: transform .12s ease, box-shadow .12s ease; box-shadow: 0 1px 4px rgba(16,24,40,.06); }
.v98pro-suggests .chip:hover{ transform: translateY(-1px); box-shadow: 0 6px 14px rgba(16,24,40,.14); }

.v98pro-bottom{
  position:absolute; right:12px; bottom:12px; width:28px; height:28px; border:none; border-radius:14px;
  background: rgba(108,92,231,.95); color:#fff; display:none; box-shadow:0 10px 22px rgba(108,92,231,.35); cursor:pointer; line-height:0;
}

.v98pro-composer-wrap{ padding: 10px; border-top: 1px solid #F2F4F7; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 60%); }
.v98pro-composer{ display:flex; align-items:center; gap:8px; padding:8px; background:#fff; border:1px solid #E4E7EC; border-radius:12px; box-shadow: 0 8px 22px rgba(16,24,40,.10); }
.v98pro-composer textarea{ flex:1 1 auto; resize:none; max-height:120px; min-height:40px; padding:6px 8px; border:none; outline:none; color:#111; background:transparent; line-height:1.5; font-size:14px; }
.v98pro-composer .send{ width:36px; height:36px; border:none; border-radius:10px; background:var(--v98pro); color:#fff; cursor:pointer; display:grid; place-items:center; line-height:0; box-shadow: 0 10px 22px rgba(108,92,231,.35); }

.bubble.typing{ display:inline-flex; gap:5px; align-items:center; }
.bubble.typing span{ width:5px; height:5px; background:#b5b5b5; display:inline-block; border-radius:50%; animation: t 1.1s infinite ease-in-out; }
.bubble.typing span:nth-child(2){ animation-delay:.12s; } .bubble.typing span:nth-child(3){ animation-delay:.24s; }
@keyframes t { 0%,80%,100%{ opacity:.25; transform: translateY(0);} 40%{ opacity:1; transform: translateY(-3px);} }

@media (prefers-color-scheme: dark){
  #v98pro-root:not(.v98pro-force-light) .v98pro-pane{ background:#0B1220; color:#E2E8F0; border-color:#1E293B; box-shadow: 0 28px 64px rgba(0,0,0,.6); }
  #v98pro-root:not(.v98pro-force-light) .v98pro-body{ background:#0F172A; }
  #v98pro-root:not(.v98pro-force-light) .msg .bubble{ background:#111827; color:#E2E8F0; border-color:#1F2937; }
  #v98pro-root:not(.v98pro-force-light) .msg.user .bubble{ background:#0D1B2A; }
  #v98pro-root:not(.v98pro-force-light) .v98pro-composer{ background:#111827; border-color:#1F2937; }
  #v98pro-root:not(.v98pro-force-light) .v98pro-composer textarea{ color:#E2E8F0; }
}

@media (max-width: 380px){
  .v98pro-pane{ width: 92vw; height: 72vh; right: 4vw; }
}
