flash.css in css-zero-0.0.44

- old
+ new

@@ -4,18 +4,16 @@
   background-color: var(--color-text);
   border-radius: var(--rounded-full);
   color: var(--color-text-reversed);
   display: flex;
   gap: var(--size-2);
-  inset: 0;
   justify-content: center;
   line-height: var(--leading-none);
   margin-block-start: var(--flash-position, 0);
   margin-inline: auto;
   min-block-size: var(--size-11);
   padding: var(--size-1) var(--size-4);
-  position: fixed;
   text-align: center;
 
   @media (width >= 40rem) {
     font-size: var(--text-lg);
   }
@@ -23,9 +21,19 @@
   @media (width >= 64rem) {
     font-size: var(--text-xl);
   }
 }
 
+.flash--extended {
+  animation-name: appear-then-fade-extended;
+  animation-duration: 12s;
+}
+
 @keyframes appear-then-fade {
   0%, 100% { opacity: 0; }
   5%, 60%  { opacity: 1; }
+}
+
+@keyframes appear-then-fade-extended {
+  0%, 100% { opacity: 0; }
+  2%, 90% { opacity: 1; }
 }