/* Hero motion, verbatim from source/css/ds7.css (v7 FINAL). v6 .anim/pop/drop keyframes are superseded: do not use.
   Markup contract: <div class="fill"> contains .dropin (the notification) and a .strip with 11 .d cells,
   each holding one <i>. Cells 1-10 are .sy (check/cross) or .x / .m; cell 11 is the newest (orange). */
.fill .strip .d i{animation-duration:11s;animation-iteration-count:infinite;animation-fill-mode:both;animation-timing-function:ease-out}
.fill .strip i.sy{--fc:var(--ink)}.fill .strip i.x{--fc:var(--ink);background:currentColor}.fill .strip i.m{--fc:var(--soft);border-color:currentColor}
@keyframes f0{0%,0.00%{opacity:0;transform:scale(.4);color:var(--or)}1.50%{opacity:1;transform:none;color:var(--or)}5.91%{color:var(--or)}7.41%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(1) i{animation-name:f0}
@keyframes f1{0%,5.91%{opacity:0;transform:scale(.4);color:var(--or)}7.41%{opacity:1;transform:none;color:var(--or)}11.82%{color:var(--or)}13.32%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(2) i{animation-name:f1}
@keyframes f2{0%,11.82%{opacity:0;transform:scale(.4);color:var(--or)}13.32%{opacity:1;transform:none;color:var(--or)}17.73%{color:var(--or)}19.23%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(3) i{animation-name:f2}
@keyframes f3{0%,17.73%{opacity:0;transform:scale(.4);color:var(--or)}19.23%{opacity:1;transform:none;color:var(--or)}23.64%{color:var(--or)}25.14%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(4) i{animation-name:f3}
@keyframes f4{0%,23.64%{opacity:0;transform:scale(.4);color:var(--or)}25.14%{opacity:1;transform:none;color:var(--or)}29.55%{color:var(--or)}31.05%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(5) i{animation-name:f4}
@keyframes f5{0%,29.55%{opacity:0;transform:scale(.4);color:var(--or)}31.05%{opacity:1;transform:none;color:var(--or)}35.45%{color:var(--or)}36.95%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(6) i{animation-name:f5}
@keyframes f6{0%,35.45%{opacity:0;transform:scale(.4);color:var(--or)}36.95%{opacity:1;transform:none;color:var(--or)}41.36%{color:var(--or)}42.86%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(7) i{animation-name:f6}
@keyframes f7{0%,41.36%{opacity:0;transform:scale(.4);color:var(--or)}42.86%{opacity:1;transform:none;color:var(--or)}47.27%{color:var(--or)}48.77%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(8) i{animation-name:f7}
@keyframes f8{0%,47.27%{opacity:0;transform:scale(.4);color:var(--or)}48.77%{opacity:1;transform:none;color:var(--or)}53.18%{color:var(--or)}54.68%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(9) i{animation-name:f8}
@keyframes f9{0%,53.18%{opacity:0;transform:scale(.4);color:var(--or)}54.68%{opacity:1;transform:none;color:var(--or)}59.09%{color:var(--or)}60.59%{color:var(--fc)}94%{opacity:1;transform:none;color:var(--fc)}100%{opacity:0;color:var(--fc)}}
.fill .strip .d:nth-child(10) i{animation-name:f9}
@keyframes f10{0%,59.09%{opacity:0;transform:scale(.4);color:var(--or)}60.59%{opacity:1;transform:none;color:var(--or)}94%{opacity:1;transform:none;color:var(--or)}100%{opacity:0;color:var(--or)}}
.fill .strip .d:nth-child(11) i{animation-name:f10}
@keyframes nd{0%,53.09%{transform:translateY(-140%);opacity:0}59.09%,90%{transform:none;opacity:1}100%{transform:translateY(-140%);opacity:0}}
.fill .dropin{animation:nd 11s infinite both}
/* Reduced motion: everything visible and static; marks ink, newest orange; notification shown in place. */
@media (prefers-reduced-motion:reduce){.fill .strip .d i,.fill .dropin{animation:none!important;opacity:1!important;transform:none!important}.fill .strip .d i.sy{color:var(--ink)}.fill .strip .d:last-child i{color:var(--or)}}