#timeline-bar{max-width:420px}#timeline-bar:before,#timeline-bar:after{content:"";display:block;position:absolute;top:0;bottom:0;width:50%;max-width:200px;height:100%;z-index:3}#timeline-bar:before{right:50%;margin-right:22px;background:linear-gradient(90deg,#010101,#01010100)}#timeline-bar:after{left:50%;margin-left:22px;background:linear-gradient(90deg,#01010100,#010101)}.nav-button{width:48px;height:48px;background:#ffffff1f;border:1px solid transparent;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .3s}.nav-button:hover{border:1px solid white;background:transparent}.year-indicator{font-family:Inter,sans-serif;font-weight:500;font-size:18px;color:#fff;opacity:.5;transition:opacity .3s}.year-indicator.active{opacity:1}.card-container{position:relative;margin:0 auto;overflow:hidden}.scrollable{overflow:auto;scrollbar-width:none}.scrollable::-webkit-scrollbar{display:none}#card-list{position:relative;max-width:1800px;overflow:hidden;margin:0 auto}#card-list:after{content:"";display:none;position:absolute;bottom:100px;left:0;width:100%;height:114px;z-index:1000;background:linear-gradient(180deg,#010101,#01010100)}.card{position:absolute;left:50%;width:306px;height:578px;z-index:999;opacity:0;transform-origin:center;transition:transform .6s ease-out,opacity .6s ease-out,border 1.2s ease-out;overflow:hidden;border-radius:24px;cursor:pointer;border:.5px solid transparent}.card:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:50%;transition:all .3s ease-out;background:linear-gradient(180deg,#01010100,#010101);border-radius:24px;pointer-events:none}.card img{width:100%;height:100%;object-fit:cover;aspect-ratio:9/17}.card a{display:none}.active-4,.active-3{opacity:0;z-index:-1}.active-2{opacity:.64;z-index:2}.active-1{opacity:.64;z-index:3}.active0{opacity:1;z-index:4;border:.5px solid white}.active0:after{opacity:0}.active0 a{display:block;z-index:99}.active1{opacity:.64;z-index:3}.active2{opacity:.64;z-index:2}.active3,.active4{opacity:0;z-index:-1}@media screen and (min-width: 375px) and (max-width: 767px){.year-indicator{font-size:14px;line-height:22px}#card-list{height:324px}.card{margin-left:-75px;width:150px;height:284px;border-radius:12px}.card:after{border-radius:12px}.active-4{transform:scale(.43) rotate(-60deg) translate(-954px,-544px)}.active-3{transform:scale(.53) rotate(-45deg) translate(-696px,-270px)}.active-2{transform:scale(.686) rotate(-30deg) translate(-404px,-121px)}.active-1{transform:scale(.843) rotate(-15deg) translate(-179px,-39px)}.active0{transform:scale(1) rotate(0) translate(0)}.active1{transform:scale(.843) rotate(15deg) translate(179px,-39px)}.active2{transform:scale(.686) rotate(30deg) translate(404px,-121px)}.active3{transform:scale(.53) rotate(45deg) translate(696px,-270px)}.active4{transform:scale(.43) rotate(60deg) translate(954px,-544px)}}@media screen and (min-width: 768px) and (max-width: 1439px){#card-list{height:491px}.card{margin-left:-108px;width:217px;height:411px;border-radius:12px}.card:after{border-radius:12px}.active-4{transform:scale(.43) rotate(-60deg) translate(-1380px,-788px)}.active-3{transform:scale(.53) rotate(-45deg) translate(-1008px,-391px)}.active-2{transform:scale(.686) rotate(-30deg) translate(-588px,-177px)}.active-1{transform:scale(.843) rotate(-15deg) translate(-259px,-55px)}.active0{transform:scale(1) rotate(0) translate(0)}.active1{transform:scale(.843) rotate(15deg) translate(259px,-55px)}.active2{transform:scale(.686) rotate(30deg) translate(588px,-177px)}.active3{transform:scale(.53) rotate(45deg) translate(1008px,-391px)}.active4{transform:scale(.43) rotate(60deg) translate(1380px,-788px)}}@media screen and (min-width: 1440px){#card-list{height:678px}.card{margin-left:-153px;width:306px;height:578px}.active-4{transform:scale(.43) rotate(-60deg) translate(-1945px,-1110px)}.active-3{transform:scale(.53) rotate(-45deg) translate(-1420px,-550px)}.active-2{transform:scale(.686) rotate(-30deg) translate(-826px,-250px)}.active-1{transform:scale(.843) rotate(-15deg) translate(-366px,-78px)}.active0{transform:scale(1) rotate(0) translate(0)}.active1{transform:scale(.843) rotate(15deg) translate(366px,-78px)}.active2{transform:scale(.686) rotate(30deg) translate(826px,-250px)}.active3{transform:scale(.53) rotate(45deg) translate(1420px,-550px)}.active4{transform:scale(.43) rotate(60deg) translate(1945px,-1110px)}}