body {
    font-family: 'Montserrat', sans-serif;
    background-color: #1e293b;
    /* slate-800 */
}

.font-brand {
    font-family: 'Cinzel', serif;
}

.skyline-bg {
    background: linear-gradient(to bottom, #0f172a 0%, #334155 100%);
    /* Could verify with an image but gradient is safe */
}

.elevator-door {
    transition: width 0.5s ease-in-out;
}

.digit-card {
    transition: transform 0.2s, box-shadow 0.2s;
}

.digit-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
}

.digit-card.selected {
    border-color: #facc15;
    background-color: #475569;
}

/* High-quality claymation background */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('clay_background.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: -1;
}/* High-quality claymation background */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('clay_background.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: -1;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}