button, a { transition: background-color 120ms ease-out, border-color 120ms ease-out; }
.mode-card:active { transform: scale(.985); }
.screen { animation: screen-in 220ms ease-out; }
.sheet { animation: sheet-in 240ms ease-out; }
.switch::after { transition: transform 140ms ease-out; }
@keyframes screen-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
@keyframes sheet-in { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
:root[data-reduced-motion="true"] *, :root[data-reduced-motion="true"] *::after { animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) { *, *::after { animation: none !important; transition: none !important; } }