/**
 * SpendSnapper - The small animated diagrams on the About and Features pages
 *
 * Generated by build/website/build-diagrams.py. Edit the script and run it again, not this file.
 * Each moving piece is a full-size layer animated with transform and opacity only, as on the home page.
 */

.dg-stage {
    position: relative;
}

.dg-stage > svg.flow {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    max-width: none;
    overflow: visible;
}

.dg-stage > .dg-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    max-width: none;
    overflow: visible;
}

.dg-layer {
    pointer-events: none;
}

/* Moving pieces are hidden when still, so reduced motion shows the plain diagram */
.dg-move {
    opacity: 0;
}

.dg-glow {
    fill: var(--secondary-ultra-light);
}

/* The currency diagram's lit base currency shows when still, as the finished state */
@media (prefers-reduced-motion: reduce) {
    .dg-currency-lit {
        opacity: 1;
    }
}

@keyframes dg-meet-left {
    0% { transform: translate(0%, 0%); opacity: 0; }
    10% { transform: translate(0%, 0%); opacity: 0; }
    11.25% { transform: translate(0.084%, 0%); opacity: 1; }
    12.5% { transform: translate(0.328%, 0%); opacity: 1; }
    13.75% { transform: translate(0.716%, 0%); opacity: 1; }
    15% { transform: translate(1.235%, 0%); opacity: 1; }
    16.25% { transform: translate(1.869%, 0%); opacity: 1; }
    17.5% { transform: translate(2.604%, 0%); opacity: 1; }
    18.75% { transform: translate(3.426%, 0%); opacity: 1; }
    20% { transform: translate(4.321%, 0%); opacity: 1; }
    21.25% { transform: translate(5.273%, 0%); opacity: 1; }
    22.5% { transform: translate(6.269%, 0%); opacity: 1; }
    23.75% { transform: translate(7.294%, 0%); opacity: 1; }
    25% { transform: translate(8.333%, 0%); opacity: 1; }
    26.25% { transform: translate(9.373%, 0%); opacity: 1; }
    27.5% { transform: translate(10.397%, 0%); opacity: 1; }
    28.75% { transform: translate(11.393%, 0%); opacity: 1; }
    30% { transform: translate(12.346%, 0%); opacity: 1; }
    31.25% { transform: translate(13.24%, 0%); opacity: 1; }
    32.5% { transform: translate(14.062%, 0%); opacity: 1; }
    33.75% { transform: translate(14.798%, 0%); opacity: 1; }
    35% { transform: translate(15.432%, 0%); opacity: 1; }
    36.25% { transform: translate(15.951%, 0%); opacity: 1; }
    37.5% { transform: translate(16.339%, 0%); opacity: 1; }
    38.75% { transform: translate(16.582%, 0%); opacity: 1; }
    40% { transform: translate(16.667%, 0%); opacity: 1; }
    41% { transform: translate(16.667%, 0%); opacity: 0; }
    100% { transform: translate(16.667%, 0%); opacity: 0; }
}

