@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;800&family=Barlow:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--orange:#ff515c;--text:#f6f2f2;--muted:#b9afb5}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:#09090d;color:var(--text);font-family:Barlow,Arial,sans-serif;display:flex;justify-content:center;align-items:center;padding:40px 24px 28px}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid #ff8991;outline-offset:6px}.ambience{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 50% 13%,#c52b3624,transparent 48%),radial-gradient(ellipse at 95% 95%,#5f152414,transparent 30%),linear-gradient(#09090de8,#09090df7),url('assets/reten.png') center/cover}.portal{width:100%;max-width:620px;text-align:center}.logo{display:inline-block}.logo img{display:block;width:136px;height:136px;object-fit:contain;filter:drop-shadow(0 0 30px #ef283d30);border-radius:16px}.season{color:#ff828a;font-size:9px;letter-spacing:2.8px;font-weight:600;margin:22px 0 16px}h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:68px;letter-spacing:3px;font-weight:800;line-height:1;margin:0 0 12px}h1 span{color:var(--orange)}.subtitle{font-size:17px;color:#d2c5ca;margin:0}.edition{font-size:10px;font-weight:600;letter-spacing:1.5px;color:var(--muted);margin:20px 0 0}.edition span{color:#75404c;margin:0 8px}.connection{margin-top:44px}h2{font-size:19px;font-weight:600;margin:0 0 17px;color:#e8dce1}.address-box{display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left;padding:23px 25px;border:1px solid #63313f80;background:#141218d9;border-radius:7px}.address{display:flex;flex-direction:column;gap:8px}.label{font-size:8px;font-weight:600;letter-spacing:1.6px;color:#b9afb5}.address strong{font-size:25px;letter-spacing:1.3px;color:#f6f2f2}.port{font-size:11px;color:var(--muted)}.port span{margin:0 5px;color:#85404f}.port b{font-weight:500;color:#d2c5ca}button{display:flex;gap:10px;align-items:center;justify-content:center;flex-shrink:0;border:1px solid #85404f;color:#ffd8dd;background:transparent;padding:15px 18px;border-radius:5px;font-size:12px;font-weight:600;cursor:pointer}svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}button:hover{background:#ff515c15}#copy-status{height:16px;font-size:11px;color:#ff828a;margin:9px 0 12px}nav{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}nav a{display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid #4f2c38;background:#1c151d;padding:21px 14px;border-radius:6px;font-size:18px;font-weight:600;transition:background .18s,transform .18s}nav a>span{font-size:13px;opacity:.65}nav a:hover{background:#30202b;transform:translateY(-2px)}nav .store{background:var(--orange);color:#ffffff;border-color:var(--orange)}nav .store:hover{background:#e8414b}footer{margin-top:40px;border-top:1px solid #35252d;padding-top:22px;font-size:10px;color:#b9afb5}footer a:hover{color:var(--orange)}.footer-dot{margin:0 12px;color:#85404f}footer p{font-size:9px;line-height:1.7;color:#938690;margin:14px 0 0}.web{position:fixed;left:0;top:0;width:165px;height:165px;color:#b9b5a5;opacity:.09;pointer-events:none;stroke-width:.7}.pumpkin{position:fixed;bottom:20px;right:28px;width:85px;height:80px;opacity:.5;stroke:none;pointer-events:none;transform:rotate(9deg)}@media(max-width:700px){body{padding:30px 22px}.logo img{width:112px;height:112px}h1{font-size:58px}.portal{max-width:560px}.pumpkin{width:50px;height:48px;right:8px;bottom:8px;opacity:.25}.web{width:100px;height:100px}}@media(max-width:430px){body{padding:26px 18px}.season{font-size:8px;letter-spacing:2px}h1{font-size:54px}.subtitle{font-size:14px}.edition{font-size:8px}.connection{margin-top:32px}.address-box{padding:18px 15px;gap:10px}.address strong{font-size:20px}.port{font-size:9px}.label{font-size:7px;letter-spacing:1px}button{padding:13px 10px;font-size:11px;gap:7px}button svg{width:15px}nav{gap:9px}nav a{padding:18px 8px;font-size:15px;gap:7px}nav a>span{display:none}nav svg{width:17px}footer{margin-top:30px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.online-players{font-size:12px;color:var(--muted);margin:14px 0 0}.online-players[data-state=online]::before{content:'';display:inline-block;width:6px;height:6px;margin-right:8px;border-radius:50%;background:#9ebf77}.online-players[data-state=unknown]{color:#b9afb5}


.portal nav{grid-template-columns:repeat(2,minmax(0,1fr));}

.portal nav #discord-link{background:#293c51;border-color:#506580;color:#dce6f2}.portal nav #discord-link:hover{background:#344d68}

.halloween-web{position:fixed;top:0;pointer-events:none;z-index:1;color:#c2c4b6;opacity:.26;width:clamp(150px,23vw,330px);transform-origin:top left;animation:web-wind 12s ease-in-out infinite alternate}
.halloween-web svg{width:100%;height:auto;stroke-linecap:round}
.web-left{left:0}.web-right{right:0;transform:scaleX(-1);transform-origin:top right;animation-name:web-wind-right;width:clamp(180px,28vw,400px);opacity:.31}
@keyframes web-wind{to{transform:rotate(1.5deg) skewX(1deg)}}
@keyframes web-wind-right{to{transform:scaleX(-1) rotate(1.5deg) skewX(1deg)}}
.halloween-pumpkins{position:fixed;left:100px;bottom:10px;width:clamp(170px,22vw,290px);pointer-events:none;z-index:1}
.halloween-pumpkins svg{width:100%;height:auto;stroke:none;fill:none}
.portal{position:relative;z-index:2}
#halloween-sky{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:3}
.halloween-bat{position:absolute;top:0;left:0;width:28px;height:18px;color:#09090c}
.halloween-bat svg{width:100%;height:100%;fill:currentColor;stroke:#6e656a;stroke-width:.4;animation:bat-wings .24s ease-in-out infinite alternate}
@keyframes bat-wings{to{transform:scaleY(.45)}}
html.effects-off .halloween-web{animation:none}
html.effects-off #halloween-sky{display:none}
@media(max-width:800px){.halloween-web{opacity:.17;width:140px}.web-right{width:180px}.halloween-pumpkins{position:relative;left:auto;bottom:auto;margin:5px auto 55px;width:180px}body:has(.halloween-pumpkins){flex-direction:column}}
@media(prefers-reduced-motion:reduce){.halloween-web,.halloween-bat svg{animation:none}#halloween-sky{display:none}}