:root {
/* Material Design 3 Elevation System */
--shadow-none: none;
--shadow-1: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
--shadow-2: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
--shadow-3: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
--shadow-4: 0 15px 25px rgba(0, 0, 0, 0.15), 0 5px 10px rgba(0, 0, 0, 0.05);
--shadow-5: 0 20px 40px rgba(0, 0, 0, 0.2);

/* Component-specific */
--shadow-card: var(--shadow-1);
--shadow-button: var(--shadow-2);
--shadow-dialog: var(--shadow-3);
--shadow-modal: var(--shadow-4);
--shadow-fab: var(--shadow-2);
}