Template:Unix/styles.css

.crt-screen-curve {
  margin:1em 0 auto;
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  clear: both;
}
.crt-screen-curve::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle,
    rgba(0, 0, 0, 0) 50%,
    rgba(0, 0, 0, 0.25) 100%
  );
  pointer-events: none;
}

@keyframes rolling-refresh {
    0% { top: -100%; }
    100% { top: 100%; }
}

/* Static scanline effect (Horizontal lines) */
.crt-screen::before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.12),  
        rgba(255, 255, 255, 0.12) 1px,
        transparent 2px,
        transparent 3px
    );
    opacity: 0.6;  
    pointer-events: none;
}
/* Rolling refresh effect (Faint moving glow) */
.crt-screen::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(
        to bottom,
        rgba(255, 176, 0, 0) 0%,
        rgba(255, 176, 0, 0.05) 40%,
        rgba(255, 176, 0, 0.15) 50%,
        rgba(255, 176, 0, 0.05) 60%,
        rgba(255, 176, 0, 0) 100%
    );
    opacity: 1;
    animation: rolling-refresh 4s linear infinite; /* Rolling refresh effect */
    pointer-events: none;
}
.simple-navbox.crt-screen a {
  color: #ffb000 !important;
  text-decoration: none;
  cursor: pointer;
}
.simple-navbox.crt-screen a:not(.NavToggle):before {
  content:"[";
}
.simple-navbox.crt-screen a:not(.NavToggle):after {
  content:"]";
}
.simple-navbox.crt-screen a:hover {
  background: #ffb000 !important;
  color: #100c0c !important;
}
.simple-navbox.crt-screen .hlist li:not(:last-child):after {
  content: " * ";
}
.crt-screen-curve ~ .simple-navbox,
.crt-screen-curve ~ .crt-screen-curve, 
.crt-screen-curve ~ div.NavFrame, 
.crt-screen-curve ~ div.navbox,
div.NavFrame ~ div.NavFrame,
div.NavFrame ~ div.navbox, 
div.NavFrame ~ .crt-screen-curve {
  margin-top: -1px;
}
.blink {
  animation: blinker 1s step-start infinite;
}