* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Arial', sans-serif;
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);
    color: white;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    cursor: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 393 326"><g><path d="M12.628,18.573C12.628,13.621,0,3.509,0,0c3.793,0,38.342,0,43.352,0c0,2.89-12.064,13.623-12.064,18.573 C29.403,18.573,12.628,18.573,12.628,18.573z" fill="%23FFD700"/><path d="M12.628,40.501C12.628,35.549,0,25.438,0,21.928c3.793,0,38.342,0,43.352,0c0,2.89-12.064,13.621-12.064,18.573 C29.403,40.501,12.628,40.501,12.628,40.501z" fill="%23FFD700"/></g><g><path d="M64.359,18.573c0-4.952-12.628-15.064-12.628-18.573c3.793,0,38.343,0,43.352,0c0,2.89-12.064,13.623-12.064,18.573 C81.134,18.573,64.359,18.573,64.359,18.573z" fill="%23FFD700"/><path d="M64.359,40.501c0-4.952-12.628-15.063-12.628-18.573c3.793,0,38.343,0,43.352,0c0,2.89-12.064,13.621-12.064,18.573 C81.134,40.501,64.359,40.501,64.359,40.501z" fill="%23FFD700"/></g><g><path d="M117.795,18.573c0-4.952-12.629-15.064-12.629-18.573c3.793,0,38.343,0,43.353,0c0,2.89-12.064,13.623-12.064,18.573 C134.57,18.573,117.795,18.573,117.795,18.573z" fill="%23FFD700"/><path d="M117.795,40.501c0-4.952-12.629-15.063-12.629-18.573c3.793,0,38.343,0,43.353,0c0,2.89-12.064,13.621-12.064,18.573 C134.57,40.501,117.795,40.501,117.795,40.501z" fill="%23FFD700"/></g><g><path d="M250.25,18.573c0-4.952-12.63-15.064-12.63-18.573c3.794,0,38.344,0,43.354,0c0,2.89-12.064,13.623-12.064,18.573 C267.025,18.573,250.25,18.573,250.25,18.573z" fill="%23FFD700"/><path d="M250.25,40.501c0-4.952-12.63-15.063-12.63-18.573c3.794,0,38.344,0,43.354,0c0,2.89-12.064,13.621-12.064,18.573 C267.025,40.501,250.25,40.501,250.25,40.501z" fill="%23FFD700"/></g><g><path d="M184.876,18.573c0-4.952-12.63-15.064-12.63-18.573c3.794,0,38.344,0,43.354,0c0,2.89-12.064,13.623-12.064,18.573 C201.652,18.573,184.876,18.573,184.876,18.573z" fill="%23FFD700"/><path d="M184.876,40.501c0-4.952-12.63-15.063-12.63-18.573c3.794,0,38.344,0,43.354,0c0,2.89-12.064,13.621-12.064,18.573 C201.652,40.501,184.876,40.501,184.876,40.501z" fill="%23FFD700"/></g><g><path d="M303.686,18.573c0-4.952-12.63-15.064-12.63-18.573c3.794,0,38.344,0,43.354,0c0,2.89-12.064,13.623-12.064,18.573 C320.461,18.573,303.686,18.573,303.686,18.573z" fill="%23FFD700"/><path d="M303.686,40.501c0-4.952-12.63-15.063-12.63-18.573c3.794,0,38.344,0,43.354,0c0,2.89-12.064,13.621-12.064,18.573 C320.461,40.501,303.686,40.501,303.686,40.501z" fill="%23FFD700"/></g><g><path d="M355.416,18.573c0-4.952-12.63-15.064-12.63-18.573c3.795,0,38.344,0,43.354,0c0,2.89-12.064,13.623-12.064,18.573 C372.191,18.573,355.416,18.573,355.416,18.573z" fill="%23FFD700"/><path d="M355.416,40.501c0-4.952-12.63-15.063-12.63-18.573c3.795,0,38.344,0,43.354,0c0,2.89-12.064,13.621-12.064,18.573 C372.191,40.501,355.416,40.501,355.416,40.501z" fill="%23FFD700"/></g><path fill="none" stroke="%23FFD700" stroke-width="17.6482" d="M21.688,43.414c0,94.816,76.863,171.676,171.68,171.676 c94.815,0,171.683-76.86,171.683-171.676"/><path fill="none" stroke="%23FFD700" stroke-width="17.6482" d="M73.419,43.414c0,66.247,53.703,119.948,119.949,119.948 c66.247,0,119.95-53.702,119.95-119.948"/><path fill="none" stroke="%23FFD700" stroke-width="17.6482" d="M126.855,43.414c0,36.734,29.778,66.512,66.513,66.512 c36.735,0,66.514-29.778,66.514-66.512"/><line fill="none" stroke="%23FFD700" stroke-width="17.6482" x1="193.368" y1="43.414" x2="193.368" y2="310.926"/><polygon points="99.716,319.182 99.716,307.414 193.342,286.824 286.446,307.414 286.446,319.182 99.716,319.182" fill="%23FFD700"/></svg>') 12 12, auto;
}

.container {
    text-align: center;
    padding: 2rem;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

h1 {
    font-size: 3rem;
    margin-bottom: 2rem;
    color: #FFD700;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

#hanukkah-text {
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 5px;
    padding: 0 5px;
}

#hanukkah-text:hover {
    transform: scale(1.05);
    /* text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5), 0 0 15px #FFD700; */
}

#hanukkah-text:active {
    transform: scale(0.95);
}

.countdown {
    font-size: 4rem;
    font-weight: bold;
    margin: 2rem 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.hanukkah-message {
    font-size: 5rem;
    font-weight: bold;
    color: #FFD700;
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5);
    animation: glow 2s ease-in-out infinite alternate;
}

@keyframes glow {
    from { text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 0 0 20px #FFD700; }
    to { text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 0 0 30px #FFD700, 0 0 40px #FFD700; }
}

.time-unit {
    display: inline-block;
    margin: 0 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    min-width: 120px;
}

.time-number {
    display: block;
    font-size: 3rem;
    font-weight: bold;
    color: #FFD700;
}

.time-label {
    display: block;
    font-size: 1rem;
    margin-top: 0.5rem;
    color: rgba(255, 255, 255, 0.8);
}

@media (max-width: 768px) {
    h1 { font-size: 2rem; }
    .countdown { font-size: 2.5rem; }
    .hanukkah-message { font-size: 3rem; }
    .time-unit { margin: 0 0.5rem; min-width: 80px; }
    .time-number { font-size: 2rem; }
}