@import 'style.css';

html,
body {
    margin: 0;
    padding: 0;
    background-color: var(--light-pink);
    overflow: hidden;
    /* optional, keeps it clean*/
}

#content {
    position: relative;
    z-index: 1;
    /* above canvas */
    height: 100vh;
    display: grid;
    place-items: center;
}

#enter-btn {
    background: var(--hot-pink);
    /* hot pink */
    color: var(--light-pink);
    /* light pink text */
    padding: 14px 30px;
    border-radius: 999px;
    font-weight: 600;
    letter-spacing: 0.08em;
    border: 2px solid rgba(248, 212, 234, 0.9);
    cursor: pointer;

    box-shadow:
        0 0 12px rgba(222, 17, 119, 0.6),
        0 0 28px rgba(222, 17, 119, 0.35);

    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

#enter-btn:hover {
    transform: translateY(-2px);
    box-shadow:
        0 0 16px rgba(222, 17, 119, 0.85),
        0 0 40px rgba(222, 17, 119, 0.5);
}