ul{display:flex;gap:35px;list-style-type:none}li{cursor:pointer}li:hover path{fill:#fb6087}.card-section{align-items:center;display:flex;flex-direction:column;gap:25px}.card{align-items:center;border-radius:8px;box-shadow:0 10px #191a24;color:#fb6087;display:flex;font-size:72px;font-weight:700;height:130px;justify-content:center;overflow:hidden;perspective:1000px;position:relative;transform-style:preserve-3d;width:140px}.top-card{background-color:#34365099;height:50%;position:absolute;top:0;width:100%;z-index:1}.new{opacity:0}.new-animation{animation:new .3s forwards}.old-animation{animation:old .3s forwards}.card-animation{animation:flip .3s forwards}.card-change{align-items:center;backface-visibility:hidden;background-color:transparent;border-radius:8px 8px 0 0;box-shadow:0 2px 4px #0003;display:flex;height:50%;justify-content:center;position:absolute;top:0;transform-origin:bottom;width:100%}span{align-items:center;backface-visibility:hidden;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:50%;transform-origin:center;width:100%;z-index:1}.bottom{background-color:#343650;bottom:0;height:50%;left:0;position:absolute;width:100%}.line{background-color:#191a2466;height:1px;position:absolute;width:100%;z-index:2}.circle{background-color:#191a24;border-radius:50%;height:10px;position:absolute;width:10px;z-index:2}.left{left:-5px}.right{right:-5px}.name{color:#8486a9;font-size:12px;font-weight:700;letter-spacing:8px;text-transform:uppercase}@keyframes flip{0%{filter:brightness(1);transform:rotateX(0);z-index:1}30%{background-color:#343650}40%{filter:brightness(.85);transform:rotateX(-60deg);z-index:5}50%{filter:brightness(.75);transform:rotateX(-90deg);z-index:10}60%{filter:brightness(.85);transform:rotateX(-120deg);z-index:5}80%{z-index:10}to{background-color:#343650;filter:brightness(1);transform:rotateX(-180deg);z-index:1}}@keyframes old{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(50%)}}@keyframes new{0%{opacity:0;transform:translateY(-20%)}to{opacity:1;transform:translateY(0)}}@media (max-width: 650px){.card{font-size:42px;height:80px;width:90px}.name{font-size:8px;letter-spacing:4px}}@media (max-width: 500px){.card{font-size:32px;height:60px;width:70px}}.app{align-items:center;background:url(/pattern-hills.svg) bottom center repeat-x,url(/bg-stars.svg) center no-repeat #1e1f29;color:#fff;display:flex;flex-direction:column;height:fit-content;justify-content:space-between;min-height:100vh;padding:60px;text-transform:uppercase}.app-top{align-items:center;display:flex;flex-direction:column;flex:1;gap:60px;justify-content:space-evenly}h1{font-size:24px;font-weight:600;letter-spacing:8px;text-align:center}.cards{align-items:center;display:flex;flex:1;gap:25px;margin-top:-200px}.attribution{display:none;font-size:11px;text-align:center}.attribution a{color:#3e52a3}@media (max-width: 650px){h1{font-size:16px}.cards{gap:15px}}@media (max-width: 500px){.cards{gap:10px}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{min-height:100vh;height:fit-content;width:100%}body{font-family:Red Hat Text}