/* A short, native opening sequence. Content remains available without JavaScript. */
.hrj-intro[hidden]{display:none}.hrj-intro{position:fixed;inset:0;z-index:10000;overflow:hidden;background:#080913;color:#eef1fa;isolation:isolate;font-family:inherit;opacity:0;pointer-events:none}.intro-pending .hrj-intro{display:block;opacity:1;pointer-events:auto;animation:intro-safety 3.6s forwards}.intro-pending{overflow:hidden}.hrj-intro.is-leaving{opacity:0;transform:scale(1.055);filter:blur(8px);transition:opacity .55s ease,transform .7s cubic-bezier(.2,.7,.2,1),filter .55s ease;pointer-events:none}.hrj-intro canvas,.intro-grain{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hrj-intro canvas{opacity:.8}.intro-grain{background:radial-gradient(ellipse at 25% 55%,#6854be1c,transparent 55%),radial-gradient(ellipse at 80% 35%,#2eafb719,transparent 50%);box-shadow:inset 0 0 180px #060611}.intro-top,.intro-bottom{position:absolute;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;gap:22px;font-family:monospace;font-size:10px;letter-spacing:1.7px;color:#979bb6;z-index:5}.intro-top{top:30px}.intro-bottom{bottom:35px}.intro-monogram{color:#a5ecf4;font-size:27px;letter-spacing:-4px;font-weight:bold}.intro-top>span:nth-child(2){margin-right:auto;margin-left:20px}.intro-top button{padding:12px 17px;min-height:44px;border:1px solid #ffffff30;background:#10122099;color:#e8eafa;border-radius:30px;font-family:inherit;letter-spacing:.3px;cursor:pointer}.intro-top button:focus-visible{outline:2px solid #73e2f1;outline-offset:4px}.intro-stage{position:absolute;inset:10% 0 12%;perspective:1000px}.intro-title{position:absolute;top:40%;left:50%;width:90%;transform:translate(-50%,-50%);text-align:center;z-index:3;animation:intro-title-in 1.2s cubic-bezier(.16,1,.3,1) both .25s}.intro-kicker{color:#90e9f0;font-family:monospace;font-size:11px;letter-spacing:6px}.intro-title strong{display:block;font-size:clamp(65px,10vw,150px);font-weight:600;line-height:1;letter-spacing:-.075em;margin:22px 0 12px;text-shadow:0 15px 70px #0009}.intro-title strong span{display:inline-block;font-weight:300;color:#c8bcff;margin-left:20px}.intro-title p{font-size:clamp(18px,2vw,28px);font-weight:300;letter-spacing:1px;color:#bac1d6;margin:0}.intro-mascot{position:absolute;width:min(36vw,470px);left:50%;bottom:-23%;transform:translateX(-50%);opacity:.65;z-index:2;mask-image:linear-gradient(#000 55%,transparent 95%);animation:intro-mascot-in 1.8s cubic-bezier(.16,1,.3,1) both .5s}.intro-mascot img{width:100%;height:auto;filter:drop-shadow(0 0 30px #79baff32)}.intro-panel{position:absolute;width:250px;padding:20px;border:1px solid #96a9ef38;border-radius:14px;background:linear-gradient(135deg,#252039cc,#0c1527bb);box-shadow:0 25px 75px #0005,inset 0 1px #ffffff0c;backdrop-filter:blur(12px);z-index:4;animation:intro-panel-in 1.4s cubic-bezier(.16,1,.3,1) both .35s}.intro-panel-wave{left:7%;top:47%;transform:rotateY(15deg) rotateZ(-10deg)}.intro-panel-zone{right:6%;top:46%;transform:rotateY(-18deg) rotateZ(10deg);animation-delay:.55s}.intro-panel>span{font:9px monospace;letter-spacing:1.6px;color:#bab4e4}.intro-panel svg{width:100%;height:95px;margin-top:15px}.intro-panel p{font-size:10px;margin:8px 0 0;color:#b9bfd5}.intro-zone{position:relative;height:95px;display:flex;gap:10px;align-items:center;justify-content:center;margin-top:15px;background:linear-gradient(transparent 14%,#b0a0ff25 14%,#b0a0ff25 34%,transparent 34%,transparent 70%,#73e2f125 70%,#73e2f125 90%,transparent 90%)}.intro-zone i{position:relative;display:block;width:13px;height:30px;background:#73e2f1;box-shadow:0 -11px 0 -6px #73e2f1,0 11px 0 -6px #73e2f1}.intro-zone i:nth-child(2){height:22px;transform:translateY(-10px);background:#b0a0ff}.intro-zone i:nth-child(3){height:36px;transform:translateY(5px)}.intro-zone i:nth-child(4){height:25px;transform:translateY(-12px)}.intro-zone i:nth-child(5){height:30px;transform:translateY(-24px);background:#b0a0ff}.intro-zone i:nth-child(6){height:20px;transform:translateY(-8px);background:#b0a0ff}.intro-zone i:nth-child(7){height:36px;transform:translateY(4px)}.intro-orbit{position:absolute;left:50%;top:53%;width:70vw;height:28vw;border:1px solid #8dc7e326;border-radius:50%;transform:translate(-50%,-50%) rotate(-19deg);box-shadow:0 0 35px #73e2f109}.intro-orbit-two{width:76vw;height:36vw;transform:translate(-50%,-50%) rotate(17deg);border-color:#ae8aff1c}.intro-progress{height:2px;background:#ffffff14;width:130px;overflow:hidden}.intro-progress i{display:block;height:100%;background:linear-gradient(90deg,#73e2f1,#b0a0ff);transform-origin:left;animation:intro-progress 2.7s linear both}.intro-replay{padding:0;background:none;border:0;color:inherit;cursor:pointer;font:inherit;min-height:44px}.intro-replay:hover{color:var(--cyan)}@keyframes intro-title-in{from{opacity:0;transform:translate(-50%,calc(-50% + 35px)) scale(.94);filter:blur(12px)}to{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}}@keyframes intro-panel-in{from{opacity:0;translate:0 65px;scale:.7}to{opacity:1;translate:0 0;scale:1}}@keyframes intro-mascot-in{from{opacity:0;translate:0 45px}to{opacity:.65;translate:0 0}}@keyframes intro-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes intro-safety{0%,88%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden;pointer-events:none}}@media(max-width:760px){.intro-top>span:nth-child(2){display:none}.intro-title{top:32%}.intro-title strong{font-size:clamp(56px,12vw,90px)}.intro-title strong span{margin-left:12px}.intro-panel{width:190px;padding:16px}.intro-panel-wave{left:-35px;top:54%;transform:rotate(-12deg);opacity:.85}.intro-panel-zone{right:-38px;top:60%;transform:rotate(12deg)}.intro-mascot{width:66vw;bottom:-14%}.intro-kicker{font-size:9px;letter-spacing:4px}.intro-bottom{bottom:22px;font-size:8px;letter-spacing:.8px}.intro-bottom>span:last-child{display:none}.intro-bottom>span:first-child{max-width:210px;line-height:1.7}.intro-progress{width:70px}.intro-orbit{width:120vw;height:65vw}.intro-orbit-two{width:130vw;height:80vw}}@media(prefers-reduced-motion:reduce){.intro-pending .hrj-intro{display:none}.intro-pending{overflow:auto}.hrj-intro *{animation:none!important;transition:none!important}}@media(max-height:520px){.intro-mascot{display:none}.intro-panel{top:35%;scale:.7}.intro-title{top:43%}.intro-top{top:10px}.intro-bottom{bottom:10px}}
