.portal-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative}.portal-ring{width:min(46vw,320px);aspect-ratio:1;position:relative;z-index:2;margin-bottom:2.5rem;opacity:.21;transition:opacity .3s ease}.portal-ring__hex{position:absolute;inset:0;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);transition:transform .3s ease,opacity .3s ease}.portal-ring__hex--orange{inset:-8px;background:rgba(222,85,0,0.35);opacity:.7;filter:drop-shadow(0 0 8px rgba(222,85,0,0.45))}.portal-ring__hex--peach{inset:-3px;background:rgba(255,203,148,0.3);opacity:.75;filter:drop-shadow(0 0 6px rgba(255,203,148,0.4))}.portal-ring__hex--cyan{inset:0;background:rgba(44,211,245,0.22);box-shadow:inset 0 0 0 2px rgba(44,211,245,0.7),inset 0 0 40px rgba(0,0,0,0.5);filter:drop-shadow(0 0 10px rgba(44,211,245,0.5))}.portal-ring__hex--core{inset:16%;background:radial-gradient(ellipse at 45% 40%,rgba(44,211,245,0.18) 0,rgba(0,0,0,0.92) 55%,black 100%);box-shadow:inset 0 0 0 1.5px rgba(44,211,245,0.4),inset 0 0 30px rgba(0,0,0,0.85)}.portal-ring__hex--inner{inset:28%;background:transparent;box-shadow:inset 0 0 0 1.5px rgba(222,85,0,0.6);opacity:.85}.portal-ring__bar{position:absolute;left:14%;right:14%;height:2px;background:linear-gradient(90deg,transparent 0,#2cd3f5 18%,#ffcb94 50%,#de5500 82%,transparent 100%);opacity:.55;pointer-events:none;transition:opacity .3s ease,height .3s ease}.portal-ring__bar--top{top:30%}.portal-ring__bar--mid{top:50%;height:1.5px;opacity:.4}.portal-ring__bar--bottom{top:70%}.portal-ring__marker{position:absolute;top:50%;left:50%;width:16%;height:16%;transform:translate(-50%,-50%)}.portal-ring__marker::before,.portal-ring__marker::after{content:"";position:absolute;top:50%;left:50%;background:#2cd3f5;box-shadow:0 0 8px rgba(44,211,245,0.77)}.portal-ring__marker::before{width:100%;height:2px;transform:translate(-50%,-50%)}.portal-ring__marker::after{width:2px;height:100%;transform:translate(-50%,-50%)}.portal-ring__pixel{position:absolute;top:50%;left:50%;width:6px;height:6px;transform:translate(-50%,-50%);background:#de5500;box-shadow:0 0 10px #de5500;transition:transform .3s ease,box-shadow .3s ease}.portal-wrap:has(.portal-enter:hover) .portal-ring{opacity:.77}.portal-wrap:has(.portal-enter:hover) .portal-ring__hex--orange{opacity:.9;transform:translate(-6px,3px)}.portal-wrap:has(.portal-enter:hover) .portal-ring__hex--peach{opacity:.95;transform:translate(5px,-4px)}.portal-wrap:has(.portal-enter:hover) .portal-ring__hex--cyan{filter:drop-shadow(0 0 16px rgba(44,211,245,0.7))}.portal-wrap:has(.portal-enter:hover) .portal-ring__hex--inner{opacity:1;transform:scale(1.04)}.portal-wrap:has(.portal-enter:hover) .portal-ring__bar{opacity:.9;height:3px}.portal-wrap:has(.portal-enter:hover) .portal-ring__pixel{transform:translate(-50%,-50%) scale(1.4);box-shadow:0 0 16px #de5500}.portal-title{color:#de5500;text-shadow:0 0 24px rgba(222,84,0,0.77),0 0 48px rgba(222,84,0,0.21);font-size:clamp(1.1rem,4vw,2rem);transform:rotate(-2deg) skewX(-3deg);z-index:2;text-align:center}.portal-sub{color:rgba(255,255,255,0.77);font-size:.72rem;letter-spacing:.28em;text-transform:uppercase;margin:1.5rem 0 3rem;transform:rotate(1deg);z-index:2}.portal-enter{z-index:2;background:transparent;border:1px solid rgba(222,84,0,0.77);color:#de5500;font-family:"Press Start 2P",cursive !important;font-size:.62rem;letter-spacing:.08em;padding:.9rem 1.8rem;transform:rotate(-1deg);transition:.3s}.portal-enter:hover,.portal-enter:focus{background:#de5500;color:black;box-shadow:0 0 32px rgba(222,84,0,0.77);transform:rotate(-1deg) scale(1.05)}.portal-enter--secondary{margin-top:1rem;font-size:.52rem;padding:.7rem 1.4rem;border-color:rgba(44,211,245,0.77);color:#2cd3f5}.portal-enter--secondary:hover,.portal-enter--secondary:focus{background:#2cd3f5;color:black;box-shadow:0 0 32px rgba(44,211,245,0.77)}.portal-hint{position:absolute;bottom:1.5rem;font-size:.6rem;letter-spacing:.1em;color:rgba(255,255,255,0.77);z-index:2}