@keyframes dg-meet-right {
    0% { transform: translate(0%, 0%); opacity: 0; }
    10% { transform: translate(0%, 0%); opacity: 0; }
    11.25% { transform: translate(-0.084%, 0%); opacity: 1; }
    12.5% { transform: translate(-0.328%, 0%); opacity: 1; }
    13.75% { transform: translate(-0.716%, 0%); opacity: 1; }
    15% { transform: translate(-1.235%, 0%); opacity: 1; }
    16.25% { transform: translate(-1.869%, 0%); opacity: 1; }
    17.5% { transform: translate(-2.604%, 0%); opacity: 1; }
    18.75% { transform: translate(-3.426%, 0%); opacity: 1; }
    20% { transform: translate(-4.321%, 0%); opacity: 1; }
    21.25% { transform: translate(-5.273%, 0%); opacity: 1; }
    22.5% { transform: translate(-6.269%, 0%); opacity: 1; }
    23.75% { transform: translate(-7.294%, 0%); opacity: 1; }
    25% { transform: translate(-8.333%, 0%); opacity: 1; }
    26.25% { transform: translate(-9.373%, 0%); opacity: 1; }
    27.5% { transform: translate(-10.397%, 0%); opacity: 1; }
    28.75% { transform: translate(-11.393%, 0%); opacity: 1; }
    30% { transform: translate(-12.346%, 0%); opacity: 1; }
    31.25% { transform: translate(-13.24%, 0%); opacity: 1; }
    32.5% { transform: translate(-14.062%, 0%); opacity: 1; }
    33.75% { transform: translate(-14.798%, 0%); opacity: 1; }
    35% { transform: translate(-15.432%, 0%); opacity: 1; }
    36.25% { transform: translate(-15.951%, 0%); opacity: 1; }
    37.5% { transform: translate(-16.339%, 0%); opacity: 1; }
    38.75% { transform: translate(-16.582%, 0%); opacity: 1; }
    40% { transform: translate(-16.667%, 0%); opacity: 1; }
    41% { transform: translate(-16.667%, 0%); opacity: 0; }
    100% { transform: translate(-16.667%, 0%); opacity: 0; }
}

@keyframes dg-meet-glow {
    0% { transform: translate(0%, 0%); opacity: 1; }
    38% { transform: translate(0%, 0%); opacity: 1; }
    48% { transform: translate(0%, 0%) scale(1.18); opacity: 1; }
    62% { transform: translate(0%, 0%); opacity: 1; }
    100% { transform: translate(0%, 0%); opacity: 1; }
}

.dg-meet-glow {
    transform-origin: 50% 50%;
}

@keyframes dg-snap-chip1 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    6% { transform: translate(0%, 0%); opacity: 0; }
    6.458% { transform: translate(0.454%, 0.001%); opacity: 0.458; }
    6.917% { transform: translate(1.748%, 0.013%); opacity: 0.917; }
    7.375% { transform: translate(3.76%, 0.059%); opacity: 1; }
    7.833% { transform: translate(6.355%, 0.172%); opacity: 1; }
    8.292% { transform: translate(9.397%, 0.384%); opacity: 1; }
    8.75% { transform: translate(12.762%, 0.722%); opacity: 1; }
    9.208% { transform: translate(16.34%, 1.204%); opacity: 1; }
    9.667% { transform: translate(20.05%, 1.835%); opacity: 1; }
    10.125% { transform: translate(23.832%, 2.607%); opacity: 1; }
    10.583% { transform: translate(27.653%, 3.498%); opacity: 1; }
    11.042% { transform: translate(31.5%, 4.476%); opacity: 1; }
    11.5% { transform: translate(35.375%, 5.5%); opacity: 1; }
    11.958% { transform: translate(39.285%, 6.524%); opacity: 1; }
    12.417% { transform: translate(43.235%, 7.502%); opacity: 1; }
    12.875% { transform: translate(47.221%, 8.393%); opacity: 1; }
    13.333% { transform: translate(51.222%, 9.165%); opacity: 1; }
    13.792% { transform: translate(55.19%, 9.796%); opacity: 1; }
    14.25% { transform: translate(59.052%, 10.278%); opacity: 1; }
    14.708% { transform: translate(62.707%, 10.616%); opacity: 1; }
    15.167% { transform: translate(66.028%, 10.828%); opacity: 1; }
    15.625% { transform: translate(68.87%, 10.941%); opacity: 1; }
    16.083% { transform: translate(71.078%, 10.987%); opacity: 0.917; }
    16.542% { transform: translate(72.5%, 10.999%); opacity: 0.458; }
    17% { transform: translate(73%, 11%); opacity: 0; }
    100% { transform: translate(73%, 11%); opacity: 0; }
}

