.clock-face {
    width: 320px;
    height: 320px;
    border: 12px solid rgba(99, 102, 241, 0.15);
    box-shadow: 
        inset 0 0 20px rgba(99, 102, 241, 0.3),
        0 0 40px rgba(99, 102, 241, 0.1);
    transition: all 0.3s ease;
}

.time-display {
    text-shadow: 0 0 15px rgba(99, 102, 241, 0.5);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

@media (max-width: 640px) {
    .clock-face {
        width: 280px;
        height: 280px;
        padding: 6px;
    }
    
    .time-display {
        font-size: 4.5rem;
    }
}