@font-face{font-family:Monocraft;src:url('/assets/Monocraft.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--black:#070809;--panel:#111316;--raised:#191c21;--line:#292d34;--white:#eef1f6;--muted:#949ca9;--blue:#8cbbff}
*{box-sizing:border-box}
body{margin:0;background:var(--black);color:var(--white);font:16px/1.75 Monocraft,monospace;-webkit-font-smoothing:antialiased}
body::before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 550px 280px at 50% 12%,#101a2a55,transparent);z-index:-1}
main{width:min(900px,calc(100% - 48px));margin:0 auto;padding:72px 0 32px}
.hero{position:relative;text-align:center;margin:0 0 36px}
.logo{display:block;width:320px;height:119px;object-fit:cover;max-width:80%;margin:0 auto 25px;image-rendering:pixelated;transition:filter .3s}
.logo:hover{filter:drop-shadow(0 0 15px #4078d32b)}
.intro{margin:0;font-size:16px;letter-spacing:0;color:#d6dce5}
.actions{display:grid;grid-template-columns:1.24fr 1fr .85fr;gap:12px}
.action{position:relative;overflow:hidden;min-height:60px;display:flex;align-items:center;gap:13px;padding:16px 19px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(160deg,#20232933,var(--panel));color:var(--white);text-decoration:none;box-shadow:inset 0 1px #ffffff09;transition:background .2s,border-color .2s,transform .2s,box-shadow .2s}
.action::after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#b7d6ff0c 50%,transparent 75%);transform:translateX(-120%);pointer-events:none}
.action:hover::after{animation:sheen .65s ease-out}
.action img{flex:none;image-rendering:pixelated;opacity:.9}
.action:not(.discord) img{filter:invert(1)}
.action>span:not(.arrow){font-weight:400;font-size:16px;white-space:nowrap}
.action .arrow{position:absolute;right:13px;top:9px;font-size:16px;color:#728298;transition:transform .2s,color .2s}
.action.primary{background:linear-gradient(150deg,#21344f,#152137);border-color:#385579}
.action:hover{transform:translateY(-2px);background:var(--raised);border-color:#6e829e;box-shadow:inset 0 1px #ffffff0c,0 5px 22px #0003}
.action.primary:hover{background:#203753;border-color:var(--blue)}
.action:hover .arrow{transform:translate(1px,-1px);color:var(--blue)}
.discord:hover{border-color:#9a9ee4}
.action:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:5px}
.requirements{display:flex;align-items:center;gap:13px;margin:17px auto 36px;padding:13px 17px;background:#101215;border:1px solid #1b1e24;border-radius:10px}
.setup-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;background:#191e26;border-radius:7px}
.setup-icon img{filter:invert(1);opacity:.7;image-rendering:pixelated}
.requirements strong{display:block;color:#cbd4e1;font-size:14px;font-weight:400}
.requirements p{margin:3px 0 0;color:var(--muted);font-size:14px;line-height:1.6}
.requirements b{font-weight:400;color:#b5cae9}
.release{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden;box-shadow:inset 0 1px #ffffff06}
.release::before{content:'';position:absolute;top:0;left:28px;width:27px;height:1px;background:#6d9cdc;box-shadow:0 0 12px #6d9cdc44}
.release-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 27px;border-bottom:1px solid #24272e}
.release-title{display:flex;align-items:center;gap:15px}
.release-symbol{width:44px;height:44px;display:grid;place-items:center;border:1px solid #304158;background:linear-gradient(135deg,#1d2c42,#131a24);border-radius:10px}
.release-symbol img{filter:invert(1);opacity:.8;image-rendering:pixelated;transition:transform .6s}
.release:hover .release-symbol img{transform:rotate(180deg)}
.eyebrow{font-size:14px;color:var(--muted)}
h1{font:22px/1.45 Monocraft,monospace;letter-spacing:-.8px;margin:5px 0 0}
.release-meta{display:flex;align-items:flex-end;flex-direction:column;gap:7px;font-size:14px;color:var(--muted)}
.channel{display:flex;align-items:center;gap:6px;font-size:12px;border-radius:5px;padding:2px 8px;color:#a9c9f7;background:#203048}
.channel::before{content:'';width:4px;height:4px;background:#a5cbff;box-shadow:0 0 6px #8cbbff88;animation:beacon 4s ease-in-out infinite}
.release-body{padding:20px 27px 24px;font-size:16px;color:#d4d9e2}
.release-body p{margin:0 0 10px}
.release-body .muted{color:var(--muted);margin:0}
.release-body ul{margin:7px 0 15px;padding-left:20px;list-style-type:square}
.release-body li{padding-left:4px;margin:7px 0}
.release-body li::marker{color:#637fa7;font-size:12px}
.release-body h2{font-size:16px;color:#edf2fb;margin:19px 0 7px;font-weight:400}
.release-body h2:first-child{margin-top:0}
#changelog{white-space:normal;overflow-wrap:anywhere}
#changelog.collapsed{max-height:214px;overflow:hidden;mask-image:linear-gradient(#000 0%,#000 65%,transparent 100%)}
.expand{width:100%;display:flex;justify-content:space-between;align-items:center;padding:13px 27px;background:#16191e;color:#b6c9e4;border:0;border-top:1px solid #24272e;font:14px Monocraft,monospace;cursor:pointer;transition:background .2s}
.expand:hover{background:#1d2532}
.expand[hidden],[hidden]{display:none!important}
.loading{animation:breathe 1.7s ease-in-out infinite}
footer{margin-top:25px;padding-top:20px;border-top:1px solid #1b1e24}
.footer-top{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14px}
footer a{color:#8c99ac;text-decoration:none}
footer a:hover{color:var(--blue)}
footer .wordmark{font:14px Monocraft,monospace;color:#abbad0}
.disclaimer{max-width:850px;margin:14px 0 0;color:#7e8794;font-size:14px;line-height:1.8}
.relics,.sparks{position:absolute;inset:0;pointer-events:none}
.relic{position:absolute;overflow:hidden;width:48px;height:48px;image-rendering:pixelated;opacity:.7;animation:drift 7s steps(7,end) infinite}
.relic img{display:block;width:100%;height:auto;image-rendering:pixelated;animation:sprite var(--cycle) steps(var(--frames)) infinite;will-change:transform}
.r1{left:80px;top:34px}.r2{left:184px;top:-21px;animation-delay:-2s}.r3{right:80px;top:34px;animation-delay:-4s}.r4{right:184px;top:-21px;animation-delay:-1s}
.sparks i{position:absolute;width:3px;height:3px;background:#708fb5;opacity:0;animation:spark 6s steps(6,end) infinite}
.sparks i:nth-child(1){left:16%;top:66%;animation-delay:-1s}.sparks i:nth-child(2){left:27%;top:39%;animation-delay:-3s}.sparks i:nth-child(3){left:37%;top:4%;animation-delay:-4s}.sparks i:nth-child(4){right:37%;top:8%;animation-delay:-2s}.sparks i:nth-child(5){right:24%;top:53%;animation-delay:-5s}.sparks i:nth-child(6){right:13%;top:74%}
@keyframes breathe{50%{opacity:.2}}
@keyframes beacon{50%{opacity:.45}}
@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes sprite{to{transform:translateY(-100%)}}
@keyframes spark{0%,100%{opacity:0;transform:translateY(0)}30%,65%{opacity:.5}80%{opacity:0;transform:translateY(-12px)}}
@keyframes sheen{to{transform:translateX(120%)}}
.hero,.actions,.requirements,.release{animation:enter .5s ease-out both}.actions{animation-delay:.07s}.requirements{animation-delay:.12s}.release{animation-delay:.17s}
@media(min-width:1500px){main{padding-top:100px}}
@media(max-width:750px){
 main{width:calc(100% - 32px);padding-top:42px}.actions{grid-template-columns:1fr}.action{min-height:58px;padding:15px 20px}.action>span:not(.arrow){font-size:16px}
 .logo{width:260px;height:97px}.hero{margin-bottom:29px}.requirements{margin-bottom:26px}.release-heading{padding:19px}.release-title{gap:10px}.release-symbol{width:36px;height:36px}.release-body{padding:18px 19px}.expand{padding:13px 19px}
 h1{font-size:17px}.release-meta{max-width:110px;text-align:right}.footer-top{gap:14px;align-items:flex-start}.footer-top a:last-child{max-width:180px;text-align:right}
 .relic{width:32px;height:32px;opacity:.5}.r1{left:6px;top:22px}.r2{left:42px;top:-19px}.r3{right:6px;top:22px}.r4{right:42px;top:-19px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
