File size: 1,052 Bytes
4ea3c28 f1e4019 4ea3c28 f1e4019 4ea3c28 f1e4019 4ea3c28 f1e4019 4ea3c28 f1e4019 4ea3c28 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
/* Modern Apple-style shadows */
.card-hover {
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card-hover:hover {
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
:root {
--color-primary: #6D4AFF;
--color-secondary: #F3F4F6;
--radius-card: 12px;
--radius-button: 10px;
--radius-tag: 20px;
--shadow-default: 0 1px 3px rgba(0, 0, 0, 0.08);
}
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
/* Animation for play button */
@keyframes pulse {
0% { transform: scale(1); opacity: 1; }
50% { transform: scale(1.1); opacity: 0.7; }
100% { transform: scale(1); opacity: 1; }
}
.playing {
animation: pulse 1.5s infinite;
}
/* Accessibility focus styles */
button:focus, a:focus, input:focus {
outline: 2px solid var(--color-primary);
outline-offset: 2px;
}
/* Responsive adjustments */
@media (max-width: 640px) {
.sound-card {
flex-direction: column;
}
} |