@keyframes dg-snap-chip2 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    33% { transform: translate(0%, 0%); opacity: 0; }
    33.458% { transform: translate(0.379%, -0.001%); opacity: 0.458; }
    33.917% { transform: translate(1.459%, -0.008%); opacity: 0.917; }
    34.375% { transform: translate(3.142%, -0.039%); opacity: 1; }
    34.833% { transform: translate(5.322%, -0.115%); opacity: 1; }
    35.292% { transform: translate(7.89%, -0.256%); opacity: 1; }
    35.75% { transform: translate(10.746%, -0.481%); opacity: 1; }
    36.208% { transform: translate(13.804%, -0.802%); opacity: 1; }
    36.667% { transform: translate(16.995%, -1.223%); opacity: 1; }
    37.125% { transform: translate(20.271%, -1.738%); opacity: 1; }
    37.583% { transform: translate(23.601%, -2.332%); opacity: 1; }
    38.042% { transform: translate(26.971%, -2.984%); opacity: 1; }
    38.5% { transform: translate(30.375%, -3.667%); opacity: 1; }
    38.958% { transform: translate(33.814%, -4.349%); opacity: 1; }
    39.417% { transform: translate(37.287%, -5.001%); opacity: 1; }
    39.875% { transform: translate(40.783%, -5.595%); opacity: 1; }
    40.333% { transform: translate(44.277%, -6.11%); opacity: 1; }
    40.792% { transform: translate(47.726%, -6.531%); opacity: 1; }
    41.25% { transform: translate(51.067%, -6.852%); opacity: 1; }
    41.708% { transform: translate(54.214%, -7.077%); opacity: 1; }
    42.167% { transform: translate(57.061%, -7.219%); opacity: 1; }
    42.625% { transform: translate(59.488%, -7.294%); opacity: 1; }
    43.083% { transform: translate(61.368%, -7.325%); opacity: 0.917; }
    43.542% { transform: translate(62.576%, -7.333%); opacity: 0.458; }
    44% { transform: translate(63%, -7.333%); opacity: 0; }
    100% { transform: translate(63%, -7.333%); opacity: 0; }
}

@keyframes dg-snap-chip3 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    38% { transform: translate(0%, 0%); opacity: 0; }
    38.458% { transform: translate(0.379%, -0.001%); opacity: 0.458; }
    38.917% { transform: translate(1.459%, -0.008%); opacity: 0.917; }
    39.375% { transform: translate(3.142%, -0.039%); opacity: 1; }
    39.833% { transform: translate(5.322%, -0.115%); opacity: 1; }
    40.292% { transform: translate(7.89%, -0.256%); opacity: 1; }
    40.75% { transform: translate(10.746%, -0.481%); opacity: 1; }
    41.208% { transform: translate(13.804%, -0.802%); opacity: 1; }
    41.667% { transform: translate(16.995%, -1.223%); opacity: 1; }
    42.125% { transform: translate(20.271%, -1.738%); opacity: 1; }
    42.583% { transform: translate(23.601%, -2.332%); opacity: 1; }
    43.042% { transform: translate(26.971%, -2.984%); opacity: 1; }
    43.5% { transform: translate(30.375%, -3.667%); opacity: 1; }
    43.958% { transform: translate(33.814%, -4.349%); opacity: 1; }
    44.417% { transform: translate(37.287%, -5.001%); opacity: 1; }
    44.875% { transform: translate(40.783%, -5.595%); opacity: 1; }
    45.333% { transform: translate(44.277%, -6.11%); opacity: 1; }
    45.792% { transform: translate(47.726%, -6.531%); opacity: 1; }
    46.25% { transform: translate(51.067%, -6.852%); opacity: 1; }
    46.708% { transform: translate(54.214%, -7.077%); opacity: 1; }
    47.167% { transform: translate(57.061%, -7.219%); opacity: 1; }
    47.625% { transform: translate(59.488%, -7.294%); opacity: 1; }
    48.083% { transform: translate(61.368%, -7.325%); opacity: 0.917; }
    48.542% { transform: translate(62.576%, -7.333%); opacity: 0.458; }
    49% { transform: translate(63%, -7.333%); opacity: 0; }
    100% { transform: translate(63%, -7.333%); opacity: 0; }
}

