body {
            font-family: Georgia, serif;
            background: black;
            background-size: cover; /* Ensure the image covers the entire background */
            color: white; /* White text for contrast */
            text-align: center;
            margin: 0;
            padding: 20px;
        }

        h1, h3, p {
            color: white; /* Ensure all headings and paragraphs are visible */
        }

        button {
            background-color: navy; /* Navy blue for buttons */
            color: white;
            border: none;
            border-radius: 10px;
            padding: 15px 30px;
            font-size: 1em;
            cursor: pointer;
            transition: background-color 0.3s, transform 0.2s;
            margin: 10px 0;
            text-decoration: none;
            display: inline-block;
        }

        button:hover {
            background-color: #003366; /* Darker navy on hover */
            transform: scale(1.05);
        }

        button:focus {
            outline: none;
            box-shadow: 0 0 5px #003366; /* Subtle shadow on focus */
        }

        #noteDisplay {
            font-size: 2em; /* Larger font for note display */
            margin-top: 20px;
        }