/* Decoración Halloween · cpuhalloween 1.8 */
/* ================= FRANJA SUPERIOR ================= */
.tcph-strip{--a:#ff7a1a;--a2:#ffb067;--bg:#141320;--chip:rgba(255,255,255,.08);--drip:#ff7a1a;--txt:#fff;
  position:relative;z-index:1001;background:var(--bg);color:var(--txt);border-bottom:2px solid var(--a);font-size:14px;line-height:1.3}
.tcph-strip--purple{--a:#a855f7;--a2:#d8b4fe;--bg:#150d24;--drip:#7e22ce}
.tcph-strip--blood{--a:#d0101c;--a2:#ff8a8a;--bg:#120607;--drip:#8b0000}
.tcph-strip--slime{--a:#7ed321;--a2:#c6f432;--bg:#0d140a;--drip:#5fa01a}
.tcph-strip--sticky{position:sticky;top:0}
.tcph-strip__in{position:relative;z-index:1;max-width:1400px;margin:0 auto;padding:9px 48px;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.tcph-strip--compact{font-size:13px}.tcph-strip--compact .tcph-strip__in{padding:5px 48px}
.tcph-strip__ico{width:24px;height:22px;flex:none;animation:tcph-bounce 2.4s ease-in-out infinite}
@keyframes tcph-bounce{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-3px) rotate(-6deg)}}
.tcph-strip__msgs{display:grid}
.tcph-strip__txt{grid-area:1/1;font-weight:600;letter-spacing:.01em;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s;text-align:center}
.tcph-strip__txt.is-on{opacity:1;transform:none}
.tcph-strip__cd{display:flex;align-items:center;gap:6px}
.tcph-strip__cdl{opacity:.7;font-size:13px;margin-right:2px}
.tcph-u{display:flex;align-items:baseline;gap:3px;background:var(--chip);border-radius:6px;padding:3px 7px}
.tcph-u b{font-weight:700;font-variant-numeric:tabular-nums;color:var(--a2);font-size:15px}
.tcph-u i{font-style:normal;font-size:11px;opacity:.7}
.tcph-strip__btn{font-weight:700;font-size:13px;color:var(--bg);background:var(--a);border-radius:999px;padding:6px 16px;text-decoration:none;transition:transform .2s,filter .2s}
.tcph-strip__btn:hover,.tcph-strip__btn:focus{filter:brightness(1.12);transform:scale(1.05);color:var(--bg);text-decoration:none}
.tcph-strip--done .tcph-strip__cd{display:none}
.tcph-strip__x{position:absolute;z-index:2;right:10px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:0;border-radius:50%;
  background:transparent;color:var(--txt);opacity:.6;font-size:22px;line-height:1;cursor:pointer}
.tcph-strip__x:hover{opacity:1;background:var(--chip)}
.tcph-strip.is-closed{display:none}

.tcph-drip{position:absolute;left:0;right:0;top:100%;width:100%;height:16px;pointer-events:none;fill:var(--drip)}
.tcph-drip path{animation:tcph-ooze 6s ease-in-out infinite;transform-origin:top}
@keyframes tcph-ooze{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.25)}}

.tcph-garland{position:absolute;left:0;right:0;top:100%;width:100%;height:26px;pointer-events:none}
.tcph-flag{transform-box:fill-box;transform-origin:top center;animation:tcph-sway 3s ease-in-out infinite}
.tcph-flag--0{fill:var(--a)}.tcph-flag--1{fill:#1b1b22}.tcph-flag--2{fill:#7e22ce;animation-delay:-1.5s}
@keyframes tcph-sway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}

.tcph-eyes{position:absolute;top:50%;width:30px;height:11px;margin-top:-5px;fill:#ffd23f;opacity:0;
  filter:drop-shadow(0 0 4px rgba(255,210,63,.8));animation:tcph-eyes 9s ease-in-out infinite}
.tcph-eyes .tcph-pupil{fill:#120607}
.tcph-eyes--a{left:2%}.tcph-eyes--b{right:5%;width:24px;animation-delay:-4.5s}
@keyframes tcph-eyes{0%,30%,100%{opacity:0;transform:scaleY(1)}38%,70%{opacity:1;transform:scaleY(1)}52%{transform:scaleY(1)}54%{transform:scaleY(.1)}56%{transform:scaleY(1)}}

/* ================= CAPA DECORATIVA ================= */
.tcph{position:fixed;inset:0;z-index:9990;pointer-events:none;overflow:hidden}
:where(.tcph) svg{display:block}

.tcph-web{position:absolute;top:0;width:120px;height:120px;fill:none;stroke:#7d8090;stroke-width:1;opacity:.45}
.tcph-web--l{left:0}.tcph-web--r{right:0;transform:scaleX(-1)}

.tcph-spider{position:absolute;top:0;right:30px;display:flex;flex-direction:column;align-items:center;animation:tcph-drop 9s ease-in-out infinite}
.tcph-thread{width:1px;height:190px;background:#9a9daa}
.tcph-spider svg{width:34px;height:34px;margin-top:-5px;animation:tcph-wiggle 1.8s ease-in-out infinite;transform-origin:50% 0}
@keyframes tcph-drop{0%,100%{transform:translateY(-130px)}45%,65%{transform:translateY(0)}}
@keyframes tcph-wiggle{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}

.tcph-crawl{position:absolute;bottom:4px;left:0;width:42px;height:28px;animation:tcph-crawl 28s linear infinite}
.tcph-legs{animation:tcph-legs .18s steps(2) infinite}
@keyframes tcph-crawl{0%{transform:translateX(calc(100vw + 60px))}45%,100%{transform:translateX(-80px)}}
@keyframes tcph-legs{to{transform:translateY(1px)}}

.tcph-ghost{position:absolute;top:38vh;left:0;width:64px;height:80px;opacity:0;filter:drop-shadow(0 6px 10px rgba(20,19,32,.25));animation:tcph-ghost 26s ease-in-out infinite}
@keyframes tcph-ghost{0%{opacity:0;visibility:hidden;transform:translate(78vw,0)}2%{visibility:visible}8%{opacity:.92}20%{transform:translate(70vw,-30px)}32%{transform:translate(62vw,10px)}40%{opacity:.92}45%{visibility:visible}46%,100%{opacity:0;visibility:hidden;transform:translate(56vw,-20px)}}

/* Bruja en escoba */
.tcph-witch{position:absolute;top:22vh;left:0;width:120px;animation:tcph-witch 34s linear infinite}
.tcph-witch svg{width:120px;height:65px;animation:tcph-bob 1.6s ease-in-out infinite}
.tcph-witch__cape{animation:tcph-cape .5s ease-in-out infinite alternate;transform-origin:70px 20px}
@keyframes tcph-witch{0%{transform:translate(-140px,40px)}30%{transform:translate(calc(100vw + 40px),-60px)}30.01%,100%{transform:translate(calc(100vw + 200px),-60px)}}
@keyframes tcph-bob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-8px) rotate(-1deg)}}
@keyframes tcph-cape{to{transform:rotate(-12deg)}}

/* Gato negro */
.tcph-cat{position:absolute;bottom:0;right:120px;width:70px;height:60px;animation:tcph-cat 30s ease-in-out infinite}
.tcph-cat svg{width:70px;height:60px}
.tcph-cat__tail{transform-origin:50px 52px;animation:tcph-tail 1.6s ease-in-out infinite}
.tcph-cat__eyes{transform-origin:26px 23px;animation:tcph-blink 4s infinite}
@keyframes tcph-cat{0%,8%{transform:translateY(70px)}14%,40%{transform:translateY(0)}46%,100%{transform:translateY(70px)}}
@keyframes tcph-tail{0%,100%{transform:rotate(0)}50%{transform:rotate(-14deg)}}
@keyframes tcph-blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}