@keyframes dg-snap-chip4 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    43% { transform: translate(0%, 0%); opacity: 0; }
    43.458% { transform: translate(0.379%, -0.001%); opacity: 0.458; }
    43.917% { transform: translate(1.459%, -0.008%); opacity: 0.917; }
    44.375% { transform: translate(3.142%, -0.039%); opacity: 1; }
    44.833% { transform: translate(5.322%, -0.115%); opacity: 1; }
    45.292% { transform: translate(7.89%, -0.256%); opacity: 1; }
    45.75% { transform: translate(10.746%, -0.481%); opacity: 1; }
    46.208% { transform: translate(13.804%, -0.802%); opacity: 1; }
    46.667% { transform: translate(16.995%, -1.223%); opacity: 1; }
    47.125% { transform: translate(20.271%, -1.738%); opacity: 1; }
    47.583% { transform: translate(23.601%, -2.332%); opacity: 1; }
    48.042% { transform: translate(26.971%, -2.984%); opacity: 1; }
    48.5% { transform: translate(30.375%, -3.667%); opacity: 1; }
    48.958% { transform: translate(33.814%, -4.349%); opacity: 1; }
    49.417% { transform: translate(37.287%, -5.001%); opacity: 1; }
    49.875% { transform: translate(40.783%, -5.595%); opacity: 1; }
    50.333% { transform: translate(44.277%, -6.11%); opacity: 1; }
    50.792% { transform: translate(47.726%, -6.531%); opacity: 1; }
    51.25% { transform: translate(51.067%, -6.852%); opacity: 1; }
    51.708% { transform: translate(54.214%, -7.077%); opacity: 1; }
    52.167% { transform: translate(57.061%, -7.219%); opacity: 1; }
    52.625% { transform: translate(59.488%, -7.294%); opacity: 1; }
    53.083% { transform: translate(61.368%, -7.325%); opacity: 0.917; }
    53.542% { transform: translate(62.576%, -7.333%); opacity: 0.458; }
    54% { transform: translate(63%, -7.333%); opacity: 0; }
    100% { transform: translate(63%, -7.333%); opacity: 0; }
}

@keyframes dg-snap-clock {
    0% { transform: translate(0%, 0%); opacity: 0; }
    4% { transform: translate(0%, 0%); opacity: 0; }
    5% { transform: translate(0%, 0%); opacity: 0.9; }
    8% { transform: translate(0%, 0%); opacity: 0; }
    100% { transform: translate(0%, 0%); opacity: 0; }
}

@keyframes dg-snap-drag {
    0% { transform: translate(0%, 0%); opacity: 0; }
    25% { transform: translate(0%, 0%); opacity: 0; }
    26% { transform: translate(4.286%, 2.762%); opacity: 1; }
    32% { transform: translate(30%, 19.333%); opacity: 1; }
    34% { transform: translate(30%, 19.333%); opacity: 0; }
    100% { transform: translate(30%, 19.333%); opacity: 0; }
}

@keyframes dg-currency-in1 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    4% { transform: translate(0%, 0%); opacity: 0; }
    4.542% { transform: translate(0.227%, 0.002%); opacity: 0.542; }
    5.083% { transform: translate(0.874%, 0.037%); opacity: 1; }
    5.625% { transform: translate(1.88%, 0.172%); opacity: 1; }
    6.167% { transform: translate(3.175%, 0.501%); opacity: 1; }
    6.708% { transform: translate(4.692%, 1.117%); opacity: 1; }
    7.25% { transform: translate(6.362%, 2.1%); opacity: 1; }
    7.792% { transform: translate(8.128%, 3.501%); opacity: 1; }
    8.333% { transform: translate(9.941%, 5.337%); opacity: 1; }
    8.875% { transform: translate(11.763%, 7.584%); opacity: 1; }
    9.417% { transform: translate(13.569%, 10.177%); opacity: 1; }
    9.958% { transform: translate(15.345%, 13.022%); opacity: 1; }
    10.5% { transform: translate(17.083%, 16%); opacity: 1; }
    11.042% { transform: translate(18.783%, 18.978%); opacity: 1; }
    11.583% { transform: translate(20.444%, 21.823%); opacity: 1; }
    12.125% { transform: translate(22.067%, 24.416%); opacity: 1; }
    12.667% { transform: translate(23.646%, 26.663%); opacity: 1; }
    13.208% { transform: translate(25.172%, 28.499%); opacity: 1; }
    13.75% { transform: translate(26.623%, 29.9%); opacity: 1; }
    14.292% { transform: translate(27.97%, 30.883%); opacity: 1; }
    14.833% { transform: translate(29.177%, 31.499%); opacity: 1; }
    15.375% { transform: translate(30.198%, 31.828%); opacity: 1; }
    15.917% { transform: translate(30.986%, 31.963%); opacity: 1; }
    16.458% { transform: translate(31.49%, 31.998%); opacity: 0.542; }
    17% { transform: translate(31.667%, 32%); opacity: 0; }
    100% { transform: translate(31.667%, 32%); opacity: 0; }
}

