Playroom: Arcade 3D retro para navegador

Crea un arcade de navegador completo y jugable llamado “Playroom”, con una estética nostálgica del hardware de finales de los años 80 y una interfaz editorial contemporánea y sobria. Usa Three.js para el renderizado y carga recursos GLB independientes para el monitor CRT, la consola, el mando y los cartuchos de juegos. Entrega una experiencia funcional, no una maqueta estática. Dirección artística: usa un fondo blanco roto cálido, plástico marfil envejecido, detalles en carbón, verde salvia apagado, terracota empolvada y azul desvaído. Combina títulos en Space Grotesk con etiquetas pequeñas en DM Mono. Añade líneas divisorias finas, abundante espacio en blanco, anotaciones técnicas sutiles y una navegación compacta. Evita el estilo ciberpunk de neón, las tarjetas de panel brillantes y los degradados excesivos. La página de inicio debe parecer una fotografía de producto cuidadosamente compuesta. Coloca el CRT de forma destacada hacia la derecha, la consola hacia la izquierda, un cartucho en posición vertical y bien asentado sobre la consola, y un mando delante. Conecta los dispositivos con cables curvos que lleguen a sus conectores reales. Usa iluminación direccional suave, sombras de contacto creíbles, bordes redondeados y materiales de plástico ligeramente rugosos. Evita que los objetos se intersequen. Dota a la página de inicio de una órbita lateral lenta y cinematográfica. Permite que los usuarios arrastren para rotar la vista y reanuda después suavemente el movimiento en reposo. Añade pulsos de datos sobrios que recorran lentamente algunos detalles del hardware. El CRT debe mostrar una escena de espera en pixel art que se repita en bucle, con una mascota pequeña, líneas de escaneo sutiles y el texto “PLAYER ONE”. Usa con precisión el logotipo formado por una T amarilla y una V blanca en los rostros de las mascotas. Un botón destacado “ENCENDER”, o hacer clic en la escena de la consola, debe iniciar una única transición continua. Acerca suavemente la cámara a la pantalla del CRT, introduce un flujo de datos animado y amplía gradualmente la escena hasta cubrir toda la ventana gráfica. Mantén cubiertos los bordes superior e inferior durante todo el proceso. Muestra la colección de cartuchos mediante una transición fluida de oscuro a claro, sin una superposición que aparezca de repente ni un salto brusco de cámara. La colección contiene tres cartuchos verticales distintos: Snake en verde salvia, Breakout en terracota y Blocks en azul. Cada uno tiene una tipografía nítida en la portada y una pequeña mascota animada encaramada encima. Usa un balanceo sutil, elevación al pasar el cursor y una inclinación suave. Permite tanto hacer clic en los cartuchos 3D como usar botones de texto accesibles debajo de ellos. Cada selección abre una interfaz de juego jugable. Snake incluye cadenas de comida y frutas de bonificación con tiempo limitado. Breakout incluye varias configuraciones de ladrillos y mejoras para la pala o multibola. Blocks incluye una vista previa de la siguiente pieza, una silueta de aterrizaje y puntuación por completar líneas. Proporciona instrucciones claras, puntuación, pausa, reinicio y navegación para volver. Admite controles de teclado y botones táctiles, con persistencia local de las mejores puntuaciones. Mantén el contenido de la pantalla y las etiquetas de los cartuchos como texturas independientes en tiempo de ejecución para que el texto conserve su nitidez. Conserva las partes con nombre de los modelos para la interacción y la animación de las mascotas. Incluye indicadores de carga, una alternativa utilizable si fallan los recursos 3D, diseños adaptables, foco de teclado visible y compatibilidad con la reducción de movimiento. Organiza el proyecto de forma limpia, verifica los tres juegos y las transiciones, y déjalo listo para desplegarlo en GitHub y Vercel.