/* ============================================================================
 * OJ HUB — ORBE DO JARVIS (botão flutuante da IA, presente em todas as páginas)
 * Orbe dinâmico: núcleo com gradiente + anéis de pulso + barras de voz.
 * Ao ouvir, as barras reagem e o núcleo acende.
 * ========================================================================== */

.oj-orb{
  position:fixed; right:26px; bottom:26px; z-index:95;
  width:66px; height:66px; border-radius:50%;
  border:1px solid rgba(201,162,39,.55);
  background:radial-gradient(circle at 32% 28%, #2b4a72 0%, #12263f 46%, #07111f 100%);
  cursor:pointer; display:grid; place-items:center;
  box-shadow:0 0 0 6px rgba(201,162,39,.09), 0 16px 44px rgba(0,0,0,.62);
  transition:transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s;
  animation:ojOrbBreathe 4.2s ease-in-out infinite;
  font-family:inherit;
}
.oj-orb:hover{transform:scale(1.07)}
.oj-orb:active{transform:scale(.97)}

@keyframes ojOrbBreathe{
  0%,100%{box-shadow:0 0 0 6px rgba(201,162,39,.09), 0 16px 44px rgba(0,0,0,.62)}
  50%{box-shadow:0 0 0 14px rgba(201,162,39,.03), 0 16px 44px rgba(0,0,0,.62)}
}

/* anéis de pulso */
.oj-orb::before,.oj-orb::after{
  content:''; position:absolute; inset:-1px; border-radius:50%;
  border:1px solid rgba(201,162,39,.45); pointer-events:none;
  animation:ojOrbRing 3.4s ease-out infinite;
}
.oj-orb::after{animation-delay:1.7s}
@keyframes ojOrbRing{
  0%{transform:scale(1); opacity:.55}
  70%{transform:scale(1.55); opacity:0}
  100%{transform:scale(1.55); opacity:0}
}

/* barras de voz */
.oj-orb-bars{display:flex; align-items:center; gap:2.5px; height:22px; position:relative; z-index:2}
.oj-orb-bars i{
  display:block; width:2.6px; border-radius:3px;
  background:linear-gradient(180deg,#e5c65e,#c9a227);
  animation:ojOrbBar 1.5s ease-in-out infinite;
}
.oj-orb-bars i:nth-child(1){height:8px;  animation-delay:0s}
.oj-orb-bars i:nth-child(2){height:15px; animation-delay:.14s}
.oj-orb-bars i:nth-child(3){height:21px; animation-delay:.28s}
.oj-orb-bars i:nth-child(4){height:15px; animation-delay:.42s}
.oj-orb-bars i:nth-child(5){height:8px;  animation-delay:.56s}
@keyframes ojOrbBar{0%,100%{transform:scaleY(.55); opacity:.75}50%{transform:scaleY(1); opacity:1}}

/* estado ouvindo */
.oj-orb.ouvindo{animation:none; border-color:#e5c65e;
  box-shadow:0 0 0 8px rgba(229,198,94,.16), 0 0 34px rgba(229,198,94,.5)}
.oj-orb.ouvindo::before,.oj-orb.ouvindo::after{animation-duration:1.1s; border-color:rgba(229,198,94,.8)}
.oj-orb.ouvindo .oj-orb-bars i{animation-duration:.5s}

/* dica */
.oj-orb-tip{
  position:fixed; right:104px; bottom:52px; z-index:95;
  background:rgba(16,31,53,.97); border:1px solid rgba(201,162,39,.42);
  border-radius:10px; padding:10px 15px; font-size:12.5px; color:#eaf2fb;
  white-space:nowrap; pointer-events:none; opacity:0; transform:translateX(8px);
  transition:opacity .35s .3s, transform .35s .3s;
  box-shadow:0 10px 30px rgba(0,0,0,.5);
  font-family:'Inter',-apple-system,sans-serif;
}
.oj-orb-tip.show{opacity:1; transform:translateX(0)}
@media(max-width:640px){ .oj-orb{width:58px;height:58px;right:16px;bottom:16px} .oj-orb-tip{display:none} }

/* ───────────────────────── PAINEL ───────────────────────── */
.oj-painel{
  position:fixed; right:26px; bottom:104px; z-index:96;
  width:378px; max-width:calc(100vw - 32px);
  height:min(560px, calc(100vh - 150px));
  background:linear-gradient(180deg,#0d1c30,#08131f);
  border:1px solid #24405f; border-radius:16px;
  box-shadow:0 30px 80px rgba(0,0,0,.72), 0 0 0 1px rgba(255,255,255,.02);
  display:none; flex-direction:column; overflow:hidden;
  font-family:'Inter',-apple-system,sans-serif; color:#eaf2fb;
}
.oj-painel.aberto{display:flex; animation:ojOrbIn .24s cubic-bezier(.2,.7,.2,1)}
@keyframes ojOrbIn{from{opacity:0; transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}

.oj-p-top{display:flex; align-items:center; gap:10px; padding:13px 14px;
  background:rgba(16,31,53,.9); border-bottom:1px solid #1c2f47; flex:none}
.oj-p-mini{width:32px;height:32px;border-radius:50%;flex:none; display:grid; place-items:center;
  background:radial-gradient(circle at 32% 28%,#2b4a72,#07111f); border:1px solid rgba(201,162,39,.55)}
.oj-p-mini .d{width:9px;height:9px;border-radius:50%;background:linear-gradient(180deg,#e5c65e,#c9a227);
  box-shadow:0 0 10px rgba(229,198,94,.75)}
.oj-p-nome{font-size:13.5px;font-weight:700;line-height:1.2}
.oj-p-sub{font-size:10.5px;color:#8299b1}
.oj-p-x{margin-left:auto;background:none;border:none;color:#8299b1;font-size:20px;
  cursor:pointer;line-height:1;padding:2px 4px;border-radius:6px;font-family:inherit}
.oj-p-x:hover{color:#eaf2fb;background:rgba(255,255,255,.06)}

.oj-p-msgs{flex:1; overflow-y:auto; padding:14px 13px; display:flex; flex-direction:column; gap:9px;
  background:radial-gradient(circle at 20% 0%, rgba(201,162,39,.05), transparent 46%)}
.oj-p-msg{max-width:88%; font-size:12.6px; line-height:1.55; padding:9px 12px; border-radius:11px;
  white-space:pre-wrap; word-wrap:break-word}
.oj-p-msg.bot{background:#152740; border:1px solid #1f3a58; align-self:flex-start; border-top-left-radius:3px}
.oj-p-msg.user{background:#1c4a6e; border:1px solid #275f8b; align-self:flex-end; border-top-right-radius:3px}
.oj-p-msg .meta{display:block; font-size:9.5px; letter-spacing:.6px; text-transform:uppercase;
  color:#7d93ab; margin-bottom:3px}
.oj-p-msg.user .meta{color:#a8c8e0}

.oj-p-sug{display:flex; gap:6px; flex-wrap:wrap; padding:0 13px 10px}
.oj-p-sug button{background:rgba(201,162,39,.08); border:1px solid rgba(201,162,39,.28);
  color:#e5c65e; font-size:11px; padding:5px 9px; border-radius:100px; cursor:pointer;
  font-family:inherit; transition:background .2s}
.oj-p-sug button:hover{background:rgba(201,162,39,.17)}

.oj-p-in{display:flex; align-items:center; gap:7px; padding:10px 11px;
  border-top:1px solid #1c2f47; background:rgba(9,20,33,.9); flex:none}
.oj-p-in input{flex:1; background:#0d1c30; border:1px solid #24405f; border-radius:9px;
  padding:9px 11px; color:#eaf2fb; font-family:inherit; font-size:12.5px; outline:none}
.oj-p-in input::placeholder{color:#5d7791}
.oj-p-in input:focus{border-color:rgba(201,162,39,.55)}
.oj-p-btn{width:34px;height:34px;border-radius:9px;border:1px solid #24405f;background:#152740;
  color:#eaf2fb;cursor:pointer;display:grid;place-items:center;font-size:15px;flex:none;
  transition:background .2s,border-color .2s;font-family:inherit}
.oj-p-btn:hover{background:#1d3350}
.oj-p-btn.gold{background:linear-gradient(180deg,#e5c65e,#c9a227); border-color:transparent; color:#1a1405}
.oj-p-btn.rec{border-color:#e5c65e; background:rgba(229,198,94,.16); color:#e5c65e;
  animation:ojOrbPulse .9s ease-in-out infinite alternate; opacity:1!important}
@keyframes ojOrbPulse{from{opacity:.65}to{opacity:1}}
.oj-p-foot{font-size:9.5px; color:#5d7791; text-align:center; padding:0 12px 9px; flex:none; line-height:1.4}

@media(prefers-reduced-motion:reduce){
  .oj-orb,.oj-orb::before,.oj-orb::after,.oj-orb-bars i{animation:none}
}