@keyframes dg-currency-out1 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    20% { transform: translate(0%, 0%); opacity: 0; }
    20.333% { transform: translate(0.144%, 0%); opacity: 0.333; }
    20.667% { transform: translate(0.561%, 0%); opacity: 0.667; }
    21% { transform: translate(1.224%, 0%); opacity: 1; }
    21.333% { transform: translate(2.109%, 0%); opacity: 1; }
    21.667% { transform: translate(3.19%, 0%); opacity: 1; }
    22% { transform: translate(4.442%, 0%); opacity: 1; }
    22.333% { transform: translate(5.841%, 0%); opacity: 1; }
    22.667% { transform: translate(7.361%, 0%); opacity: 1; }
    23% { transform: translate(8.978%, 0%); opacity: 1; }
    23.333% { transform: translate(10.667%, 0%); opacity: 1; }
    23.667% { transform: translate(12.405%, 0%); opacity: 1; }
    24% { transform: translate(14.167%, 0%); opacity: 1; }
    24.333% { transform: translate(15.928%, 0%); opacity: 1; }
    24.667% { transform: translate(17.666%, 0%); opacity: 1; }
    25% { transform: translate(19.355%, 0%); opacity: 1; }
    25.333% { transform: translate(20.972%, 0%); opacity: 1; }
    25.667% { transform: translate(22.492%, 0%); opacity: 1; }
    26% { transform: translate(23.891%, 0%); opacity: 1; }
    26.333% { transform: translate(25.144%, 0%); opacity: 1; }
    26.667% { transform: translate(26.225%, 0%); opacity: 1; }
    27% { transform: translate(27.11%, 0%); opacity: 1; }
    27.333% { transform: translate(27.773%, 0%); opacity: 0.667; }
    27.667% { transform: translate(28.189%, 0%); opacity: 0.333; }
    28% { transform: translate(28.333%, 0%); opacity: 0; }
    100% { transform: translate(28.333%, 0%); opacity: 0; }
}

