body { background-color: #0a0a0a; color: #f8fafc; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", sans-serif; margin: 0; padding: 0; display: flex; flex-direction: column; min-height: 100vh; } .container { flex: 1; display: flex; justify-content: center; align-items: center; padding: 20px; } .card { background-color: #18181b; border-radius: 10px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); padding: 20px; width: 80%; max-width: 500px; position: relative; overflow: hidden; } .profile-picture { width: 198px; height: 198px; border-radius: 50%; object-fit: cover; object-position: center; } .card h2 { color: #f8fafc; text-align: center; margin-top: 20px; margin-bottom: 20px; } .card p { line-height: 1.6; font-size: 16px; padding: 5px 15px; } .divider { width: 50%; height: 2px; background-color: #f8fafc; margin: 10px auto; } .bullshit { font-style: italic; letter-spacing: 0.6px; } footer { padding: 10px; text-align: center; position: sticky; bottom: 0; width: 100%; } .footer-text { font-size: 14px; color: #e5e5e5; } .tooltip { position: absolute; background-color: #18181b; color: #d4d4d8; padding: 8px 10px; border-radius: 5px; display: none; z-index: 1000; transform: translateX(-50%); max-width: 200px; word-wrap: break-word; white-space: normal; } .hover-item { position: relative; cursor: pointer; margin: 0 5px; }