/* LOOPY · estilo integrado en CREAR PARA VIVIR.EXE (hereda variables, fuentes y modo día/noche de la web) */
.cpv-widget--floating{--size:clamp(128px,12.5vw,172px);left:max(10px,1.4vw);right:auto;bottom:calc(46px - var(--size)*.13);z-index:9999;visibility:hidden;opacity:0;font-family:var(--font-body)}
.cpv-widget.is-ready{visibility:visible;opacity:1;animation:loopyIn .8s cubic-bezier(.2,1.4,.4,1)}
@keyframes loopyIn{from{opacity:0;transform:translateY(55%) scale(.6)}to{opacity:1;transform:none}}
#loopy-trail{position:fixed;inset:0;width:100vw;height:100vh;z-index:9990;pointer-events:none}
.cpv-character.is-sleeping .cpv-character__hit,.cpv-character[data-state="sleeping"] .cpv-character__hit{cursor:pointer}

/* Burbuja minimalista: una sola caja, sin barra de título. Crece mientras se escribe el texto. */
.cpv-widget{--bub-bg:#fffdf8;--bub-line:var(--ink,#111018);--bub-text:var(--text,#111018);--bub-shadow:var(--turquesa,#48e0cf)}
:root[data-theme="night"] .cpv-widget{--bub-bg:#1b1f36;--bub-line:#48e0cf;--bub-text:#f5f3ff;--bub-shadow:#0b0c18}
.cpv-bubble{--dx:0px;right:auto;bottom:auto;width:max-content;max-width:min(236px,78vw);min-width:0;padding:8px 22px 9px 12px;
  background:var(--bub-bg);color:var(--bub-text);border:2.5px solid var(--bub-line);border-radius:14px;box-shadow:3px 3px 0 var(--bub-shadow);
  font:500 12.5px/1.5 var(--font-body);translate:-50% 0;transform-origin:50% 100%;transform:translateY(8px) scale(.88)}
.cpv-bubble.is-below{transform-origin:50% 0;transform:translateY(-8px) scale(.88)}
.cpv-bubble.is-on{transform:none}
.cpv-bubble p{margin:0;min-height:1.5em;max-height:32dvh;overflow-y:auto;overflow-wrap:anywhere}
.cpv-bubble::before{content:none}
/* colita: apunta siempre a la cabeza de Loopy */
.cpv-bubble::after{right:auto;left:clamp(16px,calc(50% - var(--dx)),calc(100% - 16px));bottom:-7.5px;top:auto;width:11px;height:11px;margin-left:-5.5px;
  background:var(--bub-bg);border:solid var(--bub-line);border-width:0 2.5px 2.5px 0;border-radius:0 0 3px 0;transform:rotate(45deg)}
.cpv-bubble.is-below::after{bottom:auto;top:-7.5px;border-width:2.5px 0 0 2.5px;border-radius:3px 0 0 0}
/* cerrar: una "×" discreta */
.cpv-bubble__x{top:2px;right:3px;width:18px;height:18px;border:0;border-radius:6px;background:none;color:var(--bub-text);font:700 13px/1 var(--font-body);opacity:.35;display:grid;place-items:center;box-shadow:none}
.cpv-bubble__x:hover{opacity:1;background:var(--pop-rose,#ff9bd7);color:#111018}
/* acciones: píldoras pequeñas */
.cpv-bubble__actions{gap:5px;max-height:30dvh;overflow-y:auto;padding:3px}
.cpv-bubble__actions:not(:empty){margin-top:7px}
.cpv-bubble__actions button{padding:3px 9px;border:2px solid var(--bub-line);border-radius:999px;background:var(--turquesa,#48e0cf);color:#111018;box-shadow:none;font:700 10.5px var(--font-body);letter-spacing:.03em}
.cpv-bubble__actions button:hover{background:var(--lavanda,#c9b7ff);transform:translateY(-1px)}
.cpv-bubble__actions button:active{transform:translateY(1px)}
.cpv-bubble__actions button:focus-visible,.cpv-bubble__x:focus-visible{outline:3px solid var(--accent,#ff4fbd);outline-offset:2px}
.cpv-fx{font-family:var(--font-pixel);font-size:calc(var(--size)*.15);font-weight:400;text-shadow:2px 2px 0 var(--ink,#111018)}
@media (max-width:720px){.cpv-widget--floating{--size:116px;bottom:calc(50px - var(--size)*.13)}.cpv-bubble{font-size:12px;max-width:72vw}}
@media (prefers-reduced-motion:reduce){.cpv-widget.is-ready{animation:none}}

@media(max-width:820px){
  .cpv-widget--floating{--size:76px}
  .cpv-widget.mobile-docked{--size:48px;left:8px!important;right:8px!important;top:auto!important;bottom:calc(var(--mbot,56px) + 4px)!important;width:auto;aspect-ratio:auto;min-height:48px;animation:none;background:var(--bub-bg);border-radius:12px}
  .mobile-docked:not(:has(.cpv-bubble.is-on))::after{content:'Loopy';position:absolute;left:62px;top:14px;color:var(--bub-text);font:400 20px/1 var(--font-pixel)}
  .mobile-docked .cpv-character{inset:0 auto auto 0;width:48px!important}
  .cpv-widget.mobile-docked::before{display:none}
  .mobile-docked .cpv-bubble{position:relative;display:none;left:auto!important;top:auto!important;bottom:auto!important;margin-left:54px;width:fit-content;max-width:calc(100% - 54px);translate:none;transform:none;padding:8px 32px 8px 10px;font-size:11px;line-height:1.45;border-width:2px;border-radius:10px;box-shadow:none}
  .mobile-docked .cpv-bubble.is-on{display:block}
  .mobile-docked .cpv-bubble::after{display:none}
  .mobile-docked .cpv-bubble p{max-height:14dvh}
  .mobile-docked .cpv-bubble__actions{max-height:10dvh}
  .mobile-docked .cpv-bubble__x{width:28px;height:28px;opacity:.7;font-size:17px}
  .window:fullscreen .mobile-docked{bottom:4px!important}
}