@keyframes dg-currency-in2 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    35% { transform: translate(0%, 0%); opacity: 0; }
    35.542% { transform: translate(0.16%, 0%); opacity: 0.542; }
    36.083% { transform: translate(0.62%, 0%); opacity: 1; }
    36.625% { transform: translate(1.354%, 0%); opacity: 1; }
    37.167% { transform: translate(2.336%, 0%); opacity: 1; }
    37.708% { transform: translate(3.538%, 0%); opacity: 1; }
    38.25% { transform: translate(4.933%, 0%); opacity: 1; }
    38.792% { transform: translate(6.494%, 0%); opacity: 1; }
    39.333% { transform: translate(8.194%, 0%); opacity: 1; }
    39.875% { transform: translate(10.006%, 0%); opacity: 1; }
    40.417% { transform: translate(11.902%, 0%); opacity: 1; }
    40.958% { transform: translate(13.854%, 0%); opacity: 1; }
    41.5% { transform: translate(15.833%, 0%); opacity: 1; }
    42.042% { transform: translate(17.813%, 0%); opacity: 1; }
    42.583% { transform: translate(19.765%, 0%); opacity: 1; }
    43.125% { transform: translate(21.66%, 0%); opacity: 1; }
    43.667% { transform: translate(23.472%, 0%); opacity: 1; }
    44.208% { transform: translate(25.173%, 0%); opacity: 1; }
    44.75% { transform: translate(26.734%, 0%); opacity: 1; }
    45.292% { transform: translate(28.129%, 0%); opacity: 1; }
    45.833% { transform: translate(29.331%, 0%); opacity: 1; }
    46.375% { transform: translate(30.312%, 0%); opacity: 1; }
    46.917% { transform: translate(31.047%, 0%); opacity: 1; }
    47.458% { transform: translate(31.507%, 0%); opacity: 0.542; }
    48% { transform: translate(31.667%, 0%); opacity: 0; }
    100% { transform: translate(31.667%, 0%); opacity: 0; }
}

@keyframes dg-currency-out2 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    51% { transform: translate(0%, 0%); opacity: 0; }
    51.333% { transform: translate(0.144%, 0%); opacity: 0.333; }
    51.667% { transform: translate(0.561%, 0%); opacity: 0.667; }
    52% { transform: translate(1.224%, 0%); opacity: 1; }
    52.333% { transform: translate(2.109%, 0%); opacity: 1; }
    52.667% { transform: translate(3.19%, 0%); opacity: 1; }
    53% { transform: translate(4.442%, 0%); opacity: 1; }
    53.333% { transform: translate(5.841%, 0%); opacity: 1; }
    53.667% { transform: translate(7.361%, 0%); opacity: 1; }
    54% { transform: translate(8.978%, 0%); opacity: 1; }
    54.333% { transform: translate(10.667%, 0%); opacity: 1; }
    54.667% { transform: translate(12.405%, 0%); opacity: 1; }
    55% { transform: translate(14.167%, 0%); opacity: 1; }
    55.333% { transform: translate(15.928%, 0%); opacity: 1; }
    55.667% { transform: translate(17.666%, 0%); opacity: 1; }
    56% { transform: translate(19.355%, 0%); opacity: 1; }
    56.333% { transform: translate(20.972%, 0%); opacity: 1; }
    56.667% { transform: translate(22.492%, 0%); opacity: 1; }
    57% { transform: translate(23.891%, 0%); opacity: 1; }
    57.333% { transform: translate(25.144%, 0%); opacity: 1; }
    57.667% { transform: translate(26.225%, 0%); opacity: 1; }
    58% { transform: translate(27.11%, 0%); opacity: 1; }
    58.333% { transform: translate(27.773%, 0%); opacity: 0.667; }
    58.667% { transform: translate(28.189%, 0%); opacity: 0.333; }
    59% { transform: translate(28.333%, 0%); opacity: 0; }
    100% { transform: translate(28.333%, 0%); opacity: 0; }
}

