.coral-pixels-regular { font-family: "Coral Pixels", serif; font-weight: 400; font-style: normal; } body { min-height: 100vh; background-color: #ffffff; background-image: radial-gradient(#d1d5db 1px, transparent 1px); background-size: 20px 20px; } /* Sin scroll horizontal en mobile. Estos límites viven acá (no en clases de Tailwind) para que sigan valiendo aunque el CDN de Tailwind tarde o falle en cargar: si no cargara, una imagen a tamaño natural rompía el ancho. */ img, video, audio, iframe { max-width: 100%; } img, video { height: auto; } /* Palabras/URLs largas sin espacios no deben empujar el ancho del layout. */ p { overflow-wrap: break-word; } a.visited { color: #9ca3af; text-decoration: line-through; text-decoration-color: #ff0000; } /* Comentarios con forma de chat de stream, siempre como modal que sale de abajo con el botón flotante (mismo comportamiento en mobile y desktop). Oculto por defecto; .comments-open en el lo muestra. */ .comments-gutter { position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; max-height: 80vh; background-color: #ffffff; border-top: 1px solid rgba(0, 0, 0, 0.2); transform: translateY(100%); transition: transform 0.2s ease-out; } body.comments-open .comments-gutter { transform: none; } body:not(.comments-open) .comments-gutter { visibility: hidden; } #comment-list { overflow-y: auto; } /* Cada mensaje: "nombre: texto" en una sola tirada, como un chat. */ .chat-line { overflow-wrap: break-word; } .chat-line .chat-user { font-weight: bold; } .chat-line .chat-user::after { content: ":"; } /* El