/* Esqueleto que asoma y saluda */
.tcph-skel{position:absolute;top:55vh;right:0;width:84px;height:84px;animation:tcph-skel 22s ease-in-out infinite}
.tcph-skel svg{width:84px;height:84px;transform:rotate(-90deg)}
.tcph-skel__hand{transform-origin:44px 66px;animation:tcph-wave .5s ease-in-out infinite alternate}
@keyframes tcph-skel{0%,55%,100%{transform:translateX(110%)}62%,82%{transform:translateX(20%)}}
@keyframes tcph-wave{from{transform:rotate(-12deg)}to{transform:rotate(18deg)}}

/* Mano zombi */
.tcph-zombie{position:absolute;bottom:0;left:22%;width:46px;height:84px;animation:tcph-zombie 24s ease-in-out infinite}
@keyframes tcph-zombie{0%,50%,100%{transform:translateY(100%)}58%{transform:translateY(8%) rotate(-4deg)}64%{transform:translateY(12%) rotate(4deg)}72%{transform:translateY(8%) rotate(-3deg)}80%{transform:translateY(100%)}}

/* Lluvia de caramelos */
.tcph-candy{position:absolute;top:-40px;width:26px;height:26px;background:center/contain no-repeat;animation:tcph-candyfall 14s linear infinite}
.tcph-candy--1,.tcph-candy--4,.tcph-candy--7{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 4 L34 36 H6z' fill='%23fff3d6'/%3E%3Cpath d='M12 22 H28 L34 36 H6z' fill='%23ff7a1a'/%3E%3Cpath d='M9 29 H31 L34 36 H6z' fill='%23ffd23f'/%3E%3C/svg%3E")}
.tcph-candy--2,.tcph-candy--5,.tcph-candy--8{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M2 12 L12 20 L2 28z M38 12 L28 20 L38 28z' fill='%23a855f7'/%3E%3Ccircle cx='20' cy='20' r='9' fill='%23a855f7'/%3E%3Cpath d='M14 16 Q20 22 26 16' stroke='%23fff' stroke-width='2' fill='none'/%3E%3C/svg%3E")}
.tcph-candy--3,.tcph-candy--6{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 22 V38' stroke='%23eee' stroke-width='3'/%3E%3Ccircle cx='20' cy='14' r='11' fill='%23e01b24'/%3E%3Cpath d='M20 14 m-7 0 a7 7 0 0 1 14 0' stroke='%23fff' stroke-width='2.5' fill='none'/%3E%3C/svg%3E")}
.tcph-candy--1{left:8%;animation-delay:-1s}.tcph-candy--2{left:21%;animation-delay:-8s;animation-duration:17s}
.tcph-candy--3{left:34%;animation-delay:-4s;animation-duration:15s}.tcph-candy--4{left:47%;animation-delay:-11s}
.tcph-candy--5{left:60%;animation-delay:-2s;animation-duration:18s}.tcph-candy--6{left:72%;animation-delay:-9s}
.tcph-candy--7{left:84%;animation-delay:-5s;animation-duration:16s}.tcph-candy--8{left:94%;animation-delay:-13s}
@keyframes tcph-candyfall{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(30px,55vh) rotate(200deg)}100%{transform:translate(-10px,calc(100vh + 60px)) rotate(400deg)}}

/* Niebla */
.tcph-fog{position:absolute;left:0;right:0;bottom:0;height:130px;overflow:hidden}
.tcph-fog span{position:absolute;bottom:-40px;left:-50%;width:200%;height:160px;opacity:.55;
  background:radial-gradient(40% 55% at 15% 70%,rgba(120,115,140,.45),transparent 70%),radial-gradient(35% 50% at 45% 80%,rgba(120,115,140,.4),transparent 70%),radial-gradient(40% 55% at 75% 70%,rgba(120,115,140,.45),transparent 70%);
  animation:tcph-fog 40s linear infinite}
.tcph-fog .tcph-fog__b{opacity:.4;bottom:-60px;animation-duration:60s;animation-direction:reverse}
@keyframes tcph-fog{from{transform:translateX(0)}to{transform:translateX(25%)}}

/* Calabaza + bocadillo */
.tcph-pumpkin{position:absolute;left:18px;bottom:-8px;width:84px;animation:tcph-peek 10s ease-in-out infinite}
.tcph-pumpkin svg{width:84px;height:76px}
.tcph-pumpkin.is-clickable{pointer-events:auto;cursor:pointer}
.tcph-pumpkin.is-clickable:hover svg{transform:scale(1.08) rotate(-4deg);transition:transform .2s}
.tcph-glow{animation:tcph-flicker 2.2s ease-in-out infinite;filter:drop-shadow(0 0 3px #ffb347)}
@keyframes tcph-peek{0%,100%{transform:translateY(20px)}30%,80%{transform:translateY(0)}}
@keyframes tcph-flicker{0%,100%{opacity:1}40%{opacity:.75}55%{opacity:.95}70%{opacity:.6}}
.tcph-bubble{position:absolute;left:62px;bottom:74px;width:max-content;max-width:220px;background:#fff;color:#141320;font-size:13px;font-weight:700;line-height:1.3;
  padding:8px 12px;border-radius:14px;border:2px solid #141320;box-shadow:3px 3px 0 #141320;opacity:0;transform:translateY(6px) scale(.9);transform-origin:bottom left;
  animation:tcph-bubble 10s ease-in-out infinite}
.tcph-bubble::after{content:"";position:absolute;left:10px;bottom:-9px;border:8px solid transparent;border-top-color:#141320;border-bottom:0}
.tcph-pumpkin:hover .tcph-bubble{opacity:1;transform:none;animation:none}
@keyframes tcph-bubble{0%,35%,85%,100%{opacity:0;transform:translateY(6px) scale(.9)}40%,78%{opacity:1;transform:none}}

/* Fantasma que sigue al ratón */
.tcph-cghost{position:absolute;left:0;top:0;width:34px;height:42px;opacity:0;transition:opacity .3s;filter:drop-shadow(0 4px 6px rgba(0,0,0,.2))}
.tcph-cghost.is-on{opacity:.9}

/* Explosión de caramelos y susto (JS) */
.tcph-pop{position:fixed;z-index:9995;pointer-events:none;left:0;top:0;width:22px;height:22px;background:center/contain no-repeat;animation:tcph-pop 1.1s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes tcph-pop{0%{transform:translate(var(--x0),var(--y0)) scale(.4);opacity:1}100%{transform:translate(calc(var(--x0) + var(--dx)),calc(var(--y0) + var(--dy))) rotate(var(--r)) scale(1);opacity:0}}
.tcph-boo{position:fixed;z-index:9996;pointer-events:none;left:0;top:0;font:900 24px/1 system-ui,sans-serif;color:#fff;-webkit-text-stroke:1.5px #141320;text-shadow:2px 2px 0 #141320;display:flex;align-items:center;gap:6px;
  animation:tcph-boo 1.3s ease-out forwards}
.tcph-boo svg{width:40px;height:50px}
@keyframes tcph-boo{0%{transform:translate(var(--x0),var(--y0)) scale(.3);opacity:0}25%{transform:translate(var(--x0),calc(var(--y0) - 30px)) scale(1.1);opacity:1}100%{transform:translate(var(--x0),calc(var(--y0) - 90px)) scale(1);opacity:0}}

html.tcph-cursor,html.tcph-cursor body{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 100 90'%3E%3Cpath d='M50 18c-2-8 1-14 8-16l2 4c-5 2-6 6-5 12z' fill='%235f7f45'/%3E%3Cellipse cx='30' cy='54' rx='22' ry='30' fill='%23d9590b'/%3E%3Cellipse cx='70' cy='54' rx='22' ry='30' fill='%23d9590b'/%3E%3Cellipse cx='50' cy='54' rx='22' ry='32' fill='%23ff7a1a'/%3E%3C/svg%3E") 4 4,auto}

/* ================= CEMENTERIO (antes del footer) ================= */
.tcph-grave{position:relative;overflow:hidden;height:190px;background:linear-gradient(#0f0e1a,#1e1b33 70%);color:#fff}
.tcph-grave__moon{position:absolute;top:22px;right:12%;width:52px;height:52px;filter:drop-shadow(0 0 18px rgba(245,231,184,.6))}
.tcph-grave__ghost{position:absolute;top:40px;left:-60px;width:40px;height:50px;opacity:.85;animation:tcph-gghost 18s ease-in-out infinite}
@keyframes tcph-gghost{0%{transform:translate(0,0)}50%{transform:translate(55vw,-12px)}100%{transform:translate(calc(100vw + 80px),6px)}}
.tcph-grave__row{position:absolute;left:0;right:0;bottom:28px;display:flex;justify-content:center;align-items:flex-end;gap:clamp(12px,3vw,46px);padding:0 16px}
.tcph-tomb{position:relative;width:118px;height:120px;padding:18px 10px 0;border-radius:60px 60px 6px 6px;background:#57546b;box-shadow:inset -8px 0 0 rgba(0,0,0,.18);
  text-align:center;transform-origin:bottom center;transition:transform .25s}
.tcph-tomb:hover{transform:rotate(-3deg)}
.tcph-tomb--1{height:104px;background:#4c495f}.tcph-tomb--2{height:132px;transform:rotate(2deg)}
.tcph-tomb__rip{display:block;font:900 15px/1 Georgia,serif;letter-spacing:.12em;color:#cfcbe0;margin-bottom:6px}
.tcph-tomb__txt{display:block;font-size:11.5px;line-height:1.25;color:#ece9f6}
.tcph-grave__ground{position:absolute;left:0;right:0;bottom:0;height:34px;background:#141320;border-radius:50% 50% 0 0/18px 18px 0 0}


/* ================= MASCOTA MuPerita ================= */
.tcph-cghost--pear{width:52px;height:64px}
.tcph-grave__ghost--pear{width:52px;height:64px;top:28px;opacity:1}

/* ================= SUSTO (screamer) ================= */
.tcph-scare{position:fixed;inset:0;z-index:2147483000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  background:radial-gradient(circle at 50% 45%,rgba(40,10,20,.92),rgba(5,4,10,.97));pointer-events:none;animation:tcph-scare-bg 1.5s ease forwards}
.tcph-scare svg{width:min(48vw,360px);height:min(56vh,440px);animation:tcph-scare-fig 1.5s cubic-bezier(.2,1.4,.3,1) forwards}
.tcph-scare b{font:900 clamp(40px,9vw,110px)/1 system-ui,sans-serif;color:#fff;letter-spacing:.04em;-webkit-text-stroke:3px #141320;text-shadow:5px 5px 0 #d0101c;
  animation:tcph-scare-txt 1.5s ease forwards}
@keyframes tcph-scare-bg{0%{opacity:0}8%,80%{opacity:1}100%{opacity:0}}
@keyframes tcph-scare-fig{0%{transform:scale(.15) rotate(-20deg)}22%{transform:scale(1.1) rotate(4deg)}28%{transform:scale(1) translate(-6px,0) rotate(-3deg)}
  32%{transform:scale(1) translate(6px,0) rotate(3deg)}36%{transform:scale(1) translate(-4px,0)}40%,100%{transform:scale(1)}}
@keyframes tcph-scare-txt{0%,15%{opacity:0;transform:scale(2)}25%,100%{opacity:1;transform:scale(1)}}

/* ================= CAZA DE CALABAZAS ================= */
.tcph-hunt{position:absolute;z-index:9980;width:34px;height:31px;border:0;padding:0;background:none;cursor:pointer;animation:tcph-hunt 2.6s ease-in-out infinite}
.tcph-hunt svg{width:100%;height:100%;display:block;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.tcph-hunt:hover{animation-play-state:paused;transform:scale(1.2)}
.tcph-hunt.is-found{animation:tcph-found .5s ease-in forwards;pointer-events:none}
@keyframes tcph-hunt{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-6px) rotate(6deg)}}
@keyframes tcph-found{to{transform:scale(2) rotate(30deg);opacity:0}}
.tcph-toast{position:fixed;z-index:2147482000;left:50%;bottom:24px;display:flex;align-items:center;gap:10px;background:#141320;color:#fff;font-size:14px;font-weight:600;
  padding:10px 16px 10px 10px;border-radius:999px;border:2px solid #ff7a1a;box-shadow:0 8px 24px rgba(0,0,0,.3);transform:translate(-50%,140%);transition:transform .35s cubic-bezier(.2,1.3,.3,1)}
.tcph-toast.is-on{transform:translate(-50%,0)}
.tcph-toast svg{width:34px;height:42px;flex:none}
.tcph-modal{position:fixed;inset:0;z-index:2147482500;display:flex;align-items:center;justify-content:center;background:rgba(10,8,20,.7);padding:16px}
.tcph-modal__box{position:relative;max-width:380px;width:100%;background:#fff;color:#141320;border-radius:20px;padding:28px 24px 24px;text-align:center;border:3px solid #141320;box-shadow:6px 6px 0 #ff7a1a;
  animation:tcph-pop-in .4s cubic-bezier(.2,1.4,.3,1)}
@keyframes tcph-pop-in{from{transform:scale(.7);opacity:0}}
.tcph-modal__box svg{width:96px;height:119px;margin:-80px auto 6px;display:block}
.tcph-modal__box h3{margin:0 0 6px;font-size:22px;font-weight:800}
.tcph-modal__box p{margin:0 0 14px;font-size:15px;line-height:1.4}
.tcph-modal__code{display:inline-flex;align-items:center;gap:8px;font:800 20px/1 ui-monospace,monospace;letter-spacing:.08em;background:#fff3e6;border:2px dashed #ff7a1a;border-radius:10px;padding:10px 14px}
.tcph-modal__code button,.tcph-modal__close{font:700 13px/1 system-ui,sans-serif;border:0;border-radius:999px;cursor:pointer}
.tcph-modal__code button{background:#141320;color:#fff;padding:7px 12px}
.tcph-modal__close{position:absolute;top:10px;right:10px;width:30px;height:30px;background:#f0eff5;color:#141320;font-size:18px}

/* ================= FICHA DE PRODUCTO ================= */
.tcph-player{position:absolute;z-index:50;pointer-events:none;top:0;left:0;width:0;height:0}
.tcph-sticker{position:absolute;z-index:5;top:12px;right:12px;width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;
  background:#ff7a1a;color:#141320;font:900 14px/1.05 system-ui,sans-serif;text-transform:uppercase;padding:10px;border:3px dashed #141320;box-shadow:0 0 0 4px #ff7a1a;
  transform:rotate(12deg);animation:tcph-wobble 3s ease-in-out infinite;pointer-events:none}
@keyframes tcph-wobble{0%,100%{transform:rotate(12deg)}50%{transform:rotate(4deg) scale(1.04)}}
.tcph-pweb{position:absolute;z-index:4;top:0;left:0;width:110px;height:110px;fill:none;stroke:#7d8090;stroke-width:1;opacity:.5;pointer-events:none}
.tcph-ppeekbox{position:absolute;z-index:4;right:14px;bottom:0;width:70px;height:88px;overflow:hidden;pointer-events:none}
.tcph-ppeek{position:absolute;left:4px;bottom:0;width:62px;height:77px;transform-origin:bottom center;animation:tcph-ppeek 12s ease-in-out infinite}
@keyframes tcph-ppeek{0%,50%,100%{transform:translateY(105%) rotate(0)}58%,86%{transform:translateY(12%) rotate(-6deg)}66%{transform:translateY(12%) rotate(5deg)}74%{transform:translateY(12%) rotate(-5deg)}}
.tcph-prod{display:flex;flex-direction:column;gap:10px;margin:14px 0}
.tcph-tot__btn{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:#141320;color:#fff;border:0;border-radius:14px;padding:10px 14px;cursor:pointer;transition:transform .15s}
.tcph-tot__btn:hover{transform:translateY(-2px)}
.tcph-tot__btn svg{width:44px;height:40px;flex:none;animation:tcph-bounce 2.4s ease-in-out infinite}
.tcph-tot__btn strong{display:block;font-size:16px}.tcph-tot__btn small{display:block;font-size:12.5px;opacity:.75}
.tcph-tot.is-open .tcph-tot__btn svg{animation:tcph-shake .5s ease}
@keyframes tcph-shake{25%{transform:rotate(-15deg)}50%{transform:rotate(12deg)}75%{transform:rotate(-8deg)}}
.tcph-tot__res:empty{display:none}
.tcph-tot__res{margin-top:8px;padding:12px 14px;border-radius:12px;font-size:14px;line-height:1.4;animation:tcph-pop-in .35s cubic-bezier(.2,1.4,.3,1)}
.tcph-tot__res.is-trick{background:#f3eefc;border:2px solid #a855f7;color:#2a1650}
.tcph-tot__res.is-treat{background:#fff3e6;border:2px solid #ff7a1a;color:#4a1f00}
.tcph-tot__res button{margin-left:6px;font:700 12px/1 system-ui,sans-serif;border:0;border-radius:999px;background:#141320;color:#fff;padding:6px 10px;cursor:pointer}
.tcph-tot__res code{font:800 15px ui-monospace,monospace;background:#fff;border:1.5px dashed #ff7a1a;border-radius:6px;padding:2px 6px}
.tcph-prod__guar{display:flex;align-items:center;gap:10px;font-size:13.5px;line-height:1.35;color:#2b2a3a;background:#f4f3f8;border-radius:12px;padding:10px 12px}
.tcph-prod__guar svg{width:28px;height:35px;flex:none;animation:tcph-bob 2.4s ease-in-out infinite}
.tcph-prod__soldout{display:flex;align-items:center;gap:12px;background:#1e1b33;color:#ece9f6;border-radius:12px;padding:12px 14px;font-size:13.5px}
.tcph-prod__soldout p{margin:0}
.tcph-tomb--mini{width:44px;height:52px;padding:10px 4px 0;flex:none;border-radius:22px 22px 4px 4px}
.tcph-tomb--mini .tcph-tomb__rip{font-size:11px}

/* ================= 404 Y CARRITO VACÍO ================= */
.tcph-page{text-align:center;padding:40px 16px 48px;margin:0 auto 24px;max-width:760px;background:linear-gradient(#0f0e1a,#1e1b33);color:#fff;border-radius:24px;overflow:hidden}
.tcph-page__scene{display:flex;align-items:flex-end;justify-content:center;gap:18px;margin-bottom:18px}
.tcph-page__pear{width:110px;height:136px;animation:tcph-bob 2.6s ease-in-out infinite}
.tcph-tomb--big{width:190px;height:200px;padding-top:26px}
.tcph-tomb--big .tcph-tomb__rip{font-size:22px}
.tcph-tomb__big{display:block;font:900 54px/1 Georgia,serif;color:#fff;margin:4px 0 8px}
.tcph-tomb--big .tcph-tomb__txt{font-size:13px;padding:0 10px}
.tcph-page__title{margin:0 0 8px;font-size:26px;font-weight:800;color:#fff}
.tcph-page__sub{margin:0 auto 18px;max-width:46ch;color:#c9c5dd;font-size:15px}
.tcph-page__btn{display:inline-block;background:#ff7a1a;color:#141320;font-weight:800;border-radius:999px;padding:11px 22px;text-decoration:none}
.tcph-page__btn:hover{filter:brightness(1.1);color:#141320;text-decoration:none}


/* ================= PERSONAJES QUE REACCIONAN ================= */
html.tcph-clicky .tcph-ghost,html.tcph-clicky .tcph-cat,html.tcph-clicky .tcph-skel,html.tcph-clicky .tcph-witch,
html.tcph-clicky .tcph-zombie,html.tcph-clicky .tcph-crawl,html.tcph-clicky .tcph-frank,html.tcph-clicky .tcph-broom,html.tcph-clicky .tcph-roll,
html.tcph-clicky .tcph-mummy,html.tcph-clicky .tcph-vamp{pointer-events:auto;cursor:pointer}
.tcph-ghost.is-hit{animation-play-state:paused;scale:1.8;filter:opacity(0);transition:scale .45s ease-out,filter .45s ease-out}
.tcph-skel.is-hit svg{animation:tcph-rattle .7s steps(2) 2}
@keyframes tcph-rattle{0%{rotate:-8deg;scale:1.05}50%{rotate:8deg;scale:.95}100%{rotate:0deg;scale:1}}
.tcph-cat.is-hit svg{translate:240px 0;transition:translate .6s cubic-bezier(.5,0,.8,.4)}
.tcph-witch.is-hit svg{animation:tcph-spin .8s ease-in-out}
@keyframes tcph-spin{to{rotate:360deg}}
.tcph-zombie.is-hit{scale:1.15;transition:scale .2s}
.tcph-crawl.is-hit{translate:0 -60px;transition:translate .25s ease-out}
.tcph-say{position:fixed;z-index:9996;left:0;top:0;max-width:220px;background:#fff;color:#141320;font:700 13px/1.3 system-ui,sans-serif;padding:8px 12px;border-radius:14px;
  border:2px solid #141320;box-shadow:3px 3px 0 #141320;pointer-events:none;animation:tcph-say 2.4s ease forwards}
@keyframes tcph-say{0%{opacity:0;transform:translate(var(--x0),calc(var(--y0) + 8px)) scale(.8)}12%,80%{opacity:1;transform:translate(var(--x0),var(--y0)) scale(1)}100%{opacity:0;transform:translate(var(--x0),calc(var(--y0) - 10px))}}

/* MuPerita habla */
.tcph-msay{position:fixed;z-index:9991;left:0;top:0;max-width:230px;background:#fff;color:#141320;font:700 13px/1.3 system-ui,sans-serif;padding:8px 12px;border-radius:14px 14px 14px 4px;
  border:2px solid #141320;box-shadow:3px 3px 0 #ff7a1a;pointer-events:none;opacity:0;transition:opacity .25s}
.tcph-msay.is-on{opacity:1}

/* Barra de progreso */
.tcph-scroll{position:fixed;z-index:9992;top:0;left:0;height:4px;width:0;background:#ff7a1a;pointer-events:none;box-shadow:0 0 6px rgba(255,122,26,.6)}
.tcph-scroll svg{position:absolute;right:-12px;top:-8px;width:22px;height:27px}

/* Apagón con linterna */
.tcph-dark{position:fixed;inset:0;z-index:2147481000;pointer-events:none;--mx:50vw;--my:50vh;
  background:radial-gradient(circle 130px at var(--mx) var(--my),transparent 0,transparent 95px,rgba(5,4,12,.96) 140px);animation:tcph-dark 7s ease forwards}
.tcph-dark span{position:absolute;left:50%;top:18%;transform:translateX(-50%);color:#fff;font:800 22px/1.3 system-ui,sans-serif;text-align:center;text-shadow:0 2px 8px #000;white-space:nowrap}
@keyframes tcph-dark{0%{opacity:0}6%{opacity:1}10%{opacity:.4}14%,88%{opacity:1}100%{opacity:0}}

/* Capa de la caza de calabazas */
.tcph-huntlayer{position:absolute;left:0;top:0;width:100%;overflow:hidden;pointer-events:none;z-index:9980}
.tcph-huntlayer .tcph-hunt{pointer-events:auto}

/* Cementerio: ojos y lápidas interactivas */
.tcph-geyes{position:absolute;width:26px;height:9px;fill:#ffd23f;filter:drop-shadow(0 0 4px rgba(255,210,63,.8));animation:tcph-eyes 7s ease-in-out infinite}
.tcph-geyes--1{left:9%;bottom:70px}.tcph-geyes--2{right:22%;bottom:96px;width:20px;animation-delay:-2.5s;fill:#c6f432}.tcph-geyes--3{left:38%;bottom:150px;width:18px;animation-delay:-5s;fill:#ff6a3d}
.tcph-tomb.is-interactive{cursor:pointer}
.tcph-tombhand{position:absolute;left:50%;bottom:92%;width:44px;height:80px;margin-left:-22px;pointer-events:none;animation:tcph-tombhand 1.8s ease forwards}
@keyframes tcph-tombhand{0%{transform:translateY(60%) rotate(0);opacity:0}20%{opacity:1;transform:translateY(0) rotate(-10deg)}35%{transform:translateY(0) rotate(10deg)}50%{transform:translateY(0) rotate(-10deg)}65%{transform:translateY(0) rotate(8deg)}85%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(60%)}}

/* Rasca y gana */
.tcph-scratch__title{margin:0 0 6px;font-size:13.5px;color:#2b2a3a}
.tcph-scratch__card{position:relative;height:78px;border-radius:12px;overflow:hidden;border:2px dashed #ff7a1a;background:#fff3e6;user-select:none}
.tcph-scratch__prize{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;font-weight:700;color:#4a1f00;text-align:center;padding:0 10px}
.tcph-scratch__prize code{font:800 17px ui-monospace,monospace;background:#fff;border:1.5px dashed #ff7a1a;border-radius:6px;padding:3px 8px}
.tcph-scratch__cover{position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:none;transition:opacity .5s}
.tcph-scratch.is-done .tcph-scratch__cover{opacity:0;pointer-events:none}

/* Confirmación de pedido */
.tcph-order{display:flex;align-items:center;gap:16px;background:linear-gradient(90deg,#141320,#2a1c42);color:#fff;border-radius:18px;padding:14px 22px;margin:16px 0}
.tcph-order__pear{width:70px;height:87px;flex:none;animation:tcph-bob 2.4s ease-in-out infinite}
.tcph-order__txt{margin:0;font-size:17px;font-weight:700;line-height:1.35}


/* ================= BOTÓN DE LA FICHA (altura fija) ================= */
.tcph-inline{display:flex;align-items:center;gap:12px;width:100%;height:60px;margin:12px 0;overflow:hidden;text-align:left;background:#141320;color:#fff;border:0;border-radius:14px;padding:0 14px;cursor:pointer}
.tcph-inline svg{width:40px;height:36px;flex:none;animation:tcph-bounce 2.4s ease-in-out infinite}
.tcph-inline strong{display:block;font-size:15px;line-height:1.2}.tcph-inline small{display:block;font-size:12px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ================= RINCÓN EMBRUJADO (panel flotante) ================= */
.tcph-launch{position:fixed;z-index:9993;top:42%;display:flex;align-items:center;gap:8px;border:0;cursor:pointer;background:#141320;color:#fff;font:700 13px/1 system-ui,sans-serif;
  padding:12px 10px;box-shadow:0 6px 18px rgba(20,19,32,.3);writing-mode:vertical-rl;transition:padding .2s}
.tcph-launch svg{width:28px;height:25px;writing-mode:horizontal-tb;animation:tcph-bounce 2.4s ease-in-out infinite}
.tcph-launch--right{right:0;border-radius:12px 0 0 12px;border-left:3px solid #ff7a1a}
.tcph-launch--left{left:0;border-radius:0 12px 12px 0;border-right:3px solid #ff7a1a;transform:rotate(180deg)}
.tcph-launch--left svg{transform:rotate(180deg)}
.tcph-launch:hover{padding-left:14px;padding-right:14px}
.tcph-panel{position:fixed;z-index:2147480000;top:0;bottom:0;width:min(360px,92vw);display:flex;flex-direction:column;background:#fff;color:#141320;box-shadow:0 0 40px rgba(20,19,32,.35);
  transition:transform .35s cubic-bezier(.2,.9,.3,1),visibility .35s;visibility:hidden}
.tcph-panel--right{right:0;transform:translateX(105%)}
.tcph-panel--left{left:0;transform:translateX(-105%)}
.tcph-panel.is-open{transform:none;visibility:visible}
.tcph-panel__head{display:flex;align-items:center;gap:12px;padding:16px 18px;background:linear-gradient(110deg,#141320,#2a1c42);color:#fff}
.tcph-panel__head svg{width:46px;height:57px;flex:none}
.tcph-panel__head div{flex:1}.tcph-panel__head strong{display:block;font-size:18px}.tcph-panel__head small{display:block;font-size:12.5px;color:#c9c5dd}
.tcph-panel__x{width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:22px;line-height:1;cursor:pointer}
.tcph-panel__body{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:12px;overscroll-behavior:contain}
.tcph-card{border:1.5px solid #ecebf3;border-radius:14px;padding:14px;background:#fff}
.tcph-card h4{margin:0 0 10px;font-size:15px;font-weight:800;color:#141320}
.tcph-card p{margin:0;font-size:13.5px;line-height:1.45}
.tcph-card--dark{display:flex;align-items:center;gap:12px;background:#1e1b33;border-color:#1e1b33;color:#ece9f6}
.tcph-card--soft{display:flex;align-items:center;gap:10px;background:#f4f3f8;border-color:#f4f3f8}
.tcph-card--soft svg{width:28px;height:35px;flex:none}
.tcph-panel .tcph-tot__res{margin-top:10px}
.tcph-panel .tcph-scratch__card{height:84px}
.tcph-backdrop{position:fixed;inset:0;z-index:2147479000;background:rgba(10,8,20,.35);opacity:0;transition:opacity .3s;pointer-events:none}
.tcph-backdrop.is-on{opacity:1;pointer-events:auto}

/* Ruleta */
.tcph-wheel__box{position:relative;width:230px;height:230px;margin:0 auto 12px}
.tcph-wheel__disc{width:100%;height:100%;border-radius:50%;border:5px solid #141320;box-shadow:0 0 0 3px #ff7a1a;transition:transform 4.2s cubic-bezier(.12,.75,.12,1)}
.tcph-wheel__disc svg{display:block;width:100%;height:100%}
.tcph-wheel__pin{position:absolute;z-index:2;left:50%;top:-10px;margin-left:-12px;width:0;height:0;border:12px solid transparent;border-top:22px solid #141320;filter:drop-shadow(0 2px 2px rgba(0,0,0,.3))}
.tcph-wheel__btn{display:block;width:100%;border:0;border-radius:999px;background:#ff7a1a;color:#141320;font-weight:800;font-size:15px;padding:11px;cursor:pointer}
.tcph-wheel__btn:disabled{background:#d6d4df;color:#6b6880;cursor:default}
.tcph-wheel__res:empty{display:none}
.tcph-wheel__res{margin-top:10px;padding:10px 12px;border-radius:12px;background:#fff3e6;border:2px solid #ff7a1a;font-size:14px;line-height:1.4;text-align:center}
.tcph-wheel__res code{font:800 15px ui-monospace,monospace;background:#fff;border:1.5px dashed #ff7a1a;border-radius:6px;padding:2px 6px}

/* Progreso de la caza */
.tcph-huntcard__bar{height:10px;border-radius:999px;background:#f0eff5;overflow:hidden;margin:10px 0 6px}
.tcph-huntcard__bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,#ff7a1a,#ffb067);transition:width .5s}
.tcph-huntcard__txt{font-size:12.5px;color:#6b6880}

/* Cuervo en la franja */
.tcph-crow{position:absolute;z-index:2;left:13%;bottom:-3px;width:44px;height:32px;cursor:pointer;transform-origin:bottom center;animation:tcph-crow-idle 6s ease-in-out infinite}
.tcph-crow__eye{animation:tcph-blink 4.5s infinite;transform-box:fill-box;transform-origin:center}
.tcph-crow__wing{transform-box:fill-box;transform-origin:left center}
@keyframes tcph-crow-idle{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(-8deg)}80%{transform:rotate(4deg)}}
.tcph-crow.is-flying{animation:tcph-crow-fly 1.6s ease-in forwards;pointer-events:none}
.tcph-crow.is-flying .tcph-crow__wing{animation:tcph-flap .12s ease-in-out infinite alternate}
@keyframes tcph-crow-fly{0%{transform:translate(0,0)}100%{transform:translate(60vw,-120px) scale(.6);opacity:0}}
@keyframes tcph-flap{from{transform:scaleY(1)}to{transform:scaleY(-.6)}}

/* Velas del cementerio */
.tcph-candle{position:absolute;bottom:30px;width:9px;height:22px;background:#efe6cf;border-radius:2px;z-index:1}
.tcph-candle i{position:absolute;left:50%;top:-13px;width:8px;height:13px;margin-left:-4px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 50% 70%,#fff6c2,#ffb23e 60%,#ff6a1a);
  box-shadow:0 0 14px 6px rgba(255,170,60,.35);animation:tcph-flame 1.2s ease-in-out infinite alternate;transform-origin:bottom center}
.tcph-candle--1{left:15%}.tcph-candle--2{left:31%;height:16px;bottom:31px}.tcph-candle--3{right:30%;height:26px}.tcph-candle--4{right:13%;height:18px}
.tcph-candle--2 i{animation-delay:-.4s}.tcph-candle--3 i{animation-delay:-.8s}
@keyframes tcph-flame{from{transform:scale(1,1) rotate(-3deg)}to{transform:scale(.85,1.15) rotate(3deg)}}

/* Gorro de bruja sobre el logo (capa propia) */
.tcph-hatlayer{position:fixed;z-index:1002;pointer-events:none;width:0;height:0}
.tcph-hat{position:absolute;left:-14px;top:-30px;width:58px;height:50px;transform:rotate(-18deg);animation:tcph-hat 4s ease-in-out infinite;transform-origin:bottom center}
@keyframes tcph-hat{0%,100%{transform:rotate(-18deg)}50%{transform:rotate(-12deg) translateY(-2px)}}

/* Estela de chispas */
.tcph-spark{position:fixed;z-index:9989;left:0;top:0;width:8px;height:8px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#fff 0,#ffd23f 40%,rgba(255,122,26,0) 70%);animation:tcph-spark .8s ease-out forwards}
@keyframes tcph-spark{to{opacity:0;transform:translate(var(--sx),calc(var(--sy) + 18px)) scale(.2)}}

/* Panel de diagnóstico */
.tcph-debug{position:fixed;z-index:2147483600;left:12px;bottom:12px;max-width:360px;max-height:60vh;overflow:auto;background:#141320;color:#ece9f6;font:12px/1.5 ui-monospace,monospace;border:2px solid #ff7a1a;border-radius:12px;padding:12px 14px;box-shadow:0 8px 30px rgba(0,0,0,.4)}
.tcph-debug b{display:block;color:#ffb067;margin-bottom:6px;font-size:13px}
.tcph-debug ul{margin:0;padding:0;list-style:none}.tcph-debug li{display:flex;gap:6px}.tcph-debug .ok{color:#3ddc84}.tcph-debug .ko{color:#ff6a6a}
.tcph-debug button{margin-top:8px;border:0;border-radius:6px;background:#ff7a1a;color:#141320;font-weight:700;padding:4px 10px;cursor:pointer}


/* ================= PERSONAJES NUEVOS ================= */
/* Búho en la franja */
.tcph-owl{position:absolute;z-index:2;right:14%;bottom:-3px;width:34px;height:38px;cursor:pointer}
.tcph-owl__head{transform-box:fill-box;transform-origin:center;animation:tcph-owlhead 7s ease-in-out infinite}
.tcph-owl__eyes{transform-box:fill-box;transform-origin:center;animation:tcph-blink 5s infinite}
@keyframes tcph-owlhead{0%,40%,100%{transform:rotate(0)}48%,60%{transform:rotate(-25deg)}68%,80%{transform:rotate(22deg)}}
.tcph-owl.is-hoot .tcph-owl__head{animation:tcph-hoot .4s ease-in-out 3}
@keyframes tcph-hoot{50%{transform:scale(1.15) translateY(-2px)}}

/* Momia */
.tcph-mummy{position:absolute;bottom:0;left:0;width:56px;height:84px;animation:tcph-mummy 46s linear infinite}
.tcph-mummy svg{width:56px;height:84px;overflow:visible;animation:tcph-bob 1.4s ease-in-out infinite}
.tcph-mummy__legs rect:nth-child(1){animation:tcph-step .7s ease-in-out infinite alternate}
.tcph-mummy__legs rect:nth-child(2){animation:tcph-step .7s ease-in-out infinite alternate-reverse}
.tcph-mummy__trail{animation:tcph-trail 1.4s ease-in-out infinite alternate}
@keyframes tcph-mummy{0%{transform:translateX(-120px)}45%,100%{transform:translateX(calc(100vw + 80px))}}
@keyframes tcph-step{from{transform:translateY(-3px)}to{transform:translateY(2px)}}
@keyframes tcph-trail{to{transform:translateY(-4px) skewX(-8deg)}}
.tcph-mummy.is-hit svg{animation:tcph-rattle .5s steps(2) 3}

/* Vampiro en su ataúd */
.tcph-vamp{position:absolute;left:118px;bottom:0;width:70px;height:80px;animation:tcph-vamp 28s ease-in-out infinite}
.tcph-vamp svg{width:70px;height:80px;overflow:visible}
.tcph-vamp__body{animation:tcph-vampbody 28s ease-in-out infinite}
@keyframes tcph-vamp{0%,55%,100%{transform:translateY(100%)}60%,92%{transform:translateY(0)}}
@keyframes tcph-vampbody{0%,62%,90%,100%{transform:translateY(34px)}70%,84%{transform:translateY(0)}}
.tcph-vamp.is-hit .tcph-vamp__body{animation:none;transform:translateY(34px);transition:transform .3s ease-in}

/* Desfile de fantasmitas */
.tcph-parade{position:absolute;top:30vh;left:0;display:flex;gap:10px;opacity:.9;animation:tcph-parade 38s linear infinite}
.tcph-parade svg{width:30px;height:38px;animation:tcph-bob 1.2s ease-in-out infinite}
.tcph-parade svg:nth-child(2){width:24px;height:30px;margin-top:10px;animation-delay:-.4s}
.tcph-parade svg:nth-child(3){width:20px;height:25px;margin-top:16px;animation-delay:-.8s}
@keyframes tcph-parade{0%{transform:translateX(calc(100vw + 20px));visibility:visible}40%{transform:translateX(-160px);visibility:visible}40.1%,100%{transform:translateX(-160px);visibility:hidden}}
html.tcph-clicky .tcph-parade svg{pointer-events:auto;cursor:pointer}
.tcph-parade.is-hit svg{animation:tcph-spin .6s ease-in-out}

/* ================= HOME: LA CASA ENCANTADA ================= */
.tcph-house{position:relative;overflow:hidden;display:flex;align-items:center;min-height:290px;margin:28px auto;max-width:1400px;border-radius:24px;
  background:radial-gradient(120% 140% at 75% 10%,#3b2a5c 0%,#1e1b33 45%,#0f0e1a 100%);color:#fff}
.tcph-house__sky{position:absolute;inset:0;pointer-events:none}
.tcph-house__moon{position:absolute;top:22px;right:8%;width:70px;height:70px;filter:drop-shadow(0 0 26px rgba(245,231,184,.6))}
.tcph-house__star{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff;animation:tcph-twinkle 3s ease-in-out infinite}
.tcph-house__star:nth-child(odd){animation-delay:-1.5s}
@keyframes tcph-twinkle{50%{opacity:.25}}
.tcph-house__scene{position:absolute;right:0;bottom:0;width:62%;height:100%;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%);mask-image:linear-gradient(90deg,transparent 0,#000 14%)}
.tcph-house__win{fill:#ffcf5a;filter:drop-shadow(0 0 8px rgba(255,190,70,.8));animation:tcph-winflicker 4s ease-in-out infinite;cursor:pointer}
.tcph-house__win--2{animation-delay:-1s}.tcph-house__win--3{animation-delay:-2.3s;fill:#c6f432}.tcph-house__win--4{animation-delay:-3s;fill:#ff8a3d}
@keyframes tcph-winflicker{0%,100%{opacity:1}45%{opacity:.75}50%{opacity:.25}55%{opacity:.9}}
.tcph-house__ghost{animation:tcph-winghost 9s ease-in-out infinite}
@keyframes tcph-winghost{0%,60%,100%{transform:translateY(40px);opacity:0}68%,85%{transform:translateY(0);opacity:1}}
.tcph-house__home{cursor:pointer}
.tcph-house__pear{position:absolute;z-index:2;left:46%;bottom:18px;width:78px;height:97px;animation:tcph-bob 2.6s ease-in-out infinite;pointer-events:none}
.tcph-house__txt{position:relative;z-index:3;max-width:470px;padding:34px 40px}
.tcph-house__kicker{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#141320;background:#ff7a1a;border-radius:999px;padding:4px 10px;margin-bottom:10px}
.tcph-house__txt h2{margin:0 0 8px;font-size:34px;line-height:1.1;font-weight:900;color:#fff;letter-spacing:-.01em}
.tcph-house__txt p{margin:0 0 16px;font-size:16px;line-height:1.45;color:#d6d2ea}
.tcph-house__cd{display:flex;gap:8px;margin-bottom:18px}
.tcph-house__cd span{display:flex;flex-direction:column;align-items:center;min-width:56px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:6px 8px}
.tcph-house__cd b{font-size:22px;font-weight:800;color:#ffb067;font-variant-numeric:tabular-nums}.tcph-house__cd i{font-style:normal;font-size:11px;color:#c9c5dd}
.tcph-house__btn{display:inline-block;background:#ff7a1a;color:#141320;font-weight:800;font-size:15px;border-radius:999px;padding:12px 24px;text-decoration:none;box-shadow:0 6px 20px rgba(255,122,26,.35);transition:transform .2s}
.tcph-house__btn:hover{transform:translateY(-2px) scale(1.03);color:#141320;text-decoration:none}


/* ================= PERSONAJES 1.8 ================= */
.tcph-spider--2{right:auto;left:22%;animation-duration:11s;animation-delay:-4s}
.tcph-spider--2 .tcph-thread{height:130px}.tcph-spider--2 svg{width:26px;height:26px}
.tcph-spider--3{right:36%;animation-duration:13s;animation-delay:-8s}
.tcph-spider--3 .tcph-thread{height:240px}.tcph-spider--3 svg{width:22px;height:22px}

/* Frankenstein asomando por la izquierda */
.tcph-frank{position:absolute;left:0;top:48vh;width:86px;height:86px;animation:tcph-frank 24s ease-in-out infinite}
.tcph-frank svg{width:86px;height:86px}
.tcph-frank__spark{opacity:0;animation:tcph-frankspark 24s steps(1) infinite}
@keyframes tcph-frank{0%,8%,30%,100%{transform:translateX(-105%) rotate(0)}14%{transform:translateX(-12%) rotate(8deg)}19%{transform:translateX(-12%) rotate(-4deg)}24%{transform:translateX(-12%) rotate(6deg)}}
@keyframes tcph-frankspark{0%,15%,17%,19%,21%,100%{opacity:0}16%,18%,20%{opacity:1}}
.tcph-frank.is-hit svg{animation:tcph-rattle .4s steps(2) 3}

/* MuPerita volando en escoba */
.tcph-broom{position:absolute;top:16vh;left:0;width:150px;animation:tcph-broomfly 30s linear infinite}
.tcph-broom svg{display:block;width:150px;height:103px;animation:tcph-bob 1.4s ease-in-out infinite}
.tcph-broom__trail{position:absolute;left:-60px;top:74px;width:70px;height:10px;border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(255,210,63,.75));filter:blur(2px);animation:tcph-sparkle .3s steps(2) infinite}
@keyframes tcph-broomfly{0%{transform:translate(-180px,30px) rotate(-6deg)}22%{transform:translate(50vw,-20px) rotate(-2deg)}44%{transform:translate(calc(100vw + 60px),10px) rotate(-6deg)}44.01%,100%{transform:translate(calc(100vw + 300px),10px)}}
@keyframes tcph-sparkle{50%{opacity:.5}}

/* Calabaza que rueda */
.tcph-roll{position:absolute;bottom:2px;left:0;width:46px;height:42px;animation:tcph-rollx 36s linear infinite}
.tcph-roll svg{width:46px;height:42px;animation:tcph-rollr 1.1s linear infinite}
@keyframes tcph-rollx{0%,60%{transform:translateX(calc(100vw + 60px))}90%,100%{transform:translateX(-80px)}}
@keyframes tcph-rollr{to{transform:rotate(-360deg)}}

/* ================= CEMENTERIO MÁS VISTOSO ================= */
.tcph-gfog{position:absolute;left:0;right:0;bottom:20px;height:90px;pointer-events:none;overflow:hidden;z-index:2}
.tcph-gfog span{position:absolute;bottom:-30px;left:-50%;width:200%;height:110px;opacity:.55;
  background:radial-gradient(35% 55% at 20% 70%,rgba(168,85,247,.45),transparent 70%),radial-gradient(30% 50% at 55% 80%,rgba(140,120,200,.4),transparent 70%),radial-gradient(35% 55% at 85% 70%,rgba(168,85,247,.4),transparent 70%);
  animation:tcph-fog 30s linear infinite}
.tcph-gfog span+span{opacity:.35;bottom:-46px;animation-duration:46s;animation-direction:reverse}
.tcph-fly{position:absolute;width:5px;height:5px;border-radius:50%;background:#e9ff8a;box-shadow:0 0 8px 3px rgba(214,255,90,.55);pointer-events:none;animation:tcph-flyx 6s ease-in-out infinite,tcph-glow 1.8s ease-in-out infinite alternate}
.tcph-fly:nth-of-type(2n){animation-duration:8s,2.4s;animation-delay:-2s,-.6s}
.tcph-fly:nth-of-type(3n){animation-duration:7s,1.6s;animation-delay:-4s,-1s}
@keyframes tcph-flyx{0%,100%{transform:translate(0,0)}25%{transform:translate(18px,-14px)}50%{transform:translate(-10px,-26px)}75%{transform:translate(-20px,-6px)}}
@keyframes tcph-glow{from{opacity:.25}to{opacity:1}}
.tcph-ghands{position:absolute;left:0;right:0;bottom:22px;height:80px;pointer-events:none;z-index:1}
.tcph-ghand{position:absolute;bottom:0;width:30px;height:56px;animation:tcph-ghand 3.2s ease-in-out forwards}
.tcph-ghand svg{width:100%;height:100%;display:block}
@keyframes tcph-ghand{0%{transform:translateY(100%)}25%{transform:translateY(0) rotate(-8deg)}40%{transform:translateY(0) rotate(8deg)}55%{transform:translateY(0) rotate(-6deg)}75%{transform:translateY(0)}100%{transform:translateY(100%)}}
.tcph-dance{position:absolute;left:50%;bottom:97%;width:56px;height:84px;margin-left:-28px;animation:tcph-dancebody .6s ease-in-out infinite alternate;transform-origin:bottom center}
.tcph-dance__armL,.tcph-dance__armR,.tcph-dance__legL,.tcph-dance__legR{transform-origin:30px 34px;animation:tcph-dancearm .6s ease-in-out infinite alternate}
.tcph-dance__armR{animation-direction:alternate-reverse}
.tcph-dance__legL,.tcph-dance__legR{transform-origin:30px 58px;animation-name:tcph-danceleg}
.tcph-dance__legR{animation-direction:alternate-reverse}
@keyframes tcph-dancebody{from{transform:rotate(-6deg) translateY(0)}to{transform:rotate(6deg) translateY(-4px)}}
@keyframes tcph-dancearm{from{transform:rotate(-18deg)}to{transform:rotate(22deg)}}
@keyframes tcph-danceleg{from{transform:rotate(-10deg)}to{transform:rotate(12deg)}}
.tcph-grave{height:230px}
.tcph-grave__row{bottom:30px}

/* ================= MÓVIL ================= */
@media (max-width:767px){
  .tcph-strip{font-size:13px}
  .tcph-strip__in{gap:8px 12px;padding:8px 38px}
  .tcph-strip__ico,.tcph-strip__cdl{display:none}
  .tcph-u{padding:2px 6px}.tcph-u b{font-size:14px}
  .tcph-drip{height:12px}
  .tcph-web,.tcph-ghost,.tcph-witch,.tcph-skel,.tcph-cghost,.tcph-candy--2,.tcph-candy--4,.tcph-candy--6,.tcph-candy--8{display:none}
  .tcph-spider{right:14px}.tcph-thread{height:120px}.tcph-spider svg{width:26px;height:26px}
  .tcph-pumpkin{width:58px;left:10px}.tcph-pumpkin svg{width:58px;height:52px}.tcph-bubble{left:44px;bottom:52px;font-size:12px;max-width:170px}
  .tcph-cat{right:70px;transform-origin:bottom}.tcph-cat svg{width:50px;height:43px}
  .tcph-fog{height:80px}
  .tcph--nomobile{display:none}
  .tcph-grave{height:160px}.tcph-tomb{width:88px;height:96px;padding-top:12px}.tcph-tomb:nth-child(n+4){display:none}
  .tcph-tomb__txt{font-size:10.5px}
  .tcph-owl{right:18%}.tcph-frank,.tcph-broom,.tcph-spider--2,.tcph-spider--3{display:none}.tcph-grave{height:190px}.tcph-vamp{left:76px;width:52px}.tcph-vamp svg{width:52px;height:60px}.tcph-parade,.tcph-mummy{display:none}
  .tcph-house{flex-direction:column;align-items:stretch;min-height:0;margin:18px 10px;border-radius:18px}
  .tcph-house__scene{position:relative;width:100%;height:170px;order:2}.tcph-house__pear{left:auto;right:12px;bottom:auto;top:16px;width:58px;height:72px}
  .tcph-house__txt{padding:24px 20px 6px}.tcph-house__txt h2{font-size:25px;padding-right:56px}.tcph-house__cd span{min-width:48px}
  
  .tcph-launch{top:auto;bottom:90px;padding:10px 8px}.tcph-crow{left:4%}
  .tcph-panel{width:100%;top:auto;height:82vh;border-radius:18px 18px 0 0}
  .tcph-panel--right,.tcph-panel--left{left:0;right:0;transform:translateY(105%)}
  .tcph-panel.is-open{transform:none}
  .tcph-sticker{width:72px;height:72px;font-size:11px}
  .tcph-tomb--big{width:140px;height:160px}.tcph-tomb__big{font-size:40px}.tcph-page__pear{width:80px;height:99px}.tcph-page__title{font-size:21px}}
@media (prefers-reduced-motion:reduce){
  .tcph *,.tcph-strip *,.tcph-grave *{animation:none!important}
  .tcph-ghost,.tcph-crawl,.tcph-witch,.tcph-skel,.tcph-zombie,.tcph-candy,.tcph-cghost{display:none}
  .tcph-eyes,.tcph-bubble{opacity:1}
  .tcph-dark,.tcph-tombhand,.tcph-spark{display:none}
  .tcph-panel,.tcph-wheel__disc{transition:none}
  .tcph-mummy,.tcph-parade,.tcph-vamp,.tcph-frank,.tcph-broom,.tcph-roll,.tcph-ghands{display:none}
  .tcph-grave *{animation:none!important}
  .tcph-house *{animation:none!important;transition:none!important}
  .tcph-hunt,.tcph-sticker,.tcph-ppeek,.tcph-page__pear,.tcph-prod *{animation:none!important}}

.tcph-broom.is-hit svg{animation:tcph-spin .8s ease-in-out}
.tcph-roll.is-hit{scale:1.3;transition:scale .2s}