@keyframes dg-currency-in3 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    66% { transform: translate(0%, 0%); opacity: 0; }
    66.542% { transform: translate(0.227%, -0.002%); opacity: 0.542; }
    67.083% { transform: translate(0.874%, -0.037%); opacity: 1; }
    67.625% { transform: translate(1.88%, -0.172%); opacity: 1; }
    68.167% { transform: translate(3.175%, -0.501%); opacity: 1; }
    68.708% { transform: translate(4.692%, -1.117%); opacity: 1; }
    69.25% { transform: translate(6.362%, -2.1%); opacity: 1; }
    69.792% { transform: translate(8.128%, -3.501%); opacity: 1; }
    70.333% { transform: translate(9.941%, -5.337%); opacity: 1; }
    70.875% { transform: translate(11.763%, -7.584%); opacity: 1; }
    71.417% { transform: translate(13.569%, -10.177%); opacity: 1; }
    71.958% { transform: translate(15.345%, -13.022%); opacity: 1; }
    72.5% { transform: translate(17.083%, -16%); opacity: 1; }
    73.042% { transform: translate(18.783%, -18.978%); opacity: 1; }
    73.583% { transform: translate(20.444%, -21.823%); opacity: 1; }
    74.125% { transform: translate(22.067%, -24.416%); opacity: 1; }
    74.667% { transform: translate(23.646%, -26.663%); opacity: 1; }
    75.208% { transform: translate(25.172%, -28.499%); opacity: 1; }
    75.75% { transform: translate(26.623%, -29.9%); opacity: 1; }
    76.292% { transform: translate(27.97%, -30.883%); opacity: 1; }
    76.833% { transform: translate(29.177%, -31.499%); opacity: 1; }
    77.375% { transform: translate(30.198%, -31.828%); opacity: 1; }
    77.917% { transform: translate(30.986%, -31.963%); opacity: 1; }
    78.458% { transform: translate(31.49%, -31.998%); opacity: 0.542; }
    79% { transform: translate(31.667%, -32%); opacity: 0; }
    100% { transform: translate(31.667%, -32%); opacity: 0; }
}

@keyframes dg-currency-out3 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    82% { transform: translate(0%, 0%); opacity: 0; }
    82.333% { transform: translate(0.144%, 0%); opacity: 0.333; }
    82.667% { transform: translate(0.561%, 0%); opacity: 0.667; }
    83% { transform: translate(1.224%, 0%); opacity: 1; }
    83.333% { transform: translate(2.109%, 0%); opacity: 1; }
    83.667% { transform: translate(3.19%, 0%); opacity: 1; }
    84% { transform: translate(4.442%, 0%); opacity: 1; }
    84.333% { transform: translate(5.841%, 0%); opacity: 1; }
    84.667% { transform: translate(7.361%, 0%); opacity: 1; }
    85% { transform: translate(8.978%, 0%); opacity: 1; }
    85.333% { transform: translate(10.667%, 0%); opacity: 1; }
    85.667% { transform: translate(12.405%, 0%); opacity: 1; }
    86% { transform: translate(14.167%, 0%); opacity: 1; }
    86.333% { transform: translate(15.928%, 0%); opacity: 1; }
    86.667% { transform: translate(17.666%, 0%); opacity: 1; }
    87% { transform: translate(19.355%, 0%); opacity: 1; }
    87.333% { transform: translate(20.972%, 0%); opacity: 1; }
    87.667% { transform: translate(22.492%, 0%); opacity: 1; }
    88% { transform: translate(23.891%, 0%); opacity: 1; }
    88.333% { transform: translate(25.144%, 0%); opacity: 1; }
    88.667% { transform: translate(26.225%, 0%); opacity: 1; }
    89% { transform: translate(27.11%, 0%); opacity: 1; }
    89.333% { transform: translate(27.773%, 0%); opacity: 0.667; }
    89.667% { transform: translate(28.189%, 0%); opacity: 0.333; }
    90% { transform: translate(28.333%, 0%); opacity: 0; }
    100% { transform: translate(28.333%, 0%); opacity: 0; }
}

@keyframes dg-currency-glow {
    0% { transform: translate(0%, 0%); opacity: 1; }
    15% { transform: translate(0%, 0%); opacity: 1; }
    19% { transform: translate(0%, 0%) scale(1.15); opacity: 1; }
    24% { transform: translate(0%, 0%); opacity: 1; }
    46% { transform: translate(0%, 0%); opacity: 1; }
    50% { transform: translate(0%, 0%) scale(1.15); opacity: 1; }
    55% { transform: translate(0%, 0%); opacity: 1; }
    77% { transform: translate(0%, 0%); opacity: 1; }
    81% { transform: translate(0%, 0%) scale(1.15); opacity: 1; }
    86% { transform: translate(0%, 0%); opacity: 1; }
    100% { transform: translate(0%, 0%); opacity: 1; }
}

.dg-currency-glow {
    transform-origin: 50% 50%;
}

