/* Stevie, bottom right, out of the way of everything that earns.
   He sits above the fold of nothing: the buy buttons, the sticky filter bar
   and the age gate all outrank him, which is why he is small, anchored to a
   corner, and respects the safe area on a phone. */
.sv3{position:fixed;right:.75rem;will-change:transform;bottom:calc(.75rem + env(safe-area-inset-bottom,0px));z-index:8800;
  display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;font-family:'DM Sans',sans-serif;}

/* Two states. Until the model is in memory he is a small flat badge, which is
   the 13KB fallback and all a slow phone ever gets. The moment the rig loads
   he steps out of that badge and stands on the page at full height: no disc,
   no border, no card, just the character with a shadow under his shoes. The
   owner's words were "hes theres but in a tiny bubble", and the bubble was the
   problem, not the size alone. */
.sv3-tab{position:relative;width:60px;height:60px;border-radius:50%;cursor:pointer;padding:0;
  background:radial-gradient(circle at 50% 35%,rgba(47,106,47,.95),rgba(20,26,18,.96));
  border:1px solid rgba(214,184,94,.5);box-shadow:0 6px 22px rgba(0,0,0,.5);
  display:flex;align-items:center;justify-content:center;overflow:visible;
  transition:width .45s cubic-bezier(.2,.9,.3,1),height .45s cubic-bezier(.2,.9,.3,1),
             background-color .3s,border-color .3s,box-shadow .3s,transform .2s;}
.sv3-tab:hover{transform:translateY(-2px);border-color:var(--gold,#D6B85E);}
.sv3-tab img{border-radius:50%;}
.sv3-stage{position:absolute;inset:0;border-radius:50%;overflow:hidden;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:center;}
.sv3-stage canvas{display:block;}

/* standing, once the rig is live */
.sv3-live .sv3-tab{width:var(--sv3-w,240px);height:var(--sv3-h,312px);border-radius:0;
  background:none;border:0;box-shadow:none;}
.sv3-live .sv3-tab:hover{transform:translateY(-3px) scale(1.03);}
.sv3-live .sv3-stage{border-radius:0;overflow:visible;}
/* the shadow is what stops him looking pasted on */
.sv3-live .sv3-tab::after{content:"";position:absolute;left:50%;bottom:11px;transform:translateX(-50%);
  width:40%;height:9px;border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(0,0,0,.5),rgba(0,0,0,0) 72%);}
@media (prefers-reduced-motion:reduce){ .sv3-tab{transition:none;} }

.sv3-panel{display:none;width:min(88vw,330px);max-height:min(72vh,460px);
  background:var(--dark,#1b231a);border:1px solid rgba(214,184,94,.3);border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.55);overflow:hidden;flex-direction:column;}
.sv3.sv3-open .sv3-panel{display:flex;}

.sv3-head{display:flex;align-items:center;justify-content:space-between;padding:.6rem .8rem;
  border-bottom:1px solid rgba(89,146,64,.2);font-size:.8rem;color:var(--cream,#F4F0E1);}
.sv3-x{background:none;border:0;color:var(--muted,#859a7a);font-size:.8rem;cursor:pointer;padding:.2rem .3rem;}
.sv3-x:hover{color:var(--cream,#F4F0E1);}

.sv3-log{flex:1;overflow-y:auto;padding:.7rem .8rem;display:flex;flex-direction:column;gap:.5rem;}
.sv3-msg{font-size:.78rem;line-height:1.6;padding:.5rem .65rem;border-radius:10px;max-width:92%;}
.sv3-stevie{background:var(--moss,#253020);color:var(--text,#d4dfca);align-self:flex-start;border-bottom-left-radius:3px;}
.sv3-you{background:rgba(47,106,47,.35);color:var(--cream,#F4F0E1);align-self:flex-end;border-bottom-right-radius:3px;}
.sv3-links{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.45rem;}
.sv3-links a{font-family:'DM Mono',monospace;font-size:.62rem;color:var(--sage,#8cc466);
  border:1px solid rgba(140,196,102,.4);border-radius:5px;padding:.2rem .45rem;text-decoration:none;}
.sv3-links a:hover{background:var(--sage,#8cc466);color:var(--black,#141a12);}

.sv3-chips{display:flex;gap:.3rem;overflow-x:auto;padding:0 .8rem .5rem;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(to right,#000 88%,transparent 100%);
  mask-image:linear-gradient(to right,#000 88%,transparent 100%);}
.sv3-chips::-webkit-scrollbar{display:none;}
.sv3-chips button{flex:0 0 auto;font-family:'DM Mono',monospace;font-size:.6rem;cursor:pointer;
  background:rgba(47,106,47,.2);border:1px solid rgba(89,146,64,.35);border-radius:14px;
  padding:.3rem .6rem;color:var(--sage,#8cc466);}
.sv3-chips button:hover{background:var(--sage,#8cc466);color:var(--black,#141a12);}

.sv3-form{display:flex;gap:.4rem;padding:.6rem .8rem;border-top:1px solid rgba(89,146,64,.18);}
.sv3-form input{flex:1;min-width:0;background:var(--black,#141a12);border:1px solid rgba(89,146,64,.3);
  border-radius:8px;padding:.5rem .6rem;color:var(--cream,#F4F0E1);font-size:.82rem;outline:none;}
.sv3-form input:focus{border-color:var(--gold,#D6B85E);}
.sv3-form button{background:var(--gold,#D6B85E);color:var(--black,#141a12);border:0;border-radius:8px;
  padding:.5rem .8rem;font-family:'Bebas Neue',sans-serif;letter-spacing:.1em;font-size:.76rem;cursor:pointer;}

@media (prefers-reduced-motion: reduce){ .sv3-tab{transition:none;} }
@media (max-width:380px){ .sv3-panel{width:92vw;} }