:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}.app{column-count:4;column-gap:1rem;overflow:hidden;break-inside:avoid}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}}@media(max-width:3000px){.app{column-count:3}}@media(max-width:2000px){.app{column-count:2}}@media(max-width:768px){.app{column-count:1}}.card{perspective:1000px;cursor:pointer;aspect-ratio:var(--card-ratio, 5 / 7);--card-ratio: 5 / 7;flex:1 1;box-sizing:border-box;flex-grow:0;padding:10px}.card.landscape{--card-ratio: 7 / 5}.card-inner{position:relative;width:100%;height:100%;transition:transform .8s cubic-bezier(.4,.2,.2,1);transform-style:preserve-3d}.card.is-selected .card-inner{transform:rotateY(180deg)}.card-front,.card-back{overflow:hidden;position:absolute;width:100%;height:100%;backface-visibility:hidden;display:flex;align-items:center;justify-content:center;font-size:1.2rem}.card-inner img{max-width:100%;max-height:100%;object-fit:cover;display:block;overflow:hidden}.card-front{background:transparent;color:#fff}.card-back{background:transparent;transform:rotateY(180deg);height:100%}.card.is-selected{animation:pop .4s ease-out}.card-hover{position:absolute;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s ease}.card-year{color:#fff;font-size:2rem;font-weight:600;letter-spacing:.12em;opacity:0;transition:opacity .35s ease,transform .35s ease}.card:hover .card-hover{opacity:1}.card:hover .card-year{opacity:1;transform:translateY(0) scale(1)}@media(max-width:768px){.card{width:100%;height:100%;flex:1 1 100%}.card img{background-size:contain}}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1)}to{transform:scale(1)}}