/* Holograma de la mascota (estilo Jarvis, Mictlán). */
.holo{--c:#ffb44a;--c2:#ff5a1f;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:20px;min-width:0}
.holo[data-tipo=fenrir]{--c:#9fd8ff;--c2:#ff505e}.holo[data-tipo=ajolote]{--c:#c28aff;--c2:#3fd0ff}
.holo-stage{position:relative;min-height:520px;border:1px solid color-mix(in srgb,var(--c) 45%,transparent);border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 45%,#1d1530,#07070d 70%);box-shadow:inset 0 0 60px #000,0 0 30px color-mix(in srgb,var(--c) 18%,transparent)}
.holo-stage:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff06 0 1px,transparent 1px 4px);pointer-events:none;z-index:3}
.holo-env{position:absolute;inset:0;width:100%;height:100%}
.holo-ring{position:absolute;left:50%;top:44%;width:min(78%,400px);transform:translate(-50%,-50%);overflow:visible;animation:holo-spin 40s linear infinite}
.holo-ring circle{fill:none;stroke-linecap:round;transform:rotate(-90deg);transform-origin:100px 100px}
.r-base{stroke:#ffffff12;stroke-width:3}.r-xp{stroke:var(--c);stroke-width:3;filter:drop-shadow(0 0 4px var(--c))}.r-hp{stroke:#ff789f;stroke-width:3}.r-dash{stroke:var(--c);stroke-width:1;stroke-dasharray:2 6!important;opacity:.6}
.interior .holo-pet{position:absolute;left:50%;top:44%;width:min(46%,230px);aspect-ratio:1;padding:0;border:2px solid var(--c);border-radius:50%;background:#120d1c;overflow:hidden;cursor:pointer;transform:translate(-50%,-50%);will-change:transform;box-shadow:0 0 35px color-mix(in srgb,var(--c) 55%,transparent),0 0 90px color-mix(in srgb,var(--c2) 25%,transparent);z-index:2}
.interior .holo-pet img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.holo-pet:after{content:'';position:absolute;inset:0;border-radius:50%;background:linear-gradient(180deg,transparent 40%,color-mix(in srgb,var(--c) 25%,transparent));mix-blend-mode:screen}
.holo-pet:focus-visible{outline:3px solid #fff;outline-offset:6px}
.holo-stage[data-modo=habla] .holo-pet{box-shadow:0 0 50px var(--c),0 0 120px var(--c2)}
.holo-stage[data-modo=escucha] .holo-ring{animation-duration:8s}
.holo-stage[data-modo=piensa] .holo-ring .r-dash{animation:holo-pulse .8s ease-in-out infinite alternate}
.holo-stage[data-modo=feliz] .holo-pet{filter:brightness(1.2) saturate(1.3)}
.holo-pet.mimo img{animation:holo-hop .6s ease-in-out 2}
.holo-name{position:absolute;left:0;right:0;top:12px;margin:0;text-align:center;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--c);z-index:4;text-shadow:0 0 8px var(--c)}
.holo-hud{position:absolute;left:12px;right:12px;bottom:12px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;z-index:4}
.hud-chip{min-width:92px;padding:6px 10px;border:1px solid color-mix(in srgb,var(--c) 50%,transparent);border-radius:10px;background:#0a0a12cc;backdrop-filter:blur(4px);text-align:center}
.hud-chip small{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#bfb2cc}.hud-chip strong{font-size:14px;color:#fff}
.hud-ia[data-ok=true] strong{color:#7dffb0}.hud-ia[data-ok=false] strong{color:#ffcf6a}
.holo-side{display:grid;gap:14px;align-content:start;min-width:0}
.holo-aviso{padding:14px 16px;border-radius:14px;border:1px solid #ffcf6a;background:linear-gradient(135deg,#2c2110,#140f18)}
.holo-aviso[data-ok=true]{border-color:#3d8f63;background:#0f1d16}.holo-aviso h3{margin:0 0 6px;color:#ffcf6a;font-size:17px}.holo-aviso p{margin:4px 0}.holo-aviso ol{margin:8px 0;padding-left:20px}.holo-aviso li{margin:4px 0}.holo-aviso a{color:var(--c)}
.holo-key{display:flex;gap:8px;margin-top:10px}.holo-key input{flex:1}
.holo-chat{display:grid;gap:8px;padding:12px;border:1px solid #3b2f4a;border-radius:14px;background:#0b0a12}
.holo-log{height:300px;overflow:auto;display:flex;flex-direction:column;gap:8px;padding-right:4px}
.holo-log .msg{margin:0;max-width:85%;padding:9px 12px;border-radius:14px;line-height:1.4;overflow-wrap:anywhere}
.holo-log .pet{align-self:flex-start;background:color-mix(in srgb,var(--c) 16%,#15111f);border:1px solid color-mix(in srgb,var(--c) 40%,transparent);border-bottom-left-radius:4px}
.holo-log .yo{align-self:flex-end;background:#2a2238;border-bottom-right-radius:4px}
.holo-form{display:flex;gap:8px}.holo-form input{flex:1}
.holo-atajos{display:flex;flex-wrap:wrap;gap:6px}.holo-atajos button{font-size:12px;padding:5px 10px;border-radius:999px}
.holo-cerebro{padding:10px 14px;border:1px solid #3b2f4a;border-radius:14px;background:#0b0a12}.holo-cerebro summary{cursor:pointer;color:var(--c)}
@keyframes holo-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes holo-pulse{to{opacity:1;stroke-width:3}}
@keyframes holo-hop{50%{transform:translateY(-10%)}}
@media(max-width:900px){.holo-ring,.interior .holo-pet{top:36%}.holo-ring{width:min(70%,330px)}.interior .holo-pet{width:min(40%,200px)}.holo{grid-template-columns:1fr}.holo-stage{min-height:430px}.holo-log{height:260px}.hud-chip{min-width:0;flex:1 1 28%}}
@media(prefers-reduced-motion:reduce){.holo *{animation:none!important}}
.interior .holo-pet.con-rig{border:0;border-radius:0;background:none;overflow:visible;box-shadow:none}
.holo-pet.con-rig img{display:none}.holo-pet.con-rig:after{display:none}
.holo-rig{position:absolute;inset:-12%;width:124%;height:124%;filter:drop-shadow(0 0 18px color-mix(in srgb,var(--c) 45%,transparent))}
.holo-stage[data-modo=habla] .holo-pet.con-rig{box-shadow:none}.holo-stage[data-modo=habla] .holo-rig{filter:drop-shadow(0 0 30px var(--c))}

.holo-pet[data-estado=sleep]:before{content:'z z z';position:absolute;right:-6%;top:-4%;color:var(--c);font-size:14px;letter-spacing:4px;animation:holo-zz 2.5s ease-in-out infinite;z-index:3}
@keyframes holo-zz{50%{transform:translateY(-8px);opacity:.5}}
.holo-mundos{display:grid;grid-template-columns:1fr 1fr;gap:8px}.holo-mundo{display:block;padding:12px 14px;border:1px solid var(--c);border-radius:12px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 22%,#120d1c),#0b0a12);color:#fff;text-decoration:none;font-weight:600;text-align:center}.holo-mundo:hover,.holo-mundo:focus-visible{box-shadow:0 0 18px color-mix(in srgb,var(--c) 50%,transparent)}@media(max-width:500px){.holo-mundos{grid-template-columns:1fr}}

/* ---- Panel simple de mascota (2D original, sin 3D) ---- */
.holo-stage.mp-escena{position:relative;overflow:hidden;border-radius:18px;min-height:340px;display:flex;align-items:flex-end;justify-content:center;background:#0b0910;border:1px solid color-mix(in srgb,var(--c) 30%,transparent);box-shadow:inset 0 -60px 80px #0008}
.mp-fondo{position:absolute;inset:-8%;background-size:cover;background-position:center;filter:blur(16px) saturate(1.05) brightness(.5);transform:scale(1.1);animation:mp-deriva 38s ease-in-out infinite alternate}
.mp-escena::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 92%,#0000 30%,#0007 80%);pointer-events:none}
@keyframes mp-deriva{from{transform:scale(1.1) translate(-1.2%,0)}to{transform:scale(1.14) translate(1.2%,-1%)}}
.mp-pet{position:relative;z-index:1;background:none;border:0;padding:0;margin:0 auto 4%;width:min(78%,520px);cursor:pointer;filter:drop-shadow(0 18px 18px #000a)}
.holo[data-tipo=fenrir] .mp-pet{width:min(94%,640px);margin-bottom:6%}
.holo .holo-stage.mp-escena .holo-pet{transform:none;left:auto;top:auto}
.mp-perfil{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:#120f18;border:1px solid #ffffff14;margin-bottom:10px}
.mp-foto{width:56px;height:56px;border-radius:50%;object-fit:cover;border:2px solid var(--c)}
.mp-perfil>div:nth-child(2){display:flex;flex-direction:column;flex:1;min-width:0}
.mp-ia{display:flex;flex-direction:column;align-items:flex-end;font-size:12px}.mp-ia strong{font-size:13px}
@media (max-width:700px){.holo-stage.mp-escena{min-height:260px}}
@media (prefers-reduced-motion:reduce){.mp-fondo{animation:none}}
.interior .holo-pet.mp-pet{position:relative;left:auto;top:auto;aspect-ratio:auto;border:0;border-radius:0;background:none;overflow:visible;box-shadow:none;transform:none;z-index:1}
.holo-pet.mp-pet:after{display:none}.holo-stage.mp-escena:before{display:none}
.holo-stage.mp-escena[data-modo=habla] .holo-pet{box-shadow:none}
.holo-stage.mp-escena{align-self:start;min-height:0;height:min(560px,68vh);align-items:center}
.interior .holo-pet.mp-pet{width:min(74%,420px);margin:6% auto 0}
.interior .holo[data-tipo=fenrir] .holo-pet.mp-pet{width:min(96%,620px);margin-top:14%}
.holo[data-tipo=fenix] .m2d{-webkit-mask-image:radial-gradient(ellipse 62% 62% at 46% 50%,#000 55%,transparent 98%);mask-image:radial-gradient(ellipse 62% 62% at 46% 50%,#000 55%,transparent 98%)}
@media (max-width:700px){.holo-stage.mp-escena{height:min(380px,52vh)}.interior .holo-pet.mp-pet{width:min(70%,300px)}}