.arena .lunar-portal{z-index:-2;pointer-events:auto;display:grid;place-items:center;opacity:1;width:100px;height:100px;right:calc(13% + 30px);top:calc(1% + 30px);border-radius:50%;text-decoration:none;background:none;isolation:isolate}
/* The transparent illustration stays in front without blocking the moon link. */
.arena #field{pointer-events:none}
/* A navy silhouette remains when the illuminated surface recedes. */
.lunar-portal::before{content:'';position:absolute;width:64px;height:64px;border-radius:50%;background:#0a141c;pointer-events:none}
.lunar-body{position:absolute;width:64px;height:64px;overflow:hidden;border-radius:50%;background:radial-gradient(ellipse at 37% 35%,#e7f7ff 0%,#b4d8e9 17%,#698fa6 37%,#284459 62%,#0a1928 88%);box-shadow:inset -8px -4px 14px #030d19cc,inset 1px 1px 2px #daf7ffbb,0 0 14px #80ceff44,0 0 38px #4b98d728;animation:lunar-breath 36s ease-in-out infinite}
.lunar-body:before,.lunar-body:after,.lunar-body i,.lunar-body b{content:'';position:absolute;border-radius:43% 57% 62% 38%;background:radial-gradient(ellipse,#2038494d 0%,#314e6422 48%,transparent 76%);filter:blur(.6px);opacity:.72}
.lunar-body:before{width:28px;height:22px;left:8px;top:12px;transform:rotate(-25deg)}.lunar-body:after{width:21px;height:28px;left:30px;top:29px;transform:rotate(24deg)}.lunar-body i{width:15px;height:11px;left:10px;top:36px}.lunar-body b{width:11px;height:13px;left:34px;top:8px}
.lunar-aura{position:absolute;inset:-26px;border-radius:50%;background:radial-gradient(circle,#bceaff14 18%,#72b9ef0c 40%,transparent 69%);animation:lunar-aura 36s ease-in-out infinite;pointer-events:none}
.lunar-glint{position:absolute;width:67px;height:67px;border-radius:50%;border:1px solid transparent;border-top-color:#d4f5ff88;border-right-color:#a6e8ff33;filter:drop-shadow(0 0 4px #b0e8ff66);animation:lunar-rim 36s ease-in-out infinite;pointer-events:none}
.lunar-portal:hover .lunar-body,.lunar-portal:focus-visible .lunar-body{box-shadow:inset -8px -4px 14px #030d19bb,inset 1px 1px 2px #eafaff,0 0 20px #b1e6ff88,0 0 55px #68baff44}
.lunar-portal:focus-visible{outline:1px solid #bddfff77;outline-offset:1px}
/* One quiet breath per minute, shared by the surface, aura and rim. */
.lunar-body,.lunar-aura,.lunar-glint{animation-duration:60s}
.arena .lunar-portal{transition:opacity 1.25s ease,filter 1.1s ease,transform 1.1s ease,visibility 0s;transform:translateY(0) scale(1);filter:blur(0)}
.is-opening .lunar-portal,.opened .lunar-portal,.is-loading .lunar-portal{opacity:0;filter:blur(5px);transform:translateY(-5px) scale(.96);pointer-events:none;visibility:hidden;transition:opacity .9s ease,filter .9s ease,transform .9s ease,visibility 0s .9s}
.lunar-portal.still *{animation-play-state:paused}
.lunar-portal.still{transition:opacity .18s ease,visibility 0s .18s;transform:none;filter:none}
.lunar-portal.still .lunar-body{animation:none;filter:brightness(.85);opacity:.35}
@keyframes lunar-breath{0%,100%{filter:brightness(.85);opacity:.28}50%{filter:brightness(.85);opacity:.8}}
@keyframes lunar-aura{0%,100%{opacity:.12;transform:scale(.95)}50%{opacity:.38;transform:scale(1.04)}}
@keyframes lunar-rim{0%,100%{transform:rotate(-25deg);opacity:.06}50%{transform:rotate(-25deg);opacity:.12}}
@media(max-width:850px){.arena .lunar-portal{width:74px;height:74px;right:calc(18% + 18px);top:calc(1% + 18px)}.lunar-body{width:46px;height:46px}.lunar-glint{width:49px;height:49px}.lunar-aura{inset:-18px}}
@media(max-width:850px){.lunar-portal::before{width:46px;height:46px}}
@media(prefers-reduced-motion:reduce){.lunar-portal *{animation:none!important}.lunar-body{filter:brightness(.85);opacity:.35}.lunar-aura{opacity:.2}.lunar-glint{opacity:.08}.arena .lunar-portal{transform:none;filter:none}}
