:root{--accent:#4367ef}
body{isolation:isolate}main{position:relative;z-index:1}
.pointer-glow{position:fixed;top:0;left:0;width:0;height:0;pointer-events:none;z-index:0;opacity:0;transition:opacity .7s}
.pointer-glow:before{content:'';position:absolute;width:480px;height:480px;left:-240px;top:-240px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 12%,transparent),transparent 68%);transition:background .6s}
.pointer-glow.visible{opacity:.5}.subject-active .pointer-glow.visible{opacity:1}
.subject-menu{perspective:900px}
.subject-menu a{isolation:isolate;transition:color .35s}
.subject-menu a span{transform:translate(var(--mx,0px),var(--my,0px));transition:transform .45s cubic-bezier(.16,1,.3,1),color .35s,text-shadow .35s}
.subject-menu a:hover span,.subject-menu a:focus-visible span{transform:translate(var(--mx,0px),calc(var(--my,0px) - 10px)) scale(1.08);color:var(--subject-color);text-shadow:0 14px 35px color-mix(in srgb,var(--subject-color) 22%,transparent)}
.subject-menu a:after{background:var(--subject-color);transition:right .45s cubic-bezier(.16,1,.3,1)}
.click-wave{position:fixed;width:80px;height:80px;margin:-40px;border-radius:50%;border:1px solid var(--wave-color);background:color-mix(in srgb,var(--wave-color) 9%,transparent);pointer-events:none;z-index:5;animation:wave-out .85s cubic-bezier(.16,1,.3,1) forwards}
@keyframes wave-out{from{transform:scale(.3);opacity:.75}to{transform:scale(15);opacity:0}}
.article-row h3{transition:color .2s ease}.article-row:hover h3,.article-row:focus-visible h3{color:var(--accent)}
.back-home{transition:transform .25s}.back-home:hover{transform:translateX(-5px)}
@media(hover:none){.pointer-glow{display:none}.subject-menu a:active span{transform:scale(.94);color:var(--subject-color)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.pointer-glow,.click-wave{display:none}.subject-menu a:hover span,.subject-menu a:focus-visible span{transform:none}}