/* ━━━━━━ 1-35: PHYSICS & GRAVITY (Balanceos, Caídas y Dinámica) ━━━━━━ */
.menu-format-1  { background: rgba(59, 130, 246, 0.1); border-top: 4px solid #3b82f6; transform: rotate(calc(var(--menu-custom-gravity) * 1deg)); }
.menu-format-2  { background: rgba(139, 92, 246, 0.1); border-top: 4px solid #8b5cf6; transform: rotate(calc(var(--menu-custom-gravity) * -1deg)); }
.menu-format-3  { background: rgba(15, 23, 42, 0.8); border-bottom: 4px solid #f59e0b; transform: translateY(calc(var(--menu-custom-gravity) * 2px)); }
.menu-format-4  { background: rgba(15, 23, 42, 0.8); border-left: 4px solid #10b981; transform: skewX(calc(var(--menu-custom-gravity) * 0.5deg)); }
.menu-format-5  { background: rgba(255, 255, 255, 0.05); animation: menuSwing 3s infinite ease-in-out; }
.menu-format-6  { background: rgba(0, 0, 0, 0.3); animation: menuHang 4s infinite ease-in-out; }
.menu-format-7  { background: #1a1c1e; border-top: 4px solid #fff; border-radius: 0 0 10px 10px; box-shadow: 0 5px 15px rgba(0,0,0,0.5); }
.menu-format-8  { background: rgba(15, 23, 42, 0.9); transform-origin: left top; animation: menuSwingLeft 5s infinite; }
.menu-format-9  { background: rgba(15, 23, 42, 0.9); transform-origin: right top; animation: menuSwingRight 5s infinite; }
.menu-format-10 { background: #0f172a; box-shadow: 0 calc(var(--menu-custom-gravity) * 2px) 15px rgba(0,0,0,0.8); }
.menu-format-11 { background: #000; border-left: 10px solid #f39c12; }
.menu-format-12 { background: #000; border-right: 10px solid #e74c3c; }
.menu-format-13 { background: #111; border-bottom: 5px solid #2ecc71; }
.menu-format-14 { background: linear-gradient(to right, rgba(255,255,255,0.1), transparent); border-left: 1px solid #fff; }
.menu-format-15 { background: #1a202c; box-shadow: inset 0 0 20px rgba(0,0,0,0.8); }
.menu-format-16 { background: transparent; border: 1px solid #9b59b6; color: #9b59b6 !important; }
.menu-format-17 { background: rgba(0,0,0,0.4); text-transform: uppercase; letter-spacing: 3px; }
.menu-format-18 { background: rgba(0,0,0,0.3); font-weight: 300; }
.menu-format-19 { background: #000; border-radius: 0 !important; border-top: 1px solid #fff; border-bottom: 1px solid #fff; }
.menu-format-20 { background: rgba(255,255,255,0.9); color: #000 !important; font-weight: bold; }
.menu-format-21 { background: #0f172a; border: 3px double #3498db; }
.menu-format-22 { background: #000; clip-path: ellipse(50% 40% at 50% 50%); }
.menu-format-23 { background: linear-gradient(white, transparent); color: #000 !important; -webkit-background-clip: padding-box; }
.menu-format-24 { background: #1abc9c22; border-left: 4px solid #1abc9c; }
.menu-format-25 { background: #2c3e50; filter: blur(0.5px); }
.menu-format-26 { background: #fff; color: #000 !important; box-shadow: 10px 10px 0 rgba(0,0,0,0.2); }
.menu-format-27 { background: #f1c40f; color: #000 !important; transform: rotate(-1deg); }
.menu-format-28 { background: radial-gradient(circle, #444, #000); }
.menu-format-29 { background: rgba(0,0,0,0.8); border: 1px solid #f1c40f; box-shadow: 0 0 15px #f1c40f55; }
.menu-format-30 { background: #1e293b; font-style: italic; border-left: 2px solid #fff; padding-left: 15px; }
.menu-format-31 { background: #000; border-top: 1px solid #3b82f6; border-bottom: 1px solid #3b82f6; }
.menu-format-32 { background: #111; border-left: 3px solid #ff00ea; border-right: 3px solid #00f2ff; }
.menu-format-33 { background: rgba(255,255,255,0.1); border: 1px dashed rgba(255,255,255,0.3); }
.menu-format-34 { background: #0f172a; border-radius: 20px 0 20px 0; border: 1px solid #10b981; }
.menu-format-35 { background: #000; border: 2px solid #fff; box-shadow: 0 0 20px rgba(255,255,255,0.2); }

/* ━━━━━━ 36-70: ZOOM & 3D (Escalado y Profundidad) ━━━━━━ */
.menu-format-36 { background: #1a202c; border: 1px solid #4a5568; }
.menu-format-36:hover { transform: scale(var(--menu-custom-hover-scale)); }
.menu-format-37 { background: #2d3748; }
.menu-format-37:hover { transform: scale(var(--menu-custom-hover-scale)) perspective(500px) rotateY(15deg); }
.menu-format-38 { background: #1a202c; }
.menu-format-38:hover { transform: scale(var(--menu-custom-hover-scale)) perspective(500px) rotateX(-15deg); }
.menu-format-39 { background: #111; }
.menu-format-39:hover { transform: translateZ(30px) scale(var(--menu-custom-hover-scale)); transform-style: preserve-3d; }
.menu-format-40 { background: rgba(255,255,255,0.05); border: 2px solid rgba(255,255,255,0.1); }
.menu-format-40:hover { border-color: #fff; transform: scale(var(--menu-custom-hover-scale)); }
.menu-format-41:hover { transform: scale(var(--menu-custom-hover-scale)) skewY(3deg); }
.menu-format-42:hover { transform: scale(var(--menu-custom-hover-scale)) skewX(-3deg); }
.menu-format-43 { background: #000; transform: perspective(1000px) rotateX(10deg); border: 1px solid #3b82f6; }
.menu-format-44 { background: #000; transform: perspective(1000px) rotateY(-10deg); border: 1px solid #ff00ea; }
.menu-format-45 { background: #111; border: 2px solid #555; }
.menu-format-45:hover { transform: scale(var(--menu-custom-hover-scale)) translateZ(50px); border-color: #fff; }
.menu-format-46 { background: #0f172a; border-radius: 35px; border: 1px solid #3b82f6; }
.menu-format-47 { background: repeating-linear-gradient(45deg, rgba(255,255,255,0.05), rgba(255,255,255,0.05) 10px, transparent 10px, transparent 20px); border: 1px solid #444; }
.menu-format-48 { background: #000; border: 1px solid #e74c3c; color: #e74c3c !important; }
.menu-format-49 { background: #2c3e50; border-bottom: 3px solid #1a252f; border-top: 1px solid #34495e; }
.menu-format-50 { background: rgba(59, 130, 246, 0.2); transform: scale(0.95); opacity: 0.8; border: 1px solid #3b82f6; }
.menu-format-51 { background: #000; border: 2px solid #00f2ff; box-shadow: inset 0 0 10px #00f2ff; }
.menu-format-52 { background: #000; border: 2px solid #ff00ea; box-shadow: inset 0 0 10px #ff00ea; }
.menu-format-53 { background: #111; border-top: 5px solid #3b82f6; border-bottom: 5px solid #8b5cf6; }
.menu-format-54 { background: linear-gradient(to bottom, #0f172a, #000); border: 1px solid #1e293b; }
.menu-format-55 { background: #fff; color: #000 !important; border-radius: 0 50px 0 50px; }
.menu-format-56:hover { transform: rotate3d(1, 1, 0, 30deg); }
.menu-format-57:hover { transform: rotate3d(0, 1, 1, -30deg); }
.menu-format-58 { background: #000; border: 1px solid #fff; overflow: hidden; }
.menu-format-58::before { content: ""; position: absolute; top:0; left:-100%; width:50%; height:100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent); animation: menuShine 3s infinite; }
.menu-format-59 { background: #1a202c; border-left: 5px solid #6366f1; }
.menu-format-60 { background: #1a202c; border-right: 5px solid #f43f5e; }
.menu-format-61 { background: #000; border: 1px solid #444; border-radius: 50% / 10%; }
.menu-format-62 { background: #000; border: 1px solid #444; border-radius: 10% / 50%; }
.menu-format-63 { background: #111; box-shadow: 5px 5px 0 #3b82f6, 10px 10px 0 rgba(59,130,246,0.3); }
.menu-format-64 { background: #111; box-shadow: -5px 5px 0 #f43f5e, -10px 10px 0 rgba(244,63,94,0.3); }
.menu-format-65 { background: #0f172a; border: 1px solid #3b82f6; clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%); }
.menu-format-66 { background: #0f172a; border: 1px solid #f43f5e; clip-path: polygon(0 0, 90% 0, 100% 100%, 10% 100%); }
.menu-format-67:hover { transform: scale(1.1) rotate(2deg); }
.menu-format-68:hover { transform: scale(1.1) rotate(-2deg); }
.menu-format-69 { background: #000; border: 2px solid #fff; filter: drop-shadow(0 0 5px #fff); }
.menu-format-70 { background: #000; border: 1px solid #3b82f6; animation: menuPulseGlow 2s infinite alternate; }

/* ━━━━━━ 71-105: GLASS, NEON & GLOW (Transparencias y Luces) ━━━━━━ */
.menu-format-71 { background: rgba(255,255,255,0.08); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.2); box-shadow: 0 8px 32px rgba(0,0,0,0.3); }
.menu-format-72 { background: rgba(0, 0, 0, 0.4); border-left: 5px solid #00f2ff; box-shadow: 0 0 15px rgba(0, 242, 255, 0.4); }
.menu-format-73 { background: rgba(0, 0, 0, 0.4); border-right: 5px solid #ff00ea; box-shadow: 0 0 15px rgba(255, 0, 234, 0.4); }
.menu-format-74 { background: #000; border: 1px solid #55fbff; animation: neonPulseBlue 2s infinite alternate; }
.menu-format-75 { background: #000; border: 1px solid #ff55fb; animation: neonPulsePink 2s infinite alternate; }
.menu-format-76 { background: #000; border: 1px solid #ffbe0b; box-shadow: 0 0 12px #ffbe0b; }
.menu-format-77 { background: #000; border: 1px solid #fb5607; box-shadow: 0 0 12px #fb5607; }
.menu-format-78 { background: rgba(255, 0, 110, 0.1); border: 2px solid #ff006e; box-shadow: 0 0 15px #ff006e; }
.menu-format-79 { background: rgba(131, 56, 236, 0.1); border: 2px solid #8338ec; box-shadow: 0 0 15px #8338ec; }
.menu-format-80 { background: rgba(58, 134, 255, 0.1); border: 2px solid #3a86ff; box-shadow: 0 0 15px #3a86ff; }
.menu-format-81 { background: #000; color: #0f0 !important; font-family: monospace !important; border: 1px solid #0f0; box-shadow: 0 0 5px #0f0; }
.menu-format-82 { background: #fff; color: #f00 !important; font-weight: 900; border: 5px solid #f00; text-transform: uppercase; }
.menu-format-83 { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border: 1px solid #fff; }
.menu-format-84 { background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%); color: #000 !important; }
.menu-format-85 { background: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%); color: #000 !important; }
.menu-format-86 { background: linear-gradient(120deg, #f6d365 0%, #fda085 100%); color: #000 !important; }
.menu-format-87 { background: linear-gradient(to top, #a18cd1 0%, #fbc2eb 100%); border-radius: 12px; }
.menu-format-88 { background: linear-gradient(to top, #fad0c4 0%, #ffd1ff 100%); color: #333 !important; }
.menu-format-89 { background: linear-gradient(to right, #4facfe 0%, #00f2fe 100%); box-shadow: 0 4px 15px rgba(0, 242, 254, 0.3); }
.menu-format-90 { background: linear-gradient(to right, #43e97b 0%, #38f9d7 100%); color: #000 !important; }
.menu-format-91 { background: #0f172a; border-left: 4px solid #fff; box-shadow: inset 5px 0 10px rgba(255,255,255,0.1); }
.menu-format-92 { background: #0f172a; border-right: 4px solid #fff; box-shadow: inset -5px 0 10px rgba(255,255,255,0.1); }
.menu-format-93 { background: transparent; border: 2px solid #fff; border-radius: 50% 0 50% 0; }
.menu-format-94 { background: #111; border: 1px solid #333; box-shadow: 0 0 20px #3b82f655; }
.menu-format-95 { background: #111; border: 1px solid #333; box-shadow: 0 0 20px #f43f5e55; }
.menu-format-96:hover { border-radius: 50%; width: 100px !important; height: 100px !important; display: flex; align-items: center; justify-content: center; }
.menu-format-97 { background: #000; border: 1px solid #f1c40f; color: #f1c40f !important; }
.menu-format-98 { background: #000; border: 1px solid #9b59b6; color: #9b59b6 !important; }
.menu-format-99 { background: #000; border: 1px solid #3498db; color: #3498db !important; }
.menu-format-100 { background: linear-gradient(90deg, #3b82f6, #f43f5e); padding: 2px; }
.menu-format-100 > * { background: #0f172a; padding: 8px 12px; height: 100%; border-radius: inherit; }
.menu-format-101 { background: repeating-linear-gradient(-45deg, #111, #111 5px, #222 5px, #222 10px); }
.menu-format-102 { background: #000; border: 2px solid #55fbff; filter: contrast(150%) brightness(120%); }
.menu-format-103 { background: #000; border: 2px solid #ff55fb; filter: hue-rotate(45deg); }
.menu-format-104 { background: rgba(59,130,246,0.3); border: 2px solid #3b82f6; box-shadow: 0 0 30px #3b82f6; }
.menu-format-105 { background: rgba(244,63,94,0.3); border: 2px solid #f43f5e; box-shadow: 0 0 30px #f43f5e; }

/* ━━━━━━ 106-140: EXPERIMENTAL & TECH (Portal, Relief, Futuristic) ━━━━━━ */
.menu-format-106 { background: linear-gradient(90deg, #000, #333); border-radius: 50px 0 50px 0; border: 1px solid #666; }
.menu-format-107 { background: #000; border: 2px dashed #ff9100; animation: dashRotate 10s infinite linear; }
.menu-format-108 { background: rgba(255,255,255,0.1); clip-path: polygon(0 0, 100% 0, 90% 100%, 10% 100%); border: 1px solid #fff; }
.menu-format-109 { background: linear-gradient(45deg, #f06, #4a9); filter: hue-rotate(90deg); border: 1px solid #fff; }
.menu-format-110 { background: #111; overflow: hidden; border: 1px solid #444; }
.menu-format-110::after { content: ""; position: absolute; top:0; left:-100%; width:100%; height:100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); transition: 0.5s; }
.menu-format-110:hover::after { left:100%; }
.menu-format-111 { background: #1e293b; box-shadow: 6px 6px 12px rgba(0,0,0,0.6), inset 2px 2px 4px rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.05); }
.menu-format-112 { background: #0f172a; box-shadow: inset 6px 6px 12px rgba(0,0,0,0.6), 2px 2px 4px rgba(255,255,255,0.1); border: 1px solid rgba(0,0,0,0.3); }
.menu-format-113 { background: rgba(15,23,42,0.6); border: 5px solid rgba(255,255,255,0.05); outline: 1px solid rgba(255,255,255,0.2); }
.menu-format-114 { background: #050505; border: 1px solid #222; color: #666 !important; }
.menu-format-114:hover { color: #fff !important; border-color: #fff; background: #000; }
.menu-format-115 { background: #000; border-radius: 0 25px 0 25px; border: 2px solid #fff; box-shadow: 0 0 15px rgba(255,255,255,0.2); }
.menu-format-116 { background: #111; text-decoration: underline wavy #ff003c; border-bottom: 2px solid #ff003c; }
.menu-format-117 { background: #000; background-image: repeating-radial-gradient(circle, rgba(255,255,255,0.05), transparent 20px); border: 1px solid #333; }
.menu-format-118 { background: #222; filter: grayscale(1); border: 1px solid #444; }
.menu-format-118:hover { filter: grayscale(0); transform: scale(1.1); border-color: #fff; }
.menu-format-119 { background: transparent; border-left: 2px solid #fff; border-right: 2px solid #fff; box-shadow: inset 0 0 10px rgba(255,255,255,0.1); }
.menu-format-120 { background: #000; transform: perspective(600px) rotateY(25deg); border-right: 5px solid #3b82f6; }
.menu-format-120:hover { transform: perspective(600px) rotateY(0); }
.menu-format-121 { background: #000; border-top: 3px solid #00f2ff; border-bottom: 3px solid #ff00ea; }
.menu-format-122 { background: #fff; color: #000 !important; border-radius: 50% / 15%; box-shadow: 0 0 25px #fff; }
.menu-format-123 { background: #ff5722; color: #fff !important; font-weight: 800; border-radius: 0 40px 40px 0; border: 2px solid #fff; }
.menu-format-124 { background: #000; border: 3px solid #ffea00; animation: menuBorderPulse 1s infinite alternate; }
.menu-format-125 { background: #111; transform: skewY(-4deg); border: 1px solid #fff; }
.menu-format-126 { background: #fff; color: #000 !important; mix-blend-mode: color-dodge; font-weight: 900; }
.menu-format-127 { background: #000; border: 1px solid #444; filter: drop-shadow(8px 8px 8px #000); }
.menu-format-128 { background: rgba(255,0,0,0.25); border: 2px solid #f00; box-shadow: 0 0 15px rgba(255,0,0,0.5); }
.menu-format-129 { background: rgba(0,255,0,0.25); border: 2px solid #0f0; box-shadow: 0 0 15px rgba(0,255,0,0.5); }
.menu-format-130 { background: rgba(0,0,255,0.25); border: 2px solid #00f; box-shadow: 0 0 15px rgba(0,0,255,0.5); }
.menu-format-131 { background: transparent; border-radius: 100px; padding: 12px 35px; border: 2px solid #fff; background: rgba(255,255,255,0.05); }
.menu-format-132 { background: #000; border-left: 20px solid #fff; font-weight: 800; }
.menu-format-133 { background: linear-gradient(to right, #000 0%, transparent 100%); border-left: 4px solid #3b82f6; }
.menu-format-134 { background: linear-gradient(to left, #000 0%, transparent 100%); border-right: 4px solid #f43f5e; }
.menu-format-135 { background: #000; box-shadow: 0 0 0 5px rgba(255,255,255,0.1), 0 0 0 12px rgba(255,255,255,0.03); border: 1px solid #fff; }
.menu-format-136 { background: transparent; border: 1px solid rgba(255,255,255,0.6); transition: 0.3s; }
.menu-format-136:hover { background: #fff; color: #000 !important; }
.menu-format-137 { background: #111; transform: scale(1.1); font-weight: 900; border: 2px solid #fff; }
.menu-format-138 { background: rgba(255,255,255,0.02); opacity: 0.3; border: 1px solid #fff; }
.menu-format-138:hover { opacity: 1; background: rgba(255,255,255,0.1); }
.menu-format-139 { background: #fff; color: #222 !important; border-radius: 60px; box-shadow: 0 0 40px rgba(255,255,255,0.6); font-weight: 800; }
.menu-format-140 { background: #050505; font-family: 'Fira Code', 'Courier New', monospace !important; border: 1px solid #00ff00; color: #00ff00 !important; }
.menu-format-140:hover { box-shadow: 0 0 20px #00ff00; }

/* ━━━━━━ ANIMACIONES Y UTILIDADES ━━━━━━ */
@keyframes menuSwing { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg); } }
@keyframes menuHang  { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(8px) rotate(2deg); } }
@keyframes menuSwingLeft { 0%, 100% { transform: rotate(-5deg); } 50% { transform: rotate(2deg); } }
@keyframes menuSwingRight { 0%, 100% { transform: rotate(5deg); } 50% { transform: rotate(-2deg); } }
@keyframes menuPulseGlow { from { box-shadow: 0 0 5px #3b82f6; } to { box-shadow: 0 0 20px #3b82f6; } }
@keyframes menuShine { from { left: -100%; } to { left: 200%; } }
@keyframes menuBorderPulse { from { border-color: #ffea00; } to { border-color: #ff5722; } }
@keyframes dashRotate { from { stroke-dashoffset: 0; } to { stroke-dashoffset: 100; } }

/* ━━━━━━ ANIMACIONES DE ENTRADA (MAPPING ADMIN) ━━━━━━ */
.anim-zoom-in { animation: animZoomIn 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
.anim-bounce { animation: animBounce 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
.anim-flip-3d { animation: animFlip3D 0.6s ease-out forwards; }
.anim-vortex { animation: animVortex 0.7s ease-out forwards; }

@keyframes animZoomIn { from { transform: scale(0.5); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes animBounce { 0% { transform: scale(0); } 60% { transform: scale(1.1); } 100% { transform: scale(1); } }
@keyframes animFlip3D { from { transform: rotateY(90deg); opacity: 0; } to { transform: rotateY(0); opacity: 1; } }
@keyframes animVortex { from { transform: rotate(180deg) scale(0); opacity: 0; } to { transform: rotate(0) scale(1); opacity: 1; } }