/* Auronis Phoenix Experience — visuals and interaction */
:root{--my2-flame:#e24b32;--my2-ember:#f77d36;--my2-royal-gold:#f3c97e;--my2-gold-edge:#9d5d31}
.my2-flag{display:inline-block!important;flex:0 0 auto;width:25px!important;height:17px!important;max-width:none!important;object-fit:cover;border:1px solid rgba(255,223,159,.4);border-radius:2px;box-shadow:0 1px 7px #0009}
.my2-language-button,.splash-language-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;min-height:39px!important;line-height:1!important;white-space:nowrap}
.my2-language-button .my2-lang-chevron{margin-left:5px;color:#e1ae6c}.my2-language-options,.splash-language-menu{min-width:178px!important;overflow:hidden}
.my2-language-options a,.splash-language-menu a{display:flex!important;align-items:center;gap:11px;padding:12px 15px!important;transition:background .2s,color .2s}
.my2-language-options a:hover,.splash-language-menu a:hover{background:linear-gradient(90deg,#6b181e,#2b0a0d)!important;color:#ffe2a4!important}
.splash-language-toggle{min-width:103px!important;padding:10px 13px!important}.splash-language-toggle span{color:#d5a464}.splash-language-toggle b{font-size:11px!important}

/* Phoenix art on the splash page: real transparent character and original emblem. */
.my2-splash-stage{position:relative;isolation:isolate;width:min(100%,750px);height:335px;flex:none;margin:0 auto 2px;overflow:visible}
.my2-splash-stage-aura{position:absolute;z-index:-2;inset:8% 7% 0;background:radial-gradient(ellipse at 62% 50%,rgba(239,115,39,.36),transparent 57%),radial-gradient(ellipse at 40% 70%,rgba(211,28,28,.33),transparent 61%);filter:blur(22px);animation:my2FireBreath 5s ease-in-out infinite}
.my2-splash-stage-ring{position:absolute;z-index:-1;right:5%;top:1%;width:380px;max-width:64%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(248,177,78,.28);box-shadow:inset 0 0 42px rgba(255,133,45,.1),0 0 42px rgba(255,101,42,.08);animation:my2RingBreath 9s ease-in-out infinite}
.my2-splash-stage-ring:before,.my2-splash-stage-ring:after{content:'';position:absolute;border-radius:50%;inset:15px;border:1px dashed rgba(247,179,90,.21)}
.my2-splash-stage-ring:after{inset:37px;border-style:solid;border-color:rgba(248,141,66,.11)}
.my2-splash-emblem{position:absolute;z-index:3;left:1%;top:15px;width:64%;height:290px;object-fit:contain;filter:drop-shadow(0 12px 14px rgba(0,0,0,.7)) drop-shadow(0 0 18px rgba(245,128,41,.27));mix-blend-mode:screen;animation:my2EmblemFloat 6.5s ease-in-out infinite}
.my2-splash-shaman{position:absolute;z-index:2;right:1%;top:-30px;width:51%;height:400px;object-fit:contain;object-position:center top;filter:drop-shadow(0 0 26px rgba(255,139,48,.32)) drop-shadow(0 12px 26px #000b);animation:my2ShamanFloat 6s ease-in-out infinite}
.my2-splash-spark{position:absolute;z-index:5;left:39%;top:11%;color:#ffdf93;font-size:27px;text-shadow:0 0 18px #ffc05d;animation:my2Spark 3.8s ease-in-out infinite}
.splash-main{max-width:1000px!important;padding-top:5px!important}
.splash-eyebrow{margin-bottom:2px!important}
.splash-chapter{margin-top:-2px!important}
.splash-main h1{margin-top:10px!important}
.splash-launch{margin-top:15px!important}
.splash-primary-actions{margin-top:16px!important}
.splash-secondary-actions{margin-top:14px!important}

/* Replace the old rectangular banner with an animated, layered stage. */
.my2-body .my2-game-hero{background:linear-gradient(90deg,rgba(18,3,6,.96),rgba(34,5,9,.85) 42%,rgba(40,8,10,.4) 100%),url('../images/cristallina-world.png') center 53%/cover no-repeat!important}
.my2-body .my2-game-hero-inner{min-height:485px!important;grid-template-columns:minmax(0,1fr) minmax(0,1.07fr)!important}
.my2-body .my2-game-hero-copy{padding:55px 0 62px}
.my2-body .my2-game-hero-image.my2-phoenix-stage{position:relative;width:min(100%,650px);max-width:650px;height:465px;overflow:visible;isolation:isolate;filter:none;justify-self:end}
.my2-phoenix-stage:before{content:'';position:absolute;z-index:-1;inset:7% 3%;background:radial-gradient(ellipse at 55% 55%,rgba(252,114,35,.26),transparent 62%);filter:blur(27px)}
.my2-stage-orbit{position:absolute;z-index:0;right:5%;top:6%;width:74%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,192,100,.22);box-shadow:0 0 50px rgba(247,88,24,.1),inset 0 0 45px rgba(250,118,47,.09);animation:my2RingBreath 8s ease-in-out infinite}
.my2-stage-orbit:after{content:'';position:absolute;inset:19px;border-radius:50%;border:1px dashed rgba(255,200,109,.18)}
.my2-stage-fire{position:absolute;z-index:0;right:2%;bottom:4%;width:70%;height:36%;background:radial-gradient(ellipse at 50% 80%,rgba(255,103,34,.38),transparent 70%);filter:blur(20px);animation:my2FireBreath 5s ease-in-out infinite}
.my2-body .my2-game-hero-image img.my2-stage-logo{position:absolute;z-index:3;left:-6%;top:19%;width:72%!important;height:61%;object-fit:contain;max-width:none!important;mask-image:none!important;-webkit-mask-image:none!important;mix-blend-mode:screen;filter:drop-shadow(0 0 16px rgba(241,119,48,.27)) drop-shadow(0 10px 20px #0008);animation:my2EmblemFloat 7s ease-in-out infinite}
.my2-body .my2-game-hero-image img.my2-stage-character{position:absolute;z-index:2;right:-5%;top:0;width:67%!important;height:105%;object-fit:contain;object-position:center top;max-width:none!important;mask-image:none!important;-webkit-mask-image:none!important;filter:drop-shadow(0 0 21px rgba(252,137,46,.26)) drop-shadow(0 17px 24px #000a);animation:my2ShamanFloat 6s ease-in-out infinite}
.my2-stage-glint{position:absolute;z-index:4;left:28%;top:21%;width:8px;height:8px;border-radius:50%;background:#fff6cd;box-shadow:0 0 14px 5px #ffca73,0 0 34px 14px #ff743b88;animation:my2Spark 4s ease-in-out infinite}

/* Gold/red enchanted buttons and navigation tiles. */
.my2-body .my2-button,.my2-body .my2-header-register,.my2-body .my2-realm-join,.my2-body .my2-portal-shortcuts>a,.splash-enter{isolation:isolate;overflow:hidden;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,border-color .3s ease,filter .3s ease!important}
.my2-body .my2-button:after,.my2-body .my2-header-register:after,.my2-body .my2-realm-join:after,.my2-body .my2-portal-shortcuts>a:after,.splash-enter:after{content:'';position:absolute;z-index:0;inset:-70% auto -70% -50%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,224,.22),transparent);transform:skewX(-20deg) translateX(-300%);transition:transform .7s ease;pointer-events:none}
.my2-body .my2-button:hover:after,.my2-body .my2-header-register:hover:after,.my2-body .my2-realm-join:hover:after,.my2-body .my2-portal-shortcuts>a:hover:after,.splash-enter:hover:after{transform:skewX(-20deg) translateX(1100%)}
.my2-body .my2-button:hover,.my2-body .my2-header-register:hover,.my2-body .my2-portal-shortcuts>a:hover,.splash-enter:hover{transform:translateY(-4px)!important;box-shadow:0 0 0 1px rgba(255,208,130,.35),0 15px 40px #000a,0 0 28px rgba(244,101,44,.32)!important}
.my2-body .my2-portal-shortcuts>a{position:relative!important;min-height:100px!important;background:linear-gradient(135deg,#521019,#26080e 55%,#150609)!important;border:1px solid rgba(240,181,94,.62)!important;border-radius:2px;box-shadow:inset 0 1px rgba(255,217,152,.11),0 12px 35px #0009!important}
.my2-body .my2-portal-shortcuts>a:before{content:'';position:absolute;pointer-events:none;inset:5px;border:1px solid rgba(233,162,90,.18)}
.my2-body .my2-portal-shortcuts>a strong{color:#ffe0a2!important}.my2-body .my2-portal-shortcuts>a b{color:#ffc879!important;transition:transform .25s}.my2-body .my2-portal-shortcuts>a:hover b{transform:translate(4px,-4px)}
.my2-body .my2-shortcut-icon{width:45px;height:45px;display:grid;place-items:center;color:#f8c16e!important;text-shadow:0 0 17px #e55939;font-size:31px!important;animation:my2IconPulse 4s ease-in-out infinite}
.my2-body .my2-button-primary,.splash-enter{background:linear-gradient(135deg,#ffe3a2 0%,#b86d32 44%,#ffd18c 76%,#e8a753)!important;border:1px solid #ffe0a0!important;color:#2a090b!important}
.my2-body .my2-button-outline{border:1px solid rgba(247,191,110,.7)!important;background:linear-gradient(130deg,#5c121c,#1a0609)!important}
.my2-body .my2-panel button.btn,.my2-body .my2-panel input[type=submit],.my2-body .my2-panel .btn{position:relative;transition:filter .25s,transform .25s,box-shadow .25s!important;border-radius:2px!important}
.my2-body .my2-panel button.btn:hover,.my2-body .my2-panel input[type=submit]:hover,.my2-body .my2-panel .btn:hover{filter:brightness(1.14);transform:translateY(-2px);box-shadow:0 0 20px rgba(246,161,81,.24)}
.splash-secondary-actions a{position:relative;padding:7px 2px;transition:color .25s,text-shadow .25s}.splash-secondary-actions a:hover{color:#ffdb96!important;text-shadow:0 0 13px rgba(255,181,85,.7)}

/* Ranking — class portraits instead of invalid empire icon URLs. */
.my2-body .my2-rank-player{display:flex;align-items:center;gap:9px;min-width:0;text-align:left}
.my2-body img.my2-class-avatar,.my2-body .my2-class-fallback{width:40px!important;height:40px!important;max-width:none!important;flex:0 0 40px;object-fit:cover;border:1px solid #b37b4c;border-radius:7px;background:linear-gradient(150deg,#4d1820,#1b0609);box-shadow:0 0 0 2px #2d0b0c,0 0 10px #bd63262e}
.my2-body .my2-class-fallback{display:grid;place-items:center;color:#edba73}
.my2-body .my2-rank-player strong{display:block;font-size:12px!important;color:#f6d7a8!important;overflow:hidden;text-overflow:ellipsis;max-width:145px}
.my2-body .my2-rank-player small{display:block;font-size:10px;color:#bb927a!important;margin-top:3px;font-weight:400}
.my2-body .my2-empire-name{color:#e4ba86;font-size:11px;white-space:nowrap}
.my2-body img.my2-empire-icon{width:29px!important;height:29px!important;max-width:29px!important;object-fit:cover;border:1px solid #a76b40;border-radius:50%;vertical-align:middle}
.my2-body .n2-rank-table td{vertical-align:middle!important}.my2-body .my2-ranking-widget .n2-rank-table{table-layout:auto!important}.my2-body .my2-ranking-widget .n2-rank-table td:nth-child(2){min-width:120px}

/* Loading sequence, displayed on first visit of the tab. */
.my2-loader{position:fixed;inset:0;z-index:99999;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at 51% 45%,#541219 0%,#1c060b 45%,#070205 90%);color:#ffdfa3;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .65s ease,visibility .65s ease;overflow:hidden}
.my2-loader:before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(115deg,transparent 0 130px,rgba(249,158,73,.035) 131px 132px),radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.6))}
html.my2-loading-active .my2-loader{opacity:1;visibility:visible;pointer-events:auto}
html.my2-loading-active body{overflow:hidden!important}
.my2-loader-art{width:min(700px,96vw);height:360px;position:relative;isolation:isolate;flex:0 0 auto}
.my2-loader-halo{position:absolute;z-index:-1;inset:0 15%;border-radius:50%;background:radial-gradient(ellipse at 62% 50%,rgba(253,139,42,.27),transparent 65%);filter:blur(23px);animation:my2FireBreath 4s ease-in-out infinite}
.my2-loader-logo{position:absolute;left:2%;top:13%;width:67%;height:75%;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 20px #f7913c66);animation:my2EmblemFloat 4s ease-in-out infinite}
.my2-loader-shaman{position:absolute;right:2%;top:-9%;width:49%;height:110%;object-fit:contain;object-position:center top;filter:drop-shadow(0 0 23px #f38d3777);animation:my2ShamanFloat 4.5s ease-in-out infinite}
.my2-loader-caption{margin-top:14px;font:800 11px Arial,sans-serif;letter-spacing:.32em;text-align:center;margin-top:0;text-shadow:0 0 18px #f1a35d55}.my2-loader-caption span{color:#ef753b;padding:0 8px}
.my2-loader-track{position:relative;margin-top:22px;width:min(315px,78vw);height:4px;background:#2c0b10;border:1px solid rgba(255,189,94,.44);box-shadow:0 0 15px #b12c2366;overflow:hidden}
.my2-loader-track>span{display:block;height:100%;width:0;background:linear-gradient(90deg,#a02a26,#e39b50,#fff0ba);box-shadow:0 0 17px #fbb75a;animation:my2LoadFill 2.5s cubic-bezier(.17,.8,.3,1) forwards}
.my2-loader-message{font:800 9px Arial,sans-serif;letter-spacing:.32em;color:#b78a6c;margin:17px 0 0}
.my2-loader-embers{position:absolute;inset:0;background-image:radial-gradient(circle,#f9bc6a 1px,transparent 2px),radial-gradient(circle,#e85a3b 1px,transparent 2px);background-size:91px 143px,163px 97px;opacity:.17;animation:my2EmbersDrift 15s linear infinite}

@keyframes my2FireBreath{0%,100%{opacity:.55;transform:scale(.96)}50%{opacity:1;transform:scale(1.07)}}
@keyframes my2RingBreath{0%,100%{opacity:.42;transform:rotate(0deg) scale(.98)}50%{opacity:.92;transform:rotate(5deg) scale(1.03)}}
@keyframes my2EmblemFloat{0%,100%{transform:translateY(3px) scale(.99);filter:drop-shadow(0 7px 15px #0008) drop-shadow(0 0 12px #ec783d55)}50%{transform:translateY(-10px) scale(1.03);filter:drop-shadow(0 13px 22px #000a) drop-shadow(0 0 27px #fbb45a99)}}
@keyframes my2ShamanFloat{0%,100%{transform:translateY(7px) rotate(-.6deg)}50%{transform:translateY(-11px) rotate(.6deg)}}
@keyframes my2Spark{0%,100%{opacity:.1;transform:scale(.55) rotate(0deg)}45%{opacity:1;transform:scale(1.3) rotate(75deg)}60%{opacity:.75;transform:scale(.9) rotate(110deg)}}
@keyframes my2IconPulse{0%,100%{filter:drop-shadow(0 0 2px #ec733755)}50%{filter:drop-shadow(0 0 12px #eeb86b99)}}
@keyframes my2LoadFill{0%{width:0}40%{width:55%}72%{width:82%}100%{width:100%}}
@keyframes my2EmbersDrift{to{background-position:20px -210px,-40px -180px}}

@media(max-height:790px) and (min-width:801px){.my2-splash-stage{height:265px;width:min(100%,640px)}.my2-splash-emblem{height:240px}.my2-splash-shaman{height:335px;top:-30px}.splash-main h1{font-size:clamp(29px,3.5vw,45px)!important}.splash-launch{margin-top:8px!important}}
@media(max-width:900px){.my2-body .my2-game-hero-inner{grid-template-columns:1fr 1fr!important}.my2-body .my2-game-hero-image.my2-phoenix-stage{height:395px}.my2-body .my2-game-hero-image img.my2-stage-logo{left:-18%;width:90%!important}.my2-body .my2-game-hero-image img.my2-stage-character{right:-9%;width:76%!important}}
@media(max-width:650px){
 .my2-splash-stage{width:min(100%,510px);height:258px;margin:8px auto 8px;overflow:clip}.my2-splash-emblem{width:71%;height:218px;left:-7%;top:24px}.my2-splash-shaman{width:65%;height:295px;right:-10%;top:-20px}.my2-splash-stage-ring{right:-2%;width:77%;top:0}.my2-splash-spark{left:29%}.splash-main{padding-top:8px!important}.splash-main h1{font-size:clamp(27px,7vw,37px)!important}.splash-subtitle{font-size:12px!important}.splash-language-toggle{min-width:94px!important}
 .my2-body .my2-game-hero{min-height:530px!important}.my2-body .my2-game-hero-inner{display:block!important;min-height:530px!important}.my2-body .my2-game-hero-copy{padding:65px 0 165px!important;position:relative;z-index:4}.my2-body .my2-game-hero-copy p{max-width:315px}.my2-body .my2-game-hero-image.my2-phoenix-stage{position:absolute!important;right:-22px!important;top:135px!important;width:100%!important;height:390px!important;opacity:.47!important;pointer-events:none;z-index:1}.my2-body .my2-game-hero-image img.my2-stage-logo{left:-8%;top:25%;width:78%!important}.my2-body .my2-game-hero-image img.my2-stage-character{right:-4%;width:70%!important}.my2-body .my2-portal-shortcuts>a{min-height:78px!important}
 .my2-loader-art{height:270px;width:min(100vw,480px)}.my2-loader-logo{left:-2%;width:75%}.my2-loader-shaman{right:-6%;width:59%}.my2-loader-caption{font-size:9px;letter-spacing:.17em}
}
@media(max-width:390px){.my2-splash-stage{height:222px}.my2-splash-emblem{height:192px}.my2-splash-shaman{height:254px}.splash-main h1{font-size:27px!important}.my2-loader-art{height:235px}}
@media(prefers-reduced-motion:reduce){.my2-splash-stage *, .my2-phoenix-stage *, .my2-loader *, .my2-shortcut-icon{animation:none!important}.my2-body .my2-button,.my2-body .my2-portal-shortcuts>a,.splash-enter{transition:none!important}}
