.flip-card{perspective:1000px}.flip-card-inner{text-align:center;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.61,.98,.48,1.01);position:relative}.flip-card:hover .flip-card-inner{transform:rotate(180deg)rotateX(180deg)}.flip-card-front,.flip-card-back{backface-visibility:hidden;border-radius:.75rem;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;box-shadow:0 6px 16px #1e3a5f1a}.flip-card-back{transform:rotateY(180deg)}
.subject-card-link{text-decoration:none;display:block}.subject-card{aspect-ratio:3/4;width:100%;max-height:280px;transition:all .2s;position:relative}.subject-card:active{transform:scale(.97)}.subject-card-inner{z-index:0;border-radius:20px;transition:all .7s;position:absolute;inset:0}.subject-card-prompt-icon{justify-content:center;align-items:center;transition:opacity .3s ease-in-out;display:flex;position:absolute;inset:0}.subject-card-prompt-icon svg{stroke:#fff;width:4rem;height:4rem}.subject-card-prompt-icon svg circle[fill]{fill:#fff}.subject-card-small-icon{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;background:#fff3;border-radius:50%;justify-content:center;align-items:center;width:3rem;height:3rem;transition:opacity .3s ease-in-out;display:flex;position:absolute;top:1.25rem;left:50%;transform:translate(-50%)}.subject-card-small-icon svg{stroke:#fff;width:1.5rem;height:1.5rem}.subject-card-small-icon svg circle[fill]{fill:#fff}.subject-card-title{color:#fff;text-align:center;opacity:0;font-size:1.125rem;font-weight:700;line-height:1.2;transition:opacity .3s ease-in-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.subject-card-subtitle{color:#ffffffbf;text-align:center;letter-spacing:.05em;text-transform:uppercase;opacity:0;font-size:.75rem;font-weight:500;transition:opacity .3s ease-in-out;position:absolute;bottom:1.25rem;left:50%;transform:translate(-50%)}.subject-card-canvas{perspective:800px;z-index:200;grid-template-rows:repeat(5,1fr);grid-template-columns:repeat(5,1fr);gap:0;display:grid;position:absolute;inset:0}.subject-card-inner:before{content:"";background:inherit;filter:blur(2rem);opacity:.3;z-index:-1;border-radius:20px;width:100%;height:100%;transition:all .2s;position:absolute}.subject-card:hover .subject-card-inner:before{opacity:.6}.tracker:hover~.subject-card-inner .subject-card-prompt-icon{opacity:0}.tracker:hover~.subject-card-inner .subject-card-small-icon,.tracker:hover~.subject-card-inner .subject-card-title,.tracker:hover~.subject-card-inner .subject-card-subtitle{opacity:1}.tracker{z-index:200;cursor:pointer;position:relative}.noselect{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.tr-1:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(20deg)rotateY(-10deg)}.tr-2:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(20deg)rotateY(-5deg)}.tr-3:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(20deg)rotateY(0)}.tr-4:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(20deg)rotateY(5deg)}.tr-5:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(20deg)rotateY(10deg)}.tr-6:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(10deg)rotateY(-10deg)}.tr-7:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(10deg)rotateY(-5deg)}.tr-8:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(10deg)rotateY(0)}.tr-9:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(10deg)rotateY(5deg)}.tr-10:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(10deg)rotateY(10deg)}.tr-11:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(0)rotateY(-10deg)}.tr-12:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(0)rotateY(-5deg)}.tr-13:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(0)rotateY(0)}.tr-14:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(0)rotateY(5deg)}.tr-15:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(0)rotateY(10deg)}.tr-16:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-10deg)rotateY(-10deg)}.tr-17:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-10deg)rotateY(-5deg)}.tr-18:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-10deg)rotateY(0)}.tr-19:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-10deg)rotateY(5deg)}.tr-20:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-10deg)rotateY(10deg)}.tr-21:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-20deg)rotateY(-10deg)}.tr-22:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-20deg)rotateY(-5deg)}.tr-23:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-20deg)rotateY(0)}.tr-24:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-20deg)rotateY(5deg)}.tr-25:hover~.subject-card-inner{transition:all .125s ease-in-out;transform:rotateX(-20deg)rotateY(10deg)}
