You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

2 lines
5.6 KiB
Plaintext

:root{--background-color: #efefef;--alt-background-color: #dfdfdf;--foreground-color: #495057;--body-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--text-color: #fff;--title-text-color: #444;--link-color: #228be6;--link-hover-color: #1c7ed6;--heading-color: #212529;--border-color: #dee2e6}@media (prefers-color-scheme: dark){:root{--background-color: #292929;--alt-background-color: #0a1922;--foreground-color: #dee2e6;--text-color: #000;--title-text-color: #ddd;--heading-color: #fff;--link-color: #74c0fc;--link-hover-color: #4dabf7;--border-color: rgba(255, 255, 255, 0.15)}}.main{background-color:var(--background-color);color:var(--foreground-color);padding:10px 15px;font-size:0.9em}.headline{max-width:1000px;height:auto;font-size:1em;text-align:center}.alt-background{background:var(--alt-background-color)}.cards-list{max-width:1000px;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:1.5rem 3rem}.nav-spacer{display:none}.banner-burnin{position:absolute;width:100%;height:100%;z-index:-1;box-shadow:inset 0px 0px 1px 1px rgba(64,64,64,0.1);background:radial-gradient(ellipse at center, #4e3d18 0%, rgba(64,64,64,0) 50%);transform-origin:50% 50%;transform:perspective(20px) rotateX(0.5deg) skewX(2deg) scale(1.03);animation:burnin 1s linear infinite;opacity:.9}.banner-burnin::after{position:relative;background:radial-gradient(ellipse at center, rgba(0,0,0,0.5) 0%, rgba(64,64,64,0) 100%);opacity:.1}.banner-terminal{position:relative;z-index:90;margin:0 auto;width:100%;height:550px;background-color:#0a1922;overflow:hidden}.banner-terminal::before{position:absolute;width:100%;height:100%;top:0;left:0;content:"";z-index:20;background:linear-gradient(#777 50%, #0a1922 50%);background-size:100% 4px;background-repeat:repeat-y;opacity:.14;box-shadow:inset 0px 0px 1px 1px rgba(0,0,0,0.8);animation:pulse 5s linear infinite}.banner-terminal::after{position:absolute;content:"";top:0;left:0;width:100%;height:76%;z-index:99;background:radial-gradient(ellipse at center, #000 0%, rgba(0,0,0,0.62) 45%, rgba(0,9,4,0.6) 47%, #c3993c 100%);background-color:#c3993c;box-shadow:inset 0px 0px 4px 4px rgba(100,100,100,0.5);opacity:.1}.banner-scanline{--scanline-area: 550px;position:relative;z-index:99;width:100%;height:5px;background:linear-gradient(to bottom, rgba(255,0,0,0) 0%, snow 50%, rgba(255,255,255,0.98) 51%, rgba(255,0,0,0) 100%);background-color:#fff;background-size:100% 4px;opacity:.1;animation:scanline 3.25s ease-in-out infinite}.banner-textarea{position:relative;width:1500px;height:600px;margin:0 auto}.banner-prompt{position:relative;text-align:left;padding-left:1em;font-family:Inconsolata, Courier, unicase;text-shadow:0 0 8px rgba(255,255,255,0.3);font-size:4em;color:#c3993c}.ghost,.pop{opacity:0.27}.banner-msg-line{text-shadow:0 0 8px rgba(231,214,177,0.3);font-family:Inconsolata, Courier, monospace;font-smoothing:antialiased;padding-left:6em;font-size:3em;white-space:pre;color:#c3993c;overflow:hidden}#banner-msg-animate{text-shadow:0 0 8px rgba(255,255,255,0.1);color:#6d592c;bottom:0}.flicker{margin:0;color:#2d2d2d;letter-spacing:-.05rem}.flicker::before{content:attr(letter);position:absolute;overflow:hidden;color:#fab005;z-index:30;text-shadow:none;animation:flicker 3s linear infinite}.glitch{margin:0;letter-spacing:-0.05rem;display:inline-block;animation:glitch 1s linear infinite}.glitch::before,.glitch::after{content:attr(text);position:absolute;overflow:hidden}.glitch::before{left:0;animation:glitch-top 1s linear infinite;clip-path:polygon(0 0, 100% 0, 100% 33%, 0 33%)}.glitch::after{left:0;animation:glitch-bottom 1.5s linear infinite;clip-path:polygon(0 67%, 100% 67%, 100% 100%, 0 100%)}@keyframes burnin{0%{transform:scale(1, 1.002)}50%{transform:scale(1, 1.0001)}100%{transform:scale(1.001, 1)}}@keyframes scanline{to{transform:translateY(var(--scanline-area)) translateY(-5px)}}@keyframes pulse{0%{transform:scale(1.001);opacity:.14}8%{transform:scale(1);opacity:.13}15%{transform:scale(1.004);opacity:.14}30%{transform:scale(1.002);opacity:.11}100%{transform:scale(1);opacity:.14}}@keyframes flicker{0%,19.999%,22%,62.999%,64%,64.999%,70%,100%{opacity:.99;text-shadow:-1px -1px 0 rgba(255,255,255,0.4),1px -1px 0 rgba(255,255,255,0.4),-1px 1px 0 rgba(255,255,255,0.4),1px 1px 0 rgba(255,255,255,0.4),0 -2px 8px,0 0 2px,0 0 5px #ff7e00,0 0 15px #f44,0 0 2px #ff7e00,0 2px 3px #000}20%,21.999%,63%,63.999%,65%,69.999%{opacity:0.4;text-shadow:none}}@keyframes glitch{2%,64%{transform:translate(2px, 0) skew(0deg)}4%,60%{transform:translate(-2px, 0) skew(0deg)}62%{transform:translate(0, 0) skew(5deg)}}@keyframes glitch-top{2%,64%{transform:translate(2px, -2px)}4%,60%{transform:translate(-2px, 2px)}62%{transform:translate(13px, -1px) skew(-13deg)}}@keyframes glitch-bottom{2%,64%{transform:translate(-2px, 0)}4%,60%{transform:translate(-2px, 0)}62%{transform:translate(-22px, 5px) skew(21deg)}}@keyframes typing{to{width:100%}}@keyframes blinking{from,to{border-color:transparent}50%{border-color:orange}}.motto{text-align:left;padding-top:1.5rem}@media only screen and (max-width: 1200px){.banner-terminal{height:400px}.banner-scanline{--scanline-area: 400px}.banner-prompt{font-size:3em}.banner-msg-line{font-size:2em}}@media only screen and (max-width: 1000px){html,body{overflow-x:hidden}body{-webkit-text-size-adjust:none}}@media only screen and (max-width: 800px){.banner-terminal{height:280px}.banner-scanline{--scanline-area: 280px}.banner-prompt{font-size:2em}.banner-msg-line{font-size:1.5em;padding-left:3em}}