@keyframes dg-currency-src1 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    2% { transform: translate(0%, 0%); opacity: 0; }
    4% { transform: translate(0%, 0%); opacity: 1; }
    7% { transform: translate(0%, 0%); opacity: 1; }
    11% { transform: translate(0%, 0%); opacity: 0; }
    100% { transform: translate(0%, 0%); opacity: 0; }
}

@keyframes dg-currency-src2 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    33% { transform: translate(0%, 0%); opacity: 0; }
    35% { transform: translate(0%, 0%); opacity: 1; }
    38% { transform: translate(0%, 0%); opacity: 1; }
    42% { transform: translate(0%, 0%); opacity: 0; }
    100% { transform: translate(0%, 0%); opacity: 0; }
}

@keyframes dg-currency-src3 {
    0% { transform: translate(0%, 0%); opacity: 0; }
    64% { transform: translate(0%, 0%); opacity: 0; }
    66% { transform: translate(0%, 0%); opacity: 1; }
    69% { transform: translate(0%, 0%); opacity: 1; }
    73% { transform: translate(0%, 0%); opacity: 0; }
    100% { transform: translate(0%, 0%); opacity: 0; }
}

@keyframes dg-currency-lit {
    0% { transform: translate(0%, 0%); opacity: 0; }
    27% { transform: translate(0%, 0%); opacity: 0; }
    29% { transform: translate(0%, 0%); opacity: 1; }
    34% { transform: translate(0%, 0%); opacity: 1; }
    37% { transform: translate(0%, 0%); opacity: 0; }
    58% { transform: translate(0%, 0%); opacity: 0; }
    60% { transform: translate(0%, 0%); opacity: 1; }
    65% { transform: translate(0%, 0%); opacity: 1; }
    68% { transform: translate(0%, 0%); opacity: 0; }
    89% { transform: translate(0%, 0%); opacity: 0; }
    91% { transform: translate(0%, 0%); opacity: 1; }
    96% { transform: translate(0%, 0%); opacity: 1; }
    99% { transform: translate(0%, 0%); opacity: 0; }
    100% { transform: translate(0%, 0%); opacity: 0; }
}

/* Visitors who ask for reduced motion get the still diagrams */
@media (prefers-reduced-motion: no-preference) {
    .dg-move,
    .dg-still-visible { will-change: transform, opacity; }

    .dg-meet-left { animation: dg-meet-left 4s linear infinite; }
    .dg-meet-right { animation: dg-meet-right 4s linear infinite; }
    .dg-meet-glow { animation: dg-meet-glow 4s ease-in-out infinite; }
    .dg-snap-chip1 { animation: dg-snap-chip1 12s linear infinite; }
    .dg-snap-chip2 { animation: dg-snap-chip2 12s linear infinite; }
    .dg-snap-chip3 { animation: dg-snap-chip3 12s linear infinite; }
    .dg-snap-chip4 { animation: dg-snap-chip4 12s linear infinite; }
    .dg-snap-clock { animation: dg-snap-clock 12s linear infinite; }
    .dg-snap-drag { animation: dg-snap-drag 12s linear infinite; }
    .dg-currency-in1 { animation: dg-currency-in1 15s linear infinite; }
    .dg-currency-out1 { animation: dg-currency-out1 15s linear infinite; }
    .dg-currency-in2 { animation: dg-currency-in2 15s linear infinite; }
    .dg-currency-out2 { animation: dg-currency-out2 15s linear infinite; }
    .dg-currency-in3 { animation: dg-currency-in3 15s linear infinite; }
    .dg-currency-out3 { animation: dg-currency-out3 15s linear infinite; }
    .dg-currency-glow { animation: dg-currency-glow 15s ease-in-out infinite; }
    .dg-currency-src1 { animation: dg-currency-src1 15s linear infinite; }
    .dg-currency-src2 { animation: dg-currency-src2 15s linear infinite; }
    .dg-currency-src3 { animation: dg-currency-src3 15s linear infinite; }
    .dg-currency-lit { animation: dg-currency-lit 15s linear infinite; }
}