.wordart{font-family:Arial,sans-serif;font-size:4em;font-weight:700;position:relative;text-transform:uppercase;-webkit-text-stroke:2px #000;color:#fff;letter-spacing:.05em;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,4px 4px 0 #3f87a6,8px 8px 0 #66b2ff,12px 12px 2px #1e2d4d}.wordart-small{font-size:2em;-webkit-text-stroke:1px #000;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,2px 2px 0 #3f87a6,4px 4px 0 #66b2ff,6px 6px 2px #1e2d4d}.retro-button{background:linear-gradient(180deg,#f0f0f0,#d3d3d3);border:2px solid #999;border-radius:6px;box-shadow:2px 2px 4px rgba(0,0,0,.2);color:#333;font-family:Courier New,monospace;font-weight:700;padding:8px 16px;text-transform:uppercase;transition:all .1s ease-in-out}.retro-button:hover{background:linear-gradient(180deg,#e0e0e0,#c3c3c3);box-shadow:1px 1px 2px rgba(0,0,0,.2);transform:translateY(1px)}.retro-button:active{background:linear-gradient(0deg,#d0d0d0,#b3b3b3);box-shadow:inset 1px 1px 2px rgba(0,0,0,.2);transform:translateY(2px)}.retro-input{background-color:#000;border:2px solid #66b2ff;border-radius:0;color:#6f6;font-family:Courier New,monospace;font-size:16px;padding:8px}.retro-card{background:linear-gradient(145deg,#2a2a2a,#1a1a1a);border:2px solid #66b2ff;border-radius:10px;box-shadow:5px 5px 15px rgba(0,0,0,.3),-5px -5px 15px hsla(0,0%,100%,.1)}.retro-screen{--hue:0;--saturation:30%;--lightness:10%;background-color:hsl(var(--hue),var(--saturation),var(--lightness));border:4px solid hsl(var(--hue),calc(var(--saturation) + 20%),calc(var(--lightness) + 20%));border-radius:20px;box-shadow:inset 0 0 20px hsla(var(--hue),100%,50%,.5);padding:20px}.wordart-random{font-size:3em;-webkit-text-stroke:2px var(--outline-color);text-shadow:-2px -2px 0 var(--outline-color),2px -2px 0 var(--outline-color),-2px 2px 0 var(--outline-color),2px 2px 0 var(--outline-color),4px 4px 0 var(--secondary-color),8px 8px 0 var(--primary-color),12px 12px 2px var(--secondary-color)}.wordart-random,.wordart-random-small{--hue:0;--saturation:70%;--lightness:50%;--primary-color:hsl(var(--hue),var(--saturation),var(--lightness));--secondary-color:hsl(var(--hue),calc(var(--saturation) - 20%),calc(var(--lightness) - 10%));--outline-color:hsl(var(--hue),calc(var(--saturation) - 30%),calc(var(--lightness) - 30%));color:var(--primary-color)}.wordart-random-small{-webkit-text-stroke:1px var(--outline-color);text-shadow:-1px -1px 0 var(--outline-color),1px -1px 0 var(--outline-color),-1px 1px 0 var(--outline-color),1px 1px 0 var(--outline-color),2px 2px 0 var(--secondary-color),4px 4px 0 var(--primary-color),6px 6px 2px var(--secondary-color)}.wordart-outline{font-size:3em;font-weight:700;color:#fff;text-transform:uppercase;position:relative;letter-spacing:.05em;-webkit-text-stroke:2px #000;text-shadow:3px 3px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.5));display:inline-block;transform:perspective(500px) rotateX(5deg);transform-origin:bottom center}.wordart-outline span{display:inline-block;animation:float 3s ease-in-out infinite;animation-delay:calc(.1s * var(--i, 0));white-space:nowrap;margin-right:.1em}@keyframes float{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}@keyframes gradient{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@media (max-width:640px){.wordart{font-size:2.5em}.wordart-small{font-size:1.5em}.wordart-random{font-size:2em}.wordart-outline{font-size:2em;-webkit-text-stroke:1px #000;text-shadow:2px 2px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}}