/* ═══════════════════════════════════════════════════════════
   EL ORÁCULO — widget ritual
   🔴 El contenedor lleva pointer-events:none y solo las piezas
   interactivas lo recuperan. Un flotante que captura clics tapa
   el CTA y nadie se entera: en Locura el clic moría en el banner
   y no se podía comprar.
   ═══════════════════════════════════════════════════════════ */

.orc{
  position:fixed;right:clamp(14px,3vw,28px);bottom:clamp(14px,3vw,28px);
  z-index:150;display:flex;flex-direction:column;align-items:flex-end;gap:12px;
  pointer-events:none;
}
.orc > *{pointer-events:auto}

/* ── el llamador ── */
.orc__btn{
  display:flex;align-items:center;gap:10px;cursor:pointer;
  padding:12px 20px 12px 14px;border-radius:999px;
  background:rgba(10,9,8,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid rgba(184,115,51,.45);color:var(--bone,#EDE7DE);
  font-family:var(--f-ui,system-ui);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  box-shadow:0 12px 40px rgba(0,0,0,.7), 0 0 24px rgba(184,115,51,.18);
  transition:border-color .5s var(--d,ease),box-shadow .5s var(--d,ease),transform .5s var(--d,ease);
}
.orc__btn img{width:26px;height:auto}
.orc__btn:hover{
  border-color:var(--copper-lit,#D9A05B);transform:translateY(-2px);
  box-shadow:0 16px 50px rgba(0,0,0,.8), 0 0 34px rgba(217,160,91,.34);
}
.orc.is-abierto .orc__btn{opacity:0;pointer-events:none;transform:translateY(10px)}

/* ── el panel ── */
.orc__panel{
  width:min(92vw,378px);max-height:min(74vh,600px);
  display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(180deg,rgba(12,11,10,.97),rgba(4,4,4,.98));
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1px solid rgba(184,115,51,.34);
  box-shadow:0 30px 90px rgba(0,0,0,.9), 0 0 40px rgba(184,115,51,.12);
  animation:orcSube .6s var(--d,cubic-bezier(.16,1,.3,1));
}
.orc__panel[hidden]{display:none}
@keyframes orcSube{from{opacity:0;transform:translateY(22px) scale(.97)}}

.orc__hdr{
  display:flex;align-items:center;gap:11px;padding:15px 16px;
  border-bottom:1px solid rgba(184,115,51,.24);
}
.orc__hdr img{width:26px;height:auto}
.orc__hdr div{display:flex;flex-direction:column;line-height:1.15;flex:1;min-width:0}
.orc__hdr b{font-family:var(--f-disp,serif);font-weight:400;font-size:1.02rem;color:#fff}
.orc__hdr em{font-style:normal;font-size:.52rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--ash,#A69B8C);margin-top:4px}
.orc__x{
  background:none;border:0;cursor:pointer;font-size:1.5rem;line-height:1;
  color:var(--ash,#A69B8C);padding:2px 6px;transition:color .35s ease;
}
.orc__x:hover{color:var(--copper-lit,#D9A05B)}

/* ── el hilo ── */
.orc__hilo{
  flex:1;overflow-y:auto;padding:18px 16px;display:flex;flex-direction:column;gap:11px;
  scrollbar-width:thin;scrollbar-color:rgba(184,115,51,.4) transparent;
}
.orc__hilo::-webkit-scrollbar{width:5px}
.orc__hilo::-webkit-scrollbar-thumb{background:rgba(184,115,51,.4)}

.orc__b{
  max-width:88%;padding:11px 14px;font-size:.9rem;line-height:1.6;
  animation:orcEntra .5s var(--d,cubic-bezier(.16,1,.3,1));
}
@keyframes orcEntra{from{opacity:0;transform:translateY(8px)}}
.orc__b--orc{
  align-self:flex-start;background:rgba(184,115,51,.09);
  border:1px solid rgba(184,115,51,.22);color:var(--bone,#EDE7DE);
}
.orc__b--orc b{color:var(--copper-lit,#D9A05B);font-weight:400}
.orc__b--orc i{font-family:var(--f-disp,serif);color:var(--copper-lit,#D9A05B)}
.orc__b--yo{
  align-self:flex-end;background:rgba(237,231,222,.07);
  border:1px solid rgba(237,231,222,.16);color:var(--bone,#EDE7DE);
}

/* los tres puntos mientras "piensa" */
.orc__pts{display:inline-flex;gap:4px;align-items:center;height:1.2em}
.orc__pts i{width:5px;height:5px;border-radius:50%;background:var(--copper,#B87333);
  animation:orcLat 1.2s ease-in-out infinite}
.orc__pts i:nth-child(2){animation-delay:.18s}
.orc__pts i:nth-child(3){animation-delay:.36s}
@keyframes orcLat{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}

/* ── opciones ── */
.orc__ops{
  padding:12px 16px 14px;display:flex;flex-direction:column;gap:8px;
  border-top:1px solid rgba(184,115,51,.18);
}
.orc__op{
  display:block;width:100%;text-align:left;cursor:pointer;text-decoration:none;
  padding:11px 14px;min-height:44px;
  background:transparent;border:1px solid rgba(184,115,51,.34);
  color:var(--bone,#EDE7DE);font-family:var(--f-ui,system-ui);font-size:.82rem;
  transition:background .35s ease,border-color .35s ease,color .35s ease;
}
.orc__op:hover{background:rgba(184,115,51,.14);border-color:var(--copper-lit,#D9A05B);color:#fff}
.orc__op--fuerte{background:var(--copper-lit,#D9A05B);border-color:var(--copper-lit,#D9A05B);
  color:#0a0908;text-align:center;letter-spacing:.14em;text-transform:uppercase;font-size:.74rem}
.orc__op--fuerte:hover{background:#fff;border-color:#fff;color:#000}

/* ── formulario ── */
.orc__form{display:flex;flex-direction:column;gap:9px}
.orc__form label{display:flex;flex-direction:column;gap:5px}
.orc__form span{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ash,#A69B8C)}
.orc__form input{
  background:rgba(0,0,0,.5);border:1px solid rgba(237,231,222,.2);
  color:var(--bone,#EDE7DE);padding:10px 12px;font:inherit;font-size:.88rem;min-height:42px;
}
.orc__form input:focus{outline:none;border-color:var(--copper-lit,#D9A05B)}

.orc__pie{
  padding:0 16px 13px;margin:0;font-size:.6rem;letter-spacing:.06em;
  color:var(--ash,#A69B8C);opacity:.72;text-align:center;
}

@media (max-width:560px){
  .orc__panel{width:calc(100vw - 28px);max-height:78vh}
  .orc__btn span{display:none}
  .orc__btn{padding:14px;border-radius:50%}
  .orc__btn img{width:30px}
}
@media (prefers-reduced-motion:reduce){
  .orc__panel,.orc__b{animation:none}
  .orc__pts i{animation:none;opacity:.7}
}